@charset "UTF-8";

:root {
  --pw: 1400;
  --sw: 750;
  --artboard-pw: 466;
  --artboard-sw: 750;
  --rem: calc(var(--variable) * var(--ratio));
  --rem-pc: var(--variable);
  --ratio: 1;
  --variable: calc(100vw / var(--sw));
}

@media (min-width: 769px) {
  :root {
    --ratio: calc(var(--artboard-pw) / var(--artboard-sw));
    --variable: calc(100vw / var(--pw));
  }
}

@media (min-width: 1401px) {
  :root {
    --variable: 1px;
  }
}

.p-feature {
  --color-text: #000;
  --color-note: #757575;
  --color-line: #dbd8d7;
  --color-box: rgb(219 216 215 / .2);
  --color-ingredient-oil: #f8f7fb;

  --font-plain: "Noto Sans JP", hiragino-kaku-gothic-pron, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, sans-serif;
  --font-base: europa, var(--font-plain);
  --font-label: europa, "Helvetica Neue", Arial, sans-serif;
  --font-copy: source-han-serif-japanese, "Noto Serif JP", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", serif;
  --font-heading: garamond-premier-pro, "Times New Roman", serif;

  --ease-fade: cubic-bezier(.51, .21, .41, 1);
  --duration-fade: 1s;
  --duration-mask: 2s;
  --duration-switch: .3s;
  --letter-spacing: .04em;

  --z-base: 1;
  --z-sticky: 10;
  --z-modal-overlay: 1000;
  --z-modal: 1010;
}

.lp_contents {
  position: relative;
  z-index: 1;
  font-family: var(--font-base);
  color: var(--color-text);
  font-style: normal;
  letter-spacing: var(--letter-spacing);

  & * {
    font-feature-settings: "halt";
    font-kerning: none;
  }

  & *,
  & *:before,
  & *:after {
    box-sizing: border-box;
  }

  & :where(h1, h2, h3, h4, h5, p, ul, ol, li, dl, dt, dd, a, button, figure, figcaption, blockquote, span, sup, b) {
    margin: 0;
    padding: 0;
    font-family: inherit;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: var(--letter-spacing);
  }

  & ul,
  & li {
    list-style: none;
  }

  & :where(img) {
    display: block;
    width: 100%;
    height: auto;
  }

  & :where(a, a:before, a:after, a img, button) {
    --duration: .3s;
    --timing: ease-in-out;
    transition: opacity var(--duration) var(--timing), color var(--duration) var(--timing), background-color var(--duration) var(--timing), border-color var(--duration) var(--timing);
  }

  & :where(a) {
    color: inherit;
    text-decoration: none;

    @media (any-hover: hover) {
      &:hover {
        opacity: .7;
      }
    }
  }

  & :where(button) {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    outline: none;
    -webkit-tap-highlight-color: transparent;
  }
}

#Wrap {
  width: 100%;
}

#Contents {
  max-width: unset;
}

#footer,
footer,
#FooterWrap {
  position: relative;
  z-index: 2;
}

#Contents #share {
  right: auto;
  left: 5%;
}

.lp_contents {
  & .layout-columns {
    @media (min-width: 769px) {
      display: grid;
    }

    &.layout-columns--col-3 {
      @media (min-width: 769px) {
        grid-template-columns: 1fr calc(var(--artboard-pw) * var(--rem-pc)) 1fr;
      }
    }
  }

  & .layout-rail {
    display: none;

    @media (min-width: 769px) {
      position: sticky;
      top: 0;
      z-index: var(--z-sticky);
      display: grid;
      place-items: center;
      height: 100dvh;
      padding-top: var(--header-height, 0px);
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
    }
  }

  & .layout-rail--left {
    @media (min-width: 769px) {
      padding-top: 0;
      background-image: url(../img/bg-pc-left.jpg);
    }
  }

  & .layout-rail--right {
    @media (min-width: 769px) {
      background-image: url(../img/bg-pc-right.jpg);
    }
  }

  & .layout-primary {
    min-width: 0;
    overflow: hidden;
  }

  & .layout-inner {
    display: flow-root;
    width: calc(var(--artboard-sw) * var(--rem));
    margin-inline: auto;
  }
}

.lp_contents {
  & .ani-switch:not([hidden]) {
    animation: lp-switch var(--duration-switch) ease;
  }
}

@keyframes lp-switch {
  from {
    opacity: 0;
  }
}

html.js .lp_contents {
  & .ani-fade {
    opacity: 0;
    mask-image: linear-gradient(0deg, transparent 0%, transparent 39.6667%, rgb(0 0 0 / .02) 43.3333%, rgb(0 0 0 / .08) 45%, rgb(0 0 0 / .18) 46.6667%, rgb(0 0 0 / .32) 48.3333%, rgb(0 0 0 / .5) 50%, rgb(0 0 0 / .68) 51.6667%, rgb(0 0 0 / .82) 53.3333%, rgb(0 0 0 / .92) 55%, rgb(0 0 0 / .98) 56.6667%, #000 58.3333%, #000 100%);
    mask-size: 100% max(300%, 100vh);
    mask-position: center 100%;
    mask-repeat: no-repeat;
    transition: opacity var(--duration-fade) var(--ease-fade), mask-position var(--duration-mask) linear;

    &.is-active {
      opacity: 1;
      mask-position: center 0;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js .lp_contents .ani-fade {
    opacity: 1;
    mask-image: none;
    transition: none;
  }

  .lp_contents .ani-switch:not([hidden]) {
    animation: none;
  }
}

.lp_contents {
  & .component-line {
    display: block;
    text-align-last: justify;
  }

  & .component-line--end {
    text-align-last: auto;
  }

  & .component-fullwidth {
    font-feature-settings: normal;
  }

  & .component-nowrap {
    white-space: nowrap;
  }

  & sup {
    margin-inline: .08em .04em;
    font-size: .6em;
    line-height: 0;
    vertical-align: .7em;
  }

  & .component-textlink {
    display: flex;
    position: relative;
    align-items: flex-start;
    width: max-content;
  }

  & .component-textlink::after {
    content: "";
    position: absolute;
    inset: calc(-14 * var(--rem)) calc(-10 * var(--rem));
  }

  & .component-chevron {
    display: block;
    flex-shrink: 0;
    width: calc(12 * var(--rem));
    height: auto;
  }

  & .project-product {
    display: flow-root;
  }

  & .project-product__image-link {
    display: block;
  }

  & .project-comment__profile {
    display: flex;
    align-items: flex-start;
    width: max-content;
    margin-left: auto;
  }

  & .project-comment__avatar {
    width: calc(110 * var(--rem));
  }

  & .project-ingredient {
    display: flow-root;
  }

  & .project-product[hidden],
  & .project-ingredient[hidden],
  & .project-popup[hidden] {
    display: none;
  }
}

.lp_contents .project-mv__photo {
  display: block;
  width: 100%;
}

.lp_contents .project-mv__title {
  display: flow-root;
  margin-top: calc(79 * var(--rem));
}

.lp_contents .project-mv__logo {
  display: block;
  width: calc(390 * var(--rem));
  margin-inline: auto;
}

.lp_contents .project-mv__lead {
  display: block;
  margin-top: calc(34 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(38 * var(--rem));
  line-height: 2.3026;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-mv__catch {
  display: block;
  margin-top: calc(-4 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(50 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-mv__text {
  margin-top: calc(31 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-mv {
  display: flow-root;
  padding-bottom: calc(128 * var(--rem));
  background: url(../img/bg-mv.jpg) no-repeat center top / 100% auto;
}

.lp_contents .project-tab__button--cleansing {
  left: calc(31 * var(--rem));
}

.lp_contents .project-tab__label--cleansing0 {
  display: block;
  margin-top: calc(20 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-tab__label--cleansing1 {
  display: block;
  margin-top: calc(-10 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(50 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-tab__button--oil {
  left: calc(341 * var(--rem));
}

.lp_contents .project-tab__label--oil0 {
  display: block;
  margin-top: calc(20 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-tab__label--oil1 {
  display: block;
  margin-top: calc(-11 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(50 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-tab__list {
  position: relative;
  height: calc(156 * var(--rem));
  background-color: #fff;
}

.lp_contents .project-tab__list::after {
  content: "";
  position: absolute;
  z-index: var(--z-base);
  left: 0;
  bottom: 0;
  width: 100%;
  height: calc(6 * var(--rem));
  background-color: var(--color-line);
}

.lp_contents .project-tab__button {
  position: absolute;
  top: 0;
  display: flex;
  flex-direction: column;
  width: calc(378 * var(--rem));
  height: calc(152 * var(--rem));
  padding: 0;
  background: url(../img/tab-off.png) no-repeat 0 0 / 100% 100%;
  color: var(--color-text);
  clip-path: polygon(5.73% 0%, 94.27% 0%, 100% 100%, 0% 100%);
  transition: none;
}

.lp_contents .project-tab__button[aria-selected="true"] {
  z-index: var(--z-base);
  background-image: url(../img/tab-on.png);
  color: #fff;
}

.lp_contents .project-tab__button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: calc(-26 * var(--rem));
}

.lp_contents .project-product__visual--cleansing {
  display: flex;
  align-items: flex-start;
  margin-top: calc(110 * var(--rem));
  margin-left: calc(50 * var(--rem));
}

.lp_contents .project-product__badge--cleansing {
  flex-shrink: 0;
  margin-top: calc(370 * var(--rem));
  display: flow-root;
  width: calc(200 * var(--rem));
  height: calc(200 * var(--rem));
  border: calc(2 * var(--rem)) solid var(--color-line);
  border-radius: 50%;
}

.lp_contents .project-product__image--cleansing {
  flex-shrink: 0;
  width: calc(146 * var(--rem));
  margin-top: calc(7 * var(--rem));
  margin-left: calc(51 * var(--rem));
}

.lp_contents .project-product__texture--cleansing {
  flex-shrink: 0;
  width: calc(181 * var(--rem));
  margin-left: calc(5 * var(--rem));
}

.lp_contents .project-product__badge-text--cleansing-badge {
  margin-top: calc(58 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-product__title--cleansing {
  margin-top: calc(84 * var(--rem));
  margin-left: calc(50 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(38 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-product__credit--cleansing {
  margin-top: calc(59 * var(--rem));
  margin-left: calc(50 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-product__buy--cleansing {
  width: max-content;
  margin-top: calc(18 * var(--rem));
  margin-left: auto;
  margin-right: calc(49 * var(--rem));
}

.lp_contents .component-textlink__label--cleansing-buy {
  display: block;
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-product__buy--cleansing .component-textlink {
  gap: calc(39 * var(--rem));
}

.lp_contents .project-product__buy--cleansing .component-chevron {
  margin-top: calc(13 * var(--rem));
}

.lp_contents .project-product__text--cleansing {
  width: calc(650 * var(--rem));
  margin-top: calc(60 * var(--rem));
  margin-inline: auto;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .036em;
  text-align: justify;
}

.lp_contents .project-product__note--cleansing {
  width: calc(650 * var(--rem));
  margin-top: calc(23 * var(--rem));
  margin-inline: auto;
  font-family: var(--font-base);
  font-size: calc(20 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: justify;
  color: var(--color-note);
  /* white-space: nowrap; */
}

.lp_contents .project-product--cleansing {
  padding-bottom: calc(132 * var(--rem));
  background: url(../img/bg-cleansing-product.jpg) no-repeat center top / 100% auto;
}

.lp_contents .project-product__visual--oil {
  position: relative;
  height: calc(516 * var(--rem));
  margin-top: calc(111 * var(--rem));
}

.lp_contents .project-product__texture--oil {
  position: absolute;
  top: 0;
  left: calc(433 * var(--rem));
  width: calc(213 * var(--rem));
}

.lp_contents .project-product__image--oil {
  position: absolute;
  top: calc(74 * var(--rem));
  left: calc(150 * var(--rem));
  width: calc(450 * var(--rem));
}

.lp_contents .project-product__badge--oil {
  position: absolute;
  z-index: var(--z-base);
  top: calc(309 * var(--rem));
  left: calc(50 * var(--rem));
  display: flow-root;
  width: calc(200 * var(--rem));
  height: calc(200 * var(--rem));
  border: calc(2 * var(--rem)) solid var(--color-line);
  border-radius: 50%;
}

.lp_contents .project-product__badge-text--oil-badge {
  margin-top: calc(57 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-product__title--oil {
  margin-top: calc(77 * var(--rem));
  margin-left: calc(50 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(38 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-product__credit--oil {
  margin-top: calc(56 * var(--rem));
  margin-left: calc(50 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(30 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-product__buy--oil {
  width: max-content;
  margin-top: calc(13 * var(--rem));
  margin-left: auto;
  margin-right: calc(49 * var(--rem));
}

.lp_contents .component-textlink__label--oil-buy {
  display: block;
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-product__buy--oil .component-textlink {
  gap: calc(39 * var(--rem));
}

.lp_contents .project-product__buy--oil .component-chevron {
  margin-top: calc(13 * var(--rem));
}

.lp_contents .project-product__text--oil {
  width: calc(650 * var(--rem));
  margin-top: calc(60 * var(--rem));
  margin-inline: auto;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .033em;
  text-align: justify;
}

.lp_contents .project-product__text--oil span{
  letter-spacing: 0.02em;
}

.lp_contents .project-product__text--oil span span{
  letter-spacing: 0.05em;
}

.lp_contents .project-product__note--oil {
  width: calc(650 * var(--rem));
  margin-top: calc(23 * var(--rem));
  margin-inline: auto;
  font-family: var(--font-base);
  font-size: calc(20 * var(--rem));
  line-height: 1.75;
  letter-spacing: .058em;
  text-align: justify;
  color: var(--color-note);
}

.lp_contents .project-product__note-tight {
  letter-spacing: .01em;
}

.lp_contents .project-product__note-loose {
  letter-spacing: .072em;
}

.lp_contents .project-product--oil {
  padding-bottom: calc(132 * var(--rem));
  background: url(../img/bg-oil-product.jpg) no-repeat center top / 100% auto;
}

.lp_contents .project-comment__head {
  display: flow-root;
  margin-top: calc(143 * var(--rem));
}

.lp_contents .project-comment__title-en {
  display: block;
  font-family: var(--font-heading);
  font-kerning: auto;
  font-size: calc(64 * var(--rem));
  line-height: .65;
  letter-spacing: .04em;
  text-align: center;
  color: var(--color-line);
  white-space: nowrap;
}

.lp_contents .project-comment__title-ja {
  display: block;
  margin-top: calc(23 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 2.1875;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-comment__lead {
  margin-top: calc(35 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-comment__quote-text--1 {
  margin-top: calc(40 * var(--rem));
  margin-left: calc(51 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-comment__quote--1 {
  display: flow-root;
  width: calc(595 * var(--rem));
  height: calc(190 * var(--rem));
  margin-top: calc(88 * var(--rem));
  margin-left: calc(49 * var(--rem));
  background: url(../img/comment-bubble1.png) no-repeat 0 0 / 100% 100%;
}

.lp_contents .project-comment__role--1 {
  display: block;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-comment__name--1 {
  display: block;
  margin-top: calc(-1 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-comment__profile--1 {
  gap: calc(20 * var(--rem));
  margin-top: calc(39 * var(--rem));
  margin-right: calc(50 * var(--rem));
}

.lp_contents .project-comment__person--1 {
  margin-top: calc(10 * var(--rem));
}

.lp_contents .project-comment__text--1 {
  width: calc(600 * var(--rem));
  margin-top: calc(40 * var(--rem));
  margin-inline: auto;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .031em;
  text-align: justify;
}

.lp_contents .project-comment__box--1 {
  margin-top: calc(60 * var(--rem));
  padding-bottom: calc(41 * var(--rem));
}

.lp_contents .project-comment__quote-text--2 {
  margin-top: calc(40 * var(--rem));
  margin-left: calc(51 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-comment__quote--2 {
  display: flow-root;
  width: calc(611 * var(--rem));
  height: calc(190 * var(--rem));
  margin-top: calc(99 * var(--rem));
  margin-left: calc(49 * var(--rem));
  background: url(../img/comment-bubble2.png) no-repeat 0 0 / 100% 100%;
}

.lp_contents .project-comment__role--2 {
  display: block;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-comment__name--2 {
  display: block;
  margin-top: calc(0 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  white-space: nowrap;
}

.lp_contents .project-comment__profile--2 {
  gap: calc(20 * var(--rem));
  margin-top: calc(39 * var(--rem));
  margin-right: calc(50 * var(--rem));
}

.lp_contents .project-comment__person--2 {
  margin-top: calc(9 * var(--rem));
}

.lp_contents .project-comment__text--2 {
  width: calc(600 * var(--rem));
  margin-top: calc(41 * var(--rem));
  margin-inline: auto;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .046em;
  text-align: justify;
}

.lp_contents .project-comment__text--2 .project-comment__text-tight {
  letter-spacing: .03em;
}

.lp_contents .project-comment__text--2 span{
  letter-spacing: 0.03em;
}

.lp_contents .project-comment__box--2 {
  margin-top: calc(59 * var(--rem));
  padding-bottom: calc(40 * var(--rem));
}

.lp_contents .project-comment__box {
  display: flow-root;
  width: calc(700 * var(--rem));
  background-color: var(--color-box);
}

.lp_contents .project-comment {
  display: flow-root;
  padding-bottom: calc(141 * var(--rem));
  background-color: #fff;
}

.lp_contents .project-ingredient__title--cleansing {
  margin-top: calc(119 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(50 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-ingredient__lead--cleansing {
  margin-top: calc(32 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-ingredient__note--cleansing {
  margin-top: calc(20 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(20 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  color: var(--color-note);
  white-space: nowrap;
}

.lp_contents .project-ingredient__diagram {
  display: block;
  width: calc(650 * var(--rem));
  margin-top: calc(52 * var(--rem));
  margin-inline: auto;
}

.lp_contents .project-ingredient--cleansing {
  padding-bottom: calc(140 * var(--rem));
  background: url(../img/bg-cleansing-ingredient.jpg) no-repeat center top / 100% auto;
}

.lp_contents .project-ingredient__photo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.lp_contents .project-ingredient--oil > :not(.project-ingredient__photo) {
  position: relative;
  z-index: var(--z-base);
}

.lp_contents .project-ingredient__head--oil {
  display: flow-root;
  margin-top: calc(129 * var(--rem));
}

.lp_contents .project-ingredient__lead--oil {
  display: block;
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-ingredient__title--oil {
  display: block;
  margin-top: calc(9 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(50 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-ingredient__text--oil {
  width: calc(650 * var(--rem));
  margin-top: calc(609 * var(--rem));
  margin-inline: auto;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .037em;
  text-align: justify;
}

.lp_contents .project-ingredient--oil {
  position: relative;
  padding-bottom: calc(131 * var(--rem));
  background-color: var(--color-ingredient-oil);
}

.lp_contents .project-story__photo {
  display: block;
  width: 100%;
}

.lp_contents .project-story__title {
  margin-top: calc(65 * var(--rem));
  font-family: var(--font-copy);
  font-size: calc(38 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-story__text {
  width: calc(650 * var(--rem));
  margin-top: calc(55 * var(--rem));
  margin-inline: auto;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .028em;
  text-align: justify;
}

.lp_contents .project-story__text span{
  letter-spacing: 0.03em;
}

.lp_contents .project-story {
  display: flow-root;
  padding-bottom: calc(131 * var(--rem));
  background: url(../img/bg-story.jpg) no-repeat center top / 100% auto;
}

.lp_contents .project-campaign__head {
  display: flow-root;
  margin-top: calc(145 * var(--rem));
}

.lp_contents .project-campaign__title-en {
  display: block;
  font-family: var(--font-heading);
  font-kerning: auto;
  font-size: calc(64 * var(--rem));
  line-height: .65;
  letter-spacing: .04em;
  text-align: center;
  color: var(--color-line);
  white-space: nowrap;
}

.lp_contents .project-campaign__title-ja {
  display: block;
  margin-top: calc(22 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 2.1875;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__number--1 {
  top: calc(-37 * var(--rem));
}

.lp_contents .project-campaign__digit--1 {
  display: block;
  margin-top: calc(18 * var(--rem));
  font-family: var(--font-heading);
  font-kerning: auto;
  font-size: calc(64 * var(--rem));
  line-height: .65;
  letter-spacing: .04em;
  text-align: center;
  color: #fff;
  white-space: nowrap;
}

.lp_contents .project-campaign__heading--1 {
  display: flow-root;
  margin-top: calc(49 * var(--rem));
}

.lp_contents .project-campaign__lead--1 {
  display: block;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 2.0417;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__title--1 {
  display: block;
  margin-top: calc(14 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(42 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__badge {
  position: absolute;
  z-index: var(--z-base);
  top: calc(207 * var(--rem));
  left: calc(460 * var(--rem));
  display: flow-root;
  width: calc(170 * var(--rem));
  height: calc(170 * var(--rem));
  border: calc(2 * var(--rem)) solid var(--color-line);
  border-radius: 50%;
}

.lp_contents .project-campaign__badge-text--campaign1-badge {
  margin-top: calc(34 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__label-text--morning {
  display: block;
  margin-top: calc(7 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.5;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__label--morning {
  display: flex;
  align-items: flex-start;
  gap: calc(20 * var(--rem));
  width: calc(246 * var(--rem));
  height: calc(54 * var(--rem));
  margin-top: calc(60 * var(--rem));
  margin-inline: auto;
  padding-left: calc(30 * var(--rem));
  border-radius: calc(27 * var(--rem));
  background-color: var(--color-box);
}

.lp_contents .project-campaign__label--morning .project-campaign__icon {
  display: block;
  overflow: visible;
  flex-shrink: 0;
  width: calc(34 * var(--rem));
  height: auto;
  margin-top: calc(10 * var(--rem));
}

.lp_contents .project-campaign__row--morning {
  justify-content: center;
  gap: calc(77 * var(--rem));
  margin-top: calc(41 * var(--rem));
}

.lp_contents .project-campaign__product--morning1 {
  width: calc(88 * var(--rem));
}

.lp_contents .project-campaign__product--morning2 {
  width: calc(88 * var(--rem));
}

.lp_contents .project-campaign__list--morning {
  margin-top: calc(20 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__plus {
  display: block;
  width: calc(54 * var(--rem));
  margin-top: calc(49 * var(--rem));
  margin-inline: auto;
}

.lp_contents .project-campaign__label-text--night {
  display: block;
  margin-top: calc(8 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.5;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__label--night {
  display: flex;
  align-items: flex-start;
  gap: calc(20 * var(--rem));
  width: calc(246 * var(--rem));
  height: calc(54 * var(--rem));
  margin-top: calc(60 * var(--rem));
  margin-inline: auto;
  padding-left: calc(32 * var(--rem));
  border-radius: calc(27 * var(--rem));
  background-color: var(--color-box);
}

.lp_contents .project-campaign__label--night .project-campaign__icon {
  display: block;
  overflow: visible;
  flex-shrink: 0;
  width: calc(28 * var(--rem));
  height: auto;
  margin-top: calc(9 * var(--rem));
}

.lp_contents .project-campaign__row--night {
  justify-content: center;
  gap: calc(20 * var(--rem));
  margin-top: calc(42 * var(--rem));
}

.lp_contents .project-campaign__product--night1 {
  width: calc(152 * var(--rem));
}

.lp_contents .project-campaign__product--night2 {
  width: calc(88 * var(--rem));
}

.lp_contents .project-campaign__product--night3 {
  width: calc(88 * var(--rem));
}

.lp_contents .project-campaign__product--night4 {
  width: calc(88 * var(--rem));
}

.lp_contents .project-campaign__list--night {
  margin-top: calc(23 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__set {
  display: flow-root;
  width: calc(650 * var(--rem));
  margin-top: calc(61 * var(--rem));
  margin-inline: auto;
  padding-bottom: calc(69 * var(--rem));
  background-color: #fff;
}

.lp_contents .project-campaign__more--1 {
  width: max-content;
  margin-top: calc(67 * var(--rem));
  margin-inline: auto;
}

.lp_contents .component-textlink__label--campaign1-link {
  display: block;
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.875;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__more--1 .component-textlink {
  gap: calc(39 * var(--rem));
}

.lp_contents .project-campaign__more--1 .component-chevron {
  margin-top: calc(15 * var(--rem));
}

.lp_contents .project-campaign__item--1 {
  margin-top: calc(44 * var(--rem));
  padding-bottom: calc(89 * var(--rem));
}

.lp_contents .project-campaign__number--2 {
  top: calc(-37 * var(--rem));
}

.lp_contents .project-campaign__digit--2 {
  display: block;
  margin-top: calc(18 * var(--rem));
  font-family: var(--font-heading);
  font-kerning: auto;
  font-size: calc(64 * var(--rem));
  line-height: .65;
  letter-spacing: .04em;
  text-align: center;
  color: #fff;
  white-space: nowrap;
}

.lp_contents .project-campaign__heading--2 {
  display: flow-root;
  margin-top: calc(88 * var(--rem));
}

.lp_contents .project-campaign__lead--2 {
  display: block;
  font-family: var(--font-base);
  font-size: calc(24 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__title--2 {
  display: block;
  margin-top: calc(17 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(42 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__date {
  margin-top: calc(16 * var(--rem));
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.5;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__more--2 {
  width: max-content;
  margin-top: calc(58 * var(--rem));
  margin-inline: auto;
}

.lp_contents .component-textlink__label--campaign2-link {
  display: block;
  font-family: var(--font-base);
  font-size: calc(28 * var(--rem));
  line-height: 1.875;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-campaign__more--2 .component-textlink {
  gap: calc(39 * var(--rem));
}

.lp_contents .project-campaign__more--2 .component-chevron {
  margin-top: calc(15 * var(--rem));
}

.lp_contents .project-campaign__outro {
  display: flow-root;
  margin-top: calc(60 * var(--rem));
}

.lp_contents .project-campaign__item--2 {
  margin-top: calc(37 * var(--rem));
  padding-bottom: calc(89 * var(--rem));
}

.lp_contents .project-campaign {
  display: flow-root;
  padding-bottom: calc(101 * var(--rem));
  background-color: #fff;
}

.lp_contents .project-campaign__intro {
  display: flow-root;
}

.lp_contents .project-campaign__item {
  display: flow-root;
  position: relative;
  width: calc(690 * var(--rem));
  margin-inline: auto;
  background-color: var(--color-box);
}

.lp_contents .project-campaign__number {
  position: absolute;
  left: 50%;
  display: flow-root;
  width: calc(74 * var(--rem));
  height: calc(74 * var(--rem));
  translate: -50% 0;
  border-radius: 50%;
  background-color: var(--color-line);
}

.lp_contents .project-campaign__row {
  display: flex;
  align-items: flex-start;
}

.lp_contents .project-campaign__product {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.lp_contents .project-campaign__sachet--oil {
  width: calc(88 * var(--rem));
}

.lp_contents .project-campaign__sachet--lotion {
  width: calc(88 * var(--rem));
}

.lp_contents .project-campaign__sachet--cream {
  width: calc(88 * var(--rem));
}

.lp_contents .project-campaign__sachet--cleansing {
  width: calc(83 * var(--rem));
}

.lp_contents .project-campaign__name {
  display: block;
  margin-top: calc(13 * var(--rem));
  font-family: var(--font-label);
  font-size: calc(20 * var(--rem));
  line-height: 1.75;
  letter-spacing: .04em;
  color: var(--color-line);
  white-space: nowrap;
}

.lp_contents .project-campaign__arrow {
  margin-top: calc(59 * var(--rem));
}

.lp_contents .project-campaign__arrow-icon {
  display: block;
  width: calc(10 * var(--rem));
}

.lp_contents .project-rail__lead {
  display: block;
  margin-top: calc(22 * var(--rem-pc));
  font-family: var(--font-copy);
  font-size: calc(20 * var(--rem-pc));
  line-height: 2.7785;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-rail__catch {
  display: block;
  margin-top: calc(-14 * var(--rem-pc));
  font-family: var(--font-copy);
  font-size: calc(28 * var(--rem-pc));
  line-height: 1.9846;
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}

.lp_contents .project-rail {
  display: flow-root;
  width: 100%;
  padding-top: calc(13 * var(--rem-pc));
}

.lp_contents .project-rail__logo {
  display: block;
  width: calc(290 * var(--rem-pc));
  margin-inline: auto;
}

.lp_contents .project-popup {
  position: fixed;
  z-index: var(--z-sticky);
  right: calc(30 * var(--rem));
  bottom: calc(30 * var(--rem));
  width: min(calc(280 * var(--rem)), 36vh);
  transition: opacity var(--duration-switch), visibility var(--duration-switch);
}

.lp_contents .project-popup.is-out {
  opacity: 0;
  visibility: hidden;
}

@media (min-width: 769px) {
  .lp_contents .project-popup {
    right: calc(20 * var(--rem-pc));
    bottom: calc(20 * var(--rem-pc));
    width: min(calc(160 * var(--rem-pc)), 30vh);
  }
}

.lp_contents .project-popup__body {
  border-radius: 50%;
  background-color: #fff;
}

.lp_contents .project-popup__link {
  display: block;
  clip-path: circle(50%);
}

.lp_contents .project-popup__image {
  display: block;
  width: 100%;
}

.lp_contents .project-popup__close {
  position: absolute;
  top: -4.2857%;
  right: 0;
  width: 13.5714%;
  padding: 0;
}

@media (min-width: 769px) {
  .lp_contents .project-popup__close {
    top: -2.5%;
    width: 11.25%;
  }
}

.lp_contents .project-popup__close::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(100%, 44px);
  height: max(100%, 44px);
  translate: -50% -50%;
}

.lp_contents .project-popup__close:focus-visible {
  outline: 2px solid #000;
  outline-offset: 2px;
}

.lp_contents .project-popup__close-icon {
  display: block;
  width: 100%;
  height: auto;
}