#slider {
  width: 1000px;
  height: 250px;
  overflow: hidden;
  margin: 0 auto;
}

#slider-inner {
  position: relative;
  width: 4000px;
  height: 250px;
  transition: all .7s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

#slider-inner .slide {
  position: relative;
  width: 1000px;
  height: 250px;
  display: inline-block;
}

#slider-inner .slide label {
  position: absolute;
  z-index: 900;
  font-size: 32px;
  opacity: 0;
  cursor: pointer;
  transition: opacity .7s .4s, background .2s;
}

#slider-inner .slide label:nth-of-type(1) {
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  padding: 0 11px 0 9px;
  z-index: 800;
}

#slider-inner .slide label:nth-of-type(2) {
  right: 25px;
  top: 50%;
  transform: translateY(-50%);
  padding: 0 9px 0 11px;
}

#first:checked ~ #slider #slider-inner {
  margin-left: 0;
}

#first:checked ~ #slider #slider-inner #first-slide label {
  opacity: 1;
}

#second:checked ~ #slider #slider-inner {
  margin-left: -1000px;
}

#second:checked ~ #slider #slider-inner #second-slide label {
  opacity: 1;
}

#third:checked ~ #slider #slider-inner {
  margin-left: -2000px;
}

#third:checked ~ #slider #slider-inner #third-slide label {
  opacity: 1;
}

#fourth:checked ~ #slider #slider-inner {
  margin-left: -3000px;
}

#fourth:checked ~ #slider #slider-inner #fourth-slide label {
  opacity: 1;
}

.slide .feedback__item {
  position: relative;
  font-size: 150px;
  top: 50%;
  transform: translateY(-50%);
}

#slider input {
  height: 1px;
  width: 1px;
  opacity: 0;
}

@media screen and (max-width: 768px) {
  #slider {
    height: 430px;
    width: calc(100vw - 40px);
  }

  #slider-inner {
    width: calc(400vw - 160px);
    height: 430px;
  }

  #slider-inner .slide {
    width: calc(100vw - 44px);
    height: 430px;
  }

  #slider-inner .slide label:nth-of-type(1) {
    left: 0;
  }

  #slider-inner .slide label:nth-of-type(2) {
    right: 0;
  }

  #second:checked ~ #slider #slider-inner {
    margin-left: calc((100vw - 40px) * -1);
  }

  #third:checked ~ #slider #slider-inner {
    margin-left: calc((200vw - 80px) * -1);
  }

  #fourth:checked ~ #slider #slider-inner {
    margin-left: calc((300vw - 120px) * -1);
  }
}