@charset "utf-8";
/* =============================================================================
   和モダン（UI 案 A、2026-10-27 決定）
   見本: 資料/UI案_261014/A_和モダン_トップ全体.html（生成りの紙・墨・朱、見出しは明朝）。

   ここにあるのは トップページ（#wmHome）と、全ページ共通のヘッダー・フッターだけ。
   下層ページの本文は後で別に合わせる。

   旧 CSS（styles.css）は `main p`・`main h2`・`section{padding-top:7rem}`、それに
   `main section p:not(.c):not(.center)…` (0,4,3) のような強い汎用ルールを持つ。
   クラスだけでは勝てないので、トップは #wmHome、ヘッダー・フッターは #container
   （layouts.app の外枠）を頭に付けて ID で上書きする。styles.css は書き換えない。
   layouts.comingsoon はこのファイルを読まない（フッターは styles.css の形のまま）。
   ========================================================================== */
:root {
  --wm-paper: #FBF8F2;
  --wm-paper-2: #F3EDE2;
  --wm-ink: #211D17;
  --wm-mute: #6B645A;
  --wm-line: #E4DDD0;
  --wm-shu: #E60012;
  --wm-shu-dark: #A40009;
  --wm-night: #1A1612;
  --wm-mincho: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --wm-gothic: "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
  --wm-header-h: 80px;
}
/* Shippori Mincho に簡体字・ハングルは無い（partials/locale-fonts が Noto Serif SC/KR を読む） */
html:lang(zh) {
  --wm-mincho: "Noto Serif SC", "Songti SC", "STSong", serif;
  --wm-gothic: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", sans-serif;
}
html:lang(ko) {
  --wm-mincho: "Noto Serif KR", "AppleMyungjo", "Batang", serif;
  --wm-gothic: "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
}

/* ── ヘッダー（全ページ）────────────────────────────────────────────────
   旧: 写真の上に半透明の黒帯、白抜きのロゴ。→ 生成りの地に細い罫、色付きのロゴ。
   高さは 80px（下層ページの余白 --ds-header-h:96px の内側に収まる）。
   `#container > header` に絞る: 子孫の header にすると、公式テキスト本文の <header class="tb-chapter-head">
   にも高さ 80/64px が掛かり、章の見出しと本文が重なった（2026-11-02 本番で発覚）。 */
#container > header {
  height: var(--wm-header-h);
  padding: 0 40px;
  background: var(--wm-paper);
  border-bottom: 1px solid var(--wm-line);
  box-sizing: border-box;
}
#container > header #logo { width: 48px; padding: 16px 0; }
#container > header #logo img { width: 48px; height: 48px; }
#container > header .subLogo { width: auto; top: 50%; transform: translate(-50%, -50%); }
#container > header .subLogo img { display: block; height: 40px; width: auto; }
/* 言語ボタン（partials/header の <style>）を帯の高さの中央へ。形は和の札（角を立てる） */
#container > header .langMenu--float { top: 10px; }
#container > header .langMenu--float .langMenu__btn { border-radius: 3px; }
#container > header .langMenu--float .langMenu__list { border-radius: 4px; }
/* ハンバーガー: 白い線 → 墨 */
#menubar_hdr { top: 10px; }
#menubar_hdr span { border-top-color: var(--wm-ink); }
/* 開いたメニュー: 下の「スライドメニュー」の節で全面・2 カラムにする */

@media (max-width: 600px) {
  :root { --wm-header-h: 64px; }
  #container > header { padding: 0 16px; }
  #container > header #logo { width: 40px; padding: 12px 0; }
  #container > header #logo img { width: 40px; height: 40px; }
  #container > header .subLogo { padding: 0; }
  #container > header .subLogo img { height: 28px; }
  #menubar_hdr { top: 6px; }
}

/* ── スライドメニュー（全ページ、2026-10-30）─────────────────────────────────
   旧: 半透明の白い幕の中央に 13px の項目を細い枠で並べ、黒い線のアイコンと赤・橙・金のボタン。
   → ヘッダーの下を生成りの地で全面に覆い（ページを透かさない）、PC は 2 カラム。
     左: リンク 10 本を明朝で大きく、2 群（ABOUT / ASSOCIATION）に分けて罫で区切る。
     右: 細い縦罫の向こうに LOGIN（会員は朱、会場・採用担当は墨の枠線）と LANGUAGE。
   見出しの英字は content で描く（翻訳キーを増やさない）。旧 CSS（styles.css）の
   .s #menubar.db / #menubar nav / .menu_item / .button（!important あり）/ ヘッダー内 <style> の
   .langMenu を上書きするため、#container #menubar.db から書く。開閉は main.js の .db のまま。 */
@keyframes wmMenuIn { from { opacity: 0; } to { opacity: 1; } }
#container #menubar.db {
  top: var(--wm-header-h);
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  padding: 0;
  box-sizing: border-box;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--wm-paper);
  color: var(--wm-ink);
  font-family: var(--wm-gothic);
  font-size: 16px;
  text-align: left;
  animation: wmMenuIn .25s ease both; /* 旧: 左から 200px 滑り込む（全面の幕だと右端にページが覗く） */
}
#container #menubar.db .wmMenu {
  position: static;
  transform: none;
  -webkit-transform: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  column-gap: 56px;
  align-content: center;
  align-items: start;
  width: auto;
  max-width: 1120px;
  min-height: 100%;
  margin: 0 auto;
  padding: 56px 48px 64px;
  box-sizing: border-box;
  line-height: 1.6;
}
/* 群の見出し（ABOUT / ASSOCIATION / LOGIN / LANGUAGE）: トップの eyebrow と同じ朱の小さな英字 */
#container #menubar.db .menu_item::before,
#container #menubar.db .wmMenu__side::before,
#container #menubar.db .langMenu--inmenu .langMenu__btn::before {
  display: block;
  color: var(--wm-shu);
  font: 500 12px/1.6 var(--wm-gothic);
  letter-spacing: .3em;
}
#container #menubar.db .menu_item:nth-child(1)::before { content: "ABOUT"; }
#container #menubar.db .menu_item:nth-child(2)::before { content: "ASSOCIATION"; }
#container #menubar.db .wmMenu__side::before { content: "LOGIN"; margin-bottom: 16px; }

/* 左: リンク。2 群を横に並べ、各群は墨の罫 → 項目ごとに細い罫 */
#container #menubar.db ul.wmMenu__links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 40px 48px;
  width: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}
#container #menubar.db ul.wmMenu__links::after { content: none; }
#container #menubar.db .menu_item { float: none; width: auto; min-width: 0; margin: 0; }
#container #menubar.db .menu_item::before { padding-bottom: 12px; border-bottom: 1px solid var(--wm-ink); }
#container #menubar.db .menu_item li { display: block; margin: 0; border-bottom: 1px solid var(--wm-line); }
#container #menubar.db .menu_item a {
  position: relative;
  display: block;
  padding: 15px 36px 15px 0;
  border: 0;
  color: var(--wm-ink);
  font: 500 22px/1.5 var(--wm-mincho);
  letter-spacing: .08em;
  text-align: left;
  overflow-wrap: anywhere;
  transition: color .15s;
}
/* 右端の短い罫。触れると朱になって伸びる */
#container #menubar.db .menu_item a::after {
  content: "";
  position: absolute;
  right: 4px;
  top: 50%;
  width: 12px;
  height: 1px;
  background: var(--wm-mute);
  transition: width .2s, background-color .2s;
}
#container #menubar.db .menu_item a:hover,
#container #menubar.db .menu_item a:focus-visible { color: var(--wm-shu); }
#container #menubar.db .menu_item a:hover::after,
#container #menubar.db .menu_item a:focus-visible::after { width: 24px; background: var(--wm-shu); }
#container #menubar.db a:focus-visible { outline: 2px solid var(--wm-shu); outline-offset: 2px; }
/* 黒い線のアイコン・白抜きのアイコンは使わない（文字だけで足りる） */
#container #menubar.db .iconImage { display: none; }

/* 右: ログインと言語。細い縦罫で左と分ける */
#container #menubar.db .wmMenu__side {
  min-width: 0;
  padding-left: 48px;
  border-left: 1px solid var(--wm-line);
}
#container #menubar.db .wmMenu__side .fullButton { margin: 0 0 12px; }
#container #menubar.db .wmMenu__side ul.doubleButtons {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}
#container #menubar.db .wmMenu__side ul.doubleButtons li { float: none; width: auto; margin: 0; }
#container #menubar.db .wmMenu__side a.button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  margin: 0 !important;
  padding: 12px 18px !important;
  box-sizing: border-box;
  border: 1px solid var(--wm-ink);
  border-radius: 0;
  background: #fff;
  color: var(--wm-ink) !important;
  font: 700 15px/1.5 var(--wm-gothic);
  letter-spacing: .08em;
  text-align: center;
  overflow-wrap: anywhere;
  transition: background-color .15s, color .15s, border-color .15s;
}
#container #menubar.db .wmMenu__side a.button:hover { background: var(--wm-ink); color: var(--wm-paper) !important; }
#container #menubar.db .wmMenu__side .fullButton a.button { border-color: var(--wm-shu); background: var(--wm-shu); color: #fff !important; }
#container #menubar.db .wmMenu__side .fullButton a.button:hover { border-color: var(--wm-shu-dark); background: var(--wm-shu-dark); color: #fff !important; }

/* 言語切替（メニュー内の写し）: PC でも右列に出す。ヘッダー内 <style> の
   .langMenu（position:fixed）・.langMenu--inmenu{display:none}・スマホの丸い札を上書き */
#container #menubar .langMenu--inmenu {
  display: block;
  position: static;
  top: auto;
  right: auto;
  width: auto;
  max-width: none;
  height: auto;
  margin: 40px 0 0;
  z-index: auto;
  font-size: 14px;
}
#container #menubar.db .langMenu--inmenu .langMenu__btn {
  display: block;
  margin: 0 0 16px;
  padding: 0;
  background: none;
  box-shadow: none;
  color: inherit;
  pointer-events: none; /* 常に開いた一覧として見せる（閉じさせない） */
}
#container #menubar.db .langMenu--inmenu .langMenu__btn::before { content: "LANGUAGE"; }
/* summary はキーボード（Enter）では閉じられるので、閉じても一覧は出したままにする（対応ブラウザのみ。
   非対応のブラウザでは規則ごと無視され、従来どおり） */
#container #menubar .langMenu--inmenu::details-content { content-visibility: visible; }
#container #menubar.db .langMenu--inmenu .langMenu__btn > span { display: none; }
#container #menubar.db .langMenu--inmenu .langMenu__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  position: static;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}
#container #menubar.db .langMenu--inmenu .langMenu__list li { margin: 0; }
#container #menubar.db .langMenu--inmenu .langMenu__item {
  display: block;
  margin: 0;
  padding: 9px 4px;
  border: 1px solid var(--wm-line);
  border-radius: 0;
  background: #fff;
  color: var(--wm-ink);
  font: 500 14px/1.5 var(--wm-gothic);
  letter-spacing: .04em;
  text-align: center;
  white-space: nowrap;
}
#container #menubar.db .langMenu--inmenu .langMenu__item:hover { border-color: var(--wm-ink); }
#container #menubar.db .langMenu--inmenu .langMenu__item.is-active { border-color: var(--wm-ink); background: var(--wm-ink); color: var(--wm-paper); }

/* 欧文: 字間を詰める（長い語が多い） */
html:lang(en) #container #menubar.db .menu_item a,
html:lang(es) #container #menubar.db .menu_item a { letter-spacing: .02em; }
html:lang(en) #container #menubar.db .wmMenu__side a.button,
html:lang(es) #container #menubar.db .wmMenu__side a.button { letter-spacing: .03em; }

/* 狭い PC・タブレット: リンクの 2 群を縦に積む */
@media (max-width: 900px) {
  #container #menubar.db .wmMenu { grid-template-columns: minmax(0, 1fr) minmax(220px, 280px); column-gap: 40px; padding: 48px 32px 56px; }
  #container #menubar.db ul.wmMenu__links { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  #container #menubar.db .wmMenu__side { padding-left: 32px; }
}
/* スマホ: 1 列（リンク → ログイン → 言語）。縦罫は横罫に */
@media (max-width: 600px) {
  #container #menubar.db .wmMenu { grid-template-columns: minmax(0, 1fr); align-content: start; padding: 28px 20px 48px; }
  #container #menubar.db ul.wmMenu__links { gap: 32px; }
  #container #menubar.db .menu_item a { padding: 13px 32px 13px 0; font-size: 19px; }
  #container #menubar.db .wmMenu__side { margin-top: 40px; padding: 0; border-left: 0; }
  #container #menubar.db .wmMenu__side::before { padding-bottom: 12px; border-bottom: 1px solid var(--wm-ink); }
  #container #menubar.db .wmMenu__side a.button { min-height: 52px; }
  #container #menubar .langMenu--inmenu { margin-top: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  #container #menubar.db { animation: none; }
}

/* ── フッター（全ページ）────────────────────────────────────────────────
   見本の .ft: 墨より深い地、ロゴ（すし検の札）、住所、2 列のメニュー、
   罫の下に著作権と「検定お申込み」の札。SNS・TEL・登録商標の一文は本番のまま残す。 */
#container .site-footer {
  background: var(--wm-night);
  color: #CFC7B9;
  padding: 64px 24px 32px;
  font-family: var(--wm-gothic);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.9;
  letter-spacing: .04em;
}
/* 本文の段（1080px 幅・左右 24px）と左端をそろえる */
#container .site-footer__top { max-width: 1032px; align-items: flex-start; gap: 40px; }
#container .site-footer__brand { align-items: flex-start; text-align: left; gap: 16px; }
#container .site-footer__logo img { width: auto; height: 56px; }
#container .site-footer__social { justify-content: flex-start; gap: 14px; }
#container .site-footer__social img { width: 32px; height: 32px; }
#container .site-footer__address,
#container .site-footer__address a { color: #CFC7B9; }
#container .site-footer__address p { line-height: 1.8; text-align: left; }
#container .site-footer__nav ul { grid-template-columns: repeat(2, auto); justify-content: start; justify-items: start; gap: 8px 40px; }
#container .site-footer__nav a { font-size: 13px; color: #CFC7B9; text-align: left; }
#container .site-footer__nav a:hover,
#container .site-footer__address a:hover { color: #fff; }
#container .site-footer__bar { max-width: 1032px; margin-top: 40px; border-top-color: rgba(255, 255, 255, .12); align-items: flex-start; }
#container .site-footer__copy { text-align: left; font-size: 12px; }
#container .site-footer__cta { width: auto; max-width: none; height: auto; padding: 11px 26px; font-size: 14px; }
#container .site-footer__cta:hover { background: var(--wm-shu-dark); }
@media (min-width: 601px) {
  #container .site-footer { padding: 64px 40px 32px; }
  #container .site-footer__nav ul { justify-content: end; text-align: left; }
  #container .site-footer__bar { align-items: center; }
}

/* ── トップ #wmHome と、和モダンに合わせた下層ページ #wmPage の共通部分 ──────────
   main.home（旧トップ）・main.test（旧下層）は 100vh のスクロール箱・scroll-snap・
   写真帯の規則を持つので、合わせ直したページはそれらのクラスを使わない。 */
#wmHome,
#wmPage {
  display: block;
  background: var(--wm-paper);
  color: var(--wm-ink);
  font-family: var(--wm-gothic);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.9;
  letter-spacing: .02em;
  padding-top: var(--wm-header-h);
}
/* 旧 CSS の汎用ルールを打ち消す（余白・揃え・字の大きさは下の部品で決める） */
:is(#wmHome, #wmPage) section { padding: 0; margin: 0; display: block; color: inherit; text-align: left; }
:is(#wmHome, #wmPage) p, :is(#wmHome, #wmPage) dl, :is(#wmHome, #wmPage) dt, :is(#wmHome, #wmPage) dd, :is(#wmHome, #wmPage) ul, :is(#wmHome, #wmPage) ol, :is(#wmHome, #wmPage) li { margin: 0; padding: 0; text-align: inherit; }
:is(#wmHome, #wmPage) ul, :is(#wmHome, #wmPage) ol { list-style: none; }
:is(#wmHome, #wmPage) h2, :is(#wmHome, #wmPage) h3 { margin: 0; padding: 0; color: inherit; text-align: inherit; font-weight: 700; }
:is(#wmHome, #wmPage) img { display: block; max-width: 100%; height: auto; }
:is(#wmHome, #wmPage) strong { font-weight: 700; color: var(--wm-ink); }
:is(#wmHome, #wmPage) small.r { font-size: 52%; top: -.75em; position: relative; }

/* 共通の部品 */
:is(#wmHome, #wmPage) .wmWrap { max-width: 1080px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
:is(#wmHome, #wmPage) .wmSec { padding: 112px 0; }
:is(#wmHome, #wmPage) .wmSec--tint { background: var(--wm-paper-2); }
:is(#wmHome, #wmPage) .wmHead { margin-bottom: 56px; }
:is(#wmHome, #wmPage) .wmHead--center { text-align: center; }
:is(#wmHome, #wmPage) .wmHead--solo { margin-bottom: 40px; }
/* 英字の小見出し（FEATURES など）は飾り。文章に混ぜないよう属性から CSS で描く */
:is(#wmHome, #wmPage) [data-eyebrow]::before,
:is(#wmHome, #wmPage) .wmEyebrow {
  display: block;
  margin: 0 0 14px;
  color: var(--wm-shu);
  font: 500 13px/1.6 var(--wm-gothic);
  letter-spacing: .3em;
}
:is(#wmHome, #wmPage) [data-eyebrow]::before { content: attr(data-eyebrow); }
:is(#wmHome, #wmPage) .wmHead--solo::before { margin: 0; font-size: 15px; }
:is(#wmHome, #wmPage) .wmH2 {
  margin: 0 0 18px;
  font: 700 36px/1.5 var(--wm-mincho);
  letter-spacing: .06em;
  word-break: auto-phrase;
  text-wrap: balance;
}
:is(#wmHome, #wmPage) .wmHead .wmH2:last-child { margin-bottom: 0; }
:is(#wmHome, #wmPage) .wmBody { margin: 0; max-width: 40em; color: var(--wm-mute); }
:is(#wmHome, #wmPage) .wmHead--center .wmBody { margin: 0 auto; }
:is(#wmHome, #wmPage) .wmBody strong { color: var(--wm-ink); }
:is(#wmHome, #wmPage) .wmSmall { margin-top: 16px; color: var(--wm-mute); font-size: 13px; line-height: 1.8; }
:is(#wmHome, #wmPage) .wmNote { margin-top: 22px; color: var(--wm-mute); font-size: 14px; }
:is(#wmHome, #wmPage) p.wmNote + p.wmNote { margin-top: 4px; }

/* 札のボタン（.lpCta は styles.css の形 ＝ 角を立てた赤、内側に白い細線。字の大きさだけ見本に） */
:is(#wmHome, #wmPage) .lpCta { display: inline-block; padding: 13px 34px; background: var(--wm-shu); color: #fff; font: 700 17px/1.4 var(--wm-gothic); text-decoration: none; box-shadow: none; }
:is(#wmHome, #wmPage) .lpCta:hover { background: var(--wm-shu-dark); color: #fff; }
:is(#wmHome, #wmPage) .lpCta small.r { top: -.6em; }

/* 1. 最初の画面 */
#wmHome .wmHero { display: grid; grid-template-columns: 44% 56%; min-height: clamp(560px, calc(80vh - var(--wm-header-h)), 760px); }
#wmHome .wmHero__text { display: flex; flex-direction: column; justify-content: center; padding: 72px 48px 72px 80px; }
#wmHome .wmHero__logo { margin: 0 0 28px; }
#wmHome .wmHero__logo img { width: auto; height: 40px; }
#wmHome .wmHero__title {
  margin: 0;
  font: 800 clamp(30px, 3.4vw, 48px)/1.5 var(--wm-mincho);
  letter-spacing: .06em;
  word-break: auto-phrase;
  text-wrap: balance;
}
/* 日本語の改行（スマホ用の <br class="spOnly">）は見本どおり PC でも効かせる */
#wmHome .wmHero__title br.spOnly { display: inline; }
/* 見本の「リクルーターの／目に留まります。」の切れ目に合わせ、日本語は 1 行 8 字ほどで折る */
html:lang(ja) #wmHome .wmHero__title { max-width: 8.8em; }
html:lang(en) #wmHome .wmHero__title,
html:lang(es) #wmHome .wmHero__title { letter-spacing: .01em; font-size: clamp(28px, 3vw, 42px); }
#wmHome .wmHero .heroCopy__cta { margin: 40px 0 0; text-align: left; }
#wmHome .wmHero__photo { position: relative; overflow: hidden; background: var(--wm-paper-2); }
#wmHome .wmHero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% center; }

/* 2. すし検とは（縦の見出し + 本文）。縦書きは日本語と中国語だけ。欧文・ハングルは横で罫を下に */
#wmHome .wmAbout { display: grid; grid-template-columns: auto 1fr; gap: 64px; align-items: start; }
#wmHome .wmAbout > h2 {
  margin: 0;
  padding: 0 0 8px;
  border-bottom: 1px solid var(--wm-shu);
  font: 700 26px/1.4 var(--wm-mincho);
  letter-spacing: .1em;
  max-width: 12em;
}
html:lang(ja) #wmHome .wmAbout > h2,
html:lang(zh) #wmHome .wmAbout > h2 {
  writing-mode: vertical-rl;
  padding: 0 0 0 14px;
  border-bottom: 0;
  border-left: 1px solid var(--wm-shu);
  font-size: 30px;
  letter-spacing: .3em;
  max-width: none;
}
html:lang(ja) #wmHome .wmAbout > h2 small.r,
html:lang(zh) #wmHome .wmAbout > h2 small.r { top: 0; right: .2em; }
#wmHome .wmAbout .wmBody { margin-top: 0; }
#wmHome .wmPanel { margin-top: 48px; padding: 36px 40px; background: #fff; border: 1px solid var(--wm-line); }
#wmHome .wmPanel p:not(.wmSmall) { line-height: 2; }
#wmHome .wmPanel p:not(.wmSmall) + p:not(.wmSmall) { margin-top: 8px; }

/* 3. 3つの特徴。番号 壱弐参 は飾り */
#wmHome .wmFeats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; counter-reset: wmFeat; }
#wmHome .wmFeat { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--wm-line); counter-increment: wmFeat; }
#wmHome .wmFeat__img { aspect-ratio: 4 / 3; overflow: hidden; }
#wmHome .wmFeat__img img { width: 100%; height: 100%; object-fit: cover; }
#wmHome .wmFeat__img--contain { background: #fff; }
#wmHome .wmFeat__img--contain img { object-fit: contain; padding: 12px; box-sizing: border-box; }
#wmHome .wmFeat__title { padding: 26px 26px 0; font: 700 22px/1.6 var(--wm-mincho); }
#wmHome .wmFeat__title::before { display: block; margin-bottom: 6px; color: var(--wm-shu); font: 500 13px/1.6 var(--wm-mincho); letter-spacing: .2em; }
#wmHome .wmFeat:nth-child(1) .wmFeat__title::before { content: "壱"; }
#wmHome .wmFeat:nth-child(2) .wmFeat__title::before { content: "弐"; }
#wmHome .wmFeat:nth-child(3) .wmFeat__title::before { content: "参"; }
#wmHome .wmFeat dd { padding: 0 26px; color: var(--wm-mute); font-size: 15px; }
#wmHome .wmFeat .wmFeat__title + dd { padding-top: 10px; }
#wmHome .wmFeat dd:last-child { padding-bottom: 30px; }

/* 4. 仕事がみつかる */
#wmHome .wmSplit { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
#wmHome .wmSplit__img { aspect-ratio: 4 / 5; overflow: hidden; }
#wmHome .wmSplit__img img { width: 100%; height: 100%; object-fit: cover; }
#wmHome .wmSplit .wmHead { margin-bottom: 18px; }
#wmHome .wmSplit .wmBody p + p { margin-top: 2px; }
#wmHome .wmSteps { margin-top: 28px; }
#wmHome .wmSteps li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 18px 0; border-top: 1px solid var(--wm-line); }
#wmHome .wmSteps li:last-child { border-bottom: 1px solid var(--wm-line); }
#wmHome .wmSteps__num { color: var(--wm-shu); font: 700 30px/1.2 var(--wm-mincho); }
#wmHome .wmSteps__title { display: block; margin: 0 0 4px; font: 700 18px/1.5 var(--wm-mincho); }
#wmHome .wmSteps__text { display: block; color: var(--wm-mute); font-size: 14px; }

/* 5. 電子認証プログラム */
#wmHome .wmCert { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: center; }
#wmHome .wmCert .wmHead { margin-bottom: 20px; }
:is(#wmHome, #wmPage) .wmChecks { margin-top: 20px; }
:is(#wmHome, #wmPage) .wmChecks li { position: relative; padding: 10px 0 10px 28px; border-bottom: 1px dashed var(--wm-line); font-size: 15px; }
:is(#wmHome, #wmPage) .wmChecks li::before { content: ""; position: absolute; left: 4px; top: 19px; width: 10px; height: 10px; background: var(--wm-shu); transform: rotate(45deg); }
#wmHome .wmCert__imgs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
#wmHome .wmCert__imgs img { border: 1px solid var(--wm-line); background: #fff; }

/* 6. 寿司を、もっと深く（見本に無い段。3 つの札を見本のカードと同じ白・細罫・明朝で） */
#wmHome .learnSteps { max-width: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; letter-spacing: .02em; }
#wmHome .learnSteps > li { background: #fff; border: 1px solid var(--wm-line); border-radius: 0; box-shadow: none; color: var(--wm-ink); }
#wmHome .learnSteps > li + li::before { content: none; }
#wmHome .learnSteps__num { top: -18px; left: 20px; width: 36px; height: 36px; border-radius: 0; background: var(--wm-paper); color: var(--wm-shu); border: 1px solid var(--wm-shu); box-shadow: none; font: 700 20px/34px var(--wm-mincho); }
#wmHome .learnSteps__media { border-radius: 0; }
#wmHome .learnSteps__media--books { background: var(--wm-paper-2); }
#wmHome .learnSteps__media--exam { background: var(--wm-paper-2); }
#wmHome .learnSteps__body { padding: 22px 24px 28px; gap: 8px; }
#wmHome .learnSteps__kicker { color: var(--wm-shu); font: 500 12px/1.6 var(--wm-gothic); letter-spacing: .16em; }
#wmHome h3.learnSteps__title { color: var(--wm-ink); font: 700 20px/1.6 var(--wm-mincho); letter-spacing: .04em; word-break: auto-phrase; text-wrap: balance; }
#wmHome .learnSteps__text { color: var(--wm-mute); font-size: 14px; line-height: 1.8; }
#wmHome .learnSteps__go { margin-top: auto; padding-top: 8px; }
#wmHome .learnSteps__link { color: var(--wm-shu); font-size: 15px; }
#wmHome .learnSteps .lpCta { display: block; text-align: center; font-size: 15px; padding: 12px 20px; }
#wmHome .learnBadge { align-self: flex-start; border-radius: 2px; }

/* お寿司の歴史の絵 .histArt（styles.css。トップの ①アニメの札と /history/{episode} の動画枠）、2026-11-02。
   ポスターが無い・読めないときに見える題（.histArt__label、左下）に、左下の再生の印と右下の再生時間の札が重なっていた
   （英語など題の長い言語で目立つ）。再生の印は題のある絵では右上へ（左上はトップの札の番号「1」と重なる。動画枠の右上の「近日公開」の札は、
   再生の印を出さない所にしか無い）、題は右に再生時間の札の幅を空けて折り返す。
   ポスターがあるときは題がポスターに隠れる（img が上）ので、印が右上になるだけ。 */
.histArt:has(.histArt__label) .histArt__play { top: 14px; right: 14px; bottom: auto; left: auto; }
.histArt:has(.histArt__time) .histArt__label { right: max(5cqw, 120px); }

/* 7. 理事のメッセージ */
#wmHome .wmDirs { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
#wmHome .wmDir { display: grid; grid-template-columns: 150px 1fr; gap: 24px; align-items: start; padding: 28px; background: #fff; border: 1px solid var(--wm-line); }
#wmHome .wmDir__photo img { width: 150px; aspect-ratio: 3 / 4; object-fit: cover; object-position: center top; }
#wmHome .wmDir__name dt { color: var(--wm-mute); font-size: 13px; letter-spacing: .1em; }
#wmHome .wmDir__name dd { margin: 2px 0 14px; font: 700 22px/1.5 var(--wm-mincho); letter-spacing: .08em; }
#wmHome .wmDir__msg { font: 500 16px/2 var(--wm-mincho); }
#wmHome .wmDir__bio { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--wm-line); color: var(--wm-mute); font-size: 13px; line-height: 1.85; }

/* 8. お寿司屋さんを経営する皆様へ（墨の地） */
#wmHome .wmOwner { background: var(--wm-ink); color: #EFE9DD; }
#wmHome .wmOwner .wmH2 { color: #fff; }
#wmHome .wmOwner .wmBody { color: #B9B1A4; margin-top: 18px; }
#wmHome .wmOwner .wmHead { margin-bottom: 48px; }
#wmHome .wmOwner__pts { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(255, 255, 255, .2); }
#wmHome .wmOwner__pts li { padding: 28px 24px 0 0; }
#wmHome .wmOwner__pts li + li { padding-left: 24px; border-left: 1px solid rgba(255, 255, 255, .12); }
#wmHome .wmOwner__pts li::before { display: block; color: var(--wm-shu); font: 500 13px/1.6 var(--wm-mincho); letter-spacing: .2em; }
#wmHome .wmOwner__pts li:nth-child(1)::before { content: "壱"; }
#wmHome .wmOwner__pts li:nth-child(2)::before { content: "弐"; }
#wmHome .wmOwner__pts li:nth-child(3)::before { content: "参"; }
#wmHome .wmOwner__title { display: block; margin: 10px 0 6px; color: #fff; font: 700 19px/1.5 var(--wm-mincho); }
#wmHome .wmOwner__text { display: block; color: #B9B1A4; font-size: 14px; }
#wmHome .wmOwner__cta { margin-top: 56px; }

/* 9. メディア */
#wmHome .wmMedia { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
#wmHome .wmMedia img { width: 100%; padding: 6px; box-sizing: border-box; background: #fff; border: 1px solid var(--wm-line); }

/* フッターはトップでは main の中にある。旧 .box.main_top の余白を消す */
#wmHome > .main_top { display: block; padding: 0; color: inherit; }

/* 読み込み中の札（旧トップから引き継ぎ）の地を生成りに */
.homeFullMask { background: var(--wm-paper); }

/* ── 欧文・ハングル: 文が長いので字間を詰め、見出しを一段小さく ── */
html:lang(en) :is(#wmHome, #wmPage) .wmH2, html:lang(es) :is(#wmHome, #wmPage) .wmH2 { letter-spacing: .01em; font-size: 32px; }
html:lang(en) :is(#wmHome, #wmPage) [data-eyebrow]::before, html:lang(es) :is(#wmHome, #wmPage) [data-eyebrow]::before { letter-spacing: .24em; }
html:lang(en) :is(#wmHome, #wmPage) .lpCta, html:lang(es) :is(#wmHome, #wmPage) .lpCta { letter-spacing: .04em; }
html:lang(ko) :is(#wmHome, #wmPage) .wmH2 { letter-spacing: .02em; }
html:lang(en) #wmHome .wmAbout > h2, html:lang(es) #wmHome .wmAbout > h2, html:lang(ko) #wmHome .wmAbout > h2 { letter-spacing: .03em; }

/* ── タブレット ── */
@media (max-width: 1024px) {
  #wmHome .wmHero__text { padding: 56px 32px 56px 40px; }
  #wmHome .learnSteps { grid-template-columns: 1fr; max-width: 560px; margin: 0 auto; gap: 40px; }
  #wmHome .wmDirs { grid-template-columns: 1fr; }
  /* 3つの特徴: 768px で 3 列だと 1 列 200px ほどで本文が細切れだった（2026-11-02）。下の「寿司を、もっと深く」と同じく 1 列・560px */
  #wmHome .wmFeats { grid-template-columns: 1fr; max-width: 560px; margin: 0 auto; }
}

/* ── スマホ（見本の 760px） ── */
@media (max-width: 760px) {
  :is(#wmHome, #wmPage) { font-size: 15px; }
  :is(#wmHome, #wmPage) .wmSec { padding: 72px 0; }
  :is(#wmHome, #wmPage) .wmWrap { padding: 0 20px; }
  :is(#wmHome, #wmPage) .wmHead { margin-bottom: 40px; }
  :is(#wmHome, #wmPage) .wmH2 { font-size: 26px; }
  html:lang(en) :is(#wmHome, #wmPage) .wmH2, html:lang(es) :is(#wmHome, #wmPage) .wmH2 { font-size: 24px; }
  #wmHome .wmHero { grid-template-columns: 1fr; min-height: 0; }
  #wmHome .wmHero__photo { order: -1; aspect-ratio: 3 / 2; }
  #wmHome .wmHero__text { padding: 36px 20px 52px; }
  #wmHome .wmHero__logo img { height: 32px; }
  #wmHome .wmHero__title { font-size: 30px; }
  html:lang(en) #wmHome .wmHero__title, html:lang(es) #wmHome .wmHero__title { font-size: 26px; }
  #wmHome .wmHero .heroCopy__cta { margin-top: 32px; }
  #wmHome .wmAbout { grid-template-columns: 1fr; gap: 24px; }
  html:lang(ja) #wmHome .wmAbout > h2,
  html:lang(zh) #wmHome .wmAbout > h2 { writing-mode: horizontal-tb; justify-self: start; padding: 0 0 8px; border-left: 0; border-bottom: 1px solid var(--wm-shu); font-size: 22px; }
  html:lang(ja) #wmHome .wmAbout > h2 small.r,
  html:lang(zh) #wmHome .wmAbout > h2 small.r { top: -.75em; right: 0; }
  #wmHome .wmAbout > h2 { justify-self: start; font-size: 22px; }
  #wmHome .wmPanel { margin-top: 32px; padding: 24px 20px; }
  #wmHome .wmFeats, #wmHome .wmSplit, #wmHome .wmCert, #wmHome .wmOwner__pts { grid-template-columns: 1fr; }
  #wmHome .wmSplit, #wmHome .wmCert { gap: 40px; }
  #wmHome .wmSplit__img { aspect-ratio: 3 / 2; }
  #wmHome .wmOwner__pts li, #wmHome .wmOwner__pts li + li { padding: 28px 0 0; border-left: 0; }
  #wmHome .wmOwner__cta { margin-top: 40px; }
  #wmHome .wmDir { grid-template-columns: 96px 1fr; padding: 20px; gap: 16px; }
  #wmHome .wmDir__photo img { width: 96px; }
  #wmHome .wmMedia { grid-template-columns: repeat(3, 1fr); gap: 10px; }
}

/* スマホの細かい調整（5 言語で撮って見つけたもの） */
@media (max-width: 760px) {
  /* 理事の名前: 狭い列で「保／子」と割れないよう、空白でだけ折る */
  #wmHome .wmDir__name dd { font-size: 18px; word-break: keep-all; overflow-wrap: anywhere; }
  #wmHome .wmDir__msg { font-size: 15px; }
  /* メディアの見出しは本番の <br> 入りで長い。字を下げて 2 行に収める */
  #wmHome .wmSec--media .wmH2 { font-size: 21px; }
}
/* 理事のメッセージ（スマホ、2026-11-02）: 写真 96px と横並びだと本文が画面の半分ほどの幅しか取れなかった。
   写真を上、本文を下に積んで、本文は札の幅いっぱいに */
@media (max-width: 500px) {
  #wmHome .wmDir { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  #wmHome .wmDir__photo img { width: 120px; }
}

/* =============================================================================
   下層ページ #wmPage の共通部品（2026-10-28〜。1 ページ目は /certification）
   ========================================================================== */
/* 最初の画面: 左に英字の小見出し・見出し・一文、右に写真（トップの最初の画面を低くした形） */
#wmPage .wmPageHero { display: grid; grid-template-columns: 44% 56%; min-height: clamp(420px, calc(64vh - var(--wm-header-h)), 600px); }
#wmPage .wmPageHero__text { display: flex; flex-direction: column; justify-content: center; padding: 64px 48px 64px 80px; }
#wmPage .wmPageHero__text .wmH2 { font-size: clamp(32px, 3.2vw, 44px); }
#wmPage .wmPageHero__photo { position: relative; overflow: hidden; background: var(--wm-paper-2); }
#wmPage .wmPageHero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* 本文中の #リンクで飛んだとき、見出しが固定ヘッダーの下に潜らない */
#wmPage [id] { scroll-margin-top: var(--wm-header-h); }
/* 白い札の枠（トップの「すし検とは」の枠と同じ） */
#wmPage .wmPanel { padding: 36px 40px; background: #fff; border: 1px solid var(--wm-line); }
/* 写真帯（旧の全画面の帯を低くしたもの）。固定背景はやめて普通に流す */
/* クラスは旧のまま（RecommendedSchoolsPageTest が class の並びまで見ている）なので id で当てる */
#wmPage #recommendationTitle,
#wmPage .wmBand { display: block; height: clamp(200px, 26vw, 360px); min-height: 0; max-height: none; padding: 0; background-attachment: scroll !important; background-size: cover; background-position: center; }

@media (max-width: 1024px) {
  #wmPage .wmPageHero__text { padding: 56px 32px 56px 40px; }
}
@media (max-width: 760px) {
  #wmPage .wmPageHero { grid-template-columns: 1fr; min-height: 0; }
  #wmPage .wmPageHero__photo { order: -1; aspect-ratio: 3 / 2; }
  #wmPage .wmPageHero__text { padding: 36px 20px 48px; }
  #wmPage .wmPageHero__text .wmH2 { font-size: 30px; }
  #wmPage .wmPanel { padding: 24px 20px; }
}

/* ── 検定について（/certification）─────────────────────────────────────── */
/* 級ごとの概要: 見本の「級の札」（白地・細罫で 4 つ並べる） */
#wmPage .wmLevels { min-width: 0; display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border: 1px solid var(--wm-line); }
#wmPage .wmLevels dl { display: block; padding: 24px 22px 26px; border: 0; border-right: 1px solid var(--wm-line); border-radius: 0; overflow: visible; }
#wmPage .wmLevels dl:last-child { border-right: 0; }
#wmPage .wmLevels dt { display: block; min-width: 0; padding: 0; background: none; color: var(--wm-ink); font: 800 26px/1.4 var(--wm-mincho); white-space: normal; }
#wmPage .wmLevels dd { margin-top: 8px; padding: 0; color: var(--wm-mute); font-size: 14px; line-height: 1.8; }
/* お手本動画 */
#wmPage .wmMovieHead { margin: 56px 0 20px; }
#wmPage .wmMovieHead::before { margin-bottom: 6px; }
#wmPage .movieListBox { margin: 0; }
#wmPage .wmMovies { display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; max-width: none; }
#wmPage .wmMovies li { width: auto; margin: 0; }
#wmPage .wmMovies a { display: block; color: var(--wm-ink); text-decoration: none; }
#wmPage .wmMovies .movie { position: relative; display: block; aspect-ratio: 3 / 2; overflow: hidden; border: 1px solid var(--wm-line); background: #000; }
#wmPage .wmMovies .movie img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
#wmPage .wmMovies .movie::after { content: ""; position: absolute; left: 50%; top: 50%; width: 36px; height: 36px; margin: -18px 0 0 -18px; border-radius: 50%; background: rgba(230, 0, 18, .9) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3 2l5 3-5 3z' fill='%23fff'/%3E%3C/svg%3E") 58% 50% / 14px no-repeat; box-shadow: 0 0 0 2px rgba(255, 255, 255, .9); }
#wmPage .wmMovies a:hover .movie img { transform: scale(1.05); }
#wmPage .wmMovies a:focus-visible { outline: 2px solid var(--wm-shu); outline-offset: 3px; }
#wmPage .wmMovies .movie + span { display: block; margin-top: 8px; font-size: 13px; line-height: 1.6; }

/* 受検の流れ: 見本の「受けるまでの流れ」（墨の罫の上に朱の番号、4 つずつ 2 段） */
#wmPage .wmFlow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; border-top: 1px solid var(--wm-ink); }
#wmPage .wmFlow > li { display: block; height: auto; margin: 0; padding: 26px 22px 28px; background: none; border: 0; border-left: 1px solid var(--wm-line); box-shadow: none; }
#wmPage .wmFlow > li:nth-child(4n+1) { padding-left: 0; border-left: 0; }
#wmPage .wmFlow > li:nth-child(n+5) { border-top: 1px solid var(--wm-line); }
#wmPage .wmFlow > li .icon09 { position: static; width: auto; height: auto; margin: 0 0 12px; padding: 0; background: none; border: 0; color: var(--wm-shu); font: 700 36px/1 var(--wm-mincho); text-align: left; }
#wmPage .wmFlow > li .icon09::before,
#wmPage .wmFlow > li .icon09::after,
#wmPage .wmFlow > li::before,
#wmPage .wmFlow > li::after { content: none; display: none; }
#wmPage .wmFlow > li dl { width: auto; margin: 0; padding: 0; } /* 旧 .flow09 > li dl の width: calc(100% - 70px) を外す（スマホで右が 70px 余って早く折り返していた） */
#wmPage .wmFlow > li dd { margin: 0; padding: 0; font: 700 17px/1.6 var(--wm-mincho); text-align: left; }

/* 試験内容: 級ごとの札。表は「項目名を小さく・値を大きく」、罫は横だけ */
#wmPage .wmGrades { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
#wmPage .wmGrade { padding: 28px 32px 24px; background: #fff; border: 1px solid var(--wm-line); }
#wmPage .wmGrade__name { margin: 0 0 10px; padding: 0; background: none; border: 0; color: var(--wm-ink); font: 800 28px/1.4 var(--wm-mincho); }
#wmPage .wmGrade__name::before, #wmPage .wmGrade__name::after { content: none; }
#wmPage .wmGrade .baseTable { width: 100%; margin: 0; border: 0; border-collapse: collapse; table-layout: fixed; }
#wmPage .wmGrade .baseTable .dblTh { width: 8.5em; }
#wmPage .wmGrade .baseTable .dblTd { width: auto; }
#wmPage .wmGrade .baseTable th,
#wmPage .wmGrade .baseTable td { display: table-cell; width: auto; padding: 14px 0; border: 0; border-top: 1px solid var(--wm-line); background: none; color: var(--wm-ink); font-size: 15px; line-height: 1.8; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
#wmPage .wmGrade .baseTable th { padding-right: 16px; color: var(--wm-mute); font-size: 13px; font-weight: 500; letter-spacing: .08em; }
#wmPage .wmGrade .baseTable tr:first-child th,
#wmPage .wmGrade .baseTable tr:first-child td { border-top-color: var(--wm-ink); }
/* 受検料の行は少し強く */
#wmPage .wmGrade .baseTable tr:last-child td { font-weight: 700; }
html:lang(en) #wmPage .wmGrade .baseTable .dblTh,
html:lang(es) #wmPage .wmGrade .baseTable .dblTh { width: 9.5em; }
/* 注意事項 */
#wmPage .wmExamNotes { margin-top: 40px; padding: 32px 40px; background: #fff; border: 1px solid var(--wm-line); }
/* styles.css のスマホ用 `.addItems { padding-left: … !important }` に負けないよう !important */
#wmPage .wmExamNotes .wmChecks { margin: 0; padding: 0 !important; }
#wmPage .wmExamNotes .wmChecks li { margin: 0; text-indent: 0; line-height: 1.9; font-size: 15px; }
#wmPage .wmExamNotes .wmChecks li:last-child { border-bottom: 0; }
#wmPage .wmExamNotes .wmChecks a { color: var(--wm-shu); text-decoration: underline; text-underline-offset: .25em; }
#wmPage .examCont__cta { margin: 48px 0 0; text-align: center; }

/* おすすめ寿司学校（partials/recommended-schools — /customervoice と共有なので、ここでだけ見た目を変える） */
#wmPage #recommendationCont { display: block; padding: 112px 0; background: var(--wm-paper); color: var(--wm-ink); }
#wmPage #recommendationCont .introBox { max-width: 1080px; margin: 0 auto 48px; padding: 0 24px; text-align: center; }
#wmPage #recommendationCont .introBox::before { content: "RECOMMENDED SCHOOLS"; display: block; margin: 0 0 14px; color: var(--wm-shu); font: 500 13px/1.6 var(--wm-gothic); letter-spacing: .3em; }
#wmPage #recommendationCont .introBox h2 { margin: 0; color: var(--wm-ink); font: 700 36px/1.5 var(--wm-mincho); letter-spacing: .06em; text-align: center; }
#wmPage #recommendationCont .ma_5 { max-width: 1080px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
#wmPage #recommendationCont .sco_list { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin: 0; padding: 0; counter-reset: wmSchool; }
#wmPage #recommendationCont .sco_list > li { position: relative; display: block; margin: 0; padding: 28px 32px 26px; background: #fff; border: 1px solid var(--wm-line); font-size: 15px; text-align: left; counter-increment: wmSchool; }
#wmPage #recommendationCont .sco_list > li::before { content: counter(wmSchool); position: static; display: block; width: auto; height: auto; margin: 0 0 6px; background: none; color: var(--wm-shu); font: 700 28px/1.2 var(--wm-mincho); text-align: left; transform: none; }
#wmPage #recommendationCont .sco_list > li.l_flex { display: grid; grid-template-columns: 1fr 88px; grid-template-rows: auto 1fr; column-gap: 20px; align-items: start; }
#wmPage #recommendationCont .sco_list > li.l_flex::before { grid-column: 1 / -1; }
#wmPage #recommendationCont .sco_list > li.l_flex img { width: 88px; height: auto; margin: 0; }
#wmPage #recommendationCont .sco_list h3 { margin: 0 0 8px; color: var(--wm-ink); font: 700 21px/1.5 var(--wm-mincho); text-align: left; }
#wmPage #recommendationCont .sco_list p { margin: 0; color: var(--wm-mute); font-size: 14px; line-height: 1.85; text-align: left; }
#wmPage #recommendationCont .sco_list p.sco_link { margin-top: 10px; }
#wmPage #recommendationCont .sco_list .sco_link a { color: var(--wm-shu); font-weight: 700; }
/* 旧 CSS の「赤い下線」を消す */
#wmPage #recommendationCont .sco_list > li { border-bottom: 1px solid var(--wm-line); }

/* 英語・スペイン語: 字間を詰める */
html:lang(en) #wmPage #recommendationCont .introBox h2,
html:lang(es) #wmPage #recommendationCont .introBox h2 { letter-spacing: .01em; font-size: 32px; }

@media (max-width: 1024px) {
  #wmPage .wmMovies { grid-template-columns: repeat(4, 1fr); row-gap: 20px; }
  /* 試験内容の級の札: 2 列だと値の列が 200px ほどで「4／分半」「2回／目以降」と折れていた（2026-11-02）→ 1 列 */
  #wmPage .wmGrades { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  #wmPage .wmLevels { grid-template-columns: 1fr; }
  #wmPage .wmLevels dl { position: static; display: grid; grid-template-columns: 4.2em 1fr; column-gap: 16px; align-items: baseline; padding: 16px 18px; border-right: 0; border-bottom: 1px solid var(--wm-line); }
  #wmPage .wmLevels dl:last-child { border-bottom: 0; }
  /* 旧 CSS のスマホ用（点線の丸に級を入れて dd を左から 4.5em 空ける）を打ち消す */
  #wmPage .wmLevels dt { position: static; width: auto; height: auto; border: 0; border-radius: 0; text-align: left; font-size: 22px; line-height: 1.4; }
  #wmPage .wmLevels dd { margin-top: 0; padding: 0; min-height: 0; font-size: 14px; }
  html:lang(en) #wmPage .wmLevels dl, html:lang(es) #wmPage .wmLevels dl, html:lang(ko) #wmPage .wmLevels dl { grid-template-columns: 1fr; }
  html:lang(en) #wmPage .wmLevels dd, html:lang(es) #wmPage .wmLevels dd, html:lang(ko) #wmPage .wmLevels dd { margin-top: 4px; }
  #wmPage .wmMovieHead { margin-top: 40px; }
  #wmPage .wmMovies { grid-template-columns: repeat(2, 1fr); gap: 16px 12px; }
  #wmPage .wmFlow { grid-template-columns: 1fr; }
  #wmPage .wmFlow > li,
  #wmPage .wmFlow > li:nth-child(4n+1) { display: grid; grid-template-columns: 48px 1fr; align-items: baseline; padding: 16px 0; border-left: 0; border-top: 0; border-bottom: 1px solid var(--wm-line); }
  #wmPage .wmFlow > li .icon09 { margin: 0; font-size: 28px; }
  #wmPage .wmFlow > li dd { font-size: 16px; }
  #wmPage .wmGrades { grid-template-columns: 1fr; gap: 20px; }
  #wmPage .wmGrade { padding: 22px 20px 16px; }
  #wmPage .wmGrade__name { font-size: 24px; }
  /* 表は項目名を上、値を下に積む（390 幅で横にはみ出さない） */
  #wmPage .wmGrade .baseTable,
  #wmPage .wmGrade .baseTable tbody,
  #wmPage .wmGrade .baseTable tr { display: block; width: 100%; margin: 0; padding: 0; border: 0; }
  #wmPage .wmGrade .baseTable colgroup { display: none; }
  #wmPage .wmGrade .baseTable th,
  #wmPage .wmGrade .baseTable td { display: block; width: auto; padding: 0; }
  #wmPage .wmGrade .baseTable th { padding: 12px 0 2px; border: 0; border-top: 1px solid var(--wm-line); font-size: 12px; line-height: 1.6; }
  #wmPage .wmGrade .baseTable td { padding: 0 0 12px; border: 0; font-size: 15px; }
  #wmPage .wmGrade .baseTable tr:first-child th { border-top-color: var(--wm-ink); }
  #wmPage .wmExamNotes { margin-top: 28px; padding: 20px 18px; }
  #wmPage .wmExamNotes .wmChecks li { font-size: 14px; }
  #wmPage #recommendationCont { padding: 72px 0; }
  #wmPage #recommendationCont .introBox { margin-bottom: 32px; padding: 0 20px; }
  #wmPage #recommendationCont .introBox h2 { font-size: 26px; }
  #wmPage #recommendationCont .ma_5 { padding: 0 20px; }
  #wmPage #recommendationCont .sco_list { grid-template-columns: 1fr; gap: 16px; }
  #wmPage #recommendationCont .sco_list > li { padding: 22px 20px 20px; }
  #wmPage #recommendationCont .sco_list > li.l_flex { grid-template-columns: 1fr 64px; }
  #wmPage #recommendationCont .sco_list > li.l_flex img { width: 64px; }
}
/* おすすめ寿司学校の前の抹茶の帯（main_6.jpg 2.4MB を帯の比率に切り出して軽くしたもの） */
#wmPage #recommendationTitle { background-image: url(../images/wamodern/matcha.jpg); }

/* ── 申し込み（/application）和モダン（2026-10-30）──────────────────────────
   旧 main.application（100vh のスクロール箱）をやめ、#wmPage の部品で組む。
   級ごとの中身（.applicationListVew の 概要 .flow / 用意する物 .preparation / 動画 .movies）は
   旧のクラスのまま残し、styles.css の枠・矢印・浮動・2 段組みをここで打ち消す。
   協会の声「表が詰まっていて読みにくい」に合わせ、字を大きく・行間を広く・スマホは 1 列に積む。 */

/* 受検の流れ（9 段）: 和モダン（2026-10-30）。3 つの段階（お申し込み 1〜5 / 受検 6 / 結果・公開 7〜9）に分け、
   朱の丸の番号を細い線でつなぐ。PC（861px〜）は段階ごとに 1 行で左→右、スマホ・タブレット縦（〜860px）は
   1 本の縦の線で上→下（下の @media）。旧 .flow09 は外したので styles.css の枠・STEP の飾りは掛からない。
   文なのでゴシックで。段階名は明朝、英字の STEP 1〜3 は data-eyebrow（共通の小見出しの形）。 */
#wmPage .wmPhases { border-top: 1px solid var(--wm-ink); }
#wmPage .wmPhase__head::before { margin-bottom: 4px; }
#wmPage .wmPhase__name { color: var(--wm-ink); font: 700 24px/1.5 var(--wm-mincho); letter-spacing: .08em; text-align: left; }
html:lang(en) #wmPage .wmPhase__name, html:lang(es) #wmPage .wmPhase__name { letter-spacing: .02em; }
#wmPage .wmSteps { margin: 0; padding: 0; list-style: none; }
#wmPage .wmSteps > li { position: relative; margin: 0; padding: 0; list-style: none; }
#wmPage .wmSteps .icon09 { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; border-radius: 50%; background: var(--wm-shu); color: #fff; font: 700 20px/1 var(--wm-mincho); }
#wmPage .wmSteps dl { margin: 0; padding: 0; }
#wmPage .wmSteps dd { margin: 0; padding: 0; color: var(--wm-ink); font: 500 15px/1.85 var(--wm-gothic); text-align: left; overflow-wrap: anywhere; }
/* 期限（30日以内・１週間以内）: 訳文の中の <span class="wmDeadline"> を朱の太字に */
#wmPage .wmDeadline { color: var(--wm-shu); font-weight: 700; }
/* 受検（6 だけ）: 白い札にして「ここが本番」と見せる。札の左に朱の罫 */
#wmPage .wmPhase--exam .wmSteps dl { padding: 16px 22px; background: #fff; border-left: 2px solid var(--wm-shu); }
#wmPage .wmPhase--exam .wmSteps dd { font-size: 16px; }
@media (min-width: 861px) {
  #wmPage .wmPhase { padding: 40px 0 44px; border-bottom: 1px solid var(--wm-line); }
  #wmPage .wmPhase:last-child { padding-bottom: 0; border-bottom: 0; }
  /* 段階の中は横 1 列。丸の右から次の丸の手前まで細い朱の線 */
  #wmPage .wmSteps { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); column-gap: 28px; margin-top: 24px; }
  #wmPage .wmSteps .icon09 { margin-bottom: 16px; }
  #wmPage .wmSteps > li:not(:last-child)::after { content: ""; position: absolute; top: 22px; left: 56px; right: -16px; height: 1px; background: var(--wm-shu); opacity: .45; }
  /* 受検は丸の横に札（1 段でも行が埋まる） */
  #wmPage .wmPhase--exam .wmSteps > li { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 20px; align-items: center; }
  #wmPage .wmPhase--exam .wmSteps .icon09 { margin: 0; }
}

/* 級の札（白地・細罫）。見出しの級名は明朝で大きく、下に墨の罫 */
#wmPage .wmAppList .wmHead { margin-bottom: 48px; }
#wmPage .wmAppGrade { background: #fff; border: 1px solid var(--wm-line); }
#wmPage .wmAppGrade + .wmAppGrade { margin-top: 40px; }
#wmPage .wmAppGrade__inner { padding: 44px 48px 48px; }
#wmPage .wmAppGrade__name { display: block; margin: 0; padding: 0 0 16px; background: none; border: 0; border-bottom: 1px solid var(--wm-ink); color: var(--wm-ink); font: 800 32px/1.4 var(--wm-mincho); letter-spacing: .08em; text-align: left; line-height: 1.4; }
#wmPage .wmAppGrade__name::before, #wmPage .wmAppGrade__name::after { content: none; display: none; }
html:lang(en) #wmPage .wmAppGrade__name, html:lang(es) #wmPage .wmAppGrade__name { letter-spacing: .02em; }

/* 小見出し（概要・用意する物・動画）: 朱の小さな角に旧の白抜きアイコン + 明朝 */
#wmPage .applicationListVew h4 { display: flex; align-items: center; gap: 12px; margin: 36px 0 18px; padding: 0; background: none; border: 0; color: var(--wm-ink); font: 700 19px/1.5 var(--wm-mincho); letter-spacing: .06em; text-align: left; }
#wmPage .applicationListVew h4:first-child { margin-top: 28px; }
#wmPage .applicationListVew h4::before, #wmPage .applicationListVew h4::after { content: none; display: none; }
#wmPage .applicationListVew .iconBox { flex: none; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin: 0; background: var(--wm-shu); line-height: 1; }
#wmPage .applicationListVew .iconBox .iconImage { width: 18px; height: auto; margin: 0; }

/* 概要: 課題ごとの札を横に並べる（旧は枠 + 赤い矢印の縦積み） */
#wmPage .applicationListVew .wmAppGrade__lead { margin: 0 0 16px; color: var(--wm-ink); font-size: 16px; }
#wmPage .applicationListVew .flow { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin: 0; line-height: inherit; }
#wmPage .applicationListVew .flow dl { position: static; margin: 0; padding: 20px 22px 22px; background: var(--wm-paper); border: 0; border-top: 2px solid var(--wm-shu); color: var(--wm-ink); }
#wmPage .applicationListVew .flow dl::after { content: none; display: none; }
#wmPage .applicationListVew .flow dt { color: var(--wm-ink); font: 700 18px/1.6 var(--wm-mincho); letter-spacing: .04em; }
#wmPage .applicationListVew .flow dd { margin: 8px 0 0; padding: 0; border: 0; color: var(--wm-mute); font-size: 15px; line-height: 1.85; }

/* 用意する物: 旧の 2 段組みの箇条書き → 幅に合わせた格子。朱の菱形 + 点線の罫（.wmChecks と同じ形） */
#wmPage .applicationListVew .preparation { display: grid; grid-template-columns: 1fr; margin: 0; padding: 0; column-count: auto; }
#wmPage .applicationListVew .preparation li { position: relative; padding: 12px 0 12px 24px; border-bottom: 1px dashed var(--wm-line); color: var(--wm-ink); font-size: 16px; line-height: 1.7; }
#wmPage .applicationListVew .preparation li::before { content: ""; position: absolute; left: 3px; top: calc(12px + .85em - 4px); width: 8px; height: 8px; background: var(--wm-shu); transform: rotate(45deg); }
/* 1 級の注意（※ 2 行） */
#wmPage .applicationListVew .wmAppGrade__note { margin: 20px 0 0; padding: 16px 20px; background: var(--wm-paper); color: var(--wm-mute); font-size: 14px; line-height: 1.9; }

/* 動画: 3 本ずつ横に（旧の float をやめる）。題は上に明朝で */
#wmPage .applicationListVew .movies { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; }
#wmPage .applicationListVew .movies::after { content: none; display: none; }
#wmPage .applicationListVew .movies dl { float: none; width: auto; margin: 0; color: var(--wm-ink); }
#wmPage .applicationListVew .movies dt { margin: 0 0 8px; padding: 0; background: none; border: 0; color: var(--wm-ink); font: 700 15px/1.6 var(--wm-mincho); }
#wmPage .applicationListVew .movies dd { margin: 0; padding: 0; }
#wmPage .applicationListVew .movies video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #000; border: 1px solid var(--wm-line); }

/* 申込みへ進む: 札の下に罫を引いて中央に。.block（display:block !important）なので幅は fit-content で */
#wmPage .wmAppGrade__cta { display: block; width: auto; margin: 40px 0 0; padding: 32px 0 0; border-top: 1px solid var(--wm-line); text-align: center; }
#wmPage .wmAppGrade__cta a.lpCta { width: fit-content; max-width: 100%; margin: 0 auto; padding: 14px 40px; box-sizing: border-box; font: 700 17px/1.4 var(--wm-gothic); letter-spacing: .12em; text-align: center; }
html:lang(en) #wmPage .wmAppGrade__cta a.lpCta, html:lang(es) #wmPage .wmAppGrade__cta a.lpCta { letter-spacing: .04em; }
#wmPage .wmAppGrade__cta .iconImage { display: inline-block; width: 20px; height: auto; margin: 0 10px 0 0; vertical-align: -4px; }

/* 検定申し込み: 級を選ぶ 4 つの札（ページ内の各級へ飛ぶので、赤ではなく白地に墨の罫） */
#wmPage .wmAppApply { margin: 0 0 48px; padding: 40px 32px; background: var(--wm-paper-2); }
#wmPage .wmAppApply__lead { max-width: none; margin: 0 0 20px; text-align: center; }
#wmPage .wmAppApply__grades { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: 880px; margin: 0 auto; padding: 0; }
#wmPage .wmAppApply__grades::after { content: none; display: none; }
#wmPage .wmAppApply__grades li { float: none; width: auto; margin: 0; }
#wmPage .wmAppApply__grades a.btn3 { width: auto; margin: 0; padding: 22px 12px; background: #fff; border: 1px solid var(--wm-ink); border-radius: 0; outline: 0; color: var(--wm-ink) !important; font: 700 24px/1.4 var(--wm-mincho); letter-spacing: .1em; text-align: center; text-decoration: none; transition: background .2s, color .2s; }
#wmPage .wmAppApply__grades a.btn3:hover { background: var(--wm-ink); color: #fff !important; }
#wmPage .wmAppApply__grades a.btn3:focus-visible { outline: 2px solid var(--wm-shu); outline-offset: 3px; }
html:lang(en) #wmPage .wmAppApply__grades a.btn3, html:lang(es) #wmPage .wmAppApply__grades a.btn3 { font-size: 21px; letter-spacing: .02em; }

/* 受検の流れ（〜860px）: 和モダン（2026-10-30）。丸を左に並べ、1 本の縦の線で 1 → 9 をつなぐ。
   線は各段（li）と 2・3 段階目の見出しがそれぞれの高さ分を引く（間を margin で空けると線が切れるので padding で）。
   1 の上と 9 の下は丸の中心で止める。 */
@media (max-width: 860px) {
  #wmPage .wmPhases { border-top: 0; }
  #wmPage .wmPhase__head { position: relative; padding: 28px 0 10px 60px; }
  #wmPage .wmPhase:first-child .wmPhase__head { padding-top: 0; }
  #wmPage .wmPhase + .wmPhase .wmPhase__head::after { content: ""; position: absolute; top: 0; bottom: 0; left: 21px; width: 1px; background: var(--wm-shu); opacity: .45; }
  #wmPage .wmPhase__name { font-size: 21px; }
  #wmPage .wmSteps > li { min-height: 44px; padding: 12px 0 12px 60px; }
  #wmPage .wmSteps > li::after { content: ""; position: absolute; top: 0; bottom: 0; left: 21px; width: 1px; background: var(--wm-shu); opacity: .45; }
  #wmPage .wmPhase:first-child .wmSteps > li:first-child::after { top: 34px; }
  #wmPage .wmPhase:last-child .wmSteps > li:last-child::after { bottom: auto; height: 34px; }
  #wmPage .wmSteps .icon09 { position: absolute; z-index: 1; left: 0; top: 12px; }
  /* 1 行目の文字の中心を丸の中心にそろえる */
  #wmPage .wmSteps dl { padding-top: 8px; }
  #wmPage .wmPhase--exam .wmSteps dl { padding: 10px 16px; }
  #wmPage .wmPhase--exam .wmSteps .icon09 { top: 15px; }
}
@media (max-width: 1024px) {
  #wmPage .applicationListVew .movies { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  #wmPage .wmAppList .wmHead { margin-bottom: 32px; }
  #wmPage .wmAppGrade + .wmAppGrade { margin-top: 24px; }
  #wmPage .wmAppGrade__inner { padding: 26px 20px 28px; }
  #wmPage .wmAppGrade__name { padding-bottom: 12px; font-size: 26px; }
  #wmPage .applicationListVew h4 { margin: 28px 0 14px; font-size: 17px; gap: 10px; }
  #wmPage .applicationListVew h4:first-child { margin-top: 22px; }
  #wmPage .applicationListVew .iconBox { width: 28px; height: 28px; }
  #wmPage .applicationListVew .iconBox .iconImage { width: 16px; }
  #wmPage .applicationListVew .flow { grid-template-columns: 1fr; gap: 12px; }
  #wmPage .applicationListVew .flow dl { padding: 16px 18px 18px; }
  #wmPage .applicationListVew .flow dt { font-size: 17px; }
  #wmPage .applicationListVew .preparation li { padding: 10px 0 10px 22px; font-size: 15px; }
  #wmPage .applicationListVew .preparation li::before { top: calc(10px + .85em - 4px); }
  #wmPage .applicationListVew .movies { grid-template-columns: 1fr; gap: 20px; }
  #wmPage .wmAppGrade__cta { margin-top: 28px; padding-top: 24px; }
  #wmPage .wmAppGrade__cta a.lpCta { width: 100%; padding: 14px 16px; }
  #wmPage .wmAppApply { padding: 28px 16px; }
  #wmPage .wmAppApply__grades { grid-template-columns: 1fr 1fr; gap: 12px; }
  #wmPage .wmAppApply__grades a.btn3 { padding: 16px 8px; font-size: 20px; }
  html:lang(en) #wmPage .wmAppApply__grades a.btn3, html:lang(es) #wmPage .wmAppApply__grades a.btn3 { font-size: 18px; }
}

/* =============================================================================
   下層の共通（和モダン（2026-10-30）。役員紹介・協会理念・おすすめ寿司学校・入口 4 ページ・
   お問い合わせ・よくある質問・規約類 3 ページで使う部品。ページごとの見た目はこの下の各節）
   ========================================================================== */
/* 文字だけの見出し帯: 写真の要らないページの最初の画面。生成りの濃い地に英字の小見出しと明朝の見出し */
#wmPage .wmPageHead { padding: 72px 0 60px; background: var(--wm-paper-2); }
#wmPage .wmPageHead .wmH2 { margin: 0; font-size: clamp(30px, 3vw, 40px); }
#wmPage .wmPageHead .wmBody { margin-top: 16px; max-width: 44em; color: var(--wm-ink); }
/* 見出し帯の後・ページの先頭の節は、上の余白を詰める */
#wmPage .wmSec--top { padding-top: 64px; }
/* ボタン: メニューの LOGIN と同じ札（角を立て、内側の白い線なし）。
   朱の塗り（.wmBtn--shu）= 主な行き先・会員ログイン、墨の枠線（.wmBtn--ink）= 会場・採用担当のログイン。
   旧の .btn3 / .g / .block（styles.css: 幅 180px・緑・display:block !important・内側の白い線）を上書きする */
#wmPage .wmBtn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 56px;
  margin: 0;
  padding: 12px 28px;
  box-sizing: border-box;
  border: 1px solid var(--wm-ink);
  border-radius: 0;
  outline: 0;
  background: #fff;
  color: var(--wm-ink) !important;
  font: 700 16px/1.5 var(--wm-gothic);
  letter-spacing: .1em;
  text-align: center;
  text-decoration: none;
  box-shadow: none;
  overflow-wrap: anywhere;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: background-color .15s, color .15s, border-color .15s;
}
#wmPage .wmBtn:hover { background: var(--wm-ink); color: var(--wm-paper) !important; transform: none; filter: none; }
#wmPage .wmBtn--shu { border-color: var(--wm-shu); background: var(--wm-shu); color: #fff !important; }
#wmPage .wmBtn--shu:hover { border-color: var(--wm-shu-dark); background: var(--wm-shu-dark); color: #fff !important; }
#wmPage .wmBtn:focus-visible { outline: 2px solid var(--wm-shu); outline-offset: 3px; }
html:lang(en) #wmPage .wmBtn, html:lang(es) #wmPage .wmBtn { letter-spacing: .03em; }

@media (max-width: 760px) {
  #wmPage .wmPageHead { padding: 44px 0 40px; }
  #wmPage .wmPageHead .wmH2 { font-size: 28px; }
  html:lang(en) #wmPage .wmPageHead .wmH2, html:lang(es) #wmPage .wmPageHead .wmH2 { font-size: 26px; }
  #wmPage .wmSec--top { padding-top: 40px; }
}

/* ── 役員紹介（/represent）和モダン（2026-10-30）──────────────────────────────
   旧: 写真を左に float、右に 24px の字と赤い太罫。→ 1 人ずつ横罫で区切った札。左に写真（PC は読み進めても残る）、
   右に 所属（小さく）・役職と名前（明朝）・経歴（墨の淡色）・挨拶（朱の縦線の見出し + 本文 16px）。
   写真の列幅は 4 人とも同じ（2026-11-02。以前は代表理事だけ一回り大きく、本文の始まりが 1 人目だけずれていた）。
   スマホ（縦積み）だけ代表理事の写真を一回り大きく。 */
#wmPage .wmRep { display: grid; grid-template-columns: 220px minmax(0, 1fr); column-gap: 56px; align-items: start; padding: 56px 0; border-top: 1px solid var(--wm-line); }
#wmPage .wmRep--chief { padding-top: 0; border-top: 0; }
#wmPage .wmRep__photo { position: sticky; top: calc(var(--wm-header-h) + 24px); margin: 0; }
#wmPage .wmRep__photo img { width: 100%; height: auto; aspect-ratio: 600 / 686; object-fit: cover; border: 1px solid var(--wm-line); background: #fff; }
#wmPage .wmRep__name dt { color: var(--wm-mute); font: 500 13px/1.6 var(--wm-gothic); letter-spacing: .12em; }
#wmPage .wmRep__name dd { margin-top: 4px; color: var(--wm-ink); font: 700 26px/1.5 var(--wm-mincho); letter-spacing: .08em; }
#wmPage .wmRep--chief .wmRep__name dd { font-size: 30px; }
html:lang(en) #wmPage .wmRep__name dd, html:lang(es) #wmPage .wmRep__name dd { letter-spacing: .02em; }
#wmPage .wmRep__career { margin-top: 14px; padding-bottom: 24px; border-bottom: 1px solid var(--wm-line); color: var(--wm-mute); font-size: 14px; line-height: 1.9; }
#wmPage .wmRep__msg { margin-top: 28px; }
#wmPage .wmRep__msg h3 { position: relative; margin: 0 0 14px; padding: 0 0 0 18px; color: var(--wm-ink); font: 700 20px/1.5 var(--wm-mincho); letter-spacing: .06em; }
#wmPage .wmRep__msg h3::before { content: ""; position: absolute; left: 0; top: .25em; bottom: .25em; width: 3px; background: var(--wm-shu); }
#wmPage .wmRep__msg p { color: var(--wm-ink); font-size: 16px; line-height: 2; }
@media (max-width: 1024px) {
  #wmPage .wmRep { grid-template-columns: 180px minmax(0, 1fr); column-gap: 36px; }
}
@media (max-width: 760px) {
  #wmPage .wmRep, #wmPage .wmRep--chief { grid-template-columns: 1fr; padding: 40px 0; }
  #wmPage .wmRep--chief { padding-top: 0; }
  #wmPage .wmRep__photo { position: static; width: 160px; margin-bottom: 20px; }
  #wmPage .wmRep--chief .wmRep__photo { width: 200px; }
  #wmPage .wmRep__name dd, #wmPage .wmRep--chief .wmRep__name dd { font-size: 22px; }
  #wmPage .wmRep__msg h3 { font-size: 18px; }
  #wmPage .wmRep__msg p { font-size: 15px; }
}

/* ── 協会理念（/philosophy）和モダン（2026-10-30）──────────────────────────────
   旧: 白い箱 2 つ（赤い見出し + 箇条書き）。→ 最初の画面（理念の見出しと文 + 写真）と、主な事業の札。
   主な事業の 19 項目は、6 つのテーマの札に分けて並べる（和モダン（2026-10-30）、肱岡さん判断。
   以前は 1 列の白い札 1 枚だった）。PC は 3 列 × 2 段（段ごとに高さをそろえる）、1024px 以下 2 列、760px 以下 1 列。
   札の中: 番号 壱〜陸（トップの 3 つの特徴と同じく CSS の content で描く飾り。訳さない）→ 明朝のテーマ名 →
   朱の菱形 + 点線の罫の項目（.wmChecks）。「世界との交流」のような見出しめいた項目も、ふつうの項目のまま。 */
#wmPage .wmPhil__lead { margin-top: 4px; max-width: 34em; color: var(--wm-ink); font-size: 16px; line-height: 2; }
#wmPage .wmPhilThemes { --wm-phil-gap: 20px; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--wm-phil-gap); }
#wmPage .wmPhilTheme { min-width: 0; padding: 30px 30px 24px; background: #fff; border: 1px solid var(--wm-line); border-top: 2px solid var(--wm-shu); }
#wmPage .wmPhilTheme__title { margin: 0; padding: 0 0 14px; border-bottom: 1px solid var(--wm-line); color: var(--wm-ink); font: 700 21px/1.5 var(--wm-mincho); letter-spacing: .06em; text-align: left; overflow-wrap: break-word; }
#wmPage .wmPhilTheme__title::before { display: block; margin-bottom: 6px; color: var(--wm-shu); font: 500 13px/1.6 var(--wm-mincho); letter-spacing: .2em; }
#wmPage .wmPhilTheme:nth-child(1) .wmPhilTheme__title::before { content: "壱"; }
#wmPage .wmPhilTheme:nth-child(2) .wmPhilTheme__title::before { content: "弐"; }
#wmPage .wmPhilTheme:nth-child(3) .wmPhilTheme__title::before { content: "参"; }
#wmPage .wmPhilTheme:nth-child(4) .wmPhilTheme__title::before { content: "肆"; }
#wmPage .wmPhilTheme:nth-child(5) .wmPhilTheme__title::before { content: "伍"; }
#wmPage .wmPhilTheme:nth-child(6) .wmPhilTheme__title::before { content: "陸"; }
html:lang(en) #wmPage .wmPhilTheme__title, html:lang(es) #wmPage .wmPhilTheme__title { letter-spacing: .02em; }
#wmPage .wmPhilTheme__list { margin: 6px 0 0; }
#wmPage .wmPhilTheme__list li { padding: 12px 0 12px 24px; color: var(--wm-ink); font-size: 15px; line-height: 1.8; overflow-wrap: break-word; }
#wmPage .wmPhilTheme__list li::before { left: 2px; top: calc(12px + .9em - 4px); width: 8px; height: 8px; }
#wmPage .wmPhilTheme__list li:last-child { border-bottom: 0; }
/* 和モダン（2026-10-30 肱岡さん判断）: テーマは 1 列の縦並び。PC は札の左にテーマ名、右に項目 */
@media (min-width: 761px) {
  #wmPage .wmPhilTheme { display: grid; grid-template-columns: 220px minmax(0, 1fr); column-gap: 40px; align-items: start; padding: 32px 40px; }
  #wmPage .wmPhilTheme__title { padding: 0; border-bottom: 0; font-size: 22px; }
  #wmPage .wmPhilTheme__title::before { font-size: 15px; }
  #wmPage .wmPhilTheme__list { margin: -12px 0 0; }
}
@media (max-width: 760px) {
  #wmPage .wmPhil__lead { font-size: 15px; }
  #wmPage .wmPhilThemes { --wm-phil-gap: 16px; }
  #wmPage .wmPhilTheme { padding: 24px 20px 16px; }
  #wmPage .wmPhilTheme__title { font-size: 19px; }
  #wmPage .wmPhilTheme__list li { padding: 11px 0 11px 22px; }
  #wmPage .wmPhilTheme__list li::before { top: calc(11px + .9em - 4px); }
}

/* ── おすすめ寿司学校（/customervoice）和モダン（2026-10-30）────────────────────
   リストの札は「検定について」の #recommendationCont の規則（/certification と同じ見た目）。
   ここでは .wmSchoolsPage でだけ、partial の見出し（.introBox）を見出し帯（.wmPageHead と同じ形）にする。
   /certification の見た目は変えない（このページの main にしか .wmSchoolsPage は無い）。 */
#wmPage.wmSchoolsPage #recommendationCont { padding: 0 0 112px; }
#wmPage.wmSchoolsPage #recommendationCont .introBox { max-width: none; margin: 0 0 64px; padding: 72px max(24px, calc((100% - 1032px) / 2)) 60px; background: var(--wm-paper-2); text-align: left; }
#wmPage.wmSchoolsPage #recommendationCont .introBox h2 { font-size: clamp(30px, 3vw, 40px); text-align: left; }
@media (max-width: 760px) {
  #wmPage.wmSchoolsPage #recommendationCont { padding-bottom: 72px; }
  #wmPage.wmSchoolsPage #recommendationCont .introBox { margin-bottom: 40px; padding: 44px 20px 40px; }
  #wmPage.wmSchoolsPage #recommendationCont .introBox h2 { font-size: 28px; }
  html:lang(en) #wmPage.wmSchoolsPage #recommendationCont .introBox h2,
  html:lang(es) #wmPage.wmSchoolsPage #recommendationCont .introBox h2 { font-size: 26px; }
}

/* ── 入口 4 ページの共通（/select, /select-u, /select-s, /select-r）和モダン（2026-10-30）─
   旧: 桃色の帯の赤い見出しと、影付きの白い箱 2 つ（赤と緑のボタン）。→ 見出し帯と、朱の上罫の白い札 2 枚。
   札の上の英字（FIRST TIME など）は data-eyebrow。ボタンは札の下端にそろえる。
   4 ページとも旧からフッターが無いので、紙の地が画面の下まで届くよう高さを取る。 */
#wmPage.wmEntryPage { min-height: 100vh; box-sizing: border-box; }
#wmPage .wmEntry { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
#wmPage .wmEntry__card { display: flex; flex-direction: column; padding: 32px 40px 40px; background: #fff; border: 1px solid var(--wm-line); border-top: 2px solid var(--wm-shu); }
#wmPage .wmEntry__card::before { margin-bottom: 8px; }
#wmPage .wmEntry__title { margin: 0; color: var(--wm-ink); font: 700 24px/1.5 var(--wm-mincho); letter-spacing: .06em; text-align: left; }
#wmPage .wmEntry__text { margin: 14px 0 32px; color: var(--wm-ink); font-size: 16px; line-height: 1.9; }
#wmPage .wmEntry__card .wmBtn { margin-top: auto; }
/* /select-r の誘い文句（トップの採用の節と同じ文）: 見出しの下に明朝で */
#wmPage .wmPageHead .ownerLead { margin-top: 14px; font: 500 19px/1.8 var(--wm-mincho); }
html:lang(en) #wmPage .wmEntry__title, html:lang(es) #wmPage .wmEntry__title { letter-spacing: .02em; }
@media (max-width: 760px) {
  #wmPage .wmEntry { grid-template-columns: 1fr; gap: 16px; }
  #wmPage .wmEntry__card { padding: 24px 20px 24px; }
  #wmPage .wmEntry__title { font-size: 21px; }
  #wmPage .wmEntry__text { margin: 10px 0 24px; font-size: 15px; }
  #wmPage .wmPageHead .ownerLead { font-size: 16px; }
}

/* ── お問い合わせ（/contact）和モダン（2026-10-30）────────────────────────────
   旧: 白い箱の中に赤い見出し・14px の表（項目名 30% と入力欄の横並び）。→ 見出し帯と、1 列の白い札。
   項目名を上・入力欄を下に積み、入力欄は 16px（スマホで拡大されない大きさ）で広く取る。
   見出しの小さな「contact」は文字のまま、英字の小見出しの形にして見出しの上へ（並べ替えは flex の向きだけ）。 */
#wmPage .wmContact__title { display: flex; flex-direction: column-reverse; }
#wmPage .wmContact__title span { display: block; margin: 0 0 14px; color: var(--wm-shu); font: 500 13px/1.6 var(--wm-gothic); letter-spacing: .3em; text-transform: uppercase; }
#wmPage .wmContact { max-width: 760px; margin: 0 auto; padding: 40px 48px 44px; box-sizing: border-box; }
#wmPage .wmContact .ta1,
#wmPage .wmContact .ta1 tbody,
#wmPage .wmContact .ta1 tr,
#wmPage .wmContact .ta1 th,
#wmPage .wmContact .ta1 td { display: block; width: auto; margin: 0; padding: 0; border: 0; background: none; }
#wmPage .wmContact .ta1 tr + tr { margin-top: 24px; }
#wmPage .wmContact .ta1 th { padding: 0 0 8px; color: var(--wm-ink); font: 700 15px/1.6 var(--wm-gothic); letter-spacing: .06em; text-align: left; }
#wmPage .wmContact input.ws,
#wmPage .wmContact textarea.wl { display: block; width: 100%; max-width: none; margin: 0; padding: 12px 14px; box-sizing: border-box; border: 1px solid #CFC6B6; border-radius: 0; background: var(--wm-paper); color: var(--wm-ink); font: 400 16px/1.7 var(--wm-gothic); box-shadow: none; }
#wmPage .wmContact textarea.wl { min-height: 220px; resize: vertical; }
#wmPage .wmContact input.ws:focus,
#wmPage .wmContact textarea.wl:focus { border-color: var(--wm-ink); outline: 2px solid rgba(230, 0, 18, .25); outline-offset: 0; background: #fff; }
#wmPage .wmContact__submit { margin: 36px 0 0; text-align: center; }
#wmPage .wmContact__submit .wmBtn { display: inline-flex !important; min-width: 240px; }
@media (max-width: 760px) {
  #wmPage .wmContact { padding: 24px 20px 28px; }
  #wmPage .wmContact .ta1 tr + tr { margin-top: 20px; }
  #wmPage .wmContact__submit { margin-top: 28px; }
  #wmPage .wmContact__submit .wmBtn { display: flex !important; width: 100%; min-width: 0; }
}

/* ── よくある質問（/question）和モダン（2026-10-30）────────────────────────────
   旧: main.test の箱の中で見出しが固定ヘッダーの下に潜っていた。→ 見出し帯から始め、本文は 860px の 1 列。
   分類の見出しは明朝 + 墨の下罫（旧の朱のラベルの絵は残す）。質問は白い札を 8px 空けて重ね、
   Q. と +/− は styles.css の ::before / ::after の文字のまま（形だけ整える）。開閉は <details> のまま。
   #wmPage の ul/ol の list-style:none で消える手順の番号（.faq__steps）は decimal に戻す。 */
#wmPage .faq__body { max-width: 860px; }
#wmPage .faq__body .cTitle { display: flex; align-items: center; gap: 10px; margin: 56px 0 16px; padding: 0 0 12px; border-bottom: 1px solid var(--wm-ink); color: var(--wm-ink); font: 700 22px/1.5 var(--wm-mincho); letter-spacing: .06em; text-align: left; }
#wmPage .faq__body .cTitle:first-child { margin-top: 0; }
#wmPage .faq__body .cTitle .iconImage { flex: none; display: block; width: 20px; height: auto; margin: 0; }
#wmPage .faq__item { margin: 0; background: #fff; border: 1px solid var(--wm-line); }
#wmPage .faq__item + .faq__item { margin-top: 8px; }
#wmPage .faq__item > summary { position: relative; padding: 18px 56px; text-indent: 0; color: var(--wm-ink); font: 700 16px/1.7 var(--wm-gothic); letter-spacing: .02em; transition: background-color .15s; }
#wmPage .faq__item > summary::before { position: absolute; left: 20px; top: 18px; margin: 0; color: var(--wm-shu); font: 700 18px/1.5 var(--wm-mincho); }
#wmPage .faq__item > summary::after { right: 20px; color: var(--wm-shu); font: 400 24px/1 var(--wm-gothic); }
#wmPage .faq__item > summary:hover { background: var(--wm-paper); }
#wmPage .faq__item > summary:focus-visible { outline: 2px solid var(--wm-shu); outline-offset: -2px; }
#wmPage .faq__item[open] > summary { border-bottom: 1px dashed var(--wm-line); }
#wmPage .faq__answer { padding: 16px 24px 20px 56px; color: var(--wm-ink); font-size: 15px; line-height: 1.9; }
#wmPage .faq__answer p + p, #wmPage .faq__answer ul + p, #wmPage .faq__answer ol + p { margin-top: 8px; }
#wmPage .faq__answer a { color: var(--wm-shu); text-decoration: underline; text-underline-offset: .25em; }
#wmPage .faq__answer .addItems { margin: 0 0 10px; padding-left: 1.5em !important; }
#wmPage .faq__answer .addItems li { margin: 6px 0; }
#wmPage .faq__steps { margin: 0; padding-left: 1.8em; list-style: decimal; }
#wmPage .faq__steps li { margin: 2px 0; padding-left: .2em; }
#wmPage .faq__steps li::marker { color: var(--wm-shu); font-weight: 700; }
@media (max-width: 760px) {
  #wmPage .faq__body .cTitle { margin-top: 40px; font-size: 19px; }
  #wmPage .faq__item > summary { padding: 15px 44px 15px 42px; font-size: 15px; }
  #wmPage .faq__item > summary::before { left: 14px; top: 15px; font-size: 17px; }
  #wmPage .faq__item > summary::after { right: 14px; }
  #wmPage .faq__answer { padding: 14px 16px 18px 42px; font-size: 15px; }
}

/* ── 規約類 3 ページの共通（/use, /privacy, /notation）和モダン（2026-10-30）─────────
   旧: 灰色の地の白い箱（inview でぼかしから出す）、赤い 27px の見出し、下線の小見出し、桃色の見出しセルの表。
   → 760px の読みやすい 1 列。本文はゴシック 16px・行間 1.9、見出しは明朝。
   見出し帯は作らず、最初の h3 を英字の小見出し付きのページ見出しにする（/use の h3 は partial の中なので）。
   条・項の番号（(1)・1.・1) など）と ul の点は styles.css の .privacy / .privacy.use の ::before（counter）が
   描いているので、クラスは残して位置と色だけ整える（字下げをそろえるため ::before を左に寄せる）。
   表は横罫だけで行間を広く。スマホは項目名を上・値を下に積む（協会の声「表が詰まっていて読みにくい」）。 */
#wmPage .wmDoc { max-width: 760px; margin: 0 auto; background: none; color: var(--wm-ink); font-size: 16px; line-height: 1.9; overflow-wrap: anywhere; }
#wmPage .wmDoc::before { margin-bottom: 10px; }
#wmPage .wmDoc > h3 { margin: 88px 0 24px; padding: 0 0 16px; border-bottom: 1px solid var(--wm-ink); color: var(--wm-ink); font: 700 28px/1.5 var(--wm-mincho); letter-spacing: .06em; text-align: left; word-break: auto-phrase; text-wrap: balance; }
#wmPage .wmDoc > h3:first-of-type { margin-top: 0; padding-bottom: 20px; font-size: clamp(30px, 3vw, 40px); }
#wmPage .wmDoc h4 { margin: 48px 0 14px; padding: 0 0 0 14px; border-left: 3px solid var(--wm-shu); color: var(--wm-ink); font: 700 20px/1.6 var(--wm-mincho); letter-spacing: .04em; text-decoration: none; }
#wmPage .wmDoc > h3 + h4 { margin-top: 32px; }
#wmPage .wmDoc h5 { margin: 28px 0 8px; padding: 0; color: var(--wm-ink); font: 700 17px/1.6 var(--wm-mincho); letter-spacing: .03em; }
#wmPage .wmDoc h4 + h5 { margin-top: 16px; }
#wmPage .wmDoc p { margin: 0 0 16px; padding: 0; text-align: left; line-height: 1.9; }
#wmPage .wmDoc ol, #wmPage .wmDoc ul { margin: 0 0 16px; padding: 0; }
#wmPage .wmDoc li { position: relative; margin: 6px 0; line-height: 1.9; }
#wmPage .wmDoc ol > li { padding-left: 2.4em; }
#wmPage .wmDoc ol > li::before { position: absolute; left: 0; top: 0; color: var(--wm-mute); font-weight: 700; }
#wmPage .wmDoc ul > li { padding-left: 20px; }
#wmPage .wmDoc ul > li::before { left: 4px; top: calc(.95em - 3px); width: 6px; height: 6px; background: var(--wm-shu); }
html:lang(en) #wmPage .wmDoc h4, html:lang(es) #wmPage .wmDoc h4,
html:lang(en) #wmPage .wmDoc > h3, html:lang(es) #wmPage .wmDoc > h3 { letter-spacing: .01em; }
/* 表: 墨の上罫、行は細い横罫。項目名は淡色の太字で左 34% */
#wmPage .wmDoc table { width: 100%; margin: 8px 0 28px; border: 0; border-top: 1px solid var(--wm-ink); border-collapse: collapse; table-layout: fixed; }
/* 行（tr）の罫は styles.css のスマホ用の規則が引くので消し、罫はセルだけで引く */
#wmPage .wmDoc tr { margin: 0; padding: 0; border: 0; background: none; }
#wmPage .wmDoc th,
#wmPage .wmDoc td { padding: 16px 0; border: 0; border-bottom: 1px solid var(--wm-line); background: none; color: var(--wm-ink); font-size: 15px; font-weight: 400; line-height: 1.8; text-align: left; vertical-align: top; }
#wmPage .wmDoc th { width: 34%; padding-right: 24px; color: var(--wm-mute); font-weight: 700; font-size: 14px; letter-spacing: .04em; }
/* rowspan の続きの行（項目名の無い、td 1 つだけの行）は 1 つの値のまとまりとして、間の罫を消して詰める
   （:has の入れ子は書けないので、続きの行は td:only-child で見分ける） */
#wmPage .wmDoc tr:has(+ tr > td:only-child) > td { padding-bottom: 2px; border-bottom: 0; }
#wmPage .wmDoc tr > td:only-child { padding-top: 2px; }
@media (max-width: 760px) {
  #wmPage .wmDoc { font-size: 15px; }
  #wmPage .wmDoc > h3 { margin-top: 64px; font-size: 22px; }
  #wmPage .wmDoc > h3:first-of-type { font-size: 28px; }
  html:lang(en) #wmPage .wmDoc > h3:first-of-type, html:lang(es) #wmPage .wmDoc > h3:first-of-type { font-size: 26px; }
  #wmPage .wmDoc h4 { margin-top: 40px; font-size: 18px; }
  #wmPage .wmDoc h5 { font-size: 16px; }
  /* 表は項目名を上、値を下に積む（390 幅で横にはみ出さない） */
  #wmPage .wmDoc table,
  #wmPage .wmDoc tbody,
  #wmPage .wmDoc tr,
  #wmPage .wmDoc th,
  #wmPage .wmDoc td { display: block; width: auto; }
  #wmPage .wmDoc colgroup { display: none; }
  #wmPage .wmDoc th { padding: 14px 0 2px; border-bottom: 0; font-size: 13px; }
  #wmPage .wmDoc td { padding: 0 0 14px; }
}

/* ── 利用規約（/use）和モダン（2026-10-30）── 2 つ目の h3（採用サービス利用規約）は節の大見出し（共通の > h3 のまま）。 */

/* ── プライバシーポリシー（/privacy）和モダン（2026-10-30）── 途中の h3 2 つ・表 5 つは共通の規則のまま。 */

/* ── 特定商取引法に基づく表記（/notation）和モダン（2026-10-30）──
   表 1 つだけのページ。旧の列幅（.notations .colName 25%）より項目名を少し広く */
#wmPage .notations table { margin-top: 0; }
/* 見出しの墨の下罫と表の墨の上罫が二重にならないよう、見出しの直後の表は上罫を消す */
#wmPage .wmDoc > h3 + table { border-top: 0; }
#wmPage .notations .colName { width: 30%; }
#wmPage .notations .colValue { width: 70%; }

/* ── お知らせ（/newsinfo）和モダン（2026-11-02）────────────────────────────────
   旧: main の中の .blur（inview でぼかしから出す演出）が解除されず、見出しと本文がぼやけたまま。
   見出しは 1280px で左寄せ・他の幅で中央、本文は 768px で左端に張り付いていた。
   → 他の下層ページと同じ 見出し帯（.wmPageHead）+ 本文の節。行は墨の上罫と細い横罫（規約類の表と同じ形）。
   お知らせが少ないとフッターの下に白い帯（body の地）が出ていたので、紙の地を画面の下まで伸ばし、
   余った高さは本文の節が受け持つ（フッターは常に画面の下端）。 */
#wmPage.wmNewsPage { display: flex; flex-direction: column; min-height: 100vh; box-sizing: border-box; }
#wmPage.wmNewsPage > .wmNews { flex: 1 0 auto; }
#wmPage .news-list { margin: 0; padding: 0; border-top: 1px solid var(--wm-ink); }
#wmPage .news-list__item { border-bottom: 1px solid var(--wm-line); }
#wmPage .news-list__link { padding: 20px 4px; color: var(--wm-ink); }
#wmPage .news-list__link:hover { color: var(--wm-shu); }
#wmPage .news-list__link:focus-visible { outline: 2px solid var(--wm-shu); outline-offset: 2px; }
#wmPage .news-list__date { color: var(--wm-mute); font-size: 14px; letter-spacing: .04em; }
#wmPage .news-list__title { font: 700 17px/1.7 var(--wm-mincho); letter-spacing: .04em; }
#wmPage .news-list__empty { padding: 24px 4px; color: var(--wm-mute); font-size: 15px; }
#wmPage .news-pager__link { color: var(--wm-shu); font-weight: 700; }
@media (max-width: 760px) {
  #wmPage .news-list__link { padding: 16px 0; }
  /* 日付を上、題を下に積む（日付と並べると題が画面の半分ほどの幅で細切れになる） */
  #wmPage .news-list__title { flex-basis: 100%; font-size: 16px; }
}

/* ── ログイン・新規登録（/login, /register ほか .loginSection の画面。旧の形のまま、2026-11-02）────────
   - 新規登録の「すでにアカウントをお持ちの方 ログイン」: .log_err の中央寄せが、styles.css の
     `main section p:not(.c)…`（左寄せ）に負けて画面の左端に張り付いていた（ログインは style 属性で中央にしていた）
   - 項目名の列: 表の 20%（1280px で 110px ほど）では「ログイン状態を／保持」「パスワード（確／認）」と折れ、
     行の高さも広いので 2 段に離れて見えた。→ 列を 14em（左右の余白込み。日本語の最長「パスワード（確認）」が 168px）に広げ、
     折れたときも行間を詰める（項目名と値を横に並べる 900px〜だけ。es の長い項目名は 2 行になる） */
#container .loginSection .log_err p { text-align: center; }
@media (min-width: 900px) {
  #container .loginSection .ta3 th { width: 14em; line-height: 1.6; }
}

/* ── 日本語の改行（和モダンのページ全体、2026-11-02）────────────────────────────
   文末の 1〜2 文字（「い。」「ー」など）だけが次の行に落ちていた。日本語のときだけ、文節の途中で折らない（auto-phrase）・
   段落の最後の行を短くしすぎない（pretty）、見出しは行の長さをそろえる（balance）。
   main に掛けて子に受け継がせる（:where で ID の詳細度は足さない）ので、個別に word-break を決めている所
   （理事の名前の keep-all・表など）はそのまま。
   word-break: auto-phrase は日本語にしか効かないので、他の言語の折り返しは変わらない。 */
html:lang(ja) :where(#wmHome, #wmPage) { word-break: auto-phrase; text-wrap-style: pretty; }
html:lang(ja) :where(#wmHome, #wmPage) :where(h2, h3, h4) { text-wrap: balance; }