#nav-inner,
#nav-inner * {
    box-sizing: border-box
}

#nav-inner .nav-inner ul {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none
}

#nav-inner .nav-inner li {
    min-width: 0
}

#nav-inner .nav-inner a {
    display: block;
    width: 100%;
    padding: 10px 8px;
    border-bottom: 1px solid #ebebeb;
    color: var(--vpone-text);
    font-size: 12px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase
}

#nav-inner .nav-inner a:hover,
#nav-inner .nav-inner a.current {
    border-bottom-color: var(--vpone-accent)
}

@media screen and (max-width: 1024px) {
    #nav-inner .nav-inner a {
        padding-right: 4px;
        padding-left: 4px;
        font-size: 10px
    }
}

@media screen and (max-width: 736px) {
    #nav-inner {
        overflow-x: auto;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch
    }

    #nav-inner .nav-inner ul {
        display: flex;
        min-width: max-content;
        width: auto
    }

    #nav-inner .nav-inner li {
        flex: 0 0 auto
    }

    #nav-inner .nav-inner a {
        min-width: 128px;
        padding: 12px 18px;
        font-size: 12px;
        line-height: 1.1;
        white-space: nowrap
    }
}