@charset "utf-8";
/* CSS Document */
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+JP&display=swap);

body *{
	font-family: "Noto Sans JP", sans-serif;
	font-display:swap;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	color:#333;
}

img{ height:auto;}

html,body{
    overflow-x:hidden;
}
.spNone{ display:block;}
.pcNone{ display:none;}
a{ text-decoration:none; -webkit-transition:all .3s; -o-transition:all .3s; transition:all .3s;}
img{
    max-width:100%;
    height:auto;
}
body{background: #DBF9F3;}
#wrap{
    /* width:100%; */
    /* max-width:1000px; */
    /* margin:0 auto; */
    min-width: 500px;
    width: 500px;
    margin: 0 auto;
    border-left: #eee solid 10px;
    border-right: #eee solid 10px;
    background: #FFF;
    z-index: 0;
    }
#sideMenu{
	display:block;
	z-index:999;
	width:90px;
	height:280px;
	position:fixed;
	right:0;
	top:200px;
}
#sideMenu a:hover{ opacity:0.6;}

.entryBtn{max-width:500px;width:75%;margin: 3em auto 0em;}
.entryBtn a{
	display:block;
	width:100%;
	font-size: 1.4em;
	line-height:1em;
	padding:0.8em 1.6em 0.8em 0.9em;
	border-radius:10px;
	-webkit-box-shadow:3px 3px 6px #999;
	box-shadow:3px 3px 6px #999;
	position:relative;
	background: #00a199;
	color:#fff;
	text-decoration:none;
}
.entryBtn a:after{
	content:"";
	display:block;
	width:40px;
	height:40px;
	position:absolute;
	top:0;
	bottom:0;
	right:0.8em;
	margin:auto;
	background:url(../images/icon_link01.png) no-repeat center/cover;
}
.entryBtn a:hover,
.entryBtnF a:hover{ opacity:0.6;}
.entryBtn a span{ color:#fff; display:inline-block;}

/*.entryBtnF{ margin:-30px auto 0; position: absolute; left:0; right:0;}
.entryBtnF a{
	font-size:250%;
	font-weight:bold;
	line-height:1em;
	padding:0.3em 0.8em 0.4em 0em;
	border-radius:50px;
	box-shadow:3px 3px 6px #999;
	position:relative;
	background:#fff;
	color:#a04b25;
	border:2px solid #a04b25;
	width: 360px;
	display:inline-block;
	text-decoration: none;
}
.entryBtnF a:after{	
	content: "";
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0.8em;
    margin: auto;
    background: url(../images/icon_link02.png) no-repeat center/cover;
	}
.entryBtnF a:hover{ opacity: 0.7;}

*/
/*----------------------------------------------------------------------------
共通
----------------------------------------------------------------------------*/
#underContents titleBox h3.org{
    font-size: 28px;
    padding: 0 0px;
    margin: 0em auto 1em;
}
#underContents titleBox h3.org span{
    font-size: 38px;
    color: #F29600;
    display: block;
}
#underContents h3.blue{
    font-size: 28px;
    padding: 0 0px;
    /* margin: 0em auto 1em; */
    color: #333;
}
#underContents h3.blue span{
    font-size: 38px;
    color: #00a199;
}

.titleBox{display: grid;margin-bottom: 0.5em;}
.titleBox h3{order: 2;text-align:center; font-size:225%; color:#F29600; position:relative; /*padding:0 320px;*/ /*margin:2em auto;*/}
.titleBox p{order: 1;text-align: center;font-weight: bold;font-size: 190%; margin: 0 auto;}

*/
/*----------------------------------------------------------------------------
 ***                                                                    header
----------------------------------------------------------------------------*/
#headerArea {margin: 1em;}
#headerArea {margin: 1em;}
#headerArea .headerAreaInner h1{}
#headerArea #headerAreaInner{}
#headerArea #headerAreaInner h1{
    gap: 0.5em;
    align-items: center;
}
#headerArea #headerAreaInner p{}

.borderbottom{
	margin: 0px 0px;
	border-bottom: 1px solid #bfbfbf;
	padding: 70px 0px;
	}


/*----------------------------------------------------------------------------
 ***                                                              contentsArea
----------------------------------------------------------------------------*/
#contentsArea{/* border:1px solid #333; */position:relative;/* margin:0 auto 10em; */}
/*#contentsArea:before{ content:""; width:100%; height:10px; background-color:#faee00; display:block;}*/


#mainContents {
	position: relative;
	background: url(../images/img_bg_main_pc.jpg) no-repeat;
	background-position: top center;
	background-size: 100%;
	z-index: 0;
	padding:20px 0;
	/*height: 457px;*/
	margin-bottom: 10px;
	border: 6px solid #00a199;
}
#mainContents:after{
	content:"";
	width:141px;
	height:31px;
	position:absolute;
	top:0;
	right:0;
	background:url(../images/img_nova_asmo.jpg) no-repeat center/cover;
}
/* #mainContents:before{
	content:"";
	width:968px;
	height:440px;
	position:absolute;
	right:0;
	bottom:0;
	margin:auto;
	background:url(../images/img_main_chara.png) no-repeat center/cover;
	z-index: -1;
} */

#mainContents .topImgBox{
    padding: 0em 3em;
}

#mainContents h2{}
#mainContents .kobetsuPrice{ }
#mainContents p img {width: auto;}
#mainContents .mainBadgeImg {
	position: absolute;
	right: 63px;
	bottom: 160px;
	margin: 0;
	z-index: -1;
}
#mainContents .mainKoushaImg{
	position: absolute;
	right: 0;
	bottom: 10px;
	margin: 0;
}		
#mainContents .attentionTxt{ 
	text-align: right;
	margin: 5px 60px 0 0px;
	font-size: 10px;
}



#underContents{ margin-top: 16px;}
#underContents > p.tac{ margin:0 auto 2em; font-size:125%; line-height:1.6em;}
#underContents .sectionInner{}
#underContents .sectionInner{}
#underContents h3{ /*text-align:center; font-size:225%; color:#333; position:relative; padding:0 320px; margin:2em auto;*/}
/* #underContents h3:before,
#underContents h3:after{
	content:"";
	width:300px;
	height:20px;
	position:absolute;
	top:0;
	bottom:0;
	left:1em;
	margin:auto;
	background:url(../images/img_titleDeco.png) no-repeat center/cover;
} */
#underContents h3:after{ -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); transform:scale(-1,1); left:auto; right:1em;}


.pageNavi{ max-width:700px; margin:4em auto;}
.pageNavi li{ width:calc(100% / 3); font-size:137.5%; border-left:1px solid #ccc; text-align:center;}
.pageNavi li:last-child{ border-right:1px solid #ccc;}
.pageNavi li a{ position:relative; padding:0 1.2em 0 0; color:#000; text-decoration:none;}
.pageNavi li a:after{
	content: "";
    position: absolute;
    width: 0;
    height: 0;
    top: 0;
    bottom: 0;
	right:0;
    margin: auto;
    border-style: solid;
    border-color: #ec7478 transparent transparent transparent;
    border-width: 0.6em 0.4em 0 0.4em;
}
.pageNavi li a:hover{ color:#ec7478;}



/*----------------------------------------------------------------------------
 ***                                                              pointSec
----------------------------------------------------------------------------*/
#pointSec{
    max-width: 900px;
    margin: auto;
    padding: 20px 0px 0px;
}
#pointSec .sectionInner{}
#pointSec .pointBox{}
#pointSec .pointBox dl{}
#pointSec .pointBox .pointItem{width: 90%;margin: 0.5em 0.5em;border: 3px solid #FFD18D;border-radius: 27px;padding: 2em 2em;position: relative;overflow: hidden;}
#pointSec .pointBox .pointItem::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;

    width: 0;
    height: 0;

    border-top: 70px solid #FFD18D;
    border-right: 70px solid transparent;
}
#pointSec .pointBox .pointItem::after{
    position: absolute;
    top: 7px;
    left: 11px;
    color: #fff;
    font-size: 27px;
    font-weight: bold;
    line-height: 1;
}
#pointSec .pointBox .pointItem:nth-child(1)::after{
    content: "1";
}

#pointSec .pointBox .pointItem:nth-child(2)::after{
    content: "2";
}

#pointSec .pointBox .pointItem:nth-child(3)::after{
    content: "3";
}





#pointSec .pointBox .pointItem .point-ttl{position: relative;font-size: 20px;text-align: center;padding-right: 1em;padding-bottom: 0.5em;}
#pointSec .pointBox .pointItem .point-ttl span{
    font-size: 26px;
    color: #F29600;
}
#pointSec .pointBox .pointItem .point_01{position: relative;}
#pointSec .pointBox .pointItem .point_01::after{
    content: "";
    position: absolute;
    width: 24px;
    height: 28px;
    background-image: url(../images/img_point_01.png);
    right: 1.8em;
    top: 0.35em;
}
#pointSec .pointBox .pointItem .point_02{position: relative;}
#pointSec .pointBox .pointItem .point_02::after{
    content: "";
    position: absolute;
    width: 33px;
    height: 27px;
    background-image: url(../images/img_point_02.png);
    right: 1.6em;
    top: 0.35em;
}
#pointSec .pointBox .pointItem .point_03{position: relative;}
#pointSec .pointBox .pointItem .point_03::after{
    content: "";
    position: absolute;
    width: 38px;
    height: 30px;
    background-image: url(../images/img_point_03.png);
    right: 1.4em;
    top: 0.35em;
}
#pointSec .pointBox .pointItem .point-txt{
    font-size: 15px;
    line-height: 1.6em;
}

#pointSec.titleBox{}
#pointSec.titleBox h3{font-size:225%; color:#333; position:relative; padding:0 320px; margin:2em auto;}
#pointSec.titleBox p{}



#scheduleSec{/* border-bottom: 1px solid #bfbfbf; */padding: 20px 0px 20px;border: 4px solid #00a199;margin: 70px 0px 0px;}
#scheduleSec .titleBox{
    border-bottom: 1px dotted #00a199;
    margin: 0 auto 1em;
    padding: 11px 0 6px;
}
#scheduleSec .titleBox h3 {
	order: 0;
	max-width: 900px;
	font-size: 260%;
	/* padding: 11px 0 6px; */
	line-height: 1.5em;
	text-align: center;
	color: #00a199;
}
#scheduleSec .titleBox p{font-size: 32px;}

#scheduleSec li{ margin:0 1em 1em;}
#scheduleSec li dt{ position:relative; margin:0 0 0.2em;}
#scheduleSec li dt span{ position:absolute; right:0; bottom:0.3em;}
#scheduleSec #course01 dt span{ color:#a40a83;}
#scheduleSec #course02 dt span{ color:#00b3b9;}
#scheduleSec li dd{ font-size:112.5%; font-weight:bold; color:#000;}
#scheduleSec li dd span{ display:block; padding:0 0 0 6em; font-weight: normal; font-size: 120%; line-height: 1.3em; margin-bottom: 8px;}

#scheduleSec #period{/* font-size:86%; */text-align:center;font-weight:bold;color:#f0be50;/* margin:0 0 0 0.5em; */}
#scheduleSec #period span{ font-size:60%; margin-left:3px; vertical-align:middle; color: #f0be50;}
#scheduleSec #period01{font-size: 70%;text-align:center;font-weight:bold;color:#fff;margin:0 0 0 0.5em;background-color:#f0be50;padding: 0 10px 2px 10px;}
#scheduleSec #period01 span{ font-size:60%; margin-left:3px; vertical-align:middle; color: #fff;}
#scheduleSec p.tac{ }
#scheduleSec p.adtxt {margin: 1em auto 0em;font-size: 120%;}
#scheduleSec p.kids{margin-top: 60px;}


/*----------------------------------------------------------------------------
 ***                                                                料金改定2020
----------------------------------------------------------------------------*/
#allpriceSec{
    /* border: 2px solid #0898BA; */
    padding: 4rem 0 3rem 0rem;
}
#allpriceSec h3{
    background: #0898BA;
    padding: 20px 0;
    color: #fff;
    margin: 0;
    /* font-size: 34px; */
}
#allpriceSec #manabiPlan .manabiImg{
    width: 90%;
    margin: auto;
}


#selectedPriceView{
	display:none;
}

#priceHead{
    margin: 0 auto;
    width: 95%;
}
#priceHead .priceHeadInner{}
#priceHead .price-selBox{position: relative;padding: 1rem 0 1rem 0rem;}

#priceHead p{
    text-align:center;
    font-size:18px;
    color:#000;
    font-family:'Noto Sans JP', sans-serif;
}
#priceHead .price-selBox .txtbig{
    font-size: 30px;
    /* padding-right: 2%; */
    /* text-align: center; */
    font-weight: bold;
}
#priceHead .price-selBox .gray{color: #000;}
#priceHead .price-selector_img img{}

.sagasuBox{ background:#FFD701; padding:5px;}
.sagasuSclBox{ float:left; width:361px; padding:15px 0 0 10px;}
.sagasuSclBox p{ text-align:center; color:#000; margin:0; padding:0;}
.sagasuBtnBox{ float:right; width:366px; background:#FFF; padding:12px 15px 5px 15px;}
.sagasuBtnBox li{ float:left;}
.sagasuBtnBox li img { margin:0 7px;}
.sagasuBtnBox p{ text-align:center; margin:0; padding:0;}



.priceViewBox{ margin:10px 0 25px 0; position: relative; margin-top:-120px;padding-top:120px;}

.priceSelectBox{width: 90%;margin: auto;/* background:#F2F2F2; *//* padding:17px 0 8px 10px; *//* margin-top: 0px; */border-radius:7px;}
.priceSelectBox .serchPBox{ float:left; padding-left:40px;}
.priceSelectBox h4{ margin-bottom:0; line-height:1.2em; font-size:100%}
.priceSelectBox ul{/* float:right; */width: 100%;display: flex;gap: 1em;justify-content: center;flex-wrap: wrap;}
.priceSelectBox ul li{width: 100%;}
.priceSelectBox ul li:last-child{}
.priceSelectBox ul li select{padding: 6px 22px 6px 5px;border-radius: 5px;line-height:2em;display:block;font-size: 16px; width: 100%; background: #fdffea;}

.priceImgBox p{}


.priceBox{
    padding: 0rem 0 0rem 0rem;
}


/*----------------------------------------------------------------------------
 ***                                                              stepSec
----------------------------------------------------------------------------*/

#stepSec{}
#stepSec .sectionInner{}
#stepSec .stepBox{}
#stepSec .stepBox .stepItem{
    width: 50%;
    padding: 1em;
    border-right: dashed 1px #00a199;
    border-left: dashed 1px #00a199;
	border-bottom: dashed 1px #00a199;
	border-top: dashed 1px #00a199;
}
#stepSec .stepBox .stepItem .step-ttl{
    text-align: center;
    font-size: 26px;
    line-height: 1.3em;
}
#stepSec .stepBox .stepItem .step-ttl span{}
#stepSec .stepBox .stepItem .step-ttl .step-num{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  background-color: #00a199;
  color: #fff;
  font-weight: bold;
  border-radius: 50%;
  margin-bottom: 10px;
  font-size: 30px;
  }
#stepSec .stepBox .stepItem .step-txt{}
#stepSec .stepBox .stepItem .step-txt p img{}
#stepSec .stepBox .stepItem .step-txt p{
    font-size: 15px;
}


/*----------------------------------------------------------------------------*/
#expSec{
    padding: 70px 0px;
}
#expSec h3{color: #F29600;}
#expSec #exp01{ border-right:2px dotted #ccc;}
#expSec .expBox{ width:42%; padding:1em 2em;}
#expSec .expBox dt{ margin:0 0 1em; height: 6em; font-size:185.811%; font-weight:bold; padding: 0 0.5em; line-height:1.2em; position:relative; color:#000; z-index: 0;}
#expSec .expBox dt:after{
	content:"";
	position:absolute;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
	z-index: -1;

}

#expSec .expBox dt span.smallTxt{ font-size: 81.818%;}
#expSec .expBox dt span.expName{ display:block; font-size:54.5456%; font-weight:normal; margin:0.5em 0 0; position: absolute; bottom: 0; color: #666666;}

#expSec #exp01 dt{ border-left:10px solid #fc688e; }
#expSec #exp02 dt{ border-left: 10px solid #6dce21;}
#expSec #exp01 dt:after{ width: 205px; height: 121px; background:url(../images/img_voice01.png) no-repeat center/cover;}
#expSec #exp02 dt:after{ width: 230px; height: 121px; background:url(../images/img_voice02.png) no-repeat center/cover;}

#expSec .expBox dd{ font-size:112.5%; color:#000;}
#expSec .expBox dd span{ padding:0.2em}
#expSec .expBox dd span.textMarker{ background:-o-linear-gradient(transparent 15%, #ffff00 0%); background:-webkit-gradient(linear, left top, left bottom, color-stop(15%, transparent), color-stop(0%, #ffff00)); background:linear-gradient(transparent 15%, #ffff00 0%);}


#schoolBox{ background:url(../images/bg_koushaallL.jpg) no-repeat,url(../images/bg_koushaallR.jpg)no-repeat; background-position:55px 35px,700px 25px; background-size:264px,264px; margin:60px auto 60px;}
#schoolBox h4{ border-bottom:1px solid #5aaf00; max-width:480px; margin:0 auto 1em; padding-bottom:0.5em; text-align:center;}
#schoolBox p{ font-size:175%; text-align:center; margin:1em auto; line-height:1.4em;}
#schoolBox p strong{ font-size:125%; font-weight:normal;}
#schoolBox p strong span{ font-size:200%;}
#schoolBox .pinkTxt{ color:#e51373; font-weight:bold;}
#schoolBox p a:hover{ opacity:0.6;}


#coronaBox #cleanImg{ margin:2em auto 6em;}


#kodawariBox{max-width:800px;margin: 0px auto;position:relative;padding-bottom: 20px;}
#kodawariBox p{ font-size:275%; margin:0.5em auto;}
#kodawariBox p img{position:absolute;top:0;left: -54px;z-index:1;}
#kodawariBox ul{ padding:0 74px 0 130px;}
#kodawariBox li{ width:140px; height:140px; float:left; margin:auto;}
#kodawariBox li:nth-child(1){ background-color:#119dbf;}
#kodawariBox li:nth-child(2){ background-color:#e72088;}
#kodawariBox li:nth-child(3){ background-color:#eaa014;}
/*#kodawariBox li:nth-child(4){ background-color:#eaa014;}*/
#kodawariBox li:nth-child(5){ width:215px;}
#kodawariBox #kodawariList{ width:150px; height:140px; padding:0;}
#kodawariBox #kodawariList li{ width:65px; height:65px; background-color:#8f1b69; margin:0 10px 10px 0;}
#kodawariBox #kodawariList li:nth-child(3n){ margin-right:0;}




/*--------------------------------------------------------------------------
 ***                                                              QASec
--------------------------------------------------------------------------*/
#QASec{/* background: #FFA364; */}
#QASec .TitleBox h2{color: #fff;}
#QASec .QA-inner{width: 95%;margin: 0em auto;}
#QASec .QA-inner .QA_list{margin-bottom: 1em;border: 2px solid #F29600;border-radius: 8px;/* padding: 1.5em; */}
#QASec .QA-inner .QA_list .region-box{position: relative;cursor: pointer;/* background-color:#fff; */font-size: 18px;font-weight: bold;margin: 0;/* border-bottom: 1px solid #F29600; */gap: 10px;transition: .5s ease-in-out;padding: 1.3em calc(1.5em + 30px) 1.2em 16px;}
#QASec .QA-inner .QA_list .region-box.on{/* margin: 0 0 .5em; */}
#QASec .QA-inner .QA_list .region-box::after,
#QASec .QA-inner .QA_list .region-box::before{
    display: block;
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    background-color: #F29600;
    border-radius: 10px;
}
#QASec .QA-inner .QA_list .region-box .questionTxt{
    /* padding-right: 40px; */
}
#QASec .QA-inner .QA_list .region-box::after{
    width: 3px;
    height: 30px;
    right: 37px;
}
#QASec .QA-inner .QA_list .region-box::before{
    width: 30px;
    height: 3px;
    right: 24px;
}

#QASec .QA-inner .QA_list .region-box.on::after{
    width: 0px;
}

#QASec .QAicon{
    font-size: 30px!important;
    color: #F29600;
    font-weight: bold;
    line-height: 1;
    margin: -0.1em 0 0;
}
#QASec .QA-inner .QA_list .region-box+.QA-box{display:none}       
#QASec .QA-inner .QA_list .QA-box{
    padding: 0 1.5em 1.5em 16px;
    /* margin-top: -0.5em; */
}
#QASec .QA-inner .QA_list .QA-box .QA-boxInner{margin-bottom: 2em;}
#QASec .QA-inner .QA_list .QA-box .QA-boxInner:last-child{margin: 0;}
#QASec .QA-inner .QA_list .QA-box .QA-boxInner h3{background: #EFEFEF;text-align: center;font-size: 20px;padding: 0.5em;}
#QASec .QA-inner .QA_list .QA-box .QA-boxInner .QA{border-bottom: 1px solid #ccc;gap: 16px;/* align-items: baseline; */}
#QASec .QA-inner .QA_list .QA-box .QA-boxInner .QA:last-child{border-bottom: none;}
#QASec .QA-inner .QA_list .QA-box .QA-boxInner .QA .QA-txt{font-size: 15px;margin: 0;}
#QASec .QA-inner .QA_list .QA-box .QA-boxInner .QA p{font-size: 15px;}

#QASec  .QA-inner .QA_list.abroad p{position: relative; cursor: pointer;background-color: #fff;padding: 0.5em;text-align: center;font-size: 24px;font-weight: bold;margin: 0;}
#QASec  .QA-inner .QA_list.abroad p a{color: #000;}
#QASec  .QA-inner .QA_list.abroad p a:hover{text-decoration: none;}
#QASec  .QA-inner .QA_list.abroad p::before{
    display: block;
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 33px;
    margin: auto;
    width: 15px;
    height: 15px;
    border: 3px solid;
    border-color: #F47722 #F47722 transparent transparent;
    transform: rotate(45deg);
    border-radius: 4px 0;
}

/*----------------------------------------------------------------------------
 ***                                                                    footer
----------------------------------------------------------------------------*/
#footerArea{ padding:30px 0 0; }
#footerArea #footerAreaInner .logoImg{text-align:center;margin:0 0 10px;gap: 0.5em;align-items: center;}
#footerArea #footerAreaInner p{ text-align:center; margin:0; padding:5px 0 4px; background-color:#333; color:#fff; font-size:12px;}

footer .menuBox{display:none;}



@media screen and (max-width: 1024px) and (min-width: 413px) {

	#wrap {
	    margin: 0 auto;
	}
	
	#contentsArea {margin: 0;}
	
	#pointSec .pointBox .pointItem {
	}
	#pointSec .pointBox .pointItem .point_01::after {
	    right: 0.8em;
	}
	#pointSec .pointBox .pointItem .point_02::after {
	    right: 0.6em;
	}
	#pointSec .pointBox .pointItem .point_03::after {
	    right: 0.4em;
	}
	
	#scheduleSec li {}
	
	#scheduleSec li dt img{
	    width: 99%;
	}
	#scheduleSec li dd img{}
	
	#priceHead {}
	
	
	#defaultPriceView img{
	    /* width: 100%; */
	}
	#sideMenu {
	    top: 304px;
	}
	.borderbottom {
	    padding: 70px 2.5%;
	}
	
	#schoolBox { background-position: 3px 35px, 503px 25px;}
	#kodawariBox p img {left: 2px;}

}
















