@charset "utf-8";
/* CSS Document */
/*----------------------------------------------------------------------------
***                                                            ファーストビュー
----------------------------------------------------------------------------*/
#mainView{background:url(/ochanoma/images_shin/conversation/img_header01.jpg) no-repeat center center/cover;max-width: 1200px;margin: 0 auto 0;}
#mainView .mainViewInner{max-width:1000px;width: 100%;margin:0 auto;padding: 40px 0px 40px 50px;border-top: none;}
#mainView .bgBox{border:1px solid #fff;display:inline-block;padding: 0 0;}

/*-- お茶の間留学キャンペーンPOPUP--*/
.close_btn { font-size:25px; cursor: pointer;font-weight: bold;line-height: 0.4em;}
.close_txt{font-size: 9px;}
.popup_content { width: 95%; /*height: 70%;*/border: solid 10px #DA594E;}
#campaignSec .pop_txt{position: absolute;/*left: 7%; bottom: 4%;*/font-size: 95%; top: 52%;}
#campaignSec .address_register{padding-left: 3%;}
#campaignSec .cp_banner img{padding: 0 1em; margin: 2em auto 0;}
#campaignSec .popup_content img{width: 100%;}
#campaignSec .taikenBox{font-size: 150%;}
#campaignSec .taiken{width: 80% ;font-size: 160%}
#campaignSec .formBox{margin: 1.0em 0 1.0em 0;}
.popup_content .smalltxt{font-size: 70%; line-height: 1.4;}


/*-- NOVAオリジナルカリキュラム --*/
#ochanomaSec{}
#ochanomaSec .contentsBox{max-width: 910px;}

/*-- 選べるレッスンスタイル --*/
#lessonStyleSec{}
#lessonStyleSec .contentsBox{max-width:960px;text-align:center;margin: 3.5em 0 0 0;}
#lessonStyleSec .contentsBox .txtAnnotation{display:inline-block; margin:2em 0 0;}
#lessonStyleSec .contentsBox .lessonStyleSelectBox{display:block;}
#lessonStyleSec .nativeKoushiBox{max-width:none;width: 100%;background: #fff;}
#lessonStyleSec .philippinesKoushiBox{max-width:none;width: 100%;background: #fff;margin: 4em 0 0;}
#lessonStyleSec .koushiDL{display: flex;flex-direction: column;height: 100%;}
#lessonStyleSec .koushiDL .koushiTtl{background:#00b2bc;color:#fff;text-align:center;font-size: 140%;line-height: 1;padding: 0.6em 0em 0.5em;}
#lessonStyleSec .koushiDL .koushiSubTtl{position: relative;font-size: 125%;font-weight: bold;padding: 1em 0 0.5em 9em;line-height: 1;}
#lessonStyleSec .koushiDL .koushiSubTtl .koushiImg{margin: 0 0 0;display:inline-block;position: absolute;bottom: 0;left: 0;width: 6em;}
#lessonStyleSec .koushiContents{padding: 1em 1em;}
#lessonStyleSec .lessonTypeBox{margin-bottom: 2em;}
#lessonStyleSec .lessonTypeBox:last-child{margin-bottom:0;}
#lessonStyleSec .lessonTypeBox .lessonTypeDL{}
#lessonStyleSec .lessonTypeBox .lessonTypeDT{font-size: 115%;}
#lessonStyleSec .lessonTypeBox .lessonTypeDT .txtSmall{font-size:80%;}
#lessonStyleSec .lessonTypeBox .lessonTypeDT:before{content:""; display:inline-block; width:1em; height:1em; background:#00b2bc; border-radius:50%; margin:0 0.4em 0 0;}
#lessonStyleSec .lessonTypeBox .lessonTypeDD{position: relative;padding: 0 0 0 1.8em;}
#lessonStyleSec .lessonTypeBox .lessonTypeDD .txt{margin:0;padding: 0 35% 0 0;}
#lessonStyleSec .lessonTypeBox .lessonTypeDD .img{position:absolute;bottom: 0;right:0;margin: 0;width: 30%;}
#lessonStyleSec .lessonTypeBox .lessonTypeDD .imgph{position:absolute;bottom: 0;right:1%;margin: 0;width: 32%;}
#lessonStyleSec .lessonPlanBox .lessonPlanDT .planLinkBtn{background: #f7931e;color: #fff;padding: 0.4em 0.6em;line-height: 1;border-radius: 10px;display: flex;justify-content: center;position: relative;}
#lessonStyleSec .lessonPlanBox .lessonPlanDT .planLinkBtn:after{content: "";display: block;width: 0.5em;height: 0.5em;position: absolute;top: calc(50% - 0.35em);right: 1em;border-top: 3px solid #fff;border-right: 3px solid #fff;transform: rotate(45deg);/* box-shadow: 0px 0px 0px 9px rgba(255,255,255,1); */}
#lessonStyleSec .lessonPlanBox .lessonPlanDT .txtLabel{color:#ffff00;font-size: 90%;}
#lessonStyleSec .lessonPlanBox .lessonPlanDD{padding: 0.2em 1em 0;margin:0 0 1em;}
#lessonStyleSec .lessonPlanBox .lessonPlanDD:last-child{margin:0;}
#lessonStyleSec .lessonTypeBox .planBox{padding:0;margin: 0;}
#lessonStyleSec .philippinesKoushiBox .koushiDL .koushiSubTtl{padding: 1.5em 0 0.5em 3em;}
#lessonStyleSec .philippinesKoushiBox .koushiDL .koushiSubTtl .koushiImg{left:initial;right:0;width: 8em;}
#lessonStyleSec .philippinesKoushiBox .lessonTypeDD{position:relative;}

/*-- １レッスンで１ユニットを習得 --*/
#shutokuSec{}
#shutokuSec .contentsBox .listBox{max-width: 430px;margin:0 auto;padding: 0 1%;}


/*-- SEO対策 --*/
#shutokuSec .sectionInner{ padding: 30px 0;}
#shutokuSec .contentsBox .listBox li{width: 50%;text-align: center;}
#shutokuSec .contentsBox .listBox .blueTxt{font-size: 0.9em;}
#shutokuSec .contentsBox .listBox .innerTxt{width: 85%;font-size: 1.1em;padding: 1% 0;}
#shutokuSec .contentsBox .listBox .komeTxt{font-size: 12px;}


/*-- NOVAオリジナルテキスト --*/
#originalTextSec .originalTextCheckBox{background:#fff;padding: 2em 2em;margin:3em 0 0 0;}
#originalTextSec .originalTextCheckBox .ttl{color:#00b2bc;font-size: 145%;text-align: center;font-weight: bold;margin: 0 0 0.5em;}

/*-- 1回のレッスンの流れ --*/
#lessonFlowSec{}
#lessonFlowSec .lessonNagareBox dt{text-align:center;font-size: 110%;line-height: 1;padding: 0.3em 0;background: #00b2bc;color: #fff;}
#lessonFlowSec .lessonNagareBox .lessonNagareList{padding-top:1em;}
#lessonFlowSec .lessonNagareBox .lessonNagareList li{text-align: center;padding: 0 0.5em;margin: 0 0 2em 0;border-left:1px solid #4d4d4d;position: relative;width: 31%;}
#lessonFlowSec .lessonNagareBox .lessonNagareList li:after{content: "";display:block;width: 0.6em;height: 0.6em;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);}
#lessonFlowSec .lessonNagareBox .lessonNagareList li:first-child{border-left:none;}
#lessonFlowSec .lessonNagareBox .lessonNagareList li:first-child:after{display:none;}
#lessonFlowSec .lessonNagareBox .lessonNagareList .dummy{border:none;}
#lessonFlowSec .lessonNagareBox .lessonNagareList .dummy:after{border:none;}
#lessonFlowSec .txtAttention {text-align:left;}

/*-- 料金 --*/
#priceSec .contentsBox .ttlTxt{font-size: 21px; text-align: center; margin: 1em auto 0.5em;}
#priceSec .contentsBox{width: 100%;}
/*-- 毎日プラン --*/
#priceSec .contentsBox .mainichiPlan .txtBox{margin: 1em auto 0;}
#priceSec .ttlTxt{font-size: 21px;text-align: center; margin-bottom: 0;}
#priceSec .contentsBox .mainichiPlan .ttl-h4{font-size: 125%;}
#priceSec .contentsBox .planBox{width: 100%; margin: 0 auto; padding: 1em;}
#priceSec .contentsBox .ttlBox{flex-wrap: wrap;}
#priceSec .contentsBox .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;}
#priceSec .contentsBox .listBox{width: 100%;}
#priceSec .contentsBox .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;}
#priceSec .contentsBox .planBox .listBox .listItem .txtAttentionPrice{font-size: 110%;}
#priceSec .contentsBox .txtAnnotation{font-size: 80%; padding: 0 0 0 1em; text-indent: -1em;}
#priceSec .contentsBox .planTableBox{flex-wrap: wrap; margin-top: 1em;}
#priceSec .contentsBox .tableBox{width: 100%;}
#priceSec .contentsBox .planBox.mainichiPlan .txtPrice span{width: 25%; top: -1.8em; right: -1.3em;}
#priceSec .contentsBox{width: 100%; margin: 0 auto; padding: 0;}
#priceSec .contentsBox .planBox.mainichiPlan .txtPrice{font-size: 175%;}
#priceSec .contentsBox .planBox.mainichiPlan .txtLabel{font-size: 115%; width: 90%;}
#priceSec .contentsBox .listBox li{width: 100%;}
#priceSec .contentsBox .nativeBox{margin-bottom: 3%;}

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

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

.twoBox{display: block;}
.twoBox .two{width: 95%; margin: 0.3em auto 1em;}

/*-- NOVAのノウハウが詰まったオリジナルテキスト --*/
#nouhauTextSec .contentsBox{padding: 2em; border: 4px solid #00b2bc; flex-wrap: wrap; border-radius: 10px;}
#nouhauTextSec .ttlBox{width: 100%;}
#nouhauTextSec .txtSub{text-align: center;}
#nouhauTextSec .txtMain{text-align: center; display: block;}
#nouhauTextSec .formBox{margin-top: 1em;}
#nouhauTextSec .formBox.small02 .txtBtn{text-align: left;}
#nouhauTextSec .formBox.small02 .formBtn{width: 100%; justify-content: center;}
#nouhauTextSec .imgBox{width: 60%; margin: 0.5em auto 0;}