.primary-content .content-asset {
  letter-spacing: 0;
}

.content-asset .lDesign-content .cHalfColumn-note {
  padding-left: 2em;
  text-indent: -2em;
  font-feature-settings: 'palt' on, 'pkna' on;
}

.content-asset .lMechanism-animation {
  position: relative;
  background: #f9f9f9;
}
.content-asset .lMechanism-animation .caption {
  position: absolute;
  color: #939393;
  font-family: "Hiragino Kaku Gothic W4 JIS2004", sans-serif;
}

.content-asset .lMechanism-content .slick-slider {
  margin-bottom: 0;
}
.content-asset .lMechanism-content .slick-list,
.content-asset .lMechanism-content .slick-track {
  width: 100% !important;
}

.content-asset .lMechanism-gif .lMechanism-gif1,
.content-asset .lMechanism-gif .lMechanism-gif2,
.content-asset .lMechanism-gif .lMechanism-gif3 {
  width: 100% !important;
  padding-inline: 6.86567% 9.55224%;
  background: no-repeat 50% 50% / auto 100%;
}
.content-asset .lMechanism-gif .lMechanism-gif2,
.content-asset .lMechanism-gif .lMechanism-gif3 {
  position: absolute !important;
  left: 0 !important;
}
.content-asset .lMechanism-gif:not(.slick-initialized) .lMechanism-gif2, .content-asset .lMechanism-gif:not(.slick-initialized) .lMechanism-gif3 {
  visibility: hidden;
}
.content-asset .lMechanism-gif .lMechanism-gif1 {
  background-image: url("../img/aqua1_bg.png");
}
.content-asset .lMechanism-gif .lMechanism-gif2 {
  background-image: url("../img/aqua2_bg.png");
}
.content-asset .lMechanism-gif .lMechanism-gif3 {
  background-image: url("../img/aqua3_bg.png");
}

.content-asset .lMechanism-ingredients {
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.content-asset .lMechanism-ingredient {
  display: flex;
  align-items: center;
}
.content-asset .lMechanism-ingredient picture {
  display: flex;
  justify-content: center;
  align-items: center;
}
.content-asset .lMechanism-ingredient:nth-child(3) .lMechanism-ingredientText {
  position: relative;
  top: 1px;
}

.content-asset .lMechanism-ingredientIcon {
  display: flex;
  justify-content: center;
  align-items: center;
}

.content-asset .lMechanism-ingredientText {
  font-family: "Hiragino Kaku Gothic W4 JIS2004", sans-serif;
}

.content-asset .lMechanism-title {
  position: relative;
  font-family: "Hiragino Kaku Gothic W5 JIS2004", sans-serif;
}
.content-asset .lMechanism-title span:not(:first-child) {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.content-asset .lMechanism-title .lMechanism-title2,
.content-asset .lMechanism-title .lMechanism-title3 {
  position: absolute !important;
  left: 0 !important;
}
.content-asset .lMechanism-title:not(.slick-initialized) .lMechanism-title2, .content-asset .lMechanism-title:not(.slick-initialized) .lMechanism-title3 {
  visibility: hidden;
}

.content-asset .lMechanism-text {
  line-height: 1.5714285714;
  letter-spacing: -.005em;
}

.content-asset .lMechanism-note {
  color: #939393;
  line-height: 1.5;
  letter-spacing: -.12px;
  font-family: "Hiragino Kaku Gothic W4 JIS2004", sans-serif;
  font-feature-settings: "palt";
}

.content-asset .lMechanism-item {
  width: 100%;
}

@media screen and (min-width: 769px) {
  .content-asset .cProduct-content {
    padding-block: 40px 30px;
  }

  .content-asset .lDesign {
    margin-top: -30px;
    padding-top: 130px;
  }

  .content-asset .lDesign-content {
    margin-top: 40px;
  }
  .content-asset .lDesign-content .cHalfColumn-image {
    margin-block: 30px 16px;
  }
  .content-asset .lDesign-content .-hybrid .cHalfColumn-image {
    max-width: 356px;
  }
  .content-asset .lDesign-content .-scene .cHalfColumn-image {
    max-width: 300px;
  }

  .content-asset .lMechanism {
    padding-top: 130px;
  }

  .content-asset .lMechanism-content {
    margin-top: 33px;
  }

  .content-asset .lMechanism .lMechanism-content + .lMechanism-content {
    margin-top: 130px;
  }

  .content-asset .lMechanism-animation {
    display: flex;
    padding-block: 23px 15px;
    margin-top: 39px;
    padding-left: 15.96%;
  }
  .content-asset .lMechanism-animation .caption {
    font-size: 10px;
    bottom: 17px;
    right: 20px;
  }

  .content-asset .lMechanism-gif {
    width: 35%;
    max-width: 220px;
    margin-right: 9.5%;
  }

  .content-asset .lMechanism-ingredients {
    gap: 9px;
  }

  .content-asset .lMechanism-ingredient:first-child .lMechanism-ingredientIcon img {
    width: 12px;
  }
  .content-asset .lMechanism-ingredient:nth-child(2) .lMechanism-ingredientIcon img {
    height: 12px;
  }
  .content-asset .lMechanism-ingredient:nth-child(3) .lMechanism-ingredientIcon img {
    width: 8px;
  }

  .content-asset .lMechanism-ingredientIcon {
    width: 14px;
    margin-right: 9px;
  }

  .content-asset .lMechanism-ingredientText {
    font-size: 11px;
  }

  .content-asset .lMechanism-title {
    font-size: 17px;
    margin-top: 25px;
  }

  .content-asset .lMechanism-text {
    font-size: 14px;
    margin-top: 11px;
  }

  .content-asset .lMechanism-note {
    font-size: 12px;
    margin-top: 4px;
  }

  .content-asset .lMechanism-list {
    display: flex;
    gap: 31px;
    margin-top: 40px;
  }

  .content-asset .lMechanism-item {
    padding-top: 23px;
    border-top: 1px solid #d6d6d6;
  }

  .content-asset .lMechanism-itemText {
    font-size: 14px;
    line-height: 1.57;
  }

  .content-asset .lProduct {
    padding-top: 130px;
  }

  .content-asset .lOtherCare {
    padding-top: 130px;
  }

  .content-asset .lOtherCare-content {
    margin-top: 40px;
  }
}
@media screen and (max-width: 768px) {
  .content-asset .cSectionTitle-inner {
    height: auto;
    min-height: 1.4285714286rem;
  }

  .content-asset .lDesign {
    margin-top: -1.0714285714rem;
    padding-top: 3.5714285714rem;
  }

  .content-asset .lDesign-content {
    margin-top: 1.4285714286rem;
  }
  .content-asset .lDesign-content .cHalfColumn-item + .cHalfColumn-item {
    margin-top: 2.5rem;
  }
  .content-asset .lDesign-content .cHalfColumn-image {
    margin-block: 1.4285714286rem 0;
  }
  .content-asset .lDesign-content .-scene .cHalfColumn-image {
    margin-inline: 1.4285714286rem;
  }

  .content-asset .lMechanism {
    padding-top: 3.9285714286rem;
  }

  .content-asset .lMechanism-content {
    margin-top: 1.25rem;
    margin-inline: .5714285714rem;
  }

  .content-asset .lMechanism .lMechanism-content + .lMechanism-content {
    margin-top: 2.5rem;
  }

  .content-asset .lMechanism-animation {
    margin-top: 1.3928571429rem;
    padding-block: 1.0714285714rem;
    padding-left: 2.1428571429rem;
  }
  .content-asset .lMechanism-animation .caption {
    width: fit-content;
    font-size: .3571428571rem;
    bottom: .2857142857rem;
    right: .3571428571rem;
  }

  .content-asset .lMechanism-gif {
    width: 9.2857142857rem;
  }

  .content-asset .lMechanism-ingredients {
    gap: .1428571429rem;
    margin-top: .5rem;
  }

  .content-asset .lMechanism-ingredient:first-child .lMechanism-ingredientIcon img {
    width: .4285714286rem;
  }
  .content-asset .lMechanism-ingredient:nth-child(2) .lMechanism-ingredientIcon img {
    height: .4285714286rem;
  }
  .content-asset .lMechanism-ingredient:nth-child(3) .lMechanism-ingredientIcon img {
    width: .2857142857rem;
  }

  .content-asset .lMechanism-ingredientIcon {
    width: .5rem;
    margin-right: .3214285714rem;
  }

  .content-asset .lMechanism-ingredientText {
    font-size: .3928571429rem;
  }

  .content-asset .lMechanism-title {
    font-size: 0.6071428571rem;
    margin-top: 1.25rem;
  }

  .content-asset .lMechanism-text {
    font-size: .5rem;
    margin-top: 0.4285714286rem;
  }

  .content-asset .lMechanism-note {
    font-size: .4285714286rem;
    margin-top: .3214285714rem;
  }

  .content-asset .lMechanism-list {
    margin-top: 1.4285714286rem;
  }

  .content-asset .lMechanism-item {
    margin-bottom: 0.8214285714rem;
    padding-top: 0.8214285714rem;
    border-top: 1px solid #d6d6d6;
  }
  .content-asset .lMechanism-item:last-child {
    margin-bottom: 0;
  }

  .content-asset .lMechanism-itemText {
    font-size: .5rem;
  }

  .content-asset .lProduct {
    padding-top: 3.75rem;
  }

  .content-asset .lOtherCare {
    padding-top: 3.9285714286rem;
  }

  .content-asset .lOtherCare-content {
    margin-top: 1.4285714286rem;
  }
}
@media screen and (min-width: 769px) and (max-width: 1100px) {
  .content-asset .lMechanism-animation {
    padding-left: 5.5%;
  }

  .content-asset .lMechanism-gif {
    width: 28%;
    margin-right: 3.5%;
  }

  .content-asset .lMechanism-list {
    flex-direction: column;
  }

  .content-asset .lMechanism-item:first-child, .content-asset .lMechanism-item:nth-child(2) {
    max-width: 100%;
  }
}