/* 메인 슬라이더 */
.slider_box.main_01 {
}
.main_visual_01.pc {
    display: block;
}
.main_visual_01_mobile {
    display: none;
}

@media (max-width: 700px) {
	.mobile_main_visual {
		width:100%;
		padding-bottom:80%;
		position:relative;
	}

	.slick-active .main_visual_01_mobile.on {
		padding:0;
		background: linear-gradient(
		180deg,
		#87CEEB 0%,   /* 하늘색 */
		#ADD8E6 33%,  /* 밝은 하늘색 */
		#FFFFCC 66%,  /* 옅은 노란색 */
		#FFFF99 100%  /* 노란색 */
	  );
	}
	.slick-active .main_visual_01_mobile.on:after {
		  content: '';
		  position: absolute;
		  top: 0;
		  left: 0;
		  width: 100%;
		  height: 100%;
		  z-index:1;
		  opacity:1;
		  background: linear-gradient(
		  180deg,
		  #903470 0%,
		  #D12E4F 15%,   /* 더 진한 주홍색 (노을 시작) */
		  #E55341 38%,  /* 진한 토마토 색상 (부드러운 전환) */
		  #FFC300 70%,  /* 더 강렬한 금색 (노을 중간) */
		  #FFD700 100%  /* 밝은 노란색 (노을 끝) */
		);
		opacity:0;
	}
	.slick-active .main_visual_01_mobile.on:after {
	  animation: day-to-sunset 3s ease-in forwards;
	}

}


.slick-active .main_visual_01 {
	padding:0;
    background: linear-gradient(
	180deg,
	#87CEEB 0%,   /* 하늘색 */
	#ADD8E6 33%,  /* 밝은 하늘색 */
	#FFFFCC 66%,  /* 옅은 노란색 */
	#FFFF99 100%  /* 노란색 */
  );
}
.slick-active .main_visual_01:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index:1;
  opacity:1;
  background: linear-gradient(
  180deg,
  #903470 0%,
  #D12E4F 15%,   /* 더 진한 주홍색 (노을 시작) */
  #E55341 38%,  /* 진한 토마토 색상 (부드러운 전환) */
  #FFC300 70%,  /* 더 강렬한 금색 (노을 중간) */
  #FFD700 100%  /* 밝은 노란색 (노을 끝) */
	);
	opacity:0;
}


.slick-active .main_visual_01.on:after {
  animation: day-to-sunset 4s ease-in forwards;
}

.main_title {
	width:24%;
	padding-bottom:16%;
	background:url('/buansunset/images/sunset/logo_2026.png');
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
	position:absolute;
	left:50%;
	top:44%;
	z-index:1001;
	transform: translate3d(-50%, -50%, 0);
}
.main_date {
	width:25%;
	padding-bottom:4%;
	background:url('/buansunset/images/sunset/date_2026.png?v=2');
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
	position:absolute;
	left:50%;
	top:72%;
	z-index:1001;
	transform: translate3d(-50%, 0%, 0);
}

@media (max-width: 700px) {
	.main_title {
		width:45%;
		padding-bottom:35%;
		background:url('/buansunset/images/sunset/logo_2026.png');
		background-position:center;
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		left:50%;
		top:50%;
		z-index:1001;
		transform: translate3d(-50%, -95%, 0);
	}
	.main_date {
		width:60%;
		padding-bottom:18%;
		background:url('/buansunset/images/sunset/date_2026.png?v=2');
		background-position:center;
		background-repeat:no-repeat;
		background-size:contain;
		position:absolute;
		left:50%;
		top:50%;
		z-index:1001;
		transform: translate3d(-50%, 25%, 0);
	}
}



@keyframes day-to-sunset {
0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

.mv_info {
    width: 100%;
    box-sizing: border-box;
    padding: 1% 1%;
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1000;
    font-weight: 600;
    color: #fff;
}

.main_visual_01.on .mv_info {
    animation: day-to-sunset-text 5s ease-in forwards;
	}


@keyframes day-to-sunset-text {
0% {
    color:#7a6a34;
  }
  100% {
    color:#fff;
  }
}

.bg_01 {
	width:100%;
	padding-bottom:31%;
	background:url('/buansunset/images/sunset/bg_png1.png');
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	position:absolute;
	left:0;
	bottom:0;
	z-index:1001;
}
.main_visual_01.on .bg_01{
	animation: day-bg 5s ease-in forwards;
}
.bg_02 {
	width:100%;
	padding-bottom:31%;
	background:url('/buansunset/images/sunset/bg_png2.png');
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	position:absolute;
	left:0;
	bottom:0;
	z-index:1001;
	opacity:0;
}
.main_visual_01.on .bg_02{
	animation: sunset-bg 5s ease-in forwards;
}



@media (max-width: 700px) {
	.bg_01 {
		width:100%;
		padding-bottom:40%;
		background:url('/buansunset/images/sunset/bg_png1.png');
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
		position:absolute;
		left:0;
		bottom:0;
		z-index:1001;
	}
	.main_visual_01_mobile.on .bg_01{
		animation: day-bg 3s ease-in forwards;
	}
	.bg_02 {
		width:100%;
		padding-bottom:40%;
		background:url('/buansunset/images/sunset/bg_png2.png');
		background-position:center;
		background-repeat:no-repeat;
		background-size:cover;
		position:absolute;
		left:0;
		bottom:0;
		z-index:1001;
		opacity:0;
	}
	.main_visual_01_mobile.on .bg_02{
		animation: sunset-bg 3s ease-in forwards;
	}
}

@keyframes day-bg {
0% {
    opacity:1;
  }
  100% {
    opacity:0;
  }
}
@keyframes sunset-bg {
0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

.sun {
	width:20%;
	padding-bottom:20%;
	position:absolute;
	left:50%;
    top:0%;
	transform: translateX(-50%);
	border-radius:50%;
	z-index:1000;
	background: linear-gradient(#FAB48E 0%, #F68D47 20%, #F26732 40%);
	box-shadow:rgba(242,105,63,1) 0px 0px 10px;
	opacity:0;
}
.main_visual_01.on .sun{
	animation:sun-down 4s ease-out forwards 2s , sun-op 3s ease-out forwards 3s;
}



@media (max-width: 700px) {
	.sun {
		width:40%;
		padding-bottom:40%;
		position:absolute;
		left:50%;
		top:0%;
		transform: translateX(-50%);
		border-radius:50%;
		z-index:1000;
		background: linear-gradient(#FAB48E 0%, #F68D47 20%, #F26732 40%);
		box-shadow:rgba(242,105,63,1) 0px 0px 10px;
		opacity:0;
	}
	.main_visual_01_mobile.on .sun{
		animation:sun-down-mobile 4s ease-out forwards 2s , sun-op 3s ease-out forwards 3s;
	}
}



@keyframes sun-down {
0% {
    top:0%;
  }
  100% {
    top:30%;
  }
}
@keyframes sun-down-mobile {
0% {
    top:0%;
  }
  100% {
    top:50%;
  }
}


@keyframes sun-op {
0% {
	opacity:0;
  }
  100% {
	opacity:1;
  }
}

.left_kite{
	width:20%;
	padding-bottom:25%;
	background:url('/buansunset/images/sunset/left_kite.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	left:-5%;
	top:10%;
	opacity:0;
}
.main_visual_01.on .left_kite{
	animation:object-show 3s ease-out forwards 6s, kite_rolling 2s ease-in-out infinite alternate;
}


.right_kite{
	width:20%;
	padding-bottom:25%;
	background:url('/buansunset/images/sunset/right_kite.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	right:-5%;
	top:10%;
	opacity:0;
}
.main_visual_01.on .right_kite{
	animation:object-show 3s ease-out forwards 6s, kite_rolling 2s ease-in-out infinite alternate;
}

@keyframes kite_rolling {
0% {
	transform:rotate(5deg);
  }
  100% {
	transform:rotate(0deg);
  }
}


.couple_sit{
	width:23%;
	padding-bottom:15%;
	background:url('/buansunset/images/sunset/couple_sit.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	left:-4%;
	bottom:-10%;
	opacity:0;
}
.main_visual_01.on .couple_sit{
	animation:object-show 3s ease-out forwards 4s;
}


.statue{
	width:23%;
	padding-bottom:15%;
	background:url('/buansunset/images/sunset/statue.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	left:12%;
	top:45%;
	opacity:0;
}
.main_visual_01.on .statue{
	animation:object-show 3s ease-out forwards 4.5s;
}

.couple_stand{
	width:35%;
	padding-bottom:40%;
	background:url('/buansunset/images/sunset/couple_stand.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	right:10%;
	bottom:-60%;
	opacity:0;
}
.main_visual_01.on .couple_stand{
	animation:object-show 3s ease-out forwards 5s;
}

.signs{
	width:10%;
	padding-bottom:25%;
	background:url('/buansunset/images/sunset/signs.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	right:-2%;
	bottom:-30%;
	opacity:0;
}
.main_visual_01.on .signs{
	animation:object-show 3s ease-out forwards 4.5s;
}

.star_01 {
	width:2%;
	padding-bottom:2%;
	background:url('/buansunset/images/sunset/star1.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	left:50%;
	top:7%;
	transform:translateX(-660%);
	opacity:0;
}
.star_02 {
	width:3%;
	padding-bottom:3%;
	background:url('/buansunset/images/sunset/star2.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	left:50%;
	top:11%;
	transform:translateX(-550%);
	opacity:0;
}
.star_03 {
	width:2%;
	padding-bottom:2%;
	background:url('/buansunset/images/sunset/star3.png');
	position:absolute;
	z-index:1002;
	background-size:contain;
	background-repeat:no-repeat;
	left:50%;
	top:10%;
	transform:translateX(600%);
	opacity:0;
}

.main_visual_01.on .star_01{
	animation:object-show 5s ease-out forwards 6s, mv_stars 6s ease-in-out infinite 7s;
}

.main_visual_01.on .star_02{
	animation:object-show 6s ease-out forwards 6s, mv_stars 7s ease-in-out infinite 7s;
}

.main_visual_01.on .star_03{
	animation:object-show 7s ease-out forwards 6s, mv_stars 5s ease-in-out infinite 7s;
}



@keyframes object-show {
0% {
	opacity:0;
  }
  100% {
	opacity:1;
  }
}


@keyframes mv_stars {
    0% {
        opacity: 0.3;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0.3;
    }
}



.slick-active .main_visual_01 {
    width: 100%;
    padding-bottom: 35%;
    box-sizing: border-box;
    position: relative;
}


@media (max-width: 700px) {
    .main_visual_01.pc {
        display: none;
    }
    .main_visual_01_mobile {
        display: block;
    }
}