/*
Theme Name: 西野流呼吸法 公認教室
Theme URI: https://nishinobreathingmethod-official.com/
Description: 公認教室ページ用の Lightning 子テーマ。静的サイト（2026年版）の意匠をそのまま移植したもの。親テーマ Lightning を更新しても、このフォルダの中身は消えません。
Author: 西野流呼吸法 総本部
Template: lightning
Version: 2.17.1
Text Domain: nishino-kyoshitsu
*/

/* =========================================================
   1. 色と書体（★色ここから★ にあたる部分）
   静的サイト koninn-dantai/index-aqua-fuji-koubai.html と同じ値
   ここを差し替えるだけで教室ごとの色を変えられる
   ========================================================= */
:root{
  --paper:#F2F8FB;
  --ivory:#ffffff;
  --sumi:#21303A;
  --ink-soft:#5F7682;
  --border:#DDEBF0;
  --border-strong:#BCD6E0;
  --crail:#4FA3C9;
  --crail-deep:#2A7BA0;
  --moss:#8583CB;
  --sky:#8FC6E0;
  --rose:#D5004F;
  --mist:#E4F2F7;
  --nk-serif:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Times New Roman",serif;
  --nk-sans:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic","YuGothic","Helvetica Neue",Arial,sans-serif;
}

/* =========================================================
   2. 全体の地色と本文
   ========================================================= */
body{
  background:var(--paper);
  color:var(--sumi);
  font-family:var(--nk-serif);
  line-height:1.95;
  letter-spacing:.02em;
}
.entry-body p{line-height:1.95}

/* =========================================================
   3. セクション見出し
   ========================================================= */
.nk-section-head{margin:0 0 40px}
.nk-section-head .nk-eyebrow{
  font-family:var(--nk-sans);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--crail-deep);
  margin:0 0 10px;
  display:flex;
  align-items:center;
  gap:12px;
}
.nk-section-head .nk-eyebrow::before{
  content:"";width:42px;height:1px;background:var(--border-strong);flex:none;
}
.nk-section-head h2{
  font-size:clamp(24px,3.2vw,34px);
  line-height:1.35;
  font-weight:600;
  letter-spacing:0;
  margin:0;
  border:none;
  padding:0;
  background:none;
}

/* =========================================================
   4. 日程カード（1か月分）
   ========================================================= */
.month-card{
  background:var(--ivory);
  border:1px solid var(--border);
  border-radius:14px;
  padding:30px 32px;
  box-shadow:0 24px 60px rgba(36,48,48,.07);
  margin-bottom:20px;
}
.month-card h3{
  margin:0 0 6px;
  font-size:21px;
  font-weight:600;
  border:none;padding:0;background:none;
}
.month-card .month-sub{
  font-family:var(--nk-sans);
  font-size:12px;
  letter-spacing:.1em;
  color:var(--ink-soft);
  margin:0 0 18px;
}
.month-card .schedule-list{display:flex;flex-direction:column;gap:12px}
.month-card .schedule-day{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:var(--paper);
  border:1px solid var(--border);
  border-radius:8px;
  padding:16px 22px;
  margin:0;
}
.month-card .schedule-day p{margin:0}
.month-card .schedule-day .date{font-size:19px;font-weight:600;line-height:1.5}
.month-card .schedule-day .place{
  font-family:var(--nk-sans);
  font-size:13px;
  color:var(--crail-deep);
  border:1px solid rgba(79,163,201,.4);
  border-radius:999px;
  padding:5px 14px;
  white-space:nowrap;
}
.month-card .schedule-time{
  margin:16px 0 0;
  font-family:var(--nk-sans);
  font-size:13px;
  color:var(--ink-soft);
  letter-spacing:.06em;
}
.month-card .month-image{
  margin-top:18px;
  border-radius:8px;
  overflow:hidden;
  border:1px solid var(--border);
  background:#fff;
  text-align:center;
  padding:10px;
}
.month-card .month-image img{display:block;max-width:280px;width:100%;height:auto;margin:0 auto}

/* =========================================================
   5. 写真パネル（キャプション入り）
   ========================================================= */
.photo-panel{
  position:relative;
  overflow:hidden;
  border-radius:18px;
  border:1px solid var(--border);
  background:var(--ivory);
  margin:0 0 20px;
}
.photo-panel figure{margin:0}
.photo-panel img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  filter:saturate(.86) contrast(.96) brightness(1.02);
}
.photo-panel::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(36,48,48,0) 44%,rgba(36,48,48,.52));
  pointer-events:none;
}
.photo-panel .photo-caption{
  position:absolute;
  left:24px;right:24px;bottom:20px;
  color:#fff;
  z-index:1;
  margin:0;
  font-size:21px;
  font-weight:500;
  line-height:1.45;
  text-shadow:0 1px 6px rgba(0,0,0,.35);
}

/* =========================================================
   6. 動画
   ========================================================= */
.nk-video{
  border-radius:14px;
  overflow:hidden;
  border:1px solid var(--border);
  background:#000;
  margin:0 0 20px;
}
.nk-video figcaption{
  background:var(--ivory);
  color:var(--ink-soft);
  font-family:var(--nk-sans);
  font-size:13px;
  padding:12px 16px;
  text-align:left;
}

/* =========================================================
   7. 急なお知らせ
   台風・休講など、急いで出したいときに使う目立つ枠
   ========================================================= */
.nk-notice{
  background:#FFF6F8;
  border:1px solid rgba(213,0,79,.28);
  border-left:6px solid var(--rose);
  border-radius:10px;
  padding:24px 28px;
  margin:0 0 32px;
  box-shadow:0 12px 32px rgba(213,0,79,.08);
}
.nk-notice .nk-notice-label{
  display:inline-block;
  font-family:var(--nk-sans);
  font-size:11px;
  letter-spacing:.18em;
  color:#fff;
  background:var(--rose);
  border-radius:999px;
  padding:4px 14px;
  margin:0 0 12px;
}
.nk-notice h3{
  margin:0 0 10px;
  font-size:21px;
  line-height:1.5;
  font-weight:600;
  color:var(--sumi);
  border:none;padding:0;background:none;
}
.nk-notice p{margin:0 0 8px}
.nk-notice .nk-notice-date{
  margin:12px 0 0;
  font-family:var(--nk-sans);
  font-size:12px;
  color:var(--ink-soft);
  letter-spacing:.08em;
}

/* =========================================================
   8. スマホ
   ========================================================= */
@media (max-width:600px){
  .month-card{padding:22px 18px}
  .month-card .schedule-day{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    padding:14px 16px;
  }
  .photo-panel .photo-caption{left:16px;right:16px;bottom:14px;font-size:17px}
  .nk-notice{padding:20px 18px}
}

/* =========================================================
   9. ヒーロー（2026-09-04 追加）
   静的サイト koninn-dantai/index-aqua-fuji-koubai.html の .hero を移植。
   WordPress の「カバーブロック」に載せているので、写真の差し替えは
   写真をクリック → 置換 でできる。
   ========================================================= */

/* Lightning の本文の枠をはみ出して全幅にする（1カラム設定でなくても効く） */
.nk-hero{
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  min-height:min(78vh,720px);
  overflow:hidden;
  background:linear-gradient(135deg,#1C404F 0%,#3D87A3 52%,#9AD0DC 100%);
  padding:clamp(64px,10vh,120px) clamp(20px,5vw,64px);
}
/* 写真の上にかける三重の幕（左側を濃くして白文字を読めるようにする） */
.nk-hero .wp-block-cover__background,
.nk-hero::before{
  content:"";
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(242,248,251,0) 80%,rgba(242,248,251,.42) 93%,#F2F8FB 100%),
    linear-gradient(90deg,rgba(15,42,55,.72) 0%,rgba(20,55,72,.50) 54%,rgba(26,64,82,.12) 90%),
    linear-gradient(180deg,rgba(14,38,50,.20) 0%,rgba(14,38,50,.30) 38%,rgba(14,38,50,.54) 100%);
  opacity:1;
}
.nk-hero .wp-block-cover__image-background{
  object-position:center 42%;
  filter:saturate(.92) contrast(1.04);
  transform:scale(1.06);
}
.nk-hero .wp-block-cover__inner-container{
  position:relative;z-index:5;
  max-width:900px;
  margin-right:auto;margin-left:0;
  text-align:left;
}
/* 上の小さな白文字 */
.nk-hero .nk-hero-eyebrow{
  font-family:var(--nk-sans);font-size:11.5px;font-weight:600;
  letter-spacing:.32em;text-transform:uppercase;color:#fff;
  display:inline-flex;align-items:center;gap:14px;
  margin:0 0 4px;
  filter:drop-shadow(0 1px 5px rgba(8,20,28,.55));
}
.nk-hero .nk-hero-eyebrow::before{content:"";width:42px;height:1px;background:rgba(255,255,255,.7)}
/* 教室名のピル */
.nk-hero .nk-hero-name{
  display:inline-block;margin:0 0 6px;
  font-family:var(--nk-sans);font-size:13px;font-weight:600;letter-spacing:.14em;
  color:#fff;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.4);border-radius:999px;
  padding:8px 18px;backdrop-filter:blur(8px);
}
.nk-hero h1{
  font-size:clamp(34px,6vw,72px);line-height:1.2;font-weight:700;letter-spacing:0;
  margin:20px 0 24px;color:#fff;
  text-shadow:0 2px 6px rgba(8,20,28,.62),0 5px 20px rgba(8,20,28,.5),0 18px 46px rgba(0,0,0,.34);
  border:none;padding:0;background:none;
}
.nk-hero h1 em{
  color:#EAF7F5;font-style:italic;font-weight:500;
  text-shadow:0 2px 8px rgba(8,20,28,.55),0 0 34px rgba(221,242,240,.28);
}
.nk-hero .nk-hero-lead{
  font-size:clamp(15px,1.4vw,20px);line-height:1.95;color:rgba(255,255,255,.92);
  max-width:480px;margin:0 0 36px;
  text-shadow:0 2px 10px rgba(0,0,0,.55),0 10px 30px rgba(0,0,0,.35);
}
/* ボタン2つ */
.nk-hero .wp-block-buttons{gap:14px}
.entry-body .nk-hero .wp-block-button__link{
  font-family:var(--nk-sans);font-weight:600;font-size:14px;letter-spacing:.04em;
  padding:13px 26px;border-radius:999px;border:1px solid transparent;
  transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.nk-hero .nk-btn-primary .wp-block-button__link{
  background:#fff;color:var(--sumi);box-shadow:0 22px 62px rgba(0,0,0,.24);
}
.nk-hero .nk-btn-primary .wp-block-button__link:hover{transform:translateY(-2px)}
.nk-hero .nk-btn-ghost .wp-block-button__link{
  background:rgba(255,255,255,.18);color:#fff;
  border-color:rgba(255,255,255,.58);backdrop-filter:blur(8px);
}
.nk-hero .nk-btn-ghost .wp-block-button__link:hover{background:rgba(255,255,255,.28);border-color:#fff}

/* =========================================================
   10. 写真3枚を横に並べる（2026-09-04 追加）
   静的サイトの .photo-grid と同じ。スマホでは自動で縦に積む。
   ========================================================= */
.nk-photo-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  align-items:stretch;
  margin:0 0 20px;
}
.nk-photo-grid > .wp-block-column{flex-basis:auto !important;min-width:0}
.nk-photo-grid .photo-panel{margin:0;height:100%;min-height:360px}
.nk-photo-grid .photo-panel figure,
.nk-photo-grid .photo-panel img{height:100%}
.nk-photo-grid .photo-panel img{object-fit:cover}
@media (max-width:782px){
  .nk-photo-grid{grid-template-columns:1fr}
  .nk-photo-grid .photo-panel{min-height:240px}
}

/* =========================================================
   11. 1カラム化（2026-09-04）
   Lightning の既定は2カラムで、右にウィジェット欄が空いたまま残る。
   教室ページは1カラムが正しいので、本文を横いっぱいに広げ、空の欄を消す。
   （カスタマイザーの画面が重く操作できなかったため、子テーマ側で指定している。
     元に戻したいときは、このブロックを消せば2カラムに戻る）
   ========================================================= */
.main-section--col--two{
  width:100%;
  max-width:100%;
  flex:0 0 100%;
}
.sub-section--col--two{display:none}
.site-body-container.container{max-width:1200px}
/* 本文が広がりすぎないように */
.entry-body{max-width:1120px;margin-left:auto;margin-right:auto}
/* ヒーローだけは本文の枠を無視して画面いっぱいに */
.entry-body > .nk-hero{max-width:100vw}

/* =========================================================
   12. WordPress のレイアウト機能に負けないための上書き（2026-09-04）
   WP は「constrained（幅を揃える）」レイアウトの子要素すべてに
   margin-left/right:auto を強制的に付ける。そのままだと
   ヒーローの文章が中央に寄ってしまうため、ここで打ち消す。
   ヒーローの全幅も、テーマ側の max-width:100% に勝つ必要がある。
   ========================================================= */
.entry-body .nk-hero,
.entry-body .nk-hero.alignfull{
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
}
/* ヒーローの中身は左そろえ（WPの自動中央寄せを打ち消す） */
.nk-hero .wp-block-cover__inner-container > *{
  margin-left:0 !important;
  margin-right:0 !important;
}
.nk-hero .wp-block-cover__inner-container{
  margin-left:0 !important;
  max-width:900px !important;
}
/* 写真3枚よこ並びも、WPのカラム幅計算に勝たせる */
.entry-body .nk-photo-grid{display:grid !important}
.entry-body .nk-photo-grid > .wp-block-column{margin:0 !important}

/* =========================================================
   13. 動画をよこ並びに（2026-09-04）
   ========================================================= */
.nk-video-grid{display:grid !important;grid-template-columns:repeat(2,1fr);gap:20px;margin:0 0 20px}
.nk-video-grid > .wp-block-column{margin:0 !important;min-width:0}
.nk-video-grid .nk-video{margin:0;height:100%}
@media (max-width:782px){.nk-video-grid{grid-template-columns:1fr}}

/* =========================================================
   14. 受講料
   ========================================================= */
.nk-price-grid{display:grid !important;grid-template-columns:repeat(3,1fr);gap:24px;margin:0 0 28px}
/* カードが2枚・1枚の教室は、その枚数で均等に割る（2026-09-19 v2.14.1・南房総の指摘） */
.nk-price-grid:has(> .wp-block-column:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
.nk-price-grid:has(> .wp-block-column:first-child:last-child){grid-template-columns:1fr;max-width:420px}
.nk-price-grid > .wp-block-column{margin:0 !important;min-width:0}
.nk-price-card{
  background:var(--paper);border:1px solid var(--border);border-radius:14px;
  padding:34px 28px;text-align:center;height:100%;margin:0;
}
.nk-price-card.is-feature{background:linear-gradient(180deg,rgba(221,242,240,.7),#fff);border-color:rgba(79,163,201,.4)}
.nk-price-card .nk-ptag{
  font-family:var(--nk-sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--crail-deep);margin:0 0 6px;
}
.nk-price-card .nk-price{font-size:38px;font-weight:600;line-height:1.2;margin:6px 0}
.nk-price-card .nk-price small{font-size:15px;font-weight:500;color:var(--ink-soft)}
/* 「参加12回目は無料」= 無料を主役に（2026-09-20 v2.17.0・三河安城の指摘。旧静的サイトと同じ見せ方） */
.nk-price-card .nk-price .nk-pre{font-size:22px;font-weight:600;margin-right:4px;vertical-align:baseline}
.nk-price-card .nk-price strong{font-size:1.2em;font-weight:700;color:var(--crail-deep)}
.nk-price-bonus strong{color:var(--crail-deep)}
.nk-price-card .nk-price-note{margin:0;font-size:13.5px;color:var(--ink-soft)}
.nk-price-bonus{
  margin:0 auto 20px;max-width:560px;text-align:center;
  background:var(--mist);border:1px dashed var(--crail);border-radius:12px;
  padding:18px 24px;font-size:15px;
}
@media (max-width:782px){.nk-price-grid{grid-template-columns:1fr}}

/* =========================================================
   15. よくある質問
   ========================================================= */
.nk-qa-grid{display:grid !important;grid-template-columns:1fr 1fr;gap:24px;margin:0 0 20px}
.nk-qa-grid > .wp-block-column{margin:0 !important;min-width:0}
.nk-qa-card{
  background:var(--ivory);border:1px solid var(--border);border-radius:8px;
  padding:30px 32px;height:100%;margin:0;
}
.nk-qa-card h3{
  font-size:18px;line-height:1.55;margin:0 0 12px;font-weight:600;
  border:none;padding:0;background:none;
}
.nk-qa-card h3::before{content:"Q. ";color:var(--crail-deep);font-style:italic}
.nk-qa-card p{font-size:14.5px;line-height:1.9;color:var(--ink-soft);margin:0}
@media (max-width:782px){.nk-qa-grid{grid-template-columns:1fr}}

/* =========================================================
   16. 指導者のご挨拶
   ========================================================= */
.nk-greeting{display:grid !important;grid-template-columns:.36fr 1fr;gap:48px;align-items:start;margin:0 0 20px}
.nk-greeting > .wp-block-column{margin:0 !important;min-width:0}
.nk-greeting .nk-portrait figure{margin:0}
.nk-greeting .nk-portrait img{
  width:100%;aspect-ratio:3/4;object-fit:cover;
  border-radius:18px;border:1px solid var(--border);background:var(--mist);display:block;
}
.nk-greeting h3{font-size:22px;line-height:1.6;margin:0 0 18px;font-weight:600;border:none;padding:0;background:none}
.nk-greeting .nk-greet-name{
  margin:22px 0 0;padding-top:18px;border-top:1px solid var(--border);
  font-family:var(--nk-sans);font-size:14px;color:var(--ink-soft);
}
.nk-greeting .nk-greet-name strong{display:block;font-size:19px;color:var(--sumi);margin-top:4px}
@media (max-width:782px){.nk-greeting{grid-template-columns:1fr;gap:24px}}

/* =========================================================
   17. 体験・お問合せ
   ========================================================= */
.nk-contact{
  background:var(--ivory);border:1px solid var(--border);border-radius:14px;
  padding:40px 32px;text-align:center;margin:0 0 20px;
}
.nk-contact .nk-contact-lead{max-width:560px;margin:0 auto 26px;font-size:15.5px;line-height:2}
.nk-contact .wp-block-buttons{justify-content:center}
.entry-body .nk-contact .wp-block-button__link{
  font-family:var(--nk-sans);font-weight:600;font-size:15px;letter-spacing:.04em;
  padding:15px 34px;border-radius:999px;border:1px solid transparent;
  background:linear-gradient(135deg,#C82D56,#E26E8C);color:#fff;
  box-shadow:0 18px 42px rgba(120,30,50,.22);
}
.entry-body .nk-contact .wp-block-button__link:hover{transform:translateY(-2px)}
.nk-contact .nk-contact-note{
  max-width:560px;margin:26px auto 0;text-align:left;
  font-size:12.5px;line-height:1.9;color:var(--ink-soft);
}

/* =========================================================
   18. 土台（全教室で共通の部分）2026-09-04
   西野流呼吸法とは／関連書籍／教室一覧／総本部／フッター
   ========================================================= */

/* ---- 西野流呼吸法とは ---- */
.nk-about{display:grid !important;grid-template-columns:.4fr 1fr;gap:48px;align-items:start;margin:0 0 20px}
.nk-about > .wp-block-column{margin:0 !important;min-width:0}
.nk-about h2{font-size:24px;line-height:1.5;margin:0;border:none;padding:0;background:none}
.nk-about p{margin:0 0 14px;font-size:16px;line-height:2.05}
.nk-about .nk-extlink a{
  display:inline-flex;gap:10px;margin-top:8px;
  font-family:var(--nk-sans);font-size:13.5px;color:var(--crail);
  border-bottom:1px solid var(--crail);padding-bottom:2px;text-decoration:none;
}
.nk-about-figs{display:grid !important;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0 0}
.nk-about-figs > .wp-block-column{margin:0 !important;min-width:0}
.nk-about-figs figure{margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--border);background:#fff}
.nk-about-figs img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.nk-about-figs figcaption{
  font-family:var(--nk-sans);font-size:12px;color:var(--ink-soft);
  padding:8px 4px 0;text-align:left;
}
@media (max-width:782px){.nk-about,.nk-about-figs{grid-template-columns:1fr;gap:24px}}

/* ---- 関連書籍 ---- */
.nk-book-grid{display:grid !important;grid-template-columns:repeat(3,1fr);gap:28px;margin:0 0 20px}
/* 書籍が2冊・1冊のときも均等に（2026-09-19 v2.14.2・座間） */
.nk-book-grid:has(> .wp-block-column:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
.nk-book-grid:has(> .wp-block-column:first-child:last-child){grid-template-columns:1fr;max-width:520px}
.nk-book-grid > .wp-block-column{margin:0 !important;min-width:0}
.nk-book-card{
  background:var(--ivory);border:1px solid var(--border);border-radius:10px;
  overflow:hidden;height:100%;margin:0;padding:0;
}
.nk-book-card figure{margin:0;background:#f3f1ec}
.nk-book-card figure img{display:block;width:100%;aspect-ratio:2/3;object-fit:contain}
.nk-book-card .nk-book-body{padding:22px 24px 26px}
.nk-book-card h3{font-size:16px;line-height:1.6;margin:0 0 8px;font-weight:600;border:none;padding:0;background:none}
.nk-book-card p{font-size:13px;line-height:1.8;color:var(--ink-soft);margin:0 0 12px}
.nk-book-card .nk-book-links a{
  display:inline-block;margin:0 8px 8px 0;padding:7px 14px;
  font-family:var(--nk-sans);font-size:12.5px;text-decoration:none;
  color:var(--crail-deep);border:1px solid var(--border-strong);border-radius:999px;
}
.nk-book-card .nk-book-links a:hover{border-color:var(--crail);background:var(--mist)}
@media (max-width:782px){.nk-book-grid{grid-template-columns:1fr}}

/* ---- 教室一覧 ---- */
.nk-studios{background:var(--ivory);border:1px solid var(--border);border-radius:14px;padding:36px 32px;margin:0 0 20px}
.nk-studios .nk-region{
  font-family:var(--nk-sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--crail);margin:26px 0 10px;
}
.nk-studios .nk-region:first-of-type{margin-top:0}
.nk-studios .nk-studio-list{margin:0 0 4px;font-size:14.5px;line-height:2.1}
.nk-studios .nk-studio-list a{color:var(--sumi);text-decoration:none;border-bottom:1px solid var(--border-strong)}
.nk-studios .nk-studio-list a:hover{color:var(--crail-deep);border-bottom-color:var(--crail)}
.nk-studios .nk-here{color:var(--ink-soft);font-size:12px;margin-left:6px}
.nk-studios .nk-studios-note{margin:22px 0 0;font-size:13px;color:var(--ink-soft)}

/* ---- 総本部 ---- */
.nk-hq{
  width:100vw;max-width:100vw;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  background:radial-gradient(circle at 78% 20%,rgba(198,196,230,.32),transparent 36%),
             linear-gradient(135deg,#43426F,#6E6CB0 62%,#9B99D6);
  color:#fff;padding:64px clamp(20px,5vw,64px);
}
.entry-body .nk-hq{width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important}
.nk-hq h2{font-size:clamp(24px,2.8vw,32px);line-height:1.5;font-weight:500;margin:0 0 14px;color:#fff;border:none;padding:0;background:none}
.nk-hq p{margin:0 0 20px;color:rgba(255,255,255,.86);font-size:15px;line-height:1.95}
.nk-hq .nk-hq-links a{
  display:block;margin:0 0 12px;padding:14px 22px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.34);
  border-radius:999px;color:#fff;text-decoration:none;
  font-family:var(--nk-sans);font-size:14px;
}
.nk-hq .nk-hq-links a:hover{background:rgba(255,255,255,.24)}
.nk-hq .nk-copyright{
  margin:32px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.22);
  text-align:center;font-family:var(--nk-sans);font-size:11.5px;letter-spacing:.08em;
  color:rgba(255,255,255,.82);
}
.nk-hq-inner{display:grid !important;grid-template-columns:1fr 1fr;gap:44px;align-items:center;max-width:1120px;margin:0 auto}
.nk-hq-inner > .wp-block-column{margin:0 !important;min-width:0}
@media (max-width:782px){.nk-hq-inner{grid-template-columns:1fr;gap:24px}}

/* ---- フッター ---- */
.nk-foot{
  border-top:1px solid var(--border);
  padding:44px 0 0;margin:36px 0 0;
}
.nk-foot-inner{display:grid !important;grid-template-columns:1fr 1fr;gap:40px;margin:0}
.nk-foot-inner > .wp-block-column{margin:0 !important;min-width:0}
.nk-foot h3{font-size:17px;margin:0 0 10px;font-weight:600;border:none;padding:0;background:none}
.nk-foot .nk-foot-desc{font-size:13.5px;line-height:1.85;color:var(--ink-soft);margin:0}
.nk-foot h4{
  font-family:var(--nk-sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-soft);margin:0 0 12px;border:none;padding:0;background:none;
}
.nk-foot .nk-foot-menu{margin:0;font-size:14px;line-height:2.1}
.nk-foot .nk-foot-menu a{color:var(--sumi);text-decoration:none}
.nk-foot .nk-foot-menu a:hover{color:var(--crail-deep)}
@media (max-width:782px){.nk-foot-inner{grid-template-columns:1fr;gap:24px}}

/* =========================================================
   19. 全幅の確実な出し方（2026-09-04 修正）
   margin を使う方法は WordPress 側の指定に打ち消されることがあった
   （ヒーローは効いていたが、総本部の帯は margin-left が 0 に戻されていた）。
   transform は margin では上書きできないので、こちらに統一する。
   ========================================================= */
.entry-body .nk-hero,
.entry-body .nk-hero.alignfull,
.entry-body .nk-hq,
.entry-body .nk-hq.alignfull{
  position:relative;
  left:50%;
  transform:translateX(-50%);
  width:100vw;
  max-width:100vw;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* =========================================================
   20. 見出しへ飛ぶときの位置合わせ（2026-09-04）
   上の固定ヘッダーに隠れないよう、少し手前で止める
   ========================================================= */
.nk-section-head,
.nk-contact,
.nk-studios{scroll-margin-top:90px}

/* =========================================================
   21. スクロールで浮かび上がる動き（2026-09-04）
   静的サイトと同じ IntersectionObserver 方式。
   ライブラリを読み込まないので軽い。
   「視差効果を減らす」設定の端末では動かさない。
   ========================================================= */
.nk-reveal{opacity:0;transform:translateY(22px);
  transition:opacity .8s ease,transform .8s cubic-bezier(.22,.61,.36,1)}
.nk-reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .nk-reveal{opacity:1;transform:none;transition:none}
}

/* 教室一覧の地図 */
.nk-studios-map{margin:0 auto 26px;max-width:820px}
.nk-studios-map img{display:block;width:100%;height:auto;border-radius:12px}

/* =========================================================
   22. セクションの帯（2026-09-05）
   静的サイトは section{padding:96px 32px} ＋ 背景を白と薄水色で交互、
   白い帯の上下に細い線、という作りで「間」を出している。
   WordPress でも同じになるよう、各セクションを帯で包む。
   ========================================================= */
.nk-band{
  position:relative;
  left:50%;
  transform:translateX(-50%);
  width:100vw;
  max-width:100vw;
  margin:0 !important;
  padding:clamp(64px,9vh,96px) clamp(20px,5vw,32px);
}
/* 帯の中身は本文と同じ幅に戻す */
.nk-band > .wp-block-group__inner-container,
.nk-band > *{max-width:1120px;margin-left:auto;margin-right:auto}

/* 薄い水色の帯（地の色と同じ。余白だけで区切る） */
.nk-band--paper{background:var(--paper)}
/* 白い帯（上下に細い線を入れて、はっきり区切る） */
.nk-band--ivory{
  background:var(--ivory);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

/* 帯の中では、見出しの下だけ余白をとる（帯自体が上下の間を作るため） */
.nk-band .nk-section-head{margin-top:0;margin-bottom:44px}
/* 帯の中の最後の要素は下余白を消す */
.nk-band > *:last-child{margin-bottom:0}

/* 帯を使っていないところ（お知らせなど）の上下の間 */
.entry-body > .nk-notice{margin-top:clamp(48px,6vh,72px);margin-bottom:clamp(48px,6vh,72px)}

@media (max-width:782px){
  .nk-band{padding:clamp(48px,7vh,72px) 20px}
  .nk-band .nk-section-head{margin-bottom:32px}
}

/* =========================================================
   23. タイトル帯（2026-09-06）
   旧WPにあった「スクロールすると大きな写真が動いて見えてくる」帯。
   画面の左右いっぱいに広げ、写真の上に薄い幕をかけて文字を読ませる。

   ★軽さについて★
   JavaScript は一切使っていない。ブラウザ標準の
   「スクロール連動アニメーション（animation-timeline: view()）」だけで動かすので、
   処理はブラウザの描画側で完結し、ページの重さはほぼ変わらない。
   この機能に未対応のブラウザでは、写真が止まって表示されるだけで崩れない。
   ========================================================= */
.nk-titleband{
  position:relative;
  left:50%;
  transform:translateX(-50%);
  width:100vw;
  max-width:100vw;
  margin:0 !important;
  min-height:clamp(220px,34vh,360px);
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--mist);
}
/* 写真：少し大きめに置いて、スクロールに合わせて上下にゆっくり動かす */
.nk-titleband .wp-block-cover__image-background{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  transform:scale(1.16);
  will-change:transform;
}
@supports (animation-timeline: view()){
  .nk-titleband .wp-block-cover__image-background{
    animation:nk-parallax linear both;
    animation-timeline:view();
    animation-range:cover 0% cover 100%;
  }
}
@keyframes nk-parallax{
  from{transform:translateY(-7%) scale(1.16)}
  to  {transform:translateY(7%)  scale(1.16)}
}
/* 写真の上にかける薄い幕（文字を読みやすくする） */
.nk-titleband .wp-block-cover__background,
.nk-titleband::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(242,248,251,.62),rgba(242,248,251,.50) 50%,rgba(242,248,251,.66));
  opacity:1;
}
.nk-titleband .wp-block-cover__inner-container{
  position:relative;z-index:2;
  max-width:1120px;margin:0 auto;
  text-align:center;
}
.nk-titleband h2{
  margin:0;
  font-size:clamp(26px,4.4vw,44px);
  line-height:1.4;font-weight:600;letter-spacing:.04em;
  color:var(--sumi);
  border:none;padding:0;background:none;
  text-shadow:0 1px 12px rgba(255,255,255,.85);
}
.nk-titleband .nk-titleband-sub{
  margin:12px 0 0;
  font-family:var(--nk-sans);font-size:12px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--crail-deep);
}
@media (prefers-reduced-motion:reduce){
  .nk-titleband .wp-block-cover__image-background{animation:none;transform:scale(1.05)}
}

/* =========================================================
   24. ヒーローの動き（2026-09-06）
   静的サイトと同じ3つ。すべてCSSだけで動く＝JavaScriptを足していない。
   ・ゆっくり呼吸するような光
   ・小さな白文字を金の光が横切る
   ・教室名のピルの上を光が走り抜ける
   ========================================================= */
.nk-hero{overflow:hidden}
.nk-hero::after{
  content:"";position:absolute;z-index:1;
  left:48%;top:48%;width:min(62vw,680px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,
    rgba(255,255,255,.22) 0 10%,
    rgba(143,198,224,.26) 11% 18%,
    rgba(79,163,201,.22) 19% 42%,
    transparent 68%);
  filter:blur(18px);
  mix-blend-mode:screen;
  pointer-events:none;
  animation:nk-breathGlow 9s ease-in-out infinite;
}
@keyframes nk-breathGlow{
  0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.2}
  50%{transform:translate(-50%,-50%) scale(1.08);opacity:.36}
}
/* 小さな白文字を金の光が横切る */
.nk-hero .nk-hero-eyebrow{
  background:linear-gradient(100deg,#fff 0%,#fff 40%,#FFE7A0 47%,#FFF6D6 50%,#FFE7A0 53%,#fff 60%,#fff 100%);
  background-size:280% 100%;
  background-position:140% 0;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:nk-eyebrowSheen 7s ease-in-out infinite;
}
@keyframes nk-eyebrowSheen{0%{background-position:140% 0}30%,100%{background-position:-40% 0}}
/* 教室名のピルの上を光が走り抜ける */
.nk-hero .nk-hero-name{position:relative;overflow:hidden}
.nk-hero .nk-hero-name::after{
  content:"";position:absolute;top:0;left:-70%;width:55%;height:100%;pointer-events:none;
  background:linear-gradient(100deg,
    rgba(255,244,210,0) 0%,rgba(255,238,180,0) 25%,
    rgba(255,246,220,.9) 50%,
    rgba(255,238,180,0) 75%,rgba(255,244,210,0) 100%);
  transform:skewX(-18deg);
  mix-blend-mode:screen;
  animation:nk-nameGlint 7s ease-in-out infinite;
}
@keyframes nk-nameGlint{0%,14%{left:-70%}42%{left:130%}100%{left:130%}}

@media (prefers-reduced-motion:reduce){
  .nk-hero::after,
  .nk-hero .nk-hero-eyebrow,
  .nk-hero .nk-hero-name::after{animation:none}
  .nk-hero .nk-hero-eyebrow{-webkit-text-fill-color:#fff;color:#fff}
}

/* =========================================================
   25. 2026-09-06 の修正3点
   ① タイトル帯が全幅にならない
      → width:100vw が WordPress 側の指定に負けていた（1120pxのまま）。
        ヒーロー・総本部と同じく、クラス2つ＋!important で確実に効かせる。
   ② スクロールしても写真が動かない
      → animation の書き方（一括指定）だと再生時間が 0 秒になり、
        スクロール連動が働かなかった。個別指定＋duration:auto に直す。
   ③ ヒーローの光が見えない
      → 写真の上にかける幕と同じ重なり順だったため、幕の下に隠れていた。
        重なり順を上げ、少し強くする。
   ========================================================= */

/* ① 全幅 */
.entry-body .nk-titleband,
.entry-body .nk-titleband.alignfull{
  position:relative !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  width:100vw !important;
  max-width:100vw !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* ② スクロール連動（個別指定に書き直す） */
.nk-titleband .wp-block-cover__image-background{
  animation:none;
}
@supports (animation-timeline: view()){
  .entry-body .nk-titleband .wp-block-cover__image-background{
    animation-name:nk-parallax;
    animation-duration:auto;
    animation-timing-function:linear;
    animation-fill-mode:both;
    animation-timeline:view();
    animation-range:cover 0% cover 100%;
  }
}

/* ③ ヒーローの光を幕より上に出す */
.entry-body .nk-hero::after{
  z-index:3;
  filter:blur(24px);
}
@keyframes nk-breathGlow{
  0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.30}
  50%{transform:translate(-50%,-50%) scale(1.10);opacity:.52}
}
@media (prefers-reduced-motion:reduce){
  .entry-body .nk-titleband .wp-block-cover__image-background{animation:none;transform:scale(1.05)}
}

/* =========================================================
   26. タイトル帯が動かなかった本当の原因（2026-09-06 修正）
   写真は overflow:hidden の中にあるため、ブラウザが
   「スクロールの基準」を写真の親（帯）だと判断し、
   帯自体はスクロールしないので時間軸が止まっていた（currentTime が null）。
   → 帯そのものに名前つきの時間軸を作り、写真がそれを参照する形に変える。
   ========================================================= */
.entry-body .nk-titleband{
  view-timeline-name:--nk-tb;
  view-timeline-axis:block;
}
@supports (animation-timeline: --nk-tb){
  .entry-body .nk-titleband .wp-block-cover__image-background{
    animation-name:nk-parallax;
    animation-duration:auto;
    animation-timing-function:linear;
    animation-fill-mode:both;
    animation-timeline:--nk-tb;
    animation-range:cover 0% cover 100%;
  }
}

/* =========================================================
   27. ヒーローの渦巻銀河（2026-09-06）
   静的サイトと同じ canvas。JSは galaxy.js（画面外では止まる）。
   重なり順：写真0 → 幕1 → 呼吸する光3 → 銀河4 → 文字5
   ========================================================= */
.nk-hero .nk-galaxy{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:4;
  pointer-events:none;
  mix-blend-mode:screen;
  opacity:.95;
}
@media (prefers-reduced-motion:reduce){
  .nk-hero .nk-galaxy{opacity:.7}
}

/* =========================================================
   28. タイトル帯の動き＝JS方式へ変更（2026-09-06）
   CSSのスクロール連動は3通り試したが、このブラウザでは
   「時間軸は動いているのにアニメーションが結びつかない」状態が解消できなかった
   （ViewTimeline の currentTime は 46.7% を返すのに、
     それを使ったアニメーションの currentTime が null のまま）。
   そこで titleband の動きだけ JS で書く（reveal.js の末尾）。
   ・帯が画面に入っている間だけ動く（IntersectionObserver）
   ・1フレームに1回だけ transform を書き換える（requestAnimationFrame）
   ・「視差効果を減らす」設定では動かさない
   canvas の銀河（毎フレーム520個の描画）に比べれば、負荷はごくわずか。
   ========================================================= */
.entry-body .nk-titleband .wp-block-cover__image-background{
  animation:none !important;
  transform:scale(1.45);
  will-change:transform;
}
/* 動きが見えるよう、幕を少し薄くする */
.nk-titleband .wp-block-cover__background,
.nk-titleband::before{
  background:linear-gradient(180deg,rgba(242,248,251,.52),rgba(242,248,251,.40) 50%,rgba(242,248,251,.56)) !important;
}

/* =========================================================
   29. 動く量を大きくした（2026-09-06）
   ±7%（約20px）では、薄い幕もあって動きに気づけなかった。
   ±18% に広げ、写真の拡大も 1.16 → 1.45 にして
   （1 + 0.18×2 = 1.36 < 1.45）動かしても端が出ないようにする。
   ========================================================= */

/* =========================================================
   30. タイトル帯を「WordPress標準の固定背景」方式に変える（2026-09-06）
   ★これが旧WPと同じ作り★

   旧WPのタイトル帯を調べたところ、カバーブロックの
   「固定背景（Fixed background）」という標準機能だけで作られていた。
     <div class="wp-block-cover has-parallax">
       <div class="wp-block-cover__image-background has-parallax"
            style="background-image:url(...)"></div>
   WordPress本体のCSSが background-attachment:fixed を当てるので、
   写真は画面に貼りついたまま動かず、帯のほうが窓のように通り過ぎる。
   → 「スクロールすると大きな画像が見えてくる」のはこの効果。

   私がやっていたのは別物で、写真を少しだけ上下にずらす自作の動き。
   見た目の広がりが出ないのは当然だった。標準機能に切り替える。

   ★注意（今回のいちばんの落とし穴）★
   transform が付いた要素の中では、背景を画面に固定できない
   （その要素が「画面」の代わりになってしまう）。
   これまで全幅にするのに transform:translateX(-50%) を使っていたので、
   タイトル帯だけは余白計算（margin）方式に戻す必要がある。

   ★軽さ★
   JavaScriptは使わない。タイトル帯用のJSは削除した（reveal.js 89行→38行）。
   ========================================================= */

/* 全幅：transform をやめて余白計算にする */
.entry-body .nk-titleband,
.entry-body .nk-titleband.alignfull{
  position:relative !important;
  transform:none !important;
  left:auto !important;
  right:auto !important;
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
}

/* 写真：画面に固定する（WordPress標準の has-parallax と同じ指定） */
.entry-body .nk-titleband .wp-block-cover__image-background{
  animation:none !important;
  transform:none !important;
  will-change:auto !important;
  background-attachment:fixed !important;
  background-position:50% 50% !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

/* 「固定背景」をまだ入れていない古い帯（写真が<img>のまま）でも崩れないように */
.entry-body .nk-titleband img.wp-block-cover__image-background{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}

/* スマホ・タブレットでは WordPress 本体が自動で固定を外す（そういう仕様）。
   その時に写真が切れないよう、高さを少し抑える */
@media (max-width:781px){
  .entry-body .nk-titleband{min-height:clamp(180px,26vh,260px)}
}

/* =========================================================
   31. 総本部の帯：設計をやり直した（2026-09-07 v2.0.0）

   ★これまでの作りの、構造的な問題★
   「固定背景（background-attachment:fixed）」は、写真を**画面**に貼りつける。
   つまり写真の位置は「画面のどこか」で決まり、帯はそこを覗く細い窓になる。
   すると――
     ・帯が画面のどこにあるかで、見える部分が毎回変わる
     ・**どの部分を見せるかを、こちらで決められない**
   タイトル帯（一人の人物）はどこが見えても成立するので問題なかったが、
   総本部の帯は「北村さんの顔を見せたい」。固定背景では**原理的に指定できない**。
   実際、帯が画面の中ほどに来ると顔より下（後ろ姿）しか出ない。

   ★新しい作り★
   写真を**帯そのもの**に貼る（画面ではなく）。
     ・どこを見せるかは、こちらで決められる → 顔が必ず入る
     ・帯より写真を縦に大きくしておき、スクロールに合わせて**上下にずらす**
     ・ずらす量は「はみ出している分すべて」＝画面幅に関係なく最大限動く
   動かすのは JavaScript（reveal.js）。1フレームに1回だけ位置を書き換える。
   帯が画面の外にある間は止まる。「視差効果を減らす」設定では動かさない。

   ★読み終わりで顔が見える★
   ページを下まで読むほど写真は上へ戻り、**最後に指導者の顔が現れる**。
   ========================================================= */
.nk-hq{
  position:relative;
  color:#fff;
  padding:64px clamp(20px,5vw,64px) !important;
  background:none;
  overflow:hidden;
}
/* 写真：帯の幅いっぱい。縦は自然な高さのまま（帯からはみ出す＝動かせる余地） */
.entry-body .nk-hq img.wp-block-cover__image-background{
  position:absolute;
  left:0; top:0;
  width:100%;
  height:auto;
  min-height:100%;
  object-fit:cover;
  object-position:50% 50%;
  transform:translateY(0);
  will-change:transform;
  animation:none !important;
  max-width:none;
}
/* 幕：左は濃く（文字を読ませる）、右は薄く（写真を見せる） */
.nk-hq .wp-block-cover__background{
  background:
    linear-gradient(100deg,
      rgba(48,47,84,.90) 0%,
      rgba(60,58,100,.80) 30%,
      rgba(96,94,156,.50) 60%,
      rgba(140,138,200,.30) 100%) !important;
  opacity:1 !important;
}
.nk-hq .wp-block-cover__inner-container{
  position:relative;z-index:2;
  max-width:1120px;margin:0 auto;width:100%;
}
.nk-hq h2,
.nk-hq p{text-shadow:0 1px 10px rgba(24,23,48,.55)}
.nk-hq .nk-hq-links a{
  background:rgba(30,29,60,.34);
  border-color:rgba(255,255,255,.46);
}
@media (prefers-reduced-motion:reduce){
  .entry-body .nk-hq img.wp-block-cover__image-background{transform:none !important}
}

/* =========================================================
   34. 「足しただけで揃う」土台の指定（2026-09-07 v2.1.0）

   ★なぜ要るのか★
   ここまでの指定は 178 か所のうち 163 か所が「独自クラスの中でだけ効く」形だった。
   つまり丈子さん・横川さんが**普通に見出しやボタンを足すと、テーマ既定の姿**
   （大きな明朝＋下線、四角いボタン）になってしまう。
   旧WPは「テーマとVKブロックの既定」がそのままデザインだったので、
   何を足しても勝手に揃っていた。そこに戻す。

   ★壊さないための仕掛け：:where()★
   :where(...) の中に書いた部分は「強さ0」として扱われる。
   　例) .entry-body :where(h2)      → 強さ (0,1,0)
   　　　.nk-section-head h2          → 強さ (0,1,1) ← こちらが勝つ
   だから**場所ごとの指定は今までどおり優先**され、
   どこにも当てはまらない時だけ、この土台が使われる。
   ファイルの最後に書いても既存の見た目を上書きしない。
   ========================================================= */

/* ---- 見出し（どこに足しても、この姿） ---- */
.entry-body :where(h2){
  font-size:clamp(21px,2.5vw,28px);
  line-height:1.55;font-weight:600;letter-spacing:.04em;
  color:var(--sumi);
  margin:2.4em 0 .9em;
  border:none;padding:0 0 0 16px;background:none;
  position:relative;
}
.entry-body :where(h2)::before{
  content:"";position:absolute;left:0;top:.28em;bottom:.28em;width:3px;
  background:var(--crail);border-radius:2px;
}
.entry-body :where(h3){
  font-size:17.5px;line-height:1.6;font-weight:600;letter-spacing:.03em;
  color:var(--sumi);
  margin:2em 0 .7em;
  border:none;padding:0;background:none;
}
.entry-body :where(h4){
  font-size:15.5px;line-height:1.7;font-weight:600;
  color:var(--crail-deep);
  margin:1.8em 0 .5em;
  border:none;padding:0;background:none;
}

/* ---- ボタン（どこに足しても、この姿） ----
   ・ふつうに足す → 赤の丸ボタン
   ・「枠線」スタイルを選ぶ → 青の枠線ボタン
   ヒーローと「体験・お問合せ」の中では、今までどおりそこ専用の姿になる */
.entry-body .wp-block-button__link{
  display:inline-block;
  border-radius:999px;
  padding:13px 30px;
  font-family:var(--nk-sans);font-size:14px;letter-spacing:.06em;font-weight:500;
  background:var(--rose);color:#fff;
  border:1px solid transparent;
  text-decoration:none;
  box-shadow:0 6px 18px rgba(213,0,79,.20);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.entry-body .wp-block-button__link:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(213,0,79,.26);
}
.entry-body .wp-block-button.is-style-outline .wp-block-button__link{
  background:transparent;color:var(--crail-deep);
  border-color:var(--crail-deep);box-shadow:none;
}
.entry-body .wp-block-button.is-style-outline .wp-block-button__link:hover{
  background:rgba(79,163,201,.10);
}

/* ---- 文中のリンク ---- */
.entry-body :where(p a,li a){
  color:var(--crail-deep);
  text-underline-offset:3px;
  text-decoration-thickness:1px;
}

/* ---- 箇条書き ---- */
.entry-body :where(ul,ol){
  font-size:15px;line-height:2.05;color:var(--sumi);
  margin:1.2em 0;padding-left:1.4em;
}
.entry-body :where(li){margin:.2em 0}
.entry-body :where(ul) li::marker{color:var(--crail)}

/* ---- 引用 ---- */
.entry-body :where(blockquote){
  margin:1.6em 0;padding:4px 0 4px 20px;
  border-left:3px solid var(--border-strong);
  color:var(--ink-soft);font-style:normal;
}

/* ---- 区切り線 ---- */
.entry-body :where(hr){
  border:0;height:1px;background:var(--border);
  margin:2.6em 0;
}

/* ---- 表 ---- */
.entry-body :where(table){
  width:100%;border-collapse:collapse;font-size:14.5px;
  margin:1.4em 0;background:var(--ivory);
}
.entry-body :where(th,td){
  border:1px solid var(--border);padding:12px 14px;text-align:left;vertical-align:top;
}
.entry-body :where(th){background:var(--mist);font-weight:600;color:var(--sumi)}

/* ---- 写真のキャプション ---- */
.entry-body :where(figcaption){
  font-size:12.5px;color:var(--ink-soft);
  margin-top:8px;line-height:1.7;text-align:center;
}
/* ---- 画像の角を少し丸く（枠のない写真だけ） ---- */
.entry-body :where(.wp-block-image img){border-radius:8px}

/* =========================================================
      32. 会場とアクセス（地図つき）2026-09-06
   稽古日程のすぐ下に置く。静的サイトと同じ見え方に揃えてある。
   地図は Googleマップの埋め込み（HTMLブロック）。
   住所を書き替える時は、HTMLブロックの中の住所部分も直す。
   ========================================================= */
.nk-venue{
  margin-top:clamp(48px,6vh,72px) !important;
  padding-top:clamp(28px,3.5vh,40px);
  border-top:1px solid var(--border);
  max-width:1120px;
  margin-left:auto;margin-right:auto;
}
.nk-venue h3{
  margin:0 0 12px;
  font-size:17px;font-weight:600;letter-spacing:.04em;color:var(--sumi);
  border:none;padding:0;background:none;
}
.nk-venue h3::before{
  content:"";display:inline-block;width:22px;height:1px;
  background:var(--crail);vertical-align:middle;margin-right:10px;
}
.nk-venue-name{margin:0 0 4px;font-size:16px;font-weight:600;color:var(--sumi)}
.nk-venue-addr{margin:0 0 14px;font-size:14.5px;color:var(--sumi)}
.nk-venue-notes{
  margin:0;padding:0;list-style:none;
  font-size:13.5px;line-height:2;color:rgba(33,48,58,.82);
}
.nk-venue-notes li{padding-left:18px;position:relative}
.nk-venue-notes li::before{
  content:"※";position:absolute;left:0;color:var(--crail-deep);font-size:12px;
}
.nk-map{
  margin-top:22px;
  border:1px solid var(--border);
  border-radius:8px;
  overflow:hidden;
  background:var(--ivory);
}
.nk-map iframe{
  display:block;width:100%;height:360px;border:0;
  filter:saturate(.86) contrast(.96);
}
@media (max-width:600px){
  .nk-map iframe{height:280px}
}

/* =========================================================
   35. 写真・動画の「よこ並び」を 1〜4枚に対応（2026-09-08 v2.4.0）
   もとは写真3枚・動画2本しか無かった。
   並べる数はクラスの末尾の数字で決まる（--2 なら2列）。
   画面が狭くなると自動で段が減り、スマホでは1列になる。
   ========================================================= */
.nk-photo-grid--2{grid-template-columns:repeat(2,1fr)}
.nk-photo-grid--3{grid-template-columns:repeat(3,1fr)}
.nk-photo-grid--4{grid-template-columns:repeat(4,1fr)}
.nk-photo-grid--4 .photo-panel{min-height:280px}

.nk-video-grid--2{grid-template-columns:repeat(2,1fr)}
.nk-video-grid--3{grid-template-columns:repeat(3,1fr)}
.nk-video-grid--4{grid-template-columns:repeat(4,1fr)}

/* タブレットくらいの幅では、4列→2列・3列→2列に落とす */
@media (max-width:1080px){
  .nk-photo-grid--4,.nk-video-grid--4{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .nk-photo-grid--3,.nk-video-grid--3{grid-template-columns:repeat(2,1fr)}
}
/* スマホは1列 */
@media (max-width:782px){
  .nk-photo-grid--2,.nk-photo-grid--3,.nk-photo-grid--4,
  .nk-video-grid--2,.nk-video-grid--3,.nk-video-grid--4{grid-template-columns:1fr}
  .nk-photo-grid--4 .photo-panel{min-height:240px}
}

/* =========================================================
   36. 教室ごとの色（2026-09-08 v2.5.0）

   ★色ここから★（教室ごとの差し替え）

   いまは全教室が水色（既定）。別の色にしたい教室が出たら、
   functions.php の nishino_kyoshitsu_color_map() に1行足すだけでよい。
     例) 'shizuoka' => 'fuji',   ← 静岡だけ藤色になる

   色そのものは、静的サイトの3案（水色・藤・紅梅）をそのまま持ってきている。
   　水色 …… koninn-dantai/index-aqua.html
   　藤　 …… koninn-dantai/index-fuji.html
   　紅梅 …… koninn-dantai/index-koubai.html

   新しい色を足したい時は、下と同じ形で1組コピーして色コードを変え、
   functions.php の説明にも名前を書き足すこと。
   ========================================================= */

/* ---- 藤（ふじ）：うすい紫 ---- */
body.nk-color-fuji{
  --paper:#F7F6FB;
  --sumi:#2A2838;
  --border:#E7E5F1;
  --border-strong:#D0CDE3;
  --crail:#8583CB;
  --crail-deep:#5A58A0;
  --moss:#A07FB8;
  --sky:#A9B6E0;
  --mist:#EFEFFA;
}

/* ---- 紅梅（こうばい）：うすい紅 ---- */
body.nk-color-koubai{
  --paper:#FBF6F7;
  --sumi:#2B2226;
  --border:#F0E3E6;
  --border-strong:#E2C9CF;
  --crail:#D4024A;
  --crail-deep:#A8023B;
  --moss:#C2607A;
  --sky:#E0A9B8;
  --mist:#FBEAEE;
}
/* --ivory（白）と --rose（申し込みボタンの臙脂）は3色とも共通。
   臙脂は「体験を申し込む」の色なので、教室で変えない。 */

/* =========================================================
   37. 総本部の帯があるページでは、テーマ既定のフッターを消す（2026-09-08 v2.8.0）

   Lightning のフッターには、ウィジェットで置いた3つのボタン
   （総本部 公式サイト／西野塾プラス 新着情報サイト／What's New）と
   その上の区切り線がある。総本部の帯に同じリンクが入っているため二重になる。

   ★ページごとの設定は作らない★
   「総本部の帯があるかどうか」で自動的に切り替える（:has）。
   → 新デザインのページでは消え、まだ古いままの教室ページでは残る。
     教室を1つ移行するたびに設定を切り替える作業が発生しない。

   著作権表示（Copyright）はテーマ側のものを残す。
   ========================================================= */
body:has(.nk-hq) .site-footer{border-top:0}
body:has(.nk-hq) .site-footer-content{display:none}
body:has(.nk-hq) .site-footer-copyright{padding-top:28px}

/* =========================================================
   38. 写真・動画のかたまりの外枠（2026-09-08 v2.9.0）

   ★なぜ足したか★
   WordPressは、パターンから入れたいちばん外側のブロックを
   「パターン」として扱い、**色や余白の設定欄を出さない**。
   そのため「動画のまわりの色を変えたい」ができなかった。
   外側にグループを1つかぶせると、中のカラムは普通のブロックとして扱われ、
   右側に「スタイル →色 →背景」が出るようになる。

   見た目は変えない（上下の間隔だけ）。
   ========================================================= */
.nk-media{margin:clamp(24px,4vh,40px) 0}
.nk-media > *:last-child{margin-bottom:0}

/* =========================================================
   39. 写真のよこ並びで、枠を写真で埋める（2026-09-08 v2.10.0）

   ★不具合★
   写真の下に灰色の余白が出ていた。
   これまで `figure` と `img` に `height:100%` と書いていたが、
   親の枠は高さを「最低360px」としか決めていない（min-height）。
   **高さが確定していない親に対する % 指定は効かない**ため、
   写真は元の縦横比のまま置かれ、残りが枠の地色（＋暗い幕）として見えていた。

   ★直し方★
   写真の入れ物（figure）を枠いっぱいに敷く（position:absolute; inset:0）。
   こうすると高さが確定するので、写真の `height:100%` が効いて枠を埋める。
   はみ出した分は `object-fit:cover` で中央を切り取る。
   ========================================================= */
.nk-photo-grid .photo-panel{position:relative;margin:0}
.nk-photo-grid .photo-panel figure{
  position:absolute;
  inset:0;
  margin:0;
}
.nk-photo-grid .photo-panel img{
  /* Lightning側に .wp-block-image img{height:auto !important} があるため、
     こちらも !important で書かないと元の縦横比のままになる */
  width:100% !important;
  height:100% !important;
  display:block;
  object-fit:cover;
}

/* =========================================================
   40. 指導者のSNSボタン（2026-09-09 v2.12.0）
   静的サイトの .sns-btn と同じ見た目。
   主宰者がInstagramやYouTubeを開いている教室だけ使い、
   無い教室はボタンごと消す（消しても他に影響しない）。
   ========================================================= */
.nk-greeting .nk-sns-row{
  margin-top:24px;
  gap:12px;
}
.entry-body .nk-greeting .wp-block-button__link{
  font-family:var(--nk-sans);
  font-size:12.5px;
  font-weight:500;
  letter-spacing:.06em;
  padding:9px 18px;
  border-radius:999px;
  border:1px solid var(--border-strong);
  background:transparent;
  color:var(--crail-deep);
  box-shadow:none;
}
.entry-body .nk-greeting .wp-block-button__link:hover{
  border-color:var(--crail);
  background:var(--mist);
  transform:none;
}

/* =========================================================
   41. 西野マーク（オープニング・落款）と対気の波紋（2026-09-16 v2.13.0）
   静的サイトの三河安城と同じ動きを移植。
   置き場所は mark.js / taiki.js が自分で作るので、編集画面には何も出ない。
   ・オープニング … ヒーローの上（canvas の位置は JS が指定）
   ・対気の波紋   … 最初のタイトル帯（稽古のご案内）の直前
   ・落款         … 総本部の帯の直前
   色は教室ごとの色（--crail-deep / --sumi）に追従する。
   ========================================================= */
.entry-body .nk-taiki{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  padding:64px 0;
  background:#fafdfe;
}
.entry-body .nk-taiki__inner{
  max-width:900px;
  margin:0 auto;
  padding:0 20px;
  text-align:center;
}
.entry-body .nk-taiki__eyebrow{
  display:block;
  font-family:var(--nk-sans);
  font-size:12px;
  letter-spacing:.32em;
  color:var(--crail-deep);
}
.entry-body .nk-taiki__title{
  font-family:var(--nk-serif);
  font-weight:600;
  font-size:clamp(21px,2.5vw,28px);
  color:var(--sumi);
  letter-spacing:.12em;
  margin:10px 0 18px;
  padding:0;
  text-align:center;
}
.entry-body .nk-taiki__title::before{content:none}
.entry-body .nk-taiki__frame{
  position:relative;
  margin-top:26px;
  border-radius:14px;
  overflow:hidden;
  aspect-ratio:16/9;
  background:#eef7fb;
  box-shadow:0 10px 34px rgba(63,123,160,.14);
}
.entry-body .nk-taiki__frame canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
}
.entry-body .nk-rakkan{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  padding:72px 0 48px;
  background:#fff;
  text-align:center;
}
.entry-body .nk-rakkan canvas{
  width:190px;
  height:190px;
  display:inline-block;
}
@media (max-width:767px){
  .entry-body .nk-taiki{padding:48px 0}
  .entry-body .nk-rakkan{padding:56px 0 36px}
}

/* =========================================================
   42. 銀河の位置（2026-09-19 v2.14.0）
   写真の顔と銀河の中心が重なる教室のためのずらし。
   ヒーローの cover ブロックに「追加CSSクラス」を付けるだけ（galaxy.js が読む）。
   狭い画面では写真の見える範囲が変わるので、ずらさず真ん中のまま。
     nk-galaxy-right … 右寄り（人物が中央にいる縦写真向け）
     nk-galaxy-left  … 左寄り
     nk-galaxy-low   … 下寄り
   ========================================================= */
@media (min-width:900px){
  .nk-hero.nk-galaxy-right{--nk-galaxy-x:0.78}
  .nk-hero.nk-galaxy-left{--nk-galaxy-x:0.22}
  .nk-hero.nk-galaxy-low{--nk-galaxy-y:0.72}
}

/* =========================================================
   43. 海外ページ向けの部品（2026-09-20 v2.15.0）
   ・折りたたみ（詳細ブロック）… 長いご挨拶・推薦文の続きをたたむ
   ・「西野流呼吸法とは」の写真だけを本文の下に置く型（is-standalone）
   ・写真を切らずに元の縦横比で見せる（is-natural）
   ・北村代表の小さな写真（nk-kitamura）
   対気の帯の見出しはヒーローの追加CSSクラス nk-lang-de / en / it で現地語併記（taiki.js）
   ========================================================= */
.entry-body details.wp-block-details{margin:6px 0 14px;padding:0}
.entry-body details.wp-block-details > summary{
  cursor:pointer;list-style:none;display:inline-block;
  font-family:var(--nk-sans);font-size:13.5px;letter-spacing:.06em;
  color:var(--crail-deep);border-bottom:1px solid var(--border-strong);padding-bottom:2px;
}
.entry-body details.wp-block-details > summary::-webkit-details-marker{display:none}
.entry-body details.wp-block-details > summary::after{content:" ▾";font-size:12px}
.entry-body details.wp-block-details[open] > summary::after{content:" ▴"}
.entry-body details.wp-block-details > *:not(summary){margin-top:12px}
.nk-about-figs.is-standalone{max-width:820px;margin:28px auto 0}
.nk-about-figs.is-natural img{aspect-ratio:auto;object-fit:contain;background:#fff}
.nk-greeting .nk-kitamura{max-width:200px;margin:4px 0 14px}
.nk-greeting .nk-kitamura img{border-radius:12px;width:100%;height:auto}

/* 43-2（v2.15.1）海外ページ: 指導者と北村代表の写真を同じ置き方（文章の上・240px）に揃える。
   左の写真列を外した場合は1列にする */
.nk-greeting:has(> .wp-block-column:first-child:last-child){grid-template-columns:1fr}
.nk-greeting .nk-kitamura{max-width:240px}

/* 43-3（v2.15.2）写真枠の切り取り位置。画像ブロックに追加CSSクラス is-top / is-bottom を付けると、
   縦写真の上端（顔）／下端を優先して見せる（object-fit:cover の基準点を動かすだけ） */
.nk-photo-grid .photo-panel .is-top img{object-position:50% 0}
.nk-photo-grid .photo-panel .is-bottom img{object-position:50% 100%}
/* 海外ページ: 推薦文の前に少し間を空ける／写真の下の肩書き */
.nk-greeting .nk-kitamura{margin-top:8px}
.nk-greeting .nk-kitamura figcaption{font-family:var(--nk-sans);font-size:12.5px;color:var(--ink-soft);text-align:left;margin-top:6px;line-height:1.6}
.nk-greeting h3 + .wp-block-spacer, .nk-greeting .wp-block-spacer{height:28px !important}

/* =========================================================
   44. 検索用の長い題名（【公認】西野流呼吸法 ○○教室｜…）は
       <title> と検索結果にだけ使い、ページ上の題名帯・パンくずには出さない
       （2026-09-20 v2.17.1。ヒーローに教室名があるので二重になる）
   ========================================================= */
body:has(.nk-hero) .page-header,
body:has(.nk-hero) .breadcrumb{display:none !important}
