.mv {
  overflow: hidden;
  position: relative;
}

.mv .swiper-slide {
  position: relative;
  overflow: hidden;
}

.mv .bg-box {
  width: 100vw;
  height: 100vh;
}

.mv .bg-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.2);
  transition: transform 2s ease-in-out;
}

.mv .swiper-slide-active .bg-box img {
  transform: scale(1);
}

.mv .txt-box {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.mv .txt-box .container {
  height: 100%;
  display: flex;
  align-items: center;
}

.mv .txt-box .mv-tit {
  position: relative;
}

.mv .txt-box .mv-tit:before {
  content: '';
  width: 20px;
  height: 20px;
  position: absolute;
  bottom: 100%;
  right: 100%;
  border-radius: 50%;
  background-color: #1881c6;
  opacity: 0;
  transition: opacity 3s;
}

.mv .swiper-slide .up-box {
  overflow: hidden;
}

.mv .swiper-slide .up-box span {
  display: inline-block;
  transform: translateY(100%);
  opacity: 0;
  transition: transform 1s .3s ease-in-out, opacity 1s .3s ease-in-out;
}

.mv .swiper-slide-active .up-box span {
  transform: translateY(0);
  opacity: 1;
}

.mv .swiper-slide .up-box span.delay-01 {
  transition-delay: .9s;
}

.mv .swiper-slide-active .txt-box .mv-tit:before {
  opacity: 1;
}

.mv .mv-air-page {
  position: absolute;
  width: 100%;
  bottom: 29vh;
  left: 0;
}

.mv .mv-page-cont {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 15px;
  padding: 7px 15px;
  gap: 0 20px;
  width: fit-content;
}

.mv .mv-page {
  display: flex;
  align-items: center;
  gap: 20px;
}

.mv .mv-page .num {
  position: relative;
  font-variant-numeric: tabular-nums;
}

.mv .mv-page .current:before {
  content: '';
  position: absolute;
  right: -11px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 13px;
  background-color: #fff;
}

.mv .mv-progress {
  position: relative;
  width: 180px;
  height: 2px;
  background-color: #b2b2b2;
}

.mv .swiper-pagination-progressbar-fill {
  background-color: #1881c6;
}

.mv .mv-stop-play {
  width: 14px;
  height: 14px;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(/asset/img/main/mv-icon01.png);
  cursor: pointer;
}

.mv .mv-stop-play.stop {
  background-image: url(/asset/img/main/mv-icon02.png);
}

.mv-air-scroll {
  position: absolute;
  left: 0;
  width: 100%;
  bottom: 5vh;
}

/* 마우스 외곽선 */
.mv-air-scroll .scroll-down {
  position: relative;
  z-index: 3;
  gap: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* 마우스 외곽선 (요청하신 20x35 사이즈 적용) */
.mv-air-scroll .mouse {
  width: 20px;
  height: 35px;
  border: 1.5px solid #fff;
  /* 얇아진 크기에 맞춰 선 두께 조정 */
  border-radius: 12px;
  position: relative;
}

/* 움직이는 휠(점) */
.mv-air-scroll .mouse::before {
  content: '';
  width: 3px;
  /* 크기에 맞춰 휠 너비 조정 */
  height: 6px;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 6px;
  transform: translateX(-50%);
  /* 애니메이션 실행 */
  animation: scroll-move-sm 1.5s infinite;
}

/* 줄어든 높이(35px)에 맞춘 애니메이션 키프레임 */
@keyframes scroll-move-sm {
  0% {
    top: 6px;
    opacity: 0;
    height: 3px;
  }

  20% {
    opacity: 1;
    height: 6px;
  }

  80% {
    opacity: 1;
    height: 6px;
  }

  100% {
    top: 18px;
    /* 바닥에 닿기 전 사라지도록 조정 */
    opacity: 0;
    height: 3px;
  }
}

@media all and (max-width:1200px) {
  .mv .txt-box .mv-tit:before {
    width: 15px;
    height: 15px;
  }
}

@media all and (max-width:768px) {
  .mv .txt-box .mv-tit:before {
    display: none;
  }

  .mv .txt-box .container {
    justify-content: center;
  }

  .mv .txt-box .cent-box {
    text-align: center;
    filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.2));
  }

  .mv .mv-air-page {
    bottom: 5vh;
  }

  .mv .mv-page-cont {
    margin: 0 auto;
  }

  .mv-air-scroll {
    display: none;
  }
}

.main-con01 {
  padding: 170px 0 240px;
  background: url(/asset/img/main/bg01.png)no-repeat center center /cover;
}

.main-con01 .icon-list {
  display: flex;
  justify-content: space-around;
}

.main-con01 .icon-box {
  max-width: 25%;
}

.main-con01 .icon-box .li-icon {
  max-width: 220px;
  aspect-ratio: 1/1;
  margin: 0 auto;
}

.main-con01 .icon-box:nth-child(2) {
  transition-delay: .3s;
}

.main-con01 .icon-box:nth-child(3) {
  transition-delay: .6s;
}

.main-con01 .icon-box:nth-child(4) {
  transition-delay: .9s;
}

.main-con01 .icon-box .li-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media all and (max-width:1200px) {
  .main-con01 {
    padding: 140px 0 200px;
  }
}

@media all and (max-width:1024px) {
  .main-con01 {
    padding: 100px 0 150px;
  }

  .main-con01 .icon-list {
    flex-wrap: wrap;
    gap: 30px 10px;
  }

  .main-con01 .icon-box {
    width: calc(50% - 5px);
    max-width: none;
  }

  .main-con01 .icon-box:nth-child(even) {
    transition-delay: .3s;
  }

  .main-con01 .icon-box:nth-child(3) {
    transition-delay: 0s;
  }
}

@media all and (max-width:768px) {
  .main-con01 {
    padding: 80px 0 95px;
  }
  .main-con01 .icon-box .li-icon{
    max-width: 140px;
  }
}

@media all and (max-width:576px) {
  .main-con01 {
    padding: 60px 0;
  }
}

.main-con02 {
  background: url(/asset/img/main/bg02.png)no-repeat center center /cover;
  background-attachment: fixed;
}

.main-con02 .biz-list {
  display: flex;
  gap: 55px;
  flex-wrap: wrap;
}

.main-con02 .biz-list .biz-box {
  width: calc(33.333% - 36.666px);
  border-radius: 20px;
  background: url(/asset/img/main/con02-bg.png)no-repeat center center /cover;
  border: 1px solid rgba(255, 255, 255, .4);
  padding: 45px;
  /* aspect-ratio: 1/0.895; */
  position: relative;
  overflow: hidden;
  min-height: 445px;
}

.main-con02 .biz-list .biz-box:before {
  content: '';
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  left: 0;
  z-index: -1;
  top: 0;
  opacity: 0;
  transition: opacity 1s;
}

.main-con02 .biz-list .biz-box:hover:before {
  opacity: 1;
}

.main-con02 .biz-list .biz-box:nth-child(2),
.main-con02 .biz-list .biz-box:nth-child(5) {
  transition-delay: .3s;
}

.main-con02 .biz-list .biz-box:nth-child(3),
.main-con02 .biz-list .biz-box:nth-child(6) {
  transition-delay: .6s;
}

@media all and (max-width:1200px) {
  .main-con02 .biz-list {
    gap: 30px;
  }

  .main-con02 .biz-list .biz-box {
    width: calc(50% - 15px);
  min-height: auto;
  }

  .main-con02 .biz-list .biz-box:nth-child(odd) {
    transition-delay: 0s;
  }

  .main-con02 .biz-list .biz-box:nth-child(even) {
    transition-delay: .3s;
  }
}

@media all and (max-width:1024px) {
  .main-con02 .biz-list .biz-box {
    padding: 30px;
  }
}

@media all and (max-width:768px) {
  .main-con02 .biz-list {
    gap: 15px;
  }

  .main-con02 .biz-list .biz-box {
    width: 100%;
    /* aspect-ratio: auto; */
    padding: 30px 20px;
  }

  .main-con02 .biz-list .biz-box:nth-child(even) {
    transition-delay: 0s;
  }
}

.main-con03 {
  padding-top: 290px;
  position: relative;
  overflow: clip;
}

.main-con03 .container {
  display: flex;
  gap: 70px;
}

.main-con03 .bg-list {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* 섹션 전체 높이를 가짐 */
  z-index: 0;
  pointer-events: none;
}

/* 2. 실제 고정될 컨테이너 */
.main-con03 .sticky-bg-wrapper {
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.main-con03 .bg-list .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.8s ease;
}

.main-con03 .bg-list .bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 첫 번째 배경은 기본적으로 보이게 설정 */
.main-con03 .bg-list .bg.active {
  opacity: 1;
}

.main-con03 .lt-box {
  width: calc(40% - 70px);
}

.main-con03 .lt-box .common-tit-box {
  position: sticky;
  top: 0;
  left: 0;
}

.main-con03.on .lt-box .common-tit-box {
  top: 50%;
  transform: translateY(-50%);
}

.main-con03 .rt-box {
  width: 60%;
  padding-bottom: 320px;
}

.main-con03 .card-list {
  display: flex;
  flex-wrap: wrap;
  gap: 120px 80px;
}

.main-con03 .card-box {
  width: calc(50% - 40px);
  padding: 50px;
  background-color: #fff;
  border-radius: 20px;
  aspect-ratio: 1/1.245;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: background-color 1s;
}

.main-con03 .card-box:nth-child(even) {
  transform: translateY(170px);
}

/* .main-con03 .card-box.active {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, .1);
}

.main-con03 .card-box.active .card-tit,
.main-con03 .card-box.active .card-txt {
  color: #fff;
} */

@media all and (max-width:1200px) {
  .main-con03 {
    padding-top: 150px;
  }

  .main-con03 .container {
    flex-direction: column;
  }

  .main-con03 .lt-box,
  .main-con03 .rt-box {
    width: 100%;
  }

  .main-con03 .lt-box .common-tit-box {
    position: relative;
  }

  .main-con03.on .lt-box .common-tit-box {
    position: relative;
    top: auto;
    transform: none;
  }

  .main-con03 .card-list {
    gap: 80px 40px;
  }

  .main-con03 .card-box {
    width: calc(50% - 20px);
    padding: 30px 25px;
    aspect-ratio: 1/1;
    gap: 30px 0;
  }

  .main-con03 .card-box:nth-child(even) {
    transform: translateY(130px);
  }

  .main-con03 .rt-box {
    padding-bottom: 250px;
  }
}

@media all and (max-width:768px) {
  .main-con03 {
    padding-top: 120px;
  }

  .main-con03 .card-list {
    gap: 40px 20px;
  }

  /* .main-con03 .card-box{
    width: calc(50% - 10px);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background-color: rgba(255, 255, 255, .3);
  }
  .main-con03 .card-box .card-tit,
  .main-con03 .card-box .card-txt{
    color: #fff;
  } */
  .main-con03 .card-icon img {
    max-height: 77px;
  }

  .main-con03 .rt-box {
    padding-bottom: 200px;
  }
}

@media all and (max-width:650px) {
  .main-con03 {
    padding-top: 80px;
  }

  .main-con03 .card-box {
    width: 100%;
    aspect-ratio: auto;
    padding: 25px;
  }
  .main-con03 .card-box.ani{
    opacity: 0;
    transition: opacity 1s;
  }
  .main-con03 .card-box.in-view{
    opacity: 1;
  }

  .main-con03 .card-box:nth-child(even) {
    transform: none;
  }

  .main-con03 .card-icon img {
    max-height: 66px;
  }

  .main-con03 .rt-box {
    padding-bottom: 100px;
  }
}

@media all and (max-width:576px) {
  .main-con03 {
    padding-top: 60px;
  }

  .main-con03 .rt-box {
    padding-bottom: 60px;
  }
}

.main-con04 {
  background: url(/asset/img/main/bg04.png)no-repeat center center /cover;
  background-attachment: fixed;
}

.main-con04 .common-tit-box {
  filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.2));
}

.main-con04 .email-btn {
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.2);
  width: 360px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  border-radius: 30px;
  background-color: #ffffff;
  line-height: 60px;
  overflow: hidden;
}

.main-con04 .email-btn .btn-text-inner {
  display: flex;
  flex-direction: column;
  /* 세로로 배치 */
  transition: transform 0.4s cubic-bezier(0.6, 0.01, 0.05, 0.95);
  /* 부드러운 움직임 */
  height: 100%;
}

/* 호버 시 위로 50%만큼 이동 (아래에 있던 글자가 올라옴) */
.main-con04 .email-btn:hover .btn-text-inner {
  transform: translateY(-100%);
}

/* 개별 텍스트 줄 */
.main-con04 .email-btn .btn-line {
  display: block;
  height: 100%;
}

.common-tit-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media all and (max-width:1024px){
  .common-tit-flex {
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
  }
}

@media all and (max-width:768px){
  .main-con04 .email-btn{
    width: 250px;
    height: 50px;
    line-height: 50px;
  }
}



#popup {
	position: relative;
}

.popup-layer {
	z-index: 10000;
	position: absolute;
	background: #fff;
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,.25);
	animation: popup-fade .65s ease-in-out .35s forwards;
	opacity: 0;
	max-width:800px;
}

@keyframes popup-fade {
	0% { opacity: 0;
	-webkit-transform: translateY(25px);
	-ms-transform: translateY(25px);
	transform: translateY(25px); }
	100% { opacity: 1;
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0); }
}
.popup-layer__body {
	background: #fff;
}

.popup-layer__body img {
	display: block;
	margin: 0 auto;
	border: none;
	max-width: 100%;
}

.popup-layer__foot {
	background: #424242;
}

.popup-layer__foot ul {
	display:flex;
	flex-wrap: wrap;
}

.popup-layer__foot li {
	width:50%;
	padding:10px;
}

.popup-layer__foot li:first-child {
	padding-right:0;
}

.popup-layer__foot li:last-child {
	text-align: right;
}

.popup-layer__foot span {
	font-size: 1.5rem;
	color: #fff;
	cursor: pointer;
	transition:all 0.3s ease;
}

.popup-layer__foot label:hover span { opacity: .7; }

/* .popup-layer-foot { background: #424242; }
.popup-layer-foot span { font-size: 15px; color: #fff; }
.popup-layer-foot label:hover span { opacity: .7; }
.popup-layer-foot li:first-child { padding-right: 0; }
.popup-layer-foot li:last-child { text-align: right; } */


@media (max-width: 1024px){
	/* .popup-layer { z-index: 999; } */
	.popup-layer { top: 95px !important; left: 0 !important; margin: 0 5px; }
}
@media (max-width: 768px){

	.popup-layer {
		width:calc(100% - 10px);
	}

	.popup-layer img {
		max-width: none;
		width:100%;
		height: auto !important;
	}
	.popup-layer-foot span { font-size: 14px; }

}
@media (max-width: 375px){
	.popup-layer-foot li { width: 100%; }
	.popup-layer-foot li:last-child { text-align: left; }
}


.mv .swiper-box{
  display: flex;
  align-items: center;
  gap: 10px;
}
.mv .swiper-btn{
  width: 8px;
  height: 12px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: block;
  cursor: pointer;
}
.mv .swiper-btn.prev-btn{
  background-image: url(/asset/img/main/prev-btn.png);
}
.mv .swiper-btn.next-btn{
  background-image: url(/asset/img/main/next-btn.png);
}