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

h3{
font-size:18px;
margin-bottom:16px;
color:#72A6BE;
font-weight:bold;
}


h4{
font-size:20px;
margin-bottom:10px;
font-weight:bold;
}


#wrap h5{
font-size:18px;
margin-bottom:10px;
font-weight:bold;
}
#wrap p{
line-height:2.0em;
}
strong{
font-weight:bold;
}
.right{
text-align:right;
}
.center{
text-align:center;
}
#wrap ul{
margin:0 0 16px 20px;
}
#wrap ul li{
	line-height:1.6em;
	margin-bottom:16px;
	list-style-type: disc;
}
#wrap ol{
margin:0 0 16px 40px;
}
#wrap ol li{
list-style-type: decimal;
line-height:2.0em;
margin-bottom:16px;
}
#wrap dt{
margin-bottom:8px;
}
#wrap dd{
margin-bottom:20px;
padding-left:8px;
}
#wrap table{
width:100%;
}
#wrap table th{
vertical-align:top;
width:20%;
}
.col1{
color:#E3007F;
}
@media only screen and (min-width: 768px) {
h3{
font-size:28px;
margin-bottom:32px;
}
h4{
font-size:24px;
}

}



#about h2{
	text-align:center;
	margin-bottom:20px;
}
#about .tit{
	text-align:center;
	color:#72A6BE;
	margin-bottom:20px;
}
#about .tit h2{
	color:#72A6BE;
	font-size:20px;
	font-family: 'Kiwi Maru', serif;
}

.point{
	background-color:#72A6BE;
	padding:30px 0;
	margin-bottom:30px;
	color:#FFF;
}
#about h3{
font-size:20px;
margin-bottom:12px;
}

#about .feature1{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
}
#about .feature1 div.imgBox {
	text-align:center;
}
#about .feature1 div.txtBox {
	padding-right:10px;
}
#about .feature1 h3{
	color:#FFF;
	font-family: 'Kiwi Maru', serif;
	background: url(../images/about/feature1.png) no-repeat left top;
	padding-left:90px;
}
#about .feature1 h3 strong{
	color:#FFF000;
}
#about .feature1 dl dt{
	font-size:24px;
}

.fea01{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
}

#about div.fea01 div.feaImg {
	text-align:center;
}

#about .feature2{
	display: flex;
	flex-wrap: wrap; /* flex-flow:column;はアイテムを縦に並べる */
	margin-bottom:30px;
	justify-content: center;
}
#about .feature2 .feaBox{
	padding:0;
	margin:0 auto 20px;
	width:100%;
}

#about .feature2 .fea02 h3{
	color:#FFF;
	font-family: 'Kiwi Maru', serif;
	background: url(../images/about/feature2.png) no-repeat left top;
	padding-left:90px;
}
.fea02{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
}
.fea02 div.feaImg {
	text-align:center;
}

#about .feature2 .fea03 h3{
	color:#FFF;
	font-family: 'Kiwi Maru', serif;
	background: url(../images/about/feature3.png) no-repeat left top;
	padding-left:90px;
}
#about .feature2 h3 strong{
	color:#FFF000;
}
.fea03{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
}
.fea03 div.feaImg {
	text-align:center;
}

.point2{
	background-color:#D5E5EC;
	padding:30px 0;
	margin-bottom:30px;
	text-align:center;
}

.greeting{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
}
.greeting div.greetingImg {
	text-align:center;
}
#about .greeting .greetingTxt h3{
	font-family: 'Kiwi Maru', serif;
}

@media only screen and (min-width: 768px) {
#about .tit{
	display:none;
}
#about h2{
	margin-bottom:40px;
}
#about h3{
font-size:24px;
margin-bottom:16px;
letter-spacing: -2px;
}
.point{
	padding:40px 0;
	margin-bottom:60px;
}
#about .feature1{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
	margin:0 auto 40px;
}
.feature1 div.imgBox {
	flex: 0 0 450px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 2;/* 回り込みを右へ */
}
.feature1 div.txtBox {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 1;/* 回り込みを右へ */
	padding-left:20px;
	margin-right:30px;
}
.fea01{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
}
.fea01 div.feaImg {
	flex: 0 0 150px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 2;/* 回り込みを右へ */
}
.fea01 div.feaTxt {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 1;/* 回り込みを右へ */
	padding-right:20px;
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
}
#about .feature2{
	display: flex;
	flex-wrap: wrap; /* flex-flow:column;はアイテムを縦に並べる */
}
#about .feature2 .feaBox{
	padding:0;
	margin:0 1% 20px;
	width:48%;
}

.fea02{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
}
.fea02 div.feaImg {
	flex: 0 0 220px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 2;/* 回り込みを右へ */
}
.fea02 div.feaTxt {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 1;/* 回り込みを右へ */
	padding-right:10px;
}

.fea03{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
}
.fea03 div.feaImg {
	flex: 0 0 150px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 2;/* 回り込みを右へ */
}
.fea03 div.feaTxt {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 1;/* 回り込みを右へ */
	padding-right:10px;
}


.point2{
	padding:40px 0;
	margin-bottom:60px;
}

.greeting{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
}
.greeting div.greetingImg {
	flex: 0 0 300px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 2;/* 回り込みを右へ */
}
.greeting div.greetingTxt {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 1;/* 回り込みを右へ */
	padding-right:40px;
}
#about .greeting div.greetingTxt h3 {
font-size:32px;
}

}


#course h2{
	text-align:center;
	margin-bottom:20px;
}
#course .tit{
	text-align:center;
	color:#72A6BE;
	margin-bottom:20px;
}
#course .tit h2{
	color:#72A6BE;
	font-size:20px;
	font-family: 'Kiwi Maru', serif;
}
.coursemenu{
	background-color:#72A6BE;
	padding:30px 0;
	margin-bottom:30px;
}
.coursemenu h3{
	color:#FFF;
	text-align:center;
}

.menu{
	background-color:#FFF;
	padding:12px;
	border-radius:10px;
	margin-bottom:20px;
}
#course p.copy{
	text-align:left;
	color:#FFF;
}

.menuBox{
	border-bottom:1px dotted #72A6BE;
	margin-bottom:12px;
}
.menuBox h4{
	color:#5898B1;
	font-size:16px;
}
.menuBox h4 span{
	font-size:20px;
}
.menudesc{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
	padding-left:20px;
}
.menudesc div.price {
	color:#E4007F;
	text-align:center;
}
.menudesc div.price p span {
	font-size:26px;
}
.menudesc div.price p strong {
	background-color:#E4007F;
	color:#FFF;
	padding:4px;
}

@media only screen and (min-width: 768px) {
#course .tit{
	display:none;
}
#course h2{
	margin-bottom:40px;
}
#course p.copy{
	text-align:center;
}
.coursemenu{
	padding:40px 0;
	margin-bottom:60px;
}
.menu{
	padding:30px 100px;
	width:950px;
	margin:0 auto 32px;
}
.menuBox{
	margin-bottom:24px;
}
.menuBox h4{
	font-size:20px;
}
.menuBox h4 span{
	font-size:32px;
}

.menudesc{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
	padding-left:24px;
}
.menudesc div.price {
	flex: 0 0 240px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 2;/* 回り込みを右へ */
	text-align:right;
}
.menudesc div.price p span {
	font-size:28px;
}
.menudesc div.price p strong {
	padding:4px 8px;
}

.menudesc div.menuTxt {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 1;/* 回り込みを右へ */
	padding-right:20px;
}

}

#faq h2{
	text-align:center;
	margin-bottom:20px;
}
#faq .tit{
	text-align:center;
	color:#72A6BE;
	margin-bottom:20px;
}
#faq .tit h2{
	color:#72A6BE;
	font-size:20px;
	font-family: 'Kiwi Maru', serif;
}

.faqBox{
background-image: -webkit-image-set(
    url("../images/faq/ic_q.png") 1x,
    url("../images/faq/ic_q_2x.png") 2x);
  background-image: image-set(
    url("../images/faq/ic_q.png") 1x,
    url("../images/faq/ic_q_2x.png") 2x);
	background-repeat:no-repeat;
	padding-left:45px;
	width:95%;
	margin:0 auto 40px;
}
.faqBox h3{
	line-height:25px;
	background: linear-gradient(transparent 70%, #FFF100 0%);
	display: inline;
}
#wrap .faqBox p{
	margin-top:12px;
}
@media only screen and (min-width: 768px) {
#faq .tit{
	display:none;
}
#faq h2{
	margin-bottom:40px;
}
.faqBox{
	width:600px;
	margin:0 auto 60px;
}
.faqBox h3{
	margin-bottom:24px;
}
#wrap .faqBox p{
	margin-top:16px;
}
}


#access h2{
	text-align:center;
	margin-bottom:20px;
}
#access .tit{
	text-align:center;
	color:#72A6BE;
	margin-bottom:20px;
}
#access .tit h2{
	color:#72A6BE;
	font-size:20px;
	font-family: 'Kiwi Maru', serif;
}

#access .gmap {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%; /* 比率を4:3に固定 */
  margin:0 auto 30px;
}

#access .gmap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.accessBox{
	display: flex;
	flex-flow: column;/* flex-flow:column;はアイテムを縦に並べる */
}
.accessBox div.imgBox {
	text-align:center;
	margin-bottom:10px;
}
#access .accessBox div.txtBox h2{
	text-align:left;
	margin-bottom:0px;
}
#wrap .accessBox div.txtBox p {
	line-height:1.5em;
}
#wrap #access .accessBox div.txtBox p.add{
	font-size:18px;
}
#wrap #access .accessBox div.txtBox p.hours{
	font-size:18px;
	font-weight:bold;
}

@media only screen and (min-width: 768px) {
#access .tit{
	display:none;
}
#access h2{
	margin-bottom:40px;
}
#access .note {
	text-align:center;
}
#access .gmap {
  width: 600px;
  padding-top: 35%; /* 比率を4:3に固定 */
  margin:0 auto 60px;
}
.accessBox{
	flex-flow: row;/* flex-flow:row;はアイテムを横に並べる */
	margin:0 auto 40px;
}
.accessBox div.imgBox {
	flex: 0 0 450px;/* ウィンドウ幅に連動させず、幅340pxで固定 */
	order: 1;/* 回り込みを右へ */
	text-align:right;
	margin-bottom:20px;
}
.accessBox div.txtBox {
	flex: 1 1 auto;/* ウィンドウ幅に連動して伸縮 */
	order: 2;/* 回り込みを右へ */
	padding-left:20px;
}
#wrap #access .accessBox div.txtBox p.add{
	font-size:18px;
}
#wrap #access .accessBox div.txtBox p.hours{
	font-size:18px;
	font-weight:bold;
}

}

