/*#region var*/
@media (max-width: 991px) {
    :root {
        --headerH: 75px;
    }
}

@media (max-width: 768px) {
    :root {
        --pxunit: 6px;
        --font-size14: .7rem;
        --font-size16: .8rem;
        --font-size18: .9rem;
        --font-size20: 1rem;
        --font-size22: 1.1rem;
        --font-size24: 1.2rem;
        --font-size26: 1.3rem;
        --font-size28: 1.4rem;
        --font-size30: 1.5rem;
        --font-size32: 1.6rem;
        --font-size36: 1.7rem;
        --font-size38: 1.8rem;
        --font-size40: 2rem;
        --gap-unit: .4rem;
        --margin: 2.5rem;
        --border-radius: .4rem;
    }
}

@media (max-width: 450px) {
    :root {
        --pxunit: 5px;
        --font-size14: 1.4rem;
        --font-size16: 1.6rem;
        --font-size18: 1.8rem;
        --font-size20: 2rem;
        --font-size22: 2.2rem;
        --font-size24: 2.4rem;
        --font-size26: 2.6rem;
        --font-size28: 2.8rem;
        --font-size32: 3.2rem;
        --font-size36: 3.6rem;
        --font-size38: 3.8rem;
        --font-size40: 4rem;
        --gap-unit: .8rem;
        --margin: 1.7rem;
        --border-radius: .8rem;
    }
}

/*#endregion var*/

/*#region HEADER*/
@media (max-width: 768px) {
    .header {
        padding: 0 30px;
    }

    .header__logo-img {
        width: 65px;
    }

    .header__logo-ja {
        font-size: 16px;
    }

    .header__logo-en {
        font-size: 10px;
    }

    .header__menu {
        gap: 10px;
    }

    .headmenu__a-icon {
        display: flex;
    }

    .headmenu__a-icon img {
        width: 100%;
    }

    .headmenu__a-icon--phone {
        width: 36px;
    }

    .headmenu__a-icon--mail {
        width: 40px;
    }

    .headmenu__a-method,
    .headmenu__a-main {
        display: none;
    }

    .headmenu__a {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 60px;
        height: 60px;
        border-radius: 10px;
    }
}

@media (max-width: 450px) {
    .header {
        padding: 0;
        padding-right: 1.5rem;
    }

    .header__logo {
        gap: 0;
    }

    .header__logo-ja {
        font-size: 1.6rem;
    }
    
    .header__logo-en {
        font-size: 1rem;
    }

    .header__logo-img {
        width: 7rem;
    }

    .header__menu {
        gap: var(--gap-unit);
    }

    .headmenu__a {
        width: 5.5rem;
        height: 5.5rem;
        border-radius: var(--border-radius);
    }

    .headmenu__a-icon--mail {
        width: 4rem;
    }

    .headmenu__a-icon--phone {
        width: 3.3rem;
        rotate: -5deg;
    }
}

/*#endregion HEADER*/