@charset "UTF-8";
/* ==========================================================================
   ERABI STUDIO
   要件定義書 §5 デザインコンセプト（Editorial / Calm / Trustworthy / Minimal）
   §6 禁止デザイン（派手なグラデ・大量CTA・赤黄ボタン・No.1強調・星の乱用 等）
   §7 ブランドカラー  §13 記事デザイン（本文680〜760px / 16〜18px / 行間1.8）
   書体は端末標準のゴシック。Webフォントは読み込まない。
   ========================================================================== */

:root{
  /* 色 */
  --navy:#18364D;
  --navy-deep:#12293B;
  --beige:#D9C3A0;
  --beige-ink:#9A7B3F;   /* 白地に小さな文字で置くときの、同系の濃い方 */
  --bg:#FAF9F6;
  --white:#FFFFFF;
  --ink:#222222;
  --muted:#6B6B6B;
  --line:#E8E5DF;
  --line-strong:#D8D3CB;

  /* 書体（要件定義書 §55）：英数字 Inter ／ 和文 Noto Sans JP の2ファミリー。
     Interを先に置くのは、英数字だけをInterに担わせ、和文はNotoに落とすため。
     Interは和文グリフを持たないので、日本語は自動でNoto Sans JPになる。 */
  --font:"Inter","Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN",
         "Yu Gothic Medium","Yu Gothic","BIZ UDPGothic",Meiryo,sans-serif;

  /* 級数 */
  --fs-xs:12px; --fs-sm:13px; --fs-base:15px; --fs-body:17px; --fs-md:18px;
  --fs-lg:20px; --fs-xl:25px; --fs-2xl:32px; --fs-3xl:40px;

  /* 行送り */
  --lh-tight:1.5; --lh-snug:1.7; --lh-body:1.85;

  /* 寸法 */
  --container:1200px;
  --article:720px;   /* 本文幅（要件定義書 §13・§73） */
  --radius:4px;        /* --radius-small */
  --radius-md:8px;     /* --radius-medium */
  --gap:24px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--font);font-size:var(--fs-body);line-height:var(--lh-body);
  font-weight:400;
  overflow-wrap:break-word;word-break:normal;line-break:strict;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-weight:700;line-height:var(--lh-tight);margin:0}
p,ul,ol,figure,table{margin:0}
button{font:inherit;color:inherit}

.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed;top:8px;left:8px;width:auto;height:auto;clip:auto;background:var(--navy);color:#fff;padding:10px 16px;z-index:200}

/* ── レイアウト ─────────────────────────────────────────── */
.l-container{max-width:var(--container);margin:0 auto;padding:0 24px 72px}
.l-card{background:var(--white);border-radius:var(--radius);padding:32px;margin-top:24px}
.l-main{display:block}

/* ── ヘッダー ───────────────────────────────────────────── */
.l-header{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:100}
.l-header__inner{max-width:var(--container);margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:24px}
.l-header__brand{flex:0 0 auto}
.l-header__logo img{width:auto;height:42px}
.l-nav{margin-left:auto;display:flex;align-items:center;gap:28px}
.l-nav__list{list-style:none;margin:0;padding:0;display:flex;gap:34px}
.l-nav__list a{font-size:var(--fs-sm);letter-spacing:.10em;font-weight:700;color:var(--navy)}
.l-nav__list a:hover{text-decoration:none;opacity:.65}
.l-nav__search .search-form{display:flex;align-items:center;gap:6px}
.l-nav__search label{margin:0}
.l-nav__search .search-field{
  border:1px solid var(--line-strong);border-radius:999px;padding:7px 14px;
  font-size:var(--fs-sm);width:150px;background:var(--bg)}
.l-nav__search .search-submit{
  border:0;background:var(--navy);color:#fff;border-radius:999px;
  padding:8px 14px;font-size:var(--fs-xs);cursor:pointer}
.l-header__toggle{display:none;border:0;background:transparent;padding:8px;cursor:pointer;margin-left:auto}
.l-header__bar{display:block;width:22px;height:2px;background:var(--navy);margin:5px 0;transition:transform .2s,opacity .2s}

/* ── パーツ ─────────────────────────────────────────────── */
.c-eyebrow{font-size:var(--fs-xs);letter-spacing:.16em;font-weight:700;color:var(--muted);margin:0 0 14px}
.c-sechead{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:22px}
.c-sechead__eyebrow{font-size:var(--fs-xs);letter-spacing:.16em;font-weight:700;color:var(--muted)}
.c-sechead__more{font-size:var(--fs-sm);color:var(--navy)}
.c-sechead__more span{margin-left:8px}

.c-btn{
  display:inline-flex;align-items:center;gap:12px;
  background:var(--navy);color:#fff;padding:14px 26px;border-radius:2px;
  font-size:var(--fs-base);font-weight:700;letter-spacing:.04em}
.c-btn:hover{background:var(--navy-deep);text-decoration:none;color:#fff}
.c-more{display:inline-flex;align-items:center;gap:10px;font-size:var(--fs-sm);font-weight:700;letter-spacing:.08em;color:var(--navy)}
.c-tag{display:inline-block;font-size:var(--fs-xs);font-weight:700;color:var(--navy);
  background:rgba(217,195,160,.28);padding:5px 12px;border-radius:2px}
.c-tag:hover{text-decoration:none;background:rgba(217,195,160,.5)}

.c-grid{display:grid;gap:28px}
.c-grid--3{grid-template-columns:repeat(3,1fr)}
.c-grid--4{grid-template-columns:repeat(4,1fr)}

/* カード：角丸ほぼなし・影なし・枠なし。写真とタイポで見せる */
.c-card__link{display:block;color:inherit}
.c-card__link:hover{text-decoration:none}
.c-card__link:hover .c-card__title{text-decoration:underline}
.c-card__thumb img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:2px}
.c-card__thumb--empty{display:block;width:100%;aspect-ratio:3/2;background:var(--line);border-radius:2px}
.c-card__body{padding-top:14px}
.c-card__cat{display:block;font-size:var(--fs-xs);color:var(--muted);margin-bottom:7px}
.c-card__title{font-size:var(--fs-base);line-height:1.65;margin:0 0 10px;color:var(--navy)}
.c-card__excerpt{font-size:var(--fs-sm);color:var(--muted);line-height:var(--lh-snug);margin:0 0 10px}
.c-card__date{font-size:var(--fs-xs);color:var(--muted)}

.c-tile{position:relative;display:block;border-radius:2px;overflow:hidden}
.c-tile img{width:100%;aspect-ratio:4/3;object-fit:cover}
.c-tile::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(18,41,59,.82) 0%,rgba(18,41,59,.25) 45%,rgba(18,41,59,0) 70%)}
.c-tile__label{position:absolute;left:16px;right:16px;bottom:14px;z-index:1;
  color:#fff;font-size:var(--fs-sm);font-weight:700;line-height:1.55}
.c-tile:hover{text-decoration:none}

.c-issues{list-style:none;margin:0;padding:0}
.c-issues__item a{display:flex;align-items:center;justify-content:space-between;
  padding:15px 4px;border-bottom:1px solid var(--line);font-size:var(--fs-base);color:var(--navy)}
.c-issues__item:first-child a{border-top:1px solid var(--line)}
.c-issues__item a:hover{text-decoration:none;background:var(--bg);padding-left:10px}
.c-issues__chev{color:var(--muted)}

.c-breadcrumbs{padding:18px 0 4px;font-size:var(--fs-xs);color:var(--muted)}
.c-breadcrumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.c-breadcrumbs li+li::before{content:"›";margin-right:8px;color:var(--line-strong)}
.c-breadcrumbs a{color:var(--muted)}

.c-pagination{margin-top:28px;text-align:center}
.c-pagination .page-numbers{display:inline-block;min-width:40px;padding:9px 12px;margin:0 3px;
  background:var(--white);border-radius:2px;font-size:var(--fs-sm);color:var(--navy)}
.c-pagination .current{background:var(--navy);color:#fff}

/* ── HERO ───────────────────────────────────────────────── */
.p-hero{position:relative;background:var(--navy-deep);min-height:420px;display:flex;align-items:center;
  background-image:var(--hero);background-size:cover;background-position:center}
.p-hero::before{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(250,249,246,.96) 0%,rgba(250,249,246,.88) 30%,rgba(250,249,246,.35) 58%,rgba(250,249,246,0) 78%)}
.p-hero--noimg::before{background:linear-gradient(100deg,rgba(250,249,246,.98),rgba(250,249,246,.9))}
.p-hero__inner{position:relative;max-width:var(--container);margin:0 auto;padding:74px 24px;width:100%}
.p-hero__title{font-size:var(--fs-2xl);line-height:1.55;color:var(--navy);letter-spacing:.02em}
.p-hero__lead{margin:22px 0 30px;font-size:var(--fs-base);line-height:var(--lh-body);color:var(--ink);max-width:34em}

/* ── FEATURE ────────────────────────────────────────────── */
.p-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:40px;align-items:center;margin-top:32px}
.p-feature__title{font-size:var(--fs-xl);line-height:1.55;margin:0 0 16px}
.p-feature__title a{color:var(--navy)}
.p-feature__meta{font-size:var(--fs-xs);color:var(--muted);margin:0 0 16px}
.p-feature__excerpt{font-size:var(--fs-sm);color:var(--muted);line-height:var(--lh-body);margin:0 0 22px}
.p-feature__thumb img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:2px}

/* ── LATEST ＋ ISSUES ───────────────────────────────────── */
.p-latest{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
.p-latest__main,.p-latest__side{margin-top:24px}
.p-issues__lead{font-size:var(--fs-sm);color:var(--muted);margin:0 0 14px}

/* ── ABOUT ──────────────────────────────────────────────── */
.p-about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.p-about__text{font-size:var(--fs-base);line-height:var(--lh-body);margin:0 0 26px}
.p-about__thumb{background:var(--bg);border-radius:2px;min-height:220px}

/* ── 記事 ───────────────────────────────────────────────── */
.p-article{max-width:calc(var(--article) + 96px);margin-left:auto;margin-right:auto;padding:40px 48px 48px}
.p-article__head{margin-bottom:34px}
.p-article__title{font-size:var(--fs-2xl);line-height:1.5;margin:18px 0 0;color:var(--navy)}
.p-article__lead{margin:20px 0 0;font-size:var(--fs-md);line-height:var(--lh-body);color:var(--muted)}
.p-article__hero{margin:28px 0 0}
.p-article__hero img{width:100%;border-radius:2px}
.p-article__meta{display:flex;flex-wrap:wrap;gap:18px;margin-top:22px;padding-top:18px;
  border-top:1px solid var(--line);font-size:var(--fs-xs);color:var(--muted)}

.p-article__body{max-width:var(--article);font-size:var(--fs-body);line-height:var(--lh-body)}
.p-article__body>*+*{margin-top:1.6em}
.p-article__body h2{font-size:var(--fs-xl);margin-top:2.6em;margin-bottom:.9em;
  padding-bottom:.5em;border-bottom:1px solid var(--line);color:var(--navy)}
.p-article__body h3{font-size:var(--fs-lg);margin-top:2em;margin-bottom:.7em;color:var(--navy)}
.p-article__body h4{font-size:var(--fs-md);margin-top:1.8em;margin-bottom:.6em}
.p-article__body ul,.p-article__body ol{padding-left:1.4em}
.p-article__body li+li{margin-top:.5em}
.p-article__body figcaption{font-size:var(--fs-xs);color:var(--muted);margin-top:.7em;text-align:left}
.p-article__body blockquote{margin:0;padding:20px 24px;background:var(--bg);border-radius:2px;
  font-size:var(--fs-base);color:var(--muted)}
.p-article__body a{text-decoration:underline;text-underline-offset:3px}
.p-article__body strong{font-weight:700}

/* 表：横スクロールで逃がす */
.p-article__body figure.wp-block-table{overflow-x:auto}
.p-article__body table{border-collapse:collapse;width:100%;font-size:var(--fs-base)}
.p-article__body th,.p-article__body td{border:1px solid var(--line);padding:12px 14px;text-align:left;vertical-align:top}
.p-article__body th{background:var(--bg);font-weight:700;white-space:nowrap}

.p-article__sources,.p-article__credit,.p-article__author{
  max-width:var(--article);margin-top:44px;padding-top:26px;border-top:1px solid var(--line);
  font-size:var(--fs-base);color:var(--muted)}
.p-article__sources h2,.p-article__credit h2,.p-article__author h2{
  font-size:var(--fs-md);color:var(--ink);margin-bottom:12px}
.p-article__sources p+p,.p-article__credit p+p,.p-article__author p+p{margin-top:10px}
.p-article__authorname{font-weight:700;color:var(--ink)}

/* ── ブロックスタイル（要件定義書 §25。装飾は雑誌的に抑制する） ── */
.p-article__body .is-style-erabi-point,
.p-article__body .is-style-erabi-caution,
.p-article__body .is-style-erabi-editor,
.p-article__body .is-style-erabi-sources,
.p-article__body .is-style-erabi-cta{padding:24px 26px;border-radius:2px}
.is-style-erabi-point{background:var(--bg);border:1px solid var(--line)}
.is-style-erabi-point h3{margin-top:0!important;font-size:var(--fs-md)!important}
.is-style-erabi-caution{background:#FBF7F1;border:1px solid var(--beige)}
.is-style-erabi-editor{background:var(--bg);border-left:3px solid var(--beige)}
.is-style-erabi-sources{background:var(--bg);font-size:var(--fs-base)}
.is-style-erabi-cta{background:var(--navy);color:#fff}
.is-style-erabi-cta a{color:#fff}
.is-style-erabi-merit,.is-style-erabi-demerit{list-style:none;padding-left:0}
.is-style-erabi-merit li,.is-style-erabi-demerit li{padding-left:1.6em;position:relative}
.is-style-erabi-merit li::before{content:"＋";position:absolute;left:0;color:var(--navy);font-weight:700}
.is-style-erabi-demerit li::before{content:"−";position:absolute;left:0;color:var(--muted);font-weight:700}
.is-style-erabi-compare th{position:sticky;left:0}

/* ── アーカイブ・固定ページ ─────────────────────────────── */
.p-archive__head{padding:26px 0 4px}
.p-archive__title{font-size:var(--fs-xl);color:var(--navy)}
.p-archive__desc{margin-top:12px;font-size:var(--fs-base);color:var(--muted);max-width:46em}
.p-page{max-width:calc(var(--article) + 96px);margin-left:auto;margin-right:auto;padding:40px 48px 48px}
.p-page__title{font-size:var(--fs-2xl);line-height:1.5;color:var(--navy);margin-bottom:28px}
.p-404{text-align:center}
.p-404 .c-btn{margin-top:20px}

/* ── フッター ───────────────────────────────────────────── */
.l-footer{background:var(--navy);color:#fff;padding:56px 0 26px;margin-top:40px}
.l-footer__inner{max-width:var(--container);margin:0 auto;padding:0 24px;
  display:grid;grid-template-columns:repeat(3,1fr) 1.2fr;gap:36px}
.l-footer__head{font-size:var(--fs-sm);letter-spacing:.06em;margin-bottom:16px;color:#fff}
.l-footer__list{list-style:none;margin:0;padding:0}
.l-footer__list li+li{margin-top:11px}
.l-footer__list a{color:rgba(255,255,255,.82);font-size:var(--fs-sm)}
.l-footer__list a:hover{color:#fff}
.l-footer__logo img{width:auto;height:38px}
.l-footer__tagline{margin-top:14px;font-size:var(--fs-xs);color:rgba(255,255,255,.72)}
.l-footer__copy{max-width:var(--container);margin:44px auto 0;padding:20px 24px 0;
  border-top:1px solid rgba(255,255,255,.18);text-align:center;
  font-size:var(--fs-xs);color:rgba(255,255,255,.6)}

/* ── タブレット ─────────────────────────────────────────── */
@media (max-width:1024px){
  .p-latest{grid-template-columns:1fr}
  .c-grid--4{grid-template-columns:repeat(2,1fr)}
  .l-footer__inner{grid-template-columns:repeat(2,1fr)}
}

/* ── スマートフォン（Mobile First の確認用ブレイク） ────── */
@media (max-width:782px){
  :root{--fs-body:16px;--fs-2xl:25px;--fs-xl:20px;--fs-lg:18px}

  .l-header__inner{padding:12px 18px}
  .l-header__logo img{height:34px}
  .l-header__toggle{display:block}
  .l-nav{position:fixed;inset:56px 0 0;background:var(--white);margin:0;
    flex-direction:column;align-items:stretch;gap:0;padding:12px 20px 40px;
    transform:translateY(-8px);opacity:0;visibility:hidden;transition:.18s;overflow-y:auto}
  .l-nav.is-open{transform:none;opacity:1;visibility:visible}
  .l-nav__list{flex-direction:column;gap:0}
  .l-nav__list li{border-bottom:1px solid var(--line)}
  .l-nav__list a{display:block;padding:17px 4px;font-size:var(--fs-base)}
  .l-nav__search{margin-top:20px}
  .l-nav__search .search-field{width:100%}
  .is-nav-open{overflow:hidden}
  .l-header__toggle[aria-expanded="true"] .l-header__bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .l-header__toggle[aria-expanded="true"] .l-header__bar:nth-child(2){opacity:0}
  .l-header__toggle[aria-expanded="true"] .l-header__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .l-container{padding:0 16px 56px}
  .l-card{padding:22px 18px;margin-top:16px}
  .p-hero{min-height:0}
  .p-hero::before{background:linear-gradient(180deg,rgba(250,249,246,.95) 0%,rgba(250,249,246,.9) 55%,rgba(250,249,246,.86) 100%)}
  .p-hero__inner{padding:44px 18px}
  .c-grid--3,.c-grid--4{grid-template-columns:1fr;gap:26px}
  .p-feature,.p-about{grid-template-columns:1fr;gap:22px}
  .p-feature__thumb{order:-1}
  .p-article,.p-page{padding:24px 18px 32px;max-width:none}
  .p-article__body,.p-article__sources,.p-article__credit,.p-article__author{max-width:none}
  .p-article__meta{gap:12px}
  .l-footer__inner{grid-template-columns:1fr;gap:28px}
  .l-footer{padding:40px 0 20px}
}

/* ── ロゴ（画像＝シンボル＋ワードマーク／タグライン＝テキスト） ── */
.l-header__brand{display:flex;flex-direction:column;justify-content:center;gap:3px}
.l-header__logo{display:block;line-height:0}
.l-header__logo__img{width:auto;height:30px}
.l-header__logo__tagline{font-size:10px;letter-spacing:.04em;color:var(--muted);margin:0;line-height:1.2}
.l-footer__brand{display:flex;flex-direction:column;gap:10px}
.l-footer__logo{display:block;line-height:0}
.l-footer__logo__img{width:auto;height:30px}
.l-footer__logo__tagline{font-size:var(--fs-xs);color:rgba(255,255,255,.72);margin:0}

/* ── ヘッダー検索：アイコン＋トグル ── */
.l-nav__search{position:relative}
.l-nav__searchbtn{display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;
  cursor:pointer;color:var(--navy);font-size:var(--fs-sm);letter-spacing:.08em;font-weight:700;padding:6px 2px}
.l-nav__searchbtn:hover{opacity:.65}
.l-nav__searchbox{position:absolute;right:0;top:calc(100% + 12px);background:var(--white);
  border:1px solid var(--line);border-radius:2px;padding:12px;width:280px;z-index:10}
.l-nav__searchbox .search-form{display:flex;gap:8px}
.l-nav__searchbox .search-field{flex:1;min-width:0;border:1px solid var(--line-strong);border-radius:2px;
  padding:9px 12px;font-size:var(--fs-sm);background:var(--white)}
.l-nav__searchbox .search-submit{border:0;background:var(--navy);color:#fff;border-radius:2px;
  padding:9px 14px;font-size:var(--fs-xs);cursor:pointer;white-space:nowrap}

/* ── ABOUTの写真 ── */
.p-about__thumb{background:var(--bg);border-radius:2px;min-height:220px;overflow:hidden}
.p-about__thumb img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/10}

@media (max-width:782px){
  .l-header__logo__img{height:26px}
  .l-header__logo__tagline{font-size:9px}
  .l-nav__search{position:static}
  .l-nav__searchbox{position:static;width:auto;border:0;padding:0;display:block!important}
  .l-nav__searchbtn{display:none}
}

/* ==========================================================================
   固定ページ・一覧の「扉」
   TOP以外が白い箱に本文だけで、雑誌の体裁になっていなかったので作り足す。
   ========================================================================== */
.p-pagehead{padding:44px 0 34px;border-bottom:1px solid var(--line);margin-bottom:8px}
.p-pagehead__eyebrow{font-size:var(--fs-xs);letter-spacing:.18em;font-weight:700;color:var(--beige-ink);margin:0 0 14px}
.p-pagehead__title{font-size:var(--fs-2xl);line-height:1.45;color:var(--navy);letter-spacing:.01em}
.p-pagehead__lead{margin:18px 0 0;font-size:var(--fs-base);line-height:var(--lh-body);color:var(--muted);max-width:44em}

/* 扉を入れたので、固定ページの見出しは本文側に譲る */
.p-page{padding:44px 48px 48px}
.p-page__title{display:none}
.p-page .p-article__body>*:first-child{margin-top:0}
.p-page .p-article__body h2:first-child{margin-top:0}

/* 運営に関するページの回遊 */
.c-policynav{max-width:var(--article);margin:52px auto 0;padding:24px 26px;background:var(--bg);border-radius:2px}
.c-policynav__head{font-size:var(--fs-xs);letter-spacing:.14em;font-weight:700;color:var(--muted);margin:0 0 12px}
.c-policynav ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:2px 24px}
.c-policynav li a{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 2px;font-size:var(--fs-base);color:var(--navy);border-bottom:1px solid var(--line)}
.c-policynav li a:hover{text-decoration:none;color:var(--navy-deep);padding-left:6px}
.c-policynav li a span{color:var(--line-strong)}

/* ISSUES ページ：カテゴリーをカードで並べる */
.c-issuegrid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:24px}
.c-issuecard{display:block;background:var(--white);border-radius:var(--radius);padding:30px 32px 26px;
  border-top:3px solid var(--beige);color:inherit}
.c-issuecard:hover{text-decoration:none;border-top-color:var(--navy)}
.c-issuecard__no{display:block;font-size:var(--fs-xl);font-weight:700;color:var(--line-strong);line-height:1;margin-bottom:14px}
.c-issuecard__title{font-size:var(--fs-lg);color:var(--navy);margin:0 0 12px}
.c-issuecard__desc{font-size:var(--fs-sm);color:var(--muted);line-height:var(--lh-snug);margin:0 0 18px}
.c-issuecard__more{font-size:var(--fs-sm);font-weight:700;color:var(--navy);display:inline-flex;gap:8px;align-items:center}

/* 記事が無いときの表示 */
.c-empty{max-width:520px;margin:0 auto;padding:20px 0 8px;text-align:left}
.c-empty__msg{font-size:var(--fs-md);font-weight:700;color:var(--navy);margin:0 0 6px;text-align:center}
.c-empty__sub{font-size:var(--fs-sm);color:var(--muted);margin:0 0 20px;text-align:center}

.p-archive__search{max-width:var(--article);margin:20px auto 0}
.p-archive__search .search-form{display:flex;gap:8px}
.p-archive__search .search-field{flex:1;border:1px solid var(--line-strong);border-radius:2px;padding:11px 14px;font-size:var(--fs-base)}
.p-archive__search .search-submit{border:0;background:var(--navy);color:#fff;border-radius:2px;padding:11px 20px;cursor:pointer}

/* ==========================================================================
   フッター：SPで縦に伸びすぎるので2カラムに畳む
   ========================================================================== */
@media (max-width:782px){
  .l-footer{padding:36px 0 18px;margin-top:28px}
  .l-footer__inner{grid-template-columns:repeat(2,1fr);gap:26px 20px;padding:0 18px}
  .l-footer__head{font-size:var(--fs-xs);letter-spacing:.1em;margin-bottom:12px;color:rgba(255,255,255,.68)}
  .l-footer__list li+li{margin-top:9px}
  .l-footer__list a{font-size:var(--fs-xs);line-height:1.6}
  .l-footer__brand{grid-column:1 / -1;order:-1;padding-bottom:20px;
    border-bottom:1px solid rgba(255,255,255,.16);margin-bottom:4px}
  .l-footer__logo__img{height:28px}
  .l-footer__copy{margin-top:26px;padding-top:16px}

  .p-pagehead{padding:26px 0 22px}
  .p-page{padding:24px 18px 32px}
  .c-policynav{margin-top:34px;padding:18px 16px}
  .c-policynav ul{grid-template-columns:1fr}
  .c-issuegrid{grid-template-columns:1fr;gap:14px}
  .c-issuecard{padding:22px 20px 20px}
}

@media (max-width:1024px){
  .c-issuegrid{grid-template-columns:repeat(2,1fr)}
}

/* ── 著者情報（記事末尾） ── */
.c-author{display:flex;gap:20px;align-items:flex-start}
.c-author__photo{width:88px;height:88px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.c-author__body{min-width:0}
.c-author__name{font-size:var(--fs-md);font-weight:700;color:var(--ink);margin:0 0 4px}
.c-author__role{font-size:var(--fs-sm);color:var(--muted);margin:0 0 10px;line-height:var(--lh-snug)}
.c-author__link a{font-size:var(--fs-sm);font-weight:700;display:inline-flex;gap:8px;align-items:center}
@media (max-width:782px){
  .c-author{gap:14px}
  .c-author__photo{width:66px;height:66px}
}

/* ── 著者カード（著者ページ本文内） ──
   顔写真は小さく、名前の左に置く。右寄せにすると装飾に見え、
   記事末尾の著者ブロックとも並びが揃わないため、左で統一する。
   グループブロックは環境により .wp-block-group__inner-container を1枚挟むので、
   両方をflexにし、内側に付く自動マージンを打ち消す。 */
.p-article__body .c-authorcard{margin-top:1.2em!important;padding:0}
.p-article__body .c-authorcard,
.p-article__body .c-authorcard > .wp-block-group__inner-container{
  display:flex;gap:20px;align-items:center;width:100%;
  margin-left:0!important;margin-right:0!important;max-width:none!important}
.p-article__body .c-authorcard figure{margin:0!important;flex:0 0 auto;width:88px;max-width:88px!important}
.p-article__body .c-authorcard figure img{width:88px;height:88px;object-fit:cover;border-radius:50%;display:block}
.p-article__body .c-authorcard .c-authorcard__body{min-width:0;flex:1 1 auto;
  margin-left:0!important;margin-right:0!important;max-width:none!important}
.p-article__body .c-authorcard .c-authorcard__body>.wp-block-group__inner-container{
  margin-left:0!important;margin-right:0!important;max-width:none!important}
.p-article__body .c-authorcard p{margin:0!important;font-size:var(--fs-sm);color:var(--muted);line-height:var(--lh-snug)}
.p-article__body .c-authorcard p+p{margin-top:5px!important}
.p-article__body .c-authorcard p.c-authorcard__name{font-size:var(--fs-md);font-weight:700;color:var(--ink)}
@media (max-width:782px){
  .p-article__body .c-authorcard,
  .p-article__body .c-authorcard > .wp-block-group__inner-container{gap:14px}
  .p-article__body .c-authorcard figure{width:72px;max-width:72px!important}
  .p-article__body .c-authorcard figure img{width:72px;height:72px}
}

/* ==========================================================================
   SPのFV：白かぶりの強さ
   実測（写真A-2を390×380にcover配置し、文字が乗る帯の全画素で判定）
     初版      平均α 0.93/0.91 → 写真がほぼ見えない
     薄くした版 平均α 0.66/0.59 → 写真は見えるが文字が読みにくいとの指摘
     採用       平均α 0.81/0.76 → 上記2つのほぼ中間
   判定基準：タイトル(#18364D・大きな文字)3.0:1／リード(#222)4.5:1
   採用値での不足画素は0%、最悪のコントラスト比は タイトル7.7:1・リード7.8:1・
   ボタン周辺5.5:1。下部の白は0.54で、写真が残る。
   ========================================================================== */
@media (max-width:782px){
  .p-hero{min-height:380px}
  .p-hero__inner{padding:40px 18px 58px}
  .p-hero::before{
    background:linear-gradient(180deg,
      rgba(250,249,246,.85) 0%,
      rgba(250,249,246,.78) 42%,
      rgba(250,249,246,.70) 64%,
      rgba(250,249,246,.56) 84%,
      rgba(250,249,246,.48) 100%)}
  .p-hero__title{letter-spacing:.01em}
}

/* ==========================================================================
   フッターの見出しを「リンクではない」と分かる形にする
   これまで見出しがリンクより暗く小さく、押せないリンクのように見えていた。
   色をベージュ（リンク色ではない）に変え、下に細い罫を引いて見出しだと示す。
   ========================================================================== */
.l-footer__head{
  font-size:var(--fs-xs);letter-spacing:.14em;font-weight:700;
  color:var(--beige);
  margin:0 0 14px;padding-bottom:10px;
  border-bottom:1px solid rgba(217,195,160,.32)}
/* リンク側は白でしっかり見せ、指で押せる高さを確保する */
.l-footer__list a{
  display:inline-block;color:rgba(255,255,255,.88);
  font-size:var(--fs-sm);line-height:1.6;padding:4px 0}
.l-footer__list a:hover{color:#fff;text-decoration:underline}
.l-footer__list li+li{margin-top:6px}

/* ABOUTに写真が無いときは1カラムにして、空の灰色枠を出さない */
.p-about--noimg{grid-template-columns:1fr}
.p-about--noimg .p-about__body{max-width:46em}

@media (max-width:782px){
  .l-footer__head{font-size:var(--fs-xs);color:var(--beige);
    margin-bottom:12px;padding-bottom:8px;
    border-bottom:1px solid rgba(217,195,160,.32)}
  .l-footer__list a{padding:7px 0;font-size:var(--fs-sm)}
  .l-footer__list li+li{margin-top:2px}
}

/* ==========================================================================
   §26 ブレークポイントの再定義
     Desktop   1200px 以上
     Tablet     768〜1199px
     Smartphone 767px 以下
   これまで 1024 / 782 で切っていたものを、設計書の数値に合わせる。
   既存の @media(max-width:1024px) / (max-width:782px) は残したまま、
   ここで上書きする（後勝ち）。
   ========================================================================== */

/* ── Tablet：768〜1199px ── */
@media (min-width:768px) and (max-width:1199px){
  .l-container{padding-left:28px;padding-right:28px}
  .p-latest{grid-template-columns:1fr}          /* ISSUESは下に回す */
  .c-grid--3{grid-template-columns:repeat(2,1fr)}
  .c-grid--4{grid-template-columns:repeat(2,1fr)}
  .p-feature{grid-template-columns:1fr;gap:24px}
  .p-feature__thumb{order:-1}
  .p-about{grid-template-columns:1fr;gap:24px}
  .l-footer__inner{grid-template-columns:repeat(2,1fr);gap:32px 28px}
  .l-footer__brand{grid-column:1 / -1;order:-1;padding-bottom:22px;
    border-bottom:1px solid rgba(255,255,255,.16)}
  .c-issuegrid{grid-template-columns:repeat(2,1fr)}
  .p-article,.p-page{max-width:none;padding:36px 32px 40px}
  .l-nav__list{gap:24px}
}

/* ── Smartphone：767px 以下 ── */
@media (max-width:767px){
  :root{--fs-body:16px;--fs-2xl:25px;--fs-xl:20px;--fs-lg:18px}
  .l-header__toggle{display:block}
  .l-nav{position:fixed;inset:56px 0 0;background:var(--white);margin:0;
    flex-direction:column;align-items:stretch;gap:0;padding:12px 20px 40px;
    transform:translateY(-8px);opacity:0;visibility:hidden;transition:.18s;overflow-y:auto}
  .l-nav.is-open{transform:none;opacity:1;visibility:visible}
  .l-nav__list{flex-direction:column;gap:0}
  .c-grid--3,.c-grid--4{grid-template-columns:1fr;gap:26px}
  .p-latest{grid-template-columns:1fr}
  .p-feature,.p-about{grid-template-columns:1fr;gap:22px}
  .c-issuegrid{grid-template-columns:1fr}
  .l-footer__inner{grid-template-columns:repeat(2,1fr)}
}
/* 768〜782px でSP用の指定が残らないようにする */
@media (min-width:768px) and (max-width:782px){
  .l-header__toggle{display:none}
  .l-nav{position:static;inset:auto;background:transparent;flex-direction:row;
    align-items:center;gap:28px;padding:0;transform:none;opacity:1;visibility:visible;overflow:visible}
  .l-nav__list{flex-direction:row;gap:24px}
  .l-nav__list li{border-bottom:0}
  .l-nav__list a{display:inline-block;padding:6px 0;font-size:var(--fs-sm)}
  .l-nav__searchbtn{display:inline-flex}
  .l-nav__search{position:relative}
  .l-nav__searchbox{position:absolute;right:0;top:calc(100% + 12px);width:280px;
    border:1px solid var(--line);padding:12px;display:none!important}
  .l-nav__searchbox[hidden]{display:none!important}
}

/* ==========================================================================
   §26 タップ領域 44px 以上／§60 フォーカスの可視化
   ========================================================================== */
@media (max-width:1199px){
  .l-nav__list a{min-height:44px;display:flex;align-items:center}
  .l-footer__list a{min-height:44px;display:flex;align-items:center;padding:0}
  .c-issues__item a{min-height:44px}
  .c-card__link{display:block}
  .c-sechead__more,.c-more{min-height:44px;display:inline-flex;align-items:center}
  .c-breadcrumbs a{display:inline-block;padding:6px 0}
  .l-header__toggle{min-width:44px;min-height:44px}
  .c-btn{min-height:48px}
}

/* フォーカスはキーボード操作のときだけ出す */
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid var(--navy);outline-offset:3px;border-radius:2px}
.l-footer a:focus-visible,.l-nav__searchbox .search-submit:focus-visible,
.is-style-erabi-cta a:focus-visible{outline-color:var(--beige)}

/* 記事0件のときの「最新記事」ブロック（§31） */
.c-empty__latest{margin-top:36px;padding-top:28px;border-top:1px solid var(--line)}

/* ==========================================================================
   §55 ウェイトは Regular(400) / Medium(500) / Bold(700) の3つだけ
   本文=400、見出し・強調=700、ラベルなど中間の強さが要る箇所のみ500。
   ========================================================================== */
.c-eyebrow,.c-sechead__eyebrow,.p-pagehead__eyebrow,
.c-card__cat,.c-card__date,.p-article__meta{font-weight:500}
/* 和文の字面を少し詰めて、Noto Sans JPの間延びを抑える */
body{font-feature-settings:"palt" 1}

/* ── 著者アーカイブ（§32） ── */
.p-author{display:flex;gap:24px;align-items:flex-start;
  padding-bottom:26px;border-bottom:1px solid var(--line);margin-bottom:8px}
.p-author__photo{width:112px;height:112px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.p-author__name{font-size:var(--fs-lg);font-weight:700;color:var(--ink);margin:0 0 6px}
.p-author__role{font-size:var(--fs-sm);color:var(--muted);margin:0 0 12px}
.p-author__bio{font-size:var(--fs-base);line-height:var(--lh-body);margin:0 0 12px}
.p-author__links a{font-size:var(--fs-sm);font-weight:700;display:inline-flex;gap:8px;align-items:center;margin-right:18px}
.p-author__sec{margin-top:30px}
.p-author__sec h2{font-size:var(--fs-md);color:var(--navy);margin:0 0 12px;
  padding-bottom:8px;border-bottom:1px solid var(--line)}
.p-author__sec ul{margin:0;padding-left:1.3em;font-size:var(--fs-base);line-height:var(--lh-body)}
.p-author__sec li+li{margin-top:6px}
.p-author__sec p{font-size:var(--fs-base);line-height:var(--lh-body)}
@media (max-width:767px){
  .p-author{flex-direction:column;gap:16px}
  .p-author__photo{width:88px;height:88px}
}
