/* ==========================================================================
   Pickleball Japan 2026 Light（案C：ホワイトミニマル）
   main.css の上に読み込む差分。白ヘッダー・角丸・丸ボタン・細い罫で軽く見せる。
   ========================================================================== */

:root{
  --navy:#12203c; --navy2:#1b2c4d;
  --blue:#1d3faa; --blue2:#2c56d4;
  --gold:#1d3faa; --golda:#1d3faa;   /* 汎用部品の金は使わずブルーに寄せる */
  /* 躍動感のゴールド：濃色面とボール専用。白地の小さな文字・細線には使わない */
  --accent:#f7c832;
  --line:#e3e8f2; --off:#f8fafd;
  --ink:#12203c; --muted:#7c8aa5;
}

/* ---------- ヘッダー ---------- */
.hdr{background:#fff;color:var(--ink);border-bottom:1px solid var(--line)}
.brand small{color:#8592ad}
.gnav-list > li > a,.gnav-list > li > .gnav-trigger{color:var(--ink)}
.gnav-list > li:hover > a,.gnav-list > li:focus-within > a,
.gnav-list > li:hover > .gnav-trigger,.gnav-list > li:focus-within > .gnav-trigger,
.gnav-list > li.current-menu-item > a,.gnav-list > li.current-menu-ancestor > a,
.gnav-list > li.current-menu-item > .gnav-trigger,
.gnav-list > li > a[aria-current]{color:var(--blue);border-bottom-color:var(--blue)}
.gnav-list .sub-menu{background:#fff;border-top:2px solid var(--blue);
  box-shadow:0 16px 34px rgba(18,32,60,.12);border-radius:0 0 10px 10px}
.gnav-list .sub-menu li > a{color:var(--ink)}
.gnav-list .sub-menu li > a:hover{background:var(--off);color:var(--blue)}
.gnav-list .mega-panel{background:#fff;border-top:2px solid var(--blue);
  box-shadow:0 20px 44px rgba(18,32,60,.14)}
.mega-cat{color:var(--blue);border-bottom-color:var(--line)}
.mega-col li > a{color:var(--ink)}
.mega-col li > a:hover{color:var(--blue);background:var(--off)}
.lang{color:#8592ad}
.lang b{color:var(--ink)}
.btn-join{background:var(--navy-grad);color:#fff;border-radius:999px}
.btn-join:hover{background:var(--blue);color:#fff}
.burger span{background:var(--ink)}

/* ---------- ドロワー ---------- */
.drawer{background:#fff}
.drawer .sub{color:var(--muted)}
.drawer-list > li{border-bottom:1px solid var(--line)}
.drawer-list > li > a{color:var(--ink)}
.drawer-list li.drawer-lang b{color:var(--ink)} /* 1.25.0：main.css の #fff（紺背景用）のままだと白背景のメニューで現在の言語（JP/EN）が見えない */
.drawer-list .sub-menu{border-left-color:var(--blue)}
.drawer-list .sub-menu a{color:var(--muted)}
.drawer-list .acc{color:var(--ink)}
.drawer-list li.open > .acc{color:var(--blue)}

/* ---------- ヒーロー ---------- */
.hero{min-height:clamp(380px,56vh,540px)}
.hero::after{background:linear-gradient(100deg,rgba(18,32,60,.86) 4%,rgba(18,32,60,.55) 46%,rgba(18,32,60,0) 82%)}
.hero h1{font-weight:800;letter-spacing:0}
.hero h1 em{color:var(--accent)}
.eyebrow{color:var(--accent)}
.eyebrow::before{background:var(--accent)}
.btn{border-radius:999px}
/* 通常の背景（白）では塗りボタン、写真の上（ヒーロー）だけ白抜き */
.btn-p{background:var(--navy-grad);color:#fff}
.btn-p:hover{background:var(--blue);color:#fff}
.hero .btn-p{background:#fff;color:var(--ink)}
.hero .btn-p:hover{background:var(--blue);color:#fff}
.btn-o{border-color:var(--line);color:var(--ink)}
.hero .btn-o{border-color:rgba(255,255,255,.6);color:#fff}
.hero .btn-o:hover{background:#fff;color:var(--ink)}

/* ---------- セクション ---------- */
.sec-hd h2{font-weight:800;letter-spacing:-.015em}
.sec-hd .lbl{color:var(--blue)}
/* ラベルの線はラベル文字と同色にして一体で読ませる。ゴールドはボールに譲る */
.sec-hd .lbl::before{width:var(--ball-size,38px);height:2px;border-radius:999px;background:var(--blue)}
.sechead-line{background:var(--blue)}
.more{color:var(--blue);border-color:var(--blue)}

/* ---------- パーツ ---------- */
.tabs a,.tabs button{border-radius:999px}
.tabs a.on,.tabs button.on{background:var(--blue);border-color:var(--blue)}
.tag{border-radius:999px;padding:4px 10px}
/* 汎用の --gold はこのテーマでは青に寄せているため、募集系タグだけ本来のゴールド（--accent）に戻す */
.tag.t2{background:var(--accent);color:var(--navy)}
.tcard{border-radius:12px}
.tcard .ph{border-radius:12px 12px 0 0}
.tcard .badge{border-radius:999px;background:var(--off);color:var(--ink)}
.tcard .badge.open{background:var(--blue);color:#fff}
.tcard .badge.closed{background:var(--muted);color:#fff}
.tcard .badge.soon{background:#fff4d6;color:#7a5200;box-shadow:inset 0 0 0 1px #f0c860}
.tcard .badge.cd::before{background:var(--live)}
.tcard .badge.cd.live{background:var(--live);color:#fff}
.tcard .badge.cd.live::before{background:#fff}
.pcard{border-radius:12px}
.rank th{background:var(--navy-grad)}
.rank .no{color:var(--blue)}
.rank .no.m{color:var(--blue)}
.prose h2{border-left:0;padding-left:0;padding-bottom:10px;font-weight:700;
  border-bottom:1px solid var(--line)}
.prose li::before{background:var(--blue)}
.note{border-radius:14px}
.tbl th{background:var(--off)}
.pl{border-radius:12px}
.pl.mid{border-color:var(--blue)}
.pl.mid::before{background:var(--blue);border-radius:999px}
.fld input,.fld select,.fld textarea{border-radius:8px}
.pager .page-numbers{border-radius:999px}
.pager .page-numbers.current{background:var(--blue);border-color:var(--blue)}

/* ---------- 下層ページの見出し ---------- */
.phead{background:var(--off);color:var(--ink);border-bottom:1px solid var(--line)}
.phead::after{border-color:#dfe6f4}
.phead .lbl{color:var(--blue)}
.crumb{background:#fff}
.side h4{border-bottom-color:var(--blue)}

/* ---------- 選手ページ ---------- */
.phero{background:var(--navy-grad)}
.phero::after{border-color:rgba(255,255,255,.14)}
.pbadge{border-left-color:#9fc0ff}
.phero .lbl,.phero .sp-label{color:#9fc0ff}
.pbadge .pt2{color:#9fc0ff}

/* ---------- スポンサー ---------- */
.sptier--top{background:var(--navy-grad);border-radius:14px}
.sptier--top .sp-label span{color:#9fc0ff}
.sptier--top .splogo{border-radius:10px}
.sponsors-table .scell{border-color:var(--line)}
.sponsors-table .scell:nth-child(1),.sponsors-table .scell:nth-child(2){border-radius:12px 12px 0 0}
.sp-label{color:var(--blue)}
.sp-label::after{background:var(--blue)}
.splogo{border-radius:8px}

/* ---------- 帯・フッター ---------- */
.band{background:var(--off);color:var(--ink)}
.band p{color:var(--muted)}
.band .btn-p{background:var(--navy-grad);color:#fff}
.band .btn-o{border-color:var(--line);color:var(--ink)}
/* join-cta は濃色面（.hero と同じ扱い）のため、白抜きボタン＋本物のゴールドを使う */
.join-cta .btn-p{background:#fff;color:var(--navy)}
.join-cta .btn-p:hover{background:var(--blue);color:#fff}
.join-cta .btn-o{border-color:rgba(255,255,255,.55);color:#fff}
.join-cta .btn-o:hover{background:#fff;color:var(--navy);border-color:#fff}
.ftr{background:#fff;color:var(--muted);border-top:1px solid var(--line)}
.ftr h4{color:var(--ink)}
.ftr a{color:var(--muted)}
.ftr a:hover{color:var(--blue)}
.ftr .brand b{color:var(--ink)!important}
.ftr-bt{border-top-color:var(--line);color:var(--muted)}

/* ---------- ファーストビュー ---------- */
.fv{background:var(--navy-grad)}
.fv-slide{background:var(--navy2)}
.fv-slide .fv-copy h1 em{color:var(--accent)}
.fv-dots button.on{background:var(--accent)}
.fv-nav{background:rgba(18,32,60,.5)}
.fv-nav:hover{background:#fff;color:var(--ink)}

/* 9/16 統合版から復元：写真の上の白抜きボタン（連盟メインビジュアルの「大会を探す」等） */
.fv-copy .btn-o{border-color:rgba(255,255,255,.7);color:#fff}
.fv-copy .btn-o:hover{background:#fff;color:var(--ink)}

/* グローバルメニューのパネル（2026-09-23 統一）＝白基調 */
.gnav-list .gnav-panel{background:#fff;border-top:2px solid var(--blue);
  box-shadow:0 18px 40px rgba(16,32,64,.16)}
.gnav-cat{color:var(--blue);border-bottom-color:var(--line)}
.gnav-col li > a{color:var(--ink)}
.gnav-col li > a:hover{color:var(--blue)}
.drawer-list > li > .drawer-parent{color:var(--ink)}

/* ブログのカード（白基調） */
.bcard{background:#fff;border:1px solid var(--line);box-shadow:0 8px 22px rgba(16,32,64,.10)}
.bcard h3{color:var(--ink)}
.bcard p{color:var(--muted)}
.bcard-meta{color:var(--muted)}
.bcard-more{color:var(--blue)}

/* ==========================================================================
   v1.23.0（2026-09-25）＝ 9/24 石元さん打ち合わせの指摘を反映
   light.css の最後に置くのは、.hero .btn-p などの既存の上書きより後に効かせるため。
   ========================================================================== */

/* ---------- ヘッダー：団体名は Pickleball Japan の1行。ロゴを大きく ---------- */
.brand img{width:40px;height:40px}
.brand b{font-size:17px}
@media(max-width:640px){
  /* スマホ：ヘッダーを少し高くし、ロゴ・ログイン・メニューを押しやすい大きさに */
  :root{--hdr:68px}
  .brand{gap:8px}
  .brand img{width:42px;height:42px}
  .brand b{font-size:15px}
  .btn-join{padding:10px 16px;font-size:13px;min-height:40px;display:inline-flex;align-items:center}
  .burger{width:48px;height:48px}
  .burger span{width:26px}
}

/* ---------- 見出し帯の装飾の円：文字に重ならないようにする ---------- */
.phead .wrap,.phero .wrap{position:relative;z-index:1}
@media(max-width:640px){
  /* スマホは幅が足りず、どこに置いても見出しやリード文に重なるので出さない */
  .phead::after,.phero::after{display:none}
}

/* ---------- 余白：縦のマージン・パディングを詰めてスクロールを短く ---------- */
section{padding-block:clamp(36px,4.8vw,60px)}
.phead{padding-block:clamp(20px,2.8vw,36px)}
.phead p{margin-top:10px}

/* ---------- 大会ページ：タイトル左上、種別・会期・会場は右に横並び ---------- */
.ev-hero-in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 40px;align-items:end;
  padding-block:clamp(18px,2.6vw,32px)}
.ev-hero h1{font-size:clamp(22px,3vw,34px);margin:6px 0 2px;line-height:1.35}
.ev-hero-sub{color:#c9d8f2;font-size:14px}
.ev-hero-tags{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.ev-hero-tags .tag{padding:5px 12px}
.ev-hero-facts{display:flex;gap:10px 24px;flex-wrap:wrap;margin:12px 0 0}
.ev-hero-facts > div{border-left:3px solid #9fc0ff;padding-left:10px}
.ev-hero-facts dt{font-size:11px;font-weight:800;letter-spacing:.1em;color:#9fc0ff}
.ev-hero-facts dd{margin:0;font-size:16px;font-weight:800;line-height:1.3}
.ev-body{padding-top:clamp(20px,2.6vw,32px)}
@media(max-width:860px){
  /* 1fr だと長いタイトルの最小幅で列が広がり、右が切れる（360px幅で68px）ので minmax(0,1fr) */
  .ev-hero-in{grid-template-columns:minmax(0,1fr);align-items:start;gap:10px}
  .ev-hero-tags{justify-content:flex-start}
  .ev-hero-facts{margin-top:8px;gap:8px 18px}
  .ev-hero-facts dd{font-size:15px}
}

/* ---------- スポンサー（グランドスラム）：枠の余白を減らしてロゴを大きく ---------- */
.sptier--top{--gs-img-h:94px}
.sptier--top .splogo{padding:10px 14px;height:calc(var(--gs-img-h) + 20px)}
.sptier--top .splogo img{height:calc(var(--sp-h,60px) * 1.25)}
.sptier--top .splogo-pjf-zipair img{height:calc(var(--sp-h,66px) * 1.06 * 1.25)}
.sptier--top .splogo-pjf-mitsui img{height:calc(var(--sp-h,66px) * 1.143 * 1.25)}
.sptier--top .splogo-pjf-joola img{height:calc(var(--sp-h,66px) * 1.06 * 1.25)}
/* バーガーキングは丸いロゴで横幅が出ないぶん小さく見えるので、上限いっぱいまで */
.sptier--top .splogo-pjf-burgerking img{height:var(--gs-img-h)}
@media(max-width:640px){
  .sptier--top .splogo{padding:8px;height:auto;min-height:68px}
  .sptier--top .splogo img{max-height:52px}
}

/* ---------- 強調ボタン：エントリー・申込・登録・送信など「何かをする」ボタンはオレンジで統一 ---------- */
:root{--cta:#ff8a00;--cta-hover:#ffa133}
a.btn.btn-cta,button.btn.btn-cta,.hero a.btn.btn-cta,.prose a.btn.btn-cta{
  background:var(--cta);color:var(--navy);border:0;border-radius:999px;
  min-height:56px;padding:16px 36px;font-size:16px;justify-content:center;
  box-shadow:0 6px 16px rgba(255,138,0,.28)}
a.btn.btn-cta:hover,button.btn.btn-cta:hover,.hero a.btn.btn-cta:hover,.prose a.btn.btn-cta:hover{
  background:var(--cta-hover);color:var(--navy)}
.ftr26-btn.ftr26-btn--cta{background:var(--cta);border-color:var(--cta);color:var(--navy)!important}
.ftr26-btn.ftr26-btn--cta:hover,.ftr26-btn.ftr26-btn--cta:active{background:var(--cta-hover);border-color:var(--cta-hover);color:var(--navy)!important}
@media(max-width:640px){
  a.btn.btn-cta,button.btn.btn-cta,.hero a.btn.btn-cta,.prose a.btn.btn-cta{min-height:52px;padding:14px 20px;font-size:15px}
}

/* ---------- 日本代表：見出しに国旗 ---------- */
.phead--jp h1{display:inline-flex;align-items:center;gap:12px}
.phead--jp h1::before{content:"";flex:0 0 auto;margin-left:14px;position:relative;top:2px;width:1.35em;height:.9em;border:1px solid #d5dbe6;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 20'%3E%3Ccircle cx='15' cy='10' r='6' fill='%23bc002d'/%3E%3C/svg%3E") center/100% 100% no-repeat}

/* ---------- お知らせの絞り込み：スマホもプルダウンでなくタブ（2段に折り返す） ---------- */
@media(max-width:640px){
  .newsfilter .tabs{display:flex;gap:6px;margin-bottom:16px}
  .newsfilter .tabs a{padding:7px 11px;font-size:12px;min-width:44px;text-align:center}
  .newsfilter .selfilter{display:none}
}

/* ---------- 「大会一覧を見る」など一覧へのリンクを少し目立たせる ---------- */
.more{font-size:14px;padding-bottom:3px}
.more::after{content:" →"}

/* ==========================================================================
   v1.23.1（2026-09-25）＝ スポンサー欄をトップにも全社表示。ロゴの大きさは変えず、余白だけ詰める
   （トップと /sponsor/ は同じ pj2026_sponsors() なので両方に効く）
   ========================================================================== */
.sptier--top{padding-block:22px 24px;margin-bottom:14px}
.sptier--top .sp-group{margin-bottom:10px}
.sponsors-table{margin-top:14px}
.scell{padding:14px 12px}
.sp-label,.sponsors-table .scell .sp-label{min-height:0}
.sp-label::after{margin-top:6px}
.splogos{gap:12px 18px;padding:12px 0 2px}
@media(max-width:900px){
  .sponsors-table{margin-top:10px}
  .scell{padding:12px 8px}
  .sponsors-table .scell .sp-label{min-height:0}
  .sponsors-table .scell .sp-label::after{margin-top:6px}
  .sponsors-table .splogos{gap:10px;padding-top:8px}
}
@media(max-width:640px){
  .sptier--top{padding-block:16px 18px}
}

/* 年間スケジュール：「開催決定」は黄色、それ以外（開催予定・仮決定など）は青（2026-09-26） */
.c-state .tag.t2{background:var(--blue);color:#fff}
.c-state .tag.t2.st-fixed{background:var(--accent);color:var(--navy)}

/* お知らせ記事内の表・注意書きを角丸デザインに統一 */
.art .tbl{border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.art .tbl th,.art .tbl td{border:0;border-bottom:1px solid var(--line)}
.art .tbl th{border-right:1px solid var(--line)}
.art .tbl tr:last-child > th,.art .tbl tr:last-child > td{border-bottom:0}
.art .pj-notice{background:var(--blue4);border-radius:14px;padding:18px 22px;margin-bottom:26px;font-size:14px}
.art .pj-notice p{margin:0}
.art .pj-notice p + p{margin-top:8px}

/* フッターの公式SNSアイコン */
.ftr26-sns{display:flex;gap:10px;list-style:none;margin:18px 0 0;padding:0}
.ftr26-sns a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);color:#0b1f5c;background:#fff;transition:background .2s,color .2s,border-color .2s}
.ftr26-sns a:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.ftr26-sns svg{width:18px;height:18px}

/* トップのInstagram枠（管理者向けの場所表示） */
.pj-ig-ph{margin:0;padding:28px 24px;border:2px dashed var(--line);border-radius:14px;color:var(--muted);font-size:14px;text-align:center;background:transparent}
/* Instagram枠とスポンサー枠のあいだの余白 */
.pj-ig{padding-bottom:clamp(56px,7vw,96px)}
.pj-ig + section{padding-top:clamp(56px,7vw,96px)}
/* トピックス枠は背景を全面同じ薄いグレーにする（プラグインの表示枠も透過） */
.pj-ig{background:var(--off)}
.pj-ig #sb_instagram,.pj-ig #sbi_images,.pj-ig .sbi_item{background:transparent!important}


/* スマホ：手順カードの間隔を広げる（番号バッジが前のカードに重ならないように） */
@media(max-width:640px){.steps,.steps.steps-2,.steps.steps-3,.steps.steps-5{gap:32px;margin-top:40px}}
/* タブレット幅（2列）でも、番号バッジが上の段に重ならない間隔にする */
@media(max-width:860px) and (min-width:641px){.steps,.steps.steps-3,.steps.steps-5{row-gap:32px}}

/* スマホ：会員登録の帯は「見出し → 説明 → ボタン → チップ」の順にする（押してほしいボタンを先に見せる） */
@media(max-width:820px){
  .ftr26-join-in{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .ftr26-join-main{display:contents}
  .ftr26-join-main h2{order:1}
  .ftr26-join-lead{order:2}
  .ftr26-join-act{order:3;width:100%;margin-bottom:24px}
  .ftr26-join-list{order:4}
}
/* スマホ：会員登録の帯のチップ3つを、折り返さず一列に収める */
@media(max-width:820px){
  .ftr26-join-list{flex-wrap:nowrap;gap:clamp(6px,1.8vw,12px)}
  .ftr26-join-list li{flex:0 1 auto;min-width:0;white-space:nowrap;gap:clamp(4px,1.2vw,8px);padding:9px clamp(8px,2.6vw,16px);font-size:clamp(11px,3.3vw,14px)}
  .ftr26-join-list svg{width:clamp(13px,3.6vw,18px);height:clamp(13px,3.6vw,18px)}
}
/* スマホ：チップの左端・右端を、下の会員登録／ログインボタンの左右に揃える */
@media(max-width:820px){
  .ftr26-join-list{justify-content:space-between;width:100%}
}
/* スマホ：チップの枠・背景をなくし、アイコン＋テキストだけにする（ボタンに見えないように） */
@media(max-width:820px){
  .ftr26-join-list li{border:0;background:none;padding:4px 0;border-radius:0}
}
/* スマホ：チップ3つは左寄せ・一定間隔（20px）でひとまとまりに見せる */
@media(max-width:820px){
  .ftr26-join-list{justify-content:flex-start;gap:20px;width:auto}
}

/* 年間スケジュールの開催状況：開催中=赤（開催決定=黄・開催予定/仮決定=青は既存） */
.c-state .tag.t2.st-live{background:var(--live);color:#fff}

/* スマホだけ改行（.br-sp）／スマホでは消す読点（.only-pc） */
.br-sp{display:none}
@media(max-width:640px){.br-sp{display:inline}.only-pc{display:none}}

/* PCだけ改行（.br-pc）：.br-sp の逆。スマホでは display:none で消えるので、
   JSがtextContentで文言を読み取る場所（申込方法カード等）にも安全に使える */
.br-pc{display:none}
@media(min-width:641px){.br-pc{display:inline}}

/* コーディネーター資格／倫理ガイドライン対応状況／スポーツ仲裁条項 英語版：
   モバイルでタイトルが2行になるのを防ぐため、このページだけ .phead h1 のフォントサイズを少し絞る
   （2026-09-27、2026-09-28追加） */
@media(max-width:640px){
  .page-id-1365 .phead h1,
  .page-id-1395 .phead h1,
  .page-id-1397 .phead h1{font-size:clamp(19px,6vw,26px)}
}

/* 倫理ガイドライン対応状況／アンチ・ドーピング規定／スポーツ仲裁条項 英語版：
   「Download ... as a PDF (JP)」ボタンの文言が長く、モバイルで2行に折り返ると
   2行目の「(JP)」が左寄りになってしまうため、この3ページだけボタンの文字を中央寄せにする（2026-09-28） */
@media(max-width:640px){
  .page-id-1395 .btn,
  .page-id-1396 .btn,
  .page-id-1397 .btn{text-align:center}
}

/* スマホ：アイコン付きの注意書き（.note）は、アイコンの下に文章を置く（横幅を広く使う） */
@media(max-width:640px){
  .note-row{flex-direction:column;align-items:flex-start;gap:10px}
  .blog-post .note-ic{margin-top:0}
}

/* 日本代表：協賛表記は「項目：会社名」を同じ行に並べる（スマホでも横に会社名） */
.teamsp li{gap:4px 2px}
.teamsp-k{min-width:0}
@media(max-width:640px){.teamsp-k{min-width:0;flex-basis:auto}}

/* PC：会員登録の帯の3つ（大会エントリー／イベント申込／資格）も枠・背景をなくし、アイコン＋文字だけにする */
.ftr26-join-list{gap:10px 20px}
.ftr26-join-list li{border:0;background:none;padding:4px 0;border-radius:0}

/* 会員登録の帯：元のレイアウトに戻す。左に見出し＋ボタン、右に説明文（スマホは 見出し→説明→ボタン の縦並び） */
.ftr26-join-in{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:clamp(32px,6vw,96px);row-gap:20px;align-items:center}
.ftr26-join-main{display:contents}
.ftr26-join-main h2{grid-column:1;grid-row:1;margin:0}
.ftr26-join-act{grid-column:1;grid-row:2;justify-self:start}
.ftr26-join-txt{grid-column:2;grid-row:1 / span 2;margin:0;font-size:clamp(15px,1.5vw,18px);line-height:1.9;color:rgba(255,255,255,.92)}
@media(max-width:820px){
  .ftr26-join-in{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .ftr26-join-main h2{order:1;margin-bottom:10px}
  .ftr26-join-txt{order:2;margin-bottom:22px;font-size:15px}
  .ftr26-join-act{order:3;width:100%;justify-self:auto}
}

/* 会員登録の帯の説明：1文目を大きく強調し、残りは小さな補足にする */
.ftr26-join-txt{font-size:inherit;line-height:1.6}
.ftr26-join-cp{margin:0 0 10px;font-size:clamp(20px,2.2vw,26px);font-weight:800;line-height:1.5;color:#fff}
.ftr26-join-sub{margin:0;font-size:clamp(13px,1.2vw,14px);line-height:1.9;color:rgba(255,255,255,.75)}
@media(max-width:820px){
  .ftr26-join-cp{font-size:19px;margin-bottom:8px}
  .ftr26-join-sub{font-size:13px}
  .ftr26-join-txt{font-size:inherit}
}

/* PC：会員登録の帯のバランス。左＝見出し（小）＋キャッチ（大）＋補足、右＝ボタン2つ（読んだあとに押せる位置） */
@media(min-width:821px){
  .ftr26-join{padding-block:clamp(40px,4.4vw,56px)}
  /* 2026-09-29 下の白フッター（ロゴ〜「その他」列）と横幅・左右端を完全に揃える。
     テキストは白フッターのロゴと同じ左端、オレンジボタンは白フッター一番右列（その他/Others）と同じ右端に
     揃うよう、.wrap いっぱいに広げて両端に配置する（間の空きは中間に入る） */
  .ftr26-join-in{display:grid;grid-template-columns:auto auto;grid-template-rows:auto;column-gap:clamp(40px,6vw,96px);align-items:center;justify-content:space-between}
  .ftr26-join-main{display:block;grid-column:1;grid-row:1;min-width:0}
  .ftr26-join-main h2{grid-column:auto;grid-row:auto;margin:0 0 10px;font-size:15px;font-weight:700;letter-spacing:.12em;color:rgba(255,255,255,.7)}
  .ftr26-join-txt{grid-column:auto;grid-row:auto}
  .ftr26-join-cp{font-size:clamp(26px,2.6vw,32px);margin-bottom:12px}
  .ftr26-join-sub{font-size:15px;color:rgba(255,255,255,.8)}
  .ftr26-join-act{grid-column:2;grid-row:1;justify-self:end;align-self:center}
}

/* 会員登録の帯：3つの文字の大きさの関係をPC・スマホで揃える（小見出し＜補足＜キャッチ）
   PC  ：小見出し15px／補足15px／キャッチ26〜32px
   スマホ：小見出し14px／補足14px／キャッチ22px */
@media(max-width:820px){
  .ftr26-join-main h2{font-size:14px;font-weight:700;letter-spacing:.12em;color:rgba(255,255,255,.7);margin:0 0 8px}
  .ftr26-join-cp{font-size:22px;margin-bottom:10px}
  .ftr26-join-sub{font-size:14px;color:rgba(255,255,255,.8)}
}

/* スマホ：青い帯の上下の余白を同じにする（ボタン下の余分な余白をなくす） */
@media(max-width:820px){
  .ftr26-join{padding-block:40px}
  .ftr26-join-act{margin-bottom:0}
  .ftr26-join-main h2{line-height:1.4}
}

/* 会員登録の帯：小見出し20px／キャッチ30px／補足15px（スマホは 17／26／14）。小見出しは濃い白 */
.ftr26-join-main h2{color:#fff}
@media(min-width:821px){
  .ftr26-join-main h2{font-size:20px;font-weight:800;letter-spacing:.04em;margin-bottom:8px;color:#fff}
  .ftr26-join-cp{font-size:30px}
  .ftr26-join-sub{font-size:15px}
}
@media(max-width:820px){
  .ftr26-join-main h2{font-size:17px;font-weight:800;letter-spacing:.04em;color:#fff;margin-bottom:6px}
  .ftr26-join-cp{font-size:26px}
  .ftr26-join-sub{font-size:14px}
}

/* 会員登録の帯の文字を、ページの見出し（ページタイトル・本文の見出し）より控えめにする
   PC：小見出し17／キャッチ26／補足14　スマホ：小見出し15／キャッチ20／補足13 */
@media(min-width:821px){
  .ftr26-join-main h2{font-size:17px}
  .ftr26-join-cp{font-size:26px}
  .ftr26-join-sub{font-size:14px}
}
@media(max-width:820px){
  .ftr26-join-main h2{font-size:15px}
  .ftr26-join-cp{font-size:20px}
  .ftr26-join-sub{font-size:13px}
}
/* 注意書きの行（.note-row）に自動で入る <br> が、スマホの縦並びで1行分の空きになるのを防ぐ */
.note-row > br{display:none}

/* 拡大できる画像：保存されにくくする（長押しメニュー・ドラッグ・選択を無効化） */
.zoomable,.zoom-overlay img{-webkit-user-drag:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}

/* コートページの規格表（項目｜値の2列＋見出し行）：スマホでも2列のまま表示する */
.tbl--spec th,.tbl--spec td{display:table-cell!important;vertical-align:top;line-height:1.7;border:1px solid var(--line)}
.tbl--spec th{width:auto;text-align:left}
.tbl--spec td:first-child{width:40%;background:var(--off);font-weight:700}
@media(max-width:640px){.tbl--spec th,.tbl--spec td{padding:11px 12px;font-size:14px}}

/* 熱中症予防ページの3列表：「項目｜内容」の2列表向けの40%指定はここでは合わないため個別に上書き。
   ①暑さ指数（WBGT）表：1列目（温度）は数値だけなので幅を絞り、3列目（運用内容）に余裕を持たせる
   ②メディカルルール表：1列目（症状）を優先し、2〜3列目（重症度バッジ・点数）は幅を絞る */
.tbl--wbgt th:first-child,.tbl--wbgt td:first-child{width:110px}
/* デスクトップは1行に収まるよう少し広げる（モバイルは横スクロール枠内なので110pxのまま） */
@media(min-width:641px){.tbl--wbgt th:first-child,.tbl--wbgt td:first-child{width:150px}}
/* 見出し行（暑さ指数（WBGT）／指針レベル／運用内容）は中央合わせ */
.tbl--wbgt th{text-align:center}
/* auto layoutだと100px/80pxの指定は「最小幅」止まりで、表がwidth:100%まで広がる分は
   列にほぼ均等に再配分されてしまい、症状列が思ったほど広がらない。table-layout:fixedにして
   割合指定を厳密に守らせる（症状列を優先して広く、重症度・点数は必要最小限に） */
.tbl--severity{table-layout:fixed}
/* 別の表向けに後方で定義されている .tbl--spec tr th:first-child{width:8.5em} 等の方が
   詳細度が高く上書きされてしまうため、!importantで確実にこちらを勝たせる */
.tbl--severity th:first-child,.tbl--severity td:first-child{width:64%!important}
.tbl--severity th:nth-child(2),.tbl--severity td:nth-child(2){width:22%!important}
.tbl--severity th:nth-child(3),.tbl--severity td:nth-child(3){width:14%!important;white-space:nowrap}
/* 見出し行（症状／重症度／点数）は中央合わせ */
.tbl--severity th{text-align:center}

/* コートページ「他競技のコートとの比較」：スマホは 名前＋サイズを1行、その下にバー の2段にして、途中で折り返さない */
@media(max-width:640px){
  .size-compare-row{grid-template-columns:1fr auto;grid-template-rows:auto auto;row-gap:6px;column-gap:10px;margin-bottom:16px}
  .size-compare-label{grid-column:1;grid-row:1;font-size:13px;white-space:nowrap}
  .size-compare-value{grid-column:2;grid-row:1;font-size:13px;white-space:nowrap}
  .size-compare-track{grid-column:1 / -1;grid-row:2}
}
/* リンクカードの一覧（.linkgrid）：自動で入る <br> が空のマスになって、カードの間が広がるのを防ぐ */
.linkgrid > br{display:none}

/* 表（項目｜内容）の見出し行付き：th の列幅もそろえる */
.tbl--spec tr th:first-child{width:auto}
.tbl--spec tr:first-child th{background:var(--blue4)}

/* スマホ：コーディネーター資格などの表 */
@media(max-width:640px){
  /* コース表：横スクロールにせず、画面幅に収める */
  .tbl-scroll .tbl.tbl--matrix:not(.tbl--3){min-width:0;table-layout:fixed}
  .tbl--matrix:not(.tbl--3) colgroup col:first-child{width:5.5em!important}
  .tbl--matrix:not(.tbl--3) th,.tbl--matrix:not(.tbl--3) td{padding:10px;font-size:13px}
  .tbl--matrix:not(.tbl--3) thead th:first-child,.tbl--matrix:not(.tbl--3) tbody th{width:5.5em!important;white-space:normal}
}

/* 3つの申込方法：項目ごとに ①②③ を縦に並べたカードにする。
   表自体は min-width:720px（+左右の余白）が必要なため、640pxまでではなく
   .apply-cards に切り替わる幅と揃えて800pxまでを対象にする（641〜747px幅だと
   表がカード化もされず画面からはみ出していた実機バグの修正。英語版は文言が長く
   より顕著に発生していたが、日本語版でも同じ幅では起きていた） */
@media(max-width:800px){
  .tbl-scroll:has(.tbl--3){overflow:visible}
  .tbl--matrix.tbl--3{min-width:0;display:block;border:0}
  .tbl--matrix.tbl--3 colgroup,.tbl--matrix.tbl--3 thead{display:none}
  .tbl--matrix.tbl--3 tbody{display:block}
  .tbl--matrix.tbl--3 tr{display:block;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:14px}
  .tbl--matrix.tbl--3 tbody th{display:block!important;width:auto!important;background:var(--blue4);border:0;padding:10px 14px;white-space:normal}
  .tbl--matrix.tbl--3 td{display:block!important;border:0;border-top:1px solid var(--line);padding:10px 14px}
  .tbl--matrix.tbl--3 td::before{display:block;font-size:12px;font-weight:800;color:var(--blue);margin-bottom:2px}
  .tbl--matrix.tbl--3 td:nth-of-type(1)::before{content:"① 日程が決まっている資格"}
  .tbl--matrix.tbl--3 td:nth-of-type(2)::before{content:"② 個人で受講を希望"}
  .tbl--matrix.tbl--3 td:nth-of-type(3)::before{content:"③ 団体・企業で開催を希望"}
}

/* 表の左の項目欄（th）の幅：全体の32%だと短い項目名でも広すぎたので、文字数に合わせた幅にする */
.tbl th{width:8.5em}
.tbl--spec tr th:first-child{width:8.5em}
@media(max-width:640px){.tbl th,.tbl--spec tr th:first-child{width:6.5em}}
.tbl--spec tr th:not(:first-child){width:auto}

/* スマホ：3つの申込方法カード。①②③のタイトルを大きく、内容との間を少し広げる
   （表がカード化される幅を800pxまでに広げたのに合わせて、こちらも揃える） */
@media(max-width:800px){
  .tbl--matrix.tbl--3 td::before{font-size:15px;margin-bottom:6px;line-height:1.5}
  .tbl--matrix.tbl--3 td{padding:14px}
  .tbl--matrix.tbl--3 tbody th{font-size:15px;padding:12px 14px}
}

/* PC：3つの申込方法の見出し（①②③と名前）を少し大きく */
@media(min-width:801px){
  .tbl--3 .tbl-mark{font-size:20px;line-height:1.3;margin-bottom:4px}
  .tbl--3 thead th{font-size:15px}
}

/* スマホ：3つの申込方法は ①→②→③ のカード（JSで表から生成）。PCは表のまま */
.apply-cards{display:none}
@media(max-width:800px){
  .tbl-scroll.has-cards{display:none}
  .apply-cards{display:block}
  .apply-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:16px;background:#fff}
  .apply-card-hd{background:var(--blue4);padding:14px;font-size:16px;font-weight:800;color:var(--ink);line-height:1.5}
  .apply-card-hd .tbl-mark{display:inline-block;font-size:20px;margin:0 8px 0 0;vertical-align:-1px}
  .apply-card-row{padding:12px 14px;border-top:1px solid var(--line)}
  .apply-card-k{font-size:13px;font-weight:800;color:var(--blue);margin-bottom:3px}
  .apply-card-v{font-size:14px;line-height:1.75}
  .apply-card-v:has(.btn){text-align:center!important}
  .apply-card-v .btn{margin-top:10px;margin-bottom:4px}
}

/* スマホ：公認コート一覧。施設名を1行まるごと使い、その下に 所在地・面数・ランク・公式サイト を並べる */
@media(max-width:640px){
  .tbl--courts,.tbl--courts tbody{display:block;border:0}
  .tbl--courts tr:first-child{display:none}
  .tbl--courts tr{display:block;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:12px;background:#fff}
  .tbl--courts td{display:block!important;border:0;padding:0;background:none;width:auto}
  .tbl--courts td:first-child{width:auto;background:none;font-size:15px;font-weight:800;line-height:1.5;margin-bottom:6px;padding:0}
  .tbl--courts td:empty{display:none!important}
  .tbl--courts td:not(:first-child){font-size:13px;line-height:1.7;color:var(--ink)}
  .tbl--courts td:not(:first-child)::before{display:inline-block;min-width:5.5em;font-weight:700;color:var(--muted)}
  .tbl--courts td:nth-child(2)::before{content:"所在地"}
  .tbl--courts td:nth-child(3)::before{content:"面数"}
  .tbl--courts td:nth-child(4)::before{content:"ランク"}
}
@media(max-width:640px){
  .tbl.tbl--courts td{border:0!important;padding:0!important;background:none!important;width:auto!important}
  .tbl.tbl--courts td:first-child{margin-bottom:6px}
}

/* スマホ：項目｜内容の表は、縦積みにせず左右2列のまま表示する
   （縦積みだと、項目欄(th)だけが細いグレーの帯になって見えた） */
@media(max-width:640px){
  .tbl th,.tbl td{display:table-cell;border-bottom:1px solid var(--line);padding:11px 12px}
  .tbl th{width:6.5em;border-bottom:1px solid var(--line);word-break:auto-phrase;overflow-wrap:break-word} /* 文節の切れ目（BudouX／対応ブラウザは auto-phrase）でだけ折り返す。6.5em に収まらない文節がある表だけ、その文節の幅まで見出し列が広がる（1.24.1） */
  .tbl th budoux-ja{display:block;max-width:7.5em;overflow-wrap:break-word!important} /* BudouX が付ける anywhere を打ち消し、文節ごとに折り返す。見出し列は最大7.5em（約7文字）まで広がり、それを超える文節だけ途中で折る */
  .tbl-scroll .tbl th budoux-ja{max-width:none} /* 横スクロールの表は幅に余裕があるので上限をかけない */
  .tbl--spec td:first-child budoux-ja{display:block;overflow-wrap:break-word!important} /* 項目名の列も文節で折り返す（例：キッチン（／ノンボレーゾーン）） */
  .tbl td{overflow-wrap:anywhere} /* メールアドレス・URL など切れ目の無い英数字が、狭い画面で表を押し広げないように */
  .art .tbl th,.art .tbl td{border:0;border-bottom:1px solid var(--line)}
  .art .tbl tr:last-child > th,.art .tbl tr:last-child > td{border-bottom:0}
}

/* 公認コート一覧：ロゴを上、施設名を下に改行して表示（ルスツはYouTubeアイコンを名前の横に小さく併記） */
.ctname{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.ctlogo{margin-bottom:0!important}
.ctlogo{height:40px;width:96px;flex:0 0 auto;object-fit:contain;object-position:left center}
.ctline{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:15px;color:var(--ink)}
.ctyt{display:inline-flex;flex:0 0 auto}
.ctyt img{height:16px;width:auto}
@media(max-width:640px){.ctlogo{height:32px;width:80px}.ctline{font-size:15px}}

/* 公認コート一覧：所在地と公式サイトは同じ欄の中で上下に並べ、住所は控えめな地の文、
   公式サイトは矢印付きの小さなリンクにする（PC・スマホ共通。ラベルの繰り返しはやめる） */
.tbl--courts td:nth-child(2)::before{content:none}
.ctaddr{display:block;color:var(--muted);font-size:13px}
.ctsite{display:block;margin-top:8px}
.ctsite a{font-size:13px;font-weight:700}
.ctsite a::after{content:" →"}
@media(max-width:640px){
  .ctname{gap:4px}
  .ctlogo{height:32px;width:80px}
}

/* 公認コート一覧：「面数」「ランク」は今どの施設も未入力なので、列ごと非表示にして
   施設名・所在地・公式サイトの幅を広げる（値が入った施設が1つでもあれば自動的に列が戻る） */
.tbl--courts:not(:has(td:nth-child(3):not(:empty))) th:nth-child(3),
.tbl--courts:not(:has(td:nth-child(3):not(:empty))) td:nth-child(3),
.tbl--courts:not(:has(td:nth-child(4):not(:empty))) th:nth-child(4),
.tbl--courts:not(:has(td:nth-child(4):not(:empty))) td:nth-child(4){display:none!important}

/* 公認コート一覧：施設名の列の幅を広げる（長い施設名が1行に収まる程度） */
@media(min-width:641px){
  .tbl--spec.tbl--courts th:first-child,
  .tbl--spec.tbl--courts td:first-child{width:380px;min-width:380px}
}

/* ブログ一覧：「最新記事」チップが紺のカード背景に馴染んで見えにくいため、白地に紺文字に変更（2026-09-28） */
.bcard-badge{background:#fff;color:var(--navy)}

/* ブログ一覧：スマホでは見出しカード（.bcard--big）が縦積みになり幅が狭まるため、
   写真代わりのボールアイコンが大きすぎる。通常カードと同じ56pxに揃える（2026-09-28） */
@media(max-width:640px){
  .bcard--big .bcard-ph svg,
  .bcard--big .bcard-ph img{width:56px;height:56px}
}

/* ---------- 1.25.11 トップの大会カード：横に送るレール（自動では回さない）
   PC 3枚・タブレット 2枚・スマホ 1枚＋次のカードの端を見せる。
   はみ出しが無い時（PCで3件以下など）は矢印を出さない（js/site.js が hidden を外す）。 */
.trail{position:relative}
.tgrid.tgrid--rail{display:flex;gap:clamp(16px,2vw,26px);overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  /* カードのホバー（上に4px＋影）が切れないよう上下に逃げを取る */
  padding:6px 2px 26px;margin:-6px -2px -26px}
.tgrid.tgrid--rail::-webkit-scrollbar{display:none}
.tgrid--rail>.tcard{flex:0 0 calc((100% - 2 * clamp(16px,2vw,26px)) / 3);scroll-snap-align:start;min-width:0}
.trail-nav{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}
.trail-nav[hidden]{display:none}
.trail-btn{width:44px;height:44px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--blue);
  font-size:18px;font-weight:800;line-height:1;cursor:pointer;transition:.2s}
.trail-btn:hover:not(:disabled){background:var(--blue);border-color:var(--blue);color:#fff}
.trail-btn:disabled{opacity:.35;cursor:default}
.trail-btn:focus-visible{outline:2px solid var(--blue2);outline-offset:2px}
@media(max-width:860px){
  .tgrid--rail>.tcard{flex-basis:calc((100% - clamp(16px,2vw,26px)) / 2)}
}
@media(max-width:640px){
  .tgrid--rail>.tcard{flex-basis:86%}
  .tgrid--rail>.tcard:only-child{flex-basis:100%} /* 1件だけの時は従来どおり全幅 */
  .tgrid.tgrid--rail{scroll-padding-inline:2px}
}

/* ---------- 1.25.13 大会ページ：エントリーへの導線（見出し帯・右カラム上）
   エントリーボタンはサイト共通のオレンジ（btn-cta）。ここでは大きさだけ詰める。
   1.25.14：右カラムの箱（.ev-side-cta）は外した。導線は見出し帯と本文末の2か所。 */
.ev-badge{display:inline-flex;align-items:center;font-size:12px;font-weight:800;padding:5px 12px;border-radius:999px;
  letter-spacing:.02em;line-height:1.3;background:var(--off);color:var(--ink)}
.ev-badge.open{background:var(--blue);color:#fff}
.ev-hero-cta .ev-badge.open{box-shadow:inset 0 0 0 1px rgba(255,255,255,.55)} /* 紺の帯の上で青が沈まないよう白い縁 */
.ev-badge.closed{background:var(--muted);color:#fff}
.ev-badge.soon{background:#fff4d6;color:#7a5200;box-shadow:inset 0 0 0 1px #f0c860}
.ev-hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin-top:14px}
.ev-hero-cta a.btn.btn-cta{min-height:44px;padding:10px 26px;font-size:14px;box-shadow:none}
.ev-hero-cta a.btn.ev-btn-pdf{min-height:44px;padding:10px 22px;font-size:14px;font-weight:800;justify-content:center;
  background:transparent;border:1px solid rgba(255,255,255,.6);color:#fff}
.ev-hero-cta a.btn.ev-btn-pdf:hover{background:#fff;color:var(--navy)}
@media(max-width:640px){
  /* スマホ：受付状況を1行目、ボタン2つを2行目に横並び */
  .ev-hero-cta .ev-badge{flex:0 0 auto;max-width:100%}
  .ev-hero-cta.has-badge::after{content:"";flex:0 0 100%;order:1}
  .ev-hero-cta a.btn{order:2;flex:1 1 0;padding-inline:12px}
}