style.css

body, html {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.slider-container {
  width: 100%; /* 전체 너비 사용 */
  height: 100%; /* 전체 높이 사용 */
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: center; /* 가운데 정렬 */
  align-items: center; /* 가운데 정렬 */
}

.slider {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

.slide {
  width: 70vw; /* 뷰포트 너비의 70% */
  height: 60vh; /* 뷰포트 높이의 60% */
  margin: 0 15px; /* 슬라이드 사이 간격 조정 */
  background-color: #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2em;
}