@charset "utf-8";

/*
 * File       : main.css
 * Author     : STUDIO-JT (HEE)
 * Guideline  : JTstyle.1.1
 *
 * Dependency : css/reset.css
 *              css/jt-strap.css
 *
 * SUMMARY:
 * 1) COMMON
 * 2) MAIN VISUAL
 * 3) MAIN OFFER
 * 4) MAIN ROOMS
 * 5) MAIN DINING
 * 6) MAIN INSTA
 */



/* **************************************** *
 * COMMON
 * **************************************** */
.home {overflow-y: scroll;}
.home .main-container {padding-top: 0; padding-bottom: 0;}

body.fullpage.home #footer {width: 100%; height: 798rem; position: fixed; bottom: 0; left: 50%; -webkit-transform: translate3d(-50%, 100%, 0); transform: translate3d(-50%, 100%, 0); will-change: transform; z-index: 2;}
body.fullpage .main-fullpage {position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 1;}
body.fullpage .main-section {height: 100%;}
.main-fullpage {position: relative; width: 100%;transition: opacity .2s;}
html.mobile .main-fullpage.main-fullpage--ready {opacity: 0;}

.main-section {position: relative; width: 100%;}
.main-section__title {margin-bottom: 40rem;font-size: 48rem;line-height: 1.26;font-weight: 400;letter-spacing: 0.06em;text-align: left;color: #000;}
.main-section__title--link {display: none;}
.main-section__subtitle { font-size: 18rem; font-weight: 500; letter-spacing: -0.025em; line-height: 1.78; }
.main-section__subtitle.m-only {display: none;}
.main-section__content { display: table; width: 100%; height: 100%; table-layout: fixed;}
.main-section__content-inner { display: table-cell; vertical-align: middle; }
.main-section__more {position: absolute; top: -80rem; right: -5rem;}
.main-section__tags { font-size: 0; margin-top: 47rem; }
.main-section__tags-item { position: relative; display: inline-block; vertical-align: top; font-size: 16rem; font-weight: 400; letter-spacing: 0.08em; color: #999; margin-right: 28rem; }
.main-section__tags-item:after {content: '';display: block;width: 4rem;height: 4rem;background: #ddd;border-radius: 50%;position: absolute;top: 5rem;right: -15rem;}
.main-section__tags-item:last-child {margin-right: 0;}
.main-section__tags-item:last-child:after {display: none;}
html.desktop.safari .main-section__tags-item:after {top: 8rem;}



/* **************************************** *
 * MAIN VISUAL
 * **************************************** */
.main-visual{position: relative; height: 100vh; background: #f5f5f5;}

.main-visual__container,
.main-visual__wrapper,
.main-visual__slide,
.main-visual__slide-bg{width: 100%; height: 100%;}

.main-visual__slide-bg {position: absolute;left: 0;right: 0;top: 0;bottom: 0;background: no-repeat center center;background-size: cover;}
.main-visual__slide-bg--overlay:before { content: ""; background: #000; opacity: 0.3; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 5;}
.main-visual__slide-bg .jt-fullvid{opacity:0}
.main-visual__slide-bg .jt-fullvid-container .jt-fullvid{opacity:1}
.ie9 .main-visual__slide-bg .jt-fullvid-container .jt-fullvid,
.ie10 .main-visual__slide-bg .jt-fullvid-container .jt-fullvid{opacity:0}

.main-visual__slide-content {display: table;width: 100%;height: 100%;position: relative; z-index: 1; text-align: center; opacity: 0; z-index: 10;}
.main-visual__slide-content-inner {display: table-cell;vertical-align: middle;}
.main-visual__slide-content-aligner { max-width: 1542rem; margin: auto; padding-bottom: 132rem;}
.main-visual__slide-content-title {display: block;font-size: 55rem;font-weight: 400;letter-spacing: -0.025em;line-height: 1.33;color: #fff;}
.main-visual__reserv-btn {display: none;}

.main-visual .swiper-control {position: absolute;bottom: 67rem;text-align: center;width: 100%;z-index: 100;}

.jt-visual__fullvid-poster {width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: no-repeat center center;background-size: cover;z-index: 2;}
.jt-visual__fullvid-poster--low {display: none;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: no-repeat center center;background-size: cover;z-index: 1;}

/* RESERVATION */
.main-reserv-container { position: absolute; top: 50%; left: 50%; width: 100%; z-index: 10; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); padding-top: 130rem; text-align: center; opacity: 0; max-width: 1542rem;}
.main-reserv { display: inline-block; vertical-align: top; font-size: 0;}
.main-reserv__form { display: inline-block; vertical-align: top;  }
.main-reserv__form-data-group {display: inline-block; vertical-align: top;}
.main-reserv__form-data { display: inline-block; vertical-align: top; position: relative; }
.main-reserv__form-label { display: block; font-size: 14rem; font-weight: 400; letter-spacing: 0.08em; line-height: 2; color: #fff; text-align: center; }
.main-reserv__form-label span {display: inline-block; vertical-align: top;}
.main-reserv__from-label-tooltip-wrap { display: inline-block; vertical-align: top; width: 20rem; height: 20rem; position: relative; letter-spacing: 0; margin-top: 2rem; margin-left: -2rem; }
html.desktop.safari .main-reserv__from-label-tooltip-wrap {margin-top: 4rem;}
.main-reserv__form-label-tooltip-btn { position: relative; display: block; width: 100%; height: 100%; }
.main-reserv__form-label-tooltip-btn:after {content: '\e951';font-family: 'jt-font'; position: relative; display: block;width: 100%;height: 100%;font-size: 18rem;text-align: center;line-height: 20rem; color: #fff; z-index: 1;}
.main-reserv__form-label-tooltip-btn:before {content: ''; display: block; width: 80%; height: 80%; border-radius: 50%; background: #000; position: absolute; top: 10%; left: 10%;}
.main-reserv__form-label-tooltip { background: #000; position: absolute; top: -37rem; right: -12rem; font-size: 11rem; letter-spacing: -0.025em; line-height: 1.4; color: #fff; white-space: nowrap; padding: 7rem 12rem 5rem; opacity: 0; visibility: hidden; -webkit-transition: opacity .3s; transition: opacity .3s; border-radius: 13rem;}
.main-reserv__form-label-tooltip:after { content: ''; position: absolute; bottom: -6rem; right: 5rem; border-top: 10rem solid #000; border-right: 10rem solid transparent; -webkit-transform: skew(-10deg); -ms-transform: skew(-10deg); transform: skew(-10deg); }
.main-reserv__from-label-tooltip-wrap:hover .main-reserv__form-label-tooltip {opacity: 1; visibility: visible;}
.ie11 .main-reserv__form-label-tooltip {padding-top: 6rem; padding-bottom: 6rem;}

.main-reserv__form-field-wrap {margin-top: 4rem;}
.main-reserv__form-field {display: inline-block; width: 130rem; height: 46rem; margin: 0; padding: 11rem 0 12rem; vertical-align: middle; font-size: 17rem; line-height: 1.75; color: #fff; border: 0; border-radius: 0; background: transparent; outline: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer;}

.main-reserv__btn { display: inline-block; min-width: 222rem; padding: 25rem 29rem 20rem; position: relative; vertical-align: middle; font-size: 18rem; font-weight: 400; letter-spacing: 0.05em; line-height: 1; color: #000; text-align: center; background: #fff; border: 1rem solid #fff;  margin-left: 40rem; -webkit-transition: border .3s, background .3s, color .3s; transition: border .3s, background .3s, color .3s;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer;}
html.desktop .main-reserv__btn:hover {background: #000; color: #fff; border-color: #000;}

.main-reserv__form-field-wrap .jt-selectric__wrap { width: 108rem; }
.main-reserv__form-field-wrap .selectric {text-align: center; border-radius: 0; border: 0; background: transparent; }
.main-reserv__form-field-wrap .selectric:after {display: none;}
.main-reserv__form-field-wrap .selectric .label { margin: 0 20rem 0 5rem; color: #fff; text-align: center; }
.main-reserv__form-field-wrap .selectric .button {width: 10rem; right: 35rem;}
.main-reserv__form-field-wrap .selectric .button:after {color: #fff;}
.main-reserv__form-field-wrap .selectric-items {border-radius: 0; border: 0;}
.main-reserv__form-field-wrap .selectric-items ul, .main-reserv__form-field-wrap .selectric-items li {text-align: center;}

.main-reserv__form-data--date-from,
.main-reserv__form-data--date-to {padding: 0 46rem;}
.main-reserv__form-data--date-from .main-reserv__form-label,
.main-reserv__form-data--date-to .main-reserv__form-label {text-align: left;}
.main-reserv__form-data--date-from .main-reserv__form-field,
.main-reserv__form-data--date-to .main-reserv__form-field {font-family: 'LemonMilk', 'NotoSansKR', sans-serif;}
.main-reserv__form-data--date-from:after,
.main-reserv__form-data--date-to:after {content: ''; display: block; width: 1px; height: 65rem; background: #bcbcbc; position: absolute; top: 0; right: 0;}

.main-reserv__form-data--room {margin-left: 35rem;}
.main-reserv__form-data--room .main-reserv__form-field-wrap .jt-selectric__wrap {width: 70rem;}
.main-reserv__form-data--room .main-reserv__form-field-wrap .selectric .button {right: 19rem;}

.main-reserv__form-data--adult .main-reserv__form-field-wrap .jt-selectric__wrap {width: 70rem;}
.main-reserv__form-data--adult .main-reserv__form-field-wrap .selectric .button {right: 19rem;}

html.mobile .main-reserv__form-field-wrap .jt-selectric__wrap { border-radius: 0; background: transparent; }
html.mobile .main-reserv__form-field-wrap .jt-selectric__wrap:before { right: 18rem; color: #fff; }
html.mobile .main-reserv__form-field-wrap .jt-selectric__wrap > select { border: 0; border-radius: 0; color: #fff; text-align-last: center; text-align: center; text-align: -webkit-center; -ms-text-align-last: center; -moz-text-align-last: center; padding: 14rem 20rem 14rem 5rem; }
html.mobile .main-reserv__form-field-wrap .jt-selectric__wrap > select option { color: #000; }

html.mobile .main-reserv__form-data--room .main-reserv__form-field-wrap .jt-selectric__wrap:before {right: 0;}
html.mobile .main-reserv__form-data--adult .main-reserv__form-field-wrap .jt-selectric__wrap:before {right: 0;}

body.show_popup .main-visual__slide-content-inner {padding-top: 53rem;}
body.show_popup .main-reserv-container { padding-top: 183rem; }



/* **************************************** *
 * MAIN OFFER
 * **************************************** */
.main-offer .main-section__content-inner {padding-top: 70rem;}
body.show_popup .main-offer .main-section__content-inner {padding-top: 120rem;}

.main-offer__list-wrap {position: relative;}
.main-offer__list { font-size: 0; margin: 0 -21rem; text-align: left; }
.main-offer__list-item { display: inline-block; vertical-align: top; width: 33.33%; padding: 0 21rem; }
.main-offer__list-link {display: block;}
.main-offer__list-figure { padding-top: 57.34%; }
.main-offer__list-figure img {-webkit-transform: scale(1) rotate(0deg);-ms-transform: scale(1) rotate(0deg);transform: scale(1) rotate(0deg); -webkit-transition: opacity .3s, -webkit-transform .6s; transition: opacity .3s, -webkit-transform .6s; transition: opacity .3s, transform .6s; transition: opacity .3s, transform .6s, -webkit-transform .6s; will-change: transform;}
.main-offer__list-content { text-align: left; padding-top: 39rem;}
.main-offer__list-title { font-size: 24rem; font-weight: 500; letter-spacing: -0.025em; line-height: 1.6; }
.main-offer__list-desc { font-size: 17rem; line-height: 1.65; letter-spacing: -0.025em; color: #666; margin-top: 8rem; }
.main-offer__list-time { font-size: 14rem; font-weight: 400; letter-spacing: 0.06em; line-height: 1; color: #888; display: block; margin-top: 34rem; }
.main-offer__list-period-wrap { display: block; padding-top: 27rem; border-top: 1px solid #ddd; margin-top: 26rem; }
.main-offer__list-period { font-size: 0; margin-top: 13rem; }
.main-offer__list-period:first-child { margin-top: 0; }
.main-offer__list-period b { display: inline-block; vertical-align: top; font-size: 16rem; font-weight: 500; letter-spacing: -0.025em; color: #000; margin-right: 31rem; }
.main-offer__list-period span { display: inline-block; vertical-align: top; font-size: 16rem; letter-spacing: 0.06em; color: #666; margin-top: 5rem;}
html.desktop.safari .main-offer__list-period span {margin-top: 2rem;}
html.desktop .main-offer__list-link:hover .main-offer__list-figure img { -webkit-transform: scale(1.05) rotate(0.1deg); -ms-transform: scale(1.05) rotate(0.1deg); transform: scale(1.05) rotate(0.1deg);}

.main-offer__list-wrap .swiper-control {display: none;}



/* **************************************** *
 * MAIN ROOM
 * **************************************** */
/* .main-room {background: #f8f8f8;} */
.main-room .main-section__title {font-size: 43rem; margin-bottom: 0;}
.main-room .main-section__more { top: auto; right: auto; bottom: 71rem; left: 65rem; }

.main-room__preview { height: 100%; }
.main-room__preview > .main-section__more {display: none;}
.main-room__preview:after {content: ''; display: table; clear: both;}
.main-room__preview-content { position: relative; float: right; width: 534rem; height: 100%; padding: 0 64rem; display: table;}
.main-room__preview-content-inner {display: table-cell; vertical-align: middle;}
.main-room__preview-slider { position: absolute; top: 0; left: 0; width: -webkit-calc(100% - 534rem); width: calc(100% - 534rem); height: 100%; }
.main-room__preview-slider-bg { width: 100%; height: 100%; background-size: cover; background-position: center; }
.main-room__preview-slider .swiper-control { position: absolute; bottom: 66rem; right: 39rem; z-index: 1;}
.main-room__preview-slider .swiper-control .swiper-navigation {display: none;}
.main-room__preview-slider .swiper-progress-slash {display: none;}



 /* **************************************** *
 * MAIN DINING
 * **************************************** */
/* .main-dining .main-section__content-inner { vertical-align: top;} */
.main-dining .main-section__content-inner > .main-section__more {display: none;}
.main-dining .main-section__content-inner {padding-top: 110rem;}
body.show_popup .main-dining .main-section__content-inner {padding-top: 160rem;}

.main-dining__header { position: relative; /* padding-top: 200rem; */ padding-bottom: 28rem;background: #fff; /* z-index: 2; transform: translateZ(0); */}
.main-dining__header .wrap {position: relative;}
.main-dining__header .main-section__title { display: inline-block; vertical-align: top; margin-bottom: 0; }
.main-dining__header .main-section__title--link {display: none;}
.main-dining__header .main-section__tags { display: inline-block; vertical-align: top; margin-top: 30rem; margin-left: 28rem; }
.main-dining__header .main-section__more { top: auto; bottom: 15rem; }
.main-dining__slider-wrap {position: relative; width: 100%; height: 540rem; max-width: 1542rem; margin: 0 auto; max-height: 58vh;}
.main-dining__slider { position: relative; width: 100%; height: 100%; }
.main-dining__slider:after {content: '';display: block;width: 100%;height: 140rem;background: linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,0));position: absolute;bottom: 0;left: 0;z-index: 1;}
.main-dining__slider-bg { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; background-color: #f5f5f5;}
.main-dining__slider-bg.small {display: none;}
.main-dining__slider-title {display: none;}

.main-dining__slider-paging { position: absolute; width: 100%; /* max-width: 1584rem; */ left: 50%; bottom: 42rem; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: 2; font-size: 0; padding-left: 60rem; padding-right: 60rem;}
.main-dining__slider-paging-item { display: inline-block; vertical-align: top; width: -webkit-calc(50% - 42rem); width: calc(50% - 42rem); margin: 0 21rem;}
.main-dining__slider-paging-progress-wrap { position: relative; display: block; width: 100%; height: 2rem; background: #ffffff; background: rgba(255, 255, 255, .3); overflow: hidden;}
.main-dining__slider-paging-progress {display: block;width: 0;height: 100%;background: #fff;position: absolute;font-style: normal;opacity: 0;}
.main-dining__slider-paging-txt { display: block; font-size: 20rem; letter-spacing: 0.08em; line-height: 1.4; color: #fff; margin-top: 30rem; opacity: .5; -webkit-transition: opacity .3s; transition: opacity .3s;}
.main-dining__slider-paging-txt:hover {opacity: 1;}
.main-dining__slider-paging-item--active .main-dining__slider-paging-txt {opacity: 1;}
.main-dining__slider-paging-item--active .main-dining__slider-paging-progress {opacity: 1;}



/* **************************************** *
 * MAIN INSTA
 * **************************************** */
.main-insta .main-section__content-inner {padding-top: 70rem;}
body.show_popup .main-insta .main-section__content-inner {padding-top: 120rem;}

.main-insta__list-wrap {position: relative;}
.main-insta__list { font-size: 0; margin: 0 -21rem; }
.main-insta__list-item { display: inline-block; vertical-align: top; width: 25%; padding: 0 21rem; }
.main-insta__list-link {position: relative; display: block; padding-top: 100%; overflow: hidden;}
.main-insta__list-bg { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 1; -webkit-transform: scale(1) rotate(0deg);-ms-transform: scale(1) rotate(0deg);transform: scale(1) rotate(0deg); -webkit-transition: opacity .3s, -webkit-transform .6s; transition: opacity .3s, -webkit-transform .6s; transition: opacity .3s, transform .6s; transition: opacity .3s, transform .6s, -webkit-transform .6s; will-change: transform;}
html.desktop .main-insta__list-link:hover .main-insta__list-bg { -webkit-transform: scale(1.05) rotate(0.1deg); -ms-transform: scale(1.05) rotate(0.1deg); transform: scale(1.05) rotate(0.1deg);}
