@charset "utf-8";

.topM {z-index:9999!important;}
/* layout */
/*html, body {margin:0;padding:0;background-color: #fff;min-width:1280px;}*/
/*body{padding-top: 43px;font-size:12px;}*/
#wrap{position:relative;width:100%;overflow:hidden;min-width:1200px;max-width:2560px;margin:40px auto 0;}



.lock {overflow: hidden}
.lock .loading-wrap {width:100%;height:100%;background: #ffb900;position: fixed;top:0;left:0;right:0;bottom:0;z-index:9999;}
.lock .loading-wrap .loading-logo {top:350px;left:50%;margin-left:-94px;width:187px;height:141px;background:url(../images/logo-small.png) no-repeat 0 0}

.loader {
  overflow: hidden;
  font-size: 45px;
  font-family: "Comic Sans MS", sans-serif;
  font-weight: bold;
  color: #fff;
  top:500px;left:0;width:100%;text-align: center;
}
.loader span {
  -moz-animation: loading 1s linear infinite -0.8s;
  -webkit-animation: loading 1s linear infinite -0.8s;
  animation: loading 1s linear infinite -0.8s;
}
.loader .span2 {
  -moz-animation: loading 1s linear infinite -0.2s;
  -webkit-animation: loading 1s linear infinite -0.2s;
  animation: loading 1s linear infinite -0.2s;
}
.loader .span3 {
  -moz-animation: loading 1s linear infinite -0.5s;
  -webkit-animation: loading 1s linear infinite -0.5s;
  animation: loading 1s linear infinite -0.5s;
}
.loader .span4 {
  -moz-animation: loading 1s linear infinite -1.1s;
  -webkit-animation: loading 1s linear infinite -1.1s;
  animation: loading 1s linear infinite -1.1s;
}
.loader .span5 {
  -moz-animation: loading 1s linear infinite -0.36s;
  -webkit-animation: loading 1s linear infinite -0.36s;
  animation: loading 1s linear infinite -0.36s;
}
.loader .span6 {
  -moz-animation: loading 1s linear infinite -0.65s;
  -webkit-animation: loading 1s linear infinite -0.65s;
  animation: loading 1s linear infinite -0.65s;
}
.loader .span7 {
  -moz-animation: loading 1s linear infinite -0.93s;
  -webkit-animation: loading 1s linear infinite -0.93s;
  animation: loading 1s linear infinite -0.93s;
}

@-moz-keyframes loading {
  0%, 100% {
    -moz-transform: scale(1) rotateZ(0deg);
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
  }

  26% {
    -moz-transform: scale(1.1) rotateZ(12deg);
    transform: scale(1.1) rotateZ(12deg);
    opacity: .2;
  }

  76% {
    -moz-transform: scale(0.8) rotateZ(-8deg);
    transform: scale(0.8) rotateZ(-8deg);
    opacity: .6;
  }
}
@-webkit-keyframes loading {
  0%, 100% {
    -webkit-transform: scale(1) rotateZ(0deg);
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
  }

  26% {
    -webkit-transform: scale(1.1) rotateZ(12deg);
    transform: scale(1.1) rotateZ(12deg);
    opacity: .2;
  }

  76% {
    -webkit-transform: scale(0.8) rotateZ(-8deg);
    transform: scale(0.8) rotateZ(-8deg);
    opacity: .6;
  }
}
@keyframes loading {
  0%, 100% {
    -moz-transform: scale(1) rotateZ(0deg);
    -ms-transform: scale(1) rotateZ(0deg);
    -webkit-transform: scale(1) rotateZ(0deg);
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
  }

  26% {
    -moz-transform: scale(1.1) rotateZ(12deg);
    -ms-transform: scale(1.1) rotateZ(12deg);
    -webkit-transform: scale(1.1) rotateZ(12deg);
    transform: scale(1.1) rotateZ(12deg);
    opacity: .2;
  }

  76% {
    -moz-transform: scale(0.8) rotateZ(-8deg);
    -ms-transform: scale(0.8) rotateZ(-8deg);
    -webkit-transform: scale(0.8) rotateZ(-8deg);
    transform: scale(0.8) rotateZ(-8deg);
    opacity: .6;
  }
}

body {background: #fafff9;}

.section {width: 100%; position: relative;}

#section0 {height: 800px; position:relative; margin: 0 auto;}
#section0 .c1 {width: 2560px; height: 800px; margin-left: -1280px; background: url(../images/bg_head.jpg) no-repeat center top; position:absolute; top: 0; left:50%; z-index: 7;}

#section1 {height: 1973px; position:relative;}
#section1 .c1 {width: 2560px; height: 1973px; margin-left: -1280px; background: url(../images/bg_main1.jpg) no-repeat center top; position:absolute; top: 0; left:50%; z-index: 7;}

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar
{
    width: 8px;
    height: 8px;
}
 
/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track
{
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);*/
    /*border-radius: 10px;*/
    background: #000;
}
 
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb
{
    /*border-radius: 10px;*/
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);*/
    background: #fff;
}

.logo {width: 209px;height: 119px;position: absolute;top: 105px;left: calc(50% - 605px/2);border: 0 solid #fff;background: url(../images/logo.png) no-repeat;z-index: 20;transform: scale(.8);}
#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%;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}


/* #video {width: 855px;height: 480px;position: absolute;top: 399px;left: 50%;margin-left: -427px;z-index: 16;} */


.p-slogan {background: url(../images/slogan.png) no-repeat;width: 620px;height: 451px;position: absolute;top: 210px;left: calc(50% - 955px/2);z-index: 16;animation:flipInX .7s .3s ease-in-out forwards;opacity: 0;}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    opacity: 1;
  }
}

/* #snow {position: absolute;width: 2560px;height: 100vh;z-index: 15;top: 0;left: 50%;margin-left: -1280px;} */



/* .nav {overflow: hidden; width: 720px; height: 90px; position: absolute; top: 1021px; left: calc(50% - 720px/2); z-index: 11;}
.nav li {float: left;}
.nav li a {display: block; width: 360px; height: 90px; background: url(../images/btn.png) no-repeat;}
.nav li a.nav-a1 {background-position: 0 0;}
.nav li a.nav-a2 {background-position: -360px 0;}
.nav li a.nav-a1:hover,.nav li a.nav-a1-on {background-position: 0 -90px;}
.nav li a.nav-a2:hover,.nav li a.nav-a2-on {background-position: -360px -90px;} */


.btn_down {
  background: url(../images/btn_down.png) no-repeat;
  width: 51px;
  height: 30px;
  position: absolute;
  top: 850px;
  left: calc(50% - 51px/2);
  animation: eff_up 2s infinite;
  -webkit-animation: eff_up 2s infinite;
}
@keyframes eff_up{0%,100%{transform:translateY(0)}50%{transform:translateY(15px)}}

.pr {position: relative;}
.pa {position: absolute;}
/* #section1 .c1 {} */
#section1 .c1 .vCon {
    width: 1100px;
    height: 561px;
    top: 119px;
    left: calc(50% - 1108px / 2);
}
#section1 .c1 .vBtn {display: block; width: 1100px; height: 561px; background: url(../images/poster-image.jpg) no-repeat; background-size: 1100px 561px; z-index: 16;}
#section1 .c1 .vBtn::after {
  display: block;
  content: '';
  background: url(../images/btn_play.png) no-repeat; animation: sc .8s infinite ease-out;
  width: 1100px; height: 561px;
}
@keyframes sc{0%,100%{-webkit-transform:scale(1);transform:scale(1);-webkit-filter:brightness(1);filter:brightness(1)}50%{-webkit-transform:scale(1.05);transform:scale(1.05);-webkit-filter:brightness(1.1);filter:brightness(1.1)}}
#section1 .c1 video {z-index: 15;}