﻿.back-white, .btn {
	background: #fff
}
@font-face {
	font-family: bebasregular;
	src: url(bebas-webfont.woff2?v=jH%2F8dt2DDR8euXWr0jBygg%3D%3D) format('woff2'), url(bebas-webfont.woff?v=fUIZyY3Gpk83juBGBiZpkg%3D%3D) format('woff');
	font-weight: 400;
	font-style: normal
}
.index-page .header-container {
	height: 720px
}
.btn {
	display: inline-block;
	width: 100px;
	height: 32px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	line-height: 32px;
	color: #009FD9;
	text-align: center;
	text-decoration: none;
	font-size: 14px;
	cursor: pointer
}
.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;
	background: url(../img/sub_banner_link.png?v=x83KDWfDg0qrz82YhJ%2BFIA%3D%3D) center no-repeat
}
.subbanner-link-icon:hover {
	background: url(../img/sub_banner_link_hover.png?v=BH4z4VfrffVnAoDsjcwLBQ%3D%3D) center no-repeat
}
.service-action-box {
	position: relative
}
.subbanner-1 {
	/*background: url(../img/sub_banner_bg_1.png?v=gBTsAl%2F4hAPJflASRapqyA%3D%3D) center no-repeat */
}
.subbanner-2 {
	/*background: url(../img/sub_banner_bg_2.png?v=DndggFGgE8DqYYoTrZgFXA%3D%3D) center no-repeat */
}
.subbanner-3 {
	/*background: url(../img/sub_banner_bg_3.png?v=0FMVIQLWneqa9PJPQ6Y17A%3D%3D) center no-repeat */
}
.subbanner-4 {
	/*background: url(../img/sub_banner_bg_4.png?v=eW%2Fm%2BuifvzCYL3v3GSb0%2FQ%3D%3D) center no-repeat */
}
.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: #0af;
	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(../img/animate_01_big_white.png?v=yOj2p1AO0ZP4wRPjsB3fMg%3D%3D) center no-repeat
}
.animate01-small-white {
	z-index: 9;
	top: 80px;
	left: 22px;
	width: 91px;
	height: 75px;
	background: url(../img/animate_01_small_white.png?v=n4rnhTFrypKF62LzD%2Bw5Sw%3D%3D) center no-repeat
}
.animate01-big-blue {
	z-index: 6;
	top: 32px;
	left: 45px;
	width: 91px;
	height: 109px;
	background: url(../img/animate_01_big_blue.png?v=HuH8%2FdbalzbnSvXZs3%2FL6w%3D%3D) center no-repeat
}
.animate01-small-blue {
	z-index: 6;
	top: -2px;
	left: 19px;
	width: 91px;
	height: 75px;
	background: url(../img/animate_01_small_blue.png?v=WkHvDMzfxgSxiYIi8jbjuA%3D%3D) 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{ background:url(../img/data01.png) center no-repeat;}
.superiority-li-item-02{background:url(../img/data02.png) center no-repeat;}
.superiority-li-item-03{ background:url(../img/data03.png) center no-repeat;}
.superiority-li-item-04{background:url(../img/data04.png) center no-repeat;}

.superiority-big-num {
	margin-bottom: 16px;
	height: 38px;
	line-height: 38px;
	font-size: 38px;
	color: #333;
	font-weight: bold;
	font-family: "微软雅黑"
}
.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: 16px;
	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(../img/product_header_icon_01.png?v=u6MB8jpMvlb4ETgetkiXmg%3D%3D) center no-repeat
}
.server-header-02 {
	background: url(../img/product_header_icon_02.png?v=qrqvw2n74ZZk19kq7kdjzw%3D%3D) center no-repeat
}
.server-header-03 {
	background: url(../img/product_header_icon_03.png?v=HlcxPNdWfKZ9LZkOl%2BEWzw%3D%3D) center no-repeat
}
.server-header-04 {
	background: url(../img/product_header_icon_04.png?v=p8tdP16h9TcRhQH2y5zByQ%3D%3D) center no-repeat
}
.server-header-05 {
	background: url(../img/product_header_icon_05.png?v=6QCF61zZb%2BgHzycDWrCfEQ%3D%3D) center no-repeat
}
.server-header-active-01 {
	background: url(../img/product_header_active_icon_01.png?v=KzwPXHTgJjeia1QnhzPgug%3D%3D) center no-repeat
}
.server-header-active-02 {
	background: url(../img/product_header_active_icon_02.png?v=wkoC0vAckRVOAJeQXUYuFQ%3D%3D) center no-repeat
}
.server-header-active-03 {
	background: url(../img/product_header_active_icon_03.png?v=5ZFrBl4QSQ50rQ0EvXuX3Q%3D%3D) center no-repeat
}
.server-header-active-04 {
	background: url(../img/product_header_active_icon_04.png?v=fEWjJmQtOOSmn7nfN%2BWPEQ%3D%3D) center no-repeat
}
.server-header-active-05 {
	background: url(../img/product_header_active_icon_05.png?v=NG75idoOba%2FXlCoO9vFAXA%3D%3D) center no-repeat
}
.idc-bg {
	background: url(../img/index-sprite.png?v=dJUGRsR55jPozZl5J1Gqgg%3D%3D) 0 -1421px no-repeat
}
.host-bg {
	background: url(../img/index-sprite.png?v=dJUGRsR55jPozZl5J1Gqgg%3D%3D) -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: #0af;
	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(../img/producet_bg_01.jpg?v=AkUZgJS5uC07QzGc4HXeuw%3D%3D) center no-repeat
}
.active-inner-02 {
	background: url(../img/producet_bg_02.jpg?v=CjvciOldVtgukp3HUJgk0w%3D%3D) center no-repeat
}
.active-inner-03 {
	background: url(../img/producet_bg_03.jpg?v=KUYnIbNMQBKITuVNmkOhNA%3D%3D) center no-repeat
}
.active-inner-04 {
	background: url(../img/producet_bg_04.jpg?v=X7eDG7f3EytHMCB%2FMFnZmg%3D%3D) center no-repeat
}
.active-inner-05 {
	background: url(../img/producet_bg_05.jpg?v=fD14WILUXChNLNb%2FrTkOBg%3D%3D) 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(../img/add-icon.png?v=jncEq%2BuUvA0wDYjdSzG%2FTA%3D%3D) no-repeat #fafafa;
	color: #666
}
.product-tab-item.active .product-tab-title {
	background: url(../img/reduce_icon.png?v=ztIEup%2B7a%2FafH7dZtVdjwg%3D%3D) 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(../img/net_safet_whole_bg.jpg?v=MQIWaGgX3QK2kkOxiWfl2Q%3D%3D) center no-repeat
}
.net-black-div-box {
	z-index: 1;
	width: 775px;
	height: 457px;
	top: 267px;
	left: 187px;
	position: absolute;
	background: url(../img/net_black_bg.png?v=kMmyqtncfnAo%2F6qeFDZn3Q%3D%3D) center no-repeat
}
.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-01 {
	background: url(../img/net_safety_icon_01.png?v=BpkMWDuPKS%2BvkbLyD2TMyw%3D%3D) no-repeat
}
.safety-intro-div-02 {
	background: url(../img/net_safety_icon_02.png?v=Cu4fx9qSry%2BmkKMsRzQi8A%3D%3D) no-repeat
}
.safety-intro-div-03 {
	background: url(../img/net_safety_icon_03.png?v=34acs0kBxAXS7jeDyAdWqA%3D%3D) no-repeat
}
.safety-intro-div-04 {
	background: url(../img/net_safety_icon_04.png?v=tIylPlYjQEdhfHGMdr4rRw%3D%3D) no-repeat
}
.safety-intro-div-01:hover {
	background: url(../img/net_safety_icon_active_01.png?v=%2BxNadyjSKGPDaZBhgUuGkw%3D%3D) no-repeat
}
.safety-intro-div-02:hover {
	background: url(../img/net_safety_icon_active_02.png?v=BVh7MAIvQwsT9aH2GAV4gg%3D%3D) no-repeat
}
.safety-intro-div-03:hover {
	background: url(../img/net_safety_icon_active_03.png?v=VjbZTg%2FhZFLjabqhW0hilg%3D%3D) no-repeat
}
.safety-intro-div-04:hover {
	background: url(../img/net_safety_icon_active_04.png?v=DjG3QgK3qzU8wUeKDZLa8g%3D%3D) 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(../img/net_safety_subtitle_icon.png?v=PbBrXFViznDhROzDZe8Lwg%3D%3D) 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 {
background:url(../img/pingtai.png)	 no-repeat;
}

@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(../img/net_safety_animate_wrapper_bg_01.png?v=5I%2FiCPVDubDKuA3sotwJsQ%3D%3D)
}
.net-safety-animate-wrapper-bg-02 {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 909px;
	height: 686px;
	background: url(../img/net_safety_animate_wrapper_bg_02.png?v=wdf5LxvVm2lGYzFtTRoCDQ%3D%3D)
}
.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(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 15%, 30%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@-moz-keyframes storage-animate1 {
0% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 15%, 30%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@-o-keyframes storage-animate1 {
0% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 15%, 30%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@keyframes storage-animate1 {
0% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 15%, 30%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@-webkit-keyframes storage-animate2 {
0%, 15% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 30%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@-moz-keyframes storage-animate2 {
0%, 15% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 30%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@-o-keyframes storage-animate2 {
0%, 15% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 30%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@keyframes storage-animate2 {
0%, 15% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 30%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@-webkit-keyframes storage-animate3 {
0%, 15%, 30% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@-moz-keyframes storage-animate3 {
0%, 15%, 30% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@-o-keyframes storage-animate3 {
0%, 15%, 30% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
@keyframes storage-animate3 {
0%, 15%, 30% {
background:url(../img/storage_empty_box.png?v=ta7c9rGffLPI1tcqs1sYsQ%3D%3D) center no-repeat
}
100%, 45% {
background:url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) center no-repeat
}
60%, 85% {
background:url(../img/storage_light_box.png?v=%2B7ZgUYH7n7ktXBX6NuQ9ng%3D%3D) center no-repeat
}
}
.storage-animate-item {
	width: 78px;
	height: 115px;
	background: url(../img/storage_box.png?v=y8pUbwlIZiKrfq8xlCAcBw%3D%3D) 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(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) center no-repeat
}
@-webkit-keyframes safe-animate {
0% {
background:url(../img/safe_animate_01.png?v=fk%2FIp6KDLor5c76NuJg34Q%3D%3D) center no-repeat
}
12.5% {
background:url(../img/safe_animate_02.png?v=TZAHmtcEbccr4V2P9DQM4Q%3D%3D) center no-repeat
}
25% {
background:url(../img/safe_animate_03.png?v=LZGKinPCJtwuho68fEWwhQ%3D%3D) center no-repeat
}
37.5% {
background:url(../img/safe_animate_04.png?v=8bK%2Bz1tmWMotqwrQOOU%2F6Q%3D%3D) center no-repeat
}
50% {
background:url(../img/safe_animate_05.png?v=pRQP9zOf7Kg5sCMEPdgWaw%3D%3D) center no-repeat
}
62.5% {
background:url(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) center no-repeat
}
75%, 87.5% {
background:url(../img/safe_animate_07.png?v=DMuF7mJ7xG4DO0ntcYTIHg%3D%3D) center no-repeat
}
100% {
background:url(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) center no-repeat
}
}
@-moz-keyframes safe-animate {
0% {
background:url(../img/safe_animate_01.png?v=fk%2FIp6KDLor5c76NuJg34Q%3D%3D) center no-repeat
}
12.5% {
background:url(../img/safe_animate_02.png?v=TZAHmtcEbccr4V2P9DQM4Q%3D%3D) center no-repeat
}
25% {
background:url(../img/safe_animate_03.png?v=LZGKinPCJtwuho68fEWwhQ%3D%3D) center no-repeat
}
37.5% {
background:url(../img/safe_animate_04.png?v=8bK%2Bz1tmWMotqwrQOOU%2F6Q%3D%3D) center no-repeat
}
50% {
background:url(../img/safe_animate_05.png?v=pRQP9zOf7Kg5sCMEPdgWaw%3D%3D) center no-repeat
}
62.5% {
background:url(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) center no-repeat
}
75%, 87.5% {
background:url(../img/safe_animate_07.png?v=DMuF7mJ7xG4DO0ntcYTIHg%3D%3D) center no-repeat
}
100% {
background:url(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) center no-repeat
}
}
@-o-keyframes safe-animate {
0% {
background:url(../img/safe_animate_01.png?v=fk%2FIp6KDLor5c76NuJg34Q%3D%3D) center no-repeat
}
12.5% {
background:url(../img/safe_animate_02.png?v=TZAHmtcEbccr4V2P9DQM4Q%3D%3D) center no-repeat
}
25% {
background:url(../img/safe_animate_03.png?v=LZGKinPCJtwuho68fEWwhQ%3D%3D) center no-repeat
}
37.5% {
background:url(../img/safe_animate_04.png?v=8bK%2Bz1tmWMotqwrQOOU%2F6Q%3D%3D) center no-repeat
}
50% {
background:url(../img/safe_animate_05.png?v=pRQP9zOf7Kg5sCMEPdgWaw%3D%3D) center no-repeat
}
62.5% {
background:url(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) center no-repeat
}
75%, 87.5% {
background:url(../img/safe_animate_07.png?v=DMuF7mJ7xG4DO0ntcYTIHg%3D%3D) center no-repeat
}
100% {
background:url(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) center no-repeat
}
}
@keyframes safe-animate {
0% {
background:url(../img/safe_animate_01.png?v=fk%2FIp6KDLor5c76NuJg34Q%3D%3D) center no-repeat
}
12.5% {
background:url(../img/safe_animate_02.png?v=TZAHmtcEbccr4V2P9DQM4Q%3D%3D) center no-repeat
}
25% {
background:url(../img/safe_animate_03.png?v=LZGKinPCJtwuho68fEWwhQ%3D%3D) center no-repeat
}
37.5% {
background:url(../img/safe_animate_04.png?v=8bK%2Bz1tmWMotqwrQOOU%2F6Q%3D%3D) center no-repeat
}
50% {
background:url(../img/safe_animate_05.png?v=pRQP9zOf7Kg5sCMEPdgWaw%3D%3D) center no-repeat
}
62.5% {
background:url(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) center no-repeat
}
75%, 87.5% {
background:url(../img/safe_animate_07.png?v=DMuF7mJ7xG4DO0ntcYTIHg%3D%3D) center no-repeat
}
100% {
background:url(../img/safe_animate_06.png?v=oYw7nuZE3MQUAYsb5lOciw%3D%3D) 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(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) center no-repeat
}
@-webkit-keyframes server-animate {
0% {
background:url(../img/server_animate_01.png?v=cilEmcaB8RQFefQYrFqynw%3D%3D) center no-repeat
}
15% {
background:url(../img/server_animate_02.png?v=bQPWJGG3bhBZnDuHLsZXSw%3D%3D) center no-repeat
}
30% {
background:url(../img/server_animate_03.png?v=RtZnjNy3vPmyV%2BDAVlJ%2FYA%3D%3D) center no-repeat
}
45% {
background:url(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) center no-repeat
}
67.5% {
background:url(../img/server_animate_05.png?v=JD%2B3FcFZQSLxPw%2FbEgzCkA%3D%3D) center no-repeat
}
100% {
background:url(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) center no-repeat
}
}
@-moz-keyframes server-animate {
0% {
background:url(../img/server_animate_01.png?v=cilEmcaB8RQFefQYrFqynw%3D%3D) center no-repeat
}
15% {
background:url(../img/server_animate_02.png?v=bQPWJGG3bhBZnDuHLsZXSw%3D%3D) center no-repeat
}
30% {
background:url(../img/server_animate_03.png?v=RtZnjNy3vPmyV%2BDAVlJ%2FYA%3D%3D) center no-repeat
}
45% {
background:url(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) center no-repeat
}
67.5% {
background:url(../img/server_animate_05.png?v=JD%2B3FcFZQSLxPw%2FbEgzCkA%3D%3D) center no-repeat
}
100% {
background:url(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) center no-repeat
}
}
@-o-keyframes server-animate {
0% {
background:url(../img/server_animate_01.png?v=cilEmcaB8RQFefQYrFqynw%3D%3D) center no-repeat
}
15% {
background:url(../img/server_animate_02.png?v=bQPWJGG3bhBZnDuHLsZXSw%3D%3D) center no-repeat
}
30% {
background:url(../img/server_animate_03.png?v=RtZnjNy3vPmyV%2BDAVlJ%2FYA%3D%3D) center no-repeat
}
45% {
background:url(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) center no-repeat
}
67.5% {
background:url(../img/server_animate_05.png?v=JD%2B3FcFZQSLxPw%2FbEgzCkA%3D%3D) center no-repeat
}
100% {
background:url(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) center no-repeat
}
}
@keyframes server-animate {
0% {
background:url(../img/server_animate_01.png?v=cilEmcaB8RQFefQYrFqynw%3D%3D) center no-repeat
}
15% {
background:url(../img/server_animate_02.png?v=bQPWJGG3bhBZnDuHLsZXSw%3D%3D) center no-repeat
}
30% {
background:url(../img/server_animate_03.png?v=RtZnjNy3vPmyV%2BDAVlJ%2FYA%3D%3D) center no-repeat
}
45% {
background:url(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) center no-repeat
}
67.5% {
background:url(../img/server_animate_05.png?v=JD%2B3FcFZQSLxPw%2FbEgzCkA%3D%3D) center no-repeat
}
100% {
background:url(../img/server_animate_04.png?v=HmzkcyLX6m89R2aQylzWtA%3D%3D) 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(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) 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(../img/connect_bg_01.png?v=IimaOPzWiFDgiBqj%2F1LtBQ%3D%3D) center no-repeat
}
.connect-bg-02 {
	z-index: 1;
	background: url(../img/connect_bg_02.png?v=wWma%2FWStrrarxFcCm5GN6A%3D%3D) 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(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) center no-repeat
}
80%, 90% {
background:url(../img/net_connect_move_light.png?v=lNdOJlbXYOsPQeG4XfifSA%3D%3D) center no-repeat
}
100% {
background:url(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) 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(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) center no-repeat
}
80%, 90% {
background:url(../img/net_connect_move_light.png?v=lNdOJlbXYOsPQeG4XfifSA%3D%3D) center no-repeat
}
100% {
background:url(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) 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(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) center no-repeat
}
80%, 90% {
background:url(../img/net_connect_move_light.png?v=lNdOJlbXYOsPQeG4XfifSA%3D%3D) center no-repeat
}
100% {
background:url(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) 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(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) center no-repeat
}
80%, 90% {
background:url(../img/net_connect_move_light.png?v=lNdOJlbXYOsPQeG4XfifSA%3D%3D) center no-repeat
}
100% {
background:url(../img/net_connect_move.png?v=FdEb0e2FZGL2bOgQYTQMoQ%3D%3D) 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(../img/yellow_light_01.png?v=YiYLGAKEUzfuPsJDy%2FhFbQ%3D%3D) center no-repeat
}
25%, 75% {
background:url(../img/yellow_light_02.png?v=A93fc6tcwjt95BIVRWvkcQ%3D%3D) center no-repeat
}
}
@-moz-keyframes yellow-light {
0%, 100% {
background:url(../img/yellow_light_01.png?v=YiYLGAKEUzfuPsJDy%2FhFbQ%3D%3D) center no-repeat
}
25%, 75% {
background:url(../img/yellow_light_02.png?v=A93fc6tcwjt95BIVRWvkcQ%3D%3D) center no-repeat
}
}
@-o-keyframes yellow-light {
0%, 100% {
background:url(../img/yellow_light_01.png?v=YiYLGAKEUzfuPsJDy%2FhFbQ%3D%3D) center no-repeat
}
25%, 75% {
background:url(../img/yellow_light_02.png?v=A93fc6tcwjt95BIVRWvkcQ%3D%3D) center no-repeat
}
}
@keyframes yellow-light {
0%, 100% {
background:url(../img/yellow_light_01.png?v=YiYLGAKEUzfuPsJDy%2FhFbQ%3D%3D) center no-repeat
}
25%, 75% {
background:url(../img/yellow_light_02.png?v=A93fc6tcwjt95BIVRWvkcQ%3D%3D) center no-repeat
}
}
.yellow-light {
	position: absolute;
	width: 52px;
	height: 35px;
	background: url(../img/yellow_light_01.png?v=YiYLGAKEUzfuPsJDy%2FhFbQ%3D%3D) 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(../img/net_safety_text_new_01.png?v=IAEsDiFnkYK%2BTn%2B4ZW4pvA%3D%3D) center no-repeat
}
.net-safety-text2 {
	width: 77px;
	height: 77px;
	top: 222px;
	left: 413px;
	background: url(../img/net_safety_text_new_02.png?v=mv7onjE65mpn%2FqZ6fBvISQ%3D%3D) center no-repeat
}
.net-safety-text3 {
	top: 223px;
	left: 739px;
	background: url(../img/net_safety_text_new_03.png?v=z3wf417i42OMwFJTGYRzkw%3D%3D) center no-repeat
}
.net-safety-text4 {
	top: 429px;
	left: 473px;
	background: url(../img/net_safety_text_new_04.png?v=OVjrDBlp61pPWSKnxF6drA%3D%3D) center no-repeat
}
.net-safety-light-circle {
	position: absolute;
	width: 16px;
	height: 12px;
	background: url(../img/net-light-point.png?v=eco4sF6F8HsxiWZLLBN%2FYw%3D%3D) 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(../img/net_safety_block_last.png?v=q9JEBOj3JqfX84mGfjReNA%3D%3D) 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: #009dff
}
.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(../img/solution_item_bg_01.jpg?v=irsgeyfCs%2FpPCWMl11vvwA%3D%3D) center no-repeat
}
.solution-item-02 {
	background-image: url(../img/solution_item_bg_02.jpg?v=orN9y2l1tytWGOCC4mEPBg%3D%3D)
}
.solution-item-03 {
	background-image: url(../img/solution_item_bg_03.jpg?v=gQ%2BjtlypbLEf90eOJREioA%3D%3D)
}
.solution-item-04 {
	background-image: url(../img/solution_item_bg_04.jpg?v=5kD2QSY2UCB2g6Nvo%2B7vXA%3D%3D)
}
.solution-item-05 {
	background-image: url(../img/solution_item_bg_05.jpg?v=8Qe6QOFSW9hwLELrwm1cqA%3D%3D)
}
.active .solution-item-wrapper {
	position: absolute;
	z-index: 9;
	top: -62px;
	left: -51px;
	width: 341px;
	height: 526px;
	background: url(../img/solution_item_bg_active_01.jpg?v=WtfmjgEn1KA8c5GzaEAyvQ%3D%3D) 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(../img/solution_item_bg_active_02.jpg?v=f%2FrLhARiFvEcIZ0AZmrktA%3D%3D)
}
.active .solution-item-03 {
	background-image: url(../img/solution_item_bg_active_03.jpg?v=Y6c8bqBcM7Wf2QaUqAmOwg%3D%3D)
}
.active .solution-item-04 {
	background-image: url(../img/solution_item_bg_active_04.jpg?v=0YZsecI9fDaQikILCdqM6g%3D%3D)
}
.active .solution-item-05 {
	background-image: url(../img/solution_item_bg_active_05.jpg?v=BfZQS0Yx8CewdAlam0xSkg%3D%3D)
}
.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: #0af
}
.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: 150px;
	height: 130px
}
.certificat-pic1 {
	background: url(../img/certificate_bg_01.png) center 5px no-repeat
}
.certificat-pic2 {
	background: url(../img/certificate_bg_02.png) center 5px no-repeat
}
.certificat-pic3 {
	background: url(../img/certificate_bg_03.png) center 5px no-repeat
}
.certificat-pic4 {
	background: url(../img/certificate_bg_04.png) center 5px no-repeat
}
.certificat-pic5 {
	background: url(../img/certificate_bg_05.png) center 5px no-repeat
}
.certificat-pic6 {
	background: url(../img/certificate_bg_06.png) center 5px no-repeat
}
.certificat-introduce {
	margin-top: 20px;
	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(../img/parterner_active_01.png?v=WJ1Mr%2BJLl4Wigq%2B4ANwWcw%3D%3D) center no-repeat
}
.item-02 {
	background: url(../img/parterner_active_02.png?v=obxiCOFR3dQt9jWWSUF85A%3D%3D) center no-repeat
}
.item-03 {
	background: url(../img/parterner_active_03.png?v=by2%2BRvcb0vRkGQkoV4iPeA%3D%3D) center no-repeat
}
.item-04 {
	background: url(../img/parterner_active_04.png?v=HGoD0%2BM2jrsTQwTyo7ITUg%3D%3D) center no-repeat
}
.item-05 {
	background: url(../img/parterner_active_05.png?v=I2AYuHEYa0uX5mVASh3ngA%3D%3D) center no-repeat
}
.item-06 {
	background: url(../img/parterner_active_06.png?v=5eestuMat2FS7oN9n3Uwwg%3D%3D) center no-repeat
}
.item-07 {
	background: url(../img/parterner_active_07.png?v=pHPeDw0rPVuz%2FAoqmCLdmQ%3D%3D) center no-repeat
}
.item-08 {
	background: url(../img/parterner_active_08.png?v=312CMnJoL9AJmIDDFWrAMg%3D%3D) center no-repeat
}
.item-09 {
	background: url(../img/parterner_active_09.png?v=FHDzTTgs5JgTfGHvtmEkew%3D%3D) center no-repeat
}
.item-10 {
	background: url(../img/parterner_active_10.png?v=UhvLdWzD9vLqr7eNiQQs%2Bw%3D%3D) 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: #0af;
	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(../img/news_bg_01.jpg?v=qqEE3zqb%2BgSbiI%2B3Rx5MnA%3D%3D) center no-repeat
}
.release-title-bg.title-bg-2, .release-title-bg.title-bg-3 {
	background: url(../img/news_bg_02.jpg?v=uRsODiNN2VcEhLRPdBfQsA%3D%3D) 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(../img/news_bg1.png?v=Gwh28CmYGudibWjrxRcp7A%3D%3D)
}
.press-news-picbg2 {
	background-image: url(../img/news_bg2.png?v=qSWmxUxYfmy8nUhpSaAUhg%3D%3D)
}
.press-release-list li a.active span, .press-release-list li a:hover span {
	color: #0af
}
.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(../img/map_balck_whole_bg.jpg) center no-repeat
}
.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-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
}

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: #0af
}
.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: #0af;
	background: url(../img/tip_icon_blue.png?v=1Dh3C41sDpA%2BDmKy8cS%2Fsg%3D%3D) 0 center no-repeat
}
.tip-item-02 {
	color: #d3810c;
	background: url(../img/tip_icon_orange.png?v=8B4P9waYy2dXv1rXgdI%2B0Q%3D%3D) 0 center no-repeat
}
.tip-item-03 {
	color: #757370;
	background: url(../img/tip_icon_black.png?v=sRrUgty87jwJzJeAHNCiHg%3D%3D) 0 center no-repeat
}
.map-product {
	padding-bottom: 30px
}
.map-service-right {
	margin-left: 0px;
	padding-top: 60px
}
.china-map {
	width: 1210px;
	height: 618px;
	background: url(../img/map_black_bg0.png?v=V5%2BmYoOvLm2uS5%2FTsYKPyQ%3D%3D) 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: 960px;
	top: 453px
}
.postition-3 {
	left: 358px;
	top: 516px
}
.postition-4 {
	left: 1080px;
	top: 395px
}
.postition-5 {
	left: 716px;
	top: 394px
}
.postition-6 {
	left: 372px;
	top: 463px
}
.postition-7 {
	left: 452px;
	top: 390px
}
.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: 939px;
	top: 300px
}
.postition-9 {
	left: 443px;
	top: 366px
}
.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: 384px;
	top: 470px
}
.postition-11 {
	left: 1128px;
	top: 310px
}
.postition-13 {
	left: 430px;
	top: 445px
}
.douhao {
	width: 0
}



/*热销产品 样式*/ 
.item2-cont{overflow:hidden;}
.item2-cont .item2-cont-tab li{float:left;color:#888;padding:0 10px;cursor:pointer;height:45px;line-height:45px;margin:0 10px;}
.item2-cont .item2-cont-tab li:hover{color:#2b86e3;border-bottom:2px solid #2b86e3;}
.item2-cont .item2-cont-tab li.hover{color:#2b86e3;border-bottom:2px solid #2b86e3;}
.item2-cont-tab2{overflow:hidden;*margin-bottom:20px;-margin-bottom:20px;margin-left:-20px !important;}
.item2-cont-tab2 li{float:left;margin:0 0 20px 20px;width:384px;border:1px solid #eee;}
.item2-cont-tab2 li .tab2-title{background:#fff;height:40px;padding:0 15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#333;}
.tab2-title span{color:#666;font-size:14px;line-height:40px;font-weight:bold;}
.tab2-title span img{vertical-align:middle;margin:0 10px;}
.tab-text{padding:15px;background:#fff;}
.tab-text .tab-texttop{height:55px;margin-bottom:5px;color:#999;}
.tab-text .tab-texttop p{line-height:22px;font-size:13px;}
.tab-text .tab-textdown{overflow:hidden;}
.tab-text .tab-textdown em{color:#999;font-size:12px;}
.tab-text .tab-textdown .butt-xd{margin-top:3px;}
.tab-text .tab-textdown .f-r {float: right;}
.tab-text .tab-textdown .f-l{ font-size: 12px;}
.tab-text .tab-textdown a{background:#0af;color:#fff;font-size:15px;width:80px;height:30px;display:inline-block;line-height:30px;text-align:center;border-radius:3px;}
.tab-text .tab-textdown a:hover{text-decoration:none;background:#ff8a00;}

.hotSopt {width:1200px;margin:0 auto;border:1px solid #ddd;background:#fff;position:relative;}
.hotSopt .item2-header{position:absolute;margin:20px;}
.hotSopt .item2-header h3{font-size:17px;color:#333;line-height:26px;}
.hotSopt .item2-header h3 img{vertical-align:middle;margin-right:8px;}
.hotSopt .subTitleBg{background:#eff3f8;display:block;margin:0px 20px !important;}
.hotSopt .chanelHeader{margin-top:15px !important;}
.tab2-title{background:#eff3f8;height:40px;padding:0 15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#333;}

.menu-item3{margin:20px 0;}
