/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 27 2026 | 05:26:39 */
/* ==========================================
   モバイル下部固定メニュー（中央揃え・均等配置）
   ========================================== */
@media (max-width: 991px) {
    /* 1. メニュー全体の枠組みを画面下部に固定 */
    .custom-mobile-nav {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        background-color: #5c8da8 !important; /* 背景色（学校カラー） */
        z-index: 9999 !important;               /* 他の要素より手前に表示 */
        box-shadow: 0 -2px 10px rgba(0,0,0,0.1) !important;
    }

    /* 2. リストを横並びにして、左側の不要な余白をリセット */
    .custom-mobile-nav ul {
        display: flex !important;
        justify-content: space-around !important; /* 4本のボタンを均等に配置 */
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important;                     /* 左寄りの原因となる余白をリセット */
        list-style: none !important;
        height: 68px !important;
padding-bottom: env(safe-area-inset-bottom) !important;                /* メニューの高さ */
    }

    /* 3. 各メニュー（ボタン1つ分）の幅を均等にする */
    .custom-mobile-nav ul li {
        flex: 1 !important;
        text-align: center !important;             /* 中身の文字やアイコンを中央へ */
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 4. アイコンと文字を上下の「縦並び」にして完全中央揃え */
    .custom-mobile-nav ul li a {
        display: flex !important;
        flex-direction: column !important;         /* 上にアイコン、下に文字 */
        align-items: center !important;             /* 左右の中心を揃える */
        justify-content: center !important;         /* 上下の中心を揃える */
        color: #ffffff !important;                 /* 文字とアイコンの色（白） */
        text-decoration: none !important;
        width: 100% !important;
        height: 100% !important;
    }

    /* 5. アイコンのサイズと文字のバランス調整 */
    .custom-mobile-nav ul li a i {
        font-size: 20px !important;                /* アイコンを少し大きめに */
        margin-bottom: 2px !important;             /* アイコンと文字の間の隙間 */
    }

    .custom-mobile-nav ul li a span {
        font-size: 11px !important;                /* 文字のサイズ */
        font-weight: bold !important;
    }
}

/* PC版（992px以上）のときは、この下部メニューを完全に非表示にする */
@media (min-width: 992px) {
    .custom-mobile-nav {
        display: none !important;
    }
}

/* モバイル下部メニュー分の余白 */

@media (max-width: 991px) {

    body {

        padding-bottom: 90px !important;
    }
}

/* =========================================================
   内部ツールページ：モバイル時の調整
   ========================================================= */

/* 公式サイトボタンをモバイルで非表示 */
@media (max-width: 991px) {
    .inner-tool-site-btn {
        display: none !important;
    }
}

/* 内部ツールページではモバイル下部メニューを非表示 */
@media (max-width: 991px) {
    body.page-id-2503 .custom-mobile-nav,
    body.page-id-2003 .custom-mobile-nav,
    body.page-id-2335 .custom-mobile-nav,
    body.page-id-2842 .custom-mobile-nav,
    body.page-id-2583 .custom-mobile-nav,
    body.page-id-2138 .custom-mobile-nav,
    body.page-id-2142 .custom-mobile-nav {
        display: none !important;
    }

    /* 下部メニュー非表示に伴いpadding-bottomも解除 */
    body.page-id-2503,
    body.page-id-2003,
    body.page-id-2335,
    body.page-id-2842,
    body.page-id-2583,
    body.page-id-2138,
    body.page-id-2142 {
        padding-bottom: 0 !important;
    }
}