body {
        font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
        line-height: 1.8;
        color: #333;
        max-width: 100%;
        margin: 0 auto;
        padding: 20px;
        background-color: #f9f9f9;
        text-align: center;
    }
    header {
        border-bottom: 3px solid #d32f2f; /* 警告の赤 */
        margin-bottom: 40px;
        padding-bottom: 20px;
    }
    header, main, footer {
    padding: 60px 10%; /* 左右にたっぷり余白 */
    }
    .alert-bar {
        background: #d32f2f;
        color: white;
        text-align: center;
        padding: 5px;
        font-weight: bold;
        margin-bottom: 20px;
    }
    h1 {
        font-size: 1.8rem;
        color: #000;
        line-height: 1.4;
    }
    h2 {
        font-size: 2.2rem;
        
        padding-left: 15px;
        margin-top: 40px;
        color: #d32f2f;
    }
    p {
    font-size: 1.25rem;
    max-width: 900px;
    margin: 20px auto;
    line-height: 2.0;
}
    .under-construction {
        background: #fff3e0;
        border: 2px dashed #ff9800;
        padding: 20px;
        text-align: center;
        margin: 30px 0;
    }
    .const-box .icon {
        font-size: 3rem;
        display: block;
    }
    footer {
        text-align: center;
        margin-top: 60px;
        font-size: 1rem;
        color: #888;
    }

    /* --- iPad (タブレット) --- */
@media (max-width: 1024px) {
    h1 { font-size: 2.8rem; }
    h2 { font-size: 1.8rem; }
    p  { font-size: 1.15rem; }
}

/* --- Mobile (スマホ標準) --- */
@media (max-width: 768px) {
    header, main { padding: 40px 5%; } /* 余白を狭くしてコンテンツを広げる */
    h1 { font-size: 2.2rem; }
    h2 { font-size: 1.5rem; }
    p  { font-size: 1.1rem; }
}

/* --- MiniMobile (古いiPhoneやSEなど) --- */
@media (max-width: 375px) {
    h1 { font-size: 1.8rem; }
    h2 { font-size: 1.3rem; }
    p  { font-size: 1rem; }
}