@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: #8e6c41;
  --color-pink: #e18197;
  --color-orange: #e69d48;
  --color-brown: #8e6c41;
  --color-gold: #c0a46e;
  --color-bg-look01: #fcf8f7;
  --color-bg-look02: #faf8f2;
  --color-comment-look01: #f8e0e5;
  --color-comment-look02: #f9e7d1;
  --color-rule-look01: #f0c0cb;
  --color-rule-look02: #f3cea4;
  --color-rail-look01: #f8ebe9;
  --color-rail-look02: #f7f0e4;
  --color-rail: var(--color-rail-look01);
  --color-rail-theme: var(--color-pink);

  --font-base: lato, ryo-gothic-plusn, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 游ゴシック, "Yu Gothic", メイリオ, Meiryo, sans-serif;
  --font-title: la-mericana, "Times New Roman", serif;
  --font-latin: lato, "Helvetica Neue", Arial, sans-serif;
  --font-credit: "Helvetica LT Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;

  --transition-timing: cubic-bezier(0.51, 0.21, 0.41, 1);
  --duration-marquee: 30s;
  --ani-delay: 0s;
  --letter-spacing: .075em;

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

.p-feature.is-look02 {
  --color-rail: var(--color-rail-look02);
  --color-rail-theme: var(--color-orange);
}

.lp_contents {
  position: relative;
  font-family: var(--font-base);
  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;

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

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

#Wrap {
  width: 100%;
}

#Contents {
  max-width: unset;
}

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

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

#share {
  transition: bottom .6s .2s ease;
}

.is-footer-nav-visible #share {
  bottom: calc(2% + 90 * var(--rem));
}

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

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

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

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

html.js .lp_contents {
  & .ani-fadein {
    opacity: 0;
    filter: blur(5px);

    &.is-active {
      opacity: 1;
      filter: none;
    }
  }

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

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

.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-rail {
    display: none;

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

  & .layout-rail > * {
    pointer-events: auto;
  }

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

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

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

.lp_contents {
  & .project-mv {
    position: relative;
  }

  & .project-mv__title {
    position: absolute;
    z-index: var(--z-base);
    top: calc(760 * var(--rem));
    inset-inline: 0;
    width: calc(351 * var(--rem));
    margin-inline: auto;
    --ani-delay: 1s;
  }

  & .project-intro__catch {
    margin-top: calc(96 * var(--rem));
    font-family: var(--font-base);
    font-size: calc(30 * var(--rem));
    font-weight: 500;
    line-height: 1.2543;
    letter-spacing: .1em;
    color: var(--color-pink);
    white-space: nowrap;
    text-align: center;
    padding-left: .1em;
  }

  & .project-intro__list {
    display: flex;
    justify-content: center;
    column-gap: calc(100 * var(--rem));
    margin-top: calc(56 * var(--rem));
  }

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

  & .project-intro__item--look02 {
    --ani-delay: .3s;
  }

  & .project-intro__link {
    display: grid;
    justify-items: center;
    width: calc(280 * var(--rem));
  }

  & .project-intro__label {
    margin-top: calc(27 * var(--rem));
    font-family: var(--font-title);
    font-size: calc(36 * var(--rem));
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: .05em;
    color: var(--color-pink);
    white-space: nowrap;
    text-align: center;
    padding-left: .05em;
  }

  & .project-intro__arrow {
    width: calc(44 * var(--rem));
    height: calc(44 * var(--rem));
    margin-top: calc(16 * var(--rem));
    border-radius: 50%;
    background: var(--color-pink) url(../img/icon-chevron.png) center / 100% no-repeat;
  }

  & .project-look--01 .project-look__title {
    width: calc(574 * var(--rem));
    margin-inline: auto;
  }

  & .project-look--01 .project-look__lead {
    margin-top: calc(64 * var(--rem));
    font-family: var(--font-base);
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: .1em;
    color: var(--color-theme);
    white-space: nowrap;
    text-align: center;
    padding-left: .1em;
  }

  & .project-look--01 .project-look__pairs {
    margin-top: calc(65 * var(--rem));
  }

  & .project-look--01 .project-look__pair--01 {
    justify-content: flex-end;
  }

  & .project-look--01 .project-look__pair--01 .project-look__pair-image {
    margin-top: calc(19 * var(--rem));
  }

  & .project-look--01 .project-look__pair--01 .project-look__pair-name {
    margin-top: calc(20 * var(--rem));
  }

  & .project-look--01 .project-look__pair--01 .project-look__pair-button {
    margin-top: calc(12 * var(--rem));
  }

  & .project-look--01 .project-look__pair--02 {
    margin-top: calc(80 * var(--rem));
  }

  & .project-look--01 .project-look__pair--02 .project-look__pair-image {
    margin-top: calc(20 * var(--rem));
  }

  & .project-look--01 .project-look__pair--02 .project-look__pair-name {
    margin-top: calc(20 * var(--rem));
  }

  & .project-look--01 .project-look__pair--02 .project-look__pair-button {
    margin-top: calc(12 * var(--rem));
  }

  & .project-look__pair {
    display: flex;
  }

  & .project-look__pair-photo {
    width: calc(520 * var(--rem));
    background: var(--color-theme-bg);
  }

  & .project-look__pair-item {
    display: grid;
    justify-items: center;
    align-content: start;
    width: calc(230 * var(--rem));
  }

  & .project-look__pair-image {
    width: calc(176 * var(--rem));
    background: var(--color-theme-bg);
  }

  & .project-look__pair-name {
    font-family: var(--font-latin);
    font-size: calc(24 * var(--rem));
    line-height: 1.75;
    letter-spacing: .05em;
    color: var(--color-brown);
    white-space: nowrap;
    text-align: center;
    padding-left: .05em;
  }

  & .project-look__pair-name a {
    letter-spacing: .05em;
  }

  & .project-look__pair-button a {
    display: grid;
    place-items: center;
    width: calc(140 * var(--rem));
    height: calc(40 * var(--rem));
    background: var(--color-gold);
    font-size: calc(22 * var(--rem));
    line-height: 1;
    letter-spacing: .05em;
    color: #fff;
    white-space: nowrap;
    text-align: center;
    padding-left: .05em;
  }

  & .project-look--01 .project-look__marquee {
    margin-top: calc(60 * var(--rem));
  }

  & .project-look--01 .project-look__marquee-track {
    margin-left: calc(-43 * var(--rem));
  }

  & .project-look--01 .project-look__photo {
    margin-top: calc(65 * var(--rem));
  }

  & .project-look--01 .section-item--eyedesigner {
    margin-top: calc(60 * var(--rem));
  }

  & .project-look--01 .section-item--eyedesigner .section-item__bubble {
    margin-left: calc(350 * var(--rem));
    padding-top: calc(19 * var(--rem));
    width: calc(380 * var(--rem));
    height: calc(165 * var(--rem));
    background: url(../img/look01-eyedesigner-bubble.png) 0 0 / 100% 100% no-repeat;
  }

  & .project-look--01 .section-item--eyedesigner .section-item__image {
    width: calc(528 * var(--rem));
    margin-inline: auto;
  }

  & .project-look--01 .section-item--eyedesigner .section-item__badge {
    top: calc(290 * var(--rem));
    left: calc(50 * var(--rem));
  }

  & .project-look--01 .section-item--eyedesigner .section-item__name {
    margin-top: calc(26 * var(--rem));
  }

  & .project-look--01 .section-item--eyedesigner .section-item__button {
    margin-top: calc(32 * var(--rem));
  }

  & .project-look--01 .section-item--eyedesigner .section-item__comment-title {
    margin-top: calc(30 * var(--rem));
  }

  & .project-look--01 .section-item--eyedesigner .section-item__comment {
    margin-top: calc(23 * var(--rem));
  }

  & .project-look--01 .section-item--eyedesigner .section-item__comment::before {
    top: calc(-14 * var(--rem));
  }

  & .project-look--01 .section-item--eyedesigner .section-item__comment::after {
    bottom: calc(-18 * var(--rem));
  }

  & .project-look--01 .section-item--balm {
    margin-top: calc(134 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__visual {
    display: flex;
    align-items: flex-start;
  }

  & .project-look--01 .section-item--balm .section-item__bubble {
    flex: none;
    margin-top: calc(1 * var(--rem));
    margin-left: calc(60 * var(--rem));
    padding-top: calc(23 * var(--rem));
    width: calc(165 * var(--rem));
    height: calc(336 * var(--rem));
    background: url(../img/look01-balm-bubble.png) 0 0 / 100% 100% no-repeat;
  }

  & .project-look--01 .section-item--balm .section-item__bubble-text {
    margin-left: calc(20 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__image {
    width: calc(490 * var(--rem));
    margin-left: calc(5 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__badge {
    top: 0;
    left: calc(570 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__name {
    margin-top: calc(26 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__button {
    margin-top: calc(32 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__comment-title {
    margin-top: calc(29 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__comment {
    margin-top: calc(23 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__comment::before {
    top: calc(-14 * var(--rem));
  }

  & .project-look--01 .section-item--balm .section-item__comment::after {
    bottom: calc(-15 * var(--rem));
  }

  & .project-look--01 .section-item--blush {
    margin-top: calc(136 * var(--rem));
  }

  & .project-look--01 .section-item--blush .section-item__bubble {
    position: absolute;
    z-index: var(--z-base);
    top: calc(-2 * var(--rem));
    left: calc(563 * var(--rem));
    padding-top: calc(24 * var(--rem));
    width: calc(165 * var(--rem));
    height: calc(342 * var(--rem));
    background: url(../img/look01-blush-bubble.png) 0 0 / 100% 100% no-repeat;
  }

  & .project-look--01 .section-item--blush .section-item__bubble-text {
    margin-left: calc(55 * var(--rem));
  }

  & .project-look--01 .section-item--blush .section-item__image {
    width: calc(385 * var(--rem));
    margin-inline: auto;
  }

  & .project-look--01 .section-item--blush .section-item__badge {
    top: calc(13 * var(--rem));
    left: calc(50 * var(--rem));
  }

  & .project-look--01 .section-item--blush .section-item__name {
    margin-top: calc(11 * var(--rem));
  }

  & .project-look--01 .section-item--blush .section-item__button {
    margin-top: calc(33 * var(--rem));
  }

  & .project-look--01 .section-item--blush .section-item__comment-title {
    margin-top: calc(29 * var(--rem));
  }

  & .project-look--01 .section-item--blush .section-item__comment {
    margin-top: calc(23 * var(--rem));
  }

  & .project-look--01 .section-item--blush .section-item__comment::before {
    top: calc(-14 * var(--rem));
  }

  & .project-look--01 .section-item--blush .section-item__comment::after {
    bottom: calc(-15 * var(--rem));
  }

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

  & .component-accordion--look01 .component-accordion__heading--eye {
    margin-top: calc(42 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__row--eye {
    margin-top: calc(10 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__row--eye .component-accordion__image {
    margin-top: calc(16 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__heading--cheek {
    margin-top: calc(49 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__row--cheek {
    margin-top: calc(10 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__row--cheek .component-accordion__image {
    margin-top: calc(16 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__heading--lip {
    margin-top: calc(50 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__row--lip {
    margin-top: calc(9 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__row--lip .component-accordion__image {
    margin-top: calc(16 * var(--rem));
  }

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

  & .component-accordion--look01 .component-accordion__frame {
    padding-top: calc(141 * var(--rem));
    padding-bottom: calc(115 * var(--rem));
  }

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

  & .component-accordion--look01 .component-accordion__more .component-accordion__icon {
    margin-top: calc(4 * var(--rem));
  }

  & .component-accordion--look01 .component-accordion__close .component-accordion__icon {
    margin-top: calc(4 * var(--rem));
  }

  & .project-look--01 {
    margin-top: calc(30 * var(--rem));
    padding-top: calc(120 * var(--rem));
    padding-bottom: calc(96 * var(--rem));
    --color-theme: var(--color-pink);
    --color-theme-bg: var(--color-bg-look01);
    --color-comment: var(--color-comment-look01);
    --color-rule: var(--color-rule-look01);
  }

  & .project-look--02 {
    padding-top: calc(120 * var(--rem));
    background: linear-gradient(var(--color-bg-look01), var(--color-bg-look02)) top / 100% calc(120 * var(--rem)) no-repeat, var(--color-bg-look02);
    --color-theme: var(--color-orange);
    --color-theme-bg: var(--color-bg-look02);
    --color-comment: var(--color-comment-look02);
    --color-rule: var(--color-rule-look02);
  }

  & .project-look--02 .project-look__title {
    width: calc(671 * var(--rem));
    margin-inline: auto;
  }

  & .project-look--02 .project-look__lead {
    margin-top: calc(64 * var(--rem));
    font-family: var(--font-base);
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: .1em;
    color: var(--color-theme);
    white-space: nowrap;
    text-align: center;
    padding-left: .1em;
  }

  & .project-look--02 .project-look__photo {
    margin-top: calc(66 * var(--rem));
  }

  & .project-look--02 .section-item--eyedesigner {
    margin-top: calc(57 * var(--rem));
  }

  & .project-look--02 .section-item--eyedesigner .section-item__bubble {
    margin-left: calc(350 * var(--rem));
    padding-top: calc(19 * var(--rem));
    width: calc(380 * var(--rem));
    height: calc(165 * var(--rem));
    background: url(../img/look02-eyedesigner-bubble.png) 0 0 / 100% 100% no-repeat;
  }

  & .project-look--02 .section-item--eyedesigner .section-item__image {
    width: calc(528 * var(--rem));
    margin-inline: auto;
  }

  & .project-look--02 .section-item--eyedesigner .section-item__badge {
    top: calc(290 * var(--rem));
    left: calc(50 * var(--rem));
  }

  & .project-look--02 .section-item--eyedesigner .section-item__name {
    margin-top: calc(26 * var(--rem));
  }

  & .project-look--02 .section-item--eyedesigner .section-item__button {
    margin-top: calc(32 * var(--rem));
  }

  & .project-look--02 .section-item--eyedesigner .section-item__comment-title {
    margin-top: calc(30 * var(--rem));
  }

  & .project-look--02 .section-item--eyedesigner .section-item__comment {
    margin-top: calc(23 * var(--rem));
  }

  & .project-look--02 .section-item--eyedesigner .section-item__comment::before {
    top: calc(-14 * var(--rem));
  }

  & .project-look--02 .section-item--eyedesigner .section-item__comment::after {
    bottom: calc(-15 * var(--rem));
  }

  & .project-look--02 .project-look__pairs {
    margin-top: calc(134 * var(--rem));
  }

  & .project-look--02 .project-look__pair--01 {
    justify-content: flex-end;
  }

  & .project-look--02 .project-look__pair--01 .project-look__pair-image {
    margin-top: calc(19 * var(--rem));
  }

  & .project-look--02 .project-look__pair--01 .project-look__pair-name {
    margin-top: calc(20 * var(--rem));
  }

  & .project-look--02 .project-look__pair--01 .project-look__pair-button {
    margin-top: calc(12 * var(--rem));
  }

  & .project-look--02 .project-look__pair--02 {
    margin-top: calc(80 * var(--rem));
  }

  & .project-look--02 .project-look__pair--02 .project-look__pair-image {
    margin-top: calc(20 * var(--rem));
  }

  & .project-look--02 .project-look__pair--02 .project-look__pair-name {
    margin-top: calc(20 * var(--rem));
  }

  & .project-look--02 .project-look__pair--02 .project-look__pair-button {
    margin-top: calc(12 * var(--rem));
  }

  & .project-look--02 .project-look__marquee {
    margin-top: calc(60 * var(--rem));
  }

  & .project-look--02 .project-look__marquee-track {
    margin-left: calc(-42 * var(--rem));
  }

  & .project-look--02 .section-item--balm {
    margin-top: calc(120 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__visual {
    display: flex;
    align-items: flex-start;
  }

  & .project-look--02 .section-item--balm .section-item__bubble {
    flex: none;
    margin-top: calc(1 * var(--rem));
    margin-left: calc(60 * var(--rem));
    padding-top: calc(24 * var(--rem));
    width: calc(165 * var(--rem));
    height: calc(296 * var(--rem));
    background: url(../img/look02-balm-bubble.png) 0 0 / 100% 100% no-repeat;
  }

  & .project-look--02 .section-item--balm .section-item__bubble-text {
    margin-left: calc(20 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__image {
    width: calc(490 * var(--rem));
    margin-left: calc(5 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__badge {
    top: 0;
    left: calc(570 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__name {
    margin-top: calc(26 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__button {
    margin-top: calc(32 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__comment-title {
    margin-top: calc(30 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__comment {
    margin-top: calc(23 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__comment::before {
    top: calc(-14 * var(--rem));
  }

  & .project-look--02 .section-item--balm .section-item__comment::after {
    bottom: calc(-15 * var(--rem));
  }

  & .project-look--02 .section-item--blush {
    margin-top: calc(95 * var(--rem));
  }

  & .project-look--02 .section-item--blush .section-item__bubble {
    position: absolute;
    z-index: var(--z-base);
    top: calc(40 * var(--rem));
    left: calc(565 * var(--rem));
    padding-top: calc(22 * var(--rem));
    width: calc(165 * var(--rem));
    height: calc(296 * var(--rem));
    background: url(../img/look02-blush-bubble.png) 0 0 / 100% 100% no-repeat;
  }

  & .project-look--02 .section-item--blush .section-item__bubble-text {
    margin-left: calc(55 * var(--rem));
  }

  & .project-look--02 .section-item--blush .section-item__image {
    width: calc(385 * var(--rem));
    margin-inline: auto;
  }

  & .project-look--02 .section-item--blush .section-item__badge {
    top: calc(53 * var(--rem));
    left: calc(50 * var(--rem));
  }

  & .project-look--02 .section-item--blush .section-item__name {
    margin-top: calc(12 * var(--rem));
  }

  & .project-look--02 .section-item--blush .section-item__button {
    margin-top: calc(32 * var(--rem));
  }

  & .project-look--02 .section-item--blush .section-item__comment-title {
    margin-top: calc(29 * var(--rem));
  }

  & .project-look--02 .section-item--blush .section-item__comment {
    margin-top: calc(23 * var(--rem));
  }

  & .project-look--02 .section-item--blush .section-item__comment::before {
    top: calc(-14 * var(--rem));
  }

  & .project-look--02 .section-item--blush .section-item__comment::after {
    bottom: calc(-15 * var(--rem));
  }

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

  & .component-accordion--look02 .component-accordion__heading--eye {
    margin-top: calc(41 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__row--eye {
    margin-top: calc(10 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__row--eye .component-accordion__image {
    margin-top: calc(17 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__heading--cheek {
    margin-top: calc(49 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__row--cheek {
    margin-top: calc(11 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__row--cheek .component-accordion__image {
    margin-top: calc(16 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__heading--lip {
    margin-top: calc(49 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__row--lip {
    margin-top: calc(10 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__row--lip .component-accordion__image {
    margin-top: calc(16 * var(--rem));
  }

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

  & .component-accordion--look02 .component-accordion__frame {
    padding-top: calc(141 * var(--rem));
    padding-bottom: calc(116 * var(--rem));
  }

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

  & .component-accordion--look02 .component-accordion__more .component-accordion__icon {
    margin-top: calc(4 * var(--rem));
  }

  & .component-accordion--look02 .component-accordion__close .component-accordion__icon {
    margin-top: calc(5 * var(--rem));
  }

  & .project-credit {
    background: var(--color-bg-look02);
    padding-top: calc(117 * var(--rem));
    padding-bottom: calc(99 * var(--rem));
  }

  & .project-credit__button a {
    display: grid;
    place-items: center;
    width: calc(580 * var(--rem));
    height: calc(120 * var(--rem));
    margin-inline: auto;
    background: var(--color-gold);
    font-family: var(--font-latin);
    font-size: calc(42 * var(--rem));
    line-height: 1;
    letter-spacing: .05em;
    color: #fff;
    white-space: nowrap;
    text-align: center;
    padding-left: .05em;
  }

  & .project-credit__staff {
    margin-top: calc(84 * var(--rem));
    font-family: var(--font-base);
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: .1em;
    color: var(--color-brown);
    white-space: nowrap;
    text-align: center;
    padding-left: .1em;
  }

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

  & .project-credit__copyright {
    margin-top: calc(40 * var(--rem));
    font-family: var(--font-credit);
    font-size: calc(24 * var(--rem));
    line-height: 1.0421;
    letter-spacing: .05em;
    color: var(--color-brown);
    white-space: nowrap;
    text-align: center;
    padding-left: .05em;
  }

  & .project-rail-logo {
    position: relative;
    width: calc(240 * var(--rem-pc));
  }

  & .project-rail-logo__image {
    transition: opacity .8s var(--transition-timing);
  }

  & .project-rail-logo__image--look02 {
    position: absolute;
    inset: 0;
    opacity: 0;
  }

  & .project-rail-nav__list {
    display: flex;
    column-gap: calc(50 * var(--rem-pc));
  }

  & .project-rail-nav__item {
    background: var(--color-rail);
    transition: background-color .8s var(--transition-timing);
  }

  & .project-rail-nav__link {
    display: grid;
    justify-items: center;
    width: calc(120 * var(--rem-pc));
  }

  & .project-rail-nav__label {
    margin-top: calc(13 * var(--rem-pc));
    font-family: var(--font-title);
    font-size: calc(18 * var(--rem-pc));
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: .05em;
    color: var(--color-rail-theme);
    white-space: nowrap;
    transition: color .8s var(--transition-timing);
    text-align: center;
    padding-left: .05em;
  }

  & .project-rail-nav__arrow {
    width: calc(22 * var(--rem-pc));
    height: calc(22 * var(--rem-pc));
    margin-top: calc(8 * var(--rem-pc));
    border-radius: 50%;
    background: var(--color-rail-theme) url(../img/icon-chevron.png) center / 100% no-repeat;
    transition: background-color .8s var(--transition-timing);
  }

  & .project-footer-nav {
    position: fixed;
    z-index: var(--z-sticky);
    bottom: 0;
    left: 0;
    visibility: hidden;
    width: 100%;
    translate: 0 100%;
    transition: translate .4s var(--transition-timing), visibility 0s linear .4s;
  }

  & .project-footer-nav.is-visible {
    visibility: visible;
    translate: 0 0;
    transition: translate .4s var(--transition-timing), visibility 0s;
  }

  & .project-footer-nav__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    height: calc(90 * var(--rem));
    background: var(--color-pink);
  }

  & .project-footer-nav__item + .project-footer-nav__item {
    border-left: calc(2 * var(--rem)) solid #fff;
  }

  & .project-footer-nav__link {
    display: flex;
    align-items: center;
    column-gap: calc(30 * var(--rem));
    height: 100%;
    padding-left: calc(50 * var(--rem));
  }

  & .project-footer-nav__icon {
    width: calc(60 * var(--rem));
    flex: none;
  }

  & .project-footer-nav__label {
    font-family: var(--font-title);
    font-size: calc(40 * var(--rem));
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: .05em;
    color: #fff;
    white-space: nowrap;
  }

  & .project-look--01 .section-item__comment::before {
    background-image: url(../img/look01-quote-open.png);
  }

  & .project-look--01 .section-item__comment::after {
    background-image: url(../img/look01-quote-close.png);
  }

  & .component-accordion--look01 .component-accordion__body::after {
    background: linear-gradient(to bottom, rgb(252 248 247 / 0) 0%, rgb(252 248 247 / 0.24) 8.3%, rgb(252 248 247 / 0.435) 16.7%, rgb(252 248 247 / 0.59) 25%, rgb(252 248 247 / 0.72) 33.3%, rgb(252 248 247 / 0.815) 41.7%, rgb(252 248 247 / 0.886) 50%, rgb(252 248 247 / 0.933) 58.3%, rgb(252 248 247 / 0.969) 66.7%, rgb(252 248 247 / 0.988) 75%, rgb(252 248 247 / 0.996) 83.3%, rgb(252 248 247 / 1) 100%);
  }

  & .project-look--02 .section-item__comment::before {
    background-image: url(../img/look02-quote-open.png);
  }

  & .project-look--02 .section-item__comment::after {
    background-image: url(../img/look02-quote-close.png);
  }

  & .component-accordion--look02 .component-accordion__body::after {
    background: linear-gradient(to bottom, rgb(250 248 242 / 0) 0%, rgb(250 248 242 / 0.24) 8.3%, rgb(250 248 242 / 0.435) 16.7%, rgb(250 248 242 / 0.59) 25%, rgb(250 248 242 / 0.72) 33.3%, rgb(250 248 242 / 0.815) 41.7%, rgb(250 248 242 / 0.886) 50%, rgb(250 248 242 / 0.933) 58.3%, rgb(250 248 242 / 0.969) 66.7%, rgb(250 248 242 / 0.988) 75%, rgb(250 248 242 / 0.996) 83.3%, rgb(250 248 242 / 1) 100%);
  }

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

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

  & :where(.project-look__photo, .project-look__pair-photo, .project-look__pair-image, .section-item__image) > a {
    display: block;
  }

  & .project-look__marquee {
    overflow: hidden;
  }

  & .project-look__marquee-track {
    --size-marquee: calc(883 * var(--rem));
    display: flex;
    width: max-content;
    animation: project-marquee var(--duration-marquee) linear infinite;
  }

  & .project-look__marquee-image {
    flex: none;
    width: var(--size-marquee);
  }

  & .section-item__visual {
    position: relative;
  }

  & .section-item__image {
    background: var(--color-theme-bg);
  }

  & .section-item__bubble--horizontal {
    text-align: center;
  }

  & .section-item__bubble-text {
    font-family: var(--font-base);
    font-size: calc(26 * var(--rem));
    line-height: 1.75;
    letter-spacing: .1em;
    color: var(--color-theme);
    white-space: nowrap;
  }

  & .section-item__bubble--horizontal .section-item__bubble-text {
    display: inline-block;
    padding-left: .1em;
  }

  & .section-item__bubble--vertical .section-item__bubble-text {
    display: block;
    writing-mode: vertical-rl;
    white-space: nowrap;
    font-feature-settings: "vpal";
  }

  & .section-item__badge {
    position: absolute;
    z-index: var(--z-base);
    display: grid;
    place-items: center;
    width: calc(150 * var(--rem));
    height: calc(150 * var(--rem));
    border-radius: 50%;
    background: var(--color-theme);
    font-family: var(--font-title);
    font-size: calc(28 * var(--rem));
    font-weight: 500;
    line-height: 1.1946;
    letter-spacing: .025em;
    color: #fff;
    white-space: nowrap;
    text-align: center;
    padding-left: .025em;
  }

  & .section-item__name {
    font-family: var(--font-base);
    font-size: calc(28 * var(--rem));
    line-height: 2;
    letter-spacing: .125em;
    color: var(--color-brown);
    white-space: nowrap;
    text-align: center;
    padding-left: .125em;
  }

  & .section-item__name a {
    letter-spacing: .125em;
  }

  & .section-item__price {
    letter-spacing: .1em;
  }

  & .section-item__button a {
    display: grid;
    place-items: center;
    width: calc(206 * var(--rem));
    height: calc(60 * var(--rem));
    margin-inline: auto;
    background: var(--color-gold);
    font-size: calc(28 * var(--rem));
    line-height: 1;
    letter-spacing: .05em;
    color: #fff;
    white-space: nowrap;
    text-align: center;
    padding-left: .05em;
  }

  & .section-item__comment-title {
    font-family: var(--font-title);
    font-size: calc(60 * var(--rem));
    font-weight: 700;
    line-height: 1.3608;
    letter-spacing: .025em;
    color: var(--color-comment);
    white-space: nowrap;
    text-align: center;
    padding-left: .025em;
  }

  & .section-item__comment {
    position: relative;
    width: calc(600 * var(--rem));
    margin-inline: auto;
    font-family: var(--font-base);
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: .1em;
    color: var(--color-theme);
    white-space: nowrap;
    text-align: center;
    padding-left: .1em;
  }

  & :where(.section-item__comment)::before, :where(.section-item__comment)::after {
    position: absolute;
    width: calc(50 * var(--rem));
    height: calc(75 * var(--rem));
    background: 0 0 / 100% 100% no-repeat;
    content: "";
  }

  & .section-item__comment::before {
    left: calc(-50 * var(--rem));
  }

  & .section-item__comment::after {
    right: calc(-50 * var(--rem));
  }

  & .component-accordion__body {
    position: relative;
    max-height: calc(466 * var(--rem));
    overflow: hidden;
    transition: max-height .6s var(--transition-timing);
  }

  & .component-accordion__body::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(150 * var(--rem));
    content: "";
    pointer-events: none;
    transition: opacity .4s var(--transition-timing);
  }

  & .component-accordion.is-open .component-accordion__body::after {
    opacity: 0;
  }

  & .component-accordion__frame {
    width: calc(742 * var(--rem));
    margin-inline: auto;
    border: calc(2 * var(--rem)) solid var(--color-rule);
    border-radius: calc(371 * var(--rem));
  }

  & .component-accordion__title {
    width: calc(455 * var(--rem));
    margin-inline: auto;
  }

  & .component-accordion__heading {
    display: flex;
    align-items: flex-start;
    width: calc(540 * var(--rem));
    margin-inline: auto;
  }

  & .component-accordion__heading::before, .component-accordion__heading::after {
    flex: 1;
    height: calc(2 * var(--rem));
    margin-top: calc(28 * var(--rem));
    background: var(--color-rule);
    content: "";
  }

  & .component-accordion__heading-text {
    width: calc(200 * var(--rem));
    font-family: var(--font-base);
    font-size: calc(28 * var(--rem));
    line-height: 2.0625;
    letter-spacing: .05em;
    color: var(--color-theme);
    white-space: nowrap;
    text-align: center;
    padding-left: .05em;
  }

  & .component-accordion__heading--cheek .component-accordion__heading-text {
    width: calc(250 * var(--rem));
  }

  & .component-accordion__row {
    display: flex;
    column-gap: calc(40 * var(--rem));
    margin-left: calc(49 * var(--rem));
  }

  & .component-accordion__image {
    flex: none;
    width: calc(160 * var(--rem));
    background: var(--color-theme-bg);
  }

  & .component-accordion__image a {
    display: block;
  }

  & .component-accordion__text {
    width: calc(420 * var(--rem));
    font-family: var(--font-base);
    font-size: calc(26 * var(--rem));
    line-height: 2.2;
    letter-spacing: .1em;
    color: var(--color-theme);
    white-space: nowrap;
  }

  & .component-accordion__more, .component-accordion__close {
    display: flex;
    align-items: flex-start;
    column-gap: calc(14 * var(--rem));
    margin-inline: auto;
    font-family: var(--font-base);
    font-size: calc(24 * var(--rem));
    line-height: 2;
    letter-spacing: .05em;
    color: var(--color-theme);
    white-space: nowrap;
  }

  & .component-accordion__more {
    width: calc(191 * var(--rem));
  }

  & .component-accordion__close {
    width: calc(132 * var(--rem));
  }

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

  & .component-accordion__icon {
    flex: none;
    width: calc(40 * var(--rem));
    height: calc(40 * var(--rem));
    border-radius: 50%;
    background: var(--color-theme) center / 100% no-repeat;
  }

  & .component-accordion__icon--more {
    background-image: url(../img/icon-more.png);
  }

  & .component-accordion__icon--close {
    background-image: url(../img/icon-close.png);
  }

  & .component-accordion__more:focus-visible, .component-accordion__close:focus-visible {
    outline: 2px solid var(--color-theme);
    outline-offset: 2px;
  }
}

.lp_contents.is-look02 {
  & .project-rail-logo__image--look01 {
    opacity: 0;
  }

  & .project-rail-logo__image--look02 {
    opacity: 1;
  }
}

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

@keyframes project-marquee {
  to {
    translate: calc(-1 * var(--size-marquee)) 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js .lp_contents,
  .lp_contents {
    & .ani-fadein,
    & .ani-fadeup {
      opacity: 1;
      translate: 0 0;
      filter: none;
      transition: none;
    }

    & .project-look__marquee-track {
      animation: none;
    }
  }
}