/* ───────── ① 見出しと引用の共通スタイル ───────── */
h1{font-size:40px;line-height:1.3;margin-bottom:1em;}
blockquote{background:#f8f8f8;border-left:6px solid #7bc043;padding:1.2em;}
@media (max-width:1024px){h1{font-size:28px;}}

/* ───────── ② 汎用余白ユーティリティ ───────── */
.my-padding{padding:20px;}
@media (max-width:480px){.my-padding{padding:12px;}}

/* ───────── ③ 各種非表示系 ───────── */
#sp_footer_bar,                /* スマホ固定フッターバー */
#return_top,
#pagetop{display:none!important;}

/* ───────── ④ カテゴリー説明 2 行省略 ───────── */
.category_list .category_desc{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
/* line‑clamp が使える環境だけで発動させる（文法を適正化） */
@supports (-webkit-line-clamp: 2) or (line-clamp: 2){
  .category_list .category_desc{
    line-clamp:2;
    box-orient:vertical;
  }
}

/* ───────── ⑤ モバイル幅レイアウト調整 ───────── */
@media (max-width:767px){
  body{overflow-x:hidden;}          /* 横スクロール抑止 */

  .alignwide,
  .stk-content-align.alignwide{
    margin-left:0!important;
    margin-right:0!important;
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box;
  }

  .stk-img-wrapper img,
  .wp-block-stackable-image img{
    max-width:100%!important;
    height:auto!important;
  }
}

/* ───────── ⑥ トップページ用バナー調整 ───────── */
img.thin-banner{
  width:100%;height:auto;max-height:160px;
  object-fit:cover;border-radius:6px;
  box-shadow:0 4px 8px rgba(0,0,0,.1);
}
@media (max-width:768px){
  img.thin-banner{max-height:120px;}
}
/* PC は幅 50% に */
@media (min-width:1024px){
  .top-banner{max-width:50vw;}
}

/* ───────── ⑦ フッターカスタム HTML ───────── */
#footer .widget_custom_html small,
#footer .widget_custom_html a{
  font-size:12px;
  color:#333;
  line-height:1.6;
  text-decoration:none;
  text-align:center;
}
/* 見出し（ウィジェットタイトル）は不要なら非表示 */
#footer .footer_headline{display:none;}

/* ───────── ⑧ 黒帯コピーライトだけ非表示 ───────── */
#footer_top,
#side_copyright{display:none!important;}

/* ── 黒帯コピーライトをすべて非表示 ───────────────── */
#footer_top,          /* 旧 PC 用 */
#side_copyright,      /* 新 PC 用 */
#sp_footer_bar,       /* スマホ下部の固定バー */
#sp_footer_copyright, /* スマホ用コピーライト (テーマによって有無) */
#footer_info {        /* GENSEN のスマホ用コピーライト */
  display:none !important;
}

/* ▼ 共通スタイル ───────────────────── */
.footer-category-list {
  display:flex;
  gap:2rem;           /* 要素間の余白。お好みで調整 */
  flex-wrap:wrap;     /* 行が足りなければ自動で折り返し */
}

.footer-category {
  flex:1 1 0;         /* 各ブロックを同じ幅で並べる */
  min-width:220px;    /* これより狭くなると折り返し */
}

/* ▼ スマホ（幅 767px 以下）のみ適用 ─── */
@media (max-width:767px){
  .footer-category-list{flex-direction:column;gap:1.5rem;}
  .footer-category{flex:none;}
}

/* こだわりブロックの下側だけ 20px 余白 */
.footer-flex-wrap:last-of-type{padding-bottom:20px;}

/* スマホで一覧の抜粋を常時表示 */
@media only screen and (max-width:767px){
  .introduce_list_col .info .excerpt{display:block;}
}

/* フッターの見出しを必ず濃いグレーで表示 */
#footer .footer-flex-title{ color:#333 !important; }

#footer .footer-flex-title{
  margin:0 0 4px !important;
  font-size:18px;
  font-weight:700;
  line-height:1.2;
  color:#333 !important;
}

/* ========== TOP「人気のお墓」 — PC でレイアウト完全再構築 ========== */
@media (min-width:1025px){

  /* ---------- (1) 旧 float レイアウトを完全に排除 ---------- */
  .home #introduce_list .introduce_list_row,
  .home #introduce_list .introduce_list_col{ float:none !important; }

  /* ---------- (2) 行 (.introduce_list_row) を CSS Grid 化 ---------- */
  .home #introduce_list .introduce_list_row{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:32px 28px;
    height:auto !important;
  }

  /* ---------- (3) 各カード外枠 (.article) ---------- */
  .home #introduce_list .article{
    width:auto !important;
    height:auto !important;
    overflow:visible !important;
    display:flex;
    flex-direction:column;
  }

  /* a タグも幅・オーバーフローをリセット */
  .home #introduce_list .article > a{
    width:100% !important;
    overflow:visible !important;
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
  }

  /* ---------- (4) 画像 ---------- */
  .home #introduce_list .article .image{
    aspect-ratio:3/2;
    width:100% !important;
    flex-shrink:0;
    overflow:hidden;
  }
  .home #introduce_list .article .image img{
    width:100% !important;
    height:100% !important;
    object-fit:cover;
    object-position:center;
  }

  /* ---------- (5) テキスト部 (.info) を常時表示 ---------- */
  .home #introduce_list .article .info{
    margin-top:12px;
    display:block !important;
    position:static !important;
    height:auto !important;
    max-height:none !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
  }

  /* ---------- (6) テーマ本体が持つ body の最小幅を解除 ---------- */
  body{min-width:0 !important;}
}

/* ── ヒーロー（#header_slider）だけをターゲット ───────────────── */
@media (max-width:767px){
  #header_slider .item img{
    position:relative !important;
    left:0 !important;
    transform:none !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    min-width:0 !important;
    object-fit:contain !important;
  }
  #header_slider .item:before{content:none !important;}
}

/* — TOP「人気のお墓」— 本文を全文表示させる — */
@media (min-width:1025px){
  .home #introduce_list .excerpt{
    max-height:none !important;
    overflow:visible !important;
  }
}

/* ===== “人気のお墓” 高さ・クリップを完全解除 ===== */
@media (min-width:1025px){
  .home #introduce_list .introduce_list_col > a{height:auto !important;overflow:visible !important;}
  .home #introduce_list .introduce_list_col .info{height:auto !important;}
}

/* ── フッターの余白バランス調整 ────────────────────────── */
.footer-flex-wrap{margin:0 0 8px !important;}
.footer-flex-title{margin:0 0 4px !important;}
.footer-flex-box{display:flex;flex-wrap:wrap;column-gap:12px;row-gap:3px;}
.footer-flex-box a{line-height:1.25;margin:0 !important;}

/* ─ Access バッジを「上下にグリーンのラインが入った見出し」風に ─ */
.access-badge{
  display:block;position:relative;margin:0 0 24px;padding:12px 0;
  text-align:left;font-size:1.05rem;font-weight:700;line-height:1.5;
  color:#333;background:#fff;
}
.access-badge::before,
.access-badge::after{
  content:'';position:absolute;left:0;right:0;height:4px;background:#8cc152;
}
.access-badge::before{top:0;}
.access-badge::after{bottom:0;}

/* ===== エリア／アーカイブ共通 見出し強化 ===== */
#archive_headline,
#introduce_header .headline{
  margin-top:clamp(56px,10vw,120px) !important;
  margin-bottom:32px;
  font-size:clamp(18px,3vw,40px);
  font-weight:700;line-height:1;text-align:center;color:#222;
}
#archive_headline::after,
#introduce_header .headline::after{
  content:'';display:block;width:64px;height:4px;margin:16px auto 0;
  background:linear-gradient(90deg,#7CC957 0%,#29B089 100%);border-radius:2px;
}
@media (max-width:767px){
  #archive_headline,
  #introduce_header .headline{margin-top:48px !important;margin-bottom:24px;}
}

/* ========================================================
   1. 旧ホバー演出を完全解除して “通常フロー” に戻す  (症状 A)
   ======================================================== */
.introduce_list_col .info{position:static !important;height:auto !important;min-width:0 !important;overflow:visible !important;}
.introduce_list_col .info .title,
.introduce_list_col .info .excerpt{white-space:normal !important;overflow:visible !important;}

/* ========================================================
   2. すべてのタグ UL を “横並び & 自動折返し” に統一 (症状 B)
   ======================================================== */
.introduce_list_col .info ul{
  display:flex !important;flex-wrap:wrap !important;gap:6px 8px;margin:6px 0 0;
}
.introduce_list_col .info ul li{
  display:inline-flex !important;width:auto !important;min-width:0 !important;
}
.introduce_list_col .info ul li > *,
.introduce_list_col .info ul li a{white-space:nowrap;padding:0 10px;}

/* ========================================================
   3. “show_info” 幅拡大／アンカー固定高さを完全オフ
   ======================================================== */
.introduce_list_col.show_info,
.introduce_list_col.show_info .image,
.introduce_list_col.show_info .info,
.introduce_list_col a{width:100% !important;height:auto !important;}
.introduce_list_col .image,
.introduce_list_col:hover .image,
.introduce_list_col.show_info .image,
.introduce_list_col.show_info:hover .image{
  width:100% !important;padding-top:56.25% !important;height:0 !important;
  overflow:hidden !important;transition:none !important;
}
.introduce_list_col .image img,
.introduce_list_col:hover .image img,
.introduce_list_col.show_info .image img,
.introduce_list_col.show_info:hover .image img{
  position:absolute !important;top:0 !important;left:0 !important;
  width:100% !important;height:100% !important;min-width:0 !important;
  object-fit:cover !important;transform:none !important;transition:none !important;
}
.introduce_list_col a:hover .image,
.introduce_list_col a:hover .image img{transform:none !important;}

/* ----------------------------------------------------
   PC専用 1024px〜（ヒーロー：#header_slider）
   ---------------------------------------------------- */
@media only screen and (min-width:1024px){
  #header_slider{height:45vh !important;max-height:500px;overflow:hidden;}
  #header_slider .slick-list,
  #header_slider .slick-track,
  #header_slider .slick-slide,
  #header_slider .item{height:100% !important;}
  #header_slider .slick-slide img{width:100%;height:100%;object-fit:cover;}
}

/* ----------------------------------------------------
   モバイル専用 〜1023px（ヒーロー：#header_slider）
   ---------------------------------------------------- */
@media only screen and (max-width:1023px){
  #header_slider,
  #header_slider .slick-list,
  #header_slider .slick-track,
  #header_slider .slick-slide,
  #header_slider .item,
  #header_slider .slick-slide img{height:auto !important;}
}

/* 背景パララックスを無効化（共通） */
#header_slider,
#header_slider .slick-slide{background-attachment:scroll !important;}

/* ズーム停止用（共通） */
#header_slider .item.slick-current img{transform:scale(1);}
#header_slider .item.slick-active img{animation:none !important;}
@keyframes sliderIMGAnimation{from{transform:scale(1);}to{transform:scale(1);}}

/* ===== タグピルの高さズレ最終修正 ========================= */
.introduce_list_col .info ul li{
  display:inline-block !important;line-height:5px !important;
  float:none !important;width:auto !important;min-width:0 !important;margin:0 !important;
}
.introduce_list_col .info ul{display:flex !important;flex-wrap:wrap !important;gap:6px 8px;row-gap:6px;}

/* ===== タグピルの高さ＆幅 最終修正 ========================= */
.introduce_list_col .info ul li{
  display:inline-block !important;line-height:4px !important;float:none !important;
  width:auto !important;min-width:0 !important;margin:0 !important;
}
.introduce_list_col .info ul li > a,
.introduce_list_col .info ul li > span{
  min-width:0 !important;width:auto !important;display:inline-block !important;
}

/* ================================================
   人気のお墓　タグピル最終調整 2025‑08‑06
   ================================================ */
#introduce_list .info ul{
  display:flex !important;flex-wrap:wrap !important;justify-content:flex-start !important;
  align-content:flex-start !important;gap:2px 4px !important;
  margin:6px 0 16px !important;padding:0 !important;list-style:none !important;
}
#introduce_list .info ul li,
#introduce_list .info ul li::before,
#introduce_list .info ul li::after{border:none !important;margin:0 !important;content:none !important;}
#introduce_list .info ul li > span{
  display:inline-block !important;padding:0 12px !important;line-height:28px !important;
  border-radius:4px !important;background:#75BE02 !important;color:#fff !important;outline-offset:-2px !important;
}
#introduce_list .info ul li > a{
  display:inline-block !important;padding:0 10px !important;line-height:26px !important;border-radius:2px !important;
  background:#fff !important;color:#75BE02 !important;outline:2px solid #75BE02 !important;outline-offset:-2px !important;border:none !important;
}
#introduce_list .info ul li > a:hover{background:#75BE02 !important;color:#fff !important;outline-color:#75BE02 !important;}

/* タグ行と「続きを読む」の間隔調整 */
#introduce_list .info ul{margin-bottom:20px !important;}
#introduce_list .info .more{position:static !important;margin-top:0 !important;}

/* ───────── 「詳細を見る ▶︎」を 1 行に ───────── */
#introduce_list .more{margin-top:0 !important;text-align:right;}
#introduce_list .more a{
  display:inline-flex !important;
  align-items:center;
  gap:.4em;                        /* ← 不正値だった gap:px を修正 */
  white-space:nowrap;
}
#introduce_list .more a i.icn-arrow{line-height:0;}
#introduce_list .more{display:block !important;}
#introduce_list .more a::after{content:"" !important;display:none !important;}
#introduce_list .more a .icn-arrow{display:none !important;}

/* ───────── フッターの text / custom‑html ウィジェット文字サイズ調整 ───────── */
#footer .widget_text.footer_widget h3,
#footer .widget_custom_html.footer_widget h3,
#footer .widget_text.footer_widget .widget-title,
#footer .widget_custom_html.footer_widget .widget-title{
  font-size:1.6rem;
  line-height:1.3;
  font-weight:700;
}
#footer .widget_text.footer_widget,
#footer .widget_custom_html.footer_widget,
#footer .widget_text.footer_widget p,
#footer .widget_custom_html.footer_widget p,
#footer .widget_text.footer_widget li,
#footer .widget_custom_html.footer_widget li,
#footer .widget_text.footer_widget a,
#footer .widget_custom_html.footer_widget a{
  font-size:1.125rem;
  line-height:1.7;
}
@media (max-width:767px){
  #footer .widget_text.footer_widget,
  #footer .widget_custom_html.footer_widget,
  #footer .widget_text.footer_widget p,
  #footer .widget_custom_html.footer_widget p,
  #footer .widget_text.footer_widget li,
  #footer .widget_custom_html.footer_widget li,
  #footer .widget_text.footer_widget a,
  #footer .widget_custom_html.footer_widget a{ font-size:1rem; }
}

/* ───────── フッターのナビゲーション文字サイズ調整 ───────── */
#footer_nav .footer_nav_col .headline{
  font-size:1.6rem;
  line-height:1.35;
  font-weight:700;
}
#footer_nav .footer_nav_col > ul > li > a{
  font-size:1.125rem;
  line-height:1.6;
}
#footer_nav .footer_nav_col ul ul a{
  font-size:1rem;
  line-height:1.6;
}
@media (max-width:767px){
  #footer_nav .footer_nav_col .headline{font-size:1.4rem;}
  #footer_nav .footer_nav_col > ul > li > a{font-size:1rem;}
  #footer_nav .footer_nav_col ul ul a{font-size:.9375rem;}
}

/* ===============================
   ホトカミ「3つの安心ポイント」
   貼るだけでOK（ラッパー .trust-points を使用）
   ------------------------------ */
.trust-points{
  max-width:960px;margin:0 auto;padding:2.4rem 1rem;
  display:grid;grid-template-columns:1fr;gap:1rem;font-family:inherit;
}
.trust-points h3{
  margin:0 0 .5rem 0;
  font-size:1.6rem;
  line-height:1.4;
  text-align:center;
}
.trust-points p{
  margin:0;padding:1.6rem;background:#fff;border:1px solid #e8e8e8;border-radius:10px;
  box-shadow:0 2px 6px rgba(0,0,0,.05);line-height:1.75;text-align:left;
}
.trust-points p strong{
  display:block;
  font-size:1.6rem;
  color:#75BE01; margin-bottom:.4rem;
}
@media (min-width:768px){
  .trust-points{grid-template-columns:repeat(3,1fr);align-items:stretch;}
  .trust-points h3{grid-column:1 / -1;}
  .trust-points p{min-height:240px;padding:1.8rem;}
}
.has-background .trust-points p{background:#fff;}
.trust-points + *{margin-top:1.5rem;}

/* ======================================================
   寺院ページスライダー（#introduce_slider）
   object-fit 方式に統一して片寄り・ズーム演出を無効化
   ====================================================== */
#introduce_slider{
  width:100%;
  aspect-ratio:3/2;            /* 6:4 ≒ 3:2 */
  position:relative;
  overflow:hidden;
}
#introduce_slider .slick-list,
#introduce_slider .slick-track{height:100% !important;}
#introduce_slider .item,
#introduce_slider .slick-slide{position:relative;height:100% !important;}
#introduce_slider .item img,
#introduce_slider .slick-slide img{
  position:absolute !important;
  inset:0 !important;          /* top/right/bottom/left:0 */
  width:100% !important;height:100% !important;
  object-fit:cover !important;object-position:center center !important;
  transform:none !important;left:0 !important;right:auto !important;top:0 !important;bottom:auto !important;
  max-width:none !important;min-width:0 !important;display:block !important;
}
/* 親テーマのズームなども停止 */
#introduce_slider .item.slick-current img,
#introduce_slider .item.slick-active img{animation:none !important;transform:none !important;}

/* モバイルは少し縦長にしてトリミングを緩和（任意） */
@media (max-width:767px){
  #introduce_slider{aspect-ratio:16/11;}
}

/* --- 関連記事カード：テキストが隠れないようにリセット --- */
#related_post ol li,
#related_post ol li a{height:auto !important;overflow:visible !important;}
#related_post ol li a{
  display:block;position:relative !important;z-index:1 !important;padding-bottom:0 !important;
}
#related_post ol li .rel-introduce-copy{
  clear:both;margin-top:8px;position:relative;z-index:2;overflow:visible;
}

/* 見た目（必要に応じて調整OK） */
#related_post .rel-introduce-catch{
  font-weight:700;line-height:1.6;margin:0 0 4px;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
}
#related_post .rel-introduce-lead{
  font-size:13px;line-height:1.7;color:#555;margin:0;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
}
@supports not (-webkit-line-clamp:2){
  #related_post .rel-introduce-catch,
  #related_post .rel-introduce-lead{overflow:visible;}
}
/* 明示サイズ（親の font-size:0 影響を回避・強制） */
#related_post .rel-introduce-catch{font-size:15px !important;color:#222 !important;font-weight:700;line-height:1.6;margin:6px 0;}
#related_post .rel-introduce-lead{font-size:13px !important;line-height:1.7;color:#555;margin:0;}

/* ===== 関連記事カード レイアウト調整（見やすく） ===== */
#related_post ol.clearfix{
  display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;
  margin:0;padding:0;list-style:none;
}
#related_post ol.clearfix > li{
  float:none !important;width:auto !important;margin:0 !important;height:auto !important;overflow:visible !important;
  background:#fff;border:1px solid #eee;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.05);padding:14px;
}
#related_post .image img{display:block;width:100% !important;height:auto !important;border-radius:10px;}
#related_post h3.title{font-size:17px;line-height:1.5;margin:10px 0 0;color:#111;}
@media (max-width:1024px){
  #related_post ol.clearfix{grid-template-columns:repeat(2,1fr);gap:24px;}
}
@media (max-width:640px){
  #related_post ol.clearfix{grid-template-columns:1fr;gap:18px;}
  #related_post h3.title{font-size:16px;}
  #related_post .rel-introduce-catch{font-size:15px !important;}
  #related_post .rel-introduce-lead{font-size:14px !important;}
}


/* cache-buster */
html{--hotfix-20250821:1}


/* ① show_info の「拡大」演出を殺す（幅固定を全無効化） */
#introduce_list .introduce_list_col.show_info,
#introduce_list .introduce_list_col:hover,
#introduce_list .introduce_list_col a:hover{
  width: auto !important;          /* ← 48.888% / 100% などの拡大を打消し */
}
#introduce_list .introduce_list_col.show_info .image,
#introduce_list .introduce_list_col.show_info .info{
  width: 100% !important;          /* 内部の横幅変更も打消し */
}
#introduce_list .introduce_list_col .info{
  position: static !important;     /* 絶対配置での“せり上がり”も停止 */
  height: auto !important;
  opacity: 1 !important;
  transform: none !important;
}

/* ② どのページでも PC は3列グリッド（floatを全て無効化） */
@media (min-width:1025px){
  #introduce_list .introduce_list_row{
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 32px 28px;
  }
  #introduce_list .introduce_list_col{
    float: none !important;
    width: auto !important;
    margin: 0 !important;          /* 列間の余白は gap に統一 */
  }
  #introduce_list .introduce_list_col > a{
    display: block !important;
    width: 100% !important;
  }
}
/* タブレット2列 / スマホ1列（必要なら） */
@media (min-width:768px) and (max-width:1024px){
  #introduce_list .introduce_list_row{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width:767px){
  #introduce_list .introduce_list_row{ grid-template-columns: 1fr; }
}

/* ③ hover 時でも画像の縦横比を固定（縦長化ガード） */
#introduce_list .introduce_list_col .image,
#introduce_list .introduce_list_col a:hover .image,
#introduce_list .introduce_list_col.show_info .image{
  position: relative !important;
  aspect-ratio: 3 / 2 !important;  /* 好みで 16/9 などに変更可 */
  padding-top: 0 !important;
  height: auto !important;
  overflow: hidden !important;
}
#introduce_list .introduce_list_col .image img,
#introduce_list .introduce_list_col a:hover .image img,
#introduce_list .introduce_list_col.show_info .image img{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transform: none !important;
  transition: none !important;
}


/* ── SPでカード内容が右に寄るのを修正 ── */
@media only screen and (max-width: 767px) {
  /* テキストブロックを全幅・非フロートに */
  #introduce_list .introduce_list_col .info,
  .introduce_list_col.show_info .info {
    width: 100% !important;
    float: none !important;
    clear: both !important;
    margin-top: 12px !important; /* お好みで */
  }
  /* 念のため、画像ブロックも単独行・全幅に統一 */
  #introduce_list .introduce_list_col .image {
    width: 100% !important;
    float: none !important;
  }
  /* スマホ時は min-width を無効化して横ズレの芽を摘む */
  body {
    min-width: 0 !important;
  }
}