#premium{width:100%; min-width: 2000px; height: 760px; box-sizing:border-box; background-color:#43393a; text-align: center;}
#premium .premium_bg{position: absolute; width: 100%; height: 600px; background-color: #e6e1dc; bottom: 0;}

#premium .prev_btn{left: -50px; top: 300px; cursor: pointer; z-index: 1; opacity: 0; animation-delay: .5s;}
#premium .next_btn{left: 50px; top: 300px; cursor: pointer; z-index: 1; opacity: 0; animation-delay: .8s;}


#pre_u{width: 70%; margin: 0 auto; overflow: hidden;
z-index: 1;
display: inline-block;
margin-left: -30px;
}
#pre_u li{
  opacity: 0;
  height:600px; background-size:cover;
  background-repeat: no-repeat; /*transform: translateX(-100%);*/
  transition:all ease-in-out 0.5s;
  overflow: hidden;
  text-align: left;
}
@keyframes preu {
  0%{ height:0; opacity: 0;}
  100%{height:600px; opacity: 1;}

}

.preu{
  animation-name: preu;
  animation-duration: 1.2s;
  animation-fill-mode:both;
}

@keyframes preu_btn {
  0%{ top:350px; opacity: 0;}
  100%{top:300px; opacity: .3;}

}

.preu_btn{
  animation-name: preu_btn;
  animation-duration: 1.2s;
  animation-fill-mode:both;
}


#pre_u .pre_bg{background-color: rgba(0,0,0,.5); width: 100%; height: 600px; transition:all ease-in-out 0.5s 0.8s;  opacity: 0.5;}
#pre_u li .pre_tx_bg >div{top:25px; left:35px; color: #fff; font-size: 20px; letter-spacing: -0.03em;}
#pre_u li .pre_tx_bg >img{top:25px; left:35px; }
#pre_u li .pre_tx_bg >div>span{font-size: 14px; text-transform: uppercase; opacity: .5; }
#pre_u li .pre_tx_bg >div>b{font-size: 25px;line-height: 28px; font-weight: 600;}
#pre_u li .pre_tx_bg >div>p{font-size: 18px;line-height: 32px;}

#pre_u li .pre_tx_bg{position: absolute; width: 100%; height: 230px; left: 0; bottom: -100px; border-top-left-radius: 30px; background-color:rgba(200, 185, 175, 0.9); transition:all ease-in-out 0.5s 0.8s;}

/*
#pre_u li:hover>div{left: 0; height: 170px; transition-property: left, height; transition-duration: .7s; transition-delay: 0s, .7s;}
#pre_u li:hover>div{transition: left .7s ease 0s, height .5s ease .5s;}*/

.pre1{background-image:url(../images/prem_01.jpg);}
.pre2{background-image:url(../images/prem_02.jpg); animation-delay: .1s;}
.pre3{background-image:url(../images/prem_03.jpg); animation-delay: .2s;}
/*.pre4{background-image:url(../images/prem_04.jpg); animation-delay: .3s;}*/


#pre_u .slick-slide.slick-current.slick-active .pre_tx_bg
{
  bottom: 0px; background-color: #43393a;
}

#pre_u .slick-slide.slick-current.slick-active .pre_bg{
  background-color: rgba(0,0,0,0); 

}

#pre_u .slick-slide{margin:0 5px 0 5px;}


#main2{width: 100%; min-width: 1300px; height:750px; background-color:  #43393a; padding: 0; position: relative;/* z-index 필요 시를 대비 */z-index: 2;}
#main2 ul{top: 100px;}
#main2 ul li{opacity: 0; text-align: center;}
#main2 ul li:nth-child(1){font-size: 25px; font-weight: 500; letter-spacing: -0.04em; line-height: 50px; color: #000;}
#main2 ul li:nth-child(1) p{font-size:45px; font-weight: 700; color: #fff; word-spacing: -6px; text-transform: uppercase;}
#main2 ul li:nth-child(2){top: 30px; animation-delay: .3s;}
#main2 ul li:nth-child(2) img {margin-top: 20px;}
#main2 ul li:nth-child(2) p{font-size: 19px; line-height: 25px;color: #fff;}
#main2 ul li:nth-child(2) p b{color: #fff; font-weight: 800;}
#main2 ul li:nth-child(3){top: 89px; animation-delay: .5s;}
#main2 .highlight {color: #D54433;/* 원하는 색상 */}


#main3{width: 100%; height:1245px; background-color: #fafafa;}
#main3>ul>li{opacity: 0;}
#main3 ul li:nth-child(2){width: 1300px; margin: 0 auto; text-align: center; margin-top: 20px;}
.main3img{text-align: center; top:130px;}
#main3_video{width:1200px; height: 675px; overflow: hidden; margin:0 auto; top:170px; opacity: 0;}

#main4{width: 100%; min-width: 1300px; height:800px; background: url(../images/main4_bg.jpg) no-repeat; background-size:cover; overflow: hidden;}
#main4 .main4_regist{width:1200px;  margin:0 auto;  margin-top: 80px;}



#main4 .regist{z-index: 98; animation-delay: .5s;}
#main4 .regist .tx{letter-spacing:0;text-align:left;position:absolute;top:30px;left:50px;width:250px;}
#main4 .regist .tx h4 {font-size:40px;font-weight:600;color:#000;text-transform:uppercase;}
#main4 .regist .tx p {font-size:25px;color:#000;font-weight: 500;}
#main4 .regist {left:50px; top:115px;opacity:0; /*-webkit-animation-delay: 0.6s;  animation-delay: 0.6s;*/}
#main4 .regist > div {position:absolute;top:150px;left:0;width:860px;}
#main4 .regist > div dl {display:block;text-align:left;padding-bottom:10px; left:100px;}
#main4 .regist > div dl:after  {clear: both; display:block; content:""}
#main4 .regist > div dl dt {float:left;width:150px;color:#000;font-size:18px;line-height:40px;text-align:right;padding-right:20px;vertical-align:middle;}
#main4 .regist > div dl dt span {display:inline-block;position:relative; font-weight: 500;}
#main4 .regist > div dl dt span:before {content:'*';color:#D54433;display:inline-block;padding-right: 12px;position: absolute;top: 3px;left: -13px;}
#main4 .regist > div dl dd {float:left;width:410px;vertical-align:top;}
#main4 .regist > div dl dd span {display:block;font-size:18px;color:#000; line-height:2}
#main4 .regist > div .bt-regist {display:block;position:absolute;right:10px;top:0;width:150px;height:140px;background:#3A2F33; text-align: center; border-top-right-radius: 25px;}
#main4 .regist > div .bt-regist span {display:inline-block;padding-top:45px;color:#fff;font-size:20px;line-height:1.3; font-weight: 500;}
#main4 .regist input {width:100%;height:62px;background:#fff;border:none;border-top-left-radius:7px;border-bottom-right-radius:7px;}
#main4 .regist input.cs {background:#858988;color:#fff;}

#main4 .regist > .agree-box {position:absolute;top:340px;left:170px;width:600px;text-align:left;}
#main4 .regist > .agree-box p {font-size:18px;line-height:20px;color: #000;padding-bottom:17px;}
#main4 .regist > .agree-box p input[type="checkbox"] {display:none;}
#main4 .regist > .agree-box p input[type="checkbox"] + label {padding-left:30px;text-indent:-999999px;font-size:0;}
#main4 .regist > .agree-box p input[type="checkbox"] + label:before { content:' '; display:block; width:20px; height:20px; position:absolute;left:0;background:url(../images/rgs-check.png); }
#main4 .regist > .agree-box p input[type="checkbox"]:checked + label:before {background:url(../images/rgs-check-on.png) no-repeat 0 0px;z-index:1;}
#main4 .regist > .agree-box p a{display:inline-block;color: #000;border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:3px;}
#main4 .regist > .agree-box ul li {font-size:12px;color: #000;letter-spacing:-0.02em;line-height: 1.5;}


#main4 .main4tx{ text-align: center; color: #fff; font-size: 40px; letter-spacing: -0.04em; word-spacing:-3px; line-height: 48px; opacity: 0;}
#main4 .main4tx > b{font-size: 50px; font-weight: 800;}
#main4 .main4img > div{
  opacity: 0; text-align: center; top:72px; position: absolute; right:0; width:285px; height:220px;
  border:3px rgba(255, 255, 255, .5) solid; color: #fff; line-height: 23px; padding-top: 45px;
  border-top-left-radius: 30px;
  border-bottom-right-radius: 30px;
}
#main4 .main4img > div > p{font-size: 20px; margin-top: 35px; line-height: 28px;}
#main4 .main4img > div > b{font-size: 24px; font-weight: 800;}
#main4 .main4img > div:nth-child(1){animation-delay: 1s;}
#main4 .main4img > div:nth-child(2){top:372px; animation-delay: 1.5s;}





/*slider*/

.mainslick{
  width:100%;
  height:975px;
  position: relative;
  }

.Slider01{background: url("../images/main0.jpg") no-repeat; background-size: cover; background-attachment: fixed; background-position: center center; width:100%; height:975px; overflow:hidden}
.Slider02{background: url("../images/main.jpg") no-repeat; background-size: cover; background-attachment: fixed; background-position: center center; width:100%; height:975px; overflow:hidden}
.Slider03{background: url("../images/main1.jpg") no-repeat; background-size: cover; background-attachment: fixed; background-position: center center; width:100%; height:975px; overflow:hidden}
.Slider04{background: url("../images/main1_2.jpg") no-repeat; background-size: cover; background-attachment: fixed; background-position: center center; width:100%; height:975px; overflow:hidden}

@media (max-width: 1024px){
.Slider01:before{background-position: 100% center;}
}

.slider_txt{width: 1300px; margin: 0 auto; top:250px;}



.Slider03 .slider_txt1{color:#1838a2;}
.Slider03 .slider_txt2{color:#000;}

/* 공통: 텍스트 그룹 구조 유지 */
.mainslick .slider_txt {
  position: absolute;
  left: 5%;              /* 왼쪽 여백 */
  display: flex;
  flex-direction: column; /* 세로로 순서대로 (txt1 → txt2) */
  align-items: flex-start; /* 왼쪽 정렬 */
  text-align: left;
}


/* ───────── 슬라이드별 그룹 위치 ───────── */

/* Slider01: 왼쪽 하단 */
.mainslick .Slider01 .slider_txt {
  bottom: 30%;
  top: auto;
}

/* Slider02: 왼쪽 중간 */
.mainslick .Slider02 .slider_txt {
  top: 30%;
  transform: translateY(-30%);
}

/* Slider03: 왼쪽 상단 */
.mainslick .Slider03 .slider_txt {
  top: 20%;
  transform: translateX(10%);
}

.slick-slide.slick-current.slick-active .slider_txt1
{
  animation: slider_txt1 2s both;
  
}

@keyframes slider_txt1 {
  0%{ margin-left: 100px; opacity: 0;}
  100%{margin-left: 130px; opacity: 1;}
}



.slick-slide.slick-current.slick-active .slider_txt2
{
  animation: slider_txt2 3s 1s both;
  
}

@keyframes slider_txt2 {
  0%{ margin-left: 105px; opacity: 0;}
  100%{margin-left: 135px; opacity: 1;}
}


/* 1번 슬라이드 (Slider01) 전용 스타일 */
.mainslick .Slider01 .slider_txt1 {
  color: #000;
  font-size: 1.3rem;
  line-height: 1.7rem;
  letter-spacing: 0.2px;
  font-weight: 350px;
}
.mainslick .Slider01 .slider_txt2 {
  color: #000;
  font-size: 1.3rem;
  line-height: 2rem;
  letter-spacing: 0px;
  font-weight: 600;
  margin-top: 12px;
}


/* 2번 슬라이드 (Slider02) 전용 스타일 */
.mainslick .Slider02 .slider_txt1 {
  color: #000;
  font-size: 1.2rem;
  line-height: 2rem;
  letter-spacing: 0px;
  font-weight: 700;
}
.mainslick .Slider02 .slider_txt1 b {
line-height: 50px;
font-size: 2.5rem;
font-weight: 500px;
}

.mainslick .Slider02 .slider_txt1 span {
  color: #000;        /* 색상 */
  font-size: 130px;     /* 글자 크기 */
  line-height: 1.2;
  font-weight: 500;
  display: inline-block; /* 줄바꿈 시 안정적으로 정렬 */
}

.mainslick .Slider02 .slider_txt2 {
  color: #000;
  font-size: 1.3rem;
  line-height: 2rem;
  letter-spacing: 0px;
  font-weight: 700;
  margin-top: 12px;
 
}


/* Slider02 텍스트 블록 위치 (배경은 기존 코드 유지) */
.mainslick .Slider02 .slider_txt {
  position: absolute;
  left: 5%;
  top: 30%;
  transform: translateY(-30%);
  text-align: left;
}

/* slider_txt1 자체는 예전 애니메이션 대상이므로 유지 */
.mainslick .Slider02 .slider_txt1 {
  display: inline-block;
  color: #000;
}

/* 상단: 제목(좌) + 10년(우) */
.mainslick .Slider02 .kv-hl{
  display: inline-flex;           /* span이지만 flex 사용 */
  align-items: flex-end;
  gap: clamp(16px, 3vw, 40px);
}

/* 두 줄 제목 */
.mainslick .Slider02 .kv-lines > span{
  display: block;
  font-weight: 800;
  font-size: 50px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: #000;
}

/* 큰 10년 */
.mainslick .Slider02 .kv-year{
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.05em;
  font-size: 130px);
  color:#000;
}
.mainslick .Slider02 .kv-year em{ font-style: normal; font-size: 130px; font-weight: 700;}

.mainslick .Slider02 .kv-sub > span{
  display: block;
  font-size: clamp(18px, 1.9vw, 24px);
  line-height: 1.4;
  letter-spacing: -0.02em;
  color:#000;
}





/* 3번 슬라이드 (Slider03) 전용 스타일 */

.mainslick .Slider03 .slider_txt1 {
  color:  #1838a2;
  font-weight: 700;
  font-size: 20px;
  line-height: 25px;
  letter-spacing: 0px;
  margin-left:20px;
}
.mainslick .Slider03 .slider_txt1 .indent {
  display: inline-block;
  margin-left: 1ch; /* 따옴표 한 글자 너비만큼 들여쓰기 */
}
.mainslick .Slider03 .slider_txt1 b {
  color:  #1838a2;
  line-height: 70px;
  font-size: 2.2rem;
  font-weight: 500px;
  letter-spacing: -1px;
  word-spacing: -2px;
}


.mainslick .Slider03 .slider_txt1 span{
  color: #000;        /* 색상 */
  font-size: 1.2rem;     /* 글자 크기 */
  line-height: 1;
  font-weight: 400;
  display: inline-block; /* 줄바꿈 시 안정적으로 정렬 */
  margin-top: 9px;       /* 위 여백 */
}

.mainslick .Slider03 .slider_txt2 {
  color: #000;
  font-size: 1.3rem;
  line-height: 2rem;
  letter-spacing: 0px;
  font-weight: 600;
  margin-top: 12px;

}

/* 둥둥 */
.quick{position: fixed; right: 20px; top: 52%; z-index: 999; cursor: pointer; transition: top 1s;}
.quick.on{top: 70%;}
.quick.main{top: 25%;}
.quick .quick-pc:nth-of-type(1){top: 105%; position: absolute; }
.quick ul li a{position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.quick-pc div{position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; font-size: 18px; font-weight: 400; color: #FFF;}
.quick-pc div p{font-weight: 600; }
.quick-pc img{animation: quick-rotate 5s linear infinite;}
@keyframes quick-rotate{
    0%{transform: rotate(0deg);}
    100%{transform: rotate(360deg);}
}

/*
.your-slider-wrapper {
  opacity: 0;
  visibility: hidden;
  transition: opacity 1s ease;
  -webkit-transition: opacity 1s ease;
}


.your-slider-wapper.slick-initialized {
  visibility: visible;
  opacity: 1;    
}
*/

/* 팝업 공통 배경 스타일 */
.custom-popup-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* 어두운 배경 */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999; /* 다른 요소 위에 표시 */
}