@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ============================================================
   ONMITSU ブログの外観
   本体サイト（https://on-mitsu.jp/）と同じ黒×金をヘッダー・フッターに使い、
   記事本文は白地で読みやすさを優先する。
   本体のトークンは src/site.css の :root と同じ値を使っている。
   ============================================================ */

:root {
  /* 本体サイトと同じ値 */
  --onmitsu-night: #06080d;
  --onmitsu-navy: #101f31;
  --onmitsu-paper: #f2efe8;
  --onmitsu-gold: #c8bea7;
  /* 白地に載せる金。#c8bea7 は白背景ではコントラストが足りないため濃くした版 */
  --onmitsu-gold-ink: #6b5d3a;
  --onmitsu-ink: #23282f;

  /* SWELL 側の変数を上書きして、テーマ全体に反映させる */
  --color_main: var(--onmitsu-gold-ink);
  /* SWELL既定の青リンクを、本体と同じ金系に置き換える */
  --color_link: var(--onmitsu-gold-ink);
  --swl-color_link: var(--onmitsu-gold-ink);
  --color_text: var(--onmitsu-ink);
  --swl-color_text: var(--onmitsu-ink);
  --swl-font_family: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --swl-font_family--logo: "Shippori Mincho", serif;
}

body {
  background: #fbfaf7;
  color: var(--onmitsu-ink);
  font-family: var(--swl-font_family);
  /* 日本語の可読性（本体サイトと同じ設計） */
  line-height: 1.9;
  letter-spacing: .04em;
}

/* ---------- ヘッダー：本体と同じ黒×金 ---------- */
.l-header,
.l-header__bar,
.l-header__inner {
  background: var(--onmitsu-night);
  color: var(--onmitsu-paper);
}

.l-header {
  border-bottom: 1px solid rgb(200 190 167 / 28%);
}

.l-header__logo a,
.l-header .c-catchphrase,
.l-header__bar,
.l-header__bar a {
  color: var(--onmitsu-paper);
}

.l-header__logo a {
  font-family: "Shippori Mincho", serif;
  letter-spacing: .08em;
}

.c-gnav > li > a,
.l-header .c-iconBtn,
.w-header a {
  color: var(--onmitsu-paper);
}

.c-gnav > li > a:hover,
.l-header a:hover {
  color: var(--onmitsu-gold);
}

/* ナビの下線も金に */
.c-gnav .ttl::after {
  background: var(--onmitsu-gold);
}

/* スマホの開閉メニュー */
.p-spMenu,
.p-spMenu__inner,
.p-spMenu__body {
  background: var(--onmitsu-night);
  color: var(--onmitsu-paper);
}

.p-spMenu a,
.p-spMenu .c-listMenu a {
  color: var(--onmitsu-paper);
  border-color: rgb(200 190 167 / 22%);
}

/* ---------- フッター：本体と同じ黒×金 ---------- */
.l-footer,
.l-footer__foot,
.l-footer__inner {
  background: var(--onmitsu-night);
  color: var(--onmitsu-paper);
}

.l-footer a,
.l-footer .c-listMenu a {
  color: var(--onmitsu-paper);
}

.l-footer a:hover {
  color: var(--onmitsu-gold);
}

.l-footer .c-widget__title {
  color: var(--onmitsu-gold);
  font-family: "Shippori Mincho", serif;
}

/* ---------- 見出し：明朝＋金の罫線（本体と同じ考え方） ---------- */
.post_content h2,
.p-articleTitle,
.c-postTitle__ttl,
.p-archiveTitle,
.c-secTitle {
  font-family: "Shippori Mincho", serif;
  font-weight: 600;
  letter-spacing: .04em;
  line-height: 1.5;
  color: var(--onmitsu-navy);
}

.post_content h2 {
  padding: 0 0 .5em;
  border-bottom: 2px solid var(--onmitsu-gold-ink);
  background: none;
}

.post_content h3 {
  font-family: "Shippori Mincho", serif;
  font-weight: 600;
  padding-left: .7em;
  border-left: 3px solid var(--onmitsu-gold-ink);
  color: var(--onmitsu-navy);
}

.post_content h4 {
  font-family: "Shippori Mincho", serif;
  color: var(--onmitsu-navy);
}

/* 記事タイトル下の金の細線（本体のセクション見出しと同じ表情） */
.c-postTitle__ttl::after,
.p-articleTitle::after {
  display: block;
  width: 3.2em;
  height: 1px;
  margin-top: .6em;
  background: var(--onmitsu-gold-ink);
  content: "";
}

/* ---------- 本文 ---------- */
.post_content {
  font-size: 1rem;
  line-height: 1.95;
  letter-spacing: .04em;
}

.post_content a {
  color: var(--onmitsu-gold-ink);
  text-underline-offset: .2em;
}

.post_content a:hover {
  color: var(--onmitsu-navy);
}

/* 引用は本体の「注記」と同じ、左に金の縦線 */
.post_content blockquote {
  border-left: 2px solid var(--onmitsu-gold-ink);
  background: rgb(200 190 167 / 12%);
}

/* サイドバー・一覧など本文外のリンク */
.widget a:not(.c-postThumb__cat),
.p-postList__title a,
.c-listMenu a {
  color: var(--onmitsu-ink);
}

.widget a:hover,
.c-listMenu a:hover {
  color: var(--onmitsu-gold-ink);
}

/* ---------- ボタン・リンク色 ---------- */
.c-postThumb__cat,
.p-postList__cat,
.c-categoryList a {
  background: var(--onmitsu-navy);
  color: var(--onmitsu-paper);
}

.c-pageTitle,
.p-pageTitle {
  font-family: "Shippori Mincho", serif;
}

/* ---------- 記事一覧カード ---------- */
.p-postList__title {
  font-family: "Shippori Mincho", serif;
  font-weight: 600;
  color: var(--onmitsu-navy);
}

/* ---------- 「ホームページへ戻る」導線をヘッダー右に置いたときの見た目 ---------- */
.l-header .c-headBtn__link,
.w-header .c-headBtn__link {
  border: 1px solid var(--onmitsu-gold);
  background: transparent;
  color: var(--onmitsu-paper);
}

.l-header .c-headBtn__link:hover {
  background: var(--onmitsu-gold);
  color: var(--onmitsu-night);
}

/* ---------- 動きを減らす設定への配慮（本体と同じ方針） ---------- */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
  }
}