/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 27 2026 | 00:50:21 */
/* =========================================================
   フッターを画面の最下部に強制ロックする設定（白い余白の解消）
   ========================================================= */

/* 1. サイト全体の土台（ボディ）の縦幅を画面100%に広げる */
body {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important; /* 画面の高さいっぱいに広げる */
    margin: 0 !important;
}

/* 2. Lightningのメインコンテンツエリアの余白を自動計算に */
#main, .siteContent {
    flex-grow: 1 !important; /* 中身が少なくても、フッターを一番下まで押し下げる */
    display: flex !important;
    flex-direction: column !important;
    justify-content: center; /* 💡ポータルのボタンを画面の上下中央に美しく配置 */
}

/* 3. 【おまけ】もしフッター自体の色もキーカラー「#5c8da8」に揃えたい場合 */
/* (サイト全体のフッター色がすでに決まっている場合は、以下の3ブロックは削除しても構いません) */
footer.siteFooter, .site-footer {
    background-color: #5c8da8 !important; /* フッター背景をキーカラーに */
    color: #ffffff !important; /* フッター内の文字を白に */
    margin-top: auto !important; /* 確実に最下部へ張り付かせる */
}
footer.siteFooter a, .site-footer a {
    color: #ffffff !important; /* フッター内のリンクも白に */
}
/* =========================================================
   💡 修正：ポータルボタンを画面の上下左右「完全中央」に配置する
   ========================================================= */

/* 1. Lightningのページ本文を包む大枠を縦いっぱいに広げて中央に寄せる */
#main .container,
#main .siteContent-main {
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    justify-content: center !important; /* 上下のど真ん中へ */
    align-items: center !important;     /* 左右のど真ん中へ */
    min-height: 50vh !important;       /* 最低限の縦幅を確保 */
}

/* 2. ポータルコンテナ自体の横並び設定を上書き補正 */
.portal-container {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 900px !important;
    margin: 0 auto !important; /* 無駄な上下マージンをリセット */
    padding: 40px 0 !important;
}

/* 3. スマホ表示（横幅が狭い時）の縦並びの際も中央を維持 */
@media (max-width: 768px) {
    .portal-container {
        flex-direction: column !important;
        gap: 20px !important;
        padding: 20px 15px !important;
    }
    .portal-card {
        width: 100% !important;
        max-width: 450px !important; /* スマホで大きくなりすぎないように制限 */
    }
}