.index-wrap{ width: 100%; height: 100%; background:url("../../img/zxx/index_bj.jpg") no-repeat center; background-size: 100% 100%; position: relative; } .back { color: #fff; font-size: 0.09375rem; line-height: 0.09375rem; cursor: pointer; } .hearLogo{ width: 0.984375rem; height: 0.3698rem; } .titleName{ display: flex; flex-direction: column; align-items: center; margin-left: 0.0521rem; } .titleName h1{ color: #fff; font-size: 0.099rem; font-family: '微软雅黑'; } .titleName h2{ margin-top: 0.0521rem; color: #fff; font-size: 0.09375rem; font-family: '微软雅黑'; } .bjGif{ position: absolute; left: 20%; top:calc(50% - 1.03125rem); /*width: 3.7396rem; height: 2.0625rem;*/ } .bj_gif{ position: absolute; left: calc(50% - 1.8698rem); top:calc(50% - 1.03125rem); width: 3.7396rem; height: 2.0625rem; } .index-header{ background:url("../../img/zxx/header_bj.png") no-repeat center; background-size: 100% 100%; width: 9.7917rem; height: 0.5729rem; margin: 0 auto; display: flex; align-items: center; justify-content: center; position: relative; } .titlesBox{ display: flex; align-items: center; justify-content: center; } .titlesBox .title1{ color: #fff; font-size: 0.1615rem; letter-spacing: 1px; text-align: center; line-height: 0.2083rem; font-family: 'Adobe 黑体 Std'; } .titlesBox .title2{ color: #00b4ff; font-size: 0.0625rem; text-align: center; line-height: 0.125rem; } .nav-left{ position: absolute; left: 0.7292rem; top:50%; width: calc(30% - 0.7292rem); display: flex; } .nav-left a{ color: #fff; font-size: 0.09375rem; line-height: 0.09375rem; } .active{ border-bottom: 2px solid #00f0ff; color: #00f0ff!important; } .nav-right{ position: absolute; right: 0.5208rem; top:50%; width: calc(30% - 0.5208rem); display: flex; } .nav-block{ display: flex; align-items: center; } .nav-block img{ width: 0.1458rem; height: 0.1458rem; margin: 0 auto; cursor: pointer; } .log-main-box{ width: 100%; padding: 0 0.3125rem; box-sizing: border-box; height: calc(100% - 0.93745rem); margin-bottom: 0.2083rem; display: flex; margin-top: 0.15625rem; } .tab-block{ background:url("../../img/zxx/logTabbj.png") no-repeat center; width: 1.2292rem; height: 0.875rem; background-size: 100% 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: 0.3125rem; } .tab-block .tabActive1{ color: #00ff9a; } .tab-block .tabActive2{ color: #00e4ff; } .tab-block .tabActive3{ color: #ff5a20; } .tab-block .tabActive4{ color: #ff70c8; } .tab-block:first-child{ margin-top: 0; } .tabIcon1{ background:url("../../img/zxx/tabIcon1.png") no-repeat center; background-size: 100% 100%; width: 0.40625rem; height: 0.40625rem; } .tabIcon1-1{ background:url("../../img/zxx/tabIcon1-1.png") no-repeat center; background-size: 100% 100%; width: 0.40625rem; height: 0.40625rem; } .tabIcon2{ background:url("../../img/zxx/tabIcon2.png") no-repeat center; background-size: 100% 100%; width: 0.40625rem; height: 0.40625rem; } .tabIcon2-1{ background:url("../../img/zxx/tabIcon2-1.png") no-repeat center; background-size: 100% 100%; width: 0.40625rem; height: 0.40625rem; } .tabIcon3{ background:url("../../img/zxx/tabIcon3.png") no-repeat center; background-size: 100% 100%; width: 0.40625rem; height: 0.40625rem; } .tabIcon3-1{ background:url("../../img/zxx/tabIcon3-1.png") no-repeat center; background-size: 100% 100%; width: 0.40625rem; height: 0.40625rem; } .tabIcon4{ background:url("../../img/zxx/tabIcon4.png") no-repeat center; background-size: 100% 100%; width: 0.40625rem; height: 0.40625rem; } .tabIcon4-1{ background:url("../../img/zxx/tabIcon4-1.png") no-repeat center; background-size: 100% 100%; width: 0.40625rem; height: 0.40625rem; } .tab-block h1{ font-size: 0.0833rem; color: #fff; margin-top: 0.0521rem; } .tabs-content-placeholder{ overflow: hidden; width: calc(100% - 0.2083rem); height: 100%; } .log-main-content{ display: flex; width: 100%; height: 100%; flex-direction: column; margin-left:0.2083rem; } .log-search{ background:url("../../img/zxx/searchBox1.png") no-repeat center; width: 7.9583rem; height: 0.90625rem; background-size: 100% 100%; display: flex; align-items: center; padding:0 0.2083rem; box-sizing: border-box; } .log-selected{ width: calc(100% - 0.5729rem); display: flex; flex-wrap: wrap; align-items: center; } .logBlock{ background:url("../../img/zxx/timeBox1.png") no-repeat center; width: 0.9896rem; height: 0.21875rem; background-size: 100% 100%; margin-right: 0.15625rem; margin-top: 0.078125rem; } .logBlock .selectBox{ width: 100%; height: 100%; background: transparent; border: navajowhite; color: #fff; border:none!important; /*font-size: 0.09375rem;*/ } .selectBox option{ color: #fff; background-color: #0a2956; } .logBlock .time-input{ width: 100%; height: 100%; background-color:transparent; color: #fff; } .searchBtn{ width: 0.5729rem; height: 0.1875rem; border-radius: 0.03125rem; background: rgba(108,178,214,0.16); border: 1px solid #68d8fe; display: flex; justify-content: center; align-items: center; cursor: pointer; margin-top: 0.078125rem; } .searchBtn:hover{ background:rgba(17,62,161,1); } .searchBtn img{ width: 0.09375rem; height: 0.09375rem; } .searchBtn h1{ color: #fff; font-size: 0.09375rem; margin-left: 0.1042rem; } input::-webkit-input-placeholder { /* WebKit browsers */ color: #fff; } input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #fff; } input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #fff; } input:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #fff; } .logList-box{ background:url("../../img/zxx/logListBj.png") no-repeat center; width: 7.9583rem; height: calc(100% - 1.0625rem); background-size: 100% 100%; margin-top: 0.15625rem; display: flex; flex-direction: column; padding:0.1042rem 0.2083rem; box-sizing: border-box; } .logList-title,.logList-title2{ display: flex; margin-top: 0.1042rem; padding:0.0521rem 0; border-bottom: 1px dotted rgba(34,73,151,0.8); } .logList-title li{ color: #3eedff; font-size: 0.1042rem; flex:1; display: flex; justify-content: center; } .logList-title2 li{ color: #fff; font-size:0.09375rem; line-height: 0.09375rem; flex:1; text-align: center; justify-content: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-right:0.0521rem; } .logList-title li:last-child,.logList-title2 li:last-child{ flex:2; } .logList{ width: 100%; display: flex; flex-direction: column; height: 90%; overflow-y: scroll; } .logList::-webkit-scrollbar { width: 0 !important } .logList { -ms-overflow-style: none; } .logList { scrollbar-width: none; } .logNo{ display: none; transition: all ease 0.9s; }