﻿/* CSS reset@ */
@font-face {
	font-family:fz;
	src: url('../fonts/FE08015T.TTF');
}
/** { touch-action: none; }*/
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,a{padding:0;margin:0;}
table {border-collapse: collapse;border-spacing:0;}
del, ins {text-decoration:none;}
fieldset, img {border:0;}.unLock{ overflow:hidden;}
body{ overflow-x:hidden; position:relative;}
body,button,textarea{font:14px/1.6  "SF Pro Display","SF Pro Icons","PingFangSC-Regular","Arial","Helvetica",sans-serif;;  color:#333;-webkit-text-size-adjust: none; font-weight:400;}
input,select{font:14px/1.6  "SF Pro Display","SF Pro Icons","PingFangSC-Regular","Arial","Helvetica",sans-serif;; color:#333;}
input,select,img{vertical-align:middle;}
img{ max-width:100%; height:auto; width:100%;}
input,select,textarea{outline:none;-webkit-appearance: none;background: transparent;  border: none;}
input:focus, select:focus,textarea:focus{outline:none;-webkit-appearance: none;}
select{height:22px;line-height:18px;padding:2px;}
ul,ol{list-style:none;}
h1, h2, h3, h4, h5, h6 {font-size:14px; font-weight:normal;}
address,cite,dfn,em,var{font-style:normal;}
legend{display:none;}
/*td{font-size:14px;line-height:140%;}*/
label{margin:0;cursor:pointer;}
input::-moz-focus-inner,button::-moz-focus-inner{border:0;padding:0;}
.left{float:left;}
.right{float:right;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
a{color:#333;text-decoration:none; -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s;}
a:hover{text-decoration:none;}
i{ font-style:normal;}
.txthide{text-indent:-999em;overflow:hidden;line-height:0;font-size:0}
.clearfix:after{content:"";height:0;visibility:hidden;display:block;clear:both;}
.clearfix{zoom:1;}
.clear{clear:both;height:0;overflow:hidden;}
*, *:after, *:before{ padding:0;margin:0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;box-sizing: border-box;}
.flex-centerbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.fr{ float:right;}.fl{ float:left;}
.pc{display: block;}
.mobile{display: none;}
@media(max-width: 768px){
.pc{display: none;}
.mobile{display: block;}
}
.header{ width:100%; height:80px;  position: fixed; z-index:9999; background: rgba(0,0,0,1);}
.header-menu{ width:100%; height:80px; line-height:80px; position:relative;}
.header-menu .logo img{ width:15%; position:absolute; top:24px; left:49px;}
.header-nav{ float: right; margin-right: 10%; }
.header-nav ul li{ float:left;}
.header-nav ul li a{ font-size:15px; color:#fff; padding:0 22px; display:block;}
@media(max-width: 1600px){.header-nav ul li a{padding:0 18px;}
}
@media(max-width: 1600px){.header-nav ul li a{padding:0 16px;}
}
@media(max-width: 1440px){.header-nav ul li a{padding:0 12px;}
}
@media(max-width: 1200px){.header-nav ul li a{padding:0 8px;}
}
.header-car{width:3%; height:40px; line-height: 40px;  position:absolute; top:20px; right:6%;}
.header-car img{width:auto;}
.header-en{ width:3%; height:40px; line-height: 40px;  position:absolute; top:20px; right:3%; border-left:2px solid rgba(255,255,255,0.8);}
.header-en a{ color:rgba(255,255,255,0.8); text-align:center; display:block;}
.header .header-search{ width: 10%; overflow: hidden;float: right; font-size: 12px; color: #adabab; position: absolute;left: 20%;top: 24px;}
.header .header-search .tint{ width:80%; height:30px; font:14px "Microsoft YaHei"; background:#f6f6f5; color:#333; line-height:37px; padding-left:14px; float:left; border:1px solid #fff; border-right:0;-webkit-appearance: none;border-radius: 5px 0 0 5px;}
.header .header-search .bint{ width:20%; height:30px; background:#fff url(../images/icon-search.png) no-repeat center center; background-size:20px; font:14px "Microsoft YaHei"; color:#adabaa; border:none; cursor:pointer;float:right; border-radius:0 5px 5px 0;}


ul.nav {display: inline-flex;flex: 1;padding-left:50px;}
li.nav-item {flex: 1;}
li.nav-item>a{display: block;text-align: center;line-height: 80px;font-size: 16px;position: relative;}
li.nav-item>a::before{ display: none; content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); border-width: 0 40px 3px; border-style: solid;  position: absolute;}
li.nav-item:hover>a ,li.nav-item.active>a{color: #ffe400;}
li.nav-item:hover>a::before,li.nav-item.active>a::before{display: block;}
/* äºŒçº§èœå• */
.subMenu{display: none;position: absolute;top: 90px;left: 0;width: 100%; height: 50px;background: url(../images/menubg.jpg) no-repeat center center; z-index: 999;}
.subMenu>ul{display: flex;flex-wrap: wrap;flex-direction: row;justify-content: center;align-items: center;}
.subMenu>ul>li>a{display:block;padding:0 18px;text-align: center;line-height: 50px;color: #000; font-size: 16px;}
.subMenu>ul>li>a:hover{color:red}


.prosubMenu{display: none;position: absolute;top: 80px;right: 0;width: 65%; height: 600px;background: #000; z-index: 999; padding-top: 50px;}
/*.prosubMenu>ul{display: flex;flex-wrap: wrap;flex-direction: row;justify-content: center; width: 80%; max-width: 1340px; margin: 20px auto;}*/
.prosubMenu>ul>li{width:48%; margin-right:2%; float:left; margin-bottom: 20px;}
/*.prosubMenu>ul>li:last-child{margin-right: 0px;}*/
.prosubMenu>ul>li strong{display: table; line-height:30px !important;  border-bottom: 2px solid #e9ca1d; margin-bottom: 20px; width: 90%;}
.prosubMenu>ul>li strong a{color: #fff; line-height: 30px; text-align: left; font-size: 16px;padding: 0px;}
.prosubMenu>ul>li>a{display:block;text-align: left;line-height: 28px;color: #fff; font-size: 14px; padding: 0px;}
.prosubMenu>ul>li>a:hover{color:ffe400}
.menuleft{width: 60%; margin: 0 5%; float: left;}
.menuright{width: 20%;float: left;}
.prosubMenu.menuright>li{width: 100%; float: left;}


.breadmenu{width: 100%; background: #e8e8e8; height: 60px; padding: 22px 0;}
.breadmenu .container{width: 88%; margin:0 auto; font-size:16px; color:#333; height: 16px; line-height: 16px;}
.breadmenu .container .bigname{float:left;}
.breadmenu .container .line{width: 60px; height: 2px; background: #cf001c; margin:10px 0px 10px 40px; float:left;}
.breadmenu .container .smallname{float:left;}
.breadmenu .container .smallname a{border-right:2px solid #999;  padding:0 40px; float:left; font-weight: bold;}
.breadmenu .container .smallname a:hover,.breadmenu .container .smallname a.cur{color:#cf001c;}
.breadmenu .container .smallname a:last-child{border-right:0px;}

/*分页*/
.pager{margin:0 auto; position: relative; text-align: center; padding-bottom: 40px;}
.pager li{list-style:none;  padding: 0 10px; border-radius: 5px; font-size: 14px; color: #333; line-height: 40px; text-align: center; display: inline-block; font-weight: 500; margin-right: 12px;
    transition: all ease 300ms;
    -moz-transition: all ease 300ms;
    -webkit-transition: all ease 300ms;
    -ms-transition: all ease 300ms;
    -o-transition: all ease 300ms;
}
.pager li a{height: 40px; min-width: 40px;display: inline-block;}
.pager a:hover, .pager .active a{
   height: 40px; min-width: 40px;
    background: #000;
    color: #FFF;
    display: inline-block;
}
.pager a:last-child{
    margin-right: 0;
}

.pager .pagenum{display: inline-block; margin-right: 10px;}


.footer{ width:100%; background:#000000; color:#fff; min-height:auto !important; height:auto !important;}

.footer .footer-content{ overflow:hidden; padding: 20px 5%;}
.footer .footer-content h3{font-size: 18px; color:#fff; text-align: left; text-transform: uppercase; margin-bottom: 10px}
.footer .footerBox1{ float:left; width:24%; margin:50px 2% 0px 0; height: 80px; }
.footer .footerBox1 img{width: 100%;}
.footer .footerBox{padding:30px 0 30px 200px; display: table;}
/*.footer .footerBox ul li { text-align:left; width: 30%; margin-right: 5%; float:left;}
.footer .footerBox ul li:nth-child(3n+3){margin-right: 0px;}
.footer .footerBox ul li a{ font-size:16px; color:rgba(255,255,255,0.6); height:48px; line-height:48px; text-transform:uppercase;}
.footer .footerBox ul li a:hover{ font-size:18px; color:#2c88d8; font-weight:bold;}*/
.footer .footerBox2{ float:left; width:calc( 28% - 4px);   padding:10px 2% 0; border-right:2px solid #fff;border-left:2px solid #fff; height: 140px;}
.footer .footer-nav{  }
.footer .footer-nav .qq{ float:right;}
.footer .footer-nav .qq .iconfont{ font-size:20px; line-height:42px; color:#b5b5b9;}
.footer .footer-nav .qq .iconfont:hover{ color:#2c88d8;}
.footer .footer-nav ul li{ float:left; width: 25%; text-align: left;}
.footer .footer-nav ul li a{ height:30px; line-height:30px;   display:block; color:rgba(255,255,255,0.6);}
.footer .footer-nav ul li a:hover{ color:#ffe400;}

.footer .footerBox4{width: calc(19% - 2px); float:left; padding: 10px 2% 0; border-right:2px solid #fff; height: 140px; }

.footer .footer-logo{ text-align:center;}
.footer .footer-search{ width:709px; overflow:hidden; margin:60px auto 30px; font-size:12px; color:#adabab;}
.footer .footer-search .tint{ width:642px; height:39px; font:14px "Microsoft YaHei"; background:#f6f6f5; color:#adabaa; line-height:37px; padding-left:14px; float:left; border:1px solid #fff; border-right:0;-webkit-appearance: none;}
.footer .footer-search .bint{ width:67px; height:39px; background:#fff url(../images/icon-search.png) no-repeat center center; background-size:25px; font:14px "Microsoft YaHei"; color:#adabaa; border:none; cursor:pointer;float:right;}
.footer .footer-intro{ font-size:12px; color:#adabab; padding:0 0 35px; text-align:center; text-transform:uppercase;}
.footer .footer-intro a{ color:#adabab;}
.footer .footer-intro a:hover{ color:#2c88d8;}

.footer .footerBox3{ float:left; width:25%; padding:10px 0 0px 2%; height: 140px;}
.footer .footerBox3 h3{ margin-bottom:13px;}
.footer .footer-contactTitle{ font-size:20px; color:#fff; text-transform:uppercase;}
.footer .footer-contactTitle span{font-size: 50px; font-weight: bold; width: 100%;}
/*.footer .code{width: 100%;}
.footer .code ul{margin:0px; padding: 0px;}
.footer .code ul li{width: 48%; margin-right: 4%; float:left;}
.footer .code ul li:nth-child(2){margin-right: 0px;}
.footer .code ul li img{max-width: 94%; padding: 3%; border:1px solid #fff; float:left; width: 100%;}
.footer .code ul li span{width: 100%; text-align: center; float:left; display: table; color:#fff;}*/
.footer .contact{line-height:1.4; color:#fff; float:left; width: 100%; display: table;margin-bottom: 5px;}
.footer .email a{ color:#fff;}
.footer .email a:hover{ color:#ffdc00;}
.footer .qqdiv a{width: 40px; height: 40px; float: left; display: table; border: 2px solid #ffdc00; border-radius: 50px; margin:0 10px 10px 0; padding: 5px; color:#ffdc00; text-align:center;}
.footer .qqdiv a:hover{color:#fff; border: 2px solid #fff;}
.footer .qqdiv a img{width:30px; height: 30px;  }
/*.footer .footerBox3 ul li{ overflow:hidden; line-height:22px; margin-bottom:15px;}
.footer .footerBox3 ul li span{ float:left; width: 30%; width:40px; font-size:20px;}
.footer .footerBox3 ul li span.icon-Fax{ font-size:26px;}
.footer .footerBox3 ul li p{ float:left; width: 70%;}*/

.footer .footer-copyright{ font-size:12px; color:#eeedec; background:#221f1f; padding:12px 60px; line-height:24px; overflow:hidden; text-align:center; border-top:1px solid rgba(255,255,255,0.6);}
.footer .footer-copyright a{ font-size:12px; color:#eeedec;}
.footer .footer-copyright a:hover{ color:#fff;}

.right_side{ position: absolute; right: 0; top: 35%; width: 70px; height: 245px; z-index: 80000; }
.right_side ul{}
.right_side ul li{ width: 70px; padding:5px 10px 10px 10px; text-align: center; background: #000;cursor: pointer; position:relative;-webkit-transition:  background 0.5s ease-out ; -moz-transform:background 0.5s ease-out; transition: background 0.5s ease-out ; font-size: 12px;}
.right_side ul li:hover{ background:#333; }
.right_side ul li a{color:#fff;}
.right_side ul li:first-child{ border-top-left-radius:20px;}
.right_side .iconfont{ color:#ffdd00; font-size:32px;}
.right_side ul li:hover .iconfont{ color:#fff;}

.right_side ul li.qq{}
.right_side ul li.qq div{ display: none; background-color: #f9f9f9; position: absolute; top:0px; right: 70px; width: 180px; height: 70px;  overflow: hidden; -moz-box-shadow:-7px 0px 10px rgba(0,0,0,0.2); -webkit-box-shadow:-7px 0px 10px rgba(0,0,0,0.2); box-shadow:-7px 0px 10px rgba(0,0,0,0.2); color:#000; font-size: 20px; line-height: 70px;}
.right_side ul li.qq div dt{ text-align: center; height: 60px; line-height: 60px; background-color: #ffffff; }
.right_side ul li.qq div dd{height: 60px; line-height: 60px; color: #666666; margin: 0 auto; width: 160px; font-size: 16px; text-indent: 80px; background: url(../images/qqbg.gif) no-repeat 30px 17px;}
.right_side ul li.qq div dd a{ display: block;}
.right_side ul li.qq div dd a:hover{ color: #556c9c;}

.right_side ul li.tel{ background-position: center -44px; }
.right_side ul li.tel div{ display: none; border-bottom-left-radius: 5px; border-top-left-radius: 5px;  position: absolute;  right: 60px;-moz-box-shadow:-7px 0px 10px rgba(0,0,0,0.3); -webkit-box-shadow:-7px 0px 10px rgba(0,0,0,0.3); box-shadow:-7px 0px 10px rgba(0,0,0,0.3); height: 60px; line-height: 60px; padding: 0 20px; font-size: 24px; font-weight: bold; color: #005db6; background-color: #fff; white-space: nowrap }
.right_side ul li.wx{  }
.right_side ul li.wx div{ border-radius: 5px; display: none; position: absolute; top: -45px; right: 70px;-moz-box-shadow:-7px 0px 10px rgba(0,0,0,0.3); -webkit-box-shadow:-7px 0px 10px rgba(0,0,0,0.3); box-shadow:-7px 0px 10px rgba(0,0,0,0.3); overflow: hidden; }
.right_side ul li.topback{ background-position: center -166px; border: none; border-bottom-left-radius: 5px; }
.right_side ul li:hover div{ display: block;}
.right_side ul li.qq:hover{ border-radius: 0;}
.right_side ul li img{ max-width:none; width:auto;}
.right_side #returnTop{ width:70px; height:40px; display:block; padding: 0px;}

.izl-rmenu{position:fixed; right:0; margin-right:20px; bottom:20px; padding-bottom:20px; z-index:999;
 _position:absolute; 
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
 /* for IE6 */ overflow:visible;}
.izl-rmenu .btn{width:51px; height:51px; margin-bottom:9px; cursor:pointer; position:relative;}

.izl-rmenu .btn-top{font-family:Arial, Helvetica, sans-serif; width:45px;height:40px;padding:5px 0 0;line-height:40px;text-align:center;background-image:url(../images/ico_top.png);background-position:center 9px;background-repeat:no-repeat;background-color:#2e84eb;color:#fff;font-size:14px;font-weight:bold;cursor:pointer; display:none;filter:alpha(opacity=30); -moz-opacity:0.3; -khtml-opacity: 0.8; opacity: 0.3;}
.izl-rmenu .btn-top:hover{filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity:1; opacity:1;}

@font-face {
  font-family: 'iconfont';
  src: url('../font/iconfont.eot');
  src: url('../font/iconfont.eot?#iefix') format('embedded-opentype'),
      url('../font/iconfont.woff2') format('woff2'),
      url('../font/iconfont.woff') format('woff'),
      url('../font/iconfont.ttf') format('truetype'),
      url('../font/iconfont.svg#iconfont') format('svg');
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-search:before {
  content: "\e671";
}

.icon-email:before {
  content: "\e602";
}

.icon-qq:before {
  content: "\e604";
}

.icon-tel:before {
  content: "\e642";
}

.icon-Fax:before {
  content: "\e605";
}

.icon-iPhone:before {
  content: "\e68e";
}

.icon-address:before {
  content: "\e607";
}


@charset "utf-8";

/*  css animation  */
.trans{
/*    -webkit-transition: all .4s ease-in;
    -moz-transition:all .4s ease-in;
    -o-transition:all .4s ease-in;
    -ms-transition:all .4s ease-in;
    transition:all .4s ease-in;*/
}

@media (min-width:325px){
  /* page animation  */
  .ani-view {
      opacity: 0;
      opacity: 1\9;
      opacity: 1\0/;
      opacity: 1\0/;
  }
  @-webkit-keyframes fadeInDown{
      0% {
          opacity:0;
          -webkit-transform:translateY(40px)
      }
      100% {
          opacity:1;
          -webkit-transform:translateY(0)
      }
  }
  @-moz-keyframes fadeInDown{
      0% {
          opacity:0;
          -moz-transform:translateY(40px)
      }
      100% {
          opacity:1;
          -moz-transform:translateY(0)
      }
  }
  @-o-keyframes fadeInDown {
      0% {
          opacity:0;
          -o-transform:translateY(40px)
      }
      100% {
          opacity:1;
          -o-transform:translateY(0)
      }
  }
  @keyframes fadeInDown {
      0% {
          opacity:0;
          transform:translateY(40px)
      }
      100% {
          opacity:1;
          transform:translateY(0)
      }
  }

  .ani-view.fade-in-down{
      opacity:0;
      opacity: 1\9;
      opacity: 1\0/;
      -webkit-transform:translateY(40px);
      -moz-transform:translateY(40px);
      -o-transform:translateY(40px);
      transform:translateY(40px);
  }
  .ani-view.fadeInDown{
      -webkit-animation:fadeInDown 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -moz-animation:fadeInDown 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -o-animation:fadeInDown 1s cubic-bezier(.25,.74,.22,.99) forwards;
      animation:fadeInDown 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -webkit-animation-delay:0.1s; 
      -moz-animation-delay:0.1s;
      -o-animation-delay:0.1s;
      animation-delay:0.1s;
  }


  @-webkit-keyframes fadeInLeft {
      0% {
          opacity:0;
          -webkit-transform:translateX(-100px)
      }
      100% {
          opacity:1;
          -webkit-transform:translateX(0)
      }
  }
  @-moz-keyframes fadeInLeft {
      0% {
          opacity:0;
          -moz-transform:translateX(-100px)
      }
      100% {
          opacity:1;
          -moz-transform:translateX(0)
      }
  }
  @-o-keyframes fadeInLeft {
      0% {
      opacity:0;
      -o-transform:translateX(-100px)
      }
      100% {
      opacity:1;
      -o-transform:translateX(0)
      }
  }
  @keyframes fadeInLeft {
      0% {
      opacity:0;
      transform:translateX(-100px)
      }
      100% {
      opacity:1;
      transform:translateX(0)
      }
  }
  .ani-view.fade-in-left{
      opacity:0;
      opacity: 1\9;
      opacity: 1\0/;
      -webkit-transform:translateX(-100px);
      -moz-transform:translateX(-100px);
      -o-transform:translateX(-100px);
      transform:translateX(-100px);
  }
  .ani-view.fadeInLeft {
      -webkit-animation:fadeInLeft 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -moz-animation:fadeInLeft 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -o-animation:fadeInLeft 1s cubic-bezier(.25,.74,.22,.99) forwards;
      animation:fadeInLeft 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -webkit-animation-delay:0.1s; 
      -moz-animation-delay:0.1s;
      -o-animation-delay:0.1s;
      animation-delay:0.1s;
  }

  @-webkit-keyframes fadeInRight {
      0% {
      opacity:0;
      -webkit-transform:translateX(100px)
      }
      100% {
      opacity:1;
      -webkit-transform:translateX(0)
      }
  }
  @-moz-keyframes fadeInRight {
      0% {
      opacity:0;
      -moz-transform:translateX(100px)
      }
      100% {
      opacity:1;
      -moz-transform:translateX(0)
      }
  }
  @-ms-keyframes fadeInRight {
      0% {
      opacity:0;
      -ms-transform:translateX(100px)
      }
      100% {
      opacity:1;
      -ms-transform:translateX(0)
      }
  }
  @-o-keyframes fadeInRight {
      0% {
      opacity:0;
      -o-transform:translateX(100px)
      }
      100% {
      opacity:1;
      -o-transform:translateX(0)
      }
  }
  @keyframes fadeInRight {
      0% {
      opacity:0;
      transform:translateX(100px)
      }
      100% {
      opacity:1;
      transform:translateX(0)
      }
  }
  .ani-view.fade-in-right{
      opacity:0;
      opacity: 1\9;
      opacity: 1\0/;
      -webkit-transform:translateX(100px);
      -moz-transform:translateX(100px);
      -o-transform:translateX(100px);
      transform:translateX(100px);
  }
  .ani-view.fadeInRight {
      -webkit-animation:fadeInRight 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -moz-animation:fadeInRight 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -o-animation:fadeInRight 1s cubic-bezier(.25,.74,.22,.99) forwards;
      animation:fadeInRight 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -webkit-animation-delay:0.1s; 
      -moz-animation-delay:0.1s;
      -o-animation-delay:0.1s;
      animation-delay:0.1s;
  }
  .ani-view.ani_delay2{
    -webkit-animation-delay:0.2s; 
    -moz-animation-delay:0.2s;
    -o-animation-delay:0.2s;
    animation-delay:0.2s;
  }
  .ani-view.ani_delay3{
    -webkit-animation-delay:0.3s; 
    -moz-animation-delay:0.3s;
    -o-animation-delay:0.3s;
    animation-delay:0.3s;
  }
  .ani-view.ani_delay4{
    -webkit-animation-delay:0.4s; 
    -moz-animation-delay:0.4s;
    -o-animation-delay:0.4s;
    animation-delay:0.4s;
  }
  .ani-view.ani_delay5{
    -webkit-animation-delay:0.5s; 
    -moz-animation-delay:0.5s;
    -o-animation-delay:0.5s;
    animation-delay:0.5s;
  }
  .ani-view.ani_delay6{
    -webkit-animation-delay:0.6s; 
    -moz-animation-delay:0.6s;
    -o-animation-delay:0.6s;
    animation-delay:0.6s;
  }
  .ani-view.ani_delay7{
    -webkit-animation-delay:0.7s; 
    -moz-animation-delay:0.7s;
    -o-animation-delay:0.7s;
    animation-delay:0.7s;
  }
  .ani-view.ani_delay8{
    -webkit-animation-delay:0.8s; 
    -moz-animation-delay:0.8s; 
    -o-animation-delay:0.8s; 
    animation-delay:0.8s; 
  }
  .ani-view.ani_delay9{
    -webkit-animation-delay:0.9s; 
    -moz-animation-delay:0.9s;
    -o-animation-delay:0.9s;
    animation-delay:0.9s;
  }
  .ani-view.ani_delay10{
    -webkit-animation-delay:1s; 
    -moz-animation-delay:1s;
    -o-animation-delay:1s;
    animation-delay:1s;
  }
  .ani-view.ani_delay11{
    -webkit-animation-delay:1.1s; 
    -moz-animation-delay:1.1s; 
    -o-animation-delay:1.1s; 
    animation-delay:1.1s; 
  }
  .ani-view.ani_delay12{
    -webkit-animation-delay:1.2s; 
    -moz-animation-delay:1.2s; 
    -o-animation-delay:1.2s; 
    animation-delay:1.2s; 
  }
  .ani-view.ani_delay13{
    -webkit-animation-delay:1.3s; 
    -moz-animation-delay:1.3s;  
    -o-animation-delay:1.3s;  
    animation-delay:1.3s;  
  }
  .ani-view.ani_delay14{
    -webkit-animation-delay:1.4s; 
    -moz-animation-delay:1.4s; 
    -o-animation-delay:1.4s; 
    animation-delay:1.4s; 
  }
  .ani-view.ani_delay15{
    -webkit-animation-delay:1.5s; 
    -moz-animation-delay:1.5s;  
    -o-animation-delay:1.5s;  
    animation-delay:1.5s;  
  }
  .ani-view.ani_delay16{
    -webkit-animation-delay:1.6s; 
    -moz-animation-delay:1.6s;
    -o-animation-delay:1.6s;
    animation-delay:1.6s;
  }
  .ani-view.ani_delay17{
    -webkit-animation-delay:1.7s; 
    -moz-animation-delay:1.7s; 
    -o-animation-delay:1.7s; 
    animation-delay:1.7s; 
  }
  .ani-view.ani_delay18{
    -webkit-animation-delay:1.8s; 
    -moz-animation-delay:1.8s; 
    -o-animation-delay:1.8s; 
    animation-delay:1.8s; 
  }
  .ani-view.ani_delay19{
    -webkit-animation-delay:1.9s; 
    -moz-animation-delay:1.9s; 
    -o-animation-delay:1.9s; 
    animation-delay:1.9s; 
  }
  .ani-view.ani_delay20{
    -webkit-animation-delay:2s; 
    -moz-animation-delay:2s; 
    -o-animation-delay:2s; 
    animation-delay:2s; 
  }



  .fade-in-box{
      width: 100%; 
      height:100%;
      position: absolute;
      top:0%;
      left: 0%;
      background: url(../images/img34.png) center/cover no-repeat;
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
  }
  .fade-in-box.on{
      -webkit-animation:fade 1.2s ease-in-out forwards;
      -moz-animation:fade 1.2s ease-in-out forwards;
      -o-animation:fade 1.2s ease-in-out forwards;
      animation:fade 1.2s ease-in-out forwards;
  }
  @-webkit-keyframes fade{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }
  @-moz-keyframes fade{
     0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }
  @-ms-keyframes fade{
     0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }
  @-o-keyframes fade{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }
  @keyframes fade{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }

  .Fade-Inbox{
      width: 100%; 
      height:100%;
      position: absolute;
      top:0%;
      left: 0%;
      background: url(../images/100.png) center/cover no-repeat;
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      -webkit-animation:Fabox 0.9s 0.2s ease-in-out forwards;
      -moz-animation:Fabox 0.9s 0.2s ease-in-out forwards;
      -o-animation:Fabox 0.9s 0.2s ease-in-out forwards;
      animation:Fabox 0.9s 0.2s ease-in-out forwards;
  }

  @-webkit-keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(18,18,1);
      transform: scale3d(18,18,1);
      }
      100%{
          -webkit-transform: scale3d(18,18,1);
          transform: scale3d(18,18,1);
          display: none;
      }
  }
  @-moz-keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(30,30,1);
      transform: scale3d(30,30,1);
      }
      100%{
          -webkit-transform: scale3d(30,30,1);
          transform: scale3d(30,30,1);
          display: none;
      }
  }
  @-ms-keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(30,30,1);
      transform: scale3d(30,30,1);
      }
      100%{
          -webkit-transform: scale3d(30,30,1);
          transform: scale3d(30,30,1);
          display: none;
      }
  }
  @-o-keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(30,30,1);
      transform: scale3d(30,30,1);
      }
      100%{
          -webkit-transform: scale3d(30,30,1);
          transform: scale3d(30,30,1);
          display: none;
      }
  }
  @keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(30,30,1);
      transform: scale3d(30,30,1);
      }
      100%{
          -webkit-transform: scale3d(30,30,1);
          transform: scale3d(30,30,1);
          display: none;
      }
  }
}

/* 动画绑定 */

@-webkit-keyframes move_right {
from {
opacity: 0;
}
to {
opacity: 1;
-webkit-transform: translateX(120px);
transform: translateX(120px);
}
}
@keyframes move_right {
from {
opacity: 0;
}
to {
opacity: 1;
-webkit-transform: translateX(120px);
transform: translateX(120px);
}
}


.move_right {
-webkit-animation-name : move_right;
animation-name : move_right;
-webkit-animation-duration : 1s;
animation-duration : 1s;
-webkit-animation-iteration-count : 1;
animation-iteration-count : 1;
-webkit-animation-fill-mode : forwards;
animation-fill-mode : forwards;
}


.viewport-tip{position: absolute;z-index: 0;background: rgba(0,0,0,.59);width: 100%;height: 100%;top: 0;transition: all .5s;opacity: 0;display: none;}
.viewport-tip .overload{content: '';background: url(../images/tip.png);background-size:.865rem;width: .865rem;height: .865rem;position: absolute;left: 50%;top: 50%;margin: -.4325rem 0 0 -.4325rem; }
.showOn{z-index: 99999999;opacity: 1;display: block;}

