@charset "UTF-8";
@media screen and (min-width : 601px){


  /* -------------------------------------------------------------------------------------------
  *
  * MV
  *
  * ----------------------------------------------------------------------------------------- */

  #main_box{
    overflow: hidden;
    height: 288px;
    background-image: url("../images/mainImg_pc.jpg");
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: top center;
  }
  #main_box h2{
    height: 100%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 !important;
  }

  #main_box h2 .ttl{
    font-weight: 700;
    font-size: 3.125rem;
    line-height: 1;
    color: #fff;
  }

  /* -------------------------------------------------------------------------------------------
  *
  * 検索パネル
  *
  * ----------------------------------------------------------------------------------------- */

  .searchPanel{
    background-color: #ffffff;
    padding: 26px 31px;
    margin: -78px 0 40px;
    box-sizing: border-box;
    border: 1px solid #3C3C43;
    border-radius: 10px;
    width: 100%;
    z-index: 1;
  }
  .filter_controle{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
  }
  .searchPanel .filterbox_all{
    width: 11.8%;
    margin: 0;
  }
  .searchPanel .filterbox_outer{
    display:-webkit-box;
    display:-ms-flexbox;
    display: flex;
    vertical-align: top;
    width: 87.2%;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .sortBtnList_outer.subject{
    width: 71.8%;
    margin: 0 0.6rem 0 0;
  }
  .sortBtnList_outer.web{
    width: 27%;
  }
  .sortBtnList_outer.school{
    width: 100%;
  }

  .searchPanel .sortBtnList{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .searchPanel .subject .sortBtnList{
    width: 100%;
  }
  .js_isIe .searchPanel .sortBtnList{
    overflow: hidden;
    padding: 1px;
  }
  .searchPanel .sortBtn{
    box-sizing: border-box;
    border-radius: 1.5rem;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0 0 1px #c0c0c0;
    box-shadow: 0 0 0 1px #c0c0c0;
    color: #707070;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    -webkit-transition: opacity .5s ease;
    transition: opacity .5s ease;
    width: 146px;
    margin: 0 0.6rem 16px 0;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    }
    .searchPanel .sortBtn.all{
      width: 100%;
      margin: 0;
    }
    .filterbox.subject .sortBtn:nth-child(3),
    .filterbox.subject .sortBtn:nth-child(4),
    .filterbox.school .sortBtn:nth-child(3){
      width: 170px;
    }
    .searchPanel .filterbox .sortBtn.wide{
      width:100%;
      margin: 0 0 16px;
    }

    .searchPanel .sortBtn.active{
      -webkit-box-shadow: 0 0 0 2px #af8f68;
      box-shadow: 0 0 0 2px #af8f68;
      color: #af8f68;
    }
    .searchPanel .sortBtn.disable{
      background-color: #dddddd;
      -webkit-box-shadow: 0 0 0 2px #dddddd;
      box-shadow: 0 0 0 2px #dddddd;
      color: #ffffff;
      cursor: default;
      pointer-events: none;
    }
    .searchPanel .sortBtn:hover{
      opacity: 0.8;
    }

    .searchPanel .school .sortBtn{
      margin: 0 0.6rem 0 0;
    }
    .searchPanel .sortBtn:last-child{
      margin-right: 0;
    }

  .searchPanel .sortBtnLink{
    line-height: 1;
    padding: 10px 0;
    display: block;
    white-space: nowrap;
    }
    .searchPanel .select_area .sortBtnLink{
      padding: 10px 21px 10px 16px;
    }
    #newsletter .searchPanel .select_area .sortBtnLink{
      padding: 10px 21px 8px 16px;
    }


  .searchPanel .sortBtn .circle{
    display: inline-block;
    /*vertical-align: middle;*/
    border-radius: 50%;
    width: 0.75rem;
    height: 0.75rem;
    margin: 0 0.625rem 0 0;
    }
    .searchPanel .sortBtn .circle.rika{
      background-color: #45b036;
    }
    .searchPanel .sortBtn .circle.seikatsu{
      background-color: #ee791d;
    }
    .searchPanel .sortBtn .circle.sansu{
      background-color: #0078b9;
    }
    .searchPanel .sortBtn .circle.taiiku{
      background-color: #7d4798;
    }



  .searchPanel .sortBtn .icon{
    display: inline-block;
    vertical-align: middle;
    width: 1.25rem;
    height: 1.25rem;
    margin: -0.25rem 0.625rem 0 0;
    }
    .searchPanel .sortBtn.active .icon{
      fill: #af8f68 !important;
    }


  .divider{
    padding: 0 0 20px 0;
    border-top: 1px solid #C0C0C0;
  }






  /* -------------------------------------------------------------------------------------------
  *
  * 検索結果
  *
  * ----------------------------------------------------------------------------------------- */

  #sub_contents{
    padding: 0 0 64px 0;
  }

  #sub_contents ul{
    width: -webkit-calc(100% + 1.25rem);
    width: calc(100% + 1.25rem);
    margin: 0 -1.25rem 0 auto;
    position: relative;
    overflow: hidden;
  }
  #sub_contents ul::after{
    content: '';
    display: block;
    width: 24%;
  }
  #sub_contents ul.space-2::after{
    width: 49.3%;
  }
  #sub_contents ul.space-3::after{
    width: 74.6%;
  }


  #sub_contents ul li{
    background-color: #ffffff;
    padding: 0 1rem 1rem 0;
    width: -webkit-calc(24.875% - 1rem);
    width: calc(24.875% - 1rem);
  }

  #sub_contents ul li a{
    display: inline-block;
    vertical-align: top;
  }

  #sub_contents ul li a img{
    width: 100%;
  }

  #sub_contents ul li div.txt{
    box-sizing: border-box;
    margin: 0;
    padding: 0.75rem 0 0 0;
    width: 100%;
    font-size: 0.9375rem;
  }


  #sub_contents ul li div.update_txt{
    margin: 0.6875rem 0 0 0;
    box-sizing: border-box;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
  }





}@media screen and (max-width : 600px){

  .inner {
    width: 96%;
    margin: 0 0 0 auto;
  }

  /* -------------------------------------------------------------------------------------------
  *
  * MV
  *
  * ----------------------------------------------------------------------------------------- */

  #main_box{
    overflow: hidden;
    height: 9.3125rem;
    background-image: url("../images/mainImg_sp.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
  }
  #main_box h2{
    height: 9.3125rem;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  #main_box h2 .ttl{
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1;
    color: #fff;
  }


  /* -------------------------------------------------------------------------------------------
  *
  * 検索パネル
  *
  * ----------------------------------------------------------------------------------------- */

  .searchPanel{
    width: 100%;
    padding: 2rem 0;
    position: relative;
  }

  .searchPanel .filterbox_all{
    display: block;
    width: 28%;
  }

  .searchPanel .sortBtnList{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
  }
    .js_isIe .searchPanel .sortBtnList{
      overflow: hidden;
      padding: 1px;
    }

  .searchPanel .sortBtn{
    box-sizing: border-box;
    border-radius: 1.5rem;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0 0 1px #c0c0c0;
    box-shadow: 0 0 0 1px #c0c0c0;
    color: #707070;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    -webkit-transition: opacity .5s ease;
    transition: opacity .5s ease;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    }

    .searchPanel .filterbox .sortBtn.wide{
      margin: 0;
    }

    .searchPanel .sortBtn.active{
      -webkit-box-shadow: 0 0 0 2px #af8f68;
      box-shadow: 0 0 0 2px #af8f68;
      color: #af8f68;
    }
    .searchPanel .sortBtn.disable{
      background-color: #dddddd;
      -webkit-box-shadow: 0 0 0 2px #dddddd;
      box-shadow: 0 0 0 2px #dddddd;
      color: #ffffff;
      cursor: default;
      pointer-events: none;
    }
    .searchPanel .sortBtn:hover{
      opacity: 0.8;
    }
    .searchPanel .sortBtn{
      margin: 0 4% 16px 0;
      width: 26%;
    }
    .searchPanel .sortBtn.all{
      width: 100%;
    }
   .filterbox.subject .sortBtn:nth-child(3),
   .filterbox.subject .sortBtn:nth-child(4){
      width: 36%;
    }
  .sortBtnList_outer.web{
    width: 54%;
    position: absolute;
    top: 8.2rem;
    left: 39.5%;
  }
  .filterbox.school .sortBtn {
    width:26%;
    margin: 0 4% 0 0;
  }
  .filterbox.school .sortBtn:nth-child(3){
    width:36%;
  }
  .searchPanel .filterbox .sortBtn.wide{
    width:100%;
  }

    .searchPanel .sortBtn:last-child{
      margin-right: 0;
    }
    .searchPanel .sortBtnLink{
      line-height: 1;
      padding: 10px 0;
      display: block;
    }
    .searchPanel .select_area .sortBtnLink{
      padding: 10px 21px 10px 16px;
    }
    #newsletter .searchPanel .select_area .sortBtnLink{
      padding: 10px 21px 8px 16px;
    }


  .searchPanel .sortBtn .circle{
    display: inline-block;
    border-radius: 50%;
    width: 0.75rem;
    height: 0.75rem;
    margin: 0 0.625rem 0 0;
    }
    .searchPanel .sortBtn .circle.rika{
      background-color: #45b036;
    }
    .searchPanel .sortBtn .circle.seikatsu{
      background-color: #ee791d;
    }
    .searchPanel .sortBtn .circle.sansu{
      background-color: #0078b9;
    }
    .searchPanel .sortBtn .circle.taiiku{
      background-color: #7d4798;
    }

  .searchPanel .sortBtn .icon{
    display: inline-block;
    vertical-align: middle;
    width: 1rem;
    height: 1.125rem;
    margin: -0.25rem 0.625rem 0 0;
    }
    .searchPanel .sortBtn.active .icon{
      fill: #af8f68 !important;
    }


  /* -------------------------------------------------------------------------------------------
  *
  * 検索結果
  *
  * ----------------------------------------------------------------------------------------- */

  #sub_contents{
    padding: 0 0 2.5rem 0;
  }

  #sub_contents ul{
    width: -webkit-calc(100% + 1.25rem);
    width: calc(100% + 1.25rem);
    margin: 0 -1.25rem 0 auto;
    position: relative;
    overflow: hidden;
  }

  #sub_contents ul li{
    background-color: #ffffff;
    padding: 0 1rem 1rem 0;
    width: -webkit-calc(48% - 1rem);
    width: calc(48% - 1rem);
  }

  #sub_contents ul li a{
    display: inline-block;
    vertical-align: top;
  }

  #sub_contents ul li a img{
    width: 100%;
  }

  #sub_contents ul li div.txt{
    box-sizing: border-box;
    margin: 0;
    padding: 0.75rem 0 0 0;
    width: 100%;
    font-size: 0.9375rem;
  }


  #sub_contents ul li div.update_txt{
    margin: 0.6875rem 0 0 0;
    box-sizing: border-box;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
  }

}

/* 個別調整部分 */


  /* -------------------------------------------------------------------------------------------
  *
  * 検索パネル
  *
  * ----------------------------------------------------------------------------------------- */
@media screen and (min-width: 601px) and (max-width: 1210px){

  .sortBtnList_outer.subject{
    margin: 0 1% 0 0;
  }
  .searchPanel .sortBtn{
    width:22%;
    margin: 0 1.6% 16px 0;
  }
  .filterbox.subject .sortBtn:nth-child(3),
  .filterbox.subject .sortBtn:nth-child(4){
    width: 25.5%;
  }
  .filterbox.school .sortBtn{
    width: 15.8%;
    margin: 0 1.2% 0 0;
  }
  .filterbox.school .sortBtn:nth-child(3){
    width: 18.2%;
  }
  .searchPanel .filterbox .sortBtn.wide{
    width:100%;
  }

}

@media screen and (min-width: 601px) and (max-width: 1024px){
  .searchPanel .filterbox_all{
    width: 20%;
  }
  .searchPanel .filterbox_outer{
    width: 78%;
  }
  .sortBtnList_outer.subject{
    width: 100%;
    margin:0;
  }
  .sortBtnList_outer.web{
    width: 46%;
  }
  .filterbox.school .sortBtn {
    width: 22.1%;
    margin: 0 1.5% 0 0;
  }
  .filterbox.school .sortBtn:nth-child(3){
    width: 25.2%;
  }

  .searchPanel .sortBtn{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
  }


  #sub_contents ul li{
    width: -webkit-calc(33.2% - 1rem);
    width: calc(33.2% - 1rem);
  }

}

@media screen and (min-width: 601px) and (max-width: 780px){
  .searchPanel .sortBtn{
    width:30%;
    margin: 0 1.6% 16px 0;
  }
  .filterbox.subject .sortBtn:nth-child(3),
  .filterbox.subject .sortBtn:nth-child(4){
    width: 34.9%;
  }
  .sortBtnList_outer.web{
    width: 46%;
    position: absolute;
    top: 52px;
    left: 50.5%;
  }
  .filterbox.school .sortBtn {
    width: 30%;
    margin: 0 1.5% 0 0;
  }
  .filterbox.school .sortBtn:nth-child(3){
    width: 34.9%;
  }

}




/* 旧SE等調整部分 */
@media screen and (max-width: 359px){
 
  .searchPanel{
    max-height: 78vh;
    overflow: auto;
  }
 
  .searchPanel ul.searchCat li p{
    font-size: 0.75rem;
  }
  .searchPanel ul.searchCat li.cat_03 p{
    font-size: 0.625rem;
    white-space: nowrap;
  }

  .searchPanel ul.searchAge li{
    padding: 0.625rem 0.625rem 0.625rem 0.75rem;
  }
  .searchPanel ul.searchAge li svg{
    width: 0.875rem;
    height: 0.875rem;
  }
  
  .searchPanel .sortBtn p{
    font-size: 0.75rem;
  }

  .searchPanel ul.searchSub li{
    padding: 0.625rem 0.625rem 0.625rem 0.875rem;
  }
  .searchPanel ul.searchSub li p{
    margin: 0 0 0 0.5rem;
  }

}