@charset "UTF-8";
/*
Theme Name: 銀座どおり HANABI
Theme URI: https://example.com/
Author: Ginza-st. HANABI
Author URI: https://example.com/
Description: 銀座どおりHANABI（熊本）公式サイト用WordPressテーマ。静的HTML/CSS/JSサイトをそのままWordPress化したオリジナルテーマです。デザイン・レイアウト・アニメーション・JS動作は元の静的サイトから一切変更していません。
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: ginza-hanabi
License: All Rights Reserved

--------------------------------------------------------------------
以下は元の静的サイト（static/style.css）の内容をそのまま移植しています。
クラス名・値は一切変更していません（WordPress化にあたり本ファイル冒頭の
テーマ情報コメントを追加した以外の変更はありません）。
--------------------------------------------------------------------
*/

/* ==========================================================================
   銀座どおり HANABI — 共通スタイルシート
   "DANCE IN FIRE AND BLOOM."
   白ベース + グレー/黒 + ピンク #FF2D7E + ライム #BDFF00
   フォント: Noto Sans JP（本文）/ Bebas Neue・Inter（欧文見出し）
   ========================================================================== */

/* ---- Design tokens ------------------------------------------------------ */
:root {
  --white: #ffffff;
  --off-white: #fafaf9;
  --gray-50: #f5f4f3;
  --gray-100: #e8e6e3;
  --gray-200: #d4d1cd;
  --gray-300: #a8a4a0;
  --gray-500: #6b6864;
  --gray-700: #2a2826;
  --black: #0a0908;

  --pink: #FF2D7E;
  --pink-soft: #FFD5E5;
  --pink-deep: #C6175C;
  --lime: #BDFF00;
  --lime-soft: #E8FFA8;
  --lime-deep: #8FCC00;
  --line: #06C755;

  --text: #1a1816;
  --text-dim: #4a4744;
  --text-muted: #6b6864;
  --bg: var(--white);
  --bg-alt: var(--off-white);
  --bg-dark: #0c0a09;
  --hair: rgba(26, 24, 22, 0.10);
  --hair-strong: rgba(26, 24, 22, 0.18);

  --maxw: 1200px;
  --font-jp: "Noto Sans JP", "Helvetica Neue", system-ui, sans-serif;
  --font-display: "Bebas Neue", "Inter", sans-serif;
  --font-num: "Inter", "Noto Sans JP", sans-serif;
}

/* ---- Reset / base ------------------------------------------------------- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  font-family: var(--font-jp);
  font-weight: 400;
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
h1, h2, h3, h4, p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }

/* ---- Helpers ------------------------------------------------------------ */
.container { max-width: var(--maxw); margin: 0 auto; padding: 0 40px; }
.display { font-family: var(--font-display); letter-spacing: 0.05em; }
.num { font-family: var(--font-num); font-weight: 600; font-feature-settings: "tnum"; }
.gradient-text {
  background: linear-gradient(90deg, var(--pink), var(--lime));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.gradient-text--pink {
  background: linear-gradient(90deg, var(--pink), var(--pink-deep));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.gradient-text--lime {
  background: linear-gradient(90deg, var(--lime-deep), var(--lime));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.gradient-bar {
  width: 56px; height: 4px; border-radius: 4px;
  background: linear-gradient(90deg, var(--pink), var(--lime));
}

/* Image placeholder (stripe) — replace with real <img> in production */
.ph {
  position: relative; width: 100%;
  background: repeating-linear-gradient(135deg, #f5f4f3, #f5f4f3 10px, #ebe9e6 10px, #ebe9e6 20px);
  border: 1px solid var(--hair);
  overflow: hidden;
}
.ph--dark { background: repeating-linear-gradient(135deg, #1a1816, #1a1816 12px, #232120 12px, #232120 24px); border-color: rgba(255,255,255,0.1); }
.ph__label {
  position: absolute; inset: 8px;
  border: 0.5px dashed rgba(26,24,22,0.18);
  display: flex; align-items: center; justify-content: center;
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  letter-spacing: 0.5px; text-align: center; color: var(--text-muted);
  white-space: pre-line; line-height: 1.5; padding: 6px;
}
.ph--dark .ph__label { border-color: rgba(255,255,255,0.18); color: rgba(255,255,255,0.55); }
.ph__img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center; z-index: 1;
}

/* ---- Buttons ------------------------------------------------------------ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  height: 52px; padding: 0 28px; border: none; cursor: pointer;
  font-family: var(--font-jp); font-size: 14px; font-weight: 700;
  letter-spacing: 0.12em; transition: opacity .2s, transform .15s;
}
.btn:hover { opacity: .92; }
.btn:active { transform: scale(.98); }
.btn--line { background: var(--line); color: #fff; box-shadow: 0 8px 24px rgba(6,199,85,.35); }
.btn--pink { background: var(--pink); color: #fff; box-shadow: 0 8px 24px rgba(255,45,126,.35); }
.btn--outline { background: transparent; color: var(--text); border: 1px solid var(--text); font-weight: 600; }
.btn--ghost { background: rgba(255,255,255,.08); color: #fff; border: 1px solid rgba(255,255,255,.5); font-weight: 600; backdrop-filter: blur(8px); }
.btn--sm { height: 44px; padding: 0 22px; font-size: 13px; }
.btn--lg { height: 60px; padding: 0 38px; font-size: 16px; }

/* ==========================================================================
   HEADER (common — WordPress template part candidate)
   ========================================================================== */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: #0c0a09;
  border-bottom: 1px solid rgba(255,255,255,.12); color: #fff;
}
.header-top {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 40px; height: 30px; border-bottom: 1px solid rgba(255,255,255,.12);
  white-space: nowrap;
}
.header-top__left { display: flex; align-items: center; gap: 16px; }
.header-top__brand { font-family: var(--font-display); font-size: 13px; letter-spacing: 3px; color: #fff; }
.header-top__addr { font-size: 10.5px; color: rgba(255,255,255,.6); }
.header-top__right { display: flex; align-items: center; gap: 14px; }
.header-top__open { font-family: var(--font-num); font-size: 10.5px; letter-spacing: 2.5px; font-weight: 500; color: #fff; }
.header-top__sns { align-items: center; display: flex; gap: 16px; }
@media (max-width: 960px) {
	.header-top__sns { padding: 16px 24px; }
}
.header-top__sns span { font-family: "Inter", sans-serif; font-size: 10px; letter-spacing: 2px; color: rgba(255,255,255,.6); font-weight: 500; }
.header-divider { width: 1px; height: 10px; background: rgba(255,255,255,.25); }

.header-main {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 40px; height: 78px; gap: 24px;
}
.logo { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; line-height: 1; }
.logo--img { flex-direction: row; align-items: center; }
.logo__img { height: 40px; width: auto; max-width: 220px; object-fit: contain; display: block; }
.logo__img--footer { height: 70px; width: auto; object-fit: contain; transform: rotate(0deg) !important; image-orientation: none; }
.logo__fallback { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; line-height: 1; }
.logo__sub { font-family: "Inter", sans-serif; font-size: 9px; letter-spacing: .3em; color: rgba(255,255,255,.6); font-weight: 500; text-transform: uppercase; }
.logo__name { font-family: var(--font-display); font-size: 36px; letter-spacing: .06em; color: #fff; }
.main-nav { display: flex; gap: 28px; }
.nav-link {
  position: relative; padding: 8px 0;
  font-family: "Inter", sans-serif; font-size: 12px; font-weight: 500; letter-spacing: .25em;
  color: #fff;
  transition: color .2s;
}
.nav-link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(90deg, var(--pink), var(--lime));
  transform: scaleX(0); transform-origin: center; transition: transform .3s ease;
}
.nav-link:hover { color: var(--pink-deep); }
.nav-link:hover::after, .nav-link.is-active::after { transform: scaleX(1); }
.nav-link.is-active { color: var(--pink-deep); }
/* RECRUIT dropdown */
.nav-item { position: relative; display: flex; align-items: center; }
.nav-item--dropdown > .nav-link::before {
  content: "▾"; font-size: 9px; margin-left: 6px; color: var(--text-muted); vertical-align: middle;
}
.nav-dropdown {
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px);
  background: rgba(12,10,9,0.96); border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 12px 30px rgba(0,0,0,.45);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  padding: 6px 0; min-width: 132px; display: flex; flex-direction: column;
  opacity: 0; visibility: hidden; transition: opacity .2s, transform .2s, visibility .2s; z-index: 120;
}
.nav-item--dropdown:hover .nav-dropdown,
.nav-item--dropdown:focus-within .nav-dropdown,
.nav-item--dropdown.is-open .nav-dropdown { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-dropdown a {
  padding: 11px 22px; font-family: var(--font-jp);
  letter-spacing: .08em; text-align: center; white-space: nowrap; color: #fff; transition: color .2s, background .2s;
  display: flex; flex-direction: column; gap: 2px;
}
.nav-dropdown a:hover { color: var(--lime); background: rgba(255,255,255,0.06); }
.nav-dd-jp { font-size: 13px; font-weight: 500; }
.nav-dd-en { font-size: 10px; letter-spacing: 3px; color: var(--lime); }
.nav-dropdown a:hover .nav-dd-en { color: #fff; }

.header-cta { display: flex; align-items: center; gap: 14px; white-space: nowrap; }
.header-cta__res { text-align: right; }
.header-cta__label { font-family: var(--font-display); font-size: 11px; letter-spacing: 3px; color: rgba(255,255,255,.6); }
.header-cta__tel { font-family: var(--font-num); font-size: 17px; letter-spacing: .5px; font-weight: 700; color: #fff; }
.header-cta .btn { height: 42px; padding: 0 18px; font-size: 12.5px; }

.nav-toggle { display: none; }

/* ==========================================================================
   PAGE BANNER (sub pages)
   ========================================================================== */
.page-banner {
  position: relative; height: 320px; overflow: hidden; background: var(--black);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px;
  text-align: center; padding: 0 40px;
}
.page-banner::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(255,45,126,.32), transparent 60%),
    radial-gradient(ellipse at 50% 100%, rgba(189,255,0,.18), transparent 60%),
    linear-gradient(180deg, #1a1612 0%, #0a0908 100%);
}
.page-banner__hint { position: relative; font-family: var(--font-display); font-size: 14px; letter-spacing: 11px; color: var(--lime); text-shadow: 0 0 16px rgba(189,255,0,.4); }
.page-banner .gradient-bar { position: relative; }
.page-banner__title { position: relative; font-family: var(--font-jp); font-weight: 800; font-size: 42px; letter-spacing: .05em; color: #fff; line-height: 1.3; text-shadow: 0 2px 18px rgba(0,0,0,.5); }
.page-banner__latin { position: relative; font-family: "Inter", sans-serif; font-size: 13px; letter-spacing: 5px; color: rgba(255,255,255,.55); font-weight: 500; }
.breadcrumb { position: absolute; bottom: 16px; left: 40px; z-index: 6; font-family: "Inter", sans-serif; font-size: 11px; letter-spacing: 3px; color: rgba(255,255,255,.45); font-weight: 500; }
.breadcrumb a { color: rgba(255,255,255,.45); }
.breadcrumb span.sep { margin: 0 12px; }
.breadcrumb span.current { color: var(--lime); }

/* ==========================================================================
   SECTIONS
   ========================================================================== */
.section { padding: 100px 0; position: relative; }
.section--alt { background: var(--gray-50); }
.section--dark { background: var(--bg-dark); color: #fff; }
.section-head { display: flex; flex-direction: column; align-items: center; gap: 16px; padding-bottom: 48px; }
.section-head--left { align-items: flex-start; }
.section-hint { font-family: var(--font-display); font-size: 22px; letter-spacing: 12px; color: var(--text); }
.section--dark .section-hint { color: #fff; }
.section-title { font-family: var(--font-jp); font-weight: 700; font-size: 36px; letter-spacing: .04em; line-height: 1.3; text-align: center; }
.section-head--left .section-title { text-align: left; }
.section-latin { font-family: "Inter", sans-serif; font-size: 13px; letter-spacing: 4px; color: var(--text-muted); font-weight: 400; }
.section--dark .section-latin { color: rgba(255,255,255,.55); }

/* ==========================================================================
   HERO (TOP)
   ========================================================================== */
.hero {
  position: relative; min-height: 720px; height: 100vh; max-height: 900px;
  overflow: hidden; background: #000;
}
.hero__bg { position: absolute; inset: 0; overflow: hidden; opacity: 0; transition: opacity .8s ease; }
.hero__bg.is-on { opacity: 1; }
.hero__bg-base {
  position: absolute; inset: -4%;
  background: radial-gradient(ellipse at 50% 40%, #1a1612 0%, #0a0908 65%, #050403 100%);
  animation: kenBurns 24s ease-in-out infinite alternate;
}
.hero__haze {
  position: absolute; top: 20%; left: 50%; transform: translateX(-50%);
  width: 70%; height: 60%;
  background: radial-gradient(ellipse, rgba(255,45,126,.18), rgba(189,255,0,.08) 40%, transparent 70%);
  filter: blur(50px);
}
.hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; pointer-events: none; transition: opacity .8s ease; }
.hero__video.is-on { opacity: 1; }
.hero__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; pointer-events: none; transition: opacity .8s ease; z-index: 1; }
.hero__poster.is-on { opacity: 1; }
.hero__scrim { position: absolute; bottom: 0; left: 0; right: 0; height: 55%; background: linear-gradient(to top, rgba(8,7,6,.85) 0%, rgba(8,7,6,.5) 30%, transparent 100%); }

/* Hero intro overlay — black screen + center text, fades out after 1.5s */
.hero__intro {
  position: absolute; inset: 0; z-index: 5;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px;
  padding: 120px 40px 100px; text-align: center;
  background: #000; opacity: 1; transition: opacity .8s ease;
}
.hero__intro.is-out { opacity: 0; }
.hero__brand { font-family: var(--font-display); font-size: 14px; letter-spacing: 11px; color: var(--lime); text-shadow: 0 0 18px rgba(189,255,0,.4); }
.hero__title { font-family: var(--font-display); font-size: 80px; letter-spacing: .03em; line-height: 1.02; color: #fff; text-shadow: 0 4px 32px rgba(0,0,0,.7); }
.hero__sub { font-family: var(--font-jp); font-size: 16px; letter-spacing: .18em; color: rgba(255,255,255,.88); font-weight: 500; }
.hero__intro-phone {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 8px;
  font-family: var(--font-num); font-size: 18px; font-weight: 600; letter-spacing: 1px; color: #fff;
}
.hero__scroll {
  position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
  color: var(--lime); font-family: "Inter", sans-serif; font-size: 10px; letter-spacing: 6px; font-weight: 500;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  animation: scrollHint 2s ease-in-out infinite;
}

/* Hero phone & legacy reveal — replaced by intro cinematic (kept clean) */
.scroll-hint { display: none !important; }

.video-badge { display: none !important; opacity: 0; transition: opacity .8s ease;
  position: absolute; top: 24px; right: 24px; z-index: 6;
  padding: 8px 14px; background: rgba(0,0,0,.6); border: 1px solid rgba(189,255,0,.45);
  backdrop-filter: blur(8px); font-family: "JetBrains Mono", monospace;
  font-size: 10px; letter-spacing: 1.5px; color: var(--lime);
  display: flex; align-items: center; gap: 10px;
}
.video-badge__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--pink); animation: spotPulse 1.5s ease-in-out infinite; }

.hero__replay {
  position: absolute; bottom: 28px; right: 24px; z-index: 6;
  display: flex; align-items: center; gap: 8px;
  padding: 10px 18px; background: rgba(0,0,0,.6); border: 1px solid rgba(255,255,255,.4);
  backdrop-filter: blur(8px); border-radius: 999px; cursor: pointer;
  font-family: "Inter", sans-serif; font-size: 11px; letter-spacing: 2px; font-weight: 600; color: #fff;
  opacity: 0; pointer-events: none; transform: translateY(6px);
  transition: opacity .4s ease, transform .4s ease, border-color .2s ease, background .2s ease;
}
.hero__replay.is-on { opacity: 1; pointer-events: auto; transform: translateY(0); }
.hero__replay:hover { border-color: var(--lime); background: rgba(0,0,0,.8); }
.hero__replay-icon { font-size: 14px; line-height: 1; display: inline-block; transition: transform .4s ease; }
.hero__replay:hover .hero__replay-icon { transform: rotate(-180deg); }

/* 音声ON/OFFボタン（REPLAYと同系統のシンプルなピル型） */
.hero__mute {
  position: absolute; bottom: 28px; left: 24px; z-index: 6;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 16px; background: rgba(0,0,0,.6); border: 1px solid rgba(255,255,255,.4);
  backdrop-filter: blur(8px); border-radius: 999px; cursor: pointer;
  font-family: "Inter", sans-serif; font-size: 11px; letter-spacing: 2px; font-weight: 600; color: #fff;
  opacity: 0; pointer-events: none; transform: translateY(6px);
  transition: opacity .4s ease, transform .4s ease, border-color .2s ease, background .2s ease;
}
.hero__mute.is-on { opacity: 1; pointer-events: auto; transform: translateY(0); }
.hero__mute:hover { border-color: var(--lime); background: rgba(0,0,0,.8); }
.hero__mute-svg { display: block; }
.hero__mute-waves { opacity: 1; }
/* スラッシュ「/」は音声ON（再生中）のときだけ表示。ミュート中は非表示 */
.hero__mute-slash { display: none; }
.hero__mute.is-audio-on .hero__mute-slash { display: inline; }

@keyframes kenBurns { 0%{transform:scale(1) translate(0,0);} 50%{transform:scale(1.06) translate(-.8%,-1%);} 100%{transform:scale(1.02) translate(.6%,-.4%);} }
@keyframes scrollHint { 0%,100%{transform:translateY(0);opacity:.5;} 50%{transform:translateY(8px);opacity:1;} }
@keyframes spotPulse { 0%,100%{opacity:.6;transform:scale(1);} 50%{opacity:1;transform:scale(1.2);} }
@keyframes sparkle { 0%,100%{opacity:.3;} 50%{opacity:1;} }
.spark { position: absolute; border-radius: 50%; animation: sparkle 2s ease-in-out infinite; mix-blend-mode: screen; pointer-events: none; }

/* ==========================================================================
   CONCEPT
   ========================================================================== */
.concept-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: center; }
.concept-visual { position: relative; }
.concept-visual .ph { aspect-ratio: 3/4; }
.concept-tag {
  position: absolute; bottom: -14px; right: -14px; padding: 10px 18px;
  background: linear-gradient(135deg, var(--pink), var(--lime)); color: #fff;
  font-family: var(--font-display); font-size: 14px; letter-spacing: 3px;
}
.concept-body { font-size: 16px; line-height: 2.4; letter-spacing: .06em; color: var(--text-dim); }
.concept-body p { margin: 0 0 1.6em; }
.concept-body p:last-child { margin: 0; color: var(--text); font-weight: 500; }
/* CONCEPT PC/SP 分離制御 */
.concept-pc-only { display: block; }
.concept-sp-only { display: none; }
.concept-sign { margin-top: 36px; display: flex; align-items: center; gap: 16px; }
.concept-sign__diamond { width: 12px; height: 12px; transform: rotate(45deg); background: linear-gradient(135deg, var(--pink), var(--lime)); }
.concept-sign__text { font-family: var(--font-display); font-size: 14px; letter-spacing: 5px; }
.concept-sign__line { flex: 1; height: 1px; background: linear-gradient(to right, var(--hair), transparent); }

/* ==========================================================================
   CAST grid
   ========================================================================== */
.cast-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.cast-grid--4 { grid-template-columns: repeat(4, 1fr); }
.cast-card { position: relative; display: block; background: #fff; border: 1px solid var(--hair); }
.cast-card__media { position: relative; }
.cast-card__media .ph { aspect-ratio: 3/4; }
.badge {
  position: absolute; top: 10px; left: 10px; padding: 4px 10px;
  font-family: var(--font-display); font-size: 11px; letter-spacing: 2px; font-weight: 600; color: #fff;
}
.badge--new { background: linear-gradient(90deg, var(--pink), var(--pink-deep)); }
.badge--top { background: var(--lime); color: var(--text); }
.badge--no1 { background: linear-gradient(90deg, var(--pink), var(--lime)); }
.ig-dot {
  position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border-radius: 50%;
  background: rgba(255,255,255,.95); display: flex; align-items: center; justify-content: center; font-size: 15px;
}
.cast-card__body { padding: 16px 18px 18px; }
.cast-card__name { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.cast-card__name b { font-family: var(--font-display); font-size: 26px; letter-spacing: .06em; font-weight: 400; }
.cast-card__name small { font-size: 12px; color: var(--text-muted); font-weight: 500; }
.cast-card__tagline { font-size: 12px; color: var(--text-dim); line-height: 1.6; min-height: 38px; }
.cast-card__traits { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--hair); display: flex; flex-wrap: wrap; gap: 6px; }
.chip { font-size: 10px; padding: 3px 8px; border: 1px solid var(--hair); color: var(--text-muted); letter-spacing: .5px; font-family: "Inter", sans-serif; font-weight: 500; }

/* TOP cast overlay style */
.cast-card--overlay .ph { aspect-ratio: 3/4; }
.cast-card--overlay .cast-card__caption {
  position: absolute; bottom: 0; left: 0; right: 0; padding: 40px 12px 14px;
  background: linear-gradient(to top, rgba(10,9,8,.95), transparent);
}
.cast-card--overlay .cast-card__caption b { font-family: var(--font-display); font-size: 26px; letter-spacing: .06em; color: #fff; display: block; }
.cast-card--overlay .cast-card__caption small { font-size: 11px; color: rgba(255,255,255,.7); }

/* TOP cast — auto-scrolling marquee (right to left), edge-to-edge with white fade mask */
.cast-marquee {
  position: relative; width: 100%; overflow: hidden;
  margin-top: 36px; padding: 4px 0;
}
.cast-marquee__track {
  display: flex; gap: 20px; width: max-content;
  animation: castMarquee 38s linear infinite;
}
.cast-marquee:hover .cast-marquee__track { animation-play-state: paused; }
.cast-marquee__track .cast-card { flex: 0 0 300px; width: 300px; }
.cast-marquee__track .cast-card--overlay .ph { aspect-ratio: 3/4; }
.cast-marquee__fade {
  position: absolute; top: 0; bottom: 0; width: 160px; z-index: 5; pointer-events: none;
}
.cast-marquee__fade--left { left: 0; background: linear-gradient(to right, #fff 0%, rgba(255,255,255,.85) 40%, transparent 100%); }
.cast-marquee__fade--right { right: 0; background: linear-gradient(to left, #fff 0%, rgba(255,255,255,.85) 40%, transparent 100%); }
@keyframes castMarquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (max-width: 960px) {
  .cast-marquee__track .cast-card { flex-basis: 220px; width: 220px; }
  .cast-marquee__fade { width: 60px; }
  .cast-marquee__track { animation-duration: 26s; }
}

/* Filter tabs */
.filter-tabs { display: flex; justify-content: center; gap: 0; margin-bottom: 36px; border-bottom: 1px solid var(--hair); flex-wrap: wrap; }
.filter-tab { padding: 14px 32px; margin-bottom: -1px; display: flex; flex-direction: column; align-items: center; gap: 4px; background: none; border: none; }
.filter-tab__en { font-family: var(--font-display); font-size: 14px; letter-spacing: 4px; color: var(--text-muted); }
.filter-tab__jp { font-family: var(--font-jp); font-size: 12px; letter-spacing: .1em; color: var(--text-dim); font-weight: 500; }
.filter-tab.is-active { border-bottom: 2px solid var(--pink); }
.filter-tab.is-active .filter-tab__en { color: var(--pink); }
.filter-tab.is-active .filter-tab__jp { color: var(--text); }
.is-hidden { display: none !important; }

/* chip-style tabs (gallery/column/news) */
.chip-tabs { display: flex; justify-content: center; gap: 10px; margin-bottom: 36px; flex-wrap: wrap; }
.chip-tab { padding: 10px 22px; border: 1px solid var(--hair); color: var(--text-dim); font-family: var(--font-jp); font-size: 13px; font-weight: 600; letter-spacing: .1em; background: none; }
.chip-tab.is-active { border-color: var(--pink); color: var(--pink-deep); background: var(--pink-soft); }
.chip-tab .num { font-size: 10px; color: var(--text-muted); }

/* ==========================================================================
   SYSTEM
   ========================================================================== */
.notice-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; margin-bottom: 60px; }
.card-fee { padding: 24px 32px; border: 1px solid var(--hair); background: linear-gradient(135deg, var(--pink-soft), var(--lime-soft)); display: flex; align-items: center; gap: 20px; }
.card-fee__icon { font-size: 36px; }
.card-fee__label { font-family: var(--font-display); font-size: 14px; letter-spacing: 4px; color: var(--pink-deep); margin-bottom: 4px; }
.card-fee__main { font-size: 26px; font-weight: 700; }
.card-fee__sub { font-size: 11.5px; color: var(--text-dim); margin-top: 6px; }
.notice-box { padding: 24px 28px; border: 1px solid var(--hair); background: var(--gray-50); display: flex; flex-direction: column; justify-content: center; }
.notice-box__label { font-family: var(--font-display); font-size: 13px; letter-spacing: 4px; color: var(--pink); margin-bottom: 8px; }
.notice-box__text { font-size: 12.5px; color: var(--text-dim); line-height: 2; }

.room-list { display: flex; flex-direction: column; gap: 20px; }
.room { display: grid; grid-template-columns: 380px 1fr; gap: 40px; padding: 40px 32px; border: 1px solid var(--hair); background: #fff; position: relative; }
.room__num { position: absolute; top: 24px; right: 32px; font-family: var(--font-display); font-size: 88px; color: var(--gray-100); line-height: 1; }
.room__media .ph { aspect-ratio: 4/3; }
.room__tags { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.room__tag { font-size: 10.5px; padding: 4px 10px; border: 1px solid var(--hair); color: var(--text-muted); letter-spacing: .5px; font-weight: 500; }
.room__tag--vip { border-color: var(--pink); color: var(--pink-deep); }
.room__en { font-family: var(--font-display); font-size: 16px; letter-spacing: 5px; color: var(--pink); }
.room__jp { margin: 6px 0 14px; font-size: 32px; font-weight: 700; letter-spacing: .04em; }
.room__desc { font-size: 13.5px; color: var(--text-dim); line-height: 1.8; margin-bottom: 24px; }
.price-table { border: 1px solid var(--hair); background: var(--gray-50); }
.price-row { display: grid; grid-template-columns: 1fr auto; padding: 14px 20px; border-bottom: 1px solid var(--hair); align-items: baseline; gap: 12px; }
.price-row:last-child { border-bottom: none; }
.price-row--head { padding: 16px 20px; }
.price-row--accent { background: rgba(255,45,126,.06); }
.price-row__key { font-size: 13px; letter-spacing: .5px; }
.price-row__key small { color: var(--text-muted); font-size: 11px; }
.price-row__val { font-family: var(--font-num); font-size: 17px; font-weight: 600; }
.price-row--head .price-row__val { font-size: 26px; font-weight: 700; }
.price-row__val--free { color: var(--lime-deep); }
.price-row__val--accent { color: var(--pink-deep); font-weight: 700; }

.nom-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 40px; }
.nom { padding: 24px 32px; border: 1px solid var(--hair); background: #fff; display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; }
.nom__label { font-family: var(--font-display); font-size: 12px; letter-spacing: 4px; color: var(--pink); margin-bottom: 4px; }
.nom__jp { font-size: 17px; font-weight: 600; }
.nom__note { font-size: 11.5px; color: var(--text-muted); margin-top: 4px; }
.nom__price { font-family: var(--font-num); font-size: 30px; font-weight: 700; }

.drinks-block { padding: 28px 32px; border: 1px solid var(--hair); background: var(--gray-50); margin-bottom: 16px; }
.drinks-block--vip { border-color: var(--pink); background: linear-gradient(135deg, rgba(255,213,229,.5), rgba(232,255,168,.3)); }
.drinks-block__head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 18px; flex-wrap: wrap; }
.drinks-block__en { font-family: var(--font-display); font-size: 12px; letter-spacing: 3px; color: var(--text-muted); }
.drinks-block__jp { font-size: 14px; font-weight: 600; }
.drinks-block__note { font-size: 11.5px; color: var(--text-muted); margin-left: auto; }
.drinks-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.drink { padding: 14px 16px; border: 1px solid var(--hair); background: #fff; }
.drink__cat { font-family: var(--font-display); font-size: 11px; letter-spacing: 3px; color: var(--pink); margin-bottom: 4px; }
.drink__name { font-size: 14px; font-weight: 500; white-space: nowrap; }

/* PC版：飲み放題メニューカード幅調整 */
.drinks-grid { gap: 8px; }
.drink { padding: 12px 14px; }

.model-case { padding: 36px 40px; border: 1px solid var(--hair); background: var(--gray-50); position: relative; overflow: hidden; }
.model-case__ghost { position: absolute; top: -20px; right: -10px; font-family: var(--font-display); font-size: 200px; color: var(--gray-100); line-height: 1; pointer-events: none; }
.model-case__inner { position: relative; }
.model-case__label { font-family: var(--font-display); font-size: 14px; letter-spacing: 5px; color: var(--pink); margin-bottom: 6px; }
.model-case__title { margin-bottom: 22px; font-size: 26px; font-weight: 700; letter-spacing: .04em; }
.model-case__cols { display: grid; grid-template-columns: 2fr 1px 1fr; gap: 30px; align-items: center; }
.model-case__rows { display: flex; flex-direction: column; gap: 10px; }
.model-case__row { display: grid; grid-template-columns: 160px 1fr; padding-bottom: 8px; border-bottom: 1px solid var(--hair); }
.model-case__row dt { font-size: 12px; color: var(--text-muted); }
.model-case__row dd { font-size: 13.5px; font-weight: 500; margin: 0; }
.model-case__divider { background: var(--hair); width: 1px; height: 140px; }
.model-case__total { text-align: center; }
.model-case__total-label { font-size: 11.5px; color: var(--text-muted); margin-bottom: 6px; }
.model-case__total-amount { display: flex; align-items: baseline; justify-content: center; gap: 4px; }
.model-case__total-amount .big { font-family: var(--font-num); font-size: 50px; font-weight: 800; }
.model-case__per { margin-top: 6px; font-size: 11.5px; color: var(--text-muted); }

/* ==========================================================================
   GALLERY
   ========================================================================== */
.gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 220px; gap: 10px; }
.gallery-item { position: relative; overflow: hidden; }
.gallery-item .ph { height: 100%; }
.gallery-item--big { grid-row: span 2; grid-column: span 2; }
.gallery-item--wide { grid-column: span 2; }
.gallery-item__caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 24px 14px 12px; background: linear-gradient(to top, rgba(0,0,0,.92), transparent); }
.gallery-item__tag { font-family: var(--font-display); font-size: 11px; letter-spacing: 3px; color: var(--lime); margin-bottom: 3px; }
.gallery-item__cap { font-size: 11.5px; color: #fff; }
.indoor-view { margin-top: 60px; padding: 28px; border: 1px solid rgba(255,255,255,.15); display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; background: rgba(255,255,255,.04); }
.indoor-view__icon { width: 80px; height: 80px; border-radius: 50%; background: rgba(189,255,0,.1); border: 1px solid var(--lime); display: flex; align-items: center; justify-content: center; font-family: "Inter", sans-serif; font-size: 16px; font-weight: 700; color: var(--lime); }
.indoor-view__label { font-family: var(--font-display); font-size: 12px; letter-spacing: 5px; color: var(--lime); margin-bottom: 6px; }
.indoor-view__title { font-size: 19px; font-weight: 700; color: #fff; }
.indoor-view__sub { font-size: 12px; color: rgba(255,255,255,.55); margin-top: 6px; }
.indoor-view__btn { padding: 12px 22px; background: linear-gradient(135deg, var(--pink), var(--lime)); color: #fff; font-family: var(--font-display); font-size: 13px; letter-spacing: 3px; }

/* ==========================================================================
   SNS + NEWS (TOP)
   ========================================================================== */
.split-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; }
.sns-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
.sns-card { padding: 22px 12px; border: 1px solid var(--hair); display: flex; flex-direction: column; align-items: center; gap: 12px; background: #fff; }
.sns-card__icon { width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 22px; color: #fff; }
.sns-card__name { font-family: var(--font-display); font-size: 14px; letter-spacing: 3px; }
.sns-card__meta { font-size: 11px; color: var(--text-muted); text-align: center; }
.news-list { }
.news-row { padding: 20px 0; border-bottom: 1px solid var(--hair); display: flex; align-items: center; gap: 18px; }
.news-row:first-child { border-top: 1px solid var(--hair); }
.news-row__date { font-family: var(--font-num); font-size: 13px; color: var(--text-muted); letter-spacing: 1px; width: 92px; flex-shrink: 0; }
.news-row__cat { font-family: var(--font-display); font-size: 11px; letter-spacing: 3px; color: var(--pink); padding: 4px 10px; border: 1px solid var(--pink); width: 64px; text-align: center; flex-shrink: 0; }
.news-row__title { font-size: 14px; flex: 1; font-weight: 500; }
.news-row__arrow { color: var(--pink); flex-shrink: 0; }

/* ==========================================================================
   ACCESS
   ========================================================================== */
.access-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; margin-bottom: 70px; }
.map-wrap { position: relative; margin-bottom: 12px; }
.map-wrap .ph { aspect-ratio: 4/3; }
.map-btn { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); padding: 12px 28px; background: var(--pink); color: #fff; border: none; font-size: 13px; letter-spacing: 1.5px; font-weight: 700; box-shadow: 0 6px 18px rgba(255,45,126,.4); }
.info-label { font-family: var(--font-display); font-size: 16px; letter-spacing: 8px; color: var(--pink); margin-bottom: 10px; }
.info-shop-name { margin: 0 0 28px; font-size: 32px; font-weight: 700; letter-spacing: .04em; }
.info-row { display: grid; grid-template-columns: 90px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--hair); }
.info-row dt { font-family: var(--font-display); font-size: 12px; letter-spacing: 3px; color: var(--pink); padding-top: 4px; }
.info-row dd { margin: 0; font-size: 14px; line-height: 1.7; white-space: pre-line; font-weight: 500; }
.info-row dd.num { font-family: var(--font-num); font-size: 22px; font-weight: 700; }
.guide-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.guide-step { padding: 14px; border: 1px solid var(--hair); background: #fff; }
.guide-step .ph { aspect-ratio: 4/3; }
.guide-step__body { padding: 16px 8px 4px; }
.guide-step__num { font-family: var(--font-display); font-size: 12px; letter-spacing: 3px; color: var(--pink); margin-bottom: 6px; }
.guide-step__label { font-size: 15px; margin-bottom: 6px; line-height: 1.5; font-weight: 700; }
.guide-step__desc { font-size: 11px; color: var(--text-muted); line-height: 1.6; }
.routes-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.route { display: grid; grid-template-columns: 64px 1fr; gap: 16px; padding: 22px 28px; border: 1px solid var(--hair); background: var(--gray-50); align-items: center; }
.route__icon { width: 56px; height: 56px; border-radius: 50%; background: #fff; border: 1px solid var(--hair); display: flex; align-items: center; justify-content: center; font-size: 24px; }
.route__label { font-size: 16px; margin-bottom: 6px; letter-spacing: .02em; font-weight: 700; }
.route__detail { font-size: 12px; color: var(--text-dim); line-height: 1.7; }

.center-head { text-align: center; margin-bottom: 30px; }
.center-head .info-label { display: block; }
.center-head .gradient-bar { margin: 0 auto; }
.center-head h2 { margin-top: 14px; font-size: 28px; font-weight: 700; letter-spacing: .04em; }
.block { margin-bottom: 70px; }

/* ==========================================================================
   RECRUIT
   ========================================================================== */
.recruit-hero { position: relative; height: 680px; overflow: hidden; background: var(--black); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; padding: 120px 40px 40px; text-align: center; }
.recruit-hero__bg { position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 0%, rgba(255,45,126,.35), transparent 60%), radial-gradient(ellipse at 50% 100%, rgba(189,255,0,.18), transparent 60%), linear-gradient(180deg, #1a1612 0%, #0a0908 100%); animation: kenBurns 22s ease-in-out infinite alternate; }
.recruit-hero__content { position: relative; z-index: 5; display: flex; flex-direction: column; align-items: center; gap: 22px; }
.recruit-hero__hint { font-family: var(--font-display); font-size: 14px; letter-spacing: 12px; color: var(--lime); text-shadow: 0 0 12px rgba(189,255,0,.4); }
.recruit-hero__title { font-size: 40px; font-weight: 800; letter-spacing: .04em; line-height: 1.4; text-shadow: 0 2px 18px rgba(0,0,0,.6); }
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; width: 100%; max-width: 820px; }
.stat { padding: 24px 18px; border: 1px solid var(--hair); text-align: center; }
.stat--pink { background: var(--pink-soft); }
.stat--pink-deep { background: linear-gradient(135deg, var(--pink), var(--pink-deep)); color: #fff; }
.stat--lime { background: linear-gradient(135deg, var(--lime), var(--lime-deep)); }
.stat--ghost { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.2); }
.stat__label { font-family: var(--font-display); font-size: 12px; letter-spacing: 4px; }
.stat__value { display: flex; align-items: baseline; justify-content: center; gap: 4px; margin-top: 10px; }
.stat__value .num { font-size: 36px; font-weight: 800; }
.stat__suffix { font-size: 11px; margin-top: 6px; }
.stat--pink-deep .stat__label, .stat--pink-deep .stat__suffix { color: rgba(255,255,255,.85); }
.guarantee-pill { margin-top: 10px; padding: 10px 20px; border: 1px solid var(--lime); background: rgba(189,255,0,.08); color: var(--lime); font-size: 13px; letter-spacing: 1.5px; font-weight: 600; }
.guarantee-pill .num { color: #fff; font-weight: 700; }

.qa-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.qa { padding: 24px 28px; border: 1px solid var(--hair); background: #fff; }
.qa__q { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; }
.qa__q-mark { font-family: var(--font-display); font-size: 16px; color: var(--pink); letter-spacing: 2px; flex-shrink: 0; }
.qa__q-text { font-size: 15.5px; line-height: 1.6; font-weight: 600; }
.qa__a { display: flex; align-items: baseline; gap: 12px; padding-left: 28px; padding-top: 12px; border-top: 1px dashed var(--hair); }
.qa__a-mark { font-family: var(--font-display); font-size: 14px; color: var(--lime-deep); letter-spacing: 2px; flex-shrink: 0; }
.qa__a-text { font-size: 13px; color: var(--text-dim); line-height: 1.8; }

.benefit-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.benefit { padding: 28px 20px; border: 1px solid var(--hair); background: #fff; text-align: center; }
.benefit__num { font-family: var(--font-display); font-size: 42px; color: var(--gray-100); line-height: 1; margin-bottom: 12px; }
.benefit__title { font-size: 17px; font-weight: 700; margin-bottom: 10px; letter-spacing: .02em; }
.benefit__desc { font-size: 11.5px; color: var(--text-dim); line-height: 1.7; }

.timeline { display: flex; align-items: stretch; }
.timeline__step { flex: 1; padding: 20px 14px; text-align: center; border: 1px solid var(--hair); border-left: none; background: #fff; position: relative; }
.timeline__step:first-child { border-left: 1px solid var(--hair); }
.timeline__en { font-family: var(--font-display); font-size: 11px; letter-spacing: 3px; color: var(--pink); margin-bottom: 6px; }
.timeline__time { font-family: var(--font-num); font-size: 24px; font-weight: 700; letter-spacing: 1px; margin-bottom: 8px; }
.timeline__label { font-size: 14px; margin-bottom: 6px; font-weight: 600; }
.timeline__desc { font-size: 10.5px; color: var(--text-muted); line-height: 1.6; }

.job-desc { padding: 28px 32px; margin-bottom: 36px; background: var(--gray-50); border: 1px solid var(--hair); }
.job-desc__label { font-family: var(--font-display); font-size: 13px; letter-spacing: 4px; color: var(--pink); margin-bottom: 12px; }
.job-desc__text { font-size: 14px; color: var(--text-dim); line-height: 2; }

.trial-card { padding: 36px 40px; border: 1px solid var(--hair); background: #fff; }
.trial-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 40px; align-items: center; }
.trial-card__title { font-size: 22px; font-weight: 700; margin-bottom: 14px; letter-spacing: .04em; }
.trial-card__text { font-size: 13px; color: var(--text-dim); line-height: 2; }
.trial-points { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.trial-point { padding: 16px 18px; border: 1px solid var(--hair); background: linear-gradient(135deg, var(--pink-soft), var(--lime-soft)); }
.trial-point b { font-size: 14px; font-weight: 700; display: block; margin-bottom: 4px; }
.trial-point span { font-size: 11px; color: var(--text-muted); }

.voice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.voice { padding: 28px 26px; border: 1px solid var(--hair); background: #fff; position: relative; }
.voice__quote { position: absolute; top: 12px; right: 18px; font-family: var(--font-display); font-size: 70px; color: var(--pink-soft); line-height: 1; }
.voice__head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.voice__avatar { width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg, var(--pink-soft), var(--lime-soft)); border: 1px solid var(--hair); }
.voice__name { font-size: 16px; font-weight: 700; }
.voice__exp { font-size: 10.5px; color: var(--text-muted); }
.voice__text { font-size: 13px; color: var(--text-dim); line-height: 1.9; margin: 0 0 14px; }
.voice__tags { display: flex; gap: 6px; flex-wrap: wrap; }
.voice__tag { font-size: 10px; padding: 3px 8px; border: 1px solid var(--pink); color: var(--pink-deep); letter-spacing: .5px; font-weight: 500; }

.persona-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.persona { padding: 28px 24px; border: 1px solid var(--hair); background: #fff; text-align: center; }
.persona__age { font-family: var(--font-display); font-size: 13px; letter-spacing: 3px; color: var(--pink); }
.persona__title { margin: 14px 0 8px; font-size: 19px; font-weight: 700; }
.persona__desc { font-size: 12px; color: var(--text-dim); line-height: 1.7; margin-bottom: 16px; }
.persona__bar { height: 4px; background: var(--gray-100); border-radius: 2px; position: relative; margin-bottom: 8px; }
.persona__bar i { position: absolute; left: 0; top: 0; bottom: 0; background: linear-gradient(90deg, var(--pink), var(--lime)); border-radius: 2px; }
.persona__pct { font-family: var(--font-num); font-size: 24px; font-weight: 700; }

.welfare-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.welfare { padding: 22px 16px; text-align: center; border: 1px solid var(--hair); background: var(--gray-50); }
.welfare__icon { font-size: 32px; margin-bottom: 10px; }
.welfare__label { font-size: 14px; font-weight: 600; }

.steps-flow { display: flex; align-items: stretch; }
.step { flex: 1; padding: 28px 20px; border: 1px solid var(--hair); background: #fff; text-align: center; }
.step__num { width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, var(--pink), var(--lime)); color: #fff; margin: 0 auto 12px; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 16px; }
.step__title { font-size: 17px; margin-bottom: 6px; font-weight: 700; }
.step__desc { font-size: 11.5px; color: var(--text-dim); margin-bottom: 14px; }
.step__escape { font-size: 10px; padding: 4px 8px; color: var(--pink-deep); border: 1px solid var(--pink-soft); background: var(--pink-soft); display: inline-block; letter-spacing: .5px; font-weight: 600; }
.step-arrow { width: 30px; display: flex; align-items: center; justify-content: center; color: var(--pink); font-size: 20px; }

/* FAQ / Accordion */
.faq { max-width: 900px; margin: 0 auto; }
.faq-item { border-bottom: 1px solid var(--hair); }
.faq-q { display: grid; grid-template-columns: 50px 1fr auto; gap: 16px; padding: 22px 0; align-items: center; width: 100%; background: none; border: none; text-align: left; }
.faq-q__mark { font-family: var(--font-display); font-size: 15px; color: var(--pink); letter-spacing: 2px; }
.faq-q__text { font-size: 16px; font-weight: 600; letter-spacing: .02em; }
.faq-q__plus { color: var(--pink); font-size: 20px; transition: transform .2s; }
.faq-item.is-open .faq-q__plus { transform: rotate(45deg); }
.faq-a { padding: 0 0 24px 66px; font-size: 14px; color: var(--text-dim); line-height: 1.95; display: none; }
.faq-item.is-open .faq-a { display: block; }
.faq-a__mark { color: var(--lime-deep); margin-right: 10px; font-family: var(--font-display); font-size: 15px; }
.faq-section-head { display: flex; align-items: center; gap: 18px; margin-bottom: 28px; }
.faq-section-head__icon { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 13px; letter-spacing: 1px; }
.faq-section-head__icon--visit { background: var(--pink-soft); border: 1px solid var(--pink); color: var(--pink-deep); }
.faq-section-head__icon--recruit { background: var(--lime-soft); border: 1px solid var(--lime); color: var(--lime-deep); }
.faq-section-head__en { font-family: var(--font-display); font-size: 12px; letter-spacing: 4px; }
.faq-section-head__jp { font-size: 24px; font-weight: 700; letter-spacing: .04em; }

/* Career path (staff) */
.career { display: flex; align-items: stretch; flex-wrap: wrap; gap: 0; }
.career__node { flex: 1; min-width: 120px; padding: 24px 16px; border: 1px solid var(--hair); background: #fff; text-align: center; border-left: none; }
.career__node:first-child { border-left: 1px solid var(--hair); }
.career__step { font-family: var(--font-display); font-size: 11px; letter-spacing: 3px; color: var(--pink); margin-bottom: 8px; }
.career__title { font-size: 16px; font-weight: 700; }
.career-arrow { width: 28px; display: flex; align-items: center; justify-content: center; color: var(--pink); font-size: 18px; }

/* Cross-recruit link banner */
.cross-link { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 32px; border: 1px solid var(--hair); background: linear-gradient(135deg, var(--pink-soft), var(--lime-soft)); margin-top: 40px; }
.cross-link__text { font-size: 16px; font-weight: 700; }
.cross-link__sub { font-size: 12px; color: var(--text-dim); margin-top: 4px; }

.sticky-cta { position: fixed; right: 30px; bottom: 30px; z-index: 50; }
.sticky-cta .btn { box-shadow: 0 10px 32px rgba(6,199,85,.5); }

/* ==========================================================================
   CAST DETAIL
   ========================================================================== */
.detail-hero { position: relative; overflow: hidden; background: radial-gradient(ellipse at 50% 0%, #1a1612, #0a0908); padding: 60px 40px 80px; }
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; position: relative; z-index: 2; }
.detail-media .ph { aspect-ratio: 3/4; }
.detail-subs { margin-top: 12px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.detail-subs .ph { aspect-ratio: 1/1; }
.detail-info__en { font-family: var(--font-display); font-size: 11px; letter-spacing: 6px; color: var(--lime); margin-bottom: 14px; }
.detail-info__name { font-family: var(--font-jp); font-size: 48px; font-weight: 800; color: #fff; letter-spacing: .04em; line-height: 1; margin-bottom: 8px; }
.detail-info__kana { font-size: 16px; color: rgba(255,255,255,.7); margin-bottom: 20px; }
.detail-info__tagline { font-size: 20px; line-height: 1.7; letter-spacing: .06em; color: var(--lime); margin: 0 0 22px; border-left: 2px solid var(--lime); padding-left: 16px; }
.detail-info__intro { font-size: 13.5px; color: rgba(255,255,255,.8); line-height: 2; margin: 0 0 30px; }
.detail-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 24px; }
.detail-fact { padding: 14px 16px; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.04); }
.detail-fact__label { font-family: var(--font-display); font-size: 9.5px; letter-spacing: 3px; color: var(--lime); margin-bottom: 4px; }
.detail-fact__value { font-size: 16px; color: #fff; }
.qa-table { background: var(--gray-50); border: 1px solid var(--hair); display: grid; grid-template-columns: 1fr 1fr; }
.qa-cell { padding: 18px 24px; border-bottom: 1px solid var(--hair); display: grid; grid-template-columns: 36px 1fr; gap: 14px; }
.qa-cell:nth-child(odd) { border-right: 1px solid var(--hair); }
.qa-cell__num { font-family: var(--font-display); font-size: 12px; color: var(--pink); letter-spacing: 2px; }
.qa-cell__q { font-size: 12px; color: var(--text-muted); margin-bottom: 4px; }
.qa-cell__a { font-size: 14px; }
.detail-nav { display: grid; grid-template-columns: 1fr auto 1fr; gap: 20px; }
.detail-nav__item { padding: 22px 28px; border: 1px solid var(--hair); background: var(--gray-50); display: flex; align-items: center; gap: 16px; }
.detail-nav__item--next { justify-content: flex-end; }
.detail-nav__center { padding: 22px 28px; border: 1px solid var(--pink); background: var(--pink-soft); color: var(--pink-deep); font-size: 13px; letter-spacing: .25em; display: flex; align-items: center; justify-content: center; }
.detail-nav__dir { font-family: var(--font-display); font-size: 10px; letter-spacing: 3px; color: var(--text-muted); }
.detail-nav__name { font-size: 15px; font-weight: 600; }

/* Article cards (column / news) */
.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.article { background: #fff; border: 1px solid var(--hair); display: flex; flex-direction: column; }
.article .ph { aspect-ratio: 16/9; }
.article__body { padding: 20px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.article__meta { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.article__date { font-family: var(--font-num); font-size: 11px; color: var(--text-muted); letter-spacing: 1px; }
.article__tag { font-family: var(--font-display); font-size: 11px; letter-spacing: 3px; color: var(--pink); padding: 3px 9px; border: 1px solid var(--pink); }
.article__title { font-size: 16px; font-weight: 700; line-height: 1.6; flex: 1; margin-bottom: 10px; }
.article__excerpt { font-size: 12px; color: var(--text-dim); line-height: 1.7; }
.article__more { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--hair); font-family: var(--font-display); font-size: 11px; letter-spacing: 3px; color: var(--pink); }

/* News list (simple rows) */
.news-articles { max-width: 900px; margin: 0 auto; }
.news-article { display: grid; grid-template-columns: 110px 1fr auto; gap: 20px; padding: 26px 0; border-bottom: 1px solid var(--hair); align-items: start; }
.news-article:first-child { border-top: 1px solid var(--hair); }
.news-article__date { font-family: var(--font-num); font-size: 13px; color: var(--text-muted); letter-spacing: 1px; padding-top: 2px; }
.news-article__title { font-size: 16px; font-weight: 700; margin-bottom: 6px; }
.news-article__excerpt { font-size: 12.5px; color: var(--text-dim); line-height: 1.7; }
.news-article__arrow { color: var(--pink); padding-top: 2px; }

.pagination { margin-top: 60px; display: flex; justify-content: center; gap: 6px; }
.pagination a { width: 40px; height: 40px; border: 1px solid var(--hair); color: var(--text-dim); font-family: "Inter", sans-serif; font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.pagination a.is-active { border-color: var(--pink); color: var(--pink-deep); background: var(--pink-soft); }

.lead { text-align: center; max-width: 720px; margin: 0 auto 50px; font-size: 14px; color: var(--text-dim); line-height: 2; }
.schedule-box { margin-top: 60px; padding: 24px 32px; background: var(--gray-50); border: 1px solid var(--hair); display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; }
.schedule-box__label { font-family: var(--font-display); font-size: 14px; letter-spacing: 4px; color: var(--pink); margin-bottom: 8px; }
.schedule-box__text { font-size: 14px; color: var(--text-dim); line-height: 1.7; }
.schedule-box__actions { display: flex; gap: 10px; }
.contact-box { margin-top: 70px; padding: 32px 36px; border: 1px solid var(--hair); background: linear-gradient(135deg, var(--pink-soft), var(--lime-soft)); display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; }
.contact-box__label { font-family: var(--font-display); font-size: 12px; letter-spacing: 4px; color: var(--pink-deep); margin-bottom: 6px; }
.contact-box__title { font-size: 19px; font-weight: 700; margin-bottom: 6px; }
.contact-box__sub { font-size: 12px; color: var(--text-dim); }
.contact-box__actions { display: flex; gap: 10px; }

.center-cta { margin-top: 60px; text-align: center; }
.center-cta__inner { display: inline-flex; gap: 14px; }

/* lure (recruit promo on cast page) */
.lure { background: var(--bg-dark); color: #fff; padding: 90px 40px; position: relative; overflow: hidden; text-align: center; }
.lure__bg { position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 50%, rgba(255,45,126,.15), transparent 70%); }
.lure__inner { max-width: 900px; margin: 0 auto; position: relative; }
.lure__hint { font-family: var(--font-display); font-size: 14px; letter-spacing: 8px; color: var(--lime); margin-bottom: 16px; }
.lure__title { font-size: 32px; font-weight: 700; letter-spacing: .04em; line-height: 1.4; margin-bottom: 16px; }
.lure__text { font-size: 14px; color: rgba(255,255,255,.7); line-height: 2; margin-bottom: 28px; }
.lure__text .num { color: var(--lime); }

.see-more { margin-top: 28px; padding: 15px 0; text-align: center; border: 1px solid var(--text); font-family: "Inter", sans-serif; font-size: 13px; letter-spacing: .18em; font-weight: 600; text-transform: uppercase; display: block; }
.see-more--accent { border-color: var(--pink); background: var(--pink); color: #fff; }
.see-more--light { border-color: rgba(255,255,255,.4); color: #fff; }

/* ==========================================================================
   FOOTER (common — WordPress template part candidate)
   ========================================================================== */
.site-footer { background: var(--bg-dark); color: #fff; border-top: 1px solid rgba(255,255,255,.1); padding: 70px 0 30px; }
.footer-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 60px; margin-bottom: 60px; }
.footer-brand .gradient-bar { margin: 20px 0; }
.footer-brand__addr { font-size: 12px; color: rgba(255,255,255,.7); line-height: 2; }
.footer-col__title { font-family: var(--font-display); font-size: 13px; letter-spacing: 4px; color: var(--lime); margin-bottom: 18px; }
.footer-nav { display: flex; flex-direction: column; gap: 10px; }
.footer-nav a { font-size: 12px; color: rgba(255,255,255,.7); letter-spacing: 2px; font-family: "Inter", sans-serif; font-weight: 500; }
.footer-tel { font-family: var(--font-num); font-size: 24px; color: #fff; margin-bottom: 12px; font-weight: 700; }
.footer-sns { margin-top: 14px; display: flex; flex-direction: column; gap: 10px; }
.footer-sns span { width: 100%; text-align: center; border: 1px solid rgba(255,255,255,.15); font-family: "Inter", sans-serif; font-size: 11px; letter-spacing: 2px; color: rgba(255,255,255,.7); font-weight: 500; }
.footer-sns span a { display: block; padding: 10px; }
.sister { padding: 16px; border: 1px solid rgba(255,255,255,.15); background: rgba(6,16,30,.4); }
.sister__head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.sister__badge { padding: 6px 10px; background: rgba(24,163,221,.15); border: 1px solid #7ec5ed; font-family: var(--font-display); font-size: 12px; letter-spacing: 1px; color: #7ec5ed; }
.sister__name { font-size: 14px; color: #fff; font-weight: 600; }
.sister__name span { color: #7ec5ed; }
.sister__desc { font-size: 10.5px; color: rgba(255,255,255,.55); line-height: 1.6; }
.footer-bottom { padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); display: flex; justify-content: space-between; font-size: 10.5px; color: rgba(255,255,255,.5); letter-spacing: 2px; font-family: "Inter", sans-serif; font-weight: 500; }
.footer-bottom__links { display: flex; gap: 24px; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 960px) {
  .container { padding: 0 20px; }
  .section { padding: 64px 0; }
  .header-top { display: none; }
  .header-main { height: 60px; padding: 0 20px; }
  .logo__name { font-size: 28px; }
  .main-nav { position: fixed; inset: 60px 0 auto 0; flex-direction: column; gap: 0; background: rgba(12,10,9,.98); backdrop-filter: blur(20px); border-bottom: 1px solid rgba(255,255,255,.12); padding: 12px 0; transform: translateY(-120%); transition: transform .3s ease; }
  .main-nav.is-open { transform: translateY(0); }
  .nav-link { padding: 16px 24px; font-size: 14px; }
  .nav-link::after { display: none; }
  .nav-item { display: block; }
  .nav-item--dropdown > .nav-link::before { display: none; }
  .nav-dropdown { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none; background: var(--bg-dark); padding: 0; min-width: 0; }
  .nav-dropdown a { padding: 12px 24px; text-align: left; font-size: 13px; color: #fff; display: flex; flex-direction: column; gap: 4px; }
  .nav-dropdown a:hover { background: rgba(255,255,255,.08); color: #fff; }
  .nav-dropdown .nav-dd-jp { font-size: 12px; color: #fff; }
  .nav-dropdown .nav-dd-en { font-size: 10px; letter-spacing: 2px; color: rgba(255,255,255,.7); }
  .header-cta__res { display: none; }
  .nav-toggle { display: flex; flex-direction: column; gap: 4px; width: 40px; height: 40px; background: none; border: none; align-items: center; justify-content: center; }
  .nav-toggle span { width: 22px; height: 2px; background: #fff; transition: .3s; }

  .hero { min-height: 0; height: auto; padding: 90px 20px 70px; }
  .hero__title { font-size: 44px; }
  .recruit-hero { height: auto; padding: 90px 20px 50px; }
  .recruit-hero__title { font-size: 26px; }
  .page-banner { height: 220px; }
  .page-banner__title { font-size: 28px; }
  .breadcrumb { left: 20px; }

  .concept-grid, .split-grid, .access-grid, .trial-grid, .detail-grid { grid-template-columns: 1fr; gap: 40px; }
  .cast-grid, .cast-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .notice-grid, .nom-grid, .qa-grid, .article-grid, .voice-grid, .persona-grid { grid-template-columns: 1fr; }
  .benefit-grid, .welfare-grid, .drinks-grid, .sns-grid, .stat-grid, .guide-steps, .routes-grid, .qa-table { grid-template-columns: 1fr 1fr; }
  .room { grid-template-columns: 1fr; gap: 24px; }
  .room__num { font-size: 56px; top: 16px; right: 20px; }
  .timeline, .steps-flow, .career { flex-direction: column; }
  .timeline__step, .step, .career__node { border-left: 1px solid var(--hair); }
  .step-arrow, .career-arrow { width: auto; height: 24px; transform: rotate(90deg); }
  .model-case__cols { grid-template-columns: 1fr; gap: 20px; }
  .model-case__divider { display: none; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .hero__cta, .center-cta__inner { flex-direction: column; width: 100%; }
  .schedule-box, .contact-box { grid-template-columns: 1fr; }
  .detail-nav { grid-template-columns: 1fr; }
  .sticky-cta { right: 16px; bottom: 16px; }
}
@media (max-width: 520px) {
  .cast-grid, .cast-grid--4, .gallery-grid, .benefit-grid, .welfare-grid, .drinks-grid, .sns-grid, .stat-grid, .guide-steps, .routes-grid, .qa-table, .footer-grid { grid-template-columns: 1fr; }
  .hero__title { font-size: 34px; }
  .news-article { grid-template-columns: 1fr; gap: 6px; }

  /* ② CLUB ROOM セット料金 2段表示（スマホ版） */
  .room .price-row--head { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: flex-start; padding: 12px 20px; }
  .room .price-row--head .price-row__key { display: flex; flex-direction: column; gap: 0; line-height: 1.4; }
  .room .price-row--head .price-row__key small { display: block; font-size: 11px; margin-top: 2px; color: var(--text-muted); }
  .room .price-row--head .price-row__val { font-size: 20px; font-weight: 600; white-space: nowrap; }

  /* ③ VIP ROOM 見出し 1行表示（スマホ版） */
  .room:nth-child(4) .room__jp { font-size: 26px; white-space: nowrap; }

  /* ④ 店舗情報 CARD 表示 2段表示（スマホ版）- <small> タグを別行に */
  .card-fee__sub { display: block; margin-top: 4px; }

  /* ⑤ STAFF RECRUIT 説明文改行（PC・スマホ異なる） */
  /* HTML に <br class="sp-only"> と <br class="pc-only"> を挿入して使用 */
  .sp-only { display: none; }
  .pc-only { display: block; }
}

/* ==========================================================================
   HERO — スマホ対応（960px以下）
   修正: 16:9の横長を全体表示（左右を切らない・固定高さ解除）／
        終了画像はPCと同じ横長 hero.jpg を全体表示／音声ボタンを左下に配置
   ========================================================================== */

@media (max-width: 960px) {

  /* ① heroエリアの固定高さを解除し、16:9の横長バンドにする */
  .hero {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 16 / 9;
    padding: 0 !important;
  }

  /* ② 動画：16:9コンテナに16:9動画をそのまま全体表示（左右を切らない） */
  .hero__video {
    object-fit: cover;
    object-position: center;
  }

  /* ③ 終了画像（poster）：スマホもPCと同じ横長 hero.jpg を使用。
        16:9コンテナ×16:9画像なので全体が切れずに表示される */
  .hero__poster {
    display: none !important;
  }
  .hero__poster.is-on {
    display: block !important;
    object-fit: cover;
    object-position: center;
  }

  /* イントロ（黒画面＋テキスト）は短い帯に合わせて中央配置・縮小 */
  .hero__intro {
    justify-content: center;
    padding: 14px 20px;
    gap: 10px;
    background: #000;
  }
  .hero__intro.is-out { opacity: 0; }
  .hero__brand { font-size: 10px; letter-spacing: 6px; }
  .hero__title { font-size: 26px; line-height: 1.05; }
  .hero__sub { font-size: 11px; letter-spacing: .12em; }
  .hero__intro-phone { font-size: 14px; margin-top: 2px; }

  .hero__scroll { display: none; }

  /* 音声ボタンは左下（右下のREPLAY・右上のバッジと干渉しない位置） */
  .hero__mute { bottom: 12px; left: 12px; padding: 8px 13px; }
}

@media (max-width: 520px) {
  .hero__title { font-size: 22px; }
  .hero__sub { font-size: 10px; }
  .hero__intro { padding: 10px 16px; gap: 8px; }
}

/* ==========================================================================
   Contact Form 7 カスタムスタイル
   ========================================================================== */
.contact-form-wrapper {
  margin: 0 auto;
  max-width: 600px;
}

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

.wpcf7-form .field {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
}

.wpcf7-form .field .field__label {
  font-size: small;
}

.wpcf7-form .field mark {
  background-color: #f00;
  color: #fff;
  display: inline-block;
  font-size: x-small;
  margin-left: 8px;
  padding: 0 4px;
}

.wpcf7-form-control-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.wpcf7-form-control-wrap label {
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: var(--text);
}

.wpcf7-form-control-wrap label .wpcf7-form-control-wrap--required::after {
  content: "（必須）";
  color: var(--pink);
  font-weight: 600;
}

.wpcf7-form-control {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--gray-200);
  background: var(--white);
  font-family: var(--font-jp);
  font-size: 14px;
  color: var(--text);
  transition: border-color 0.2s, box-shadow 0.2s;
  border-radius: 4px;
}

.wpcf7-form-control:focus {
  outline: none;
  border-color: var(--pink);
  box-shadow: 0 0 0 3px rgba(255, 45, 126, 0.1);
}

.wpcf7-form-control::placeholder {
  color: var(--text-muted);
  opacity: 1;
}

input.wpcf7-form-control[type="text"],
input.wpcf7-form-control[type="email"],
input.wpcf7-form-control[type="tel"],
input.wpcf7-form-control[type="number"],
select.wpcf7-form-control {
  height: 44px;
  padding: 10px 16px;
}

textarea.wpcf7-form-control {
  min-height: 120px;
  padding: 12px 16px;
  resize: vertical;
  font-family: var(--font-jp);
}

.wpcf7-form-control.wpcf7-submit {
  height: 52px;
  padding: 0 28px;
  border: none;
  background: var(--pink);
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.12em;
  cursor: pointer;
  transition: opacity 0.2s, transform 0.15s;
  font-size: 14px;
  border-radius: 4px;
  align-self: flex-start;
}

.wpcf7-form-control.wpcf7-submit:hover {
  opacity: 0.92;
}

.wpcf7-form-control.wpcf7-submit:active {
  transform: scale(0.98);
}

.wpcf7-form-control.wpcf7-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.wpcf7-response-output {
  padding: 16px 20px;
  margin: 20px 0;
  border-radius: 4px;
  font-size: 14px;
  line-height: 1.6;
}

.wpcf7-mail-success-message {
  background: #E8FFA8;
  color: #8FCC00;
  border: 1px solid #BDFF00;
}

.wpcf7-mail-failure-message {
  background: #FFD5E5;
  color: #C6175C;
  border: 1px solid #FF2D7E;
}

.wpcf7-form-control.wpcf7-validation-errors {
  border-color: var(--pink);
  background: rgba(255, 45, 126, 0.05);
}

.wpcf7-not-valid-tip {
  display: block;
  color: var(--pink);
  font-size: 12px;
  margin-top: 6px;
  font-weight: 500;
}

/* Checkbox and Radio styling */
.wpcf7-form-control.wpcf7-checkbox,
.wpcf7-form-control.wpcf7-radio {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: auto;
  padding: 0;
}

.wpcf7-form-control.wpcf7-checkbox label,
.wpcf7-form-control.wpcf7-radio label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-weight: 400;
  cursor: pointer;
}

.wpcf7-form-control.wpcf7-checkbox input[type="checkbox"],
.wpcf7-form-control.wpcf7-radio input[type="radio"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: var(--pink);
}

/* PC版では<br>を非表示 */
br {
  display: block;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .contact-form-wrapper {
    padding: 0 20px;
  }

  .wpcf7-form {
    gap: 20px;
  }

  .wpcf7-form-control.wpcf7-submit {
    width: 100%;
    align-self: stretch;
  }
}

/* ==========================================================================
   Sister Lounge 店舗画像スタイル
   ========================================================================== */
.sister {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 0;
  border: none;
  background: transparent;
}

.sister__image {
  width: 100%;
  overflow: hidden;
  border-radius: 4px;
  height: 200px;
  background: var(--gray-50);
}

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

.sister__head {
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.sister__badge {
  padding: 6px 10px;
  background: rgba(24, 163, 221, 0.15);
  border: 1px solid #7ec5ed;
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: 1px;
  color: #7ec5ed;
  border-radius: 3px;
}

.sister__name {
  font-size: 14px;
  color: #fff;
  font-weight: 600;
}

.sister__name span {
  color: #7ec5ed;
}

.sister__desc {
  font-size: 10.5px;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.6;
  margin: 0;
}

/* Hover effect for the link */
.sister:hover .sister__image img {
  opacity: 0.9;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .sister__image {
    height: 150px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

/* スマホ対応の改行・レイアウト修正（528px以下） */
@media (max-width: 520px) {
  /* スマートフォン版では<br>を表示 */
  br {
    display: block;
  }

  /* CONCEPT PC/SP 分離制御 */
  .concept-pc-only { display: none; }
  .concept-sp-only { display: block; }

  /* TOPページ - キャッチコピー改行 */
  .concept-body p {
    word-break: break-word;
  }

  /* TOPページ - ご料金セクションレイアウト */
  .room {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* キャストリクルートページ - メインヘッドライン改行 */
  .recruit-hero__title {
    word-break: break-word;
    line-height: 1.4;
  }

  /* キャストリクルートページ - 給与セクションレイアウト */
  .stat-grid {
    flex-direction: column;
  }

  .stat {
    width: 100%;
  }

  /* キャストリクルートページ - こんな不安改行 */
  .qa-grid .qa {
    word-break: break-word;
  }

  /* キャストリクルートページ - メリット改行 */
  .benefit-grid {
    grid-template-columns: 1fr;
  }

  /* キャストリクルートページ - お仕事内容改行 */
  .job-desc {
    word-break: break-word;
  }

  .job-desc__text {
    line-height: 1.6;
  }

  /* スタッフリクルートページ - 採用メッセージレイアウト */
  .recruit-hero__content p {
    word-break: break-word;
    line-height: 1.6;
  }

  /* スタッフリクルートページ - ボタンレイアウト */
  .recruit-hero__content > div:last-child {
    flex-direction: column;
  }

  .recruit-hero__content > div:last-child a {
    width: 100%;
  }

  /* スタッフリクルートページ - キャリアパスレイアウト */
  .career {
    flex-direction: column;
    gap: 12px;
  }

  .career-arrow {
    display: none;
  }

  /* アクセスページ - レイアウト対応 */
  .access-grid {
    flex-direction: column;
  }

  .info-row {
    flex-direction: column;
  }

  .info-row dt {
    margin-bottom: 4px;
  }

  /* ギャラリーページ - インドアビュー改行 */
  .indoor-view {
    flex-direction: column;
  }

  .indoor-view__btn {
    width: 100%;
  }

  /* キャストリクルートページ - ① ファーストビュー下のキャッチコピー */
  .recruit-hero__title {
    font-size: 28px;
    line-height: 1.4;
  }

  /* キャストリクルートページ - ② 給与セクション */
  .guarantee-pill {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 8px;
  }

  /* キャストリクルートページ - 見出しスマホ版font-size調整 */
  .section-title--center {
    font-size: 24px;
    line-height: 1.5;
    text-align: center;
  }

  /* キャストリクルートページ - 「合わない」と思ったら */
  .trial-card__title {
    font-size: 20px;
    line-height: 1.5;
    text-align: center;
  }

  /* キャストリクルートページ - まずは話を聞いてみてください */
  .lure__title {
    font-size: 24px;
    line-height: 1.5;
  }

  /* キャストリクルートページ - ⑨ スタッフ募集CTA */
  .cross-link {
    flex-direction: column;
    gap: 16px;
    align-items: center;
    text-align: center;
  }

  .cross-link > div {
    width: 100%;
  }

  .cross-link .btn {
    width: 100%;
    max-width: 280px;
  }

  /* CAST archive-cast.php - lure__title 2行表示 */
  .lure__title {
    font-size: 20px;
    line-height: 1.5;
  }

  /* CAST archive-cast.php - lure__text 正確な改行 */
  .lure__text {
    font-size: 13px;
    line-height: 1.6;
  }

  /* CAST archive-cast.php - lure__salary 3行表示 */
  .lure__salary {
    display: block;
    font-size: 12px;
    line-height: 1.8;
  }

  /* SYSTEM template-system.php - VIP ROOM飲み放題セクション */
  .drinks-block__vip-label {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .drinks-block__vip-label .drinks-block__jp {
    font-size: 16px;
  }

  .drinks-block__vip-label .drinks-block__note {
    font-size: 12px;
    text-align: left;
  }

  /* GALLERY template-gallery.php - indoor-view 縦レイアウト */
  .indoor-view {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
  }

  .indoor-view__title {
    font-size: 14px;
    line-height: 1.4;
    white-space: nowrap;
  }

  .indoor-view__sub {
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
  }

  .indoor-view__btn {
    width: 85% !important;
    min-width: 200px;
  }

  /* STAFF RECRUIT - 職種・給与セクション */
  .nom {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .nom > div:first-child {
    display: flex;
    flex-direction: column;
    gap: 8px;
    order: 1;
  }

  .nom__label {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .nom__jp {
    font-size: 13px;
    line-height: 1.3;
    white-space: nowrap;
  }

  .nom__note {
    font-size: 12px;
    line-height: 1.3;
    white-space: nowrap;
  }

  .nom__price {
    order: 2;
    margin-top: 12px;
    font-size: 14px;
    white-space: nowrap;
  }

  /* STAFF RECRUIT - キャリアパス説明文 */
  .staff-career-text {
    font-size: 12px !important;
    line-height: 1.8;
    word-break: break-word;
  }

  /* STAFF RECRUIT - キャスト募集セクション */
  .staff-cross-link {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 16px !important;
    text-align: center;
  }

  .staff-cross-link__heading {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
  }

  .staff-cross-link__sub {
    display: block;
    font-size: 12px;
    color: var(--text-muted);
    line-height: 1.5;
    white-space: nowrap;
  }

  .staff-cross-link .btn {
    width: 90%;
    max-width: 240px;
    white-space: nowrap;
  }

  /* CAST RECRUIT - Hero下タイトル */
  .cast-hero-title {
    font-size: 24px !important;
    line-height: 1.5;
  }

  /* CAST RECRUIT - 体験入店セクション4項目 */
  .trial-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

  .trial-item b {
    font-size: 14px;
  }

  .trial-sub {
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
  }

  /* CAST ページ - 時給表示3行 */
  .lure__salary {
    display: block;
    font-size: 13px;
    line-height: 1.6;
  }

  /* STAFF RECRUIT - 職種給与の給与額をスマホ版で2倍に */
  .nom__price {
    font-size: 20px !important;
    font-weight: 600;
    white-space: nowrap;
  }

  /* STAFF RECRUIT - 福利厚生セクション */
  .welfare-insurance {
    text-align: center;
    font-size: 13px;
    line-height: 1.5;
  }

  .welfare-traffic {
    text-align: center;
    font-size: 13px;
    line-height: 1.5;
  }

  /* CAST RECRUIT - 体験入店カード幅調整 */
  .trial-point {
    padding: 14px 12px;
  }

  .trial-points {
    gap: 10px;
  }

  .trial-sub {
    font-size: 11px;
  }

  /* ACCESS - CARD セクション SP版制御 */
  .card-line2 {
    display: block;
  }
}

/* ---- STAFF RECRUIT ページ専用：PC/SP 改行分離 ----
   PC版：2行表示 / SP版：3行表示 */
.recruit-staff-break--sp { display: none; }

@media (max-width: 520px) {
  .recruit-staff-break--sp { display: inline; }
}