.nav {
  padding-top:.2rem;
  padding-left:.1rem;
  display: flex;
  .free-use {
    background: #fff ;
    height:.5rem;
    font-size: .24rem;
    padding:.01rem .2rem;
    border-radius: .3rem;
    margin-right: .5rem;
    line-height: .5rem;
    color: #727171;
  }
  .hamburger {
    float: right;
    margin-top:.1rem;
    img {
      width:70%;
    }
  }
}
.logo-pic {
  width:3.6rem;
  height:.58rem;
  margin-right:.7rem;
}
.mask-nav {
  width:100%;
  padding-top: 0.2rem;
  padding-left: 0.1rem;
  padding-right: 0.25rem;
  background: rgba(0,0,0,0.9);
  position: fixed;
  color: #fff;
  top: 0rem;
  overflow: hidden;
  display: none;
  height:100%;
  .top {
    display: flex;
    justify-content: space-between;
    .logo-pic {
      margin-right: 3rem;
    }
    //.mask-close {
    //  font-size: 0.5rem;
    //  padding: 0 .2rem;
    //  //background: blue;
    //  line-height: .5rem;
    //  color: #fff;
    //}
    .mask-close {
      width:.5rem;
      height: .5rem;
      margin-top:.1rem;
    }
  }
  .nav-ul {
    font-size: .3rem;
    ul {
      display: flex;
      margin-top:.4rem;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      li{
        padding: .3rem;
        width:100%;
        text-align: center;
        border-top: 0.01rem solid rgba(255,255,255,0.5);
        span {
          width:100%;
          display: inline-block;
        }
        .uls-a {
          padding: .3rem;
          width:100%;
          text-align: center;
          border-top: 0.01rem solid rgba(255,255,255,0.5);
          color: #888;
        }
      }
    }
  }

}