﻿@charset "utf-8";
/*about zyr
 * 内容：云服务
 * 2017-10-9
 */
.icons{background: url(../images/icons_03.png) no-repeat;}
.box1{background: #f7f7f7;}
/*banner start*/
.inside-banner .bd a {
  display: block;
  position: relative;
}
.inside-banner .hd {
  text-align: center;
  position: absolute;
  z-index: 1;
  bottom: 30px;
  width: 100%;
}
.inside-banner .hd li {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  vertical-align: middle;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1px solid #fff;
  margin: 0 7px;
  font-size: 0;
  cursor: pointer;
}
.inside-banner .hd li.on {
  position: relative;
  border-color: #00c1de;
}
.banner-txt {
  position: absolute;
  width: 1180px;
  top: 0;
  left: 50%;
  margin-left: -590px;
  opacity: 0;
}
.banner-txt img {
  display: block;
}
.banner-txt .banner1-text{
	margin: 121px 0 0 32px;
}
.banner-fr{
	width: 822px;
	position: absolute;
	right: -280px;
	top: 50px;
	pointer-events: none;
	transform: translateZ(0);
	transform-style: preserve-3d;
	backface-visibility: hidden;
	display: flex;
} 
.card-content{
    transform-style: preserve-3d;
 }
.banner-fr img{
	position: absolute;
}
.banner-fr .banner-dn{
	top: 25px;
	left: 177px;
	transform: translateY(6px);
}
.banner-fr .banner-bg{
    transform: translateY(3px);
	left: -20px;
	top: -65px;
}
.banner-fr .banner-img{
    transform: translateY(2px);
	left: -8px;
	top: 153px;
}
.u-p3d {
	transform-style: preserve-3d !important;
}
.banner-base {
	position: absolute;
	top: 25px;
	right: 88px;
	width: 423px;
	height: 423px;
	transform: rotateX(72deg);
	backface-visibility: hidden;
	animation: cir 10s linear 0s infinite;
}
.ball-base {
	transform-origin: 245px 0px;
	position: absolute;
	top: 212px;
	left: -33px;
	width: 245px;
	height: 212px;
}
.ball {
	display: inline-block;
	width: 68px;
	height: 58px;
	border-radius: 50%;
	background: #051433;
	border: 1px solid #0097e8;
	background-position: center;
	background-repeat: no-repeat;
	vertical-align: middle;
	text-align: center;
	font-size: 16px;
	line-height: 26px;
	color: #fff;
	padding-top: 10px;
}
.ball-1 {
	top: 130px\9;
	left: 30px\9;
	transform: rotateX(-90deg) rotateY(0deg) translateY(-30px);
}
.ball-1 .ball{
	animation: cir1 10s linear 0s infinite;
	transition-delay: 1100ms !important;
}
.ball-2 {
	top: 245px\9;
	left: 105px\9;
	transform: rotateX(-90deg) rotateY(90deg) translateY(-30px);
}
.ball-2 .ball{
	animation: cir2 10s linear 0s infinite;
	transition-delay: 800ms !important;
}
.ball-3 {
	top: 220px\9;
	left: 340px\9;
	transform: rotateX(-90deg) rotateY(180deg) translateY(-30px);
}
.ball-3 .ball{
	animation: cir3 10s linear 0s infinite;
	transition-delay: 500ms !important;
}
.ball-4 {
	top: 120px\9;
	left: 260px\9;
	transform: rotateX(-90deg) rotateY(270deg) translateY(-30px);
}
.ball-4 .ball{
	animation: cir4 10s linear 0s infinite;
	transition-delay: 200ms !important;
}
@keyframes cir {
	0% {
		transform: rotateX(72deg) rotateZ(0deg);
		}
	100% {
		transform: rotateX(72deg) rotateZ(-360deg);
		}
}
@keyframes cir1 {
	0% {
		transform: rotateY(0deg);
	}
	100% {
		transform: rotateY(-360deg);
	}
}
@keyframes cir2 {
	0% {
		transform: rotateY(-90deg);
	}
	100% {
		transform: rotateY(-450deg);
	}
}
@keyframes cir3 {
	0% {
		transform: rotateY(-180deg);
	}
	100% {
		transform: rotateY(-540deg);
	}
}
@keyframes cir4 {
	0% {
		transform: rotateY(-270deg);
	}
	100% {
		transform: rotateY(-630deg);
	}
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.fadeIn{
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
/*banner end*/
/*服务领域 start*/
.serve-list{
	width: 1000px;
	padding: 0 0 55px;
	margin: 0 auto;
	overflow: hidden;
}
.serve-list li{
	width:300px ;
	height: 590px;
	background: #fff;
	margin: 0 10px;
	float: left;
	text-align: center;
    -webkit-transition: width .25s linear;
    -o-transition: width .25s linear;
    -moz-transition: width .25s linear;
    transition: width .25s linear;
}
.serve-list li i{
	width: 71px;
	height: 82px;
	margin: 18px 0 13px;
}
.serve-list li .serve-icon2{background-position: -71px 0;}
.serve-list li .serve-icon3{background-position: -142px 0;}
.serve-list li h4{
	font-size: 22px;
	color: #333;
	line-height: 24px;
}
.serve-list li p{
	font-size: 14px;
	line-height: 24px;
}
.serve-list li>p{
	color: #666;
	padding: 14px 0 22px;
	width: 238px;
	margin: 0 auto;
}
.serve-text{
	width: 240px;
	margin: 0 auto;
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
	text-align: center;
	color: #333;
	padding: 20px 0;
}
.serve-list li a{
	width: 160px;
	height: 46px;
	border-radius: 3px;
	text-align: center;
	line-height: 46px;
	font-size: 16px;
	color: #fff;
	background: #00aaff;
	margin-top: 25px;
}
.serve-list .active{
	width: 340px;
	background: url(../images/serve-bg_03.jpg) center top no-repeat;
}
.serve-list .active i{background-position: 0 -82px;}
.serve-list .active .serve-icon2{background-position: -71px -82px;}
.serve-list .active .serve-icon3{background-position: -142px -82px;}
.serve-list .active p,.serve-list .active h4{color: #fff;}
.serve-list .active a{background: #00c1de;}
.serve-list .active .serve-text{border-color: #fff;}
/*服务领域 end*/
/*为什么选择顶呱呱 start*/
.choose-box{background:url(../images/net_safet_whole_bg.jpg) no-repeat center top;}
.choose-box .w1200{position: relative;}
.choose-text{
	width: 650px;
	padding-bottom: 37px;
}
.choose-list{
	width: 100%;
	overflow:hidden ;
	padding: 8px 0 36px;
}
.choose-list li{
	width: 33.33%;
	text-align: center;
	float: left;
	color: #fff;
	margin-top:77px;
}
.choose-list li p{
	font-size: 16px;
	line-height: 26px;
}
.choose-list li i{
	width: 35px;
	height: 30px;
	background-position: 0 -165px;
	margin: 0 0 9px;
}
.choose-list li .choose-icon2{background-position: -35px -165px;}
.choose-list li .choose-icon3{background-position: -70px -165px;}
.choose-list li .choose-icon4{background-position: -105px -165px;}
.choose-list li .choose-icon5{background-position: -141px -165px;}
.choose-list li .choose-icon6{background-position: -175px -165px;}
.btn-box2{
	border-color: #a8a8ab;
	color: #fff;
}
.btn-box2 b{color: #fff;}
.btn-box2 a{
	border: 1px solid #a8a8ab;
	background: #44444b;
	width: 128px;
	height:50px;
	line-height: 50px;
}

/*右边动画 start*/
.net-black-div-box {
	z-index: 1;
	width: 775px;
	height: 457px;
	top: 267px;
	left: 187px;
	position: absolute;
	background: url(../images/net_black_bg.png) center no-repeat
}
.net-safety-intro-div {
	padding-left: 50px;
	height: 120px;
	width: 340px
}
.net-safety-box .auto {
	position: relative
}
.net-safety-animate-wrapper {
	position: absolute;
	top: -10px;
	right: -324px;
	width: 909px;
	height: 686px
}
.net-safety-animate-wrapper .net-safety-animate-wrapper-bg-01 {
	position: absolute;
	z-index: 3;
	top: 0;
	left: 0;
	width: 1077px;
	height: 686px;
	background: url(../images/net_safety_animate_wrapper_bg_01.png) no-repeat center
}
.net-safety-animate-wrapper-bg-02 {
	position: absolute;
	z-index: 1;
	top: 0;
	left:85px;
	width: 909px;
	height: 686px;
	background: url(../images/net_safety_animate_wrapper_bg_02.png) no-repeat center;
}
.animate-inner-box,.animate-item {
	position: absolute
}
.storage-animate-box {
	position: absolute;
	z-index: 9;
	top: 97px;
	left: 582px;
	width: 180px;
	height: 180px
}
@-webkit-keyframes storage-animate1 {
	0% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,15%,30%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@-moz-keyframes storage-animate1 {
	0% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,15%,30%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@-o-keyframes storage-animate1 {
	0% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,15%,30%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@keyframes storage-animate1 {
	0% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,15%,30%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@-webkit-keyframes storage-animate2 {
	0%,15% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,30%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@-moz-keyframes storage-animate2 {
	0%,15% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,30%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@-o-keyframes storage-animate2 {
	0%,15% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,30%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@keyframes storage-animate2 {
	0%,15% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,30%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@-webkit-keyframes storage-animate3 {
	0%,15%,30% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@-moz-keyframes storage-animate3 {
	0%,15%,30% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@-o-keyframes storage-animate3 {
	0%,15%,30% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,45% {
		background: url(../images/storage_box.png) center no-repeat;
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
@keyframes storage-animate3 {
	0%,15%,30% {
		background: url(../images/storage_empty_box.png) center no-repeat;
	}
	100%,45% {
		background: url(../images/storage_box.png) center no-repeat
	}
	60%,85% {
		background: url(../images/storage_light_box.png) center no-repeat;
	}
}
.storage-animate-item {
	width: 78px;
	height: 115px;
	background: url(../images/storage_box.png) center no-repeat
}
.storage-animate-item-01 {
	top: 0;
	left: 0
}
.storage-animate-item-02 {
	top: 36px;
	left: 52px
}
.storage-animate-item-03 {
	top: 67px;
	left: 106px
}
.storage-animate-box.active .storage-animate-item-01 {
	-webkit-animation: storage-animate1 3s both;
	-moz-animation: storage-animate1 3s both;
	-o-animation: storage-animate1 3s both;
	animation: storage-animate1 3s both
}
.storage-animate-box.active .storage-animate-item-02 {
	-webkit-animation: storage-animate2 3s both;
	-moz-animation: storage-animate2 3s both;
	-o-animation: storage-animate2 3s both;
	animation: storage-animate2 3s both
}
.storage-animate-box.active .storage-animate-item-03 {
	-webkit-animation: storage-animate3 3s both;
	-moz-animation: storage-animate3 3s both;
	-o-animation: storage-animate3 3s both;
	animation: storage-animate3 3s both
}
.storage-animate-box.reverse .storage-animate-item-01 {
	-webkit-animation: storage-animate1 3s reverse;
	-moz-animation: storage-animate1 3s reverse;
	-o-animation: storage-animate1 3s reverse;
	animation: storage-animate1 3s reverse
}
.storage-animate-box.reverse .storage-animate-item-02 {
	-webkit-animation: storage-animate2 3s reverse;
	-moz-animation: storage-animate2 3s reverse;
	-o-animation: storage-animate2 3s reverse;
	animation: storage-animate2 3s reverse
}
.storage-animate-box.reverse .storage-animate-item-03 {
	-webkit-animation: storage-animate3 3s reverse;
	-moz-animation: storage-animate3 3s reverse;
	-o-animation: storage-animate3 3s reverse;
	animation: storage-animate3 3s reverse
}
.safe-animate-box {
	z-index: 9;
	top: 242px;
	left: 116px;
	width: 396px;
	height: 315px;
	background: url(../images/safe_animate_06.png) center no-repeat;
}
@-webkit-keyframes safe-animate {
	0% {
		background: url(../images/safe_animate_01.png) center no-repeat;
	}
	12.5% {
		background: url(../images/safe_animate_02.png) center no-repeat;
	}
	25% {
		background: url(../images/safe_animate_03.png) center no-repeat;
	}
	37.5% {
		background: url(../images/safe_animate_04.png) center no-repeat;
	}
	50% {
		background: url(../images/safe_animate_05.png) center no-repeat;
	}
	62.5% {
		background: url(../images/safe_animate_06.png) center no-repeat;
	}
	75%,87.5% {
		background: url(../images/safe_animate_07.png) center no-repeat;
	}
	100% {
		background: url(../images/safe_animate_06.png) center no-repeat;
	}
}
@-moz-keyframes safe-animate {
	0% {
		background: url(../images/safe_animate_01.png) center no-repeat;
	}
	12.5% {
		background: url(../images/safe_animate_02.png) center no-repeat;
	}
	25% {
		background: url(../images/safe_animate_03.png) center no-repeat;
	}
	37.5% {
		background: url(../images/safe_animate_04.png) center no-repeat;
	}
	50% {
		background: url(../images/safe_animate_05.png) center no-repeat;
	}
	62.5% {
		background: url(../images/safe_animate_06.png) center no-repeat;
	}
	75%,87.5% {
		background: url(../images/safe_animate_07.png) center no-repeat;
	}
	100% {
		background: url(../images/safe_animate_06.png) center no-repeat;
	}
}
@-o-keyframes safe-animate {
	0% {
		background: url(../images/safe_animate_01.png) center no-repeat;
	}
	12.5% {
		background: url(../images/safe_animate_02.png) center no-repeat;
	}
	25% {
		background: url(../images/safe_animate_03.png) center no-repeat;
	}
	37.5% {
		background: url(../images/safe_animate_04.png) center no-repeat;
	}
	50% {
		background: url(../images/safe_animate_05.png) center no-repeat;
	}
	62.5% {
		background: url(../images/safe_animate_06.png) center no-repeat;
	}
	75%,87.5% {
		background: url(../images/safe_animate_07.png) center no-repeat;
	}
	100% {
		background: url(../images/safe_animate_06.png) center no-repeat;
	}
}
@keyframes safe-animate {
	0% {
		background: url(../images/safe_animate_01.png) center no-repeat;
	}
	12.5% {
		background: url(../images/safe_animate_02.png) center no-repeat;
	}
	25% {
		background: url(../images/safe_animate_03.png) center no-repeat;
	}
	37.5% {
		background: url(../images/safe_animate_04.png) center no-repeat;
	}
	50% {
		background: url(../images/safe_animate_05.png) center no-repeat;
	}
	62.5% {
		background: url(../images/safe_animate_06.png) center no-repeat;
	}
	75%,87.5% {
		background: url(../images/safe_animate_07.png) center no-repeat;
	}
	100% {
		background: url(../images/safe_animate_06.png) center no-repeat;
	}
}
.safe-animate-box.active {
	-webkit-animation: safe-animate 3s both;
	-moz-animation: safe-animate 3s both;
	-o-animation: safe-animate 3s both;
	animation: safe-animate 3s both
}
.safe-animate-box.reverse {
	-webkit-animation: safe-animate 3s both reverse;
	-moz-animation: safe-animate 3s both reverse;
	-o-animation: safe-animate 3s both reverse;
	animation: safe-animate 3s both reverse
}
.server-animate-box {
	z-index: 9;
	top: 139px;
	left: 107px;
	width: 204px;
	height: 260px;
	background: url(../images/server_animate_04.png) center no-repeat;
}
@-webkit-keyframes server-animate {
	0% {
		background: url(../images/server_animate_01.png) center no-repeat;
	}
	15% {
		background: url(../images/server_animate_02.png) center no-repeat;
	}
	30% {
		background: url(../images/server_animate_03.png) center no-repeat;
	}
	45% {
		background: url(../images/server_animate_04.png) center no-repeat;
	}
	67.5% {
	background: url(../images/server_animate_05.png) center no-repeat;
	}
	100% {
		background: url(../images/server_animate_04.png) center no-repeat;
	}
}
@-moz-keyframes server-animate {
	0% {
		background: url(../images/server_animate_01.png) center no-repeat;
	}
	15% {
		background: url(../images/server_animate_02.png) center no-repeat;
	}
	30% {
		background: url(../images/server_animate_03.png) center no-repeat;
	}
	45% {
		background: url(../images/server_animate_04.png) center no-repeat;
	}
	67.5% {
	background: url(../images/server_animate_05.png) center no-repeat;
	}
	100% {
		background: url(../images/server_animate_04.png) center no-repeat;
	}
}
@-o-keyframes server-animate {
	0% {
		background: url(../images/server_animate_01.png) center no-repeat;
	}
	15% {
		background: url(../images/server_animate_02.png) center no-repeat;
	}
	30% {
		background: url(../images/server_animate_03.png) center no-repeat;
	}
	45% {
		background: url(../images/server_animate_04.png) center no-repeat;
	}
	67.5% {
	background: url(../images/server_animate_05.png) center no-repeat;
	}
	100% {
		background: url(../images/server_animate_04.png) center no-repeat;
	}
}
@keyframes server-animate {
	0% {
		background: url(../images/server_animate_01.png) center no-repeat;
	}
	15% {
		background: url(../images/server_animate_02.png) center no-repeat;
	}
	30% {
		background: url(../images/server_animate_03.png) center no-repeat;
	}
	45% {
		background: url(../images/server_animate_04.png) center no-repeat;
	}
	67.5% {
	background: url(../images/server_animate_05.png) center no-repeat;
	}
	100% {
		background: url(../images/server_animate_04.png) center no-repeat;
	}
}
.server-animate-box.active {
	-webkit-animation: server-animate 3s;
	-moz-animation: server-animate 3s;
	-o-animation: server-animate 3s;
	animation: server-animate 3s
}
.server-animate-box.reverse {
	-webkit-animation: server-animate 3s both reverse;
	-moz-animation: server-animate 3s both reverse;
	-o-animation: server-animate 3s both reverse;
	animation: server-animate 3s both reverse
}
.net-connect-animate-box {
	z-index: 2;
	left: 290px;
	top: 0;
	width: 500px;
	height: 686px;
	background: url(../images/net_connect_move_light.png) center no-repeat;
}
.net-connect-animate-btn {
	position: absolute;
	z-index: 19;
	bottom: 30px;
	left: 511px;
	width: 180px;
	height: 180px
}
.connect-bg-01,.connect-bg-02 {
	bottom: 0;
	left: 366px;
	width: 405px;
	height: 286px;
	position: absolute
}
.connect-bg-01 {
	z-index: 8;
	background: url(../images/connect_bg_01.png) center no-repeat;
}
.connect-bg-02 {
	z-index: 1;
	background: url(../images/connect_bg_02.png) center no-repeat;
}
@-webkit-keyframes net-move {
	from {
		-webkit-transform: translate(-165.45px,-100px);
		transform: translate(-165.45px,-100px)
	}
	70% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		background: url(../images/net_connect_move.png) center no-repeat;
	}
	80%,90% {
		background: url(../images/net_connect_move_light.png) center no-repeat;
	}
	100% {
		background: url(../images/net_connect_move.png) center no-repeat;
	}
}
@-moz-keyframes net-move {
	from {
		-moz-transform: translate(-165.45px,-100px);
		transform: translate(-165.45px,-100px)
	}
	70% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		background: url(../images/net_connect_move.png) center no-repeat;
	}
	80%,90% {
		background: url(../images/net_connect_move_light.png) center no-repeat;
	}
	100% {
		background: url(../images/net_connect_move.png) center no-repeat;
	}
}
@-o-keyframes net-move {
	from {
		-moz-transform: translate(-165.45px,-100px);
		transform: translate(-165.45px,-100px)
	}
	70% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		background: url(../images/net_connect_move.png) center no-repeat;
	}
	80%,90% {
		background: url(../images/net_connect_move_light.png) center no-repeat;
	}
	100% {
		background: url(../images/net_connect_move.png) center no-repeat;
	}
}
@keyframes net-move {
	from {
		-webkit-transform: translate(-165.45px,-100px);
		-moz-transform: translate(-165.45px,-100px);
		-o-transform: translate(-165.45px,-100px);
		transform: translate(-165.45px,-100px)
	}
	70% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		background: url(../images/net_connect_move.png) center no-repeat;
	}
	80%,90% {
		background: url(../images/net_connect_move_light.png) center no-repeat;
	}
	100% {
		background: url(../images/net_connect_move.png) center no-repeat;
	}
}
.net-connect-animate-box.active {
	-webkit-animation: net-move 4s;
	-moz-animation: net-move 4s
}
.net-connect-animate-box.reverse {
	-webkit-animation: net-move 4s both reverse;
	-moz-animation: net-move 4s both reverse;
	-o-animation: net-move 4s both reverse;
	animation: net-move 4s both reverse
}
.yellow-light-wrapper {
	z-index: 99;
	position: absolute;
	top: 410px;
	left: 156px;
	width: 168px;
	height: 202px
}
@-webkit-keyframes yellow-light {
	0%,100% {
		background: url(../images/yellow_light_01.png) center no-repeat;
	}

	25%,75% {
		background: url(../images/yellow_light_02.png) center no-repeat;
	}
}
@-moz-keyframes yellow-light {
	0%,100% {
		background: url(../images/yellow_light_01.png) center no-repeat;
	}

	25%,75% {
		background: url(../images/yellow_light_02.png) center no-repeat;
	}
}
@-o-keyframes yellow-light {
	0%,100% {
		background: url(../images/yellow_light_01.png) center no-repeat;
	}

	25%,75% {
		background: url(../images/yellow_light_02.png) center no-repeat;
	}
}
@keyframes yellow-light {
	0%,100% {
		background: url(../images/yellow_light_01.png) center no-repeat;
	}

	25%,75% {
		background: url(../images/yellow_light_02.png) center no-repeat;
	}
}
.yellow-light {
	position: absolute;
	width: 52px;
	height: 35px;
		background: url(../images/yellow_light_01.png) center no-repeat;
}
.yellow-light-01 {
	top: 0;
	left: 0
}
.yellow-light-02 {
	top: 33px;
	left: 57px
}
.yellow-light-03 {
	top: 66px;
	left: 115px
}
.yellow-light-wrapper.active .yellow-light-01 {
	-webkit-animation: yellow-light 3s;
	-moz-animation: yellow-light 3s;
	-o-animation: yellow-light 3s;
	animation: yellow-light 3s
}
.yellow-light-wrapper.active .yellow-light-02 {
	-webkit-animation: yellow-light 3s 1s;
	-moz-animation: yellow-light 3s 1s;
	-o-animation: yellow-light 3s 1s;
	animation: yellow-light 3s 1s
}
.yellow-light-wrapper.active .yellow-light-03 {
	-webkit-animation: yellow-light 3s 2s;
	-moz-animation: yellow-light 3s 2s;
	-o-animation: yellow-light 3s 2s;
	animation: yellow-light 3s 2s
}
.yellow-light-wrapper.reverse .yellow-light-01 {
	-webkit-animation: yellow-light 3s reverse;
	-moz-animation: yellow-light 3s reverse;
	-o-animation: yellow-light 3s reverse;
	animation: yellow-light 3s reverse
}
.yellow-light-wrapper.reverse .yellow-light-02 {
	-webkit-animation: yellow-light 3s 1s reverse;
	-moz-animation: yellow-light 3s 1s reverse;
	-o-animation: yellow-light 3s 1s reverse;
	animation: yellow-light 3s 1s reverse
}
.yellow-light-wrapper.reverse .yellow-light-03 {
	-webkit-animation: yellow-light 3s 2s reverse;
	-moz-animation: yellow-light 3s 2s reverse;
	-o-animation: yellow-light 3s 2s reverse;
	animation: yellow-light 3s 2s reverse
}
.net-safety-text {
	z-index: 12;
	position: absolute;
	width: 87px;
	height: 83px
}
.net-safety-text1 {
	top: 133px;
	left: 133px;
	background: url(../images/net_safety_text_new_01.png) center no-repeat;
}
.net-safety-text2 {
	width: 77px;
	height: 77px;
	top: 222px;
	left: 413px;
	background: url(../images/net_safety_text_new_02.png) center no-repeat;
}
.net-safety-text3 {
	top: 223px;
	left: 739px;
	background: url(../images/net_safety_text_new_03.png) center no-repeat;
}
.net-safety-text4 {
	top: 429px;
	left: 473px;
	background: url(../images/net_safety_text_new_04.png) center no-repeat;
}
.net-safety-light-circle {
	position: absolute;
	width: 16px;
	height: 12px;
	background: url(../images/net-light-point.png) center no-repeat;
	-webkit-box-shadow: 0 1px 3px 5px rgba(46,109,169,.1);
	-moz-box-shadow: 0 1px 3px 5px rgba(46,109,169,.1);
	box-shadow: 0 1px 3px 5px rgba(46,109,169,.1);
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%
}
@-webkit-keyframes circle-animate01 {
	from {
		-webkit-transform: translate(60px,38.4px);
		transform: translate(60px,38.4px);
		opacity: .4
	}
	to {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
}
@-moz-keyframes circle-animate01 {
	from {
		-moz-transform: translate(60px,38.4px);
		transform: translate(60px,38.4px);
		opacity: .4
	}
	to {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
}
@-o-keyframes circle-animate01 {
	from {
		-o-transform: translate(60px,38.4px);
		transform: translate(60px,38.4px);
		opacity: .4
	}
	to {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
}
@keyframes circle-animate01 {
	from {
		-webkit-transform: translate(60px,38.4px);
		-moz-transform: translate(60px,38.4px);
		-o-transform: translate(60px,38.4px);
		transform: translate(60px,38.4px);
		opacity: .4
	}
	to {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
}
.light-circle-01 {
	z-index: 2;
	top: 300px;
	left: 249px;
	-webkit-animation: circle-animate01 4s ease-in alternate infinite;
	-moz-animation: circle-animate01 4s ease-in alternate infinite;
	-o-animation: circle-animate01 4s ease-in alternate infinite;
	animation: circle-animate01 4s ease-in alternate infinite
}
@-webkit-keyframes circle-animate02 {
	0% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-webkit-transform: translate(37px,23px);
		transform: translate(37px,23px)
	}
	70% {
		-webkit-transform: translate(4px,43px);
		transform: translate(4px,43px)
	}
	100% {
		-webkit-transform: translate(44px,75px);
		transform: translate(44px,75px)
	}
}
@-moz-keyframes circle-animate02 {
	0% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-moz-transform: translate(37px,23px);
		transform: translate(37px,23px)
	}
	70% {
		-moz-transform: translate(4px,43px);
		transform: translate(4px,43px)
	}
	100% {
		-moz-transform: translate(44px,75px);
		transform: translate(44px,75px)
	}
}
@-o-keyframes circle-animate02 {
	0% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-o-transform: translate(37px,23px);
		transform: translate(37px,23px)
	}
	70% {
		-o-transform: translate(4px,43px);
		transform: translate(4px,43px)
	}
	100% {
		-o-transform: translate(44px,75px);
		transform: translate(44px,75px)
	}
}
@keyframes circle-animate02 {
	0% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-webkit-transform: translate(37px,23px);
		-moz-transform: translate(37px,23px);
		-o-transform: translate(37px,23px);
		transform: translate(37px,23px)
	}
	70% {
		-webkit-transform: translate(4px,43px);
		-moz-transform: translate(4px,43px);
		-o-transform: translate(4px,43px);
		transform: translate(4px,43px)
	}
	100% {
		-webkit-transform: translate(44px,75px);
		-moz-transform: translate(44px,75px);
		-o-transform: translate(44px,75px);
		transform: translate(44px,75px)
	}
}
.light-circle-02 {
	z-index: 8;
	top: 405px;
	left: 451px;
	-webkit-animation: circle-animate02 5s ease-in alternate infinite;
	-moz-animation: circle-animate02 5s ease-in alternate infinite;
	-o-animation: circle-animate02 5s ease-in alternate infinite;
	animation: circle-animate02 5s ease-in alternate infinite
}
@-webkit-keyframes circle-animate03 {
	0% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-webkit-transform: translate(-16px,11px);
		transform: translate(-16px,11px)
	}
	70% {
		-webkit-transform: translate(-64px,-14px);
		transform: translate(-64px,-14px)
	}
	90% {
		opacity: 1;
		-webkit-transform: translate(-120px,16px);
		transform: translate(-120px,16px)
	}
	100% {
		-webkit-transform: translate(-120px,16px);
		transform: translate(-120px,16px);
		opacity: 0
	}
}
@-moz-keyframes circle-animate03 {
	0% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-moz-transform: translate(-16px,11px);
		transform: translate(-16px,11px)
	}
	70% {
		-moz-transform: translate(-64px,-14px);
		transform: translate(-64px,-14px)
	}
	90% {
		opacity: 1;
		-moz-transform: translate(-120px,16px);
		transform: translate(-120px,16px)
	}
	100% {
		-moz-transform: translate(-120px,16px);
		transform: translate(-120px,16px);
		opacity: 0
	}
}
@-o-keyframes circle-animate03 {
	0% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-o-transform: translate(-16px,11px);
		transform: translate(-16px,11px)
	}
	70% {
		-o-transform: translate(-64px,-14px);
		transform: translate(-64px,-14px)
	}
	90% {
		opacity: 1;
		-o-transform: translate(-120px,16px);
		transform: translate(-120px,16px)
	}
	100% {
		-o-transform: translate(-120px,16px);
		transform: translate(-120px,16px);
		opacity: 0
	}
}
@keyframes circle-animate03 {
	0% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-webkit-transform: translate(-16px,11px);
		-moz-transform: translate(-16px,11px);
		-o-transform: translate(-16px,11px);
		transform: translate(-16px,11px)
	}
	70% {
		-webkit-transform: translate(-64px,-14px);
		-moz-transform: translate(-64px,-14px);
		-o-transform: translate(-64px,-14px);
		transform: translate(-64px,-14px)
	}
	90% {
		opacity: 1;
		-webkit-transform: translate(-120px,16px);
		-moz-transform: translate(-120px,16px);
		-o-transform: translate(-120px,16px);
		transform: translate(-120px,16px)
	}
	100% {
		-webkit-transform: translate(-120px,16px);
		-moz-transform: translate(-120px,16px);
		-o-transform: translate(-120px,16px);
		transform: translate(-120px,16px);
		opacity: 0
	}
}
.light-circle-03 {
	z-index: 8;
	top: 433px;
	left: 377px;
	-webkit-animation: circle-animate03 5.4s ease-in alternate infinite;
	-moz-animation: circle-animate03 5.4s ease-in alternate infinite;
	-o-animation: circle-animate03 5.4s ease-in alternate infinite;
	animation: circle-animate03 5.4s ease-in alternate infinite
}
@-webkit-keyframes circle-animate04 {
	0% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-webkit-transform: translate(-18px,12px);
		transform: translate(-18px,12px)
	}
	70% {
		-webkit-transform: translate(28px,39px);
		transform: translate(28px,39px)
	}
	90% {
		opacity: 1;
		-webkit-transform: translate(-28px,71px);
		transform: translate(-28px,71px)
	}
	100% {
		opacity: 0;
		-webkit-transform: translate(-28px,71px);
		transform: translate(-28px,71px)
	}
}
@-moz-keyframes circle-animate04 {
	0% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-moz-transform: translate(-18px,12px);
		transform: translate(-18px,12px)
	}
	70% {
		-moz-transform: translate(28px,39px);
		transform: translate(28px,39px)
	}
	90% {
		opacity: 1;
		-moz-transform: translate(-28px,71px);
		transform: translate(-28px,71px)
	}
	100% {
		opacity: 0;
		-moz-transform: translate(-28px,71px);
		transform: translate(-28px,71px)
	}
}
@-o-keyframes circle-animate04 {
	0% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-o-transform: translate(-18px,12px);
		transform: translate(-18px,12px)
	}
	70% {
		-o-transform: translate(28px,39px);
		transform: translate(28px,39px)
	}
	90% {
		opacity: 1;
		-o-transform: translate(-28px,71px);
		transform: translate(-28px,71px)
	}
	100% {
		opacity: 0;
		-o-transform: translate(-28px,71px);
		transform: translate(-28px,71px)
	}
}
@keyframes circle-animate04 {
	0% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-webkit-transform: translate(-18px,12px);
		-moz-transform: translate(-18px,12px);
		-o-transform: translate(-18px,12px);
		transform: translate(-18px,12px)
	}
	70% {
		-webkit-transform: translate(28px,39px);
		-moz-transform: translate(28px,39px);
		-o-transform: translate(28px,39px);
		transform: translate(28px,39px)
	}
	90% {
		opacity: 1;
		-webkit-transform: translate(-28px,71px);
		-moz-transform: translate(-28px,71px);
		-o-transform: translate(-28px,71px);
		transform: translate(-28px,71px)
	}
	100% {
		opacity: 0;
		-webkit-transform: translate(-28px,71px);
		-moz-transform: translate(-28px,71px);
		-o-transform: translate(-28px,71px);
		transform: translate(-28px,71px)
	}
}
.light-circle-04 {
	z-index: 8;
	top: 378px;
	left: 284px;
	-webkit-animation: circle-animate04 5.4s ease-in alternate infinite;
	-moz-animation: circle-animate04 5.4s ease-in alternate infinite;
	-o-animation: circle-animate04 5.4s ease-in alternate infinite;
	animation: circle-animate04 5.4s ease-in alternate infinite
}
@-webkit-keyframes circle-animate05 {
	0% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-webkit-transform: translate(-97px,60px);
		transform: translate(-97px,60px)
	}
	70% {
		-webkit-transform: translate(-34px,97px);
		transform: translate(-34px,97px)
	}
	90% {
		opacity: 1
	}
	95% {
		opacity: 0
	}
	100% {
		-webkit-transform: translate(-91px,130px);
		transform: translate(-91px,130px);
		opacity: 0
	}
}
@-moz-keyframes circle-animate05 {
	0% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-moz-transform: translate(-97px,60px);
		transform: translate(-97px,60px)
	}
	70% {
		-moz-transform: translate(-34px,97px);
		transform: translate(-34px,97px)
	}
	90% {
		opacity: 1
	}
	95% {
		opacity: 0
	}
	100% {
		-moz-transform: translate(-91px,130px);
		transform: translate(-91px,130px);
		opacity: 0
	}
}
@-o-keyframes circle-animate05 {
	0% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-o-transform: translate(-97px,60px);
		transform: translate(-97px,60px)
	}
	70% {
		-o-transform: translate(-34px,97px);
		transform: translate(-34px,97px)
	}
	90% {
		opacity: 1
	}
	95% {
		opacity: 0
	}
	100% {
		-o-transform: translate(-91px,130px);
		transform: translate(-91px,130px);
		opacity: 0
	}
}
@keyframes circle-animate05 {
	0% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	40% {
		-webkit-transform: translate(-97px,60px);
		-moz-transform: translate(-97px,60px);
		-o-transform: translate(-97px,60px);
		transform: translate(-97px,60px)
	}
	70% {
		-webkit-transform: translate(-34px,97px);
		-moz-transform: translate(-34px,97px);
		-o-transform: translate(-34px,97px);
		transform: translate(-34px,97px)
	}
	90% {
		opacity: 1
	}
	95% {
		opacity: 0
	}
	100% {
		-webkit-transform: translate(-91px,130px);
		-moz-transform: translate(-91px,130px);
		-o-transform: translate(-91px,130px);
		transform: translate(-91px,130px);
		opacity: 0
	}
}
.light-circle-05 {
	z-index: 2;
	top: 208px;
	left: 585px;
	-webkit-animation: circle-animate05 6.4s ease-in alternate infinite;
	-moz-animation: circle-animate05 6.4s ease-in alternate infinite;
	-o-animation: circle-animate05 6.4s ease-in alternate infinite;
	animation: circle-animate05 6.4s ease-in alternate infinite
}
@-webkit-keyframes circle-animate06 {
	0% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	39% {
		-webkit-transform: translate(-61px,37px);
		transform: translate(-61px,37px);
		opacity: 1
	}
	40%,71%,95% {
		opacity: 0
	}
	41% {
		-webkit-transform: translate(-114px,13px);
		transform: translate(-114px,13px)
	}
	42% {
		opacity: 0;
		-webkit-transform: translate(-146px,29px);
		transform: translate(-146px,29px)
	}
	70% {
		opacity: 0;
		-webkit-transform: translate(-83px,66px);
		transform: translate(-83px,66px)
	}

	100% {
		-webkit-transform: translate(-140px,99px);
		transform: translate(-140px,99px);
		opacity: 0
	}
}
@-moz-keyframes circle-animate06 {
	0% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	39% {
		-moz-transform: translate(-61px,37px);
		transform: translate(-61px,37px);
		opacity: 1
	}
	40%,71%,95% {
		opacity: 0
	}
	41% {
		-moz-transform: translate(-114px,13px);
		transform: translate(-114px,13px)
	}
	42% {
		opacity: 0;
		-moz-transform: translate(-146px,29px);
		transform: translate(-146px,29px)
	}
	70% {
		opacity: 0;
		-moz-transform: translate(-83px,66px);
		transform: translate(-83px,66px)
	}
	100% {
		-moz-transform: translate(-140px,99px);
		transform: translate(-140px,99px);
		opacity: 0
	}
}
@-o-keyframes circle-animate06 {
	0% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	39% {
		-o-transform: translate(-61px,37px);
		transform: translate(-61px,37px);
		opacity: 1
	}
	40%,71%,95% {
		opacity: 0
	}
	41% {
		-o-transform: translate(-114px,13px);
		transform: translate(-114px,13px)
	}
	42% {
		opacity: 0;
		-o-transform: translate(-146px,29px);
		transform: translate(-146px,29px)
	}
	70% {
		opacity: 0;
		-o-transform: translate(-83px,66px);
		transform: translate(-83px,66px)
	}
	100% {
		-o-transform: translate(-140px,99px);
		transform: translate(-140px,99px);
		opacity: 0
	}
}
@keyframes circle-animate06 {
	0% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	39% {
		-webkit-transform: translate(-61px,37px);
		-moz-transform: translate(-61px,37px);
		-o-transform: translate(-61px,37px);
		transform: translate(-61px,37px);
		opacity: 1
	}
	40%,71%,95% {
		opacity: 0
	}
	41% {
		-webkit-transform: translate(-114px,13px);
		-moz-transform: translate(-114px,13px);
		-o-transform: translate(-114px,13px);
		transform: translate(-114px,13px)
	}
	42% {
		opacity: 0;
		-webkit-transform: translate(-146px,29px);
		-moz-transform: translate(-146px,29px);
		-o-transform: translate(-146px,29px);
		transform: translate(-146px,29px)
	}
	70% {
		opacity: 0;
		-webkit-transform: translate(-83px,66px);
		-moz-transform: translate(-83px,66px);
		-o-transform: translate(-83px,66px);
		transform: translate(-83px,66px)
	}
	100% {
		-webkit-transform: translate(-140px,99px);
		-moz-transform: translate(-140px,99px);
		-o-transform: translate(-140px,99px);
		transform: translate(-140px,99px);
		opacity: 0
	}
}
.light-circle-06 {
	z-index: 2;
	top: 239px;
	left: 634px;
	-webkit-animation: circle-animate06 6.4s ease-in alternate infinite;
	-moz-animation: circle-animate06 6.4s ease-in alternate infinite;
	-o-animation: circle-animate06 6.4s ease-in alternate infinite;
	animation: circle-animate06 6.4s ease-in alternate infinite
}
@-webkit-keyframes circle-animate07 {
	0% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	30% {
		-webkit-transform: translate(-79px,47px);
		transform: translate(-79px,47px)
	}
	45% {
		-webkit-transform: translate(-45px,68px);
		transform: translate(-45px,68px)
	}
	50% {
		-webkit-transform: translate(-61px,77px);
		transform: translate(-61px,77px)
	}
	70% {
		opacity: 1;
		-webkit-transform: translate(-137px,32px);
		transform: translate(-137px,32px)
	}
	71%,95% {
		opacity: 0
	}
	100% {
		-webkit-transform: translate(-194px,65px);
		transform: translate(-194px,65px);
		opacity: 0
	}
}
@-moz-keyframes circle-animate07 {
	0% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-moz-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	30% {
		-moz-transform: translate(-79px,47px);
		transform: translate(-79px,47px)
	}
	45% {
		-moz-transform: translate(-45px,68px);
		transform: translate(-45px,68px)
	}
	50% {
		-moz-transform: translate(-61px,77px);
		transform: translate(-61px,77px)
	}
	70% {
		opacity: 1;
		-moz-transform: translate(-137px,32px);
		transform: translate(-137px,32px)
	}
	71%,95% {
		opacity: 0
	}
	100% {
		-moz-transform: translate(-194px,65px);
		transform: translate(-194px,65px);
		opacity: 0
	}
}
@-o-keyframes circle-animate07 {
	0% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	30% {
		-o-transform: translate(-79px,47px);
		transform: translate(-79px,47px)
	}
	45% {
		-o-transform: translate(-45px,68px);
		transform: translate(-45px,68px)
	}
	50% {
		-o-transform: translate(-61px,77px);
		transform: translate(-61px,77px)
	}
	70% {
		opacity: 1;
		-o-transform: translate(-137px,32px);
		transform: translate(-137px,32px)
	}
	71%,95% {
		opacity: 0
	}
	100% {
		-o-transform: translate(-194px,65px);
		transform: translate(-194px,65px);
		opacity: 0
	}
}
@keyframes circle-animate07 {
	0% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 0
	}
	20% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		opacity: 1
	}
	30% {
		-webkit-transform: translate(-79px,47px);
		-moz-transform: translate(-79px,47px);
		-o-transform: translate(-79px,47px);
		transform: translate(-79px,47px)
	}
	45% {
		-webkit-transform: translate(-45px,68px);
		-moz-transform: translate(-45px,68px);
		-o-transform: translate(-45px,68px);
		transform: translate(-45px,68px)
	}
	50% {
		-webkit-transform: translate(-61px,77px);
		-moz-transform: translate(-61px,77px);
		-o-transform: translate(-61px,77px);
		transform: translate(-61px,77px)
	}
	70% {
		opacity: 1;
		-webkit-transform: translate(-137px,32px);
		-moz-transform: translate(-137px,32px);
		-o-transform: translate(-137px,32px);
		transform: translate(-137px,32px)
	}
	71%,95% {
		opacity: 0
	}
	100% {
		-webkit-transform: translate(-194px,65px);
		-moz-transform: translate(-194px,65px);
		-o-transform: translate(-194px,65px);
		transform: translate(-194px,65px);
		opacity: 0
	}
}
.light-circle-07 {
	z-index: 2;
	top: 273px;
	left: 688px;
	-webkit-animation: circle-animate07 6.4s ease-in alternate infinite;
	-moz-animation: circle-animate07 6.4s ease-in alternate infinite;
	-o-animation: circle-animate07 6.4s ease-in alternate infinite;
	animation: circle-animate07 6.4s ease-in alternate infinite
}
.net-safety-last-block {
	position: absolute;
	z-index: 19;
	top: 233px;
	left: 495px;
	width: 159px;
	height: 112px;
	background: url(../images/net_safety_block_last.png) center no-repeat;
}
/*右边动画 end*/
/*为什么选择顶呱呱 end*/
/*提交需求 start*/
.hope-fl{
	width: 340px;
	margin: 50px 40px 53px 100px;
	text-align: left;
}
.hope-tt{
	width: 310px;
	padding: 18px 0 0 30px;
	height: 242px;
	color: #fff;
	background: url(../images/hope-img_03.jpg) no-repeat center;
}
.hope-tt h5{
	font-size: 28px;
	line-height: 68px;
}
.hope-tt a{
	width: 118px;
	text-align: center;
	height: 34px;
	line-height: 34px;
	border: 1px solid #fff;
	border-radius: 2px;
	font-size: 14px;
	color: #fff;
}
.hope-tt a:hover{
	background: #fff;
	color: #107dda;
}
.hope-fl p{
	font-size: 16px;
	line-height: 24px;
	color: #333;
}
.hope-fl p span{
	display: block;
	padding: 16px 0 9px;
}
.hope-form{
	width: 630px;
	text-align: center;
	margin: 47px 0 0;
}
.hope-form>p{
	font-size: 20px;
	color: #333;
	line-height: 22px;
}
.input-box{
	width: 100%;
	overflow: hidden;
	margin-top: 19px;
}
.input-box input,.hope-form textarea{
	border: 1px solid #dedede;
	margin-bottom: 10px;
	text-align: left;
	font-size: 14px;
}
.input-box input{
	width: 191px;
	height: 48px;
	line-height: 48px;
	padding-left: 10px;
	float: left;
	margin-left: 10px;
}
.input-box input:first-child{margin-left: 0 !important;}
.hope-form textarea{
	width: 608px;
	padding: 5px 10px;
	line-height: 22px;
	height: 170px;
	max-height: 170px;
	overflow:hidden ;
}
.hope-form button{
	width: 160px;
	height: 46px;
	line-height: 46px;
	background: #34c7c7;
	border-radius: 2px;
	font-size: 16px;
	color: #fff;
	margin-top: 4px;
}
/*提交需求 end*/