You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

672 lines
11 KiB

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
*, body {
padding: 0px;
margin: 0px;
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
}
body {
background: #000d4a url(../images/bg.jpg) center top;
}
/* div {
border: 1px solid red;
} */
.dHeader {
width: 100%;
height: 4.5rem;
background: url(../images/head_bg.png) no-repeat center center;
background-size: 100% 100%;
z-index: 100;
display: flex;
justify-content: center;
align-items: center;
}
.dHeader h1 {
margin-top: 5px;
color: #fff;
font-size: 2rem;
}
.dBody {
width: 100%;
height: 60.1rem;
display: flex;
}
.bodyLeft {
width: 30%;
height: 100%;
padding: 20px 10px 20px 20px;
}
.bodyMiddle {
width: 42%;
height: 100%;
padding: 20px 10px 20px 10px;
}
.bodyRight {
width: 28%;
height: 100%;
padding: 20px 20px 20px 10px;
}
.box {
width: 100%;
border: 1px dotted #237BBC;
position: relative;
margin-bottom: 5%;
}
.box .title {
display: flex;
justify-content: center;
}
.titleTxt {
width: 153px;
height: 29px;
border: 1px solid #237BBC;
color: #3CD5FF;
margin-top: -14px;
background: #031937;
display: flex;
justify-content: center;
align-items: center;
font-size: 14px;
}
.echarts {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.echartsMiddle {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
/* padding: 10px; */
}
.middleUp {
width: 100%;
height: 20%;
color: #3DD4FF;
}
.middleCenter {
width: 100%;
height: 40%;
color: #3DD4FF;
}
.centerTitle {
width: 100%;
margin-left: 20px;
}
.centerContent {
width: 100%;
height: 91%;
}
.centerNum {
width: 100%;
height: 98%;
display: flex;
justify-content: space-around;
padding: 25px 20px 0 20px;
}
.centerImg{
position: relative;
}
.zlNum {
position: absolute;
left: 32px;
top: 18px;
font-size: 32px;
}
.zlLine {
position: absolute;
height: 1px;
width: 32px;
left: 34px;
top: 54px;
background: #237bbc;
}
.zlText {
position: absolute;
left: 25px;
top: 58px;
font-size: 12px;
}
.imgNum{
position: absolute;
left: 26px;
top: 25px;
font-size: 32px;
}
.imgText {
position: absolute;
left: 20px;
top: 73px;
font-size: 12px;
}
.numBox {
width: 100px;
height: 70px;
border: 1px solid #3CD5FF;
border-radius: 20px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.circleNum {
font-weight: bold;
font-size: 22px;
}
.circleLine {
height: 1px;
width: 40px;
border-top: 1px solid #237bbc;
margin: 2px 0 5px 0;
}
.numBox .num {
font-weight: bold;
font-size: 22px;
}
.circleTxt {
/* color: #fff; */
font-size: 12px;
}
.numBox .txt {
color: #fff;
font-size: 12px;
}
.numColor0 {
color: #ff6b81;
}
.numColor1 {
color: #0984e3;
}
.numColor2 {
color: #6c5ce7;
}
.numColor3 {
color: #d63031;
}
.numColor4 {
color: #00b894;
}
.numColor5 {
color: #fdcb6e;
}
.numColor6 {
color: #fff;
}
.middleDown {
width: 100%;
height: 40%;
color: #3DD4FF;
}
.boxBorder {
position: absolute;
width: 20px;
height: 20px;
}
.boxBorder1 {
top: -3px;
left: -3px;
border-left: 3px solid #3CD5FF;
border-top: 3px solid #3CD5FF;
}
.boxBorder2 {
top: -3px;
right: -3px;
border-right: 3px solid #3CD5FF;
border-top: 3px solid #3CD5FF;
}
.boxBorder3 {
bottom: -3px;
left: -3px;
border-bottom: 3px solid #3CD5FF;
border-left: 3px solid #3CD5FF;
}
.boxBorder4 {
bottom: -3px;
right: -3px;
border-right: 3px solid #3CD5FF;
border-bottom: 3px solid #3CD5FF;
}
/* ===================================== */
.tableSelect {
width: 100%;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
padding: 0 20px;
margin-top: 10px;
}
.tabBottomLine {
width: 91%;
border-bottom: 1px solid #17468D;
margin: 0 20px;
}
ul, li {
margin: 0;
padding: 0;
list-style: none;
}
.tab-tilte {
width: 100%;
color: #3CD5FF;
font-size: 12px;
}
.tab-tilte li {
float: left;
width: 16.6%;
text-align: center;
cursor: pointer;
padding: 5px 0;
}
.tab-tilte .active {
background-color: #2E61A2;
border-radius: 5px;
}
.scroll {
width: 100%;
height: 90%;
display: inline-block;
overflow: hidden;
position: relative;
}
.scroll>div:last-child {
margin-top: 15px;
height: 94%;
overflow: hidden;
}
.scroll .item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 15px 10px 0 10px;
/* height: 106px; */
}
.orgItems {
height: 100px;
width: 100%;
border: 1px solid #2B99D1;
margin: 0 10px 0 10px;
display: block;
border-radius: 0 20px 0 20px;
}
.orgItem{
position: relative;
}
.orgItemTitle {
height: 30px;
display: flex;
align-items: center;
padding-left: 21px;
}
.orgTitleNum {
border: 1px solid #F59A23;
display: flex;
align-items: center;
justify-content: center;
width: 15px;
height: 15px;
margin-right: 10px;
color: #F59A23;
font-size: 12px;
background: #393D43;
}
.orgTitleTxt {
color: #3CD5FF;
font-size: 12px;
}
.orgItemTypeList {
display: flex;
flex-wrap: wrap;
width: 100%;
height: 63px;
/* margin: 6px 0 0 21px; */
margin-left: 21px;
font-size: 12px;
}
.typeListItems {
display: flex;
align-items: center;
width: 125px;
}
.typeItemTxt {
margin-left: 10px;
color: #AAAAAA;
}
.typeItemNum {
font-size: 14px;
color: #FFF;
margin-left: 10px;
}
.out-rect {
display: flex;
align-items: center;
justify-content: center;
width: 91%;
height: 106px;
padding: 1px;
background: linear-gradient(-45deg, transparent 0px, #2B99D1 0) bottom right,
linear-gradient(45deg, transparent 8px, #2B99D1 0) bottom left,
linear-gradient(135deg, transparent 0px, #2B99D1 0) top left,
linear-gradient(-135deg, transparent 8px, #2B99D1 0) top right;
background-size: 50% 50%;
background-repeat: no-repeat;
}
.in-rect {
width: 100%;
height: 100%;
background: linear-gradient(-145deg, transparent 0px, #000B3B 0) bottom right,
linear-gradient(45deg, transparent 8px, #000B3B 0) bottom left,
linear-gradient(135deg, transparent 0px, #000B3B 0) top left,
linear-gradient(-135deg, transparent 8px, #000B3B 0) top right;
background-size: 50% 50%;
background-repeat: no-repeat;
position: relative;
}
.tableTitle {
display: flex;
margin: 10px 0 0 20px;
font-size: 12px;
}
.tableTitle .serialNum {
border: 1px solid #F59A23;
width: 15px;
height: 15px;
display: flex;
align-items: center;
justify-content: center;
color: #F59A23;
background: #393D43;
border-radius: 3px;
}
.tableTitle .schoolName {
margin-left: 10px;
color: #3CD5FF;
}
.tableContent {
color: #fff;
display: flex;
flex-wrap: wrap;
width: 352px;
height: 70px;
margin: 6px 0 0 21px;
font-size: 12px;
}
.tableContent .item {
display: flex;
width: 117px;
height: 35px;
align-items: center;
}
.tableContent .item .typeName {
color: #AAAAAA;
}
.tableContent .item .num {
font-size: 14px;
color: #FFF;
}
.ml {
margin-left: 10px;
}
.dot {
width: 14px;
height: 14px;
border-radius: 50%;
}
.xmycSelect {
width: 100%;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
padding: 0 20px;
margin-top: 10px;
}
.xmyc-tab-tilte {
width: 100%;
color: #3CD5FF;
font-size: 12px;
}
.xmyc-tab-tilte li {
float: left;
width: 36.6%;
text-align: center;
cursor: pointer;
padding: 5px 0;
margin-right: 14px;
}
.xmyc-tab-tilte .active {
background-color: #2E61A2;
border-radius: 5px;
}
.xmycContent {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
padding: 0 20px;
}
.xmycContent .xmycItem {
width: 48%;
height: 50px;
border: 1px solid #2B99D1;
margin: 15px 0 5px 0;
border-radius: 0 20px 0 0;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20px 0 10px;
}
.xmycContent .xmycItem .itemImg {
border: 1px solid #2B99D1;
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 50%
}
.xmycContent .xmycItem .itemTxt {
font-size: 14px;
color: #AAAAAA;
}
.xmycContent .xmycItem .itemNum {
color: #fdcb6e;
}
.dotColor0 {
border: 3px solid #0085FF;
}
.dotColor1 {
border: 3px solid #F8B551;
}
.dotColor2 {
border: 3px solid #B769FF;
}
.dotColor3 {
border: 3px solid #32B16C;
}
.dotColor4 {
border: 3px solid #BF3A68;
}
.circle {
width: 66px;
height: 66px;
border-radius: 50%;
border: 1px solid #195A97;
color: #3CD5FF;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: #0B2F67;
position: absolute;
top: 18%;
right: 18px;
font-size: 14px;
}
.circle1 {
border: 1px solid #0984e3;
width: 100px;
height: 100px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.circle2 {
background-image: url('../images/u141.svg');
background-repeat: no-repeat;
background-size: 100%;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.circle3 {
border: 1px dashed #0984e3;
width: 85px;
height: 85px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.circle4 {
border: 1px solid #0984e3;
width: 75px;
height: 75px;
border-radius: 50%;
background: #237cbc5e;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.circleContent {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-bottom: 7px;
}