.content {
  width: 100%;
  background: #0b0e25;
}
.header {
  text-align: center;
  height: 0.89rem;
  line-height: 0.89rem;
  position: relative;
  background: url(../images/header_bg.png) no-repeat center center;
  background-size: 11.44rem 0.89rem;
  background-color: rgba(255, 255, 255, 0.02);
}
.header .title {
  width: 4.38rem;
  margin: 0 auto;
  font-size: 0.32rem;
  font-family: SourceHanSansCN-Medium;
  font-weight: 500;
  color: #9a84ec;
  background: linear-gradient(90deg, #01fce6 0%, #59a9ff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 0.72rem;
}
.header .time {
  color: #A2FCFF;
  font-size: 0.32rem;
  font-family: Liquid;
  text-shadow: 0px 0.02rem 0.04rem rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0.8rem;
  top: 0;
  letter-spacing: 0.01rem;
}
.header .time font {
  margin-left: 0.2rem;
}
.subject {
  width: 100%;
  position: relative;
  height: 9.91rem;
}
.subject .left {
  width: 5.06rem;
  height: 10rem;
  position: absolute;
  top: -0.09rem;
  left: 0;
  background:-webkit-linear-gradient(left, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.3) 100%);
  background:-o-linear-gradient(left, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.3) 100%);
  background:linear-gradient(to right, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.3) 100%);
  border-top-right-radius: 0.2rem;
  padding: 0.49rem 0.37rem 0 0.56rem;
}
.subject .left .cumulative {
  padding-bottom: 0.4rem;
  background: url(../images/border.png) no-repeat center bottom;
  background-size: 4rem 0.01rem;
}
.subject .left .cumulative .frame {
  height: 0.58rem;
  padding-left: 0.06rem;
  margin-top: 0.23rem;
}
.subject .left .cumulative .frame span {
  width: 0.53rem;
  height: 0.53rem;
  background: url(../images/frame.png) no-repeat center center;
  background-size: 0.53rem 0.53rem;
  text-align: center;
  line-height: 0.53rem;
  font-family: DIN;
  float: left;
  display: inline-block;
  font-size: 0.32rem;
  margin-right: 0.025rem;
}
.subject .left .cumulative .frame font {
  float: left;
  font-size: 0.2rem;
  display: inline-block;
  height: 0.52rem;
  line-height: 0.52rem;
  margin-right: 0.025rem;
}
.subject .left .equipment {
  margin: 0.36rem 0 0.31rem;
  padding-bottom: 0.2rem;
  background: url(../images/border.png) no-repeat center bottom;
  background-size: 4rem 0.01rem;
}
.subject .left .equipment .histogram {
  width: 100%;
  height: 2.71rem;
  margin-top: 0.43rem;
}
.subject .left .equipment .histogram-container{
  width: 100%;
  height: 3.1rem;
}
.subject .left .equipment .histogram-container .swiper-slide{
  width: 100%!important;
}

.subject .left .information .pancake {
  width: 100%;
  height: 1.8rem;
  margin-top: 0.3rem;
  position:relative;
}
.subject .left .information .pancake .pzxx{
  width:1.8rem;
  height:0.1rem;
  position:absolute;
  top:0;
}
.subject .left .information .pancake .pzxx2{
  width:1.6rem;
  height:0.1rem;
  position:absolute;
  top:0;
}
.subject .left .information .pancake .pzxx3{
  width:1.4rem;
  height:0.1rem;
  position:absolute;
  top:0;
}
.subject .left .information .pancake .pzxx4{
  width:1.2rem;
  height:0.1rem;
  position:absolute;
  top:0;
}
.subject .left .information .pancake .circle-text,.subject .left .information .pancake .circle-info{
  display:none;
}
.subject .left .information .pancake #myStat{
  position:absolute;
  left:50%;
  margin-left: -0.9rem;
}
.subject .left .information .pancake #myStat2{
  position:absolute;
  left:50%;
  margin-left: -0.8rem;
  top:0.1rem;
}
.subject .left .information .pancake #myStat3{
  position:absolute;
  left:50%;
  margin-left: -0.7rem;
  top:0.2rem;
}
.subject .left .information .pancake #myStat4{
  position:absolute;
  left:50%;
  margin-left: -0.6rem;
  top:0.3rem;
}

.subject .left .information .ul{

}
.subject .left .information .ul li{
  width:1.3rem;
  float:left;
  margin-right: 0.1rem;
  margin-top: 0.21rem;
  color:#BEBFC5;
  background:url(../images/information-li.png)no-repeat center bottom;
  background-size: 1.2rem 0.01rem;
  padding-bottom: 0.09rem;
  font-size: 0.12rem;
}
.subject .left .information .ul li:nth-child(3n+3){
  margin-right: 0;
}
.subject .left .information .ul li span{
  font-size: 0.24rem;
  font-family:Liquid;
  margin-right: 0.08rem;
}
.subject .left .information .ul li span.cpu{
  color:#6BC591
}
.subject .left .information .ul li span.neic{
  color:#7859DB
}
.subject .left .information .ul li span.cipan{
  color:#FFD98E
}
.subject .left .information .ul li span.guazd{
  color:#FF6F6F
}



.subject .center {
  width: 8.96rem;
  height: 4.66rem;
  position: absolute;
  top: 5.25rem;
  left: 5.06rem;
  padding-top: 0.45rem;
}
.subject .map {
  width: 100%;
  /**height: 5.01rem;**/
  height: 100%;
}
.subject .center .ty-title{
  margin-left: 0.2rem;
}
.subject .center .abnormal {
  background:-webkit-linear-gradient(bottom, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.3) 100%);
  background:-o-linear-gradient(bottom, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.3) 100%);
  background:linear-gradient(to top, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.3) 100%);
  padding-top: 0.27rem;
  padding-bottom: 0.1rem;
  height: 100%;
}
.subject .center .abnormal .abnormal-container{
  height:3.40rem;
  margin-top: 0.27rem;
}
.subject .center .abnormal .abnormal-container .swiper-slide{
  height:0.77rem!important;
  width:100%!important;
  margin-bottom: 0.08rem;
  background: rgba(255, 255, 255, 0.04);
  padding: 0.1rem 0.15rem 0.15rem 0.2rem;
 } 
.subject .center .abnormal .swiper-slide .title {
  background: url(../images/circle_blue.png) no-repeat left center;
  background-size: 0.16rem 0.16rem;
  padding-left: 0.22rem;
  height: 0.3rem;
  line-height: 0.3rem;
}
.subject .center .abnormal .swiper-slide .title span {
  font-size: 0.18rem;
  float: left;
  max-width: 6rem;
}
.subject .center .abnormal .swiper-slide .title span font{
  font-size: 0.14rem;
}
.subject .center .abnormal .swiper-slide .title i {
  float: left;
  display: inline-block;
  width: 0.87rem;
  height: 0.3rem;
  background: url(../images/fault.png) no-repeat center center;
  background-size: 100% 100%;
  margin-left: 0.05rem;
  margin-top: 0.02rem;
}
.subject .center .abnormal .swiper-slide .title i.fault {
  background: url(../images/fault.png) no-repeat center center;
  background-size: 100% 100%;
}
.subject .center .abnormal .swiper-slide .title i.police {
  background: url(../images/police.png) no-repeat center center;
  background-size: 100% 100%;
}
.subject .center .abnormal .swiper-slide .title i.relieve-fault {
  background: url(../images/relieve-fault.png) no-repeat center center;
  background-size: 100% 100%;
}
.subject .center .abnormal .swiper-slide .title i.relieve-police {
  background: url(../images/relieve-police.png) no-repeat center center;
  background-size: 100% 100%;
}
.subject .center .abnormal .swiper-slide .title font {
  float: right;
  font-size: 0.14rem;
  color: #727381;
}
.subject .center .abnormal .swiper-slide .condition {
  margin-top: 0.1rem;
  color: #727381;
  font-size: 0.14rem;
  height: 0.16rem;
  line-height: 0.16rem;
  width: 100%;
  padding-left: 0.22rem;
}
.subject .center .abnormal .swiper-slide .condition span {
  color: #B95C5C;
}
.subject .center .abnormal .swiper-slide .condition span.fault-span {
  color: #B95C5C;
}
.subject .center .abnormal .swiper-slide .condition span.police-span {
  color: #FBBD52;
}
.subject .center .abnormal .swiper-slide .condition span.relieve-fault-span {
  color: #52DDA9;
}
.subject .center .abnormal .swiper-slide .condition span.relieve-police-span {
  color: #5EE0B7;
}
.subject .right {
  width: 5.18rem;
  position: absolute;
  top: -0.09rem;
  right: 0;
  height: 10rem;
  background:-webkit-linear-gradient(right, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.5) 100%);
  background:-o-linear-gradient(right, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.5) 100%);
  background:linear-gradient(to left, rgba(11,14,37,1) 0%, rgba(11,14,37,0.9) 65%, rgba(11,14,37,0.5) 100%);
  border-top-left-radius: 0.2rem;
  padding: 0.49rem 0.48rem 0 0.48rem;
}
.subject .right .equipment-list {
  margin-top: 0.35rem;
}
.ty-title {
  height: 0.24rem;
  font-size: 0.24rem;
  color: #ffffff;
  line-height: 0.24rem;
  background: url(../images/more.png) no-repeat left center;
  background-size: 0.42rem 0.22rem;
  padding-left: 0.5rem;
  letter-spacing: 0.01rem;
}
.ty-title a {
  font-size: 0.12rem;
  color: #666877;
  float: right;
}
.equipment-container{
  height:8.8rem;
}
.equipment-list .swiper-slide{
  height:1.53rem!important;
  width:100%!important;
  margin-bottom: 0.23rem;
 }  
.equipment-list .list .title {
  font-size: 0.2rem;
  height: 0.2rem;
  line-height: 0.2rem;
  width: 100%;
  background: url(../images/circle_red.png) no-repeat left center;
  background-size: 0.23rem 0.23rem;
  padding-left: 0.29rem;
}
.equipment-list .list .ip {
  padding-left: 0.29rem;
  margin: 0.21rem 0 0.18rem 0;
  font-size: 0.16rem;
  height: 0.16rem;
  line-height: 0.16rem;
  color: rgba(255,255,255,0.8);
}
.equipment-list .list .ip font {
  color: #0DF1EA;
}
.equipment-list .list .ip b {
  float: right;
  font-weight: 400;
  font-size: 0.14rem;
  color: rgba(255,255,255,0.5);
  margin-right: 0.5rem;
}
.equipment-list .list .voltage {
  padding-left: 0.29rem;
  font-size: 0.16rem;
  height: 0.16rem;
  line-height: 0.16rem;
  margin-top: 0.14rem;
}
.equipment-list .list .voltage .span {
  float: left;
  color:rgba(255,255,255,0.8);
}
.equipment-list .list .voltage .speed {
  margin-left: 0.09rem;
  float: left;
  margin-top: 0.025rem;
}
.progress-out {
  position: relative;
  background-color: #202237;
}
.progress-in {
  position: absolute;
  height: 100%;
  width: 0%;
  border: none;
  background: -webkit-linear-gradient(333deg, #6855ff 0%, #402ce2 100%);
  background: -o-linear-gradient(333deg, #6855ff 0%, #402ce2 100%);
  background: linear-gradient(63deg, #6855ff 0%, #402ce2 100%);
  text-align: center;
  color: #fff;
  z-index: 1;
  opacity:0.8;
}
.progress-current {
  background:-webkit-linear-gradient(left, rgba(144,131,255,1) 0%, rgba(87,74,201,1) 100%);
  background:-o-linear-gradient(left, rgba(144,131,255,1) 0%, rgba(87,74,201,1) 100%);
  background:linear-gradient(to right, rgba(144,131,255,1) 0%, rgba(87,74,201,1) 100%);
}
.progress-volt {
  background:-webkit-linear-gradient(left, rgba(126,255,183,1) 0%, rgba(57,207,136,1) 100%);
  background:-o-linear-gradient(left, rgba(126,255,183,1) 0%, rgba(57,207,136,1) 100%);
  background:linear-gradient(to right, rgba(126,255,183,1) 0%, rgba(57,207,136,1) 100%);
}
.progress-temperature {
  background:-webkit-linear-gradient(right, rgba(84,214,255,1) 0%, rgba(133,228,255,1) 100%);
  background:-o-linear-gradient(right, rgba(84,214,255,1) 0%, rgba(133,228,255,1) 100%);
  background:linear-gradient(to left, rgba(84,214,255,1) 0%, rgba(133,228,255,1) 100%);
}
.direction-left {
  left: 0;
  border-top-right-radius: 0.02rem;
  border-bottom-right-radius: 0.02rem;
}
.direction-right {
  right: 0;
  border-top-left-radius: 0.02rem;
  border-bottom-left-radius: 0.02rem;
}
.percent-show {
  position: absolute;
  width: 0.7rem;
  height: 100%;
  top: 0;
  right: -0.64rem;
  font-size: 0.12rem !important;
  color:rgba(255,255,255,0.8);
  text-align: right;
  z-index: 2;
}
.anchorBL {
  /*去掉百度地图logo*/
  display: none;
}