:root {
    --primary-color: #310061;
    --font-size-base: 16px;
  }

section{ font-family: 'Pretendard';
    width: 100%; }

    
.wrap_1300 h1 {font-family: RiaSans-ExtraBold;font-size: 2.5rem; color:var(--primary-color); line-height: 1.25em; padding-top: 14px;}

main.sub  > #item_list > .titleBox_sub {margin-bottom: 0;}
main.sub  > #item_list.mb70{margin-bottom: 0 !important;}
.main_visual {background: url(/images/lounge/rounge_visual.png) no-repeat center; 
    width: 100% ;height: 712px; overflow: hidden; background-size: cover;}

.main_visual .cont_wrap {max-width: 1300px; margin: 0 auto; padding: 137px 10px 0 10px; }
.cont_wrap .main_icon {display: block; margin:  0 auto; object-fit: cover;}
.icon_list {display: flex; width: 100%;
justify-content: space-around}
.icon_list a {width: 33%; display: grid; justify-items: center;  position: relative;
    top: -400px; /* 애니메이션 시작 위치 */
    opacity: 0; /* 투명도로 시작 */
    transition: top 2s ease, opacity 2s ease; 
    align-items: center;
    }

.icon_list a.animate {
        top: 0; /* 원래 위치로 이동 */
        opacity: 1; /* 보이도록 설정 */
      }
.icon_list img {object-fit: contain; margin-top: 78px; }
.icon_list li {color:#fff;text-align: center; 
    font-family: 'RiaSans-ExtraBold'; font-size: 1.2rem; margin-top: 10px; line-height: 26px;
}
.titleBox_sub {margin-bottom: 0;}

/*스와이퍼 리스트 */

.second_wrap {background: url(/images/lounge/rounge_middle_back.png) no-repeat center; width: 100%; height: 1120px;
    background-size: cover;
}

.wrap_1300 {max-width: 1300px; margin: 0 auto; text-align: center; overflow: hidden;}
.second_txt {position: relative;
    padding-top: 136px;}
.second_txt::before {position:absolute; left: 50%; top: 0;
    content: ''; width: 1px; height: 100px;  background: var(--primary-color);}

.second_txt span::before {content: ''; width: 10px; height: 10px; transform: rotate(45deg);;
     position: absolute;  left: calc(50% - 4px); top:90px; z-index: 2; background: var(--primary-color)}

.second_txt span {font-size: 1.50em; color:#C0B0D2;}

.second_txt p {color:#777; font-size: 1.25em; padding-top: 20px;}

.second_list .swiper-slide {width: 372px; height: 476px; border: 2px solid #fff; border-radius: 500px; 
    margin-top: 16px; transition: all 0.5s ease-in-out; justify-content: center; margin-right: 7.08%;}

.second_list {display: flex; width: 100%; margin-top: 80px; transition: all 1s; }

.listtitle {position: relative; font-family: 'RiaSans-ExtraBold';
    font-weight: 800; font-size: 1.5em; margin-top: -44px; color: var(--primary-color);}

.listtitle::before {content: ''; width: 10px; height: 10px; transform: rotate(45deg);;
    position: absolute;  left: 50%; top: 39px; z-index: 2; background: var(--primary-color)}

.listdetail_hover {opacity: 0; width: 340px; height: 440px; color:#fff; border-radius: 500px; transition: opacity 0.3s ease;;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(49, 0, 97, 1)) ;}

.listthum:hover .listdetail_hover {opacity: 1;}
.listdetail_hover p { padding-top: 60%; margin-bottom: 10px; font-size: 1.5em; font-weight: 600;}
.listdetail_hover span {font-size: 1.25em;}

.listthum {width: 340px; height: 440px;  border-radius: 500px; margin: 28px 14px; object-fit: cover;}

.second_list #num01 {background: url(/images/lounge/list01.jpg) no-repeat center center;}
.second_list #num02 {background: url(/images/lounge/list02.jpg) no-repeat center center;}
.second_list #num03 {background: url(/images/lounge/list03.jpg) no-repeat center center;}
.second_list #num04 {background: url(/images/lounge/list04.jpg) no-repeat center center;}
.second_list #num05 {background: url(/images/lounge/list05.jpg) no-repeat center center;}
.second_list #num06 {background: url(/images/lounge/list06.jpg) no-repeat center center;}
.second_list #num07 {background: url(/images/lounge/list07.jpg) no-repeat center center;}

.arrow {margin-top: 60px; cursor: pointer;}
.next {width: 62px; height: 62px; background: var(--primary-color); display: inline-block; border-radius: 100%; margin-left: 10px;} 
.pre {width: 62px; height: 62px; background: #Fff; display: inline-block; border-radius: 100%;}

.next img {margin-top: 34%;}
.pre img {margin-top: 34%;}

.swiper-wrapper {transition-timing-function: ease-in-out; /* 부드러운 전환 효과 */
}
/* 스와이퍼 리스트 끝 */

.loungelistwrap {width: 100%; height: auto; padding-bottom: 40px;
    background: url(/images/lounge/rounge_third_back.png) no-repeat center; background-size: cover;}



.listtap li {font-size: 1.5rem; color: #fff; font-family: 'RiaSans-ExtraBold'}

.listtap {display: flex; justify-content: space-evenly; margin-top: 24px; margin-bottom: 32px;}
.listtap .newlounge {position: relative;}
.listtap .newlounge::after {content: ''; background: url(/images/lounge/NEW.svg); position: relative; top: -20px; left: -20px;
    display: inline-block; width: 37px; height: 19px;}
.listtap a {padding: 24px 0; border-bottom: 1px solid #fff; width: 50%; opacity: 0.5; transition: all 0.5s;}
.listtap .active {opacity: 1;}
.thum_list {display: flex; flex-wrap: wrap}
.thum_list .list_grid {display: grid; grid-template-columns: repeat(3, 1fr); background-color: #310061; position: relative;}
.loungelist02, .loungelist03 {display: none;}
.loungelist01 {opacity: 1;}
.thum_list div {position: relative; cursor: pointer;}
.list_more {position: absolute; left: calc(50% - 22px); top: 40%; width: 44px; height: 44px; border-radius: 100%; background:var(--primary-color);
    text-align: center; color: #fff; line-height:40px; font-size: 2.0em; opacity: 0; transition: opacity 0.3s ease; z-index: 5;} 

.thum_list .list_grid div:hover .list_more {opacity: 1;}
.thum_list .list_grid div:hover img {-webkit-filter: opacity(0.5) }
/* 모달창 */
.modal {
    display: none; /* 기본적으로 숨김 */
    position: fixed; top: 0; left: 0; width: 100%; height: 100vh; max-height: 100%;
    background: rgba(0, 0, 0, 0.8); justify-content: center;
    align-items: center; z-index: 99;
    overflow: hidden;
}

.modal-content {
    position: relative;
    max-width: 90% ;
    max-height:100%;
    padding: 20px;
}

.modal-swiper .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
.modal-content img {
     max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.modal-content .close {
    position: absolute; text-align: center; line-height: 45px; z-index: 999; pointer-events: auto;
    top: 10px;  right: 10px;  font-size: 24px;  color: #fff;  cursor: pointer; background: #000;
    width: 50px; height: 50px; border-radius: 50%;
}
/* 모달끝 */
.loungeMap {width: 100%; background: #F7F5FF;  }

.mapifame_wrap {position: relative;}
.mapwrap {text-align: left; padding-top: 136px; display: grid; grid-template-columns: 1fr 2fr; padding-bottom: 40px;}

.map_txt {position: relative;}
.map_txt::before {content: ''; width: 10px; height: 10px; transform: rotate(45deg); background: var(--primary-color);
position: absolute; left: 5px; top: -40px;}


.map_txt span {font-size: 1.50em; color:#C0B0D2;}
.map_txt p { color: #777; font-size: 1.25em; padding-top: 30px; line-height: 28px;}

.menu_list {padding: 20px 24px; background: #fff;  width: 94% ; margin-top: 16px; position: relative;
display: grid; grid-template-columns: 3fr 1fr; cursor: pointer;}

.menu_list:hover {border:2px solid #310061;}

.map_menu .listactive {border: 2px solid #310061; transition: opacity 0.3s ease;}

.menu_list p {padding-top: 16px; font-size: 1.2em; padding-left: 24px; color: #777;}
.address_de {grid-column: 1 / 3; position: relative;}
.call {grid-column: 1 / 3; position: relative;}

.menu_list .address_copy {font-size: 16px; position: relative; line-height: 32px; padding-top: 0; cursor: pointer;}
.menu_list .address_copy::before{content: ''; width:28px; height: 28px; display: inline-block;
    background: url(/images/lounge/address_icon.png)no-repeat center; position: absolute; left:-15%; top: 3%;} 

.menu_list h2 {font-family: 'Pretendard'; color: var(--primary-color);}
.address_de::before{content:''; display: inline-block;width: 14px; height: 14px;
     background: url(/images/lounge/location_icon.png)no-repeat; position: absolute; left: 0; top: 18px;}
.call::before {content:''; display: inline-block;width: 14px; height: 14px;
    background: url(/images/lounge/phon_icon.png)no-repeat; position: absolute; left: 0; top: 18px;}

.menu_list::after {content:''; display: inline-block;width: 11px; height: 21px;
    background: url(/images/lounge/arrow_puple.png)no-repeat; transform: rotate(180deg); position: absolute; top: 48%; right: 5%; 
    opacity: 0; transition: all 0.5s;}

.menu_list:hover::after {opacity: 1;}
.loungeMap iframe {width: 100%; height: 100%;}

#imageModal .swiper-pagination {background: #111; max-width: 100px; position: absolute; left: calc(50% - 50px); bottom: 40px;
     padding: 12px 24px; color: #fff; border-radius: 20px; z-index: 100;}


/* 라운지소개아이콘 추가 251118 */
.thum_list .lounge_addtxt {flex-basis: 100%; width: 100%; color: #fff;}
.lounge_addtxt .addicon_wrpper {display: flex; justify-content: center; gap: 20px; background: #ffffff70 0% 0% no-repeat padding-box;
border-radius: 5px;opacity: 1; backdrop-filter: blur(37px); flex-shrink: 0; overflow-y: auto;
-webkit-backdrop-filter: blur(37px); padding: 20px 0; margin-bottom: 20px;}

.lounge_addtxt .addicon_wrpper li { flex-shrink: 0; 
    display: flex; gap: 10px; justify-content: center; font-size: 1.2rem; align-items: center; }
.lounge_addtxt .addicon_wrpper::-webkit-scrollbar {display: none;}
.lounge_addtxt .addicon_wrpper{-ms-overflow-style: none;}
.lounge_addtxt .addicon_wrpper li img {width: 26px; height: 26px; object-fit: scale-down; background-repeat: no-repeat;}
.lounge_addtxt .addicon_wrpper li:not(:last-child)::after {content: ''; display: inline-block;
    width: 5px; height: 5px; border-radius: 10px; background: #e4c6ff; margin-left: 10px;}
.lounge_addtxt > p {font-size: 1.5rem; padding-bottom: 20px; line-height: 130%;}


@media (max-width:950px) {
.thum_list {grid-template-columns: repeat(2, 1fr);}
/* .second_list .swiper-slide {margin-right: 72px;} */
.thum_list .list_grid img {height: 180px; object-fit: cover; width: 100%;}
.lounge_addtxt .addicon_wrpper {justify-content: flex-start; padding-left: 20px;}
}

@media (max-width:720px) {
    .wrap_1300 {padding: 0 10px;}
    .mapwrap {grid-template-columns: none; text-align: center;}
    .map_txt {margin-top: 100px;}
    .map_txt::before {left: 50%;}
    .map_menu {display: flex; gap:3%; margin-bottom: 3%; overflow-y: auto;}
    .menu_list {display:flex; flex-direction: column; flex-wrap: wrap; align-items: center; text-align: center;}
    .address_de {display: none;}
    .call {display: none;}
    .menu_list {padding: 20px;}
    .loungeMap iframe{height: 500px;}
    .menu_list::after {transform: rotate(270deg); top:75%; right: 48%}
    .second_list {padding: 0 5%;}
    #imageModal .swiper-pagination {bottom: -40px};
    .listtap a {padding: 20px 0;}
    .listtap .newlounge::after {position: absolute; top: -20px; left: calc(50% - 43px);}
    .modal-content .close {top: -50px; border: 1px solid #555555;}
    .listtap {margin-bottom: 20px;}
    .menu_list h2 {margin-bottom: 12px; font-size: 1rem;}
    .wrap_1300 h1 {font-size: 2rem;}
    .lounge_addtxt > p {font-size: 1.25rem;}
    .lounge_addtxt br {display: none;}
    .lounge_addtxt .addicon_wrpper {padding: 14px 0 14px 14px;}
}

@media (max-width:450px) {
    .second_list .swiper-slide {width: 280px; height: 354px;}
    .listthum {width: 248px; height: 318px;}
    .listdetail_hover {width: 248px; height: 318px; opacity: 1; background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(49, 0, 97, 0.7));}
    .main_visual .cont_wrap {padding-top: 100px;}
    .icon_list {flex-wrap: wrap; margin-top: 15%;}
    .icon_list img {margin-top: 20px;}
    .arrow {margin-top: 40px; padding: 0 10px;} 
    .listtap li {font-size: 1.25rem; font-weight: 300; padding: 0 10px;}
    .second_wrap {height: 956px;}
    .more_wrap a:hover .rentcar_more {padding: 15px 40px 15px 120px;}
    .menu_list:hover::after {opacity: 0;}
    #imageModal .swiper-pagination {padding: 12px;}
  
}