@charset "utf-8";
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin: 0; padding: 0; }
body, button, input, select, textarea { font: 12px/1.5 Microsoft YaHei, Arial, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
address, cite, dfn, em, var { font-style: normal; }
ul, ol { list-style: none; }
a { text-decoration: none; }
legend { color: #000; }
fieldset, img { border: 0; vertical-align: top; }
section, article, aside, header, footer, nav, dialog, figure { display: block; }
figure { margin: 0; }
button, input, select, textarea { font-size: 100%;border:0;background:none;outline:none; }
table { border-collapse: collapse; border-spacing: 0 }
.clear { display: block; height: 0; overflow: hidden; clear: both }
.clearfix:after { content: '\20'; display: block; height: 0; clear: both; }
.clearfix { *zoom:1;}
a:link, a:visited { text-decoration: none; }
a:hover, a:active { text-decoration: none; }
a { blr:expression_r(this.onFocus=this.blur());}
a { outline: none; /* transition-duration: 0.3s, 0.3s; */ transition-property: background-color, color; transition-timing-function: ease, ease;}
table { border-collapse: collapse; border-spacing: 0; }
.hidden { display: none; }
.invisible { visibility: hidden; }
.noBg { background: none !important; }
.noBd { border: none !important; }
.noMr{margin-right:0 !important; float:right !important;}
.i{text-align: justify; text-justify: inter-ideograph;}

.wrapper{width:100%; margin: 0 auto; overflow:hidden;height: 100%;position: relative;}
body{color: #fff;}
a{color: #fff;}
a:hover{color: #b81f30;}

.header{}
.header .logo{width: 575px;height: 60px;margin: 44px 0 0 54px;float: left;}
.header .nav{float: right;font-size: 18px;margin: 60px 52px 0 0;}
.header .nav li{float: left;margin: 0 30px;}
.header .nav li a{color: #fff;line-height: 40px;height: 40px;display: inline-block;}
.header .nav li a:hover{border-bottom: 1px solid #fff;}
.header .m-nav{width:29px;float:right;margin-right:2%;display: none;}
.header .m-nav em{display:block;width:24px;height:20px;background:url('../images/ico.png');background-size:contain;background-repeat:no-repeat;cursor:pointer;margin: 28px 10px 0 0;}
.header .m-list{width:35%;background-color:rgba(255,255,255,0.9);position:fixed;top:60px;right:-100%;z-index:1000 !important;}
.header .m-list li{height:40px;line-height:40px;border-bottom:1px solid #999;text-align:center;font-size:14px;}
.header .m-list li:last-child{border-bottom:0;}
.header .m-list li a {color: #333;}

.container{}
.container .c-nav {padding: 150px 0 0 54px;}
.container .c-nav li{width: 160px;height: 50px;margin-bottom: 40px;background: rgba(255, 255, 255, 0.15);border-radius: 25px;text-align: center;}
.container .c-nav li a{font-size: 12px;line-height: 50px;color: #fff;}
.container .c-nav li:hover{background: rgba(255, 255, 255, 0.3);}

.qipao{}
.qipao .qp1{animation: moveUp 11s linear infinite;opacity: 0;position: absolute;bottom:0px;left: 65%;z-index: 99;}
.qipao .qp2{animation: moveUp 15s linear infinite;opacity: 0;position: absolute;bottom:20px;left: 10%;z-index: 99;width: 40px;height: 40px;}
.qipao .qp3{animation: moveUp 14s linear infinite;opacity: 0;position: absolute;bottom:0px;left: 45%;z-index: 99;width: 15px;height: 15px;}
.qipao .qp4{animation: moveUp 13s linear infinite;opacity: 0;position: absolute;bottom:50px;left: 50%;z-index: 99;width: 25px;height: 25px;}
.qipao .qp5{animation: moveUp 18s linear infinite;opacity: 0;position: absolute;bottom:0px;left: 30%;z-index: 99;width: 10px;height: 10px;}
.qipao .qp6{animation: moveUp 13s linear infinite;opacity: 0;position: absolute;bottom:20px;left: 85%;z-index: 99;width: 25px;height: 25px;}
.qipao .qp7{animation: moveUp 16s linear infinite;opacity: 0;position: absolute;bottom:0px;left: 60%;z-index: 99;width: 30px;height: 30px;}
.qipao .qp8{animation: moveUp 15s linear infinite;opacity: 0;position: absolute;bottom:100px;left: 25%;z-index: 99;width: 35px;height: 35px;}
.qipao img{width: 100%;height: 100%;}

@keyframes moveUp {
  0% {
    opacity: 0.5;
    transform: translateY(0);
  }
  50% {
    opacity: 1;
    transform: translateY(-500px);
  }
  100% {
    opacity: 0;
    transform: translateY(-1000px);
  }
}
.ing2{display: none;}
.turtle{}
.turtle .tt1{animation: moveRight 22s linear infinite;opacity: 0;position: absolute;bottom:50%;left: 0;z-index: 9;width: 270px}
.turtle .tt2{animation: moveRight 42s linear infinite;opacity: 0;position: absolute;bottom:10%;left: 280px;z-index: 9;width: 220px;animation-delay:8s;
-webkit-animation-delay:8s;} 
.turtle .tt3{animation: moveRight 32s linear infinite;opacity: 0;position: absolute;bottom:45%;left: 400px;z-index: 9;width: 250px;}  
.turtle .tt4{animation: moveRight 29s linear infinite;opacity: 0;position: absolute;bottom:25%;left: 200px;z-index: 9;width: 240px;animation-delay:16s;
-webkit-animation-delay:16s;} 
.turtle .tt5{animation: moveRight 26s linear infinite;opacity: 0;position: absolute;bottom:35%;left: 600px;z-index: 9;width: 90px;} 
.turtle .tt6{animation: moveRight 32s linear infinite;opacity: 0;position: absolute;bottom:45%;left: 150px;z-index: 9;width: 120px;animation-delay:10s;
-webkit-animation-delay:10s;} 
.turtle .tt7{animation: moveRight 36s linear infinite;opacity: 0;position: absolute;bottom:20%;left: 300px;z-index: 9;width: 260px;} 
.turtle img {width: 62%;margin: 12% 0 0 -3%;animation: moveLeg 3s ease-in infinite;}
.turtle .bd{position: relative;background: url('../images/bd.png') no-repeat;background-size: 100% 85%;}
.turtle .bd p{position: absolute;left: 24%;top: 30%;font-size: 14px;}

@keyframes moveRight {
  0% {
    opacity: 0.5;
    transform: translate3d(0, 100px, 0);
  }

  25% {
    opacity: 1;
    transform: translate3d(500px , 180px, 0);
  }
  50% {
    opacity: 1;
    transform: translate3d(1000px, 0px, 0);
  }
  75% {
    transform: translate3d(1500px, 0, 0);
  }
  100% {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes moveLeg {
  0% {
    transform: rotate(3deg);
  }
  50% {
    transform: rotate(-5deg);
  }
  100% {
    transform: rotate(3deg);
  }
}

/* sj */
@media screen and (max-width: 1600px) {
  .header .logo {width: 30%;height: 60px;min-width: 480px;}
  .header .logo img {width: 100%;height: auto;}
  .header .nav{font-size: 16px;margin: 50px 30px 0 0;}
  .header .nav li{margin: 0 15px;}
}

@media screen and (max-width: 812px) {
  .header .logo {width: 70%;height: 60px;min-width: 0;margin: 20px 0 0 10px;}
  .header .nav {display: none;}
  .header .m-nav {display: block;}
  .container .c-nav {padding: 12% 0 0 0;}
  .container .c-nav li{width: 40%;height: 50px;border-radius: 25px;float: left;margin: 0 5% 50px;}
  .wrapper{background: url(../images/bg1.jpg) no-repeat;background-size: 100%;}
  .turtle .tt1{animation: moveRight 11s linear infinite;bottom:30%;left: 0;width: 135px;animation-delay:5s;
-webkit-animation-delay:5s;}
  .turtle .tt2{display: none;} 
  .turtle .tt3{animation: moveRight 20s linear infinite;bottom:15%;left: 20px;width: 125px;}  
  .turtle .tt4{display: none;} 
  .turtle .tt5{display: none;} 
  .turtle .tt6{display: none;} 
  .turtle .tt7{animation: moveRight 15s linear infinite;bottom:5%;left: 50px;width: 130px;animation-delay:8s;
-webkit-animation-delay:12s;} 
  .turtle .bd p{display: none;}
	.viedo1{display: none;}
	.ing2{display: block;}
  @keyframes moveRight {
    0% {
      opacity: 0.5;
      transform: translate3d(0, 10%, 0);
    }

    25% {
      opacity: 1;
      transform: translate3d(100px , 75%, 0);
    }
    50% {
      opacity: 1;
      transform: translate3d(200px, 0px, 0);
    }
    75% {
      transform: translate3d(300px, 0, 0);
    }
    100% {
      opacity: 0;
      transform: translate3d(414px, 0, 0);
    }
  }
}

@media screen and (max-width: 350px) {
  .header .logo {width: 80%;}
  .header .m-nav em{margin: 26px 10px 0 0;}

}