@charset "utf-8";
*{margin: 0;padding: 0; box-sizing: border-box;}
html, body, h1, h2, h3, h4, h5, h6, hr, p, iframe, dl, dt, dd, ul, ol, li, pre, form, fieldset, button, input, textarea, th, td{margin: 0;padding: 0}
html,body{width:expression(document.body.clientWidth <= 1210? "1210px": "auto");min-width:1210px; }
body{background-color: #f8f8f8;}
body, button, input, select, textarea, fieldset, label{font: 12px/1.5 "Microsoft YaHei", "黑体", "Arial", "Tahoma", \5b8b\4f53;color: #000}
h1, h2, h3, h4, h5, h6{font-size: 100%;font-weight: normal;}
ul, ol{list-style: none}
fieldset, img{border: 0 none}
img{-ms-interpolation-mode: bicubic}
i, em, s, b{font-weight: normal;font-style: normal; text-decoration:none}
table{font-size: 12px;border-collapse: collapse;border-spacing: 0}
input, select, textarea, button{outline: none;font-size: 100%;-webkit-box-sizing: content-box;-moz-box-sizing: content-box;box-sizing: content-box}
button, input[type=button], input[type=submit]{cursor: pointer}
input[type=search]{-webkit-appearance: textfield}
input[type=text],input[type=password],textarea{border:1px solid #ccc}
textarea{overflow-y: auto;resize: vertical}
.clear, .clearfix{zoom: 1}
.clear:after, .clearfix:after{content: ' ';display: block;clear: both;height: 0;visibility: hidden}
.hidden, .hide{display: none}
a{color: #333;text-decoration: none}
a:hover{color:#80B341;text-decoration: underline}
hr{width: 100%;color: #CCC;border: 0;background-color: #CCC;height: 1px;display: block;margin: 0;padding: 0;}
/* font color*/
.blue{color: #3aa4fe}
.orange{color: #FFBD3A}
.gray{color: #a2a2a2}
.black{color: #333}
.green{color: #008000}
/* link color*/
a.orange{color: #ff5e53}
a.gray{color: #666}
a.black{color: #333}
a.green{color: #008000}
a.white{color: #fff}
/*float*/
.fl{float: left;}
.fr{float: right;}
.nof{float: right;}
/*fontSize*/
.fs12{font-size: 12px;}
.fs14{font-size: 14px;}
.fs16{font-size: 16px;}
.fs22{font-size: 22px;}
.fs24{font-size: 24px;}
/*text-align*/
.t_l{text-align: left;}
.t_c{text-align: center;}
.t_r{text-align: right;}
.hidden{ display:none}
.vm{vertical-align: middle;}
/*div宽度*/
.width1{width: 30px;}
.width2{width: 90px;}
.width3{width: 170px;}
.width4{width: 60px;}
.width5{width: 180px;}
.width6{width: 600px;}
.width7{width: 300px;}
.width8{width: 140px;}
.width9{width: 400px;}
.width10{width: 270px;}
.width11{width: 200px;}
.width12{width: 430px;}
.width13{width: 120px;}
.width14{width: 210px;}
.width15{width: 50px;}
.width16{width: 460px;}
.width17{width: 556px;}
.width18{width: 734px;}
.width_short{width: 60px;}
.width_normal{width: 195px;}
.width_long{width: 340px;}
.width1000{width:1000px;min-width:1000px; margin:0 auto}
.width1200{width:1200px;min-width:1200px; margin:0 auto}
.auto {margin: 0 auto;}
/*行列*/
.grid{*zoom:1;margin: 0 auto;width: 100%}
.row{width:100%;}
.row:after,.grid:after{display: block;clear: both;content: "";visibility: hidden;height: 0}

/*background*/
.orangeBg{ background:#E95902!important}
.redBg{ background:#C10C00!important}
.yellowBg{ background:#FFD226!important}
.greenBg{ background:#48A92D!important}
.lightGreenBg{ background:#7CC33F !important}
.blueBg{ background:#3DA1FE!important}
.lightBlueBg{background: #37a2e2!important}
.ballBg{ background: url(../images/d_img/icos.png) -212px -5px no-repeat}
.nobg{background: none!important}
.addBtm{ border-bottom:1px solid #ccc!important}
.EvenBgcolor{ background:#F5F5F5}
.grayBg{ background: #F8F8F8!important; }
.whiteBg{ background: #fff!important; }
.greyBg{ background: #F9FCF5!important; }

/*border*/
.noBorderBottom{ border-bottom:0 !important}
.noBorderLeft{ border-left:0 !important}
.noBorderRight{ border-right:0 !important}
.noBorderTop{ border-top:0 !important}

.addBorderTop{border-bottom: 1px solid #a8a8a8;}
.addBorderBottm{border-bottom: 1px solid #a8a8a8;}
.addBorderLeft{border-bottom: 1px solid #a8a8a8;}
.addBorderRight{border-bottom: 1px solid #a8a8a8;}


.noPaddingTop{ padding-top:0 !important;}
.noPaddingBottom{ padding-bottom:0 !important;}
.diviline{height:1px;border-bottom:1px dashed #ccc;width:100%}
.btn{ border-radius:5px; height:24px; line-height:24px; text-align:center;padding:0 10px;color:#fff;display:inline-block; background:#39A3F7}
.btn{ *display:inline}
.btn-big{ border-radius:5px; height:24px; line-height:24px; text-align:center;padding:0 10px}
.btn-long{ border-radius:5px; height:24px; line-height:24px; text-align:center;padding:0 15px}
.orangeBtn{background:#EC2A2A}
.orangeBtn:hover{color:#fff;text-decoration:underline}
.grayBtn{background:#DBDBDB}
.greenBtn{background: #34C05D}


.focus{color: #000;background: #FDC0BB;box-shadow: 0 0 10px #F60 inset;}

/*----margin----*/
.mt-10 { margin-top: 10px!important;}
.mt-20 { margin-top: 20px!important;}
.mt-30 { margin-top: 30px!important;}
.mt-40 { margin-top: 40px!important;}
.mt-50 { margin-top: 50px!important;}
.mt-60 { margin-top: 60px!important;}
.mt-70 { margin-top: 70px!important;}
.mt-80 { margin-top: 80px!important;}
.ml-20 { margin-left: 20px!important;}
.ml-30 { margin-left: 30px!important;}
.ml-80 { margin-left: 80px!important;}
/*----padding----*/
.pt-10 { padding-top: 10px!important;}
.pt-20 { padding-top: 20px!important;}
.pt-30 { padding-top: 30px!important;}
.pt-40 { padding-top: 40px!important;}
.pt-50 { padding-top: 50px!important;}
.pt-60 { padding-top: 60px!important;}
.pt-70 { padding-top: 70px!important;}
.pt-80 { padding-top: 80px!important;}
.pd-lr20{ padding: 0 20px!important;}
.pd-tb20{ padding: 20px 0px!important;}
.pd-tb80{ padding: 80px 0px!important;}
.pd-40{ padding: 40px!important; }
/*
**********************************************************************************************
滚动条
***********************************************************************************************/
.webkit-scr{overflow-y: auto;overflow-x: hidden;}
.webkit-scr::-webkit-scrollbar{width:8px;height:9px;-webkit-transition:background-color 0.15s linear;-moz-transition:background-color 0.15s linear;-o-transition:background-color 0.15s linear;transition:background-color 0.15s linear;background:#c7c3c4;}
.webkit-scr::-webkit-scrollbar-thumb{background:#000;/*border-radius: 5px;*/}
.webkit-scr:hover::-webkit-scrollbar-thumb{background:#000;}
.webkit-scr::-webkit-scrollbar-thumb:hover{background:#000;-webkit-transition:background-color 0.15s linear;}
::selection{color: #fff;background: #80B341;}
::-moz-selection{color:#fff;background:#80B341;}
/* 联系 */
.telmsg {
  position: fixed;
  width: 56px;
  height: 224px;
  background-color: pink;
  right: 0px;
  top: 150px;
  z-index: 99;

}
.telmsg .te-i{
  display:block;
  position: relative;
  width: 56px;
height: 56px;
background: #80B341;
opacity: 1;
border-radius: 0px;
cursor: pointer;

}
.telmsg .te-i img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 24px;
  height: 24px;
}
.telmsg .tel-text{
  background: #fff;
  position: absolute;
  right: 56px;
  width: 100px;
  line-height: 56px;
  text-align: center;
  border-radius: 5px;
  box-shadow: 0 0 10px 0 #eeeeee;
  display: none;
}
.telmsg .tel-text::after{
  content: '';
  position: absolute;
  top: 50%;
  right: -5.5px;
  width: 11px;
  height: 11px;
  background-color: #fff;
  margin-top: -5.5px;
  transform: rotate(45deg);
}
.telmsg .te-i:hover .tel-text{
  display: block;
}
/*头部*/
.header{
  height: 80px;
  background: rgba(255, 255, 255, .05);
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 9;
}

.menu{
  width: 1200px;
  height: 80px;
  line-height: 80px;
  margin: 0 auto;
}

.logo{
  width: 220px;
  height: 40px;
  background: url(../images/logo1.png) no-repeat;
  background-size: 100% 100%;
  display: inline-block;
  vertical-align: middle;
}
.menu-wrap:hover{
  background: #fff;
}
.menu-wrap:hover li,.menu-wrap:hover a{
  color:#000
}
.menu-wrap:hover .logo{
  background: url(../images/logo2.png) no-repeat;
  background-size: 100% 100%;
}
.header.fixed_header .logo{
  background: url(../images/logo2.png) no-repeat;
  background-size: 100% 100%;
}
.menu-wrap:hover .on::before{
  content: "";
  display: block;
  width: 32px;
  height: 4px;
  background: #63B358;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -16px;
}
.nav{
  display: inline-block;
  vertical-align: middle;
  margin-left: 114px;
  float: right;
}
.nav li{
  float: left;
  list-style-type:none;
  color: #fff;
  margin-right: 42px;
  cursor: pointer;
  font-size: 16px;
  position: relative;
}
.nav li:hover,.nav a:hover {
  color: #63B358;
}
.nav li:hover dl{
  display: block;
}
.nav .on{
  position: relative;
}
.nav .on::before{
  content: "";
  display: block;
  width: 32px;
  height: 4px;
  background: #fff;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -16px;
}
.nav dl{
  background: #fff;
  color: #000;
  font-size: 14px;
  padding: 20px 10px;
  position: absolute;
  top: 78px;
  left: 0;
  margin-left: -50px;
  white-space: nowrap;
  text-align: center;
  display: none;
  min-width: 160px;
}
.nav a {
  color: #fff;
}
.nav2 a{
  color: #000;
}
.nav dt{
  height: 40px;
  line-height: 40px;
}
.header.fixed_header .on::before,.nav2 .on::before{
  content: "";
  display: block;
  width: 32px;
  height: 4px;
  background: #63B358;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -16px;
}
.header.fixed_header {
  background: #fff;
  z-index: 9;
}
.header.fixed_header .nav li,.header.fixed_header .nav a{
  color:#000
}
.header.fixed_header .nav a:hover,.header.fixed_header .nav li:hover,.header .nav a.active {
  color: #63B358;
}
/*联系我们*/
.c-wrap{
  min-width: 1200px;
  background: url(../images/public/bottombg.png) center center no-repeat;
  padding-top: 110px;
  padding-bottom: 138px;
}
.c-wrap .title{
  font-size: 36px;
  color: #fff;
}
.c-wrap .box{
  margin-left: 110px;
}
.c-wrap .user{
  position: relative;
}
.c-wrap .user .user-img{
  width: 16px;
  height: 16px;
  background: url(../images/public/user.png) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 50%;
  left: 20px;
  margin-top: -8px;
}
.c-wrap .user .user-phone{
  width: 16px;
  height: 16px;
  background: url(../images/public/phone.png) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 50%;
  left: 20px;
  margin-top: -8px;
}
.c-wrap .user-input{
  width: 242px;
  height: 60px;
  border-radius: 6px;
  border: none;
  font-size: 16px;
  padding: 0 50px;
}
.c-wrap .btn-submit{
  width: 128px;
  height: 60px;
  background: #60A011;
  color: #fff;
  font-size: 18px;
  line-height: 60px;
  text-align: center;
	box-shadow: 0px 0px 2px 1px #60A011;
  cursor: pointer;
}
.c-wrap .consulting{
  font-size: 24px;
  text-align: center;
  color: #fff;
}
.c-wrap .consulting .tel{
  width: 24px;
  height: 24px;
  vertical-align: middle;
  margin-right: 10px;
}
/*底部*/
.footer{ text-align:center;background:#000 url(../images/public/ftbg.png) center center repeat-x;}
.footer .link {font-size: 14px;text-align: left;
  line-height: 48px;color: #fff;}
.footer .link a{
color: #FFF;
}
.footer .ftlogo{
  text-align: left;
  margin-bottom: 20px;
}
.footer .ftlogo img{
  width: 219px;height: 40px;
}
.footer a,.footer ul li{
  color:#C8C9CC
}
.footer a{transition:all 0.6s ease;-webkit-transition:all 0.6s ease;-moz-transition:all 0.6s ease;-ms-transition:all 0.6s ease;}
.footer a:hover{ color:#fff}
.ftNav{ padding:25px 0;}
.ftNav ul{ display:inline-block; width: 290px; vertical-align: top;
padding-right: 0px; text-align: left;}
/*hack for ie7*/
.ftNav ul{ *display:inline}
.ftNav ul li{padding:6px 0; font-size:14px; }

.ftNav ul li.first{ padding:0;margin-bottom: 0px;}
.ftNav ul li h3{ font-size:18px;color:#C8C9CC;padding-bottom: 10px;}
/*hack for ie7*/
.ftNav ul li h3 i{ *display:inline}
.ftNav ul li .tel { font-size: 36px;color: #fff;}
.ftNav ul li.erwei img { width: 140px;height: 140px;}

.ftSubNav{ padding:15px 0}
.ftSubNav ul li{ display:inline-block}
/*hack for ie7*/
.ftSubNav ul li{ *display:inline}
.ftSubNav ul li a{ padding:0 10px}
.ftInfo { padding: 0px 0 0px 0;line-height: 60px;border-top:1px solid #353830}
.ftInfo p { padding:5px 0;text-align: left;color:#C8C9CC}

.swiper-button-prev::after,
.swiper-button-next::after{
  display: none;
}
.swiper-button-prev{
  top: auto;
  bottom: 0;
  left: 0 !important;
  width: 28px;
  height: 42px;
  background-image: url(../images/public/swiper-left.png);
  background-size: 100% 100%;
  margin: 0;
  opacity: 0.4;
}
.swiper-button-next{
  top: auto;
  right: 0 !important;
  bottom: 0;
  width: 28px;
  height: 42px;
  background-image: url(../images/public/swiper-right.png);
  background-size: 100% 100%;
  margin: 0;
  opacity: 0.4;
}
.swiper-container:hover .swiper-button-prev,.swiper-container:hover .swiper-button-next{
  opacity: 1;
}
.tab-content{
  display: none;
}
.tab-content.active{
  display: block;
}
.logo-box li{
  float: left;
  margin-right: 38px;
  background-size: 100% 100% !important;
}
.logo-box li:last-child{
  margin-right: 0;
}
.sunon{
  background: url(../images/public/sunon.png) no-repeat;
}
.sunon.active{
  background: url(../images/public/sunon2.png) no-repeat;
}
.delixi{
  background: url(../images/public/delixi.png) no-repeat;
}
.delixi.active{
  background: url(../images/public/delixi2.png) no-repeat;
}
.uline{
  background: url(../images/public/uline.png) no-repeat;
}
.uline.active{
  background: url(../images/public/uline2.png) no-repeat;
}
.shoes{
  background: url(../images/public/shoes.png) no-repeat;
}
.shoes.active{
  background: url(../images/public/shoes2.png) no-repeat;
}
.rastar{
  background: url(../images/public/rastar.png) no-repeat;
}
.rastar.active{
  background: url(../images/public/rastar2.png) no-repeat;
}
.xiangyuan{
  background: url(../images/public/xiangyuan.png) no-repeat;
}
.xiangyuan.active{
  background: url(../images/public/xiangyuan2.png) no-repeat;
}
.hongyan{
  background: url(../images/public/hongyan.png) no-repeat;
}
.hongyan.active{
  background: url(../images/public/hongyan2.png) no-repeat;
}

.page-banner {
  position: relative;
  background-color: #fff;
  height:600px;
  text-align: center;
}
.page-banner .img {
  width: 100%;
  height: 100%;
  /* width: 1920px; */
}
.page-banner .banner-text {
  font-family: Microsoft YaHei;
  position: relative;
  top: -450px;
  text-align: left;
  color: #fff;
  width: 1200px;
  margin: 0 auto;
}
.page-banner .banner-text .title {
  font-size: 40px;
  font-weight: bold;
  line-height: 60px;
  margin-bottom: 20px;
}
.page-banner .banner-text .subhead {
  width: 704px;
  font-size: 18px;
  line-height: 2;
}

/***** 动画样式 *****/
/* 向上滑动 */
@-webkit-keyframes up20{0%{opacity:0;-webkit-transform:translateY(20px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes up20{0%{opacity:0;-moz-transform:translateY(20px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes up20{0%{opacity:0;transform:translateY(20px);}100%{opacity:1;transform:translateY(0);}}

@-webkit-keyframes up35{0%{opacity:0;-webkit-transform:translateY(35px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes up35{0%{opacity:0;-moz-transform:translateY(35px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes up35{0%{opacity:0;transform:translateY(35px);}100%{opacity:1;transform:translateY(0);}}

@-webkit-keyframes up70{0%{opacity:0;-webkit-transform:translateY(70px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes up70{0%{opacity:0;-moz-transform:translateY(70px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes up70{0%{opacity:0;transform:translateY(70px);}100%{opacity:1;transform:translateY(0);}}

@-webkit-keyframes up85{0%{opacity:0;-webkit-transform:translateY(85px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes up85{0%{opacity:0;-moz-transform:translateY(85px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes up85{0%{opacity:0;transform:translateY(85px);}100%{opacity:1;transform:translateY(0);}}

.animate .up20{-webkit-animation:up20 1s .3s ease both;-moz-animation:up20 1s .3s ease both;animation:up20 1s .3s ease both;}
.animate .up21{-webkit-animation:up20 1s 1s ease both;-moz-animation:up20 1s 1s ease both;animation:up20 1s 1s ease both;}
.animate .up35{-webkit-animation:up35 1s .5s ease both;-moz-animation:up35 1s .5s ease both;animation:up35 1s .5s ease both;}
.animate .up36{-webkit-animation:up35 1s 1.5s ease both;-moz-animation:up35 1s 1.5s ease both;animation:up35 1s 1.5s ease both;}
.animate .up70{-webkit-animation:up70 1s .3s ease both;-moz-animation:up70 1s .3s ease both;animation:up70 1s .3s ease both;}
.animate .up71{-webkit-animation:up70 1s 1s ease both;-moz-animation:up70 1s 1s ease both;animation:up70 1s 1s ease both;}
.animate .up85{-webkit-animation:up85 1s .5s ease both;-moz-animation:up85 1s .5s ease both;animation:up85 1s .5s ease both;}
.animate .up86{-webkit-animation:up85 2s 1s ease both;-moz-animation:up85 2s 1s ease both;animation:up85 2s 1s ease both;}
.animate .up87{-webkit-animation:up85 2.5s 1s ease both;-moz-animation:up85 2.5s 1s ease both;animation:up85 2.5s 1s ease both;}
.animate .up88{-webkit-animation:up85 3s 1s ease both;-moz-animation:up85 3s 1s ease both;animation:up85 3s 1s ease both;}
.animate .up89{-webkit-animation:up85 3.5s 1s ease both;-moz-animation:up85 3.5s 1s ease both;animation:up85 3.5s 1s ease both;}

/* 向下滑动 */
@-webkit-keyframes dn30{0%{opacity:0;-webkit-transform:translateY(-20px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes dn30{0%{opacity:0;-moz-transform:translateY(-20px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes dn30{0%{opacity:0;transform:translateY(-20px);}100%{opacity:1;transform:translateY(0);}}

@-webkit-keyframes dn50{0%{opacity:0;-webkit-transform:translateY(-50px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes dn50{0%{opacity:0;-moz-transform:translateY(-50px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes dn50{0%{opacity:0;transform:translateY(-50px);}100%{opacity:1;transform:translateY(0);}}

.animate .dn30{-webkit-animation:dn30 1s .3s ease both;-moz-animation:dn30 1s .3s ease both;animation:dn30 1s .3s ease both;}
.animate .dn31{-webkit-animation:dn30 1s .6s ease both;-moz-animation:dn30 1s .6s ease both;animation:dn30 1s .6s ease both;}
.animate .dn50{-webkit-animation:dn50 2s 2s ease both;-moz-animation:dn50 2s 2s ease both;animation:dn50 2s 2s ease both;}

/* 向左滑动 */
@-webkit-keyframes lt50{0%{opacity:0;-webkit-transform:translateX(50px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes lt50{0%{opacity:0;-moz-transform:translateX(50px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes lt50{0%{opacity:0;transform:translateX(50px);}100%{opacity:1;transform:translateY(0);}}

@-webkit-keyframes lt100{0%{opacity:0;-webkit-transform:translateX(100px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes lt100{0%{opacity:0;-moz-transform:translateX(100px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes lt100{0%{opacity:0;transform:translateX(100px);}100%{opacity:1;transform:translateY(0);}}

@-webkit-keyframes lt300{0%{opacity:0;-webkit-transform:translateX(300px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes lt300{0%{opacity:0;-moz-transform:translateX(300px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes lt300{0%{opacity:0;transform:translateX(300px);}100%{opacity:1;transform:translateY(0);}}

.animate .lt50{-webkit-animation:lt50 1s 1.5s ease both;-moz-animation:lt50 1s 1.5s ease both;animation:lt50 1s 1.5s ease both;}
.animate .lt51{-webkit-animation:lt50 1s .3s ease both;-moz-animation:lt50 1s .3s ease both;animation:lt50 1s .3s ease both;}
.animate .lt100{-webkit-animation:lt100 2s 1.5s ease both;-moz-animation:lt100 2s 1.5s ease both;animation:lt100 2s 1.5s ease both;}
.animate .lt101{-webkit-animation:lt100 2s 2s ease both;-moz-animation:lt100 2s 2s ease both;animation:lt100 2s 2s ease both;}
.animate .lt102{-webkit-animation:lt100 1s 1s ease both;-moz-animation:lt100 1s 1s ease both;animation:lt100 1s 1s ease both;}
.animate .lt103{-webkit-animation:lt100 1s 1.2s ease both;-moz-animation:lt100 1s 1.2s ease both;animation:lt100 1s 1.2s ease both;}
.animate .lt300{-webkit-animation:lt300 3s 1s ease both;-moz-animation:lt300 3s 1s ease both;animation:lt300 3s 1s ease both;}

/* 向右滑动 */
@-webkit-keyframes rt50{0%{opacity:0;-webkit-transform:translateX(-50px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes rt50{0%{opacity:0;-moz-transform:translateX(-50px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes rt50{0%{opacity:0;transform:translateX(-50px);}100%{opacity:1;transform:translateY(0);}}

@-webkit-keyframes rt150{0%{opacity:0;-webkit-transform:translateX(-150px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes rt150{0%{opacity:0;-moz-transform:translateX(-150px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes rt150{0%{opacity:0;transform:translateX(-150px);}100%{opacity:1;transform:translateY(0);}}

@-webkit-keyframes rt300{0%{opacity:0;-webkit-transform:translateX(-300px);}100%{opacity:1;-webkit-transform:translateY(0);}}
@-moz-keyframes rt300{0%{opacity:0;-moz-transform:translateX(-300px);}100%{opacity:1;-moz-transform:translateY(0);}}
@keyframes rt300{0%{opacity:0;transform:translateX(-300px);}100%{opacity:1;transform:translateY(0);}}

.animate .rt50{-webkit-animation:rt50 1s .3s ease both;-moz-animation:rt50 1s .3s ease both;animation:rt50 1s .3s ease both;}
.animate .rt150{-webkit-animation:rt150 1s 1s ease both;-moz-animation:rt150 1s 1s ease both;animation:rt150 1s 1s ease both;}
.animate .rt151{-webkit-animation:rt150 1s .5s ease both;-moz-animation:rt150 1s .5s ease both;animation:rt150 1s .5s ease both;}
.animate .rt152{-webkit-animation:rt150 1s .8s ease both;-moz-animation:rt150 1s .8s ease both;animation:rt150 1s .8s ease both;}
.animate .rt300{-webkit-animation:rt300 3s 1s ease both;-moz-animation:rt300 3s 1s ease both;animation:rt300 3s 1s ease both;}

/* 旋转抖动 */
@-webkit-keyframes ro2{0%{-webkit-transform:rotate(0deg);}5%,15%,25%{-webkit-transform:rotate(-2deg);}10%,20%,30%{-webkit-transform:rotate(2deg);}35%{-webkit-transform:rotate(0deg);}}
@-moz-keyframes ro2{0%{-moz-transform:rotate(0deg);}5%,15%,25%{-moz-transform:rotate(-2deg);}10%,20%,30%{-moz-transform:rotate(2deg);}35%{-moz-transform:rotate(0deg);}}
@keyframes ro2{0%{transform:rotate(0deg);}5%,15%,25%{transform:rotate(-2deg);}10%,20%,30%{transform:rotate(2deg);}35%{transform:rotate(0deg);}}

.animate .ro2{-webkit-animation:ro2 1.5s .2s linear infinite;-moz-animation:ro2 1.5s .2s linear infinite;animation:ro2 1.5s .2s linear infinite;}

/* 伸缩 */
@-webkit-keyframes sl05{0%{-webkit-transform:scale(0.5,0.5);}30%{-webkit-transform:scale(0.9,0.9);}60%{-webkit-transform:scale(0.5,0.5);}100%{-webkit-transform:scale(1,1);}}
@-moz-keyframes sl05{0%{-moz-transform:scale(0.5,0.5);}30%{-moz-transform:scale(0.9,0.9);}60%{-moz-transform:scale(0.5,0.5);}100%{-moz-transform:scale(1,1);}}
@keyframes sl05{0%{transform:scale(0.5,0.5);}30%{transform:scale(0.9,0.9);}60%{transform:scale(0.5,0.5);}100%{transform:scale(1,1);}}

.animate .sl05{-webkit-animation:sl05 1.5s .3s ease both;-moz-animation:sl05 1.5s .3s ease both;animation:sl05 1.5s .3s ease both;}

.irotateIn{transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;-moz-transform: rotate(360deg);-webkit-transform: rotate(360deg);-o-transform: rotate(360deg);transform: rotate(360deg);}
.irotateOut{transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;-moz-transform: rotate(-360deg);-webkit-transform: rotate(-360deg);-o-transform: rotate(-360deg);transform: rotate(-360deg);}

/***** 动画样式 结束 *****/