@charset "utf-8";
body,html{position:relative;width:100%;height:100%;background:url(../img/allbg.jpg);background-size: cover;}
.centerwrap{ width:84%; min-width:1200px;  margin:0 auto;}
.hide400{display:block!important;}
.show400{display:none!important;}
.hcenter{position:absolute;top:50%;left:0;width:100%;transform:translateY(-50%);}
.myerr1{font-size: 4vw;
    color: #fff;
    text-align: center;}
/* frame */
#mainwrap{z-index:60;position:fixed;top:0;left:0;width:100%;height:100%;background:#000;}
.mainwrap{z-index:98;position:fixed;top:0;left:0;width:100%;height:100%;background:#000;}
#popwrap{z-index:99;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.2);text-align:center;}

/*popwrap*/
#popwrap iframe{z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;}
.videocover{z-index:9;position:absolute;top:0;left:0;width:100%;height:100%;}
#popwrapin{z-index:2;position:absolute;top:0;left:50%;transform:translateX(-50%);max-width:1600px;width:100%;margin:0 auto;height:100%;overflow:hidden;background:rgba(0,0,0,0.7);}
#popwrapcontent{position:relative;z-index:1;height:100%;overflow:auto;}
#popwrapcontent img{max-width:100%;}
#popwrapcontent .videocover{z-index:9;position:absolute;top:0;left:0;width:100%;height:100%;}
#popwrapcontent iframe{z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;}
#popbg{z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;}
#popclose{position:absolute;z-index:9;top:0;right:0;width:4vw;height:4vw;background:rgba(255,255,255,0.6);box-shadow: 0 0 0.3vw 0.3vw rgba(55,55,55,0.1);}
#popclose i{font-size:3vw;line-height:4vw;color:#000;}
#popleft{position:absolute;z-index:8;top:calc(50% - 2vw);left:0;height:4vw;width:6vw;text-align:center;background:rgba(255,255,255,0.6);box-shadow: 0 0 0.3vw 0.3vw rgba(55,55,55,0.1);}
#popleft i{font-size:4vw;line-height:4vw;color:#000;}
#popright{position:absolute;z-index:8;top:calc(50% - 2vw);right:0;height:4vw;width:6vw;text-align:center;background:rgba(255,255,255,0.6);box-shadow: 0 0 0.3vw 0.3vw rgba(55,55,55,0.1);}
#popright i{font-size:4vw;line-height:4vw;color:#000;}


#newpopwrap{z-index:98;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);text-align:center;}

/*newpopwrap*/
#newpopwrap iframe{z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;}
#newpopwrap .videocover{z-index:9;position:absolute;top:0;left:0;width:100%;height:100%;}
#newpopwrapin{z-index:2;position:absolute;top:0;left:50%;transform:translateX(-50%);max-width:1600px;width:100%;margin:0 auto;height:100%;overflow:hidden;background:rgba(0,0,0,0.7);}
#newpopwrapcontent{position:relative;z-index:1;height:100%;overflow:auto;}
#newpopwrapcontent img{max-width:100%;}
#newpopwrapcontent .videocover{z-index:9;position:absolute;top:0;left:0;width:100%;height:100%;}
#newpopwrapcontent iframe{z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;}
#newpopbg{z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;}
#newpopclose{position:absolute;z-index:9;top:0;right:0;width:4vw;height:4vw;background:rgba(255,255,255,0.6);box-shadow: 0 0 0.3vw 0.3vw rgba(55,55,55,0.1);}
#newpopclose i{font-size:3vw;line-height:4vw;color:#000;}
#newpopleft{position:absolute;z-index:8;top:calc(50% - 2vw);left:0;height:4vw;width:6vw;text-align:center;background:rgba(255,255,255,0.6);box-shadow: 0 0 0.3vw 0.3vw rgba(55,55,55,0.1);}
#newpopleft i{font-size:4vw;line-height:4vw;color:#000;}
#newpopright{position:absolute;z-index:8;top:calc(50% - 2vw);right:0;height:4vw;width:6vw;text-align:center;background:rgba(255,255,255,0.6);box-shadow: 0 0 0.3vw 0.3vw rgba(55,55,55,0.1);}
#newpopright i{font-size:4vw;line-height:4vw;color:#000;}
#newpopclose{position:absolute;z-index:99;top:0;right:0;width:4vw;height:4vw;background:rgba(255,255,255,0.6);box-shadow: 0 0 0.3vw 0.3vw rgba(55,55,55,0.1);}
#newpopclose i{font-size:3vw;line-height:4vw;color:#000;}

#pagewrap{position:absolute;top:50%;left:0;width:100%;transform:translateY(-50%);}
#pagewrap .bgimg{position:relative;width:100%;z-index:1;}
.pagewrap1{position:absolute;top:50%;left:0;width:100%;transform:translateY(-50%);z-index: 97;z-index:1;}
.pagewrap1 .bgimg{position:relative;width:100%;z-index: 97;overflow:hidden;}
#indextopcenter{position:absolute;z-index:3;top:23.70%;left:37.24%;width:25.40%;height:22.31%;background:#000;overflow:hidden;}
#indextopcenter.on{box-shadow: 0 0 1vw 1vw rgba(200,230,255,0.5);}
#indextopleft{position:absolute;z-index:2;top:29.16%;left:20.31%;width:13.4%;height:14.4%;background:#000;overflow:hidden;}
#indextopright{position:absolute;z-index:2;top:29.16%;left:66.3%;width:13.4%;height:14.4%;background:#000;overflow:hidden;}
#indexbottomleft{position:absolute;z-index:2;top:51.02%;left:21.01%;width:12.7%;height:16.57%;background:#000;overflow:hidden;}
#indexbottomright{position:absolute;z-index:2;top:51.02%;left:66.3%;width:13.4%;height:16.57%;background:#000;overflow:hidden;}
#indexcenterlight{position:absolute;z-index:2;top:46.3%;left:37.24%;width:25.40%;height:4.8%;background:rgba(0,0,0,0.7);overflow:hidden;}

.w100 img{width:100%;}
#indextopcenter.w100 img{position:relative;width:100%;z-index:1;}
#indextopcenter.w100 img.blink{position:absolute;width:20%;z-index:9;top:23%;left:8%;width:6vw;border-radius:3vw;overflow:hidden;animation: blinkme 5s 2s infinite;}
@keyframes blinkme {
  15%{
    box-shadow: 0 0 0.5vw 0.5vw rgba(200,200,255,0.7);
  }
  30%{
    box-shadow: 0 0 0.5vw 0.5vw rgba(200,200,255,0);
  }
  45%{
    box-shadow: 0 0 0.5vw 0.5vw rgba(200,200,255,0.7);
  }
  60%{
    box-shadow: 0 0 0.5vw 0.5vw rgba(200,200,255,0);
  }
  75%{
    box-shadow: 0 0 0.5vw 0.5vw rgba(200,200,255,0.7);
  }
  90%{
    box-shadow: 0 0 0.5vw 0.5vw rgba(200,200,255,0);
  }
}

.w100 video{position:absolute;top:0;left:0;width:100%;height:100%;}
/*跑馬燈*/
.lightcover{position:absolute;z-index:2;top:0;left:0;width:100%;height:100%;background:url(../img/dotbg100.png) repeat;opacity:0.3;}
.lighttxt{position:relative;margin:0 2%;width:calc(100% - 4%);height:100%;overflow:hidden;}
.lighttxtin{position:absolute;top:0;left:0;height:100%;width:auto;font-size:1.2vw;line-height:2vw;color:#fff;font-weight:bold;}
/* centerbanner */

/*topbanner*/
.topbannerwrap{position:absolute;top:0;left:0;height:100%;width:100%;}
.topbannerwrap img{position:absolute;left:0;top:100%;width:100%;opacity:0;transition: all 0.5s;}
.topbannerwrap img.on{opacity:1;top:0;}
/*leftbanner*/
.leftbannerwrap{position:absolute;top:0;left:0;height:100%;width:100%;}
.leftbannerwrap img{position:absolute;left:0;top:0;width:100%;opacity:0;z-index:1;transition: all 0.7s;}
.leftbannerwrap img.on{opacity:1;z-index:2;}
/* btnwrap */

footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 2vw 0 !important;
    z-index: 70;
    text-align: center;
    background: rgba(255,255,255,0.5);
}
footer .txt{position:absolute;right:5vw;bottom:2vw;font-size:1.2vw;line-height:2vw;color:#000;}
footer .txt1{position:absolute;right:2vw;bottom:1vw;font-size:1vw;line-height:2vw;color:#000;
    width: 8%;
}
footer img{width:15%;margin: 0 3vw;}

@media (max-aspect-ratio: 1920/1080) {
  #pagewrap{top:0;left:50%;width:auto;height:100%;transform:translateX(-50%);}
  #pagewrap .bgimg{position:relative;width:auto;height:100%;z-index:1;}
  .pagewrap1{top:0;left:50%;width:auto;height:100%;transform:translateX(-50%);z-index:97;}
  .pagewrap1 .bgimg{position:relative;width:auto;height:100%;z-index:97;overflow:hidden;}
  #popclose{position:absolute;z-index:9;top:0;right:0;width:6vw;height:6vw;background:#fff;box-shadow: 0 0 0.5vw 0.5vw rgba(55,55,55,0.2);}

}

/* footer */
#overno{z-index:102;position:fixed;top:0;left:0;width:100%;height:100%;background:#344556;display:none;}
#overno .txt{position:absolute;top:50%;left:0;width:100%;transform:translateY(-50%);font-size:10vw;color:#fff;text-align:center;}
#loading{z-index:101;position:fixed;top:0;left:0;width:100%;height:100%;background:#344556;text-align:center;}
#loading .txt{position:absolute;top:50%;left:0;width:100%;transform:translateY(-50%);font-size:2vw;color:#fff;}
#overyes{z-index:100;position:fixed;top:0;left:0;width:100%;height:100%;c;text-align:center;}
#overyes #yesbtn{position:absolute;top:50%;left:calc(50% - 10vw);;width:100%;transform:translateY(-50%);font-size:2vw;color:#222;background:#fff;width:20vw;padding:1vw 0;text-align:center;}
@media screen and (max-width: 1200px) {
  footer{padding-bottom:2vw 0;}
  footer img{width:20%;margin: 0 2vw;}
  #overno{display:block;}
}
@media only screen and (orientation: landscape) and (max-width: 1199px) {
  #overno{display:none;}
}