.slider {
  width: 100vw;
  height: 100vh;
  max-height: 645px;  
  padding-bottom: 0%; /* 16:9 비율을 위한 값 (825px / 1466px) */
  position: relative;
  overflow: hidden;
    background:#000;
    
}

.slide {
  width: 100%;
  height:100%; 
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.slide.active {
    opacity: 1;
}

.slide .img {
  width: 100%;
  height: 100%;
   object-fit: cover;  
}

#slide1 .img {
  transform: translate(0%, 0%);  
}

#slide2 .img {
  transform: translate(0%, 0%);  
}


#slide3 .img {
  transform: translate(0%, 0%);  
}


#slide4 .img {
  transform: translate(0%, 0%);  
}

.slide .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.slide-content {
  position: absolute;
    width:1200px;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    animation: slideUp 0.8s ease; /* slideUp 애니메이션을 1초 동안 적용하며, 이징 함수는 ease로 설정합니다. */

}

.slide-content .txt01 {width:auto;  color:#fff;  text-align: left; text-shadow: 0px 0px 5px rgba(0,0,0,0.0); color:#000;}
.slide-content .txt01 h2 {font-size:32px; font-weight:550; padding:0 0 10px 0;}
.slide-content .txt01 h2 span {color:#00a0e9;}
.slide-content .txt01 h3 {font-size:58px; font-weight:450; }
.slide-content .txt01 h3 span {color:#1c55aa; font-weight:650;}
.slide-content .txt01 h4 {font-size:22px; font-weight:400; white-space : pre-line; line-height:1.4; padding:15px 0 0 0;}

.slide-content .txt01 ul {width:45%; display:flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding:15px 0 0 0;}
.slide-content .txt01 ul li {width:48%; font-size:25px; font-weight:450; line-height:1.6; display:flex; align-items: center; }
.slide-content .txt01 ul li i {font-size:18px; color:#0068b6; margin-right:4px;}

.slide-content .txt01 .img {width:40%; padding:20px 0 0 0;}


.link {width:auto; height:auto; margin:0 auto; padding:40px 0 0 0; }
.link ul {width:100%; margin:0 auto; display:flex; flex-wrap: wrap; align-items: center; justify-content: flex-start;}
.link ul li {width:auto;}
.link ul li i {font-size:18px; }
.link ul li a {width:48%; font-size:20px; font-weight:450; padding:5px 25px; border-radius:100px; border:1px solid #fff; color:#fff; background:none; transition: all ease 0.3s 0s; vertical-align:middle; box-sizing:border-box; margin:0 10px;}
.link ul li a:hover {transition: all ease 0.3s 0s; color:#000; background:#fff; border:1px solid #fff; text-shadow: 0px 0px 5px rgba(0,0,0,0.0);}



/* 슬라이드 하단 텍스트 */

.slide-info-container {
    
    display:none;
  position: absolute;
  bottom: 10px; /* 조정 가능한 여백 */
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  list-style: none; /* 기본 목록 스타일 제거 */
  padding: 0; /* 기본 패딩 제거 */
}

.slide-info {
    list-style: none;
    padding:15px 0;
    margin: 0;
    text-align: center;
}

.slide-info li {
    position: relative;
    display: inline-block;
    margin: 0 30px;
}

/* 기본 링크 텍스트 색상 */
.slide-info li a {
    font-size:16px; font-weight:550;
    color:#fff; /* 기본 색상 설정 */
    transition: all ease 0.3s;
}

.slide-info li a:hover {opacity:0.80; transition: all ease 0.3s;}

/* 활성화된 슬라이드의 링크 텍스트 색상 */
.slide-info li a.active {
    font-weight:550;
    color:#1386bf; /* 활성화된 슬라이드의 텍스트 색상을 흰색으로 변경 */
}

 .slide-bar {
     opacity:0.60;
    position: absolute;
     top:25px;
    bottom: 0;
    left: 0;
    height: 2px;
    background-color:#d9d9d9;
    transition: width 0.5s ease;
    width: 0; /* 초기 가로바 너비를 0으로 설정하여 시작할 때 보이지 않게 함 */
  }





/* 컨텐츠 위로 올리기 */


@keyframes slideUp {
  from {
    opacity: 0;
    transform: translate(-50%, -35%); /* 시작 위치 */
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%); /* 최종 위치 */
  }
}