/* ============================================================
   八ヶ岳北杜グランデFC — zelvia-ver 共通スタイル
   Jクラブ公式サイト型レイアウト / ライトベース + クラブグリーン
   モバイルファースト (min-width メディアクエリ)
   ============================================================ */
:root {
  --main-color: #1a5c2d;
  --main-dark: #10401e;
  --main-light: #eaf3ed;
  --accent-color: #1a5c2d;
  --ink: #15171a;
  --ink-sub: #6b7078;
  --line: #e5e6e8;
  --bg: #ffffff;
  --bg-gray: #f5f6f7;
  --footer-bg: #101214;
  --gold: #b8870b;
  --red: #c0392b;
  --blue: #2a6fd6;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
  background: var(--bg); color: var(--ink);
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
.en { font-family: 'Oswald', sans-serif; }

/* ── 共通コンテナ ── */
.container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 768px) { .container { padding: 0 24px; } }

/* ── セクション見出し (EN大見出し + JAサブ) ── */
.sec-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 26px; flex-wrap: wrap; }
.sec-head .sec-en {
  font-family: 'Oswald', sans-serif; font-weight: 700; font-style: italic;
  font-size: clamp(30px, 5vw, 46px); letter-spacing: 1px; line-height: 1;
  color: var(--ink);
}
.sec-head .sec-ja { color: var(--main-color); font-size: 13px; font-weight: 700; letter-spacing: 2px; }
.sec-head--light .sec-en { color: #fff; }
.sec-head--light .sec-ja { color: #9fd3ae; }
.sec-more {
  margin-left: auto; font-size: 13px; font-weight: 700; letter-spacing: 1px;
  color: var(--main-color); display: inline-flex; align-items: center; gap: 6px;
}
.sec-more:hover { text-decoration: underline; }

/* ============================================================
   ヘッダー
   ============================================================ */
.gh { position: sticky; top: 0; z-index: 100; background: #fff; border-bottom: 1px solid var(--line); }
.gh-inner { display: flex; align-items: stretch; height: 60px; padding: 0 12px 0 16px; max-width: 1360px; margin: 0 auto; }
.gh-logo { display: flex; align-items: center; gap: 10px; flex: none; }
.gh-logo img { height: 42px; width: auto; }
.gh-logo-fallback {
  width: 40px; height: 40px; background: var(--main-color); border-radius: 50%;
  display: none; align-items: center; justify-content: center;
  color: #fff; font-family: 'Oswald', sans-serif; font-size: 18px;
}
.gh-logo-text { display: flex; flex-direction: column; line-height: 1.1; }
.gh-logo-name { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 15px; letter-spacing: 0.5px; }
.gh-logo-sub { font-size: 9px; color: var(--ink-sub); letter-spacing: 1.5px; }
.gh-nav { display: none; }
.gh-actions { margin-left: auto; display: flex; align-items: stretch; }
.gh-cta {
  display: none; align-items: center; justify-content: center; text-align: center;
  font-size: 12px; font-weight: 700; letter-spacing: 1px; padding: 0 18px;
}
.gh-cta--trial { background: var(--main-color); color: #fff; }
.gh-cta--trial:hover { background: var(--main-dark); }
.gh-cta--shop { background: var(--ink); color: #fff; }
.gh-cta--shop:hover { background: #000; }
.gh-cta small { display: block; font-size: 9px; font-weight: 400; opacity: 0.75; letter-spacing: 2px; }
.gh-login { display: none; align-items: center; font-size: 12px; color: var(--ink-sub); padding: 0 14px; border-left: 1px solid var(--line); }
.gh-login:hover { color: var(--ink); }
.gh-burger {
  width: 56px; border: none; background: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
}
.gh-burger span { width: 22px; height: 2px; background: var(--ink); border-radius: 1px; }
@media (min-width: 1024px) {
  .gh-inner { height: 72px; }
  .gh-nav { display: flex; align-items: stretch; margin-left: 20px; }
  .gh-nav > a {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 0 10px; gap: 3px; border-bottom: 3px solid transparent; transition: border-color .2s;
    white-space: nowrap;
  }
  .gh-nav > a:hover { border-bottom-color: var(--main-color); }
  .gh-nav .n-en { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 14px; letter-spacing: 1px; }
  .gh-nav .n-ja { font-size: 10px; color: var(--ink-sub); letter-spacing: 1px; }
  .gh-cta, .gh-login { display: flex; }
  .gh-burger { display: none; }
}

/* ── 「お父さん・お母さんいつもありがとう」ナビ(手書き風) ── */
.gh-nav > a.nav-thanks .n-en {
  font-family: 'Yomogi', 'Noto Sans JP', sans-serif; font-weight: 700;
  font-size: 13px; letter-spacing: 0; color: var(--main-color); white-space: nowrap;
}
.gh-nav > a.nav-thanks .n-ja {
  font-family: 'Yomogi', 'Noto Sans JP', sans-serif; font-weight: 700;
  font-size: 11px; letter-spacing: 0; color: var(--main-color); white-space: nowrap;
}
.gh-nav > a.nav-thanks:hover { border-bottom-color: var(--gold); }
.m-nav a.nav-thanks .n-en,
.m-nav a.nav-thanks .n-ja {
  font-family: 'Yomogi', 'Noto Sans JP', sans-serif; letter-spacing: 0; color: #9fd3ae;
}
.m-nav a.nav-thanks .n-en { font-size: 17px; }

/* モバイルメニュー */
.m-nav {
  display: none; position: fixed; inset: 0; z-index: 200;
  background: rgba(16,18,20,0.97); color: #fff;
  flex-direction: column; padding: 24px; overflow-y: auto;
}
.m-nav.open { display: flex; }
.m-nav-close { align-self: flex-end; background: none; border: none; color: #fff; font-size: 30px; cursor: pointer; padding: 4px 8px; }
.m-nav a.m-link { padding: 16px 4px; border-bottom: 1px solid rgba(255,255,255,0.12); display: flex; align-items: baseline; gap: 12px; }
.m-nav .n-en { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 20px; letter-spacing: 1px; }
.m-nav .n-ja { font-size: 12px; color: #9aa0a8; }
.m-nav-ctas { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 22px; }
.m-nav-ctas a { text-align: center; padding: 15px 8px; font-size: 13px; font-weight: 700; letter-spacing: 1px; border-radius: 3px; }
.m-cta-trial { background: var(--main-color); color: #fff; }
.m-cta-shop { background: #fff; color: var(--ink); }

/* ============================================================
   フローティングボタン (右端固定 / モバイルは下部バー)
   ============================================================ */
.float-btns { position: fixed; z-index: 90; right: 0; bottom: 0; left: 0; display: flex; }
.float-btns a {
  flex: 1; text-align: center; padding: 13px 8px; font-size: 12px; font-weight: 700; letter-spacing: 1px; color: #fff;
}
.fb-trial { background: var(--main-color); }
.fb-shop { background: var(--ink); }
@media (min-width: 1024px) {
  .float-btns { left: auto; right: 20px; bottom: 20px; flex-direction: column; gap: 8px; }
  .float-btns a {
    flex: none; padding: 14px 26px; font-size: 13px;
    border-radius: 999px; box-shadow: 0 6px 18px rgba(0,0,0,0.25);
  }
}

/* ============================================================
   トップ: ヒーロー
   ============================================================ */
.hero { position: relative; height: 72vh; min-height: 420px; overflow: hidden; background: #222; }
.hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.02); }
.hero::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(to top, rgba(6,16,9,0.90) 0%, rgba(6,16,9,0.55) 22%, rgba(6,16,9,0.12) 46%, rgba(0,0,0,0.10) 100%),
    linear-gradient(to right, rgba(6,16,9,0.55), rgba(6,16,9,0) 55%);
}
.hero-inner { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end; padding: 0 20px 46px; max-width: 1200px; margin: 0 auto; width: 100%; left: 0; right: 0; }
.hero-loc { color: #cfe7d6; font-family: 'Oswald', sans-serif; font-size: 12px; letter-spacing: 5px; margin-bottom: 10px; }
.hero-slogan {
  color: #fff; font-family: 'Oswald', sans-serif; font-weight: 700; font-style: italic;
  font-size: clamp(40px, 8vw, 84px); line-height: 0.98; letter-spacing: 1px;
  text-shadow: 0 3px 18px rgba(0,0,0,0.5);
}
.hero-slogan .g { color: #7fce97; }
.hero-slogan-ja { color: #eef3ef; font-size: clamp(15px, 2.4vw, 21px); font-weight: 700; letter-spacing: 3px; margin-top: 14px; text-shadow: 0 2px 10px rgba(0,0,0,0.6); }
.hero-scroll { position: absolute; right: 22px; bottom: 18px; color: rgba(255,255,255,0.7); font-family: 'Oswald', sans-serif; font-size: 10px; letter-spacing: 3px; writing-mode: vertical-rl; }
@media (min-width: 768px) { .hero { height: 82vh; } .hero-inner { padding: 0 24px 64px; } }

/* ============================================================
   トップ: プロモバナー スライダー
   ============================================================ */
.promo { background: var(--bg-gray); padding: 26px 0 30px; }
.promo-track {
  display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory;
  padding: 0 16px 6px; scrollbar-width: none;
}
.promo-track::-webkit-scrollbar { display: none; }
.promo-card {
  position: relative; flex: 0 0 82%; max-width: 460px; aspect-ratio: 16/7;
  border-radius: 8px; overflow: hidden; scroll-snap-align: center;
  background-size: cover; background-position: center; box-shadow: 0 4px 14px rgba(0,0,0,0.12);
}
.promo-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(105deg, rgba(10,26,14,0.82) 34%, rgba(10,26,14,0.12) 70%); }
.promo-card--solid::after { background: linear-gradient(105deg, rgba(16,40,22,0.94), rgba(26,92,45,0.85)); }
.promo-card--news::after { background: linear-gradient(to top, rgba(8,14,10,0.88) 30%, rgba(8,14,10,0.18) 75%); }
.promo-title--news {
  font-size: 15px; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.promo-card--news .promo-body { justify-content: flex-end; padding-bottom: 16px; }
.promo-body { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: 0 22px; }
.promo-tag { color: #9fd3ae; font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: 3px; margin-bottom: 6px; }
.promo-title { color: #fff; font-size: 18px; font-weight: 900; letter-spacing: 1px; line-height: 1.4; }
.promo-sub { color: rgba(255,255,255,0.82); font-size: 12px; margin-top: 6px; }
.promo-nav { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.promo-dot { width: 8px; height: 8px; border-radius: 50%; background: #cfd2d6; border: none; padding: 0; cursor: pointer; }
.promo-dot.on { background: var(--main-color); }
@media (min-width: 768px) { .promo-card { flex-basis: 420px; } .promo-track { padding: 0 24px 6px; } }

/* ============================================================
   トップ: NEXT MATCH パネル + タブ + 結果
   ============================================================ */
.match-sec { padding: 58px 0 30px; }
.tab-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.tab-btn {
  font-family: 'Oswald', sans-serif; font-size: 14px; letter-spacing: 2px;
  padding: 9px 20px; border-radius: 999px; cursor: pointer;
  border: 1px solid #d4d6d9; background: #fff; color: var(--ink);
  transition: all .15s;
}
.tab-btn.tab-active { background: var(--main-color); color: #fff; border-color: var(--main-color); }

.match-next-panel {
  margin-top: 20px; background: #fff; border: 1px solid var(--line);
  border-top: 4px solid var(--main-color); border-radius: 6px; overflow: hidden;
  box-shadow: 0 6px 20px rgba(20,40,26,0.08);
}
#match-next-inner { display: block; }
.nm-left { padding: 22px 22px 6px; }
.nm-badge-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.nm-badge { display: inline-block; background: var(--main-color); color: #fff; font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: 3px; padding: 5px 12px; border-radius: 2px; }
.nm-cat { display: inline-block; border: 1px solid var(--main-color); color: var(--main-color); font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: 2px; padding: 4px 10px; border-radius: 999px; }
.nm-comp { margin-top: 12px; color: var(--ink-sub); font-size: 13px; font-weight: 500; }
.nm-date-row { margin-top: 6px; display: flex; align-items: baseline; gap: 10px; }
.nm-date-num { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 34px; line-height: 1; letter-spacing: 1px; }
.nm-day { color: var(--main-color); font-family: 'Oswald', sans-serif; font-size: 16px; }
.nm-detail { margin-top: 10px; color: var(--ink-sub); font-size: 13px; line-height: 1.8; }
.nm-center { padding: 20px 22px; display: flex; align-items: center; justify-content: center; gap: 26px; }
.nm-team { text-align: center; }
.nm-logo-home {
  width: 70px; height: 70px; margin: 0 auto; border-radius: 50%;
  background: var(--main-light); border: 2px solid var(--main-color);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.nm-abbr { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 26px; color: var(--main-color); }
.nm-logo-img { width: 82%; height: 82%; object-fit: contain; }
.nm-logo-away {
  width: 70px; height: 70px; margin: 0 auto; border-radius: 50%;
  background: var(--bg-gray); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif; font-size: 10px; color: #9aa0a8;
}
.nm-team-name { margin-top: 10px; font-weight: 900; font-size: 14px; letter-spacing: 0.5px; }
.nm-team-label { color: #9aa0a8; font-size: 10px; letter-spacing: 2px; margin-top: 2px; }
.nm-vs { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: 30px; color: #d4d6d9; }
.nm-actions { padding: 0 22px 22px; display: flex; gap: 10px; }
.nm-btn { flex: 1; text-align: center; font-size: 13px; font-weight: 700; letter-spacing: 1px; padding: 13px; border-radius: 4px; }
.nm-btn-light { background: var(--main-color); color: #fff; }
.nm-btn-dark { border: 1px solid #c9ccd0; color: var(--ink); background: #fff; }
@media (min-width: 900px) {
  #match-next-inner { display: grid; grid-template-columns: 300px 1fr; }
  .nm-left { padding: 30px; border-right: 1px solid var(--line); }
  .nm-center { padding: 30px; gap: 34px; }
  .nm-actions { padding: 0 30px 24px; justify-content: flex-end; }
  .nm-actions .nm-btn { flex: none; min-width: 200px; }
}

/* 直近の結果リスト */
.results-sec { padding: 30px 0 60px; }
.results-panel { background: #fff; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.results-panel-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px; border-bottom: 1px solid var(--line); background: var(--bg-gray); }
.results-panel-title { font-weight: 900; font-size: 14px; letter-spacing: 1px; }
.results-panel-cat { color: var(--ink-sub); font-weight: 500; font-size: 12px; }
.result-row {
  display: grid; grid-template-columns: 52px 1fr 92px 1fr 36px;
  align-items: center; gap: 8px; padding: 14px 14px; border-bottom: 1px solid #f0f1f2;
}
.result-row:last-child { border-bottom: none; }
.result-date { font-family: 'Oswald', sans-serif; font-size: 13px; color: var(--ink-sub); }
.result-home { text-align: right; font-weight: 700; font-size: 12px; }
.result-score { display: flex; align-items: center; gap: 8px; justify-content: center; }
.score-num { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 24px; line-height: 1; min-width: 20px; text-align: center; }
.score-sep { color: #c9ccd0; font-size: 13px; }
.result-opp { font-weight: 700; font-size: 12px; color: #3c4046; }
.result-badge {
  justify-self: end; border-radius: 999px; padding: 5px 12px;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: 1px; color: #fff;
}
.badge-win { background: var(--main-color); }
.badge-draw { background: var(--gold); }
.badge-lose { background: #8b9097; }
.results-panel-foot { padding: 10px 18px; color: #9aa0a8; font-size: 11px; }
.no-data { color: #9aa0a8; font-size: 13px; padding: 20px 18px; }
@media (min-width: 768px) {
  .result-row { grid-template-columns: 90px 1fr 140px 1fr 44px; padding: 16px 24px; gap: 16px; }
  .result-home, .result-opp { font-size: 15px; }
  .score-num { font-size: 30px; }
}

/* ============================================================
   トップ: クイックリンク
   ============================================================ */
.quick { padding: 0 0 58px; }
.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.quick-card {
  position: relative; border-radius: 6px; overflow: hidden; aspect-ratio: 16/9;
  background-size: cover; background-position: center; display: flex; align-items: flex-end;
}
.quick-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(8,20,12,0.85), rgba(8,20,12,0.1) 60%); }
.quick-body { position: relative; z-index: 2; padding: 14px 16px; }
.quick-en { color: #9fd3ae; font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: 3px; }
.quick-ja { color: #fff; font-size: 15px; font-weight: 900; letter-spacing: 1px; margin-top: 2px; }
.quick-card:hover::after { background: linear-gradient(to top, rgba(26,92,45,0.85), rgba(26,92,45,0.2)); }
@media (min-width: 900px) { .quick-grid { grid-template-columns: repeat(4, 1fr); } }

/* ============================================================
   トップ: クラブステートメント
   ============================================================ */
.statement { position: relative; background: var(--main-dark); color: #fff; overflow: hidden; }
.statement-bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0.28; }
.statement-inner { position: relative; z-index: 2; max-width: 900px; margin: 0 auto; padding: 76px 20px; text-align: center; }
.statement-en { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: clamp(34px, 6vw, 62px); letter-spacing: 2px; line-height: 1.05; }
.statement-ja { font-size: clamp(17px, 2.6vw, 24px); font-weight: 900; letter-spacing: 4px; margin-top: 16px; }
.statement-desc { color: rgba(255,255,255,0.78); font-size: 14px; line-height: 2.1; margin-top: 22px; }
.statement-btn {
  display: inline-block; margin-top: 30px; border: 1px solid rgba(255,255,255,0.55);
  color: #fff; font-size: 13px; font-weight: 700; letter-spacing: 2px; padding: 14px 42px; border-radius: 999px;
  transition: background .2s;
}
.statement-btn:hover { background: rgba(255,255,255,0.14); }

/* ============================================================
   トップ: ムービー
   ============================================================ */
.movie { background: #14161a; padding: 58px 0 64px; }
.movie-grid { display: grid; gap: 14px; }
.movie-card { position: relative; border-radius: 6px; overflow: hidden; aspect-ratio: 16/9; background-size: cover; background-position: center; display: block; }
.movie-card::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,0.35); transition: background .2s; }
.movie-card:hover::after { background: rgba(0,0,0,0.15); }
.movie-play {
  position: absolute; z-index: 2; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 56px; height: 56px; border-radius: 50%; background: rgba(26,92,45,0.92);
  display: flex; align-items: center; justify-content: center;
}
.movie-play::before { content: ''; border-style: solid; border-width: 9px 0 9px 15px; border-color: transparent transparent transparent #fff; margin-left: 4px; }
.movie-label { position: absolute; z-index: 2; left: 14px; bottom: 12px; color: #fff; font-size: 13px; font-weight: 700; text-shadow: 0 2px 8px rgba(0,0,0,0.7); }
@media (min-width: 768px) { .movie-grid { grid-template-columns: repeat(3, 1fr); } }

/* ============================================================
   トップ: ニュース
   ============================================================ */
.news-sec { padding: 58px 0 64px; }
.pickup-news { display: grid; gap: 14px; margin-bottom: 28px; }
.pn-card { background: #fff; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .2s; }
.pn-card:hover { box-shadow: 0 8px 22px rgba(0,0,0,0.1); }
.pn-thumb { aspect-ratio: 16/9; background-size: cover; background-position: center; position: relative; }
.pn-thumb .pn-flag { position: absolute; left: 0; top: 0; background: var(--main-color); color: #fff; font-family: 'Oswald', sans-serif; font-size: 10px; letter-spacing: 2px; padding: 5px 10px; }
.pn-body { padding: 14px 16px 16px; }
.pn-meta { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.pn-date { font-family: 'Oswald', sans-serif; font-size: 12px; color: var(--ink-sub); }
.pn-title { font-size: 14px; font-weight: 700; line-height: 1.6; }
@media (min-width: 768px) { .pickup-news { grid-template-columns: repeat(3, 1fr); } }

.news-tag {
  font-size: 10px; font-weight: 700; letter-spacing: 1px;
  border: 1px solid; padding: 3px 9px; white-space: nowrap; border-radius: 2px;
}
.news-list { border-top: 1px solid var(--line); }
.news-row {
  display: grid; grid-template-columns: auto auto 1fr auto; align-items: center; gap: 12px;
  padding: 16px 4px; border-bottom: 1px solid var(--line);
}
.news-row:hover { background: var(--bg-gray); }
.news-date { font-family: 'Oswald', sans-serif; font-size: 13px; color: var(--ink-sub); }
.news-title { font-size: 14px; font-weight: 500; line-height: 1.6; grid-column: 1 / -1; }
.news-arrow { color: #c4c6c9; font-size: 16px; display: none; }
@media (min-width: 768px) {
  .news-row { grid-template-columns: 110px 130px 1fr auto; padding: 18px 8px; }
  .news-title { grid-column: auto; font-size: 15px; }
  .news-arrow { display: block; }
}

/* ============================================================
   トップ: パートナー / SNS
   ============================================================ */
.partner-sec { background: var(--bg-gray); padding: 58px 0 64px; }
.partner-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.partner-item {
  background: #fff; border: 1px solid var(--line); border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  padding: 18px 14px; min-height: 92px; transition: box-shadow .2s;
}
.partner-item:hover { box-shadow: 0 6px 16px rgba(0,0,0,0.08); }
.partner-item img { max-height: 52px; width: auto; object-fit: contain; }
.partner-item .p-text { font-weight: 900; font-size: 15px; letter-spacing: 1px; color: #3c4046; }
.partner-cta { text-align: center; margin-top: 26px; }
.partner-cta a {
  display: inline-block; border: 1px solid var(--main-color); color: var(--main-color);
  font-size: 13px; font-weight: 700; letter-spacing: 1px; padding: 13px 38px; border-radius: 999px;
}
.partner-cta a:hover { background: var(--main-color); color: #fff; }
@media (min-width: 900px) { .partner-grid { grid-template-columns: repeat(4, 1fr); } }

.sns-sec { padding: 58px 0 70px; }
.sns-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.sns-item {
  border: 1px solid var(--line); border-radius: 6px; padding: 20px 10px 16px;
  display: flex; flex-direction: column; align-items: center; gap: 10px; transition: box-shadow .2s;
}
.sns-item:hover { box-shadow: 0 6px 16px rgba(0,0,0,0.1); }
.sns-item svg { width: 30px; height: 30px; }
.sns-name { font-family: 'Oswald', sans-serif; font-size: 12px; letter-spacing: 1px; color: var(--ink-sub); }
@media (min-width: 768px) { .sns-grid { max-width: 640px; margin: 0 auto; } }

/* ============================================================
   下層ページ共通: ページヒーロー / パンくず
   ============================================================ */
.page-hero { background: var(--main-dark); color: #fff; position: relative; overflow: hidden; }
.page-hero::before {
  content: ''; position: absolute; right: -60px; top: -40px; width: 340px; height: 340px;
  background: rgba(255,255,255,0.05); transform: rotate(24deg);
}
.page-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; padding: 46px 16px 40px; }
.page-hero .ph-en { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: clamp(34px, 6vw, 56px); line-height: 1; letter-spacing: 1px; }
.page-hero .ph-ja { color: #9fd3ae; font-size: 13px; font-weight: 700; letter-spacing: 3px; margin-top: 10px; }
.breadcrumb { background: var(--bg-gray); border-bottom: 1px solid var(--line); }
.breadcrumb-inner { max-width: 1200px; margin: 0 auto; padding: 10px 16px; font-size: 11px; color: var(--ink-sub); display: flex; gap: 8px; flex-wrap: wrap; }
.breadcrumb a:hover { text-decoration: underline; }
.page-body { padding: 44px 0 80px; }

/* カテゴリフィルタ (ニュース/選手) */
.filter-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.filter-btn {
  font-size: 12px; font-weight: 700; letter-spacing: 1px; padding: 9px 18px;
  border-radius: 999px; border: 1px solid #d4d6d9; background: #fff; color: var(--ink); cursor: pointer;
  transition: all .15s;
}
.filter-btn.on { background: var(--main-color); border-color: var(--main-color); color: #fff; }
.sort-bar { display: flex; align-items: center; gap: 12px; margin: -12px 0 28px; }
.sort-bar .sort-label { font-size: 12px; font-weight: 700; color: var(--ink-sub); letter-spacing: 1px; flex: none; }
.more-wrap { text-align: center; margin-top: 30px; }
.more-btn {
  display: inline-block; border: 1px solid #c9ccd0; background: #fff; cursor: pointer;
  font-size: 13px; font-weight: 700; letter-spacing: 2px; padding: 14px 56px; border-radius: 999px;
  transition: all .15s;
}
.more-btn:hover { border-color: var(--main-color); color: var(--main-color); }

/* ============================================================
   試合ページ
   ============================================================ */
.upcoming-grid { display: grid; gap: 14px; margin-bottom: 40px; }
.up-card { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--main-color); border-radius: 6px; padding: 18px; }
.up-comp { color: var(--ink-sub); font-size: 11px; font-weight: 700; letter-spacing: 1px; }
.up-date { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 26px; margin-top: 6px; }
.up-date small { font-size: 14px; color: var(--main-color); margin-left: 6px; }
.up-vs { margin-top: 10px; font-size: 15px; font-weight: 900; }
.up-meta { color: var(--ink-sub); font-size: 12px; margin-top: 8px; line-height: 1.7; }
.up-badge { display: inline-block; margin-top: 4px; background: var(--main-light); color: var(--main-color); font-size: 10px; font-weight: 700; letter-spacing: 1px; padding: 3px 10px; border-radius: 2px; }
@media (min-width: 900px) { .upcoming-grid { grid-template-columns: repeat(3, 1fr); } }

.sched-group { margin-bottom: 36px; }
.sched-comp-title { font-size: 15px; font-weight: 900; letter-spacing: 1px; padding-left: 12px; border-left: 4px solid var(--main-color); margin-bottom: 14px; }
.sched-list { background: #fff; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.sched-row {
  display: grid; grid-template-columns: 74px 1fr 90px; align-items: center; gap: 10px;
  padding: 14px 14px; border-bottom: 1px solid #f0f1f2;
}
.sched-row:last-child { border-bottom: none; }
.sched-date { font-family: 'Oswald', sans-serif; font-size: 14px; }
.sched-date small { display: block; font-size: 10px; color: var(--ink-sub); letter-spacing: 1px; }
.sched-main { min-width: 0; }
.sched-opp { font-weight: 700; font-size: 14px; }
.sched-venue { color: var(--ink-sub); font-size: 11px; margin-top: 3px; }
.sched-right { text-align: right; }
.sched-score { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 20px; }
.sched-res { display: inline-flex; width: 24px; height: 24px; border-radius: 50%; color: #fff; font-family: 'Oswald', sans-serif; font-size: 11px; align-items: center; justify-content: center; margin-left: 6px; vertical-align: 2px; }
.sched-time { color: var(--ink-sub); font-size: 12px; }
@media (min-width: 768px) { .sched-row { grid-template-columns: 100px 1fr 140px; padding: 16px 22px; } }

/* ============================================================
   選手ページ
   ============================================================ */
.pos-group { margin-bottom: 40px; }
.pos-title { display: flex; align-items: baseline; gap: 10px; margin-bottom: 16px; }
.pos-title .p-en { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: 28px; letter-spacing: 1px; }
.pos-title .p-ja { color: var(--ink-sub); font-size: 12px; font-weight: 700; letter-spacing: 2px; }
.players-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.player-card {
  background: #fff; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; cursor: pointer;
  position: relative; transform-style: preserve-3d;
  transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease;
}
.player-card:hover {
  box-shadow: 0 20px 36px rgba(26,92,45,0.26), 0 0 0 1px var(--main-color);
  border-color: var(--main-color);
  z-index: 2;
}
/* カーソル追従のスポットライト */
.player-card::before {
  content: ''; position: absolute; inset: 0; z-index: 5; pointer-events: none; opacity: 0;
  transition: opacity .35s ease;
  background: radial-gradient(circle at var(--glow-x, 50%) var(--glow-y, 50%), rgba(255,255,255,0.4), transparent 55%);
  mix-blend-mode: overlay;
}
.player-card:hover::before { opacity: 1; }

.player-photo { position: relative; aspect-ratio: 3/3.4; overflow: hidden; background: linear-gradient(160deg, #e9ece9, #d6dcd7); }
.player-photo-img {
  position: absolute; inset: 0; background-size: cover; background-position: center top;
  filter: grayscale(28%) saturate(1.05); transform: scale(1.001);
  transition: transform .7s cubic-bezier(.2,.8,.2,1), filter .5s ease;
}
.player-card:hover .player-photo-img { transform: scale(1.11); filter: grayscale(0%) saturate(1.2); }
/* 光が斜めに走るシャインアニメーション */
.player-photo::after {
  content: ''; position: absolute; top: 0; left: -60%; width: 35%; height: 100%; z-index: 3;
  background: linear-gradient(115deg, transparent, rgba(255,255,255,0.55) 50%, transparent);
  transform: skewX(-20deg); transition: left .8s ease; pointer-events: none;
}
.player-card:hover .player-photo::after { left: 130%; }

.player-number {
  position: absolute; top: 0; left: 0; background: var(--main-color); color: #fff; z-index: 4;
  font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 20px; line-height: 1; padding: 7px 11px;
  transition: transform .4s cubic-bezier(.3,1.6,.4,1);
}
.player-card:hover .player-number { transform: scale(1.12) rotate(-3deg); }
.player-pos-badge {
  position: absolute; right: 8px; bottom: 8px; font-size: 10px; font-weight: 700; letter-spacing: 1px; color: #fff;
  padding: 3px 8px; border-radius: 2px; z-index: 4;
  transition: transform .35s ease, box-shadow .35s ease;
}
.player-card:hover .player-pos-badge { transform: scale(1.12); box-shadow: 0 0 0 3px rgba(255,255,255,0.55); }
.player-info { padding: 12px 12px 14px; }
.player-name { font-size: 15px; font-weight: 900; letter-spacing: 0.5px; position: relative; display: inline-block; }
.player-name::after {
  content: ''; position: absolute; left: 0; bottom: -4px; width: 0; height: 2px; background: var(--main-color);
  transition: width .4s ease;
}
.player-card:hover .player-name::after { width: 100%; }
.player-name-en { color: var(--ink-sub); font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: 1px; margin-top: 3px; }
@media (min-width: 768px) { .players-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
@media (prefers-reduced-motion: reduce) {
  .player-card, .player-photo-img, .player-photo::after, .player-number, .player-pos-badge, .player-name::after, .player-card::before {
    transition: none !important; animation: none !important;
  }
}

/* 選手モーダル */
.player-modal { display: none; position: fixed; inset: 0; z-index: 300; background: rgba(12,14,16,0.8); align-items: center; justify-content: center; padding: 20px; }
.player-modal.show { display: flex; }
.pm-box { background: #fff; border-radius: 8px; max-width: 380px; width: 100%; overflow: hidden; }
.pm-photo { aspect-ratio: 3/2.6; background: linear-gradient(160deg, #e9ece9, #d6dcd7); background-size: cover; background-position: center top; }
.pm-body { padding: 18px 20px 22px; }
.pm-name { font-size: 20px; font-weight: 900; }
.pm-name-en { color: var(--ink-sub); font-family: 'Oswald', sans-serif; font-size: 12px; letter-spacing: 1px; margin-top: 2px; }
.pm-meta { display: flex; gap: 18px; margin-top: 14px; }
.pm-meta div { text-align: center; }
.pm-meta .lb { font-size: 10px; color: var(--ink-sub); letter-spacing: 1px; }
.pm-meta .vl { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 20px; margin-top: 2px; }
.pm-close { margin-top: 18px; width: 100%; padding: 12px; border: 1px solid #c9ccd0; background: #fff; border-radius: 4px; font-weight: 700; cursor: pointer; }

/* ============================================================
   クラブページ
   ============================================================ */
.club-lead { font-size: 15px; line-height: 2.2; color: #2c3036; max-width: 780px; }
.club-sec { margin-bottom: 56px; }
.club-sec-title { display: flex; align-items: baseline; gap: 12px; margin-bottom: 20px; }
.club-sec-title .c-en { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: 26px; color: var(--main-color); letter-spacing: 1px; }
.club-sec-title .c-ja { font-size: 15px; font-weight: 900; letter-spacing: 1px; }
.pillars { display: grid; gap: 14px; }
.pillar {
  background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--main-color);
  border-radius: 6px; padding: 24px 22px;
}
.pillar-no { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 34px; color: #dfe4e0; line-height: 1; }
.pillar-title { font-size: 17px; font-weight: 900; margin: 10px 0 8px; letter-spacing: 0.5px; }
.pillar-body { color: #4c5157; font-size: 13px; line-height: 1.95; }
@media (min-width: 768px) { .pillars { grid-template-columns: repeat(3, 1fr); } }
.club-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); }
.club-table th, .club-table td { padding: 15px 16px; border-bottom: 1px solid var(--line); font-size: 13px; text-align: left; vertical-align: top; }
.club-table th { width: 34%; background: var(--bg-gray); font-weight: 700; color: #3c4046; }
.club-table tr:last-child th, .club-table tr:last-child td { border-bottom: none; }
.emblem-box { display: flex; align-items: center; gap: 22px; background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 24px; flex-wrap: wrap; }
.emblem-box img { width: 110px; height: auto; }
.emblem-box p { flex: 1; min-width: 220px; color: #4c5157; font-size: 13px; line-height: 2; }

/* ============================================================
   フッター
   ============================================================ */
.gf { background: var(--footer-bg); color: #c6c9cd; margin-top: 0; padding-bottom: 64px; }
.gf-top { border-bottom: 1px solid #24272b; }
.gf-top-inner { max-width: 1200px; margin: 0 auto; padding: 44px 16px 36px; display: flex; flex-direction: column; gap: 28px; }
.gf-brand { display: flex; align-items: center; gap: 14px; }
.gf-brand img { height: 54px; width: auto; }
.gf-brand-name { color: #fff; font-weight: 900; font-size: 15px; letter-spacing: 1px; }
.gf-brand-sub { color: #7c8188; font-size: 11px; margin-top: 4px; letter-spacing: 1px; }
.gf-nav { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 18px; }
.gf-nav a { color: #a7abb1; font-size: 12px; letter-spacing: 1px; padding: 4px 0; }
.gf-nav a:hover { color: #fff; }
.gf-sns { display: flex; gap: 14px; }
.gf-sns a { width: 40px; height: 40px; border-radius: 50%; border: 1px solid #33373c; display: flex; align-items: center; justify-content: center; }
.gf-sns a:hover { border-color: #fff; }
.gf-sns svg { width: 18px; height: 18px; fill: #c6c9cd; }
.gf-bottom-inner { max-width: 1200px; margin: 0 auto; padding: 20px 16px; display: flex; flex-direction: column; gap: 10px; font-size: 11px; color: #7c8188; }
.gf-legal { display: flex; gap: 16px; flex-wrap: wrap; }
.gf-legal a:hover { color: #fff; }
@media (min-width: 900px) {
  .gf { padding-bottom: 0; }
  .gf-top-inner { flex-direction: row; justify-content: space-between; align-items: flex-start; }
  .gf-nav { grid-template-columns: repeat(3, auto); }
  .gf-bottom-inner { flex-direction: row; justify-content: space-between; align-items: center; }
}

/* ============================================================
   入会・体験ページ (join.html)
   ============================================================ */
.step-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.step-card { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 20px 18px; position: relative; }
.step-no { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 30px; color: var(--main-color); line-height: 1; }
.step-title { font-size: 15px; font-weight: 900; margin: 10px 0 6px; }
.step-body { color: var(--ink-sub); font-size: 12px; line-height: 1.9; }
@media (min-width: 900px) { .step-grid { grid-template-columns: repeat(4, 1fr); } }

.catinfo-grid { display: grid; gap: 14px; }
.catinfo-card { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--main-color); border-radius: 6px; padding: 22px 20px; }
.catinfo-en { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: 14px; color: var(--main-color); letter-spacing: 2px; }
.catinfo-name { font-size: 20px; font-weight: 900; margin-top: 4px; }
.catinfo-target { display: inline-block; background: var(--main-light); color: var(--main-color); font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 2px; margin: 10px 0 14px; }
.catinfo-dl { display: grid; grid-template-columns: 84px 1fr; gap: 8px 12px; font-size: 13px; }
.catinfo-dl dt { color: var(--ink-sub); font-weight: 700; }
.catinfo-dl dd { color: #2c3036; line-height: 1.7; }
.catinfo-dl small { color: var(--ink-sub); }
@media (min-width: 900px) { .catinfo-grid { grid-template-columns: repeat(3, 1fr); } }

.fee-table th { width: auto; }
.fee-table small { color: var(--ink-sub); font-weight: 400; }

.jform { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 24px 20px 28px; max-width: 720px; }
.jform-row { display: grid; gap: 0 16px; }
@media (min-width: 700px) { .jform-row { grid-template-columns: 1fr 1fr; } }
.jform-group { margin-bottom: 18px; }
.jform-label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.jform-label .req { color: var(--red); font-size: 10px; margin-left: 4px; }
.jform-input {
  width: 100%; padding: 12px 14px; font-size: 14px; font-family: inherit;
  border: 1px solid #d4d6d9; border-radius: 4px; background: var(--bg-gray);
}
.jform-input:focus { outline: none; border-color: var(--main-color); background: #fff; }
.jform-textarea { min-height: 110px; resize: vertical; }
.jform-radios { display: flex; gap: 10px 20px; flex-wrap: wrap; padding-top: 4px; }
.jform-radios label { font-size: 13px; display: inline-flex; align-items: center; gap: 6px; }
.jform-submit {
  display: block; width: 100%; margin-top: 6px; cursor: pointer;
  background: var(--main-color); color: #fff; border: none; border-radius: 999px;
  font-size: 15px; font-weight: 700; letter-spacing: 1px; padding: 16px; font-family: inherit;
  transition: background .2s;
}
.jform-submit:hover { background: var(--main-dark); }

/* ============================================================
   パートナーページ (partners.html)
   ============================================================ */
.pt-grid { display: grid; gap: 14px; }
.pt-card {
  background: #fff; border: 1px solid var(--line); border-radius: 6px;
  padding: 22px 20px; display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s;
}
.pt-card:hover { box-shadow: 0 10px 24px rgba(0,0,0,0.1); transform: translateY(-2px); }
.pt-logo { height: 64px; display: flex; align-items: center; margin-bottom: 14px; }
.pt-logo img { max-height: 56px; width: auto; max-width: 200px; object-fit: contain; }
.pt-logo-text { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 30px; color: #3c4046; letter-spacing: 2px; }
.pt-label { align-self: flex-start; font-size: 10px; font-weight: 700; letter-spacing: 2px; padding: 3px 10px; border-radius: 2px; border: 1px solid var(--main-color); color: var(--main-color); }
.pt-label--official { background: var(--main-color); color: #fff; }
.pt-label--supporter { border-color: var(--gold); color: var(--gold); }
.pt-name { font-size: 16px; font-weight: 900; margin: 10px 0 6px; }
.pt-desc { color: var(--ink-sub); font-size: 12.5px; line-height: 1.9; flex: 1; }
.pt-link { margin-top: 14px; color: var(--main-color); font-size: 12px; font-weight: 700; }
@media (min-width: 700px) { .pt-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .pt-grid { grid-template-columns: repeat(3, 1fr); } }
.pt-support { margin-top: 52px; text-align: center; background: var(--bg-gray); border-radius: 8px; padding: 44px 20px; }
.pt-support-en { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: 14px; color: var(--main-color); letter-spacing: 3px; }
.pt-support-title { font-size: 24px; font-weight: 900; margin: 8px 0 12px; }
.pt-support-desc { color: #4c5157; font-size: 13px; line-height: 2; margin-bottom: 22px; }

/* ============================================================
   クラブ員ログイン / お問い合わせページ
   ============================================================ */
.login-wrap { max-width: 460px; margin: 0 auto; }
.login-lead { color: #4c5157; font-size: 13.5px; line-height: 2.1; margin-bottom: 24px; text-align: center; }
.login-card { max-width: none; }
.login-error { display: none; color: var(--red); font-size: 12px; font-weight: 700; margin: -6px 0 14px; }
.login-note { color: var(--ink-sub); font-size: 11px; line-height: 1.9; margin-top: 14px; text-align: center; }
.ct-grid { display: grid; gap: 40px; }
@media (min-width: 1000px) { .ct-grid { grid-template-columns: 5fr 6fr; gap: 40px; align-items: start; } }

/* ── クラブ員ダッシュボード ── */
.dash-grid { display: grid; gap: 12px; }
@media (min-width: 768px) { .dash-grid { grid-template-columns: repeat(3, 1fr); } .dash-grid--4 { grid-template-columns: repeat(4, 1fr); } .dash-grid--2 { grid-template-columns: repeat(2, 1fr); } }
.dcard { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--main-color); border-radius: 6px; padding: 20px 18px; display: flex; flex-direction: column; }
.dcard-label { font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: 2px; color: var(--main-color); font-weight: 700; }
.dcard-title { font-size: 16px; font-weight: 900; margin: 8px 0 6px; }
.dcard-desc { color: var(--ink-sub); font-size: 12px; line-height: 1.9; flex: 1; }
.dcard-link { margin-top: 12px; color: var(--main-color); font-size: 13px; font-weight: 700; }
.dcard-link:hover { text-decoration: underline; }
.cal-frame { display: none; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.cal-frame.active { display: block; }
.cal-frame iframe { width: 100%; height: 560px; display: block; }
.video-grid { display: grid; gap: 14px; }
@media (min-width: 768px) { .video-grid { grid-template-columns: repeat(3, 1fr); } }
.video-card { background: #fff; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.video-card iframe { width: 100%; aspect-ratio: 16/9; border: 0; display: block; }
.video-title { padding: 10px 14px; font-size: 13px; font-weight: 700; }

/* ── クラブ資料室 ── */
.dcard--link { transition: box-shadow .2s, transform .2s; }
.dcard--link:hover { box-shadow: 0 10px 24px rgba(0,0,0,0.12); transform: translateY(-2px); }
.doc-article { max-width: 860px; }
.doc-para { color: #2c3036; font-size: 14px; line-height: 2.1; }
.doc-note { color: var(--ink-sub); font-size: 12px; line-height: 1.9; margin-top: 10px; }
.doc-list { margin: 14px 0 0; padding-left: 1.3em; color: #2c3036; font-size: 13.5px; line-height: 2.1; }
.doc-nav { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 44px; }

/* 会則(条文リスト) */
.rule-list { border-top: 1px solid var(--line); }
.rule-item { display: grid; grid-template-columns: 46px 1fr; gap: 14px; padding: 18px 4px; border-bottom: 1px solid var(--line); }
.rule-no { font-family: 'Oswald', sans-serif; font-weight: 700; font-style: italic; font-size: 22px; color: var(--main-color); line-height: 1.2; }
.rule-tag { display: inline-block; background: var(--main-light); color: var(--main-color); font-size: 11px; font-weight: 700; letter-spacing: 1px; padding: 3px 10px; border-radius: 2px; margin-bottom: 8px; }
.rule-body p { color: #2c3036; font-size: 13.5px; line-height: 2.05; }

/* 10か条リスト(親の心得・勝者と敗者) */
.kajo-list { display: grid; gap: 12px; }
.kajo-item {
  display: grid; grid-template-columns: 58px 1fr; gap: 14px; align-items: start;
  background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--main-color);
  border-radius: 6px; padding: 18px 18px;
}
.kajo-no { font-family: 'Oswald', sans-serif; font-weight: 700; font-style: italic; font-size: 30px; color: var(--main-color); line-height: 1; padding-top: 2px; }
.kajo-main { color: var(--ink); font-size: 14.5px; font-weight: 700; line-height: 1.95; }
.kajo-sub { color: var(--ink-sub); font-size: 12.5px; line-height: 1.9; margin-top: 6px; }

/* FAQ アコーディオン */
.faq-list { display: grid; gap: 10px; }
.faq-item { background: #fff; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.faq-item summary {
  cursor: pointer; list-style: none; position: relative;
  padding: 16px 44px 16px 18px; font-size: 14px; font-weight: 700; color: var(--ink);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::before { content: 'Q.'; color: var(--main-color); font-family: 'Oswald', sans-serif; font-style: italic; margin-right: 8px; }
.faq-item summary::after {
  content: '+'; position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  font-family: 'Oswald', sans-serif; font-size: 20px; color: var(--main-color); transition: transform .2s;
}
.faq-item[open] summary::after { content: '−'; }
.faq-item[open] summary { border-bottom: 1px solid var(--line); background: var(--bg-gray); }
.faq-item p { padding: 14px 18px 18px; color: #2c3036; font-size: 13.5px; line-height: 2; }
.faq-item p a { color: var(--main-color); font-weight: 700; }

/* 勝者と敗者 締めの言葉 */
.win-close {
  margin-top: 36px; text-align: center; background: var(--main-dark); color: #fff;
  border-radius: 8px; padding: 40px 20px;
}
.win-close p { font-size: clamp(16px, 2.6vw, 21px); font-weight: 900; line-height: 2.2; letter-spacing: 1px; }
.win-close-en { display: inline-block; margin-top: 18px; font-family: 'Oswald', sans-serif; font-style: italic; letter-spacing: 3px; color: #7fce97; font-size: 14px; }

.doc-row { display: grid; gap: 20px; }
@media (min-width: 860px) { .doc-row { grid-template-columns: 320px 1fr; align-items: start; } }
.doc-thumb {
  display: block; border: 1px solid var(--line); border-radius: 6px; overflow: hidden;
  background: #fff; box-shadow: 0 4px 14px rgba(0,0,0,0.08); transition: transform .25s ease, box-shadow .25s ease;
}
.doc-thumb:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(0,0,0,0.14); }
.doc-thumb img { display: block; width: 100%; height: auto; }
.doc-desc { color: #2c3036; font-size: 14px; line-height: 2; margin-bottom: 12px; }
.doc-points { margin: 0 0 18px; padding-left: 1.2em; color: var(--ink-sub); font-size: 12.5px; line-height: 2; }
.doc-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.doc-btn {
  display: inline-block; font-size: 13px; font-weight: 700; letter-spacing: 1px;
  padding: 12px 26px; border-radius: 999px; border: 1px solid #c9ccd0; background: #fff; color: var(--ink);
  transition: all .15s;
}
.doc-btn:hover { border-color: var(--main-color); color: var(--main-color); }
.doc-btn--main { background: var(--main-color); border-color: var(--main-color); color: #fff; }
.doc-btn--main:hover { background: var(--main-dark); color: #fff; }
.doc-zoom {
  display: none; position: fixed; inset: 0; z-index: 500;
  background: rgba(12,14,16,0.88); align-items: flex-start; justify-content: center;
  padding: 30px 16px; overflow-y: auto; cursor: zoom-out;
}
.doc-zoom.open { display: flex; }
.doc-zoom img { max-width: min(920px, 96vw); width: 100%; height: auto; border-radius: 4px; }
.doc-zoom-close { position: fixed; top: 14px; right: 18px; background: none; border: none; color: #fff; font-size: 26px; cursor: pointer; }

/* ── ニュース / 試合結果 詳細モーダル ── */
.nd-overlay {
  display: none; position: fixed; inset: 0; z-index: 400;
  background: rgba(12,14,16,0.8); align-items: center; justify-content: center; padding: 20px;
}
.nd-overlay.open { display: flex; }
.nd-box {
  position: relative; background: #fff; border-radius: 8px;
  max-width: 560px; width: 100%; max-height: 84vh; overflow-y: auto;
  padding: 26px 24px 28px;
}
.nd-close { position: absolute; top: 12px; right: 12px; background: none; border: none; font-size: 22px; color: #9aa0a8; cursor: pointer; padding: 4px 8px; }
.nd-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.nd-tag { font-size: 11px; font-weight: 700; letter-spacing: 1px; border: 1px solid var(--main-color); color: var(--main-color); padding: 3px 10px; border-radius: 2px; }
.nd-date { font-family: 'Oswald', sans-serif; font-size: 13px; color: var(--ink-sub); }
.nd-title { font-size: 18px; font-weight: 900; line-height: 1.6; margin-bottom: 14px; }
.nd-image { display: none; width: 100%; border-radius: 6px; margin-bottom: 14px; }
.nd-image.show { display: block; }
.nd-body { font-size: 14px; line-height: 2; color: #2c3036; white-space: pre-wrap; }

/* ============================================================
   メッセージページ (message.html)
   ============================================================ */
.msg-hero { position: relative; height: 64vh; min-height: 400px; overflow: hidden; background: #1a1c1e; }
.msg-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; animation: heroZoom 20s ease-in-out infinite alternate; }
.msg-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(8,14,10,0.35), rgba(8,14,10,0.78)); }
.msg-hero-inner {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 0 20px;
}
.msg-hero-en { color: #9fd3ae; font-family: 'Oswald', sans-serif; font-style: italic; font-size: clamp(11px, 1.6vw, 14px); letter-spacing: 5px; margin-bottom: 18px; }
.msg-hero-title { color: #fff; font-size: clamp(30px, 5.6vw, 58px); font-weight: 900; line-height: 1.5; letter-spacing: 3px; text-shadow: 0 4px 24px rgba(0,0,0,0.5); }
.msg-hero-title--soft {
  font-family: 'Zen Maru Gothic', 'Noto Sans JP', sans-serif;
  font-weight: 700;
  font-size: clamp(31px, 5.8vw, 60px);
  line-height: 1.55; letter-spacing: 3px;
}

/* 保護者への感謝セクション */
.msg-block.msg-block--thanks { background: #f8f6ef; }
.msg-thanks-label {
  font-family: 'Yomogi', 'Noto Sans JP', sans-serif;
  color: var(--main-color); font-size: clamp(17px, 2.4vw, 24px);
  margin-bottom: 20px; letter-spacing: 1px;
}
.msg-thanks-close {
  font-size: clamp(14px, 1.7vw, 16.5px); line-height: 2.4;
  color: #2c3036; margin-top: 36px;
}
.msg-thanks-close em { font-style: normal; font-weight: 700; color: var(--main-color); }
.msg-bridge {
  font-size: clamp(14px, 1.7vw, 16.5px); line-height: 2.4;
  color: #2c3036; margin-top: 52px; padding-top: 46px; position: relative;
}
.msg-bridge::before {
  content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 1px; height: 34px; background: linear-gradient(to bottom, rgba(26,92,45,0), var(--main-color));
}

.msg-block { padding: clamp(64px, 10vw, 120px) 20px; background: #fff; }
.msg-block--gray { background: var(--bg-gray); }
.msg-inner { max-width: 980px; margin: 0 auto; }
.msg-big {
  font-size: clamp(26px, 4.6vw, 46px); font-weight: 900; line-height: 1.75; letter-spacing: 2px; color: var(--ink);
  margin-bottom: 28px;
}
.msg-big em, .msg-lead em, .msg-close-big em { font-style: normal; color: var(--main-color); }
.msg-lead { font-size: clamp(21px, 3.2vw, 32px); font-weight: 900; line-height: 1.8; letter-spacing: 1px; margin-bottom: 22px; }
.msg-text { font-size: clamp(14px, 1.7vw, 16.5px); line-height: 2.4; color: #2c3036; }
.msg-text strong { color: var(--main-color); }

.msg-photo-band { height: clamp(240px, 42vw, 480px); background-size: cover; background-position: center 30%; background-attachment: fixed; }
@media (max-width: 767px) { .msg-photo-band { background-attachment: scroll; } }

.msg-split { display: grid; gap: 34px; align-items: center; }
.msg-split-photo { border-radius: 8px; min-height: 280px; background-size: cover; background-position: center; box-shadow: 0 14px 34px rgba(10,26,14,0.18); }
@media (min-width: 900px) {
  .msg-split { grid-template-columns: 1.1fr 1fr; gap: 60px; }
  .msg-split--rev .msg-split-text { order: 2; }
  .msg-split--rev .msg-split-photo { order: 1; }
  .msg-split-photo { min-height: 380px; }
}

.msg-quotes { display: flex; align-items: center; justify-content: center; gap: clamp(14px, 3vw, 34px); margin: 40px 0; flex-wrap: wrap; }
.msg-quote {
  background: #fff; border: 1px solid var(--line); border-radius: 8px;
  padding: clamp(20px, 3vw, 34px) clamp(22px, 3.6vw, 44px);
  font-size: clamp(17px, 2.6vw, 26px); font-weight: 900; line-height: 1.7; letter-spacing: 1px;
  box-shadow: 0 10px 26px rgba(0,0,0,0.08); transform: rotate(-1.2deg);
}
.msg-quote + .msg-quote-vs + .msg-quote { transform: rotate(1.2deg); }
.msg-quote-vs { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: clamp(22px, 3.4vw, 34px); color: var(--red); }

.msg-close { background: var(--main-dark); padding: clamp(70px, 11vw, 130px) 20px; position: relative; overflow: hidden; }
.msg-close::before {
  content: 'CORAZON GRANDE'; position: absolute; left: 50%; top: 18px; transform: translateX(-50%);
  font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: clamp(50px, 11vw, 130px);
  color: rgba(255,255,255,0.04); white-space: nowrap; letter-spacing: 4px; pointer-events: none;
}
.msg-close-inner { position: relative; z-index: 2; max-width: 900px; margin: 0 auto; text-align: center; }
.msg-close-big {
  color: #fff; font-size: clamp(22px, 3.8vw, 40px); font-weight: 900; line-height: 2; letter-spacing: 2px;
  margin: 44px 0 10px;
}
.msg-close-big .strike { color: rgba(255,255,255,0.45); text-decoration: line-through; text-decoration-color: rgba(255,255,255,0.6); text-decoration-thickness: 3px; }
.msg-close-big em { color: #7fce97; border-bottom: 4px solid #7fce97; padding-bottom: 4px; }
.msg-close-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-top: 44px; }
.sp-br { display: inline; } .pc-br { display: none; }
@media (min-width: 768px) { .sp-br { display: none; } .pc-br { display: inline; } }

/* ── スクロールリビール ── */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.active { opacity: 1; transform: none; }

/* ============================================================
   演出: ローディング / ヒーロー文字 / マーキー / 見出し / ホバー
   ============================================================ */

/* ── ローディング演出 ── */
.loader {
  position: fixed; inset: 0; z-index: 1000;
  background: var(--main-dark);
  display: flex; align-items: center; justify-content: center;
  transition: opacity .6s ease, visibility .6s ease;
}
.loader.done, .loader.skip { opacity: 0; visibility: hidden; pointer-events: none; }
.loader.skip { transition: none; }
.loader-inner { text-align: center; }
.loader-logo { height: 64px; width: auto; margin: 0 auto 18px; animation: loaderPop .7s cubic-bezier(.2,.8,.3,1.2) both; }
.loader-text {
  color: #fff; font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700;
  font-size: clamp(20px, 4vw, 30px); letter-spacing: 4px;
}
.loader-text span { display: inline-block; opacity: 0; transform: translateY(14px); animation: loaderCh .5s ease forwards; }
.loader-bar { width: 160px; height: 2px; background: rgba(255,255,255,0.2); margin: 22px auto 0; overflow: hidden; border-radius: 2px; }
.loader-bar span { display: block; height: 100%; width: 40%; background: #7fce97; border-radius: 2px; animation: loaderBar 1.2s ease-in-out infinite; }
@keyframes loaderPop { from { opacity: 0; transform: scale(.7); } to { opacity: 1; transform: scale(1); } }
@keyframes loaderCh { to { opacity: 1; transform: none; } }
@keyframes loaderBar { 0% { transform: translateX(-120%); } 100% { transform: translateX(420%); } }

/* ── ヒーロー・イントロ: 文字が開いて写真が全画面に(SVGマスク) ── */
.hero-reveal { position: absolute; inset: 0; z-index: 4; pointer-events: none; opacity: 0; }
.hero-reveal-svg { width: 100%; height: 100%; display: block; transform-origin: 50% 52%; will-change: transform, opacity; }
body.page-in .hero-reveal { animation: revealFade 2.0s linear forwards; }
body.page-in .hero-reveal-svg { animation: revealOpen 1.55s cubic-bezier(.66,0,.34,1) .35s forwards; }
@keyframes revealFade { 0%,72% { opacity: 1; } 100% { opacity: 0; } }
@keyframes revealOpen { 0% { transform: scale(1); } 100% { transform: scale(20); } }

/* ── ヒーロー: 着地コピー + 背景スロースズーム ── */
.hero-emblem {
  display: block; align-self: flex-start; width: auto; height: clamp(46px, 6vw, 80px); max-width: 90vw;
  margin: 0 0 18px 22px;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.55));
  opacity: 0; transform: translateY(22px) scale(0.97);
  transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);
  transition-delay: 1.8s;
}
body.page-in .hero-emblem { opacity: 1; transform: none; }
.hero-catch {
  position: relative;
  color: #fff; font-weight: 900;
  font-size: clamp(31px, 6.2vw, 72px); line-height: 1.24; letter-spacing: 2px;
  padding-left: 22px;
  text-shadow: 0 2px 6px rgba(0,0,0,0.85), 0 12px 36px rgba(0,0,0,0.55);
  opacity: 0; transform: translateY(20px);
  transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);
  transition-delay: 2.05s;
}
.hero-catch::before {
  content: ''; position: absolute; left: 0; top: .16em; bottom: .16em; width: 6px;
  border-radius: 4px; background: linear-gradient(#8fe0a6, var(--main-color));
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
}
.hero-club {
  color: #f2f7f3; font-weight: 700;
  font-size: clamp(13px, 2vw, 18px); letter-spacing: 3px; margin-top: 18px; padding-left: 22px;
  text-shadow: 0 2px 8px rgba(0,0,0,0.85);
  opacity: 0; transform: translateY(14px);
  transition: opacity .8s ease, transform .8s ease;
  transition-delay: 2.45s;
}
body.page-in .hero-catch, body.page-in .hero-club { opacity: 1; transform: none; }
.hero-bg { animation: heroZoom 18s ease-in-out infinite alternate; }
@keyframes heroZoom { from { transform: scale(1.02); } to { transform: scale(1.12); } }

/* ── マーキー(流れる帯文字) ── */
.marquee { background: var(--bg); padding: 34px 0 30px; overflow: hidden; border-bottom: 1px solid var(--line); }
.marquee-inner {
  display: inline-flex; white-space: nowrap; will-change: transform;
  animation: marqueeMove 26s linear infinite;
}
.marquee-inner span {
  font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700;
  font-size: clamp(44px, 8vw, 92px); line-height: 1; letter-spacing: 2px;
  color: transparent; -webkit-text-stroke: 1.5px rgba(26,92,45,0.35);
  flex: none;
}
@keyframes marqueeMove { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── セクション見出し: clip-path リビール ── */
.reveal .sec-en {
  clip-path: inset(0 100% 0 0);
  transition: clip-path .9s cubic-bezier(.6,0,.2,1) .1s;
}
.reveal.active .sec-en { clip-path: inset(0 0 0 0); }
.reveal .sec-ja { opacity: 0; transition: opacity .7s ease .5s; }
.reveal.active .sec-ja { opacity: 1; }

/* ── 数字カウントアップ ── */
.stats-row { display: flex; justify-content: center; gap: 40px; margin: 28px 0 4px; flex-wrap: wrap; }
.stat { text-align: center; }
.stat-num {
  display: block; font-family: 'Oswald', sans-serif; font-weight: 700; font-style: italic;
  font-size: clamp(34px, 5vw, 52px); line-height: 1; color: #7fce97;
}
.stat-label { display: block; margin-top: 8px; font-size: 11px; letter-spacing: 3px; color: rgba(255,255,255,0.65); font-weight: 700; }

/* ── ホバー演出の底上げ ── */
.quick-card, .movie-card, .promo-card { transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease; }
.quick-card:hover, .movie-card:hover, .promo-card:hover { transform: translateY(-4px) scale(1.015); box-shadow: 0 14px 30px rgba(10,26,14,0.22); }
.news-row .news-arrow { transition: transform .25s ease, color .25s ease; }
.news-row:hover .news-arrow { transform: translateX(5px); color: var(--main-color); }
.gh-cta--trial, .fb-trial, .statement-btn, .nm-btn-light { position: relative; overflow: hidden; }
.gh-cta--trial::after, .fb-trial::after, .nm-btn-light::after {
  content: ''; position: absolute; top: 0; left: -80%; width: 60%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.28), transparent);
  transform: skewX(-18deg); transition: left .55s ease;
}
.gh-cta--trial:hover::after, .fb-trial:hover::after, .nm-btn-light:hover::after { left: 130%; }
.partner-item img { transition: transform .35s ease; }
.partner-item:hover img { transform: scale(1.06); }
.sns-item svg { transition: transform .3s ease; }
.sns-item:hover svg { transform: scale(1.15) rotate(-4deg); }

/* ── 動きを減らす設定への配慮 ── */
@media (prefers-reduced-motion: reduce) {
  .hero-bg, .marquee-inner, .loader-bar span { animation: none !important; }
  .hero-reveal { display: none !important; }
  .hero-emblem, .hero-catch, .hero-club { transition: none; transform: none; opacity: 1; }
  .reveal, .reveal .sec-en, .reveal .sec-ja { transition: none; opacity: 1; transform: none; clip-path: none; }
}

/* ============================================================
   クラブの取り組み (initiatives / 各取り組みページ共通)
   ページごとに <style> で --tk(アクセント) / --tk-dark を上書き
   ============================================================ */
:root { --tk: var(--main-color); --tk-dark: #10401e; --tk-bg: #f4f6f4; }

.tk-hero { position: relative; min-height: 46vh; display: flex; align-items: flex-end; overflow: hidden; background: var(--tk-dark); }
.tk-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.tk-hero::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.74), rgba(0,0,0,0.16) 62%),
              linear-gradient(100deg, rgba(0,0,0,0.42), transparent 60%);
}
.tk-hero-inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; width: 100%; padding: 120px 20px 42px; }
.tk-hero-en { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; color: #fff; opacity: .85; letter-spacing: 5px; font-size: clamp(11px, 1.5vw, 14px); }
.tk-hero-title { color: #fff; font-size: clamp(28px, 4.8vw, 54px); font-weight: 900; letter-spacing: 2px; line-height: 1.35; margin-top: 6px; text-shadow: 0 3px 16px rgba(0,0,0,0.5); }
.tk-hero-sub { color: rgba(255,255,255,0.88); font-size: clamp(13px, 1.8vw, 16px); font-weight: 700; letter-spacing: 2px; margin-top: 10px; text-shadow: 0 2px 8px rgba(0,0,0,0.6); }

.tk-sec { padding: clamp(56px, 8vw, 92px) 20px; background: #fff; }
.tk-sec--band { background: var(--tk-bg); }
.tk-sec--dark { background: var(--tk-dark); }
.tk-sec-inner { max-width: 1100px; margin: 0 auto; }
.tk-sec-en { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; color: var(--tk); letter-spacing: 4px; font-size: 13px; }
.tk-sec-ja { font-size: clamp(22px, 3.2vw, 34px); font-weight: 900; letter-spacing: 1px; margin: 6px 0 26px; }
.tk-sec--dark .tk-sec-ja { color: #fff; }

.tk-lead { font-size: clamp(19px, 2.9vw, 30px); font-weight: 900; line-height: 1.95; letter-spacing: 1px; margin-bottom: 18px; }
.tk-lead em { font-style: normal; color: var(--tk); }
.tk-text { font-size: clamp(14px, 1.7vw, 16px); line-height: 2.3; color: #2c3036; }
.tk-text strong { color: var(--tk); }

.tk-points { display: grid; gap: 14px; grid-template-columns: 1fr; margin-top: 10px; }
@media (min-width: 768px) { .tk-points { grid-template-columns: repeat(2, 1fr); gap: 18px; } }
@media (min-width: 1000px) { .tk-points--4 { grid-template-columns: repeat(4, 1fr); } .tk-points--3 { grid-template-columns: repeat(3, 1fr); } }
.tk-point { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 24px 20px; box-shadow: 0 8px 22px rgba(10,26,14,0.06); }
.tk-point-num { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: 30px; color: var(--tk); line-height: 1; }
.tk-point-title { font-weight: 900; font-size: 16.5px; margin: 10px 0 8px; letter-spacing: 1px; }
.tk-point-text { font-size: 13.5px; line-height: 2; color: #444; }

.tk-photos { display: grid; gap: 10px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 768px) { .tk-photos { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
.tk-photo { aspect-ratio: 4 / 3; background-size: cover; background-position: center; border-radius: 10px; box-shadow: 0 8px 20px rgba(10,26,14,0.10); }
.tk-photo--wide { grid-column: span 2; aspect-ratio: 16 / 8; }

.tk-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.tk-chip { background: #fff; border: 2px solid var(--tk); color: var(--tk); font-weight: 900; font-size: 14px; letter-spacing: 1px; border-radius: 999px; padding: 10px 22px; }

.tk-stat { text-align: center; padding: 8px 0 4px; }
.tk-stat-num { font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: clamp(64px, 11vw, 120px); color: var(--tk); line-height: 1; }
.tk-stat-num small { font-size: 0.36em; font-style: normal; margin-left: 6px; }
.tk-stat-label { font-weight: 900; letter-spacing: 2px; margin-top: 10px; font-size: clamp(14px, 2vw, 18px); }

.tk-split { display: grid; gap: 20px; }
@media (min-width: 900px) { .tk-split { grid-template-columns: 1fr 1fr; gap: 26px; } }
.tk-season { border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid var(--line); box-shadow: 0 10px 26px rgba(10,26,14,0.08); }
.tk-season-head { padding: 16px 22px; color: #fff; font-weight: 900; letter-spacing: 2px; font-size: 17px; display: flex; align-items: center; gap: 10px; }
.tk-season-head .en { font-family: 'Oswald', sans-serif; font-style: italic; opacity: .8; font-size: 13px; letter-spacing: 3px; }
.tk-season-body { padding: 20px 22px 24px; font-size: 14px; line-height: 2.2; color: #2c3036; }
.tk-season-body ul { list-style: none; margin-top: 10px; }
.tk-season-body li { padding-left: 20px; position: relative; font-weight: 700; }
.tk-season-body li::before { content: ''; position: absolute; left: 2px; top: .95em; width: 8px; height: 8px; border-radius: 50%; background: var(--tk); }

/* 一覧(ハブ)カード */
.tkc-grid { display: grid; gap: 16px; }
@media (min-width: 900px) { .tkc-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; } .tkc-card--wide { grid-column: span 2; } }
.tkc-card { position: relative; display: flex; align-items: flex-end; min-height: 230px; border-radius: 14px; overflow: hidden; text-decoration: none; background-size: cover; background-position: center; background-color: var(--c, #123); box-shadow: 0 12px 28px rgba(10,26,14,0.14); transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease; }
.tkc-card:hover { transform: translateY(-5px); box-shadow: 0 18px 38px rgba(10,26,14,0.22); }
.tkc-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, var(--c-grad, rgba(0,0,0,0.82)), rgba(0,0,0,0.08) 65%); }
.tkc-body { position: relative; z-index: 2; padding: 22px 24px; width: 100%; }
.tkc-en { display: block; font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; font-size: 12px; letter-spacing: 3px; color: var(--c-accent, #ffd76a); }
.tkc-ja { display: block; color: #fff; font-weight: 900; font-size: clamp(19px, 2.6vw, 26px); letter-spacing: 1px; margin-top: 4px; }
.tkc-sub { display: block; color: rgba(255,255,255,0.85); font-size: 12.5px; letter-spacing: 1px; margin-top: 6px; line-height: 1.8; }
.tkc-arrow { position: absolute; right: 20px; bottom: 20px; z-index: 2; color: #fff; font-family: 'Oswald', sans-serif; font-weight: 700; font-style: italic; opacity: .85; }

/* 他の取り組みへ */
.tk-others { display: grid; gap: 10px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .tk-others { grid-template-columns: repeat(2, 1fr); } }
.tk-other { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; border: 1px solid var(--line); border-left: 6px solid var(--c, var(--main-color)); border-radius: 8px; padding: 16px 18px; text-decoration: none; color: var(--ink); font-weight: 900; letter-spacing: 1px; transition: transform .3s ease, box-shadow .3s ease; }
.tk-other:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(10,26,14,0.12); }
.tk-other small { display: block; font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; color: var(--c, var(--main-color)); font-size: 11px; letter-spacing: 2px; }
.tk-other .ar { color: var(--c, var(--main-color)); font-family: 'Oswald', sans-serif; font-weight: 700; }

/* トップページ用バナー */
.tk-banner { position: relative; display: block; border-radius: 14px; overflow: hidden; min-height: 190px; background-size: cover; background-position: center 35%; text-decoration: none; box-shadow: 0 12px 28px rgba(10,26,14,0.16); transition: transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease; }
.tk-banner:hover { transform: translateY(-4px); box-shadow: 0 18px 38px rgba(10,26,14,0.24); }
.tk-banner::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(10,30,16,0.88) 20%, rgba(10,30,16,0.3) 70%, rgba(10,30,16,0.1)); }
.tk-banner-body { position: relative; z-index: 2; padding: 34px 28px; }
.tk-banner-en { display: block; font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700; color: #7fce97; letter-spacing: 4px; font-size: 13px; }
.tk-banner-ja { display: block; color: #fff; font-weight: 900; font-size: clamp(22px, 3.4vw, 34px); letter-spacing: 2px; margin-top: 4px; }
.tk-banner-sub { display: block; color: rgba(255,255,255,0.82); font-size: 12.5px; letter-spacing: 1px; margin-top: 10px; line-height: 1.9; }

/* ═══════════════════════════════════════════════
   MOBILE EXPERIENCE PACK (2026-07)
   マッチデー・モード / スコア演出 / ボトムナビ / PWA
   ═══════════════════════════════════════════════ */

/* ── マッチデー・バナー ── */
#matchday-banner { display: none; }
.mday {
  position: relative;
  overflow: hidden;
  background: linear-gradient(120deg, #0a2413 0%, #0e3a1c 45%, #14532a 100%);
  border-top: 3px solid #c8a94a;
  border-bottom: 3px solid #c8a94a;
  color: #fff;
  text-align: center;
}
.mday-stripes {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(-55deg, rgba(255,255,255,.04) 0 18px, transparent 18px 36px);
  animation: mday-slide 24s linear infinite;
  pointer-events: none;
}
@keyframes mday-slide { from { transform: translateX(0); } to { transform: translateX(-120px); } }
.mday-inner { position: relative; padding: 26px 16px 30px; max-width: 720px; margin: 0 auto; }
.mday-head { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 8px; flex-wrap: wrap; }
.mday-flag {
  background: #c8a94a; color: #0e3a1c;
  font-weight: 900; font-size: 11px; letter-spacing: 2px;
  padding: 4px 10px; border-radius: 3px;
  animation: mday-blink 2.4s ease-in-out infinite;
}
.mday-flag--next { background: rgba(255,255,255,.14); color: #e8d48b; animation: none; }
@keyframes mday-blink { 0%,100% { opacity: 1; } 50% { opacity: .55; } }
.mday-title {
  font-family: 'Oswald', sans-serif; font-style: italic; font-weight: 700;
  font-size: clamp(30px, 8vw, 46px); letter-spacing: 3px; line-height: 1;
  background: linear-gradient(180deg, #fff 55%, #c8a94a);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.mday-next-date { font-family: 'Oswald', sans-serif; font-size: clamp(18px, 5vw, 24px); font-weight: 700; letter-spacing: 1px; color: #fff; }
.mday-vs { font-weight: 900; font-size: clamp(17px, 4.6vw, 22px); margin-bottom: 2px; }
.mday-vs--sm { font-size: clamp(15px, 4vw, 18px); }
.mday-cat {
  display: inline-block; margin-left: 8px; vertical-align: middle;
  background: rgba(255,255,255,.12); border: 1px solid rgba(200,169,74,.5);
  color: #e8d48b; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px;
}
.mday-comp { color: rgba(255,255,255,.55); font-size: 12.5px; margin-bottom: 4px; }
.mday-count-label { color: #c8a94a; font-size: 11px; font-weight: 700; letter-spacing: 3px; margin: 10px 0 6px; }
.mday-count { display: flex; justify-content: center; align-items: center; gap: 3px; }
.mday-digit {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 34px; padding: 7px 2px;
  background: rgba(0,0,0,.35); border: 1px solid rgba(200,169,74,.35); border-radius: 7px;
  font-family: 'Oswald', sans-serif; font-size: 27px; font-weight: 700; color: #fff;
  box-shadow: inset 0 -12px 14px rgba(0,0,0,.3);
}
.mday-count--sm .mday-digit { min-width: 27px; font-size: 21px; padding: 5px 2px; }
.mday-sep { font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 700; color: #c8a94a; padding: 0 2px; }
.mday-gap { width: 10px; }
.mday-live { font-weight: 900; font-size: 19px; color: #e8d48b; animation: mday-blink 1.2s ease-in-out infinite; }
.mday-score-row { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 8px 0 6px; flex-wrap: wrap; }
.mday-team { font-weight: 900; font-size: clamp(14px, 4vw, 18px); }
.mday-score { font-family: 'Oswald', sans-serif; font-size: clamp(40px, 11vw, 58px); font-weight: 700; line-height: 1; }
.mday-score i { font-style: normal; color: #c8a94a; padding: 0 6px; }
.mday--win .mday-title { background: linear-gradient(180deg, #ffe9a8 30%, #c8a94a); -webkit-background-clip: text; background-clip: text; }
.mday--win { border-color: #e8d48b; box-shadow: 0 0 40px rgba(200,169,74,.25) inset; }

/* ── スコアのカウントアップ演出 ── */
.score-rolling { opacity: .75; }
.score-landed { animation: score-pop .45s cubic-bezier(.2, 2.2, .4, 1); display: inline-block; }
@keyframes score-pop { 0% { transform: scale(1.55); } 100% { transform: scale(1); } }
.row-win-glow .result-badge.badge-win {
  animation: win-glow 1.8s ease-in-out 2;
}
@keyframes win-glow {
  0%, 100% { box-shadow: 0 0 0 rgba(200,169,74,0); }
  50% { box-shadow: 0 0 18px rgba(200,169,74,.9), 0 0 36px rgba(200,169,74,.4); }
}

/* ── 紙吹雪 ── */
.gv-confetti {
  position: fixed; z-index: 9999;
  width: 8px; height: 12px; border-radius: 2px;
  pointer-events: none;
  animation: gv-confetti-fly 1.4s cubic-bezier(.2, .6, .4, 1) forwards;
}
@keyframes gv-confetti-fly {
  0%   { transform: translate(0, 0) rotate(0deg); opacity: 1; }
  100% { transform: translate(var(--dx), calc(var(--dy) + 160px)) rotate(var(--rot)); opacity: 0; }
}

/* ── アプリ風ボトムナビ（スマホのみ） ── */
.bnav-m {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 950;
  display: flex;
  background: rgba(8, 26, 14, .93);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border-top: 1px solid rgba(200,169,74,.25);
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.bnav-m a {
  position: relative;
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 9px 0 8px;
  color: rgba(255,255,255,.55);
  font-size: 10px; font-weight: 700; letter-spacing: .5px;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: color .2s;
}
.bnav-m a svg {
  width: 22px; height: 22px;
  fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
.bnav-m a.on { color: #fff; }
.bnav-m a.bnav-m-cta { color: #e8d48b; }
.bnav-m a:active { transform: scale(.94); }
.bnav-dot {
  position: absolute; top: 4px; left: 50%; transform: translateX(-50%);
  width: 4px; height: 4px; border-radius: 50%; background: #c8a94a;
}
@media (min-width: 900px) {
  .bnav-m { display: none; }
}
@media (max-width: 899px) {
  body.has-bnav { padding-bottom: calc(62px + env(safe-area-inset-bottom, 0)); }
  body.has-bnav .float-btns { display: none; }
}

/* ── ライブ速報バナー追加分 ── */
.mday-flag--red { background: #c62828; color: #fff; display: inline-flex; align-items: center; gap: 6px; animation: none; }
.mday-reddot { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: mday-blink 1.1s ease-in-out infinite; }
.mday-live-btn {
  display: inline-block; margin-top: 12px;
  background: #c62828; color: #fff; text-decoration: none;
  font-weight: 900; font-size: 14px; letter-spacing: 1px;
  padding: 12px 26px; border-radius: 99px;
  box-shadow: 0 4px 18px rgba(198,40,40,.45);
}
.mday-live-btn:active { transform: scale(.96); }