@charset "UTF-8";
/*ユーティリティ*/
.u__caption {
  display: block;
  font-size: 70%;
  line-height: 1.2;
  margin-top: 0.9em;
}

.u__point {
  background: #f2f2f2;
  padding: 1.5em;
  margin-top: 1.5em;
  position: relative;
}
.u__point::before {
  content: "POINT";
  position: absolute;
  top: -0.9em;
  left: 1.2em;
  font-weight: bold;
  font-family: Arial, Helvetica, "sans-serif";
}

.u__anker {
  margin-top: -70px !important;
  padding-top: 70px !important;
  position: absolute;
  z-index: -1;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .u__anker {
    margin-top: -200px !important;
    padding-top: 200px !important;
  }
}

hr.u__anker {
  border: 0 !important;
}

.u__fs-s {
  font-size: 70% !important;
}

.u__fs-l {
  font-size: 120% !important;
}

.u__color-w {
  color: #fff;
}
.u__color-black {
  color: #484848;
}
.u__color-honey {
  color: #84B250;
}

.u__hidden-sp, .u__display_pc {
  display: block;
}
@media screen and (max-width: 767px) {
  .u__hidden-sp, .u__display_pc {
    display: none;
  }
}

.u__hidden-pc, .u__display_sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .u__hidden-pc, .u__display_sp {
    display: block;
  }
}

.u__center {
  text-align: center !important;
}

.u__left {
  text-align: left !important;
}
.u__left * {
  text-align: left !important;
}

.u__right {
  text-align: right !important;
}

.u__flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 0 -0.5%;
}
.u__flex__a-center, .u__flex.a__center {
  align-items: center;
}
.u__flex.j__center,
.u__flex .j__center {
  justify-content: center;
}
.u__flex__col-1,
.u__flex .col-1 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-1,
  .u__flex .col-1 {
    width: 7.3333333333% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-1,
  .u__flex .col__sp-1 {
    width: 7.3333333333% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-1,
.u__flex .gutter-1 {
  margin-right: 7.3333333333% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-2,
.u__flex .col-2 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-2,
  .u__flex .col-2 {
    width: 15.6666666667% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-2,
  .u__flex .col__sp-2 {
    width: 15.6666666667% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-2,
.u__flex .gutter-2 {
  margin-right: 15.6666666667% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-3,
.u__flex .col-3 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-3,
  .u__flex .col-3 {
    width: 24% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-3,
  .u__flex .col__sp-3 {
    width: 24% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-3,
.u__flex .gutter-3 {
  margin-right: 24% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-4,
.u__flex .col-4 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-4,
  .u__flex .col-4 {
    width: 32.3333333333% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-4,
  .u__flex .col__sp-4 {
    width: 32.3333333333% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-4,
.u__flex .gutter-4 {
  margin-right: 32.3333333333% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-5,
.u__flex .col-5 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-5,
  .u__flex .col-5 {
    width: 40.6666666667% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-5,
  .u__flex .col__sp-5 {
    width: 40.6666666667% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-5,
.u__flex .gutter-5 {
  margin-right: 40.6666666667% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-6,
.u__flex .col-6 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-6,
  .u__flex .col-6 {
    width: 49% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-6,
  .u__flex .col__sp-6 {
    width: 49% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-6,
.u__flex .gutter-6 {
  margin-right: 49% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-7,
.u__flex .col-7 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-7,
  .u__flex .col-7 {
    width: 57.3333333333% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-7,
  .u__flex .col__sp-7 {
    width: 57.3333333333% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-7,
.u__flex .gutter-7 {
  margin-right: 57.3333333333% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-8,
.u__flex .col-8 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-8,
  .u__flex .col-8 {
    width: 65.6666666667% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-8,
  .u__flex .col__sp-8 {
    width: 65.6666666667% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-8,
.u__flex .gutter-8 {
  margin-right: 65.6666666667% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-9,
.u__flex .col-9 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-9,
  .u__flex .col-9 {
    width: 74% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-9,
  .u__flex .col__sp-9 {
    width: 74% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-9,
.u__flex .gutter-9 {
  margin-right: 74% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-10,
.u__flex .col-10 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-10,
  .u__flex .col-10 {
    width: 82.3333333333% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-10,
  .u__flex .col__sp-10 {
    width: 82.3333333333% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-10,
.u__flex .gutter-10 {
  margin-right: 82.3333333333% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-11,
.u__flex .col-11 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-11,
  .u__flex .col-11 {
    width: 90.6666666667% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-11,
  .u__flex .col__sp-11 {
    width: 90.6666666667% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-11,
.u__flex .gutter-11 {
  margin-right: 90.6666666667% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-12,
.u__flex .col-12 {
  width: 99%;
  margin: 0 auto;
  margin-bottom: 15px;
  padding: 0 !important;
}
@media screen and (min-width: 1025px) {
  .u__flex__col-12,
  .u__flex .col-12 {
    width: 99% !important;
    margin: 0 0.5%;
    max-width: none !important;
    flex: none;
  }
}
@media screen and (max-width: 767px) {
  .u__flex__col__sp-12,
  .u__flex .col__sp-12 {
    width: 99% !important;
    max-width: none !important;
    flex: auto;
    margin: 0 0.5%;
  }
}
.u__flex__gutter-12,
.u__flex .gutter-12 {
  margin-right: 99% !important;
}
@media screen and (max-width: 767px) {
  .u__flex .gutter-sp-0 {
    margin-right: auto !important;
  }
}
.u__flex__col-12 {
  margin-bottom: 1% !important;
}

.u__fs-s {
  font-size: 90%;
  line-height: 130%;
}
.u__fs-l {
  font-size: 120%;
  line-height: 170%;
}
.u__mb-1 {
  margin-bottom: 10px !important;
}
.u__mt-1 {
  margin-top: 10px !important;
}
.u__pb-1 {
  padding-bottom: 10px !important;
}
.u__pt-1 {
  padding-top: 10px !important;
}
.u__pr-1 {
  padding-right: 10px !important;
}
.u__mb-2 {
  margin-bottom: 20px !important;
}
.u__mt-2 {
  margin-top: 20px !important;
}
.u__pb-2 {
  padding-bottom: 20px !important;
}
.u__pt-2 {
  padding-top: 20px !important;
}
.u__pr-2 {
  padding-right: 20px !important;
}
.u__mb-3 {
  margin-bottom: 30px !important;
}
.u__mt-3 {
  margin-top: 30px !important;
}
.u__pb-3 {
  padding-bottom: 30px !important;
}
.u__pt-3 {
  padding-top: 30px !important;
}
.u__pr-3 {
  padding-right: 30px !important;
}
.u__mb-4 {
  margin-bottom: 40px !important;
}
.u__mt-4 {
  margin-top: 40px !important;
}
.u__pb-4 {
  padding-bottom: 40px !important;
}
.u__pt-4 {
  padding-top: 40px !important;
}
.u__pr-4 {
  padding-right: 40px !important;
}
.u__mb-5 {
  margin-bottom: 50px !important;
}
.u__mt-5 {
  margin-top: 50px !important;
}
.u__pb-5 {
  padding-bottom: 50px !important;
}
.u__pt-5 {
  padding-top: 50px !important;
}
.u__pr-5 {
  padding-right: 50px !important;
}
.u__mb-6 {
  margin-bottom: 60px !important;
}
.u__mt-6 {
  margin-top: 60px !important;
}
.u__pb-6 {
  padding-bottom: 60px !important;
}
.u__pt-6 {
  padding-top: 60px !important;
}
.u__pr-6 {
  padding-right: 60px !important;
}
.u__mb-7 {
  margin-bottom: 70px !important;
}
.u__mt-7 {
  margin-top: 70px !important;
}
.u__pb-7 {
  padding-bottom: 70px !important;
}
.u__pt-7 {
  padding-top: 70px !important;
}
.u__pr-7 {
  padding-right: 70px !important;
}
.u__mb-8 {
  margin-bottom: 80px !important;
}
.u__mt-8 {
  margin-top: 80px !important;
}
.u__pb-8 {
  padding-bottom: 80px !important;
}
.u__pt-8 {
  padding-top: 80px !important;
}
.u__pr-8 {
  padding-right: 80px !important;
}
.u__mb-9 {
  margin-bottom: 90px !important;
}
.u__mt-9 {
  margin-top: 90px !important;
}
.u__pb-9 {
  padding-bottom: 90px !important;
}
.u__pt-9 {
  padding-top: 90px !important;
}
.u__pr-9 {
  padding-right: 90px !important;
}
.u__mb-10 {
  margin-bottom: 100px !important;
}
.u__mt-10 {
  margin-top: 100px !important;
}
.u__pb-10 {
  padding-bottom: 100px !important;
}
.u__pt-10 {
  padding-top: 100px !important;
}
.u__pr-10 {
  padding-right: 100px !important;
}

#container {
  width: 100% !important;
  max-width: 100% !important;
  margin: auto !important;
}
#container h1.h2A.mt30 {
  display: none !important;
}

#gift-cat img {
  width: 100%;
}
#gift-cat .inner {
  max-width: 100%;
  margin: auto;
}
@media screen and (min-width: 768px) {
  #gift-cat .inner {
    max-width: 960px;
  }
}
#gift-cat .fv {
  /*position: absolute;
  //margin-left: -15px;
  left: 0;*/
  /*@include mq(tab)
  {
      margin-left: 0;
      top: 40px;
  }*/
  max-width: 1200px;
  margin: auto;
  margin-bottom: 3em;
  margin-top: 1em;
}
#gift-cat .fv .image {
  background: url(../img/cat/gift/fv.jpg);
  background-size: cover;
  background-position: 40% 0%;
  text-align: center;
  position: relative;
  width: 100%;
  height: 200px;
  border-radius: 10px;
}
@media screen and (min-width: 768px) {
  #gift-cat .fv .image {
    height: 300px;
    border-radius: 20px;
    background-position: right;
  }
}
#gift-cat .fv__title {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
  width: 100%;
}
#gift-cat .fv h1 {
  line-height: 1.2;
  font-size: 24px;
  padding-left: 5%;
  margin-bottom: 2%;
}
@media screen and (min-width: 768px) {
  #gift-cat .fv h1 {
    font-size: 48px;
  }
}
#gift-cat {
  /* .fv_blank 
   {
       height:30vh ;
       margin-bottom: 60px;
       @include mq(tab) {            
       height:50vh;
       margin-top: 40px;
       } 
   }*/
}
#gift-cat .read h2 {
  font-size: 28px;
  color: #eaa654;
  margin-bottom: 3%;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  #gift-cat .read h2 {
    font-size: 35px;
  }
}
#gift-cat .read p {
  line-height: 2;
  font-size: 16px;
}
#gift-cat .section01 .image {
  width: 100%;
  height: 100%;
  background: url(../img/cat/gift/img01.jpg);
  background-size: cover;
  background-position: center;
  display: block;
  padding-bottom: 70%;
  border-radius: 10px;
}
#gift-cat .section02-fv {
  background: url(../img/cat/gift/img02.jpg);
  background-size: cover;
  background-position: center;
  text-align: center;
  width: 100%;
  padding-bottom: 40%;
  margin-bottom: 5%;
  border-radius: 20px;
  position: relative;
}
@media screen and (max-width: 767px) {
  #gift-cat .section02-fv {
    padding-bottom: 100%;
  }
}
#gift-cat .section03 .point {
  margin-top: 30px;
}
#gift-cat .section03 .point dt {
  color: #eaa654;
  font-size: 22px;
  text-align: center;
  margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
  #gift-cat .section03 .point dt {
    font-size: 15px;
  }
}
#gift-cat .section03 .point dt img {
  margin-bottom: 15px;
  width: 90%;
  display: block;
}
#gift-cat .section03 .point dd {
  text-align: center;
  line-height: 160%;
}
@media screen and (max-width: 767px) {
  #gift-cat .section03 .point dd {
    font-size: 12px;
  }
}
#gift-cat .section04 .option h3 {
  color: #eaa654;
  font-size: 24px;
  margin-bottom: 15px;
}
@media screen and (max-width: 767px) {
  #gift-cat .section04 .option h3 {
    font-size: 18px;
  }
}
#gift-cat .section04 .option span {
  font-size: 90%;
  display: block;
}
#gift-cat .section04 .option + .option {
  margin-top: 20px;
}/*# sourceMappingURL=gift_cat.css.map */