@charset "UTF-8";


/* -- slider ----------------------------------------------------------------*/
@media screen and (max-width: 767px) {

}
@media screen and (min-width: 768px) {
	#headline { background: url("../img/common/main_visual_pc.png") center center no-repeat; background-size: cover; height:500px; }
}
@media screen and (min-width: 768px) and (max-width: 960px) {
	#headline { background: url("../img/common/main_visual_pc.png") center center no-repeat; background-size: cover; height:365px; }
}
@media screen and (min-width: 961px) and (max-width: 1024px) {
	#headline { background: url("../img/common/main_visual_pc.png") center center no-repeat; background-size: cover; height:470px; }
}
@media screen and (min-width: 1025px) and (max-width: 2048px) {
	#headline { background: url("../img/common/main_visual_pc.png") center center no-repeat; background-size: cover; height:500px; }
}
@media screen and (min-width: 2049px) and (max-width: 2559px) {
	#headline { background: url("../img/common/main_visual_pc.png") center center no-repeat; background-size: cover; height:600px; }
}
@media screen and (min-width: 2560px) {
	#headline { background: url("../img/common/main_visual_pc.png") center center no-repeat; background-size: cover; height:650px; }
}

/* -- Structure [Index] -----------------------------------------------------*/
@media screen and (max-width: 767px) {
	#anch01 .in { margin: 2%; padding: 0px 0 0px; }
	#anch01 .mark { width: 30px; margin:-10px auto 0; }

	#anch02 {
	z-index: -1;
	position: relative;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#23acf5+0,b565ef+100 */
	background: #23acf5; /* Old browsers */
	background: -moz-linear-gradient(left,  #23acf5 0%, #b565ef 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #23acf5 0%,#b565ef 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #23acf5 0%,#b565ef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#23acf5', endColorstr='#b565ef',GradientType=1 ); /* IE6-9 */
	}
	#anch02 h2.subTtl { color: #fff; }
	#anch02 .suText { text-align: center; color: #fff; margin-bottom: 20px; font-size: 13px;  }
	#anch02 .in { margin: 0 1%; padding: 20px 4% 40px;  }
	#anch02 .mark { position: absolute; top: -10px; left: 0; right: 0px; width: 30px; margin:0px auto 0; }
	.sec_list { margin: 20px 0.5%;}
	.sec_list li { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px dotted #fff; }
	.sec_list li:last-child { margin-bottom: 0px; padding-bottom: 0px; border: none; }
	.sec_list li img { width: 40%; margin: 0 30% 10px; }
	.sec_list li h3 { color: #fff; font-size: 16px; text-align: center; }

	#anch03 .in { margin: 2%; padding: 0px 0 0px; }
	#anch03 .mark { width: 30px; margin:-10px auto 0; }
	#anch03 h2.subTtl { color: #233e6f; margin-bottom: 10px; font-size: 28px; }
	#anch03 .suText { text-align: center; color: #333; margin-bottom: 20px; font-size: 13px; }
	.rest_list li { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px dotted #dedede;}
	.rest_list li:nth-child(5) { margin-bottom: 0px; padding-bottom: 0px; border: none;}
	.reason_L { width: 26%; margin-right: 4%; float: left;}
	.reason_R { width: 70%; float: left;}
	.rest_list li h4 { background:#233e6f; color: #fff; font-family:'Roboto', sans-serif; font-weight:bold; font-size: 16px; margin-bottom: 10px; padding: 5px 0; text-align: center; }
	.rest_list li h3 { text-align: left; color: #233e6f; font-size: 18px; font-weight: bold; margin-bottom: 10px;  }
	/*.rest_list li h3 span { font-size: 13px; line-height: 1.4; }
	.rest_list li:nth-child(4) h3 { line-height: 1.0; }*/
	.rest_list li p { margin-bottom: 0px; }

	#anch04 {
	z-index: -1;
	position: relative;
	background: #f5f5f5;
	}
	#anch04 h2.subTtl { color: #333; font-size: 26px;  }
	#anch04 .suText { text-align: center; color: #333f; margin-bottom: 20px; font-size: 13px;  }
	#anch04 .in { margin: 0 1%; padding: 20px 4% 20px;  }
	#anch04 .mark { position: absolute; top: -10px; left: 0; right: 0px; width: 30px; margin:0px auto 0; }
	.four_list { margin: 20px 0 20px;}
	.four_list li { float: left; width: 25%; }
	.four_list li img { margin-bottom: 10px;  }
	.four_list li h3 { color: #333; font-size: 13px; text-align: center; }
}
@media screen and (min-width: 768px) and (max-width: 960px) {
	#anch03 .in { margin: 2%; padding: 0px 0 0px; }
	#anch03 .mark { width: 60px; margin:-20px auto 0; }
	#anch03 h2.subTtl { color: #233e6f; margin-bottom: 20px; }
	#anch03 .suText { text-align: center; color: #333; margin-bottom: 20px; font-size: 18px; }
	.rest_list li { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px dotted #dedede;}
	.rest_list li:nth-child(5) { margin-bottom: 0px; padding-bottom: 0px; border: none;}
	.reason_L { width: 16%; margin-right: 4%; float: left;}
	.reason_R { width: 80%; float: left;}
	.rest_list li h4 { background:#233e6f; color: #fff; font-family:'Roboto', sans-serif; font-weight:bold; font-size: 16px; margin-bottom: 20px; padding: 5px 0; text-align: center; }
	.rest_list li h3 { text-align: left; color: #233e6f; font-size: 20px; font-weight: bold; margin-bottom: 10px;  }
	.rest_list li h3 span { font-size: 13px; line-height: 1.4; }
	.rest_list li:nth-child(4) h3 { line-height: 1.0; }
	.rest_list li p { margin-bottom: 0px; }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
	#anch01 .in { margin: 0 1%; padding: 20px 0 40px; }
	#anch01 .mark { width: 60px; margin:-20px auto 0; }

	#anch02 {
		z-index: -1;
	position: relative;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#23acf5+0,b565ef+100 */
	background: #23acf5; /* Old browsers */
	background: -moz-linear-gradient(left,  #23acf5 0%, #b565ef 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #23acf5 0%,#b565ef 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #23acf5 0%,#b565ef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#23acf5', endColorstr='#b565ef',GradientType=1 ); /* IE6-9 */
	}
	#anch02 h2.subTtl { color: #fff; }
	#anch02 .suText { text-align: center; color: #fff; margin-bottom: 20px; font-size: 18px;  }
	#anch02 .in { margin: 0 1%; padding: 60px 0 40px;  }
	#anch02 .mark { position: absolute; top: -20px; left: 0; right: 0px; width: 60px; margin:0px auto 0; }
	.sec_list { margin: 20px 0.5%;}
	.sec_list li { float: left; width: 33%; }
	.sec_list li img { width: 50%; margin: 0 25% 20px; }
	.sec_list li h3 { color: #fff; font-size: 18px; text-align: center; }

	#anch04 {
	z-index: -1;
	position: relative;
	background: #f5f5f5;
	}
	#anch04 h2.subTtl { color: #333; }
	#anch04 .suText { text-align: center; color: #333; margin-bottom: 20px; font-size: 18px;  }
	#anch04 .in { margin: 0 1%; padding: 60px 0 40px;  }
	#anch04 .mark { position: absolute; top: -20px; left: 0; right: 0px; width: 60px; margin:0px auto 0; }
	.four_list { margin: 20px 0 20px;}
	.four_list li { float: left; width: 25%; }
	.four_list li img { width: 70%; margin: 0 15% 20px; }
	.four_list li h3 { color: #333; font-size: 18px; text-align: center; }
}
@media screen and (min-width: 960px) and (max-width: 1024px) {
	#anch03 .in { margin: 0 1%; padding: 20px 0 40px; }
	#anch03 .mark { width: 60px; margin:-20px auto 0; z-index: 10; }
	#anch03 h2.subTtl { color: #233e6f; margin-bottom: 20px; }
	#anch03 .suText { text-align: center; color: #333; margin-bottom: 40px; font-size: 18px; }
	.rest_list li { float: left; width: 18.4%; margin-right: 2%; }
	.rest_list li:nth-child(5) { margin-right: 0px;}
	.rest_list li h4 { background:#233e6f; color: #fff; font-family:'Roboto', sans-serif; font-weight:bold; font-size: 16px; margin-bottom: 20px; padding: 5px 0; text-align: center; }
	.rest_list li img { width: 70%; margin: 0 15% 20px; }
	.rest_list li h3 { text-align: center; color: #233e6f; font-size: 20px; font-weight: bold; margin-bottom: 20px;  }
	.rest_list li h3 span { font-size: 13px; line-height: 1.4; }
	.rest_list li:nth-child(4) h3 { line-height: 1.0; }
}
@media screen and (min-width: 1025px) {
	#anch01 .in { width: 1024px; margin: 0 auto; padding: 40px 0; }
	#anch01 .mark { width: 69px; margin:-20px auto 0; }
	
	#anch02 {
	z-index: -1;
	position: relative;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#23acf5+0,b565ef+100 */
	background: #23acf5; /* Old browsers */
	background: -moz-linear-gradient(left,  #23acf5 0%, #b565ef 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #23acf5 0%,#b565ef 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #23acf5 0%,#b565ef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#23acf5', endColorstr='#b565ef',GradientType=1 ); /* IE6-9 */
	}
	#anch02 h2.subTtl { color: #fff; }
	#anch02 .suText { text-align: center; color: #fff; margin-bottom: 40px; font-size: 18px;  }
	#anch02 .in { width: 1024px; margin: 0 auto; padding: 60px 0 40px;  }
	#anch02 .mark { position: absolute; top: -20px; left: 0; right: 0px; width: 69px; margin:0px auto 0; }
	.sec_list { margin: 20px 0.5%;}
	.sec_list li { float: left; width: 33%; }
	.sec_list li img { width: 60%; margin: 0 20% 20px; }
	.sec_list li h3 { color: #fff; font-size: 21px; text-align: center; }

	#anch03 .in { width: 1024px; margin: 0 auto; padding: 20px 0 40px; }
	#anch03 .mark { width: 69px; margin:-20px auto 0; z-index: 10; }
	#anch03 h2.subTtl { color: #233e6f; margin-bottom: 20px; }
	#anch03 .suText { text-align: center; color: #333; margin-bottom: 40px; font-size: 18px; }
	.rest_list li { float: left; width: 18.4%; margin-right: 2%; }
	.rest_list li:nth-child(5) { margin-right: 0px;}
	.rest_list li h4 { background:#233e6f; color: #fff; font-family:'Roboto', sans-serif; font-weight:bold; font-size: 16px; margin-bottom: 20px; padding: 5px 0; text-align: center; }
	.rest_list li img { width: 70%; margin: 0 15% 20px; }
	.rest_list li h3 { text-align: center; color: #233e6f; font-size: 20px; font-weight: bold; margin-bottom: 20px;  }
	.rest_list li h3 span { font-size: 13px; line-height: 1.4; }
	.rest_list li:nth-child(4) h3 { line-height: 1.0; }

	#anch04 {
	position: relative;
	background: #f5f5f5;
	}
	#anch04 h2.subTtl { color: #333; }
	#anch04 .suText { text-align: center; color: #333; margin-bottom: 40px; font-size: 18px;  }
	#anch04 .in { width: 1024px; margin: 0 auto; padding: 60px 0 40px;  }
	#anch04 .mark { position: absolute; top: -20px; left: 0; right: 0px; width: 69px; margin:0px auto 0; }
	.four_list { margin: 20px 0 20px;}
	.four_list li { float: left; width: 25%; }
	.four_list li img { width: 70%; margin: 0 15% 20px; }
	.four_list li h3 { color: #333; font-size: 18px; text-align: center; }
}

#anch05{
	position: relative;
}
#anch05 .mark { position: absolute; top: -20px; left: 0; right: 0px; width: 69px; margin:0px auto 0; }
#anch05 .in{
	 max-width: 1024px; margin: 0 auto; padding: 60px 0 40px; 
}
#anch05 h2.subTtl {
	margin-bottom: 20px; 
}
#anch05 .news_box{
	overflow-y: auto;
	height: 10em;
	border: 1px solid #233E6F;
	padding: 0.5em 1em;
}
#anch05 .news_box a{
	display:table;
	width:100%;
	margin-bottom:1em;
}
#anch05 .news_box a dt{
	display:table-cell;
	width:7em;
}
#anch05 .news_box a dd{
	display:table-cell;
}