html,body{background:#3b3b3b;width:100%;min-width:1200px}
.loading{width:100%;height:100%;position:fixed;top:0;left:0;background:#000;z-index:20;font-size:18px;color:#cfd1cc;z-index:101}
.loading .box{width:100%;height:1px;background:#414141;margin:0 auto;position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);left:0}
.loading .box span{height:1px;background:#c4c4c4;position:relative;top:0;left:0;display:block}
.loading .box p{font-size:16px;line-height:30px;color:silver;text-align:center}
.wraper{width:100%;min-width:1200px;height:100%;position:relative;overflow:hidden;margin-top:40px}
.wraper .bg{width:1920px;position:absolute;left:50%;margin-left:-960px;top:0;background:url(../images/bg.jpg) no-repeat 50% 1040px;height:5600px;z-index:0;-ms-interpolation-mode:nearest-neighbor;image-rendering:-webkit-optimize-contrast;image-rendering:pixelated}
.wraper .header{ width: 100%; height: 1040px; position: relative; overflow: hidden;}
.wraper .header .bgimg{width:1920px;height:100%;background:url(../images/body.jpg) no-repeat;top:0;left:calc(50% - 960px);z-index:2}
.wraper .header .mask{width:1920px;height:100%;background:url(../images/mask.png) no-repeat;top:0;left:calc(50% - 960px);z-index:5}
.wraper .header .npc{width:1920px;height:100%;background:url(../images/npc.png) no-repeat;top:0;left:calc(50% - 960px);z-index:4}
.wraper .header .slogan{width:1920px;height:100%;background:url(../images/slogan.png) no-repeat;top:0;left:calc(50% - 960px);z-index:7}
.wraper .header .logo{position:absolute;width:112px;height:106px;top:20px;left:calc(50% - 58px);text-indent:-999em;background:url(../images/sprite.png) no-repeat 0 0px;z-index:8}
.wraper .header .btn-video{ width: 112px; height: 110px; text-indent:-999em; background:url(../images/btn-video.png) no-repeat; top:676px;left:calc(50% - -130px);z-index:9}
.wraper .section{position:relative;top:1040px; z-index:2;height:5600px}
.wraper .section .main{width:1200px;margin-left:auto;margin-right:auto;position:relative;z-index:2;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;padding-top:0px}
.wraper .section .main .con dt{-webkit-box-sizing:border-box;box-sizing:border-box;position:relative}
.wraper .section .main .con dt:nth-child(1){ height:752px; position: relative;}
.wraper .section .main .con dt:nth-child(1)::before{ content: ""; width: 1263px; height:632px; background:url(../images/c1.png) no-repeat center top; position: absolute; top:0;left:calc(50% - 664px);}
.wraper .section .main .con dt:nth-child(2){background:url(../images/c2.png) no-repeat center top;height:953px; }
.wraper .section .main .con dt:nth-child(2) a{ width: 24px; height: 24px; background: url(../images/c2-s.png) no-repeat;}
.wraper .section .main .con dt:nth-child(2) .btn-1{ top: 514px; left: 977px;}
.wraper .section .main .con dt:nth-child(2) .btn-2{ top: 534px; left: 1012px;}
.wraper .section .main .con dt:nth-child(3){background:url(../images/c3.png) no-repeat center top;height:898px; }
.wraper .section .main .con dt:nth-child(4){background:url(../images/c4.png) no-repeat center top;height:911px;}
.wraper .section .main .con dt:nth-child(5){background:url(../images/c5.png) no-repeat center top;height:810px;}
.wraper .section .main .con dt:nth-child(6){background:url(../images/c6.png) no-repeat center top;height:53px;}
.wraper .section .main .con dt:nth-child(1){width:1202px}
.wraper .section .main .con dt:last-child{background-position:0 0}
.wraper .section .main .con dt:nth-child(3){padding:107px 110px 0 103px;}
.wraper .section .main .con dt:nth-child(3) ul{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-line-pack:justify;align-content:space-between;height:100%;-ms-flex-wrap:wrap;flex-wrap:wrap}
.wraper .section .main .con dt:nth-child(3) ul li{width:410px;height:510px;position:relative}
.wraper .section .main .con dt:nth-child(3) ul li video{-o-object-fit:cover;object-fit:cover;border-bottom-left-radius: 145px;border-top-right-radius: 145px;}
.wraper .section .main .con dt:nth-child(3) ul li::after{display:block;content:"";width:437px;height:527px;position:absolute;pointer-events:none;background:url(../images/c3-mask.png) no-repeat;top:-15px;left:-15px}
.wraper .section .main .con dt:nth-child(4){padding:118px 26px 222px 25px}
.wraper .section .main .con dt:nth-child(4) ul{display:-webkit-box;display:-ms-flexbox;display:flex;height:100%;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-line-pack:start;align-content:start}
.wraper .section .main .con dt:nth-child(4) ul li{width:237px;height:237px;position:relative;margin-bottom:109px}
.wraper .section .main .con dt:nth-child(4) ul li::before{ content: ""; width: 274px; height: 270px; position: absolute; left: -15px; top: -15px; background: url(../images/c4-mask.png) no-repeat;}
.wraper .section .main .con dt:nth-child(4) ul li video{-o-object-fit:cover;object-fit:cover;border-radius:100%}
.wraper .section .main .con dt:nth-child(4) ul li:nth-child(1),.wraper .section .main .con dt:nth-child(4) ul li:nth-child(4){margin-left:0}
.wraper .section .main .con dt:nth-child(4) ul li:nth-child(2),.wraper .section .main .con dt:nth-child(4) ul li:nth-child(5){margin-left:218px;margin-right:218px}
.wraper .section .main .con dt:nth-child(5){padding:133px 142px 200px 140px;}
.wraper .section .main .con dt:nth-child(5) .imgBox{width:916px;height:476px;background:#a76bdb;padding:2px;border-top-right-radius:120px;border-bottom-left-radius:120px; border-top-left-radius:20px;border-bottom-right-radius:20px;}
.wraper .section .main .con dt:nth-child(5) .imgBox li{width:calc(100% - 4px);height:calc(100% - 4px);border-top-right-radius:120px;border-bottom-left-radius:120px;border-top-left-radius:20px;border-bottom-right-radius:20px;overflow:hidden}
.wraper .section .main .con dt:nth-child(5) .imgBox li video{-o-object-fit:cover;object-fit:cover}
.wraper .section .main .con dt:nth-child(5) .imgBox::after{display:block;content:"";width:764px;height:70px;position:absolute;pointer-events:none;background:url(../images/c5-wen.png) no-repeat;left:calc(50% - 382px);top:530px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen1::after{background-position-y:0px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen2::after{background-position-y:-70px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen3::after{background-position-y:-140px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen4::after{background-position-y:-210px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen5::after{background-position-y:-280px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen6::after{background-position-y:-350px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen7::after{background-position-y:-420px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen8::after{background-position-y:-490px}
.wraper .section .main .con dt:nth-child(5) .imgBox#wen9::after{background-position-y:-560px}
.wraper .section .main .con dt:nth-child(5) .pnBtn{width:1230px;left:calc(50% - 598px);top:calc(50% - 65px);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
.wraper .section .main .con dt:nth-child(5) .pnBtn a{display:block;background:url(../images/sprite.png) no-repeat;background-position-y:-110px;width:98px;height:131px;text-indent:-999em}
.wraper .section .main .con dt:nth-child(5) .pnBtn a:nth-child(2){background-position-x:-98px}

.wraper .header .btn-video:hover,.wraper .section .main .con dt:nth-child(5) .pnBtn a:hover,.wraper .section .main .con dt:nth-child(2) a:hover{ filter: brightness(1.1); }
.popdiv{ width:850px; display:none; text-align: center; color: #000; font-size: 16px; }
.popdiv .close{ width:31px; height:31px; background: url(../images/close.png) no-repeat; text-indent: -9999px; position: absolute; top: 0; right: -35px; cursor: pointer;}
.popdiv #video{width: 100%; height: 100%; -o-object-fit:cover; object-fit:cover;}
#popvd{ width:850px; height:480px; background:#000;}
.popdiv.p1{ width: 360px; height: 351px; background: url(../images/pop-1.png) no-repeat;}
.popdiv.p2{ width: 604px; height: 560px; background: url(../images/pop-2.png) no-repeat;}