@charset "utf-8";
/* CSS Document */
body{width:100%;}

/*----------------------------------------------------------------------------
***                                                                  sideBox
----------------------------------------------------------------------------*/
/*----- 【汎用型】 -----*/
#sideBox{
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+61,f2f2f2+100 */
    background: rgb(255,255,255); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,1) 61%, rgba(242,242,242,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 61%,rgba(242,242,242,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 61%,rgba(242,242,242,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-9 */
}
#sideBox nav ul{border-bottom:1px solid #ccc;}
#sideBox nav ul:last-child{border-bottom:none;}
#sideBox nav ul ul{border-bottom:none;}
#sideBox nav li{/* font-size: 1.25rem; */font-size: 125%;}
#sideBox nav li *{font-size:100%;}
#sideBox #sidr_top{border-bottom:1px solid #ccc;}
#sideBox #sidr_bottom{overflow-y:auto;}
/*HOMEボタン,CLOSEボタン*/
#sideBox .other .closeBox{display:table; width: 100%;}
#sideBox .other .closeBox .homeBtn{display:table-cell; width:80%; padding-left:2%; text-align:left; vertical-align:middle;}
#sideBox .other .closeBox .homeBtn a{display:inline-block;width: 48%;}
#sideBox .other .closeBox .menuBtn{width: 20%;padding: 4% 2% 4% 0;display:table-cell;line-height: 1;}
/*タイトル*/
#sideBox .titleList{padding:3% 2%;}
#sideBox .titleList .titleBox{width: 100%;display: inline-block;text-align:left;padding:0% 0;}
#sideBox .titleList .titleBox .txt_title{font-weight:bold;/* font-size: 1rem; */}
/*無料体験レッスン・資料請求・スクールを探す・TEL*/
#sideBox .formBox{padding: 2em 5%;}
#sideBox .formBox li:last-child{border-bottom:none;}
#sideBox .formBox .list00{width: 100%;float:none; clear:both; margin: 2% 0;}
#sideBox .formBox .list00 p{font-weight: bold;text-align: center;font-size: 140%;color: #666;}
#sideBox .formBox .list01{width: 43%;float:left;margin: 0% 2% 0% 6%;}
#sideBox .formBox .list02{width: 43%;float:left;margin: 0% 6% 0% 0%;}
#sideBox .formBox .list03{clear:both;margin: 2% 0;}
#sideBox .formBox .list_tel{padding: 0 15%;}

#sideBox .list_school{padding:0 6%;}
#sideBox .list_school .txt.top{display:block;text-align:center;color:#ffe600;font-size: 85%;}
#sideBox .list_school .txt.bottom{display:block;text-align:center;font-weight:bold;font-size: 110%;line-height: 1.3;}

#sideBox .contentsList .classList{}
#sideBox .contentsList .classList li.linkBtn a{display:table; width:100%;}
#sideBox .contentsList .classList .linkBtn .txt{display:table-cell; text-align:left;}
#sideBox .contentsList .classList .linkBtn .txt_L{width: 3em;}
#sideBox .contentsList .classList .linkBtn .txt_R{width: calc(100% - 3em);}
#sideBox .contentsList .classList .childList{/* background:#5c5c5c; */}

/*バナー*/
#sideBox .bannerList li{}
#sideBox .bannerList li .bannerBox{display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap;}
#sideBox .bannerList li .bannerBox p{width:50%;padding: 2%;}

/*各コンテンツリスト*/
#sideBox .contentsList{/* background: #333; */}
#sideBox .contentsList > li{border-bottom:1px solid #ccc;}
#sideBox .contentsList li:last-child{border-bottom:none;}
#sideBox .contentsList .titleTxt{background: url(/images/ico_plus.png) no-repeat right 4% center/ 2em auto;padding: 1.5em 0% 1.5em 5%;margin: 0;font-size: 100%;color: #333;/* font-weight:bold; */position: relative;line-height: 1;cursor: pointer;}
#sideBox .contentsList .titleTxt.open{background: url(/images/ico_minus.png) no-repeat right 4% center/ 2em auto;}
#sideBox .contentsList .childList{background:#f2f2f2;padding-left: 10%;border-top:1px solid #ccc;}
#sideBox .contentsList li.linkBtn{border-bottom:1px solid #ccc;}
#sideBox .contentsList li.linkBtn:last-child{border-bottom:none;}
#sideBox .contentsList li.linkBtn a{padding: 1.5em 10% 1.5em 0;line-height: 1;color: #333;display: flex;align-items: center;text-decoration: none;background: url(/images/ico_sideArrow.png) no-repeat right 5% center /1em auto;}
#sideBox .contentsList li.icoImg a{padding: 1.25em 10% 1.25em 0;}
#sideBox .contentsList li.icoImg a img{width: 1em;margin-right: 0.3em;}

/*その他リスト*/
#sideBox .otherList li{padding-left: 5%;/* font-weight:bold; */}

/*----- 【mode_A 縦長の時の挙動】 -----*/
body.mode_A #mainArea{}
body.mode_A #sideBox{width: 100%;height: 100%;overflow-y: scroll;transform-style: preserve-3d;transition:right 0.5s ease;position: fixed;top:0;right: -100%;box-shadow: -1px 1px 4px 0px #aaa;z-index: 88;}
body.mode_A #sideBox.open{right:0%;}
body.mode_A #sideBox .other .titleBox .txt_title{font-weight:bold;}

/*----- 【mode_B 横長の時の挙動】 -----*/
body.mode_B #dummyBox{}
body.mode_B #dummyBox img{width: 22%;}
body.mode_B #headerArea #headerAreaInner{padding: 1% 3% 1% 3%;}
body.mode_B #headerArea .trialBtn{padding: 0 1% 0 11%;}
body.mode_B #headerArea .requestBtn{padding: 0 11% 0 1%;}
body.mode_B #headerArea #meinLogo{padding-right:10%;}
body.mode_B #headerArea .logoBox p{width: 13%;}
body.mode_B #headerArea .menuBtn{display:none;}
body.mode_B #mainArea{float:left; width:65%;}
body.mode_B #mainSlideBox #slBoxLP{width:65vw;}
body.mode_B #sideBox{width:35%;transition:none;float:right;border-top:2px solid #e6e6e6; background:#f8f8f8;}
body.mode_B #sideBox *{}
body.mode_B #sideBox .contentsList .childList{/*background:#fff;*/}
body.mode_B #sideBox.open{right:0%;}
body.mode_B #sideBox .other{display:none;}
body.mode_B #sideBox .titleList{display:none;}
body.mode_B #sideBox .formBox .list01{/* display:none; */}
body.mode_B #sideBox .formBox .list02{/* display:none; */}