/* B案改。対象ページだけに読み込み、本文・機能・壁紙の選択はそのまま。 */
.design-b2 {
  --b2-marker: #fff0a6;
  --b2-blue: #e7f0f5;
  --b2-pink: #f7e8e6;
  --b2-green: #e8efdf;
  --b2-grid: rgba(39, 71, 58, .045);
  --b2-rule: rgba(39, 71, 58, .07);
  --radius: 10px;
  --radius-sm: 8px;
}
html:not([data-wall]):not([data-live-wall]) .design-b2 {
  --bg: #fdfcf8;
  --bg-soft: #f4f3ec;
  --surface: #fffffe;
  --surface-2: #eff1ea;
  --fg: #1f2a26;
  --muted: #5a655e;
  --line: #d9ded5;
  background-color: var(--bg);
  background-image: linear-gradient(var(--b2-grid) 1px, transparent 1px), linear-gradient(90deg, var(--b2-grid) 1px, transparent 1px);
  background-size: 24px 24px;
}
html[data-mode="dark"] .design-b2 {
  --b2-marker: #544627;
  --b2-blue: #253941;
  --b2-pink: #3c2e34;
  --b2-green: #293a2f;
  --b2-grid: rgba(236, 234, 226, .035);
  --b2-rule: rgba(236, 234, 226, .05);
}
html[data-mode="dark"]:not([data-wall]):not([data-live-wall]) .design-b2 {
  --bg: #15181a;
  --bg-soft: #1b1e21;
  --surface: #1f2326;
  --surface-2: #2a2f33;
  --fg: #eceae2;
  --muted: #a6aba5;
  --line: #363c40;
}
/* 既存の方眼なし設定がある端末では紙を無地にする。 */
html[data-grid="off"] .design-b2 { background-image: none !important; }
.design-b2 .b2-line-figure { margin: 18px 0 24px; width: 160px; max-width: 100%; }
.design-b2 .b2-line-figure img { display: block; width: 100%; height: auto; opacity: .88; }
html[data-mode="dark"] .design-b2 .b2-line-figure img { filter: invert(.9) sepia(.1); }
.design-b2 .lp-hero { background: transparent; }
.design-b2 .lp-hero-glow { display: none; }
.design-b2 .lp-hero h1 { line-height: 1.45; letter-spacing: .015em; }
.design-b2 :is(.lp-hero h1, .lp-subtitle) { word-break: auto-phrase; text-wrap: balance; }
.design-b2 .lp-points li { word-break: auto-phrase; }
.design-b2 .lp-mark,
.design-b2 .lp-section > .wrap > h2,
.design-b2 .pr-title,
.design-b2 .pt-sechead h2 {
  background: linear-gradient(transparent 68%, var(--b2-marker) 68%);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  width: fit-content;
  max-width: 100%;
}
.design-b2 .lp-section + .lp-section { border-top: 1px dashed var(--line); }
.design-b2 .lp-concept,
html[data-wall="okunosono"][data-mode="dark"] .design-b2 .lp-concept {
  background: var(--bg-soft);
  color: var(--fg);
}
.design-b2 .lp-concept :is(h2, p, li, .concept-ico) { color: inherit; }
.design-b2 .lp-concept .concept-ico { background: var(--surface); }
.design-b2 :is(.worry, .flow, .feat, .str, .plan, .only-card, .abroad-card, .cp-card) {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 3px 13px rgba(20, 38, 29, .055);
}
.design-b2 .worry:nth-child(3n + 1), .design-b2 .only-card:nth-child(3n + 1) { background: var(--b2-blue); }
.design-b2 .worry:nth-child(3n + 2), .design-b2 .only-card:nth-child(3n + 2) { background: var(--b2-pink); }
.design-b2 .worry:nth-child(3n), .design-b2 .only-card:nth-child(3n) { background: var(--b2-green); }
.design-b2 .worry-answer { border-left: 3px solid var(--brand); background: var(--brand-soft); }
.design-b2 .phone { border-radius: 10px; border-width: 1px; box-shadow: 7px 7px 0 var(--bg-soft); }
.design-b2 :is(.mock-q, .mock-note, .mock-fig) { border-radius: 6px; }
.design-b2 :is(.pill-premium, .mock-badge, .pr-tag) { border-radius: 4px; }
.design-b2 :is(.lp-kicker, .lp-note, .lp-reach-n, .mock-tag, .mock-text, .mock-opt, .mock-note-head, .mock-badge,
  .stat-label, .feat-no, .step-no, .plan-flag, .cp-cond, .pr-small, .pr-save, .pr-rec, .pr-eq, .pr-per,
  .pt-muted, .pt-chip, .pt-label, .pt-count, .pt-tile-progress, .pt-tile-days) { font-size: max(14px, .875em); }
.design-b2:not(.ea-page) :is(.cat-count, .ex-q, .ex-q b, .exam-price, .exam-date, .chip, .xp-unofficial,
  .lp-coach-free .lp-points li, .lp-compare th, .lp-compare td, .ex-new) { font-size: max(14px, .875em); }
.design-b2:not(.ea-page) .site-footer,
.design-b2:not(.ea-page) .site-footer :is(p, a, small, span) { font-size: 14px; }
.design-b2.lp :is(.rout-ex span, .rout-ex small, .screen figcaption span, .figs-tab small,
  .xp-topic-links a, .xp-unit-list .num, .xp-unit-topic, .mij-badge, .pill-premium,
  .plan-feature-note, .exam-diag, .cmp-fair thead th, .corp-price thead th),
.design-b2 .pr-consult { font-size: 14px; }
body.design-b2.lp small, body.design-b2.lp .stat .stat-label,
body.design-b2.lp .rout-ex span, body.design-b2.lp .exam-mockfree span { font-size: 14px; }
.design-b2.lp .lp-eyebrow, .design-b2 .pt-side-user { font-size: 14px; }
body.design-b2.lp.lp-lang .lp-hero .lp-coach-free .lp-points.is-dot li { font-size: 14px; }
.design-b2 .pr-head { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.design-b2 .pr-head .b2-line-figure { margin-bottom: 0; width: 132px; }
.design-b2 .pr-plan { border-radius: 8px; background: var(--surface); }
.design-b2 .pr-plan.on { background: var(--b2-green); border-color: var(--brand); }
.design-b2 .pr-confirm { background: var(--surface); padding: 24px; border: 1px solid var(--line); border-radius: 8px; }
.design-b2 .pr-summary { background: var(--bg-soft); }
.design-b2 .pr-int.on { background: var(--b2-marker); color: var(--fg); }
.design-b2 #ptApps { padding: 22px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg-soft); }
.design-b2 #ptApps .pt-tiles > .pt-tile:first-of-type { background: var(--b2-marker); border-color: color-mix(in srgb, var(--brand) 35%, var(--line)); }
.design-b2 .pt-b2-action { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--line); font-weight: 700; }
.design-b2 .pt-b2-action .ico { width: 20px; height: 20px; }
.design-b2 #ptApps .pt-tile { min-width: 0; }
.design-b2 #ptApps .pt-tile-name { overflow-wrap: anywhere; }
/* 問題・要点の操作/文字組みは変えず、紙と罫線だけを整える。 */
.design-b2.ea-page :is(.ea-card, .ea-chapter) { box-shadow: 0 2px 12px rgba(20, 38, 29, .045); }
.design-b2.ea-page .ea-quiz { background: var(--surface); }
.design-b2.ea-page .ea-chbody { background-image: linear-gradient(var(--b2-rule) 1px, transparent 1px); background-size: 100% 28px; }
html[data-grid="off"] .design-b2.ea-page .ea-chbody { background-image: none; }
.design-b2.ea-page .ea-section { background-color: var(--surface); }
/* 既存の出現待ち・反復する脈を、この対象ページでは短い一度の動きへ。 */
.design-b2 .lp-hero-copy h1, .design-b2 .pt-b2-action, .design-b2 .pr-head { animation: b2-settle .4s ease-out 1; }
.design-b2 [data-reveal], .motion-ready .design-b2 [data-reveal]:not(.is-in) { opacity: 1; transform: none; }
.motion-ready .design-b2 [data-reveal].is-in { animation: b2-settle .4s ease-out 1; }
.motion-ready .design-b2 [data-reveal] .ico > * { stroke-dasharray: none; stroke-dashoffset: 0; transition: none; }
.design-b2 .btn[data-pulse]::after { content: none; }
.design-b2 .lp-hero-copy > *, .design-b2 .lp-mark, .design-b2 .lp-hero-visual { animation: b2-settle .4s ease-out 1; opacity: 1; }
.has-motion .design-b2 .lp-hero-copy .lp-cta,
.has-motion .design-b2 .lp-hero-copy .lp-note,
.has-motion .design-b2 .lp-hero-visual,
.motion-ready .design-b2 .stat.is-in::after,
.motion-ready .design-b2 .cmp-bars.is-in rect,
.motion-ready .design-b2 .cmp-months.is-in i { animation: b2-settle .4s ease-out 1; }
.motion-ready .design-b2 .cmp-months:not(.is-in) i { opacity: 1; transform: none; }
.design-b2 .lp-coupon .cp-card::after, .design-b2 .ex-new::after { animation: none; content: none; }
.design-b2 .lp-mark { background-size: 100% 100%; }
.design-b2 :is(.btn, .pt-tile, .pr-plan) { transition-duration: .2s; }
@keyframes b2-settle { from { transform: translateY(4px); } to { transform: translateY(0); } }
@media (max-width: 600px) {
  .design-b2 .lp-hero { padding-top: 24px; padding-bottom: 32px; }
  .design-b2 .lp-hero h1 { font-size: clamp(28px, 8vw, 36px); }
  .design-b2 .lp-section { padding: 38px 0; }
  .design-b2 .b2-line-figure { width: 112px; margin-top: 14px; margin-bottom: 20px; }
  .design-b2 .pr-head, .design-b2 .pr-confirm, .design-b2 #ptApps { padding: 18px 16px; }
  .design-b2 .pr-rec { padding: 1px 5px; }
  .design-b2 .lp-cta .btn { max-width: 100%; overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  .design-b2, .design-b2 *, .design-b2 *::before, .design-b2 *::after {
    animation: none !important; transition: none !important; scroll-behavior: auto !important;
  }
  .design-b2 [data-reveal], .design-b2 .lp-hero-copy > *, .design-b2 .lp-hero-visual { opacity: 1 !important; transform: none !important; }
}
html[data-reduce-motion="true"] .design-b2,
html[data-reduce-motion="true"] .design-b2 *,
html[data-reduce-motion="true"] .design-b2 *::before,
html[data-reduce-motion="true"] .design-b2 *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}

/* 見出しの改行（2026-11-05）: 最後の 1 字だけ次の行に送られないよう、行の長さをそろえる（日本語 LP の「…無駄のない画面」で「面」が 1 字残っていた） */
.design-b2 .lp-section > .wrap > h2 { text-wrap: balance; word-break: auto-phrase; }
/* 日本語 LP の冒頭（2026-11-06）: 句の途中で折り返さない（「分かったつもりに、／なってませんか。」「手軽なアウトプットで、／「分かった」に変える。」）。
   入りきらない幅では句の中でも折り返せるよう max-width を付ける */
.design-b2 .lp-hero .lp-phrase { display: inline-block; max-width: 100%; }