@charset "UTF-8";

/*
 * fudosankanteishi main.css（指示書 v2 Stage 10）
 *
 * 下敷きは gametheory の main.css（レイアウト・罫線・余白・グローバルナビ・前後ナビ・パンくず・フッタの値）。
 *
 * 配色の方針: gametheory は「現行デザインの維持」（共通design.md 8章）を理由に赤基調をやめていたが、
 * 本サイトには利用者が見慣れた現行デザインが無い（旧サイトは消滅）。そのため 8章の既定に従い、
 * **アクセント赤は h2.page-title の文字色だけ**に使う。値は seihonet と同じ #b3141b。
 * 本文強調用の .red は別の赤 #cc0000（seihonet・gametheory の --emphasis と同じ値。共通design.md 8章）。
 * 公開時は本文に .red が無く定義していなかったが、公開後の修正4（2026-09-27）で46ページに強調を入れた。
 *
 * 本文（DB）で使われているタグは p / a / strong / h2 / h3 と、強調の span.red の6種。クラスは Googleサイト由来の
 * XqQF9c（見た目に関係しないため定義しない。design.md 2.2）と red の2つ。
 *
 * 注意: このファイルのコメント内にパスやワイルドカードを書かない。CSSのコメントは
 * 入れ子にできないため、コメント内にコメント終端記号が現れるとそこで構文が終わり、
 * 以降のブロック（:root など）が無効になる不具合が他サイトで実際に発生した。
 */

:root {
    --text: #333;
    --muted: #666;
    --line: #cccccc;
    --line-strong: #999999;
    --accent: #b3141b;
    --emphasis: #cc0000;
    --h2-border: #000000;
    --h2-bg: #eaeaea;
    --h3-border: #414141;
    --link: #3399ff;
    --link-hover: #ff6600;
    --footer-bg: #959595;
    --nav-border: #000000;
    --nav-hover: #efefef;
    --nav-current: #eaeaea;
    --notice-bg: #f6f6f6;
    --bg: #ffffff;
}

* {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0 auto;
    padding: 16px;
    max-width: 700px;
    font-family: system-ui, -apple-system, "Hiragino Kaku Gothic ProN",
        "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
    font-size: 16px;
    line-height: 1.7;
    color: var(--text);
    background: var(--bg);
    overflow-wrap: anywhere;
}

a {
    color: var(--link);
}

a:hover,
a:focus {
    color: var(--link-hover);
}

/* ------- 見出し ------- */
/*
 * h1 はヘッダのサイト名（.site-title でリセット）。
 * h2 には2種類ある（共通design.md 7章）:
 *   - ページを識別する見出し … h2.page-title（上罫線3px・灰背景・アクセント赤の文字）。トップ以外の全ページ
 *   - 本文中の見出し … bare h2（DB本文に22箇所。トップの本文冒頭を含む）と、一覧の見出し
 * h3 は DB本文に83箇所。gametheory の値（2px の枠）をそのまま使う。
 */
h2 {
    margin: 28px 0 16px;
    font-size: 1.3rem;
    line-height: 1.4;
}

h2.page-title {
    margin: 0 0 24px;
    padding: 0.9em;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--accent);
    border-top: 3px solid var(--h2-border);
    background: var(--h2-bg);
}

h3 {
    margin: 28px 0 8px;
    padding: 0.8em;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.4;
    border: 2px solid var(--h3-border);
}

/* sitemap.php は h3 自体がセクションの index へのリンク（gametheory の mokuji と同じ扱い） */
h3 a {
    color: inherit;
    text-decoration: none;
}

h3 a:hover,
h3 a:focus {
    color: var(--link-hover);
}

p {
    margin: 0 0 14px;
}

ul {
    margin: 0 0 16px;
    padding-left: 1.4em;
}

li {
    margin: 4px 0;
}

/* 本文中の強調（公開後の修正4）。色はアクセント赤とは別。太さは gametheory と同じ 600 */
.red {
    color: var(--emphasis);
    font-weight: 600;
}

/* 本文の先頭が見出しのとき、上の余白を詰める（トップの本文は bare h2 で始まる） */
.article > :first-child {
    margin-top: 0;
}

/* ------- 注意書き（tpl/notice.php） ------- */
.notice {
    margin: 0 0 24px;
    padding: 12px 14px;
    border-left: 4px solid var(--line-strong);
    background: var(--notice-bg);
    font-size: 0.9rem;
    line-height: 1.6;
}

.notice p {
    margin: 0;
}

/* ------- ページ一覧（各 index の本文の後・sitemap.php） ------- */
.section-pages {
    margin-top: 40px;
    padding-top: 8px;
    border-top: 1px solid var(--line);
}

.page-list ul {
    margin: 4px 0 8px;
}

/* sitemap.php の「ページ上部へ戻る」 */
.to-top {
    margin: 8px 0 28px;
    font-size: 0.9rem;
}

/* ------- グローバルナビ ------- */
/*
 * gametheory の値を踏襲: 下罫線 4px #000 / 項目の区切り 1px #000（先頭だけ左にも）/
 * 文字 #333・太字 / 背景 #fff、hover で #efefef。
 * JavaScript を使わないため、どの幅でも折り返して6項目すべてを表示する。
 */
.global-nav {
    margin: 0 0 20px;
    background: var(--bg);
    border-bottom: 4px solid var(--nav-border);
}

.global-nav ul {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0 0 5px;
    list-style: none;
}

.global-nav li {
    margin: 0;
    border-right: 1px solid var(--nav-border);
    font-weight: bold;
}

.global-nav li:first-child {
    border-left: 1px solid var(--nav-border);
}

.global-nav a {
    display: block;
    padding: 0.7em 1em;
    min-height: 44px;
    color: var(--text);
    text-decoration: none;
    white-space: nowrap;
}

.global-nav a:hover,
.global-nav a:focus {
    background-color: var(--nav-hover);
    color: var(--text);
}

/* 現在地（tpl/header.php が aria-current="page" と class="current" を付ける） */
.global-nav a.current {
    background-color: var(--nav-current);
    text-decoration: underline;
}

/* ------- 前へ / 次へ ------- */
/*
 * セレクタは4箇所すべてを nav:not(.breadcrumb):not(.global-nav) に揃える
 * （共通design.md 8章。パンくずとグローバルナビも nav 要素のため。gametheory と同じ）。
 */
nav:not(.breadcrumb):not(.global-nav) {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

nav:not(.breadcrumb):not(.global-nav) a {
    flex: 0 0 auto;
    max-width: 100%;
    padding: 14px 16px;
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 4px;
    color: var(--text);
    text-align: center;
    text-decoration: none;
}

nav:not(.breadcrumb):not(.global-nav) a.next {
    margin-left: auto;
}

nav:not(.breadcrumb):not(.global-nav) a:hover,
nav:not(.breadcrumb):not(.global-nav) a:focus {
    border-color: var(--line-strong);
}

/* ------- パンくずリスト（グローバルナビの直後・h2 の前） ------- */
.breadcrumb {
    margin: 0 0 16px;
    font-size: 0.85rem;
    line-height: 1.6;
    color: var(--muted);
}

.breadcrumb a {
    color: var(--muted);
}

.breadcrumb-sep {
    margin: 0 0.4em;
    color: var(--line-strong);
}

/* ------- サイトヘッダ（サイト名 = h1。ロゴ画像が無いためテキストで出す） ------- */
.site-header {
    margin-bottom: 12px;
}

.site-title {
    margin: 0;
    font-size: 1.5rem;
    line-height: 1.3;
}

.site-title a {
    color: var(--text);
    text-decoration: none;
}

.site-title a:hover,
.site-title a:focus {
    color: var(--link-hover);
}

/* ------- サイトフッタ ------- */
.site-footer {
    margin-top: 40px;
    padding: 16px;
    background: var(--footer-bg);
    color: #fff;
    font-size: 0.85rem;
}

.site-footer p {
    margin: 0 0 8px;
}

.site-footer p:last-child {
    margin-bottom: 0;
}

.copyright {
    font-size: 0.8rem;
}

.site-footer a {
    color: #fff;
}

/* ------- 広告（AdSense。Stage 11） ------- */
.ad-block {
    margin: 28px 0;
}

.splink {
    margin: 0 0 4px;
    font-size: 0.8rem;
    color: var(--muted);
}