﻿body,p,h1,h2{ font-family: "Microsoft YaHei"; margin: 0px; padding: 0px;}
a{ text-decoration: none;}
.s_left, .s_right, .switch_list span{ background: url(../img3/sp_png24.png) no-repeat;}
.wrapper{ height: 490px; position: relative;width:960px; margin: 0 auto;}
.content2{ width:960px; margin:0 auto; overflow: hidden;  height: 490px;}
.bgs_box{ position:absolute; right:0; top:0; width:100%; height:100%;opacity:0;filter:alpha(opacity=0);}
.bg_colors .on{opacity:1;filter:alpha(opacity=100)}
.item_txt_box{ position:absolute; top:0; left:0px;}
.item_txt{ position:absolute; top:0; left:-9999px;}
.item_txt_box .on{ left:0;}

.bgs_box .wp{ position:absolute; left:50%;  bottom:0px;  }
.bgs_1{ background:url(../img3/bg1.jpg) no-repeat center top; background-size:100% 100%;}
.detail-01{
	width: 300px;
	height: 334px;
	position: relative; 
	background: url(../img3/world1.png) no-repeat;
	right: -650px; 
	top: 90px; 
}
.detail-02{
	width: 273px;
	height: 231px;
	position: relative; 
	background: url(../img3/world2.png) no-repeat;
	right: -600px; 
	top: 20px; 
}
.detail-03{
	width: 414px;
	height: 269px;
	position: relative; 
	background: url(../img3/world3.png) no-repeat;
	right: -480px; 
	top: 80px; 
}

.detail-04{
	width: 348px;
	height: 231px;
	position: relative; 
	background: url(../img3/world4.png) no-repeat;
	right: -100px; 
	top: 80px; 
}
.detail-04 a{ position: absolute; bottom: 20px; right: 20px; color: #0065b3;}
.bgs_2{ background:url(../img3/bg2.jpg) no-repeat center top; background-size:100% 100%;}
.bgs_2 .s_img{ background:url(../img3/s_img2.png) no-repeat; width:626px; height:385px; }

.bgs_3{ background:url(../img3/bg3.jpg) no-repeat center top; background-size:100% 100%; z-index:0;}
.bgs_3 .s_img{ background:url(../img3/s_img3.png) no-repeat; width:673px; height:440px;}

.bgs_4{ background:url(../img3/bg4.jpg) no-repeat center top; background-size:100% 100%; z-index:0;}
.bgs_4 .s_img{ background:url(../img3/s_img3.png) no-repeat; width:673px; height:440px;}

.s_left, .s_right{ width:64px; height:64px; position:absolute; top:50%; 
	margin-top:-30px; cursor:pointer; z-index:10;}
.s_left{ background-position:0 0; left:10px;}
.s_left:hover{ background-position:0 -64px;}
.s_right{ background-position:-64px 0; right:10px;}
.s_right:hover{ background-position:-64px -64px;}

.switch_list{ position:absolute; left:50%; bottom:2%; height:11px; margin-left:-30px; text-align:center; z-index:10; overflow:hidden;}
.switch_list span{ background-position:-141px -54px;  _background: url(../img3/dot.png) no-repeat -14px 0; float:left; vertical-align:top; width:11px; height:11px;overflow:hidden;  margin:0 14px 0 0; cursor:pointer;}
.switch_list .on{  background-position:-127px -54px; _background-position:0 0;}

.item_img_css3{
	-webkit-animation:img_item .5s ease-out;
	animation:img_item .5s ease-out;
}

@-webkit-keyframes img_item{
	0%{-webkit-transform:translateX(100px); opacity:0}
	100%{-webkit-transform:translateX(0);  opacity:1}
}
@keyframes img_item{
	0%{transform:translateX(100px);opacity:0}
	100%{transform:translateX(0); opacity:1}
}

.item_txt_css3{
	-webkit-animation:txt_item .5s ease-out;
	animation:txt_item .5s ease-out;
}
@-webkit-keyframes txt_item{
	0%{-webkit-transform:translateX(100px); opacity:0}
	100%{-webkit-transform:translateX(0);  opacity:1}
}
@keyframes txt_item{
	0%{transform:translateX(100px);opacity:0}
	100%{transform:translateX(0); opacity:1}
}

