/* Keep hidden attribute behavior reliable even with reset display rules */
[hidden] {
  display: none !important;
}



/* =========================
   HERO
========================= */
.hero {
  margin-top: 93px;
  width: 100%;
  overflow: hidden;
}



.hero__slider {
  position: relative;
}

.hero__slides {
  display: flex;
  transition: transform 0.6s ease;
}

/* スライド */
.hero__slide {
  min-width: 100%;
  height: 1020px;
}

.hero__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 矢印 */
.hero__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  
  width: 56px;
  height: 56px;
  
  border-radius: 50%;
  border: 1px solid #BFBAB0;
  background: rgba(239,235,224,0.3);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  transition: 0.3s;
}

.hero__arrow:hover {
  background: rgba(239,235,224,0.5);
}

.hero__arrow--prev {
  left: 40px;
}

.hero__arrow--next {
  right: 40px;
}

/* --- hero overlay content --- */

/* 画像に薄い暗めのoverlay */
.hero__slider::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.28);
  pointer-events: none;
  z-index: 5;
}

/* 矢印はoverlayより前面 */
.hero__arrow {
  z-index: 20;
}

/* テキスト全体のラッパー：スライダー上に中央配置 */
.hero__content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  z-index: 10;
  padding: 0 clamp(24px, 5vw, 80px);
  pointer-events: none;
}

/* メインキャッチコピー */
.hero__catch {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(42px, 5vw, 68px);
  font-weight: 400;
  font-style: italic;
  color: #fff;
  line-height: 1.25;
  letter-spacing: 0.01em;
}

/* "trends" / "comfort" のピンク文字 */
.hero__catch-accent {
  color: #D9B4C6;
}

/* サブコピー */
.hero__lead {
  margin-top: clamp(12px, 1.2vw, 20px);
  font-family: 'Noto Sans JP', sans-serif;
  font-size: clamp(13px, 2.1vw, 20px);
  font-weight: 300;
  color: #fff;
  letter-spacing: 0.08em;
}

/* CTAボタン（PrimaryButton と同スタイル） */
/* hero内のPrimaryButtonはpointer-events: noneの親を貫通させる */
.hero__content .PrimaryButton {
  pointer-events: auto;
  margin-top: clamp(24px, 2.4vw, 64px);
}

/* SP: 390px 〜 767px */
@media (max-width: 767px) {
  .hero__catch {
    font-size: clamp(32px, 9vw, 44px);
  }

  .hero__lead {
    font-size: clamp(12px, 3.5vw, 15px);
  }

  .hero__content .PrimaryButton {
    max-width: calc(100% - 48px);
    font-size: 13px;
    padding: 12px 32px;
  }
}

/* タブレット: 768px */
@media (min-width: 768px) and (max-width: 1024px) {
  .hero__catch {
    font-size: clamp(38px, 5.5vw, 56px);
  }
}

/* --- hero marquee band --- */

.hero-marquee {
  width: 100%;
  overflow: hidden;
  background-color: #F2E6EC;
  height: clamp(32px, 4.2vw, 60px);
  display: flex;
  align-items: center;
}

.hero-marquee__track {
  display: flex;
  align-items: center;
  gap: clamp(48px, 8.9vw, 128px);
  white-space: nowrap;
  animation: marquee-scroll 28s linear infinite;
  will-change: transform;
}

.hero-marquee__text {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(16px, 1.1vw, 24px);
  font-weight: 500;
  color: #333333;
  letter-spacing: 0.08em;
  flex-shrink: 0;
}

@keyframes marquee-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-marquee__track {
    animation: none;
  }
}

/* =========================
   TertiaryButton
========================= */

.TertiaryButton {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 18px;
  font-weight: 500;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
  letter-spacing: 0.04em;
  white-space: nowrap;
  transition: opacity 0.25s ease;
}

.TertiaryButton:hover {
  opacity: 0.6;
}

.TertiaryButton .btn__icon {
  display: inline-flex;
  align-items: center;
}

.TertiaryButton .btn__icon img {
  width: 20px;
  height: 20px;
}

/* concept内では右寄せ */
.concept__content .TertiaryButton {
  align-self: flex-end;
}

/* =========================
   Concept
========================= */

.concept {
  padding: 0;
  width: 100%;
}

/* レイアウト */
.concept__inner {
  display: flex;
  align-items: stretch;
  width: 100%;
}

/* テキスト側 */
.concept__content {
  padding-top: 128px;
  padding-bottom: 160px;
  position: relative;
  z-index: 1;
  flex: 0 0 50%;
  padding-left: 120px;
  max-width: 640px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}


/* =========================
   Decoration Oval
========================= */
.concept {
  position: relative; /* ←基準 */
}
.concept__decoration {
  position: absolute;

  width: 420px;
  height: 420px;
  border-radius: 50%;
  filter: blur(20px);
  /* background: #dcd6ce; ←ベージュ */
  background: radial-gradient(
    circle at center,
    #D9B4C6 0%,          /* 中心：ピンク */
    #E4D2D6 40%,        /* 中間：なじませ */
    #EFEBE0 70%,        /* 外側手前 */
    rgba(239,235,224,0) 100% /* 外側フェード */
  );
  top: 80px;
  left: 30%;
}

  /* moved below — company styles inserted above */

/* ラベル */
.concept__label {
  font-family: "Montserrat", sans-serif;
  font-size: 12px;
  color: #888;
}

/* タイトル */
.concept__title {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 400;
  font-size: 48px;
  letter-spacing: 0.08em;
  line-height: 1.8;
}

/* 本文 */
.concept__text {
  max-width: 680px;
  font-size: 20px;
  line-height: 2.4;
  letter-spacing: 0.08rem;
  color: #6F6F6F;
}
/* 画像側 */
.concept__image {
  position: relative;
  z-index: 1;
  flex: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.concept__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.PrimaryButton--concept-mobile {
  display: none;
}

/* =========================
   Design Card
========================= */

/* カード本体 */
.card--design {
  width: 100%;
  padding: 24px;
  border: 1px solid rgba(191,186,176,0.4);
}

.card--design:hover {
  transform: none;
}

/* リンクを完全ブロック化 */
.card--design .card__link {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* 画像コンテナ */
.card--design .card__image {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  position: relative;
  background: #eee;
}

/* 画像（絶対配置で固定）←これが最終奥義 */
.card--design .card__image img {
  position: absolute;
  inset: 0;           /* top right bottom left 0 */
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.card--design:hover .card__image img {
  transform: scale(0.97);
}

/* テキスト */
.card--design .card__body {
  margin-top: 16px;
}

/* タイトル */
.card--design .card__title {
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.6;
}

/* メタ */
.card--design .card__meta {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 16px;
    font-size: 16px;
    letter-spacing: 0.1em;
    color: #9A9A9A;
}


.card--design .card__meta-group {
  font-size: 16px;
  color: #333;
  display: flex;
  gap: 16px; /* ← 狭くする */
}

/* Design card text fit override */
.card--design .card__title {
  font-size: clamp(14px, 1.4vw, 18px);
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  max-width: 100%;
  box-sizing: border-box;
}

.card--design .card__meta,
.card--design .card__meta-group,
.card--design .card__meta > *,
.card--design .card__meta-group > * {
  font-size: clamp(12px, 1.2vw, 16px);
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}


/* =========================
   Design Modal
========================= */
.design-modal {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.design-modal:target {
  display: flex;
}

.design-modal[aria-hidden="false"] {
  display: flex;
}

.design-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(51, 51, 51, 0.25);
}

.DesignModalCard {
  position: relative;
  width: 800px;
  max-width: 100%;
  padding: 64px;
  background: #EFEBE0;
  border: 1px solid rgba(191, 186, 176, 0.8);
  border-radius: 8px;
  z-index: 1;
}

.DesignModalCard__close-button {
  position: absolute;
  top: 32px;
  right: 32px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: 1px solid #BFBAB0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background-color: rgba(212, 208, 199, 0.2); /* #D4D0C7 20% */
}
.DesignModalCard__close-button:hover {

  background-color: rgba(212, 208, 199, 0.4); /* #D4D0C7 50% */
}
.DesignModalCard__close-button img {
  width: 24px;
  height: 24px;
}

.DesignModalCard__content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}

.DesignModalCard__image {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.DesignModalCard__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.DesignModalCard__body {
  padding-top: 32px;
}

.DesignModalCard__title {
  margin: 0;
  padding-bottom: 16px;
  border-bottom: 1px solid #BFBAB0;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.6;
  color: #333;
}

.DesignModalCard__tags {
  margin-top: 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.DesignModalCard__tags .card__category {
  padding: 10px 24px;
  font-size: 14px;
  letter-spacing: 0.08em;
}


/* =========================
   Review
========================= */

.card--review {
  min-width: 358px;
  width: 100%;
  max-width: 396px;
  height: 496px; /* 高さ固定（重要） */
  padding: 40px;
  background: #F7F5EF; 
  display: flex;
  flex-direction: column;
    box-shadow: 0 6px 24px rgba(0,0,0,0.16);

}
.card--review:hover {
  transform: translateY(-16px);
  transition: .3s;
}
/* ★ 星 */
.card--review .card__rating {
  display: flex;
}

.card__star img {
  width: 40px;
  height: 40px;
  display: block;
}

/* タイトル */
.card--review .card__title {
    color: #333;
    margin-top: 24px;
    height: 60px;
    font-family: "M PLUS Rounded 1c", sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: 0.1rem;
}

/* 本文 */
.card--review .card__text {
  margin-top: 16px;
    font-size: 18px;
    line-height: 2;
    letter-spacing: 0.08rem;
    color: #6F6F6F;
    flex: 1;
    overflow-y: auto;
    line-height: 2;
}

/* 名前 + 日付 */
.card--review .card__meta {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: 16px;
}

.card--review .card__name {
  color: #333;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.card--review .card__date {
  color: #9A9A9A;
  letter-spacing: 0.04em;
  font-family: "Montserrat", sans-serif;
}
.card--review .card__shop {
  color: #9A9A9A;
}
.card--review .card__staff {
  color: #333;
}
.card--review .card__meta-group {
  display: flex;
  gap: 16px;
}
/* カードフッター */
.card--review .card__footer {
  display: flex;
  justify-content: space-between;
  margin-top: auto;
  font-size: 16px;
  color: #666;
  align-items: center;
}

.card--review .card__text::-webkit-scrollbar {
  display: none;
}


/* =========================
   Salon
========================= */

.salon {
  padding-bottom: 0;
  border-bottom: none;
}

.salon .section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto;
  width: calc(100% - 280px);
}
.salon .section__title {
  margin: 0;
}

.salon__list {
  display: flex;
  flex-direction: column;
}

.salon__item {
  padding: 64px 120px;
  display: grid;
  grid-template-columns: 40% 1fr;
  gap: 64px;
  align-items: stretch;
  border-bottom: 1px solid #BFBAB0; /* ← 横いっぱい線 */
  text-decoration: none;
  color: inherit;
}

.salon__item:hover {
  background: rgba(217, 180, 198, 0.1);
}

.page--salon-list .salon__item:last-of-type {
  padding-bottom: 160px;
}
/* 最初だけ線を追加 */
.salon__item:first-child {
  border-top: 1px solid #BFBAB0;
}

/* 画像 */
.salon__image {
  position: relative; /* imgをフローから外してコンテンツ列が行高さを決める */
  overflow: hidden;
}

.salon__image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* コンテンツ */
.salon__content {
  padding: 32px 0;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* タイトル */
.salon__title {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 28px;
  font-weight: 500;
  letter-spacing: 0.08em;
}


/* 情報 */
.SalonDetailInfo__body {
  padding: 24px 0;
}
.salon__info {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.salon__row {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 64px;
  padding-bottom: 24px;
  border-bottom: 1px solid #BFBAB0;
}
.salon__row:last-child {
  border-bottom: none;
}
.salon__label {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: #333;
}

.salon__text {
  font-weight: 400;
  font-size: 18px;
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: #6F6F6F;
}

.salon__num {
  font-size: 20px;
  font-family: "Montserrat", sans-serif;
  letter-spacing: 0.1em;
}



/* =========================
   News
========================= */

.news__list {
  display: flex;
  flex-direction: column;
}

.news__item {
  display: grid;
  grid-template-columns: 120px 168px 1fr;
  gap: 64px;
  padding: 32px 0;
  border-bottom: 1px solid #BFBAB0;
  align-items: center;
  transition: transform 0.3s ease;
}

.news__item:hover {
  transform: translateX(12px);
}

.news__item:first-child {
  padding-top: 0;
}

.news__item .card__category {
  width: 168px;
}


/* =========================
   Blog
========================= */

.card--blog {
  min-width: 358px;
  max-width: 396px;
  height: 546px; /* 高さ固定（重要） */
  padding: 24px;
  background: #F7F5EF; 
  box-shadow: 0 6px 24px rgba(0,0,0,0.16);
  transition: transform 0.3s ease;
}

.card--blog:hover {
  transform: translateY(-16px);
}

/* リンク全体 */
.card--blog .card__link {
    display: flex;
    flex-direction: column;
    gap: 32px;
    text-decoration: none;
    color: inherit;
}

/* 画像 */
.card--blog .card__image {
  width: 100%;
  aspect-ratio: 4 / 4;
  overflow: hidden;
}

.card--blog img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s;
}

.card--blog:hover img {
  transform: none;
}

/* 本文 */
.card--blog .card__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* 日付 + カテゴリ */
.card--blog .card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.card--blog .card__title {
  /* 2行分の高さを固定して、全カードのタイトル高さを揃える */
  height: calc(1.8em * 2);
}

/* 矢印 */
.card__arrow {
    margin-top: auto;
    margin-left: auto;
    text-align: right;
}
.card__arrow img{
  width: 24px;
  transition: transform .3s;
}

.card--blog:hover .card__arrow {
  transform: none;
}


/* =========================
   Recruit
========================= */

.recruit {
  padding: 0;
  color: #333;
  width: 100%;
}

/* レイアウト */
.recruit__inner {
  display: flex;
  align-items: stretch;
  width: 100%;
}

/* テキスト */
.recruit__content {
  padding-top: 128px;
  padding-bottom: 160px;
  position: relative;
  z-index: 1;
  flex: 0 0 50%;
  padding-left: 120px;
  max-width: 640px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* ラベル */
.recruit__label {
  font-family: "Montserrat", sans-serif;
  font-size: 12px;
  color: #888;
}

/* タイトル */
.recruit__title {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 400;
  font-size: 48px;
  letter-spacing: 0.08em;
  line-height: 1.8;
}

/* 本文 */
.recruit__text {
  max-width: 680px;
  font-size: 20px;
  line-height: 2.4;
  letter-spacing: 0.08rem;
  color: #6F6F6F;
}

.recruit .ButtonTertiary {
  margin-top: 32px;
}
.recruit .recruit__button {
        width: calc((100% - 16px) / 2);
        margin: 0 auto 0 0 ;
}

/* 画像 */
.recruit__image {
  position: relative;
  z-index: 1;
  flex: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.recruit__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.recruit .ButtonTertiary {
  margin-top: 32px;
}

/* =========================
   Product Page
========================= */
.archive-list--product {
  margin: 64px 64px 128px 0;
}
.product-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 64px 32px;
}

.product-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-decoration: none;
  color: inherit;
}

.product-card__image {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.product-card:hover .product-card__image img {
  transform: scale(1.04);
}

.product-card__info {
  margin-top: 8px;
  flex-wrap: wrap;
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.product-card__title {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: clamp(12px, 1.8vw, 18px);
  letter-spacing: 0.1em;
  color: #333;
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
}

.product-card__volume {
  font-family: "Montserrat", sans-serif;
  font-size: clamp(10px, 1.3vw, 16px);
  color: #333333;
  letter-spacing: 0.04em;
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
}

.product-card__price {
  font-family: "Montserrat", sans-serif;
  font-size: clamp(14px, 1.6vw, 18px);
  font-weight: 500;
  color: #333;
  letter-spacing: 0.04em;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
}


/* =========================
   Media Page
========================= */
.archive-list--media {
  margin: 64px 64px 128px 0;
}

.media-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 64px 32px;
}

.media-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-decoration: none;
  color: inherit;
}

.media-card__image {
  width: 100%;
  aspect-ratio: 2 / 3;
  overflow: hidden;
}

.media-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.media-card:hover .media-card__image img {
  transform: scale(1.04);
}

.media-card__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.media-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.media-card__meta-group {
  display: flex;
  align-items: center;
  gap: 8px;
}

.media-card__date {
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  color: #6F6F6F;
  letter-spacing: 0.08em;
}

.media-card__divider {
  font-size: 16px;
  color: #6F6F6F;
}

.media-card__category {
  font-size: 16px;
  color: #6F6F6F;
  letter-spacing: 0.1em;
}

.media-card__title {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: clamp(14px, 1.4vw, 20px);
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: normal;
  color: #333;
}

.media-card__publisher {
  font-size: 16px;
  color: #6F6F6F;
  letter-spacing: 0.04em;
}
.media-card__body {
  min-width: 0;
}

.media-card__meta {
  flex-wrap: nowrap;
  min-width: 0;
  overflow: hidden;
}

.media-card__meta-group {
  min-width: 0;
  overflow: hidden;
}

.media-card__title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
  word-break: break-word;
}

.page--media .media-card__date,
.page--media  .media-card__divider,
.page--media  .media-card__category,
.page--media  .media-card__publisher {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* =========================
   Company Page
========================= */
.company {
  padding: 128px 0 160px;
}

.company-list {
  list-style: none;
  margin: 0;
  /* max-width: 960px; */
}

.company-list__item {
  display: grid;
  grid-template-columns: 160px 1fr;
  align-items: center;
  padding: 32px 64px;
  border-bottom: 1px solid #BFBAB0;
  gap: 64px;
}

.company-list__item:first-child {
  border-top: 1px solid #BFBAB0;
}

.company-list__label {
  font-family: "Rounded M+ 1c", sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: #333;
  letter-spacing: 0.1em;
  position: relative;
}

.company-list__label::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 1px;
  height: 40px;
  background-color: #BFBAB0;
}

.company-list__value {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: #6F6F6F;
  letter-spacing: 0.1em;
  line-height: 1.7;
}

.RecruitPage__intro .SalonDetailPage__label {
  margin-bottom: 64px;
}

.RecruitPage .SalonConcept__text {
  max-width: 800px;
}

.RecruitPage .SalonTabList.RecruitPage__tabs {
  margin-top: 80px;
  margin-bottom: 80px;
}

.RecruitPage__entry {
  margin-top: 64px;
  display: flex;
  justify-content: center;
}

.RecruitPage__entry .PrimaryButton {
  margin-top: 0;
}

.RecruitPage__entry .PrimaryButton img {
  width: 20px;
  height: 20px;
  filter: brightness(0) invert(1);
}

/* =========================
Article
========================= */
.article-layout {
  margin: 0;
}

.archive-layout__inner--article {
    background-color: #F7F5EF;
}





.archive-layout__inner--article .card__category.archive-filter__btn--active {
  background: rgba(217, 180, 198, 0.3);
  border-color: #D9B4C6;
  font-weight: 500;
}



.archive-layout__inner--article .archive-filter__group:last-of-type {
  margin-bottom: 0;
}

.article {
  padding: 64px 64px 80px 0;
}

.article__hero {
  color: #333;
  padding: 0 0 64px;
}

.article__title {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 24px;
  letter-spacing: 0.08em;
  line-height: 1.2;
}

.article__meta-row {
  margin-top: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.article__meta-left {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}


.article__tags {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}


.article__share {
  display: flex;
  align-items: center;
  gap: 16px;
}

.article__share img {
  width: 20px;
  height: 20px;
}

.article__hero-image {
  margin-top: 24px;
  aspect-ratio: 4 / 3;
}

.article__hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.article__hero-divider {
  margin-bottom: 64px;
  width: 100%;
  height: 1px;
  background-color: #BFBAB0;
}

.article__body {
  background: rgba(212, 208, 199, 0.2);
  color: #6F6F6F;
  padding: 64px 40px;
}

.article__body p {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 18px;
  letter-spacing: 0.08em;
  line-height: 2.4;
}



.article__figure {
  margin: 40px 0;
}

.article__figure-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  margin: 40px 0;
}

.article__figure-grid .article__figure {
  margin: 0;
}

.article__divider {
  margin: 80px 0 64px;
}

.article__figure img {
  width: 100%;
  display: block;
}

.article__caption {
  margin-top: 8px;
  font-size: 16px;
  font-weight: 300;
  letter-spacing: 0.08em;
  color: #6F6F6F;
  line-height: normal;
}

.article__divider {
  border: none;
  border-top: 1px solid #BFBAB0;
}

.article__section-title {
  margin-bottom: 32px;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 24px;
  letter-spacing: 0.08em;
  line-height: 1.5;
  color: #333;
}

.article__sub-title {
  margin: 64px 0 16px;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 20px;
  letter-spacing: 0.12em;
  line-height: 1.4;
  color: #333;
  display: flex;
  align-items: center;
  gap: 8px;
}

.article__author-area {
  margin-top: 64px;
  padding-top: 32px;
  padding-bottom: 40px;
  border-top: 1px solid #BFBAB0;
  border-bottom: 1px solid #BFBAB0;
}

.article__author-area .PrimaryButton--full {
  margin-top: 32px;
}

.article__publisher {
  margin: 0;
  font-family: "Montserrat", sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: #6F6F6F;
}

.article__hero-image--portrait {
  aspect-ratio: 548 / 822;
  width: 100%;
  max-width: 548px;
  margin-right: auto;
  margin-left: auto;
}


/* =========================
   Product
========================= */
.article__body--product {
  background: transparent;
  padding: 0;
}

.article__body--product .article__share img {
  width: 24px;
  height: 24px;
}

.ProductInfo {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.ProductInfo__main {
  display: grid;
  grid-template-columns: 395px 1fr;
  gap: 32px;
  align-items: start;
}

.ProductInfo__image {
  height: stretch;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.ProductInfo__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ProductInfo__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.ProductInfo__heading {
  width: 100%;
}

.ProductInfo__heading .article__title {
  margin: 0;
  font-family: "Noto Sans CJK JP", sans-serif;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: #333;
}

.ProductInfo__heading .product-card__volume {
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  line-height: normal;
  margin-top: 8px;
  color: #333333;
}

.ProductInfo__divider {
  margin: 16px 0 16px;
  width: 100%;
  height: 1px;
  background-color: #BFBAB0;
}

.ProductInfo .product-card__price {
  font-family: "Montserrat", sans-serif;
  line-height: normal;
  font-size: 24px;
  font-weight: 700;
  color: #333;
}

.ProductInfo__content > p:last-of-type:not(.product-card__price) {
  margin-top: 24px;
  font-size: 16px;
  color: #6F6F6F;
}

.ProductInfo__share {
  margin-top: 24px;
}

.article__body--product .ProductInfo__share-title {
  margin: 0 0 8px;
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  font-weight: 400s;
  letter-spacing: 0.04em;
  color: #9A9A9A;
  line-height: normal;
}

.ProductInfo__button {
  margin-top: 0;
  width: 100%;
  box-sizing: border-box;
  justify-content: center;
  font-family: "Montserrat", sans-serif;
  font-size: 22px;
  font-weight: 500;
  color: #333;
  letter-spacing: 0.04em;
}

/* =========================
   Salon Detail Page
========================= */

.SalonDetailPage__section {
  padding-top: 128px;
  padding-bottom: 160px;
  border-bottom: 1px solid #BFBAB0;
}

.SalonDetailPage__section--salon-info {
  border-bottom: none;
  padding-top: 80px;
  padding-bottom: 0;
}

.SalonDetailPage__section--concept {
  padding-top: 80px;
  padding-bottom: 64px;
}

.SalonDetailPage__section--review {
  padding-top: 80px;
}

.SalonDetailPage__section--bottom {
  border-bottom: none;
}

.SalonDetailPage--coupon .SalonDetailPage__section,
.SalonDetailPage--menu .SalonDetailPage__section,
.SalonDetailPage--staff .SalonDetailPage__section,
.SalonDetailPage--blog .SalonDetailPage__section,
.SalonDetailPage--blog-article .SalonDetailPage__section {
  padding-top: 80px;
}

.SalonDetailPage__label {
  font-family: "Montserrat", sans-serif;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: normal;
  color: #333;
}

.SalonDetailPage--blog .archive-layout__inner {
  width: 100%;
  max-width: none;
  margin: 0;
  background: transparent;
}

.SalonDetailPage--blog .archive-layout,
.SalonDetailPage--blog-article .archive-layout {
  padding-top: 64px;
  padding-bottom: 0;
}

.SalonDetailPage .archive-layout__inner--article {
  width: 100%;
  max-width: none;
  margin: 0;
}

.SalonDetailPage__head {
  margin-bottom: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.SalonDetailPage .section__header {
  width: 100%;
  margin: 0;
}

.SalonDetailPage--coupon .SalonDetailPage__head .archive-filter__select {
  width: 250px;
  margin: 0;
  flex-shrink: 0;
  font-family: "Noto Sans CJK JP", "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.SalonDetailPage__section--review .view__more .ButtonTertiary {
  width: 252px;
}


.SalonDetailPage__section--salon-review .SalonDetailPage__head {
  width: 100%;
}

/* salonInfoCard---------------------------------------------- */

.SalonInfoCard {
  margin-top: 64px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
}

.SalonInfoCard__title {
  margin: 0;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 28px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: #333;
  min-width: 0;
}

.SalonInfoCard > .PrimaryButton {
  margin-top: 0;
  flex-shrink: 0;
}


/* salonTab---------------------------------------------- */
.SalonTabList {
  margin: 64px 0 0;
  width: 100%;
  border-top: 1px solid #BFBAB0;
  border-bottom: 1px solid #BFBAB0;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.SalonTabList--triple {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.SalonTabList__item {
  width: 100%;
  justify-self: center;
  padding: 24px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 16px;
  letter-spacing: 0.08em;
  color: #333;
  border: none;
  background: transparent;
  cursor: pointer;
  position: relative;
  text-decoration: none;
  box-sizing: border-box;
  line-height: 1.2;
}

.SalonTabList__item:last-child {
  border-right: none;
}

.SalonTabList__item::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 32px;
  background: #BFBAB0;
}

.SalonTabList__item:last-child::after {
  display: none;
}

.SalonTabList__item:hover {
  background: rgba(217, 180, 198, 0.1);
}

.SalonTabList__item.is-active {
  background: rgba(217, 180, 198, 0.2);
  font-weight: 500;
}

.SalonConcept {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 64px;
  align-items: stretch;
}

.SalonConcept__body {
  grid-column: span 7;
  border-right: 1px solid #BFBAB0;
  padding-right: 64px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.SalonConcept__body .SalonDetailPage__label {
  margin-bottom: 64px;
}

.SalonConcept__lead {
  margin: 0;
  font-family: "Rounded M+ 1c", sans-serif;
  font-size: 24px;
  line-height: 1.8;
  letter-spacing: 0.12em;
  color: #333;
}

.SalonConcept__text {
  margin: 32px 0 0;
  font-size: 20px;
  line-height: 2.5;
  letter-spacing: 0.08em;
  color: #6F6F6F;
}

.SalonConcept__media {
  grid-column: span 5;
  width: 100%;
  min-height: 360px;
  height: 100%;
  overflow: hidden;
}

.SalonConcept__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.CouponList {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.CouponItem {
  padding: 40px;
  border: 1px solid #BFBAB0;
  background: #F7F5EF;
  display: grid;
  grid-template-columns: 376px 1fr;
  gap: 32px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08);
}

.CouponItem__media {
  position: relative;
  width: 376px;
  max-width: 100%;
  height: 100%;
  overflow: hidden;
}

.CouponItem__media .card__category {
  position: absolute;
  left: 8px;
  top: 8px;
  z-index: 1;
  background: rgba(247, 245, 239, 0.9);
  padding: 8px 16px;
}

.CouponItem__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.CouponItem__content {
  padding: 16px 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.CouponItem__heading {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.CouponItem__title {
  margin: 0;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.7;
  color: #333;
}

.CouponItem__text {
  margin: 0;
  font-size: 18px;
  line-height: 1.9;
  letter-spacing: 0.08em;
  color: #6F6F6F;
}

.CouponItem__points {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.CouponItem__points li {
  display: flex;
  align-items: center;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.9;
  color: #333;
}

.CouponItem__points img {
  width: 24px;
  height: 24px;
}

.CouponItem__meta {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 24px;
  border-top: 1px solid #BFBAB0;
}

.CouponItem__row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 32px;
  padding: 0;
  align-items: center;
  letter-spacing: 0.08em;
  line-height: normal;
}

.CouponItem__row > span:first-child {
  position: relative;
  font-size: 18px;
  font-weight: 500;
  color: #333333;
}

.CouponItem__row > span:first-child::after {
  content: "";
  position: absolute;
  right: -12px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 20px;
  background: #BFBAB0;
}

.CouponItem__row > span:last-child {
  font-size: 18px;
  font-weight: 400;
  color: #6F6F6F;
}

.CouponItem .ButtonSecondaryCard {
  margin-top: 16px;
}

/* menu section ----------------------------- */
.SalonDetailPage--menu .archive-layout {
  padding-top: 0;
  padding-bottom: 0;
}

.SalonDetailPage--menu .archive-layout__inner {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: none;
  margin: 0;
  gap: 0;
}

.MenuCategory .archive-filter__title {
  margin-bottom: 0;
  padding: 24px 24px 24px 64px;
}

.SalonDetailPage--menu .archive-layout__inner .MenuCategory:first-of-type .archive-filter__title {
  border-top: none;
}

.MenuList {
  margin: 0;
  padding: 64px 64px 80px;
}

.MenuListItem {
  padding: 40px 0;
  border-bottom: 1px solid #BFBAB0;
  background: transparent;
}

.MenuList .MenuListItem:first-child {
  padding-top: 0;
}

.MenuListItem__main {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
}

.MenuListItem__left {
  display: flex;
  align-items: center;
  gap: 24px;
  min-width: 0;
}

.SalonDetailPage--menu .MenuListItem__left {
  gap: 12px;
}

.MenuListItem__title {
  margin: 0;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: #333333;
}

.MenuListItem__duration {
  font-family: "Montserrat", sans-serif;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.6;
  color: #9A9A9A;
}

.MenuListItem__price {
  font-family: "Montserrat", sans-serif;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1.6;
  color: #333333;
  flex-shrink: 0;
}

.MenuListItem__price::before {
  content: "\00A5";
  margin-right: 4px;
}

.MenuListItem__text {
  margin: 24px 0 0;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.9;
  color: #333333;
}
.StaffGrid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
/* review section ----------------------------- */
.SalonDetailPage__section--review .archive-layout {
  padding-top: 64px;
  padding-bottom: 0;
}

.SalonDetailPage__section--review .archive-layout__inner {
  width: 100%;
  max-width: none;
  margin: 0;
  background: transparent;
}

.ReviewLayout__filterGroup {
  margin-bottom: 0;
}

.ReviewLayout .archive-list {
  margin: 0;
  padding: 0 64px 80px 0;
}

.ReviewListItem {
  padding: 64px 0;
  border-bottom: 1px solid #BFBAB0;
  background: transparent;
  color: #333333;
}

.ReviewListItem__meta {
  display: flex;
  align-items: center;
  gap: 24px;
}

.ReviewListItem__stars {
  display: flex;
  align-items: center;
}

.ReviewListItem__stars img {
  width: 40px;
  height: 40px;
}

.ReviewListItem .card__title {
  font-weight: 500;
  margin: 32px 0 0;
  font-size: 20px;
}

.ReviewListItem__text {
  margin: 24px 0 0;
  font-size: 18px;
  line-height: 1.9;
  letter-spacing: 0.08em;
  color: #6F6F6F;
}

.ReviewListItem__author {
  margin: 24px 0 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.1em;
  color: #333333;
}

.ReviewListItem__menu {
  margin: 40px 0 0;
  padding: 32px;
  background: rgba(212, 208, 199, 0.20);
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.1em;
  color: #333333;
}

.ReviewListStaffCard {
  margin-top: 40px;
  background: transparent;
}

.ReviewListStaffCard__label {
  margin: 0;
  padding: 12px 32px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(191, 186, 176, 0.5);
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  font-size: 16px;
  letter-spacing: 0.08em;
  color: #6F6F6F;
  background: rgba(212, 208, 199, 0.30);
  line-height: normal;
}

.ReviewListStaffCard__body {
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  border: 1px solid rgba(191, 186, 176, 0.5);
  border-radius: 0 8px 8px 8px;
  background: rgba(212, 208, 199, 0.30);
}

.ReviewListStaffCard__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.ReviewListStaffCard__profile {
  display: inline-flex;
  align-items: center;
  gap: 16px;
}

.ReviewListStaffCard__info {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ReviewListStaffCard__salon {
  font-size: 16px;
  letter-spacing: 0.08em;
  color: #9A9A9A;
}

.ReviewListStaffCard__info:not(:has(.ReviewListStaffCard__name)) .ReviewListStaffCard__salon {
  color: #333333;
}

.ReviewListStaffCard__name {
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  letter-spacing: 0.08em;
  color: #333333;
}

.ReviewListStaffCard__profile img {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
}

.ReviewListStaffCard__button {
  width: 360px;
  font-weight: 400;
}

.ReviewListStaffCard__button img {
  width: 24px;
  height: 24px;
}

.ReviewListStaffCard__reply {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.ReviewListStaffCard__reply p {
  margin: 0;
  font-size: 18px;
  line-height: 1.9;
  letter-spacing: 0.08em;
  color: #6F6F6F;
}


/* staff grid------------------------------- */

.StaffGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 64px;
}

.StaffCard {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.StaffCard__name-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.StaffCard__profile {
  display: flex;
  flex-direction: column;
  gap: 16px;
  line-height: normal;
}

.StaffCard__media {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.StaffCard__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.StaffCard:hover .StaffCard__media img {
  transform: scale(0.97);
}

.StaffCard__role {
  font-size: 16px;
  letter-spacing: 0.1em;
  color: #6F6F6F;
}

.StaffCard__name {
  margin: 0;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
}

.StaffCard__name-en {
  margin: 0;
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  letter-spacing: 0.04em;
  color: #333333;
}

.StaffCard__reserve {
  margin-top: auto;
  padding: 24px 0;
  border-top: 1px solid #BFBAB0;
  border-bottom: 1px solid #BFBAB0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #333;
  font-size: 18px;
  letter-spacing: 0.08em;
  text-decoration: none;
  background: transparent;
}

.StaffCard__reserve:hover {
  background: rgba(51, 51, 51, 0.05);
}

.StaffCard__reserve img {
  width: 24px;
  height: 24px;
}

.SalonDetailInfo {
  margin-top: 64px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: stretch;
}

.SalonDetailInfo__title {
  margin: 0 0 48px;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-size: 28px;
  font-weight: 500;
  letter-spacing: 0.08em;
}

.SalonDetailInfo__map {
  width: -webkit-fill-available;
  display: flex;
  height: 100%;
}

.SalonDetailInfo__map iframe {
  width: 100%;
  height: auto;
  min-height: 100%;
  flex: 1;
  border: 0;
}

.SalonDetailInfo__icon-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
}

.SalonDetailInfo__icon-list img {
  height: 24px;
  width: auto;
}

.SalonDetailInfo__badge {
  height: 24px;
  width: auto;
  display: block;
}

.SalonDetailInfo__map-link {
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: #333;
  font-size: 16px;
  letter-spacing: 0.08em;
}

.SalonDetailInfo__map-link img {
  width: 16px;
  height: 16px;
}

/* =========================
   Staff Detail Page
========================= */

.StaffInfoCard {
  margin-top: 64px;
  border-top: 1px solid #BFBAB0;
  border-bottom: 1px solid #BFBAB0;
  display: grid;
  grid-template-columns: 566px 1fr;
  align-items: stretch;
}

.StaffInfoCard__media {
  padding: 40px 40px 40px 0;
  border-right: 1px solid #BFBAB0;
}

.StaffInfoCard__media img {
  width: 526px;
  max-width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.StaffInfoCard__body {
  padding: 40px 0 40px 64px;
  display: flex;
  flex-direction: column;
}

.StaffInfoCard__profile {
  gap: 16px;
}

.StaffDetailsPage__section .StaffCard__name {
  font-size: 24px;
}

.StaffInfoCard__sns {
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
}

.StaffInfoCard__sns a {
  display: inline-flex;
  align-items: center;
}

.StaffInfoCard__sns img {
  width: 24px;
  height: 24px;
}

.StaffInfoCard__copy {
  margin-top: 24px;
  padding-top: 32px;
  border-top: 1px solid #BFBAB0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.StaffInfoCard__copy p {
  margin: 0;
}

.StaffInfoCard__copy p:first-child {
  font-family: "Noto Sans CJK JP", "Noto Sans JP", sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.9;
  color: #333333;
}

.StaffInfoCard__copy p:last-child {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.9;
  color: #6F6F6F;
}

.StaffInfoCard__button {
  margin-top: 64px;
  max-width: 100%;
  width: 100%;
}

/* StaffInfoCard overflow fix (override) */
.StaffInfoCard,
.StaffInfoCard__body,
.StaffInfoCard__media,
.StaffInfoCard__image,
.StaffInfoCard__text {
  box-sizing: border-box;
}

.StaffInfoCard > *,
.StaffInfoCard__body > * {
  min-width: 0;
}

.StaffInfoCard__body,
.StaffInfoCard__text {
  width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
}

.StaffInfoCard__media,
.StaffInfoCard__image {
  min-width: 0;
  overflow: hidden;
}

.StaffInfoCard__media img,
.StaffInfoCard__image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

.PrimaryButton.PrimaryButton--full.StaffInfoCard__button {
  display: flex;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}




/* staff profile------------------------------- */
.StaffProfileSection {
  margin-top: 64px;
}

.StaffProfileSection__layout {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 64px;
  align-items: stretch;
}

.StaffProfileSection__intro {
  grid-column: span 4;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 32px;
  padding-bottom: 24px;
}

.StaffProfileSection__title {
  margin: 0;
  font-family: Montserrat, sans-serif;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0.08em;
}

.StaffProfileSection__text {
  margin: 0;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.8;
  color: #6F6F6F;
}

.StaffProfileSection__reviewsLink {
  margin-top: 8px;
}

.StaffProfileCard {
  grid-column: span 8;
  background: rgba(212, 208, 199, 0.3);
  padding: 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.StaffProfileCard__row {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 32px;
  align-items: start;
}

.StaffProfileCard__row > span:first-child {
  font-family: Montserrat, sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: #333;
  line-height: 1.8;
}

.StaffProfileCard__row > span:last-child {
  font-size: 16px;
  letter-spacing: 0.08em;
  line-height: 2.0;
  color: #6F6F6F;
}
  /* Staff */
  .StaffGrid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .SalonDetailInfo__title {
    margin-bottom: 32px;
    font-size: 20px;
  }

  .SalonDetailInfo__map iframe {
    height: 320px;
  }

  .StaffDetailsPage__section {
    padding-top: 80px;
    padding-bottom: 64px;
  }

  .StaffInfoCard {
    margin-top: 40px;
    gap: 40px;
  }

  .StaffProfileSection {
    margin-top: 40px;
  }

  .StaffProfileSection__title {
    font-size: 20px;
  }

  .StaffProfileSection__text {
    font-size: 18px;
  }

  .StaffProfileCard {
    padding: 24px;
    gap: 24px;
  }

  .StaffProfileCard__row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .StaffProfileCard__row > span:first-child{
    width: 120px;
    font-size: 18px;
  }

  .StaffProfileCard__row > span:last-child {
    font-size: 16px;
  }
  .StaffInfoCard__sns {
    margin-top: 16px;
  }
  .StaffInfoCard__copy {
    padding-top: 24px;
    gap: 16px;
  }
  .StaffCard__name-group {
    gap: 4px;
  }
    .StaffInfoCard__button {
    margin-top: 40px;
  }
    .StaffInfoCard__body {
    padding: 40px 0;
  }

  .StaffProfileSection__intro,
  .StaffProfileCard {
    width: stretch;
    grid-column: auto;
    gap: 16px;
  }

  .StaffProfileSection__intro {
    max-width: 358px;
    gap: 32px;
    padding-bottom: 0;
  }

  .StaffProfileCard__row {
    display: flex;
    gap: 64px;
  }
    .StaffInfoCard__media {
    padding: 40px 40px 40px 0 ;
    border-right: none;
    border-right: 1px solid #BFBAB0;
  }
  .StaffInfoCard__media img {
    width: 100%;
    height: -webkit-fill-available;
    aspect-ratio: 1 / 1;
  }
  .StaffInfoCard__body {
    padding: 40px 0 64px;
  }

  .StaffProfileSection__layout {
    display: flex;
    gap: 64px;
  }

  /* Blog--------------------------------------------- */
  .SalonDetailPage.SalonDetailPage--blog .archive-list {
    row-gap: 0;
    width: stretch;
  }
  .SalonDetailPage--blog .archive-layout {
    padding-top: 40px;
  }
  .SalonDetailPage.SalonDetailPage--blog .archive-filter .archive-filter__group:last-of-type {
    margin-bottom: 0 !important;
  }
      .SalonDetailPage.SalonDetailPage--blog .archive-list__more {
      margin: 64px auto 0;
    }





.page--company .page-header,
.page--company .company,
.page--recruit .page-header,
.page--recruit .recruit,
.page--recruit .RecruitPage {
  position: relative;
  z-index: 1;
}

/* Hover scale unified override */
.archive-list__item:hover .archive-list__image img,
.archive-list__item:hover .card__image img,
.product-card:hover .product-card__image img {
  transform: scale(0.97);
}
/* =========================
   Responsive
========================= */



@media (min-width: 961px) and (max-width: 1440px) {
  .media-card__title {
    font-size: clamp(16px, 1.4vw, 20px);
  }
.page--media .media-card__date,
.page--media  .media-card__divider,
.page--media  .media-card__category,
.page--media  .media-card__publisher {
    font-size: clamp(12px, 1.1vw, 16px);
  }
}

@media (min-width: 390px) and (max-width: 960px) {
  .media-card__title {
    font-size: clamp(14px, 1.65vw, 18px);
  }
.page--media .media-card__date,
.page--media  .media-card__divider,
.page--media  .media-card__category,
.page--media  .media-card__publisher {
    font-size: clamp(12px, 1.25vw, 14px);
  }
}

/* ----------------------------------------1920px */
@media (min-width: 1441px) {

  /* concept */
  .concept__inner {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 64px;
    align-items: center;
    width: auto;
    flex: none;
  }
  .concept__content {
    grid-column: span 7;
    padding-left: 140px;
    max-width: 100%;
    flex: none;
  }
  .concept__image {
    grid-column: span 5;
    flex: none;
    width: 100%;
    aspect-ratio: 3 / 4;
  }
  
  /* recruit */
  .recruit__inner {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 64px;
    align-items: center;
    width: auto;
    flex: none;
  }
  .recruit__content {
    grid-column: span 6;
    padding-left: 140px;
    max-width: 100%;
    flex: none;
  }
  .recruit__image {
    grid-column: span 6;
    flex: none;
    width: 100%;
    aspect-ratio: 3 / 4;
  }

  /* product */
  .product-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  /* media */
  .media-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
    .SalonDetailPage .view__more {
    width: 100%;
  }
    .page--media .media-card__title {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: clamp(18px, 1.2vw, 20px);
    line-height: 1.4;
  }
    .product-card__title {
      font-size: clamp(12px, 1vw, 18px);
  }

    .media-card__title {
  font-size: clamp(18px, 1.4vw, 20px);
  }
.page--media .media-card__date,
.page--media  .media-card__divider,
.page--media  .media-card__category,
.page--media  .media-card__publisher {
    font-size: clamp(13px, 1.1vw, 16px);
  }
}

/* ----------------------------------------1440px */
@media (max-width: 1440px) {
  .SalonDetailPage__section--salon-review .SalonDetailPage__head,
.SalonDetailPage__section--salon-review .view__more {
  margin: 0 auto;
  width: calc(100% - 240px);
  max-width: 1640px;
}
  /* Hero */
  .hero__slide {
  height: 800px;
}
/* concept */
  .concept__inner {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 64px;
    align-items: center;
  }
  .concept__content {
    grid-column: span 7;
    padding-left: 120px;
    max-width: 100%;
  }
  .concept__image {
    grid-column: span 5;
    flex: none;
    width: 100%;
    aspect-ratio: 3 / 4;
  }
  /* salon */
  .salon .salon__header {
  width: calc(100% - 240px)
  }
  /* recruit */
  .recruit__inner {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 64px;
    align-items: center;
  }
  .recruit__content {
    grid-column: span 6;
    padding-left: 120px;
    max-width: 100%;
  }
  .recruit__image {
    grid-column: span 6;
    flex: none;
    width: 100%;
    aspect-ratio: 3 / 4;
  }

  /* staff */
  .StaffGrid {
    gap: 40px;
  }
    /* design ------------------------------------ */


  .section--design .grid.grid--design {
    width: 100%;
    max-width: 100%;
    margin: 0;
    box-sizing: border-box;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 64px;
  }

  .section--design .grid.grid--design > * {
    min-width: 0;
    max-width: 100%;
  }

  .section--design .grid.grid--design .card--design {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .section--design .grid.grid--design .card--design .card__link,
  .section--design .grid.grid--design .card--design .card__image {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .section--design .grid.grid--design .card--design .card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

}

/* ----------------------------------------1200px */

@media (min-width: 769px) and (max-width: 1200px) {
  .StaffCard__reserve {
    font-size: clamp(14px, 1.35vw, 18px);
    line-height: 1.2;
    letter-spacing: clamp(0.04em, 0.08vw, 0.08em);
    gap: clamp(4px, 0.7vw, 8px);
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
  }

  .StaffCard__reserve img {
    width: clamp(18px, 1.8vw, 24px);
    height: clamp(18px, 1.8vw, 24px);
    flex-shrink: 0;
  }

}
@media (min-width: 960px) and (max-width: 1440px) {
      .product-card__title {
        font-size: clamp(12px, 1.4vw, 18px);
    }

}


/* ----------------------------------------960px */
@media (max-width: 960px) {

    /* concept --------------------------------*/

  .concept__decoration {
    width: 240px;
    height: 240px;
  }
  .concept__inner {
    padding: 80px 0 128px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  .concept__content {
    width: calc(100% - 64px);
    max-width: none;
    flex: none;
    padding: 0 0 64px;
    margin: 0 32px;
    gap: 24px;
  }

  .concept__image {
    width: 60%; /* 80% 指定を解除 */
    margin-left: auto;
    height: auto;
    aspect-ratio: 3 / 4;
    flex: none;
  }


  .page--top .concept .PrimaryButton,
  .page--top .concept .PrimaryButton--concept-mobile {
    display: none !important;
  }

  /* design --------------------------------*/
    .section--design .grid.grid--design {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  

   /* salon --------------------------------*/
  .section__header.salon__header {
    width: calc(100% - 64px);
    padding: 64px 0 40px;
  }
    .salon {
    padding: 0;
  }

  .salon__item {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .page--salon-list .salon__item:last-of-type {
  padding-bottom: 128px;
}
  .page--salon-list .salon__item:last-of-type {
    padding-bottom: 128px;
  }
  .salon__content {
    gap: 32px;
    padding: 0;
  }
  .salon__row {
        gap: 4px;
        display: flex;
        flex-direction: column;
   }
   .salon__row:last-child {
    padding-bottom: 0;
   }
  .salon__item {
    grid-template-columns: 1fr;
    padding: 64px 32px 80px;
  }

  .salon__image {
    width: 100%;
    aspect-ratio: 4 / 3;
  }

    /* product ----------------------------- */
      .article__body--product {
    padding: 64px 0 0;
  }
  .ProductInfo__main {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

      /* recruit */
  .recruit__inner {
    display: flex;
    flex-direction: column-reverse;
    gap: 0;
  }

  .recruit__image {
    width: 100%;
    aspect-ratio: 390 / 280;
    overflow: hidden;
  }

  .recruit__content {
    width: calc(100% - 64px);
    max-width: none;
    margin: 0 32px;
    padding: 80px 0 128px;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .recruit .recruit__button,
  .recruit .ButtonTertiary {
    margin: 0;
    width: fit-content;
  }

  /* staff --------------------------------*/
    .StaffProfileSection__intro,
  .StaffProfileCard {
    grid-column: auto;
    gap: 16px;
  }



  .StaffProfileSection__intro {
    max-width: stretch;
    width: 100%;
    gap: 24px;
    padding-bottom: 0;
  }

  .StaffProfileCard__row {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
    .StaffInfoCard__media {
    padding: 32px 0;
    border-right: none;
    border-bottom: 1px solid #BFBAB0;
  }
  .StaffInfoCard__body {
    padding: 32px 0 40px;
  }

  .StaffProfileSection__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .StaffInfoCard {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .StaffProfileSection {
    margin-bottom: 0;
  }
  
    /* Coupon -----------------------------*/
  .CouponItem {
    padding: 24px 24px 32px;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .CouponItem__media {
    width: 100%;
    aspect-ratio: 4 / 3;
  }
  .CouponItem__content {
    padding: 0;
  }

  .CouponItem__row {
    align-items: flex-start;
    display: flex;
    gap: 24px;
  }

  .CouponItem__heading {
    gap: 16px;
  }
  .CouponItem .ButtonSecondaryCard {
    margin-top: 8px;
  }
  /* Salon Concept------------------------- */
      .SalonConcept {
    display: flex;
    flex-direction: column;
    gap: 40px;
  }
  .SalonConcept__body {
    padding: 0 0 40px;
    border-right: none;
    border-bottom: 1px solid #BFBAB0;
  }

  .SalonConcept__body .SalonDetailPage__label {
    margin-bottom: 40px;
  }
  .SalonDetailPage__section--concept {
    padding: 80px 0 128px;
  }
  .SalonConcept__media {
    width: 100%;
    aspect-ratio: 4 / 3;
    min-height: 0;
  }
    /* menu list ---------------------------- */
    .SalonDetailPage--menu .container {
      margin: 0 32px;
      width: stretch;
    }
      .SalonDetailPage--menu .SalonDetailPage__section:nth-of-type(2) .SalonDetailPage__head {
    margin-left: 16px;
    margin-bottom: 0;
  }
  .SalonDetailPage--menu .SalonDetailPage__section:nth-of-type(2) .container {
        margin-top: 0;
        margin-left: 16px;
        margin-right: 16px;
  }
    .archive-list .MenuList {
    padding: 32px 16px 64px;
    }
    .SalonDetailPage--menu .archive-layout__inner {
      border: 1px solid #BFBAB0;
    }
  .SalonDetailPage--menu .SalonDetailPage__head {
    margin-bottom: 64px;
  }
  
  /* archive-list / MenuList を先、archive-filter を下へ */
    .MenuListItem {
    padding: 0 0 32px;
  }
     .SalonDetailPage--menu .archive-layout--listing .archive-filter__title, .SalonDetailPage--menu .archive-layout__inner .MenuCategory:first-of-type .archive-filter__title {
      margin-bottom: 0 !important;
    padding: 24px 16px !important;
  }
  .SalonDetailPage--menu .archive-layout--listing .archive-filter__title {
    border-top: 1px solid #BFBAB0;
  }
  .MenuListItem__main {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .MenuListItem__left {
    gap: 12px;
  }

  .MenuListItem__title,
  .MenuListItem__price {
    font-size: 18px;
  }
    .MenuListItem__duration {
    font-size: 16px;
    }
  .MenuListItem__text {
    margin-top: 16px;
  }

  .SalonDetailPage__section .archive-layout.archive-layout--listing .MenuList {
    padding: 32px 16px 64px;
    order: 1;
    gap: 32px;
  }

  .SalonDetailPage__section .archive-layout.archive-layout--listing .archive-filter {
    margin-top: 80px;
    margin-left: 0;
    order: 2;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    border-right: none;
  }
    .archive-filter__title {
    border-top: none;
  }

  /* menu --------------------------------- */
  /* メニュー一覧：1カラムの縦並び + 指定余白 */
  .SalonDetailPage--menu .archive-list,
  .SalonDetailPage--menu .MenuList {
    margin: 0;
    display: flex;
    flex-direction: column;
    width: auto;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    box-sizing: border-box;
  }

    .SalonDetailPage.SalonDetailPage--menu .archive-filter__group {
  margin: 0;
  }
    /* SalonDetail専用タブ（header下に固定） */
  .SalonDetailPage .SalonTabList.SalonTabList--salon-detail,
  .SalonTabList.SalonTabList--salon-detail {
    position: fixed !important;
    top: 93px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    z-index: 1400 !important;
    background: #EFEBE0;
  }
  /* 3列 × 2行 */
  .SalonDetailPage .SalonTabList.SalonTabList--salon-detail {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-rows: 46px;
  }

  .SalonDetailPage .SalonTabList--salon-detail .SalonTabList__item {
    padding: 0 12px;
    min-height: 46px;
  }

  /* 縦線：各行の3列目は非表示 */
  .SalonDetailPage .SalonTabList--salon-detail .SalonTabList__item::after {
    display: block;
  }
  .SalonDetailPage .SalonTabList--salon-detail .SalonTabList__item:nth-child(3n)::after {
    display: none;
  }

  /* 横線：1行目の下に線（1〜3番目） */
  .SalonDetailPage .SalonTabList--salon-detail .SalonTabList__item:nth-child(-n + 3) {
    border-bottom: 1px solid #BFBAB0;
  }

  .SalonDetailPage--coupon .SalonDetailPage__head {
    margin-bottom: 0;
  }
  .SalonDetailPage.SalonDetailPage--blog .ButtonTertiary  {
    width: 100%;
  }

.SalonDetailPage.SalonDetailPage--blog .archive-list__more {
  width: calc((100% - 16px) / 2);
}
    /* Salon Info -----------------------*/
  .SalonInfoCard, .SalonDetailInfo {
    margin: 40px 0 0;
    display: flex;
    flex-direction: column;
    gap: 40px;
    align-items: flex-start;
  }
  .SalonInfoCard > .PrimaryButton {
    width: 100%;
  }
  /* review------------------------------- */
  .ReviewLayout .archive-list  {
    width: fit-content;
    padding-right: 0;
    gap: 0;
  }
  .ReviewListItem:first-child {
    padding-top: 0;
  }
  .ReviewListStaffCard__row {
    display: flex;
    flex-wrap: wrap;
  }
  .ReviewListStaffCard__button {
    width: 100%;
  }
  .ReviewListStaffCard__body {
    padding: 16px;
  }
  .ReviewListItem__meta {
    flex-wrap: wrap;
  }
    /* Staff Grid */
  .SalonDetailPage__section .container:has(.StaffGrid) {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 40px;
  }

  .SalonDetailPage__section .container:has(.StaffGrid) .SalonDetailPage__head {
    display: contents;
  }

  .SalonDetailPage__section .container:has(.StaffGrid) .SalonDetailPage__head > .SalonDetailPage__label {
    grid-row: 1;
    margin-bottom: 0;
  }

  .SalonDetailPage__section .container:has(.StaffGrid) .StaffGrid {
    gap: 32px;
    grid-row: 2;
    width: calc(100% - 0px);
    min-width: 0;
    box-sizing: border-box;
  }

  .SalonDetailPage__section .container:has(.StaffGrid) .SalonDetailPage__head > .ButtonTertiary,
  .SalonDetailPage__section .container:has(.StaffGrid) .SalonDetailPage__head > *:has(> .ButtonTertiary) {
    grid-row: 3;
    justify-self: end;
    margin: 0;
  }
  .SalonDetailPage__section .container:has(.StaffGrid) .SalonDetailPage__head > .ButtonTertiary {
        margin-top: 20px;
        width: calc((100% - 16px) / 2);
    }
          .StaffGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

    /* staff info card -----------------------------*/
    .StaffInfoCard__body {
    padding: 40px 0 clamp(40px, 4.4vw, 64px) clamp(24px, 4.4vw, 64px);
  }


    /* archive------------------------------------ */
    .article__hero {
    padding: 64px 0 40px;
  }
    /* archive ------------------------------------ */

  .archive-layout {
    padding: 0 0 128px;
  }

  .archive-layout--article {
    background-color: #F7F5EF;
  }
.page--news .archive-filter, .page--blog .archive-filter, .page--product .archive-filter, .page--media .archive-filter {
          margin: 0 32px !important;
        margin-top: 80px  !important;
        padding-bottom: 128px !important;
        width: auto !important;
}
    .page--blog .archive-layout.archive-layout--listing {
      padding-bottom: 0 !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
  }

  /* salon details article------------------------------------ */

  /* SalonDetailPage__section を page--news の listing 構造に揃える */
  .SalonDetailPage__section .archive-layout.archive-layout--listing {
    padding-top: 40px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow-x: hidden;
  }

  .SalonDetailPage__section .archive-layout.archive-layout--listing .archive-layout__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  /* Salon Detail Blog Article */
  .SalonDetailPage--blog-article .SalonDetailPage__section:nth-of-type(2) {
    background-color: #F7F5EF;
  }
    .SalonDetailPage--blog-article .article__hero {
      padding-top: 0;
    }
    .SalonDetailPage--blog-article .archive-layout {
      padding-top: 40px;
    }

    .SalonDetailPage .ButtonTertiary {

    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    box-sizing: border-box;
    padding-left: clamp(8px, 2vw, 14px);
    padding-right: clamp(8px, 2vw, 14px);
  }
    .SalonDetailPage.SalonDetailPage--blog .archive-list {
      margin-top: 0;
    row-gap: 64px;
  }
    .SalonDetailPage--blog .article,
    .SalonDetailPage--blog-article .article {
      padding: 0 !important;

    }
    .SalonDetailPage .archive-layout__inner--article {
      border: none !important;
    }
    .SalonDetailPage--blog-article .SalonDetailPage__section {
      padding-bottom: 128px;
    }
        .SalonDetailPage--blog-article .SalonDetailPage__section:first-of-type {
      padding-bottom: 80px;
    }
}




@media (min-width: 769px) and (max-width: 1440px) {
  .PrimaryButton.PrimaryButton--full.StaffInfoCard__button {
    font-size: clamp(16px, 1.25vw, 20px);
    padding-left: clamp(24px, 3vw, 64px);
    padding-right: clamp(24px, 3vw, 64px);
    gap: clamp(4px, 0.55vw, 8px);
  }

  .PrimaryButton.PrimaryButton--full.StaffInfoCard__button img {
    width: clamp(18px, 1.45vw, 24px);
    height: clamp(18px, 1.45vw, 24px);
    flex-shrink: 0;
  }

/* ----------------------------------------768px */

@media (max-width: 768px) {

  .section__header,
  .salon .section__header,
  .salon .salon__header {
    width: calc(100% - 64px) !important;
    margin-left: 32px !important;
    margin-right: 32px !important;
  }
  .section--review .section__header,
  .section--blog .section__header
   {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 32px !important;
  }
  .section__header--default {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  

}


  /* staff card------------------------------- */
  .StaffInfoCard {
    grid-template-columns: minmax(0, clamp(300px, 43vw, 566px)) minmax(0, 1fr);
  }


  .StaffInfoCard__copy p:first-child,
  .StaffInfoCard__text p:first-child {
    font-size: clamp(16px, 1.25vw, 18px);
  }

  .StaffInfoCard__copy p:last-child,
  .StaffInfoCard__text p:last-child {
    font-size: clamp(13px, 0.97vw, 14px);
  }


/* review---------------------------------------- */

  .SalonDetailPage__section--review .archive-layout {
    padding-top: 40px;
  }

  .ReviewListItem {
    padding: 0 0 64px;
  }
    .ReviewLayout .ReviewListItem:first-of-type {
      padding-top: 24px;
  }
  .ReviewListItem__meta {
    gap: 16px;
    flex-direction: column;
    align-items: flex-start;
  }

  .ReviewListItem .card__title {
    margin-top: 24px;
  }
  .ReviewListItem__author {
    margin-top: 16px;
  }
  .ReviewListItem__text {
    margin-top: 16px;
  }
  .ReviewListItem__menu, .ReviewListStaffCard{
    margin-top: 32px;
  }
    .ReviewListItem__menu {
          padding: 24px;
    }
  .ReviewListStaffCard__body {
    padding: 16px 16px 32px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }
  .ReviewListStaffCard__row {
    width: stretch;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .ReviewListStaffCard__reply {
    gap: 16px;
  }
  .ReviewListStaffCard__button {
    width: 100%;
  }


}


@media screen and (max-width: 768px) {

    .concept__title {
    font-size: 32px;
    line-height: 1.6;
  }

      .SalonDetailPage__section {
    padding: 80px 0 128px;
  }
  .SalonDetailPage__section--salon-info {
  border-bottom: 1px solid #BFBAB0;
  padding-bottom: 64px;
  }
  /* Hero */
  .hero__slide {
    height: 600px;
  }
  .hero__slides {
    height: 600px;
  }

  .grid--design .card__meta-group .divider {
    display: none;
  }

  .recruit .recruit__button{
    width: calc((100% - 64px) / 2);
    margin: 0 0 0 auto;
  }


  .section--design .view__more .ButtonTertiary {
    width: 100%;
  }

  /* blog card */
  .card--blog {
    min-width: 264px;
    max-width: 264px;
    width: 264px;
    height: fit-content;
    padding: 16px;
  }


 


  /* salon__info */
  .salon__info { margin-top: 40px; }
  .page--salon-list .salon__info { margin-top: 0; }
  .page--top .salon__info { margin-top: 0; }



    .news__item {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  /* Recruit */

  .recruit__title {
    font-size: 20px;
  }

  .recruit .recruit__button {
    margin-top: 0;
  }
  .recruit .recruit__button {
    margin: 0;
  }

  /* product */
  .product-list {
    grid-template-columns: repeat(2, 1fr);

  }

  .product-card__image {
    width: 100%;
  }

  .product-card__title {
  font-size: clamp(14px, 2.2vw, 16px);
}
  .card--design .card__title {
      font-size: clamp(14px, 2vw, 18px);
  }
  .card--design {
    padding: 16px;
}



  /* media ---------------------------------------*/
  .media-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 64px 16px;
  }

  .media-card__image {
    width: 100%;
  }
    .media-card__title {
    font-size: clamp(16px, 1.4vw, 20px);
  }
    .page--media .archive-list.archive-list--media {
    width: calc(100% - 64px);
    max-width: none;
    margin: 80px auto 0;
    padding: 0;
    display: grid;
    gap: 64px 16px;
    box-sizing: border-box;
    overflow-x: clip;
  }

  .page--media .archive-list.archive-list--media > * {
    min-width: 0;
  }

  .page--media .media-card {
    width: 100%;
    min-width: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  .page--media .media-card__image {
    width: 100%;
    aspect-ratio: 2 / 3;
    overflow: hidden;
  }

  .page--media .media-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .page--media .media-card__body {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
  }

  /* company ---------------------------------------*/

  .company {
    padding: 80px 0 128px;
  }
    .company-list__item:first-child {
    border-top: none;
    padding-top: 0;
  }
  .company-list__item {
    grid-template-columns: 1fr;
    padding: 24px 0;
    gap: 12px;
  }
  .company-list__label::after {
    display: none;
  }
  .company-list__label {
    padding-right: 0;
  }
  .company-list__value {
    padding-left: 0;
  }

  /* product */
  .ProductInfo {
    gap: 32px;
  }
  .ProductInfo__main {
    gap: 24px;
  }
  .ProductInfo .product-card__price {
    font-size: 20px;
  }
  .ProductInfo__share-title {
    font-size: 16px;
  }
  .ProductInfo__button {
    font-size: 16px;
    padding: 20px 24px;
  }





  /* archive------------------------------------ */
    .article__hero {
    padding: 64px 0 40px;
  }
  .article__title,
  .article__meta-row,
  .article__hero-image {
    width: initial;
  }
  .article__title {
    font-size: 18px;
  }
  .article__hero .card__date {
    font-size: 14px;
  }
  .article__publisher {
    font-size: 14px;
  }
  .archive-layout__inner--article {
    display: flex;
    flex-direction: column;
    width: calc(100% - 64px);
    max-width: none;
    margin: 0 32px;
    border: none;
    gap: 80px;
  }



  .archive-layout__inner--article .archive-list {
    order: 1;
    width: 100%;
    margin: 0;
  }

  .article {
    padding: 0;
    margin: 0;
  }

.article__tags .card__category:last-child:not(.card__category--blog):not(.card__category--media) {
  background: transparent;
  border-color: transparent;
  padding: 0;
  border-radius: 0;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: #6F6F6F;
  line-height: normal;
}

  .article__body {
    padding: 64px 16px;
  }

  .article__hero-divider {
    margin-bottom: 40px;
  }


  .article__body .article__divider:last-of-type {
    margin: 64px 0 40px;
  }

  .article__meta-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .article__meta-row .card__date {
    font-size: 14px;
  }

  .article__meta-row .card__category {
    font-size: 10px;
    padding: 4px 16px;
  }
  .archive-layout__inner--article .archive-filter__title {
  padding: 0 0 16px 0;
  margin-bottom: 24px;
}

  /* Article Share */
  .article__share {
    gap: 12px;
  }
  .article__body {
    padding: 64px 16px;
  }

  /* Recruit Page----------------------------------- */
  .RecruitPage__intro .SalonDetailPage__label {
    margin-bottom: 40px;
  }

    /* Recruit側は既存運用のまま */
  .RecruitPage .SalonTabList--recruit.RecruitPage__tabs {
    margin-top: 128px;
    margin-bottom: 64px;
  }


  .RecruitPage .SalonTabList.RecruitPage__tabs {
    margin-top: 128px;
  }


  /* Salon Tab List */
  .SalonTabList__item {
    padding: 20px 12px;
    font-size: 12px;
  }
    .SalonDetailPage__section--salon-info .SalonInfoCard__body.salon__content {
    padding: 0;
  }
    .SalonDetailPage__section--salon-info .SalonInfoCard__heading {
    padding-bottom: 32px;
  }
  .SalonDetailPage__section--salon-info .SalonInfoCard__body .salon__info {
    margin-top: 40px;
  }

  /* Recruit Page */
  .RecruitPage__intro {
    margin-bottom: 32px;
  }

  .RecruitPage .SalonTabList.RecruitPage__tabs {
    margin-bottom: 64px;
  }

  .RecruitPage__entry {
    margin-top: 64px;
  }

  /* Salon Detail Page */
  .SalonDetailPage__head {
    margin-bottom: 40px;
  }
  .SalonDetailPage__section--salon-review .SalonDetailPage__head  {
    width: initial;
  }


  /* Salon info Review */
  .ReviewListItem {
    padding: 40px 0 64px;
  }
    .SalonDetailPage__section--salon-review .section__header {
    padding: 0;
    width: 100% !important;
    max-width: none;
    margin: 0 !important;
  }
    .SalonDetailPage__section--salon-review .ButtonTertiary {
    width: 100%;
  }
  .SalonDetailPage__section--salon-review .view__more {
    width: calc((100% - 140px) / 3);
            margin-right: 0;

  }
    .SalonDetailPage__section--salon-review .SalonDetailPage__head {
    padding-bottom: 40px;
    width: 100%;
    max-width: none;
    margin: 0;
  }

  /* Salon Detail Info */
  .SalonDetailInfo__body {
    padding: 0;
  }
  /* Salon detail coupon */
  .SalonDetailPage.SalonDetailPage--coupon .SalonDetailPage__section .container:has(.CouponList) {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 40px;
  }



    /* * Coupon Lists */ 
  .SalonDetailPage__section .container:has(.CouponList) {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 24px;
  }

  .SalonDetailPage__section .container:has(.CouponList) .SalonDetailPage__head {
    display: contents;
  }

  .SalonDetailPage__section .container:has(.CouponList) .SalonDetailPage__head > .SalonDetailPage__label {
    grid-row: 1;
    margin-bottom: 0;
  }

  .SalonDetailPage__section .container:has(.CouponList) .SalonDetailPage__head > .archive-filter__select {
    grid-row: 2;
    width: 100%;
    margin: 0;
  }

  .SalonDetailPage__section .container:has(.CouponList) .CouponList {
    grid-row: 3;
    width: calc(100% - 0px);
    min-width: 0;
    box-sizing: border-box;
  }

  .SalonDetailPage__section .container:has(.CouponList) .CouponItem {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .SalonDetailPage__section .container:has(.CouponList) .SalonDetailPage__head > .ButtonTertiary,
  .SalonDetailPage__section .container:has(.CouponList) .SalonDetailPage__head > *:has(> .ButtonTertiary) {
    grid-row: 4;
    justify-self: end;
    margin: 0;
  }

  .SalonDetailPage__section .container:has(.CouponList) .SalonDetailPage__head > .ButtonTertiary {
    margin-top: 20px;
    width: calc((100% - 16px) / 2);
  }

  /* design ------------------------------------ */
    .section--design .container {
    margin-left: 16px;
    margin-right: 16px;
  }
    .page--top .section--design .section__header {
    margin-left: 16px !important;
  }

  .StaffInfoCard__body {
    padding-left: 0;
  }
      .SalonDetailPage__section .container:has(.StaffGrid) .StaffGrid {
        gap: 16px;
      }



  }



@media (max-width: 1024px) {
  .MenuListItem__main {
    align-items: flex-start;
  }

  .MenuListItem__left {
    flex-wrap: wrap;
  }
}

@media (max-width: 768px) {

    /* DesignModalCard */
  .DesignModalCard {
    padding: 16px 16px 32px;
    gap: 24px;
  }
  .DesignModalCard__body {
    padding: 0;
  }
  .DesignModalCard__content {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .DesignModalCard__tags {
    margin-top: 16px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
  }
  .DesignModalCard__tags .card__category {
    padding: 8px 16px;
    font-size: 12px;
  }


  

}

@media (min-width: 390px) {
  /* product */

  .product-card__volume {
    font-size: clamp(12px, 2vw, 16px);
  }

  .product-card__price {
    font-size: clamp(14px, 2.5vw, 18px);
  }
    .StaffCard__profile,
  .StaffCard__name-group {
    min-width: 0;
  }
  /* staff card */
  .StaffCard__role {
    font-size: clamp(13px, 1.8vw, 15px);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: 100%;
    box-sizing: border-box;
  }

  .StaffCard__name {
    font-size: clamp(15px, 2vw, 18px);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: 100%;
    box-sizing: border-box;
  }

  .StaffCard__name-en {
    font-size: clamp(13px, 1.8vw, 16px);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: 100%;
    box-sizing: border-box;
  }

  .StaffCard__reserve {
    font-size: clamp(14px, 2vw, 17px);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    box-sizing: border-box;
    padding-top: clamp(14px, 2.2vw, 20px);
    padding-bottom: clamp(14px, 2.2vw, 20px);
    gap: clamp(4px, 1.2vw, 8px);
  }

  .StaffCard__reserve img {
    width: clamp(18px, 2.4vw, 22px);
    height: clamp(18px, 2.4vw, 22px);
    flex-shrink: 0;
  }
}

@media (max-width: 390px) {
    .section--design .view__more .view__more, .section--design .view__more, .section--review .view__more, .news .view__more, .recruit .recruit__button{
    width: calc((100% - 16px) / 2);
    gap: 4px;
  }

  /* text----------------------------------------- */
  .concept__title {
    font-size: 26px;
    line-height: 1.6;
  }
  .concept__text {
    font-size: 16px;
    line-height: 2;
  }
    /* .card--design .card__title {
    font-size: 14px;
  }
  .card--design .card__meta {

    font-size: 12px;
  } */
  .salon__label { font-size: 16px; }
  .salon__text { font-size: 14px; line-height: 1.5;}
  .salon__num { font-size: 16px; }
  .card--design .card__meta-group {
    font-size: 12px;
  }

  /* card--review */
  .card--review .card__title { font-size: 16px; }
  .card--review .card__text { font-size: 14px; }
  .card--review .card__name { font-size: 12px; }
  .card--review .card__meta { font-size: 12px; }
  .card--review .card__footer { font-size: 12px; }

  .news .card__title {
    font-size: 16px;
  }
    .concept__text,
  .recruit__text {
    font-size: 16px;
  }

  .StaffProfileCard__row > span:first-child {
    font-size: 16px;
  }
  .StaffProfileCard__row > span:last-child {
    font-size: 14px;
}

  .card--blog .card__title {
    font-size: 14px;
  }

  .article__figure-grid {
    gap: 16px;
  }

  /* concept */
    .concept__image {
    width: 80%; /* 80% 指定を解除 */
  }

      /* news */
  .news__item .card__category {
    width: 140px;
  }
      .page--news .archive-list__more {
        margin-top: 0;
      }

  /* blog */
  .page--blog .ButtonTertiary {
    width: 100%;
  }
    .section--blog .view__more {
    margin: 0 0 0 auto;

  }
    .section--blog .view__more {
    width: calc((100% - 16px) / 2);

  }
  .page--blog .archive-list__more {
    margin: 0 auto;
  }
    /* design card */
  
  .card--design {
    padding: 12px ;
  }
  .card--design .card__meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;

  }

  /* product */
  .product-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 16px;
  }
  .product-card {
    width: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
  }
    .product-card__title {
  font-size: clamp(12px, 2vw, 14px);
}
  /* .product-card__title {
    font-size: 14px;
  }
  .product-card__volume {
    font-size: 12px;
  }
  .product-card__price {
    font-size: 14px;
  } */
  .product-card__info {
    margin-top: 0;
  }
  .ProductInfo {
    gap: 40px;
  }

  .ProductInfo__main {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .ProductInfo__image {
    width: 100%;
    aspect-ratio: 1 / 1;
  }

  .ProductInfo__content {
    width: 100%;
  }

  .ProductInfo__button {
    width: 100%;
  }
   .ProductInfo__heading .article__title {
    font-size: 18px;
  }

  .ProductInfo__heading .product-card__volume {
    font-size: 14px;
  }

  .ProductInfo .product-card__price {
    font-size: 24px;
  }

  .ProductInfo__content > p:last-of-type:not(.product-card__price) {
    font-size: 14px;
    line-height: 2.0;
  }

  .article__body--product .ProductInfo__share-title {
    font-size: 14px;
  }

  .ProductInfo__button {
    font-size: 16px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .ProductInfo__divider {
    margin: 8px 0;
  }
    .page--product .page-header--detail,
    .page--blog .page-header--detail,
    .page--news .page-header--detail,
    .page--media .page-header--detail {
    margin-top: 93px;
  }

  /* media */
    .page--media .media-card__title {
    font-size: clamp(12px, 1.4vw, 14px);
  }

  .page--media .media-card__date,
  .page--media .media-card__divider,
  .page--media .media-card__category {
    font-size: clamp(10px, 1.25vw, 12px);
    line-height: 1.6;
    letter-spacing: 0.08em;
  }

  .page--media .media-card__publisher {
    font-size: clamp(10px, 1.25vw, 12px);
    line-height: 1.7;
    letter-spacing: 0.08em;
  }

  /* article----------------------------------- */
    .article__body p {
    font-size: 14px;
  }
    .article__section-title {
    font-size: 18px;
    font-weight: 400;
  }
  .article__caption {
    font-size: 10px;
  }
  .article__sub-title {
    gap: 4px;
    font-size: 16px;
  }
   .article__sub-title img {
    width: 16px;
    height: 16px;
  }
  .article__publisher {
    font-size: 12px;
    line-height: 1.7;
    letter-spacing: 0.08em;
  }
  /* Recruit Page */
    .recruit__title {
    font-size: 26px;
    line-height: 1.6;
    letter-spacing: 0.08em;
    font-weight: 400;
  }

  .recruit__text {
    font-size: 16px;
    line-height: 2;
    letter-spacing: 0.08em;
    color: #6F6F6F;
  }
  .SalonDetailPage__label {
    font-size: 18px;
  }
   .RecruitPage .SalonTabList.RecruitPage__tabs {
    margin-top: 80px;
      }


  /* Salon */

  .SalonConcept__lead, .SalonInfoCard__lead {
    font-size: 18px;
    line-height: 1.8;
  }
    .SalonConcept__text {
    font-size: 16px;
    line-height: 2.0;
  }
  /* SalonDetail専用タブ（header下に固定）--------------------- */
  .SalonDetailPage .SalonTabList.SalonTabList--salon-detail,
  .SalonTabList.SalonTabList--salon-detail {
    position: fixed !important;
    top: 93px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    z-index: 1400 !important;
    background: #EFEBE0;
  }


  /* 3列 × 2行 */
  .SalonDetailPage .SalonTabList.SalonTabList--salon-detail {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-rows: 46px;
  }

  .SalonDetailPage .SalonTabList--salon-detail .SalonTabList__item {
    padding: 0 12px;
    min-height: 46px;
  }

  /* 縦線：各行の3列目は非表示 */
  .SalonDetailPage .SalonTabList--salon-detail .SalonTabList__item::after {
    display: block;
  }
  .SalonDetailPage .SalonTabList--salon-detail .SalonTabList__item:nth-child(3n)::after {
    display: none;
  }

  /* 横線：1行目の下に線（1〜3番目） */
  .SalonDetailPage .SalonTabList--salon-detail .SalonTabList__item:nth-child(-n + 3) {
    border-bottom: 1px solid #BFBAB0;
  }


  .salon__title, .SalonInfoCard__title {
    font-size: 20px;
  }



    .SalonDetailPage__section .container:has(.CouponList) {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 20px;
  }

    .SalonInfoCard, .SalonDetailInfo {
      margin-bottom: 0;
    }





  .SalonDetailPage__section .container:has(.CouponList) .SalonDetailPage__head > *:has(> .ButtonTertiary) > .ButtonTertiary {
    width: calc((100% - 16px) / 2);
  }

    .CouponItem__title {
    font-size: 16px;
  }

  .CouponItem__text {
    font-size: 14px;
    line-height: 2.0;
  }
  .CouponItem__points li {
    font-size: 14px;
    line-height: 1.2;
  }


.CouponItem__row > span:first-child, .CouponItem__row > span:last-child {
      font-size: 14px;
}

    .CouponItem__row > span:first-child {
    width: 68px;
    min-width: 68px;
    flex: 0 0 68px;
  }


  /* Salon info Review */
  .SalonDetailPage__section--salon-review .SalonDetailPage__label {
    margin: 0;
  }

  .SalonDetailPage__section--salon-review .view__more {
    width: calc((100% - 16px) / 2);
    max-width: none;
    margin: 0 0 0 auto;
  }
      .SalonDetailPage__section--salon-review .ButtonTertiary {
    width: 100%;
      }

  /* Menu List Item */
    .MenuListItem__left {
    gap: 8px;
  }

  .MenuListItem__title {
    font-size: 14px;
  }
    .MenuListItem__duration {
    font-size: 12px;
    }

  .MenuListItem__price  {
    font-size: 16px;
  }
      .MenuListItem__text {
    font-size: 12px;
  }

  /* Blog */
  .SalonDetailPage.SalonDetailPage--blog .ButtonTertiary {
  width: 100%;
}
  .SalonDetailPage.SalonDetailPage--blog .archive-list__more {
  margin: 0 auto 0;
  width: calc((100% - 16px) / 2);
}


/* Review List Item */
  .ReviewListItem .card__title {
    margin-top: 24px;
    font-size: 16px;
   }

   .ReviewListItem__text {
    margin-top: 16px;
    font-size: 14px;
   }
   .ReviewListItem__author {
    margin-top: 16px;
    font-size: 12px;
   }
   .ReviewListItem__menu {
    padding: 14px;
    margin-top: 32px;
    font-size: 14px;
   }
   .ReviewListStaffCard {
    margin-top: 32px;
   }
   .ReviewListStaffCard__salon, .ReviewListStaffCard__name {
    font-size: 14px;
   }
   .ReviewListStaffCard__reply p {
    font-size: 14px;
   }
   .ReviewListStaffCard__label {
    padding: 8px 16px;
    font-size: 12px;
   }

   /* staff --------------------------------------------*/
     .StaffGrid {
    grid-template-columns: 1fr;
  }
  .StaffCard__role {
    font-size: 14px;
  }
  .StaffCard {
    gap: 16px;
  }
  .StaffCard__profile {
    gap: 8px;
  }

  .StaffInfoCard__copy p:first-child {
    font-size: 16px;
  }
  .StaffProfileSection__title {
    font-size: 18px;
  }
  .StaffDetailsPage__section .StaffCard__name {
    font-size: 18px;
  }
  .StaffDetailsPage__section .StaffCard__name {
    font-size: 18px;
  }
  .StaffProfileSection__text {
    font-size: 16px;
  }

  /* company list --------------------------------------------*/
    .company-list__label {
    padding-right: 0;
    font-size: 16px;
  }
  .company-list__value {
    padding-left: 0;
    font-size: 14px;
    font-weight: 400;
  }
}


/* =========================
   Archive Pagination
========================= */
.page--news .archive-list__more,
.page--blog .archive-list__more,
.SalonDetailPage.SalonDetailPage--blog .archive-list__more {
  width: auto;
  margin: 64px auto 0;
  display: flex;
  justify-content: center;
}

.page--news .archive-list__more .pagination,
.page--blog .archive-list__more .pagination,
.SalonDetailPage.SalonDetailPage--blog .archive-list__more .pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin: 0;
  font-family: "Montserrat", sans-serif;
  font-size: clamp(12px, 1.2vw, 18px);
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.2;
}

.page--news .archive-list__more .pagination a,
.page--blog .archive-list__more .pagination a,
.SalonDetailPage.SalonDetailPage--blog .archive-list__more .pagination a {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-decoration: none;
  color: #333;
}

.page--news .archive-list__more .pagination a.is-current,
.page--blog .archive-list__more .pagination a.is-current,
.SalonDetailPage.SalonDetailPage--blog .archive-list__more .pagination a.is-current {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.page--news .archive-list__more .pagination a:not(.is-current):hover,
.page--blog .archive-list__more .pagination a:not(.is-current):hover,
.SalonDetailPage.SalonDetailPage--blog .archive-list__more .pagination a:not(.is-current):hover {
  color: #d6b6c6;
}

.page--news .archive-list__more .pagination a.next,
.page--blog .archive-list__more .pagination a.next,
.SalonDetailPage.SalonDetailPage--blog .archive-list__more .pagination a.next {
  font-size: 1.1em;
}

@media (max-width: 768px) {
  .page--news .archive-list__more,
  .page--blog .archive-list__more,
  .SalonDetailPage.SalonDetailPage--blog .archive-list__more {
    width: auto;
    margin: 64px auto 0;
  }
}

@media (max-width: 390px) {
  .page--news .archive-list__more,
  .page--blog .archive-list__more,
  .SalonDetailPage.SalonDetailPage--blog .archive-list__more {
    width: auto;
    margin: 40px auto 0;
  }

  .page--news .archive-list__more .pagination,
  .page--blog .archive-list__more .pagination,
  .SalonDetailPage.SalonDetailPage--blog .archive-list__more .pagination {
    gap: 12px;
  }
}


/* =========================
   Header responsive (fluid font)
========================= */

/* ロゴ：40px → 最小20px */
.header__logo {
  font-size: clamp(20px, 2.5vw, 40px);
  width: clamp(80px, 12vw, 168px);
}

/* ナビリンク：18px → 最小12px */
.header__nav {
  gap: clamp(12px, 2vw, 40px);
}

.header__nav a {
  font-size: clamp(12px, 1.2vw, 18px);
  line-height: 1.2;
}
.header__nav a:hover {
      color: #D9B4C6;
}
.header__nav a.is-active:hover {
  color: inherit;
}

/* ソーシャルアイコン余白 */
.header__social {
  padding: 0 clamp(8px, 1.2vw, 24px);
}

/* ≤1024px：ナビをやや詰める */
@media (max-width: 1024px) {
  .header__nav {
    gap: clamp(8px, 1.5vw, 24px);
  }
  .header__nav a {
    font-size: clamp(11px, 1.3vw, 16px);
  }
}


/* =========================
   Header CTA buttons — PC size expansion
   (mobile ≤768px は common.css の既存ルールを維持)
========================= */
@media (min-width: 769px) {
  /* ベースパディングをvwで伸縮させ、最小値は既存の24pxを維持 */
  .header__cta .btn {
    padding-left:  clamp(24px, 1.8vw, 40px);
    padding-right: clamp(24px, 1.8vw, 40px);
  }

}


/* =========================
   Footer CTA buttons — PC size expansion
   (mobile ≤768px は common.css の既存ルールを維持)
========================= */
@media (min-width: 769px) {
  .footer__cta .PrimaryButton,
  .footer__cta .ButtonTertiary {
    max-width: clamp(268px, 20vw, 320px);
    min-height: clamp(60px, 4vw, 72px);
    height: auto;
    padding: clamp(16px, 1.1vw, 22px) clamp(24px, 1.8vw, 36px);
    line-height: 1.2;
    box-sizing: border-box;
  }

  .footer__cta .PrimaryButton {
    font-size: clamp(20px, 1.45vw, 24px);
  }

  .footer__cta .ButtonTertiary {
    font-size: clamp(22px, 1.55vw, 26px);
  }
}


/* =========================
   ButtonTertiary text wrapping fix
   (1440px～390px)
========================= */
.ButtonTertiary {
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  min-width: 0;
  gap: clamp(4px, 1vw, 8px);
  box-sizing: border-box;
}

@media (min-width: 1441px) {
  .ButtonTertiary {
    font-size: clamp(22px, 1.4vw, 26px);
    padding-left: clamp(16px, 1.2vw, 24px);
    padding-right: clamp(16px, 1.2vw, 24px);
  }
}

@media (min-width: 769px) and (max-width: 1440px) {
  .ButtonTertiary {
    font-size: clamp(16px, 1.35vw, 22px);
    padding-left: clamp(12px, 1.1vw, 20px);
    padding-right: clamp(12px, 1.1vw, 20px);
  }
  
  body.page--news .ButtonTertiary,
  body.page--blog .ButtonTertiary {
    font-size: clamp(14px, 1.2vw, 22px);
    padding-left: clamp(10px, 1vw, 20px);
    padding-right: clamp(10px, 1vw, 20px);
  }
}

@media (max-width: 768px) {
  .ButtonTertiary {
    font-size: clamp(14px, 3.5vw, 22px);
    padding-left: clamp(8px, 2vw, 16px);
    padding-right: clamp(8px, 2vw, 16px);
  }
}