what is the css class name that controls the vertical line animation in the menu

Hi there,

If you go to Customize > Additional CSS you'll see the CSS under the /* navigation line effects */ comment.

You can remove it, or update it to apply to top-level menu items only:

@media (min-width: 1024px) {
    .main-navigation .main-nav > ul > li > a:before {
        position: absolute;
        content: '';
        width: 1px;
        height: 0;
        background-color: #607b7d;
        left: 50%;
        top: -50px;
        transform: translateX(-50%);
        transition: all .3s ease-out 0s;
    }

    .main-navigation .main-nav > ul > li:hover > a:before {
        height: 50px;
    }

    .main-navigation .main-nav > ul > li.current-menu-item > a:before {
        height: 50px;
        width: 1px;
    }
}