.TextAnimate{
  /* height: 56px!important; */
}
@font-face {
  font-family: PFDinTextCondPro;
  src: url("./PFDinTextCondPro.ttf");
  /* IE9+  HTML节点的lang="en" 记得去掉，不然会谷歌浏览器会自动翻译导致字体不正�? */
}
@font-face {
  font-family: PFDINTEXTPRO_MEDIUM;
  src: url("./PFDINTEXTPRO-MEDIUM.TTF");
  /* IE9+  HTML节点的lang="en" 记得去掉，不然会谷歌浏览器会自动翻译导致字体不正�? */
}
.tdt-overlay-pane .decoration .boat1,.tdt-overlay-pane .decoration .boat2{
  transition: all 0.3s;
  transform-origin: bottom center;
  animation: boat 3s ease infinite;
}
#sys10_panel_3{
  cursor: pointer;
}
.page8_panel_1{
  color: #49de4d;
}
.page8_panel_2{
  color: #d5a501;
}
.page8_panel_3{
  color: #4429d2;
}
.page8_panel_4{
  color: #4ed6f6;
}
#sys10_panel_3:hover{
  filter:brightness(1.5)
}
.fumianInfos .item{
  cursor: pointer;
  position: relative;
  padding-left: 10%;
  height: 33%;
  border-bottom: 1px solid #383636;
}
.fumianInfos .item:hover{
  filter: brightness(1.5);
}
.fumianInfos .item h1{
  font-size: 15px;
  max-width: 48vw;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #e4e6e7;
  margin: 0;
  position: absolute;
  top: 15%;
}
.fumianInfos .item h2{
  max-width: 48vw;
  position: absolute;
  top: 50%;
  font-size: 13px;
  overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
    margin: 0;
    color: #ccc;
}
.fumianInfos .item>a>div{
  display: flex;
  position: absolute;
  bottom: 7%;

}
.fumianInfos .item>a>div>p{
  margin-left: 10px;
  color: #ccc;
}
.fumianInfos .item>a>div .name1,.fumianInfos .item>a>div .name2{
  margin-left: 10px;
  color: #0cf;
}
.fumianInfos .item>a>div>p:first-of-type{
  margin-left: 0;
  margin-right: 10px;
}
.fumianInfos .content{
  position: relative;
  height: 100%;
  overflow: scroll;
}
.fumianInfos>p{
  position: absolute;
    right: -6px;
    color: #a4a5b0;
    font-size: 15px;
    padding: 6px 11px;
    cursor: pointer;
    z-index: 999;
}
.fumianInfos>p:hover{
  color: #fff;
}
.fumianInfos .item .type{
  position: absolute;
    left: 20px;
    top: 20px;
    background: #c23531;
    color: #fff;
    font-size: 14px;
    padding: 1px 3px;
    border-radius: 3px;
}
.fumianInfos{
  width: 54vw;
  display: none;
  position: fixed;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.85);
  bottom: 6%;
  left: 50%;
  transform: translateX(-50%);

  height: 31vh;
}
.fumianInfos.active{
  display: block;
}
.tdt-overlay-pane .decoration .boat2{
  animation-delay: 1.5s;
}

.tdt-overlay-pane .decoration .firework{
  transition: all 0.3s;

    transform-origin: bottom;
  animation: firework 10s ease infinite;
}
.tdt-overlay-pane .decoration .bloom{
  transition: all 0.3s;

    transform-origin: bottom;
  animation: qiqiu 10s ease infinite;
}
.spot-data{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  transition: all 0.5s;

  width: 0;
  height: 0;
}
.echartBoard .databg{
  opacity: 0.78718;
  position: relative;
  z-index: -1;
}
.echartBoard .databg.databg2 {
  display: none;
}
.spot-data.active .spot-name{
  pointer-events: none;
}
.spot-data .spot-name{
  overflow: hidden;
  cursor: pointer;
  position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
}
.spot-data .spot-name img{
  filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.6495))
}
.spot-data::after{
  content: '';
  overflow: hidden;
  cursor: pointer;
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-33%) skewX(-33deg);
  width: 328px;
  height: 109px;
  background: rgba(0,0,0,0.212325);
  z-index: -1;
  filter: blur(6px);
}
.spot-data.active::after{
  bottom: 104%;
}
.echartBoard{
  transform: translateY(10vh);
  transform-origin: center;
  z-index: 999;
}
.echartBoard .dataBoard{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  transition: all 0.5s;
  transform-origin: center;
  transform: translate(-50%,-50%) scale(0);
}
.spot-data.active .dataBoard{
    transform: translate(-50%,-50%) scale(1);
}

.spot-data.active{
  height: 451px;
  width: 762px;
}

.spot-data .close-btn{
  position: absolute;
    right: 030px;
    top: 37px;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    color: #07c1bb;
    opacity: 0.6;
    cursor: pointer;

}


.rightData-box .data3 img {
  position: absolute;
  right: 5%;
  top: 0;
}

.rightData-box .man,.rightData-box .women{
  position: relative;
  width: 50%;
}
.spot-data .close-btn:hover{
    opacity: 1;
}
.rightData-box .data1 h1{
  color: #8ef100;
    font-size: 18px;
    word-break: keep-all;
}

.rightData-box .data1 {
  /* background-color: rgb(44, 248, 255,0.4); */
}


/* .rightData-box  .data2 h1,.rightData-box  .data4 h1{
  padding-left: 30px;
} */

.rightData-box  h1 img{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.rightData-box  h1{
  font-size: 18px;
  position: relative;
  color: #fff;
  margin-top: 0;
}


.rightData-box  .data2 {
  width: 100%;
  height: 570px;
  margin-top: -20px;
  /* background-color: rgb(255, 255, 255,0.4); */
}

/* �?大日承载�? */
.max_num{
  width: 90%;
  height: 24px;
  margin-top: 10px;
  padding-top: 0;
  font-size: 15px;
  color: rgb(239, 122, 46);
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  /* background-color: rgba(55, 192, 255, 0.4); */
}

/* �?售量 */
.spl2{
  width: 100%;
  height: 130px;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
  /* background-color: rgba(156, 255, 99, 0.4); */
}



/* �?售额 */
.spe2{
  width: 100%;
  height: 130px;
  margin-top: 36px;
  margin-left: auto;
  margin-right: auto;
  /* background-color: rgba(228, 83, 83, 0.4); */
}



/* 总车�? */
.zcw{
  width: 100%;
  height: 140px;
  margin-top: 3%;
  /* padding-top: 2%; */
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  /* background-color: rgba(255, 182, 66, 0.4); */
}

.zcw h1 {
  float: left;
  margin-left: 6%;
  font-size: 17px;
  color: white;
  margin-top: 10%!important;
}

.zcw h2{
  float: right;
  margin-right: 6%;
  font-size: 17px;
  color: white;
  margin-top: 10%!important;
}

.zcw h1 span, .zcw h2 span{
  font-size: 19px;
  color: rgb(255, 170, 11);
}



.rightData-box .data1 .fliperCon{
  margin-top: 46px;
  position: relative!important;
  font-family: PFDinTextCondPro;
}
.rightData-box{
  /* padding: 37px; */
  padding-top: 32px;
  padding-left: 25px;
  padding-right: 25px;
  height: 176px;
  overflow: hidden;
  transition: all .3s;
  overflow: hidden;
  position: absolute;
  z-index: 1;
  width: 410px;
  right: 43px;
  top: 128px;
  background: rgba(0, 0, 0,0.675);
}
.rightData-box.active{
  cursor: pointer;
  height: 700px;
}
.spot-data .spot-name.spot3 h1 {
  position: absolute;
  left: 50%;
  top: 26%;
  font-size: 19px;
  color: #fff;
  transform: translateX(-50%);
  /* letter-spacing: 2px; */
  width: 100%;
  text-align: center;
}
.spot-data .spot-name.spot0 h1 {
  position: absolute;
  left: 50%;
  top: 32%;
  font-size: 23px;
  color: #fff;
  transform: translateX(-50%);
  letter-spacing: 2px;
  word-break: keep-all;
  width: fit-content;
}
.spot-data .spot-name h1{
  display: none;
  position: absolute;
  left: 50%;
  top: 27%;
  font-size: 27px;
  color: #fff;
  transform: translateX(-50%);
  letter-spacing: 2px;
  word-break: keep-all;
}
.spot-data .short-title{

  overflow: hidden;
  position: absolute;
  color: #00ffe4;
  font-size: 16px;
  left: 7%;
  top: 2.145%;
  width: 174px;
    height: 30px;
}
.spot-data .short-title p:nth-of-type(1){
  word-break: keep-all;
  position: absolute;
  left: -100%;
  opacity: 0;
  width: 300px;
  animation: textScolling1 5s linear infinite;
}
.spot-data .short-title p:nth-of-type(3){
  display: none;
  word-break: keep-all;
  opacity: 0;
  position: absolute;
  left: -100%;
  animation: textScolling1 3s linear infinite;
  animation-delay: 1.53s;
}
.spot-name.spot2 h1{
  position: absolute;
    left: 50%;
    top: 26%;
    font-size: 23px;
    color: #fff;
    transform: translateX(-50%);
    /* letter-spacing: 2px; */
    width: 100%;
    text-align: center;
}
.movingCloud1{
  position: fixed;
  z-index: 1;
    pointer-events: none;
    right: 100%;
    top: 16%;
    animation-delay: 0s;
    opacity: 0.6;
    animation: movingCloud1 60s ease infinite;
}
.movingCloud2{
  position: fixed;
  z-index: 1;
    pointer-events: none;
    right: 100%;
    top: 56%;
    animation-delay: 15s;
    opacity: 0.6;
    animation: movingCloud2 80s ease infinite;
}
.movingCloud3{
  position: fixed;
  z-index: 1;
    pointer-events: none;
    right: 100%;
    top: 36%;
    animation-delay: 30s;
    opacity: 0.6;
    animation: movingCloud3 120s ease infinite;
}
.movingCloud4{
  position: fixed;
  z-index: 1;
    pointer-events: none;
    right: 100%;
    top: 66%;
    animation-delay: 55s;
    opacity: 0.6;
    animation: movingCloud4 150s ease infinite;
}
.spot-name.spot4 h1{
  position: absolute;
    left: 50%;
    top: 25%;
    font-size: 28px;
    color: #fff;
    transform: translateX(-50%);
    letter-spacing: 1px;
    word-break: keep-all;
    font-weight: bold;
    width: fit-content;
    line-height: 28px;
    text-align: center;
}
.spot-name.spot3 h1{
  position: absolute;
    left: 50%;
    top: 26%;
    font-size: 21px;
    color: #fff;
    transform: translateX(-50%);
    /* letter-spacing: 2px; */
    width: 100%;
    text-align: center;
}
.spot-data .dataBoard .data1{
  position: absolute;
  left: 7%;
  width: 41%;
  height: 30%;
  top: 15%;
}

.spot-data .dataBoard .data1 >div{
  width: 100%;
  height:100%;
}
.spot-data .dataBoard .data2 >div{
  width: 100%;
  height:100%;
}
.spot-data .dataBoard .data3 >div{
  width: 100%;
  height:100%;
}
.spot-data .dataBoard .data4 >div{
  width: 100%;
  height:100%;
  width: 150%;
    height: 142%;
    transform: translate(-14%,-15%);
}


.spot-data .dataBoard .data2{
  position: absolute;
  left: 7%;
  width: 41%;
  height: 46%;
  bottom: 6%;
  padding-top: 20px;
}
.spot-data .dataBoard .data3{
  position: absolute;
  right: 7%;
  width: 41%;
  height: 30%;
  top: 15%;
  display: flex;
}
.spot-data .dataBoard .data3>div{
  width: 44%;
  position: relative;
  margin-right: 5%;

}
.fliperCon {
  font-family: PFDinTextCondPro;
  margin-top: 40px;
  display: flex;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height:66px;

  border-radius: 12px;
}
.fliperCon .item {
  position: relative;
  margin: 0px 2px 0;
  display: inline-block;
  flex: 1;
  height: 66px;

  background: #fff;
  border-radius: 3px;
}
.fliperCon .under:after {
  content: '';
  position: absolute;
  height: 1px;
  background: #000;
  width: 100%;
  top: 50%;
  z-index: 999;
  left: 0;
}
.fliperCon .under {


}
.fliperCon .under,.fliperCon .on {
  text-align: center;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
line-height: 66px;
color: #09710a;
font-size: 70px;
  border-radius: 3px;
  overflow: hidden;
}
.fliperCon .bottom, .num {
  text-align: center;
  color: #09710a;
}
.fliperCon .bottom, .num:before{
  text-align: center;
  content: attr(text);
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
  z-index: 10;
  color: #09710a;
  /* -webkit-mask: linear-gradient(to bottom, #044705, transparent ); */
}
.fliperCon .under{
  text-align: center;
  content: attr(text);
  position: absolute;
  z-index: 10;
  left: 50%;
  transform: translateX(-50%);
  /* -webkit-mask: linear-gradient(to bottom, #044705, transparent ); */
}
.on:before{
  text-align: center;
  content: attr(text);
  position: absolute;
  z-index: 10;
  left: 50%;
  transform: translateX(-50%);

  /* -webkit-mask: linear-gradient(to bottom, #044705, transparent ); */
}
.fliperCon .bottom {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  height: 50%;
  line-height: 0;
  overflow: hidden;    /*不加这行就不会隐藏掉上面那半个数字部�?*/
  background: #fff;
}
.fliperCon .animate {
  transition: all 0.3s;
  box-shadow: 0px 0px 5px #fff;
  animation-name: flip;
  animation-duration: 1s;
  animation-direction: normal;
  animation-fill-mode: forwards;
}
.fliperCon .animate1 {
  animation-delay: .0s;

}
.fliperCon .animate2 {
  animation-delay: .05s;
}
.fliperCon .animate3 {
  animation-delay: .10s;
}
.fliperCon .animate4 {
  animation-delay: 0.15s;
}
.fliperCon .animate5 {
  animation-delay: 0.20s;
}
.fliperCon .animate6 {
  animation-delay: 0.25s;
}
.fliperCon .animate7 {
  animation-delay: 0.30s;
}
.fliperCon .animate8 {
   animation-delay:0.35s;
}
.fliperCon .animate9 {
  animation-delay: 0.4s;
}
.liuzhi1{
  position: fixed;
  z-index: 1;
  pointer-events: none;
  height: 50%;
  top: -20px;
  transform-origin: top;

    animation: liuzhi1 3s ease infinite;
}
.liuzhi2{
  position: fixed;
  z-index: 1;
  pointer-events: none;
  height: 50%;
  right: 0;
  transform: translateX(29%);
  transform-origin: top;
  animation: liuzhi2 3s ease infinite;
}
.liuzhi3{
  position: fixed;
  z-index: 1;
    pointer-events: none;
    height: 50%;
    right: 5%;
    top: -15%;
    transform-origin: top;
    animation: liuzhi3 3s ease infinite;
}

@keyframes qiqiu{  /*@keyframes css的动�?*/
  0% {
    transform: translate(0px, 0px);
  }
  30% {
    transform: translate(10px, -10px);
  }
  80% {
    transform: translate(-10px, 10px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}
@keyframes firework{
  0% {
    transform: scale(0);
    opacity: 1;
  }
  5% {
    transform: scale(1);
  }
  95% {

    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes boat{
  0% {
    transform:  rotate(-7.45deg)
  }
  50% {
    transform: rotate(7.45deg)
  }
  100% {
    transform: rotate(-7.45deg)
  }
}

@keyframes textScolling1{
  0% {
    left: -100%;
    opacity: 1;
  }
  50% {
    left: 0%;
    opacity: 1;
  }
  100% {
    left: 100%;
    opacity: 1;
  }
}
@keyframes textScolling2{
  0% {
    left: 100%;
    opacity: 1;
  }

  50% {
    left: -100%;
    opacity: 1;
  }

  100% {
    left: 0%;
    opacity: 1;
  }
}
@keyframes flip{
  0% {
      opacity: 0;
      transform: rotateX(180deg);
      width: 100%;
  }
  100% {
      transform: rotateX(0);
      opacity: 1;
  }
}

@keyframes liuzhi1{
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(9deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes liuzhi2{
  0% {
    transform:translateX(29%) rotate(0deg);
  }
  50% {
    transform:translateX(29%) rotate(5deg);
  }
  100% {
    transform:translateX(29%) rotate(0deg);
  }
}
@keyframes liuzhi3{
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-6deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes movingCloud1{
  0% {
      opacity: 0.6;

  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.61;
    right: -100%;
  }
}
@keyframes movingCloud2{
  0% {
      opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.61;
    right: -100%;
  }
}
@keyframes movingCloud3{
  0% {
      opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.61;
    right: -100%;
  }
}
@keyframes movingCloud4{
  0% {
      opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.61;
    right: -100%;
  }
}
.spot-data .dataBoard .data3 h1,.rightData-box .data3 h1{
  font-size: 13px;
  margin-top: 0;
}
.spot-data .dataBoard .data3 .women h2,.rightData-box .women h2{
  color: #ff3163;
  font-size: 30px;
  font-family: PFDinTextCondPro;
  margin-top: 10px;
}
.spot-data .dataBoard .data3 .man h2,.rightData-box .man h2{
  color: #0bffff;
  font-size: 30px;
  font-family: PFDinTextCondPro;
  margin-top: 10px;
}
.spot-data .dataBoard .data3 img,.rightData-box .data3 img{
  position: absolute;
  right: 20px;
  top: 0;
  z-index: unset;
}

.spot-data .dataBoard .data4{
  position: absolute;
  right: 6%;
  width: 42%;
  height: 44%;
  bottom: 9%;

}

.spot-data .dataBoard h1 {
  color: #fff;
  font-size: 18px;
  margin-top: 0;
}
.spot-data .dataBoard .data1 h1{
  color: #ffba25;
  font-family: PFDinTextCondPro;

}
.spot-data .spot-name h2{
  position: absolute;
  left: 50%;
  bottom: 20%;
  font-size: 14px;
  color: #fff;
  transform: translateX(-50%);
  font-family: PFDinTextCondPro;
  word-break: keep-all;
  /* width: 100%; */
  display: flex;
  text-align: center;
  line-height: 0;
}
.spot-data .spot-name h2 p{
  font-size: 24px;
  font-weight: bold;
}
#sys1_panel_6 {
  margin-top: 0;
  height: 70%;
  /* display: flex;
  justify-content: center;
  align-items: center; */
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}


#sys1_panel_6 > div{
  /* width: 90px; */
  height: 75px;
  background: url(../images/yknltjBg.png) no-repeat;
  background-size: 100% 100%;
  position: relative;
  text-align: center;
  margin-right: 12px;

}

/* #sys1_panel_6 >div:nth-of-type(1){
  margin-left: 28px;
} */



#sys1_panel_6 > div p{
  display: block;
  font-size: 26px;
	letter-spacing: -1px;
  color: rgba(255, 255, 255, 1);
  padding: 30px  0 14px;
}



#sys1_panel_6 > div span{
  font-size: 12px;
	font-weight: normal;
	font-stretch: normal;
	letter-spacing: 0px;
	color: rgba(255, 255, 255, 1);
}


.man_left {
  margin-left: -32px;
}

.woman_right {
  margin-left: 13px;
}

#sys1_panel_7{
  display: flex;
  justify-content: center;
  margin-top: 0px;
}
#sys1_panel_7 >div{
  display: flex;
  flex-direction: column;
    color: #fff;
    height: fit-content;
    /* margin: 0 20px; */
}
#sys1_panel_7 >div>div:nth-of-type(1){
  width: 282px;
  margin-right: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: -20px;
}

/* #sys1_panel_7 >div p{
  word-break: keep-all;
  font-size: 20px;
} */

#man_1_7 {
  font-size: 20px;
  color: #33d3ae;
}

#m_p_1_7 {
  font-size: 20px;
  color: #33d3ae;
  margin-top: 3px;  /*让两边的字对�?*/
}

#women_1_7 {
  font-size: 20px;
  color: #b44152;
}

#w_p_1_7 {
  font-size: 20px;
  color: #b44152;
  margin-top: 3px;
}



/* #sys1_panel_7 >div > div:nth-of-type(1)> p{
  color: #33d3ae;
}
#sys1_panel_7 >div > div:nth-of-type(2)> p{
  color: #b44152;
} */

#sys1_panel_7 >div > div:nth-of-type(2){
  width: 282px;
  height: 77px;
  position: relative;

}
#sys1_panel_7 >div > div:nth-of-type(2) img:nth-of-type(1){
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#sys1_panel_7 >div > div:nth-of-type(2) img:nth-of-type(2){
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 100%;
  margin: 0 5px;

}
#sys1_panel_7 >div > div:nth-of-type(2) img:nth-of-type(3){
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


.TextAnimate i{
  font-size: 55px;
  margin: 0 19px;
  color: #89eaff;
}
.TextAnimate > span:nth-of-type(2) i{
  margin: 0 0px 0 3px;
}
.TextAnimate > span:nth-of-type(6) i{
  margin: 0 5px 0 0;
}
@font-face {
    font-family: PFDinTextCondPro;
    src: url("./PFDinTextCondPro.ttf");
    /* IE9+  HTML节点的lang="en" 记得去掉，不然会谷歌浏览器会自动翻译导致字体不正�? */
}
@font-face {
    font-family: CAI978Regular;
    src: url("./298-CAI978.ttf");
    /* IE9+  HTML节点的lang="en" 记得去掉，不然会谷歌浏览器会自动翻译导致字体不正�? */
}
body{
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
    /*-webkit-perspective: 1204px;
    -moz-perspective: 1204px;
    perspective: 1204px;
    -webkit-perspective-origin: 35% 10%;
    -moz-perspective-origin: 35% 10%;
    perspective-origin: 50% 0%;*/
}

.parent {
  width: 100%;
  height: 100%;
  pointer-events: none;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto auto;
  overflow: hidden;
  position: absolute;
  -webkit-box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
  box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
}
.loader-05 {
  z-index: -1;
  box-sizing: content-box;
  display: inline-block;
  width: 5em;
  height: 5em;
  color: #fff;
  vertical-align: middle;
  pointer-events: none;
  position: absolute;
  transform-origin: unset;
  box-sizing: content-box;

  left: calc( 50% - 2.5em);
  top: calc( 50% - 2.5em);
  border: .2em solid transparent;
  border-top-color: currentcolor;
  border-radius: 50%;
  -webkit-animation: 1s loader-05 linear infinite;
  animation: 1s loader-05 linear infinite;
  position: absolute;
  transform-origin:center ;

}
.loader-01{
  z-index: unset!important;
}
.loader-05:before {
  content: '';
  display: block;
  width: inherit;
  height: inherit;
  position: absolute;
  top: -.2em;
  left: -.2em;
  border: .2em solid currentcolor;
  border-radius: 50%;
  opacity: .5;
}
@-webkit-keyframes loader-05 {
  0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
  }
}
@keyframes loader-05 {
  0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg) ;
  }
}
.icon_weatherType1{
  background: url(../images/icon_weatherType1.png) no-repeat 0 center;
}
.icon_weatherType2{
  background: url(../images/icon_weatherType2.png) no-repeat 0 center;
}
.icon_weatherType3{
  background: url(../images/icon_weatherType3.png) no-repeat 0 center;
}
.icon_weatherType4{
  background: url(../images/icon_weatherType4.png) no-repeat 0 center;
}
.icon_weatherType5{
  background: url(../images/icon_weatherType5.png) no-repeat 0 center;
}
.icon_weatherType6{
  background: url(../images/icon_weatherType6.png) no-repeat 0 center;
}
.icon_weatherType7{
  background: url(../images/icon_weatherType7.png) no-repeat 0 center;
}

.pageChange_logo {
  position: absolute;
  z-index: 9999;
  text-align: center;
  color: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  transition: all 0.5s;
  opacity: 0;
}
.pageChange_logo p{
  font-size: 1.5vh;
  background: #3f5567;
  border-radius: 5vh;
  line-height: 100%;
  padding: 5% 10%
}
.pageChange_logo img{
  width: 8vh;
}
.pageChange svg {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
}

/* 页面切换 */
.pageChange button {
  position: absolute;
  z-index: 50;
  width: 40px;
  overflow: hidden;
  height: 40px;
  border: none;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  -webkit-box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
  box-shadow: 0 0 88px 5px rgba(0, 0, 0, 0.75);
}
.pageChange button:focus {
  outline-width: 0;
}

.pageChange circle {
  stroke: #000;
  fill: none;
  transition: 0.3s;
}

/* 页面切换circle */
.pageChange #svg1 circle {
  transition-timing-function: linear;
  z-index: 999;
  pointer-events: none;
}


.pageChange #Capa_1 {
  position: absolute;
  width: 16px;
  height: 16px;
  transform: translate(-7px, -8px);
}

.pageChange #Capa_2 {
  position: absolute;
  width: 16px;
  height: 16px;
  transform: translate(-9px, -8px);
}

.pageChange .right {
  margin-left: 628px;
  margin-top: 168px;
  border: 1px solid #849494;
  background-color: transparent;
  transition: .5s;
}
.pageChange .right:hover {
  background-color: #fff;
}

.pageChange .left {
  margin-left: 0.5%;
  margin-top: 6.17%;
  border: 1px solid #849494;
  background-color: transparent;
  transition: .5s;
}
.pageChange .left:hover {
  background-color: #fff;
}

.pageChange .circle1 {
  transition-delay: 0s;

}

.pageChange .circle2 {
  transition-delay: 0.025s;
}

.pageChange .circle3 {
  transition-delay: 0.05s;
}

.pageChange .circle4 {
  transition-delay: 0.075s;
}

.pageChange .circle5 {
  transition-delay: 0.1s;
}

.pageChange .circle6 {
  transition-delay: 0.125s;
}

.pageChange .circle7 {
  transition-delay: 0.15s;
}

.pageChange .circle8 {
  transition-delay: 0.2s;
}

.pageChange .circle9 {
  transition-delay: 0.225s;
}

.pageChange .circle10 {
  transition-delay: 0.25s;
}
.pageChange .circle11 {
  transition-delay: 0.275s;
}
.pageChange .circle12 {
  transition-delay: 0.3s;
}
.pageChange .circle14 {
  transition-delay: 0.325s;
}
.pageChange .circle15 {
  transition-delay: 0.375s;
}

.pageChange .slider {
  position: absolute;
  width: 400%;
  height: 100%;
  background: #000;
  display: inline-flex;
  overflow: hidden;
}

.slide1,
.slide2,
.slide3,
.slide4 {
  position: absolute;
  background-position: center;
  background-size: cover;
  color: #fff;
  font-size: 62px;
  padding-top: 138px;
  font-weight: 800;
  font-family: 'Heebo', sans-serif;
  text-align: center;
  width: 25%;
  height: 100%;
  z-index: 10;
  transition: 1.4s;
}

.pageChange .tran {
  transform: scale(1.3);
}

/* 页面切换 up1 */
.pageChange .up1 {
  z-index: 999;
}



.pageChange .steap {
  stroke-width: 0;
}

.pageChange .streak {
  stroke-width: 5vw!important;
}
.pageChange .streak:first-of-type {
  fill: #000
}
/* 转场 */

/* 底部导航�? */
.bottom_nav_up{
  width: 60%;
  height: 10%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 998;
  transition: all 0.8s;
  display: none;
}
/* 底部导航栏背�? */
.bottom_bg{
  width: 100%;
  height: 125px;
  position: fixed;
  z-index: 1;
  bottom: 0;
  pointer-events: none;
  transform: translateY(150px);
  background-image: linear-gradient(to top,#010b2f 15%,#0c1c26 40%,transparent 100%);
  background-image: -webkit-linear-gradient(to top,#010b2f 15%,#0c1c26 40%,transparent 100%);
  background-image: -moz-linear-gradient(to top,#010b2f 15%,#0c1c26 40%,transparent 100%);
  background-image: -o-linear-gradient(to top,#010b2f 15%,#0c1c26 40%,transparent 100%);
  background-image: -ms-linear-gradient(to top,#010b2f 15%,#0c1c26 40%,transparent 100%);
}
.jsPanel-replacement .jsPanel-btn-maximize{
  display: none;
}
.jsPanel-replacement .jsPanel-btn-normalize{
  width: 35px;
  height: 35px;
}
.jsPanel_hide{
  visibility: hidden;
}
/*
.custom-control-icon.custom-maximize::before{
  content: url(../images/maximize.png);
  width: 50px!important;
  height: 50px!important;
}

.custom-control-icon.custom-normalize::before{
  content: url(../images/normalize.png);
}
.custom-control-icon.custom-minimize::before {
  content: url(../images/minimize.png);
}
.custom-control-icon.custom-smallify::before{
  content: url(../images/smallify.png);
}
*/
.jsPanel_page4 .klltj{
  height: 100%;
  color: #fff;
}
.jsPanel_page4 .klltj .active{
  background: #00f4fd;
  color: #000;
}
.jsPanel_page4 .klltj>div{
  padding: 0 10%;
  display: flex;
  margin: 5% 0;
}
#sys10_panel_1,#sys10_panel_2,#sys10_panel_3,#sys1_panel_5{
  display: flex;
}

#sys10_panel_1{
  flex-direction: column;
}
#sys10_panel_1 .itemBox{
  display: flex;
  align-items: center;
  flex: 1;
}
#sys10_panel_1 .itemBox .__item{
  flex: 1 1 0%;
}
#sys10_panel_1 .itemBox .__item .logo{
  display: flex;
  align-items: center;
  position: relative;
}
#sys10_panel_1 .itemBox .__item .number>img{
  width: 9.3vw;
  min-width: 150px;
  display: block;
}
#sys10_panel_1 .itemBox .__item .number{
  position: relative;
}
#sys10_panel_1 .itemBox .__item .number .__text{
  width: 100%;
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%,-50%);
}
#sys10_panel_1 .itemBox .__item .number .total{
  font-size: 35px;
  font-family: PFDINTEXTPRO_MEDIUM;
  color: #fff;
  text-align: center;
}
#sys10_panel_1 .itemBox .__item .number .tips{
  font-size: 14px;
  color: #fff;
  opacity: 0.5;
  text-align: center;
  margin-top: 5px;
}
#sys10_panel_1 .itemBox .__item .number ._date{
  position: absolute;
  bottom: 0px;
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 15px;
  font-family: PFDinTextCondPro;
}
#sys10_panel_1 .itemBox .__item .number .today{
  font-size: 12px;
  color: #fff;
  text-align: center;
}
#sys10_panel_1 span,#sys10_panel_2 span,#sys10_panel_3 span {
  font-size:12px;
  margin-left: 6px;
}
#sys1_panel_5 .total{
  letter-spacing: 2px;
  font-size: 40px;
  position: absolute;
  bottom: 50%;
}
#sys1_panel_5 .today{
  color: #fff;
  position: absolute;
  top: 50%;
  font-size: 20px;
}
#sys1_panel_5 span{
  font-size: 20px;
  margin-left: 6px;
}
 #sys1_panel_5 .total{
  color:#ffdf8d
}
#page10_panel_7 .jsPanel-headerlogo{
  width:0
}
#page10_panel_8 .jsPanel-headerlogo{
  width:0
}
#sys1_panel_5 img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 60%;
}
#sys10_panel_1 a,#sys1_panel_5 a{
  position: absolute;
  right: 0;
  top: 0;
  z-index: 999;
}
#sys1_panel_5 a img {
  position: absolute;
  top: 5px;
  right: 5px;
  left: unset;
  transform: none;
}

#sys10_panel_7 p,#sys10_panel_8 p{
    position: absolute;

    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
#sys10_panel_7 p{
  color: #0ce9cd;
  font-size: 30px;
}
#sys10_panel_8 p{
  color: #ffba25;
  font-size: 50px;
}
#sys10_panel_7 span{
    font-size: 50px;
}
.jsPanel_page4 .klltj>div>div:first-of-type{
  width: 40%;
}
.jsPanel_page4 .klltj>div>div:last-of-type{
  width: 60%;
}
.jsPanel_page4 .klltj>div  button{
  height: 25%;
  background: #042140;
  border-radius: 7px;
  color: #1378af;
  font-size:12px;
}
.jsPanel_page4 .klltj>div  button:hover{
  background: #00f4fd;
  color: #000;
}
.jsPanel_page4 .klltj>div:first-of-type button{
  float: left;
  width: 17%;
  margin: 10px 1.25%;
}
.jsPanel_page4 .klltj>div p:nth-of-type(1){
  font-size: 14px
}
.jsPanel_page4 .klltj>div p:nth-of-type(2){
  font-size: 24px;
}
.jsPanel_page4 .klltj>div p:nth-of-type(3){
  font-size: 12px
}
.jsPanel_page4 .klltj>div:first-of-type p:nth-of-type(2){
  color: #00f4fd;
}
.jsPanel_page4 .klltj>div:last-of-type p:nth-of-type(2){
  color: #ff8f35;
}
.jsPanel_page4 .klltj>div:last-of-type button{
  float: left;
  width: 14%;
  margin: 1% 1%;
}
 .pwsj{
  height: 100%;
  color: #fff;
   display: flex;
   flex-direction: column;
   justify-content: space-around;
   padding: 5% 0;
}
.pwsj>div{
  display: flex;
  align-items: center;
  justify-content: center;
}
.pwsj>div:first-of-type{
  margin: 0px;
}
.pwsj>div:last-of-type{
  margin: 5px 0px 0px;
}
.pwsj div h1{
  margin: 0px;
  color: #a09fa3;
  white-space: nowrap;
}
.pwsj h1{
  font-size: 20px;
}
.pwsj h1 font{
  color: #ffa500;
  font-size: 40px;
  margin: 0 5px 0 0px;
}
.pwsj .detail{
  margin: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  top: -4px;
  margin-left: 15%;
}
.pwsj p{
  font-size: 14px;
  color: #a09fa3;
}
.pwsj p font{
  font-size: 21px;
  color: #00f4fd;
  margin: 0 3px 0 6px;
}

.pick_date_box{
  display: flex;
  width: 96%;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
  font-size: 12px;
  height: 6%;
  top: 10px;
  max-height: 50px;
}
.pick_date_box input{
  margin: 0 2px;
  width: 27%;
  padding-left: 10px;
  font-size: 12px;
}
.pick_date_box button{
  margin: 0 2px;
}
.pick_date_box button img{
  display: none;
}
.pick_date_box button:first-of-type{
  background: #ffba25;
  width: 22%;

}
.pick_date_box button:last-of-type{
  background:transparent;
  border: 1px solid #fff;
  color: #fff;
  width: 18%;

}
.pick_date_box input[type=date]::-webkit-inner-spin-button{
  display: none;
}
.pick_date_box input[type=date]::-webkit-clear-button{
  display: none;
}

.toggler-box{   /*底部按钮*/
  z-index: 9998;
  position: fixed;
  bottom: 0;
  font-size: 12px;
  left: 50%;
  transform: translateX(-50%);
  width: 150px;
  height: 13px;
}
.toggler-box:hover svg:nth-of-type(2) path{
  fill: #009ffd;
  transform-origin: center;
}
.toggler-box svg:nth-of-type(2){
  position: absolute;
  top: 0;
    left: 0;
}
.toggler-wrap{

}
.toggler-wrap path:first-of-type{
  fill: rgb(33, 38, 49);

}
.toggler-box svg:nth-of-type(2) path{
   fill: rgb(255, 255, 255);
   transform-origin: center;
}

/* 打开全部&关闭全部 */
.svg-wrapper {
    width: 100px;
    height: 35px;
    cursor: pointer;
    position: absolute;
    top: 0px;
}
.svg-wrapper:nth-child(1) #shape {
    stroke-width: 6px;
    fill: transparent;
    stroke: #009ffd;
    stroke-dasharray: 70 400;
    stroke-dashoffset: -150;
    transition: 1s all ease;
}
.svg-wrapper:nth-child(1):hover #shape {
    stroke-dasharray: 50 0;
    stroke-width: 3px;
    stroke-dashoffset: 0;
    stroke: #06d6a0;
}
.svg-wrapper:nth-child(2) #shape {
    stroke-width: 6px;
    fill: transparent;
    stroke: #06d6a0;
    stroke-dasharray: 70 400;
    stroke-dashoffset: -150;
    transition: 1s all ease;
}
.svg-wrapper:nth-child(2):hover #shape {
    stroke-dasharray: 50 0;
    stroke-width: 3px;
    stroke-dashoffset: 0;
    stroke: #009ffd;
}

figure {
  width: 100px;
  height: 40px;
  cursor: pointer;
  /* perspective: 500px;
  -webkit-perspective: 500px; */
  z-index: 999;
  position: fixed;
  top: 6vh;
  right: 20px;
}

figure>div {
  height: 100%;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  transition: 0.25s;
  -webkit-transition: 0.25s;
  position: relative;
}

/* figure:hover div {
  transform: rotateY(180deg);
} */

figure .face:nth-child(1) {
  transform: translate3d(0, 0, 15px);
  -webkit-transform: translate3d(0, 0, 15px);
  color: #fff;
}

figure .face:nth-child(2) {
  opacity: 1;
  transform: rotateY(90deg) translate3d(0, 0, 15px);
  -webkit-transform: rotateX(90deg) translate3d(0px, 0px, 15px);
  color: #fff;
}
figure>div.allControlBtn{
    transform: rotateX(-90deg);
    transition: all 0.6s;
}

/* 打开全部&关闭全部 */
.nose_table{
  text-align: center;
  width: 100%;
  height: 30%;
}
.nose_table img{
  margin-top:20px;
  width: 60%;
}
.jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md svg:not(.svg-inline--fa), .jsPanel-controlbar .jsPanel-btn.jsPanel-btn-md span:not(.material-icons){
  width: 1rem!important;
  height: 1rem!important;
}
.jsPanel-headerbar{
  height: 30px;
}
.jsPanel-headerbar img{
  height: 100%;
  margin-left: 8px;
}
.jsPanel-replacement .jsPanel-headerbar img{
  height: 38px;
  margin-left: 0;
}
.jsPanel{
  background: none!important;

}
#page1_panel_4{
  z-index: 1111!important;
}
#page1_panel_6{
  margin-top: -60px;
}
.jsPanel-content {
  background: rgba(0,0,0,0);
}
.jspanel_maximize{
  z-index: 9999!important;
  background: rgba(0, 0, 0, 0.85)!important;
}
.jsPanel-btn-close{
  display: none!important;
}
#jsPanel-replacement-container_left .jsPanel-controlbar .jsPanel-btn-normalize{
  display: block!important;
  opacity: 0;
}
#jsPanel-replacement-container_right .jsPanel-controlbar .jsPanel-btn-normalize{
  display: block!important;
  opacity: 0;
  position: absolute;
  right: 0;
}
#jsPanel-replacement-container{
  display: none!important;
  top:20%!important;
  bottom: unset!important;
  flex-direction: column!important;
  width: 100%!important;

}
.jsPanel-headerlogo{
  cursor: default!important;
  width: 40px;
  height: 100%;
}
.jsPanel-replacement .jsPanel-headerlogo{
  height: unset;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.jsPanel-replacement .jsPanel-headerbar{
  height: unset;
}
#jsPanel-replacement-container_right .jsPanel-titlebar .jsPanel-title{
  margin: 0 40px 0 55px!important;
}
#jsPanel-replacement-container_left>div{
  margin: 10px 0!important;
  width: 200px;
  background: none!important;
}
#jsPanel-replacement-container_right>div{
  margin: 10px 0!important;
  width: 200px;
  background: none!important;
}
#jsPanel-replacement-container_right .jsPanel-headerbar{
  height: 38px;
}
#jsPanel-replacement-container_right .jsPanel-headerlogo{
  position: absolute;
  right: 0;
}
#jsPanel-replacement-container_right .jsPanel-controlbar{
  position: absolute;
  left: 0;
}
#jsPanel-replacement-container .jsPanel-headerlogo{
  z-index: 900;
}

/* #jsPanel-replacement-container>div:hover{
  background: linear-gradient(90deg, rgba(78, 78, 68, 1) 0%, rgba(0, 0, 0, 0) 100%)!important;
} */
#jsPanel-replacement-container .jsPanel-replacement:nth-child(3n+0) .jsPanel-headerbar:hover{
  /* background: linear-gradient(90deg, rgba(78, 78, 68, 1) 0%, rgba(0, 0, 0, 0) 100%)!important; */
  background: linear-gradient(90deg, rgba(23, 56, 75, 1) 0%, rgba(231, 131, 1, 0) 100%)!important;
}
#jsPanel-replacement-container .jsPanel-replacement:nth-child(3n+1) .jsPanel-headerbar:hover{
  background: linear-gradient(90deg, rgba(23, 56, 75, 1) 0%, rgba(231, 131, 1, 0) 100%)!important;
}
#jsPanel-replacement-container .jsPanel-replacement:nth-child(3n+2) .jsPanel-headerbar:hover{
  /* background: linear-gradient(90deg, rgba(49, 40, 75, 1) 0%, rgba(231, 131, 1, 0) 100%)!important; */
  background: linear-gradient(90deg, rgba(23, 56, 75, 1) 0%, rgba(231, 131, 1, 0) 100%)!important;
}

.jsPanel-replacement .jsPanel-title{
  color:#fff!important
}
#jsPanel-replacement-container_left .jsPanel-replacement .jsPanel-titlebar{
  transform: translateX(-250px);
  opacity: 0;
  transition: all 0.8s;
  cursor: default;
  position: relative;
  z-index: -1;
}
#jsPanel-replacement-container_left .jsPanel-replacement .jsPanel-controlbar{

  opacity: 0;
  transition: all 0.8s;
  position: absolute;
  left: 0;
  margin: 0;
  z-index: 999;
}
#jsPanel-replacement-container_right .jsPanel-replacement .jsPanel-titlebar{
  transform: translateX(250px);
  opacity: 0;
  transition: all 0.8s;
  position: relative;
  z-index: -1;
  cursor: default;
}
#jsPanel-replacement-container_right .jsPanel-replacement .jsPanel-controlbar{

  opacity: 0;
  transition: all 0.8s;
  position: absolute;
  right: 0;
  margin: 0;
  z-index: 999;
}
.jsPanel-headerbar:hover .jsPanel-titlebar{
  transform: translateX(0)!important;
  opacity: 1!important;
}

#mapDiv{
  width:100%;
  height:100vh;
  position:absolute!important;
  top:0px;
  left:0px;
  z-index: 1;
  background-color: #001742!important;
}
.mapIcon{
 position: relative;
 z-index: 999;
}
.mapIcon>img{
  animation: spin  3s linear infinite;
  transform-origin: center center
}
.tdt-marker-pane .tdt-marker-icon,.tdt-_w-pane .tdt-marker-shadow{
    opacity: 0!important;
}
.tdt-infowindow-content{
    width: auto!important;
    margin: 0!important;
    position: relative;
}
.markerInfoWin{
  min-width: 365px;
  max-width: 365px;
  background: rgba(1, 11, 47, 0.85);
  position: relative;
  top: 0px;
  left: 0px;
  text-align: center;
  border:1px solid rgba(4, 110, 158, 0.84);
}
.markerInfoWin .title{
    font-size: 16px;
    color: #fff;
    text-align: left;
}
.markerInfoWin>img{
  margin-top: 17px
}
.markerInfoWin p{
    margin: 0px!important;
    color: #fff;
}
.markerInfoWin>div:first-of-type{
  background: linear-gradient(90deg,  rgb(10, 88, 109) 0%, rgba(38, 109, 134, 0.2) 100%);
  padding: 5px 0 5px 6%;
}

.markerInfoWin .winContent .textBox{
  display: flex;
  align-items: center;
}
.markerInfoWin .winContent .textBox p{
  font-size: 16px;
  color: #0bffff;
  text-align: left;

}
.markerInfoWin .winContent .textBox img{
    height: 20px;
    display: block;
    margin: 0 10px;
}
.markerInfoWin .winContent .textBox font{
  width: 46px;
  font-size: 20px;
  color: #fff;
    display: block;
    text-align: right;
}
.markerInfoWin .winContent .textBox p.winInfoNum{
    display: flex;
    align-items: center;
  font-size: 13px;
  color: #c8c8c8;
  margin-left: auto!important;
  position: relative;
}
.markerInfoWin .winContent .textBox p:last-of-type >span{
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  position: relative;
  opacity: 1;
  bottom: unset;
  background: none;
  font-size: 12px;
  color: #fff;
  transition: all 0.5s;
}
.markerInfoWin .winContent .textBox p:last-of-type >span::after{
  border-top-color: #57679a;
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-top: 5px solid #57679a;
  top: 100%;
  left: 25px;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;

}
.markerInfoWin .winContent .textBox p:last-of-type:hover span{
  opacity: 1;
}
.tdt-infowindow-content .guideLine{
  position: relative;
  width: 2px;
  height: auto;
  bottom: 0;
  left: 75%;
}
.mapMask{
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0px;
  left: 0px;
  opacity: 1;
  background-color: rgb(0, 17, 80);
  /*mix-blend-mode: color-dodge;*/
  z-index: 300;
}
.mapMask img{
  width: 100%;
  height: 100%;
  display: block;
}
#thunderCanvas{
    width: 100vw;
    height: 100vh;
    position: relative;
    z-index: 300;
    background-color: transparent;
}


/* 黑背�? */
.hbg {
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 98;
  position: absolute;
  top: 0;
  left: 0;
}





.bigData_header{
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  position: fixed;
  top: 0px;
  left: 50%;
  z-index: 99;
  transform: translateX(-50%);
}
.bigData_header .H_mask{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 135%;
    z-index: 0;

    background-image: linear-gradient(to bottom,rgba(0,0,0,0.765) 45%,transparent 100%);
    background-image: -webkit-linear-gradient(to bottom,rgba(0,0,0,0.765) 45%,transparent 100%);
    background-image: -moz-linear-gradient(to bottom,rgba(0,0,0,0.765) 45%,transparent 100%);
    background-image: -o-linear-gradient(to bottom,rgba(0,0,0,0.765) 45%,transparent 100%);
    background-image: -ms-linear-gradient(to bottom,rgba(0,0,0,0.765) 45%,transparent 100%);
}
.bigData_header .H_title .color-btns{
  position: absolute;
  right: -20px;
  top: 50%;
  display: flex;
}
.bigData_header .H_title .color-btns>p:nth-of-type(1){
  width: 20px;
    height: 20px;

    cursor: pointer;
}
.bigData_header .H_title .color-btns>p:nth-of-type(1):hover{
    border: 1px solid #3d6dcc;
}

.bigData_header .H_title .color-btns>p:nth-of-type(2){
  width: 20px;
    height: 20px;
    background: #111d3f;
    border-radius: 3px;

    /* border: 1px solid grey; */
    cursor: pointer;
    margin-left: 7px;
}
.bigData_header .H_title .color-btns>p:nth-of-type(2):hover{
  border: 1px solid #3d6dcc;
}
.bigData_header .H_title .color-btns>p.active{
  border: 1px solid #3d6dcc;
}





.bigData_header .H_title{
  max-width: 701px;
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  white-space: nowrap;
}
.bigData_header .H_title .neon{
    position: absolute;
    top: 41%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
}
.bigData_header .H_title .neon .text{
    color: hsl(165, 36%, 96%);
    font-size: 30px;
    font-weight: bold;
   /* text-shadow: 0 1px 0 hsl(241, 95%, 45%),
    0 2px 0 hsl(192, 4%, 32%),
    0 3px 0 hsl(0, 6%, 40%),
    0 4px 0 hsl(313, 4%, 24%),
    0 5px 0 hsl(119, 2%, 40%),
    0 6px 1px hsla(0, 0%, 0%, .1),
    0 0 5px hsla(0, 0%, 0%, .1),
    0 1px 3px hsla(0, 0%, 0%, .3),
    0 3px 5px hsla(0, 0%, 0%, .2),
    0 5px 10px hsla(0, 0%, 0%, .25);*/
}
.bigData_header .H_title .spotlight{
    position: absolute;
    width: 60%;
    height: 100%;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
    overflow: hidden;
}
.bigData_header .H_title .spotlight:before{
    content: '';
    position: absolute;
    bottom: 0px;
    left: -40%;
    display: block;
    width: 30%;
    height: 28%;
    background: url(../images/title_mask.png) no-repeat bottom;
    background-size: 100% 100%;
    animation: titlelight 6s infinite cubic-bezier(.74,.57,.5,.9);
}
@keyframes titlelight {
    0% {
        left: -40%;
        opacity: 0.3;
        transform: scale(1.2,1.3);
    }
    35%{
        opacity: 0.7;
        transform: scale(1.6,1.5);
    }
    50% {
        opacity: 1;
        transform: scale(1,1);
    }
    75% {
        opacity: 0.5;
        transform: scale(1.5,1.5);
    }

    100%{
        left: 120%;
        opacity:1;
        transform: scale(1,1);
    }
}
/*
.bigData_header .H_title p{
  position: absolute;
  top: 41%;
  left: 50%;
  transform: translate(-50%,-50%);
  font-size: 30px;
  white-space: nowrap;
  font-weight: bold;
  background-image: -webkit-linear-gradient(left, #3498db, #43c4d9 10%, #4ad77e 20%, #3498db 30%,
  #43c4d9 40%, #4ad77e 50%, #3498db 60%, #43c4d9 70%, #4ad77e 80%, #43c4d9 90%, #3498db);
  color: transparent; !*文字填充色为透明*!
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;          !*背景剪裁为文字，只将文字显示为背�?*!
  background-size: 200% 100%;            !*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*!
  !* 动画 *!
  animation: masked-animation 4s infinite linear  alternate;
}
*/

@keyframes masked-animation {
  0% {
      background-position: 0 0;   /*background-position 属�?�设置背景图像的起始位置�?*/
  }
  100% {
      background-position: -100% 0;
  }
}

.bigData_header img{
  width: 100%;
  display: block;
}
.bigData_header .H_weather{
  position: relative;
  max-width: 472px;
  z-index: 3;
}
.bigData_header .H_system{
  position: relative;
  max-width: 533px;
  z-index: 3;
}
#ewm_alter{
  cursor: pointer;
}
.ewm_scan{
  border: 5px solid #12e2ee;
  opacity: 0;
  position: absolute;
  top: 85px;
  right: -400px;
  z-index: 999;
  height: 260px;
}
.ewm_scan img{
  object-fit: contain;
  width: 250px;
}
.ewm_active{
 opacity: 1;
 transform:translateX(-400px) ;
 transition: all ease 1s;
}
.ewm_deActive{
 opacity: 0;
 transform:translateX(400px) ;
 transition: all ease 1s;
}

.H_weatherContent,.H_systemContent{
  position: absolute;
  width: 100%;
  height: 80%;
  bottom: 0px;
  left: 0px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.bigData_header .H_weatherContent .weatherItem{
  width: 33.33%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: default;
}

.bigData_header .H_weatherContent .weatherItem:last-child{
  padding-left: 13px;
}
.bigData_header .H_weatherContent .weatherItem .closeAllBtn,
.bigData_header .H_weatherContent .weatherItem .openAllBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.bigData_header .H_weatherContent .weatherItem .openAllBtn{
    display: none;
}
.bigData_header .H_weatherContent .weatherItem p{
  color: #fff;
  font-size: 18px;
}
.bigData_header .H_weatherContent .weatherItem span{
    width: 16px;
    height: 21px;
    display: block;
    margin-right: 8px;
}
.bigData_header .H_weatherContent .weatherItem.allContralBtn span{
    width: 23px;
}
.bigData_header .H_systemContent .systemItem{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.bigData_header .H_systemContent .systemItem:nth-child(1){
  width: 50%;
}
.bigData_header .H_systemContent .systemItem:nth-child(2){
  width: 28%;
}
.bigData_header .H_systemContent .systemItem:nth-child(2) img{
  height: 70%;
  width: 80%;
}
.bigData_header .H_systemContent .systemItem:nth-child(3){
  width: 22%;
}
.bigData_header .H_systemContent .systemItem p{
  color: #95ccff;
  font-size: 18px;
}
#systemTime{
  font-size: 20px!important;
  letter-spacing: 2px;
}
.bigData_header .H_systemContent .systemItem:nth-child(1) p{
  padding-left: 20px;
    display: flex;
    align-items: center;
    white-space: nowrap;
}
.bigData_header .H_systemContent .systemItem:nth-child(1) p img{
    width: 12px;
    height: 10px;
}
.bigData_header .H_systemContent .systemItem:nth-child(1) p i{
    display: inline-block;
    margin: 0 3px;
}
.bigData_header .H_systemContent .systemItem:nth-child(3) p{
  color: #0fddef;
  cursor: pointer;
}
.bigData_header .H_systemContent .systemItem:nth-child(2){
    position: relative;
}
#layOut{
    cursor: pointer;
}
.bigData_header .H_systemContent .systemItem span{
  width: 16px;
  height: 21px;
  display: block;
  margin-right: 8px;
  position: relative;
  top: 3px;
}
#systemTime{
    display: flex;
    align-items: center;
    position: relative;
    top: -8px;
    font-family: CAI978Regular;
}
#systemTime>img{
    width: auto;
    height: 16px;
}
#systemDate{
    display: flex;
    align-items: center;
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-65%);
}
#systemDate>img{
    width: auto;
    height: 10px;
}
.earthBox{
    visibility: hidden;
    width: 250px;
    height: 250px;
    position: absolute;
    top: 8%;
    left: 20%;
    z-index: 3;
    overflow: hidden;
}
#sys1_panel_4{
  position: relative;
  text-align: center;
}
#sys1_panel_4 > h4{
  display: block;
  font-size: 18px;
  font-weight: bold;
  color:#0de59b;
  margin: 0;
}


#sys1_panel_4 .rollingNumber{
  margin-top: 1vh!important;
  /* margin-top: -20px; */
  color: rgb(187, 187, 187,0);
}
#sys1_panel_4 p{
  display: block;
  margin-top: 2vw!important;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* .ssrsbao {
  width: 640px;
  height: 80px;
  background-color: rgb(236, 128, 128,0.3);
} */

#sys1_panel_4  p img{
  margin-top: -50px;
  margin-left: -9px;
}

/* #sys1_panel_4 .rollingNumber .TextAnimate span{
  display: block;
  border: 1px solid #009ffd;
  padding: 10px;
} */

#sys4_panel_3 .rollingNumber{
  margin-top: 3vh!important;
}
.rollingNumber{

    display: flex;
    margin: 2px 4px 0 4px; /*上右下左*/

    height: 100%;
    align-items: center;
    justify-content: center;
    /* color: #89eaff; */
    color: rgb(97, 97, 97,0);
    font-size: 30px;
    font-weight: bold;
}
.rollingNumber i{
    /* width:30px; */
    /* height:60px; */
    /* display:inline-block; */
    /* background: url(../images/number.png) no-repeat; */
    /* background-position:0 0; */
}
.rollingNumber>div:nth-last-child(3n){
    padding-left: 20px;
    position: relative;
}
.rollingNumber>div:nth-last-child(3n) i::before{
    content: "�?";
    color: #ffba25;
    font-weight: bold;
    font-size: 30px;
    width: 100%;
    position: absolute;
    bottom: 10px;
    left: -3px;
}
.m-xz8Xz{
    position: absolute;
    top: 40px;
    left: 40px;
    z-index: 3;
    display: none;
}
.m-xz8 {
    width: 100px;
    height: 100px;
    z-index:8;
    filter:alpha(opacity=50);  /*支持 IE 浏览�?*/
    -moz-opacity:0.50; /*支持 FireFox 浏览�?*/
    opacity:0.50;  /*支持 Chrome, Opera, Safari 等浏览器*/
    background: no-repeat url("../images/gif-4.png") left top;
    background-size: 100% 100%;
    border-radius: 25px;
    transition:all .20s;
    animation:rotate 20s infinite linear;

}
.m-xz9 {
    width: 100px;
    height: 100px;
    position:absolute;
    top: 0px;
    z-index:8;
    filter:alpha(opacity=70);  /*支持 IE 浏览�?*/
    -moz-opacity:0.70; /*支持 FireFox 浏览�?*/
    opacity:0.70;  /*支持 Chrome, Opera, Safari 等浏览器*/
    background: no-repeat url("../images/gif-5.png") left top;
    background-size: 100% 100%;
    border-radius: 75px;
    transition:all .6s;
    -moz-animation:rotate 6s infinite linear;
    -webkit-animation:rotate 6s infinite linear;
    animation:rotate 6s infinite linear;
}
@keyframes rotate{
  100%{
    transform:rotate(0deg);
   }
   100%{
     transform:rotate(360deg);
   }
}
.bigData_decoration{
  position: fixed;
  width: 100vw;
  height: 100vh;
  z-index: 999;
  pointer-events: none;
}
.bigData_decoration .head_Title{
  width: 100%;
  position: absolute;
  left: 51.5%;
  top: 0%;
    transform: translateX(-50%)
}
.bigData_decoration .head_decoration{
    width: 34%;
    position: absolute;
    left: 50%;
    top: -15%;
    transform: translateX(-50%)
}
.bigData_decoration>img:nth-of-type(1){
  width: 276px;
  transform: rotate(90deg);
  position: absolute;
  left: -64px;
  top: 2px;
}
.bigData_decoration>img:nth-of-type(2){
  width: 276px;
    transform: rotate(180deg);
    position: absolute;
    top: 10px;
    right: -73px;
}
.bigData_decoration>img:nth-of-type(3){
  width: 276px;
  transform: rotate(0deg);
  position: absolute;
  left: -78px;
  bottom: -4px
}
.bigData_decoration>img:nth-of-type(4){
  width: 276px;
  transform: rotate(-90deg);
  position: absolute;
  right: -50px;
  bottom: -20px;
}


/* jsPanel */
.bg_map .crowded{
  bottom: 15%;
}
.bg_map{
  position: fixed;
  width: 100%;
  height: 100%;
}
.bg_map:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top: 0px;
  right: 0px;
  border-right: 0 solid #042466;
  border-bottom: 0px solid transparent;
  border-bottom-width: 30px;
  border-right-width: 30px;
  z-index: 999;
}
.bg_map::after {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  bottom: 0px;
  right: 0px;
  border-right: 0 solid #17365b;
  border-bottom: 0px solid transparent;
  border-bottom-width: 30px;
  border-right-width: 30px;
  z-index: 999;
  transform: rotate(90deg);
}
.bg_map>div:nth-of-type(2)::after {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  bottom: 0px;
  left: 0px;
  border-left: 0 solid #17365b;
  border-bottom: 0px solid transparent;
  border-bottom-width: 30px;
  border-left-width: 30px;
  z-index: 999;
  transform: rotate(-90deg);
}
.bg_map>div:nth-of-type(2)::before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top: 0px;
  left: 0px;
  border-left: 0 solid #042466;
  border-bottom: 0px solid transparent;
  border-bottom-width: 30px;
  border-left-width: 30px;
  z-index: 999;
}
iframe{
  width: 100%;
  height: 100%;
}
/* 底部导航 */
.row label{
    color: #999;
    margin: 0 0 5px 0;
    padding: 0;
    line-height: 30px;
    font-size: 13px;
    font-weight: normal;
}
.menu{
    padding: 10px;
    background: #303030;
    position: absolute;
    top: 0;
    left: 0;
    color: #fff;
    width: 315px;
}
.menu input, .menu select {
    background: rgba(0, 0, 0, 0.6);
    border: 1px solid #FFF;
    color: #FFF;
    padding: 2px 5px;
    width: 100px;
    float: right;
    margin-left: 10px;

}
.close{
    position: absolute;
    right: -25px;
    background: #303030;
    width: 50px;
    text-align: right;
    padding: 2px 10px 3px 0;
    cursor: pointer;
}
.menu-perspective{
    display: none;
}
/* 底部导航 */
/* 天气 */
.icon {
  position: relative;
  display: inline-block;
  width: 12em;
  height: 4em;
  font-size: 1em; /* control icon size here */
}
.row3 .icon {
  position: relative;
  /* display: inline-block; */
  display: none;
  width: 30%;
  height: 3em;
  font-size: 1em; /* control icon size here */
  transform: scale(0.5)
}
.cloud {
  color: lightskyblue;
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: 3.6875em;
  height: 3.6875em;
  margin: -1.84375em;
  background: currentColor;
  border-radius: 50%;
  box-shadow:
    -2.1875em 0.6875em 0 -0.6875em,
    2.0625em 0.9375em 0 -0.9375em,
    0 0 0 0.375em #fff,
    -2.1875em 0.6875em 0 -0.3125em #fff,
    2.0625em 0.9375em 0 -0.5625em #fff;
}
.cloud:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: -0.5em;
  display: block;
  width: 4.5625em;
  height: 1em;
  background: currentColor;
  box-shadow: 0 0.4375em 0 -0.0625em #fff;
}
.cloud:nth-child(2) {
  z-index: 0;
  background: #fff;
  box-shadow:
    -2.1875em 0.6875em 0 -0.6875em #fff,
    2.0625em 0.9375em 0 -0.9375em #fff,
    0 0 0 0.375em #fff,
    -2.1875em 0.6875em 0 -0.3125em #fff,
    2.0625em 0.9375em 0 -0.5625em #fff;
  opacity: 0.3;
  transform: scale(0.5) translate(6em, -3em);
  animation: cloud 4s linear infinite;
}
.cloud:nth-child(2):after { background: #fff; }

.sun {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2.5em;
  height: 2.5em;
  margin: -1.25em;
  background: darkorange;
  border-radius: 50%;
  box-shadow: 0 0 0 0.375em #fff;
  animation: spin 12s infinite linear;
}
.rays {
  position: absolute;
  top: -2em;
  left: 50%;
  display: block;
  width: 0.375em;
  height: 1.125em;
  margin-left: -0.1875em;
  background: #fff;
  border-radius: 0.25em;
  box-shadow: 0 5.375em #fff;
}
.rays:before,
.rays:after {
  content: '';
  position: absolute;
  top: 0em;
  left: 0em;
  display: block;
  width: 0.375em;
  height: 1.125em;
  transform: rotate(60deg);
  transform-origin: 50% 3.25em;
  background: #fff;
  border-radius: 0.25em;
  box-shadow: 0 5.375em #fff;
}
.rays:before {
  transform: rotate(120deg);
}
.cloud + .sun {
  margin: -2em 1em;
}

.rain,
.lightning,
.snow {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 3.75em;
  height: 3.75em;
  margin: 0.375em 0 0 -2em;
  background: none;
}

.rain:after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 1.125em;
  height: 1.125em;
  margin: -1em 0 0 -0.25em;
  background: #0cf;
  border-radius: 100% 0 60% 50% / 60% 0 100% 50%;
  box-shadow:
    0.625em 0.875em 0 -0.125em rgba(255,255,255,0.2),
    -0.875em 1.125em 0 -0.125em rgba(255,255,255,0.2),
    -1.375em -0.125em 0 rgba(255,255,255,0.2);
  transform: rotate(-28deg);
  animation: rain 3s linear infinite;
}

.bolt {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -0.25em 0 0 -0.125em;
  color: #fff;
  opacity: 0.3;
  animation: lightning 2s linear infinite;
}
.bolt:nth-child(2) {
  width: 0.5em;
  height: 0.25em;
  margin: -1.75em 0 0 -1.875em;
  transform: translate(2.5em, 2.25em);
  opacity: 0.2;
  animation: lightning 1.5s linear infinite;
}
.bolt:before,
.bolt:after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  margin: -1.625em 0 0 -1.0125em;
  border-top: 1.25em solid transparent;
  border-right: 0.75em solid;
  border-bottom: 0.75em solid;
  border-left: 0.5em solid transparent;
  transform: skewX(-10deg);
}
.bolt:after {
  margin: -0.25em 0 0 -0.25em;
  border-top: 0.75em solid;
  border-right: 0.5em solid transparent;
  border-bottom: 1.25em solid transparent;
  border-left: 0.75em solid;
  transform: skewX(-10deg);
}
.bolt:nth-child(2):before {
  margin: -0.75em 0 0 -0.5em;
  border-top: 0.625em solid transparent;
  border-right: 0.375em solid;
  border-bottom: 0.375em solid;
  border-left: 0.25em solid transparent;
}
.bolt:nth-child(2):after {
  margin: -0.125em 0 0 -0.125em;
  border-top: 0.375em solid;
  border-right: 0.25em solid transparent;
  border-bottom: 0.625em solid transparent;
  border-left: 0.375em solid;
}

.flake:before,
.flake:after {
  content: '\2744';
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -1.025em 0 0 -1.0125em;
  color: #fff;
  list-height: 1em;
  opacity: 0.2;
  animation: spin 8s linear infinite reverse;
}
.flake:after {
  margin: 0.125em 0 0 -1em;
  font-size: 1.5em;
  opacity: 0.4;
  animation: spin 14s linear infinite;
}
.flake:nth-child(2):before {
  margin: -0.5em 0 0 0.25em;
  font-size: 1.25em;
  opacity: 0.2;
  animation: spin 10s linear infinite;
}
.flake:nth-child(2):after {
  margin: 0.375em 0 0 0.125em;
  font-size: 2em;
  opacity: 0.4;
  animation: spin 16s linear infinite reverse;
}


/* Animations */

@keyframes spin {
  100% { transform: rotate(360deg); }
}

@keyframes cloud {
  0% { opacity: 0; }
  50% { opacity: 0.3; }
  100% {
    opacity: 0;
    transform: scale(0.5) translate(-200%, -3em);
  }
}

@keyframes rain {
  0% {
    background: #0cf;
    box-shadow:
      0.625em 0.875em 0 -0.125em rgba(255,255,255,0.2),
      -0.875em 1.125em 0 -0.125em rgba(255,255,255,0.2),
      -1.375em -0.125em 0 #0cf;
  }
  25% {
    box-shadow:
      0.625em 0.875em 0 -0.125em rgba(255,255,255,0.2),
      -0.875em 1.125em 0 -0.125em #0cf,
      -1.375em -0.125em 0 rgba(255,255,255,0.2);
  }
  50% {
    background: rgba(255,255,255,0.3);
    box-shadow:
      0.625em 0.875em 0 -0.125em #0cf,
      -0.875em 1.125em 0 -0.125em rgba(255,255,255,0.2),
      -1.375em -0.125em 0 rgba(255,255,255,0.2);
  }
  100% {
    box-shadow:
      0.625em 0.875em 0 -0.125em rgba(255,255,255,0.2),
      -0.875em 1.125em 0 -0.125em rgba(255,255,255,0.2),
      -1.375em -0.125em 0 #0cf;
  }
}

@keyframes lightning {
  45% {
    color: #fff;
    background: #fff;
    opacity: 0.2;
  }
  50% {
    color: #0cf;
    background: #0cf;
    opacity: 1;
  }
  55% {
    color: #fff;
    background: #fff;
    opacity: 0.2;
  }
}
/* 天气 */

.innerContainer {

  overflow: hidden;

}
.innerContainer .container ul {
  display: flex
}

.lyh_sys2 li {
  width: 25%;
}
.lyh_sys5 li {
  width: 25%;
}

.lyh_sys8 li {
  width: 25%;
}

.sideNav {
  color: #fff;
  background: #000;
  position: fixed;
  height: 100%;
  width: 120px;
  border-right: 5px solid #ffa500;
  transition: all 0.8s;
  left: -115px;
}

.sideNav:hover {
  transform: translateX(115px);
}

.sideNav ul {
  height: 100%;
}
.sideNav ul>div:first-of-type{
  display: none;
  background: url(../images/wap_menu.png) no-repeat center center;
  background-size: 75% 75%;
}


.sideNav li {
  height: 12.5%;
  font-size: 18px;
  text-align: center;
  position: relative;
  cursor: pointer;
}

.sideNav li p {
  position: relative;
  top: 60%;
}

.sideNav ul > li:nth-of-type(1) {
  background: url(../images/leftSlideNavLogo_01.png) no-repeat center top;
  background-size: 100% 100%;
}

.sideNav ul > li:nth-of-type(2) {
  background: url(../images/leftSlideNavLogo_02.png) no-repeat center top;
  background-size: 100% 100%;
}

.sideNav ul > li:nth-of-type(3) {
  background: url(../images/leftSlideNavLogo_03.png) no-repeat center top;
  background-size: 100% 100%;
}

.sideNav ul > li:nth-of-type(4) {
  background: url(../images/leftSlideNavLogo_04.png) no-repeat center top;
  background-size: 100% 100%;
}

.sideNav ul > li:nth-of-type(5) {
  background: url(../images/leftSlideNavLogo_05.png) no-repeat center top;
  background-size: 100% 100%;
}

.sideNav ul > li:nth-of-type(6) {
  background: url(../images/leftSlideNavLogo_06.png) no-repeat center top;
  background-size: 100% 100%;
}

.sideNav ul > li:nth-of-type(7) {
  background: url(../images/leftSlideNavLogo_07.png) no-repeat center top;
  background-size: 100% 100%;
}

.sideNav ul > li:nth-of-type(8) {
  background: url(../images/leftSlideNavLogo_08.png) no-repeat center top;
  background-size: 100% 100%;
}

.sideNav ul > li:nth-of-type(1):hover {
  background: url(../images/leftSlideNavLogoactive_01.png) #ffa500 no-repeat center top;
  background-size: 100% 100%;
  color: #000;
}

.sideNav ul > li:nth-of-type(2):hover {
  background: url(../images/leftSlideNavLogoactive_02.png) #ffa500 no-repeat center top;
  background-size: 100% 100%;
  color: #000;
}

.sideNav ul > li:nth-of-type(3):hover {
  background: url(../images/leftSlideNavLogoactive_03.png) #ffa500 no-repeat center top;
  background-size: 100% 100%;
  color: #000;
}

.sideNav ul > li:nth-of-type(4):hover {
  background: url(../images/leftSlideNavLogoactive_04.png) #ffa500 no-repeat center top;
  background-size: 100% 100%;
  color: #000;
}

.sideNav ul > li:nth-of-type(5):hover {
  background: url(../images/leftSlideNavLogoactive_05.png) #ffa500 no-repeat center top;
  background-size: 100% 100%;
  color: #000;
}

.sideNav ul > li:nth-of-type(6):hover {
  background: url(../images/leftSlideNavLogoactive_06.png) #ffa500 no-repeat center top;
  background-size: 100% 100%;
  color: #000;
}

.sideNav ul > li:nth-of-type(7):hover {
  background: url(../images/leftSlideNavLogoactive_07.png) #ffa500 no-repeat center top;
  background-size: 100% 100%;
  color: #000;
}

.sideNav ul > li:nth-of-type(8):hover {
  background: url(../images/leftSlideNavLogoactive_08.png) #ffa500 no-repeat center top;
  background-size: 100% 100%;
  color: #000;
}

.sideNav_active {
  background-color: #ffa500 !important;
  color: #000;
}

.sideNav_active1 {
  background: url(../images/leftSlideNavLogoactive_01.png) #ffa500 no-repeat center top !important;
  background-size: 100% 100% !important;
}

.sideNav_active2 {
  background: url(../images/leftSlideNavLogoactive_02.png) #ffa500 no-repeat center top !important;
  background-size: 100% 100% !important;
}

.sideNav_active3 {
  background: url(../images/leftSlideNavLogoactive_03.png) #ffa500 no-repeat center top !important;
  background-size: 100% 100% !important;
}

.sideNav_active4 {
  background: url(../images/leftSlideNavLogoactive_04.png) #ffa500 no-repeat center top !important;
  background-size: 100% 100% !important;
}

.sideNav_active5 {
  background: url(../images/leftSlideNavLogoactive_05.png) #ffa500 no-repeat center top !important;
  background-size: 100% 100% !important;
}

.sideNav_active6 {
  background: url(../images/leftSlideNavLogoactive_06.png) #ffa500 no-repeat center top !important;
  background-size: 100% 100% !important;;
}

.sideNav_active7 {
  background: url(../images/leftSlideNavLogoactive_07.png) #ffa500 no-repeat center top !important;
  background-size: 100% 100% !important;
}

.sideNav_active8 {
  background: url(../images/leftSlideNavLogoactive_08.png) #ffa500 no-repeat center top !important;
  background-size: 100% 100% !important;
}

.lyh_secActive {
  display: flex !important;
}

.innerContainer section {
  display: none;
  padding-top: 100px;
}

.innerContainer section li {
  margin: 0 10px;
}

.innerContainer section li > div > div {
  margin: 10px 0;
}

.jsPanel_page1,.jsPanel_page2,.jsPanel_page3,.jsPanel_page4,.jsPanel_page5,.jsPanel_page6,.jsPanel_page7,.jsPanel_page8,.jsPanel_page9,.jsPanel_page10,.jsPanel_page11{
  width: 100%;
  height: 90%;
  overflow: hidden;
  font-family: PFDinTextCondPro;
  /* background-color: rgb(0, 0, 0); */
}


#page11_panel_1 #sys11_panel_1{
  background: rgba(1, 11, 47, 0.85);
}
#sys11_panel_1 > .jsPanel_title {
  color: #4ed6f6;
  padding-left: 20px;


}
#sys11_panel_1 > .videoMonitor_content {
  color: #4ed6f6;


}

/* 城市归属地统�? */
.jsPanel_title{
  display: flex;
  align-items: center;
  white-space: nowrap;
  text-align: left;
  vertical-align:middle;
  /* width: 100%; */
  /* height: 10%; */
  font-size: 17px;
  font-weight: 700;
  font-family: PFDinTextCondPro;

}
.jsPanel_title>img{
  margin-left: 5px;
  display: block;
}

/* 售票�? */
.jsPanel_header_page1 {
  color: rgb(51, 103, 255);
  /* background-color: rgb(236, 226, 132); */
}

.jsPanel5_header_page3 {
  color: rgb(51, 103, 255);
  /* background-color: rgb(236, 226, 132); */
}

.jsPanel5_header_page4 {
  color: rgb(236, 226, 132);
  /* background-color: rgb(236, 226, 132); */
}

/* 售票�? */
.jsPanel_header_page2 {
  color: rgb(0, 255, 204);
  /* background-color: rgb(173, 236, 132); */
}

/* 车位�? */
.jsPanel_header_page3{
  color: rgb(255, 102, 0);
  /* background-color: rgb(251, 157, 94); */
}

/* 商户消费 */
.jsPanel_header_page3_2{
  margin-top: 0px;
  color: rgb(109, 1, 232);
  /* background-color: rgb(251, 157, 94); */
}

/* 第六页的商户消费 */
.jsPanel_header_page6_3{
  margin-top: 40px;
  color: rgb(109, 1, 232);
  /* background-color: rgb(251, 157, 94); */
}

/* 舆情量趋�? */
.jsPanel_header_page6{
  padding-left: 13%;
  color: #f0b600;
  /* margin-top: 30px; */
  /* background-color: rgb(132, 232, 236); */

}
.jsPanel_header_page7{
  color: rgb(53, 172, 247);
  /* background-color: rgb(132, 232, 236); */

}

.jsPanel2_header_page1{
  color: rgb(53, 172, 247);
}

.jsPanel2_header_page2{
  color: #00ffcc;
}
.jsPanel2_header_page3{
  color: #ee8006;
}
.jsPanel2_header_page4{
  color: #a4c319;
}
.jsPanel2_header_page5{
  color: #d64693;
}

/* 实时客流统计 */
.jsPanel_header_page8{
  color: rgb(53, 172, 247);
  /* background-color: rgb(224, 132, 236); */

}

/* 景区客流量数据查�? */
.jsPanel_header_page9{
  color: rgb(216, 71, 77);
  /* background-color: rgb(191, 236, 132); */

}




/*sys1_panel_9 景区客流量数据查�? 的样�?*/

#sys1_panel_9_chart {
  margin-top: 4%;
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: rgb(236, 133, 133,0);
}

.jsPanel_page9 {
  position: relative;
}

.htimg {
  position: absolute;
  top: 112px;
  left: 144px;
  z-index: -1;
}

.ht {
  width: 116px;
  height: 116px;
}
#page10_panel_1 .jsPanel-content.jsPanel-content-noheader{
  display: flex;
}
#sys10_panel_1{
  width: auto;
  flex: 2 1 0;
}

/* 整个情绪占比图（包括标题�? */
.sys10_panel_5{
  width: auto;
  flex: 1 1 0%;
  display: flex;
  flex-direction: column;
}
#sys10_panel_5{
  flex: 1;
}
.jsPanel10_header_page1{
  color: #00ffcc;
}



.jsPanel10_header_page4{
  color: #a4c319;
}



.jsPanel10_header_page5{
  color: #fb2123;
  padding-left: 168px;
}

.jsPanel10_header_page6{
  color: rgb(53, 172, 247);
}



/*第四页实时客流的样式*/
.jsPanel4_header_page1{
  color: rgb(48, 96, 240);
}

.jsPanel4_header_page2{
  color: rgb(120, 0, 255);
}

.jsPanel4_header_page3{
  color: rgb(1, 139, 149);
}

.jsPanel4_header_page4{
  color: rgb(255, 208, 116);
}

.jsPanel4_header_page5{
  color: rgb(1, 200, 243);
}




/*第九�? 游客行为的样�?*/
.jsPanel9_header_page1{
  color: rgb(49, 97, 243);
}

.jsPanel9_header_page2{
  color: rgb(107, 1, 232);
}

/* .jsPanel9_header_page3{
  color: rgb(1, 200, 243);
} */

.jsPanel9_header_page4{
  color: rgb(237, 195, 112);
}

.jsPanel9_header_page5{
  color: rgb(205, 67, 67);
}

.jsPanel9_header_page6{
  color: rgb(2, 189, 251);
}










#sys3_panel_2{
  height: 50%;
}
.dash_line_2{
   height:3px;
   background: linear-gradient(90deg, rgba(33, 69, 105, 0) 0%,rgba(33, 69, 105, 1) 20%,rgba(33, 69, 105, 1) 80%, rgba(33, 69, 105, 0) 100%)!important;
   background-size: 100% 100%;
   width: 80%;
   margin: 0 auto;
}
.dash_line_1{
  height:2px;
  background: linear-gradient(90deg, rgba(5, 43, 78, 0) 0%,rgba(5, 43, 78, 1) 20%,rgba(5, 43, 78, 1) 80%, rgba(5, 43, 78, 0) 100%)!important;
  background-size: 100% 100%;
  width: 80%;
  margin: 0 auto;
}
.kqzl{
  height: 50%;
}
.kqzl p{
  text-align: center;
  color: #fff;
  font-size: 24px;
  margin-bottom: 20px;
  margin-top: 20px;
}
.kqzl h1{
  text-align: center;
  color: #43c4d9;
  font-size: 50px;
  margin: 70px 0;
}

.jsPanel_page3:nth-of-type(2){
  height: 70%;
}
/*lyh_sys1-*/

.lyh_sys1 .container ul li:nth-of-type(1) {
  width: 26%;
}

.lyh_sys1 .container ul li:nth-of-type(2) {
  width: 46%;
}

.lyh_sys1 .container ul li:nth-of-type(3) {
  width: 26%;
}

.lyh_sys1 .container ul li:nth-of-type(1) > div > div {
  margin-bottom: 30px;
}

.lyh_sys1 .container ul {
  height: 100%;
}

.lyh_sys1 .container ul li > div {
  height: 100%;
}

.lyh_sys1 .container ul li > div > div {
  margin-bottom: 30px;
}
.jsPanel_page1_1{
  height: 20%;

  display: flex
}
.jsPanel_page1_1>div{
  margin: 20px 40px 0 0;
}
.jsPanel_page1_1>div{
  margin: 20px 40px 0 0;
}
.jsPanel_page1_1>div:first-of-type{
 position: relative;
 left: 15%
}
.jsPanel_page1_1>div:nth-of-type(2){
  position: relative;
  left: 20%
 }
.jsPanel_page1_1>div>p:first-of-type{
  font-size: 13px;
  color: #fff;
  margin-bottom: 20px;
}
.jsPanel_page1_1>div:first-of-type>p:last-of-type{
  font-size: 30px;
  color: #ff3163;
}
.jsPanel_page1_1>div:last-of-type>p:last-of-type{
  font-size: 30px;
  color: #0bffff;
}
.jsPanel_page1_2{
  height: 40%;
}
.jsPanel_page1_3{
  height: 40%;
}

#sys1_panel_4 h2{
  font-size: 50px;
  color: #ffba25;
  text-align: center;
  margin: auto 0;
  line-height: 100px;
  letter-spacing: 8px;
}
/* #sys1_panel_1{
  width: 409px;
  height: 287px!important;
}

#sys1_panel_2{
  width: 409px;
  height: 409px!important;
}
#sys1_panel_3{
  width: 409px;
  height: 466px!important;
}
#sys1_panel_4{
  width: 410px;
  height: 413px!important;
}
#sys1_panel_5{
  width: 410px;
  height: 286px!important;
}
#sys1_panel_5{
  width: 410px;
  height: 260px!important;
}
#sys1_panel_7{
  width: 410px;
  height: 447px!important;
}
#sys1_panel_8{
  width: 410px;
  height:233px!important;
} */


/*地图*/
.maphead {
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: absolute;
  left: 50%;
  width: 100%;
  transform: translateX(-50%) translateY(0%);
  z-index: 9;
}

.maphead .maptitle {
  min-width: 100px;
  height: 38px;
  line-height: 36px;
  background: url(../images/mapaddressbg.png) no-repeat center center;
  background-size: 100% 100%;
  font-size: 16px;
  color: #fff;
  padding: 0 10px;
}

.maphead .num {
  min-width: 300px;
  height: 60px;
  background: url(../images/pointnumbg.png) no-repeat center center;
  background-size: 100% 100%;
  color: #0ef2fb;
  line-height: 60px;
  font-size: 38px;
  letter-spacing: 3px;
  padding: 0 10px;
}

.maphead .videopoint {
  width: 30px;
  height: 30px;
  background: url(../images/videopointlogo.png) no-repeat center center;
  background-size: 100% 100%;
  cursor: pointer;
}

.map {
  position: relative;
  width: 100%;
  height: 100%;
  border: 1px solid #1b2026;
}


.mapnumber {
  display: -webkit-flex; /* Safari */
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  position: absolute;
  width: 100%;
  margin-bottom: 0;
  left: 0px;
  color: #ffffff;
  font-size: 24px;
  background: rgba(219, 104, 40, 0.6);
  height: 50px;
}

.crowded {
  font-size: 18px;
  position: relative;
  display: block;
  bottom: 0px;
  left: 0;
  width: 100%;
  color: #fff;
  background: rgba(0, 0, 0, 0);
  z-index: 1;
  height: 15%;
}


.crowded .crowdedbox {
  height: 100%;
  padding: 5px;
  margin: 0;
  flex-wrap: wrap;
  display: flex;
  justify-content: center;
  align-items: center;
}

.crowded .crowdedbox .msg, .crowded .crowdedbox .type, .crowded .crowdedbox .num {
  padding: 0;
  margin: 0;
}

.crowded ul {
  list-style: none;
}

.crowded .crowdedtitle {
  padding: 0;
  text-align: center;
  justify-content: center;
  display: flex;
  font-weight: bold;
  font-size: 14px;

}

.crowded .col-xs-10 {
  padding: 0;
  position: absolute;
}

.crowded .msg ul, .crowded .type ul, .crowded .num ul {
  display: flex;
  flex-wrap: nowrap;
  padding: 0;
  margin: 5px 0;
}

.crowded .type ul li {
  text-align: center;
  margin: 0 2px;
  font-size: 12px;
    padding: 4px 0;
}

.crowded .msg ul li, .crowded .type ul li, .crowded .num ul li {
  flex-grow: 1;

}
.crowded .msg ul li font:first-of-type{
  font-size: 14px;
}

.crowded .num ul li {
  position: relative;
  text-align: right;
}

.crowded .num ul li span {
  position: absolute;
  left: 0;
  top: 0;
}

.crowded .msg ul li span {
  display: inline-block;
  width: 10px;
  height: 10px;
  vertical-align: middle;
  border-radius: 50%;
  margin-right: 10px;
}

.crowded .msg ul li:last-child {
  text-align: right;
}

.crowded .type ul li.item01, .crowded .msg ul li span.item01 {
  background: #66d921;
}

.crowded .type ul li.item02, .crowded .msg ul li span.item02 {
  background: #85cb17;
}

.crowded .type ul li.item03, .crowded .msg ul li span.item03 {
  background: #f3c802;
}

.crowded .type ul li.item04, .crowded .msg ul li span.item04 {
  background: #ff8f35;
}

.crowded .type ul li.item05, .crowded .msg ul li span.item05 {
  background: #fc341e;
}

#userLogout{
    cursor: pointer;
}

/*lyh_sys2*/

.lyh_sys2 .container ul {
  height: 100%;
}

.lyh_sys2 .container ul li > div {
  height: 50%;
}

.lyh_sys2 .container ul li {
  margin: 30px 10px;
}

#practitioners > h1 {
  position: absolute;
  top: 1%;
  left: 8%;
  font-size: 17px;
  line-height: 30px;
  color: #0ef2fb;
  margin:0;
}
#practitioners > div {
  position: relative;
  margin-top: 50px;
  width: 50%;
  height: 30%;
  float: left;
}

#practitioners > div:nth-of-type(1) {background: url("../images/cyry.png") no-repeat;
  background-position: 50% 20%;background-size: 15%}
#practitioners > div:nth-of-type(2) {background: url("../images/cyry2.png") no-repeat;
  background-position: 50% 20%;background-size: 15%}
#practitioners > div:nth-of-type(3) {background: url("../images/cyry3.png") no-repeat;
  background-position: 50% 20%;background-size: 15%}
#practitioners > div:nth-of-type(4) {background: url("../images/cyry4.png") no-repeat;
  background-position: 50% 20%;background-size: 15%}

#practitioners > div > h1{
  font-size: 14px;
  color: #ffffff;
  margin:10px 0;
  text-align: center;
}
#practitioners > div > p{
  font-size: 22px;
  color: #a6aebf;
  text-align: center;
}
/*lyh_sys3*/
.lyh_sys3 .container ul li{
  width: 50%;
  background: url(../images/form_bg2.png) no-repeat;
  background-size: 100% 100%;

  padding: 52px 57px;
  position: relative;
}

body .jsPanel:nth-child(3n+0) .jsPanel-hdr{
  /* background: linear-gradient(90deg, rgba(78, 78, 68, 1) 0%, rgba(0, 0, 0, 1) 100%)!important; */
  background: linear-gradient(90deg, rgba(23, 56, 75, 1) 0%, rgba(0, 0, 1, 1) 100%);
}
body .jsPanel:nth-child(3n+1) .jsPanel-hdr{
  background: linear-gradient(90deg, rgba(23, 56, 75, 1) 0%, rgba(0, 0, 1, 1) 100%);
}
body .jsPanel:nth-child(3n+2) .jsPanel-hdr{
  /* background: linear-gradient(90deg, rgba(49, 40, 75, 1) 0%, rgba(0, 0, 1, 1) 100%)!important; */
  background: linear-gradient(90deg, rgba(23, 56, 75, 1) 0%, rgba(0, 0, 1, 1) 100%);
}


.jsPanel_page3{
  display: flex;
}
.jsPanel_page3:first-of-type{


  background-size: 100% 100%;
  color: #fff;
  padding: 40px 10px;
  position: relative;
}
.jsPanel_page3 .row1>img{
  width: 100%;
  height: 100%;
}
.jsPanel_page3 .row1 .weatherIcon {
  width: 100px;
  height: 100px;
  margin: 0 auto;
  background-position: 50% 50%;
}
.jsPanel_page3 .row3 .weatherIcon {
  width: 47px;
  height: 48px;
  background-size: 100% 100%;
  background-position: 50% 50%;
}
.jsPanel_page3 .row1{
  display: flex;
  height: 40%;
}
.jsPanel_page3 .row2{
  display: flex;
  padding: 0 7%;
}
.jsPanel_page3 .row2 p{
  text-align: center;
  width: 25%;
}
.jsPanel_page3 .row2 p>span:first-of-type{
  color: #93caff;
  font-size: 18px;
  display: block;
  margin-bottom: 12px;
}
.jsPanel_page3 .row2 p>span:nth-of-type(2){
  font-size: 30px;
}
.jsPanel_page3 .row2 p> i{
  font-size: 16px;
  margin-left: 10px;
}
.jsPanel_page3 .row1>div{
  width: 50%;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.jsPanel_page3 .row1 div:last-child{
  text-align: left;
}
.jsPanel_page3 .row1 div img{
  width: 50%;
  text-align: center;
}
.jsPanel_page3 .row1 div >p:first-of-type{
  color: #93caff;
  font-size: 16px;
  margin-bottom: 20px;
}
.jsPanel_page3 .row1 div >p:first-of-type i{
  margin-right: 12%;
}
.jsPanel_page3 .row1 div >p:nth-of-type(2)>font:nth-of-type(1){
  font-size: 127px;
  color: #00f4fd;
  letter-spacing: 2px;
}
.jsPanel_page3 .row1 div >p:nth-of-type(2)>font:nth-of-type(2){
  font-size: 65px;
  color: #00f4fd;
}
.jsPanel_page3 .part_one{
  flex: 2 1 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.jsPanel_page3 .row3 {
  flex: 1 1 0;
  font-size: 14px;
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.jsPanel_page3 .row3>div{
  float: left;
  background: url(../images/weather_bg.png) no-repeat;
  background-size: 100% 100%;
  width: 85%;
  display: flex;
  align-items: center;
  position: relative;
  flex: 1;
  margin-bottom: 10px;
}
.jsPanel_page3 .row3>div:last-child{
  margin-bottom: 0px;
}
.jsPanel_page3 .row3 div img{
  width: 20%;
  top: 10%;
  position: relative;
  height: 80%;
}
.jsPanel_page3 .row3>div>div:first-of-type{
  width: 25%;
  text-align: center;
}
.jsPanel_page3 .row3>div>div>p:nth-of-type(1){
  font-size: 18px;
}
.jsPanel_page3 .row3>div>div>p:nth-of-type(2){
  font-size: 15px;
  margin-top: 5px;
}
.jsPanel_page3 .row3>div>div:last-of-type{
  width: 50%;
  position: relative;
  margin-left: auto;
  text-align: center;
}
/*lyh_sys4-*/
#sys1_panel_9{
  display: flex;
  flex-direction: column;
  padding: 18px;
}
#sys1_panel_9>div{
  flex: 1;
  display: flex;
}
#sys1_panel_9>div:first-of-type .dash_line_1,#sys1_panel_9>div:first-of-type .dash_line_2{
  display: none;
}
#sys1_panel_9>div>.name{
  flex: 1;
  color: #c3c3c3;
  margin: auto 0;
  font-size: 14px;
  padding-right: 20px;
}
#sys1_panel_9>div:nth-of-type(1)>.name{
  font-size: 21px;
    color: #fff;
}


#sys1_panel_9>div>.sum{
  width: fit-content;
  color: #fff;
  margin: auto 0;
}
#sys1_panel_9>div:nth-of-type(1)>.sum{
  font-weight: bold;
    font-size: 20px;
}
#sys1_panel_9 .dash_line_1{
  position: absolute;
  width: 90%;
}
#sys1_panel_9 .dash_line_2{
  position: absolute;
  width: 90%;
}
#sys4_panel_5{
  display: flex;
  flex-direction: column;
  padding: 18px;
}
#sys4_panel_5>div{
  flex: 1;
  display: flex;
}
#sys4_panel_5>div:first-of-type .dash_line_1,#sys4_panel_5>div:first-of-type .dash_line_2{
  display: none;
}
#sys4_panel_5>div>.name{
  flex: 1;
  color: #c3c3c3;
  margin: auto 0;
  font-size: 14px;
  padding-right: 20px;
}
#sys4_panel_5>div:nth-of-type(1)>.name{
  font-size: 21px;
    color: #fff;
}


#sys4_panel_5>div>.sum{
  width: fit-content;
  color: #fff;
  margin: auto 0;
}
#sys4_panel_5>div:nth-of-type(1)>.sum{
  font-weight: bold;
    font-size: 20px;
}
#sys4_panel_5 .dash_line_1{
  position: absolute;
  width: 90%;
}
#sys4_panel_5 .dash_line_2{
  position: absolute;
  width: 90%;
}
.lyh_sys4 .container ul li:nth-of-type(1) {
  width: 26%;
}

.lyh_sys4 .container ul li:nth-of-type(2) {
  width: 46%;
}

.lyh_sys4 .container ul li:nth-of-type(3) {
  width: 26%;
}

.lyh_sys4 .container ul li:nth-of-type(1) > div > div {
  margin-bottom: 30px;
}

.lyh_sys4 .container ul {
  height: 100%;
}

.lyh_sys4 .container ul li > div {
  height: 100%;
}

.lyh_sys4 .container ul li > div > div {
  margin-bottom: 30px;
}





/*lyh_sys5*/

.lyh_sys5 .container ul {
  height: 100%;
}

.lyh_sys5 .container ul li > div {
  height: 45%!important;
}

.lyh_sys5 .container ul li > div {
  margin: 10px 0px;
}





/*lyh_sys6*/

.lyh_sys6 .container ul {
  height: 100%;
}
.lyh_sys6 .container ul li {
  width: 60%;
  height: 40%;
}
.lyh_sys6 .container ul li > div {
  width: 100%;
  height: 100%;
}



/*lyh_sys7*/

.lyh_sys7 .container ul {
  height: 100%;
}
.lyh_sys7 .container ul li {
  width: 60%;
  height: 40%;
}
.lyh_sys7 .container ul li > div {
  width: 100%;
  height: 100%!important;
}


/*lyh_sys8*/

#sys9_panel_3{
  height: 85%;

}
.sys9_panel_3_tip{
  font-size: 13px;
  position: absolute;
  width: 88%;
  left: 50%;
  top: 5%;
  transform: translateX(-50%);
}
.sys9_panel_3_tip>div{
  float: left;
  margin: 5px 10px;
  color:#ddd
}
.lyh_sys8 .container ul {
  height: 100%;
}

.lyh_sys8 .container ul li {
  height: 50%;
}

.lyh_sys8 .container ul li {
  margin: 30px 10px;
  position: relative;
}

.jsPanel_page8 {

  background-size: 100% 100%;
  height: 100%;
  justify-content: center;
  align-items: center;

}

/* .jsPanel_page8 > div{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  max-width: 550px;
  max-height: 400px;
} */



.jsPanel-content.jsPanel-content-noheader{
      overflow-x: hidden!important;
    overflow-y: hidden!important;
}

.NumberBox{
  float: left; width:44px
}
.ssykrs{
  padding-left: 10px;
  cursor: pointer;
  float: left;
  width: 22%;
  font-size: 14px;
  font-weight: bold;
}

.jsPanelWeatherPic{
    display: block;
    height: 100%;
    margin: 0 auto;
}
.loading{
    position: absolute;
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #111;
    z-index: 1000;
}
.tdt-bottom .tdt-control-copyright{
    display:none!important;
}
.loading canvas{
    width: 100%;
    height: 100%;
}
.clearfix:after {visibility: hidden;display: block;font-size: 0;content: ".";clear: both;height: 0;}

.inrow>li,.inrow span{display:inline-block;font-size:14px;letter-spacing:normal;word-spacing:normal; }
.dataNums{
    display: flex;
    font-family: PFDinTextCondPro;
    width:100%;
    height:100%;
    align-items:center;
    justify-content: center
}
.dataNums .dataOne{
    width: 12%;
    height: 55%;
    max-width: 72px;
    min-width: 55px;
    max-height: 90px;
    min-height: 80px;
    text-align: center;
}
.dataNums .dataBoc {position: relative; width: 100%; height: 100%; overflow: hidden;}
.dataNums .dataBoc .tt ,.dataNums .dataBoc .ttt{position: absolute; top: 0;  left: 0; width: 100%;  height: 100%;}
.dataNums .tt span,.dataNums .ttt span{
    width:100%;
    height:100%;
    font-size:80px;
    font-weight:bold;
    color:#ffba25;
}
.dataNums .tt span,.dataNums .ttt span:nth-of-type(n+10){
  /* display: ; */
}

.rollingNumber .dataNums .dataOne:nth-last-child(3n){
    margin-left: 30px;
    position: relative;
}
.rollingNumber .dataNums .dataOne:nth-last-child(3n)::before {
    content: "�?";
    color: #ffba25;
    font-weight: bold;
    font-size: 80px;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom:calc(-0%);
    left: -100%;
    margin-left: 17%;
}
.bigData_header .pc_img{
    display: block;
}
.bigData_header .wap_img{
    display: none;
}
.lightPillar{
    width: 6px;
    height: 50px;
    position: absolute;
    box-sizing: border-box;
    position: relative;
    transform-style: preserve-3d;
    animation: rotateanimation 8s ease;
    animation-iteration-count: 1;
    animation-timing-function: linear;
    transform-origin: 50% 50%;
    animation-fill-mode: forwards;
    transform: rotateX(-60deg) rotateY(35deg) translateY(120px);
   /* animation: cycle222 2s infinite;
    background-image: radial-gradient(circle at 50% -26px, rgba(243, 217, 44, 0.85) 48%, rgba(255,255,255,0) 65%), linear-gradient(-86deg, rgba(0,0,0,0.09), rgba(255,255,255,0) 62%, rgba(255,255,255,0) 50%, rgba(224, 234, 12, 0.8) 100%);
    border-top-left-radius: 125px 75px;
    border-top-right-radius: 125px 75px;
    border-bottom-left-radius: 125px 75px;
    border-bottom-right-radius: 125px 75px;
    box-shadow: 3px 4px 8px -3px rgb(109, 138, 61)*/
}
@keyframes rotateanimation{
    0%{
        transform: rotateX(-60deg) rotateY(35deg) translateY(120px);
    }
    100%{
        transform: rotateX(-60deg) rotateY(350deg) translateY(-620px);
    }
}
.lightPillar .face{
    position: absolute;
    box-shadow: 0 0 2px #6feadb;
    animation: disappear 8s ease 1;
    animation-fill-mode: forwards;
}
@keyframes disappear {
    70%{
        opacity: 1;
    }
    100%{
        opacity: 0;
    }
}
.lightPillar .borderTop,.lightPillar .borderBottom{
    width: 6px;
    height: 8px;
    border-radius: 3px;
}
.lightPillar .borderLeft,.lightPillar .borderRight,.lightPillar .borderBefore,.lightPillar .borderAfter{
    width: 6px;
    height: 50px;
}
.lightPillar .borderTop{
    transform: rotateX(90deg) translateZ(2px);
    background: #0b4587;
}
.lightPillar .borderLeft{
    transform: rotateY(270deg) translateZ(3px);
    background: #0b4587;
}
.lightPillar .borderRight{
    transform: rotateY(90deg) translateZ(3px);
    background: #0b4587;
}
.lightPillar .borderBottom{
    transform: rotateX(270deg) translateZ(44px);
    background: #0b4587;
}
.lightPillar .borderBefore{
    transform: translateZ(3px);
    background: #0b4587;
}
.lightPillar .borderAfter{
    transform: translateZ(-3px);
    background: #0b4587;
}
.slideSurface{
    position:absolute;
    width: 85vw;
    height: 100vh;
    top: 0px;
    left: 0;
    transform: translateX(-120vw) skewX(-30deg);
    background-image: linear-gradient(to right,rgba(255, 255, 255, 0.2) 0,rgba(255, 255, 255, 0.34) 75%,rgba(255, 255, 255, 0.2) 100%);/*linear-gradient渐变效果*/
    -webkit-filter: blur(60px);
    filter: blur(60px);
    animation: slideSurface 18s ease infinite;
}
.videoMonitor_content{
  width: 100%;
  position: relative;
  height: 100%;
  text-align: center;
  /* background: rgba(1, 11, 47, 0.85); */
  /* border: 1px solid rgba(4, 110, 158, 0.84); */
  z-index: 999;
  transition: all 0.6s;
  box-sizing: border-box;
  overflow-y: auto;
}
.videoMonitor_content::-webkit-scrollbar-thumb {
  background-clip: padding-box;
  background-color: rgb(32, 111, 134);
  border-radius: 8px;
}
.videoMonitor_content.show{
  transform: translateX(0%);
}
.videoMonitor_content .title{
  padding:0px 1.5vw 10px;
  color: #0bffff;
  font-size: 16px;
  font-weight: bold;
  text-align: left;
}
.videoMonitor_content ul{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.videoMonitor_content ul li{
  width: 100%;
  color: #fff;
  font-size: 15px;
  padding: 10px 1.5vw;
  cursor: pointer;
  display: flex;
}
.videoMonitor_content ul li span{
  font-size: 16px;
  color: #4ed6f6;
}
.videoMonitor_content ul li p{
  width: 100%;
  padding-left: 20px;
  /* background: url(../images/map_camear.png) no-repeat 0 center; */
  background-size: 16px 20px;
  text-align: left;
  color: #fff;
}
.videoMonitor_content ul li:hover,.videoMonitor_content ul li.cur{
  color: #0bffff;
  background: linear-gradient(90deg, rgba(23, 56, 75, 1) 0%, rgba(0, 0, 1, 1) 100%);
}
@keyframes slideSurface {
    65%{
        transform: translateX(-120vw) skewX(-30deg);
    }
    100%{
        transform: translateX(120vw) skewX(15deg);
    }
}



@media  only screen and (max-width: 3800px){
  .pageChange .streak {
    stroke-width: 200px;
  }
  .earthBox{
    left: 21%;
    top: 15%
  }
  .pwsj div{
    margin: 4vh auto;
  }
}

@media  only screen and (max-width: 2800px){
  .pageChange .streak {
    stroke-width: 160px;
  }
    .earthBox{
        left: 8%;
    }
    .pwsj div{
        margin: 4vh auto;
    }
    /*.dataNums .tt span,.dataNums .ttt span {
        font-size: 70px;
    }
    .rollingNumber .dataNums .dataOne:nth-last-child(3n)::before{
        font-size: 70px;
        bottom: 10%;
        left: -65%;
    }*/
}


@media  only screen and (max-width: 1920px){


  #sys1_panel_4 .rollingNumber{
    margin-top: 1.5vh!important;
  }



/* toggler-box底部按钮 */
  .toggler-box{
    height: 13px;
  }

  /* jsPanel-headerbar没找�? */
  .jsPanel-headerbar{
    height: 32px;
  }

  /* 都没找到 */
  .jsPanel-titlebar .jsPanel-title{
    font-size: 15px;
  }

  /* bigData_header顶部导航 */
  /* H_title大数据标�? */
    .bigData_header .H_title p{
        font-size: 24px;
    }
    .bigData_header{
        width: 100%;
        left: auto;
        transform: unset;
    }
    .bigData_header .H_title{
        width: 30.5%;
    }
    .bigData_header .H_weather{
        width:  24%;
    }
    .bigData_header .H_system{
        max-width:  27%;
    }
    .bigData_header .H_weatherContent .weatherItem p{
        font-size: 14px;
    }
    .bigData_header .H_weatherContent .weatherItem span {
        width: 12px;
        height: 16px;
        margin-right: 5px;
    }
    .bigData_header .H_weatherContent .weatherItem.allContralBtn span{
        width: 17px;
    }
    .bigData_header .H_systemContent .systemItem p{
        font-size: 14px;
    }
    #systemTime{
      font-size: 18px!important;
    }
    .bigData_header .H_systemContent .systemItem span {
        width: 12px;
        height: 16px;
        margin-right: 5px;
    }
  #systemTime{
    top: 2px;
  }
    #systemTime>img{
        width: auto;
        height: 12px;
    }

    #systemDate>img{
        width: auto;
        height: 8px;
    }
    .earthBox{
        top: 10%;
        left: 5.7%;
    }
    .markerInfoWin .title{
        font-size: 14px;
    }
    .markerInfoWin .winContent .textBox p{
        font-size: 14px;
    }
    .bigData_header .H_title .neon .text {
        font-size: 22px;
    }
    .dataNums .dataOne{
        min-width: 45px;
        max-height: 90px;
        min-height: 65px;
    }
    .dataNums .tt span,.dataNums .ttt span {
        font-size: 60px;
    }
    .rollingNumber .dataNums .dataOne:nth-last-child(3n)::before{
        font-size: 60px;

    }
  .pwsj h1{
    font-size: 15px;
  }
}
@media  only screen and (max-width: 1680px){
  .pick_date_box input{
    padding-left: 0
  }

  .jsPanel_title>img{
    width: 15vw!important;
  }
  .pwsj p font{
    font-size: 17px;
  }
  .pwsj h1 font{
    font-size: 33px;
  }

  .jsPanel_title {
    font-size: 16px;

  }
  #page1_panel_6 .jsPanel_title {
    padding-left: 18%;
  }
  .pwsj p{
    font-size: 12px;
  }
    .jsPanel_page1_1>div>p:first-of-type{
        margin-bottom: 10px;
    }
    .jsPanel_page1_1>div{
        margin-top: 10px;
    }
    .bigData_header .H_title p{
        font-size: 20px;
    }
    .bigData_decoration .head_decoration{
        top: -24%
    }
    .bigData_header .H_title .neon .text {
        font-size: 22px;
    }
    .dataNums .dataOne{
        min-width: 40px;
    }
    .dataNums .tt span,.dataNums .ttt span{
        font-size:50px;
    }
    .rollingNumber .dataNums .dataOne:nth-last-child(3n){
        margin-left: 22px;
    }
    .rollingNumber .dataNums .dataOne:nth-last-child(3n)::before{
        font-size: 50px;

    }
}
@media  only screen and (max-width: 1520px){
    .jsPanel-headerbar{
      height: 25px;
    }
    .jsPanel-titlebar .jsPanel-title{
      font-size: 15px;
    }
    .bigData_header img{
        height: 100%;
    }
    .bigData_header .H_title {
        height: 50px;
    }
    .bigData_header .H_weather{
        height: 50px;
    }
    .bigData_header .H_system {
        height: 50px;
    }
    .bigData_header .H_weather {
        width: 23%;
    }
    .bigData_header .H_system {
        max-width: 28%;
    }
    .bigData_header .H_title p{
        font-size: 18px;
    }
    .bigData_header .H_weatherContent .weatherItem span {
        width: 10px;
        height: 12px;
    }
    .bigData_header .H_systemContent .systemItem span {
        width: 10px;
        height: 12px;
    }
    .markerInfoWin .title{
        font-size: 12px;
    }
    .markerInfoWin .winContent .textBox p{
        font-size: 12px;
    }
    .dataNums .dataOne{
        width: 30px;
    }
    .dataNums .tt span, .dataNums .ttt span{
        font-size:45px;
    }
    .rollingNumber .dataNums .dataOne:nth-last-child(3n){
        margin-left: 12px;
    }
    .rollingNumber .dataNums .dataOne:nth-last-child(3n)::before{
        font-size: 45px;

    }
    .bigData_header .H_weatherContent .weatherItem p{
        font-size: 12px;
    }
    .bigData_header .H_systemContent .systemItem:nth-child(1) p{
        font-size: 12px;
    }
    .bigData_header .H_systemContent .systemItem p{
        font-size: 14px;
    }
    #systemTime{
      font-size: 14px!important;
    }
    #systemTime>img{
        width: auto;
        height: 10px;
    }
    #systemDate{
        bottom: 7px;
    }
    #systemDate>img{
        width: auto;
        height: 7px;
    }
    .jsPanel_title {
      font-size: 15px;
    }
    #page1_panel_6 .jsPanel_title {
      padding-left: 4%;
    }

}

@media  only screen and (max-width: 1441px){
  #sys1_panel_4 .rollingNumber{
    margin-top: -0.2vh!important;
  }

  .rollingNumber{
    margin: 2px 3px 0 4px; /*上右下左*/
}

}

/* 1280屏幕 */
@media  only screen and (max-width: 1320px){

  .spe{
    margin-top: 0;
  }

  .TextAnimate i{
    font-size: 40px;
    margin: 0 10px;
    color: #89eaff;
  }

  #sys1_panel_4 {
    margin-top: 0vw;
  }

  #sys1_panel_4 > h4 {
    margin-top: 0px;
  }

  #sys1_panel_4 p img {
    display: none;
    margin-top: 1.4vw;
    margin-left: -5px;
    /* transform: scale(0.6); */
    width: 323px;
  }


    .bigData_header .H_weather {
        width: 25%;
    }
    .bigData_header .H_system {
        max-width: 33%;
    }
    #systemTime>img{
        width: auto;
        height: 10px;
    }

    .bigData_header .H_title .neon .text {
        font-size: 18px;
    }
    .dataNums .dataOne{
        min-width: 35px;
        min-height: 50px;
    }
    .dataNums .tt span,.dataNums .ttt span{
        font-size:40px;
    }
    .rollingNumber .dataNums .dataOne:nth-last-child(3n){
        /* margin-left: 10px; */
        margin-left: 0;
    }
    .rollingNumber .dataNums .dataOne:nth-last-child(3n)::before{
        /* font-size: 40px;
        bottom: calc(5%);
        margin-left: 30%;
        line-height: 40px */
        font-size: 40px;
        bottom: 0;
        margin-left: 15px;
        line-height: 40px;
        width: 0;
        display: none;
    }
    .markerInfoWin{
        min-width: 280px;
        max-width: 280px;
    }
    .pwsj h1{
      font-size: 12px;
    }
    .pwsj h1 font{
      font-size: 25px;
    }
    .pwsj p font{
      font-size: 15px;
    }
    .jsPanel_title {
      font-size: 14px;
    }
    #page1_panel_6 .jsPanel_title {
      padding-left: 2%;
    }

  #sys10_panel_1 .itemBox .__item .number .total{
    font-size: 25px;
  }
  #sys10_panel_1 .itemBox .__item .number .tips{
    font-size: 12px;
  }
.jsPanel_page8 #weixin {

  width: 180px;
  height: 180px;
  background: url(../images/wxfsBg.png) no-repeat ;
  background-position: center center;
}
.jsPanel_page8 #weibo {

  width: 180px;
  height: 180px;
  background: url(../images/wbfsBg.png) no-repeat ;
  background-position: center center;
}
.jsPanel_page8 #dianshang {
  width: 180px;
  height: 180px;
  background: url(../images/lytphyBg.png) no-repeat ;
  background-position: center center;
}
.jsPanel_page8 #nianka {
  width: 180px;
  height: 180px;
  background: url(../images/lyxhhyBg.png) no-repeat ;
  background-position: center center;

}
/* #page8_panel_3{
  margin-left:-100px;
}*/
#page8_panel_4{
  margin-left:0px;
}
.jsPanel_page3 .row1 div >p:nth-of-type(2)>font:nth-of-type(1) {
    font-size: 100px;
  }
  .jsPanel_page3 .row3>div>div>p:nth-of-type(1) {
    font-size: 16px;
  }
  .jsPanel_page3 .row3>div>div>p:nth-of-type(2) {
    font-size: 12px;
    margin-top: 4px;
  }

  .jsPanel_page3 .row3 .weatherIcon {
    width: 35px;
    height: 36px;
  }




  /* 商户消费 */
  #sys6_panel_3 h5{
    font-size: 16px;
    margin-left: 4%;
    color: rgb(255, 255, 255);
  }



  #sys6_panel_3 h5 span{
    font-size: 22px;
    color: rgb(243, 155, 41);
  }

  #sys6_panel_3 h6{
    margin-left: 4%;
    font-size: 16px;
    margin-top: 20px;
    color: rgb(255, 255, 255);
  }

/* 售票�? */
  #sys1_panel_1 h3 span{
    font-size: 24px!important;
  }

  #sys1_panel_1>h3{
    font-size: 17px!important;
    color: rgb(255, 255, 255);
  }

  #sys1_panel_1>h4{
    font-size: 15px!important;
    color: rgb(255, 255, 255);
  }

  #sys5_panel_3 h3 span{
    font-size: 24px!important;
  }

  #sys5_panel_3>h3{
    font-size: 17px!important;
    color: rgb(255, 255, 255);
  }

  #sys5_panel_3>h4{
    font-size: 22px!important;
    color: rgb(255, 255, 255);
  }

  .rollingNumber .TextAnimate span .on img{
    width: 100%!important;
    height: 93px;
  }

    /* 这是调男女游客数框的大小 */
    #sys1_panel_7 >div>div:nth-of-type(1) {
      width: 234px;
  }

    #sys1_panel_7 >div > div:nth-of-type(2){
      width: 240px;
      height: 60px;
      position: relative;
    }

    .man_left {
      margin-left: -20px;
  }

  /* 售票�? */

  #sys1_panel_2 h3 span{
    font-size: 24px!important;
  }

  #sys1_panel_2>h3{
    font-size: 17px!important;
    color: rgb(255, 255, 255);
  }

  #sys1_panel_2>h4{
    font-size: 15px!important;
    color: rgb(255, 255, 255);
  }


/* 车位�? */
  #sys1_panel_3>h4{
    float: left;
    margin-right: 100px;
    font-size: 16px!important;
    color: rgb(255, 255, 255);
  }

  #sys1_panel_3 h4 span{
    font-size: 20px!important;
    color: rgb(243, 155, 41);
  }






  /* 商户消费 */

    #sys1_panel_3 h5{
    font-size: 15px!important;
    margin-top: 5px!important;
    color: rgb(255, 255, 255);
  }

  #sys1_panel_3 h5 span{
    font-size: 30px!important;
    font-weight: 600;
    color: #00f4fd;
  }

  #sys1_panel_3 h6{
    font-size: 15px!important;
    margin-top: 0!important;
    color: rgb(255, 255, 255);
  }


/* 首页大屏�? */
  .spl_box{
    transform-origin: 0 0;
    transform: scale(0.7);
  }

  .spe_box{
    transform-origin: 0 0;
    transform: scale(0.7);
  }

  .pm{
    transform-origin: 0 0;
    transform: scale(0.7);
  }

/* 首页全部隐藏�? */

  .spl2{
    height: 110px;
  }

  .spe2{
    height: 110px;
    margin-top: 20px;
  }


  .spl2>div{
    transform: scale(0.61)!important;
    transform-origin: 0 0;
  }



  .spe2>div{
    transform: scale(0.61)!important;
    transform-origin: 0 0;
  }


}


/*手机端屏�?*/
@media screen and (max-width: 768px) {
  /*手机端中，所有的视频监控都删�?*/
  #spjk{
    display: none;
  }
  #dock-menu-wrapper.tb #dock-menu-list li:nth-child(5){
    display: none;
  }

  #sys10_panel_3{
    pointer-events: none;
  }
  /* .rightData-box {
    left: 50%;
    transform: translateX(-50%);
  } */

  .rightData-box{
    display: none;
  }

  /* #page1_panel_4{
    margin-top: 10vh;
  } */
  #ewm_alter{
    display: none;
  }


  /* .rollingNumber{
    margin-top: -20px;
  } */

  #page1_panel_5{
    margin-top: 0vh;
  }
  .bigData_header .H_title .color-btns {
    display: none;
}

  #dock-menu-wrapper.tb #dock-menu-list >li:last-of-type{
    display: none;
}
  .jsPanel-controlbar{
    display: none!important;
  }
  .pick_date_box input{
    font-size: 10px;
  }
  .pick_date_box button{
    font-size: 10px;
  }
  .jsPanel_page3 .row2{
    font-size: 12px;
  }
  .jsPanel_page3 .row2 p>span:nth-of-type(2){
    font-size: 12px;
  }
  .jsPanel_page3 .row1{
    font-size: 12px;
  }

  .jsPanel_page3:first-of-type{
    padding: 10px 5px;
  }
  .jsPanel_page3 .row3{
    font-size: 10px;
  }
  .jsPanel_page3 .row1 .icon{
    font-size: 10px;
  }
  .jsPanel_page4 .klltj>div{
    padding: 0 4%;
    margin: 8% 0;
  }
  .jsPanel_page4 .klltj>div>div:first-of-type{
    flex: 1;
  }
  .jsPanel_page4 .klltj>div>div:last-of-type{
    flex:2;
  }
  .jsPanel_page4 .klltj>div:last-of-type button{

    width: 20%;
    margin: 5px 3px;
  }
  .jsPanel_page4 .klltj>div:first-of-type button{
    float: left;
    width: 17%;
    margin: 4px 1.25%;
  }
  .jsPanel {
    position: relative!important;
    width: 94%!important;
    margin: 10px auto;
    top:unset!important;
    left:unset!important;
    right:unset!important;
    bottom: unset!important;
    z-index: 998!important;
  }

  #page1_panel_4,#page2_panel_1,#page3_panel_1,#page4_panel_3,#page5_panel_1,#page6_panel_1,#page7_panel_1,#page1_panel_4,#page8_panel_1,#page9_panel_1{
    margin-top: 50px;
  }


  .pwsj{
    text-align: center;
  }
  .jsPanel {
    position: relative!important;
    width: 94%!important;
    margin: 10px auto;
    left: auto!important;
    top: auto!important;
  }
  .jsPanel_hide{
      position: fixed!important;
      visibility: hidden;
  }
  #mapDiv{
      display: none;
  }
    body{
        background-color: #000723;
        overflow-y: auto;
        padding: 35px 0;
      -webkit-appearance:none;
    }

    .toggler-box{
        display: none;
    }

    .bigData_header .pc_img{
        display: none;
    }
    .bigData_header .wap_img{
        display: block;
    }
    .bigData_header .H_weather{
        display: none;
    }
    .innerContainer {
        position: fixed;
          overflow-y: auto;
          z-index: 999;
    }
    .bigData_header{
        position: unset;
    }
    .bigData_header .H_system{
        position: fixed;
        bottom: 10px;
        max-width: 95%;
        left: 50%;
        transform: translateX(-50%);
        width: 93%;
        height: 35px;
        z-index: 300;
        display: none;
    }
    .bigData_header .H_mask {
      display: none;
    }
    .bigData_header .H_systemContent .systemItem:nth-child(3) {
        width: 28vw;
        margin-left: 6vw;
    }
    .bigData_header .H_systemContent .systemItem p {
        font-size: 11px;
    }
    #systemTime{
      font-size: 12px!important;
      letter-spacing: 1px;
    }
    .bigData_header .H_systemContent .systemItem:nth-child(1) p i {
        margin: 0 5px;
    }
    .bigData_header .H_title {
        width: 100%;
        position: fixed;
        height: 35px;
        z-index: 99999999;
    }
    .bigData_header .H_title .neon .text {
        font-size: 16px;
    }
    .bigData_header .H_systemContent .systemItem:nth-child(2){
        display: none;
    }
    .bigData_header .H_systemContent .systemItem:nth-child(1) p {
        padding-left: 6%;
    }
    .H_weatherContent, .H_systemContent {
        height: 100%;
    }
    .NumberBox{
        font-size: 30px;
        width: 30px;
    }
    .sideNav ul>div:first-of-type{
        display: block;
        position: absolute;
        background-color: #ffa500;
        height: 31px;
        width: 39px;
        left: 100%;
        top: 20px;
    }


    /* 适配手机端新加的内容 */
    #indexbg,#innerbg{
      visibility: hidden;
    }

    /* 把云、柳枝隐藏，变成黑背�? */
    .movingCloud1,.movingCloud2,.movingCloud3,.movingCloud4,.liuzhi1,.liuzhi2,.liuzhi3{
      display: none;
    }


    #sys1_panel_6 > div{
      width: 105px;
      height: 89px;
      background: url(../images/yknltjBg.png) no-repeat;
      background-size: 100% 64%;
      position: relative;
      text-align: center;
      margin-right: 8px;

    }



    #sys1_panel_6 > div p{
      display: block;
      font-size: 26px;
      letter-spacing: -1px;
      color: rgba(255, 255, 255, 1);
      padding: 22px  0 14px;
    }




    #sys1_panel_7{
      display: flex;
      justify-content: center;
      margin-top: 20px;
    }

    #sys1_panel_7 >div>div:nth-of-type(1){
      width: 176px;
    }


    #man_1_7 {
      font-size: 20px;
      color: #33d3ae;
      margin-top: 0px;
    }

    #m_p_1_7 {
      font-size: 20px;
      color: #33d3ae;
      margin-top: 3px;
    }

    #women_1_7 {
      font-size: 20px;
      color: #b44152;
    }

    #w_p_1_7 {
      font-size: 20px;
      color: #b44152;
      margin-top: 3px;
    }



    /* 这是调男女游客数框的大小 */
    #sys1_panel_7 >div > div:nth-of-type(2){
      width: 176px;
      height: 60px;
      position: relative;
    }

    .man_left {
      margin-left: 0px;
    }

    .woman_right {
      margin-left: 13px;
    }

    /* 手机端微信粉丝数的文�? */
    .jsPanel_page8>div>div {
      position: absolute;
      margin-top: -15px;
      /* margin-left: 180px; */
      margin-left: 45%;
      /* background-color: #ff81c0; */
      /* border-top: 1px solid #8080806b; */
    }

    /* 实时舆情的排�? */

    .itemBox{
      position: relative;
    }

    .itemBox>.sys10_panel_1{
      position: absolute;
      top: 10px;
      left: 116px;
    }

    .itemBox>.sys10_panel_2{
      position: absolute;
      top: 150px;
      left: 116px;
    }



    .itemBox>.sys10_panel_3{
      position: absolute;
      top: 290px;
      left: 116px;
    }

    /* 整个情绪占比图（包括标题�? */
    .sys10_panel_5{
      position: absolute;
      width: 300px;
      height: 300px;
      top: 510px;
      left: -66px;
    }

    .jsPanel10_header_page5 {
      padding-left: 0px;
    }

    .jsPanel_title>img{
      width: 50vw!important;
    }

    .jsPanel2_header_page2 {
      margin-left: -30px;
    }

    #page2_panel_6{
      margin-left: 0px;
    }

    .tema { /* 温度 */
      font-size: 70px!important;
    }

    .temb {  /* �? */
      font-size: 60px!important;
    }

    .jsPanel_page3 {
      height: 100%!important;
      /* background-color: rgb(255, 176, 213,0.4); */
    }

    .jsPanel_page3 .row3 {
      position: absolute;
      display: inline;
      top: 300px;
      left: 66px;
      flex-direction: column;
      justify-content: space-between;
    }

    .jsPanel_page3 .part_one {
      flex: 2 1 0;
      /* display: flex; */
      height: 231px;
      flex-direction: column;
      justify-content: space-between;
     }

     .first_line{
       margin-top: 16px;
     }

     .jsPanel_page3 .row1 {
      display: flex;
      height: 55%;
      }

     .jsPanel_page3 .row2 {
      display: flex;
      padding: 0 7%;
      margin-top: 30px;
      }

      .second_line{
        margin-top: 29px;
      }

      .jsPanel_page3 .row1 div >p:first-of-type i {
        margin-right: 0%;
      }

      /* page8 会员数据 */
      .jsPanel_page8 > div {
        margin-left: 64px;
      }

      /* page10 情绪占比�? */
      #sys10_panel_5 {
        margin-left: 84px;
      }

      .sys10_panel_5 {
        left: 3px;
      }

      .jsPanel_page3 .row1>div{
        margin-left: -18px;
        width: 210px;
      }


      .spl_box{
        transform-origin: 0 0;
        transform: scale(0.75);
      }

      .spe_box{
        transform-origin: 0 0;
        transform: scale(0.75);
      }

      .pm{
        transform-origin: 0 0;
        transform: scale(0.75)!important;
      }




}

@media  only screen and (min-height: 1440px){

  .pwsj p{
    font-size: 18px;
  }
  .pwsj p font{
    font-size: 24px;
  }
  .pwsj h1{
    font-size: 26px;
  }
  .pwsj h1 font{
    font-size: 36px;
  }
  .pick_date_box button{
    font-size: 16px;
  }
  .pick_date_box input{
    font-size: 16px
  }
  .jsPanel_page4 .klltj>div p:nth-of-type(3){
    font-size: 24px;
  }
  .jsPanel_page4 .klltj>div p:nth-of-type(1){
    font-size: 24px;
  }
  .jsPanel_page4 .klltj>div p:nth-of-type(2){
    font-size: 36px;
  }
  .jsPanel_page4 .klltj>div button{
    font-size: 16px;
  }
  .jsPanel-controlbar{
    transform: scale(1.3);
    transform-origin: right;
  }
  .toggler-box svg{
    transform: scale(1.5)
  }
  .jsPanel-headerbar{
    height: 40px;
  }


}
@media  only screen and (min-height: 1920px){
  .pick_date_box button{
    font-size: 20px;
  }
  .pick_date_box input{
    font-size: 20px
  }
  .jsPanel_page4 .klltj>div p:nth-of-type(3){
    font-size: 30px;
  }
  .jsPanel_page4 .klltj>div p:nth-of-type(1){
    font-size: 30px;
  }
  .jsPanel_page4 .klltj>div p:nth-of-type(2){
    font-size: 48px;
  }
  .jsPanel_page4 .klltj>div button{
    font-size: 20px;
  }
  .jsPanel-controlbar{
    transform: scale(1.8);
    transform-origin: right;
  }
  .toggler-box svg{
    transform: scale(2)
  }
  .jsPanel-titlebar{
    font-size: 20px!important;
  }
  .jsPanel-headerbar{
    height: 45px;
  }
  .pwsj p{
    font-size: 22px;
  }
  .pwsj p font{
    font-size: 27px;
  }
  .pwsj h1{
    font-size: 30px;
  }
  .pwsj h1 font{
    font-size: 45px;
  }
  .earthBox{
    left: 21%;
    top: 15%
  }

}

@media  only screen and (max-height: 800px){
  .rightData-box #rightData_echart2 {
    width: 120%;
    transform: translate(-8%,-16%);
    height: 128%;
}

.rightData-box .data2 {
  margin-top: -24px;
  /* background-color: rgb(255, 255, 255,0.4); */
}

.zcw {
  margin-top: 0%;
  height: 130px;
}

.spl {
  height: 116px;
}

.spe {
  height: 200px;
}


  .liuzhi1{
    height: 35%;
  }
  .liuzhi2{
    height: 35%;
  }
  .liuzhi3{
    height: 35%;
  }
  .rightData-box {
    margin-top: -15px;
    padding-top: 18px;
    padding-left: 24px;
    padding-right: 24px;
    width: 335px;
    height: 160px;
    right: 22px;
    top: 80px;
  }
  .rightData-box.active{
    height: 583px;
  }
  .rightData-box h1 {
    font-size: 15px;
}

.echartBoard {
  transform: translateY(10vh) scale(0.765) ;
}
}


@media  only screen and (max-height: 750px){

  .pm{
    transform-origin: 0 0;
    transform: scale(0.66);
  }

}


/* 太原古城新加的CSS */
/* 售票�? */
#sys1_panel_1 {
  /* background-color: rgb(139, 245, 112,0.6); */
}


#sys5_panel_3 {
  background-color: rgb(139, 245, 112,0.0);
}

#sys5_panel_3 span{
  color: rgb(243, 155, 41);
}


#sys5_panel_3>h3{
  font-size: 22px;
  margin-left: 4%;
  padding: 10px 0;
  color: rgb(255, 255, 255);
}

#sys5_panel_3>h4{
  margin-left: 4%;
  padding: 10px 0;
  color: rgb(255, 255, 255);
}



/* 售票�? */
#sys1_panel_2 {
  /* background-color: rgba(226, 197, 66, 0.6); */
}


/* 车位�? */
#sys1_panel_3 {
  /* background-color: rgba(56, 234, 246, 0.6); */
}

#sys1_panel_3>h4{
  float: left;
  margin-right: 5%;
  margin-left: 0;
  font-size: 18px;
  color: rgb(255, 255, 255);
}

#sys1_panel_3>h4:nth-child(1)>span{
  font-size: 30px;
  font-weight: 700;
  color: rgb(48, 95, 238);
}

#sys1_panel_3>h4:nth-child(2)>span{
  font-size: 30px;
  font-weight: 700;
  color: rgb(255, 102, 0);
}



#sys1_panel_3 h5{
  font-size: 18px;
  margin-left: 0;
  color: rgb(255, 255, 255);
}

#sys1_panel_3 h5 span{
  font-size: 30px;
  font-weight: 600;
  color: #00f4fd;
}

#sys1_panel_3 h6{
  font-size: 15px;
  margin-top: 0px;
  margin: 10px 0;
  margin-left: 0;
  color: rgb(255, 255, 255);
}



#sys6_panel_3 h5{
  font-size: 16px;
  margin-left: 4%;
  color: rgb(255, 255, 255);
}



#sys6_panel_3 h5 span{
  font-size: 22px;
  color: rgb(243, 155, 41);
}

#sys6_panel_3 h6{
  margin-left: 4%;
  font-size: 16px;
  margin-top: 20px;
  color: rgb(255, 255, 255);
}






#sys1_panel_3 table{
  width: 468px;
  height: 300px;
  text-align: center;
  color: #00f4fd;
  border-collapse:collapse;
  /* border-right: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff; */
}

#sys1_panel_3 table td{
  width: 50%;
  border-left: 1px solid rgb(83, 152, 211);
  border-top: 1px solid rgb(83, 152, 211);
}

/* #sys1_panel_3 table td:nth-child(1){
  width: 80px;
} */

#sex-ratio-echarts,
#age-ratio-echarts,
#from-ratio-echarts{
  width: 100%;
  height: 100%;
  position: relative;
}

#sys6_panel_3 table{
  width: 468px;
  height: 167px;
  text-align: center;
  color: #00f4fd;
  border-collapse:collapse;
}

#sys6_panel_3 table td{
  border-left: 1px solid rgb(83, 152, 211);
  border-top: 1px solid rgb(83, 152, 211);
}

#sys6_panel_3 table td:nth-child(1){
  width: 80px;
}

/* 从业人员统计 */
/* #sys2_panel_3 {
  background-color: rgb(77, 246, 105,0.4);
} */

#sys5_panel_3 {
  width: 100%;
  height: 100%;
  /* background-color: rgb(0, 255, 128,0.4); */
}

#sys4_panel_4 {
  width: 100%;
  height: 100%;
  /* background-color: rgba(73, 250, 161, 0.4); */
}



/* 停车数据的css */

.jsPanel8_header_page1{
  color: rgb(47, 93, 235);
}

#sys8_panel_1{
  width: 100%;
  height: 80%;
  /* background-color: rgb(81, 92, 255,0.5); */
}

.jsPanel8_header_page3{
  color: rgb(1, 115, 129);
}

#sys8_panel_3{
  /* background-color: rgb(1, 115, 129,0.5); */
}

.jsPanel8_header_page2{
  color: rgb(109, 1, 232);
}

#sys8_panel_2{
  /* background-color: rgb(109, 1, 232,0.5); */
}

.jsPanel8_header_page4{
  color: rgb(236, 194, 122);
}

#sys8_panel_4{
  /* background-color: rgb(236, 194, 122,0.5); */
}

.jsPanel8_header_page5{
  color: rgb(1, 176, 214);
}

#sys8_panel_5{
  /* background-color: rgb(1, 176, 214,0.5); */
}

.jsPanel8_header_page6{
  color: rgb(197, 63, 63);
}

#sys8_panel_6{
  /* background-color: rgb(197, 63, 63,0.5); */
}



/* 首页左边三个改版 */

/* spl */
.spl_box{
  width: 468px;
  height: 167px;
  border-radius: 5px;
  margin-top: 5px;
  border: solid 1px rgb(87, 160, 255);
  background: url(../images/splbg.png);
  background-size: 100% 100%;
  transition: all 0.1s ease;
}

h2,h3{
  margin: 0;
  padding: 0;
}

/* 120  115 */

.spl{
  float: left;
  width: 155px;
  height: 128px;
  margin-top: 22px;
  text-align: center;
  cursor: pointer;
  /* background-color: rgba(251, 157, 157, 0.7); */
}

.spl>h2{
  color: white;
  font-size: 17px;
  font-weight: 500;
  /* transition: all ease 0.3s; */
}

.spl_logo{
  width: 21px;
  height: 24px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 17px;
  background: url(../images/spl_bai.png);
  background-size: 100% 100%;
}

.spl>h3{
  color: rgb(48, 95, 238);
  font-size: 16px;
  font-weight: 500;
  margin-top: 33px;
}

.spl>h3>span{
  color: rgb(48, 95, 238);
  font-size: 25px;
  font-weight: 700;
}

.bzspl{
  border-left: 1px solid rgb(87, 160, 255);
  border-right: 1px solid rgb(87, 160, 255);
}


.spl:hover h2{
  color: rgb(0, 209, 167);
}
.spl:hover h3{
  color: rgb(0, 209, 167);
}
.spl:hover h3>span{
  color: rgb(0, 209, 167);
}
.spl:hover .spl_logo{
  background: url(../images/spl_lv.png);
  background-size: 100% 100%;
}


/* spe */
.spe_box{
  width: 468px;
  height: 167px;
  border-radius: 5px;
  margin-top: 5px;
  border: solid 1px rgb(87, 160, 255);
  background: url(../images/splbg.png);
  transition: all 0.1s ease;
  background-size: 100% 100%;
}

h2,h3{
  margin: 0;
  padding: 0;
}

.spe{
  float: left;
  width: 155px;
  height: 128px;
  margin-top: 22px;
  text-align: center;
  cursor: pointer;
  /* background-color: rgba(251, 157, 157, 0.7); */
}

.spe>h2{
  color: white;
  font-size: 17px;
  font-weight: 500;
  /* transition: all ease 0.3s; */
}

.spe_logo{
  width: 24px;
  height: 24px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 17px;
  background: url(../images/spe_bai.png);
  background-size: 100% 100%;
}

.spe>h3{
  color: rgb(48, 95, 238);
  font-size: 16px;
  font-weight: 500;
  margin-top: 33px;
}

.spe>h3>span{
  color: rgb(48, 95, 238);
  font-size: 25px;
  font-weight: 700;
}

.bzspe{
  border-left: 1px solid rgb(87, 160, 255);
  border-right: 1px solid rgb(87, 160, 255);
}

.spe:hover h2{
  color: rgb(0, 209, 167);
}
.spe:hover h3{
  color: rgb(0, 209, 167);
}
.spe:hover h3>span{
  color: rgb(0, 209, 167);
}
.spe:hover .spe_logo{
  background: url(../images/spe_lv.png);
  background-size: 100% 100%;
}

.pm{
  width: 468px;
  height: 300px;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid rgb(83, 152, 211);
  background: url(../images/splbg.png);
  transition: ease 0.1s all;
  background-size: 100% 100%;
}

/* 首页全部显示上的改版 */
.spl2>div{
  transform: scale(0.77);
  transform-origin: 0 0;
}
.spe2>div{
  transform: scale(0.77);
  transform-origin: 0 0;
}


#page5_panel_2 .chooseYear,#page6_panel_1 .chooseYear,#page6_panel_2 .chooseYear,#page7_panel_2 .chooseYear,#page7_panel_3 .chooseYear{
  position: absolute;
  height: 28px;
  width: 60px;
  top: 10px;
  right: 52px;
  color: #fff;
  z-index: 999;
}

#sys5_panel_2{
  width: 100%;
  height: 100%;
}


#sys6_panel_1{
  width: 100%;
    height: 100%;
}
#sys6_panel_2{
  width: 100%;
    height: 100%;
}

.date-picker-box {
  padding: 6px 0;
  padding-left: 5%;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.date-picker {
  color: #000000;
  cursor: pointer;
  width: 100px;
  border: none;
  outline: none;
}

.jsPanel-date-picker-title {
  display: flex !important;
  align-items: center;
  /* justify-content: space-between; */
  justify-content: center
}

.jsPanel-date-picker-title .placeholder {
  width: 28%;
}

.date-picker-label {
  width: 170px;
  padding: 6px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  cursor: pointer;
  font-size: 16px;
  position: relative;
  left: 50%;
  font-weight: bold;
  transform: translateX(-50%);

  /* 🔹 核心毛玻璃效果 */
  background: rgba(255, 255, 255, 0.12); /* 半透明白 */
  backdrop-filter: blur(12px);           /* 背景模糊 */
  -webkit-backdrop-filter: blur(12px);   /* Safari 兼容 */

  /* 🖌️ 增强玻璃质感 */
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 
      0 8px 32px rgba(0, 0, 0, 0.15),
      inset 0 1px 0 rgba(255, 255, 255, 0.1),
      inset 0 -1px 0 rgba(0, 0, 0, 0.2);

  /* 可选：让文字更清晰 */
  -webkit-font-smoothing: antialiased;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}