/* ===== 基本設定 ===== */
body {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}

/* コンテンツ幅 */
.site-content {
    max-width: 1080px;
    margin: 0 auto;
    padding: 20px;
}

/* age-gate デザイン */
#age-gate {
    background-color: #ffffff;   /* 下地は白 */
    color: #5a3e2b;              /* 白文字だった部分を茶色系に */
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

#age-gate .age-box {
    text-align: center;
    background-color: #fff6e5;   /* 枠をクリーム色に */
    padding: 40px;
    border-radius: 20px;
    max-width: 500px;
}

#age-gate .image-container img {
    margin: 10px;
}

#age-gate .age-title {
    font-size: 28px;
    margin: 20px 0 10px;
    color: #ff4f8b;              /* 赤文字をピンクに */
}

#age-gate .age-question,
#age-gate .age-description {
    font-size: 16px;
    margin: 10px 0;
}

#age-gate .age-buttons {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    gap: 15px;
}

#age-gate .btn-enter,
#age-gate .btn-exit {
    padding: 12px 24px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 10px;
    border: none;
    cursor: pointer;
    transition: 0.3s;
}

#age-gate .btn-enter {
    background-color: #ff4f8b;   /* ピンクボタン */
    color: #ffffff;
}

#age-gate .btn-exit {
    background-color: #c8a27a;   /* クリーム系に合わせた茶系 */
    color: #ffffff;
}

#age-gate .btn-enter:hover,
#age-gate .btn-exit:hover {
    opacity: 0.85;
}

/* スマホ対応 */
@media (max-width:768px){
    #age-gate .age-box { padding: 30px; }
    #age-gate .age-title { font-size: 24px; }
    #age-gate .age-buttons { flex-direction: column; gap: 10px; }
    #age-gate .btn-enter,
    #age-gate .btn-exit { width: 100%; }
}