*{
	margin:0;
	padding:0;
	font-family:"Microsoft Yahei";
	letter-spacing:.3px;
}

li{
	list-style-type:none;
}

html{
	width:100%;
	height:100%;
}

.wrapper{
    margin-top:70px;
	width:100%;
	height:100%;
}

/*banner----------------------------------------------------------------------------------------------------------------------------------*/
.banner{
	width:100%;
	height:600px;
	background:#f0f8f9 url("../img/odss-banner.jpg")/*tpa=http://www.xhf86.com/img/odss-banner.jpg*/ no-repeat center 0;
	text-align:center;
}
.banner-title1{
	font-size:21.8px;
	padding-top:75px;
	color:#fff;
}
.banner-title1 span{
	color:#18fa91;
}
.banner-title2{
	font-size:62.72px;
	padding-top:10px;
	padding-bottom:30px;
	color:#fff;
}
.banner-btn{
	width:170px;
	height:40px;
	background:#fff;
	color:#50da9a;
	font-size:18px;
	border-radius:3px;
	text-align:center;
	line-height:40px;
	cursor:pointer;
	margin:0 auto;
}
.banner-btn:hover,.bnner-btn:active{
	background:#50da9a;
	color:#fff;
}
.banner-point{
	margin:0 auto;
	padding-top:42px;
	width:936px;
	height:204px;
}
.bp-1,.bp-2,.bp-3{
	float:left;
	width:252px;
	height:204px;
	border-radius:3px;
	background:#fff;
}
.bp-1,.bp-2{
	margin-right:90px;
}
.bp-top{
	background:#40e2a6;
	border-radius:3px 3px 0 0;
	width:100%;
	height:72px;
	font-size:18px;
	color:#fff;
	text-align:center;
	line-height:65px;
}
.bp-img{
	position:relative;
	bottom:15px;
}
.bp-text{
	width:201px;
	height:74px;
	margin:0 auto;
	text-align:left;
	font-size:16px;
	color:#8f8f8f;
	line-height:24px;
}
.banner-continue{
	padding-top:110px;
    width:1170px;
    margin:0 auto;
    text-align:center;
}



/*media--------------------------------------------------------------------------------------------*/
.media{
	width:1170px;
	height:768px;
	margin:0 auto;
	text-align:center;
}
.media-title1{
	padding-top:80px;
	padding-bottom:5px;
}
.media-title2{
	padding-bottom:70px;
}
.media-title1,.media-title2{
	font-size:18px;
	color:#333;
}
.media-title1 span,.media-title2 span{
	font-size:24px;
	color:#4bc88e;
}
.video{
	width:758px;
	height:470px;
	background:#000;
	margin:0 auto;
}
.video-box{
	width:758px;
	height:470px;
	background:#000;
	margin:0 auto;
}
.wj-video{
	width:758px;
	height:470px;
	background:#000;
	margin:0 auto;
}
.media-continue{
	padding-top:60px;
}



/*show-------------------------------------------------------------------------------------------------------------------------------------------------*/
.show{
	width:100%;
	height:2150px;
	background:#f0f8f9;
}
/*show-top--------------------------------------------------------------------------------------------------------------------------------------*/
.show-top{
	width:800px;
	height:700px;
	margin:0 auto;
}
.show-top>p{
	font-size:36px;
	color:#333;
	padding-top:80px;
	padding-bottom:80px;
	text-align:center;
}
.st-animate{
	width:800px;
	height:500px;
	margin:0 auto;
	/*background:#fff;*/
	position:relative;
}
/*sta-pad控制pad里面所有元素的样式   目前设置的为动画结束后的位置-------------*/
.sta-pad{
	width:600px;
	height:500px;
	position:relative;
	float:left;
}
.stap-ul img{
	position:absolute;
	opacity:0;
	filter:Alpha(opacity=0);
}
.stapu-pad{
	z-index:100;
	top:500px;
}
.stapu-white{
	z-index:200;
	left:55px;
	top:50px;
}
.stapu-blue{
	z-index:300;
	/*top:26px;*/
	top:45px;
	left:181px;
}
.stapu-jiantou{
	z-index:300;
	/*top:84px;*/
	top:100px;
	left:261px;
}
.stapu-card{
	z-index:400;
	/*top:68px;*/
	top:80px;
	left:150px;
}
.stapu-green{
	z-index:500;
	/*top:224px;*/
	left:216px;
}

/*sta-icon控制里面所有icon的样式   目前设置的为动画结束后的位置--------------------*/
.stai-icon{
	width:inherit;
	height:500px;
	font-size:14px;
	color:#8f8f8f;
	position:absolute;
	left:0;
	top:0;
	z-index:600;
}
.stai-icon1,.stai-icon2,.stai-icon3,.stai-icon4,.stai-icon5{
	text-align:center;
	display:inline-block;
}
.stai-li1 img,.stai-li2 img,.stai-li3 img,.stai-li4 img,.stai-li5 img{
	margin-bottom:40px;
}
.stai-icon1{
	padding-left:15px;
}
.stai-icon1 img,.stai-icon2 img,.stai-icon3 img,.stai-icon4 img,.stai-icon5 img{
	margin-bottom:7px;
}
.stai-li1,.stai-li2,.stai-li3,.stai-li4,.stai-li5{
	position:absolute;
	z-index:600;

	opacity:0;
	filter:Alpha(opacity=0);

}
.stai-li1{
	top:91px;
	/*left:490px;*/
	left:600px;
}
.stai-li2{
	top:177px;
	/*left:571px;*/
	left:600px;
}
.stai-li3{
	top:267px;
	/*left:536px;*/
	left:560px;
}
.stai-li4{
	top:326px;
	/*left:400px;*/
	left:450px;
}
.stai-li5{
	top:371px;
	/*left:272px;*/
	left:350px;
}
.st-other1{
	position:absolute;
	z-index:1000;
	bottom:40px;
	opacity:0;
	filter:Alpha(opacity=0);
}
.st-other2{
	position:absolute;
	z-index:1000;
	top:25px;
	left:460px;
	opacity:0;
	filter:Alpha(opacity=0);
}




/*show-middle---------------------------------------------------------------------------------------------------------------------------------*/
.show-middle{
	width:800px;
	height:700px;
	margin:0 auto;
}
.show-middle>p{
	font-size:36px;
	color:#333;
	padding-top:50px;
	padding-bottom:40px;
	text-align:center;
}
.sm-animata{
	width:785px;
	height:574px;
	margin:0 auto;
	background:url("../img/odss-sm-bg.png")/*tpa=http://www.xhf86.com/img/odss-sm-bg.png*/ no-repeat ;
	position:relative;
}
.sm-icon{
	width:785px;
	height:574px;
	position:relative;
}
.sm-icon1,.sm-icon2,.sm-icon3,.sm-icon4,
.sm-grey-icon1,.sm-grey-icon2,.sm-grey-icon3{
	display:inline-block;
	text-align:center;
	position:absolute;
	z-index:1000px;
	opacity:0;
	filter:Alpha(opacity=0);
}
.sm-icon1 img,.sm-icon2 img,.sm-icon3 img,.sm-icon4 img,
.sm-grey-icon1 img,.sm-grey-icon2 img,.sm-grey-icon3 img{
	margin-bottom:5px;
}
.sm-icon1{
	font-size:18px;
	color:#e83139;
	top:50px;
	left:360px;
}
.sm-icon2{
	font-size:17px;
	color:#50b4f4;
	top:200px;
	left:95px;
}
.sm-icon3{
	font-size:16.84px;
	color:#28bdb3;
	top:486px;
	left:390px;
}
.sm-icon4{
	font-size:19.55px;
	color:#f7a246;
	top:425px;
	left:150px;
}
.sm-grey-icon1,.sm-grey-icon2,.sm-grey-icon3{
	font-size:14px;
	color:#8f8f8f;
}
.sm-grey-icon1{
	top:360px;
	left:20px;
}
.sm-grey-icon2{
	top:348px;
	left:340px;
}
.sm-grey-icon3{
	top:20px;
	left:220px;
}

.sm-other1,.sm-other2,.sm-other3{
	position:absolute;
	z-index:1500;
	opacity:0;
	filter:Alpha(opacity=0);
}
.sm-other1{
	top:255px;
	left:455px;
}
.sm-other2{
	top:125px;
}
.sm-other3{
	top:327px;
	left:189px;
}
.sm-rada{
	position:absolute;
/*	top:-70px;
	left:25px;*/
	top:-50px;
	left:-43px;
	z-index:1500;

}
.sm-logo{
	position:absolute;
	left:246px;
	top:246px;
	z-index:3000;
}




/*show-bottom---------------------------------------------------------------------------------------------------------------------------------*/
.show-bottom{
	width:800px;
	height:700px;
	margin:80px auto 0 auto;
}
.show-bottom>p{
	font-size:36px;
	color:#333;
	text-align:center;
	padding-bottom:75px;
}
.sb-animate{
	width:770px;
	height:470px;
	margin:0 auto;
	position:relative;
	background:url("../img/odss-sb-bg.png")/*tpa=http://www.xhf86.com/img/odss-sb-bg.png*/ no-repeat;
}
.sb-icon{
	width:200px;
	height:inherit;
	position:absolute;
	left:285px;
	z-index:500;
	text-align:center;
	position:relative;
	display:inline-block;
}
.sb-icon1,.sb-icon2,.sb-icon3,.sb-icon4,.sb-icon5{
	position:absolute;
	opacity:0;
	filter:Alpha(opacity=0);
}
.sb-icon1{
	/*top:35px;*/
	left:22px;
	top:80px;
}
.sb-icon2{
	/*top:74px;*/
	left:16px;
	top:150px;
}
.sb-icon3{
	/*top:120px;*/
	left:10px;
	top:200px;
}
.sb-icon4{
	/*top:170px;*/
	left:3px;
	top:280px;
}
.sb-icon5{
	/*top:235px;*/
	left:-6px;
	top:400px;
}

.sb-line{
	width:400px;
	height:inherit;
	display:inline-block;
	position:absolute!important;
	left:185px;
	z-index:200;
}
.sb-line1,.sb-line2,.sb-line3,.sb-line4,.sb-line5{
	position:absolute;
	opacity:0;
	filter:Alpha(opacity=0);
}
.sb-line1{
	left:66px;
	top:-40px;
}
.sb-line2{
	left:80px;
	top:-2px;
}
.sb-line3{
	left:-30px;
	top:90px;
}
.sb-line4{
	left:57px;
	top:107px;
}
.sb-line5{
	left:64px;
	top:150px;
}


/*action--------------------------------------------------------------------------------------------------------------------------------*/
.action{
	width:100%;
	height:270px;
}
.action-p{
	padding-top:75px;
	padding-bottom:30px;
	font-size:36px;
	text-align:center;
	color:#333;
}
.action-btn{
	margin:0 auto;
	width:170px;
	height:46px;
	border-radius:3px;
	font-size:18px;
	text-align:center;
	line-height:46px;
	color:#fff;
	background:#4bc88e;
	cursor:pointer;
}
.action-btn:hover,.action-btn:active{
	background:#00cb6d;
}