.swiper-teach {
  position: relative;
  width: 72%;
}

.swiper-teach .teach-swiper-button {
  width: .6rem;
  height: .6rem;
  position: absolute;
  top: 44%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .15);
  background-color: rgba(0, 0, 0, .3);
  z-index: 100;
  transition: all .5s ease-in-out;
  border-radius: 50%;
  cursor: pointer;
}

.swiper-teach .teach-swiper-button:hover {
  background-color: #1473E6;
}

.swiper-teach .teach-swiper-button-left {
  left: 22%;
  transform: translateY(-50%);
  background-image: url('../img/public/swiper_btn.png');
}

.swiper-teach .teach-swiper-button-right {
  right: 22%;
  background-image: url('../img/public/swiper_btn.png');
  transform: translateY(-50%) scale(-1);
}

.swiper-teach .swiper-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  padding-top: 24%;
  perspective: 10rem;
  overflow: hidden;
}

.swiper-teach .swiper-slide {
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: -18.4%;
  width: 36.8%;
  height: 100%;
  transition: 300ms;
  transform: translate3d(0, 0, -20rem);
  cursor: pointer;
  background-color: #000;
}

.swiper-teach .swiper-slide video {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: none;
  object-fit: contain;
}

.swiper-teach .swiper-slide .poster_wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.swiper-teach .swiper-slide .poster_wrap .poster {
  width: 100%;
  height: 100%;
}

.swiper-teach .swiper-slide .poster_wrap .pause {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10%;
  transform: translate(-50%, -50%);
}

.swiper-teach .swiper-slide.prev_2 {
  transform: translate3d(-100%, 0, -2.4rem);
}

.swiper-teach .swiper-slide.prev_1 {
  transform: translate3d(-50%, 0, -1.2rem);
  z-index: 4;
}

.swiper-teach .swiper-slide.cur {
  transform: translate3d(0, 0, 0);
  z-index: 5;
}

.swiper-teach .swiper-slide.next_1 {
  transform: translate3d(50%, 0, -1.2rem);
  z-index: 4;
}

.swiper-teach .swiper-slide.next_2 {
  transform: translate3d(100%, 0, -2.4rem);
}

/* 手机端视频适配 */
@media screen and (max-width: 767px) {
  .swiper-teach {
    width: 100%;
  }
}