@charset "UTF-8";


/*========================

// id #title

===========================*/

#title {
  position: relative;


  .logo_sr {
    display: none;
  }
}

#h1_pc {
  display: none;
}

#h1_mob {
  display: block;
}


@media screen and (min-width: 1000px) {

  #title {
    background: url(../img/top/bg_title_4.jpg) no-repeat top center;

    .logo_sr {
      display: block;
      width: 22%;
      position: absolute;
      top: 45px;
      left: 10%;
      z-index: 2;
    }

    .inside {
      max-width: 1920px;
      margin-inline: auto;
      position: relative;
    }

    .inside::before {
      content: '';
      width: 22%;
      aspect-ratio: 416 / 617;
      position: absolute;
      top: 80px;
      left: 3.5%;
      z-index: 2;
      background: url(../img/top/bg_title_pc_1.png) no-repeat top center;
      background-size: contain;
    }

    .inside::after {
      content: '';
      width: 26.55%;
      aspect-ratio: 504 / 747;
      position: absolute;
      top: 0;
      right: 2.6%;
      z-index: 2;
      background: url(../img/top/bg_title_pc_2.png) no-repeat top center;
      background-size: contain;
    }

    h1 {
      width: 34.5%;
      max-width: 660px;
      aspect-ratio: 838 / 868;
      margin-inline: auto;
    }

    #h1_pc {
      display: block;
    }

    #h1_mob {
      display: none;
    }

  }

}

@media screen and (min-width: 1280px) {

  #title .inside::before {
    top: 120px;
  }

  #title .inside::after {
    top: 20px;
  }

}


@media screen and (min-width: 1920px) {

  #title {
    background: url(../img/top/bg_title_4.jpg) no-repeat top center;
    background-size: contain;
  }
}

/*========================
 // id #title_nav
===========================*/

#title_nav {
  width: 90%;
  max-width: 1280px;
  margin-inline: auto;

  ul.local_nav li {
    width: 48.5%;
    height: 70px;
    margin-bottom: 10px;
    background: #f6eada;
  }

  ul.local_nav li a {
    height: 100%;
    display: block;
    color: #5d2a1f;
    text-align: center;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}


@media screen and (min-width: 1000px) {

  #title_nav {

    ul.local_nav li {
      width: 23%;
      font-size: 18px;
      height: 80px;
      position: relative;
    }

  }

}



/*========================
 // class .category_outer
===========================*/
.category_outer .row {
  width: 90%;
  margin: auto auto 15px;
  padding-bottom: 60px;
}

@media print, screen and (max-width: 768px) {
  .category_outer .row {
    width: 95%;
    padding-bottom: 30px;
  }
}

/*========================
 // id #present
===========================*/

#present {


  h5 {
    width: 60%;
    margin-inline: auto;
    margin-bottom: 15px;
  }


  .present_box {
    margin-bottom: 90px;
  }


  .present_box .txt_box .inner_box ul {
    margin-bottom: 30px;
  }

  .txt_box .inner_box li {
    margin-left: 20px;
    margin-bottom: 10px;
    position: relative;
  }

  .txt_box .inner_box li::before {
    content: '\25CF';
    /*くろまる*/
    font-size: 1.25em;
    display: inline-block;
    position: absolute;
    top: -5px;
    left: -20px;
  }




  .present_box.gp .txt_box .inner_box li::before {
    color: #af436c;
  }

  .present_box.yu .txt_box .inner_box li::before {
    color: #524293;
  }

  .present_box.yus .txt_box .inner_box li::before {
    color: #524293;
  }

  .present_box.ep .txt_box .inner_box li::before {
    color: #6381ad;
  }

  .present_box.elc .txt_box .inner_box li::before {
    color: #79acc9;
  }

  .present_box.string .txt_box .inner_box li::before {
    color: #5e1d00;
  }


}

@media screen and (min-width: 1000px) {

  #present {

    .list_container {
      width: 80%;
      margin-inline: auto;
      /* border: #f00 thin solid; */
    }

    .present_box {
      display: flex;
      justify-content: space-between;
      /* border: #f00 thin solid; */
    }

    .present_box.reverse {
      flex-direction: row-reverse;
    }

    .txt_box {
      width: 60%;
      display: flex;
      justify-content: space-between;
      align-items: center;

      /* border: #f00 thin solid; */
    }


    .present_box.reverse .txt_box {
      flex-direction: row-reverse;
    }

    .txt_box h5 {
      width: 28%;
      max-width: 228px;
      margin-right: 30px;
      margin-bottom: 0;
      /* border: #f00 thin solid; */
    }


    .txt_box h5 img {
      width: 100%;
    }

    .txt_box .inner_box {
      /* width: 70%; */
      width: 65%;
      font-size: 16px;
      /* padding-top: 30px; */
      /* border: #f00 thin solid; */
    }

    .present_box.reverse .txt_box h5 {
      margin-right: 0;
    }

    .txt_box .inner_box li {
      margin-left: 0;
    }

    .present_box.reverse .txt_box .inner_box {
      margin-left: 30px;
    }





    figure {
      width: 38%;
      max-width: 514px;
    }

  }

}

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

  #access {

    iframe {
      aspect-ratio: 3 / 4;
    }

  }

}