/*
Theme Name: Tsukushi Sharks
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Template: twentytwentyfive
Author: Your Name
Author URI: https://yourwebsite.com
Description: つくしシャークスサイト用の Twenty Twenty-Five 子テーマ。カスタマイズはこのテーマで行います。
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive-child
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/*
 * カスタムスタイルはここに記述してください
 * 親テーマのスタイルは自動的に読み込まれます
 */

/* つくしシャークス カスタムスタイル */

/* 基本設定 */
body {
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "Yu Gothic", "游ゴシック", sans-serif;
    color: #333;
}

/*
 * KVスライドショー：ヘッダー＋KVでファーストビューいっぱい
 * （プラグインの固定 height/min-height を上書き）
 */
:root {
    --kv-header-offset: 92px; /* ヘッダー相当の高さ（ロゴ＋ナビ1行目想定。ずれる場合は数値を調整） */
}

/* トップのアンカー：ヘッダーに隠れにくくする（PC・SP共通） */
#news,
#results,
#team,
#recruit,
#instagram,
#contact {
    scroll-margin-top: var(--kv-header-offset, 92px);
}

/*
 * お問い合わせ見出しの上余白
 * （サイトエディタで保存されたテンプレが theme ファイルより優先され、HTML の padding が古いままになる場合でも反映させる）
 */
#contact.wp-block-heading,
main.ts-contact-page > h2.wp-block-heading:first-of-type {
    padding-top: 40px !important;
}

.kv-slideshow-container {
    height: auto !important;
    min-height: calc(100vh - var(--kv-header-offset)) !important;
    min-height: calc(100dvh - var(--kv-header-offset)) !important;
}

.kv-slideshow-wrapper,
.kv-slide {
    min-height: calc(100vh - var(--kv-header-offset)) !important;
    min-height: calc(100dvh - var(--kv-header-offset)) !important;
}

@media (max-width: 768px) {
    :root {
        --kv-header-offset: 120px; /* SPでヘッダーが折り返す場合の余裕 */
    }
}

/* ページ先頭へ（右下固定・追従） */
.back-to-top-btn {
    position: fixed;
    right: max(16px, env(safe-area-inset-right, 0px));
    bottom: max(20px, env(safe-area-inset-bottom, 0px));
    z-index: 99990;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    min-width: 52px;
    min-height: 52px;
    padding: 8px 10px 10px;
    border: none;
    border-radius: 8px;
    background-color: #fbbf24;
    color: #1e40af;
    font-family: inherit;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(30, 64, 175, 0.25);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity 0.28s ease, visibility 0.28s ease, transform 0.28s ease, filter 0.2s ease;
}

.back-to-top-btn.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top-btn:hover,
.back-to-top-btn:focus-visible {
    filter: brightness(1.06);
    outline: 2px solid #1e40af;
    outline-offset: 2px;
}

.back-to-top-btn__icon {
    display: block;
    font-size: 1.15rem;
    line-height: 1;
    margin-bottom: 2px;
}

.back-to-top-btn__text {
    display: block;
    letter-spacing: 0.02em;
}

@media (max-width: 768px) {
    .back-to-top-btn {
        min-width: 48px;
        min-height: 48px;
        padding: 6px 8px 8px;
        right: max(12px, env(safe-area-inset-right, 0px));
        bottom: max(16px, env(safe-area-inset-bottom, 0px));
    }

    .back-to-top-btn__icon {
        font-size: 1rem;
    }

    .back-to-top-btn__text {
        font-size: 0.6rem;
    }
}

/* NEWS以下すべてのコンテンツ幅を広げる */
main.wp-block-group .wp-block-group[class*="constrained"],
main .wp-block-group[class*="constrained"] {
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* フロントページNEWS記事リスト：●削除・青い区切り線・行間 */
.front-page-news-list {
    list-style: none !important;
}
.front-page-news-list li {
    margin-top: 12px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #1e40af;
}
.front-page-news-list li:first-child {
    margin-top: 0;
}
.front-page-news-list li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

/* アーカイブ一覧ページ（NEWS一覧）：TOPと同じ青い区切り線 */
body.blog .wp-block-post-template .wp-block-post,
body.archive .wp-block-post-template .wp-block-post {
    margin-top: 12px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #1e40af;
}
body.blog .wp-block-post-template .wp-block-post:first-child,
body.archive .wp-block-post-template .wp-block-post:first-child {
    margin-top: 0;
}
body.blog .wp-block-post-template .wp-block-post:last-child,
body.archive .wp-block-post-template .wp-block-post:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

/* 専用ニュースアーカイブページ（テンプレート「ニュースアーカイブ」）：TOPと同じ青い区切り線・日付+タイトル */
.news-archive-page .wp-block-query .wp-block-post-template .wp-block-post .wp-block-group.has-border-color {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.5em;
}
.news-archive-page .wp-block-query .wp-block-post-template .wp-block-post:last-child .wp-block-group.has-border-color {
    border-bottom: none !important;
}

/* メインコンテンツエリアの幅も広げる（試合結果セクション以外） */
main.wp-block-group {
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/*
 * 新入部員募集・チーム紹介：Columns にテーマの content-size / コンテナ用 margin が付き左右に余白（オレンジ）が出るのを防ぐ
 */
main .wp-block-columns.recruit-columns,
main .wp-block-columns.recruit-columns[class*="wp-container"],
main .wp-block-columns.team-columns,
main .wp-block-columns.team-columns[class*="wp-container"] {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 試合結果セクションが全幅になるように、メイン要素の幅制限を解除 */
main.wp-block-group:has(.has-contrast-background-color) {
    max-width: 100% !important;
}

/* 試合結果セクションの背景を全幅にする */
main .wp-block-group.has-contrast-background-color,
.wp-block-group.has-contrast-background-color,
main .wp-block-group.has-contrast-background-color.alignfull,
.wp-block-group.has-contrast-background-color.alignfull {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    box-sizing: border-box !important;
}

/* constrainedレイアウトの幅制限を解除 */
main .wp-block-group.has-contrast-background-color[class*="constrained"],
.wp-block-group.has-contrast-background-color[class*="constrained"] {
    max-width: 100vw !important;
    width: 100vw !important;
}

/* 試合結果セクション内のコンテンツは中央揃えで最大幅1400pxを設定 */
main .wp-block-group.has-contrast-background-color > * {
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
}

/* 試合結果セクションの直接の子要素（heading, columns, paragraph）にも適用 */
main .wp-block-group.has-contrast-background-color > .wp-block-heading,
main .wp-block-group.has-contrast-background-color > .wp-block-columns,
main .wp-block-group.has-contrast-background-color > .wp-block-paragraph {
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
}

/*
 * チーム紹介（全幅の白帯）：has-contrast-background-color ではないため上記が効かない。
 * 試合結果・募集と同じ出窓＋内側 max 1400px / 左右 40px を team-section-wrap で再現する。
 */
main .wp-block-group.team-section-wrap.has-base-background-color.alignfull,
.wp-block-group.team-section-wrap.has-base-background-color.alignfull {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    box-sizing: border-box !important;
    background-color: var(--wp--preset--color--base, #ffffff) !important;
}

main .wp-block-group.team-section-wrap.has-base-background-color.alignfull > * {
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
}

/* 試合結果の2x2グリッドレイアウト */
.match-results-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 30px !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}

.match-results-grid .wp-block-column {
    flex-basis: auto !important;
    width: 100% !important;
}

.match-result-card {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-radius: 4px !important;
}

.match-result-card img {
    width: 100% !important;
    height: 200px !important;
    object-fit: cover !important;
    background-color: #ffffff !important;
    border-radius: 4px !important;
}

/* スマホ表示では1列に */
@media (max-width: 768px) {
    .match-results-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* ヘッダーとフッターのスタイル調整 */
.wp-block-group.has-contrast-background-color {
    background-color: #1e40af !important;
}

/* スマホ時のヘッダー左右余白（本文と揃えて詰める） */
@media (max-width: 768px) {
    /* SPトップページのみ：ヘッダーを常時追従（fixedで確実に） */
    body.home header.wp-block-group,
    body.front-page header.wp-block-group {
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        z-index: 10000;
    }

    body.home header.wp-block-group.has-contrast-background-color,
    body.front-page header.wp-block-group.has-contrast-background-color {
        opacity: 1;
        transform: translateY(0);
        transition: opacity 0.45s ease, transform 0.45s ease;
    }

    body.home.ts-header-scrolling header.wp-block-group.has-contrast-background-color,
    body.front-page.ts-header-scrolling header.wp-block-group.has-contrast-background-color {
        opacity: 0;
        transform: translateY(-6px);
        pointer-events: none;
    }

    body.home,
    body.front-page {
        padding-top: 68px;
    }

    header.wp-block-group.has-contrast-background-color {
        min-height: 68px !important;
        padding-top: 6px !important;
        padding-bottom: 6px !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    .header-logo-group {
        min-height: 56px;
        margin: 0 !important;
        gap: 8px !important;
        align-items: center !important;
    }

    header .wp-block-site-logo img {
        width: 44px !important;
        height: 44px !important;
    }

    .header-text-group {
        margin: 0 !important;
        padding-left: 8px !important;
        display: flex !important;
        align-items: center !important;
    }

    .header-text-group .wp-block-heading {
        font-size: 0.95rem !important;
        margin-bottom: 0 !important;
        margin-top: 0 !important;
        line-height: 1.2 !important;
    }

    header .wp-block-navigation {
        margin: 0 !important;
        min-height: 56px;
        display: flex !important;
        align-items: center !important;
    }

    header .wp-block-navigation__responsive-container-open {
        margin: 0 !important;
        min-height: 44px;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

/* PC時のヘッダー左右余白を広げる */
@media (min-width: 1024px) {
    header.wp-block-group.has-contrast-background-color {
        padding-left: 80px !important;
        padding-right: 80px !important;
    }
}

/* SP：インライン40pxの左右余白・青背景内子要素を全体的に詰める */
@media (max-width: 768px) {
    .wp-block-group[style*="padding-left:40px"][style*="padding-right:40px"] {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    main .wp-block-group.has-contrast-background-color > *,
    main .wp-block-group.has-contrast-background-color > .wp-block-heading,
    main .wp-block-group.has-contrast-background-color > .wp-block-columns,
    main .wp-block-group.has-contrast-background-color > .wp-block-paragraph {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    main .wp-block-group.team-section-wrap.has-base-background-color.alignfull > * {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    /* KV：オーバーレイ（キャッチ・サブテキスト・ボタン）を画面中央に（SP） */
    .kv-slide-content {
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        padding-left: max(14px, env(safe-area-inset-left, 0px)) !important;
        padding-right: max(14px, env(safe-area-inset-right, 0px)) !important;
        padding-top: clamp(0.75rem, 3vh, 2rem) !important;
        /* 下：ドットインジケーターと被らないよう余白 */
        padding-bottom: clamp(4.5rem, 16vh, 6.5rem) !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .kv-slide-catchphrase,
    .kv-slide-subtext {
        text-align: center !important;
    }

    .kv-slide-button {
        display: flex !important;
        justify-content: center !important;
        text-align: center !important;
        width: 100%;
    }

    /* ボタンは文脈に合わせて中央のブロック幅（全幅バーにしない） */
    .kv-slide-button .wp-block-button__link {
        width: auto !important;
        max-width: min(100%, 22rem);
        box-sizing: border-box;
    }
}

/* ボタンのスタイル */
.wp-block-button__link.has-accent-1-background-color {
    background-color: #fbbf24 !important;
    color: #1e40af !important;
    font-weight: 700;
    border-radius: 4px;
    transition: all 0.3s ease;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none;
    border: none;
    cursor: pointer;
    padding: 12px 30px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
    height: auto !important;
    min-height: auto !important;
    margin: 0 !important;
    vertical-align: middle !important;
}

.wp-block-button__link.has-accent-1-background-color::before,
.wp-block-button__link.has-accent-1-background-color::after {
    content: none !important;
    display: none !important;
}

.wp-block-button__link.has-accent-1-background-color:hover {
    background-color: #f59e0b !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

/* 過去の試合結果：フィルタ（年度・A/B） */
.ts-results-filter {
    margin: 0 0 10px !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.ts-results-filter__row {
    display: grid !important;
    grid-template-columns: minmax(220px, 280px) minmax(220px, 280px) !important;
    justify-content: center !important;
    column-gap: 12px !important;
    row-gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.ts-results-filter__field {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    height: auto !important;
}

.ts-results-filter__label-text {
    display: block !important;
    margin: 0 0 1px !important; /* ラベル下の余白をさらに縮小 */
    padding: 0 !important;
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1.2 !important;
    color: inherit;
}

.ts-results-filter__sub-label {
    margin-top: 6px !important;
}

.ts-results-filter__select {
    width: 100%;
    max-width: 100%;
    margin: 0 !important;
    padding: 8px 10px;
    padding-right: 34px; /* ▼のスペース */
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: #ffffff;
    color: #111827; /* ドロップダウン展開時も黒文字に */
    appearance: none;
    -webkit-appearance: none;
    background-image:
        linear-gradient(45deg, transparent 50%, #111827 50%),
        linear-gradient(135deg, #111827 50%, transparent 50%);
    background-position:
        calc(100% - 16px) calc(50% - 2px),
        calc(100% - 11px) calc(50% - 2px);
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
    box-sizing: border-box;
}

/* 展開時の候補（option）はブラウザ実装差があるため明示的に指定 */
.ts-results-filter__select option {
    color: #111827;
    background: #ffffff;
}

.ts-results-filter__results {
    margin-top: 8px;
}

/* お問い合わせ（Contact Form 7）— body に ts-contact-page（functions.php）でブロックテーマの上書きに負けないよう明示 */
body.ts-contact-page .wpcf7,
body.ts-contact-page main.ts-contact-page .wpcf7 {
    margin-top: 10px;
}

body.ts-contact-page .wpcf7 form > p {
    margin: 0 0 16px !important;
}

body.ts-contact-page .wpcf7 label {
    display: block !important;
    font-weight: 700 !important;
    margin: 0 0 6px !important;
    color: #1f2937 !important;
}

body.ts-contact-page .wpcf7 form .wpcf7-form-control-wrap {
    display: block !important;
    margin-top: 6px !important;
}

body.ts-contact-page .wpcf7 input[type="text"],
body.ts-contact-page .wpcf7 input[type="email"],
body.ts-contact-page .wpcf7 input[type="tel"],
body.ts-contact-page .wpcf7 textarea,
body.ts-contact-page .wpcf7 select {
    width: 100% !important;
    max-width: 680px !important;
    padding: 10px 12px !important;
    border: 1px solid #c7ced9 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #111827 !important;
    box-sizing: border-box !important;
}

body.ts-contact-page .wpcf7 textarea {
    min-height: 160px !important;
    resize: vertical !important;
}

body.ts-contact-page .wpcf7 .wpcf7-list-item {
    display: block !important;
    margin: 0 0 8px 0 !important;
    font-weight: 400 !important;
}

body.ts-contact-page .wpcf7 input[type="submit"],
body.ts-contact-page .wpcf7 .wpcf7-submit {
    min-width: 140px !important;
    padding: 12px 22px !important;
    border: none !important;
    border-radius: 8px !important;
    background: #fbbf24 !important;
    color: #1e40af !important;
    font-weight: 700 !important;
    cursor: pointer !important;
}

body.ts-contact-page .wpcf7 input[type="submit"]:hover,
body.ts-contact-page .wpcf7 .wpcf7-submit:hover {
    background: #f59e0b !important;
}

/* 体験会ページ：写真差し込み用のプレースホルダー */
.ts-experience-page .ts-photo-slot__image {
    width: min(100%, 920px);
    margin: 0 auto !important;
    text-align: center;
}

.ts-experience-page .ts-photo-slot__image img {
    display: block;
    width: 100%;
    margin: 0 auto;
    min-height: 260px;
    object-fit: cover;
    border: 2px dashed rgba(30, 64, 175, 0.45);
    border-radius: 10px;
    background: rgba(30, 64, 175, 0.06);
}

.ts-experience-page .wp-block-embed,
.ts-experience-page .wp-block-embed.is-provider-google {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 920px;
}

.ts-experience-page .wp-block-embed iframe {
    display: block;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* カスタムHTMLで入れた Google Map iframe 用 */
.ts-experience-page iframe[src*="google.com/maps/embed"] {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100%;
}

/* HTMLブロックの親要素側でも中央寄せを担保 */
.ts-experience-page .wp-block-html {
    text-align: center;
}

/* 過去の試合結果：ヘッダー直下の間隔（青背景のまま） */
.ts-archive-results-section {
    padding-top: 80px !important;
}

.ts-archive-results-section h2.ts-archive-page-title {
    padding-top: 40px !important;
}

@media (max-width: 768px) {
    .ts-results-filter {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden;
    }
    .ts-results-filter__row {
        grid-template-columns: 1fr !important;
        row-gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .ts-results-filter__field {
        width: 100% !important;
        max-width: 100% !important;
    }
    .ts-results-filter__select {
        width: 100% !important;
        max-width: 100% !important;
        background-position:
            calc(100% - 16px) calc(50% - 1px),
            calc(100% - 11px) calc(50% - 1px);
    }
    body.ts-contact-page .wpcf7 input[type="text"],
    body.ts-contact-page .wpcf7 input[type="email"],
    body.ts-contact-page .wpcf7 input[type="tel"],
    body.ts-contact-page .wpcf7 textarea,
    body.ts-contact-page .wpcf7 select {
        max-width: 100% !important;
    }

    body.ts-contact-page .wpcf7 input[type="submit"],
    body.ts-contact-page .wpcf7 .wpcf7-submit {
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .ts-archive-results-section {
        padding-top: 80px !important;
    }
}

/* Baseball Scores: スコアボードの見た目調整 */
.bb-scoreboard th,
.bb-scoreboard td {
    color: #000000 !important;              /* テキスト色を黒に */
}

/* TEAM 列の幅を調整 */
.bb-scoreboard .bb-teamcol,
.bb-scoreboard .bb-teamname {
    width: 110px !important; /* PCではやや広めに確保 */
    white-space: nowrap;
}

/* ヘッダ行とR列の背景を青系に変更 */
.bb-scoreboard thead th,
.bb-scoreboard .bb-r {
    background-color: #dbeafe !important;   /* 薄いブルー */
    color: #1e40af !important;              /* テーマと合わせた濃いブルー */
}

/* 「計」列（R）は常に中央寄せに */
.bb-scoreboard .bb-r {
    text-align: center !important;
}

/* 念のため「計」列（テーブルの一番右列）も強制センタリング */
.bb-scoreboard th:last-child,
.bb-scoreboard td:last-child {
    text-align: center !important;
}

/* 試合場所（球場名）を大きく・目立たせる */
.bb-place {
    margin-top: 4px;
    font-size: 1.1rem;
    font-weight: 600;
}

/* 大会名（カードタイトル）の色を見えるように調整 */
.bb-card-title {
    color: #1f2933; /* 濃いめのグレー */
}

/* 日付表示（スコアカード内） */
.bb-date {
    margin-top: 2px;
    font-size: 0.9rem;
    color: #4b5563;
}

/* Baseball Scores: すべての端末でカードは縦並び（1列） */
.bb-scores-wrap {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

/* PCではスコアカードを横幅の約50%に縮小して中央寄せ */
@media (min-width: 1024px) {
    .bb-scores-wrap .bb-card {
        width: 50%;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Baseball Scores: スコアボードのレスポンシブ調整（スマホでも全体表示） */
@media (max-width: 768px) {
    .bb-scoreboard {
        width: 100%;
        font-size: 0.7rem;
        table-layout: fixed; /* 各列を均等幅にして詰める */
    }

    .bb-scoreboard th,
    .bb-scoreboard td {
        padding: 3px 2px;
        word-break: break-all;
    }

    /* TEAM 列はスマホでは横幅の約35%を確保して被りを防ぐ。長い名前は折り返し */
    .bb-scoreboard .bb-teamcol,
    .bb-scoreboard .bb-teamname {
        width: 35% !important;
        font-size: 0.7rem;
        text-align: left;
        white-space: normal !important;  /* 枠内で改行を許可 */
        word-break: break-word;          /* 長い単語も途中で折り返し */
    }
}

/* Baseball Scores: スコアボードの角丸をなくす */
.bb-card,
.bb-scoreboard {
    border-radius: 0 !important;
}

/* 新入部員募集：画像ディゾルブ（全体表示・上下切れなし） */
.recruit-image-slideshow {
    position: relative;
    width: 100%;
    min-height: 420px;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    background: #ffffff; /* contain 時の余白（ページ背景に近い白） */
}

.recruit-image-slideshow img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain; /* 画像全体を表示（上下・左右は切らない） */
    object-position: center;
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}

.recruit-image-slideshow img.is-active {
    opacity: 1;
}

/* 新入部員募集カラム内：画像エリアを約80%幅に（中央寄せ） */
.recruit-columns .recruit-image-slideshow {
    width: 80%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    min-height: 280px;
}

/* チーム紹介：左カラム画像（新入部員募集と同じくらいの見え方） */
.team-columns .team-intro-image-frame {
    width: 80%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    background: #ffffff;
    line-height: 0;
}

.team-columns .team-intro-image-frame img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
    vertical-align: bottom;
}

@media (min-width: 1024px) {
    .recruit-image-slideshow {
        min-height: 520px;
    }

    .recruit-columns .recruit-image-slideshow {
        min-height: 320px;
    }
}

@media (max-width: 768px) {
    .recruit-image-slideshow {
        min-height: 360px;
        aspect-ratio: 4 / 5;
    }

    /*
     * 新入部員募集 SP：Columns を確実に縦積み＆スライド内は absolute のみのため高さが潰れて下カラムと重なるのを防ぐ
     */
    .recruit-columns.is-layout-flex,
    .team-columns.is-layout-flex {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        gap: 2rem !important;
    }

    .recruit-columns > .wp-block-column,
    .team-columns > .wp-block-column {
        flex-basis: auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* SP：幅いっぱい。高さは flow 内の ::before で確保（flex の min-height:auto 対策） */
    .recruit-columns .recruit-image-slideshow {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 0;
        aspect-ratio: unset !important;
        min-height: 0 !important;
        overflow: hidden;
    }

    .recruit-columns .recruit-image-slideshow::before {
        content: "";
        display: block;
        width: 100%;
        padding-bottom: 125%; /* 4:5（幅に対する高さ） */
    }

    /* チーム紹介：SP は画像いっぱい（img は通常フローなので重なりなし） */
    .team-columns .team-intro-image-frame {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    /* 新入部員募集：「体験会について」ボタンを中央寄せ（SPのみ） */
    .recruit-columns .wp-block-buttons,
    #recruit .wp-block-buttons {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: center !important;
    }
}

/* すべてのボタンリンクに適用（念のため） */
.wp-block-button__link {
    background-color: #fbbf24 !important;
    color: #1e40af !important;
    font-weight: 700;
    border-radius: 4px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none;
    padding: 12px 30px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
    height: auto !important;
    min-height: auto !important;
    margin: 0 !important;
    vertical-align: middle !important;
}

/* ボタンコンテナのスタイル */
.wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    align-items: center;
}

.wp-block-button {
    display: inline-block;
    margin: 0 !important;
    line-height: 0 !important;
    vertical-align: middle;
}

.wp-block-button .wp-block-button__link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto;
    max-width: 100%;
    line-height: 1 !important;
    margin: 0 !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

/* ボタン内のテキストを中央配置 */
.wp-block-button__link.has-accent-1-background-color,
.wp-block-button__link {
    text-align: center !important;
}

.wp-block-button__link.has-accent-1-background-color *,
.wp-block-button__link * {
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
}

/* ボタン内の<br>タグを非表示 */
.wp-block-button__link.has-accent-1-background-color br,
.wp-block-button__link br {
    display: none !important;
    content: "" !important;
    line-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ヒーローセクションのスタイル */
.wp-block-cover.alignfull {
    background-size: cover;
    background-position: center;
}

/* ニュースリストのスタイル */
.wp-block-list li {
    list-style: none;
    padding-left: 25px;
    position: relative;
    margin-bottom: 15px;
}

.wp-block-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #1e40af;
    font-weight: bold;
}

/* 試合結果カードのスタイル */
.wp-block-group[style*="border"] {
    border-color: rgba(255, 255, 255, 0.3) !important;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.wp-block-group[style*="border"]:hover {
    background-color: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
}

/* リンクのスタイル */
a {
    color: #1e40af;
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: #fbbf24;
    text-decoration: underline;
}

/* セクション間のスペーシング */
.wp-block-group[style*="padding-top:80px"] {
    margin-bottom: 0;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .wp-block-heading[style*="font-size:4rem"] {
        font-size: 2.5rem !important;
    }
    
    .wp-block-heading[style*="font-size:2.5rem"] {
        font-size: 2rem !important;
    }
    
    .wp-block-columns {
        flex-direction: column;
    }
    
    .wp-block-column {
        flex-basis: 100% !important;
    }
    
    /* スマホ表示でヘッダーのサブタイトル部分を非表示（つくしシャークスは表示） */
    .header-subtitle {
        display: none !important;
    }
    
    /* スマホメニューのスタイル - 右側からスライドインするサイドメニュー */
    header .wp-block-navigation__responsive-container.is-menu-open {
        background-color: #1e40af !important; /* 全面を濃い青に統一 */
        color: #ffffff !important;
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        left: auto !important; /* 左側の位置を解除 */
        right: 0 !important; /* 右側に配置 */
        width: 50% !important; /* 画面の半分の幅 */
        height: 100dvh !important;
        max-width: 300px !important; /* 最大幅を制限 */
        overflow-y: auto !important;
        z-index: 10050 !important;
        animation: slideInFromRight 0.3s ease-out !important;
    }
    
    /* 右側からスライドインするアニメーション */
    @keyframes slideInFromRight {
        from {
            transform: translateX(100%);
            opacity: 0;
        }
        to {
            transform: translateX(0);
            opacity: 1;
        }
    }
    
    /* メニューコンテンツ部分 */
    header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
        background-color: #1e40af !important; /* 濃い青に統一 */
        height: 100%;
        width: 100%;
        padding: 3.5rem 1.5rem 2rem 1.5rem !important; /* 上部に余白を追加して×ボタンと重ならないように */
        margin-left: 0 !important;
        position: relative;
        text-align: center !important;
    }

    header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
        width: 100% !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* メニューアイテムのリンク */
    header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
        text-align: center !important;
    }

    header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
        color: #ffffff !important;
        padding: 12px 0;
        display: block;
        transition: color 0.2s ease;
    }
    
    header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:hover {
        color: #fbbf24 !important;
    }
    
    /* ハンバーガーボタンの色を白に */
    header .wp-block-navigation__responsive-container-open {
        color: #ffffff !important;
    }
    
    /* 閉じるボタン - 右上に配置（メニューコンテンツの外側） */
    header .wp-block-navigation__responsive-container-close {
        color: #ffffff !important;
        background-color: transparent !important;
        position: absolute !important;
        top: 0.5rem !important;
        right: 0.5rem !important;
        z-index: 100 !important;
        padding: 0.5rem !important;
        width: 40px !important;
        height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* メニューアイテムのホバー効果 */
    header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }
    
    header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:last-child {
        border-bottom: none;
    }
}

/* 画像のプレースホルダースタイル */
.wp-block-image img {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* ヘッダーのスタイル調整 */
header.wp-block-group,
header[style*="padding-bottom"] {
    min-height: auto !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* ヘッダーのインラインスタイルを上書き */
header[style*="padding-bottom:12px"] {
    padding-bottom: 0 !important;
}

/* サイトロゴのスタイル */
.wp-block-site-logo {
    display: inline-block;
}

header .wp-block-site-logo {
    margin-bottom: 10px !important;
}

.wp-block-site-logo img {
    width: 60px;
    height: 60px;
    object-fit: contain;
}

/* ヘッダー内の要素のマージンを調整 */
.header-logo-group {
    align-items: center;
    gap: 10px;
}

.header-text-group {
    margin: 0;
    padding-left: 10px !important;
}

.header-subtitle {
    margin-top: 2px !important;
    margin-bottom: 0 !important;
}

/* ヘッダー内のナビゲーションメニューのスタイル */
header .wp-block-navigation {
    color: #ffffff;
}

header .wp-block-navigation a {
    color: #ffffff !important;
}

header .wp-block-navigation a:hover {
    color: #fbbf24 !important;
}

/* ロゴが設定されていない場合のフォールバック */
.header-logo-group:has(.wp-block-site-logo:empty)::before,
.header-logo-group .wp-block-site-logo:empty::before {
    content: "";
    display: inline-block;
    width: 60px;
    height: 60px;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><text x="50" y="50" font-size="40" fill="white" text-anchor="middle" dominant-baseline="middle">S</text></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* KVスライドショー・試合結果の余白を最小限にして横スクロールを防ぐ */
.alignfull .kv-slideshow-container,
.kv-slideshow-container {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 0 !important;
    display: block !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    border: none !important;
    outline: none !important;
}

/* スライド画像をコンテナいっぱいに表示 */
.kv-slideshow-wrapper {
    width: 100% !important;
    min-height: inherit;
}
.kv-slideshow-container .kv-slide {
    right: 0 !important;
    bottom: 0 !important;
    background-size: cover !important;
    background-position: center center !important;
}

/* 画面全体で横スクロールが出ないようにする */
html,
body {
    overflow-x: hidden;
}

/* ヘッダー直後のKVグループの余白を削除（クラス指定で影響範囲を限定） */
header + .wp-block-group.alignfull {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-top: none !important;
}

/* ヘッダーの下部ボーダーも削除 */
header.wp-block-group::after,
header::after {
    display: none !important;
    content: none !important;
}

.kv-slideshow-container {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
}

.kv-slideshow-wrapper {
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
}

/* コンテナの親要素も余白を削除 */
.wp-block-group.alignfull,
.alignfull {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ヘッダー直後のすべての要素の余白を削除 */
body > *:first-child + *,
body > header + * {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ヘッダーとKVスライドショーの間の余白を削除 */
header.wp-block-group,
header[style*="padding-bottom"] {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* ヘッダーの直後の要素（KVスライドショー）との間の余白を削除 */
header + *,
header + .alignfull,
header + .wp-block-group,
header + .wp-block-group.alignfull,
header ~ .alignfull,
header ~ .wp-block-group.alignfull {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ヘッダー直後のグループ要素の余白も削除 */
header + .wp-block-group.alignfull > * {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 全幅スタイルがボタンに影響しないように */
.alignfull .wp-block-button,
.alignfull .wp-block-buttons {
    width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

/* --------------------------------------------------------------------------
 * スクロール表示（KV・試合結果以外に .is-scroll-reveal を付与したブロックのみ）
 * -------------------------------------------------------------------------- */
.is-scroll-reveal {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition:
        opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

.is-scroll-reveal.is-scroll-reveal--visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
    .is-scroll-reveal {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        will-change: auto !important;
    }
}

/* --------------------------------------------------------------------------
 * フッター（レイアウト整理）
 * -------------------------------------------------------------------------- */
footer.site-footer.site-footer,
.site-footer {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    clear: both;
}

.site-footer__inner {
    max-width: none !important;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    box-sizing: border-box;
}

/* 上段：ロゴ＋タイトル */
.site-footer__brand.is-layout-flex,
.site-footer__brand {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 1rem 1.25rem !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
}

.site-footer__logo {
    flex-shrink: 0 !important;
    margin: 0 !important;
    line-height: 0;
}

/* ヘッダーと同じ site-logo ブロック（div ラッパー） */
.site-footer__logo.wp-block-site-logo .custom-logo-link {
    display: block;
    line-height: 0;
}

.site-footer__logo img,
.site-footer__logo .custom-logo-link img {
    display: block !important;
    width: 80px !important;
    height: auto !important;
    max-width: 80px !important;
    max-height: 80px !important;
    object-fit: contain !important;
    border-radius: 4px;
}

.site-footer__titles {
    flex: 1 1 auto;
    min-width: 0;
}

.site-footer__titles .wp-block-heading {
    line-height: 1.25;
}

/* 最下部コピーライト（常に中央） */
.site-footer__copyright {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 0 !important;
    text-align: center !important;
    line-height: 1.5;
    box-sizing: border-box;
}

/* 下段：拠点・活動日 */
.site-footer__meta {
    border-top: 1px solid rgba(255, 255, 255, 0.22) !important;
    padding-top: 1.25rem !important;
    width: 100% !important;
    box-sizing: border-box;
}

.site-footer__meta p {
    line-height: 1.55;
}

@media (max-width: 781px) {
    .site-footer__brand.is-layout-flex,
    .site-footer__brand {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
    }

    .site-footer__titles {
        text-align: center;
    }

    .site-footer__meta {
        text-align: center;
    }
}

@media (max-width: 768px) {
    footer.site-footer {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

@media (min-width: 1024px) {
    footer.site-footer {
        padding-left: 80px !important;
        padding-right: 80px !important;
    }
}

/* --------------------------------------------------------------------------
 * Instagram 埋め込み（oEmbed）
 * -------------------------------------------------------------------------- */
.instagram-embed-section {
    margin-bottom: 2.5rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* 公式 blockquote 埋め込み（embed.js） */
.instagram-inline-embed-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 0.5rem 0 1.5rem;
}

.instagram-inline-embed-wrap .instagram-media {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* API で取得した最新投稿サムネイルグリッド */
.instagram-feed-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 0.65rem;
    margin: 0.5rem 0 1.75rem;
    width: 100%;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 600px) {
    .instagram-feed-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.85rem;
        max-width: 820px;
    }
}

.instagram-feed-item {
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.06);
    outline: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.instagram-feed-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

.instagram-feed-item:focus-visible {
    box-shadow: 0 0 0 3px rgba(30, 64, 175, 0.45);
}

.instagram-feed-item__inner {
    display: block;
    width: 100%;
    height: 100%;
}

.instagram-feed-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    vertical-align: bottom;
}

.instagram-embeds-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem 1.25rem;
    justify-content: center;
    align-items: flex-start;
    margin: 0.5rem 0 1.75rem;
}

.instagram-embed-item {
    flex: 1 1 300px;
    max-width: 100%;
    display: flex;
    justify-content: center;
    min-width: 0;
}

.instagram-embed-item .instagram-media,
.instagram-embed-item blockquote.instagram-media {
    margin: 0 auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

.instagram-embed-admin-note {
    font-size: 0.9rem;
    color: #666;
    margin: 0.5rem 0 0 !important;
    padding: 0.75rem 1rem;
    background: #f3f4f6;
    border-radius: 6px;
}

.instagram-embed-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.04);
    border-radius: 8px;
}

.instagram-embed-fallback__text {
    margin: 0 !important;
    text-align: center;
    font-size: 0.95rem;
}

.instagram-embed-fallback__link {
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}