#header .header{position: fixed; top: 0; left: 0; transition: all 0.3s; width: 100%; z-index: 99999; padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,0.5);}
#header.on .header{border-bottom: 0; background-color: #fff; box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.2);} 
#header .menu li{width: calc(100%/4);}
#header .menu a{color: #fff; font-weight: 500; width: 100%; display: block; position: relative;} 
#header .menu a:hover:after{width: 21px; height: 21px; border-radius: 50%; background-color: rgba(54,54,54,0.2); display: block; content: ''; position: absolute; top: -3px; right: 40px; z-index: -1;}
#header .menu li:nth-child(1) a:hover:after{right: 98px; }
#header.on .menu a{color: #363636;}

#header .on{display: none;}
#header.on .off{display: none;}
#header.on .on{display: block;}
#header .hamburger, #header .menu_close{display: none;}

.mo_m{display: none}

#footer a{color: #b0b0b0}

.quick{position: fixed; bottom: 0; left: 0; width: 100%; background-color: #363636; z-index: 999;}
.quick .flexList{--x-gap: 0rem}
.quick .flexList .box{border-right:  1px solid #737373;}
.quick .flexList .box:last-child{border-right: 0;}
@media(max-width: 1440px){
    .quick .width40{width: 60%;}
}
@media(max-width: 990px){
    .m_quick .width40{width: 100%;}
    .m_quick .width40 .width30{text-align: center; font-size: 14px;}
    .m_quick .flexList{font-size: 14px;}
    #header .hamburger{display: block;}
    #header.h_on .hamburger{display: none;}
    #header.h_on .menu_close{display: block;}
    #header.h_on{background-color: #fff;}
    #header.h_on .on{display: block;}
    #header.h_on .off{display: none;}

    #header .menu {
        right: -110%;
        top: 100px;
        position: absolute;
        transition: all 0.5s;
        width: 100%;
        border-top: 1px solid #d7d7d7;
    }

    #header .menu.on {
        right: 0;
    }

    #header .menu li{width: 90%; margin: auto; border-bottom: 1px solid #d7d7d7;}
    #header .menu a{color: #363636; text-align: left; padding: 20px 10px; font-size: 3.000rem; position: relative;}
    #header .menu a:hover:after{display: none;}
    #header .menu a:before{width: 19px; height: 33px; content: url(/img/main/menu_arrow.png); display: block; position: absolute; top: 50%; right: 5px; transform: translateY(-50%);}
    #header.h_on .header {
        height: 100%;
        background-color: #fff;
        overflow-y: scroll;
    }

    .mo_m{display: inline-block}
    .m_quick {position: fixed; bottom: 5%; left: auto; right: 5%; width: 60px; background-color: rgba(0, 0, 0, 0);; z-index: 999;}
    .m_quick .width40{display: block;}
    .m_quick .flexList{background-color: #363636; --y-gap: 0rem; width: 100%; /* padding: 0 10px; */ font-size: 12px;}
    .m_quick .flexList .box {
        border-right: 0;
        /* border-bottom: 1px solid #737373; */
        padding: 10px;
        position: relative;
    }
    .m_quick .flexList .box:first-child {background-color: #3F4F44;}
    .m_quick .flexList .box:after {position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; background: #737373; width: 80%; height: 1px; content: "";}
    .m_quick .flexList .box a {display: inline-block;}
    .m_quick .container{width: 100%;}
    .m_quick #q_btn{background-color: #363636; width: 100%; padding: 15px 10px; display: block;}

    .m_quick #q_btn{transition: all 0.3s;}
    .m_quick #q_btn.active{margin-top: 5px;}
    .m_quick #q_btn.active img{transform: rotate(-45deg);}

    #footer .container{padding-bottom: 0;}

}

@media(max-width: 500px){
    .m_quick .width40 .width30{font-size: 12px;}
    .m_quick .flexList{font-size: 12px;}
}