@charset "utf-8";

.header{position: fixed; z-index: 999; background: #fff; width: 100%; padding: 12px 0; border-bottom: 1px solid #d5d5d5;}
.logo{font-size: 0;}
.logo img{ width: 190px;}
.login_btn a{font-size: 20px;font-weight: 700; color: #241b14;}
.pc-nav{width: 65%;}
.pc-nav .sub-menu-list-wrap{display: none;    padding: 8px 0;
    position: absolute;   z-index: 200 !important;
    top: 98px;   left: 50%;   transform: translateX(-50%);
   width: 160px;   text-align: center;
    transition: top .4s;   background: #fff;   border-radius: 0 0 15px 15px;
    border: 1px solid #d5d5d5;}
.menu-list-wrap{display: flex; justify-content: space-between; align-items: center; font-weight: 500;}
.menu-list{position: relative;}
.menu-list a{ font-size: 20px; transition: all .3s; display: inline-block; padding: 30px 0 ; color: #000;}
.pc-nav .sub-menu-list a{    font-size: 17px; color: #111;
    padding: 10px 0;
    display: inline-block;
    width: 100%; font-weight: 400;}
.header-inner {
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1480px;
}
.tv a{    background: #80c7bc;
    text-align: center;
    padding: 21px 12px;}
.tv a img{ width: 20px;}
.tv a span{display: block; color: #fff; font-size: 14px;}


.menu-list a:hover{ color: #0079fa}

.btnPcNav img {
    animation: bing 5s linear infinite;
}
.btnPcNav img:hover{
     animation: bing 3s linear infinite;
}

.header-right-wrap {
    text-align: right;
    display: none;
}
.header-right-wrap .menu-btn .line {
   margin: 7px 0; width: 19px !important;
  
}
.header-right-wrap .menu-btn .line, .header-right-wrap .menu-btn .line:before, .header-right-wrap .menu-btn .line:after {
    content: "";
    display: block;
    width: 26px;
    height: 2px;
   background: #000;
    transition: transform .4s;
}
.header-right-wrap .menu-btn .line:before {
    transform: translateX(-13px) translateY(-9px);
}
.header-right-wrap .menu-btn .line:after {
    transform: translateX(-13px) translateY(7px);
}

.header-right-wrap .menu-btn-wrap{
        position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 701;
    top: 50%;
    transform: translateY(-50%);
}



.has-sub {      font-size: 16px !important;
    padding: 0 10px;
    display: block !important;
    text-align: center;
    color: #111 !important;
    background: #fff;
    line-height: 40px;
    height: 40px !important;
}
.open-nav-wrap .sub-menu-list a{    font-size: 15px;transition: all .3s;
    padding: 10px 0;
    color: #fff;}


.open-nav-bg{    background: rgb(1, 7, 20,0.7);
    backdrop-filter: saturate(100%) blur(3px);
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;display: none;
    z-index: 500;}
.open-nav-wrap{position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100vh;
    opacity: 0;
    background-color: #fff;
    transform: translateX(100%);
    z-index: 700;
    transition: opacity .4s;
}
.pc-nav-open .open-nav-wrap{opacity:1;transform:translateX(0);transition:transform .4s ease-in-out,opacity .4s linear}
.open-nav-wrap .inner-wrap{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:0px 0 40px;max-width:1300px;margin:0 auto;height:100%; background: #0079fa;}
.open-nav-wrap .menu-list-wrap{      width: 100%;
    height: 100vh;
    padding: 60px 0;
    overflow-x: hidden;    box-shadow: 0 0 100px 1000px rgb(1, 7, 20,0.7);
    display: block;}



.pc-nav-open .header-right-wrap .menu-btn .line:after {
    -webkit-transform: translateY(-2px) rotateZ(-135deg);
    transform: translateX(-10px) translateY(-2px) rotateZ(-135deg); background: #fff;
}
.pc-nav-open .header-right-wrap .menu-btn .line:before {
    -webkit-transform: translateY(0) rotateZ(135deg);
    transform: translateX(-10px) translateY(0) rotateZ(135deg); background: #fff;
}
.pc-nav-open .header-right-wrap .menu-btn .line {
    background-color: #0079fa;
}

.open-nav-wrap .menu-list-wrap>*{width:100%}
.open-nav-wrap .menu-list{opacity:0;transform:translateX(100px)}
.pc-nav-open .open-nav-wrap .menu-list{opacity:1;transform:translateX(0);transition:transform .4s ease-out, opacity .4s linear}
.pc-nav-open .open-nav-wrap .menu-list:nth-child(1){transition-delay:.4s}
.pc-nav-open .open-nav-wrap .menu-list:nth-child(2){transition-delay:.46s}
.pc-nav-open .open-nav-wrap .menu-list:nth-child(3){transition-delay:.52s}
.pc-nav-open .open-nav-wrap .menu-list:nth-child(4){transition-delay:.58s}
.pc-nav-open .open-nav-wrap .menu-list:nth-child(5){transition-delay:.64s}
.pc-nav-open .open-nav-wrap .menu-list:nth-child(6){transition-delay:.7s}
.pc-nav-open .open-nav-wrap .menu-list:nth-child(7){transition-delay:.76s}
.open-nav-wrap .menu-list.on>div{position:relative}

.open-nav-wrap .menu-list>div{position:relative;display:flex;align-items:center;justify-content:space-between;height:50px;border-bottom:1px solid #ddd;font-size:26px;font-weight:500;letter-spacing:0.04em;color:#fff}
.open-nav-wrap .menu-list>div>a{    display: flex
;
    align-items: center;
    height: 100%;
    color: #000;
    padding: 0;
    margin: 0 auto;
    justify-content: center;
    font-size: 16px;}
.open-nav-wrap .menu-list>div.has-sub .aco-arrow{display:flex;align-items:center;justify-content:flex-end;width:50px;height:100%;text-align:right}
.open-nav-wrap .menu-list>div.has-sub .aco-arrow img{width:21px;height:13px;transition:transform .3s}
.open-nav-wrap .open-language-wrap>*{font-size:16px;font-weight:500;color:#888;margin-right:20px;letter-spacing:0.02em}
.open-nav-wrap .open-language-wrap .active{position:relative;color:#fff}
.open-nav-wrap .open-language-wrap .active:after{content:"";display:inline-block;position:absolute;bottom:-2px;left:0;width:100%;height:2px;background-color:#fff}
.open-nav-wrap .sub-menu-list-wrap{    justify-content: center;
    padding: 9px 20px 9px 10px;
    display: flex
;}
.open-nav-wrap .sub-menu-list{    position: relative;
    font-size: 15px;
    color: #aaa;
    width: 50%;
    text-align: center;}
.open-nav-wrap .sub-menu-list.on{color:#fff}
.open-nav-wrap .sub-menu-list .text{display:inline-block;align-items:center;padding:9px 10px;transition:color .4s}
.open-nav-wrap .menu-list>div.has-sub.open .aco-arrow img{transform:rotate(180deg)}
.open-nav-wrap .open-language-wrap{display:flex;padding:0 35px}


@media (max-width: 1400px) {
    .pc-nav{width: 70%;}
    .logo img{width: 170px;}
    .pc-nav .sub-menu-list a{font-size: 16px;}
    .pc-nav .sub-menu-list-wrap{top: 95px;}
    .login_btn a{font-size: 18px;}
    .menu-list a{font-size: 18px;}
}
@media (max-width: 1024px) {
    .login_btn a{display: none;}
    .header-right-wrap {display: block;}
    .pc-nav{display: none;}
    .logo img{width: 140px;}
    .btnPcNav img{width: 170px;}
    .btnPcNav{right: 15px;}
    .header { width: 100%;  margin: 0; padding: 0;}
    .header-inner {padding:  10px 20px;}

}


@media (max-width: 600px) {
    .logo img  {width: 120px;}
    .btnPcNav img {width: 110px;}
    .header-inner{padding: 10px 15px;}
    .header-right-wrap .menu-btn .line:after {transform: translateX(-5px) translateY(5px);}
    .header-right-wrap .menu-btn .line:before {transform: translateX(-5px) translateY(-7px);}
    .header-right-wrap .menu-btn .line, .header-right-wrap .menu-btn .line:before, .header-right-wrap .menu-btn .line:after {width: 22px;}
}