@charset "utf-8";

@font-face
{font-family: DIN;
src: url('DIN-Medium.otf')}

@font-face
{font-family: SourceHanSansCN;
src: url('SourceHanSansCN-Regular.ttf')}

@font-face
{font-family: YouSheBiaoTiHei;
src: url('YouSheBiaoTiHei-2.ttf')}


body,input,h1,h2,h3,h4,h5,h6,p,textarea,table,div,ul,li,select,td,th,em,span,i,button,code{margin:0;padding:0;color:inherit;line-height: inherit;font-family:'SourceHanSansCN', 'PingFang SC','PingFangMedium',"microsoft yahei";/* font-family: "microsoft yahei"; */font-size: 0.16rem;}
img{border:0;display: inline-block;max-width:100%;vertical-align: middle;height: auto;}
.fl{float:left;}
.fr{float:right;}
ul,li{ list-style:none; }
a,p,span,i,em{ text-decoration:none; color:inherit;font-size: inherit;}
pre{word-break: break-word;}
:focus{outline:none!important;border-color:inherit;}
.clearfix{*zoom: 1;}
.clearfix:before,.clearfix:after
{display: table;line-height: 0;content: "";}
.clearfix:after{clear: both;}
table{border-collapse:collapse;border-spacing:0;width:100%}
h3,h4,h5,h6{font-weight: normal;}
em,i{font-style:normal;}
*{box-sizing:border-box;color: #fff;}
input[type="button"], input[type="submit"], input[type="reset"],input[type="text"] {-webkit-appearance: none;}
input[type="button"]{border:none;}
textarea {  -webkit-appearance: none;}  
:hover{transition: all .2s;}
.img_hover_wrap{overflow: hidden;}
.img_hover{transition: all .3s;}
.img_hover:hover{transform: scale(1.05,1.05);}
.img_traslate{transition: all .3s;}
.img_traslate:hover{transform: translateY(-10px);}
.img_rotate{transition: all .3s;}
.img_rotate:hover{transform:rotate(-360deg);}
.bold{font-weight: bold;}
.normal{font-weight: normal!important;}
.center{text-align: center!important;}
.img{/* width: 100%; */display: block;    height: auto;}
.ellipsis{overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.ele{position:relative;}
.ele:before,.ele:after{content:'';display: inline-block;vertical-align: middle;}
.ipt{display: block;border:none;}
.ipt_button{cursor: pointer;}
.item_scale .icon{transition: all .3s;}
.item_scale:hover .icon{transform: scale(1.05,1.05);}
.text-left{text-align: left!important;}
.text-right{text-align: right!important;}
.clamp{overflow: hidden;text-overflow: ellipsis;display: -webkit-box!important;display: -ms-flexbox; -webkit-box-orient: vertical;/*-webkit-line-clamp: 3;*/}
.clamp1{overflow: hidden;text-overflow: ellipsis;display: -webkit-box!important;display: -ms-flexbox; -webkit-box-orient: vertical;-webkit-line-clamp: 1;}
.clamp2{overflow: hidden;text-overflow: ellipsis;display: -webkit-box!important;display: -ms-flexbox; -webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.clamp3{overflow: hidden;text-overflow: ellipsis;display: -webkit-box!important;display: -ms-flexbox; -webkit-box-orient: vertical;-webkit-line-clamp: 3;}
body{overflow-x: hidden;}

.item .imgbox{display: block;overflow: hidden;}
.item .img{transition: all 1s;width: 100%;display: block;}
.item:hover .imgbox .img{transform: scale(1.1,1.1);}

.zoomimg{position:relative;overflow: hidden;height: 0;display: block;}
.zoomimg .img{display: block;position:absolute;width: 100%;height: 100%;left: 0;top: 0;}
.block{display: block!important;}

.flipx .icon{transition: all .3s;}
.flipx:hover .icon{transform:scaleX(-1);}
.scale .icon{transition: all .3s;}
.scale:hover .icon{transform: scale(1.1,1.1);}

.underline:hover{text-decoration: underline;}
label{-webkit-tap-highlight-color: rgba(255,0,0,0);} 

.flex{display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex;}
.flex-align-start{align-items: flex-start;}
.flex-align-center {-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
.flex-align-end{align-items: flex-end;}
.flex-pack-center {-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
.flex-pack-justify {-webkit-box-pack: justify;-webkit-justify-content: pace-between;-ms-flex-pack: justify;justify-content: space-between;}
.flex-pack-start{justify-content: flex-start;}
.flex-pack-end{justify-content: flex-end;}
.flex-v {-webkit-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: flex;}
.flex-w{flex-wrap:wrap;}
.flex-1{flex:1;overflow: hidden;}
.flex-11{flex:1;}

html{font-size: 5.2083vw;}

::-webkit-scrollbar{width: .05rem;height: 6px;} 
::-webkit-scrollbar-track {background-color:transparent;} 
::-webkit-scrollbar-thumb {border-radius:0;background: linear-gradient(rgba(96,146,215,.66), rgba(55,86,134,.66));} 
::-webkit-scrollbar-button { display:none;} 
::-webkit-scrollbar-resizer {display:none;}

.hidden{overflow: hidden;}
.scrolly{overflow-y:scroll;}
.scrolly::-webkit-scrollbar{width: 0;} 
.scrollybg{overflow-y:scroll;}
.scrollybg::-webkit-scrollbar{width: .05rem;} 

.relative{position:relative;}
a,a:hover{color:inherit;transition: all 0s;}
.img_full{width: 100%;height: 100%;object-fit: cover;}


::-webkit-input-placeholder{color:#ccd6eb;}
:-moz-placeholder{color:#ccd6eb;}
::-moz-placeholder{color:#ccd6eb;}
:-ms-input-placeholder{color:#ccd6eb;}

/* 公共部分 */

.body{height: 100vh;background:url(../images/img_01.jpg) no-repeat center top;background-size:100% 100%;display: flex;flex-direction: column;overflow: hidden;}

.head{background:url(../images/img_03.png) no-repeat center;background-size:cover;height: 0.8rem;display: flex;align-items: center;padding:0 0.6rem 0 0.95rem;position: relative;}
.head .r{position: absolute;right: 0.65rem;top: 0.18rem;display: flex;align-items: center;height: 0.5rem;}

.hd-logo{font-size: 0.36rem;font-family: 'YouSheBiaoTiHei';}
.hd-lks{position: absolute;left: 4.7rem;bottom: 0.11rem;display: flex;}
.hd-lks .lk{width: 1.68rem;height: 0.34rem;background:url(../images/menu_08.png) no-repeat center;background-size:100% 100%;display: flex;align-items: center;justify-content: center;margin-left: -0.24rem;padding-right: 0.05rem;color:rgba(255,255,255,.7);font-size: 0.16rem;color:#8ab0e2;}
.hd-lks .ico{width: 0.28rem;margin-right: 0.05rem;opacity: 0.7;}
.hd-lks .ico-h{display: none;}
.hd-lks .lk:first-child{margin-left: 0;}
.hd-lks .lk.cur{background-image:url(../images/menu_08-1.png);color:#00d8ff;}
.hd-lks .lk:hover{color:#00d8ff;}

.hd-lks .lk.cur .ico-h,.hd-lks .lk:hover .ico-h{display: block;}
.hd-lks .lk.cur .ico-s,.hd-lks .lk:hover .ico-s{display: none;}




.hd-time{padding-right: 0.25rem;position: relative;}
.hd-time .fz{font-size: 0.22rem;font-family: 'Arial';}
.hd-time .wz{font-size: 0.12rem;font-family: 'Arial';}
.hd-time::after{content:'';position: absolute;width: 1px;height: 0.26rem;right: 0;top: 50%;margin-top: -0.13rem; background: linear-gradient(#fff, #8fc0ff);}

.hd-user{display: flex;align-items: center;font-size: 0.14rem;margin-left: 0.2rem;}
.hd-user .hdpic{width: 0.36rem;height: 0.36rem;border-radius:50%;margin-right: 0.1rem;}
.hd-quit{width: 0.3rem;height: 0.3rem;background:url(../images/icon_02.png) no-repeat center;background-size:0.23rem;cursor: pointer;margin-left: 0.12rem;}


.container{flex:1;overflow: hidden;background:url(../images/img_02.png) no-repeat center;background-size:100% 100%;padding:0.3rem 0.3rem;}

.h100{height: 100vh;}
.iframe{width: 100%;height: 100%;}




.pub-tt{background:url(../images/icon_04.png) no-repeat left center;background-size:auto 100%;border-top:1px solid #79a4eb;}
.pub-tt .smb{background: linear-gradient( rgba(115,166,255,.36),rgba(15,24,51,.36));height: 0.45rem;display: flex;align-items: center;overflow: hidden;padding-bottom: 0.06rem;}
.pub-tt .bt{display: flex;align-items: center;font-size: 0.16rem;/* font-style:italic; */line-height: 1;text-shadow:0 0 0.1rem rgba(222,242,255,1);font-style: italic;letter-spacing: 1px;}
.pub-tt .bt:before{content:'';width: 0.38rem;height: 0.44rem;background:url(../images/icon_03.png) no-repeat center;background-size:contain;margin-top: 0.04rem;}
.pub-tt.long{background-image:url(../images/icon_05.png);}
.pub-tt.long .smb{background: linear-gradient( rgba(15,24,51,.36),rgba(18,38,82,.36));}

.p20{padding:0 0.2rem;}
.mb20{margin-bottom: 0.2rem!important;}
.mb25{margin-bottom: 0.25rem!important;}
.mod-bg{background: linear-gradient( rgba(55,110,191,.26),rgba(15,24,51,.26));}

.btn{font-size: 0.16rem;color:#c2cdee;height: 0.4rem;display: inline-block;vertical-align: middle;position: relative;padding:0 0.15rem;text-align: center;transition: all 0s;}
.btn span{background:url(../images/btn_02.png) repeat-x center;background-size:auto 100%;min-width: 0.52rem;display: block;line-height: 0.4rem;height: 0.4rem;transition: all 0s;}
.btn::before,.btn::after{content:'';background:url(../images/btn_01.png) no-repeat center;background-size:100%;width: 0.15rem;position: absolute;top: 0;bottom:0;transition: all 0s;}
.btn::before{left: 0;}
.btn::after{right: 0;transform: rotate(180deg);}

 
/* .btn {
    font-size: 0.14rem;
    color: #ccd6eb;
    height: 0.32rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.15rem;
    border-radius: 0.16rem;
    background: rgba(39,82,163,.8);
    border: 1px solid rgba(121,164,235,.3);
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
    box-shadow: 0 0.02rem 0.05rem rgba(0,0,0,.2);
}

.btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,0) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.btn:hover {
    color: #fff;
    background: rgba(0,174,255,.9);
    border-color: rgba(0,174,255,.5);
    transform: translateY(-0.01rem);
    box-shadow: 0 0.05rem 0.1rem rgba(0,174,255,.3);
}

.btn:hover::before {
    opacity: 1;
}

.btn:active {
    transform: translateY(0.01rem);
    box-shadow: 0 0.02rem 0.05rem rgba(0,0,0,.2);
} */

.btn.this,.btn:hover{color:#00aeff;}
.btn.this span,.btn:hover span{background-image:url(../images/btn_02-1.png)}
.btn.this::before,.btn.this::after,.btn:hover::before,.btn:hover::after{background-image:url(../images/btn_01-1.png);}
.btn.this:hover{opacity: 0.85;}
.btn.long{min-width: 1.1rem;}

.margin-r15{margin-right: 0.15rem;}

.layui-input, .layui-select, .layui-textarea{background:transparent; color:#ccd6eb;border:0;}
.layui-form-select .layui-edge{border-top-color: #7c9bce;}
.layui-form-select dl dd{color:#333;}
.layui-form-select dl dd.layui-this{background-color: #00aeff;}





/* 群号设置 */
.set-l,.set-r{width: 3.6rem;}
.set-c{margin:0 5%;}

/* 不使用空规则集，如果优化 */
/* .set-port{} */
.set-port .detail{padding:0.15rem 0.25rem 0;}
.set-port .row{display: flex;background-color: #1b3560;margin-bottom: 0.1rem;align-items: center;}
.set-port .tit{font-size: 0.16rem;width: 1rem;height: 0.5rem;line-height: 0.5rem;border:1px solid #5278b1;text-align: center; background: linear-gradient(#71adff, #082755);}
.set-port .info{flex:1;width: auto;}
.set-port .ipt{font-size: 0.14rem;color: #ccd6eb;padding:0 0.15rem;background:none;line-height: 0.5rem;}
.set-port .layui-input{height: 0.5rem;padding:0 0.15rem;}
.set-port .layui-form-select dl{top: 0.5rem;}
.set-port .btngrp{padding-top: 0.25rem;}


/* 能耗统计 */
.nh-l{width: 3.6rem;margin-right: 0.4rem;}
.nh-l .detail{padding:0.2rem 0.25rem;}
.nh-l .button{font-size: 0.16rem;height: 0.5rem;display: flex;align-items: center;justify-content: center;margin-bottom: 0.2rem;border:1px solid #5278b1;background: linear-gradient(#2f5281, #10294f);}
.nh-l .date{font-size: 0.14rem;color:#ccd6eb;height: 0.4rem;line-height: 0.4rem;padding:0 0.22rem;border-radius:0.03rem;width: 100%;background-color: #111b37;border: 1px solid;border-image: linear-gradient(to right, #00a2ff 0%, #142038 50%,#00a2ff 100%) 1;box-shadow:0 0 0.06rem rgba(0,162,255,.36) inset;}

.nh-r .detail{background: linear-gradient(rgba(55,110,191,.26), rgba(15,24,51,.26));}


.layui-table tbody tr:hover, .layui-table thead tr, .layui-table-click, .layui-table-header, .layui-table-hover, .layui-table-mend, .layui-table-patch, .layui-table-tool, .layui-table-total, .layui-table-total tr, .layui-table[lay-even] tr:nth-child(even){background:transparent;border:0;}
.layui-table{background:transparent;}
.layui-table td,.layui-table th,.layui-table-page, .layui-table-total, .layui-table-view{border:0;}


.layui-table-view .layui-table td, .layui-table-view .layui-table th{line-height: 0.22rem;padding:0.15rem 0;text-align: center;}
.layui-table td, .layui-table th{padding: 0;line-height: 1.4;font-size: 0.14rem;color:#ccd6eb;}
.layui-table-body tr:nth-child(even){background-color: rgba(64,118,198,.1);}

.layui-form-checkbox[lay-skin=primary] i{background:transparent;color:transparent;border-color:#00aeff;border-radius:0;}
.layui-form-checkbox[lay-skin=primary]:hover i{border-color: #00aeff;color:transparent;}
.layui-form-checked[lay-skin=primary] i{border-color: #00aeff !important;background-color: #00aeff;color:#08284c;font-weight: bold;}
.layui-form-checked[lay-skin=primary]:hover i{color:#08284c;}





.table{display: flex;flex-direction: column;}
.table .layui-table-view{height: 100%;margin: 0;display: flex;flex-direction: column;margin: 0;}
.table .layui-table-box{flex:1;overflow: hidden;display: flex;flex-direction: column;}
.layui-table-tool .layui-inline{width: 0.3rem;height: 0.3rem;border:0!important;padding: 0;line-height: 0.3rem;background-color: rgba(64,118,198,.3);}
.layui-table-tool .layui-inline .layui-icon{color:#9fbef7;}
.layui-table-tool .layui-inline:hover{background-color: #0cc8ff;}
.layui-table-tool .layui-inline:hover .layui-icon{color:#fff;}

.layui-table-tool{border-bottom:1px solid #3961a2;}

.layui-table-page{border-top:none;text-align: right;margin-top: 0.25rem;}
.layui-table-page .layui-laypage a, .layui-table-page .layui-laypage span{border:0;}

.layui-table-page>div{height: 0.28rem;}
.layui-table-page .layui-laypage a, .layui-table-page .layui-laypage span{line-height: 0.28rem;font-size: 0.14rem;height: 0.28rem;color:#fff;margin:0 0.05rem;padding:0 0.05rem!important;min-width: 0.22rem;text-align: center;}
.layui-table-page .layui-laypage a,.layui-laypage-prev,.layui-laypage-prev{background-color: rgba(64,118,198,.1);}
.layui-laypage .layui-laypage-curr .layui-laypage-em{border-radius:0;background-color: #0cc8ff;}
.layui-laypage .layui-laypage-curr em{color:#010a21;}


.layui-laypage-count{margin-right: 0.2rem!important;}
.layui-laypage .layui-laypage-skip{margin-left: 0.3rem!important;}
.layui-table-page .layui-laypage input,.layui-table-page .layui-laypage button{border:0;border-radius:0;height: 0.28rem;line-height: 0.28rem;font-size: 0.14rem;text-align: center;}
.layui-laypage input{width: 0.38rem;background-color: rgba(64,118,198,.1);}
.layui-laypage button{width: 0.44rem;background-color: #064988;padding: 0;}
.layui-table-page .layui-laypage button:hover{background-color: #0cc8ff;}
.layui-table-page .layui-laypage button{padding: 0;}


/* index */
.idx-l,.idx-r{width: 3.6rem;}
.idx-c{padding:0 0.1rem;margin:0 0.5rem;}
.idx-con .pub-tt{margin-bottom: 0.2rem;}



.idx-kz{}
.idx-kz .list{display: flex;flex-wrap: wrap;margin-top: -0.15rem;}
.idx-kz .list li{width: 33.3%;margin-top: 0.15rem;cursor: pointer;}
.idx-kz .list .icon{width: 0.74rem;height: 0.74rem;border-radius:50%;display: flex;align-items: center;justify-content: center;margin:0 auto;background:url(../images/idx_13.png) no-repeat center;background-size:cover;}
.idx-kz .list .ico{width: 0.4rem;height: 0.4rem;}
.idx-kz .list .ico-h{display: none;}
.idx-kz .list .font{font-size: 0.14rem;color:#ccd6eb;text-align: center;margin-top: 0.08rem;}

.idx-kz .list li.checked .icon{background-image:url(../images/idx_13-1.png); filter: grayscale(50%);}
.idx-kz .list li.checked .font{color:#fff;}
.idx-kz .list li.checked .ico-h{display: block;}
.idx-kz .list li.checked .ico-s{display: none;}





.pub-form{}
.pub-form .row{display: flex;align-items: center;margin-bottom: 0.12rem;}
.pub-form .tit{font-size: 0.14rem;color:#ccd6eb;min-width: 0.6rem;}
.pub-form .info{flex:1;width: 0;}
.pub-form .ipt,.pub-form .layui-input{font-size: 0.14rem;color:#ccd6eb;width: 100%;border-radius:0.05rem;background-color: #111b37;border: 1px solid;border-image: linear-gradient(to right, #00a2ff 0%, #142038 50%,#00a2ff 100%) 1;box-shadow:0 0 0.06rem rgba(0,162,255,.36) inset;}
.pub-form .layui-form-select dl{top: 0.4rem;}
.pub-form .ipt-txt,.pub-form .layui-input{padding:0 0.25rem;line-height: 0.4rem;height: 0.4rem;}

.ipt-date{position: relative;}
.ipt-date::after{content:'';width: 0.1rem;height: 0.1rem;background:url(../images/icon_09.png) no-repeat 95% center;background-size:contain;position: absolute;right: 0.13rem;top: 50%;margin-top: -0.05rem;}

.layui-form-select dl dd{font-size: 0.14rem;line-height: 0.3rem;}
.laydate-time-list ol li{color:#000;}


.idx-top{display: flex;justify-content: space-around;margin-bottom: 0.15rem;}
.idx-top li{text-align: center;transition: all 0.3s;}
.idx-top .icon{height: 1.2rem;}
.idx-top .font{font-size: 0.14rem;color:#ccd6eb;margin-top: -0.22rem;display: flex;align-items: center;justify-content: center;}
.idx-top .font i{font-size: 0.28rem;color:#fff;margin-left: 0.12rem;}
.idx-top li:hover{transform: translate(0,-0.05rem);}

.idx-data{}
.idx-data .list{display: flex;justify-content: space-between;}
.idx-data .list li{width: 49.4%;display: flex;}
.idx-data .list .icon{width: 0.45rem;height: 0.45rem;margin-right: 0.06rem;}
.idx-data .list .txt{font-size: 0.16rem;color:#fff;flex:1;overflow: hidden;padding-left: 0.22rem;background:url(../images/idx_14.png) no-repeat center;background-size:100% 100%;line-height: 0.42rem;}




.checkbox-opts{}
.checkbox-opts .opt{display: block;margin-bottom: 0.06rem;}

.checkbox-opts .layui-form-checkbox[lay-skin=primary] span{font-size: 0.14rem;color:#ccd6eb;line-height: 0.22rem;}
.checkbox-opts .layui-form-checkbox[lay-skin=primary]{padding-left: 0.25rem;}
.checkbox-opts .layui-form-checkbox[lay-skin=primary] i{width: 0.16rem;height: 0.16rem;line-height: 0.16rem;background:url(../images/icon_06.png) no-repeat center;background-size:contain;border:0;font-size: 0.11rem;border-radius: 0;color:transparent;display: inline-block;vertical-align: middle;margin-top: 0.02rem;}
.checkbox-opts .layui-form-checked[lay-skin=primary] i{color:#fff;}

.idx-shib .ann{font-size: 0.14rem;width: 0.74rem;height: 0.27rem;line-height: 0.27rem;background:url(../images/icon_07.png) no-repeat center;background-size:100% 100%;display: block;text-align: center;margin-right: 0.1rem;}
.idx-shib .ann:hover{opacity: 0.85;}

.idx-shib .btngrp{display: flex;justify-content: center;}
.idx-shib .btngrp .btn{margin:0 0.12rem;min-width: 1.15rem;}

.idx-shib .list{}
.idx-shib .list li{font-size: 0.14rem;color:#ccd6eb;line-height: 1.8;}


/* 定时设置 */

.idx-zt{}
.idx-zt .czopt{font-size: 0.14rem;color:#b4d2f8;width: 48%;position: relative;display: flex;cursor: pointer;}
.idx-zt .czopt .icon{width: 0.38rem;height: 0.38rem;margin-right: 0.1rem;opacity: 0.65;}
.idx-zt .czopt .txt{flex:1;overflow: hidden;background: url(../images/idx_14.png) no-repeat center;background-size: 100% 100%;padding-left: 0.14rem;line-height: 0.4rem;}
.idx-zt .czopt.checked .icon{opacity: 1;}
.idx-zt .czopt.checked .txt{color:#fff;}

.ds-zhans{margin-bottom: 0.1rem;}
.ds-zhans .pub-tt{margin-bottom: 0;}
.ds-zhans .list li{display: flex;align-items: center;font-size: 0.3rem;color:#fff;font-weight: bold;font-family: 'DIN';font-style: italic;text-shadow:0 0 0.14rem rgba(222,242,255,1);}
.ds-zhans .list .imgbox{width: 1.2rem;height: 1rem;background:url(../images/idx_17.png) no-repeat center;background-size:cover;margin-right: 0.15rem;display: flex;align-items: center;justify-content: center;}
.ds-zhans .list .icon{height: 0.45rem;width: auto;}



.ds-mod{margin-bottom: 0.2rem;}
.ds-mod .pub-tt .smb{display: flex;align-items: center;justify-content: space-between;padding-bottom: 0.03rem;}
.ds-mod .pub-tt .smb-l,.ds-mod .pub-tt .smb-r{display: flex;align-items: center;}
.ds-mod .total{font-size: 0.14rem;color:#ccd6eb;min-width: 0.7rem;text-align: center;line-height: 0.2rem;background-color: #2652a3;border-radius:0.1rem;display: inline-block;vertical-align: middle;padding:0 0.2rem;margin-left: 0.15rem;}
.ds-mod .tab{font-size: 0.14rem;color:#ccd6eb;line-height: 0.47rem;height: 0.47rem;min-width:1.26rem;text-align: center;cursor: pointer;}
.ds-mod .tab.cur{background:url(../images/icon_08.png) no-repeat center;background-size:100% 100%;color:#00ccff;}

.ds-mod .detail{background: linear-gradient(rgba(55,110,191,.26), rgba(15,24,51,.26));}
.ds-mod .list{padding:0.1rem 0.2rem 0;margin:-1% 0 0 0;display: flex;flex-wrap: wrap;}
.ds-mod .list .item{width: 14.2%;margin:1% 0 0 0;text-align: center;transition: all 0.3s;cursor: pointer;}
.ds-mod .list .imgbox{width: 1.4rem;height: 1.4rem;background:url(../images/idx_16.png) no-repeat center;background-size:100% 100%;padding:0.28rem 0 0;}
.ds-mod .list .smfz{font-size: 0.14rem;color:#ccd6eb;line-height: 0.22rem;height: 0.22rem;}
.ds-mod .list .tp{height: 0.45rem;max-width: 100%;display: block;margin:0.05rem auto 0;}

.ds-mod.idx .tab{margin-left: -0.4rem;}
.ds-mod.idx .list .imgbox{padding-top: 0.2rem;}
.ds-mod.idx .list .smfz{font-size: 0.14rem;color:#ccd6eb;}



.ds-mod .list .item.offline .imgbox{ width: 1.4rem;height: 1.4rem;background:url(../images/idx_16-2.png) no-repeat center;background-size:100% 100%;padding:0.28rem 0 0; }   
.ds-mod .list .item.offline .tp{filter: grayscale(100%);}
.ds-mod .list .item.open .imgbox{filter: grayscale(0%);}
.ds-mod .list .item.open .tp{filter: grayscale(0%);}
.ds-mod .list .item.close .imgbox{filter: grayscale(50%);background-image:url(../images/idx_16-1.png) }
.ds-mod .list .item.close .tp{filter: grayscale(0%);}

.ds-mod .list .item.checked .imgbox{background-image:url(../images/idx_16-0.png)}
.ds-mod .list .item.lock .imgbox{background-image:url(../images/idx_16-3.png)}
.ds-mod .list .item.disabled .imgbox{background-image:url(../images/idx_16-2.png)}

.ds-mod .list .tp.bulb{transform: scale(1.08);}
.ds-mod .list .tp.doc{transform: scale(1.15);}

 

/* 智能灯控 */

/* 智能空开 */

/* 数据记录 */
.record-bar{display: flex;margin-bottom: 0.25rem;}
.record-bar .select{flex:1;width: 0;margin-right: 0.1rem;}


.record-shb{}
.record-shb .table{}
.record-shb .table th,.record-shb .table td{font-size: 0.14rem;color:#ccd6eb;line-height: 0.18rem;text-align: left;padding:0.06rem 0;font-weight: normal;}
.record-shb .table td{font-size: 0.13rem;}
.record-shb .table thead{position: sticky;width: 100%;left: 0;top: 0;background-color: #02021a;}

.record-kt{height: 100%;}
.record-kt .pub-tt{margin-bottom: 0;}
.record-kt .detail{padding:0.2rem 0.2rem;}



/* 自定义 */

.cursor-pointer{cursor: pointer;}

/* 房间列表样式 */
.room-list {
    padding: 0.2rem;
}

.room-item {
    margin-bottom: 0.15rem;
    cursor: pointer;
}

.room-info {
    display: flex;
    align-items: center;
    padding: 0.15rem;
    background: rgba(27,53,96,.5);
    border-radius: 0.05rem;
    transition: all 0.3s;
}

.room-info:hover {
    background: rgba(39,82,163,.5);
}

.room-info.active {
    background: rgba(39,82,163,.8);
}

.room-info .icon {
    width: 0.45rem;
    height: 0.45rem;
    margin-right: 0.15rem;
}

.room-name {
    font-size: 0.16rem;
    color: #ccd6eb;
}

/* 面板列表样式 */
.panel-list {
    padding: 0.2rem;
    height: 100%;
    overflow-y: auto;
}

.panel-list::-webkit-scrollbar {
    width: 0.05rem;
}

.panel-list::-webkit-scrollbar-track {
    background: rgba(27,53,96,.3);
    border-radius: 0.025rem;
}

.panel-list::-webkit-scrollbar-thumb {
    background: linear-gradient(rgba(96,146,215,.66), rgba(55,86,134,.66));
    border-radius: 0.025rem;
}

.panel-list::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(rgba(121,164,235,.8), rgba(71,106,166,.8));
}

.panel-item {
    margin-bottom: 0.2rem;
    background: rgba(27,53,96,.5);
    border-radius: 0.1rem;
    overflow: hidden;
    transition: all 0.3s;
}

.panel-item:hover {
    background: rgba(39,82,163,.5);
    transform: translateY(-0.02rem);
    box-shadow: 0 0.05rem 0.15rem rgba(0,0,0,.2);
}

.panel-header {
    padding: 0.15rem;
    background: rgba(39,82,163,.5);
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(121,164,235,.2);
}

.panel-header h4 {
    font-size: 0.16rem;
    color: #fff;
    margin: 0;
    text-shadow: 0 0 0.1rem rgba(222,242,255,.3);
}

.panel-controls {
    display: flex;
    gap: 0.1rem;
}

.panel-controls .btn {
    min-width: 0.8rem;
}

/* 回路列表样式 */
.loop-list {
    padding: 0.15rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.15rem;
    background: rgba(17,27,55,.3);
}

.loop-item {
    background: rgba(17,27,55,.5);
    padding: 0.15rem;
    border-radius: 0.05rem;
    transition: all 0.3s;
    position: relative;
}

.loop-item.selected {
    background: rgba(27,53,96,.8);
    box-shadow: 0 0 0.15rem rgba(0,174,255,.5);
    border: 1px solid rgba(0,174,255,.5);
}

.loop-item.selected::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 0.05rem;
    box-shadow: inset 0 0 0.1rem rgba(0,174,255,.5);
    pointer-events: none;
}

.loop-item.selected .imgbox {
    transform: scale(1.05);
}

.loop-item:hover {
    background: rgba(27,53,96,.5);
}

.loop-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.1rem;
}

.loop-item .imgbox {
    width: 1.2rem;
    height: 1.2rem;
    background: url(../images/idx_16.png) no-repeat center;
    background-size: 100% 100%;
    padding: 0.2rem 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    transition: all 0.3s;
}

.loop-item:hover .imgbox {
    transform: scale(1.05);
}

.loop-item .img {
    height: 0.4rem;
    max-width: 100%;
    display: block;
    margin: 0.05rem auto 0;
    transition: all 0.3s;
}

.loop-item .img-h {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.loop-item.on .imgbox {
    background-image: url(../images/idx_16-0.png);
    box-shadow: 0 0 0.2rem rgba(0,174,255,.3);
}

.loop-item.off .imgbox {
    filter: grayscale(50%);
}

.loop-item.offline .imgbox {
    background-image: url(../images/idx_16-2.png);
    /* filter: grayscale(100%); */
}

.loop-info {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.08rem;
}

.loop-name {
    font-size: 0.14rem;
    color: #ccd6eb;
    text-shadow: 0 0 0.1rem rgba(222,242,255,.2);
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.loop-controls {
    display: flex;
    gap: 0.08rem;
}

.loop-controls .btn {
    padding: 0.03rem 0.1rem;
    font-size: 0.12rem;
    min-width: 0.5rem;
    line-height: 1.2;
}

/* 开关按钮特殊样式 */
.loop-controls .btn {
    min-width: 0.6rem;
    font-size: 0.13rem;
    height: 0.28rem;
    padding: 0 0.12rem;
}

.loop-controls .btn.loop-on {
    background: rgba(0,174,255,.8);
    border-color: rgba(0,174,255,.5);
    color: #fff;
}

.loop-controls .btn.loop-off {
    background: rgba(64,118,198,.8);
    border-color: rgba(121,164,235,.3);
}

.loop-controls .btn.loop-on:hover {
    background: rgba(0,200,255,.9);
    border-color: rgba(0,200,255,.5);
}

.loop-controls .btn.loop-off:hover {
    background: rgba(84,138,218,.9);
    border-color: rgba(141,184,235,.3);
}

/* 面板控制按钮样式 */
.panel-controls .btn {
    min-width: 0.8rem;
    font-size: 0.14rem;
    height: 0.32rem;
}

/* 自定义样式 */
.flex{
    display: flex !important;
}
.flex-1{
    flex: 1 !important;
}
.flex-align-center{
    align-items: center;
}

/* 自定义 */
.cocur-point{
    cursor: pointer !important;
}
.cocur-point:hover{
    opacity: 0.8 !important;
}