html {
  font-size: calc((100 / 1600) * 1vw);
  font-family: 'Noto Sans JP', 'Noto Serif JP', sans-serif;
}

html, body {
  width: 100%;
  overflow-x: hidden;
}

@media screen and (min-width: 1600px) {
  html {
    font-size: 1px;
  }
}

section {
  position: relative;
}

.l-container {
  max-width: 1600px;
  margin: 0 auto;
}
img {
  width: 100%;
}
.bg {
  width: 100%;
}
.flex-column {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.center {
  justify-content: center;
  align-items: center;
}
.cta:hover {
  transform: scale(1.02);
  filter: brightness(1.2);
}

.pc {
  display: block;
}
.sp {
  display: none;
}

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

.pc {
  .product_list_wrap {
    width: 1200rem;
  }
  .content {
    font-size: 16rem;
    line-height: 32rem;
    margin-top: 34rem;
  }
  mark {
    font-size: 18rem;
    padding: 2rem 10rem;
    background: #ffd800;
  }
  .a1 {
    position: relative;
    margin-bottom: 70rem;

    img {
      width: 1200rem;
    }
    .text-wrap {
      position: absolute;
      top: 0;
      width: 606rem;
    }
    .title {
      font-family: 'Kiwi Maru';
      font-size: 40rem;
      line-height: 18rem;
      text-align: center;
      margin-top: 40rem;
      font-weight: 400;
      color: #512e00;
    }
    .content {
      margin-top: 100rem;
    }
  }
  .a2 {
    margin-bottom: 60rem;

    img {
      width: 1200rem;
    }
    .text-wrap {
      width: 1000rem;
      margin: 0 auto 34rem;
    }
    .title {
      font-family: 'Kiwi Maru';
      font-size: 26rem;
      line-height: 18rem;
      font-weight: 400;
      color: #512e00;
      width: 555rem;
      margin: auto;
      background: #f8e08d;
      height: 58rem;
      align-items: center;
      justify-content: center;
      display: flex;
      border-radius: 36rem;
    }
  }
  .a3 {
    position: relative;
    z-index: 1;

    img {
      width: 1600rem;
    }
    .text-wrap {
      width: 1000rem;
      position: absolute;
      margin: auto;
      left: 0;
      right: 0;
    }
    .content {
      margin: 0;
    }
  }
  .a4 {
    display: flex;
    width: 1200rem;
    justify-content: space-between;

    .image {
      width: 590rem;
    }
    .a4_content {
      width: 580rem;
    }
    .title-wrap {
      font-family: 'Kiwi Maru';
      border: 2rem solid #512e00;
      border-right: none;
      border-left: none;
      height: 112rem;
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
    }
    .title_1 {
      font-size: 22rem;
      width: 250rem;
      height: 50rem;
      color: white;
      background: #512e00;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 32rem;
      position: absolute;
      top: -28rem;
    }
    .title_2 {
      font-size: 40rem;
      line-height: 18rem;
      color: #512e00;
      font-weight: 400;
    }
    .title_3 {
      width: 404rem;
      height: 66rem;
      font-size: 26rem;
      background: #f8e08d;
      border-radius: 32rem;
      color: #512e00;
      font-weight: 400;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 60rem auto 30rem;
    }
    .s-content {
      font-size: 16rem;
      display: flex;
      gap: 16rem;
      align-items: center;
      line-height: 32rem;
      border-bottom: 4rem dotted #cecece;
      padding-bottom: 20rem;
      margin-bottom: 14rem;
    }
    .s-title {
      width: 120rem;
      background-color: #fded9d;
      padding: 30rem 1rem;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 4rem;
      line-height: 20rem;
    }
    .s-content-value {
      width: 420rem;
    }
  }
  .a5 {
    padding-top: 20rem;
    margin-bottom: 40rem;

    .title_1 {
      font-family: 'Kiwi Maru';
      font-size: 40rem;
      color: #512e00;
      border: 2rem solid #512e00;
      border-left: none;
      border-right: none;
      width: 720rem;
      padding: 32rem 0;
      text-align: center;
      font-weight: 400;
      margin: auto;
    }
    .title_2 {
      font-size: 26rem;
      color: #512e00;
      width: 520rem;
      padding: 20rem 0;
      text-align: center;
      font-weight: 400;
      margin: 40rem auto 0;
      border-radius: 32rem;
      background: #f8e08d;
    }
    .text-wrap {
      width: 1000rem;
      margin: auto;
    }
  }
  .a6 {
    display: flex;
    gap: 46rem;
    border-top: 3rem solid #c9b191;
    padding-top: 30rem;
    margin-bottom: 30rem;

    .title {
      font-size: 26rem;
      color: #512e00;
      background: white;
      width: 365rem;
      height: 105rem;
      display: flex;
      justify-content: center;
      align-items: center;
      text-align: center;
      margin: auto;
      border-radius: 100rem;
    }
    .a6_content {
      width: 450rem;
      height: 470rem;
      background-color: #f8e08d;
      padding: 50rem 37rem 0;
    }
  }
  .a7 {
    .title-wrap {
      font-family: 'Kiwi Maru';
      border: 2rem solid #512e00;
      border-right: none;
      border-left: none;
      height: 140rem;
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
      margin: auto;
      width: 760rem;
      font-weight: 400;
      margin-bottom: 48rem;
    }
    .title_1 {
      font-size: 22rem;
      width: 360rem;
      height: 50rem;
      color: white;
      background: #512e00;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 32rem;
      position: absolute;
      top: -28rem;
    }
    .title_2 {
      font-size: 40rem;
      line-height: 18rem;
      color: #512e00;
    }
    .content-wrap {
      display: flex;
      width: 1200rem;
      justify-content: space-between;
    }
    .content {
      width: 784rem;
      margin: 0;
    }
  }
  .s4 {
    padding: 90rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;

    .title-wrap {
      font-family: 'Kiwi Maru';
      border: 2rem solid #512e00;
      border-right: none;
      border-left: none;
      height: 140rem;
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
      margin: auto;
      width: 760rem;
      font-weight: 400;
      margin-bottom: 48rem;
    }
    .title_1 {
      font-size: 22rem;
      width: 360rem;
      height: 50rem;
      color: white;
      background: #512e00;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 32rem;
      position: absolute;
      top: -28rem;
    }
    .title_2 {
      font-size: 40rem;
      line-height: 18rem;
      font-weight: 400;
      color: #512e00;
    }
    .title_3,
    .title_4 {
      font-size: 28rem;
      color: white;
      width: 220rem;
      display: flex;
      justify-content: center;
      align-items: center;
      background: #d96161;
      height: 95rem;
      border-top-left-radius: 16rem;
      border-bottom-left-radius: 16rem;
    }
    .title_4 {
      background-color: #ecb50f;
    }
    .content-wrap {
      background: #f0f0f0;
      display: flex;
      align-items: center;
      width: 1200rem;
      margin: auto;
      border-radius: 16rem;
      gap: 40rem;
      margin-bottom: 20rem;
    }
    .content {
      margin: 0;
    }
  }

  .img_5 {
    width: 1218rem;
  }
  .img_6 {
    width: 700rem;
  }
  .img_8,
  .img_9,
  .img_10 {
    width: 1200rem;
    margin: auto;
    margin-bottom: 40rem;
  }
  .img_11 {
    width: 370rem;
    height: 190rem;
  }
  .cta {
    width: 327rem;
  }
  .s1 {
    padding-top: 90rem;
    background: url(../img/pc/bg_1.png);
  }
  .s2 {
    margin-bottom: 90rem;
  }
  .s3 {
    background: url(../img/pc/bg_3.png);
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
  }
  .btn-hover .hover {
    display: none;
  }
  .btn-hover:hover .default {
    display: none;
  }
  .btn-hover:hover .hover {
    display: block;
  }
  .s_product {
    background: #f5efeb;
    width: 100%;
    background-size: contain;
    padding: 40rem;
  }
  .a8 {
    border: 1rem solid #f6ba44;
    border-radius: 24rem;
    margin-top: 50rem;
    display: flex;
  }
  .a8_btn:hover img {
    background: #fff9db;
  }
  .a8_btn img {
    width: 240rem;
    background: white;
    border: 1rem solid #f6ba44;
  }
  .a8_btn_first img {
    border-top-left-radius: 24rem;
    border-bottom-left-radius: 24rem;
  }
  .a8_btn_last img {
    border-top-right-radius: 24rem;
    border-bottom-right-radius: 24rem;
  }
  .product_list {
    margin-top: 50rem;
    gap: calc(1600 / 1920 * 96rem);
  }
  .a9 {
    background-image: url(../img/pc/product/9.png);
    width: calc(1600 / 1920 * 1440rem);
    height: calc(1600 / 1920 * 300rem);
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
  }
  .a9_text_3 {
    font-size: 15rem;
  }
  .a10 {
    background-image: url(../img/pc/product/10.png);
    width: calc(1600 / 1920 * 1440rem);
    height: calc(1600 / 1920 * 268rem);
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
  }
  .a11,
  .a12,
  .a13 {
    background-image: url(../img/pc/product/11.png);
    width: calc(1600 / 1920 * 1440rem);
    height: calc(1600 / 1920 * 170rem);
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
  }
  .a12 {
    height: calc(1600 / 1920 * 130rem);
  }
  .a13 {
    height: calc(1600 / 1920 * 78rem);
  }
  .product_list_title {
    position: absolute;
    font-size: calc(1600 / 1920 * 22rem);
    top: calc(1600 / 1920 * 40rem);
    left: calc(1600 / 1920 * 30rem);
    font-weight: 400;
    line-height: calc(1600 / 1920 * 50rem);
  }
  .product_list_title_text {
    position: absolute;
    font-size: calc(1600 / 1920 * 18rem);
    top: calc(1600 / 1920 * 110rem);
    left: 0;
    width: calc(1600 / 1920 * 1030rem);
    line-height: calc(1600 / 1920 * 40rem);
    margin-top: calc(1600 / 1920 * 8rem);
  }
  .a11 .product_list_title,
  .a12 .product_list_title,
  .a13 .product_list_title {
    top: 14rem;
  }
  .a11 .product_list_title_text,
  .a12 .product_list_title_text,
  .a13 .product_list_title_text {
    top: 90rem;
    width: 100%;
  }
  .product {
    font-size: calc(1600 / 1920 * 18rem);
    line-height: calc(1600 / 1920 * 40rem);
  }
  .product_text {
    align-self: start;
    margin-top: 8rem;
    margin-bottom: calc(1600 / 1920 * 16rem);
    width: calc(1600 / 1920 * 313rem);
  }
  .product_text_height {
    height: 80rem;
  }
  .product_wrap {
    display: flex;
    gap: calc(1600 / 1920 * 72rem) calc(1600 / 1920 * 38rem);
    margin-top: calc(1600 / 1920 * 54rem);
    flex-wrap: wrap;
    width: calc(1600 / 1920 * 1440rem);
  }
  .product_img {
    width: calc(1600 / 1920 * 331rem);
  }
  .product_btn img {
    width: calc(1600 / 1920 * 290rem);
  }
  .product_btn .hover {
    display: none;
  }
  .product_btn:hover .default {
    display: none;
  }
  .product_btn:hover .hover {
    display: block;
  }
  .product_note {
    margin-top: 36rem;
    font-size: 18rem;
    line-height: 40rem;
  }
  .s_info_img img {
    width: calc(1600 / 1920 * 461rem);
  }
  .a14_label {
    font-size: calc(1600 / 1920 * 18rem);
    width: calc(1600 / 1920 * 461rem);
    line-height: calc(1600 / 1920 * 25rem);
    color: black;
  }
  .s_info {
    display: flex;
    background: #e4d7cf;
    justify-content: center;
    padding: calc(1600 / 1920 * 74rem) 0;
  }
  .s_info_wrap {
    gap: 24rem;
  }
  .s_info_contain {
    width: 1200rem;
    display: flex;
    flex-wrap: wrap;
    gap: calc(1600 / 1920 * 54rem) calc(1600 / 1920 * 28rem);
  }

  .footer {
    display: block;
  }
  .globalFooter__external-link {
    max-width: 930rem;
    margin: 0 auto;
    padding: 60rem 0 30rem;
  }
  .globalFooter__external-link li {
    width: 33%;
    margin-bottom: 50rem;
    text-align: center;
  }
  .globalFooter__external-link li img {
    width: 80%;
  }
  .globalFooter__external-link a {
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }
  .globalFooter__external-link a:hover {
    opacity: 0.7;
  }
  .globalFooter__external-link ul {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .copyright {
    padding: 40rem;
    background-color: #1d1aa0;
    color: #fff;
    display: block;
    text-align: center;
    font-size: 26rem;
  }
  .fix {
    position: fixed;
    z-index: 100;
    bottom: 0;
    display: flex;
  }
  .fix_btn img {
    width: 192rem;
  }
  .fix_btn {
    position: absolute;
    bottom: 9rem;
    left: 870rem;
  }
  .sns-icon-wrap img {
    width: 100rem;
  }
  .sns-icon-wrap {
    width: 900rem;
    display: flex;
    flex-direction: column;
    margin: 90rem auto;
    gap: 0;
    text-align: center;
    align-items: center;
  }
  .head {
    font-size: 50rem;
    font-weight: 400;
    margin-bottom: 60rem;
  }
  .sns-icon-list {
    display: flex;
    font-size: 30rem;
  }
  .logo {
    width: 200rem;
    gap: 30rem;
  }
  .logo-insta {
    position: relative;
  }
  .logo-insta:after {
    content: '';
    height: 100rem;
    width: 2rem;

    position: absolute;
    right: 0;
    top: 0;
    background-color: #b6b6b6;
  }
  .logo-insta:before {
    content: '';
    height: 100rem;
    width: 2rem;

    position: absolute;
    left: 0;
    top: 0;
    background-color: #b6b6b6;
  }

  .qa {
    padding: 188rem 0 85rem;
    margin: -100rem 0 170rem;

      &::before {
        height: 131rem;
        bottom: -80rem;
      }

    h2 {
      margin: 0 auto 50rem;
      max-width: 700rem;
    }

    .qa-heading {
      font-size: 18rem;
      padding: 30rem 70rem 30rem 80rem;

      &::before {
        font-size: 34rem;
        top: 16rem;
        left: 30rem;
      }
    }

    .qa-content {
      padding: 23rem 50rem 37rem;
      font-size: 15rem;
      line-height: calc(27 / 15);
    }

    .content-text {
      p {
        margin-bottom: 20rem;
      }
    }

    .qa-list {
      max-width: 1000rem;
      margin: 0 auto;
    }

    .qa-item {
      margin-bottom: 10rem;
      border-radius: 8rem;
      overflow: hidden;
    }

    .qa-icon {
      right: 52rem;

      &::before,
      &::after {
        width: 30rem;
        height: 3rem;
      }
    }

    .content-product {
      margin-top: 30rem;

      span {
        font-size: 15rem;
        margin-bottom: 10rem;
      }
    }

    .product-link {
      max-width: 222rem;
    }

    .content-info {
      margin-bottom: 32rem;
    }

    .content-list {
      margin-bottom: 20rem;
    }

    .text-label {
      margin-bottom: 8rem;

      span {
        padding: 1rem 10rem 2rem;
      }
    }

    .content-post {
      border-radius: 8rem;
      padding: 20rem 30rem;
      margin-top: 20rem;

      a::before {
        width: 15rem;
        height: 15rem;
        top: 6rem;
      }
    }

    .post-article {
      margin-bottom: 5rem;
    }
  }
}
.product_list_title {
  position: absolute;
  font-size: calc(1600 / 1920 * 22rem);
  top: calc(1600 / 1920 * 40rem);
  left: calc(1600 / 1920 * 30rem);
  font-weight: 400;
  line-height: calc(1600 / 1920 * 50rem);
}
.product_list_title_text {
  position: absolute;
  font-size: calc(1600 / 1920 * 18rem);
  top: calc(1600 / 1920 * 110rem);
  left: 0;
  width: calc(1600 / 1920 * 1030rem);
  line-height: calc(1600 / 1920 * 40rem);
  margin-top: calc(1600 / 1920 * 8rem);
}

.a15_label {
  padding-top: 10px;
  font-size: 18rem;
  width: 339rem;
  line-height: 25rem;
  color: #db9211;
}
.s5_img img {
  width: 339rem;
}
.s5 {
  display: flex;
  background: #fdfdfd;
  justify-content: center;
  padding: 74rem 0;

}
.s5_wrap {
  gap: 24rem;
}
.s5_contain {
  width: 1440rem;
  display: flex;
  flex-wrap: wrap;
  gap: 54rem 28rem;
}

.qa {
  width: 100%;
  background-color: #ffecad;
  letter-spacing: 0.02em;
  position: relative;

  &::before {
    content: '';
    position: absolute;
    right: 0;
    left: 0;
    background: url("../img/pc/qa_bg.png") no-repeat center center /cover;
  }

  .qa-item.is-open .qa-icon::after {
    transform: rotate(0deg);
  }

  .qa-heading {
    display: flex;
    align-items: center;
    background-color: #fff;
    font-weight: 500;
    letter-spacing: 0.02em;
    position: relative;
    cursor: pointer;

    &::before {
      content: 'Q.';
      position: absolute;
      font-family: 'Kiwi Maru';
      color: #e38600;
    }
  }

  .qa-content {
    display: none;
    background-color: #fff7db;
    color: #333;
    letter-spacing: 0.02em;
  }

  .content-text {
    p:last-child {
      margin-bottom: 0;
    }
  }

  .qa-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);

    &::before,
    &::after {
      content: '';
      position: absolute;
      background-color: #e38600;
      transition: transform 0.3s;
    }

    &::after {
      transform: rotate(90deg);
    }
  }

  .content-product {
    span {
      display: block;
      font-weight: 500;
      color: #e38600;
    }
  }

  .product-link {
    display: block;
    width: 100%;

    &:hover {
      transform: scale(1.02);
      filter: brightness(1.2);
    }
  }

  .text-label {
    display: block;

    span {
      background-color: #ffd800;
      font-weight: 500;
    }
  }

  .content-post {
    background-color: #fff;
    border: 1px solid #f8e08d;

    a {
      display: inline-block;
      position: relative;
      padding-left: 20rem;

      &::before {
        content: '';
        position: absolute;
        left: 0;
        background: url("../img/pc/qa_link_icon.png") no-repeat center center /cover;
      }
    }
  }

  .post-article {
    font-weight: 500;
  }

}
.product_list .product_img {
  background: #fff;
}