/* カスタマイズ用CSS */

body { 
    font-family: "Noto Sans JP", sans-serif;
}


.ec-layoutRole {
    background-image: url(/html/user_data/assets/img/top/top_bg.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

a {color: #444;font-size: 100%;}
a:hover {color: #888;}
p {line-height: 1.8;}
dd {line-height: 1.8;}
li {margin-bottom: 0.36rem;line-height: 1.8;}

.ss_yellow {color: #ffbf00;}

.disp_blc {display: block;}

.ma_tp_0 {margin-top: 0rem;}
.ma_tp_0_25 {margin-top: 0.25rem;}
.ma_tp_0_5 {margin-top: 0.5rem;}
.ma_tp_1 {margin-top: 1rem;}
.ma_tp_1_5 {margin-top: 1.5rem;}
.ma_tp_2 {margin-top: 2rem;}
.ma_tp_3 {margin-top: 3rem;}
.ma_tp_4 {margin-top: 4rem;}
.ma_tp_5 {margin-top: 5rem;}

.ma_bt_0 {margin-bottom: 0rem;}
.ma_bt_0_25 {margin-bottom: 0.25rem;}
.ma_bt_0_35 {margin-bottom: 0.35rem;}
.ma_bt_0_5 {margin-bottom: 0.5rem;}
.ma_bt_0_75 {margin-bottom: 0.75rem;}
.ma_bt_1 {margin-bottom: 1rem;}
.ma_bt_1_5 {margin-bottom: 1.5rem;}
.ma_bt_2 {margin-bottom: 2rem;}
.ma_bt_3 {margin-bottom: 3rem;}
.ma_bt_4 {margin-bottom: 4rem;}
.ma_bt_5 {margin-bottom: 5rem;}

.ma_tb_1 {margin: 1rem 0 1rem 0}
.ma_tb_2 {margin: 2rem 0 2rem 0}
.ma_tb_3 {margin: 3rem 0 3rem 0}
.ma_tb_4 {margin: 4rem 0 4rem 0}

.ma_le_0 {margin-left: 0;}
.ma_le_0_5 {margin-left: 0.5rem;}
.ma_le_1 {margin-left: 1.0rem;}
.ma_le_2 {margin-left: 2rem;}
.ma_le_3 {margin-left: 3rem;}

.pa10 {padding: 1rem}
.pa15 {padding: 1.5rem}
.pa20 {padding: 2rem}
.pa25 {padding: 2.5rem}
.pa30 {padding: 3rem}

.pa_tp_0_5 {padding-top: 0.5rem;}
.pa_tp_0 {padding-top: 0rem;}
.pa_tp_1 {padding-top: 1rem;}
.pa_tp_1_5 {padding-top: 1.5rem;}
.pa_tp_2 {padding-top: 2rem;}
.pa_tp_3 {padding-top: 3rem;}
.pa_tp_4 {padding-top: 4rem;}
.pa_tp_5 {padding-top: 5rem;}

.pa_bt_0_25 {padding-bottom: 0.25rem;}
.pa_bt_0_5 {padding-bottom: 0.5rem;}
.pa_bt_1 {padding-bottom: 1rem;}
.pa_bt_1_5 {padding-bottom: 1.5rem;}
.pa_bt_2 {padding-bottom: 2rem;}
.pa_bt_2_5 {padding-bottom: 2.5rem;}
.pa_bt_3 {padding-bottom: 3rem;}
.pa_bt_4 {padding-bottom: 4rem;}
.pa_bt_5 {padding-bottom: 5rem;}

.pa_le_0 {padding-left: 0;}
.pa_le_0_5 {padding-left: 0.5rem;}
.pa_le_1 {padding-left: 1.0rem;}
.pa_le_2 {padding-left: 2rem;}
.pa_le_3 {padding-left: 3rem;}

.pa_ri_1 {padding-right: 1rem;}
.pa_ri_2 {padding-right: 2rem;}
.pa_ri_3 {padding-right: 3rem;}

.pa_tb_0_5 {padding: 0.5rem 0 0.5rem 0}
.pa_tb_1 {padding: 1rem 0 1rem 0}
.pa_tb_2 {padding: 2rem 0 2rem 0}
.pa_tb_3 {padding: 3rem 0 3rem 0}
.pa_tb_4 {padding: 4rem 0 4rem 0}
.pa_tb_5 {padding: 5rem 0 5rem 0}

.pa_lr_0_25 {padding-left: 0.25rem;padding-right: 0.25rem;}
.pa_lr_0_5 {padding-left: 0.5rem;padding-right: 0.5rem;}
.pa_lr_1 {padding-left: 1rem;padding-right: 1rem;}

.font_bold {font-weight: bold;}
.font_nomal {font-weight: normal;}

.font35 {font-size: 35%;}
.font40 {font-size: 40%;}
.font50 {font-size: 50%;}
.font60 {font-size: 60%;}
.font70 {font-size: 70%;}
.font75 {font-size: 75%;}
.font80 {font-size: 80%;}
.font85 {font-size: 85%;}
.font90 {font-size: 90%;}
.font95 {font-size: 95%;}
.font97 {font-size: 97%;}
.font105 {font-size: 105%;}
.font110 {font-size: 110%;}
.font115 {font-size: 115%;}
.font120 {font-size: 120%;}
.font125 {font-size: 125%;}
.font130 {font-size: 130%;}
.font135 {font-size: 135%;}
.font140 {font-size: 140%;}
.font150 {font-size: 150%;}
.font160 {font-size: 160%;}
.font165 {font-size: 165%;}
.font170 {font-size: 170%;}
.font180 {font-size: 180%;}
.font190 {font-size: 190%;}
.font200 {font-size: 200%;}
.font220 {font-size: 220%;}
.font240 {font-size: 240%;}

.lh05 {line-height: 0.5}
.lh08 {line-height: 0.8}
.lh10 {line-height: 1.0}
.lh12 {line-height: 1.2}
.lh14 {line-height: 1.4}
.lh15 {line-height: 1.5}
.lh16 {line-height: 1.6}
.lh17 {line-height: 1.7}
.lh18 {line-height: 1.8}
.lh20 {line-height: 2.0}
.lh21 {line-height: 2.1}
.lh22 {line-height: 2.2}
.lh23 {line-height: 2.3}
.lh24 {line-height: 2.4}

.text_center {text-align: center;}
.text_right {text-align: right;}
.text_left {text-align: left;}

.letter02 {letter-spacing: 0.2px}
.letter05 {letter-spacing: 0.5px}
.letter10 {letter-spacing: 1.0px}
.letter12 {letter-spacing: 1.2px}
.letter15 {letter-spacing: 1.5px}
.letter17 {letter-spacing: 1.7px}
.letter20 {letter-spacing: 2.0px}

.red {color: #f94b4b;}
.black {color: #1a1623;}
.purple {color: #5d5dc1;}
.gray2 {color: #222;}
.gray2 {color: #333;}
.gray4 {color: #444;}
.gray5 {color: #555;}
.gray6 {color: #666;}
.gray7 {color: #777;}
.gray8 {color: #888;}
.gray9 {color: #999;}
.graya {color: #aaa;}
.grayb {color: #bbb;}
.grayc {color: #ccc;}
.grayd {color: #ddd;}
.graye {color: #eee;}

.li_disc {list-style: disc;}
.li_circle {list-style: circle;}
.li_square {list-style: square;}
.li_none {list-style: none;}

.img_width100 {width: 100%;}
.img_width98 {width: 98%;}
.img_width90 {width: 90%;}
.img_width80 {width: 80%;}
.img_width70 {width: 70%;}
.img_width60 {width: 60%;}
.img_width50 {width: 50%;}
.img_width40 {width: 40%;}
.img_width30 {width: 30%;}
.img_width20 {width: 20%;}
.img_width15 {width: 15%;}

.img_width5px {width: 5px;}
.img_width7px {width: 7px;}
.img_width10px {width: 10px;}
.img_width15px {width: 15px;}
.img_width20px {width: 20px;}
.img_width50px {width: 50px;}
.img_width60px {width: 60px;}
.img_width70px {width: 70px;}
.img_width80px {width: 80px;}
.img_width90px {width: 90px;}
.img_width100px {width: 100px;}
.img_width120px {width: 120px;}
.img_width150px {width: 150px;}
.img_width200px {width: 200px;}
.ec-productRole .img_width7px {width: 7px;}


/*bnrなど用PC・SP*/

.p1_4_s_1_15 {
    padding:2rem 0 4rem 0 ;
}

@media only screen and (min-width: 768px){
    .p1_4_s_1_15 {
    padding:2rem 0 4rem 0 ;
    }
}

@media screen and (max-width: 767px){
    .p1_4_s_1_15 {
    padding:0rem 0 2.5rem 0 ;
    }
}

/*bnrなど用PC・SP end*/

.block {display: block;}
.flex {display: flex;}
.flex_btw {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    align-items: center;
}
.clear {clear: both; border: none; background: none;}

.op90 { opacity: 0.9;}
.op70 { opacity: 0.7;}

.ec-headerNav__item .icon03 {width:55px;padding:1px 8px;opacity:0.9;}
.ec-headerNav__item .icon04 {width:55px;padding:1px 8px;opacity:0.9;}
.ec-headerNav__item .icon05 {width:55px;padding:1px 8px;opacity:0.9;}
.ec-cartNavi__icon .icon06 {width:35px;padding:1px 3px;}
.ec-headerNav__item .icon07 {width:55px;padding:1px 3px;opacity:0.9;}

.ec-headerTitle .ec-headerTitle__title a {
    font-size: 80%;
    font-weight: normal;
    text-align: left;
    color: #888;
    text-align: center;
}

.ec-headerTitle img {
    width: 160px;
    padding-bottom: 0.5rem;
}

.nav_left_ul li {
    background-image: url(/html/user_data/assets/img/common/icon02.png);
    background-repeat: no-repeat;
    background-size: 10px;
    padding: 0 0 1.7rem 1.0rem;
    list-style: none;
}

.icon02_link {
    background-image: url(/html/user_data/assets/img/common/icon02.png);
    background-repeat: no-repeat;
    background-size: 10px;
    padding: 0 0 0.5rem 1.0rem;
    list-style: none;
}

.top_h3 {
    font-size: 94%;
    font-weight: bold;
    border-bottom: 1.2px solid #ffbf00;
    margin-bottom: 1.5rem;
    padding-bottom: 0.8rem;
}

.top_recommend {
    background-image: url(/html/user_data/assets/img/common/icon01.png);
    background-repeat: no-repeat;
    background-size: 20px;
    margin-top:0;
    padding: 0 0 0.5rem 1.8rem;
}

.logo_nav ul li {
    list-style: none;
}

.gnav {
    line-height: 2.3;
}

.gnav ul li span {
    position: relative;
    bottom: 0;
}

.ec-headerTitle .ec-headerTitle__title .gnav_a {
    font-size: 106%;
    color: #444;
    font-weight: 600;
    border-bottom: 2px solid #fff;
}
.ec-cartNavi .ec-cartNavi__badge {
    background-color: #aaa;
}
.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search {
    background: #ffbf00;
}

.ec-footerRole {
    background: #ffbf00;
    border: none;
    opacity: 0.8;
}

.ec-blockBtn--action {
    background-color: #fc9047;
    border-color: #fc9047;
}

.ec-blockBtn--cancel{
    background-color: #ddd;
    border-color: #ddd;
}

/* ------------------------------------------------- 
 Top Tab
------------------------------------------------- */
div.mod-list-tab-01-wrapper ul.mod-list-tab-01 {
    width: 100%;
    margin: 1.5rem 0 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li {
    width: calc((100% - 10px) / 4); 
    margin: 0 1px 0 0;
    box-sizing: border-box;
    list-style: none;
}

div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li a {
    display: block;
    padding: 10px 2px;
    background: #efefef;
    text-align: center;
    font-size: 81%;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border:solid #ddd;
    border-width:1px 1px 0px 1px;
}

div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li a.is-active {  
    background: #fff;
    color: #333;
    font-weight: bold;
}

.js-tab-content{
    display: none;
    background: #fff;
    color: #fff;
    padding: 1.5rem 0.5rem 2.0rem 0.5rem;
}

.js-tab-content.is-active {
    display: block;
}

.js-tab-content .top_h3 {
    color: #333;
}

.re_ar_01 {
    color: #fff;
    background-color: #999;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_02 {
    color: #fff;
    background-color: #9dd1f4;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_03 {
    color: #fff;
    background-color: #76d3c3;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_04 {
    color: #fff;
    background-color: #fc8bb1;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_05 {
    color: #fff;
    background-color: #d29dfc;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_06 {
    color: #fff;
    background-color: #fc937e;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }

/* ------------------------------------------------- 
 レスポンシブ用カラム設定
------------------------------------------------- */

/**カラム左2：右8**/
.container_column28 {
    display: flex;
    flex-wrap: wrap;
}
.column--l28,
.column--r28 {
    width: 100%;
    color: #1a1623;
}

.column--l28 {
    padding: 0 4.5rem;
}

@media (min-width: 1024px) {
  .column--l28 {
    width: 20%;
    padding: 0 2rem 1.5rem 0;
    margin-bottom: 1rem;
  }
  .column--r28 {
    width: 80%;
    font-size: 110%;
  }
}

/**カラム左8：右2**/
.container_column82 {
    display: flex;
    flex-wrap: wrap;
}
.column--l82,
.column--r82 {
    width: 100%;
    color: #1a1623;
}

.column--l82 {
    padding: 0 4.5rem;
}

@media (min-width: 1024px) {
  .column--l82 {
    width: 80%;
    padding: 0 2rem 1.5rem 0;
    margin-bottom: 1rem;
  }
  .column--r82 {
    width: 20%;
    font-size: 110%;
  }
}


/**カラム左7：右3**/
.container_column73 {
    display: flex;
    flex-wrap: wrap;
}
.column--l73,
.column--r73 {
    width: 100%;
    color: #1a1623;
}

.column--r73 {
    padding: 0 3.5rem;
}

@media (min-width: 1024px) {
  .column--l73 {
    width: 70%;
  }
  .column--r73 {
    width: 30%;
    padding: 0 0 1.5rem 2rem;
    margin-bottom: 1rem;
  }
}

/**カラム左3：右7**/
.container_column37 {
    display: flex;
    flex-wrap: wrap;
}
.column--l37,
.column--r37 {
    width: 100%;
    color: #1a1623;
}

.column--l37 {
    padding: 0 4.5rem;
}

@media (min-width: 1024px) {
  .column--l37 {
    width: 30%;
    padding: 0 2rem 1.5rem 0;
    margin-bottom: 1rem;
  }
  .column--r37 {
    width: 70%;
  }
}

/**カラム左7：右3**/
.container_column73 {
    display: flex;
    flex-wrap: wrap;
}
.column--l73,
.column--r73 {
    width: 100%;
    color: #1a1623;
}

.column--r73 {
    padding: 0 3.5rem;
}

@media (min-width: 1024px) {
  .column--l73 {
    width: 70%;
  }
  .column--r73 {
    width: 30%;
    padding: 0 0 1.5rem 2rem;
    margin-bottom: 1rem;
  }
}

/**カラム左6：右4**/
.container_column64 {
    display: flex;
    flex-wrap: wrap;
}
.column--l64,
.column--r64 {
    width: 100%;
    color: #1a1623;
}

.column--l64 {
    padding: 0 4.5rem;
}

@media (min-width: 1024px) {
  .column--l64 {
    width: 60%;
    padding: 0 2rem 1.5rem 0;
    margin-bottom: 1rem;
  }
  .column--r64 {
    width: 40%;
  }
}

/**カラム左3：右7スマホでも横並び**/
.container_column37_2 {
    display: flex;
    flex-wrap: wrap;
    }
  .column--l37_2 {
    width: 20%;
    padding: 0 2rem 1.5rem 0;
    margin-bottom: 1rem;
  }
  .column--r37_2 {
    width: 80%;
  }

@media screen and (max-width: 767px){

.column--l37_2 {
    width: 30%;
    color: #1a1623;
    }
.column--r37_2 {
    width: 67%;
    color: #1a1623;
    padding-left: 0.6rem;
    }
.column--l37_2 {
    padding: 0 0.5rem 0 1.5rem;
    }
}

/**カラム左2：右8スマホでも横並び2**/
.container_column28_2 {
    display: flex;
    flex-wrap: wrap;
    }
  .column--l28_2 {
    width: 20%;
    padding: 0 2rem 1.5rem 0;
    margin-bottom: 1rem;
  }
  .column--r28_2 {
    width: 80%;
  }

@media screen and (max-width: 767px){

.column--l28_2 {
    width: 40%;
    color: #1a1623;
    }
.column--r28_2 {
    width: 60%;
    color: #1a1623;
    padding-left: 0.6rem;
    }
.column--l28_2 {
    padding: 0 0.5rem 0 1.5rem;
    }
}

/**カラム左2：右8スマホでも横並びメニュー用3**/
.container_column28_3 {
    display: flex;
    flex-wrap: wrap;
    }
  .column--l28_3 {
    width: 20%;
    padding: 0 2rem 1.5rem 0;
    margin-bottom: 1rem;
  }
  .column--r28_3 {
    width: 80%;
  }

@media screen and (max-width: 767px){

.column--l28_3 {
    width: 22%;
    color: #1a1623;
    margin: 0 0 0 0;
    }
.column--r28_3 {
    width: 74%;
    color: #1a1623;
    padding-left: 0rem;
    margin: 0 0 0 0;
    }
.column--r28_3 dl {
    padding: 0.2rem 0 0 0;
    margin: 0 0 0 0;
    }
.column--r28_3 dt {
    font-size: 88%;
    line-height: 1.2;
    font-weight: bold;
    padding: 0 0 0.2rem 0;
    margin: 0 0 0 0;
    color: #333;
    }
.column--r28_3 dd {
    font-size: 78%;
    line-height: 1.4;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    color: #444;
    }
.column--l28_3 {
    padding: 0 0.5rem 0 0rem;
    }
.column--l28_3 img {
    width: 100%;
    }
.re_ar_01 {
    color: #fff;
    background-color: #999;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_02 {
    color: #fff;
    background-color: #9dd1f4;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_03 {
    color: #fff;
    background-color: #76d3c3;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_04 {
    color: #fff;
    background-color: #fc8bb1;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_05 {
    color: #fff;
    background-color: #d29dfc;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.re_ar_06 {
    color: #fff;
    background-color: #fc937e;
    font-size: 60%;
    padding: 0.12rem 0.5rem;
    border-radius: 0.5rem;
    }
.column--r28_3 .re_ar {
    padding: 0;
    margin: 0;
    line-height: 1.4;
    font-weight: bold;
    }

.column--r28_3 .re_ar_name {
    font-size: 72%;
    color: #333;
    font-weight: normal;
    padding-left: 0.3rem;
    }
}

/*-----------------------------
For PC
-------------------------------*/

@media only screen and (min-width: 768px) {
  .pc_none {display: none;}
  .ec-headerNaviRole {
      padding-bottom: 25px;
  }
  .ec-newItemRole {
      padding: 0 0 60px 0;
  }
  .ec-newItemRole .ec-newItemRole__listItemTitle {
      margin: 5px 0 10px;
  }
.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search {
    border-top-right-radius: inherit;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
  }
.ec-headerSearch .ec-headerSearch__keyword {
    float: left;
    width: 57%;
    border-bottom-left-radius: inherit;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    }
.ec-cartNavi {
    display: flex;
    justify-content: space-between;
    border-radius: 20px;
    box-sizing: border-box;
    padding: 8px 17px 10px 10px;
    width: auto;
    min-width: 140px;
    height: 44px;
    white-space: nowrap;
    cursor: pointer;
    background: #fff;
    }
.ec-headerSearch .ec-headerSearch__keyword input[type="search"] {
    background: #fff;
}
    
.ec-footerRole .ec-footerRole__inner img {
    width: 160px;
    }
.ec-headerTitle .ec-headerTitle__title {
    justify-content: space-around;
    }
.ec-headerTitle img {
    width: 160px;
}

.column--l28_3 img {
    width: 100%;
}
.js-tab-content {
    background: none;
    padding: 2.5rem 0.5rem 2.0rem 0.5rem;
}

/*Topのタブ部分*/
.top_h3 {
    font-size: 120%;
    margin-bottom: 2rem;
    }
.pc_re {
    width: 25%;
    float: left;
    }
.column--l28_3 {
    width: 100%;
    padding: 0 2rem 0rem 0;
    margin-bottom: 0.5rem;
    }
.re_ar_01 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_02 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_03 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_04 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_05 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_06 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.column--r28_3 p {
    margin-bottom: 0.2rem;
    }
.column--r28_3 .pa_ri_2 {
    padding-right: 0rem;
    }
.pa_ri_2 .font80 {
    font-size: 100%;
    }
.re_ar_name {
    display: block;
    font-size: 85%;
    line-height: 1.5;
    }
.column--r28_3 dd {
    margin-bottom: 0.1rem;
    font-size: 85%;
    }
div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li a {
    font-size: 96%;
    background: none;
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
    border-bottom-left-radius: 18px;
    border-bottom-right-radius: 18px;
    border-width: 1.5px 1.5px 1.5px 1.5px;
    border: solid #ffbf00 1px;
    }
div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li {
    width: calc((100% - 60px) / 4);
    margin: 0 10px 0 0;
    box-sizing: border-box;
    list-style: none;
    }
 div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li a.is-active {
    background: #ffbf00;
    color: #fff;
    }
/*ティーチャープロフィール*/
.tchr_prf_ph {
    width: 100%;
    }

}


/*-----------------------------
For TBL
-------------------------------*/

@media screen and (max-width: 991px) {
    
.ec-headerTitle .ec-headerTitle__title .gnav_a {
    font-size: 90%;
    }
.tbl_none {display: none;}

/*Topのタブ部分*/
.top_h3 {
    font-size: 120%;
    margin-bottom: 3rem;
    }
.js-tab-content{
    display: none;
    background: none;
    padding: 2rem 0.5rem 2.0rem 0.5rem;
    }
.pc_re {
    width: 25%;
    float: left;
    }
.column--l28_3 {
    width: 100%;
    padding: 0 2rem 0rem 0;
    margin-bottom: 0.5rem;
    }
.re_ar_01 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_02 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_03 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_04 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_05 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.re_ar_06 {
    font-size: 75%;
    border-radius: 0.8rem;
    }
.column--r28_3 p {
    margin-bottom: 0.2rem;
    }
.column--r28_3 .pa_ri_2 {
    padding-right: 0rem;
    }
.pa_ri_2 .font80 {
    font-size: 100%;
    }
.re_ar_name {
    display: block;
    font-size: 85%;
    line-height: 1.5;
    }
.column--r28_3 dd {
    margin-bottom: 0.1rem;
    font-size: 85%;
    }
div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li a {
    font-size: 96%;
    background: none;
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
    border-bottom-left-radius: 18px;
    border-bottom-right-radius: 18px;
    border-width: 1.5px 1.5px 1.5px 1.5px;
    border: solid #ffbf00 1px;
    }
div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li {
    width: calc((100% - 60px) / 4);
    margin: 0 10px 0 0;
    box-sizing: border-box;
    list-style: none;
    }
 div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li a.is-active {
    background: #ffbf00;
    color: #fff;
    }
/*ティーチャープロフィール*/
.tchr_prf_ph {
    width: 100%;
    }
    
}

/*-----------------------------
For SP
-------------------------------*/

@media screen and (max-width: 767px){
    .sp_none {display: none;}
    
    .sp_pa_tp_0_5 {padding-top: 0.5rem;}
    .sp_pa_tp_0 {padding-top: 0rem;}
    .sp_pa_tp_1 {padding-top: 1rem;}
    .sp_pa_tp_1_5 {padding-top: 1.5rem;}
    .sp_pa_tp_2 {padding-top: 2rem;}
    .sp_pa_tp_3 {padding-top: 3rem;}
    .sp_pa_tp_4 {padding-top: 4rem;}
    .sp_pa_tp_5 {padding-top: 5rem;}

    .sp_pa_bt_0_25 {padding-bottom: 0.25rem;}
    .sp_pa_bt_0_5 {padding-bottom: 0.5rem;}
    .sp_pa_bt_1 {padding-bottom: 1rem;}
    .sp_pa_bt_1_5 {padding-bottom: 1.5rem;}
    .sp_pa_bt_2 {padding-bottom: 2rem;}
    .sp_pa_bt_3 {padding-bottom: 3rem;}
    .gnav {display: none;}
    .ec-headerTitle__title h1 {text-align: center; margin:0 auto;}
    .ec-headerTitle .ec-headerTitle__title h1 {
     margin: 0 auto;
     position: absolute;
     top: -51px;
     left: 58px;
     width: 90px;
     font-size: 8.5px;
    }
    .sp_pa_ri_0 {padding-right: 0;}
    .ec-footerNavi .ec-footerNavi__link a {
        border: none;
    }
    
.ec-headerNav__item .icon03 {width:36px;padding:1px 3px;}
.ec-headerNav__item .icon04 {width:36px;padding:1px 3px;}
.ec-headerNav__item .icon05 {width:36px;padding:1px 3px;}
.ec-cartNavi__icon .icon06 {width:35px;padding:1px 3px;}
.ec-headerNav__item .icon07 {width:36px;padding:1px 3px;}

.ec-headerTitle img {
    padding-top: 0.2rem;
    padding-bottom: 0.1rem;
    width: 120px;
}

.nav_left_ul li {
    background-size: 7px;
    background-position: 0% 32%;
}

.icon02_link {
    background-size: 7px;
    background-position: 0% 32%;
}

/*Topのタブ部分補正*/
.top_h3 {
  font-size: 94%;
  margin-bottom: 1.5rem;
}
.top_recommend_sp_br {
    border: none;
    border-bottom: 0.5px solid #aaa;
    }
.pc_re {
    float: none;
    width: 100%;
    }
.pc_none {display: block;}
.tbl_none {display: block;}
.column--l28_3 {
    width: 20%;
    } 
.js-tab-content{
    display: none;
    background: #fff;
    padding: 1.5rem 0.5rem 2.5rem 0.5rem;
    }
.column--l28_3 {
    width: 20%;
    padding: 0.2rem 0.5rem 0 0;
    margin-bottom: 0;
    }
.re_ar_01 {
    font-size: 60%;
    border-radius: 0.5rem;
    }
.re_ar_02 {
    font-size: 60%;
    border-radius: 0.5rem;
    }
.re_ar_03 {
    font-size: 60%;
    border-radius: 0.5rem;
    }
.re_ar_04 {
    font-size: 60%;
    border-radius: 0.5rem;
    }
.re_ar_05 {
    font-size: 60%;
    border-radius: 0.5rem;
    }
.re_ar_06 {
    font-size: 60%;
    border-radius: 0.5rem;
    }
.column--r28_3 p {
    margin-bottom: 1rem;
    }
.pa_ri_2 {
    padding-right: 2rem;
    }
.pa_ri_2 .font80 {
    font-size: 88%;
    }
.re_ar_name {
    display: inline;
    line-height: 1.8;
    }
.column--r28_3 dd {
    margin-bottom: 0.1rem;
    font-size: 80%;
    }
div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li a {
    font-size: 81%;
    background: #efefef;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-width: 0.1px 0.1px 0px 0.1px;
    border: #fff 0.1px;
    }
div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li {
    width: calc((100% - 10px) / 4);
    margin: 0 1px 0 0;
    box-sizing: border-box;
    list-style: none;
    }
div.mod-list-tab-01-wrapper ul.mod-list-tab-01 li a.is-active {
    background: #fff;
    color: #333;
    font-weight: bold;
    }
/*ティーチャープロフィール*/
.tchr_prf_ph {
    width: 100%;
    padding: 2.5rem 0 1rem 0;
    }
.column--l37_2 {
    margin: 0 auto;
    padding: 0;
    }
.column--r37_2 {
    width: 100%;
    }
.tchr_prf dt {
    margin: 0 auto;
    text-align: center;
    }
.tchr_prf dd {
    padding: 1rem 0.75rem 0 0.6rem;
    margin: 0;
    }

}