/****
author:carrie,designer:zhangpei,update:20140808

*****/

.wp01{ background:url(../img/ban_bg.png) no-repeat center top #fff;margin-top:60px;_margin-top:0; min-width:1000px;}
.hd{ position:absolute; left:-999em;}
.main{width:1000px; margin:0 auto; position:relative; font-family:\5FAE\8F6F\96C5\9ED1;}
.banner{ background:url(../img/banner.png) no-repeat; height:530px; position:relative; overflow:hidden;}
.headline{ background: url(../img/headline.png) no-repeat; width:601px; height:373px; position:absolute; left:198px; top:60px; text-indent:-999em;}
.top_link01, .top_link02, .pepole_l, .pepole_r, .b_tips, #con_one_1, #con_one_2, .get_btn{ background:url(../img/sp.png) no-repeat;}
.tab_nav #one1 h3, .tab_nav #one2 h3, .s_ico01, .s_ico02, .s_ico03, .s_ico04, .s_ico05, .flip01,.flip02,.flip03,.flip04{ background:url(../img/png_24.png) no-repeat;}

.top_link01, .top_link02{ display:block; width:160px; height:43px; position:absolute; text-indent:-999em;}
.top_link01{ background-position:-10px 0; top:10px; left:20px;}
.top_link02{ background-position:-170px 0; top:10px; left:180px;}
.pepole_l, .pepole_r{ display:block; width:170px; height:107px; position:absolute; }
.pepole_l{ background-position:-4px -52px; left:120px; bottom:0;}
.pepole_r{ background-position:-197px -52px; left:715px; bottom:0;}
.b_tips{ background-position:-4px -173px; display:block; width:421px; height:81px; position:absolute; bottom:-1px; left:290px; text-indent:-999em;}
.flip01{ background-position:-4px -63px; display:block; width:63px; height:76px; position:absolute; top:108px; left:95px;}
.flip02{ background-position:-76px -60px; display:block; width:146px; height:108px; position:absolute; top:262px; left:43px;}
.flip03{ background-position:-11px -181px; display:block; width:89px; height:85px; position:absolute; top:170px; left:844px;}
.flip04{ background-position:-126px -184px; display:block; width:71px; height:68px; position:absolute; top:300px; left:800px;}

.get_packet{ padding:60px 60px 30px; height:380px; overflow:hidden;}
.packet_tab{ width:503px; height:380px; position:relative; overflow:hidden; float:left;}
.tab_con{ width:503px; height:38px; margin-top:280px; overflow:hidden;}
.tab_con p{height:38px; font-size:18px; color:#fff; line-height:35px; padding-left:35px; margin:0 auto;}
.packet_tab .p_tips{ margin-top:23px;text-align:center; color:#73011c; font-size:18px;}
.tab_nav li{ background:url(../img/packet.png) no-repeat; width:280px; height:260px; cursor:pointer; margin-bottom:25px; position:absolute; top:0; overflow:hidden;z-index:1;}
.tab_nav li.pk_on{ background:url(../img/packet_on.png) no-repeat!important; _background:url(../img/packet_on01.png) no-repeat!important; z-index:2;}
.tab_nav li h3{ width:91px; height:31px; position:absolute; top:38px; left:100px; text-indent:-999em;}
.tab_nav li p{ font-size:18px; color:#73011c; text-align:center; padding-top:138px;}
.tab_nav #one1{ left:0;}
.tab_nav #one2{ left:222px;}
.tab_nav #one1 h3{ background-position:-5px -273px;}
.tab_nav #one2 h3{ background-position:-110px -273px;}
#con_one_1{ background-position:0 -270px; width:365px; }
#con_one_2{ background-position:0 -329px; width:468px;}

.scan_code{ float:right; width:272px; text-align:center;}
.scan_code .get_btn{ background-position:-4px -386px; display:block; width:270px; height:75px; margin:25px auto 5px; text-indent:-999em;}
.scan_code p{ color:#73011c; font-size:18px;}


.wp02{ background:url(../img/rp.png) repeat-x top #ffa200; overflow:hidden; padding:70px 0 50px; min-width:1000px;}
.step{ background:url(../img/step.png) no-repeat; width:891px; height:311px; margin:0 auto 50px;}
.rule{ background:url(../img/rule_bg.png) no-repeat; width:860px; height:250px; margin:0 auto; position:relative;}
.rule{ color:#73011c;}
.rule h3{ position:absolute; left:360px; top:20px; font-size:28px;}
.rule ul{ position:absolute; top:100px; left:100px; font-size:18px; line-height:24px;}

.wp03{ background:#ff8400; overflow:hidden; min-width:1000px;}
.bt_links{ background:url(../img/links.png) no-repeat; width:851px; height:153px; margin:40px auto; position:relative;}
.bt_links a{ display:block; width:130px; height:35px; position:absolute; top:50px; text-align:right; line-height:32px; color:#73011c; font-size:14px;}
.bt_link01{ left:0;}
.bt_link02{ left:190px;}
.bt_link03{ left:520px;}
.bt_link04{ left:710px;}

.fixed_nav{ position:fixed; _position:absolute; bottom: 20%; right:10%; font-family:\5FAE\8F6F\96C5\9ED1;  font-size:14px;}
.fixed_nav a{ display:block; width:40px; height:40px; position:relative; margin-top:6px;}
.fixed_nav a span{ position:absolute; left:50px; top:9px; display:none; width:60px;color:#000;}
.fixed_nav a:hover span{ display:block; }
.s_ico01{ background-position:0 0;}
.s_ico02{ background-position:-43px 0;}
.s_ico03{ background-position:-86px 0;}
.s_ico04{ background-position:-129px 0;}
.s_ico05{ background-position:-172px 0;}

.sys_footer p.links, .sys_footer p.links a{ color:#fff!important;}
.sys_footer p, .sys_footer p a{ color:#ffdd76!important;}

.wx:hover{border: none}
.wx img{visibility: hidden;}
.wx:hover img{visibility: visible;}

.headline{-webkit-animation:upIn 1s .5s ease both; animation:upIn 1s .5s ease both;}
@-webkit-keyframes upIn{
	0%{opacity:0;-webkit-transform:translateY(280px) scale(0);}
	100%{opacity:1;-webkit-transform:translateY(0) scale(1);}
}
@keyframes upIn{
	0%{opacity:0;transform:translateY(280px) scale(0);}
	100%{opacity:1;transform:translateY(0) scale(1);}
}

.b_tips{-webkit-animation:show .5s 1s ease both; animation:show .5s 1s ease both;}
.pepole_l, .pepole_r{-webkit-animation:show .5s 1.5s ease both; animation:show .5s 1.5s ease both;}
@-webkit-keyframes show{
	0%{opacity:0;-webkit-transform:translateY(50px);}
	100%{opacity:1;-webkit-transform:translateY(0);}
}
@keyframes show{
	0%{opacity:0;transform:translateY(50px);}
	100%{opacity:1;transform:translateY(0);}
}

.flip01, .flip02, .flip03, .flip04{-webkit-animation:ani_act 2s 2s linear both; animation:ani_act 2s 2s linear both;}
@-webkit-keyframes ani_act{
	0%,100%{opacity:0;-webkit-transform:skew(0deg);}
	50%{opacity:1;-webkit-transform:skew(-15deg);}
	100%{opacity:1;-webkit-transform:skew(0);}
}
@keyframes ani_act{
	0%,100%{opacity:0;transform: skew(0deg);}
	50%{ opacity:1;transform:skew(-15deg);}
	100%{ opacity:1;transform:skew(0);}
}