@charset "utf-8";

/*	common
------------------------------------------------------------ */

body{
	width: 100%;
	margin: 0;
	padding: 0;
	font-feature-settings : "palt";
	overflow-x: hidden;
}

h1, h2{
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;}

h3, h4{
	line-height: 160%;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;	font-weight: normal;
}

p, ul, dl{
	line-height: 160%;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;  /* 追加 */
	transform: rotate(.03deg);
	font-size: 100%;
}


.img-center{
	text-align: center;
}

.img-right{
	padding: 0 0 5px 10px;
	float: right;
}

.img-left{
	padding: 5px 10px 5px 0;
	float: left;
}

.clear-right{
	clear: right;
}

.clear-left{
	clear: left;
}

.clear{
	clear: both;
}

.txt-center{
	text-align: center;
}

.txt-right{
	text-align: right;
}

.small{
	font-size: 65%;
}

.big{
	font-size: 120%;
}

.bold{
	font-weight: bold;
}

div.dotline{
	padding: 0;
	margin: 10px 20px 20px 20px;
	border-bottom: 1px dotted #ccc;
}

div.line{
	padding: 0;
	margin: 10px 20px 20px 20px;
	border-bottom: 1px solid #ccc;
}

a:hover img.opac{
	filter : alpha(opacity = 70);
	-moz-opacity : 0.70;
	opacity : 0.70;
}

.opac a:hover img{
	filter : alpha(opacity = 70);
	-moz-opacity : 0.70;
	opacity : 0.70;
}


img{
	width: 100%;
}


.space1{
	margin-left: 1em;
}

.space2{
	margin-left: 2em;
}

.i_block{
	display: inline-block;
}

/*　リンク　*/
a{
	text-decoration: none;
}
a:link{
	color: #303030;
	text-decoration: underline;
}
a:visited{
	color: #303030;
	text-decoration: underline;
}
a:hover{
	color: #666666;

}
a:active{
	color: #666666;
	text-decoration: underline;

}
	
a img{
	border: none;
}

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

.en{
	font-family: 'Saira Condensed', sans-serif;
	letter-spacing: 1px;
}

/*	main
------------------------------------------------------------ */

div#main{
	width: 100%;
	margin: 0 auto;
}

/* --- SP ---------- */
@media screen and (max-width: 740px) {

	.pc_contents{
		display: none;
	}

	p{
		font-size: 95%;
	}
}


/* --- PC ---------- */
@media screen and (min-width: 741px) {

	.sp_contents{
		display: none;
	}

	a[href^="tel:"] {
  		  pointer-events: none;
	}
}



/*	chapter00
------------------------------------------------------------ */
/* --- SP ---------- */
@media screen and (max-width: 740px) {
	#chapter00{
		background: #fff;
		width: 100%;
		background: url(../img-sp/main-bk.jpg) center top no-repeat;
		background-size: contain;
	}

	#chapter00 .chapter00-body{
		width: 96%;
		max-width: 1280px;
		margin: 0 auto;
	}

	#chapter00 .chapter00-body h1{
		font-size: 55%;
		line-height: 1.4;
		margin: 8px 0;
	}

	#chapter00 .chapter00-body .main-title{
		text-align: center;
	}

	#chapter00 .chapter00-body .main-title .en{
		font-size: 160%;
		color: #79b1c8;
		margin: 15px 0 0;
		line-height: 1;
		letter-spacing: 1px;
		position: relative;
		display: inline-block;
	}

	#chapter00 .chapter00-body .main-title .en::before{
		content: url(../img-sp/main-left.png);
		position: absolute;
		left: -50px;
		width: 20px;
	}

	#chapter00 .chapter00-body .main-title .en::after{
		content: url(../img-sp/main-right.png);
		position: absolute;
		right: -50px;
		width: 20px;

	}

	#chapter00 .chapter00-body .main-title .copy{
		font-size: 100%;
		color: #79b1c8;
		font-weight: bold;
		margin: 0;
		letter-spacing: 1px;
		line-height: 1;
	}

	#chapter00 .chapter00-body .main-title h2{
		font-size: 70%;
		color: #fff;
		background: #79b1c8;
		display: inline-block;
		padding: 2px 10px;
		box-sizing: border-box;
		letter-spacing: 1px;
		margin: 5px 0;
	}

	#chapter00 .chapter00-body .about-us{
		max-width: 1000px;
		width: 100%;
		margin: 170px auto 0;
		background: rgba(255, 255, 255, .9);
		box-sizing: border-box;
		padding: 20px 20px;
	}

	#chapter00 .chapter00-body .about-us .en{
		position: relative;
		text-align: center;
		font-size: 180%;
		color: #2b6e8e;
		margin: 0 0 -20px;
		top: -10px;
	}

	#chapter00 .chapter00-body .about-us .lead{
		letter-spacing: 1px;
		font-size: 85%;
		line-height: 1.4;
	}

	#chapter00 .chapter00-body .about-us .about-point{
		width: 100%;
	}

	#chapter00 .chapter00-body .about-us .about-point .box{
		max-width: 640px;
		width: 100%;
		margin: 8px 0;
	}

	#chapter00 .chapter00-body .about-us .bottom-text{
		letter-spacing: 1px;
		font-weight: bold;
		font-size: 100%;
		text-align: center;
	}

}


/* --- PC ---------- */
@media screen and (min-width: 741px) {
	#chapter00{
		background: #fff;
		width: 100%;
		background: url(../img/main-bk.jpg) center top no-repeat;
	}

	#chapter00 .chapter00-body{
		width: 96%;
		max-width: 1280px;
		margin: 0 auto;
		padding-bottom: 50px
	}

	#chapter00 .chapter00-body h1{
		font-size: 70%;
		margin: 8px 0;
	}

	#chapter00 .chapter00-body .main-title{
		text-align: center;
		margin-top: 50px;
	}

	#chapter00 .chapter00-body .main-title .en{
		font-size: 550%;
		color: #79b1c8;
		margin: 15px 0 8px;
		line-height: 1;
		letter-spacing: 2px;
		position: relative;
		display: inline-block;
	}

	#chapter00 .chapter00-body .main-title .en::before{
		content: url(../img/main-left.png);
		position: absolute;
		left: -50px;
		top: -50px;
	}

	#chapter00 .chapter00-body .main-title .en::after{
		content: url(../img/main-right.png);
		position: absolute;
		right: -50px;
		top: -50px;
	}

	#chapter00 .chapter00-body .main-title .copy{
		font-size: 140%;
		color: #79b1c8;
		font-weight: bold;
		margin: 0;
		letter-spacing: 2px;
	}

	#chapter00 .chapter00-body .main-title h2{
		font-size: 120%;
		color: #fff;
		background: #79b1c8;
		display: inline-block;
		padding: 5px 30px;
		box-sizing: border-box;
		letter-spacing: 2px;
	}

	#chapter00 .chapter00-body .about-us{
		max-width: 1000px;
		width: 100%;
		margin: 300px auto 0;
		background: rgba(255, 255, 255, .9);
		box-sizing: border-box;
		padding: 50px 120px;
	}

	#chapter00 .chapter00-body .about-us .en{
		position: relative;
		text-align: center;
		font-size: 400%;
		color: #2b6e8e;
		margin: 0 0 -90px;
		top: -90px;
	}

	#chapter00 .chapter00-body .about-us .lead{
		letter-spacing: 1.5px;
	}

	#chapter00 .chapter00-body .about-us .about-point{
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content:  space-between;
		width: 100%;
	}

	#chapter00 .chapter00-body .about-us .about-point .box{
		width: 31%;
	}

	#chapter00 .chapter00-body .about-us .bottom-text{
		letter-spacing: 1px;
		font-weight: bold;
		font-size: 120%;
		text-align: center;
	}


}

/*	chapter01
------------------------------------------------------------ */
/* --- SP ---------- */
@media screen and (max-width: 740px) {
	#chapter01{
		background: url(../img/merit-bk.jpg) center top repeat-y;
		padding: 30px 0;
	}

	#chapter01 .chapter01-body{
		max-width: 1280px;
		width: 90%;
		margin: 0 auto;
		color: #fff;
	}

	#chapter01 .chapter01-body .en{
		text-align: center;
		font-size: 280%;
		margin: 0;
		line-height: 1;
	}

	#chapter01 .chapter01-body h2{
		text-align: center;
		font-size: 90%;
		letter-spacing: 2px;
		margin: 0;
	}

	#chapter01 .chapter01-body .merit-title{
		width: 100%;
		text-align: center;
		border: 2px solid #fff;
		box-sizing: border-box;
		padding: 10px 5px;
		margin-top: 40px;
		position: relative;
	}

	#chapter01 .chapter01-body .merit-title h3{
		font-size: 100%;
		font-weight: bold;
		margin: 0;
		letter-spacing: 1px;
	}

	#chapter01 .chapter01-body h4{
		margin: 8px 0;
		font-weight: bold;
		font-size: 90%;
	}

	#chapter01 .chapter01-body .merit-title .number{
		position: absolute;
		width: 40px;
		top: -30px;
	}

	#chapter01 .chapter01-body p{
		font-size: 90%;
	}

}


/* --- PC ---------- */
@media screen and (min-width: 741px) {
	#chapter01{
		background: url(../img/merit-bk.jpg) center top repeat-y;
		padding: 50px 0;
	}

	#chapter01 .chapter01-body{
		max-width: 1000px;
		width: 90%;
		margin: 0 auto;
		color: #fff;
	}

	#chapter01 .chapter01-body .en{
		text-align: center;
		font-size: 380%;
		margin: 0;
		line-height: 1;
	}

	#chapter01 .chapter01-body h2{
		text-align: center;
		font-size: 90%;
		letter-spacing: 2px;
		margin: 0;
	}

	#chapter01 .chapter01-body .merit-title{
		width: 100%;
		text-align: center;
		border: 2px solid #fff;
		box-sizing: border-box;
		padding: 20px 5px;
		margin-top: 50px;
		position: relative;
	}

	#chapter01 .chapter01-body .merit-title h3{
		font-size: 180%;
		font-weight: bold;
		margin: 0;
		letter-spacing: 1px;
	}

	#chapter01 .chapter01-body .merit-title .number{
		position: absolute;
		width: 70px;
		height: 80px;
		top: -30px;
	}

	#chapter01 .chapter01-body p{
		letter-spacing: 1px;
	}

}


/*	chapter02
------------------------------------------------------------ */
/* --- SP ---------- */
@media screen and (max-width: 740px) {
	#chapter02{
		width: 100%;
		padding: 30px 0 10px;
		background: #f8f8f8;
	}

	#chapter02 .chapter02-body{
		max-width: 1200px;
		width: 90%;
		margin: 0 auto;
	}

	#chapter02 .chapter02-body .en{
		text-align: center;
		font-size: 260%;
		margin: 0;
		line-height: 1;
		color: #2b6e8e;
	}

	#chapter02 .chapter02-body h2{
		text-align: center;
		font-size: 90%;
		letter-spacing: 2px;
		margin: 0;
		color: #2b6e8e;
	}

	#chapter02 .require-box{
		max-width: 1000px;
		width: 100%;
		margin: 20px auto 150px;
		position: relative;
	}

	#chapter02 .require-box .img-area{
		position: absolute;
	}

	#chapter02 .require-box .text-area{
		width: 95%;
		margin: 0 auto;
		position: relative;
		top: 120px;
		background: rgba(255, 255, 255, .9);
		box-sizing: border-box;
		padding: 15px;
	}

	#chapter02 .require-box .text-area h3{
		margin: 0;
		text-align: center;
		font-weight: bold;
		color: #2b6e8e;
		font-size: 120%;
		letter-spacing: 1px;
	}

	#chapter02 .require-box .text-area p{
		margin: 8px 0;
		font-size: 90%;
	}

	#chapter02 .require-box .more-point h4{
		background: #000;
		max-width: 170px;
		width: 100%;
		box-sizing: border-box;
		padding: 3px;
		margin: 0;
		color: #fff;
		text-align: center;
		font-size: 90%;
	}

	#chapter02 .require-box .more-point p{
		margin: 8px 0;
		font-size: 80%;
	}

	#chapter02 .require-box .more-point{
		margin: 10px 0 0;
	}

	#chapter02 .taigu-box{
		margin: 20px 0 0;
	}

	#chapter02 .taigu-box h3{
		font-size: 120%;
		font-weight: bold;
		padding-bottom: 8px;
		border-bottom: 1px solid #000;
		margin: 0;
	}

	#chapter02 .taigu-box ul{
		list-style-type: none;
		padding: 0;
		font-size: 80%;
	}

}


/* --- PC ---------- */
@media screen and (min-width: 741px) {
	#chapter02{
		width: 100%;
		padding: 50px 0;
		background: #f8f8f8;
	}

	#chapter02 .chapter02-body{
		max-width: 1200px;
		width: 90%;
		margin: 0 auto;
	}

	#chapter02 .chapter02-body .en{
		text-align: center;
		font-size: 380%;
		margin: 0;
		line-height: 1;
		color: #2b6e8e;
	}

	#chapter02 .chapter02-body h2{
		text-align: center;
		font-size: 90%;
		letter-spacing: 2px;
		margin: 0;
		color: #2b6e8e;
	}

	#chapter02 .require-box{
		max-width: 1000px;
		width: 100%;
		margin: 30px auto 300px;
		position: relative;
	}

	#chapter02 .require-box .img-area{
		position: absolute;
	}

	#chapter02 .require-box .text-area{
		width: 85%;
		margin: 0 auto;
		position: relative;
		top: 250px;
		background: rgba(255, 255, 255, .9);
		box-sizing: border-box;
		padding: 50px;
	}

	#chapter02 .require-box .text-area h3{
		margin: 0;
		text-align: center;
		font-weight: bold;
		color: #2b6e8e;
		font-size: 160%;
		letter-spacing: 1px;
	}

	#chapter02 .require-box .more-point h4{
		background: #000;
		max-width: 170px;
		width: 100%;
		box-sizing: border-box;
		padding: 3px;
		margin: 0;
		color: #fff;
		text-align: center;
		font-size: 90%;
	}

	#chapter02 .require-box .more-point p{
		margin: 8px 0;
		font-size: 90%;
	}

	#chapter02 .require-box .more-point{
		margin: 20px 0 0;
	}

	#chapter02 .taigu-box{
		margin: 40px 0 0;
	}

	#chapter02 .taigu-box h3{
		font-size: 130%;
		font-weight: bold;
		padding-bottom: 10px;
		border-bottom: 1px solid #000;
		margin: 0;
	}

	#chapter02 .taigu-box ul{
		list-style-type: none;
		padding: 0;
	}

}


/*	chapter03
------------------------------------------------------------ */
/* --- SP ---------- */
@media screen and (max-width: 740px) {
	#chapter03{
		background-size: contain;
		padding: 20px 0;
	}

	#chapter03 .chapter03-body{
		max-width: 1200px;
		width: 90%;
		margin: 0 auto;
	}

	#chapter03 .chapter03-body{
		max-width: 1200px;
		width: 90%;
		margin: 0 auto;
	}

	#chapter03 .chapter03-body .en{
		font-size: 250%;
		margin: 0;
		color: #2b6e8e;
	}

	#chapter03 .chapter03-body .schdule-box{
		background: rgba(245, 244, 244, .9);
		box-sizing: border-box;
		padding: 20px;
		margin: 20px 0 30px;
		position: relative;
	}

	#chapter03 .chapter03-body .schdule-box h2{
		margin: 0;
		display: inline-block;
		background: #5786a0;
		color: #fff;
		padding: 5px 10px;
		text-align: center;
		font-size: 85%;
		position: absolute;
		top: -10px;
		font-size: 80%;
	}

	#chapter03 .chapter03-body .schdule-box .schedule-img{
		max-width: 960px;
		width: 100%;
		margin: 0 auto;
	}

}



/* --- PC ---------- */
@media screen and (min-width: 741px) {
	#chapter03{
		background-size: contain;
		padding: 50px 0;
	}

	#chapter03 .chapter03-body{
		max-width: 1200px;
		width: 90%;
		margin: 0 auto;
	}

	#chapter03 .chapter03-body{
		max-width: 1200px;
		width: 90%;
		margin: 0 auto;
	}

	#chapter03 .chapter03-body .en{
		font-size: 350%;
		margin: 0;
		color: #2b6e8e;
	}

	#chapter03 .chapter03-body .schdule-box{
		background: rgba(245, 244, 244, .9);
		box-sizing: border-box;
		padding: 40px;
		margin: 20px 0 40px;
		position: relative;
	}

	#chapter03 .chapter03-body .schdule-box h2{
		margin: 0;
		display: inline-block;
		background: #5786a0;
		color: #fff;
		padding: 5px 10px;
		text-align: center;
		font-size: 100%;
		position: absolute;
		top: -10px;
	}

	#chapter03 .chapter03-body .schdule-box .schedule-img{
		max-width: 960px;
		width: 100%;
		margin: 0 auto;
	}
}

/*	chapter04
------------------------------------------------------------ */
/* --- SP ---------- */
@media screen and (max-width: 740px) {
	#chapter04{
		background: url(../img/merit-bk.jpg) center top repeat-y;
		padding: 20px 0 0;
		color: #fff;
		text-align: center;
	}

	#chapter04 .en{
		text-align: center;
		font-size: 280%;
		margin: 0;
		line-height: 1;
	}

	#chapter04 h2{
		text-align: center;
		font-size: 90%;
		letter-spacing: 2px;
		margin: 0;
	}

	#chapter04 .contact-box{
		width: 100%;
		margin: 10px 0 0;
	}

	#chapter04 .contact-box .chapter04-contact{
		width: 100%;
		background: #2b8fb8;
		padding: 30px 0;
	}

	#chapter04 .contact-box .chapter04-entry{
		width: 100%;
		background: #1e7395;
		padding: 30px 0;
	}

	#chapter04 .contact-box .chapter04-contact h3,
	#chapter04 .contact-box .chapter04-entry h3{
		font-size: 120%;
		margin: 10px 0;
		font-weight: bold;
		letter-spacing: 1px;
		line-height: 1.4;
	}

	#chapter04 .contact-box .chapter04-contact a,
	#chapter04 .contact-box .chapter04-entry a{
		width: 60%;
		display: block;
		border: 1px solid #fff;
		padding: 10px 5px;
		box-sizing: border-box;
		text-decoration: none;
		color: #fff;
		margin: 0 auto;
		-webkit-transition: all 0.7s ease;
		-moz-transition: all 0.7s ease;
		-o-transition: all 0.7s ease;
		transition: all  0.7s ease;
	}

	#chapter04 .contact-box .chapter04-contact a:hover{
		background: #fff;
		color: #2b8fb8;
	}

	#chapter04 .contact-box .chapter04-entry a:hover{
		background: #fff;
		color: #1e7395;
	}
}



/* --- PC ---------- */
@media screen and (min-width: 741px) {

	#chapter04{
		background: url(../img/merit-bk.jpg) center top repeat-y;
		padding: 50px 0 0;
		color: #fff;
		text-align: center;
	}

	#chapter04 .en{
		text-align: center;
		font-size: 380%;
		margin: 0;
		line-height: 1;
	}

	#chapter04 h2{
		text-align: center;
		font-size: 90%;
		letter-spacing: 2px;
		margin: 0;
	}

	#chapter04 .contact-box{
		display: table;
		width: 100%;
		margin: 40px 0 0;
	}

	#chapter04 .contact-box .chapter04-contact{
		display: table-cell;
		width: 50%;
		background: #2b8fb8;
		padding: 50px 0;
	}

	#chapter04 .contact-box .chapter04-entry{
		display: table-cell;
		width: 50%;
		background: #1e7395;
		padding: 50px 0;
	}

	#chapter04 .contact-box .chapter04-contact h3,
	#chapter04 .contact-box .chapter04-entry h3{
		font-size: 140%;
		margin: 10px 0;
		font-weight: bold;
		letter-spacing: 1px;
		line-height: 1.4;
	}

	#chapter04 .contact-box .chapter04-contact a,
	#chapter04 .contact-box .chapter04-entry a{
		width: 60%;
		display: block;
		border: 1px solid #fff;
		padding: 10px 5px;
		box-sizing: border-box;
		text-decoration: none;
		color: #fff;
		margin: 0 auto;
		-webkit-transition: all 0.7s ease;
		-moz-transition: all 0.7s ease;
		-o-transition: all 0.7s ease;
		transition: all  0.7s ease;
	}

	#chapter04 .contact-box .chapter04-contact a:hover{
		background: #fff;
		color: #2b8fb8;
	}

	#chapter04 .contact-box .chapter04-entry a:hover{
		background: #fff;
		color: #1e7395;
	}


}



/*	sidebtn
------------------------------------------------------------ */
/* --- SP ---------- */
@media screen and (max-width: 740px) {
}



/* --- PC ---------- */
@media screen and (min-width: 741px) {

}




/*	footer 
------------------------------------------------------------ */
/* --- SP ---------- */
@media screen and (max-width: 740px) {
	#footer{
		background: #5da3c1;
		color: #fff;
		padding: 10px 0;
	}

	#footer .footer-body{
		max-width: 1200px;
		width: 90%;
		margin: 0 auto;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content:  space-between;
		font-size: 70%;
		line-height: 1.4;
	}

	#footer .footer-body a{
		color: #fff;
	}

}



/* --- PC ---------- */
@media screen and (min-width: 741px) {
	#footer{
		background: #5da3c1;
		color: #fff;
		padding: 10px 0;
	}

	#footer .footer-body{
		max-width: 1200px;
		width: 90%;
		margin: 0 auto;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content:  space-between;
		font-size: 90%;
	}

	#footer .footer-body a{
		color: #fff;
	}
}



@media screen and (min-width: 741px) and (max-width: 1280px) {

}

@media screen and (min-width: 741px) and (max-width: 1170px) {


}


@media screen and (min-width: 741px) and (max-width: 1100px) {

}

@media screen and (min-width: 741px) and (max-width: 980px) {


}


@media screen and (min-width: 741px) and (max-width: 820px) {

}

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

}
