@charset "utf-8";
/* CSS Document */
.clear{ zoom: 1; }
.clear:after { content: ''; display: block; clear: both; }
.fl { float:left}
.fr { float:right}
.hidden{display:none; background: url() no-repeat center;}

.about-bj{width: 100%;background: #000;}

.banner{height: 100vh; position: relative;width: 100%;}
.banner video{width: 100%; height: 100%; object-fit: cover;}
.zznr{position: absolute; z-index: 10; width: 100%;height: 100%; background: rgba(0,0,0,.7);top: 0;left: 0;}
.banenr_text{position: absolute;width: 100%;text-align: center; left: 0; z-index: 11; top: 50%; transform: translateY(-50%);}
.banenr_text h2{margin-bottom: 30px;letter-spacing: 10px;font-size: 50px;font-family: 'OPPOSans-Ver2-Medium';color: #fff;width: 100%;}
.banenr_text p{color: #fff; font-size: 26px;width: 100%;letter-spacing:2px;}
.bfsp{position: absolute;width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #fff;
    text-align: center;
    top: 66%;
    left: 50%;
    z-index: 99;
    border: none;
}
.bfsp img{width: 17px;opacity: 0.8;margin-left: 5px;margin-top: 3px;}

.wztext{padding: 6vw 0 2vw;}
.wztext ul{padding-bottom:1vw;}
.wztext p{font-size: 96px; color: #fff;line-height: 160px;position: relative;overflow: hidden;display: inline-block;}
.wztext p span{display: block; position: absolute; height: 100%; width: 500%; left: 0; top: 0;background: rgba(0,0,0,.65);}

.about-h1{padding: 6vw 0 2vw;}
.about-h1 p{font-size: 96px;color: #fff;line-height: 160px;position: relative;overflow: hidden;display: inline-block;}
.about-h1 p span{display: block; position: absolute;height: 100%;width: 500%;left: 0;top: 0;background: rgba(0, 0, 0, .65);
transition: transform 0.3s ease;transform: translateX(-100%);}
.wap-about-h1{display: none;}

.Keynote{border-radius: 26px; background: #141414; padding: 0 85px; margin-bottom: 100px;}
.Keynote_titel{padding: 95px 0 45px;border-bottom:1px solid #4f4f4f;}
.Keynote_titel p{font-size: 24px; color: #9e9e9e; line-height: 40px;}
.Keynote_nr{position: relative;}

.Keynote_titel-h2{display:flex;justify-content:space-between;align-items:center;margin-bottom: 85px;}
.Keynote_titel-h2 h2{color: #fff; font-size: 48px;font-family: 'OPPOSans-Ver2-Medium';width:80%;}
.Keynote_titel-h2 a{text-align: center;width: 240px;color: #fff;font-family: 'OPPOSans-Ver2-Medium'; font-size: 24px;border-radius: 34px;
background: #373737;transition:all 0.5s;line-height: 70px;height:70px;}
.Keynote_titel-h2 a:hover{background: #f51fb6;}

.sub{ padding: 70px;background: #131414;border-radius: 26px;position: fixed;z-index: 9999;left:50%; top:50%;
transform:translate(-50%,-50%);display: none;width: 50%;}
.sub h2{font-size: 48px; color: #fff; margin-bottom: 70px;font-family: 'OPPOSans-Ver2-Medium';}
.sub p{font-size: 24px;line-height: 45px;color: #fff;}
.sub i{font-size: 20px;font-style: normal;display: block;margin-top: 40px; color: #9e9e9e;}

.qjbj{position: fixed;width: 100%; height: 100%; background: rgba(0,0,0,.85);top: 0; left: 0;display: none;z-index:999;}
.qjbj.show {
    overflow: hidden;
}

body.lock-scroll {
    overflow: hidden;
    position: relative;
    overflow-y: hidden;
}

.ggbtn{position: absolute; background: url(../images/d3.png); width: 50px;height: 50px; top: 40px; right: 60px; background-size: 100% 100%;cursor: pointer;transform: rotate(45deg);}
.ggbtn:hover{background: url(../images/d3_1.png);background-size: 100%;}
.keyobx h3{font-size: 32px;color: #fff; line-height: 90px;position: relative;}
.keyobx h3 b{position: absolute;  width: 50px;height: 50px;background-size: 100%; right: 0;top: 50%;transform: translateY(-50%);cursor: pointer;}
.keyobx h3 b em{height: 100%;width: 100%;background: url(../images/d3.png);transition: All 0.4s ease-in-out;background-size: 100%;display: block;}
.keyobx h3 b em:hover{background: url(../images/d3_1.png);background-size: 100%;}
.keyobx h3.on1 em{transform: rotate(45deg);}
.Keynote_nr{padding: 35px 0 85px;}
.keyobx a{
    display: inline-block;
    line-height: 45px;
    padding: 0 20px;
    font-size: 20px;
    color: #fff;
    border-radius: 8px;
    vertical-align: middle;
    margin: -8px 0 0 30px;
    background: #262626;
}
.bxzybox1{margin-bottom: 40px;}
.bxzybox{overflow: hidden;width:100%;}
.bxzybox a{display: block; line-height:80px; font-size:24px; color: #fff; border-radius: 10px;  background: #141414;transition: All 0.3s ease-in-out;white-space: nowrap;text-align: center; padding: 0 30px;border:1px solid #434343;}
.bxzybox a:hover{background: #fff; color: #333;}

.tempWrap{ width:100% !important; }
.bxzybox ul{zoom:1; }
.bxzybox ul li{ margin-right:3vw;float:left; text-align:left; _display:inline; width:auto !important;  }

.gzwm{margin: 5vw auto;}
.gzwm_title{padding: 180px 0 140px;}
.gzwm_title h2{font-size: 24px; color: #fff;}
.gzwm_title h2 span{color: #505050; padding-left: 16px;}
.gzwm_nr{margin-top: 3vw;}
.gzwm_nr ul{display: flex;justify-content : space-between;}
.gzwm_nr li{text-align: center;width:18%;}
.gzwm_nr li figure{width:170px;height:170px;background:rgba(255,255,255,0);display:flex;justify-content:center;align-items: center;
margin:0 auto;transition:all 0.5s;border-radius: 30px;}
.gzwm_nr li figure img{max-width: 100%;}
.gzwm_nr li figure img.img1{display:block;}
.gzwm_nr li figure img.img2{display:none;}
.gzwm_nr p{font-size: 24px; color: #fff; margin-top: 20px;}
.gzwm_nr li:hover figure{background:rgba(255,255,255,0.1);}

.jrwm_nr{padding-bottom: 80px;}
.jrwm_nr ul{display: flex;justify-content : space-between;}
.jrwm_nr li{width: 20%;}
.jrwm_nr h2{color: #fff; font-size: 32px; position: relative; padding-bottom: 60px;}
.jrwm_nr h2 img{display: inline-block;vertical-align: middle; margin: -7px 0 0 30px;}
.jrwm_nr h2 img.img1{display:inline-block;}
.jrwm_nr h2 img.img2{display:none;}
.jrwm_nr h2:before{position: absolute; content: "";border-bottom: 2px solid #404040; width: 50px; bottom: 18px; left: 0;}
.jrwm_nr p{font-size: 20px; line-height: 30px; color: #fff; opacity: .5;}
.btn2{display: block;text-align: center; margin: 0 auto; font-size: 26px; color: #fff; line-height: 64px; width: 340px; background: #141414;border-radius: 32px;transition: All 0.3s ease-in-out;}
.btn2:hover{background: #f51fb6;}
.jrwm_nr .in-btn a{margin: 6vw auto 0;}


.bqxx{padding: 38px 3%;text-align: center;}
.bqxx p{text-align: center; font-size: 15px; line-height: 1.6; color: #999999;}
.bqxx p span{padding: 0 15px;}
.scrollCont{}


.gxzy{position: relative;margin-top: 5vw;}
.gxzy:before{position: absolute; content: "";height: 100%; width: 20%; background-image: linear-gradient(to right, #000000 , transparent);top: 0;left: 0;z-index: 100;}
.gxzy:after{position: absolute; content: "";height: 100%; width: 20%; background-image: linear-gradient(to right, transparent, #000000 );top: 0;right: 0;z-index: 100;}


.whiteBackground .jrwm_nr .in-btn a{background:#000;color:#fff;}
.whiteBackground .jrwm_nr .in-btn a:hover{background:#000;color:#fff;}
/*.whiteBackground .jrwm_nr .in-btn a:hover span{color:#fff;}*/
/*.in-btn a span{position:relative;z-index:1;}*/
/*.in-btn a:after{z-index:0;}*/
.whiteBackground .jrwm_nr p{color: #000;}
.whiteBackground .jrwm_nr h2{color: #000;}
.whiteBackground .in-title h2,.whiteBackground .gzwm_nr p{color: #000;}
.whiteBackground .gzwm_nr li figure img.img1{display:none;}
.whiteBackground .gzwm_nr li figure img.img2{display:block;}
.whiteBackground .gzwm_nr li:hover figure{background:rgba(0,0,0,0.1);}
.whiteBackground .jrwm_nr h2 img.img1{display:none;}
.whiteBackground .jrwm_nr h2 img.img2{display:inline-block;}

.h2_2,.p_2{display: none;}

@media (max-width: 1520px){
    .Keynote_titel-h2 a{line-height: 73px;height:70px;}
}

@media (max-width: 1500px){
    .gzwm_nr li {width: 25%;}
    .Keynote{padding: 0 70px;}
    .Keynote_titel {padding: 70px 0 40px;}
    .sub {width: 60%;padding: 60px;}
}

@media(max-width:1400px){
    .sub{width:60%;}
    .keyobx h3 {font-size: 30px;line-height: 80px;}
    .sub h2 {font-size: 40px;margin-bottom: 60px;}
    .bxzybox a{line-height:70px;font-size:26px;}
    .keyobx a {line-height: 45px;font-size: 25px;}
    
}

@media (max-width:1024px){
   .banenr_text h2 {font-size: 8vw;letter-spacing: 4px;margin-bottom: 3vw;line-height: 12.5vw;}
   .banenr_text p {font-size: 5vw;line-height: 8vw;}
   .wztext ul {padding-bottom: 13vw;}
   .gzwm_nr ul,.jrwm_nr ul{flex-wrap: wrap;}
   .gzwm_nr li {width: 48%;margin-bottom: 2vw;}
   .gzwm_nr li figure {width: 30vw;height: 30vw;background: rgba(255, 255, 255, 0.1);}
   .gzwm_nr li figure img{width: 17vw;}
   .gzwm_nr p{font-size:4.6vw;margin: 3vw 0;}
   .jrwm_nr ul{margin: 3vw 0;}
   .jrwm_nr ul li{width: 47%;margin-bottom: 10vw;}
   .jrwm_nr h2 {font-size: 4.6vw;padding-bottom: 13vw; margin-bottom: 0vw;}
   .jrwm_nr p {font-size: 4vw;line-height: 5.5vw;}
   .jrwm_nr h2 img{width: 10px;}
   .jrwm_nr {padding-bottom: 0px;}
   .wztext {padding: 8vw 0 2vw;}
   .sub p {font-size: 3.73vw;line-height: 6.4vw;}
   .bxzybox a {font-size: 4.73vw;line-height: 14vw;}
   .bxzybox1{margin-bottom:3vw;margin-top:10vw;}
   .sub {width: 75%;padding:6vw;border-radius:20px;}
   .sub h2 {font-size: 4.67vw;line-height: 7.4vw;margin-bottom: 5vw;}
   .sub i {font-size: 2.7vw;margin-top: 4vw;}
   .ggbtn {width: 6vw;height: 6vw;top: 4vw;right: 4vw;}
   .wztext p{font-size: 10.67vw;line-height: 16.13vw;}
   .about-h1 p{font-size: 10.67vw;line-height: 16.13vw;}
   .keyobx a {font-size: 14px;line-height: 25px;padding: 3px 10px;margin: -3px 0 0 5px;}
   .Keynote_titel-h2 h2{font-size: 6.2vw;margin-bottom: 6vw;}
   .Keynote_titel-h2 a {width: 30vw;color: #fff;font-size: 3.9vw;line-height: 9.4vw;height:9vw;}
   .Keynote_titel p {font-size: 3.73vw;line-height:  6.4vw;}
   .Keynote {padding: 0 6vw;margin-bottom: 20vw;border-radius:20px;}
   .Keynote_titel {padding: 50px 0 50px;}
   .keyobx h3 {font-size: 4.67vw;line-height:  13vw;}
   .keyobx h3 b {width: 6vw;height: 6vw;}
   .Keynote_nr {padding: 35px 0 50px;}
   .Keynote_titel-h2 {margin-bottom: 7vw;flex-wrap: wrap;}
   
   .h2_2,.p_2{display: block;}
   .h2_1,.p_1{display:none;}
   .bfsp{left:42%;}
   .pc-about-h1{display:none;}
   .wap-about-h1{display: block;}
}

@media (max-width:760px){
   
   .gzwm {margin: 10vw auto;}
  
   .Keynote_titel {padding: 30px 0 30px;}
   .Keynote_nr {padding: 30px 0 30px;}
   .sub i {font-size: 14px;}
}

@media (max-width:510px){
   .jrwm_nr h2 img{width: 7px;margin: -5px 0 0 30px;}
  
}

@media (max-width:480px){

}

@media (max-width:370px){

}