.animateBanner{ width: 1200px; height:120px;  background: url("../images/bg-m.jpg") no-repeat center center; margin:20px auto 0;  position: relative; overflow: hidden }
.middle{ position: absolute; top:0; left: 79px;width: 1026px; height: 120px;}
.animat-area{ background: url("../images/bg-jb.png") no-repeat center 0; width: 1026px; height: 120px; margin: 0 auto }
.slogen{ color: #fff; font-weight: bold; font-size: 33px; font-family: "Microsoft Yahei"; position:absolute; top:0px; left:250px; text-align: center; width: 528px; height: 120px; line-height: 120px }
.download{position: absolute; top:45px; right:140px}

@keyframes open1{
	0% {width: 0px; }
	3% {width:1026px;}
	23.5% {width:1026px;}
	25% {width:0px;}
	100% {width:0px;}
}
.open1{
	animation-name: open1;
	animation-duration:28s;
	animation-timing-function:linear;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}
@keyframes zoomIn1 {
	0% {
		opacity: 0;
		transform:none;
	}
	5% {
		opacity:0;
		transform: scale3d(.3, .3, .3);
	}
	6.5% {
		opacity: 1;
		transform: none;

	}
	12% {
		opacity: 1;
		transform:none;}
	13.5% {
		opacity: 0;
		transform:none;}
	100% {
		opacity: 0;
		transform:none;
	}
}
 .zoomIn1 {
	animation-name: zoomIn1;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}

@keyframes zoomIn2 {
	0% {
		opacity: 0;
		transform:none;
	}
	13.5% {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}
	15% {
		opacity: 1;
		transform: none;

	}
	23% {
		opacity:1;
		transform: none;

	}
	25% {
		opacity:0;
		transform: none;

	}

	100% {
		opacity:0;
		transform:none;
	}
}
.zoomIn2 {
	animation-name: zoomIn2;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}


@keyframes swing1 {
	0% {

		opacity:0;
	}
	10%{

		opacity:1;
	}
	18% {

		transform: rotate3d(0, 0, 1, 0deg);
	}
	18.5% {
		opacity:1;

		transform: rotate3d(0, 0, 1, 10deg);
	}

	19% {

		transform: rotate3d(0, 0, 1, -15deg);
	}

	19.5% {

		transform: rotate3d(0, 0, 1, 5deg);
	}

	20.5% {

		transform: rotate3d(0, 0, 1, -10deg);
	}
	21.5% {

		transform: rotate3d(0, 0, 1, 0deg);
	}
	23% {
		opacity:1;
		transform: rotate3d(0, 0, 1, 0deg);
	}
	24% {

		transform: rotate3d(0, 0, 1, 0deg);
		opacity:0;
	}

	to {
		opacity:0;
		transform: rotate3d(0, 0, 1, 0deg);
	}
}

.swing1 {
	-webkit-animation-name: swing1;
	animation-name: swing1;
	-webkit-transform-origin: top center;
	transform-origin: top center;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}

@keyframes open2{
	0% {width: 0px; }
	26% {width: 0px; }
	29% {width:1026px;}
	48.5% {width:1026px;}
	50% {width:0px;}
	100% {width:0px;}
}
.open2{
	animation-name: open2;
	animation-duration:28s;
	animation-timing-function:linear;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}
@keyframes zoomIn3 {
	0% {
		opacity: 0;
		transform:none;
	}
	30% {
		opacity:0;
		transform: scale3d(.3, .3, .3);
	}
	31.5% {
		opacity: 1;
		transform: none;

	}
	36% {
		opacity: 1;
		transform:none;}
	37.5% {
		opacity: 0;
		transform:none;}
	100% {
		opacity: 0;
		transform:none;
	}
}
.zoomIn3 {
	animation-name: zoomIn3;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}

@keyframes zoomIn4 {
	0% {
		opacity: 0;
		transform:none;
	}
	37.5% {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}
	39% {
		opacity: 1;
		transform: none;

	}
	46% {
		opacity:1;
		transform: none;

	}
	48.5% {
		opacity:1;
		transform: none;

	}
	50% {
		opacity:0;
		transform: none;

	}

	100% {
		opacity:0;
		transform:none;
	}
}
.zoomIn4 {
	animation-name: zoomIn4;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}


@keyframes swing2 {
	0% {

		opacity:0;
	}
	26% {

		opacity:0;
	}
	36%{

		opacity:1;
	}
	43% {

		transform: rotate3d(0, 0, 1, 0deg);
	}
	43.5% {
		opacity:1;

		transform: rotate3d(0, 0, 1, 10deg);
	}

	44% {

		transform: rotate3d(0, 0, 1, -15deg);
	}

	44.5% {

		transform: rotate3d(0, 0, 1, 5deg);
	}

	45.5% {

		transform: rotate3d(0, 0, 1, -10deg);
	}
	46.5% {

		transform: rotate3d(0, 0, 1, 0deg);
	}
	48% {
		opacity:1;
		transform: rotate3d(0, 0, 1, 0deg);
	}
	49% {
		transform: rotate3d(0, 0, 1, 0deg);
		opacity:0;
	}

	to {
		opacity:0;
		transform: rotate3d(0, 0, 1, 0deg);
	}
}

.swing2 {
	animation-name: swing2;
	transform-origin: top center;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}


@keyframes open3{
	0% {width: 0px; }
	51% {width: 0px; }
	54% {width:1026px;}
	73.5% {width:1026px;}
	75% {width:0px;}
	100% {width:0px;}
}
.open3{
	animation-name: open3;
	animation-duration:28s;
	animation-timing-function:linear;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}
@keyframes zoomIn5 {
	0% {
		opacity: 0;
		transform:none;
	}
	55% {
		opacity:0;
		transform: scale3d(.3, .3, .3);
	}
	56.5% {
		opacity: 1;
		transform: none;

	}
	62% {
		opacity: 1;
		transform:none;}
	63.5% {
		opacity: 0;
		transform:none;}
	100% {
		opacity: 0;
		transform:none;
	}
}
.zoomIn5 {
	animation-name: zoomIn5;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}

@keyframes zoomIn6 {
	0% {
		opacity: 0;
		transform:none;
	}
	63.5% {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}
	65% {
		opacity: 1;
		transform: none;

	}
	72% {
		opacity:1;
		transform: none;

	}
	73.5% {
		opacity:1;
		transform: none;

	}
	75% {
		opacity:0;
		transform: none;

	}

	100% {
		opacity:0;
		transform:none;
	}
}
.zoomIn6 {
	animation-name: zoomIn6;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}


@keyframes swing3 {
	0% {

		opacity:0;
	}
	51% {

		opacity:0;
	}
	61%{

		opacity:1;
	}
	68% {

		transform: rotate3d(0, 0, 1, 0deg);
	}
	68.5% {
		opacity:1;

		transform: rotate3d(0, 0, 1, 10deg);
	}

	69% {

		transform: rotate3d(0, 0, 1, -15deg);
	}

	69.5% {

		transform: rotate3d(0, 0, 1, 5deg);
	}

	70.5% {

		transform: rotate3d(0, 0, 1, -10deg);
	}
	71.5% {

		transform: rotate3d(0, 0, 1, 0deg);
	}
	73% {
		opacity:1;
		transform: rotate3d(0, 0, 1, 0deg);
	}
	74% {
		transform: rotate3d(0, 0, 1, 0deg);
		opacity:0;
	}

	to {
		opacity:0;
		transform: rotate3d(0, 0, 1, 0deg);
	}
}

.swing3 {
	animation-name: swing3;
	transform-origin: top center;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}


@keyframes open4{
	0% {width: 0px; }
	76% {width: 0px; }
	78.5% {width:1026px;}
	98% {width:1026px;}
	99.5% {width:0px;}
	100% {width:0px;}
}
.open4{
	animation-name: open4;
	animation-duration:28s;
	animation-timing-function:linear;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}
@keyframes zoomIn7 {
	0% {
		opacity: 0;
		transform:none;
	}
	80% {
		opacity:0;
		transform: scale3d(.3, .3, .3);
	}
	81.5% {
		opacity: 1;
		transform: none;

	}
	87% {
		opacity: 1;
		transform:none;}
	88.5% {
		opacity: 0;
		transform:none;}
	100% {
		opacity: 0;
		transform:none;
	}
}
.zoomIn7 {
	animation-name: zoomIn7;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}

@keyframes zoomIn8 {
	0% {
		opacity: 0;
		transform:none;
	}
	88.5% {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}
	90% {
		opacity: 1;
		transform: none;

	}
	97% {
		opacity:1;
		transform: none;

	}
	98.5% {
		opacity:1;
		transform: none;

	}

	99.5% {
		opacity:0;
		transform:none;
	}
	100% {
		opacity:0;
		transform:none;
	}
}
.zoomIn8 {
	animation-name: zoomIn8;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}


@keyframes swing4 {
	0% {

		opacity:0;
	}
	76% {

		opacity:0;
	}
	86%{

		opacity:1;
	}
	93% {

		transform: rotate3d(0, 0, 1, 0deg);
	}
	93.5% {
		opacity:1;

		transform: rotate3d(0, 0, 1, 10deg);
	}

	94% {

		transform: rotate3d(0, 0, 1, -15deg);
	}

	94.5% {

		transform: rotate3d(0, 0, 1, 5deg);
	}

	95.5% {

		transform: rotate3d(0, 0, 1, -10deg);
	}
	96.5% {

		transform: rotate3d(0, 0, 1, 0deg);
	}
	98% {
		opacity:1;
		transform: rotate3d(0, 0, 1, 0deg);
	}
	99% {
		transform: rotate3d(0, 0, 1, 0deg);
		opacity:0;
	}

	to {
		opacity:0;
		transform: rotate3d(0, 0, 1, 0deg);
	}
}

.swing4 {
	animation-name: swing4;
	transform-origin: top center;
	animation-duration:28s;
	animation-timing-function:ease;
	animation-delay:0s;
	animation-fill-mode:both;
	animation-iteration-count: infinite;
}
















/*@keyframes zoomIn1 {*/
	/*0% {*/
		/*opacity: 0;*/
		/*transform:none;*/
	/*}*/
	/*45% {*/
		/*opacity: 0;*/
		/*transform: scale3d(.3, .3, .3);*/
	/*}*/
	/*50% {*/
		/*opacity: 1;*/
		/*transform: none;*/

	/*}*/
	/*60% {*/
		/*opacity: 1;*/
		/*transform: none;*/

	/*}*/
	/*65% {*/
		/*opacity: 0;*/
		/*transform: none;*/

	/*}*/
	/*100% {*/
		/*opacity:0;*/
		/*transform:none;*/
	/*}*/
/*}*/
/*.zoomIn1 {*/
	/*animation-name: zoomIn1;*/
	/*animation-duration:16s;*/
	/*animation-timing-function:ease;*/
	/*animation-delay:0s;*/
	/*animation-fill-mode:both;*/
	/*animation-iteration-count: infinite;*/
/*}*/
/*@keyframes zoomIn2 {*/
	/*0% {*/
		/*opacity: 0;*/
		/*transform:none;*/
	/*}*/
	/*65% {*/
		/*opacity: 0;*/
		/*transform: scale3d(.3, .3, .3);*/
	/*}*/
	/*70% {*/
		/*opacity: 1;*/
		/*transform: none;*/

	/*}*/
	/*80% {*/
		/*opacity: 1;*/
		/*transform: none;*/

	/*}*/
	/*85% {*/
		/*opacity:0;*/
		/*transform: none;*/

	/*}*/
	/*100% {*/
		/*opacity:0;*/
		/*transform:none;*/
	/*}*/
/*}*/
 /*.zoomIn2 {*/
	/*animation-name: zoomIn2;*/
	/*animation-duration:16s;*/
	/*animation-timing-function:ease;*/
	/*animation-delay:0s;*/
	/*animation-fill-mode:both;*/
	/*animation-iteration-count: infinite;*/
/*}*/
/*@keyframes zoomIn3 {*/
	/*0% {*/
		/*opacity: 0;*/
		/*transform:none;*/
	/*}*/
	/*85% {*/
		/*opacity: 0;*/
		/*transform: scale3d(.3, .3, .3);*/
	/*}*/
	/*90% {*/
		/*opacity: 1;*/
		/*transform: none;*/

	/*}*/

	/*100% {*/
		/*opacity: 1;*/
		/*transform:none;*/
	/*}*/
/*}*/
 /*.zoomIn3 {*/
	/*animation-name: zoomIn3;*/
	/*animation-duration:16s;*/
	/*animation-timing-function:ease;*/
	/*animation-delay:0s;*/
	/*animation-fill-mode:both;*/
	/*animation-iteration-count: infinite;*/
/*}*/