/*
Theme Name: cds625
Description: 中越自動車学校グループ共通のテーマ（make_wp_theme.py から書き出し）。この書き出しは 中越自動車学校 用（学校ごとの値は schools/chuetsu.py）。お知らせだけを管理画面から更新する。
Author: アスタ
Version: 73986b19d3
Text Domain: cds625
*/
/* =========================================================
   桐生自動車教習所 ラフ（V09 波と丸み型・アクセント赤）
   校ごとに変える値は :root の「校ごとの設定値」だけ。
   ========================================================= */

:root {
  /* ---- 校ごとの設定値（テーマ設定で持つ想定） ---- */
  --c-main: #0B6BD8;          /* 主色（全校共通の青。中越に合わせた） */
  --c-main-dark: #0A56AD;     /* 主色の濃い方（hover・フッター） */
  --c-tint: #EAF4FC;          /* 主色の薄い色（ページの地） */
  --c-tint2: #CFE3F7;         /* 装飾の円（地より少し濃い） */
  --c-tint3: #F4F9FE;         /* 装飾の円（地より少し薄い） */
  --c-main-rgb: 11, 107, 216; /* 主色のRGB（影の色に使う） */
  --c-line: #E4E9EF;
  --c-green: #06C755;         /* LINEの緑（共通・テーマで変えない） */

  /* ---- 共通 ---- */
  --c-text: #1E2430;
  --c-muted: #5A6472;
  --c-check: #8B5A2B;         /* 要確認（茶色） */
  --r-card: 28px;
  --shadow: 0 8px 28px rgba(30, 36, 48, 0.08);
  --shadow-sm: 0 4px 14px rgba(30, 36, 48, 0.08);
  --w: min(1800px, 84vw);   /* コンテンツ幅＝画面の84%（上限1800px） */
  --fs: clamp(16px, 0.55vw + 9px, 20px); /* 本文の基準サイズ 1280→16px 1920→19.6px */
  --font: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font);
  color: var(--c-text);
  background: var(--c-tint);
  font-size: var(--fs);
  line-height: 1.8;
  text-wrap: pretty;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { margin: 0; line-height: 1.35; text-wrap: balance; font-weight: 700; }
@supports (word-break: auto-phrase) {
  h1, h2, h3, h4, .catch, .sub, .btn, .tile-name, .reason-txt, .step .t, .camp .t, .news-list .ttl, .lead, .route p,
  .card p, .card li, .flow-item p, .consult p, .lic p, .lic .spec span, .access-box li, .tbl td { word-break: auto-phrase; }
}
p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
.nowrap { white-space: nowrap; }
svg.i { display: inline-block; vertical-align: middle; flex: 0 0 auto; }

.wrap { max-width: var(--w); margin: 0 auto; padding: 0 24px; position: relative; }
@media (max-width: 1023px) { :root { --w: 100%; } }
@media (max-width: 640px) { .wrap { padding: 0 16px; } }

/* ---------- 要確認バッジ（茶色） ---------- */
.chk {
  display: inline-block; font-size: 14px; line-height: 1; padding: 4px 8px; border-radius: 999px;
  background: var(--c-check); color: #fff; vertical-align: middle; margin: 0 4px; font-weight: 700; white-space: nowrap;
}
.chk-note { color: var(--c-check); font-size: 14px; margin-top: 6px; }
body.hide-chk .chk, body.hide-chk .chk-note, body.hide-chk .rough-bar { display: none; }
body.hide-chk .rough-toggle { display: inline-block; }

/* ---------- ラフの案内バー ---------- */
.rough-bar { background: #FFF6E8; color: #6B4A1F; font-size: 14px; line-height: 1.6; position: relative; z-index: 3; }
.rough-bar .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding-top: 8px; padding-bottom: 8px; }
.rough-bar details { flex: 1 1 100%; }
.rough-bar summary { cursor: pointer; font-weight: 700; }
.rough-link { background: none; border: 0; padding: 0; font: inherit; color: #6B4A1F; text-decoration: underline; cursor: pointer; }
.rough-bar ul { list-style: disc; padding-left: 20px; margin: 6px 0 4px; }
.rough-bar li { margin: 2px 0; }
/* 色切替パネル（スクロールしても右下に付いてくる） */
@media (max-width: 1023px) {
}
.rough-toggle {
  position: fixed; right: 12px; bottom: 12px; z-index: 60; background: #6B4A1F; color: #fff; border: 0; border-radius: 999px;
  padding: 8px 14px; font-size: 14px; cursor: pointer; font-family: inherit; box-shadow: var(--shadow);
}
@media (max-width: 1023px) { .rough-toggle { bottom: 12px; left: 12px; right: auto; padding: 6px 10px; opacity: .9; } }
@media (max-width: 767px) { .theme-sw { bottom: 72px; opacity: .92; } .rough-toggle { bottom: 72px; } }
@media (max-width: 480px) { .theme-sw { padding: 4px; gap: 4px; } .theme-sw .ttl { display: none; } .theme-sw button { width: 26px; height: 26px; } .theme-sw button i { width: 16px; height: 16px; } }

/* ---------- 装飾の円（背景のあぶく） ---------- */
.bub { position: absolute; border-radius: 50%; pointer-events: none; z-index: 0; }
.bub-d { background: var(--c-tint2); }
.bub-l { background: var(--c-tint3); }

/* ---------- ヘッダー ---------- */
.header { position: sticky; top: 0; z-index: 50; background: #fff; }
.header .wrap { display: flex; align-items: center; gap: clamp(16px, 1.6vw, 32px); height: clamp(88px, 6vw, 116px); max-width: min(1880px, 94vw); }
.logo { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.logo .mark { width: clamp(56px, 3.6vw, 76px); height: auto; }
.logo .txt { line-height: 1.15; }
.logo .txt .ja { font-size: clamp(22px, 1.5vw, 30px); font-weight: 700; letter-spacing: .04em; display: block; }
.logo .txt .en { font-size: clamp(12px, .7vw, 14px); font-weight: 700; letter-spacing: .12em; color: var(--c-text); display: block; margin-top: 2px; }
.logo .txt .koan { font-size: clamp(14px, .75vw, 16px); color: var(--c-muted); display: block; margin-top: 3px; }
.gnav { display: flex; gap: clamp(16px, 1.6vw, 34px); margin-left: auto; font-size: clamp(16px, .95vw, 19px); font-weight: 500; }
.gnav a { position: relative; padding: 6px 0; white-space: nowrap; }
.gnav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; border-radius: 3px; background: var(--c-main); transform: scaleX(0); transition: .2s; }
.gnav a:hover::after, .gnav a.is-current::after { transform: scaleX(1); }
.htel { text-align: center; line-height: 1.3; flex: 0 0 auto; }
.htel .num { display: inline-flex; align-items: center; gap: 6px; font-size: clamp(24px, 1.7vw, 34px); font-weight: 700; letter-spacing: .01em; line-height: 1.2; }
.htel .num svg { color: var(--c-main); }
.htel .hours { font-size: clamp(14px, .8vw, 16px); color: var(--c-muted); margin-top: 2px; }
.hbtns { display: flex; flex-direction: column; gap: 8px; flex: 0 0 auto; }
.hbtns .btn { min-width: clamp(150px, 9.5vw, 190px); padding: .5em 1.3em; font-size: clamp(16px, .95vw, 19px); }
.menu-btn { display: none; }

@media (max-width: 1540px) {
  .header .wrap { max-width: 100%; gap: 12px; }
  .gnav { gap: 10px; font-size: 16px; }
  .logo .txt .koan { display: none; }
  .logo .txt .ja { font-size: 20px; }
  .logo .mark { width: 50px; height: 50px; }
  .htel .hours { font-size: 14px; margin-top: 0; }
  .htel .num { font-size: 20px; }
  .hbtns .btn { min-width: 120px; padding: 6px 12px; font-size: 16px; }
}
@media (max-width: 1360px) {
  .gnav { gap: 8px; font-size: 15px; }
  .hbtns .btn { font-size: 15px; }
}
@media (max-width: 1279px) {
  .gnav { display: none; }
  .menu-btn { display: inline-flex; margin-left: auto; }
}
@media (max-width: 1023px) {
  .header .wrap { height: 76px; gap: 12px; }
  .hbtns, .htel { display: none; }
  .logo .mark { width: 48px; height: 48px; }
  .logo .txt .ja { font-size: 20px; }
  .logo .txt .en { font-size: 11px; }
}
.menu-btn {
  align-items: center; gap: 6px; border: 2px solid var(--c-main); color: var(--c-main); background: #fff;
  border-radius: 999px; padding: 8px 16px; font-weight: 700; font-family: inherit; font-size: 16px; cursor: pointer; white-space: nowrap;
}
@media (max-width: 480px) { .logo .txt .ja { font-size: 18px; } .logo .txt .en { font-size: 10px; } .logo .mark { width: 42px; height: 42px; } .menu-btn { padding: 8px 12px; } }

/* ---------- ドロワー（1279px以下のメニュー） ---------- */
.drawer { display: none; position: fixed; inset: 0; z-index: 70; }
body.drawer-open .drawer { display: block; }
.drawer-bg { position: absolute; inset: 0; background: rgba(30,36,48,.5); }
.drawer-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(360px, 88vw); background: #fff; padding: 20px 24px; overflow: auto; display: flex; flex-direction: column; gap: 20px; }
.drawer-close { align-self: flex-end; background: none; border: 0; font: inherit; font-weight: 700; color: var(--c-main); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.drawer nav { display: flex; flex-direction: column; }
.drawer nav a { padding: 12px 0; border-bottom: 1px solid var(--c-line); font-weight: 700; }
.drawer nav a::after { content: "›"; float: right; color: var(--c-main); }
.drawer-btns { display: flex; flex-direction: column; gap: 10px; }

/* ---------- ボタン（ピル型） ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  border-radius: 999px; padding: .85em 1.9em; font-weight: 700; font-size: clamp(16px, 1vw, 20px);
  line-height: 1.3; text-align: center; transition: .2s; border: 2px solid transparent;
}
.btn::after { content: "›"; font-size: 1.35em; line-height: 1; font-weight: 700; }
.btn-main { background: var(--c-main); color: #fff; box-shadow: 0 6px 16px rgba(var(--c-main-rgb),.22); }
.btn-main:hover { background: var(--c-main-dark); }
.btn-outline { background: #fff; color: var(--c-main); border-color: var(--c-main); }
.btn-outline:hover { background: var(--c-tint); }
.btn-sub { background: #fff; color: var(--c-main); border-color: var(--c-main); }
.btn-line { background: var(--c-green); color: #fff; box-shadow: 0 6px 16px rgba(6,199,85,.25); }
.btn-line:hover { background: #05A648; }
.btn-line::after { content: none; }
.btn-line .chk { background: rgba(0,0,0,.28); }
.footer .sns .c { font-size: clamp(13px, .8vw, 15px); }
.cta-note { color: var(--c-muted); font-size: clamp(15px, .9vw, 18px); }
.btn-sm { padding: .6em 1.3em; font-size: clamp(16px, .95vw, 19px); }
.btn-lg { padding: 1em 2.4em; font-size: clamp(18px, 1.1vw, 22px); }
.btn small { font-weight: 400; font-size: max(14px, .8em); opacity: .9; }
.btn-tel::after { content: none; }
.btn-tel { flex-direction: column; gap: 0; line-height: 1.25; }
.btn-tel small { font-size: max(14px, .8em); }
.btn-tel b { font-size: 1.25em; }

/* ---------- セクション・波形 ---------- */
.sec { position: relative; padding: clamp(56px, 4.5vw, 96px) 0; overflow: hidden; }
.sec-white { background: #fff; }
.sec-tint { background: var(--c-tint); }
.sec > .wrap { z-index: 2; }
.wave { display: block; width: 100%; height: clamp(48px, 4vw, 90px); position: absolute; left: 0; right: 0; bottom: -1px; z-index: 1; }
@media (max-width: 640px) { .sec { padding: 44px 0; } .wave { height: 36px; } }

/* ---------- 見出し ---------- */
.sec-head { display: flex; align-items: center; gap: clamp(14px, 1vw, 20px); margin-bottom: clamp(28px, 2.2vw, 44px); flex-wrap: wrap; }
.sec-head .ico {
  width: clamp(56px, 3.6vw, 76px); height: clamp(56px, 3.6vw, 76px); border-radius: 50%; background: var(--c-main); color: #fff;
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
}
.sec-head .ico svg { width: 50%; height: 50%; }
.sec-head h2 { font-size: clamp(26px, 2vw, 40px); position: relative; padding-bottom: 10px; }
.sec-head h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 1.6em; height: 4px; border-radius: 2px; background: var(--c-main); }
.sec-head h2 small { font-size: 15px; color: var(--c-muted); font-weight: 500; margin-left: 14px; }
.sec-head .more { margin-left: auto; color: var(--c-main); font-weight: 700; font-size: clamp(16px, .95vw, 19px); }
@media (max-width: 640px) {
  .sec-head { gap: 10px; margin-bottom: 20px; }
  .sec-head .ico { width: 44px; height: 44px; }
  .sec-head .ico svg { width: 22px; height: 22px; }
  .sec-head .more { margin-left: 0; }
}

/* ---------- メインビジュアル（全幅） ---------- */
.mv { position: relative; padding: 0 0 48px; overflow: hidden; }
.mv-photo { position: relative; height: clamp(560px, 40vw, 820px); overflow: hidden; }
.mv-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 38% 50%; }
.mv-photo::after { /* 下端の波 */
  content: ""; position: absolute; left: -6%; right: -6%; bottom: -70px; height: 130px; background: var(--c-tint);
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}
.mv-inner { position: absolute; inset: 0; max-width: min(1880px, 92vw); margin: 0 auto; padding: 0 28px; z-index: 2; }
.mv-circle {
  position: absolute; left: 28px; top: 50%; transform: translateY(-50%); width: clamp(480px, 32vw, 660px); height: clamp(480px, 32vw, 660px); border-radius: 50%;
  background: rgba(255,255,255,.96); display: flex; flex-direction: column; justify-content: center;
  padding: clamp(36px, 2.6vw, 56px) clamp(56px, 4.4vw, 88px); z-index: 2; align-items: center;
}
.mv-in { width: fit-content; max-width: 100%; text-align: left; }
.mv-circle .catch { font-size: clamp(28px, 2.3vw, 46px); font-weight: 900; line-height: 1.25; letter-spacing: .01em; margin: 0; }
.mv-circle .bar { width: 100%; max-width: 70%; height: 4px; margin: 1em 0; border-radius: 2px;
  background: linear-gradient(90deg, #0B6BD8 0 18%, #E8336B 18% 36%, #F39800 36% 54%, #8C7A5B 54% 72%, #1A9E8C 72% 86%, #E8336B 86% 100%); }
.mv-circle .sub { font-size: clamp(17px, 1.2vw, 24px); font-weight: 700; line-height: 1.5; }
.mv-circle .note { font-size: clamp(14px, .8vw, 16px); color: var(--c-muted); margin-top: 8px; }
.mv-btns { display: flex; flex-wrap: nowrap; align-items: stretch; justify-content: center; gap: clamp(10px, .8vw, 14px); margin-top: clamp(20px, 1.6vw, 30px); white-space: nowrap; }
.mv-btns .btn { padding: .8em 1.5em; font-size: clamp(16px, .95vw, 19px); box-shadow: 0 8px 20px rgba(30,36,48,.12); }
.mv-btns .btn-tel { padding: .45em 1.3em; }
@media (max-width: 1023px) {
  .mv .bub { display: none; }
  .mv-photo { height: clamp(440px, 60vw, 560px); }
  .mv-circle { width: min(500px, 60vw); height: min(500px, 60vw); padding: 3% 8%; transform: translateY(-50%); }
  .mv-circle .catch { font-size: 27px; }
  .mv-circle .sub { font-size: 17px; }
  .mv-circle .chk-note { display: none; }
  .mv-btns { gap: 8px; margin-top: 14px; }
  .mv-btns .btn { padding: .55em 1.1em; font-size: 16px; }
  .mv-btns .btn-tel { padding: .35em 1em; }
  .mv-photo { height: clamp(520px, 66vw, 680px); }
}
@media (max-width: 767px) {
  .mv { padding: 0 0 40px; }
  .mv-photo { height: auto; overflow: visible; }
  .mv-photo::after { display: none; }
  .mv-photo img { aspect-ratio: 4 / 3; height: auto; border-radius: 0 0 48px 0; }
  .mv-inner { position: static; padding: 0 16px; }
  .mv-circle { position: relative; left: auto; top: auto; transform: none; width: auto; height: auto; border-radius: 28px; padding: 24px; margin: -40px 8px 0; align-items: stretch; }
  .mv-in { width: auto; }
  .mv-btns { flex-wrap: wrap; white-space: normal; }
  .mv-circle .chk-note { display: block; }
  .mv-btns .btn { flex: 1 1 100%; }
}

/* ---------- キャンペーン枠（写真が右で、左は白に溶ける） ---------- */
.camp { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(20px, 1.6vw, 32px); }
.camp a {
  position: relative; display: block; min-height: clamp(210px, 14vw, 290px); overflow: hidden; background: #fff; box-shadow: var(--shadow);
  border-radius: 56px 64px 90px 48px / 48px 56px 72px 40px; padding: clamp(24px, 2vw, 40px) clamp(24px, 2vw, 40px) 24px;
}
.camp a img { position: absolute; top: 0; right: 0; bottom: 0; width: 64%; height: 100%; object-fit: cover; object-position: 70% 50%;
  -webkit-mask-image: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 28%, #000 45%);
  mask-image: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 28%, #000 45%); }
.camp a .t { position: relative; z-index: 2; display: block; font-size: clamp(22px, 1.5vw, 32px); font-weight: 900; line-height: 1.35; color: var(--c-main); max-width: 64%; }
.camp a .t small { display: block; font-size: clamp(16px, .9vw, 19px); font-weight: 700; color: var(--c-text); margin-top: 6px; }
.camp a .arrow { position: absolute; z-index: 2; left: clamp(24px, 2vw, 40px); bottom: 22px; width: clamp(42px, 2.6vw, 54px); height: clamp(42px, 2.6vw, 54px); border-radius: 50%; background: var(--c-main); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 700; box-shadow: 0 4px 12px rgba(var(--c-main-rgb),.3); }
.camp a.text-only { background: linear-gradient(135deg, var(--c-main), var(--c-main-dark)); }
.camp a.text-only .t { color: #fff; text-shadow: none; max-width: 100%; }
.camp a.text-only .t small { color: #fff; opacity: .95; }
.camp a.text-only .arrow { background: #fff; color: var(--c-main); }
@media (max-width: 767px) { .camp a img { width: 55%; } .camp a .t { max-width: 58%; } }
@media (max-width: 1023px) { .camp { grid-template-columns: 1fr; gap: 14px; } .camp a { min-height: 150px; padding: 22px 24px 72px; } .camp a .t { font-size: 21px; max-width: 60%; } .camp a .arrow { left: 24px; bottom: 18px; } }

/* ---------- お知らせ ---------- */
.news-box { background: #fff; border-radius: 40px; padding: clamp(28px, 2.2vw, 44px) clamp(28px, 3vw, 60px) clamp(24px, 2vw, 40px); box-shadow: var(--shadow); }
.news-box .sec-head { margin-bottom: 8px; }
.news-list li { border-top: 1px dashed var(--c-line); }
.news-list li a { display: flex; gap: clamp(20px, 1.6vw, 32px); align-items: center; padding: .7em 0; }
.news-list li a:hover .ttl { color: var(--c-main); }
.news-list .date { flex: 0 0 auto; background: var(--c-tint); border-radius: 999px; padding: .25em 1.4em; font-size: 1em; font-weight: 700; color: var(--c-main-dark); }
.news-list .ttl { flex: 1 1 auto; }
.news-list .ar { color: var(--c-text); font-weight: 700; font-size: 20px; }
@media (max-width: 640px) { .news-box { padding: 20px; border-radius: 24px; } .news-list li a { flex-wrap: wrap; gap: 8px; } .news-list .ar { display: none; } }

/* ---------- 選ばれる理由 ---------- */
.reasons { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(32px, 3vw, 60px); justify-items: center; }
.reason { min-width: 0; background: #fff; border-radius: 50%; width: min(100%, clamp(290px, 20vw, 400px)); aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 28px; box-shadow: var(--shadow); }
.reason .ico { width: clamp(64px, 4.4vw, 88px); height: clamp(64px, 4.4vw, 88px); border-radius: 50%; background: var(--c-tint); color: var(--c-main); display: flex; align-items: center; justify-content: center; margin-bottom: 6px; }
.reason .num { font-size: clamp(56px, 4vw, 80px); font-weight: 900; color: var(--c-main); line-height: 1.1; letter-spacing: -.01em; }
.reason .num small { font-size: .42em; }
.reason .reason-txt { font-size: clamp(16px, 1vw, 20px); font-weight: 700; margin-top: 4px; line-height: 1.5; }
@media (max-width: 1023px) { .reasons { gap: 20px; } .reason { padding: 20px; } .reason .num { font-size: 44px; } }
@media (max-width: 767px) { .reasons { grid-template-columns: 1fr; } .reason { border-radius: 28px; aspect-ratio: auto; width: 100%; padding: 24px; } }

/* ---------- 免許・講習タイル ---------- */
.tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(24px, 2vw, 40px) clamp(16px, 1.6vw, 32px); }
.tiles.cols-3 { grid-template-columns: repeat(3, 1fr); max-width: 900px; margin: 0 auto; gap: 36px 40px; }
.tile { text-align: center; }
.tile .ph { width: min(100%, 300px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; margin: 0 auto 12px; background: #fff; box-shadow: var(--shadow-sm); display: flex; align-items: center; justify-content: center; }
.tile .ph img { width: 100%; height: 100%; object-fit: cover; }
.tile-name { font-size: clamp(18px, 1.15vw, 23px); font-weight: 700; letter-spacing: .04em; }
.tile-name small { display: block; font-size: clamp(14px, .8vw, 16px); color: var(--c-muted); font-weight: 500; letter-spacing: 0; }
@media (max-width: 1023px) { .tiles { grid-template-columns: repeat(3, 1fr); gap: 24px 16px; } }
@media (max-width: 767px) { .tiles, .tiles.cols-3 { grid-template-columns: repeat(2, 1fr); gap: 24px 16px; } .tile .ph { width: min(100%, 150px); } }

/* ---------- 入所のご相談（料金非公開モード） ---------- */
.consult { background: #fff; border-radius: 40px; padding: clamp(32px, 2.6vw, 52px) clamp(32px, 3vw, 60px); box-shadow: var(--shadow); display: grid; grid-template-columns: 1fr auto; gap: 24px 48px; align-items: center; }
.consult .sec-head { margin-bottom: 10px; }
.consult .btns { display: flex; flex-direction: column; gap: 12px; min-width: clamp(400px, 26vw, 520px); }
.consult .btns .btn { padding: 14px 30px; }
@media (max-width: 1023px) { .consult { grid-template-columns: 1fr; } .consult .btns { min-width: 0; } }
@media (max-width: 767px) { .consult { padding: 24px; border-radius: 24px; } }

/* ---------- 3ステップ ---------- */
.steps { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 16px; align-items: center; }
.step { display: flex; align-items: center; gap: 14px; }
.step .n { width: clamp(64px, 4.2vw, 84px); height: clamp(64px, 4.2vw, 84px); border-radius: 50%; background: var(--c-main); color: #fff; font-size: clamp(30px, 2vw, 40px); font-weight: 900; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.step .ico { color: var(--c-main); display: inline-flex; width: clamp(60px, 3.8vw, 76px); height: clamp(60px, 3.8vw, 76px); border-radius: 50%; background: #fff; align-items: center; justify-content: center; flex: 0 0 auto; }
.step .t { font-size: clamp(17px, 1.15vw, 23px); font-weight: 700; line-height: 1.4; white-space: nowrap; }
.step .t small { display: block; font-size: clamp(14px, .85vw, 17px); color: var(--c-muted); font-weight: 500; white-space: nowrap; }
.step-arrow { width: clamp(80px, 5.5vw, 110px); height: auto; color: var(--c-main); opacity: .6; }
@media (max-width: 1340px) {
  .steps { grid-template-columns: 1fr; gap: 20px; }
  .step-arrow { width: 30px; height: 30px; transform: rotate(90deg); margin: 0 auto -4px 17px; }
}

/* ---------- アクセス ---------- */
.access { display: grid; grid-template-columns: 1fr 1.25fr; gap: 32px; align-items: start; }
.access-box { background: #fff; border-radius: 36px; padding: clamp(28px, 2.2vw, 44px) clamp(32px, 2.6vw, 52px); box-shadow: var(--shadow); }
.access-box li { display: flex; gap: 14px; padding: 9px 0; border-bottom: 1px dashed var(--c-line); align-items: center; }
.access-box li:last-of-type { border-bottom: 0; }
.access-box li .i { color: var(--c-main); flex: 0 0 24px; display: inline-flex; }
.access-box a { color: inherit; }
.access-box .more { display: block; text-align: right; margin-top: 8px; color: var(--c-main); font-weight: 700; }
.access-map { border-radius: 36px; overflow: hidden; box-shadow: var(--shadow); min-height: clamp(340px, 24vw, 460px); background: #eee; }
.access-map iframe { width: 100%; height: 100%; min-height: clamp(340px, 24vw, 460px); border: 0; display: block; }
@media (max-width: 767px) { .access { grid-template-columns: 1fr; } .access-box, .access-map { border-radius: 24px; } }

/* ---------- グループ校の帯 ---------- */
.group { text-align: center; }
.group h2 { font-size: clamp(22px, 1.8vw, 34px); margin-bottom: 26px; letter-spacing: .04em; }
.group-row { display: grid; grid-template-columns: repeat(5, 1fr) auto; gap: clamp(16px, 1.3vw, 26px); align-items: center; }
.group-row .card-s { background: #fff; border-radius: 36px 28px 40px 24px / 30px 24px 34px 28px; padding: clamp(22px, 1.8vw, 34px) 10px clamp(18px, 1.4vw, 26px); box-shadow: var(--shadow-sm); font-weight: 700; font-size: clamp(16px, 1vw, 20px); line-height: 1.4; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.group-row .card-s img { height: clamp(34px, 2.4vw, 46px); width: auto; max-width: 92%; object-fit: contain; }
.group-row .card-s small { display: block; color: var(--c-muted); font-weight: 500; font-size: max(14px, .85em); }
.group-row .drone { justify-self: center; }
.group-band { display: inline-flex; align-items: center; gap: 20px; margin-top: clamp(24px, 2vw, 36px); background: #F0F0F0; border-radius: 999px; padding: .6em 2.2em; font-size: clamp(16px, 1vw, 20px); }
.group-band img { height: 1.6em; width: auto; }
.group-band .sep { width: 1px; height: 24px; background: #bbb; }
@media (max-width: 1023px) { .group-row { grid-template-columns: repeat(3, 1fr); } .group-row .drone { grid-column: 1 / -1; } }
@media (max-width: 640px) { .group-row { grid-template-columns: repeat(2, 1fr); gap: 12px; } .group-row .card-s:nth-child(5) { grid-column: span 2; } .group-band { border-radius: 24px; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 14px 20px; } }

/* ---------- 申込CTA帯（フッターの波に食い込む） ---------- */
.cta-sec { position: relative; padding: 24px 0 0; z-index: 3; }
.cta { background: #fff; border-radius: 40px; padding: clamp(40px, 3vw, 60px) 40px clamp(32px, 2.4vw, 48px); box-shadow: var(--shadow); text-align: center; position: relative; z-index: 2; }
.cta h2 { font-size: clamp(26px, 2.2vw, 42px); letter-spacing: .04em; }
.cta h2::after { content: ""; display: block; width: 56px; height: 4px; background: var(--c-main); border-radius: 2px; margin: 12px auto 0; }
.cta .btns { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; margin: 28px 0 22px; }
.cta .btns .btn { min-width: clamp(320px, 20vw, 400px); }
.cta .tel { display: block; font-size: clamp(36px, 2.6vw, 52px); font-weight: 900; letter-spacing: .02em; line-height: 1.2; }
.cta .hours { color: var(--c-muted); font-size: clamp(15px, .85vw, 17px); }
@media (max-width: 640px) {
  .cta { padding: 32px 20px; border-radius: 28px; }
  .cta .btns .btn { min-width: 0; flex: 1 1 100%; position: relative; flex-direction: column; gap: 2px; padding-left: 44px; padding-right: 44px; }
  .cta .btns .btn::after { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); }
  .cta .btn small { display: block; white-space: nowrap; }
  .cta .tel { font-size: 30px; }
}

/* ---------- フッター ---------- */
.footer { position: relative; background: var(--c-main); color: #fff; padding: 140px 0 24px; margin-top: -120px; }
.footer .fwave { position: absolute; left: 0; right: 0; top: -78px; width: 100%; height: 80px; display: block; }
.footer .cols { display: grid; grid-template-columns: 1.25fr 1fr 1fr .8fr; gap: 32px; }
.footer .cols > div, .footer .cols > ul { padding: 0 24px; border-left: 1px solid rgba(255,255,255,.35); }
.footer .cols > :first-child { border-left: 0; padding-left: 0; }
.flogo { display: flex; align-items: center; gap: 12px; }
.flogo .mark { width: clamp(64px, 4vw, 80px); height: clamp(64px, 4vw, 80px); background: #fff; border-radius: 50%; padding: 6px; }
.flogo .txt { line-height: 1.15; }
.flogo .txt .ja { font-size: clamp(24px, 1.5vw, 30px); font-weight: 700; letter-spacing: .06em; display: block; }
.flogo .txt .en { font-size: 14px; letter-spacing: .12em; display: block; margin-top: 2px; }
.flogo .txt .koan { font-size: 14px; display: block; margin-top: 3px; opacity: .9; }
.footer .addr { font-size: .95em; margin-top: 16px; line-height: 1.7; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.35); }
.footer .addr .tel { font-size: 1.3em; font-weight: 700; }
.footer ul li { padding: .25em 0; font-size: 1em; }
.footer ul li a::after { content: " ›"; }
.footer h3 { font-size: 16px; border-bottom: 1px solid rgba(255,255,255,.4); padding-bottom: 8px; margin-bottom: 14px; }
.footer .sns { display: flex; gap: 18px; }
.footer .sns a { text-align: center; font-size: 14px; }
.footer .sns .c { width: clamp(54px, 3.2vw, 64px); height: clamp(54px, 3.2vw, 64px); border-radius: 50%; background: #fff; color: var(--c-main); display: flex; align-items: center; justify-content: center; font-weight: 900; margin: 0 auto 6px; font-size: 15px; }
.footer .chk-note { color: #FFD9A8; }
.footer .copy { text-align: center; font-size: 14px; margin-top: 32px; opacity: .9; border-top: 1px solid rgba(255,255,255,.3); padding-top: 16px; letter-spacing: .06em; }
@media (max-width: 1023px) { .footer .cols { grid-template-columns: 1fr 1fr; } .footer .cols > div, .footer .cols > ul { border-left: 0; padding: 0; } }
@media (max-width: 640px) { .footer { padding-bottom: 88px; padding-top: 120px; } .footer .cols { grid-template-columns: 1fr; gap: 24px; } }

/* ---------- スマホ固定ボトムバー ---------- */
.spbar { display: none; }
@media (max-width: 767px) {
  .spbar { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 55; background: rgba(255,255,255,.96); padding: 8px 12px; border-top: 1px solid var(--c-line); box-shadow: 0 -4px 16px rgba(0,0,0,.06); }
  .spbar .btn { padding: 12px 8px; font-size: 16px; }
}

/* ---------- 下層ページ共通 ---------- */
.page-hero { position: relative; overflow: hidden; }
.page-hero .wrap { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(32px, 3vw, 60px); min-height: clamp(280px, 20vw, 400px); padding-top: 24px; padding-bottom: 24px; z-index: 2; }
.page-hero h1 { font-size: clamp(28px, 2.6vw, 50px); }
.page-hero h1 small { display: block; font-size: 14px; color: var(--c-main); letter-spacing: .14em; font-weight: 700; margin-bottom: 8px; }
.page-hero .lead { margin-top: 12px; color: var(--c-muted); }
.page-hero .ph { border-radius: 48px 48px 120px 48px / 48px 48px 72px 48px; overflow: hidden; aspect-ratio: 16 / 9; box-shadow: var(--shadow); }
.page-hero .ph img { width: 100%; height: 100%; object-fit: cover; }
.crumb-wrap { background: #fff; }
.crumb { font-size: 14px; color: var(--c-muted); padding: 12px 24px; }
.crumb a { color: var(--c-main); }
@media (max-width: 767px) { .page-hero .wrap { grid-template-columns: 1fr; min-height: 0; } .page-hero .ph { border-radius: 28px; } }

.card { background: #fff; border-radius: var(--r-card); padding: clamp(28px, 2.2vw, 44px); box-shadow: var(--shadow); }
.card + .card { margin-top: 24px; }
.grid2 > .card, .grid3 > .card { margin-top: 0; }
.card h3 { font-size: clamp(22px, 1.4vw, 28px); margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.card h3::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--c-main); flex: 0 0 auto; }
.card p + p { margin-top: 10px; }
.card ul.disc { list-style: disc; padding-left: 22px; }
.card ul.disc li { margin: 4px 0; }
@media (max-width: 640px) { .card { padding: 20px; } .card h3 { font-size: 19px; } }

.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 1023px) { .grid3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .grid2, .grid3 { grid-template-columns: 1fr; } }

/* 表 */
.tbl { width: 100%; border-collapse: collapse; font-size: 16px; }
.tbl th, .tbl td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--c-line); }
.tbl th { width: 30%; background: var(--c-tint); font-weight: 700; white-space: nowrap; }
@media (max-width: 640px) { .tbl th, .tbl td { display: block; width: auto; } .tbl th { border-bottom: 0; padding-bottom: 4px; } }

/* 流れ（詳細版） */
.flow-stage { display: inline-block; background: var(--c-main); color: #fff; border-radius: 999px; padding: .35em 1.4em; font-weight: 700; margin: 8px 0 14px; }
.flow-items { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.flow-item { background: #fff; border-radius: 20px; padding: 20px 22px; box-shadow: var(--shadow-sm); }
.flow-item .k { font-size: 14px; color: var(--c-main); font-weight: 700; letter-spacing: .08em; }
.flow-item .t { font-size: clamp(18px, 1.15vw, 23px); font-weight: 700; margin: 2px 0 6px; }
.flow-item p { font-size: 16px; color: var(--c-muted); }
@media (max-width: 767px) { .flow-items { grid-template-columns: 1fr; } }

/* 免許カード */
.lic { background: #fff; border-radius: 32px; overflow: hidden; box-shadow: var(--shadow); display: grid; grid-template-columns: clamp(260px, 24vw, 460px) minmax(0, 1fr); }
.lic + .lic { margin-top: 24px; }
.lic .ph { min-height: 260px; }
.lic .ph img { width: 100%; height: 100%; object-fit: cover; }
.lic ul.disc { list-style: disc; padding-left: 22px; }
.lic ul.disc li { margin: 4px 0; }
.lic .body { padding: clamp(28px, 2.2vw, 44px) clamp(32px, 2.6vw, 52px); }
.lic h3 { font-size: clamp(24px, 1.5vw, 30px); margin-bottom: 8px; }
.lic h3 small { font-size: 14px; color: var(--c-main); letter-spacing: .12em; display: block; font-weight: 700; }
.lic .spec { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.lic .spec span { background: var(--c-tint); border-radius: 999px; padding: 6px 16px; font-size: 16px; }
.lic .spec span b { color: var(--c-main-dark); }
.lic .foot { margin-top: 14px; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
@media (max-width: 767px) { .lic { grid-template-columns: 1fr; border-radius: 24px; } .lic .ph { min-height: 0; aspect-ratio: 4 / 3; } .lic .body { padding: 20px; } .lic h3 { font-size: 21px; } }

/* 相談ページ */
.routes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.route { background: #fff; border-radius: 32px; padding: 32px 24px; box-shadow: var(--shadow); text-align: center; display: flex; flex-direction: column; gap: 12px; }
.route .ico { width: clamp(76px, 4.8vw, 96px); height: clamp(76px, 4.8vw, 96px); border-radius: 50%; background: var(--c-tint); color: var(--c-main); display: flex; align-items: center; justify-content: center; margin: 0 auto; }
.route h2 { font-size: clamp(20px, 1.3vw, 26px); }
.route p { font-size: 16px; color: var(--c-muted); flex: 1 1 auto; text-align: left; }
.route .tel { font-size: clamp(28px, 1.9vw, 38px); font-weight: 900; display: block; }
@media (max-width: 1023px) { .routes { grid-template-columns: 1fr; } }

.form { display: grid; gap: 18px; }
.form label { display: block; font-weight: 700; margin-bottom: 6px; }
.form fieldset { border: 0; padding: 0; margin: 0; }
.form legend { font-weight: 700; margin-bottom: 6px; padding: 0; }
.form .req { display: inline-block; background: var(--c-main); color: #fff; font-size: 14px; padding: 2px 8px; border-radius: 999px; margin-left: 8px; vertical-align: middle; font-weight: 700; }
.form input[type=text], .form input[type=email], .form input[type=tel], .form textarea, .form select {
  width: 100%; font: inherit; font-size: 16px; padding: 12px 14px; border: 1px solid #ccc; border-radius: 14px; background: #fff;
}
.form textarea { min-height: 140px; }
.form .radios { display: flex; gap: 20px; flex-wrap: wrap; }
.form .radios label { font-weight: 500; }
.form .submit { text-align: center; margin-top: 8px; }

/* =========================================================
   v3（2026-10-05）追加：中越の構成＋大手3校のいいとこどり
   ========================================================= */

/* ---- ヘッダー：右上の小さなリンク群と電話（問い合わせ先ではなく会社情報として） ---- */
.hutil { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: clamp(14px, .8vw, 15px); line-height: 1.5; flex: 0 0 auto; }
.hutil a { color: var(--c-muted); }
.hutil a:hover { color: var(--c-main); }
.hutil .htel2 { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; color: var(--c-text); letter-spacing: .02em; }
.hutil .htel2 svg { color: var(--c-main); }
/* 在校生の方へ：教習中の人が毎回使う入口なので、文字リンクより一段目立たせる */
/* 電話番号とボタンの中心をそろえる（右端そろえだと幅の違いで段差に見えるため） */
.hutil { align-items: center; gap: 4px; }
.hutil a.hstu { display: inline-flex; align-items: center; gap: 5px; padding: 3px 12px 3px 10px; border-radius: 999px; background: #fff; border: 1.5px solid var(--c-main); color: var(--c-main); font-weight: 700; white-space: nowrap; transition: background .2s, color .2s, border-color .2s; }
.hutil a.hstu:hover { background: var(--c-main); border-color: var(--c-main); color: #fff; }
.hutil a.hstu .i { width: 16px; height: 16px; }
.hutil a.hstu .chev { width: .6em; height: .6em; margin-left: 1px; }
.header .hbtns .btn { gap: 6px; }
@media (max-width: 1279px) { .hutil { display: none; } }

/* ---- PC右端の固定タブ（中部日本を参考） ---- */
.side-tabs { position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 45; display: flex; flex-direction: column; gap: 6px; }
.side-tabs a { writing-mode: vertical-rl; display: flex; align-items: center; gap: 8px; padding: 18px 12px; border-radius: 16px 0 0 16px; color: #fff; font-weight: 700; font-size: 16px; letter-spacing: .12em; box-shadow: -4px 4px 14px rgba(0,0,0,.15); transition: padding .2s; }
.side-tabs a:hover { padding-right: 18px; }
.side-tabs a svg { writing-mode: horizontal-tb; }
.side-tabs .st-apply { background: var(--c-main); }
.side-tabs .st-line { background: var(--c-green); }
@media (max-width: 1023px) { .side-tabs { display: none; } }

/* ---- 大見出し（八戸ノ里を参考：英字＋見出し＋キャッチ＋説明） ---- */
.big-head { margin-bottom: clamp(32px, 2.6vw, 52px); }
.big-head.is-center { text-align: center; }
.big-head .en { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .12em; font-size: clamp(15px, 1vw, 19px); margin-bottom: 4px; }
.big-head .ja { font-size: clamp(22px, 1.5vw, 28px); display: inline-block; position: relative; padding-bottom: 12px; }
.big-head .ja::after { content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 2em; height: 4px; border-radius: 2px; background: var(--c-main); }
.big-head:not(.is-center) .ja::after { left: 0; transform: none; }
.big-head .catch2 { font-size: clamp(28px, 2.6vw, 50px); font-weight: 900; line-height: 1.35; margin-top: clamp(16px, 1.2vw, 24px); letter-spacing: .02em; text-wrap: balance; }
.big-head .lead2 { margin: 16px auto 0; color: var(--c-muted); max-width: 46em; text-align: left; }
.big-head.is-center .lead2 { text-align: center; }
@supports (word-break: auto-phrase) { .big-head .catch2, .big-head .lead2 { word-break: auto-phrase; } }
@media (max-width: 640px) { .big-head.is-center .lead2 { text-align: left; } }

.more-btn { display: flex; align-items: center; justify-content: center; gap: 12px; max-width: 560px; margin: clamp(32px, 2.6vw, 48px) auto 0; padding: .9em 2em; border: 2px solid var(--c-main); border-radius: 999px; color: var(--c-main); font-weight: 700; background: #fff; transition: .2s; }
.more-btn .ar { font-size: 1.2em; transition: transform .2s; }
.more-btn:hover { background: var(--c-main); color: #fff; }
.more-btn:hover .ar { transform: translateX(4px); }

/* ---- ピックアップの見出し ---- */
.pickup-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 16px; }
.pickup-head .en { font-family: "Montserrat", var(--font); font-weight: 800; font-size: clamp(22px, 1.6vw, 30px); color: var(--c-main); letter-spacing: .06em; }
.pickup-head .ja { font-weight: 700; color: var(--c-muted); }

/* ---- 選ばれる理由：6枚のタイル ---- */
.reason-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.4vw, 28px); }
.rg { background: var(--c-tint); border-radius: 28px; padding: clamp(24px, 2vw, 40px) 20px; text-align: center; }
.rg-ico { width: clamp(76px, 5vw, 96px); height: clamp(76px, 5vw, 96px); border-radius: 50%; background: #fff; color: var(--c-main); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 12px; box-shadow: var(--shadow-sm); }
.rg-s { color: var(--c-muted); font-size: clamp(15px, .9vw, 17px); }
.rg-b { font-size: clamp(20px, 1.4vw, 28px); font-weight: 900; line-height: 1.35; margin-top: 2px; }
.rg-b b { color: var(--c-main); font-size: 1.25em; margin: 0 .1em; }
@media (max-width: 1023px) { .reason-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .reason-grid { grid-template-columns: 1fr; } .rg { display: grid; grid-template-columns: auto 1fr; text-align: left; align-items: center; gap: 4px 16px; padding: 18px 20px; } .rg-ico { grid-row: span 2; margin: 0; width: 64px; height: 64px; } }

/* ---- 写真の帯（中部日本を参考） ---- */
.photo-strip { background: #fff; padding: 0 0 clamp(40px, 3vw, 64px); overflow: hidden; }
.ps-row { display: flex; gap: clamp(12px, 1.2vw, 24px); justify-content: center; align-items: center; width: 116%; margin-left: -8%; }
.ps { flex: 1 1 0; overflow: hidden; border-radius: 40px 56px 40px 56px; box-shadow: var(--shadow); }
.ps img { width: 100%; height: 100%; object-fit: cover; }
.ps.p1, .ps.p5 { aspect-ratio: 4 / 5; }
.ps.p2, .ps.p4 { aspect-ratio: 1 / 1; transform: translateY(-6%); }
.ps.p3 { aspect-ratio: 5 / 4; flex-grow: 1.3; }
@media (max-width: 767px) { .ps-row { width: 160%; margin-left: -30%; } }

/* ---- スクールメニュー：写真カード ---- */
.lic-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.6vw, 32px); }
.lc { position: relative; display: block; border-radius: 32px; overflow: hidden; background: #fff; box-shadow: var(--shadow); transition: transform .2s; }
.lc:hover { transform: translateY(-4px); }
.lc-ph { display: block; aspect-ratio: 5 / 3; overflow: hidden; }
.lc-ph img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.lc:hover .lc-ph img { transform: scale(1.05); }
.lc-t { display: block; padding: 18px 24px 22px; font-size: clamp(20px, 1.4vw, 26px); font-weight: 900; line-height: 1.3; }
.lc-t small { display: block; font-family: "Montserrat", var(--font); font-size: 14px; color: var(--c-main); letter-spacing: .1em; font-weight: 800; }
.lc-t em { font-style: normal; font-size: max(14px, .62em); color: var(--c-muted); font-weight: 700; margin-left: .6em; }
.lc-ar { position: absolute; right: 22px; bottom: 22px; width: 44px; height: 44px; border-radius: 50%; background: var(--c-main); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.lic-sub { display: flex; justify-content: center; gap: 14px; margin-top: clamp(20px, 1.6vw, 32px); flex-wrap: wrap; }
.pill { display: inline-flex; align-items: center; gap: 10px; background: #fff; border-radius: 999px; padding: .8em 1.8em; font-weight: 700; box-shadow: var(--shadow-sm); }
.pill svg { color: var(--c-main); }
.pill .ar { color: var(--c-main); }
@media (max-width: 767px) { .lic-cards { grid-template-columns: 1fr; } }

/* ---- 教習プラン診断への入口 ---- */
.plan-band { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(24px, 3vw, 64px); align-items: center; background: var(--c-tint); border-radius: 48px; padding: clamp(32px, 3.4vw, 64px); }
.plan-band .en { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .12em; }
.plan-band h2 { font-size: clamp(28px, 2.4vw, 44px); font-weight: 900; line-height: 1.3; margin: 6px 0 14px; }
.pb-btns { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.pb-demo { background: #fff; border-radius: 32px; padding: clamp(24px, 2vw, 36px); box-shadow: var(--shadow); text-align: center; }
.pb-q { font-weight: 900; font-size: clamp(18px, 1.2vw, 22px); }
.pb-q .qn, .pb-ans .an { display: inline-block; background: var(--c-main); color: #fff; border-radius: 999px; padding: 2px 12px; font-size: 14px; margin-right: 8px; vertical-align: middle; }
.pb-ops { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin: 16px 0 8px; }
.pb-ops span { border: 2px solid var(--c-main); color: var(--c-main); border-radius: 999px; padding: 6px 14px; font-weight: 700; font-size: 15px; }
.pb-arrow { color: var(--c-main); font-size: 26px; font-weight: 900; }
.pb-ans { background: var(--c-tint); border-radius: 20px; padding: 14px; font-weight: 900; font-size: clamp(18px, 1.2vw, 22px); }
@media (max-width: 1023px) { .plan-band { grid-template-columns: 1fr; border-radius: 32px; } }

/* ---- 学校紹介：番号つきブロック（中部日本を参考） ---- */
.about-list { display: flex; flex-direction: column; gap: clamp(32px, 3vw, 64px); }
.ab { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 3.4vw, 72px); align-items: center; }
.ab.is-rev .ab-ph { order: 2; }
.ab-ph { border-radius: 48px 64px 48px 64px; overflow: hidden; aspect-ratio: 4 / 3; box-shadow: var(--shadow); }
.ab-ph img { width: 100%; height: 100%; object-fit: cover; }
/* パノラマ：左右にドラッグして見る写真（中越トップの学校紹介。2026-10-30） */
.ab-ph.pano { position: relative; cursor: grab; touch-action: pan-y; -webkit-user-select: none; user-select: none; }
.ab-ph.pano.is-drag { cursor: grabbing; }
.ab-ph.pano .pano-img { position: absolute; top: 0; left: 0; width: auto; max-width: none; height: 100%; object-fit: fill; will-change: transform; -webkit-user-drag: none; }
.ab-ph.pano .pano-ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }   /* パノラマが届くまでの仮の写真 */
.ab-ph.pano:has(.pano-ph) .pano-img { opacity: 0; transition: opacity .35s; }
.ab-ph.pano.is-ready .pano-img { opacity: 1; }
.ab-ph.pano:focus-visible { outline: 3px solid var(--c-main); outline-offset: 4px; }
.pano-hint { position: absolute; left: 50%; bottom: clamp(14px, 1.6vw, 24px); transform: translateX(-50%); display: inline-flex; align-items: center; gap: 10px; padding: 9px 18px; border-radius: 999px; background: rgba(15, 30, 50, .62); color: #fff; font-size: 15px; font-weight: 700; line-height: 1.3; white-space: nowrap; pointer-events: none; transition: opacity .4s; }
.pano.is-used .pano-hint { opacity: 0; }
.pano-hint .pano-sp { display: none; }
@media (hover: none) { .pano-hint .pano-pc { display: none; } .pano-hint .pano-sp { display: inline; } }
@media (max-width: 360px) { .pano-hint { width: max-content; max-width: calc(100% - 20px); white-space: normal; text-align: left; font-size: 14px; padding: 8px 14px; gap: 8px; } }   /* 幅320pxのスマホでも枠からはみ出さない */
@keyframes panoNudge { 0%, 100% { transform: translateX(-4px); } 50% { transform: translateX(4px); } }
.pano-ic { flex: none; animation: panoNudge 1.6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .pano-ic { animation: none; } }
.ab-n { font-family: "Montserrat", var(--font); font-weight: 800; font-size: clamp(56px, 5vw, 96px); line-height: 1; color: var(--c-main); }
.ab-s { color: var(--c-main); font-weight: 700; margin: 10px 0 4px; }
.ab-tx h3 { font-size: clamp(22px, 1.8vw, 34px); font-weight: 900; line-height: 1.4; margin-bottom: 14px; }
@supports (word-break: auto-phrase) { .ab-tx h3 { word-break: auto-phrase; } }
@media (max-width: 767px) { .ab { grid-template-columns: 1fr; } .ab.is-rev .ab-ph { order: 0; } .ab-ph { border-radius: 28px; } }

/* ---- 採用バナー ---- */
.recruit-bnr { display: grid; grid-template-columns: 1.1fr 1fr auto; align-items: center; gap: 24px; background: #fff; border-radius: 40px; overflow: hidden; box-shadow: var(--shadow); padding-right: 32px; transition: transform .2s; }
.recruit-bnr:hover { transform: translateY(-3px); }
.rb-ph { aspect-ratio: 16 / 9; overflow: hidden; }
.rb-ph img { width: 100%; height: 100%; object-fit: cover; }
.rb-tx .en { display: block; font-family: "Montserrat", var(--font); font-weight: 800; font-size: clamp(28px, 2.6vw, 52px); color: var(--c-main); letter-spacing: .06em; line-height: 1.1; }
.rb-tx .ja { display: block; font-weight: 900; font-size: clamp(18px, 1.2vw, 22px); margin: 4px 0 8px; }
.rb-tx .s { color: var(--c-muted); }
.rb-ar { width: 56px; height: 56px; border-radius: 50%; background: var(--c-main); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 700; }
@media (max-width: 767px) { .recruit-bnr { grid-template-columns: 1fr; padding: 0 0 24px; border-radius: 28px; } .rb-tx { padding: 0 24px; } .rb-ar { margin-left: 24px; } }

/* ---- 申込帯（大きなボタン2つ＋QR） ---- */
.cta .en { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .14em; }
.cta-grid { display: grid; grid-template-columns: 1fr 1fr auto; gap: 16px; margin: 28px 0 8px; align-items: stretch; text-align: left; }
.cta-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; border-radius: 28px; padding: clamp(20px, 1.6vw, 30px) clamp(22px, 2vw, 36px); color: #fff; font-weight: 900; font-size: clamp(20px, 1.4vw, 26px); line-height: 1.3; transition: transform .2s, filter .2s; }
.cta-card:hover { transform: translateY(-3px); filter: brightness(1.05); }
.cta-card small { display: block; font-size: max(14px, .6em); font-weight: 700; opacity: .92; margin-bottom: 4px; }
.cta-card .ar { font-size: 1.3em; }
.cta-apply { background: var(--c-main); box-shadow: 0 10px 24px rgba(var(--c-main-rgb), .3); }
.cta-line { background: var(--c-green); box-shadow: 0 10px 24px rgba(6,199,85,.3); }
.cta-qr { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; background: var(--c-tint); border-radius: 28px; padding: 14px 20px; font-size: 14px; color: var(--c-muted); text-align: center; line-height: 1.5; }
.cta-qr img { width: 110px; height: 110px; }
@media (max-width: 1023px) { .cta-grid { grid-template-columns: 1fr 1fr; } .cta-qr { display: none; } }
@media (max-width: 640px) { .cta-grid { grid-template-columns: 1fr; } }

/* ---- 教習プラン：診断チャート ---- */
.chart { max-width: 820px; margin: 0 auto; background: var(--c-tint); border-radius: 40px; padding: clamp(28px, 3vw, 56px); text-align: center; }
.ch-qn { font-family: "Montserrat", var(--font); font-weight: 800; font-size: clamp(36px, 3vw, 56px); color: var(--c-main); line-height: 1; }
.ch-qt { font-size: clamp(22px, 1.8vw, 32px); font-weight: 900; margin: 10px 0 24px; }
.ch-ops { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.ch-ops button { font: inherit; font-weight: 700; font-size: clamp(16px, 1.1vw, 19px); background: #fff; color: var(--c-main); border: 2px solid var(--c-main); border-radius: 999px; padding: 1em 1.2em; cursor: pointer; transition: .2s; }
.ch-ops button:hover { background: var(--c-main); color: #fff; }
.ch-r { background: #fff; border-radius: 28px; padding: clamp(24px, 2.4vw, 40px); box-shadow: var(--shadow); }
.ch-rl { display: inline-block; background: var(--c-main); color: #fff; border-radius: 999px; padding: 3px 16px; font-weight: 700; font-size: 15px; }
.ch-rn { font-size: clamp(24px, 2vw, 36px); font-weight: 900; margin: 12px 0 8px; color: var(--c-main); }
.ch-r .btn { margin-top: 16px; }
.ch-reset { margin-top: 18px; background: none; border: 0; font: inherit; color: var(--c-muted); text-decoration: underline; cursor: pointer; }
.plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.4vw, 28px); }
.pl { background: #fff; border-radius: 28px; padding: clamp(24px, 2vw, 36px); box-shadow: var(--shadow-sm); scroll-margin-top: 120px; }
.pl-n { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .08em; }
.pl h3 { font-size: clamp(22px, 1.5vw, 28px); margin: 4px 0 6px; }
.pl-term { display: inline-block; background: var(--c-tint); border-radius: 999px; padding: 2px 14px; font-weight: 700; color: var(--c-main-dark); }
.pl-for { font-weight: 700; margin: 12px 0 4px; }
.pl-d { color: var(--c-muted); }
.pack { background: #fff; border-radius: 28px; padding: clamp(24px, 2vw, 36px); margin-top: 24px; box-shadow: var(--shadow-sm); }
.pack h3 { display: flex; align-items: center; gap: 10px; font-size: clamp(20px, 1.4vw, 26px); margin-bottom: 8px; }
.pack h3 svg { color: var(--c-main); }
.plan-cta { margin-top: 32px; text-align: center; }
.pc-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 16px; }
@media (max-width: 1023px) { .plan-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .plan-grid { grid-template-columns: 1fr; } }

/* ---- 採用情報 ---- */
.rc-hero { position: relative; background: var(--c-tint); padding: clamp(32px, 3vw, 64px) 0 clamp(64px, 5vw, 110px); overflow: hidden; }
.rc-hero .wrap { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(24px, 3vw, 64px); align-items: center; z-index: 2; }
.rc-tx .en { font-family: "Montserrat", var(--font); font-weight: 800; font-size: clamp(40px, 4vw, 80px); color: var(--c-main); letter-spacing: .04em; line-height: 1; }
.rc-tx h1 { font-size: clamp(28px, 2.6vw, 48px); font-weight: 900; line-height: 1.35; margin: 16px 0; }
.rc-tx p { color: var(--c-muted); margin-bottom: 24px; }
.rc-ph { border-radius: 56px 72px 56px 160px / 56px 72px 56px 110px; overflow: hidden; aspect-ratio: 4 / 3; box-shadow: var(--shadow); }
.rc-ph img { width: 100%; height: 100%; object-fit: cover; }
.msg { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(24px, 3vw, 64px); align-items: center; }
.msg-ph { border-radius: 40px; overflow: hidden; aspect-ratio: 4 / 3; }
.msg-ph img { width: 100%; height: 100%; object-fit: cover; }
.msg-tx p + p { margin-top: 12px; }
.job-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.4vw, 28px); }
.job { background: #fff; border-radius: 28px; padding: clamp(24px, 2vw, 36px); box-shadow: var(--shadow-sm); }
.job-s { color: var(--c-main); font-weight: 700; }
.job h3 { font-size: clamp(22px, 1.5vw, 28px); margin: 4px 0 10px; }
.job-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.job-tags span { background: var(--c-tint); color: var(--c-main-dark); border-radius: 999px; padding: 3px 12px; font-size: 14px; font-weight: 700; }
.ben-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.4vw, 28px); }
.ben { background: var(--c-tint); border-radius: 28px; padding: clamp(22px, 1.8vw, 32px); }
.ben svg { color: var(--c-main); }
.ben h3 { font-size: clamp(19px, 1.2vw, 22px); margin: 8px 0 6px; }
.ben p { color: var(--c-muted); }
.num-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.nm { background: #fff; border-radius: 28px; padding: 24px; text-align: center; box-shadow: var(--shadow-sm); }
.nm-l { color: var(--c-muted); font-weight: 700; }
.nm-v { font-family: "Montserrat", var(--font); font-weight: 800; font-size: clamp(40px, 3.4vw, 64px); color: var(--c-main); line-height: 1.2; }
.nm-v small { font-family: var(--font); font-size: .35em; margin-left: 4px; }
.voice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 1.6vw, 32px); margin-top: clamp(32px, 2.6vw, 52px); }
.voice { background: #fff; border-radius: 32px; overflow: hidden; box-shadow: var(--shadow-sm); display: grid; grid-template-columns: 40% 1fr; }
.vc-ph img { width: 100%; height: 100%; object-fit: cover; }
.vc-tx { padding: clamp(20px, 1.8vw, 32px); }
.vc-s { color: var(--c-main); font-weight: 700; font-size: 15px; }
.vc-tx h3 { font-size: clamp(19px, 1.3vw, 24px); margin: 6px 0 8px; line-height: 1.4; }
.rc-entry { background: #fff; border-radius: 40px; padding: clamp(32px, 3vw, 56px); text-align: center; box-shadow: var(--shadow); }
.rc-entry .en { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .14em; }
.rc-entry h2 { font-size: clamp(24px, 2vw, 36px); margin: 6px 0 12px; }
.rc-entry p { max-width: 40em; margin: 0 auto 20px; text-align: left; }
@media (max-width: 1023px) { .job-grid, .ben-grid { grid-template-columns: repeat(2, 1fr); } .num-grid { grid-template-columns: repeat(2, 1fr); } .voice-grid { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .rc-hero .wrap, .msg { grid-template-columns: 1fr; } .job-grid, .ben-grid { grid-template-columns: 1fr; } .voice { grid-template-columns: 1fr; } .vc-ph { aspect-ratio: 16 / 9; } }

/* ---- お問い合わせ：LINEを主役に ---- */
.line-main { display: grid; grid-template-columns: auto 1fr; gap: clamp(28px, 3vw, 64px); align-items: center; background: var(--c-tint); border-radius: 48px; padding: clamp(28px, 3vw, 56px); }
.lm-qr { background: #fff; border-radius: 28px; padding: 20px; text-align: center; box-shadow: var(--shadow-sm); }
.lm-qr img { width: 220px; height: 220px; margin: 0 auto 8px; }
.lm-qr p { font-size: 14px; color: var(--c-muted); line-height: 1.5; }
.lm-tx .en { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-green); letter-spacing: .14em; }
.lm-tx h2 { font-size: clamp(26px, 2.2vw, 40px); margin: 4px 0 16px; }
.lm-steps { margin: 0 0 22px; padding-left: 1.4em; }
.lm-steps li { margin: 4px 0; font-weight: 700; }
.lm-id { margin: 14px 0 0; }
.lm-id b { white-space: nowrap; font-size: 1.15em; letter-spacing: .04em; }
.apply-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; background: #fff; border: 2px solid var(--c-tint2); border-radius: 32px; padding: 24px clamp(24px, 2.4vw, 44px); margin-top: 24px; }
.ar-s { color: var(--c-main); font-weight: 700; }
.ar-t { font-weight: 900; font-size: clamp(18px, 1.2vw, 22px); }
@media (max-width: 767px) { .line-main { grid-template-columns: 1fr; border-radius: 32px; } .lm-qr { display: none; } .apply-row .btn { width: 100%; } }
/* 色を試す・要確認ボタンは、PCでは右端の申込タブと重ならないよう左下へ */
@media (min-width: 1024px) {
  .rough-toggle { right: auto; left: 12px; }
}
@supports (word-break: auto-phrase) { .cta-card .t, .rb-tx .s, .pb-ans, .ch-ops button { word-break: auto-phrase; } }
@media (max-width: 640px) { .cta-card { font-size: 19px; padding: 18px 20px; gap: 12px; } }


/* ===== v3 レビュー反映（2026-10-05） ===== */
/* お知らせと在校生サポートを横並び（PCの密度を上げる） */
.news-row { display: grid; grid-template-columns: 1.7fr 1fr; gap: clamp(20px, 1.6vw, 32px); align-items: stretch; }
.student-box { background: #fff; border-radius: 40px; padding: clamp(28px, 2.2vw, 44px) clamp(24px, 2.2vw, 44px); box-shadow: var(--shadow); }
.student-box .en { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .12em; font-size: 15px; }
.student-box h2 { font-size: clamp(22px, 1.5vw, 28px); margin-bottom: 10px; }
.student-box a { display: flex; align-items: center; gap: 12px; padding: .65em 0; border-top: 1px dashed var(--c-line); font-weight: 700; }
.student-box a .i { color: var(--c-main); display: inline-flex; }
.student-box a .ar { margin-left: auto; color: var(--c-main); }
.student-box a:hover { color: var(--c-main); }
@media (max-width: 1023px) { .news-row { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .student-box { border-radius: 24px; padding: 20px; } }

/* 3つ並びの説明（教習について・企業理念） */
.about3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.6vw, 32px); }
.a3 { background: var(--c-tint3); border-radius: 32px; padding: clamp(24px, 2.2vw, 40px); }
.a3-ico { display: inline-flex; width: 72px; height: 72px; border-radius: 50%; background: #fff; color: var(--c-main); align-items: center; justify-content: center; box-shadow: var(--shadow-sm); }
.a3-n { font-family: "Montserrat", var(--font); font-weight: 800; font-size: clamp(32px, 2.4vw, 46px); color: var(--c-main); line-height: 1; }
.a3 h3 { font-size: clamp(20px, 1.4vw, 26px); margin: 14px 0 8px; }
@media (max-width: 900px) { .about3 { grid-template-columns: 1fr; } }

/* 診断チャートの結果ボタン */
.ch-btns { display: flex; flex-wrap: wrap; gap: 10px 12px; margin-top: 16px; }
.ch-r .ch-btns .btn { margin-top: 0; }

/* 教習プランは3＋2で中央にそろえる */
.plan-grid { display: flex; flex-wrap: wrap; justify-content: center; }
.plan-grid .pl { flex: 0 1 calc((100% - 2 * clamp(16px, 1.4vw, 28px)) / 3); }
@media (max-width: 1023px) { .plan-grid .pl { flex-basis: calc((100% - clamp(16px, 1.4vw, 28px)) / 2); } }
@media (max-width: 640px) { .plan-grid .pl { flex-basis: 100%; } }

/* 採用：募集要項・1日の流れ */
.req-box { background: #fff; border-radius: 28px; padding: clamp(24px, 2.2vw, 40px); box-shadow: var(--shadow-sm); margin-top: clamp(24px, 2vw, 40px); }
.req-box h3 { font-size: clamp(20px, 1.4vw, 26px); margin-bottom: 14px; }
.day-flow { display: grid; grid-template-columns: repeat(5, 1fr); gap: clamp(12px, 1.2vw, 24px); }
.df { background: var(--c-tint3); border-radius: 28px; padding: clamp(20px, 1.6vw, 30px); }
.df-t { font-family: "Montserrat", var(--font); font-weight: 800; font-size: clamp(24px, 1.8vw, 34px); color: var(--c-main); line-height: 1.1; }
.df-h { font-weight: 900; font-size: clamp(18px, 1.15vw, 22px); margin: 8px 0 6px; }
@media (max-width: 1100px) { .day-flow { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .day-flow { grid-template-columns: 1fr; } }

/* 流れの横並びを900pxまで保つ（中間幅は絵文字アイコンを省いて文字を折り返す） */
@media (max-width: 1340px) and (min-width: 900px) {
  .steps { grid-template-columns: 1fr auto 1fr auto 1fr; gap: 12px; }
  .step-arrow { width: 40px; height: auto; transform: none; margin: 0; }
  .step .ico { display: none; }
  .step .t, .step .t small { white-space: normal; }
}

/* 中型カードの文字が矢印に隠れないよう右に余白 */
.lc-t { padding-right: 84px; }

/* フッター・グループ帯で語の途中で折り返さない */
.footer ul li a { white-space: nowrap; }
.flogo .txt .ja { white-space: nowrap; }
.group-row .card-s { white-space: nowrap; }
@media (max-width: 1365px) and (min-width: 1024px) { .footer .cols { grid-template-columns: 1.5fr 1fr 1fr .8fr; gap: 20px; } .footer .cols > div, .footer .cols > ul { padding: 0 16px; } .flogo .txt .ja { font-size: 22px; } }

/* スマホで語の途中改行・孤立行を防ぐ */
.ch-qt, .rc-hero p, .group-band span, .rc-entry p, .big-head .catch2 { text-wrap: balance; }
@supports (word-break: auto-phrase) { .ch-qt, .rc-hero p, .rc-hero h1, .group-band span, .rc-entry p, .ch-rn, .student-box a, .df-h { word-break: auto-phrase; } }

/* 採用ページは申込帯がないので、グループ帯とフッターの波が重ならないよう下に余白 */
.group:last-of-type { padding-bottom: clamp(140px, 10vw, 200px); }
.lc-t em { display: inline-block; white-space: nowrap; margin-left: 0; margin-right: .6em; }
.lc-t em { margin-left: .4em; }
.lc-t em { display: block; margin: 4px 0 0; }
.pl-for, .pl-d, .job p, .a3 p, .df p { text-wrap: pretty; }
.pl-for { text-wrap: balance; }
@supports (word-break: auto-phrase) { .pl-for { word-break: auto-phrase; } }
/* 2巡目レビュー反映 */
.sec-tint .ben { background: #fff; }
.ch-r { text-align: center; }
.ch-btns { justify-content: center; }
@media (max-width: 640px) { .ch-btns .btn { width: 100%; justify-content: center; } }
@media (max-width: 640px) { .group:last-of-type { padding-bottom: 200px; } }
.tbl .chk { margin-left: 4px; }

/* ===== 合宿ありの校だけ出る申込ボタン（2026-10-09） ===== */
:root { --c-camp: #C55A00; --c-camp-dark: #A04800; }  /* 合宿のオレンジ（白文字で読める濃さ） */
.btn-camp { background: var(--c-camp); color: #fff; box-shadow: 0 6px 16px rgba(197,90,0,.25); }
.btn-camp:hover { background: var(--c-camp-dark); color: #fff; }

/* 1 ヘッダー：広い画面は通学の隣、狭くなると上下（上が通学・下が合宿）、さらに狭いとメニューの中へ */
.hbtns.has-camp { flex-direction: row; gap: 8px; }
@media (max-width: 1700px) {
  .hbtns.has-camp { flex-direction: column; gap: 6px; }
  .hbtns.has-camp .btn { padding: .32em 1.1em; }
}

/* 2 右の固定タブ：通学とLINEの間 */
.side-tabs .st-camp { background: var(--c-camp); }

/* 3 MV：上に通学と合宿を横並び、その下にLINE（逆三角） */
.mv-btns.has-camp { display: grid; grid-template-columns: auto auto; justify-content: start; }
.mv-btns.has-camp .btn-line { grid-column: 1 / -1; justify-self: center; }
@media (max-width: 767px) {
  .mv-btns.has-camp { grid-template-columns: 1fr 1fr; }
  .mv-btns.has-camp .btn { padding: .7em .6em; }
  .mv-btns.has-camp .btn-line { justify-self: stretch; }
}

/* スマホ下の固定バー：通学・合宿・LINEの3つ */
/* スマホ下の固定バー：合宿ありの校は「お申込み」を押すと通学か合宿かを選ぶ画面が出る（案C・2026-10-13） */
.spbar button.btn { font-family: inherit; border: 0; cursor: pointer; }
.spbar .btn::after { content: none; }
.apply-sheet { display: none; }
@media (max-width: 767px) {
  body.apply-open .apply-sheet { display: block; position: fixed; inset: 0; z-index: 70; }
  .apply-sheet .as-bg { position: absolute; inset: 0; background: rgba(20,24,32,.45); }
  .apply-sheet .as-panel { position: absolute; left: 12px; right: 12px; bottom: 12px; background: #fff; border-radius: 24px; padding: 20px 16px 12px; box-shadow: 0 -6px 24px rgba(0,0,0,.18); display: flex; flex-direction: column; gap: 10px; }
  .apply-sheet .as-t { font-weight: 700; font-size: 17px; margin-bottom: 2px; }
  .apply-sheet .btn { width: 100%; justify-content: center; }
  .apply-sheet .as-close { background: none; border: 0; font: inherit; color: var(--c-muted); padding: 10px; cursor: pointer; }
}
/* メニューが畳まれる幅では、申込ボタンを右（メニューの左隣）に寄せる */
@media (max-width: 1279px) { .hbtns { margin-left: auto; } .menu-btn { margin-left: 0; } }

/* ===== 総合レビュー反映（2026-10-13） ===== */
/* 仮置きの欄：要確認を隠しても「見本」と分かるよう、札を付ける */
.dummy { position: relative; }
.dummy::before { content: "見本（内容は準備中）"; position: absolute; top: -14px; right: 16px; z-index: 3; background: #6B7280; color: #fff; font-size: 14px; font-weight: 700; padding: 3px 12px; border-radius: 999px; letter-spacing: .04em; }
body.hide-chk .num-grid { display: none; }

/* メニューが畳まれた幅では、メニューボタンを右端へ（申込ボタンが消える1023px以下も） */
@media (max-width: 1023px) { .menu-btn { margin-left: auto; } }

/* スマホのMV：教習車が写真の中央に来るよう位置を調整 */
@media (max-width: 767px) { .mv-photo img { object-position: 50% 60%; } }

/* スマホ下の固定バーがコピーライトを隠さないように（641〜767pxも） */
@media (max-width: 767px) { .footer { padding-bottom: 88px; } }
/* スマホ横向き（高さが低い画面）でも申込・LINEのバーを出す */
@media (max-width: 1023px) and (max-height: 500px) {
  .spbar { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 55; background: rgba(255,255,255,.96); padding: 6px 12px; border-top: 1px solid var(--c-line); box-shadow: 0 -4px 16px rgba(0,0,0,.06); }
  .spbar .btn { padding: 8px; font-size: 16px; }
  .footer { padding-bottom: 72px; }
  body.apply-open .apply-sheet { display: block; position: fixed; inset: 0; z-index: 70; }
  .apply-sheet .as-bg { position: absolute; inset: 0; background: rgba(20,24,32,.45); }
  .apply-sheet .as-panel { position: absolute; left: 50%; transform: translateX(-50%); width: min(480px, 92vw); bottom: 12px; background: #fff; border-radius: 24px; padding: 16px; display: flex; flex-direction: column; gap: 8px; }
  .apply-sheet .btn { width: 100%; justify-content: center; }
  .apply-sheet .as-close { background: none; border: 0; font: inherit; color: var(--c-muted); padding: 6px; }
}

/* 16px未満だった文字 */
.rg-s { font-size: clamp(16px, .9vw, 17px); }
.ch-ops button { font-size: clamp(16px, 1.1vw, 19px); }
.big-head .en { font-size: clamp(16px, 1vw, 19px); }

/* 語の途中で改行しない */
.access-box li > span:last-child { text-wrap: pretty; }
@supports (word-break: auto-phrase) { .access-box li > span:last-child { word-break: auto-phrase; } }

/* 職種カードの写真 */
.job { overflow: hidden; }
.job-ph { margin: calc(-1 * clamp(24px, 2vw, 36px)) calc(-1 * clamp(24px, 2vw, 36px)) 18px; aspect-ratio: 16 / 9; overflow: hidden; }
.job-ph img { width: 100%; height: 100%; object-fit: cover; }

/* 在校生サポートの満点様バナー */
.student-box a.mt-bnr img { width: 40px; height: 40px; border-radius: 8px; object-fit: cover; flex: 0 0 auto; }

/* Instagram 欄 */
.ig-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(8px, .8vw, 16px); }
.ig-grid a { display: block; aspect-ratio: 1 / 1; border-radius: 20px; overflow: hidden; }
.ig-grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.ig-grid a:hover img { transform: scale(1.05); }
.ig-btn { text-align: center; margin-top: clamp(20px, 1.6vw, 32px); }
@media (max-width: 900px) { .ig-grid { grid-template-columns: repeat(3, 1fr); } }

/* プライバシーポリシー・SDGs */
.pv-lead { margin-bottom: 24px; max-width: 46em; }
.sdgs-list { columns: 2; column-gap: 48px; }
.sdgs-list li { break-inside: avoid; }
@media (max-width: 767px) { .sdgs-list { columns: 1; } }

/* 採用ページ（申込帯なし）でフッター上に青い空白が出ないように */
.group:last-of-type { padding-bottom: clamp(90px, 6vw, 120px); }
.group + .footer { margin-top: 0; padding-top: clamp(80px, 6vw, 110px); }
@media (max-width: 640px) { .group:last-of-type { padding-bottom: 100px; } .group + .footer { padding-top: 90px; } }
/* 会社紹介：コース平面図 */
.course-map { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 2vw, 40px); align-items: center; background: #fff; border-radius: 32px; padding: clamp(24px, 2.2vw, 40px); box-shadow: var(--shadow-sm); margin-top: clamp(28px, 2.4vw, 48px); }
.course-map h3 { font-size: clamp(20px, 1.4vw, 26px); margin-bottom: 8px; }
.course-map img { width: 100%; max-width: 520px; height: auto; display: block; margin: 0 auto; }
@media (max-width: 767px) { .course-map { grid-template-columns: 1fr; } }

/* ===== image2で作った共通アイコン（2026-10-14） ===== */
.pic { display: block; width: 100%; height: auto; }
.rg-ico, .a3-ico, .step .ico { overflow: hidden; background: #fff; }
.a3-ico { width: 88px; height: 88px; }
.student-box a .i .pic { width: 40px; height: 40px; }
.student-box a .i { width: 44px; height: 44px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); align-items: center; justify-content: center; flex: 0 0 auto; }
.pack h3 .pic { width: 44px; height: 44px; }
.ben .pic { width: 76px; height: 76px; border-radius: 18px; background: #fff; box-shadow: var(--shadow-sm); padding: 4px; }
/* アイコンを大きめに見せる */
.rg-ico { width: clamp(92px, 5.8vw, 116px); height: clamp(92px, 5.8vw, 116px); }
.a3-ico { width: 104px; height: 104px; }
.step .ico { width: clamp(72px, 4.6vw, 92px); height: clamp(72px, 4.6vw, 92px); }
@media (max-width: 520px) { .rg-ico { width: 76px; height: 76px; } }

/* ===== SignDSの設定から反映（2026-10-14） ===== */
.plan-note { margin-top: 14px; color: var(--c-muted); }
.card .tt { margin-top: 8px; font-weight: 700; color: var(--c-main-dark); }
.bus-area { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(24px, 2vw, 40px); align-items: stretch; background: #fff; border-radius: 32px; padding: clamp(24px, 2.2vw, 40px); box-shadow: var(--shadow-sm); margin-top: clamp(28px, 2.4vw, 48px); scroll-margin-top: 120px; }
.bus-area h3 { font-size: clamp(20px, 1.4vw, 26px); margin-bottom: 10px; }
.ba-map { border-radius: 20px; overflow: hidden; min-height: 320px; }
.ba-map iframe { width: 100%; height: 100%; min-height: 320px; border: 0; display: block; }
@media (max-width: 767px) { .bus-area { grid-template-columns: 1fr; } }
.bus-area ul.disc { list-style: disc; padding-left: 22px; } .bus-area ul.disc li { margin: 4px 0; }

/* ===== 総合レビュー（10/14）反映 ===== */
/* 見本の札：カード1枚ずつに小さく付ける */
.job.dummy::before, .df.dummy::before, .voice.dummy::before, .msg-tx.dummy::before { content: "見本"; top: 10px; right: 10px; padding: 2px 10px; }
.job.dummy, .voice.dummy { overflow: visible; }
.job.dummy .job-ph { border-radius: 28px 28px 0 0; }
body.hide-chk .num-block { display: none; }
/* 16px未満だった文字 */
@media (max-width: 1360px) { .gnav { font-size: 16px; gap: 6px; } .hbtns .btn { font-size: 16px; } }
.student-box .en { font-size: 16px; }
.footer .addr { font-size: 1em; }
.pb-ops span { font-size: 16px; }
/* 高齢者講習などの写真が縦に伸びすぎないように */
.lic .ph { max-height: 520px; }
.lic .ph img { object-position: 50% 35%; }
/* 採用の申込欄の英字ラベルを中央に */
.rc-entry .en { text-align: center; }
/* 送迎地図の枠を高く */
.ba-map, .ba-map iframe { min-height: 380px; }
.msg-tx.dummy::before { top: -34px; left: 0; right: auto; }

/* ===== トップ動画（現行サイトと同じ動画。ある校だけ流す） ===== */
.mv-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 38% 50%; opacity: 0; transition: opacity .6s; pointer-events: none; }
.mv-video.is-on { opacity: 1; }
@media (max-width: 767px) {
  .mv-photo { position: relative; }
  .mv-video { inset: 0 0 auto 0; aspect-ratio: 4 / 3; height: auto; border-radius: 0 0 48px 0; object-position: 50% 60%; }
}
/* 流れの矢印：点線と先端を同じ高さにそろえた形に（2026-10-14） */
.step-arrow { width: clamp(56px, 3.6vw, 72px); height: auto; color: var(--c-main); opacity: .45; justify-self: center; align-self: center; }
@media (max-width: 1340px) and (min-width: 900px) { .step-arrow { width: 44px; } }
@media (max-width: 899px) { .step-arrow { width: 32px; height: auto; transform: rotate(90deg); margin: -2px auto -2px 16px; } }
.ig-grid a { aspect-ratio: 3 / 4; border-radius: 16px; box-shadow: var(--shadow-sm); }

/* ===== 在校生サポート・お知らせ一覧（2026-10-14） ===== */
.sup-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.6vw, 32px); }
.sup { background: var(--c-tint3); border-radius: 32px; padding: clamp(24px, 2.2vw, 40px); display: flex; flex-direction: column; gap: 10px; align-items: flex-start; scroll-margin-top: 120px; }
.sup-ico img { width: 88px; height: 88px; border-radius: 20px; }
.sup h3 { font-size: clamp(20px, 1.4vw, 26px); }
.sup-note { color: var(--c-muted); }
.sup .btn { margin-top: auto; }
@media (max-width: 1023px) { .sup-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .sup-grid { grid-template-columns: 1fr; } }
.sup-news { background: #fff; border-radius: 40px; padding: clamp(28px, 2.2vw, 44px) clamp(28px, 3vw, 60px); box-shadow: var(--shadow); }
.nw-list { display: flex; flex-direction: column; gap: 20px; max-width: 920px; }
.nw { background: var(--c-tint3); border-radius: 28px; padding: clamp(24px, 2vw, 36px); scroll-margin-top: 120px; }
.nw-d { display: inline-block; background: #fff; border-radius: 999px; padding: 2px 16px; font-weight: 700; color: var(--c-main-dark); }
.nw h2 { font-size: clamp(20px, 1.4vw, 26px); margin: 10px 0 8px; }

/* アイコンは丸く切り抜かず、角丸の白い台に全体を見せる（2026-10-14） */
.rg-ico, .a3-ico { border-radius: 24%; padding: 6px; overflow: visible; }
.step .ico { background: none; border-radius: 0; overflow: visible; }
.student-box a .i { border-radius: 12px; overflow: hidden; }
.sup-ico { width: 96px; height: 96px; border-radius: 22px; background: #fff; box-shadow: var(--shadow-sm); padding: 4px; }
.sup-ico .pic, .sup-ico img { width: 100%; height: 100%; border-radius: 16px; }
/* 装飾の丸は半透明にして、ただの飾りと分かるように */
.bub { opacity: .5; }
/* トップ動画で人の顔が上下に切れないよう、MVを少し下に広げる（2026-10-14） */
@media (min-width: 1024px) { .mv-photo { height: clamp(620px, 47vw, 960px); } }
@media (min-width: 1024px) { .mv-video { object-position: 38% 30%; } }
/* フッターの公式SNS：各サービスのマークと色 */
.footer .sns .c svg { width: 52%; height: 52%; }
.footer .sns .c-ig { color: #E4405F; }
.footer .sns .c-fb { color: #0866FF; }
.footer .sns .c-line { color: #06C755; }
.footer .sns .c-yt { color: #FF0000; }
.footer .sns a { font-size: 15px; }

/* SDGs：目標アイコンごとに取組みを並べる（現行ページと同じ構成） */
.sg-poster { max-width: 760px; margin: 0 auto clamp(32px, 3vw, 56px); }
.sg-poster img { width: 100%; height: auto; border-radius: 16px; }
.sg-list { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 1.6vw, 28px); }
.sg { display: grid; grid-template-columns: clamp(96px, 7vw, 132px) 1fr; gap: clamp(16px, 1.4vw, 24px); align-items: start; background: #fff; border-radius: 28px; padding: clamp(20px, 1.8vw, 32px); box-shadow: var(--shadow-sm); }
.sg img { width: 100%; height: auto; border-radius: 6px; }
.sg ul.disc { list-style: disc; padding-left: 20px; }
.sg ul.disc li { margin: 4px 0; }
@media (max-width: 900px) { .sg-list { grid-template-columns: 1fr; } }
/* 高齢者講習：免許更新までの流れ図 */
.senior-flow { background: #fff; border-radius: 32px; padding: clamp(24px, 2.4vw, 44px); box-shadow: var(--shadow); margin-top: 24px; }
.senior-flow h3 { font-size: clamp(22px, 1.5vw, 28px); margin-bottom: 8px; }
.senior-flow p { margin-bottom: 16px; }
.senior-flow picture, .senior-flow img { display: block; width: 100%; height: auto; }
.senior-flow img { max-width: 1400px; margin: 0 auto; }
@media (max-width: 767px) { .senior-flow img { max-width: 560px; } }

/* ===== 高齢者講習：説明と流れ図を1つの枠に（2026-10-15） ===== */
.senior-box { background: #fff; border-radius: 32px; box-shadow: var(--shadow); overflow: hidden; scroll-margin-top: 120px; }
.sb-top { display: grid; grid-template-columns: clamp(260px, 24vw, 460px) minmax(0, 1fr); }
.sb-top .ph { max-height: 420px; overflow: hidden; }
.sb-top .ph img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.sb-top .body { padding: clamp(28px, 2.2vw, 44px) clamp(32px, 2.6vw, 52px); }
.senior-box h3 { font-size: clamp(24px, 1.5vw, 30px); margin-bottom: 8px; }
.senior-box h3 small { font-size: 14px; color: var(--c-main); letter-spacing: .12em; display: block; font-weight: 700; }
.senior-box .spec { display: flex; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.senior-box .spec span { background: var(--c-tint); border-radius: 999px; padding: 6px 16px; font-size: 16px; }
.senior-box .spec span b { color: var(--c-main-dark); }
.sb-note { color: var(--c-muted); margin-top: 8px; }
.sb-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.4vw, 24px); padding: 0 clamp(24px, 2.6vw, 52px); }
.sb-item { background: var(--c-tint3); border-radius: 24px; padding: clamp(20px, 1.8vw, 30px); }
.sb-item h4, .sb-flow h4 { font-size: clamp(19px, 1.25vw, 23px); margin-bottom: 10px; color: var(--c-main-dark); }
.sb-item p + p { margin-top: 8px; }
.sb-item dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin-top: 10px; }
.sb-item dt { font-weight: 700; white-space: nowrap; }
.sb-fee { margin-top: 10px; }
.sb-fee b { color: var(--c-main-dark); font-size: 1.15em; }
.sb-flow { padding: clamp(24px, 2.4vw, 44px) clamp(24px, 2.6vw, 52px) 8px; }
.sb-flow picture, .sb-flow img { display: block; width: 100%; height: auto; }
.sb-flow img { max-width: 1400px; margin: 0 auto; }
.senior-box > .chk-note, .senior-box > .foot { padding: 0 clamp(24px, 2.6vw, 52px); }
.senior-box > .foot { margin: 14px 0 clamp(24px, 2.4vw, 40px); display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
@media (max-width: 1023px) { .sb-grid { grid-template-columns: 1fr; } .sb-top { grid-template-columns: 1fr; } .sb-top .ph { max-height: 300px; } }
@media (max-width: 767px) { .sb-flow img { max-width: 560px; } .sb-item dl { grid-template-columns: 1fr; } }
.sb-item dl { grid-template-columns: 1fr; gap: 2px; }
.sb-item dt { margin-top: 8px; color: var(--c-text); }
.sb-item dt::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--c-main); margin-right: 8px; vertical-align: middle; }
.sb-item dd { margin: 0 0 0 16px; }
.sb-grid { margin-top: clamp(24px, 2.4vw, 44px); }
.senior-box > .chk-note:last-child { padding-bottom: clamp(24px, 2.4vw, 40px); }

/* ===== 申込欄のボタンを小さく、中央にまとめる（2026-10-15） ===== */
.cta-grid { grid-template-columns: minmax(0, 380px) minmax(0, 380px) auto; justify-content: center; gap: 14px; }
.cta-card { font-size: clamp(18px, 1.15vw, 21px); padding: 16px 22px; border-radius: 22px; gap: 12px; }
.cta-card .ic svg { width: 28px; height: 28px; }
.cta-card small { font-size: 14px; }
.cta-card .ar { font-size: 1.1em; }
.cta-qr { padding: 10px 16px; border-radius: 22px; }
.cta-qr img { width: 88px; height: 88px; }
@media (max-width: 1023px) { .cta-grid { grid-template-columns: minmax(0, 360px) minmax(0, 360px); } }
@media (max-width: 640px) {
  .cta-grid { grid-template-columns: minmax(0, 420px); }
  .cta-card { font-size: 18px; padding: 14px 18px; }
  .cta { padding: 32px 18px 28px; border-radius: 28px; }
  /* 申込欄とフッターのロゴがくっつかないように */
  .footer { padding-top: 168px; }
}
/* 文中のリンクだと分かる見た目 */
.tx-link { color: var(--c-main); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; margin-left: .4em; }
.tx-link::after { content: " ›"; }
.tx-link:hover { color: var(--c-main-dark); }
@media (min-width: 641px) { .footer { padding-top: 172px; } }
.cta-grid { align-items: center; } .cta-qr { flex-direction: row; gap: 12px; padding: 10px 14px; } .cta-qr img { width: 72px; height: 72px; } .cta-qr span { text-align: left; }

/* ===== 教習プラン：挿絵・料金・おすすめつきのカード（2026-10-15） ===== */
.plc-list { display: flex; flex-direction: column; gap: clamp(18px, 1.6vw, 28px); }
.plc { display: grid; grid-template-columns: clamp(220px, 22vw, 380px) minmax(0, 1fr); gap: clamp(20px, 2vw, 40px); align-items: center; background: #fff; border-radius: 32px; padding: clamp(20px, 2vw, 36px); box-shadow: var(--shadow-sm); scroll-margin-top: 120px; }
.plc-ph { border-radius: 22px; overflow: hidden; background: var(--c-tint3); }
.plc-ph img { width: 100%; height: auto; display: block; }
.plc-n { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .08em; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.plc-badge { font-family: var(--font); letter-spacing: 0; font-size: 14px; background: #F5B800; color: #3A2A00; border-radius: 999px; padding: 2px 12px; }
.plc h3 { font-size: clamp(24px, 1.7vw, 32px); margin: 4px 0 8px; }
.plc-lead { margin-bottom: 14px; }
.pc-rows { display: flex; flex-wrap: wrap; gap: 10px 16px; margin-bottom: 14px; }
.pc-row { display: flex; align-items: center; gap: 10px; background: var(--c-tint); border-radius: 14px; padding: 8px 16px; }
.pc-k { font-size: 14px; font-weight: 700; color: var(--c-main-dark); white-space: nowrap; }
.pc-v { font-weight: 700; }
.pc-price { font-size: clamp(22px, 1.6vw, 28px); color: var(--c-main); font-family: "Montserrat", var(--font); white-space: nowrap; }
.pc-price small { font-size: 14px; color: var(--c-muted); font-family: var(--font); margin-left: 2px; }
.plc-rec { background: #FFF8E1; border-radius: 18px; padding: 14px 18px; }
.rec-t { font-weight: 900; color: #7A5A00; margin-bottom: 6px; }
.plc-rec ul { display: grid; gap: 4px; }
.plc-rec li { position: relative; padding-left: 26px; }
.plc-rec li::before { content: ""; position: absolute; left: 2px; top: .45em; width: 14px; height: 8px; border-left: 3px solid var(--c-main); border-bottom: 3px solid var(--c-main); transform: rotate(-45deg); }
@media (max-width: 767px) { .plc { grid-template-columns: 1fr; } .plc-ph { max-width: 420px; } }
/* あんしんパック */
.pack2 { display: grid; grid-template-columns: clamp(200px, 18vw, 300px) minmax(0, 1fr); gap: clamp(20px, 2vw, 40px); align-items: center; background: #fff; border-radius: 32px; padding: clamp(20px, 2vw, 36px); box-shadow: var(--shadow-sm); margin-top: clamp(28px, 2.4vw, 44px); }
.pk-ph { border-radius: 22px; overflow: hidden; }
.pk-ph img { width: 100%; height: auto; display: block; }
.pack2 h3 { font-size: clamp(24px, 1.7vw, 32px); margin-bottom: 8px; }
.pk-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 14px 0; }
.pk-opt { background: var(--c-tint); border-radius: 18px; padding: 14px 18px; }
.pk-name { font-weight: 900; }
.pk-price { font-size: clamp(20px, 1.4vw, 26px); font-weight: 800; color: var(--c-main); font-family: "Montserrat", var(--font); }
.pk-price small { font-size: 14px; color: var(--c-muted); font-family: var(--font); }
.pk-tag { display: inline-block; margin-top: 6px; background: #F5B800; color: #3A2A00; font-size: 14px; font-weight: 700; border-radius: 999px; padding: 2px 12px; }
@media (max-width: 767px) { .pack2 { grid-template-columns: 1fr; } .pk-opts { grid-template-columns: 1fr; } .pk-ph { max-width: 360px; } }
.plc-ph, .pk-ph { background: #fff; box-shadow: inset 0 0 0 1px var(--c-tint2); }
.day-flow { grid-template-columns: repeat(6, 1fr); } @media (max-width: 1100px) { .day-flow { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 640px) { .day-flow { grid-template-columns: 1fr; } }

/* ===== トップの最初の画面：選ぶ理由を3つ（2026-10-15） ===== */
.mv-points { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.mv-points li { position: relative; padding-left: 28px; font-weight: 700; font-size: clamp(16px, 1.05vw, 19px); }
.mv-points li::before { content: ""; position: absolute; left: 0; top: .2em; width: 20px; height: 20px; border-radius: 50%; background: var(--c-main); }
.mv-points li::after { content: ""; position: absolute; left: 6px; top: .45em; width: 8px; height: 5px; border-left: 2.5px solid #fff; border-bottom: 2.5px solid #fff; transform: rotate(-45deg); }

/* ===== 語の途中で改行しない（全ページ・2026-10-15） ===== */
body { line-break: strict; }
/* 本文は行をいっぱいまで使う（pretty は行を早めに折って右に大きな空きを作るため使わない） */
p, li, dd, td, th { text-wrap: wrap; }
h1, h2, h3, h4 { text-wrap: balance; }
@supports (word-break: auto-phrase) { body { word-break: auto-phrase; } }

/* 高齢者講習の3つの説明は、横に広い行で読ませる（狭い3列だと文節ごとの折り返しで右が空く） */
.sb-grid { grid-template-columns: 1fr; gap: 14px; }
.sb-item { display: grid; grid-template-columns: clamp(180px, 16vw, 260px) minmax(0, 1fr); gap: 4px 28px; align-items: start; }
.sb-item > h4 { grid-row: 1 / span 6; margin: 0; }
.sb-item > *:not(h4) { grid-column: 2; }
@media (max-width: 767px) { .sb-item { grid-template-columns: 1fr; } .sb-item > h4 { grid-row: auto; margin-bottom: 8px; } .sb-item > *:not(h4) { grid-column: 1; } }

/* ===== アイコンは透過。白い台を置かず、そのまま背景に乗せる（2026-10-15） ===== */
.rg-ico, .a3-ico, .step .ico, .student-box a .i, .sup-ico { background: none; box-shadow: none; border-radius: 0; padding: 0; overflow: visible; }
.ben .pic { background: none; box-shadow: none; border-radius: 0; padding: 0; width: 84px; height: 84px; }
.pack h3 .pic, .pic { border-radius: 0; }
.sup-ico .pic, .sup-ico img { border-radius: 0; }
.sup-ico img[src*="mantensama"] { border-radius: 16px; }

/* ===== スクールメニュー：V09下層モックのデザイン（2026-10-15 テスト） ===== */
.lp-hero { position: relative; overflow: hidden; background: linear-gradient(180deg, #DCEBFA 0%, var(--c-tint) 100%); padding: clamp(28px, 3vw, 56px) 0 clamp(70px, 6vw, 110px); }
.lp-hero-in { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(24px, 3vw, 60px); align-items: center; }
.lp-en, .lp-head .en, .lp-tag { font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .12em; font-size: clamp(14px, .95vw, 17px); }
.lp-hero h1 { font-size: clamp(36px, 4vw, 72px); font-weight: 900; letter-spacing: .02em; line-height: 1.2; margin: 6px 0 14px; }
.lp-hero .lead { font-size: clamp(16px, 1.1vw, 20px); color: var(--c-text); }
.lp-hero-ph { width: clamp(260px, 26vw, 460px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 8px solid #fff; box-shadow: var(--shadow); }
.lp-hero-ph img { width: 100%; height: 100%; object-fit: cover; }
.lp-hero-wave { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: clamp(40px, 5vw, 80px); z-index: 1; }
.lp-head { margin-bottom: clamp(24px, 2vw, 40px); }
.lp-head h2 { font-size: clamp(30px, 2.6vw, 48px); font-weight: 900; display: inline-block; position: relative; padding-bottom: 14px; margin-top: 2px; }
.lp-head h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 1.6em; height: 5px; border-radius: 3px; background: var(--c-main); }
.lp-card { background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(22px, 2.2vw, 40px); }
.lp-tag { margin-bottom: 4px; }
.lp-card h3 { font-size: clamp(24px, 1.9vw, 36px); font-weight: 900; line-height: 1.3; margin-bottom: 12px; }
.lp-circle { aspect-ratio: 1; border-radius: 50%; overflow: hidden; flex: 0 0 auto; box-shadow: var(--shadow-sm); }
.lp-circle img { width: 100%; height: 100%; object-fit: cover; }
.lp-wide { display: grid; grid-template-columns: clamp(220px, 22vw, 360px) minmax(0, 1fr); gap: clamp(24px, 3vw, 56px); align-items: center; }
.lp-spec { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 16px 0; }
.lp-sp { background: var(--c-tint); border-radius: 18px; padding: 10px 12px; text-align: center; display: flex; flex-direction: column; justify-content: center; }
.lp-sp .k { font-size: 14px; font-weight: 700; color: var(--c-main-dark); }
.lp-sp .v { font-weight: 900; font-size: clamp(17px, 1.15vw, 21px); line-height: 1.35; }
.lp-sp .v small { display: block; font-size: 14px; font-weight: 500; color: var(--c-muted); }
.lp-note { background: var(--c-tint3); border: 1px solid var(--c-tint2); border-radius: 18px; padding: 12px 18px; color: var(--c-text); }
.lp-pair { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(18px, 2vw, 32px); margin-top: clamp(18px, 2vw, 32px); }
.lp-top { display: grid; grid-template-columns: clamp(150px, 13vw, 230px) minmax(0, 1fr); gap: clamp(16px, 1.6vw, 28px); align-items: center; }
.lp-half .lp-spec { grid-template-columns: 1fr 1fr; margin-bottom: 0; }
.lp-half h3::after, .lp-wide h3::after { content: ""; display: block; width: 2em; height: 4px; border-radius: 2px; background: var(--c-main); margin-top: 8px; }
.lp-senior { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(22px, 2.6vw, 48px); align-items: center; }
.lp-sr-ph { border-radius: 24px; overflow: hidden; aspect-ratio: 4 / 3; }
.lp-sr-ph img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.lp-tbl { width: 100%; border-collapse: collapse; margin: 14px 0; }
.lp-tbl th, .lp-tbl td { padding: 10px 14px; border-bottom: 1px solid var(--c-line); text-align: left; }
.lp-tbl tr:first-child th, .lp-tbl tr:first-child td { border-top: 1px solid var(--c-line); }
.lp-tbl th { width: 7.5em; color: var(--c-main-dark); font-weight: 700; white-space: nowrap; }
.lp-pill-note { background: var(--c-tint); border-radius: 999px; padding: 10px 20px; text-align: center; font-weight: 700; }
.lp-sub { display: flex; align-items: center; gap: 14px; margin: clamp(36px, 3vw, 56px) 0 18px; }
.lp-sub-in { margin: 0 0 14px; }
.lp-sub-ic { width: 56px; height: 56px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.lp-sub-in .lp-sub-ic { background: var(--c-tint); box-shadow: none; }
.lp-sub-ic .pic { width: 40px; height: 40px; }
.lp-sub h3 { font-size: clamp(22px, 1.7vw, 32px); font-weight: 900; margin: 0; }
.lp-three { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 1.6vw, 28px); }
.lp-mini { background: #fff; border-radius: 28px; box-shadow: var(--shadow-sm); padding: clamp(22px, 2vw, 34px); text-align: center; }
.lp-mini-ic { width: 120px; height: 120px; border-radius: 50%; background: var(--c-tint); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.lp-mini-ic .pic { width: 84px; height: 84px; }
.lp-mini h4 { font-size: clamp(20px, 1.4vw, 26px); font-weight: 900; padding-bottom: 10px; margin-bottom: 12px; border-bottom: 2px dotted var(--c-tint2); }
.lp-mini p { text-align: left; display: inline-block; }
.lp-two { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(18px, 2vw, 32px); margin-top: clamp(28px, 2.6vw, 48px); align-items: start; }
.lp-steps { display: flex; flex-direction: column; gap: 10px; margin: 14px 0; }
.lp-steps li { display: flex; gap: 14px; align-items: center; background: var(--c-tint3); border-radius: 18px; padding: 12px 16px; }
.lp-steps .n { width: 40px; height: 40px; border-radius: 50%; background: var(--c-main); color: #fff; font-weight: 900; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.lp-steps b { display: block; font-size: 18px; }
.lp-div { border-top: 1px dashed var(--c-tint2); margin-top: 12px; padding-top: 12px; }
.lp-fee { display: block; width: fit-content; margin: 16px auto; background: var(--c-main); color: #fff; border-radius: 999px; padding: 10px 40px; font-weight: 700; box-shadow: 0 6px 16px rgba(var(--c-main-rgb), .25); }
.lp-fee b { font-size: 1.25em; margin-left: 6px; }
.lp-flow { margin-top: clamp(28px, 2.6vw, 48px); text-align: center; }
.lp-flow h3 { display: inline-block; position: relative; padding-bottom: 12px; }
.lp-flow h3::after { content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 2em; height: 4px; border-radius: 2px; background: var(--c-main); }
.lp-flow picture, .lp-flow img { display: block; width: 100%; height: auto; }
.lp-flow img { max-width: 1400px; margin: 8px auto 0; }
@media (max-width: 1023px) {
  .lp-spec { grid-template-columns: 1fr 1fr; }
  .lp-pair, .lp-two, .lp-senior { grid-template-columns: 1fr; }
  .lp-three { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .lp-hero-in { grid-template-columns: 1fr; }
  .lp-hero-ph { width: min(280px, 70vw); margin: 0 auto; order: -1; }
  .lp-wide, .lp-top { grid-template-columns: 1fr; }
  .lp-circle { width: min(240px, 66vw); margin: 0 auto; }
  .lp-flow img { max-width: 560px; }
  .lp-tbl th { width: 6em; }
}
.lp-steps { padding-left: 0; list-style: none; }

/* ===== スクールメニュー 2回目（2026-10-15） ===== */
/* 車種の写真：丸をやめて角丸。全景が入る 5:3 */
.lp-photo { border-radius: 24px; overflow: hidden; aspect-ratio: 5 / 3; box-shadow: var(--shadow-sm); }
.lp-photo img { width: 100%; height: 100%; object-fit: cover; }
.lp-wide { grid-template-columns: clamp(260px, 30vw, 460px) minmax(0, 1fr); }
.lp-top { grid-template-columns: 1fr; gap: 16px; }
.lp-half { display: flex; flex-direction: column; }
.lp-half .lp-spec { margin-top: auto; padding-top: 16px; }
/* 高さをそろえる */
.lp-pair, .lp-three { align-items: stretch; }
.lp-two { align-items: stretch; }
.lp-exam { display: flex; flex-direction: column; }
.lp-exam .lp-fee { margin-top: auto; }
.lp-exam > p:first-of-type + .lp-steps, .lp-exam .lp-div { }
/* 高齢者講習を1つの白い枠に。中のまとまりは淡い色の面で区切る */
.lp-senior-box { background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(22px, 2.4vw, 44px); }
.lp-senior { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(22px, 2.6vw, 48px); align-items: center; }
.lp-senior-box .lp-sub { margin: clamp(32px, 2.8vw, 52px) 0 16px; }
.lp-senior-box .lp-mini, .lp-senior-box .lp-exam { background: var(--c-tint3); box-shadow: none; border-radius: 24px; padding: clamp(20px, 2vw, 32px); }
.lp-senior-box .lp-steps li { background: #fff; }
.lp-senior-box .lp-note { background: #fff; }
.lp-senior-box .lp-flow { margin-top: clamp(32px, 2.8vw, 52px); text-align: center; }
.lp-flow h3 { font-size: clamp(22px, 1.7vw, 32px); font-weight: 900; }
/* アイコンは透過のまま、丸い台を置かない */
.lp-sub-ic, .lp-sub-in .lp-sub-ic, .lp-mini-ic { background: none; box-shadow: none; border-radius: 0; }
.lp-sub-ic { width: 52px; height: 52px; }
.lp-sub-ic .pic { width: 52px; height: 52px; }
.lp-mini-ic { width: auto; height: auto; }
.lp-mini-ic .pic { width: 104px; height: 104px; }
@media (max-width: 1023px) { .lp-senior { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .lp-wide { grid-template-columns: 1fr; } }

/* ===== 申込欄：モックの形（大きなピル型ボタン、LINEにQRを内蔵） ===== */
.cta-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 1.6vw, 28px); margin: 28px auto 8px; max-width: 1040px; text-align: left; }
.cta-pill { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; border-radius: 999px; padding: 16px 30px 16px 28px; color: #fff; font-weight: 900; font-size: clamp(19px, 1.35vw, 24px); line-height: 1.3; box-shadow: 0 10px 24px rgba(0,0,0,.12); transition: transform .2s, filter .2s; min-height: 92px; }
.cta-pill:hover { transform: translateY(-3px); filter: brightness(1.05); }
.cta-pill small { display: block; font-size: 14px; font-weight: 700; opacity: .92; }
.cta-pill .ic { width: 56px; height: 56px; display: inline-flex; align-items: center; justify-content: center; }
.cta-pill .ic svg { width: 40px; height: 40px; }
.cta-pill .ar { font-size: 1.6em; font-weight: 400; line-height: 1; }
.cta-pill.cta-apply { background: linear-gradient(90deg, var(--c-main-dark), var(--c-main)); }
.cta-pill.cta-line { background: var(--c-green); grid-template-columns: auto minmax(0, 1fr) auto auto; }
.cta-pill.cta-line .ic { background: #fff; border-radius: 50%; color: var(--c-green); }
.cta-pill.cta-line .ic svg { width: 34px; height: 34px; }
.cta-pill .qr { background: #fff; border-radius: 12px; padding: 4px; margin-left: 6px; border-left: 0; }
.cta-pill .qr img { width: 64px; height: 64px; display: block; }
@media (max-width: 1023px) { .cta-pill .qr { display: none; } .cta-pill.cta-line { grid-template-columns: auto minmax(0, 1fr) auto; } }
@media (max-width: 767px) { .cta-grid2 { grid-template-columns: 1fr; max-width: 460px; } .cta-pill { min-height: 76px; padding: 12px 22px 12px 16px; font-size: 18px; } .cta-pill .ic { width: 44px; height: 44px; } }
.lp-senior h3 { font-size: clamp(24px, 1.9vw, 36px); font-weight: 900; line-height: 1.3; margin-bottom: 12px; }

/* ===== スクールメニューの形を、ほかの下層ページにも（2026-10-15） ===== */
/* 見出し：左寄せの見出しは大きく太く、下に青い線 */
body:not(.pg-index) .big-head:not(.is-center) .ja { font-size: clamp(30px, 2.6vw, 48px); font-weight: 900; padding-bottom: 14px; }
body:not(.pg-index) .big-head:not(.is-center) .ja::after { width: 1.6em; height: 5px; border-radius: 3px; }
body:not(.pg-index) .big-head .en { font-size: clamp(14px, .95vw, 17px); }
body:not(.pg-index) .big-head.is-center .ja { font-size: clamp(22px, 1.7vw, 30px); font-weight: 900; }
/* カード：角丸32px・影。中の見出しは太く大きく */
body:not(.pg-index) .card { border-radius: 32px; box-shadow: var(--shadow); padding: clamp(22px, 2.2vw, 40px); }
body:not(.pg-index) .card h3 { font-size: clamp(20px, 1.5vw, 28px); font-weight: 900; }
/* 表：見出し列に色を塗らず、青い文字と罫線で見せる */
body:not(.pg-index) .tbl th { background: none; color: var(--c-main-dark); width: 9em; padding: 12px 14px; }
body:not(.pg-index) .tbl td { padding: 12px 14px; }
body:not(.pg-index) .tbl tr:first-child th, body:not(.pg-index) .tbl tr:first-child td { border-top: 1px solid var(--c-line); }
@media (max-width: 640px) { body:not(.pg-index) .tbl th { width: 6.5em; white-space: normal; } }
/* 3枚並びの説明カード：アイコンを中央に、見出しの下に点線 */
body:not(.pg-index) .a3 { text-align: center; display: flex; flex-direction: column; align-items: center; }
body:not(.pg-index) .a3 .a3-ico { width: 104px; height: 104px; margin-bottom: 4px; }
body:not(.pg-index) .a3 h3 { width: 100%; padding-bottom: 10px; border-bottom: 2px dotted var(--c-tint2); font-weight: 900; }
body:not(.pg-index) .a3 p { text-align: left; }
/* カードを並べたら高さをそろえる */
body:not(.pg-index) .grid2, body:not(.pg-index) .about3, body:not(.pg-index) .sup-grid, body:not(.pg-index) .flow-items, body:not(.pg-index) .ben-grid, body:not(.pg-index) .job-grid, body:not(.pg-index) .sg-list { align-items: stretch; }
body:not(.pg-index) .sup { justify-content: flex-start; }
/* 在校生サポート：アイコンを大きく、見出しの下に点線 */
.pg-support .sup-ico { width: 96px; height: 96px; }
.pg-support .sup h3 { width: 100%; padding-bottom: 8px; border-bottom: 2px dotted var(--c-tint2); font-weight: 900; }
/* 教習の流れ：段階のピルを大きく */
.pg-about .flow-stage { font-size: clamp(16px, 1.1vw, 19px); padding: 6px 20px; }
.pg-about .flow-item .t { font-weight: 900; }
/* 会社紹介：アクセス・送迎バス・コース平面図を1つの枠に */
.acc-frame .access-box, .acc-frame .bus-area, .acc-frame .course-map { background: var(--c-tint3); box-shadow: none; }
.acc-frame .bus-area, .acc-frame .course-map { margin-top: 20px; }
.tarsk-link { display: inline-flex; align-items: center; transition: opacity .2s; } .tarsk-link:hover { opacity: .7; } .tarsk-link img { height: 1.6em; width: auto; }

/* ===== トップの入口カード：モックに合わせ写真を大きく。白くなるのは左側約1/5（2026-10-15） ===== */
.camp a img { left: 0; width: 100%;
  -webkit-mask-image: none; mask-image: none; object-position: 65% 40%; }
.camp a:not(.text-only)::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.85) 14%, rgba(255,255,255,0) 32%); }
.camp a .t { max-width: 56%; text-shadow: 0 0 10px #fff, 0 0 4px #fff; }
.camp a .t small { font-size: clamp(15px, .85vw, 17px); }
.camp a.text-only .t { text-shadow: none; }
/* 矢印：丸の中央に、太めの「>」を大きく */
.camp a .arrow { width: clamp(46px, 2.8vw, 56px); height: clamp(46px, 2.8vw, 56px); padding: 0; font-size: 0; display: flex; align-items: center; justify-content: center; }
.camp a .arrow svg { width: 46%; height: 46%; display: block; margin-left: 2px; }
@media (max-width: 767px) { .camp a img { width: 100%; } .camp a .t { max-width: 62%; } }

/* お知らせの見出しアイコン：透過のイラストをそのまま */
.sec-head .ico.ico-pic { background: none; width: 56px; height: 56px; border-radius: 0; }
.sec-head .ico.ico-pic .pic { width: 56px; height: 56px; }
.camp a:not(.text-only)::before { background: linear-gradient(90deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.88) 20%, rgba(255,255,255,.45) 34%, rgba(255,255,255,0) 46%); }
.camp a .t { text-shadow: 0 0 12px #fff, 0 0 6px #fff, 0 0 2px #fff; }

/* ===== 矢印「＞」を全ページで1つの形に（2026-10-16） =====
   太さのそろった線の「＞」。文字の高さの中央に置き、文字との間は .4em */
:root { --chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E"); }
.chev { display: inline-block; width: .8em; height: .8em; flex: 0 0 auto; vertical-align: -.08em; background: currentColor;
  -webkit-mask: var(--chev) center / contain no-repeat; mask: var(--chev) center / contain no-repeat; }
a .chev, .btn .chev { margin-left: .4em; }
.chev-crumb { width: .7em; height: .7em; margin: 0 .5em; opacity: .55; }
/* ボタン・リンクの後ろに付く「＞」も同じ形 */
.btn::after, .drawer nav a::after, .footer ul li a::after, .tx-link::after {
  content: ""; display: inline-block; width: .8em; height: .8em; margin-left: .4em; vertical-align: -.08em; background: currentColor;
  -webkit-mask: var(--chev) center / contain no-repeat; mask: var(--chev) center / contain no-repeat; font-size: inherit; }
.footer ul li a::after { width: .7em; height: .7em; opacity: .85; }
.drawer nav a::after { float: right; margin-top: .3em; color: var(--c-main); }
.spbar .btn::after, .btn-line::after { content: none; }
/* 丸の中の「＞」：丸の中央に、丸の4割の大きさ */
.camp a .arrow .chev, .lc-ar .chev, .rb-ar .chev { width: 42%; height: 42%; margin: 0 0 0 6%; vertical-align: 0; }
.lc-ar, .rb-ar { font-size: 0; }
/* 一覧の行末の「＞」 */
.news-list .ar, .student-box a .ar { display: inline-flex; align-items: center; color: var(--c-main); font-size: 18px; }
.news-list .ar .chev, .student-box a .ar .chev { margin-left: 0; }
.more-btn .ar { display: inline-flex; font-size: 1em; }
.more-btn .ar .chev { margin-left: 0; }
.pill .ar { display: inline-flex; font-size: 1em; }
/* 申込欄（CTA）の「＞」は文字のすぐ後ろへ */
.cta-pill { grid-template-columns: auto auto 1fr; }
.cta-pill.cta-line { grid-template-columns: auto auto 1fr auto; }
.cta-pill .ar { font-size: 1em; display: inline-flex; align-items: center; justify-self: start; align-self: end; margin-bottom: .2em; }
.cta-pill .ar .chev { width: .9em; height: .9em; margin-left: .1em; }
@media (max-width: 1023px) { .cta-pill.cta-line { grid-template-columns: auto auto 1fr; } }
/* CTA：「＞」は文字のすぐ後ろ（同じ行の中央） */
.cta-pill, .cta-pill.cta-line { grid-template-columns: auto minmax(0, 1fr) auto; }
.cta-pill:not(.cta-line) { grid-template-columns: auto minmax(0, 1fr); }
.cta-pill .t .chev { width: .8em; height: .8em; margin-left: .35em; vertical-align: -.06em; }
.cta-pill .qr { justify-self: end; }
@media (max-width: 1023px) { .cta-pill.cta-line { grid-template-columns: auto minmax(0, 1fr); } }
/* ボタン内の「＞」は少し大きめにして文字の中央へ */
.btn::after { width: .75em; height: .75em; margin-left: .45em; vertical-align: -.05em; }
.btn { align-items: center; }
/* ボタン内の「＞」：ボタンの隙間（gap）だけ空けて文字に寄せ、大きさは文字の8割 */
.btn::after { width: .8em; height: .8em; margin-left: -.2em; }
/* 右端の固定タブ：マウスを乗せた方だけが左へ少し出る（幅を変えないので、もう片方は動かない） */
.side-tabs { align-items: flex-end; }
.side-tabs a { transition: transform .2s, box-shadow .2s; }
.side-tabs a:hover { padding-right: 12px; transform: translateX(-6px); box-shadow: -6px 6px 18px rgba(0,0,0,.2); }
/* 右端は画面にくっつけたまま、乗せた方だけ幅を広げて左へ出す */
.side-tabs a { transition: padding .2s, box-shadow .2s; }
.side-tabs a:hover { transform: none; padding-right: 18px; }
/* 在校生サポート：教習期限 */
.sup-limit { background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(24px, 2.4vw, 44px); }
.lim-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 16px; }
.lim { background: var(--c-tint3); border-radius: 22px; padding: 18px 20px; }
.lim-k { font-size: 14px; font-weight: 700; color: var(--c-main-dark); }
.lim-v { font-size: clamp(18px, 1.3vw, 22px); font-weight: 900; margin: 4px 0; }
.lim-v b { color: var(--c-main); }
.lim-d { color: var(--c-muted); }
@media (max-width: 900px) { .lim-grid { grid-template-columns: 1fr; } }
/* 入口カード：3枚とも写真（全校共通の画像）。中央の診断チャートは青い札で目印 */
.camp a img { object-position: 70% 50%; }
.camp a .cp-badge { position: relative; z-index: 2; display: inline-block; background: var(--c-main); color: #fff; font-size: 14px; font-weight: 700; border-radius: 999px; padding: 3px 14px; margin-bottom: 10px; }
.camp a.cp-chart .t { color: var(--c-main); }
.camp a .cp-badge { white-space: nowrap; } @media (max-width: 1365px) and (min-width: 1024px) { .camp a { min-height: 250px; } }
/* あんしんパック：「約4割の方が選択」を右上の丸いバッジに */
.pk-opt { position: relative; }
.pk-opt .pk-tag { position: absolute; top: -18px; right: 14px; margin: 0; width: 88px; height: 88px; border-radius: 50%; padding: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  background: #F5B800; color: #3A2A00; font-size: 13px; font-weight: 700; line-height: 1.25;
  box-shadow: 0 6px 14px rgba(245,184,0,.35); transform: rotate(8deg); border: 3px solid #fff; }
.pk-opt .pk-tag b { display: block; font-size: 22px; font-weight: 900; line-height: 1.1; }
.pk-opts { margin-top: 26px; }
.pk-opt:has(.pk-tag) .pk-name, .pk-opt:has(.pk-tag) .pk-price, .pk-opt:has(.pk-tag) .pk-desc { padding-right: 84px; }
.pk-opt:has(.pk-tag) .pk-desc { padding-right: 0; }
.pk-price small { white-space: nowrap; }
@media (max-width: 767px) {
  .pk-opt .pk-tag { width: 72px; height: 72px; top: -26px; right: 10px; font-size: 12px; }
  .pk-opt .pk-tag b { font-size: 18px; }
  .pk-opt:has(.pk-tag) .pk-name, .pk-opt:has(.pk-tag) .pk-price { padding-right: 64px; }
}
/* 「約4割」バッジ：横長のピル型を少し傾けて、カード右上の角に置く */
.pk-opt .pk-tag { width: auto; height: auto; flex-direction: row; gap: 2px; padding: 7px 16px 8px; border-radius: 999px;
  top: -20px; right: 16px; font-size: 14px; white-space: nowrap; align-items: baseline; }
.pk-opt .pk-tag b { display: inline; font-size: 20px; line-height: 1; }
.pk-opt:has(.pk-tag) .pk-name { padding-right: 0; }
.pk-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pk-opt:has(.pk-tag) .pk-price { padding-right: 0; }
@media (max-width: 767px) {
  .pk-opt .pk-tag { width: auto; height: auto; top: -20px; right: 12px; font-size: 13px; padding: 6px 14px 7px; }
  .pk-opt .pk-tag b { font-size: 18px; }
  .pk-opt:has(.pk-tag) .pk-name { padding-right: 0; }
  .pk-opts { grid-template-columns: minmax(0, 1fr); }
  .pk-opt:has(.pk-tag) .pk-price { padding-right: 0; }
}
/* あんしんパック：image2の案（2026-10-16）。欄の横幅に上限を付け、料金を大きく、カードに薄い影、バッジにキラッとした線 */
.pk-opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.2vw, 20px); max-width: 960px; margin-top: 30px; }
.pk-opt { padding: clamp(16px, 1.4vw, 24px) clamp(18px, 1.6vw, 28px); border: 1px solid rgba(11,107,216,.08); box-shadow: 0 8px 20px rgba(11,107,216,.10); }
.pk-name { font-size: clamp(16px, 1.1vw, 19px); }
.pk-price { font-size: clamp(22px, 1.9vw, 32px); line-height: 1.3; margin: 2px 0 4px; }
/* キラッとした線：バッジの右上の角を中心に、放射状に3本 */
.pk-opt .pk-tag::after { content: ""; position: absolute; right: -17px; top: -15px; width: 22px; height: 22px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23F5B800' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M3.6 9.1 4.8 2.2M8.4 11.6 13.3 6.7M10.9 16.4 17.8 15.2'/%3E%3C/svg%3E") no-repeat center / contain; }
/* タブレット幅（2列のままカードが狭い）：バッジと料金を少し小さく */
@media (min-width: 768px) and (max-width: 1100px) {
  .pk-opt .pk-tag { font-size: 12px; padding: 5px 11px 6px; right: 10px; }
  .pk-opt .pk-tag b { font-size: 16px; }
  .pk-price { font-size: 20px; }
  .pk-price small { font-size: 12px; }
  .pk-opt { padding: 16px; }
}
@media (max-width: 767px) {
  .pk-opts { grid-template-columns: minmax(0, 1fr); max-width: none; gap: 22px; }
  .pk-price { font-size: 22px; }
}
@media (min-width: 768px) and (max-width: 819px) { .pk-opts { grid-template-columns: minmax(0, 1fr); } }
/* カードが狭い幅で「保証」だけが次の行に落ちないよう、文節で折り返す */
.pk-desc { text-wrap: balance; }
@supports (word-break: auto-phrase) { .pk-desc { word-break: auto-phrase; } }

/* ===== 教習について：入所から卒業まで（若い人向け・矢印でつなぐカード） 2026-10-16 ===== */
.fl2 { --fl-gi: var(--c-main); --fl-ga: #13A89E; --fl-ke: #F5B800; margin-top: 8px; }
.fl2-head { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 16px; }
.fl2-no { display: inline-block; font-family: "Montserrat", var(--font); font-weight: 800; font-size: 14px; letter-spacing: .1em; color: #fff; background: var(--c-main); border-radius: 999px; padding: 5px 14px; margin: 0; }
.fl2-head h3 { font-size: clamp(22px, 1.6vw, 28px); font-weight: 900; margin: 0; }
.fl2-head p { margin: 0; color: var(--c-muted); font-size: 16px; font-weight: 700; }
.fl2-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px; }
.fl2-card { position: relative; background: #fff; border-radius: 22px; padding: 22px 22px 20px; box-shadow: var(--shadow-sm); }
.fl2-card .pic { position: absolute; top: 14px; right: 14px; width: 56px; height: 56px; }
.fl2-chip { display: inline-block; font-size: 14px; font-weight: 800; border-radius: 999px; padding: 3px 14px; }
.fl2-chip.c-in { background: var(--c-tint); color: var(--c-main); }
.fl2-chip.c-gi { background: var(--fl-gi); color: #fff; }
.fl2-chip.c-ga { background: var(--fl-ga); color: #fff; }
.fl2-chip.c-ke { background: var(--fl-ke); color: #3A2A00; }
.fl2-card .t { font-size: clamp(18px, 1.2vw, 22px); font-weight: 900; line-height: 1.45; margin: 12px 64px 8px 0; }
.fl2-card .t small { font-size: 14px; font-weight: 700; color: var(--c-muted); white-space: nowrap; }
.fl2-card .num { font-family: "Montserrat", var(--font); font-size: 1.6em; color: var(--c-main); margin: 0 2px; line-height: 1; }
.fl2-card p:not(.t) { font-size: 16px; color: var(--c-muted); margin: 0; }
/* カードの間の矢印（右向きの丸） */
.fl2-card:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: -38px; width: 32px; height: 32px; transform: translateY(-50%);
  background: var(--c-main) no-repeat center / 14px; border-radius: 50%; box-shadow: 0 4px 10px rgba(11,107,216,.25);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E"); z-index: 1; }
/* 段階の間の下向き矢印 */
.fl2-down { width: 64px; height: 30px; margin: 18px auto; background: no-repeat center / contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 30' fill='none' stroke='%230B6BD8' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 5l24 20L56 5' opacity='.35'/%3E%3C/svg%3E"); }
/* ゴール */
.fl2-goal { display: flex; align-items: center; gap: 18px; background: linear-gradient(120deg, var(--c-main), #3A8DF0); color: #fff; border-radius: 26px; padding: 22px clamp(20px, 2.4vw, 36px); box-shadow: 0 10px 24px rgba(11,107,216,.25); }
.fl2-goal .pic { width: 72px; height: 72px; flex: none; background: #fff; border-radius: 50%; padding: 8px; }
.fl2-goal .fl2-no { background: #fff; color: var(--c-main); }
.fl2-goal .t { font-size: clamp(26px, 2vw, 34px); font-weight: 900; margin: 4px 0 2px; }
.fl2-goal p:not(.t):not(.fl2-no) { margin: 0; font-size: 16px; }
/* MT */
.fl2-mt { margin-top: 28px; background: #fff; border-radius: 22px; padding: 20px 24px; box-shadow: var(--shadow-sm); }
.fl2-mt-h { display: inline-block; font-size: 14px; font-weight: 800; color: var(--c-main); background: var(--c-tint); border-radius: 999px; padding: 3px 14px; margin: 0; }
.fl2-mt .t { font-size: clamp(18px, 1.2vw, 22px); font-weight: 900; margin: 10px 0 6px; }
.fl2-mt .t .chev { color: var(--c-main); }
.fl2-mt p:not(.t):not(.fl2-mt-h):not(.chk-note) { font-size: 16px; color: var(--c-muted); margin: 0; }
/* タブレット：カードが狭いのでアイコンを小さく */
@media (min-width: 768px) and (max-width: 1100px) {
  .fl2-row { gap: 36px; }
  .fl2-card { padding: 18px 16px; }
  .fl2-card .pic { width: 44px; height: 44px; top: 12px; right: 12px; }
  .fl2-card .t { margin-right: 0; margin-top: 14px; }
  .fl2-card:not(:last-child)::after { right: -32px; width: 28px; height: 28px; }
}
/* スマホ：縦に並べ、矢印は下向き */
@media (max-width: 767px) {
  .fl2-row { grid-template-columns: minmax(0, 1fr); gap: 34px; }
  .fl2-card:not(:last-child)::after { top: auto; right: auto; bottom: -32px; left: 50%; width: 28px; height: 28px; transform: translateX(-50%) rotate(90deg); }
  .fl2-card .pic { width: 48px; height: 48px; }
  .fl2-goal { padding: 18px; gap: 14px; }
  .fl2-goal .pic { width: 56px; height: 56px; }
}
/* あんしんパック：文字は14px未満にしない（補足文の下限） */
.pk-opt .pk-tag { font-size: 14px; }
@media (min-width: 768px) and (max-width: 1100px) {
  .pk-opt .pk-tag { font-size: 14px; padding: 5px 10px 6px; right: 8px; }
  .pk-opt .pk-tag b { font-size: 17px; }
  .pk-price small { font-size: 14px; }
}

/* ===== 教習について：教習の流れ（image2の案 2026-10-16） =====
   1200px以上：4列を横に並べ、→でつなぐ
   768〜1199px：段階ごとに横長の帯にして縦に積む（帯の中は3つ横並び）
   767px以下：縦に積み、項目は1行ずつ */
.fl3-top { position: relative; text-align: center; margin-bottom: clamp(24px, 2.6vw, 44px); }
.fl3-top .en { font-family: "Montserrat", var(--font); font-weight: 800; letter-spacing: .16em; color: var(--c-main); margin: 0; }
.fl3-top .en::before, .fl3-top .en::after { content: ""; display: inline-block; width: 16px; height: 16px; vertical-align: -2px; margin: 0 10px; background: no-repeat center / contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23F5B800' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 3l2 6M10 2v6M15 3l-2 6'/%3E%3C/svg%3E"); }
.fl3-top h2 { font-size: clamp(32px, 3.4vw, 52px); font-weight: 900; margin: 4px 0 10px; line-height: 1.25; }
.fl3-catch { display: inline-block; background: #F5B800; color: #2A1E00; font-weight: 900; font-size: clamp(16px, 1.3vw, 22px); border-radius: 999px; padding: 6px 28px; margin: 0; }
/* 道と車の飾り（PCのみ） */
.fl3-road { position: absolute; left: 0; right: 0; bottom: 6px; height: 40px; pointer-events: none;
  background: no-repeat center / 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 40' preserveAspectRatio='none' fill='none' stroke='%230B6BD8' stroke-width='3' stroke-dasharray='10 10' stroke-linecap='round' opacity='.5'%3E%3Cpath d='M0 30 C150 0 250 0 330 22 M670 22 C760 0 860 0 1000 30'/%3E%3C/svg%3E"); }
.fl3-road .pic { position: absolute; right: 7%; bottom: 16px; width: 64px; height: 64px; }
/* 教習の流れ：車が点線に沿って左から右へ走り、右端まで行ったら左端からまた出てくる（見出しの裏はくぐる）。
   位置は点線（viewBox 0〜1000 × 0〜40）の曲線から計算した値。動きを減らす設定の人には止めて見せる */
.fl3-road .pic { right: auto; left: 0; bottom: 0; animation: fl3-drive 16s linear infinite; will-change: left, bottom, transform; }
@keyframes fl3-drive {
  0.0% { left: 0.07%; bottom: 3.1px; transform: translateX(-50%) rotate(-8.4deg) scaleX(-1); opacity: 0; }
  4.0% { left: 3.01%; bottom: 8.7px; transform: translateX(-50%) rotate(-7.6deg) scaleX(-1); opacity: 1; }
  8.0% { left: 5.95%; bottom: 13.7px; transform: translateX(-50%) rotate(-6.8deg) scaleX(-1); opacity: 1; }
  12.0% { left: 8.95%; bottom: 18.2px; transform: translateX(-50%) rotate(-5.7deg) scaleX(-1); opacity: 1; }
  16.0% { left: 11.99%; bottom: 21.9px; transform: translateX(-50%) rotate(-4.5deg) scaleX(-1); opacity: 1; }
  20.0% { left: 14.98%; bottom: 24.6px; transform: translateX(-50%) rotate(-3.1deg) scaleX(-1); opacity: 1; }
  24.0% { left: 17.98%; bottom: 26.2px; transform: translateX(-50%) rotate(-1.5deg) scaleX(-1); opacity: 1; }
  28.0% { left: 21.02%; bottom: 26.6px; transform: translateX(-50%) rotate(0.4deg) scaleX(-1); opacity: 1; }
  32.0% { left: 24.03%; bottom: 25.5px; transform: translateX(-50%) rotate(2.7deg) scaleX(-1); opacity: 1; }
  36.0% { left: 27.04%; bottom: 22.7px; transform: translateX(-50%) rotate(5.3deg) scaleX(-1); opacity: 1; }
  40.0% { left: 30.03%; bottom: 18.0px; transform: translateX(-50%) rotate(8.2deg) scaleX(-1); opacity: 1; }
  44.0% { left: 32.96%; bottom: 11.1px; transform: translateX(-50%) rotate(11.5deg) scaleX(-1); opacity: 0; }
  56.0% { left: 67.05%; bottom: 11.1px; transform: translateX(-50%) rotate(-10.2deg) scaleX(-1); opacity: 0; }
  60.0% { left: 69.96%; bottom: 17.4px; transform: translateX(-50%) rotate(-7.8deg) scaleX(-1); opacity: 1; }
  64.0% { left: 72.97%; bottom: 22.1px; transform: translateX(-50%) rotate(-5.4deg) scaleX(-1); opacity: 1; }
  68.0% { left: 76.00%; bottom: 25.1px; transform: translateX(-50%) rotate(-3.1deg) scaleX(-1); opacity: 1; }
  72.0% { left: 78.99%; bottom: 26.5px; transform: translateX(-50%) rotate(-0.9deg) scaleX(-1); opacity: 1; }
  76.0% { left: 82.00%; bottom: 26.4px; transform: translateX(-50%) rotate(1.0deg) scaleX(-1); opacity: 1; }
  80.0% { left: 85.04%; bottom: 25.0px; transform: translateX(-50%) rotate(2.8deg) scaleX(-1); opacity: 1; }
  84.0% { left: 88.04%; bottom: 22.5px; transform: translateX(-50%) rotate(4.4deg) scaleX(-1); opacity: 1; }
  88.0% { left: 91.06%; bottom: 18.9px; transform: translateX(-50%) rotate(5.8deg) scaleX(-1); opacity: 1; }
  92.0% { left: 94.02%; bottom: 14.4px; transform: translateX(-50%) rotate(7.0deg) scaleX(-1); opacity: 1; }
  96.0% { left: 97.05%; bottom: 9.0px; transform: translateX(-50%) rotate(8.1deg) scaleX(-1); opacity: 1; }
  100.0% { left: 99.93%; bottom: 3.1px; transform: translateX(-50%) rotate(9.0deg) scaleX(-1); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .fl3-road .pic { animation: none; left: auto; right: 7%; bottom: 16px; transform: none; }
}
.fl3 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; align-items: stretch; }
.fl3-col { position: relative; background: #fff; border-radius: 26px; padding: 22px 18px 20px; box-shadow: var(--shadow-sm); display: flex; flex-direction: column; }
/* 列の間の矢印 */
.fl3-col:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: -34px; width: 28px; height: 28px; transform: translateY(-50%); background: no-repeat center / contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none' stroke='%230B6BD8' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 14h20M16 7l7 7-7 7'/%3E%3C/svg%3E"); }
.fl3-head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; margin-bottom: 14px; }
.fl3-num { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--c-main); color: #fff; font-family: "Montserrat", var(--font); font-weight: 800; font-size: 22px; }
.fl3-head h3 { font-size: clamp(22px, 1.7vw, 28px); font-weight: 900; margin: 0; color: var(--c-main); }
.fl3-sub { flex-basis: 100%; text-align: center; background: #F5B800; color: #2A1E00; font-weight: 800; font-size: 14px; border-radius: 999px; padding: 4px 12px; }
.fl3-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.fl3-item { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 12px; align-items: center; background: var(--c-tint); border-radius: 18px; padding: 14px; }
.fl3-item .pic { width: 56px; height: 56px; }
.fl3-item .t { font-weight: 900; font-size: 17px; line-height: 1.45; margin: 0; }
.fl3-item .t small { display: inline-block; font-size: 14px; font-weight: 700; color: var(--c-muted); white-space: nowrap; }
.fl3-item .num { font-family: "Montserrat", var(--font); font-size: 1.5em; color: var(--c-main); margin: 0 2px; line-height: 1; }
.fl3 .d { font-size: 15px; color: var(--c-muted); margin: 2px 0 0; line-height: 1.6; }
/* 細かい注意：カードの下に小さく */
.fl3-notes { list-style: none; margin: 14px 0 0; padding: 12px 4px 0; border-top: 1px dashed #C9D9EE; display: grid; gap: 6px; }
.fl3-notes li { position: relative; padding-left: 14px; font-size: 14px; line-height: 1.6; color: var(--c-muted); }
.fl3-notes li::before { content: ""; position: absolute; left: 2px; top: .65em; width: 5px; height: 5px; border-radius: 50%; background: #9DB8DA; }
/* ゴール */
.fl3-goal-body { display: flex; flex-direction: column; gap: 12px; flex: 1; }
.fl3-goal-ph { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 20px; display: block; }
.fl3-goal-t { display: block; text-align: center; background: #F5B800; color: #2A1E00; font-weight: 900; font-size: clamp(26px, 2.2vw, 36px); border-radius: 999px; padding: 4px 16px; margin: 0 0 8px; }
.fl3-goal .d { font-size: 16px; color: var(--c-ink, #1F2937); text-align: center; text-wrap: balance; }
@supports (word-break: auto-phrase) { .fl3-goal .d, .fl3-item .d, .fl3-notes li { word-break: auto-phrase; } }
/* MT */
.fl3-mt { display: flex; align-items: center; gap: 18px; margin-top: 28px; background: #fff; border-radius: 999px; padding: 16px 36px; box-shadow: var(--shadow-sm); }
.fl3-mt .pic { flex: none; width: 56px; height: 56px; }
.fl3-mt .t { font-weight: 900; font-size: clamp(17px, 1.3vw, 21px); margin: 0; }
.fl3-mt .t .chev { color: var(--c-main); }
.fl3-mt .d { font-size: 15px; color: var(--c-muted); margin: 4px 0 0; }

/* 768〜1199px：段階ごとの横長の帯 */
@media (max-width: 1199px) {
  .fl3-road { display: none; }
  .fl3 { grid-template-columns: minmax(0, 1fr); gap: 44px; }
  .fl3-col { display: grid; grid-template-columns: 170px minmax(0, 1fr); column-gap: 22px; align-items: center; padding: 22px; }
  .fl3-col:not(:last-child)::after { top: auto; right: auto; left: 50%; bottom: -38px; transform: translateX(-50%) rotate(90deg); }
  .fl3-head { flex-direction: column; align-items: flex-start; margin: 0; }
  .fl3-sub { flex-basis: auto; text-align: left; }
  .fl3-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fl3-item { grid-template-columns: minmax(0, 1fr); align-content: start; align-self: stretch; gap: 8px; }
  .fl3-item .pic { width: 48px; height: 48px; }
  .fl3-notes { grid-column: 2; }
  .fl3-goal-body { flex-direction: row; align-items: center; gap: 22px; }
  .fl3-goal-ph { width: 46%; max-width: 360px; }
  .fl3-goal-body > div { flex: 1; }
  .fl3-goal .d { text-align: left; }
  .fl3-goal-t { display: inline-block; padding: 4px 28px; }
  .fl3-mt { border-radius: 26px; padding: 18px 22px; }
}
/* 767px以下：縦に積む */
@media (max-width: 767px) {
  .fl3 { gap: 40px; }
  .fl3-col { display: flex; padding: 18px 16px; }
  .fl3-head { flex-direction: row; align-items: center; margin-bottom: 12px; }
  .fl3-num { width: 38px; height: 38px; font-size: 19px; }
  .fl3-items { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .fl3-item { grid-template-columns: 44px minmax(0, 1fr); gap: 10px; padding: 10px 12px; align-items: center; }
  .fl3-item .pic { width: 44px; height: 44px; }
  .fl3-item .t { font-size: 16px; }
  .fl3-notes { grid-column: auto; }
  .fl3-goal-body { flex-direction: column; }
  .fl3-goal-ph { width: 100%; max-width: none; }
  .fl3-goal .d { text-align: center; }
  .fl3-goal-t { display: block; }
  .fl3-mt { align-items: flex-start; gap: 12px; padding: 16px; }
  .fl3-mt .pic { width: 44px; height: 44px; }
}
/* フッター：1024〜1365pxでSNS欄が右にはみ出していたので、列を縮められるようにしてSNSは折り返す */
.footer .sns { flex-wrap: wrap; }
@media (max-width: 1365px) and (min-width: 1024px) {
  .footer .cols { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, .9fr); }
  .footer .sns { gap: 10px 12px; }
}
/* 教習の流れ：4列は1360px以上だけ（それより狭いと1列が細すぎる）。4列のときは項目の余白とアイコンを小さめに */
@media (min-width: 1200px) and (max-width: 1359px) {
  .fl3-road { display: none; }
  .fl3 { grid-template-columns: minmax(0, 1fr); gap: 44px; }
  .fl3-col { display: grid; grid-template-columns: 170px minmax(0, 1fr); column-gap: 22px; align-items: center; padding: 22px; }
  .fl3-col:not(:last-child)::after { top: auto; right: auto; left: 50%; bottom: -38px; transform: translateX(-50%) rotate(90deg); }
  .fl3-head { flex-direction: column; align-items: flex-start; margin: 0; }
  .fl3-sub { flex-basis: auto; text-align: left; }
  .fl3-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fl3-item { grid-template-columns: 48px minmax(0, 1fr); align-self: stretch; }
  .fl3-item .pic { width: 48px; height: 48px; }
  .fl3-notes { grid-column: 2; }
  .fl3-goal-body { flex-direction: row; align-items: center; gap: 22px; }
  .fl3-goal-ph { width: 46%; max-width: 360px; }
  .fl3-goal-body > div { flex: 1; }
  .fl3-goal .d { text-align: left; }
  .fl3-goal-t { display: inline-block; padding: 4px 28px; }
  .fl3-mt { border-radius: 26px; }
}
@media (min-width: 1360px) {
  .fl3-col { padding: 20px 14px 18px; }
  .fl3-item { grid-template-columns: 44px minmax(0, 1fr); gap: 10px; padding: 12px; }
  .fl3-item .pic { width: 44px; height: 44px; }
}
/* 帯のときの見出し列：サブの黄色ラベルが2行に割れないよう幅を確保 */
@media (min-width: 768px) and (max-width: 1359px) {
  .fl3-col { grid-template-columns: 210px minmax(0, 1fr); }
  .fl3-sub { white-space: nowrap; }
}
/* 768〜1023px：見出しを帯の上に置き、項目に横幅を回す（左に見出し列を取ると項目が細すぎる） */
@media (min-width: 768px) and (max-width: 1023px) {
  .fl3-col { display: flex; flex-direction: column; align-items: stretch; }
  .fl3-head { flex-direction: row; align-items: center; margin-bottom: 14px; }
  .fl3-goal-body { flex-direction: row; }
}
/* スマホ：帯用の中央そろえを打ち消して、見出し・項目をカード幅いっぱいに */
@media (max-width: 767px) {
  .fl3-col { align-items: stretch; }
  .fl3-head { justify-content: flex-start; }
}
/* 注意書きの中の太字（現行サイトで太字の検定曜日）は濃い色で目立たせる */
.fl3-notes b { color: var(--c-ink, #1F2937); font-weight: 800; }
/* とても広い画面（2000px以上）：トップの写真帯が画面幅に合わせて巨大になるので、幅2300pxで止めて中央に置く */
@media (min-width: 1984px) {
  .ps-row { width: 2300px; margin-left: calc(50% - 1150px); }
}

/* フッターSNS：3つが1行に収まるよう、丸と間隔を少し小さく（1024px以上） */
@media (min-width: 1024px) {
  .footer .sns { gap: 10px; flex-wrap: nowrap; }
  .footer .sns .c { width: clamp(46px, 2.9vw, 58px); height: clamp(46px, 2.9vw, 58px); }
}
@media (min-width: 1024px) and (max-width: 1365px) { .footer .sns { flex-wrap: wrap; } }


/* ===== 採用情報：グループ共通ページ（他の下層ページの見た目にそろえた版 2026-10-16） ===== */
.gr-hero .ph img { object-position: 78% 40%; }
.gr-hero-btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: clamp(20px, 1.8vw, 32px); }
/* 代表メッセージ */
.gr-msg { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 4vw, 80px); align-items: center; }
.gr-msg-ph img { width: 100%; height: auto; border-radius: 32px; box-shadow: var(--shadow); }
.gr-msg-tx p { margin: 0 0 1em; }
.gr-msg-catch { font-size: clamp(24px, 2.1vw, 38px); font-weight: 900; color: var(--c-main); line-height: 1.4; margin: 1.4em 0 .8em !important; text-wrap: balance; }
.gr-msg-name { color: var(--c-muted); }
.gr-msg-name b { display: block; font-size: clamp(20px, 1.5vw, 26px); color: var(--c-text); letter-spacing: .1em; margin-top: 2px; }
/* 数字 */
.gr-nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(16px, 1.6vw, 28px); }
.gr-num { background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(24px, 2vw, 36px) 20px; text-align: center; }
.gr-num .pic { width: 72px; height: 72px; margin: 0 auto 10px; }
.gr-num .l { margin: 0; font-weight: 700; color: var(--c-muted); }
.gr-num .v { margin: 4px 0 0; font-family: "Montserrat", var(--font); font-size: clamp(38px, 3.2vw, 60px); font-weight: 800; color: var(--c-main); line-height: 1.15; white-space: nowrap; }
.gr-num .v small { font-family: var(--font); font-size: .42em; font-weight: 900; margin: 0 3px; }
.gr-num .v-s { font-family: var(--font); font-size: clamp(26px, 2.1vw, 38px); font-weight: 900; padding: .2em 0; }
.gr-people-wrap { margin-top: clamp(56px, 5vw, 96px); }
.gr-people { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 1.6vw, 28px); }
.gr-person { display: flex; align-items: center; gap: 20px; background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(20px, 1.8vw, 32px) clamp(20px, 2vw, 36px); }
.gr-person .pic { width: 64px; height: 64px; flex: none; }
.gr-person p { margin: 0; font-weight: 900; font-size: clamp(18px, 1.3vw, 24px); }
/* 求人を探す */
.gr-filter { display: flex; flex-wrap: wrap; gap: 14px 32px; margin-bottom: clamp(24px, 2vw, 36px); }
.gr-filter label { display: flex; align-items: center; gap: 14px; font-weight: 700; flex: 0 1 380px; }
.gr-filter label span { flex: none; }
.gr-filter select, .gr-apply select { font: inherit; border: 1px solid var(--c-line); border-radius: 999px; padding: .6em 1.2em; background: #fff; flex: 1; min-width: 0; }
.gr-jobs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 2vw, 36px); }
.gr-job { background: #fff; border-radius: 32px; box-shadow: var(--shadow); overflow: hidden; display: flex; flex-direction: column; }
.gr-job[hidden] { display: none; }
.gr-job-ph { aspect-ratio: 16 / 10; overflow: hidden; background: var(--c-tint); }
.gr-job-ph img { width: 100%; height: 100%; object-fit: cover; }
.gr-job-ph.is-logo, .gr-panel-ph.is-logo { display: grid; place-items: center; padding: 12%; }
.gr-job-ph.is-logo img, .gr-panel-ph.is-logo img { width: auto; height: auto; object-fit: contain; }
.gr-job-body { padding: clamp(20px, 1.8vw, 30px); display: flex; flex-direction: column; flex: 1; }
.gr-job-name { font-size: clamp(19px, 1.4vw, 24px); font-weight: 900; margin: 0 0 6px; }
.gr-pref { align-self: flex-start; display: inline-block; font-size: 15px; font-weight: 700; color: var(--c-main); background: var(--c-tint); border-radius: 999px; padding: 2px 12px; }
.gr-job-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 16px; margin: 14px 0 20px; }
.gr-job-dl dt { color: var(--c-muted); font-weight: 700; }
.gr-job-dl dd { margin: 0; }
.gr-job-btns { margin-top: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gr-job-btns .btn { justify-content: center; padding-left: .8em; padding-right: .8em; }
/* 募集要項 */
.gr-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: clamp(20px, 1.8vw, 32px); }
.gr-tab { font: inherit; font-weight: 700; border: 2px solid var(--c-main); background: #fff; color: var(--c-main); border-radius: 999px; padding: .5em 1.3em; cursor: pointer; }
.gr-tab.is-on { background: var(--c-main); color: #fff; }
.gr-panel { display: grid; grid-template-columns: clamp(240px, 26%, 360px) minmax(0, 1fr); gap: clamp(24px, 3vw, 56px); align-items: start; background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(22px, 2.4vw, 44px); }
.gr-panel[hidden] { display: none; }
.gr-panel-ph { aspect-ratio: 4 / 3; border-radius: 24px; overflow: hidden; background: var(--c-tint); margin-bottom: 14px; }
.gr-panel-ph img { width: 100%; height: 100%; object-fit: cover; }
.gr-panel-name { font-size: clamp(19px, 1.4vw, 24px); font-weight: 900; margin: 0 0 4px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.gr-panel-addr { margin: 0; color: var(--c-muted); }
.gr-tbl { font-size: var(--fs); }
/* 働きやすさ */
.gr-bens { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(16px, 1.4vw, 24px); }
.gr-ben { background: var(--c-tint); border-radius: 32px; padding: clamp(24px, 2vw, 36px) clamp(16px, 1.4vw, 24px); text-align: center; }
.gr-ben .pic { width: 80px; height: 80px; margin: 0 auto 12px; }
.gr-ben h3 { font-size: clamp(18px, 1.25vw, 22px); font-weight: 900; margin: 0 0 8px; text-wrap: balance; }
.gr-ben p { margin: 0; color: var(--c-muted); text-align: left; }
/* 先輩の声 */
.gr-voices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 2vw, 36px); }
.gr-voice { background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(18px, 1.6vw, 28px); }
.gr-voice-ph { aspect-ratio: 4 / 3; border-radius: 22px; background: linear-gradient(160deg, #E3EEFA, #CCDDF2); margin-bottom: 16px; }
.gr-voice .s { margin: 0 0 6px; color: var(--c-main); font-weight: 700; }
.gr-voice h3 { font-size: clamp(19px, 1.4vw, 24px); font-weight: 900; margin: 0; }
/* よくある質問 */
.gr-faqs { display: grid; gap: 14px; max-width: 980px; }
.gr-faq { background: var(--c-tint); border-radius: 24px; padding: 18px 24px; }
.gr-faq summary { font-weight: 700; cursor: pointer; list-style: none; position: relative; padding-right: 36px; }
.gr-faq summary::-webkit-details-marker { display: none; }
.gr-faq summary::after { content: ""; position: absolute; right: 4px; top: 50%; width: 14px; height: 14px; margin-top: -9px; border-right: 3px solid var(--c-main); border-bottom: 3px solid var(--c-main); transform: rotate(45deg); transition: transform .2s; }
.gr-faq[open] summary::after { transform: rotate(-135deg); margin-top: -3px; }
.gr-faq p { margin: 12px 0 0; color: var(--c-muted); }
/* 応募の流れ */
.gr-steps { list-style: none; margin: 0 0 clamp(28px, 2.4vw, 44px); padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(28px, 2.6vw, 48px); }
.gr-steps li { position: relative; background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(22px, 2vw, 34px) 20px; text-align: center; }
.gr-steps li:not(:last-child)::after { content: ""; position: absolute; right: calc(-1 * clamp(28px, 2.6vw, 48px) / 2 - 7px); top: 50%; width: 14px; height: 14px; margin-top: -7px; border-top: 3px solid var(--c-main); border-right: 3px solid var(--c-main); transform: rotate(45deg); }
.gr-steps .n { display: block; font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .1em; font-size: clamp(14px, .95vw, 17px); }
.gr-steps b { display: block; font-size: clamp(22px, 1.7vw, 30px); font-weight: 900; margin: 4px 0; }
.gr-steps p { margin: 0; color: var(--c-muted); }
.gr-apply { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px 40px; align-items: center; background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(24px, 2.4vw, 44px) clamp(24px, 3vw, 56px); }
.gr-apply-h { font-size: clamp(20px, 1.5vw, 26px); font-weight: 900; margin: 0 0 6px; }
.gr-contact { margin: 0; color: var(--c-muted); }
.gr-contact b { color: var(--c-text); }
.gr-apply-r { display: grid; gap: 12px; }
.gr-apply-r .btn { justify-content: center; }
@media (max-width: 1199px) {
  .gr-jobs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gr-bens { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gr-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gr-panel { grid-template-columns: minmax(0, 1fr); }
  .gr-panel-side { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 4px 20px; align-items: center; }
  .gr-panel-ph { grid-row: span 2; margin: 0; }
}
@media (max-width: 1023px) {
  .gr-msg { grid-template-columns: minmax(0, 1fr); }
  .gr-msg-ph { max-width: 560px; }
  .gr-people, .gr-voices { grid-template-columns: minmax(0, 1fr); }
  .gr-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gr-steps li:nth-child(2)::after { display: none; }
  .gr-apply { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
  .gr-jobs { grid-template-columns: minmax(0, 1fr); }
  .gr-bens { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gr-panel-side { grid-template-columns: minmax(0, 1fr); }
  .gr-panel-ph { grid-row: auto; margin-bottom: 10px; }
  .gr-filter label { flex: 1 1 100%; }
  .gr-voices { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
  .gr-bens { grid-template-columns: minmax(0, 1fr); }
  .gr-nums { gap: 12px; }
  .gr-num { padding: 20px 10px; border-radius: 24px; }
  .gr-num .pic { width: 56px; height: 56px; }
}
.pg-recruit .big-head:not(.is-center) .lead2 { margin-left: 0; }
/* 採用：メインビジュアル（画面幅いっぱい。コピーは画像に入れ、サブコピーとボタンはHTMLで重ねる） */
.gr-mv { position: relative; overflow: hidden; background: #D8EAFB url("img/recruit/hero_pc.webp") center / cover no-repeat; }
.gr-mv::before { content: ""; position: absolute; inset: 0; backdrop-filter: blur(24px); background: rgba(255,255,255,.25); }
.gr-mv-in { position: relative; max-width: 1920px; margin: 0 auto; }
.gr-mv-img { width: 100%; height: auto; display: block; }
.gr-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.gr-mv-tx { position: absolute; left: 4.2%; top: 44%; }
.gr-mv-sub { margin: 0 0 clamp(14px, 1.6vw, 30px); font-size: clamp(16px, min(1.5vw, 28.8px), 29px); font-weight: 900; line-height: 1.7; letter-spacing: .06em; color: #10316B; text-shadow: 0 0 6px #fff, 0 0 14px rgba(255,255,255,.95), 0 0 24px rgba(255,255,255,.8); }
.gr-mv-btns { display: flex; flex-wrap: wrap; gap: clamp(10px, 1vw, 18px); }
.gr-mv-btns .btn { min-width: clamp(150px, min(13vw, 250px), 250px); justify-content: center; }
.gr-btn-yel { background: #F5B800; color: #2A1E00; box-shadow: 0 8px 18px rgba(245,184,0,.32); }
.gr-mv .wave-top { z-index: 2; }
@media (max-width: 1100px) and (min-width: 768px) {
  .gr-mv-tx { top: 42%; }
  .gr-mv-btns .btn { padding: .6em 1.2em; }
}
@media (max-width: 767px) {
  .gr-mv { background: var(--c-tint); }
  .gr-mv::before { display: none; }
  .gr-mv-tx { position: static; padding: 20px 16px 64px; }
  .gr-mv-sub { text-shadow: none; }
  .gr-mv-btns .btn { flex: 1 1 140px; min-width: 0; }
}
/* 1920pxより広い画面：画像の左右の端をぼかした背景になじませる */
@media (min-width: 1921px) {
  .gr-mv-img { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); }
}
/* 2枚目の写真：メインコピーの下（空と山並みの明るい所）にサブコピーとボタンを置く */
.gr-mv { background-image: url("img/recruit/hero_pc.webp?v=2"); }
.gr-mv-tx { left: 5.6%; top: 33%; }
@media (max-width: 1100px) and (min-width: 768px) { .gr-mv-tx { top: 31%; } }
/* 写真は切らずに16:9のまま使う（上の見出しと右下の文字に余白を残すため） */
.gr-mv { background-image: url("img/recruit/hero_pc.webp?v=3"); }
.gr-mv-tx { left: 5.6%; top: 37%; }
.gr-mv .wave-top { height: clamp(24px, 2.8vw, 48px); }
@media (max-width: 1100px) and (min-width: 768px) { .gr-mv-tx { top: 35%; } }
@media (max-width: 767px) { .gr-mv { background-image: none; } }
/* 1920pxより広い画面：画像はぼかさず端まで見せる。左右の余りは、画像の端の色をそのまま横へ引き伸ばして（弱いぼかし）つなぐ */
@media (min-width: 1921px) {
  .gr-mv { background: #DCEBF8; }
  .gr-mv::before { display: none; }
  .gr-mv-img { -webkit-mask-image: none; mask-image: none; }
  .gr-mv-in::before, .gr-mv-in::after { content: ""; position: absolute; top: 0; bottom: 0; width: calc((100vw - 1920px) / 2 + 24px);
    background: url("img/recruit/hero_pc.webp?v=3") no-repeat; background-size: 400000% 100%; filter: blur(4px); }
  .gr-mv-in::before { right: calc(100% - 4px); background-position: left center; }
  .gr-mv-in::after { left: calc(100% - 4px); background-position: right center; }
  .gr-mv-img { position: relative; z-index: 1; }
}
/* 左右の余りは、写真の端の色から作ったなめらかな塗り（hero_fill_left/right.webp）でつなぐ */
@media (min-width: 1921px) {
  .gr-mv-in::before, .gr-mv-in::after { filter: none; background-size: auto 100%; width: calc((100vw - 1920px) / 2 + 2px); }
  .gr-mv-in::before { right: calc(100% - 1px); background-image: url("img/recruit/hero_fill_left.webp"); background-position: right center; background-repeat: repeat-y; }
  .gr-mv-in::after { left: calc(100% - 1px); background-image: url("img/recruit/hero_fill_right.webp"); background-position: left center; background-repeat: repeat-y; }
}
/* 1920pxより広い画面（2026-10-16 再調整）：
   背景に同じ写真を敷き、弱めにぼかして少し白っぽくする。写真の左右の端だけを背景になじませる。
   右下の白い文字（写真の右端近くまである）の部分だけは、なじませずにそのまま見せる */
@media (min-width: 1921px) {
  .gr-mv { background: #DCEBF8 url("img/recruit/hero_pc.webp?v=3") center / cover no-repeat; }
  .gr-mv::before { display: block; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); background: rgba(255,255,255,.18); }
  .gr-mv-in::before, .gr-mv-in::after { display: none; }
  .gr-mv-img {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%), linear-gradient(180deg, transparent 0, transparent 64%, #000 72%, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%), linear-gradient(180deg, transparent 0, transparent 64%, #000 72%, #000 100%);
    -webkit-mask-size: 100% 100%, 8% 100%; mask-size: 100% 100%, 8% 100%;
    -webkit-mask-position: 0 0, 100% 0; mask-position: 0 0, 100% 0;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-composite: source-over; mask-composite: add;
  }
}
/* 背景は「同じ写真を縮小してぼかし、淡い青を重ねた」専用の画像（hero_bg.webp）。文字の形は残らない */
@media (min-width: 1921px) {
  .gr-mv { background: #DCEBF8 url("img/recruit/hero_bg.webp") center / cover no-repeat; }
  .gr-mv::before { display: none; }
  .gr-mv-img {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 98.4%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 98.4%, transparent 100%);
    -webkit-mask-size: 100% 100%; mask-size: 100% 100%;
  }
}
.gr-mv-tx { z-index: 2; }
@media (min-width: 1921px) { .gr-mv { background-image: url("img/recruit/hero_bg.webp?v=2"); } }
@media (min-width: 1921px) { .gr-mv { background-image: url("img/recruit/hero_bg.webp?v=3"); } }
@media (min-width: 1921px) { .gr-mv { background-image: url("img/recruit/hero_bg.webp?v=4"); } }
.gr-voice-ph { overflow: hidden; }
.gr-voice-ph img { width: 100%; height: 100%; object-fit: cover; }
/* 320px前後の狭い画面：ヘッダーのロゴを少し小さくしてメニューボタンを収め、グループの学校カードは折り返せるようにする */
@media (max-width: 374px) {
  .header .wrap { gap: 8px; padding-left: 12px; padding-right: 12px; }
  .logo { min-width: 0; gap: 6px; }
  .logo .mark { width: 36px; height: 36px; }
  .logo .txt .ja { font-size: 16px; letter-spacing: 0; }
  .logo .txt .en { font-size: 9px; letter-spacing: .06em; }
  .menu-btn { padding: 6px 10px; flex: none; }
  .group-row { gap: 10px; }
  .group-row .card-s { white-space: normal; min-width: 0; padding-left: 6px; padding-right: 6px; font-size: 15px; text-align: center; }
  .group-row .card-s small { font-size: 14px; }
}
@media (max-width: 374px) {
  .reason-grid > *, .steps > *, .access > *, .sg-list > *, .gr-nums > * { min-width: 0; }
  .rg { padding: 16px 14px; gap: 4px 12px; }
  .rg-ico { width: 60px; height: 60px; }
  .step { min-width: 0; }
  .step .t { min-width: 0; }
  .access-box { padding: 22px 18px; }
  .access-map, .access-map iframe { width: 100%; max-width: 100%; }
  .sg { grid-template-columns: 64px minmax(0, 1fr); padding: 16px; gap: 12px; }
  .gr-nums { grid-template-columns: minmax(0, 1fr); }
}
/* 一緒に働きたい人（中越の「求める人材像」をもとに、写真つきのカードに） */
.gr-people-lead { max-width: 52em; margin: 0 0 clamp(24px, 2.4vw, 40px); }
.gr-people-lead p { margin: 0 0 .8em; }
.gr-people { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 2vw, 36px); }
.gr-person { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; overflow: hidden; }
.gr-person-ph { aspect-ratio: 4 / 3; overflow: hidden; }
.gr-person-ph img { width: 100%; height: 100%; object-fit: cover; }
.gr-person-tx { padding: clamp(20px, 1.8vw, 30px); }
.gr-person-tx .n { margin: 0; font-family: "Montserrat", var(--font); font-weight: 800; color: var(--c-main); letter-spacing: .1em; font-size: clamp(15px, 1vw, 18px); }
.gr-person-tx h3 { font-size: clamp(20px, 1.5vw, 26px); font-weight: 900; margin: 2px 0 10px; }
.gr-person-tx p:not(.n) { margin: 0; color: var(--c-muted); font-size: var(--fs); font-weight: 400; }
.gr-point { margin-top: clamp(24px, 2.4vw, 40px); background: #fff; border-radius: 32px; box-shadow: var(--shadow); padding: clamp(22px, 2.4vw, 40px) clamp(22px, 3vw, 56px); }
.gr-point-h { margin: 0 0 8px; font-weight: 700; color: var(--c-muted); }
.gr-point-h b { display: block; font-size: clamp(22px, 1.9vw, 34px); font-weight: 900; color: var(--c-main); margin-top: 2px; }
.gr-point p:not(.gr-point-h) { margin: 0; }
@media (max-width: 1023px) { .gr-people { grid-template-columns: minmax(0, 1fr); } .gr-person { flex-direction: row; } .gr-person-ph { width: 40%; flex: none; aspect-ratio: auto; } }
@media (max-width: 640px) { .gr-person { flex-direction: column; } .gr-person-ph { width: 100%; aspect-ratio: 4 / 3; } }
/* スクールメニュー：高齢者講習は3枚の下に横長のカードで置く（同じ見た目で、高さは低め） */
.lc-wide { display: grid; grid-template-columns: clamp(200px, 22%, 340px) minmax(0, 1fr); align-items: center; margin-top: clamp(16px, 1.6vw, 32px); }
.lc-wide .lc-ph { aspect-ratio: auto; height: 100%; min-height: clamp(110px, 8vw, 150px); }
.lc-wide .lc-t { padding: 18px 96px 20px clamp(20px, 2vw, 36px); }
.lc-wide .lc-ar { top: 50%; bottom: auto; transform: translateY(-50%); }
@media (max-width: 520px) {
  .lc-wide { grid-template-columns: 38% minmax(0, 1fr); }
  .lc-wide .lc-t { padding: 14px 64px 16px 16px; font-size: 20px; }
  .lc-wide .lc-ar { right: 14px; width: 38px; height: 38px; }
}
.lc-wide .lc-t em { white-space: normal; text-wrap: balance; }
@supports (word-break: auto-phrase) { .lc-wide .lc-t em { word-break: auto-phrase; } }
@media (max-width: 520px) { .lc-wide .lc-t small { font-size: 14px; letter-spacing: .04em; } }
/* 高齢者講習のカード：上の3枚の1枚分の幅にして中央に置く（高さはそのまま） */
.lc-wide { width: calc((100% - 2 * clamp(16px, 1.6vw, 32px)) / 3); margin-left: auto; margin-right: auto; grid-template-columns: 40% minmax(0, 1fr); }
.lc-wide .lc-t { padding: 16px 64px 18px 18px; font-size: clamp(20px, 1.4vw, 26px); }
.lc-wide .lc-ar { right: 16px; width: 40px; height: 40px; }
.lc-wide .lc-t em { font-size: 14px; }
@media (max-width: 767px) { .lc-wide { width: 100%; } }
/* 768〜1199pxはカード1枚が狭く、説明が何行にも折り返して縦に伸びるため、説明を外して見出しだけにする */
@media (min-width: 768px) and (max-width: 1199px) {
  .lc-wide { grid-template-columns: 38% minmax(0, 1fr); }
  .lc-wide .lc-t em { display: none; }
  .lc-wide .lc-t { padding: 14px 56px 16px 14px; font-size: 19px; }
  .lc-wide .lc-t small { font-size: 14px; letter-spacing: .04em; }
  .lc-wide .lc-ar { right: 12px; width: 36px; height: 36px; }
  .lc-wide .lc-ph { min-height: 120px; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .lc-wide { grid-template-columns: 32% minmax(0, 1fr); }
  .lc-wide .lc-t { padding: 14px 52px 16px 14px; font-size: clamp(17px, 1.8vw, 20px); white-space: nowrap; }
  .lc-wide .lc-t small { white-space: normal; }
  .lc-wide .lc-ar { right: 10px; }
}
/* 320px前後：「高齢者講習」の見出しを1行に保つ */
@media (max-width: 374px) {
  .lc-wide { grid-template-columns: 34% minmax(0, 1fr); }
  .lc-wide .lc-t { padding: 12px 52px 14px 12px; font-size: 18px; }
  .lc-wide .lc-ar { right: 10px; width: 34px; height: 34px; }
}
/* 写真つきカードは、ホバーでカード自体は動かさず、写真だけを少し拡大する（両方動くとうるさいため） */
.lc:hover, .recruit-bnr:hover { transform: none; }
.rb-ph img { transition: transform .4s; }
.recruit-bnr:hover .rb-ph img { transform: scale(1.05); }

/* ===== 装飾の丸を大小散りばめる（V09モックアップの再現 2026-10-19） =====
   セクションの背景に、大小の丸を両端中心に散らす。--b1 は地より少し濃い青、--b2 は地より明るい色。 */
.sec, .page-hero { --b1: #D9EAFA; --b2: #F6FAFF; }
.sec-white { --b1: #EAF4FC; --b2: #DCEBFA; }
.sec::before, .page-hero::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(circle max(5.6vw, 39px) at 2% 16%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(2.2vw, 15px) at 9.5% 40%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.1vw, 8px) at 6% 63%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(3.6vw, 25px) at 0.5% 86%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.7vw, 5px) at 13% 90%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(4.4vw, 31px) at 98% 10%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.5vw, 10px) at 92% 30%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.2vw, 43px) at 100% 70%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.0vw, 7px) at 89% 88%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.6vw, 4px) at 86% 52%, var(--b2) 96%, transparent 100%);
}
.sec:nth-of-type(3n+2)::before { background:
    radial-gradient(circle max(4.0vw, 28px) at 1% 8%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.4vw, 10px) at 8% 26%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.4vw, 45px) at -1% 62%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.8vw, 6px) at 11% 80%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(2.8vw, 20px) at 96% 20%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 90% 6%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(4.8vw, 34px) at 99% 52%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.8vw, 13px) at 93% 84%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.6vw, 4px) at 87% 66%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 15% 96%, var(--b1) 96%, transparent 100%);
}
.sec:nth-of-type(3n)::before, .page-hero::before { background:
    radial-gradient(circle max(3.2vw, 22px) at 4% 24%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 10% 8%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.8vw, 13px) at 1% 55%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(5.0vw, 35px) at 3% 92%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.0vw, 42px) at 99% 24%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 91% 48%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(2.6vw, 18px) at 97% 80%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.7vw, 5px) at 88% 14%, var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 84% 94%, var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.4vw, 10px) at 50% 4%, var(--b2) 96%, transparent 100%);
}
.bub { opacity: .75; }
/* スマホ：本文の左右の余白が狭いので、丸を少し薄くする */
@media (max-width: 767px) { .sec::before, .page-hero::before { opacity: .7; } }

/* 装飾の丸：セクションの上下で丸が切れないよう、縦の位置を半径ぶん内側に収めた版（2026-10-19） */
.sec::before, .page-hero::before { background:
    radial-gradient(circle max(5.6vw, 39px) at 2% clamp(calc(max(5.6vw, 39px) + 6px), 16%, calc(100% - max(5.6vw, 39px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(2.2vw, 15px) at 9.5% clamp(calc(max(2.2vw, 15px) + 6px), 40%, calc(100% - max(2.2vw, 15px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.1vw, 8px) at 6% clamp(calc(max(1.1vw, 8px) + 6px), 63%, calc(100% - max(1.1vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(3.6vw, 25px) at 0.5% clamp(calc(max(3.6vw, 25px) + 6px), 86%, calc(100% - max(3.6vw, 25px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.7vw, 5px) at 13% clamp(calc(max(0.7vw, 5px) + 6px), 90%, calc(100% - max(0.7vw, 5px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(4.4vw, 31px) at 98% clamp(calc(max(4.4vw, 31px) + 6px), 10%, calc(100% - max(4.4vw, 31px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.5vw, 10px) at 92% clamp(calc(max(1.5vw, 10px) + 6px), 30%, calc(100% - max(1.5vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.2vw, 43px) at 100% clamp(calc(max(6.2vw, 43px) + 6px), 70%, calc(100% - max(6.2vw, 43px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.0vw, 7px) at 89% clamp(calc(max(1.0vw, 7px) + 6px), 88%, calc(100% - max(1.0vw, 7px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.6vw, 4px) at 86% clamp(calc(max(0.6vw, 4px) + 6px), 52%, calc(100% - max(0.6vw, 4px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}
.sec:nth-of-type(3n+2)::before { background:
    radial-gradient(circle max(4.0vw, 28px) at 1% clamp(calc(max(4.0vw, 28px) + 6px), 8%, calc(100% - max(4.0vw, 28px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.4vw, 10px) at 8% clamp(calc(max(1.4vw, 10px) + 6px), 26%, calc(100% - max(1.4vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.4vw, 45px) at -1% clamp(calc(max(6.4vw, 45px) + 6px), 62%, calc(100% - max(6.4vw, 45px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.8vw, 6px) at 11% clamp(calc(max(0.8vw, 6px) + 6px), 80%, calc(100% - max(0.8vw, 6px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(2.8vw, 20px) at 96% clamp(calc(max(2.8vw, 20px) + 6px), 20%, calc(100% - max(2.8vw, 20px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 90% clamp(calc(max(0.9vw, 6px) + 6px), 6%, calc(100% - max(0.9vw, 6px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(4.8vw, 34px) at 99% clamp(calc(max(4.8vw, 34px) + 6px), 52%, calc(100% - max(4.8vw, 34px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.8vw, 13px) at 93% clamp(calc(max(1.8vw, 13px) + 6px), 84%, calc(100% - max(1.8vw, 13px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.6vw, 4px) at 87% clamp(calc(max(0.6vw, 4px) + 6px), 66%, calc(100% - max(0.6vw, 4px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 15% clamp(calc(max(1.2vw, 8px) + 6px), 96%, calc(100% - max(1.2vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%);
}
.sec:nth-of-type(3n)::before, .page-hero::before { background:
    radial-gradient(circle max(3.2vw, 22px) at 4% clamp(calc(max(3.2vw, 22px) + 6px), 24%, calc(100% - max(3.2vw, 22px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 10% clamp(calc(max(0.9vw, 6px) + 6px), 8%, calc(100% - max(0.9vw, 6px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.8vw, 13px) at 1% clamp(calc(max(1.8vw, 13px) + 6px), 55%, calc(100% - max(1.8vw, 13px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(5.0vw, 35px) at 3% clamp(calc(max(5.0vw, 35px) + 6px), 92%, calc(100% - max(5.0vw, 35px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.0vw, 42px) at 99% clamp(calc(max(6.0vw, 42px) + 6px), 24%, calc(100% - max(6.0vw, 42px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 91% clamp(calc(max(1.2vw, 8px) + 6px), 48%, calc(100% - max(1.2vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(2.6vw, 18px) at 97% clamp(calc(max(2.6vw, 18px) + 6px), 80%, calc(100% - max(2.6vw, 18px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.7vw, 5px) at 88% clamp(calc(max(0.7vw, 5px) + 6px), 14%, calc(100% - max(0.7vw, 5px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 84% clamp(calc(max(0.9vw, 6px) + 6px), 94%, calc(100% - max(0.9vw, 6px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.4vw, 10px) at 50% clamp(calc(max(1.4vw, 10px) + 6px), 4%, calc(100% - max(1.4vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}
/* 下層ページの見出し帯：右下の丸が下の波で切れていたので、波の上に上げる */
.page-hero .bub[style*="bottom"] { bottom: calc(clamp(48px, 4vw, 90px) + 12px) !important; }

/* 装飾の丸を2割減らした版（各配置8個 2026-10-19） */
.sec::before, .page-hero::before { background:
    radial-gradient(circle max(5.6vw, 39px) at 2% clamp(calc(max(5.6vw, 39px) + 6px), 16%, calc(100% - max(5.6vw, 39px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(2.2vw, 15px) at 9.5% clamp(calc(max(2.2vw, 15px) + 6px), 40%, calc(100% - max(2.2vw, 15px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(3.6vw, 25px) at 0.5% clamp(calc(max(3.6vw, 25px) + 6px), 86%, calc(100% - max(3.6vw, 25px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.7vw, 5px) at 13% clamp(calc(max(0.7vw, 5px) + 6px), 90%, calc(100% - max(0.7vw, 5px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(4.4vw, 31px) at 98% clamp(calc(max(4.4vw, 31px) + 6px), 10%, calc(100% - max(4.4vw, 31px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.5vw, 10px) at 92% clamp(calc(max(1.5vw, 10px) + 6px), 30%, calc(100% - max(1.5vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.2vw, 43px) at 100% clamp(calc(max(6.2vw, 43px) + 6px), 70%, calc(100% - max(6.2vw, 43px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.0vw, 7px) at 89% clamp(calc(max(1.0vw, 7px) + 6px), 88%, calc(100% - max(1.0vw, 7px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}
.sec:nth-of-type(3n+2)::before { background:
    radial-gradient(circle max(4.0vw, 28px) at 1% clamp(calc(max(4.0vw, 28px) + 6px), 8%, calc(100% - max(4.0vw, 28px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.4vw, 10px) at 8% clamp(calc(max(1.4vw, 10px) + 6px), 26%, calc(100% - max(1.4vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.4vw, 45px) at -1% clamp(calc(max(6.4vw, 45px) + 6px), 62%, calc(100% - max(6.4vw, 45px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(2.8vw, 20px) at 96% clamp(calc(max(2.8vw, 20px) + 6px), 20%, calc(100% - max(2.8vw, 20px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 90% clamp(calc(max(0.9vw, 6px) + 6px), 6%, calc(100% - max(0.9vw, 6px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(4.8vw, 34px) at 99% clamp(calc(max(4.8vw, 34px) + 6px), 52%, calc(100% - max(4.8vw, 34px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.8vw, 13px) at 93% clamp(calc(max(1.8vw, 13px) + 6px), 84%, calc(100% - max(1.8vw, 13px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 15% clamp(calc(max(1.2vw, 8px) + 6px), 96%, calc(100% - max(1.2vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%);
}
.sec:nth-of-type(3n)::before, .page-hero::before { background:
    radial-gradient(circle max(3.2vw, 22px) at 4% clamp(calc(max(3.2vw, 22px) + 6px), 24%, calc(100% - max(3.2vw, 22px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.8vw, 13px) at 1% clamp(calc(max(1.8vw, 13px) + 6px), 55%, calc(100% - max(1.8vw, 13px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(5.0vw, 35px) at 3% clamp(calc(max(5.0vw, 35px) + 6px), 92%, calc(100% - max(5.0vw, 35px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.0vw, 42px) at 99% clamp(calc(max(6.0vw, 42px) + 6px), 24%, calc(100% - max(6.0vw, 42px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 91% clamp(calc(max(1.2vw, 8px) + 6px), 48%, calc(100% - max(1.2vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(2.6vw, 18px) at 97% clamp(calc(max(2.6vw, 18px) + 6px), 80%, calc(100% - max(2.6vw, 18px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.7vw, 5px) at 88% clamp(calc(max(0.7vw, 5px) + 6px), 14%, calc(100% - max(0.7vw, 5px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.4vw, 10px) at 50% clamp(calc(max(1.4vw, 10px) + 6px), 4%, calc(100% - max(1.4vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}

/* 装飾の丸を各配置6個にした版（2026-10-19） */
.sec::before, .page-hero::before { background:
    radial-gradient(circle max(5.6vw, 39px) at 2% clamp(calc(max(5.6vw, 39px) + 6px), 16%, calc(100% - max(5.6vw, 39px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(2.2vw, 15px) at 9.5% clamp(calc(max(2.2vw, 15px) + 6px), 40%, calc(100% - max(2.2vw, 15px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.7vw, 5px) at 13% clamp(calc(max(0.7vw, 5px) + 6px), 90%, calc(100% - max(0.7vw, 5px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(4.4vw, 31px) at 98% clamp(calc(max(4.4vw, 31px) + 6px), 10%, calc(100% - max(4.4vw, 31px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.5vw, 10px) at 92% clamp(calc(max(1.5vw, 10px) + 6px), 30%, calc(100% - max(1.5vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.2vw, 43px) at 100% clamp(calc(max(6.2vw, 43px) + 6px), 70%, calc(100% - max(6.2vw, 43px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%);
}
.sec:nth-of-type(3n+2)::before { background:
    radial-gradient(circle max(4.0vw, 28px) at 1% clamp(calc(max(4.0vw, 28px) + 6px), 8%, calc(100% - max(4.0vw, 28px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.4vw, 10px) at 8% clamp(calc(max(1.4vw, 10px) + 6px), 26%, calc(100% - max(1.4vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.4vw, 45px) at -1% clamp(calc(max(6.4vw, 45px) + 6px), 62%, calc(100% - max(6.4vw, 45px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(2.8vw, 20px) at 96% clamp(calc(max(2.8vw, 20px) + 6px), 20%, calc(100% - max(2.8vw, 20px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 90% clamp(calc(max(0.9vw, 6px) + 6px), 6%, calc(100% - max(0.9vw, 6px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.8vw, 13px) at 93% clamp(calc(max(1.8vw, 13px) + 6px), 84%, calc(100% - max(1.8vw, 13px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%);
}
.sec:nth-of-type(3n)::before, .page-hero::before { background:
    radial-gradient(circle max(3.2vw, 22px) at 4% clamp(calc(max(3.2vw, 22px) + 6px), 24%, calc(100% - max(3.2vw, 22px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(5.0vw, 35px) at 3% clamp(calc(max(5.0vw, 35px) + 6px), 92%, calc(100% - max(5.0vw, 35px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.0vw, 42px) at 99% clamp(calc(max(6.0vw, 42px) + 6px), 24%, calc(100% - max(6.0vw, 42px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 91% clamp(calc(max(1.2vw, 8px) + 6px), 48%, calc(100% - max(1.2vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(2.6vw, 18px) at 97% clamp(calc(max(2.6vw, 18px) + 6px), 80%, calc(100% - max(2.6vw, 18px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(0.7vw, 5px) at 88% clamp(calc(max(0.7vw, 5px) + 6px), 14%, calc(100% - max(0.7vw, 5px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%);
}

/* 装飾の丸を各配置4個にした版（2026-10-19） */
.sec::before, .page-hero::before { background:
    radial-gradient(circle max(5.6vw, 39px) at 2% clamp(calc(max(5.6vw, 39px) + 6px), 16%, calc(100% - max(5.6vw, 39px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(2.2vw, 15px) at 9.5% clamp(calc(max(2.2vw, 15px) + 6px), 40%, calc(100% - max(2.2vw, 15px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(1.5vw, 10px) at 92% clamp(calc(max(1.5vw, 10px) + 6px), 30%, calc(100% - max(1.5vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.2vw, 43px) at 100% clamp(calc(max(6.2vw, 43px) + 6px), 70%, calc(100% - max(6.2vw, 43px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%);
}
.sec:nth-of-type(3n+2)::before { background:
    radial-gradient(circle max(1.4vw, 10px) at 8% clamp(calc(max(1.4vw, 10px) + 6px), 26%, calc(100% - max(1.4vw, 10px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.4vw, 45px) at -1% clamp(calc(max(6.4vw, 45px) + 6px), 62%, calc(100% - max(6.4vw, 45px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(2.8vw, 20px) at 96% clamp(calc(max(2.8vw, 20px) + 6px), 20%, calc(100% - max(2.8vw, 20px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(0.9vw, 6px) at 90% clamp(calc(max(0.9vw, 6px) + 6px), 6%, calc(100% - max(0.9vw, 6px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}
.sec:nth-of-type(3n)::before, .page-hero::before { background:
    radial-gradient(circle max(3.2vw, 22px) at 4% clamp(calc(max(3.2vw, 22px) + 6px), 24%, calc(100% - max(3.2vw, 22px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(5.0vw, 35px) at 3% clamp(calc(max(5.0vw, 35px) + 6px), 92%, calc(100% - max(5.0vw, 35px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(6.0vw, 42px) at 99% clamp(calc(max(6.0vw, 42px) + 6px), 24%, calc(100% - max(6.0vw, 42px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 91% clamp(calc(max(1.2vw, 8px) + 6px), 48%, calc(100% - max(1.2vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}
/* 前から各セクションに置いていた丸（.bub）は、新しい背景の丸と重なるため消す。丸は背景の4個に一本化する */
.sec > .bub, .sec > .wrap > .bub, .page-hero > .bub { display: none; }

/* 下層ページの見出し帯は高さが低く、縦に並べた丸が重なるため、横に離した専用の配置にする */
.page-hero::before { background:
    radial-gradient(circle max(3.2vw, 22px) at 4% clamp(calc(max(3.2vw, 22px) + 6px), 22%, calc(100% - max(3.2vw, 22px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 13% clamp(calc(max(1.2vw, 8px) + 6px), 78%, calc(100% - max(1.2vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle max(6.0vw, 42px) at 99% clamp(calc(max(6.0vw, 42px) + 6px), 24%, calc(100% - max(6.0vw, 42px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle max(1.2vw, 8px) at 91% clamp(calc(max(1.2vw, 8px) + 6px), 70%, calc(100% - max(1.2vw, 8px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}

/* 装飾の丸：半径に上限を付けた版（2026-10-19） */
.sec::before { background:
    radial-gradient(circle clamp(39px, 5.6vw, 108px) at 2% clamp(calc(clamp(39px, 5.6vw, 108px) + 6px), 16%, calc(100% - clamp(39px, 5.6vw, 108px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(15px, 2.2vw, 42px) at 9.5% clamp(calc(clamp(15px, 2.2vw, 42px) + 6px), 40%, calc(100% - clamp(15px, 2.2vw, 42px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle clamp(10px, 1.5vw, 29px) at 92% clamp(calc(clamp(10px, 1.5vw, 29px) + 6px), 30%, calc(100% - clamp(10px, 1.5vw, 29px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(43px, 6.2vw, 119px) at 100% clamp(calc(clamp(43px, 6.2vw, 119px) + 6px), 70%, calc(100% - clamp(43px, 6.2vw, 119px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%);
}
.sec:nth-of-type(3n+2)::before { background:
    radial-gradient(circle clamp(10px, 1.4vw, 27px) at 8% clamp(calc(clamp(10px, 1.4vw, 27px) + 6px), 26%, calc(100% - clamp(10px, 1.4vw, 27px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(45px, 6.4vw, 123px) at -1% clamp(calc(clamp(45px, 6.4vw, 123px) + 6px), 62%, calc(100% - clamp(45px, 6.4vw, 123px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(20px, 2.8vw, 54px) at 96% clamp(calc(clamp(20px, 2.8vw, 54px) + 6px), 20%, calc(100% - clamp(20px, 2.8vw, 54px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(6px, 0.9vw, 17px) at 90% clamp(calc(clamp(6px, 0.9vw, 17px) + 6px), 6%, calc(100% - clamp(6px, 0.9vw, 17px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}
.sec:nth-of-type(3n)::before { background:
    radial-gradient(circle clamp(22px, 3.2vw, 61px) at 4% clamp(calc(clamp(22px, 3.2vw, 61px) + 6px), 24%, calc(100% - clamp(22px, 3.2vw, 61px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(35px, 5.0vw, 96px) at 3% clamp(calc(clamp(35px, 5.0vw, 96px) + 6px), 92%, calc(100% - clamp(35px, 5.0vw, 96px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(42px, 6.0vw, 115px) at 99% clamp(calc(clamp(42px, 6.0vw, 115px) + 6px), 24%, calc(100% - clamp(42px, 6.0vw, 115px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(8px, 1.2vw, 23px) at 91% clamp(calc(clamp(8px, 1.2vw, 23px) + 6px), 48%, calc(100% - clamp(8px, 1.2vw, 23px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}
.page-hero::before { background:
    radial-gradient(circle clamp(22px, 3.2vw, 61px) at 4% clamp(calc(clamp(22px, 3.2vw, 61px) + 6px), 22%, calc(100% - clamp(22px, 3.2vw, 61px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(8px, 1.2vw, 23px) at 13% clamp(calc(clamp(8px, 1.2vw, 23px) + 6px), 78%, calc(100% - clamp(8px, 1.2vw, 23px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%),
    radial-gradient(circle clamp(42px, 6.0vw, 115px) at 99% clamp(calc(clamp(42px, 6.0vw, 115px) + 6px), 24%, calc(100% - clamp(42px, 6.0vw, 115px) - clamp(48px, 4vw, 90px) - 6px)), var(--b1) 96%, transparent 100%),
    radial-gradient(circle clamp(8px, 1.2vw, 23px) at 91% clamp(calc(clamp(8px, 1.2vw, 23px) + 6px), 70%, calc(100% - clamp(8px, 1.2vw, 23px) - clamp(48px, 4vw, 90px) - 6px)), var(--b2) 96%, transparent 100%);
}

/* ===== 公開後レビューの細かい直し（2026-10-21） ===== */
/* 中央寄せの説明文：最後の行が数文字だけにならないように */
.big-head .lead2 { text-wrap: balance; }
@supports (word-break: auto-phrase) { .big-head .lead2, .plc-rec li, .pc-v { word-break: auto-phrase; } }
.plc-rec li { text-wrap: balance; }
/* ロゴの英字は14px以上に（狭い画面は少し詰めて収める） */
.logo .txt .en { font-size: 14px; letter-spacing: .06em; }
@media (max-width: 1023px) { .logo .txt .en { font-size: 14px; letter-spacing: .02em; } }
@media (max-width: 480px) { .logo .txt .en { font-size: 14px; letter-spacing: 0; } .logo .txt .ja { font-size: 17px; } }
@media (max-width: 374px) { .logo .txt .en { display: none; } }
/* 1280px前後：メニューの間を少し空ける（文字を少し小さく） */
@media (min-width: 1024px) and (max-width: 1599px) {
  .gnav { gap: clamp(14px, 1.2vw, 22px); font-size: 16px; letter-spacing: 0; }
  .header .wrap { gap: 14px; }
  .hutil { font-size: 14px; }
}
/* スマホ横向き：上下の固定の帯を細くして、画面をふさがないように */
@media (orientation: landscape) and (max-height: 500px) {
  .header .wrap { height: 56px; }
  .logo .mark { width: 36px; height: 36px; }
  .logo .txt .en, .logo .txt .koan { display: none; }
  .spbar { padding: 4px 12px; }
  .spbar .btn { padding: .45em 1em; font-size: 15px; min-height: 0; }
}
/* 高齢者講習の流れの図：タップで拡大 */
.lp-flow-zoom { display: block; color: inherit; }
.lp-flow-note { display: none; margin-top: 8px; text-align: center; color: var(--c-main); font-weight: 700; font-size: 15px; }
@media (max-width: 767px) { .lp-flow-note { display: block; } }

/* ===== スクールメニューのカードが多い学校（中越は10種類）：PCは5列、狭い画面は2列で詰めて並べる（2026-10-22） ===== */
.lic-cards.is-many { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(12px, 1.2vw, 20px); }
.lic-cards.is-many .lc { border-radius: 24px; }
.lic-cards.is-many .lc-t { padding: 14px 52px 16px 16px; font-size: clamp(18px, 1.2vw, 22px); }
.lic-cards.is-many .lc-t small { font-size: 14px; letter-spacing: .02em; }
.lic-cards.is-many .lc-t em { font-size: 14px; white-space: normal; text-wrap: balance; }
@supports (word-break: auto-phrase) { .lic-cards.is-many .lc-t em { word-break: auto-phrase; } }
.lic-cards.is-many .lc-ar { right: 12px; bottom: 14px; width: 36px; height: 36px; }
@media (max-width: 1100px) { .lic-cards.is-many { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .lic-cards.is-many .lc-t { padding: 12px 44px 14px 12px; font-size: 17px; } .lic-cards.is-many .lc-ar { right: 8px; bottom: 10px; width: 32px; height: 32px; } }

/* ===== トップの申込ボタン（合宿ありの学校）：通学・合宿を同じ幅で横に並べ、LINEはその下に横いっぱい（2026-10-22 中越） ===== */
.mv-btns.has-camp { grid-template-columns: 1fr 1fr; justify-content: stretch; width: 100%; }
.mv-btns.has-camp .btn { justify-content: center; padding: .75em 1em; font-size: clamp(15px, .9vw, 18px); }
.mv-btns.has-camp .btn-line { justify-self: stretch; }
@media (max-width: 767px) {
  .mv-btns.has-camp { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .mv-btns.has-camp .btn { min-width: 0; padding: .7em .5em; font-size: 15px; gap: 6px; }
  .mv-btns.has-camp .btn .chev { display: none; }
}

/* ===== トップの「No.1」（中越：現行サイトのトップ画像の強みを主役に。2026-10-22） ===== */
.mv-label { margin: 0 0 .35em; font-size: clamp(15px, 1.05vw, 20px); font-weight: 900; letter-spacing: .04em; color: var(--c-text); }
.mv-circle .catch .no1 { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 2.35em; line-height: 1; letter-spacing: -.01em; color: var(--c-main); }
.mv-circle .catch .no1-tail { font-size: 1em; }
.mv-crown { display: inline-block; width: 1.25em; height: .95em; margin: 0 .1em 0 .06em; vertical-align: .9em; color: #F2B300; }
/* 合宿ありの学校：申込2つを主役に、LINEは白地の線ボタンにして強さに差をつける */
.mv-btns.has-camp .btn-line { background: #fff; color: #05A648; border: 2px solid var(--c-green); box-shadow: none; }
.mv-btns.has-camp .btn-line:hover { background: #EFFBF4; }
.mv-circle .catch:has(.no1) { white-space: nowrap; }
@media (max-width: 767px) {
  .mv-circle .catch .no1 { font-size: 1.9em; }
  .mv-crown { width: 1.05em; height: .8em; vertical-align: .75em; }
}

/* ===== 合宿ありの学校のトップのボタン：円の中に収め、円の中心に合わせる（2026-10-22 鈴木さん指摘で作り直し） =====
   ボタンの最小幅が円の中の幅より広く、右へはみ出して中央からずれていた。
   2列とも縮められるようにし、文字と余白を小さくして、矢印は外す（ボタンの色と位置で押せる所だと分かるため） */
@media (min-width: 768px) {
  .mv-in:has(.mv-btns.has-camp) { width: 100%; }
  .mv-btns.has-camp { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(8px, .6vw, 12px); width: 100%; max-width: 92%; margin-left: auto; margin-right: auto; }
  .mv-btns.has-camp .btn { min-width: 0; padding: .7em .4em; font-size: clamp(15px, .85vw, 17px); gap: .35em; white-space: nowrap; }
  .mv-btns.has-camp .btn::after { content: none; }
  .mv-btns.has-camp .btn-line { padding: .55em .4em; }
  /* LINEは上の2つより狭くして真ん中に置き、円のカーブに沿わせる（2026-10-30 鈴木さん。スマホは円がないので横いっぱいのまま） */
  .mv-btns.has-camp .btn-line { justify-self: center; width: 72%; }
}

/* ===== 約束5つのカード（中越）：アイコンを上に置き、5枚を1列に並べる。狭い画面では3枚・2枚・1枚で中央にそろえる（2026-10-22） ===== */
.about3.is-5 { --g: clamp(14px, 1.2vw, 24px); display: flex; flex-wrap: wrap; justify-content: center; gap: var(--g); }
.about3.is-5 .a3 { flex: 0 1 calc((100% - 4 * var(--g)) / 5); min-width: 0; padding: clamp(22px, 1.8vw, 32px) clamp(16px, 1.4vw, 24px); }
.about3.is-5 .a3 .a3-ico { width: clamp(88px, 6.4vw, 112px); height: clamp(88px, 6.4vw, 112px); margin-bottom: 6px; }
.about3.is-5 .a3-n { font-size: clamp(20px, 1.4vw, 26px); letter-spacing: .06em; }
.about3.is-5 .a3 h3 { margin: 8px 0 10px; font-size: clamp(18px, 1.15vw, 22px); text-wrap: balance; }
@supports (word-break: auto-phrase) { .about3.is-5 .a3 h3 { word-break: auto-phrase; } }
.about3.is-5 .a3 p { font-size: 16px; }
@media (max-width: 1199px) { .about3.is-5 .a3 { flex-basis: calc((100% - 2 * var(--g)) / 3); } }
@media (max-width: 767px) { .about3.is-5 .a3 { flex-basis: calc((100% - var(--g)) / 2); } }
@media (max-width: 479px) { .about3.is-5 .a3 { flex-basis: 100%; } }
/* 約束5つのカードの本文：幅が狭いので文節で区切らず、行の端まで詰めて折り返す（右側の空きをなくす。2026-10-22 鈴木さん指摘） */
.about3.is-5 .a3 p { word-break: normal; overflow-wrap: anywhere; text-wrap: wrap; }

/* ===== 教習コース（写真＋広さを大きく。中越のアクセス・会社紹介。2026-10-22） ===== */
.course-big { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: center; }
.course-big .cm-ph img { max-width: none; width: 100%; border-radius: 24px; }
.course-big .cm-en { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 14px; letter-spacing: .14em; color: var(--c-main); margin: 0 0 4px; }
.course-big h3 { font-size: clamp(22px, 1.6vw, 30px); font-weight: 900; margin: 0 0 14px; }
.course-big .cm-stat { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 .2em; margin: 0 0 14px; padding: 14px 20px; background: #fff; border-radius: 20px; line-height: 1.2; }
.course-big .cm-stat small { flex-basis: 100%; font-size: clamp(15px, 1vw, 18px); font-weight: 700; color: var(--c-text); }
.course-big .cm-stat b { font-size: clamp(48px, 4.2vw, 80px); font-weight: 900; color: var(--c-main); line-height: 1; letter-spacing: -.02em; }
.course-big .cm-stat span { font-size: clamp(20px, 1.5vw, 28px); font-weight: 900; }
.course-big .cm-points { margin: 12px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.course-big .cm-points li { position: relative; padding-left: 1.6em; }
.course-big .cm-points li::before { content: ""; position: absolute; left: .2em; top: .45em; width: .8em; height: .45em; border-left: 3px solid var(--c-main); border-bottom: 3px solid var(--c-main); transform: rotate(-45deg); }
@media (max-width: 767px) { .course-big { grid-template-columns: 1fr; } }

/* ===== 教習規則・入寮規則のページ（中越。2026-10-23） ===== */
.rl-doc { max-width: 960px; margin: 0 auto; }
.rl-doc .rl-ch { font-size: clamp(20px, 1.4vw, 24px); font-weight: 900; color: var(--c-main); margin: 32px 0 8px; padding-bottom: 8px; border-bottom: 2px solid var(--c-tint2); }
.rl-doc .rl-ch:first-child { margin-top: 0; }
.rl-doc .rl-art { font-size: 18px; font-weight: 900; margin: 22px 0 6px; }
.rl-doc p { margin: 0 0 8px; text-wrap: pretty; }
.rl-list { list-style: none; margin: 4px 0 12px; padding: 0; display: grid; gap: 6px; }
.rl-list li { display: grid; grid-template-columns: 2.4em minmax(0, 1fr); gap: 4px; }
.rl-list .n { font-weight: 700; color: var(--c-main); }

/* ===== トップの「合宿・講習のご案内」（新潟の学校。現行サイトの右側のバナーの代わり。2026-10-23） ===== */
.bn-sec { padding-bottom: 0; }
.bn-mains { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(14px, 1.4vw, 24px); }
.bn-mains a, .bn-courses a { position: relative; display: flex; align-items: center; gap: 16px; background: #fff; border-radius: 24px; box-shadow: var(--shadow-sm); color: var(--c-text); transition: transform .2s; }
.bn-mains a:hover, .bn-courses a:hover { transform: translateY(-3px); }
.bn-mains a { padding: clamp(18px, 1.6vw, 28px) 64px clamp(18px, 1.6vw, 28px) clamp(18px, 1.6vw, 28px); }
.bn-tx { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.bn-tx b { font-size: clamp(19px, 1.3vw, 24px); font-weight: 900; }
.bn-tx small { font-size: 15px; color: var(--c-muted); line-height: 1.5; text-wrap: pretty; }
.bn-ic { flex: 0 0 auto; display: grid; place-items: center; }
.bn-ic img { display: block; }
.bn-sec .ar { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; background: var(--c-main); color: #fff; display: grid; place-items: center; font-size: 0; }
.bn-sec .ar .chev { width: 42%; height: 42%; }
.bn-courses-head { margin: clamp(28px, 2.4vw, 44px) 0 14px; }
.bn-courses-head .en { font-family: "Montserrat", var(--font); font-weight: 800; font-size: 14px; letter-spacing: .14em; color: var(--c-main); margin: 0; }
.bn-courses-head h3 { font-size: clamp(20px, 1.4vw, 26px); font-weight: 900; margin: 2px 0 0; }
.bn-courses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: clamp(12px, 1.1vw, 18px); }
.bn-courses a { padding: 14px 54px 14px 14px; border-radius: 20px; }
.bn-courses .bn-tx b { font-size: clamp(17px, 1.1vw, 20px); }
.bn-courses .bn-tx small { font-size: 14px; }
.bn-courses .ar { width: 28px; height: 28px; right: 14px; }
@media (max-width: 1023px) { .bn-courses { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .bn-mains, .bn-courses { grid-template-columns: 1fr; } }
.bn-mains .bn-ic, .bn-mains .bn-ic img { width: clamp(64px, 5vw, 84px); height: clamp(64px, 5vw, 84px); }
.bn-courses .bn-ic, .bn-courses .bn-ic img { width: 52px; height: 52px; }
.bn-ic img { max-width: none; object-fit: contain; }

/* 教習の流れ：1359px以下（タブレット・スマホ）は、道を見出しの下に横いっぱいの1本の波線で出し、車を左から右へ走らせる。
   上の余白は、走る車が「入校から卒業まで」の札に重ならないため。点線は狭い画面で縮むので、PCより間隔を広めに取っている */
@media (max-width: 1359px) {
  .fl3-road { display: block; position: relative; left: auto; right: auto; bottom: auto; height: 44px; max-width: 720px; margin: 44px auto 0; overflow: visible;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 40' preserveAspectRatio='none' fill='none' stroke='%230B6BD8' stroke-width='3' stroke-dasharray='22 18' stroke-linecap='round' opacity='.5'%3E%3Cpath d='M0 24 C170 10 330 10 500 20 S830 30 1000 16'/%3E%3C/svg%3E"); }
  .fl3-road .pic { width: 48px; height: 48px; animation: fl3-drive-sp 9s linear infinite; }
}
@keyframes fl3-drive-sp {
  0% { left: 0.08%; bottom: 12.7px; transform: translateX(-50%) rotate(-9.3deg) scaleX(-1); opacity: 0; }
  5% { left: 4.99%; bottom: 16.7px; transform: translateX(-50%) rotate(-7.6deg) scaleX(-1); opacity: 1; }
  10% { left: 9.93%; bottom: 19.9px; transform: translateX(-50%) rotate(-5.9deg) scaleX(-1); opacity: 1; }
  15% { left: 14.92%; bottom: 22.4px; transform: translateX(-50%) rotate(-4.2deg) scaleX(-1); opacity: 1; }
  20% { left: 19.97%; bottom: 24.0px; transform: translateX(-50%) rotate(-2.4deg) scaleX(-1); opacity: 1; }
  25% { left: 25.00%; bottom: 24.7px; transform: translateX(-50%) rotate(-0.7deg) scaleX(-1); opacity: 1; }
  30% { left: 29.95%; bottom: 24.6px; transform: translateX(-50%) rotate(0.9deg) scaleX(-1); opacity: 1; }
  35% { left: 35.00%; bottom: 23.8px; transform: translateX(-50%) rotate(2.5deg) scaleX(-1); opacity: 1; }
  40% { left: 39.99%; bottom: 22.2px; transform: translateX(-50%) rotate(4.0deg) scaleX(-1); opacity: 1; }
  45% { left: 45.01%; bottom: 19.9px; transform: translateX(-50%) rotate(5.4deg) scaleX(-1); opacity: 1; }
  50% { left: 50.00%; bottom: 17.0px; transform: translateX(-50%) rotate(6.7deg) scaleX(-1); opacity: 1; }
  55% { left: 54.99%; bottom: 14.1px; transform: translateX(-50%) rotate(5.4deg) scaleX(-1); opacity: 1; }
  60% { left: 60.01%; bottom: 11.8px; transform: translateX(-50%) rotate(4.0deg) scaleX(-1); opacity: 1; }
  65% { left: 65.00%; bottom: 10.2px; transform: translateX(-50%) rotate(2.5deg) scaleX(-1); opacity: 1; }
  70% { left: 70.05%; bottom: 9.4px; transform: translateX(-50%) rotate(0.9deg) scaleX(-1); opacity: 1; }
  75% { left: 75.00%; bottom: 9.3px; transform: translateX(-50%) rotate(-0.7deg) scaleX(-1); opacity: 1; }
  80% { left: 80.03%; bottom: 10.0px; transform: translateX(-50%) rotate(-2.4deg) scaleX(-1); opacity: 1; }
  85% { left: 85.08%; bottom: 11.6px; transform: translateX(-50%) rotate(-4.2deg) scaleX(-1); opacity: 1; }
  90% { left: 90.07%; bottom: 14.1px; transform: translateX(-50%) rotate(-5.9deg) scaleX(-1); opacity: 1; }
  95% { left: 95.01%; bottom: 17.3px; transform: translateX(-50%) rotate(-7.6deg) scaleX(-1); opacity: 1; }
  100% { left: 99.92%; bottom: 21.3px; transform: translateX(-50%) rotate(-9.3deg) scaleX(-1); opacity: 0; }
}
@media (max-width: 1359px) and (prefers-reduced-motion: reduce) {
  .fl3-road .pic { animation: none; left: 82%; right: auto; bottom: 14px; transform: scaleX(-1); }
}
/* 案内欄のカード：写真は左に小さく、文字は右（image2.5 の実写風の写真。2026-10-23 小さくした） */
.bn-mains a.has-photo, .bn-courses a.has-photo { flex-direction: row; align-items: center; gap: 0; padding: 0; overflow: hidden; }
.has-photo .bn-ph { flex: 0 0 auto; display: block; align-self: stretch; overflow: hidden; }
.bn-mains .has-photo .bn-ph { width: 40%; aspect-ratio: 3 / 2; }
/* 講習カードは2列。写真は3:2で乗り物や人が切れないように。高さは一番長い「作業用の資格」に全カードを合わせる（grid-auto-rows: 1fr） */
.bn-courses .has-photo .bn-ph { width: clamp(150px, 30%, 220px); aspect-ratio: 3 / 2; }
.has-photo .bn-ph img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
.has-photo:hover .bn-ph img { transform: scale(1.04); }
.bn-mains .has-photo .bn-tx { padding: 14px 60px 14px 20px; }
.bn-courses .has-photo .bn-tx { padding: 10px 60px 10px 14px; }
/* 正方形に切り抜いたとき、ドローン本体（右上）が入るように */
.bn-courses .has-photo img[src*="bn_drone"] { object-position: 90% 50%; }
.bn-courses a.has-photo { border-radius: 16px; }
.bn-courses .has-photo .bn-tx b { font-size: clamp(16px, 1vw, 18px); }
.bn-courses .has-photo .bn-tx small { font-size: 14px; line-height: 1.45; }
.bn-courses .has-photo .ar { width: 34px; height: 34px; right: 18px; }   /* 青丸は合宿・資料請求のカードと同じ大きさと位置 */
@media (max-width: 767px) {
  .bn-mains .has-photo .bn-ph { width: 36%; }
  .bn-mains .has-photo .bn-tx { padding: 12px 48px 12px 14px; }
  .bn-mains .has-photo .bn-tx b { font-size: 18px; }
  .bn-mains .has-photo .bn-tx small { font-size: 14px; }
  .bn-mains .has-photo .ar { width: 28px; height: 28px; right: 12px; }
  .bn-courses { grid-template-columns: 1fr; gap: 10px; }
}
/* 案内欄の見出しは文節で折り返す（「お問い／合わせ」のような語の途中の改行を防ぐ。2026-10-23） */
.bn-tx b { text-wrap: balance; }
@supports (word-break: auto-phrase) { .bn-tx b { word-break: auto-phrase; } }
/* 講習カード：説明文は <wbr> の位置でだけ折り返す（「予約」「診断」だけが次の行に落ちないように。2026-10-23） */
.bn-courses .has-photo .bn-tx small { word-break: keep-all; overflow-wrap: anywhere; }
/* 1023px以下：写真を大きくする。矢印は合宿・資料請求のカードと同じく右端の中央に置く */
@media (max-width: 1023px) {
  .bn-courses .has-photo { --ph: clamp(150px, 40%, 220px); }
  .bn-courses .has-photo .bn-ph { width: var(--ph); }
  .bn-courses .has-photo .bn-tx { padding: 8px 46px 8px 12px; }
  .bn-mains .has-photo .ar, .bn-courses .has-photo .ar { width: 28px; height: 28px; right: 12px; }
  .bn-courses .has-photo .bn-tx small { line-height: 1.4; }
}
@media (max-width: 767px) {
  .bn-courses .has-photo { --ph: clamp(140px, 45%, 220px); }
}
/* コースの数字：「4」を大きく、「約」「倍」を小さく。「約4倍のコース面積」はスマホでも1行に収める（2026-10-23） */
.course-big .cm-stat b { font-size: clamp(64px, 5.6vw, 104px); }
.course-big .cm-stat b .u { font-style: normal; font-size: .42em; letter-spacing: 0; margin: 0 .04em; }
@media (max-width: 767px) {
  .course-big .cm-stat { padding: 14px 16px; }
  .course-big .cm-stat b { font-size: min(64px, 16vw); }
  .course-big .cm-stat span { font-size: min(20px, 5vw); }
}
/* 学校だけの採用ページ（中越。2026-10-26） */
.rc-facts { margin-top: 18px; }
.rc-facts th { width: 8em; }
.rc-tbl th { width: 9em; }
.rc-tbl td { text-wrap: pretty; }
.rc-sub { display: block; font-size: 15px; color: var(--c-muted); margin-top: 4px; }
.rc-place2 { display: block; margin-top: 14px; }
.rc-tbl td b { display: block; }
.rc-h3 { font-size: clamp(20px, 1.5vw, 26px); font-weight: 900; margin: clamp(32px, 3vw, 48px) 0 14px; }
.rc-style { display: grid; grid-template-columns: minmax(0, 720px) clamp(200px, 20vw, 280px); justify-content: start; gap: clamp(24px, 3vw, 48px); align-items: center; }   /* 文の幅を抑えて、資料の表紙を文のすぐ右に置く（2026-10-27） */
.rc-style-tx p { margin: 0 0 1em; }
.rc-style-pdf img { display: block; width: 100%; height: auto; border-radius: 16px; box-shadow: var(--shadow); }
@media (max-width: 767px) {
  .rc-style { grid-template-columns: 1fr; }
  .rc-style-pdf { max-width: 260px; }
  body:not(.pg-index) .rc-tbl th, body:not(.pg-index) .rc-facts th { white-space: nowrap; }   /* 「自己啓発支援」が2行に割れないように */
}
@media (max-width: 640px) { body:not(.pg-index) .rc-tbl th { width: auto; } }   /* 見出しを上に置く並びでは幅いっぱいに */
.rc-style-tx a { color: var(--c-main); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
/* YouTube の動画（中越：トップのCM、採用ページの2本。2026-10-26） */
.yt-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2vw, 36px); }
.yt-list.is-one { grid-template-columns: minmax(0, 720px); }
.yt-card { margin: 0; }
.yt { aspect-ratio: 16 / 9; border-radius: 20px; overflow: hidden; background: #000; box-shadow: var(--shadow-sm); }
.yt iframe { display: block; width: 100%; height: 100%; border: 0; }
.yt-card figcaption { margin-top: 10px; font-weight: 700; text-wrap: pretty; }
@media (max-width: 767px) { .yt-list { grid-template-columns: 1fr; } }
/* スクールメニューの料金の案内・入校の流れのメールの案内（中越。2026-10-27） */
.lp-price-note { background: var(--c-tint); border-radius: 24px; padding: clamp(18px, 2vw, 28px) clamp(20px, 2.4vw, 36px); margin: 0 0 clamp(24px, 2.4vw, 40px); }
.lp-price-note p { margin: 0; text-wrap: pretty; }
.lp-price-note .btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.flow-item .flow-mail { margin-top: .6em; font-size: 15px; color: var(--c-muted); }
/* おすすめの時期の図（中越。2026-10-27） */
.grid2 > .card.is-wide { grid-column: 1 / -1; }
.ss { margin-top: 18px; }
.ss-axis { margin: 0 0 8px; font-size: 14px; font-weight: 700; color: var(--c-muted); }
.ss-months { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; align-items: end; }
.ss-m { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ss-bar { display: flex; align-items: flex-end; width: 100%; height: 140px; background: var(--c-tint); border-radius: 10px; overflow: hidden; }
.ss-bar i { display: block; width: 100%; height: calc(var(--v) * 100%); border-radius: 10px 10px 0 0; }
.lv3 .ss-bar i { background: #E8505B; }
.lv2 .ss-bar i { background: #F5A623; }
.lv1 .ss-bar i { background: #2FB36B; }
.ss-n { order: 2; font-weight: 900; font-size: 15px; white-space: nowrap; }
.ss-l { order: 3; font-size: 14px; color: var(--c-muted); text-align: center; line-height: 1.3; word-break: keep-all; }
.ss-notes { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 8px; }
.ss-note { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; padding: 10px 14px; border-radius: 14px; }
.ss-note b { white-space: nowrap; }
.ss-note.lv1 { background: #E6F6EC; }
.ss-note.lv2 { background: #FFF3DF; }
.ss-note.lv3 { background: #FDE8EA; }
.ss-foot { margin: 12px 0 0; font-size: 15px; color: var(--c-muted); }
@media (max-width: 767px) {
  .ss-months { grid-template-columns: 1fr; gap: 6px; }
  .ss-m { flex-direction: row; gap: 10px; }
  .ss-n { order: 1; width: 3em; text-align: right; }
  .ss-bar { order: 2; height: 18px; flex: 1; border-radius: 9px; align-items: stretch; }
  .ss-bar i { width: calc(var(--v) * 100%); height: 100%; border-radius: 9px; }
  .ss-l { order: 3; width: 6.5em; text-align: left; }
}
/* 教習プランの「日程の例」（中越。現行のモデルスケジュールを作り直した。2026-10-27） */
.psd { grid-column: 1 / -1; border-top: 1px solid var(--c-line); padding-top: 14px; }
.psd summary { cursor: pointer; list-style: none; font-weight: 900; color: var(--c-main); display: inline-flex; align-items: center; gap: 8px; }
.psd summary::-webkit-details-marker { display: none; }
.psd summary::before { content: ""; width: 10px; height: 10px; border-right: 3px solid var(--c-main); border-bottom: 3px solid var(--c-main); transform: rotate(-45deg); transition: transform .2s; }
.psd[open] summary::before { transform: rotate(45deg); }
.psd summary small { font-weight: 700; color: var(--c-muted); }
.psd-in { margin-top: 14px; }
.psd-note { margin: 0 0 10px; font-size: 15px; color: var(--c-muted); text-wrap: pretty; }
.psd-legend { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 14px; }
.psd-legend li { display: inline-flex; align-items: center; gap: 6px; }
.psd-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.psd-tbl { border-collapse: separate; border-spacing: 3px; width: 100%; min-width: 340px; table-layout: fixed; }
.psd-tbl th, .psd-tbl td { text-align: center; vertical-align: middle; padding: 0; height: 34px; }
.psd-tbl thead th { font-size: 14px; line-height: 1.1; color: var(--c-text); }
.psd-tbl thead th b { display: block; }
.psd-tbl thead th small { display: block; font-size: 14px; color: var(--c-muted); font-weight: 400; }
.psd-tbl thead th:first-child, .psd-tbl thead th:nth-child(2) { width: 2.2em; }
.psd-tbl tbody th, .psd-tbl td.wd { font-weight: 900; font-size: 14px; }
.psd-tbl tbody td { background: var(--c-tint); border-radius: 8px; }
.psd-tbl tbody td.wd { background: none; }
.psd-tbl tr.sat td.wd, .psd-tbl tr.sat th { color: #1F5FBF; }
.psd-tbl tr.sun td.wd, .psd-tbl tr.sun th { color: #D63B3B; }
.psd-i { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; font-size: 14px; font-weight: 900; color: #fff; line-height: 1; }
.psd-i.k-gaku { background: #2B8FD6; }
.psd-i.k-gi { background: #7CBF2E; }
.psd-i.k-teki { background: #F0661E; }
.psd-i.k-ko { background: #1E9E4A; }
.psd-i.k-shu, .psd-i.k-kari { background: #D6006E; }
.psd-i.k-kyu { background: #C8102E; }
.psd-i.k-sotsu { background: #F5A623; }
.psd-band { display: block; height: 26px; line-height: 26px; border-radius: 8px; font-size: 14px; font-weight: 900; }
.psd-band.k-school, .psd-legend .psd-i.k-school { background: #E3EC5A; color: #4A5200; }
.psd-band.k-baito, .psd-legend .psd-i.k-baito { background: #F7B7CC; color: #7A1F43; }
.psd-legend .psd-i.k-school, .psd-legend .psd-i.k-baito { width: 26px; }
@media (max-width: 1023px) { .psd-tbl thead th small { display: none; } }   /* 狭い画面では時刻を出さず、時限の番号だけ */
@media (max-width: 767px) {
  .psd-tbl th, .psd-tbl td { height: 30px; }
  .psd-i { width: 24px; height: 24px; font-size: 14px; border-radius: 6px; }
  .psd-band { height: 24px; line-height: 24px; font-size: 14px; }
}
/* トップの動画の欄（アクセスの上。中越。2026-10-27） */
.top-movie { padding-bottom: 0; }
/* 1文字だけ次の行に落ちる改行を防ぐ（中越の全ページ点検。2026-10-27） */
.gr-person-tx p:not(.n), .about3.is-5 .a3 p { text-wrap: pretty; }
.psd summary small { font-size: 14px; }
/* お問い合わせの「ご意見もLINEで」（中越。2026-10-27） */
.apply-row.op-row { margin-top: 14px; }
/* おすすめの時期の図（画像）・送迎バスの写真（中越。2026-10-27） */
.ss-pic { display: block; margin-top: 18px; }
.ss-pic img { display: block; width: 100%; max-width: 1100px; height: auto; margin: 0 auto; border-radius: 20px; }
@media (max-width: 767px) { .ss-pic img { max-width: 480px; } }
.ba-ph { border-radius: 20px; overflow: hidden; }
.ba-ph img { display: block; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 3 / 2; }
@media (max-width: 767px) { .card.is-wide { padding-left: 14px; padding-right: 14px; } .ss-pic img { max-width: none; } }   /* スマホでは図をできるだけ大きく */
@media (max-width: 767px) { .ss-pic img { max-width: 480px; } }   /* 640px幅などで縦長の図が大きくなりすぎないように */
/* おすすめの時期の図：下の一文を図の左端にそろえ、本文と同じ大きさに（2026-10-27） */
.ss-box { max-width: 1100px; margin: 18px auto 0; }
.ss-box .ss-pic { margin-top: 0; }
.ss-box .ss-pic img { max-width: 100%; border-radius: 0; }
.ss-box .ss-foot { margin: 14px 0 0; font-size: 16px; color: var(--c-text); text-wrap: pretty; }
@media (max-width: 767px) { .ss-box { max-width: 480px; } }
/* 送迎バスの欄のイラスト：高さを左の文とそろえる（2026-10-27） */
.ba-ph { align-self: center; background: #fff; border-radius: 20px; }
.ba-ph img { aspect-ratio: auto; height: auto; object-fit: contain; }
.bus-area.has-ph { grid-template-columns: minmax(0, 1fr) minmax(0, 480px); }   /* イラストは最大480px。広い画面でも文と同じくらいの高さに */
@media (max-width: 1023px) { .bus-area.has-ph { grid-template-columns: 1fr; } .bus-area.has-ph .ba-ph { max-width: 480px; } }   /* 狭い画面では文の下にイラスト（文の欄が細くなりすぎないように） */
/* 送迎バスの欄：写真（案1）に戻したので、白い台紙はやめて写真を角丸で見せる（2026-10-27） */
.ba-ph { background: none; }
.ba-ph img { aspect-ratio: 5 / 3; object-fit: cover; }
/* 「日程の例を見る」を、押して開くボタンだと分かる形にする（光るアニメは2026-10-28に外した） */
.psd summary { padding: 10px 20px 10px 16px; border: 2px solid var(--c-main); border-radius: 999px; background: #fff; transition: background .2s; }
.psd summary:hover { background: var(--c-tint); }

/* 英字の学校名が長い学校（長岡文化「NAGAOKA BUNKA DRIVING SCHOOL」）は、スマホでは英字を出さない。出すとメニューのボタンが画面の外に押し出される（2026-10-28） */
@media (max-width: 480px) { .logo.is-long .txt .en { display: none; } }
/* PC・タブレットでは、長い英字を2行（NAGAOKA BUNKA／DRIVING SCHOOL）にして、ロゴの幅を抑える。1行だと1300〜1420pxでヘッダーの申込ボタンが画面の外にはみ出す */
@media (min-width: 481px) { .logo.is-long .txt .en { max-width: 170px; } }
/* グループ校で受け付ける免許（長岡文化のスクールメニュー。大型・けん引・二種は中越自動車学校で受付。2026-10-28） */
.lpp-lead { max-width: 760px; margin: 0 0 clamp(8px, 1vw, 16px); text-wrap: pretty; }
.lpp-where { display: inline-block; margin: 2px 0 10px; padding: 3px 12px; border-radius: 999px; background: var(--c-tint); color: var(--c-main); font-size: 14px; font-weight: 700; }
.lp-partner .lp-card { background: #fff; }
.lpp-cta { margin-top: clamp(24px, 2.4vw, 40px); }
.lpp-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.lpp-site { margin-top: 14px; text-align: right; }
@media (max-width: 640px) { .lpp-btns .btn { width: 100%; justify-content: center; } .lpp-site { text-align: left; } }
/* トップのスクールメニューの「グループの中越自動車学校で」の入口：左に文、右に4種類の写真を並べ、横いっぱいに出す（2026-10-28） */
.lc.lc-partner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); align-items: center; gap: clamp(16px, 2vw, 32px);
  width: 100%; margin: clamp(16px, 1.6vw, 32px) 0 0; padding: clamp(18px, 1.8vw, 28px) clamp(64px, 6vw, 96px) clamp(18px, 1.8vw, 28px) clamp(20px, 2vw, 36px); border: 2px solid var(--c-tint2); }
.lc-partner .lc-t { padding: 0; font-size: clamp(18px, 1.3vw, 22px); }
.lc-partner .lc-t em { white-space: normal; }
.lcp-ph { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.lcp-ph span { display: block; }
.lcp-ph img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; display: block; }
.lcp-ph i { display: block; margin-top: 6px; font-style: normal; font-size: 14px; font-weight: 700; text-align: center; color: var(--c-text); }
@media (max-width: 767px) {
  .lc.lc-partner { grid-template-columns: 1fr; padding-right: 64px; }
  .lcp-ph { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* 送迎バスの欄：背景を透過した横長の図（家→送迎車→学校）は、写真のように切り抜かず、全体をそのまま見せる（2026-10-28） */
@media (min-width: 1024px) { .bus-area.has-ph.is-clear { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } .bus-area.is-clear .ba-ph { max-width: 600px; justify-self: end; } }   /* 1023px以下は、ほかの送迎の欄と同じく1列に積む */
.bus-area.is-clear .ba-ph img { aspect-ratio: auto; height: auto; object-fit: contain; border-radius: 0; box-shadow: none; }
/* 在校生サポートのボタンを2つ並べるとき（長岡文化の D-Sma の iPhone／Android）、間をあける（2026-10-28） */
.sup .btns { display: flex; flex-wrap: wrap; gap: 10px 12px; }

.lp-exam .lp-div { margin-bottom: 16px; }

/* 教習プラン：期間は目安だと伝える注記（カードの中）と、延長についての説明（2026-11-05 酒井さん） */
.plc-meyasu { position: relative; background: #FFF3E8; border: 2px dashed #F4A871; border-radius: 18px; padding: 22px 18px 14px; margin: 18px 0 14px; }
.pm-tag { position: absolute; left: 14px; top: -14px; transform: rotate(-4deg); background: #EE5F1F; color: #fff; font-family: "Montserrat", var(--font); font-weight: 800; font-size: 15px; letter-spacing: .06em; border-radius: 8px; padding: 2px 12px; box-shadow: 0 3px 0 #B8430F; }
.plc-meyasu p { margin: 0; text-wrap: pretty; }
.pm-list { list-style: disc; margin: 0; padding-left: 1.3em; display: grid; gap: 2px; }
.pm-sub { margin: 2px 0 10px; color: var(--c-muted); font-size: 16px; }
.pm-mark { font-weight: 700; background: linear-gradient(transparent 62%, #FFE27A 62%); }
.pm-link { display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; background: #fff; border: 2px solid #EE5F1F; color: #C8490F; border-radius: 999px; padding: 4px 16px; font-weight: 700; transition: background .2s, color .2s; }
.pm-link:hover { background: #EE5F1F; color: #fff; }
.pm-link .chev { transform: rotate(90deg); margin-left: .3em; width: .7em; height: .7em; }
.plan-extend { margin-top: clamp(24px, 2.4vw, 40px); background: #FFEFE3; border-radius: 28px; padding: clamp(22px, 2.4vw, 40px); scroll-margin-top: 110px; }
.plan-extend .pe-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-bottom: 12px; }
.plan-extend h3 { margin: 0; font-size: clamp(22px, 1.8vw, 30px); font-weight: 900; }
.plan-extend .pe-tag { display: inline-block; transform: rotate(-2deg); background: #EE5F1F; color: #fff; border-radius: 8px; padding: 3px 14px; font-size: 15px; font-weight: 700; white-space: nowrap; box-shadow: 0 3px 0 #B8430F; }
.plan-extend p { margin: 0 0 4px; text-wrap: pretty; }
.pe-cases { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.pe-cases li { display: flex; flex-direction: column; align-items: center; gap: 8px; background: #fff; border-radius: 20px; padding: 18px 16px; box-shadow: 0 4px 0 #FAD9BF; text-wrap: pretty; }
.pe-cases li > span:last-child { width: 100%; }
@supports (word-break: auto-phrase) { .pe-cases li > span:last-child { word-break: auto-phrase; } }
.pe-ic { display: block; width: 72px; height: 72px; }
.pe-ic .pic { width: 100%; height: 100%; display: block; }
@media (max-width: 767px) {
  .pe-cases { grid-template-columns: minmax(0, 1fr); }
  .pe-cases li { flex-direction: row; align-items: center; gap: 12px; padding: 12px 14px; }
  .pe-ic { flex: none; width: 56px; height: 56px; }
}

/* 教習プランのラベル：image2で作ったステッカーを各プランの画像の右上に貼る。いちばん人気は一番大きく、カードも金の枠で目立たせる */
.plc-fig { position: relative; }
/* 絵の上の空きに置く（絵は画像の上から16〜20%より下にある。top は絵の上端にラベルの下端が来る値） */
.plc-tag { position: absolute; z-index: 2; right: 3%; top: -16%; width: 36%; height: auto; transform: rotate(4deg); filter: drop-shadow(0 4px 8px rgba(30, 36, 48, .18)); pointer-events: none; }
.plc-tag.is-top { width: 48%; right: 3%; top: -43%; }
.plc.is-top { box-shadow: 0 0 0 3px #F7B500, 0 14px 30px rgba(247, 181, 0, .28); }
@media (max-width: 767px) {
  .plc { grid-template-columns: minmax(0, 1fr); }
  .plc-fig { max-width: 420px; }
  .plc-tag { top: -10%; right: -2%; width: 34%; }
  .plc-tag.is-top { top: -12%; right: -3%; width: 40%; }
  /* 「スケジュールの目安」は長いので、幅が足りなければ値を次の行へ */
  .pc-row { flex-wrap: wrap; gap: 2px 10px; }
}

/* パックのラベルもステッカーに（プランのラベルと同じ） */
.pk-opts:has(.pk-sticker) { margin-top: clamp(46px, 3.8vw, 60px); }   /* ラベルが上の説明文に重ならないように */
.pk-sticker { position: absolute; z-index: 2; top: clamp(-40px, -2.4vw, -34px); right: clamp(-14px, -.8vw, -8px); width: clamp(170px, 15vw, 250px); height: auto; transform: rotate(3deg); filter: drop-shadow(0 4px 8px rgba(30, 36, 48, .18)); pointer-events: none; }
@media (min-width: 768px) and (max-width: 1100px) { .pk-sticker { width: 150px; top: -36px; } }   /* パックが2列で狭い幅では、パック名にかからない大きさに */

/* ===== WordPress のお知らせ（一覧・詳細） ===== */
.nw h2 a { color: inherit; }
.nw h2 a:hover { color: var(--c-main); }
.nw-more { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; color: var(--c-main); font-weight: 700; }
.nw-more .chev { width: .7em; height: .7em; }
.nw-single { max-width: 920px; margin-left: auto; margin-right: auto; }
.nw-list { margin-left: auto; margin-right: auto; }
.nw-pager .nav-links { justify-content: center; }
.nw-body { margin-top: 12px; }
.nw-body p { margin: 0 0 1em; }
/* 本文のリンクは青・下線で、押せる所だと分かるように */
.nw-body a { color: var(--c-main); text-decoration: underline; text-underline-offset: 3px; font-weight: 700; }
.nw-body a:hover { text-decoration-thickness: 2px; }
.nw-body img { max-width: 100%; height: auto; border-radius: 16px; }
.nw-body iframe { max-width: 100%; }
/* 前後のお知らせ（前＝ひとつ古い記事、次＝ひとつ新しい記事） */
.nw-adj { max-width: 920px; margin: 40px auto 0; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.nw-adj-a { display: flex; flex-direction: column; gap: 4px; padding: 18px 22px; border-radius: 16px; background: #fff; border: 2px solid var(--c-line, #e3e8ef); color: inherit; transition: border-color .2s; }
.nw-adj-a:hover { border-color: var(--c-main); }
.nw-adj-next { text-align: right; align-items: flex-end; }
.nw-adj-none { border: 0; background: none; padding: 0; }
.nw-adj-l { display: inline-flex; align-items: center; gap: 6px; color: var(--c-main); font-weight: 700; }
.nw-adj-l .chev { width: .7em; height: .7em; margin-left: 0; }
.nw-adj-prev .chev { transform: rotate(180deg); }
.nw-adj-d { color: var(--c-muted); font-size: 0.9rem; }
.nw-adj-t { font-weight: 700; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 640px) { .nw-adj { grid-template-columns: 1fr; } .nw-adj-none { display: none; } }
.nw-back { margin-top: 32px; text-align: center; }
.nw-pager { margin-top: 32px; }
.nw-pager .nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.nw-pager .page-numbers { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border-radius: 999px; background: #fff; border: 2px solid var(--c-main); color: var(--c-main); font-weight: 700; }
.nw-pager .page-numbers.current { background: var(--c-main); color: #fff; }
.news-none { padding: 12px 0; color: var(--c-muted); }
/* Instagramの自動表示（プラグインが出す並びを、仮置きの6枚と同じ見た目にそろえる） */
.ig-feed #sb_instagram { width: 100% !important; padding: 0 !important; }
.ig-feed #sb_instagram #sbi_images { display: grid !important; grid-template-columns: repeat(6, 1fr); gap: clamp(8px, .8vw, 16px) !important; padding: 0 !important; }
.ig-feed #sb_instagram .sbi_item { width: auto !important; margin: 0 !important; padding: 0 !important; }
.ig-feed #sb_instagram .sbi_photo { display: block; height: auto !important; aspect-ratio: 3 / 4; border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-sm); background-size: cover; background-position: center; }
.ig-feed #sb_instagram .sbi_photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.ig-feed #sb_instagram .sbi_photo:hover img { transform: scale(1.05); }
.ig-feed #sb_instagram #sbi_load, .ig-feed #sb_instagram .sb_instagram_header { display: none !important; }
@media (max-width: 900px) { .ig-feed #sb_instagram #sbi_images { grid-template-columns: repeat(3, 1fr); } }
/* ログイン中に出る管理バーの下にヘッダーがもぐらないように */
.admin-bar .header { top: 32px; }
@media (max-width: 782px) { .admin-bar .header { top: 46px; } }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }