header{display:flex;flex-direction:column;left:0;position:fixed;top:0;width:100%;z-index:2}header .top-header{background:#fff;box-shadow:0 4px 12px #0003;height:calc(var(--nav-height)/2);position:relative}header .top-header .t-h-box{align-items:center;display:flex;justify-content:space-between}header .top-header .t-h-box .logo{width:195px}header .top-header .t-h-box .nav-box{align-items:center;display:flex;gap:20px;height:100%}header .top-header .t-h-box .nav-box .nav-list{position:relative}header .top-header .t-h-box .nav-box .nav-list ul{display:flex;list-style-type:none;margin:0;padding:0;position:relative;width:100%}header .top-header .t-h-box .nav-box .nav-list ul li{cursor:pointer;flex:1;position:relative;text-align:center;z-index:1}header .top-header .t-h-box .nav-box .nav-list ul li a{color:var(--theme-color);display:block;letter-spacing:.5px;padding:4px 24px;text-decoration:none;z-index:1}header .top-header .t-h-box .nav-box .nav-list ul li:hover a{color:#fff;transition-delay:.2s}header .top-header .t-h-box .nav-box .nav-list ul .active{background:var(--theme-color);border-radius:var(--border-radius);will-change:auto}header .top-header .t-h-box .nav-box .nav-list ul .active a{color:#fff}header .top-header .t-h-box .nav-box .nav-list .slider,header .top-header .t-h-box .nav-box .nav-list .slider-active{background:#317abf;border-radius:var(--border-radius);height:100%;left:0;position:absolute;top:0;transition:all .3s ease-in-out;will-change:auto}header .top-header .t-h-box .nav-box .nav-list .slider li,header .top-header .t-h-box .nav-box .nav-list .slider-active li{color:#fff}header .top-header .t-h-box .nav-box .nav-list .slider-active{background:var(--theme-color);transition:all .5s ease-in-out;will-change:auto}header .bottom-header{background:var(--theme-color);height:calc(var(--nav-height)/2);left:-1px;position:absolute;top:calc(var(--nav-height)/2);transition:transform .5s ease-in-out;width:calc(100% + 2px);z-index:-1}header .bottom-header .b-h-box{display:flex;justify-content:flex-end}header .bottom-header .b-h-box ul{display:flex;width:300px}header .bottom-header .b-h-box ul li{align-items:center;cursor:pointer;display:flex;flex:1;gap:4px;justify-content:center;position:relative}header .bottom-header .b-h-box ul li a,header .bottom-header .b-h-box ul li p{color:#fff}header .bottom-header .b-h-box ul li .icon{display:flex;height:20px;width:20px}header .bottom-header .b-h-box ul li .icon img{height:100%;-o-object-fit:contain;object-fit:contain;width:100%}header .bottom-header .b-h-box ul li:after{background-color:#f7f7f7;bottom:35%;content:"";position:absolute;right:0;top:35%;width:2px}header .bottom-header .b-h-box ul li:last-child:after{display:none}header .hidden{pointer-events:none;transform:translateY(-100%)}header .sub-menu{position:relative}