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

#headerArea{width: 100%;}

.sectionInner .normalBtn01{ background:none; padding:0; margin:3em 0 0;}
.normalBtn01{background:url("../images/2601/bg_form.png") no-repeat center center/cover;padding: 60px 0;margin-top: 5em;}
.normalBtn01 .flexBox{display: flex; justify-content: space-around; max-width: 1000px; margin: 0 auto;}
.normalBtn01 .flexBox .txtBtn .formBtn{width: 90%;}
.normalBtn01 .flexBox .txtBtn .formBtn2{width: 90%;}
.normalBtn01 .flexBox .txtBtn{width: 100%;}

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

#mainView{background:url(../images/2601/img_top.jpg) no-repeat; position: relative;background-size: 100%; background-position: center; max-width: 1200px; margin: 0 auto;}
#mainView .bgBox{width: 80%; max-width: 950px; margin: 0 auto; padding: 3em 0 0;}
#mainView .bgBox img{width: 100%; height: auto;}
#mainView .bgBox .formBox{margin: 0em auto; position: absolute; bottom: 2.5em; right: 0; left: 0;}
#mainView .formBox.smallBtn .formBtn{ width:100%; background: #e0001b; /*border: solid 3px #fff;*/ color: #fff; padding: 0.4em 2em 0.5em; font-size: 185%; max-width: 510px;}

/*-- キャンペーン --*/
#campaignSec .phocha .campaignBox{max-width: 1000px;margin: 0 auto 0;padding: 50px 0 0;}
/*-- 料金 --*/
/*#campaignSec .phocha .campaignBox .priceBox{position: relative;}
#campaignSec .phocha .campaignBox .priceBox .fukidashi{position: absolute; right: -4em; top: -1em;}
#campaignSec .phocha .campaignBox .priceBox h2{background: #f7931e; color: #fff; text-align: center; font-size: 240%;}
#campaignSec .phocha .campaignBox .priceBox h2 span{font-size: 70%;}
#campaignSec .phocha .campaignBox .priceBox .flexBox{display: flex;justify-content: space-between; width: 80%; margin: 1.5em auto 3em; align-items: center;}
#campaignSec .phocha .campaignBox .listBox .listItem{font-size: 140%; font-weight: bold;}
#campaignSec .phocha .campaignBox .listBox .listItem::before{content: ""; display: inline-block; width: 1em; height: 1em; background: url(../images/2601/ico_contents01.png) no-repeat center center/cover; margin: 0 0.4em 0 0;}
#campaignSec .phocha .campaignBox .listBox .listItem .txtAttentionPrice{color: #f991c0; font-size: 110%;}
#campaignSec .phocha .campaignBox .listBox{font-size: 95%;}
#campaignSec .phocha .campaignBox .price{text-align: center; font-size: 340%; font-weight: bold; line-height: 1.2; letter-spacing: -1px;}
#campaignSec .phocha .campaignBox .price span{font-size: 150%;}*/
/*-- 料金 --*/
#campaignSec .priceBox{width: 960px; margin: 0 auto;}
#campaignSec .priceBox .ttlTxt{font-size: 30px; text-align: center; font-weight: bold; margin: 3em auto 0; line-height: 1.0em;}
#campaignSec .priceBox .titletxt{text-align: center; margin-bottom: 3em; color: #FE0001; font-size: 130%; font-weight: bold;}
#campaignSec .priceBox .colorTtl{color: #e0001b; margin: 0 5px;}
#campaignSec .priceBox .mainichiPlan{margin-bottom: 1em;}
#campaignSec .priceBox .mainichiPlan .ttl-h4{background: #f7931e; font-size: 180%;}
#campaignSec .priceBox .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;}
/*#campaignSec .priceBox .listBox{width: 40%;}*/
#campaignSec .priceBox .planBox .listBox .listItem{font-size: 110%; font-weight: bold;}
#campaignSec .priceBox .planBox .listBox .listItem:before{content: ""; display: inline-block; width: 1em; height: 1em; background: url(../images/2601/ico_contents01.png) no-repeat center center/cover; margin: 0 0.4em 0 0;}
#campaignSec .priceBox .planBox .listBox .listItem .txtAttentionPrice{color: #f991c0; font-size: 110%;}
#campaignSec .priceBox .tableBox{width: 49%;}
#campaignSec .priceBox .planTable{width: 100%;}
#campaignSec .priceBox .planTable .time td{border: none; text-align: right; padding: 0;}
#campaignSec .priceBox .planBox.mainichiPlan .txtPrice{font-size: 215%; position: relative;}
#campaignSec .priceBox .planBox.mainichiPlan .txtPrice span{position: absolute; top: -2.5em; right: -4em;}
#campaignSec .priceBox .planBox.mainichiPlan .txtLabel{font-size: 130%;}
#campaignSec .priceBox .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;}
/*#campaignSec .priceBox .planTable td.mantomanOnly{border: none; font-size: 90%; font-weight: normal; text-align: right;}*/
#campaignSec .priceBox .planTable th, #campaignSec .priceBox .planTable td{text-align: center; border-color: #4d4d4d; color: #3d3a39;}
#campaignSec .priceBox .planTable .txtPrice{text-align: center; font-size: 130%; line-height: 1.5em; margin: 0;}
#campaignSec .priceBox .mainichiPlan .txtBox{margin: 2em auto;}
#campaignSec .priceBox .planTable th{font-size: 140%; line-height: 1; padding: 0.6em 0;}
#campaignSec .priceBox .nativeBox th{background: #b3e8ec;}
#campaignSec .priceBox .philippinesBox th{background: #fdb8d5;}
#campaignSec .priceBox .planTableBox{margin: 2em auto;}
#campaignSec .planBox{padding: 0em 3em 2em 3em;}

/*-- 固定プラン --*/
#campaignSec .priceBox .koteiPlan{margin-bottom: 5em;}
#campaignSec .priceBox .koteiPlan .ttl-h4{background: #754c24; font-size: 180%;}
#campaignSec .priceBox .lessonBox{background: #e6e6e6;}
#campaignSec .priceBox .nativeBox .lessonBox td{width: 50%; line-height: 1;}
#campaignSec .priceBox .lessonBox td{font-size: 140%; font-weight: bold; line-height: 1;}

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

/*-- カラン・イングリッシュ --*/
#campaignSec .planBox.callanPlan{margin-bottom: 5em;}
#campaignSec .planBox.callanPlan .ttl-h4{background: #212e5b; font-size: 180%;}
#campaignSec .planBox .ttl-h4 .txtLabel{display: block; font-size: 52%; border: 1px solid #fff; border-radius: 20px; padding: 0.3em 0.3em 0.3em 0.3em; margin: 0.5em 0 0em; position: relative; z-index: 1;}
#campaignSec .planBox.callanPlan .planTableBox .imgBox{width: 25%; max-width: 176px; padding: 0.5em 0 0.5em 0; background: #212e5b; margin-top: -1.5em;}
#campaignSec .planBox.callanPlan .planTableBox .imgBox p{margin: 0; text-align: center;}
#campaignSec .planBox.callanPlan .tableBox{width: 80%; padding-top: 1.5em;}
#campaignSec .priceBox .callanPlan .planTableBox{margin: 0 auto;}
#campaignSec .planTable .priceBox td{padding: 0.6em 0; width: 50%;}
.small{margin-bottom: 1em;}
.pricetxt{font-size: 110%;}
.pricetxt .red{color: #FE0001;}

/*-- こども --*/
#campaignSec .planBox.kidsPlan{margin-bottom: 5em;}
#campaignSec .planBox.kidsPlan .ttl-h4{background: #f991c0; font-size: 180%;}
.camflex{width: 100%;}
#campaignSec .planBox.kidsPlan .tableBox.koteiBox{margin: 0 2% 0 0;}
#campaignSec .planBox.kidsPlan .tableBox{width: 50%;}
#campaignSec .planBox.kidsPlan .tableBox.koteiBox .koushiBox{background: #b3e8ec;}
#campaignSec .planBox.kidsPlan .tableBox.freeBox .koushiBox{background: #fbb03b;}
#campaignSec .planTableBox .imgBox{max-width: 176px; margin: 0 0.8em 0 0; font-size: 180%;}
#campaignSec .planBox.kidsPlan .valueBox{position: relative;}
#campaignSec .planBox.kidsPlan .valueBox .value{position: absolute; width: 70px; top: -180%; left: -15%;}


#campaignSec .phocha .campaignBox .detail{width: 80%; margin: 0 auto;}
#campaignSec .phocha .campaignBox .detail h3{font-size: 200%; border-bottom: solid 1px #ccc; margin-top: 1em;}
#campaignSec .phocha .campaignBox .detail h3 .orange{color: #e0001b;}
#campaignSec .phocha .campaignBox .detail p{margin: 0.3em 0 0 2em;}
#campaignSec .phocha .campaignBox .detail .cptxt{margin: 0.3em 0 1em 2em;}
/*#campaignSec .phocha .campaignBox .detail .cptxt::before{content: ""; display: inline-block; background-image: url("../images/2601/ico_contents02.png"); background-size: cover; background-repeat: no-repeat; width: 1.5em; height: 1.5em; vertical-align: bottom; margin-right: 0.2em;}*/
#campaignSec .phocha .campaignBox .detail .cptxt.kids{position: relative;}
#campaignSec .phocha .campaignBox .detail .cptxt.kids img{position: absolute; top: 0; right: 265px;}
#campaignSec .phocha .bgNone{background: none; margin: 0;}
.red_solid{border: 5px solid #FE0001;}
.red_solid.topnone{border-top: #4d4d4d;}
.red_solid.bottomnone{border-bottom: #4d4d4d;}
.campaign{color: #FE0001; font-size: 150%; text-align: center; font-weight: bold; margin: 0;}
.campaign_txt{text-align: center; background: #fffacd; border-radius: 15px; padding: 1em 0; margin: 0.3em auto 2em; width: 100%;}
.campaign_txt span{color: #FE0001;}
.campaign_txt.two{width: 48%;}
.attenblack{font-size: 150%; margin-bottom: 0.6em;}
/*-- NOVAオリジナルテキスト --*/
#campaignSec .originalTextBox .ttlBox .ttl-h3{color: #3d3a39; font-size: 230%; margin-bottom: 0.6em; letter-spacing: -0.02em;}
#campaignSec .originalTextBox .ttlBox .ttl-h3 .txtMain{background: none;}
#campaignSec .originalTextBox .ttlBox .ttl-h3:before{display: none;}
#campaignSec .originalTextBox{width: 960px; margin: 5em auto 0;}
#campaignSec .originalTextBox .originalTextCheckBox{background:#fff;padding: 2em 4em;margin:3em 0 0 0;}
#campaignSec .originalTextBox .originalTextCheckBox .ttl{color:#00b2bc;font-size: 145%;text-align: center;font-weight: bold;margin: 0 0 0.5em;}
/*-- キャンペーン --*/

/*-- 新・お茶の間留学の特長 --*/
#featureSec {}
#featureSec h2.bluetitle{max-width: 1000px;margin: 0px auto 0;padding-top: 80px;font-size: 35px;font-weight: bold;line-height: 1.4; color: #00b2bc; position: relative;}
#featureSec h2.bluetitle::before{content: ""; display: block; width: 100%; height: 4px; background: #00b2bc; position: absolute; bottom: 1.4em; left: 0; right: 0; z-index: -1;}
#featureSec h2.bluetitle .txtMain{background: #fff; display: inline-block; padding: 0 0.5em;}
#featureSec .smallTxt{font-size: 20px;display: block;}
#featureSec .phocha .backColor{/*background-color: #e5f7f6;*/}
#featureSec .phocha .ttl02 .leftTtl{width: 50%;}
#featureSec .phocha .ttl02{max-width: 1000px;margin: 0 auto 0;padding: 50px 0 0;display: flex;justify-content: space-between;align-items: center;}
#featureSec .phocha .ttl02 .txtInner{margin-top: 18px;width: 100%;}
#featureSec .phocha .ttl02.feature02 p img{margin-right:50px;}
#featureSec .phocha .ttl02.feature03 p img{margin-right:100px;}
#featureSec .phocha .ttl02.feature04{align-items: flex-start; padding: 50px 0;}

#featureSec .phocha .ttlTxt{font-size: 35px;font-weight: bold;color: #00b2bc;line-height: 1.3;}
#featureSec .normalBtn01{margin-top: 0;}
/*-- 新・お茶の間留学の特長 --*/

/*-- 新・お茶の間留学とは？ --*/
#aboutSec {}
#aboutSec .phocha .ttl01 .leftTtl{width: 50%;}
#aboutSec .phocha .ttl01 {max-width: 1020px;margin: 0 auto 0;padding: 70px 0 50px;display: flex;justify-content: space-between; align-items: center;}
#aboutSec .phocha .ttl01 .rightImg{}
#aboutSec .phocha .ttl01 .txtInner{width: 100%;}
#aboutSec .phocha .ttl01 .kakuyasuBox{padding: 3%; margin-top: 12px;border-radius: 12px;background-color: #0135ab0d;}
#aboutSec .phocha .ttl01 .kakuyasuBox .title{font-size: 125%; font-weight: bold;}
#aboutSec .phocha .ttl01 .kakuyasuBox .komeTxt{margin-top: 1%;}
#aboutSec .phocha .ttl01 .komeTxt{font-size: 12px;}
#aboutSec .phocha .ttlTxt{font-size: 35px;font-weight: bold;color: #00b2bc;line-height: 1.5;}
#aboutSec .phocha .ttl01 img{margin-top: 0px;}
#aboutSec .normalBtn01{margin-top: 0;}

#aboutSec .phocha .subBox{max-width: 1020px;margin: 0 auto 0;padding: 30px; border: solid 1px #ccc;}
#aboutSec .phocha .subBox .flexBox{display: flex; justify-content: center;}
#aboutSec .phocha .subBox .flexBox .innerflex{display: flex; justify-content: space-between; align-items: center;}
#aboutSec .phocha .subBox .flexBox .innerflex .imgBox{width: 35%;}
#aboutSec .phocha .subBox .flexBox .innerflex p img{width: 100%; height: auto;}
#aboutSec .phocha .subBox .flexBox .innerflex div{width: 60%; height: 155px;}
#aboutSec .phocha .subBox .flexBox .innerflex div .title{color: #fbb03b; font-weight: bold; font-size: 140%; margin: 0;}
#aboutSec .phocha .subBox .flexBox .introduction{width: 47%; background: #f9f3e3; border-radius: 10px; margin-right: 2em; padding: 1.5em;}
#aboutSec .phocha .subBox .flexBox .blog{width: 47%; background: #f9f3e3; border-radius: 10px; padding: 1.5em;}
#aboutSec .phocha .subBox .flexBox .pointBtn{text-align: center;}
#aboutSec .phocha .subBox .flexBox .pointBtn a{/*background: #fbb03b;*/ color: #fff; border-radius: 50px; font-weight: bold; padding: 0.4em 0em 0.5em; font-size: 120%; display: inline-block; width: 45%; background: -webkit-linear-gradient(top,  rgba(251, 176, 59,1) 0%,rgba(251, 176, 59,1) 50%,rgba(235,165,55,1) 50%,rgba(235,165,55,1) 100%);}
#aboutSec .phocha .subBox .flexBox .pointBtn a:hover{text-decoration: none;}
/*-- 新・お茶の間留学とは？ --*/


/*-- 決済から開始までのステップ --*/
#aboutSec .webKesaiSec{padding: 50px 0 70px;}
#aboutSec h2{max-width: 1000px;margin: 0px auto 30px;padding-top: 45px;font-size: 35px;font-weight: bold;line-height: 1.3;}
#aboutSec .listBox{}
#aboutSec .listBox ul{-webkit-justify-content: center;justify-content: center;margin-bottom: 4em;position: relative;}
#aboutSec .listBox li{background: #b3e4e5;margin: 0 1em 0;line-height: 1.3;padding: 1.3em;border-radius: 100px;font-weight: bold;font-size: 140%;width: 10em;height: 10em; position: relative;}
#aboutSec .listBox li .txtStep{color: #00b2bc;font-weight: bold;font-size: 120%;display: inline-block;margin-bottom: 0.8em;}
#aboutSec .listBox li .icoStep{display: block;margin: 0.5em 0 0;}
#aboutSec .listBox .step3{background: #fcc99f;}
#aboutSec .listBox .step3 .txtStep{color: #f7801e;position: relative;}
#aboutSec .listBox li.step2:before{
	content: '';
    width: 20px;
    height: 20px;
    border: 0px;
    border-top: solid 2px #00b2bc;
    border-right: solid 2px #00b2bc;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    left: -2em;
    margin-top: -4px;}
#aboutSec .listBox li.step3:before{
	content: '';
    width: 20px;
    height: 20px;
    border: 0px;
    border-top: solid 2px #00b2bc;
    border-right: solid 2px #00b2bc;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    left: -2em;
    margin-top: -4px;}
#aboutSec .listBox p{font-size: 20px;font-weight: bold;}
