.mapwrap{
    padding-bottom: 2.5rem;
    background-color: #FEFEFE;
  }
  .maptype{
    width: 2rem;
    height: 6rem;
    display: flex;
    flex-direction: column;
  position: absolute; 
    top:0.48rem;
    right:0.63rem;
    background: #fff;
    border-radius: 0.5rem;
    z-index: 111;   }
  .maptype div{
    height: 2rem;
    padding-left: 0.45rem;
    font-size: 0.55rem;
    font-weight: 400;
    color: #222;
    line-height: 0.75rem;
    padding-top: 0.3rem;
    box-sizing: border-box;

  
  }
  .maptype .active{
    background:#007EFB;
    color:#fff;
  }
  .maptype div:first-child{
    border-radius: 0.5rem 0.5rem 0 0;
  }
  .maptype div:last-child{
    border-radius:  0 0 0.5rem 0.5rem;
  }
  .timeline{
    z-index: 99;
    position: absolute;
    left:3.33%;
    bottom:0.73rem;
    height: 2.5rem;
    box-sizing: border-box;
    padding-left: 0.75rem;
    box-shadow: 0rem 0.25rem 0.35rem 0rem rgba(0,0,0,0.1);
       background: #ffffff;
   border-radius: 0.5rem;
   margin: auto;
   box-sizing: border-box;
   padding: 0.5rem;
   width: 93.33%;
   margin-top: 0.6rem;
  }
  /* 雷达反射率 */
  .radardiv{
   z-index: 99;
   position: absolute;
   left:3.33%;
   bottom:3.5rem;
   height: 3.5rem;
   box-sizing: border-box;
   padding-left: 0.75rem;
   box-shadow: 0rem 0.25rem 0.35rem 0rem rgba(0,0,0,0.1);
   background: #ffffff;
   border-radius: 0.5rem;
   margin: auto;
   box-sizing: border-box;
   padding: 0.5rem;
   width: 93.33%;
   margin-top: 0.6rem;
   width: 50%;
   display: none;
  }
  .radardiv p{
    font-size: 0.75rem;
    font-weight: 500;
  }
  .radardiv .colorul, .radardiv .numdiv{
    display: flex;
    margin-top: 0.3rem;
  }
  .radardiv .colorul li{
   width: 12%;
   height: 0.3rem;
   margin-right: 0.15rem;
  }
  .radardiv .numdiv li{
   width: 12%;
   font-size: 0.55rem;
   color: #000;
   font-weight: 500;
   margin-right: 0.15rem;
  }
  /* 雷达反射率结束 */
  .playicon{
    width: 1.25rem;
    margin-right:1.5rem;
    margin-top:0.53rem;
  }
  .timecontent{
    width: calc(100% - 3.8rem) ;
   
  }
  .timecontentinner{
    width:100%;
    display: flex;
  }
  .timecontent .cell{
    flex:1;
    height: 0.8rem;
    border-left: 0.03rem solid #666;
    position: relative;
  }
  .timecontent .cell::after{
    position: absolute;
    width: 0.03rem;height: 0.8rem;
    background: #666;
    right:0;top:0;
    display: block;
    content: '';
    
  }
  .timecontent .cell span{
   position: absolute;
   
    
    left:-0.8rem;bottom:-1.4rem;
    display: block;
    content: '';font-size: 0.65rem;

     font-weight: 400;
     color: #222;
     line-height: 0.93rem;
  }
  .timecontent .movewrap{
   position: absolute;
   left:-1.124rem;
   top:-1.15rem;
   width: 2.25rem;
   display: none;
  }
  .timecontent .moveline{
    width: 0.03rem;height: 1rem;background: #007EFB; display: block;
    margin-left:1.124rem;
   
  }
  .timecontent .moveTime{
    display: block;width: 2.25rem;
   height: 1rem;
   background: #007EFB;
   border-radius: 0.2rem; 
   font-size: 0.65rem;

     font-weight: 400;
     color: #FFF;
     line-height: 1rem;
     text-align: center;
  }
  .timecontent .cell i{
   position: absolute;
   
    
   right:-0.8rem;bottom:-1.4rem;
   display: block;
   font-size: 0.65rem;

    font-weight: 400;
    color: #222;
    line-height: 0.93rem;
  }
  .leftBar{
   position: absolute;
     /* top:0.48rem; */
     /* left:0.63rem; */
     /* bottom: 5%; */
     top: 3%;
     right: 0.65rem;
     z-index: 111;
  }
  .fanshelv{
     width: 1.5rem;
     
     font-size: 0.55rem;
     font-weight: 400;
     color: #222;
     line-height: 0.75rem;
     padding-left: 0;
     padding-right: 0;
     margin-bottom: 0.6rem;
     margin-top: 0;
  }
  .fanshelv img{
    width: 0.5rem;
    margin:0.28rem 0;
  }
  .scalcBtn{
     width: 1.5rem;
     margin-bottom: 0.6rem;
     margin-top: 0;
     padding-left: 0;
     padding-right: 0;
  }
  .scalcBtn img{
    width: 0.75rem;
  }
  .movelocation{
     width: 1.5rem;
     margin-bottom: 0.6rem;
     height: 1.5rem;
     margin-top: 0;
     padding: 0;
     border-radius: 50%;
     text-align: center;
     
  }
  .fullscreen{
   width: 1.5rem;
  
  }
  .movelocation img{
    width: 1.05rem;
  }
.mapFullScreen{
   position: fixed!important;
   top: 2.5rem!important;
   left: 0!important;
   width: 100%!important;
   height: calc(100% - 2.5rem)!important;
   z-index: 100;
}
.mapFullScreen #container{
 height: 100%!important;
}
.mapFullScreen .timeline {
 /* display: none!important; */
}
.mapFullScreen .radardiv {
 /* display: none!important; */
}
.borderfff{
  border-color:#fff!important;
}
.canvasWrap2 {
 width: 96%;
 margin: 0 auto;
height: 3.45rem;
 position: relative;

}
.canvasWrap2i{
   height: 2.8rem; 
}
  .precipitation-text {
   color: #000;
 
   font-size: 0.6rem;

   font-weight: 400;
   color: #222222;
   line-height: 1rem;
 }
 .precipitation-text  .bottomline{
   position: absolute;
   left:0.85rem; bottom:-0.05rem;
   width:calc(100% - 0.85rem);
   height: 1px;
   border-bottom:0.05rem dashed #ddd ;
 }
 .precipitation-text  .topline{
   position: absolute;
   left:0.85rem; top:0;
   width:calc(100% - 0.85rem);
   height: 1px;
   border-top:0.05rem dashed #ddd ;
 }
.forecastkeypoint{
          color: #222;
   display: block;
   font-size: 0.65rem;
   line-height: 1rem;
   padding: 0.43rem 0.5rem;
   border-radius: 0.5rem;
  width: 9rem;
  /* white-space: nowrap; */
   background: #fff;
}
.precipitation-time {
 padding-left: 1rem;
 padding-right: 0rem;
 display: flex;
 justify-content: space-between;
 margin-top: 0.5rem 0;

}
.precipitation-time span {
   color: #222;
 }
.dwyu {
   position: absolute;
   bottom: 0;
   left: 0;
   z-index: 9;
   width: 100%;
  
 }
   .dwyui{
        position: absolute;
   bottom: 0.15rem; 
   }
.dwyu img{width:0.6rem;margin-top:0rem;}
.dwyu   span {
     color: #000;
     font-size: 0.6rem;
   line-height: 1rem;
   margin-top: 0.15rem;
   
 
   }
  /* .dwyu  .precipitation-text{
  border-bottom: 0.05rem dashed #DDD;
  } */
  .dwyui span { line-height: 0.35rem;}
/* .dwyu   .dayu {
     border-top:  0.05rem  dashed #DDD;
   } */
.dwyui span{
   border-color: rgba(255,255,255,0.3)!important;
}
  .dwyui .precipitation-text {
      margin-left:0.7rem;
  }

 .dwyui img{
      margin-left:-0.9rem;
 }
   .forecastkeypointi{
           color: rgba(255,255,255,0.6);
   font-size: 0.5rem;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
   width: 100%;
   text-align: center;
   }
   .precipitation-timei .precipitation-text{
           color: rgba(255,255,255,0.6);
           font-size: 0.55rem;
           line-height: 0.55rem;
   } 
     .precipitation-timei {
         padding-left:1rem;
     }
/* 进度条 */
.Progressbar{
 width: 95%;
 height: 0.5rem;
 background: #ededed;
 position: absolute;
 z-index: 1;
}
.Progressbar-back{
 width: 2.75rem;
 height: 0.5rem;
 background: #007efb;
 position: absolute;
 z-index: 1;
}
.Progressbar-proceed{
 background: #007efb;
 position: absolute;
 height: 0.5rem;
 left: 3.2rem;
 z-index: 1;
}
.warnmap{
 width: 100%;
 height: 14rem;
}