/*---------- ページ全体 ----------*/

@media screen and (max-width:960px){

#wrap{
	width: 100%;
}

header h1 img{
	width: 100%;
	max-width: 360px;
}

#menu{
	justify-content: left;
}

}

@media screen and (min-width:960px){

#wrap{
	box-shadow:0px 0px 12px 2px #333333;
		-moz-box-shadow:0px 0px 12px 2px #333333;
		-webkit-box-shadow:0px 0px 12px 2px #333333;
	box-sizing: border-box;
	width: 960px;
}

header h1 img{
	width: 360px;
}

#menu{
	justify-content: center;
}

}

#wrap{
	background-color: #ffffff;
	box-sizing: border-box;
	margin: 0 auto;
	padding: 48px 32px 0 32px;
	min-height: 100%;
}

header, .content, footer{
	margin: 0 auto;
}

/*---------- ヘッダー ----------*/

header{
	
}

header h1{
	margin: 0 auto;
	text-align: center;
}

nav{
	margin: 20px 0;
}

#menu{
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
}

#menu li{
	margin: 8px 16px;
	list-style: none;
}

#menu li a{
	display: inline-block;
	box-sizing: border-box;
	color: #333333;
	font-size: 1.1rem;
	font-weight: bold;
	text-decoration: none;
}

#menu li a:link{
	padding-bottom: 3px;
}

#menu li a:visited{
	padding-bottom: 3px;
}

#menu li a:hover{
	border-bottom: 3px solid #222222;
	padding: 0;
}

#menu li a:active{
	border-bottom: 3px solid #222222;
	padding: 0;
}

#menu li span{
	display: inline-block;
	box-sizing: border-box;
	color: #333333;
	font-size: 1.1rem;
	font-weight: bold;
	border-bottom: 3px solid #222222;
}

/*---------- コンテンツ ----------*/

#wrap2{
	margin-top: 48px;
}

.content{
	
}

.content h2{
	border-bottom: 3px solid #333333;
	box-sizing: border-box;
	font-size: 1.6rem;
	font-weight: bold;
	margin-bottom: 1rem;
	padding: 4px;
}

.content h3{
	border-left: 7px solid #808080;
	font-size: 1.5rem;
	font-weight: bold;
	padding-left: 10px;
	margin-bottom: 1rem;
}

.button a{
	background-color: #333333;
	border-radius: 5px;
	box-sizing: border-box;
	display: inline-block;
	font-size: 1rem;
	font-weight: bold;
	margin: 16px 0;
	padding: 16px;
	text-align: center;
}

.button a:link{
	color: #ffffff;
	text-decoration: none;
}

.button a:visited{
	color: #ffffff;

}

.button a:hover{
	color: #ffffff;
	background-color: #555555;
}

.button a:active{
	color: #ffffff;
}

.left-th th{
	text-align: left;
}

/*---------- フッター ----------*/

footer{
	border-top: 1px solid #a9a9a9;
	font-size: 1rem;
	text-align: center;
	margin-top: 24px;
	padding: 10px 0 20px 0;
}

/*---------- フォント ----------*/

.b{
	font-weight: bold;
}

.u{
	text-decoration: underline;
}

.del{
	text-decoration: line-through;
}

.bu{
	font-weight: bold;
	text-decoration: underline;
}

.red{
	color: #ff0000;
}

/*---------- 一般設定 ----------*/

html{
	height: 100%;
}

body{
	background-color: #eeeeee;
	color: #333333;
	font-size: 1rem;
	line-height: 1.5;
	height: 100%;
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, h6{
	margin: 0;
	padding: 0;
}

p{
	margin: 0 0 1rem 0;
}

img{
	vertical-align: bottom;
}

hr{
	border: 1px solid #a9a9a9;
	margin: 16px 0;
}

table{
	border-collapse: collapse;
	border-spacing: 0;
	margin-bottom: 1.5rem;
	table-layout: fixed;
}

tr{

}

th, td{
	border: 1px solid #a9a9a9;
	padding: 12px;
	overflow-wrap : break-word;
}

th{
	background-color: #efefef;
}

td{

}

a:link {
	text-decoration:underline;
	/*--default color:#0000cd;--*/
	color:#0000cd; 
}
a:visited {
	text-decoration:underline; 
	color:#9400d3;
}
a:active {
	text-decoration:none;
	color:#ff7f50;
}
a:hover {
	text-decoration:none; 
	color:#ff7f50; 
}