@keyframes scaleDraw {  /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
            0%{
                transform: scale(1);  /*开始为原始大小*/
            }
            25%{
                transform: scale(1.4); /*放大1.1倍*/
            }
            50%{
                transform: scale(1);
            }
            75%{
                transform: scale(1.4);
            }
        }
    .earth_01{  	
    		position: absolute;
    		top: 200px;
    		left: 73%;
    		margin-left: -50px;
            width: 200px;
            height: 138px;       
            background: url(../images/01animation_1.png);
            background-size: 200px 138px;
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 10s; /*动画所花费的时间*/
        }
    .earth_02{
			position: absolute;
		    top: 120px;
		    left: 10%;
		    width: 100px;
		    height: 100px;
		    background: url(../images/01animation_2.png);
		    background-size: 100px 100px;
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 9s; /*动画所花费的时间*/
        }
    .earth_04{
    		position: absolute;
    		top: 550px;
    		right: 20%;
            width: 150px;
            height: 150px;
            background: url(../images/01animation_4.png);
            background-size: 150px 150px;
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 5s; /*动画所花费的时间*/
        }
    .earth_05{
    		position: absolute;
    		top: 450px;
    		left: 20%;
            width: 55px;
            height: 50px;
            background: url(../images/01animation_5.png);
            background-size: 55px 50px;
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 7s; /*动画所花费的时间*/
        }
    .earth_06{
    		position: absolute;
    		top: 350px;
    		left: 5%;
    		margin-left: -20px;
            width: 40px;
            height: 40px;
            background: url(../images/01animation_6.png);
            background-size: 40px 40px;
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 3s; /*动画所花费的时间*/
        }
    .earth_07{
    		position: absolute;
		    top: 320px;
		    left: 32%;
		    margin-left: -30px;
		    width: 60px;
		    height: 60px;
            background: url(../images/01animation_7.png);
            background-size: 60px 60px;
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 5s; /*动画所花费的时间*/
        }
    .earth_08{
    		position: absolute;
    		top: 500px;
    		right: 30%;
            width: 33px;
            height: 30px;
            background: url(../images/01animation_8.png);
            background-size: 33px 30px;
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 8s; /*动画所花费的时间*/
        }
    .earth_09{
    		position: absolute;
    		top: 600px;
    		right: 10%;
            width: 75px;
            height: 70px;
            background: url(../images/01animation_9.png);
            background-size: 75px 70px;
            -webkit-animation-name: scaleDraw; /*关键帧名称*/
            -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
            -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
            -webkit-animation-duration: 8s; /*动画所花费的时间*/
        }
        
	/*外层发光*/
	   .live{
           position: relative;
       }
       .live img{
           z-index: 0;
       }
        @keyframes living {
            0%{
                transform: scale(1);
                opacity: 0.5;  
            }
            50%{
                transform: scale(1.5);  
                opacity: 0;   /*圆形放大的同时，透明度逐渐减小为0*/
            }
            100%{
                transform: scale(1);
                opacity: 0.5;
            }
        }
        .live span{
            position: absolute;
		    width: 150px;
		    height: 150px;
		    left: 15px;
		    bottom: 15px;
            background: #ffffff7d;
            border-radius: 50%;
            -webkit-animation: living 3s linear infinite;
            z-index: 0;
        }
        .live span:nth-child(2){
            -webkit-animation-delay: 0.5s; /*第二个span动画延迟1.5秒*/
        }	
        /*中国地图*/
		*{margin:0;padding:0;list-style-type:none;}
		a,img{border:0;text-decoration:none;}
		
		.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
		*html .clearfix{height:1%}

		.map-service{position:relative;height:700px;}
		.china-map{width:748px;height:618px;background:url(../images/map_black_bg.png) center no-repeat;position:relative;margin: auto;}
		.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;white-space:nowrap;}
		.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:black}
		.region-list.waite .show-regin span{color:black}
		.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:504px;top:459px}
		.postition-11{left:604px;top:300px}
		.postition-13{left:470px;top:250px}
		.postition-15{left:650px;top:150px}
		.postition-16{left:680px;top:100px}
		.postition-17{left:620px;top:470px}
		.postition-18{left:570px;top:450px}
		.postition-19{left:545px;top:259px}	
		.postition-20{left:420px;top:470px}	
		.postition-21{left:300px;top:250px}		
		.douhao{width:0}