html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
	blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn,
	em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
	b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
	details, embed, figure, figcaption, footer, header, hgroup, menu, nav,
	output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	font-family: STHeiti, YaHei, Helvetica, Tahoma, sans-serif
}

article, aside, details, figcaption, figure, footer, header, hgroup,
	menu, nav, section {
	display: block
}

html {
	background: #fff7e2
}

body {
	line-height: 1;
	overflow: hidden
}

ol, ul {
	list-style: none
}

blockquote, q {
	quotes: none
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

#primary {
	z-index: 2000;
	position: fixed;
	top: 50%;
	right: 16px;
	margin-top: -40px
}

#primary li {
	position: relative;
	height: 26px;
	width: 26px
}

#primary a {
	display: block;
	width: 20px;
	height: 20px;
	text-indent: -9999px;
	background: url(img/nav-c.png) no-repeat
}

#primary a.active {
	background: url(img/nav-o.png) no-repeat
}

#header {
	padding: 13px 0;
	height: 44px;
	padding-left: 30px;
	background-color: #fff7e4;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, .1);
	position: fixed;
	width: 100%;
	min-width: 960px;
	opacity: .7;
	filter: alpha(opacity = 70);
	z-index: 1001
}

#menu {
	height: 100%;
	line-height: 70px;
	vertical-align: middle;
	width: 250px;
	font-size: 16px;
	padding-right: 31px;
	position: absolute;
	right: 10px;
	top: 0
}

#content {
	width: 960px;
	margin: 0 auto;
	position: relative
}

.fl {
	float: left;
	width: 100%
}

#menu span {
	padding-left: 40px
}

#menu span a {
	text-decoration: none;
	color: #333
}

#menu span a:hover {
	font-size: 16px;
	color: #41cba9;
	text-decoration: none
}

.page {
	height: 816px;
	position: relative;
	width: 100%
}

.page-1 {
	background-color: #feda89;
	z-index: 10
}

.page-2 {
	background-color: #de4f50;
	z-index: 15
}

.page-3 {
	background-color: #904a68;
	z-index: 20
}

.page-4 {
	background-color: #68c39f;
	z-index: 25
}

.footer {
	height: 210px;
	line-height: 210px;
	background-color: #fff7e4;
	z-index: 200;
	position: relative
}

#description {
	position: relative;
	width: 300px;
	z-index: 11;
	background-image: url(img/text.png?v=1);
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 57px;
	overflow: hidden;
	margin-left: 2px
}

#qrcode-wrapper {
	width: 300px;
	height: 300px;
	background: url(img/qr-bg_v2.png) left bottom no-repeat
}

#qrcode-wrapper #btn {
	position: absolute;
	bottom: 23px;
	left: 31px
}

#qrcode-wrapper #btn a {
	background: url(img/download.png) no-repeat left top;
	width: 166px;
	height: 48px;
	display: block;
	text-decoration: none;
	text-indent: -9999px
}

#qrcode-wrapper #btn a:hover {
	background: url(img/download-btn-hover.png) no-repeat left top
}

#page-1 .phone-wrapper {
	position: absolute;
	width: 449px;
	height: 531px;
	top: 50%;
	z-index: 11;
	left: 20px
}

.position div {
	position: absolute
}

#page-1 .phone-wrapper #wheel-1 {
	width: 172px;
	height: 172px;
	background: url(img/wheel-1.png);
	top: 126px;
	z-index: 1
}

#page-1 .phone-wrapper #wheel-2 {
	width: 66px;
	height: 66px;
	background: url(img/wheel-2.png) no-repeat;
	left: 371px;
	top: 124px
}

#page-1 .phone-wrapper #wheel-3 {
	width: 97px;
	height: 97px;
	background: url(img/wheel-3.png) no-repeat;
	left: 322px;
	top: 382px;
	z-index: 2
}

#page-1 .phone-wrapper #wheel-4 {
	width: 75px;
	height: 75px;
	background: url(img/wheel-4.png) no-repeat;
	left: 314px;
	top: 448px;
	z-index: 1
}

#page-1 .phone-wrapper .circle {
	width: 347px;
	height: 190px;
	background: url(img/cl.png) no-repeat;
	top: 219px;
	left: 46px;
	z-index: 4
}

#page-1 .phone {
	width: 271px;
	height: 505px;
	background: url(img/ph1.png) no-repeat;
	left: 90px;
	z-index: 3
}

#page-2 .map-wrapper {
	position: absolute;
	top: 50%;
	width: 100%;
	z-index: 16
}

#page-2 #map {
	width: 412px;
	height: 259px;
	background: url(img/map.png)
}

#page-2 #cloud {
	width: 586px;
	height: 156px;
	background: url(img/cloud.png);
	top: -199px;
	left: 79%
}

#page-2 #nail {
	width: 160px;
	height: 193px;
	background: url(img/nail.png);
	left: 149px;
	opacity: 0;
	top: -462px;
	filter: alpha(opacity = 0)
}

#page-3 #v-phone {
	width: 559px;
	height: 116px;
	background: url(img/v-phone.png)
}

#page-3 #function {
	background: url(img/fun.png);
	opacity: 0;
	filter: alpha(opacity = 0);
	width: 304px;
	height: 138px;
	top: -323px;
	left: 112px
}

#page-3 #shop {
	width: 344px;
	height: 284px;
	background: url(img/shop.png);
	left: 101px;
	opacity: 0;
	filter: alpha(opacity = 0);
	top: -704px
}

#page-3 .shop-wrapper {
	position: absolute;
	width: 100%;
	top: 50%;
	z-index: 21
}

#page-4 {
	left: 50px
}

#page-4 .gift-wrapper {
	position: absolute;
	width: 100%;
	top: 50%;
	z-index: 31;
	left: 40px
}

#page-4 #phone_2 {
	width: 200px;
	height: 277px;
	background: url(img/phone_2.png) no-repeat;
	position: absolute;
	left: 90px
}

#page-4 #phone_1 {
	width: 220px;
	height: 105px;
	background: url(img/phone_1.png) no-repeat;
	left: 79px;
	top: -105px
}

#page-4 #gift_1 {
	width: 117px;
	height: 185px;
	background: url(img/gift_1.png);
	top: 85px;
	left: 129px
}

#page-4 #gift_2 {
	width: 103px;
	height: 126px;
	background: url(img/gift_2.png);
	left: 137px;
	top: 146px
}

#page-4 #ballon {
	width: 229px;
	height: 445px;
	background: url(img/ballon.png);
	left: 36px;
	top: -200px;
	z-index: 1;
	opacity: 0;
	filter: alpha(opacity = 0)
}

#big {
	font-size: 24px;
	margin-bottom: 4px;
	color: #A56537
}

#small {
	color: #c59253;
	opacity: .8;
	filter: alpha(opacity = 80);
	font-size: 14px
}

.footer .bg {
	width: 366px;
	height: 80px;
	margin: 0 auto;
	position: relative;
	top: 50px
}

.footer ul {
	height: 100%
}

.footer li {
	float: left;
	width: 25%;
	height: 100%
}

.footer li.bg1 {
	background: url(img/bg_1.png) center center no-repeat
}

.footer li.bg2 {
	background: url(img/bg_2.png) center center no-repeat
}

.footer li.bg3 {
	background: url(img/bg_3.png) center center no-repeat
}

.footer li.bg4 {
	background: url(img/bg_4.png) center center no-repeat
}

.pop {
	position: fixed;
	z-index: 2500
}

.main {
	position: relative;
	z-index: 100
}

.pop-wrapper {
	margin: 8px;
	width: 326px;
	background: #fff
}

.sprites {
	background: url(img/pop.png) no-repeat;
	cursor: pointer;
	cursor: hand
}

.close {
	position: absolute;
	top: -5px;
	right: -6px;
	width: 27px;
	height: 27px;
	background-position: -93px -1px;
	cursor: pointer;
	cursor: hand;
	z-index: 100
}

.close:hover {
	background-position: -123px -1px
}

.shade {
	border: 0;
	background: #000;
	opacity: .6;
	filter: alpha(opacity = 16);
	position: fixed;
	z-index: 2000;
	left: 0;
	top: 0;
	overflow: hidden
}

.hide {
	display: none
}

.devices {
	padding-top: 62px;
	padding-left: 10px;
	padding-right: 10px;
	height: 139px
}

.downloads {
	padding-top: 48px;
	background: #f6f5f2;
	color: #999;
	height: 287px;
	position: relative
}

.device {
	float: left;
	margin-left: 78px
}

.android {
	background-position: 0 -39px;
	width: 74px;
	height: 138px
}

.android.active, .android:hover {
	background-position: -87px -39px
}

.iphone {
	background-position: 0 -191px;
	width: 74px;
	height: 138px
}

.iphone.active, .iphone:hover {
	background-position: -86px -190px
}

.ipad {
	background-position: 0 -343px;
	width: 74px;
	height: 138px
}

.ipad.active, .ipad:hover {
	background-position: -86px -343px
}

.wp {
	background-position: 0 -497px;
	width: 74px;
	height: 138px
}

.wp.active, .wp:hover {
	background-position: -86px -499px
}

.left-panel {
	padding: 0 74px 90px;
	width: 176px
}

.right-panel {
	position: absolute;
	width: 322px;
	height: 250px;
	top: 30px;
	right: 93px
}

.right-panel p {
	font-size: 14px;
	color: #999
}

.btns {
	padding-bottom: 20px;
	padding-top: 16px;
	border-bottom: 1px dashed #d6d1cb;
	overflow: hidden;
	margin-bottom: 19px
}

.btn {
	height: 46px;
	line-height: 49px;
	width: 121px;
	border-radius: 3px;
	font-size: 15px;
	color: #fff;
	text-align: center;
	padding-left: 25px;
	cursor: pointer;
	text-decoration: none
}

.sms-btn {
	height: 34px;
	width: 70px;
	padding: 0 15px;
	line-height: 33px;
	margin-left: 4px;
	border: 1px solid #d8d3ce;
	background-color: #fff;
	border-radius: 2px;
	text-align: center;
	color: #333;
	cursor: pointer;
	cursor: hand;
	font-size: 13px;
	position: absolute;
	right: 8px
}

.ipt {
	width: 230px;
	height: 30px;
	border: 1px solid #d8d3ce;
	border-radius: 2px;
	float: left
}

.btn-android {
	float: left;
	margin-right: 8px;
	background: url(img/android-phone.png) 11px center no-repeat #ff9000
}

.apple {
	float: left;
	background: url(img/apple.png) 7px center no-repeat #ff9000
}

.btn-android-pad {
	float: left;
	background: url(img/android-pad.png) 11px center no-repeat #ff9000
}

.qrcode-bg {
	height: 212px;
	width: 176px;
	background: url(img/qrcode-bg3.png) no-repeat;
	margin-bottom: 12px;
	position: relative
}

#qrcode-wrapper .qrcode {
	left: 52px;
	top: 98px;
	width: 120px;
	height: 120px;
}

.qrcode {
	width: 130px;
	height: 130px;
	position: absolute;
	left: 24px;
	top: 39px
}

.left-panel>p {
	text-align: center
}

#web-tip {
	background-color: #fff7e4;
	color: #666;
	font-size: 14px;
	position: absolute;
	right: 63px;
	top: 90px;
	width: 434px;
	height: 80px;
	line-height: 80px;
	text-align: center
}

#web-tip #arrow {
	position: absolute;
	border: 8px #fff7e4 solid;
	border-left-color: transparent;
	border-right-color: transparent;
	border-top-color: transparent;
	right: 37px;
	top: -16px
}

.fixed {
	position: absolute;
	right: 0;
	top: 50%;
	z-index: 1000;
	width: 300px
}

.top-1 {
	position: relative;
	top: -150px
}

.top {
	position: relative !important;
	top: -242px
}

.top-2 {
	position: relative !important;
	top: -50px
}

.top-3 {
	position: relative !important;
	top: 106px
}

.top-4 {
	position: relative !important;
	top: -45px
}

.captcha-box {
	clear: both;
	padding-top: 6px;
	display: none
}

.captcha-box img {
	float: left;
	border: 1px solid #d8d3ce;
	cursor: pointer;
	cursor: hand
}

.mobile-captcha {
	float: left;
	width: 139px;
	margin-left: 8px
}

.disabled {
	background-color: #EEE
}