
.h_nav{ height: 60px; width: 60px; background-color:var(--color); padding: 18px 8px ;    align-items: flex-end; display: flex;}
.h_nav .burger{ width: 100%;  height: 1px ; background: #fff;  transition: .8s; display:inline-block;       }
.h_nav .burger:first-child{ animation: long 2s linear infinite; -webkit-animation: long 2s linear infinite; }
.h_nav .burger:nth-of-type(2){  width: 50%;}
.h_nav .burger:nth-of-type(3){ animation: long 3s linear infinite; -webkit-animation: long 3s linear infinite; }
.h_nav.close { align-items: center; justify-content: center;}
.h_nav.close .burger:first-child{ display: none;}
.h_nav.close .burger:nth-of-type(3){ display: none;}
.h_nav.close .burger:nth-of-type(2) {    position: relative;    z-index: 1; width: 80%;}
.h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      content: '';   position: absolute;      top: 0;      left: 0;      width: 100%;      height: 100%;      background: #fff;      opacity: 0;      z-index: 1;}
.h_nav.close .burger:nth-of-type(2) {    background: transparent;    transform: rotate(-180deg); }
.h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      opacity: 1;      transition: all .3s; }
.h_nav.close .burger:nth-of-type(2):before {     transform: rotate(45deg); }   .h_nav .burger:nth-of-type(2):after {     transform: rotate(-45deg); }
 

.sjj_nav{}
.sjj_nav{ color: #fff !important; width: 100%; height: calc(100vh - 60px) ; max-height: calc(100vh - 60px) ; transition:all .6s ; transform: translateX(100%); background-color: #000; position: fixed; top: 60px; right: 0; flex-direction: column; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); -webkit-transition:all .6s ; -moz-transition:all .6s ; -ms-transition:all .6s ; -o-transition:all .6s ; 
    overflow-y: scroll;
}
.sjj_nav::-webkit-scrollbar {/*滚动条整体样式*/    /*高宽分别对应横竖滚动条的尺寸*/  width: 2px;}
.sjj_nav::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 3px; background: #333; width: 2px; }
.sjj_nav::-webkit-scrollbar-track {/*滚动条里面轨道*/border-radius: 3px; background: transparent; width: 2px; }
.sjj_nav.show{ transform:translateX(0) ;  -webkit-transform:translateX(0) ; -moz-transform:translateX(0) ; -ms-transform:translateX(0) ; -o-transform:translateX(0) ; }

.sjj_nav>ul>li:first-child{overflow:hidden;border-top:0}
.sjj_nav>ul>li:first-child>a{float:left;width:50%}
.sjj_nav>ul>li:first-child .language{float:right;width:auto;overflow:hidden;line-height:40px;margin-top:5px}
.sjj_nav>ul>li:first-child .language a{width:auto; padding: 0 10px; border-left:1px rgba(255, 255, 255, .2) solid;text-align:center;color:#999;}
.sjj_nav ul li i{position:absolute;top:5px;right:0px;border-left:1px rgba(255, 255, 255, .2) solid;height:40px;padding:0px 7px 0 7px;}
.sjj_nav ul li i svg{transform:rotate(-90deg);transition:all ease 0.35s}
.sjj_nav ul li .sjj_nav_i_se svg{transform:rotate(0deg)}
.sjj_nav ul li{border-top:1px rgba(255, 255, 255, .2) solid;padding-left:20px;position:relative;line-height:50px;font-size:16px}
.sjj_nav>ul >li:last-child{border-bottom:1px rgba(255, 255, 255, .2) solid;}
.sjj_nav ul li ul{display:none}
.sjj_nav ul li a{color:#fff;width:80%}
.sjj_nav ul li ul li a{color:rgba(255, 255, 255, .8);display:block;text-align:left;font-size: 14px;}
.sjj_nav ul li i svg{width:20px;height:20px;fill:rgba(255, 255, 255, .5);}
.sjj_nav ul li .sjj_nav_i_se svg{fill:#c9141e}
.sjj_nav ul li ul li>ul{margin-left:10px}

.sjj_nav ul li ul li{ line-height: 40px;}
.sjj_nav ul li ul li i{height: 30px;}