/*
Theme Name:Lightning-soo-child
Version:15.35.3
Template:lightning
*/
.vk-mobile-nav-menu-btn{
	left: auto;
	right: 5px;
}

.my-header-right {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
}

/* フッター */
.site-footer {
    background-color: #3F66B0;
    color: #ffffff;
}

.site-footer a {
    color: #ffffff;
}

.site-footer p {

    color: #ffffff;

}



.footer-widget-area {

    display: flex;

    justify-content: space-between;

    align-items: center;

    max-width: 1200px;

    margin: 0 auto;

    padding: 40px 20px;

}

/* site-body上部余白を削除 */

.site-body {

    padding-top: 0 !important;

}
/* 全体背景色 */

body {

    background-color: #FDF9ED;/*#FDF4F6 !important;*/

}

/* ファーストビュー 右カラムの高さ揃え（PC表示のみ） */

@media (min-width: 768px) {

    .firstview-columns {

        align-items: stretch;

    }



    .firstview-columns .wp-block-column {

        display: flex;

        flex-direction: column;

    }



    .firstview-right {

        height: 100%;

    }

}

/* Pickupフルワイド背景 */

@media (min-width: 768px) {

    .pickup-section {

        margin-left: calc(50% - 50vw) !important;

        margin-right: calc(50% - 50vw) !important;

        padding-left: calc(50vw - 50%) !important;

        padding-right: calc(50vw - 50%) !important;

    }

}

/* 施設バナー */

.facility-banner {

    border-radius: 12px;

    padding: 16px;

    text-align: center;

}


.facility-banner p {
    margin: 0;
    padding: 0;
    margin-block-end: 0 !important;
}

/* 全体フォント */

body {

    font-family: 'Zen Maru Gothic', sans-serif;

}

/* ドロップダウンメニュー */

.global-nav-list > li > ul.sub-menu {

    background: #ffffff;

    border-radius: 8px;

    box-shadow: 0 4px 12px rgba(0,0,0,0.1);

    border: 1px solid #f0f0f0;

    padding: 8px 0;

}



.global-nav-list > li > ul.sub-menu li a {

    color: #333333;

    padding: 10px 20px;

    font-size: 16px;

}

/* ナビゲーション文字サイズ */
.global-nav-list > li .global-nav-name {
    font-size: 18px;
}


.global-nav-list > li > ul.sub-menu li a:hover {

    background: #FDF4F6;

    color: #E5345A;

}


/* ナビゲーション アンダーライン transition削除 */

.global-nav-list > li::before {

    border-bottom-width: 3px !important;

    transition: none !important;

}


/* ナビゲーション 三角形削除 */

.menu-item-has-children::after {

    display: none !important;

}
/*
.today-open {
    align-items: baseline;
    display: flex;
    gap: 8px;
    padding: 12px 20px;
    background: #4E4844;
    border-radius: 8px;
    justify-content: center;
}

.today-label {
    font-size: 30px;
    color: #ffffff;
    font-weight: 500;
}

.today-date {
    font-size: 20px;
    color: #ffffff;
    font-weight: 400;
    font-family: 'Comfortaa';
    letter-spacing: 0.6px;
}

.today-day {
    font-size: 20px;
    color: #ffffff;
    letter-spacing: 0.6px;
}

.today-divider {
    font-size: 30px;
    color: #ffffff;
    margin: 0 4px;
    font-weight: 200;
}

.today-status {
    font-size: 24px;
    letter-spacing: 4.5px;
    color: #ffffff;
    font-weight: 400;
    font-family: 'Zen Maru Gothic';
}
*/
/* Newsタイトル */
.news-section {
    padding: 24px;
    border-radius: 12px;
    background: #ffffff;
}


/* チラシスライドショー用セクション(news-sectionと同じ見た目) */

.flyer-section {

    padding: 24px;

    border-radius: 12px;

    background: #ffffff;

}


/* お知らせと横並びのとき、高さを揃える */

.flyer-section {

    display: flex;

    flex-direction: column;

}



.flyer-section .soo-notice-slideshow {

    flex: 1;

    min-height: 0;

    display: flex;

    flex-direction: column;

    max-width: none;

}



.flyer-section .soo-notice-slideshow-track {

    flex: 1;

    min-height: 0;

    aspect-ratio: auto;

}



.flyer-section .soo-notice-slideshow,

.flyer-section .soo-notice-slideshow-track {

    width: 100%;

}



.flyer-section .soo-notice-slideshow {

    border-radius: 0;

}



.flyer-section .soo-notice-slide img {

    object-fit: contain;

}


/* ==============================================================
   スマホ幅(カラムが縦積みになる)のときは、
   お知らせとの高さ揃え指定を解除し、
   本来の縦横比(3:4)で表示されるようにする
   ============================================================== */

@media (max-width: 991px) {
    .flyer-section .soo-notice-slideshow {
        flex: none;
        min-height: auto;
    }

    .flyer-section .soo-notice-slideshow-track {
        flex: none;
        min-height: auto;
        aspect-ratio: 3 / 4;
    }
}

/* タブレット幅で画像コンテナが大きくなりすぎないよう、最大幅を制限 */
@media (max-width: 991px) {
    .flyer-section .soo-notice-slideshow {
        max-width: 320px;
        margin-left: auto;
        margin-right: auto;
    }
}







.news-title {
    font-family: 'Comfortaa', cursive;
    color: #4E4844;
    border-top: none !important;
    border-bottom: none !important;
    padding: 0;
    font-size: 37px !important;
}

.news-subtitle {
    font-size: 15px;
    font-family: 'Zen Maru Gothic', sans-serif;
    color: #4E4844;
    font-weight: 400;
    margin-left: 8px;
}
/* News一覧 横並び */

.wp-block-latest-posts__list.news-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
    list-style: none;
}

.wp-block-latest-posts__list.news-list .wp-block-latest-posts__post-date {
    font-size: 13px;
    color: #888;
    white-space: nowrap;
    order: 1;
    flex-shrink: 0;
}

.wp-block-latest-posts__list.news-list li a {
    font-size: 14px;
    color: #333;
    text-decoration: none;
    order: 2;
}



/* News一覧 */

.soo-news-list {
    list-style: none;
    padding: 0 !important;
    margin: 0 !important;
}

.soo-news-list li {
    display: flex;
    align-items: center !important;
    gap: 12px;
    padding: 10px 0;
    margin-top: 0px !important;
    margin-bottom: 12px !important;
}

.soo-news-date {
    padding-top: 5px !important;
    font-size: 16px;
    color: #4E4844;
    white-space: nowrap;
    flex-shrink: 0;
    font-family: Comfortaa;
    min-width:75px;
}

.soo-news-cat {
    font-size: 15px !important;
    font-family: Noto Sans JP !important;
    font-color: #4E4844;
    font-weight: 500;
    padding: 2px 10px !important;
    border-radius: 20px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    color: #333 !important;
    min-width:90px;
    text-align: center;
    padding-top: 2px !important;
    padding-bottom: 4px !important;
}

/* カテゴリー別カラー */
.cat-news, .cat-お知らせ {
    background: #FBD9DE;
    color: #D6435B;
}

.cat-event, .cat-イベント {
    background: #FBE9A1;
    color: #B08925;
}

.soo-news-list li a {
    font-size: 14px;
    color: #333;
    text-decoration: none;
    align-items: center !important;
}

.soo-news-list li a:hover {
    color: #E5345A;
}


/* News一覧 アンダーライン削除・行間調整 */

.soo-news-list li a {
    text-decoration: none;
}

.soo-news-list li {
    padding: 3px 0;
}

.soo-news-list li a {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.soo-news-new {
    font-size: 13px;
    color: #E5345A;
    font-weight: 700;
    margin-left: 0px;
    flex-shrink: 0;
}

/* 一覧を見るボタン ホバー */
.news-section .wp-block-button a:hover {
    opacity: 0.8;
    filter: none;
}

.soo-news-title-wrap {
    padding-top: 1px;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow: hidden;
    flex: 1;
    min-width: 0;
    font-family: Noto Sans JP;
    font-size: 16px !important;
}

.soo-news-title-wrap a {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

.soo-news-new {
    flex-shrink: 0;
    font-size: 16px;
}






/* かんたん検索 */
.search-section {
    border: none !important;
    border-radius: 25px !important;
    overflow: hidden;
}


.search-section h2 {
    border-top: none !important;
    border-bottom: none !important;
    margin-bottom: 0px !important;
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    font-size: 29px;
}

.search-section {
    padding: 24px;
}

.search-section p {
    font-size: 16px !important;
    font-weight: 500 !important;
}

/* かんたん検索 説明テキスト */
.search-section .has-text-align-center {
    margin-bottom: 8px !important;
    margin-top: 0 !important;
}

/* 検索フォーム */

.soo-search-wrap {
    display: flex;
    align-items: stretch;
    border: 3px solid #4E4844;
    border-radius: 50px;
    overflow: hidden;
    background: #ffffff;
}

.soo-search-btn {
    background: #4E4844;
    border: none;
    padding: 0 16px;
    cursor: pointer;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 50px 50px 0;
}

.soo-search-input {
    flex: 1;
    border: none !important;
    margin: 0 !important;
    outline: none;
    padding: 10px 20px;
    font-size: 14px;
    background: transparent;
    font-family: 'Zen Maru Gothic', sans-serif;
}


.soo-search-btn:hover {
    background: #333;
}

/* 詳しく探すボタン */
.search-detail-btn {
    text-align: center;
}

.soo-search-wrap {
    margin-bottom: 20px;
}

.search-detail-btn .vk_button_link {
    width: 80%;
    border-radius: 50px;
    padding: 12px 24px;
}

.search-section .vk_button_link_txt {
    font-size: 20px;
    font-weight: 600;
}

.search-detail-btn {
    text-align: center;
    display: flex;
    justify-content: center;
}

/* 詳しく探すボタン下の区切り線 */

.search-detail-btn {
    border-bottom: 1.5px solid #cccccc;
    padding-bottom: 28px;
    margin-bottom: 28px;
}

.soo-news-title-wrap a {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}






/* Pickupカード画像角丸・横並び */
.soo-pickup-list {
    display: flex;
    gap: 20px;
}

.soo-pickup-card {
    flex: 1;
}

.soo-pickup-img {
    border-radius: 12px;
    width: 100%;
    height: auto;
    display: block;
}

.soo-pickup-img {
    border-radius: 12px;
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    object-position: top;
    display: block;
}

/* Pickupタイトル */
.soo-pickup-title {
    font-family: 'Zen Kaku Gothic New', sans-serif;
    text-decoration: none;
    font-size: 17px !important;
    font-weight: 500 !important;
    margin-top: 6px !important;
}

/* Pickup日付 */
.soo-pickup-date {
    font-family: 'Comfortaa', cursive;
    margin-top: 10px !important;
    margin-bottom: 4px !important;
    font-size: 15px;
}

/* Pickupカードリンク */
.soo-pickup-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.soo-pickup-link:hover {
    opacity: 0.8;
}

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

/* Pickup見出し ボーダー削除 */
.pickup-section h2 {
    border-top: none !important;
    border-bottom: none !important;
    margin-bottom: 12px !important;
    font-family: 'Zen Maru Gothic', sans-serif !important;
    color: #555555 !important;
    border-top: none !important;
    border-bottom: none !important;
    padding: 0;
    font-size: 37px !important;
}



/* ドロップダウン スクロールバー非表示 */

.sub-menu.acc-child-close {
    -ms-overflow-style: none;
    scrollbar-width: none;
}



.sub-menu.acc-child-close::-webkit-scrollbar {
    display: none;
}


/* News行全体リンク */
.soo-news-row {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    width: 100%;
}

.soo-news-title-wrap {
    color: inherit;
}

/* News行 マウスオーバー時カテゴリ色固定 */
.soo-news-row:hover .soo-news-cat {
    color: inherit;
}

/* News タイトルラップ 修正 */
.soo-news-title-wrap {
    flex: 1 !important;
    min-width: 0 !important;
}

.soo-news-title-wrap a {
    flex: 1 !important;
    min-width: 0 !important;
}

.soo-news-new {
    flex-shrink: 0 !important;
}


/* News タイトルラップ overflow修正 */
.soo-news-title-wrap {
    overflow: visible !important;
}


/* News行 overflow修正 */

.soo-news-row {
    overflow: visible !important;
}

/* News タイトル折り返し */
.soo-news-title-wrap a {
    white-space: normal !important;
    text-overflow: clip !important;
}


/* News タイトル折り返し */

.soo-news-title-wrap a {
    white-space: normal !important;
    white-space-collapse: normal !important;
    overflow-wrap: break-word !important;
}

/* News行 折り返し修正 */

.soo-news-row {

    text-wrap-mode: wrap !important;

    white-space: normal !important;

}



/* News行 レイアウト調整 */

.soo-news-row {

    align-items: flex-start !important;

}



.soo-news-date {

    padding-top: 2px;

}



.soo-news-cat {

    padding-top: 2px;

}

.soo-news-new {	
    margin-left: 4px;
}

.soo-news-new-mobile .soo-news-new {
    display: none;
}

.soo-news-title-wrap {
    display: inline !important;
}

.soo-news-new {
    margin-left: 4px;
}

.facility-banner {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.facility-banner:hover {
    opacity: 0.6;
    cursor: pointer;
}


.external-columns {
    justify-content: space-between;
    width: 100% !important;
}

.external-columns {
    justify-content: space-between !important;
    display: flex !important;
}

.external-columns .wp-block-column {
    display: flex;
    justify-content: center;
    align-items: center;
}

.external-columns .wp-block-column .vk_button {
    width: 100% !important;
}


.external-columns .external-columns .vk_button .vk_button_link {
    width: 100%;
    box-sizing: border-box;
}

.external-columns .wp-block-column {
    display: flex;
    justify-content: stretch;
}

.external-links-section .external-columns .vk_button {
    width: 100%;
}

.external-links-section .external-columns .vk_button .vk_button_link {
    width: 100%;
}
.external-columns .wp-block-column .vk_button_link {
    width: 100% !important;
    box-sizing: border-box;
    justify-content: space-between;
}

.external-links-section .vk_button_link_txt {
    text-align: left !important;
    flex: 1;
}

.external-links-section .vk_button_link_caption {
    text-align: left !important;
    flex: 1;
}

.external-links-section .vk_button_link_caption {
    justify-content: flex-start !important;
}

.external-links-section .vk_button_link_caption {
    display: flex !important;
    justify-content: flex-start !important;
    width: 100% !important;
}

.external-links-section .vk_button_link {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.external-links-section .vk_button_link {
    background-color: #ffffff !important;
}

.external-links-section .vk_button_link:hover {
    background-color: #4578B3 !important;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
}

body {
    overflow-x: clip !important;
}

.site-header * {
    animation: none !important;
    transition: none !important;
}

* {
    animation-duration: 0s !important;
}


#page_top {
    display: none !important;
}

#soo-page-top {
    position: fixed;
    right: 20px;
    width: 60px;
    height: 60px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 9999;
    display: block;
    transition: bottom 0.1s linear;
    bottom: -80px;
}

/* 右サイド固定ナビ */
#soo-float-nav {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 8px 0 0 8px;
    box-shadow: -2px 0 8px rgba(0,0,0,0.1);
    overflow: hidden;
}




#soo-float-nav a {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px 8px;
    color: #F76C82;
    text-decoration: none;
    border-bottom: 1px solid #cccccc;
    gap: 4px;
}


#soo-float-nav a svg, #soo-float-instagram svg {
    width: 28px;
    height: 28px;
}


#soo-float-nav a:last-child {
    border-bottom: none;
}


#soo-float-nav a:hover {
    background: #FDF4F6;
    color: #E5345A;
}

#soo-float-instagram {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 8px;
    color: #F76C82;
    text-decoration: none;
    background: #ffffff;
    border-radius: 8px 0 0 8px;
    box-shadow: -2px 0 8px rgba(0,0,0,0.1);
}

#soo-float-instagram:hover {
    background: #FDF4F6;
}




/* フローティングナビ 文字縦書き・サイズ調整 */

.soo-float-label {
    font-size: 18px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-family: 'Zen Maru Gothic', sans-serif;
    color: #4E4844;
    font-weight: 600;
}

#soo-float-wrapper {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9998;
    display: flex;
    flex-direction: column;
    gap: 10px;
}


/* フッター 中央揃え */
.site-footer-content row{
    display: flex;
    align-items: center;
    gap: 40px;
}

/* フッター 図書館名 文字大きく */
.site-footer-content .widget img {
    max-width: 200px;
}

/* フッター 中央揃え */
.site-footer-content .row {
    justify-content: center;
}

/* フッター 空のウィジェットエリア非表示 */
.site-footer-content .col-lg-4:empty,
.site-footer-content .col-md-6:empty {
    display: none !important;
}

/* フッター ロゴと住所の間隔 */
.site-footer-content .row {
    gap: 10px;
}

/* フッター ロゴ */
.footer-logo {
    text-align: right;
}

/* フッター 住所 右揃え */
.footer-address {
    text-align: left;
}

/* フッター 縦中央揃え */
.site-footer-content .row {
    align-items: center;
}

.site-footer {
    background-color: #4578B3 !important;
}

@media (max-width: 767.9px) {
    #soo-float-wrapper {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        top: auto;
        transform: none;
        flex-direction: row;
        height: 57px;
        width: 100%;
        z-index: 10000;
        gap: 0;
    }

    #soo-float-nav {
        flex-direction: row;
        width: 100%;
        border-radius: 0;
        box-shadow: 0 -2px 8px rgba(0,0,0,0.1);
    }

    #soo-float-nav a {
        flex: 1;
        padding: 8px 4px;
        border-bottom: none;
        border-right: 0.5px solid #f0f0f0;
    }

    #soo-float-instagram {
        flex-shrink: 0;
        border-radius: 0;
        padding: 8px 12px;
        box-shadow: 0 -2px 8px rgba(0,0,0,0.1);
    }
}


/* スマホ：ボトムナビ アイコン左・テキスト右 */
@media (max-width: 767.9px) {
    #soo-float-nav a {
        flex-direction: row;
        gap: 6px;
        justify-content: center;
	        border-right: 1px solid #cccccc !important;
        border-bottom: none !important;
    }

    .soo-float-label {
        writing-mode: horizontal-tb;
    }
}

/* スマホ：ボトムナビ 幅調整 */

@media (max-width: 767.9px) {
    #soo-float-nav a:first-child {
        flex: 0 0 50px;
    }

    #soo-float-nav a:not(:first-child) {
        flex: 1;
    }

    #soo-float-instagram {
        flex: 0 0 50px;
        box-shadow: none;
    }

    #soo-float-nav a:not(:first-child) .soo-float-label {
        font-size: 18px;
    }
}

/* スマホ：News 2段レイアウト */
@media (max-width: 767.9px) {
    .soo-news-row {
        flex-wrap: wrap;
    }

    .soo-news-date {
        flex-shrink: 0;
    }

    .soo-news-title-wrap {
        width: 100%;
        flex-basis: 100%;
    }
}

/* スマホ：News 2段レイアウト */
@media (max-width: 767.9px) {
    .soo-news-row {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .soo-news-date {
        flex-shrink: 0;
        order: 1;
    }

    .soo-news-cat {
        flex-shrink: 0;
        order: 2;
    }

    .soo-news-title-wrap {
        order: 3;
        flex-basis: 100% !important;
        width: 100% !important;
        padding-top: 4px;
    }
}


/* スマホ：News NEWの位置とマージン調整 */
@media (max-width: 767.9px) {
    .soo-news-new {
        order: 2;
        margin-left: 4px;
    }

    .soo-news-title-wrap {
        margin-top: 0 !important;
        padding-top: 2px !important;
    }

    .soo-news-row {
        row-gap: 2px;
    }
}


/* NEW PC版はtitle-wrap内、スマホ版は外 */
.soo-news-new-mobile .soo-news-new{
    display: none;
}

@media (max-width: 767.9px) {
    .soo-news-new-mobile .soo-news-new {
        display: inline;
        order: 2;
    }

    .soo-news-title-wrap .soo-news-new {
        display: none;
    }
}

/* NEW PC版はtitle-wrap内、スマホ版は外 */
.soo-news-new-mobile {
    display: none !important;
}



@media (max-width: 767.9px) {
    .soo-news-new-mobile {
        display: inline !important;
        order: 2;
    }

    .soo-news-title-wrap .soo-news-new {
        display: none !important;
    }
}

.firstview-columns div{
    margin-top: 16px;
}

@media (max-width: 767.9px) {
    .soo-news-list li {
        padding-top: 6px;
        padding-bottom: 6px;
    }
}

/* Pickupセクション 内側 */
.pickup-inner {
    padding: 24px;
    border-radius: 12px;
    background: #fff6d6;
}

/* スマホ：Pickup 縦並び */

@media (max-width: 767.9px) {
    .soo-pickup-list {
        flex-direction: column;
    }
}

.soo-pickup-title {
    margin-bottom: 6px !important;
}

/* スマホ：フッター 縦並び・中央揃え */
@media (max-width: 767.9px) {
    .site-footer-content .row {
        flex-direction: column;
        align-items: center;
    }

    .site-footer-content .col-lg-4,
    .site-footer-content .col-md-6 {
        width: 100%;
        text-align: center;
    }

    .footer-logo,
    .footer-address {
        text-align: center !important;
    }
}

/* 992px以下：カラム回り込み */
@media (max-width: 991.9px) {
    .wp-block-columns {
        flex-wrap: wrap !important;
    }
    .wp-block-column {
        flex-basis: 100% !important;
        width: 100% !important;
    }
}

/* 992px以下：かんたん検索 幅制限・中央揃え */
@media (max-width: 991.9px) {
    .search-column {
        max-width: 540px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* 992px以下：かんたん検索 中央揃え */

@media (max-width: 991.9px) {
    .wp-block-columns:has(.search-column) {
        justify-content: center;
    }
}

@media (min-width: 768px) {
    .site-body-container {
        
    }
}


/* PC普通画面：マイページ・利用カード ボタン padding調整 */
@media (min-width: 992px) and (max-width: 1199.9px) {
    .search-section .vk_button_link .vk_button_link_txt{
        font-size: 18px !important;
    }
}


/* PC普通画面：施設バナー フォントサイズ */
@media (min-width: 992px) and (max-width: 1199.9px) {
    .facility-banner p {
        font-size: 14px !important;
    }
}

/* タブレット：ヘッダー固定 */
@media (min-width: 768px) and (max-width: 991.9px) {
    .site-header {
        position: sticky !important;
        top: 0;
        z-index: 1000;
    }
}

/* タブレット：ハンバーガーメニュー位置 */

@media (max-width: 991.9px) {
    .vk-mobile-nav-menu-btn {
        right: 10px !important;
        top:12px !important;
    }
}

/* ハンバーガーメニュー デザイン */
@media (max-width: 991.9px) {
    .vk-mobile-nav-menu-btn {
        background-color: #4E4844 !important;
        border-radius: 4px;
    }

    .vk-mobile-nav-menu-btn span,
    .vk-mobile-nav-menu-btn span::before,
    .vk-mobile-nav-menu-btn span::after {
        background-color: #ffffff !important;
    }
}

/* ハンバーガーメニュー 白い線 */
@media (max-width: 991.9px) {
    .vk-mobile-nav-menu-btn {
        background-image: url('/wp-content/themes/lightning/_g3/inc/vk-mobile-nav/package/images/vk-menu-btn-white.svg') !important;
        filter: none !important;
    }
}

.vk-mobile-nav {
    transform: translateX(100%);
    transition: transform 0.3s ease !important;
    right: 0;
    left: auto !important;
    width: 80% !important;
}

.vk-mobile-nav-open {
    transform: translateX(0) !important;
}

.vk-mobile-nav {
    top: 62px !important;
    height: calc(100vh - 62px) !important;
}

.vk-mobile-nav .widget_search {
    display: none !important;
}

.vk-mobile-nav .global-nav-name {
    font-family: 'Zen Maru Gothic', sans-serif !important;
    font-size: 16px !important;
}

.vk-mobile-nav {
    width: 60% !important;
}

.vk-mobile-nav .vk-mobile-nav-menu-outer a {
    color: rgb(51, 51, 51) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    font-family: 'Zen Maru Gothic', sans-serif !important;

}

.vk-mobile-nav {
    padding: 0;
}

.vk-mobile-nav .vk-mobile-nav-menu-outer a{
    padding: 16px 24px;
}



/* カレンダー全体 */
.calendar {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    font-family: 'Zen Maru Gothic', sans-serif;
}

/* 日付セル */
.calendar td, .calendar th {
    text-align: center;
    padding: 6px;
}

/* 前後月の日付 グレーアウト */

.calendar .pMDate span,
.calendar .nMDate span {
    color: #cccccc;
}

/* 今日 */
.calendar .currDay span {
    background: #888888;
    color: #ffffff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* 休館日 */
.calendar .closingDay span {
    background: #aaaaaa;
    color: #ffffff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.calendar tr td:first-child span {
    color: #E5345A;
}

.calendar tr td:last-child span {
    color: #3F66B0;
}

/* 休館日 グレー */
.calendar .closingDay span {
    background: #888888 !important;
    color: #ffffff !important;
}

/* 今日 ダークグレー */
.calendar .currDay span {
    background: #555555 !important;
    color: #ffffff !important;
}

/* カレンダー枠線なし */
.calendar td, .calendar th {
    border: none !important;
}

#soo-today-status {
    border-radius: 8px;
    overflow: hidden;
}

.today-open {
    padding: 12px 20px;
}

.today-hours {
    background: #F6D8D3;
    text-align: center;
    padding: 6px;
    font-size: 13px;
}

/* 本日開館状況 */
#soo-today-status {
    display: flex;
    align-items: center;
    border-radius: 8px;
    padding: 5px 0px 7px 0px;
    gap: 10px;
}

.today-left {
    flex: 1;
}

.today-row1 {
    font-size: 18px;
    font-weight: 700;
}

.today-row2 {
    font-size: 12px;
    background: #F6D8D3;
    padding: 2px 8px;
    border-radius: 4px;
    margin-top: 4px;
    display: inline-block;
}

.today-right {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 32px;
    font-weight: 700;
    margin: 0 !important;
}

.today-left {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin: 0 !important;
}

.today-open {
    display: block !important;
}

.today-open,
#soo-today-status {
    background: #F6D8D3 !important;
}

#soo-today-status {
    color: #4E4844 !important;
    justify-content: center;
    margin: 0;
}

.today-open {
    margin: 0 !important;
    padding: 0 !important;
}

.today-row1 {
    margin: 0 !important;
    padding: 0 !important;
}
.today-row2 {
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 15px;
}

.today-date-num {
    font-family: 'Comfortaa', cursive;
    font-weight: 700;
    font-size: 32px;
    margin-left: 10px;
}
.today-date-weekday {
    font-size: 20px;
    font-family: 'Zen Maru Gothic', sans-serif;
    letter-spacing: 0.03em;
}
.today-label {
    font-size:32px;
    font-family: 'Zen Maru Gothic', sans-serif;
    letter-spacing: 0.1em;
}

#soo-today-status {
    display: flex !important;
    align-items: center !important;
}

.today-left {
    flex: none;
}

.today-row2 {
    margin-top: -4px !important;
}

#soo-today-status {
    width: 100%;
    box-sizing: border-box;
}

#libraryHours-main {
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0px !important;
}

#opac-libraryHours-form * {
    background-color: #ffffff !important;
}

#today-mark {
    color: #E5345A !important;
    font-size: 35px;
}

.calendar td span {
    font-family: 'Comfortaa', cursive;
}

/* カレンダー 正方形・縦揃え */

.calendar {
    table-layout: fixed;
    width: 100%;
}

.calendar td span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px !important;
    height: 32px !important;
    margin: auto;
}

#opac-libraryHours-form .closingDay span {
    background: #888888 !important;
    color: #ffffff !important;
    border-radius: 50% !important;
}

.calendar td {
    text-align: center;
    vertical-align: middle;
    padding: 0px;
}

.calendar td span {
    padding-top: 4px;
}

.calendar td,
.calendar th {
    text-align: center;
    vertical-align: middle;
    font-size: 16px;
}

.calendar {
    table-layout: fixed;
}

.calendar {
    table-layout: fixed;
    width: 100%;
}

.calendar .currDay span {
    background: transparent !important;
    border: 3px solid #F87F92 !important;
    border-radius: 50% !important;
    color: inherit !important;
}

.calendar th {
    width: auto !important;
}

.calendar,
.calendar td,
.calendar th {
    border: none !important;
}

#libraryHours-main {
    border: none !important;
}

.calendar tbody {
    border-top: none !important;
    border-bottom: none !important;
}

.firstview-columns {
    align-items: stretch !important;
}

.firstview-right {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

.calendar-section {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

.calendar-section #libraryHours-main {
    flex: 1 !important;
}

#opac-libraryHours-form {
    flex: 1 !important;
    min-height: 0 !important;
    border-radius: 0 0 8px 8px !important;
}

/* #calendar-section は class ではなく id なので、
   .calendar-section という指定では効いていなかった。
   正しく id で指定して、firstview-right の高さいっぱいに広げる */
#calendar-section {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
}

/* libraries（図書館選択）と calendarIcon（凡例）を横並びにして、
   その分カレンダー全体の高さを詰める */
#libraryHours-main {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

#libraryHours-main .libraries {
    flex: 1;
    min-width: 0;
}

#libraryHours-main .calendarIcon {
    flex: 0 0 auto;
}

#libraryHours-main .calendar {
    flex-basis: 100%;
    width: 100%;
}

/* 今日・休館日の文字サイズ */
#libraryHours-main .calendarIcon li {
    font-size: 16px !important;
}

/* libraries と calendarIcon の上下中央揃えを確実に */
#libraryHours-main {
    align-items: center !important;
}

/* libraries の下線を消す */
#libraryHours-main .libraries {
    border-bottom: none !important;
}

/* libraries と calendarIcon の外枠の高さを揃える */
#libraryHours-main {
    align-items: stretch !important;
}

#libraryHours-main .libraries {
    display: flex !important;
    align-items: center !important;
}

#libraryHours-main .calendarIcon {
    align-items: center !important;
}

/* gapで間隔を指定しているため、liごとのmarginは不要 */
#libraryHours-main .calendarIcon li {
    margin-right: 0 !important;
}

/* opac-libraries-select の余分なmargin-bottomを消す */
#opac-libraries-select {
    margin-bottom: 0 !important;
}

/* libraries の上下paddingを8pxに */
#libraryHours-main .libraries {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

/* カレンダー下に余白を作り、スライドショーと高さを合わせる */
#opac-libraryHours-form {
    display: flex !important;
    flex-direction: column !important;
}
#libraryHours-main {
    flex: 1 !important;
    align-content: flex-start !important;
}

/* firstview-right の height:100% が中途半端にしか効いていなかったため、
   flexのstretchに完全に委ねて隣のカラムと厳密に高さを揃える */
.firstview-right {
    height: auto !important;
    align-self: stretch !important;
}

/* 縦並びになった時の隙間（横並び時は1行のみなのでrow-gapは影響しない） */
.firstview-columns {
    row-gap: 24px !important;
}

#soo-today-status {
    border-radius: 8px 8px 0 0 !important;
}

#calendar-section {
    border-radius: 0 0 8px 8px !important;
    overflow: hidden !important;
}

#currM {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    font-family: 'Zen Maru Gothic', sans-serif !important;
}

.calendar td {
    font-size: 20px !important;
    height: 45px !important;
}

.libraryHours-main {
    margin-left: 30px;
    margin-right: 30px;
}

.icon-btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    text-align: left;
    padding: 16px;
    background: #ffffff;
    border-radius: 12px;
    gap: 12px;
}

.icon-btn-circle {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.icon-btn-title {
    font-size: 16px;
    font-weight: 700;
    color: #4E4844;
    margin: 0;
}

.icon-btn-desc {
    font-size: 12px;
    color: #888888;
    margin: 0;
}

.site-footer {
    background-color: #35A549 !important;
}

body {
    background-color: #FDF9ED !important;
}

.soo-news-new {
  display: inline-block;
  position: relative;
  padding: 3px 10px;
  color: #ED1A3D;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  border-radius: 8px;
}

.soo-news-new::before {
  content: "";
  position: absolute;
  top: -3px;
  left: 28%;
  width: 3px;
  height: 8px;
  background: #ED1A3D;
  border-radius: 999px;
  transform: rotate(-25deg);
}

.soo-news-new::after {
  content: "";
  position: absolute;
  top: -3px;
  right: 28%;
  width: 3px;
  height: 8px;
  background: #ED1A3D;
  border-radius: 999px;
  transform: rotate(25deg);
}

.soo-news-new span::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  width: 3.5px;
  height: 8px;
  background: #ED1A3D;
  border-radius: 999px;
  transform: translateX(-50%);
}

.opening-info {
    text-align: center;
    position: relative;
    font-size: 14px;
    color: #888888;

}

.opening-info::before,
.opening-info::after {
    content: "● ● ●";
    color: #F4789A;
    font-size: 8px;
    margin: 0 12px;
    letter-spacing: 4px;
}

.branch-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 1.5px solid;
    border-radius: 8px;
    background: #ffffff;
    cursor: pointer;
}

.branch-btn-name {
    flex: 1;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    color: #4E4844;
}

.branch-btn-arrow {
    color: #888888;
    font-size: 16px;
}

.branch-btn:hover {
    opacity: 0.7;
}

.branch-btn-arrow svg {
    position: relative;
    top: 2px;
}

.pickup-inner {
    background: #ffffff !important;
}

.firstview-columns div {
    margin-top:0px !important;
}

.n2-ss-slider {
    width: 100% !important;
    height: auto !important;
}

.n2-ss-slider img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
}

.n2-ss-slider {
    border-radius: 12px !important;
    overflow: hidden !important;
}

#today-mark {
    font-size: 27px !important;
}

.calendarIcon {
    margin: 0px !important;
}

.calendarIcon .closedIcon::before {
    content: "" !important;
    display: inline-block;
    width: 12px;
    height: 12px;
    background: #888888;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}

.calendarIcon .todayIcon::before {
    content: "" !important;
    display: inline-block;
    width: 12px;
    height: 12px;
    background: transparent;
    border: 2px solid #F4789A;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}

.calendarIcon .closedIcon::before,
.calendarIcon .todayIcon::before {
    vertical-align: middle;
    position: relative;
    top: -1px;
}

.calendarIcon .todayIcon {
    border-bottom: none !important;
}

ul.calendarIcon {
    display: flex;
    justify-content: flex-end;
    list-style: none;
    padding: 0;
    gap: 12px;
}

ul.calendarIcon {
    padding-right: 16px;
    padding-top:8px;
    padding-bottom:8px;
    height: 42px
}

.today-date-num {
    margin-left: 0px !important;
}

#soo-today-status {
    padding-top: 12px !important;
    padding-bottom: 12px !important;

}

#soo-today-status {
    gap: 30px !important;
}

.soo-book-feature-card {
    display: grid;
    grid-template-columns: 70px 1fr;
    grid-template-rows: auto 1fr auto;
    gap: 8px 12px;
    background: #ffffff;
    border-radius: 12px;
    padding: 16px;
    border: 1px solid #f0f0f0;
}

.soo-bf-circle-area {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    justify-content: center;
}

.soo-bf-title-area {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    align-items: center;
}

.soo-bf-date-area {
    grid-column: 1;
    grid-row: 2 / 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    /*justify-content: center;*/
    gap: 2px;
}

.soo-bf-caption-area {
    grid-column: 2;
    grid-row: 2;
}

.soo-bf-location-area {
    grid-column: 2;
    grid-row: 3;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

.soo-bf-lib-circle {
    width: 60px;
    height: 60px;
    border-radius: 50% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    flex-shrink: 0;
}

.soo-book-feature-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.soo-bf-title {
    font-size: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.soo-bf-title {
    border-bottom: none !important;
}

.soo-bf-title::after {
    display: none !important;
    content: none !important;
}

.soo-bf-date {
    margin: 0 !important;
    font-size: 14px;
}

.soo-bf-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.soo-bf-caption {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 12px;
}

.soo-bf-caption {
    margin: 0 !important;
}

.soo-bf-location-btn {
    background: #f0f0f0;
    border-radius: 20px;
    padding: 4px 12px;
    font-size: 12px;
    color: #4E4844;
}

.soo-bf-title {
    min-height: 2lh;
    max-height: 2lh;
}

.soo-bf-caption {
    min-height: 3lh;
    max-height: 3lh;
}

.soo-bf-arrow {
    font-size: 9px;
}

.book-feature-title {
    font-family: 'Comfortaa', cursive;
    color: #4E4844;
    border-top: none !important;
    border-bottom: none !important;
}

.book-feature-subtitle {
    font-size: 14px;
    font-family: 'Zen Maru Gothic', sans-serif;
    color: #4E4844;
    font-weight: 400;
    margin-left: 8px;
}

.book-feature-section {
    background: #ffffff;
    border-radius: 12px;
    padding: 24px;
}

.soo-bf-filter {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}

.soo-bf-filter-btn {
    padding: 6px 16px;
    border-radius: 20px;
    border: 1px solid #cccccc;
    background: #ffffff;
    cursor: pointer;
    font-size: 13px;
    color: #4E4844;
}

.soo-bf-filter-btn.active {
    background: #4E4844;
    color: #ffffff;
    border-color: #4E4844;
}

.soo-page-header {
    text-align: center;
    padding: 40px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.soo-page-header-icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #F4789A;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
}

.soo-page-header-title {
    font-size: 28px;
    font-weight: 700;
    color: #4E4844;
    margin: 0 0 12px;
}

.soo-page-header-desc {
    font-size: 14px;
    color: #888888;
    line-height: 1.8;
    margin: 0;
}


.page-header {
    display: none !important;
}

.sub-section.sub-section--col--two {
    display: none !important;
}

.soo-page-header {
    text-align: center;
    align-items: center;
}

.guide-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 20px;
    background: #ffffff;
    border-radius: 12px;
    margin-bottom: 24px;
}

.guide-nav-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border: 1px solid #F4789A;
    border-radius: 8px;
    text-decoration: none;
    color: #4E4844;
    font-size: 14px;
}

.guide-nav-item:hover {
    background: #FDD2D9;
}

/* ご利用案内 セクション */

.guide-section {
    display: flex;
    gap: 24px;
    padding: 24px 0;
    border-bottom: 1px solid #f0f0f0;
    align-items: flex-start;
}

.guide-section-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    min-width: 120px;
    text-align: center;
}

.guide-section-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #FDD2D9;
    display: flex;
    align-items: center;
    justify-content: center;
}

.guide-section-title {
    font-size: 16px;
    font-weight: 700;
    color: #4E4844;
    margin: 0;
}

.guide-section-right {
    flex: 1;
}

.guide-section-desc {
    font-size: 14px;
    color: #4E4844;
    margin: 0 0 12px;
}

.guide-detail-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.guide-detail-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.guide-detail-label {
    font-size: 14px;
    padding: 2px 10px;
    border-radius: 20px;
    background: #FDD2D9;
    color: #F4789A;
    white-space: nowrap;
    font-weight: 700;
}

.guide-detail-content {
    font-size: 16px;
    color: #4E4844;
}

.main-section--col--two {
    width: 100% !important;
    max-width: 100% !important;
}

.sub-section--col--two {
    display: none !important;
}

/* ご利用案内 セクション */

.guide-section {

    display: flex;

    gap: 24px;

    padding: 20px;

    border: 1px solid #f0f0f0;

    border-radius: 12px;

    align-items: center;

    margin-bottom: 12px;

    background: #ffffff;

    position: relative;

}



.guide-section-left {

    display: flex;

    align-items: center;

    gap: 12px;

    min-width: 160px;

}



.guide-section-icon {

    width: 56px;

    height: 56px;

    border-radius: 12px;

    background: #FDD2D9;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

}



.guide-section-title {

    font-size: 15px;

    font-weight: 700;

    color: #4E4844;

    margin: 0;

    border: none !important;

}

.guide-section-title::after {
    display: none !important;
}

/* スマホ：利用案内セクション */

@media (max-width: 767.9px) {

    .guide-section {

        flex-direction: column;

        align-items: flex-start;

    }



    .guide-section-left {

        flex-direction: row;

        min-width: unset;

    }



    .guide-section-right {

        width: 100%;

    }



    .guide-detail-item {

        flex-wrap: wrap;

    }

}





/* スマホ：利用案内 全体回り込み */

@media (max-width: 767.9px) {

    .guide-sections {

        width: 100%;

    }



    .guide-section {

        flex-direction: column;

    }



    .guide-section-left {

        flex-direction: row;

        min-width: unset;

        width: 100%;

    }



    .guide-section-right {

        width: 100%;

    }



    .guide-detail-content {

        word-break: break-all;

    }

}


/* スマホ：ラベルと内容を縦並び */

@media (max-width: 767.9px) {

    .guide-detail-item {

        flex-direction: column;

        align-items: flex-start;

    }

}


/* アクセスページ タブ */

.access-tabs {

    display: flex;

    gap: 0;

    margin-bottom: 20px;

}



.access-tab {

    flex: 1;

    padding: 12px 16px;

    border: 1px solid #f0f0f0;

    background: #ffffff;

    cursor: pointer;

    font-size: 15px;

    font-family: 'Zen Maru Gothic', sans-serif;

    color: #4E4844;

    border-radius: 8px 8px 0 0;

}



.access-tab.active {

    background: #FDD2D9;

    color: #F4789A;

    border-color: #FDD2D9;

    font-weight: 700;

}



/* アクセスカード */

.access-card {

    background: #ffffff;

    border-radius: 0 0 12px 12px;

    padding: 24px;

    border: 1px solid #f0f0f0;

}



.access-card-top {

    display: flex;

    gap: 24px;

    margin-bottom: 24px;

}



.access-photo img {

    width: 300px;

    height: 200px;

    object-fit: cover;

    border-radius: 8px;

}



.access-name {

    font-size: 18px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 16px;

    padding-bottom: 8px;

    border-bottom: 2px solid #F4789A;

}



.access-info {

    flex: 1;

    display: flex;

    flex-direction: column;

    gap: 12px;

}



.access-detail-item {

    display: flex;

    align-items: flex-start;

    gap: 8px;

    font-size: 14px;

    color: #4E4844;

}



/* アクセス詳細行 */

.access-card-details {

    display: flex;

    flex-direction: column;

    gap: 0;

}



.access-row {

    display: flex;

    align-items: flex-start;

    gap: 16px;

    padding: 16px 0;

    border-bottom: 1px solid #f0f0f0;

}



.access-row:last-child {

    border-bottom: none;

}



.access-row-left {

    display: flex;

    align-items: center;

    gap: 8px;

    min-width: 180px;

}



.access-row-label {

    font-size: 14px;

    font-weight: 700;

    color: #4E4844;

}



.access-row-content {

    font-size: 14px;

    color: #4E4844;

    line-height: 1.8;

}



.access-map {

    flex: 1;

    border-radius: 8px;

    overflow: hidden;

}



/* スマホ：アクセスページ */

@media (max-width: 767.9px) {

    .access-card-top {

        flex-direction: column;

    }



    .access-photo img {

        width: 100%;

        height: auto;

    }



    .access-row {

        flex-direction: column;

        gap: 8px;

    }



    .access-row-left {

        min-width: unset;

    }

}



/* お知らせ一覧 */

.soo-news-archive {

    max-width: 800px;

    margin: 0 auto;

    padding: 24px 0;

}



/* フィルターボタン */

.soo-news-filter {

    display: flex;

    flex-wrap: wrap;

    gap: 8px;

    padding: 16px;

    background: #ffffff;

    border-radius: 12px;

    margin-bottom: 24px;

}



.soo-news-filter-btn {

    display: flex;

    align-items: center;

    gap: 6px;

    padding: 6px 16px;

    border-radius: 20px;

    border: none;

    background: #f0f0f0;

    color: #4E4844;

    font-size: 13px;

    text-decoration: none;

    font-family: 'Zen Maru Gothic', sans-serif;

}



.soo-news-filter-btn.active {

    background: #FDD2D9;

    color: #F4789A;

    font-weight: 700;

}



.soo-news-filter-dot {

    width: 10px;

    height: 10px;

    border-radius: 50%;

    display: inline-block;

}



/* 投稿一覧 */

.soo-news-archive-item {

    display: flex;

    gap: 20px;

    padding: 20px;

    background: #ffffff;

    border-radius: 12px;

    margin-bottom: 12px;

    align-items: flex-start;

}



.soo-news-archive-left {

    display: flex;

    flex-direction: column;

    gap: 8px;

    min-width: 100px;

    align-items: center;

}



.soo-news-archive-date {

    font-size: 13px;

    color: #888888;

    white-space: nowrap;

}



.soo-news-archive-cat {

    font-size: 11px;

    padding: 2px 10px;

    border-radius: 20px;

    color: #ffffff;

    font-weight: 700;

    white-space: nowrap;

}



.soo-news-archive-right {

    flex: 1;

}



.soo-news-archive-title {

    font-size: 16px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 8px;

    border: none !important;

}



.soo-news-archive-title::after {

    display: none !important;

}



.soo-news-archive-title a {

    color: #4E4844;

    text-decoration: none;

}



.soo-news-archive-title a:hover {

    color: #F4789A;

}



.soo-news-archive-excerpt {

    font-size: 13px;

    color: #888888;

    margin: 0;

    line-height: 1.8;

}



/* ページネーション */

.soo-news-pagination {

    display: flex;

    justify-content: center;

    gap: 8px;

    margin-top: 24px;

}



.soo-news-pagination .page-numbers {

    padding: 6px 12px;

    border-radius: 6px;

    border: 1px solid #f0f0f0;

    color: #4E4844;

    text-decoration: none;

    font-size: 14px;

}



.soo-news-pagination .page-numbers.current {

    background: #F4789A;

    color: #ffffff;

    border-color: #F4789A;

}

/* 歴史民俗資料館 ヒーロー */





















/* 歴史民俗資料館 セクション */

.rekishi-section {

    display: flex;

    gap: 40px;

    padding: 40px 0;

    border-bottom: 1px solid #f0f0f0;

}



.rekishi-section-left {

    flex: 1;

    display: flex;

    flex-direction: column;

    gap: 12px;

}



.rekishi-section-number {

    width: 48px;

    height: 48px;

    border-radius: 50%;

    background: #F4789A;

    color: #ffffff;

    font-size: 24px;

    font-weight: 700;

    display: flex;

    align-items: center;

    justify-content: center;

    font-family: 'Comfortaa', cursive;

}



.rekishi-section-title {

    font-size: 20px;

    font-weight: 700;

    color: #4E4844;

    margin: 0;

    border: none !important;

}



.rekishi-section-title::after {

    display: none !important;

}



.rekishi-section-subtitle {

    font-size: 14px;

    color: #F4789A;

    margin: 0;

    font-weight: 700;

}



.rekishi-section-desc {

    font-size: 14px;

    color: #4E4844;

    line-height: 1.8;

    margin: 0;

}



.rekishi-section-btn {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding: 10px 20px;

    border-radius: 20px;

    border: 1px solid #F4789A;

    color: #F4789A;

    text-decoration: none;

    font-size: 13px;

    margin-top: auto;

}



.rekishi-section-btn:hover {

    background: #FDD2D9;

}



.rekishi-section-right {

    flex: 1.5;

}



/* 資料カード */

.rekishi-doc-card {

    background: #ffffff;

    border-radius: 12px;

    padding: 20px;

    border: 1px solid #f0f0f0;

}



.rekishi-doc-card-header {

    display: flex;

    align-items: center;

    gap: 8px;

    margin-bottom: 8px;

}



.rekishi-doc-title {

    font-size: 16px;

    font-weight: 700;

    color: #4E4844;

}



.rekishi-doc-desc {

    font-size: 13px;

    color: #888888;

    margin: 0 0 12px;

}



.rekishi-doc-image img {

    width: 100%;

    border-radius: 8px;

    object-fit: cover;

    margin-bottom: 16px;

}



/* タイムライン */

.rekishi-doc-timeline {

    display: flex;

    gap: 12px;

}



.rekishi-doc-timeline-item {

    flex: 1;

    background: #FDF9ED;

    border-radius: 8px;

    padding: 12px;

    font-size: 12px;

    color: #4E4844;

}



.rekishi-doc-timeline-date {

    display: block;

    font-weight: 700;

    color: #F4789A;

    margin-bottom: 4px;

    font-family: 'Comfortaa', cursive;

}



.rekishi-doc-timeline-label {

    display: block;

    font-weight: 700;

    margin-bottom: 8px;

}



.rekishi-doc-timeline-item ul {

    padding-left: 16px;

    margin: 0;

}

.rekishi-doc-timeline-item li {
    margin-bottom: 4px;
}

.rekishi-doc-timeline-item p {
    margin: 0;
}


/* セクション3 キーカラー 薄い青 */

#section-3 .rekishi-section-number {

    background: #64B5F6;

}



#section-3 .rekishi-section-subtitle {
    color: #64B5F6;
}

#section-3 .rekishi-section-btn {
    border-color: #64B5F6;
    color: #64B5F6;
}

#section-3 .rekishi-section-btn:hover {
    background: #BACEEC;
}

#section-3 .rekishi-doc-timeline-date {
    color: #64B5F6;
}

.rekishi-section-number {
    border-radius: 8px !important;
    font-size: 20px !important;
}

/* タイムライン 矢印 */

.rekishi-doc-timeline {

    position: relative;

    align-items: stretch;

}



.rekishi-doc-timeline-item {

    position: relative;

}



.rekishi-doc-timeline-item:not(:last-child)::after {

    content: "›";

    position: absolute;

    right: -10px;

    top: 50%;

    transform: translateY(-50%);

    font-size: 20px;

    color: #64B5F6;

    z-index: 1;

}



/* 各期間の背景色 */

#section-3 .rekishi-doc-timeline-item:nth-child(1) {

    background: #EBF4FC;

}



#section-3 .rekishi-doc-timeline-item:nth-child(2) {

    background: #F5F5F5;

}



#section-3 .rekishi-doc-timeline-item:nth-child(3) {

    background: #EBF4FC;

}

/* セクション 白背景 */

.rekishi-section {
    background: #ffffff;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 16px;
}

/* セクション3 右側 水色線・ヘッダー背景 */

#section-3 .rekishi-doc-card {

    border: 1px solid #EBF4FC;

}



#section-3 .rekishi-doc-card-header {
    background: #EBF4FC;
    border-radius: 8px;
    padding: 8px 12px;
    margin-bottom: 12px;
}


/* セクション3 カード */

#section-3 .rekishi-doc-card {

    border: 1px solid #64B5F6;

    padding: 0;

    overflow: hidden;

}



#section-3 .rekishi-doc-card-header {

    background: #EBF4FC;

    border-radius: 0;

    padding: 12px 16px;

    margin-bottom: 0;

}



#section-3 .rekishi-doc-card-body {

    display: flex;

    gap: 16px;

    padding: 16px;

}



#section-3 .rekishi-doc-image {

    width: 160px;

    flex-shrink: 0;

}



#section-3 .rekishi-doc-image img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    margin-bottom: 0;

    border-radius: 4px;

}



#section-3 .rekishi-doc-timeline {
    flex: 1;
}

/* セクション左右の幅調整 */

.rekishi-section-left {

    flex: 1;

}



.rekishi-section-right {

    flex: 2;

}

.rekishi-doc-timeline-item:not(:last-child)::after {
    font-size: 28px;
    right: -14px;
}

/* セクション3 右側 枠線 */

#section-3 .rekishi-doc-card {

    border-color: #BACEEC !important;

}	

/* タイムライン 背景色を日付とラベルのみに */

#section-3 .rekishi-doc-timeline-item {

    background: none !important;

}



#section-3 .rekishi-doc-timeline-date,

#section-3 .rekishi-doc-timeline-label {

    display: block;

    background: #EBF4FC;

    padding: 4px 8px;

    border-radius: 4px;

    margin-bottom: 4px;

}


/* タイムライン ヘッダー */

.rekishi-doc-timeline-header {

    background: #EBF4FC;

    border-radius: 6px;

    padding: 8px;

    margin-bottom: 8px;

    text-align: center;

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 4px;

}



/* タイムライン 背景色削除 */

#section-3 .rekishi-doc-timeline-item {

    background: none !important;

    padding: 0;

}

.rekishi-doc-timeline-date,
.rekishi-doc-timeline-label {
    margin: 0 !important;
    padding: 0 !important;
}

/* セクション番号 フォント・サイズ */

.rekishi-section-number {

    font-family: 'Playfair Display', serif !important;

    font-size: 28px !important;

}

.rekishi-section-number {
    font-family: 'Noto Serif JP', serif !important;
    font-size: 28px !important;
    line-height: 1 !important;
    padding-bottom: 4px !important;
}

/* この章の資料を見る ボタン */

#section-3 .rekishi-section-btn {

    background: #EBF4FC;

    border-color: #BACEEC;

    color: #64B5F6;

}



#section-3 .rekishi-section-btn:hover {

    background: #BACEEC;

}

/* 関連資料 */

.rekishi-doc-related {

    padding: 12px 16px;

    border-top: 1px solid #EBF4FC;

    margin-top: 8px;

}



.rekishi-doc-related-title {

    font-size: 12px;

    color: #888888;

    margin: 0 0 8px;

    font-weight: 700;

}



.rekishi-doc-related-list {

    padding-left: 16px;

    margin: 0;

}



.rekishi-doc-related-list li {

    font-size: 13px;

    margin-bottom: 4px;

}



.rekishi-doc-related-list a {

    color: #64B5F6;

    text-decoration: none;

}



.rekishi-doc-related-list a:hover {
    text-decoration: underline;
}

/* 説明文 左位置調整 */

#section-3 .rekishi-doc-desc {
    margin: 0px;
    padding-left: 16px;
    padding-top: 5px;
}


/* 用語解説 */

.rekishi-doc-glossary {

    padding: 12px 16px;

    border-top: 1px solid #EBF4FC;

}



.rekishi-doc-glossary dl {

    margin: 0;

    display: flex;

    flex-direction: column;

    gap: 4px;

}



.rekishi-doc-glossary dt {

    font-size: 12px;

    font-weight: 700;

    color: #64B5F6;

}



.rekishi-doc-glossary dd {

    font-size: 12px;

    color: #4E4844;

    margin: 0 0 8px;

    padding-left: 8px;

    border-left: 2px solid #EBF4FC;

}


/* 用語解説 */

.rekishi-doc-glossary {

    padding: 8px 16px;

    border-top: 1px solid #EBF4FC;

    font-size: 12px;

    color: #4E4844;

}



.rekishi-doc-glossary-term {

    font-weight: 700;

    color: #64B5F6;

}

.rekishi-doc-glossary p {

    margin: 0 !important;

}


.rekishi-doc-related-list {

    margin: 0 !important;

}



.rekishi-doc-related {
    margin-top: 0 !important;
}

/* 移動図書館車 ヒーロー */

.bookmobile-hero {

    display: flex;

    gap: 40px;

    align-items: center;

    padding: 40px 0;

}



.bookmobile-hero-image {

    flex: 1.5;

}



.bookmobile-hero-image img {

    width: 100%;

    border-radius: 12px;

    object-fit: cover;

}



.bookmobile-hero-text {

    flex: 1;

}



.bookmobile-hero-title {

    font-size: 28px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 16px;

    border: none !important;

}



.bookmobile-hero-title::after {

    display: none !important;

}

.bookmobile-hero-desc {
    font-size: 15px;
    color: #4E4844;
    line-height: 2;
    margin: 0;
}

/* 移動図書館車 セクション共通 */

.bookmobile-section {

    background: #ffffff;

    border-radius: 12px;

    padding: 24px;

    margin-bottom: 16px;

}



.bookmobile-section-title {

    display: flex;

    align-items: center;

    gap: 8px;

    font-size: 18px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 20px;

    border: none !important;

}



.bookmobile-section-title::after {

    display: none !important;

}



/* 巡回場所 */

.bookmobile-place-list {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 16px;

}



.bookmobile-place-item {

    display: flex;

    flex-direction: column;

    align-items: center;

    text-align: center;

    gap: 8px;

    padding: 16px;

    background: #FDF9ED;

    border-radius: 12px;

}



.bookmobile-place-icon {

    width: 72px;

    height: 72px;

    border-radius: 50%;

    background: #FDD2D9;

    display: flex;

    align-items: center;

    justify-content: center;

}



.bookmobile-place-name {

    font-size: 14px;

    font-weight: 700;

    color: #4E4844;

    margin: 0;

}



.bookmobile-place-desc {
    font-size: 12px;
    color: #888888;
    margin: 0;
    line-height: 1.6;
}

/* 活動 */

.bookmobile-activity-list {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 16px;

}



.bookmobile-activity-item {

    background: #FDF9ED;

    border-radius: 12px;

    padding: 16px;

    display: flex;

    flex-direction: column;

    gap: 8px;

}



.bookmobile-activity-title {

    font-size: 15px;

    font-weight: 700;

    color: #F4789A;

    margin: 0;

    border: none !important;

    padding: 0 !important;

}



.bookmobile-activity-title::after {

    display: none !important;

}



.bookmobile-activity-desc {
    font-size: 13px;
    color: #4E4844;
    margin: 0;
    line-height: 1.8;
}

/* 2カラムレイアウト */

.bookmobile-two-col {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 16px;

    margin-bottom: 16px;

}



/* 歴史タイムライン */

.bookmobile-history-desc {

    font-size: 13px;

    color: #4E4844;

    margin: 0 0 16px;

    line-height: 1.8;

}



.bookmobile-timeline {

    display: flex;

    flex-direction: column;

    gap: 12px;

    margin-bottom: 16px;

}



.bookmobile-timeline-item {

    display: flex;

    flex-direction: column;

    gap: 4px;

    padding: 10px 12px;

    background: #FDF9ED;

    border-radius: 8px;

    border-left: 3px solid #F4789A;

}



.bookmobile-timeline-year {

    font-size: 12px;

    color: #F4789A;

    font-weight: 700;

    font-family: 'Comfortaa', cursive;

}



.bookmobile-timeline-event {

    font-size: 13px;

    color: #4E4844;

}



.bookmobile-history-footer {

    font-size: 13px;

    color: #888888;

    margin: 0;

    line-height: 1.8;

}



/* 車の紹介 */

.bookmobile-cars-list {
    display: flex;

    flex-direction: column;

    gap: 8px;

}



.bookmobile-quiz-q {

    font-size: 14px;

    font-weight: 700;

    color: #F4789A;

    margin: 0;

    font-family: 'Comfortaa', cursive;

}



.bookmobile-quiz-question {

    font-size: 13px;

    font-weight: 700;

    color: #4E4844;

    margin: 0;

    line-height: 1.6;

}



.bookmobile-quiz-choices {

    list-style: none;

    padding: 0;

    margin: 0;

    display: flex;

    flex-direction: column;

    gap: 4px;

}



.bookmobile-quiz-choices li {

    font-size: 12px;

    color: #4E4844;

    padding: 4px 8px;

    background: #ffffff;

    border-radius: 4px;

}



.bookmobile-quiz-footer {

    text-align: center;

}



.bookmobile-quiz-btn {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding: 12px 32px;

    border-radius: 20px;

    background: #FDD2D9;

    color: #F4789A;

    text-decoration: none;

    font-size: 14px;

    font-weight: 700;

}

.bookmobile-quiz-btn:hover {
    background: #F4789A;
    color: #ffffff;
}


/* 巡回場所カード 緑枠・緑アイコン */

.bookmobile-place-item {

    border: 2px solid #35A549;

    background: #ffffff;

}

.bookmobile-place-icon {
    background: #35A549;
}

.bookmobile-place-icon svg {
    stroke: #ffffff;
}

/* 巡回場所 文字サイズ・枠線調整 */

.bookmobile-place-item {

    border: 3px solid #35A549 !important;

}

.bookmobile-place-name {
    font-size: 18px !important;
}

.bookmobile-place-desc {
    font-size: 16px !important;
}

/* おもな巡回場所 タイトルサイズ */
.bookmobile-section-title {
    font-size: 22px !important;
}

/* セクションタイトル アイコンサイズ */
.bookmobile-section-title svg {
    width: 24px !important;
    height: 24px !important;
}


/* 活動カード デザイン変更 */

.bookmobile-activity-item {

    background: #ffffff !important;

    border: 2px solid;

    border-radius: 12px;

    padding: 16px;

    position: relative;

}



.bookmobile-activity-item:nth-child(1) {
    border-color: #E9786F;
}

.bookmobile-activity-item:nth-child(2) {
    border-color: #F5BE57;
}

.bookmobile-activity-item:nth-child(3) {
    border-color: #A8C95B;
}

.bookmobile-activity-item:nth-child(4) {
    border-color: #82B7E8;
}

/* タイトルに丸アイコン */
.bookmobile-activity-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px !important;
}

.bookmobile-activity-title::before {
    content: "";
    width: 14px;
    height: 14px;
    border-radius: 50%;
    flex-shrink: 0;
}

.bookmobile-activity-item:nth-child(1) .bookmobile-activity-title::before {
    background: #E9786F;
}

.bookmobile-activity-item:nth-child(2) .bookmobile-activity-title::before {

    background: #F5BE57;
}

.bookmobile-activity-item:nth-child(3) .bookmobile-activity-title::before {
    background: #A8C95B;
}

.bookmobile-activity-item:nth-child(4) .bookmobile-activity-title::before {
    background: #82B7E8;
}

/* 活動カード タイトル文字色 */

.bookmobile-activity-title {
    color: #4E4844 !important;
}

.bookmobile-place-icon svg {
    width: 40px !important;
    height: 40px !important;
}

.bookmobile-section-title svg {
    stroke: #F4789A !important;
}


/* タイムライン 年 色変更 */

.bookmobile-timeline-year {

    color: #35A549 !important;

}

.bookmobile-timeline-item {
    border-left-color: #35A549 !important;
}

.bookmobile-timeline-year,
.bookmobile-history-desc,
.bookmobile-timeline-event,
.bookmobile-history-footer {
    font-family: 'Zen Maru Gothic', sans-serif !important;
}

.bookmobile-activity-title {
    font-size: 18px !important;
}

.bookmobile-activity-desc {
    font-size: 16px !important;
}

.bookmobile-activity-desc {
    color: #888888 !important;
}

/* 車の紹介 縦並び */

.bookmobile-cars-list {

    display: flex;

    flex-direction: column;

    gap: 20px;

}



.bookmobile-car-item {

    display: flex;

    gap: 16px;

    align-items: flex-start;

}



.bookmobile-car-item img {

    width: 160px;

    height: 120px;

    object-fit: cover;

    border-radius: 8px;

    flex-shrink: 0;

    border: 2px solid #FDD2D9;

}



.bookmobile-car-info {
    flex: 1;
}

.bookmobile-car-name {
    font-size: 18px !important;
    font-weight: 700;
    color: #4E4844;
    margin: 0 0 8px;
    border: none !important;
    padding: 0 !important;
}

.bookmobile-car-name::after {
    display: none !important;
}

.bookmobile-car-desc {
    font-size: 16px;
    color: #888888;
    margin: 0;
    line-height: 1.8;
}

.bookmobile-history-desc {
    font-size: 16px !important;
    color: #888888 !important;
}

/* 巡回日程リンク */

.bookmobile-schedule-list {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 16px;

    margin-bottom: 12px;

}



.bookmobile-schedule-link {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 16px 20px;

    background: #35A549;

    border-radius: 40px;

    text-decoration: none;

    gap: 12px;

}



.bookmobile-schedule-link:hover {

    opacity: 0.85;

}



.bookmobile-schedule-link-title {

    font-size: 18px;

    font-weight: 700;

    color: #ffffff;

    margin: 0 0 4px;

}

.bookmobile-schedule-link-desc {
    font-size: 13px;
    color: #ffffff;
    margin: 0;
    opacity: 0.9;
}

.bookmobile-schedule-link-arrow {
    flex-shrink: 0;
}

.bookmobile-schedule-note {
    font-size: 13px;
    color: #888888;
    margin: 0;
}

.bookmobile-two-col {
    margin-bottom: 0 !important;
}

/* 数字でみる移動図書館車 テーブル */

.bookmobile-table {

    border-collapse: collapse;

    border: 2px solid #35A549;

    width: 100%;

    margin-top: 16px;

}



.bookmobile-table th,

.bookmobile-table td {

    border: 2px solid #35A549;

    padding: 12px 16px;

    font-size: 16px;

    text-align: center;

}



.bookmobile-table th {

    background: #35A549;

    color: #ffffff;

    font-weight: 700;

}



.bookmobile-table td {

    color: #4E4844;

}



.bm-name {
    background: rgba(53, 165, 73, 0.3) !important;
    font-weight: 700;
}

/* クイズ 答え */
.bookmobile-quiz-answer {
    font-size: 14px;
    font-weight: 700;
    color: #35A549;
    margin: 8px 0 0;
    padding: 8px;
    background: rgba(53, 165, 73, 0.1);
    border-radius: 6px;
}

.bookmobile-quiz-item {
    border: 2px solid #35A549 !important;
    background: #ffffff !important;
}

.bookmobile-quiz-q {
    color: #35A549 !important;
}

/* クイズリスト */

.bookmobile-quiz-list {

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 16px;

    margin-bottom: 20px;

}



.bookmobile-quiz-item {

    border: 2px solid #35A549 !important;

    background: #ffffff !important;

    border-radius: 8px;

    padding: 16px;

    display: flex;

    flex-direction: column;

    gap: 8px;

}



.bookmobile-quiz-q {

    font-size: 14px;

    font-weight: 700;

    color: #35A549 !important;

    margin: 0;

}



.bookmobile-quiz-question {

    font-size: 14px;

    font-weight: 700;

    color: #4E4844;

    margin: 0;

    line-height: 1.6;

}



.bookmobile-quiz-choices {

    list-style: none;

    padding: 0;

    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bookmobile-quiz-choices li {
    font-size: 13px;
    color: #4E4844;
}

.bookmobile-quiz-q {
    color: #F4789A !important;
    font-size: 16px !important;
}

.bookmobile-quiz-question,
.bookmobile-quiz-choices li,
.bookmobile-quiz-answer {
    font-size: 16px !important;
}

.bookmobile-quiz-explain {
    font-weight: 400 !important;
}

/* 図書館車の歴史 アイコンサイズ */

.bookmobile-history .bookmobile-section-title svg {
    width: 32px !important;
    height: 32px !important;
}

/* 移動図書館車 画像サイズ */

.bookmobile-car-item img {
    width: 240px !important;
    height: 180px !important;
}

/* ヒーロー右カラム 縦中央 */

.bookmobile-hero-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

.bookmobile-hero-text {
    padding-left: 20px;
}

#bookmobile-run {

    position: fixed;

    bottom: 0;

    left: 0;

    width: 100%;

    pointer-events: none;

    z-index: 900;

    height: 100px;

    border-top: 2px solid #e0e0e0;

    background: rgba(255,255,255,0.8);

}


#bookmobile-run {

    position: relative;

    width: 100%;

    pointer-events: none;

    z-index: 900;

    height: 100px;

    border-top: 2px solid #e0e0e0;

    background: rgba(255,255,255,0.8);

    overflow: hidden;

}



#bookmobile-sanpei,

#bookmobile-sohappy {

    position: absolute;

    bottom: 8px;

    height: 80px;

    width: auto;

}

#soo-page-top {

    width: 60px;

    height: auto;

}



#soo-page-top img {

    width: 100%;

    height: auto;

    object-fit: contain;

}

/* スマホ：移動図書館車ページ */

@media (max-width: 767.9px) {

    /* 巡回場所 2列 */

    .bookmobile-place-list {

        grid-template-columns: repeat(2, 1fr) !important;

    }



    /* 活動 2列 */

    .bookmobile-activity-list {

        grid-template-columns: repeat(2, 1fr) !important;

    }



    /* 歴史・紹介 縦並び */

    .bookmobile-two-col {

        grid-template-columns: 1fr !important;

    }



    /* 数字でみる 横スクロール */

    .bookmobile-table {

        display: block;

        overflow-x: auto;

        white-space: nowrap;

    }



    /* 巡回日程 縦並び */

    .bookmobile-schedule-list {

        grid-template-columns: 1fr !important;

    }



    /* クイズ 2列 */

    .bookmobile-quiz-list {

        grid-template-columns: repeat(2, 1fr) !important;

    }

}

/* スマホ：移動図書館車ページ */

@media (max-width: 767.9px) {

    /* 巡回場所 1列 */

    .bookmobile-place-list {

        grid-template-columns: 1fr !important;

    }



    /* 活動 1列 */

    .bookmobile-activity-list {

        grid-template-columns: 1fr !important;

    }



    /* 歴史・紹介 縦並び */

    .bookmobile-two-col {

        grid-template-columns: 1fr !important;

    }



    /* 数字でみる 横スクロール */

    .bookmobile-table {

        display: block;

        overflow-x: auto;

        white-space: nowrap;

    }



    /* 巡回日程 縦並び */

    .bookmobile-schedule-list {

        grid-template-columns: 1fr !important;

    }



    /* クイズ 1列 */

    .bookmobile-quiz-list {

        grid-template-columns: 1fr !important;

    }



    /* 移動図書館車の紹介 縦並び */

    .bookmobile-car-item {

        flex-direction: column !important;

    }



    .bookmobile-car-item img {

        width: 100% !important;

        height: auto !important;

    }

}

/* クイズ こたえをみるボタン border無 */

.bookmobile-quiz-btn {

    border: none !important;

}


/* タブレット：移動図書館車ページ */

@media (min-width: 768px) and (max-width: 991.9px) {

    /* 巡回場所 2列 */

    .bookmobile-place-list {

        grid-template-columns: repeat(2, 1fr) !important;

    }



    /* 活動 2列 */

    .bookmobile-activity-list {

        grid-template-columns: repeat(2, 1fr) !important;

    }



    /* 歴史・紹介 縦並び */

    .bookmobile-two-col {

        grid-template-columns: 1fr !important;

    }



    /* クイズ 2列 */

    .bookmobile-quiz-list {

        grid-template-columns: repeat(2, 1fr) !important;

    }

}

/* はじめての図書館 タブ */

.hajimete-tabs {

    display: flex;

    gap: 0;

    margin-bottom: 24px;

    background: #ffffff;

    border-radius: 40px;

    padding: 4px;

}



.hajimete-tab {

    flex: 1;

    padding: 12px 8px;

    border: none;

    background: transparent;

    cursor: pointer;

    font-size: 14px;

    font-family: 'Zen Maru Gothic', sans-serif;

    color: #4E4844;

    border-radius: 40px;

    transition: all 0.2s;

}



.hajimete-tab.active {

    background: var(--tab-color);

    color: #ffffff;

    font-weight: 700;

}


/* PAGE TOP ボタン サイズ・位置調整 */

#soo-page-top {
    width: 90px !important;
    right: 40px !important;
}

/* はじめての図書館 セクション */

.hajimete-section {

    margin-bottom: 24px;

}



.hajimete-section-title {

    display: flex;

    align-items: center;

    gap: 8px;

    font-size: 20px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 8px;

    padding-bottom: 8px;

    border-bottom: 2px dashed #f0f0f0;

    border-top: none !important;

}



.hajimete-section-title::after {

    display: none !important;

}



.hajimete-section-desc {

    font-size: 16px;

    color: #888888;

    margin: 0;

}



/* ステップ */

.hajimete-steps {

    display: flex;

    gap: 8px;

    align-items: flex-start;

    margin-bottom: 24px;

}



.hajimete-step {

    flex: 1;

    background: #ffffff;

    border-radius: 12px;

    padding: 16px;

    border: 1px solid #f0f0f0;

    display: flex;

    flex-direction: column;

    gap: 8px;

}



.hajimete-step-num {

    width: 32px;

    height: 32px;

    border-radius: 50%;

    color: #ffffff;

    font-weight: 700;

    font-family: 'Comfortaa', cursive;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 16px;

}



.hajimete-step-title {

    font-size: 15px;

    font-weight: 700;

    color: #4E4844;

    margin: 0;

    border: none !important;

    padding: 0 !important;

}



.hajimete-step-title::after {

    display: none !important;

}



.hajimete-step-desc {

    font-size: 13px;

    color: #888888;

    margin: 0;

    line-height: 1.6;

}



.hajimete-step-info {

    background: #FDF9ED;

    border-radius: 8px;

    padding: 10px;

    margin-top: auto;

}



.hajimete-step-label {

    font-size: 12px;

    font-weight: 700;

    display: block;

    margin-bottom: 4px;

}



.hajimete-step-info p {

    font-size: 12px;

    color: #4E4844;

    margin: 0;

    line-height: 1.8;

}



.hajimete-step-arrow {
    font-size: 24px;
    color: #cccccc;
    padding-top: 40px;
    flex-shrink: 0;
}

/* ステップ矢印位置調整 */

.hajimete-step-arrow {
    padding-top: 16px !important;
    align-self: center;
}


.hajimete-steps {
    align-items: stretch;
}

.site-footer {
    border: none !important;
    border-top: none !important;
}

/* ==============================================================

   はじめての図書館 各タブ用 追加スタイル

   ============================================================== */

 

/*a
a
a
a
a
a
a

a
a
a
a
a
a

a
a
a
a
a
a
a
a

a
a
a
a
a
a
a

a
a
a
a
a
a
a

a
a
a
a
a
a
a

a
a
a
a
a
aa
a
a
a
a
a
a

a
a
a
a
a
a
a
a
a
a
a
a
a */

/* ==============================================================

   はじめての図書館 各タブ用 追加スタイル

   ============================================================== */

 

/* 各タブ内の見出し下、機能カードをまとめる外枠（枠線なし・白背景） */

.hajimete-box {

    background: #ffffff;

    border-radius: 16px;

    padding: 24px;

    margin-bottom: 24px;

}

 

/* 機能カードのグリッド */

.hajimete-fgrid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));

    gap: 16px;

}

 

/* 機能カード本体（タブごとの色で枠線） */

.hajimete-fcard {

    border: 2.5px solid var(--tab-color, #F4789A);

    border-radius: 12px;

    padding: 16px;

    display: flex;

    flex-direction: column;

    gap: 8px;

    background: #ffffff;

}

 

.hajimete-fcard-title {

    display: flex;

    align-items: center;

    gap: 8px;

    font-size: 15px;

    font-weight: 700;

    color: #4E4844;

    margin: 0;

    border: none !important;

    padding: 0 !important;

}

 

.hajimete-fcard-title::after {

    display: none !important;

}

 

.hajimete-fcard-num {

    width: 26px;

    height: 26px;

    border-radius: 50%;

    color: #ffffff;

    font-size: 13px;

    font-weight: 700;

    font-family: 'Comfortaa', cursive;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    box-sizing: border-box;

    padding-top: 3px;

    line-height: 1;

}

 

.hajimete-fcard-desc {

    font-size: 13px;

    color: #888888;

    line-height: 1.6;

    margin: 0;

}

 

.hajimete-fcard-img {

    width: 100%;

    aspect-ratio: 4 / 3;

    background: #f0f0f0;

    border-radius: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #cccccc;

    font-size: 13px;

}

 

.hajimete-fcard-list {

    font-size: 12px;

    color: #4E4844;

    line-height: 1.8;

    margin: 0;

}

 

/* タグ（ラベル＋値） */

.hajimete-tag-row {

    display: flex;

    align-items: flex-start;

    gap: 8px;

    flex-wrap: wrap;

}

 

.hajimete-tag {

    display: inline-block;

    flex-shrink: 0;

    background: var(--tab-color, #F4789A);

    color: #ffffff;

    font-size: 11px;

    font-weight: 700;

    padding: 2px 10px;

    border-radius: 12px;

    white-space: nowrap;

}

 

.hajimete-tag-value {

    font-size: 12px;

    color: #4E4844;

    padding-top: 2px;

}

 

/* カード内リンクボタン（タブごとの色） */

.hajimete-fcard-btn {

    display: inline-flex;

    align-items: center;

    gap: 4px;

    font-size: 12px;

    font-weight: 700;

    border: 1px solid var(--tab-color, #F4789A);

    border-radius: 20px;

    padding: 6px 14px;

    text-decoration: none;

    margin-top: auto;

    width: fit-content;

}

 

.hajimete-fcard-btn:hover {

    opacity: 0.75;

}

 

/* 「もっと知りたい」「関連サービス」セクション（枠線なし・白背景） */

.hajimete-more {

    background: #ffffff;

    border-radius: 16px;

    padding: 24px;

    margin-bottom: 24px;

}

 

.hajimete-more-grid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

    gap: 16px;

}

 

.hajimete-more-card {

    border: 2.5px solid #35A549;

    border-radius: 12px;

    padding: 16px;

    display: flex;

    flex-direction: column;

    gap: 8px;

}

 

.hajimete-more-title {

    display: flex;

    align-items: center;

    gap: 8px;

    font-size: 15px;

    font-weight: 700;

    color: #4E4844;

    margin: 0;

    border: none !important;

    padding: 0 !important;

}

 

.hajimete-more-title::after {

    display: none !important;

}

 

.hajimete-more-title::before {

    content: "";

    width: 10px;

    height: 10px;

    border-radius: 50%;

    background: #35A549;

    flex-shrink: 0;

}

 

.hajimete-more-desc {

    font-size: 13px;

    color: #888888;

    line-height: 1.6;

    margin: 0;

}

 

.hajimete-more-btn {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    background: #35A549;

    color: #ffffff;

    font-size: 13px;

    font-weight: 700;

    padding: 8px 16px;

    border-radius: 20px;

    text-decoration: none;

    margin-top: auto;

    width: fit-content;

}

 

.hajimete-more-btn:hover {

    opacity: 0.85;

}

 

/* スマホ：2列 → 1列 */

@media (max-width: 767.9px) {

    .hajimete-fgrid,

    .hajimete-more-grid {

        grid-template-columns: 1fr;

    }

}

 

/* タブレット：2列 */

@media (min-width: 768px) and (max-width: 991.9px) {

    .hajimete-fgrid,

    .hajimete-more-grid {

        grid-template-columns: repeat(2, 1fr);

    }

}

 

/* ==============================================================

   追加調整（上記スタイルへの追記・上書き用）

   ============================================================== */

 

.hajimete-fcard-title {

    font-size: 18px;

}

 

.hajimete-fcard-desc {

    font-size: 16px;

}

 

.hajimete-tag-value {

    font-size: 16px;

}

 

.hajimete-tag {

    font-size: 14px;

    font-weight: 600;

}

 

.hajimete-fcard {

    padding: 8px;

}

 

.hajimete-fcard-btn {

    padding-top: 3px;

    padding-bottom: 3px;

    width: 100%;

    justify-content: center;

    background: var(--tab-color, #F4789A);

    color: #ffffff;

    border: none;

    font-size: 16px;

}

 

.hajimete-more-title {

    font-size: 18px;

}

 

.hajimete-more-desc {

    font-size: 16px;

}

 

.hajimete-more-card {

    padding: 8px;

}

 

.hajimete-more-btn {

    padding-top: 3px;

    padding-bottom: 3px;

    width: 100%;

    justify-content: center;

    font-size: 16px;

}

 

/* 白抜き文字を #333333 に変更 */

.hajimete-fcard-num,

.hajimete-tag,

.hajimete-fcard-btn,

.hajimete-more-btn {

    color: #333333;

}



.hajimete-fcard-list {

    font-size: 16px;

}

 

.hajimete-fcard-title {

    justify-content: center;

    text-align: center;

}

 

.hajimete-tag {

    font-weight: 500;

}

 

.hajimete-tag-row {

    align-items: center;

}

 

.hajimete-tag-value {

    padding-top: 0;

}


/* ==============================================================

   追加調整その3

   ============================================================== */

 

.hajimete-fcard-btn {

    font-weight: 500;

}

 

.hajimete-tag-row {

    gap: 2px;

}

 

/* 白背景の上の文字色 */

.hajimete-fcard-title,

.hajimete-fcard-desc,

.hajimete-fcard-list,

.hajimete-tag-value,

.hajimete-more-title,

.hajimete-more-desc {

    color: #555555;

}

 

/* 色付き背景の上の文字色 */

.hajimete-fcard-num,

.hajimete-tag,

.hajimete-fcard-btn,

.hajimete-more-btn {

    color: #444444;

}

 
 


.hajimete-tag-row {

    gap: 4px;

}

 

.hajimete-fcard-btn {

    margin-top: 8px;

}


/* ==============================================================

   追加調整その5:「ゆっくり過ごしたい・調べたい」タブのみ

   PC表示でカードを3列にする(他のタブは自動調整のまま)

   タブレット・スマホは他のタブと同じ列数のため変更なし

   ============================================================== */



@media (min-width: 992px) {

    #tab-relax .hajimete-fgrid {

        grid-template-columns: repeat(3, 1fr);

    }

}


/* ==============================================================

   追加調整その6:hajimete-fcard-btnの位置をhajimete-more-btnと

   同じく、カード内で一番下に配置されるよう修正

   (追加調整その4でmargin-topを固定値にしたことで、

   本来のmargin-top: autoによる下端揃えが効かなくなっていたため)

   ============================================================== */



.hajimete-fcard-btn {

    margin-top: auto;

}


/* ==============================================================

   追加調整その7:ボタンが2つ以上あるカードで、

   2つ目以降のボタンにmargin-top: autoが重なって

   余計な隙間ができるのを防ぐ(最初の1つだけ下端に押し出す)

   ============================================================== */



.hajimete-fcard-btn + .hajimete-fcard-btn {

    margin-top: 0;

}




 
/***************************************************************************************************************************************************************************************************************************************/

/* ==============================================================

   探し方・調べ方 ページ用スタイル

   ============================================================== */

 

.sagashi-grid {

    display: flex;

    flex-direction: column;

    gap: 24px;

}

 

/* パネル本体（白背景・角丸） */

.sagashi-panel {

    background: #ffffff;

    border-radius: 16px;

    padding: 24px;

}

 

.sagashi-panel-title {

    display: flex;

    align-items: center;

    gap: 8px;

    font-size: 20px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 4px;

    border: none !important;

    padding: 0 !important;

}

 

.sagashi-panel-title::before {

    content: "";

    width: 10px;

    height: 10px;

    border-radius: 50%;

    background: var(--accent-color, #64B5F6);

    flex-shrink: 0;

}

 

.sagashi-panel-title::after {

    display: none !important;

}

 

.sagashi-panel-desc {

    font-size: 16px;

    color: #888888;

    line-height: 1.6;

    margin: 0 0 16px;

}

 

/* ---------------- ステップフロー（パネル1） ---------------- */

.sagashi-stepbox {

    background: #f7f7f5;

    border-radius: 12px;

    padding: 16px;

    margin-bottom: 16px;

}

 

.sagashi-stepbox-title {

    font-size: 14px;

    font-weight: 700;

    color: #888888;

    margin: 0 0 12px;

}

 

.sagashi-steps {

    display: flex;

    align-items: stretch;

    gap: 8px;

}

 

.sagashi-step {

    flex: 1;

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 8px;

    text-align: center;

    background: #ffffff;

    border-radius: 12px;

    padding: 16px 12px;

}

 

.sagashi-step-num {

    width: 28px;

    height: 28px;

    border-radius: 50%;

    background: var(--accent-color, #64B5F6);

    color: #444444;

    font-size: 14px;

    font-weight: 700;

    font-family: 'Comfortaa', cursive;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

}

 

.sagashi-step-title {

    font-size: 16px;

    font-weight: 700;

    color: #555555;

    margin: 0;

}

 

.sagashi-step-desc {

    font-size: 14px;

    color: #888888;

    line-height: 1.5;

    margin: 0;

}

 

.sagashi-step-extra {

    font-size: 13px;

    color: #999999;

    line-height: 1.6;

    margin: 0;

}

 

.sagashi-step-arrow {

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 28px;

    color: var(--accent-color, #64B5F6);

    flex-shrink: 0;

}

 

/* 検索窓モック */

.sagashi-search-mock {

    display: flex;

    align-items: center;

    width: 100%;

    max-width: 220px;

    background: #ffffff;

    border: 1px solid #dddddd;

    border-radius: 20px;

    overflow: hidden;

}

 

.sagashi-search-mock input {

    flex: 1;

    min-width: 0;

    border: none;

    background: transparent;

    padding: 8px 12px;

    font-size: 14px;

}

 

.sagashi-search-mock-btn {

    flex-shrink: 0;

    width: 32px;

    height: 32px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: var(--accent-color, #64B5F6);

}

 

/* 背ラベルモック */

.sagashi-label-mock {

    display: inline-flex;

    flex-direction: column;

    align-items: center;

    gap: 2px;

    background: #ffffff;

    border: 1px solid #cccccc;

    border-radius: 4px;

    padding: 8px 10px;

}

 

.sagashi-label-mock-num {

    font-size: 16px;

    font-weight: 700;

    color: #555555;

    line-height: 1.2;

}

 

.sagashi-label-mock-kana {

    font-size: 13px;

    color: #888888;

    line-height: 1.2;

}

 

/* タグ */

.sagashi-tag-row {

    display: flex;

    align-items: center;

    gap: 4px;

    flex-wrap: wrap;

    margin-bottom: 4px;

}

 

.sagashi-tag {

    display: inline-block;

    background: var(--accent-color, #64B5F6);

    color: #444444;

    font-size: 14px;

    font-weight: 500;

    padding: 2px 10px;

    border-radius: 12px;

    white-space: nowrap;

}

 

/* ボタン行・ボタン共通 */

.sagashi-btn-row {

    display: flex;

    gap: 12px;

    flex-wrap: wrap;

}

 

.sagashi-btn {

    flex: 1;

    min-width: 140px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    background: var(--accent-color, #64B5F6);

    color: #444444;

    font-size: 16px;

    font-weight: 500;

    padding-top: 3px;

    padding-bottom: 3px;

    padding-left: 16px;

    padding-right: 16px;

    border-radius: 20px;

    text-decoration: none;

}

 

.sagashi-btn:hover {

    opacity: 0.85;

}

 

/* ---------------- カードグリッド（パネル2・3共通） ---------------- */

.sagashi-fgrid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));

    gap: 16px;

}

 

.sagashi-fcard {

    border: 2.5px solid var(--accent-color, #64B5F6);

    border-radius: 12px;

    padding: 8px;

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 8px;

    background: #ffffff;

    text-align: center;

}

 

.sagashi-fcard-title {

    font-size: 18px;

    font-weight: 700;

    color: #555555;

    margin: 0;

}

 

.sagashi-fcard-desc {

    font-size: 16px;

    color: #555555;

    line-height: 1.6;

    margin: 0;

}

 

.sagashi-fcard-img {

    width: 100%;

    aspect-ratio: 4 / 3;

    background: #f0f0f0;

    border-radius: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #cccccc;

    font-size: 13px;

}

 

.sagashi-fcard .sagashi-search-mock,

.sagashi-fcard .sagashi-label-mock {

    align-self: center;

}

 

.sagashi-fcard .sagashi-btn {

    width: 100%;

    flex: none;

}

 

/* ---------------- 行リスト（パネル4） ---------------- */

.sagashi-rows {

    display: flex;

    flex-direction: column;

    gap: 12px;

}

 

.sagashi-row {

    display: flex;

    align-items: center;

    gap: 16px;

    padding: 12px 16px;

    border: 2px solid var(--accent-color, #64B5F6);

    border-radius: 12px;

    flex-wrap: wrap;

}

 

.sagashi-row-label {

    flex-shrink: 0;

    background: var(--accent-color, #64B5F6);

    color: #444444;

    font-size: 15px;

    font-weight: 700;

    padding: 4px 14px;

    border-radius: 14px;

}

 

.sagashi-row-desc {

    flex: 1;

    min-width: 160px;

    font-size: 16px;

    color: #555555;

    line-height: 1.6;

}

 

.sagashi-row-btn {

    flex-shrink: 0;

    display: inline-flex;

    align-items: center;

    gap: 4px;

    background: var(--accent-color, #64B5F6);

    color: #444444;

    font-size: 14px;

    font-weight: 500;

    padding: 6px 14px;

    border-radius: 16px;

    text-decoration: none;

}

 

.sagashi-row-btn:hover {

    opacity: 0.85;

}

 

/* ---------------- お知らせボックス（パネル5） ---------------- */

.sagashi-noticebox {

    border: 2.5px solid var(--accent-color, #64B5F6);

    border-radius: 12px;

    padding: 16px;

}

 

.sagashi-noticebox-title {

    font-size: 18px;

    font-weight: 700;

    color: #555555;

    margin: 0 0 8px;

}

 

.sagashi-noticebox-desc {

    font-size: 16px;

    color: #555555;

    line-height: 1.7;

    margin: 0;

}

 

.sagashi-subbox {

    background: #f7f7f5;

    border-radius: 10px;

    padding: 14px 16px;

    margin-top: 16px;

}

 

.sagashi-subbox-title {

    display: block;

    font-size: 14px;

    font-weight: 700;

    color: #888888;

    margin-bottom: 6px;

}

 

.sagashi-subbox ul {

    margin: 0;

    padding-left: 1.2em;

}

 

.sagashi-subbox li {

    font-size: 14px;

    color: #888888;

    line-height: 1.7;

}

 

/* ==============================================================

   レスポンシブ

   ============================================================== */

 

/* スマホ：ステップは縦並び・矢印は非表示 */

@media (max-width: 767.9px) {

    .sagashi-fgrid {

        grid-template-columns: 1fr;

    }

 

    .sagashi-steps {

        flex-direction: column;

    }

 

    .sagashi-step-arrow {

        transform: rotate(90deg);

    }

 

    .sagashi-row {

        flex-direction: column;

        align-items: flex-start;

    }

 

    .sagashi-row-btn {

        width: 100%;

        justify-content: center;

    }

}

 

/* タブレット：カード2列 */

@media (min-width: 768px) and (max-width: 991.9px) {

    .sagashi-fgrid {

        grid-template-columns: repeat(2, 1fr);

    }

}

 

/* ==============================================================

   追加調整（パネル幅）

   ============================================================== */

 

.sagashi-panel {

    max-width: 700px;

    margin-left: auto;

    margin-right: auto;

}

 

/* ==============================================================

   パネル1「読みたい本が決まっているとき」カード

   （番号+タイトルを横並びにする左寄せカード）

   ============================================================== */

 

.sagashi-fcard-step {

    align-items: flex-start;

    text-align: left;

    padding: 16px;

}

 

.sagashi-fcard-head {

    display: flex;

    align-items: center;

    gap: 8px;

    width: 100%;

}

 

.sagashi-fcard-num {

    width: 24px;

    height: 24px;

    border-radius: 50%;

    background: var(--accent-color, #64B5F6);

    color: #ffffff;

    font-size: 13px;

    font-weight: 700;

    font-family: 'Comfortaa', cursive;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

}

 

.sagashi-fcard-step .sagashi-fcard-title {

    font-size: 16px;

    text-align: left;

    margin: 0;

}

 

.sagashi-fcard-list {

    font-size: 14px;

    color: #555555;

    line-height: 1.8;

    margin: 0;

}

 

.sagashi-fcard-step .sagashi-btn {

    width: auto;

    flex: none;

    align-self: flex-start;

    margin-top: auto;

}

 
/* パネル1のカードは、タブレット幅でも2列にせず3列のまま */

@media (min-width: 768px) and (max-width: 991.9px) {

    .sagashi-fgrid-steps {

        grid-template-columns: repeat(3, 1fr);

    }

}

 /* ==============================================================

   追加調整（カードグリッドは全パネル共通で3列固定・スマホのみ1列）

   ============================================================== */

 

@media (min-width: 768px) {

    .sagashi-fgrid {

        grid-template-columns: repeat(3, 1fr);

    }

}




/* ==============================================================

   追加調整（画像プレースホルダー内に実画像を入れた場合）

   ============================================================== */

 

.sagashi-fcard-img img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    border-radius: 8px;

    display: block;

}



.sagashi-fcard-img {

    width: 160px;

    height: 120px;

    aspect-ratio: auto;

    flex-shrink: 0;

    align-self: center;

}

.sagashi-panel-title::before {

    width: 15px;

    height: 15px;

}

.sagashi-fcard-desc {

    font-weight: 500;

}

.sagashi-fcard-title {

    border: none !important;

    padding: 0 !important;

}

 

.sagashi-fcard-title::after {

    display: none !important;

}

.sagashi-btn {

    font-size: 14px;

}

.sagashi-btn {

    color: #ffffff;

}

.sagashi-btn {

    font-weight: 500;

}

.sagashi-fcard-step .sagashi-btn {

    align-self: center;

}

.sagashi-fcard .sagashi-btn-auto {

    width: auto;

    flex: none;

}

.sagashi-row-btn {

    color: #ffffff;

}

/* ==============================================================

   追加調整（パネル4「本以外の資料を探したい」をテーブル化）

   数字でみる移動図書館車の .bookmobile-table と同じ構成

   ============================================================== */

 

.sagashi-table {

    border-collapse: collapse;

    border: 2px solid var(--accent-color, #A98BD4);

    width: 100%;

    margin-top: 16px;

}

 

.sagashi-table th,

.sagashi-table td {

    border: 2px solid var(--accent-color, #A98BD4);

    padding: 12px 16px;

    font-size: 16px;

    text-align: center;

}

 

.sagashi-table th {

    background: var(--accent-color, #A98BD4);

    color: #ffffff;

    font-weight: 700;

}

 

.sagashi-table td {

    color: #555555;

}

 

.sagashi-table .sagashi-row-btn {

    display: inline-flex;

}

 

/* スマホ：横スクロール */

@media (max-width: 767.9px) {

    .sagashi-table {

        display: block;

        overflow-x: auto;

        white-space: nowrap;

    }

}


/* ==============================================================

   追加調整（資料名セルを薄い塗りに）

   ============================================================== */

 

.sagashi-td-name {

    background: rgba(169, 139, 212, 0.3) !important;

    font-weight: 700;

}

/* ==============================================================

   追加調整（テーブルの列幅）

   ============================================================== */

 

.sagashi-table th:nth-child(1),

.sagashi-table td:nth-child(1) {

    width: 20%;

}

 

.sagashi-table th:nth-child(3),

.sagashi-table td:nth-child(3) {

    width: 25%;

}

 
/* ==============================================================

   追加調整（固定サイズ画像をレスポンシブ対応に）

   幅は160pxを上限に、カードが狭い画面では画像も縮む

   ============================================================== */

 

.sagashi-fcard-img {

    max-width: 100%;

    height: auto;

    aspect-ratio: 4 / 3;

}

.sagashi-table {

    min-width: 480px;

}

.sagashi-panel {

    padding: 16px;

}


/* ==============================================================

   追加調整（375px幅でも積み上げず、横スクロールに戻す）

   ============================================================== */

 

@media (max-width: 479.9px) {

    .sagashi-table {

        display: block;

        overflow-x: auto;

        min-width: 480px;

        table-layout: fixed;

        border: 2px solid var(--accent-color, #A98BD4);

    }

 

    .sagashi-table thead {

        display: table-header-group;

    }

 

    .sagashi-table tbody {

        display: table-row-group;

    }

 

    .sagashi-table tr {

        display: table-row;

        border: none;

        border-radius: 0;

        margin-bottom: 0;

        overflow: visible;

    }

 

    .sagashi-table td {

        display: table-cell;

        width: auto;

        border: 2px solid var(--accent-color, #A98BD4);

        text-align: center;

        padding: 12px 16px;

    }

 

    .sagashi-table td::before {

        content: none;

    }

 

    .sagashi-td-name {

        background: rgba(169, 139, 212, 0.3) !important;

    }

}


.sagashi-panel {

    min-width: 0;

}


/* ==============================================================

   ヘッダー内 検索フォーム＋ボタン列

   （wp_body_openで出力されるので、外枠で幅・背景を管理）

   ============================================================== */

 

.soo-header-tools-outer {
    margin: 12px 0;
    background: #ffffff;
    border-radius: 25px;


    padding: 12px 20px;

}

 

.soo-header-tools {



    display: flex;

    align-items: center;

    gap: 12px;

    flex-wrap: wrap;

}

 

.soo-header-tools form {

    flex: 1;

    min-width: 200px;

    margin: 0;

}

 

/* ヘッダー内では検索窓の下マージンを打ち消す */

.soo-header-tools .soo-search-wrap {

    margin-bottom: 0;

}

 


.soo-header-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    background: #F5BE57;

    color: #4E4844;

    font-size: 16px;

    font-weight: 700;

    padding: 10px 24px;

    border-radius: 50px;

    text-decoration: none;

    white-space: nowrap;

}



.soo-header-btn:hover {

    opacity: 0.85;

}



.soo-header-btn-group {

    display: flex;

    flex-wrap: nowrap;

    gap: 12px;

}



/* スマホ幅：検索窓とボタン列は縦に分かれてもよいが、3つのボタンは常に横並び */

@media (max-width: 767.9px) {

    .soo-header-tools form {

        min-width: 0;

    }



    .soo-header-btn-group {

        flex: 1 1 100%;

    }



    .soo-header-btn {

        flex: 1;

        padding: 10px 12px;

        font-size: 14px;

    }

}




/* トップページ検索バー：テーマ既定の button[type=submit] より優先させるため #opac-search-form 配下で上書き */

#opac-search-form .soo-search-btn {

    background: #4E4844;

    border: none;

    padding: 0 16px;

    color: #ffffff;

    border-radius: 0;

}




/* トップページ：支館ボタン(末吉本館・大隅分館・財部分館) */

.branch-btn-list {
    flex-wrap: nowrap;

    display: flex;


    gap: 16px;

}



.branch-btn-list .branch-btn {

    display: flex;

    align-items: center;

    justify-content: center;

    flex: 1;

    min-width: 0;

    border: none;

    background-color: var(--branch-color, #F4789A);

    color: #4E4844;

    font-size: 16px;

    font-weight: 700;

    padding: 10px 24px;

    border-radius: 10px;

    text-decoration: none;

    white-space: nowrap;

}



.branch-btn-list .branch-btn:hover {

    opacity: 0.85;

}



@media (max-width: 767.9px) {

    .branch-btn-list .branch-btn {

        font-size: 15px;

        padding: 14px 12px;

    }

}




.branch-btn-list-outer {
    margin: 12px 0;
    background: #ffffff;
    border-radius: 25px;

    padding: 12px 20px;

}




/* スマホ：ファーストビューのスライドショーの高さを縮める */

@media (max-width: 767.9px) {

    .n2-ss-slider {

        max-height: 220px !important;

        overflow: hidden !important;
        display: flex !important;
        align-items: center !important;

    }

}




@media (max-width: 767.9px) {

    .n2-ss-slide-background-image img {

        height: 220px !important;

        object-fit: contain !important;

        object-position: center !important;

    }

}




@media (max-width: 767.9px) {

    .n2-ss-slider-wrapper-inside {

        width: 100% !important;

    }

}




/* ファーストビュー(スライドショー)ブロックの上下余白 */

.firstview-columns {

    margin-top: 24px !important;

    margin-bottom: 24px !important;

}



@media (max-width: 767.9px) {

    .firstview-columns {

        margin-top: 12px !important;

        margin-bottom: 12px !important;

    }

}




/* ファーストビュー内カラムの下余白(タブレット・スマホのみ) */

@media (max-width: 767.9px) {

    .wp-container-core-column-is-layout-d822ebe3 {

        margin-bottom: 12px !important;

    }

}




/* お知らせ:イベントカテゴリ表示とタイトルをZen Maru Gothicに変更 */

.soo-news-cat.cat-events,

.soo-news-title-wrap {

    font-family: 'Zen Maru Gothic', sans-serif !important;

}




/* お知らせタイトル・追加の見出しブロックをZen Maru Gothic + 文字色555555に変更 */

.news-title,

.wp-elements-16df81f706d2721db65b38f656ef3bce {

    font-family: 'Zen Maru Gothic', sans-serif !important;

    color: #555555 !important;

}




/* 追加の見出しブロック(別インスタンス)をZen Maru Gothic + 文字色555555に変更 */

.wp-elements-bb6310f58bac32006c5c01d56bed8bbc {

    font-family: 'Zen Maru Gothic', sans-serif !important;

    color: #555555 !important;

}




/* Pickupタイトルをzen maru ゴシックに変更 */

.soo-pickup-title {

    font-family: 'Zen Maru Gothic', sans-serif !important;

}




/* 特集タイトルをzen maru ゴシック・色555555・37pxに変更 */

.book-feature-title {

    font-family: 'Zen Maru Gothic', sans-serif !important;

    color: #555555 !important;

    font-size: 37px !important;

}




.book-feature-title {

    margin: 0 !important;

    padding: 0 !important;

}




/* 特集カードの枠線太さ・背景色変更 */

.soo-book-feature-card {

    border: 2px solid var(--lib-color, #f0f0f0) !important;

    background: #FDF9ED !important;

}




/* 図書館名バッジの文字を少し太く */

.soo-bf-location-btn {

    font-weight: 600 !important;

}



/* 特集カードのpaddingを縮小 */

.soo-book-feature-card {

    padding: 8px !important;

}




/* 特集カード一覧のレスポンシブ列数 */

@media (max-width: 991.9px) {

    .soo-book-feature-list {

        grid-template-columns: repeat(2, 1fr) !important;

    }

}



@media (max-width: 575.9px) {

    .soo-book-feature-list {

        grid-template-columns: repeat(1, 1fr) !important;

    }

}




/* 特集フィルターボタン:リサイズ時に縦書きにならないようグループ単位で折り返し */

.soo-bf-filter {

    flex-wrap: wrap !important;

}



.soo-bf-filter-group {

    display: flex;

    flex-wrap: nowrap;

    gap: 8px;

}



.soo-bf-filter-btn {

    white-space: nowrap !important;

    flex-shrink: 0;

}




.soo-bf-filter {

    margin-top: 5px !important;

    margin-bottom: 5px !important;

}




/* firstview-right:991px以下で幅を制限し上下marginを追加 */

@media (max-width: 991.9px) {

    .firstview-right {

        max-width: 435px !important;

        margin-top: 12px !important;

        margin-bottom: 12px !important;

    }

}




@media (max-width: 991.9px) {

    .firstview-right {

        margin-left: auto !important;

        margin-right: auto !important;

        align-self: center !important;

    }

}




/* フッターのコピーライト文字を非表示 */

.site-footer-copyright-text {

    display: none !important;

}




/* フッターのコピーライト部分を非表示 */

.site-footer-copyright {

    display: none !important;

}




.site-footer-content {

    padding: 48px !important;

}




/* ナビゲーション下線・フロートナビの色をF5BE57に変更 */

.global-nav-list > li:before {

    border-bottom-color: #F5BE57 !important;

}



#soo-float-nav a,

#soo-float-instagram {

    color: #F5BE57 !important;

}




/* はじめてのページ 絵本コーナー画像をコンテナいっぱいに表示 */

.hajimete-fcard-img img {

    width: 100% !important;

    height: 100% !important;

    object-fit: cover !important;

    display: block !important;

    border-radius: 8px;

}




/* ご利用案内セクション:デザイン刷新(アイコン非表示・単一カラム・ラベル付きリスト) */

.guide-section {

    display: block !important;

    background: #F7F7F5 !important;

    border: none !important;

    border-radius: 16px !important;

    padding: 24px !important;

    margin-bottom: 12px !important;

}



.guide-section-icon {

    display: none !important;

}



.guide-section-left {

    display: block !important;

    width: 100% !important;

    min-width: unset !important;

    text-align: left !important;

}



.guide-section-title {

    font-size: 20px !important;

    font-weight: 700 !important;

    color: #333333 !important;

    margin: 0 0 8px !important;

}



.guide-section-right {

    width: 100% !important;

}



.guide-section-desc {

    font-size: 14px !important;

    color: #666666 !important;

    margin: 0 0 16px !important;

}



.guide-detail-list {

    gap: 10px !important;

}



.guide-detail-item {

    align-items: center !important;

    gap: 12px !important;

}



.guide-detail-label {

    background: #F5BE57 !important;

    color: #ffffff !important;

    min-width: 80px !important;

    text-align: center !important;

    padding: 4px 12px !important;

    border-radius: 20px !important;

    font-weight: 700 !important;

}



.guide-detail-content {

    color: #4E4844 !important;

    font-size: 16px !important;

}




.guide-section {

    background: #ffffff !important;

}



/* スマホ:ラベルを左揃えでフロートさせ、内容を回り込ませる */

@media (max-width: 767.9px) {

    .guide-detail-item {

        display: block !important;

        overflow: hidden !important;

    }



    .guide-detail-label {

        float: left !important;

        text-align: left !important;

        margin-right: 12px !important;

    }



    .guide-detail-content {

        display: block !important;

    }

}




/* スマホ:ラベルは中央揃えで単独行、内容はその下 */

@media (max-width: 767.9px) {

    .guide-detail-label {

        float: none !important;

        display: inline-block !important;

        text-align: center !important;

        margin-right: 0 !important;

        margin-bottom: 4px !important;

    }



    .guide-detail-content {

        display: block !important;

        clear: both !important;

    }

}




/* 投稿ページ:不要な要素を非表示 */

.veu_followSet,

.veu_adminEdit,

.entry-footer,

.entry-meta-item.entry-meta-item-author {

    display: none !important;

}




/* セクション1:資料カードを横並びにする */

.rekishi-section-right-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 16px;

}



/* 和歌の表示 */

.rekishi-poem {

    background: #FDF4F6;

    border-radius: 8px;

    padding: 12px 16px;

    margin-bottom: 12px;

}



.rekishi-poem p {

    margin: 0;

    font-size: 14px;

    color: #4E4844;

    line-height: 1.9;

}



.rekishi-poem-translation {

    padding: 0 4px;

    margin-bottom: 12px;

}



.rekishi-poem-translation-label {

    display: inline-block;

    font-size: 11px;

    font-weight: 700;

    color: #F4789A;

    background: #FDD2D9;

    padding: 2px 8px;

    border-radius: 10px;

    margin-bottom: 6px;

}



.rekishi-poem-translation p {

    margin: 0;

    font-size: 13px;

    color: #4E4844;

    line-height: 1.7;

}



.rekishi-poem-columns {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 12px;

    margin-bottom: 12px;

}



.rekishi-poem-col {

    background: #FDF4F6;

    border-radius: 8px;

    padding: 12px;

}



.rekishi-poem-col-title {

    display: block;

    font-size: 11px;

    font-weight: 700;

    color: #F4789A;

    margin-bottom: 8px;

}



.rekishi-poem-col p {

    margin: 0;

    font-size: 14px;

    color: #4E4844;

    line-height: 1.8;

}



.rekishi-doc-detail-link {

    display: inline-flex;

    align-items: center;

    gap: 4px;

    font-size: 12px;

    color: #F4789A;

    text-decoration: none;

    font-weight: 700;

}



.rekishi-doc-detail-link:hover {

    text-decoration: underline;

}



/* 章末バナー */

.rekishi-banner {

    background: #FDF4F6;

    border-radius: 12px;

    padding: 16px 24px;

    margin-bottom: 16px;

}



.rekishi-banner p {

    margin: 0;

    font-size: 13px;

    color: #4E4844;

    line-height: 1.8;

}



/* スマホ:セクション1の資料カードは縦積み */

@media (max-width: 767.9px) {

    .rekishi-section-right-grid,

    .rekishi-poem-columns {

        grid-template-columns: 1fr;

    }

}




/* セクション2:3列レイアウト */

.rekishi-section-right-grid3 {

    display: grid;

    grid-template-columns: 1fr 1fr 1fr;

    gap: 16px;

}



/* 移住者数の統計カード */

.rekishi-stat-card {

    background: #F4F9EC;

    border-radius: 12px;

    padding: 20px;

    text-align: center;

}



.rekishi-stat-card-title {

    font-size: 13px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 12px;

}



.rekishi-stat-number {

    font-size: 40px;

    font-weight: 700;

    color: #8BC34A;

    font-family: 'Comfortaa', cursive;

    margin: 0;

    line-height: 1;

}



.rekishi-stat-number span {

    font-size: 16px;

    color: #4E4844;

    font-family: inherit;

    margin-left: 2px;

}



.rekishi-stat-caption {

    font-size: 11px;

    color: #888888;

    margin: 4px 0 16px;

}



.rekishi-stat-diagram {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    margin-bottom: 12px;

}



.rekishi-stat-sources {

    display: flex;

    flex-direction: column;

    gap: 6px;

}



.rekishi-stat-source {

    font-size: 11px;

    background: #ffffff;

    border: 1px solid #C5E1A5;

    color: #4E4844;

    border-radius: 12px;

    padding: 3px 10px;

}



.rekishi-stat-arrow {

    font-size: 18px;

    color: #8BC34A;

}



.rekishi-stat-target {

    font-size: 13px;

    font-weight: 700;

    background: #8BC34A;

    color: #ffffff;

    border-radius: 50%;

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

}



.rekishi-stat-note {

    font-size: 11px;

    color: #888888;

    line-height: 1.6;

    margin: 0;

}



/* セクション2 キーカラー 緑 */

#section-2 .rekishi-section-number {

    background: #8BC34A;

}



#section-2 .rekishi-section-subtitle {

    color: #8BC34A;

}



#section-2 .rekishi-section-btn {

    border-color: #8BC34A;

    color: #8BC34A;

}



#section-2 .rekishi-section-btn:hover {

    background: #E3F0D3;

}



/* スマホ:セクション2は縦積み */

@media (max-width: 767.9px) {

    .rekishi-section-right-grid3 {

        grid-template-columns: 1fr;

    }

}




/* クイズカード */

.rekishi-quiz-card {

    background: #FFF8EC;

    border-radius: 12px;

    padding: 20px;

}



.rekishi-quiz-card-title {

    font-size: 16px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 8px;

}



.rekishi-quiz-card-desc {

    font-size: 12px;

    color: #888888;

    margin: 0 0 12px;

    line-height: 1.6;

}



.rekishi-quiz-list {

    padding-left: 20px;

    margin: 0 0 16px;

}



.rekishi-quiz-list li {

    font-size: 13px;

    color: #4E4844;

    margin-bottom: 8px;

    line-height: 1.5;

}



.rekishi-quiz-toggle-btn {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    background: #F5BE57;

    color: #ffffff;

    border: none;

    border-radius: 20px;

    padding: 10px 20px;

    font-size: 13px;

    font-weight: 700;

    cursor: pointer;

}



.rekishi-quiz-toggle-btn:hover {

    background: #E5AE47;

}



/* ヒントバナー(オレンジ) */

.rekishi-banner-orange {

    background: #FFF3DC;

}



/* クイズの答え */

.rekishi-quiz-answer {

    background: #ffffff;

    border: 1px solid #F5BE57;

    border-radius: 12px;

    padding: 20px;

    margin-bottom: 16px;

}



.rekishi-quiz-answer-label {

    display: inline-block;

    background: #F5BE57;

    color: #ffffff;

    font-size: 12px;

    font-weight: 700;

    padding: 4px 14px;

    border-radius: 12px;

    margin-bottom: 12px;

}



.rekishi-quiz-answer-table-wrap {

    overflow-x: auto;

    margin-bottom: 8px;

}



.rekishi-quiz-answer-table {

    width: 100%;

    border-collapse: collapse;

    font-size: 12px;

}



.rekishi-quiz-answer-table th,

.rekishi-quiz-answer-table td {

    border: 1px solid #f0f0f0;

    padding: 8px 10px;

    text-align: left;

    color: #4E4844;

    white-space: nowrap;

}



.rekishi-quiz-answer-table thead th {

    background: #FFF8EC;

    font-weight: 700;

}



.rekishi-quiz-answer-table tbody th {

    background: #FFF8EC;

    font-weight: 700;

    white-space: nowrap;

}



.rekishi-quiz-answer-note {

    font-size: 11px;

    color: #888888;

    margin: 0;

}



/* セクション4 キーカラー オレンジ */

#section-4 .rekishi-section-number {

    background: #F5BE57;

}



#section-4 .rekishi-section-subtitle {

    color: #F5BE57;

}



#section-4 .rekishi-section-btn {

    border-color: #F5BE57;

    color: #F5BE57;

}



#section-4 .rekishi-section-btn:hover {

    background: #FFF3DC;

}




/* 資料館で見られること */

.rekishi-see-card {

    background: #F7F2FB;

    border-radius: 12px;

    padding: 20px;

}



.rekishi-see-card-title {

    font-size: 14px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 16px;

}



.rekishi-see-list {

    list-style: none;

    margin: 0;

    padding: 0;

    display: flex;

    flex-direction: column;

    gap: 16px;

}



.rekishi-see-list li {

    display: flex;

    align-items: center;

    gap: 12px;

}



.rekishi-see-icon {

    width: 44px;

    height: 44px;

    flex-shrink: 0;

    border-radius: 50%;

    background: #E4D5F0;

    color: #A98BD4;

    display: flex;

    align-items: center;

    justify-content: center;

}



.rekishi-see-list li span:last-child {

    font-size: 13px;

    color: #4E4844;

    line-height: 1.5;

}



/* 施設情報 */

.rekishi-facility-card {

    background: #ffffff;

    border: 1px solid #f0f0f0;

    border-radius: 12px;

    padding: 20px;

}



.rekishi-facility-card-title {

    font-size: 14px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 12px;

}



.rekishi-facility-list {

    list-style: none;

    margin: 0 0 16px;

    padding: 0;

    display: flex;

    flex-direction: column;

    gap: 8px;

}



.rekishi-facility-list li {

    display: flex;

    gap: 12px;

    font-size: 13px;

    color: #4E4844;

    line-height: 1.5;

}



.rekishi-facility-label {

    flex-shrink: 0;

    width: 70px;

    font-weight: 700;

    color: #A98BD4;

}



.rekishi-facility-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    width: 100%;

    background: #4E4844;

    color: #ffffff;

    text-decoration: none;

    border-radius: 20px;

    padding: 12px 20px;

    font-size: 13px;

    font-weight: 700;

}



.rekishi-facility-btn:hover {

    background: #3A3532;

}



/* セクション5 キーカラー 紫 */

#section-5 .rekishi-section-number {

    background: #A98BD4;

}



/* スマホ:セクション5は縦積み */

@media (max-width: 767.9px) {

    #section-5 .rekishi-section-right-grid {

        grid-template-columns: 1fr;

    }

}




/* 資料館で見られること */

.rekishi-see-card {

    background: #F7F2FB;

    border-radius: 12px;

    padding: 20px;

}



.rekishi-see-card-title {

    font-size: 14px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 16px;

}



.rekishi-see-list {

    list-style: none;

    margin: 0;

    padding: 0;

    display: flex;

    flex-direction: column;

    gap: 16px;

}



.rekishi-see-list li {

    display: flex;

    align-items: center;

    gap: 12px;

}



.rekishi-see-icon {

    width: 44px;

    height: 44px;

    flex-shrink: 0;

    border-radius: 50%;

    background: #E4D5F0;

    color: #A98BD4;

    display: flex;

    align-items: center;

    justify-content: center;

}



.rekishi-see-list li span:last-child {

    font-size: 13px;

    color: #4E4844;

    line-height: 1.5;

}



/* 施設情報 */

.rekishi-facility-card {

    background: #ffffff;

    border: 1px solid #f0f0f0;

    border-radius: 12px;

    padding: 20px;

}



.rekishi-facility-card-title {

    font-size: 14px;

    font-weight: 700;

    color: #4E4844;

    margin: 0 0 12px;

}



.rekishi-facility-list {

    list-style: none;

    margin: 0 0 16px;

    padding: 0;

    display: flex;

    flex-direction: column;

    gap: 8px;

}



.rekishi-facility-list li {

    display: flex;

    gap: 12px;

    font-size: 13px;

    color: #4E4844;

    line-height: 1.5;

}



.rekishi-facility-label {

    flex-shrink: 0;

    width: 70px;

    font-weight: 700;

    color: #A98BD4;

}



.rekishi-facility-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    width: 100%;

    background: #4E4844;

    color: #ffffff;

    text-decoration: none;

    border-radius: 20px;

    padding: 12px 20px;

    font-size: 13px;

    font-weight: 700;

}



.rekishi-facility-btn:hover {

    background: #3A3532;

}



/* セクション5 キーカラー 紫 */

#section-5 .rekishi-section-number {

    background: #A98BD4;

}



/* スマホ:セクション5は縦積み */

@media (max-width: 767.9px) {

    #section-5 .rekishi-section-right-grid {

        grid-template-columns: 1fr;

    }

}




/* ==========================================================================

   歴史民俗資料館ページ スマホ対応 追加調整

   ========================================================================== */



@media (max-width: 767.9px) {

    /* セクション全体:左右を縦積みに */

    .rekishi-section {

        flex-direction: column;

        gap: 24px;

        padding: 20px;

    }



    .rekishi-section-left,

    .rekishi-section-right {

        flex: none;

        width: 100%;

    }



    .rekishi-section-number {

        width: 40px;

        height: 40px;

        font-size: 20px !important;

    }



    .rekishi-section-title {

        font-size: 18px;

    }



    /* セクション3:資料カード本体(画像+タイムライン)も縦積みに */

    #section-3 .rekishi-doc-card-body {

        flex-direction: column;

    }



    #section-3 .rekishi-doc-image {

        width: 100%;

    }



    /* タイムラインの年代ボックスも縦積みに */

    .rekishi-doc-timeline {

        flex-direction: column;

    }



    .rekishi-doc-timeline-item:not(:last-child)::after {

        display: none;

    }

}




/* セクション1:資料カードを画像+テキストの横並びに */

#section-1 .rekishi-doc-card-body {

    display: flex;

    gap: 16px;

    align-items: stretch;

}



#section-1 .rekishi-doc-image {

    width: 160px;

    flex-shrink: 0;

}



#section-1 .rekishi-doc-image img {

    width: 100%;

    height: 100%;

    max-height: none;

    object-fit: cover;

    margin-bottom: 0;

}



#section-1 .rekishi-doc-content {

    flex: 1;

    min-width: 0;

}



/* スマホ:セクション1のカードも縦積みに */

@media (max-width: 767.9px) {

    #section-1 .rekishi-doc-card-body {

        flex-direction: column;

    }



    #section-1 .rekishi-doc-image {

        width: 100%;

    }



    #section-1 .rekishi-doc-image img {

        max-height: 220px;

    }

}




/* セクション1 再調整:住吉神社の短冊は画像を小さめの横並びに */

#section-1 .rekishi-doc-card-body {

    align-items: flex-start;

}



#section-1 .rekishi-doc-image {

    width: 130px;

}



#section-1 .rekishi-doc-image img {

    height: auto;

    max-height: 170px;

}



/* セクション1 再調整:投谷八幡文書は画像を上・テキストを下の縦積みに戻す */

#section-1 .rekishi-doc-card:nth-of-type(2) .rekishi-doc-card-body {

    flex-direction: column;

}



#section-1 .rekishi-doc-card:nth-of-type(2) .rekishi-doc-image {
    width: 100%;
    max-width: 300px;
}



#section-1 .rekishi-doc-card:nth-of-type(2) .rekishi-doc-image img {
    width: 100%;
    max-width: 300px;
    max-height: none;
    aspect-ratio: 1642 / 1095;
    object-fit: cover;
}

/* 住吉神社の短冊(433x2560の縦長画像)は、幅を固定せず縦横比なりに表示して全景が欠けないようにする */
#section-1 .rekishi-doc-card:nth-of-type(1) .rekishi-doc-image img {
    width: auto;
    max-width: 100%;
    max-height: 350px;
    object-fit: contain;
}

/* 画像を囲む枠も幅130px固定をやめ、画像の実際の幅に合わせて隙間をなくす */
#section-1 .rekishi-doc-card:nth-of-type(1) .rekishi-doc-image {
    width: auto;
}

li[role="menuitemradio"]:has(svg[value="far-bottom"]) {
  display: none !important;
}



/* セクション1:上下2段のレイアウトに変更（上部にタイトル、下段で資料カードを横並び） */

#section-1 {

    flex-direction: column;

}



#section-1 .rekishi-section-left,

#section-1 .rekishi-section-right {

    flex: none;

    width: 100%;

}



/* セクション1:PC表示では投谷八幡文書のカードを少し広く */

@media (min-width: 768px) {

    #section-1 .rekishi-section-right-grid {

        grid-template-columns: minmax(280px, 1fr) minmax(280px, 1.5fr);

    }

}



/* セクション2〜5:768px〜991.9pxの間はsection-leftを上に配置(資料カードの列数はそのまま) */
@media (min-width: 768px) and (max-width: 991.9px) {
    #section-2,
    #section-3,
    #section-4,
    #section-5 {
        flex-direction: column;
    }

    #section-2 .rekishi-section-left,
    #section-2 .rekishi-section-right,
    #section-3 .rekishi-section-left,
    #section-3 .rekishi-section-right,
    #section-4 .rekishi-section-left,
    #section-4 .rekishi-section-right,
    #section-5 .rekishi-section-left,
    #section-5 .rekishi-section-right {
        flex: none;
        width: 100%;
    }
}


/* 資料キャプション(本文)のテキストレベルを既存の資料説明文と揃える */
.rekishi-doc-caption p {
    font-size: 13px;
    color: #4E4844;
    line-height: 1.7;
}

/* 資料キャプション内の引用行を目立たせる */
.rekishi-doc-caption-quote {
    font-size: 14px;
    font-weight: 700;
    color: #F4789A;
}




/* ==============================================================

   トップページ セクションタイトルのサイズ・太さを統一

   （お知らせ／チラシ／ピックアップ／館内の特集展示）

   ============================================================== */

.news-title,

.book-feature-title,

.wp-elements-67d97c259ce0529781d27aa9afd04c8f {

    font-size: 32px !important;

    font-weight: 600 !important;

}



.wp-elements-67d97c259ce0529781d27aa9afd04c8f {

    font-family: 'Zen Maru Gothic', sans-serif !important;

}





/* ==============================================================

   セクションタイトル下に余白を追加

   ============================================================== */

.news-title,

.book-feature-title,

.wp-elements-67d97c259ce0529781d27aa9afd04c8f {

    margin-bottom: 16px !important;

}



/* ピックアップの見出しにフォントサイズ等が適用されない場合の

   詳細度を上げた指定（他のCSSルールが優先されてしまう対策） */

.wp-elements-67d97c259ce0529781d27aa9afd04c8f.wp-elements-67d97c259ce0529781d27aa9afd04c8f.wp-elements-67d97c259ce0529781d27aa9afd04c8f {

    font-size: 32px !important;

    font-weight: 600 !important;

    font-family: 'Zen Maru Gothic', sans-serif !important;

}