.portfolio {
  padding: 11.2rem 0 0
}
.portfolio__title {
  text-align: center;
  margin-bottom: 3.5rem
}
.portfolio__content {
  position: relative
}
.portfolio__inner {
  overflow: hidden
}
.portfolio-slider {
  height: 40rem;
  margin-left: -30rem
}
.portfolio-slider-wrapper {
  align-items: center
}
.portfolio-slider__item {
  width: 27.3rem;
  height: 18.2rem;
  transition: .25s
}
.portfolio-slider__item.swiper-slide-active {
  height: 100%
}
.portfolio-slider__item.swiper-slide-active .portfolio-slider__img {
  width: 60rem
}
.portfolio-slider__item.swiper-slide-active ~ .portfolio-slider__item {
  transform: translateX(32.7rem)
}
.portfolio-slider__item:not(:last-child) {
  margin-right: 2.7rem
}
.portfolio-slider__img {
  width: 100%;
  height: 100%;
  background-color: #d9d9d9;
  border-radius: 1.7rem;
  overflow: hidden;
  transition: .25s
}
.portfolio-slider__img img {
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}
.portfolio-pagination.swiper-pagination {
  display: none
}
@media (max-width:48em) {
  .portfolio {
    padding: 8rem 0 0;
    overflow: hidden
  }
  .portfolio__title {
    text-align: left;
    margin-bottom: 4rem
  }
  .portfolio__content {
    padding-bottom: 6.5rem
  }
  .portfolio__inner {
    overflow: visible
  }
  .portfolio-slider {
    height: 38.6rem;
    margin: 0;
    overflow: visible
  }
  .portfolio-slider__item {
    width: 100%;
    height: 100%
  }
  .portfolio-slider__item.swiper-slide-active .portfolio-slider__img {
    width: 100%
  }
  .portfolio-slider__item.swiper-slide-active ~ .portfolio-slider__item {
    transform: none
  }
  .portfolio-slider__item:not(:last-child) {
    margin-right: 3rem
  }
  .portfolio-slider__img {
    border-radius: 3.4rem
  }
  .portfolio-pagination.swiper-pagination {
    display: flex;
    bottom: 0
  }
}