html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.p-slider {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex; 
  justify-content: center;
  align-items: center;
  overflow: hidden;
  background: #000;
  color: #0e5cb7;
}

.p-slider.scrollable {
  display: block;      /* flexを解除 */
  overflow: auto;      /* スクロール可能 */
}

.p-slider__image img {
  max-width: 100vw;
  max-height: 100vh;
  width: auto;
  height: auto;
  display: block;
  cursor: pointer;
  user-select: none;
  transition: width 0.2s ease, height 0.2s ease;
}

.p-slider__prev,
.p-slider__next {
  position: fixed;
  top: 50%;  
  transform: translateY(-50%);
}
.p-slider__prev a,
.p-slider__next a {
  display: block;
}
.p-slider__prev svg,
.p-slider__next svg {
  width: 80px;
  height: 80px;
}
@media screen and (max-width: 767px) {
  .p-slider__prev svg,
  .p-slider__next svg {
    width: 40px;
    height: 40px;
  }
}
.p-slider__prev {
  left: 0;
}
.p-slider__next {
  right: 0;
}