.carousel-wrapper {
  position: relative;
  height: 580px;
  overflow: hidden; }
  .carousel-wrapper__prev, .carousel-wrapper__next {
    position: absolute;
    top: 22.5%;
    z-index: 5;
    width: 150px;
    height: 70%;
    cursor: pointer;
    text-indent: -9999px; }
  .carousel-wrapper__prev {
    left: 0; }
  .carousel-wrapper__next {
    right: 0; }
  .carousel-wrapper ul {
    position: relative;
    max-width: 720px;
    max-width: 68%;
    height: 100%;
    margin: 68px auto 100px auto;
    transform-style: preserve-3d;
    perspective: 720px; }
    .carousel-wrapper ul li {
      position: absolute;
      top: 0;
      left: 0;
      transition: all 0.5s ease;
      opacity: 0;
      overflow: hidden;
      box-shadow: 0 2px 28px rgba(0, 0, 0, 0.12); }
      .carousel-wrapper ul li img {
        max-width: 100%; }
      .carousel-wrapper ul li.l1 {
        opacity: 1;
        transform: translate(-240px, 0) scale(0.79);
        z-index: 4; }
      .carousel-wrapper ul li.cur {
        opacity: 1;
        z-index: 5; }
      .carousel-wrapper ul li.r1 {
        opacity: 1;
        transform: translate(240px, 0) scale(0.79);
        z-index: 4; }
  @media (max-width: 1199.98px) {
    .carousel-wrapper {
      height: 500px; }
      .carousel-wrapper.l1 {
        transform: translate(-180px, 0) scale(0.79); }
        .carousel-wrapper.l1.r1 {
          transform: translate(180px, 0) scale(0.79); } }
  @media (max-width: 991.98px) {
    .carousel-wrapper {
      height: 400px; }
      .carousel-wrapper__prev {
        left: -50px; }
      .carousel-wrapper__next {
        right: -50px; }
      .carousel-wrapper ul li.l1 {
        transform: translate(-120px, 0) scale(0.79); }
      .carousel-wrapper ul li.r1 {
        transform: translate(120px, 0) scale(0.79); } }