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

#headerArea{position:absolute;width: 100%;background: none;}
#headerArea .logoBox{width: 40%;}
#headerArea h1 img{width: 80%;}

.sectionInner .normalBtn01{ background:none; padding:0; margin:3em 0 0;}
.normalBtn01{background:url(../images/img_contents04.png) no-repeat center center/cover;padding: 40px 0;margin-top: 0em;}
.normalBtn01 .txtBtn .subText{font-size: 140%;font-weight:bold;display:inline-block;padding:0 1.2em 0.5em;position:relative;}
.normalBtn01 .txtBtn .subText:before,
.normalBtn01 .txtBtn .subText:after{
	display:inline-block;
	font-size:1.25rem;
	position:absolute;
	top:0;
	bottom:0;
	margin:auto;
}
.normalBtn01 .txtBtn .subText:before{ content:"／"; transform:scale(-1,1); left:0;}
.normalBtn01 .txtBtn .subText:after{ content:"／"; right:0;}
.normalBtn01 .cmpbnr{width: 90%;}

#webKesaiSec .sectionInner .normalBtn01{ background:none; padding:0; margin:3em 0 0;}
#webKesaiSec .normalBtn01{background:url(../images/img_contents04_b.png) no-repeat center center/cover;padding: 3em 5% 3em;margin-top: 1em;}
#webKesaiSec .normalBtn01 .txtBtn .subText{ font-size:1.25rem; font-weight:bold; display:inline-block; padding:0 1.2em 0.5em; position:relative;}
#webKesaiSec .normalBtn01 .txtBtn .subText:before,
#webKesaiSec .normalBtn01 .txtBtn .subText:after{display:inline-block;font-size: 90%;position:absolute;top:0;bottom:0;margin:auto;}
#webKesaiSec .normalBtn01 .txtBtn .subText:before{ content:"／"; transform:scale(-1,1); left:0;}
#webKesaiSec .normalBtn01 .txtBtn .subText:after{ content:"／"; right:0;}
#webKesaiSec .normalBtn01 .txtBtn .sub02Tex{}
#webKesaiSec .normalBtn01 .txtBtn .subText {font-size: 140%;font-weight: bold;display: inline-block;padding: 0 1.2em 0.5em;position: relative;}
#webKesaiSec .formBox.normalBtn01 .formBtn{font-size: 150%;max-width: 600px;}

.dispInBlock{display: block;}

/*----------------------------------------------------------------------------
***                                                            ファーストビュー
----------------------------------------------------------------------------*/

#mainView{background: rgba(255,255,255,0.7) url(../images/img_top.jpg) no-repeat center right 50%/auto 100%;background-blend-mode: lighten;width: 100%;height: auto;padding: 5em 0 0em;}
#mainView .mainViewInner{padding: 1em 0 2em;}
#mainView .bgBox{display:inline-block;padding: 2em 2em 0;width: 100%;}
#mainView .bgBox .formBox{  margin:2em auto 0;}
#mainView .formBox.smallBtn .formBtn{max-width: initial;min-width: initial;font-size: 150%;padding: 0.7em 0em 0.7em;}
#mainView .cmBtn{ position:absolute; right:1em; bottom:40px;}
.formBox .sub02Text{text-align: center;font-size: 100%;font-weight: bold;margin-top: 1em;}
#btnBox img {border-radius: 5px; }

/*-- 新・お茶の間留学とは？ --*/
#aboutSec {}
#aboutSec .phocha .ttl01 .leftTtl{width: auto;padding: 0 5%;}
#aboutSec .phocha .ttl01 {width: auto;margin: 0 auto 0;padding: 50px 0;display: block;}
#aboutSec .phocha .ttl01 .smallTxt{font-size: 20px;}
#aboutSec .phocha .ttl01 .rightImg{margin-top: 1em;padding: 0 5%;}
#aboutSec .phocha .ttl01 .txtInner{width: auto;}

#aboutSec .phocha .ttlTxt{font-size: 160%;line-height: 1.2;text-align: left;}
#aboutSec .phocha img{width: 90%;}
#aboutSec .phocha .rightImg p{}
#aboutSec .phocha .ttl01 img{margin-top: 0px;}
#aboutSec .normalBtn01{margin-top: -3em;}

#aboutSec .phocha .ttl01 .rightImg .pointBtn { background: #00b2bc;border-radius: 20px;width: 100%;padding: 1% 5%;font-weight: 600; position: relative; margin: 0 auto;}



#mainView .formBox.smallBtn .formBtn{ width:100%;}

/*-- 新・お茶の間留学とは？ --*/

/*-- 新・お茶の間留学の特長 --*/
#featureSec {}
#featureSec h2{max-width: inherit;padding-top: 50px;font-size: 160%;}
#featureSec .smallTxt{font-size: 75%;}
#featureSec .phocha .backColor{}
#featureSec .phocha .ttl02 .leftTtl{width: auto;padding: 0 5%;}
#featureSec .phocha .ttl02{max-width: inherit;padding: 50px 0 0;display: block;}
#featureSec .phocha .ttl02 .txtInner{width: auto;margin: 0 auto;}
#featureSec .phocha .ttl02 .rightImg{margin-top: 1em;padding: 0 5%;}
#featureSec .phocha .ttl02.feature01{padding-top: 3em;}
#featureSec .phocha .ttl02.feature02 p img{margin-right:0;width: 80%;}
#featureSec .phocha .ttl02.feature03 p img{margin-right:0;width: 65%;margin-top: -1%;}
#featureSec .phocha .ttl02.feature04{align-items: flex-start;}
#featureSec .phocha .ttl02.feature05 p img{margin-right:0;width: 65%;}

#featureSec .phocha .ttlTxt{font-size: 160%;line-height: 1.2;margin: 2px 0 5px 0;}
#featureSec .phocha img{width: 90%;}
#featureSec .phocha .rightImg p{}
#featureSec .normalBtn01{margin-top: 5em;}
/*-- 新・お茶の間留学の特長 --*/

/*-- カリキュラム日常英会話 --*/
#nichijoSec .backColor{background-color: #feefd8;height: auto;padding-top: 55px;}
#nichijoSec .ttl{width: 100%;margin: 0 auto 0;padding: 0 5%;display: block;}
#nichijoSec .nichijoBox .leftTtl{font-size: 180%;color: #1a1a1a;font-weight: bold;line-height: 1.3;float: none;}
#nichijoSec .nichijoBox .leftTtl .orangeTxt{color: #f7931e;font-size: 200%;font-weight: bold;}

#nichijoSec .nichijoBox .rightTxt{width: auto;margin-top: 20px;line-height: 2;float: none;}
#nichijoSec .boxInner{width: auto;margin: -20em auto 0;padding: 20em 5% 0;background: #fff;}
#nichijoSec .listBox li{width: 47%;margin-bottom: 1em;}
#nichijoSec .listBox li span{/*display: block*/;padding-bottom: 3%;}
#nichijoSec .listBox li .master{padding: 4% 0 1%;margin-bottom: 2%;}
#nichijoSec .boxInner .priceBox .tableBox .planTable{}
#nichijoSec .btnImg{text-align: center;margin-bottom: 20px;}
#nichijoSec .innerTxt{text-align: center;font-size: 100%;}
#nichijoSec .contentsImg{margin: 0 auto 20px;}

/*流れ*/
#nichijoSec .sectionInner{margin: 0;padding: 1em 0;}
#nichijoSec .lessonNagareBox{width: 100%;margin: 15px auto 0;}
#nichijoSec .lessonNagareBox li{padding: 0 0.5em;margin-bottom: 2em; width: 32%;}
#nichijoSec .lessonNagareBox li:after{}
#nichijoSec .lessonNagareBox li:first-child{}
#nichijoSec .lessonNagareBox li:first-child:after{border: none;}
#nichijoSec .lessonNagareBox .dummy{border: none;}
#nichijoSec .lessonNagareBox .dummy:after{border: none;}
/*流れ*/


/*-- 毎日プラン --*/
#nichijoSec .ttlTxt{font-size: 21px;text-align: center; margin-bottom: 0;}
#nichijoSec .subttl p{width: 45%; font-size: 110%; margin: 1em 0.5em;}
.priceBox .mainichiPlan .ttl-h4{font-size: 125%;}
.priceBox .planBox{width: 100%; margin: 0 auto; padding: 1em;}
.priceBox .ttlBox{flex-wrap: wrap;}
.priceBox .ttl-h4{width: 100%; max-width: none; height: auto; padding: 1em 0; color: #fff; text-align: center; display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 1; margin: 0 0 1em 0;}
#nichijoSec .priceBox .listBox{width: 100%;}
.priceBox .planBox .listBox .listItem{font-size: 100%; font-weight: bold; width: 100%; padding: 0 0 0 1.4em; text-indent: -1.4em; margin-bottom: 0.5em; line-height: 1.2;}
.priceBox .planBox .listBox .listItem .txtAttentionPrice{font-size: 110%;}
.priceBox .txtAnnotation{font-size: 80%; padding: 0 0 0 1em; text-indent: -1em;}
.priceBox .planTableBox{margin-top: 2em; flex-wrap: wrap;}
.priceBox .tableBox{width: 100%;}
.priceBox .tableBox.nativeBox{margin-bottom: 1em;}
.priceBox .planBox.mainichiPlan .txtPrice span{width: 25%; top: -1.8em; right: -1.3em;}
.priceBox{width: 100%; margin: 0 auto;}
.priceBox .planBox.mainichiPlan .txtPrice{font-size: 175%;}
.priceBox .planBox.mainichiPlan .txtLabel{font-size: 115%; width: 90%;}
#nichijoSec .priceBox .listBox li{width: 100%;}

/*-- 固定プラン --*/
.priceBox .koteiPlan .ttl-h4{font-size: 125%;}

/*-- フリープラン --*/
.priceBox .freePlan .ttl-h4{font-size: 125%;}
.priceBox .freePlan .ttl-h4 .popular{left: -4%; top: -70%;}
.priceBox .planTable .popularBox .popular{width: 35%; top: -80%; left: -17%;}


/*.priceBox li{border-top: 1px solid #cccccc;}*/
.contentsImg{display: block; justify-content: flex-start ;width: 100%;}
.videoBox{display: block;width: 100%;margin-bottom: 2em;margin-top: 5em;}

/*コンテンツイメージ消したcss*/
.contentsImgBox{margin: 30px auto 30px; text-align: center;}
.contentsImg img{width: 100%; height: auto;}
.contentsImgBox p{font-size: 150%;}
.contentsImgBox .listBox{margin-top: 0.5em;}
.contentsImgBox .listBox li{width: 30%;}
.contentsImgBox .listBox li:nth-child(2){margin: 0 3%;}

/*コンテンツイメージ消したcss*/
.contentsImgBox{}
/*-- カリキュラム日常英会話 --*/

/*-- カリキュラムこども英会話 --*/
#kidsSec .backColor{background-color: #ffebf6;height: auto;padding-top: 55px;}
#kidsSec .ttl{max-width: 1000px; width: auto;margin: 0 auto 0;padding: 0 5%;display: block;}
#kidsSec .kidsBox .leftTtl{font-size: 180%;color: #1a1a1a;font-weight: bold;float: none;}
#kidsSec .kidsBox .leftTtl .pinkTxt{color: #fc75bf;font-size: 200%;font-weight: bold;line-height: 1.3;}

#kidsSec .kidsBox .rightTxt{width: auto;margin: 0 auto;line-height: 2;float: none;margin-top: 20px;}

#kidsSec .kidsBox .boxInner .contentsImg{width: 100%;margin: 0 auto;height: auto; max-width: 100%;}

#kids02Sec{margin-bottom: 0;}
#kids02Sec .sectionInner{padding-bottom: 0;}
#kids02Sec .lessonNagareBox dt{text-align:center;font-size: 190%;line-height: 1;padding: 0.3em 0;background: #00b2bc;color: #fff;}
#kids02Sec .lessonNagareBox .lessonNagareList{padding-top:1em;}
#kids02Sec .lessonNagareBox .lessonNagareList li{text-align: center;padding: 0;border-left:1px solid #4d4d4d;position: relative;padding: 0 0.5em}
#kids02Sec .lessonNagareBox .lessonNagareList li:after{content: "";display:block;width: 0.5em;height: 0.5em;position:absolute;left: -9%;top: 45%;border-top: 2px solid #00b2bc;border-right: 2px solid #00b2bc;background: #fff;transform: rotate(45deg);box-shadow: 0px 0px 0px 9px rgba(255,255,255,1);}
#kids02Sec .lessonNagareBox .lessonNagareList li:first-child{border-left:none;}
#kids02Sec .lessonNagareBox .lessonNagareList li:first-child:after{display:none;}
#kids02Sec .lessonNagareBox .lessonNagareList li.dummy{border: none;}
#kids02Sec .lessonNagareBox .lessonNagareList li.dummy:after{border: none;}
#kids02Sec .lessonNagareBox .txtHukushu{color: #4d4d4d; font-size: 60%;vertical-align: top;}
#kids02Sec .lessonNagareBox .txtMinutes{display:inline-block;background:#fff;color:#4d4d4d;font-size: 80%;border-radius:10px;padding: 0.2em 0.2em 0.2em;margin: 0 0 0 0.5em;vertical-align: bottom;}
#kids02Sec .part1Box{margin-bottom:2em;}
#kids02Sec .part2Box{margin-top:2em;}
#kids02Sec .part2Box dt{background:#fbb03b;}
#kids02Sec .part2Box .lessonNagareList li{}
#kids02Sec .part2Box .lessonNagareList li:after{border-top:2px solid #fbb03b; border-right:2px solid #fbb03b;}
#kids02Sec .hosokuBox{background: #ffefd8;padding:1em 0;margin: 1em 0 0;}
#kids02Sec .hosokuBox p{font-weight:bold;font-size: 120%;}
#kids02Sec .boxArea {padding: 3em 0 0 0;}
#kids02Sec .boxArea .txtBox{padding: 0 2em 0 0;margin: 0;}
#kids02Sec .boxArea .txtBox dt{font-size:120%;color: #4d4d4d;display:inline-flex;align-items: center;line-height: 1;margin-bottom: 0.5em;}
#kids02Sec .boxArea .txtBox dt:before{content:""; display:inline-block; width:1em; height:1em; margin:0 0.2em 0 0; background:#f991c0;}
#kids02Sec .boxArea .txtBox dd{font-size: 100%;color: #4d4d4d;margin-bottom: 1.5em;padding: 0 0 0 1.5em;}

#kids02Sec .ttlBox .ttl-h3 {font-size: 1.5rem;color: #000;line-height: 1;position: relative;margin: 0;font-feature-settings: normal;margin-bottom: 10px;}

#kidsSec .boxInner{width: auto;margin: -18em auto 0;padding: 18em 5% 0;background: #fff;}
#kidsSec .btnImg{text-align: center;margin-bottom: 20px;}

#kidsSec .contentsImg{margin: 110px 0 0;}

#kidsSec .ttlTxt{font-size: 21px;text-align: center; margin-bottom: 0;}
#kidsSec .subttl p{width: 45%; font-size: 110%; margin: 1em 0.5em;}
.priceBox .planBox.kidsPlan .ttl-h4{font-size: 125%; /*background: url(../images/img_contents17.jpg) no-repeat center right 2%/auto 90%, #f991c0; padding-right: 30%;*/}
.camBox{display: block;}
.priceBox .planBox.kidsPlan .tableBox.koteiBox{width: 100%; margin: 0 auto 1em;}
.priceBox .planBox.kidsPlan .tableBox.freeBox{width: 100%;}
#kidsSec .priceBox{width: 100%;}
#kidsSec .priceTxt small{font-size: 75%;font-weight: normal;margin-left: 10px;display: inline-block;width: auto;text-align: right;}
#kidsSec .planBox.kidsPlan .valueBox .value{width: 20%; top: -180%; left: -10%;}
/*-- カリキュラムこども英会話 --*/


/*-- カリキュラムカランメソッド --*/
#callanSec .backColor{background-color: #cfd7e2;height: auto;padding-top: 55px;}
#callanSec .ttl{max-width: 1000px;width: auto;margin: 0 auto 0;padding: 0 5%;display: block;}
#callanSec .callanBox .leftTtl{font-size: 180%;color: #1a1a1a;font-weight: bold;float: none;}
#callanSec .callanBox .leftTtl .blueTxt{color: #103770;font-size: 200%;font-weight: bold;line-height: 1.3;}
#callanSec .callanBox .rightTxt{width: auto;margin: 0 auto;line-height: 2;float: none;margin-top: 20px;}
#callanSec .callanBox .videoBox .videoIframe iframe{width: 100%; height: auto;}
#callanSec .callanBox .videoBox .videoTtl{font-size: 120%;text-align: center;margin-bottom: 15px;}
#callanSec .boxInner{width: auto;margin: -15em auto 0;padding: 12em 5% 0;background: #fff;}
#callanSec .btnImg{text-align: center;margin-bottom: 20px;}

/*流れ*/
#callanSec .sectionInner{margin: 0;padding: 1em 0;}
#callanSec .lessonNagareBox{width: 100%;margin: 15px auto 0;}
#callanSec .lessonNagareBox li{padding: 0 0.5em;margin-bottom: 2em; width: 32%;}
#callanSec .lessonNagareBox li:after{}
#callanSec .lessonNagareBox li:first-child{}
#callanSec .lessonNagareBox li:first-child:after{border: none;}
#callanSec .lessonNagareBox .dummy{border: none;}
#callanSec .lessonNagareBox .dummy:after{border: none;}
/*流れ*/


#callanSec .ttlTxt{font-size: 21px;text-align: center; margin-bottom: 0;}
#callanSec .subttl p{width: 45%; font-size: 110%; margin: 1em 0.5em;}
#callanSec .priceBox{width: 100%;}
.priceBox .planBox.callanPlan .ttl-h4{font-size: 125%; /*background:url(../images/img_contents08_new.png) no-repeat center right 2%/auto 90%, #212e5b; height: auto; padding-right: 30%;*/}
.priceBox .planBox.callanPlan .tableBox{width: 100%;}
.priceBox .planBox .txtBox{margin: 1em auto;}
/*-- カリキュラムカランメソッド --*/

/*-- 決済から開始までのステップ --*/
#webKesaiSec h2{max-width: inherit;margin: 0px auto 15px;padding-top: 20px;font-size: 160%;}
#webKesaiSec .listBox{}
#webKesaiSec .listBox ul{margin-bottom: 2em;display: block;}
#webKesaiSec .listBox li{;margin: 0 0 0.5em;line-height: 1.4;padding: 1em 0 0.7em;border-radius: 50px;font-size: 120%;width: auto;height: auto;position: relative;}
#webKesaiSec .listBox li .txtStep{font-size: 110%;margin-bottom: 0;position: absolute;left: 1em;margin-top: -1%;}
#webKesaiSec .listBox li .icoStep{display: inline-block;margin: 0;position: absolute;top: 50%;right: 0.5em;transform: translate(0, -50%);width: auto;height: auto;}
#webKesaiSec .listBox li .icoStep img{width: 50%;}
#webKesaiSec .listBox .step3{}
#webKesaiSec .listBox .step3 .txtStep{}
#webKesaiSec .listBox li.step2:before{content: none;}
#webKesaiSec .listBox li.step3:before{content: none;}
#webKesaiSec .listBox p{font-size: 150%;line-height: 1.4em;}

/*-- キャンペーン文言 --*/
.campaign_txt{width: 95%;}
#nichijoSec .priceBox .planBox .fukidashi{right: -1em; top: -1.5em; width: 25%;}
.twoBox{display: block;}
.twoBox .campaign_txt.two{width: 95%;}