.upload-img-box{
  .img-wrapper{
    position: relative;
    width: 100%;
    overflow: hidden;

    .img-shell{
      position: relative;
      max-width: 400px;
      max-height: 300px;
      border: 1px solid $border-dd;
      -webkit-border-radius: 0.2rem;
      -moz-border-radius: 0.2rem;
      border-radius: 0.2rem;
      margin-bottom: 0.5rem;
      .label-for{
        position: absolute;
        display: block;
        top:0;
        bottom:0;
        left:0;
        right:0;
        z-index: 99;
        cursor: pointer;
      }
      .paddingT{
        padding-top:75%;
      }
      img{
        position: absolute;
        display: block;
        top:0;
        bottom:0;
        left:0;
        right:0;
        max-height:100%;
        max-width:100%;
        margin:auto;
      }
    }
  }
  #upBtn{
    margin-top: 0.5rem;
  }
}
.uploader-wrapper{

}
.uploader-list-content,.preview-list{
  margin:0 -0.25rem;
  &>.fig-normal{
    width: 20%;
    display: inline-block;
    float: left;
    padding: 0.25rem;
    .img-shell{
      position: relative;
      overflow: hidden;
      .btn-box{
        position: absolute;
        z-index: 99;
        top:0;
        right:0;
        left:0;
        width: 100%;
        text-align: right;
        font-size:1rem;

        background-color: rgba(0,0,0,0.5);
        i{
          color: #FFFFFF;
          cursor: pointer;
          &:hover{
            color: darken(#fff, 30%);
          }
        }
      }
      .paddingT{
        padding-top: 145%;
      }
      .fig-img{
        position: absolute;
        top:0;
        bottom:0;
        left:0;
        right:0;
        display: block;
        margin:auto;
        max-height:100%;
        max-width:100%;
      }
    }
    .fig-tit{
      font-size: 0.6rem;
      text-align: center;
      font-weight:400;
      //padding-top: 0.5rem;
    }
  }
}