@charset "UTF-8";
/* ==========================================================================
   エントリ: 各レイヤーは _index.scss で @forward 済み
   ========================================================================== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 標準的なリセット */
html {
  -webkit-text-size-adjust: 100%;
  line-height: 1.15;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: inherit;
  line-height: inherit;
}

/* リストスタイルのリセット */
ul,
ol {
  list-style: none;
}

/* 画像のレスポンシブ対応 */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* テーブルのリセット */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* フォーム要素のフォント継承 */
input,
button,
textarea,
select {
  font: inherit;
}

/* リンクのデフォルトスタイルリセット */
a {
  text-decoration: none;
  color: inherit;
}

/* 見出しのマージンリセット */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/* iOS Safari タップ遅延の解消 */
a,
button,
input[type=button],
input[type=submit] {
  touch-action: manipulation;
}

/* フォーム要素のデフォルトスタイルリセット */
input,
select,
textarea {
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
}

/* タップ時のハイライトを無効化 */
a,
button {
  -webkit-tap-highlight-color: transparent;
}

:root {
  /* ========================================
     フォント
     ======================================== */
  --font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-family-serif: "Shippori Mincho", serif;
  --font-weight-normal: 400;
  --font-weight-bold: 600;
  --font-size-base-pc: calc(24 / 1300 * 100cqw); /* 26px / 1016px * 100 */
  --font-size-large-cqw: 4cqw; /* 16px / 400px * 100 */
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.7;
  /* ========================================
     色
     ======================================== */
  --color-text: #333;
  --color-accent: #d5b146;
  /* ========================================
     スペーシング（マージン）
     ======================================== */
  --margin-bottom-text: 6.4cqw; /* 24px / 375px * 100 */
  --margin-bottom-paragraph: 2.82cqw; /* 10px / 375px * 100 */
  /* ========================================
     スペーシング（マージン - パターン化）
     ======================================== */
  --margin-12: 3.38cqw; /* 12px / 375px * 100 */
  --margin-16: 4.51cqw; /* 16px / 375px * 100 */
  --margin-24: 6.76cqw; /* 24px / 375px * 100 */
  --margin-32: 9.01cqw; /* 32px / 375px * 100 */
  --margin-48: 13.52cqw; /* 48px / 375px * 100 */
  --margin-56: 15.77cqw; /* 56px / 375px * 100 */
  --margin-64: 18.03cqw; /* 64px / 375px * 100 */
  /* ========================================
     フォント（追加）
     ======================================== */
  --font-family-sans: "Hiragino Kaku Gothic Pro", sans-serif;
  --font-weight-light: 300;
}

body {
  font-family: var(--font-family-base);
}

.l-container {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
  container-type: inline-size;
  container-name: global-container;
}

.l-section-container {
  width: 100%;
  max-width: 1021px;
  margin-inline: auto;
}

.l-section-container {
  margin-bottom: clamp(0px, 22.54cqw, 124px);
}
@media (min-width: 768px) {
  .l-section-container {
    margin-bottom: 0;
  }
}

.l-section-container--padded {
  padding-left: 10px;
  padding-right: 10px;
}
@media (min-width: 768px) {
  .l-section-container--padded {
    padding-left: 1.5384615385cqw;
    padding-right: 1.5384615385cqw;
  }
}
@media (min-width: 1260px) {
  .l-section-container--padded {
    padding-left: 0;
    padding-right: 0;
  }
}

/* Footer Layout */
.l-footer {
  font-family: var(--font-family-sans);
  font-weight: var(--font-weight-light);
}

.l-footer .l-section-container {
  display: grid;
  gap: var(--margin-48);
}

.l-footer__border {
  margin-top: var(--margin-64);
  margin-bottom: 12.8cqw;
}
@media (min-width: 768px) {
  .l-footer__border {
    margin-top: clamp(0px, 4.6153846154cqw, 60px);
    margin-bottom: clamp(0px, 7.6923076923cqw, 100px);
  }
}

/* Copyright */
.l-footer__copyright {
  font-family: "Libre Baskerville", serif;
  font-size: 2.6666666667cqw;
  font-weight: 400;
  text-align: center;
  margin-top: 14.4cqw;
  margin-bottom: 4.2666666667cqw;
}
@media (min-width: 768px) {
  .l-footer__copyright {
    font-size: clamp(0px, 1.7692307692vw, 23px);
    margin-top: clamp(0px, 6.6153846154vw, 86px);
    margin-bottom: clamp(0px, 7.5384615385vw, 98px);
  }
}

.l-footer__hotpepper-logo {
  width: 26.6666666667cqw;
  height: auto;
}
@media (min-width: 768px) {
  .l-footer__hotpepper-logo {
    /* width: clamp(0px, calc(154 / 1300 * 100cqw), 154px); */
    width: 154px;
  }
}

/* Salon Section */
.l-footer__salon {
  display: grid;
  gap: var(--margin-24);
  text-align: center;
}
@media (min-width: 768px) {
  .l-footer__salon {
    display: block;
  }
}

.l-footer__salon-contact {
  display: flex;
  justify-content: center;
}
@media (min-width: 768px) {
  .l-footer__salon-contact {
    margin-bottom: clamp(0px, 2.7692307692vw, 36px);
  }
}

.l-footer__salon-header {
  display: grid;
  gap: 1.0666666667cqw;
}
@media (min-width: 768px) {
  .l-footer__salon-header {
    margin-bottom: clamp(0px, 2.7692307692vw, 36px);
  }
}

.l-footer__salon-name {
  margin-inline: auto;
}
@media (min-width: 768px) {
  .l-footer__salon-name {
    width: clamp(0px, 17.3846153846cqw, 226px);
  }
}

.l-footer__salon-name-img {
  width: 100%;
  height: auto;
}

.l-footer__salon-qr {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4.2666666667cqw;
}
@media (min-width: 768px) {
  .l-footer__salon-qr {
    gap: 12px;
  }
}

.l-footer__salon-services {
  font-family: var(--font-family-sans);
  font-size: 3.2cqw;
  font-weight: var(--font-weight-light);
  margin: 0;
}
@media (min-width: 768px) {
  .l-footer__salon-services {
    font-size: clamp(0px, 2.2307692308cqw, 29px);
    margin-bottom: clamp(0px, 3.6923076923vw, 48px);
  }
}

/* Social Media Section */
.l-footer__social {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6.4cqw;
  width: 90.4cqw;
  margin-inline: auto;
}

.l-footer__social-icon {
  width: 16cqw;
  height: auto;
  max-width: 88px;
}

.l-footer__social-item {
  display: grid;
  grid-template-columns: 2fr 5fr;
  justify-items: center;
  align-items: center;
}
@media (min-width: 768px) {
  .l-footer__social-item {
    grid-template-columns: 88px 170px;
    width: fit-content;
    gap: clamp(0px, 2.7692307692vw, 36px);
  }
}
.l-footer__social-item > a {
  display: contents;
}

.l-footer__social-item.-left {
  padding-left: 4cqw;
}
@media (min-width: 768px) {
  .l-footer__social-item.-left {
    padding-left: 0;
    justify-self: end;
  }
}

.l-footer__tel-image {
  width: 76cqw;
  height: auto;
}
@media (min-width: 768px) {
  .l-footer__tel-image {
    width: clamp(0px, 69cqw, 897px);
  }
}

.l-footer__qr-code {
  width: 26.6666666667cqw;
  height: auto;
}
@media (min-width: 768px) {
  .l-footer__qr-code {
    /* width: clamp(0px, calc(170 / 1300 * 100cqw), 170px); */
    width: 170px;
  }
}
.l-footer__qr-code.-insta {
  padding-left: 1.3333333333cqw;
}
@media (min-width: 768px) {
  .l-footer__qr-code.-insta {
    padding-left: 1px;
  }
}
.l-footer__qr-code.-line {
  padding-left: 2.9333333333cqw;
  margin-left: -1.8666666667cqw;
}
@media (min-width: 768px) {
  .l-footer__qr-code.-line {
    padding-left: 0;
    margin-left: 0;
  }
}

/* Button Component */
.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1em 3.5em;
  /* padding: 0.86em 2.57em; */
  background-color: #c8427b;
  border-radius: 1.0666666667cqw;
  color: #ffffff;
  font-family: var(--font-family-base);
  font-weight: var(--font-weight-bold);
  font-size: 5.3333333333cqw;
  text-align: center;
  text-decoration: none;
  line-height: 1;
}
@media (min-width: 768px) {
  .c-button {
    font-size: clamp(0px, 2vw, 26px);
    padding: 0;
    width: clamp(0px, 36.3076923077vw, 472px);
    height: clamp(0px, 7.0769230769vw, 92px);
    border-radius: 0.5cqw;
  }
}

/* Section Title Component */
.c-section-title {
  margin: 0 auto var(--margin-24);
}

.c-section-title__image {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* c-border */
.c-border {
  width: 100%;
  height: 1px;
  background-color: #ccc;
}

/* c-closing-message */
.c-closing-message {
  font-family: var(--font-family-serif);
  font-weight: var(--font-weight-bold);
  font-size: 4cqw;
  line-height: var(--line-height-relaxed);
  color: var(--color-accent);
}
@media (min-width: 400px) {
  .c-closing-message {
    font-size: var(--font-size-large-cqw);
  }
}
@media (min-width: 768px) {
  .c-closing-message {
    font-size: 3cqw;
  }
}

/* c-text-spacing */
.c-narrow-after {
  margin-left: -0.7em;
}

/* Modal Component */
.c-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1000;
}

.c-modal.is-open {
  display: grid;
  place-items: center;
}

.c-modal__body {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 6.4cqw;
}
@media (min-width: 768px) {
  .c-modal__body {
    gap: 2.4615384615cqw;
  }
}

.c-modal__button {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 2.1333333333cqw;
  padding: 5.3333333333cqw 4.2666666667cqw;
  background-color: #c8427b;
  border-radius: 2.1333333333cqw;
  color: #ffffff;
  text-decoration: none;
  transition: opacity 0.2s;
  /* min-height: calc(80 / 375 * 100cqw); */
}
@media (min-width: 768px) {
  .c-modal__button {
    gap: 0.7692307692cqw;
    padding: clamp(0px, 2.4615384615cqw, 22px);
    border-radius: 0.6153846154cqw;
    min-height: 7.6923076923cqw;
  }
}
.c-modal__button:hover {
  opacity: 0.9;
}
.c-modal__button:active {
  opacity: 0.8;
}

.c-modal__button-text {
  font-family: var(--font-family-base);
  font-weight: var(--font-weight-normal);
  font-size: 3.2cqw;
  line-height: 1.5;
  text-align: center;
}
@media (min-width: 768px) {
  .c-modal__button-text {
    font-size: clamp(16px, 1.2307692308cqw, 100px);
  }
}

.c-modal__button-title {
  font-family: var(--font-family-base);
  font-weight: var(--font-weight-bold);
  font-size: 3.7333333333cqw;
  line-height: 1.5;
  text-align: center;
}
@media (min-width: 768px) {
  .c-modal__button-title {
    font-size: clamp(20px, 1.5384615385cqw, 100px);
    /* font-size: clamp(0px, calc(18 / 1300 * 100cqw), 20px); */
  }
}

.c-modal__buttons {
  display: grid;
  gap: 5.3333333333cqw;
  width: fit-content;
}
@media (min-width: 768px) {
  .c-modal__buttons {
    gap: 3.0769230769cqw;
  }
}

.c-modal__close {
  position: absolute;
  top: 4.2666666667cqw;
  right: 4.2666666667cqw;
  width: 8.5333333333cqw;
  height: 8.5333333333cqw;
  background: none;
  border: none;
  font-size: 6.4cqw;
  cursor: pointer;
  color: #333;
  display: grid;
  place-items: center;
  line-height: 1;
  z-index: 10;
}
@media (min-width: 768px) {
  .c-modal__close {
    top: 1.5384615385cqw;
    right: 1.5384615385cqw;
    width: 3.0769230769cqw;
    height: 3.0769230769cqw;
    font-size: 2.4615384615cqw;
  }
}
.c-modal__close:hover {
  opacity: 0.7;
}

.c-modal__content {
  position: relative;
  max-height: 90vh;
  background-color: #ffffff;
  border-radius: 2.1333333333cqw;
  padding: 8.5333333333cqw 4.2666666667cqw;
  display: grid;
  width: fit-content;
}
@media (min-width: 768px) {
  .c-modal__content {
    border-radius: 0.6153846154cqw;
    padding: 3.8461538462cqw 3.8461538462cqw 6.1538461538cqw;
  }
}

.c-modal__logo {
  margin-top: 4.2666666667cqw;
  width: 32cqw;
}
@media (min-width: 768px) {
  .c-modal__logo {
    margin-top: 1.5384615385cqw;
    width: 15.3846153846cqw;
    max-width: 180px;
  }
}

.c-modal__logo-image {
  width: 100%;
  height: auto;
  justify-self: center;
}

/* ==========================================================================
   Animations（FV / スクロール reveal / ボタンホバー）
   ========================================================================== */
/* ----- FV: 初期非表示 ----- */
.p-fv__bg-image,
.p-fv__logo,
.p-fv__text,
.p-fv__title-image {
  opacity: 0;
}

/* ----- FV: JS でクラスが付いたとき animation 開始 ----- */
.is-fv-animated .p-fv__bg-image {
  will-change: opacity;
  animation: fv-bg-gentle 2.1s ease-out forwards;
}

.is-fv-animated .p-fv__logo {
  will-change: opacity;
  animation: fv-text-rise 1.8s ease-in-out 0.5s forwards;
}

.is-fv-animated .p-fv__text {
  will-change: opacity;
  animation: fv-text-rise 1.9s ease-in-out 0.9s forwards;
}

.is-fv-animated .p-fv__title-image {
  will-change: opacity;
  animation: fv-text-rise 2s ease-in-out 1.3s forwards;
}

/* ----- スマホ: 速めに表示 ----- */
@media (max-width: 767px) {
  .is-fv-animated .p-fv__bg-image {
    animation-duration: 1.2s;
  }
  .is-fv-animated .p-fv__logo {
    animation-duration: 1s;
    animation-delay: 0.15s;
  }
  .is-fv-animated .p-fv__text {
    animation-duration: 1.1s;
    animation-delay: 0.35s;
  }
  .is-fv-animated .p-fv__title-image {
    animation-duration: 1.15s;
    animation-delay: 0.55s;
  }
}
/* ----- FV keyframes ----- */
@keyframes fv-bg-gentle {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fv-text-rise {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* ----- スクロール reveal ----- */
/* 初期状態をここに統合 */
.l-section-container:not(.p-menu),
.p-menu__title,
.p-menu-description,
.p-menu-intro,
.p-menu__lead,
.p-menu__item,
.p-menu__button,
.p-access__button,
.l-footer__salon,
.l-footer__social-item {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease, transform 0.7s ease;
  will-change: opacity, transform;
}

/* 発火時の状態 */
.l-section-container.is-visible:not(.p-menu),
.p-menu__title.is-visible,
.p-menu-description.is-visible,
.p-menu-intro.is-visible,
.p-menu__lead.is-visible,
.p-menu__item.is-visible,
.p-menu__button.is-visible,
.p-access__button.is-visible,
.l-footer__salon.is-visible,
.l-footer__social-item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ----- ボタンホバー（ポインタが使える環境のみ） ----- */
@media (hover: hover) and (pointer: fine) {
  .c-button,
  .c-modal__button {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    will-change: transform;
  }
  .c-button:hover,
  .c-button:focus-visible,
  .c-modal__button:hover,
  .c-modal__button:focus-visible {
    animation: pico-float 0.45s ease-out forwards;
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18);
  }
  @keyframes pico-float {
    0% {
      transform: translateY(0) scale(1);
    }
    45% {
      transform: translateY(-6px) scale(1.035);
    }
    100% {
      transform: translateY(-4px) scale(1.02);
    }
  }
}
/* ----- アクセシビリティ: 視差効果を減らす（重要） ----- */
@media (prefers-reduced-motion: reduce) {
  .p-fv__bg-image,
  .p-fv__logo,
  .p-fv__text,
  .p-fv__title-image,
  .l-section-container:not(.p-menu),
  .p-menu__title,
  .p-menu-description,
  .p-menu-intro,
  .p-menu__lead,
  .p-menu__item,
  .p-menu__button,
  .p-access__button,
  .l-footer__salon,
  .l-footer__social-item,
  .c-button,
  .c-modal__button {
    transition: none !important;
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
}
/* p-fv */
.p-fv {
  width: 100%;
  margin-bottom: 8.5333333333cqw;
  /* aspect-ratio: 375 / 262; */
}
@media (min-width: 768px) {
  .p-fv {
    margin-bottom: 6.1538461538vw;
  }
}

.p-fv__grid-container {
  display: grid;
  width: 100%;
  max-width: 1920px;
  container-type: inline-size;
  container-name: fv-container;
  margin-inline: auto;
}
.p-fv__grid-container > * {
  grid-area: 1/-1;
}

.p-fv__bg-image {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.p-fv__logo {
  justify-self: center;
}

.p-fv__logo-image {
  margin-top: 5.2cqw;
  width: 22.6666666667cqw;
}
@container fv-container (min-width: 768px) {
  .p-fv__logo-image {
    margin-top: 5.2307692308cqw;
    width: 22.9230769231cqw;
  }
}

.p-fv__text {
  font-family: var(--font-family-serif);
  font-weight: var(--font-weight-normal);
  font-size: 2.6666666667cqw;
  line-height: var(--line-height-relaxed);
  color: var(--color-text);
  margin-top: 40cqw;
  justify-self: center;
}
@container fv-container (min-width: 768px) {
  .p-fv__text {
    margin-top: 40.0769230769cqw;
    font-size: 2.5384615385cqw;
  }
}

.p-fv__title-image {
  width: 62.9333333333cqw;
  justify-self: center;
  margin-top: 48.2666666667cqw;
}
@container fv-container (min-width: 768px) {
  .p-fv__title-image {
    margin-top: 52.8461538462cqw;
    width: 42.4731182796cqw;
  }
}

.p-fv__image-pc {
  width: 100%;
  height: 100%;
}

/* p-before */
.p-before {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}
.p-before > * {
  grid-area: 1/-1;
}
@media (min-width: 768px) {
  .p-before {
    margin-bottom: 9.6923076923cqw;
  }
}

.p-before__bg-image {
  align-self: start;
  justify-self: start;
  margin-top: 0;
  padding-left: 2.6666666667cqw;
  padding-right: 1.6cqw;
  z-index: 0;
}

.p-before__bg-image-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-before__texts {
  align-self: start;
  justify-self: start;
  margin-left: 0.27cqw;
  margin-top: 51.47cqw;
  padding: 0 5.3333333333cqw;
  width: 100%;
  z-index: 2;
}
@media (min-width: 1024px) {
  .p-before__texts {
    margin-top: 46.1538461538cqw;
    /* padding: 0 calc(28 / 1300 * 100cqw); */
    letter-spacing: -0.12em;
  }
}

.p-before__text {
  font-family: var(--font-family-serif);
  font-weight: var(--font-weight-normal);
  font-size: 13px;
  line-height: var(--line-height-normal);
  color: var(--color-text);
  margin-bottom: var(--margin-bottom-text);
}
@media (min-width: 400px) {
  .p-before__text {
    font-size: clamp(13px, 3.25cqw, 20px);
    margin-bottom: 4.6153846154cqw;
  }
}
@media (min-width: 768px) {
  .p-before__text {
    font-size: 1.7692307692cqw;
    line-height: 1.9;
    letter-spacing: -0.05em;
  }
}
@media (min-width: 1024px) {
  .p-before__text {
    /* font-size: calc(24 / 1300 * 100cqw); */
  }
}
.p-before__text .p-before__message {
  /* padding: 0 calc(10 / 375 * 100cqw); */
}

/* p-cinderella */
.p-cinderella {
  width: 100%;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .p-cinderella {
    margin-bottom: 15.6709108717cqw;
  }
}

.p-cinderella__catch {
  align-self: start;
  justify-self: start;
  margin-left: 7.32cqw; /* 26px / 375px * 100 */
  margin-top: 20.5680705191cqw;
  width: 46.2cqw; /* 164px / 375px * 100 */
  height: 12.68cqw; /* 45px / 375px * 100 */
  z-index: 1;
}

.p-cinderella__catch-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-cinderella__flower {
  align-self: start;
  justify-self: start;
  margin-left: 79.4666666667cqw; /* 283px / 375px * 100 */
  width: 21.41cqw; /* 76px / 375px * 100 */
  height: auto;
  position: absolute;
  top: 51.4201762977cqw;
  /* right: 0; */
  z-index: 3;
}
@media (min-width: 1021px) {
  .p-cinderella__flower {
    margin-left: 82.3702252693cqw;
    width: 21.0577864838cqw;
  }
}

.p-cinderella__flowe-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-cinderella__grid-container {
  display: grid;
  align-items: start;
  container-type: inline-size;
  container-name: cinderella-grid;
}
.p-cinderella__grid-container > * {
  grid-area: 1/-1;
}

.p-cinderella__image {
  width: 100%; /* 375px / 375px * 100 */
  height: auto; /* 286px / 375px * 100 */
  max-width: 1021px;
  z-index: 0;
}
@media (min-width: 768px) {
  .p-cinderella__image {
    padding-left: 0.9794319295cqw;
  }
}

.p-cinderella__image-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-cinderella__images {
  display: grid;
  position: relative;
  container-type: inline-size;
  container-name: cinderella-container;
}
.p-cinderella__images > * {
  grid-area: 1/-1;
}

.p-cinderella__text {
  font-family: var(--font-family-serif);
  font-weight: var(--font-weight-normal);
  font-size: 3.661971831cqw;
  line-height: var(--line-height-relaxed);
  color: var(--color-text);
  margin-bottom: var(--margin-bottom-paragraph);
}
@media (min-width: 768px) {
  .p-cinderella__text {
    font-size: clamp(13px, 2.2526934378cqw, 20px);
    line-height: 1.9;
    letter-spacing: -0.02em;
  }
}
@media (min-width: 768px) {
  .p-cinderella__text {
    font-size: clamp(13px, 2.2526934378cqw, 23px);
    line-height: 1.9;
    letter-spacing: -0.02em;
  }
}

.p-cinderella__text:last-child {
  margin-bottom: 0;
}

.p-cinderella__texts {
  align-self: start;
  justify-self: start;
  margin-left: 0;
  margin-bottom: var(--margin-bottom-text);
  width: 100%; /* 375px / 375px * 100 */
  padding: 0 2.8169014085cqw;
}
@media (min-width: 768px) {
  .p-cinderella__texts {
    margin-bottom: clamp(0px, 4.8971596474vw, 50px);
  }
}

.p-cinderella__texts-wrapper {
  z-index: 10;
  margin-top: 54.3584720862cqw; /* 258px / 1021px * 100 */
}
@media (min-width: 768px) {
  .p-cinderella__texts-wrapper {
    margin-bottom: 0;
  }
}

.p-cinderella__title {
  margin-inline: auto;
  width: 67.61cqw; /* 240px / 375px * 100 */
  z-index: 3;
}
@media (min-width: 768px) {
  .p-cinderella__title {
    width: 41.52791381cqw;
    margin-bottom: 4.8971596474cqw;
  }
}

.p-cinderella__title-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-cinderella__voice {
  display: grid;
  gap: 0.8em;
  padding: 0 2.8169014085cqw;
}

.p-cinderella__voice-content {
  font-size: 4.5070422535cqw;
}
@media (min-width: 400px) {
  .p-cinderella__voice-content {
    font-size: var(--font-size-large-cqw);
  }
}
@media (min-width: 768px) {
  .p-cinderella__voice-content {
    font-size: 3cqw;
  }
}

/* p-title */
.p-title {
  font-family: var(--font-family-serif);
  font-weight: var(--font-weight-bold);
  font-size: 18px;
  line-height: var(--line-height-relaxed);
  color: var(--color-accent);
  text-align: center;
  width: 100%;
}
@container global-container (min-width: 400px) {
  .p-title {
    font-size: 4.5cqw;
  }
}

.p-concept {
  width: 100%;
  font-family: var(--font-family-serif);
}
@media (min-width: 768px) {
  .p-concept {
    margin-bottom: 18.4615384615cqw;
  }
}

.p-concept__bg-image {
  width: 100%;
  z-index: 0;
}

.p-concept__bg-image-sp {
  width: 100%;
  height: 100%;
}
@media (min-width: 768px) {
  .p-concept__bg-image-sp {
    display: none;
  }
}

.p-concept__bg-image-pc {
  width: 100%;
  height: 100%;
  display: none;
}
@media (min-width: 768px) {
  .p-concept__bg-image-pc {
    display: block;
  }
}

.p-concept__content {
  z-index: 1;
  text-align: center;
  margin-top: 52.04cqw;
}
@media (min-width: 768px) {
  .p-concept__content {
    margin-top: 52.889324192cqw;
  }
}

.p-concept__contents {
  display: grid;
  align-items: start;
  container-type: inline-size;
  container-name: concept-contents;
}
.p-concept__contents > * {
  grid-area: 1/1;
}

.p-concept__lead {
  font-family: var(--font-family-serif);
  font-weight: var(--font-weight-bold);
  font-size: 5.0704225352cqw;
  line-height: var(--line-height-relaxed);
  color: var(--color-accent);
  margin-bottom: var(--margin-16);
}

@media (min-width: 768px) {
  .p-concept__lead {
    font-size: 4.0156709109cqw;
  }
}
.p-concept__text {
  font-family: var(--font-family-serif);
  font-weight: 500;
  font-size: 3.3802816901cqw;
  line-height: 1.64em;
  color: var(--color-text);
  margin-bottom: 7.89cqw;
}
@media (min-width: 768px) {
  .p-concept__text {
    font-size: 2.2526934378cqw;
    margin-bottom: clamp(0px, 5.3868756121cqw, 55px);
  }
}

.p-concept__title {
  width: 25.6338028169cqw;
}
@media (min-width: 768px) {
  .p-concept__title {
    width: 17.8256611166cqw;
  }
}

@media (min-width: 768px) {
  .p-concept__title.c-section-title {
    margin-bottom: 4.1136141038cqw;
  }
}

.p-concept__closing {
  margin-bottom: 9.01cqw;
}
@media (min-width: 768px) {
  .p-concept__closing {
    margin-bottom: clamp(0px, 6.3663075416cqw, 65px);
  }
}

.p-concept__logo {
  width: 26.48cqw;
  height: 6.2cqw;
  margin-inline: auto;
}
@media (min-width: 768px) {
  .p-concept__logo {
    width: 16.6503428012cqw;
  }
}

.p-concept__logo-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.p-concept__representative {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 1em;
  /* margin-bottom: 10.14cqw; */
}

.p-concept__representative-title {
  font-family: "Shippori Mincho B1", serif;
  font-weight: 400;
  font-size: 14.79px;
  line-height: 1.448em;
  color: var(--color-text);
}
@media (min-width: 400px) {
  .p-concept__representative-title {
    font-size: 3.7cqw;
  }
}
@media (min-width: 768px) {
  .p-concept__representative-title {
    font-size: clamp(0px, 2.2526934378cqw, 23px);
  }
}

.p-concept__representative-name {
  font-family: "Shippori Mincho B1", serif;
  font-weight: 400;
  font-size: 4.5070422535cqw;
  color: var(--color-text);
  margin-top: 1em;
}
@media (min-width: 400px) {
  .p-concept__representative-name {
    font-size: 4.5cqw;
  }
}
@media (min-width: 768px) {
  .p-concept__representative-name {
    font-size: 3.4280117532cqw;
  }
}

/* p-menu (新版 - スマホファースト) */
.p-menu {
  width: 100%;
}
@media (min-width: 768px) {
  .p-menu {
    margin-bottom: clamp(0px, 13.5384615385cqw, 176px);
  }
}

.p-menu__button {
  display: flex;
  justify-content: center;
}

.p-menu__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 5.35cqw; /* 19px / 375px * 100 */
  row-gap: 16cqw;
  margin-bottom: var(--margin-64);
}
@media (min-width: 768px) {
  .p-menu__grid {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 4.2307692308cqw;
    margin-bottom: clamp(0px, 14.8461538462cqw, 193px);
  }
}
.p-menu__grid .p-menu__item {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
  gap: 2.25cqw; /* 8px / 375px * 100 */
  background: var(--color-background, #ffffff);
}
.p-menu__grid .p-menu__item-header {
  align-self: end;
  margin-bottom: -1.25cqw; /* 8px / 375px * 100 */
}
.p-menu__grid .p-menu__item-image {
  width: 100%;
}
.p-menu__grid .p-menu__item-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-menu__grid .p-menu__item-text {
  font-family: "Hiragino Kaku Gothic Pro", sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 1.5em;
  letter-spacing: 0.04em;
  color: var(--color-text);
}
@media (min-width: 400px) {
  .p-menu__grid .p-menu__item-text {
    font-size: 3cqw;
  }
}
@media (min-width: 768px) {
  .p-menu__grid .p-menu__item-text {
    font-size: 16px;
  }
}
.p-menu__grid .p-menu__item-title {
  font-family: var(--font-family-serif);
  font-weight: var(--font-weight-bold);
  font-size: 14px;
  line-height: 1.5em;
  letter-spacing: -0.03em;
  color: var(--color-text);
}
@media (min-width: 400px) {
  .p-menu__grid .p-menu__item-title {
    font-size: 3.5cqw;
  }
}
@media (min-width: 768px) {
  .p-menu__grid .p-menu__item-title {
    font-size: clamp(0px, 1.8461538462vw, 24px);
  }
}
.p-menu__grid .p-menu__item-title.p-menu__item-title--small {
  font-size: 3.2cqw;
}
@media (min-width: 768px) {
  .p-menu__grid .p-menu__item-title.p-menu__item-title--small {
    font-size: clamp(0px, 1.6923076923vw, 21px);
  }
}

.p-menu__lead {
  font-size: 4.5333333333cqw; /* 17px / 375px * 100 */
  margin-bottom: 1.2em;
}
@media (min-width: 768px) {
  .p-menu__lead {
    font-size: clamp(0px, 4.2115572968cqw, 43px);
  }
}

.p-menu__title {
  width: 20cqw; /* 71px / 375px * 100 */
  height: 7.61cqw; /* 27px / 375px * 100 */
  max-width: 158px;
}
@container global-container (min-width: 768px) {
  .p-menu__title {
    width: 15.4750244858cqw;
    margin-bottom: clamp(0px, 7.8354554358cqw, 80px);
  }
}

.p-menu-description {
  display: grid;
  margin-bottom: var(--margin-24);
}
.p-menu-description > * {
  grid-area: 1/-1;
}

.p-menu-description__image {
  width: 57.8666666667cqw;
  height: 62.4cqw;
  max-width: 496px;
  align-self: start;
  justify-self: start;
}
.p-menu-description__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@container global-container (min-width: 768px) {
  .p-menu-description__image {
    width: 48.5798237023cqw;
    height: auto;
  }
}

.p-menu-description__text {
  margin-top: 25.8666666667cqw;
  font-size: 3.2cqw;
  color: #333333;
  line-height: 1.7em;
}
@media (min-width: 768px) {
  .p-menu-description__text {
    margin-top: clamp(0px, 16.7482859941cqw, 161px);
    font-size: clamp(0px, 2.3506366308cqw, 21px);
  }
}
@media (min-width: 768px) and (min-width: 1024px) {
  .p-menu-description__text {
    line-height: 1.9em;
  }
}

.p-menu-description__text,
.p-menu-description__title {
  align-self: start;
  justify-self: start;
  margin-left: 39.2cqw;
  font-family: var(--font-family-serif);
  font-weight: var(--font-weight-bold);
  text-align: left;
  /* max-width: 55%; */
}
@media (min-width: 768px) {
  .p-menu-description__text,
  .p-menu-description__title {
    margin-left: clamp(0px, 34.5739471107cqw, 353px);
  }
}

.p-menu-description__title {
  margin-top: 0;
  font-size: 4.8cqw;
  color: #c5a572;
  line-height: 1.5;
}
@media (min-width: 768px) {
  .p-menu-description__title {
    font-size: clamp(18px, 4.2115572968cqw, 41px);
  }
}
.p-menu-description__title {
  /* @media (min-width: 1024px) {
    font-size: calc(43 / 1021 * 100cqw);
    grid-row: 1;
  } */
}

.p-menu-intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3.2cqw; /* 12px / 375px * 100 = 3.38cqw */
  /* gap: 0.92em; */ /* 12px / 13px = 0.923em */
  margin-bottom: var(--margin-24);
  text-align: center;
}

.p-menu-intro__text {
  font-family: var(--font-family-serif);
  font-weight: 400; /* Medium */
  font-size: 3.4666666667cqw;
  line-height: 1.5; /* 150% */
  color: #000000;
  margin: 0;
}
@container global-container (min-width: 768px) {
  .p-menu-intro__text {
    font-size: var(--font-size-base-pc);
  }
}

.p-section-title--menu {
  font-size: 4.5333333333cqw;
  text-align: center;
  margin: 0 0 var(--margin-48) 0;
}

/* Staff Section */
.p-staff {
  font-family: var(--font-family-serif);
}
@media (min-width: 768px) {
  .p-staff {
    margin-bottom: clamp(0px, 9.7692307692cqw, 127px);
  }
}

.p-staff__title {
  width: 18.9333333333cqw;
  /* height: calc(40 / 375 * 100cqw); */
}
@media (min-width: 768px) {
  .p-staff__title {
    width: clamp(0px, 10.0769230769cqw, 131px);
  }
}

.p-staff__content {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--margin-12);
  text-align: center;
  margin-bottom: var(--margin-24);
}
@media (min-width: 768px) {
  .p-staff__content {
    display: block;
  }
}

.p-staff__text {
  font-weight: var(--font-weight-normal);
  font-size: 3.4666666667cqw;
  line-height: 1.5;
  color: #000000;
  margin: 0;
}
@media (min-width: 768px) {
  .p-staff__text {
    font-size: clamp(0px, 1.7692307692cqw, 23px);
    line-height: 1.8em;
  }
}

.p-staff__lead,
.p-staff__text--caption {
  font-size: 4.8cqw;
  text-align: center;
}
@media (min-width: 768px) {
  .p-staff__lead,
  .p-staff__text--caption {
    font-size: clamp(0px, 3.3076923077cqw, 43px);
  }
}

.p-staff__lead {
  margin-bottom: var(--margin-24);
}

.p-staff__text--caption {
  margin-top: -18cqw;
  margin-bottom: var(--margin-64);
}
@media (min-width: 768px) {
  .p-staff__text--caption {
    margin-top: -12cqw;
    margin-bottom: clamp(0px, 9.7692307692cqw, 127px);
  }
}

.p-staff__image {
  width: 100%;
  margin-bottom: 0;
}
@media (min-width: 768px) {
  .p-staff__image {
    width: clamp(0px, 58.4615384615cqw, 760px);
    margin-inline: auto;
  }
}

.p-staff__image-img {
  width: 100%;
  height: auto;
  display: block;
}

/* Access Section */
.p-access {
  font-family: var(--font-family-sans);
  font-weight: var(--font-weight-light);
  font-size: 4.2666666667cqw;
}
@media (min-width: 768px) {
  .p-access {
    margin-bottom: clamp(0px, 6.1538461538cqw, 80px);
  }
}

.p-access__address {
  margin-bottom: var(--margin-24);
}
@media (min-width: 768px) {
  .p-access__address {
    margin-bottom: 0.3em;
  }
}

.p-access__address-text {
  font-family: var(--font-family-sans);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
}
@media (min-width: 768px) {
  .p-access__address-text {
    font-size: clamp(0px, 2.0769230769cqw, 27px);
  }
}

.p-access__border {
  margin-top: var(--margin-48);
  margin-bottom: -8.5333333333cqw;
}
@media (min-width: 768px) {
  .p-access__border {
    margin-top: clamp(0px, 6.1538461538cqw, 80px);
    margin-bottom: clamp(0px, 6.1538461538cqw, 80px);
  }
}

.p-access__button {
  text-align: center;
  margin-bottom: var(--margin-56);
}
@media (min-width: 768px) {
  .p-access__button {
    margin-bottom: clamp(0px, 6.6153846154vw, 86px);
  }
}

.p-access__floor-plan {
  width: 100%;
  margin-bottom: var(--margin-24);
}
@media (min-width: 768px) {
  .p-access__floor-plan {
    margin-bottom: clamp(0px, 3.6923076923vw, 48px);
  }
}

.p-access__floor-plan-img {
  width: 100%;
  height: auto;
  display: block;
}

.p-access__hours-text {
  line-height: var(--line-height-normal);
  color: var(--color-text);
}
@media (min-width: 768px) {
  .p-access__hours-text {
    font-size: clamp(0px, 2cqw, 26px);
  }
}

.p-access__map {
  position: relative;
  width: 100%;
  margin-bottom: var(--margin-24);
  aspect-ratio: 375/180;
}
@media (min-width: 768px) {
  .p-access__map {
    aspect-ratio: 1021/355;
    margin-bottom: clamp(0px, 3.8461538462vw, 50px);
  }
}

.p-access__map-iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.p-access__parking {
  display: grid;
  gap: var(--margin-12);
  margin-bottom: var(--margin-56);
}
@media (min-width: 768px) {
  .p-access__parking {
    font-size: clamp(0px, 2.0769230769cqw, 27px);
    gap: 0.4em;
    margin-bottom: clamp(0px, 8.4615384615vw, 110px);
  }
}

.p-access__parking-spots {
  line-height: var(--line-height-normal);
  color: var(--color-text);
  color: #c8427b;
  font-weight: 700;
}

.p-access__parking-text {
  line-height: var(--line-height-normal);
  color: var(--color-text);
}

.p-access__reservation-text {
  text-align: left;
  line-height: var(--line-height-normal);
  color: var(--color-text);
  margin-inline: auto;
}
@media (min-width: 768px) {
  .p-access__reservation-text {
    font-size: clamp(0px, 2.0769230769cqw, 27px);
    text-align: center;
    line-height: 1.9em;
  }
}

.p-access__room-item {
  line-height: 1.5;
  color: #c8427b;
}

.p-access__room-item:last-child {
  margin-bottom: 0;
}

.p-access__rooms {
  display: grid;
  gap: 2.1333333333cqw;
  margin-bottom: var(--margin-24);
}
@media (min-width: 768px) {
  .p-access__rooms {
    font-size: clamp(0px, 2.0769230769cqw, 27px);
    gap: 0.7em;
    font-weight: 700;
    margin-bottom: clamp(0px, 4.9230769231vw, 64px);
  }
}

.p-access__salon-image {
  width: 100%;
  margin-bottom: var(--margin-24);
}
@media (min-width: 768px) {
  .p-access__salon-image {
    margin-bottom: clamp(0px, 2.4615384615vw, 32px);
  }
}

.p-access__salon-image-img {
  width: 100%;
  display: block;
}

.p-access__title {
  width: 21.3333333333cqw;
}
@media (min-width: 768px) {
  .p-access__title {
    width: clamp(0px, 12.8461538462cqw, 167px);
    margin-bottom: clamp(0px, 3.8461538462cqw, 50px);
  }
}

/* Utility: Display */
/* SP only - hide on tablet and PC */
@media (min-width: 768px) {
  .u-sp-only {
    display: none;
  }
}

/* Tablet only - hide on SP and PC */
/* .u-tablet-only {
  display: none;

  @media (min-width: 768px) {
    display: block;
  }
} */
/* PC only - hide on SP and tablet */
.u-pc-only {
  display: none;
}
@media (min-width: 768px) {
  .u-pc-only {
    display: block;
  }
}

/* Underline */
.u-underline {
  text-decoration: underline;
  text-underline-offset: 0.3em;
}