@charset "UTF-8";
/* ===== cnt01 ===== */
.product-link-list {
  display: grid;
  grid-template-columns: repeat(2, 37.7272727273cqw);
  justify-content: center;
  -moz-column-gap: 4.5454545455cqw;
       column-gap: 4.5454545455cqw;
  row-gap: 4.5454545455cqw;
  margin-block-start: 10px;
}

.product-link {
  position: relative;
  display: grid;
  justify-items: center;
  row-gap: 13px;
  color: var(--color-brown);
  text-decoration: none;
}
@media (any-hover: hover) {
  .product-link:hover {
    opacity: 0.8;
  }
}
.product-link.product-link--wide {
  grid-column: 1/-1;
  width: 52.5757575758cqw;
  justify-self: center;
}

.product-link__image {
  width: 100%;
}
.product-link__image img {
  width: 100%;
}

.product-link--wide .product-link__image {
  width: 37.7272727273cqw;
}

.product-link__text {
  display: block;
  width: 100%;
  padding-block: 8px;
  background-color: var(--color-pink-light);
  border-radius: 10px;
  font-family: var(--font-rounded);
  font-weight: bold;
  line-height: 1.3;
}
.product-link__text::after {
  content: "";
  display: block;
  width: 11px;
  height: 6px;
  margin-block-start: 6px;
  margin-inline: auto;
  background-color: currentColor;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

.product-link__name {
  color: var(--color-pink-deep);
}

.product-link__note {
  font-size: var(--font-size-set12);
  font-weight: normal;
}

.product-link__decoration {
  position: absolute;
}
.product-link__decoration img {
  width: 100%;
}
.product-link__decoration.product-link__decoration--characterBlue {
  inset-block-start: 18.4615384615cqw;
  inset-inline-start: -17.6923076923cqw;
  width: 22.5641025641cqw;
  rotate: 5.13deg;
}
.product-link__decoration.product-link__decoration--characterPink {
  inset-block-start: 17.6923076923cqw;
  inset-inline-start: 48.9743589744cqw;
  width: 18.4615384615cqw;
  rotate: -11.78deg;
}
.product-link__decoration.product-link__decoration--starTopLeft {
  inset-block-start: 7.1794871795cqw;
  inset-inline-start: -14.8717948718cqw;
  width: 3.8461538462cqw;
}
.product-link__decoration.product-link__decoration--starBottomLeft {
  inset-block-start: 33.3333333333cqw;
  inset-inline-start: 1.2820512821cqw;
  width: 3.8461538462cqw;
}
.product-link__decoration.product-link__decoration--starTopRight {
  inset-block-start: 3.8461538462cqw;
  inset-inline-start: 66.9230769231cqw;
  width: 3.8461538462cqw;
}
.product-link__decoration.product-link__decoration--starBottomRight {
  inset-block-start: 31.5384615385cqw;
  inset-inline-start: 51.2820512821cqw;
  width: 3.8461538462cqw;
}

/* ===== cnt03・cnt04 ポイントセクション共通 ===== */
.cnt03,
.cnt04 {
  position: relative;
  isolation: isolate;
  padding-block-end: 22.7272727273cqw;
}
.cnt03::before, .cnt03::after,
.cnt04::before,
.cnt04::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  z-index: -1;
  width: 100%;
  aspect-ratio: 660/147;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto;
}
.cnt03::before,
.cnt04::before {
  inset-block-start: 9.0909090909cqw;
}
.cnt03::after,
.cnt04::after {
  inset-block-end: 9.0909090909cqw;
}
.cnt03 .point-badge,
.cnt04 .point-badge {
  position: relative;
  z-index: 1;
  margin-block-end: -9.0909090909cqw;
}

/* ===== cnt03 保水力 ===== */
.cnt03 {
  margin-block-start: 80px;
}
.cnt03::before, .cnt03::after {
  background-image: url("/sukoyakasuhada/assets/images/index/cnt03-bg-top.png");
}
.cnt03 .cnt03--content {
  padding-block-start: 13.6363636364cqw;
  background-color: var(--color-pink-light);
}
.cnt03 .point-heading {
  --heading-decoration-gap: 16px;
}
.cnt03 .skin-box {
  position: relative;
  width: 88.6363636364cqw;
  max-width: 585px;
  aspect-ratio: 585/369;
  margin-block-start: 40px;
  margin-inline: auto;
}
.cnt03 .skin-box img {
  width: 100%;
}
.cnt03 .skin-img {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  width: 84.1025641026%;
}
.cnt03 .skin-ico {
  position: absolute;
  inset-block-end: 7.3170731707%;
  inset-inline-end: 0;
  z-index: 1;
  width: 34.0170940171%;
}

/* ===== cnt04 やさしさ ===== */
.cnt04 {
  margin-block-start: 40px;
}
.cnt04::before, .cnt04::after {
  background-image: url("/sukoyakasuhada/assets/images/index/cnt04-bg-top.png");
}
.cnt04 .cnt04--content {
  padding-block-start: 13.6363636364cqw;
  background-color: var(--color-yellow-light);
}
.cnt04 .products-image {
  width: 80.4545454545cqw;
  max-width: 531px;
  margin-inline: auto;
}
.cnt04 .products-image img {
  width: 100%;
}

/* ===== cnt05 製品一覧 ===== */
.cnt05 {
  margin-block-start: 40px;
  margin-block-end: 40px;
  margin-inline: var(--gutter-inline);
  background-color: var(--color-white);
  border-radius: 5px;
}
@media screen and (width > 750px) {
  .cnt05 {
    padding-block-end: 60px;
  }
}
@media screen and (width <= 750px) {
  .cnt05 {
    padding-block-end: 30px;
  }
}
.cnt05 .section-title {
  margin-block-end: 20px;
}
.cnt05 .item {
  margin-block-start: 60px;
}
@media (any-hover: hover) {
  .cnt05 .p-product__image a:has(img):hover {
    opacity: 0.8;
  }
}
/*# sourceMappingURL=index.css.map */