@charset "utf-8";

/* slide */
.slide-main{position:relative;margin:auto;top: 0; right: 0; bottom: 0; left: 0;}
.prev,.next{display:block;width:44px;height:44px;position:absolute;z-index:222;top:50%;overflow:hidden;cursor:pointer;opacity:0.6;-moz-opacity:0.6;filter:alpha(opacity=60);_border:1px solid none;}
.prev{left:70px;}
.next{right:70px;}
.prev:hover,.next:hover,.nav-main a:hover,.nav-main a.cur{opacity:1;-moz-opacity:1;filter:alpha(opacity=100);}
.item{display:block;width:100%;height:5px;position:absolute;z-index:124;top:95%;left:0;text-align:center;}
.item a{display:inline-block;width:24px;height:5px;margin-right:11px;background:#444;opacity:0.3;-moz-opacity:0.3;filter:alpha(opacity=30);overflow:hidden;}
.item a.cur{background:#fff;}
.slide-box,.slide{display:block;width:100%;height:100%;overflow:hidden; min-height:680px;}
.slide-box{position:relative;}
.slide{display:none;height:100%;background:#ff6900;position:relative;position:absolute;z-index:8;width:100%}/*padding-top:89px;*/
#bgstylea{background:#0a90e2;}
#bgstyleb{background: #1acc72 url(../images/biggest-banner-bg-2.png) left bottom repeat-x;}
#bgstylec{background:#35cbd9;}
.slide a{display:block;width:100%;height:100%;cursor:pointer;}
.obj-a,.obj-b,.obj-c,.obj-d,.obj-e,.obj-f{position:absolute;z-index:10;}
#bgstylea .obj-a{text-align:center;left:32%;display:block; bottom:-2px;}
#bgstylea .obj-b{text-align:center;left:5%; top:55%}

#bgstylea .obj-c{display:block;height:100%;top:0;left:10%;}
#bgstylea .obj-d{top:228px;height:100%;left:60%;}
#bgstylea .obj-d p{display:block;padding-top:20px;font-size:16px;color:#fff;clear:both;}
#bgstylea .obj-e{height:100%;z-index:12;left:10%; top:40%;}
#bgstylea .obj-f{height:100%;left:40%; top:25%;}


#bgstyleb .obj-a{text-align:right;left:45%;display:block; bottom:-2px;}
#bgstyleb .obj-b{text-align:center;left:5%;}
#bgstyleb .obj-c{text-align:center;left:30%;}
#bgstyleb .obj-d{text-align:center;left:2%; top:55%}
#bgstyleb .obj-e{text-align:center;left:4%; top:45%}


/*第一屏*/
.ab3_mb_t1 {
	font-size: 74px;
	font-family: "hev";
	color: #ffd442;
	text-transform: uppercase;
	position: absolute;
	left: 0;
	right: 0;
	top: 53px;
	text-align: center;
}
.ab3_mb_t2 {
	position: absolute;
	top: 130px;
	left: 0;
	right: 0;
	text-align:center;
}
.ab3_mb_t2 span {
	font-size: 24px;
	color: #0086d3;
	display: inline-block;
	line-height: 38px;
	padding: 0 14px;
	background: #fff;
}
.ab3_mb_t3 {
	position: absolute;
	top: 172px;
	font-size: 56px;
	font-weight: 600;
	color: #fff;
	text-align: center;
	left: 0px;
	right: 0px;
	white-space:nowrap;
	word-break:keep-all;
}
.ab3_mb_t3 font {
	color:#ffd442;
	font-weight:bolder;
}
.ab3_mb_t4 {
	position:absolute;
	top:244px;
	left:0;
	right:0;
	font-size:12px;
	color:rgba(255,255,255,.5);
	text-align:center;
	text-transform:uppercase;
}
.ab3_mb_t2 i { display:none;}
.ab3_mb_t1, .ab3_mb_t2, .ab3_mb_t3, .ab3_mb_t4,.obj-e {
	-webkit-animation-name: banner_1_font;
	animation-name: banner_1_font;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: backwards;
	animation-fill-mode: backwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;	
}
@-webkit-keyframes banner_1_font {
	from { opacity: 0; -webkit-transform: translate3d(50px,0,0); transform: translate3d(50px,0,0);}
	to {  opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
}
@keyframes banner_1_font {
	from { opacity: 0; -webkit-transform: translate3d(50px,0,0); transform: translate3d(50px,0,0);}
	to {  opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
}
/* 翻转动画
@-webkit-keyframes banner_1_font {
	from { opacity: 0; -webkit-transform: translate3d(50px,0,0); transform: translate3d(50px,0,0);}
	to {  opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
}
@keyframes banner_1_font {
	from { opacity: 0; -webkit-transform: translate3d(50px,0,0); transform: translate3d(50px,0,0);}
	to {  opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
}
@-webkit-keyframes banner_1_font {
	from {-webkit-transform: rotate(-180deg) scale(0.001);transform: rotate(-180deg) scale(0.001);}
	to {  -webkit-transform: rotate(0deg) scale(1);  transform: rotate(0deg) scale(1);}
}
@keyframes banner_1_font {
	from {-webkit-transform: rotate(-180deg) scale(0.001);transform: rotate(-180deg) scale(0.001);}
	to {  -webkit-transform: rotate(0deg) scale(1);  transform: rotate(0deg) scale(1);}
}
*/
#bgstylea .obj-a {
	-webkit-animation-name: banner_1_img1;
	animation-name: banner_1_img1;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: backwards;
	animation-fill-mode: backwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	}
@-webkit-keyframes banner_1_img1 {
	from { opacity: 0; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,20px,0)}
	to { opacity: 1 ; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0)}
}
@keyframes banner_1_img1 {
	from { opacity: 0; -webkit-transform: translate3d(0,-20px,0); transform: translate3d(0,-20px,0)}
	to { opacity: 1 ; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0)}
}

.obj-b {
	-webkit-animation-name: banner_1_img2;
	animation-name: banner_1_img2;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: backwards;
	animation-fill-mode: backwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;
	}
@-webkit-keyframes banner_1_img2 {
	from {-webkit-transform: scale(0.5);transform: scale(0.5); opacity: 0;}
	to {  -webkit-transform: scale(1);  transform: scale(1); opacity: 1;}
}
@keyframes banner_1_img2 {
	from {-webkit-transform: scale(0.5);transform: scale(0.5); opacity: 0;}
	to {  -webkit-transform: scale(1);  transform: scale(1); opacity: 1;}
}
.ai-banner-font {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}

/**/
/*banner 2 动画效果*/
@-webkit-keyframes banner_2_kf_1 {
	from { opacity: 0; -webkit-transform: translate3d(50px,0,0); transform: translate3d(50px,0,0);}
	to {  opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
}
@keyframes banner_2_kf_1 {
	from { opacity: 0; -webkit-transform: translate3d(50px,0,0); transform: translate3d(50px,0,0);}
	to {  opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
}
@-webkit-keyframes banner_2_kf_2 {
	from {-webkit-transform: rotate(-180deg) scale(0.001);transform: rotate(-180deg) scale(0.001);}
	to {  -webkit-transform: rotate(0deg) scale(1);  transform: rotate(0deg) scale(1);}
}
@keyframes banner_2_kf_2 {
	from {-webkit-transform: rotate(-180deg) scale(0.001);transform: rotate(-180deg) scale(0.001);}
	to {  -webkit-transform: rotate(0deg) scale(1);  transform: rotate(0deg) scale(1);}
}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg) translate3d(0,0,0);
    transform: perspective(400px) rotateX(90deg) translate3d(0,0,0);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg) translate3d(0,0,0);
    transform: perspective(400px) rotateX(-10deg) translate3d(0,0,0);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg) translate3d(0,0,0);
    transform: perspective(400px) rotateX(10deg) translate3d(0,0,0);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg) translate3d(0,0,0);
    transform: perspective(400px) rotateX(0deg) translate3d(0,0,0);
    opacity: 1;
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg) translate3d(0,0,0);
    -ms-transform: perspective(400px) rotateX(90deg) translate3d(0,0,0);
    transform: perspective(400px) rotateX(90deg) translate3d(0,0,0);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg) translate3d(0,0,0);
    -ms-transform: perspective(400px) rotateX(-10deg) translate3d(0,0,0);
    transform: perspective(400px) rotateX(-10deg) translate3d(0,0,0);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg) translate3d(0,0,0);
    -ms-transform: perspective(400px) rotateX(10deg) translate3d(0,0,0);
    transform: perspective(400px) rotateX(10deg) translate3d(0,0,0);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg) translate3d(0,0,0);
    -ms-transform: perspective(400px) rotateX(0deg) translate3d(0,0,0);
    transform: perspective(400px) rotateX(0deg) translate3d(0,0,0);
    opacity: 1;
  }
}

@-webkit-keyframes ab2_wx {
	from { opacity:0;}
	to {opacity:1}
}
@keyframes ab2_wx {
	from { opacity:0;}
	to {opacity:1}
}
#bgstyleb .obj-a{
	-webkit-animation-name: banner_2_kf_1;
	animation-name: banner_2_kf_1;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: backwards;
	animation-fill-mode: backwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;			
}
#bgstyleb .obj-c{
	-webkit-animation-name: banner_2_kf_2;
	animation-name: banner_2_kf_2;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: backwards;
	animation-fill-mode: backwards;
	-webkit-animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	animation-timing-function:cubic-bezier(.01, 1, .21, .99);
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;	
}
#bgstyleb .obj-b {
	-webkit-animation-name: flipInX;
	animation-name: flipInX;
	-webkit-animation-duration: .48s;
	animation-duration: .48s;
	-webkit-animation-fill-mode: backwards;
	animation-fill-mode: backwards;
	-webkit-animation-timing-function:linear;
	animation-timing-function:linear;
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s;	
}
#bgstyleb .obj-d {
	-webkit-animation-name: flipInX;
	animation-name: flipInX;
	-webkit-animation-duration: .48s;
	animation-duration: .48s;
	-webkit-animation-fill-mode: backwards;
	animation-fill-mode: backwards;
	-webkit-animation-timing-function:linear;
	animation-timing-function:linear;
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
	-webkit-transform-origin: center top;
	-ms-transform-origin: center top;
	transform-origin: center top;
}