/* по умолчанию скрыто */
.menu .sub_menu { display: none; }
.menu .item .items { display: none; }

/* раскрытие по классу */
.menu .menu-item.open > .sub_menu {
    display: block;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #00000025;
}
.menu .menu-item .sub_menu a{
    font-size: 14px;
    color: #111111;
    line-height: 30px;
}

.menu .item.open > .items {
    display: block;
}

/* строка пункта меню (чтобы справа была стрелка) */
.menu .menu-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.menu .menu-link a{
    font-size: 17px;
    color: #111111;
    line-height: 40px;
}

/* стрелки */
.menu-toggle,
.sub-toggle {
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    position: relative;
    cursor: pointer;
}

/* рисуем "галочку вниз" */
.menu-toggle::before,
.sub-toggle::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    transform: translate(-50%, -60%) rotate(45deg);
    transition: transform .2s ease;
}

/* поворот стрелки при open */
.menu-item.open > .menu-link .menu-toggle::before {
    transform: translate(-50%, -40%) rotate(-135deg);
}
.menu.row .menu-item:last-child{
    padding-bottom: 20px;
}
.item.open > .main .sub-toggle::before {
    transform: translate(-50%, -40%) rotate(-135deg);
}

/* подгруппы тоже в строку */
.menu .item .main {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* убираем переход по ссылке # визуально */
.sub-toggle-link { text-decoration: none; }

