*{padding: 0;margin: 0}
.loadEffect{  width: 100px;  height: 100px;  position: relative;  margin: 0 auto; top: 26%}
.loadEffect span{animation: load 1.04s ease infinite;  display: inline-block;  width: 30px;  height: 10px;  border-top-left-radius: 5px;  border-bottom-left-radius: 5px;  background: lightgreen;  position: absolute;   }
.loadEffect span:nth-child(1){  left: 0;  top: 50%;  margin-top:-5px;  animation-delay:0.13s;  }
.loadEffect span:nth-child(2){  left: 10px;  top: 20px;  transform: rotate(45deg);  animation-delay:0.26s;  }
.loadEffect span:nth-child(3){  left: 50%;  top: 10px;  margin-left: -15px;  transform: rotate(90deg);  animation-delay:0.39s;  }
.loadEffect span:nth-child(4){  top: 20px;  right:10px;  transform: rotate(135deg);  animation-delay:0.52s;  }
.loadEffect span:nth-child(5){  right: 0;  top: 50%;  margin-top:-5px;  transform: rotate(180deg);  animation-delay:0.65s;  }
.loadEffect span:nth-child(6){  right: 10px;  bottom:20px;  transform: rotate(225deg);  animation-delay:0.78s;  }
.loadEffect span:nth-child(7){  bottom: 10px;  left: 50%;  margin-left: -15px;  transform: rotate(270deg);  animation-delay:0.91s;  }
.loadEffect span:nth-child(8){  bottom: 20px;  left: 10px;  transform: rotate(315deg);  animation-delay:1.04s;  }
@keyframes load{
    0%{
        opacity: 1;
    }
    100%{
        opacity: 0.2;
    }
}
a{ text-decoration: none;}
#loading{background-color: #181e20;opacity: 0.5;width: 100%;height: 100%;position: fixed;z-index: 999}

.progress{
    margin-top: 30px;
}
h3,ul,li{margin:0;padding:0; list-style:none;}
.scrollbox{ width: 400px; margin: 0 auto;  }
#scrollDiv{width:400px;height:260px; overflow:hidden;}/*这里的高度和超出隐藏是必须的*/
#scrollDiv ul li{height:60px; width:380px; overflow:hidden; margin-bottom: 4px;font-size: 14px;padding: 0 9px 0 9px;line-height: 30px;position: relative}
.complete{position: absolute;bottom:10px;right: 16px;display: block;width: 68px;height: 18px;text-align: center;color: #dfdede;background-color: #025d11;line-height: 18px}
.noComplete{position: absolute;bottom:10px;right: 16px;display: block;width: 68px;height: 18px;text-align: center;color: #dfdede;background-color: #040f85;line-height: 18px}
.cancel{position: absolute;bottom:10px;right: 16px;display: block;width: 68px;height: 18px;text-align: center;color: #dfdede;background-color: #02437a;line-height: 18px}
.sent-div{
    width: 98%;
    height: 98%;
    margin-top: -30px;
}
.sent-div1{
    width: 98%;
    height: 98%;
}
.panel-table {text-align: left; margin: 0 auto !important;width: 96%;	margin-top: 20px !important;padding: 0.5rem 0 !important;font-size: 1.2rem;}
tr.aaa:hover{background: #1d3152; cursor: pointer;}
.l_left{float: left}
.clear{clear: both}

.contentTitle{
    line-height: 60px;
    margin-left: 22px;
    display: block;
    font-weight: bold;
}

/*动效栏*/
.flasheffectoutbox{ width: 1000px; height: 500px;margin: auto; margin-top: 10px; background-image: url("../images/chain_bg.png"); background-repeat: no-repeat; background-position: center;position: relative}
.bottombox{ width: 900px; height: 356px;margin: auto; margin-top: 65px; position: relative;background-repeat: no-repeat; background-position: center;}

.circleeffectclass{ border-radius: 50%; border: rgba(0,168,255,0.6) 1px solid; cursor: pointer; position: absolute;}
.effectposition{ position: absolute;}
.acrossremindeffectout{ background-color: rgba(0,126,255,0.05); border-radius: 50%;}
.acrossremindeffectin{ background-color: rgba(0,126,255,0.3); border-radius: 50%; margin: auto;}
.stagetitle{color: #00e4ff; top: 104px; font-size: 14px; font-family: "Microsoft YaHei"; font-weight: lighter; display: block;width: 116px; text-align: center; position: absolute;left: -10%;}
.stagearoundtitle{left: -25%;top:85px;}

.line{position: absolute;transform-origin:left;animation-iteration-count:infinite}
.line2{z-index: 1;left: 330px;top: 183px;width: 0;height: 3px;transform: rotate(21deg);animation: mm2 4s ;
    animation-delay:2s;animation-iteration-count:infinite;
    background-image: url("../images/linght_ef.png");
    background-repeat: no-repeat;
    background-position: 100%;
}
.line3{z-index: 1;left: 262px;top: 351px;width: 0;height: 3px;transform: rotate(-25deg);animation: mm 5s ;
    animation-delay:4s;animation-iteration-count:infinite;
    background-image: url("../images/linght_ef.png");
    background-repeat: no-repeat;
    background-position: 100%;

}
.line4{z-index: 1;left: 638px;top: 141px;width: 0;height: 3px;transform: rotate(-211deg);animation: mm4 3s  ;
    animation-delay:3s;animation-iteration-count:infinite;
    background-image: url("../images/linght_ef.png");
    background-repeat: no-repeat;
    background-position: 100%;
}
.line5{z-index: 1;left: 679px;top: 289px;width: 0;height: 3px;transform: rotate(-172deg);animation: mm5 5s  ;animation-delay:1s;
    animation-iteration-count:infinite;
    background-image: url("../images/linght_ef.png");
    background-repeat: no-repeat;
    background-position: 100%;
}
.line6{z-index: 1;left: 537px;top: 373px;width: 0;height: 3px;transform: rotate(-116deg);animation: mm6 4s  ;animation-delay:0s;
    animation-iteration-count:infinite;
    background-image: url("../images/linght_ef.png");
    background-repeat: no-repeat;
    background-position: 100%;
}

@keyframes mm{
    0%{width: 0}
    100%{width: 194px}
}
@keyframes mm2{
    0%{width: 0}
    100%{width: 113px}
}
@keyframes mm4{
    0%{width: 0}
    100%{width: 140px}
}
@keyframes mm5{
    0%{width: 0}
    100%{width: 158px}
}
@keyframes mm6{
    0%{width: 0}
    100%{width: 94px}
}
/*主动效*/
.maineffectoutbox{border: rgba(0,168,255,0.6) 3px solid; width: 94px; height: 94px;top: 194px;left: 430px;}
.maindataeffect{ animation: scrolleffect 6.5s infinite linear;}
.maindataspecialeffectct{animation: maindataspecialeffect 0.6s forwards;}
@keyframes scrolleffect {
    0%{transfrom: rotate(0deg);}
    25%{transform: rotate(90deg);}
    50%{transform: rotate(180deg);}
    75%{transform: rotate(270deg);}
    100%{transform: rotate(360deg);}
}
@keyframes maindataspecialeffect {
    0%{transform: rotate(0deg);}
    100%{transform: rotate(360deg);}
}

/*卫星动效*/
.aroundfunctioneffect{ width: 76px; height: 76px;}
.acrossremindeffectoutard{width: 60px; height: 60px; margin: 8px;}
.acrossremindeffectinard{width: 54px; height: 54px; margin: 3px;}
.arounddataeffect01{ animation: scrolleffectarround01 linear infinite 4s forwards;}
.arounddataeffect02{ animation: scrolleffectarround01 linear infinite 3.8s forwards;}
.arounddataeffect03{ animation: scrolleffectarround01 linear infinite 4.2s forwards;}

@keyframes scrolleffectarround01 {
    0%{transfrom: rotate(0deg);}
    25%{transform: rotate(-90deg);}
    50%{transform: rotate(-180deg);}
    75%{transform: rotate(-270deg);}
    100%{transform: rotate(-360deg);}
}

/*修饰卫星*/
.decarround01{ width: 37px; height: 37px; cursor: auto;}
.decarroundin01{ width: 33px; height: 33px; margin: 2px;background-color: rgba(0,126,255,0.8);}
.decarroundin01:hover{ background-color: rgba(0,126,255,0.9);}
.decarround02{ width: 27px; height: 27px; cursor: auto;}
.decarroundin02{ width: 23px; height: 23px; margin: 2px;background-color: rgba(0,126,255,0.7);}
.decarroundin02:hover{ background-color: rgba(0,126,255,0.8);}

/*悬浮信息*/
.fltoutbox{width: 422px; position: absolute; background-repeat: no-repeat; background-position: center; background-position-y: 0px;}
.leftbox{ left: 2%; top: 6%; }
.rightbox{ right: 2%; top: 6%;}
.analyzemsgbgbox{margin-top: 10px; width: 420px; height: 240px; position: relative;}








