/* ========================================
   PC表示：左カラム（緑・ナビ）＋右カラム（コンテンツ）
   ======================================== */

@keyframes form-parallax-shake {
    0%, 100% { transform: translateX(0); }
    15%, 45%, 75% { transform: translateX(-4px); }
    30%, 60%, 90% { transform: translateX(4px); }
}

@media (min-width: 1024px) {
    body {
        display: flex;
        min-height: 100vh;
        background: #688C2F;
    }

    /* 左カラム：緑背景・タイトル・ナビ */
    .main__parallax {
        position: sticky;
        top: 0;
        width: 34%;
        max-width: 500px;
        min-width: 320px;
        height: 100vh;
        flex-shrink: 0;
        pointer-events: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 1rem 1rem 1rem 5%;
        background: #688C2F;
    }

    .form__parallax {
        position: sticky;
        top: 0;
        width: 34%;
        max-width: 500px;
        min-width: 320px;
        height: 100vh;
        flex-shrink: 0;
        pointer-events: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .form__parallax.form__parallax--shake {
        animation: form-parallax-shake 0.5s ease-in-out;
    }

    .main__parallax-title {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        width: 100%;
    }

    .main__parallax-title-img {
        display: none;
    }

    .main__parallax-title-pc {
        display: block !important;
        margin-bottom: 32px;
    }

    .main__parallax-head {
        color: #fff;
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1.5;
        margin: 0 0 4px 0;
    }

    .main__parallax-accent {
        color: #ffcc00;
        font-size: 1.75rem;
        font-weight: 700;
        text-decoration: underline;
        text-underline-offset: 6px;
        margin: 0 0 4px 0;
    }

    .main__parallax-menu {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 0.5rem;
        justify-content: flex-start;
        text-align: left;
        font-size: 1.1rem;
        width: 100%;
        margin-top: 10rem;
    }

    .main__parallax-menu a {
        display: inline-block;
        color: #fff;
        text-decoration: none;
        font-weight: 700;
        position: relative;
        transition: opacity 0.25s ease-out, font-size 0.25s ease-out;
    }

    .main__parallax-menu a::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 2px;
        background: rgba(255, 255, 255, 0.5);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.3s ease-out;
    }

    .main__parallax-menu a:hover {
        opacity: 0.95;
    }

    .main__parallax-menu a:hover::after {
        transform: scaleX(1);
    }
}