/*
Theme Name: Made in Japan
Theme URI: https://lbp.social-create.net/
Author: LBP
Description: 日本から始まる仕事・物・サービス・出来事を深掘る日本語ニュースキュレーションメディア用テーマ。オリジナル記事、公的機関の発表（RSS取り込み）、無料会員（記事の保存・ニュースレター受信希望）、タブ付き検索を備えます。プラグイン不要。
Version: 1.2.1
Requires at least: 6.4
Tested up to: 7.2
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: madeinjapan
Tags: news, blog, two-columns, right-sidebar, custom-colors, custom-logo, custom-menu, featured-images
*/

/* ---------- Tokens ---------- */
:root {
	--accent: #C8352B;
	--ink: #111111;
	--text: #222222;
	--sub: #5F5F5F;
	--line: #E5E5E5;
	--line-strong: #DADADA;
	--soft: #F5F5F3;
	--ph: #ECECEC;
	--bg: #ffffff;
	--radius: 6px;
	--wrap: 1240px;
	--sans: 'Noto Sans JP', system-ui, -apple-system, 'Hiragino Sans', 'Yu Gothic', sans-serif;
	--serif: 'Noto Serif JP', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
	--header-h: 64px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html.is-locked { overflow: hidden; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: 15px; line-height: 1.7; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--accent); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
h1, h2, h3, h4 { line-height: 1.45; margin: 0; }
p { margin: 0; }
button { font-family: inherit; }
.u-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.u-hp { position: absolute; left: -9999px; }
.u-center { text-align: center; }
.skip-link { position: absolute; left: -9999px; top: 8px; background: var(--ink); color: #fff; padding: 8px 12px; z-index: 100; }
.skip-link:focus { left: 8px; color: #fff; }

.l-wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.l-narrow { max-width: 720px; margin: 0 auto; padding: 40px 24px 80px; }
.l-main { display: flex; flex-wrap: wrap; gap: 40px; align-items: flex-start; padding-top: 24px; padding-bottom: 72px; }
.l-content { flex: 999 1 600px; min-width: 0; display: flex; flex-direction: column; gap: 40px; }
.sidebar { flex: 1 1 260px; min-width: 0; max-width: 320px; display: flex; flex-direction: column; gap: 28px; }

/* ---------- Buttons / chips ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 8px 18px; border-radius: var(--radius); border: 1px solid transparent; font-size: 14px; font-weight: 700; cursor: pointer; line-height: 1.3; text-align: center; }
.btn--sm { min-height: 36px; padding: 6px 14px; font-size: 13px; }
.btn--lg { min-height: 52px; font-size: 15px; }
.btn--block { display: flex; width: 100%; }
.btn--accent { background: var(--accent); color: #fff; }
.btn--accent:hover { color: #fff; filter: brightness(0.92); }
.btn--ink { background: var(--ink); color: #fff; }
.btn--ink:hover { color: #fff; background: #333; }
.btn--line { background: #fff; border-color: var(--line-strong); color: var(--ink); }
.btn--line:hover { border-color: var(--ink); color: var(--ink); }
.chip { display: inline-block; font-size: 11px; font-weight: 700; border: 1px solid var(--ink); border-radius: 999px; padding: 2px 10px; }
.icon-btn { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; color: var(--ink); cursor: pointer; border-radius: var(--radius); }
.avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--ink); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; flex: none; }
.avatar:hover { color: #fff; }
.avatar--lg { width: 64px; height: 64px; font-size: 24px; }
.kicker { font-size: 12px; font-weight: 700; letter-spacing: 0.04em; color: var(--accent); }
.kicker--ink { color: var(--ink); }
.badge { display: inline-block; font-size: 10px; font-weight: 700; background: var(--ink); color: #fff; padding: 1px 6px; }
.meta { font-size: 12px; color: var(--sub); }
.tag { font-size: 12px; border: 1px solid var(--ink); border-radius: 999px; padding: 4px 12px; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--line); }
.admin-bar .site-header { top: 32px; }
.site-header__bar { min-height: var(--header-h); display: flex; align-items: center; gap: 24px; }
.logo { display: inline-flex; align-items: center; gap: 8px; font-family: var(--serif); font-weight: 700; font-size: 22px; color: var(--ink); white-space: nowrap; }
.logo__dot { width: 12px; height: 12px; border-radius: 50%; background: var(--accent); }
.custom-logo-link img { max-height: 40px; width: auto; }
.gnav { flex: 1 1 auto; min-width: 0; }
.gnav__list, .gnav ul.menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: nowrap; gap: 4px 16px; font-size: 14px; font-weight: 500; white-space: nowrap; }
.gnav a[aria-current="page"] { color: var(--accent); }
.gnav__drop { position: relative; }
.gnav details > summary { list-style: none; cursor: pointer; }
.gnav details > summary::-webkit-details-marker { display: none; }
.gnav details > summary::after { content: ' ▾'; font-size: 11px; }
.gnav__sub { position: absolute; top: calc(100% + 10px); left: -12px; min-width: 200px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 8px 24px rgba(0,0,0,.08); list-style: none; margin: 0; padding: 8px 0; z-index: 60; }
.gnav__sub a { display: block; padding: 8px 16px; font-size: 13px; }
.gnav__sub a:hover { background: var(--soft); }
.gnav .sub-menu { display: none; }
.site-header__tools { display: flex; align-items: center; gap: 10px; flex: none; }
.hsearch__box { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line-strong); border-radius: var(--radius); padding: 0 10px; height: 38px; width: 190px; color: var(--sub); background: #fff; }
.hsearch__box input { border: 0; outline: none; font: inherit; font-size: 13px; width: 100%; min-width: 0; color: var(--ink); background: transparent; }
.hsearch__box--wide { width: 100%; height: 46px; border-color: var(--ink); }
.hsearch__box--wide input { font-size: 15px; }
.sp-search { border-top: 1px solid var(--line); padding: 10px 0; }
.cat-tabs { border-top: 1px solid transparent; }
.cat-tabs__inner { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 10px; scrollbar-width: none; }
.cat-tabs__inner::-webkit-scrollbar { display: none; }
.cat-tab { flex: none; font-size: 13px; padding: 6px 14px; border-radius: 999px; background: #F2F2F2; color: var(--ink); white-space: nowrap; }
.cat-tab[aria-current="page"] { background: var(--accent); color: #fff; font-weight: 700; }
.u-sp-nav { display: none; }

/* ---------- Section heads ---------- */
.section { display: flex; flex-direction: column; }
.section--rule { border-top: 2px solid var(--ink); padding-top: 14px; }
.sec-head { margin-bottom: 14px; }
.sec-head__title { font-size: 20px; font-weight: 700; }
.sec-head__title a span { color: var(--sub); }

/* ---------- Cards ---------- */
.card__img, .card-list__img img, .card-list__img .is-placeholder { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 3px; background: var(--ph); }
.is-placeholder { display: flex; align-items: center; justify-content: center; background: var(--ph); color: var(--sub); font-size: 12px; font-weight: 700; aspect-ratio: 16 / 10; border-radius: 3px; }
.card-list { display: flex; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.card-list__body { flex: 1; min-width: 0; }
.card-list__title { font-size: 15px; font-weight: 700; line-height: 1.55; margin: 2px 0 6px; }
.card-list__side { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 6px; flex: none; width: 140px; }
.card-list__img { display: block; width: 100%; }
.card-grid { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.card-grid__img { display: block; margin-bottom: 4px; }
.card-grid__title { font-size: 14px; font-weight: 700; line-height: 1.55; }
.card-mini { display: flex; gap: 10px; align-items: flex-start; }
.card-mini__img { width: 64px; height: 64px; object-fit: cover; flex: none; border-radius: 3px; aspect-ratio: 1; }
.card-mini .is-placeholder.card-mini__img { font-size: 10px; }
.card-mini__title { display: block; font-size: 14px; line-height: 1.5; }
.card-exec { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.card-exec img, .card-exec .is-placeholder { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; border-radius: 0; }
.card-exec__body { padding: 12px; display: flex; flex-direction: column; gap: 6px; }
.card-exec__title { font-size: 14px; line-height: 1.5; }
.save-btn { background: none; border: 0; padding: 8px; margin: -8px; cursor: pointer; color: var(--sub); min-width: 36px; min-height: 36px; display: inline-flex; align-items: center; justify-content: center; }
.save-btn[aria-pressed="true"] { color: var(--accent); }
.save-btn--pill { margin: 0; gap: 6px; font-size: 13px; font-weight: 700; color: var(--ink); border: 1px solid var(--ink); border-radius: 999px; padding: 8px 16px; min-height: 40px; }
.save-btn--pill[aria-pressed="true"] { border-color: var(--accent); color: var(--accent); }

.list-2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }

/* ---------- Home ---------- */
.top-story__head { display: flex; justify-content: space-between; margin-bottom: 10px; }
.top-story__grid { display: flex; flex-wrap: wrap; gap: 24px; }
.top-story__text { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.top-story__title { font-size: 28px; line-height: 1.4; }
.top-story__lead { font-size: 14px; line-height: 1.8; color: #333; }
.top-story__img { flex: 1 1 360px; min-width: 0; }
.top-story__img img, .top-story__img .is-placeholder { aspect-ratio: 16 / 10; width: 100%; object-fit: cover; border-radius: 4px; }
.top-story__subs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; border-top: 1px solid var(--line); padding-top: 16px; margin-top: 20px; }
.member-banner { background: var(--ink); color: #fff; border-radius: var(--radius); padding: 22px 28px; display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; }
.member-banner__title { font-family: var(--serif); font-size: 20px; font-weight: 700; }
.member-banner__text { font-size: 13px; color: #D0D0D0; margin-top: 4px; }
.feature-block { display: flex; flex-wrap: wrap; gap: 20px; }
.feature-block__hero { flex: 1 1 300px; background: var(--ink); color: #fff; border-radius: var(--radius); min-height: 260px; padding: 24px; display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; }
.feature-block__hero:hover { color: #fff; }
.feature-block__kicker, .feature-block__count { font-size: 12px; color: #D0D0D0; }
.feature-block__title { font-family: var(--serif); font-size: 24px; font-weight: 700; line-height: 1.4; }
.feature-block__list { flex: 1 1 320px; min-width: 0; }
.empty-state { padding: 32px 0; color: var(--sub); }
.empty-state h1 { color: var(--ink); font-size: 22px; margin-bottom: 8px; }
.empty-state--box { border: 1px dashed #BDBDBD; border-radius: var(--radius); padding: 32px 20px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.empty-state__title { color: var(--ink); font-weight: 700; font-size: 16px; }

/* ---------- Sidebar ---------- */
.side-box__title { font-size: 14px; font-weight: 700; margin-bottom: 6px; }
.rank { list-style: none; margin: 0; padding: 0; }
.rank__item { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.55; }
.rank__n { font-family: var(--serif); font-size: 20px; font-weight: 700; color: var(--accent); width: 20px; flex: none; line-height: 1.2; }
.person { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.person__img { width: 40px !important; height: 40px; border-radius: 50%; object-fit: cover; flex: none; aspect-ratio: 1; font-size: 9px; }
.person__text { display: flex; flex-direction: column; font-size: 13px; line-height: 1.5; }
.person__text small { color: var(--sub); font-size: 11px; }
.side-box--cta { border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; text-align: center; font-size: 13px; line-height: 1.7; display: flex; flex-direction: column; gap: 10px; }
.side-box__login { font-size: 12px; text-decoration: underline; }

/* ---------- Article ---------- */
.article-hero { background: var(--soft); }
.article-hero__inner { display: flex; flex-wrap: wrap; gap: 40px; align-items: center; padding-top: 44px; padding-bottom: 44px; }
.article-hero__text { flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.article-hero__title { font-family: var(--serif); font-size: 34px; line-height: 1.5; }
.article-hero__img { flex: 1 1 480px; margin: 0; min-width: 0; }
.article-hero__img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 4px; }
.breadcrumb { font-size: 12px; color: var(--sub); }
.breadcrumb a { color: var(--sub); }
.l-main--article { padding-top: 40px; }
.share-rail { flex: none; width: 56px; position: sticky; top: calc(var(--header-h) + 60px); }
.share { display: flex; gap: 10px; align-items: center; }
.share--column { flex-direction: column; }
.share__label { font-size: 11px; color: var(--sub); }
.share__btn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-strong); background: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: var(--ink); cursor: pointer; }
.share__btn.is-done { border-color: var(--accent); color: var(--accent); }
.share-inline { display: none; }
.article { flex: 999 1 560px; min-width: 0; max-width: 720px; display: flex; flex-direction: column; gap: 18px; }
.article__lead { font-size: 16px; line-height: 2; font-weight: 500; }
.article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; justify-content: space-between; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 12px 0; }
.toc { background: var(--soft); border-radius: 4px; padding: 20px 24px; }
.toc__title { font-size: 14px; font-weight: 700; margin-bottom: 6px; }
.toc ol { list-style: none; margin: 0; padding: 0; }
.toc a { display: flex; gap: 14px; padding: 8px 0; font-size: 14px; border-top: 1px solid var(--line); }
.toc b { color: var(--accent); font-style: italic; }
.entry { font-size: 16px; line-height: 2; color: var(--text); overflow-wrap: anywhere; }
.entry > * + * { margin-top: 1.5em; }
.entry h2 { font-family: var(--serif); font-size: 24px; line-height: 1.5; margin-top: 2.4em; padding-top: 18px; position: relative; scroll-margin-top: 140px; }
.entry h2::before { content: ''; position: absolute; top: 0; left: 0; width: 40px; height: 2px; background: var(--ink); }
.entry h3 { font-size: 19px; margin-top: 2em; }
.entry a { color: var(--accent); text-decoration: underline; }
.entry img { border-radius: 4px; }
.entry figcaption, .entry .wp-element-caption { font-size: 12px; color: var(--sub); margin-top: 8px; }
.entry blockquote { background: var(--soft); border-radius: 4px; margin: 1.5em 0; padding: 24px 28px; border: 0; }
.entry blockquote p { font-family: var(--serif); font-size: 18px; line-height: 1.9; }
.entry blockquote cite { display: block; font-size: 12px; color: var(--sub); font-style: normal; margin-top: 8px; }
.entry ul, .entry ol { padding-left: 1.4em; }
.entry table { border-collapse: collapse; width: 100%; display: block; overflow-x: auto; }
.entry th, .entry td { border: 1px solid var(--line); padding: 8px 12px; font-size: 14px; }
.company { border: 1px solid var(--line-strong); border-radius: var(--radius); padding: 24px; margin-top: 16px; }
.company__title { font-size: 16px; margin-bottom: 16px; }
.company__body { display: flex; flex-wrap: wrap; gap: 24px; }
.company__img { flex: 0 0 200px; width: 200px; aspect-ratio: 10 / 7; object-fit: cover; border-radius: 4px; }
.company__dl { flex: 1 1 280px; margin: 0; display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 8px 12px; font-size: 13px; }
.company__dl dt { color: var(--sub); }
.company__dl dd { margin: 0; overflow-wrap: anywhere; }
.series { background: var(--soft); border-radius: 4px; padding: 20px 24px; display: flex; flex-direction: column; gap: 6px; }
.series__title { font-size: 15px; }
.series a { font-size: 14px; text-decoration: underline; }
.writer__head { font-size: 16px; letter-spacing: 0.06em; padding-bottom: 8px; border-bottom: 2px solid var(--ink); }
.writer__body { display: flex; gap: 20px; padding: 20px 0; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.8; }
.writer__img { border-radius: 50%; flex: none; width: 88px; height: 88px; }
.writer__name { font-size: 15px; font-weight: 700; }
.writer__bio { color: #333; margin: 4px 0; }
.writer__more { font-size: 12px; text-decoration: underline; }

/* ---------- Pickup ---------- */
.pickup { gap: 22px; max-width: 760px; }
.pickup__head { display: flex; gap: 20px; align-items: flex-start; }
.pickup__img { flex: none; width: 120px; }
.pickup__img img, .pickup__img .is-placeholder { width: 120px; height: 120px; object-fit: cover; border-radius: var(--radius); aspect-ratio: 1; }
.pickup__title { font-size: 26px; line-height: 1.5; margin: 10px 0 8px; }
.pickup__head .meta a { color: var(--sub); text-decoration: underline; overflow-wrap: anywhere; }
.pickup__summary { border-top: 2px solid var(--ink); padding-top: 16px; }
.pickup__summary h2 { font-size: 15px; margin-bottom: 8px; }
.pickup__summary ul { margin: 0; padding-left: 20px; font-size: 15px; line-height: 1.9; }
.pickup__comment { background: var(--soft); border-radius: var(--radius); padding: 18px 20px; display: flex; gap: 14px; }
.pickup__comment h2 { font-size: 13px; margin-bottom: 4px; }
.pickup__comment p { font-size: 14px; line-height: 1.85; }
.pickup__badge { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--ink); color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.pickup__go svg { flex: none; }
.pickup__credit { font-size: 12px; color: var(--sub); line-height: 1.8; }
.pickup__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); padding-top: 16px; }
.plain-list { list-style: none; margin: 0; padding: 0; }
.plain-list a { display: flex; flex-direction: column; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; line-height: 1.5; }

/* ---------- Archive / search ---------- */
.archive-head { display: flex; flex-direction: column; gap: 6px; padding-bottom: 16px; border-bottom: 2px solid var(--ink); }
.archive-head__title { font-size: 26px; }
.archive-head__desc { font-size: 14px; color: #333; }
.archive-head--feature { background: var(--ink); color: #fff; border-radius: var(--radius); padding: 28px; border: 0; }
.archive-head--feature .kicker { color: #D0D0D0; }
.archive-head--feature .archive-head__title { font-family: var(--serif); font-size: 30px; }
.archive-head--feature .archive-head__desc { color: #E0E0E0; }
.list { display: flex; flex-direction: column; }
.pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 24px; }
.pager .page-numbers { min-width: 40px; height: 40px; padding: 0 12px; border-radius: var(--radius); border: 1px solid var(--line-strong); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
.pager .current { background: var(--ink); color: #fff; border-color: var(--ink); }
.pager .dots { border: 0; }
.l-main--search .l-content { gap: 16px; }
.search-big { display: flex; gap: 8px; }
.search-big .btn { flex: none; }
.search-title { font-size: 22px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tabs__item { flex: none; font-size: 14px; padding: 12px 16px; color: var(--sub); border-bottom: 2px solid transparent; white-space: nowrap; }
.tabs__item small { font-size: 11px; }
.tabs__item[aria-current="page"] { color: var(--ink); font-weight: 700; border-bottom-color: var(--ink); }
.filters { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: var(--sub); }
.filters label { display: flex; align-items: center; gap: 6px; }
.filters select { font: inherit; font-size: 13px; color: var(--ink); border: 1px solid var(--line-strong); border-radius: var(--radius); padding: 8px 10px; background: #fff; min-height: 38px; }
.feature-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.search-layout { display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start; }
.search-layout__main { flex: 999 1 560px; min-width: 0; }
.search-layout__side { flex: 1 1 280px; min-width: 0; max-width: 340px; display: flex; flex-direction: column; gap: 4px; }
.company-row { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.6; }
.company-row span { display: flex; flex-direction: column; }
.company-row small { color: var(--sub); }
.company-row em { font-style: normal; font-size: 12px; font-weight: 700; color: var(--accent); }
.company-row__img { width: 44px !important; height: 44px; border-radius: var(--radius); object-fit: cover; flex: none; aspect-ratio: 1; }

/* ---------- Forms / member pages ---------- */
.page-title { font-size: 28px; margin-bottom: 24px; }
.auth { display: flex; flex-direction: column; gap: 18px; max-width: 460px; margin: 0 auto; }
.auth__title { font-size: 26px; font-family: var(--serif); }
.auth__merits { margin: 0; padding: 14px 18px 14px 34px; background: var(--soft); border-radius: var(--radius); font-size: 14px; }
.auth__links { font-size: 13px; text-align: center; }
.auth__links a { text-decoration: underline; }
.auth__alt { border-top: 1px solid var(--line); padding-top: 18px; display: flex; flex-direction: column; gap: 8px; font-size: 13px; color: var(--sub); text-align: center; }
.form { display: flex; flex-direction: column; gap: 14px; }
.form__row { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 700; }
.form__row input { font: inherit; font-size: 16px; font-weight: 400; padding: 10px 12px; min-height: 46px; border: 1px solid var(--line-strong); border-radius: var(--radius); }
.form__row input:focus { border-color: var(--ink); }
.form__check { font-size: 14px; }
.form__check label { display: flex; gap: 8px; align-items: flex-start; }
.form__check input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--accent); }
.form__check a { text-decoration: underline; }
.notice { padding: 12px 14px; border-radius: var(--radius); font-size: 14px; }
.notice--error { background: #FDECEA; color: #8A1C12; }
.notice--success { background: #EAF5EC; color: #1E5A2B; }
.mypage { display: flex; flex-direction: column; gap: 24px; }
.mypage__head { display: flex; align-items: center; gap: 16px; }
.mypage__name { font-size: 22px; }
.mypage__card { display: flex; align-items: center; gap: 14px; border: 1px solid var(--line-strong); border-radius: var(--radius); padding: 16px 18px; }
.mypage__card span:nth-child(2) { flex: 1; display: flex; flex-direction: column; }
.mypage__card small { color: var(--sub); }
.mypage__links { flex-direction: row; gap: 20px; font-size: 13px; }
.mypage__links a { text-decoration: underline; color: var(--sub); }
.page-body { display: flex; flex-direction: column; }

/* ---------- Footer ---------- */
.site-footer { background: var(--ink); color: #fff; margin-top: 40px; }
.site-footer a { color: #C8C8C8; }
.site-footer a:hover { color: #fff; }
.site-footer__inner { display: flex; flex-wrap: wrap; gap: 40px; padding-top: 48px; padding-bottom: 28px; }
.site-footer__brand { flex: 1 1 240px; }
.site-footer__brand p { font-size: 12px; color: #C8C8C8; line-height: 1.8; margin-top: 10px; }
.logo--invert, .site-footer .logo { color: #fff; }
.site-footer__col { flex: 1 1 160px; display: flex; flex-direction: column; gap: 2px; }
.site-footer__col h2 { font-size: 13px; margin-bottom: 8px; }
.site-footer__col a { font-size: 12px; padding: 4px 0; }
.site-footer__copy { font-size: 11px; color: #A8A8A8; border-top: 1px solid #333; padding-top: 16px; padding-bottom: 28px; }

/* ---------- Drawer ---------- */
.drawer { position: fixed; inset: 0; z-index: 80; }
.drawer__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.45); opacity: 0; transition: opacity .2s; }
.drawer__panel { position: absolute; top: 0; left: 0; bottom: 0; width: min(320px, 86vw); background: #fff; display: flex; flex-direction: column; transform: translateX(-100%); transition: transform .2s; }
.drawer.is-open .drawer__backdrop { opacity: 1; }
.drawer.is-open .drawer__panel { transform: none; }
.drawer__head { height: 56px; display: flex; align-items: center; justify-content: space-between; padding: 0 4px 0 16px; border-bottom: 1px solid var(--line); }
.drawer__head .logo { font-size: 18px; }
.drawer__user { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.5; }
.drawer__user span:nth-child(2) { flex: 1; }
.drawer__user small { color: var(--sub); }
.drawer__user--guest { flex-direction: column; align-items: stretch; }
.drawer__body { flex: 1; overflow-y: auto; padding: 4px 16px 24px; }
.drawer__label { font-size: 11px; font-weight: 700; color: var(--sub); margin: 14px 0 2px; }
.drawer__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
.drawer__grid a, .drawer__row { display: flex; align-items: center; min-height: 44px; font-size: 14px; border-bottom: 1px solid #EFEFEF; }
.drawer__row.is-sub { color: var(--sub); }

/* ---------- Bottom tab bar (phones) ---------- */
.tabbar { display: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1279px) {
	.hsearch { display: none; }
	.site-header__tools [data-search-toggle] { display: inline-flex; }
	.gnav__list, .gnav ul.menu { gap: 4px 14px; font-size: 13.5px; }
}

@media (max-width: 1023px) {
	.gnav, .hsearch { display: none; }
	.u-sp-nav { display: inline-flex; }
	.site-header__bar { gap: 4px; padding-left: 4px; padding-right: 8px; }
	.logo { flex: 1; font-size: 19px; }
	.sidebar { max-width: none; }
	.grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.share-rail { display: none; }
	.share-inline { display: block; }
	.l-main--article { padding-top: 24px; }
}

@media (max-width: 767px) {
	:root { --header-h: 52px; }
	body { font-size: 15px; padding-bottom: 64px; }
	.admin-bar .site-header { top: 0; }
	.l-wrap { padding: 0 16px; }
	.l-narrow { padding: 24px 16px 56px; }
	.site-header__bar { padding-left: 0; padding-right: 4px; }
	.u-pc-only { display: none !important; }
	.l-main { gap: 32px; padding-top: 16px; }
	.l-content { gap: 32px; }
	.top-story__title { font-size: 21px; }
	.top-story__subs { grid-template-columns: 1fr; gap: 0; }
	.top-story__subs .card-mini { padding: 10px 0; border-bottom: 1px solid var(--line); }
	.top-story__img { order: -1; }
	.member-banner { padding: 18px; }
	.member-banner .btn { width: 100%; }
	.list-2col { grid-template-columns: 1fr; }
	.grid-3 { grid-template-columns: 1fr; gap: 0; }
	.grid-3 .card-grid { flex-direction: row-reverse; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
	.grid-3 .card-grid__img { width: 96px; flex: none; margin: 0; }
	.grid-3 .card-grid__title, .grid-3 .card-grid .meta { flex: 1 1 calc(100% - 120px); }
	.grid-3 .card-grid .badge { order: 3; }
	.grid-4 { display: flex; overflow-x: auto; gap: 12px; margin: 0 -16px; padding: 0 16px; scrollbar-width: none; }
	.grid-4 .card-exec { flex: none; width: 200px; }
	.sec-head__title { font-size: 18px; }
	.card-list__side { width: 96px; }
	.card-list__title { font-size: 14px; }
	.article-hero { background: #fff; }
	.article-hero__inner { padding-top: 0; padding-bottom: 8px; gap: 16px; }
	.article-hero__img { order: -1; margin: 0 -16px; flex-basis: 100%; }
	.article-hero__img img { border-radius: 0; }
	.article-hero__title { font-size: 23px; }
	.entry { font-size: 15px; line-height: 1.95; }
	.entry h2 { font-size: 20px; }
	.company { padding: 16px; }
	.company__img { flex-basis: 100%; width: 100%; }
	.company__dl { grid-template-columns: 80px minmax(0, 1fr); }
	.share--row .share__label { display: none; }
	.share--row { flex: 1; }
	.share--row .share__btn { flex: 1; border-radius: var(--radius); }
	.pickup__head { flex-direction: column; }
	.pickup__title { font-size: 21px; }
	.search-layout { gap: 24px; }
	.search-layout__side { max-width: none; background: var(--soft); border-radius: var(--radius); padding: 14px 16px; }
	.filters { flex-wrap: nowrap; overflow-x: auto; }
	.filters label { flex: none; }
	.site-footer__inner { gap: 24px; padding-top: 28px; }
	.site-footer__col { flex-basis: 40%; }
	.tabbar { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); position: fixed; left: 0; right: 0; bottom: 0; height: 60px; padding-bottom: env(safe-area-inset-bottom); background: #fff; border-top: 1px solid var(--line); z-index: 40; }
	.tabbar__item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-size: 10px; color: var(--sub); }
	.tabbar__item[aria-current="page"] { color: var(--accent); }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.drawer__panel, .drawer__backdrop { transition: none; }
}