/* pc */
footer {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 6;
}

#footer_wrap {
    background-color: #FFFFFF;
    border-top: 1px solid #E1E1E1;
    padding: 4px 0 12px;
}

#footer_wrap .footer_nav {
    display: flex;
}

.footer_nav li {
    width: 20%;
}

.footer_nav .nav_item {
    display: block;
    width: 100%;
    padding-top: 22px;
    text-align: center;
    color: #9E9E9E;
    font-size: 14px;
    background-repeat: no-repeat;
    background-size: 20px;
    background-position: top center;
}

.footer_nav .nav_item.main {
    background-image: url("/static/app_driver/base/img/icon_main_g.png");
}

.footer_nav .nav_item.run {
    background-image: url("/static/app_driver/base/img/icon_bus_g.png");
}

.footer_nav .nav_item.oil {
    background-image: url("/static/app_driver/base/img/icon_oiling_g.png");
}

.footer_nav .nav_item.rank {
    background-image: url("/static/app_driver/base/img/icon_thumbup_g.png");
}

.footer_nav .nav_item.my {
    background-image: url("/static/app_driver/base/img/icon_my_g.png");
}

.footer_nav .nav_item.active {
    color: var(--main-color);
}

.footer_nav .nav_item.active.main {
    background-image: url("/static/app_driver/base/img/icon_main_blue.png");
}

.footer_nav .nav_item.active.run {
    background-image: url("/static/app_driver/base/img/icon_bus_blue.png");
}

.footer_nav .nav_item.active.oil {
    background-image: url("/static/app_driver/base/img/icon_oiling_blue.png");
}

.footer_nav .nav_item.active.rank {
    background-image: url("/static/app_driver/base/img/icon_thumbup_blue.png");
}

.footer_nav .nav_item.active.my {
    background-image: url("/static/app_driver/base/img/icon_my_blue.png");
}

/* tablet */
@media screen and (max-width: 1023px) {}

/* mobile */
@media screen and (max-width: 767px) {}