@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, #root{position:relative; min-height:100%;}
#wrap.travelSt #container{padding-bottom:416px;}
#wrap.travelSt #contents{margin-top:40px; padding:0 20px;}
#wrap.chatHotel #contents{position:relative;}

/*header*/
#header{background:#FFFFFF; border-bottom:1px solid #E5E5E5; padding:20px; display:flex; justify-content:space-between; align-items:center; position:sticky; top:0; left:0; right:0; z-index:999;}
#header .logo a{display:flex; justify-content:flex-start; align-items:center;}
#header .logo .ci_tht{width:40px; height:14px; background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/m_bi_tht.svg) no-repeat; background-size:100%; text-indent:-999px; overflow:hidden; display:block;}
#header .logo .ci_hotel{font-size:14px; font-weight:700; margin-left:16px; line-height:1; display:block; position:relative;}
#header .logo .ci_hotel:after{content:''; width:1px; background:#E5E5E5; position:absolute; top:0px; bottom:0px; left:-8px;}
#header > .gnb, #header > .member{display:none;}
.canvasToggle{width:20px; height:20px; background:url('https://img.hyundaidreamtour.com/images/aihdt/hotel/m_btn_gnb_menu.svg')no-repeat 50% 50%; text-indent:-999px; overflow:hidden; transition:all 0.3s ease-in-out;}
.canvasToggle.opaque{background:#FFFFFF;}
.offCanvas{color:#000000; width:100%; height:100%; background:#FFFFFF; transform:translateX(100%); transition-property:transform; transition-duration:0.4s; transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1); position:fixed; right:0; top:0; z-index:999;}
.canvasisOpen .offCanvas{transform:translateX(0); visibility:visible; -webkit-overflow-scrolling:touch;}
.offCanvas .canvasHeader{background:#FFFFFF; padding:20px 15px; display:flex; align-items:center; gap:12px; position:sticky; top:0; z-index:999;}
.offCanvas .canvasHeader .member{font-size:14px; display:flex; justify-content:space-between; align-items:center;}
.offCanvas .canvasHeader .member{display:flex; justify-content:flex-end; gap:12px;}
.offCanvas .canvasHeader .member .my, .offCanvas .canvasHeader .member .logout{line-height:16px; padding-left:20px; display:block; position:relative;}
.offCanvas .canvasHeader .member .logout{cursor:pointer;}
.offCanvas .canvasHeader .member .my:after{content:''; width:16px; height:16px; background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/m_ico_my.svg) no-repeat; background-size:100%; position:absolute; top:0; left:0;}
.offCanvas .canvasHeader .member .logout:after{content:''; width:16px; height:16px; background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/m_ico_logout.svg) no-repeat; background-size:100%; position:absolute; top:0; left:0;}
.offCanvas .canvasHeader .canvasClose{width:20px; height:20px; margin-left:auto; background:url('https://img.hyundaidreamtour.com/images/aihdt/hotel/m_ico_close.svg')no-repeat 50% 50%; text-indent:-999px; overflow:hidden;}
.offCanvas .canvasCont {height:calc(100% - 60px); overflow-y:auto;}
.gnb > li > a{font-size:16px; font-weight:500; line-height:50px; color:#111111; padding:0 20px; display:flex; justify-content:space-between; align-items: center;}
.gnb > li.open a{color:#004D45;}
.gnb > li .submenu{background:#F7F7F7; padding:10px 0; overflow:hidden; display:none;}
.gnb > li .submenu li a{font-size:14px; color:#111111; line-height:40px; padding:0 20px; display:block; transition:.1s; -webkit-transition:.1s;}
span.dArrow{float:right; position:relative; transition: 0.360s;}
span.dArrow:after{content:''; width:10px; height:6px; background: url(http://img.hyundaidreamtour.com/images/aihdt/hotel/m_ico_gnb_arrow.svg) no-repeat; position:absolute; top:50%; right:0; transform:translateY(-50%);}
span.dArrow.dDown:after {transform:translateY(-50%) rotate(180deg); transition:transform 0.3s ease;}
.history{padding:0 20px;}
.history .chatList{}
.history .chatList + .chatList{margin-top:10px;}
.history .chatList.thisYear .year{display:none;}
.history .chatList .year{color:#797979; font-weight:400;}
.history .chatList li{margin-top:5px;}
.history .chatList li a{font-weight:300; color:#797979; display:flex; justify-content:space-between; gap:10px;}
.history .chatList li a.active{font-weight:400; color:#303030;}/*2025-02-12 추가*/
.history .chatList li a .theme{width:calc(100% - 50px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block}


/*footer*/
#footer, #footer a{color:#FFFFFF; line-height:1;}
#footer{color:#FFFFFF; background:#484848; margin-top:80px; position:absolute; bottom:0; left:0; right:0;}
#footer .footer_inner{width:calc(100% - 40px); margin:0 auto;}
#footer .footerTop{padding:20px 0; display:flex; justify-content:space-between; align-items:flex-start;}
#footer .footerTop .callcenter{font-size:20px; font-weight:500; display:flex; justify-content:flex-start; gap:6px;}
#footer .footerTop .callcenter .icoCall{width:20px; height:20px; border-radius:50%; background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/m_ico_callcenter.svg) no-repeat center, #D9D9D9; text-indent:-999px; overflow:hidden; display:block;}
#footer .footerTop .callcenter .hour{font-size:13px; font-weight:400; margin-top:6px; display:flex; justify-content:flex-start; align-items:flex-start; gap:4px;}
#footer .footerTop .callcenter .hour span{display:block;}
#footer .footerTop .callcenter .hour span+span{margin-top:3px;}
#footer .footerTop .contact{display:flex; justify-content:flex-end; gap:10px;}
#footer .footerTop .contact > a{width:30px; height:30px; border-radius:50%; text-indent:-999px; overflow:hidden; display:block; }
#footer .footerTop .contact .kakao{background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/ico_kakao.svg) no-repeat 50% 50%, #FFFFFF; background-size:20px;}
#footer .footerTop .contact .email{background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/ico_mail.svg) no-repeat 50% 50%, #FFFFFF; background-size:20px;}
#footer .footerInfo{font-size:14px; border-top:1px solid #FFFFFF; padding:20px 0;}
#footer .footerInfo .company > div{display:flex; flex-direction:column; justify-content:flex-start; gap:6px;}
#footer .footerInfo .company a{display:block; margin-top:6px; margin-left:104px;}
#footer .footerInfo .company > div + div{margin-top:6px;}
#footer .footerInfo .company .copy{margin:16px 0;}

/*//common//*/
.web{display:none !important;}
.blind{display:none !important;}
/*group*/
.section{margin-top:20px;}
/*font style*/
.fontDg{color:#004D45;}
.fontM{font-weight:500;}
.fontB{font-weight:700;}
.tit1{font-size:20px; font-weight:700;}
.tit2{font-size:18px; font-weight:500;}
.tit3{font-size:16px; font-weight:500;}
.pageHeader{text-align:center;}
.pageHeader .tit{font-size:20px; font-weight:700; line-height:1.2;}
.pageHeader .txt{font-size:14px; color:#797979; line-height:1.4; margin-top:10px;}
.pageHeader .txt > br{display:none;}
/*button*/
.btnD.left{display:flex; justify-content:flex-start; align-items:center; flex-wrap:wrap; gap:10px;}
.btnLine{border:1px solid #E5E5E5; border-radius:5px; padding:5px 10px; }
.btnText{color:#484848; text-decoration:underline; line-height:1}
/*tab*/
.tabSwiper{margin:0 -20px; padding:0 20px;}
.tabSt01{}
.tabSt01 .tabBtn{background:#FFFFFF;}
.tabSt01 .tabBtn.center{display:flex; justify-content:center; margin:0 auto;}
.tabSt01 .tabBtn .item{font-size:15px; font-weight:400; color:#A8A8A8; line-height:1.3; text-align:center; width:calc(40% - 8px); background:#F2F2F2; border-radius:10px; padding:10px 20px; cursor:pointer;}
.tabSt01 .item.isCurrent{font-weight:500; color:#FFFFFF; background:#004D45;}
.tabSt01 .tabCont{margin-top:20px;}
.tabSt02{}
.tabSt02 .tabBtn{width:100%; height:40px; display:table; table-layout:fixed; border-bottom:1px solid #E5E5E5; background:#FFFFFF; z-index:1000;}
.tabSt02 .tabBtn.sticky{position:sticky; top:0px;}
.tabSt02 .tabBtn .item{color:#797979; text-align:center; vertical-align:middle; display:table-cell; cursor:pointer;}
.tabSt02 .item:hover{font-weight:500;}
.tabSt02 .item.isCurrent {font-weight:500; color:#000000; position:relative;}
.tabSt02 .item.isCurrent:after{content:'';  width:100%; height:1px; background:#000000; position:absolute; bottom:-1px; left:0px; display:block;}
.tabSt02 .tabCont{margin:20px 0; overflow-y:auto;}

/*list*/
.imgList{}
.imgList .list .thum{width:100%; display:block; position:relative;}
.imgList .list .thum:after{content:''; width:100%; height:100%; background:rgba(0,0,0,0.4); position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.imgList .list .thum, .imgList .list .thum:after, .imgList .list .thum img{border-radius:15px;}
.imgList .list .thum .txt{font-size:16px; font-weight:700; color:#FFFFFF; text-align:center; width:calc(100% - 40px); position:absolute; z-index:2;}
.imgList .list .thum .txt > span{font-size:13px; font-weight:400; margin-top:10px; display:block;}
.imgList .list .thum .image{width:100%; height:100%; object-fit:cover;}
.imgList.aiList{display:grid; grid-template-columns:repeat(2, 1fr); gap:10px;}
.imgList.aiList .list{width:100%;}
.imgList.aiList .list .thum{aspect-ratio:1;}
.imgList.aiList .list .thum .txt{top:50%; left:50%; transform:translate(-50%, -50%);}
.imgList.aiSelList{}
.imgList.aiSelList .list + .list{margin-top:10px;}
.imgList.aiSelList .list .thum{width:100%; height:200px;}
.imgList.aiSelList .list .thum .txt{text-align:left; bottom:20px; left:20px; right:20px;}

/*Scrollbar*/
.scroll{width:100%; height:100%; padding-right:14px; overflow-y:auto;}
.scroll::-webkit-scrollbar{width:6px;}
.scroll::-webkit-scrollbar, .scroll::-webkit-scrollbar-thumb{overflow:visible; border-radius:4px;}
.scroll::-webkit-scrollbar-thumb{background:rgba(0,0,0,.2);}

/*/chat/*/
.chatroom{width:100%; height:calc(100vh - 61px); margin:0 auto; position:relative;}
.chatroom .msgGroup{height:calc(100% - 66px); padding:20px 0 20px 20px;}
.chatroom .msgGroup .msgBox{display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap; gap:10px;}
.chatroom .msgGroup .msgBox + .msgBox{margin-top:20px;}
.chatroom .msgGroup .msgBox.bot .icoBot{width:20px; height:20px; text-indent:-999px; overflow:hidden; background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/m_ico_ai.svg) no-repeat 50%;}
.chatroom .msgGroup .msgBox.user .icoUser{width:20px; height:20px; text-indent:-999px; overflow:hidden; background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/m_ico_user.svg) no-repeat 50%;}
/*.chatroom .msgGroup .msgBox.bot + .msgBox.bot .icoBot{visibility:hidden;} 2025-02-24 숨김처리*/
.chatroom .msgGroup .msgBox .msg{width:calc(100% - 30px);}
.chatroom .msgGroup .msgBox.bot .msg{margin-top:-1px;}
.chatroom .msgGroup .msgBox.user .msg{font-size:18px; font-weight:500; line-height:1.25;}
.chatroom .msgGroup .msgBox .msg .part + .part{margin-top:20px;}
.chatroom .msgGroup .msgBox .msg .part .tit{font-size:20px; font-weight:700; margin-bottom:10px;}
.msg .btnD{margin-top:10px;}
/*호텔추천*/
.hotelList{}
.hotelListItem{width:100%; border:1px solid #E5E5E5; border-radius:10px; position:relative;}
.hotelListItem + .hotelListItem{margin-top:20px;}
.hotelListItem .hotel{display:flex; flex-direction:column-reverse;}
.hotelListItem .hotel .hotelInfo{width:100%; min-height:120px; padding:14px 20px; display:flex; flex-direction:column; justify-content:flex-start; align-items:flex-start; gap:10px;}/*2025-02-12 수정*/
.hotelListItem .hotel .hotelInfo .label{font-size:12px; line-height:1; border-radius:10px; padding:4px 10px; display:inline-block; position:absolute; top:10px; right:10px;}
.hotelListItem .hotel .hotelInfo .label.aiRecomm{color:#004D45; background:#F9FEF5; border:1px solid #C9DFB7;}
.hotelListItem .hotel .hotelInfo .label.tht{color:#D99528; background:#FBF3E7; border:1px solid #F2DBB7;}
.hotelListItem .hotel .hotelInfo .label.check{color:#797979; background:#F7F7F7; border:1px solid #E5E5E5;}
.hotelListItem .hotel .hotelInfo .hotelTit{display:flex; justify-content:flex-start; gap:20px;}
.hotelListItem .hotel .hotelInfo .hotelTit > p{font-size:17px; font-weight:700; line-height:1.2; position:relative;}/*2025-02-12 수정*/
.hotelListItem .hotel .hotelInfo .hotelTit > p + p:after{content:''; width:1px; background:#000000; position:absolute; top:0; bottom:0; left:-10px;}
.hotelListItem .hotel .hotelInfo .desc{font-size:14px; color:#797979; line-height:1.2; word-break:keep-all; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; width:100%; overflow:hidden; text-overflow:ellipsis;}/*2025-02-12 수정*/
.hotelListItem .hotel .hotelInfo .priceD{line-height:1;}
.hotelListItem .hotel .hotelInfo .priceD .price .night{font-size:13px; color:#797979;}
.hotelListItem .hotel .hotelInfo .priceD .price .unit, .hotelListItem .hotel .hotelInfo .priceD .discount{font-size:13px; color:#484848; line-height:1.2;}/*2025-02-12 수정*/
.hotelListItem .hotel .hotelInfo .priceD .discount{margin-top:5px;}
.hotelListItem .hotel .hotelInfo .priceD .price .unit .num{font-size:20px; font-weight:700; color:#004D45; margin-left:5px;}
.hotelListItem .hotel .thum{height:140px; border-radius:9px 9px 0 0; overflow:hidden;}
.hotelListItem .hotel .thum > img{width:100%; height:100%; object-fit:cover; object-position:center center;}
.hotelListItem .promo{background:#F7F7F7; border-radius:0 0 10px 10px; padding:14px 20px; display:flex; flex-wrap:wrap; justify-content:flex-start; gap:4px;}/*2025-02-12 수정*/
.hotelListItem .promo li{font-size:13px; font-weight:500; color:#FFFFFF; line-height:1; background:#000000; border-radius:16px; padding:6px 8px;}/*2025-02-12 수정*/
/*관련이미지*/
.hotelImg{}
.hotelImg .swiper{margin-left:-34px; margin-right:-14px; padding-left:34px;}
.hotelImg .swiper .swiper-slide{width:calc(75% - 20px); aspect-ratio:2/1.2; display:flex; justify-content:center; align-items:center;}
.hotelImg .swiper .swiper-slide .thumbnail{width:100%; height:100%; border-radius:12px; overflow:hidden;}
.hotelImg .swiper .swiper-slide .thumbnail img{width:100%; height:100%; object-fit:cover;}
/**/
.viewbox-container{position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.8); z-index:1000;}
.viewbox-body{display:flex; flex-direction:column; position:absolute; top:50%; left:50%; overflow:hidden;}
.viewbox-header{font-size:14px; font-weight:500; color:#FFFFFF; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.viewbox-content{margin-top:12px; border-radius:12px; overflow:hidden;}
.viewbox-content .viewbox-image{object-fit:cover;}
.viewbox-button-default{height:48px; width:48px; cursor:pointer;}
.viewbox-button-default > svg{width:100%; height:100%; background:inherit; fill:inherit; pointer-events:none; transform:translateX(0px);}
.viewbox-button-default{fill:#E5E5E5;}
.viewbox-button-default:hover{fill:#FFFFFF;}
.viewbox-button-close{position:absolute; top:0px; right:0px; z-index:9;}
.viewbox-button-next, .viewbox-button-prev{width:48px; height:48px; margin-top:-24px; position:absolute; top:50%; z-index:9;}
.viewbox-button-next{right:0px;}
@-webkit-keyframes sk-bounce{
	0%, 100% { -webkit-transform:scale(0.0);}
	50% { -webkit-transform:scale(1.0);}
}
@keyframes sk-bounce{
	0%, 100% { 
		transform:scale(0.0);
		-webkit-transform:scale(0.0);
	} 50% { 
		transform:scale(1.0);
		-webkit-transform:scale(1.0);
	}
}

/*관련질문&답변*/
.Question .faq li a{color:#666666; line-height:1.2; background:#F7F7F7; border:1px solid #E5E5E5; border-radius:5px; padding:6px 10px; display:inline-block; cursor:pointer;}/*2025-02-12 수정*/
.Question .faq li + li{margin-top:5px;}
/*메세지양식-관련질문 답변 등*/
.msgForm{color:#666666;}
.msgForm + .msgForm{border-top:1px solid #E5E5E5; margin-top:20px; padding-top:20px;}
.msgForm:last-child{border-bottom:1px solid #E5E5E5; padding-bottom:20px;}
.msgForm .tit1, .msgForm .tit2, .msgForm .tit3{color:#000000; margin-bottom:5px;}
.msgForm .tit1{line-height:1.3; margin-bottom:8px;}/*2025-02-24 추가*/
.msgForm .numList{}
.msgForm .numList, .msgForm .dotList{margin-top:4px;}
.msgForm .numList > li + li{margin-top:4px;}
.msgForm .numList .dotList{margin-left:10px;}
.msgForm .dotList li{position:relative; padding-left:8px;}
.msgForm .dotList li:after{content:''; width:3px; height:2px; background:#666666; border-radius:2px; position:absolute; top:9px; left:0;}
.msgForm .parnassus{margin-top:12px;}
/*send message*/
.sendMsgGroup{padding:0 20px; position:absolute; bottom:20px; left:0; right:0;}
.sendMsgGroup .sendMsg{width:100%; height:46px; border:1px solid #004D45; border-radius:10px; padding:2px 2px 2px 4px; display:flex; justify-content:space-between;} 
.sendMsgGroup .sendMsg > input{font-size:16px; width:calc(100% - 50px); height:40px; border:none; }
.sendMsgGroup .btnSend{width:40px; height:40px; background:url(https://img.hyundaidreamtour.com/images/aihdt/hotel/ico_sendmsg.svg) no-repeat 50% 50%, #004D45; border-radius:10px; text-indent:-999px; overflow:hidden; cursor:pointer;}