@charset "UTF-8";

/* ==========================================================
 top
========================================================== */
/* sec-top
---------------------------------------------------------- */
.sec-top-01 {}
  .sec-top-01 .sec-top-in { position: relative; }
  
.sec-top-02 {
  background: url(/img/bg_top_lineup.png) bottom center #fcfbf8 no-repeat;
  border-bottom: 2px dotted #df1524;
}

.sec-top-03 { padding: 52px 0 5px; }

@media screen and (max-width: 768px) {
.sec-top-02 { background-size: auto 80px; }
.sec-top-03 { padding: 33px 0 112px; }
}

/* box-top-title
---------------------------------------------------------- */
.box-top-title {
  margin-bottom: 20px;
  text-align: center;
}
  .box-top-title .ttl-main {
    margin-bottom: 10px;
    line-height: 1;
  }
  .box-top-title .ttl-sub {
    color: #323232;
    font-weight: bold;
    font-size: 30px;
    line-height: 1.2;
  }

@media screen and (max-width: 768px) {
.box-top-title { margin-bottom: 20px; }
  .box-top-title .ttl-main { margin-bottom: 0; }
  .box-top-title .ttl-sub { font-size: 21px; }
}

/* box-top-category
---------------------------------------------------------- */
.box-top-category {
  min-width: 1052px;
  max-width: 1280px;
  margin: 0 auto;
}
  .box-top-category .list-category {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    border-right: 2px solid #de1020;
  }
    .box-top-category .list-category .item {
      width: 25%;
      border: 2px solid #de1020;
      border-right: none;
    }
    /*.box-top-category .list-category .item:last-child { border-right: 2px solid #de1020; }*/
      .box-top-category .list-category .item a {
        position: relative;
        display: block;
      }
        .box-top-category .list-category .item .figure { position: relative; }
          .box-top-category .list-category .item .figure img { width: 100%; }
          .box-top-category .list-category .item .figure .img-on {
            position: absolute;
            top: 0;
            left: 0;
            display: none;
            width: 100%;
          }
          .box-top-category .list-category .item a:hover .img-on { display: block; }
        .box-top-category .list-category .item .btn-link {
          position: absolute;
          bottom: 16px;
          left: 50%;
          z-index: 2;
          width: 160px;
          opacity: 1 !important;
          -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
        }

@media screen and (max-width: 768px) {
.box-top-category {
  min-width: 0;
  max-width: none;
}
  .box-top-category .list-category {
    border-top: 1px solid #de1020;
    border-bottom: 1px solid #de1020;
    border-right: none;
  }
    .box-top-category .list-category .item,
    .box-top-category .list-category .item:last-child {
      width: 50%;
      border: 1px solid #de1020;
    }
      .box-top-category .list-category .item a:hover .img-on { display: none; }
      .box-top-category .list-category .item .btn-link {
        bottom: 10px;
        width: 94px;
      }
}

/* box-top-lineup
---------------------------------------------------------- */
.box-top-lineup {
  overflow: hidden;
  padding: 53px 0 36px;
  text-align: center;
}
  .box-top-lineup .title-sub { margin-bottom: 20px; }
  .box-top-lineup .box-top-lineup-in {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto 25px;
  }
    .box-top-lineup .list-lineup {
      display: -webkit-flex;
      display: flex;
      -webkit-justify-content: center;
      justify-content: center;
      width: 107.8125%;
      max-width: 1380px;
      -webkit-transform: translateX(-3.90625%);
      transform: translateX(-3.90625%);
    }
      .box-top-lineup .list-lineup .item {
        overflow: hidden;
        width: 9.09090909091%;
        padding: 0 10px;
      }
        .box-top-lineup .list-lineup .item img { width: 100%; }
        .box-top-lineup .list-lineup .slick-arrow {
          overflow: hidden;
          position: absolute;
          top: 50%;
          width: 26px;
          height: 46px;
          margin-top: -20px;
          z-index: 2;
          text-indent: -999px;
          outline: none;
        }
        .box-top-lineup .list-lineup .slick-arrow.slick-prev {
          left: 7px;
          background: url(/img/ico_arrow_prev.png) left center no-repeat;
          background-size: 13px 23px;
        }
        .box-top-lineup .list-lineup .slick-arrow.slick-next {
          right: 7px;
          background: url(/img/ico_arrow_next.png) right center no-repeat;
          background-size: 13px 23px;
        }

@media screen and (max-width: 768px) {
.box-top-lineup { padding: 35px 0 40px; }
  .box-top-lineup .box-top-lineup-in {
    max-width: none;
  }
  .box-top-lineup .list-lineup {
    display: block;
    width: auto;
    max-width: none;
    -webkit-transform: none;
    transform: none;
  }
    .box-top-lineup .list-lineup .item {
      width: auto;
      padding: 0 12px;
      outline: none;
    }
  .box-top-lineup .btn-link {
    width: 165px;
    min-height: 42px;
    border-radius: 21px;
    font-size: 18px;
  }
    .box-top-lineup .btn-link:after {
      right: 12px;
      width: 8px;
      height: 12px;
      background: url(/img/ico_arrow_right_01.png) no-repeat;
      background-size: 8px 12px;
    }
}

/* box-top-special
---------------------------------------------------------- */
.box-top-special {
  width: 1052px;
  margin: 0 auto 65px;
}
  .box-top-special .title-sub { margin-bottom: 22px; }
  .box-top-special .box-top-special-in {
    display: -webkit-flex;
    display: flex;
    width: 980px;
    margin: 0 auto;
    padding: 0 10px;
  }
  .box-top-special .item {
    position: relative;
    overflow: hidden;
    padding: 5px;
    border: 2px solid #e60012;
    border-radius: 10px;
  }
    .box-top-special .item .btn-link {
      position: absolute;
      bottom: 20px;
      left: 50%;
      width: 160px;
      margin-left: -80px;
    }
    .box-top-special .item .btn-link:after { background-size: 7px 10px; }
  .box-top-special .box-tips {
    width: 630px;
  }
  .box-top-special .box-area {
    width: 305px;
    margin-left: 26px;
  }

@media screen and (max-width: 768px) {
.box-top-special {
  width: auto;
  margin: 0 auto;
}
  .box-top-special .title-sub { margin-bottom: 15px; }
  .box-top-special .box-top-special-in {
    display: block;
    width: auto;
  }
    .box-top-special .item {
      padding: 3px;
      border: 2px solid #e60012;
      border-radius: 10px;
    }
      .box-top-special .item .figure img { width: 100%; }
      .box-top-special .item .btn-link {
        bottom: 15px;
        width: 135px;
        margin-left: -67px;
      }
    .box-top-special .box-tips {
      width: 100%;
      margin-bottom: 15px;
    }
    .box-top-special .box-area {
      width: 100%;
      margin-left: 0;
    }
}

/* box-top-social
---------------------------------------------------------- */
.box-top-social {
  position: relative;
  z-index: 5;
  display: -webkit-flex;
  display: flex;
  width: 980px;
  margin: 0 auto;
  padding: 0 10px;
}
  .box-top-social .item {
    position: relative;
    width: 463px;
    min-height: 250px;
    padding: 5px;
    border-radius: 10px;
    background: #f9f7f1;
    line-height: 1;
  }
  .box-top-social .box-tw { border: 2px solid #51abf2; }
    .box-top-social .box-tw:before {
      position: absolute;
      top: -27px;
      left: 50%;
      z-index: 1;
      width: 138px;
      height: 27px;
      background: url(/img/txt_twitter.png) no-repeat;
      background-size: 138px 27px;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
      content: "";
    }
    .box-top-social .box-tw:after {
      position: absolute;
      left: -46px;
      bottom: -14px;
      z-index: 1;
      width: 82px;
      height: 100px;
      background: url(/img/img_char_01.png) no-repeat;
      content: "";
    }
  .box-top-social .box-fb {
    margin-left: 34px;
    border: 2px solid #3b5998;
  }
    .box-top-social .box-fb:before {
      position: absolute;
      top: -26px;
      left: 50%;
      z-index: 1;
      width: 169px;
      height: 26px;
      background: url(/img/txt_facebook.png) no-repeat;
      background-size: 169px 26px;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
      content: "";
    }
    .box-top-social .box-fb:after {
      position: absolute;
      right: -37px;
      bottom: -10px;
      z-index: 1;
      width: 96px;
      height: 107px;
      background: url(/img/img_char_02.png) no-repeat;
      content: "";
    }
@media screen and (max-width: 768px) {
.box-top-social {
  display: block;
  width: auto;
}
  .box-top-social .item {
    width: 100%;
    /*min-height: 270px;*/
    padding: 5px;
    text-align: center;
  }
  .box-top-social .box-tw { margin: 135px 0 0; }
    .box-top-social .box-tw:after {
      top: -110px;
      left: 50%;
      bottom: auto;
      width: 62px;
      height: 76px;
      background: url(/img/img_char_01_sp.png) no-repeat;
      background-size: 62px 76px;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
    }
  .box-top-social .box-fb {
    margin: 138px 0 0;
    border: 2px solid #3b5998;
  }
    .box-top-social .box-fb:after {
      top: -116px;
      left: 50%;
      right: auto;
      bottom: auto;
      width: 72px;
      height: 81px;
      background: url(/img/img_char_02_sp.png) no-repeat;
      background-size: 72px 81px;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
    }
}

/* mod-top-slider
---------------------------------------------------------- */
.mod-top-slider .item {
  position: relative;
  width: 1280px;
  outline: none;
}
  .mod-top-slider .item img { width: 100%; }
  .mod-top-slider .btn-link {
    position: absolute;
    left: 226px;
    bottom: 260px;
    z-index: 1;
    display: block;
    min-width: 282px;
  }
  .mod-top-slider .btn-link.short { min-width: 228px; }
  .mod-top-slider .slick-dots {
    position: absolute;
    left: 0;
    bottom: 190px;
    width: 100%;
    text-align: center;
  }
    .mod-top-slider .slick-dots li {
      display: inline-block;
      margin: 0 5px;
      line-height: 1;
    }
      .mod-top-slider .slick-dots li button {
        overflow: hidden;
        width: 14px;
        height: 18px;
        background: url(/img/ico_pager_no.png) no-repeat;
        text-indent: -999px;
        outline: none;
      }
      .mod-top-slider .slick-dots li button:hover,
      .mod-top-slider .slick-dots li.slick-active button {
        background: url(/img/ico_pager_on.png) no-repeat;
      }

@media screen and (max-width: 768px) {
.mod-top-slider .item { width: 100%; }
  .mod-top-slider .btn-link,
  .mod-top-slider .btn-link.short {
    position: absolute;
    left: 50%;
    bottom: 52px;
    min-width: 276px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .mod-top-slider .slick-dots { bottom: 3px; }
    .mod-top-slider .slick-dots li { margin: 0 4px; }
      .mod-top-slider .slick-dots li button {
        width: 11px;
        height: 14px;
        background: url(/img/ico_pager_no_sp.png) no-repeat;
        background-size: 11px 14px;
      }
      .mod-top-slider .slick-dots li button:hover,
      .mod-top-slider .slick-dots li.slick-active button {
        background: url(/img/ico_pager_on_sp.png) no-repeat;
        background-size: 11px 14px;
      }
}

/* mod-top-news
---------------------------------------------------------- */  
.mod-top-news {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  width: 100%;
  height: 175px;
  background: url(/img/bg_news.png) repeat;
}
  .mod-top-news .mod-top-news-in {
    position: relative;
    width: 980px;
    margin: 0 auto;
    padding: 32px 45px 35px;
    text-align: left;
  }
  .mod-top-news .btn-link {
    position: absolute;
    top: 24px;
    right: 0;
  }
    .mod-top-news .title {
      margin-bottom: 6px;
      padding-left: 22px;
      line-height: 1;
    }
    .mod-top-news .list-top-news { overflow: hidden; }
      .mod-top-news .list-top-news .item {
        display: table;
        width: 100%;
        padding: 1px 0;
        border-bottom: 1px dashed rgba(0,0,0,0.08);
        font-weight: bold;
        vertical-align: middle;
      }
        .mod-top-news .list-top-news .item .date {
          display: table-cell;
          width: 140px;
          padding-left: 22px;
          font-size: 12px;
          letter-spacing: 1px;
        }
        .mod-top-news .list-top-news .item .detail {
          font-size: 14px;
          letter-spacing: 0.5px;
        }

@media screen and (max-width: 768px) {
.mod-top-news {
  position: static;
  width: 100%;
  height: auto;
  background: #faf7f2;
}
  .mod-top-news .mod-top-news-in {
    width: auto;
    padding: 30px 25px;
    text-align: center;
  }
    .mod-top-news .title {
      margin-bottom: 15px;
      padding-left: 0;
    }
    .mod-top-news .btn-link {
      position: relative;
      top: auto;
      right: auto;
      width: 124px;
    }
    .mod-top-news .list-top-news {
      margin-bottom: 15px;
      text-align: left;
    }
      .mod-top-news .list-top-news .item {
        margin-bottom: 12px;
        padding: 0;
        border-bottom: none;
        font-weight: normal;
      }
      .mod-top-news .list-top-news .item:last-child { margin-bottom: 0; }
        .mod-top-news .list-top-news .item .date {
          width: 77px;
          padding-left: 0;
          font-size: 11px;
          letter-spacing: normal;
          vertical-align: middle;
        }
        .mod-top-news .list-top-news .item .detail {
          font-size: 12px;
          line-height: 1.5;
          vertical-align: middle;
        }
}