/*
Theme Name: cds625
Description: 中越自動車学校グループ共通のテーマ（make_wp_theme.py から書き出し）。この書き出しは 桐生自動車教習所 用（学校ごとの値は schools/kiryu.py）。お知らせだけを管理画面から更新する。
Author: アスタ
Version: 4d37be6ac3
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); }
.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; }
.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; }
.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 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; }
.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; } }

/* ===== 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-back { margin-top: 32px; }
.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); }
/* ログイン中に出る管理バーの下にヘッダーがもぐらないように */
.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); }