@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


/* ========================================================================
 * 2026 リニューアル デザイントークン (Ph0)
 * 「誠実・丁寧・落ち着き・実績感・地域感」を表現する基盤変数。
 * 既存の hm-* / lp-* クラスや --f-mincho 変数群はそのまま温存し、
 * 新規セクション・ヘッダー/フッター刷新には下記 --rn-* を用いる。
 * ======================================================================== */
:root {
  /* カラー --- 白 + 石材グレー + 北陸の深緑 + 真鍮アクセント */
  --rn-color-bg:        #ffffff;
  --rn-color-bg-soft:   #f6f5f1; /* 和紙のような微温白 */
  --rn-color-ink:       #1f2421; /* 本文：墨に近い濃灰 */
  --rn-color-ink-sub:   #5b6360; /* サブテキスト */
  --rn-color-stone:     #8a8f8c; /* 石材グレー */
  --rn-color-line:      #e3e2dc; /* 罫線・境界 */
  --rn-color-accent:    #4a6b3a; /* 北陸の深緑 (メインアクセント / CTA) */
  --rn-color-accent-dk: #3a5530; /* 深緑 hover */
  --rn-color-warm:      #b08a4a; /* 真鍮アクセント (リンク下線等、控えめに) */
  --rn-color-warm-dk:   #8a6a36;
  --rn-color-danger:    #a8392e;

  /* フォントスタック */
  --rn-font-mincho:  "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", "ヒラギノ明朝 ProN", "Yu Mincho", "游明朝", serif;
  --rn-font-sans:    "Noto Sans JP", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", "Yu Gothic", "游ゴシック", sans-serif;
  --rn-font-figure:  "Cormorant Garamond", "Noto Serif JP", "Shippori Mincho", serif;

  /* タイポグラフィ */
  --rn-fs-base:      17px;
  --rn-lh-body:      1.9;
  --rn-lh-heading:   1.5;
  --rn-tracking-heading: 0.05em;

  /* レイアウト */
  --rn-container:    1120px;
  --rn-container-wide: 1280px;
  --rn-section-y-pc: 120px;
  --rn-section-y-sp: 72px;
  --rn-card-pad-pc:  32px;
  --rn-card-pad-sp:  20px;

  /* 角丸・境界・影 */
  --rn-radius:       3px;
  --rn-radius-lg:    4px;
  --rn-border:       1px solid var(--rn-color-line);
  --rn-shadow:       none;

  --rn-sp-actionbar-h: 64px;
  --rn-tap-min:      44px;

  --rn-easing:       cubic-bezier(0.2, 0.6, 0.2, 1);
  --rn-duration:     220ms;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --rn-duration: 0ms;
  }
}

/* ========================================================================
 * リニューアル共通ユーティリティ (Ph0)
 * セクション単位の刷新で再利用するベース。既存スタイルへの影響は
 * .rn- プレフィクスで完全に隔離。
 * ======================================================================== */
.rn-container {
  max-width: var(--rn-container);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}
.rn-container--wide { max-width: var(--rn-container-wide); }

.rn-section {
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
  background-color: var(--rn-color-bg);
  color: var(--rn-color-ink);
}
.rn-section--soft { background-color: var(--rn-color-bg-soft); }
@media (max-width: 834px) {
  .rn-section {
    padding-top: var(--rn-section-y-sp);
    padding-bottom: var(--rn-section-y-sp);
  }
}

.rn-eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.18em;
  color: var(--rn-color-accent);
  text-transform: uppercase;
  font-weight: 600;
  margin: 0 0 16px;
}

.rn-heading {
  font-family: var(--rn-font-mincho);
  font-weight: 600;
  color: var(--rn-color-ink);
  letter-spacing: var(--rn-tracking-heading);
  line-height: var(--rn-lh-heading);
  margin: 0 0 0.6em;
}
.rn-heading--xl { font-size: clamp(28px, 4.4vw, 44px); }
.rn-heading--lg { font-size: clamp(24px, 3.4vw, 34px); }
.rn-heading--md { font-size: clamp(20px, 2.4vw, 26px); }

.rn-text {
  font-family: var(--rn-font-sans);
  font-size: var(--rn-fs-base);
  line-height: var(--rn-lh-body);
  color: var(--rn-color-ink);
}
.rn-text--sub { color: var(--rn-color-ink-sub); }

.rn-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  min-height: var(--rn-tap-min);
  padding: 14px 28px;
  font-family: var(--rn-font-sans);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.04em;
  border-radius: var(--rn-radius);
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color var(--rn-duration) var(--rn-easing),
              border-color var(--rn-duration) var(--rn-easing),
              color var(--rn-duration) var(--rn-easing);
}
.rn-btn--primary {
  background-color: var(--rn-color-accent);
  color: #fff;
}
.rn-btn--primary:hover,
.rn-btn--primary:focus {
  background-color: var(--rn-color-accent-dk);
  color: #fff;
}
.rn-btn--ghost {
  background-color: transparent;
  color: var(--rn-color-accent);
  border-color: var(--rn-color-accent);
}
.rn-btn--ghost:hover,
.rn-btn--ghost:focus {
  background-color: var(--rn-color-accent);
  color: #fff;
}
.rn-btn:focus-visible {
  outline: 2px solid var(--rn-color-accent);
  outline-offset: 3px;
}

.rn-figure {
  font-family: var(--rn-font-figure);
  font-feature-settings: "lnum" 1;
}

.rn-divider {
  height: 1px;
  background: var(--rn-color-line);
  border: 0;
  margin: 32px 0;
}


/* ========================================================================
 * 2026 リニューアル: ヘッダー追従固定 (Ph1-S1)
 * Cocoon 既定ヘッダーは非表示にし、新 .rn-header を body 直下で固定表示。
 * ======================================================================== */

/* Cocoon 既定ヘッダーを非表示 (DOM は維持して SEO 影響を最小化) */
#header-container { display: none !important; }

/* 本文は新ヘッダーの高さぶん下げる */
.rn-has-fixed-header,
body.home,
body.page,
body.single,
body.archive,
body.search,
body.category,
body.tag,
body.error404 {
  padding-top: 132px; /* PC: top bar 76px + nav row 56px */
}
@media (max-width: 834px) {
  .rn-has-fixed-header,
  body.home,
  body.page,
  body.single,
  body.archive,
  body.search,
  body.category,
  body.tag,
  body.error404 {
    padding-top: 76px; /* SP: top bar のみ。ナビはドロワー化 */
  }
}

/* ヘッダー全体 */
.rn-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: var(--rn-color-bg);
  border-bottom: 1px solid var(--rn-color-line);
  font-family: var(--rn-font-sans);
}

/* トップバー (ロゴ + 電話 + CTA) */
.rn-header__bar {
  background: var(--rn-color-bg);
  border-bottom: 1px solid var(--rn-color-line);
}
.rn-header__inner {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 76px;
  padding-top: 10px;
  padding-bottom: 10px;
}

/* ブランド (ロゴ + サイト名) */
.rn-header__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: var(--rn-color-ink);
  margin-right: auto;
}
.rn-header__brand:hover { color: var(--rn-color-ink); }
.rn-header__logo {
  height: 40px;
  width: auto;
  display: block;
  object-fit: contain;
}
.rn-header__brandtext {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}
.rn-header__brandname {
  font-family: var(--rn-font-mincho);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--rn-color-ink);
  line-height: 1.2;
}
.rn-header__brandsub {
  font-size: 11px;
  color: var(--rn-color-ink-sub);
  letter-spacing: 0.06em;
  margin-top: 3px;
  line-height: 1.4;
}

/* 公式 hakamamori.com への動線リンク */
.rn-header__official {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 16px;
  padding: 6px 12px;
  font-family: var(--rn-font-sans);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink-sub);
  text-decoration: none;
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  background: var(--rn-color-bg-soft);
  white-space: nowrap;
  transition: border-color var(--rn-duration) var(--rn-easing),
              color var(--rn-duration) var(--rn-easing);
}
.rn-header__official:hover,
.rn-header__official:focus {
  color: var(--rn-color-accent);
  border-color: var(--rn-color-accent);
}
.rn-header__official-arrow {
  font-size: 14px;
  color: var(--rn-color-warm);
}

/* 電話番号ブロック */
.rn-header__contact {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1.2;
  gap: 2px;
}
.rn-header__tel {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-decoration: none;
  color: var(--rn-color-ink);
  line-height: 1.1;
  gap: 2px;
}
.rn-header__tellabel {
  font-size: 11px;
  color: var(--rn-color-ink-sub);
  letter-spacing: 0.08em;
}
.rn-header__telnum {
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--rn-color-accent);
}
.rn-header__tel:hover .rn-header__telnum { color: var(--rn-color-accent-dk); }
.rn-header__hours {
  font-size: 11px;
  color: var(--rn-color-ink-sub);
  letter-spacing: 0.05em;
}

/* CTA ボタン */
.rn-header__cta {
  font-size: 14px;
  padding: 12px 22px;
  white-space: nowrap;
  letter-spacing: 0.05em;
}

/* ハンバーガー (SP のみ表示) */
.rn-header__toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 10px;
  background: transparent;
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  cursor: pointer;
}
.rn-header__toggle-bar {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--rn-color-ink);
  transition: transform var(--rn-duration) var(--rn-easing),
              opacity var(--rn-duration) var(--rn-easing);
}

/* ナビ行 (PC 標準表示) */
.rn-header__nav {
  background: var(--rn-color-bg);
}
.rn-header__navlist {
  display: flex;
  align-items: stretch;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 4px;
  min-height: 56px;
}
.rn-header__navitem { display: flex; }
.rn-header__navitem a {
  display: inline-flex;
  align-items: center;
  padding: 16px 14px;
  font-family: var(--rn-font-mincho);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--rn-color-ink);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color var(--rn-duration) var(--rn-easing),
              border-color var(--rn-duration) var(--rn-easing);
}
.rn-header__navitem a:hover,
.rn-header__navitem a:focus {
  color: var(--rn-color-accent);
  border-bottom-color: var(--rn-color-accent);
}
.rn-header__navitem a[aria-current="page"] {
  color: var(--rn-color-accent);
  border-bottom-color: var(--rn-color-accent);
}

/* ---- タブレット/SP 切替 (834px 以下) ---- */
@media (max-width: 834px) {
  .rn-header__inner {
    gap: 12px;
    min-height: 72px;
  }
  .rn-header__brandtext { display: none; } /* SP ではロゴ画像のみ */
  .rn-header__contact { display: none; }   /* SP は下部固定バーに集約 (Ph1-S11) */
  .rn-header__cta { display: none; }       /* 同上 */
  .rn-header__official { display: none; }  /* SP では公式リンクをドロワー側に */
  .rn-header__toggle { display: flex; }
  .rn-header__logo { height: 36px; }

  /* ナビはドロワー: 通常非表示、開いた時に被せる */
  .rn-header__nav {
    position: fixed;
    top: 72px;
    left: 0;
    right: 0;
    max-height: calc(100vh - 72px);
    overflow-y: auto;
    background: var(--rn-color-bg);
    border-top: 1px solid var(--rn-color-line);
    transform: translateY(-12px);
    opacity: 0;
    visibility: hidden;
    transition: transform var(--rn-duration) var(--rn-easing),
                opacity var(--rn-duration) var(--rn-easing),
                visibility var(--rn-duration) step-end;
  }
  .rn-header--menu-open .rn-header__nav {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    transition: transform var(--rn-duration) var(--rn-easing),
                opacity var(--rn-duration) var(--rn-easing),
                visibility 0s step-start;
  }
  .rn-header__navlist {
    flex-direction: column;
    gap: 0;
    padding-top: 12px;
    padding-bottom: 24px;
  }
  .rn-header__navitem a {
    padding: 16px 8px;
    border-bottom: 1px solid var(--rn-color-line);
    font-size: 16px;
  }
  .rn-header__navitem a:hover,
  .rn-header__navitem a:focus,
  .rn-header__navitem a[aria-current="page"] {
    border-bottom-color: var(--rn-color-accent);
  }

  /* ハンバーガーアイコンの×変形 */
  .rn-header--menu-open .rn-header__toggle-bar:nth-child(1) { transform: translateY(11px) rotate(45deg); }
  .rn-header--menu-open .rn-header__toggle-bar:nth-child(2) { opacity: 0; }
  .rn-header--menu-open .rn-header__toggle-bar:nth-child(3) { transform: translateY(-11px) rotate(-45deg); }
}

/* タブレット (835-1023px) の電話ブロック調整 */
@media (min-width: 835px) and (max-width: 1023px) {
  .rn-header__telnum { font-size: 22px; }
  .rn-header__brandsub { display: none; }
  .rn-header__navitem a { padding: 16px 10px; font-size: 14px; }
}


/* ========================================================================
 * 2026 リニューアル: ヒーロー (Ph1-S2)
 * 横長フォト + 左にメインコピー(明朝特大) + 右に縦書きキャッチ + 3バッジ + CTA。
 * 既存 .hm-hero は CSS で非表示 (旧コードは将来削除可能だが現状残置)。
 * ======================================================================== */

/* 旧ヒーロー (hm-hero) は新ヒーローに置換するため、二重表示防止に非表示 */
body.page-id-907 .hm-hero { display: none !important; }

.rn-hero {
  position: relative;
  width: 100%;
  min-height: 580px;
  background: var(--rn-color-bg-soft);
  overflow: visible; /* 背景の 100vw はみ出しを見せるため */
  display: flex;
  align-items: center;
  margin: 0;
}
/* フルブリード hero による横スクロール発生を防止 */
body.page-id-907,
body.page-id-907 .hm-portal,
body.page-id-907 .entry-content { overflow-x: hidden; }
/* ヒーロー上の余白を詰める */
.hm-portal { padding-top: 0; }

.rn-hero__bg {
  position: absolute;
  top: 0;
  bottom: 0;
  /* 背景だけビューポート全幅 (junpei-sugiyama 両側いっぱい方式)。
     親要素を超えて画面幅へ広げる。セクションは通常フローのまま文字位置不変。 */
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  width: 100vw;
  z-index: 0;
}
.rn-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 35%;
  display: block;
}
/* 写真の上にコピー可読性のためグラデを薄く敷く */
.rn-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,0.92) 0%,
      rgba(255,255,255,0.78) 32%,
      rgba(255,255,255,0.32) 60%,
      rgba(255,255,255,0.10) 100%);
}
.rn-hero__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 48px;
  align-items: center;
  padding-top: 56px;
  padding-bottom: 56px;
  width: 100%;
  box-sizing: border-box;
}
.rn-hero__copy {
  max-width: 640px;
}
.rn-hero__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.18em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 18px;
}
.rn-hero__eyebrow-divider {
  color: var(--rn-color-line);
  margin: 0 4px;
  font-weight: 400;
}
.rn-hero__title {
  font-family: var(--rn-font-mincho);
  font-weight: 600;
  font-size: clamp(30px, 4.6vw, 50px);
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: var(--rn-color-ink);
  margin: 0 0 22px;
}
.rn-hero__title em {
  font-style: normal;
  color: var(--rn-color-accent);
}
.rn-hero__sub {
  font-family: var(--rn-font-sans);
  font-size: 17px;
  line-height: 1.9;
  color: var(--rn-color-ink-sub);
  margin: 0 0 28px;
  max-width: 540px;
}
.rn-hero__badges {
  list-style: none;
  margin: 0 0 32px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
}
.rn-hero__badges li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 10px 18px;
  border: 1px solid var(--rn-color-line);
  background: rgba(255,255,255,0.88);
  font-family: var(--rn-font-sans);
  font-size: 14px;
  color: var(--rn-color-ink);
  border-radius: var(--rn-radius);
}
.rn-hero__badge-num {
  font-family: var(--rn-font-figure);
  font-size: 26px;
  font-weight: 600;
  color: var(--rn-color-accent);
  line-height: 1;
}
.rn-hero__badge-num small {
  font-family: var(--rn-font-sans);
  font-size: 12px;
  margin-left: 2px;
  color: var(--rn-color-accent);
}
.rn-hero__badge-label,
.rn-hero__badge-text {
  font-size: 14px;
  line-height: 1.5;
  color: var(--rn-color-ink);
}
.rn-hero__badge-text strong {
  font-weight: 700;
  color: var(--rn-color-accent);
}
.rn-hero__btn {
  font-size: 16px;
  padding: 16px 32px;
}

/* 縦書きキャッチ (右側) */
.rn-hero__vkey {
  writing-mode: vertical-rl;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  height: 360px;
  margin-right: 8px;
}
.rn-hero__vkey-rule {
  display: inline-block;
  width: 1px;
  height: 100%;
  background: var(--rn-color-accent);
}
.rn-hero__vkey-text {
  font-family: var(--rn-font-mincho);
  font-size: 22px;
  line-height: 2;
  letter-spacing: 0.16em;
  color: var(--rn-color-ink);
  margin: 0;
  font-weight: 500;
}

/* タブレット (835-1023px) */
@media (max-width: 1023px) {
  .rn-hero { min-height: 520px; }
  .rn-hero__inner { gap: 32px; padding-top: 48px; padding-bottom: 48px; }
  .rn-hero__vkey { height: 320px; }
  .rn-hero__vkey-text { font-size: 19px; }
}

/* SP (834px 以下) */
@media (max-width: 834px) {
  .rn-hero { min-height: 0; }
  .rn-hero__inner {
    grid-template-columns: 1fr;
    padding-top: 36px;
    padding-bottom: 36px;
    gap: 24px;
  }
  .rn-hero__bg::after {
    background:
      linear-gradient(180deg,
        rgba(255,255,255,0.88) 0%,
        rgba(255,255,255,0.74) 60%,
        rgba(255,255,255,0.46) 100%);
  }
  .rn-hero__bg img { object-position: center 40%; }
  .rn-hero__title { font-size: clamp(24px, 7vw, 32px); }
  .rn-hero__sub { font-size: 15px; }
  .rn-hero__badges { gap: 8px; }
  .rn-hero__badges li { padding: 8px 12px; font-size: 13px; }
  .rn-hero__badge-num { font-size: 22px; }
  .rn-hero__vkey { display: none; } /* SP では縦書きキャッチ非表示 */
  .rn-hero__btn { width: 100%; max-width: 360px; }
}


/* ========================================================================
 * 2026 リニューアル: 選ばれる理由 4カラム (Ph1-S3)
 * 既存 .hm-card の絵文字テイストを保ちつつ、深緑アクセント・明朝見出しで整える。
 * ======================================================================== */
.rn-reasons {
  background: var(--rn-color-bg);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-reasons__header {
  text-align: center;
  margin-bottom: 56px;
}
.rn-reasons__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-reasons__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(24px, 3.6vw, 36px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0;
  line-height: 1.5;
}
.rn-reasons__title em {
  font-style: normal;
  color: var(--rn-color-accent);
}
.rn-reasons__sub {
  font-family: var(--rn-font-sans);
  font-size: 15px;
  color: var(--rn-color-ink-sub);
  line-height: 1.9;
  margin: 16px auto 0;
  max-width: 640px;
}
.rn-reasons__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.rn-reason {
  background: var(--rn-color-bg);
  border: 1px solid var(--rn-color-line);
  padding: var(--rn-card-pad-pc);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  border-radius: var(--rn-radius);
  transition: border-color var(--rn-duration) var(--rn-easing);
}
.rn-reason:hover {
  border-color: var(--rn-color-accent);
}
.rn-reason__icon {
  font-size: 34px; /* 絵文字を活かす大きさ */
  line-height: 1;
  margin: 0 0 18px;
  /* 深緑の薄い円を背景に置いて絵文字を浮かせる */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  background: var(--rn-color-bg-soft);
  border-radius: 50%;
}
.rn-reason__num {
  font-family: var(--rn-font-figure);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 8px;
  display: inline-block;
}
.rn-reason__title {
  font-family: var(--rn-font-mincho);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--rn-color-ink);
  margin: 0 0 14px;
  line-height: 1.5;
}
.rn-reason__body {
  font-family: var(--rn-font-sans);
  font-size: 15px;
  line-height: 1.9;
  color: var(--rn-color-ink-sub);
  margin: 0;
}

@media (max-width: 1023px) {
  .rn-reasons__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}
@media (max-width: 834px) {
  .rn-reasons { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
  .rn-reasons__header { margin-bottom: 36px; }
  .rn-reasons__grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .rn-reason {
    padding: var(--rn-card-pad-sp);
    flex-direction: row;
    align-items: flex-start;
    gap: 14px;
  }
  .rn-reason__main { flex: 1; min-width: 0; }
  .rn-reason__icon {
    width: 52px;
    height: 52px;
    font-size: 26px;
    margin: 0;
    flex-shrink: 0;
  }
  .rn-reason__title { font-size: 17px; }
  .rn-reason__body { font-size: 14px; }
}


/* ========================================================================
 * 2026 リニューアル: サービス3カード + 価格バナー (Ph1-S4)
 * 横並び 3 カード (画像上・本文下) + 右にダーク深緑の価格誘導ブロック。
 * SP では 1 列スタック、価格バナーは最後尾。
 * ======================================================================== */
.rn-services {
  background: var(--rn-color-bg-soft);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-services__header {
  text-align: center;
  margin-bottom: 56px;
}
.rn-services__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-services__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(24px, 3.6vw, 36px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0;
  line-height: 1.5;
}
.rn-services__layout {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 360px;
  gap: 28px;
  align-items: stretch;
}
.rn-service-card {
  background: var(--rn-color-bg);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--rn-color-ink);
  transition: border-color var(--rn-duration) var(--rn-easing);
}
.rn-service-card:hover {
  border-color: var(--rn-color-accent);
  color: var(--rn-color-ink);
}
.rn-service-card__image {
  display: block; /* span を block 化して aspect-ratio を有効に */
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--rn-color-stone);
}
.rn-service-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform var(--rn-duration) var(--rn-easing);
}
.rn-service-card:hover .rn-service-card__image img {
  transform: scale(1.03);
}
.rn-service-card__body {
  padding: 24px 24px 26px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1 1 auto;
}
.rn-service-card__title,
.rn-service-card__category,
.rn-service-card__lead,
.rn-service-card__more {
  display: block; /* span 要素を block 化 */
}
.rn-service-card__category {
  font-family: var(--rn-font-sans);
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--rn-color-accent);
  font-weight: 600;
}
.rn-service-card__title {
  font-family: var(--rn-font-mincho);
  font-size: 21px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--rn-color-ink);
  margin: 0;
  line-height: 1.45;
}
.rn-service-card__lead {
  font-family: var(--rn-font-sans);
  font-size: 14px;
  line-height: 1.85;
  color: var(--rn-color-ink-sub);
  margin: 0;
  flex: 1;
}
.rn-service-card__more {
  font-family: var(--rn-font-sans);
  font-size: 14px;
  color: var(--rn-color-accent);
  letter-spacing: 0.05em;
  margin-top: 8px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-weight: 600;
}
.rn-service-card__more::after {
  content: "→";
  transition: transform var(--rn-duration) var(--rn-easing);
}
.rn-service-card:hover .rn-service-card__more::after {
  transform: translateX(4px);
}

/* 価格誘導ブロック (深緑塗り) */
.rn-price-banner {
  background: var(--rn-color-accent);
  color: #fff;
  padding: 36px 30px 34px;
  border-radius: var(--rn-radius);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-decoration: none;
  border: 1px solid var(--rn-color-accent);
  transition: background-color var(--rn-duration) var(--rn-easing);
}
.rn-price-banner:hover {
  background: var(--rn-color-accent-dk);
  color: #fff;
}
.rn-price-banner__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 12px;
  letter-spacing: 0.22em;
  color: rgba(255,255,255,0.78);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-price-banner__title {
  font-family: var(--rn-font-mincho);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.5;
  margin: 0 0 14px;
  color: #fff;
}
.rn-price-banner__lead {
  font-family: var(--rn-font-sans);
  font-size: 14px;
  line-height: 1.85;
  color: rgba(255,255,255,0.86);
  margin: 0 0 22px;
}
.rn-price-banner__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--rn-font-sans);
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.05em;
  align-self: flex-start;
  padding: 12px 22px;
  border: 1px solid rgba(255,255,255,0.7);
  border-radius: var(--rn-radius);
  transition: background-color var(--rn-duration) var(--rn-easing);
}
.rn-price-banner:hover .rn-price-banner__cta {
  background: rgba(255,255,255,0.12);
}

@media (max-width: 1023px) {
  .rn-services__layout {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .rn-price-banner {
    grid-column: 1 / -1;
    padding: 28px 28px 30px;
  }
}
@media (max-width: 834px) {
  .rn-services { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
  .rn-services__header { margin-bottom: 36px; }
  .rn-services__layout {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .rn-service-card__body { padding: 18px 18px 20px; }
  .rn-service-card__title { font-size: 18px; }
  .rn-price-banner { padding: 24px 22px 28px; }
  .rn-price-banner__title { font-size: 19px; }
}


/* ========================================================================
 * 2026 リニューアル: 施工事例グリッド (Ph1-S5)
 * functions.php のショートコード [rn_case_grid] が出力する <ul.rn-case-grid> 用
 * ======================================================================== */
.rn-cases {
  background: var(--rn-color-bg);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-cases__header {
  text-align: center;
  margin-bottom: 48px;
}
.rn-cases__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-cases__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(24px, 3.6vw, 36px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0 0 12px;
  line-height: 1.5;
}
.rn-cases__sub {
  font-family: var(--rn-font-sans);
  font-size: 15px;
  color: var(--rn-color-ink-sub);
  line-height: 1.9;
  margin: 0 auto;
  max-width: 640px;
}
.rn-cases__footer {
  text-align: center;
  margin-top: 48px;
}

.rn-case-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.rn-case { display: contents; }
.rn-case__link {
  display: flex;
  flex-direction: column;
  background: var(--rn-color-bg);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  overflow: hidden;
  text-decoration: none;
  color: var(--rn-color-ink);
  transition: border-color var(--rn-duration) var(--rn-easing);
  height: 100%;
}
.rn-case__link:hover {
  border-color: var(--rn-color-accent);
  color: var(--rn-color-ink);
}
.rn-case__image {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--rn-color-stone);
}
.rn-case__body,
.rn-case__meta,
.rn-case__city,
.rn-case__type,
.rn-case__price,
.rn-case__date { display: block; }
.rn-case__meta { display: flex; flex-wrap: wrap; gap: 6px 10px; }
.rn-case__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform var(--rn-duration) var(--rn-easing);
}
.rn-case__link:hover .rn-case__image img {
  transform: scale(1.04);
}
.rn-case__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px 18px 20px;
  flex: 1;
}
.rn-case__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  font-family: var(--rn-font-sans);
  font-size: 11px;
  letter-spacing: 0.12em;
  font-weight: 600;
}
.rn-case__city {
  color: var(--rn-color-accent);
  border: 1px solid var(--rn-color-accent);
  padding: 2px 8px;
  border-radius: 2px;
}
.rn-case__type {
  color: var(--rn-color-ink-sub);
  border: 1px solid var(--rn-color-line);
  padding: 2px 8px;
  border-radius: 2px;
}
.rn-case__price {
  color: var(--rn-color-warm);
  border: 1px solid var(--rn-color-warm);
  padding: 2px 8px;
  border-radius: 2px;
  font-family: var(--rn-font-figure);
  font-weight: 700;
  letter-spacing: 0.04em;
}
.rn-case__title {
  font-family: var(--rn-font-mincho);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: var(--rn-color-ink);
  margin: 4px 0 4px;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rn-case__date {
  font-family: var(--rn-font-figure);
  font-size: 12px;
  color: var(--rn-color-ink-sub);
  letter-spacing: 0.05em;
  margin-top: auto;
}

@media (max-width: 1023px) {
  .rn-case-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
}
@media (max-width: 834px) {
  .rn-cases { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
  .rn-cases__header { margin-bottom: 28px; }
  .rn-case-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .rn-case__body { padding: 14px 14px 16px; }
  .rn-case__title { font-size: 14px; }
  .rn-case__meta { font-size: 10px; }
  .rn-cases__footer { margin-top: 32px; }
}


/* ========================================================================
 * 2026 リニューアル: 料金の目安 (Ph1-S6)
 * 5 種類の目安価格を簡潔表で透明性を担保。詳細は /ohaka-price-guide/。
 * ======================================================================== */
.rn-pricing {
  background: var(--rn-color-bg-soft);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-pricing__header {
  text-align: center;
  margin-bottom: 48px;
}
.rn-pricing__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-pricing__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(24px, 3.6vw, 36px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0 0 12px;
  line-height: 1.5;
}
.rn-pricing__sub {
  font-family: var(--rn-font-sans);
  font-size: 15px;
  color: var(--rn-color-ink-sub);
  line-height: 1.9;
  margin: 0 auto;
  max-width: 640px;
}
.rn-pricing__table-wrap {
  max-width: 880px;
  margin: 0 auto;
  background: var(--rn-color-bg);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  overflow: hidden;
}
.rn-pricing__table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--rn-font-sans);
}
.rn-pricing__table thead th {
  background: var(--rn-color-bg-soft);
  color: var(--rn-color-ink-sub);
  font-family: var(--rn-font-sans);
  font-size: 12px;
  letter-spacing: 0.18em;
  font-weight: 600;
  padding: 14px 24px;
  text-align: left;
  border-bottom: 1px solid var(--rn-color-line);
}
.rn-pricing__table thead th:nth-child(2),
.rn-pricing__table thead th:nth-child(3) {
  text-align: right;
}
.rn-pricing__table tbody tr {
  border-bottom: 1px solid var(--rn-color-line);
}
.rn-pricing__table tbody tr:last-child {
  border-bottom: none;
}
.rn-pricing__table tbody td {
  padding: 22px 24px;
  vertical-align: middle;
  font-size: 15px;
}
.rn-pricing__type {
  font-family: var(--rn-font-mincho);
  font-size: 17px;
  font-weight: 600;
  color: var(--rn-color-ink);
  letter-spacing: 0.04em;
  display: block;
  margin-bottom: 4px;
}
.rn-pricing__type-note {
  font-size: 12px;
  color: var(--rn-color-ink-sub);
  display: block;
  letter-spacing: 0.04em;
  line-height: 1.6;
}
.rn-pricing__price {
  font-family: var(--rn-font-figure);
  font-size: 22px;
  font-weight: 700;
  color: var(--rn-color-accent);
  text-align: right;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.rn-pricing__price-unit {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  font-weight: 500;
  color: var(--rn-color-ink-sub);
  margin-left: 4px;
}
.rn-pricing__included {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  color: var(--rn-color-ink-sub);
  line-height: 1.65;
}
.rn-pricing__note {
  max-width: 880px;
  margin: 18px auto 0;
  font-size: 13px;
  color: var(--rn-color-ink-sub);
  line-height: 1.85;
  font-family: var(--rn-font-sans);
}
.rn-pricing__note::before {
  content: "※";
  margin-right: 4px;
  color: var(--rn-color-accent);
}
.rn-pricing__footer {
  text-align: center;
  margin-top: 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.rn-pricing__cta {
  font-size: 16px;
  padding: 16px 32px;
}
.rn-pricing__detail-link {
  font-family: var(--rn-font-sans);
  font-size: 14px;
  color: var(--rn-color-accent);
  letter-spacing: 0.05em;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
}
.rn-pricing__detail-link:hover {
  color: var(--rn-color-accent-dk);
}

@media (max-width: 834px) {
  .rn-pricing { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
  .rn-pricing__header { margin-bottom: 28px; }
  /* テーブルは縦スクロールしない代わりに、3列目「含まれるもの」を非表示にし、
     1列目に補助情報を入れて2列構成にする */
  .rn-pricing__table thead th:nth-child(3),
  .rn-pricing__table tbody td:nth-child(3) {
    display: none;
  }
  .rn-pricing__table tbody td {
    padding: 16px 14px;
  }
  .rn-pricing__type { font-size: 15px; }
  .rn-pricing__price { font-size: 19px; }
  .rn-pricing__price-unit { font-size: 12px; }
  .rn-pricing__footer { margin-top: 24px; }
}


/* ========================================================================
 * 2026 リニューアル: コラム最新N件 (Ph1-S7)
 * functions.php の [rn_column_grid] 出力。地域メディア化を意識した
 * 簡潔なカード並び。
 * ======================================================================== */
.rn-columns {
  background: var(--rn-color-bg);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-columns__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 40px;
  flex-wrap: wrap;
}
.rn-columns__heading-block {
  flex: 1;
  min-width: 0;
}
.rn-columns__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-columns__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(24px, 3.6vw, 36px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0;
  line-height: 1.5;
}
.rn-columns__more {
  font-family: var(--rn-font-sans);
  font-size: 14px;
  color: var(--rn-color-accent);
  letter-spacing: 0.05em;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
  font-weight: 600;
  white-space: nowrap;
}
.rn-columns__more:hover { color: var(--rn-color-accent-dk); }

.rn-column-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.rn-column { display: contents; }
.rn-column__link {
  display: flex;
  flex-direction: column;
  background: var(--rn-color-bg);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  overflow: hidden;
  text-decoration: none;
  color: var(--rn-color-ink);
  transition: border-color var(--rn-duration) var(--rn-easing);
  height: 100%;
}
.rn-column__link:hover {
  border-color: var(--rn-color-accent);
  color: var(--rn-color-ink);
}
.rn-column__image {
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--rn-color-bg-soft);
}
.rn-column__body,
.rn-column__title,
.rn-column__date,
.rn-column__cat { display: block; }
.rn-column__meta { display: flex; flex-wrap: wrap; gap: 10px; }
.rn-column__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform var(--rn-duration) var(--rn-easing);
}
.rn-column__link:hover .rn-column__image img {
  transform: scale(1.03);
}
.rn-column__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 18px 22px;
  flex: 1;
}
.rn-column__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  font-family: var(--rn-font-sans);
  font-size: 12px;
}
.rn-column__date {
  font-family: var(--rn-font-figure);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink-sub);
}
.rn-column__cat {
  color: var(--rn-color-accent);
  border: 1px solid var(--rn-color-accent);
  padding: 2px 8px;
  border-radius: 2px;
  font-size: 11px;
  letter-spacing: 0.1em;
  font-weight: 600;
}
.rn-column__title {
  font-family: var(--rn-font-mincho);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--rn-color-ink);
  margin: 0;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (max-width: 1023px) {
  .rn-column-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }
}
@media (max-width: 834px) {
  .rn-columns { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
  .rn-columns__header { margin-bottom: 24px; }
  .rn-column-grid { gap: 14px; }
  .rn-column__body { padding: 14px 14px 18px; gap: 8px; }
  .rn-column__title { font-size: 15px; }
}


/* ========================================================================
 * 2026 リニューアル: カテゴリナビ (Ph6-A)
 * ======================================================================== */
.rn-categories {
  background: var(--rn-color-bg);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-categories__header {
  text-align: center;
  margin-bottom: 36px;
}
.rn-categories__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 12px;
}
.rn-categories__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(22px, 3.2vw, 30px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0;
  line-height: 1.5;
}
.rn-category-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 1fr;
  gap: 12px;
  list-style: none;
  margin: 0 auto;
  padding: 0;
  max-width: 1040px;
}
.rn-category {
  display: block;
  margin: 0;
}
.rn-category__link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: var(--rn-color-bg);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  text-decoration: none;
  color: var(--rn-color-ink);
  height: 100%;
  min-height: 68px;
  box-sizing: border-box;
  transition: border-color var(--rn-duration) var(--rn-easing);
}
.rn-category__link:hover {
  border-color: var(--rn-color-accent);
  color: var(--rn-color-ink);
}
/* 「すべての記事」タイル: 真鍮アクセントで差別化 */
.rn-category--all .rn-category__link {
  background: var(--rn-color-bg-soft);
  border-style: dashed;
}
.rn-category--all .rn-category__link:hover {
  border-style: solid;
  background: var(--rn-color-accent);
  color: #fff;
}
.rn-category--all .rn-category__link:hover .rn-category__label,
.rn-category--all .rn-category__link:hover .rn-category__count {
  color: #fff;
}
.rn-category__icon {
  font-size: 22px;
  flex-shrink: 0;
  line-height: 1;
}
.rn-category__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.rn-category__label {
  font-family: var(--rn-font-mincho);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--rn-color-ink);
}
.rn-category__count {
  font-family: var(--rn-font-figure);
  font-size: 12px;
  color: var(--rn-color-accent);
  letter-spacing: 0.05em;
}

@media (max-width: 1023px) { .rn-category-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px)  { .rn-category-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; } }


/* ========================================================================
 * 2026 リニューアル: サイトマップ HTML (Ph6-C)
 * /sitemap-html/ ページの [rn_sitemap_html] ショートコード用
 * ======================================================================== */
.rn-sitemap {
  font-family: var(--rn-font-sans);
  max-width: 920px;
  margin: 0 auto;
}
.rn-sitemap__group {
  margin: 0 0 36px;
  padding: 0 0 28px;
  border-bottom: 1px solid var(--rn-color-line);
}
.rn-sitemap__group:last-child { border-bottom: 0; }
.rn-sitemap__group-title {
  font-family: var(--rn-font-mincho);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  padding: 8px 14px;
  border-left: 4px solid var(--rn-color-accent);
  background: var(--rn-color-bg-soft);
  margin: 0 0 16px;
}
.rn-sitemap__group-title small {
  font-family: var(--rn-font-figure);
  font-size: 14px;
  color: var(--rn-color-ink-sub);
  font-weight: 500;
  margin-left: 8px;
}
.rn-sitemap__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 24px;
}
.rn-sitemap__list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px dashed var(--rn-color-line);
  font-size: 14px;
  line-height: 1.6;
}
.rn-sitemap__list a {
  color: var(--rn-color-ink);
  text-decoration: none;
  flex: 1;
  min-width: 0;
}
.rn-sitemap__list a:hover {
  color: var(--rn-color-accent);
  text-decoration: underline;
}
.rn-sitemap__date {
  font-family: var(--rn-font-figure);
  font-size: 12px;
  color: var(--rn-color-ink-sub);
  flex-shrink: 0;
  letter-spacing: 0.05em;
}

@media (max-width: 834px) {
  .rn-sitemap__list { grid-template-columns: 1fr; }
}

/* 月別アーカイブ (Ph8-B-13) */
.rn-monthly-archive {
  font-family: var(--rn-font-sans);
  max-width: 720px;
  margin: 0 auto;
}
.rn-monthly-archive__year {
  margin: 0 0 24px;
}
.rn-monthly-archive__year-title {
  font-family: var(--rn-font-mincho);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--rn-color-ink);
  padding: 6px 14px;
  margin: 0 0 12px;
  background: var(--rn-color-bg-soft);
  border-left: 3px solid var(--rn-color-accent);
}
.rn-monthly-archive__months {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.rn-monthly-archive__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 10px 14px;
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  text-decoration: none;
  color: var(--rn-color-ink);
  transition: border-color var(--rn-duration) var(--rn-easing);
}
.rn-monthly-archive__link:hover {
  border-color: var(--rn-color-accent);
  color: var(--rn-color-ink);
}
.rn-monthly-archive__month {
  font-family: var(--rn-font-mincho);
  font-size: 14px;
  font-weight: 600;
}
.rn-monthly-archive__count {
  font-family: var(--rn-font-figure);
  font-size: 12px;
  color: var(--rn-color-accent);
}
@media (max-width: 600px) {
  .rn-monthly-archive__months { grid-template-columns: repeat(3, 1fr); }
}


/* ========================================================================
 * 2026 リニューアル: お問い合わせ導線バナー (Ph1-S8)
 * 3 ペイン: 左=電話 / 中=3 アピール / 右=資料請求。深緑塗り。
 * ======================================================================== */
.rn-contact-banner {
  background: var(--rn-color-accent);
  color: #fff;
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
  position: relative;
}
.rn-contact-banner__heading {
  text-align: center;
  margin-bottom: 40px;
}
.rn-contact-banner__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.24em;
  color: rgba(255,255,255,0.78);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-contact-banner__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(22px, 3.4vw, 32px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #fff;
  margin: 0;
  line-height: 1.55;
}
.rn-contact-banner__grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr 1fr;
  gap: 32px;
  align-items: stretch;
  max-width: 1040px;
  margin: 0 auto;
}
.rn-contact-banner__pane {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: var(--rn-radius);
  padding: 28px 26px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* 左ペイン: 電話 */
.rn-contact-banner__tel-label {
  font-family: var(--rn-font-sans);
  font-size: 12px;
  letter-spacing: 0.16em;
  color: rgba(255,255,255,0.82);
  font-weight: 600;
  margin: 0 0 8px;
}
.rn-contact-banner__tel {
  font-family: var(--rn-font-figure);
  font-size: clamp(30px, 4.2vw, 44px);
  font-weight: 600;
  letter-spacing: 0.03em;
  color: #fff;
  text-decoration: none;
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  line-height: 1.1;
}
.rn-contact-banner__tel::before {
  content: "📞";
  font-size: 0.7em;
}
.rn-contact-banner__tel:hover { color: #fff; opacity: 0.92; }
.rn-contact-banner__hours {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  color: rgba(255,255,255,0.82);
  letter-spacing: 0.06em;
  margin: 10px 0 0;
  line-height: 1.7;
}

/* 中央ペイン: 3 アピール */
.rn-contact-banner__appeal {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.rn-contact-banner__appeal li {
  font-family: var(--rn-font-sans);
  font-size: 15px;
  color: #fff;
  letter-spacing: 0.03em;
  line-height: 1.6;
  padding-left: 28px;
  position: relative;
}
.rn-contact-banner__appeal li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  height: 20px;
  background: rgba(255,255,255,0.18);
  border-radius: 50%;
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  color: #fff;
  font-weight: 700;
}

/* 右ペイン: 資料請求 */
.rn-contact-banner__cta-pane {
  align-items: flex-start;
}
.rn-contact-banner__cta-label {
  font-family: var(--rn-font-sans);
  font-size: 12px;
  letter-spacing: 0.16em;
  color: rgba(255,255,255,0.82);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-contact-banner__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 18px 24px;
  background: #fff;
  color: var(--rn-color-accent);
  font-family: var(--rn-font-sans);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-decoration: none;
  border-radius: var(--rn-radius);
  border: 1px solid #fff;
  transition: background-color var(--rn-duration) var(--rn-easing),
              color var(--rn-duration) var(--rn-easing);
  min-height: var(--rn-tap-min);
}
.rn-contact-banner__cta-btn:hover {
  background: var(--rn-color-accent-dk);
  color: #fff;
  border-color: #fff;
}
.rn-contact-banner__cta-meta {
  font-family: var(--rn-font-sans);
  font-size: 12px;
  color: rgba(255,255,255,0.78);
  margin: 12px 0 0;
  letter-spacing: 0.06em;
}

@media (max-width: 1023px) {
  .rn-contact-banner__grid {
    grid-template-columns: 1fr 1fr;
    gap: 22px;
  }
  .rn-contact-banner__pane:first-child { grid-column: 1 / -1; align-items: center; text-align: center; }
  .rn-contact-banner__pane:first-child .rn-contact-banner__tel { justify-content: center; }
}
@media (max-width: 834px) {
  .rn-contact-banner { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
  .rn-contact-banner__heading { margin-bottom: 24px; }
  .rn-contact-banner__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .rn-contact-banner__pane { padding: 22px 20px; }
  .rn-contact-banner__pane:first-child { text-align: center; }
  .rn-contact-banner__tel { font-size: clamp(28px, 8vw, 34px); }
  .rn-contact-banner__cta-pane { align-items: stretch; }
}


/* ========================================================================
 * 2026 リニューアル: 展示場のご案内 (Ph1-S9)
 * 左:店舗写真 / 右:キャッチ + 4店舗テキスト + 詳細リンク
 * ======================================================================== */
.rn-showroom {
  background: var(--rn-color-bg);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-showroom__layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
  max-width: 1040px;
  margin: 0 auto;
}
.rn-showroom__image {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: var(--rn-radius);
  background: var(--rn-color-bg-soft);
}
.rn-showroom__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.rn-showroom__body {
  display: flex;
  flex-direction: column;
}
.rn-showroom__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.22em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-showroom__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(22px, 3.2vw, 32px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0 0 18px;
  line-height: 1.5;
}
.rn-showroom__lead {
  font-family: var(--rn-font-sans);
  font-size: 16px;
  line-height: 1.9;
  color: var(--rn-color-ink-sub);
  margin: 0 0 22px;
}
.rn-showroom__stores {
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
}
.rn-showroom__stores li {
  font-family: var(--rn-font-mincho);
  font-size: 14px;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  padding: 6px 14px;
  background: var(--rn-color-bg-soft);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
}
.rn-showroom__cta {
  align-self: flex-start;
}

@media (max-width: 834px) {
  .rn-showroom { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
  .rn-showroom__layout {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .rn-showroom__lead { font-size: 15px; }
  .rn-showroom__cta { align-self: stretch; }
  .rn-showroom__cta.rn-btn { width: 100%; }
}


/* ========================================================================
 * 2026 リニューアル: フッター (Ph1-S10)
 * Cocoon #footer (article-footer 等とは別) を CSS で隠し、新 rn-footer を出力。
 * ======================================================================== */

/* Cocoon サイトフッター非表示 (article-footer / entry-footer は触らない) */
#footer.footer-container { display: none !important; }

.rn-footer {
  background: var(--rn-color-ink);
  color: rgba(255,255,255,0.86);
  padding-top: 72px;
  padding-bottom: 28px;
  font-family: var(--rn-font-sans);
}
.rn-footer__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 56px;
  align-items: start;
  padding-bottom: 48px;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}

/* ブランドブロック */
.rn-footer__brand-link {
  display: inline-block;
  margin-bottom: 18px;
}
.rn-footer__logo {
  height: 38px;
  width: auto;
  filter: brightness(0) invert(1) opacity(0.95); /* 単色化して暗背景に馴染ませる */
}
.rn-footer__brand-name {
  font-family: var(--rn-font-mincho);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #fff;
  margin: 0 0 6px;
}
.rn-footer__brand-sub {
  font-size: 12px;
  color: rgba(255,255,255,0.62);
  letter-spacing: 0.05em;
  line-height: 1.7;
  margin: 0 0 20px;
}
.rn-footer__brand-sub a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.rn-footer__brand-sub a:hover { color: var(--rn-color-warm); }
.rn-footer__address {
  font-style: normal;
  display: flex;
  gap: 12px;
  align-items: baseline;
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.7;
  color: rgba(255,255,255,0.78);
}
.rn-footer__addr-label {
  flex-shrink: 0;
  font-family: var(--rn-font-sans);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--rn-color-warm);
  border: 1px solid var(--rn-color-warm);
  padding: 1px 6px;
  border-radius: 2px;
  font-weight: 600;
}
.rn-footer__contact {
  margin: 18px 0 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.rn-footer__tel {
  font-size: 28px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #fff;
  text-decoration: none;
  line-height: 1.1;
}
.rn-footer__tel:hover { color: #fff; opacity: 0.85; }
.rn-footer__hours {
  font-size: 12px;
  color: rgba(255,255,255,0.62);
  letter-spacing: 0.06em;
}

/* サイトマップ列 */
.rn-footer__nav-title {
  font-family: var(--rn-font-mincho);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: var(--rn-color-warm);
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.rn-footer__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.rn-footer__list a {
  color: rgba(255,255,255,0.86);
  font-size: 14px;
  letter-spacing: 0.05em;
  text-decoration: none;
  transition: color var(--rn-duration) var(--rn-easing);
}
.rn-footer__list a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }

/* 法務行 + © */
.rn-footer__legal {
  padding-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.rn-footer__legal-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
}
.rn-footer__legal-list a {
  color: rgba(255,255,255,0.62);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-decoration: none;
}
.rn-footer__legal-list a:hover { color: #fff; text-decoration: underline; }
.rn-footer__copy {
  font-family: var(--rn-font-figure);
  font-size: 12px;
  color: rgba(255,255,255,0.6);
  letter-spacing: 0.06em;
  margin: 0;
}
.rn-footer__copy a {
  color: rgba(255,255,255,0.78);
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,0.22);
  padding-bottom: 1px;
  transition: color var(--rn-duration) var(--rn-easing),
              border-color var(--rn-duration) var(--rn-easing);
}
.rn-footer__copy a:hover {
  color: #fff;
  border-bottom-color: rgba(255,255,255,0.6);
}
.rn-footer__copy-sep {
  margin: 0 6px;
  color: rgba(255,255,255,0.32);
}
.rn-footer__copy-operated {
  font-family: var(--rn-font-sans);
  font-size: 11px;
  color: rgba(255,255,255,0.6);
  letter-spacing: 0.1em;
  margin-right: 4px;
}

/* 広告 / PR 開示ブロック (景品表示法・ステマ規制対応) */
.rn-footer__disclosure {
  margin-top: 24px;
  padding: 16px 18px;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: var(--rn-radius);
  background: rgba(255,255,255,0.04);
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.rn-footer__disclosure-badge {
  flex-shrink: 0;
  display: inline-block;
  font-family: var(--rn-font-sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  color: var(--rn-color-ink);
  background: var(--rn-color-warm);
  padding: 4px 10px;
  border-radius: 2px;
}
.rn-footer__disclosure-text {
  font-family: var(--rn-font-sans);
  font-size: 12px;
  line-height: 1.85;
  color: rgba(255,255,255,0.82);
  margin: 0;
}
.rn-footer__disclosure-text a {
  color: rgba(255,255,255,0.95);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.rn-footer__disclosure-text a:hover {
  color: #fff;
}

@media (max-width: 600px) {
  .rn-footer__disclosure {
    flex-direction: column;
    gap: 10px;
  }
  .rn-footer__disclosure-badge {
    align-self: flex-start;
  }
}

@media (max-width: 1023px) {
  .rn-footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
  .rn-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 834px) {
  .rn-footer { padding-top: 56px; padding-bottom: 20px; }
  .rn-footer__grid {
    grid-template-columns: 1fr;
    gap: 32px;
    padding-bottom: 36px;
  }
  .rn-footer__legal {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
}


/* ========================================================================
 * 2026 リニューアル: SP 下部固定アクションバー (Ph1-S11)
 * @media (max-width: 834px) のみ表示。深緑塗りで 3 等分ボタン。
 * 年齢層高めの読者が常に「電話・相談」に到達できる導線。
 * ======================================================================== */
.rn-actionbar {
  display: none; /* PC では非表示 */
}

@media (max-width: 834px) {
  .rn-actionbar {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2px; /* WCAG 2.5.8 target spacing: 隣接ターゲットの干渉緩和 */
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    background: var(--rn-color-accent-dk); /* ギャップに見えてもよい色 */
    border-top: 1px solid var(--rn-color-accent-dk);
    min-height: var(--rn-sp-actionbar-h);
    box-shadow: 0 -2px 8px rgba(31, 36, 33, 0.18);
  }
  .rn-actionbar__btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 8px 4px;
    text-decoration: none;
    color: #fff;
    background: var(--rn-color-accent);
    transition: background-color var(--rn-duration) var(--rn-easing);
    min-height: var(--rn-sp-actionbar-h);
    font-family: var(--rn-font-sans);
    text-align: center;
  }
  .rn-actionbar__btn:hover,
  .rn-actionbar__btn:active,
  .rn-actionbar__btn:focus {
    background: var(--rn-color-accent-dk);
    color: #fff;
  }
  .rn-actionbar__btn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
  }
  .rn-actionbar__icon {
    font-size: 22px;
    line-height: 1;
  }
  .rn-actionbar__label {
    font-size: 11px;
    letter-spacing: 0.06em;
    font-weight: 600;
    line-height: 1.2;
  }

  /* 本文が SP 下部バーに隠れないよう padding-bottom を追加 */
  body.home,
  body.page,
  body.single,
  body.archive,
  body.search,
  body.category,
  body.tag,
  body.error404 {
    padding-bottom: var(--rn-sp-actionbar-h);
  }

  /* Cocoon の go-to-top ボタンを actionbar 上に押し上げる (重なり回避) */
  #go-to-top,
  #go-to-top.go-to-top {
    bottom: calc(var(--rn-sp-actionbar-h) + 12px) !important;
  }
}


/* ========================================================================
 * 2026 リニューアル: その他サービス・地域・お客様の声・注意ボックス (Ph1-S12)
 * 旧 hm-* ブロックの再構築。お墓のサービスは rn-services で扱う前提のため、
 * このセクションは仏壇 + 家・庭・遺品の 7 サービスを掲載。
 * ======================================================================== */

/* === その他サービス (仏壇 + 家・庭) === */
.rn-other-services {
  background: var(--rn-color-bg);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-other-services__header {
  text-align: center;
  margin-bottom: 48px;
}
.rn-other-services__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-other-services__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(22px, 3.4vw, 32px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0 0 12px;
  line-height: 1.5;
}
.rn-other-services__sub {
  font-family: var(--rn-font-sans);
  font-size: 15px;
  color: var(--rn-color-ink-sub);
  line-height: 1.85;
  margin: 0 auto;
  max-width: 640px;
}
.rn-other-services__group {
  margin-top: 36px;
}
.rn-other-services__group-title {
  font-family: var(--rn-font-mincho);
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--rn-color-ink);
  border-left: 3px solid var(--rn-color-accent);
  padding: 4px 12px;
  margin: 0 0 18px;
}
.rn-mini-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.rn-mini-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px 20px;
  background: var(--rn-color-bg);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  text-decoration: none;
  color: var(--rn-color-ink);
  transition: border-color var(--rn-duration) var(--rn-easing);
}
.rn-mini-card:hover { border-color: var(--rn-color-accent); color: var(--rn-color-ink); }
.rn-mini-card__icon {
  font-size: 22px;
  line-height: 1;
}
.rn-mini-card__title {
  font-family: var(--rn-font-mincho);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.04em;
  margin: 0;
  line-height: 1.5;
}
.rn-mini-card__text {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  color: var(--rn-color-ink-sub);
  line-height: 1.75;
  margin: 0;
}

@media (max-width: 1023px) { .rn-mini-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .rn-mini-grid { grid-template-columns: 1fr; } }


/* === 地域から探す === */
.rn-areas {
  background: var(--rn-color-bg-soft);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-areas__header { text-align: center; margin-bottom: 40px; }
.rn-areas__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-areas__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(22px, 3.4vw, 32px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0;
  line-height: 1.5;
}
.rn-areas__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  max-width: 1000px;
  margin: 0 auto;
}
.rn-area-box {
  background: var(--rn-color-bg);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  padding: 28px 30px;
}
.rn-area-box__title {
  font-family: var(--rn-font-mincho);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--rn-color-ink);
  margin: 0 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--rn-color-line);
}
.rn-area-box__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.rn-area-tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  font-family: var(--rn-font-sans);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--rn-color-ink);
  background: var(--rn-color-bg-soft);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  text-decoration: none;
  transition: border-color var(--rn-duration) var(--rn-easing),
              background-color var(--rn-duration) var(--rn-easing),
              color var(--rn-duration) var(--rn-easing);
}
.rn-area-tag:hover {
  border-color: var(--rn-color-accent);
  background: var(--rn-color-accent);
  color: #fff;
}
.rn-areas__footer { text-align: center; margin-top: 32px; }

@media (max-width: 834px) {
  .rn-areas { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
  .rn-areas__grid { grid-template-columns: 1fr; gap: 16px; }
  .rn-area-box { padding: 22px 22px; }
}


/* === お客様の声 ([ohaka_voices] ラッパー) === */
.rn-voices {
  background: var(--rn-color-bg);
  padding-top: var(--rn-section-y-pc);
  padding-bottom: var(--rn-section-y-pc);
}
.rn-voices__header { text-align: center; margin-bottom: 40px; }
.rn-voices__eyebrow {
  font-family: var(--rn-font-sans);
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--rn-color-accent);
  font-weight: 600;
  margin: 0 0 14px;
}
.rn-voices__title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(22px, 3.4vw, 32px);
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0;
  line-height: 1.5;
}
.rn-voices__inner {
  max-width: 1040px;
  margin: 0 auto;
}
/* [ohaka_voices] shortcode output styling overrides (既存のクラスに優しく介入) */
.rn-voices__inner .ohaka-voices,
.rn-voices__inner .ohaka-voices-grid {
  font-family: var(--rn-font-sans);
}
.rn-voices__footer {
  text-align: center;
  margin-top: 36px;
}
/* YARPP (関連投稿) は本セクションでは非表示 (個別記事ページでは表示される) */
.rn-voices__inner .yarpp-related,
.rn-voices__inner .yarpp { display: none !important; }

/* お客様の声カード本体: 3 列均等 + 簡潔表示 */
.rn-voices__inner .ohaka-voices-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.rn-voices__inner .ohaka-voice-card {
  background: #fdf9ee;
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  padding: 32px 28px 24px;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
}
.rn-voices__inner .ohaka-voice-card::before {
  content: "\201C";
  position: absolute;
  top: 6px;
  left: 18px;
  font-family: var(--rn-font-mincho);
  font-size: 48px;
  line-height: 1;
  color: var(--rn-color-warm);
  opacity: 0.5;
}
.rn-voices__inner .ohaka-voice-card__stars {
  color: var(--rn-color-warm);
  font-size: 16px;
  letter-spacing: 2px;
  margin: 12px 0 0;
}
.rn-voices__inner .ohaka-voice-card__body {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  display: flex;
  flex-direction: column;
  gap: 10px;
  quotes: none;
}
/* Cocoon 親テーマの blockquote::before/::after 引用符装飾を無効化 (本文と重なるため) */
.rn-voices__inner .ohaka-voice-card__body::before,
.rn-voices__inner .ohaka-voice-card__body::after {
  content: none !important;
  display: none !important;
}
.rn-voices__inner .ohaka-voice__quote {
  font-family: var(--rn-font-sans);
  font-size: 15px;
  line-height: 1.9;
  color: var(--rn-color-ink);
  margin: 0;
}
.rn-voices__inner .ohaka-voice__meta {
  font-family: var(--rn-font-sans);
  font-size: 12px;
  color: var(--rn-color-ink-sub);
  letter-spacing: 0.06em;
  margin: 6px 0 0;
  border-top: 1px dashed var(--rn-color-line);
  padding-top: 12px;
}

@media (max-width: 1023px) {
  .rn-voices__inner .ohaka-voices-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .rn-voices__inner .ohaka-voices-grid { grid-template-columns: 1fr; gap: 14px; }
  .rn-voices__inner .ohaka-voice-card { padding: 28px 24px 22px; }
}

@media (max-width: 834px) {
  .rn-voices { padding-top: var(--rn-section-y-sp); padding-bottom: var(--rn-section-y-sp); }
}


/* === 冬季のお知らせ (rn-notice) === */
.rn-notice-wrap {
  padding: 48px 0 64px;
  background: var(--rn-color-bg);
}
.rn-notice {
  max-width: 880px;
  margin: 0 auto;
  background: #fdf9ee; /* 控えめなクリーム */
  border: 1px solid var(--rn-color-warm);
  border-left: 4px solid var(--rn-color-warm);
  border-radius: var(--rn-radius);
  padding: 24px 28px;
}
.rn-notice__title {
  font-family: var(--rn-font-mincho);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-warm-dk);
  margin: 0 0 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.rn-notice__title::before { content: "⚠"; color: var(--rn-color-warm); }
.rn-notice__text {
  font-family: var(--rn-font-sans);
  font-size: 14px;
  line-height: 1.85;
  color: var(--rn-color-ink-sub);
  margin: 0;
}

@media (max-width: 834px) {
  .rn-notice-wrap { padding: 32px 16px 48px; }
  .rn-notice { padding: 20px 22px; }
}


/* ========================================================================
 * 2026 リニューアル: a11y 修正 + 既存ページデザイン反映 (Ph2-S13/S14b)
 * - TOP/その他ページで rn-hero/rn-page-hero を持つページの cocoon entry-title 非表示
 * - 既存ページのコンテンツ部に rn-container を内包させる視覚調整
 * ======================================================================== */

/* Cocoon の <h1 class="entry-title"> を、rn-hero を持つ TOP では非表示 (h1 重複解消) */
body.page-id-907 .entry-title,
body.page-id-907 .entry-header,
body.page-id-907 header.article-header { display: none !important; }

/* 一般 page (TOP 以外) の本文コンテナを rn-container 相当に整える */
body.page:not(.page-id-907) .entry-content,
body.page:not(.page-id-907) .article {
  font-family: var(--rn-font-sans);
  font-size: var(--rn-fs-base);
  line-height: var(--rn-lh-body);
  color: var(--rn-color-ink);
}
body.page:not(.page-id-907) .article h1,
body.page:not(.page-id-907) .article h2,
body.page:not(.page-id-907) .article h3,
body.page:not(.page-id-907) .article h4 {
  font-family: var(--rn-font-mincho);
  letter-spacing: var(--rn-tracking-heading);
  color: var(--rn-color-ink);
  line-height: var(--rn-lh-heading);
}
body.page:not(.page-id-907) .article h1.entry-title {
  font-size: clamp(24px, 3.4vw, 34px);
  margin-bottom: 0.6em;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--rn-color-line);
}
body.page:not(.page-id-907) .article h2 { font-size: clamp(20px, 2.6vw, 26px); }
body.page:not(.page-id-907) .article h3 { font-size: clamp(17px, 2.2vw, 20px); }

/* リンクは深緑ベース */
body.page:not(.page-id-907) .article a:not(.btn):not(.rn-btn) {
  color: var(--rn-color-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
body.page:not(.page-id-907) .article a:not(.btn):not(.rn-btn):hover {
  color: var(--rn-color-accent-dk);
}

/* WCAG AA コントラスト改善: インライン #666 / #888 文字色を ink-sub に上書き */
body.page .entry-content [style*="color:#888"],
body.page .entry-content [style*="color: #888"],
body.page .entry-content [style*="color:#666"],
body.page .entry-content [style*="color: #666"] {
  color: var(--rn-color-ink-sub) !important; /* 7.3:1 on white */
}
body.page .entry-content a[style*="color:#888"],
body.page .entry-content a[style*="color: #888"] {
  color: var(--rn-color-accent) !important;
  text-decoration: underline !important;
}

/* タップ領域 (target-size) 不足対策: 通常リンクに最小高を確保 */
body.page .entry-content a:not(.btn):not(.rn-btn):not(.hakalogo) {
  min-height: 24px;
  display: inline-block;
}

/* Cocoon パンくず: グレー文字をコントラスト基準に合わせる */
#breadcrumb .breadcrumb-caption,
.breadcrumb .breadcrumb-caption {
  color: var(--rn-color-ink-sub) !important; /* #5b6360 = 7.3:1 */
}
#breadcrumb a,
.breadcrumb a {
  color: var(--rn-color-accent) !important;
}
#breadcrumb a:hover,
.breadcrumb a:hover {
  color: var(--rn-color-accent-dk) !important;
}

/* CF7 form: 視覚調整 + フォーカス可視化 (送信挙動は触らない)
   重要: input/select/textarea のみに枠付け。span.wpcf7-form-control (checkbox/radio コンテナ) には適用しない */
.wpcf7-form input.wpcf7-form-control:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.wpcf7-form select.wpcf7-form-control,
.wpcf7-form textarea.wpcf7-form-control {
  font-family: var(--rn-font-sans);
  font-size: 16px;
  padding: 12px 14px;
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  background: #fff;
}
.wpcf7-form input.wpcf7-form-control:focus-visible,
.wpcf7-form select.wpcf7-form-control:focus-visible,
.wpcf7-form textarea.wpcf7-form-control:focus-visible {
  outline: 2px solid var(--rn-color-accent);
  outline-offset: 2px;
  border-color: var(--rn-color-accent);
}
.wpcf7-form input.wpcf7-form-control[type="submit"]:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -4px;
}

/* checkbox / radio リスト整形 (CF7 既定の span 構造を flex 化、自然な改行・等幅化) */
.wpcf7-form span.wpcf7-form-control.wpcf7-checkbox,
.wpcf7-form span.wpcf7-form-control.wpcf7-radio,
.wpcf7-form span.wpcf7-form-control.wpcf7-acceptance {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  padding: 4px 0;
  border: 0;
  background: transparent;
}
.wpcf7-form .wpcf7-list-item {
  margin: 0 !important;
}
.wpcf7-form .wpcf7-list-item label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  cursor: pointer;
  font-family: var(--rn-font-sans);
  font-size: 15px;
  color: var(--rn-color-ink);
  border-radius: var(--rn-radius);
  transition: background-color var(--rn-duration) var(--rn-easing);
}
.wpcf7-form .wpcf7-list-item label:hover {
  background: var(--rn-color-bg-soft);
}
.wpcf7-form .wpcf7-list-item input[type="checkbox"],
.wpcf7-form .wpcf7-list-item input[type="radio"] {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--rn-color-accent);
  flex-shrink: 0;
}
.wpcf7-form .wpcf7-list-item-label {
  line-height: 1.4;
}


/* ========================================================================
 * 2026 リニューアル: コラム個別記事 (single post) (Ph3-2)
 * 既存 Cocoon の article デザインを壊さず、リニューアル トークンを内側にだけ重ねる
 * ======================================================================== */

/* ========================================================================
 * 関連記事ブロックのデザイントークン統一 (Ph8-B-11)
 * YARPP + 既存 ohaka-related の見た目を新デザインに合わせる
 * ======================================================================== */
body.single-post .yarpp.yarpp-related,
body.single-post .ohaka-related {
  margin: 3em 0 2em;
  padding: 28px 26px 24px;
  background: var(--rn-color-bg-soft);
  border-top: 3px solid var(--rn-color-accent);
  border-radius: var(--rn-radius);
}
body.single-post .yarpp.yarpp-related h3,
body.single-post .ohaka-related h3,
body.single-post .ohaka-related__title {
  font-family: var(--rn-font-mincho);
  font-size: 18px !important;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--rn-color-ink);
  margin: 0 0 18px;
  padding: 0;
  border: 0;
  background: transparent;
}
body.single-post .yarpp.yarpp-related h3::before,
body.single-post .ohaka-related h3::before {
  content: "RELATED ";
  font-family: var(--rn-font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  color: var(--rn-color-accent);
  font-weight: 700;
  display: block;
  margin-bottom: 4px;
}
body.single-post .yarpp-thumbnails-horizontal {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
body.single-post .yarpp-thumbnail {
  display: flex !important;
  flex-direction: column;
  gap: 8px;
  text-decoration: none !important;
  color: var(--rn-color-ink) !important;
  background: #fff;
  padding: 10px;
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  transition: border-color var(--rn-duration) var(--rn-easing);
  width: auto !important;
}
body.single-post .yarpp-thumbnail:hover {
  border-color: var(--rn-color-accent);
}
body.single-post .yarpp-thumbnail img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 2px;
  margin: 0 !important;
}
body.single-post .yarpp-thumbnail-default img {
  opacity: 0.5;
  background: var(--rn-color-bg-soft);
}
body.single-post .yarpp-thumbnail-title {
  font-family: var(--rn-font-mincho);
  font-size: 13px;
  line-height: 1.55;
  color: var(--rn-color-ink);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (max-width: 834px) {
  body.single-post .yarpp-thumbnails-horizontal { grid-template-columns: 1fr 1fr; gap: 12px; }
  body.single-post .yarpp.yarpp-related,
  body.single-post .ohaka-related { padding: 22px 18px 18px; }
}


/* series_*.png プレースホルダのアイキャッチを小型表示 (実写真が割当できなかった記事用) */
body.single-post .eye-catch-wrap img[src*="/series_"],
body.single-post .eye-catch img[src*="series_"],
body.single-post figure.eye-catch img[src*="series_"],
body.archive .entry-card-thumb img[src*="series_"],
body.category .entry-card-thumb img[src*="series_"] {
  max-width: 160px !important;
  max-height: 90px !important;
  width: 160px !important;
  height: auto !important;
  object-fit: contain !important;
  opacity: 0.6;
  background: var(--rn-color-bg-soft);
  border: 1px solid var(--rn-color-line);
  padding: 8px;
  border-radius: var(--rn-radius);
  display: block;
  margin: 0 auto 1.5em;
}
/* eye-catch-wrap 自体のレイアウトも調整 */
body.single-post .eye-catch-wrap:has(img[src*="series_"]) {
  text-align: center;
  background: transparent;
}

/* 投稿詳細ページの記事本文だけにトークンを適用 (page は別ルール) */
body.single-post .entry-content {
  font-family: var(--rn-font-sans);
  font-size: var(--rn-fs-base);
  line-height: var(--rn-lh-body);
  color: var(--rn-color-ink);
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}
body.single-post .article h1.entry-title {
  font-family: var(--rn-font-mincho);
  font-size: clamp(24px, 3.4vw, 34px);
  font-weight: 600;
  letter-spacing: var(--rn-tracking-heading);
  line-height: var(--rn-lh-heading);
  color: var(--rn-color-ink);
  margin: 0 0 0.6em;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--rn-color-line);
}
body.single-post .entry-content h2 {
  font-family: var(--rn-font-mincho);
  font-size: clamp(20px, 2.6vw, 26px);
  font-weight: 600;
  letter-spacing: var(--rn-tracking-heading);
  line-height: var(--rn-lh-heading);
  color: var(--rn-color-ink);
  margin: 2em 0 0.8em;
  padding: 0 0 12px;
  border-bottom: 2px solid var(--rn-color-accent);
}
body.single-post .entry-content h3 {
  font-family: var(--rn-font-mincho);
  font-size: clamp(17px, 2.2vw, 21px);
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--rn-color-ink);
  margin: 1.8em 0 0.6em;
  padding: 4px 12px;
  border-left: 3px solid var(--rn-color-accent);
}
body.single-post .entry-content h4 {
  font-family: var(--rn-font-mincho);
  font-size: clamp(16px, 2vw, 18px);
  font-weight: 600;
  color: var(--rn-color-ink);
  margin: 1.4em 0 0.4em;
}
body.single-post .entry-content p {
  margin: 0 0 1.4em;
}
body.single-post .entry-content a:not(.btn):not(.rn-btn):not(.hakalogo) {
  color: var(--rn-color-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
body.single-post .entry-content a:not(.btn):not(.rn-btn):hover {
  color: var(--rn-color-accent-dk);
  text-decoration-thickness: 2px;
}
body.single-post .entry-content blockquote {
  background: var(--rn-color-bg-soft);
  border-left: 4px solid var(--rn-color-accent);
  padding: 20px 24px;
  margin: 1.6em 0;
  font-family: var(--rn-font-mincho);
  color: var(--rn-color-ink);
  border-radius: var(--rn-radius);
}
body.single-post .entry-content ul,
body.single-post .entry-content ol {
  padding-left: 1.6em;
  margin: 0 0 1.4em;
}
body.single-post .entry-content li { margin-bottom: 0.6em; }
body.single-post .entry-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.4em 0;
  font-size: 15px;
}
body.single-post .entry-content table th,
body.single-post .entry-content table td {
  padding: 12px 14px;
  border: 1px solid var(--rn-color-line);
  vertical-align: top;
}
body.single-post .entry-content table th {
  background: var(--rn-color-bg-soft);
  font-family: var(--rn-font-sans);
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--rn-color-ink);
  text-align: left;
}
body.single-post .entry-content strong {
  font-weight: 700;
  color: var(--rn-color-ink);
}
body.single-post .entry-content figure {
  margin: 1.6em auto;
}
body.single-post .entry-content figcaption {
  font-size: 13px;
  color: var(--rn-color-ink-sub);
  text-align: center;
  margin-top: 8px;
}
/* 目次 (Cocoon TOC) */
body.single-post .toc {
  background: var(--rn-color-bg-soft);
  border: 1px solid var(--rn-color-line);
  border-radius: var(--rn-radius);
  padding: 20px 24px;
  margin: 1.6em 0 2em;
  font-family: var(--rn-font-sans);
}
body.single-post .toc .toc-title {
  font-family: var(--rn-font-mincho);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--rn-color-ink);
}

@media (max-width: 834px) {
  body.single-post .entry-content { font-size: 16px; }
  body.single-post .entry-content table {
    display: block;
    overflow-x: auto;
  }
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/* Cocoon投稿ページ用カスタムCSS */

/* アイキャッチ画像を中央配置 */
.eye-catch-wrap {
    text-align: center;
    margin: 0 auto 2em;
}

.eye-catch {
    display: inline-block;
    margin: 0 auto;
}

/* 全体のフォント設定 */
.entry-content {
  font-family: 游ゴシック体, "Yu Gothic", YuGothic, Helvetica, Arial, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, sans-serif;

    line-height: 1.8;
	font-weight: 400;
    color: #151e2d;
}

/* 明朝のフォント設定 */
.mincho,h1, h2, h3 {
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    line-height: 1.8;
	font-weight: 400;
    /*color: #151e2d;*/
}

/* お問い合わせフォームセクション */
#form {
    background: linear-gradient(135deg, #f6f8fb 0%, #e9ecef 100%);
    padding: 3em 2em;
    border-radius: 10px;
    margin: 3em 0;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

/* Contact Form 7 のスタイル調整 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
    width: 100%;
    padding: 0.8em;
    border: 2px solid #e5e7eb;
    border-radius: 5px;
    font-size: 16px;
    transition: border-color 0.3s;
}

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 textarea:focus {
    border-color: #3b82f6;
    outline: none;
}

.wpcf7 input[type="submit"] {
    background: linear-gradient(135deg, #1e3a8a, #2563eb);
    color: white;
    padding: 1em 3em;
    border: none;
    border-radius: 50px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(30, 58, 138, 0.4);
    transition: all 0.3s;
	right: 15px;
}

.wpcf7 input[type="submit"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(30, 58, 138, 0.6);
}

/* スマホ対応 */
@media screen and (max-width: 768px) {
    .entry-content h2 {
        font-size: 1.4em;
        padding: 0.8em 1em;
    }
    
    .entry-content h3 {
        font-size: 1.2em;
        padding: 0.6em 0.8em 0.6em 2em;
    }
    
    .entry-content p {
        font-size: 15px;
    }
    
    #form {
        padding: 2em 1em;
    }
}

/* アニメーション効果 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.entry-content h2,
.entry-content h3 {
    animation: fadeInUp 0.6s ease-out;
}

/* スクロールバーのカスタマイズ */
.entry-content::-webkit-scrollbar {
    width: 8px;
}

.entry-content::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.entry-content::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #1e3a8a, #2563eb);
    border-radius: 4px;
}

.entry-content::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #2563eb, #1e3a8a);
}

.hakalogo{
	vertical-align:sub;
	width:auto;
	height:1em;
}

/* お問い合わせフォーム用のCTAボックススタイル */
.cta-box2 {
    padding: 20px;
    border: solid #1e3a8a 2px;
    border-radius: 12px;
}


/* ===============================================
   霊園データベースセクション用CSS
   =============================================== */

/* セクション全体 */
.hm-section--cemetery-db {
	background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
	padding: 60px 20px;
}

/* 霊園データベース イントロ */
.hm-cemetery-intro {
	background: #ffffff;
	border-radius: 12px;
	padding: 40px 30px;
	margin-bottom: 50px;
	text-align: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.hm-cemetery-intro__icon {
	font-size: 48px;
	margin-bottom: 15px;
}

.hm-cemetery-intro__title {
	font-size: 26px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 15px;
}

.hm-cemetery-intro__text {
	font-size: 15px;
	line-height: 1.8;
	color: #555;
}

/* エリアごとの区切り */
.hm-cemetery-area {
	margin-bottom: 50px;
}

.hm-cemetery-area__title {
	font-size: 24px;
	font-weight: bold;
	color: #333;
	margin-bottom: 30px;
	padding-bottom: 12px;
	border-bottom: 3px solid #2c5aa0;
	display: flex;
	align-items: center;
	gap: 10px;
}

.hm-cemetery-area__icon {
	font-size: 28px;
}

/* 霊園カードグリッド */
.hm-cemetery-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 25px;
	margin-bottom: 30px;
}

/* 霊園カード */
.hm-cemetery-card {
	background: #ffffff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	position: relative;
}

.hm-cemetery-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(44, 90, 160, 0.2);
}

/* バッジ */
.hm-cemetery-card__badge {
	position: absolute;
	top: 12px;
	right: 12px;
	padding: 5px 12px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: bold;
	color: #ffffff;
	z-index: 10;
}

.hm-cemetery-card__badge--popular {
	background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
}

.hm-cemetery-card__badge--historic {
	background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
}

/* 画像エリア */
.hm-cemetery-card__image {
	width: 100%;
	height: 180px;
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.hm-cemetery-card__placeholder {
	font-size: 20px;
	font-weight: bold;
	color: #ffffff;
	text-align: center;
}

/* コンテンツ部分 */
.hm-cemetery-card__content {
	padding: 20px;
	flex-grow: 1;
}

.hm-cemetery-card__name {
	font-size: 18px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 8px;
}

.hm-cemetery-card__location {
	font-size: 13px;
	color: #777;
	margin-bottom: 12px;
}

.hm-cemetery-card__description {
	font-size: 14px;
	line-height: 1.6;
	color: #555;
	margin-bottom: 15px;
}

/* タグ */
.hm-cemetery-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.hm-cemetery-card__tag {
	display: inline-block;
	background: #e9ecef;
	color: #495057;
	padding: 4px 10px;
	border-radius: 12px;
	font-size: 11px;
	font-weight: 500;
}

/* フッター部分 */
.hm-cemetery-card__footer {
	padding: 15px 20px;
	background: #f8f9fa;
	border-top: 1px solid #e9ecef;
}

.hm-cemetery-card__link {
	color: #2c5aa0;
	font-size: 14px;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* セクションフッター */
.hm-cemetery-footer {
	text-align: center;
	background: #ffffff;
	padding: 40px 30px;
	border-radius: 12px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
	margin-top: 40px;
}

.hm-cemetery-footer__text {
	font-size: 15px;
	line-height: 1.8;
	color: #555;
	margin-bottom: 25px;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
	.hm-cemetery-grid {
		grid-template-columns: 1fr;
	}
	
	.hm-cemetery-intro {
		padding: 30px 20px;
	}
	
	.hm-cemetery-intro__title {
		font-size: 22px;
	}
	
	.hm-cemetery-area__title {
		font-size: 20px;
	}
	
	.hm-cemetery-card__image {
		height: 160px;
	}
}
/* ===============================================
   霊園詳細ページ用CSS
   =============================================== */

/* ヒーローセクション */
.reien-hero {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: #ffffff;
	padding: 40px 30px;
	border-radius: 12px;
	margin-bottom: 40px;
	text-align: center;
}

.reien-hero__badges {
	display: flex;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.reien-badge {
	display: inline-block;
	padding: 6px 16px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: bold;
	background: rgba(255, 255, 255, 0.3);
	backdrop-filter: blur(10px);
}

.reien-badge--popular {
	background: #ff6b6b;
}

.reien-badge--park {
	background: #51cf66;
}

.reien-badge--free {
	background: #4dabf7;
}

.reien-hero__description {
	font-size: 16px;
	line-height: 1.8;
	margin: 0;
}

/* セクション共通 */
.reien-section {
	margin-bottom: 50px;
	padding: 40px 30px;
	background: #ffffff;
	border-radius: 12px;
}

.reien-section--gray {
	background: #f8f9fa;
}

.reien-section--cta {
	background: linear-gradient(135deg, #2c5aa0 0%, #1e3a8a 100%);
	color: #ffffff;
	text-align: center;
}

.reien-section__title {
	font-size: 28px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 30px;
	padding-bottom: 12px;
	border-bottom: 3px solid #2c5aa0;
}

.reien-section--cta .reien-section__title,
.reien-section--cta .reien-cta__title {
	color: #ffffff;
	border-bottom-color: rgba(255, 255, 255, 0.3);
}

/* 特徴セクション */
.reien-features {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 25px;
}

.reien-feature {
	background: #f8f9fa;
	padding: 25px;
	border-radius: 10px;
	text-align: center;
	transition: all 0.3s ease;
}

.reien-feature:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(44, 90, 160, 0.15);
}

.reien-feature__icon {
	font-size: 48px;
	margin-bottom: 15px;
}

.reien-feature__title {
	font-size: 18px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 12px;
}

.reien-feature__text {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin: 0;
}

/* 情報テーブル */
.reien-info-table {
	width: 100%;
	border-collapse: collapse;
	background: #ffffff;
}

.reien-info-table th,
.reien-info-table td {
	padding: 15px;
	border: 1px solid #dee2e6;
	text-align: left;
	vertical-align: top;
}

.reien-info-table th {
	background: #2c5aa0;
	color: #ffffff;
	font-weight: bold;
	width: 180px;
}

.reien-info-table td {
	line-height: 1.7;
}

.reien-info-table ul {
	margin: 0;
	padding-left: 20px;
}

.reien-info-table li {
	margin-bottom: 5px;
}

/* 費用テーブル */
.reien-price-note {
	background: #fff3cd;
	border-left: 4px solid #ffc107;
	padding: 15px 20px;
	margin-bottom: 25px;
	font-size: 14px;
	line-height: 1.7;
}

.reien-price-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 25px;
}

.reien-price-table thead {
	background: #2c5aa0;
	color: #ffffff;
}

.reien-price-table th,
.reien-price-table td {
	padding: 12px;
	border: 1px solid #dee2e6;
	text-align: center;
}

.reien-price-table td:first-child {
	text-align: left;
}

.reien-price-addition {
	background: #f8f9fa;
	padding: 20px;
	border-radius: 8px;
}

.reien-price-addition h3 {
	font-size: 18px;
	color: #2c5aa0;
	margin-bottom: 15px;
}

.reien-price-addition ul {
	margin: 0 0 15px 0;
	padding-left: 20px;
}

.reien-price-addition li {
	margin-bottom: 8px;
	line-height: 1.7;
}

.reien-price-note-small {
	font-size: 13px;
	color: #666;
	margin: 0;
}

/* 施工ポイント */
.reien-construction__intro {
	font-size: 15px;
	line-height: 1.8;
	text-align: center;
	margin-bottom: 30px;
}

.reien-construction-points {
	display: grid;
	gap: 20px;
}

.reien-construction-point {
	background: #ffffff;
	padding: 20px;
	border-left: 4px solid #2c5aa0;
	border-radius: 6px;
}

.reien-construction-point h4 {
	font-size: 16px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 10px;
}

.reien-construction-point p {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin: 0;
}

/* FAQ */
.reien-faq {
	display: grid;
	gap: 20px;
}

.reien-faq-item {
	background: #f8f9fa;
	border-radius: 8px;
	overflow: hidden;
}

.reien-faq-item__question {
	background: #2c5aa0;
	color: #ffffff;
	font-size: 16px;
	font-weight: bold;
	padding: 15px 20px;
	margin: 0;
}

.reien-faq-item__answer {
	padding: 20px;
}

.reien-faq-item__answer p {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin: 0;
}

/* CTA */
.reien-cta__title {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 25px;
}

.reien-cta__content {
	max-width: 700px;
	margin: 0 auto;
}

.reien-cta__text {
	font-size: 15px;
	line-height: 1.9;
	margin-bottom: 30px;
}

.reien-cta__buttons {
	margin-bottom: 25px;
}

.reien-cta__guarantee {
	font-size: 14px;
	line-height: 1.8;
	margin: 0;
	opacity: 0.95;
}

/* レスポンシブ */
@media (max-width: 768px) {
	.reien-hero {
		padding: 30px 20px;
	}

	.reien-section {
		padding: 30px 20px;
	}

	.reien-section__title {
		font-size: 24px;
	}

	.reien-features {
		grid-template-columns: 1fr;
	}

	.reien-info-table th {
		width: 120px;
		font-size: 14px;
	}

	.reien-info-table td {
		font-size: 14px;
	}

	.reien-price-table {
		font-size: 13px;
	}

	.reien-cta__title {
		font-size: 22px;
	}
}
/* ===============================================
   霊園・墓地一覧ページ用CSS
   =============================================== */

/* ヒーローセクション */
.cemetery-list-hero {
	background: linear-gradient(135deg, #2c5aa0 0%, #1e3a8a 100%);
	color: #ffffff;
	padding: 40px 30px;
	border-radius: 12px;
	margin-bottom: 40px;
	text-align: center;
}

.cemetery-list-hero__description {
	font-size: 16px;
	line-height: 1.9;
	margin: 0;
}

/* セクション */
.cemetery-list-section {
	margin-bottom: 50px;
	padding: 40px 30px;
	background: #ffffff;
	border-radius: 12px;
}

.cemetery-list-section--area {
	background: #f8f9fa;
}

.cemetery-list-section--cta {
	background: linear-gradient(135deg, #2c5aa0 0%, #1e3a8a 100%);
	/*color: #ffffff;*/
	text-align: center;
}

.cemetery-list-section__title {
	font-size: 28px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 30px;
	padding-bottom: 12px;
	border-bottom: 3px solid #2c5aa0;
	display: flex;
	align-items: center;
	gap: 10px;
}

.cemetery-list-section--cta .cemetery-list-section__title {
	color: #ffffff;
	border-bottom-color: rgba(255, 255, 255, 0.3);
	justify-content: center;
}

.cemetery-area-icon {
	font-size: 32px;
}

/* 霊園選びガイド */
.cemetery-select-guide__intro {
	font-size: 15px;
	line-height: 1.8;
	color: #555;
	margin-bottom: 30px;
}

.cemetery-select-points {
	display: grid;
	gap: 20px;
}

.cemetery-select-point {
	background: #f8f9fa;
	padding: 20px;
	border-left: 4px solid #2c5aa0;
	border-radius: 6px;
}

.cemetery-select-point__title {
	font-size: 18px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 12px;
}

.cemetery-select-point ul {
	margin: 0;
	padding-left: 20px;
}

.cemetery-select-point li {
	margin-bottom: 8px;
	line-height: 1.7;
}

.cemetery-select-point p {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin: 0;
}

/* 市ごとのブロック */
.cemetery-city-block {
	margin-bottom: 50px;
}

.cemetery-city-block__title {
	font-size: 24px;
	font-weight: bold;
	color: #333;
	margin-bottom: 20px;
	padding: 12px 20px;
	background: linear-gradient(90deg, #2c5aa0 0%, transparent 100%);
	color: #ffffff;
	border-radius: 6px;
}

/* 霊園カード */
.cemetery-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 20px;
}

.cemetery-card {
	background: #ffffff;
	border-radius: 10px;
	padding: 20px;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
	position: relative;
	display: block;
	text-decoration: none;
	color: inherit;
}

.cemetery-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 20px rgba(44, 90, 160, 0.2);
}

.cemetery-card__badge {
	position: absolute;
	top: 15px;
	right: 15px;
	padding: 5px 12px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: bold;
	color: #ffffff;
}

.cemetery-card__badge--popular {
	background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
}

.cemetery-card__badge--historic {
	background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
}

.cemetery-card__badge--public {
	background: linear-gradient(135deg, #51cf66 0%, #37b24d 100%);
}

.cemetery-card__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
}

.cemetery-card__name {
	font-size: 18px;
	font-weight: bold;
	color: #2c5aa0;
	margin: 0;
}

.cemetery-card__type {
	font-size: 12px;
	padding: 4px 10px;
	background: #e9ecef;
	color: #495057;
	border-radius: 12px;
	font-weight: 500;
}

.cemetery-card__description {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin-bottom: 15px;
}

.cemetery-card__info {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 15px;
}

.cemetery-card__info-item {
	font-size: 12px;
	padding: 4px 10px;
	background: #f8f9fa;
	border-radius: 12px;
	color: #495057;
}

.cemetery-card__footer {
	padding-top: 12px;
	border-top: 1px solid #e9ecef;
}

.cemetery-card__link {
	color: #2c5aa0;
	font-size: 14px;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cemetery-card__note {
	font-size: 12px;
	color: #777;
	line-height: 1.5;
}

/* CTAセクション */
.cemetery-cta__title {
	font-size: 28px;
	font-weight: bold;
	color: #ffffff;
	margin-bottom: 25px;
	border: none;
}

.cemetery-cta__content {
	max-width: 700px;
	margin: 0 auto;
}

.cemetery-cta__text {
	font-size: 15px;
	line-height: 1.9;
	margin-bottom: 30px;
}

.cemetery-cta__buttons {
	margin-bottom: 25px;
}

.cemetery-cta__guarantee {
	font-size: 14px;
	line-height: 1.8;
	margin: 0;
	opacity: 0.95;
}

/* レスポンシブ */
@media (max-width: 768px) {
	.cemetery-list-hero {
		padding: 30px 20px;
	}

	.cemetery-list-section {
		padding: 30px 20px;
	}

	.cemetery-list-section__title {
		font-size: 24px;
	}

	.cemetery-city-block__title {
		font-size: 20px;
	}

	.cemetery-cards {
		grid-template-columns: 1fr;
	}

	.cemetery-cta__title {
		font-size: 22px;
	}
}

/* ========================================
   墓まもり カスタムヘッダー・フッター CSS
   メインカラー: 深い青(#2c5aa0)
   アクセントカラー: ターコイズブルー(#0cb6bf)
   ======================================== */

/* ===========================
   ヘッダー装飾 (Cocoon完全対応版)
   =========================== */

/* ヘッダー全体の基本スタイル */
#header {
    background: white;
    border-bottom: 3px solid #2c5aa0;
/*    box-shadow: 0 2px 10px rgba(44, 90, 160, 0.15);*/
    position: relative;
    z-index: 1000;
		font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	font-weight:800;
}

/* ヘッダーコンテナ */
#header-container,
.header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 30px;
}

/* ヘッダー内部のFlexレイアウト */
.header-in {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

/* サイトロゴエリア */
.logo,
.site-logo {
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.logo:hover,
.site-logo:hover {
    transform: scale(1.05);
}

.logo img,
.site-logo img {
    max-height: 60px;
    width: auto;
    height: auto;
}

/* サイト名テキスト */
.site-name-text,
.site-title {
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    text-shadow: 1px 1px 2px rgba(44, 90, 160, 0.2);
}

.site-name-text a,
.site-title a {
    color: #2c5aa0;
    text-decoration: none;
    transition: color 0.3s ease;
}

.site-name-text a:hover,
.site-title a:hover {
    color: #234a82;
}

/* サイトキャッチコピー */
.tagline,
.site-description {
    font-size: 13px;
    color: #666;
    font-weight: 500;
    margin-top: 5px;
}

/* ===========================
   ナビゲーションメニュー (Cocoon完全対応版)
   =========================== */

/* ナビゲーション全体 */
#navi,
.navi {
    background: white;
    border-top: 1px solid rgba(44, 90, 160, 0.15);
    position: sticky;
    top: 0;
    z-index: 9999;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

/* ナビゲーション内部コンテナ */
#navi-in,
.navi-in {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* メニューリスト - 重要な優先度設定 */
#navi-in > ul,
.navi-in > ul,
#navi ul.menu,
.navi ul.menu {
    display: flex !important;
    justify-content: center;
    align-items: center;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 5px;
    flex-wrap: wrap;
}

/* メニュー項目 */
#navi-in > ul > li,
.navi-in > ul > li,
#navi ul.menu > li,
.navi ul.menu > li {
    position: relative;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* メニューリンク - 重要な優先度設定 */
#navi-in > ul > li > a,
.navi-in > ul > li > a,
#navi ul.menu > li > a,
.navi ul.menu > li > a {
    display: block;
    padding: 18px 20px !important;
    color: #333 !important;
    text-decoration: none !important;
    font-weight: 600;
    font-size: 15px;
    transition: all 0.3s ease;
    position: relative;
    border: none !important;
}

/* ホバー時のアンダーライン効果 */
#navi-in > ul > li > a::after,
.navi-in > ul > li > a::after,
#navi ul.menu > li > a::after,
.navi ul.menu > li > a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, #0cb6bf, #2c5aa0);
    transition: width 0.3s ease;
}

/* ホバー状態 */
#navi-in > ul > li > a:hover,
.navi-in > ul > li > a:hover,
#navi ul.menu > li > a:hover,
.navi ul.menu > li > a:hover {
    color: #2c5aa0 !important;
    background: rgba(44, 90, 160, 0.05) !important;
}

#navi-in > ul > li > a:hover::after,
.navi-in > ul > li > a:hover::after,
#navi ul.menu > li > a:hover::after,
.navi ul.menu > li > a:hover::after {
    width: 80%;
}

/* 現在のページ / アクティブなメニュー項目 */
#navi-in > ul > li.current-menu-item > a,
.navi-in > ul > li.current-menu-item > a,
#navi ul.menu > li.current-menu-item > a,
.navi ul.menu > li.current-menu-item > a,
#navi-in > ul > li.current_page_item > a,
.navi-in > ul > li.current_page_item > a,
#navi ul.menu > li.current_page_item > a,
.navi ul.menu > li.current_page_item > a {
    color: #2c5aa0 !important;
    background: rgba(44, 90, 160, 0.08) !important;
}

#navi-in > ul > li.current-menu-item > a::after,
.navi-in > ul > li.current-menu-item > a::after,
#navi ul.menu > li.current-menu-item > a::after,
.navi ul.menu > li.current-menu-item > a::after,
#navi-in > ul > li.current_page_item > a::after,
.navi-in > ul > li.current_page_item > a::after,
#navi ul.menu > li.current_page_item > a::after,
.navi ul.menu > li.current_page_item > a::after {
    width: 80%;
}

/* CTAボタン（お問い合わせボタン） - 最高優先度 */
#navi-in .header-cta,
.navi-in .header-cta,
#navi .header-cta,
.navi .header-cta,
#navi-in .header-cta > a,
.navi-in .header-cta > a,
#navi .header-cta > a,
.navi .header-cta > a,
#navi-in ul.menu > li.header-cta > a,
.navi-in ul.menu > li.header-cta > a,
#navi ul.menu > li.header-cta > a,
.navi ul.menu > li.header-cta > a {
    background: #2c5aa0 !important;
    color: white !important;
    border-radius: 30px !important;
    padding: 12px 30px !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 15px rgba(44, 90, 160, 0.3) !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

/* CTAボタンのアンダーラインを非表示 */
#navi-in .header-cta::after,
.navi-in .header-cta::after,
#navi .header-cta::after,
.navi .header-cta::after,
#navi-in .header-cta > a::after,
.navi-in .header-cta > a::after,
#navi .header-cta > a::after,
.navi .header-cta > a::after,
#navi-in ul.menu > li.header-cta > a::after,
.navi-in ul.menu > li.header-cta > a::after,
#navi ul.menu > li.header-cta > a::after,
.navi ul.menu > li.header-cta > a::after {
    display: none !important;
    content: none !important;
}

/* CTAボタンホバー状態 */
#navi-in .header-cta:hover,
.navi-in .header-cta:hover,
#navi .header-cta:hover,
.navi .header-cta:hover,
#navi-in .header-cta > a:hover,
.navi-in .header-cta > a:hover,
#navi .header-cta > a:hover,
.navi .header-cta > a:hover,
#navi-in ul.menu > li.header-cta > a:hover,
.navi-in ul.menu > li.header-cta > a:hover,
#navi ul.menu > li.header-cta > a:hover,
.navi ul.menu > li.header-cta > a:hover {
    background: #234a82 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(44, 90, 160, 0.4) !important;
}

/* モバイルメニューボタン */
#menu-button,
.menu-button {
    background: #2c5aa0;
    border: none;
    color: white;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.3s ease;
}

#menu-button:hover,
.menu-button:hover {
    background: #234a82;
}

/* ===========================
   フッター装飾 (Cocoon完全対応版)
   =========================== */

/* フッター全体 */
#footer,
.footer {
    background: linear-gradient(180deg, #f8f9fa 0%, #ffffff 50%, #f5f8fb 100%);
    border-top: 4px solid #2c5aa0;
    margin-top: 80px;
    padding: 60px 0 0;
}

/* フッター内部コンテナ */
#footer-in,
.footer-in {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px 40px;
}

/* フッターウィジェットエリア */
.footer-widgets,
#footer .footer-widgets {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
    margin-bottom: 40px;
}

/* 個別のウィジェット */
.footer-widget,
#footer .widget {
    padding: 0;
}

/* ウィジェットタイトル */
.footer-widget .widget-title,
#footer .widget .widget-title {
    font-size: 16px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #2c5aa0;
}

/* フッターセクションスタイル（カスタムHTML用） */
.footer-section {
    padding: 0;
    margin-bottom: 20px;
}

.footer-section-title {
    font-size: 16px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #2c5aa0;
}

/* フッターメニュー */
.footer-menu,
#footer ul,
.footer-widget ul,
#footer .widget ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.footer-menu li,
#footer ul li,
.footer-widget ul li,
#footer .widget ul li {
    margin-bottom: 12px !important;
    padding: 0 !important;
    list-style: none !important;
}

.footer-menu a,
#footer ul a,
.footer-widget ul a,
#footer .widget ul a {
    /*color: #666 !important;*/
    text-decoration: none !important;
    font-size: 14px;
    transition: all 0.3s ease;
    display: inline-block;
    position: relative;
    padding-left: 15px;
}

.footer-menu a::before,
#footer ul a::before,
.footer-widget ul a::before,
#footer .widget ul a::before {
    content: '▸';
    position: absolute;
    left: 0;
    color: #0cb6bf;
    transition: transform 0.3s ease;
}

.footer-menu a:hover,
#footer ul a:hover,
.footer-widget ul a:hover,
#footer .widget ul a:hover {
    color: #2c5aa0 !important;
    padding-left: 20px;
}

.footer-menu a:hover::before,
#footer ul a:hover::before,
.footer-widget ul a:hover::before,
#footer .widget ul a:hover::before {
    transform: translateX(5px);
}

/* 会社情報エリア */
.footer-company {
    padding: 0;
    margin-bottom: 30px;
}

.footer-logo {
    margin-bottom: 20px;
}

.footer-logo img {
    max-width: 200px;
    height: auto;
}

.footer-company-name {
    font-size: 18px;
    font-weight: 700;
    color: #333;
    margin-bottom: 15px;
}

.footer-company-info {
    font-size: 14px;
    line-height: 1.8;
    color: #666;
}

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

.footer-phone-large {
    font-size: 22px;
    font-weight: 700;
    color: #2c5aa0;
    margin: 15px 0;
    display: block;
}

.footer-phone-large a {
    color: #2c5aa0;
    text-decoration: none;
}

.footer-phone-large a:hover {
    text-decoration: underline;
}

.footer-hours {
    font-size: 13px;
    color: #888;
    margin-top: 5px;
}

/* フッターボトムバー */
.footer-bottom,
#footer .footer-bottom {
    background: #2c5aa0;
    color: white;
    padding: 20px 0;
    margin: 40px 0 0;
}

.footer-bottom-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.footer-bottom-menu {
    display: flex;
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
}

.footer-bottom-menu li {
    margin: 0 !important;
    padding: 0 !important;
}

.footer-bottom-menu a {
    color: white !important;
    text-decoration: none;
    font-size: 13px;
    opacity: 0.9;
}

.footer-bottom-menu a:hover {
    opacity: 1;
    text-decoration: underline !important;
}

/* コピーライト */
.footer-copyright,
#footer .footer-copyright,
.copyright {
    font-size: 13px;
    opacity: 0.9;
    color: white;
    text-align: center;
}

/* フッターCTAエリア */
.footer-cta {
    background: linear-gradient(135deg, #2c5aa0 0%, #234a82 100%);
    color: white;
    padding: 40px;
    border-radius: 15px;
    text-align: center;
    margin-bottom: 40px;
    box-shadow: 0 5px 20px rgba(44, 90, 160, 0.3);
}

.footer-cta-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 10px;
}

.footer-cta-subtitle {
    font-size: 15px;
    margin-bottom: 25px;
    opacity: 0.95;
}

.footer-cta-button {
    display: inline-block;
    background: white;
    color: #2c5aa0;
    padding: 15px 50px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.footer-cta-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    background: #0cb6bf;
    color: white;
}

/* ===========================
   レスポンシブ対応 (ヘッダー・フッター)
   =========================== */

@media (max-width: 1024px) {
    .footer-widgets,
    #footer .footer-widgets {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

@media (max-width: 768px) {
    /* ヘッダー */
    #header-container,
    .header-container {
        padding: 15px 20px;
    }
    
    .site-name-text,
    .site-title {
        font-size: 20px;
    }
    
    /* ナビゲーション - モバイル対応 */
    #navi-in > ul,
    .navi-in > ul,
    #navi ul.menu,
    .navi ul.menu {
        flex-direction: column;
        gap: 0;
    }
    
    #navi-in > ul > li,
    .navi-in > ul > li,
    #navi ul.menu > li,
    .navi ul.menu > li {
        width: 100%;
    }
    
    #navi-in > ul > li > a,
    .navi-in > ul > li > a,
    #navi ul.menu > li > a,
    .navi ul.menu > li > a {
        padding: 15px 20px !important;
        border-bottom: 1px solid rgba(12, 182, 191, 0.1) !important;
    }
    
    /* フッター */
    #footer-in,
    .footer-in {
        padding: 0 20px 30px;
    }
    
    .footer-widgets,
    #footer .footer-widgets {
        grid-template-columns: 1fr;
        gap: 35px;
    }
    
    .footer-bottom-content {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
    
    .footer-bottom-menu {
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }
    
    .footer-cta {
        padding: 30px 20px;
    }
    
    .footer-cta-title {
        font-size: 20px;
    }
}

@media (max-width: 480px) {
    .footer-phone-large {
        font-size: 18px;
    }
    
    .footer-cta-button {
        padding: 12px 30px;
        font-size: 14px;
    }
}

/* ===========================
   追加の装飾要素
   =========================== */

/* アクセントライン */
.accent-line {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #2c5aa0 0%, rgba(44, 90, 160, 0) 100%);
    margin: 15px 0;
}

/* アイコン装飾 */
.icon-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: rgba(44, 90, 160, 0.1);
    border-radius: 50%;
    color: #2c5aa0;
    margin-right: 10px;
}

/* スムーススクロール */
html {
    scroll-behavior: smooth;
}

/* アニメーション：フェードイン */
@keyframes slideDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.menu-button-in{
	#ffffff !important;
}
/* ===============================================
   問い合わせCTAセクション（青背景・中央配置）
   =============================================== */
.cta-contact-box {
    background: linear-gradient(135deg, #2c5aa0 0%, #1e4080 100%);
    border-radius: 8px;
    padding: 32px;
    margin: 32px 0;
    text-align: center;
    box-shadow: 0 4px 12px rgba(44,90,160,0.3);
    position: relative;
    overflow: hidden;
}

/* 光沢エフェクト（ホバー時） */
.cta-contact-box::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
    transition: left 0.5s ease;
}

.cta-contact-box:hover::before {
    left: 100%;
}

.cta-contact-box p {
    position: relative;
    z-index: 1;
}

.cta-contact-box p:first-child {
    margin: 0 0 20px 0;
}

.cta-contact-box p:last-child {
    margin: 0;
}

.cta-contact-box .cta-button {
    display: inline-block;
    background-color: #fff;
    color: #2c5aa0;
    padding: 16px 40px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.2em;
    transition: all 0.3s ease;
}

.cta-contact-box .cta-button:hover {
    background-color: #f0f4f8;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.cta-contact-box .cta-phone {
    color: #fff;
    font-size: 1.1em;
}

.cta-contact-box .cta-phone img {
    vertical-align: middle;
}

/* ===============================================
   フッターメニュー内のcontactリンクから光沢エフェクトを除外
   =============================================== */
#footer a[href*="contact"]::before,
.footer a[href*="contact"]::before,
.footer-bottom a[href*="contact"]::before,
#navi a[href*="contact"]::before,
.navi a[href*="contact"]::before,
.menu-item a[href*="contact"]::before,
.hm-cta a.btn-c::before {
    content: none !important;
    display: none !important;
    background: none !important;
}

/* フッターとナビゲーション内のリンクにはpositionをstaticに戻す */
#footer a[href*="contact"],
.footer a[href*="contact"],
.footer-bottom a[href*="contact"],
#navi a[href*="contact"],
.navi a[href*="contact"],
.menu-item a[href*="contact"] {
    position: static !important;
    overflow: visible !important;
}

/* CTAボタンの疑似要素を完全に無効化 */
.hm-cta a.btn-c::before,
.hm-cta a.btn-c::after {
    content: none !important;
    display: none !important;
    background: none !important;
    position: static !important;
}

.site-name-text::before {
    content: '';
    display: inline-block;
    width: 40px;
    height: 40px;
    background-image: url('/wp-content/uploads/2025/11/hakamamori_logo_font.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    margin-right: 10px;
}

.site-name-text {
  font-size: 20px;
  white-space: nowrap !important;
}


/* ===============================================
   CTAボタン（吹き出しバッジ付き）
   =============================================== */
.hm-cta .btn-wrap {
    margin: 50px 0 10px;
    position: relative;
}

.hm-cta a.btn-c {
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1.5;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 3rem;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    letter-spacing: 0.1em;
    color: #fff;
    border-radius: 0.5rem;
    background: #00a349;
    box-shadow: 0 5px 0 #007a36;
    transition: all 0.3s;
    overflow: visible;
}


.hm-cta a.btn-c span {
    font-size: 1.4rem;
    font-weight: 600;
    position: absolute;
    top: -2.5rem;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    width: 180px;
    padding: 0.3rem 0;
    color: #007a36;
    border: 2px solid #007a36;
    border-radius: 100vh;
    background: #fff;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.15);
    z-index: 10;
    white-space: nowrap;
}

.hm-cta a.btn-c span:before,
.hm-cta a.btn-c span:after {
    position: absolute;
    left: calc(50% - 8px);
    content: "";
}

.hm-cta a.btn-c span:before {
    bottom: -10px;
    border-width: 10px 8px 0 8px;
    border-style: solid;
    border-color: #007a36 transparent transparent transparent;
}

.hm-cta a.btn-c span:after {
    bottom: -7px;
    border-width: 10px 8px 0 8px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
}


.hm-cta a.btn-c i {
    margin-right: 0.8rem;
    line-height: 1;
}

.hm-cta a.btn-c:hover {
    transform: translateY(3px);
    color: #fff;
    background: #00b852;
    box-shadow: 0 2px 0 #007a36;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .hm-cta a.btn-c {
        font-size: 1.8rem;
        padding: 1.3rem 2rem 1.3rem 2.5rem;
    }
    
    .hm-cta a.btn-c span {
        font-size: 1.2rem;
        width: 160px;
        top: -2.3rem;
    }
}

@media (max-width: 480px) {
    .hm-cta a.btn-c {
        font-size: 1.5rem;
        padding: 1.2rem 1.5rem 1.2rem 2rem;
    }
    
    .hm-cta a.btn-c span {
        font-size: 1.1rem;
        width: 140px;
        top: -2.1rem;
    }
    
    .hm-cta a.btn-c i {
        margin-right: 0.5rem;
    }
}

@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/* ===============================================
   Cocoon親テーマ(.article h2/h3/h4)の
   デフォルトスタイルを上書きするリセットCSS
   ※ 親テーマ style.css の詳細度に勝つため
      .article セレクタ + !important を使用
   =============================================== */

/* --- h2 リセット（カスタムクラス付き） --- */
.article h2.reien-section__title,
.article h2.reien-cta__title,
.article h2.cemetery-list-section__title,
.article h2.cemetery-cta__title,
.article h2.cemetery-city-block__title,
.article h2.hm-section__title,
.article h2.hm-cta__title,
.article h2.hm-hero__title,
.article h2.hm-cemetery-intro__title,
.article h2.hm-cemetery-area__title,
.article h2.hm-reason__title,
.article h2.hm-notice__title,
.article h2.hm-column-placeholder__title {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
    position: static !important;
}

/* --- h3 リセット（カスタムクラス付き） --- */
.article h3.reien-feature__title,
.article h3.cemetery-select-point__title,
.article h3.cemetery-card__name,
.article h3.hm-cemetery-card__name,
.article h3.hm-section__title,
.article h3.hm-notice__title,
.article h3.hm-reason__title,
.article h3.hm-column-placeholder__title,
.article h3.reien-faq-item__question {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 0 15px 0 !important;
    position: static !important;
}

/* --- h4 リセット（カスタムクラス付き） --- */
.article .reien-construction-point h4,
.article .reien-price-addition h3,
.article .cemetery-select-point h4 {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    padding: 0 !important;
    position: static !important;
}

/* --- 汎用：カスタムセクション内の全見出しリセット --- */
.article .reien-hero h1,
.article .reien-hero h2,
.article .reien-section h2,
.article .reien-section h3,
.article .reien-section h4,
.article .reien-section--cta h2,
.article .reien-section--gray h3,
.article .cemetery-list-hero h1,
.article .cemetery-list-hero h2,
.article .cemetery-list-section h2,
.article .cemetery-list-section h3,
.article .cemetery-list-section h4,
.article .cemetery-list-section--cta h2,
.article .cemetery-city-block h2,
.article .cemetery-city-block h3,
.article .hm-section--cemetery-db h2,
.article .hm-section--cemetery-db h3,
.article .hm-cemetery-intro h2,
.article .hm-cemetery-area h2,
.article .hm-cemetery-area h3,
.article .hm-cemetery-card h3,
.article .hm-cemetery-footer h2,
.article .cta-contact-box h2,
.article .cta-contact-box h3,
.article .cta-box2 h2,
.article .cta-box2 h3,
.article #form h2,
.article #form h3 {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    position: static !important;
}

/* FAQ質問ヘッダーは背景色を維持 */
.article .reien-faq-item__question {
    background: #2c5aa0 !important;
    color: #ffffff !important;
    padding: 15px 20px !important;
    border: none !important;
}

/* 市ブロックタイトルはグラデーション背景を維持 */
.article h2.cemetery-city-block__title,
.article .cemetery-city-block__title {
    background: linear-gradient(90deg, #2c5aa0 0%, transparent 100%) !important;
    color: #ffffff !important;
    padding: 12px 20px !important;
    border: none !important;
    border-radius: 6px !important;
}

/* CTAセクション（青背景）内の見出しは白文字 */
.article .reien-section--cta h2,
.article .cemetery-list-section--cta h2,
.article .cta-contact-box h2,
.article .cta-contact-box h3 {
    color: #ffffff !important;
}

/* ===============================================
   Cocoon親テーマ リセットCSS ここまで
   =============================================== */

/* Cocoon投稿ページ用カスタムCSS */

/* アイキャッチ画像を中央配置 */
.eye-catch-wrap {
    text-align: center;
    margin: 0 auto 2em;
}

.eye-catch {
    display: inline-block;
    margin: 0 auto;
}

/* 全体のフォント設定 */
.entry-content {
  font-family: 游ゴシック体, "Yu Gothic", YuGothic, Helvetica, Arial, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, sans-serif;

    line-height: 1.8;
	font-weight: 400;
    color: #151e2d;
}

/* 明朝のフォント設定 */
.mincho,h1, h2, h3 {
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    line-height: 1.8;
	font-weight: 400;
    /*color: #151e2d;*/
}

/* お問い合わせフォームセクション */
#form {
    background: linear-gradient(135deg, #f6f8fb 0%, #e9ecef 100%);
    padding: 3em 2em;
    border-radius: 10px;
    margin: 3em 0;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

/* Contact Form 7 のスタイル調整 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
    width: 100%;
    padding: 0.8em;
    border: 2px solid #e5e7eb;
    border-radius: 5px;
    font-size: 16px;
    transition: border-color 0.3s;
}

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 textarea:focus {
    border-color: #3b82f6;
    outline: none;
}

.wpcf7 input[type="submit"] {
    background: linear-gradient(135deg, #1e3a8a, #2563eb);
    color: white;
    padding: 1em 3em;
    border: none;
    border-radius: 50px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(30, 58, 138, 0.4);
    transition: all 0.3s;
	right: 15px;
}

.wpcf7 input[type="submit"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(30, 58, 138, 0.6);
}

/* スマホ対応 */
@media screen and (max-width: 768px) {
    .article .entry-content h2,
    .entry-content h2 {
        font-size: 1.4em;
        padding: 0.8em 1em;
    }
    
    .article .entry-content h3,
    .entry-content h3 {
        font-size: 1.2em;
        padding: 0.6em 0.8em 0.6em 2em;
    }
    
    .entry-content p {
        font-size: 15px;
    }
    
    #form {
        padding: 2em 1em;
    }
}

/* アニメーション効果 */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.entry-content h2,
.entry-content h3 {
    animation: fadeInUp 0.6s ease-out;
}

/* スクロールバーのカスタマイズ */
.entry-content::-webkit-scrollbar {
    width: 8px;
}

.entry-content::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.entry-content::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #1e3a8a, #2563eb);
    border-radius: 4px;
}

.entry-content::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #2563eb, #1e3a8a);
}

.hakalogo{
	vertical-align:sub;
	width:auto;
	height:1em;
}

/* お問い合わせフォーム用のCTAボックススタイル */
.cta-box2 {
    padding: 20px;
    border: solid #1e3a8a 2px;
    border-radius: 12px;
}


/* ===============================================
   霊園データベースセクション用CSS
   =============================================== */

/* セクション全体 */
.hm-section--cemetery-db {
	background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
	padding: 60px 20px;
}

/* 霊園データベース イントロ */
.hm-cemetery-intro {
	background: #ffffff;
	border-radius: 12px;
	padding: 40px 30px;
	margin-bottom: 50px;
	text-align: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.hm-cemetery-intro__icon {
	font-size: 48px;
	margin-bottom: 15px;
}

.hm-cemetery-intro__title,
.article .hm-cemetery-intro__title {
	font-size: 26px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 15px;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

.hm-cemetery-intro__text {
	font-size: 15px;
	line-height: 1.8;
	color: #555;
}

/* エリアごとの区切り */
.hm-cemetery-area {
	margin-bottom: 50px;
}

.hm-cemetery-area__title,
.article .hm-cemetery-area__title {
	font-size: 24px;
	font-weight: bold;
	color: #333;
	margin-bottom: 30px;
	padding-bottom: 12px !important;
	padding-top: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	border-bottom: 3px solid #2c5aa0 !important;
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
	background: transparent !important;
	display: flex;
	align-items: center;
	gap: 10px;
}

.hm-cemetery-area__icon {
	font-size: 28px;
}

/* 霊園カードグリッド */
.hm-cemetery-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 25px;
	margin-bottom: 30px;
}

/* 霊園カード */
.hm-cemetery-card {
	background: #ffffff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	position: relative;
}

.hm-cemetery-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(44, 90, 160, 0.2);
}

/* バッジ */
.hm-cemetery-card__badge {
	position: absolute;
	top: 12px;
	right: 12px;
	padding: 5px 12px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: bold;
	color: #ffffff;
	z-index: 10;
}

.hm-cemetery-card__badge--popular {
	background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
}

.hm-cemetery-card__badge--historic {
	background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
}

/* 画像エリア */
.hm-cemetery-card__image {
	width: 100%;
	height: 180px;
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.hm-cemetery-card__placeholder {
	font-size: 20px;
	font-weight: bold;
	color: #ffffff;
	text-align: center;
}

/* コンテンツ部分 */
.hm-cemetery-card__content {
	padding: 20px;
	flex-grow: 1;
}

.hm-cemetery-card__name,
.article .hm-cemetery-card__name {
	font-size: 18px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 8px;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

.hm-cemetery-card__location {
	font-size: 13px;
	color: #777;
	margin-bottom: 12px;
}

.hm-cemetery-card__description {
	font-size: 14px;
	line-height: 1.6;
	color: #555;
	margin-bottom: 15px;
}

/* タグ */
.hm-cemetery-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.hm-cemetery-card__tag {
	display: inline-block;
	background: #e9ecef;
	color: #495057;
	padding: 4px 10px;
	border-radius: 12px;
	font-size: 11px;
	font-weight: 500;
}

/* フッター部分 */
.hm-cemetery-card__footer {
	padding: 15px 20px;
	background: #f8f9fa;
	border-top: 1px solid #e9ecef;
}

.hm-cemetery-card__link {
	color: #2c5aa0;
	font-size: 14px;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* セクションフッター */
.hm-cemetery-footer {
	text-align: center;
	background: #ffffff;
	padding: 40px 30px;
	border-radius: 12px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
	margin-top: 40px;
}

.hm-cemetery-footer__text {
	font-size: 15px;
	line-height: 1.8;
	color: #555;
	margin-bottom: 25px;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
	.hm-cemetery-grid {
		grid-template-columns: 1fr;
	}
	
	.hm-cemetery-intro {
		padding: 30px 20px;
	}
	
	.hm-cemetery-intro__title {
		font-size: 22px;
	}
	
	.hm-cemetery-area__title {
		font-size: 20px;
	}
	
	.hm-cemetery-card__image {
		height: 160px;
	}
}
/* ===============================================
   霊園詳細ページ用CSS
   =============================================== */

/* ヒーローセクション */
.reien-hero {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: #ffffff;
	padding: 40px 30px;
	border-radius: 12px;
	margin-bottom: 40px;
	text-align: center;
}

.reien-hero__badges {
	display: flex;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.reien-badge {
	display: inline-block;
	padding: 6px 16px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: bold;
	background: rgba(255, 255, 255, 0.3);
	backdrop-filter: blur(10px);
}

.reien-badge--popular {
	background: #ff6b6b;
}

.reien-badge--park {
	background: #51cf66;
}

.reien-badge--free {
	background: #4dabf7;
}

.reien-hero__description {
	font-size: 16px;
	line-height: 1.8;
	margin: 0;
}

/* セクション共通 */
.reien-section {
	margin-bottom: 50px;
	padding: 40px 30px;
	background: #ffffff;
	border-radius: 12px;
}

.reien-section--gray {
	background: #f8f9fa;
}

.reien-section--cta {
	background: linear-gradient(135deg, #2c5aa0 0%, #1e3a8a 100%);
	color: #ffffff;
	text-align: center;
}

.reien-section__title,
.article .reien-section__title {
	font-size: 28px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 30px;
	padding-bottom: 12px !important;
	border-bottom: 3px solid #2c5aa0 !important;
	background: transparent !important;
}

.reien-section--cta .reien-section__title,
.reien-section--cta .reien-cta__title,
.article .reien-section--cta .reien-section__title,
.article .reien-section--cta .reien-cta__title {
	color: #ffffff !important;
	border-bottom-color: rgba(255, 255, 255, 0.3) !important;
}

/* 特徴セクション */
.reien-features {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 25px;
}

.reien-feature {
	background: #f8f9fa;
	padding: 25px;
	border-radius: 10px;
	text-align: center;
	transition: all 0.3s ease;
}

.reien-feature:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(44, 90, 160, 0.15);
}

.reien-feature__icon {
	font-size: 48px;
	margin-bottom: 15px;
}

.reien-feature__title,
.article .reien-feature__title {
	font-size: 18px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 12px;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

.reien-feature__text {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin: 0;
}

/* 情報テーブル */
.reien-info-table {
	width: 100%;
	border-collapse: collapse;
	background: #ffffff;
}

.reien-info-table th,
.reien-info-table td {
	padding: 15px;
	border: 1px solid #dee2e6;
	text-align: left;
	vertical-align: top;
}

.reien-info-table th {
	background: #2c5aa0;
	color: #ffffff;
	font-weight: bold;
	width: 180px;
}

.reien-info-table td {
	line-height: 1.7;
}

.reien-info-table ul {
	margin: 0;
	padding-left: 20px;
}

.reien-info-table li {
	margin-bottom: 5px;
}

/* 費用テーブル */
.reien-price-note {
	background: #fff3cd;
	border-left: 4px solid #ffc107;
	padding: 15px 20px;
	margin-bottom: 25px;
	font-size: 14px;
	line-height: 1.7;
}

.reien-price-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 25px;
}

.reien-price-table thead {
	background: #2c5aa0;
	color: #ffffff;
}

.reien-price-table th,
.reien-price-table td {
	padding: 12px;
	border: 1px solid #dee2e6;
	text-align: center;
}

.reien-price-table td:first-child {
	text-align: left;
}

.reien-price-addition {
	background: #f8f9fa;
	padding: 20px;
	border-radius: 8px;
}

.reien-price-addition h3,
.article .reien-price-addition h3 {
	font-size: 18px;
	color: #2c5aa0;
	margin-bottom: 15px;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

.reien-price-addition ul {
	margin: 0 0 15px 0;
	padding-left: 20px;
}

.reien-price-addition li {
	margin-bottom: 8px;
	line-height: 1.7;
}

.reien-price-note-small {
	font-size: 13px;
	color: #666;
	margin: 0;
}

/* 施工ポイント */
.reien-construction__intro {
	font-size: 15px;
	line-height: 1.8;
	text-align: center;
	margin-bottom: 30px;
}

.reien-construction-points {
	display: grid;
	gap: 20px;
}

.reien-construction-point {
	background: #ffffff;
	padding: 20px;
	border-left: 4px solid #2c5aa0;
	border-radius: 6px;
}

.reien-construction-point h4,
.article .reien-construction-point h4 {
	font-size: 16px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 10px;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

.reien-construction-point p {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin: 0;
}

/* FAQ */
.reien-faq {
	display: grid;
	gap: 20px;
}

.reien-faq-item {
	background: #f8f9fa;
	border-radius: 8px;
	overflow: hidden;
}

.reien-faq-item__question,
.article .reien-faq-item__question {
	background: #2c5aa0 !important;
	color: #ffffff !important;
	font-size: 16px;
	font-weight: bold;
	padding: 15px 20px !important;
	margin: 0;
	border: none !important;
}

.reien-faq-item__answer {
	padding: 20px;
}

.reien-faq-item__answer p {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin: 0;
}

/* CTA */
.reien-cta__title,
.article .reien-cta__title {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 25px;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	color: #ffffff;
}

.reien-cta__content {
	max-width: 700px;
	margin: 0 auto;
}

.reien-cta__text {
	font-size: 15px;
	line-height: 1.9;
	margin-bottom: 30px;
}

.reien-cta__buttons {
	margin-bottom: 25px;
}

.reien-cta__guarantee {
	font-size: 14px;
	line-height: 1.8;
	margin: 0;
	opacity: 0.95;
}

/* レスポンシブ */
@media (max-width: 768px) {
	.reien-hero {
		padding: 30px 20px;
	}

	.reien-section {
		padding: 30px 20px;
	}

	.reien-section__title {
		font-size: 24px;
	}

	.reien-features {
		grid-template-columns: 1fr;
	}

	.reien-info-table th {
		width: 120px;
		font-size: 14px;
	}

	.reien-info-table td {
		font-size: 14px;
	}

	.reien-price-table {
		font-size: 13px;
	}

	.reien-cta__title {
		font-size: 22px;
	}
}
/* ===============================================
   霊園・墓地一覧ページ用CSS
   =============================================== */

/* ヒーローセクション */
.cemetery-list-hero {
	background: linear-gradient(135deg, #2c5aa0 0%, #1e3a8a 100%);
	color: #ffffff;
	padding: 40px 30px;
	border-radius: 12px;
	margin-bottom: 40px;
	text-align: center;
}

.cemetery-list-hero__description {
	font-size: 16px;
	line-height: 1.9;
	margin: 0;
}

/* セクション */
.cemetery-list-section {
	margin-bottom: 50px;
	padding: 40px 30px;
	background: #ffffff;
	border-radius: 12px;
}

.cemetery-list-section--area {
	background: #f8f9fa;
}

.cemetery-list-section--cta {
	background: linear-gradient(135deg, #2c5aa0 0%, #1e3a8a 100%);
	/*color: #ffffff;*/
	text-align: center;
}

.cemetery-list-section__title,
.article .cemetery-list-section__title {
	font-size: 28px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 30px;
	padding-bottom: 12px !important;
	border-bottom: 3px solid #2c5aa0 !important;
	background: transparent !important;
	display: flex;
	align-items: center;
	gap: 10px;
}

.cemetery-list-section--cta .cemetery-list-section__title,
.article .cemetery-list-section--cta .cemetery-list-section__title {
	color: #ffffff !important;
	border-bottom-color: rgba(255, 255, 255, 0.3) !important;
	justify-content: center;
}

.cemetery-area-icon {
	font-size: 32px;
}

/* 霊園選びガイド */
.cemetery-select-guide__intro {
	font-size: 15px;
	line-height: 1.8;
	color: #555;
	margin-bottom: 30px;
}

.cemetery-select-points {
	display: grid;
	gap: 20px;
}

.cemetery-select-point {
	background: #f8f9fa;
	padding: 20px;
	border-left: 4px solid #2c5aa0;
	border-radius: 6px;
}

.cemetery-select-point__title,
.article .cemetery-select-point__title {
	font-size: 18px;
	font-weight: bold;
	color: #2c5aa0;
	margin-bottom: 12px;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

.cemetery-select-point ul {
	margin: 0;
	padding-left: 20px;
}

.cemetery-select-point li {
	margin-bottom: 8px;
	line-height: 1.7;
}

.cemetery-select-point p {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin: 0;
}

/* 市ごとのブロック */
.cemetery-city-block {
	margin-bottom: 50px;
}

.cemetery-city-block__title,
.article .cemetery-city-block__title {
	font-size: 24px;
	font-weight: bold;
	color: #333;
	margin-bottom: 20px;
	padding: 12px 20px !important;
	background: linear-gradient(90deg, #2c5aa0 0%, transparent 100%) !important;
	color: #ffffff;
	border-radius: 6px !important;
	border: none !important;
}

/* 霊園カード */
.cemetery-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 20px;
}

.cemetery-card {
	background: #ffffff;
	border-radius: 10px;
	padding: 20px;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
	position: relative;
	display: block;
	text-decoration: none;
	color: inherit;
}

.cemetery-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 20px rgba(44, 90, 160, 0.2);
}

.cemetery-card__badge {
	position: absolute;
	top: 15px;
	right: 15px;
	padding: 5px 12px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: bold;
	color: #ffffff;
}

.cemetery-card__badge--popular {
	background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
}

.cemetery-card__badge--historic {
	background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
}

.cemetery-card__badge--public {
	background: linear-gradient(135deg, #51cf66 0%, #37b24d 100%);
}

.cemetery-card__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
}

.cemetery-card__name,
.article .cemetery-card__name {
	font-size: 18px;
	font-weight: bold;
	color: #2c5aa0;
	margin: 0;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

.cemetery-card__type {
	font-size: 12px;
	padding: 4px 10px;
	background: #e9ecef;
	color: #495057;
	border-radius: 12px;
	font-weight: 500;
}

.cemetery-card__description {
	font-size: 14px;
	line-height: 1.7;
	color: #555;
	margin-bottom: 15px;
}

.cemetery-card__info {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 15px;
}

.cemetery-card__info-item {
	font-size: 12px;
	padding: 4px 10px;
	background: #f8f9fa;
	border-radius: 12px;
	color: #495057;
}

.cemetery-card__footer {
	padding-top: 12px;
	border-top: 1px solid #e9ecef;
}

.cemetery-card__link {
	color: #2c5aa0;
	font-size: 14px;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cemetery-card__note {
	font-size: 12px;
	color: #777;
	line-height: 1.5;
}

/* CTAセクション */
.cemetery-cta__title,
.article .cemetery-cta__title {
	font-size: 28px;
	font-weight: bold;
	color: #ffffff;
	margin-bottom: 25px;
	border: none !important;
	background: transparent !important;
	padding: 0 !important;
}

.cemetery-cta__content {
	max-width: 700px;
	margin: 0 auto;
}

.cemetery-cta__text {
	font-size: 15px;
	line-height: 1.9;
	margin-bottom: 30px;
}

.cemetery-cta__buttons {
	margin-bottom: 25px;
}

.cemetery-cta__guarantee {
	font-size: 14px;
	line-height: 1.8;
	margin: 0;
	opacity: 0.95;
}

/* レスポンシブ */
@media (max-width: 768px) {
	.cemetery-list-hero {
		padding: 30px 20px;
	}

	.cemetery-list-section {
		padding: 30px 20px;
	}

	.cemetery-list-section__title {
		font-size: 24px;
	}

	.cemetery-city-block__title {
		font-size: 20px;
	}

	.cemetery-cards {
		grid-template-columns: 1fr;
	}

	.cemetery-cta__title {
		font-size: 22px;
	}
}

/* ========================================
   墓まもり カスタムヘッダー・フッター CSS
   メインカラー: 深い青(#2c5aa0)
   アクセントカラー: ターコイズブルー(#0cb6bf)
   ======================================== */

/* ===========================
   ヘッダー装飾 (Cocoon完全対応版)
   =========================== */

/* ヘッダー全体の基本スタイル */
#header {
    background: white;
    border-bottom: 3px solid #2c5aa0;
/*    box-shadow: 0 2px 10px rgba(44, 90, 160, 0.15);*/
    position: relative;
    z-index: 1000;
		font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
	font-weight:800;
}

/* ヘッダーコンテナ */
#header-container,
.header-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 30px;
}

/* ヘッダー内部のFlexレイアウト */
.header-in {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

/* サイトロゴエリア */
.logo,
.site-logo {
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.logo:hover,
.site-logo:hover {
    transform: scale(1.05);
}

.logo img,
.site-logo img {
    max-height: 60px;
    width: auto;
    height: auto;
}

/* サイト名テキスト */
.site-name-text,
.site-title {
    font-size: 24px;
    font-weight: 700;
    margin: 0;
    text-shadow: 1px 1px 2px rgba(44, 90, 160, 0.2);
}

.site-name-text a,
.site-title a {
    color: #2c5aa0;
    text-decoration: none;
    transition: color 0.3s ease;
}

.site-name-text a:hover,
.site-title a:hover {
    color: #234a82;
}

/* サイトキャッチコピー */
.tagline,
.site-description {
    font-size: 13px;
    color: #666;
    font-weight: 500;
    margin-top: 5px;
}

/* ===========================
   ナビゲーションメニュー (Cocoon完全対応版)
   =========================== */

/* ナビゲーション全体 */
#navi,
.navi {
    background: white;
    border-top: 1px solid rgba(44, 90, 160, 0.15);
    position: sticky;
    top: 0;
    z-index: 9999;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

/* ナビゲーション内部コンテナ */
#navi-in,
.navi-in {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* メニューリスト - 重要な優先度設定 */
#navi-in > ul,
.navi-in > ul,
#navi ul.menu,
.navi ul.menu {
    display: flex !important;
    justify-content: center;
    align-items: center;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 5px;
    flex-wrap: wrap;
}

/* メニュー項目 */
#navi-in > ul > li,
.navi-in > ul > li,
#navi ul.menu > li,
.navi ul.menu > li {
    position: relative;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* メニューリンク - 重要な優先度設定 */
#navi-in > ul > li > a,
.navi-in > ul > li > a,
#navi ul.menu > li > a,
.navi ul.menu > li > a {
    display: block;
    padding: 18px 20px !important;
    color: #333 !important;
    text-decoration: none !important;
    font-weight: 600;
    font-size: 15px;
    transition: all 0.3s ease;
    position: relative;
    border: none !important;
}

/* ホバー時のアンダーライン効果 */
#navi-in > ul > li > a::after,
.navi-in > ul > li > a::after,
#navi ul.menu > li > a::after,
.navi ul.menu > li > a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, #0cb6bf, #2c5aa0);
    transition: width 0.3s ease;
}

/* ホバー状態 */
#navi-in > ul > li > a:hover,
.navi-in > ul > li > a:hover,
#navi ul.menu > li > a:hover,
.navi ul.menu > li > a:hover {
    color: #2c5aa0 !important;
    background: rgba(44, 90, 160, 0.05) !important;
}

#navi-in > ul > li > a:hover::after,
.navi-in > ul > li > a:hover::after,
#navi ul.menu > li > a:hover::after,
.navi ul.menu > li > a:hover::after {
    width: 80%;
}

/* 現在のページ / アクティブなメニュー項目 */
#navi-in > ul > li.current-menu-item > a,
.navi-in > ul > li.current-menu-item > a,
#navi ul.menu > li.current-menu-item > a,
.navi ul.menu > li.current-menu-item > a,
#navi-in > ul > li.current_page_item > a,
.navi-in > ul > li.current_page_item > a,
#navi ul.menu > li.current_page_item > a,
.navi ul.menu > li.current_page_item > a {
    color: #2c5aa0 !important;
    background: rgba(44, 90, 160, 0.08) !important;
}

#navi-in > ul > li.current-menu-item > a::after,
.navi-in > ul > li.current-menu-item > a::after,
#navi ul.menu > li.current-menu-item > a::after,
.navi ul.menu > li.current-menu-item > a::after,
#navi-in > ul > li.current_page_item > a::after,
.navi-in > ul > li.current_page_item > a::after,
#navi ul.menu > li.current_page_item > a::after,
.navi ul.menu > li.current_page_item > a::after {
    width: 80%;
}

/* CTAボタン（お問い合わせボタン） - 最高優先度 */
#navi-in .header-cta,
.navi-in .header-cta,
#navi .header-cta,
.navi .header-cta,
#navi-in .header-cta > a,
.navi-in .header-cta > a,
#navi .header-cta > a,
.navi .header-cta > a,
#navi-in ul.menu > li.header-cta > a,
.navi-in ul.menu > li.header-cta > a,
#navi ul.menu > li.header-cta > a,
.navi ul.menu > li.header-cta > a {
    background: #2c5aa0 !important;
    color: white !important;
    border-radius: 30px !important;
    padding: 12px 30px !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 15px rgba(44, 90, 160, 0.3) !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

/* CTAボタンのアンダーラインを非表示 */
#navi-in .header-cta::after,
.navi-in .header-cta::after,
#navi .header-cta::after,
.navi .header-cta::after,
#navi-in .header-cta > a::after,
.navi-in .header-cta > a::after,
#navi .header-cta > a::after,
.navi .header-cta > a::after,
#navi-in ul.menu > li.header-cta > a::after,
.navi-in ul.menu > li.header-cta > a::after,
#navi ul.menu > li.header-cta > a::after,
.navi ul.menu > li.header-cta > a::after {
    display: none !important;
    content: none !important;
}

/* CTAボタンホバー状態 */
#navi-in .header-cta:hover,
.navi-in .header-cta:hover,
#navi .header-cta:hover,
.navi .header-cta:hover,
#navi-in .header-cta > a:hover,
.navi-in .header-cta > a:hover,
#navi .header-cta > a:hover,
.navi .header-cta > a:hover,
#navi-in ul.menu > li.header-cta > a:hover,
.navi-in ul.menu > li.header-cta > a:hover,
#navi ul.menu > li.header-cta > a:hover,
.navi ul.menu > li.header-cta > a:hover {
    background: #234a82 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(44, 90, 160, 0.4) !important;
}

/* モバイルメニューボタン */
#menu-button,
.menu-button {
    background: #2c5aa0;
    border: none;
    color: white;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.3s ease;
}

#menu-button:hover,
.menu-button:hover {
    background: #234a82;
}

/* ===========================
   フッター装飾 (Cocoon完全対応版)
   =========================== */

/* フッター全体 */
#footer,
.footer {
    background: linear-gradient(180deg, #f8f9fa 0%, #ffffff 50%, #f5f8fb 100%);
    border-top: 4px solid #2c5aa0;
    margin-top: 80px;
    padding: 60px 0 0;
}

/* フッター内部コンテナ */
#footer-in,
.footer-in {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px 40px;
}

/* フッターウィジェットエリア */
.footer-widgets,
#footer .footer-widgets {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
    margin-bottom: 40px;
}

/* 個別のウィジェット */
.footer-widget,
#footer .widget {
    padding: 0;
}

/* ウィジェットタイトル */
.footer-widget .widget-title,
#footer .widget .widget-title {
    font-size: 16px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #2c5aa0;
}

/* フッターセクションスタイル（カスタムHTML用） */
.footer-section {
    padding: 0;
    margin-bottom: 20px;
}

.footer-section-title {
    font-size: 16px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #2c5aa0;
}

/* フッターメニュー */
.footer-menu,
#footer ul,
.footer-widget ul,
#footer .widget ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.footer-menu li,
#footer ul li,
.footer-widget ul li,
#footer .widget ul li {
    margin-bottom: 12px !important;
    padding: 0 !important;
    list-style: none !important;
}

.footer-menu a,
#footer ul a,
.footer-widget ul a,
#footer .widget ul a {
    /*color: #666 !important;*/
    text-decoration: none !important;
    font-size: 14px;
    transition: all 0.3s ease;
    display: inline-block;
    position: relative;
    padding-left: 15px;
}

.footer-menu a::before,
#footer ul a::before,
.footer-widget ul a::before,
#footer .widget ul a::before {
    content: '▸';
    position: absolute;
    left: 0;
    color: #0cb6bf;
    transition: transform 0.3s ease;
}

.footer-menu a:hover,
#footer ul a:hover,
.footer-widget ul a:hover,
#footer .widget ul a:hover {
    color: #2c5aa0 !important;
    padding-left: 20px;
}

.footer-menu a:hover::before,
#footer ul a:hover::before,
.footer-widget ul a:hover::before,
#footer .widget ul a:hover::before {
    transform: translateX(5px);
}

/* 会社情報エリア */
.footer-company {
    padding: 0;
    margin-bottom: 30px;
}

.footer-logo {
    margin-bottom: 20px;
}

.footer-logo img {
    max-width: 200px;
    height: auto;
}

.footer-company-name {
    font-size: 18px;
    font-weight: 700;
    color: #333;
    margin-bottom: 15px;
}

.footer-company-info {
    font-size: 14px;
    line-height: 1.8;
    color: #666;
}

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

.footer-phone-large {
    font-size: 22px;
    font-weight: 700;
    color: #2c5aa0;
    margin: 15px 0;
    display: block;
}

.footer-phone-large a {
    color: #2c5aa0;
    text-decoration: none;
}

.footer-phone-large a:hover {
    text-decoration: underline;
}

.footer-hours {
    font-size: 13px;
    color: #888;
    margin-top: 5px;
}

/* フッターボトムバー */
.footer-bottom,
#footer .footer-bottom {
    background: #2c5aa0;
    color: white;
    padding: 20px 0;
    margin: 40px 0 0;
}

.footer-bottom-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.footer-bottom-menu {
    display: flex;
    gap: 20px;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
}

.footer-bottom-menu li {
    margin: 0 !important;
    padding: 0 !important;
}

.footer-bottom-menu a {
    color: white !important;
    text-decoration: none;
    font-size: 13px;
    opacity: 0.9;
}

.footer-bottom-menu a:hover {
    opacity: 1;
    text-decoration: underline !important;
}

/* コピーライト */
.footer-copyright,
#footer .footer-copyright,
.copyright {
    font-size: 13px;
    opacity: 0.9;
    color: white;
    text-align: center;
}

/* フッターCTAエリア */
.footer-cta {
    background: linear-gradient(135deg, #2c5aa0 0%, #234a82 100%);
    color: white;
    padding: 40px;
    border-radius: 15px;
    text-align: center;
    margin-bottom: 40px;
    box-shadow: 0 5px 20px rgba(44, 90, 160, 0.3);
}

.footer-cta-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 10px;
}

.footer-cta-subtitle {
    font-size: 15px;
    margin-bottom: 25px;
    opacity: 0.95;
}

.footer-cta-button {
    display: inline-block;
    background: white;
    color: #2c5aa0;
    padding: 15px 50px;
    border-radius: 30px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.footer-cta-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    background: #0cb6bf;
    color: white;
}

/* ===========================
   レスポンシブ対応 (ヘッダー・フッター)
   =========================== */

@media (max-width: 1024px) {
    .footer-widgets,
    #footer .footer-widgets {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

@media (max-width: 768px) {
    /* ヘッダー */
    #header-container,
    .header-container {
        padding: 15px 20px;
    }
    
    .site-name-text,
    .site-title {
        font-size: 20px;
    }
    
    /* ナビゲーション - モバイル対応 */
    #navi-in > ul,
    .navi-in > ul,
    #navi ul.menu,
    .navi ul.menu {
        flex-direction: column;
        gap: 0;
    }
    
    #navi-in > ul > li,
    .navi-in > ul > li,
    #navi ul.menu > li,
    .navi ul.menu > li {
        width: 100%;
    }
    
    #navi-in > ul > li > a,
    .navi-in > ul > li > a,
    #navi ul.menu > li > a,
    .navi ul.menu > li > a {
        padding: 15px 20px !important;
        border-bottom: 1px solid rgba(12, 182, 191, 0.1) !important;
    }
    
    /* フッター */
    #footer-in,
    .footer-in {
        padding: 0 20px 30px;
    }
    
    .footer-widgets,
    #footer .footer-widgets {
        grid-template-columns: 1fr;
        gap: 35px;
    }
    
    .footer-bottom-content {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
    
    .footer-bottom-menu {
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }
    
    .footer-cta {
        padding: 30px 20px;
    }
    
    .footer-cta-title {
        font-size: 20px;
    }
}

@media (max-width: 480px) {
    .footer-phone-large {
        font-size: 18px;
    }
    
    .footer-cta-button {
        padding: 12px 30px;
        font-size: 14px;
    }
}

/* ===========================
   追加の装飾要素
   =========================== */

/* アクセントライン */
.accent-line {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, #2c5aa0 0%, rgba(44, 90, 160, 0) 100%);
    margin: 15px 0;
}

/* アイコン装飾 */
.icon-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: rgba(44, 90, 160, 0.1);
    border-radius: 50%;
    color: #2c5aa0;
    margin-right: 10px;
}

/* スムーススクロール */
html {
    scroll-behavior: smooth;
}

/* アニメーション：フェードイン */
@keyframes slideDown {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.menu-button-in{
	#ffffff !important;
}
/* ===============================================
   問い合わせCTAセクション（青背景・中央配置）
   =============================================== */
.cta-contact-box {
    background: linear-gradient(135deg, #2c5aa0 0%, #1e4080 100%);
    border-radius: 8px;
    padding: 32px;
    margin: 32px 0;
    text-align: center;
    box-shadow: 0 4px 12px rgba(44,90,160,0.3);
    position: relative;
    overflow: hidden;
}

/* 光沢エフェクト（ホバー時） */
.cta-contact-box::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
    transition: left 0.5s ease;
}

.cta-contact-box:hover::before {
    left: 100%;
}

.cta-contact-box p {
    position: relative;
    z-index: 1;
}

.cta-contact-box p:first-child {
    margin: 0 0 20px 0;
}

.cta-contact-box p:last-child {
    margin: 0;
}

.cta-contact-box .cta-button {
    display: inline-block;
    background-color: #fff;
    color: #2c5aa0;
    padding: 16px 40px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.2em;
    transition: all 0.3s ease;
}

.cta-contact-box .cta-button:hover {
    background-color: #f0f4f8;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.cta-contact-box .cta-phone {
    color: #fff;
    font-size: 1.1em;
}

.cta-contact-box .cta-phone img {
    vertical-align: middle;
}

/* ===============================================
   フッターメニュー内のcontactリンクから光沢エフェクトを除外
   =============================================== */
#footer a[href*="contact"]::before,
.footer a[href*="contact"]::before,
.footer-bottom a[href*="contact"]::before,
#navi a[href*="contact"]::before,
.navi a[href*="contact"]::before,
.menu-item a[href*="contact"]::before {
    content: none !important;
    display: none !important;
    background: none !important;
}

/* フッターとナビゲーション内のリンクにはpositionをstaticに戻す */
#footer a[href*="contact"],
.footer a[href*="contact"],
.footer-bottom a[href*="contact"],
#navi a[href*="contact"],
.navi a[href*="contact"],
.menu-item a[href*="contact"] {
    position: static !important;
    overflow: visible !important;
}

.site-name-text::before {
    content: '';
    display: inline-block;
    width: 40px;
    height: 40px;
    background-image: url('/wp-content/uploads/2025/11/hakamamori_logo_font.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    margin-right: 10px;
}

.site-name-text {
  font-size: 20px;
  white-space: nowrap !important;
}

/************************************
** クリック展開型 電話番号CTA
** （HTML/CSS時点では番号を出力せず、
**   クリック後にJSがtel:リンクを描画する）
************************************/
.ohaka-tel { display: inline-block; line-height: 1.4; }

.ohaka-tel__btn {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  padding: 12px 22px;
  background: #fff;
  color: #1f3b5c;
  border: 2px solid #1f3b5c;
  border-radius: 999px;
  font-weight: 700;
  font-size: 1.05rem;
  cursor: pointer;
  transition: background .2s, color .2s, transform .05s;
  font-family: inherit;
}
.ohaka-tel__btn:hover  { background: #1f3b5c; color: #fff; }
.ohaka-tel__btn:active { transform: translateY(1px); }
.ohaka-tel__btn::before { content: "📞"; font-size: 1.1em; }

.ohaka-tel__link {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  padding: 10px 22px;
  background: #16a34a;
  color: #fff !important;
  border-radius: 999px;
  font-weight: 800;
  font-size: 1.45rem;
  letter-spacing: .02em;
  text-decoration: none !important;
  box-shadow: 0 2px 0 #0e7a37;
}
.ohaka-tel__link:hover { background: #15803d; color: #fff !important; }
.ohaka-tel__link::before { content: "📞"; font-size: 1em; }

.ohaka-tel__hours {
  display: block;
  margin-top: 6px;
  font-size: .8rem;
  color: #555;
}

@media (max-width: 480px) {
  .ohaka-tel__btn  { font-size: 1rem;   padding: 11px 18px; }
  .ohaka-tel__link { font-size: 1.45rem; padding: 10px 18px; }
}


/************************************
** ===== 和モダンデザイン =====
** 対象: 全ての投稿(single-post)＋LP(/lp/, page-id-2489)
** トーン: 紺/墨/抹茶/金茶/生成り、明朝見出し
************************************/
body.single-post,
body.page-id-2489 {
  --c-sumi:    #1f1d1a;
  --c-konan:   #1c2c44;
  --c-konan-d: #14223a;
  --c-matcha:  #6f7e4f;
  --c-matcha-d:#4f5a36;
  --c-kincha:  #b5894a;
  --c-kincha-d:#8b6634;
  --c-kinari:  #faf5ec;
  --c-shoji:   #fbf6e9;
  --c-shiro:   #fdfdfa;
  --c-border:  #d8d2c4;
  --c-border-l:#ebe5d6;
  --c-text:    #2a2a28;
  --c-text-m:  #6b6862;
  --f-mincho:  'Noto Serif JP', '游明朝', YuMincho, 'Hiragino Mincho ProN', 'ヒラギノ明朝 ProN W3', 'MS PMincho', serif;
}

/* ベース ----------------------------------------------------- */
body.single-post .entry-content {
  color: var(--c-text);
  line-height: 1.95;
  letter-spacing: .015em;
  font-feature-settings: "palt" 1;
}
body.single-post .entry-content > p { margin: 1em 0 1.4em; }

/* H2: 細い下線 + 金茶アクセントライン --------------------------- */
body.single-post .entry-content h2 {
  font-family: var(--f-mincho);
  font-weight: 600;
  font-size: 1.55em;
  color: var(--c-konan);
  margin: 2.6em 0 1.0em;
  padding: 0 0 .55em;
  background: none !important;
  background-image: none !important;
  border: 0;
  border-bottom: 1px solid var(--c-border);
  position: relative;
}
body.single-post .entry-content h2::before { content: none !important; }
body.single-post .entry-content h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 64px;
  height: 3px;
  background: var(--c-kincha);
  border: 0;
  margin: 0;
  padding: 0;
}
body.single-post .entry-content h2 + p { margin-top: .8em; }

/* H3: 控えめな縦バー ------------------------------------------ */
body.single-post .entry-content h3 {
  font-family: var(--f-mincho);
  font-weight: 600;
  font-size: 1.22em;
  color: var(--c-sumi);
  margin: 2.0em 0 .7em;
  padding: .12em 0 .12em .85em;
  background: none;
  border: 0;
  border-left: 3px solid var(--c-matcha);
}
body.single-post .entry-content h3::before,
body.single-post .entry-content h3::after { content: none; }

/* 段落・リスト --------------------------------------------- */
body.single-post .entry-content ul,
body.single-post .entry-content ol { margin: .6em 0 1.6em 1.4em; padding: 0; }
body.single-post .entry-content ul li { margin: .35em 0; }
body.single-post .entry-content ul li::marker { color: var(--c-matcha); }
body.single-post .entry-content ol li::marker { color: var(--c-kincha); font-weight: 700; }

/* 強調 ------------------------------------------------------ */
body.single-post .entry-content strong {
  color: var(--c-konan);
  background: linear-gradient(transparent 60%, rgba(181,137,74,.20) 60%);
  padding: 0 .05em;
  font-weight: 700;
}

/* リンク ---------------------------------------------------- */
body.single-post .entry-content a {
  color: var(--c-konan);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--c-border);
}
body.single-post .entry-content a:hover {
  color: var(--c-kincha);
  text-decoration-color: var(--c-kincha);
}

/* cta-box2 → 和紙風アラート ------------------------------------ */
body.single-post .entry-content .cta-box2 {
  background: linear-gradient(135deg, var(--c-shoji) 0%, var(--c-kinari) 100%);
  border: 1px solid var(--c-border);
  border-left: 4px solid var(--c-kincha);
  border-radius: 3px;
  padding: 1.1em 1.3em;
  margin: 1.8em 0;
  box-shadow: none;
  color: var(--c-sumi);
}
body.single-post .entry-content .cta-box2 p { margin: 0; }
body.single-post .entry-content .cta-box2 strong {
  color: var(--c-konan);
  background: none;
}

/* 本文中の CTA ボタン (#form アンカー) ------------------------ */
body.single-post .entry-content a[href*="#form"] {
  display: inline-block;
  background: var(--c-konan) !important;
  background-image: none !important;
  color: var(--c-shiro) !important;
  padding: 16px 38px !important;
  border-radius: 3px !important;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: .04em;
  margin-top: 12px;
  border: 1px solid var(--c-konan);
  box-shadow: 0 2px 0 var(--c-konan-d);
  transition: background .2s, transform .05s, box-shadow .2s;
}
body.single-post .entry-content a[href*="#form"]:hover {
  background: var(--c-kincha) !important;
  border-color: var(--c-kincha);
  box-shadow: 0 2px 0 var(--c-kincha-d);
}
body.single-post .entry-content a[href*="#form"]:active {
  transform: translateY(1px);
  box-shadow: 0 1px 0 var(--c-konan-d);
}

/* テーブル -------------------------------------------------- */
body.single-post .entry-content table {
  border: 1px solid var(--c-border);
  border-collapse: collapse;
  width: 100%;
  margin: 1.4em 0;
}
body.single-post .entry-content table th {
  background: var(--c-kinari);
  color: var(--c-konan);
  font-weight: 700;
  text-align: left;
  border: 1px solid var(--c-border);
  padding: .6em .9em;
}
body.single-post .entry-content table td {
  border: 1px solid var(--c-border);
  padding: .6em .9em;
  background: var(--c-shiro);
}
body.single-post .entry-content table tr:nth-child(even) td { background: #fefcf6; }

/* ohaka-form ------------------------------------------------ */
body.single-post .ohaka-form {
  background: var(--c-shiro);
  border: 1px solid var(--c-border);
  border-radius: 4px;
  padding: 1.6em 1.4em;
}
body.single-post .ohaka-form h3 {
  font-family: var(--f-mincho);
  color: var(--c-konan);
  border: 0;
  padding: 0;
  margin: 0 0 .8em;
  font-size: 1.15em;
}
body.single-post .ohaka-form .form-group label {
  font-weight: 700;
  color: var(--c-sumi);
  font-size: .95em;
}
body.single-post .ohaka-form input[type="text"],
body.single-post .ohaka-form input[type="email"],
body.single-post .ohaka-form input[type="tel"],
body.single-post .ohaka-form select,
body.single-post .ohaka-form textarea {
  border: 1px solid var(--c-border);
  border-radius: 3px;
  padding: .6em .8em;
  background: var(--c-shiro);
  width: 100%;
  font-family: inherit;
}
body.single-post .ohaka-form input:focus,
body.single-post .ohaka-form select:focus,
body.single-post .ohaka-form textarea:focus {
  outline: 0;
  border-color: var(--c-konan);
  box-shadow: 0 0 0 3px rgba(28,44,68,.10);
}

/* CF7 submit ------------------------------------------------ */
body.single-post .wpcf7-submit,
body.single-post .submit-button .wpcf7-submit {
  background: var(--c-konan) !important;
  background-image: none !important;
  border: 1px solid var(--c-konan) !important;
  color: var(--c-shiro) !important;
  padding: 14px 36px !important;
  border-radius: 3px !important;
  font-weight: 700;
  letter-spacing: .04em;
  box-shadow: 0 2px 0 var(--c-konan-d) !important;
  transition: background .2s !important;
  cursor: pointer;
}
body.single-post .wpcf7-submit:hover {
  background: var(--c-kincha) !important;
  border-color: var(--c-kincha) !important;
  box-shadow: 0 2px 0 var(--c-kincha-d) !important;
}

/* 電話クリック展開ウィジェット (PoC色) ------------------------ */
body.single-post .ohaka-tel__btn {
  background: var(--c-shiro);
  color: var(--c-konan);
  border-color: var(--c-konan);
}
body.single-post .ohaka-tel__btn:hover {
  background: var(--c-konan);
  color: var(--c-shiro);
}
body.single-post .ohaka-tel__link {
  background: var(--c-matcha);
  color: var(--c-shiro) !important;
  box-shadow: 0 2px 0 var(--c-matcha-d);
}
body.single-post .ohaka-tel__link:hover {
  background: var(--c-kincha);
  box-shadow: 0 2px 0 var(--c-kincha-d);
}

/* H1 (記事タイトル) も明朝に揃える ----------------------------- */
body.single-post .entry-title,
body.single-post .article-header .entry-title {
  font-family: var(--f-mincho);
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--c-sumi);
}

/* スクロール時の薄い背景でくっきり読みやすく ------------------- */
body.single-post #main { background: linear-gradient(to bottom, #fffefb 0%, var(--c-shiro) 200px); }



/************************************
** LP (page-id-2489 = /lp/) 最小オーバーライド
** ※ 元のレイアウト・余白・角丸・影・アニメ・擬似要素・content は一切触らない
** ※ 色値とフォントファミリーのみ swap
**
** 旧パレット → 新パレット 対応:
**   #1a3a6e / #2c5aa0 / #1e4080  (青系)  → #1c2c44 / #14223a / #2a3e5a (紺)
**   #09d3bb / #07b8a3            (teal)  → #b5894a / #8b6634          (金茶)
**   #ffc107 / #f5a623            (黄)    → #b5894a                    (金茶)
************************************/

/* ===== FV 背景 (160deg gradient blue) → 紺グラデ ===== */
body.page-id-2489 .lp-fv {
  background: linear-gradient(160deg, #14223a 0%, #1c2c44 40%, #14223a 100%) !important;
}

/* ===== 中間 CTA セクション ===== */
body.page-id-2489 .lp-mid-cta {
  background: linear-gradient(135deg, #1c2c44 0%, #14223a 100%) !important;
}

/* ===== セクション色違い ===== */
body.page-id-2489 .lp-section--blue {
  background: linear-gradient(135deg, #1c2c44 0%, #14223a 100%) !important;
}

/* ===== セクションラベル ===== */
body.page-id-2489 .lp-section__label {
  background: #1c2c44 !important;
}

/* ===== セクション見出し色 ===== */
body.page-id-2489 .lp-section__title,
body.page-id-2489 .lp-final-cta__title,
body.page-id-2489 .lp-form-area__title {
  color: #1c2c44 !important;
}

/* ===== FV ヘッドライン (em は金茶ハイライト) ===== */
body.page-id-2489 .lp-fv__headline em {
  color: #b5894a !important;
}

/* ===== FV トラスト数字 ===== */
body.page-id-2489 .lp-fv__trust-num {
  color: #b5894a !important;
}

/* ===== FV アクセントバッジ ===== */
body.page-id-2489 .lp-fv__badge--accent {
  background: #b5894a !important;
}

/* ===== トラストバー ===== */
body.page-id-2489 .lp-trust-bar__item {
  color: #1c2c44 !important;
}

/* ===== 理由カード ===== */
body.page-id-2489 .lp-reason-card {
  border-top-color: #b5894a !important;
}
body.page-id-2489 .lp-reason-card__num {
  background: linear-gradient(135deg, #1c2c44, #14223a) !important;
}
body.page-id-2489 .lp-reason-card__title {
  color: #1c2c44 !important;
}

/* ===== ステップ ===== */
body.page-id-2489 .lp-steps::before {
  background: linear-gradient(to bottom, #1c2c44, #6f7e4f) !important;
}
body.page-id-2489 .lp-step__num {
  background: linear-gradient(135deg, #1c2c44, #14223a) !important;
}
body.page-id-2489 .lp-step__title {
  color: #1c2c44 !important;
}

/* ===== サービスアイテム ===== */
body.page-id-2489 .lp-service-item__name {
  color: #1c2c44 !important;
}
body.page-id-2489 .lp-service-item__price {
  color: #b5894a !important;
}

/* ===== お客様の声 ★ ===== */
body.page-id-2489 .lp-voice__stars {
  color: #b5894a !important;
}

/* ===== CTA ボタン (teal → 金茶) ===== */
/* メイン CTA: teal グラデーション → 金茶グラデーション */
body.page-id-2489 .lp-cta-btn {
  background: linear-gradient(135deg, #b5894a 0%, #8b6634 100%) !important;
  box-shadow: 0 6px 24px rgba(181, 137, 74, .35) !important;
}
body.page-id-2489 .lp-cta-btn:hover {
  box-shadow: 0 10px 30px rgba(181, 137, 74, .45) !important;
}
/* 白ボタン: 白背景 + 紺文字 (元の意図を尊重) */
body.page-id-2489 .lp-cta-btn--white {
  background: #fff !important;
  color: #1c2c44 !important;
}
body.page-id-2489 .lp-cta-btn--white:hover {
  background: #f5f1e6 !important;
  color: #1c2c44 !important;
}

/* ===== フォントファミリー (見出しを明朝へ) ===== */
body.page-id-2489 .lp-fv__headline,
body.page-id-2489 .lp-section__title,
body.page-id-2489 .lp-final-cta__title,
body.page-id-2489 .lp-form-area__title,
body.page-id-2489 .lp-reason-card__title,
body.page-id-2489 .lp-step__title,
body.page-id-2489 .lp-faq__q,
body.page-id-2489 .lp-case__header {
  font-family: 'Noto Serif JP', '游明朝体', 'Yu Mincho', YuMincho, 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', serif !important;
}

/* ===== FAQ 記号色 ===== */
body.page-id-2489 .lp-faq__q::before {
  color: #b5894a !important;
}
body.page-id-2489 .lp-faq__a::before {
  color: #6f7e4f !important;
}

/* ===== 痛みリスト 赤強調 → 金茶 (色のみ swap、形状は元のまま) ===== */
body.page-id-2489 .lp-pain-list li {
  border-left-color: #b5894a !important;
}

/* ===== ハイライト ===== */
body.page-id-2489 .lp-highlight {
  background: linear-gradient(transparent 60%, rgba(181,137,74,.30) 60%) !important;
}


/************************************
** 中段CTA (single-post の H2 自動挿入)
************************************/
body.single-post .ohaka-mid-cta {
  background: linear-gradient(135deg, var(--c-shoji) 0%, var(--c-kinari) 100%);
  border: 1px solid var(--c-border);
  border-left: 4px solid var(--c-kincha);
  padding: 1.5em 1.6em 1.3em;
  margin: 2.6em 0;
  border-radius: 4px;
  text-align: center;
}
body.single-post .ohaka-mid-cta__lead {
  color: var(--c-text-m);
  font-size: .85em;
  margin: 0 0 .35em;
  letter-spacing: .06em;
}
body.single-post .ohaka-mid-cta__head {
  font-family: var(--f-mincho);
  color: var(--c-konan);
  font-size: 1.35em;
  font-weight: 600;
  margin: 0 0 .65em;
  letter-spacing: .02em;
  border: 0;
  padding: 0;
  background: none;
  line-height: 1.4;
}
body.single-post .ohaka-mid-cta__sub {
  color: var(--c-text);
  font-size: .92em;
  line-height: 1.7;
  margin: 0 auto 1.1em;
  max-width: 36em;
}
body.single-post .ohaka-mid-cta__btns {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin: 0 0 .8em;
}
body.single-post .ohaka-mid-cta__cta {
  display: inline-flex;
  align-items: center;
  background: var(--c-konan) !important;
  background-image: none !important;
  color: var(--c-shiro) !important;
  padding: 12px 28px !important;
  border-radius: 999px !important;
  font-weight: 700;
  text-decoration: none !important;
  letter-spacing: .04em;
  border: 1px solid var(--c-konan);
  box-shadow: 0 2px 0 var(--c-konan-d);
  transition: background .2s, box-shadow .2s;
}
body.single-post .ohaka-mid-cta__cta:hover {
  background: var(--c-kincha) !important;
  border-color: var(--c-kincha);
  color: var(--c-shiro) !important;
  box-shadow: 0 2px 0 var(--c-kincha-d);
}
body.single-post .ohaka-mid-cta__sub2 {
  color: var(--c-text-m);
  font-size: .78em;
  margin: 0;
  letter-spacing: .04em;
}
@media (max-width: 480px) {
  body.single-post .ohaka-mid-cta { padding: 1.3em 1.1em 1.1em; }
  body.single-post .ohaka-mid-cta__head { font-size: 1.18em; }
  body.single-post .ohaka-mid-cta__cta { font-size: .95em; padding: 11px 22px !important; }
}


/************************************
** ホーム (page-id-907) 最小オーバーライド
** 元レイアウト維持、色とフォントのみ swap
************************************/
/* ヒーロー: 青紺グラデ → 紺グラデ */
body.page-id-907 .hm-hero {
  background: linear-gradient(135deg, #1c2c44 0%, #14223a 100%) !important;
}
body.page-id-907 .hm-hero h1,
body.page-id-907 .hm-hero .hm-sub {
  color: #fff !important;
}
body.page-id-907 .hm-hero h1 {
  font-family: var(--f-mincho) !important;
}

/* 白いボタン: 文字色を紺に */
body.page-id-907 .hm-btn,
body.page-id-907 .hm-btn--primary {
  color: #1c2c44 !important;
}
body.page-id-907 .hm-btn--secondary {
  color: #1c2c44 !important;
}
body.page-id-907 .hm-btn--outline {
  color: #fff !important;
  border-color: #fff !important;
}

/* セクションH2: 青ボーダー → 金茶 */
body.page-id-907 .hm-section h2 {
  color: #1c2c44 !important;
  border-left-color: #b5894a !important;
  font-family: var(--f-mincho) !important;
}

/* カードのhover効果（色のみ swap） */
body.page-id-907 .hm-card:hover {
  border-color: #1c2c44 !important;
  box-shadow: 0 5px 20px rgba(28, 44, 68, .15) !important;
}
body.page-id-907 .hm-card h3,
body.page-id-907 .hm-card h4 {
  color: #1c2c44 !important;
}

/* H3 サービスカテゴリの色違い */
/* お墓のサービス (青→紺) */
body.page-id-907 .hm-section h3[style*="#2c5aa0"] {
  color: #1c2c44 !important;
  border-left-color: #1c2c44 !important;
}
/* 仏壇のサービス (teal→抹茶) */
body.page-id-907 .hm-section h3[style*="#0cb6bf"] {
  color: #6f7e4f !important;
  border-left-color: #6f7e4f !important;
}
/* 仏壇のサービス NEW バッジ */
body.page-id-907 .hm-section h3[style*="#0cb6bf"] span[style*="#0cb6bf"] {
  background: #6f7e4f !important;
}
/* 家・庭のサービス (purple→金茶) */
body.page-id-907 .hm-section h3[style*="#9b59b6"] {
  color: #b5894a !important;
  border-left-color: #b5894a !important;
}
body.page-id-907 .hm-section h3[style*="#9b59b6"] span[style*="#9b59b6"] {
  background: #b5894a !important;
}

/* 「まとめて依頼」CTA セクション */
body.page-id-907 .hm-portal div[style*="linear-gradient(135deg,#2c5aa0"] {
  background: linear-gradient(135deg, #1c2c44 0%, #14223a 100%) !important;
}

/* グレーセクション */
body.page-id-907 .hm-section--gray {
  background: var(--c-kinari) !important;
}

/* エリアボックス */
body.page-id-907 .hm-area-box__heading {
  color: #1c2c44 !important;
  border-bottom-color: #1c2c44 !important;
  font-family: var(--f-mincho) !important;
}
body.page-id-907 .hm-area-tag {
  background: #1c2c44 !important;
}
body.page-id-907 .hm-area-tag:hover {
  background: #b5894a !important;
  color: #fff !important;
}

/* 事例ボックス・理由ボックス */
body.page-id-907 .hm-case-box__title,
body.page-id-907 .hm-reason__title,
body.page-id-907 .hm-section__title {
  color: #1c2c44 !important;
  font-family: var(--f-mincho) !important;
}

/* 最終CTA */
body.page-id-907 .hm-cta {
  background: linear-gradient(135deg, #1c2c44 0%, #14223a 100%) !important;
}
body.page-id-907 .hm-cta__title {
  font-family: var(--f-mincho) !important;
}

/* 通知ボックス: 黄→金茶 */
body.page-id-907 .hm-notice {
  background: #faf5ec !important;
  border-color: #b5894a !important;
}
body.page-id-907 .hm-notice__title {
  color: #1c2c44 !important;
  font-family: var(--f-mincho) !important;
}


/************************************
** 他の固定ページ (LP・ホーム除く) を記事と同等のトーンに
** 対象: profile, showroom, staff, company, contact, terms, tokutei-shoho, privacy, toyama-cemeteries-2 など
************************************/
body.page:not(.page-id-2489):not(.page-id-907) {
  --c-sumi:    #1f1d1a;
  --c-konan:   #1c2c44;
  --c-konan-d: #14223a;
  --c-matcha:  #6f7e4f;
  --c-matcha-d:#4f5a36;
  --c-kincha:  #b5894a;
  --c-kincha-d:#8b6634;
  --c-kinari:  #faf5ec;
  --c-shoji:   #fbf6e9;
  --c-shiro:   #fdfdfa;
  --c-border:  #d8d2c4;
  --c-text:    #2a2a28;
  --c-text-m:  #6b6862;
  --f-mincho:  'Noto Serif JP', '游明朝', YuMincho, 'Hiragino Mincho ProN', 'ヒラギノ明朝 ProN W3', 'MS PMincho', serif;
}

body.page:not(.page-id-2489):not(.page-id-907) .entry-content {
  color: var(--c-text);
  line-height: 1.9;
  letter-spacing: .015em;
}
body.page:not(.page-id-2489):not(.page-id-907) .entry-title,
body.page:not(.page-id-2489):not(.page-id-907) .article-header .entry-title {
  font-family: var(--f-mincho);
  font-weight: 600;
  color: var(--c-sumi);
  letter-spacing: .02em;
}
body.page:not(.page-id-2489):not(.page-id-907) .entry-content h1 {
  font-family: var(--f-mincho);
  color: var(--c-sumi);
}
body.page:not(.page-id-2489):not(.page-id-907) .entry-content h2 {
  font-family: var(--f-mincho);
  font-weight: 600;
  color: var(--c-konan);
  background: none !important;
  background-image: none !important;
  border: 0;
  border-bottom: 1px solid var(--c-border);
  padding-bottom: .55em;
  position: relative;
}
body.page:not(.page-id-2489):not(.page-id-907) .entry-content h2::before { content: none !important; }
body.page:not(.page-id-2489):not(.page-id-907) .entry-content h2::after {
  content: "";
  position: absolute;
  left: 0; bottom: -1px;
  width: 64px; height: 3px;
  background: var(--c-kincha);
}
body.page:not(.page-id-2489):not(.page-id-907) .entry-content h3 {
  font-family: var(--f-mincho);
  font-weight: 600;
  color: var(--c-sumi);
  background: none;
  border: 0;
  border-left: 3px solid var(--c-matcha);
  padding-left: .85em;
}
body.page:not(.page-id-2489):not(.page-id-907) .entry-content h3::before,
body.page:not(.page-id-2489):not(.page-id-907) .entry-content h3::after { content: none; }
body.page:not(.page-id-2489):not(.page-id-907) .entry-content strong {
  color: var(--c-konan);
}
body.page:not(.page-id-2489):not(.page-id-907) .entry-content a {
  color: var(--c-konan);
}
body.page:not(.page-id-2489):not(.page-id-907) .entry-content a:hover {
  color: var(--c-kincha);
}

/* お問い合わせフォーム類のCTA等は記事と同じトーンに */
body.page:not(.page-id-2489):not(.page-id-907) .ohaka-form {
  border-color: var(--c-border);
}
body.page:not(.page-id-2489):not(.page-id-907) .wpcf7-submit {
  background: var(--c-konan) !important;
  background-image: none !important;
  border: 1px solid var(--c-konan) !important;
  color: var(--c-shiro) !important;
  border-radius: 3px !important;
  font-weight: 700;
  letter-spacing: .04em;
  box-shadow: 0 2px 0 var(--c-konan-d) !important;
}
body.page:not(.page-id-2489):not(.page-id-907) .wpcf7-submit:hover {
  background: var(--c-kincha) !important;
  border-color: var(--c-kincha) !important;
  box-shadow: 0 2px 0 var(--c-kincha-d) !important;
}

/* ohaka-tel ウィジェット (固定ページ用) */
body.page:not(.page-id-2489):not(.page-id-907) .ohaka-tel__btn {
  background: #fff;
  color: var(--c-konan);
  border-color: var(--c-konan);
}
body.page:not(.page-id-2489):not(.page-id-907) .ohaka-tel__btn:hover {
  background: var(--c-konan);
  color: #fff;
}
body.page:not(.page-id-2489):not(.page-id-907) .ohaka-tel__link {
  background: var(--c-matcha);
  color: #fff !important;
  box-shadow: 0 2px 0 var(--c-matcha-d);
}
body.page:not(.page-id-2489):not(.page-id-907) .ohaka-tel__link:hover {
  background: var(--c-kincha);
  box-shadow: 0 2px 0 var(--c-kincha-d);
}


/************************************
** 施工事例カード（ショートコード [ohaka_cases]）
************************************/
.ohaka-cases-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 22px;
  margin: 1.6em 0 2em;
}
.ohaka-case-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #d8d2c4;
  border-radius: 4px;
  text-decoration: none !important;
  color: inherit;
  overflow: hidden;
  transition: transform .2s, box-shadow .2s, border-color .2s;
}
.ohaka-case-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(31,29,26,.08);
  border-color: #b5894a;
}
.ohaka-case-card__thumb {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #faf5ec;
}
.ohaka-case-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ohaka-case-card__body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.ohaka-case-card__title {
  font-family: 'Noto Serif JP', '游明朝', YuMincho, serif;
  font-weight: 600;
  font-size: 1.05em;
  line-height: 1.5;
  color: #1c2c44;
  margin: 0;
  border: 0 !important;
  padding: 0 !important;
  background: none !important;
}
.ohaka-case-card__excerpt {
  font-size: .88em;
  line-height: 1.7;
  color: #2a2a28;
  margin: 0;
}
.ohaka-case-card__more {
  margin-top: auto;
  color: #b5894a;
  font-weight: 700;
  font-size: .85em;
  letter-spacing: .03em;
}

/************************************
** お客様の声カード（ショートコード [ohaka_voices]）
************************************/
.ohaka-voices-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 22px;
  margin: 1.6em 0 2em;
}
.ohaka-voice-card {
  background: linear-gradient(135deg, #fbf6e9 0%, #faf5ec 100%);
  border: 1px solid #d8d2c4;
  border-radius: 4px;
  padding: 22px 24px 18px;
  position: relative;
  margin: 0;
}
.ohaka-voice-card::before {
  content: "“";
  position: absolute;
  top: 4px;
  left: 12px;
  font-size: 3em;
  font-family: 'Noto Serif JP', '游明朝', serif;
  color: #b5894a;
  opacity: .6;
  line-height: 1;
}
.ohaka-voice-card__stars {
  color: #b5894a;
  font-size: 1em;
  letter-spacing: .12em;
  margin-bottom: 6px;
}
.ohaka-voice-card__body {
  margin: 0;
  border: 0 !important;
  background: none !important;
  padding: 0 !important;
}
.ohaka-voice-card__body .ohaka-voice__quote,
.ohaka-voice-card__body p:first-of-type {
  font-size: .98em;
  line-height: 1.85;
  color: #2a2a28;
  margin: 0 0 12px;
}
.ohaka-voice-card__body .ohaka-voice__meta,
.ohaka-voice-card__body p:last-of-type {
  margin: 0;
  font-size: .82em;
  color: #6b6862;
  letter-spacing: .04em;
  text-align: right;
}


/************************************
** ヘッダーメニュー (PC) 1行収納 + 和モダン整形
************************************/
@media (min-width: 1024px) {
  /* 8項目を1行にきっちり収める */
  .menu-pc.menu-header {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center;
    align-items: stretch;
    gap: 0;
  }
  .menu-pc.menu-header > li.menu-item {
    /* 親テーマ .navi-in > ul li { width:176px; height:60px } を明示的に解除 */
    width: auto;
    height: auto;
    min-width: 0;
    flex: 0 1 auto;
    text-align: center;
    white-space: nowrap;
  }
  .menu-pc.menu-header > li.menu-item > a {
    padding: 0 14px !important;
    font-size: 14.5px;
    letter-spacing: .03em;
    line-height: 1.4;
    color: #1c2c44 !important;
    transition: background .2s, color .2s;
  }
  .menu-pc.menu-header > li.menu-item > a .item-label {
    font-weight: 600;
  }
  .menu-pc.menu-header > li.menu-item:last-child > a {
    /* 最終項目「無料相談」は紺ベタの強調CTA */
    background: #1c2c44 !important;
    color: #fff !important;
    margin: 6px 0;
    border-radius: 3px;
    padding: 10px 18px !important;
    box-shadow: 0 2px 0 #14223a;
  }
  .menu-pc.menu-header > li.menu-item:last-child > a:hover {
    background: #b5894a !important;
    box-shadow: 0 2px 0 #8b6634;
  }
  .menu-pc.menu-header > li.menu-item > a:hover {
    color: #b5894a !important;
    background: transparent;
  }
  /* 和モダンの細い区切り線 */
  .menu-pc.menu-header > li.menu-item:not(:last-child)::after {
    content: "";
    display: block;
    width: 1px;
    background: #d8d2c4;
    align-self: center;
    height: 1.4em;
  }
}

/* 1024〜1199 はやや詰めて表示 */
@media (min-width: 1024px) and (max-width: 1199px) {
  .menu-pc.menu-header > li.menu-item > a {
    padding: 0 9px !important;
    font-size: 13.5px;
  }
}


/************************************
** ヘッダー: ロゴサイズ抑制（メニュー幅確保）
************************************/
@media (min-width: 1024px) {
  .site-name-text {
    font-size: 16px !important;
    white-space: nowrap !important;
  }
  .site-name-text::before {
    width: 32px !important;
    height: 32px !important;
    margin-right: 6px !important;
  }
  /* ヘッダー余白を詰める */
  .header-container-in.hlt-top-menu .site-name-text-link {
    padding: 0 !important;
  }
  .header-container .header-in.wrap {
    padding-top: 12px;
    padding-bottom: 6px;
  }
}

/* 1024〜1279 では更にコンパクトに */
@media (min-width: 1024px) and (max-width: 1279px) {
  .site-name-text { font-size: 14.5px !important; }
  .site-name-text::before { width: 28px !important; height: 28px !important; margin-right: 4px !important; }
  .menu-pc.menu-header > li.menu-item > a {
    padding: 0 7px !important;
    font-size: 13px;
  }
  .menu-pc.menu-header > li.menu-item:last-child > a {
    padding: 9px 14px !important;
  }
}


/************************************
** ヘッダーのラップ幅を拡張（メニュー収納のため）
************************************/
@media (min-width: 1280px) {
  .navi.cf,
  .navi-in.wrap,
  .header.wrap,
  .header-in.wrap {
    max-width: 1380px !important;
  }
}

/* 1024px〜1279px ではメニュー2行を許容 */
@media (min-width: 1024px) and (max-width: 1279px) {
  .menu-pc.menu-header {
    flex-wrap: wrap !important;
    row-gap: 4px;
  }
}

/* 万一 ellipsis truncation が効いてしまう場合の解除 */
.menu-pc.menu-header > li.menu-item > a .item-label,
.menu-pc.menu-header > li.menu-item > a {
  text-overflow: clip !important;
  overflow: visible !important;
}


/************************************
** ヘッダーロゴテキスト整形（収納強化）
** ロゴ画像のみ大きめ表示、テキストは画面で隠す
************************************/
@media (min-width: 1024px) {
  /* 「富山石川北陸のお墓石材 墓まもり」の文字部分は視覚的に消す
     (アクセシビリティのために残す) */
  .site-name-text {
    font-size: 0 !important;
    line-height: 0;
    color: transparent !important;
  }
  /* ロゴ画像のみ表示 */
  .site-name-text::before {
    width: 200px !important;
    height: 50px !important;
    margin-right: 0 !important;
    background-image: url('/wp-content/uploads/2025/11/hakamamori_logo_font.png') !important;
    background-size: contain !important;
    background-position: left center !important;
    background-repeat: no-repeat !important;
    display: inline-block !important;
  }
  /* メニュー項目余白を更に詰める */
  .menu-pc.menu-header > li.menu-item > a {
    padding: 0 12px !important;
  }
  .menu-pc.menu-header > li.menu-item:last-child > a {
    padding: 9px 18px !important;
  }
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .site-name-text::before {
    width: 160px !important;
    height: 40px !important;
  }
  .menu-pc.menu-header > li.menu-item > a {
    padding: 0 8px !important;
    font-size: 12.5px;
  }
}


/************************************
** ヘッダー: ロゴ + 短縮サイト名 表示
************************************/
@media (min-width: 1024px) {
  /* ロゴアイコン適正サイズ */
  .site-name-text {
    font-size: 18px !important;
    line-height: 1 !important;
    color: #1c2c44 !important;
    font-family: var(--f-mincho) !important;
    font-weight: 600 !important;
    letter-spacing: .04em;
  }
  .site-name-text::before {
    width: 36px !important;
    height: 36px !important;
    margin-right: 8px !important;
    background-image: url('/wp-content/uploads/2025/11/hakamamori_logo_font.png') !important;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }
}

/* 1024〜1279 はロゴをコンパクトに */
@media (min-width: 1024px) and (max-width: 1279px) {
  .site-name-text { font-size: 16px !important; }
  .site-name-text::before { width: 30px !important; height: 30px !important; margin-right: 6px !important; }
}


/************************************
** メニュー折り返しブレークポイント調整
** 1400px+ : 1行収納
** 1024-1399 : 改行可能（2行になる場合あり）
************************************/
@media (min-width: 1024px) and (max-width: 1399px) {
  .menu-pc.menu-header {
    flex-wrap: wrap !important;
    row-gap: 6px;
    justify-content: flex-end;
  }
  .menu-pc.menu-header > li.menu-item:not(:last-child)::after {
    display: none;
  }
}
@media (min-width: 1400px) {
  .menu-pc.menu-header {
    flex-wrap: nowrap !important;
  }
}


/************************************
** 無料相談CTA: 内部のitem-labelに直接白文字を当てる
************************************/
.menu-pc.menu-header > li.menu-item:last-child > a,
.menu-pc.menu-header > li.menu-item:last-child > a .item-label,
.menu-pc.menu-header > li.menu-item:last-child > a .caption-wrap,
.menu-pc.menu-header > li.menu-item:last-child > a:visited {
  color: #ffffff !important;
}
.menu-pc.menu-header > li.menu-item:last-child > a:hover,
.menu-pc.menu-header > li.menu-item:last-child > a:hover .item-label {
  color: #ffffff !important;
}


/************************************
** 施工事例の体裁
************************************/
body.single-post.category-case .ohaka-case-spec {
  margin: 1.5em 0 2em;
}
body.single-post .ohaka-case-spec__table,
body.single-post .ohaka-case-spec__pricing {
  width: 100%;
  border-collapse: collapse;
  margin: 1.2em 0;
  border: 1px solid var(--c-border);
}
body.single-post .ohaka-case-spec__table th,
body.single-post .ohaka-case-spec__pricing th {
  background: var(--c-kinari);
  color: var(--c-konan);
  font-family: var(--f-mincho);
  font-weight: 600;
  text-align: left;
  padding: 12px 16px;
  border: 1px solid var(--c-border);
  width: 30%;
}
body.single-post .ohaka-case-spec__pricing thead th {
  background: var(--c-konan);
  color: var(--c-shiro);
  text-align: left;
}
body.single-post .ohaka-case-spec__pricing thead th:last-child { text-align: right; }
body.single-post .ohaka-case-spec__table td,
body.single-post .ohaka-case-spec__pricing td {
  padding: 12px 16px;
  border: 1px solid var(--c-border);
  background: var(--c-shiro);
}
body.single-post .ohaka-case-spec__pricing td:last-child {
  text-align: right;
  font-feature-settings: "tnum" 1;
}
body.single-post .ohaka-case-spec__total {
  font-family: var(--f-mincho);
  color: var(--c-kincha);
  font-size: 1.2em;
  font-weight: 700;
}
body.single-post .ohaka-case-spec__total-row td {
  background: var(--c-kinari) !important;
  color: var(--c-konan);
  font-weight: 700;
  font-size: 1.05em;
}
body.single-post .ohaka-case-spec__voice {
  background: linear-gradient(135deg, var(--c-shoji) 0%, var(--c-kinari) 100%);
  border-left: 4px solid var(--c-kincha);
  padding: 1.4em 1.6em 1em;
  margin: 1.6em 0;
  border-radius: 4px;
  font-style: normal;
}
body.single-post .ohaka-case-spec__voice p {
  margin: 0 0 .6em;
  line-height: 1.85;
  color: var(--c-text);
}
body.single-post .ohaka-case-spec__voice footer {
  text-align: right;
  color: var(--c-text-m);
  font-size: .88em;
  letter-spacing: .04em;
}


/************************************
** 信頼バッジ（[ohaka_trust_badges]）
************************************/
.ohaka-trust-badges {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 18px;
  padding: 28px 24px;
  background: linear-gradient(135deg, #fbf6e9 0%, #faf5ec 100%);
  border: 1px solid #d8d2c4;
  border-radius: 4px;
  margin: 1.6em 0 2.2em;
}
.ohaka-trust-badges--dark {
  background: linear-gradient(135deg, #1c2c44 0%, #14223a 100%);
  border-color: #14223a;
}
.ohaka-trust-badge {
  text-align: center;
  padding: 8px 4px;
  border-right: 1px solid #d8d2c4;
}
.ohaka-trust-badge:last-child { border-right: 0; }
.ohaka-trust-badges--dark .ohaka-trust-badge { border-right-color: rgba(255,255,255,.15); }

.ohaka-trust-badge__num {
  font-family: 'Noto Serif JP', '游明朝', YuMincho, serif;
  font-weight: 600;
  font-size: 2.6em;
  line-height: 1.05;
  color: #b5894a;
  letter-spacing: -.01em;
}
.ohaka-trust-badges--dark .ohaka-trust-badge__num { color: #d4a86b; }
.ohaka-trust-badge__unit {
  font-size: 0.42em;
  margin-left: .15em;
  color: #6b6862;
  font-weight: 400;
}
.ohaka-trust-badges--dark .ohaka-trust-badge__unit { color: rgba(255,255,255,.75); }

.ohaka-trust-badge__label {
  margin-top: 6px;
  font-size: .85em;
  color: #2a2a28;
  letter-spacing: .04em;
  line-height: 1.5;
}
.ohaka-trust-badges--dark .ohaka-trust-badge__label { color: rgba(255,255,255,.92); }

@media (max-width: 600px) {
  .ohaka-trust-badges {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px 8px;
    padding: 18px 14px;
  }
  .ohaka-trust-badge {
    border-right: none;
    border-bottom: 1px solid #d8d2c4;
    padding-bottom: 12px;
  }
  .ohaka-trust-badge:nth-last-child(-n+2) { border-bottom: 0; }
  .ohaka-trust-badge__num { font-size: 2.2em; }
}


/************************************
** ホーム FV 再設計 (B-2)
************************************/
body.page-id-907 .hm-hero {
  /* 既存の linear-gradient 紺は維持されるので背景は触らない */
  padding: 56px 32px 50px;
  text-align: center;
}
body.page-id-907 .hm-hero__eyebrow {
  display: block;
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.85em;
  letter-spacing: 0.12em;
  margin: 0 0 18px;
  font-weight: 400;
}
body.page-id-907 .hm-hero__eyebrow-divider {
  margin: 0 0.7em;
  color: rgba(255, 255, 255, 0.45);
}
body.page-id-907 .hm-hero__headline {
  font-family: 'Noto Serif JP', '游明朝', YuMincho, serif !important;
  font-weight: 600;
  color: #fff !important;
  font-size: clamp(22px, 3.2vw, 36px);
  line-height: 1.55;
  letter-spacing: 0.03em;
  margin: 0 0 28px;
}
body.page-id-907 .hm-hero__headline em {
  font-style: normal;
  color: #d4a86b;
  background: linear-gradient(transparent 60%, rgba(181, 137, 74, 0.30) 60%);
  padding: 0 0.15em;
}
body.page-id-907 .hm-hero__sub {
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 1.02em !important;
  line-height: 1.85;
  letter-spacing: 0.02em;
  margin: 0 auto 32px !important;
  max-width: 36em;
}
body.page-id-907 .hm-hero__sub strong {
  color: #fff !important;
}
body.page-id-907 .hm-hero__btns {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 0 auto 18px;
}
body.page-id-907 .hm-hero-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  padding: 16px 36px !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 1.02em;
  letter-spacing: 0.03em;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s, transform 0.05s;
  border: 1px solid transparent;
  white-space: nowrap;
}
body.page-id-907 .hm-hero-btn--primary {
  background: linear-gradient(135deg, #b5894a 0%, #8b6634 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 16px rgba(181, 137, 74, 0.45);
  border-color: #b5894a;
}
body.page-id-907 .hm-hero-btn--primary:hover {
  box-shadow: 0 6px 20px rgba(181, 137, 74, 0.55);
  transform: translateY(-1px);
}
body.page-id-907 .hm-hero-btn--secondary {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #fff !important;
  border: 2px solid rgba(255, 255, 255, 0.5) !important;
}
body.page-id-907 .hm-hero-btn--secondary:hover {
  background: #fff !important;
  color: #1c2c44 !important;
  border-color: #fff !important;
}
body.page-id-907 .hm-hero__meta {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 0.85em !important;
  letter-spacing: 0.05em;
  margin: 0 !important;
}

@media (max-width: 600px) {
  body.page-id-907 .hm-hero { padding: 40px 18px 36px; }
  body.page-id-907 .hm-hero__headline { line-height: 1.5; }
  body.page-id-907 .hm-hero-btn { padding: 14px 24px !important; font-size: 0.95em; width: 100%; max-width: 320px; justify-content: center; }
  body.page-id-907 .hm-hero__btns { flex-direction: column; gap: 10px; }
  body.page-id-907 .hm-hero__eyebrow-divider { display: none; }
  body.page-id-907 .hm-hero__eyebrow { line-height: 1.6; }
}


/************************************
** Cocoon パーツ和モダン微調整 (single-post 共通)
** TOC / 関連カード / 内部リンクカード / スピーチ等
************************************/
/* 目次 (TOC) */
body.single-post .toc {
  background: #fbf6e9 !important;
  border: 1px solid #d8d2c4 !important;
  border-left: 4px solid #b5894a !important;
  border-radius: 3px !important;
  padding: 1.2em 1.5em !important;
}
body.single-post .toc-title {
  font-family: 'Noto Serif JP', '游明朝', YuMincho, serif !important;
  color: #1c2c44 !important;
  font-weight: 600 !important;
}
body.single-post .toc a {
  color: #1c2c44 !important;
  text-decoration: none !important;
}
body.single-post .toc a:hover {
  color: #b5894a !important;
  text-decoration: underline !important;
}
body.single-post .toc-checkbox:checked + .toc-title::after,
body.single-post .toc-title::after {
  color: #b5894a !important;
}

/* 関連記事 / 関連エントリーカード */
body.single-post .related-entry-heading,
body.single-post .new-entry-card-heading,
body.single-post .related-entry-main-heading {
  font-family: 'Noto Serif JP', '游明朝', YuMincho, serif !important;
  color: #1c2c44 !important;
  font-weight: 600 !important;
  border-bottom: 1px solid #d8d2c4 !important;
  position: relative;
}
body.single-post .related-entry-heading::after,
body.single-post .related-entry-main-heading::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 64px;
  height: 3px;
  background: #b5894a;
}
body.single-post .related-entry-card-title,
body.single-post .new-entry-card-title {
  color: #1c2c44 !important;
  font-family: 'Noto Serif JP', '游明朝', YuMincho, serif !important;
  font-weight: 600 !important;
}
body.single-post .related-entry-card:hover,
body.single-post .new-entry-card:hover {
  border-color: #b5894a !important;
}

/* 内部リンクカード (blogcard) */
body.single-post .blogcard-wrap,
body.single-post .blogcard {
  border: 1px solid #d8d2c4 !important;
  border-left: 3px solid #b5894a !important;
  background: #fdfdfa !important;
  border-radius: 3px !important;
}
body.single-post .blogcard-title {
  color: #1c2c44 !important;
  font-family: 'Noto Serif JP', '游明朝', YuMincho, serif !important;
  font-weight: 600 !important;
}

/* スピーチ・吹き出し */
body.single-post .speech-wrap .speech-balloon,
body.single-post .speech-balloon {
  background: #fbf6e9 !important;
  border: 1px solid #d8d2c4 !important;
  border-radius: 6px !important;
}

/* Cocoon の各種ボックス類 (information / question / alert / memo) */
body.single-post .information-box,
body.single-post .question-box,
body.single-post .alert-box,
body.single-post .memo-box,
body.single-post .information,
body.single-post .question,
body.single-post .alert,
body.single-post .memo {
  background: #fbf6e9 !important;
  border: 1px solid #d8d2c4 !important;
  border-left: 4px solid #b5894a !important;
  border-radius: 3px !important;
  color: #2a2a28 !important;
}
body.single-post .alert-box,
body.single-post .alert {
  border-left-color: #b5894a !important;
}
body.single-post .question-box,
body.single-post .question {
  border-left-color: #6f7e4f !important;
}

/* チェックリスト (Cocoon の check-list) */
body.single-post .check-list li::before,
body.single-post ul.check-list li::before,
body.single-post .check li::before {
  color: #6f7e4f !important;
}

/* Cocoon タグクラウド (記事末) */
body.single-post .tagcloud a {
  background: #fdfdfa !important;
  color: #1c2c44 !important;
  border: 1px solid #d8d2c4 !important;
  border-radius: 999px !important;
  font-size: .82em !important;
  padding: 4px 12px !important;
}
body.single-post .tagcloud a:hover {
  background: #1c2c44 !important;
  color: #fff !important;
  border-color: #1c2c44 !important;
}

/* カテゴリラベル / パンくず */
body.single-post .breadcrumb,
body.single-post .breadcrumb a {
  color: #6b6862 !important;
  font-size: .85em;
}
body.single-post .breadcrumb a:hover {
  color: #b5894a !important;
}

/* Cocoon ボタンブロック (青系→紺系) */
body.single-post .button-block .btn,
body.single-post .btn-wrap .btn {
  border-radius: 3px !important;
}
body.single-post .btn-c,
body.single-post .button-block .btn-c {
  background: #1c2c44 !important;
  background-image: none !important;
  border-color: #1c2c44 !important;
  color: #fff !important;
}
body.single-post .btn-c:hover,
body.single-post .button-block .btn-c:hover {
  background: #b5894a !important;
  border-color: #b5894a !important;
}

/* スクロール時のモバイルCTA (mobile sticky bar) */
.scrollable-mobile-buttons .mobile-button {
  background: #1c2c44 !important;
}
.scrollable-mobile-buttons .mobile-button:hover {
  background: #b5894a !important;
}

/* ============================================
 * 関連サービス・関連エリア（記事末尾の内部リンク）
 * 和モダン: 障子色 / 紺 / 金茶
 * ============================================ */
.ohaka-related {
    margin: 56px 0 32px;
    padding: 28px 24px 32px;
    background: #fbf6e9;
    border: 1px solid rgba(28,44,68,.10);
    border-radius: 8px;
    box-shadow: 0 1px 0 rgba(0,0,0,.02);
}
.ohaka-related + .ohaka-related {
    margin-top: 24px;
}
.ohaka-related__title {
    margin: 0 0 18px;
    padding: 0 0 10px;
    font-family: "Noto Serif JP","游明朝体","Yu Mincho",YuMincho,serif;
    font-size: 1.18rem;
    color: #14223a;
    border-bottom: 1px solid rgba(28,44,68,.10);
    position: relative;
}
.ohaka-related__title::after {
    content: "";
    position: absolute;
    left: 0; bottom: -1px;
    width: 56px; height: 2px;
    background: #b5894a;
}
/* サービスグリッド */
.ohaka-related__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}
.ohaka-related__card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid rgba(28,44,68,.12);
    border-left: 3px solid #b5894a;
    border-radius: 4px;
    text-decoration: none !important;
    color: #14223a !important;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.ohaka-related__card:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(28,44,68,.10);
    border-left-color: #8b6634;
}
.ohaka-related__icon {
    font-size: 1.3rem;
    line-height: 1;
}
.ohaka-related__card-title {
    font-weight: 700;
    font-size: 1rem;
    color: #14223a;
}
.ohaka-related__card-desc {
    font-size: .82rem;
    line-height: 1.55;
    color: #555;
}
/* エリアチップ */
.ohaka-related__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
}
.ohaka-related__chip {
    display: inline-block;
    padding: 7px 14px;
    background: #fff;
    border: 1px solid rgba(28,44,68,.18);
    border-radius: 999px;
    font-size: .9rem;
    color: #14223a !important;
    text-decoration: none !important;
    transition: background .12s ease, color .12s ease, border-color .12s ease;
}
.ohaka-related__chip:hover {
    background: #14223a;
    color: #fff !important;
    border-color: #14223a;
}
.ohaka-related__cross {
    margin: 6px 0 0;
    padding: 12px 0 0;
    border-top: 1px dashed rgba(28,44,68,.15);
    font-size: .88rem;
    color: #555;
}
.ohaka-related__cross a {
    color: #8b6634 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px;
}
.ohaka-related__cross a:hover {
    color: #14223a !important;
}
@media (max-width: 600px) {
    .ohaka-related { margin: 40px -8px 24px; padding: 22px 18px 24px; border-radius: 6px; }
    .ohaka-related__grid { grid-template-columns: 1fr; }
}

/* ============================================
 * モバイル固定CTAバー（和モダン: 紺×金茶）
 * 768px 以下で表示。本文の最終位置を CTA バー高さぶん補正。
 * ============================================ */
.ohaka-mobile-cta {
    display: none;
}
@media (max-width: 768px) {
    .ohaka-mobile-cta {
        display: flex;
        position: fixed;
        left: 0; right: 0; bottom: 0;
        z-index: 9990;
        gap: 0;
        background: rgba(28,44,68,.96);
        backdrop-filter: blur(6px);
        box-shadow: 0 -2px 12px rgba(0,0,0,.18);
        padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
    }
    .ohaka-mobile-cta__btn {
        flex: 1 1 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px 6px;
        margin: 0 4px;
        border-radius: 6px;
        text-decoration: none !important;
        line-height: 1.15;
        font-weight: 700;
        transition: background .12s ease, transform .12s ease;
    }
    .ohaka-mobile-cta__btn:active {
        transform: scale(.98);
    }
    .ohaka-mobile-cta__btn--tel {
        background: rgba(255,255,255,.08);
        color: #faf5ec !important;
        border: 1px solid rgba(255,255,255,.18);
    }
    .ohaka-mobile-cta__btn--tel:hover,
    .ohaka-mobile-cta__btn--tel:focus {
        background: rgba(255,255,255,.14);
        color: #fff !important;
    }
    .ohaka-mobile-cta__btn--main {
        background: linear-gradient(135deg,#b5894a 0%, #8b6634 100%);
        color: #fff !important;
        border: 1px solid #8b6634;
    }
    .ohaka-mobile-cta__btn--main:hover,
    .ohaka-mobile-cta__btn--main:focus {
        background: linear-gradient(135deg,#c69960 0%, #9c7340 100%);
        color: #fff !important;
    }
    .ohaka-mobile-cta__icon {
        font-size: 1.1rem;
        line-height: 1;
    }
    .ohaka-mobile-cta__text {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .ohaka-mobile-cta__top {
        font-size: .82rem;
        letter-spacing: .02em;
    }
    .ohaka-mobile-cta__sub {
        font-size: .65rem;
        font-weight: 500;
        opacity: .8;
        margin-top: 2px;
    }
    /* CTAバーで最下部の本文が隠れないようにフッター直上に余白 */
    body { padding-bottom: 76px; }
    body.page-id-2489 { padding-bottom: 0; } /* LP */
    /* Cocoon の戻るボタン等が干渉する場合は上にずらす */
    .go-to-top { bottom: 76px !important; }
}

/* ============================================
 * 著者プロフィール枠（E-E-A-T 強化）
 * ============================================ */
.ohaka-author {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    margin: 56px 0 24px;
    padding: 22px 24px 26px;
    background: linear-gradient(180deg, #fbf6e9 0%, #f6efde 100%);
    border: 1px solid rgba(28,44,68,.10);
    border-left: 4px solid #b5894a;
    border-radius: 6px;
}
.ohaka-author__photo {
    flex: 0 0 96px;
}
.ohaka-author__photo img {
    width: 96px; height: 96px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(255,255,255,.7);
    box-shadow: 0 2px 6px rgba(28,44,68,.10);
}
.ohaka-author__body {
    flex: 1 1 auto;
    min-width: 0;
}
.ohaka-author__label {
    margin: 0 0 4px;
    font-size: .78rem;
    color: #8b6634;
    letter-spacing: .08em;
    font-weight: 700;
}
.ohaka-author__name {
    margin: 0 0 8px;
    font-family: "Noto Serif JP","游明朝体","Yu Mincho",YuMincho,serif;
    font-size: 1.05rem;
    color: #14223a;
    line-height: 1.5;
}
.ohaka-author__name a {
    color: #14223a !important;
    text-decoration: none !important;
    border-bottom: 1px dotted #14223a;
}
.ohaka-author__name a:hover {
    color: #8b6634 !important;
    border-bottom-color: #8b6634;
}
.ohaka-author__desc {
    margin: 0 0 12px;
    font-size: .9rem;
    line-height: 1.7;
    color: #333;
}
.ohaka-author__desc a {
    color: #8b6634 !important;
}
.ohaka-author__meta {
    list-style: none;
    margin: 0 0 12px;
    padding: 10px 12px;
    background: rgba(255,255,255,.55);
    border-radius: 4px;
    font-size: .82rem;
    line-height: 1.7;
    color: #333;
}
.ohaka-author__meta li {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.ohaka-author__meta li + li {
    border-top: 1px dashed rgba(28,44,68,.10);
    padding-top: 4px;
    margin-top: 4px;
}
.ohaka-author__meta-label {
    flex: 0 0 86px;
    font-weight: 700;
    color: #14223a;
}
.ohaka-author__cta {
    margin: 4px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.ohaka-author__link {
    display: inline-block;
    padding: 5px 12px;
    background: #fff;
    border: 1px solid rgba(28,44,68,.18);
    border-radius: 999px;
    font-size: .82rem;
    color: #14223a !important;
    text-decoration: none !important;
    transition: background .12s ease, color .12s ease, border-color .12s ease;
}
.ohaka-author__link:hover {
    background: #14223a;
    color: #fff !important;
    border-color: #14223a;
}
@media (max-width: 600px) {
    .ohaka-author { flex-direction: column; gap: 14px; padding: 18px 18px 22px; }
    .ohaka-author__photo { align-self: center; flex: 0 0 auto; }
    .ohaka-author__photo img { width: 96px; height: 96px; }
    .ohaka-author__meta li { flex-direction: column; gap: 0; }
    .ohaka-author__meta-label { flex: 0 0 auto; }
}

/* ===========================
   親テーマのナビ寸法系リセット
   - 親テーマは .navi-in > ul li { width:176px; height:60px } のような
     固定寸法を当てている。@layer cocoon に押し込んだ後でも、子テーマで
     寸法プロパティを明示宣言していなければ親の値が唯一の宣言として残る。
   - 「子テーマが宣言したプロパティだけ親に勝つ」というカスケード仕様の
     副作用を、ナビ領域に限って包括的に上書きすることで予防する。
   =========================== */
#navi-in > ul,
.navi-in > ul,
#navi ul.menu,
.navi ul.menu {
    width: auto;
    height: auto;
    max-width: 100%;
}
#navi-in > ul > li,
.navi-in > ul > li,
#navi ul.menu > li,
.navi ul.menu > li {
    width: auto;
    height: auto;
    min-width: 0;
    min-height: 0;
}
/* ナビ内のキャプションラッパも親が固定flexを当てているため解除 */
#navi-in > ul .caption-wrap,
.navi-in > ul .caption-wrap {
    display: flex;
    width: auto;
    height: auto;
    flex-wrap: nowrap;
}

/* ===========================
   フッターメニューの寸法系リセット
   親 .navi-footer-in > .menu-footer li { width: 120px } で固定されており、
   長いラベル(例: 特定商取引法に基づく表示)がはみ出すため auto に開放。
   =========================== */
#navi-footer .menu-footer li,
.navi-footer .menu-footer li,
.navi-footer-in > .menu-footer li,
.navi-footer-in > ul li {
    width: auto;
    height: auto;
    min-width: 0;
    padding-left: 14px;
    padding-right: 14px;
}

/* ===========================
   アイキャッチ画像ラッパの display 明示
   親 .eye-catch-wrap { display: flex } により text-align: center が
   無効になるため、子で意図通り block に戻す。
   =========================== */
.eye-catch-wrap {
    display: block;
}
/* IE10～用の @media 残骸対策。display block を維持 */
@media all and (-ms-high-contrast: none) {
    .eye-catch-wrap { display: block; }
}

/* ===========================
   エントリカードサムネ寸法リセット
   親 .entry-card-thumb { width:320px }, .related-entry-card-thumb {
   width:160px } が固定。コンテナが狭い時のオーバーフロー回避と
   レスポンシブ性のため max-width: 100% で頭打ちにする。
   =========================== */
.entry-card-thumb,
.new-entry-card-thumb,
.related-entry-card-thumb,
.rect-mini-card .related-entry-card-thumb {
    max-width: 100%;
    height: auto;
}

/* ===========================
   サブメニュー（ドロップダウン）
   WP Fastest Cache のミニファイで Cocoon親の sub-menu ルールが
   ストリップされていたため、子テーマで明示的に再定義
   =========================== */
#navi-in > ul .sub-menu,
.navi-in > ul .sub-menu,
#navi ul.menu .sub-menu,
.navi ul.menu .sub-menu {
    display: none !important;
    position: absolute;
    top: 100%;
    left: 0;
    margin: 0;
    padding: 0;
    width: 220px;
    list-style: none;
    background: #ffffff;
    box-shadow: 0 6px 18px rgba(28, 44, 68, 0.15);
    border-top: 2px solid #1c2c44;
    z-index: 10000;
    text-align: left;
}

#navi-in > ul > li.menu-item-has-children:hover > .sub-menu,
.navi-in > ul > li.menu-item-has-children:hover > .sub-menu,
#navi ul.menu > li.menu-item-has-children:hover > .sub-menu,
.navi ul.menu > li.menu-item-has-children:hover > .sub-menu {
    display: block !important;
}

#navi-in > ul .sub-menu li,
.navi-in > ul .sub-menu li,
#navi ul.menu .sub-menu li,
.navi ul.menu .sub-menu li {
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    position: relative;
}

#navi-in > ul .sub-menu a,
.navi-in > ul .sub-menu a,
#navi ul.menu .sub-menu a,
.navi ul.menu .sub-menu a {
    display: block !important;
    padding: 12px 16px !important;
    font-size: 14px;
    font-weight: 500;
    color: #1c2c44 !important;
    border-bottom: 1px solid rgba(28, 44, 68, 0.08);
    background: transparent !important;
}

#navi-in > ul .sub-menu li:last-child > a,
.navi-in > ul .sub-menu li:last-child > a,
#navi ul.menu .sub-menu li:last-child > a,
.navi ul.menu .sub-menu li:last-child > a {
    border-bottom: 0;
}

#navi-in > ul .sub-menu a:hover,
.navi-in > ul .sub-menu a:hover,
#navi ul.menu .sub-menu a:hover,
.navi ul.menu .sub-menu a:hover {
    background: rgba(28, 44, 68, 0.05) !important;
    color: #1c2c44 !important;
}

#navi-in > ul .sub-menu a::after,
.navi-in > ul .sub-menu a::after,
#navi ul.menu .sub-menu a::after,
.navi ul.menu .sub-menu a::after {
    content: none !important;
    display: none !important;
}

/* 親メニューのドロップダウン三角アイコン */
.menu-pc .menu-item-has-children > a .has-sub,
.menu-pc .menu-item-has-children > a .top-has-sub {
    display: inline-block;
    margin-left: 4px;
    font-size: 11px;
    opacity: 0.7;
}

/* ===========================
   ヘッダーCTA「無料相談」ホバー修正 + 親テーマ影響の遮断
   - 既存の #navi-in > ul > li > a:hover が rgba(44,90,160,0.05) で
     ほぼ白の背景になる問題を、ID 指定の高特異度ルールで上書き
   - 文字色/背景/シャドウ/アンダーライン擬似要素を強制初期化
   =========================== */

/* 通常状態：紺の確定的なボタン */
html body #navi-in > ul > li.menu-item:last-child > a,
html body #navi-in > ul.menu-top > li:last-child > a,
html body #navi-in > ul.menu-header > li:last-child > a,
html body #navi-in > ul.menu-pc > li:last-child > a,
html body .navi-in > ul.menu-pc.menu-header > li.menu-item:last-child > a {
    background: #1c2c44 !important;
    background-color: #1c2c44 !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 4px !important;
    padding: 10px 22px !important;
    margin: 6px 0 !important;
    font-weight: 700 !important;
    letter-spacing: .04em;
    box-shadow: 0 2px 0 #14223a, 0 4px 12px rgba(28, 44, 68, 0.18) !important;
    transition: background-color .22s ease, color .22s ease, box-shadow .22s ease, transform .22s ease !important;
    text-decoration: none !important;
}

/* ホバー状態：金茶ベタ。rgba+ほぼ白を必ず上書き */
html body #navi-in > ul > li.menu-item:last-child > a:hover,
html body #navi-in > ul > li.menu-item:last-child > a:focus,
html body #navi-in > ul.menu-top > li:last-child > a:hover,
html body #navi-in > ul.menu-header > li:last-child > a:hover,
html body #navi-in > ul.menu-pc > li:last-child > a:hover,
html body .navi-in > ul.menu-pc.menu-header > li.menu-item:last-child > a:hover {
    background: #b5894a !important;
    background-color: #b5894a !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: 0 2px 0 #8b6634, 0 6px 16px rgba(181, 137, 74, 0.32) !important;
    transform: translateY(-1px);
}

/* 内部の item-label / caption-wrap も白を強制（Cocoonの内部spanが色継承を遮ることがある） */
html body #navi-in > ul > li:last-child > a .item-label,
html body #navi-in > ul > li:last-child > a .caption-wrap,
html body #navi-in > ul > li:last-child > a .caption-wrap > div,
html body #navi-in > ul > li:last-child > a:visited,
html body #navi-in > ul > li:last-child > a:hover .item-label,
html body #navi-in > ul > li:last-child > a:hover .caption-wrap,
html body #navi-in > ul > li:last-child > a:hover .caption-wrap > div {
    color: #ffffff !important;
}

/* CTA の下線 ::after を絶対に表示しない */
html body #navi-in > ul > li:last-child > a::after,
html body #navi-in > ul > li:last-child > a:hover::after,
html body .navi-in > ul > li:last-child > a::after,
html body .navi-in > ul > li:last-child > a:hover::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

/* ===========================
   通常メニュー項目の hover を和モダンに統一（旧 rgba(44,90,160,.05) を上書き）
   - 親テーマや上流の hover 残骸が滲み出ないように完全上書き
   =========================== */
html body #navi-in > ul > li.menu-item:not(:last-child) > a:hover,
html body .navi-in > ul > li.menu-item:not(:last-child) > a:hover,
html body #navi ul.menu > li.menu-item:not(:last-child) > a:hover,
html body .navi ul.menu > li.menu-item:not(:last-child) > a:hover {
    background: #fbf6e9 !important;   /* 障子色 */
    background-color: #fbf6e9 !important;
    color: #1c2c44 !important;
}

/* 通常項目の下線 ::after は和モダンの金茶に統一 */
html body #navi-in > ul > li.menu-item:not(:last-child) > a:hover::after,
html body .navi-in > ul > li.menu-item:not(:last-child) > a:hover::after {
    background: #b5894a !important;
    background-image: none !important;
}

/* ===========================
   サブメニューも親テーマの白背景影響を完全遮断
   =========================== */
html body #navi-in > ul .sub-menu,
html body .navi-in > ul .sub-menu {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
}

/* ============================================================
   カテゴリーアーカイブ / 一覧ページの和モダンデザイン (2026-05)
   - NO IMAGE プレースホルダを隠す
   - エントリカードを和モダン化 (紺枠 + 金茶アクセント)
   - 統計(本日/週/月/全体)を非表示
   - タイトル下線除去
   ============================================================ */

/* (1-a) アーカイブの entry-card レイアウトを横並び flex に固定
   - 親テーマの .entry-card は display:flex だが、:thumb 320px 固定で
     アンバランス。コンテンツを伸ばすため flex 値を明示。 */
body.archive .entry-card,
body.category .entry-card,
body.tag .entry-card,
body.search .entry-card {
    display: flex !important;
    align-items: stretch !important;
    flex-wrap: nowrap !important;
    width: 100%;
}

/* (1-b) NO IMAGE プレースホルダを完全消去 (figure ごと) */
body.archive .entry-card-thumb img.no-image,
body.archive .entry-card-thumb .list-no-image,
body.category .entry-card-thumb img.no-image,
body.category .entry-card-thumb .list-no-image,
body.tag .entry-card-thumb img.no-image,
body.tag .entry-card-thumb .list-no-image,
body.search .entry-card-thumb img.no-image,
body.search .entry-card-thumb .list-no-image {
    display: none !important;
}
/* :has() で no-image を持つ figure を完全に潰す */
body.archive .entry-card-thumb:has(img.no-image),
body.category .entry-card-thumb:has(img.no-image),
body.tag .entry-card-thumb:has(img.no-image),
body.search .entry-card-thumb:has(img.no-image) {
    display: none !important;
    width: 0 !important;
    flex: 0 0 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

/* (1-c) 実画像がある thumb は控えめサイズに */
body.archive .entry-card-thumb,
body.category .entry-card-thumb,
body.tag .entry-card-thumb,
body.search .entry-card-thumb {
    flex: 0 0 200px !important;
    width: 200px !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    min-width: 0 !important;
    align-self: stretch;
    position: relative;
    overflow: hidden;
}
body.archive .entry-card-thumb > img:not(.no-image),
body.category .entry-card-thumb > img:not(.no-image),
body.tag .entry-card-thumb > img:not(.no-image),
body.search .entry-card-thumb > img:not(.no-image) {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    display: block;
}

/* (2) entry-card の和モダン化 */
body.archive .entry-card-wrap,
body.category .entry-card-wrap,
body.tag .entry-card-wrap,
body.search .entry-card-wrap {
    display: block !important;
    background: #ffffff !important;
    border: 1px solid #d8d2c4 !important;
    border-left: 4px solid #b5894a !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 3px rgba(28, 44, 68, 0.06);
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
    overflow: hidden;
    text-decoration: none !important;
    transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
body.archive .entry-card-wrap:hover,
body.category .entry-card-wrap:hover,
body.tag .entry-card-wrap:hover,
body.search .entry-card-wrap:hover {
    box-shadow: 0 4px 16px rgba(28, 44, 68, 0.12);
    transform: translateY(-1px);
    border-color: #b5894a !important;
    border-left-color: #1c2c44 !important;
}

/* (3) entry-card-content の余白を調整 (flex で残りを埋める) */
body.archive .entry-card-content,
body.category .entry-card-content,
body.tag .entry-card-content,
body.search .entry-card-content {
    flex: 1 1 auto !important;
    padding: 18px 24px !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: 100%;
}

/* (4) タイトル（和明朝体・紺・下線なし） */
body.archive .entry-card-title,
body.category .entry-card-title,
body.tag .entry-card-title,
body.search .entry-card-title {
    font-family: 'Noto Serif JP', '游明朝', YuMincho, 'ヒラギノ明朝 Pro', serif !important;
    color: #1c2c44 !important;
    font-weight: 600;
    font-size: 1.05em;
    line-height: 1.55;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    text-decoration: none !important;
}
body.archive .entry-card-wrap:hover .entry-card-title,
body.category .entry-card-wrap:hover .entry-card-title,
body.tag .entry-card-wrap:hover .entry-card-title,
body.search .entry-card-wrap:hover .entry-card-title {
    color: #b5894a !important;
}

/* (5) スニペット */
body.archive .entry-card-snippet,
body.category .entry-card-snippet,
body.tag .entry-card-snippet,
body.search .entry-card-snippet {
    color: #5a564f !important;
    font-size: 0.93em;
    line-height: 1.75;
    margin: 0 0 12px 0 !important;
    text-decoration: none !important;
}

/* (6) 閲覧数 (本日/週/月/全体) を非表示 */
body.archive .entry-card-meta .entry-card-info,
body.category .entry-card-meta .entry-card-info,
body.tag .entry-card-meta .entry-card-info,
body.search .entry-card-meta .entry-card-info,
body.archive .e-card-info .fa-bar-chart,
body.archive .e-card-info .pv-info,
body.archive .entry-card-info {
    display: none !important;
}

/* (7) カテゴリラベル (cat-label) の和モダン化 */
body.archive .entry-card .cat-label,
body.category .entry-card .cat-label,
body.tag .entry-card .cat-label,
body.search .entry-card .cat-label {
    background: #1c2c44 !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 3px 12px !important;
    font-size: 11px !important;
    font-weight: 500;
    letter-spacing: .08em;
    top: 12px !important;
    left: 0 !important;
    max-width: none !important;
    line-height: 1.6;
}
/* カテゴリラベル: cat-label-14 (お墓情報) 等の特定色は紺で統一 */

/* (8) entry-card-categorys (記事下のカテゴリチップ群) */
body.archive .entry-card-categorys .entry-category,
body.category .entry-card-categorys .entry-category,
body.tag .entry-card-categorys .entry-category,
body.search .entry-card-categorys .entry-category {
    background: transparent !important;
    color: #8b6634 !important;
    border: 1px solid #d8d2c4 !important;
    padding: 2px 10px !important;
    margin-right: 6px;
    font-size: 11px;
    letter-spacing: .05em;
    border-radius: 2px;
}

/* (9) ページタイトル "お墓情報" の和モダン化 */
body.archive .a-wrap-page-title,
body.archive #main > .article-header,
body.archive .archive-title {
    font-family: 'Noto Serif JP', '游明朝', YuMincho, serif !important;
    color: #1c2c44 !important;
}

/* (10) パンくず (ホーム > カテゴリ名) も整える */
body.archive #breadcrumb,
body.category #breadcrumb {
    background: #fbf6e9 !important;
    border: 1px solid #d8d2c4 !important;
    border-left: 3px solid #b5894a !important;
    padding: 10px 14px !important;
    margin-bottom: 20px !important;
    font-size: 13px;
    border-radius: 0;
}

/* ============================================================
   ホームページ: お悩み・目的から探すセクションをカルーセル化
   - .hm-ohaka-banner はグリッドから出して全幅化済(post_contentで編集)
   - .hm-grid をフレックス横スクロールに変換、scroll-snap で滑らかに
   ============================================================ */

/* バナー全幅 + 中央寄せ (グリッド外配置で full width 化) */
body.home .hm-ohaka-banner,
body.page-id-907 .hm-ohaka-banner {
    width: 100% !important;
    max-width: 100%;
    margin: 30px 0 24px !important;
    padding: 32px 28px !important;
    box-sizing: border-box;
}
/* バナー内テキストは適切に折り返し */
body.home .hm-ohaka-banner p,
body.page-id-907 .hm-ohaka-banner p {
    word-break: keep-all;
    overflow-wrap: anywhere;
}

/* hm-grid を横スクロールカルーセル化 */
body.home .hm-section .hm-grid,
body.page-id-907 .hm-section .hm-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    grid-template-columns: none !important;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding: 4px 4px 20px;
    margin: 0 -4px 8px;
    /* スクロールバーを和モダンに */
    scrollbar-width: thin;
    scrollbar-color: #b5894a #faf5ec;
}
body.home .hm-section .hm-grid::-webkit-scrollbar,
body.page-id-907 .hm-section .hm-grid::-webkit-scrollbar {
    height: 8px;
}
body.home .hm-section .hm-grid::-webkit-scrollbar-track,
body.page-id-907 .hm-section .hm-grid::-webkit-scrollbar-track {
    background: #faf5ec;
    border-radius: 4px;
}
body.home .hm-section .hm-grid::-webkit-scrollbar-thumb,
body.page-id-907 .hm-section .hm-grid::-webkit-scrollbar-thumb {
    background: #b5894a;
    border-radius: 4px;
}

/* カード: 固定幅 + スナップ */
body.home .hm-section .hm-grid > .hm-card,
body.page-id-907 .hm-section .hm-grid > .hm-card {
    flex: 0 0 220px !important;
    width: 220px !important;
    min-width: 0;
    scroll-snap-align: start;
    box-sizing: border-box;
}

/* 768px 未満 (スマホ) — もう少し狭く */
@media (max-width: 768px) {
    body.home .hm-section .hm-grid > .hm-card,
    body.page-id-907 .hm-section .hm-grid > .hm-card {
        flex: 0 0 180px !important;
        width: 180px !important;
    }
}

/* カルーセル左右にフェードグラデーション (端見切れを軽減) */
body.home .hm-section,
body.page-id-907 .hm-section {
    position: relative;
}