@charset "utf-8";
/* CSS Document */
#top{min-width: inherit;}
/*----------------------------------------------------------------------------
***                                                             headerArea
----------------------------------------------------------------------------*/
#headerArea{position: sticky;width:100%;z-index: 99;top: -3em;background: #fff;}
#headerArea #headerAreaInner{position:relative;padding: 0% 2% 0;border-top: 4em solid rgba(255,255,255,0.3);max-width:100%;z-index: 2;}
#headerArea #headerAreaInner{padding: 0% 2% 0;border-top: 3em solid rgba(255,255,255,0.3);}
#headerArea .ttl{padding: 3% 0 0%;}
#headerArea .logoBox{width: 50%;}
#headerArea .logoBox .ttlTxt{
    font-size: 11px;
    color: #333;
    font-weight: normal;
    position: absolute;
    top: -2.8em;
    left: 0;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: center;
    z-index: 1;
}
#headerArea .logoBox .ttlSub{
    position: absolute;
    top: -1.3em;
    right: 0;
    color: #333;
    font-size: 11px;
    width: 100%;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    text-align: center;
}


#headerArea #menuBtnBox{width:30px;height:20px;cursor:pointer;margin: 0 0em 0 0;}
#headerArea #menuBtnBox .menuBtn{position:relative;width:100%;height:100%;display:block;}
#headerArea #menuBtnBox .line,#headerArea #menuBtnBox .menuBtn:after,#headerArea #menuBtnBox .menuBtn:before{content:"";display:block;width:30px;height:2px;background:#000;position:absolute;right:0;border-radius:20px;transform-origin:center;transition:all .5s ease;}
#headerArea #menuBtnBox .line{top:0;}
#headerArea #menuBtnBox .menuBtn:before{top:calc(50% - 1px);}
#headerArea #menuBtnBox .menuBtn:after{bottom:0;}
#headerArea #menuBtnBox .menuBtn.open .line{top:calc(50% - 1px);transform:rotate(-45deg);}
#headerArea #menuBtnBox .menuBtn.open:before{top:calc(50% - 1px);opacity:0;}
#headerArea #menuBtnBox .menuBtn.open:after{bottom:calc(50% - 1px);transform:rotate(45deg);}
#breadcrumbArea{max-width:980px;padding:0 1em;margin:1em auto 3em;position:relative;top:1em;}
#breadcrumbArea li{float:left;font-size:10px;}
#breadcrumbArea li a{display:block;}
#breadcrumbArea li:before{content:">";display:inline-block;margin:0 .5em;}
#breadcrumbArea li:first-child:before{display:none;}


#headerArea #menuBtnBox{width:30px;height:20px;cursor:pointer;margin: 0 0em 0 0;}
#headerArea #menuBtnBox .menuBtn{position:relative;width:100%;height:100%;display:block;}
#headerArea #menuBtnBox .line,#headerArea #menuBtnBox .menuBtn:after,#headerArea #menuBtnBox .menuBtn:before{content:"";display:block;width:30px;height:2px;background:#000;position:absolute;right:0;border-radius:20px;transform-origin:center;transition:all .5s ease;}
#headerArea #menuBtnBox .line{top:0;}
#headerArea #menuBtnBox .menuBtn:before{top:calc(50% - 1px);}
#headerArea #menuBtnBox .menuBtn:after{bottom:0;}
#headerArea #menuBtnBox .menuBtn.open .line{top:calc(50% - 1px);transform:rotate(-45deg);}
#headerArea #menuBtnBox .menuBtn.open:before{top:calc(50% - 1px);opacity:0;}
#headerArea #menuBtnBox .menuBtn.open:after{bottom:calc(50% - 1px);transform:rotate(45deg);}
/*----------------------------------------------------------------------------
***                                                             headerArea
----------------------------------------------------------------------------*/
#mainView{background: none;border-top: 6px solid #808080;}
#mainView .ttlBox {padding: 2em 5% 0;}
#mainView .ttlBox span img{margin: auto;}
#mainView .imgBox {display: block; text-align: center;}
#mainView .mainBg {margin: -1.5em 0 0; padding: 0; position: relative; z-index: -1;}
#mainView .mainBg img {display: block; width: 100%; height: 27em; -o-object-fit: cover; object-fit: cover;}
#mainView .bnrBox {margin-top: -12em; padding: 0 0%;}
#mainView .bnrBox img {height: 36vw; max-height: 243px; max-width: 100%; -o-object-fit: cover; object-fit: cover;}
#mainView .bnrFormBox {padding: 0 5%;}

/*2021年10月25追記 お米無しの時*/
#mainView .mainBg {margin: -3em 0 -8em 0;}
#breadcrumbArea{margin:0 1em 0 0;}

.fadeIn{animation-name:fadeUpAnime;animation-duration:1.5s;animation-fill-mode:forwards;opacity:0;}
@keyframes fadeUpAnime{
	from {opacity: 0; transform: translateY(70px);}
	to {opacity: 1;transform: translateY(0);}
}

.bnr img{margin: 2em auto 0;padding: 0 10% 0;}
.bnrFormBox{padding: 0 5%;margin: 3em auto 0em}
/*----------------------------------------------------------------------------
*** 「プラチナ留学」で、できること。
----------------------------------------------------------------------------*/
#dekirukotoSec .sectionInner {padding-top: 5%;}
#dekirukotoSec h2{font-size: 170%;}
#dekirukotoSec .listItem {max-width: 363px; position: relative; margin-bottom: 2em;}
#dekirukotoSec .listItem:last-child {margin-bottom: 0;}
#dekirukotoSec .listItem .icoNumber {position: absolute; top: -10px; left: -10px; margin: 0; padding: 0;}
#dekirukotoSec .listItem dt {font-size: 135%; line-height: 1.2; padding: 0;}
#dekirukotoSec .listItem dd.order02{margin: 0 auto 10px;}
#dekirukotoSec .main .order03{font-size: 135%;}
#dekirukotoSec .listItem .order04 {margin-top: 0.6em; padding: 0.6em 0 2em; border-top: 1px dashed #000;}
#dekirukotoSec .listItem .dispFlex .txtColorGreen {color: #00a199;}
#dekirukotoSec .listItem .dispFlex .order01 {margin: 0 0 0.5em;}
#dekirukotoSec .listItem .dispFlex .txtColorPink {color: #e7456d;}
.formLinkBox {max-width: 722px; margin: 2em auto 0;}
.formLinkBox .listBox .listItem {width: 80%; margin: 0.5em 0!important;}
.formLinkBox .listBox .btnSchools {margin-top: 1.5em;}
#dekirukotoSec .support .listItem{width:calc(95% / 1) ;padding: 0 20px;}
#dekirukotoSec .support .listItem .order04{padding: 0.6em 0 0;}
#dekirukotoSec .support .listItem dd.order02{padding: 0 45px;margin: 0 auto 15px;}
/*----------------------------------------------------------------------------
*** 料金・コース紹介
----------------------------------------------------------------------------*/
#priceCourseSec h2{font-size: 170%;}
#priceCourseSec .descriptionTxt {margin: 0 0 1em;}
#priceCourseSec .courseBox{width: 100%;}
#priceCourseSec .platinumLightBox {margin: 0 0 3em;}
#priceCourseSec .order02 {margin: 0 0 1em;}
#priceCourseSec .order02 img {width: 60%;}

/*----------------------------------------------------------------------------
*** 来校・入会特典
----------------------------------------------------------------------------*/
#tokutenSec h2{font-size: 170%;}
#tokutenSec .sectionInner {padding-bottom: 90px;}
#tokutenSec .descriptionTxt {margin:1em 0 1em;font-size: 120%;}
#tokutenSec .presentBox {position: relative;margin: 0em auto;}
#tokutenSec .batchBox {position: absolute;top: -31%;right: -2%;width: 29%;}
#tokutenSec .contentsBox .okomeBox {width: 100%; margin: 0 auto 5%;}
#tokutenSec .contentsBox .ramenBox {width: 100%;margin: 0 auto;}


/*----- SNS -----*/
.snsSec .sectionInner{padding: 2em 7% 2em;}
.snsSec .snsShareBox{margin: 0 0 0 0%;padding: 0 0em;}
.snsSec .ttl{padding:0;margin:0;}
.snsSec .snsIcoBox{margin: 0 .5em;padding:0;}
.snsSec .linkIcoBox{margin:0 0 0 1em;padding:0 0 0 1em;border-left:1px solid #b3b3b3;}
.snsSec .linkIcoBox .success-msg{display:none;position: absolute;white-space: nowrap;bottom: 120%;left: initial;right: -60%;transform: none;color: #000;}

#snsHeaderSec.snsSec{width: 33%;}
#snsHeaderSec.snsSec img{max-width:100%;height: auto;width: 2em;}
#snsHeaderSec .ttl{display:none;}
#snsHeaderSec .linkIcoBox{display:none;}
#snsHeaderSec .hatena{display:none;}
#snsHeaderSec .pinterest{display:none;}
#snsHeaderSec.snsSec .sectionInner{padding: 3% 0 0em;}
#snsHeaderSec.snsSec .snsShareBox{margin: 0 0 0 0;padding: 0 1em 0 0;}