body {
      padding: 0;
      margin: 0;
  }
  
  .pc-slide {
      width: 93vw;
      margin: 0 auto;
  }
  
  .view {
      width: 93vw;
      margin: 0 auto;
      /* border: 1px solid #F00; */
      padding-top: 0px;
      padding-bottom: 0px;
  }
  
  .view .swiper-container {
      width: 93vw;
      height: 135vw;
      /* border: 1px solid #F00; */
  }
  
  .view .swiper-slide {
      width: 100%;
      /* height: 100%; */
      /* margin-top: 40px; */
      /* padding-top: 40px; */
  }
  
  .view .arrow-left {
      background: url(../images/atlas/index_tab_l.png) no-repeat left top;
      position: absolute;
      left: 10px;
      top: 50%;
      margin-top: -25px;
      width: 28px;
      height: 51px;
      z-index: 10;
  }
  
  .view .arrow-right {
      background: url(../images/atlas/index_tab_r.png) no-repeat left bottom;
      position: absolute;
      right: 10px;
      top: 50%;
      margin-top: -25px;
      width: 28px;
      height: 51px;
      z-index: 100;
  }
  
  .view img {
      border-radius: 12px;
      width: 100%;
      margin-left: -0px;
      border: 1px solid #bbb;
  }
  
  .preview {
      width: 100%;
      margin-top: 10px;
      position: relative;
      margin-top: 10Px;
      margin-bottom: 30px;
  }
  
  .preview .swiper-container {
      width: 82vw;
      height: 110px;
      margin-left: 20px;
  }
  
  .preview .swiper-slide {
      width: 80px;
      height: 90px;
  }
  
  .preview .slide6 {
      width: 82px;
  }
  
  .preview .arrow-left {
      background: url(../images/atlas/feel3.png) no-repeat left top;
      position: absolute;
      left: 0px;
      top: 50%;
      margin-top: -9px;
      width: 9px;
      height: 18px;
      z-index: 10;
  }
  
  .preview .arrow-right {
      background: url(../images/atlas/feel4.png) no-repeat left bottom;
      position: absolute;
      right: 0px;
      top: 50%;
      margin-top: -9px;
      width: 9px;
      height: 18px;
      z-index: 10;
  }
  
  .preview img {
      padding: 1px;
      width: 100%;
  }
  
  .preview .active-nav img {
      padding: 0;
      border: 2px solid #F00;
  }
  
  @media (min-width: 768px) {
      .pc-slide {
          width: 750px;
          margin: 0 auto;
      }
      .view {
          background: url(../images/atlas/ipad750.png) no-repeat center center;
          width: 750px;
          height: 989px;
          margin: 0 auto;
          /* border: 1px solid #F00; */
          padding-top: 36px;
          padding-bottom: 40px;
      }
      .view .swiper-container {
          width: 666px;
          height: 910px;
          /* border: 1px solid #F00; */
      }
      .view .swiper-slide {
          width: 100%;
          height: 100%;
          /* margin-top: 40px; */
          /* padding-top: 40px; */
      }
      .view .arrow-left {
          background: url(../images/atlas/index_tab_l.png) no-repeat left top;
          position: absolute;
          left: -10px;
          top: 50%;
          margin-top: -25px;
          width: 28px;
          height: 51px;
          z-index: 10;
      }
      .view .arrow-right {
          background: url(../images/atlas/index_tab_r.png) no-repeat left bottom;
          position: absolute;
          right: -10px;
          top: 50%;
          margin-top: -25px;
          width: 28px;
          height: 51px;
          z-index: 100;
      }
      .view img {
          border-radius: 12px;
          width: 100%;
          height: 100%;
          margin-left: -0px;
          border: 0px solid #bbb;
      }
      .preview {
          width: 100%;
          position: relative;
          margin-top: 100Px;
          margin-bottom: 100px;
      }
      .preview .swiper-container {
          width: 540px;
          height: 112px;
          margin-left: 100px;
      }
      .preview .swiper-slide {
          width: 90px;
          height: 100px;
      }
      .preview .slide6 {
          width: 82px;
      }
      .preview .arrow-left {
          background: url(../images/atlas/feel3.png) no-repeat left top;
          position: absolute;
          left: 10px;
          top: 50%;
          margin-top: -9px;
          width: 9px;
          height: 18px;
          z-index: 10;
      }
      .preview .arrow-right {
          background: url(../images/atlas/feel4.png) no-repeat left bottom;
          position: absolute;
          right: 10px;
          top: 50%;
          margin-top: -9px;
          width: 9px;
          height: 18px;
          z-index: 10;
      }
      .preview img {
          padding: 1px;
      }
      .preview .active-nav img {
          padding: 0;
          border: 2px solid #F00;
      }
  }