@charset "UTF-8";
/* CSS Document */

/* ************************************************************
子ページコモン
************************************************************ */
/* サブビジュアル */
#sv{
	width: 100%;
	height: auto;
}

/* レッスン */
#lessonlink{
	width: 100%;
	margin: 0 auto;
}
#lessonlink div{
	margin: 0 auto;
	width: 100%;
	position: relative;
}
#lessonlink div .backpc{
	display: block;
}
#lessonlink div .backmb{
	display: none;
}
#lessonlink .block03p1{
	width: 20%;
	position: absolute;
	top: 20%;
	right: 10%;
}
#lessonlink .block03p2{
	width: 30%;
	position: absolute;
	top: 43%;
	right: 8%;
	font-size: 12px;
	line-height: 2;
	letter-spacing: 0.1em;
	color: #feefd4;
}
#lessonlink .block03p3{
	margin: 0 auto;
	width: 120px;
	position: absolute;
	bottom: 30%;
	right: 20%;
}
@media screen and (max-width: 1600px) {
	#lessonlink .block03p3{right: 19%;}

	@media screen and (max-width: 1200px) {
		#lessonlink .block03p2{width: 40%;right: 2%;}
		#lessonlink .block03p3{width: 100px;bottom: 27%;right: 17%;}

		@media screen and (max-width: 900px) {
			#lessonlink .block03p3{bottom: 20%;}

			@media screen and (max-width: 768px) {
				#lessonlink div .backpc{display: none;}
				#lessonlink div .backmb{display: block;}
				#lessonlink .block03p1{width: 40%;top: 50%;right: 21%;}
				#lessonlink .block03p2{width: 70%;top: 63%;right: 13%;}
				#lessonlink .block03p3{width: 17%;bottom: 18%;right: 40%;}

				@media screen and (max-width: 480px) {
					#lessonlink .block03p1{width: 50%;right: 16%;}
					#lessonlink.block03p2{width: 80%;top: 65%;right: 9%;}
					#lessonlink .block03p3{width: 95px;bottom: 15%;right: 38%;}

					@media screen and (max-width: 380px) {
						#lessonlink .block03p3{bottom: 12%;right: 37%;}
					}
				}
			}
		}
	}
}

/* 体験レポート */
#reportlink{
	width: 100%;
	margin: 0 auto;
}
#reportlink div{
	margin: 0 auto;
	width: 100%;
	position: relative;
}
#reportlink div .backpc{
	display: block;
}
#reportlink div .backmb{
	display: none;
}
#reportlink .block04p1{
	width: 20%;
	position: absolute;
	top: 20%;
	left: 16%;
}
#reportlink .block04p2{
	width: 30%;
	position: absolute;
	top: 43%;
	left: 8%;
	font-size: 12px;
	line-height: 2;
	letter-spacing: 0.1em;
	color: #feefd4;
}
#reportlink .block04p3{
	margin: 0 auto;
	width: 120px;
	position: absolute;
	bottom: 30%;
	left: 20%;
}
@media screen and (max-width: 1600px) {
	#reportlink .block04p3{bottom: 26%;left: 19%;}

	@media screen and (max-width: 1200px) {
		#reportlink .block04p1{width: 24%;}
		#reportlink .block04p2{width: 40%;top: 41%;left: 4%;}
		#reportlink .block04p3{width: 100px;bottom: 22%;}

		@media screen and (max-width: 900px) {
			#reportlink .block04p2{line-height: 1.7;letter-spacing: normal;}
			#reportlink .block04p3{bottom: 17%;}

			@media screen and (max-width: 768px) {
				#reportlink div .backpc{display: none;}
				#reportlink div .backmb{display: block;}
				#reportlink .block04p1{width: 43%;top: 50%;left: 33%;}
				#reportlink .block04p2{width: 70%;top: 63%;left: 13%;}
				#reportlink .block04p3{width: 17%;bottom: 18%;left: 40%;}

				@media screen and (max-width: 480px) {
					#reportlink .block04p1{width: 55%;left: 31%;}
					#reportlink .block04p2{width: 80%;top: 63%;left: 10%;}
					#reportlink .block04p3{width: 95px;bottom: 13%;left: 40%;}
				}
			}
		}
	}
}

/* 料金 */
#pricelink{
	width: 100%;
	margin: 0 auto;
}
#pricelink div{
	margin: 0 auto;
	width: 100%;
	position: relative;
}
#pricelink div .backpc{
	display: block;
}
#pricelink div .backmb{
	display: none;
}
#pricelink .block03p1{
	width: 16%;
	position: absolute;
	top: 20%;
	right: 12%;
}
#pricelink .block03p2{
	width: 30%;
	position: absolute;
	top: 43%;
	right: 8%;
	font-size: 12px;
	line-height: 2;
	letter-spacing: 0.1em;
	color: #feefd4;
}
#pricelink .block03p3{
	margin: 0 auto;
	width: 120px;
	position: absolute;
	bottom: 30%;
	right: 20%;
}
@media screen and (max-width: 1600px) {
	#pricelink .block03p3{bottom: 26%;right: 18%;}

	@media screen and (max-width: 1200px) {
		#pricelink .block03p2{width: 40%;right: 2%;}
		#pricelink .block03p3{width: 100px;bottom: 24%;right: 17%;}

		@media screen and (max-width: 1024px) {
			#pricelink .block03p1{top: 17%;}
			#pricelink .block03p2{top:41%;line-height: 1.7;}
			#pricelink .block03p3{bottom: 20%;}

			@media screen and (max-width: 900px) {
				#pricelink .block03p3{bottom: 20%;}

				@media screen and (max-width: 768px) {
					#pricelink div .backpc{display: none;}
					#pricelink div .backmb{display: block;}
					#pricelink .block03p1{width: 36%;top: 50%;right: 22%;}
					#pricelink .block03p2{width: 70%;top: 66%;right: 13%;}
					#pricelink .block03p3{width: 17%;bottom: 16%;right: 40%;}

					@media screen and (max-width: 480px) {
						#pricelink .block03p1{width: 40%;top:45%;right: 19%;}
						#pricelink .block03p2{width: 80%;top: 62%;right: 9%;}
						#pricelink .block03p3{width: 95px;bottom: 15%;right: 38%;}

						@media screen and (max-width: 380px) {
							#pricelink .block03p1{right: 21%;}
							#pricelink .block03p3{bottom: 12%;right: 37%;}
						}
					}
				}
			}
		}
	}
}

/* ************************************************************
コンセプト
************************************************************ */
#con-block01{
	width: 100%;
	margin: 0 auto;
	padding: 10% 0
}
#con-block01 h2{
	width: 300px;
	margin: 0 auto;
}
#con-block01 h3{
	width: 100%;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	padding: 5% 0;
	color: #06607b;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	letter-spacing: 0.1em;
	line-height: 2;
}
#con-block01 p{
	width: 700px;
	margin: 0 auto;
}

@media screen and (max-width: 1024px) {
	#con-block01{padding: 15% 0}
	#con-block01 h3{padding: 10% 0;}
	#con-block01 p{width: 65%;margin: 0 auto;}

	@media screen and (max-width: 768px) {
		#con-block01 h2{width: 250px;}
		#con-block01 h3{font-size: 13px;}
		#con-block01 p{width: 78%;}

		@media screen and (max-width: 480px) {
			#con-block01 h2{width: 220px;}
			#con-block01 h3{font-size: 12px;letter-spacing: normal;}
		}
	}
}

/* ************************************************************
レッスン
************************************************************ */
#les-block01{
	width: 100%;
	margin: 0 auto;
	padding: 10% 0 8%;
}
#les-block01 div{
	width: 400px;
	margin: 0 auto;
}
#les-block01 p{
	width: 800px;
	margin: 0 auto;
	padding-top: 2%;
}
#les-block01 h2{
	width: 100%;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	padding: 2% 0;
	color: #06607b;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	letter-spacing: 0.1em;
	line-height: 2;
}
#les-block01 h2 .mbbr{
	display: none;
}

@media screen and (max-width: 1024px) {
	#les-block01{padding: 15% 0}
	#les-block01 div{width: 350px;}
	#les-block01 p{width: 75%;margin: 0 auto;}
	#les-block01 h2{font-size: 13px;}

	@media screen and (max-width: 768px) {
		#les-block01 div{width: 300px;}
		#les-block01 p{width: 80%;}
		#les-block01 h2 .mbbr{display: block;}

		@media screen and (max-width: 480px) {
			#les-block01 div{width: 280px;}
			#les-block01 p{width: 90%;}
			#les-block01 h2{font-size: 12px;}
		}
	}
}

#les-block02{
	width: 100%;
	margin: 0 auto;
	padding: 0 5%;
}
#les-block02 .block02-1{
	width: 100%;
	margin: 0 auto 10%;
	padding: 5%;
	position: relative;
	background-color:rgba(2,87,112,0.90) ;
	mix-blend-mode: multiply;
	max-width: 1000px;
	border-radius: 20px 120px 20px 20px;
}
#les-block02 .block02-2{
	width: 100%;
	margin: 0 auto 10%;
	padding: 5%;
	position: relative;
	background-color:rgba(2,87,112,0.90) ;
	mix-blend-mode: multiply;
	max-width: 1000px;
	border-radius: 120px 20px 20px 20px;
}
#les-block02 .block02p1{
	width: 270px;
	margin: 0 auto;
	padding: 1% 0;
}
#les-block02 .border{
	width: 100%;
	margin: 5% auto 0;
	padding: 3% 0;
	max-width: 700px;
	border-top: dashed #fbf9e0 3px; 
}
#les-block02 .block02p2{
	width: 100%;
	margin: 0 auto;
	font-size: 13px;
	letter-spacing: 0.1em;
	line-height: 2;
	text-align: left;
	color: #fbf9e0;
	font-family: 'Noto Serif JP', serif;
	max-width: 700px;
}
#les-block02 .key01{
	width: 140px;
	position: absolute;
	top:10%;
	left: -2%;
}
#les-block02 .kaban{
	width: 170px;
}
#les-block02 .sunadokei{
	width: 110px;
}
#les-block02 .key02{
	width: 140px;
	position: absolute;
	top:10%;
	right: -2%;
}

@media screen and (max-width: 1024px) {
	#les-block02 .block02-1{padding: 10% 5%;}
	#les-block02 .block02-2{padding: 10% 5%;}
	#les-block02 .block02p1{width: 220px;}
	#les-block02 .key01{width: 110px;position: absolute;top:15%;left: -1%;}
	#les-block02 .kaban{width: 170px;}
	#les-block02 .key02{width: 110px;position: absolute;top:15%;right: -1%;}
	#les-block02 .books{width: 130px;}

	@media screen and (max-width: 768px) {
		#les-block02 .block02-1{padding: 10% 8%;}
		#les-block02 .block02-2{padding: 10% 8%;}
		#les-block02 .block02p1{width: 180px;}
		#les-block02 .block02p2{font-size: 12px;line-height: 1.6;}
		#les-block02 .key01{width: 15%;position: absolute;top:7%;left: -1%;}
		#les-block02 .kaban{width: 19%;}
		#les-block02 .sunadokei{width: 13%;}
		#les-block02 .key02{width: 15%;position: absolute;top:7%;right: -1%;}
		#les-block02 .books{width: 17%;}

		@media screen and (max-width: 480px) {
			#les-block02 .block02-1{padding: 14% 8%;}
			#les-block02 .block02-2{padding: 14% 8%;}
			#les-block02 .block02p1{width: 160px;}
			#les-block02 .key01{width: 17%;position: absolute;top:7%;left: -1%;}
			#les-block02 .kaban{width: 23%;top:13%;}
			#les-block02 .sunadokei{width: 15%;top:11%;}
			#les-block02 .key02{width: 17%;position: absolute;top:7%;right: -1%;}
			#les-block02 .books{width: 20%;top:10%;}
		}
	}
}

#les-block03{
	width: 100%;
	margin: 0 auto;
	padding: 5% 0 10%;
	max-width: 1000px;
	position: relative;
}
#les-block03 .block03-1{
	width: 100%;
	margin: 0 auto;
	padding: 5% ;
}
#les-block03 .block03div1{
	width: 100%;
	margin: 0 auto;
	padding-top: 5%;
	color: #065f74;
	font-family: 'Kanit', sans-serif;
	font-size: 32px;
	letter-spacing: 0.1em;
}
#les-block03 .block03line{
	width: 100%;
	margin: 4% auto;
	max-width: 700px;
	border-top: solid #065f74 1px; 
}
#les-block03 .block03div2{
	width: 100%;
	margin: 0 auto;
	color: #065f74;
	font-family:'Noto Serif JP', serif;
	font-size: 14px;
	letter-spacing: 0.1em;
	line-height: 2;
	padding-bottom: 5%;
}
#les-block03 .maic{
	width: 230px;
	position: absolute;
	right: 2%;
	bottom: 39%;
}

@media screen and (max-width: 1024px) {
	#les-block03 .block03div2{font-size: 13px;}
	#les-block03 .maic{width: 20%;}

	@media screen and (max-width: 768px) {
		#les-block03 .block03div1{font-size: 4.5vw;}
		#les-block03 .block03div1{padding-top: 10%;}
		#les-block03 .block03line{width: 90%;}
		#les-block03 .block03div2{padding: 0 5% 10%;font-size: 12px;letter-spacing: normal;}
		#les-block03 .maic{bottom: 37%;}

		@media screen and (max-width: 480px) {
			#les-block03 .block03div2{font-size: 11px;padding: 0 0 10%;}

			@media screen and (max-width: 400px) {
				#les-block03 .block03div2{font-size: 10px;}
			}
		}
	}
}

/* ************************************************************
オンラインレッスンページ
************************************************************ */
#on-block01{
	width: 100%;
	margin: 0 auto;
	padding: 10% 0 0 0 
}
#on-block01 h2{
	width: 350px;
	margin: 0 auto;
}
#on-block01 .b1-smalltitle{
	width: 250px;
	margin: 0 auto;
	padding: 1% 0 0 0;
	color: #06607b;
	font-size: 13px;
	text-align: center;
	letter-spacing: 0.1em;
	font-family: 'Noto Serif JP', serif;
}
#on-block01 h3{
	width: 100%;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	padding: 5% 0;
	color: #06607b;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	letter-spacing: 0.1em;
	line-height: 2;
}
#on-block01 .b1-group{
	width: 100%;
	margin: 0 auto;
	padding: 10% 10% 0 10%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}
#on-block01 .b1-group .b1-photo{
	width: 50%;
	margin: 0 auto;
	padding: 0;
}
#on-block01 .b1-group .b1-text{
	width: 50%;
	margin: 0 auto;
	padding: 0 0 0 5%;
	text-align: left;
}

@media screen and (max-width: 1280px) {
	#on-block01 .b1-group .b1-text br{display: none;}

	@media screen and (max-width: 1024px) {
		#on-block01{padding: 15% 0 0 0}
		#on-block01 h3{padding: 10% 0;}
		#on-block01 p{width: 65%;margin: 0 auto;}

		@media screen and (max-width: 768px) {
			#on-block01 h2{width: 250px;}
			#on-block01 h3{font-size: 13px;}
			#on-block01 p{width: 78%;}
			#on-block01 .b1-group{width: 100%;margin: 0 auto;padding: 10%;display: block;}
			#on-block01 .b1-group .b1-photo{width: 100%;margin: 0 auto;padding: 0 5%;}
			#on-block01 .b1-group .b1-text{width: 100%;margin: 0 auto;padding: 10% 5% 0 5%;;text-align: left;}

			@media screen and (max-width: 480px) {
				#block01 h2{width: 220px;}
				#block01 h3{font-size: 12px;letter-spacing: normal;}
			}
		}
	}
}

#on-block02{
	width: 100%;
	margin: 0 auto;
	padding: 10% 0 15% 0;
}
#on-block02 .b2-back{
	width: 100%;
	margin: 0 auto;
	padding: 0;
	background-color: #06607b;
}
#on-block02 h2{
	width: 350px;
	margin: 0 auto;
	padding: 0 ;
}
#on-block02 h2::before{
	content: '';
	display: block;
	background-color: #FFFFFF;
	height: 100px;
	width: 1px;
	margin: 20px auto;
}
#on-block02 .b2-smalltitle{
	width: 250px;
	margin: 0 auto;
	padding: 1% 0 0 0;
	color: #FFFFFF;
	font-size: 13px;
	text-align: center;
	letter-spacing: 0.1em;
	font-family: 'Noto Serif JP', serif;
}
#on-block02 .b2-back .b2-group{
	width: 100%;
	margin: 0 auto;
	padding: 5% 10% 8% 10%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}
#on-block02 .b2-back .b2-group .bg{
	width: 33%;
	margin: 0 auto;
	padding: 2%;
}
#on-block02 .b2-back .b2-group .bg .photo{
	width: 80%;
	margin: 0 auto;
	padding: 0;
}
#on-block02 .b2-back .b2-group .bg .g-title{
	width: 100%;
	margin: 0 auto;
	padding: 6%;
	color: #FFFFFF;
	font-family: 'Noto Serif JP', serif;
	font-size: 22px;
}
#on-block02 .b2-back .b2-group .bg .g-text{
	width: 100%;
	margin: 0 auto;
	padding: 0;
	color: #FFFFFF;
	font-family: 'Noto Serif JP', serif;
	font-size: 14px;
	letter-spacing: 0.1em;
	line-height: 1.5;
}
@media screen and (max-width: 930px) {
	#on-block02 .b2-back .b2-group .bg .g-title{font-size: 19px;}
	#on-block02 .b2-back .b2-group .bg .g-text{font-size: 13px;}

	@media screen and (max-width: 768px) {
		#on-block02 h2{width: 250px;padding: 0 ;}
		#on-block02 h3{font-size: 13px;}
		#on-block02 .b2-back .b2-group{width: 100%;margin: 0 auto;padding: 3% 10% 10% 10%;display: block;}
		#on-block02 .b2-back .b2-group .bg{width: 100%;margin: 0 auto;padding: 15% 0 0 0 ;}
		#on-block02 .b2-back .b2-group .bg .g-title{width: 100%;margin: 0 auto;padding: 6%;color: #FFFFFF;font-family: 'Noto Serif JP', serif;font-size: 22px;}

		@media screen and (max-width: 480px) {
			#on-block02 h2{width: 220px;}
			#on-block02 h2::before{content: '';display: block;background-color: #FFFFFF;height: 60px;width: 1px;margin: 20px auto;}
			#on-block02 h3{font-size: 12px;letter-spacing: normal;}
			#on-block02 .b2-back .b2-group{width: 100%;margin: 0 auto;padding: 3% 10% 20% 10%;display: block;}
			#on-block02 .b2-back .b2-group .bg .photo{width: 50%;margin: 0 auto;padding: 0;}
			#on-block02 .b2-back .b2-group .bg .g-title{width: 100%;margin: 0 auto;padding: 8% 6% 6% 6%;color: #FFFFFF;font-family: 'Noto Serif JP', serif;font-size: 21px;}
			#on-block02 .b2-back .b2-group .bg .g-text{font-size: 12px;letter-spacing: 0.1em;line-height: 1.5;}
		}
	}
}



#on-block03{
	width: 100%;
	margin: 0 auto;
	padding: 0;
}
#on-block03 h2{
	width: 350px;
	margin: 0 auto;
}
#on-block03 .b3-smalltitle{
	width: 250px;
	margin: 0 auto;
	padding: 1% 0 0 0;
	color: #06607b;
	font-size: 13px;
	text-align: center;
	letter-spacing: 0.1em;
	font-family: 'Noto Serif JP', serif;
}
#on-block03 h3{
	width: 100%;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	padding: 5% 0;
	color: #06607b;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	letter-spacing: 0.1em;
	line-height: 2;
}
#on-block03 .b3-group{
	width: 100%;
	margin: 0 auto;
	padding: 10% 10% 0 10%;
	display: flex;
	flex-flow: row-reverse;
	justify-content: space-between;
}
#on-block03 .b3-group .b3-photo{
	width: 50%;
	margin: 0 auto;
	padding: 0;
}
#on-block03 .b3-group .b3-text{
	width: 50%;
	margin: 0 auto;
	padding: 0 5% 0 0;
	text-align: right;
}
#on-block03 .b3-group .b3-text p{
	display:inline-block;
	text-align: left;
}

@media screen and (max-width: 1380px) {
	#on-block03 .b3-group .b3-text br{display: none;}

	@media screen and (max-width: 1110px) {
		#on-block03 .b3-group{width: 100%;margin: 0 auto;padding: 10%;display: block;}
		#on-block03 .b3-group .b3-photo{width: 100%;margin: 0 auto;padding: 0 5%;}
		#on-block03 .b3-group .b3-text{width: 100%;margin: 0 auto;padding: 10% 5% 0 5%;text-align: center;}

		@media screen and (max-width: 1024px) {
			#on-block03{padding: 0;}
			#on-block03 h3{padding: 10% 0;}

			@media screen and (max-width: 768px) {
				#on-block03 h2{width: 250px;}
				#on-block03 h3{font-size: 13px;}
				#on-block03 .b1-group{width: 100%;margin: 0 auto;padding: 15% 10% 10% 10%;display: block;}
				#on-block03 .b3-group .b3-photo{width: 100%;margin: 0 auto;padding: 0 5%;}
				#on-block03 .b3-group .b3-text{width: 100%;margin: 0 auto;padding: 10% 5% 0 5%;;text-align: left;}

				@media screen and (max-width: 480px) {
					#on-block03 h2{width: 220px;}
					#on-block03 h3{font-size: 12px;letter-spacing: normal;}
				}
			}
		}
	}
}

#on-block04{
	width: 100%;
	margin: 0 auto;
	padding: 15% 0 15% 0;
}
#on-block04 .b4-back{
	width: 100%;
	margin: 0 auto;
	padding: 0;
	background-color: #06607b;
}
#on-block04 h2{
	width: 350px;
	margin: 0 auto;
	padding: 8% 0 0 0 ;
}
#on-block04 .b4-smalltitle{
	width: 250px;
	margin: 0 auto;
	padding: 1% 0 0 0;
	color: #FFFFFF;
	font-size: 13px;
	text-align: center;
	letter-spacing: 0.1em;
	font-family: 'Noto Serif JP', serif;
}
#on-block04 .b4-back .b4-group{
	width: 100%;
	margin: 0 auto;
	padding: 3% 10% 8% 10%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}
#on-block04 .b4-back .b4-group .bg{
	width: 25%;
	margin: 0 auto;
	padding: 2%;
}
#on-block04 .b4-back .b4-group .bg .g-text{
	width: 100%;
	margin: 0 auto;
	padding: 5% 0 0 0;
	color: #FFFFFF;
	font-family: 'Noto Serif JP', serif;
	font-size: 14px;
	letter-spacing: 0.1em;
	line-height: 1.5;
}
@media screen and (max-width: 930px) {
	#on-block04 .b4-back .b4-group .bg .g-text{font-size: 13px;}
	#on-block04 .b4-back .b4-group .bg .g-text br{display: none;}

	@media screen and (max-width: 768px) {
		#on-block04 h2{width: 180px;padding: 8% 0 0 0 ;}
		#on-lock04 h3{font-size: 13px;}
		#on-block04 .b4-back .b4-group{width: 100%;margin: 0 auto;padding: 3% 10% 10% 10%;display: flex;}
		#on-block04 .b4-back .b4-group .bg{width: 50%;margin: 0 auto;padding: 10% 3% 0 ;}
		#on-block04 .b4-back .b4-group .bg .g-title{width: 100%;margin: 0 auto;padding: 6%;color: #FFFFFF;font-family: 'Noto Serif JP', serif;font-size: 22px;}

		@media screen and (max-width: 480px) {
			#on-block04 h2{width: 140px;padding: 13% 0 0 0 ;}
			#on-block04 h3{font-size: 12px;letter-spacing: normal;}
			#on-block04 .b4-back .b4-group{padding: 3% 10% 13% 10%;}
		}
	}
}

#on-block5{
	width: 100%;
	margin: 0 auto;
	padding: 0;
}
#on-block5 h2{
	width: 90px;
	margin: 0 auto;
}
#on-block5 .b5-smalltitle{
	width: 250px;
	margin: 0 auto;
	padding: 1% 0 0 0;
	color: #06607b;
	font-size: 13px;
	text-align: center;
	letter-spacing: 0.1em;
	font-family: 'Noto Serif JP', serif;
}
#on-block5 .b5-back h3{
	width: 100%;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	padding: 5% 10%;
	color: #06607b;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	letter-spacing: 0.1em;
	line-height: 1.5;
}
#on-block5 .b5-back .price-more{
	width: 18%;
	margin: 0 auto;
	padding:  0;
	background-color: #06607b;
	text-align: center;
}
#on-block5 .b5-back .price-more p{
	width: 100%;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	padding: 6% 10%;
	color: #FFFFFF;
	font-size: 14px;
	text-align: center;
	letter-spacing: 0.1em;
}

@media screen and (max-width: 1024px) {
	#on-block5{padding: 0;}
	#on-block5 h3{padding: 10% 7%;}
	#on-block5 .b5-back .price-more p{font-size: 13px;}

	@media screen and (max-width: 768px) {
		#on-block5 h2{width: 70px;}
		#on-block5 h3{font-size: 13px;padding: 5% 10%;}
		#on-block5 .b5-back .price-more{width: 22%;margin: 0 auto;padding:  0;background-color: #06607b;text-align: center;}
		#on-block5 .b5-back .price-more p{font-size: 12px;}

		@media screen and (max-width: 570px) {
			#on-block5 h3 br{display: none;}
			#on-block5 .b5-back .price-more{width: 30%;}
			#on-block5 .b5-back h3{padding: 8% 10%;font-size: 13px;text-align: left;letter-spacing: 0.1em;line-height: 1.5;}

			@media screen and (max-width: 480px) {
				#on-block5 h2{width: 60px;}
				#on-block5 h3{font-size: 12px;letter-spacing: normal;padding: 8% 10%;}
				#on-block5 .b5-back .price-more{width: 40%;}
			}
		}
	}
}

/* ************************************************************
料金ページ
************************************************************ */
#pr-block01{
	width: 100%;
	margin: 0 auto;
	padding: 10% 5%;
}
#pr-block01 .notify{
	width: 100%;
	margin: 5% auto 0;
}
#pr-block01 .notify p:nth-of-type(1){
	margin: 0 auto 2%;
	font-size: 15px;
	color: #065f74;
	font-weight: bold;
}
#pr-block01 .notify p:nth-of-type(2){
	margin: 0 auto;
	font-size: 12px;
	line-height: 1.7;
}
#pr-block01 .p01{
	width: 500px;
	margin: 0 auto;
}
#pr-block01 .p02{
	width: 250px;
	margin: 0 auto;
	padding: 5% 0 0;
}
#pr-block01 .p03{
	width: 100%;
	margin: 0 auto;
	padding: 7% 0 0;
	color: #065f74;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: 0.1em;
}
#pr-block01 table{
	margin: 5% auto 0;
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	max-width: 600px;
}
#pr-block01 table th,
#pr-block01 table td{
	padding: 30px 0;
	text-align: center;
	border-top: solid 2px #065f74;
	border-bottom: solid 2px #065f74;
	color: #065f74;
	font-weight: bold;
	font-size: 15px;
}
#pr-block01 table th{
	width: 23%;
	text-align: center;
}
#pr-block01 table td{
	text-align: right;
}
#pr-block01 table tr .setsumei{
	text-align: center;
	font-size: 12px;
}
#pr-block01 .midashi{
	margin: 0 auto;
	width: 100%;
	padding: 10% 3% 0;
	max-width: 1000px;
	text-align: left;
}
#pr-block01 .midashi dl{
	margin: 0 auto;
	width: 100%;
	padding: 1% 0;
}
#pr-block01 .dlu20{
	width: 450px;
	margin-left: 0;
}
#pr-block01 .basic{
	width: 70%;
	margin-left: 0;
}
#pr-block01 .premium{
	width: 78%;
	margin-left: 0;
}
#pr-block01 .midashi dt{
	margin: 0 auto;
	width: 100%;
	padding: 5px 10px;
	font-size: 12px;
	letter-spacing: 0.2em;
	color: #feefd4;
	background-color: #06607b;
}
#pr-block01 .midashi dd{
	margin: 0 auto;
	width: 100%;
	padding: 1% 0;
	font-size: 12px;
	letter-spacing: 0.1em;
	color: #06607B;
}
@media screen and (max-width: 1024px) {
	#pr-block01 {padding: 15% 5%;}
	#pr-block01 .basic{width: 78%;}
	#pr-block01 .premium{width: 90%;}
	#pr-block01 .p01{width: 400px;}
	#pr-block01 .p02{width: 200px;}
	#pr-block01 .p03{font-size: 18px;}

	@media screen and (max-width: 768px) {
		#pr-block01 .notify{margin: 7% auto 0;}
		#pr-block01 .notify p:nth-of-type(1){margin: 0 auto 5%;font-size: 13px;}
		#pr-block01 .notify p:nth-of-type(2){margin: 0 auto 5%;font-size: 10px;text-align: justify;width: 85%;}
		#pr-block01 .notify p:nth-of-type(2) br{display: none;}
		#pr-block01 .p03{font-size: 16px;}
		#pr-block01 table,#pr-block01 .table02{max-width: 500px;}
		#pr-block01 .table02 tr{border-top: solid 2px #065f74;border-bottom: solid 2px #065f74;}	
		#pr-block01 .table02 th{width: 80%;text-align: center;}
		#pr-block01 .table02 th,#pr-block01 .table02 td{padding: 3% 0 0;display: block;width: 100%;border-top: none;border-bottom: none;text-align: center;}
		#pr-block01 .table02 tr .setsumei{padding-bottom: 3%;}	

		@media screen and (max-width: 600px) {
			#pr-block01 .basic{width: 68%;}
			#pr-block01 .premium{width: 77%;}

			@media screen and (max-width: 480px) {
				#pr-block01 {padding: 20% 5%;}
				#pr-block01 .p01{width: 80%;}
				#pr-block01 .p02{width: 40%;}
				#pr-block01 .p03{font-size: 14px;font-weight: 500;}
				#pr-block01 .table02 th,#pr-block01 .table02 td{font-weight: normal;font-size: 16px;letter-spacing: 0.1em;}
				#pr-block01 .table02 tr{border-top: solid 1px #065f74;border-bottom: solid 1px #065f74;}
				#pr-block01 .table02 tr .setsumei{letter-spacing: normal;}
				#pr-block01 .midashi dt{padding: 2px 7px;font-size: 10px;}
				#pr-block01 .dlu20{width: 80%;padding-bottom: 3%;}
				#pr-block01 dd{padding-top: 3%;padding-bottom: 3%;}
			}
		}
	}
}


/* ************************************************************
講師紹介ページ
************************************************************ */
#pro-block01{
	width: 100%;
	margin: 0 auto;
	padding: 10% 5% 5%;
}
#pro-block01 h2{
	width: 450px;
	margin: 0 auto;
}
#pro-block01 h3{
	width: 100%;
	margin: 0 auto;
	padding: 5% 0;
	font-size: 14px;
	letter-spacing: 0.1em;
	color:  #06607B;
	line-height: 2.2;
}
@media screen and (max-width: 1024px) {
	#pro-block01{padding: 15% 5%;}

	@media screen and (max-width: 768px) {
		#pro-block01{padding: 20% 5%;}
		#pro-block01 h2{width: 350px;}
		#pro-block01 h3{padding: 10% 0;font-size: 13px;}

		@media screen and (max-width: 480px) {
			#pro-block01{padding: 15% 2%;}
			#pro-block01 h2{width: 300px;}
			#pro-block01 h3{padding: 12% 0;font-size: 12px;letter-spacing: normal;}

			@media screen and (max-width: 400px) {
				#pro-block01 h3{font-size: 11px;}
			}
		}
	}
}

#pro-block02{
	width: 100%;
	margin: 0 auto;
	padding: 5%;
	background-color: rgba(248,236,82,0.21);
}
#pro-block02 dl{
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: center;
	max-width: 1200px;
}
#pro-block02 dl dt{
	width: 35%;
}
#pro-block02 dt:hover{
	background:url("image/block02-2.png") no-repeat;
	background-position: center;
	display: inline-block;
	background-color: transparent; /* IE6対応 */
}
#pro-block02 dl dt:hover img{
	visibility: hidden;
}
#pro-block02 dl dd{
	width: 60%;
}
#pro-block02 dd p{
	width: 100%;
	padding: 3% ;
	text-align: center;
	color: #06607B;
}
#pro-block02 dd .p1{
	font-size: 25px;
	font-family: 'Kanit', sans-serif;
	letter-spacing: 0.2em;
}
#pro-block02 dd .p1 span{
	font-size: 20px;
	font-weight: bold;
}
#pro-block02 dd .p2{
	font-size: 35px;
	padding-bottom: 6%;
	font-family: 'Kanit', sans-serif;
	letter-spacing: 0.2em;
}
#pro-block02 dd .p3{
	font-size: 14px;
	padding-top: 6%;
	text-align: left;
	line-height: 1.5;
	font-weight: bold;
	border-top: solid 2px #06607B;
}
@media screen and (max-width: 1024px) {
	#pro-block02{padding: 10% 5%;}
	#pro-block02 dl dt{width: 23%;}
	#pro-block02 dt:hover{background-size: cover;}
	#pro-block02 dl dd{width: 70%;}
	#pro-block02 dd p{padding: 2% ;}
	#pro-block02 dd .p1{font-size: 23px;}
	#pro-block02 dd .p2{font-size: 30px;}
	#pro-block02 dd .p3{font-size: 13px;}

	@media screen and (max-width: 768px) {
		#pro-block02 dl dt{width: 100%;max-width: 180px;}
		#pro-block02 dl dt img{width: 180px;}
		#pro-block02 dl dd{width: 100%;}
		#pro-block02 dd .p1{padding-top: 6%;}
		#pro-block02 dd .p1 span{font-size: 16px;}
		#pro-block02 dd .p3{font-size: 12px;padding: 6% 0;}
	}
}

#pro-block03{
	width: 100%;
	margin: 0 auto;
	padding: 5% ;
}
#pro-block03 dl{
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-flow: row-reverse;
	justify-content: space-around;
	align-items: center;
	max-width: 1200px;
}
#pro-block03 dt:hover{
	background:url("image/block03-2.png") no-repeat;
	background-position: center;
	display: inline-block;
	background-color: transparent; /* IE6対応 */
}
#pro-block03 .zisseki{
	width: 100%;
	max-width: 200px;
	margin: 10% auto 0;
	padding: 30px;
	align-items: center;
	font-size: 20px;
	background-color: rgba(6,96,123,1.00);
	color: rgba(254,239,212,1.00);
}
#pro-block03 .zisseki02{
	width: 100%;
	margin: -30px auto 0;
	padding: 5% 5% 3%;
	max-width: 800px;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: top;
	color: rgba(6,96,123,1.00);
	border: solid 2px rgba(6,96,123,1.00);
	text-align:left;
	font-size: 14px;
	line-height: 2;
	letter-spacing: 0.1em;
}
#pro-block03 .zisseki02 p{
	width: 48%;
}
#pro-block03 .zisseki02 p .mbbr{
	display: none;
}
#pro-block03 .kaijou{
	width: 100%;
	margin: 10% auto 0;
	padding:10px 0 ;
	font-size: 16px;
	letter-spacing: 0.1em;
	color: #FEEFD4;
	background-color: #06607B;
}
#pro-block03 .ggmap {
	height: 0;
	overflow: hidden;
	padding-bottom: 30%;
	position: relative;
}
#pro-block03 .ggmap iframe {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
}
@media screen and (max-width: 1200px) {
	#pro-block03 .zisseki02{padding: 10% 5% 7%;}

	@media screen and (max-width: 1024px) {
		#pro-block03 dt:hover{background-size: contain;}
		#pro-block03 dd .p4{width: 80%;padding-top: 3%;margin: 0 auto;}

		@media screen and (max-width: 768px) {
			#pro-block03{padding: 10% 5% ;}
			#pro-block03 dl{flex-flow: row wrap;}
			#pro-block03 .zisseki{max-width: 150px;padding: 20px;font-size: 16px;}
			.#pro-block03 zisseki02{font-size: 13px;max-width: 400px;}
			#pro-block03 .zisseki02 p{width: 85%;}
			#pro-block03 .zisseki02 p .mbbr{display: block;}
			#pro-block03 .ggmap {height: 300px;}

			@media screen and (max-width: 480px) {
				#pro-block03 .zisseki02{margin: -20px auto 0;padding: 15% 5% 10%;line-height: 1.7;}

				@media screen and (max-width: 400px) {
					#pro-block03 .zisseki02 p{width: 92%;}
				}
			}
		}
	}
}

/* ************************************************************
体験レポートページ
************************************************************ */
#ex-block01{
	width: 100%;
	margin: 0 auto;
	padding: 10% 5% 5%;
}
#ex-block01 div{
	width: 100%;
	margin: 0 auto;
	padding: 3% 5%;
	background-color: rgba(255,255,255,0.50);
	max-width: 500px;
}
#ex-block01 .p1{
	width: 100%;
	margin: 0 auto;
	padding: 5%;
	font-size: 14px;
	letter-spacing: 0.1em;
	color:  #45200d;
	line-height: 2.2;
	text-align: center;
}
#ex-block01 .p1 .mbbr{
	display: none;
}
#ex-block01 .photo{
	width: 100%;
	margin: 0 auto;
	padding: 5%;
}
@media screen and (max-width: 1024px) {
	#ex-block01{padding: 15% 5%;}
	#ex-block01 div{padding: 5%;max-width: 400px;}

	@media screen and (max-width: 768px) {
		#ex-block01 div{padding: 40px;max-width: 360px;}
		#ex-block01 .p1{font-size: 13px;line-height: 1.7;}
		#ex-block01 .p1 .mbbr{display: block;}

		@media screen and (max-width: 480px) {
			#ex-block01 .p1{font-size: 12px;letter-spacing: normal;}
		}
	}
}

#ex-block02{
	width: 100%;
	margin: 0 auto;
	padding: 5%;
}
#ex-block02 .block02div1{
	width: 100%;
	margin: 0 auto;
	padding-top: 4%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: center;
	max-width: 1000px;
}
#ex-block02 .block02div2{
	width: 100%;
	margin: 0 auto;
	padding-top: 4%;
	display: flex;
	flex-flow: row-reverse;
	justify-content: space-around;
	align-items: center;
	max-width: 1000px;
}
#ex-block02 .hukidashi {
	width: 70%;
	text-align: left;
	font-size: 16px;
}
#ex-block02 .balloon2-right{
	position: relative;
	display: inline-block;
	margin: 1.5em 15px 1.5em 0;
	padding: 30px ;
	min-width: 120px;
	max-width: 100%;
	color: #06607B;
	background: #FFF;
	border: solid 3px #06607B;
	box-sizing: border-box;
	border-radius: 20px;
}
#ex-block02 .balloon2-right:before {
	content: "";
	position: absolute;
	top: 50%;
	right: -24px;
	margin-top: -12px;
	border: 12px solid transparent;
	border-left: 12px solid #FFF;
	z-index: 2;
}
#ex-block02 .balloon2-right:after {
	content: "";
	position: absolute;
	top: 50%;
	right: -30px;
	margin-top: -14px;
	border: 14px solid transparent;
	border-left: 14px solid #06607B;
	z-index: 1;
}
#ex-block02 .balloon2-left {
	position: relative;
	display: inline-block;
	margin: 1.5em 0 1.5em 15px;
	padding: 30px;
	min-width: 120px;
	max-width: 100%;
	color: #06607B;
	background: #FFF;
	border: solid 3px #06607B;
	box-sizing: border-box;
	border-radius: 20px;
}
#ex-block02 .balloon2-left:before {
	content: "";
	position: absolute;
	top: 50%;
	left: -24px;
	margin-top: -12px;
	border: 12px solid transparent;
	border-right: 12px solid #FFF;
	z-index: 2;
}
#ex-block02 .balloon2-left:after {
	content: "";
	position: absolute;
	top: 50%;
	left: -30px;
	margin-top: -14px;
	border: 14px solid transparent;
	border-right: 14px solid #06607B;
	z-index: 1;
}
#ex-block02 .hukidashi span {
	margin: 0;
	padding: 0;
	letter-spacing: 0.1em;
	line-height: 1.3;
}
#ex-block02 .icon {
	width: 20%;
}
@media screen and (max-width: 1024px) {
	#ex-block02{padding: 0 5%;}
	#ex-block02 .hukidashi {font-size: 14px;}

	@media screen and (max-width: 768px) {
		#ex-block02 .hukidashi {font-size: 12px;}
		#ex-block02 .balloon2-left {border: solid 2px #06607B;padding: 20px ;}
		#ex-block02 .balloon2-left:after {margin-top: -15px;border: 15px solid transparent;border-right: 15px solid #06607B;}
		#ex-block02 .balloon2-right {border: solid 2px #06607B;padding: 20px ;}
		#ex-block02 .balloon2-right:after {margin-top: -15px;border: 15px solid transparent;border-left: 15px solid #06607B;}
		#ex-block02 .icon {width: 25%;}
	}
}

#ex-block03{
	width: 100%;
	margin: 3% auto 0;
	background-color: rgba(204,204,204,0.31);
}
#ex-block03 div{
	width: 100%;
	margin: 0 auto;
	padding: 5%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: center;
	max-width: 1200px;
}
#ex-block03 p{
	width: 30%;
	margin: 0 auto;
}
@media screen and (max-width: 1024px) {
	#ex-block03{margin: 10% auto 0;}

	@media screen and (max-width: 768px) {
		#ex-block03{margin: 15% auto 0;padding: 5%;}
		#ex-block03 p{width: 100%;padding: 5% 0}
	}
}

/* ************************************************************
コンタクトページ
************************************************************ */
/* テキスト */
#contact {
	width: 100%;
	margin: 0 auto;
	padding: 5% 0;
}
#contact  .ct01 {
	width: 90%;
	max-width: 600px;
	margin: 0 auto;
	text-align: left;
	padding: 0 0 3%;
	color: rgba(6,96,123,1.00);
	font-size: 14px;
	letter-spacing: 0.1em;
	line-height: 2;
}
#contact  .ct01 h3{
	font-size: 200%;
}
#contact  .ct01 p{
	width: 100%;
}
#contact  .ct01 p a{
	background-color: transparent;
	text-decoration: none;
	color: inherit;
	display: block;
	width: fit-content;
	padding: 0 1em;
	border-bottom: 1px solid rgba(6,96,123,1.00);
	margin: 3em auto 0;
	transition: .3s;
}
#contact  .ct01 p a:hover{opacity: .6;}

#contact  .ct01 .mbbr{display: none;}

@media screen and (max-width: 768px) {
	#contact  .ct01 {
		padding: 5% 0 8%;
		font-size: 13px;
		line-height: 1.6;
	}
	#contact  .ct01 .mbbr{display: block;}
	@media screen and (max-width: 480px) {
		#contact {padding: 13% 0 15%;}
	}
}

/* フォーム */
input, button, textarea, select {
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
textarea {resize: horizontal;}
textarea {resize: vertical;}

#mail_box{
	margin:0 auto ;
	width:100%;
	max-width:1000px;
	padding:0 5% 0;
	position:relative;
}
#mail_box form{
	text-align: left;
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: 0.1em;
}
#mail_box form dl{margin-top: 3em;}
#mail_box form dl dt{margin-bottom: .2em;}
#mail_box form dl dt .hankaku{font-size: 75%;}
#mail_box form dl dt .hissu{font-size: 75%;color:#E92E00;}
#mail_box form dl dd{width: 100%;}
#mail_box form dl dd textarea {
	box-sizing:border-box;
	border:solid 1px #999;
	padding:2%;
	width:100%;
	min-height: 280px;
	max-height: 440px;
	line-height:1.38;
	color:#393939;
	background-color: #fff; 
}
#mail_box form dl dd select{
	box-sizing:border-box;
	padding:2.2% 1.8%;
	width:100%;
	border:1px solid #858585;
	background:#FFF;
	margin:1% 0 0 0;
}
#mail_box form dl dd input{
	width: 100%;
	padding: 2%;
	background-color: #fff;
	border: 1px solid #999;
}
#mail_box form .contact-btn input{
	display: block;
	width: 13em;
	margin: 3em auto 0;
	padding: 2%;
	background-color: #fff;
	color: #06607b;
	border: 1px solid #06607b;
	transition: .3s;
	text-align: center;
}
#mail_box form .contact-btn input:hover{background-color: #06607b;color: #fff;}

@media screen and (max-width: 1024px) {
	#mail_box{max-width:100%;padding:0 5% 0;}

	@media screen and (max-width: 768px) {
		#mail_box form{font-size: 13px;}
	}
}