.boxScroll{position: sticky;top:0px;width: 100%;z-index: 50;background-color: #212121}
.boxScroll.scrollUp{transition: all 0.5s ease-out 0s;}
.boxScroll.scrollUp.scrollShow{top:0px}
.hfix .boxScroll{box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2)}
.divScroll{display: flex;max-width: 100%;align-items: center;justify-content: space-between;width: 1300px;margin: 0px auto;align-items: center;padding: 17px 15px 0px 15px;box-sizing: border-box;}
.showBckMenu{display:block;height:0px;width:100%;position:fixed;top:0px;right:0px;background-color:rgba(0,0,0,0.5);z-index:999;transition:all 0.5s ease-out 0.3s;}
.showBckMenu.showBg{display:block;height:calc(100vh);transition:height 0.5s ease-out 0s;}
body{transition:all 0.5s ease-out 0s;}


.menuFooter ul {list-style:none;display:flex;align-items:center;gap:5px 10px;}
.menuFooter li+li {border-left:1px solid #d9d9e2;padding-left:10px;}
.menuFooter a {color:#1357ff;}

@media screen and (min-width:769px){
    button.showMenu {display:none;}
}


button.showMenu {height:23px;width:28px;padding:0;position:relative;z-index:0;background:transparent;border:none;outline:none;cursor:pointer;}
button.showMenu span {transition: opacity .4s;position:absolute;left:0;right:0;height:5px;background-color:#fff;border-radius:2px;top:0;bottom:0;margin:auto 0;}
button.showMenu::before {content:'';position:absolute;left:0;right:0;height:5px;background-color:#fff;border-radius:2px;top:0;transition:top .15s ease-out .15s,transform .15s;}
button.showMenu::after {content:'';position:absolute;left:0;right:0;height:5px;background-color:#fff;border-radius:2px;bottom:0;transition:bottom .15s ease-out .15s,transform .15s;}
button.showMenu.show span {opacity:0;}
button.showMenu.show::before {top:9px;transform: rotate(-45deg);transition:top .15s,transform .15s ease-out .15s;}
button.showMenu.show::after {bottom:9px;transform: rotate(45deg);transition:bottom .15s,transform .15s ease-out .15s;}

.menuTop{flex-grow:1;}
.menuTop ul {list-style:none;}
.menuTop nav>ul {display:flex;align-items:center;gap:2em;justify-content: flex-end;}
.menuTop nav a,
.menuTop nav span {
    color:#fff;
    font-family:var(--gfont2-family), serif;
    font-size:20px;
    line-height:1;
    display:block;
    border:1px solid transparent;
    border-radius:3px;padding:6px 14px;
    transition:color .2s, border-color .2s;
    text-align:center;
    &:is(span) {cursor:default;}
}
.menuTop nav li.sel>a,
.menuTop nav li.sel>span,
.menuTop nav a:hover,
.menuTop nav span:hover {color:#66bfff;border-color:currentColor;}
.menuTop li:has(>ul) {
    position:relative;z-index: 20;
    &:hover>ul {visibility:visible;opacity:1;}
}
.menuTop li ul {visibility:hidden;opacity:0;transition:all .3s;position:absolute;top:100%;left:0;min-width:100%;width:max-content;max-width:200px;background-color:#01c;padding-block:10px;border-radius:0 0 10px 10px;}
.menuTop li ul a,
.menuTop li ul span {text-align:left;border:none;font-size:18px;padding:10px 15px;}
.menuTop li ul li+li {border-top:1px solid #2232e3;}

@media screen and (max-width:1124px){
    .menuTop nav>ul {gap:1em;}
    .menuTop nav a,
    .menuTop nav span {font-size:1rem;}
}
@media screen and (max-width:1024px){
    .menuTop nav>ul {gap:10px;}
    .menuTop nav a,
    .menuTop nav span {padding:4px;}
}
@media screen and (max-width:768px){
    .menuTop nav {transition:all .3s;position:fixed;top:70px;right:0;width:calc(100% - 20px);bottom:0;background-color:#01c;}
    .menuTop nav:not(.show) {visibility:hidden;right:calc(20px - 100%);}
    .menuTop nav>ul {display:block;}
    .menuTop nav li+li {border-top:1px solid #2232e3;}
    .menuTop nav a,
    .menuTop nav span {text-align:left;border:none;padding:20px;}
    .menuFooter ul {flex-direction:column;}
    .menuFooter li+li {border-left:none;padding-left:0;}
    .menuTop{flex-grow:0;order:1;}
    .menuTop li ul {visibility:visible;opacity:1;position:static;border-top:1px solid #2232e3;padding-block:0;border-radius:0;background-color:transparent;width:auto;min-width:0;max-width:none;}
    .menuTop li ul a {padding-block:10px;padding-left:40px;}

}