@charset "UTF-8";

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

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

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

.p-feature {
  --base-font-color: #57331d;
  --color-accent: #8e6c41;
  --color-gold: #c0a46e;
  --color-rail: #eee8e3;

  --color-bg: #f4f1ee;
  --color-bg-top: #fff;
  --color-footer: #bdb8b5;
  --color-rule: rgb(142 108 65 / .5);
  --ani-spread-mask: linear-gradient(0deg,
      transparent, transparent 40%,
      rgb(0 0 0 / .08) 45%, rgb(0 0 0 / .32) 48.3%, rgb(0 0 0 / .5) 50%,
      rgb(0 0 0 / .68) 51.7%, rgb(0 0 0 / .92) 55%, #000 58.3%, #000);

  --dash: calc(6 * var(--rem));
  --dash-w: calc(2 * var(--rem));

  --color-indicator-on: #bfa46d;
  --color-indicator-off: #fff;

  --lp-font-ja: lato, ryo-gothic-plusn, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, sans-serif;
  --lp-font-en: lato, Verdana, Helvetica, Arial, sans-serif;

  --transition-timing: cubic-bezier(0.51, 0.21, 0.41, 1);
  --letter-spacing: .075em;

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

}

.lp_contents {
  position: relative;
  font-family: var(--lp-font-ja);
  color: var(--base-font-color, #000);
  font-style: normal;
  letter-spacing: var(--letter-spacing);

  & * {
    font-feature-settings: "palt";
  }

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

  & :where(h1, h2, h3, h4, h5, p, ul, ol, li, dl, dt, dd, a, button, figure, figcaption, 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;
  }

  & sup {
    top: 0;
    font-size: .6em;
    vertical-align: super;
  }

  & :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;
    letter-spacing: 0.125em;

    @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;
}

#share {
  right: auto !important;
  left: 5% !important;
}

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

.archive_area {
  z-index: 1;
  position: relative;
}

.share-txt {
  margin-bottom: 0 !important;
  padding-bottom: calc(40 * (100vw / 750));
}

.share-txt span {
  z-index: 1;
  position: relative;
  background: #fff;
}

#footer,
footer,
#FooterWrap {
  z-index: 11;
}

.lp_contents {
  & .u-d-lg {
    @media (max-width: 768px) {
      display: none !important;
    }
  }

  & .u-d-md {
    @media (min-width: 781px) {
      display: none !important;
    }
  }
}

.lp_contents {
  & .accordion__body {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s var(--transition-timing);
  }
}

.lp_contents {
  & .modal {
    position: fixed;
    z-index: var(--z-modal-overlay);
    inset: 0;
    display: none;
    padding-block: calc(30 * var(--rem, 1px));
    background: rgb(0 0 0 / .7);

    &.is-open {
      display: block;
    }
  }

  & .modal_outside {
    width: 100%;
    max-width: calc(670 * var(--rem, 1px));
    height: 100%;
    margin-inline: auto;
    background: #fff;
    overflow: hidden;
  }

  & .modal__body {
    position: relative;
    z-index: var(--z-modal);
    height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;

    &::-webkit-scrollbar {
      display: none;
    }
  }
}

.lp_contents {
  & .ani-spread {
    transition:
      opacity 1s var(--transition-timing) var(--ani-delay, 0s),
      -webkit-mask-position 1.6s linear var(--ani-delay, 0s),
      mask-position 1.6s linear var(--ani-delay, 0s);
  }

  & .ani-fadeup {
    transition:
      opacity 1s ease var(--ani-delay, 0s),
      translate 1s ease var(--ani-delay, 0s);
  }

  & .ani-fadein {
    transition:
      opacity 2s var(--transition-timing) var(--ani-delay, 0s),
      filter 2s var(--transition-timing) var(--ani-delay, 0s);
  }
}

html.js .lp_contents {
  & .ani-spread {
    opacity: 0;
    -webkit-mask-image: var(--ani-spread-mask);
    mask-image: var(--ani-spread-mask);
    -webkit-mask-size: 100% max(300%, 100vh);
    mask-size: 100% max(300%, 100vh);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center 100%;
    mask-position: center 100%;

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

  & .ani-fadeup {
    opacity: 0;
    translate: 0 calc(40 * var(--rem));

    &.is-active {
      opacity: 1;
      translate: 0 0;
    }
  }

  & .ani-fadein {
    opacity: 0;
    filter: blur(calc(5 * var(--rem)));

    &.is-active {
      opacity: 1;
      filter: blur(0);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js .lp_contents {

    & .ani-spread,
    & .ani-fadeup,
    & .ani-fadein {
      opacity: 1;
      translate: 0 0;
      filter: none;
      -webkit-mask-image: none;
      mask-image: none;
      transition: none;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .lp_contents .ani-inview {
    opacity: 1;
    translate: 0 0;
    transition: none;
  }
}

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

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

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

  & .layout-rail {
    display: none;

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

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

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

.lp_contents {
  & .project-mainvisual {
    position: relative;
    margin-top: 0;
    background: var(--color-bg-top);
  }

  & .project-mainvisual__inner {
    position: relative;
  }


  & .project-mainvisual__photo {
    display: block;
    width: calc(780 * var(--rem));
    mask-image: linear-gradient(to bottom, #000 calc(1058 * var(--rem)), transparent calc(1209 * var(--rem)));
  }

  & .project-mainvisual__title {
    position: absolute;
    top: calc(958 * var(--rem));
    left: calc(96 * var(--rem));
    width: calc(588 * var(--rem));
  }

  & .project-mainvisual__lead {
    position: absolute;
    top: calc(1050 * var(--rem));
    left: calc(222 * var(--rem));
    width: calc(336 * var(--rem));
  }
}

.lp_contents {
  & .project-collection1 {
    display: grid;
    justify-items: center;
    background: var(--color-bg-top);

    &::after {
      background: url(../img/project-collection1_bg.png) no-repeat center / 100%;
      background-color: var(--color-bg);
      width: calc(780 * var(--rem));
      height: calc(200 * var(--rem));
      content: "";
      display: block;
      margin-top: calc(57 * var(--rem));
    }
  }

  & .project-collection1__title {
    width: calc(494 * var(--rem));

    & img {
      display: block;
      width: 100%;
    }
  }

  & .project-collection1__date {
    margin-top: calc(43 * var(--rem));
    color: var(--color-accent);
    font-size: calc(28 * var(--rem));
    line-height: 2.2;
    letter-spacing: .1em;
    text-align: center;
    white-space: nowrap;
  }

  & .project-collection1__lineup {
    display: flex;
    align-items: center;
    gap: calc(34 * var(--rem));
    margin-top: calc(83 * var(--rem));
    width: calc(700 * var(--rem));

    & img {
      display: block;
      width: calc(192 * var(--rem));
    }

    &::before,
    &::after {
      flex: 1;
      height: var(--dash-w);
      background: repeating-linear-gradient(to right,
          var(--color-accent) 0 var(--dash), transparent var(--dash) calc(var(--dash) * 2));
      content: "";
    }
  }

  & .project-collection1__item-list {
    display: grid;
    grid-template-columns: repeat(3, calc(220 * var(--rem)));
    column-gap: calc(20 * var(--rem));
    row-gap: calc(35.2 * var(--rem));
    margin-top: calc(79.4 * var(--rem));
  }

  & .project-collection1__item-list__item {
    & a {
      display: grid;
      justify-items: center;
      color: var(--color-accent);
      text-decoration: none;
    }

    & img {
      display: block;
      width: calc(220 * var(--rem));
    }
  }

  & .project-collection1__item-list__name {
    margin-top: calc(25 * var(--rem));
    font-family: var(--lp-font-en);
    font-size: calc(24 * var(--rem));
    line-height: 1.4;
    letter-spacing: .05em;
    text-align: center;
    white-space: nowrap;
  }

  & .project-collection1__look {
    display: grid;
    justify-items: center;
    margin-top: calc(74.6 * var(--rem));
    width: calc(700 * var(--rem));
    border-block: var(--dash-w) solid transparent;
    border-image: repeating-linear-gradient(to right,
        var(--color-accent) 0 var(--dash), transparent var(--dash) calc(var(--dash) * 2)) 2 / var(--dash-w) 0 stretch;

    & a {
      display: block;
      justify-self: start;
      margin-left: calc(211 * var(--rem));
      padding: calc(22 * var(--rem)) 0 calc(23 * var(--rem)) calc(51 * var(--rem));
      background: url("../img/collection1-chevron.jpg") 0 center / calc(40 * var(--rem)) calc(20 * var(--rem)) no-repeat;
      color: var(--color-accent);
      font-family: var(--lp-font-en);
      font-size: calc(32 * var(--rem));
      line-height: 2.0625;
      letter-spacing: .05em;
    }
  }
}

.lp_contents {
  & .component-card-list {
    display: flow-root;
    margin-top: calc(53 * var(--rem));
    padding-bottom: calc(145 * var(--rem));
    width: calc(720 * var(--rem));
    margin-inline: calc(30 * var(--rem));
  }

  & .component-card {
    display: grid;
    justify-items: center;
    margin-top: calc(99 * var(--rem));

    &:not(:last-child)::after {
      margin-top: calc(82 * var(--rem));
      width: calc(600 * var(--rem));
      height: var(--dash-w);
      background: repeating-linear-gradient(to right,
          var(--color-accent) 0 var(--dash), transparent var(--dash) calc(var(--dash) * 2));
      content: "";
    }
  }

  & .component-card__view {
    position: relative;
    width: calc(640 * var(--rem));
    height: calc(480 * var(--rem));
  }

  & .component-card__state {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .6s var(--transition-timing);
    pointer-events: none;

    &.is-current {
      opacity: 1;
      pointer-events: auto;
    }

    & img {
      position: absolute;
      top: 0;
      left: 0;
      width: calc(640 * var(--rem));
    }
  }

  & .component-card__state .component-card__photo {
    left: calc(10 * var(--rem));
    width: calc(620 * var(--rem));
  }

  & .component-card__state .component-card__arch {
    width: calc(177 * var(--rem));
    top: calc(12 * var(--rem));
    left: calc(20 * var(--rem));
  }

  & .component-card__zoom {
    position: absolute;
    top: calc(410 * var(--rem));
    left: calc(560 * var(--rem));
    padding: 0;
    width: calc(70 * var(--rem));
    border: 0;
    background: none;
    cursor: pointer;

    & img {
      display: block;
      width: 100%;
    }
  }

  & .component-card__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(29.6 * var(--rem));
    margin-top: calc(40 * var(--rem));
  }

  & .component-card__arrow {
    padding: 0;
    width: calc(47 * var(--rem));
    border: 0;
    background: none;
    cursor: pointer;
    margin-top: calc(-24 * var(--rem));

    & img {
      display: block;
      width: 100%;
    }
  }

  & .component-card__thumbs {
    display: flex;
    align-items: center;
    gap: calc(29.6 * var(--rem));

    & li {
      display: grid;
      grid-template-rows: calc(80 * var(--rem)) calc(20 * var(--rem)) calc(4 * var(--rem));
      justify-items: center;
      align-items: center;
    }

    & button {
      display: grid;
      grid-row: 1 / 4;
      grid-template-rows: subgrid;
      justify-items: center;
      align-items: center;
      padding: 0;
      width: calc(80 * var(--rem));
      border: 0;
      background: none;
      cursor: pointer;
    }

    & img {
      display: block;
      grid-row: 1;
      width: 100%;
    }

    & button::after {
      grid-row: 3;
      width: calc(50 * var(--rem));
      height: calc(4 * var(--rem));
      background: var(--color-indicator-off);
      content: "";
    }

    & button.is-current::after {
      background: var(--color-indicator-on);
    }
  }

  & .component-card__name {
    margin-top: calc(39 * var(--rem));
    color: var(--color-accent);
    font-size: calc(34 * var(--rem));
    line-height: 1.0625;
    letter-spacing: .1em;
    white-space: nowrap;

    & a {
      color: inherit;
      letter-spacing: .1em;
    }
  }

  & .component-card__price {
    margin-top: calc(31 * var(--rem));
    color: var(--color-accent);
    font-size: calc(28 * var(--rem));
    line-height: 1;
    letter-spacing: .1em;
    white-space: nowrap;
  }

  & .component-card__cta {
    margin-top: calc(40 * var(--rem));
    width: calc(400 * var(--rem));

    & img {
      display: block;
      width: 100%;
    }
  }

  & .component-card__desc {
    margin-top: calc(64 * var(--rem));
    color: var(--color-accent);
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: .1em;
    text-align: center;
    white-space: nowrap;
  }
}

.lp_contents {

  & .project-steiff {
    display: flow-root;
    padding-top: calc(81 * var(--rem));
    padding-bottom: calc(99 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-steiff__block01 {
    display: flow-root;
    margin-top: calc(0 * var(--rem));
    min-height: calc(368 * var(--rem));
  }

  & .project-steiff__deco01 {
    margin-top: calc(0 * var(--rem));
    margin-inline: auto;
    width: calc(521 * var(--rem));
  }

  & .project-steiff__text01 {
    margin-top: calc(49 * var(--rem));
    width: calc(780 * var(--rem));
  }

  & .project-steiff__text01 {
    font-size: calc(28 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-steiff__group01 {
    margin-top: calc(24 * var(--rem));
    margin-inline: auto;
    width: calc(188 * var(--rem));
    position: relative;
    height: calc(98 * var(--rem));
  }

  & .project-steiff__deco02 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(188 * var(--rem));
  }

  & .project-steiff__deco03 {
    position: relative;
    display: block;
    margin-top: calc(40 * var(--rem));
    margin-left: calc(23 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-eyedesigner {
    display: flow-root;
    margin-top: calc(123 * var(--rem));
    height: calc(4424 * var(--rem));
  }

  & .project-eyedesigner__cut {
    display: block;
    margin-top: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
    position: relative;
    height: calc(1040 * var(--rem));
  }

  & .project-eyedesigner__cut img {
    display: block;
    width: 100%;
  }

  & .project-eyedesigner__block01 {
    display: flow-root;
    margin-top: calc(30 * var(--rem));
    height: calc(693 * var(--rem));
  }

  & .project-eyedesigner__deco01 {
    margin-top: calc(0 * var(--rem));
    margin-left: calc(565 * var(--rem));
    width: calc(32 * var(--rem));
  }

  & .project-eyedesigner__pager {
    margin-top: calc(-22 * var(--rem));
    margin-inline: auto;
    width: calc(230 * var(--rem));
    position: relative;
    height: calc(6 * var(--rem));
  }

  & .project-eyedesigner__pager {
    display: flex;
    justify-content: center;
    gap: calc(30 * var(--rem));
  }

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

  & .project-eyedesigner__deco04 {
    margin-top: calc(80 * var(--rem));
    margin-inline: auto;
    width: calc(467 * var(--rem));
  }

  & .project-eyedesigner__deco05 {
    margin-top: calc(31 * var(--rem));
    margin-left: calc(42 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-eyedesigner__text01 {
    margin-top: calc(-46 * var(--rem));
    margin-inline: auto;
    width: calc(402 * var(--rem));
  }

  & .project-eyedesigner__text01 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.125em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__group01 {
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(180 * var(--rem));
    position: relative;
    height: calc(48 * var(--rem));
  }

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

  & .project-eyedesigner__group01>.project-eyedesigner__deco06 {
    position: absolute;
    inset: 0;
  }

  & .project-eyedesigner__text02 {
    position: relative;
    display: block;
    margin-top: calc(9 * var(--rem));
    margin-inline: auto;
    width: calc(180 * var(--rem));
  }

  & .project-eyedesigner__text02 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.125em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco06 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-eyedesigner__group02 {
    margin-top: calc(42 * var(--rem));
    margin-inline: auto;
    width: calc(690 * var(--rem));
    position: relative;
    height: calc(341 * var(--rem));
  }

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

  & .project-eyedesigner__group02>.project-eyedesigner__text03 {
    position: absolute;
    inset: 0;
  }

  & .project-eyedesigner__deco07 {
    position: relative;
    display: block;
    margin-top: calc(305 * var(--rem));
    margin-left: calc(35 * var(--rem));
    width: calc(36 * var(--rem));
  }

  & .project-eyedesigner__text03 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(690 * var(--rem));
  }

  & .project-eyedesigner__text03 {
    font-size: calc(30 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco08 {
    margin-top: calc(-16 * var(--rem));
    margin-left: calc(670 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-eyedesigner__sheet01 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(720 * var(--rem));
  }

  & .project-eyedesigner__sheet01 {
    height: calc(2570 * var(--rem));
  }

  & .project-eyedesigner__photo04 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(50 * var(--rem));
    width: calc(620 * var(--rem));
  }

  & .project-eyedesigner__photo05 {
    position: absolute;
    top: calc(620 * var(--rem));
    left: calc(210 * var(--rem));
    width: calc(80 * var(--rem));
  }

  & .project-eyedesigner__photo06 {
    position: absolute;
    top: calc(620 * var(--rem));
    left: calc(430 * var(--rem));
    width: calc(80 * var(--rem));
  }

  & .project-eyedesigner__deco09 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(225 * var(--rem));
    width: calc(50 * var(--rem));
  }

  & .project-eyedesigner__deco10 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(335 * var(--rem));
    width: calc(50 * var(--rem));
  }

  & .project-eyedesigner__deco11 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(445 * var(--rem));
    width: calc(50 * var(--rem));
  }

  & .project-eyedesigner__photo07 {
    position: absolute;
    top: calc(660 * var(--rem));
    left: calc(320 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo08 {
    position: absolute;
    top: calc(624 * var(--rem));
    left: calc(320 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo09 {
    position: absolute;
    top: calc(624 * var(--rem));
    left: calc(347 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo10 {
    position: absolute;
    top: calc(660 * var(--rem));
    left: calc(347 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo11 {
    position: absolute;
    top: calc(624 * var(--rem));
    left: calc(373 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo12 {
    position: absolute;
    top: calc(660 * var(--rem));
    left: calc(373 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__text04 {
    position: absolute;
    top: calc(640 * var(--rem));
    left: calc(347 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text04 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text05 {
    position: absolute;
    top: calc(675 * var(--rem));
    left: calc(320 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text05 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text06 {
    position: absolute;
    top: calc(675 * var(--rem));
    left: calc(347 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text06 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text07 {
    position: absolute;
    top: calc(640 * var(--rem));
    left: calc(320 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text07 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text08 {
    position: absolute;
    top: calc(640 * var(--rem));
    left: calc(374 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text08 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text09 {
    position: absolute;
    top: calc(675 * var(--rem));
    left: calc(374 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text09 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco12 {
    position: absolute;
    top: calc(568 * var(--rem));
    left: calc(259 * var(--rem));
    width: calc(205 * var(--rem));
  }

  & .project-eyedesigner__photo13 {
    position: absolute;
    top: calc(1360 * var(--rem));
    left: calc(50 * var(--rem));
    width: calc(620 * var(--rem));
  }

  & .project-eyedesigner__photo14 {
    position: absolute;
    top: calc(1880 * var(--rem));
    left: calc(210 * var(--rem));
    width: calc(80 * var(--rem));
  }

  & .project-eyedesigner__photo15 {
    position: absolute;
    top: calc(1880 * var(--rem));
    left: calc(430 * var(--rem));
    width: calc(80 * var(--rem));
  }

  & .project-eyedesigner__deco13 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(225 * var(--rem));
    width: calc(50 * var(--rem));
  }

  & .project-eyedesigner__deco14 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(335 * var(--rem));
    width: calc(50 * var(--rem));
  }

  & .project-eyedesigner__deco15 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(445 * var(--rem));
    width: calc(50 * var(--rem));
  }

  & .project-eyedesigner__photo16 {
    position: absolute;
    top: calc(1920 * var(--rem));
    left: calc(320 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo17 {
    position: absolute;
    top: calc(1884 * var(--rem));
    left: calc(320 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo18 {
    position: absolute;
    top: calc(1884 * var(--rem));
    left: calc(347 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo19 {
    position: absolute;
    top: calc(1920 * var(--rem));
    left: calc(347 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo20 {
    position: absolute;
    top: calc(1884 * var(--rem));
    left: calc(373 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__photo21 {
    position: absolute;
    top: calc(1920 * var(--rem));
    left: calc(373 * var(--rem));
    width: calc(27 * var(--rem));
  }

  & .project-eyedesigner__text10 {
    position: absolute;
    top: calc(1900 * var(--rem));
    left: calc(347 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text10 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text11 {
    position: absolute;
    top: calc(1935 * var(--rem));
    left: calc(320 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text11 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text12 {
    position: absolute;
    top: calc(1935 * var(--rem));
    left: calc(347 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text12 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text13 {
    position: absolute;
    top: calc(1900 * var(--rem));
    left: calc(320 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text13 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text14 {
    position: absolute;
    top: calc(1900 * var(--rem));
    left: calc(374 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text14 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text15 {
    position: absolute;
    top: calc(1935 * var(--rem));
    left: calc(374 * var(--rem));
    width: calc(26 * var(--rem));
  }

  & .project-eyedesigner__text15 {
    font-size: calc(4.74 * var(--rem));
    line-height: 1.1414;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco16 {
    position: absolute;
    top: calc(1828 * var(--rem));
    left: calc(259 * var(--rem));
    width: calc(205 * var(--rem));
  }

  & .project-eyedesigner__sheet02 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__sheet02 {
    height: calc(480 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-eyedesigner__photo22 {
    position: absolute;
    top: calc(380 * var(--rem));
    left: calc(135 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo23 {
    position: absolute;
    top: calc(180 * var(--rem));
    left: calc(135 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo24 {
    position: absolute;
    top: calc(180 * var(--rem));
    left: calc(285 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo25 {
    position: absolute;
    top: calc(380 * var(--rem));
    left: calc(285 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo26 {
    position: absolute;
    top: calc(180 * var(--rem));
    left: calc(435 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo27 {
    position: absolute;
    top: calc(380 * var(--rem));
    left: calc(435 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text16 {
    position: absolute;
    top: calc(267 * var(--rem));
    left: calc(293 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text16 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text17 {
    position: absolute;
    top: calc(467 * var(--rem));
    left: calc(143 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text17 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text18 {
    position: absolute;
    top: calc(467 * var(--rem));
    left: calc(293 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text18 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text19 {
    position: absolute;
    top: calc(267 * var(--rem));
    left: calc(143 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text19 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text20 {
    position: absolute;
    top: calc(267 * var(--rem));
    left: calc(443 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text20 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text21 {
    position: absolute;
    top: calc(467 * var(--rem));
    left: calc(443 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text21 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco17 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(225 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco18 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(335 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco19 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(445 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco20 {
    position: absolute;
    top: calc(1665 * var(--rem));
    left: calc(435 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco21 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(225 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco22 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(335 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco23 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(445 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__sheet03 {
    position: absolute;
    top: calc(1360 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__sheet03 {
    height: calc(480 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-eyedesigner__photo28 {
    position: absolute;
    top: calc(1640 * var(--rem));
    left: calc(135 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo29 {
    position: absolute;
    top: calc(1440 * var(--rem));
    left: calc(135 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo30 {
    position: absolute;
    top: calc(1640 * var(--rem));
    left: calc(435 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo31 {
    position: absolute;
    top: calc(1440 * var(--rem));
    left: calc(285 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo32 {
    position: absolute;
    top: calc(1640 * var(--rem));
    left: calc(285 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__photo33 {
    position: absolute;
    top: calc(1440 * var(--rem));
    left: calc(435 * var(--rem));
    width: calc(150 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text22 {
    position: absolute;
    top: calc(1527 * var(--rem));
    left: calc(143 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text22 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text23 {
    position: absolute;
    top: calc(1527 * var(--rem));
    left: calc(443 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text23 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text24 {
    position: absolute;
    top: calc(1527 * var(--rem));
    left: calc(293 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text24 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text25 {
    position: absolute;
    top: calc(1727 * var(--rem));
    left: calc(143 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text25 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text26 {
    position: absolute;
    top: calc(1727 * var(--rem));
    left: calc(293 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text26 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text27 {
    position: absolute;
    top: calc(1727 * var(--rem));
    left: calc(443 * var(--rem));
    width: calc(133 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text27 {
    font-size: calc(24 * var(--rem));
    line-height: 1.1429;
    letter-spacing: 0.035em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__sheet04 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__sheet04 {
    height: calc(480 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-eyedesigner__photo34 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(50 * var(--rem));
    width: calc(620 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco24 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco25 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(225 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco26 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(335 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco27 {
    position: absolute;
    top: calc(720 * var(--rem));
    left: calc(445 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__sheet05 {
    position: absolute;
    top: calc(1360 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__sheet05 {
    height: calc(480 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-eyedesigner__photo35 {
    position: absolute;
    top: calc(1360 * var(--rem));
    left: calc(50 * var(--rem));
    width: calc(620 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco28 {
    position: absolute;
    top: calc(1360 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco29 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(225 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco30 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(335 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__deco31 {
    position: absolute;
    top: calc(1980 * var(--rem));
    left: calc(445 * var(--rem));
    width: calc(50 * var(--rem));
    opacity: 0;
  }

  & .project-eyedesigner__text29 {
    position: relative;
    display: block;
    margin-top: calc(763 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-eyedesigner__text29 {
    font-size: calc(34 * var(--rem));
    line-height: 1.0588;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text28 {
    position: relative;
    display: block;
    margin-top: calc(29 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-eyedesigner__text28 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco33 {
    position: relative;
    display: block;
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(400 * var(--rem));
  }

  & .project-eyedesigner__text30 {
    position: relative;
    display: block;
    margin-top: calc(64 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-eyedesigner__text30 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco32 {
    position: relative;
    display: block;
    margin-top: calc(84.6 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-eyedesigner__text32 {
    position: relative;
    display: block;
    margin-top: calc(762 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-eyedesigner__text32 {
    font-size: calc(34 * var(--rem));
    line-height: 1.0588;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__text31 {
    position: relative;
    display: block;
    margin-top: calc(29 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-eyedesigner__text31 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco34 {
    position: relative;
    display: block;
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(400 * var(--rem));
  }

  & .project-eyedesigner__text33 {
    position: relative;
    display: block;
    margin-top: calc(64 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-eyedesigner__text33 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-eyedesigner__deco35 {
    position: absolute;
    top: calc(652 * var(--rem));
    left: calc(134 * var(--rem));
    width: calc(47 * var(--rem));
  }

  & .project-eyedesigner__deco36 {
    position: absolute;
    top: calc(652 * var(--rem));
    left: calc(539 * var(--rem));
    width: calc(47 * var(--rem));
  }

  & .project-eyedesigner__deco37 {
    position: absolute;
    top: calc(510 * var(--rem));
    left: calc(600 * var(--rem));
    width: calc(70 * var(--rem));
  }

  & .project-eyedesigner__deco38 {
    position: absolute;
    top: calc(1912 * var(--rem));
    left: calc(134 * var(--rem));
    width: calc(47 * var(--rem));
  }

  & .project-eyedesigner__deco39 {
    position: absolute;
    top: calc(1912 * var(--rem));
    left: calc(539 * var(--rem));
    width: calc(47 * var(--rem));
  }

  & .project-eyedesigner__deco40 {
    position: absolute;
    top: calc(1770 * var(--rem));
    left: calc(600 * var(--rem));
    width: calc(70 * var(--rem));
  }

  & .project-blush {
    display: flow-root;
    margin-top: calc(100 * var(--rem));
    height: calc(3430 * var(--rem));
  }

  & .project-blush__cut {
    display: block;
    margin-top: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
    position: relative;
    height: calc(1040 * var(--rem));
  }

  & .project-blush__cut img {
    display: block;
    width: 100%;
  }

  & .project-blush__block01 {
    display: flow-root;
    margin-top: calc(40 * var(--rem));
    height: calc(692 * var(--rem));
  }

  & .project-blush__pager {
    margin-top: calc(0 * var(--rem));
    margin-inline: auto;
    width: calc(230 * var(--rem));
    position: relative;
    height: calc(6 * var(--rem));
  }

  & .project-blush__pager {
    display: flex;
    justify-content: center;
    gap: calc(30 * var(--rem));
  }

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

  & .project-blush__deco03 {
    margin-top: calc(7 * var(--rem));
    margin-left: calc(580 * var(--rem));
    width: calc(32 * var(--rem));
  }

  & .project-blush__deco04 {
    margin-top: calc(61 * var(--rem));
    margin-left: calc(98 * var(--rem));
    width: calc(588 * var(--rem));
  }

  & .project-blush__text01 {
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(402 * var(--rem));
  }

  & .project-blush__text01 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.125em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__deco05 {
    margin-top: calc(37 * var(--rem));
    margin-left: calc(56 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-blush__group01 {
    margin-top: calc(-52 * var(--rem));
    margin-inline: auto;
    width: calc(180 * var(--rem));
    position: relative;
    height: calc(48 * var(--rem));
  }

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

  & .project-blush__group01>.project-blush__deco06 {
    position: absolute;
    inset: 0;
  }

  & .project-blush__text02 {
    position: relative;
    display: block;
    margin-top: calc(9 * var(--rem));
    margin-inline: auto;
    width: calc(180 * var(--rem));
  }

  & .project-blush__text02 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.125em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__deco06 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-blush__group02 {
    margin-top: calc(42 * var(--rem));
    margin-inline: auto;
    width: calc(690 * var(--rem));
    position: relative;
    height: calc(338 * var(--rem));
  }

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

  & .project-blush__group02>.project-blush__text03 {
    position: absolute;
    inset: 0;
  }

  & .project-blush__deco07 {
    position: relative;
    display: block;
    margin-top: calc(159 * var(--rem));
    margin-left: calc(630 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-blush__deco08 {
    position: relative;
    display: block;
    margin-top: calc(88 * var(--rem));
    margin-left: calc(35 * var(--rem));
    width: calc(36 * var(--rem));
  }

  & .project-blush__text03 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(690 * var(--rem));
  }

  & .project-blush__text03 {
    font-size: calc(30 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__block02 {
    display: flow-root;
    margin-top: calc(94 * var(--rem));
    height: calc(1564 * var(--rem));
  }

  & .project-blush__plate {
    margin-top: calc(0 * var(--rem));
    margin-inline: auto;
    width: calc(720 * var(--rem));
    position: relative;
    height: calc(1564 * var(--rem));
  }

  & .project-blush__sheet01 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(720 * var(--rem));
  }

  & .project-blush__sheet01 {
    height: calc(1564 * var(--rem));
  }

  & .project-blush__photo04 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(110 * var(--rem));
    width: calc(500 * var(--rem));
  }

  & .project-blush__text04 {
    position: absolute;
    top: calc(968 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text04 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__text05 {
    position: absolute;
    top: calc(903 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text05 {
    font-size: calc(34 * var(--rem));
    line-height: 1.0588;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__text06 {
    position: absolute;
    top: calc(1200 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text06 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__deco12 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(140 * var(--rem));
    width: calc(210 * var(--rem));
  }

  & .project-blush__sheet02 {
    position: absolute;
    top: calc(44 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
  }

  & .project-blush__sheet02 {
    height: calc(656 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-blush__sheet03 {
    position: absolute;
    top: calc(904 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
  }

  & .project-blush__sheet03 {
    height: calc(510 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-blush__photo08 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(110 * var(--rem));
    width: calc(500 * var(--rem));
  }

  & .project-blush__deco13 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(140 * var(--rem));
    width: calc(210 * var(--rem));
  }

  & .project-blush__text07 {
    position: absolute;
    top: calc(1200 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text07 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__text08 {
    position: absolute;
    top: calc(903 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text08 {
    font-size: calc(34 * var(--rem));
    line-height: 1.0588;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__sheet04 {
    position: absolute;
    top: calc(904 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
  }

  & .project-blush__sheet04 {
    height: calc(510 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-blush__sheet05 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
  }

  & .project-blush__sheet05 {
    height: calc(600 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-blush__photo12 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(110 * var(--rem));
    width: calc(500 * var(--rem));
  }

  & .project-blush__deco17 {
    position: absolute;
    top: calc(120 * var(--rem));
    left: calc(110 * var(--rem));
    width: calc(500 * var(--rem));
  }

  & .project-blush__text09 {
    position: absolute;
    top: calc(968 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text09 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__text10 {
    position: absolute;
    top: calc(903 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text10 {
    font-size: calc(34 * var(--rem));
    line-height: 1.0588;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__text11 {
    position: absolute;
    top: calc(1200 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text11 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__deco21 {
    position: absolute;
    top: calc(1036 * var(--rem));
    left: calc(160 * var(--rem));
    width: calc(400 * var(--rem));
  }

  & .project-blush__text12 {
    position: absolute;
    top: calc(968 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-blush__text12 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-blush__plate__nav {
    position: absolute;
    top: calc(760 * var(--rem));
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(29.6 * var(--rem));
    width: 100%;
  }

  & .project-blush__plate__nav .component-card__thumbs {
    gap: calc(29.6 * var(--rem));
  }

  & .project-blush__plate__nav .component-card__thumbs li {
    grid-template-rows: calc(80 * var(--rem)) calc(20 * var(--rem)) calc(4 * var(--rem));
  }

  & .project-brushkit {
    display: flow-root;
    margin-top: calc(100 * var(--rem));
    height: calc(4358 * var(--rem));
  }

  & .project-brushkit__cut {
    display: block;
    margin-top: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
    position: relative;
    height: calc(1040 * var(--rem));
  }

  & .project-brushkit__photo01 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
  }

  & .project-brushkit__block01 {
    display: flow-root;
    margin-top: calc(90 * var(--rem));
    height: calc(522 * var(--rem));
  }

  & .project-brushkit__deco01 {
    margin-top: calc(0 * var(--rem));
    margin-left: calc(660 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-brushkit__deco02 {
    margin-top: calc(-45 * var(--rem));
    margin-inline: auto;
    width: calc(347 * var(--rem));
  }

  & .project-brushkit__text01 {
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(402 * var(--rem));
  }

  & .project-brushkit__text01 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.125em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__deco03 {
    margin-top: calc(-8 * var(--rem));
    margin-left: calc(90 * var(--rem));
    width: calc(32 * var(--rem));
  }

  & .project-brushkit__group01 {
    margin-top: calc(16 * var(--rem));
    margin-inline: auto;
    width: calc(180 * var(--rem));
    position: relative;
    height: calc(48 * var(--rem));
  }

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

  & .project-brushkit__group01>.project-brushkit__deco04 {
    position: absolute;
    inset: 0;
  }

  & .project-brushkit__text02 {
    position: relative;
    display: block;
    margin-top: calc(9 * var(--rem));
    margin-inline: auto;
    width: calc(180 * var(--rem));
  }

  & .project-brushkit__text02 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.125em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__deco04 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-brushkit__group02 {
    margin-top: calc(42 * var(--rem));
    margin-left: calc(45 * var(--rem));
    width: calc(701 * var(--rem));
    position: relative;
    height: calc(264 * var(--rem));
  }

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

  & .project-brushkit__group02>.project-brushkit__text03 {
    position: absolute;
    inset: 0;
  }

  & .project-brushkit__deco05 {
    position: relative;
    display: block;
    margin-top: calc(102 * var(--rem));
    margin-left: calc(665 * var(--rem));
    width: calc(36 * var(--rem));
  }

  & .project-brushkit__text03 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(690 * var(--rem));
  }

  & .project-brushkit__text03 {
    font-size: calc(30 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__deco06 {
    margin-top: calc(-2 * var(--rem));
    margin-left: calc(40 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-brushkit__block02 {
    display: flow-root;
    margin-top: calc(49 * var(--rem));
    height: calc(2604 * var(--rem));
  }

  & .project-brushkit__plate {
    margin-top: calc(0 * var(--rem));
    margin-inline: auto;
    width: calc(720 * var(--rem));
    position: relative;
    height: calc(2604 * var(--rem));
  }

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

  & .project-brushkit__plate>.project-brushkit__sheet01 {
    position: absolute;
    inset: 0;
  }

  & .project-brushkit__sheet01 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(720 * var(--rem));
  }

  & .project-brushkit__sheet01 {
    height: calc(2604 * var(--rem));
  }

  & .project-brushkit__photo03 {
    position: relative;
    display: block;
    margin-top: calc(100 * var(--rem));
    margin-inline: auto;
    width: calc(451 * var(--rem));
  }

  & .project-brushkit__photo03 img {
    display: block;
    width: 100%;
  }

  & .project-brushkit__text04 {
    position: relative;
    display: block;
    margin-top: calc(39 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__text04 {
    font-size: calc(34 * var(--rem));
    line-height: 1.0588;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__text06 {
    position: relative;
    display: block;
    margin-top: calc(29 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__text06 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__deco08 {
    position: relative;
    display: block;
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(400 * var(--rem));
  }

  & .project-brushkit__deco08 img {
    display: block;
    width: 100%;
  }

  & .project-brushkit__deco07 {
    position: relative;
    display: block;
    margin-top: calc(99 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__photo04 {
    position: relative;
    display: block;
    margin-top: calc(99 * var(--rem));
    margin-inline: auto;
    width: calc(500 * var(--rem));
  }

  & .project-brushkit__text07 {
    position: relative;
    display: block;
    margin-top: calc(20 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__text07 {
    font-size: calc(34 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.05em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__text05 {
    position: relative;
    display: block;
    margin-top: calc(3.2 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__text05 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__photo06 {
    position: relative;
    display: block;
    margin-top: calc(85.4 * var(--rem));
    margin-inline: auto;
    width: calc(500 * var(--rem));
  }

  & .project-brushkit__text09 {
    position: relative;
    display: block;
    margin-top: calc(20 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__text09 {
    font-size: calc(34 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.05em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__text08 {
    position: relative;
    display: block;
    margin-top: calc(3.2 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__text08 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__photo05 {
    position: relative;
    display: block;
    margin-top: calc(85.2 * var(--rem));
    margin-inline: auto;
    width: calc(500 * var(--rem));
  }

  & .project-brushkit__text11 {
    position: relative;
    display: block;
    margin-top: calc(20 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__text11 {
    font-size: calc(34 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.05em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-brushkit__text10 {
    position: relative;
    display: block;
    margin-top: calc(3.2 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-brushkit__text10 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-keyring {
    display: flow-root;
    margin-top: calc(100 * var(--rem));
    height: calc(3147 * var(--rem));
  }

  & .project-keyring__cut {
    display: block;
    margin-top: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
    position: relative;
    height: calc(1040 * var(--rem));
  }

  & .project-keyring__photo01 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
  }

  & .project-keyring__block01 {
    display: flow-root;
    margin-top: calc(42 * var(--rem));
    height: calc(746 * var(--rem));
  }

  & .project-keyring__deco01 {
    margin-top: calc(0 * var(--rem));
    margin-left: calc(650 * var(--rem));
    width: calc(32 * var(--rem));
  }

  & .project-keyring__deco02 {
    margin-top: calc(26 * var(--rem));
    margin-inline: auto;
    width: calc(605 * var(--rem));
  }

  & .project-keyring__text01 {
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(690 * var(--rem));
  }

  & .project-keyring__text01 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.125em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-keyring__group01 {
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(180 * var(--rem));
    position: relative;
    height: calc(48 * var(--rem));
  }

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

  & .project-keyring__group01>.project-keyring__deco03 {
    position: absolute;
    inset: 0;
  }

  & .project-keyring__text02 {
    position: relative;
    display: block;
    margin-top: calc(9 * var(--rem));
    margin-inline: auto;
    width: calc(180 * var(--rem));
  }

  & .project-keyring__text02 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.125em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-keyring__deco03 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-keyring__deco04 {
    margin-top: calc(-34 * var(--rem));
    margin-left: calc(50 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-keyring__group02 {
    margin-top: calc(21 * var(--rem));
    margin-inline: auto;
    width: calc(690 * var(--rem));
    position: relative;
    height: calc(330 * var(--rem));
  }

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

  & .project-keyring__group02>.project-keyring__text03 {
    position: absolute;
    inset: 0;
  }

  & .project-keyring__deco05 {
    position: relative;
    display: block;
    margin-top: calc(154 * var(--rem));
    margin-left: calc(625 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-keyring__text03 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(690 * var(--rem));
  }

  & .project-keyring__text03 {
    font-size: calc(30 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-keyring__deco06 {
    margin-top: calc(-16 * var(--rem));
    margin-left: calc(50 * var(--rem));
    width: calc(36 * var(--rem));
  }

  & .project-keyring__block02 {
    display: flow-root;
    margin-top: calc(82 * var(--rem));
    height: calc(1237 * var(--rem));
  }

  & .project-keyring__plate {
    margin-top: calc(0 * var(--rem));
    margin-inline: auto;
    width: calc(720 * var(--rem));
    position: relative;
    height: calc(1237 * var(--rem));
  }

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

  & .project-keyring__plate>.project-keyring__sheet01 {
    position: absolute;
    inset: 0;
  }

  & .project-keyring__sheet01 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(720 * var(--rem));
  }

  & .project-keyring__sheet01 {
    height: calc(1237 * var(--rem));
  }

  & .project-keyring__photo05 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(110 * var(--rem));
    width: calc(500 * var(--rem));
  }

  & .project-keyring__sheet02 {
    position: absolute;
    top: calc(40 * var(--rem));
    left: calc(40 * var(--rem));
    width: calc(640 * var(--rem));
  }

  & .project-keyring__sheet02 {
    height: calc(764 * var(--rem));
    background: var(--color-bg-top);
  }

  & .project-keyring__photo08 {
    position: absolute;
    top: calc(100 * var(--rem));
    left: calc(110 * var(--rem));
    width: calc(500 * var(--rem));
  }

  & .project-keyring__text04 {
    position: absolute;
    top: calc(796 * var(--rem));
    left: calc(60 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-keyring__text04 {
    font-size: calc(34 * var(--rem));
    line-height: 1.5;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-keyring__text05 {
    position: relative;
    display: block;
    margin-top: calc(919 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-keyring__text05 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-keyring__deco11 {
    position: relative;
    display: block;
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(400 * var(--rem));
  }

  & .project-keyring__deco11 img {
    display: block;
    width: 100%;
  }

  & .project-keyring__plate__nav {
    position: absolute;
    top: calc(660 * var(--rem));
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(34.5 * var(--rem));
    width: 100%;
  }

  & .project-keyring__plate__nav .component-card__thumbs {
    gap: calc(34.5 * var(--rem));
  }

  & .project-keyring__plate__nav .component-card__thumbs li {
    grid-template-rows: calc(80 * var(--rem)) calc(20 * var(--rem)) calc(4 * var(--rem));
  }

  & .project-pouch {
    display: flow-root;
    margin-top: calc(149.6 * var(--rem));
    height: calc(1607.4 * var(--rem));
  }

  & .project-pouch__deco01 {
    margin-top: calc(0 * var(--rem));
    margin-left: calc(313 * var(--rem));
    width: calc(150 * var(--rem));
  }

  & .project-pouch__block01 {
    display: flow-root;
    margin-top: calc(24 * var(--rem));
    height: calc(533.37 * var(--rem));
  }

  & .project-pouch__deco02 {
    margin-top: calc(0 * var(--rem));
    margin-left: calc(241 * var(--rem));
    width: calc(300 * var(--rem));
  }

  & .project-pouch__group01 {
    margin-top: calc(40 * var(--rem));
    margin-left: calc(165 * var(--rem));
    width: calc(467 * var(--rem));
    position: relative;
    height: calc(450 * var(--rem));
  }

  & .project-pouch__photos {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(450 * var(--rem));
  }

  & .project-pouch__photos img {
    display: block;
    width: 100%;
  }

  & .project-pouch__deco03 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(435 * var(--rem));
    width: calc(32 * var(--rem));
  }

  & .project-pouch__deco05 {
    margin-top: calc(-418 * var(--rem));
    margin-left: calc(110 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-pouch__deco06 {
    margin-top: calc(235 * var(--rem));
    margin-left: calc(70 * var(--rem));
    width: calc(36 * var(--rem));
  }

  & .project-pouch__deco07 {
    margin-top: calc(14 * var(--rem));
    margin-left: calc(640 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-pouch__text01 {
    margin-top: calc(67 * var(--rem));
    margin-inline: auto;
    width: calc(690 * var(--rem));
  }

  & .project-pouch__text01 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-pouch__text02 {
    margin-top: calc(25 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-pouch__text02 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-pouch__group02 {
    margin-top: calc(60 * var(--rem));
    margin-inline: auto;
    width: calc(400 * var(--rem));
    position: relative;
    height: calc(100 * var(--rem));
  }

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

  & .project-pouch__group02>.project-pouch__deco08 {
    position: absolute;
    inset: 0;
  }

  & .project-pouch__text03 {
    position: relative;
    display: block;
    margin-top: calc(17 * var(--rem));
    margin-left: calc(40 * var(--rem));
    width: calc(275 * var(--rem));
  }

  & .project-pouch__text03 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-pouch__deco08 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(400 * var(--rem));
  }

  & .project-pouch__group03 {
    margin-top: calc(80 * var(--rem));
    margin-inline: auto;
    width: calc(660 * var(--rem));
    position: relative;
    height: calc(318 * var(--rem));
  }

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

  & .project-pouch__group03>.project-pouch__deco09 {
    position: absolute;
    inset: 0;
  }

  & .project-pouch__deco09 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(660 * var(--rem));
  }

  & .project-pouch__text04 {
    position: relative;
    display: block;
    margin-top: calc(44 * var(--rem));
    margin-inline: auto;
    width: calc(580 * var(--rem));
  }

  & .project-pouch__text04 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-pouch__text05 {
    margin-top: calc(48 * var(--rem));
    margin-inline: auto;
    width: calc(690 * var(--rem));
  }

  & .project-pouch__text05 {
    font-size: calc(24 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.1em;
    color: #c0a46e;
    text-align: center;
    white-space: nowrap;
  }

  & .project-shopper {
    display: flow-root;
    margin-top: calc(161.6 * var(--rem));
    height: calc(1272.4 * var(--rem));
  }

  & .project-shopper__deco01 {
    margin-top: calc(0 * var(--rem));
    margin-left: calc(313 * var(--rem));
    width: calc(150 * var(--rem));
  }

  & .project-shopper__block01 {
    display: flow-root;
    margin-top: calc(23 * var(--rem));
    height: calc(536.37 * var(--rem));
  }

  & .project-shopper__deco02 {
    margin-top: calc(0 * var(--rem));
    margin-left: calc(193 * var(--rem));
    width: calc(397 * var(--rem));
  }

  & .project-shopper__group01 {
    margin-top: calc(40 * var(--rem));
    margin-left: calc(165 * var(--rem));
    width: calc(467 * var(--rem));
    position: relative;
    height: calc(450 * var(--rem));
  }

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

  & .project-shopper__group01 .project-shopper__photo01 {
    position: absolute;
    inset: 0;
  }

  & .project-shopper__deco03 {
    position: relative;
    display: block;
    margin-top: calc(0 * var(--rem));
    margin-left: calc(435 * var(--rem));
    width: calc(32 * var(--rem));
  }

  & .project-shopper__photo01 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(450 * var(--rem));
  }

  & .project-shopper__deco04 {
    margin-top: calc(-418 * var(--rem));
    margin-left: calc(110 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-shopper__deco05 {
    margin-top: calc(224 * var(--rem));
    margin-left: calc(70 * var(--rem));
    width: calc(36 * var(--rem));
  }

  & .project-shopper__deco06 {
    margin-top: calc(14 * var(--rem));
    margin-left: calc(650 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-shopper__text01 {
    margin-top: calc(68 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-shopper__text01 {
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-shopper__text02 {
    margin-top: calc(24 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-shopper__text02 {
    font-size: calc(28 * var(--rem));
    line-height: 1.0;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-shopper__text03 {
    margin-top: calc(42 * var(--rem));
    margin-inline: auto;
    width: calc(690 * var(--rem));
  }

  & .project-shopper__text03 {
    font-size: calc(30 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-shopper__text04 {
    margin-top: calc(50 * var(--rem));
    margin-inline: auto;
    width: calc(690 * var(--rem));
  }

  & .project-shopper__text04 {
    font-size: calc(24 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.1em;
    color: #c0a46e;
    text-align: center;
    white-space: nowrap;
  }

  & .project-collection2 {
    display: flow-root;
    margin-top: calc(352 * var(--rem));
    height: calc(673 * var(--rem));
  }

  & .project-collection2::before {
    position: absolute;
    top: calc(-158 * var(--rem));
    left: calc(-243 * var(--rem));
    z-index: 0;
    width: calc(100% + 486 * var(--rem));
    height: calc(1050 * var(--rem));
    border-radius: 50% / calc(519 * var(--rem));
    background: var(--color-bg-top);
    filter: blur(calc(14 * var(--rem)));
    content: "";
  }

  & .project-collection2>* {
    position: relative;
    z-index: var(--z-base);
  }

  & .project-collection2__block01 {
    display: flow-root;
    margin-top: calc(0 * var(--rem));
    height: calc(673 * var(--rem));
  }

  & .project-collection2__deco01 {
    margin-top: calc(0 * var(--rem));
    margin-inline: auto;
    width: calc(548 * var(--rem));
  }

  & .project-collection2__text01 {
    margin-top: calc(43 * var(--rem));
    margin-inline: auto;
    width: calc(500 * var(--rem));
  }

  & .project-collection2__text01 {
    font-size: calc(28 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-collection2__deco02 {
    margin-top: calc(83 * var(--rem));
    margin-left: calc(293 * var(--rem));
    width: calc(192 * var(--rem));
  }

  & .project-collection2__deco03 {
    margin-top: calc(-21 * var(--rem));
    margin-left: calc(520 * var(--rem));
    width: calc(220 * var(--rem));
  }

  & .project-collection2__deco04 {
    margin-top: calc(-2 * var(--rem));
    margin-left: calc(40 * var(--rem));
    width: calc(220 * var(--rem));
  }

  & .project-collection2__group01 {
    opacity: 0.4;
    margin-top: calc(99 * var(--rem));
    margin-inline: auto;
    width: calc(660 * var(--rem));
    position: relative;
    height: calc(180 * var(--rem));
  }

  & .project-collection2__group01 {
    display: grid;
    grid-template-columns: calc(191 * var(--rem)) calc(185 * var(--rem)) calc(164 * var(--rem)) calc(120 * var(--rem));
    padding: calc(0 * var(--rem)) 0 0 calc(0 * var(--rem));
  }

  & .project-collection2__group01>.project-collection2__deco05 {
    position: absolute;
    inset: 0;
  }

  & .project-collection2__photo05 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(147 * var(--rem));
  }

  & .project-collection2__photo03 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(140 * var(--rem));
  }

  & .project-collection2__photo01 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(120 * var(--rem));
  }

  & .project-collection2__photo02 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(120 * var(--rem));
  }

  & .project-collection2__deco05 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(660 * var(--rem));
  }

  & .project-collection2__text02 {
    margin-top: calc(29 * var(--rem));
    margin-inline: auto;
    width: calc(600 * var(--rem));
  }

  & .project-collection2__text02 {
    font-size: calc(34 * var(--rem));
    line-height: 1.0588;
    letter-spacing: 0.1em;
    color: #c0a46e;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look {
    display: flow-root;
    margin-top: calc(410.6 * var(--rem));
    padding-bottom: calc(118 * var(--rem));
  }

  & .project-look__deco01 {
    margin-top: calc(0 * var(--rem));
    margin-inline: auto;
    width: calc(762 * var(--rem));
  }

  & .project-look__look1-main {
    margin-top: calc(100 * var(--rem));
    width: calc(780 * var(--rem));
    position: relative;
    height: calc(1120 * var(--rem));
  }

  & .project-look__look1-main {
    display: flow-root;
  }

  & .project-look__look1-main>.project-look__photo01 {
    position: absolute;
    inset: 0;
  }

  & .project-look__photo01 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
  }

  & .project-look__deco02 {
    position: relative;
    display: block;
    margin-top: calc(30 * var(--rem));
    margin-left: calc(30 * var(--rem));
    width: calc(61 * var(--rem));
  }

  & .project-look__look1-sub01 {
    margin-top: calc(60 * var(--rem));
    margin-left: calc(40 * var(--rem));
    width: calc(540 * var(--rem));
    position: relative;
    height: calc(720 * var(--rem));
  }

  & .project-look__photo03 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(540 * var(--rem));
  }

  & .project-look__deco03 {
    margin-top: calc(-561 * var(--rem));
    margin-left: calc(630 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-look__deco04 {
    margin-top: calc(155 * var(--rem));
    margin-left: calc(700 * var(--rem));
    width: calc(32 * var(--rem));
  }

  & .project-look__look1-sub02 {
    margin-top: calc(359 * var(--rem));
    margin-left: calc(180 * var(--rem));
    width: calc(600 * var(--rem));
    position: relative;
    height: calc(800 * var(--rem));
  }

  & .project-look__photo05 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-look__deco05 {
    margin-top: calc(-561 * var(--rem));
    margin-left: calc(70 * var(--rem));
    width: calc(36 * var(--rem));
  }

  & .project-look__deco06 {
    margin-top: calc(164 * var(--rem));
    margin-left: calc(20 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-look__group01 {
    display: block;
    margin-top: calc(386 * var(--rem));
    margin-left: calc(239 * var(--rem));
    width: calc(140 * var(--rem));
    position: relative;
    height: calc(140 * var(--rem));
  }

  & .project-look__photo07 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__deco07 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__group02 {
    display: block;
    margin-top: calc(-140 * var(--rem));
    margin-left: calc(39 * var(--rem));
    width: calc(160 * var(--rem));
    position: relative;
    height: calc(140 * var(--rem));
  }

  & .project-look__group02 {
    display: grid;
    grid-template-columns: calc(45 * var(--rem)) calc(46 * var(--rem)) calc(44 * var(--rem));
    grid-template-rows: calc(45 * var(--rem)) auto;
    padding: calc(39 * var(--rem)) 0 0 calc(13 * var(--rem));
  }

  & .project-look__group02>.project-look__photo08 {
    position: absolute;
    inset: 0;
  }

  & .project-look__group02>.project-look__deco08 {
    position: absolute;
    inset: 0;
  }

  & .project-look__photo08 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(160 * var(--rem));
  }

  & .project-look__text01 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(43 * var(--rem));
  }

  & .project-look__text01 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text02 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(44 * var(--rem));
  }

  & .project-look__text02 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text03 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(44 * var(--rem));
  }

  & .project-look__text03 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text05 {
    position: relative;
    justify-self: start;
    align-self: start;
    margin-top: calc(1 * var(--rem));
    width: calc(43 * var(--rem));
  }

  & .project-look__text05 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text06 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(43 * var(--rem));
  }

  & .project-look__text06 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text04 {
    position: relative;
    justify-self: start;
    align-self: start;
    margin-top: calc(1 * var(--rem));
    width: calc(44 * var(--rem));
  }

  & .project-look__text04 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__deco08 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(160 * var(--rem));
  }

  & .project-look__group03 {
    display: block;
    margin-top: calc(-140 * var(--rem));
    margin-left: calc(399 * var(--rem));
    width: calc(180 * var(--rem));
    position: relative;
    height: calc(140 * var(--rem));
  }

  & .project-look__photo09 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(20 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__deco09 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(20 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__text07 {
    position: absolute;
    top: calc(49 * var(--rem));
    left: calc(10 * var(--rem));
    width: calc(160 * var(--rem));
  }

  & .project-look__text07 {
    font-size: calc(20 * var(--rem));
    line-height: 1.98;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__deco10 {
    position: absolute;
    top: calc(54 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-look__group04 {
    display: block;
    margin-top: calc(-140 * var(--rem));
    margin-left: calc(599 * var(--rem));
    width: calc(140 * var(--rem));
    position: relative;
    height: calc(140 * var(--rem));
  }

  & .project-look__photo12 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__deco11 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__group05 {
    margin-top: calc(21 * var(--rem));
    margin-left: calc(219 * var(--rem));
    width: calc(360 * var(--rem));
    position: relative;
    height: calc(119 * var(--rem));
  }

  & .project-look__group05 {
    display: grid;
    grid-template-columns: calc(180 * var(--rem)) calc(180 * var(--rem));
    padding: calc(0 * var(--rem)) 0 0 calc(0 * var(--rem));
  }

  & .project-look__text09 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(180 * var(--rem));
  }

  & .project-look__text09 {
    font-size: calc(22 * var(--rem));
    line-height: 1.8;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
  }

  & .project-look__text08 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(180 * var(--rem));
  }

  & .project-look__text08 {
    font-size: calc(22 * var(--rem));
    line-height: 1.8;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text10 {
    margin-top: calc(-119 * var(--rem));
    margin-left: calc(579 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-look__text10 {
    font-size: calc(22 * var(--rem));
    line-height: 1.8;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
  }

  & .project-look__text11 {
    margin-top: calc(-118.8 * var(--rem));
    margin-left: calc(29 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-look__text11 {
    font-size: calc(22 * var(--rem));
    line-height: 1.8;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__deco12 {
    margin-top: calc(97 * var(--rem));
    margin-left: calc(299 * var(--rem));
    width: calc(178 * var(--rem));
  }

  & .project-look__deco13 {
    margin-top: calc(-19 * var(--rem));
    margin-left: calc(519 * var(--rem));
    width: calc(220 * var(--rem));
  }

  & .project-look__deco14 {
    margin-top: calc(-2 * var(--rem));
    margin-left: calc(39 * var(--rem));
    width: calc(220 * var(--rem));
  }

  & .project-look__text12 {
    margin-top: calc(76 * var(--rem));
    margin-left: calc(59 * var(--rem));
    width: calc(35 * var(--rem));
  }

  & .project-look__text12 {
    font-size: calc(26 * var(--rem));
    line-height: 1.3846;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: left;
    white-space: nowrap;
  }

  & .project-look__text13 {
    margin-top: calc(-31 * var(--rem));
    margin-left: calc(121 * var(--rem));
    width: calc(598 * var(--rem));
  }

  & .project-look__text13 {
    font-size: calc(26 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.1em;
    color: #c0a46e;
    text-align: center;
  }

  & .project-look__group06 {
    margin-top: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
    position: relative;
    height: calc(118 * var(--rem));
  }

  & .project-look__text15 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(35 * var(--rem));
  }

  & .project-look__text15 {
    font-size: calc(26 * var(--rem));
    line-height: 1.3846;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: left;
    white-space: nowrap;
  }

  & .project-look__text14 {
    position: relative;
    justify-self: start;
    align-self: start;
    margin-top: calc(5 * var(--rem));
    width: calc(598 * var(--rem));
  }

  & .project-look__text14 {
    font-size: calc(26 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.1em;
    color: #c0a46e;
    text-align: right;
  }

  & .project-look__deco15 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
  }

  & .project-look__text16 {
    margin-top: calc(18 * var(--rem));
    margin-left: calc(314 * var(--rem));
    width: calc(150 * var(--rem));
  }

  & .project-look__text16 {
    font-size: calc(24 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.05em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__deco16 {
    margin-top: calc(7 * var(--rem));
    margin-inline: auto;
    width: calc(81 * var(--rem));
  }

  & .project-look__look2-main {
    margin-top: calc(149 * var(--rem));
    width: calc(780 * var(--rem));
    position: relative;
    height: calc(1120 * var(--rem));
  }

  & .project-look__look2-main {
    display: flow-root;
  }

  & .project-look__look2-main>.project-look__photo15 {
    position: absolute;
    inset: 0;
  }

  & .project-look__photo15 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
  }

  & .project-look__deco17 {
    position: relative;
    display: block;
    margin-top: calc(30 * var(--rem));
    margin-left: calc(690 * var(--rem));
    width: calc(61 * var(--rem));
  }

  & .project-look__look2-sub01 {
    margin-top: calc(60 * var(--rem));
    margin-left: calc(200 * var(--rem));
    width: calc(540 * var(--rem));
    position: relative;
    height: calc(720 * var(--rem));
  }

  & .project-look__photo17 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(540 * var(--rem));
  }

  & .project-look__deco18 {
    margin-top: calc(-557 * var(--rem));
    margin-left: calc(40 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-look__deco19 {
    margin-top: calc(155 * var(--rem));
    margin-left: calc(110 * var(--rem));
    width: calc(32 * var(--rem));
  }

  & .project-look__look2-sub02 {
    margin-top: calc(355 * var(--rem));
    width: calc(600 * var(--rem));
    position: relative;
    height: calc(800 * var(--rem));
  }

  & .project-look__photo19 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(600 * var(--rem));
  }

  & .project-look__deco20 {
    margin-top: calc(-557 * var(--rem));
    margin-left: calc(704 * var(--rem));
    width: calc(36 * var(--rem));
  }

  & .project-look__deco21 {
    margin-top: calc(164 * var(--rem));
    margin-left: calc(654 * var(--rem));
    width: calc(55 * var(--rem));
  }

  & .project-look__group07 {
    display: block;
    margin-top: calc(382 * var(--rem));
    margin-left: calc(39 * var(--rem));
    width: calc(160 * var(--rem));
    position: relative;
    height: calc(140 * var(--rem));
  }

  & .project-look__group07 {
    display: grid;
    grid-template-columns: calc(45 * var(--rem)) calc(46 * var(--rem)) calc(44 * var(--rem));
    grid-template-rows: calc(45 * var(--rem)) auto;
    padding: calc(39 * var(--rem)) 0 0 calc(13 * var(--rem));
  }

  & .project-look__group07>.project-look__photo21 {
    position: absolute;
    inset: 0;
  }

  & .project-look__group07>.project-look__deco22 {
    position: absolute;
    inset: 0;
  }

  & .project-look__photo21 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(160 * var(--rem));
  }

  & .project-look__text17 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(43 * var(--rem));
  }

  & .project-look__text17 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text18 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(44 * var(--rem));
  }

  & .project-look__text18 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text19 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(44 * var(--rem));
  }

  & .project-look__text19 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text21 {
    position: relative;
    justify-self: start;
    align-self: start;
    margin-top: calc(1 * var(--rem));
    width: calc(43 * var(--rem));
  }

  & .project-look__text21 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text22 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(43 * var(--rem));
  }

  & .project-look__text22 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text20 {
    position: relative;
    justify-self: start;
    align-self: start;
    margin-top: calc(1 * var(--rem));
    width: calc(44 * var(--rem));
  }

  & .project-look__text20 {
    font-size: calc(23.33 * var(--rem));
    line-height: 1.9803;
    letter-spacing: 0.1em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__deco22 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(160 * var(--rem));
  }

  & .project-look__group08 {
    display: block;
    margin-top: calc(-140 * var(--rem));
    margin-left: calc(239 * var(--rem));
    width: calc(140 * var(--rem));
    position: relative;
    height: calc(140 * var(--rem));
  }

  & .project-look__photo22 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__deco23 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__group09 {
    display: block;
    margin-top: calc(-140 * var(--rem));
    margin-left: calc(399 * var(--rem));
    width: calc(180 * var(--rem));
    position: relative;
    height: calc(140 * var(--rem));
  }

  & .project-look__photo23 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(20 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__deco24 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(20 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__text23 {
    position: absolute;
    top: calc(49 * var(--rem));
    left: calc(10 * var(--rem));
    width: calc(160 * var(--rem));
  }

  & .project-look__text23 {
    font-size: calc(20 * var(--rem));
    line-height: 1.98;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__deco25 {
    position: absolute;
    top: calc(54 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-look__group10 {
    display: block;
    margin-top: calc(-140 * var(--rem));
    margin-left: calc(599 * var(--rem));
    width: calc(140 * var(--rem));
    position: relative;
    height: calc(140 * var(--rem));
  }

  & .project-look__photo26 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__deco26 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .project-look__group11 {
    margin-top: calc(21 * var(--rem));
    margin-left: calc(219 * var(--rem));
    width: calc(360 * var(--rem));
    position: relative;
    height: calc(119 * var(--rem));
  }

  & .project-look__group11 {
    display: grid;
    grid-template-columns: calc(180 * var(--rem)) calc(180 * var(--rem));
    padding: calc(0 * var(--rem)) 0 0 calc(0 * var(--rem));
  }

  & .project-look__text25 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(180 * var(--rem));
  }

  & .project-look__text25 {
    font-size: calc(22 * var(--rem));
    line-height: 1.8;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
  }

  & .project-look__text24 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(180 * var(--rem));
  }

  & .project-look__text24 {
    font-size: calc(22 * var(--rem));
    line-height: 1.8;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__text26 {
    margin-top: calc(-119 * var(--rem));
    margin-left: calc(579 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-look__text26 {
    font-size: calc(22 * var(--rem));
    line-height: 1.8;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
  }

  & .project-look__text27 {
    margin-top: calc(-118.8 * var(--rem));
    margin-left: calc(29 * var(--rem));
    width: calc(180 * var(--rem));
  }

  & .project-look__text27 {
    font-size: calc(22 * var(--rem));
    line-height: 1.8;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__deco27 {
    margin-top: calc(97 * var(--rem));
    margin-left: calc(299 * var(--rem));
    width: calc(178 * var(--rem));
  }

  & .project-look__deco28 {
    margin-top: calc(-19 * var(--rem));
    margin-left: calc(519 * var(--rem));
    width: calc(220 * var(--rem));
  }

  & .project-look__deco29 {
    margin-top: calc(-2 * var(--rem));
    margin-left: calc(39 * var(--rem));
    width: calc(220 * var(--rem));
  }

  & .project-look__text28 {
    margin-top: calc(76 * var(--rem));
    margin-left: calc(59 * var(--rem));
    width: calc(35 * var(--rem));
  }

  & .project-look__text28 {
    font-size: calc(26 * var(--rem));
    line-height: 1.3846;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: left;
    white-space: nowrap;
  }

  & .project-look__text29 {
    margin-top: calc(-31 * var(--rem));
    margin-left: calc(121 * var(--rem));
    width: calc(598 * var(--rem));
  }

  & .project-look__text29 {
    font-size: calc(26 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.1em;
    color: #c0a46e;
    text-align: center;
  }

  & .project-look__group12 {
    margin-top: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
    position: relative;
    height: calc(118 * var(--rem));
  }

  & .project-look__text31 {
    position: relative;
    justify-self: start;
    align-self: start;
    width: calc(35 * var(--rem));
  }

  & .project-look__text31 {
    font-size: calc(26 * var(--rem));
    line-height: 1.3846;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: left;
    white-space: nowrap;
  }

  & .project-look__text30 {
    position: relative;
    justify-self: start;
    align-self: start;
    margin-top: calc(5 * var(--rem));
    width: calc(598 * var(--rem));
  }

  & .project-look__text30 {
    font-size: calc(26 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.1em;
    color: #c0a46e;
    text-align: right;
  }

  & .project-look__deco30 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(780 * var(--rem));
  }

  & .project-look__text32 {
    margin-top: calc(18 * var(--rem));
    margin-left: calc(314 * var(--rem));
    width: calc(150 * var(--rem));
  }

  & .project-look__text32 {
    font-size: calc(24 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.05em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .project-look__deco31 {
    margin-top: calc(7 * var(--rem));
    margin-inline: auto;
    width: calc(81 * var(--rem));
  }

  & .project-look__group13 {
    display: block;
    margin-top: calc(122 * var(--rem));
    margin-inline: auto;
    width: calc(580 * var(--rem));
    position: relative;
    height: calc(120 * var(--rem));
  }

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

  & .project-look__group13>.project-look__deco32 {
    position: absolute;
    inset: 0;
  }

  & .project-look__deco32 {
    position: absolute;
    top: calc(0 * var(--rem));
    left: calc(0 * var(--rem));
    width: calc(580 * var(--rem));
  }

  & .project-look__deco33 {
    position: relative;
    display: block;
    margin-top: calc(40 * var(--rem));
    margin-inline: auto;
    width: calc(405 * var(--rem));
  }

  & .project-look__deco34 {
    margin-top: calc(123 * var(--rem));
    margin-left: calc(207 * var(--rem));
    width: calc(363 * var(--rem));
  }

}

.lp_contents {

  & .component-accordion--story {
    margin-top: calc(24 * var(--rem));
  }

  & .component-accordion__story {
    margin: calc(3.2 * var(--rem)) 0 calc(44 * var(--rem));
    font-size: calc(28 * var(--rem));
    line-height: 2.2;
    letter-spacing: 0.1em;
    color: #8e6c41;
    text-align: center;
    white-space: nowrap;
  }

  & .component-accordion--story .component-accordion__more .component-accordion__word {
    top: calc(40 * var(--rem));
    left: calc(23 * var(--rem));
    width: calc(140 * var(--rem));
  }

  & .component-accordion--story .component-accordion__close .component-accordion__word {
    top: calc(38 * var(--rem));
    left: calc(57 * var(--rem));
    width: calc(74 * var(--rem));
  }

  & .component-accordion--look1 {
    margin-top: calc(76 * var(--rem));
  }

  & .component-accordion--look1 .component-accordion__steps {
    max-height: calc(201 * var(--rem));
  }

  & .component-accordion--look1::after {
    top: 0;
    height: calc(201 * var(--rem));
  }

  & .component-accordion--look1 .component-accordion__more {
    margin-top: calc(18 * var(--rem));
  }

  & .component-accordion--look1 .component-accordion__close {
    margin-top: calc(53 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(1) {
    margin-top: calc(0 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(2) {
    margin-top: calc(35 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(3) {
    margin-top: calc(27 * var(--rem));
    height: calc(34 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(4) {
    margin-top: calc(40 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(5) {
    margin-top: calc(35 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(6) {
    margin-top: calc(35 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(7) {
    margin-top: calc(35 * var(--rem));
    height: calc(144 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(8) {
    margin-top: calc(35 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look1 li:nth-child(9) {
    margin-top: calc(27 * var(--rem));
    min-height: calc(34 * var(--rem));
  }

  & .component-accordion--look2 {
    margin-top: calc(76 * var(--rem));
  }

  & .component-accordion--look2 .component-accordion__steps {
    max-height: calc(201 * var(--rem));
  }

  & .component-accordion--look2::after {
    top: 0;
    height: calc(201 * var(--rem));
  }

  & .component-accordion--look2 .component-accordion__more {
    margin-top: calc(18 * var(--rem));
  }

  & .component-accordion--look2 .component-accordion__close {
    margin-top: calc(48 * var(--rem));
  }

  & .component-accordion--look2 li:nth-child(1) {
    margin-top: calc(0 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look2 li:nth-child(2) {
    margin-top: calc(35 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look2 li:nth-child(3) {
    margin-top: calc(35 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look2 li:nth-child(4) {
    margin-top: calc(35 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look2 li:nth-child(5) {
    margin-top: calc(27 * var(--rem));
    height: calc(34 * var(--rem));
  }

  & .component-accordion--look2 li:nth-child(6) {
    margin-top: calc(92 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look2 li:nth-child(7) {
    margin-top: calc(35 * var(--rem));
    height: calc(83 * var(--rem));
  }

  & .component-accordion--look2 li:nth-child(8) {
    margin-top: calc(35 * var(--rem));
    min-height: calc(135 * var(--rem));
  }

  & .component-accordion__steps li span {
    font-size: calc(26 * var(--rem));
    line-height: 1.3846;
    letter-spacing: 0.1em;
    color: #8e6c41;
  }

  & .component-accordion__steps li p {
    font-size: calc(26 * var(--rem));
    line-height: 2.0;
    letter-spacing: 0.1em;
    color: var(--color-accent);
    text-align: justify;
  }

  & .component-accordion__steps li p a {
    color: var(--color-gold);
    text-decoration: underline;
    letter-spacing: 0.1em;
  }

}

.lp_contents {
  & .modal_outside {
    max-width: calc(740 * var(--rem));
    border-radius: 0;
  }

  & .project-popup {
    position: relative;
    width: 100%;
  }

  & .project-popup__state {
    position: relative;
    display: none;
    grid-template-rows: calc(817 * var(--rem)) calc(90 * var(--rem)) calc(61 * var(--rem)) calc(138 * var(--rem)) calc(718 * var(--rem)) auto;
    justify-items: center;
    align-content: start;
    padding-top: calc(100 * var(--rem));
    height: calc(2144 * var(--rem));

    &>* {
      align-self: start;
    }

    &.is-current {
      display: grid;
      animation: lp-mdl-in .4s var(--transition-timing) both;
    }

    &.project-popup__state--design {
      grid-template-rows: calc(817 * var(--rem)) calc(90 * var(--rem)) calc(42 * var(--rem)) calc(170 * var(--rem)) calc(308 * var(--rem)) auto;
      height: calc(1747 * var(--rem));
    }
  }

  & .project-popup__view {
    position: relative;
    width: calc(640 * var(--rem));
    height: calc(640 * var(--rem));
    overflow: hidden;

    & img {
      display: block;
      width: 100%;
      transform-origin: 0 0;
      transition: scale .5s var(--transition-timing), translate .5s var(--transition-timing);
    }

    &.is-dragging img {
      transition: none;
      cursor: grabbing;
    }

    & img {
      -webkit-user-drag: none;
      user-select: none;
    }
  }

  & .project-popup.is-zoom .project-popup__view {
    touch-action: none;
  }

  & .project-popup.is-zoom .project-popup__view img {
    cursor: grab;
  }

  & .project-popup__name {
    width: calc(600 * var(--rem));
    color: var(--color-accent);
    font-size: calc(24 * var(--rem));
    line-height: 1.6;
    letter-spacing: .05em;
    text-align: center;
    white-space: nowrap;
  }

  & .project-popup__rule {
    width: calc(640 * var(--rem));
  }

  & .project-popup__chips {
    display: grid;
    grid-template-columns: repeat(3, calc(44 * var(--rem)));
    grid-template-rows: repeat(2, calc(44 * var(--rem)));
    width: calc(128 * var(--rem));

    & li {
      position: relative;
      width: calc(40 * var(--rem));
      height: calc(40 * var(--rem));
    }

    & img {
      display: block;
      width: 100%;
    }

    & span {
      position: absolute;
      inset: 0;
      color: #fff;
      font-size: calc(24 * var(--rem));
      letter-spacing: .125em;
      line-height: calc(40 * var(--rem));
      text-align: center;
      text-indent: .125em;
    }

  }

  & .project-popup__colors {
    display: grid;
    grid-template-columns: calc(40 * var(--rem)) calc(540 * var(--rem));
    grid-template-rows: repeat(5, calc(112 * var(--rem))) auto;
    width: calc(580 * var(--rem));

    & dt {
      align-self: start;
      width: calc(20 * var(--rem));
      color: var(--color-gold);
      font-size: calc(24 * var(--rem));
      line-height: 1.5;
      letter-spacing: .1em;
    }

    & dd {
      align-self: start;
      width: calc(540 * var(--rem));
      color: var(--color-accent);
      font-size: calc(24 * var(--rem));
      line-height: 2;
      letter-spacing: .1em;
      text-align: justify;
    }

    & dd {}
  }

  & .project-popup__lead {
    width: calc(580 * var(--rem));
    color: var(--color-accent);
    font-size: calc(32 * var(--rem));
    line-height: 2.2;
    letter-spacing: .1em;
    text-align: center;
    white-space: nowrap;
  }

  & .project-popup__text {
    width: calc(580 * var(--rem));
    color: var(--color-accent);
    font-size: calc(24 * var(--rem));
    line-height: 2;
    letter-spacing: .1em;
  }

  & .project-popup__cta {
    width: calc(400 * var(--rem));

    & img {
      display: block;
      width: 100%;
    }
  }

  & .project-popup__close,
  & .project-popup__zoom {
    position: absolute;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;

    & img {
      display: block;
      width: 100%;
    }
  }

  & .project-popup__close {
    top: calc(29 * var(--rem));
    left: calc(669 * var(--rem));
    z-index: var(--z-modal);
    width: calc(42 * var(--rem));
  }

  & .project-popup__zoom {
    top: calc(660 * var(--rem));
    left: calc(610 * var(--rem));
    z-index: var(--z-base);
    width: calc(60 * var(--rem));

    & .project-popup__zoom-out {
      display: none;
    }
  }

  & .project-popup.is-zoom .project-popup__zoom {
    & .project-popup__zoom-in {
      display: none;
    }

    & .project-popup__zoom-out {
      display: block;
    }
  }

  & .project-popup__nav {
    position: absolute;
    top: calc(800 * var(--rem));
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(29.25 * var(--rem));
    width: 100%;
  }

  & .project-popup__arrow {
    padding: 0;
    width: calc(47 * var(--rem));
    border: 0;
    background: none;
    cursor: pointer;
    margin-top: calc(-24 * var(--rem));

    & img {
      display: block;
      width: 100%;
    }
  }

  & .project-popup__thumbs {
    display: flex;
    align-items: center;
    gap: calc(29.25 * var(--rem));

    & li {
      display: grid;
      grid-template-rows: calc(60 * var(--rem)) calc(20 * var(--rem)) calc(4 * var(--rem));
      justify-items: center;
      align-items: center;
    }

    & button {
      display: grid;
      grid-row: 1 / 4;
      grid-template-rows: subgrid;
      justify-items: center;
      align-items: center;
      padding: 0;
      width: calc(69 * var(--rem));
      border: 0;
      background: none;
      cursor: pointer;
    }

    & img {
      display: block;
      grid-row: 1;
      width: 100%;
    }

    & button::after {
      grid-row: 3;
      width: calc(50 * var(--rem));
      height: calc(4 * var(--rem));
      background: var(--color-indicator-off);
      content: "";
    }

    & button.is-current::after {
      background: var(--color-indicator-on);
    }
  }
}

@keyframes lp-mdl-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.lp_contents {
  & .project-nav {
    --dash: calc(4 * var(--rem));

    position: fixed;
    top: 0;
    right: 0;
    z-index: var(--z-sticky);
    height: 100dvh;
    opacity: 0;
    visibility: hidden;
    transition: opacity .4s var(--transition-timing), visibility .4s var(--transition-timing);
    pointer-events: none;

    &.is-shown {
      opacity: 1;
      visibility: visible;
    }
  }

  & .project-nav__tab {
    position: absolute;
    right: 0;
    bottom: calc(40 * var(--rem));
    padding: 0;
    width: calc(60 * var(--rem));
    height: calc(180 * var(--rem));
    border: 0;
    background: url("../img/nav-tab-open.png") 0 0 / 100% 100% no-repeat;
    color: #fff;
    font-size: calc(28 * var(--rem));
    letter-spacing: .1em;
    writing-mode: vertical-rl;
    cursor: pointer;
    pointer-events: auto;
    transition: translate .5s var(--transition-timing);
  }

  & .project-nav__tab-close {
    display: none;
  }

  & .project-nav.is-open .project-nav__tab {
    translate: calc(-300 * var(--rem)) 0;
    background-image: url("../img/nav-tab-close.png");

    & .project-nav__tab-open {
      display: none;
    }

    & .project-nav__tab-close {
      display: block;
    }
  }

  & .project-nav__panel {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    width: calc(300 * var(--rem));
    height: 100%;
    overflow-y: auto;
    background: var(--color-bg-top);
    translate: 100% 0;
    transition: translate .5s var(--transition-timing);
    pointer-events: auto;
    scrollbar-width: none;

    &::-webkit-scrollbar {
      display: none;
    }
  }

  & .project-nav.is-open .project-nav__panel {
    translate: 0 0;
  }

  & .project-nav__inner {
    position: relative;
    flex: none;
    display: grid;
    grid-template-rows: calc(75 * var(--rem)) calc(788 * var(--rem)) calc(75 * var(--rem)) calc(83 * var(--rem)) calc(88 * var(--rem)) auto;
    justify-items: center;
    align-content: start;
    margin-block: auto;
    padding-top: calc(67 * var(--rem));
    width: calc(300 * var(--rem));
    height: calc(1334 * var(--rem));

    &>* {
      align-self: start;
    }
  }

  & .project-nav__head {
    position: relative;

    & img {
      display: block;
      width: 100%;
    }

    &::before,
    &::after {
      position: absolute;
      top: calc(13 * var(--rem));
      width: calc(70 * var(--rem));
      height: var(--dash-w);
      background: repeating-linear-gradient(to right,
          var(--color-gold) 0 var(--dash), transparent var(--dash) calc(var(--dash) * 2));
      content: "";
    }

  }

  & .project-nav__head--2nd {
    width: calc(75 * var(--rem));

    &::before {
      left: calc(-83 * var(--rem));
    }

    &::after {
      left: calc(87 * var(--rem));
    }
  }

  & .project-nav__head--1st {
    width: calc(47 * var(--rem));

    &::before {
      left: calc(-96 * var(--rem));
    }

    &::after {
      left: calc(74 * var(--rem));
    }
  }

  & .project-nav__list {
    display: grid;
    grid-template-rows: calc(120 * var(--rem)) calc(120 * var(--rem)) calc(131 * var(--rem)) calc(130 * var(--rem)) calc(120 * var(--rem)) auto;
    width: calc(240 * var(--rem));

    & li {
      align-self: start;
    }

    & a {
      display: flex;
      align-items: flex-start;
      color: var(--color-accent);
    }

    & img {
      flex: none;
      width: calc(80 * var(--rem));
    }

    & span {
      flex: 1;
      padding-left: calc(20 * var(--rem));
      font-size: calc(22 * var(--rem));
      line-height: 1.5;
      letter-spacing: .05em;
    }

    & li:nth-child(1) span {
      margin-top: calc(17 * var(--rem));
    }

    & li:nth-child(2) span {
      margin-top: calc(23 * var(--rem));
    }

    & li:nth-child(3) span {
      margin-top: calc(17 * var(--rem));
    }

    & li:nth-child(4) span {
      margin-top: calc(-16 * var(--rem));
    }

    & li:nth-child(5) span {
      margin-top: calc(23 * var(--rem));
    }

    & li:nth-child(6) span {
      margin-top: calc(23 * var(--rem));
    }
  }

  & .project-nav__2nd {
    width: calc(240 * var(--rem));

    & img {
      display: block;
      width: 100%;
    }
  }

  & .project-nav__soon {
    width: calc(240 * var(--rem));
    color: var(--color-gold);
    font-size: calc(22 * var(--rem));
    line-height: 1.636;
    letter-spacing: .1em;
    text-align: center;
  }

  & .project-nav__look {
    width: calc(240 * var(--rem));
    border-block: var(--dash-w) solid transparent;
    border-image: repeating-linear-gradient(to right,
        var(--color-gold) 0 var(--dash), transparent var(--dash) calc(var(--dash) * 2)) 2 / var(--dash-w) 0 stretch;

    & a {
      display: block;
      padding: calc(37 * var(--rem)) 0 calc(39 * var(--rem)) calc(54 * var(--rem));
      background: url("../img/nav-chevron.jpg") calc(13 * var(--rem)) center / calc(24 * var(--rem)) calc(12 * var(--rem)) no-repeat;
      color: var(--color-accent);
      font-size: calc(24 * var(--rem));
      line-height: 1.375;
      letter-spacing: .05em;
    }
  }
}

@media (min-width: 781px) {
  .lp_contents .project-nav {
    display: none;
  }
}

.lp_contents {
  & .component-accordion {
    position: relative;
    display: grid;
    justify-items: center;
    align-content: start;
  }

  & .component-accordion__body,
  & .component-accordion__steps {
    overflow: hidden;
    transition: max-height .5s var(--transition-timing);
  }

  & .component-accordion__body {
    width: 100%;
    max-height: 0;
  }

  & .component-accordion--look1::after,
  & .component-accordion--look2::after {
    position: absolute;
    left: 0;
    width: 100%;
    background: linear-gradient(to bottom, rgb(244 241 238 / 0) 0%, var(--color-bg) 87%);
    content: "";
    transition: opacity .4s var(--transition-timing);
  }

  & .component-accordion.is-open::after {
    opacity: 0;
    pointer-events: none;
  }

  & .component-accordion__steps {
    width: calc(660 * var(--rem));

    & li {
      display: grid;
      grid-template-columns: calc(62 * var(--rem)) calc(598 * var(--rem));
      align-items: baseline;
    }
  }

  & .component-accordion__toggle {
    display: block;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
  }

  & .component-accordion__more {
    display: block;
  }

  & .component-accordion__close {
    display: none;
  }

  & .component-accordion.is-open .component-accordion__more {
    display: none;
  }

  & .component-accordion.is-open .component-accordion__close {
    display: block;
  }

  & .component-accordion__toggle img {
    display: block;
    margin-inline: auto;
  }

  & .component-accordion--look1,
  & .component-accordion--look2 {

    & .component-accordion__more,
    & .component-accordion__close {
      color: var(--color-accent);
      font-size: calc(24 * var(--rem));
      line-height: 2;
      letter-spacing: .05em;
    }

    & .component-accordion__more img {
      margin-top: calc(7 * var(--rem));
      width: calc(81 * var(--rem));
    }

    & .component-accordion__close img {
      margin-top: calc(7 * var(--rem));
      width: calc(41 * var(--rem));
    }
  }

  & .component-accordion--story .component-accordion__toggle {
    width: calc(188 * var(--rem));
  }

  & .component-accordion--story {

    & .component-accordion__more,
    & .component-accordion__close {
      position: relative;
    }

    & .component-accordion__oval {
      width: 100%;
    }

    & .component-accordion__word {
      position: absolute;
    }
  }
}

.lp_contents .layout-inner {
  position: relative;
  background: var(--color-bg);

  &>* {
    position: relative;
    z-index: var(--z-base);
  }
}

.lp_contents {
  & .project-rail__title {
    width: calc(300 * var(--rem-pc));

    & img {
      display: block;
      width: 100%;
    }
  }

  & .project-rail__nav {
    --dash: calc(3 * var(--rem-pc));
    --dash-w: calc(1 * var(--rem-pc));

    position: relative;
    display: grid;
    grid-template-rows: calc(49 * var(--rem-pc)) calc(281 * var(--rem-pc)) calc(49 * var(--rem-pc)) calc(60 * var(--rem-pc)) calc(65.5 * var(--rem-pc)) auto;
    align-content: start;
    width: calc(328.5 * var(--rem-pc));
    height: calc(561.5 * var(--rem-pc));
    color: var(--color-accent);

    &>* {
      align-self: start;
    }

    & img {
      display: block;
      width: 100%;
    }

    & a {
      color: inherit;
    }
  }

  & .project-rail__head {
    position: relative;

    &::before,
    &::after {
      position: absolute;
      top: calc(9 * var(--rem-pc));
      width: calc(70 * var(--rem-pc));
      height: var(--dash-w);
      background: repeating-linear-gradient(to right,
          var(--color-gold) 0 var(--dash), transparent var(--dash) calc(var(--dash) * 2));
      content: "";
    }

  }

  & .project-rail__head--2nd {
    margin-left: calc(78.3 * var(--rem-pc));
    width: calc(174 * var(--rem-pc));

    &::before {
      left: calc(-78.3 * var(--rem-pc));
    }

    &::after {
      left: calc(182.7 * var(--rem-pc));
    }
  }

  & .project-rail__head--1st {
    margin-left: calc(87 * var(--rem-pc));
    width: calc(157 * var(--rem-pc));

    &::before {
      left: calc(-87 * var(--rem-pc));
    }

    &::after {
      left: calc(174 * var(--rem-pc));
    }
  }

  & .project-rail__list {
    display: grid;
    grid-template-columns: repeat(3, calc(115 * var(--rem-pc)));
    grid-template-rows: calc(122 * var(--rem-pc)) auto;
    margin-left: calc(10 * var(--rem-pc));
  }

  & .project-rail__list li {
    align-self: start;
    width: calc(80 * var(--rem-pc));

    & a {
      display: grid;
      grid-template-columns: calc(80 * var(--rem-pc));
      justify-items: center;
    }

    & span {
      display: block;
      width: calc(110 * var(--rem-pc));
      font-size: calc(12 * var(--rem-pc));
      letter-spacing: .05em;
      text-align: center;
    }

    &:nth-child(-n+3) span {
      margin-top: calc(7 * var(--rem-pc));
      line-height: 1.5;
    }

    &:nth-child(n+4) span {
      margin-top: calc(7.6 * var(--rem-pc));
      line-height: 1.4;
    }
  }

  & .project-rail__2nd {
    margin-left: calc(55 * var(--rem-pc));
    width: calc(220 * var(--rem-pc));
  }

  & .project-rail__soon {
    margin-left: calc(45 * var(--rem-pc));
    width: calc(240 * var(--rem-pc));
    color: var(--color-gold);
    font-size: calc(16 * var(--rem-pc));
    line-height: 2.25;
    letter-spacing: .1em;
    text-align: center;
  }

  & .project-rail__look {
    width: calc(326.5 * var(--rem-pc));
    border-block: var(--dash-w) solid transparent;
    border-image: repeating-linear-gradient(to right,
        var(--color-gold) 0 var(--dash), transparent var(--dash) calc(var(--dash) * 2)) 1 / var(--dash-w) 0 stretch;

    & a {
      display: block;
      padding: calc(11 * var(--rem-pc)) 0 calc(11 * var(--rem-pc)) calc(122.5 * var(--rem-pc));
      background: url("../img/pc-chevron.jpg") calc(97 * var(--rem-pc)) calc(21 * var(--rem-pc)) / calc(21 * var(--rem-pc)) calc(13 * var(--rem-pc)) no-repeat;
      font-size: calc(16 * var(--rem-pc));
      line-height: 2.0625;
      letter-spacing: .05em;
    }
  }
}

.lp_contents {
  & .component-plate {
    position: relative;
    background: none;

    &::before {
      position: absolute;
      inset: calc(18 * var(--rem));
      z-index: 0;
      border-radius: calc(60 * var(--rem));
      background: var(--color-bg-top);
      filter: blur(calc(9 * var(--rem)));
      content: "";
    }

    &>* {
      position: relative;
      z-index: var(--z-base);
    }
  }

  & .project-popup__view {
    background: var(--color-bg);
  }

  & .modal {
    background: rgb(255 255 255 / .55);
  }
}

@media (min-width: 781px) {
  .lp_contents {
    background: var(--color-rail);
  }
}

.lp_contents {
  & [data-card-flat] [data-state] {
    opacity: 0;
    transition: opacity .6s var(--transition-timing);
    pointer-events: none;

    & a {
      letter-spacing: 0.1em;
      width: 100%;
      display: inline-block;
    }

    &.is-current {
      opacity: 1;
      pointer-events: auto;
    }
  }
}

.lp_contents {
  & .component-pager {
    position: static;

    & .swiper-pagination-bullet {
      margin: 0;
      width: calc(100 * var(--rem));
      height: calc(6 * var(--rem));
      border-radius: 0;
      background: var(--color-indicator-off);
      opacity: 1;
    }

    & .swiper-pagination-bullet-active {
      background: var(--color-gold);
    }
  }
}