.banner {
  margin: 0;
  padding: 0;
  position: relative;
  overflow: hidden;
  touch-action: none;

  .fix-box {
    position: fixed;
    width: 100%;
    z-index: 9;

    ul {
      top: 0;
      left: 0;
      background-color: #efefef;
      bottom: p2w(10);
      z-index: 9;
      .banner-item {
        display: inline-block;
        .banner-img {
          display: block;
          height: calc(25vw);
          width: 100%;
          background-size: 100% 100%;
          background-repeat: no-repeat;
        }
      }
    }

    .banner-dots-wrap {
      position: absolute;
      z-index: 10;
      width: 100%;
      bottom: p2w(10);
      left: p2w(12);
    
      .banner-dots {
        display: inline-block;
        width: p2w(6);
        height: p2w(1);
        margin-right: p2w(6);
        &.banner-dots__noselected {
          background-color: white;
        }
        &.banner-dots__selected {
          margin-bottom: p2w(-2);
          width: p2w(4);
          height: p2w(4);
          border: 1px solid white;
          border-radius: p2w(3);
        }
      }
    }
  }
}