@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
/* -----------------------------------------------
common
----------------------------------------------- */
main :is(h1,h2,h3,h4,h5,h6,p) {
  margin-top: 0;
  margin-bottom: 0;
}
main :is(picture, img) {
  width: 100%;
}

@media screen and (max-width: 750px) {
  .inner_wrap:not(.slider_product_category) .product_category {
    padding: 112px 0 6px;
  }
}

@media screen and (min-width: 751px) {
  main {
    max-width: 1340px;
    margin-inline: auto;
  }
  .inner_wrap:not(.slider_product_category) .product_category {
    padding: 217px 0 10px;
  }
}

/* -----------------------------------------------
content_wrap
----------------------------------------------- */
.content_wrap .bonbon_heading h2 {
  text-align: center;
  font-weight: normal;
}
.content_wrap .bonbon_heading span {
  display: block;
  font-weight: normal;
}
.content_wrap .bonbon_heading strong {
  display: block;
  font-weight: normal;
}
.content_wrap .fx_wrap {
  display: grid;
}
.content_wrap .fx_item .img {
  margin-inline: auto;
}
.content_wrap .fx_item dt h3 {
  color: #5C6A6C;
  text-align: center;
}
.content_wrap .fx_item dt span {
  display: block;
  font-weight: normal;
}
.content_wrap .fx_item dt strong {
  display: block;
  font-weight: normal;
}
.content_wrap .fx_item dd.bonbon_tag ul {
  display: grid;
}
.content_wrap .fx_item dd.bonbon_tag li {
  border: 1px solid #A2BDD2;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.content_wrap .fx_item dd.bonbon_tag li.alcohol {
  background-color: #A2BDD2;
}
.content_wrap .fx_item dd.bonbon_tag li span {
  color: #A2BDD2;
}
.content_wrap .fx_item dd.bonbon_tag li.alcohol span {
  color: #fff;
}

@media screen and (max-width: 750px) {
  .mv_wrap + .content_wrap {
    margin-top: 52px;
  }
  .content_wrap + .content_wrap {
    margin-top: 111px;
  }
  .content_wrap .bonbon_heading span {
    font-size: 25px;
    line-height: 1.5;
    letter-spacing: 0;
  }
  .content_wrap .bonbon_heading strong {
    font-size: 17px;
    line-height: 1.5;
    letter-spacing: 0.1em;
    margin-top: 4px;
  }
  .content_wrap .bonbon_heading p {
    font-size: 14px;
    line-height: 1.96;
    letter-spacing: 0;
    margin: 27px auto 0;
    width: 68.11%;
  }
  .content_wrap .fx_wrap {
    width: 97.39%;
    margin: 35px auto 0;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px 1.59%;
  }
  .content_wrap .fx_item {
    padding: 20px 10px 18px;
  }
  .content_wrap .fx_item:nth-child(4n),
  .content_wrap .fx_item:nth-child(4n + 1) {
    background-color: #F7F7F7;
  }
  .content_wrap .fx_item .img {
    width: 68.7%;
  }
  .content_wrap .fx_item .text {
    margin: 15px auto 0;
    width: 82.25%;
  }
  .content_wrap .fx_item dt span {
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: 0;
  }
  .content_wrap .fx_item dt strong {
    font-size: 9px;
    line-height: 1.5;
    letter-spacing: 0.15em;
    margin-top: -2px;
  }
  .content_wrap .fx_item dd.description {
    font-size: 11px;
    line-height: 1.54;
    letter-spacing: 0;
    margin-top: 10px;
  }
  .content_wrap .fx_item dd.bonbon_tag {
    margin-top: 11px;
  }
  .content_wrap .fx_item dd.bonbon_tag ul {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 16px);
    gap: 4px 4px;
    width: 88%;
    margin-inline: auto;
  }
  .content_wrap .fx_item dd.bonbon_tag li {
    border-radius: 2px;
  }
  .content_wrap .fx_item dd.bonbon_tag li span {
    font-size: min(2.66vw, 10px);
    line-height: 1;
    letter-spacing: 0;
  }
}

@media screen and (max-width: 374px) {
  .content_wrap .fx_item dd.bonbon_tag ul {
    width: 100%;
  }
}

@media screen and (min-width: 751px) {
  .mv_wrap + .content_wrap {
    margin-top: 115px;
  }
  .content_wrap + .content_wrap {
    margin-top: 191px;
  }
  .content_wrap .bonbon_heading span {
    font-size: 40px;
    line-height: 1.5;
    letter-spacing: 0;
  }
  .content_wrap .bonbon_heading strong {
    font-size: 27px;
    line-height: 1.5;
    letter-spacing: 0.1em;
    margin-top: 6px;
  }
  .content_wrap .bonbon_heading p {
    font-size: 15px;
    line-height: 2.33;
    letter-spacing: 0;
    margin: 53px auto 0;
    max-width: 478px;
  }
  .content_wrap .fx_wrap {
    max-width: 945px;
    margin: 78px auto 0;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px 0.58%;
  }
  .content_wrap .fx_item {
    padding: 20px 10px 37px;
  }
  .content_wrap .fx_item:nth-child(even) {
    background-color: #F7F7F7;
  }
  .content_wrap .fx_item .img {
    width: 66.89%;
  }
  .content_wrap .fx_item .text {
    margin: 18px auto 0;
    max-width: 230px;
  }
  .content_wrap .fx_item dt span {
    font-size: 19px;
    line-height: 1.5;
    letter-spacing: 0;
  }
  .content_wrap .fx_item dt strong {
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.15em;
    margin-top: -4px;
  }
  .content_wrap .fx_item dd.description {
    font-size: 14px;
    line-height: 1.57;
    letter-spacing: 0;
    margin-top: 20px;
  }
  .content_wrap .fx_item dd.bonbon_tag {
    margin-top: 14px;
  }
  .content_wrap .fx_item dd.bonbon_tag ul {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 22px);
    gap: 6px 6px;
  }
  .content_wrap .fx_item dd.bonbon_tag li {
    border-radius: 3px;
  }
  .content_wrap .fx_item dd.bonbon_tag li span {
    font-size: min(1.37vw, 13px);
    line-height: 1;
    letter-spacing: 0;
  }
}
