@charset "utf-8";

/**************************************************
프로그램 ID : hub.css
프로그램 명 : Hub Cascading Style Sheets
작  성   자 : 
최초 작성일 : 2017/02/22
최종 작성일 : 
참고   사항 : 
**************************************************/

@import url("/assets/global/css/select2.css");
@import url("/assets/darakhyu/global/css/base.css");
@import url("/assets/darakhyu/global/css/hub.layout.css?ver=20251113");
@import url("/assets/darakhyu/global/css/hub.style.css");


/* 비주얼
------------------------------------------------------------------------------- */
.visual {min-height:168px; background:#869097;}
.visual .slide figure > span {position:relative; height:520px; line-height:0; text-align:center; display:block; overflow:hidden; z-index:5;}
.visual .slide figure > span img {position:absolute; left:50%; width:2000px; margin-left:-1000px; display:block;}
.visual .slide figcaption {position:absolute; top:0; left:50%; width:1000px; height:400px; margin-left:-500px; display:table; table-layout:fixed; z-index:10;}
.visual .slide figcaption div {color:#fff; line-height:24px; text-align:center; vertical-align:middle; display:table-cell;}
.visual .slide figcaption h3 {margin-bottom:20px; font-weight:700; font-size:36px; color:#fff; line-height:42px;}
.visual .slide figcaption h3 em {font-weight:200;}
.visual .slide figcaption h4 {font-weight:500; font-size:13px; color:#fff; letter-spacing:0.2em;}
.visual .slide figcaption h4:after {width:30px; height:1px; margin:13px auto 34px auto; background:#fff; display:block; content:"";}
.visual .slide figcaption h5 {font-size:24px;}
.visual .slide figcaption p {font-size:16px; line-height:24px;}
.visual .slide figcaption h5 + p {padding-top:15px;}
.visual .slide figcaption dl dt, .visual .slide figcaption dl dd {font-size:13px; display:inline-block;}
.visual .slide li.black figcaption div {color:#333;}
.visual .slide li.black figcaption h3 {color:#333;}
.visual .slide li.black figcaption h4:after {background:#333;}
.visual .slide li.regular figcaption h3 {font-weight:400;}
.visual .slide figcaption p strong {font-weight:700;}
.visual .bx-controls {position:absolute; top:0; left:50%; width:40px; height:400px; margin-left:460px; display:table; z-index:100;}
.visual .bx-wrapper .bx-pager  {font-size:0; line-height:0; vertical-align:middle; display:table-cell;}
.visual .bx-wrapper .bx-pager .bx-pager-item {margin:20px 0; text-align:right; display:block;}
.visual .bx-wrapper .bx-pager .bx-pager-item .bx-pager-link {width:15px; height:2px; background:#fff; display:inline-block; opacity:0.7;}
.visual .bx-wrapper .bx-pager .bx-pager-link.active {width:100%; opacity:1;}


/* 객실검색
------------------------------------------------------------------------------- */
.roomSearch {height:120px; margin-top:-120px;}
.roomSearch fieldset {position:relative; width:1000px; margin:0 auto; z-index:60;}
.roomSearch dl.stay {width:850px; height:51px; border:1px solid #e8e8e8; display:table;}
.roomSearch dl.stay dd {width:25%; background-color:#fff; display:table-cell;}
.roomSearch dl.stay dd {vertical-align:top;}
.roomSearch dl.stay dd.period {width:auto;}
.roomSearch dl.stay dd.period strong {margin-left:82px;}
.roomSearch dl.stay dd.period input {margin-left:72px; height:49px;}
.roomSearch dl.stay dd.period + dd {width:61px;}
.roomSearch dl.stay dd select {width:100%; height:100%;}
.roomSearch dl.stay dd:not(:first-of-type) {border-left:1px solid #e8e8e8;}
.roomSearch dl.stay dd.date {position:relative;}
.roomSearch dl.stay dd.date div.calendar {display:none;}
.roomSearch dl.stay dd.date input {height:49px; font-weight:500; font-size:13px; color:#696969; border:0 none; background:#fff;}
.roomSearch dl.stay dd.date:after {position:absolute; right:20px; top:50%; margin-top:-1px; border-width:5px 4px 0 4px; border-style:solid; border-color:transparent; border-top-color:#474e61; display:block; content:"";}
.roomSearch dl.stay dd.date.on:after {border-width:0 4px 5px 4px; border-bottom-color:#474e61;}
.roomSearch button.search {position:absolute; top:0; right:0; width:150px; height:51px; font-size:13px; background:rgba(34,34,34,0.90);}
.roomSearch .comiseo-daterangepicker {left:0 !important; top:143px !important;}
.roomSearch .note {margin-top:7px; color:#fff;}
.roomSearch .select2-container--default.select2-container--disabled .select2-selection--single {background-color:transparent;}
.roomSearch .select2-container--default.select2-container--disabled .select2-selection__arrow b {border-top-color:#999;}
.roomSearch .select2-container--default.select2-container--disabled .select2-selection__rendered {color:#999;}
/* .select2-dropdown.option01.st01 ul.select2-results__option > li.select2results__option {padding:0;}
.select2-container--default .select2-results__group {padding:13px 15px;}
.select2-container--default .select2-results__group:before {display:inline-block; content:"-"; vertical-align:middle;} */


/* 지점
------------------------------------------------------------------------------- */
.branch {padding:50px 0;}
.branch ol {clear:both; width:1020px; margin:0 auto; overflow:hidden;}
.branch ol li {float:left; margin:0 10px;}
.branch ol li a {position:relative; width:320px; height:500px; display:block;}
.branch mark {position:absolute; width:80px; height:60px; font-weight:700; color:#fff; line-height:16px; text-align:center; background:#000; display:table;}
.branch mark span {text-indent:-9999px; background-position:50% 50%; background-repeat:no-repeat; vertical-align:middle; display:table-cell;}
.branch .yeosu mark span {background-image:url(/assets/darakhyu/hub/kr/images/ico/ico_branch01.png);}
.branch .terminal mark span {background-image:url(/assets/darakhyu/hub/kr/images/ico/ico_branch02.png);}
.branch figure:before {position:absolute; top:0; left:0; width:100%; border-top:1px solid #000; display:block; content:"";}
.branch figcaption {position:absolute; right:0; bottom:50px; width:270px; height:198px; color:#333; padding:25px 24px 20px 30px; background:#fff; display:block; opacity:0.9;}
.branch figcaption h3 {padding-bottom:2px; font-weight:500; font-size:14px; border-bottom:2px solid transparent; display:inline-block;}
.branch figcaption h4 {height:48px; margin:11px 0 18px 0; font-weight:700; font-size:20px; line-height:24px; word-break:keep-all; overflow:hidden;}
.branch figcaption p {font-weight:300; font-size:16px;}
.branch .yeosu h3 {color:#40525f; border-color:#40525f;}
.branch .terminal h3 {color:#996b56; border-color:#996b56;}
.branch .walkerhill h3 {color:#474747; border-color:#474747;}
.branch ol li a:hover figcaption {color:#fff;}
.branch ol li a:hover h3 {color:#fff; border-color:#fff;}
.branch ol li.yeosu a:hover figcaption {background:#40525f;}
.branch ol li.terminal a:hover figcaption {background:#996b56;}
.branch ol li.walkerhill a:hover figcaption {background:#474747;}


/* 브랜드
------------------------------------------------------------------------------- */
.brand h3, .brand h4 {color:#333;}
.brand h4 {margin-top:22px; line-height:24px;}
.brand p {font-size:14px; line-height:22px;}
.brand figure {position:relative; height:auto; margin-bottom:50px; overflow:hidden;}
.brand figure figcaption {position:absolute; top:0; left:0; width:100%; height:100%; display:block;}
.brand figure .table dl {font-size:14px; color:#fff; line-height:22px;}
.brand figure .table dl dt {font-weight:700;}
.brand figure .table dl dt:not(:first-of-type) {margin-top:9px;}
.brand figure .table .btnC {margin-top:35px;}
.brand figure .table > div > *:not(mark), .brand figure:hover .table > div > mark {opacity:0;}
.brand figure:hover .table {height:100%; padding:10px; text-align:center; background:rgba(0,0,0,0.70);}
.brand figure:hover .table > div {border:1px solid rgba(255,255,255,0.50);}
.brand figure:hover .table > div > *:not(mark) {opacity:1;}
.brand dl.table {padding-right:20px;}
.brand dl.table dt {width:690px;}
.brand dl.table dd {min-width:100px; font-size:14px; line-height:18px; text-align:center;}
.brand dl.table dd:before {height:46px; margin:15px 0 14px 0; background-position:50%; background-repeat:no-repeat; display:block; content:"";}
.brand dl.table dd.breakfast:before {background-image:url(/assets/darakhyu/global/images/ico/ico_breakfast01.png);}
.brand dl.table dd.mobile:before {background-image:url(/assets/darakhyu/global/images/ico/ico_mobile01.png);}
.brand dl.table dd.lounge:before {background-image:url("/assets/darakhyu/global/images/ico/ico_lounge01.png");}
.brand dl.table dd.rentCar:before {background-image:url("/assets/darakhyu/global/images/ico/ico_rentCar01.png");}
.brand dl.table dd.enter:before {background-image:url("/assets/darakhyu/global/images/ico/ico_entertainment01.png");}
.brand dl.table dd.storage:before {background-image:url("/assets/darakhyu/global/images/ico/ico_storage01.png");}
.brand dl.table dd.wifi:before {background-image:url("/assets/darakhyu/global/images/ico/ico_wifi01.png");}
.brand dl.table dd.bluetooth:before {background-image:url("/assets/darakhyu/global/images/ico/ico_bluetooth01.png");}
.brand dl.table dd.sleep:before {background-image:url("/assets/darakhyu/global/images/ico/ico_sleep01.png");}
.brand:nth-of-type(1) dl.table dt {position:relative;}
/*.brand:nth-of-type(1) dl.table dt:after {position:absolute; top:1px; right:0; width:1px; height:102px; background:#d0d0d0; display:block; content:"";}*/
.brand.terminal figure:first-of-type {float:left; margin-right:20px;}
.brand.terminal figure {width:490px;}
.brand.terminal dl.table dd:before {height:44px; margin-top:5px;}


/* 브랜드북
------------------------------------------------------------------------------- */
.brandBook {background:url("/assets/darakhyu/hub/kr/images/bnr/bnr_brandBook.jpg") 50% 50% no-repeat;}
.brandBook span {width:1000px; margin:0 auto;}