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

/*----------------------------------------------------------------------------
 ***                                                                Container
----------------------------------------------------------------------------*/
body {
}
#wrap {font-size: 16px;}



/*----------------------------------------------------------------------------
 ***                                                                  Header
----------------------------------------------------------------------------*/
#headerArea {}
#headerAreaLogo {}

#pageTitle {position: relative;}
#pageTitle h2 {position: absolute; top: 50%; left: 0; padding-top:0; transform: translateY(-50%); line-height: 1;}
#pageTitle .classTtl .className{display:block;line-height: 1;font-size: 80%;}
#pageTitle .classTtl .classTxt{font-size: 55%;font-weight: normal;}

.babyLevelWrap #pageTitle .classTtl .className{color: #ff3998;}
.babyLevelWrap #pageTitle{background-image:url(/junior/baby/images/2207/bgi_contents01.jpg);}
.kinderLevelWrap #pageTitle .classTtl .className{color: #f9963d;}
.kinderLevelWrap #pageTitle{background-image:url(/junior/kids/images/2207/bgi_contents01.jpg);}
.elementaryLevelWrap #pageTitle .classTtl .className{color: #71c43e;}
.elementaryLevelWrap #pageTitle{background-image:url(/junior/elementary/images/2207/bgi_contents01.jpg);}


/*----------------------------------------------------------------------------
 ***                                                       Header - gNavi
----------------------------------------------------------------------------*/
#gNavi{}


/*----------------------------------------------------------------------------
 ***                                                              contentsArea
----------------------------------------------------------------------------*/
#contentsArea {}
#contentsAreaInner {}
h2 {}


/*----------------------------------------------------------------------------
 ***                                                              mainsection
----------------------------------------------------------------------------*/
.mainSection {}
.mainSectionInner {}

.midashiBox {padding: 0.9em 0 1em 1em;}
.midashiBox .midashi{background:none;padding: 0;margin: 0;color: #4d4d4d;height: auto;line-height: 1;}
.babyLevelWrap .midashiBox{background: #fff5fa; border-left: 5px solid #ff3998;}
.babyLevelWrap .midashiSubtxt{color: #ff3998;}
.kinderLevelWrap .midashiBox{background: #fff5ec; border-left: 5px solid #f9963d;}
.kinderLevelWrap .midashiSubtxt{color: #f9963d;}
.elementaryLevelWrap .midashiBox{background: #f9fcf7;border-left: 5px solid #71c43e;}
.elementaryLevelWrap .midashiSubtxt{color: #71c43e;}


#agePointSec .aboutAgeUl .leftBox{width: 22%;}
#agePointSec .aboutAgeUl .leftBox{position: relative;}
#agePointSec .aboutAgeUl .leftBox .age{position: absolute;top: 0;right: 0.5em;width: 3em;height: 3em;line-height: 3em;text-align: center;border-radius: 2em;font-size: 110%;}

.babyLevelWrap #agePointSec .aboutAgeUl .leftBox .age{background: #fff5fa;color: #ff3998;font-weight: bold;}
.kinderLevelWrap #agePointSec .aboutAgeUl .leftBox .age{background: #fff5ec;color: #f9963d;font-weight: bold;}
.elementaryLevelWrap #agePointSec .aboutAgeUl .leftBox .age{background: #f9fcf7;color: #71c43e;font-weight: bold;font-size: 100%;padding: 0.3em;}

#agePointSec .aboutAgeUl {padding: 1em 0;}
#agePointSec .aboutAgeUl .aboutAgeLi{margin-bottom: 1.2em;}
#agePointSec .aboutAgeUl .rightBox{width: 76%;}
#agePointSec .agePointUl {width: 100%;}
#agePointSec .agePointUl li {font-size: 105%;font-weight: bold; padding-left:2em;line-height: 1.6;}

.babyLevelWrap #agePointSec .aboutAgeUl .rightBox{position: relative;border: 2px solid #ff3998; padding: 1em; box-sizing: border-box; border-radius: 1em;}
.babyLevelWrap #agePointSec .aboutAgeUl .rightBox:before{content:""; width: 17px; height: 20px; background: url("/junior/baby/images/2207/fukidashi_contents01.png"); display: block; position: absolute; top: 50%; left: -17px;}
.babyLevelWrap #agePointSec .agePointUl li {background-image:url(/junior/baby/images/2207/ico_contents01.png);background-repeat: no-repeat;background-position: center left;}
.babyLevelWrap #agePointSec .agePointUl li .marker{background: linear-gradient(#fff 70%, #fff5fa 0%);}
.kinderLevelWrap #agePointSec .aboutAgeUl .rightBox{position: relative;border: 2px solid #f9963d; padding: 1em; box-sizing: border-box; border-radius: 1em;}
.kinderLevelWrap #agePointSec .aboutAgeUl .rightBox:before{content:""; width: 17px; height: 20px; background: url("/junior/kids/images/2207/fukidashi_contents01.png"); display: block; position: absolute; top: 50%; left: -17px;}
.kinderLevelWrap #agePointSec .agePointUl li {background-image:url(/junior/kids/images/2207/ico_contents01.png);background-repeat: no-repeat;background-position: center left;}
.kinderLevelWrap #agePointSec .agePointUl li .marker{background: linear-gradient(#fff 70%, #fff5ec 0%);}
.elementaryLevelWrap #agePointSec .aboutAgeUl .rightBox{position: relative;border: 2px solid #71c43e;padding: 1em;box-sizing: border-box;border-radius: 1em;}
.elementaryLevelWrap #agePointSec .aboutAgeUl .rightBox:before{content:"";width: 17px;height: 20px;background: url("/junior/elementary/images/2207/fukidashi_contents01.png");display: block;position: absolute;top: 50%;left: -17px;}
.elementaryLevelWrap #agePointSec .agePointUl li {background-image:url(/junior/elementary/images/2207/ico_contents01.png);background-repeat: no-repeat;background-position: center left;}
.elementaryLevelWrap #agePointSec .agePointUl li .marker{background: linear-gradient(#fff 70%, #f9fcf7 0%);}

#agePointSec input.kuwashikuInput{display: none;}
#agePointSec .kuwashikDetail{height: 0;padding: 0;overflow: hidden;opacity: 0;visibility: hidden; position:relative;margin: 0;}
#agePointSec .kuwashikuLabel{position: relative;display: block;background-color: #b3b3b3;width: 8em;margin: 0.7em auto 0;color: #fff;padding-right: 1em;border-radius: 1em;text-align: center;}
#agePointSec .kuwashikuLabel:hover{cursor: pointer; opacity: .7;}
#agePointSec .kuwashikuLabel:before{content: ""; display: block; position: absolute; right: 1em;top: 30%;  width: 0; height: 0;border-style: solid;border-width: 8px 5px 0 5px;border-color: #ffffff transparent transparent transparent;}
#agePointSec .kuwashikuInput:checked + label.kuwashikuLabel:before{content: ""; display: block; position: absolute; right: 1em;top: 30%;  width: 0; height: 0;border-style: solid;border-width: 0 5px 8px 5px;border-color: transparent transparent #ffffff transparent;}
#agePointSec .kuwashikuInput:checked + label + .kuwashikDetail {height: auto;opacity: 1;padding: 0.8em 1em;visibility: visible;width: auto;margin-top: 0.5em;}

.babyLevelWrap #agePointSec .kuwashikuInput:checked + label + .kuwashikDetail {background-color: #fff5fa;}
.kinderLevelWrap #agePointSec .kuwashikuInput:checked + label + .kuwashikDetail {background-color: #fff5ec;}
.elementaryLevelWrap #agePointSec .kuwashikuInput:checked + label + .kuwashikDetail {background-color: #f9fcf7;}

.sectionInner{padding: 1.5em 1em;}


.conTopSec{ position:relative;}
.conTopSec #usagiBox{
	position: absolute;
	top: -30px;
	right: 20px;
}
#conTopImg{ margin: 10px 0 0 25px;}

.schoolListBtnBox #schoolListBtnBox .leftBox .koushasuBox{top: 2.1em; left: 2.3em; font-size: 100%;}
.schoolListBtnBox #schoolListBtnBox .rightBox .schoolListBtnUl li a{padding: 0.25em 0 0.1em;}

#corseSec .priceAreaA,
#corseSec .priceAreaB,
#corseSec .priceAreaC{display: none;}
#corseSec #areaSelectAndSatelliteBtn .satellitePrice a{width: 325px;}

#nbkNaraSec{border: 1px solid #ff7bac;padding: 2em 0.5em;background-color: #fffef9;font-size: 110%;}
#nbkNaraSec h3{background: none;padding: 0;margin: 0;width: 100%;}
#nbkNaraSec h3 span{color: #ff7bac;padding: 0 0.5em;text-align: center;display: inline-block;border-bottom: 2px dotted #ff7bac;width: auto;margin: 0 auto 1em;font-size: 130%;}
#nbkNaraSec .nbkNaraUl{width: 100%;margin-top: 1.5em;}
#nbkNaraSec .nbkNaraLi{width: 48%;margin-bottom: 1em;}
.babyLevelWrap #nbkNaraSec .nbkNaraLi:nth-child(n+2){width: 48%;margin-bottom: 0;}
.babyLevelWrap .mainSection .section#nbkNaraSec .sectionInner{padding-bottom:0;}

#nbkNaraSec .nbkNaraLi:nth-child(5){width: 100%;margin-bottom: 0;}
#nbkNaraSec .nbkNaraDl{}
#nbkNaraSec .nbkNaraDl .img {margin: 0 0.5em 0 0;}
#nbkNaraSec .nbkNaraDl dt {padding: 1em 0.5em;}
#nbkNaraSec .nbkNaraDl dt .ttl {font-size: 110%;margin: 0;line-height: 1.2;width: 70%;}
#nbkNaraSec .nbkNaraLi:nth-child(5) .nbkNaraDl dt .ttl{width: auto;}
#nbkNaraSec .nbkNaraDl dd{padding: 0.5em 1em;line-height: 1.4;font-size: 95%;}

#nbkNaraSec .nbkNaraDl.point01 dt {background-color: #cff2f8;}
#nbkNaraSec .nbkNaraDl.point01 dt .ttl {color: #31a2c2; line-height: 1.5;}
#nbkNaraSec .nbkNaraDl.point02 dt {background-color: #edd5f5;}
#nbkNaraSec .nbkNaraDl.point02 dt .ttl {color: #a252cd;}
#nbkNaraSec .nbkNaraDl.point03 dt {background-color: #dcf5ce;}
#nbkNaraSec .nbkNaraDl.point03 dt .ttl {color: #64c749;}
#nbkNaraSec .nbkNaraDl.point04 dt {background-color: #ffebd6;}
#nbkNaraSec .nbkNaraDl.point04 dt .ttl {color: #fca65b;}
#nbkNaraSec .nbkNaraDl.point05 dt {background-color: #ffe1ed;}
#nbkNaraSec .nbkNaraDl.point05 dt .ttl {color: #fe588a;font-size: 160%;line-height: 1;}
#nbkNaraSec .nbkNaraDl.point05 .superBilingualUl{border: 2px solid #fe588a;}
#nbkNaraSec .nbkNaraDl.point05 .superBilingualUl dl{border-bottom: 1px dotted #fe588a;}
#nbkNaraSec .nbkNaraDl.point05 .superBilingualUl >li:last-child dl{border-bottom: none;}
#nbkNaraSec .nbkNaraDl.point05 .superBilingualUl .superBilingual dt{ vertical-align:middle;border-right: 1px solid #fe588a;background: #fff9fb;text-align: center;color: #fe588a;font-size: 120%;}
#nbkNaraSec .nbkNaraDl.point05 .superBilingualUl .superBilingual dd{background-color: #fff;}
#nbkNaraSec .nbkNaraDl.point05 .superBilingualUl >li:first-child .superBilingual dt{}

.omoushikomiBox{width: 523px; margin: 3em auto 3em;}

.parentVoiceUl {margin: 1em 0;}
.parentVoiceUl li{width: 48%;max-width: 330px;border: 1px solid #ccc; margin-bottom: 1.5em;}
/*.parentVoiceUl li .img {width: 100%; margin: 0; padding: 0;}
.parentVoiceUl li .img img{width: 100%; height: auto;}*/
.parentVoiceUl li .img {width: 100%;margin: 0;padding: 0;height: 200px;overflow: hidden; position: relative;}
.parentVoiceUl li .img img{display: block; width: 45%; height: auto; position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%)}
.parentVoiceUl li .img.imgyoko img{width: 80%;}
.parentVoiceUl li .commentBox {padding: 1em;}
.parentVoiceUl li .commentBox .name{font-size: 120%;font-weight: bold;margin: 0 0 1em 0;position: relative;}
.parentVoiceUl li .commentBox .name span{display: inline-block; margin-left: 1em;font-size: 90%; font-weight: normal; color: #aaa;}
.parentVoiceUl li .commentBox .name:after{content: "";display: block;width: 3em;position: absolute;bottom: -0.4em}

.babyLevelWrap .parentVoiceUl li .commentBox .name{color: #ff3998;}
.babyLevelWrap .parentVoiceUl li .commentBox .name:after{border-bottom: 1px solid #ff3998;}
.kinderLevelWrap .parentVoiceUl li .commentBox .name{color: #f9963d;}
.kinderLevelWrap .parentVoiceUl li .commentBox .name:after{border-bottom: 1px solid #f9963d;}
.elementaryLevelWrap .parentVoiceUl li .commentBox .name{color: #71c43e;}
.elementaryLevelWrap .parentVoiceUl li .commentBox .name:after{border-bottom: 1px solid #71c43e;}



#faqSec #nbkFaq .questionS{margin-bottom: 2em;}

/*開閉部分*/
/*ラベルのデザイン*/
#faqSec #nbkFaq label {display: block;font-size: 110%;font-weight: bold;transition: all .5s;width: auto;position: relative;padding: 0.7em 2.7em 0.7em 3em;}
#faqSec #nbkFaq label:hover {cursor:pointer;}
/*チェックボックス非表示*/
#faqSec #nbkFaq input {display: none;}
/*プラスマーク*/
#faqSec #nbkFaq label:before {content: '';display: block;width: 17px;height: 3px;border-radius: 5px;background-color: #81eae0;position: absolute;right: 1em;top: 50%;transform: translateY(-50%) rotate(90deg);transition: all ease 0.3s;}
#faqSec #nbkFaq label:after {content: '';display: block;width: 17px;height: 3px;border-radius: 5px;background-color: #81eae0;position: absolute;right: 1em;top: 50%;transform: translateY(-50%);}
/*詳細のデフォルト非表示*/
#faqSec #nbkFaq li .answer {height: 0; padding: 0; overflow: hidden; opacity: 0; visibility: hidden; position:relative;}
/*詳細を表示*/
#faqSec #nbkFaq .question:checked + label + .answer {height: auto;background: #fff;opacity: 1;padding: 1em 3em 1em 3.4em;background-color: #f5f5f5;visibility: visible;width: auto;}
#faqSec #nbkFaq .answer:before {content:'A：';font-size: 1em;font-weight:bold;display:block;position:absolute;left: 1.5em;}
/*詳細を表示している時の＋マークを－へ*/
#faqSec #nbkFaq .question:checked + label:before { transform: translateY(-50%) rotate(0);}
/*詳細の中身*/
#faqSec #nbkFaq .questionS .qNo {position: absolute;left: 1em;}
#faqSec #nbkFaq .questionS .miniTtl {color: #DE2582; font-weight:bold;display: inline-block; margin:0.2em 0;}
#faqSec #nbkFaq .questionS .pink{color:#ee93ad;}
#faqSec #nbkFaq .questionS .bold {font-weight: bold;}
#faqSec #nbkFaq .questionS .importantPink {color: #DE2582;font-weight: bold;text-decoration:underline;}

/*レベルごとの差分*/
.babyLevelWrap #faqSec #nbkFaq h4 {color: #ff3998;}
.babyLevelWrap #faqSec #nbkFaq label{border-bottom: 1px dotted #ff3998;}
.babyLevelWrap #faqSec #nbkFaq label:before {background-color: #ff3998;}
.babyLevelWrap #faqSec #nbkFaq label:after {background-color: #ff3998;}
.kinderLevelWrap #faqSec #nbkFaq h4 {color: #f9963d;}
.kinderLevelWrap #faqSec #nbkFaq label{border-bottom: 1px dotted #f9963d;}
.kinderLevelWrap #faqSec #nbkFaq label:before {background-color: #f9963d;}
.kinderLevelWrap #faqSec #nbkFaq label:after {background-color: #f9963d;}
.elementaryLevelWrap #faqSec #nbkFaq h4 {color: #71c43e;}
.elementaryLevelWrap #faqSec #nbkFaq label{border-bottom: 1px dotted #71c43e;}
.elementaryLevelWrap #faqSec #nbkFaq label:before {background-color: #71c43e;}
.elementaryLevelWrap #faqSec #nbkFaq label:after {background-color: #71c43e;}



.mottoBtn a{display: block; width: 35%; font-weight: bold; padding: 0.5em 1em; font-size: 130%; color: #fff; box-sizing: border-box; border-radius: 2em; margin: 0 auto; background: #888; text-align: center;}
.mottoBtn a:hover{text-decoration: none;}
/*----------------------------------------------------------------------------
 ***                                                              rightsection
----------------------------------------------------------------------------*/
.rightSection {}
.rightSectionInner {}

#levelBetsuCourseTab{border: 2px solid #e6006f;margin-bottom: 0.8em;}
#levelBetsuCourseTab > li { border-top: 1px dotted #e6006f;}
#levelBetsuCourseTab > li a{display: block;padding: 0.3em 0.5em 0.25em 0.5em;}
#levelBetsuCourseTab > li a:hover{text-decoration: none;}
#levelBetsuCourseTab > li:nth-child(-n+2){border-top: none;}
#levelBetsuCourseTab .jhs,
#levelBetsuCourseTab .online,
#levelBetsuCourseTab .eiken{padding: 0.7em 0;}
#levelBetsuCourseTab .levelName {font-weight: bold; font-size: 120%;}
#levelBetsuCourseTab .age{font-size: 90%; color: #4d4d4d;}

#levelBetsuCourseTab .baby .levelName{color: #ff399b;}
#levelBetsuCourseTab .kinder .levelName{color: #fa943c;}
#levelBetsuCourseTab .elementary .levelName{color: #71c43e;}
#levelBetsuCourseTab .jhs .levelName{color: #09b1c5;}
#levelBetsuCourseTab .online .levelName{color: #6a6cdd;}
#levelBetsuCourseTab .eiken .levelName{color: #993db5;}

#levelBetsuCourseTab .currentP{margin: 0; padding: 0.3em 0.5em 0.25em 0.5em;}
#levelBetsuCourseTab .online .currentP,
#levelBetsuCourseTab .eiken .currentP{padding: 0.7em 0;}

#levelBetsuCourseTab .baby.current,
#levelBetsuCourseTab .baby:hover{background-color: #fff5fa;}
#levelBetsuCourseTab .kinder.current,
#levelBetsuCourseTab .kinder:hover{background-color: #fff8fa;}
#levelBetsuCourseTab .elementary.current,
#levelBetsuCourseTab .elementary:hover{background-color: #f9fcf7;}
#levelBetsuCourseTab .jhs.current,
#levelBetsuCourseTab .jhs:hover{background-color: #f2fcfc;}
#levelBetsuCourseTab .online.current,
#levelBetsuCourseTab .online:hover{background-color: #f8faff;}
#levelBetsuCourseTab .eiken.current,
#levelBetsuCourseTab .eiken:hover{background-color: #faf5fc;}


#levelBetsuCourseTab .ttl{background-color: #e6006f;font-weight: bold; color:#fff;padding: 0.5em 0;}


/*----------------------------------------------------------------------------
 ***                                                                  footer
----------------------------------------------------------------------------*/
#footerArea p{}
#footerArea {}
#footerAreaLink{ }
#footerAreaInner { }
#footerAreaLogo{}
#footerCopyright{}




/*----------------------------------------------------------------------------
 ***                                                              ページトップ
----------------------------------------------------------------------------*/
.pagetop {
}

/*----------------------------------------------------------------------------
 ***                                                                   section
----------------------------------------------------------------------------*/
.section { }
.sectionInner {}
