.index{height:100%;padding:20px;background:var(--bg-color)}.index header{height:128px;margin-bottom:-32px;background:url(../img/index-header.26c15d30.png) 50% no-repeat;position:relative}.index header .logo{position:absolute;left:0;top:10px}.index header .form-name{line-height:66px;font-size:36px;font-family:Microsoft YaHei;color:#9feafa}.index header ul.operation{position:absolute;top:20px;right:10px}.index header ul.operation li .el-button{padding:9px}.index header ul.operation li+li{margin-left:16px}.index-body{height:625px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;position:relative}.index-body-aside{width:530px;height:calc(100% - 10px);margin-top:10px}.index-body-aside>div{height:299px;border-radius:10px;background:rgba(10,31,59,.5);-webkit-box-shadow:inset 0 0 50px 0 rgba(0,127,174,.5);box-shadow:inset 0 0 50px 0 rgba(0,127,174,.5)}.index-body-aside>div+div{margin-top:10px}.index-body-aside>div .title{padding:20px 0 0 30px;font-size:20px;text-align:left;color:#fff}.index-body-aside>div .chart{height:252px;position:relative}.index-body-aside>div .chart .count-data{width:200px;height:200px;position:absolute;top:50%;left:30px;-webkit-transform:translateY(-50%);transform:translateY(-50%);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.index-body-aside>div .chart .count-data .value{margin-bottom:10px;color:#31ba8b;font-size:24px}.index-body-aside>div .chart .count-data .label{font-size:18px;color:var(--label-color)}.index-body-aside>div .chart .legend{position:absolute;top:50%;left:252px;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.index-body-aside>div .chart .legend li{height:30px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#f1f1f2}.index-body-aside>div .chart .legend li .icon{width:14px;height:14px}.index-body-aside>div .chart .legend li .label{margin-left:6px;margin-right:20px}.index-body-aside>div .chart .legend li .value{font-size:16px}.index-body-aside.right-side .title{padding:20px 0 0 30px}.index-body-aside.right-side .chart .count-data{left:108px}.index-body-aside.right-side .chart .legend{left:357px}.index-body-main{width:700px;height:700px;z-index:0;background:url(../img/center.13593a43.png);background-size:100% 100%}.index-body-main,.index-body-main .state-list{position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.index-body-main .state-list{width:328px;height:328px}.index-body-main .state-list:after{content:" ";display:block;background-image:linear-gradient(45deg,transparent,rgba(3,170,253,.8));width:50%;height:50%;position:absolute;top:0;left:0;-webkit-animation:radar-beam 3s infinite;animation:radar-beam 3s infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-transform-origin:bottom right;transform-origin:bottom right;border-radius:100% 0 0 0;z-index:0}@-webkit-keyframes radar-beam{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes radar-beam{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.index-body-main .state-list li{width:60px;position:absolute;color:#03cd82}.index-body-main .state-list li:first-of-type{top:6px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.index-body-main .state-list li:nth-of-type(2){top:187px;right:28px}.index-body-main .state-list li:nth-of-type(3){top:187px;left:30px}.index-body-main .state-list li.warning{-webkit-animation:show 1s linear infinite;animation:show 1s linear infinite}.index-body-main .state-list li.warning .circle{border:3px solid #e21138;color:#d62445}.index-body-main .state-list li.warning .label{color:#d62445}.index-body-main .state-list li .circle{width:60px;height:60px;line-height:60px;border:3px solid #03cd82;border-radius:50%;background:#061239}.index-body-main .state-list li .circle .iconfont{font-size:36px}.index-body-main .state-list li .label{line-height:30px;color:#fff;font-size:16px}.index-body-main .state{width:100px;height:100px;line-height:100px;border-radius:50%;color:#03cd82;-webkit-box-shadow:inset 0 0 30px 0 #03cd82;box-shadow:inset 0 0 30px 0 #03cd82;position:absolute;top:310px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);font-size:26px}.index-body-main .state.warning{-webkit-box-shadow:inset 0 0 30px 0 #d62445;box-shadow:inset 0 0 30px 0 #d62445;color:#d62445;-webkit-animation:show 1s linear infinite;animation:show 1s linear infinite}@-webkit-keyframes show{0%{opacity:.2}50%{opacity:1}to{opacity:.2}}@keyframes show{0%{opacity:.2}50%{opacity:1}to{opacity:.2}}.index-footer{height:311px;margin-top:2px;position:relative;overflow:hidden}.index-footer .record-list{white-space:nowrap;text-align:left}.index-footer .record-list li{width:254px;height:241px;display:inline-block;background:rgba(10,31,59,.5);-webkit-box-shadow:inset 0 0 50px 0 rgba(0,127,174,.5);box-shadow:inset 0 0 50px 0 rgba(0,127,174,.5);border-radius:10px;color:#fff;text-align:center;overflow:hidden}.index-footer .record-list li+li{margin-left:14px}.index-footer .record-list li .update-time{height:60px;line-height:60px;font-size:18px}.index-footer .record-list li .id,.index-footer .record-list li .name{height:24px;line-height:24px;font-size:12px}.index-footer .record-list li>img{width:99px;height:100px}.index-footer .record-list li>div.flex{margin-top:18px;padding:0 15px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.index-footer .record-list li>div.flex .warning{color:#d62445!important}.index-footer .record-list li>div.flex .data-item{width:106px;height:70px;background:#02466b;border-radius:6px}.index-footer .record-list li>div.flex .data-item .no-result{line-height:70px;font-size:20px}.index-footer .record-list li>div.flex .data-item .time{font-size:12px}.index-footer .record-list li>div.flex .data-item .result>p{line-height:46px;font-size:26px;color:#22ab96}.index-footer .record-list li>div.flex .data-item .result .flex-center>div:first-of-type{margin-right:10px;font-size:40px;font-weight:700}.index-footer .record-list li>div.flex .data-item .result .flex-center>div:last-of-type{font-size:12px;color:#dfe8f8}.index-footer .record-list li>div.flex .data-item.result-24{background:#1a42c5}.index-footer .record-list li>div.flex .data-item.result-48{background:#67329d}.index-footer .record-list li>div.flex .data-item.result-72{background:#0e6b53}.index-footer .record-list li>div.flex .data-item.temperature{line-height:70px;font-size:30px;color:#22ab96}.index-footer .list-enter-active,.index-footer .list-leave-active{-webkit-transition:all 1s;transition:all 1s}.index-footer .list-enter,.index-footer .list-leave-to{opacity:0;-webkit-transform:translateX(-125px);transform:translateX(-125px)}.index-footer .list-enter,.index-footer .list-leave-to,.index-footer .list-move{-webkit-transition:-webkit-transform 1s;transition:-webkit-transform 1s;transition:transform 1s;transition:transform 1s,-webkit-transform 1s}