@mixin swipe-slide($wraper:'.banner',$ul:'ul',$li:'li'){
  #{$wraper}{
    overflow: hidden;
    visibility: hidden;
    position: relative;
    #{$ul}{
      overflow: hidden;
      position: relative;
      #{$li}{
        float:left;
        width:100%;
        position: relative;
      }
    }
  }
}
@include swipe-slide('.J_slide');
.banner{
  width:100%;
  .slide{
    width:942px;
    margin:0 auto;
    img{
      vertical-align:middle;
      width:940px;
      border:1px solid #fff;
    }
    .wraper{
      position:relative;
      .des{
        width:444px;
        height:60px;
        @include in-bl;
        color:#fff;
        background-color:rgba(#000,.8);
        @include pos(right,3px,bottom,25px);
        text-indent:20px;
        line-height:60px;
      }
    }
  }
  $ar_width:image-width('soccernight/icon/left_arrow.png');
  $ar_height:image-height('soccernight/icon/left_arrow.png');
  .J_handle{
    .left_arrow,.right_arrow{
      width:$ar_width;
      height:$ar_height;
      @include in-bl;
      position:absolute;
      top:50%;
      margin-top:-$ar_height * 0.5;
      @include opacity(50);
      &:hover{
        @include opacity(100);
      }
    }
    .left_arrow{
      left:10px;
      @include icon-sprite(left_arrow);
    }
    .right_arrow{
      right:10px;
      @include icon-sprite(right_arrow);
    }
  }
}