﻿.page-category-search .mainframe_,
.forcms_block {
  margin: 0 auto;
  max-width: unset !important;
  width: min(100%, 1366px) !important
}

@media(max-width: 640px) {
  .block-breadcrumb-wrap.forcms_block {
    order: unset;
    margin: 35px 20px 30px 20px
  }
}

.cleansing-milk {
  position: relative;
  margin: 0 auto;
  width: min(100%, 1366px);
  font-family: "Zen Kaku Gothic New", sans-serif;
  overflow-x: hidden
}

.cleansing-milk * {
  box-sizing: border-box
}

.cleansing-milk img {
  width: 100%;
  height: auto
}

@media screen and (min-width: 751px) {
  .cleansing-milk .contents--sp {
    display: contents
  }
}

.cleansing-milk .contents--pc {
  display: contents
}

@media screen and (min-width: 751px) {
  .cleansing-milk .contents--pc {
    display: unset
  }
}

.cleansing-milk .for-sp {
  display: unset
}

@media screen and (min-width: 751px) {
  .cleansing-milk .for-sp {
    display: none
  }
}

.cleansing-milk .for-pc {
  display: none
}

@media screen and (min-width: 751px) {
  .cleansing-milk .for-pc {
    display: unset
  }
}

.cleansing-milk .cmn-swiper {
  overflow: visible
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cmn-swiper {
    width: 396px
  }
}

.cleansing-milk .cmn-swiper .swiper-slide {
  opacity: 0;
  transition: .2s;
  cursor: grab
}

.cleansing-milk .cmn-swiper .swiper-slide-active {
  opacity: 1 !important
}

.cleansing-milk .cmn-swiper .swiper-button {
  width: 9.33vw;
  height: 9.33vw;
  border-radius: 50%;
  background: #6c6c6c
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cmn-swiper .swiper-button {
    width: 43px;
    height: 43px
  }
}

.cleansing-milk .cmn-swiper .swiper-button-prev:after,
.cleansing-milk .cmn-swiper .swiper-button-next:after {
  content: "";
  position: absolute;
  inset: 22.5%;
  background: center/contain no-repeat url(../../../../img/usr/pages/cleansing-milk2025/cmn_icn_arrow_white.svg)
}

.cleansing-milk .cmn-swiper .swiper-button-prev {
  transform: scale(-1);
  left: -5.5%
}

.cleansing-milk .cmn-swiper .swiper-button-next {
  right: -5.5%
}

.cleansing-milk .cta {
  padding: 5% 7.4% 4%;
  background: #fff;
  z-index: 5
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8.78%;
    padding: 15px 0
  }
}

.cleansing-milk .cta__txtarea {
  text-align: center
}

.cleansing-milk .cta__txtarea:not(:last-child) {
  margin: 0 0 4%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta__txtarea:not(:last-child) {
    margin: 0 0 4%
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta__txtarea {
    margin: 0;
    text-align: left
  }
}

.cleansing-milk .cta__heading {
  margin: 0 0 .75em;
  letter-spacing: .08em;
  font-size: 4.53vw;
  font-weight: 500;
  color: #575757
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta__heading {
    margin: 0 0 .55em;
    font-size: 24px
  }
}

.cleansing-milk .cta__txt {
  letter-spacing: .08em;
  font-size: 3.2vw;
  color: #575757
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta__txt {
    font-size: 16px;
    white-space: nowrap
  }
}

.cleansing-milk .cta__txt_large {
  font-size: 1.33em
}

.cleansing-milk .cta__txt_tax {
  font-size: .833em
}

.cleansing-milk .cta__link {
  position: relative;
  display: grid;
  place-items: center;
  padding: 1.25em;
  border-radius: 26em;
  letter-spacing: .08em;
  font-size: 4.53vw;
  font-weight: 600;
  color: #fff;
  background: #40B989;
  filter: drop-shadow(0px 0.325em 0 #4C4C4C);
  transition: .2s
}

.cleansing-milk .cta__link:not(:last-child) {
  margin: 0 0 7%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta__link:not(:last-child) {
    margin: 0 0 6%
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta__link {
    padding: 1.5em;
    width: 315px;
    font-size: 20px;
    filter: drop-shadow(0px 0.35em 0 #393514)
  }
}

.cleansing-milk .cta__link::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 3%;
  display: inline-block;
  width: 4.75%;
  aspect-ratio: 1/1;
  transform: translate(-50%, -50%);
  background: center/contain no-repeat url(../../../../img/usr/pages/cleansing-milk2025/cmn_icn_triangle_white.svg);
  transition: .2s
}

.cleansing-milk .cta__link:hover {
  color: #fff;
  background: #464646;
  filter: unset;
  transform: translate(0, 0.325em);
  opacity: 1;
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta__link:hover {
    transform: translate(0, 0.35em)
  }
}

.cleansing-milk .cta__link:hover::before {
  background: center/contain no-repeat url(../../../../img/usr/pages/cleansing-milk2025/cmn_icn_triangle_white.svg);
}

.cleansing-milk .cta__link--moss-green {
  background: #FADE4B;
  color: #41501A
}

.cleansing-milk .cta__link--moss-green::before {
  background: center/contain no-repeat url(../../../../img/usr/pages/cleansing-milk2025/cmn_icn_triangle_black.svg)
}

.cleansing-milk .cta__note {
  display: block;
  line-height: 1.35em;
  letter-spacing: .06em;
  font-size: 3.2vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .cta__note {
    font-size: 16px
  }
}

.cleansing-milk .txt-green {
  color: #29b196
}

.cleansing-milk .txt-red {
  color: #ff6464
}

.cleansing-milk .txt-sub {
  font-size: .5em;
  vertical-align: super
}

.cleansing-milk .mv {
  position: relative
}

.cleansing-milk .mv__img {
  max-width: 100%;
  aspect-ratio: 750/1212
}

@media screen and (min-width: 751px) {
  .cleansing-milk .mv__img {
    aspect-ratio: 1366/631
  }
}

.cleansing-milk .mv__txtarea {
  position: absolute;
  /* top: 74%;
  left: 5%;
  right: 5% */
}

@media screen and (min-width: 751px) {
  .cleansing-milk .mv__txtarea {
    display: flex;
    justify-content: space-between;
    align-items: center;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    padding-left: 40px;
  }
}

.cleansing-milk .mv__point {
  display: flex;
  justify-content: space-between;
  gap: 5px;
  width: 50%;
  max-width: 355px;
}

.cleansing-milk .mv__point__item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 84px;
  height: 84px;
  background: #fff;
  color: #328967;
  font-size: 14px;
  text-align: center;
  letter-spacing: 0.05em;
  border-radius: 50%;
}

.cleansing-milk .mv__note {
  display: block;
  width: 36.2%;
  max-width: 362px;
  line-height: 1.5em;
  letter-spacing: .05em;
  text-align: center;
  font-size: 2.4vw;
  color: #5c5c5c
}

@media screen and (min-width: 751px) {
  .cleansing-milk .mv__note {
    padding: 0 0 0 1em;
    text-align: left;
    font-size: min(12px, .878vw);
    color: #fff
  }
}

.cleansing-milk .mv__blink-area {
  position: absolute;
  top: 28.5%;
  left: 5%;
  right: 5%;
  z-index: 1
}

@media screen and (min-width: 751px) {
  .cleansing-milk .mv__blink-area {
    top: 36%;
    left: 57%;
    right: 7.25%
  }
}

.cleansing-milk .mv__blink-area__inner {
  position: relative;
  width: 100%;
  aspect-ratio: 674/439
}

.cleansing-milk .mv__blink-area_img {
  position: absolute;
  inset: 0;
  aspect-ratio: 675/440
}

.cleansing-milk .mv__blink-area_img--01 {
  animation: blinking_01 infinite 1.2s
}

.cleansing-milk .mv__blink-area_img--02 {
  animation: blinking_02 infinite 1.2s
}

@keyframes blinking_01 {

  0%,
  50% {
    opacity: 0
  }

  60%,
  100% {
    opacity: 1
  }
}

@keyframes blinking_02 {

  0%,
  50% {
    opacity: 1
  }

  60%,
  100% {
    opacity: 0
  }
}

.cleansing-milk .summary {
  position: relative
}

.cleansing-milk .summary__img {
  aspect-ratio: 750/1105
}

@media screen and (min-width: 751px) {
  .cleansing-milk .summary__img {
    aspect-ratio: 1366/600
  }
}

.cleansing-milk .summary__details {
  position: absolute;
  left: 4.75%;
  right: 4.75%;
  bottom: 8.66vw;
  display: flex;
  flex-flow: column;
  gap: 4vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .summary__details {
    left: 15%;
    right: 15%;
    bottom: 3%;
    flex-flow: row;
    justify-content: space-between
  }
}

.cleansing-milk .summary__details_list {
  display: flex;
  justify-content: space-between;
  align-items: center
}

@media screen and (min-width: 751px) {
  .cleansing-milk .summary__details_list {
    -moz-column-gap: 1.5%;
    column-gap: 1.5%
  }
}

.cleansing-milk .summary__details_list_item {
  text-align: center;
  margin: 0;
  padding: .65em 1.075em;
  border-radius: 2em;
  letter-spacing: .1em;
  font-size: 3.2vw;
  color: #328967;
  background: #fff;
  list-style: unset
}

@media screen and (min-width: 751px) {
  .cleansing-milk .summary__details_list_item {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    width: min(84px, 6.149vw);
    aspect-ratio: 1/1;
    border-radius: 5em;
    font-size: min(14px, 1.02vw)
  }
}

.cleansing-milk .summary__details_note {
  display: block;
  line-height: 1.5em;
  letter-spacing: .045em;
  font-size: 2.66vw;
  color: #fff
}

@media screen and (min-width: 751px) {
  .cleansing-milk .summary__details_note {
    width: 35.5%;
    font-size: min(12px, .878vw)
  }
}

.cleansing-milk .point {
  display: flex;
  flex-flow: column;
  align-items: center;
  /* flex-flow: row; */
  padding: 13% 7.4% 7.5%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point {
    justify-content: center;
    padding: 60px 5%
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point--01 {
    gap: 60px
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point--01 .point__txtarea {
    width: 388px
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point--02 {
    gap: 60px
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point--02 .point__txtarea {
    width: 389px
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point--03 {
    gap: 80px
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point--03 .point__txtarea {
    width: 418px
  }
}

.cleansing-milk .point__heading {
  margin: 0 0 6%;
  text-align: center
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__heading {
    margin: 0 0 30px
  }
}

.cleansing-milk .point__heading_accent {
  display: block;
  margin: 0 auto 8.5%;
  width: 20vw;
  aspect-ratio: 150/152
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__heading_accent {
    margin: 0 auto 30px;
    width: 99px
  }
}

.cleansing-milk .point__heading_txt {
  text-align: center;
  line-height: 1.5em;
  font-size: 4.53vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__heading_txt {
    letter-spacing: .1em;
    text-align: left;
    font-size: min(26px,2.7vw)
  }
}

.cleansing-milk .point__txt {
  align-self: flex-start;
  margin: 0 0 2em;
  line-height: 1.85em;
  letter-spacing: .045em;
  font-size: 3.46vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__txt {
    margin: 0 0 1.25em;
    line-height: 1.7em;
    font-size: min(16px,1.7vw)
  }

  .cleansing-milk .point__txt:not(:has(+*)) {
    margin: 0
  }
}

.cleansing-milk .point__note {
  align-self: flex-start;
  order: 4;
  display: block;
  letter-spacing: .125em;
  line-height: 1.55em;
  font-size: 2.66vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__note {
    order: unset;
    letter-spacing: .01em;
    line-height: 1.25em;
    font-size: 12px
  }
}

.cleansing-milk .point__fig {
  position: relative;
  order: 3;
  margin: 0 0 3%;
  width: 100%
}

.cleansing-milk .point__fig_img {
  aspect-ratio: 640/620
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__fig {
    order: unset;
    margin: 0;
    width: 396px
  }
}

.cleansing-milk .point__fig_caption {
  position: absolute;
  top: 15%;
  left: 50%;
  text-align: center;
  letter-spacing: .09em;
  line-height: 1.35em;
  font-size: 4vw;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  color: #575757;
  font-weight: 500
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__fig_caption {
    font-size: 18px
  }
}

.cleansing-milk .point:nth-child(odd) {
  background: #ebebeb
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point:nth-child(even) {
    flex-flow: row
  }
}

.cleansing-milk .point:nth-child(odd) .point__heading_txt {
  letter-spacing: .075em;
  font-weight: 500;
  color: #686868
}

.cleansing-milk .point:nth-child(odd) .point__txt {
  font-weight: 400;
  color: #686868
}

.cleansing-milk .point:nth-child(odd) .point__note {
  color: #686868
}

.cleansing-milk .point:nth-child(even) {
  background: #4EAB81
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point:nth-child(odd) {
    flex-flow: row-reverse
  }
}

.cleansing-milk .point:nth-child(even) .point__heading_txt {
  letter-spacing: .12em;
  font-weight: 500;
  color: #fff
}

.cleansing-milk .point:nth-child(even) .point__txt {
  font-weight: 500;
  color: #fff
}

.cleansing-milk .point:nth-child(even) .point__note {
  font-weight: 400;
  color: #fff
}

.cleansing-milk .point .cmn-swiper {
  margin: 0 0 3%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point .cmn-swiper {
    margin: 0;
    width: 396px
  }
}

.cleansing-milk .point__slide-fig {
  position: relative
}

.cleansing-milk .point__slide-fig_img {
  aspect-ratio: 640/733
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__slide-fig_img {
    aspect-ratio: 396/413
  }
}

.cleansing-milk .point__slide-fig_caption {
  position: absolute;
  top: 51%;
  left: 50%;
  text-align: center;
  line-height: 1.35em;
  letter-spacing: .085em;
  font-size: 4.53vw;
  transform: translate(-50%, -50%);
  white-space: nowrap
}

@media screen and (min-width: 751px) {
  .cleansing-milk .point__slide-fig_caption {
    top: 57.5%;
    font-size: 18px
  }
}

.cleansing-milk .point__slide-fig_caption .txt-green {
  font-weight: 500
}

.cleansing-milk .fragrance {
  display: flex;
  flex-flow: column;
  align-items: center;
  padding: 14% 7.4% 7.5%;
  background: #F2EBA3
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance {
    flex-flow: row-reverse;
    justify-content: center;
    gap: 60px;
    padding: 60px 5%
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__txtarea {
    width: 469px
  }
}

.cleansing-milk .fragrance__heading {
  margin: 0 0 6%;
  text-align: center
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__heading {
    margin: 0 0 20px
  }
}

.cleansing-milk .fragrance__heading_accent {
  display: block;
  margin: 0 0 13.5%;
  text-align: center;
  color: #00AC7D
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__heading_accent {
    margin: 0 0 40px
  }
}

.cleansing-milk .fragrance__heading_accent_top {
  display: block;
  margin: 0 0 1.45em;
  letter-spacing: .125em;
  font-size: 3.2vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__heading_accent_top {
    margin: 0 0 1.5em;
    font-size: min(16px,1.7vw)
  }
}

.cleansing-milk .fragrance__heading_accent_btm {
  display: block;
  letter-spacing: .135em;
  font-family: "Jost", sans-serif;
  font-size: 6.66vw;
  font-weight: 500
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__heading_accent_btm {
    font-size: min(40px,3.9vw)
  }
}

.cleansing-milk .fragrance__heading_txt {
  display: block;
  text-align: center;
  line-height: 1.5em;
  letter-spacing: .15em;
  font-size: 4.53vw;
  font-weight: 500;
  color: #575757
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__heading_txt {
    font-size: min(26px,2.7vw)
  }
}

.cleansing-milk .fragrance__txt {
  align-self: flex-start;
  margin: 0 0 2em;
  line-height: 1.85em;
  letter-spacing: .045em;
  font-size: 3.46vw;
  font-weight: 500;
  color: #575757
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__txt {
    margin: 0 0 1.25em;
    line-height: 1.7em;
    font-size: min(16px,1.7vw)
  }
}

.cleansing-milk .fragrance__note {
  align-self: flex-start;
  order: 4;
  letter-spacing: .125em;
  line-height: 1.55em;
  font-size: 2.66vw;
  color: #575757
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__note {
    order: unset;
    letter-spacing: .01em;
    line-height: 1.25em;
    font-size: min(12px,1.22vw)
  }
}

.cleansing-milk .fragrance__img {
  order: 3;
  margin: 0 0 3%;
  width: 100%;
  aspect-ratio: 640/354
}

@media screen and (min-width: 751px) {
  .cleansing-milk .fragrance__img {
    order: unset;
    margin: 0;
    width: 473px
  }
}

.cleansing-milk .howtouse {
  display: flex;
  flex-flow: column;
  align-items: center;
  padding: 14% 7.4% 7.5%;
  background: #C8E0C5
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse {
    flex-flow: row;
    justify-content: center;
    gap: 80px;
    padding: 60px 5%
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__txtarea {
    width: min(480px, 39%);
    width: 480px
  }
}

.cleansing-milk .howtouse__heading {
  margin: 0 0 6%;
  text-align: center
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__heading {
    flex-flow: row;
    margin: 0 0 30px
  }
}

.cleansing-milk .howtouse__heading_accent {
  display: block;
  margin: 0 0 10.25%;
  text-align: center;
  color: #4DAA81
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__heading_accent {
    margin: 0 0 35px
  }
}

.cleansing-milk .howtouse__heading_accent_top {
  display: block;
  margin: 0 0 1.45em;
  letter-spacing: .125em;
  font-size: 3.2vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__heading_accent_top {
    margin: 0 0 1.5em;
    font-size: min(16px,1.7vw)
  }
}

.cleansing-milk .howtouse__heading_accent_btm {
  display: block;
  letter-spacing: .135em;
  font-family: "Jost", sans-serif;
  font-size: 6.66vw;
  font-weight: 500
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__heading_accent_btm {
    font-size: min(40px,3.9vw)
  }
}

.cleansing-milk .howtouse__heading_txt {
  text-align: center;
  line-height: 1.5em;
  letter-spacing: .15em;
  font-size: 4.53vw;
  font-weight: 500;
  color: #575757
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__heading_txt {
    font-size: min(26px,2.7vw)
  }
}

.cleansing-milk .howtouse__txt {
  align-self: flex-start;
  order: 3;
  line-height: 1.85em;
  letter-spacing: .045em;
  font-size: 3.46vw;
  font-weight: 400;
  color: #575757
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__txt {
    order: unset;
    line-height: 1.7em;
    font-size: min(16px,1.7vw)
  }
}

.cleansing-milk .howtouse__txt .txt-red {
  font-weight: 500
}

.cleansing-milk .howtouse .cmn-swiper {
  order: 2;
  margin: 0 0 5%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse .cmn-swiper {
    order: unset;
    margin: 0;
    width: 396px
  }
}

.cleansing-milk .howtouse__slide-fig {
  position: relative
}

.cleansing-milk .howtouse__slide-fig_img {
  aspect-ratio: 640/740
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__slide-fig_img {
    aspect-ratio: 438/426
  }
}

.cleansing-milk .howtouse__slide-fig_caption {
  position: absolute;
  display: flex;
  flex-flow: column;
  align-items: center;
  left: 9.375%;
  right: 9.375%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__slide-fig_caption {
    left: 11%;
    right: 11%
  }
}

.cleansing-milk .howtouse__slide-fig_caption.no01 {
  top: 57%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__slide-fig_caption.no01 {
    top: 51.5%
  }
}

.cleansing-milk .howtouse__slide-fig_caption.no02,
.cleansing-milk .howtouse__slide-fig_caption.no03,
.cleansing-milk .howtouse__slide-fig_caption.no04 {
  top: 52.75%
}

@media screen and (min-width: 751px) {

  .cleansing-milk .howtouse__slide-fig_caption.no02,
  .cleansing-milk .howtouse__slide-fig_caption.no03,
  .cleansing-milk .howtouse__slide-fig_caption.no04 {
    top: 51.5%
  }
}

.cleansing-milk .howtouse__slide-fig_caption_accent {
  margin: 0 0 .7em;
  padding: 0 0 .3em;
  border-bottom: 1px solid #29b196;
  letter-spacing: .09em;
  font-family: "Jost", sans-serif;
  font-size: 4vw;
  color: #29b196
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__slide-fig_caption_accent {
    margin: 0 0 .9em;
    font-size: clamp(12.6px, 1.75vw, 18px)
  }
}

@media screen and (min-width: 1025px) {
  .cleansing-milk .howtouse__slide-fig_caption_accent {
    font-size: 18px
  }
}

.cleansing-milk .howtouse__slide-fig_caption_accent .num {
  font-size: 1.33em
}

.cleansing-milk .howtouse__slide-fig_caption_lead {
  margin: 0 0 .95em;
  text-align: center;
  line-height: 1.25em;
  letter-spacing: .05em;
  font-size: 4.53vw;
  font-weight: 500;
  color: #29b196
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__slide-fig_caption_lead {
    margin: 0 0 .9em;
    line-height: 1.35em;
    font-size: clamp(12.6px, 1.75vw, 18px)
  }
}

@media screen and (min-width: 1025px) {
  .cleansing-milk .howtouse__slide-fig_caption_lead {
    font-size: 18px
  }
}

@media screen and (min-width: 751px) {

  .cleansing-milk .howtouse__slide-fig_caption.no02 .howtouse__slide-fig_caption_lead,
  .cleansing-milk .howtouse__slide-fig_caption.no03 .howtouse__slide-fig_caption_lead,
  .cleansing-milk .howtouse__slide-fig_caption.no04 .howtouse__slide-fig_caption_lead {
    margin: 0 0 .5em
  }
}

.cleansing-milk .howtouse__slide-fig_caption_txt {
  line-height: 1.45em;
  letter-spacing: .05em;
  font-size: 3.2vw;
  font-weight: 300
}

@media screen and (min-width: 751px) {
  .cleansing-milk .howtouse__slide-fig_caption_txt {
    font-size: clamp(9.8px, 1.36vw, 14px)
  }
}

@media screen and (min-width: 1025px) {
  .cleansing-milk .howtouse__slide-fig_caption_txt {
    font-size: 14px
  }
}

.cleansing-milk .howtouse__slide-fig_caption_txt .txt-green {
  font-weight: 500
}

.cleansing-milk .increase {
  padding: 10.5% 7.4% 12%;
  background: #fff
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase {
    padding: 60px 5%
  }
}

.cleansing-milk .increase__heading {
  display: block;
  margin: 1em 0;
  text-align: center;
  line-height: 1.45em;
  letter-spacing: .1em;
  font-size: 4.533vw;
  font-weight: 500;
  color: #575757;
}
.cleansing-milk .increase__heading.for-pc {
  display: none;
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase__heading {
    display: block;
    margin: 0 0 1em;
    font-size: min(26px,2.7vw)
  }
  .cleansing-milk .increase__heading.for-pc {
    display: block;
  }
  .cleansing-milk .increase__heading.for-sp {
    display: none;
  }
}


.cleansing-milk .increase__flex-container {
  margin: 0 0 1%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase__flex-container {
    display: flex;
    justify-content: center;
    align-items: center;
    /* gap: 30px */
  }
}

.cleansing-milk .increase__img {
  display: block;
  width: 61.3vw;
  margin: 0 auto 3.5%;
  -o-object-fit: contain;
  object-fit: contain;
  aspect-ratio: 938/803
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase__img {
    width: 49%;
    max-width: 478px;
    margin: 0;
  }
}

.cleansing-milk .increase .cta {
  padding: 5% 0 4%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase .cta:not(:last-child) {
    margin: 0 0 5px
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase .cta {
    flex-flow: column
  }
}

.cleansing-milk .increase .cta__txtarea {
  text-align: center
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase .cta__link {
    width: min(420px, 100%)
  }
}

.cleansing-milk .increase__release {
  margin: 0 0 1.45em;
  letter-spacing: .08em;
  text-align: center;
  font-size: 3.33vw;
  font-weight: 500
}

.cleansing-milk .increase__release_YMD {
  letter-spacing: .08em;
  font-family: "Jost", sans-serif;
  font-size: 1.56em;
  font-weight: 500
}

.cleansing-milk .increase__release_week {
  padding-left: .2em;
  letter-spacing: .09em;
  font-family: "Jost", sans-serif;
  font-size: 1.28em;
  font-weight: 400;
  vertical-align: top
}

.cleansing-milk .increase__release_week_txt {
  font-family: "Jost", sans-serif;
  font-size: .763em;
  font-weight: 500;
  vertical-align: middle
}

.cleansing-milk .increase__release--lime {
  color: #9acb1b
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase__release--lime {
    margin: 0 0 1.2em;
    font-size: 18px
  }
}

.cleansing-milk .increase__release--moss-green {
  margin: 0;
  color: #00ac7d
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase__release--moss-green {
    font-size: 20px
  }
}

.cleansing-milk .increase__note {
  display: block;
  text-align: center;
  line-height: 1.35em;
  letter-spacing: .06em;
  font-size: 3.2vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .increase__note {
    padding: 0 0 0 1em;
    text-align: left;
    font-size: 16px
  }
}

.cleansing-milk .column {
  display: flex;
  flex-flow: column;
  align-items: center;
  padding: 11.5% 7.4% 15%;
  background: #f1efe7
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column {
    padding: 60px 5% 75px
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__txtarea {
    display: flex;
    flex-flow: column;
    gap: 15px;
    flex: 1
  }
}

.cleansing-milk .column__heading {
  margin: 0 0 6%;
  text-align: center
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__heading {
    margin: 0 0 38px
  }
}

.cleansing-milk .column__heading_accent {
  display: flex;
  flex-flow: column;
  align-items: center;
  margin: 0 0 11.5%;
  text-align: center;
  color: #3fb989
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__heading_accent {
    margin: 0 0 35px
  }
}

.cleansing-milk .column__heading_accent_top {
  margin: 0 0 1.3em;
  letter-spacing: .125em;
  font-size: 3.2vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__heading_accent_top {
    margin: 0 0 1.5em;
    font-size: min(16px,1.7vw)
  }
}

.cleansing-milk .column__heading_accent_btm {
  letter-spacing: .135em;
  font-family: "Jost", sans-serif;
  font-size: 6.66vw;
  font-weight: 500
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__heading_accent_btm {
    font-size: min(40px,3.9vw)
  }
}

.cleansing-milk .column__heading_txt {
  text-align: center;
  line-height: 1.45em;
  letter-spacing: .1em;
  font-size: 4.533vw;
  font-weight: 400
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__heading_txt {
    font-size: min(26px,2.7vw)
  }
}

.cleansing-milk .column__list {
  display: flex;
  flex-flow: column;
  gap: 2vw;
  width: 100%
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__list {
    flex-flow: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px
  }
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__list_item {
    width: 480px
  }
}

.cleansing-milk .column__link {
  position: relative;
  display: block;
  padding: 1.65em 2.1em;
  border-radius: 1.15em;
  letter-spacing: .07em;
  font-size: 3.466vw;
  font-weight: 500;
  color: #575757;
  background: #fff;
  transition: .2s
}

@media screen and (min-width: 751px) {
  .cleansing-milk .column__link {
    border-radius: 1.5em;
    font-size: 18px
  }
}

.cleansing-milk .column__link::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 3%;
  display: inline-block;
  width: 4.75%;
  aspect-ratio: 1/1;
  transform: translate(-50%, -50%);
  background: center/contain no-repeat url(../../../../img/usr/pages/cleansing-milk2025/cmn_icn_arrow_black.svg);
  transition: .2s
}

.cleansing-milk .column__link:hover {
  color: #fff;
  background: #40b989
}

.cleansing-milk .column__link:hover::before {
  background: center/contain no-repeat url(../../../../img/usr/pages/cleansing-milk2025/cmn_icn_arrow_white.svg)
}

.cleansing-milk [data-js=floating] {
  position: fixed;
  left: 50%;
  right: 0;
  bottom: 0;
  width: min(1366px, 100%);
  transform: translate(-50%, 30%);
  transition: .4s;
  opacity: 0
}

.cleansing-milk [data-js=floating].is-active {
  opacity: 1;
  transform: translate(-50%, 0)
}

.cleansing-milk [data-js=floating].is-stoping {
  position: absolute;
  bottom: 0;
  left: 50%;
  right: 0;
  opacity: 1;
  transform: translate(-50%, 0);
  transition: 0
}

@media screen and (min-width: 751px) {
  .cleansing-milk [data-js=floating] .cta__txtarea {
    margin: 0
  }
}

.cleansing-milk [data-js=stop-el] {
  height: 34.5vw
}

@media screen and (min-width: 751px) {
  .cleansing-milk [data-js=stop-el] {
    height: 113px
  }
}