@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{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--*/
.popup_wrap input {display: none;}
.popup_overlay {display: flex;justify-content: center;overflow: auto;position: fixed;top: 0;left: 0;z-index: 9999;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.7);opacity: 0;transition: opacity 0.5s, transform 0s 0.5s;transform: scale(0);}
.popup_trigger { position: absolute; width: 100%; height: 100%;}
.popup_wrap input:checked ~ .popup_overlay { opacity: 1; transform: scale(1); transition: opacity 0.5s;}
.open_btn {position: relative;cursor: pointer; transition: .3s ease;}
.open_btn:hover{ transition: .3s ease;opacity:0.8;}
.close_btn { position: absolute; top: 2%; right: 1%; font-size:35px; cursor: pointer;font-weight: bold;line-height: 0.4em;}
.close_txt{font-size: 13px;}

.popup_content { position: relative;align-self: center;max-width:800px;width: 95%; box-sizing: border-box; background: #fff; line-height: 1.4em; transition: 0.5s;height: auto;margin: 4em auto;border: solid 15px #DA594E;}
.popup_content p{margin: 0; text-align: center; font-size: 105%;}
.popup_content p .small{font-size: 85%;}
.popup_content .txtBtn{font-size: 90%;}
.popup_content .smalltxt{font-size: 75%; text-align: left; width: 92%; margin: 1em auto 0;}
.popup_content img{width: 100%;}
#priceSec{text-align: center;}
#priceSec .cp_banner img{margin: 2em auto 0em;}
#priceSec .pop_txt{position: absolute; top: 57%;font-size: 105%;color: #333; width: 100%;}
#priceSec .address_register{padding-left: 5%;}
/*#priceSec a{color:#2d8cff; }*/

#priceSec .taikenBox{font-size: 19px;font-weight: bold;}
#priceSec .taiken{color:#000;width: 40%;padding: 0.7em; font-size: 170%;}
#priceSec .formBox{margin: 1em 0 0;}

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

/*-- 選べるレッスンスタイル --*/
#lessonStyleSec{}
#lessonStyleSec .contentsBox{max-width:960px; margin:0 auto; text-align:center;}
#lessonStyleSec .contentsBox .txtAnnotation{display:inline-block; margin:2em 0 0;}
#lessonStyleSec .nativeKoushiBox{max-width:450px;width: 50%;background: #fff;}
#lessonStyleSec .philippinesKoushiBox{max-width:450px;width: 50%;background: #fff;}
#lessonStyleSec .koushiDL{display: flex;flex-direction: column;height: 100%;}
#lessonStyleSec .koushiDL .koushiTtl{background:#00b2bc;color:#fff;text-align:center;font-size: 180%;line-height: 1;padding: 1em 0em 0.8em;}
#lessonStyleSec .koushiDL .koushiSubTtl{position: relative;font-size: 145%;font-weight: bold;padding: 1.5em 0 0.5em 8.3em;line-height: 1;}
#lessonStyleSec .koushiDL .koushiSubTtl .koushiImg{margin: 0 0 0;display:inline-block;position: absolute;bottom: 0;left: 0;}
#lessonStyleSec .koushiContents{padding:1em 2em;}
#lessonStyleSec .lessonTypeBox{margin-bottom: 2em;}
#lessonStyleSec .lessonTypeBox:last-child{margin-bottom:0.5em;}
#lessonStyleSec .lessonTypeBox .lessonTypeDL{}
#lessonStyleSec .lessonTypeBox .lessonTypeDT{font-size: 130%;}
#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.group{padding: 0 0 1em 1.8em;}
#lessonStyleSec .lessonTypeBox .lessonTypeDD .txt{margin:0;}
#lessonStyleSec .lessonTypeBox .lessonTypeDD .img{position:absolute;bottom: 0;right:0;margin: 0;}
#lessonStyleSec .lessonTypeBox .lessonTypeDD .imgph{position:absolute;bottom: -10%;right:4%;margin: 0; width: 33%;}
#lessonStyleSec .lessonTypeBox .lessonTypeDD .imgph img{width: 100%; height: auto;}
#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; width: 50%; }
#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 4em;}
#lessonStyleSec .philippinesKoushiBox .koushiDL .koushiSubTtl .koushiImg{left:initial; right:0;}
#lessonStyleSec .philippinesKoushiBox .lessonTypeDD{position:relative;}
#lessonStyleSec .philippinesKoushiBox .lessonPlanBox .lessonPlanDT{margin: 1.5em 0 0; padding: 0 0 0 1.8em;}
/*-- １レッスンで１ユニットを習得 --*/
#shutokuSec{}
#shutokuSec .contentsBox .listBox{max-width: 750px; margin:0 auto;}
#shutokuSec .sectionInner{ padding: 30px 0 45px;}

/*-- SEO対策 --*/
#shutokuSec .contentsBox .listBox li{width: 33%;text-align: center;}
#shutokuSec .contentsBox .listBox .blueTxt{color: #00b2bc;font-weight: bold;font-size: 16px;text-align: center;}
#shutokuSec .contentsBox .listBox .innerTxt{background-color: #00b2bc;color: #FFF;border-radius: 20px;font-size: 18px;font-weight: bold;text-align: center;width: 85%;margin: 5px auto;padding: 3px 0;}
#shutokuSec .contentsBox .listBox .innerTxt.phi{background-color: #f7931e;}
#shutokuSec .contentsBox .listBox .komeTxt{font-size: 12px;}


/*-- NOVAオリジナルテキスト --*/
#originalTextSec .originalTextCheckBox{background:#fff;padding: 2em 4em;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 .lessonNagareList{padding-top:1em;}
#lessonFlowSec .lessonNagareBox .lessonNagareList li{text-align: center;padding: 0 1em 0 1.8em;border-left:1px solid #4d4d4d;position: relative;}
#lessonFlowSec .lessonNagareBox .lessonNagareList li:after{content: "";display:block;width: 0.8em;height: 0.8em;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 .txtAttention{margin:1.5em 0 0;}

/*-- 料金 --*/
#priceSec .contentsBox{width: 900px; margin: 3em auto;}
#priceSec .contentsBox .ttlTxt{font-size: 30px; text-align: center; font-weight: bold; margin: 3em auto 2em;}
#priceSec .contentsBox .colorTtl{color: #BC0000; margin: 0 5px;}
#priceSec .contentsBox .mainichiPlan{margin-bottom: 5em;}
#priceSec .contentsBox .mainichiPlan .ttl-h4{background: #f7931e; font-size: 180%;}
#priceSec .contentsBox .ttl-h4{width: 25%; max-width: 176px; height: 4em; color: #fff; text-align: center; display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 1; margin: 0 0.8em 0 0;}
#priceSec .contentsBox .planBox .listBox .listItem{font-size: 110%; font-weight: bold;}
#priceSec .contentsBox .planBox .listBox .listItem:before{content: ""; display: inline-block; width: 1em; height: 1em; background: url(/ochanoma/images_shin/conversation/ico_contents01.png) no-repeat center center/cover; margin: 0 0.4em 0 0;}
#priceSec .contentsBox .planBox .listBox .listItem .txtAttentionPrice{color: #f991c0; font-size: 110%;}
#priceSec .contentsBox .tableBox{width: 49%;}
#priceSec .contentsBox .planTable{width: 100%;}
#priceSec .contentsBox .planTable .time td{border: none; text-align: right; padding: 0;}
#priceSec .contentsBox .planTableBox{margin-top: 2em;}
#priceSec .contentsBox .planBox.mainichiPlan .txtPrice{font-size: 215%; position: relative;}
#priceSec .contentsBox .planBox.mainichiPlan .txtPrice span{position: absolute; top: -2.5em; right: -4em;}
#priceSec .contentsBox .planBox.mainichiPlan .txtLabel{font-size: 130%;}
#priceSec .contentsBox .planTable .txtLabel{text-align: center; width: 80%; color: #fff; background: #0eb1c4; line-height: 1; padding: 0.5em 1em 0.5em; border-radius: 30px; margin: 5px auto;}
#priceSec .contentsBox .philippinesBox .planTable .txtLabel{background: #e8699e;}
/*#priceSec .contentsBox .planTable td.mantomanOnly{border: none; font-size: 90%; font-weight: normal; text-align: right; background: none;}*/
#priceSec .contentsBox .planTable th, #priceSec .contentsBox .planTable td{text-align: center; border-color: #4d4d4d; color: #3d3a39;}
#priceSec .contentsBox .planTable .priceBox{background: #fff;}
#priceSec .contentsBox .nativeBox th{background: #b3e8ec; font-size: 140%; line-height: 1; padding: 0.6em 0;}
#priceSec .contentsBox .philippinesBox th{background: #fdb8d5; font-size: 140%; line-height: 1; padding: 0.6em 0;}
#priceSec .contentsBox .planTable .lessonBox{background: #e6e6e6;}
#priceSec .contentsBox .planTable .lessonBox td{width: 50%; line-height: 1; font-size: 140%; font-weight: bold;}
#priceSec .contentsBox .planTable .txtPrice{text-align: center; font-size: 130%; line-height: 1.5em; margin: 0;}
#priceSec .contentsBox .mainichiPlan .txtBox{margin: 2em auto;}

/*-- 固定プラン --*/
#priceSec .contentsBox .koteiPlan{margin-bottom: 5em;}
#priceSec .contentsBox .koteiPlan .ttl-h4{background: #754c24; font-size: 180%;}

/*-- フリープラン --*/
#priceSec .contentsBox .freePlan .ttl-h4{background: #8cc63f; font-size: 180%; position: relative;}
#priceSec .contentsBox .freePlan .ttl-h4 .popular{position: absolute; left: -25%; top: -30%;}
#priceSec .contentsBox .planTable .popularBox{position: relative;}
#priceSec .contentsBox .planTable .popularBox .popular{position: absolute; width: 70px; top: -30%; left: -15%;}

/*-- NOVAのノウハウが詰まったオリジナルテキスト --*/
#nouhauTextSec.secBox .sectionInner{padding: 80px 0;}
#nouhauTextSec .contentsBox{padding: 2em 5em; border: 4px solid #00b2bc; border-radius: 10px;}
#nouhauTextSec .txtSub{font-size: 80%; margin-bottom: 0.2em;}
#nouhauTextSec .txtMain{font-size: 110%; color: #00B2BC; padding: 0;}
#nouhauTextSec .formBox{margin-top: 1em;}
#nouhauTextSec .formBox.small02 .txtBtn{text-align: left;}
#nouhauTextSec .formBox.small02 .formBtn{width: 100%; justify-content: center; padding: 0.5em 0 0.6em 0;}

/*-- キャンペーンバナー --*/
.cmpbnr{width: 95%; max-width: 800px; height: auto; margin: 2em auto 0;}
.cmpbnr img{width: 100%; height: auto;}
.red_solid{border: 5px solid #FE0001;}
.red_solid.topnone{border-top: 1px solid #4d4d4d;}
.red_solid.bottomnone{border-bottom: 1px solid #4d4d4d;}
.campaign_txt{text-align: center; background: #fffacd; border-radius: 15px; padding: 1em 0; margin: 0.3em auto 2em; width: 95%;}
.campaign_txt span{color: #FE0001;}
.campaign{color: #FE0001; font-size: 150%; text-align: center; font-weight: bold; margin: 0;}
.campaign_txt.two{width: 48%;}