/* 文字の太さは全体を 500(中太)にそろえた(オーナー指示 2026-10-17。記事本文の強調 strong だけ太字のまま)。
   文字サイズは hallmark の基準に合わせ、1ページ5段階(12 / 14 / 20 / 32 / 大見出し 51 か 56px。スマホは h2 28・h1 34〜36px)、10px 未満なし(2026-10-17 オーナー指示)。 */
/* KYOTO TO DO 改修(2026-10)の新しいスタイル。設計図(KYOTO_TO_DO_wireframes.html v1.0, 2026-10-14)の値に合わせる。
 * 既存の style.css / sp_style.css の後に読み込む。旧CSSは html{font-size:62.5%} なので、ここでは px で書く。
 * 新しい部品はすべて kt- で始まるクラスに閉じる。色・書体は下の変数(設計図の色)を使う。
 *
 * Hallmark · macrostructure: owner wireframe v1.0 (fidelity mode, 2026-10-17) · tone: editorial · palette & type: existing site (cream #F6F0E7 / red #C31919 / Montserrat, 2026-10-17)
 * オーナー指示(2026-10-17)により、hallmark の基準より設計図の見た目を優先している(test-results.md の「要件による例外」)。
 */

/* Montserrat が届くまでの代わりの書体(Arial)を、Montserrat と同じ字の大きさ・行の高さに合わせる。
   書体が届いた瞬間に文字の幅が変わって下の写真などが押し下げられる(レイアウトのずれ CLS)のを防ぐ */
@font-face {
	font-family: "Montserrat Fallback";
	src: local("Arial"), local("ArialMT"), local("Liberation Sans");
	size-adjust: 112.8%;
	ascent-override: 85.8%;
	descent-override: 22.3%;
	line-gap-override: 0%;
}

:root {
	/* 色: 既存サイト(改修前のテーマ)の色に寄せた(オーナー指示 2026-10-17)。
	   クリームの背景 #F6F0E7・白い面・黒 #1C1C1C・赤 #C31919 / #9D0808・暖かい灰色 #6B6258・線 #D2CABD。
	   文字はすべて背景に対して 4.5:1 以上(入力欄の枠は 3:1 以上)。 */
	--color-paper:        #F6F0E7; /* ページの背景(既存の body) */
	--color-surface:      #FFFFFF; /* カード・タイル・横の欄・パネル・入力欄などの面 */
	--color-alt:          #EFE7DA;
	--color-tint:         #EADFCF;
	--color-ink:          #1C1C1C;
	--color-nav:          #1C1C1C;
	--color-lede:         #6B6258;
	--color-copy:         #3D3731;
	--color-muted:        #6B6258;
	--color-crumb:        #6B6258;
	--color-eyebrow:      #6B6258;
	--color-cap:          #C31919; /* カードのジャンル名(既存のジャンル表示と同じ赤) */
	--color-card-text:    #6B6258;
	--color-meta:         #6B6258;
	--color-author:       #6B6258;
	--color-tile-sub:     #6B6258;
	--color-small-label:  #6B6258;
	--color-link:         #C31919;
	--color-btn:          #C31919;
	--color-on-btn:       #FFFFFF;
	--color-logo-sub:     #6B6258;
	--color-rule-header:  #E3DACB;
	--color-line:         #D2CABD;
	--color-search-line:  #D2CABD;
	--color-input-line:   #8E8273; /* 入力欄の枠。入力欄は枠で場所が分かる部品なので WCAG 1.4.11 の 3:1 に合わせる */
	--color-tile-line:    #D2CABD;
	--color-tag-line:     #D2CABD;
	--color-filter-line:  #D2CABD;
	--color-summary-line: #D2CABD;
	--color-side-line:    #D2CABD;
	--color-side-text:    #6B6258;
	--color-toc-bg:       #FFFFFF;
	--color-toc-line:     #E3DACB;
	--color-toc-text:     #3D3731;
	--color-info-bg:      #FFFFFF;
	--color-soft-bg:      #FBF7F1;
	--color-soft-line:    #D2CABD;
	--color-soft-text:    #5A524A;
	--color-badge:        #C31919;
	--color-badge-bg:     #F7E3E1;
	--color-summary-text: #5A524A;
	--color-mini-line:    #D2CABD;
	--color-mini-text:    #C31919;
	--color-avatar-bg:    #EADFCF;
	--color-avatar-line:  #B8AC99;
	--color-avatar-text:  #6B6258;
	--color-foot-bg:      #1C1C1C; /* 既存のフッター */
	--color-foot-text:    #FFFFFF;
	--color-foot-link:    #D2CABD;
	--color-hero-top:     rgba(28, 28, 28, 0.075);
	--color-hero-bottom:  rgba(28, 28, 28, 0.79);
	--color-panel-shadow: rgba(28, 28, 28, 0.12);
	--color-focus:        #1C1C1C;
	--color-focus-dark:   #FFFFFF;

	/* 書体: 既存サイトと同じ Montserrat(Google Fonts。読み込みは inc/kt-redesign.php の kt_head_assets) */
	--font-display: Montserrat, "Montserrat Fallback", Arial, sans-serif;
	--font-body:    Montserrat, "Montserrat Fallback", Arial, sans-serif;

	--wrap: 1280px;
	--pad: 7%;
	--pad-sp: 6%;
	--ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--z-header: 30;
	--z-panel: 40;
	--z-skip: 60;
}

/* =========================================================
   土台(新テンプレートのページだけ。特集記事 .kt-article は旧CSSの見た目を保つ)
   ======================================================= */
html, body { overflow-x: clip; }
body.kt:not(.kt-article) {
	background: var(--color-paper);
	color: var(--color-ink);
	font: 500 14px/1.6 var(--font-body);
}
/* 特集記事も背景はほかのページと同じ(既存サイトのクリーム色)。書体・文字の大きさなど本文の見た目は旧CSSのまま */
body.kt.kt-article { background: var(--color-paper); }
.kt-header, .kt-footer, .kt-section, .kt-main, .kt-author, .kt-byline, .kt-article-head {
	font-family: var(--font-body);
	color: var(--color-ink);
}
.kt-header *, .kt-footer *, .kt-section *, .kt-main *, .kt-author *, .kt-byline * { box-sizing: border-box; }
/* 旧CSSの a{color:#1c1c1c} にだけ勝ち、クラス指定には負けるよう、詳細度を a 1つ分にする */
:where(body.kt, .kt-header, .kt-footer, .kt-section, .kt-author, .kt-byline) a { color: inherit; }

/* 旧CSSの *:focus{outline:none} を、新しい部品では打ち消して、見えるフォーカス枠を出す */
.kt-header :focus-visible, .kt-main :focus-visible, .kt-section :focus-visible, .kt-author :focus-visible, .kt-byline :focus-visible, .kt-skip:focus-visible {
	outline: 2px solid var(--color-focus);
	outline-offset: 3px;
}
.kt-footer :focus-visible, .kt-hero :focus-visible { outline: 2px solid var(--color-focus-dark); outline-offset: 3px; }

.kt-skip { position: absolute; left: 16px; top: -100px; z-index: var(--z-skip); background: var(--color-ink); color: var(--color-paper); padding: 8px 16px; font: 500 12px/1.4 var(--font-body); }
.kt-skip:focus-visible { top: 16px; }
.kt-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.kt-wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--pad); }

/* =========================================================
   文字(設計図の .area h1 / h2 / .eyebrow / .lede / .btn / .link)
   ======================================================= */
.kt-display, .kt-h1, .kt-h2, .kt-h3, .kt-card__title {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 500;
	color: var(--color-ink);
	overflow-wrap: anywhere;
	min-width: 0;
	margin: 0;
}
.kt-display { font-size: 56px; line-height: 1.11; letter-spacing: -0.7px; max-width: 800px; margin-bottom: 15px; }
.kt-h1 { font-size: 51px; line-height: 1.11; letter-spacing: -0.7px; max-width: 950px; margin-bottom: 15px; }
.kt-h2 { font-size: 32px; line-height: 1.11; letter-spacing: -0.7px; margin-bottom: 15px; }
.kt-h3 { font-size: 20px; line-height: 1.35; }
.kt-lede { font-size: 14px; line-height: 1.7; color: var(--color-lede); max-width: 650px; margin: 0; }
.kt-eyebrow { font: 500 12px/1.4 var(--font-body); letter-spacing: 2px; text-transform: uppercase; color: var(--color-eyebrow); margin: 0 0 12px; }
.kt-note { font-size: 12px; color: var(--color-muted); margin: 12px 0 0; }
.kt-dot { color: inherit; }

.kt-link { font-size: 12px; color: var(--color-link); text-decoration: underline; text-underline-offset: 5px; white-space: nowrap; }
.kt-link::after { content: " \2192"; }
.kt-link:hover { text-decoration-thickness: 2px; }
.kt-link:active { transform: translateY(1px); }

.kt-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 22px 0 0; }
.kt-btn {
	display: inline-block; background: var(--color-btn); color: var(--color-on-btn);
	font: 500 12px/1.2 var(--font-body); padding: 13px 20px; border-radius: 2px;
	text-decoration: none; white-space: nowrap; border: 0;
	transition: background-color 140ms var(--ease-out);
}
.kt-btn::after { content: " \2192"; }
.kt-btn:hover { background: var(--color-ink); }
.kt-btn:active { transform: translateY(1px); }
.kt-btn:disabled, .kt-btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; transform: none; }
.kt-mini { display: inline-block; border: 1px solid var(--color-mini-line); padding: 12px 16px; font-size: 12px; color: var(--color-mini-text); margin-top: 8px; text-decoration: none; white-space: nowrap; }
.kt-mini::after { content: " \2192"; }
.kt-mini:hover { border-color: var(--color-mini-text); }

/* =========================================================
   G-01 ヘッダー(設計図の .wire-header / .logo / .mainnav / .nav-search)
   ======================================================= */
.kt-header { position: relative; z-index: var(--z-header); background: var(--color-paper); border-bottom: 1px solid var(--color-rule-header); }
.kt-header__bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 26px 5.5%; max-width: var(--wrap); margin-inline: auto; flex-wrap: wrap; }
.kt-wordmark { display: inline-block; text-decoration: none; color: var(--color-ink); white-space: nowrap; }
.kt-wordmark__name { display: block; font: 500 20px/1.15 var(--font-body); letter-spacing: 2px; }
.kt-wordmark__tag { display: block; font: 500 12px/1.2 var(--font-body); letter-spacing: 1px; text-transform: uppercase; color: var(--color-logo-sub); margin-top: 3px; }
/* 既存サイトのロゴ画像 + 添え書き(既存のスマホ表示と同じく、ロゴの下に右寄せ。色は既存の添え書きの赤 #C31919) */
.kt-wordmark--logo { display: inline-flex; flex-direction: column; align-items: flex-end; }
.kt-wordmark__logo { display: block; width: 172px; height: auto; }
.kt-wordmark--logo .kt-wordmark__tag { font: 500 12px/1.2 var(--font-body); letter-spacing: 0; text-transform: none; color: var(--color-link); margin-top: 2px; }
@media (min-width: 80em) { .kt-wordmark__logo { width: 190px; } }
@media (max-width: 47.99em) { .kt-wordmark__logo { width: 152px; } }

.kt-menu-toggle { display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; color: var(--color-ink); font-size: 20px; line-height: 1; padding: 6px; min-width: 44px; min-height: 44px; cursor: pointer; }
.kt-menu-toggle:active { transform: translateY(1px); }
.kt-menu-toggle__icon::before { content: "\2630"; }
.kt-header.is-open .kt-menu-toggle__icon::before { content: "\2715"; font-size: 20px; }

/* スマホ・タブレット: メニューは開閉式の一覧 */
.kt-nav { flex-basis: 100%; }
.kt-js .kt-nav { display: none; }
.kt-js .kt-header.is-open .kt-nav { display: block; }
.kt-nav__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--color-rule-header); }
.kt-nav__item { list-style: none; border-bottom: 1px solid var(--color-rule-header); }
.kt-nav__link, .kt-nav__trigger {
	display: flex; align-items: center; width: 100%; min-height: 44px; padding: 12px 0;
	font: 500 14px/1.2 var(--font-body); color: var(--color-nav); text-decoration: none;
	background: none; border: 0; cursor: pointer; text-align: left; white-space: nowrap;
}
.kt-nav__link[aria-current="page"] { color: var(--color-link); text-decoration: underline; text-underline-offset: 5px; }
.kt-nav__trigger:hover, .kt-nav__link:hover { text-decoration: underline; text-underline-offset: 5px; }
.kt-nav__trigger:active, .kt-nav__link:active { transform: translateY(1px); }
.kt-nav__panel { padding: 0 0 16px; }
.kt-nav__sub { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.kt-nav__sub--cols { grid-template-columns: minmax(0, 1fr); }
.kt-nav__sub li { list-style: none; }
.kt-nav__sub a { display: block; padding: 8px 0; font-size: 14px; color: var(--color-nav); text-decoration: none; white-space: nowrap; }
.kt-nav__sub a:hover { text-decoration: underline; text-underline-offset: 4px; }
.kt-nav__sub a[aria-current="page"] { color: var(--color-link); text-decoration: underline; text-underline-offset: 4px; }
.kt-nav__all { display: inline-block; margin-top: 8px; font-size: 12px; color: var(--color-link); text-decoration: underline; text-underline-offset: 5px; white-space: nowrap; }
.kt-nav__all::after { content: " \2192"; }

.kt-search { padding: 16px 0 8px; }
.kt-search__toggle { display: inline-flex; align-items: center; gap: 4px; background: none; border: 1px solid var(--color-search-line); padding: 9px 13px; font: 500 12px/1.2 var(--font-body); color: var(--color-nav); cursor: pointer; white-space: nowrap; }
.kt-search__toggle::after { content: "\2315"; }
.kt-search__toggle:hover, .kt-search__toggle[aria-expanded="true"] { border-color: var(--color-nav); }
.kt-search__toggle:active { transform: translateY(1px); }
.kt-search__panel { margin-top: 12px; }
.kt-search__label { display: block; margin: 0 0 8px; font: 500 12px/1.4 var(--font-body); letter-spacing: 2px; text-transform: uppercase; color: var(--color-eyebrow); }
.kt-search__row { display: flex; align-items: stretch; gap: 0; }
.kt-search__input { flex: 1 1 auto; min-width: 0; height: 40px; margin: 0; padding: 0 12px; border: 1px solid var(--color-input-line); border-right: 0; border-radius: 0; background: var(--color-surface); color: var(--color-ink); font: 500 14px/1 var(--font-body); -webkit-appearance: none; appearance: none; }
.kt-search__input:hover { border-color: var(--color-nav); }
.kt-search__input:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 1px; }
.kt-search__submit { flex: none; height: 40px; margin: 0; padding: 0 16px; border: 0; border-radius: 0 2px 2px 0; background: var(--color-btn); color: var(--color-on-btn); font: 500 12px/1 var(--font-body); cursor: pointer; white-space: nowrap; }
.kt-search__submit:hover { background: var(--color-ink); }
.kt-search__submit:active { transform: translateY(1px); }
.kt-search__submit:disabled { opacity: 0.55; cursor: not-allowed; }
.kt-search--page { max-width: 560px; margin-top: 22px; }
.kt-search--page .kt-search__input, .kt-search--page .kt-search__submit { height: 44px; }

@media (min-width: 64em) { /* PC 用のメニュー(書体 Montserrat で6項目+検索が1行に入る幅。JS の desktop と同じ) */
	.kt-header__bar { flex-wrap: nowrap; }
	.kt-menu-toggle { display: none; }
	.kt-js .kt-nav, .kt-nav { display: flex; align-items: center; gap: 24px; flex-basis: auto; }
	.kt-nav__list { display: flex; align-items: center; gap: 24px; border: 0; }
	.kt-nav__item { position: relative; border: 0; }
	.kt-nav__link, .kt-nav__trigger { width: auto; min-height: 0; padding: 4px 0; font-size: 12px; }
	.kt-nav__panel {
		position: absolute; top: calc(100% + 16px); left: -20px; z-index: var(--z-panel);
		width: 240px; padding: 20px; background: var(--color-surface); border: 1px solid var(--color-tile-line);
		box-shadow: 0 16px 32px -16px var(--color-panel-shadow);
	}
	.kt-nav__panel--wide { width: 480px; }
	.kt-nav__sub { grid-template-columns: minmax(0, 1fr); }
	.kt-nav__sub--cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
	.kt-nav__sub a { padding: 6px 0; font-size: 12px; }
	.kt-search { position: relative; padding: 0; }
	.kt-search__panel { position: absolute; right: 0; top: calc(100% + 16px); z-index: var(--z-panel); width: 400px; margin: 0; padding: 20px; background: var(--color-surface); border: 1px solid var(--color-tile-line); box-shadow: 0 16px 32px -16px var(--color-panel-shadow); }
}
/* 幅 1200px 以上: 検索はボタンで開かず、ヘッダーの右に入力欄を常に出す。メニューの項目はその分だけ左に寄る(オーナー指示 2026-10-17) */
@media (min-width: 75em) {
	.kt-nav { flex: 1 1 auto; justify-content: flex-end; }
	.kt-search { flex: 0 1 340px; min-width: 240px; }
	.kt-search__toggle { display: none; }
	.kt-search__panel, .kt-search__panel[hidden] { display: block; position: static; width: auto; padding: 0; border: 0; box-shadow: none; background: none; }
	.kt-search__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }
	.kt-search__input, .kt-search__submit { height: 36px; }
}

/* =========================================================
   G-02 フッター(設計図の .page-footer)
   ======================================================= */
.kt-footer { background: var(--color-foot-bg); color: var(--color-foot-text); }
.kt-footer__inner { display: flex; justify-content: space-between; align-items: flex-start; gap: 22px; padding-block: 48px; font-size: 12px; }
.kt-footer a { color: inherit; text-decoration: none; }
.kt-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.kt-wordmark--footer { color: var(--color-foot-text); }
.kt-wordmark--footer .kt-wordmark__name { font: 500 20px/1.2 var(--font-body); letter-spacing: 2px; }
.kt-footer__line { font-size: 12px; max-width: 290px; line-height: 1.7; margin: 12px 0; }
.kt-footer__small { font-size: 12px; opacity: 0.75; margin: 12px 0 0; }
.kt-footer__links { display: flex; gap: 28px; flex-wrap: wrap; color: var(--color-foot-link); }
.kt-footer__links ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.kt-footer__links li { list-style: none; white-space: nowrap; }

/* =========================================================
   セクション(設計図の .area / .alt / .tint / .sec-head)
   ======================================================= */
.kt-section { padding-block: 66px; }
.kt-section--alt { background: var(--color-alt); }
.kt-section--tint { background: var(--color-tint); }
.kt-section--facts { padding-block: 32px 0; } /* S-02(Quick Facts と小札)は写真のすぐ下に置き、次の本文との間だけ通常の余白にする */
.kt-section__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 18px; margin-bottom: 25px; }
.kt-section__head > div { min-width: 0; }
.kt-section__head .kt-h2 { margin-bottom: 15px; }

/* カードの並び(設計図の .three / .two / .four) */
.kt-grid { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); }
.kt-grid--two { gap: 22px; }
.kt-grid--four { gap: 17px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 48em) {
	.kt-grid--cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.kt-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kt-grid--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* カード(設計図の .card) */
.kt-card { min-width: 0; } /* 写真の下の文字は、白い面を敷かずにセクションの背景の上に置く(オーナー指示 2026-10-17) */
#single main article.kt-card { margin-top: 0; } /* 特集記事の旧CSS(#single main article の上余白 80px / スマホ 40px)が「Keep Reading」のカードに掛からないように */
.kt-card__link { display: block; color: var(--color-ink); text-decoration: none; }
.kt-card__media { display: block; height: 200px; overflow: hidden; background: var(--color-alt); } /* 設計図の .card .placeholder{min-height:200px} */
.kt-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kt-card__body { display: block; min-width: 0; }
.kt-card__meta { display: flex; flex-wrap: wrap; gap: 2px 10px; margin-top: 13px; font: 500 12px/1.4 var(--font-body); letter-spacing: 1.2px; text-transform: uppercase; color: var(--color-cap); }
.kt-card__date { color: var(--color-meta); font-weight: 500; letter-spacing: 0.5px; font-variant-numeric: tabular-nums; }
.kt-card__title { display: block; font-size: 20px; line-height: 1.35; margin: 11px 0 8px; }
.kt-card__excerpt { display: block; font-size: 12px; line-height: 1.6; color: var(--color-card-text); margin: 5px 0; }
.kt-card__link:hover .kt-card__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.kt-card__link:active { transform: translateY(1px); }
.kt-card__link:focus-visible { outline-offset: 6px; }
/* 一覧型(H-06 の更新順4件のみ。オーナー回答で 10/10 の形を残す) */
.kt-card--row .kt-card__link { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; align-items: center; }
.kt-card--row .kt-card__media { height: 96px; }
.kt-card--row .kt-card__meta { margin-top: 0; }
.kt-card--row .kt-card__title { font-size: 20px; margin: 6px 0 0; }

/* 署名(設計図の .inline-author / .avatar) */
.kt-avatar { flex: none; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; background: var(--color-avatar-bg); border: 1px dashed var(--color-avatar-line); font-size: 12px; color: var(--color-avatar-text); }
.kt-avatar img { width: 100%; height: 100%; object-fit: cover; }
.kt-avatar:not(.kt-avatar--initials) { border: 0; background: none; } /* 点線の枠はイニシャル(写真が無いとき)用 */
.kt-byline { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--color-author); margin-top: 15px; }
.kt-byline__text { margin: 0; line-height: 1.5; }
.kt-byline__name a { text-decoration: none; }
.kt-byline__name a:hover { text-decoration: underline; text-underline-offset: 3px; }
.kt-byline__meta { display: block; color: var(--color-meta); font-size: 12px; }
.kt-byline__meta time { font-variant-numeric: tabular-nums; }
.kt-updated { margin: 15px 0 0; font-size: 12px; line-height: 1.5; color: var(--color-meta); }
.kt-updated time { font-variant-numeric: tabular-nums; }

/* 横の欄のカード(設計図の .sidecard) */
.kt-sidecard { border: 1px solid var(--color-side-line); padding: 19px; margin-bottom: 15px; background: var(--color-surface); }
.kt-sidecard__label { display: block; margin: 0; font: 500 12px/1.4 var(--font-body); color: var(--color-ink); }
.kt-sidecard__label--caps { text-transform: uppercase; }
.kt-sidecard p { font-size: 12px; line-height: 1.7; color: var(--color-side-text); margin: 12px 0; }
.kt-sidecard .kt-byline { margin-top: 15px; }
.kt-sidecard ul { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 8px; }
.kt-sidecard li { list-style: none; font-size: 12px; line-height: 1.6; color: var(--color-side-text); }
.kt-sidecard li a { text-decoration: none; }
.kt-sidecard li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.kt-author__links { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; }
.kt-author__links li { list-style: none; }
.kt-author__links li a { font-size: 12px; color: var(--color-link); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.kt-author__links li a:hover { text-decoration-thickness: 2px; }
.kt-doc-text .kt-author__links { margin-top: 14px; }

/* 枠付きの囲み(設計図の .softbox / .badge) */
.kt-softbox { border: 1px solid var(--color-soft-line); background: var(--color-soft-bg); padding: 24px; }
.kt-softbox p { font-size: 14px; line-height: 1.75; color: var(--color-soft-text); }
.kt-badge { display: inline-block; font: 500 12px/1.2 var(--font-body); letter-spacing: 1px; color: var(--color-badge); padding: 4px 7px; background: var(--color-badge-bg); text-transform: uppercase; }

/* 小札(設計図の .tagrow / .tag) */
.kt-tagrow { display: flex; gap: 7px; flex-wrap: wrap; margin: 18px 0 4px; padding: 0; list-style: none; }
.kt-tagrow li { list-style: none; }
.kt-tag { display: inline-block; font-size: 12px; border: 1px solid var(--color-tag-line); padding: 7px 10px; color: var(--color-ink); text-decoration: none; white-space: nowrap; }
a.kt-tag:hover { border-color: var(--color-cap); }

/* =========================================================
   記事の頭(設計図の .article-head / .crumb)
   ======================================================= */
.kt-article-head { padding-block: 54px 42px; }
.kt-crumbs { font-size: 12px; color: var(--color-crumb); margin-bottom: 27px; }
.kt-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 4px; }
.kt-crumbs li { list-style: none; white-space: nowrap; }
.kt-crumbs li:last-child { white-space: normal; overflow-wrap: anywhere; min-width: 0; }
.kt-crumbs li + li::before { content: "/"; margin-right: 4px; }
.kt-crumbs a { text-decoration: none; }
.kt-crumbs a:hover { text-decoration: underline; text-underline-offset: 3px; }
.kt-terms { margin: 0 0 12px; font: 500 12px/1.4 var(--font-body); letter-spacing: 2px; text-transform: uppercase; color: var(--color-eyebrow); }
.kt-terms a { text-decoration: none; white-space: nowrap; } /* リンクの途中では折り返さない(長いエリア名は短い表示名) */
.kt-terms a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* スポットの大きな写真(設計図: 頭と S-02 の間、左右 7%) */
.kt-hero-media { margin: 0 auto; }
.kt-hero-media img { display: block; width: 100%; height: auto; aspect-ratio: 21 / 9; object-fit: cover; background: var(--color-alt); }

/* S-02 Quick Facts(設計図の .info-cards) */
.kt-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.kt-facts li { list-style: none; background: var(--color-info-bg); padding: 19px 14px; min-width: 0; }
.kt-facts__label { display: block; font-size: 12px; color: var(--color-small-label); text-transform: uppercase; letter-spacing: 1px; }
.kt-facts__value { display: block; font-size: 14px; margin-top: 8px; font-weight: 500; overflow-wrap: anywhere; }

/* S-03 本文 + 横の欄(設計図の .article-body / .article-copy / .toc) */
.kt-layout { display: grid; gap: 48px; grid-template-columns: minmax(0, 1fr) 280px; }
.kt-layout__aside { align-self: start; }
.kt-toc { background: var(--color-toc-bg); border: 1px solid var(--color-toc-line); padding: 22px; font-size: 12px; line-height: 2; color: var(--color-toc-text); }
.kt-toc__label { margin: 0; font: 500 12px/2 var(--font-body); text-transform: uppercase; color: var(--color-toc-text); }
.kt-toc ol { margin: 0; padding: 0; list-style: none; counter-reset: kt-toc; }
.kt-toc li { list-style: none; counter-increment: kt-toc; }
.kt-toc li::before { content: counter(kt-toc) ". "; }
.kt-toc a { color: var(--color-toc-text); text-decoration: none; }
.kt-toc a:hover { text-decoration: underline; text-underline-offset: 3px; }

.kt-block { scroll-margin-top: 24px; }
.kt-copy-h2 { font: 500 32px/1.2 var(--font-display); color: var(--color-ink); margin: 34px 0 10px; overflow-wrap: anywhere; }
.kt-copy-h3 { font: 500 20px/1.35 var(--font-display); color: var(--color-ink); margin: 23px 0 8px; overflow-wrap: anywhere; }

/* 本文(post_content・WYSIWYG)。テーマ直下 style.css の .entry-content 用ルールより詳細度を上げて上書きする */
.kt-prose.entry-content > *, .kt-prose.entry-content p, .kt-prose.entry-content li { font-size: 14px; line-height: 1.85; color: var(--color-copy); }
.kt-prose.entry-content > * { margin: 0; }
.kt-prose.entry-content > * + * { margin-top: 14px; }
.kt-prose.entry-content h2 { font: 500 32px/1.2 var(--font-display); color: var(--color-ink); margin: 34px 0 10px; }
.kt-prose.entry-content h3 { font: 500 20px/1.35 var(--font-display); color: var(--color-ink); background: none; padding: 0; margin: 23px 0 8px; }
.kt-prose.entry-content h4 { font: 500 14px/1.5 var(--font-body); color: var(--color-ink); margin: 20px 0 6px; }
.kt-prose.entry-content a { color: var(--color-link); text-decoration: underline; text-underline-offset: 3px; }
.kt-prose.entry-content em { font-style: italic; }
/* 記事データの中に直接書かれた太さ(貼り付けで付く style="font-weight: 400" など)と、FAQ の質問全体を囲む strong は、周りと同じ 500 で表示する(データは変えない) */
.kt-main span[style*="font-weight"] { font-weight: inherit !important; }
.kt-faq .faq-content h3 strong, .kt-faq .faq-content h3 b, .kt-copy-h3 strong { font-weight: inherit; }
.kt-prose.entry-content strong { font-weight: 700; color: inherit; }
.kt-prose.entry-content ul, .kt-prose.entry-content ol { padding-left: 20px; }
.kt-prose.entry-content ul li { list-style: disc outside; }
.kt-prose.entry-content ol li { list-style: decimal outside; }
.kt-prose.entry-content img { max-width: 100%; height: auto; }

/* Highlights(既存のACFの値をそのまま表示。設計図: 写真の下に文) */
.kt-highlights { list-style: none; margin: 0; padding: 0; }
.kt-highlight { list-style: none; }
.kt-highlight + .kt-highlight { margin-top: 28px; }
.kt-highlight__media { margin: 0; }
.kt-highlight__media img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: var(--color-alt); }
.kt-highlight__text { font-size: 14px; line-height: 1.85; color: var(--color-copy); margin: 0; }

/* S-03 A Local's Perspective(設計図の .softbox) */
.kt-localview { margin-top: 24px; }
.kt-localview .kt-copy-h2 { font-size: 32px; margin: 10px 0 6px; }
.kt-localview__visited { margin: 0 0 10px; font-size: 12px; color: var(--color-soft-text); font-variant-numeric: tabular-nums; }
.kt-localview__photo img { display: block; width: 100%; height: auto; margin-top: 16px; }

/* Information(既存のWYSIWYGの表) + 地図(設計図の .mapbox は高さ 250px) */
.kt-info { font-size: 14px; color: var(--color-copy); }
.kt-info table { width: 100%; border-collapse: collapse; border-top: 1px solid var(--color-line); }
.kt-info tr { border-bottom: 1px solid var(--color-line); }
.kt-info th, .kt-info td { padding: 12px 12px 12px 0; vertical-align: baseline; text-align: left; line-height: 1.7; overflow-wrap: anywhere; }
.kt-info tr > :first-child { width: 34%; font-weight: 500; color: var(--color-ink); font-size: 12px; }
.kt-info a { color: var(--color-link); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.kt-info p { margin: 0; }
.kt-info ul, .kt-info ol { margin: 0; padding-left: 20px; }
.kt-info ul li { list-style: disc; }
.kt-info ol li { list-style: decimal; }
.kt-map { margin-top: 20px; scroll-margin-top: 24px; }
.kt-map iframe { display: block; width: 100%; height: 250px; border: 0; background: var(--color-alt); }

/* FAQ(既存のACFのWYSIWYG。h3 を押すと次の p が開く既存の動き) */
.kt-faq .faq-content h3, .kt-faq .faq-content p { margin: 0; font-size: 14px; line-height: 1.6; }
.kt-faq .faq-content h3 { position: relative; cursor: pointer; padding: 14px 40px 14px 0; border-top: 1px solid var(--color-line); font: 500 14px/1.5 var(--font-body); color: var(--color-ink); }
.kt-faq .faq-content h3 span.ico { position: absolute; right: 4px; top: 50%; width: 14px; height: 14px; margin-top: -7px; }
.kt-faq .faq-content h3 span.ico::before, .kt-faq .faq-content h3 span.ico::after { content: ""; position: absolute; left: 0; top: 6px; width: 14px; height: 1px; background: var(--color-ink); transition: transform 200ms var(--ease-out); }
.kt-faq .faq-content h3 span.ico::after { transform: rotate(90deg); }
.kt-faq .faq-content h3.active span.ico::after { transform: rotate(0deg); }
.kt-faq .faq-content h3:hover { color: var(--color-link); }
.kt-faq .faq-content p { display: none; padding: 0 40px 16px 0; color: var(--color-copy); line-height: 1.85; }
.kt-faq .faq-content { border-bottom: 1px solid var(--color-line); }

/* 特集記事: 本文の後の著者ボックス */
.kt-after-article { padding-block: 48px; background: var(--color-paper); }
.kt-after-article .kt-sidecard { max-width: 640px; margin: 0; }
.kt-plan { margin-top: 40px; max-width: 640px; }
.kt-grid--after-box { margin-top: 30px; } /* 設計図 S-04: 囲みの下のカード */
.kt-doc__photo, .kt-media-side__photo, .kt-localview__photo { margin: 0; }

/* =========================================================
   H-01 トップのヒーロー(設計図の .hero)
   ======================================================= */
.kt-hero { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: 565px; padding-block: 66px 72px; color: var(--color-on-btn); background: var(--color-foot-bg); overflow: hidden; }
.kt-hero__media, .kt-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.kt-hero__media { z-index: -2; margin: 0; }
.kt-hero__media img { object-fit: cover; object-position: center 40%; }
.kt-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, var(--color-hero-bottom), var(--color-hero-top) 75%); }
.kt-hero .kt-eyebrow, .kt-hero .kt-display, .kt-hero .kt-lede { color: var(--color-on-btn); }
.kt-hero .kt-lede { max-width: 620px; }
.kt-hero__sub { font-size: 12px; color: var(--color-on-btn); text-decoration: none; white-space: nowrap; }
.kt-hero__sub::after { content: " \2192"; }
.kt-hero__sub:hover { text-decoration: underline; text-underline-offset: 5px; }

/* H-03 エリア(設計図: 写真 + 名前 13px) */
.kt-areas { list-style: none; margin: 0; padding: 0; }
.kt-areas li { list-style: none; min-width: 0; }
.kt-area { display: block; text-decoration: none; color: var(--color-ink); }
.kt-area__media { display: block; height: 205px; overflow: hidden; background: var(--color-surface); } /* 設計図の .placeholder{min-height:205px} */
.kt-area__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kt-area__name { display: block; font: 500 14px/1.4 var(--font-body); margin-top: 11px; }
.kt-area:hover .kt-area__name { text-decoration: underline; text-underline-offset: 3px; }

/* H-04 目的別タイル(設計図の .categorytile) */
.kt-tiles { list-style: none; margin: 0; padding: 0; }
.kt-tiles li { list-style: none; min-width: 0; }
.kt-tile { display: flex; flex-direction: column; justify-content: space-between; gap: 12px; min-height: 90px; padding: 20px; background: var(--color-surface); border: 1px solid var(--color-tile-line); font-size: 14px; color: var(--color-ink); text-decoration: none; }
.kt-tile__label { overflow-wrap: anywhere; }
.kt-tile__go { font-size: 12px; color: var(--color-tile-sub); }
.kt-tile__go::after { content: " \2192"; }
.kt-tile:hover { border-color: var(--color-cap); }
.kt-tile:active { transform: translateY(1px); }

/* H-07 運営者(設計図の .media-side) */
.kt-media-side { display: grid; gap: 36px; grid-template-columns: 45% minmax(0, 1fr); align-items: center; }
.kt-media-side--text { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
.kt-media-side__photo img { display: block; width: 100%; height: auto; min-height: 285px; object-fit: cover; }

/* H-06 更新順4件(オーナー回答で 10/10 の形を残す) */
.kt-latest { display: grid; gap: 0 40px; grid-template-columns: minmax(0, 1fr); }
.kt-latest .kt-card { padding-block: 16px; border-bottom: 1px solid var(--color-line); }
@media (min-width: 48em) { .kt-latest { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* =========================================================
   C-01〜C-03 エリア一覧(設計図の .filterbar)
   ======================================================= */
.kt-intro { font-size: 14px; line-height: 1.7; color: var(--color-lede); max-width: 650px; }
.kt-intro p { margin: 0; }
.kt-intro p + p { margin-top: 10px; }
.kt-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 26px; padding: 0; list-style: none; }
.kt-filter li { list-style: none; }
.kt-filter a { display: inline-block; background: var(--color-surface); border: 1px solid var(--color-filter-line); padding: 11px 15px; font-size: 12px; color: var(--color-ink); text-decoration: none; white-space: nowrap; }
.kt-filter a:hover { border-color: var(--color-cap); }
.kt-filter a:active { transform: translateY(1px); }
.kt-group { scroll-margin-top: 24px; }
.kt-group + .kt-group { margin-top: 48px; }
.kt-group__title { font: 500 20px/1.35 var(--font-display); margin: 0 0 16px; padding-bottom: 8px; border-bottom: 1px solid var(--color-line); }

/* ページ送り(WP-PageNavi)。テーマ直下 style.css の body .wp-pagenavi …(赤い丸枠)より詳細度を上げて上書きする */
body .kt-pager .wp-pagenavi { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; width: auto; margin: 48px 0 0; font: 500 12px/1 var(--font-body); }
body .kt-pager .wp-pagenavi a, body .kt-pager .wp-pagenavi span { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 44px; height: 44px; line-height: 1; margin: 0; padding: 0 12px; border: 1px solid var(--color-filter-line); border-radius: 0; color: var(--color-ink); font-size: 12px; font-weight: 500; text-decoration: none; background: var(--color-surface); }
body .kt-pager .wp-pagenavi span.current { background: var(--color-btn); color: var(--color-on-btn); border-color: var(--color-btn); }
body .kt-pager .wp-pagenavi span.pages, body .kt-pager .wp-pagenavi span.extend { border: 0; background: none; color: var(--color-muted); }
body .kt-pager .wp-pagenavi a:hover { border-color: var(--color-cap); background: var(--color-surface); color: var(--color-ink); text-decoration: none; }

.kt-empty { max-width: 650px; }

/* =========================================================
   A-01〜A-05 About / まとめ記事(設計図の .summary / .two)
   ======================================================= */
.kt-summary { background: var(--color-surface); border: 1px solid var(--color-summary-line); padding: 17px 20px; }
.kt-summary b, .kt-summary__title { display: block; font: 500 14px/1.4 var(--font-body); color: var(--color-ink); }
.kt-summary p { font-size: 12px; line-height: 1.7; color: var(--color-summary-text); margin: 10px 0 0; }
.kt-doc-text p { font-size: 14px; line-height: 1.7; color: var(--color-lede); max-width: 650px; margin: 0; }
.kt-doc-text p + p { margin-top: 12px; }
.kt-doc-text a { color: var(--color-link); text-decoration: underline; text-underline-offset: 3px; }
.kt-doc__name { font: 500 20px/1.35 var(--font-display); margin: 0 0 10px; overflow-wrap: anywhere; }
.kt-company table { width: 100%; max-width: 860px; border-collapse: collapse; font-size: 14px; border-top: 1px solid var(--color-line); }
.kt-company tr { border-bottom: 1px solid var(--color-line); }
.kt-company th, .kt-company td { text-align: left; vertical-align: baseline; padding: 14px 12px 14px 0; line-height: 1.7; overflow-wrap: anywhere; color: var(--color-ink); }
.kt-company th { width: 34%; font-weight: 500; font-size: 12px; }
.kt-doc__photo img { display: block; width: 100%; height: auto; min-height: 285px; object-fit: cover; }

.kt-glance .kt-summary .kt-h2 { font-size: 32px; margin: 0 0 10px; }
.kt-stops { margin: 10px 0 0; padding: 0; list-style: none; counter-reset: kt-stop; }
.kt-stops li { list-style: none; counter-increment: kt-stop; font-size: 12px; line-height: 1.9; color: var(--color-summary-text); }
.kt-stops li::before { content: counter(kt-stop) ". "; }
.kt-stops a { text-decoration: underline; text-underline-offset: 3px; }

/* 固定ページ(本文は各ページの専用デザインのまま)・全エリア・404 */
.kt-page-body { max-width: 760px; padding-bottom: 66px; }
.kt-notfound { padding-bottom: 96px; }
body.kt-404 { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; } /* 中身が短いので、フッターを画面の下端に付ける(下に白い帯を残さない) */
body.kt-404 .kt-main { flex: 1 0 auto; }
.kt-count { color: var(--color-tile-sub); font-size: 12px; }

/* 空の広告枠は AdSense の承認まで隠す。本番では「追加CSS」に同じ指定があるが、追加CSSはテーマごとに保存されるため、
   新しいテーマに切り替えても効くよう、テーマ側にも同じ1行を持たせる(記事本文の AD_SLOT / .ad-box はそのまま) */
.ad-box.ad-empty { display: none; }

/* =========================================================
   スマホ(設計図の .viewport.mobile の指定)
   ======================================================= */
@media (max-width: 47.99em) {
	.kt-header__bar { padding: 18px 6%; }
	.kt-wordmark__name { font-size: 20px; }
	.kt-wrap { padding-inline: var(--pad-sp); }
	.kt-section { padding-block: 34px; }
	.kt-hero { min-height: 510px; padding-block: 34px 44px; }
	.kt-display { font-size: 36px; }
	.kt-h1 { font-size: 34px; }
	.kt-h2, .kt-copy-h2, .kt-localview .kt-copy-h2, .kt-glance .kt-summary .kt-h2, .kt-prose.entry-content h2 { font-size: 28px; }
	.kt-lede, .kt-intro, .kt-doc-text p { font-size: 14px; }
	.kt-article-head { padding-top: 34px; }
	.kt-section__head { align-items: flex-start; flex-wrap: wrap; row-gap: 8px; } /* 設計図どおり横並び。ただし小見出しが1行に入らないときは、リンクを見出しの下に回す */
	.kt-card__media { height: 170px; }
	.kt-card--row .kt-card__media { height: 96px; }
	.kt-tile { min-height: 100px; }
	.kt-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kt-layout { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.kt-media-side { grid-template-columns: minmax(0, 1fr); }
	.kt-footer__inner { display: block; }
	.kt-footer__links { margin-top: 22px; }
	.kt-company th, .kt-company td { display: block; width: auto; padding: 0; }
	.kt-company th { padding-top: 14px; }
	.kt-company td { padding-bottom: 14px; }
}
/* 全エリアのページのタイル: 名前はメニューと同じ短い表示名。名前が2行に折れないよう、PC は4列、タブレットは2列、スマホは1列。
   PC 以外は「名前 … 記事数」を横に並べる(幅 360px 未満は記事数を名前の下に) */
@media (max-width: 79.99em) {
	.kt-tiles--directory .kt-tile { flex-direction: row; align-items: center; min-height: 0; padding: 14px 16px; }
	.kt-tiles--directory .kt-tile__label { min-width: 0; }
	.kt-tiles--directory .kt-tile__go { flex: none; white-space: nowrap; }
}
@media (min-width: 48em) and (max-width: 79.99em) {
	.kt-tiles--directory.kt-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 47.99em) {
	.kt-tiles--directory.kt-grid--four { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}
/* 目的別タイル: 名前(例 Sights & Temples)が1行に入るよう、PC 用の幅未満は左右の余白を詰める */
@media (max-width: 63.99em) {
	.kt-tile { padding-inline: 12px; }
}
/* 幅 360px 未満 */
@media (max-width: 22.49em) {
	/* タイルは2列に入らないので「名前 … 記事数 / Explore →」の1列に。全エリアのページは名前が長いので、記事数を名前の下に */
	.kt-tiles.kt-grid--four { grid-template-columns: minmax(0, 1fr); gap: 8px; }
	.kt-tiles .kt-tile { flex-direction: row; align-items: center; min-height: 0; padding: 14px 16px; }
	.kt-tiles .kt-tile__go { flex: none; white-space: nowrap; }
	.kt-tiles--directory .kt-tile { flex-direction: column; align-items: flex-start; gap: 6px; }
	/* 特集記事の本文の表(料金表など)が画面からはみ出す場合は、表の中だけ横にスクロールできるようにする(本文は変えない) */
	.kt-article .entry-content table { display: block; max-width: 100%; overflow-x: auto; }
}

@media (prefers-reduced-motion: reduce) {
	.kt-header *, .kt-section *, .kt-main *, .kt-footer * { transition-duration: 1ms !important; animation-duration: 1ms !important; }
}