@charset "utf-8";
/* CSS Document */
#guideContainer
{
    width: 1440px;
	overflow: hidden;
	background-color: #000;
	position: relative;
}

#guideControllers
{
	top: 50%;
	margin-top: -304px;
	z-index:10;
	list-style: none;
}

.guideControllers_fixed
{
	position: fixed;
	right: 65px;
}

.guideControllers_absolute
{
	position: absolute;
	right: 65px;
}

#guideControllers li
{
	width: 12px;
	height: 12px;
	float:left;
	margin:10px;
	background-image: url("../images/guide/guideControllers.png");
	background-position: 0% -13px;
	cursor: pointer;
}

#guideActor
{
	width: 8640px;
	height: 100%;
	list-style: none;
	position:relative;
}

#guideActor p
{
	text-indent:0px;
}

#guideActor li
{
	width: 1440px;
	height: 100%;
	float:left;
	color: #fff;
	position:relative;
}

.guide
{
    background-image: url("../images/guide/guide_bg01.jpg");
    background-repeat: no-repeat;
    background-position: left center;
}

.guideBg
{
	width: 100%;
	height: 100%;
	background-image: url("../images/guide/guide_bg02.png");
	background-repeat: no-repeat;
    background-position: left center;
	position: absolute;
}


.guide .image
{
    position: absolute;
    left: 180px;
    width: 1120px;
    height: 100%;
    background-image: url("../images/guide/guide_img.png");
    background-repeat: no-repeat;
	background-position: left center;
}

.guide .txt
{
    position: absolute;
    left: 654px;
    top: 380px;
	margin-top: 73px;
}

.data
{
	background-image: url("../images/guide/data_bg.jpg");
	background-position: -40px center;
}

.data div
{
	position: absolute;
	top: 50%;
	left: 50%;
	opacity: 0;
}

.data div img
{
	width: 100%;
	float: left;
}

.data h3
{
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -464px;
	margin-top: -115px;
}

.data a
{
	position: absolute;
	top: 50%;
	left: 50%;
	color: #000;
	padding: 5px 22px;
	background-color: #fff;
	margin-left: -328px;
	margin-top: -49px;
	text-decoration: none;
}

.data p
{
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -82px;
	margin-top: 80px;
}

.shining0_1
{
	width: 5px;
	height: 5px;
	margin-top: 190px;
	margin-left: -143px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining0_2
{
	width: 5px;
	height: 5px;
	margin-top: -200px;
	margin-left: -277px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining0_3
{
	width: 3px;
	height: 3px;
	margin-top: -231px;
	margin-left: -300px;
	border-radius: 1px;
	box-shadow: 0px 0px 10px 2px #e05614;
}

.shining0_4
{
	width: 5px;
	height: 5px;
	margin-top: -241px;
	margin-left: -265px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining0_5
{
	width: 5px;
	height: 5px;
	margin-top: -285px;
	margin-left: -181px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining1_1
{
	width: 5px;
	height: 5px;
	margin-top: -228px;
	margin-left: -200px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining1_2
{
	width: 6px;
	height: 6px;
	margin-top: -113px;
	margin-left: -56px;
	border-radius: 3px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining1_3
{
	width: 8px;
	height: 8px;
	margin-top: -45px;
	margin-left: -152px;
	border-radius: 4px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining1_4
{
	width: 7px;
	height: 7px;
	margin-top: 1px;
	margin-left: -203px;
	border-radius: 3px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining1_5
{
	width: 5px;
	height: 5px;
	margin-top: 162px;
	margin-left: -178px;
	border-radius: 3px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining1_6
{
	width: 5px;
	height: 5px;
	margin-top: 180px;
	margin-left: -211px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining1_7
{
	width: 8px;
	height: 8px;
	margin-top: 6px;
	margin-left: 71px;
	border-radius: 4px;
	box-shadow: 0px 0px 10px 2px #e05614;
}

.shining2_1
{
	width: 4px;
	height: 4px;
	margin-top: 42px;
	margin-left: 147px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining2_2
{
	width: 4px;
	height: 4px;
	margin-top: 49px;
	margin-left: 155px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining2_3
{
	width: 4px;
	height: 4px;
	margin-top: 54px;
	margin-left: 146px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining2_4
{
	width: 5px;
	height: 5px;
	margin-top: -172px;
	margin-left: 286px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining2_5
{
	width: 5px;
	height: 5px;
	margin-top: -168px;
	margin-left: 315px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining2_6
{
	width: 5px;
	height: 5px;
	margin-top: -207px;
	margin-left: 330px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #ff4700;
}

.shining2_10
{
	width: 8px;
	height: 8px;
	margin-top: 12px;
	margin-left: 37px;
	border-radius: 4px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining2_11
{
	width: 9px;
	height: 9px;
	margin-top: -148px;
	margin-left: -227px;
	border-radius: 4px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining2_12
{
	width: 9px;
	height: 9px;
	margin-top: -149px;
	margin-left: -101px;
	border-radius: 4px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining2_13
{
	width: 5px;
	height: 5px;
	margin-top: 92px;
	margin-left: -227px;
	border-radius: 2px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining2_14
{
	width: 9px;
	height: 9px;
	margin-top: 97px;
	margin-left: -203px;
	border-radius: 4px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining2_15
{
	width: 9px;
	height: 9px;
	margin-top: 80px;
	margin-left: -128px;
	border-radius: 4px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining2_16
{
	width: 3px;
	height: 3px;
	margin-top: 41px;
	margin-left: 312px;
	border-radius: 1px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining2_17
{
	width: 10px;
	height: 10px;
	margin-top: 200px;
	margin-left: -185px;
	border-radius: 5px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining2_18
{
	width: 6px;
	height: 6px;
	margin-top: -43px;
	margin-left: 13px;
	border-radius: 3px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining3_1
{
	width: 10px;
	height: 10px;
	margin-top: -83px;
	margin-left: 176px;
	border-radius: 5px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}

.shining3_2
{
	width: 6px;
	height: 6px;
	margin-top: -33px;
	margin-left: 285px;
	border-radius: 3px;
	box-shadow: 0px 0px 10px 2px #32d6ff;
}
.stage
{
	background-image: url("../images/guide/stage_bg.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-color: #ab0d02;
}

.stage h3
{
	height: 54px;
	clear: both;
}

.stage span
{
	float: left;
}

.stage a
{
	float: left;
	margin: 6px 0px 0px 10px;
	background-color: #fff;
	color: #000;
	padding: 10px 20px;
	text-decoration: none;
}

.stage div
{
	position: absolute;
}

.stageImage_1
{
	top:50%;
	left: 130px;
	margin-top: -260px;
}

.stageImage_2
{
	top:50%;
	right: 303px;
	margin-top: -100px;
}

.stage_1
{
	width: 470px;
	top: 50%;
	right: 281px;
	margin-top: -266px;
}

.stage_2
{
	width: 420px;
	top: 50%;
	left: 138px;
	margin-top: 100px;
}

.font_16px
{
	font: 16px/1.5 "微软雅黑";
}

.font_46px
{
	font: 49px/1.2 "微软雅黑";
	font-weight: bold;
}

#wechatContain
{
	background-color: #fff;
}

#wechatContain .text
{
	width: 240px;
	position: absolute;
	top: 50%;
	color:#000;
	font: 48px/1.2 '微软雅黑';
	margin-top: -62px;
}

#wechatContain .text_1
{
	left: 148px;
}

#wechatContain .text_1 span
{
	color: #aa0d01;
}

#wechatContain .text_2
{
	right: 294px;
}

#wechatBox
{
	width: 498px;
	height: 495px;
	background-image: url("../images/guide/html5.png");
	position:absolute;
	top:50%;
	left: 50%;
	margin:-247px 0px 0px -322px;
}

#bullet01
{
	width: 2px;
	height: 8px;
	background-color: #72302a;
	position:absolute;
	left:135px;
	bottom:43px;
}

#bullet02
{
	width: 2px;
	height: 8px;
	background-color: #72302a;
	position:absolute;
	left:135px;
	bottom:43px;
}

#tank01
{
	width: 113px;
	height: 13px;
	position: absolute;
	left: 25px;
	bottom: 131px;
	overflow: hidden;
}

#tank02
{
	width: 96px;
	height: 13px;
	position: absolute;
	left: 160px;
	bottom: 113px;
	overflow: hidden;
}

#tank03
{
	width: 133px;
	height: 13px;
	position: absolute;
	left: 126px;
	bottom: 181px;
	overflow: hidden;
}

.tank
{
	width: 18px;
	height: 13px;
	position: absolute;
	right: 0px;
	background-image: url("../images/guide/tank.png");
	background-position: 0% -13px;
}

#tank03 .tank
{
	left: 0px;
	background-image: url("../images/guide/tank.png");
	background-position: 0% 0px;
}

.tankBullet
{
	width: 2px;
	height: 2px;
	position: absolute;
	top: 6px;
	background-color: #aa0d01;
}

.tankLeft
{
	left: 0px;
}

.tankRight
{
	left: 16px;
}

#bug
{
	width:11px;
	height:11px;
	position:absolute;
	top:0px;
	right:0px;
	background-image:url("../images/guide/eating.png");
	background-position: 0% 0%;
	background-repeat: no-repeat;
	z-index: 11;
}

#bug img
{
	float: left;
}

.eating
{
	height:11px;
	width:11px;
	background-color: #fff;
	position:absolute;
}

#eating01
{
	top:133px;
	left:329px;
}

#eating02
{
	top:0px;
	right:0px;
}

#eating03
{
	bottom:0px;
	right:0px;
}

#eating04
{
	top:0px;
	left:0px;
}

#eating05
{
	bottom:0px;
	right:0px;
}

#eating06
{
	bottom:0px;
	left:0px;
}

#eating07
{
	top:0px;
	right:0px;
}

#eating08
{
	bottom:0px;
	left:0px;
}

#eating09
{
	top:0px;
	left:0px;
}

#eating10
{
	bottom:0px;
	right:0px;
}

#ghost
{
	width:34px;
	height:37px;
	background-image:url("../images/guide/ghost.png");
	position:absolute;
	top:60px;
	right:57px;
}

#mario
{
	width:49px;
	height:72px;
	background-image:url("../images/guide/mario.png");
	position:absolute;
	bottom:30px;
	right:163px;
}

.net
{
	background-color: #aa0d01;
}

.net div
{
	position: absolute;
}

.net_contain
{
	top: 50%;
	left: 50%;
	width:665px;
	height: 550px;
	margin-top: -275px;
	margin-left: -392px;
}

.pc
{
	width: 488px;
	height: 441px;
	top:0px;
	left: 117px;
	background-image: url("../images/guide/pc.png");
}
.pad
{
	width: 212px;
	height: 228px;
	top: 174px;
	left: 0px;
	background-image: url("../images/guide/pad.png");
	z-index: 10;
}
.Phone
{
	width: 77px;
	height: 184px;
	top: 227px;
	right: 10px;
	background-image: url("../images/guide/phone.png");
	z-index: 10;
}

.PhoneScreen
{
	width: 70px;
	height: 125px;
	top: 19px;
	left: 4px;
	overflow: hidden;
}

#PhoneImage
{
	width: 70px;
	height: 375px;
	background-image: url("../images/guide/phoneImage.png");
	top: 0px;
}

.padScreen
{
	width: 136px;
	height: 179px;
	top: 20px;
	left: 40px;
	overflow: hidden;
}

#padImage
{
	width: 136px;
	height: 540px;
	background-image: url("../images/guide/padImage.png");
	top: 0px;
}

.pcScreen
{
	width: 447px;
	height: 251px;
	top: 20px;
	left: 20px;
	overflow: hidden;
}

#pcImage
{
	width: 447px;
	height: 753px;
	background-image: url("../images/guide/pcImage.png");
	top: 0px;
}

.txtScreen
{
	width: 490px;
	height: 100px;
	position: absolute;
	bottom: 15px;
	left: 110px;
	overflow: hidden;
}

#netTxt
{
	list-style: none;
	width: 100%;
	position: relative;
	height: 300px;
	top: 0px;
}

#netTxt li
{
	width: 100%;
	height: 100px;
	float: none;
	background-color: #aa0d01;
}

#netTxt li h4
{
	margin: 0;
	font: 46px/1 '微软雅黑';
	clear: both;
	height:	54px;
}

#netTxt span
{
	float: left;
}

#netTxt a
{
	display: inline-block;
	float: left;
	margin: 6px 0px 0px 10px;
	background-color: #fff;
	color: #000;
	padding: 10px 20px;
	text-decoration: none;
}

.netControllerBox
{
	width: 10px;
	height: 52px;
	position: absolute;
	bottom :58px;
	right: 5px;
	background-color: #000;
}

#netControllerBg
{
	width: 10px;
	height: 16px;
	position: absolute;
	top: 8px;
	background-image: url("../images/guide/netControllerBg.png");
}

#netController
{
	list-style: none;
	width: 10px;
	height: 52px;
	position: absolute;
	top: 0;
}

#netController li
{
	width: 10px;
	height: 26px;
	background-image: url("../images/guide/netController.png");
	cursor: pointer;
}

#arrow
{
	height: 99px;
	width: 50px;
	top: 50%;
	margin-top: -51px;
	background-image: url("../images/guide/arrow.png");
	background-position: 0px 0px;
	cursor: pointer;
}

.arrow_fixed
{
	position: fixed;
	right: 50px;
}

.arrow_absolute
{
	position: absolute;
	right: 50px;
}


