@charset "UTF-8";

body{
	margin:0;
	font-family: 'メイリオ',
	'Hiragino Kaku Gothic Pro',sans-sefif;


}

/*サイト名*/
.site h1 a{
	color: #000000;
	text-decoration: none;
}

.site h1{
	margin:0;
	font-size: 30px;
}

.site img{
	border:none;
}




/*ヘッダー画像*/

.topimg {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}

/*キャッチコピー*/
.catch {
	margin:0;
	font-size: 33px;
}

/*ヘッダー画像に重ねる*/
.top{
	position: relative;
}

.catch{
	margin:0;
	padding: 35px;
	background-color: rgba(255,255,255,0.7);
	position: absolute;
	bottom: 7%;
	left: 3%
}


/*概要*/

.gaiyou a{
	display: block;
	background:linear-gradient(-35deg,#358be0,#015ab4);
	color: #ffffff;
	text-align: center;
	text-decoration: none;
}

.gaiyou a:hover {
	opacity: 0.8;
}


.gaiyou h1{
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 25px
}

.gaiyou p{
	margin-top: 0;
	margin-bottom: 0;
	padding-top:10px;
	padding-bottom: 10px;
	font-size:12px;
	background:linear-gradient(-35deg,#000000,#000000);
}




/*お知らせ*/

.news {
	padding: 20px;
	border:solid 5px #dddddd;
}

.news h1{
	margin-top: 0;
	margin-bottom: 5px;
	font-size: 18px;
	color:#666666;
}

.news ul {
	margin: 0;
	padding:0;
	list-style: none;
}

.news li a{
	display: block;
	padding: 5px;
	border-bottom: dotted 2px #dddddd;
	color:#000000;
	font-size: 14px;
	text-decoration: none;
}

.news li a:hover{
	background-color: #eeeeee
}

.news time {
	margin-right: 10px;
	color:#888888;
	font-weight: bold;
}

/*コピーライト*/
.copyright p {
	margin:0;
	color:#666666;
	font-size:14px;
}

/*BOX5をバーに*/
.box5 {
	padding-top: 15px;
	padding-bottom: 15px;
	background-color: #dddddd;
}



/*ボックスの左右*/
.boxA, .box4, .box5, .box6, .box7, .boxB{
	padding-left:15px;
	padding-right: 15px;
}

/*ボックスの上下*/
.boxA {
	padding-top: 20px;
	padding-bottom: 10px;
	background-color: #ffffff;
	/*background:linear-gradient(-35deg,#358be0,#015ab4);*/
	
}


.box4{
	padding-top: 20px;
	padding-bottom: 20px;
}

.box6{
	padding-top: 20px
}

.boxB{	
	padding-bottom: 20px;
}



/*box6の中央寄せ*/
.box6-1{
	margin:0 auto;
	width: 90%;
}
.box6-2{
	margin:0 auto;
	width: 90%;
}
.box6-3{
	margin:0 auto;
	width: 90%;
}


/*box7*/
table.info{
	width: 100%
}

table.info th{
	text-align: left;
	vertical-align: middle;
	width: 70px;
}

table.info td{
	text-align: left;
	vertical-align: middle;
}

.access{
	color: #ffffff;
	padding: 30px 60px 40px 60px;
}

.access h1{
	font-size: 20px ;
	border-bottom-width: 3px;
	border-bottom-style: dotted;
	border-bottom-color: #ffffff;
	margin-bottom: 0;
}


iframe{
	width: 100%;
	padding-top: 10px;
}




.boxB{
	background:linear-gradient(45deg, rgba(53,139,224,0.3),rgba(1,90,180,1)),
	url(../images/hede08.jpg);
	
}

/*BOXAの下に罫線*/
.boxA {
	margin-bottom: 15px;
	border-bottom: solid 1px #015ab4

}







/*############ 599px以下　###############*/
@media (max-width: 599px){

.catch {
	padding: 5px 10px;
	font-size: 16px
}

table.info {
	font-size: 15px

}

}


/*############ 767px以下　###############*/
@media (max-width: 767px){

/*トグルボタン*/

#menubtn{
	padding: 6px 12px;
	border:none;
	border-radius: 5px;
	background-color: #ffffff;
	position: absolute;
	top:25px;
	right: 15px;
	cursor:pointer;
}

#menubtn:hover{
	background-color:#ffffff;
}

#menubtn:focus{
	outline: none
}


#menubtn i{
	color:#036eb8;
	font-size: 43px
}

#menubtn span{
	display: inline-block;
	text-indent: -9999px
}

/*ナビ縦並び*/

#menu{
	display: none
}

.menu ul{
	margin:0;
	padding: 0;
	list-style: none
}

.menu li a{
	display: block;
	padding: 5px;
	color: #015ab4;
	font-size: 14px;
	text-decoration: none
}

.menu li a:hover{
	background-color: #eeeeee
}




}



/*############ 768px以上　###############*/
@media (min-width: 768px){

	/*トグルボタン*/
	#menubtn{
		display: none
	}

	/*ナビ*/
	.menu ul{
		margin:0;
		padding: 0;
		list-style: none
	}

	.menu li a{
		display: block;
		padding: 30px 15px;
		color: #015ab4;
		font-size: 14px;
		text-decoration: none;
	}

	.menu li a:hover{
		background-color:#eeeeee;
	}

	.menu ul :after{
		content: "";
		display: block;
		clear:both;
	}

	.menu li{
		float: left;
		width: auto;
	}



	.boxA:after{
		content: "";
		display:block;
		clear:both;
	}

	.box1{
		float: left;
		width: auto;
	
	}

	.box2{
		float: right;
		width: auto;
	}


	/*BOX6を横に並べる*/

	.box6:after{
		content: "";
		display: block;
		clear:both;
	}

	.box6-1{
		float: left;
		width: 32%;
		margin-right:2%;
	}

	.box6-2{
		float: left;
		width: 32%;
		margin-right:2%;
	}

	.box6-3{
		float: left;
		width: 32%
	}



	/*box7と8を並べる*/
	.boxB:after{
		content: "";
		display: block;
		clear: both;
	}
	.box7{
		float: left;
	
	}

	.box8{
		float: left;
	}

	


}


/*############ 1190px以上　###############*/
@media (min-width: 1190px){

/*全体の横幅を固定*/
.box3, .box4, .boxA-inner, .box5-inner, .box6, .boxB-inner{
	width: 1140px;
	margin-left:auto;
	margin-right: auto;
}


}