* { box-sizing: border-box; } html, body { height: 100%; width: 100%; margin: 0; padding: 0; } body { /*background-color: rgb(23, 68, 122);background-color: #000231;background-color: #dfe4f1;*/ background-color: #fff; /* background:url(../images/form.png)no-repeat; */ width: 100%; height: 100%; background-size: cover; /* background-size:100% 100%; */ position: absolute; /* filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/form.png',sizingMethod='scale'); */ } .wrap { width: 100%; color: rgba(0,162,233, 1); padding-bottom: 10px; } .up-wrap { width: 100%; /*height: 60px;*/ display: flex; display: -webkit-flex; display: -ms-flexbox; overflow: hidden; text-align: center; align-items: center; justify-content: center; padding: 15px 15px 20px; box-sizing: border-box; } .logowrap { position: absolute; left: 0; top: -24px; } .logowrap .logo{ height: 35px; width: 252px; background: url(../images/logo.png) center center no-repeat; background-size: 100% 100%; } .item-big { display: block !important; font-size: 18px; text-align: center; flex: 1; position: relative; background: url(../images/bigtitle4.png) center center no-repeat; background-size: 100% 100%; height: 40px; width: 1450px; margin-bottom: 55px; } /*.logocenter { height: 35px; width: 35px; background: url(../images/logocenter.png) center center no-repeat; background-size: 100% 100%; }*/ .item-obig { display: block !important; font-size: 18px; text-align: center; flex: 1; position: relative; background: url(../images/bigtitle4.png) center center no-repeat; background-size: 100% 100%; height: 40px; width: 1450px; /*margin-left:45px;*/ } .item-pbig { min-width: 245px; font-size: 18px; text-align: center; flex: 1; position: relative; } .item-s { display: flex; display: -webkit-flex; display: -ms-flexbox; overflow: hidden; } .item-s li { display: block !important; color: rgb(0,162,233); cursor: pointer; font-size: 14px; float: left; width: 80px; flex: 1; margin: 0 2px; /*height: 36px; line-height: 36px;*/ text-align: left; /*background: url(../images/Button-2.png) center center no-repeat; background-size: 100% 100%;*/ /*/*border-radius: 5px;*/ /*box-shadow: #00aeff 0px 0px 20px inset;*/ /*border: 1px solid #00aeff;*/ /*border-radius: 5px*/ } .bottom-wrap { width: 100%; padding: 0 15px; /* min-height: 840px; */ display: flex; display: -webkit-flex; display: -ms-flexbox; overflow: hidden; box-sizing: border-box; } .bw-s { min-width: 20%; /* height: 800px; */ /* background-color: red; */ } .bw-b { box-sizing: border-box; /*width:calc(100% - 600px);*/ margin: 0 10px; min-width: 50%; /* width: 100%; */ /* height: 800px; */ /* background-color: black; */ } .bw-item { width: 100%; height: 220px; position: relative; z-index: 1; margin-bottom: 5px; box-shadow: 0 0 10px rgb(0,162,233); border: 1px solid rgb(0,162,233); border-radius: 15px; margin: 20px 0px; } .bw-item-h { height: 280px; } .bw-item .bw-img { width: 100% !important; } .bw-img { width: 300px; height: 100%; position: absolute; left: 0; top: 0; z-index: 0; } .bw-img-h { height: 280px; } .bw-item-content { width: 100%; height: 100%; padding: 20px; position: relative; z-index: 2; box-sizing: border-box; } .ptop6 { padding-top: 6px; } .bw-b-bottom { } .spline { width: 20px; } .bw-b-bottom-up { position: relative; width: 100%; height: 480px; border: 2px solid rgb(0,162,233); border-radius: 16px; margin-bottom: 10px; box-shadow: 0 0 10px rgb(0,162,233); } .tab-wrap-tit{ } .tab-wrap-tit .tab { font-size: 12px; display: flex; display: -webkit-flex; } .tab-wrap-tit .tab .t-item { cursor: pointer; width: 48px; text-align: center; /*color: #fff;*/ } .tab-wrap-tit .tab .t-item:first-child { /*border-top-left-radius: 4px; border-bottom-left-radius: 4px;*/ } .tab-wrap .tab .t-item:last-child { /*border-top-right-radius: 4px; border-bottom-right-radius: 4px;*/ } .tab-wrap-tit .tab .spline { width: 0; border-left: 1px solid rgba(0,162,233,1); } .tab-wrap-tit .tab .active { color: #fff; background-color: rgba(0,162,233, 1); } .tab-wrap { position: absolute; top: 10px; left: 20px; z-index: 99; } .tab-wrap .tab { font-size: 10px; border-radius: 4px; border: 1px solid rgba(0,162,233,1); box-shadow: 0 0 10px rgba(0,162,233, 0.8); display: flex; display: -webkit-flex; } .tab-wrap .tab .t-item { cursor: pointer; width: auto; text-align: center; color: #333; padding: 5px; } .tab-wrap .tab .t-item:first-child { border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .tab-wrap .tab .t-item:last-child { border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .tab-wrap .tab .spline { width: 0; border-left: 1px solid rgba(0,162,233,1); } .tab-wrap .tab .active { /*color: #333;*/ color: #fff; background-color: rgba(0,162,233, 1); } .content-ul { color: #fff; box-sizing: border-box; padding: 10px 0; } .content-ul .c-item { cursor:pointer; display: flex; overflow: hidden; max-width: 100%; font-size:12px; /* margin-bottom: 8px; */ } .content-ul .c-item:last-child { margin-bottom: 0; } .content-ul .c-item .tit { flex: 1; min-width: 0; float: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: keep-all; display:flex; align-items:center; } .content-ul .c-item .time { width: 90px; float: right; } .text-ellipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: keep-all; } .headerwrap { /*background-color: rgb(23, 68, 122);*/ } .header { width: 100%; overflow: hidden; /*padding: 8px 15px 0;*/ box-sizing: border-box; } .header .baseInfo { float: right; margin-right: 5px; } .header .layui-nav { background: none; color: #37a6ff; display: flex; overflow: hidden; font-size: 14px; } .layui-nav .layui-nav-item { position: relative; display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; } .header .layui-nav .layui-nav-item, .header .layui-nav .layui-nav-item a { color: #37a6ff; padding-left: 7px; cursor: pointer; display: flex; align-items: center; justify-content: center; } .bg-icon { display: inline-block; width: 17px; height: 16px; background: url("../images/icon.png") no-repeat; /* margin-top: 3px; */ } .bg-txt { margin-left: 5px; } .i-user { background-position: -5px -8px; } .i-version { background-position: -27px -8px; } .i-help { background-position: -50px -8px; } .i-msg { background-position: -73px -8px; } .i-pwd { background-position: -95px -8px; } .i-system { background-position: -117px -8px; } .i-exit { background-position: -139px -8px; } @media screen and (max-width:1600px) { } @media screen and (max-width:1366px) { header.homeNav { position: relative; height: 60px; } header.homeNav .sysManage .timeSys { line-height: 28px; font-size: 12px; } header.homeNav .sysManage .rtManage .layui-nav .layui-nav-item a { font-size: 12px; } header.homeNav .layui-nav * { font-size: 12px; line-height: 28px; } header.homeNav .headHome .homeTit img { max-width: 19%; } header.homeNav .headHome .indexNav { bottom: 19%; } header.homeNav .headHome .indexNav ul li a { font-size: 12px; } } .up-wrap-ul { padding: 0 15px; align-items: center; justify-content: space-between; } .up-wrap-ul li { display: block !important; color: rgb(0,162,233); cursor: pointer; font-size: 14px; float: left; width: 80px; margin: 0 5px; /*height: 36px; line-height: 36px;*/ /*text-align: center;*/ /*background: url(../images/Button-2.png) center center no-repeat; background-size: 100% 100%;*/ /*border-radius: 5px;*/ /*box-shadow: #00aeff 0px 0px 20px inset;*/ /*border: 1px solid #00aeff; border-radius: 5px*/ } ::-webkit-scrollbar { display: none !important; } .flex { display: -webkit-flex; /* 新版本语法: Chrome 21+ */ display: flex; /* 新版本语法: Opera 12.1, Firefox 22+ */ /*display: -webkit-box; /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */ display: -moz-box; /* 老版本语法: Firefox (buggy) */ display: -ms-flexbox; /* 混合版本语法: IE 10 */ } .flex1 { -webkit-flex: 1; /* Chrome */ -ms-flex: 1; /* IE 10 */ flex: 1; /* NEW, Spec - Opera 12.1, Firefox 20+ */ /*-webkit-box-flex: 1;/* OLD - iOS 6-, Safari 3.1-6 */ -moz-box-flex: 1; /* OLD - Firefox 19- */ } .flex2 { -webkit-flex: 2; /* Chrome */ -ms-flex: 2; /* IE 10 */ flex: 2; /* NEW, Spec - Opera 12.1, Firefox 20+ */ /*-webkit-box-flex: 2; /* OLD - iOS 6-, Safari 3.1-6 */ -moz-box-flex: 2; /* OLD - Firefox 19- */ } .flex3 { -webkit-flex: 3; /* Chrome */ -ms-flex: 3; /* IE 10 */ flex: 3; /* NEW, Spec - Opera 12.1, Firefox 20+ */ /*-webkit-box-flex: 3; /* OLD - iOS 6-, Safari 3.1-6 */ -moz-box-flex: 3; /* OLD - Firefox 19- */ } .flexV { -webkit-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .bottom-wrap-new { width: 100%; padding: 0 15px; overflow: hidden; box-sizing: border-box; } .tit-new { color: #fff; padding: 0 10px; background-color: rgba(27,122,164,1); /*background-image: linear-gradient(to right, rgb(25,95,145), rgb(12,53,115));*/ background-image: linear-gradient(to right, rgb(36, 112, 167), rgb(23, 68, 122)); border-top-left-radius: 10px; border-top-right-radius: 10px; /*height: 24px;*/ line-height: 24px; font-size: 12px; } .pd0 { padding: 0 !important; } .pdlrb { padding: 0 10px 10px !important; } /* 圆角背景框 */ .bg-item { position: relative; width: 100%; border: 2px solid rgb(0,162,233); margin-bottom: 10px; box-shadow: rgb(0,162,233) 0px 0px 50px inset; border-radius:10px; } .bg-item:last-child { margin-bottom: 0; } /* 背景色进度条 */ .tab-content { color: #fff; margin-top: 10px; font-size:12px; } .tab-content .tab-i { margin-top: 10px; } .tab-content .txt { width: 90px; text-align: center; font-size: 12px; } .tab-content .line-wrap { align-items: center; } .tab-content .line-item { flex: 1; position: relative; background-color: #242b57; z-index: 90; border-radius: 10px; height: 20px; } .tab-content .line-item > div { border-radius: 10px; content: ''; height: 100%; position: absolute; left: 0; top: 0; z-index: 91; background-color: #1BCD34; width: 10%; } .tab-content .per { margin-left: 10px; width: 40px; } .line-item .normal { background-color: #1BCD34 !important; } .line-item .warn { background-color: #C71D26 !important; } .row1 { font-size: 12px; color: #fff; border-radius: 4px; height: 36px; line-height: 36px; margin-top: 5px; padding: 0 5px; } .row1 span.num { font-size: 20px; margin-right: 10px; } .row2 { color: #fff; font-size: 12px; align-items: center; } .row2 .txt { } .row2 .item-txt-list { width: 100%; } .row2 .item-txt-list .txt-tit { width: 70px; } .row2 .item-txt-list .fixtt { letter-spacing: 4px; } .row2 .item-txt-list:last-child { margin-bottom: 0; } @font-face { font-family: 'digifacewide'; src: url('font/digifacewide.ttf'); } .specialNum { font-family: digifacewide; } .content-wrap-1 { width: 100%; height: 100%; padding: 10px; } .content-wrap-1 .item { } .content-wrap-1 .item .tit { color: #fff; position: relative; font-size: 10px; padding-left: 6px; margin-bottom: 5px; } .content-wrap-1 .item .tit:before { content: ''; position: absolute; top: 50%; left: 0; display: inline-block; width: 0; height: 0; border: 1px solid #fff; } .content-wrap-1 .item .content-1 { width: 100%; height: 100%; margin-bottom: 5px; align-items: flex-end; padding-left:10px; } .content-wrap-1 .item .content-1 .cc-num-wrap { height: 100%; justify-content: space-around; } .content-wrap-1 .item .content-1 .cc-num-wrap .cc-num { color: #fdc006; /*background-color: #4967AD;*/ font-size: 32px; padding: 0 2px; display: flex; align-items: center; justify-content: center; } .content-wrap-1 .item .content-1 .unit { font-size: 10px; color: #fff; } .content-wrap-1 .item .content { justify-content: space-between; padding: 0 10px; align-items:center; } .content-wrap-1 .item .content .t-item { color: #fff; } .content-wrap-1 .item .content .t-item .c-num { color: #abd373; font-size: 24px; } .content-wrap-1 .item .content .t-item .c-txt { color: #fff; font-size: 10px; } * { padding: 0; margin: 0; box-sizing: border-box } li, ol { list-style: none } a { text-decoration: none } @font-face { font-family: "方正大黑_GBK"; src: url("../font/方正大黑_GBK.eot?") format("eot"); src: url("../font/方正大黑_GBK.woff") format("woff"),url("../font/方正大黑_GBK.ttf") format("truetype") } @font-face { font-family: "液晶数字"; src: url("../font/液晶数字.eot?") format("eot"); src: url("../font/液晶数字.woff") format("woff"),url("../font/液晶数字.ttf") format("truetype") } ::-webkit-scrollbar { width: 5px; height: 5px; background-color: transparent } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; background-color: #6b81d4 } ::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #1843e2 } ::-webkit-scrollbar-thumb:hover { border-radius: 5px; -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); background: rgba(0,0,0,0.4) } html { scrollbar-face-color: #071857; scrollbar-highlight-color: #010a2c; scrollbar-3dlight-color: #010a2c; scrollbar-darkshadow-color: #010a2c; scrollbar-shadow-color: #071857; scrollbar-arrow-color: rgba(1,10,44,0.4); scrollbar-track-color: #071857 } html { font-size: 10vw; width: 100%; height: 100%; min-width: 1200px; font-family: Microsoft YaHei; line-height: 1 } @media screen and (max-width: 1200px) { html { font-size: 120px } } .ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .flexCenter { display: flex; align-items: center; justify-content: center } .flexCenterV { display: flex; align-items: center; justify-content: center; flex-direction: column } .hover-wrap { display: none; position: absolute; z-index: 999999; border-style: solid; white-space: nowrap; background-color: rgba(7,44,89,0.8); border-width: 1px; border-radius: .02083rem; font-size: .07292rem; border-color: rgba(7,166,255,0.76); box-shadow: #07a6ff 0px 0px .05208rem; pointer-events: auto; padding: .10417rem } .hover-wrap .hover-item { overflow: auto; color: #fff } .hover-wrap .hover-item .tit { font-size: .09375rem; margin-bottom: .08333rem; text-indent: .09375rem; position: relative } .hover-wrap .hover-item .tit::before { content: ''; display: block; width: .07292rem; height: .07292rem; background-color: blueviolet; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%) } .hover-wrap .hover-item .text { font-size: .08333rem; margin-bottom: .04167rem; position: relative; text-indent: .07292rem } .hover-wrap .hover-item .text::before { content: ''; display: block; width: .05208rem; height: .05208rem; background-color: #FFA600; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%) } .click-wrap { display: none; position: absolute; width: 90%; left: 5%; top: 3%; min-height: 2.60417rem; height: 90%; padding: .10417rem .15625rem .10417rem .10417rem; z-index: 999999; border-style: solid; white-space: nowrap; background-color: rgba(7,44,89,0.95); border-width: .00521rem; border-radius: .02083rem; font-size: .07292rem; border-color: rgba(7,166,255,0.76); box-shadow: #07a6ff 0px 0px .05208rem; pointer-events: auto } .click-wrap .click-close { position: absolute; right: -.13021rem; top: -.13021rem; width: .26042rem; height: .26042rem; background: #2b468c; border-radius: .13021rem; box-shadow: .01042rem .01042rem .02604rem 0px black; cursor: pointer } .click-wrap .click-close:hover { background: #b22222 } .click-wrap .click-close::before { position: absolute; content: ''; width: .15625rem; height: .05208rem; background: white; transform: rotate(45deg); top: .10417rem; left: .05208rem } .click-wrap .click-close::after { content: ''; position: absolute; width: .15625rem; height: .05208rem; background: white; transform: rotate(-45deg); top: .10417rem; left: .05208rem } .click-wrap .click-item { color: #fff } .click-wrap .ck-list { display: flex; flex-direction: column } .click-wrap .ck-list .ck-l-item { display: flex; justify-content: space-between; align-items: center; padding-bottom: .04167rem; border-bottom: 1px solid #fff; margin-bottom: .04167rem } .click-wrap .ck-list .ck-l-item:last-child { margin-bottom: 0 } .click-wrap .ck-list .ck-l-item .ck-l-right { display: flex; justify-content: space-between; align-items: center } .click-wrap .ck-list .ck-l-item .ck-l-right .ck-lr-href { margin-left: .04167rem; color: #8d9fce; cursor: pointer }