/*
Theme Name: katou.jp 明るい版
Theme URI: https://katou.jp/
Author: 加藤順彦
Description: katou.jp リニューアル「統合案・明るい版」。記事・URLは従来のまま、見た目と入口だけを新しくするテーマ。
Version: 1.0
Text Domain: katou-bright
*/
:root {
  --bg: #fbfaf7;
  --surface: #ffffff;
  --ink: #1d1f24;
  --muted: #63666e;
  --line: #e4e1da;
  --accent: #1f3a5f;
  --accent-soft: #e9eef5;
  --warm: #b5532a;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: "Noto Sans JP", system-ui, sans-serif; line-height: 1.85; font-size: 16px; }
a { color: inherit; }
img { max-width: 100%; height: auto; }
.wrap { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
.wrap.narrow { max-width: 780px; }
@media (max-width: 600px) { .wrap { padding: 0 16px; } }

.mockbar { background: #2b2b2b; color: #f3f3f3; font-size: 12px; text-align: center; padding: 6px 16px; }
header.site { position: sticky; top: 0; z-index: 10; background: rgba(251,250,247,.95); backdrop-filter: blur(6px); border-bottom: 1px solid var(--line); }
header.site .wrap { display: flex; align-items: center; justify-content: space-between; min-height: 64px; gap: 16px; flex-wrap: wrap; }
.logo { font-family: "Noto Serif JP", serif; font-weight: 700; font-size: 20px; text-decoration: none; letter-spacing: .04em; }
.logo small { font-family: "Noto Sans JP"; font-weight: 400; font-size: 12px; color: var(--muted); margin-left: 8px; letter-spacing: .1em; }
nav.global { display: flex; gap: 20px; font-size: 14px; flex-wrap: wrap; }
nav.global a { text-decoration: none; color: var(--muted); }
nav.global a:hover, nav.global a.on { color: var(--accent); }
nav.global a.on { font-weight: 700; }
@media (max-width: 820px) { nav.global { gap: 4px 14px; font-size: 13px; padding-bottom: 10px; } }

section { padding: 72px 0; }
section.tight { padding: 24px 0 72px; }
.band { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.label { font-size: 12px; letter-spacing: .2em; color: var(--warm); font-weight: 700; text-transform: uppercase; margin: 0 0 10px; }
.label a { text-decoration: none; }
h2 { font-family: "Noto Serif JP", serif; font-size: 28px; margin: 0 0 28px; line-height: 1.5; }
h2.sm { font-size: 18px; margin: 32px 0 12px; }
.lead { font-size: 17px; }
.note { font-size: 12px; color: var(--muted); }

/* hero */
.hero { padding: 64px 0; }
.hero .grid { display: grid; grid-template-columns: 280px 1fr; gap: 48px; align-items: center; }
.photo { width: 280px; aspect-ratio: 4/5; object-fit: cover; object-position: 50% 20%; border-radius: 6px; }
.name { font-family: "Noto Serif JP", serif; font-size: 48px; margin: 0; line-height: 1.2; letter-spacing: .06em; }
.reading { color: var(--muted); font-size: 14px; letter-spacing: .12em; margin: 6px 0 22px; }
.roles { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; padding: 0; list-style: none; }
.roles li { background: var(--accent-soft); color: var(--accent); font-weight: 500; font-size: 14px; padding: 4px 12px; border-radius: 999px; }
.intro { font-size: 17px; margin: 0; max-width: 34em; }
@media (max-width: 760px) {
  .hero .grid { grid-template-columns: 1fr; gap: 24px; }
  .photo { width: 200px; }
  .name { font-size: 38px; }
}
.timeline { margin-top: 56px; display: grid; grid-template-columns: repeat(5, 1fr); border-top: 2px solid var(--ink); }
.timeline a { padding: 14px 12px 0 0; position: relative; text-decoration: none; }
.timeline a::before { content: ""; position: absolute; top: -7px; left: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--ink); }
.timeline a:last-child::before { background: var(--warm); }
.timeline a:hover b { color: var(--accent); }
.timeline b { display: block; font-family: "Noto Serif JP", serif; font-size: 20px; }
.timeline span { font-size: 13px; color: var(--muted); line-height: 1.6; display: block; }
@media (max-width: 640px) {
  .timeline { grid-template-columns: 1fr; border-top: 0; border-left: 2px solid var(--ink); margin-left: 6px; }
  .timeline a { padding: 0 0 18px 20px; }
  .timeline a::before { top: 8px; left: -7px; }
}

/* now */
.cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
@media (max-width: 760px) { .cards { grid-template-columns: 1fr; } }
.card { border: 1px solid var(--line); border-radius: 8px; padding: 26px 26px 22px; background: var(--bg); }
.card .since { font-size: 12px; color: var(--muted); letter-spacing: .08em; }
.card h3 { font-family: "Noto Serif JP", serif; font-size: 20px; margin: 4px 0 2px; }
.card .pos { font-size: 14px; color: var(--accent); font-weight: 500; margin: 0 0 12px; }
.card p { margin: 0 0 14px; font-size: 15px; }
a.more { font-size: 14px; color: var(--accent); text-decoration: none; font-weight: 500; }
a.more::after { content: " →"; }

/* doors */
.doors { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 760px) { .doors { grid-template-columns: 1fr; } }
.door { display: block; text-decoration: none; padding: 30px 26px; border-radius: 8px; background: var(--accent); color: #fff; transition: transform .15s; }
.door:hover { transform: translateY(-3px); }
.door .n { font-family: "Noto Serif JP", serif; font-size: 14px; opacity: .7; }
.door h3 { font-family: "Noto Serif JP", serif; font-size: 21px; margin: 6px 0 10px; }
.door p { margin: 0; font-size: 14px; opacity: .88; line-height: 1.75; }
.media-strip { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 10px 28px; color: var(--muted); font-size: 14px; align-items: center; }
.media-strip strong { color: var(--ink); font-size: 13px; letter-spacing: .1em; }

/* recent */
.recent-grid { display: grid; grid-template-columns: 1.7fr 1fr; gap: 40px; }
@media (max-width: 860px) { .recent-grid { grid-template-columns: 1fr; } }
.pcards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
@media (max-width: 560px) { .pcards { grid-template-columns: 1fr; } }
.pcard { display: block; text-decoration: none; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--bg); }
.pcard img, .pcard .noimg { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; background: #ece8e0; }
.pcard div { padding: 12px 14px 14px; }
.pcard time { font-size: 12px; color: var(--muted); }
.pcard .t { display: block; font-weight: 500; font-size: 15px; line-height: 1.6; }
.pcard:hover .t { color: var(--accent); }
.links-row { margin-top: 18px; display: flex; gap: 22px; flex-wrap: wrap; font-size: 14px; }
.links-row a { color: var(--accent); text-decoration: none; font-weight: 500; }
.side { display: grid; gap: 20px; align-content: start; }
.diary, .xbox { background: var(--bg); border: 1px solid var(--line); border-radius: 8px; padding: 20px; }
.tag { font-size: 12px; color: var(--warm); font-weight: 700; letter-spacing: .1em; }
.diary h3 { font-size: 16px; margin: 6px 0 8px; }
.diary p { font-size: 14px; color: var(--muted); margin: 0 0 12px; }
.xhead { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; font-size: 13px; }
.xhead a { color: var(--accent); text-decoration: none; font-weight: 500; }
.xbox .twitter-timeline { display: block; font-size: 14px; color: var(--accent); }

/* contact */
.contact .box { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
@media (max-width: 760px) { .contact .box { grid-template-columns: 1fr; } }
.contact ul { padding-left: 1.2em; margin: 0; }
form { display: grid; gap: 12px; }
input, select, textarea { font: inherit; font-size: 15px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); width: 100%; }
textarea { min-height: 110px; }
button { font: inherit; font-weight: 700; background: var(--ink); color: #fff; border: 0; border-radius: 6px; padding: 12px; opacity: .85; }

/* page head */
.page-head { padding: 56px 0 16px; }
.page-head h1 { font-family: "Noto Serif JP", serif; font-size: 34px; margin: 0 0 12px; line-height: 1.4; }

/* profile */
.profile-top { display: grid; grid-template-columns: 180px 1fr; gap: 28px; align-items: start; margin-top: 24px; }
.profile-top img { width: 180px; aspect-ratio: 4/5; object-fit: cover; object-position: 50% 20%; border-radius: 6px; }
.profile-top p { margin: 0 0 10px; }
.name-s { font-family: "Noto Serif JP", serif; font-size: 24px; font-weight: 700; }
.name-s small { display: block; font-family: "Noto Sans JP"; font-size: 13px; font-weight: 400; color: var(--muted); letter-spacing: .1em; }
@media (max-width: 600px) { .profile-top { grid-template-columns: 1fr; } .profile-top img { width: 150px; } }
.tiers { display: grid; gap: 18px; margin-bottom: 40px; }
.tier { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 18px 22px; }
.tier h3 { font-size: 15px; color: var(--warm); margin: 0 0 8px; letter-spacing: .05em; }
.tier dl { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 6px 18px; font-size: 15px; }
.tier dt { font-weight: 500; }
.tier dd { margin: 0; color: var(--muted); }
@media (max-width: 600px) { .tier dl { grid-template-columns: 1fr; } .tier dd { margin-bottom: 8px; } }
.portfolio { margin: 0 0 48px; }
.portfolio img { border-radius: 8px; border: 1px solid var(--line); }
.portfolio figcaption { font-size: 13px; color: var(--muted); margin-top: 6px; }
.history { list-style: none; padding: 0; margin: 0 0 16px; border-left: 2px solid var(--ink); }
.history li { display: grid; grid-template-columns: 64px 1fr; gap: 12px; padding: 0 0 14px 18px; position: relative; }
.history li::before { content: ""; position: absolute; left: -7px; top: 9px; width: 12px; height: 12px; border-radius: 50%; background: var(--ink); }
.history b { font-family: "Noto Serif JP", serif; }
.glossary dt { font-weight: 700; margin-top: 10px; }
.glossary dd { margin: 0; color: var(--muted); }
details.orig { margin-top: 48px; border-top: 1px solid var(--line); padding-top: 18px; }
details.orig summary { cursor: pointer; color: var(--accent); font-weight: 500; }

/* start5 */
.fives { display: grid; gap: 18px; }
.five { display: grid; grid-template-columns: 40px 200px 1fr; gap: 20px; align-items: center; text-decoration: none; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 18px; }
.five:hover h3 { color: var(--accent); }
.five .no { font-family: "Noto Serif JP", serif; font-size: 32px; color: var(--warm); text-align: center; }
.five img, .five .noimg { width: 200px; aspect-ratio: 16/9; object-fit: cover; border-radius: 6px; background: #ece8e0; }
.five .head { margin: 0; font-size: 13px; color: var(--warm); font-weight: 700; }
.five h3 { margin: 2px 0 6px; font-size: 18px; line-height: 1.5; }
.five p { margin: 0 0 4px; font-size: 14px; color: var(--muted); }
.five time { font-size: 12px; color: var(--muted); }
@media (max-width: 640px) { .five { grid-template-columns: 32px 1fr; } .five img, .five .noimg { display: none; } }

/* media */
.medialist { list-style: none; padding: 0; margin: 0; }
.medialist li { display: grid; grid-template-columns: 52px 44px 1fr; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.medialist .yr { color: var(--muted); font-size: 13px; }
.medialist .kind { font-size: 11px; color: var(--accent); background: var(--accent-soft); border-radius: 4px; text-align: center; height: fit-content; padding: 1px 0; }
.medialist a { text-decoration: none; }
.medialist a:hover { color: var(--accent); }

/* archive */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips a { text-decoration: none; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 3px 12px; font-size: 14px; }
.chips a:hover { border-color: var(--accent); color: var(--accent); }
.chips small { color: var(--muted); margin-left: 6px; font-size: 12px; }
.chips.sm a { font-size: 12px; padding: 1px 10px; }
.search { margin-bottom: 8px; }
.rows { list-style: none; padding: 0; margin: 20px 0 0; }
.rows li { display: grid; grid-template-columns: 96px 1fr auto; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 15px; align-items: baseline; }
.rows time { color: var(--muted); font-size: 13px; }
.rows a { text-decoration: none; }
.rows a:hover { color: var(--accent); }
.flag { font-size: 11px; color: #fff; background: var(--warm); border-radius: 4px; padding: 1px 6px; white-space: nowrap; }
@media (max-width: 560px) { .rows li { grid-template-columns: 1fr auto; } .rows time { grid-column: 1 / -1; } }

/* post */
article.post { padding: 48px 0 72px; }
article.post h1 { font-family: "Noto Serif JP", serif; font-size: 30px; line-height: 1.5; margin: 6px 0 24px; }
.meta { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; color: var(--muted); font-size: 14px; margin: 0; }
.banner { font-size: 14px; border-radius: 6px; padding: 10px 14px; margin-bottom: 14px; }
.banner.old { background: #f1efe9; color: var(--muted); }
.banner.legal { background: #fbeee8; color: #8a3a1a; border: 1px solid #efcbbb; }
.content { font-size: 16.5px; line-height: 2; overflow-wrap: anywhere; }
.content img { border-radius: 4px; }
.content iframe { max-width: 100%; }
.content table { max-width: 100%; display: block; overflow-x: auto; }
.content blockquote { margin: 1em 0; padding: 4px 18px; border-left: 3px solid var(--line); color: var(--muted); }
.content a { color: var(--accent); }
.orig-link { font-size: 12px; color: var(--muted); margin-top: 32px; overflow-wrap: anywhere; }
.author { display: flex; gap: 16px; align-items: center; margin-top: 32px; padding: 18px; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; font-size: 14px; }
.author img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; }
.author b { display: block; font-size: 16px; }
.author span { display: block; color: var(--muted); }
.author a { color: var(--accent); text-decoration: none; }
.pager { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 28px; font-size: 14px; }
.pager a { text-decoration: none; color: var(--accent); }
.pager .next { text-align: right; grid-column: 2; }

footer { background: #1d1f24; color: #c9cbd1; padding: 48px 0; font-size: 14px; }
footer .wrap { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 24px; }
footer nav { display: flex; flex-wrap: wrap; gap: 8px 20px; }
footer a { color: #c9cbd1; text-decoration: none; }

/* 私も履歴書 */
.memoir-link{display:grid;grid-template-columns:40px 1fr;gap:20px;align-items:center;text-decoration:none;background:var(--accent-soft);border:1px solid #cdd9e8;border-radius:8px;padding:20px 18px;margin-bottom:28px}
.memoir-link .no{font-family:"Noto Serif JP",serif;font-size:32px;color:var(--accent);text-align:center}
.memoir-link .head{margin:0;font-size:13px;color:var(--accent);font-weight:700}
.memoir-link h3{margin:2px 0 6px;font-size:19px}
.memoir-link p{margin:0;font-size:14px;color:var(--muted)}
.memoir-link:hover h3{color:var(--accent)}
.memoir-intro{font-size:14px;color:var(--muted);border-left:3px solid var(--line);padding-left:16px}
.memoir-intro p{margin:0 0 6px}
.chapter{padding:36px 0;border-bottom:1px solid var(--line)}
.ch-head{margin:0;color:var(--warm);font-weight:700;font-size:14px;letter-spacing:.06em}
.ch-head small{margin-left:10px;color:var(--muted);font-weight:500}
.chapter h2{font-size:24px;margin:6px 0 12px}
.ch-sum{margin:0 0 16px;font-size:15.5px}
.eps{list-style:none;padding:0;margin:0;display:grid;gap:2px}
.eps li{display:grid;grid-template-columns:36px 1fr;gap:8px;font-size:15px;padding:6px 0;border-top:1px dotted var(--line)}
.eps span{color:var(--muted);font-size:13px;padding-top:2px}
.eps a{text-decoration:none;color:var(--accent)}
.eps a:hover{text-decoration:underline}

/* 街角diary */
.btn-out{display:inline-block;border:1px solid var(--accent);color:var(--accent);text-decoration:none;padding:8px 16px;border-radius:4px;font-size:14px;font-weight:500}
.diary-list{list-style:none;padding:0;margin:0}
.diary-list .month{font-family:"Noto Serif JP",serif;font-weight:700;font-size:18px;color:var(--warm);padding:28px 0 6px;border-bottom:2px solid var(--ink)}
.diary-list .col{display:grid;grid-template-columns:110px 1fr;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
.col-meta .no{display:block;font-weight:700;color:var(--accent);font-size:14px}
.col-meta time{font-size:13px;color:var(--muted)}
.diary-list h3{margin:0 0 6px;font-size:18px;line-height:1.55}
.diary-list h3 a{text-decoration:none}
.diary-list h3 a:hover{color:var(--accent)}
.diary-list p{margin:0 0 8px;font-size:15px;color:#3a3f48}
.col-link{font-size:13px;color:var(--accent);text-decoration:none;font-weight:500}
.diary-foot{margin-top:32px}
@media(max-width:560px){.diary-list .col{grid-template-columns:1fr;gap:4px}}

/* サイト内検索 */
.sitesearch{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:#fff;overflow:hidden;height:36px}
.sitesearch input{border:0;background:transparent;padding:0 12px;width:170px;font-size:14px;height:100%;outline:none}
.sitesearch button{border:0;background:var(--accent);color:#fff;font:inherit;font-size:13px;font-weight:700;padding:0 14px;height:100%;cursor:pointer;opacity:1;border-radius:0}
@media(max-width:820px){.sitesearch{width:100%;margin-bottom:10px}.sitesearch input{flex:1;width:auto}}
.bigsearch{display:flex;gap:8px;margin:12px 0 8px}
.bigsearch input{flex:1;font-size:16px;padding:12px 14px}
.bigsearch button{background:var(--accent);color:#fff;border:0;border-radius:6px;padding:0 22px;font-weight:700;cursor:pointer;opacity:1}
.results{list-style:none;padding:0;margin:0}
.results li a{display:block;text-decoration:none;padding:16px 0;border-bottom:1px solid var(--line)}
.results .meta{display:block;font-size:12px;color:var(--muted)}
.results b{display:block;font-size:17px;margin:2px 0 4px}
.results li a:hover b{color:var(--accent)}
.results .snip{display:block;font-size:14px;color:#4a4f58;line-height:1.8}
.results mark{background:#fff1a8;padding:0 1px}

.diary-list .col:target{background:#fff8d6;outline:8px solid #fff8d6}

/* 家紋 */
.logo{display:inline-flex;align-items:center}
.logo .kamon{width:26px;height:26px;margin-right:9px;flex:none}

/* 家紋の透かし */
body::after{content:"";position:fixed;right:-110px;bottom:-110px;width:440px;height:440px;-webkit-mask:url(assets/photos/kamon.png) center/contain no-repeat;mask:url(assets/photos/kamon.png) center/contain no-repeat;background:#1d4f7a;opacity:.07;pointer-events:none;z-index:0}
.page-head{position:relative;overflow:hidden}
.page-head::before{content:"";position:absolute;right:-40px;top:50%;width:380px;height:380px;transform:translateY(-50%);-webkit-mask:url(assets/photos/kamon.png) center/contain no-repeat;mask:url(assets/photos/kamon.png) center/contain no-repeat;background:#1d4f7a;opacity:.08;pointer-events:none}
.page-head .wrap{position:relative}
@media(max-width:860px){body::after{width:260px;height:260px;right:-70px;bottom:-70px}.page-head::before{width:240px;height:240px;right:-50px}}

/* =====================================================================
   明るい版にそろえる（トップの「統合案・明るい版」と同じ色・書体・ヘッダー・フッター）
   ===================================================================== */
:root{--bg:#ffffff;--surface:#ffffff;--ink:#16212e;--muted:#3f4b59;--line:#dde6ee;--accent:#1d4f7a;--accent-soft:#e9f2f9;--warm:#1d4f7a;--sky:#e9f2f9;--paper:#f4f8fb}
body{background:#fff;color:var(--ink);font-family:"Zen Kaku Gothic New",sans-serif;font-weight:500;font-size:17px;line-height:1.9}
h1,h2,h3,.page-head h1,.name-s,article.post h1,.five h3,.chapter h2,.diary-list h3,.memoir-link h3,.five .no,.memoir-link .no,.history b,.diary-list .month,.door h3{font-family:"Shippori Mincho",serif}
h2{font-weight:700}
.wrap{max-width:1160px;padding:0 32px}
.wrap.narrow{max-width:820px}
@media(max-width:600px){.wrap{padding:0 16px}}

/* 上の帯 */


/* ヘッダー */
header.site{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;min-height:84px;gap:10px 18px;padding-top:8px;padding-bottom:8px}
.logo{display:inline-flex;align-items:center;font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700;font-size:16px;letter-spacing:.14em;color:var(--accent);text-decoration:none;white-space:nowrap}
.logo .kamon{width:26px;height:26px;margin:0 0 0 14px;flex:none}
.logo span{font-family:"Shippori Mincho",serif;font-weight:800;font-size:22px;letter-spacing:.12em;color:var(--ink);margin-left:8px}
.logo small{display:none}
nav.global{display:flex;gap:22px;font-size:15px;flex-wrap:wrap}
nav.global a{font-weight:700;color:#0f1a26;text-align:center;line-height:1.3;text-decoration:none}
nav.global a small{display:block;font-size:11px;font-weight:700;color:#4a5868;letter-spacing:.06em;margin-top:2px}
nav.global a:hover,nav.global a.on{color:var(--accent)}
nav.global a.on{box-shadow:inset 0 -2px 0 var(--accent);padding-bottom:4px}
.sitesearch{border-color:#c9d9e6;height:38px}
.sitesearch button{background:var(--accent)}
.menu-btn{display:none}

/* 見出しまわり */
.label{color:var(--accent);font-weight:800;letter-spacing:.16em;font-size:14px}
.page-head{padding:64px 0 20px}
.page-head h1{font-size:36px;font-weight:700;letter-spacing:.04em}
.lead{font-size:18px;color:var(--ink)}
.note{font-size:13px;color:var(--muted)}
section.tight{padding:24px 0 88px}

/* カード・一覧 */
.tier{background:#fff;border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:4px}
.tier h3{color:var(--accent);font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700;font-size:16px}
.tier dl{font-size:16px}.tier dd{color:var(--muted)}
.history{border-left-color:var(--accent)}.history li::before{background:var(--accent)}
.history b{color:var(--accent);font-weight:700}
.five,.memoir-link{border-radius:4px}
.five{background:#fff;border-color:var(--line)}
.five .no,.memoir-link .no{color:var(--accent);font-weight:800}
.five .head,.memoir-link .head{color:var(--accent)}
.five h3{font-weight:700}
.five p{color:var(--muted);font-size:15px}
.memoir-link{background:var(--sky);border-color:#c9d9e6}
.memoir-intro{border-left-color:#c9d9e6}
.ch-head{color:var(--accent)}
.chapter h2{font-size:26px}
.eps a{color:var(--accent);font-weight:500}
.diary-list .month{color:var(--accent);border-bottom-color:var(--accent)}
.col-meta .no{color:var(--accent)}
.diary-list p{color:var(--muted);font-size:16px}
.btn-out{border-color:var(--accent);color:var(--accent);font-weight:700}
.medialist .kind{color:var(--accent);background:var(--sky)}
.medialist li{font-size:16px}
.chips a{border-color:#c9d9e6;font-weight:500}
.chips a:hover{border-color:var(--accent);color:var(--accent)}
.rows li{font-size:16px}
.rows a:hover,.results li a:hover b,.diary-list h3 a:hover{color:var(--accent)}
.flag{background:#a0522d}
.results b{font-family:"Shippori Mincho",serif;font-size:18px}
.bigsearch button{background:var(--accent)}

/* 記事ページ */
article.post{padding:56px 0 88px}
article.post h1{font-size:32px;font-weight:700}
.content{font-size:17.5px;color:var(--ink)}
.content a{color:var(--accent)}
.author{background:var(--paper);border-color:var(--line);border-radius:4px}
.pager a{color:var(--accent);font-weight:700}

/* フッター（トップと同じ） */
footer.site-foot{background:#f3f6f9;color:#2f3b49;border-top:1px solid var(--line);padding:72px 0 56px;font-size:16px}
footer.site-foot .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:40px}
footer.site-foot h4{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:800;letter-spacing:.16em;font-size:14px;color:var(--accent);margin:0 0 14px}
footer.site-foot a{display:block;color:#2f3b49;text-decoration:none;line-height:2.2}
footer.site-foot a:hover{color:var(--accent)}
footer.site-foot .logo{display:inline-flex;line-height:1.4}
footer.site-foot p{margin:18px 0 0;line-height:1.9;color:var(--muted)}
@media(max-width:760px){footer.site-foot .wrap{grid-template-columns:1fr;gap:28px}}

/* スマホ：トップと同じメニューボタン */
@media(max-width:860px){
  header.site{position:static}
  header.site .wrap{display:grid;grid-template-columns:1fr auto;align-items:center;min-height:0;padding-top:12px;padding-bottom:12px;gap:10px}
  .logo{font-size:12px;letter-spacing:.06em}
  .logo .kamon{width:22px;height:22px;margin-left:8px}
  .logo span{font-size:18px;margin-left:6px}
  .menu-btn{display:block;white-space:nowrap;font:inherit;font-size:14px;font-weight:700;color:#fff;background:var(--accent);border:0;border-radius:3px;padding:9px 14px;cursor:pointer}
  nav.global{display:none;grid-column:1/-1;flex-direction:column;gap:0;padding:0;border-top:1px solid var(--line)}
  header.site.open nav.global{display:flex}
  nav.global a{display:flex;justify-content:space-between;align-items:baseline;text-align:left;font-size:17px;padding:14px 2px;border-bottom:1px solid var(--line)}
  nav.global a small{display:inline;margin:0;font-size:11px}
  nav.global a.on{box-shadow:none;padding-bottom:14px}
  .sitesearch{grid-column:1/-1;width:100%;margin:0;height:42px}
  .sitesearch input{flex:1;width:auto;font-size:16px}
  .page-head{padding:40px 0 12px}
  .page-head h1{font-size:28px}
  article.post h1{font-size:25px}
  .lead{font-size:16px}
  .content{font-size:16.5px}
}

/* テーマから探す：おすすめの1本 */
.theme-index{margin-bottom:28px}
.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:1000px){.themes{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.themes{grid-template-columns:1fr}}
.theme{background:#fff;border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:4px;padding:18px 18px 14px;display:flex;flex-direction:column}
.theme header{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:12px}
.theme h3{margin:0;font-size:19px;font-weight:700}
.theme h3 a{text-decoration:none;color:var(--ink)}
.theme h3 a:hover{color:var(--accent)}
.theme header span{font-size:13px;color:var(--muted);white-space:nowrap}
.pick{display:block;text-decoration:none;color:var(--ink);flex:1}
.pick img,.pick .noimg{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:3px;background:var(--sky);display:block;margin-bottom:10px}
.pick-label{display:inline-block;font-size:12px;font-weight:700;color:#fff;background:var(--accent);border-radius:2px;padding:1px 8px;margin-bottom:6px}
.pick b{display:block;font-family:"Shippori Mincho",serif;font-size:17px;line-height:1.55;margin-bottom:6px}
.pick:hover b{color:var(--accent)}
.pick-why{display:block;font-size:14px;color:var(--muted);line-height:1.75;margin-bottom:4px}
.pick time{font-size:12px;color:var(--muted)}
.theme-more{display:block;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:14px;font-weight:700;color:var(--accent);text-decoration:none}
.pick-wide{display:grid;grid-template-columns:240px 1fr;gap:20px;align-items:center;background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:4px;padding:16px;margin-bottom:24px}
.pick-wide img,.pick-wide .noimg{margin:0}
@media(max-width:640px){.pick-wide{grid-template-columns:1fr}}

/* プロフィール：参画企業の記事ボタン */
.tier dd{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.co-links{display:inline-flex;gap:6px;flex:none;width:168px;justify-content:flex-start}
@media(max-width:600px){.co-links{width:auto}}
.co-btn{display:inline-block;font-size:12px;font-weight:700;line-height:1;padding:7px 10px;border-radius:3px;text-decoration:none;color:#fff;background:var(--accent);white-space:nowrap}
.co-btn:hover{background:#163e61}
.co-btn.diary{background:#fff;color:var(--accent);border:1px solid #a9cbe4;padding:6px 10px}
.co-btn.diary:hover{background:var(--sky)}
.co-btn.ghost{visibility:hidden}

/* 人物紹介 */
.about-top{display:grid;grid-template-columns:220px 1fr;gap:32px;align-items:center;margin:8px 0 28px}
.about-top img{width:220px;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:4px}
.about-name{font-family:"Shippori Mincho",serif;font-weight:800;font-size:30px;letter-spacing:.08em;margin:0 0 10px}
.about-name small{display:block;font-family:"Zen Kaku Gothic New",sans-serif;font-size:14px;font-weight:500;color:var(--muted);letter-spacing:.06em;margin-top:4px}
.about-summary{font-size:17px;line-height:2;margin:0}
.about-facts{width:100%;border-collapse:collapse;margin:0 0 24px;font-size:15px;background:#fff}
.about-facts th,.about-facts td{border-bottom:1px solid var(--line);padding:12px 10px;text-align:left;vertical-align:top}
.about-facts tr:first-child th,.about-facts tr:first-child td{border-top:2px solid var(--accent)}
.about-facts th{width:90px;color:var(--accent);font-weight:700;white-space:nowrap}
.about-sec{padding:28px 0 4px}
.about-sec h2{font-size:24px;font-weight:700;line-height:1.5;margin:0 0 16px;display:flex;gap:14px;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:10px}
.about-sec h2 span{font-family:"Zen Kaku Gothic New",sans-serif;font-size:14px;font-weight:800;color:var(--accent);letter-spacing:.1em}
.about-sec p{font-size:17px;line-height:2.05;margin:0 0 18px}
.about-photo{margin:24px 0 8px}
.about-photo img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:60% 30%;border-radius:4px}
.about-photo figcaption{font-size:13px;color:var(--muted);margin-top:6px}
.about-next{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px}
.about-next a{display:block;text-decoration:none;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:4px;padding:16px}
.about-next b{display:block;font-family:"Shippori Mincho",serif;font-size:17px;color:var(--ink)}
.about-next span{display:block;font-size:13px;color:var(--muted);margin-top:4px}
.about-next a:hover b{color:var(--accent)}
@media(max-width:700px){.about-top{grid-template-columns:1fr}.about-top img{width:180px}.about-next{grid-template-columns:1fr}.about-facts th{width:64px}.about-sec h2{font-size:21px}}
