@charset "utf-8";
/* CSS Document */

/*skip*/
#skip{height:0}
#skip a{text-align:center; width:100%; height:0px; display:block; position:absolute; left:0; top:-100px;}
#skip a:focus, #skip a:active{font-size:20px; font-weight:700; color:#FFFFFF; line-height:42px; background:#000000; position:absolute; top:0; height:42px; z-index:1000;}

/*layout*/
#wrap{min-width:1280px; position:relative;}
#wrap #container{padding-bottom:530px;}

/*header*/
#header{width:100%; min-width:1280px; height:70px; background:rgba(255, 255, 255, 0); border-bottom:1px solid rgba(255, 255, 255, 0.2); padding:0 40px; position:fixed; top:0; left:0; right:0; display:flex; justify-content:space-between; align-items:center; -webkit-transition:background 0.3s; transition:background 0.3s; z-index:999;}
#header .logo{width:302px; display:flex; justify-content:flex-start; align-items:center;}/*2025-06-16 수정*/
#header .logo .ciTht{width:130px; height:20px; background:url(https://www.thehyundaitravel.com/htl/common/images/premium/bi_tht_w.svg) no-repeat; background-size:100%; text-indent:-999px; overflow:hidden; display:block;}
#header .logo .ciHotel{font-size:20px; font-weight:700; color:#FFFFFF; letter-spacing:-1.5px; margin-left:24px; line-height:1; display:block; position:relative;}
#header .logo .ciHotel:after{content:''; width:1px; background:#FFFFFF; position:absolute; top:0px; bottom:0px; left:-12px;}
#header .gnb{display:flex; justify-content:center; flex-wrap:wrap; gap:20px; position:absolute; left:50%; transform:translateX(-50%);}/*2025-06-16 수정*/
#header .gnb .menu{font-size:20px; line-height:70px; color:#FFFFFF; display:block;}
#header .gnb .menu.active{font-weight:700; position:relative;}
#header .gnb .menu.active:after{content:''; height:2px; background:#FFFFFF; position:absolute; bottom:0; left:0; right:0; }
#header .utill{width:300px; display:flex; justify-content:flex-end; align-items:center; gap:20px;}/*2025-06-16 수정*/
#header .utill > a{width:32px; height:32px; text-indent:-999px; overflow:hidden;}
#header .utill .member > a{font-size:13px; color:#FFFFFF; line-height:1;}/*2025-06-12 추가*/
#header .utill .mypage{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_mypage_white.svg) no-repeat center;}
#header .utill .ththome{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_home_white.svg) no-repeat center;}
#header.fixed, .sub #header{background:rgba(255, 255, 255, 1); border-bottom:1px solid #E5E5E5;}
.sub #header{position: sticky;}
#header.fixed .logo .ciTht, .sub #header .logo .ciTht{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/bi_tht.svg) no-repeat; background-size:100%;}
#header.fixed .ciHotel, .sub #header .ciHotel{color:#000000;}
#header.fixed .ciHotel:after, .sub #header .ciHotel:after{background:#E5E5E5;}
#header.fixed .gnb .menu, .sub  #header .gnb .menu{color:#000000; position:relative;}
#header.fixed .gnb .menu.active:after, .sub #header .gnb .menu.active:after{background:#000000;}
#header.fixed .utill .member > a, .sub #header .utill .member > a{color:#000000;}/*2025-06-12 추가*/
#header.fixed .utill .mypage, .sub #header .utill .mypage{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_mypage_black.svg) no-repeat;}
#header.fixed .utill .ththome, .sub #header .utill .ththome{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_home_black.svg) no-repeat;}

/*lnb*/
.lnb{border-bottom:1px solid #E5E5E5; display:flex; justify-content:center; align-items:center; gap:40px; z-index:999;}
.lnb .menu{font-size:18px; line-height:70px;}
.lnb .menu.active{font-weight:700;}
.main .lnb{background:#FFFFFF; -webkit-transition:background 0.3s; transition:background 0.3s;}
.main .lnb.fixed, .sub .lnb{background:#F7F7F7; position:sticky; top:70px; left:0;}

/*footer 2025-06-05 수정*/
#footer{background:#F7F7F7; border-top:1px solid #E5E5E5; padding:50px 0; position:absolute; left:0; right:0; bottom:0;}
#footer .sectionFooter{display:flex; align-items:flex-end; gap:20px; }
#footer .sectionFooter.callcenterD{border-bottom:1px solid #E5E5E5; padding-bottom:24px; justify-content:flex-start; }
#footer .sectionFooter.companyD{justify-content:space-between;}
#footer .sectionFooter .callcenter + .callcenter{border-left:1px solid #E9E9E9; padding-left:20px;}
#footer .sectionFooter .callcenter .time{font-size:14px; line-height:22px;}
#footer .sectionFooter .callcenter .tel{font-size:20px; color:#555555; margin-top:8px;}
#footer .sectionFooter .callcenter .tel a{color:#004D45; text-decoration:underline;}
#footer .rule{padding:24px 0; display:flex; justify-content:flex-start; gap:25px;}
#footer .rule li{line-height:1; position:relative;}
#footer .rule li + li:after{content:''; width:1px; background:#C8C8C8; position:absolute; top:0; bottom:0; left:-12px;}
#footer .rule li a{color:#555555;}
#footer .company{font-size:14px; color:#555555;}
#footer .company .companyInfo{display:flex; justify-content:flex-start; gap:40px;}
#footer .company .companyInfo + .companyInfo{margin-top:8px;}
#footer .company .copyright{margin-top:20px;}
#footer a{color:#555555;}

/*quick*/
.quick{position:fixed; bottom:100px; right:40px; z-index:999;}
.quick > a{width:80px; height:80px; border-radius:40px; display:block; box-shadow:10px 10px 20px rgba(0,0,0,0.2);}
.quick > a + a{margin-top:12px;}

/*common*/
.blind{display:none !important;}
.inner{width:1280px; margin:0 auto;}
.sub .contentsHeader{margin-top:72px; margin-bottom:48px;}
.sub .contentsHeader h2{font-size:40px;}
.sub .contentsHeader p{font-size:18px; color:#797979; margin-top:24px;}
.sub .pageUtill{margin-top:24px; position:relative;}
.sub .pageUtill .total{font-size:14px; position: absolute; top:18px; left:0;}
.sub .pageUtill .total .num{font-size:18px; font-weight:700;}
.listContent{margin-top:32px;}

/*main*/
.main .visual{width:100%; height:480px; position:relative;}
.main .visual:after{content:''; position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,0.20);}
.main .visual > img{width:100%; height:100%; object-fit:cover; z-index:1;}
.main .visual .intro{color:#FFFFFF; width:1280px; position:absolute; bottom:40px; left:50%; transform:translateX(-50%); z-index:1}
.main .visual .intro .title{font-size:40px; font-weight:700; line-height:1.3;}
.main .visual .intro .text{font-size:20px; margin:12px 0;}
.main .section{margin-top:72px;}
.main .sectionHeader{display:flex; justify-content:space-between; align-items:flex-start;}
.main .sectionHeader .title{font-size:32px;}

/*button*/
.btnD{display:flex; justify-content:flex-start; align-items:center; gap:8px;}
.btnD.btnRight{justify-content:flex-end;}
.btnD.btnCenter{justify-content:center;}
.btnD .btn{font-weight:500; border-radius:20px; padding:12px 20px;}
.btnD .btn.btnWhite{color:#004D45; background:#FFFFFF;}
.btnD .btn.btnText{color:#797979; text-decoration:underline; padding:0;}
.btnD .btnIcon{border:1px solid #C8C8C8; border-radius:4px; padding:11px 12px 11px 44px;}
.btnD .btnIcon.btnToggle{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_filter.svg)no-repeat 12px 50%;}
.btnD .btn.btnMore{text-align:center; width:408px; border:1px solid #C8C8C8; border-radius:4px; margin-top:48px;}
.btnD .btn.btnMore .icoMore{padding-right:20px; position:relative;}
.btn.btnMore .icoMore:after{content:''; width:12px; height:12px; background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_btn_arrow_bottom.svg)no-repeat; position:absolute; top:50%; right:0; transform:translateY(-50%);}
.btn.btnMore.disabled{color:#8A8A8A; background:#F6F6F6;}
.btn.btnMore.disabled .icoMore:after{content:''; width:12px; height:12px; background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_btn_arrow_bottom_disabled.svg)no-repeat; position:absolute; top:50%; right:0; transform:translateY(-50%);}

/*badge*/
.badgeD{display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:flex-start; gap:4px; position:absolute; top:20px; left:20px; right:20px;}/*2025-05-20 수정*/
.badge{font-size:14px; font-weight:700; color:#004D45; background:#FFFFFF; border-radius:15px; padding:8px 12px;}

/*tab*/
.tabD{}
.tabD .tabBtn{width:100%; height:42px; display:flex; justify-content:flex-start; align-items:center; gap:4px;}
.tabD .tabBtn .item{font-size:16px; font-weight:400; color:#797979; text-align:center; vertical-align: middle; background:#FFFFFF; border:1px solid #C8C8C8; border-radius:20px; padding:11px 20px; cursor:pointer;}
.tabD .item:hover{font-weight:500;}
.tabD .item.isCurrent{font-weight:500; color:#FFFFFF; background:#000000; border:1px solid #000000;}
.tabD .tabCont{}

/*fliter*/
.fliterD{}
.fliterD .filter{background:#F1F1F1; border-radius:12px; margin-top:12px; padding:24px; display:flex; flex-wrap:wrap; justify-content:flex-start; }
.fliterD .filter .filterOption{display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:flex-start; }
.fliterD .filter .filterOption + .filterOption{margin-top:12px;}
.fliterD .filter .filterOption p{font-weight:500; width:72px; margin-top:5px;}
.fliterD .filter .filterOption ul{width:calc(100% - 72px); display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:center; gap:4px;}
.fliterD .filter .filterOption ul li a{font-size:14px; line-height:1; display:block; background:#FFFFFF; border-radius:4px; padding:10px 12px; }
.fliterD .filter .filterOption ul li a.active{color:#FFFFFF; background:#00696D;}
.fliterD .selectOption{margin-top:12px; display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:center; gap:4px;}
.fliterD .selectOption li{font-size:14px; color:#FFFFFF; line-height:1; background:#00696D; border-radius:4px; padding:10px 12px; display:flex; justify-content:center; align-items:center; gap:8px;}
.fliterD .selectOption li .btnClose{width:14px; height:14px; background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_filter_close.svg)no-repeat center center, #FFFFFF; border-radius:50%; display:inline-block; text-indent:-999px; overflow:hidden;}

/*호텔 정보*/
.hotel{line-height:1; z-index:2;}
.hotel .location{font-size:14px;}
.hotel .name{margin-top:12px;}
.hotel .name .ko{font-size:20px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.hotel .name .en{font-size:14px; line-height:1.2; margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.hotel .benefitD{display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; row-gap:8px; column-gap:20px;}
.hotel .benefitD .benefitIcon{font-size:14px; line-height:20px; padding-left:24px; position:relative;}
.hotel .benefitD .benefitIcon:after{content:''; width:20px; height:20px; position:absolute; left:0; right:0;}

/*card_list*/
.listCard{display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:flex-start; gap:28px;}
.listCard .card{width:408px; border:1px solid #E5E5E5; border-radius:16px; display:block; overflow:hidden;}
.listCard .card .thum{position:relative; z-index:-1;}
.listCard .card .hotel{height:300px; background:#FFFFFF; border-radius:16px; margin-top:-16px; padding:20px;}
.listCard .card .hotel .location{color:#797979;}
.listCard .card .hotel .benefitD{height:76px;}
.listCard .card .hotel .benefitD .benefitIcon{width:calc(50% - 10px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.listCard .card .hotel .hotelInfo{margin-top:20px;}
.listCard .card .hotel .hotelInfo .title{font-size:14px; color:#797979; margin-bottom:8px;}
.listCard .card .hotel .hotelInfo .dicount{font-weight:700; color:#004D45; line-height:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; -webkit-line-clamp:2; -webkit-box-orient:vertical;}


/*card_banner*/
.listBanner{display:grid; grid-template-columns:repeat(2, minmax(626px, 1fr)); gap:28px;}
.listBanner .banner{width:626px; height:320px; background-size:cover; border-radius:16px; padding:20px; position:relative; overflow:hidden;}
.listBanner .banner.left{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/thum_recomm1.jpg) no-repeat center;}
.listBanner .banner.right{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/thum_recomm2.jpg) no-repeat center;}
.listBanner .banner:after{content:''; background:linear-gradient(to bottom, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0.48) 80%);  position:absolute; top:0; bottom:0; left:0; right:0;}
.listBanner .banner .hotel{color:#FFFFFF; position:absolute; bottom:20px; left:20px; right:20px;}
.listBanner .banner .hotel .benefitD{margin-top:16px;}

/*리스트더보기*/

/*혜택 아이콘*/
.benefitD .airportbus{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_airportbus_black.svg) no-repeat;}
.benefitD .allinclusive{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_allinclusive_black.svg) no-repeat;}
.benefitD .breakfast{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_breakfast_black.svg) no-repeat;}
.benefitD .checkinout{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_checkinout_black.svg) no-repeat;}
.benefitD .credit{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_credit_black.svg) no-repeat;}
.benefitD .discount{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_discount_black.svg) no-repeat;}
.benefitD .fandb{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_fandb_black.svg) no-repeat;}
.benefitD .golf{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_golf_black.svg) no-repeat;}
.benefitD .kids{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_kids_black.svg) no-repeat;}
.benefitD .lounge{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_lounge_black.svg) no-repeat;}
.benefitD .membership{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_membership_black.svg) no-repeat;}
.benefitD .minibar{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_minibar_black.svg) no-repeat;}
.benefitD .parking{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_parking_black.svg) no-repeat;}
.benefitD .room{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_room_black.svg) no-repeat;}
.benefitD .sightseeing{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_sightseeing_black.svg) no-repeat;}
.benefitD .spa{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_spa_black.svg) no-repeat;}
.benefitD .themepark{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_themepark_black.svg) no-repeat;}
.benefitD.white .airportbus{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_airportbus_white.svg) no-repeat;}
.benefitD.white .allinclusive{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_allinclusive_white.svg) no-repeat;}
.benefitD.white .breakfast{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_breakfast_white.svg) no-repeat;}
.benefitD.white .checkinout{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_checkinout_white.svg) no-repeat;}
.benefitD.white .credit{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_credit_white.svg) no-repeat;}
.benefitD.white .discount{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_discount_white.svg) no-repeat;}
.benefitD.white .fandb{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_fandb_white.svg) no-repeat;}
.benefitD.white .golf{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_golf_white.svg) no-repeat;}
.benefitD.white .kids{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_kids_white.svg) no-repeat;}
.benefitD.white .lounge{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_lounge_white.svg) no-repeat;}
.benefitD.white .membership{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_membership_white.svg) no-repeat;}
.benefitD.white .minibar{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_minibar_white.svg) no-repeat;}
.benefitD.white .parking{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_parking_white.svg) no-repeat;}
.benefitD.white .room{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_room_white.svg) no-repeat;}
.benefitD.white .sightseeing{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_sightseeing_white.svg) no-repeat;}
.benefitD.white .spa{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_spa_white.svg) no-repeat;}
.benefitD.white .themepark{background:url(https://www.thehyundaitravel.com/htl/common/images/premium/ico_themepark_white.svg) no-repeat;}