@charset "utf-8";


.body-page{display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;margin: 0 .4rem;}
.body-page .column-1{width: 0;-ms-flex: 2;-webkit-box-flex: 2;-webkit-flex-grow: 2;-o-flex-grow: 2;-moz-flex-grow: 2;flex-grow: 2;margin-right: .2rem;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.body-page .column-1 .m-uibox{display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}

.body-page .column-2{width: 0;-ms-flex: 5.2;-webkit-box-flex: 5.2;-webkit-flex-grow: 5.2;-o-flex-grow: 5.2;-moz-flex-grow: 5.2;flex-grow: 5.2;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-webkit-flex-direction: column;-moz-flex-direction: column;-ms-flex-direction: column;-o-flex-direction: column;flex-direction: column;margin-right: .2rem;}
.body-page .column-2 .row-1{height: 0;margin-bottom: .2rem;-ms-flex: 5.5;-webkit-box-flex: 5.5;-webkit-flex-grow: 5.5;-o-flex-grow: 5.5;-moz-flex-grow: 5.5;flex-grow: 5.5;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.body-page .column-2 .row-1 .m-uibox{position: relative;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-webkit-flex-direction: column;-moz-flex-direction: column;-ms-flex-direction: column;-o-flex-direction: column;flex-direction: column;}
.body-page .column-2 .row-1 .m-uibox:before{position: absolute;left: .2rem;top: .2rem;width: .6rem;height: .14rem;content:"";display: block;background: url(../img/page3/exp.png) center/contain no-repeat;}
.body-page .column-2 .row-1 .m-uibox .topbar{position: relative;-webkit-flex-shrink: 0;-moz-flex-shrink: 0;-o-flex-shrink: 0;-ms-flex-shrink: 0;flex-shrink: 0;padding-top: .1rem;margin-bottom: .3rem;z-index:10;}
.body-page .column-2 .row-1 .m-uibox .conbar{position: relative;height: 0;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;z-index:8;}
.body-page .column-2 .row-2{height: 0;-ms-flex: 2.37;-webkit-box-flex: 2.37;-webkit-flex-grow: 2.37;-o-flex-grow: 2.37;-moz-flex-grow: 2.37;flex-grow: 2.37;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;margin-bottom: .2rem;}
.body-page .column-2 .row-2 .m-uibox{position: relative;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;padding: .4rem .4rem .2rem .4rem;}
.body-page .column-2 .row-3{height: 0;-ms-flex: 1.5;-webkit-box-flex: 1.5;-webkit-flex-grow: 1.5;-o-flex-grow: 1.5;-moz-flex-grow: 1.5;flex-grow: 1.5;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.body-page .column-2 .row-3 .m-uibox{position: relative;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;padding: .2rem .4rem;}
.body-page .column-3{width: 0;-ms-flex: 2.6;-webkit-box-flex: 2.6;-webkit-flex-grow: 2.6;-o-flex-grow: 2.6;-moz-flex-grow: 2.6;flex-grow: 2.6;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-webkit-flex-direction: column;-moz-flex-direction: column;-ms-flex-direction: column;-o-flex-direction: column;flex-direction: column;}
.body-page .column-3 .row-1{-ms-flex: 2.2;-webkit-box-flex: 2.2;-webkit-flex-grow: 2.2;-o-flex-grow: 2.2;-moz-flex-grow: 2.2;flex-grow: 2.2;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;margin-bottom: .2rem;}
.body-page .column-3 .row-1 .m-uibox{position: relative;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;padding: .4rem;}
.body-page .column-3 .row-1 .m-uibox:before{position: absolute;right: .2rem;top: .2rem;width: .6rem;height: .14rem;content:"";display: block;background: url(../img/page3/exp.png) center/contain no-repeat;-webkit-transform: rotateY(180deg);transform: rotateY(180deg);}
.body-page .column-3 .row-2{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.body-page .column-3 .row-2 .m-uibox{position: relative;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;padding: .4rem;}
.body-page .column-3 .row-2 .m-uibox:before{position: absolute;right: .2rem;top: .2rem;width: .6rem;height: .14rem;content:"";display: block;background: url(../img/page3/exp.png) center/contain no-repeat;-webkit-transform: rotateY(180deg);transform: rotateY(180deg);}

.body-page .column-3 .mod-box{width: 0;height: auto;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;}
.body-page .column-3 .mod-box .mod-tt{margin-bottom: .6rem;}

.m-uibox{width: 0;padding: .3rem;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;padding: .5rem;-webkit-box-shadow:0 0 1.5rem rgba(17,86,128,.5) inset;-moz-box-shadow:0 0 1.5rem rgba(17,86,128,.5) inset;box-shadow:0 0 1.5rem rgba(17,86,128,.5) inset;background: #031323;-webkit-border-radius:.1rem;-moz-border-radius:.1rem;border-radius:.1rem;}


.m-monitoring-list{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;overflow: hidden;overflow-y: auto;padding-right: .1rem;}
.m-monitoring-list li{height: auto;margin-bottom: .2rem;cursor: pointer;opacity: 0.5;-webkit-transition: .3s ease-out;-ms-transition: .3s ease-out;-moz-transition: .3s ease-out;-o-transition: .3s ease-out;transition: .3s ease-out;}
.m-monitoring-list img{display: block;width: 100%;height: 3rem;}
.m-monitoring-list .box{position: relative;padding: .2rem;height: 3rem;}
.m-monitoring-list .content{position: absolute;bottom: .1rem;left: .1rem;right: .1rem;padding: .1rem .2rem;text-shadow: 0 0 .8em rgba(0,0,0,0.2);}
.m-monitoring-list li.current{opacity: 1;}
.m-monitoring-list li.current .box{background:url(../img/page4/mli.png) center/100% 100% no-repeat;}

.m-base-period{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;}
.m-base-period li{display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.m-base-period .box{position: relative;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-webkit-flex-direction: column;-moz-flex-direction: column;-ms-flex-direction: column;-o-flex-direction: column;flex-direction: column;padding: .1rem;}
.m-base-period img{height: 0;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: block;-o-object-fit: cover;-webkit-object-fit: cover;-moz-object-fit: cover;-ms-object-fit: cover;object-fit: cover;}
.m-base-period .content{text-align: center;-webkit-flex-shrink: 1;-moz-flex-shrink: 1;-o-flex-shrink: 1;-ms-flex-shrink: 1;flex-shrink: 1;}
.m-base-period .item-time{position: absolute;top: .1rem;right: .1rem;text-shadow: .1em .2em .4em rgba(0,0,0,1);}

.m-base-equipment{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.m-base-equipment li{width: 0;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.m-base-equipment .icon-warp{width: 3rem;-webkit-flex-shrink: 0;-moz-flex-shrink: 0;-o-flex-shrink: 0;-ms-flex-shrink: 0;flex-shrink: 0;background: url(../img/page4/equi.png) center/contain no-repeat;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-webkit-justify-content: center;-moz-justify-content: center;-ms-justify-content: center;-o-justify-content: center;justify-content: center;-ms-align-items: center;-moz-align-items: center;-o-align-items: center;-webkit-align-items: center;align-items: center;}
.m-base-equipment .rotate{position: relative;width: 1.8rem;height: 1.8rem;line-height: 1.8rem;text-align: center;margin-left:auto;margin-right:auto;}
.m-base-equipment .rotate:before{content:"";display: block;position: absolute;left: 0;right: 0;top: 0;bottom: 0;background: url(../img/page4/equi-bg.png) center/contain no-repeat;}
.m-base-equipment .run .rotate:before{-webkit-animation-name:ani-rotate;animation-name:ani-rotate;-webkit-transform-origin:center;transform-origin:center;-webkit-animation-duration:2.6s;animation-duration:2.6s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;animation-timing-function:linear;}
.m-base-equipment .rotate .icon{font-size: .7rem;color: #767a7f;}
.m-base-equipment .run .rotate .icon{color: #0082ff;}
.m-base-equipment .name{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-webkit-flex-direction: column;-moz-flex-direction: column;-ms-flex-direction: column;-o-flex-direction: column;flex-direction: column;-ms-align-items: center;-moz-align-items: center;-o-align-items: center;-webkit-align-items: center;align-items: center;-webkit-justify-content: center;-moz-justify-content: center;-ms-justify-content: center;-o-justify-content: center;justify-content: center;color: #767a7f;}
.m-base-equipment .run .name{color: #fff;}

.video-topbar{display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-ms-align-items: center;-moz-align-items: center;-o-align-items: center;-webkit-align-items: center;align-items: center;}
.video-topbar .name{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;color: #0ff;font-size: .38rem;}
.video-topbar .other{-webkit-flex-shrink: 0;-moz-flex-shrink: 0;-o-flex-shrink: 0;-ms-flex-shrink: 0;flex-shrink: 0;}

.m-video{position: relative;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;width: 0;display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex;}
.m-video .videoCover{position: relative;flex-grow:1;width: 1px;display: -webkit-flex;display: -moz-flex;display: -ms-flex;display: -o-flex;display: flex;overflow: hidden;z-index:1;}
.m-video .videoCover video{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;width: 1px;object-fit: cover;object-position: 100% 100%;}
.m-video .video-img{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;-o-object-fit: cover;-webkit-object-fit: cover;-moz-object-fit: cover;-ms-object-fit: cover;object-fit: cover;}

.video-text{color: #01a2a2;}

.m-video-content{position: absolute;bottom: 0;left: 0;padding: .3rem;color: #FFF;z-index:10;}
.m-video-datas{position: absolute;right: .3rem;top: .2rem;z-index:12;}
.m-video-datas i.video-datas-handle{line-height: 1;cursor: pointer;color: #16aea6;}
.m-video-datas i.video-datas-handle:hover{color: #0ff;}
.m-video-datas i.video-datas-handle:before{content:"\e792";font-family: 'icon-cb';font-size: .5rem;}
.m-video-datas .video-datas-content{width: 5.5rem;height: 8.4rem;top: .6rem;right: 0rem;position: absolute;bottom: 0;background: url(../img/page4/video-datas-bg.png) center/100% 100% no-repeat;}
.m-video-datas .video-datas-content.hidden{}
.m-video-datas .inner-con{padding: .3rem .3rem .3rem .6rem;}

.m-video-data-ul li{display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.m-video-data-ul .icon{position: relative;margin-top: .5rem;height: 1rem;width: 1rem;line-height: 1rem;border: 1px solid rgba(255,255,255,0.5);-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;text-align: center;font-size: .6rem;}
.m-video-data-ul .icon:before{position: absolute;left: .94rem;top: 0;content:"";display: block;width: 1.6rem;height: .3rem;background: url(../img/page4/line-o.png) left center/contain no-repeat;}
.m-video-data-ul .name{margin-left: .2rem;width: 1.6rem;font-size: .3rem;}
.m-video-data-ul .value{padding-top: .1rem;color: #0ff;font-size: .5rem;}


.m-base-live{width: 0;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-webkit-flex-direction: column;-moz-flex-direction: column;-ms-flex-direction: column;-o-flex-direction: column;flex-direction: column;}
.m-base-live .weather-tt{-webkit-flex-shrink: 0;-moz-flex-shrink: 0;-o-flex-shrink: 0;-ms-flex-shrink: 0;flex-shrink: 0;}
.m-base-live .weather-tt .tab-tt{height: auto;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-ms-flex-wrap: wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.m-base-live .weather-tt .tab-tt dt{flex-basis:33.33%;-ms-flex-basis:33.33%;-o-flex-basis:33.333%;-moz-flex-basis:33.33%;-webkit-flex-basis:33.33%;padding: .3rem 0;width: 0;color: #025a65;cursor: pointer;}
.m-base-live .weather-tt .tab-tt dt.current{color: #00ffff;}
.m-base-live .weather-tt .tab-tt .box{display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-ms-align-items: center;-moz-align-items: center;-o-align-items: center;-webkit-align-items: center;align-items: center;}
.m-base-live .weather-tt .tab-tt .dt-icon{-webkit-flex-shrink: 0;-moz-flex-shrink: 0;-o-flex-shrink: 0;-ms-flex-shrink: 0;flex-shrink: 0;height: 1.2rem;width: 1.2rem;font-size: .8rem;line-height: 1.2rem;text-align: center;margin-right: .1rem;-webkit-border-radius: 50%;-moz-border-radius:50%;border-radius: 50%;}
.m-base-live .weather-tt .tab-tt .dt-con{text-align: left;line-height: 1.4;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none; user-select:none;}
.m-base-live .weather-tt .tab-tt .dt-con h2{}
.m-base-live .weather-tt .tab-tt .dt-con .wind{font-size: .8em;}
.m-base-live .weather-tt .tab-tt dt.current .dt-icon{background: #053353;}
.m-base-live .weather-cn{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.m-base-live .weather-cn .tab-cn{height: auto;-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;}
.m-base-live .weather-cn .swiper-slide{height: auto;display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;}
.m-base-live .weather-cn .echart-line{-ms-flex: 1;-webkit-box-flex: 1;-webkit-flex-grow: 1;-o-flex-grow: 1;-moz-flex-grow: 1;flex-grow: 1;}

.m-base-sensor{display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-webkit-flex-direction: column;-moz-flex-direction: column;-ms-flex-direction: column;-o-flex-direction: column;flex-direction: column;overflow: hidden;}
.m-base-sensor-tit{padding: .4rem 0;margin-bottom: .4rem;-webkit-flex-shrink: 0;-moz-flex-shrink: 0;-o-flex-shrink: 0;-ms-flex-shrink: 0;flex-shrink: 0;border-bottom: 1px solid #007474;overflow: visible;}

.m-base-sensor-tit li{width: auto;cursor: pointer;color: #027a7f;margin-right: .2rem;}
.m-base-sensor-tit .box{padding: 0 .3rem;line-height: .8rem;}
.m-base-sensor-tit .current .box{background: #053353;color: #0ff;-webkit-border-radius:.6rem;-moz-border-radius:.6rem;border-radius:.6rem;}
.m-base-sensor-tit .current .box:before{content:'';display: block;position: absolute;left: 50%;top: 1.24rem;margin-left: -.5em;margin-top: -.1em;border-width:.5em;display: block;width:0;height:0;border-style:solid;border-color:#01a2a2 transparent transparent transparent;}


.m-base-sensor-con .box{display: box;display:-ms-flexbox;display: -webkit-box;display: -webkit-flex;display: -moz-flex;display: -o-flex;display: flex;-ms-align-items: center;-moz-align-items: center;-o-align-items: center;-webkit-align-items: center;align-items: center;color: #0ff;}
.m-base-sensor-con .dt-icon{-webkit-flex-shrink: 0;-moz-flex-shrink: 0;-o-flex-shrink: 0;-ms-flex-shrink: 0;flex-shrink: 0;height: 1.2rem;width: 1.2rem;font-size: .8rem;line-height: 1.2rem;text-align: center;margin-right: .1rem;-webkit-border-radius: 50%;-moz-border-radius:50%;border-radius: 50%;}
.m-base-sensor-con .dt-con{text-align: left;line-height: 1.4;}
.m-base-sensor-con .dt-con h3{color: #01a7aa;}