﻿

@font-face {
	font-family:bebasregular;src:url(../fonts/bebas-webfont.woff2) format('woff2'),url(../fonts/bebas-webfont.woff) format('woff');font-weight:400;font-style:normal
}

.index-page .header-container {
	height: 720px
}


.service-action-ul li {
	float: left;
	width: 25%;
	height: 116px
}

.service-action-ul li .subbanner-link-main.special {
	border-right: 1px solid rgba(73,127,163,.6);
	border-right: 1px solid #497fa3\9
}

.service-action-ul li .subbanner-link-main {
	position: relative;
	display: block;
	width: 100%;
	height: 116px;
	border-left: 1px solid rgba(73,127,163,.6);
	border-right: 1px solid #497fa3\9
}

.service-action-ul li .subbanner-link-main:hover {
	background-color: rgba(33,154,214,.1)
}

.subbanner-link-icon {
	position: absolute;
	right: 31px;
	bottom: 23px;
	width: 22px;
	height: 22px;
}

.service-action-text {
	padding: 18px 0 0 33px
}

.service-action-title {
	font-weight: 700;
	font-size: 16px;
	color: #fff
}

.service-action-info {
	margin-top: 9px;
	font-size: 14px;
	color: #d2d3d3
}

.service-action-link {
	margin-top: 8px;
	color: #375eab;
	font-size: 12px
}

.superiority-div-wrapper {
	background-color: #fff;
	height: 440px
}

.superiority-li-item {
	position: relative;
	float: left;
	margin: 0 2.5%;
	*margin: 0;
	padding-top: 260px;
	width: 20%;
	*width: 24.9%;
	text-align: center
}

.animate-wrapper-div {
	position: absolute;
	top: 90px;
	left: 50%;
	margin-left: -76px;
	width: 152px;
	height: 141px
}

.animate-item-div {
	position: absolute
}

.animate01-big-white {
	z-index: 1;
	top: 29px;
	left: 71px;
	width: 91px;
	height: 109px;
	background: url(../images/animate_01_big_white.png) center no-repeat
}

.animate01-small-white {
	z-index: 9;
	top: 80px;
	left: 22px;
	width: 91px;
	height: 75px;
	background: url(../images/animate_01_small_white.png) center no-repeat
}

.animate01-big-blue {
	z-index: 6;
	top: 32px;
	left: 45px;
	width: 91px;
	height: 109px;
	background: url(../images/animate_01_big_blue.png) center no-repeat
}

.animate01-small-blue {
	z-index: 6;
	top: -2px;
	left: 19px;
	width: 91px;
	height: 75px;
	background: url(../images/animate_01_small_blue.png) center no-repeat
}

@-webkit-keyframes animate01translateY1 {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px)
	}

	75% {
		opacity: 1
	}

	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

@-moz-keyframes animate01translateY1 {
	0% {
		opacity: 0;
		-moz-transform: translateY(-30px);
		transform: translateY(-30px)
	}

	75% {
		opacity: 1
	}

	100% {
		-moz-transform: translateY(0);
		transform: translateY(0)
	}
}

@-o-keyframes animate01translateY1 {
	0% {
		opacity: 0;
		-o-transform: translateY(-30px);
		transform: translateY(-30px)
	}

	75% {
		opacity: 1
	}

	100% {
		-o-transform: translateY(0);
		transform: translateY(0)
	}
}

@keyframes animate01translateY1 {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-30px);
		-moz-transform: translateY(-30px);
		-o-transform: translateY(-30px);
		transform: translateY(-30px)
	}

	75% {
		opacity: 1
	}

	100% {
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0)
	}
}

.superiority-li-item-01.active .animate01-big-blue {
	-webkit-animation: animate01translateY1 .9s both;
	-moz-animation: animate01translateY1 .9s both;
	-o-animation: animate01translateY1 .9s both;
	animation: animate01translateY1 .9s both
}

.superiority-li-item-01.active .animate01-small-blue {
	-webkit-animation: animate01translateY1 .5s .9s both;
	-moz-animation: animate01translateY1 .5s .9s both;
	-o-animation: animate01translateY1 .5s .9s both;
	animation: animate01translateY1 .5s .9s both
}

.animate02-white-01 {
	z-index: 1;
	top: 27px;
	left: 21px;
	width: 52px;
	height: 69px;
	background: url(../images/animate02_white_01.png) center no-repeat
}

.animate02-white-02 {
	z-index: 6;
	top: 63px;
	left: 67px;
	width: 102px;
	height: 91px;
	background: url(../images/animate02_white_02.png) center no-repeat
}

.animate02-big-blue {
	z-index: 3;
	top: 3px;
	left: 42px;
	width: 127px;
	height: 138px;
	background: url(../images/animate02_big_blue.png) center no-repeat
}

.superiority-li-item-02.active .animate02-big-blue {
	-webkit-animation: animate01translateY1 .9s both;
	-moz-animation: animate01translateY1 .9s both;
	-o-animation: animate01translateY1 .9s both;
	animation: animate01translateY1 .9s both
}

.animate03-big-blue {
	z-index: 1;
	top: 23px;
	left: 20px;
	width: 154px;
	height: 125px;
	background: url(../images/animate03_big_blue.png) center no-repeat
}

.animate03-white-01 {
	z-index: 9;
	top: 8px;
	left: 20px;
	width: 36px;
	height: 32px;
	background: url(../images/animate03_white_01.png) center no-repeat
}

.animate03-white-02 {
	z-index: 9;
	top: 16px;
	left: 56px;
	width: 32px;
	height: 38px;
	background: url(../images/animate03_white_02.png) center no-repeat
}

.animate03-white-03 {
	z-index: 9;
	top: 40px;
	left: 12px;
	width: 39px;
	height: 46px;
	background: url(../images/animate03_white_03.png) center no-repeat
}

.superiority-li-item-03.active .animate03-white-01 {
	-webkit-animation: animate01translateY1 .9s .5s both;
	-moz-animation: animate01translateY1 .9s .5s both;
	-o-animation: animate01translateY1 .9s .5s both;
	animation: animate01translateY1 .9s .5s both
}

.superiority-li-item-03.active .animate03-white-02 {
	-webkit-animation: animate01translateY1 .5s .2s both;
	-moz-animation: animate01translateY1 .5s .2s both;
	-o-animation: animate01translateY1 .5s .2s both;
	animation: animate01translateY1 .5s .2s both
}

.superiority-li-item-03.active .animate03-white-03 {
	-webkit-animation: animate01translateY1 .5s both;
	-moz-animation: animate01translateY1 .5s both;
	-o-animation: animate01translateY1 .5s both;
	animation: animate01translateY1 .5s both
}

.animate04-white-01 {
	z-index: 9;
	top: 76px;
	left: 48px;
	width: 77px;
	height: 63px;
	background: url(../images/animate04_white_01.png) center no-repeat
}

.animate04-white-02 {
	z-index: 1;
	top: 22px;
	left: 77px;
	width: 102px;
	height: 101px;

}

.animate04-big-blue {
	z-index: 2;
	top: 14px;
	left: 52px;
	width: 91px;
	height: 118px;
	background: url(../images/animate04_big_blue.png) center no-repeat
}

.animate04-small-blue {
	z-index: 2;
	top: 62px;
	left: 28px;
	width: 78px;
	height: 76px;
	background: url(../images/animate04_small_blue.png) center no-repeat
}

.animate04-arrow-blue-01 {
	z-index: 10;
	top: 48px;
	left: 32px;
	width: 9px;
	height: 15px;

}

.animate04-arrow-blue-02 {
	z-index: 10;
	top: 76px;
	left: 12px;
	width: 13px;
	height: 21px;
	}

.animate04-arrow-blue-03 {
	z-index: 10;
	top: 72px;
	left: 99px;
	width: 10px;
	height: 23px;
}

.superiority-li-item-04.active .animate04-big-blue {
	-webkit-animation: animate01translateY1 .7s both;
	-moz-animation: animate01translateY1 .7s both;
	-o-animation: animate01translateY1 .7s both;
	animation: animate01translateY1 .7s both
}

.superiority-li-item-04.active .animate04-small-blue {
	-webkit-animation: animate01translateY1 .7s .5s both;
	-moz-animation: animate01translateY1 .7s .5s both;
	-o-animation: animate01translateY1 .7s .5s both;
	animation: animate01translateY1 .7s .5s both
}

.superiority-li-item-04.active .animate04-arrow-blue-01 {
	-webkit-animation: animate01translateY1 .5s 1.2s both;
	-moz-animation: animate01translateY1 .5s 1.2s both;
	-o-animation: animate01translateY1 .5s 1.2s both;
	animation: animate01translateY1 .5s 1.2s both
}

.superiority-li-item-04.active .animate04-arrow-blue-02 {
	-webkit-animation: animate01translateY1 .5s 1.7s both;
	-moz-animation: animate01translateY1 .5s 1.7s both;
	-o-animation: animate01translateY1 .5s 1.7s both;
	animation: animate01translateY1 .5s 1.7s both
}

.superiority-li-item-04.active .animate04-arrow-blue-03 {
	-webkit-animation: animate01translateY1 .5s 2s both;
	-moz-animation: animate01translateY1 .5s 2s both;
	-o-animation: animate01translateY1 .5s 2s both;
	animation: animate01translateY1 .5s 2s both
}

.superiority-big-num {
	margin-bottom: 16px;
	height: 38px;
	line-height: 38px;
	font-size: 38px;
	color: #333;
	font-family: bebasregular
}

.dot-text {
	font-family: "微软雅黑"
}

.add-text {
	position: relative;
	font-size: 36px;
	top: -6px;
	left: 4px;
	font-weight: 700
}

.superiority-small-text {
	font-size: 18px;
	line-height: 18px;
	color: #999
}

.cloud-product-box {
	background: #f4f4f4
}

.cloud-product-wrapper {
	margin: 0 auto;
	width: 1200px
}

.cloud-product {
	position: relative;
	z-index: 9;
	padding: 110px 0 80px
}

.cloud-product-title {
	height: 32px;
	text-align: center;
	line-height: 32px;
	font-size: 32px;
	color: #333
}

.color-blue {
	color: #009fd9
}

.cloud-product-explain {
	margin-top: 26px;
	margin-bottom: 82px;
	height: 16px;
	line-height: 24px;
	text-align: center;
	font-size: 16px;
	color: #999
}

.cloud-product-ul {
	width: 100%
}

.cloud-product-ul li {
	position: relative;
	margin-left: 12px;
	width: 212px;
	height: 522px;
	float: left;
	background: #fff
}

.cloud-product-ul li:first-child {
	margin-left: 0
}

.cloud-product-single-top {
	width: 100%;
	height: 60px;
	line-height: 60px;
	text-align: center;
	background-color: #f2f2f2
}

.cloud-product-name {
	font-size: 18px;
	color: #333;
	font-weight: 700
}

.cloud-product-single-bottom {
	width: 100%;
	height: 340px
}

.empty-space {
	width: 100%;
	height: 99px
}

.single-bottom-item {
	height: 340px;
	width: 100%
}

.single-bottom-item:first-child {
	border-right: 1px solid #eee
}

.bg-product-pic {
	margin: 48px auto 0;
	width: 100%;
	height: 82px
}

.server-header-01 {
	background: url(../images/product_header_icon_01.png) center no-repeat
}

.server-header-02 {
	background: url(../images/product_header_icon_02.png) center no-repeat
}

.server-header-03 {
	background: url(../images/product_header_icon_03.png) center no-repeat
}

.server-header-04 {
	background: url(../images/product_header_icon_04.png) center no-repeat
}

.server-header-05 {
	background: url(../images/product_header_icon_05.png) center no-repeat
}

.server-header-active-01 {
	background: url(../images/product_header_active_icon_01.png) center no-repeat
}

.server-header-active-02 {
	background: url(../images/product_header_active_icon_02.png) center no-repeat
}

.server-header-active-03 {
	background: url(../images/product_header_active_icon_03.png) center no-repeat
}

.server-header-active-04 {
	background: url(../images/product_header_active_icon_04.png) center no-repeat
}

.server-header-active-05 {
	background: url(../images/product_header_active_icon_05.png) center no-repeat
}

.idc-bg {
	background: url(../images/index-sprite.png) 0 -1421px no-repeat
}

.host-bg {
	background: url(../images/index-sprite.png) -6px -1256px no-repeat
}

.product-introduce-title {
	margin-bottom: 14px;
	height: 22px;
	line-height: 22px;
	font-size: 22px;
	text-align: center
}

.product-introduce-title.normal-weight {
	font-weight: 400
}

.product-introduce-content {
	margin: 0 auto 26px;
	width: 180px;
	line-height: 14px;
	font-size: 14px;
	text-align: center;
	color: #999
}

.product-introduce-list {
	margin: 0 auto;
	padding-top: 28px;
	height: 135px;
	width: 84%;
	border: 1px solid #f1f1f1;
	border-left: none;
	border-right: none
}

.introduce-list-small {
	margin-bottom: 18px;
	line-height: 14px;
	font-size: 14px;
	color: #999;
	text-align: center
}

.product-introduce-price {
	margin: 48px auto 0;
	font-size: 14px;
	text-align: center;
	color: #333
}

.price-blue {
	color: #375eab;
	font-size: 38px
}

.normal-inner {
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s
}

.active-inner {
	position: relative;
	display: none;
	height: 100%;
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s
}

.introduce-link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 360px
}

.active-inner-01 {
	background: url(../images/producet_bg_01.jpg) center no-repeat
}

.active-inner-02 {
	background: url(../images/producet_bg_02.jpg) center no-repeat
}

.active-inner-03 {
	background: url(../images/producet_bg_03.jpg) center no-repeat
}

.active-inner-04 {
	background: url(../images/producet_bg_04.jpg) center no-repeat
}

.active-inner-05 {
	background: url(../images/producet_bg_05.jpg) center no-repeat
}

.cloud-product-ul li.active .active-inner {
	display: block;
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1
}

.cloud-product-ul li.active .normal-inner {
	display: none;
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0
}

.cloud-product-ul li {
	-webkit-box-shadow: 1px 1px 12px rgba(0,0,0,.08);
	-moz-box-shadow: 1px 1px 12px rgba(0,0,0,.08);
	box-shadow: 1px 1px 12px rgba(0,0,0,.08);
	-webkit-transition: width .15s linear;
	-o-transition: width .15s linear;
	-moz-transition: width .15s linear;
	transition: width .15s linear
}

.cloud-product-ul li.active {
	z-index: 9;
	width: 304px;
	-webkit-box-shadow: 0 4px 20px rgba(0,0,0,.2);
	-moz-box-shadow: 0 4px 20px rgba(0,0,0,.2);
	box-shadow: 0 4px 20px rgba(0,0,0,.2)
}

.active .product-introduce-content {
	color: #eff6ff
}

.active-product-introduce-title {
	color: #fff
}

.active .product-introduce-list {
	padding-top: 22px;
	border-color: #3f9ff9
}

.introduce-list-large {
	margin: 0 auto;
	width: 228px;
	line-height: 22px;
	color: #ddebff;
	font-size: 14px
}

.active .product-introduce-price {
	margin-top: 32px;
	color: #fefeff
}

.product-introduce-price .price-white {
	display: inline-block;
	font-size: 36px;
	height: 36px;
	line-height: 36px;
	color: #fff
}

.buy-link-btn {
	display: block;
	margin: 30px auto 0;
	width: 90%;
	height: 40px;
	line-height: 40px;
	background-color: #ff9600;
	color: #fff;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0
}

.buy-link-btn:hover {
	background-color: #f80
}

.product-tab-wrapper {
	width: 100%
}

.product-tab-item {
	width: 100%;
	height: 30px;
	margin-bottom: 10px;
	overflow: hidden;
	transition: height .5s;
	-moz-transition: height .5s;
	-webkit-transition: height .5s;
	-o-transition: height .5s
}

.product-tab-title {
	margin: 0 auto;
	padding-left: 40px;
	width: 90%;
	min-width: 200px;
	height: 30px;
	line-height: 30px;
	font-size: 12px;
	background: url(../images/add-icon.png) no-repeat #fafafa;
	color: #666
}

.product-tab-item.active .product-tab-title {
	background: url(../images/reduce_icon.png) no-repeat #e0f9ff;
	color: #009fd9
}

.product-tab-content {
	width: 200px;
	margin-top: 6px;
	margin-left: 54px;
	line-height: 22px;
	font-size: 12px;
	color: #999
}

.product-tab-item.active {
	height: 150px
}

.net-safety-box {
	position: relative;
	padding-top: 90px;
	height: 905px;
	background: url(../images/net_safet_whole_bg.jpg) center no-repeat;background-size: 100%;
}

.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;background-size: 100%;
}

.net-safety-title {
	margin-bottom: 26px;
	font-size: 32px;
	line-height: 32px;
	text-align: center;
	color: #fff
}

.net-safety-explain {
	margin-bottom: 100px;
	font-size: 16px;
	line-height: 16px;
	text-align: center;
	color: #999
}

.net-safety-intro-wrapper {
	margin-bottom: 40px
}

.net-safety-intro-div {
	padding-left: 50px;
	height: 120px;
	width: 340px
}


.safety-intro-div-02 {
	background: url(../images/net_safety_icon_02.png) no-repeat
}


.safety-intro-div-01:hover {
	background: url(../images/net_safety_icon_active_01.png) no-repeat
}

.safety-intro-div-02:hover {
	background: url(../images/net_safety_icon_active_02.png) no-repeat
}

.safety-intro-div-03:hover {
	background: url(../images/net_safety_icon_active_03.png) no-repeat
}

.safety-intro-div-04:hover {
	background: url(../images/net_safety_icon_active_04.png) no-repeat
}

.net-safety-intro-title {
	margin-bottom: 8px;
	padding-left: 8px;
	height: 18px;
	line-height: 18px;
	font-size: 18px;
	color: #fff
}

.net-safety-intro-subtitle {
	position: relative;
	display: inline-block;
	padding: 0 30px 0 8px;
	height: 42px;
	line-height: 42px;
	font-size: 32px;
	color: #999
}

.net-safety-subtitle-line {
	position: absolute;
	z-index: 8;
	left: 0;
	top: 1px;
	width: 100%;
	height: 1px;
	background: #36373e
}

.net-safety-subtitle-dot {
	position: absolute;
	z-index: 9;
	left: 0;
	top: 0;
	width: 4px;
	height: 3px;
	background-color: #89898e
}

.net-safety-subtitle-icon {
	position: absolute;
	z-index: 9;
	width: 28px;
	height: 28px;
	top: -13px;
	right: -13px;
	background: url(../images/net_safety_subtitle_icon.png) center no-repeat
}

.net-safety-more-link {
	display: block;
	border: 1px solid #919295;
	width: 172px;
	height: 38px;
	line-height: 38px;
	font-size: 14px;
	background-color: transparent;
	color: #fff;
	text-align: center
}

.net-safety-more-link:hover {
	border-color: #fff;
	background-color: #fff;
	color: #333
}

.net-safety-box .auto {
	position: relative
}

.net-safety-animate-wrapper {
	position: absolute;
	top: -128px;
	right: 53px;
	width: 909px;
	height: 686px
}

@media only screen and (min-width:1400px) {
	.net-safety-animate-wrapper {
		position: absolute;
		top: -128px;
		right: -40px;
		width: 909px;
		height: 686px
	}
}

@media only screen and (min-width:1600px) {
	.net-safety-animate-wrapper {
		position: absolute;
		top: -128px;
		right: -140px;
		width: 909px;
		height: 686px
	}
}

.net-safety-animate-wrapper .net-safety-animate-wrapper-bg-01 {
	position: absolute;
	z-index: 3;
	top: 0;
	left: 0;
	width: 909px;
	height: 686px;
	background: url(../images/net_safety_animate_wrapper_bg_01.png)
}

.net-safety-animate-wrapper-bg-02 {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 909px;
	height: 686px;
	background: url(../images/net_safety_animate_wrapper_bg_02.png)
}

.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.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 {
		-o-transform: translate(-165.45px,-100px);
		transform: translate(-165.45px,-100px)
	}

	70% {
		-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
	}
}

@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 {

	25%,75% {
		background: url(../images/yellow_light_02.png) center no-repeat
	}
}

@-moz-keyframes yellow-light {
	

	25%,75% {
		background: url(../images/yellow_light_02.png) center no-repeat
	}
}

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

@keyframes yellow-light {
	

	25%,75% {
		background: url(../images/yellow_light_02.png) center no-repeat
	}
}

.yellow-light {
	position: absolute;
	width: 52px;
	height: 35px;

}

.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;
}

.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
}

.solution-bgcolor {
	position: relative;
	background: #f7fafc;
	padding-bottom: 170px
}

.particles-js-canvas-el {
	position: absolute;
	top: 0;
	z-index: 1
}

.solution-bgcolor .cloud-product {
	padding-bottom: 58px
}

.solution-bgcolor .cloud-product-title span {
	color: #333
}

.solution-bgcolor .cloud-product-explain {
	color: #999
}

.solution-list {
	position: relative;
	height: 412px;
	z-index: 9
}

.short-bar {
	position: absolute;
	top: 187px;
	left: 50%;
	margin-left: -15px;
	width: 30px;
	height: 3px;
	background-color: #fff
}

.active .short-bar {
	top: 201px;
	background-color: #375eab
}

.solution-list ul li {
	float: left;
	width: 240px;
	position: relative;
	height: 412px;
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s
}

.solution-item-wrapper {
	width: 240px;
	height: 412px;
	background: url(../images/solution_item_bg_01.jpg) center no-repeat
}

.solution-item-02 {
	background-image: url(../images/solution_item_bg_02.jpg)
}

.solution-item-03 {
	background-image: url(../images/solution_item_bg_03.jpg)
}

.solution-item-04 {
	background-image: url(../images/solution_item_bg_04.jpg)
}

.solution-item-05 {
	background-image: url(../images/solution_item_bg_05.jpg)
}

.active .solution-item-wrapper {
	position: absolute;
	z-index: 9;
	top: -62px;
	left: -51px;
	width: 341px;
	height: 526px;
	background: url(../images/solution_item_bg_active_01.jpg) no-repeat;
	-webkit-box-shadow: 0 5px 40px rgba(0,0,0,.5);
	-moz-box-shadow: 0 5px 40px rgba(0,0,0,.5);
	box-shadow: 0 5px 40px rgba(0,0,0,.5)
}

@media only screen and (max-width:1400px) {
	.product-special-li-5.active .solution-item-wrapper {
		left: -102px
	}
}

.active .solution-item-02 {
	background-image: url(../images/solution_item_bg_active_02.jpg)
}

.active .solution-item-03 {
	background-image: url(../images/solution_item_bg_active_03.jpg)
}

.active .solution-item-04 {
	background-image: url(../images/solution_item_bg_active_04.jpg)
}

.active .solution-item-05 {
	background-image: url(../images/solution_item_bg_active_05.jpg)
}

.solution-list ul li p.solution-title {
	position: absolute;
	top: 211px;
	width: 100%;
	text-align: center;
	color: #fff;
	font-size: 18px;
	z-index: 2
}

.solution-list ul li p.solution-intro {
	position: absolute;
	top: 282px;
	left: 50%;
	margin-left: -121px;
	width: 242px;
	overflow: hidden;
	color: #eee;
	line-height: 2;
	z-index: 2;
	opacity: 0;
	filter: alpha(opacity=0);
	font-size: 14px;
	text-align: justify
}

.solution-list ul li a {
	display: none;
	position: absolute;
	top: 452px;
	left: 50%;
	margin-left: -87px;
	width: 174px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 14px;
	color: #fff;
	z-index: 2;
	background-color: #375eab
}

.solution-list ul li a:hover {
	background-color: #0099e5;
	transition: all .6s;
	-moz-transition: all .6s;
	-webkit-transition: all .6s;
	-o-transition: all .6s
}

.solution-list ul li.active p.solution-title {
	top: 158px;
	font-size: 22px
}

.solution-list ul li.active p.solution-intro {
	top: 230px;
	opacity: 1;
	filter: alpha(opacity=100)
}

.solution-list ul li.active a {
	top: 388px;
	display: block
}

.free-certificate {
	height: 590px;
	background: #fff
}

.swiper-wrapper {
	position: relative;
	height: 140px;
	overflow: hidden
}

.certificat-swiper-wrapper {
	position: relative;
	width: 1200px;
	height: 213px;
	overflow: hidden
}

.certificat-swiper-inner {
	position: absolute;
	left: 0;
	top: 0;
	width: 1444px;
	height: 213px;
	-webkit-transition: left .3s;
	-o-transition: left .3s;
	-moz-transition: left .3s;
	transition: left .3s
}

.certificat-swiper-inner.active {
	left: -240px
}

.certificat-item {
	float: left;
	margin-left: 20px;
	width: 222px;
	height: 211px;
	border: 1px solid #d9d9d9
}

.certificat-item:hover {
	-webkit-box-shadow: 0 0 8px rgba(0,0,0,.12);
	-moz-box-shadow: 0 0 8px rgba(0,0,0,.12);
	box-shadow: 0 0 8px rgba(0,0,0,.12)
}

.certificat-item:first-child {
	margin-left: 0
}

.certificat-item-wrapper {
	width: 100%;
	height: 100%
}

.certificat-pic {
	margin: 0 auto;
	width: 102px;
	height: 111px
}

.certificat-pic1 {
	background: url(../images/certificate_bg_01.png) center 34px no-repeat
}

.certificat-pic2 {
	background: url(../images/certificate_bg_02.png) center 34px no-repeat
}

.certificat-pic3 {
	background: url(../images/certificate_bg_03.png) center 34px no-repeat
}

.certificat-pic4 {
	background: url(../images/certificate_bg_04.png) center 34px no-repeat
}

.certificat-pic5 {
	background: url(../images/certificate_bg_05.png) center 34px no-repeat
}

.certificat-pic6 {
	background: url(../images/certificate_bg_06.png) center 34px no-repeat
}

.certificat-introduce {
	margin-top: 30px;
	width: 100%
}

.certificat-introduce-top {
	margin-bottom: 12px;
	height: 18px;
	line-height: 18px;
	font-size: 18px;
	color: #333;
	text-align: center
}

.certificat-introduce-bottom {
	margin-top: 12px;
	height: 12px;
	line-height: 12px;
	color: #999;
	font-size: 12px;
	text-align: center
}

.certificat-active-btn-wrapper {
	margin: 50px auto 0;
	width: 36px;
	height: 10px
}

.certificat-btn {
	float: right;
	border: 1px solid #909090;
	width: 10px;
	height: 10px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background: #fff;
	cursor: pointer
}

.certificat-btn:first-child {
	float: left
}

.certificat-btn.active {
	background: #909090
}

.cooperative-partner {
	background: #f4f4f4
}

.cooperative-partner-list {
	margin-top: 26px
}

.cooperative-partner-item {
	float: left;
	width: 240px;
	height: 184px;
	background-color: transparent;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s
}

.item-01 {
	background: url(../images/parterner_active_01.png) center no-repeat
}

.item-02 {
	background: url(../images/parterner_active_02.png) center no-repeat
}

.item-03 {
	background: url(../images/parterner_active_03.png) center no-repeat
}

.item-04 {
	background: url(../images/parterner_active_04.png) center no-repeat
}

.item-05 {
	background: url(../images/parterner_active_05.png) center no-repeat
}

.item-06 {
	background: url(../images/parterner_active_06.png) center no-repeat
}

.item-07 {
	background: url(../images/parterner_active_07.png) center no-repeat
}

.item-08 {
	background: url(../images/parterner_active_08.png) center no-repeat
}

.item-09 {
	background: url(../images/parterner_active_09.png) center no-repeat
}

.item-10 {
	background: url(../images/parterner_active_10.png) center no-repeat
}

.cooperative-partner-item.active {
	position: relative;
	top: -4px;
	background-color: #fff;
	-webkit-box-shadow: 0 3px 20px rgba(0,0,0,.1);
	-moz-box-shadow: 0 3px 20px rgba(0,0,0,.1);
	box-shadow: 0 3px 20px rgba(0,0,0,.1)
}

.news-trends {
	background: #fff
}

.news-trends-list {
	margin-top: 46px
}

.press-release {
	float: left;
	margin-left: 40px;
	width: 370px
}

.activity-title img {
	height: 140px
}

.press-release:first-child {
	margin-left: 0
}

.press-release-title-wrapper {
	position: relative;
	display: block;
	margin-bottom: 20px
}

.press-release-title {
	position: absolute;
	top: -10px;
	width: 120px;
	height: 120px
}

.blue-bg,.press-release-word {
	position: absolute;
	top: 0;
	left: 0
}

.blue-bg {
	width: 100%;
	height: 100%;
	background-color: #375eab;
	opacity: .9;
	filter: alpha(opacity=90)
}

.press-release-word {
	z-index: 9;
	padding: 30px 34px;
	width: 120px;
	height: 120px;
	font-size: 20px;
	text-align: center;
	line-height: 32px;
	color: #fff
}

.release-title-bg {
	width: 370px;
	height: 100px
}

.release-title-bg.title-bg-1 {
	background: url(../images/news_bg_01.jpg) center no-repeat
}

.release-title-bg.title-bg-2,.release-title-bg.title-bg-3 {
	background: url(../images/news_bg_02.jpg) center no-repeat
}

.press-news-pic {
	position: relative;
	margin: 20px auto 0;
	width: 90%;
	height: 74px;
	overflow: hidden
}

.press-news-picbg {
	position: absolute;
	left: 50%;
	top: 50%;
	display: block;
	margin-left: -173px;
	margin-top: -40px;
	height: 80px;
	width: 346px;
	-moz-background-size: cover;
	background-size: cover;
	background-position: center;
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s
}

.press-news-pic:hover .press-news-picbg {
	-ms-transform: scale(1.1);
	transform: scale(1.1);
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1)
}

.press-news-picbg1 {
	background-image: url(../images/news_bg1.png)
}

.press-news-picbg2 {
	background-image: url(../images/news_bg2.png)
}

.press-release-list li a.active span,.press-release-list li a:hover span {
	color: #375eab
}

.press-release-list {
	margin: 0 auto;
	height: 174px
}

.press-release-list li {
	margin-top: 22px;
	float: left;
	width: 100%;
	height: 14px;
	line-height: 14px
}

.press-release-list li:first-child {
	margin-top: 20px
}

.press-release-list li a {
	display: block
}

.press-release-list li a i {
	float: left;
	width: 21%;
	font-style: normal;
	font-size: 12px;
	color: #888;
	white-space: nowrap
}

.press-release-list li a span {
	float: left;
	width: 76%;
	font-size: 14px;
	color: #555;
	white-space: nowrap;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden
}

.activity-title {
	text-align: center
}

.activity-title a {
	display: block;
	margin: 0 auto;
	width: 370px;
	height: 260px;
	overflow: hidden
}

.activity-title a img {
	width: 100%;
	height: 100%;
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s
}

.activity-title a img:hover {
	-ms-transform: scale(1.1);
	transform: scale(1.1);
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1)
}

.free-registration {
	height: 36px;
	line-height: 36px;
	text-align: center;
	padding: 60px 0 40px
}

.free-registration a {
	display: inline-block;
	padding: 0 42px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 16px;
	color: #fff;
	background: #009fd9;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px
}

.free-registration a:hover {
	background: #ff8909
}

.map-service {
	position: relative;
	height: 760px;
	background: url(../images/map_balck_whole_bg.jpg) center no-repeat;background-size: 100%;
}

.map-service-left {
	position: absolute;
	left: 0;
	top: 0;
	padding-top: 144px
}

.china-map,.map-service-box {
	position: relative
}

.map-service-intro-div {
	margin-bottom: 26px;
	padding-left: 56px;
	height: 96px
}

.map-intro-div-01 {
	background: url(../images/map_service_intro_icon_01.png) no-repeat
}

.map-intro-div-02 {
	background: url(../images/map_service_intro_icon_02.png) no-repeat
}

.map-intro-div-03 {
	background: url(../images/map_service_intro_icon_03.png) no-repeat;
	margin-bottom: 60px
}

.map-service-intro-title {
	height: 36px;
	line-height: 36px;
	color: #eee;
	font-size: 32px
}

.map-service-intro-subtitle {
	height: 59px;
	width: 216px;
	border-bottom: 1px solid #56585c;
	line-height: 50px;
	font-size: 18px;
	color: #999
}

.map-intro-div-03 .map-service-intro-subtitle {
	border-bottom: none
}

a.map-service-more-link {
	display: block;
	margin-bottom: 38px;
	width: 174px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 14px;
	color: #fff;
	background-color: #375eab
}

.area-box .dot,.area-box .pulse,.douhao,.show-regin span {
	display: inline-block
}

a.map-service-more-link:hover {
	background-color: #0099e5
}

.map-service-tip-item {
	display: inline-block;
	margin-right: 34px;
	float: left;
	padding-left: 21px;
	height: 14px;
	line-height: 14px;
	font-size: 14px
}

.tip-item-01 {
	color: #375eab;
	background: url(../images/tip_icon_blue.png) 0 center no-repeat
}

.tip-item-02 {
	color: #d3810c;
	background: url(../images/tip_icon_orange.png) 0 center no-repeat
}

.tip-item-03 {
	color: #757370;
	background: url(../images/tip_icon_black.png) 0 center no-repeat
}

.map-product {
	padding-bottom: 30px
}

.map-service-right {
	margin-left: 414px;
	padding-top: 60px
}

.china-map {
	width: 748px;
	height: 618px;
	background: url(../images/map_black_bg.png) center no-repeat
}

.region-list {
	position: absolute;
	left: 0;
	top: 0
}

@-webkit-keyframes warn {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 1
	}

	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 0
	}
}

@-moz-keyframes warn {
	0% {
		-moz-transform: scale(0);
		transform: scale(0);
		opacity: 1
	}

	100% {
		-moz-transform: scale(1);
		transform: scale(1);
		opacity: 0
	}
}

@-o-keyframes warn {
	0% {
		-o-transform: scale(0);
		transform: scale(0);
		opacity: 1
	}

	100% {
		-o-transform: scale(1);
		transform: scale(1);
		opacity: 0
	}
}

@keyframes warn {
	0% {
		-webkit-transform: scale(0);
		-moz-transform: scale(0);
		-o-transform: scale(0);
		transform: scale(0);
		opacity: 1
	}

	100% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
		opacity: 0
	}
}

.area-box .dot {
	position: absolute;
	left: 0;
	width: 10px;
	height: 10px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background: #a2a9b4;
	opacity: 1;
	filter: alpha(opacity=100)
}

.area-box .pulse {
	position: absolute;
	top: -28px;
	left: -28px;
	height: 66px;
	width: 66px;
	border: 2px solid #b7b7b7;
	-webkit-border-radius: 48px;
	-moz-border-radius: 48px;
	border-radius: 48px;
	-webkit-box-shadow: 0 0 4px #82878f,0 0 10px #82878f inset;
	-moz-box-shadow: 0 0 4px #82878f,0 0 10px #82878f inset;
	box-shadow: 0 0 4px #82878f,0 0 10px #82878f inset;
	opacity: .12;
	filter: alpha(opacity=0);
	-webkit-animation: warn 2s ease-out both;
	-moz-animation: warn 2s ease-out both;
	-o-animation: warn 2s ease-out both;
	animation: warn 2s ease-out both;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-iteration-count: infinite;
	-o-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	background: 0 0
}

.area-box .delay-01 {
	-webkit-animation-delay: 0;
	-moz-animation-delay: 0;
	-o-animation-delay: 0;
	animation-delay: 0
}

.area-box .delay-02 {
	-webkit-animation-delay: .4s;
	-moz-animation-delay: .4s;
	-o-animation-delay: .4s;
	animation-delay: .4s
}

.area-box .delay-03 {
	-webkit-animation-delay: .8s;
	-moz-animation-delay: .8s;
	-o-animation-delay: .8s;
	animation-delay: .8s
}

.area-box .delay-04 {
	-webkit-animation-delay: 1.2s;
	-moz-animation-delay: 1.2s;
	-o-animation-delay: 1.2s;
	animation-delay: 1.2s
}

.area-box .delay-05 {
	-webkit-animation-delay: 1.6s;
	-moz-animation-delay: 1.6s;
	-o-animation-delay: 1.6s;
	animation-delay: 1.6s
}

.area-box .delay-06 {
	-webkit-animation-delay: 2s;
	-moz-animation-delay: 2s;
	-o-animation-delay: 2s;
	animation-delay: 2s
}

.area-box .delay-07 {
	-webkit-animation-delay: 2.4s;
	-moz-animation-delay: 2.4s;
	-o-animation-delay: 2.4s;
	animation-delay: 2.4s
}

.area-box .delay-08 {
	-webkit-animation-delay: -.4s;
	-moz-animation-delay: -.4s;
	-o-animation-delay: -.4s;
	animation-delay: -.4s
}

.area-box .delay-09 {
	-webkit-animation-delay: -.8s;
	-moz-animation-delay: -.8s;
	-o-animation-delay: -.8s;
	animation-delay: -.8s
}

.area-box .delay-10 {
	-webkit-animation-delay: -1.2s;
	-moz-animation-delay: -1.2s;
	-o-animation-delay: -1.2s;
	animation-delay: -1.2s
}

.area-box .delay-11 {
	-webkit-animation-delay: 4s;
	-moz-animation-delay: 4s;
	-o-animation-delay: 4s;
	animation-delay: 4s
}

.region-list.active .area-box .dot {
	background: #009fd9
}

.region-list.active .area-box .pulse {
	border-color: #009fd9;
	top: -39px;
	left: -39px;
	height: 88px;
	width: 88px;
	-webkit-box-shadow: 0 0 12px #0080d9,0 0 20px #0080d9 inset;
	-moz-box-shadow: 0 0 12px #0080d9,0 0 20px #0080d9 inset;
	box-shadow: 0 0 12px #0080d9,0 0 20px #0080d9 inset
}

.region-list.waite .area-box .dot {
	background: #f90
}

.region-list.waite .area-box .pulse {
	border-color: #f90
}

.show-regin {
	position: absolute;
	left: 2px;
	height: 0;
	top: 0;
	width: 11px;
	opacity: 0;
	-o-transition: all .5s ease-in-out;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out
}

.online-node .show-regin,.region-list:hover .show-regin,.underline-node .show-regin,.waite-node .show-regin {
	height: 127px;
	opacity: 1
}

.show-regin span {
	width: 80px;
	position: absolute;
	left: 8px;
	top: -11px;
	padding: 6px 10px;
	font-size: 14px;
	color: #ccc;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	text-align: center
}

.postition-10 .show-regin span {
	left: 0
}

.postition-6 .show-regin span {
	left: -72px
}

.area-box {
	z-index: 77
}

.show-regin {
	z-index: 66
}

.region-list.active .show-regin span {
	position: relative;
	color: #ccc
}

.region-list.waite .show-regin span {
	color: #ccc
}

.postition-1 {
	left: 302px;
	top: 308px
}

.postition-2 {
	left: 401px;
	top: 403px
}

.postition-3 {
	left: 358px;
	top: 516px
}

.postition-4 {
	left: 473px;
	top: 348px
}

.postition-5 {
	left: 526px;
	top: 394px
}

.postition-6 {
	left: 526px;
	top: 515px
}

.postition-7 {
	left: 652px;
	top: 200px
}

.postition-7.region-list.active .area-box .pulse {
	top: -50px;
	left: -50px;
	width: 110px;
	height: 110px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%
}

.postition-8 {
	left: 559px;
	top: 229px
}

.postition-9 {
	left: 637px;
	top: 371px
}

.postition-9.region-list.active .area-box .pulse {
	top: -50px;
	left: -50px;
	width: 110px;
	height: 110px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%
}

.postition-10 {
	left: 554px;
	top: 539px
}

.postition-11 {
	left: 604px;
	top: 300px
}

.postition-13 {
	left: 470px;
	top: 250px
}

.douhao {
	width: 0
}