@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* ======================================================
 * ページ共通：ナビゲーション（グローバルメニュー）
 * ページ：全ページ共通
 * セクション：#navi
 * クラス用途：メニューの装飾・下線演出
 * ====================================================== */
#navi {
  padding-top: 20px;  /* 上に余白を追加 */
  padding-bottom: 20px;  /* 下にも余白追加でバランス調整 */
}

/* ▼ 各メニューリンク */
#navi ul li a {
  position: relative;
  display: inline-block;
  padding: 8px 12px;
  line-height: 1.5;
  text-decoration: none;
  color: #3b2c1d;
}

/* ▼ メニューリンクの下線（通常非表示） */
#navi ul li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 4px;  /* 下線位置調整 */
  width: 100%;
  height: 2px;
  background-color: #B64926;  /* 優しい朱色の下線 */
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.3s ease;
  pointer-events: none;
}

/* ▼ ホバー時と現在のページに下線表示 */
#navi ul li a:hover::after,
#navi ul li.current-menu-item a::after {
  transform: scaleX(1);
}
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

#container {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#content {
  flex: 1;
}

#footer {
  margin-top: auto;
}




/* ======================================================
 * ページ共通：見出し装飾の無効化（Cocoonデフォルトリセット）
 * ページ：全ページ共通
 * セクション：記事本文（.entry-content）
 * ====================================================== */
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
  all: unset;
  display: block;
  font-weight: 600;
  font-size: 1.5rem;
  margin: 2rem 0 1rem;
  line-height: 1.4;
  color: #4B3621;
}

/* ======================================================
 * ページ共通：レイアウト余白のリセット（Cocoonテーマ打ち消し）
 * ページ：全ページ共通
 * セクション：.main / .container / .wrap / .content
 * ====================================================== */
.main,
.container,
.content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* wrap（全体ラッパー）の幅を全画面に */
.wrap {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 2vw;
  padding-right: 2vw;
  box-sizing: border-box;
}

/* 背景を白に固定（Cocoonテーマ干渉防止） */
.content,
.content-area,
.site-content,
#content {
  background-color: #ffffff !important;
}

/* フォント全体の色設定（和風な茶色系） */
body,
h2, h3, h4, h5, h6,
p, span, a, li, dt, dd,
blockquote, strong, em,
label, input, textarea, select, button,
th, td {
  color: #4B3621 !important;
}

/* ======================================================
 * ページ共通：背景設定（和紙風）
 * ページ：全ページ共通
 * セクション：body
 * ====================================================== */
body {
  background-color: #FFF8E7;  /* 和紙をイメージした淡い黄系背景 */
}

/* ======================================================
 * セクション共通：全幅にしたいセクション
 * ページ：ご祈祷案内など
 * セクション：.ryukoin-section-full
 * ====================================================== */
.ryukoin-section-full {
  width: 100vw;
  margin-left: calc(50% - 50vw); /* ブラウザ全幅中央表示 */
}

/* セクション内部の最大幅は従来に合わせて保持 */
.ryukoin-section-full > .ryukoin-container {
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* ======================================================
 * タイトル・見出しの装飾クリア
 * ページ：全ページ共通
 * セクション：共通タイトル
 * ====================================================== */
.ryukoin-section-header,
.ryukoin-section-title,
.widget-title,
.entry-title,
.article h2,
.article h3 {
  background-color: transparent !important;
  box-shadow: none !important;
}

/* ======================================================
 * 本文用ラッパー全体の装飾
 * ページ：共通
 * セクション：.ryukoin-main-content
 * ====================================================== */
.ryukoin-main-content {
  color: #374151;  /* text-neutral-800 */
  overflow-x: visible !important;
}

/* ======================================================
 * フェードインアニメーション（共通）
 * ページ：全ページ共通
 * セクション：アニメーション用
 * ====================================================== */
/* 初期：透明＆ずらし */
.fade-in-up,
.fade-in-left,
.fade-in-right {
  opacity: 0;
  transition: opacity 1s ease, transform 1s ease;
  will-change: opacity, transform;
}
.fade-in-up    { transform: translateY(40px); }
.fade-in-left  { transform: translateX(-40px); }
.fade-in-right { transform: translateX(40px); }

/* 表示されたらis-visibleが追加されて表示 */
.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}

/* ======================================================
 * セクション共通：構造スタイル
 * ページ：全体レイアウト用
 * クラス：.ryukoin-container / .ryukoin-section
 * ====================================================== */
.ryukoin-container {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-width: 640px)  { .ryukoin-container { max-width: 640px; } }
@media (min-width: 768px)  { .ryukoin-container { max-width: 768px; } }
@media (min-width: 1024px) { .ryukoin-container { max-width: 1024px; } }
@media (min-width: 1280px) { .ryukoin-container { max-width: 1280px; } }

.ryukoin-section {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
@media (min-width: 1024px) {
  .ryukoin-section {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
}

/* ======================================================
 * セクション：アイコン・タイトル共通スタイル
 * ページ：トップ・サブ共通
 * セクション：ヘッダー、タイトル
 * ====================================================== */
.ryukoin-section-header { text-align: center; margin-bottom: 1rem; }
.ryukoin-section-icon    { margin-bottom: 0.5rem !important; }
.ryukoin-section-icon-large { margin-bottom: 1rem; }
.ryukoin-section-icon-large svg,
.ryukoin-icon-leaf {
  width: 56px;
  height: 56px;
  display: inline-block;
}

.ryukoin-section-title {
  font-size: 3rem !important;
  font-weight: 600;
  color: #374151;
  margin: 0.5rem 0 0;
  text-align: center !important;
}

.ryukoin-section-subtitle {
  font-size: 1.125rem;
  color: #4b5563;
  max-width: 42rem;
  margin: 0 auto;
}

/* サブページの大見出し */
.ryukoin-subpage-title {
  font-size: 2.5rem !important;
  font-weight: bold;
  color: #3b2c1d;
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  position: relative;
  display: inline-block;
  text-align: center;
}
.ryukoin-subpage-title::after {
  content: "";
  display: block;
  height: 2px;
  width: 100%;
  margin-top: 4px;
  background: linear-gradient(to right, #92400e, #e3c7a6);
}
/* スマホ（画面幅767px以下）のとき */
@media (max-width: 767px) {
  h2.ryukoin-subpage-title {
    font-size: 2.0rem !important; /* スマホ用に小さめのサイズ */
  }
}

/* ▼ Cocoonテーマのフッターに背景画像を埋め込む設定 */
.footer {
  background-image: url('http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/08/6e6b43d46d7bf6906da5fba60618e84e.png'); 
  background-size: cover;         /* 背景画像をフッター全体に拡大して表示 */
  background-position: center;    /* 背景画像を中央に配置 */
  background-repeat: no-repeat;   /* 背景画像を繰り返し表示しない */
  color: #fff;                    /* テキストを白色に（背景とのコントラスト確保） */
  padding: 2em 1em;               /* 上下にゆとりを持たせる余白 */
}

/* ▼ フッター全体に白い透明オーバーレイを重ねて、背景を淡くする */
footer::before {
  content: "";                             /* 疑似要素を表示するために必要 */
  position: absolute;                      /* 親要素に対して絶対位置に配置 */
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.6);  /* 半透明の白で全体を明るくする */
  pointer-events: none;                    /* オーバーレイがクリックを邪魔しないようにする */
  z-index: 0;                              /* 背景として扱う（下層に配置） */
}

/* ▼ footer全体の背景画像を調整する（上書き用途） */
footer {
  position: relative;                      /* ::before疑似要素の基準にするために必要 */
  background-image: url('背景画像のURL');   /* 上書き用の背景画像（必要に応じて変更） */
  background-size: cover;                  
  background-repeat: no-repeat;
  background-position: center;
}

/* ロゴ画像のサイズ調整を強制 */
.site-logo-image {
  width: 160px !important;      /* ← サイズここで調整（例：160px） */
  height: auto !important;
  max-width: none !important;   /* テーマによる幅制限を無効化 */
  display: inline-block !important;
}

/* ======================================================
 * 共通コンポーネント：画像、カード、ボタン
 * ページ：全ページ共通
 * ====================================================== */

/* 和風な角丸・影付き画像 */
.ryukoin-image {
  max-width: 100%;
  height: auto;
  border-radius: 0.75rem;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}

/* カードタイトル調整 */
.ryukoin-card h3 {
  border: none !important;
  background: none !important;
  padding: 0 !important;
  margin: 0 0 1rem 0;
  font-weight: 600;
  font-size: 1.25rem;
}

/* ボタン（共通デザイン） */
.ryukoin-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.3s;
  padding: 0.75rem 1.5rem;
  border: 1px solid transparent;
  white-space: nowrap;
  gap: 0.5rem;
}
.ryukoin-button-lg    { padding: 0.75rem 2rem; font-size: 1.125rem; }
.ryukoin-button-full  { width: 100%; }

.ryukoin-button-primary {
  background-color: #B64926;
  color: #FFF !important;
}
.ryukoin-button-primary:hover {
  background-color: #7f1d1d;
}

.ryukoin-button-outline {
  background-color: white;
  color: #991b1b !important;
  border-color: #991b1b;
}
.ryukoin-button-outline:hover {
  background-color: #fef2f2;
}

.ryukoin-button-amber {
  background-color: #b45309;
  color: white;
}
.ryukoin-button-amber:hover {
  background-color: #92400e;
}

.ryukoin-icon-right {
  display: inline-block;
  transition: transform 0.3s;
  color: #fff !important;
}
.ryukoin-button:hover .ryukoin-icon-right {
  transform: translateX(4px);
}

/* ===================================================================
 * パンくずリスト
 * ===================================================================*/
.yoast-bc-wrap{
  margin:24px 0 0;
  padding:12px 0;
  /* border-top:1px solid #e9e9e9; ← これを削除 */
}
#breadcrumbs a{text-decoration:none}
#breadcrumbs a:hover{text-decoration:underline}

/* ===================================================================
 * 龍光院ウェブサイト - スタイルシート
 * ===================================================================*/

/* ===================================================================
 * 1. 共通スタイル・アニメーション
 * ===================================================================*/

/* ▼ アイコンをゆらゆら揺らすアニメーション */
@keyframes sway {
  0%   { transform: rotate(0deg); }
  25%  { transform: rotate(3deg); }
  50%  { transform: rotate(0deg); }
  75%  { transform: rotate(-3deg); }
  100% { transform: rotate(0deg); }
}

/* ▼ 鐘を揺らすアニメーション */
@keyframes shake {
  0%, 100% { transform: rotate(0); }
  25% { transform: rotate(5deg); }
  50% { transform: rotate(-5deg); }
  75% { transform: rotate(5deg); }
}

/* ▼ セクションアイコン共通スタイル */
.ryukoin-section-icon {
  animation: sway 3s ease-in-out infinite;
  display: inline-block; /* transform が効くように */
}
.ryukoin-events-section .ryukoin-section-icon {
  height: 80px !important;
  width: auto;
}

.ryukoin-section-icon-large {
  width: 48px;
  height: 48px;
}

.ryukoin-section-icon-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 1rem;
}

.ryukoin-section-icon-wrapper svg {
  width: 48px;
  height: 48px;
  stroke: #92400e; /* お寺らしい温かみのある茶色 */
}

/* ▼ セクション説明文共通スタイル */
.ryukoin-section-description {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 2rem auto;
  font-size: 1.1rem;
  line-height: 1.6;
  color: #4a4a4a;
}

/* ===================================================================
 * 2. グリッドレイアウト（共通）
 * ===================================================================*/

/* ▼ 3カラムグリッド */
.ryukoin-grid-3 {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2rem;
}

@media (min-width: 768px) {
  .ryukoin-grid-3 {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) { 
  .ryukoin-grid-3 { 
    grid-template-columns: repeat(3, minmax(0, 1fr)); 
  } 
}

/* ▼ 2カラムグリッド */
.ryukoin-grid-2,
.ryukoin-card-wrapper {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2カラム */
  gap: 2rem;
  align-items: stretch; /* ← 子要素（カード）の高さを揃える */
}

@media (min-width: 768px) { 
  .ryukoin-grid-2 { 
    grid-template-columns: repeat(2, minmax(0, 1fr)); 
  } 
}

/* ===================================================================
 * 3. 背景・オーバーレイ共通スタイル
 * ===================================================================*/

/* ▼ オレンジ系和紙風背景 */
.ryukoin-bg-orange {
  position: relative;
  background-image: url('http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/08/seigaiha_background-1.jpeg');
  background-repeat: no-repeat;   /* ← 繰り返し禁止 */
  background-size: cover;        /* ← 画面全体をカバー */
  background-position: center;
  background-color: #fdfcfb; /* 和紙風テイストに近いベース色 */
  z-index: 0;
}

/* ▼ 背景オーバーレイで読みやすさ確保 */
.ryukoin-bg-orange::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(255, 255, 255, 0.6); /* 背景を少し白く薄める */
  z-index: 1;
  pointer-events: none;
}

.ryukoin-bg-orange > .ryukoin-container {
  position: relative;
  z-index: 2;
}
/* ===================================================================
 * 4. カード・ボックス共通スタイル（整理済み）
 * ===================================================================*/

/* ▼ 基本カードスタイル */
.ryukoin-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(2px);
  border-radius: 0.75rem;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  padding: 1.5rem;
  color: #3b2c1d;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.ryukoin-card:hover {
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
}

/* ---------------------- 重要：画像まわりの衝突回避 ----------------------
   以前は .ryukoin-card-image に「aspect-ratio:1/1」「object-fit:cover」を
   付与 → 正方形切り抜き＝ロゴが切れる原因になり得るため撤去。
   ※別ページで“トリミング表示”が必要なら、
     .ryukoin-card-image--cover のような別クラスで個別指定してください。
----------------------------------------------------------------------- */
/* （旧）.ryukoin-card-image の切り抜き指定は削除 */

/* ▼ 画像を“切らずに表示”するデフォルト（汎用） */
.ryukoin-card img {
  width: 100%;
  height: auto;          /* 伸長禁止・比率維持 */
  object-fit: contain;   /* 切らない */
  border-radius: 0.5rem;
  margin-bottom: 1rem;
  background-color: #fff;
}

/* ▼ カードコンテンツ */
.ryukoin-card-content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* ▼ カード見出し */
.ryukoin-card-label {
  font-size: 1.25rem;
  font-weight: bold;
  color: #991b1b;
}
.ryukoin-card-title {
  font-size: 1.5rem;
  color: #b45309 !important;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
}

/* ▼ カード一覧のグリッド */
.ryukoin-card-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}
/* （修正）gridに対してflex系プロパティを当てていたため削除 */
@media (max-width: 768px) {
  .ryukoin-card-wrapper {
    grid-template-columns: 1fr; /* スマホは1列 */
  }
}

/* ▼ サービスボックス */
.ryukoin-service-box {
  background-color: #fff;
  padding: 2rem;
  border-radius: 0.75rem;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}
.ryukoin-service-title {
  font-size: 1.5rem;
  color: #991b1b;
  margin-bottom: 1rem;
}
.ryukoin-service-box p { margin-bottom: 1rem; }
.ryukoin-service-box ul {
  list-style: disc;
  padding-left: 1.5rem;
  margin-bottom: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.ryukoin-service-box img { margin-bottom: 1rem; }

/* ===================================================================
 * 5. 関連リンク（今回の要件：ロゴを切らず拡大もしない／画像領域を拡大）
 * ===================================================================*/

/* ▼ 段間を統一しつつ、グリッド自体は中央寄せ */
.related-links .links-grid { margin-left: auto; margin-right: auto; }
/* 段と段の間隔 */
.related-links .links-grid + .links-grid { margin-top: 2rem; }
/* 3段目だけ中身を左寄せ（グリッド本体は中央に配置） */
.links-grid-left { justify-content: flex-start; }

/* ▼ リンクなしカード（クリック無効）— 重複定義を1つに統合 */
.link-card.no-link {
  cursor: default;
  pointer-events: none;
}

/* ---------------- ここから画像の“切れ防止 & 領域拡大” ---------------- */

/* 画像ラッパ：画像を中央に収め、領域を少し大きく確保 */
.related-links .link-card .link-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  /* 画像が小さくならないよう最低高さを確保（＝領域を広げる） */
  min-height: 230px;          /* ← 以前より広めに */
  padding: 10px;
}

/* 画像：拡大しすぎず比率保持・切れ防止 */
.related-links .link-card .link-icon img {
  max-width: 100%;            /* 横は枠内に収める */
  max-height: 100%;           /* 高さはラッパのmin-height内に収める */
  width: auto;                /* 画像の実寸を尊重（無理に引き伸ばさない） */
  height: auto;
  object-fit: contain;        /* 全体表示でトリミングなし */
  image-rendering: auto;
}

/* スマホ時：領域は少しだけ抑える（はみ出し・間延び防止） */
@media (max-width: 768px) {
  .related-links .link-card .link-icon { min-height: 150px; }
}

/* 見出しなどの余白を微調整（画像領域拡大に合わせて） */
.related-links .link-card .link-title { margin-top: 0.5rem; }
.related-links .link-card .link-description { margin-top: 0.25rem; }

/* ===================================================================
 * 5. トップページ - ヒーローセクション
 * ===================================================================*//* ▼ ヒーローセクション全体 */
.home .ryukoin-hero {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  position: absolute;     /* ← ヘッダー直下に重ねる */
  top: 0; left: 0;
  z-index: 9999;
  height: 60vh;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: white;

  /* 背景画像 */
  background-image: url('http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/09/BE539284-5DAF-41C6-9E8F-42FE1E72E8A3_1_105_c.jpeg');
  background-size: 100% auto;    /* PC時は横幅フィット */
  background-position: top center;
  background-repeat: no-repeat;

  filter: contrast(1.1) brightness(1.05);
}

/* ▼ オーバーレイ類はそのまま */
.ryukoin-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 0, 0, 0.08);
  backdrop-filter: brightness(1.1) contrast(1.05) blur(1px);
}
.ryukoin-hero-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.45);
  z-index: 2;
  animation: overlayFade 3s ease-out forwards;
}
.ryukoin-hero-content {
  position: relative;
  z-index: 10;
  padding: 1rem;
}
.ryukoin-hero-title {
  font-size: 2.25rem;
  font-weight: 700;
  margin-bottom: 1rem;
  text-shadow: 0 3px 6px rgba(0, 0, 0, 0.6);
  opacity: 0;
  animation: fadeUp 1.5s ease-out 0.8s forwards;
}
.ryukoin-hero-subtitle {
  font-size: 1.125rem;
  margin-bottom: 2rem;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
  color: #fff !important;
  opacity: 0;
  animation: fadeUp 1.5s ease-out 1.6s forwards;
}

/* =========================================
   スマホ時の背景ズレ防止
   ========================================= */
@media (max-width: 640px) {
  .home .ryukoin-hero {
    background-size: cover !important;   /* ← 高さ不足で灰色が出るのを防ぐ */
    background-position: center center;  /* ← 中央寄せ */
  }
}

/* タイトルとサブタイトルがボワッとゆっくり登場（フェード＋浮上） */
@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes overlayFade {
  0% {
    background-color: rgba(0, 0, 0, 0.65);
  }
  50% {
    background-color: rgba(0, 0, 0, 0.15); /* 一度かなり明るく */
  }
  100% {
    background-color: rgba(0, 0, 0, 0.25); /* 少し暗めで安定 */
  }
}

/* ▼ レスポンシブ調整 */
@media (min-width: 768px) {
  .ryukoin-hero-title {
    font-size: 3.75rem;
  }
  .ryukoin-hero-subtitle {
    font-size: 1.25rem;
  }
}
/* ▼ ヒーロー高さ分のスペースを空ける */
.home .main {
  padding-top: 60vh !important; /* ヒーローセクションの高さと揃える */
}
/* ===================================================================
 * 6. トップページ - ニュース・お知らせセクション
 * ===================================================================*/

/* ▼ お知らせセクション用鐘アイコン */
.bell-wrapper {
  text-align: center;
  margin: 30px 0;
}

.bell-svg {
  width: 60px;
  height: 60px;
  fill: none;
  stroke: #b45309; /* 優しい茶色 */
  stroke-width: 5;
  animation: shake 2s ease-in-out infinite;
  transform-origin: top center;
  margin-bottom: 0.25rem !important;
}

.bell-text {
  margin-top: 10px;
  font-size: 1.4rem;
  color: #2e2e2e;
  font-weight: bold;
}

/* ▼ お知らせヘッダー */
.ryukoin-notice-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* ▼ ニュースリストコンテナ（PC） */
.ryukoin-news-list-container {
  max-width: 56rem; /* max-w-3xl */
  margin: 0 auto;
  background-color: rgba(255, 255, 255, 0.8);
  padding: 1rem 2rem;
  border-radius: 0.5rem;
}

/* ▼ スマホ表示（幅767px以下のとき） */
@media (max-width: 767px) {
  /* 見出し行も端まで（必要なければ外してOK） */
  .ryukoin-section-header,
  .ryukoin-news-list-footer {
    width: 100vw;
    margin-inline: calc(50% - 50vw); /* 親の左右padding/max-widthを無効化 */
    padding-inline: 1rem;             /* 文字が端にくっつかないよう内側余白 */
  }

  /* 本体カードを全幅に */
  .ryukoin-news-list-container {
    max-width: none;
    width: 100vw;
    margin-inline: calc(50% - 50vw);  /* フルブリードのキモ */
    border-radius: 0;                  /* 端まで伸ばすなら角丸を解除（好みで） */
    padding: 1rem;                     /* 読みやすい内側余白だけ残す */
  }
}
.ryukoin-news-list {
  display: flex;
  flex-direction: column;
}

/* ▼ ニュースリスト全体 */
.ryukoin-news {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ▼ ニュース1件のブロック */
.ryukoin-news-item {
  margin-bottom: 2em;
  border-bottom: 1px solid #ddd;
  padding-bottom: 1.5em;
  transition: background-color 0.3s ease; /* なめらかに変化 */
  padding: 1.5em;
  border-radius: 8px;
}

.ryukoin-news-item:hover {
  background-color: #fdf7f2; /* ほんのりクリーム色。寺院の落ち着いた雰囲気に合う */
}

/* ▼ ニュースタイトル */
.ryukoin-news-title {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  padding-left: 0.75rem !important;
  border-left: 8px solid #B64926 !important; /* 濃いオレンジ (amber-700) */
}

.ryukoin-news-title a {
  color: #374151;
  text-decoration: none;
  transition: color 0.3s;
}

.ryukoin-news-title a:hover { 
  color: #991b1b; 
}

/* ▼ ニュースメタ情報（日付・カテゴリ） */
.ryukoin-news-meta {
  display: flex;
  align-items: center;
  gap: 0.5em; /* アイコン的なスペース */
  font-size: 0.9rem;
  color: #888;
}

.ryukoin-icon-meta {
  margin-right: 0.5rem;
  color: #a16207;
}

.ryukoin-news-separator { 
  margin: 0 0.5rem; 
}

.ryukoin-news-category { 
  color: #92400e; 
  font-weight: 500; 
}

.ryukoin-news-date,
.ryukoin-news-cat {
  display: inline;
  line-height: 1;
  margin: 0;
  padding: 0;
}

/* ▼ ニュース説明文・抜粋 */
.ryukoin-news-description {
  font-size: 0.875rem;
  color: #4b5563;
  line-height: 1.6;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.ryukoin-news-excerpt {
  color: #3b2c1d;
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
}

/* ▼ ニュースリストフッター */
.ryukoin-news-list-footer {
  text-align: center;
  margin-top: 2rem;
}

/* ▼ ニュースセクションのレスポンシブ調整 */
@media screen and (max-width: 480px) {
  .ryukoin-news-meta {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ===================================================================
 * 7. トップページ - ご祈祷・拝観案内セクション
 * ===================================================================*/

/* ▼ ご祈祷・拝観案内セクション背景画像 */
.ryukoin-prayer-bg {
  position: relative;
  background-image: url('http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/08/seigaiha_background.jpeg'); 
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  color: #fff;
}

/* ▼ ご祈祷セクション暗めオーバーレイ */
.ryukoin-prayer-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35); /* 35%の暗さで文字を読みやすく */
  z-index: 1;
  backdrop-filter: blur(2px); /* 背景を少しぼかすと上品に */
}

/* ▼ ご祈祷セクションコンテンツ */
.ryukoin-prayer-content {
  position: relative;
  z-index: 2;
  color: #fff;
}

/* ▼ ご祈祷セクション専用タイトル */
.ryukoin-prayer-title {
  display: inline-block !important;
  background-color: #fff5e5 !important;
  padding: 0.5rem 1.5rem !important;
  border-radius: 0.5rem !important;
  font-weight: 600 !important;
  font-size: 1.875rem !important; /* 約1.5倍に拡大 */
  color: #92400e !important;
  margin: 2rem 1rem 1rem 1rem !important; /* 上下左右に余白 */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08) !important;
}
/* ご祈祷とご供養を左右に分割 */
.prayer-offering-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  margin-top: 1rem;
}

.prayer-offering-cols h4 {
  font-size: 1.1rem;
  font-weight: 600;
  color: #92400e;
  margin-bottom: 0.5rem;
}

.prayer-offering-cols ul {
  list-style: disc;
  padding-left: 1.2rem;
  margin: 0;
}

.prayer-offering-cols li {
  margin-bottom: 0.3rem;
}

/* スマホでは縦並び */
@media (max-width: 768px) {
  .prayer-offering-cols {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}
.ryukoin-card .note {
  font-size: 0.9rem;
  color: #b45309; /* 落ち着いたオレンジ系 */
  margin-top: 0.8rem;
}

/* 拝観案内内の注意書き */
.ryukoin-card .note {
  font-size: 0.9rem;
  color: #b45309; /* 落ち着いたオレンジ系 */
  margin-top: 0.8rem;
}

/* 拝観案内の写真 */
.haikan-photo {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
  margin-top: 1rem;
}

/* ▼ スマホ対応レイアウト調整 */
@media screen and (max-width: 768px) {
  .ryukoin-grid-2 {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }

  .ryukoin-section-title {
    font-size: 2.0rem !important;
    text-align: center;
  }

  .ryukoin-section-description {
    font-size: 1rem;
    text-align: center;
    padding: 0 1rem;
  }

  .ryukoin-card {
    padding: 1rem;
    margin: 0 1rem;
    border-radius: 0.75rem;
    background-color: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  }

  .ryukoin-prayer-title {
    font-size: 1.25rem !important;
    margin: 1rem 0 !important;
    text-align: center;
  }

  .ryukoin-card ul {
    padding-left: 1.25rem;
  }

  .ryukoin-section-icon-wrapper {
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
  }

  .ryukoin-button {
    display: block;
    width: 80%;
    margin: 2rem auto 0 auto;
    font-size: 1rem;
    padding: 0.75rem 1.5rem;
    text-align: center;
  }
}
/* ===================================================================
 * 8. 寺院紹介セクション
 * ===================================================================*/

/* ▼ 寺院紹介セクション全体 */
.temple-intro {
  padding: 5rem 1rem; /* 上下余白をやや縮小して読みやすく */
  position: relative;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(50% - 50vw); /* セクション全体を画面端まで広げる */
}

/* ▼ 寺院紹介背景画像 */
.temple-bg {
  position: absolute;
  inset: 0;
  background-image: url('http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/08/0e7b87fd6acbf99b021d0e361e74c4a7.png');
  background-size: cover;
  background-position: center;
  opacity: 0.12; /* 透明度を少し下げて文字を読みやすく */
  z-index: 1;
}

/* ▼ 寺院紹介2カラムグリッド */
.temple-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start; /* テキスト上揃え */
  gap: 3rem; /* 画像とテキストの隙間をやや詰める */
  position: relative;
  z-index: 10;
}

/* ▼ 寺院画像エリア */
.temple-image {
  display: flex;
  align-items: center;
  justify-content: center;  
  margin-top: 0;
}

.temple-image img {
  width: 100%;
  height: 22rem;
  object-fit: cover;
  border-radius: 0.5rem;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

/* ▼ 寺院情報バッジ（未使用想定） */
.temple-badge {
  position: absolute;
  bottom: -1.5rem;
  right: -1.5rem;
  width: 8rem;
  height: 8rem;
  background: white;
  border-radius: 0.5rem;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.badge-number {
  font-size: 1.5rem;
  font-weight: 300;
  color: #1f2937;
  margin-bottom: 0.25rem;
}

.badge-text {
  font-size: 0.75rem;
  color: #6b7280;
  letter-spacing: 0.1em;
}

/* ▼ 寺院紹介文章ブロック */
.temple-content {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin-top: 2rem; /* ← 見出しを下げる */
}

/* ▼ 宗派名（サブタイトル） */
.temple-subtitle {
  font-size: 1.5rem !important;
  font-weight: 300;
  color: #B64926 !important;
  letter-spacing: 0.05em;
  margin-bottom: 1.5rem;
  border: none !important;
  background: none !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* ▼ 寺院説明文 */
.temple-description {
  display: flex;
  flex-direction: column;
  gap: 1rem; /* 各段落の余白を抑えめに */
  color: #374151;
  line-height: 1.8; /* 読みやすい行間 */
  font-size: 1rem;
  padding-bottom: 0.5rem;
}
/* ===================================================================
 * 8. 寺院紹介セクション（まとめて差し替え）
 * ===================================================================*/

/* ▼ セクション全体 */
.temple-intro {
  padding: 5rem 1rem;
  position: relative;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

/* ▼ 背景装飾 */
.temple-bg {
  position: absolute;
  inset: 0;
  background-image: url('http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/08/0e7b87fd6acbf99b021d0e361e74c4a7.png');
  background-size: cover;
  background-position: center;
  opacity: 0.12;
  z-index: 1;
}

/* ▼ 2カラム（PC：左1/3・右2/3） */
.temple-grid {
  display: grid;
  grid-template-columns: 1fr 2fr; /* ← 左1/3、右2/3 */
  gap: 3rem;
  align-items: center;
  position: relative;
  z-index: 10;
}

/* ▼ 左：画像 */
.temple-image {
  display: flex;
  align-items: center;
  justify-content: center;
}
.temple-image img {
  width: 100%;
  height: clamp(320px, 40vw, 500px); /* 適度に縦を伸ばす */
  object-fit: cover;
  border-radius: 0.5rem;
  box-shadow: 0 20px 40px rgba(0,0,0,.15);
}

/* ▼ 右：テキスト */
.temple-content {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

/* ▼ スマホ（縦積み） */
@media (max-width: 767px) {
  .temple-grid {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 1.75rem;
  }
  .temple-image img {
    height: clamp(220px, 50vw, 360px);
  }
}

/* ▼ 右：テキストブロック */
.temple-content {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  /* margin-top は不要。縦位置は .temple-grid の align-items で制御 */
}

/* ▼ サブタイトル（真言宗豊山派について） */
.temple-subtitle {
  font-size: 1.5rem;
  font-weight: 300;
  color: #B64926;
  letter-spacing: 0.05em;
  margin-top: .5rem;     /* h2 との間を少し確保 */
  margin-bottom: 1.5rem;
  border: none;
  background: none;
  padding: 0;
  box-shadow: none;
}

/* ▼ 本文 */
.temple-description {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  color: #374151;
  line-height: 1.8;
  font-size: 1rem;
  padding-bottom: 0.5rem;
}
.temple-description p {
  margin-bottom: 0.75rem;
}

/* ▼ 下段インフォ（参拝時間・連絡先・住所など） */
.temple-info {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin-top: 2rem;
  justify-content: center;
}
.info-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 8rem;
}
.info-icon {
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
}
.info-label {
  font-size: 0.875rem;
  font-weight: 500;
  color: #1f2937;
  margin-bottom: 0.25rem;
}
.info-value {
  font-size: 0.75rem;
  color: #4b5563;
}

/* ▼ 駐車場案内ボックス */
.parking-info {
  margin-top: 1.5rem;
  background: #fdfbf8;
  border: 1px solid #e4d5c3;
  border-radius: 8px;
  padding: 1rem;
}
.parking-item {
  padding: 0.5rem 0;
  border-bottom: 1px dashed #d4b48c;
}
.parking-item:last-child {
  border-bottom: none;
}
.parking-item h4 {
  font-size: 1.1rem;
  color: #92400e;
  margin-bottom: 0.25rem;
}
.parking-item p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.5;
}

/* ▼ アクセスボタン */
.btn-access {
  display: inline-block;
  padding: 8px 16px;
  background-color: #f3f4f6;
  color: #92400e;
  text-decoration: none;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.9rem;
  transition: all 0.3s ease;
}
.btn-access:hover {
  background-color: #e5e7eb;
  border-color: #92400e;
  color: #92400e;
}

/* ▼ スマホ（縦積み・上揃え） */
@media (max-width: 767px) {
  .temple-grid {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 1.75rem;
  }
  .temple-image img {
    height: clamp(220px, 45vw, 300px);
  }
}

/* =========================================
 * フルブリード写真セクション（区切り用）
 * - コンテンツ幅の制約を外して画面端まで表示
 * ========================================= */

/* フルブリード画像（高さ制限付き） */
.ryukoin-fullbleed-photo {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  line-height: 0;
}

/* ▼ 画像：はみ出しなしでトリミング表示（中央基準） */
.ryukoin-fullbleed-photo img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;      /* 横幅基準で中央トリミング */
  aspect-ratio: 21 / 6;   /* 高さを低めに（例：21:6） */
  max-height: 380px;      /* 高さの上限（必要に応じて調整） */
}

/* ▼ 前後セクションとの余白（必要に応じて調整） */
.ryukoin-section + .ryukoin-fullbleed-photo { margin-top: 1.75rem; }
.ryukoin-fullbleed-photo + .ryukoin-section { margin-top: 1.75rem; }

/* ▼ 画面が極端に縦長の端末で、写真が高くなりすぎるのを抑制（任意） */
@media (max-height: 600px) {
  .ryukoin-fullbleed-photo img { max-height: 60vh; }
}

/* ▼ 上下にごく薄い暗幕を入れて前後コンテンツと馴染ませ） */
.ryukoin-fullbleed-photo::before,
.ryukoin-fullbleed-photo::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  height: 24px;
  pointer-events: none;
}
.ryukoin-fullbleed-photo::before {
  top: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.06), rgba(0,0,0,0));
}
.ryukoin-fullbleed-photo::after {
  bottom: 0;
  background: linear-gradient(to top, rgba(0,0,0,.06), rgba(0,0,0,0));
}

/* =============================
   アクセス
   ============================= */

/* セクション外枠の上下余白を控えめに */
.temple-access-section {
  padding: 2.5rem 1rem;           /* 以前より小さめ */
}

/* アイコンと見出しの間隔を詰める */
.ryukoin-section-icon-wrapper { 
  margin-bottom: 0.5rem;          /* デフォルトより小さく */
}
.ryukoin-section-title {
  margin: 0.25rem 0 1.25rem;      /* 上下をコンパクトに */
}

/* 住所ブロック：行間と区切り線を軽く */
.access-address-block {
  margin-bottom: 1.25rem;         /* マップとの間隔を詰める */
}
.access-address-line {
  height: 1px;
  background: rgba(146,64,14,.18); /* 線色を薄めに */
  margin: 0.6rem 0;                /* 行間も詰める */
}
.access-address-row {
  display: grid;
  grid-template-columns: 8rem 1fr; /* ラベル幅を少し狭める */
  gap: .75rem;
  align-items: baseline;
}

/* ===== 駐車案内（見出しなし・カード風の軽い枠） ===== */
.parking-list {
  list-style: none;
  margin: 0 0 1.25rem;
  padding: .9rem 1rem;
  background: #fffaf3;             /* ごく淡い生成色 */
  border: 1px solid #e9dcc9;
  border-radius: 10px;
}
.parking-list li {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem .75rem;
  padding: .55rem 0;
  border-bottom: 1px dashed #e0cdb2;
}
.parking-list li:last-child { border-bottom: 0; }

.parking-place {
  color: #7a3f17;                  /* 落ち着いた茶色 */
  font-weight: 700;
}
.parking-text {
  color: #3b2c1d;
}
.parking-text small {
  opacity: .9;
}

/* マップ上の余白をさらに抑える */
.temple-access-map-full { 
  margin-top: .75rem;
}

/* ====== スマホ最適化（文字詰め＋余白縮小） ====== */
@media (max-width: 768px) {
  .temple-access-section { padding: 2rem .75rem; }
  .access-address-row { grid-template-columns: 6.5rem 1fr; }
  .parking-list { padding: .8rem .85rem; }
}


/* ▼ 寺院紹介セクションのレスポンシブ調整 */
@media (max-width: 768px) {
  .temple-grid {
    grid-template-columns: 1fr; /* スマホでは縦並びに */
  }
  .temple-info {
    flex-direction: column;
    align-items: center;
  }
}

/* ===================================================================
 * 区切りリンクセクション
 * ===================================================================*/
/* 区切り画像（現状そのまま） */
.divider-bleed{
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  line-height: 0;
  margin-block: 24px;
  overflow: hidden;               /* ← はみ出し防止（重要） */
}

.divider-bleed img{
  display: block;
  width: 100%;
  height: clamp(140px, 24vw, 300px); /* 少しだけ高さ余裕をプラス */
  object-fit: cover;
}

/* キャプション：常に画像内に重ねる */
.divider-bleed .divider-caption{
  position: absolute !important;  /* ← スマホでも重ねる */
  left: min(4vw, 16px);
  bottom: min(3.5vw, 18px);
  z-index: 1;
  padding: .42em .9em;
  border-radius: 12px;
  background: rgba(255,255,255,.88);
  backdrop-filter: saturate(130%) blur(2px);
  font-size: clamp(13px, 2.4vw, 16px); /* スマホで読める最小サイズを担保 */
  line-height: 1.35;
  color: #2b2b2b;
  box-shadow: 0 2px 12px rgba(0,0,0,.12);
  pointer-events: none;           /* タップ操作の邪魔をしない */
}

/* ※ 以前入れていた @media(max-width:480px) の
   position: static 指定は削除してください */
/* ===================================================================
 * 9. 関連リンクセクション
 * ===================================================================*/

/* ▼ 関連リンクセクション全体 */
.related-links {
  padding: 6rem 1rem;
  background: #f9fafb;
}

/* ▼ リンクグリッド */
.links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 2rem;
  justify-content: center;
  max-width: 960px;
  margin: 0 auto;
}

/* ▼ リンクカード */
.link-card {
  background: white;
  padding: 1.5rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  transition: box-shadow 0.3s ease;
}

.link-card:hover {
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

/* ▼ リンクアイコン */
.mizuhiki-ume-icon-img {
  height: 90px !important;  /* ← ここで大きさ調整（80〜100pxが目安） */
  width: auto !important;   /* 縦横比は自動維持 */
  display: inline-block;
  object-fit: contain;
}

/* ▼ リンクタイトル・説明 */
.link-title {
  border: none !important;
  background: none !important;
  font-weight: 500;
  color: #1f2937;
  margin-bottom: 0.25rem;
}

.link-description {
  font-size: 0.875rem;
  color: #4b5563;
}

/* ▼ 関連リンクのレスポンシブ調整 */
@media (max-width: 768px) {
  .links-grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1.25rem;
  }
}
/* 関連リンク全体 */
.related-links {
  padding: 6rem 1rem;
  background: #f9fafb;
}

/* 水引きアイコン */
.mizuhiki-ume-icon {
  height: 150px !important;  /* 125px → 150px */
  width: auto;
  display: block;
  margin: 0 auto;
}

/* グリッドレイアウト */
.links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 2rem;
  justify-content: center;
  max-width: 960px;
  margin: 0 auto;
}

/* カード */
.link-card {
  background: white;
  padding: 1.5rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  transition: box-shadow 0.3s ease;
  border-radius: 0.75rem;
}

.link-card:hover {
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

/* 画像アイコン */
.link-icon {
  width: 6rem;
  height: 6rem;
  border-radius: 0.5rem;
  overflow: hidden;
  margin-bottom: 1rem;
}

.link-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* タイトル */
.link-card h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #4b2e20;
  margin-bottom: 0.5rem;
}
/* ===================================================================
 * 10. 交通案内セクション
 * ===================================================================*/

/* ▼ 交通案内セクション全体 */
.temple-access-section {
  margin: 0;
  padding: 0;
}

/* ▼ 交通案内コンテナ */
.temple-access-container {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem 1rem;
}

/* ▼ 全幅マップラッパー */
.temple-access-map-full {
  width: 100vw;
  margin-left: calc(50% - 50vw); /* 全幅表示のために中央からはみ出す */
}

/* ▼ マップiframe */
.temple-access-map-full iframe {
  width: 100vw;
  height: 400px;
  border: none;
  display: block;
}
/* プライバシーポリシー */
.privacy-link-center {
  text-align: center;
  margin-top: 1.5em;
  margin-bottom: 1.5em;
  font-size: 0.95rem;
}

.privacy-link-center a {
  color: #7b5c3f;
  text-decoration: underline;
  transition: color 0.3s;
}

.privacy-link-center a:hover {
  color: #a3875d;
}

/* ===================================================================
 * 11. お問い合わせフォーム
 * ===================================================================*/

/* セクション全体 */
.ryukoin-contact-section{
  padding: 3rem 1rem;
  background: #faf9f7;
  border-top: none;                 /* 線は撤去 */
}

/* ページ全体の色味に合わせて気持ち柔らかくする場合（任意） */
@media (min-width:768px){
  .ryukoin-contact-section{
    border-radius: .5rem;
  }
}

/* 見出し（駐車場のご案内と揃える） */
.ryukoin-contact-section .ryukoin-section-title {
  text-align: left;
  font-size: 2rem !important;   /* 駐車場見出しと同じくらい */
  font-weight: 600 !important;
  color: #4b2e1a !important;
  margin: 0 0 .75rem 0;
  line-height: 1.4;
}

/* 説明文 */
.ryukoin-contact-section .contact-intro {
  text-align: left;
  color: #444;
  margin: 0 0 1.25rem 0;
  line-height: 1.8;
}

/* 横幅をアクセス欄と揃える */
.ryukoin-contact-section,
.ryukoin-contact-section .wpcf7,
.ryukoin-contact-section .wpcf7-form,
.ryukoin-contact-section form.wpcf7-form,
.ryukoin-contact-section form.wpcf7-form > * {
  max-width: 700px !important;   /* 680〜720pxで微調整 */
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 外枠線・影を完全オフ */
.ryukoin-contact-section form,
.ryukoin-contact-section fieldset,
.ryukoin-contact-section dl,
.ryukoin-contact-section .wpcf7,
.ryukoin-contact-section .wpcf7-form { 
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* ラベル・入力欄 */
.inquiry dl { margin: 0; }
.required { color: #b64926; font-size: .85rem; margin-left: .25rem; }
/* 各フォーム項目 */
.form-item {
  margin-bottom: 1rem;
}

.form-item label {
  display: block;
  margin-bottom: 0.25rem; /* ラベルと入力欄をギュッと近づける */
  font-weight: 500;
  line-height: 1.4;
}

/* 入力欄 */
.form-item input,
.form-item textarea {
  width: 100%;
  box-sizing: border-box;
  padding: .75rem 1rem;
  border: 1px solid #d1d5db;
  border-radius: .5rem;
  font: inherit;
  background: #fff;
  margin: 0; /* 余白ゼロ */
}

/* フォーカス時 */
.form-item input:focus,
.form-item textarea:focus {
  outline: none;
  border-color: #b64926;
  box-shadow: 0 0 0 2px rgba(182,73,38,.2);
}
/* ラベルとアイコンを横並びに */
.ryukoin-contact-section dt{
  display:flex;
  align-items:center;     /* 縦中央 */
  gap:.5rem;
  line-height:1.4;        /* ラベルの行高を明示 */
}

.ryukoin-contact-section dt .form-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  flex:0 0 20px;
  vertical-align:middle;   /* 念のため */
}
.ryukoin-contact-section dt .form-icon svg{
  display:block;           /* 余白（ベースライン）を消す */
  width:100%;
  height:100%;
}

/* アイコン */
.ryukoin-contact-section .form-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.ryukoin-contact-section .ryukoin-section-title {
  text-align: center !important;
  font-size: 2rem !important;
  font-weight: 600 !important;
  color: #4b2e1a !important;
}
.ryukoin-contact-section .ryukoin-section-title .icon {
  color: #b64926 !important;
  margin-right: .5rem !important;
  font-size: 1.5rem !important;
}

/* 入力UI */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: .75rem 1rem;
  border: 1px solid #d1d5db;
  border-radius: .5rem;
  font: inherit;
  background: #fff;
}
.wpcf7-form input:focus,
.wpcf7-form textarea:focus {
  outline: none;
  border-color: #b64926;
  box-shadow: 0 0 0 2px rgba(182,73,38,.2);
}

/* 同意チェック */
.consent-check { margin: 1rem 0; }

/* --- フォーム本体の左右パディングを対称に（念のため） --- */
.ryukoin-contact-section .inquiry{
  max-width: 720px;      /* 既にあれば不要 */
  margin: 0 auto;        /* 中央配置 */
  padding: 0 1.25rem;    /* 左右対称にする */
  box-sizing: border-box;
}

/* --- 送信ブロック：ズレない中央配置（Gridで安定） --- */
.ryukoin-contact-section .submit{
  display: grid;                 /* 中央寄せに最適 */
  justify-items: center;         /* 子要素を中央に固定 */
  align-content: start;
  gap: .5rem;
  width: 100%;
  margin-top: 1.5rem;
  /* 見た目の微調整用。必要なければ削除。 */
  --center-nudge: 0px;           /* +右 / -左 に数px調整可能 */
}

/* ボタン本体（CF7標準クラスも拾う） */
.ryukoin-contact-section .submit .ryukoin-btn,
.ryukoin-contact-section .submit .wpcf7-submit,
.ryukoin-contact-section .submit input[type="submit"],
.ryukoin-contact-section .submit button[type="submit"]{
  display: inline-block;
  margin: 0 !important;
  float: none !important;
  padding: .75rem 2rem;
  text-align: center;
  border-radius: 9999px;
  transform: translateX(var(--center-nudge)); /* ←微調整 */
}

/* スピナーは固定サイズで先に場所を確保（出現時の押し出し防止） */
.ryukoin-contact-section .submit .wpcf7-spinner{
  width: 24px; height: 24px;
  margin: .25rem 0 0;
}

/* レスポンス幅が広がって押し出すのを防止 */
.ryukoin-contact-section .submit .wpcf7-response-output{
  margin: 0;
  max-width: 40rem;
  text-align: center;
}

/* スマホ時、見た目の中心を微調整（必要なら数pxだけ右へ） */
@media (max-width: 767.98px){
  .ryukoin-contact-section .submit{ --center-nudge: 2px; } /* 0〜4pxで調整 */
  .ryukoin-contact-section .submit .wpcf7-submit{ width: min(320px, 90%); }
}

/* ボタンスタイル */
.wpcf7-form .button,
.wpcf7-submit {
  background: #b64926;
  color: #fff !important;
  padding: .75rem 2rem;
  border: none;
  border-radius: 9999px;
  font-weight: 600;
  cursor: pointer;
  display: inline-block !important;
  width: auto !important;
  margin: 0 !important;
  float: none !important;
  min-width: 160px;
}
.wpcf7-form .button:hover,
.wpcf7-submit:hover {
  background: #8a351d;
}


/* 入力欄ごとのエラーメッセージ */
.ryukoin-contact-section .wpcf7-not-valid-tip {
  color: #d32f2f !important;;        /* 赤色 */
  font-weight: bold !important;;     /* 太字 */
  margin-top: 0.25rem !important;;
  font-size: 0.9rem !important;;
}

/* 同意行の余白と行間 */
.ryukoin-contact-section .consent-check {
  margin: 1rem 0;
  line-height: 1.7;
}
/* acceptance のチェックと文を横並びで綺麗に */
.ryukoin-contact-section .consent-check label {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

/* ▼ モバイル：見出し縮小・折り返し防止／ラベル行のアイコン位置調整 */
@media (max-width: 767.98px){
  /* ラベル行：2行になってもアイコンが上に浮かない */
  .ryukoin-contact-section dt{
    align-items: flex-start;
  }

  /* 見出し（題名）を小さく＆1行固定で表示 */
  .ryukoin-contact-section h2.ryukoin-section-title,
  .ryukoin-contact-section .ryukoin-section-title{
    font-size: clamp(1.2rem, 5vw, 1.45rem) !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;   /* 折り返し防止 */
    letter-spacing: 0.01em;
    margin-bottom: .5rem;
    overflow: hidden;                 /* 万一はみ出す端末向け */
    text-overflow: ellipsis;
  }

  /* 見出し内の飾りアイコンも縮小 */
  .ryukoin-contact-section .ryukoin-section-title .icon{
    font-size: 1.1rem !important;
    margin-right: .35rem;
  }
}

/* ▼ PC：フォーム2列レイアウト（任意） */
@media (min-width: 768px){
  .ryukoin-contact-section .wpcf7-form dl{
    display: grid;
    grid-template-columns: 1fr 2fr;
    column-gap: 1.5rem;
  }
}

/* ===================================================================
 * 【ページ名】龍光院について
 * ===================================================================*/

/* -------------------------------------------------------------------
 * 【セクション名】ヒーローセクション
 * 【用途】ページトップの大型画像背景エリア
 * -------------------------------------------------------------------*/

/* ヒーローセクションのメインコンテナ */
.ryukoin-about-hero {
  position: relative;
  width: 100vw;                    /* 画面幅いっぱいに表示 */
  margin-left: calc(50% - 50vw);   /* コンテナから飛び出して中央揃え */
  height: 25vh;                    /* 画面高さの25% */
  background-image: url('http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/08/image_1900x800_resized.png');
  background-size: cover;          /* 背景画像を要素全体にカバー */
  background-position: center;     /* 背景画像を中央配置 */
  display: flex;
  align-items: center;             /* 縦方向中央揃え */
  justify-content: center;         /* 横方向中央揃え */
}

/* ヒーロー画像上の暗いオーバーレイ */
.ryukoin-about-hero-overlay {
  position: absolute;
  inset: 0;                        /* 上下左右すべて0で全面カバー */
  background-color: rgba(0, 0, 0, 0.4); /* 半透明の黒いオーバーレイ */
  z-index: 1;                      /* テキストより下のレイヤー */
}

/* ヒーローセクション内のテキストコンテンツ */
.ryukoin-about-hero-content {
  position: relative;
  z-index: 2;                      /* オーバーレイより上のレイヤー */
  text-align: center;
  color: #fff;                     /* 白色テキスト */
  padding: 1rem;
}

/* ヒーローセクションのメインタイトル */
.ryukoin-about-hero-title {
  font-size: 2.5rem;
  font-weight: bold;
}

/* スマホ（画面幅767px以下）のとき */
@media (max-width: 767px) {
  h1.ryukoin-about-hero-title {
    font-size: 2.0rem; /* スマホ用に小さめのサイズ */
  }
}

/* ヒーローセクションのサブタイトル */
.ryukoin-about-hero-subtitle {
  font-size: 1.25rem;
  margin-top: 1rem;
}

/* ヒーローセクション内のCTAボタン */
.ryukoin-about-button {
  margin-top: 1.5rem;
  display: inline-block;
  padding: 0.75rem 1.5rem;
  border-radius: 0.5rem;
  background-color: #b45309;       /* 茶色系のブランドカラー */
  color: white;
  text-decoration: none;           /* リンクの下線を削除 */
  font-weight: bold;
}

/* ボタンのホバー効果 */
.ryukoin-about-button:hover {
  background-color: #92400e;       /* より濃い茶色に変化 */
}

/* ボタン内アイコンの右側マージン */
.ryukoin-about-icon-right {
  margin-left: 0.5rem;
}
/* -------------------------------------------------------------------
 * 【セクション名】真言宗豊山派 説明セクション
 * 【用途】宗派についての詳細説明エリア
 * -------------------------------------------------------------------*/

/* セクション全体の外枠（変更なし） */
.ryukoin-about-section {
  padding: 3rem 1rem;
  background-color: #fdfbf8;
}

/* 画像とテキストの横並びコンテナ */
.ryukoin-about-container {
  display: flex;
  flex-wrap: wrap;           /* 画面サイズに応じて折り返し */
  gap: 2rem;
  justify-content: center;
  align-items: flex-start;   /* 追加：テキストの多い時の縦ズレ防止 */
  /* min-height: 520px; */   /* 削除：高さ固定がスマホのトリミング要因 */
}

/* 画像表示ブロック（変更なし・微調整） */
.ryukoin-about-image {
  flex: 1 1 45%;
  max-width: 560px;
  min-width: 260px;          /* 追加：極端な圧縮での崩れ防止 */
}

/* 画像ラッパー：トリミングをやめて自然表示に変更 */
.image-wrapper {
  position: relative;
  width: 100%;
  /* ▼ 削除：アスペクト比固定＋トリミングの主因
  padding-top: 56.25%;
  overflow: hidden;
  */
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* 画像：トリミングせず全体を見せる */
.image-wrapper img {
  display: block;            /* 追加：余白防止 */
  width: 100%;
  height: auto;              /* 追加：自然な比率で拡大縮小 */
  object-fit: contain;       /* 変更：cover → contain（全体表示） */
  /* ▼ 削除：絶対配置＋高さ100%はトリミングを誘発
  position: absolute;
  top: 0; left: 0;
  height: 100%;
  */
  filter: brightness(0.98);  /* 微調整（任意） */
  border-radius: 8px;        /* 追加：角丸を画像にも反映 */
}

/* テキスト表示ブロック（変更なし・可読性微調整） */
.ryukoin-about-text {
  flex: 1 1 50%;
  max-width: 640px;
  color: #3b2c1d;
  line-height: 1.8;
  font-size: 1.05rem;
  min-width: 280px;          /* 追加：折返しレイアウトの安定化 */
}

/* セクション内の見出し（変更なし） */
.ryukoin-about-title {
  font-size: 1.8rem;
  font-weight: bold;
  color: #3b2c1d;
  position: relative;
  display: inline-block;
  padding-bottom: 0.75rem;
}

/* 見出し下の装飾線（変更なし） */
.ryukoin-about-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 160px;
  height: 2px;
  background: linear-gradient(to right, #92400e, #e3c7a6);
}

/* ---------------- モバイル最適化（スマホ時の画像隠れ防止） --------------- */
@media (max-width: 768px){
  .ryukoin-about-container{
    gap: 1.25rem;
    align-items: stretch;       /* 追加：高さ揃え不要に */
  }
  .ryukoin-about-image,
  .ryukoin-about-text{
    flex: 1 1 100%;
    max-width: 100%;
  }
  .image-wrapper{
    /* 必要に応じて比率を軽く確保したい時だけ使用（通常は不要）
       aspect-ratio: 3 / 2;
    */
  }
}

/* -------------------------------------------------------------------
 * 【セクション名】龍光院の歴史セクション
 * -------------------------------------------------------------------*/

.ryukoin-history-section {
  background-image: url('http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/07/a885acbb7d6d78229f7a8d1642c06b31.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 6rem 1rem;
  position: relative;
  z-index: 0;
}

/* 背景オーバーレイ */
.ryukoin-history-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(255, 248, 231, 0.85);
  z-index: -1;
}

/* モバイルのパフォーマンス対策：fixedを無効化（iOSでカクつき・ズレ防止） */
@media (max-width: 768px){
  .ryukoin-history-section{
    background-attachment: scroll; /* 追加 */
  }
}

/* -------------------------------------------------------------------
 * 【セクション名】建物と尊像セクション
 * -------------------------------------------------------------------*/

.ryukoin-structure-section {
  background-color: #fdfaf5;
  padding: 6rem 1rem;
}

.ryukoin-table-block { margin-top: 3rem; }

.ryukoin-subsection-title {
  border: none !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 2rem 0 1rem;
  font-size: 1.25rem;
  color: #873b12 !important;
  font-weight: 600;
}

/* テーブル横スクロール */
.ryukoin-scroll-table { overflow-x: auto; }

/* メインテーブル */
.ryukoin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
  background: #fff;
  color: #333;
  min-width: 600px;
}

/* セル */
.ryukoin-table th,
.ryukoin-table td {
  border: 1px solid #ccc;
  padding: 0.75rem;
  text-align: left;
}

/* ヘッダー */
.ryukoin-table th {
  background: #f5e8d8;
  font-weight: 600;
}

/* -------------------------------------------------------------------
 * 【用途】画像ギャラリー表示
 * -------------------------------------------------------------------*/

/* 画像グリッドレイアウト */
.ryukoin-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); /* レスポンシブグリッド */
  gap: 16px;                      /* グリッド間の間隔 */
}

/* 個別画像アイテム */
.image-item {
  text-align: center;             /* 中央揃え */
}

/* ▼ まず、以前の .image-item img の装飾を打ち消す（額縁はframe側で付ける） */
.image-item img{
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* ▼ 正方形の枠を作る（どの環境でも安定） */
.image-item .frame{
  position: relative;
  width: 100%;
  /* 正方形化（aspect-ratioが無効でも効くように擬似要素方式） */
}
.image-item .frame::before{
  content: "";
  display: block;
  padding-top: 100%; /* = 正方形 */
}

/* ▼ 画像を枠いっぱいにフィット（強制上書き） */
.image-item .frame > img{
  position: absolute;
  inset: 0;                 /* top:0; right:0; bottom:0; left:0; の省略 */
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important; /* 中央トリミングで正方形に収める */
  display: block;
}

/* ▼ 枠の装飾（額縁・角丸・影） */
.image-item .frame{
  overflow: hidden;
  border: 1px solid #eee;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 2px 4px rgba(0,0,0,.08);
}

/* 画像のキャプション */
.image-caption {
  font-size: 0.85rem;            /* 小さめの文字サイズ */
  color: #555;                    /* ミディアムグレー */
  margin-top: 4px;                /* 画像との間隔 */
}

/* ===================================================================
 * 【レスポンシブデザイン】モバイル対応
 * ===================================================================*/

/* タブレット・スマートフォン対応 (768px以下) */
@media screen and (max-width: 768px) {
  
  /* 龍光院について - コンテナレイアウト調整 */
  .ryukoin-about-container {
    flex-direction: column;        /* 縦並びレイアウトに変更 */
    min-height: auto;              /* 高さ指定を解除 */
    align-items: flex-start;       /* 左寄せに変更 */
  }

  /* 画像とテキストブロックを全幅に */
  .ryukoin-about-image,
  .ryukoin-about-text {
    flex: 1 1 100%;               /* 全幅表示 */
    max-width: 100%;
  }

  /* 見出しサイズ調整 */
  .ryukoin-about-title {
    font-size: 1.5rem;           /* より小さなサイズに */
  }

  /* 歴史セクションの余白調整 */
  .ryukoin-history-section {
    padding: 3rem 1rem;          /* 余白を縮小 */
  }

  /* セクションタイトルサイズ調整 */
  .ryukoin-section-title {
    font-size: 1.75rem;          /* モバイル用サイズ */
  }
}
/* スマホ時は必ず1列（縦一列） */
@media (max-width: 768px){
  .ryukoin-image-grid{
    grid-template-columns: 1fr !important; /* 既存のauto-fitより強制的に優先 */
    gap: 14px;                              /* 少しだけ間隔を詰める（任意） */
  }
}

/* さらに小さい端末向け（任意） */
@media (max-width: 480px){
  .ryukoin-image-grid{
    grid-template-columns: 1fr !important;
    gap: 12px;
  }
}

/* ---------------------------------
 * 交通情報　ページ
 * ---------------------------------*/
.ryukoin-access-hero {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  height: 25vh;
  background-image: url('https://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/07/a885acbb7d6d78229f7a8d1642c06b31.jpg');
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ryukoin-access-hero-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.35);
  z-index: 1;
}

.ryukoin-access-hero-title {
  position: relative;
  z-index: 2;
  font-size: 2.75rem;
  color: #fff;
  font-weight: bold;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
}
/* アクセスセクション */
.access-section {
  margin: 0;
  padding: 0;
}

/* コンテナ中央寄せ */
.access-container {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem 1rem;
}

/* セクションタイトル */
.access-section-title {
  font-size: 1.8rem;
  color: #b45309;
  border-bottom: 2px solid #b45309;
  padding-bottom: 0.5rem;
  margin-bottom: 1.5rem;
}

/* アクセス説明文 */
.access-text {
  margin-bottom: 0;
  font-size: 1rem;
  color: #333;
}

/* 横幅いっぱいのマップ */
.access-map-full {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

.access-map-full iframe {
  width: 100vw;
  height: 400px;
  border: none;
  display: block;
}

/* 住所ブロック */
.access-address-block {
  text-align: left; 
  margin-bottom: 2rem;
}

/* 寺院名（アクセス・連絡先の見出し用） */
.access-address-title {
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  color: #7b3e1d !important;
  line-height: 1.6 !important;
  margin-bottom: 1em !important;
  margin-top: 1.5em !important;

  /* 左だけ残す */
  border-left: 5px solid #d8b28c !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;

  padding-left: 0.8em;
  background: none !important;
  box-shadow: none !important;   /* 影がついている場合の保険 */
}

/* 線（仕切り） */
.access-address-line {
  height: 1px;
  background: linear-gradient(to right, #bfa97f, transparent);
  margin-bottom: 1rem;
}

/* テキスト */
.access-address-text {
  font-size: 1.05rem;
  line-height: 1.8;
  color: #3c2f25;
  padding: 0.3rem 0;
  word-break: break-word;
}
.access-address-text strong {
  font-weight: bold;
  display: inline-block;
  min-width: 6rem;
  color: #5c3a1e;
}

/* アイコン */
.access-icon-wrapper {
  text-align: center;
  margin-bottom: 1rem;
}

.access-icon {
  display: inline-block;
}

/* アクセス案内ボックス */
.access-directions-box {
  margin-top: -0.5rem; /* 上の段落の余白を打ち消す */
  background-color: #fffefc;
  border: 1px solid #e6dccc;
  padding: 2rem;
  border-radius: 0.75rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  text-align: left;
}

.access-directions-title {
  font-size: 1.4rem;
  font-weight: bold;
  color: #5c3a1e;
  margin-bottom: 1rem;
  border-left: 6px solid #c59a6c;
  padding-left: 0.75rem;
}

.access-directions-list {
  list-style: none;
  padding-left: 0;
  margin: 0;
  color: #444;
  font-size: 1rem;
  line-height: 1.9;
}

.access-directions-list li {
  position: relative;
  padding-left: 1.5em;
  margin-bottom: 0.5em;
}

.access-directions-list li::before {
  content: "⟡";
  position: absolute;
  left: 0;
  color: #c59a6c;
  font-size: 1.2em;
  line-height: 1;
}
.access-address-block {
  color: #3c2f25;
  font-size: 1rem;
  margin-bottom: 2rem;
}

.access-address-line {
  height: 1px;
  background: linear-gradient(to right, #bfa97f, transparent);
  margin: 1rem 0;
}

.access-address-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: flex-start;
}

.access-label {
  flex: 0 0 8.5rem; /* ラベル幅固定 */
  font-weight: bold;
  color: #5c3a1e;
}

.access-value {
  flex: 1;
  color: #333;
  word-break: break-word; /* ← 一般用 */
  white-space: normal;    /* ← デフォルト */

  /* 以下を追加するとメールアドレスが改行されません */
  overflow-wrap: anywhere;  /* ← 万一の文字溢れ対策 */
  word-break: break-word;   /* ← 日本語対応 */
}
/* アクセスセクションのリンク装飾を無効化 */
.access-value a {
  text-decoration: none;  /* 下線を消す */
  color: inherit;         /* 親と同じ色にする */
}

/* ホバー時も下線を出さない */
.access-value a:hover {
  text-decoration: none;
  color: #b64926;  /* ホバー時に色を変える例（お寺カラー） */
}
.access-value.email {
  white-space: nowrap;
  word-break: keep-all;
}


/* -------------------------------
 * レスポンシブ対応
 * ------------------------------- */
@media screen and (max-width: 768px) {
  .ryukoin-access-hero {
    height: 20vh;
  }

  .ryukoin-access-hero-title {
    font-size: 1.8rem;
    padding: 0 1rem;
    text-align: center;
  }

  .access-container {
    padding: 1.5rem 1rem;
  }

  .access-section-title {
    font-size: 1.5rem;
    margin-bottom: 1rem;
  }

  .access-address-title {
    font-size: 1.1rem;
  }

  .access-address-text {
    font-size: 0.95rem;
  }

  .access-directions-box {
    padding: 0.5rem 1rem;
  }

  .access-directions-title {
    font-size: 1.2rem;
    padding-left: 0.6rem;
  }

  .access-directions-list {
    font-size: 0.95rem;
    line-height: 1.7;
  }

  .access-directions-list li {
    padding-left: 1.3em;
  }

  .access-directions-list li::before {
    font-size: 1em;
  }

  .access-map-full iframe {
    height: 300px;
  }
}

/* 駐車場案内ボックス */
.access-parking-box {
  max-width: 800px;
  margin: 2em auto;
  padding: 1.5em 2em;
  border-top: 2px solid #d8b28c;
  border-bottom: 2px solid #d8b28c;
  background: #fffefc;
  position: relative;
  font-size: 1.05rem;
  line-height: 1.9;
  color: #444;
}

/* 和風アイコン（桜マークなど） */
.access-parking-box::before {
  content: "❀"; /* 他に ✿ 卍 なども可 */
  position: absolute;
  top: -0.9em;
  left: 1em;
  background: #fffefc;
  padding: 0 0.4em;
  font-size: 1.2rem;
  color: #7b3e1d;
  font-weight: bold;
  letter-spacing: 0.2em;
}
.access-parking-box .access-parking-title {
  color: #a1470f; /* ご指定の色 */
}
/* タイトル */
h3.access-parking-title {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: #7b3e1d !important;
  text-align: left !important;
  border: none !important;
  background: none !important;
  margin-top: 0 !important;     /* ← 上の余白をなくす */
  margin-bottom: 0.6em !important; /* 下の余白だけ少し残す */
  padding: 0 !important;
}

/* 内容リスト */
.access-parking-content ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.access-parking-content li {
  margin: 0.5em 0;
  padding-left: 1.2em;
  position: relative;
}
.access-parking-content li::before {
  content: "・";
  position: absolute;
  left: 0;
  color: #d8b28c;
  font-weight: bold;
}

@media screen and (max-width: 768px) {
  .access-directions-box {
    padding: 1rem 1.25rem; /* 読みやすい余白 */
    margin-top: 1rem;      /* 前要素との間隔を自然に */
  }

  .access-directions-title {
    font-size: 1.1rem;
    padding-left: 0.75rem;
  }

  .access-directions-list {
    font-size: 1rem;       /* 標準サイズに戻すと読みやすい */
    line-height: 1.8;
  }

  .access-directions-list li {
    padding-left: 1.4em;
    margin-bottom: 0.75em;
  }
}
/* スマホ対応 */
@media screen and (max-width: 768px) {
  .access-address-row {
    flex-direction: column;
  }
  .access-label {
    flex: none;
  }
}
/* ---------------------------------
 * 年間行事予定ページ
 * ---------------------------------*/
.ryukoin-event-hero {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  height: 25vh;
  background-image: url('https://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/07/a885acbb7d6d78229f7a8d1642c06b31.jpg');
  background-size: cover;
  background-position: center;
  display: flex;          /* ← 全角スペース削除 */
  align-items: center;    /* ← 全角スペース削除 */
  justify-content: center;
}

.ryukoin-event-hero-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.35);
  z-index: 1;
}

.ryukoin-event-hero-title {
  position: relative;
  z-index: 2;
  font-size: 2.75rem;
  color: #fff;
  font-weight: bold;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
}
/* スマホ（画面幅767px以下）のとき */
@media (max-width: 767px) {
  h1.ryukoin-event-hero-title  {
    font-size: 2.0rem; /* スマホ用に小さめのサイズ */
  }
}
/* 年間行事予定セクション */
.event-schedule-section {
  padding: 2rem 1rem;
  max-width: 1100px;
  margin: 0 auto;
}

.event-section-title {
  font-size: 2rem;
  text-align: center;
  color: #8b5e3c;
  margin-bottom: 2rem;
  border-bottom: 3px solid #c5a57a;
  padding-bottom: 0.5rem;
}

.event-month {
  margin-bottom: 3rem;
}

.event-month-title {
  font-size: 1.5rem;
  color: #b45309;
  border-left: 6px solid #b45309;
  padding-left: 0.75rem;
  margin-bottom: 1rem;
}

.event-table-wrapper {
  overflow-x: auto;
}

.event-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
  background-color: #fff;
}

.event-table thead {
  background-color: #f5f5f5;
  border-bottom: 2px solid #bfa97f;
}

.event-table th,
.event-table td {
  padding: 0.75rem;
  border: 1px solid #ddd;
  vertical-align: top;
  text-align: left;
}

.event-table td:nth-child(1),
.event-table td:nth-child(2),
.event-table td:nth-child(3) {
  white-space: nowrap;
}

/* スマホ対応 */
@media screen and (max-width: 768px) {
  .event-section-title {
    font-size: 1.5rem;
  }

  .event-month-title {
    font-size: 1.2rem;
  }

  .event-table th,
  .event-table td {
    padding: 0.5rem;
    font-size: 0.85rem;
  }
}
/* ===========================
 * スマホ：テーブル→カード表示（実機でも確実に適用）
 * =========================== */
@media (max-width: 820px) {

  /* ヘッダーは非表示（カード内ラベルで代替） */
  .event-table thead { 
    display: none !important; 
  }

  /* ブロック化して 1行＝1カード */
  .event-table,
  .event-table tbody,
  .event-table tr,
  .event-table td {
    display: block !important;
    width: 100% !important;
  }

  .event-table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
    table-layout: auto !important; /* カード化時は固定不要 */
  }

  /* カード本体 */
  .event-table tr {
    background: #fff;
    border: 1px solid #ddd !important;
    border-radius: 10px;
    padding: .6rem .8rem;
    margin: 0 0 1rem 0;
    box-shadow: 0 1px 0 rgba(0,0,0,.03);
  }

  /* 既存のnowrapを解除して読みやすく */
  .event-table td {
    border: 0 !important;
    padding: .45rem 0 !important;
    font-size: .95rem;
    line-height: 1.6;
    display: flex !important;
    gap: .5rem;
    align-items: flex-start;
    white-space: normal !important;  /* ← ここが効かないと縦書き崩れます */
    word-break: break-word;
  }

  /* ラベル（列名）をCSSで付与：HTML変更不要 */
  .event-table td::before {
    flex: 0 0 7em;                 /* ラベル幅は6–8emで調整可 */
    color: #8b5e3c;
    font-weight: 600;
    display: inline-block;
    content: "";
  }
  .event-table td:nth-child(1)::before { content: "開催日"; }
  .event-table td:nth-child(2)::before { content: "行事"; }
  .event-table td:nth-child(3)::before { content: "開催場所"; }
  .event-table td:nth-child(4)::before { content: "ご参加いただける方"; }
  .event-table td:nth-child(5)::before { content: "事前申し込み"; }
  .event-table td:nth-child(6)::before { content: "行事内容"; }

  /* 区切り線（カード内の項目間） */
  .event-table td + td {
    border-top: 1px dashed #eee !important;
    padding-top: .6rem !important;
    margin-top: .2rem;
  }

  /* 先頭末尾の余白微調整 */
  .event-table td:first-child { padding-top: .2rem !important; }
  .event-table td:last-child  { padding-bottom: .2rem !important; }
}


/* ---------------------------------
 * ご供養・ご祈祷ページ
 * ---------------------------------*/
.ryukoin-kuyoukitou-hero {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  height: 25vh;
  background-image: url('https://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/07/a885acbb7d6d78229f7a8d1642c06b31.jpg');
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ryukoin-kuyoukitou-hero-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.35);
  z-index: 1;
}

.ryukoin-kuyoukitou-hero-title {
  position: relative;
  z-index: 2;
  font-size: 2.75rem;
  color: #fff;
  font-weight: bold;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
}
/* スマホ（画面幅767px以下）のとき */
@media (max-width: 767px) {
  h1.ryukoin-kuyoukitou-hero-title {
    font-size: 2.0rem; /* スマホ用に小さめのサイズ */
  }
}
/* ご供養・ご祈祷セクション全体の背景と余白 */
.ryukoin-kuyoukitou-section {
  background-color: #fdfcfb; /* 和紙のような落ち着いた背景色 */
  padding: 4rem 2rem;
  font-family: "Hiragino Mincho ProN", serif; /* 和風・落ち着きある書体 */
}


/* 各ブロック全体（見出し＋本文）のレイアウト */
.ryukoin-kuyoukitou-block {
  margin-bottom: 3rem;             /* 各項目の間隔を空ける */
  padding-left: 1rem;
}

/* 各項目の見出し（h2）デザイン */
.ryukoin-kuyoukitou-title {
  font-size: 1.5rem;
  color: #4b2e1d;      /* 落ち着いたこげ茶色 */
  margin-bottom: 1rem;
  font-weight: bold;
}

/* 各項目の本文テキスト */
.ryukoin-kuyoukitou-text {
  font-size: 1rem;
  line-height: 1.75;
  color: #3c3c3c;
}
/* 写真ギャラリーの全体レイアウト */
.ryukoin-event-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin-top: 2rem;
  justify-content: center;
}

/* 各イベントカードのスタイル */
.ryukoin-event-card {
  width: 280px;
  text-align: center;
}

/* イベント画像の装飾 */
.ryukoin-event-img {
  width: 100%;
  height: auto;
  border-radius: 0.75rem;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* 説明文（キャプション） */
.ryukoin-event-caption {
  margin-top: 0.5rem;
  font-size: 1rem;
  color: #333;
}
/* ご祈祷・ご供養セクションのスタイル */
.ryukoin-prayer-section {
  margin: 4rem auto;
  padding: 0;
  max-width: 960px;
}

/* タイトルのスタイル */
.ryukoin-prayer-title {
  font-size: 1.75rem;
  margin-bottom: 1.5rem;
  text-align: center;
  color: #5c4437;
  border-bottom: 2px solid #c8a87d;
  display: inline-block;
  padding-bottom: 0.3rem;
}

/* ご祈願表スタイル */
.ryukoin-prayer-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid #e6dccc;
}

.ryukoin-prayer-table th,
.ryukoin-prayer-table td {
  border: 1px solid #e6dccc;
  padding: 1rem;
  text-align: left;
  font-size: 1rem;
  vertical-align: top;
}

/* 項目名のスタイル */
.ryukoin-prayer-table th {
  background-color: #f4ede5;
  width: 30%;
  font-weight: 600;
  color: #4b392c;
}

/* 内容のスタイル */
.ryukoin-prayer-table td {
  background-color: #fffefc;
  color: #333;
}
.section-heading-horizontal {
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 0.75rem;
}

.ryukoin-kuyoukitou-title {
  font-size: 2.5rem !important; /* ← ここで大きさ調整 */
  font-weight: bold;
  color: #3b2c1d;
  margin-bottom: 0.25rem;
  position: relative;
  display: inline-block;
  padding-bottom: 0.6rem;
  line-height: 1.3; /* 行間の調整でより見やすく */
}

.ryukoin-kuyoukitou-title::after {
  content: "";
  display: block;
  height: 4px; /* アンダーラインの太さもやや強調 */
  width: 100%;
  margin-top: 4px;
  background: linear-gradient(to right, #92400e, #e3c7a6);
  border-radius: 2px;
}
/* ▼将門セクションの全体スタイル */
.ryukoin-masakado-section {
  padding: 4rem 1rem;
  background-color: #f9f6f1; /* 淡い和風背景色 */
  color: #3a2d1a; /* 濃茶色系フォント色 */
}

/* ▼テキスト部分の余白と行間調整 */
.ryukoin-masakado-text {
  font-size: 1.125rem;
  line-height: 2;
  margin-bottom: 2rem;
}
/* ▼画像グリッド共通設定：3列で整列 */
.ryukoin-image-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3列に整列 */
  gap: 1rem; /* 各画像の間の余白 */
}

/* ▼各画像のサイズを固定し、切り抜き表示で統一 */
.ryukoin-image-grid .image-item img {
  width: 100%;
  height: 200px; /* 高さを統一（適宜調整可能） */
  object-fit: cover; /* アスペクト比を保ちつつ中央で切り抜き */
  border-radius: 0.5rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  transition: transform 0.3s ease;
}

/* ▼ホバー時に拡大 */
.ryukoin-image-grid .image-item img:hover {
  transform: scale(1.05);
}
/* ---------------------------------
 * 弘誓院についてページ（ヒーロー）
 * ---------------------------------*/
.guzeiin-about-hero {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  height: 25vh;
  min-height: 133px;
  background-image: url('https://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/08/6e61064001c3f470a47c1c26e650ddff.png');
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.guzeiin-about-hero-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 1;
}
.guzeiin-about-hero-content {
  position: relative;
  z-index: 2;
  text-align: center;
  color: #fff;
  padding: 1rem;
}
.guzeiin-about-hero-title {
  font-size: 2.5rem;
  font-weight: bold;
  color: #fff !important;
  text-shadow: 1px 1px 3px rgba(0,0,0,0.6);
}

/* ---------------------------------
 * 歴史セクション（本文のみ＋後半全幅）
 * ---------------------------------*/
.guzeiin-history-layout {
  background-color: #fff;
  padding: 4rem 1rem;
  font-family: 'Noto Serif JP', serif;
}

/* Gridに一本化（左列の画像ブロックは削除済みなので2列前提にしない） */
.guzeiin-history-inner {
  display: grid;
  grid-template-columns: 1fr;   /* 現状は1カラムのみ */
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto;
  align-items: start;
}

.guzeiin-history-text {
  color: #3b2c1d;
  line-height: 1.8;
}

/* 後半テキストを全幅に */
.guzeiin-history-wide { grid-column: 1 / -1; }

/* 汎用コンテナ・見出し・表 */
.guzeiin-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 1rem;
}
.guzeiin-subtitle {
  font-size: 1.75rem;
  font-weight: bold;
  color: #3b2c1d;
  margin-bottom: 1rem;
  border-bottom: 2px solid #e3c7a6;
  display: inline-block;
}
.guzeiin-honzon-table-section {
  margin-top: 2rem;
  padding: 1rem;
}
.guzeiin-honzon-table {
  width: 100%;
  border-collapse: collapse;
  background-color: #fffdf9;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.guzeiin-honzon-table th,
.guzeiin-honzon-table td {
  padding: 1rem;
  border: 1px solid #dcd2c0;
  vertical-align: top;
  text-align: left;
  font-size: 1rem;
}
.guzeiin-honzon-table th {
  width: 120px;
  background-color: #f5efe7;
  font-weight: bold;
  color: #5c4834;
}

/* ---------------------------------
 * 説明直下のカード型ギャラリー（3→2→1列）
 * ---------------------------------*/
.guzeiin-photo-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  margin: 1rem 0 2rem;
}
.photo-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 3px 12px rgba(0,0,0,.08);
  margin: 0;
}
.photo-card img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;   /* 比率を統一。不要なら削除 */
  object-fit: cover;
}
.photo-card figcaption {
  text-align: center;
  font-size: .9rem;
  color: #6b6b6b;
  padding: .5rem .75rem .75rem;
}
@media (hover:hover) {
  .photo-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0,0,0,.10);
  }
}

/* ---------------------------------
 * レスポンシブ
 * ---------------------------------*/
@media (max-width: 1024px) {
  .guzeiin-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .guzeiin-history-inner { grid-template-columns: 1fr; } /* 将来2列に戻しても潰せる */
}
@media (max-width: 768px) {
  .guzeiin-about-hero-title {
    font-size: 1.75rem;
    padding: 0 1rem;
  }
  .guzeiin-honzon-table th,
  .guzeiin-honzon-table td {
    font-size: 0.95rem;
    padding: 0.75rem;
  }
}
@media (max-width: 640px) {
  .guzeiin-photo-grid { grid-template-columns: 1fr; }
}

/* ───────────────────────────────
   お知らせ一覧ページ
─────────────────────────────── */

/* 一覧全体のラップ */
.ryukoin-news-archive {
  display: grid;
  gap: 2rem;
  margin: 2rem auto;
  max-width: 960px;
  padding: 1rem;
}

/* ▼ 1件ずつのカード全体（リンク化のため<a>に適用される想定） */
.ryukoin-news-card {
  display: flex;
  flex-wrap: wrap;
  background: #fffdf8;
  border: 1px solid #e4d5c3;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s ease;
  text-decoration: none; /* 下線削除 */
  color: inherit;         /* 親要素の文字色を継承 */
}

/* ホバー時の拡大効果 */
.ryukoin-news-card:hover {
  transform: scale(1.01);
  background-color: #fdf6ee; /* 軽い背景変化で視認性アップ（任意） */
}

/* ▼ アイキャッチ画像（左側） */
.ryukoin-news-thumbnail {
  width: 30%;
  min-width: 150px;
  background-color: #f1ebe2;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ryukoin-news-thumbnail img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* ▼ 画像がない場合のスタイル */
.ryukoin-news-noimage {
  font-size: 0.85rem;
  color: #7a6c5d;
  text-align: center;
  padding: 2rem;
}

/* ▼ テキスト部（右側） */
.ryukoin-news-content {
  width: 70%;
  padding: 1rem;
  box-sizing: border-box;
}

/* ▼ 日付やカテゴリなどのメタ情報 */
.ryukoin-news-meta {
  font-size: 0.9rem;
  color: #a28b6e;
  margin-bottom: 0.25rem;
}

/* ▼ タイトル部分 */
.ryukoin-news-title {
  display: block;
  font-size: 1.25rem;
  font-weight: bold;
  color: #3b2c1d;
  text-decoration: none;
  margin-bottom: 0.25em;
}

/* ▼ タイトル内リンクの下線を削除し、ホバー時のみ装飾 */
.ryukoin-news-title a {
  text-decoration: none !important;
  color: inherit;
}
.ryukoin-news-title a:hover {
  text-decoration: underline;
}

/* ▼ 抜粋（要約文） */
.ryukoin-news-excerpt {
  font-size: 1rem;
  line-height: 1.5;
  color: #3d2d1f;
  margin-top: 0.5rem;
}

.ryukoin-news-intro {
  max-width: 800px;
  margin: 2em auto;
  padding: 1.5em 2em;
  border-top: 2px solid #d8b28c;     /* 上罫線 */
  border-bottom: 2px solid #d8b28c;  /* 下罫線 */
  font-size: 1.05rem;
  line-height: 1.9;
  color: #444;
  position: relative;
  background: #fffefc;               /* 淡い背景 */
}

/* 左上に和風アイコンを配置 */
.ryukoin-news-intro::before {
  content: "❀";                      /* ← 桜マーク（他に「✿」「♨」「卍」なども可） */
  position: absolute;
  top: -0.9em;
  left: 1em;
  background: #fffefc;
  padding: 0 0.4em;
  font-size: 1.1rem;
  color: #7b3e1d;                     /* 落ち着いた赤茶 */
  font-weight: bold;
  letter-spacing: 0.2em;              /* 縦書きっぽい間隔 */
}
/* -----------------------------------
 * お知らせ投稿テンプレート用スタイル
 * クラス名: news-post-template
 * ----------------------------------- */

/* 背景全体 */
.news-post-background {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  background-image: url("http://www.iwaisan-ryukouin.jp/wp-content/uploads/2025/07/b5713e82615c1b0e61e7965d90bbbf9f.png");
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  padding: 5rem 1rem;
}

/* 投稿コンテナ中央寄せ */
.news-post-container {
  max-width: 960px;
  margin: 0 auto;
}

/* 本文ボックス */
.news-post-template {
  background-color: rgba(255, 255, 255, 0.85); /* 半透明白背景 */
  border-radius: 12px;
  padding: 2.5rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  color: #3b2c1d;
  text-align: left;
}



/* 本文段落 */
.news-post-body p {
  margin-bottom: 1.25rem;
  text-indent: 1.5em;
  line-height: 1.9;
}

/* モバイル対応 */
@media (max-width: 768px) {
  .news-post-template {
    padding: 1.5rem;
  }

  .news-post-title {
    font-size: 1.5rem;
  }
}

/* メタ情報全体 */
.news-post-meta {
  font-size: 0.95rem;
  color: #6e5e4b;
  margin-bottom: 1.5rem;
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: center;
}

/* カテゴリ名 */
.news-post-category {
  background-color: #e8ddd3;
  color: #5c4028;
  padding: 0.2rem 0.6rem;
  border-radius: 4px;
  font-weight: bold;
}

/* 投稿日 */
.news-post-date {
  color: #8a7662;
}
/* ▼ 非表示を確実にする強力なセレクタ */
.ryukoin-news-card .ryukoin-news-thumbnail.ryukoin-news-noimage {
  display: none !important;
}

/* ▼ スマホ表示最適化：1件ごとのカード（.ryukoin-news-archive）を横幅いっぱいに */
@media (max-width: 768px) {
  /* 投稿1件分の外枠 */
  .ryukoin-news-archive {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1rem;
    padding-right: 1rem;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }

  /* 各パーツの横幅制限解除と整形 */
  .ryukoin-news-archive-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1rem;
    padding-right: 1rem;
    box-sizing: border-box;
  }

  .ryukoin-news-card,
  .ryukoin-news-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1rem;
    padding-right: 1rem;
    box-sizing: border-box;
  }

  .ryukoin-news-title {
    display: block !important;
    width: 100%;
    font-size: 1.15rem;
    line-height: 1.6;
    word-break: break-word;
    white-space: normal;
    text-align: left;
    margin-bottom: 0.5rem;
    box-sizing: border-box;
  }
}
/* ▼ お知らせ一覧ページ（archive-news）限定でスマホ幅をフル活用 */
@media (max-width: 768px) {
  body.post-type-archive-news .entry-content,
  body.post-type-archive-news .content,
  body.post-type-archive-news .article,
  body.post-type-archive-news .container {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;
  }

  body.post-type-archive-news .ryukoin-news-archive-wrapper,
  body.post-type-archive-news .ryukoin-news-archive,
  body.post-type-archive-news .ryukoin-news-card,
  body.post-type-archive-news .ryukoin-news-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 1rem;
    padding-right: 1rem;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }

  body.post-type-archive-news .ryukoin-news-title {
    display: block !important;
    width: 100%;
    font-size: 1.15rem;
    line-height: 1.6;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
    text-align: left;
    margin-bottom: 0.5rem;
    box-sizing: border-box;
  }
}

/* ───────────────────────────────
   プライバシーポリシー
─────────────────────────────── */
/* プライバシーポリシー全体の表示幅を制御（中央寄せ＋最大幅） */
.temple-privacy-policy {
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  padding: 0 1em; /* スマホ表示で左右に余白を持たせる */
  margin: 0 auto; /* 中央寄せ */
}

/* テーブル全体の横スクロール抑制と可読性強化 */
.temple-privacy-policy table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  word-break: break-word;
  overflow-x: auto;
  display: block;  /* ブロック化してスクロール制御を有効に */
}

/* テーブルセルの調整 */
.temple-privacy-policy th,
.temple-privacy-policy td {
  padding: 1em;
  border-bottom: 1px solid #eae4d4;
  vertical-align: top;
  text-align: left;
}

/* 見出しセル（th）の強調 */
.temple-privacy-policy th {
  background-color: #f7f3e9;
  font-weight: bold;
  width: 30%;
}

/* タイトル h1 スタイル */
.temple-privacy-policy h1 {
  font-size: 1.8em;
  margin-bottom: 1em;
  border-bottom: 2px solid #dcd3bc;
  padding-bottom: 0.3em;
  word-break: break-word;
}