body { background: #000d4a url(../images/background.png) center top; background-size: cover; color: #666; font-size: 0.1rem; } .center { position: absolute; width: 100px; height: 100px; margin: auto; top: 0; bottom: 0; left: 0; right: 0; } .head { height: 0.6rem; background: url(../images/topTitle.png) no-repeat center center; background-size: 100% 100%; position: relative; z-index: 100; } .head h1 { color: #fff; text-align: center; font-size: 0.4rem; line-height: 0.4rem; } .head h1 img { width: 1.5rem; display: inline-block; vertical-align: middle; margin-right: 0.2rem; } .container { padding: 0.1rem 0.1rem 0rem 0.1rem; } .container > ul > li { float: left; padding: 0 0.1rem; } .container > ul > li { width: 33.33%; } /* .container > ul > li:nth-child(2) { width: 40%; padding: 0; } */ .circle { height: 4.8rem; margin-bottom: 0.15rem; } .box { height: 4.6rem; padding: 0 0.2rem 0.2rem 0.15rem; position: relative; z-index: 10; } .management-box { height: 9.6rem; } .maintain-box { top: 0.2rem; } .board-title { font-size: 0.25rem; color: #ffffff; position: absolute; width: 3rem; top: 0.06rem; } .title1 { left: 0.44rem; } .title2 { left: 0.44rem; } .status { position: absolute; top: 0.6rem; left: 0.4rem; width: 2.6rem; } .status-span { position: absolute; top: 0.58rem; font-size: 0.16rem; color: #ffffff; width: 0.6rem; } .status1 { left: 0.62rem; } .status2 { left: 1.32rem; } .status3 { left: 2.2rem; } .status4 { left: 3.08rem; } .count { font-size: 0.2rem; color: #ffffff; font-weight: 600; position: absolute; } .mo_total { top: 2.1rem; left: 0.5rem; } .mo_store { top: 2.1rem; left: 1.9rem; } .mo_line { top: 2.1rem; left: 3.5rem; } .mo_repair { top: 2.1rem; left: 5rem; } .gauge_total { top: 4rem; left: 0.5rem; } .gauge_store { top: 4rem; left: 1.9rem; } .gauge_line { top: 4rem; left: 3.5rem; } .gauge_repair { top: 4rem; left: 5rem; } .group-common1 { position: absolute; top: 0.7rem; width: 1.5rem; } .group-common2 { position: absolute; top: 2.5rem; width: 1.5rem; } .group1 { left: 0.1rem; } .group2 { left: 1.7rem; } .group3 { left: 3.3rem; } .group4 { left: 4.8rem; } .title { font-size: 0.3rem; color: #ffffff; text-align: center; line-height: 0.5rem; width: 3.2rem; position: absolute; font-weight: 600; } .malfunction { margin-top: 0.88rem; } .outIn { margin-top: 0.66rem; margin-left: 1.3rem; } .aging { margin-top: 0.1rem; } .count_box { width: 2rem; position: absolute; text-align: center; font-size: 0.4rem; color: #ffffff; } .total1 { top: 1rem; left: -0.16rem; } .store1 { top: 1rem; left: 1.44rem; } .line1 { top: 1rem; left: 3.04rem; } .repair1 { top: 1rem; left: 4.54rem; } .total2 { top: 2.8rem; left: -0.16rem; } .store2 { top: 2.8rem; left: 1.44rem; } .line2 { top: 2.8rem; left: 3.04rem; } .repair2 { top: 2.8rem; left: 4.54rem; } .box-border1 { position: absolute; z-index: 999; left: 0.12rem; width: 6.7rem; top: 0.6rem; } .box-border2 { position: absolute; z-index: 999; left: 0.2rem; width: 6.6rem; top: 1.02rem; } .box-border3 { position: absolute; z-index: 999; left: 0.2rem; width: 6.6rem; top: -0.38rem; } .table1 { position: absolute; margin-top: 0.4rem; width: 6.2rem; left: 0.12rem; height: 9rem !important; } .table2 { position: absolute; left: 0.14rem; top: 0.1rem; width: 6.2rem !important; height: 4.8rem !important; } .table3 { position: absolute; left: 0.16rem; top: 0.1rem; width: 6.2rem !important; height: 3.5rem !important; } .table-img { height: 100%; display: flex; align-items: center; } .status-img{ width: 1rem; } .dv-scroll-board{ color: #ddd !important; }