@font-face { font-family: digifaw; src: url(./digifaw.ttf); } body{ width: 1920px; height: 1080px; background-image: url("../images/company/bg.png"); margin: 0 auto; } .line1 { overflow: hidden; text-overflow: ellipsis; display: box; display: -webkit-box; line-clamp: 1; box-orient: vertical; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all; } .nav-header{ width: 1880px; height: 102px; margin: 0 auto; margin-top: 10px; background-image: url("../images/topbg.png"); position: relative; } .nav-system-start{ position: absolute; z-index: 10; width: 302px; height: 45px; background-image: url("../images/system-start.png"); top: 38px; left: 158px; line-height: 45px; text-align: center; color: #ffffff; font-size: 18px; cursor: pointer; font-weight: bold; } .nav-logout{ position: absolute; z-index: 10; width: 170px; height: 46px; background-image: url("../images/logout.png"); top: 37px; right: 152px; line-height: 46px; text-align: center; color: #ffffff; font-size: 18px; cursor: pointer; font-weight: bold; } .nav-title,.nav-desc{ text-align: center; color: #0C9BFF; font-weight: bold; } .nav-title{ font-size: 30px; padding-top: 19px; letter-spacing: 10px } .nav-desc{ font-size: 16px; } .main{ margin: 0 auto; margin-top: 10px; width: 1880px; height: 934px; overflow: hidden; position: relative; } .main-left1{ position: absolute; z-index: 10; width: 515px; height: 278px; top: 0; left: 0; background: rgba(18, 21, 103, 0.4); } .border-style{ border-top: 1px solid rgba(12, 155, 255, 0.4); } .border-style:before{ content: ''; position: absolute; z-index: 10; top: 0; left: 0; width: 30px; height:2px; background-color: #5FAFF9; } .border-style:after{ content: ''; position: absolute; z-index: 10; top: 0; right: 0; width: 30px; height:2px; background-color: #5FAFF9; } .main-left1 .main-title{ width: 100%; height: 63px; line-height: 58px; background: url("../images/company/leftbg.png") no-repeat; font-size: 17px; color: #ffffff; padding-left: 30px; } .main-left1 .main-body{ /*border: 1px solid #fff;*/ width: 100%; height: 208px; } .box-user-chart{ width: 100%; height: 208px; } .main-btn-group{ width: 60px; height: 22px; line-height: 22px; text-align: center; border: 1px solid #0C9BFF; border-radius: 4px; float: right; vertical-align: middle; font-size: 12px; color: #0C9BFF; margin-left: 5px; margin-top: 15px; } .main-btn-group.cur{ background: #293991; font-size: 12px; color: #88B1D0; } .main-left2{ position: absolute; z-index: 10; width: 515px; height: 278px; top: 303px; left: 0; background: rgba(18, 21, 103, 0.4); } .main-left2 .main-title{ width: 100%; height: 63px; line-height: 58px; background: url("../images/company/leftbg.png") no-repeat; font-size: 17px; color: #ffffff; padding-left: 30px; } .main-left2 .main-body{ /*border: 1px solid #fff;*/ width: 100%; height: 208px; } .box-order2-chart{ width: 100%; height: 208px; } .main-left3{ position: absolute; z-index: 10; width: 515px; height: 330px; top: 609px; left: 0; background: rgba(18, 21, 103, 0.4); } .main-left3 .main-title{ width: 100%; height: 63px; line-height: 58px; background: url("../images/company/leftbg.png") no-repeat; font-size: 17px; color: #ffffff; padding-left: 30px; } .main-left3 .main-body{ /*border: 1px solid #fff;*/ width: 100%; height: 260px; position: relative; } .main-left3 .province1,.main-left3 .province2,.main-left3 .province3{ width: 50px; height: 40px; line-height: 40px; position: absolute; z-index: 10; color: #ffffff; font-size: 19px; text-align: center; } .main-left3 .province1{ top: 135px; left: 104px; } .main-left3 .province2{ top: 135px; left: 233px; } .main-left3 .province3{ top: 135px; left: 362px; } .box-patrol2-chart{ width: 100%; height: 260px; } .main-middle1{ position: absolute; z-index: 10; width: 386px; height: 320px; top: 609px; left: 543px; background: rgba(18, 21, 103, 0.4); } .main-middle1 .main-title{ width: 100%; height: 63px; line-height: 58px; background: url("../images/company/leftbg.png") no-repeat; font-size: 17px; color: #ffffff; padding-left: 30px; } .main-middle1 .main-body{ /*border: 1px solid #fff;*/ width: 100%; height: 260px; } .main-middle2{ position: absolute; z-index: 10; width: 386px; height: 320px; top: 609px; left: 954px; background: rgba(18, 21, 103, 0.4); } .main-middle2 .main-title{ width: 100%; height: 63px; line-height: 58px; background: url("../images/company/leftbg.png") no-repeat; font-size: 17px; color: #ffffff; padding-left: 30px; } .main-middle2 .main-body{ /*border: 1px solid #fff;*/ width: 100%; height: 260px; } .main-middle3{ /*border: 1px solid #ffffff;*/ position: absolute; z-index: 9; width: 796px; height: 508px; top: 74px; left: 543px; } .main-middle3 .map{ width: 100%; height: 100%; } .main-middle4{ /*border: 1px solid #ffffff;*/ position: absolute; z-index: 11; width: 796px; height: 74px; top: 0; left: 543px; } .program-box{ width: 199px; height: 74px; position: relative; float: left; } .program-box .program-box-img{ width: 74px; height: 74px; display: inline-block; float: left; } .program-box .program-box-body{ display: inline-block; width: 125px; height: 74px; float: right; padding-top: 10px; } .program-box .program-box-body .program-box-title{ padding: 0 10px; font-size: 24px; color: #00E4FF; font-weight: bold; } .program-box .program-box-body .program-box-desc{ padding: 0 10px; font-size: 13px; color: #88B1D0; } .program-box .program-box-province{ width: 74px; height: 74px; line-height: 74px; color: #0C9BFF; font-size: 16px; font-weight: bold; position: absolute; z-index: 11; text-align: center; } .main-right1{ position: absolute; z-index: 10; width: 515px; height: 679px; bottom: 0; right: 0; background: rgba(18, 21, 103, 0.4); } .main-right1 .main-title{ width: 100%; height: 63px; line-height: 58px; background: url("../images/company/leftbg.png") no-repeat; font-size: 17px; color: #ffffff; padding-left: 30px; } .main-right1 .main-body{ width: 100%; height: 613px; padding: 5px; } .main-flash{ position: relative; width:480px; height:175px; margin: 5px auto; } .main-flash2{ position: relative; width:480px; height:auto; margin: 5px auto; overflow: hidden; } .main-flash2 .col-xs-3{ text-align: center; padding: 0; } .main-flash2 .col-xs-3 img{ width: 114px; height: 114px; } .main-right2{ position: absolute; z-index: 10; width: 515px; height: 248px; top: 0; right: 0; overflow: hidden; } .col-xs-7,col-xs-5{ padding: 0; } .progress { width: 100%; height: 10px; margin-bottom: 10px; background-color: rgba(255, 255, 255, 0.3); } .main-right2 .main-progress{ width: 100%; height: auto; } .main-right2 .main-progress .main-progress-title{ color: #88B1D0; font-size: 14px; } .main-right2 .main-progress .main-progress-title span{ color: #ffffff; font-size: 18px; } .main-right2 .main-title{ width: 100%; height: 60px; line-height: 60px; color: #88B1D0; vertical-align: middle; } .main-right2 .main-tt{ display: inline-block; width: 88px; height: 42px; line-height: 42px; } .main-right2 .main-sz{ display: inline-block; width: 28px; height: 42px; vertical-align: middle; color: #ffffff; position: relative; margin-right: 3px; } .main-right2 .main-sz img{ display: inline-block; position: absolute; z-index: 9; width: 28px; height: 42px; left: 0; top: 0; } .main-right2 .main-sz div{ position: absolute; z-index: 10; width: 28px; height: 42px; line-height: 42px; left: 0; top: 0; text-align: center; font-size: 28px; } .box-patrol-chart{ width: 480px; height: 300px; } .box-finish{ position: relative; width: 200px; height: 245px; } .box-finish-chart{ width: 200px; height: 245px; } .box-finish .box-finish-count{ position: absolute; text-align: center; width: 100%; height: 80px; z-index: 10; left: 0; top: 90px; } .box-finish .box-finish-count .box-finish-bl{ font-size: 28px; color: #ffffff; } .box-finish .box-finish-count .box-finish-title{ font-size: 12px; color: #88B1D0; } /*表格*/ .table2 { color: #ffffff; width: 100%; padding: 10px; } .table2 th,td { text-align: center; font-size: 16px; height: 38px; } .table2 thead tr{ background: rgba(2, 177, 255, 0.1); color: #0C9BFF; } .table2 tbody tr:nth-child(odd){ /*background: rgba(25,177,201,0.2);*/ } .table2 tbody tr:nth-child(even){ background: rgba(2, 177, 255, 0.1); } .table2 .table-task-name, .table-project-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .table2 .table-task-name { max-width: 90px; } .table2 .table-project-name { max-width: 310px; } .table2>tbody>tr>td, .table2>tbody>tr>th, .table2>tfoot>tr>td, .table2>tfoot>tr>th, .table2>thead>tr>td, .table2>thead>tr>th { border-top: 0; } .tablebox { height: 500px; overflow: hidden; position: relative; width: 100%; margin: 0 auto; /*background-color: rgba(6,26,103,1);*/ /*background: rgba(2, 177, 255, 0.1);*/ } .tbl-header { width: 100%; position: absolute; top: 0; left: 0; z-index: 999; } .tbl-body { width: 100%; position: absolute; top: 0; left: 0; } .tablebox table { width: 100%; } .tablebox table th, .tablebox table td { font-size: 16px; color: #7ca6f4; line-height: 35px; text-align: center; } .tablebox table tr th { background-color: #1f1f9c; cursor: pointer; } .tablebox table tr td { background-color: transparent; } .tbl-body tr:nth-child(even) td,.tbl-body1 tr:nth-child(even) td { background-color: rgba(31, 31, 156, .5); } .tablebox table tr td span, .tablebox table tr td span { font-size: 16px; }