/* 슬라이더 전체 화면 설정 */
.main-slider {
  width: 100%;
  height: 100vh; /* 화면 꽉 차게 */
}

/* 개별 슬라이드 스타일 */
.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #fff;
  background-size: cover;
  background-position: center;
  position: relative;
}

/* 어두운 오버레이 레이어 (글씨가 잘 보이도록) */
.swiper-slide::before {
  content: '';
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.02);
  z-index: 1;
}

/* 임시 배경색 (나중에 이미지로 대체 가능) */
.slide-1 { background-image: url('/image/mainimg01_3.jpg'); }
.slide-2 { background-image: url('/image/mainimg02_3.jpg');}
.slide-3 { background-image: url('/image/mainimg03_2.jpg'); }
.slide-4 { background-image: url('/image/mainimg04_2.jpg'); }

/* 슬라이드 내부 콘텐츠 */
.slide-content {
  position: relative;
  z-index: 2; /* 오버레이보다 위로 */
  padding: 0 20px;
  width:100%;
  
  
}
.slide-content  .imgtxt{
	position:absolute;
	height:100%;
	width:100%;
	top:0;
	left:0;
	
	 
	
}

.slide-content h2 {
  font-size: 3rem;
  margin-bottom: 20px;
  font-weight: 700;
}

.slide-content p {
  font-size: 1.2rem;
  margin-bottom: 30px;
  opacity: 0.9;
}

/* 공통 버튼 스타일 */
.btn {
  display: inline-block;
  padding: 12px 30px;
  background-color: #fff;
  color: #333;
  text-decoration: none;
  border-radius: 30px;
  font-weight: bold;
  transition: background 0.3s, color 0.3s;
}

.btn:hover {
  background-color: #333;
  color: #fff;
}

/* Swiper 화살표 커스텀 (흰색으로 변경) */
.swiper-button-next, .swiper-button-prev {
  color: #fff !important;
}

/* Swiper 페이지네이션 커스텀 (활성화된 점 색상) */
.swiper-pagination-bullet-active {
  background: #fff !important;
  width: 30px !important; /* 바 형태로 길어지는 효과 */
  border-radius: 5px !important;
}



.main .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    text-align: left;
    line-height: 12px;
    font-size: 12px;
    color: #000;
    vertical-align: middle;
    opacity: 0.8;
    background: #fff;
    transition: all .2s ease;
}

.main .swiper-pagination-bullet-active {
    opacity: 1;
    background: linear-gradient(45deg, #0196d6, #ec068d);
    width: 30px;
    height: 12px;
    border-radius: 15px;
}

.main .swiper-container-horizontal > .swiper-pagination-bullets,
.main .swiper-pagination-custom,
.main .swiper-pagination-fraction {
    bottom: 30px;
}

.swiper-pagination {
    text-align: center;
    top: 85%;
}

.main .swiper-container-horizontal > .swiper-pagination-bullets {
    width: 90%;
    max-width: 1500px; 
    padding: 0 15px; 
    margin: 0 auto; 
    left: 50%; 
    transform: translateX(-50%);
}


@media (max-width: 1000px) {
	.swiper-pagination {
		text-align: center;
		top: 95%;
	}
}