@charset "utf-8";

.headerHeight {
    transition: all .3s;
}

.header.is-scroll .headerHeight {
    height: 80px;
}

.headerBoxRight {
    gap: 15px !important;
}

.hamMenu {
    overflow-y: auto;
}

.hamMenuBoxLeft {
    display: contents;
}

.hamMenuBtnBox {
    order: 5;
}

.hamNaviColumn {
    width: 100%;
    max-width: max-content;
}

.hamConcernsBtnBox {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
    justify-items: center;
}

.hamNaviLink:hover {
    text-decoration: underline;
}

.hamNaviLink:hover,
.hamNaviLink:hover p {
    color: var(--black);
}

.hamConcernsBtn::before {
    content: "";
    display: block;
    width: 27px;
    aspect-ratio: 1/1;
    background: url(/system_panel/uploads/images/arrow01.svg) no-repeat center /contain;
    transition: all .3s;
}


.headerReserveBtn.lineBtn {
    background: #00B900;
}

.headerReserveBtn.lineBtn p {
    color: var(--white);
}


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width: 768px) {

    .header.is-scroll .headerHeight {
        height: 100px;
    }


    .hamMenuBoxLeft {
        display: flex;
        flex-direction: column;
    }

    .hamConcernsBtnBox {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px 10px;
    }

}

/* min-width: 768px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1024px) {
    .header.is-scroll .headerHeight {
        height: 100px;
    }


}

/* min-width: 1024px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1200px) {

    .headerBoxRight {
        gap: 30px !important;
    }

    .headerTelIcon {
        width: 24.5px !important;
        margin: 0 11px 0 0 !important;
    }

    .headerTelTxt {
        font-size: 40px !important;
    }


    .hamTelText {
        font-size: 51px !important;
    }

    .hamConcernsBtnBox {
        gap: 32px 40px;
    }

    .hamConcernsBtnText {
        font-size: 32px !important;
    }

    .hamConcernsBtn::before {
        width: 32px;
    }

}

/* min-width: 1200px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1440px) {

    .headerBtnBox {
        flex-direction: row !important;
        gap: 25px !important;
    }

    .headerReserveBtn {
        width: 320px !important;
        height: 72px !important;
    }

    .headerReserveBtnIcon {
        width: 33px !important;
    }

    .headerReserveBtnText {
        font-size: 24px !important;
    }

    .headerReserveBtnText {
        font-size: 28px !important;
    }
}

/* min-width: 1440px ここまで */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */