body.noscroll {
	overflow: hidden;
}

/* 整个遮罩层 */
.navigate-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	z-index: 10000;
	display: none;
}

/* 另一种导航遮罩层 */
.navigate-overlay-top,
.navigate-overlay-bottom,
.navigate-overlay-left,
.navigate-overlay-right {
	position: absolute;
	background: rgba(0,0,0,0.5);
	z-index: 10000;
	display: none;
}
.navigate-overlay-top {
	top: 0;
	left: 0;
	right: 0;
}
.navigate-overlay-bottom {
	left: 0;
	right: 0;
}
.navigate-overlay-left {
	left: 0;
}
.navigate-overlay-right {
	right: 0;
}

.navigate-step {
	position: absolute;
	z-index: 10001;
	display: none;
	cursor: default;
}

.navigate-step > .step {
	position: absolute;
}

.navigate-step .button-groups {
	position: absolute;
	height: 32px;
}

.navigate-step .button-groups > a {
	width: 100px;
	height: 32px;
	line-height: 30px;
	color: #fff;
	text-align: center;
	background-color: #ED6C44;
	margin: 0 8px;
	float: left;
	cursor: pointer;
}

.navigate-step .button-groups > a:hover {
	background-color: #FF7F57;
}

.navigate-step.step1 {
	width: 604px;
	height: 286px;
	background-image: url("../img/navigate/step1.png");
	top: 200px;
	left: 50%;
	margin-left: -302px;
}

.navigate-step.step1 > .button-groups {
	bottom: 50px;
	left: 120px;
}

.navigate-step.step2 {
	width: 1200px;
	height: 548px;
	top: 572px;
	left: 50%;
	margin-left: -600px;
	background-image: url("../img/navigate/bg2.png");
}

.navigate-step.step2 > .step {
	width: 540px;
	height: 386px;
	background-image: url("../img/navigate/step2.png");
	top: -100px;
	left: 50%;
	margin-left: -270px;
}

.navigate-step.step2 > .step > .button-groups {
	bottom: 46px;
	left: 190px;
}

.navigate-step.step3 {
	width: 1200px;
	height: 632px;
	top: 1072px;
	left: 50%;
	margin-left: -600px;
	background-image: url("../img/navigate/bg3.png");
}

.navigate-step.step3 > .step {
	width: 708px;
	height: 374px;
	background-image: url("../img/navigate/step3.png");
	right: 96px;
	bottom: 142px;
}

.navigate-step.step3 > .step > .button-groups {
	bottom: 42px;
	left: 182px;
}

.navigate-step.step4 {
	width: 1200px;
	height: 468px;
	top: 1642px;
	left: 50%;
	margin-left: -600px;
	background-image: url("../img/navigate/bg4.png");
}

.navigate-step.step4 > .step {
	width: 458px;
	height: 418px;
	background-image: url("../img/navigate/step4.png");
	top: -160px;
	right: 60px;
}

.navigate-step.step4 > .step > .button-groups {
	bottom: 42px;
	left: 144px;
}

.navigate-step.step5 {
	width: 262px;
	height: 558px;
	top: -52px;
	left: -56px;
	background-image: url("../img/navigate/bg5.png");
}

.navigate-step.step5 > .step {
	width: 420px;
	height: 456px;
	background-image: url("../img/navigate/step5.png");
	bottom: 40px;
	left: -440px;
}

.navigate-step.step5 > .step > .button-groups {
	bottom: 46px;
	left: 100px;
}

.navigate-step.step6 {
	width: 308px;
	height: 184px;
	top: 3px;
	left: 50%;
	margin-left: -550px;
	background-image: url("../img/navigate/bg6.png");
}

.navigate-step.step6 > .step {
	width: 500px;
	height: 412px;
	background-image: url("../img/navigate/step6.png");
	top: 10px;
	right: -180px;
}

.navigate-step.step6 > .step > .button-groups {
	bottom: 40px;
	left: 160px;
}

.navigate-step.step7 {
	width: 168px;
	height: 104px;
	top: 0;
	left: 50%;
	margin-left: 380px;
	background-image: url("../img/navigate/bg7.png");
}

.navigate-step.step7 > .step {
	width: 546px;
	height: 432px;
	background-image: url("../img/navigate/step7.png");
	top: 10px;
	right: 180px;
}

.navigate-step.step7 > .step > .button-groups {
	bottom: 48px;
	left: 134px;
}

.navigate-step.step8 {
	width: 1106px;
	height: 602px;
	top: 430px;
	left: 50%;
	margin-left: -553px;
	background-image: url("../img/navigate/bg8.png");
}

.navigate-step.step8 > .step {
	width: 408px;
	height: 446px;
	background-image: url("../img/navigate/step8.png");
	bottom: 82px;
	right: 34px;
}

.navigate-step.step8 > .step > .button-groups {
	bottom: 36px;
	left: 76px;
}

.navigate-step.step9 {
	width: 1078px;
	height: 292px;
	top: 960px;
	left: 50%;
	margin-left: -539px;
	background-image: url("../img/navigate/bg9.png");
}

.navigate-step.step9 > .step {
	width: 638px;
	height: 328px;
	background-image: url("../img/navigate/step9.png");
	top: -220px;
	right: 0;
}

.navigate-step.step9 > .step > .button-groups {
	bottom: 48px;
	left: 180px;
}

.navigate-step.step10 {
	width: 508px;
	height: 366px;
	background-image: url("../img/navigate/step10.png");
	top: 200px;
	left: 50%;
	margin-left: -254px;
}

.navigate-step.step10 > .button-groups {
	bottom: 50px;
	left: 104px;
}