/* 安倍晴明暦の読み物のページ（暦と神々・吉凶と神々・方位と神々・元号と神々・天一神と太一。テンプレートは page-koyomi-kamigami.php ほか）と、
   暦想雑記の下の読み物（2026-10-28 宮の指示。共通の枠は inc/koyomi-essay-frame.php。テンプレートは template-zakki-article.php・page-chusei-shinto.php ほか）。
   2026-10-27 宮の指示「安倍晴明暦に属する他のページも同様にデザインを組み込んで（Figma なし）」：暦の読み方のページ（koyomi-yomikata.css）と同じ枠を使う。
   道しるべ・罫線の見出し・地紋・下のボタンの並びは koyomi-yomikata.css の .p-yomikata の作りをそのまま使い、ここでは本文の白い箱と読み物の中身だけを決める。文は変えない。
   文字サイズは onmyodo-typography.css が @layer の中で !important で決めているため、それより先に読み込むこのファイルでレイヤーを作って上書きする。 */

@layer koyomi-essay {
  body .p-news-single .p-news-single__title { font-size: 2.4rem !important; line-height: 1.5 !important; } /* お知らせの記事の題（白い箱の中。single.php） */
  body .p-news-single .p-koyomi-essay__body p.p-news-single__date { font-size: 1.5rem !important; line-height: 1.6 !important; } /* その日付（道しるべと同じ大きさ） */
  @media screen and (max-width: 767px) { body .p-news-single .p-news-single__title { font-size: 2rem !important; } }
  body .p-koyomi-essay .p-koyomi-essay__body p { font-size: 1.8rem !important; line-height: 2.1 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body :is(h2, h3):not(.c-title) { font-size: 2.2rem !important; line-height: 1.6 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body--h2 h3 { font-size: 2rem !important; line-height: 1.6 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body .p-koyomi-essay__text { font-size: 1.8rem !important; line-height: 2.1 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body :is(p.p-koyomi-essay__call, p.p-koyomi-essay__subhead) { font-size: 2rem !important; line-height: 1.8 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body :is(div.p-koyomi-essay__quote, blockquote p) { font-size: 2rem !important; line-height: 2 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body div.p-koyomi-essay__quote em { font-size: 1.6rem !important; line-height: 1.9 !important; }
  body .p-koyomi-essay .p-bunya :is(table, dt, dd, nav li, .bunya-sources li) { font-size: 1.6rem !important; line-height: 1.8 !important; }
  body .p-koyomi-essay .p-bunya :is(caption, p.bunya-small) { font-size: 1.4rem !important; line-height: 1.8 !important; }
  body .p-koyomi-essay .yakudoshi-hayami .c-title { font-size: 2.2rem !important; line-height: 1.6 !important; }
  body .p-koyomi-essay .yakudoshi-hayami .result .c-title { font-size: 2rem !important; }
  body .p-koyomi-essay .yakudoshi-hayami :is(.p-form-item__label, .p-form-table td, .p-form-table td p, select, .unit, .c-radio label, .calculate-button) { font-size: 1.6rem !important; line-height: 1.8 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body h4 { font-size: 2.4rem !important; line-height: 1.6 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body p.p-koyomi-essay__quote { font-size: 2rem !important; line-height: 2 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body p.p-koyomi-essay__quote span { font-size: 1.6rem !important; line-height: 1.9 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body figcaption { font-size: 1.4rem !important; line-height: 1.8 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body .p-koyomi-essay__era-name { font-size: 2.6rem !important; line-height: 1.4 !important; }
  body .p-koyomi-essay .p-koyomi-essay__body .p-koyomi-essay__era-sub { font-size: 1.6rem !important; line-height: 1.6 !important; }
  @media screen and (max-width: 767px) {
    body .p-koyomi-essay .p-koyomi-essay__body p { line-height: 2 !important; }
    body .p-koyomi-essay .p-koyomi-essay__body :is(h2, h3):not(.c-title) { font-size: 2rem !important; }
    body .p-koyomi-essay .p-koyomi-essay__body--h2 h3 { font-size: 1.8rem !important; }
    body .p-koyomi-essay .p-koyomi-essay__body .p-koyomi-essay__text { line-height: 2 !important; }
    body .p-koyomi-essay .p-koyomi-essay__body :is(p.p-koyomi-essay__call, p.p-koyomi-essay__subhead, div.p-koyomi-essay__quote, blockquote p) { font-size: 1.8rem !important; }
    body .p-koyomi-essay .p-bunya table { font-size: 1.4rem !important; }
    body .p-koyomi-essay .yakudoshi-hayami .c-title { font-size: 2rem !important; }
    body .p-koyomi-essay .yakudoshi-hayami .result .c-title { font-size: 1.8rem !important; }
    body .p-koyomi-essay .p-koyomi-essay__body h4 { font-size: 2rem !important; }
    body .p-koyomi-essay .p-koyomi-essay__body p.p-koyomi-essay__quote { font-size: 1.8rem !important; }
    body .p-koyomi-essay .p-koyomi-essay__body .p-koyomi-essay__era-name { font-size: 2.2rem !important; }
  }
}

/* ---------- 本文の白い箱（暦の読み方の節の箱と同じ：幅1000px・角丸10px） ---------- */
.p-koyomi-essay__body {
  max-width: 1000px;
  margin: 56px auto 0;
  padding: 56px 80px 64px;
  border-radius: 10px;
  background: #fff;
  color: var(--yomikata-ink);
  text-align: left;
}
.p-koyomi-essay__body p { margin: 0 0 1.8em; letter-spacing: .04em; }
.p-koyomi-essay__body > :last-child { margin-bottom: 0; }
.p-koyomi-essay__body > :first-child { margin-top: 0; }
.p-koyomi-essay__body a { color: #bf3823; text-decoration: underline; text-underline-offset: .3em; } /* 本文の中のリンクは朱（2026-10-28 宮の指示「文章中のリンクは赤文字にして」。申込みフォームの中のリンクと同じ色） */
.p-koyomi-essay__body img { max-width: 100%; height: auto; }
/* 本文の箱の中のボタン（京と若狭を結ぶ道の「参拝のご案内」） */
.p-koyomi-essay__btns { margin-top: 48px; text-align: center; }
.p-koyomi-essay__body .p-koyomi-essay__btns .c-btn { min-width: 262px; color: var(--yomikata-ink); text-decoration: none; }
.p-koyomi-essay__body .p-koyomi-essay__btns .c-btn:hover { color: #fff; }
/* 改行（br）で組んだ本文（霊獣）。文は変えない */
.p-koyomi-essay__text { margin: 0 0 1.8em; letter-spacing: .04em; }
/* 中央に置く一行（みつむねの皇子の呼びかけ・霊獣の題の下の一行） */
.p-koyomi-essay__body p:is(.p-koyomi-essay__call, .p-koyomi-essay__subhead) { text-align: center; font-weight: 500; letter-spacing: .1em; }
.p-koyomi-essay__body h3 + p.p-koyomi-essay__subhead { margin-top: -8px; color: var(--yomikata-sub); }

/* 小見出し：暦の読み方の組の見出しと同じ（字と同じ大きさの○と、下に墨の細い線） */
.p-koyomi-essay__body :is(h2, h3):not(.c-title) {
  margin: 64px 0 28px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--yomikata-ink);
  font-weight: 500;
  letter-spacing: .06em;
}
.p-koyomi-essay__body :is(h2, h3):not(.c-title)::before { content: "○" / ""; font-weight: 400; }
/* 大きな節を h2、その中を h3 で組んだ本文（分野説）：h3 は ○ と線のない一段小さい見出し */
.p-koyomi-essay__body--h2 h3 { margin: 40px 0 16px; padding-bottom: 0; border-bottom: 0; font-weight: 600; }
.p-koyomi-essay__body--h2 h3::before { content: none; }
/* 小見出し（元号と神々の明治〜令和・五つの元号が示す道）：引用（太字と左の縦線）と見分けられるよう、区切りの線の下に置いて節の始まりを示す。
   元号の小見出しは、元号の名を大きく、その意味を一段小さい薄い字で下に添える（2026-10-27 宮の指示「見出しなのか強調なのかわかりづらい」。文は変えない） */
.p-koyomi-essay__body h4 { margin: 64px 0 24px; padding-top: 40px; border-top: 1px solid var(--yomikata-line); font-weight: 600; letter-spacing: .06em; }
.p-koyomi-essay__era-name { display: block; font-weight: 600; letter-spacing: .16em; }
.p-koyomi-essay__era-sub { display: block; margin-top: 4px; color: var(--yomikata-sub); font-weight: 400; letter-spacing: .08em; }

/* 引用（詔・出典の言葉）：暦の読み方の引用と同じ、区切りの線と同じ細い縦線 */
.p-koyomi-essay__body p.p-koyomi-essay__quote {
  margin: 0 0 1.8em;
  padding: 4px 0 4px 24px;
  border-left: 1px solid var(--yomikata-line);
  font-weight: 600;
  letter-spacing: .08em;
}
.p-koyomi-essay__body p.p-koyomi-essay__quote span { display: block; margin-top: 4px; color: rgba(26, 26, 26, .6); font-weight: 400; letter-spacing: .04em; }
/* 暦想雑記の読み物の引用（div の引用・blockquote）も同じ細い縦線。みつむねの皇子の読み下し（em）は一段小さい薄い字 */
.p-koyomi-essay__body :is(div.p-koyomi-essay__quote, blockquote) {
  margin: 0 0 1.8em;
  padding: 4px 0 4px 24px;
  border-left: 1px solid var(--yomikata-line);
  font-weight: 600;
  letter-spacing: .08em;
}
.p-koyomi-essay__body blockquote p { margin: 0; letter-spacing: .08em; }
.p-koyomi-essay__body div.p-koyomi-essay__quote span { display: block; }
.p-koyomi-essay__body div.p-koyomi-essay__quote em { display: block; margin-top: 4px; color: rgba(26, 26, 26, .6); font-style: normal; font-weight: 400; letter-spacing: .04em; }

/* ---------- 厄年・凶年の早見（inc/yakudoshi-kyonen/section-hayami.php。文と組みは変えない） ----------
   2026-10-28 宮の指示「ここのデザインも統一して」：暦の読み方の相性の道具と同じ見た目にする。
   題（サイト共通の .c-title）は本文の小見出しと同じ ○ と墨の線（下の二色の線はやめる）、表は区切りの線の角丸の枠で項目名の地はサイトの淡い灰色（項目名の縦の線・柄の地はやめる）、
   選ぶ欄は墨の細い線・角丸10px・右の山形、「確認」のボタンは墨の塗り（暦の読み方の「確かめる」と同じ） */
.p-koyomi-essay__body .yakudoshi-kyonen__hayami { margin-top: 72px; }
.p-koyomi-essay__body .yakudoshi-hayami .c-title { margin: 0 0 20px !important; padding-bottom: 12px; border-bottom: 1px solid var(--yomikata-ink); color: var(--yomikata-ink); text-align: left; font-weight: 500; letter-spacing: .06em; }
.p-koyomi-essay__body .yakudoshi-hayami .c-title span { display: inline; padding: 0 !important; font-weight: 500; letter-spacing: .06em; }
.p-koyomi-essay__body .yakudoshi-hayami .c-title span::before { content: "○" / ""; position: static; width: auto; height: auto; background: none; font-weight: 400; }
.p-koyomi-essay__body .yakudoshi-hayami .c-title span::after { content: none; }
/* 結果は早見の中のもの：区切りの線の角丸の枠で囲み（暦の読み方で開いた中身と同じ）、中の題は ○ と線のない一段小さい見出しにする（2026-10-28 宮の指摘「結果表示が別セクションに見える」） */
.p-koyomi-essay__body .yakudoshi-hayami .result { margin-top: 32px !important; padding: 32px; border: 1px solid var(--yomikata-line); border-radius: 10px; }
.p-koyomi-essay__body .yakudoshi-hayami .result .c-title { margin: 48px 0 16px !important; padding-bottom: 0; border-bottom: 0; font-weight: 600; }
.p-koyomi-essay__body .yakudoshi-hayami .result > .c-title:first-child { margin-top: 0 !important; }
.p-koyomi-essay__body .yakudoshi-hayami .result .c-title span { font-weight: 600; }
.p-koyomi-essay__body .yakudoshi-hayami .result .c-title span::before { content: none; }
.p-koyomi-essay__body .yakudoshi-hayami .yakudoshi-hayami__lead { margin: 0; }
.p-koyomi-essay__body .yakudoshi-hayami .result > p { text-align: left; }
.p-koyomi-essay__body .yakudoshi-hayami .calculator { text-align: left; }
.p-koyomi-essay__body .yakudoshi-hayami .input-group { margin-top: 24px !important; text-align: center; }
/* 表 */
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table { display: table; width: 100%; margin: 0 !important; border: 1px solid var(--yomikata-line) !important; border-collapse: separate; border-spacing: 0; border-radius: 10px; background: #fff; text-align: left; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table :is(th, td) { padding: 18px 22px !important; border: 0 !important; border-bottom: 1px solid var(--yomikata-line) !important; background: none; vertical-align: middle; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table tr:last-child > * { border-bottom: 0 !important; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table th { width: 28%; border-right: 1px solid var(--yomikata-line) !important; background: var(--yomikata-soft) !important; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table tr:first-child > th { border-top-left-radius: 9px; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table tr:last-child > th { border-bottom-left-radius: 9px; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table th > div,
.p-koyomi-essay__body .yakudoshi-hayami .p-form-item__label__wrap { width: auto !important; padding: 0 !important; background: none !important; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-item__label { margin: 0; padding: 0 !important; border: 0 !important; color: var(--yomikata-ink); font-weight: 500; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table td p { margin: 0; }
.p-koyomi-essay__body .yakudoshi-hayami .p-form-table td p + p { margin-top: 6px; }
/* 性別・生年月日の欄 */
.p-koyomi-essay__body .yakudoshi-hayami .c-radio__wrap { display: flex !important; flex-wrap: wrap; gap: 8px 28px; padding: 0 !important; }
.p-koyomi-essay__body .yakudoshi-hayami .date-inputs { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.p-koyomi-essay__body .yakudoshi-hayami .c-select { width: auto; height: auto; margin: 0 !important; border: 0; background: none; }
.p-koyomi-essay__body .yakudoshi-hayami .c-select::before,
.p-koyomi-essay__body .yakudoshi-hayami .c-select::after { content: none; display: none; }
.p-koyomi-essay__body .yakudoshi-hayami .c-select select {
  width: auto;
  min-width: 92px;
  height: 44px;
  padding: 0 34px 0 14px;
  border: .5px solid var(--yomikata-ink);
  border-radius: 10px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M.5.5 5 5 9.5.5' fill='none' stroke='%231a1a1a'/%3E%3C/svg%3E") no-repeat right 12px center / 10px 6px;
  color: var(--yomikata-ink);
  cursor: pointer;
}
.p-koyomi-essay__body .yakudoshi-hayami .c-select select:focus { outline: 2px solid rgba(191, 56, 35, .35); outline-offset: 1px; }
/* 「厄年・凶年を確認」：暦の読み方の「確かめる」と同じ墨の塗りのボタン */
.p-koyomi-essay__body .yakudoshi-hayami .calculate-button {
  width: auto !important;
  min-width: 262px;
  min-height: 48px;
  margin: 32px auto 0;
  padding: 0 32px;
  white-space: nowrap;
  border: 1px solid var(--yomikata-ink) !important;
  border-radius: 8px !important;
  background: var(--yomikata-ink) !important;
  color: #fff !important;
  font-family: inherit;
  letter-spacing: .08em;
  cursor: pointer;
  transition: opacity .2s;
}
.p-koyomi-essay__body .yakudoshi-hayami .calculate-button:hover { opacity: .8; }
.p-koyomi-essay__body .yakudoshi-hayami .calculate-button:focus-visible { outline: 2px solid #bf3823; outline-offset: 3px; }
/* 結果の下の「過ごし方」：区切りの線の色 */
.p-koyomi-essay__body .yakudoshi-hayami .yakudoshi-paths__item { border-top-color: var(--yomikata-line); }
.p-koyomi-essay__body .yakudoshi-hayami .yakudoshi-paths__item:last-child { padding-bottom: 0; border-bottom: 0; } /* 最後の区切り線はなし（2026-10-28 宮の指示。結果の枠の線と重なるため） */

/* 分野説（本文は DB。表・目次・注・用語・出典）。色はサイトの淡い灰色と区切りの線の色にそろえる */
.p-bunya .bunya-lead { font-weight: 500; }
.p-bunya nav { margin: 0 0 1.8em; padding: 24px 28px; border-radius: 10px; background: rgba(226, 226, 224, .35); }
.p-bunya nav ol { margin: 0; padding-left: 1.6em; }
.p-bunya nav li + li { margin-top: 8px; }
.p-bunya section, .p-bunya li[id] { scroll-margin-top: 100px; }
.p-bunya .bunya-table { overflow-x: auto; margin: 0 0 1.8em; }
.p-bunya table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--yomikata-line); border-radius: 10px; }
.p-bunya :is(th, td) { padding: 12px 14px; border-bottom: 1px solid var(--yomikata-line); text-align: left; white-space: nowrap; }
.p-bunya :is(th, td) + :is(th, td) { border-left: 1px solid var(--yomikata-line); }
.p-bunya tbody tr:last-child > * { border-bottom: 0; }
.p-bunya thead th { background: rgba(226, 226, 224, .35); font-weight: 500; }
.p-bunya caption { margin: 0 0 12px; text-align: left; color: var(--yomikata-sub); }
.p-bunya dl { margin: 0 0 1.8em; }
.p-bunya dt { margin-top: 20px; font-weight: 600; }
.p-bunya dd { margin: 6px 0 0; }
.p-bunya .bunya-sources { padding-left: 1.6em; overflow-wrap: anywhere; }
.p-bunya .bunya-sources li + li { margin-top: 10px; }
.p-bunya .bunya-small { color: var(--yomikata-sub); }

/* 図（太一の書・袞衣） */
.p-koyomi-essay__figure { margin: 8px auto 56px; text-align: center; }
.p-koyomi-essay__figure img { display: block; max-width: 78%; height: auto; margin: 0 auto; }
.p-koyomi-essay__figure--wide img { max-width: 100%; border-radius: 10px; }
.p-koyomi-essay__figure figcaption { max-width: 560px; margin: 16px auto 0; color: rgba(26, 26, 26, .6); letter-spacing: .06em; }

/* 下のボタン：名が長いものがあるので、いちばん長い名に合わせて同じ幅にそろえる（最小は暦の読み方と同じ262px） */
.p-koyomi-essay .p-yomikata__links { display: grid; justify-content: center; }
.p-koyomi-essay .p-yomikata__links .c-btn { width: 100%; min-width: 262px; }

/* ---------- スマホ ---------- */
@media screen and (max-width: 767px) {
  .p-koyomi-essay__body { margin-top: 32px; padding: 32px 20px 40px; }
  .p-koyomi-essay__body :is(h2, h3):not(.c-title) { margin: 48px 0 20px; }
  .p-koyomi-essay__body--h2 h3 { margin: 32px 0 12px; }
  .p-koyomi-essay__body :is(div.p-koyomi-essay__quote, blockquote) { padding-left: 18px; }
  .p-bunya nav { padding: 20px; }
  .p-bunya :is(th, td) { padding: 10px; }
  .p-koyomi-essay__body .yakudoshi-hayami .p-form-table :is(th, td) { display: block; width: auto; padding: 12px 16px !important; }
  .p-koyomi-essay__body .yakudoshi-hayami .p-form-table th { border-right: 0 !important; border-radius: 0 !important; }
  .p-koyomi-essay__body .yakudoshi-hayami .p-form-table tr:first-child > th { border-top-left-radius: 9px !important; border-top-right-radius: 9px !important; }
  .p-koyomi-essay__body .yakudoshi-hayami .p-form-table tr:last-child > th { border-bottom: 1px solid var(--yomikata-line) !important; }
  .p-koyomi-essay__body .yakudoshi-hayami .c-select select { min-width: 84px; }
  .p-koyomi-essay__body .yakudoshi-hayami .result { padding: 20px 16px; }
  .p-koyomi-essay__body h4 { margin: 48px 0 20px; padding-top: 32px; }
  .p-koyomi-essay__body p.p-koyomi-essay__quote { padding-left: 18px; }
  .p-koyomi-essay__figure { margin-bottom: 40px; }
  .p-koyomi-essay__figure img { max-width: 100%; }
  .p-koyomi-essay .p-yomikata__links { justify-content: stretch; justify-items: center; }
  .p-koyomi-essay .p-yomikata__links .c-btn { width: 100%; max-width: 340px; min-width: 0; }
}