@font-face {
    font-family: "oppo";
    font-weight: bold;
    src: url("../font/OPPOSans-Bold.ttf");
    font-display: swap;
}
@font-face {
    font-family: "oppo";
    font-weight: 500;
    src: url("../font/OPPOSans-Medium.ttf");
    font-display: swap;
}
@font-face {
    font-family: "oppo";
    font-weight: initial;
    src: url("../font/OPPOSans-Regular.ttf");
    font-display: swap;
}
*{margin: 0; padding: 0; box-sizing: border-box; font-family: "oppo";}
a{color: inherit; text-decoration: none;}
li{list-style: none;}
.children-nav{width: 100%; background-image: url(../images/children-nav.png); background-size: 100% 100%; height: 3.7vw; position: relative; z-index: 1;}
.children-nav .nav{ width: 65.6vw; height: 3.5vw; margin: 0 auto; display: flex; align-items: center; justify-content: flex-start}
.children-nav .nav .logo{ width: 4.6vw;}
.children-nav .nav ul.navlist{ height: 100%; display: flex; align-items: center; margin-left: 13.5vw;}
.children-nav .nav ul.navlist li{ color: #e7e7e7; font-size: 16px; margin-right: 4vw;}
.children-nav .nav ul.navlist li::before{content: ""; width: 80%; height: 3px; display: block;position: relative; bottom: -1.2vw; margin: 0 auto;}

.children-nav .nav ul.navlist li.cur{font-weight: bold; position: relative;}
.children-nav .nav ul.navlist li.cur::before{background-color: #e7e7e7; }
.children-nav .nav .lang-box{ width: 17vw; height: 100%; display: flex; align-items: center; justify-content: flex-end;margin-left: auto;  position: relative;}
.children-nav .nav .lang-box:hover .lang-list{display: block;}
.children-nav .nav .lang-box .lang-view{ width: 6.8vw;  height: 2vw; background-image: url(../images/lang-view-btn.png),url(../images/lang-bg.png); background-size: 1vw 1vw,100% 100%; padding: 5px 10px; display: flex; align-items: center;font-size: 14px;  background-repeat: no-repeat,no-repeat; background-position: 5.5vw center ,center;cursor: pointer;}
.children-nav .nav .lang-box .lang-view .lang-icon{ width: 1.5vw; height: 1.5vw; margin-right: 10px; }
.children-nav .nav .lang-box .lang-list{ width: 4vw; height: 5.4vw; background-image: url(../images/lang-list-bg.png); background-size: 100% 100%; position: absolute; top: 3vw; padding: 0.5vw 0; display: none;}
.children-nav .nav .lang-box .lang-list li{ width: 100%;height: calc(100% / 3); display: flex; align-items: center; justify-content: center;cursor: pointer; font-size: 14px;}
.children-nav .nav .lang-box .lang-list li.cur{ color: #D95863;}



.footer{ width: 100% ; height: 30vw; background-image: url(../images/footer-bg.png); background-size: 100% auto; margin-top: -1vw; padding-top: 4.5vw;background-position: center center; background-repeat: no-repeat;}
.footer .footer-logo{ width: 13.3vw; display: block; margin: 0 auto;}
.footer .link-box{ width: 27.6vw; height: 2.6vw; background-image: url(../images/footer-link-bg.png); background-size: 100% 100%; margin: 0 auto; margin-top: 3vw; display: flex; align-items: center; justify-content: center; color: #1C1B2C; font-size: 18px;}
.footer .media-list{ width: 21vw; height: 4.2vw; margin: 0 auto;  margin-top: 2vw; display: flex;}
.footer .media-list a{ display: flex; align-items: center; justify-content: center; width: 4.2vw; height: 4.2vw;}
.footer .media-list a img{ width: 100%; height: 100%;}
.footer .copyright{ width: 100%; color: #E0E0E0; text-align: center;  margin-top: 2vw;}




@media (max-width: 2199px) {
    
    .children-nav .nav ul.navlist{ height: 100%; display: flex; align-items: center; margin: 0 auto;}
    .children-nav .nav .lang-box{ width: auto; height: 100%; display: flex; align-items: center; justify-content: flex-end;  position: relative; margin-left: 0;}
    .children-nav .nav ul.navlist li::before{content: ""; height: 3px; display: block;position: relative; bottom: -2vw; margin: 0 auto;}
}

@media (max-width: 1600px) {
    .children-nav .nav .lang-box .lang-list{ width: 5vw;}
    .children-nav .nav .lang-box .lang-view{font-size: 12px;width: 8vw; background-position: 6.5vw center ,center;}
    .children-nav .nav ul.navlist li{ font-size: 14px; }

}
