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

body{width: 100%;}
.secBox > .sectionInner{border-top:1px solid #00b2bc;}
/*----------------------------------------------------------------------------
***                                                            ファーストビュー
----------------------------------------------------------------------------*/
#mainView{background: url(https://www.nova.co.jp/ochanoma/images_shin/top/img_header2602sp.jpg) no-repeat top right 35%/cover;max-width: 1200px;margin: 0 auto 0;}
#mainView .mainViewInner{max-width:1000px;width: 100%;margin:0 auto;padding: 1em 1em 3em 1em;}
#mainView .bgBox{ width:75%; /*border:1px solid #fff;*/display:inline-block;/*padding: 1.5em 1.5em;background: rgba(0,0,0,0.15);*/}
#mainView .bgBox .sabttlBox{font-size:90%;}
#mainView .bgBox .sabttlBox .boxInner{font-size:125%;}
#mainView .bgBox .ttlBox02{text-align: center;}
#mainView .bgBox .ttlBox02 img{width: 93%;}
#mainView .formBox{margin:1.9em 0 0 0.5em;font-size:90%;}
#mainView .formBox.smallBtn .formBtn{ width:100%; min-width:100%; font-size:1.3rem; line-height:1.2em; padding:0.5em 0.5em 0.5em;}
#mainView .formBox.smallBtn .txtBtn{width: 75%;text-align: left;}
#mainView .cmBtn{ position:absolute; right:6%; bottom:6%; width: 26%;}
#mainView .cmBtn img{width: 100%;}
#mainView .ttl-h2{line-height: 1.3em;}
#mainView .taikenTxt{font-size:145%;width:75%;}
.pc { display: none !important; }
.sp { display: block !important; }
.kakikoshu_2{width: 90%; height: auto; margin: 2em auto 0;}
#btnBox {margin: 2em auto 0;}
#btnBox .contentsUl2{width: 95%;}
#btnBox .contentsUl2 li{margin: 0 0.3em 0.7em;}
#btnBox .contentsUl2 li a{font-size: 150%; padding: 0.25em 1.3em 0.35em;}


/*-- お茶の間留学キャンペーン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;}

/*-- お茶の間留学キャンペーン--*/
.campaign_txt{padding: 1em 0.5em; width: 100%;}
.camBox{width: 100%; margin: 0 auto;}
.camBox.twoBox .twoinnerBox{display: block;}
.camBox.twoBox .campaign_txt{width: 100%; margin: 0.3em auto 1em;}
.season{right: -1em; bottom: -2em; width: 17%;}

/*-- ochanomaSec --*/
#ochanomaSec .sectionInner{padding-top: 10%;border-top: 0;}
#ochanomaSec .listBox ol{gap: 0.5em;}
#ochanomaSec .listBox li a{margin: 0;width: 100%; padding: 10px 0.2em;}
#ochanomaSec .listBox .numberTxt{width: 15%; font-size: 15px;}
#ochanomaSec .listBox .tac{font-size: 15px;}
#ochanomaSec .listBox img{width: 55%; height: auto;}

/*-- TVコマーシャル動画！ --*/
#tvcmSec{ background-color:#00ada4;}
#tvcmSec .sectionInner{ padding:2em 0;}
#tvcmSec .movieBox{ max-width:420px; height:auto; /*background-color:#000; */padding:0 10px; margin:0 2em;}
#tvcmSec .movieBox iframe{ border:none; width:100%; height:100%; padding:0 10px; border-left:5px dashed #fff; border-right:5px dashed #fff;}
#tvcmSec .sectionInner h3{ color:#fff; font-size:1.5rem; line-height:1.4em; margin:0.5em auto; text-align:center;}
#tvcmSec .sectionInner p{ color:#fff; padding:0 1em; line-height:1.4em; margin:1.5em auto 0;}

/*-- 選べる講師 --*/
#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 .koushiContents.lesson{height: auto;}
#lessonStyleSec .lessonTypeBox{margin-bottom: 3em;}
#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:0;margin: 0;width: 45%;}
#lessonStyleSec .lessonPlanBox .lessonPlanDT .planLinkBtn{background: #f7931e;color: #fff;padding: 0.4em 0.6em;line-height: 1;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: 2em 0 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;}

/*-- オンラインでも駅前留学クオリティ --*/
#lessonPriceSec{overflow:hidden;}
#lessonPriceSec .txtBox p{margin:0 0 1.3em 0;}
#lessonPriceSec .contentsBox{}
#lessonPriceSec .contentsBox .txtBox{min-width:0; margin-bottom:0em;}
#lessonPriceSec .contentsBox .imgBox{width:60%; margin:0 auto;}

/*-- レッスンについて --*/
#curriculumSec .contentsBox{max-width: 650px;margin: 0 auto;}
#curriculumSec .listBox{margin:2em 0 0 0;}
#curriculumSec .listBox .listItem{padding:0 0.2em;}

/*-- かんたん接続 --*/
#deviceSec .hituyouBox{max-width: 960px;margin: 0 auto;border: 7px solid #e6e6e6;padding: 2em 2em;}
#deviceSec .ttlInBox{display:inline-flex;justify-content:center;align-items:center;border: 3px solid #e6e6e6;padding: 0.5em 0.5em;width: 100%;height: auto;}
#deviceSec .hituyouList{display:block;}
#deviceSec .listItem{padding: 0 0;}
#deviceSec .listItem:not(:last-child){border-right: none;border-bottom: 1px dashed #ccc;}
#deviceSec .listItem:last-child{padding-right:0;}
#deviceSec .listItem .txtBox{max-width: 190px;padding: 1em 0.5em 0em 0;}
#deviceSec .ttl-h5{font-size: 140%;}
#deviceSec .hituyouItemInternet{}
#deviceSec .hituyouItemInternet .txtBox{max-width: 200px;padding: 1em 0 0em 0;margin-bottom: 0.5em;}
#lessonStyleSec, #lessonPriceSec, #curriculumSec, #deviceSec, #priceSec{padding-top: 100px; margin-top: -100px;}

/*-- 生徒様の声 --*/
#VoiceSec .sectionInner{border-top:none;}
#VoiceSec .voice_slide{margin: 0 0.3em 0; padding: 2em;}
#VoiceSec .voice_slide .img{width: 40%;}
#VoiceSec .voice_slide h4{margin: 0.5em auto;}
#VoiceSec .btnPrev, #VoiceSec .btnNext{width: 45px;}
#VoiceSec .btnPrev{left: 2%;}
#VoiceSec .btnNext{right: 2%;}

/*-- 料金プラン --*/
#priceSec .btnBox{display: flex; margin-bottom: 2em;}
#priceSec #ph{width: calc(100% / 4);}
#priceSec #native{width: calc(100% / 4);}
#priceSec #kids{width: calc(100% / 4);}
#priceSec #callan{width: calc(100% / 4);}
#priceSec .tab-btn{font-weight: bold; padding: 1em; cursor: pointer; background: #b3b3b3; border: solid 1px #fff; color: #fff; font-size: 93%;}
#priceSec .tab-btn.active{color: #fff;}
#priceSec #ph.tab-btn.active{background: #ee0922;}
#priceSec #native.tab-btn.active{background: #f9931d;}
#priceSec #kids.tab-btn.active{background: #fd75c5;}
#priceSec #callan.tab-btn.active{background: #0f3773;}
#priceSec .tab-content{display: none;}
#priceSec .tab-content.active{display: block;}

#priceSec .priceBox{display: block;}
#priceSec .priceBox .courseBox{width: 100%; margin-bottom: 2em;}
#priceSec .priceBox .txt{height: auto; margin-bottom: 1em;}
#priceSec .priceBox .phBox .planBox .fukidashi{left: -2.5em;}
#priceSec .priceBox .conversationBox .planBox .fukidashi{left: -2.5em;}

/*-- WEB決済ですぐ予約・すぐ受講 --*/
#priceSec .ttl-h4{font-size: 210%; color: #00b2bc; line-height: 1.3em; position: relative; margin: 2em 0 1em; text-align: center;}
#priceSec .sectionInner{border-top:none;}
#priceSec .listBox{max-width:571px; margin:0 auto;}
#priceSec .listBox .listItem{background:#b3e4e5;margin: 0 0 1em;line-height: 1;padding: 0.5em 1em;border-radius: 20px;text-align: center;position: relative;font-weight: bold;font-size: 150%;width: auto;}
#priceSec .listBox .listItem .txtStep{position:absolute;left:1em;color:#00b2bc;font-weight: bold;font-size: 80%;}
#priceSec .listBox .listItem.step5{background:#fcb9d4;margin: 0 0 2em;border-radius: 23px;}
#priceSec .listBox .listItem.step5 .txtStep{color:#f9629f;}

/*-- キャンペーン --*/
.campaign{font-size: 125%;}
.text_present{font-size: 90%;}

/*-- オンラインだから、毎日気軽にレッスンできる！ --*/
#catchphraseSec{background-image: url(https://www.nova.co.jp/ochanoma/images_shin/top/img_background_b.jpg);background-position: top center;background-size: cover;background-repeat:no-repeat;}
#catchphraseSec .sectionInner{ max-width:100%; margin:0 auto; padding:0; background:rgba(0,178,188,0.6);}
#catchphraseSec .sectionInner .normalBtn01{ margin:15px;}
#catchphraseSec .contentsBox{ padding:1.5em 2em; max-width:560px; width:100%; margin:0 auto;}
#catchphraseSec .ttlBox .ttl-h3 .txtMain{ width:100%; padding:0; font-size:1.25rem; line-height:1.4em; background:none; color:#fff; text-align:left;}
#catchphraseSec .contentsBox p{ font-size:0.875rem; font-weight:bold; margin:0 auto; line-height:1.6em;}
#catchphraseSec .formBox.normalBtn01 .formBtn{ max-width:100%; width:100%; font-size:1.25rem;}
#catchphraseSec .formBox.normalBtn01 .formBtn01{ max-width:100%; width:100%; font-size:1.25rem;}
#catchphraseSec .normalBtn01 .txtBtn{ margin:0 auto 1.5em;}
#catchphraseSec .normalBtn01 .txtBtn .subText{ font-size:1rem;}
.normalBtn01 .txtBtn .subtxt{ font-size:1rem;}
/*-- オンラインだから、毎日気軽にレッスンできる！ --*/



/*----------------------------------------------------------------------------
***                                                     2022年8月CMポップアップ
----------------------------------------------------------------------------*/
#modal-newCm2022{box-sizing:border-box;width: 100%;height: 100vh;position:fixed;z-index:999999;padding: 0;overflow-y: scroll;/*display:none;top: 0!important;left: 0!important;*/}
#modal-newCm2022 .ttl {width: 100%;background-color: #fffde5;/* height: 10%; */position: sticky;top: 0;z-index: 9;margin: 0;}
#modal-newCm2022 .ttl h2 {width: 100%;margin: 0 auto;text-align:center;display: block;padding: 0% 0% 0% 0;}
#modal-newCm2022 .ttl h2 img{}
#modal-newCm2022 #modal-newCmInner{background-color: #fff;padding: 3% 0 5% 0;max-height: 90%;height: 100%;overflow-y: auto;}
#modal-newCm2022 ul {width: 100%;display: flex; flex-wrap: wrap; justify-content: space-evenly;}
#modal-newCm2022 li {width: 90%;}
#modal-newCm2022 h3 {width: 100%;text-align: center;font-size: 1.7em;color: #fff;display: block;padding:0;margin: 0;}
#modal-newCm2022 .cmA h3 {color: #333333;}
#modal-newCm2022 .cmA {border-bottom: 1px dashed #aaa;}
#modal-newCm2022 .cmB h3 {color: #333333;margin-top: 3%;}
#modal-newCm2022 .cmMovie {margin: 0 auto 4% auto;position: relative;max-width: 95%;}
#modal-newCm2022 .cmMovie:before {content: url(https://www.nova.co.jp/images/top_202007/line_newvideo202010.png);display: none;}
#modal-newCm2022 .cmMovie:after {content: url(https://www.nova.co.jp/images/top_202007/line_newvideo202010.png);display: none;}
#modal-newCm2022 .movieInBox{margin:0 auto 1em;max-width:400px;position: relative;padding-bottom: 56.25%;height: 0;overflow: hidden;}
#modal-newCm2022 .movieInBox iframe{margin:0 auto;position: absolute;top: 0;left: 0;width: 100%;height: 100%;max-width:none;max-height:none;}
#modal-newCm2022 .btnClose {width: 6%;position:absolute;top: 0;right: 0;z-index: 999;}
#modal-newCm2022 .btn {width: 85%;margin: 0% auto 5% auto;cursor: pointer;}
#modal-newCm2022 .btnCloseBottom{width: 30%;background-color: #444; color:#fff;font-size: 1.7em;padding: 2%;text-align: center;margin: 5% auto 0;border-radius: 1em;}
#modal-newCm2022 .close_btn{z-index: 999;position:absolute;top: 0.2em;right:0em;font-size:30px;}
#modal-newCm2022 .popup_content {height: auto;}

/*----------------------------------------------------------------------------
***                                                           年賀
----------------------------------------------------------------------------*/
.nengaBnrP{ text-align:center; margin:6% 5% 0%;}