/*
 Theme Name: Twenty Twenty-Four Child
 Template: twentytwentyfour
*/

/* =========================================
   1. 検索フォーム（PC・スマホ共通）
   ========================================= */

/* 検索フォーム全体のコンテナ */
.event-search-wrapper {
    background-color: #E4F2FB; /* 薄い青 */
    padding: 2rem;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    box-sizing: border-box;

    /* PCでの表示位置調整 */
    width: 90%;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -5rem !important; /* 強制的に重ねる */
    margin-bottom: 3rem;
    position: relative;
    z-index: 50;
}

.event-search-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0 20px;
    align-items: flex-end;
}

/* 各入力グループ */
.event-search-group {
    flex: 1 1 200px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.event-search-label {
    font-weight: bold;
    font-size: 0.9rem;
    color: #1F6CAB; /* メインカラー */
}

/* 日付選択 */
.event-search-dates {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}

.radio-btn input {
    display: none;
}
.radio-btn span {
    display: inline-block;
    padding: 6px 12px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 20px;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
    color: #333;
}
/* 選択中のスタイル */
.radio-btn input:checked + span {
    background: #1F6CAB; /* メインカラー */
    color: #fff;
    border-color: #1F6CAB;
}

/* プルダウン周り */
.select-wrapper select {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    font-size: 1rem;
}

/* 検索ボタン */
.event-search-submit {
    flex: 0 0 auto;
}
.event-search-submit button {
    background-color: #1F6CAB; /* メインカラー */
    color: #fff;
    border: none;
    padding: 12px 32px;
    font-size: 1rem;
    font-weight: bold;
    border-radius: 4px;
    cursor: pointer;
    transition: opacity 0.2s;
}
.event-search-submit button:hover {
    opacity: 0.8;
}

/* 動的タイトルのスタイル調整 */
.event-search-heading {
    margin-top: 3rem;
    margin-bottom: 1.5rem;
    text-align: center;
    color: #333;
}

/* =========================================
   検索結果表示時の位置調整（ヘッダー被り防止）
   ========================================= */
#search-form-top {
    /* ヘッダーの高さ(70px) ＋ 余白(50px) = 120px 分の位置で止める */
    scroll-margin-top: 120px;
    padding: 20px;
    border-radius: 0 0 8px 8px;
}

/* スマホではヘッダーが少し小さい場合などを考慮して調整（PCと同じでもOK） */
@media (max-width: 768px) {
    #search-form-top {
        scroll-margin-top: 100px;
    }
}

/* =========================================
   2. イベント詳細ページ（PC・スマホ共通）
   ========================================= */

/* コンテナ調整 */
.event-container {
    padding-top: 3rem;
    padding-bottom: 5rem;
    max-width: 1100px;
    margin: 0 auto;
}

/* =========================================
   イベント詳細ヘッダー（バランス調整版）
   ========================================= */
.event-header {
    margin-bottom: 2rem;
    text-align: left;
    background-color: #fff;
    border-bottom: 1px solid #eee;
    padding-bottom: 1.5rem;
}

/* 1. タグエリア（リンク付き・主張を抑える） */
.event-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 0.8rem;
}
/* spanからaに変更したため、スタイル調整 */
a.event-tag {
    display: inline-block;
    padding: 3px 8px;
    font-size: 0.7rem;
    border-radius: 3px;
    font-weight: normal;
    letter-spacing: 0.02em;
    line-height: 1.2;
    text-decoration: none; /* 下線を消す */
    transition: opacity 0.2s, transform 0.1s; /* アニメーション */
}

/* ホバー時の動き（押せる感を出す） */
a.event-tag:hover {
    opacity: 0.8;
    transform: translateY(-1px); /* 少し浮く */
}

/* 配色は維持 */
.event-tag.is-cat { background-color: #1F6CAB; color: #fff; }
.event-tag.is-area { background-color: #7CB874; color: #fff; }
.event-tag.is-target { background-color: #F5E2A8; color: #333; }

/* 2. タイトル（主役として大きく） */
.event-title {
    font-size: 2.4rem; /* サイズアップ */
    font-weight: bold;
    line-height: 1.3;
    color: #333;
    margin-bottom: 1rem;
    padding-left: 0;
    letter-spacing: -0.02em; /* 文字間を少し詰めて引き締める */
}

/* 3. タイトル下のメタ情報（日時・場所） */
/* 箱のデザインをやめて、シンプルなテキスト＋アイコンに変更 */
.event-header-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center; /* 縦位置中央揃え */
    gap: 24px; /* アイテム間の余白 */
    font-size: 1rem;
    color: #444; /* 文字色を少し濃く */
    margin-top: 0.5rem;
}

.header-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
    /* 背景色・枠線を削除してシンプルに */
    background-color: transparent;
    padding: 0;
    border: none;
}

/* アイコン装飾 */
.header-meta-item .dashicons {
    color: #1F6CAB; /* アイコンだけメインカラーで強調 */
    font-size: 1.2rem;
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
}

.header-meta-text {
    font-weight: 500; /* 少しだけ太くして読みやすく */
    line-height: 1.4;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .event-title {
        font-size: 1.8rem; /* スマホでもタイトルは大きく */
    }
    .event-header-meta {
        flex-direction: column; /* 縦並び */
        align-items: flex-start; /* 左揃え */
        gap: 12px;
    }
    .header-meta-item {
        width: 100%;
    }
}

/* =========================================
   画像エリア（拡大・背景ボカシ対応版）
   ========================================= */
.event-visual {
    margin-bottom: 3rem;
}

/* コンテナ：背景とメイン画像を重ねるための基準 */
.event-visual-container {
    position: relative;
    width: 100%;
    height: 500px; /* PCでの高さ制限 */
    border-radius: 8px;
    overflow: hidden;
    background-color: #E4F2FB;
}

/* 背景ボカシ層 */
.visual-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    filter: blur(20px) brightness(0.9); /* ボカシ強め・少し暗く */
    z-index: 1;
    opacity: 0.5; /* 薄く表示 */
}

/* メイン画像の枠 */
.event-visual-main {
    position: relative;
    z-index: 2; /* 背景より上に */
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: zoom-in; /* カーソルを虫眼鏡に */
}

.event-visual-main img {
    max-width: 100%;
    max-height: 100%;
    width: auto; /* 比率を維持 */
    height: auto;
    object-fit: contain;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2); /* 画像自体に影をつける */
    transition: transform 0.2s;
}

.event-visual-main:hover img {
    transform: scale(1.02); /* ホバーで少し浮く */
}

/* 拡大ヒント */
.zoom-hint {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: rgba(0,0,0,0.6);
    color: #fff;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    pointer-events: none;
}

/* 画像がない場合 */
.no-image {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1F6CAB;
    font-weight: bold;
}

/* サムネイル */
.event-visual-sub {
    display: flex;
    gap: 10px;
    margin-top: 10px;
    overflow-x: auto;
    position: relative;
    z-index: 2;
}
.sub-item img {
    width: 100px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    cursor: pointer;
    border: 3px solid transparent;
    opacity: 0.6;
    transition: all 0.2s;
    background: #fff;
}
.sub-item img:hover { opacity: 1; }
.sub-item img.is-active {
    border-color: #1F6CAB;
    opacity: 1;
}

/* --- モーダル（拡大画面）のスタイル --- */
.image-modal {
    display: none; /* 初期は非表示 */
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.85); /* 背景を暗く */
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
}
.modal-content {
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
    border-radius: 4px;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
    animation: zoomIn 0.2s ease;
}
.close-modal {
    position: absolute;
    top: 20px;
    right: 30px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}
@keyframes zoomIn {
    from {transform: scale(0.9); opacity: 0;}
    to {transform: scale(1); opacity: 1;}
}

/* スマホ調整 */
@media (max-width: 768px) {
    .event-visual-container {
        height: 350px; /* スマホでは少し小さく */
    }
}

/* 2カラムレイアウト（PC） */
.event-body-layout {
    display: flex;
    gap: 40px;
    align-items: flex-start;
}
.event-main-col {
    flex: 1;
    min-width: 0;
}
.event-side-col {
    width: 300px;
    flex-shrink: 0;
    position: sticky;
    top: 100px !important;
}

/* セクション共通 */
.event-section {
    margin-bottom: 3rem;
}
.section-title {
    font-size: 1.5rem;
    border-bottom: 2px solid #1F6CAB; /* メインカラー */
    padding-bottom: 10px;
    margin-bottom: 1.5rem;
    font-weight: bold;
    color: #333;
}

/* テーブルスタイル */
.event-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
}
.event-table th, .event-table td {
    padding: 15px;
    border-bottom: 1px solid #eee;
    text-align: left;
    vertical-align: top;
}
.event-table th {
    width: 25%;
    background: #f9f9f9;
    font-weight: bold;
    color: #1F6CAB; /* メインカラー */
    white-space: nowrap;
}
.label-mini {
    display: inline-block;
    background: #E4F2FB; /* 薄い青 */
    font-size: 0.75rem;
    padding: 2px 6px;
    border-radius: 3px;
    margin-right: 5px;
    color: #1F6CAB;
}

/* サイドバー要素 */
.btn-action {
    display: block;
    width: 100%;
    padding: 15px;
    text-align: center;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    margin-bottom: 12px;
    font-weight: bold;
    transition: opacity 0.2s;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.btn-action:hover {
    opacity: 0.8;
}
/* ボタン色分け */
.btn-detail { background-color: #1F6CAB; } /* メイン青 */
.btn-reserve { background-color: #7CB874; } /* 緑 */
.btn-site { background-color: #333; }       /* 黒 */

.organizer-box {
    background: #E4F2FB; /* 薄い青 */
    padding: 20px;
    border-radius: 8px;
    margin-top: 2rem;
}
.side-title {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #1F6CAB; /* メインカラー */
    padding-bottom: 5px;
    color: #1F6CAB;
}
.org-contact p {
    margin-bottom: 0.5rem;
}
.org-tel a {
    font-size: 1.2rem;
    font-weight: bold;
    color: #333;
    text-decoration: none;
}
.org-sns {
    margin-top: 1rem;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.org-sns a {
    font-size: 0.85rem;
    text-decoration: underline;
    color: #1F6CAB;
}


/* =========================================
   3. スマホ表示時の調整
   ========================================= */
@media (max-width: 768px) {

    .event-search-wrapper {
        margin-top: 0 !important;
        margin-bottom: 2rem;
        width: 94% !important;
        padding: 1.5rem;
        box-sizing: border-box;
    }

    .event-search-form {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .event-search-group {
        flex: 0 0 auto !important;
    }

    .event-search-dates {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 8px !important;
        width: 100%;
    }

    .radio-btn {
        display: block;
        width: 100%;
    }

    .radio-btn span {
        display: block;
        width: 100%;
        padding: 10px 4px;
        border-radius: 4px;
        box-sizing: border-box;
    }

    .event-search-submit button {
        width: 100%;
        padding: 14px;
    }

    /* 詳細ページスマホ */
    .event-body-layout {
        flex-direction: column;
        gap: 2rem;
    }
    .event-side-col {
        width: 100%;
        position: static;
    }
    .event-table th, .event-table td {
        display: block;
        width: 100%;
    }
    .event-table th {
        background: transparent;
        padding-bottom: 5px;
        border-bottom: none;
        color: #1F6CAB;
    }
    .event-table td {
        padding-top: 0;
        padding-left: 15px;
    }
}


/* =========================================
   4. ヘッダーのレイアウト修正
   ========================================= */

/* 1. ヘッダーの外枠（背景） */
.site-header {
    width: 100% !important;
    background-color: #fff;
    border-bottom: 1px solid #eee;

    display: flex !important;
    justify-content: center !important;
}

/* 2. ヘッダーの中身（ロゴとメニューが入っている箱） */
.site-header > div,
.site-header > .wp-block-group {
    width: 100% !important;
    max-width: 1200px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;

    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
}

/* 3. 保険 */
.site-header .wp-block-group.is-layout-flex {
    width: 100% !important;
    justify-content: space-between !important;
}

.is-layout-constrained > .alignwide {
    width: 100%;
}

/* ★修正：メニュー項目の間隔をトップページに合わせて16pxに統一 */
.site-header .wp-block-navigation__container {
    gap: 16px !important;
}

/* PDF救済ボタン */
.pdf-alert-box {
    margin-top: 15px;
    padding: 15px;
    background-color: #fff8e1; /* 薄い黄色 */
    border: 1px solid #ffecb3;
    border-radius: 6px;
    text-align: center;
}
.pdf-alert-box p {
    font-size: 0.85rem;
    color: #f57f17;
    margin-bottom: 8px;
    font-weight: bold;
}
.btn-pdf-view {
    display: inline-block;
    background-color: #d32f2f; /* 赤色 */
    color: #fff;
    padding: 10px 20px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: bold;
    font-size: 0.9rem;
    transition: opacity 0.2s;
}
.btn-pdf-view:hover {
    opacity: 0.8;
    color: #fff;
}
.btn-pdf-view .dashicons {
    margin-right: 4px;
}

/* =========================================
   カスタムフッターデザイン
   ========================================= */

/* フッター全体 */
.site-footer-custom {
    background-color: #1F6CAB; /* メインカラー（青） */
    color: #fff;
    padding-top: 3rem;
    margin-top: 0; /* 詳細ページとの隙間を埋める */
}

/* インナー幅制限 */
.footer-inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 3カラムレイアウト */
.footer-widgets {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    padding-bottom: 3rem;
    border-bottom: 1px solid rgba(255,255,255,0.2); /* 薄い区切り線 */
}

/* 各カラムの設定 */
.footer-widget-col {
    flex: 1;
    min-width: 250px;
}

/* カラム1：ロゴエリア */
.footer-logo-text {
    font-size: 1.8rem;
    font-weight: bold;
    color: #fff; /* ロゴ色 */
    display: inline-block;
    margin-bottom: 1rem;
}
.site-desc {
    font-size: 0.9rem;
    line-height: 1.6;
    opacity: 0.9;
}

/* 見出し */
.footer-title {
    font-size: 1.1rem;
    font-weight: bold;
    margin-bottom: 1.2rem;
    color: #fff;
}

/* メニューリスト */
.footer-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer-menu li {
    margin-bottom: 0.8rem;
}
.footer-menu a {
    color: #fff;
    text-decoration: none;
    opacity: 0.8;
    transition: opacity 0.2s;
    font-size: 0.95rem;
}
.footer-menu a:hover {
    opacity: 1;
    text-decoration: underline;
}

/* SNSリンク */
.footer-sns {
    margin-top: 1.5rem;
    display: flex;
    gap: 15px;
}
.footer-sns a {
    color: #fff;
    font-size: 0.9rem;
    border: 1px solid rgba(255,255,255,0.4);
    padding: 6px 12px;
    border-radius: 20px;
    text-decoration: none;
    transition: all 0.2s;
}
.footer-sns a:hover {
    background: #fff;
    color: #1F6CAB;
}

/* コピーライト */
.footer-bottom {
    padding: 1.5rem 0;
    text-align: center;
    font-size: 0.8rem;
    opacity: 0.7;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .footer-widgets {
        flex-direction: column; /* 縦並び */
        gap: 30px;
    }
    .footer-widget-col {
        width: 100%;
    }
}

/* =========================================
   フッター周辺の余白完全削除
   ========================================= */

/* 1. フッターを包むテンプレートパーツ自体の余白を消す */
footer.wp-block-template-part {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* 2. ショートコードの前後に発生する可能性のある空Pタグを消す */
footer.wp-block-template-part > p:empty {
    display: none !important;
}

/* 3. ページ最下部の全体枠の余白も念のため消す */
.wp-site-blocks {
    padding-bottom: 0 !important;
}

/* =========================================
   全アーカイブページ（一覧・タグ・カテゴリ）専用の調整
   ========================================= */

/* .archive クラスを使うことで、イベント一覧だけでなく、
   タグやカテゴリーの表示ページも一括で調整できます */
.archive .event-search-wrapper {
    margin-top: 4rem !important; /* 重なりを解除し、ヘッダーの下に余白を作る */
}

/* スマホ表示（768px以下）の設定 */
@media (max-width: 768px) {
    .archive .event-search-wrapper {
        margin-top: 0 !important; /* スマホは既存のスタイル通り 0 に固定 */
    }
}

/* =========================================
   イベント投稿ページのデザイン
   ========================================= */

/* 見出しの左線デザイン */
.submit-section-title {
    border-left: 5px solid #1F6CAB; /* メインカラー */
    padding-left: 15px;
    margin-bottom: 20px;
    margin-top: 40px;
}

/* フローチャート（3カラム） */
.flow-steps {
    gap: 20px;
    margin-bottom: 40px;
}
.step-card {
    background: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #eee;
    text-align: center;
}
.step-card h5 {
    color: #1F6CAB;
    margin-bottom: 10px;
    font-size: 1.1rem;
    font-weight: bold;
}

/* 投稿のポイント枠（黄色いボックス） */
.submit-tips {
    background: #fff8e1; /* 薄い黄色 */
    border: 1px solid #ffe082;
    padding: 20px 30px;
    border-radius: 8px;
    margin-bottom: 40px;
}

/* -----------------------------------------
   フォーム自体のデザイン
   (ACF Frontend Form / MW WP Form 共通)
----------------------------------------- */
/* フォーム全体を囲むエリア */
.acf-form, .mw_wp_form {
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    max-width: 800px;
    margin: 20px auto 0;
}

/* 入力欄のデザイン */
.acf-form input[type="text"],
.acf-form input[type="email"],
.acf-form textarea,
.acf-form select,
.mw_wp_form input[type="text"],
.mw_wp_form textarea {
    width: 100%;
    padding: 12px 15px;
    margin-bottom: 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fcfcfc;
    box-sizing: border-box;
}

/* ラベル（項目名） */
.acf-field label,
.mw_wp_form label {
    font-weight: bold;
    color: #333;
    display: block;
    margin-bottom: 8px;
    margin-top: 15px;
}

/* 送信ボタン */
.acf-form input[type="submit"],
.mw_wp_form input[type="submit"] {
    background-color: #1F6CAB;
    color: #fff;
    padding: 15px 60px;
    border: none;
    border-radius: 30px;
    font-size: 1.1rem;
    font-weight: bold;
    cursor: pointer;
    display: block;
    margin: 40px auto 0;
    transition: background 0.3s;
    width: auto;
    min-width: 200px;
}

.acf-form input[type="submit"]:hover,
.mw_wp_form input[type="submit"]:hover {
    background-color: #16568d;
}

/* スマホ対応 */
@media (max-width: 600px) {
    .acf-form, .mw_wp_form {
        padding: 20px;
    }
    .flow-steps {
        flex-direction: column; /* スマホでは縦並び */
    }
}

/* =========================================
   掲載基準ページのデザイン
   ========================================= */

/* リスト共通設定 */
.criteria-list {
    margin-bottom: 40px;
    padding: 20px 20px 20px 40px; /* アイコン分の左余白 */
    border-radius: 8px;
    position: relative;
    list-style: none !important; /* 標準の・を消す */
}

.criteria-list li {
    margin-bottom: 10px;
    line-height: 1.6;
    position: relative;
    padding-left: 5px;
}

/* -----------------------------------------
   OKリスト（掲載できるもの）
   ----------------------------------------- */
.criteria-ok {
    background-color: #E4F2FB; /* 薄い青 */
    border: 2px solid #1F6CAB;
}

/* 擬似要素で「丸（○）」アイコンを表示 */
.criteria-ok::before {
    content: 'OK';
    position: absolute;
    top: -15px;
    left: 20px;
    background: #1F6CAB;
    color: #fff;
    font-weight: bold;
    padding: 2px 15px;
    border-radius: 20px;
    font-size: 0.9rem;
}

.criteria-ok li::before {
    content: '✔'; /* チェックマーク */
    color: #1F6CAB;
    font-weight: bold;
    margin-right: 8px;
    margin-left: -20px;
}

/* -----------------------------------------
   NGリスト（掲載できないもの）
   ----------------------------------------- */
.criteria-ng {
    background-color: #fff5f5; /* 薄い赤 */
    border: 2px solid #e53935;
}

/* 擬似要素で「NG」アイコンを表示 */
.criteria-ng::before {
    content: 'NG';
    position: absolute;
    top: -15px;
    left: 20px;
    background: #e53935;
    color: #fff;
    font-weight: bold;
    padding: 2px 15px;
    border-radius: 20px;
    font-size: 0.9rem;
}

.criteria-ng li::before {
    content: '✖'; /* バツマーク */
    color: #e53935;
    font-weight: bold;
    margin-right: 8px;
    margin-left: -20px;
}

/* -----------------------------------------
   免責事項ボックス
   ----------------------------------------- */
.criteria-note {
    background-color: #f9f9f9;
    padding: 30px;
    border-radius: 8px;
    border: 1px solid #ddd;
    margin-top: 50px;
}

.criteria-note h4 {
    margin-top: 0;
    font-size: 1.1rem;
    color: #666;
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

.criteria-note p {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 10px;
}

/* =========================================
   固定ページ（掲載基準・主催者向け）の余白調整
   ========================================= */

/* 1. 全体的な余白の確保 */
.submit-guide-wrapper,
.criteria-wrapper {
    margin-bottom: 60px; /* ページ下部にゆとり */
}

/* 3. 本文（段落）の下にも余白を入れる */
.submit-guide-wrapper p,
.criteria-wrapper p {
    line-height: 1.8; /* 行間も読みやすく広げる */
}

/* 4. リスト（箇条書き）の下にも余白 */
.criteria-list,
.submit-tips {
    margin-bottom: 40px !important;
}

/* 5. リード文（最初の挨拶）だけ少し広めにとる */
.guide-intro {
    margin-bottom: 50px !important;
}

/* 4. 投稿ボタンの色調整 */
.criteria-contact h2,
.criteria-contact p {
    margin-bottom: 0 !important;
}
.criteria-wrapper .wp-block-button__link {
    background-color: #1F6CAB !important;
    color: #fff !important;
}
.criteria-wrapper .wp-block-button__link:hover {
    background-color: #16568d !important;
    text-decoration: none;
}

/* =========================================
   運営・お問い合わせページのデザイン
   ========================================= */

/* 1. ページ全体の幅制限 */
.about-wrapper {
    max-width: 800px; /* 読みやすい幅に */
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 60px;
}
.about-wrapper h2 {
    margin-bottom: 40px !important;
}
.about-wrapper p {
    line-height: 1.8;
}

/* 2. 見出しのデザイン（下線付き） */
.about-section-title {
    border-bottom: 2px solid #1F6CAB; /* メインカラー */
    padding-bottom: 10px;
    margin-bottom: 20px !important;
    font-size: 1.4rem;
}

/* 3. 会社概要リスト（カラムブロックをテーブル風にする） */
.company-list {
    border-top: 1px solid #eee;
}

/* 各会社の行 */
.company-item {
    border-bottom: 1px solid #eee;
    padding: 20px 0;
    margin-bottom: 0 !important; /* デフォルトの余白を消す */
    align-items: center; /* 垂直方向中央揃え */
}

/* 会社名エリア（左カラム） */
.company-name {
    color: #1F6CAB;
    font-weight: bold;
}
.company-name p {
    margin-bottom: 0 !important;
}

/* 4. スマホ対応 */
@media (max-width: 600px) {
    .company-item {
        flex-direction: column; /* 縦並びにする */
        align-items: flex-start !important;
        gap: 5px; /* 上下の隙間 */
    }

    .company-name {
        width: 100% !important;
        flex-basis: auto !important;
        background: #f5f5f5; /* スマホ時は背景をつけて見出しっぽく */
        padding: 8px 10px;
        border-radius: 4px;
    }
}

/* =========================================
   よくある質問 (FAQ) ページのデザイン
   ========================================= */

/* 1. 全体の幅と余白 */
.faq-wrapper {
    max-width: 800px;
    margin: 0 auto 60px;
}
.faq-wrapper h2 {
    margin-bottom: 40px !important;
}

/* 2. セクション見出し */
.faq-section-title {
    border-left: 5px solid #1F6CAB; /* メインカラー */
    padding-left: 15px;
    margin-bottom: 25px !important;
    font-size: 1.4rem;
    line-height: 1.4;
}

/* 3. Q&A（詳細ブロック）のデザイン */
.faq-item {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-bottom: 15px;
    background: #fff;
    transition: all 0.3s;
}
.faq-item[open] {
    border-color: #1F6CAB; /* 開いた時は青枠に */
    background: #fdfdfd;
}

/* 質問部分 (Q) */
.faq-item summary {
    padding: 15px 40px 15px 50px; /* 右余白はアイコン用、左はQ用 */
    font-weight: bold;
    cursor: pointer;
    position: relative;
    list-style: none; /* 標準マーカー消去 */
    line-height: 1.6;
}
.faq-item summary::-webkit-details-marker {
    display: none;
}

/* Qアイコン */
.faq-item summary::before {
    content: 'Q';
    position: absolute;
    left: 15px;
    top: 50%; /* 縦中央配置 */
    transform: translateY(-50%);
    color: #1F6CAB;
    font-size: 1.3rem;
    font-family: sans-serif; /* 綺麗な英語フォントで */
    font-weight: 900;
}

/* 開閉プラス・マイナスアイコン */
.faq-item summary::after {
    content: '+';
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: #ccc;
    font-size: 1.5rem;
    line-height: 1;
}
.faq-item[open] summary::after {
    content: '−'; /* 開いたらマイナス */
    color: #1F6CAB;
}

/* 回答部分 (A) */
.faq-item .wp-block-group,
.faq-item p {
    margin: 0 !important;
    padding: 20px 20px 25px 50px;
    border-top: 1px dashed #eee; /* 点線で区切る */
    color: #333;
    line-height: 1.8;
    position: relative;
}

/* Aアイコン */
.faq-item[open] .wp-block-group::before,
.faq-item[open] p::before {
    content: 'A';
    position: absolute;
    left: 17px;
    top: 20px;
    color: #e53935; /* 赤色 */
    font-size: 1.3rem;
    font-family: sans-serif;
    font-weight: 900;
}

/* お問い合わせ部分の余白調整 */
.faq-contact h3 {
    margin-top: 0;
}

/* =========================================
   プライバシーポリシーページ (ID:3) 専用デザイン
   ※ヘッダー・フッターを除外するため main タグ配下に限定
   ========================================= */

/* 記事エリアの幅調整 */
.page-id-3 main .wp-block-post-content,
.page-id-3 main .entry-content {
    max-width: 800px;
    margin: 0 auto;
}

/* ポリシー独自の見出しデザイン (メインエリアのみ) */
.page-id-3 main .wp-block-heading {
    margin-top: 40px;
    margin-bottom: 20px;
}

/* 第○条の見出し（H3） */
.page-id-3 main h3.wp-block-heading {
    font-size: 1.2rem;
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
    color: #333;
    margin-top: 50px;
}

/* リストを見やすく（ナビゲーションメニュー等は除外） */
.page-id-3 main ul {
    margin-bottom: 30px;
    background: #f9f9f9;
    padding: 20px 20px 20px 40px;
    border-radius: 4px;
}
.page-id-3 main li {
    margin-bottom: 10px;
}

/* 共同利用の項目などを強調 */
.page-id-3 main strong {
    color: #1F6CAB;
}

/* お問い合わせ窓口の枠線調整 */
.page-id-3 main .wp-block-group.has-border-color {
    margin-top: 40px;
}

/* =========================================
   イベントを探すページのデザイン
   ========================================= */

/* 見出し */
.search-section-title {
    border-left: 5px solid #1F6CAB;
    padding-left: 15px;
    margin-bottom: 25px !important;
}

/* 1. ジャンルボタン（アイコン付き） */
.genre-btn .wp-block-button__link {
    border: 1px solid #ddd !important;
    color: #333 !important;
    background: #fff;
    border-radius: 8px !important;
    padding: 15px 10px !important;
    width: 100%;
    text-align: center;
    transition: all 0.2s;
}
.genre-btn .wp-block-button__link:hover {
    background: #f0f8ff !important;
    border-color: #1F6CAB !important;
    transform: translateY(-2px);
    text-decoration: none;
}

/* 2. エリアボタン（ベタ塗り） */
.area-btn .wp-block-button__link {
    background: #1F6CAB !important;
    color: #fff !important;
    border-radius: 50px !important;
    padding: 15px 0 !important;
    font-weight: bold;
}
.area-btn .wp-block-button__link:hover {
    background: #16568d !important;
}

/* 3. タグボタン（小さめ、ハッシュタグ風） */
.tag-cloud-wrapper {
    gap: 10px;
}
.tag-btn .wp-block-button__link {
    border: 1px solid #ccc !important;
    color: #666 !important;
    border-radius: 20px !important;
    padding: 8px 15px !important;
    font-size: 0.9rem;
}
.tag-btn .wp-block-button__link:hover {
    border-color: #1F6CAB !important;
    color: #1F6CAB !important;
    background: #fff;
}

/* スマホ対応 */
@media (max-width: 600px) {
    /* ジャンルボタンをスマホで2列にする調整 */
    .wp-block-buttons .genre-btn {
        width: 48% !important; /* 隙間を考慮して48% */
        margin-bottom: 10px;
    }
}

/* =========================================
   イベントを探すページ（ショートコード版）のデザイン・完全修正版
   ========================================= */

/* 見出し */
.search-section-title {
    border-left: 5px solid #1F6CAB;
    padding-left: 15px;
    margin-bottom: 25px !important;
    clear: both;
}
.page-id-759 .wp-block-post-title {
    display: none;
}

/* -----------------------------------------
   1. ジャンルボタン（重なり防止：Flexboxに変更）
   ----------------------------------------- */
.genre-btn-wrapper {
    display: flex;
    flex-wrap: wrap; /* 折り返しを有効化 */
    gap: 15px;       /* 縦横の隙間 */
    margin-bottom: 30px;
    width: 100%;
}

/* ボタンの外側の箱 */
.genre-btn {
    /* 幅の計算：スマホは50%弱、PCは160px以上で自動伸縮 */
    flex: 1 1 160px;
    margin: 0 !important; /* 余計なマージンを削除 */
    height: auto;
}

/* ボタン本体のデザイン */
.genre-btn .wp-block-button__link {
    border: 1px solid #ddd !important;
    color: #333 !important;
    background: #fff;
    border-radius: 8px !important;
    /* 上下の余白を確保 */
    padding: 25px 10px !important;
    width: 100%;
    height: 100%;
    box-sizing: border-box; /* 枠線を含めたサイズ計算 */

    /* 文字とアイコンの配置 */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 0.95rem;
    line-height: 1.4;
    text-decoration: none;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.genre-btn .wp-block-button__link:hover {
    background: #f0f8ff !important;
    border-color: #1F6CAB !important;
    transform: translateY(-3px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* -----------------------------------------
   2. エリアボタン（3つ並び）
   ----------------------------------------- */
.area-search-grid {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
}

.area-btn {
    flex: 1;
    min-width: 140px;
    max-width: 300px;
}

.area-btn .wp-block-button__link {
    background: #1F6CAB !important;
    color: #fff !important;
    border-radius: 50px !important;
    padding: 15px 0 !important;
    font-weight: bold;
    width: 100%;
    text-align: center;
    text-decoration: none;
    display: block;
}
.area-btn .wp-block-button__link:hover {
    background: #16568d !important;
    opacity: 1 !important;
}

/* -----------------------------------------
   3. こだわり条件タグ（文字色修正：強力指定）
   ----------------------------------------- */
.tag-cloud-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.tag-btn .wp-block-button__link {
    /* 文字色を白に強制 */
    color: #ffffff !important;
    /* 背景色がテーマ側で当たっていない場合のため青を指定 */
    background-color: #1F6CAB !important;

    border-radius: 20px !important;
    padding: 8px 15px !important;
    font-size: 0.9rem;
    text-decoration: none;
    border: none !important;
}

.tag-btn .wp-block-button__link:hover {
    background-color: #16568d !important;
    opacity: 0.9;
}

/* =========================================
   関連イベント（詳細ページ下部）のサイズ調整
   ========================================= */

/* 1. タイトルを小さく（通常よりひと回り小さく） */
.related-card .event-card__title {
    font-size: 1rem !important; /* 16px相当 */
    line-height: 1.4;
    margin-bottom: 5px !important;
}
.related-card .event-card__title a {
    font-weight: bold;
}

/* 2. 日付・会場名を小さく */
.related-card .event-card__venue,
.related-card .event-card__date {
    font-size: 0.8rem !important; /* 12〜13px相当 */
    margin-bottom: 3px !important;
}

/* 3. カテゴリ・エリアタグを小さく */
.related-card .event-card__cat,
.related-card .event-card__area {
    font-size: 0.7rem !important; /* 11px相当 */
    padding: 2px 6px !important;
    margin-right: 3px !important;
    margin-bottom: 3px !important;
}

/* 4. 余白の微調整（狭いので詰め気味に） */
.related-card .event-card__body {
    padding: 10px 12px !important; /* 通常より内側の余白を減らす */
}

/* =========================================
   カスタムフッターのデザイン調整
   ========================================= */

.site-footer-custom {
    background-color: #f9f9f9;
    border-top: 1px solid #eee;
    padding: 60px 0 20px;
    font-size: 0.95rem;
    color: #444;
}

.footer-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 3カラムレイアウト */
.footer-widgets {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr; /* 左のカラムを少し広めに */
    gap: 40px;
    margin-bottom: 50px;
}

/* ロゴ画像（サイズ調整） */
.footer-logo-img {
    max-width: 180px; /* 大きすぎないように制限 */
    height: auto;
    display: block;
    margin-bottom: 15px;
}

/* 説明文（前回のまま） */
.site-desc {
    font-size: 0.9rem;
    line-height: 1.6;
    margin-bottom: 20px;
    color: #666;
}

/* 運営会社情報 */
.footer-operators {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px dashed #ddd;
    font-size: 0.85rem;
}
.operator-label {
    font-weight: bold;
    margin-bottom: 5px;
    color: #333;
}
.operator-name {
    margin: 2px 0;
    color: #555;
}

/* メニュー・見出し */
.footer-title {
    font-size: 1.1rem;
    font-weight: bold;
    margin-bottom: 20px;
    border-left: 4px solid #1F6CAB;
    padding-left: 10px;
    color: #333;
}

.footer-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer-menu li {
    margin-bottom: 12px;
}
.footer-menu a {
    text-decoration: none;
    color: #555;
    transition: color 0.2s;
}
.footer-menu a:hover {
    color: #1F6CAB;
    text-decoration: underline;
}

/* SNSリンク */
.footer-sns {
    margin-top: 25px;
    display: flex;
    gap: 15px;
}
.footer-sns a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    text-decoration: none;
    color: #555;
    font-weight: bold;
    background: #fff;
    padding: 8px 15px;
    border-radius: 20px;
    border: 1px solid #ddd;
    transition: all 0.2s;
    font-size: 0.85rem;
}
.footer-sns a:hover {
    background: #1F6CAB;
    color: #fff;
    border-color: #1F6CAB;
}

/* コピーライト */
.footer-bottom {
    border-top: 1px solid #eee;
    padding-top: 20px;
    text-align: center;
    font-size: 0.8rem;
    color: #888;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .footer-widgets {
        grid-template-columns: 1fr; /* 1列にする */
        gap: 40px;
    }
    .footer-widget-col {
        text-align: left; /* 左寄せ */
    }
    .site-footer-custom {
        padding-top: 40px;
    }
}

/* =========================================
   カスタムヘッダーのデザイン（修正版：左寄り解消）
   ========================================= */

/* 1. ヘッダー全体の枠（画面に対して絶対固定） */
.site-header-custom {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 70px;
    z-index: 9999; /* 他の要素より確実に上に */
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    /* ▼変更：display:flex を削除し、ブロック要素として扱う */
    display: block;
    box-sizing: border-box;
}

/* 2. ヘッダーが浮く分、コンテンツ全体を下に下げる */
body {
    padding-top: 70px;
}

/* 管理バー調整 */
body.admin-bar .site-header-custom { top: 32px; }
@media screen and (max-width: 782px) {
    body.admin-bar .site-header-custom { top: 46px; }
}

/* 3. 中身のレイアウト（ここで左右に広げる） */
.header-inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto; /* 中央寄せ */
    padding: 0 20px;
    height: 100%;
    /* ▼ここが重要：中身を左右に振り分ける */
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
}

/* 4. ロゴ周り */
.header-logo {
    display: flex;
    align-items: center;
    gap: 15px;
    /* ロゴエリアが縮まないようにする */
    flex-shrink: 0;
}
.header-logo-img {
    height: 40px;
    width: auto;
    display: block;
}
.header-site-desc {
    font-size: 0.75rem;
    color: #1F6CAB;
    margin: 0;
    line-height: 1.2;
    display: block;
}

/* 5. PC用ナビゲーション */
.header-nav-pc .nav-list {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: center;
    gap: 25px;
}
.header-nav-pc a {
    text-decoration: none;
    color: #333;
    font-weight: bold;
    font-size: 0.95rem;
    transition: color 0.3s;
    white-space: nowrap; /* 文字が折り返さないように */
}
.header-nav-pc a:hover {
    color: #1F6CAB;
}

/* イベント掲載ボタン */
.btn-header-submit {
    background-color: #1F6CAB;
    color: #fff !important;
    padding: 10px 20px;
    border-radius: 50px;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: background 0.3s, transform 0.2s;
    box-shadow: 0 4px 6px rgba(31, 108, 171, 0.2);
    text-decoration: none;
    line-height: 1.2;
    white-space: nowrap;

    /* ▼▼▼ 追加：ここが重要です ▼▼▼ */
    position: relative; /* 透明な膜を配置するための基準点 */
}

/* ▼▼▼ 追加：ボタンの下に「見えない膜」を張る ▼▼▼ */
.btn-header-submit::after {
    content: '';
    position: absolute;
    left: 0;
    top: 100%;    /* ボタンの底辺 */
    width: 100%;
    height: 15px; /* ボタンが上に逃げてもマウスをキャッチできる高さ */
    background: transparent; /* 透明なので見た目には影響しません */
}

.btn-header-submit:hover {
    background-color: #16568d;
    transform: translateY(-2px);
}

/* 6. スマホ用メニューボタン */
.menu-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    width: 40px;
    height: 40px;
    position: relative;
    z-index: 10002; /* メニューより上に */
    padding: 0;
}
.menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background-color: #333;
    position: absolute;
    left: 8px;
    transition: all 0.3s;
}
.menu-toggle span:nth-child(1) { top: 12px; }
.menu-toggle span:nth-child(2) { top: 19px; }
.menu-toggle span:nth-child(3) { top: 26px; }

.menu-toggle.is-active span:nth-child(1) { top: 19px; transform: rotate(45deg); }
.menu-toggle.is-active span:nth-child(2) { opacity: 0; }
.menu-toggle.is-active span:nth-child(3) { top: 19px; transform: rotate(-45deg); }

/* 7. スマホ用ドロワーメニュー */
.mobile-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100vh;
    z-index: 10001;
    transition: right 0.4s ease;
}
.mobile-menu.is-active { right: 0; }

.mobile-menu-inner {
    position: absolute;
    top: 0;
    right: 0;
    width: 80%;
    max-width: 300px;
    height: 100%;
    background: #fff;
    padding: 80px 20px 40px;
    z-index: 2;
    overflow-y: auto;
    box-shadow: -2px 0 10px rgba(0,0,0,0.1);
}

.mobile-menu-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 1;
    opacity: 0;
    transition: opacity 0.4s;
    pointer-events: none;
}
.mobile-menu.is-active .mobile-menu-bg { opacity: 1; pointer-events: auto; }

.mobile-nav-list { list-style: none; padding: 0; margin-bottom: 30px; }
.mobile-nav-list li { border-bottom: 1px solid #eee; }
.mobile-nav-list a { display: block; padding: 15px 0; color: #333; text-decoration: none; font-weight: bold; }
.mobile-menu-btn { text-align: center; }
.mobile-ver.btn-header-submit { width: 100%; justify-content: center; padding: 15px; }
.mobile-menu-close { text-align: center; margin-top: 30px; }
#menu-close { background: none; border: 1px solid #ccc; padding: 8px 20px; border-radius: 4px; }

/* 8. レスポンシブ切り替え */
@media (max-width: 1050px) {
    .header-nav-pc { display: none; }
    .menu-toggle { display: block; }
    .header-site-desc { display: none; }
}
body.menu-open { overflow: hidden; }

/* =========================================
   ヘッダー崩れ防止（WordPress自動挿入タグ対策）
   ========================================= */

/* ヘッダー内の br タグを無効化 */
.site-header-custom br {
    display: none !important;
}

/* ヘッダー内の空の p タグを無効化 */
.site-header-custom p:empty {
    display: none !important;
}

/* 説明文（pタグ）は表示しつつ、余計な余白を消す */
.site-header-custom .header-site-desc {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* リンクの中に勝手に入った br や p の影響を消す */
.site-header-custom a {
    display: inline-flex;
    align-items: center;
}

/* =========================================
   ヘッダー崩れ修正（WordPress自動pタグ対策）
   ========================================= */

/* ヘッダー内にある「pタグ」の枠（ボックス）を消滅させる */
.header-inner > p {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* =========================================
   トップページ：メインスライダー（修正版：中央寄せ・影なし）
   ========================================= */

.main-visual-section {
    position: relative;
    width: 100%;
    /* 高さは現状維持（没入感重視） */
    height: calc(100vh - 70px);
    min-height: 600px;
    background: #000;
    overflow: hidden;
}

.swiper, .swiper-wrapper, .swiper-slide {
    width: 100%;
    height: 100%;
}

/* 背景画像 */
.slide-bg {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    animation: zoomUp 20s linear infinite; /* 動きも少しゆっくりに */
}
@keyframes zoomUp {
    0% { transform: scale(1); }
    100% { transform: scale(1.1); }
}

/* フィルター */
.slide-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.45);
    z-index: 2;
}

/* コンテンツ（中央寄せ設定） */
.slide-content {
    position: relative;
    z-index: 3;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* ▼▼▼ ここを変更：中央寄せ ▼▼▼ */
    align-items: center;
    text-align: center;
    /* ▲▲▲ ここまで ▲▲▲ */
    padding: 0 5%;
    max-width: 1200px;
    margin: 0 auto;
    color: #fff !important;
    text-shadow: 0 2px 10px rgba(0,0,0,0.8);
}

/* タイトル */
.slide-title {
    font-size: 3.5rem;
    font-weight: bold;
    margin-bottom: 20px;
    line-height: 1.2;
    letter-spacing: 0.05em;
    color: #fff !important;
}

/* 説明文 */
.slide-desc {
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 40px;
    max-width: 700px;
    /* 中央配置のために左右マージン自動 */
    margin-left: auto;
    margin-right: auto;
    color: #fff !important;
}

/* リンクボタン */
.slide-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #1F6CAB;
    color: #fff !important;
    text-decoration: none;
    padding: 15px 40px;
    border-radius: 50px;
    font-size: 1rem;
    font-weight: bold;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(31, 108, 171, 0.4);
    /* ボタン自体に文字影はいらない */
    text-shadow: none !important;
}

/* ホバー時の設定（影なし） */
.slide-btn:hover {
    background: #fff;
    color: #1F6CAB !important;
    transform: translateY(-3px);
    /* ▼▼▼ ここを追加：ホバー時も文字影なし ▼▼▼ */
    text-shadow: none !important;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .main-visual-section {
        height: 80vh;
        min-height: 500px;
    }
    .slide-content {
        padding: 0 15px; /* 余白を少し減らして文字スペースを確保 */
    }
    .slide-title {
        /* ▼変更：サイズを少し小さくし、文節キープ設定を追加 */
        font-size: 1.5rem; /* 1.8rem → 1.5rem */
        line-height: 1.4;
        word-break: keep-all; /* 日本語の単語の途中での改行を防ぐ */
        overflow-wrap: anywhere; /* 画面からはみ出る場合は強制改行（保険） */
        width: 100%; /* 横幅いっぱい使う */
    }
    .slide-desc {
        font-size: 0.9rem; /* 少し小さく */
        line-height: 1.6;
        margin-bottom: 30px;
        /* ▼変更：説明文も変な改行を防ぐ */
        word-break: keep-all;
        overflow-wrap: anywhere;
    }
    .slide-btn {
        width: 100%;
        justify-content: center;
        max-width: 280px; /* ボタンも少しスリムに */
        padding: 12px 20px;
    }
}

/* =========================================
   イベント詳細ページの追加スタイル（バッジ）
   ========================================= */

.status-badges {
    margin-bottom: 8px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.status-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: bold;
    line-height: 1.2;
    color: #fff;
    background-color: #999; /* デフォルト */
}

/* 無料・予約不要（ポジティブ・目立たせる） */
.status-badge.is-free {
    background-color: #e67e22; /* オレンジ */
    border: 1px solid #e67e22;
}

/* 有料・要予約（注意） */
.status-badge.is-paid {
    background-color: #fff;
    color: #666;
    border: 1px solid #ccc;
}

/* 一部有料・一部要予約（中間） */
.status-badge.is-partial {
    background-color: #fff;
    color: #e67e22;
    border: 1px solid #e67e22;
}

.status-detail-text {
    font-size: 0.95rem;
    line-height: 1.6;
    margin-top: 5px;
}

/* =========================================
   スマホ表示：イベント一覧の余白調整
   （トップページの崩れを防止するため限定適用）
   ========================================= */
@media (max-width: 768px) {

    /* アーカイブ（一覧）と検索結果ページのみ、左右に20pxの余白を入れる */
    .archive .event-list,
    .search .event-list {
        padding-left: 34.4px;
        padding-right: 34.4px;
        box-sizing: border-box;
    }

    /* 検索結果のタイトル（「○○のイベント」など）も同様に調整 */
    .archive .event-search-heading,
    .search .event-search-heading {
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
    }

    /* ※トップページ（.home）は、テーマの標準設定（has-global-padding）にお任せすることで
       二重余白による崩れを防ぎます */
}

/* =========================================
   スライダーのページネーション（点の位置）調整
   ========================================= */

/* PC表示：検索フォームと被らないように位置を大きく上げる */
.swiper-pagination {
    /* 検索フォームの被り(約80px) + 余白分 = 下から140pxの位置へ */
    bottom: 140px !important;

    /* ついでに、点が小さすぎると見にくいので少し調整 */
    z-index: 10 !important; /* 確実に手前に表示 */
}

/* スマホ表示：検索フォームは被らないので、通常の位置（下の方）に戻す */
@media (max-width: 768px) {
    .swiper-pagination {
        bottom: 20px !important;
    }
}

/* =========================================
   スマホ表示：アーカイブ・検索結果ページの余白再調整
   （クラス名変更に伴う修正）
   ========================================= */
@media (max-width: 768px) {
    /* 新しいグリッド表示（.event-list-grid）に対して余白を追加 */
    .archive .event-list-grid,
    .search .event-list-grid {
        padding-left: 34px;
        padding-right: 34px;
        box-sizing: border-box;
    }

    /* ページタイトル（「〇〇のイベント」等）も同様に調整 */
    .archive .event-search-heading,
    .search .event-search-heading {
        padding-left: 34px;
        padding-right: 34px;
        box-sizing: border-box;
    }
}

/* =========================================
   スマホ表示：詳細ページ（投稿・固定ページ）の余白修正
   ========================================= */
@media (max-width: 768px) {
    /* 記事本文エリア全体に余白を持たせる */
    .single .entry-content,
    .page .entry-content,
    .single article,
    .page article,
    .archive .wp-site-blocks {
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
    }

    /* タイトル周りなど、本文エリアの外にある要素用 */
    .single .entry-header,
    .page .entry-header {
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
    }
}

/* =========================================
   スマホ表示：詳細ページ内のテーブル・ボタン位置修正
   ========================================= */
@media (max-width: 768px) {
    /* 開催情報のテーブルを強制的に幅100%にして左に寄せる */
    .single .entry-content table,
    .single table {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        table-layout: fixed; /* 枠内に強制的に収める */
    }

    /* ボタン（詳細ページへ、など）の位置修正 */
    .single .entry-content .wp-block-buttons,
    .single .entry-content .wp-block-button,
    .single .entry-content .btn-external, /* もし独自のボタンクラスがあれば */
    .single .wp-block-file {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center; /* ボタン内の文字は中央 */
        justify-content: center; /* フレックス配置の場合の中央寄せ */
    }

    /* テーブル内の文字がはみ出さないように調整 */
    .single table th,
    .single table td {
        word-break: break-all; /* 長いURLなどで崩れないように改行 */
        white-space: normal;
    }
}

/* =========================================
   スマホ表示：ボタンとテーブルのサイズ計算修正
   ========================================= */
@media (max-width: 768px) {
    /* 1. ボタンのはみ出し修正 */
    .btn-action,
    .wp-block-button__link {
        /* 「幅100% + 余白」ではなく「余白込みで100%」にする魔法の記述 */
        box-sizing: border-box !important;

        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* 2. テーブルのはみ出し修正 */
    .entry-content table,
    .entry-content th,
    .entry-content td {
        box-sizing: border-box !important;
    }

    /* テーブルの余白を少し減らして、画面に収まりやすくする */
    .entry-content th,
    .entry-content td {
        padding: 10px 5px !important; /* 上下10px, 左右5pxに縮小 */
        font-size: 14px; /* 文字も少し小さくして改行崩れを防ぐ */
    }
}

/* =========================================
   スマホ表示：.event-table の余白とはみ出し修正
   ========================================= */
@media (max-width: 768px) {
    /* 特定のクラス名(.event-table)を指定して強制上書き */
    .event-table {
        width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    .event-table th,
    .event-table td {
        /* 15pxだとスマホには広すぎるので、8px(上下) 4px(左右) くらいまで狭くする */
        padding: 8px 4px !important;

        /* 余白を含めて幅を計算させる */
        box-sizing: border-box !important;

        /* 文字サイズも少し下げて改行しやすくする */
        font-size: 14px;
        word-break: break-all; /* URLなどが突き抜けないように */
    }
}

/* =========================================
   iPhone実機対策：ロゴ画像が大きすぎる問題の修正
   ========================================= */
@media (max-width: 768px) {
    /* ヘッダー内の画像を強制的に小さくする */
    header img,
    .site-header img,
    .custom-logo-link img {
        /* 画面幅の半分（50%）または最大180pxまでしか広がらないように制限 */
        max-width: 180px !important;
        max-width: 25vw !important;

        height: auto !important; /* 縦横比は崩さない */
        object-fit: contain;
    }

    /* ロゴが入っている枠自体の調整（Flexbox対策） */
    .site-branding,
    .site-logo {
        flex-shrink: 1 !important; /* 狭くなったら自分が縮むことを許可 */
        min-width: 0 !important;   /* コンテンツ幅以下になってもよい */
        overflow: hidden;          /* はみ出し防止 */
    }
}

/* =========================================
   スマホ表示：イベント一覧を2カラム（Pinterest風）に変更
   ========================================= */
@media (max-width: 768px) {

    /* 1. グリッドを2列にする */
    .event-list-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* 強制的に2列 */
        gap: 12px !important; /* 隙間を少し詰める（15pxだと広い） */
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    /* 2. 画像の高さを調整（縦長すぎると画面を占領するため） */
    .card-thumb {
        padding-top: 135% !important; /* A4(141%)より少しだけ短くして見やすく */
    }

    /* 3. カード内の余白を詰める */
    .card-body {
        padding: 10px 8px !important; /* 狭いので余白を減らす */
    }

    /* 4. タイトル文字サイズ調整 */
    .card-title {
        font-size: 0.85rem !important; /* 14px相当 */
        line-height: 1.4 !important;
        margin-bottom: 5px !important;

        /* 3行以上は「...」で省略（レイアウト崩れ防止） */
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* 5. 日付やエリアタグのサイズ調整 */
    .card-date {
        font-size: 0.7rem !important;
    }
    .card-venue {
        font-size: 0.7rem !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis; /* 長い会場名は「...」 */
    }

    /* タグ（エリア・カテゴリ）を小さくして折り返しやすくする */
    .meta-tag {
        font-size: 0.65rem !important;
        padding: 2px 4px !important;
        margin-bottom: 2px !important;
    }

    /* NEWバッジのサイズ調整 */
    .event-badge {
        font-size: 0.6rem !important;
        padding: 2px 6px !important;
    }

    /* 記事本文エリア全体に余白を持たせる */
    #event-list article {
        padding-left: 0px;
        padding-right: 0px;
    }
/* ▼▼▼ 追加：タグエリアを強制的に縦並びにする ▼▼▼ */
    .card-meta-bottom {
        flex-direction: column !important; /* 横並びではなく「縦並び」に指定 */
        align-items: flex-start !important; /* 左揃え */
        gap: 4px !important; /* 上下の隙間調整 */
    }

    /* タグ自体が横に伸びすぎないように調整 */
    .meta-tag {
        width: auto !important;
        max-width: 100%;
    }
}

/* =========================================
   はみ出し防止：ボックスサイズの計算ルールを統一
   ========================================= */
*, *::before, *::after {
    /* 「幅」の中にpaddingとborderを含める設定 */
    box-sizing: border-box !important;
}

/* =========================================
   特集記事（feature-article）ヘッダー・装飾修正
   ========================================= */

/* ----------------------------------
   1. 記事タイトル（H1）のデザイン変更
   ---------------------------------- */
/* デフォルトの巨大なタイトルを調整し、雑誌の見出し風にする */
body.feature-article h1.wp-block-post-title {
    text-align: center;          /* 中央寄せ */
    font-size: clamp(24px, 4vw, 36px); /* スマホ〜PCで可変 */
    font-weight: 700;            /* 太字 */
    line-height: 1.4;
    color: #333;
    max-width: 900px;            /* 横幅を制限 */
    margin: 40px auto 20px auto; /* 上下の余白 */
    padding: 0 20px;
}

/* ----------------------------------
   2. アイキャッチ画像（Featured Image）の制御
   ---------------------------------- */
/* 画面いっぱいに広がるのを防ぎ、バナー風にする */
body.feature-article .wp-block-post-featured-image {
    margin: 0 auto 60px auto;    /* 中央配置＆下の余白を広めに */
    max-width: 1000px;           /* 本文より少し広くしてメリハリをつける */
    padding: 0 20px;             /* スマホで端が切れないように */
}
@media (max-width: 768px) {
    body.feature-article .wp-block-post-featured-image {
        padding: 0;             /* スマホで端が切れないように */
    }
}


body.feature-article .wp-block-post-featured-image img {
    width: 100%;
    height: 400px;               /* 【重要】高さを400pxに固定 */
    object-fit: cover;           /* 画像が歪まないようにトリミング */
    border-radius: 12px;         /* 角丸にして優しい印象に */
    box-shadow: 0 10px 25px rgba(0,0,0,0.1); /* ふんわりとした影 */
}

/* スマホでは高さを少し低くする */
@media (max-width: 768px) {
    body.feature-article .wp-block-post-featured-image img {
        height: 250px;
    }
}

/* ----------------------------------
   3. 投稿日・カテゴリーなどのメタ情報
   ---------------------------------- */
/* タイトルと画像の間に配置される想定 */
body.feature-article .wp-block-post-date,
body.feature-article .taxonomy-feature_category {
    text-align: center;
    font-size: 0.9rem;
    color: #888;
    margin-bottom: 10px;
    display: block;
    font-family: "Helvetica Neue", Arial, sans-serif;
}

/* 日付の前にアイコンをつける（疑似要素） */
body.feature-article .wp-block-post-date::before {
    content: "🕒"; /* 時計アイコン（必要に応じてdashiconに変更可） */
    margin-right: 5px;
    opacity: 0.6;
}

/* ----------------------------------
   4. リード文（導入文）の強調
   ---------------------------------- */
/* 最初の段落（p）だけデザインを変えて「導入」っぽくする */
/* ※本文の最初のブロックがpタグの場合のみ適用 */
body.feature-article .entry-content > p:first-of-type {
    font-size: 1.1rem;       /* 文字を少し大きく */
    font-weight: bold;       /* 太字に */
    color: #555;
    background: #f4f8fb;     /* 薄い青背景 */
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 50px !important;
}

/* ----------------------------------
   5. 既存CSSの微調整（優先度調整）
   ---------------------------------- */
/* 本文エリアの最大幅指定を確実に効かせる */
body.feature-article .wp-block-post-content,
body.feature-article .entry-content {
    max-width: 840px !important;
    margin: 0 auto !important;
    padding: 0;
}

@media (max-width: 768px) {
body.feature-article .wp-block-post-content, body.feature-article .entry-content {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* =========================================
   特集記事：本文のデザインと余白（強制上書き）
   ========================================= */

/* 1. 全体の「縦のリズム」を強制的に復活させる
   （WordPressの margin:0 を打ち消すための記述） */
body.feature-article .wp-block-post-content > *,
body.feature-article .entry-content > * {
    margin-block-start: 0;
    margin-block-end: 0;
    margin-bottom: 2rem; /* すべてのブロックの下に基本の余白を入れる */
}

/* 最後の要素だけ余白を消す */
body.feature-article .wp-block-post-content > *:last-child {
    margin-bottom: 0;
}


/* 2. 段落（Pタグ）
   読みやすさの基本となる部分です */
body.feature-article .wp-block-post-content p {
    font-size: 1rem;       /* 16px相当 */
    line-height: 1.9;      /* 行間を広めに取って読みやすく */
    color: #333;           /* 真っ黒ではなく濃いグレー */
    margin-bottom: 2.5rem; /* 段落ごとの区切りをしっかりつける */
    letter-spacing: 0.03em;
    text-align: justify;   /* 両端揃え（見た目が整います） */
}


/* 3. 見出しのデザイン
   記事の区切りを明確にします */

/* 大見出し（H2）: セクションの変わり目 */
body.feature-article .wp-block-post-content h2 {
    font-size: 1.6rem;
    font-weight: 700;
    color: #1F6CAB;        /* メインカラー */
    margin-top: 5rem;      /* 前の話題との距離を大きく取る */
    margin-bottom: 2rem;
    padding-bottom: 10px;
    border-bottom: 3px solid #1F6CAB; /* 下線でバシッと区切る */
    line-height: 1.4;
}

/* 中見出し（H3）: 小話の変わり目 */
body.feature-article .wp-block-post-content h3 {
    font-size: 1.3rem;
    font-weight: 700;
    margin-top: 3.5rem;
    margin-bottom: 1.5rem;
    padding: 8px 15px;
    background-color: #f0f7fc; /* ごく薄い青背景 */
    border-left: 5px solid #1F6CAB; /* 左にアクセントバー */
    border-radius: 0 4px 4px 0;
    color: #333;
}

/* 小見出し（H4）: ポイントなど */
body.feature-article .wp-block-post-content h4 {
    font-size: 1.1rem;
    font-weight: 700;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    color: #1F6CAB;
}
/* H4の前にアイコン的な丸をつける */
body.feature-article .wp-block-post-content h4::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #1F6CAB;
    border-radius: 50%;
    margin-right: 10px;
}

/* =========================================
   インタビュー記事用ヘッダーデザイン
   （.interview-header クラスがついたグループ内のスタイル）
   ========================================= */

/* 1. グループ全体の余白調整 */
body.feature-article .wp-block-post-content .interview-header {
    margin-top: 5rem;      /* 通常のH2と同じくらい空ける */
    margin-bottom: 2rem;   /* 下の画像との余白 */
    border-left: 6px solid #1F6CAB; /* 左に太い線を入れて一体感を出す */
    padding-left: 20px;    /* 左線の内側に余白 */
    background: transparent; /* 背景はなし（必要なら #f9f9f9 等） */
}

/* 2. インタビュー用の見出し（H2）の上書き */
/* 既存のH2スタイルを打ち消して、キャッチコピー風にする */
body.feature-article .wp-block-post-content .interview-header h2 {
    margin-top: 0 !important;    /* 上の余白を消す */
    margin-bottom: 0.5rem !important; /* 下の余白を詰める */
    border-bottom: none !important;   /* 下線を消す */
    padding-bottom: 0 !important;
    font-size: 1.8rem;           /* 少し大きくしてインパクトを出す */
    line-height: 1.3;
    color: #333;                 /* 色を黒に戻す（好みで青のままでもOK） */
}

/* 3. 肩書き・名前（Pタグ）のデザイン */
/* H2のすぐ下に来るテキスト */
body.feature-article .wp-block-post-content .interview-header p {
    margin-bottom: 0 !important; /* 余白を消す */
    font-size: 1rem;
    color: #666;                 /* 少し薄くする */
    font-weight: bold;
    line-height: 1.6;
    text-align: left;            /* 左揃え（右寄せにしたい場合は right） */
}

/* （オプション）名前を強調したい場合 */
body.feature-article .wp-block-post-content .interview-header p strong {
    font-size: 1.2rem;
    color: #1F6CAB;            /* 名前だけ青くする */
    margin-left: 10px;
}

/* =========================================
   特集記事：スマホ表示の最適化（余白圧縮）
   ========================================= */

@media (max-width: 768px) {

    /* 1. 見出しの余白を詰める */
    body.feature-article .wp-block-post-content h2 {
        margin-top: 3rem !important;      /* 5rem → 3rem */
        margin-bottom: 1.5rem !important; /* 2rem → 1.5rem */
        font-size: 1.4rem !important;     /* 文字サイズも少し控えめに */
    }

    body.feature-article .wp-block-post-content h3 {
        margin-top: 2.5rem !important;    /* 3.5rem → 2.5rem */
        margin-bottom: 1rem !important;   /* 1.5rem → 1rem */
        font-size: 1.2rem !important;
    }

    body.feature-article .wp-block-post-content h4 {
        margin-top: 2rem !important;      /* 2.5rem → 2rem */
        margin-bottom: 0.8rem !important;
    }

    /* 2. 段落（本文）の余白を詰める */
    body.feature-article .wp-block-post-content p {
        margin-bottom: 1.5rem !important; /* 2.5rem → 1.5rem */
        line-height: 1.7 !important;      /* 行間も少しだけタイトに */
        font-size: 0.95rem !important;    /* スマホで読みやすいサイズに微調整 */
        text-align: left !important;      /* スマホは左揃えの方が自然（両端揃え解除） */
    }

    /* 3. 画像・引用・リストの余白圧縮 */
    body.feature-article .wp-block-post-content figure,
    body.feature-article .wp-block-post-content blockquote,
    body.feature-article .wp-block-post-content ul,
    body.feature-article .wp-block-post-content ol {
        margin-top: 2rem !important;      /* 3rem → 2rem */
        margin-bottom: 2rem !important;
    }

    /* 4. リストの内側の余白調整 */
    body.feature-article .wp-block-post-content ul,
    body.feature-article .wp-block-post-content ol {
        padding: 20px !important; /* パディングも少し減らす */
    }

    /* 5. 引用（blockquote）の文字サイズ調整 */
    body.feature-article .wp-block-post-content blockquote {
        padding: 20px !important;
    }
    body.feature-article .wp-block-post-content blockquote::before {
        font-size: 40px !important; /* 引用符アイコンも小さく */
        left: 10px !important;
    }

    /* 6. アイキャッチ画像の高さ調整（もし大きすぎる場合） */
    body.feature-article .wp-block-post-featured-image img {
        height: 250px !important; /* スマホではこのくらいがベスト */
    }
}

/* 4. リスト（箇条書き）のデザイン
   情報を見やすく整理します */
body.feature-article .wp-block-post-content ul,
body.feature-article .wp-block-post-content ol {
    background: #fff;
    border: 2px solid #E4F2FB; /* 薄い青枠 */
    border-radius: 8px;
    padding: 25px 25px 25px 40px; /* 左側はマーカー用に空ける */
    margin-bottom: 3rem;
}

body.feature-article .wp-block-post-content li {
    margin-bottom: 10px;
    line-height: 1.7;
}
body.feature-article .wp-block-post-content li:last-child {
    margin-bottom: 0;
}


/* 5. 引用（インタビューなど）のデザイン */
body.feature-article .wp-block-post-content blockquote {
    position: relative;
    padding: 30px;
    background: #f9f9f9;
    border-radius: 8px;
    margin: 3rem 0;
    font-style: normal; /* 斜体にしない */
}

/* 引用符の装飾 */
body.feature-article .wp-block-post-content blockquote::before {
    content: "“";
    font-family: serif;
    position: absolute;
    top: -10px;
    left: 15px;
    font-size: 60px;
    color: #1F6CAB;
    opacity: 0.3;
    line-height: 1;
}

body.feature-article .wp-block-post-content blockquote p {
    margin-bottom: 0; /* 引用内のPタグ余白調整 */
    font-size: 1rem;
}
body.feature-article .wp-block-post-content blockquote cite {
    display: block;
    margin-top: 15px;
    text-align: right;
    font-size: 0.85rem;
    color: #777;
    font-style: normal;
}


/* 6. 画像の余白 */
body.feature-article .wp-block-post-content figure {
    margin-top: 3rem;
    margin-bottom: 3rem;
}
body.feature-article .wp-block-post-content figcaption {
    font-size: 0.85rem;
    color: #888;
    text-align: center;
    margin-top: 10px;
}

/* =========================================
   特集記事：タイトル上の余白を詰める修正
   ========================================= */

/* 1. ページ全体のコンテンツ開始位置を強制的に上げる */
/* テーマ標準の上下余白をキャンセル */
body.feature-article .wp-site-blocks {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* 2. 記事タイトル（H1）の上の余白を削除 */
/* 前回 40px にしていたのを 10px まで詰めます */
body.feature-article h1.wp-block-post-title {
    margin-top: 40px !important; /* ヘッダーとの最低限の隙間 */
    padding-top: 0 !important;
}

/* 3. もしタイトルの周りを囲むグループブロックに余白がある場合 */
/* コンテンツの一番外側のグループの余白を消す */
body.feature-article main > .wp-block-group,
body.feature-article .entry-content > .wp-block-group:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* =========================================
   特集記事：本文内の画像を角丸にする
   ========================================= */

/* 記事本文内のすべての画像（標準ブロック、ギャラリーなど含む） */
body.feature-article .wp-block-post-content img,
body.feature-article .entry-content img {
    border-radius: 12px; /* 他の要素に合わせて程よい丸みに */
    box-shadow: 0 4px 10px rgba(0,0,0,0.05); /* うっすら影をつけて立体感を出す */
    height: auto; /* 念のため縦比率崩れ防止 */
}

/* 注釈（キャプション）が付く場合のデザイン調整 */
body.feature-article .wp-block-post-content figcaption {
    margin-top: 8px;
    font-size: 0.85rem;
    color: #777;
    text-align: center;
}

/* =========================================
   イベント告知カード (おすすめスライダー仕様)
   ========================================= */

:root {
    --feature-color-main: #1f6cab;
    --feature-color-hover: #164f7d;
    --feature-color-accent: #e63946;
    --feature-color-bg-light: #f0f5fa;
}

body.feature-article .event-card-wrapper {
    margin: 50px 0;
}

body.feature-article .event-card-link {
    display: block;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    color: #333;
    box-shadow: 0 4px 15px rgba(31, 108, 171, 0.1);
    transition: transform 0.3s, box-shadow 0.3s;
}

body.feature-article .event-card-link:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(31, 108, 171, 0.25);
    border-color: var(--feature-color-main);
}

body.feature-article .event-card-inner {
    display: flex;
    align-items: stretch;
}

/* --- 画像エリア（スライダーと同じ仕様） --- */
body.feature-article .event-card-thumb-box {
    width: 38%; /* PCでの幅 */
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
    /* PCでは高さをコンテンツに合わせるため padding-top固定にはしないが、
       最低限の高さを確保する */
    min-height: 220px;
}

/* 1. 背景のぼかしレイヤー */
body.feature-article .event-card-thumb-box .thumb-bg {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-size: cover;
    background-position: center;
    filter: blur(10px); /* スライダーと同じ */
    opacity: 0.6;       /* スライダーと同じ */
    z-index: 1;
    transition: transform 0.5s;
}

/* 2. メイン画像（絶対配置で中央寄せ） */
body.feature-article .event-card-thumb-box img {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%); /* ど真ん中に配置 */
    max-width: 100%; max-height: 100%;
    object-fit: contain;
    z-index: 2;
    transition: transform 0.5s;
}

/* ホバー時のアクション */
body.feature-article .event-card-link:hover .thumb-bg {
    transform: scale(1.1); /* 背景だけ少し拡大 */
}
body.feature-article .event-card-link:hover img {
    transform: translate(-50%, -50%) scale(1.05); /* メイン画像も少し拡大 */
}


/* --- コンテンツエリア --- */
body.feature-article .event-card-content {
    width: 62%;
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #fff;
    position: relative;
    z-index: 2;
}

/* タグデザイン */
body.feature-article .event-card-tags {
    margin-bottom: 12px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

body.feature-article .event-card-tags span {
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 50px;
    font-weight: bold;
    color: #fff;
    letter-spacing: 0.05em;
}

.tag-label { background: #333; }
.tag-blue { background: var(--feature-color-main); }
.tag-blue-light {
    background: #fff;
    color: var(--feature-color-main) !important;
    border: 1px solid var(--feature-color-main);
}
.tag-gray { background: #757575; }
.tag-accent { background: var(--feature-color-hover); }

/* タイトル */
body.feature-article .event-card-title {
    margin: 0 0 15px 0 !important;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.4;
    border: none !important;
    padding: 0 !important;
    color: #333;
}

body.feature-article .event-card-link:hover .event-card-title {
    color: var(--feature-color-main);
}

/* 情報リスト */
body.feature-article .event-card-info {
    list-style: none;
    margin: 0;
    padding: 0;
}

body.feature-article .event-card-info li {
    display: flex;
    align-items: start;
    margin-bottom: 8px;
    font-size: 14px;
    color: #555;
    line-height: 1.5;
}

body.feature-article .event-card-info .icon {
    margin-right: 10px;
    font-size: 16px;
    width: 20px;
    text-align: center;
    color: var(--feature-color-main);
}

/* 下部ボタン */
body.feature-article .event-card-btn {
    background: var(--feature-color-bg-light);
    color: var(--feature-color-main);
    text-align: center;
    padding: 15px;
    font-weight: bold;
    font-size: 15px;
    border-top: 1px solid #eee;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    transition: all 0.3s;
}

body.feature-article .event-card-btn .arrow {
    transition: transform 0.3s;
}

body.feature-article .event-card-link:hover .event-card-btn {
    background: var(--feature-color-main);
    color: #fff;
}

body.feature-article .event-card-link:hover .event-card-btn .arrow {
    transform: translateX(5px);
}

/* --- スマホ対応 (600px以下) --- */
@media (max-width: 600px) {
    body.feature-article .event-card-inner {
        flex-direction: column;
    }

    body.feature-article .event-card-thumb-box {
        width: 100%;
        /* スマホではスライダーと全く同じ比率にする */
        height: 0;
        padding-top: 60%; /* スライダーと同じ比率 (60%) */
        min-height: auto;
    }

    body.feature-article .event-card-content {
        width: 100%;
        padding: 20px;
    }

    body.feature-article .event-card-title {
        font-size: 18px;
    }
}

/* =========================================
   特集記事一覧 (ショートコード版) CSS
   ========================================= */

.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* PCは3列 */
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* カード全体 */
.feature-archive-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #eee;
    transition: transform 0.3s, box-shadow 0.3s;
    height: 100%;
}

.feature-archive-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

.feature-card-link {
    text-decoration: none;
    color: #333;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* 画像エリア */
.feature-card-img-box {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
    overflow: hidden;
    background: #f0f0f0;
}

.feature-card-img-box img {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.feature-archive-card:hover .feature-card-img-box img {
    transform: scale(1.05);
}

/* カテゴリーラベル */
.feature-cat-label {
    position: absolute;
    top: 15px; right: 15px;
    background: #1f6cab; /* コンセプトカラー */
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    padding: 4px 10px;
    border-radius: 20px;
    z-index: 2;
}

/* テキストエリア */
.feature-card-body {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.feature-title {
    font-size: 18px;
    font-weight: bold;
    margin: 0 0 10px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.feature-excerpt {
    font-size: 13px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex-grow: 1; /* 日付を下揃えにするため */
}

.feature-date {
    font-size: 12px;
    color: #999;
    border-top: 1px solid #eee;
    padding-top: 10px;
    width: 100%;
}

/* ページネーション */
.feature-pagination {
    margin: 50px 0;
    text-align: center;
}
.feature-pagination a,
.feature-pagination span {
    display: inline-block;
    padding: 8px 15px;
    margin: 0 5px;
    border: 1px solid #ddd;
    color: #333;
    text-decoration: none;
    border-radius: 4px;
}
.feature-pagination .current {
    background: #1f6cab;
    color: #fff;
    border-color: #1f6cab;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .feature-grid {
        grid-template-columns: 1fr; /* 1列 */
        gap: 20px;
    }
}

/* =========================================
   スポンサー広告セクション (全ページ共通)
   ========================================= */

/* セクション全体 */
.sponsor-section {
    max-width: 1000px;
    margin: 60px auto;
    padding: 30px 20px;
    background: #f9f9f9;
    text-align: center;
    border-radius: 8px;
    box-sizing: border-box; /* 崩れ防止 */
}

.sponsor-heading {
    font-size: 1.2rem;
    color: #999;
    margin-bottom: 20px;
    letter-spacing: 0.1em;
    font-family: sans-serif;
    font-weight: bold;
}

/* グリッドレイアウト (PC: 5列) */
.sponsor-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 15px;
    align-items: center;
    width: 100%; /* 幅を確保 */
}

/* 画像の調整 */
.sponsor-item {
    display: flex; /* 追加：枠内で中央寄せ */
    justify-content: center;
}

.sponsor-item img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 4px;
    transition: opacity 0.3s, transform 0.3s;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.sponsor-item a {
    display: block;
    width: 100%;
}

.sponsor-item a:hover img {
    opacity: 0.8;
    transform: translateY(-2px);
}

/* 募集リンク */
.sponsor-recruit {
    margin-top: 20px;
    font-size: 0.8rem;
}
.sponsor-recruit a {
    color: #888;
    text-decoration: none;
}
.sponsor-recruit a:hover {
    text-decoration: underline;
}

/* スマホ対応 (2列) */
@media (max-width: 768px) {
    .sponsor-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}

/* =========================================
   カテゴリー・エリア・条件別リンク一覧 [event_taxonomy_links]
   デザイン統一・修正版
   ========================================= */

/* コンテナ */
.tax-links-container {
    max-width: 1000px;
    margin: 60px auto 40px;
    padding: 0 20px;
    box-sizing: border-box;
}

/* セクション */
.tax-links-container .tax-section {
    margin-bottom: 40px;
}

/* タイトル */
.tax-links-container .tax-title {
    font-size: 1.1rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    line-height: 1.4;
}

.tax-links-container .tax-title .dashicons {
    color: #1F6CAB;
    font-size: 1.2rem;
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
}

/* リスト */
.tax-links-container .tax-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
    padding: 0;
}

/* ▼▼▼ ボタン本体のデザイン（ここを強力に修正） ▼▼▼ */
.tax-links-container .tax-btn {
    display: inline-block !important; /* 強制的にブロック化 */
    padding: 8px 16px !important;      /* 強制的に余白を確保 */
    border-radius: 30px !important;    /* 強制的に角丸にする */
    text-decoration: none !important;  /* 強制的に下線を消す */
    font-size: 0.9rem;
    transition: all 0.2s ease;
    border: 1px solid transparent;
    line-height: 1.4;
    background-image: none; /* テーマ背景の影響をリセット */
    box-shadow: 0 1px 2px rgba(0,0,0,0.05); /* 薄い影でボタン感を出す */
}

/* ホバー時 */
.tax-links-container .tax-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    text-decoration: none !important;
}

/* ▼▼▼ 色分け（セレクタを強化） ▼▼▼ */

/* カテゴリー（白背景・枠線） */
.tax-links-container .cat-btn {
    background: #fdfdfd;
    border-color: #ddd;
    color: #555;
}
.tax-links-container .cat-btn:hover {
    background: #fff;
    border-color: #1F6CAB;
    color: #1F6CAB;
}

/* エリア（薄い青） */
.tax-links-container .area-btn {
    background: #f4f8fb;
    color: #1F6CAB;
    border-color: #cce0f0;
}
.tax-links-container .area-btn:hover {
    background: #1F6CAB;
    color: #fff;
    border-color: #1F6CAB;
}

/* こだわり条件（薄い黄色） */
.tax-links-container .target-btn {
    background: #fff8e1;
    color: #d89600;
    border-color: #f5e0a0;
}
.tax-links-container .target-btn:hover {
    background: #fbc02d;
    color: #fff;
    border-color: #fbc02d;
}

/* スマホ調整 */
@media (max-width: 768px) {
    .tax-links-container {
        margin: 40px auto;
        padding: 0 15px;
    }
    .tax-links-container .tax-btn {
        font-size: 0.85rem;
        padding: 6px 12px !important;
    }
}

/* ==============================================
   イベント修正依頼フォーム（Page ID: 914）専用デザイン
   ============================================== */

/* フォーム全体の枠 */
.page-id-914 .wpcf7 {
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    border: 1px solid #eee;
    box-shadow: 0 0 20px rgba(0,0,0,0.05);
    max-width: 800px;
    margin: 20px auto 60px;
}

/* 項目ラベル */
.page-id-914 .wpcf7 label,
.page-id-914 .wpcf7 .label-text {
    display: block;
    font-weight: bold;
    margin-bottom: 8px;
    margin-top: 20px;
    color: #333;
    font-size: 1rem;
}

/* 入力フィールド */
.page-id-914 .wpcf7 input[type="text"],
.page-id-914 .wpcf7 input[type="email"],
.page-id-914 .wpcf7 textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
    background: #fcfcfc;
    box-sizing: border-box;
    transition: all 0.3s;
}

/* フォーカス時のアクセント */
.page-id-914 .wpcf7 input[type="text"]:focus,
.page-id-914 .wpcf7 input[type="email"]:focus,
.page-id-914 .wpcf7 textarea:focus {
    background: #fff;
    border-color: #1F6CAB;
    outline: none;
    box-shadow: 0 0 0 3px rgba(31, 108, 171, 0.1);
}

/* 自動入力欄（読み取り専用）のスタイル */
.page-id-914 .wpcf7 input.readonly,
.page-id-914 .wpcf7 input[readonly] {
    background-color: #e9ecef;
    color: #666;
    border-color: #dce0e4;
    cursor: not-allowed;
}

/* チェックボックスリスト */
.page-id-914 .wpcf7 .wpcf7-checkbox {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-top: 10px;
    border: 1px solid #eee;
    padding: 15px;
    border-radius: 4px;
    background: #fff;
}
.page-id-914 .wpcf7 .wpcf7-list-item {
    margin: 0;
}
.page-id-914 .wpcf7 .wpcf7-list-item-label {
    font-weight: normal;
    font-size: 0.95rem;
    margin-left: 5px;
}

/* 送信ボタン（サイト共通デザインに合わせる） */
.page-id-914 .wpcf7 input[type="submit"] {
    background: #1F6CAB;
    color: #fff;
    font-size: 1.1rem;
    font-weight: bold;
    padding: 15px 60px;
    border-radius: 30px;
    border: none;
    cursor: pointer;
    transition: background 0.3s;
    display: block;
    margin: 40px auto 0;
    width: auto;
    min-width: 250px;
}
.page-id-914 .wpcf7 input[type="submit"]:hover {
    background-color: #16568d;
}

/* エラーメッセージ */
.page-id-914 .wpcf7-not-valid-tip {
    font-size: 0.85rem;
    margin-top: 5px;
}

/* スマホ対応 */
@media (max-width: 600px) {
    .page-id-914 .wpcf7 {
        padding: 20px;
    }
    .page-id-914 .wpcf7-checkbox {
        flex-direction: column;
        gap: 8px;
    }
    .page-id-914 .wpcf7 input[type="submit"] {
        width: 100%;
    }
}

/* reCAPTCHAバッジを非表示にする */
.grecaptcha-badge {
    visibility: hidden;
}

/* ====================================
   石巻エリアガイド (page-id-249)
   ==================================== */

/* コンテナ全体 */
.page-id-249 .area-guide-wrapper {
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px 0;
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

/* 導入部 */
.page-id-249 .ag-intro {
    text-align: center;
    margin-bottom: 50px;
    padding: 0 15px;
}
.page-id-249 .ag-lead {
    font-size: 1.6rem;
    font-weight: bold;
    color: #1F6CAB;
    line-height: 1.5;
    margin-bottom: 20px;
}
.page-id-249 .ag-desc {
    font-size: 1rem;
    line-height: 1.8;
    color: #555;
    max-width: 700px;
    margin: 0 auto;
}

/* グリッドレイアウト */
.page-id-249 .ag-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-bottom: 60px;
}

/* カードスタイル */
.page-id-249 .ag-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: transform 0.3s;
    display: flex;
    flex-direction: column;
}
.page-id-249 .ag-card:hover {
    transform: translateY(-5px);
}

/* 画像エリア */
.page-id-249 .ag-img-box {
    width: 100%;
    aspect-ratio: 16 / 10;
    background: #eee;
    overflow: hidden;
}
.page-id-249 .ag-img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}
.page-id-249 .ag-card:hover .ag-img-box img {
    transform: scale(1.05);
}

/* コンテンツエリア */
.page-id-249 .ag-content {
    padding: 25px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

/* ▼▼▼ 修正：タグ行のレイアウト ▼▼▼ */
.page-id-249 .ag-tags-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 15px;
    align-items: center;
}

/* エリア名タグ */
.page-id-249 .ag-tag {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: bold;
    color: #fff;
}
.page-id-249 .ag-tag.central { background: #E91E63; }
.page-id-249 .ag-tag.sea     { background: #1F6CAB; }
.page-id-249 .ag-tag.river   { background: #4CAF50; }
.page-id-249 .ag-tag.art     { background: #9C27B0; }

/* ▼▼▼ 追加：交通手段バッジ ▼▼▼ */
.page-id-249 .ag-transport-badge {
    font-size: 0.75rem;
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.page-id-249 .ag-transport-badge.train {
    background: #e0f2f1;
    color: #00695c;
    border: 1px solid #b2dfdb;
}
.page-id-249 .ag-transport-badge.car {
    background: #f5f5f5;
    color: #616161;
    border: 1px solid #e0e0e0;
}

/* タイトルとキャッチ */
.page-id-249 .ag-content h3 {
    font-size: 1.3rem;
    margin: 0 0 10px 0;
    color: #333;
}
.page-id-249 .ag-catch {
    font-size: 0.95rem;
    font-weight: bold;
    color: #F9A825;
    margin-bottom: 15px;
    border-bottom: 1px dashed #ddd;
    padding-bottom: 10px;
}

/* 説明文 */
.page-id-249 .ag-text {
    font-size: 0.9rem;
    line-height: 1.6;
    color: #666;
    margin-bottom: 15px;
}

/* スポットリスト */
.page-id-249 .ag-spots {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.page-id-249 .ag-spots li {
    font-size: 0.8rem;
    color: #777;
    background: #f5f5f5;
    padding: 3px 10px;
    border-radius: 4px;
}
.page-id-249 .ag-spots li::before {
    content: "📍";
    margin-right: 4px;
}

/* ボタン */
.page-id-249 .ag-btn {
    margin-top: auto;
    display: block;
    text-align: center;
    background: #1F6CAB;
    color: #fff;
    padding: 12px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: bold;
    font-size: 0.95rem;
    transition: opacity 0.3s;
}
.page-id-249 .ag-btn:hover {
    opacity: 0.8;
    background: #16558a;
}

/* アクセス情報＆Tips共通スタイル */
.page-id-249 .ag-access,
.page-id-249 .ag-tips {
    margin-bottom: 60px;
    padding: 0 10px;
}
.page-id-249 .ag-tips {
    background: #f9fcff;
    border: 2px solid #e1f0fa;
    border-radius: 12px;
    padding: 30px;
    margin-top: 40px;
}
.page-id-249 .ag-tips-title {
    text-align: center;
    font-size: 1.4rem;
    margin-bottom: 30px;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* グリッド */
.page-id-249 .ag-access-grid,
.page-id-249 .ag-tips-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

/* アクセスボックス */
.page-id-249 .ag-access-box {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 25px;
    position: relative;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.page-id-249 .ag-access-box.recommended {
    border: 2px solid #1F6CAB;
    background: #fdfdfd;
}
.page-id-249 .ag-access-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 15px;
    text-align: center;
}
.page-id-249 .ag-access-header .icon {
    font-size: 2.5rem;
    margin-bottom: 10px;
    display: block;
}
.page-id-249 .ag-access-header h4 {
    margin: 0;
    font-size: 1.1rem;
    color: #333;
    font-weight: bold;
}
.page-id-249 .badge {
    display: inline-block;
    background: #e74c3c;
    color: #fff;
    font-size: 0.75rem;
    padding: 2px 8px;
    border-radius: 4px;
    margin-top: 5px;
    font-weight: bold;
}
.page-id-249 .access-time {
    text-align: center;
    font-size: 0.9rem;
    background: #f0f4f8;
    padding: 8px;
    border-radius: 6px;
    margin-bottom: 15px;
    color: #555;
}
.page-id-249 .access-time strong {
    font-size: 1.2rem;
    color: #1F6CAB;
    margin: 0 3px;
}
.page-id-249 .access-desc {
    font-size: 0.9rem;
    line-height: 1.6;
    margin-bottom: 10px;
    color: #333;
}
.page-id-249 .access-note {
    font-size: 0.8rem;
    color: #777;
    line-height: 1.5;
    background: #fff8e1;
    padding: 8px;
    border-radius: 4px;
    margin: 0;
}

/* Tipsボックス */
.page-id-249 .ag-tip-box h4 {
    font-size: 1rem;
    margin-bottom: 10px;
    color: #1F6CAB;
    display: flex;
    align-items: center;
    gap: 8px;
}
.page-id-249 .ag-tip-box p {
    font-size: 0.9rem;
    line-height: 1.6;
    color: #555;
    margin: 0;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .page-id-249 .ag-lead { font-size: 1.3rem; }
    .page-id-249 .ag-grid { grid-template-columns: 1fr; }
    .page-id-249 .ag-access-grid,
    .page-id-249 .ag-tips-grid { grid-template-columns: 1fr; }
    .page-id-249 .ag-tips { padding: 20px; }
    .page-id-249 .ag-img-box { aspect-ratio: 16 / 9; }

    .page-id-249 .ag-access-box { padding: 20px; }
    .page-id-249 .ag-access-header {
        flex-direction: row;
        gap: 10px;
        align-items: center;
        justify-content: flex-start;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }
    .page-id-249 .ag-access-header .icon { font-size: 1.8rem; margin-bottom: 0; }
    .page-id-249 .badge { margin-top: 0; margin-left: auto; }
}

/* ====================================
   石巻エリアガイド (page-id-249)
   デフォルトのタイトル・アイキャッチ・スペーサーを非表示
   ==================================== */

.page-id-249 .wp-block-post-title,
.page-id-249 .wp-block-post-featured-image,
.page-id-249 .wp-block-spacer {
    display: none !important;
}

/* ====================================
   定番グルメ・お土産（自動スクロール版）
   ==================================== */

.page-id-249 .ag-gourmet {
    margin-bottom: 60px;
    padding: 0 10px;
    overflow: hidden;
}

/* 説明文 */
.page-id-249 .ag-gourmet-desc {
    text-align: center;
    font-size: 0.95rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 30px;
}

/* ▼ 自動スクロールの仕組み ▼ */

/* マスク（表示領域） */
.page-id-249 .ag-auto-scroll-mask {
    width: 100%;
    overflow: hidden; /* はみ出した部分を隠す */
    mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent); /* 両端を少しぼかす */
    -webkit-mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
}

/* トラック（動く部分） */
.page-id-249 .ag-auto-scroll-track {
    display: flex;
    gap: 20px; /* アイテム間の隙間 */
    width: max-content; /* 中身に合わせて幅を自動確保 */
    padding: 10px 0;

    /* アニメーション設定：40秒かけて1周、一定速度、無限ループ */
    animation: scrollLoop 40s linear infinite;
}

/* マウスを乗せたら一時停止（クリックしやすくする） */
.page-id-249 .ag-auto-scroll-track:hover {
    animation-play-state: paused;
}

/* アニメーションの動き */
@keyframes scrollLoop {
    0% {
        transform: translateX(0);
    }
    100% {
        /* アイテムリストのちょうど半分（1セット分）まで移動したら0に戻る */
        transform: translateX(-50%);
    }
}

/* --- 以下、カードのデザイン --- */

.page-id-249 .ag-scroll-item {
    flex: 0 0 160px; /* カード幅 */
    text-decoration: none;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    overflow: hidden;
    transition: transform 0.2s;
    border: 1px solid #eee;
    color: inherit;
}
.page-id-249 .ag-scroll-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 12px rgba(0,0,0,0.15);
}

/* --- ここが修正ポイント --- */
.page-id-249 .ag-scroll-img {
    width: 100%;
    /* height: 120px; ← 元の高さ指定を削除（コメントアウトでOK） */
    aspect-ratio: 1 / 1; /* ← これで常に正方形になります */
    background: #f0f0f0;
}

.page-id-249 .ag-scroll-img img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 正方形の枠に合わせてトリミングされます */
}
/* ----------------------- */

.page-id-249 .ag-scroll-info {
    padding: 10px;
    text-align: center;
}
.page-id-249 .ag-scroll-info h4 {
    font-size: 0.9rem;
    color: #333;
    margin: 0 0 5px 0;
    font-weight: bold;
}
.page-id-249 .search-link {
    font-size: 0.7rem;
    color: #1F6CAB;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

/* PC用の設定 */
@media (min-width: 769px) {
    .page-id-249 .ag-scroll-item {
        flex: 0 0 200px;
    }
}

/* ====================================
   テーマ別検索（トップページのデザインに合わせる）
   ==================================== */

.page-id-249 .ag-gourmet {
    /* 背景や枠線を削除してシンプルに */
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    margin-bottom: 0;
    text-align: center;
}

/* ====================================
   見出しデザイン（公式サイト共通スタイル）
   ==================================== */

/* 説明文のデザイン（シンプルに） */
.page-id-249 .ag-gourmet-desc {
    font-size: 0.95rem;
    line-height: 1.8;
    color: #666;
    max-width: 800px;
    margin: 0 auto 40px auto;
    /* 背景色などは削除 */
}

/* カードのデザイン調整（シャープに） */
.page-id-249 .ag-scroll-item {
    border: 1px solid #e5e5e5; /* 薄いグレーの線 */
    box-shadow: 0 3px 6px rgba(0,0,0,0.05); /* 影を控えめに */
    border-radius: 4px; /* 角丸を少し小さく */
}
.page-id-249 .ag-scroll-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 15px rgba(0,0,0,0.1);
    border-color: #1F6CAB; /* ホバー時に枠線を青くする */
}

/* ====================================
   見出しデザイン（公式サイト共通スタイル）
   ==================================== */

.page-id-249 .ag-styled-title {
    text-align: center;         /* 中央寄せ */
    font-size: 1.6rem;          /* 日本語の文字サイズ */
    font-weight: bold;
    color: #333;                /* 文字色：黒 */
    margin-top: 60px;           /* 上の余白 */
    margin-bottom: 40px;        /* 下の余白 */
    line-height: 1.4;

    /* 青い下線 */
    border-bottom: 3px solid #1F6CAB;
    padding-bottom: 15px;       /* 線と文字の隙間 */
}

/* 英語サブタイトル（ACCESSなど） */
.page-id-249 .ag-styled-title .en {
    display: block;             /* 改行して下段に表示 */
    font-size: 0.9rem;          /* 英語の文字サイズ */
    color: #1F6CAB;             /* 文字色：青 */
    font-weight: bold;
    text-transform: uppercase;  /* 強制的に大文字にする */
    margin-top: 5px;            /* 日本語との隙間 */
    letter-spacing: 0.05em;     /* 文字間隔を少し広げる */
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* スマホでの調整 */
@media (max-width: 768px) {
    .page-id-249 .ag-styled-title {
        font-size: 1.3rem;
        margin-top: 40px;
        margin-bottom: 30px;
    }
    .page-id-249 .ag-styled-title .en {
        font-size: 0.8rem;
    }
}

/* =========================================
   イベント投稿ページ（デザイン最適化版）
   ========================================= */

/* --- 1. ヘッダー案内ボックス（全体枠） --- */
.submit-header-box {
    max-width: 840px;
    margin: 0 auto 50px auto;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05); /* ほんのり浮き上がらせる */
    overflow: hidden;
}

/* リード文エリア */
.submit-lead-content {
    padding: 40px 30px;
    text-align: center;
    background: linear-gradient(to bottom, #fcfcfc, #fff); /* 微妙なグラデーション */
    border-bottom: 1px solid #eee;
}

.submit-badge {
    display: inline-block;
    background: #1F6CAB;
    color: #fff;
    font-size: 0.8rem;
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 15px;
    letter-spacing: 0.1em;
    font-weight: bold;
}

.submit-lead-title {
    font-size: 1.6rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 20px;
    line-height: 1.3;
}

.submit-lead-content p {
    font-size: 1rem;
    line-height: 1.8;
    color: #555;
    margin: 0;
}

/* 注釈エリア（2カラム風のリスト） */
.submit-sub-info {
    display: flex;
    flex-wrap: wrap; /* スマホで縦並びにするため */
    background: #f9fbfd; /* 薄い青グレー */
}

.sub-info-item {
    flex: 1;
    min-width: 280px; /* スマホでの最低幅 */
    padding: 20px 25px;
    display: flex;
    gap: 15px;
    align-items: flex-start;
    border-right: 1px solid #eee;
    font-size: 0.9rem;
    line-height: 1.6;
}
.sub-info-item:last-child {
    border-right: none;
}

/* アイコン装飾 */
.info-icon {
    font-size: 24px;
    color: #1F6CAB;
    background: #fff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    flex-shrink: 0;
}

.info-text strong {
    color: #333;
    display: block;
    margin-bottom: 4px;
}
.info-text a {
    color: #1F6CAB;
    text-decoration: underline;
}
/* 蛍光ペン風マーカー */
.marker-yellow {
    background: linear-gradient(transparent 60%, #fff9c4 60%);
}


/* --- 2. アコーディオン（リッチ版） --- */
.submit-details {
    max-width: 840px;
    margin: 0 auto 60px auto;
    border: none;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05); /* 影で存在感を出す */
}

.submit-details-summary {
    padding: 18px 25px;
    font-weight: bold;
    cursor: pointer;
    background: #fff; /* 白背景 */
    color: #333;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #eee;
    border-radius: 8px;
    transition: background 0.2s;
}
.submit-details-summary:hover {
    background: #f5f5f5;
}

.submit-details[open] .submit-details-summary {
    border-radius: 8px 8px 0 0;
    border-bottom: 1px solid #eee;
    background: #f9f9f9;
    color: #1F6CAB;
}

/* アイコン調整 */
.summary-icon {
    color: #aaa;
}
.submit-details[open] .summary-icon {
    color: #1F6CAB;
}
.toggle-icon {
    margin-left: auto; /* 右端に寄せる */
    font-weight: normal;
    font-size: 1.2rem;
    color: #aaa;
}
.submit-details[open] .toggle-icon {
    transform: rotate(45deg); /* 開いたら＋を×に */
}

.submit-details-content {
    padding: 30px;
    border: 1px solid #eee;
    border-top: none;
    border-radius: 0 0 8px 8px;
}

/* リストなどは前回のまま */
.flow-list, .point-list {
    margin-left: 20px;
    margin-bottom: 25px;
}
.txt-red {
    color: #d32f2f;
    font-weight: bold;
}
.submit-details-content h4 {
    font-size: 1rem;
    color: #1F6CAB;
    margin-top: 20px;
    margin-bottom: 10px;
    font-weight: bold;
    border-bottom: 2px solid #eef4f9;
    padding-bottom: 5px;
}


/* --- 3. フォーム見出し（デコレーション） --- */
.submit-form-container {
    max-width: 840px;
    margin: 0 auto;
}
.form-header-deco {
    text-align: center;
    margin-bottom: 40px;
    position: relative;
}
.form-header-deco h2 {
    font-size: 1.6rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    border: none; /* 既存線を消す */
}
.form-header-deco p {
    font-size: 0.9rem;
    color: #888;
}
/* 装飾ライン */
.form-header-deco::after {
    content: '';
    display: block;
    width: 50px;
    height: 3px;
    background: #1F6CAB;
    margin: 20px auto 0;
}


/* --- スマホ対応 --- */
@media (max-width: 768px) {
    .submit-sub-info {
        flex-direction: column; /* 縦並び */
    }
    .sub-info-item {
        border-right: none;
        border-bottom: 1px solid #eee;
    }
    .sub-info-item:last-child {
        border-bottom: none;
    }
    .submit-lead-content {
        padding: 30px 20px;
    }
    .submit-lead-title {
        font-size: 1.3rem;
    }
}

/* ==============================================
   スポンサー（協賛）お問い合わせページ専用デザイン
   ============================================== */

.sponsor-contact-wrapper {
    max-width: 840px;
    margin: 40px auto 80px;
    padding: 0 20px;
}

/* --- 導入文エリア --- */
.sponsor-intro {
    text-align: center;
    margin-bottom: 40px;
}
.sponsor-intro h2 {
    font-size: 1.6rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 20px;
    border: none;
}
.sponsor-intro p {
    font-size: 1rem;
    line-height: 1.8;
    color: #555;
}

/* 料金を濁すための案内ボックス */
.sponsor-notice {
    background: #f4f8fb;
    border: 2px solid #cce0f0;
    border-radius: 8px;
    padding: 25px;
    margin-top: 30px;
    text-align: left;
}
.sponsor-notice h4 {
    color: #1F6CAB;
    font-size: 1.1rem;
    margin-top: 0;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: bold;
}
.sponsor-notice p {
    margin: 0;
    font-size: 0.95rem;
    color: #444;
}

/* --- フォームエリア（イベント修正ページのデザインを踏襲） --- */
.sponsor-form-area .wpcf7 {
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    border: 1px solid #eee;
    box-shadow: 0 0 20px rgba(0,0,0,0.05);
}

/* 項目ラベルと必須バッジ */
.sponsor-form-area .label-text {
    display: flex;
    align-items: center;
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 25px;
    color: #333;
    font-size: 1rem;
}
.req-badge {
    background: #e53935;
    color: #fff;
    font-size: 0.75rem;
    padding: 2px 6px;
    border-radius: 4px;
    margin-left: 10px;
    font-weight: normal;
}

/* 入力フィールド */
.sponsor-form-area input[type="text"],
.sponsor-form-area input[type="email"],
.sponsor-form-area input[type="tel"],
.sponsor-form-area textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
    background: #fcfcfc;
    box-sizing: border-box;
    transition: all 0.3s;
}

.sponsor-form-area input:focus,
.sponsor-form-area textarea:focus {
    background: #fff;
    border-color: #1F6CAB;
    outline: none;
    box-shadow: 0 0 0 3px rgba(31, 108, 171, 0.1);
}

/* チェックボックス */
.sponsor-form-area .wpcf7-checkbox {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 4px;
    background: #f9f9f9;
}
.sponsor-form-area .wpcf7-list-item {
    margin: 0;
}
.sponsor-form-area .wpcf7-list-item-label {
    font-weight: normal;
    font-size: 0.95rem;
    margin-left: 8px;
    color: #333;
}

/* 送信ボタン */
.sponsor-form-area .form-submit-area {
    text-align: center;
    margin-top: 40px;
}
.sponsor-form-area input[type="submit"] {
    background: #1F6CAB;
    color: #fff;
    font-size: 1.1rem;
    font-weight: bold;
    padding: 15px 60px;
    border-radius: 30px;
    border: none;
    cursor: pointer;
    transition: background 0.3s;
    width: auto;
    min-width: 250px;
}
.sponsor-form-area input[type="submit"]:hover {
    background-color: #16568d;
}

/* エラーメッセージ */
.sponsor-form-area .wpcf7-not-valid-tip {
    font-size: 0.85rem;
    margin-top: 5px;
    color: #e53935;
}

/* スマホ対応 */
@media (max-width: 600px) {
    .sponsor-form-area .wpcf7 {
        padding: 20px;
    }
    .sponsor-intro h2 {
        font-size: 1.3rem;
    }
    .sponsor-form-area input[type="submit"] {
        width: 100%;
    }
}

/* =========================================
   イベントカード共通スタイル（.event-card-unified）
   ========================================= */
.event-list-grid, .related-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
}
.event-card-unified {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
    transition: transform 0.3s, box-shadow 0.3s;
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
    border: 1px solid #eee;
}
.event-card-unified:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}
.event-card-unified a {
    text-decoration: none;
    color: inherit;
}
.card-thumb {
    position: relative;
    width: 100%;
    padding-top: 60%;
    overflow: hidden;
    background: #f0f0f0;
    display: block;
}
.card-thumb .thumb-bg {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-size: cover; background-position: center;
    filter: blur(10px); opacity: 0.6; z-index: 1;
}
.card-thumb img {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    max-width: 100%; max-height: 100%; width: auto; height: auto;
    object-fit: contain; z-index: 2;
}

/* バッジのスタイル */
.card-badges {
    position: absolute; top: 8px; left: 8px; z-index: 5;
    display: flex; gap: 4px; flex-wrap: wrap;
}
.event-badge {
    color: #fff; font-weight: bold; font-size: 0.7rem;
    padding: 3px 8px; border-radius: 4px; line-height: 1;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.badge-new { background-color: #e53935; }
.badge-update { background-color: #1F6CAB; }
.badge-application { background-color: #e67e22; }

/* カード下部のテキストエリア */
.card-body {
    padding: 12px; display: flex; flex-direction: column; flex-grow: 1;
}
.card-meta-top { margin-bottom: 6px; }
.card-date { font-size: 0.8rem; color: #666; font-family: sans-serif; }
.card-title {
    font-size: 1rem; font-weight: bold; color: #333; margin: 0 0 8px;
    line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden;
}
.card-venue {
    font-size: 0.75rem; color: #555; margin-bottom: 10px;
    display: flex; align-items: center; gap: 4px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.card-venue .dashicons { font-size: 1.1em; color: #1F6CAB; }
.card-meta-bottom {
    margin-top: auto; display: flex; flex-wrap: wrap; gap: 5px;
}
.meta-tag {
    font-size: 0.7rem; padding: 2px 6px; border-radius: 3px;
    display: inline-flex; align-items: center; gap: 3px;
}
.area-tag { background: #eef; color: #1F6CAB; }
.cat-tag { background: #f5f5f5; color: #666; border: 1px solid #ddd; }

/* スマホ表示用 */
@media(max-width: 600px) {
    .event-list-grid, .related-list { grid-template-columns: 1fr; gap: 15px; }
}

/* ==============================================
   総合お問い合わせページ専用デザイン (page-id-266)
   ============================================== */

.page-id-266 .no_under a {
    text-decoration: none;
}

   /* --- フォームエリア全体 --- */
.page-id-266 .wpcf7 {
    max-width: 840px;
    margin: 40px auto 80px;
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    border: 1px solid #eee;
    box-shadow: 0 0 20px rgba(0,0,0,0.05);
}

/* 項目ラベルと必須バッジ */
.page-id-266 .label-text {
    display: flex;
    align-items: center;
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 25px;
    color: #333;
    font-size: 1rem;
}
.page-id-266 .req-badge {
    background: #e53935;
    color: #fff;
    font-size: 0.75rem;
    padding: 2px 6px;
    border-radius: 4px;
    margin-left: 10px;
    font-weight: normal;
}

/* 入力フィールド全般 */
.page-id-266 input[type="text"],
.page-id-266 input[type="email"],
.page-id-266 input[type="tel"],
.page-id-266 select,
.page-id-266 textarea {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
    background: #fcfcfc;
    box-sizing: border-box;
    transition: all 0.3s;
}

.page-id-266 input:focus,
.page-id-266 select:focus,
.page-id-266 textarea:focus {
    background: #fff;
    border-color: #1F6CAB;
    outline: none;
    box-shadow: 0 0 0 3px rgba(31, 108, 171, 0.1);
}

/* セレクトボックス（お問い合わせの種類）専用デザイン */
.page-id-266 select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path fill="%23333" d="M1.41 0L6 4.58L10.59 0L12 1.41L6 7.41L0 1.41L1.41 0Z"/></svg>');
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 12px;
    padding-right: 40px;
    cursor: pointer;
}

/* 送信ボタン */
.page-id-266 .form-submit-area {
    text-align: center;
    margin-top: 40px;
}
.page-id-266 input[type="submit"] {
    background: #1F6CAB;
    color: #fff;
    font-size: 1.1rem;
    font-weight: bold;
    padding: 15px 60px;
    border-radius: 30px;
    border: none;
    cursor: pointer;
    transition: background 0.3s;
    width: auto;
    min-width: 250px;
}
.page-id-266 input[type="submit"]:hover {
    background-color: #16568d;
}

/* エラーメッセージ */
.page-id-266 .wpcf7-not-valid-tip {
    font-size: 0.85rem;
    margin-top: 5px;
    color: #e53935;
}

/* スマホ対応 */
@media (max-width: 600px) {
    .page-id-266 .wpcf7 {
        padding: 20px;
        margin: 20px auto 40px;
    }
    .page-id-266 input[type="submit"] {
        width: 100%;
    }
}