@charset "UTF-8";
/**
 *
 * @authors baronxiong
 * @date    2017-05-25 15:32:59
 * @version 内容为空提示
 */

.tui-nodata{padding:60px;background: #fff;border-radius: 4px;font-size: 0;
  white-space: nowrap;word-wrap:normal;text-align: center;}
.tui-nodata:before,
.tui-nodata-inner{display: inline-block;vertical-align: middle;}
.tui-nodata:before{content: "";width: 0;height: 100%;}
.tui-nodata-figure{display:block;width:81px;height:73px;margin:0 auto;margin-bottom:20px;position: relative;margin-top:10px;opacity: 0;
  background: url(../../images/tui/nodata-sprite.png) 0 0 no-repeat;
  animation:nodata .3s ease-out .2s forwards;}
.tui-nodata-figure:before{content: ""; width:40px;height:8px;display: block;position: absolute;top:25px;left:20px;
  background: url(../../images/tui/nodata-sprite.png) -81px 0 no-repeat;animation:nodata-dot .3s ease-out .5s forwards; opacity: 0;}
.tui-nodata-tips{font-size: 18px;line-height:20px;color: #858585;
}

/*404*/

.tui-404{padding:60px;background: #fff;border-radius: 4px;font-size: 0;
  white-space: nowrap;word-wrap:normal;text-align: center;}
.tui-404-cont {
  text-align: center;
  margin-top: 20px;
}
.tui-404-figure{display:block;width:140px;height:140px;margin:0 auto;margin-bottom:20px;overflow: hidden;position: relative;
  background-image: url(../../images/tui/404-sprite.png);
  -webkit-mask-image: url(../../images/tui/404.png?__sprite);
}
.tui-404-figure>.item0{width:54px;height:59px;display: block;position: absolute;z-index: 4;
  top:46px;right:10px; background: url(../../images/tui/404-sprite.png) -210px 0 no-repeat ;
  animation:chazuo-duan-r .5s ease-out .5s forwards;}
.tui-404-figure>.item1{ width:70px;height:63px;display: block;position: absolute;z-index: 2;
  top:45px;left:20px;
  transform: rotate(15deg);
  background: url(../../images/tui/404-sprite.png) -140px 0 no-repeat;
     animation:chazuo-duan-l .5s ease-out .5s forwards;
}
.tui-404-figure>.item2{width:25px;height:17px;display: block;position: absolute;z-index: 3;
  top:25px;left:55px; background: url(../../images/tui/404-sprite.png) -264px 0  no-repeat;
  animation:chazuo-duang .5s ease-out 1s forwards ; opacity: 0;}

.tui-404-cont h6 {
  font-size: 18px;
  color:#333;
  margin: 0;
  padding: 0;
  font-weight: normal;
}

.tui-404-cont p {
  color:#858585;
  font-size: 14px;
  margin-top: 4px;
}
.tui-404-cont .btn{font-weight: bold;margin-top:20px;}



@keyframes chazuo-duan-l {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(-15px, 5px, 0);
    transform: translate3d(-15px, 5px, 0);
  }
}

@keyframes chazuo-duan-r {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(10px, 0px, 0);
    transform: translate3d(10px, 0px, 0);
  }
}

@keyframes chazuo-duang{
 0%{opacity: 0; visibility: visible;}
 20%{opacity: 1; }
  40%{opacity: 0; }
  60%{opacity: 1; visibility: visible;}
  80%{opacity: 0; }
  100%{opacity: 1; }
}

@keyframes nodata{
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
    opacity: 0;
  }

  to {
    -webkit-transform: translate3d(0px, -10px, 0);
    transform: translate3d(0px, -10px, 0);
    opacity: 1;
  }

}

@keyframes nodata-dot{
  from {
    opacity: 0;
  }

  to {

    opacity: 1;
  }

}
