@charset "utf-8";
/*初始化*/
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div,dl,dt,dd,input{margin:0;padding:0;}
img{border:none;}
ul,ol{list-style:none;}
input,select,textarea{outline:none; border:none; background:#FFF;}
textarea{resize:none;}
a{text-decoration:none;}
button{ cursor:hand;}
.clearfix:after{content:""; display:block; clear:both;}
.clearfix{zoom:1;}
.cl{clear:both;}


body{background: #000; color: #fff; font-family:Microsoft YaHei,PingFangSC-Regular,sans-serif; overflow-x: hidden; font-family:Microsoft YaHei;}
#pic{width:1200px; position:absolute;top:0px;left:24%;z-index:5555;opacity:0;
    -moz-transition:0.3s;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; 
}
img{display: block; width:100%; min-height:200px;  margin:15px auto; text-align:center;
    position:relative;
    left:0px;
    top:0px;
    border-radius: 8px;
    image-rendering:-moz-crisp-edges;
    image-rendering:-webkit-optimize-contrast;
    image-rendering:-o-crisp-edges;
    image-rendering:crisp-edges;
    -ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */

    -ms-interpolation-mode:bicubic;   /* IE 7+ */
    image-rendering: optimizeQuality; /* Fx, (Gecko 1.9.2) */

    -webkit-backface-visibility:hidden;
    -ms-transform:translateZ(0);/*IE 9*/
    -webkit-transform:translateZ(0);/*Chrome safari opera*/
    transform:translateZ(0) ;
    transform: rotate(0.00000000001deg);
    

    /*image-rendering:-moz-crisp-edges;
    image-rendering:-o-crisp-edges;
    image-rendering:-webkit-optimize-contrast;
    image-rendering: crisp-edges;
    -ms-interpolation-mode:nearest-neighbor;*/
    


    /*image-rendering:-moz-crisp-edges;
    image-rendering:-o-crisp-edges;
    image-rendering:-webkit-crisp-edges;
    image-rendering:crisp-edges;
    image-rendering: pixelated; 
    -ms-interpolation-mode: nearest-neighbor;*/
    background: url(images/ui/loading.gif) center no-repeat;
    background-size:20px;
}
div{margin:0 auto;}

#gotop{width: 50px; height: 50px; background:#333; color: #fff;  cursor: hand; text-align:center; }
#gotop span{display: block; padding:5px;}

#r_box{width:40px; position:fixed; right:20px; bottom:80px; user-select:none; z-index:999999999; font-size:14px; text-align: center; font-family:"微软雅黑",Microsoft YaHei,"Microsoft YaHei";
}
#r_box li{width:40px;  text-align:center; line-height:40px; height:40px; color:#fff; cursor:pointer; margin-bottom: 6px; 
    -moz-transition:0.3s;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */}
#r_box span{display: block; height:30px; opacity:1; color:#888; font-size:12px;}
#r_box img{min-width:40px; min-height:40px; opacity:0; margin:0; padding:0; cursor:pointer; z-index:-9999;}
#r1{background:url(images/ui/1_1.png) no-repeat; background-size:40px; background-position:top left; display:none;}
#r2{background:url(images/ui/2_1.png) no-repeat; background-size:40px; background-position:top left; display:none;}
#r3{background:url(images/ui/3_1.png) no-repeat; background-size:40px; background-position:top left; display:none;}
#r4{background:url(images/ui/4_1.png) no-repeat; background-size:40px; background-position:top left; }
#r6{background:url(images/ui/6_1.png) no-repeat; background-size:40px; background-position:top left;}
#r5{background:url(images/ui/5_1.png) no-repeat; background-size:40px; background-position:top left;}
#r5 a{display: block; cursor:pointer;}

#r1:hover{background:url(images/ui/1_2.png) no-repeat; background-size:40px;  background-position:top left; cursor:pointer;}
#r2:hover{background:url(images/ui/2_2.png) no-repeat; background-size:40px;  background-position:top left; cursor:pointer;}
#r3:hover{background:url(images/ui/3_2.png) no-repeat; background-size:40px;  background-position:top left; cursor:pointer;}
#r4:hover{background:url(images/ui/4_2.png) no-repeat; background-size:40px;  background-position:top left; cursor:pointer;}
#r5:hover{background:url(images/ui/5_2.png) no-repeat; background-size:40px;  background-position:top left; cursor:pointer;}
#r6:hover{background:url(images/ui/6_2.png) no-repeat; background-size:40px;  background-position:top left; cursor:pointer;}

#r5 #r5Text{ display:none; position:absolute; z-index:9999; left:-105px; bottom:8px; width:95px; text-align:center; background:none;  border-radius:16px;line-height:40px; height:40px;}


#r6 div{position:absolute; z-index:9999; left:-110px; bottom:20px; width:100px; border-radius:20px; padding-right:10px; background:none;}
#r6 div div{position:absolute; z-index:9999; left:0px; bottom:0px; width:80px; height:360px; border-radius:20px; background:rgba(0, 0, 0, 0.7); z-index:-11; }
#r6 div a{display:block; line-height:36px; height:40px; margin:0; padding:0; position:relative; text-align:left; padding-left:36px; color:#abacac; font-size:13px;
   -moz-transition:0.3s;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
    }
#r6 div span{position:absolute; top:9px; left:10px; display:block; width:18px; height: 18px; border-radius:18px; /*background:#3f4343;*/ background:rgba(120, 120,120, 0.5); color:#888; line-height:18px; text-align: center; font-size:10px;
    -moz-transition:0.3s;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
    }

#r6 div a:hover{ border-radius:20px;/* background:#fff; */color:#016dff;}
#r6 div a:hover span{background:#016dff; color:#fff;}
#r6 div i{display:none; height:38px; margin:0; padding:0; background:#fff; position:absolute; top:0px; left:0px;width:90px; z-index:-10; border-radius:40px;
-moz-transition:0.3s;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */}

#pic2{position:relative; cursor: hand; z-index:1111;}
#pic2:hover > #picHide{opacity:1; cursor: hand;}
#pic2:hover #pic2Btn{color:#ccc;}
#pic2:hover #morePic ol li{background:url(images/ui/more_2.png) no-repeat; background-size:40px; cursor:hand;}

#picHide{position:absolute; top:0px; left:0px; display:block; z-index:5555; margin:0; opacity:0;  cursor:hand;
    -moz-transition:0.6s;/*  Firefox 4 */
    -webkit-transition:0.6s; /* Safari and Chrome */
    -o-transition:0.6s; /* Opera */
    transition:0.6s; /* Opera */
    }
#morePic,#morePic3{display: block; background:rgba(0, 0, 0, 1); position: absolute; right:-54px; top:10px; width:40px; height:auto; text-align:center; color:#fff; z-index:9999;cursor:hand;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */ }
#pic2 ol li{display: block;  width:40px; height:40px; text-align:center; color:#fff; float: left; margin-bottom:15px; line-height:36px;
 background:url(images/ui/more_1.png) no-repeat; background-size:40px; cursor:hand;
    -moz-transition:0.3s;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */}
#pic2 ol li:hover{ background:url(images/ui/more_2.png) no-repeat;background-size:40px; cursor:hand; }
#pic2 #pic2Btn{cursor:hand; position: absolute; color:#555; font-size:13px; left:10px; top:50px;  width:20px;background:#000;
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */}
#pic2Bigbox{width:100%; height:100%; position:fixed; top:0; left:0; z-index:999999; background:rgba(0, 0, 0, 0.9); text-align:center; display:none; opacity:0;
    -moz-transition:0.3s;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */ }
#pic2Bigbox a{color:#fff; cursor:hand;}
#pic2BigboxShow{max-width:1400px; height:700px; overflow:hidden; margin: 0 auto; padding:50px 0; position:relative;}
#pic2BigboxShow img{position:absolute; top: 0px; left: 0px; opacity:0; 
    -moz-transition:0.3s;/*  Firefox 4 */
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */ }


#pic3{position:relative; z-index:1111; width:1200px; height:675px; margin:15px 0; padding:0px; background:#171819; border-radius:8px;}
#pic3 img{position:absolute;margin:0px; padding:0px;
position:absolute; top: 0px; left: 0px; opacity:100;
    -moz-transition:0.6s;/*  Firefox 4 */
    -webkit-transition:0.6s; /* Safari and Chrome */
    -o-transition:0.6s; /* Opera */
    transition:0.6s; /* Opera */ 
    border:none;
    }
#pic3Prev {display: block;  width:40px; height:40px; text-align:center; color:#fff; float: left; margin-bottom:8px; line-height:36px;
 background:url(images/ui/8_1.png) no-repeat; background-size:40px;  cursor:hand; border-radius:40px; -moz-transition:0.3s;/*  Firefox 4 */ -webkit-transition:0.3s; /* Safari and Chrome */ -o-transition:0.3s; /* Opera */    transition:0.3s; /* Opera */}
#pic3Prev:hover{display: block;  width:40px; height:40px; text-align:center; color:#fff; float: left; margin-bottom:8px; line-height:36px;
 background:url(images/ui/8_2.png) no-repeat; background-size:40px;  cursor:hand; border-radius:40px; -moz-transition:0.3s;/*  Firefox 4 */ -webkit-transition:0.3s; /* Safari and Chrome */ -o-transition:0.3s; /* Opera */    transition:0.3s; /* Opera */}
#pic3Next {display: block;  width:40px; height:40px; text-align:center; color:#fff; float: left; margin-bottom:8px; line-height:36px;
 background:url(images/ui/7_1.png) no-repeat; background-size:40px;  cursor:hand; border-radius:40px; -moz-transition:0.3s;/*  Firefox 4 */ -webkit-transition:0.3s; /* Safari and Chrome */ -o-transition:0.3s; /* Opera */    transition:0.3s; /* Opera */}
#pic3Next:hover{display: block;  width:40px; height:40px; text-align:center; color:#fff; float: left; margin-bottom:8px; line-height:36px;
 background:url(images/ui/7_2.png) no-repeat; background-size:40px;  cursor:hand; border-radius:40px; -moz-transition:0.3s;/*  Firefox 4 */ -webkit-transition:0.3s; /* Safari and Chrome */ -o-transition:0.3s; /* Opera */    transition:0.3s; /* Opera */}
#pic3Num{display: block; height:auto; opacity:1; color:#555; font-size:12px;}
#pic3Text{display: block; height:auto; opacity:1; color:#555; font-size:13px; padding-top:12px; }
#pic3Box{position:relative; z-index:1111; width:1200px; height:675px; margin:15px 0; padding:0px; background:#171819; border-radius:8px;}


#pic3BoxBg{position:absolute; left:0; top:0px; width:1200px; height:675px; margin:0 auto;}
#pic3ImgBox{ top:95px; width:914px; height:507px; border-radius:8px; overflow:hidden; position:relative; border:1px #000 solid;  cursor:pointer;}
#pic3ImgBox img{ /*padding-top:95px; padding-left:143px;*/ width:100%; height:auto; position:absolute; top:0px; left:0px; z-index:1;}

#pic4BoxBg{position:absolute; left:0; top:0px; width:1200px; height:675px; margin:0 auto;}
#pic4ImgBox{ top:41px; width:276px; height:591px; border-radius:28px; overflow:hidden; position:relative; border:1px #000 solid;  cursor:pointer; margin-left:154px; background:#000;}
#pic4ImgBox img{ /*padding-top:95px; padding-left:143px;*/ width:100%; height:auto; position:absolute; top:0px; left:0px; z-index:1; border:none;}

#pc_2_1:hover{top:-136px;}
#pc_2_2:hover{top:-879px;}
#pc_2_3:hover{top:-295px;}
#pc_2_4:hover{top:-261px;}
#pc_2_5:hover{top:-195px;}
#pc_2_6:hover{top:-250px;}
#pc_2_7:hover{top:-135px;}
#pc_2_8:hover{top:-582px;}

#app5_10:hover{top:-339px;}
#app5_1:hover{top:-30px;}
#app5_2:hover{top:-30px;}
#app5_3:hover{top:-30px;}
#app5_4:hover{top:-30px;}
#app5_5:hover{top:-87px;}
#app5_6:hover{top:-30px;}
#app5_7:hover{top:-356px;}
#app5_8:hover{top:-30px;}
#app5_9:hover{top:-30px;}
#app5_11:hover{top:-30px;}

#app6_1:hover{top:-30px;}
#app6_2:hover{top:-30px;}
#app6_3:hover{top:-208px;}
#app6_4:hover{top:-30px;}
#app6_5:hover{top:-30px;}
#app6_6:hover{top:-30px;}
#app6_7:hover{top:-30px;}
#app6_8:hover{top:-30px;}
#app6_9:hover{top:-30px;}
#app6_10:hover{top:-30px;}


#bigboxCtrl{ width:300px; height:50px; position:relative; line-height:36px; margin-top:30px;}
#bigboxCtrl a{width:100px; height:40px; background:rgba(85, 85, 85, 0.5); color:#fff; border-radius:40px; display:block; line-height:36px; font-size: 14px; cursor:hand;user-select:none;}
#bigboxCtrl a:hover{width:100px; height:40px; background:rgba(255, 255, 255, 1); color:#016dff; border-radius:40px; display:block; line-height:36px; cursor:hand;}
#bigBoxCtrlPrev{position:absolute; top:0; left:0; cursor:hand; }
#bigBoxCtrlNext{position:absolute; top:0; right:0; cursor:hand;}

#fristPic{position:absolute; left:0px; top:0px; z-index:999;}
#picWap img{border-radius:0.1rem; margin:0.2rem auto;}


#detailShow{background:rgba(0,0,0,0.6); position:fixed; z-index:99999998; width:100%; height:100%; display:none;
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
}
#detailVideo{background:url(images/ui/loading.gif) center no-repeat rgba(0,0,0,0.9); background-size:20px;  display:block; width:360px; min-height:720px; margin:0 auto; border-radius:24px; margin-top:5%; border:1px #776446 solid;}

#vipShow{width:1200px; height:675px; position:relative; overflow:hidden; font-size:14px; margin:15px auto;}
#vipShow ol {width:2400px; position:absolute; top:120px; left:-885px;}
#vipShow ol li img{width:240px; height:240px;
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
}
#vipShow li{ float:left; width:240px; margin-right:100px; cursor:pointer;}
#vipShow li:hover strong{ color:#f4d39f;}
#vipShow li:hover img{transform: scale(1.1);}
#vipBg{position:absolute; z-index:-100; top:0; left:0; width:1200px; height:675px; margin:0;}

#vipShow span{display:block; text-align:center; color:#555;}
#vipShow strong{font-size:18px; font-weight:bold; color:#fff; display:block; line-height:40px;
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
    }
#vipShowBtn { margin:0 auto; width:550px; height:42px; top:550px; position:relative;}
#vipShowBtn div{display:block; width:120px; height:42px;  cursor:pointer;
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */}
#vipShowBtn2 {margin:0 auto; border-radius:100px; border:1px #f4d39f solid; line-height:38px; color:#f4d39f; text-align:center;}
#vipShowBtn2:hover{margin:0 auto; border-radius:100px; border:1px #f4d39f solid; line-height:38px; color:#333; background:#f4d39f; text-align:center; font-weight:bold; width:110; height:42px;}

#vipShowBtn1 {position:absolute; left:0px; top:0px; background:url("images/ui/prev1.png") no-repeat center; width:124px; cursor:pointer; background-size:50%;}
#vipShowBtn3 {position:absolute; right:0px; top:0px; background:url("images/ui/next1.png") no-repeat center; width:124px; cursor:pointer; background-size:50%;}
#vipShowBtn1:hover{background:url("images/ui/prev2.png") no-repeat center; background-size:50%; padding-left:10px;}
#vipShowBtn3:hover{background:url("images/ui/next2.png") no-repeat center; background-size:50%; padding-right:10px;}



#welcome{
    background:rgba(0,0,0,0.6); position:fixed; z-index:99999999; width:100%; height:100%; display:none; text-align:center; opacity:0;
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
}
#welcome img{width:360px; height:360px; margin:0 auto; 
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
}

#welcomeWap{
    background:rgba(0,0,0,0.6); position:fixed; z-index:99999999; width:100%; height:100%; display:block; text-align:center; opacity:1; margin:0; padding:0;
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
}
#welcomeWap img{width:300px; height:300px; 
    -moz-transition:0.3s;/*  Firefox 4 */ 
    -webkit-transition:0.3s; /* Safari and Chrome */
    -o-transition:0.3s; /* Opera */
    transition:0.3s; /* Opera */
}


#tt1, #tt2, #tt3, #tt4, #tt5, #tt6, #go {
    transform: none !important;
    will-change: transform;
}


#resume{
    border-radius: 8px;
    position:relative;
    width:1200px; height:675px; padding:0; overflow:hidden;}
#resume img{position:absolute;
    width:auto; height:auto;
    -moz-transition:0.6s;/*  Firefox 4 */ 
    -webkit-transition:0.6s; /* Safari and Chrome */
    -o-transition:0.6s; /* Opera */
    transition:0.6s; /* Opera */

    }
#resumeBg{ width:1200px; height:675px; position:absolute; top:0px; left:0px; z-index:1; margin-top:0px; /*opacity:0.2;*/}
#resumePic1{left:123px; top:32px;transform: scale(0.58); -webkit-transform: scale(0.58);   -moz-transform: scale(0.58);     -ms-transform: scale(0.58);  -o-transform: scale(0.58); z-index: 9; background-image:none;  }
#resumePic2{left:-14px; top:-57px;transform: scale(0.58); -webkit-transform: scale(0.58);   -moz-transform: scale(0.58);     -ms-transform: scale(0.58);  -o-transform: scale(0.58); z-index: 8;background-image:none;   }
#resumePic3{left:287px; top:-275px;transform: scale(0.58); -webkit-transform: scale(0.58);   -moz-transform: scale(0.58);     -ms-transform: scale(0.58);  -o-transform: scale(0.58); z-index: 7; background-image:none;  }
#resume:hover #resumePic3{top:-650px;}
#resumeMask{position:absolute; bottom:0px; left:0px; z-index:10; width:1200px; height: 120px; flex-shrink: 0; background: linear-gradient(0deg, #EFF9FF 0%, rgba(239, 249, 255, 0.00) 100%);}


/*#launch{
    border-radius: 8px;
    position:relative;
    width:1200px; height:auto; padding:0; overflow:hidden;}
#launch iframe { width:263px; height:570px; background:#ff0000; position:absolute; left:786px; top:62px; z-index:999; border:none; background:none; border-radius: 39px; }
#launch img{width:1200px; height:auto;}*/

.video-container {
    width: 100%;
}

.video-container video {
    width: 100%;
    height: auto;
    max-width: 100%;
    display: block;
}