/*
Theme Name: Lightning Child
Template:   lightning
Description: Lightningの子テーマです
*/

/* ここから下に、現在「追加CSS」に書いているコードを貼り付けてもOKです */
/* グローバルナビゲーションを明朝体にする */
.global-nav-name{
    font-family: 'Noto Serif JP', serif !important;
    font-size: 14px !important; 
}
.sub_menu_p{/* グローバルプルダウンメニュー文字サイズ変更 */
	font-size:14px !important; 
	letter-spacing:0.02em;
}
/* PC版：プルダウンメニューの最後の項目の下線を消す */
.global-nav .sub-menu li:last-child,
.global-nav .sub-menu li:last-child a {
    border-bottom: none !important;
}


/* SP版：開いた時の子メニュー（アコーディオンの中身）に色をつける */
    .vk-mobile-nav .sub-menu {
        background-color: #f0ebf5 !important; /* 親より少し濃い色にして段差を強調 */
    }
/* 見出し（明朝） */
h1, h2, h3, h4, h5 {
    font-family: 'Noto Serif JP', serif !important;
    font-weight: 300 !important;
}
/* アコーディオンタイトル */
.wp-block-accordion-heading__toggle-title{
    font-size: 0.8rem;
    font-family: 'Noto Sans JP', sans-serif !important;
    font-weight:bold;
}
/* 「.serif-accent」がついた要素の中の文字を強制的に変更する */
.serif-accent,
.serif-accent * {
 font-family: 'Noto Serif JP', serif !important;
 /*font-weight: 300 !important;  見出しは少し太めに */
}
/* 記事本文の右端をキレイに揃える */
p {
    text-align: justify;            /* 両端揃えを有効にする */
    text-justify: inter-character;  /* 日本語の文字間隔を調整して隙間を埋める（重要） */
    word-break: break-all;          /* 長い英単語などで端が崩れるのを防ぐ */
}
.vk_button_link_txt{
    font-size: 0.8rem;
    font-family: 'Noto Sans JP', sans-serif !important;
}



/*::::::::::::::::::::::::::::::::::::::::::::::::::::::ヘッダーエリア::::::::::::::*/
/* サイトヘッダー50%の白 */
#site-header{
	background-color: rgba(255, 255, 255, 0.8); /* 80%の白 */
}

/* ハンバーガーメニューを右に移動 */
.vk-mobile-nav-menu-btn {
	left:auto;
	right:13px; /*右端からの位置*/
    top:13px; /*上からの位置*/
}
/* PC用：グローバルナビ右端のボタン化 */
@media (min-width: 992px) {
    /* 右端のリスト項目（li）の余白調整 */
    .g_nav_contact {
        display: flex;
        align-items: center; /* 上下中央に配置 */
        margin-left: 15px;    /* 隣のメニューとの間隔 */
    }

 /* 右端のリンク（a）をボタンデザインにする */
    .g_nav_contact a {
        background-color: #63308d !important; /* ★好きな背景色に変更してください */
        color: #fff !important;              /* 文字色は白 */
        padding: 10px 25px !important;       /* ボタン内の余白（上下 左右） */
        border-radius: 30px;                  /* 角の丸み */
        line-height: 1 !important;           /* 行間を詰めて中央寄せ */
        transition: 0.3s;                    /* ホバー時の動きを滑らかに */
        height: auto !important;             /* 標準の高さを上書き */
        font-size: 14px !important; 
    }

    /* ホバー時（マウスを乗せた時）の色の変化 */
    .g_nav_contact a:hover {
        background-color: #63308d !important; /* ★ホバー時の少し濃い色 */
        text-decoration: none !important;
        opacity: 0.9;
    }

    /* 英語のサブテキストを非表示にする（ボタンをスッキリさせる場合） */
    .g_nav_contact a .global-nav-name-english {
        display: none !important;
    }
}

/* 教行寺PC用：シンプルホバー（不透明度） */
@media (min-width: 992px) {
    .global-nav-list li a {
        transition: 0.3s; /* 変化を滑らかにする */
    }

    .global-nav-list li a:hover {
        opacity: 0.5; /* 50%の濃さにする */
        text-decoration: none !important;
    }
}
/* PC用：プルダウンメニューの三角チョボ（中央配置） */
@media (min-width: 992px) {
    /* サブメニュー全体の枠の設定 */
    .global-nav-list .sub-menu {
        overflow: visible !important;
        margin-top: 5px !important; /* 親メニューとの隙間 */
        border-radius: 4px;           /* お好みで角を少し丸く */
    }

    /* 三角チョボ本体 */
    .global-nav-list .sub-menu::before {
        content: "";
        position: absolute;
        top: -5px;    /* 三角の高さ分、上に配置 */
        
        /* --- 中央配置のための記述 --- */
        left: 50%; 
        transform: translateX(-50%); 
        /* -------------------------- */
        
        border-left: 10px solid transparent;  /* 三角の横幅を少し大きく調整 */
        border-right: 10px solid transparent; /* 三角の横幅を少し大きく調整 */
        border-bottom: 10px solid #63308d;      /* ★サブメニューの背景色と合わせてください */
        display: block;
        z-index: 10;
}
}
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::ヘッダーエリア::::::::各ページヒーロー画像指示::::::::::::::*/
/* ページヘッダーのタイトル色を変更 */
.page-header .page-header-title {
    color: #ffffff !important; /* 白にする場合。黒なら #333333 */
    text-shadow: 0 2px 4px rgba(0,0,0,0.5); /* 文字に影をつけて読みやすくする */
}

/* ヒーロー画像下紫グラデーション背景に画像を指定する::全ページ共通 */
.breadcrumb {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/02/haikei02-scaled.png') !important;
    background-size: cover;
    background-position: center;
	height:88px!important;
}
/* 共通ページヘッダー画像を差し替える */
.page-header {
background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/03/hiro_oshie_01.png') !important;
background-size: cover;
background-position: center;
height:200px;
}
/* 寺院概要（ID:2）だけヘッダー画像を差し替える */
.page-id-2 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/02/conte_hiro02-scaled.webp') !important;
background-size: cover;
background-position: center;
height:200px;
}
/* 寺院歴史（ID:37）だけヘッダー画像を差し替える */
.page-id-37 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/02/hiro_butsuji.png') !important;
background-size: cover;
background-position: center;
height:200px;
}/* 法宝物（ID:39）だけヘッダー画像を差し替える */
.page-id-39 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/03/hiro_houmotsu_01.png') !important;
background-size: cover;
background-position: center;
height:200px;
}/* 僧侶（ID:51）だけヘッダー画像を差し替える */
.page-id-51 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/04/hero_souryo01.jpg') !important;
background-size: cover;
background-position: center;
height:200px;
}/* 浄土真宗の教え（ID:897）だけヘッダー画像を差し替える */
.page-id-897 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/03/hiro_oshie_01.png') !important;
background-size: cover;
background-position: center;
height:200px;
}
/* 年間行事（ID:41）だけヘッダー画像を差し替える */
.page-id-41 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/03/hiro_event_01.png') !important;
background-size: cover;
background-position: center;
height:200px;
}
/* 仏事について（ID:45）だけヘッダー画像を差し替える */
.page-id-45 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/03/hiro_butusuji_01.png') !important;
background-size: cover;
background-position: center;
height:200px;
}
/* 法事について（ID:47）だけヘッダー画像を差し替える */
.page-id-47 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/03/hiro_butusuji_01.png') !important;
background-size: cover;
background-position: center;
height:200px;
}
/* ご葬儀について（ID:49）だけヘッダー画像を差し替える */
.page-id-49 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/03/hiro_butusuji_01.png') !important;
background-size: cover;
background-position: center;
height:200px;
}
/* access（ID:53）だけヘッダー画像を差し替える */
.page-id-53 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/02/hiro_access.png') !important;
background-size: cover;
background-position: center;
height:200px;
}
/* お問い合わせ（ID:8）だけヘッダー画像を差し替える */
.page-id-8 .page-header {
    background-image: url('https://najiokyogyoji.jp/wp-content/uploads/2026/02/hiro_access.png') !important;
background-size: cover;
background-position: center;
height:200px;
}
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::コンテンツエリア::::::::::::::*/
/*トップページお知らせカテゴリ背景色角丸*/
.taxonomy-category{
	border-radius:30px;
}

@media (max-width: 781px) {
.tex_cen td{ /* テーブルテキスト中央揃え */
	text-align:center!important;
	} 
     /* 縦書きページタイトル画像サイズ縮小 */
.wp-image-1607{/*概要*/
	width:152px!important;}
.wp-image-1889{/*歴史*/
	width:152px!important;}
.wp-image-2144{/*宝物*/
	width:152px!important;}
.wp-image-2119{/*僧侶*/
	width:152px!important;}
.wp-image-2916{/*浄土真宗の教え*/
	width:152px!important;}
.wp-image-2923{/*年間行事*/
	width:152px!important;}
.wp-image-2410{/*仏事*/
	width:152px!important;}
.wp-image-2901{/*法事*/
	width:152px!important;}
.wp-image-2913{/*葬儀*/
	width:152px!important;}
.wp-image-2928{/*access*/
	width:152px!important;}
.wp-image-2928{/*access*/
	width:152px!important;}
.wp-image-2934{/*お問い合わせ*/
	width:152px!important;}
}

/* --- 特定のブロック（.specific-timeline）だけに適用する設定テーブル？？？？？ --- */
/* PC版：左カラムは透明 */
.specific-timeline > .wp-block-column:first-child {
    background-color: transparent !important;
    display: flex;
    align-items: center;
    padding: 10px 20px !important;
}

/* スマホ版（781px以下）：左カラム（一段目）にだけ背景色をつける */
@media (max-width: 781px) {
    .specific-timeline > .wp-block-column:first-child {
        background-color: #f5f5f5 !important; /* ★ここでスマホ時の色を指定 */
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #eee;
        padding: 15px 20px !important;
    }
  /* スマホで縦に並んだ時の隙間をゼロにする */
    .specific-timeline {
        gap: 0 !important;
    }
}

/* PC版：左カラムは透明 */
.specific-timeline > .wp-block-column:first-child {
    background-color: transparent !important;
    display: flex;
    align-items: center;
    padding: 10px 20px !important;
}

/* スマホ版（781px以下）：左カラム（一段目）にだけ背景色をつける */
@media (max-width: 781px) {
    .specific-timeline > .wp-block-column:first-child {
        background-color: #f5f5f5 !important; /* ★ここでスマホ時の色を指定 */
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #eee;
        padding: 15px 20px !important;
    }
  /* スマホで縦に並んだ時の隙間をゼロにする */
    .specific-timeline {
        gap: 0 !important;
    }
}
/* アクセスページ:::::::::::::::::::::::::::::Googleマップをモノクロにする設定 */
.mono-map iframe {
    filter: grayscale(100%);      /* 100%で完全な白黒になります */
    -webkit-filter: grayscale(100%);
    transition: filter 0.5s ease; /* 変化をふわっとさせる */
	border-radius:5px;
}

/* マウスを乗せた時にカラーに戻す演出（お好みで） */
.mono-map:hover iframe {
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
}
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::画像リンクホバー設定::::::::::::::*/

/* --- 画像ボタンのホバー演出：ゆっくり透過 --- */

/* 通常時の設定 */
.bh a img {
    opacity: 1;                 /* 最初は不透明 */
    transition: opacity 0.6s ease !important; /* 0.6秒かけてゆっくり変化させる */
    transform: none !important; /* 拡大などの動きをリセットする場合 */
}

/* マウスを乗せた時（ホバー）の設定 */
.bh a:hover img {
    opacity: 0.8;               /* 透明度を80%にする（数値が小さいほど透明になります） */
}

/* 270px通話ボタンのスタイル */
.img-btn-270 {
    width: 270px !important;
    height: auto;           /* 縦横比を維持 */
    display: block;
    margin: 0 auto;         /* 中央寄せ（左寄せなら margin: 0; ） */
    max-width: 100%;        /* スマホ画面からはみ出さないようにする */
    transition: opacity 0.4s ease-in-out; /* 先ほどのふわっと透過 */
	border-radius:5px;
}

/* ホバー演出 */
.img-btn-270:hover {
    opacity: 0.7;
}

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::投稿ページエリア::::::::::::::*/
/* 投稿メタ情報のカスタマイズ */

/* 1. 最終更新日（時計アイコンと日付）を非表示 */
.entry-meta-item-updated {
    display: none !important;
}

/* 2. 投稿者名（アカウント名）を非表示 */
.fn {
    display: none !important;
}
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::contactフォーム::::::::::::::*/
/* Contact Form 7 エラーメッセージのスタイル変更 */
div.wpcf7-response-output {
    border: 1px solid #d93025 !important; /* 細い赤枠 */
    color: #d93025 !important;             /* 赤文字 */
    border-radius: 5px !important;         /* 角丸5px */
    background-color: #fff5f5 !important;  /* ほんのり薄い赤の背景色（視認性アップ） */
    margin-top: 20px !important;
    padding: 10px 15px !important;
    font-weight: bold;
    font-size: 0.9em;
}

/* 成功時のメッセージ（緑）もついでに整える場合（任意） */
div.wpcf7-mail-sent-ok {
    border: 1px solid #188038 !important; /* 細い緑枠 */
    color: #188038 !important;             /* 緑文字 */
    background-color: #e6f4ea !important;  /* 薄い緑背景 */
}
/* 同意ボタン横の注意書きスタイル */
.acceptance-note {
    display: inline-block;
    margin-top: 5px;
    font-size: 0.85em;
    color: #d93025; /* 先ほどのエラーと同じ赤色 */
    font-weight: normal;
}

/* チェックを入れる前の送信ボタンを少し薄くする（任意） */
.wpcf7-submit:disabled {
    background-color: #ccc !important;
    cursor: not-allowed;
}
/* reCAPTCHAのバッジを隠す */
.grecaptcha-badge { visibility: hidden; }

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::フッターエリア::::::::::::::*/
/* フッターエリア：メニューリスト */
.foot_list ul{
	list-style:none !important;
}
/* リンクの色とホバー効果（ゆっくり透過） */
.foot_list a {
    text-decoration: none;
    color: #333;
    transition: opacity 0.4s ease;
}

.foot_list a:hover {
    opacity: 0.7;
}

/* ページトップボタン：丸形＆ブランドカラー */
.page_top_btn {
    border: none !important;             /* 枠線を消す */
    border-radius: 50% !important;       /* 完全な円形にする */
    width: 50px !important;              /* ボタンの幅 */
    height: 50px !important;             /* ボタンの高さ */
    display: flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1); /* 軽い影をつけて浮かせる */
    transition: all 0.3s;
}

/* ホバー時の動き */
.page_top_btn:hover {
    background-color: #63308d !important; /* ホバー時の色 */
    transform: translateY(-5px);         /* 少し上に浮き上がるアニメーション */
    opacity: 1 !important;
}

/* コピーライトの文字サイズを調整 */
.site-footer-copyright p:nth-child(2) {
 display: none;
}
.site-footer-copyright{
	font-size: 0.65rem !important; /* 標準より一回り小さく設定 */
    color: #666;                   /* 文字色を少し薄くして存在感を抑える */
    padding-top: 10px;
    padding-bottom: 10px;
	text-align: center;
    letter-spacing: 0.05em; /* 文字の間隔を少し広げて読みやすく */
}