@charset "gb2312";
/* CSS Document */

html,body{ width:100%; height:100%; overflow:hidden; margin:0 auto;}

.section-wrap
{ 
	width:100%;
	height:100%;
	overflow:visible;
	transition:transform 0.5s cubic-bezier(0.86,0,0.03,1);
	-webkit-transition:-webkit-transform 0.5s cubic-bezier(0.86,0,0.03,1);
	-moz-transition:-moz-transform 0.5s cubic-bezier(0.86,0,0.03,1);
	-ms-transition:-ms-transform 0.5s cubic-bezier(0.86,0,0.03,1);
	-o-transition:-o-transform 0.5s cubic-bezier(0.86,0,0.03,1);
	margin:0 auto;
}
.section-wrap .section{ position:relative; width:100%; height:100%; background-position:center center; background-repeat:no-repeat; max-width:640px;}
.section-wrap .section img{ width:100%; height:100%;}
.section-wrap .section .title{width:100%;position:absolute;color:#fff;font-size:2.4em;text-align:center;opacity: 0; bottom:0px;}
.section-wrap .section .title img{ width:100%; height:auto;vertical-align:bottom;}							
.section-wrap .section-1{
	background:url(http://news.youth.cn/images/yzs-fm-01-002.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
	
}								
.section-wrap .section-2{
	background:url(http://news.youth.cn/images/yzs-ml-02-002.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-3{ 
	background:url(http://news.youth.cn/images/yzs-hyhd-03-003.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-4{ 
	background:url(http://news.youth.cn/images/yzs-lhsy-04-003.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-5{ 
	background:url(http://news.youth.cn/images/yzs-lzxs-05-002.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-6{ 
	background:url(http://news.youth.cn/images/yzs-cs-06-002.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-7{ 
	background:url(http://news.youth.cn/images/yzs-mskc-08-002.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-8{ 
	background:url(http://news.youth.cn/images/yzs-dtgz-09-002.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-9{ 
	background:url(http://news.youth.cn/images/yzs-schy-010-002.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-10{ 
	background:url(http://news.youth.cn/images/yzs-wswj-011-003.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-11{
	background:url(http://news.youth.cn/images/yzs-wswj-012-003.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-12{ 
	background:url(http://news.youth.cn/images/yzs-wswj-013-003.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-13{ 
	background:url(http://news.youth.cn/images/yzs-wswj-014-002.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}
.section-wrap .section-14{
	background:url(http://news.youth.cn/images/yzs-wswj-015-003.jpg) no-repeat top center;
	-moz-background-size:100% 100%;
	-ms-background-size:100% 100%;
	-o-background-size:100% 100%;
	background-size:100% 100%;
}

.section-btn{ width:14px;position:fixed;right:4%;top:50%;}
.section-btn li{ width:14px;height:14px;cursor:pointer;text-indent:-9999px;border-radius:50%;-webkit-border-radius:50%;margin-bottom:12px; background:#BD362F;text-align:center; color:#fff; onsor:pointer;}
.section-btn li.on{ background:#fff}
.arrow{ opacity:1;animation:arrow 3s cubic-bezier(0.5,0,0.1,1) infinite;-webkit-animation:arrow 3s cubic-bezier(0.5,0,0.1,1) infinite;transform:rotate(-90deg);-webkit-transform:rotate(-90deg); position:absolute;bottom:10px;left:50%;margin-left:-30px;width:60px;height:60px;border-radius:100%;-webkit-border-radius:100%;line-height:60px;text-align:center;font-size:20px;color:#fff;border:1px solid #fff;cursor:pointer;overflow:hidden;}
.arrow:hover{ animation-play-state:paused;-webkit-animation-play-state:paused;}
@keyframes arrow{ %0,%100{bottom:10px; opacity:1;} 50%{bottom:50px; opacity:0.5} }
@-webkit-keyframes arrow{ %0,%100{bottom:10px; opacity:1;} 50%{bottom:50px; opacity:0.5} }
@-moz-keyframes arrow{ %0,%100{bottom:10px; opacity:1;} 50%{bottom:50px; opacity:0.5} }
@-ms-keyframes arrow{ %0,%100{bottom:10px; opacity:1;} 50%{bottom:50px; opacity:0.5} }
@-o-keyframes arrow{ %0,%100{bottom:10px; opacity:1;} 50%{bottom:50px; opacity:0.5} }


@keyframes bounceInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
		-moz-transform: translateY(2000px);
		-ms-transform: translateY(2000px);
		-o-transform: translateY(2000px);
		transform: translateY(2000px)
	}
	100% {
		bottom:0;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0)
	}
}

@-o-keyframes bounceInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
		-moz-transform: translateY(2000px);
		-ms-transform: translateY(2000px);
		-o-transform: translateY(2000px);
		transform: translateY(2000px)
	}
	100% {
		bottom:0;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0)
	}
}

@-ms-keyframes bounceInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
		-moz-transform: translateY(2000px);
		-ms-transform: translateY(2000px);
		-o-transform: translateY(2000px);
		transform: translateY(2000px)
	}
	100% {
		bottom:0;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0)
	}
}

@-moz-keyframes bounceInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
		-moz-transform: translateY(2000px);
		-ms-transform: translateY(2000px);
		-o-transform: translateY(2000px);
		transform: translateY(2000px)
	}
	100% {
		bottom:0;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0)
	}
}

@-webkit-keyframes bounceInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
		-moz-transform: translateY(2000px);
		-ms-transform: translateY(2000px);
		-o-transform: translateY(2000px);
		transform: translateY(2000px)
	}
	100% {
		bottom:0;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0)
	}
}

.section-wrap .section .active-donghua .bounceInUp {
	animation-name: bounceInUp;		/*必须有的 引用类名 bounceInLeft跟上面的类名一样*/
	opacity:1;							/*显示	 */
	animation-duration:1s;				/* 滑动时间*/
	animation-fill-mode:both; 			/*属性规定动画在播放之前或之后，其动画效果是否可见*/
	animation-iteration-count:1; /*页面效果执行几次*/
	
	/*兼容*/
	-webkit-animation-name: bounceInUp;
	-moz-animation-name: bounceInUp;
	-ms-animation-name: bounceInUp;
	-o-animation-name: bounceInUp;
	-webkit-animation-duration:2s; 
	-moz-animation-duration:2s;
	-ms-animation-duration:2s;
	-o-animation-duration:2s;
	-webkit-animation-fill-mode:both; 
	-moz-animation-fill-mode:both; 
	-ms-animation-fill-mode:both; 
	-o-animation-fill-mode:both; 
	-webkit-animation-iteration-count:1;
	-moz-animation-iteration-count:1;
	-ms-animation-iteration-count:1;
	-o-animation-iteration-count:1;
}

@-webkit-keyframes bounceOut {
	0% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1)
	}

	25% {
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		-ms-transform: scale(.95);
		-o-transform: scale(.95);
		transform: scale(.95)
	}

	50% {
		opacity: 1;
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-o-transform: scale(1.1);
		transform: scale(1.1)
	}

	100% {
		opacity: 0;
		-webkit-transform: scale(.3);
		-moz-transform: scale(.3);
		-ms-transform: scale(.3);
		-o-transform: scale(.3);
		transform: scale(.3)
	}
}
@-moz-keyframes bounceOut {
	0% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1)
	}

	25% {
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		-ms-transform: scale(.95);
		-o-transform: scale(.95);
		transform: scale(.95)
	}

	50% {
		opacity: 1;
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-o-transform: scale(1.1);
		transform: scale(1.1)
	}

	100% {
		opacity: 0;
		-webkit-transform: scale(.3);
		-moz-transform: scale(.3);
		-ms-transform: scale(.3);
		-o-transform: scale(.3);
		transform: scale(.3)
	}
}
@-ms-keyframes bounceOut {
	0% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1)
	}

	25% {
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		-ms-transform: scale(.95);
		-o-transform: scale(.95);
		transform: scale(.95)
	}

	50% {
		opacity: 1;
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-o-transform: scale(1.1);
		transform: scale(1.1)
	}

	100% {
		opacity: 0;
		-webkit-transform: scale(.3);
		-moz-transform: scale(.3);
		-ms-transform: scale(.3);
		-o-transform: scale(.3);
		transform: scale(.3)
	}
}
@-o-keyframes bounceOut {
	0% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1)
	}

	25% {
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		-ms-transform: scale(.95);
		-o-transform: scale(.95);
		transform: scale(.95)
	}

	50% {
		opacity: 1;
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-o-transform: scale(1.1);
		transform: scale(1.1)
	}

	100% {
		opacity: 0;
		-webkit-transform: scale(.3);
		-moz-transform: scale(.3);
		-ms-transform: scale(.3);
		-o-transform: scale(.3);
		transform: scale(.3)
	}
}
@keyframes bounceOut {
	0% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1)
	}

	25% {
		-webkit-transform: scale(.95);
		-moz-transform: scale(.95);
		-ms-transform: scale(.95);
		-o-transform: scale(.95);
		transform: scale(.95)
	}

	50% {
		opacity: 1;
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-o-transform: scale(1.1);
		transform: scale(1.1)
	}

	100% {
		opacity: 0;
		-webkit-transform: scale(.3);
		-moz-transform: scale(.3);
		-ms-transform: scale(.3);
		-o-transform: scale(.3);
		transform: scale(.3)
	}
}

.section-wrap .section .end-active-donghua .bounceOut {
	animation-name: bounceOut;		/*必须有的 引用类名 bounceInLeft跟上面的类名一样*/
	opacity:1;							/*显示	 */
	animation-duration:1s;				/* 滑动时间*/
	animation-fill-mode:both; 			/*属性规定动画在播放之前或之后，其动画效果是否可见*/
	animation-iteration-count:1; /*页面效果执行几次*/
	
	/*兼容*/
	-webkit-animation-name: bounceOut;
	-moz-animation-name: bounceOut;
	-ms-animation-name: bounceOut;
	-o-animation-name: bounceOut;
	-webkit-animation-duration:1s; 
	-moz-animation-duration:1s;
	-ms-animation-duration:1s;
	-o-animation-duration:1s;
	-webkit-animation-fill-mode:both; 
	-moz-animation-fill-mode:both; 
	-ms-animation-fill-mode:both; 
	-o-animation-fill-mode:both; 
	-webkit-animation-iteration-count:1;
	-moz-animation-iteration-count:1;
	-ms-animation-iteration-count:1;
	-o-animation-iteration-count:1;
}
