/* ==========================================================
   エンキャリ 共通スタイル（全ページ）
   ＝静的モックの assets/css/toc.css と同一内容
   ========================================================== */
/* ==========================================================
   エンキャリ 共通スタイル（TOPと同一デザインシステム）
   index.html のインラインCSSと同期させること
   ========================================================== */
:root {
  --ink: #000; --line: #e4e4e4; --bg: #fff;
  --c-pink: #ff3ecd; --c-lime: #0088c6; --c-blue: #0088c6;
  --bg-alt: #e6f3fa; --bg-soft: #f6f6f6;
  --sans: "Jost", "MFW-MidashiGoPro-MB31", 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', '游ゴシック', YuGothic, 'メイリオ', Meiryo, sans-serif;
  --font-en: "GillSansNova-Bold", "Jost", "MFW-MidashiGoPro-MB31", 'Hiragino Kaku Gothic ProN', sans-serif;
  --ease: cubic-bezier(0.19, 1, 0.22, 1);
  --side: 0px; --rail: 72px; --top: 92px; --inner: 1200px;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
* { font-weight: 700 !important; }
.fa-brands, .fab { font-weight: 400 !important; } .fa-solid, .fas { font-weight: 900 !important; } .fa-regular, .far { font-weight: 400 !important; }
html { scroll-behavior: smooth; }
body { font-family: var(--sans); color: var(--ink); background: var(--bg); line-height: 1.8; overflow-x: hidden; line-break: strict; }
/* 日本語の改行最適化：孤立行を避ける（狭いカード内は通常折り返しで行を埋める） */
p, h1, h2, h3, li, small { text-wrap: pretty; }
.msg-p, .sec-lead, .kv-sub, .spt p, .vc .q, .promo-sub, .bigb p, .cb .tx p,
.faq-a-inner, .feature p, .partners-ttl, .cta-txt, .newsbox .t,
/* 子ページの本文（幅280px以上のブロック）も文節で改行して孤立行を防ぐ */
.phead .cap, .lead, .body-copy p, .curr-item p, .step-body p, .spec dd,
.doc p, .doc ol li, .tbl td, .article-body p, .midcta p, .box li,
.price-card li, .note, .msg-note, .price-note, .partners-note, .vlist,
.nlist .t, .two .tx p, .curr-item,
/* 見出し・FAQ・フッターナビも文節改行（末尾1〜2文字の孤立を防ぐ） */
.faq-q, .article-body h2, .article-body h3, .f-nav a,
.tile h3, .cb .tx h3, .spt h3, .article h1, .bigb h3 { word-break: auto-phrase; }
.topic .t, .tile ul li, .num .c, .gc p, .sns-card small, .course-tgt li, .targets li { word-break: normal; overflow-wrap: anywhere; }
/* NEWSカード見出し：文節で折り返し＋行を均等配分（単語の途中切れと末尾1〜2文字の孤立を同時に防ぐ） */
.nc .t { word-break: auto-phrase; overflow-wrap: anywhere; text-wrap: balance; }
body.is-locked { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.en { font-family: var(--font-en); }

/* ================= Loader（緑スクエアドットの横グラデ） ================= */
.loader { position: fixed; inset: 0; z-index: 1000; background: #fff; transition: clip-path 1s var(--ease); clip-path: inset(0 0 0 0); }
.loader.is-done { clip-path: inset(0 0 100% 0); pointer-events: none; }
.loader-sweep { position: absolute; inset: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22'%3E%3Crect x='5' y='5' width='11' height='11' fill='%232aff00'/%3E%3C/svg%3E"); background-size: 22px 22px; -webkit-mask: linear-gradient(90deg, #000 28%, transparent 92%); mask: linear-gradient(90deg, #000 28%, transparent 92%); clip-path: inset(0 100% 0 0); animation: sweep 1.4s var(--ease) forwards; }
@keyframes sweep { 0% { clip-path: inset(0 100% 0 0); } 72%, 100% { clip-path: inset(0 0 0 0); } }

/* ================= Layout：左上ロゴ＋右レール ================= */
.brand { position: fixed; left: 28px; top: 22px; z-index: 120; }
.brand img { height: 40px; width: auto; }
.rail { position: fixed; right: 0; top: 0; bottom: 0; width: var(--rail); z-index: 120; display: flex; flex-direction: column; align-items: stretch; }
.rail-menu { width: 44px; height: 44px; margin: 22px auto 0; background: #fff; border: 1px solid var(--line); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border-radius: 4px; }
.rail-menu span { display: block; width: 18px; height: 2px; background: #000; }
.rail-menu:hover { border-color: #000; }
.rail-btns { margin: auto 0; display: flex; flex-direction: column; }
.rail-btn { height: 190px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.rail-btn i { font-size: 1.1rem; }
.rail-btn span { writing-mode: vertical-rl; font-size: .74rem; letter-spacing: .22em; }
.rail-btn--recruit { background: var(--c-lime); color: #fff; }
.rail-btn--contact { background: #000; color: #fff; }
.rail-btn:hover { filter: brightness(1.06); }
.rail-top { width: 44px; height: 44px; margin: 0 auto 22px; background: #fff; border: 1px solid var(--line); display: grid; place-items: center; border-radius: 4px; }
.rail-top:hover { border-color: #000; }
.rail-top i { font-size: .95rem; color: #000; }
.wrap { margin-right: var(--rail); padding-top: var(--top); }
.inner { width: min(var(--inner), calc(100% - 144px)); margin-inline: auto; }
.float { display: none; }
/* 全画面メニュー（PC/SP共通） */
.mnav { position: fixed; inset: 0; z-index: 130; background: #fff; display: none; overflow: auto; padding: 96px 32px 48px; }
.mnav.is-open { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(32px, 5vw, 80px); align-content: start; padding-inline: max(32px, calc((100% - 1200px) / 2)); }
.mnav-close { position: fixed; right: 26px; top: 22px; width: 46px; height: 46px; background: var(--c-lime); color: #fff; font-size: 1.3rem; z-index: 2; }
.mnav a.item { display: flex; justify-content: space-between; align-items: center; padding: 1em 0; border-bottom: 1px solid var(--line); font-size: 1.15rem; }
.mnav a.item small { font-size: .7rem; letter-spacing: .2em; color: var(--c-blue); font-family: var(--font-en); }
.mnav-lbl { font-size: .72rem; letter-spacing: .2em; color: var(--c-blue); margin-bottom: .8em; }
.mnav-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.mnav-pills a { border: 1px solid #000; border-radius: 999px; padding: .5em 1.1em; font-size: .8rem; }
.mnav-ctas { display: grid; gap: 10px; margin-top: 28px; }
.mnav-ctas .btn { min-width: 0; width: 100%; }
.mnav-sns { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 28px; font-size: .78rem; letter-spacing: .1em; }
.mnav-sns a { border-bottom: 1px solid #000; display: inline-flex; align-items: center; gap: .5em; } .mnav-sns i { font-size: 1rem; }
/* ---- メニューの開閉アニメーション（2枚カーテン＋項目スタガー） ---- */
/* パネル地色はカーテン（::after）が担うので .mnav 自体は透明 */
.mnav { background: transparent; }
.mnav::before, .mnav::after { content: ""; position: fixed; inset: 0; transform: scaleY(0); transform-origin: top;
  transition: transform .58s cubic-bezier(.76, 0, .24, 1); will-change: transform; }
.mnav::before { background: var(--c-lime); }
.mnav::after { background: #fff; transition-delay: .13s; }
.mnav.is-in::before, .mnav.is-in::after { transform: scaleY(1); }
/* 閉じるときは下から抜ける（逆再生） */
.mnav.is-closing::before, .mnav.is-closing::after { transform-origin: bottom; transition-duration: .42s; }
.mnav.is-closing::before { transition-delay: .1s; }
.mnav.is-closing::after { transition-delay: 0s; }
.mnav-main, .mnav-side { position: relative; z-index: 1; }
/* 項目は下からせり上がる（--i で順番） */
.mnav .item, .mnav-side > * { opacity: 0; transform: translateY(24px);
  transition: opacity .5s ease, transform .62s cubic-bezier(.22, 1, .36, 1);
  transition-delay: calc(.36s + var(--i, 0) * .055s); }
.mnav.is-in .item, .mnav.is-in .mnav-side > * { opacity: 1; transform: none; }
.mnav.is-closing .item, .mnav.is-closing .mnav-side > * { transition-duration: .2s; transition-delay: 0s; }
/* 閉じるボタンは回り込んで出現 */
.mnav-close { opacity: 0; transform: rotate(-90deg) scale(.7);
  transition: opacity .4s ease .44s, transform .5s cubic-bezier(.22, 1, .36, 1) .44s; }
.mnav.is-in .mnav-close { opacity: 1; transform: none; }
.mnav.is-closing .mnav-close { transition-delay: 0s; transition-duration: .18s; }
/* 項目ホバー：ライムの下線がスイープ */
.mnav a.item { position: relative; }
.mnav a.item::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 0; height: 2px; background: var(--c-lime); transition: width .34s cubic-bezier(.22, 1, .36, 1); }
.mnav a.item:hover::after { width: 100%; }
@media (prefers-reduced-motion: reduce) {
  .mnav::before, .mnav::after, .mnav .item, .mnav-side > *, .mnav-close { transition: none !important; }
  .mnav.is-open::after { transform: scaleY(1); }
  .mnav.is-open .item, .mnav.is-open .mnav-side > *, .mnav.is-open .mnav-close { opacity: 1; transform: none; }
}
.mhead { display: none; }  .mhead, .mnav { display: none; }
.wrap { margin-left: var(--side); padding-top: var(--top); }
.inner { width: min(var(--inner), calc(100% - 144px)); margin-inline: auto; }

/* ================= KV スライダー（中央1200×628・左右見切れ・ライム矢印） ================= */
.kv { position: relative; overflow: hidden; background: #f1f1f1; }
.kv-track { display: flex; gap: 10px; transition: transform .6s var(--ease); will-change: transform; }
.kv-slide { position: relative; flex: 0 0 min(1200px, calc((100vw - var(--rail)) * .84)); aspect-ratio: 1200 / 628; overflow: hidden; background: #000; color: #fff; border-radius: 10px; }
.kv-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kv-slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.42) 46%, rgba(0,0,0,.06) 100%), linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.55) 100%); }
.kv-copy { position: absolute; left: clamp(28px, 5%, 72px); bottom: clamp(28px, 7%, 64px); z-index: 2; max-width: 56%; }
.kv-tag { display: inline-block; background: var(--c-lime); color: #fff; font-size: .74rem; letter-spacing: .18em; padding: .4em 1em; margin-bottom: 1em; }
.kv-tag.pk { background: var(--c-pink); color: #fff; }
.kv-ttl { font-size: clamp(1.7rem, 3.4vw, 3.4rem); line-height: 1.25; letter-spacing: .02em; }
.kv-sub { font-size: clamp(.82rem, 1.1vw, 1rem); margin-top: .9em; line-height: 1.9; }
.kv-btn { display: inline-flex; align-items: center; gap: .7em; margin-top: 1.4em; background: #fff; color: #000; padding: .8em 1.4em; border-radius: 6px; font-size: .84rem; letter-spacing: .08em; }
.kv-btn i { font-style: normal; }
.kv-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; width: 56px; height: 56px; background: var(--c-lime); color: #fff; display: grid; place-items: center; font-family: var(--font-en); font-size: 1.6rem; line-height: 1; }
.kv-arrow--prev { left: 0; } .kv-arrow--next { right: 0; }
.kv-arrow:hover { background: #000; color: var(--c-lime); }
.kv-dots { display: flex; justify-content: center; gap: 8px; padding: 14px 0 6px; }
.kv-dot { width: 54px; height: 6px; background: #d9d9d9; } .kv-dot.is-active { background: var(--c-lime); }

/* 対象者別ピルバー */
.whobar { background: #fff; padding: 10px 0 22px; }
.whobar ul { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.whobar a { display: inline-flex; align-items: center; gap: .5em; background: var(--c-lime); color: #fff; border-radius: 999px; padding: .55em 1.3em; font-size: .8rem; letter-spacing: .06em; }
.whobar a i { font-style: normal; }

/* 横長プロモバナー */
.promo { padding: 6px 0 40px; }
.promo a { position: relative; display: grid; grid-template-columns: 1fr 380px; min-height: 180px; border: 1px solid var(--line); overflow: hidden; background: #000; color: #fff; border-radius: 14px; }
.promo img { background: #1c1c1c; }
.promo-txt { padding: clamp(1.4em, 3vw, 2.4em) clamp(1.4em, 3vw, 2.6em); display: flex; flex-direction: column; justify-content: center; gap: .5em; background: linear-gradient(90deg, #000 70%, rgba(0,0,0,0) 100%); position: relative; z-index: 1; margin-right: -80px; padding-right: 100px; }
.promo-lbl { color: var(--c-lime); font-size: .74rem; letter-spacing: .2em; }
.promo-ttl { font-size: clamp(1.4rem, 2.4vw, 2.2rem); line-height: 1.3; }
.promo-ttl em { font-style: normal; color: var(--c-lime); }
.promo-sub { font-size: .86rem; }
.promo img { width: 100%; height: 100%; object-fit: cover; }

/* ================= 共通：見出し・ボタン ================= */
section { padding: 64px 0 80px; }
.h2 .big { font-family: var(--font-en); font-size: clamp(2.6rem, 5.2vw, 4.4rem); line-height: 1; letter-spacing: .01em; color: #000; }
.h2 .row { display: flex; align-items: center; gap: 1.2em; flex-wrap: wrap; margin-top: .45em; }
.h2 h2 { font-size: clamp(1.15rem, 1.7vw, 1.45rem); line-height: 1.3; letter-spacing: .04em; padding-left: .9em; border-left: 5px solid var(--c-lime); }
.h2 .cap { color: var(--c-pink); font-size: .88rem; letter-spacing: .04em; }
.h2 .cap::before { content: "▶"; font-size: .7em; margin-right: .5em; }
.h2--inv .cap { color: #000; }
/* NEWS! ボックス */
.newsbox { background: #000; color: #fff; border-radius: 14px; padding: 26px 30px 24px; display: grid; grid-template-columns: 220px 1fr auto; gap: 26px; align-items: center; margin-bottom: 30px; }
.nb-h .big { display: block; font-family: var(--font-en); font-size: 2.4rem; line-height: 1; color: var(--c-lime); }
.nb-h small { display: block; font-size: .74rem; letter-spacing: .08em; margin-top: .4em; }
.newsbox ul li { border-top: 1px solid rgba(255,255,255,.14); }
.newsbox ul li:first-child { border-top: 0; }
.newsbox ul a { display: grid; grid-template-columns: 96px 110px 1fr; gap: 14px; align-items: center; padding: .7em 0; font-size: .86rem; }
.newsbox time { font-size: .76rem; letter-spacing: .06em; }
.newsbox .cat { font-size: .64rem; letter-spacing: .14em; background: var(--c-lime); color: #fff; text-align: center; padding: .25em .4em; }
.newsbox .t { line-height: 1.6; }
.nb-more { display: inline-flex; align-items: center; gap: .6em; border: 1px solid var(--c-lime); color: var(--c-lime); border-radius: 999px; padding: .7em 1.4em; font-size: .8rem; white-space: nowrap; }
.nb-more i { font-style: normal; }
/* SNS / MEDIA */
.sns-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 24px; margin-top: 30px; }
.sns-ig, .sns-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.sns-ig { padding: 24px; display: flex; flex-direction: column; gap: 18px; }
.sns-head { display: flex; align-items: center; gap: 12px; }
.sns-head b { display: block; font-size: 1rem; } .sns-head small { display: block; font-size: .72rem; letter-spacing: .06em; }
.sns-ic { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: #000; color: var(--c-lime); font-size: 1.15rem; flex-shrink: 0; }
.ig-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.ig-grid a { aspect-ratio: 1; overflow: hidden; border-radius: 8px; background: var(--bg-soft); }
.ig-grid img { width: 100%; height: 100%; object-fit: cover; }
.sns-ig .btn { min-width: 0; align-self: flex-start; }
.sns-side { display: grid; gap: 12px; }
.sns-card { display: grid; grid-template-columns: 44px 1fr auto; gap: 14px; align-items: center; padding: 16px 18px; }
.sns-card b { display: block; font-size: .95rem; } .sns-card small { display: block; font-size: .72rem; letter-spacing: .02em; }
.sns-card > i { font-style: normal; font-family: var(--font-en); }
.sns-card--line { background: var(--c-pink); color: #fff; border-color: var(--c-pink); }
.sns-card--line .sns-ic { background: #fff; color: var(--c-pink); }
.btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.2em; min-width: 260px; height: 56px; padding: 0 1.4em 0 1.6em; border-radius: 8px; background: var(--c-lime); color: #fff; font-size: .9rem; letter-spacing: .08em; }
.btn i { font-style: normal; font-family: var(--font-en); }
.btn--dark { background: #000; color: #fff; }
.btn--white { background: #fff; color: #000; border: 2px solid #000; }
.btn--pink { background: var(--c-pink); color: #fff; }
.center { text-align: center; }
.more { margin-top: 36px; }

/* ================= TOPICS・EVENT ================= */
.topics-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 30px; }
.topic { display: block; }
.topic .ph { aspect-ratio: 258 / 258; overflow: hidden; border: 1px solid var(--line); background: var(--bg-soft); position: relative; border-radius: 12px; }
.topic .ph::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 65%, rgba(0,0,0,.45) 100%); pointer-events: none; }
.topic .ph img { width: 100%; height: 100%; object-fit: cover; }
.topic .ph .lbl { position: absolute; left: 0; top: 0; background: var(--c-lime); color: #fff; font-size: .66rem; letter-spacing: .14em; padding: .4em .9em; }
.topic .ph .lbl.pk { background: var(--c-pink); color: #fff; }
.topic .ph .lbl.bk { background: #000; color: var(--c-lime); }
.topic .t { font-size: .9rem; line-height: 1.6; margin-top: .8em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.topic .ph .d { position: absolute; left: 10px; bottom: 10px; z-index: 1; font-size: .7rem; letter-spacing: .08em; background: #fff; color: #000; padding: .25em .7em; border-radius: 4px; }

/* ================= コース紹介（595×312タイル） ================= */
.course-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 30px; }
.tile { position: relative; display: grid; grid-template-columns: 1fr 1fr; min-height: 312px; overflow: hidden; color: #fff; background: #000; border-radius: 14px; }
.tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 62%, rgba(0,0,0,.6) 100%); pointer-events: none; }
.tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.72); }
.tile::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.86) 0%, rgba(0,0,0,.66) 42%, rgba(0,0,0,.22) 100%); }
.tile--lime .tile-lbl { background: var(--c-lime); color: #fff; }
.tile--pink .tile-lbl { background: var(--c-pink); color: #fff; }
.tile--green .tile-lbl { background: var(--c-blue); color: #fff; }
.tile--black .tile-lbl { background: #fff; color: #000; }
.tile-in { position: relative; z-index: 2; grid-column: 1 / 2; padding: 26px 26px 28px; display: flex; flex-direction: column; }
.tile-lbl { align-self: flex-start; font-size: .68rem; letter-spacing: .14em; padding: .35em .9em; background: #fff; color: #000; }
.tile h3 { font-size: clamp(1.25rem, 1.9vw, 1.7rem); line-height: 1.35; margin-top: .8em; }
.tile .en { font-size: .68rem; letter-spacing: .24em; margin-top: .3em; color: var(--c-lime); }
.tile ul { margin-top: 1em; display: grid; gap: .25em; font-size: .82rem; }
.tile ul li::before { content: "・"; }
.tile .go { margin-top: auto; padding-top: 1em; display: inline-flex; align-items: center; gap: .6em; font-size: .78rem; letter-spacing: .1em; }
.tile .go i { font-style: normal; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--c-lime); color: #fff; }
.tile-tgt { position: absolute; right: 18px; bottom: 18px; z-index: 2; display: flex; gap: 4px; }
.tile-tgt span { font-size: .6rem; letter-spacing: .06em; padding: .3em .6em; background: rgba(255,255,255,.14); color: rgba(255,255,255,.6); border: 1px solid rgba(255,255,255,.35); }
.tile-tgt span.on { background: var(--c-lime); color: #fff; border-color: var(--c-lime); }

/* 2バナー（写真＋テキスト） */
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 30px; }
.two a { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); background: #fff; overflow: hidden; border-radius: 14px; }
.two .ph { aspect-ratio: 4 / 3; overflow: hidden; background: var(--bg-soft); } .two .ph img { width: 100%; height: 100%; object-fit: cover; }
.two .tx { padding: 24px; display: flex; flex-direction: column; gap: .5em; }
.two .tx .lbl { font-size: .7rem; letter-spacing: .18em; color: var(--c-blue); }
.two .tx h3 { font-size: 1.25rem; line-height: 1.4; }
.two .tx p { font-size: .82rem; }
.two .tx .btn { margin-top: auto; min-width: 0; height: 46px; font-size: .8rem; }

/* 大バナー2枚（グラフィック） */
.big2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.bigb { position: relative; min-height: 260px; overflow: hidden; display: flex; align-items: center; padding: 34px; border-radius: 16px; background: #1c1c1c; }
.bigb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.7); }
.bigb::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.86) 0%, rgba(0,0,0,.62) 52%, rgba(0,0,0,.2) 100%); }
.bigb { color: #fff; }
.bigb .in { position: relative; z-index: 1; max-width: 66%; }
.bigb .big { font-family: var(--font-en); font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1; letter-spacing: .02em; color: var(--c-lime); }
.bigb h3 { font-size: clamp(1.2rem, 1.8vw, 1.6rem); line-height: 1.4; margin-top: .4em; }
.bigb p { font-size: .84rem; margin-top: .6em; }
.bigb .kv-btn { margin-top: 1.1em; background: var(--c-lime); color: #fff; }
.bigb--dark .kv-btn { background: #fff; color: #000; }

/* ================= MESSAGE（MODE参照：黒箱見出し＋本文＋職種ピル） ================= */
.message { background: #fff; padding: 80px 0 70px; }
.msg-h { display: inline-block; background: #000; color: #fff; font-size: clamp(1.5rem, 2.6vw, 2.3rem); line-height: 1.3; letter-spacing: .04em; padding: .35em .8em; }
.msg-h--sub { margin-top: 56px; font-size: clamp(1.25rem, 2.1vw, 1.8rem); }
.msg-p { margin-top: 28px; font-size: .95rem; line-height: 2.1; max-width: 62em; }
.jobs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 24px; }
.jobs a { display: flex; align-items: center; justify-content: space-between; border: 2px solid var(--c-lime); padding: .85em 1.1em .85em 1.3em; font-size: .88rem; letter-spacing: .04em; border-radius: 4px; }
.jobs a i { font-style: normal; font-family: var(--font-en); width: 30px; height: 30px; background: var(--c-lime); color: #fff; display: grid; place-items: center; }
.jobs a:hover { background: var(--c-lime); color: #fff; }
.msg-note { margin-top: 16px; font-size: .74rem; letter-spacing: .04em; }

/* ================= 3つの強み ================= */
.strong { background: #000; color: #fff; }
.strong .h2 .big, .strong .h2 h2 { color: #fff; } .strong .h2 h2 { border-left-color: var(--c-lime); } .strong .cap { color: var(--c-lime); }
.sp-list { display: grid; gap: 40px; margin-top: 36px; }
.spt { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; background: #121212; border: 1px solid #262626; border-radius: 16px; padding: 34px; }
.spt--rev .spt-ph { order: 2; }
.spt-no { display: inline-flex; align-items: center; gap: .6em; background: var(--c-lime); color: #fff; padding: .3em .9em; font-size: .78rem; letter-spacing: .14em; border-radius: 4px; }
.spt-no b { font-family: var(--font-en); font-size: 1.1rem; }
.spt h3 { font-size: clamp(1.3rem, 2vw, 1.8rem); line-height: 1.45; margin-top: .8em; }
.spt h3 em { font-style: normal; color: var(--c-lime); }
.spt p { font-size: .9rem; margin-top: 1em; line-height: 2; }
.spt-ph { aspect-ratio: 16 / 10; overflow: hidden; border-radius: 12px; background: #1c1c1c; } .spt-ph img { width: 100%; height: 100%; object-fit: cover; }
.diagram { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 10px; margin-top: 1.4em; }
.dg { border: 1px solid #333; background: #0a0a0a; padding: 14px; text-align: center; font-size: .78rem; line-height: 1.6; border-radius: 8px; }
.dg b { display: block; font-family: var(--font-en); font-size: .9rem; letter-spacing: .12em; margin-bottom: .3em; }
.dg--c { background: var(--c-lime); border-color: var(--c-lime); color: #fff; }
.dg-arr { font-family: var(--font-en); font-size: 1.2rem; }

/* ================= 受講生の声 ================= */
.voices-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 30px; }
.vc { background: #fff; border: 1px solid var(--line); display: flex; flex-direction: column; border-radius: 14px; overflow: hidden; }
.vc .ph { aspect-ratio: 4 / 3; overflow: hidden; background: var(--bg-soft); } .vc .ph img { width: 100%; height: 100%; object-fit: cover; }
.vc .in { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: .7em; flex: 1; }
.vc .q { font-size: 1rem; line-height: 1.8; }
.vc .who { font-size: .8rem; margin-top: .3em; }
.vc .who small { display: block; font-size: .7rem; letter-spacing: .06em; color: var(--c-blue); }
.vc .lnk { margin-top: auto; display: inline-flex; align-items: center; gap: .6em; font-size: .78rem; letter-spacing: .1em; padding-top: .8em; }
.vc .lnk i { font-style: normal; width: 24px; height: 24px; border-radius: 50%; background: var(--c-lime); color: #fff; display: grid; place-items: center; }
.vlist { margin-top: 30px; border: 1px solid var(--line); padding: 22px 26px; font-size: .84rem; line-height: 2; background: #fff; }
.vlist b { display: inline-block; background: #000; color: var(--c-lime); padding: .1em .8em; margin-right: .8em; font-size: .74rem; letter-spacing: .1em; }

/* ================= 実績 ================= */
.nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 30px; }
.num { border: 1px solid var(--line); border-top: 6px solid var(--c-lime); padding: 26px 26px 28px; background: #fff; border-radius: 12px; }
.num .v { font-family: var(--font-en); font-size: clamp(2.6rem, 4.6vw, 4rem); line-height: 1; }
.num .v i { font-style: normal; font-size: .34em; margin-left: .2em; }
.num .c { font-size: .82rem; margin-top: .8em; letter-spacing: .06em; }
.cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 20px; }
.box { border: 1px solid var(--line); background: #fff; padding: 26px; border-radius: 12px; }
.box h3 { font-size: 1.05rem; display: flex; align-items: center; gap: .6em; margin-bottom: .8em; }
.box h3::before { content: ""; width: 10px; height: 10px; background: var(--c-lime); }
.box li { font-size: .88rem; padding: .55em 0; border-bottom: 1px dashed var(--line); }
.box li:last-child { border-bottom: 0; }

/* 相談バナー2 */
.consult { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.cb { position: relative; display: grid; grid-template-columns: 1fr 1fr; min-height: 200px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; }
.cb .tx { padding: 28px; display: flex; flex-direction: column; justify-content: center; gap: .5em; }
.cb .tx .lbl { font-size: .7rem; letter-spacing: .18em; }
.cb .tx h3 { font-size: 1.4rem; line-height: 1.35; }
.cb .tx p { font-size: .82rem; }
.cb .ph { overflow: hidden; background: var(--bg-soft); } .cb .ph img { width: 100%; height: 100%; object-fit: cover; }
.cb--pink { background: var(--c-pink); color: #fff; } .cb--pink .lbl { color: #fff; }
.cb--lime { background: var(--c-lime); color: #fff; }
.cb .kv-btn { margin-top: .8em; align-self: flex-start; }
.cb--pink .kv-btn { background: #fff; color: #000; }

/* ================= NEWS ================= */
.tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 26px; }
.tab { padding: .55em 1.2em; border: 1px solid #000; border-radius: 999px; font-size: .78rem; letter-spacing: .06em; }
.tab.is-current { background: #000; color: var(--c-lime); }
.news-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 24px; }
.nc { display: block; }
.nc .ph { aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; } .nc .ph img { width: 100%; height: 100%; object-fit: cover; }
.nc .meta { display: flex; align-items: center; gap: .8em; margin-top: .8em; font-size: .72rem; letter-spacing: .06em; }
.nc .meta .cat { background: var(--c-lime); color: #fff; padding: .2em .8em; }
.nc .t { font-size: .88rem; line-height: 1.6; margin-top: .5em; }
.nc.is-hidden { display: none; }
/* ================= 受講生の声：絞り込み ================= */
.vfilter { margin-top: 26px; border: 1px solid var(--line); border-radius: 14px; padding: 20px 22px 18px; background: var(--bg-soft); }
.vf-row { display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: start; gap: 14px; }
.vf-row + .vf-row { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.vf-lbl { font-size: .78rem; letter-spacing: .08em; padding-top: .55em; }
.vfilter .tabs { margin-top: 0; }
.vfilter .tab { background: #fff; cursor: pointer; font-family: inherit; transition: background .2s ease, color .2s ease; }
.vfilter .tab.is-current { background: #000; color: var(--c-lime); }
.vfilter .tab:hover { background: var(--c-lime); color: #fff; }
.vfilter .tab.is-current:hover { background: #000; }
.vf-count { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); font-size: .78rem; letter-spacing: .06em; }
.vf-count b { color: var(--c-blue); }
.vc.is-hidden { display: none; }
.vf-empty { margin-top: 30px; padding: 42px 20px; text-align: center; border: 1px dashed var(--line); border-radius: 14px; font-size: .88rem; color: #000; background: #fff; }
@media (max-width: 767px) {
  .vfilter { padding: 16px 14px 14px; }
  .vf-row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .vf-lbl { padding-top: 0; font-size: .74rem; }
  .vfilter .tab { font-size: .72rem; padding: .5em .95em; }
}

/* ================= 申込案内（ライム帯・白カード4） ================= */
.guide { background: var(--c-lime); }
.guide .h2 h2, .guide .cap { color: #fff; } .guide .h2 .big { color: #fff; } .guide .h2 h2 { border-left-color: #fff; }
.guide-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 30px; }
.gc { background: #fff; padding: 30px 22px 26px; display: flex; flex-direction: column; align-items: center; gap: .6em; text-align: center; border: 2px solid #000; border-radius: 14px; }
.gc .ic { width: 64px; height: 64px; display: grid; place-items: center; background: #000; color: var(--c-lime); border-radius: 50%; }
.gc .ic i { font-size: 1.5rem; }
.gc h3 { font-size: 1.05rem; margin-top: .3em; }
.gc p { font-size: .78rem; }
.gc .arr { margin-top: .4em; font-family: var(--font-en); }

/* ================= Footer ================= */
.footer { background: #fff; border-top: 1px solid var(--line); padding: 70px 0 0; }
.f-top { display: grid; grid-template-columns: 1.1fr 3fr; gap: 60px; }
.f-logo img { height: 34px; width: auto; }
.f-addr { font-size: .82rem; margin-top: 1.4em; line-height: 2; }
.f-sns { display: flex; gap: 10px; margin-top: 1.4em; }
.f-sns a { width: 40px; height: 40px; border: 1px solid #000; display: grid; place-items: center; font-size: 1rem; }
.f-sns a:hover { background: #000; color: var(--c-lime); }
.f-nav { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.f-nav strong { display: block; font-size: .8rem; letter-spacing: .12em; padding-bottom: .6em; border-bottom: 2px solid var(--c-lime); margin-bottom: .8em; }
.f-nav a { display: block; font-size: .8rem; padding: .3em 0; }
.f-bottom { margin-top: 60px; background: #000; color: #fff; padding: 22px 0; }
.f-bottom .inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1em; font-size: .72rem; letter-spacing: .06em; }
.f-bottom a { margin-right: 1.6em; }

/* ================= 追従（PC右下：LINE・TOP／SP下部バー） ================= */
.float { display: none; }
.float a { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; font-size: .62rem; letter-spacing: .06em; text-align: center; line-height: 1.3; box-shadow: 0 10px 26px rgba(0,0,0,.18); }
.float .line { background: var(--c-pink); color: #fff; }
.float .top { background: #000; color: var(--c-lime); }
.spbar { display: none; }

/* ================= アニメーション ================= */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .8s ease var(--d, 0s), transform .9s var(--ease) var(--d, 0s); }
.reveal.visible { opacity: 1; transform: none; }
/* 見出し：英字が下から立ち上がる */
.h2 { overflow: hidden; }
.h2 .big { display: block; transform: translateY(105%); transition: transform 1s var(--ease); }
.h2.visible .big { transform: none; }
.h2 .row { opacity: 0; transform: translateY(14px); transition: opacity .7s ease .18s, transform .8s var(--ease) .18s; }
.h2.visible .row { opacity: 1; transform: none; }
/* 画像のリビール（下から立ち上がりつつ拡大解除） */
.topic .ph img, .vc .ph img, .spt-ph img, .nc .ph img, .two .ph img { transform: scale(1.12); transition: transform 1.4s var(--ease); }
.reveal.visible .ph img, .reveal.visible .spt-ph img, .spt.visible .spt-ph img { transform: scale(1); }
/* ホバーの微動 */
.tile img { transition: transform 1s var(--ease), filter .5s ease; }
.tile:hover img { transform: scale(1.06); }
.topic:hover .ph img, .nc:hover .ph img { transform: scale(1.06) !important; }
.bigb img, .cb .ph img, .promo img { transition: transform 1.1s var(--ease); }
.bigb:hover img, .cb:hover .ph img, .promo a:hover img { transform: scale(1.05); }
.gc { transition: transform .45s var(--ease), box-shadow .45s ease; }
.gc:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(0,0,0,.16); }
.logo-tile { transition: transform .4s var(--ease), border-color .3s; }
.logo-tile:hover { transform: translateY(-4px); border-color: #000; }
.jobs a { transition: background .3s ease, transform .35s var(--ease); }
.jobs a:hover { transform: translateX(4px); }
/* KV：中央スライドをゆっくりズーム（Ken Burns）＋コピーが立ち上がる */
.kv-slide img { transform: scale(1.02); transition: transform .8s ease; }
.kv-slide.is-active img { animation: kenburns 7.5s ease-out both; }
@keyframes kenburns { from { transform: scale(1.1); } to { transform: scale(1); } }
.kv-copy > * { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .8s var(--ease); }
.kv-slide.is-active .kv-copy > * { opacity: 1; transform: none; }
.kv-slide.is-active .kv-copy > *:nth-child(1) { transition-delay: .1s; }
.kv-slide.is-active .kv-copy > *:nth-child(2) { transition-delay: .2s; }
.kv-slide.is-active .kv-copy > *:nth-child(3) { transition-delay: .3s; }
.kv-slide.is-active .kv-copy > *:nth-child(4) { transition-delay: .4s; }
.kv-slide:not(.is-active) { opacity: .55; }
.kv-slide { transition: opacity .6s ease; }
/* 数字カウントアップ中の等幅化 */
.num .v .cnt { font-variant-numeric: tabular-nums; }

/* ================= モバイル（〜1099px） ================= */
@media (max-width: 1099px) {
  :root { --side: 0px; --rail: 0px; --top: 64px; }
  .brand, .rail, .float { display: none; }
  .mhead { display: flex; position: fixed; left: 0; right: 0; top: 0; height: 64px; z-index: 120; background: #fff; border-bottom: 1px solid var(--line); align-items: center; justify-content: space-between; padding: 0 12px 0 16px; }
  .mhead .mlogo img { height: 30px; width: auto; }
  .mhead .mbtns { display: flex; gap: 8px; }
  .mbtn { width: 48px; height: 48px; display: grid; place-items: center; font-size: 1.25rem; line-height: 1; text-align: center; }
  .mbtn--pink { background: var(--c-pink); color: #fff; }
  .mbtn--lime { background: var(--c-lime); color: #fff; }
  .mbtn--menu { display: flex; flex-direction: column; align-items: center; justify-content: center; }
  .mbtn--menu span { display: block; width: 20px; height: 2px; background: #fff; margin: 2px auto; }
  .mbtn--menu::after { content: "MENU"; display: block; margin-top: 4px; font-family: var(--font-en); font-size: .5rem; letter-spacing: .12em; line-height: 1; }
  .mnav { padding: 84px 20px 40px; }
  .mnav.is-open { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .mnav-close { right: 12px; top: 8px; }
  .mnav a.item { font-size: 1rem; }
  .wrap { margin-left: 0; margin-right: 0; }
  .inner { width: min(var(--inner), calc(100% - 32px)); }
  .kv-slide { flex-basis: 88vw; aspect-ratio: 4 / 4.2; }
  .kv-slide::after { background: linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.25) 40%, rgba(0,0,0,.82) 100%); }
  .kv-copy { left: 18px; right: 18px; bottom: 22px; max-width: none; }
  .kv-ttl { font-size: 1.6rem; }
  .kv-arrow { width: 44px; height: 44px; font-size: 1.3rem; }
  .kv-dot { width: 34px; }
  .whobar ul { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding: 0 16px; -webkit-overflow-scrolling: touch; }
  .whobar a { white-space: nowrap; }
  .promo a { grid-template-columns: 1fr; }
  .promo img { height: 160px; }
  section { padding: 48px 0 56px; }
  .h2 .big { font-size: 2.2rem; } .h2 h2 { font-size: 1.05rem; }
  .newsbox { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 20px 18px; }
  .newsbox ul a { grid-template-columns: 1fr; gap: 4px; }
  .newsbox .cat { justify-self: start; }
  .sns-grid { grid-template-columns: minmax(0, 1fr); }
  .message { padding: 52px 0 48px; } .msg-h { display: block; font-size: 1.25rem; } .msg-h--sub { margin-top: 36px; font-size: 1.1rem; }
  .jobs { grid-template-columns: 1fr; gap: 8px; }
  .jobs a { font-size: .84rem; padding: .8em .8em .8em 1.1em; letter-spacing: 0; gap: .6em; }
  .jobs a i { width: 24px; height: 24px; font-size: .74rem; flex-shrink: 0; }
  .promo-txt { margin-right: 0; padding-right: 1.4em; background: #000; }
  .topics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .topic .t { font-size: .8rem; line-height: 1.65; }
  .topic .ph .d { font-size: .64rem; padding: .2em .6em; }
  .course-grid { grid-template-columns: minmax(0, 1fr); }
  .tile { grid-template-columns: minmax(0, 1fr); min-height: 260px; }
  .tile img { filter: brightness(.5); }
  .tile::before { background: linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.8) 55%, rgba(0,0,0,.92) 100%); }
  .tile .en { color: var(--c-lime); }
  .tile ul { font-size: .8rem; }
  .tile-in { padding: 20px 18px 56px; }
  .tile-tgt { right: 12px; bottom: 12px; }
  .two, .big2, .consult, .cols2, .voices-grid, .nums, .guide-grid { grid-template-columns: minmax(0, 1fr); }
  .two a { grid-template-columns: minmax(0, 1fr); }
  .two .ph { aspect-ratio: 16 / 9; }
  .bigb { min-height: 200px; padding: 24px; } .bigb .in { max-width: none; }
  .spt { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 20px; } .spt--rev .spt-ph { order: 0; }
  .diagram { grid-template-columns: minmax(0, 1fr); } .dg-arr { transform: rotate(90deg); text-align: center; }
  .nums { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .num { padding: 14px 8px 14px; } .num .v { font-size: 1.55rem; } .num .v i { font-size: .3em; margin-left: .1em; }
  .num .c { font-size: .58rem; letter-spacing: 0; line-height: 1.5; margin-top: .5em; }
  .box li { font-size: .82rem; }
  .cb .tx p { font-size: .78rem; }
  .spt p { font-size: .85rem; }
  .cb { grid-template-columns: minmax(0, 1fr); } .cb .ph { height: 150px; }
  /* SPは1カラムの横並びリスト（幅を確保して見出しの不自然な折り返しを防ぐ） */
  .news-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .nc { display: grid; grid-template-columns: 116px minmax(0, 1fr); grid-template-areas: "ph meta" "ph t"; column-gap: 14px; align-content: start; padding: 15px 0; border-bottom: 1px solid var(--line); }
  .nc:first-child { border-top: 1px solid var(--line); }
  .nc .ph { grid-area: ph; aspect-ratio: 4 / 3; }
  .nc .meta { grid-area: meta; margin-top: 0; }
  .nc .t { grid-area: t; margin-top: .45em; }
  .f-top { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .f-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
  .btn { min-width: 0; width: 100%; }
  body { padding-bottom: 84px; }
  /* 下部固定バー（yoani SP 準拠：アイコン上・文字下の4マス、右端は画像タイル＋上に飛び出すタブ） */
  .spbar { display: grid; grid-template-columns: repeat(4, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; background: #fff; border-top: 2px solid #000; padding-bottom: env(safe-area-inset-bottom); }
  .spbar a { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; height: 70px; padding: 0 4px; font-size: .64rem; line-height: 1.3; letter-spacing: .02em; text-align: center; border-left: 1px solid #000; }
  .spbar a:first-child { border-left: 0; }
  .spbar a i { font-size: 1.45rem; }
  .spbar .sb-tint { background: #e6f3fa; }
  .spbar .sb-lime { background: var(--c-lime); color: #fff; }
  .spbar .sb-img { padding: 0; background: var(--ph-bg, #f6e9f2); }
  .spbar .sb-img img { width: 100%; height: 100%; object-fit: cover; object-position: 80% 50%; display: block; }
  .spbar .sb-img em { position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); white-space: nowrap; font-style: normal; font-size: .6rem; letter-spacing: .04em; line-height: 1; background: #fff; border: 2px solid #000; border-bottom: 0; padding: 5px 8px 4px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* ==========================================================
   子ページ専用パーツ
   ========================================================== */
/* ---- ページヘッダー（暗め写真＋巨大英字） ---- */
/* 下層ヒーロー：白地・小さな英字ラベル（ライム線付き）・大きな和文タイトル（2026-09-15 モック準拠） */
.phead { position: relative; overflow: hidden; background: #fff; color: #000; }
.phead-bg { display: none; }
.phead::after { content: none; }
.phead-in { position: relative; z-index: 1; padding: clamp(22px, 3vw, 34px) 0 clamp(40px, 5vw, 64px); }
.phead .big { display: flex; align-items: center; gap: 12px; font-family: var(--font-en); font-size: .8rem; line-height: 1; letter-spacing: .2em; color: var(--c-blue); margin-top: 22px; }
.phead .big::before { content: ""; width: 30px; height: 3px; background: var(--c-lime); }
.phead h1 { font-size: clamp(1.9rem, 4.2vw, 3.6rem); line-height: 1.32; letter-spacing: .02em; margin-top: .5em; padding-left: 0; border-left: 0; word-break: auto-phrase; }
.phead .cap { display: block; margin-top: 1.3em; font-size: .92rem; line-height: 2; max-width: 40em; }
/* 右上の手書き風アクセント（ピンク） */
.phead-hand { position: absolute; right: clamp(0px, 4vw, 60px); top: clamp(84px, 9vw, 130px); z-index: 1; font-size: clamp(1.2rem, 2.2vw, 1.9rem); color: var(--c-pink); transform: rotate(-8deg); white-space: nowrap; }
.phead-hand::after { content: ""; position: absolute; left: 6%; right: 2%; bottom: -.32em; height: 3px; background: var(--c-pink); border-radius: 2px; transform: skewX(-12deg); }
.hand { font-family: "Zen Kurenaido", "Klee One", "Yomogi", var(--sans); font-weight: 400 !important; }
/* 白ヒーロー直後のセクションは上余白を詰める（ヒーロー側の余白と二重にならないように） */
.phead + section { padding-top: clamp(16px, 2.4vw, 28px); }
.crumbs { display: flex; flex-wrap: wrap; gap: .5em; font-size: .72rem; letter-spacing: .06em; margin-bottom: 1.4em; }
.crumbs a { border-bottom: 1px solid currentColor; }
.crumbs span { opacity: .7; }
.phead .crumbs { color: #000; }

/* ---- 汎用リード・本文 ---- */
.lead { font-size: clamp(1rem, 1.5vw, 1.15rem); line-height: 2; max-width: 44em; }
.body-copy p { font-size: .95rem; line-height: 2.05; margin-top: 1.2em; }
.body-copy p:first-child { margin-top: 0; }

/* ---- 会社概要テーブル ---- */
.tbl { width: 100%; border-top: 2px solid #000; margin-top: var(--sp-block, 2.4em); }
.tbl tr { border-bottom: 1px solid var(--line); }
.tbl th, .tbl td { text-align: left; padding: 1.3em .4em; font-size: .9rem; vertical-align: top; }
.tbl th { width: 220px; letter-spacing: .08em; }
.tbl td { line-height: 1.95; }

/* ---- 規約・ポリシー本文 ---- */
.doc h2 { font-size: clamp(1.05rem, 1.6vw, 1.3rem); letter-spacing: .04em; margin: 2.6em 0 .9em; padding-left: .8em; border-left: 5px solid var(--c-lime); }
.doc h2:first-child { margin-top: 0; }
.doc p { font-size: .9rem; line-height: 2.05; margin-top: 1em; }
.doc ol { list-style: decimal; padding-left: 1.5em; margin-top: .8em; }
.doc ol li { font-size: .9rem; line-height: 2; margin-top: .5em; }
.doc .rev { margin-top: 3em; font-size: .8rem; }

/* ---- フォーム ---- */
.form { max-width: 760px; margin-top: var(--sp-block, 2.4em); }
.fg { margin-bottom: 1.8em; }
.fl { display: flex; align-items: center; gap: .7em; font-size: .88rem; letter-spacing: .06em; margin-bottom: .6em; }
.fl .req { font-size: .64rem; letter-spacing: .1em; background: var(--c-pink); color: #fff; padding: .25em .7em; }
.fl .any { font-size: .64rem; letter-spacing: .1em; background: var(--bg-soft); color: #000; padding: .25em .7em; border: 1px solid var(--line); }
.fi, .ft, .fs { width: 100%; font: inherit; color: #000; background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: .9em 1em; transition: border-color .3s; }
.fi:focus, .ft:focus, .fs:focus { outline: none; border-color: var(--c-lime); box-shadow: 0 0 0 3px rgba(0,136,198,.18); }
.ft { min-height: 180px; resize: vertical; }
.fs { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #000 50%), linear-gradient(135deg, #000 50%, transparent 50%); background-position: calc(100% - 20px) 55%, calc(100% - 14px) 55%; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; }
.fchk { display: flex; align-items: flex-start; gap: .7em; font-size: .86rem; }
.fchk input { width: 20px; height: 20px; accent-color: var(--c-lime); flex-shrink: 0; margin-top: .15em; }
.fchk a { border-bottom: 1px solid #000; }
.fsubmit { width: 100%; max-width: 420px; margin: 2.4em auto 0; display: flex; align-items: center; justify-content: center; gap: .8em; background: var(--c-lime); color: #fff; border: 0; border-radius: 8px; padding: 1.2em 2em; font-size: 1rem; letter-spacing: .1em; cursor: pointer; transition: transform .35s var(--ease), box-shadow .35s; }
.fsubmit:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(42,255,0,.34); }
.thanks { text-align: center; padding: 4em 0; }

/* ---- コース詳細 ---- */
.cdetail { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(24px, 4vw, 64px); align-items: center; }
.cdetail-ph { aspect-ratio: 16 / 11; overflow: hidden; border-radius: 14px; background: #1c1c1c; }
.cdetail-ph img { width: 100%; height: 100%; object-fit: cover; }
.spec { display: grid; gap: 2px; background: var(--line); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin-top: var(--sp-block, 2.4em); }
.spec > div { background: #fff; display: grid; grid-template-columns: 200px 1fr; }
.spec dt, .spec dd { padding: 1.1em 1.4em; font-size: .88rem; line-height: 1.9; }
.spec dt { background: var(--bg-soft); letter-spacing: .06em; }
.curr { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: var(--sp-block, 2.4em); }
.curr-item { border: 1px solid var(--line); border-top: 5px solid var(--c-lime); border-radius: 10px; padding: 1.6em 1.5em; background: #fff; }
.curr-no { font-family: var(--font-en); font-size: .72rem; letter-spacing: .2em; color: var(--c-blue); }
.curr-item h3 { font-size: 1.05rem; letter-spacing: .03em; margin-top: .5em; }
.curr-item p { font-size: .84rem; line-height: 1.9; margin-top: .7em; }
/* アイコン見出し版（お問い合わせの「その他の連絡方法」など）：英字ラベルの代わりにFAアイコンを見出しと同じ行に置く */
.curr--ic .curr-item h3 { display: flex; align-items: center; gap: .62em; margin-top: 0; }
.curr--ic .curr-item h3 i { width: 40px; height: 40px; border-radius: 50%; background: var(--c-lime); color: #fff; display: grid; place-items: center; font-size: 1.02rem; flex-shrink: 0; }
.price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: var(--sp-block, 2.4em); }
.price-card { border: 1px solid var(--line); border-radius: 12px; padding: 2em 1.7em; background: #fff; display: flex; flex-direction: column; gap: .6em; }
.price-card.is-rec { border: 2px solid var(--c-lime); position: relative; }
.price-card.is-rec::before { content: "おすすめ"; position: absolute; top: -13px; left: 20px; background: var(--c-lime); color: #fff; font-size: .66rem; letter-spacing: .12em; padding: .35em 1em; }
.price-card h3 { font-size: 1.1rem; letter-spacing: .04em; }
.price-card .p { font-family: var(--font-en); font-size: clamp(1.6rem, 2.6vw, 2.2rem); line-height: 1; }
.price-card .p small { font-size: .36em; margin-left: .3em; letter-spacing: .06em; }
.price-card ul { margin-top: .4em; display: grid; gap: .4em; }
.price-card li { font-size: .84rem; display: flex; gap: .6em; }
.price-card li::before { content: "✓"; color: var(--c-blue); }
.price-note { font-size: .74rem; margin-top: 1.4em; }

/* ---- ニュース一覧 ---- */
.nlist { border-top: 1px solid var(--line); margin-top: var(--sp-block, 2.4em); }
.nlist a { display: grid; grid-template-columns: 120px 130px 1fr auto; gap: 1.4em; align-items: center; padding: 1.5em .4em; border-bottom: 1px solid var(--line); transition: background .3s, padding-left .35s var(--ease); }
.nlist a:hover { background: var(--bg-soft); padding-left: 1em; }
.nlist time { font-family: var(--font-en); font-size: .82rem; letter-spacing: .06em; }
.nlist .cat { font-size: .66rem; letter-spacing: .12em; background: var(--c-lime); color: #fff; text-align: center; padding: .4em .6em; }
.nlist .t { font-size: .95rem; line-height: 1.6; }
.nlist .arw { font-family: var(--font-en); }
.article { max-width: 860px; }
.article-meta { display: flex; align-items: center; gap: 1em; font-size: .78rem; letter-spacing: .06em; }
.article-meta .cat { background: var(--c-lime); color: #fff; padding: .35em 1em; }
.article h1 { font-size: clamp(1.4rem, 2.6vw, 2.1rem); line-height: 1.5; letter-spacing: .02em; margin-top: .8em; }
.article-ph { aspect-ratio: 16 / 9; overflow: hidden; border-radius: 12px; background: #1c1c1c; margin-top: 2em; }
.article-ph img { width: 100%; height: 100%; object-fit: cover; }
.article-body p { font-size: .95rem; line-height: 2.1; margin-top: 1.5em; }
.article-body h2 { font-size: 1.2rem; letter-spacing: .04em; margin-top: 2.4em; padding-left: .8em; border-left: 5px solid var(--c-lime); }

/* ---- 中CTA（子ページ共通） ---- */
.midcta { background: #000; color: #fff; border-radius: 16px; padding: clamp(28px, 4vw, 48px); display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(20px, 3vw, 48px); align-items: center; }
.midcta h2 { font-size: clamp(1.3rem, 2.4vw, 1.9rem); line-height: 1.4; }
.midcta p { font-size: .9rem; line-height: 1.95; margin-top: .8em; }
.midcta .acts { display: grid; gap: 10px; }
.midcta .btn { min-width: 0; width: 100%; }

/* ---- 子ページSP ---- */
@media (max-width: 1099px) {
  .phead-in { padding: 14px 0 34px; }
  .phead .big { font-size: .72rem; margin-top: 14px; }
  .phead h1 { font-size: 1.6rem; }
  .phead .cap { font-size: .84rem; }
  .phead-hand { position: static; display: inline-block; margin-top: 18px; font-size: 1.1rem; transform: rotate(-5deg); }
  .tbl th, .tbl td { display: block; width: 100%; padding: .8em .2em; }
  .tbl th { background: var(--bg-soft); padding: .7em .8em; }
  .spec > div { grid-template-columns: minmax(0, 1fr); }
  .spec dt { padding: .8em 1.1em; }
  .curr, .price-grid { grid-template-columns: minmax(0, 1fr); }
  .cdetail { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .nlist a { grid-template-columns: auto 1fr; grid-template-areas: "time cat" "txt txt"; gap: .5em 1em; padding: 1.2em .2em; }
  .nlist time { grid-area: time; } .nlist .cat { grid-area: cat; justify-self: start; padding: .3em .9em; }
  .nlist .t { grid-area: txt; font-size: .88rem; } .nlist .arw { display: none; }
  .midcta { grid-template-columns: minmax(0, 1fr); }
  .form { max-width: none; }
}

/* ---- 対象チップ（明背景用） ---- */
.tgt { display: flex; align-items: center; gap: .8em; flex-wrap: wrap; margin-top: 1.4em; }
.tgt-l { font-size: .7rem; letter-spacing: .16em; flex-shrink: 0; }
.tgt ul { display: flex; flex-wrap: wrap; gap: 6px; }
.tgt li { font-size: .72rem; letter-spacing: .04em; padding: .45em .95em; border: 1px solid var(--line); border-radius: 4px; color: #000; opacity: .38; }
.tgt li.on { background: var(--c-lime); border-color: var(--c-lime); color: #fff; opacity: 1; }
/* ---- 白背景セクションの帯（薄グレー） ---- */
.soft { background: var(--bg-soft); }
.alt { background: var(--bg-alt); }

/* ---- FAQアコーディオン（子ページ用） ---- */
.faq { border-top: 2px solid #000; margin-top: var(--sp-block, 2.4em); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-q { width: 100%; background: none; border: 0; text-align: left; cursor: pointer; font: inherit; color: #000; display: flex; align-items: center; gap: 1em; padding: 1.3em .3em; font-size: 1rem; letter-spacing: .03em; }
.faq-qmark { width: 34px; height: 34px; background: var(--c-lime); color: #fff; font-family: var(--font-en); display: grid; place-items: center; flex-shrink: 0; }
.faq-q .icon { margin-left: auto; position: relative; width: 16px; height: 16px; flex-shrink: 0; }
.faq-q .icon::before, .faq-q .icon::after { content: ""; position: absolute; left: 0; top: 7px; width: 16px; height: 2px; background: #000; transition: transform .35s var(--ease); }
.faq-q .icon::after { transform: rotate(90deg); }
.faq-item.is-open .faq-q .icon::after { transform: rotate(0); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .5s var(--ease); }
.faq-a-inner { padding: 0 .3em 1.7em calc(34px + 1em); font-size: .9rem; line-height: 2; }
/* ---- 注記 ---- */
.note { font-size: .74rem; letter-spacing: .04em; margin-top: 1.6em; }
@media (max-width: 1099px) {
  .faq-q { font-size: .92rem; padding: 1.1em .1em; }
  .faq-a-inner { padding-left: calc(34px + .8em); }
}

/* ---- 申込の流れ（縦ステップ） ---- */
.steps { position: relative; display: grid; gap: 0; margin-top: var(--sp-block, 2.4em); }
.step { position: relative; display: grid; grid-template-columns: 84px 1fr; gap: 24px; padding: 0 0 34px; }
.step:last-child { padding-bottom: 0; }
.step::before { content: ""; position: absolute; left: 31px; top: 62px; bottom: 0; width: 2px; background: var(--line); }
.step:last-child::before { display: none; }
.step-no { width: 62px; height: 62px; border-radius: 50%; background: var(--c-lime); color: #fff; font-family: var(--font-en); font-size: 1.15rem; display: grid; place-items: center; z-index: 1; }
.step--goal .step-no { background: #000; color: var(--c-lime); }
.step-body { padding-top: .5em; }
.step-body h3 { font-size: 1.15rem; letter-spacing: .04em; }
.step-body p { font-size: .9rem; line-height: 1.95; margin-top: .6em; max-width: 40em; }
.step-body .meta { display: inline-block; margin-top: .8em; font-size: .72rem; letter-spacing: .1em; background: var(--bg-soft); border: 1px solid var(--line); padding: .4em 1em; }
@media (max-width: 1099px) {
  .step { grid-template-columns: 54px 1fr; gap: 16px; padding-bottom: 26px; }
  .step::before { left: 26px; top: 56px; }
  .step-no { width: 54px; height: 54px; font-size: 1rem; }
  .step-body h3 { font-size: 1.02rem; }
}

/* ---- 5カラムのカリキュラム風グリッド（年代から選ぶ等） ---- */
.curr--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1099px) { .curr--5 { grid-template-columns: minmax(0, 1fr); } }


/* ================= コース紹介ページ（2026-09-15 モック準拠） ================= */
/* 6コースのインデックス：2行×3列、縦罫線で区切り、現在地にライム下線 */
.crs-tabs { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.crs-tab { display: grid; justify-items: center; gap: 6px; padding: 22px 12px 18px; text-align: center; position: relative; border-right: 1px solid var(--line); }
.crs-tab:nth-child(3n) { border-right: 0; }
.crs-tab:nth-child(n+4) { border-top: 1px solid var(--line); }
.crs-tab .no { font-family: var(--font-en); font-size: .74rem; letter-spacing: .14em; color: #8a8a8a; }
.crs-tab .nm { font-size: .92rem; line-height: 1.5; letter-spacing: .02em; word-break: auto-phrase; }
.crs-tab .nm small { display: block; font-size: .78rem; }
.crs-tab::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 0; height: 3px; background: var(--c-lime); transform: translateX(-50%); transition: width .35s var(--ease); }
.crs-tab:hover::after, .crs-tab.is-current::after { width: 44px; }
/* コース行：左バナー／右に番号・見出し・本文・タグ・ボタン */
.crs-list { display: grid; gap: clamp(28px, 4vw, 56px); margin-top: clamp(40px, 5vw, 64px); }
.crs-row { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: clamp(24px, 3.4vw, 52px); align-items: center; scroll-margin-top: 110px; }
.crs-row .ph { aspect-ratio: 2 / 1; border-radius: 12px; overflow: hidden; background: var(--ph-bg, #f3f3f3); border: 1px solid var(--line); }
.crs-row .ph img { width: 100%; height: 100%; object-fit: contain; display: block; transition: transform .7s var(--ease); }
.crs-row .ph:hover img { transform: scale(1.02); }
.crs-row .no { font-family: var(--font-en); font-size: clamp(2.6rem, 4.4vw, 4rem); line-height: 1; color: #e6e6e6; }
.crs-row h3 { font-size: clamp(1.3rem, 2vw, 1.75rem); line-height: 1.35; letter-spacing: .02em; margin-top: .25em; word-break: auto-phrase; }
.crs-row .sub { font-size: .98rem; margin-top: .45em; letter-spacing: .02em; }
.crs-row p.d { font-size: .86rem; line-height: 1.95; margin-top: .9em; word-break: auto-phrase; }
.crs-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 1em; }
.crs-tags span { font-size: .74rem; letter-spacing: .04em; padding: .3em .8em; border: 1.5px solid var(--c-lime); border-radius: 4px; }
.crs-btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.4em; min-width: 250px; height: 46px; padding: 0 1.1em 0 1.3em; margin-top: 1.4em; border: 1.5px solid #000; border-radius: 6px; background: #fff; color: #000; font-size: .82rem; letter-spacing: .06em; transition: background .25s ease, color .25s ease; }
.crs-btn i { font-style: normal; font-family: var(--font-en); }
.crs-btn:hover { background: #000; color: #fff; }
/* 黒のCTA帯 */
.crs-band { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-top: clamp(56px, 7vw, 96px); padding: clamp(28px, 3.4vw, 44px) clamp(24px, 3.4vw, 48px); background: #000; color: #fff; border-radius: 14px; }
.crs-band h2 { font-size: clamp(1.25rem, 2.2vw, 1.9rem); letter-spacing: .03em; line-height: 1.4; }
.crs-band p { font-size: .84rem; line-height: 1.9; margin-top: .6em; color: rgba(255,255,255,.86); word-break: auto-phrase; }
.crs-band .btn { flex-shrink: 0; }
@media (max-width: 1099px) {
  .crs-row .no { font-size: 2.6rem; }
}
@media (max-width: 767px) {
  .crs-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .crs-tab { padding: 14px 8px 12px; border-right: 1px solid var(--line); }
  .crs-tab:nth-child(3n) { border-right: 1px solid var(--line); }
  .crs-tab:nth-child(2n) { border-right: 0; }
  .crs-tab:nth-child(n+4) { border-top: 0; }
  .crs-tab:nth-child(n+3) { border-top: 1px solid var(--line); }
  .crs-tab .nm { font-size: .8rem; }
  .crs-list { gap: 40px; margin-top: 32px; }
  .crs-row { grid-template-columns: minmax(0, 1fr); gap: 16px; scroll-margin-top: 80px; }
  .crs-row .no { font-size: 2.2rem; }
  .crs-row h3 { font-size: 1.25rem; }
  .crs-btn { width: 100%; min-width: 0; }
  .crs-band { flex-direction: column; align-items: stretch; padding: 24px 18px; gap: 18px; }
  .crs-band .btn { width: 100%; }
}
/* PCのみ改行 */
@media (max-width: 767px) { .pc { display: none; } }

/* ===== 2026.10 修正 ===== */
/* 受講生の声：縦長の人物写真でも顔が切れないよう上寄せ */
.vc .ph img { object-position: 50% 18%; }
/* SP追従バー：U18バナーを外したため3分割 */
@media (max-width: 1099px) { .spbar { grid-template-columns: repeat(3, 1fr); } }

/* 申込案内：黒い丸の上のアイコンは、ロゴの青だと沈むため明るい青に */

/* SNS：LINEはLINEのコーポレートカラー（#06C755） */
.sns-card--line { background: #06c755; border-color: #06c755; }
.sns-card--line .sns-ic { color: #06c755; }
@media (max-width: 1099px) { .mbtn--pink:has(.fa-line) { background: #06c755; } }
/* 対象者の帯：準備中（小学生・中学生）はリンクなし・グレー表示 */
.whobar .is-soon { display: inline-flex; align-items: center; gap: .6em; background: #e2e2e2; color: #8a8a8a; border-radius: 999px; padding: .55em 1.3em; font-size: .8rem; letter-spacing: .06em; cursor: not-allowed; white-space: nowrap; }
.whobar .is-soon small { font-size: .66rem; background: #fff; color: #8a8a8a; border-radius: 999px; padding: .1em .7em; }
/* SNSカードのアイコン（黒背景）も同じ明るい青に。LINEは白背景＋LINEグリーンのまま */


/* ===== 黒背景の上の青（文字・アイコン）は、ロゴの青だと沈むため明るい青にそろえる =====
   青い背景に白文字のもの（ボタン・ラベル）は対象外 */
:root { --c-on-dark: #5bc8f5; }
.gc .ic,
.sns-card:not(.sns-card--line) .sns-ic, .sns-head .sns-ic,
.tab.is-current, .vfilter .tab.is-current,
.vlist b,
.topic .ph .lbl.bk,
.kv-arrow:hover, .f-sns a:hover, .float .top,
.step--goal .step-no,
.nb-h .big, .nb-more,
.strong .cap, .spt h3 em { color: var(--c-on-dark); }
.nb-more { border-color: var(--c-on-dark); }
.whobar .is-soon small { white-space: nowrap; flex-shrink: 0; }