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


body{}

#wrap{ position:relative;}

@media screen and (max-width:640px){
}
/*----------------------------------------------------------------------------
 ***                                                                  Header
----------------------------------------------------------------------------*/
header{position: -webkit-sticky; position: sticky;background-color: #fff; z-index: 100; top: 0; width: 100%; padding-top: 0; height: 60px; border-bottom: solid 2px #e6e6e6;}
header::before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: linear-gradient(to right, #ffd800 50%, #00aca4 50% );}
header .headerInner{padding-right: 36px;max-width: 1100px; width: 95%; margin: 0 auto; position: relative; height: 100%;}
header .btnBox{gap: 0.3em;}
header .btnBox p{margin: 0;}
header .btnBox p a{font-size: 120%;}
header .btnBox p.trial a{color: #fff; background: #ee8822; font-weight: bold; border-radius: 50vw; display: inline-block; padding: 0.2em 0.8em; text-decoration: none; box-shadow: 0 2px 0px #cccccc;}
header .btnBox p.request a{color: #fff; background: #4ecddb; font-weight: bold; border-radius: 50vw; display: inline-block; padding: 0.2em 0.8em; text-decoration: none; box-shadow: 0 2px 0px #cccccc;}

header .tel{position: absolute; top: 30%; right: 13%; width: 35%;}
header .tel p{margin: 0;}

header div > .menuList { display: none;}
header nav.naviBox li a{ display:inline-block; width: auto;}
#headerBtnBox{max-width: 50%;}
#headerBtnBox .requestBtn {}
#headerBtnBox .requestBtn a,
#headerBtnBox .trialBtn a,
#headerBtnBox .summerBtn a{ min-width: 6em;}
#headerBtnBox .trialBtn a{}
#headerBtnBox .requestBtn a,
#headerBtnBox .trialBtn a,
#headerBtnBox .summerBtn a{font-size: 75%;line-height: 1.2em;text-align:center;height: 3.5em;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding: 0.4em 1em;}

/* menuボタン内 */
header nav.naviBox{width:100%; height:100vh; margin:0 auto; padding:3vw; position:fixed; top:0; left:0; background:rgba(0,0,0,0.9); text-align:center; -webkit-transform:translateX(-100%); -ms-transform:translateX(-100%); transform:translateX(-100%); z-index:1; -webkit-transition:all .6s; -o-transition:all .6s; transition:all .6s;}
header nav.naviBox > ul{width:100%; max-width: 800px; margin:0 auto; padding: 0 3em 0; display:block;}
header nav.naviBox > ul > li{ max-width:100%; text-align:center; padding:0; color:#999;}
header nav.naviBox > ul.snsUl li:first-child{border-top: 1px dashed #FFF;}
header nav.naviBox > ul > li a{ color:#fff; width:100%; text-decoration:none; -webkit-transition:color .4s; -o-transition:color .4s; transition:color .4s; position:relative;}
header nav.naviBox > ul > li.topLink{margin: 0.5em 0 0.5em 0;}
header nav.naviBox > ul > li.topLink a{font-size: 95%;}
header nav.naviBox > ul > li.koushaLi{margin: 0 auto 0.5em; padding-bottom: 0.5em; /*border-bottom: 1px dashed #fff;*/}
header nav.naviBox > ul > li.koushaLi .koushaDl{}
header nav.naviBox > ul > li.koushaLi .koushaDt{color: #ccc;font-size: 120%;text-align: center;padding: 0.35em 0 0.3em;border-top: #999 1px dotted;border-bottom: #999 1px dotted;}
header nav.naviBox > ul > li.koushaLi .koushaDd{margin: 0 auto 0; max-width: 470px;}
header nav.naviBox > ul > li.koushaLi .koushaDd a{position: relative; padding-left: 1.5em;}
header nav.naviBox > ul > li.koushaLi .trialRequestBox{margin: 1em auto 0.5em;}
header nav.naviBox > ul > li.koushaLi .trialRequestBox .trialBtn,
header nav.naviBox > ul > li.koushaLi .trialRequestBox .requestBtn{display: block; width: 48%; padding: 0.3em; border: 2px solid; font-size: 100%; text-align: center; border-radius: 0.5em; background-color: #fff;}
header nav.naviBox > ul > li.koushaLi .trialRequestBox .trialBtn{color: #ff1759;}
header nav.naviBox > ul > li.koushaLi .trialRequestBox .requestBtn{color: #f7931e;}

header nav.naviBox ul{ margin:0 auto;}
header nav.naviBox ul.mainList{}
header nav.naviBox li{ font-size:1.125rem; width:100%; margin:1em auto; display:block;}
header nav.naviBox li a{ font-size:0.875rem; font-weight:500; text-align:center; line-height:1.2em; margin:0; padding:0;}
header nav.naviBox li dl{ max-width:320px; width:100%; margin:0 auto;}
header nav.naviBox li dt{ font-size:0.75rem; font-weight:normal; text-align:center; color:#aaa;}
header nav.naviBox li .subList{ padding:0; margin:0.3em 0; border-top:1px dotted #ccc; border-bottom:1px dotted #ccc;}
header nav.naviBox li .subList li{ font-size:0.75rem; text-align:left; -webkit-box-pack:left; -ms-flex-pack:left; justify-content:left; margin:1em 0; color:#666;}
header nav.naviBox li #jmkList li,
header nav.naviBox li #childrenList li{ width:48%;}
header nav.naviBox li #sportsList li,
header nav.naviBox li #noavaList li{ text-align:center; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;}

header nav.naviBox li .subList li .subListBox{
    text-align: center;
    margin-top: 1em;
}
header nav.naviBox li .subList li .subListBox p{
    text-align: center;
    color: #fff;
    padding: 1px;
    margin: auto;
}
header nav.naviBox li .subList li .subListBox p a{
    position: relative;
    margin: 6px auto;
}

header nav.naviBox li .subList li .subListBox p a:after {
    content: "＞";
    position: absolute;
    right: 27%;
    top: 1.8px;
}

@media screen and (max-width: 767px) {
  header nav.naviBox > ul > li.koushaLi .koushaDt{font-size: 100%;}
}


header nav.naviBox > ul > li.formBtn a:after{ content:normal;}
header nav.naviBox > ul > li.schools{margin: 0;}
header nav.naviBox > ul > li.schools a{font-size: 95%;}
header nav.naviBox > ul > li.schoolsList{text-align:left; width:470px; margin:0 auto;}
header nav.naviBox > ul > li.schoolsList a{padding-left: 1.5em;}
header nav.naviBox > ul > li.koushaLi .koushaDd a::before,
header nav.naviBox > ul > li.schoolsList a::before{
	content: "";
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		width: 1em;
		height: 2px;
		background-color: #FFF;
}
header nav.naviBox > ul > li.koushaLi .koushaDd a.trialBtn:before,
header nav.naviBox > ul > li.koushaLi .koushaDd a.requestBtn:before{display: none;}
header nav.naviBox > ul > li.schoolsList span{  font-size: 80%; color: #FFF; margin-left: 0.5em;}

header nav.naviBox .snsLi{position: relative; margin: 0.5em auto 0;}

header nav.naviBox .snsLi a{padding: 0.2em;}
header nav.naviBox .snsLi:first-child a{padding-top: 0.5em;}
header nav.naviBox .snsLi img{ margin-right: 0.8em;}
header nav.naviBox .schoolListPageLink a{margin: 1em auto 0;background-color: #00a199d6;padding: 0.2em 0.5em 0.25em;border-radius: 10px;border: 2px solid #ffffff;color: #fff;font-size: 95%;}
header nav.naviBox .line a{color: #06c755;}
header nav.naviBox .line{margin: 1em auto 1em;}
header nav.naviBox .telLi{ font-size:133.333%;}
header nav.naviBox .telLi dl{ background-color:#fff; border-radius:10px; padding:1em; margin:1em auto;}
header nav.naviBox .telLi dt{ font-weight:500; text-align:center;}
header nav.naviBox .telLi dd { text-align:center;}
header nav.naviBox .telLi dd a{ color:#00a199; font-size:135%; font-weight:500; padding:0.2em 0 0.6em;}
header nav.naviBox .telLi dd ul{ padding:0.5em 0;}
header nav.naviBox .telLi dd li{ font-size:87.5%; border:none; color:#333;}
header nav.naviBox .telLi dd li span{ width:6em;}
header nav.naviBox .telLi dd:last-of-type{ border-top:1px solid #b5b5b5; text-align:center; padding-top:0.4em; font-size:90%;}
header nav.naviBox .telLi{margin: 1em auto 1em;}


header #menuBtn{display:block; right:1em; top:14%; width:2em; height:42px; cursor:pointer; margin:0; position:absolute; z-index:2;}
header #menuBtn{margin-top: 0.2em;}
header #menuBtn span{display:block; position:absolute; width:2em; height:2px; border-radius:2px; background-color:#00a199; -webkit-transition:.35s ease-in-out; -o-transition:.35s ease-in-out; transition:.35s ease-in-out;}
header #menuBtn span{background-color: #413a58;}
header #menuBtn span:nth-of-type(1){ top:8px;}
header #menuBtn span:nth-of-type(2){ top:20px;}
header #menuBtn span:nth-of-type(3){ bottom:8px;}
header nav.naviBox.active{ -webkit-transform:translateX(0%); -ms-transform:translateX(0%); transform:translateX(0%); height:100%; overflow-y:scroll;}
/* 最初のspanをマイナス45度に */
header #menuBtn.active span:nth-child(1) {
	top:20px;
	-webkit-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	    transform:rotate(-45deg);
}
/* 2番目と3番目のspanを45度に */
header #menuBtn.active span:nth-child(2),
header #menuBtn.active span:nth-child(3){
	top:20px;
	-webkit-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	    transform:rotate(45deg);
}
header #menuBtn.active span{ background-color:#fff;}
header nav.naviBox.active{ -webkit-transform:translateX(0%); -ms-transform:translateX(0%); transform:translateX(0%); height:100%; overflow-y:scroll; -ms-overflow-style:none; scrollbar-width:none; padding-bottom: 3em;}
header nav.naviBox.active::-webkit-scrollbar{ display:none;}
header nav.naviBox{ display:block;}


/* 640px以下*/
@media screen and (max-width:640px){
	header .headerInner{width: 95%;}
	header .btnBox p a{font-size: 90%;}
	header .tel{right: 15%;}
}

/*----------------------------------------------------------------------------
 ***                                                              contentsArea
----------------------------------------------------------------------------*/

/* 640px以下*/
@media screen and (max-width:640px){
}


/*----------------------------------------------------------------------------
 ***                                                                  footer
----------------------------------------------------------------------------*/
#footerArea{margin: 0.5em 2.5% 0;}
#footerCopy{overflow: hidden; margin: 0.5em 0 0 0; border-top: #999 dotted 1px;}
#footLogo{width: 30%; float: left;}
#cpTxt{width: 60%; float: right;}

/* 640px以下*/
@media screen and (max-width:640px){
}


/*----------------------------------------------------------------------------
 ***                                                              ページトップ
----------------------------------------------------------------------------*/
.pageTop{ position:fixed; right:0.5em; bottom:0.5em; z-index:100;}
.pageTop a{
	width:50px;
	height:50px;
	background-color:#fff;
	border-radius:50px;
	border:2px solid #00AAE7;
	position:relative;
	color:#00AAE7;
	font-weight:500;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
        -ms-flex-align:center;
            align-items:center;
    -webkit-box-pack:center;
        -ms-flex-pack:center;
            justify-content:center;
	-webkit-transition:all .3s;
	-o-transition:all .3s;
	transition:all .3s;
}
.pageTop a:hover{ background-color:#00AAE7; color:#fff; text-decoration:none;}