



/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.MAIN_maintop_AB {overflow: hidden; position: relative; height:100vh; background-color: #000; }
.MAIN_maintop_AB .contents-container { display: flex; justify-content: center; height:100vh; }

}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
.MAIN_maintop_AB {overflow: hidden; position: relative; height:400PX!important; background-color: #000;width: 100% ; float: left }
.MAIN_maintop_AB .contents-container { display: flex; justify-content: center;height: 100%;width: 100% ; float: left}

}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/




.MAIN_maintop_AB .slide-area { width: 100vw; height: 100%; }
.MAIN_maintop_AB .swiper { display: flex; justify-content: center; align-items: center; width: 100vw; height: 100%; }
.MAIN_maintop_AB .swiper-slide { display: flex; justify-content: center; align-items: center; padding: 0 0rem; height: 100%; }

	.MAIN_maintop_AB picture { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
	.MAIN_maintop_AB picture>div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }



.MAIN_maintop_AB .swiper-slide picture>div img { width: 100%; height: 100%; object-fit: cover; }
.MAIN_maintop_AB .visual-text-box { position: relative; width: 100%; margin-bottom: 100px; }
.MAIN_maintop_AB .visual-text-box .img { width:clamp(200px, 23.438vw, 300px); margin-bottom:  clamp(10px, 1.563vw, 20px) }
.MAIN_maintop_AB .visual-text-box .img img { width: 100%; }
.MAIN_maintop_AB .container-lg .visual-text-box { max-width:156rem; }
.MAIN_maintop_AB .container-md .visual-text-box { max-width: 144rem; }
.MAIN_maintop_AB .container-sm .visual-text-box { max-width: 128rem; }
.MAIN_maintop_AB .container-full .visual-text-box { max-width: 100%; }
@media only all and (max-width:767px) {.MAIN_maintop_AB .visual-text-box { padding:0px 0px 0px 0px!important;  	-webkit-transform: scale(0.7);
	transform: scale(0.7); margin-top: 150px; margin-left: -50px}
}


.MAIN_maintop_AB  .visual-text-box .tx1 { color: #666; font-size: var(--tit-md-size); font-family:var(--ff-ko6)!important; font-weight:  normal; line-height: 110%; margin-bottom:clamp(0px, 0.781vw, 10px); }


.MAIN_maintop_AB  .visual-text-box .tx2 { color: #000; font-size: var(--tit-lg-size); font-family:var(--ff-ko6)!important; font-weight: normal; line-height: 110%; margin-bottom: clamp(0px, 0.781vw, 20px); }
.MAIN_maintop_AB  .visual-text-box .tx3 { color: #333; font-size: var(--tit-mds-size); }

/**** 모바일 ****/

@media only all and (max-width:767px) {
	
.MAIN_maintop_AB  .visual-text-box .tx1 { color: #fff; font-size: var(--tit-md-size); font-family:var(--ff-ko6)!important; font-weight:  normal; line-height: 110%; margin-bottom: 0px; }

.MAIN_maintop_AB  .visual-text-box .tx2 {  color: #fff; font-size: var(--tit-lg-size); font-family:var(--ff-ko6)!important; font-weight: normal; line-height: 110%; margin-bottom: 0px; }
.MAIN_maintop_AB  .visual-text-box .tx3 { color: #fff; font-size: var(--tit-mds-size); }
}

.MAIN_maintop_AB .visual-text-box strong { display: inline-block; color: #fff; color: #fff; line-height: 120%; position: relative; }
.MAIN_maintop_AB .visual-text-box p { margin-top: 1.7rem; color: #fff; }
.MAIN_maintop_AB .pagination_fraction { position: absolute; z-index: 1; transform: translateY(-20rem); width:100%; }
.MAIN_maintop_AB .container-lg .pagination_fraction { max-width: 156rem; }
.MAIN_maintop_AB .container-md .pagination_fraction { max-width: 144rem; }
.MAIN_maintop_AB .container-sm .pagination_fraction { max-width: 128rem; }


.MAIN_maintop_AB .wrap { display: inline-flex; align-items: center; gap: .4rem; color: rgba(255, 255, 255, 0.5); font-family: var(--ff-en4); }
.MAIN_maintop_AB .pagination_fraction .current,
.MAIN_maintop_AB .pagination_fraction .all { font-weight: var(--fw-bold); }
.MAIN_maintop_AB .pagination_fraction .current { color: #fff; }
.MAIN_maintop_AB .control-bottom { display: flex; align-items: center; gap:10px; position: absolute; z-index: 1; padding-left: 1rem; width: 100%; bottom: 10%; }
/**** 모바일 ****/
@media only all and (max-width:767px) {.MAIN_maintop_AB .control-bottom { bottom: 0px; gap:5px; padding-bottom: 30px ; padding-left: 30px}
}


.MAIN_maintop_AB .container-lg .control-bottom { max-width: 156rem!important; }
.MAIN_maintop_AB .container-md .control-bottom { max-width: 144rem!important; }
.MAIN_maintop_AB .container-sm .control-bottom { max-width: 128rem!important; }
.MAIN_maintop_AB .container-full .control-bottom { max-width: 100%!important; }

.MAIN_maintop_AB .swiper-pagination { gap: 1rem; position: static; }
.MAIN_maintop_AB .swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal { display: flex; justify-content: flex-start; align-items: center; width: auto; }
.MAIN_maintop_AB .swiper-pagination-bullet { opacity: 1; position: relative; margin: 0; width: 1.2rem; height: 1.2rem; background-color: var(--white); border-radius: 100%; }
.MAIN_maintop_AB .swiper-pagination-bullet:first-child { margin-left: 0; }
.MAIN_maintop_AB .swiper-pagination-bullet-active { background-color:var(--primary); }
.MAIN_maintop_AB .swiper-pagination-bullet-active::after { transform: scale(1); transition: transform 0.2s; }
.MAIN_maintop_AB .swiper-button-play { display: none; }
.MAIN_maintop_AB .swiper-button-play,
.MAIN_maintop_AB .swiper-button-pause { flex-shrink: 0; width: 2rem; height: 2rem; opacity: 0.5; color: #fff; cursor: pointer; }
.MAIN_maintop_AB .swiper-button-play img,
.MAIN_maintop_AB .swiper-button-pause img { width: 100%; height: 100%; object-fit: cover; vertical-align: top; }
.MAIN_maintop_AB .swiper-button-play:hover,
.MAIN_maintop_AB .swiper-button-pause:hover { opacity: 1; }
.MAIN_maintop_AB .control-bottom .swiper-button-next { position: relative; width:30px; height: 50px; background: none; margin-top: -5px; }
.MAIN_maintop_AB .control-bottom .swiper-button-next:before { content: "\ec49"; font-family: unicons-line; color: #fff; font-size:30px; }
.MAIN_maintop_AB .control-bottom .swiper-button-next:after { display: none!important; }
.MAIN_maintop_AB .control-bottom .swiper-button-prev { position: relative; width:30px; height: 50px; background: none; margin-top: -5px; }
.MAIN_maintop_AB .control-bottom .swiper-button-prev:before { content: "\eb9f"; font-family: unicons-line; color: #fff; font-size:30px; }
.MAIN_maintop_AB .control-bottom .swiper-button-prev:after { display: none!important; }
.MAIN_maintop_AB .control-bottom .linebar { width:150px; border-bottom: 1px solid rgba(204,204,204,0.56); float: left; }



.MAIN_maintop_AB .visual-text-box strong.sw1_icon:before { content: ""; position: absolute; right: -50px; top: -50px; width: 130px; height:140px; background: url("../images/icon_love.png")no-repeat center center; }
.MAIN_maintop_AB .visual-text-box strong.sw2_icon:before { content: ""; position: absolute; right: -50px; top: -50px; width: 130px; height:140px; background: url("../images/icon_love.png")no-repeat center center; }
.MAIN_maintop_AB .visual-text-box strong.sw3_icon:before { content: ""; position: absolute; right: -50px; top: -50px; width: 130px; height:140px; background: url("../images/icon_love.png")no-repeat center center; }
/* 구분 -----------------------------------*/
/**** pc ****/
@media only all and (min-width:768px) {
.swiper-progressbar-wrap { position: absolute; bottom: 20px; left:220px; width:calc(100% - 220px); height: 4px; background: rgba(0, 0, 0, 0.1); z-index: 10; }
}
/**** pc2 ****/
@media all and (max-width:1280px) and (min-width:768px) {
}
/**** 모바일 ****/
@media only all and (max-width:767px) {
.swiper-progressbar-wrap { position: absolute; bottom: 0px; left:0px; width:100%; height: 4px; background: rgba(0, 0, 0, 0.1); z-index: 10; }
}
/**** 모바일2 ****/
@media only all and (max-width:400px) {
}
/* 구분 //end -----------------------------------*/


.swiper-progressbar { height: 100%; width: 0%; background: red; transition: width 0.8s ease-in-out; }