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

/* ==========================================
   圓光寺 カスタムデザイン
   コンセプト：釈迦から親鸞へ――自分で考えたい人のためのお寺
   宗派：浄土真宗本願寺派（大阪市天王寺区玉造）
   ========================================== */

:root {
  --ej-green-dark:  #2B5329;
  --ej-green-mid:   #3D6E38;
  --ej-green-pale:  #EEF4ED;
  --ej-gold:        #9B7B2C;
  --ej-white:       #FAFAF8;
  --ej-text:        #2C2C2C;
  --ej-text-sub:    #5C5C5C;
  --ej-border:      #C8DCC6;
}

/* ===== ベース ===== */
body {
  background-color: var(--ej-white) !important;
  color: var(--ej-text) !important;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HGS明朝E", serif !important;
  line-height: 1.95 !important;
}

/* ===== ヘッダー ===== */
#header {
  background-color: #ffffff !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

#header-container {
  background-color: #ffffff !important;
  border-bottom: 3px solid var(--ej-green-dark) !important;
}

#site-name a,
#site-name-text {
  color: var(--ej-green-dark) !important;
  letter-spacing: 0.14em !important;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", serif !important;
}

/* ---- キャッチコピー ---- */
.enkouji-catchcopy {
  display: block;
  width: 100%;
  text-align: center;
  margin: 2px 0 10px;
  padding: 0;
  font-size: 0.9rem;
  color: var(--ej-text-sub);
  letter-spacing: 0.22em;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", serif;
  font-style: normal;
  line-height: 1.6;
}

/* ===== ナビゲーション ===== */
#navi {
  background-color: var(--ej-green-dark) !important;
}

#navi .navi-in > ul > li > a {
  color: #ffffff !important;
  letter-spacing: 0.1em !important;
  font-size: 0.88rem !important;
  font-family: "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN", sans-serif !important;
  padding: 14px 18px !important;
}

#navi .navi-in > ul > li > a:hover,
#navi .navi-in > ul > li.current-menu-item > a {
  background-color: var(--ej-green-mid) !important;
  color: #ffffff !important;
}

/* ハンバーガーアイコン */
.navi-toggle-label {
  color: #ffffff !important;
}

/* ===== 記事見出し ===== */
.article h1.entry-title {
  color: var(--ej-green-dark) !important;
  border-bottom: 2px solid var(--ej-green-dark) !important;
  padding-bottom: 0.4em !important;
  letter-spacing: 0.1em !important;
}

.article h2 {
  color: var(--ej-green-dark) !important;
  background-color: var(--ej-green-pale) !important;
  border-left: 5px solid var(--ej-green-dark) !important;
  border-bottom: 1px solid var(--ej-border) !important;
  border-top: none !important;
  padding: 10px 16px !important;
  letter-spacing: 0.08em !important;
}

.article h3 {
  color: var(--ej-green-dark) !important;
  border-left: 4px solid var(--ej-green-dark) !important;
  border-bottom: 1px solid var(--ej-green-pale) !important;
  background: none !important;
  padding: 6px 12px !important;
  letter-spacing: 0.06em !important;
}

.article h4 {
  color: var(--ej-green-dark) !important;
  border-bottom: 1px dotted var(--ej-border) !important;
  padding-bottom: 4px !important;
  background: none !important;
}

/* ===== リンク ===== */
a {
  color: var(--ej-green-dark) !important;
  text-decoration: none !important;
}
a:hover {
  color: var(--ej-green-mid) !important;
  text-decoration: underline !important;
}

/* ===== ボタン ===== */
.btn,
.cocoon-block-button__link,
.wp-block-button__link {
  background-color: var(--ej-green-dark) !important;
  border-color: var(--ej-green-dark) !important;
  color: #ffffff !important;
  border-radius: 3px !important;
  letter-spacing: 0.1em !important;
}
.btn:hover,
.cocoon-block-button__link:hover,
.wp-block-button__link:hover {
  background-color: var(--ej-green-mid) !important;
  border-color: var(--ej-green-mid) !important;
}

/* ===== カード・記事一覧 ===== */
.card-title a {
  color: var(--ej-green-dark) !important;
}
.a-wrap:hover {
  border-color: var(--ej-green-dark) !important;
  box-shadow: 0 2px 8px rgba(43,83,41,0.15) !important;
}

/* ===== サイドバー ===== */
.widget-title,
.wp-block-heading {
  color: var(--ej-green-dark) !important;
  border-left: 5px solid var(--ej-green-dark) !important;
  border-bottom: 1px solid var(--ej-green-pale) !important;
  padding: 6px 10px !important;
  background: none !important;
}

/* ===== フッター ===== */
#footer {
  background-color: var(--ej-green-dark) !important;
  color: #d4e4d2 !important;
  border-top: 4px solid var(--ej-gold) !important;
}
#footer a {
  color: #aeccab !important;
}
#footer a:hover {
  color: #ffffff !important;
}
.footer-bottom,
#copyright {
  background-color: #1e3c1d !important;
  color: #8aaa88 !important;
}

/* ===== テーブル ===== */
.article table th {
  background-color: var(--ej-green-pale) !important;
  color: var(--ej-green-dark) !important;
  border-color: var(--ej-border) !important;
}
.article table td {
  border-color: var(--ej-border) !important;
}

/* ===== 区切り線 ===== */
.article hr {
  border-color: var(--ej-border) !important;
}

/* ===== パンくず ===== */
#breadcrumb {
  background: var(--ej-green-pale) !important;
  border-bottom: 1px solid var(--ej-border) !important;
}
#breadcrumb a {
  color: var(--ej-green-dark) !important;
}

/* ===== ページネーション ===== */
.page-numbers.current {
  background-color: var(--ej-green-dark) !important;
  color: #ffffff !important;
}
.page-numbers:hover {
  background-color: var(--ej-green-pale) !important;
  color: var(--ej-green-dark) !important;
}

/* ==========================================
   レスポンシブ
   ========================================== */
@media screen and (max-width: 1023px) {
  .enkouji-catchcopy {
    font-size: 0.82rem;
    letter-spacing: 0.12em;
  }
}

@media screen and (max-width: 834px) {
  .enkouji-catchcopy {
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    margin-bottom: 8px;
  }
}

@media screen and (max-width: 480px) {
  .enkouji-catchcopy {
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
  }
}
/* ==========================================
   圓光寺 ホームページ専用スタイル
   ========================================== */

/* ===== ファーストビュー ===== */
.enkouji-fv .wp-block-cover__inner-container {
  max-width: 700px;
  margin: 0 auto;
  padding: 0 24px;
}

/* FV ボタン調整 */
.enkouji-btn-ghost .wp-block-button__link,
.enkouji-btn-ghost .wp-block-button__link:hover {
  background: transparent !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.55) !important;
}
.enkouji-btn-gold .wp-block-button__link,
.enkouji-btn-gold .wp-block-button__link:hover {
  background: #9B7B2C !important;
  border-color: #9B7B2C !important;
  color: #ffffff !important;
}

/* ===== サービスカード ホバー ===== */
.enkouji-service-card:hover {
  box-shadow: 0 4px 20px rgba(43,83,41,0.12) !important;
  transform: translateY(-2px);
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}

/* ===== セクション見出し h2 上書き（ホームページ内のカスタムh2） ===== */
.enkouji-section-header h2 {
  border-left: none !important;
  background: none !important;
  border-bottom: none !important;
  padding: 0 !important;
  font-size: 1.7rem !important;
  letter-spacing: 0.15em !important;
  font-weight: normal !important;
}

/* ===== 仏教を学ぶ バナー内のブロック ===== */
.enkouji-fv h1.wp-block-heading,
.wp-block-cover h1.wp-block-heading,
.wp-block-cover h2.wp-block-heading {
  border: none !important;
  background: none !important;
  padding: 0 !important;
  border-left: none !important;
}

/* Cover ブロック内の wp-block-heading 上書き */
.wp-block-cover .wp-block-heading {
  border: none !important;
  background: none !important;
  padding: 0 !important;
  border-left: none !important;
  color: inherit !important;
}

/* ===== クエリーループ（記事カード）===== */
.wp-block-post-template {
  gap: 24px !important;
}
.wp-block-post-title a {
  color: #2B5329 !important;
  text-decoration: none !important;
  font-family: "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", serif !important;
}
.wp-block-post-title a:hover {
  text-decoration: underline !important;
}
.wp-block-post-date time {
  color: #9B7B2C !important;
}

/* ===== アクセスセクション table 上書き ===== */
.enkouji-access-table table,
.enkouji-access-table th,
.enkouji-access-table td {
  border: none !important;
  background: none !important;
}

/* ===== フッターへの余白 ===== */
#footer {
  margin-top: 0 !important;
}

/* ===== 全幅レイアウト（サイドバー非表示）===== */
.page-id-26 #sidebar,
.page-id-26 .sidebar {
  display: none !important;
}
.page-id-26 #content-area,
.page-id-26 .content-wrap,
.page-id-26 #main {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}
.page-id-26 .entry-content {
  max-width: 100% !important;
}

/* アライン full の幅を画面幅いっぱいに */
.page-id-26 .alignfull {
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  width: 100vw !important;
  max-width: 100vw !important;
}

/* ===== レスポンシブ ===== */
@media screen and (max-width: 768px) {
  .enkouji-fv h1.wp-block-heading {
    font-size: 2.8rem !important;
  }
  .enkouji-fv .wp-block-cover__inner-container {
    padding: 0 20px;
  }
  /* 仏教を学ぶ フロー */
  .enkouji-fv .wp-block-cover__inner-container div[style*="display:flex"] {
    flex-direction: column !important;
    gap: 8px !important;
  }
}

@media screen and (max-width: 480px) {
  .enkouji-fv h1.wp-block-heading {
    font-size: 2.4rem !important;
    letter-spacing: 0.2em !important;
  }
}

/* ==========================================
   ヘッダー改善 & フロントページ最適化
   2026-04-24 追加
   ========================================== */

/* ----- ヘッダー：ダークグリーン背景 ----- */
#header-container {
  background: linear-gradient(160deg, #1a3319 0%, #2B5329 100%) !important;
  border-bottom: 2px solid #9B7B2C !important;
  box-shadow: 0 2px 16px rgba(0,0,0,0.22) !important;
}
#header {
  background: transparent !important;
}
.tagline {
  color: rgba(255,255,255,0.5) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.22em !important;
}
.site-name-text-link,
.site-name-text-link:visited {
  color: #ffffff !important;
}
.site-name-text {
  color: #ffffff !important;
  font-size: clamp(1.9rem, 4vw, 2.5rem) !important;
  text-shadow: 0 1px 6px rgba(0,0,0,0.3) !important;
}
.enkouji-catchcopy {
  color: rgba(255,255,255,0.75) !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.18em !important;
  margin-bottom: 6px !important;
}
/* 電話番号をヘッダー内に表示 */
#header-in::after {
  content: '☎  06-6761-8293　｜　大阪市天王寺区玉造本町' !important;
  display: block !important;
  color: rgba(255,255,255,0.6) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.1em !important;
  font-family: 游ゴシック,Yu Gothic,sans-serif !important;
  text-align: center !important;
  margin-top: 2px !important;
  padding-bottom: 8px !important;
}

/* ----- ナビ：クリックしやすく大きく ----- */
#navi .navi-in > ul > li > a {
  font-size: 0.92rem !important;
  padding: 16px 22px !important;
  letter-spacing: 0.12em !important;
}

/* ----- フロントページ：ページタイトル・SNS非表示 ----- */
.front-top-page .article-header.entry-header,
.front-top-page .sns-share-buttons,
.front-top-page .share-buttons-wrap {
  display: none !important;
}
.front-top-page #main .article {
  padding: 0 !important;
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
  margin: 0 !important;
}
.front-top-page .entry-content.cf {
  padding: 0 !important;
  margin: 0 !important;
}
.front-top-page #breadcrumb {
  display: none !important;
}

/* スマホ：電話番号非表示 */
@media screen and (max-width: 768px) {
  #header-in::after {
    font-size: 0.68rem !important;
    content: '☎  06-6761-8293' !important;
  }
}

/* ===== フロントページの目次(TOC)を非表示 ===== */
.front-top-page .toc,
.front-top-page .ez-toc-container {
  display: none !important;
}

/* ==========================================
   トップページ Jimdo風レイアウト
   ========================================== */

/* ===== 2カラム：左ナビ + 右写真 ===== */
.ej-top-layout {
  background: #fff !important;
}

.ej-top-columns {
  align-items: stretch !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
}

/* 左ナビ列 */
.ej-left-nav {
  background-color: #f5f5f0 !important;
  border-right: 1px solid #d0d0c8 !important;
  padding: 0 !important;
  min-width: 180px !important;
  max-width: 220px !important;
  flex-shrink: 0 !important;
}

.ej-nav-inner {
  padding: 1.2em 0.8em !important;
}

/* サイトタイトル（ナビ上部） */
.ej-nav-site-title {
  font-size: 0.75rem !important;
  color: #555 !important;
  line-height: 1.5 !important;
  margin-bottom: 0.8em !important;
  font-family: "游明朝", "Yu Mincho", serif !important;
  word-break: keep-all !important;
}

/* 区切り線 */
.ej-nav-sep {
  margin: 0.5em 0 0.8em !important;
  border-color: #c8c8c0 !important;
}

/* ナビリスト */
.ej-nav-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ej-nav-list li {
  border-bottom: 1px solid #e0e0d8 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ej-nav-list li a {
  display: block !important;
  padding: 0.55em 0.4em !important;
  font-size: 0.85rem !important;
  color: #2B5329 !important;
  text-decoration: none !important;
  font-family: "游ゴシック", "Yu Gothic", sans-serif !important;
  line-height: 1.4 !important;
  transition: background 0.15s ease !important;
}

.ej-nav-list li a:hover {
  background-color: #e8ede8 !important;
  color: #1a3319 !important;
  text-decoration: none !important;
}

/* 右写真列 */
.ej-right-photo {
  flex: 1 1 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.ej-main-photo {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
}

.ej-main-photo img {
  width: 100% !important;
  height: 400px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  margin: 0 !important;
}

/* ===== 寺紋 + 寺名セクション ===== */
.ej-temple-title-section {
  background: #fafaf8 !important;
  border-bottom: 1px solid #ddd !important;
}

.ej-crest-columns {
  max-width: 500px !important;
  margin: 0 auto !important;
}

.ej-crest-img img {
  border-radius: 0 !important;
}

.ej-temple-name {
  color: #2B5329 !important;
  letter-spacing: 0.12em !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

/* ===== スマホ対応 ===== */
@media screen and (max-width: 768px) {
  .ej-top-columns {
    flex-direction: column !important;
  }

  .ej-left-nav {
    max-width: 100% !important;
    border-right: none !important;
    border-bottom: 2px solid #2B5329 !important;
  }

  .ej-nav-list {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  .ej-nav-list li {
    border-bottom: none !important;
    border-right: 1px solid #e0e0d8 !important;
  }

  .ej-nav-list li a {
    padding: 0.4em 0.6em !important;
    font-size: 0.8rem !important;
  }

  .ej-main-photo img {
    height: 250px !important;
  }
}

/* ==========================================
   ② 上部ナビゲーションバーを非表示
   ========================================== */
#navi,
#navi-menu-1,
.navi-in,
.global-nav {
  display: none !important;
}

/* ==========================================
   ③ 戻るボタン
   ========================================== */
.ej-back-btn {
  margin: 2.5em 0 1em;
  padding: 0;
}
.ej-back-btn a {
  display: inline-block;
  padding: 0.55em 1.2em;
  background: #fff !important;
  color: #2B5329 !important;
  border: 2px solid #2B5329 !important;
  border-radius: 4px;
  font-size: 0.88rem;
  text-decoration: none !important;
  font-family: "游ゴシック", "Yu Gothic", sans-serif;
  letter-spacing: 0.06em;
  transition: background 0.18s, color 0.18s;
}
.ej-back-btn a:hover {
  background: #2B5329 !important;
  color: #fff !important;
}
.ej-archive-back {
  text-align: center;
  margin: 3em auto;
}

/* ==========================================
   ④ パンくずリストを全ページに表示
   ========================================== */
#breadcrumb {
  display: block !important;
  background: var(--ej-green-pale, #EEF4ED) !important;
  border-bottom: 1px solid #C8DCC6 !important;
  padding: 6px 16px !important;
  font-size: 0.8rem !important;
}
#breadcrumb a {
  color: #2B5329 !important;
}
/* フロントページのパンくずは非表示のまま */
.front-top-page #breadcrumb {
  display: none !important;
}

/* ==========================================
   ⑤ 寺報 PDF ダウンロードボタン
   ========================================== */
.ej-pdf-list {
  margin-top: 1em;
}
.ej-pdf-list h3 {
  color: #2B5329 !important;
  border-left: 4px solid #2B5329 !important;
  padding: 4px 10px !important;
  background: #EEF4ED !important;
  font-size: 1rem !important;
  margin: 1.5em 0 0.6em !important;
}
.ej-pdf-btn .wp-block-button__link {
  background-color: #2B5329 !important;
  border-color: #2B5329 !important;
  color: #fff !important;
  font-size: 0.9rem !important;
  padding: 0.6em 1.4em !important;
  border-radius: 4px !important;
  letter-spacing: 0.04em !important;
  margin-bottom: 0.5em !important;
}
.ej-pdf-btn .wp-block-button__link:hover {
  background-color: #3D6E38 !important;
}
.wp-block-buttons {
  flex-direction: column !important;
  align-items: flex-start !important;
}

/* ==========================================
   ⑥ SNSシェア・フォローアイコンを全体非表示
   ========================================== */
.sns-share-buttons,
.sns-follow-buttons,
.share-buttons-wrap,
.follow-buttons-wrap,
.sns-buttons,
.sns-share,
.sns-follow,
.st-sns-buttons,
[class*="sns-"],
[class*="share-button"],
[class*="follow-button"],
.twitter-share-button,
.facebook-share-button,
.line-share-button {
  display: none !important;
}

/* ==========================================
   Contact Form 7 スタイル
   ========================================== */
.wpcf7 {
  background: #fafaf8;
  border: 1px solid #C8DCC6;
  border-radius: 6px;
  padding: 1.5em 2em;
  margin: 1.5em 0;
}
.wpcf7 label {
  display: block;
  margin-bottom: 0.3em;
  font-size: 0.9rem;
  color: #2C2C2C;
  font-weight: bold;
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  width: 100%;
  padding: 0.5em 0.7em;
  border: 1px solid #C8DCC6;
  border-radius: 4px;
  font-size: 0.95rem;
  margin-bottom: 1em;
  font-family: inherit;
  box-sizing: border-box;
}
.wpcf7 textarea {
  height: 140px;
  resize: vertical;
}
.wpcf7 input[type="submit"] {
  background: #2B5329 !important;
  color: #fff !important;
  border: none !important;
  padding: 0.7em 2em !important;
  border-radius: 4px !important;
  font-size: 1rem !important;
  cursor: pointer !important;
  letter-spacing: 0.1em !important;
}
.wpcf7 input[type="submit"]:hover {
  background: #3D6E38 !important;
}
.wpcf7-response-output {
  padding: 0.6em 1em !important;
  margin-top: 1em !important;
  border-radius: 4px !important;
}

/* ==========================================
   ③ ページトップへ戻るボタン
   ========================================== */
.ej-page-top-btn a {
  display: inline-block;
  padding: 0.6em 1.8em;
  background: #2B5329 !important;
  color: #fff !important;
  border-radius: 4px;
  font-size: 0.88rem;
  text-decoration: none !important;
  letter-spacing: 0.1em;
  margin-top: 1.5em;
  transition: background 0.18s;
}
.ej-page-top-btn a:hover {
  background: #3D6E38 !important;
}

/* ⑤ ブログ一覧の戻るボタン（フッター経由なのでフッター上に表示） */
.ej-blog-top-back {
  position: relative;
  z-index: 10;
  padding-bottom: 1em;
}

/* ==========================================
   ① トップページメイン画像 object-position を top に修正
   ========================================== */
.ej-main-photo img {
  height: 520px !important;
  object-position: top center !important;
}

/* ==========================================
   納骨堂ページ 統一デザイン
   ========================================== */
.ej-noko-section {
  margin-bottom: 0.5em;
}
.ej-noko-heading {
  color: #2B5329 !important;
  border-left: 5px solid #2B5329 !important;
  padding: 0.3em 0.7em !important;
  background: #EEF4ED !important;
  margin-bottom: 1em !important;
  font-size: 1.15rem !important;
}
/* 画像を同じ高さに揃える */
.ej-noko-columns .wp-block-column figure.ej-noko-img img {
  width: 100% !important;
  height: 220px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block;
}
.ej-noko-caption {
  font-size: 0.85rem !important;
  color: #555 !important;
  margin-top: 0.3em !important;
  margin-bottom: 0.8em !important;
}