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

/*----------------------------------------------------------------------------
***                                                                  sideBox
----------------------------------------------------------------------------*/
/*----- 【汎用型】 -----*/
#sideBox{
    background:#fdf0f1;
    }
#sideBox nav#sidr{padding-top: 50px;}
#sideBox nav ul{/* border-bottom:1px solid #ccc; */}
#sideBox nav .sidrTopUl,
#sideBox nav .sidrBottomUl{width: 90%;max-width: 735px;margin: 0 auto;}
#sideBox nav .sidrTopUl li {width: 48%; margin: 0.2em 0;}
#sideBox nav .sidrTopUl li a{display: block;width: 100%;border: 3px solid #e74051;font-size: 82%;padding:5px 0;border-radius: 2em;background: #fff;color: #000; font-weight:bold;}
#sideBox nav .sidrTopUl li a:hover{text-decoration: none; opacity: .7;}
#sideBox nav .sidrBottomUl {margin-top: 2em;}
#sideBox nav .sidrBottomUl .sidrBottomLi{text-align: center; margin-bottom: 0.3em;}
#sideBox nav .sidrBottomUl .sidrBottomLi.top a{font-size: 150%; font-weight: bold; color:#e74051;}
#sideBox nav .sidrBottomUl .sidrBottomLi a {color: #000;}
#sideBox nav .sidrBottomUl .sidrBottomLi.login{border-top: 1px solid;margin: 0.5em auto;padding: 0.5em 0;}
#sideBox nav .sidrBottomUl .sidrBottomLi.login a{font-size: 100%; font-weight: bold; color:#e74051;}


#sideBox nav ul:last-child{border-bottom:none;}
#sideBox nav ul ul{border-bottom:none;}
#sideBox nav li{/* font-size: 1.25rem; */font-size: 135%;}
#sideBox nav li *{font-size:100%;}
#sideBox #sidr_top{border-bottom:1px solid #ccc;}
#sideBox #sidr_bottom{overflow-y:auto;}
/*無料体験レッスン・資料請求・スクールを探す・TEL*/
#sideBox .formBox{padding: 2em 5%;}
#sideBox .formBox li:last-child{border-bottom:none;}
#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 .contentsList .classList{}
#sideBox .contentsList .classList li.linkBtn a{display:table; width:100%;}
#sideBox .contentsList .classList .childList{/* background:#5c5c5c; */}

/*各コンテンツリスト*/
#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(/livestation/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(/livestation/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(/livestation/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: 100;padding-top: 3em;}
body.mode_A #sideBox.open{right:0%;}
body.mode_A #sideBox .other .titleBox .txt_title{font-weight:bold;}

#headerArea #sideBox .moushikomiBtn{margin: 1em auto;width: 70%;max-width: 290px;}