@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i');
@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css');
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700'); /* font-family: 'Montserrat', sans-serif; */
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i');
@import url('//fonts.googleapis.com/earlyaccess/jejumyeongjo.css'); /* font-family: 'Jeju Myeongjo', serif; */
@import url('https://fonts.googleapis.com/css?family=Libre+Baskerville'); /* font-family: 'Libre Baskerville', serif; */
@import url('https://fonts.googleapis.com/css?family=Russo+One'); /* font-family: 'Russo One', sans-serif; */
@import url('https://fonts.googleapis.com/css?family=Titillium+Web:400,700'); /* font-family: 'Titillium Web', sans-serif; */
@import url('https://fonts.googleapis.com/css?family=Oranienbaum'); /* arrow font-family: 'Oranienbaum', serif;  */
@import url('https://fonts.googleapis.com/css?family=Gruppo'); /* font-family: 'Gruppo', cursive; */
@import url('https://fonts.googleapis.com/css?family=Sacramento');
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

@import url(http://fonts.googleapis.com/earlyaccess/jejumyeongjo.css);
@font-face {
	font-family: 'GothamLight';
	font-style: normal;
    font-weight: normal;
	src: url('./fonts/GothamLight.eot');
	src: /*local('Gotham Thin'),*/ url('./fonts/GothamLight.woff') format('woff'), url('./fonts/GothamLight.ttf') format('truetype');
}

@font-face {
	font-family: 'GothamMedium';
	font-style: normal;
    font-weight: 300;
	src: url('./fonts/GothamMedium.eot');
	src: /*local('Gotham Medium'),*/ url('./fonts/GothamMedium.woff') format('woff'), url('./fonts/GothamMedium.ttf') format('truetype');
}

@font-face {
	
	font-family: 'GothamBold';
	font-style: normal;
    font-weight: 700;
	src: url('./fonts/GothamBold.eot');
	src: /*local('Gotham Bold'),*/ url('./fonts/GothamBold.woff') format('woff'), url('./fonts/GothamBold.ttf') format('truetype');
}

@font-face { font-family: 'RIDIBatang'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.0/RIDIBatang.woff') format('woff'); font-weight: normal; font-style: normal; }

/*@font-face {
    font-family: "NanumBarunGothic";
    font-style: normal;
    font-weight: normal;
    src: url("./fonts/NanumBarunGothic.eot?#iefix") format("embedded-opentype"), url("./fonts/NanumBarunGothic.woff") format("woff"), url("./fonts/NanumBarunGothic.ttf") format("truetype");
}
@font-face {
    font-family: "NanumSquare";
    font-style: normal;
    font-weight: normal;
    src: url("./fonts/NanumSquareR.eot?#iefix") format("embedded-opentype"), url("./fonts/NanumSquareR.woff") format("woff"), url("./fonts/NanumSquareR.ttf") format("truetype");
}

@font-face {
  font-family: 'Social-Shapes';
    src:  url('./fonts/Social-Shapes.ttf.woff') format('woff'),
    url('./fonts/Social-Shapes.ttf.svg#Social-Shapes') format('svg'),
    url('./fonts/Social-Shapes.ttf.eot'),
    url('./fonts/Social-Shapes.eot?#iefix') format('embedded-opentype'); 
    font-weight: normal;
    font-style: normal;
}*/

html{width:100%;height:100%;overflow-y:auto;-webkit-text-size-adjust:none;}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,input,select,textarea,form,fieldset,legend,body{margin:0;padding:0; font-family:"Open Sans",'Noto Sans KR', "NanumBarunGothic","Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial; }
*+html body body, *+html body div, *+html body li, *+html body dt, *+html body dd, *+html body p, *+html body tr, *+html body td, *+html body h2 {font-family: "Open Sans",'Noto Sans KR', "NanumBarunGothic", "Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial;}
body{visibility:visible; width:100%; font-size:13px;color:#fff; background:#232129; line-height:1.5em; }
img,fieldset{border:none;}
em,address{font-style:normal;}
a{text-decoration:none;color:#000;}
li{list-style:none;}
select,textarea{border-radius:0;}
.clear {}
.clear:after {content:"";display:block;clear:both;}
.blind, .sound_only{visibility:hidden;width:0;height:0;font-size:0;line-height:0;overflow:hidden;}
.img_100 {width:100%; height:auto !important; vertical-align:top;}
select{min-width:50px;height:26px;margin:0;padding:0;font-size:12px;line-height:26px;font-family:Dotum,sans-serif;}
.underline {text-decoration:underline; }
.tl { text-align:left;}
.tc { text-align:center;}
.tr { text-align:right;}
.vt {vertical-align:top;}
.mb0 { margin-bottom:0 !important;}
.mb3 { margin-bottom:3px !important;}
.mb20 { margin-bottom:20px !important;}
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.boxShadow {-webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); box-shadow:2px 2px 3px rgba(0, 0, 0, 0.1);}

.KoPub {font-family: 'KoPub Batang', serif; font-weight:300; letter-spacing:-0.01em;}
.jeju_mj {font-family: 'Jeju Myeongjo', serif; font-weight:200; letter-spacing:-0.01em;}

.transAll015 {-webkit-transition: all 0.15s ease-in-out; -moz-transition: all 0.15s ease-in-out; -ms-transition: all 0.15s ease-in-out; -o-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; }
.transAll03 {-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.transAll03_ease {-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.transAll02_ease {-webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease;}
.scale01 {-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.scale01:hover, .scale01:focus {-ms-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1);}


.strongColor01 { color:#021e2f;}

.block1280, .block1024, .block768, .block560, .block480, .block380 {display:none !important;}
.in-block1280, .in-block1024, .in-block768, .in-block560, .in-block480, .in-block380 {display:none !important;}


#skip{position:fixed;top:-9999px;left:0;z-index:1000;width:240px;height:30px;background:#676462;}
#skip a{display:block;height:30px;padding:0 0 0 20px;line-height:30px;font-size:12px;color:#333;}
#skip.on{top:0;}
#header-sticky-wrapper { position:absolute; width:100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease ; transition: all 0.3s ease; z-index:30; }
/*.about .sticky-wrapper, .room .sticky-wrapper { top:99.9vh; opacity:0; filter: alpha(opacity=0;);}
.preview .sticky-wrapper { top:49px !important; opacity:0; filter: alpha(opacity=0;);}*/

#header {position:fixed; left:0; top:0; opacity:0; filter: alpha(opacity=0;); z-index:30;}
.logo { position:fixed; height:234px; left:3%; top:3%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; z-index:5; }
.logo a { display:block;}
.logo img { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.logo01 { position:relative;width:100%; vertical-align:top; }
.logo02 { position:absolute;width:100%; vertical-align:top; left:0; bottom:20px;  opacity:0; filter: alpha(opacity=0;); }
.logo03, .logo04 { position:absolute; }
.logo03 { left:11px; top:1px; }
.logo04 { left:43px; top:22px; }
.logo03_line, .logo04_line { display:block; width:4px; height:30px; background:#000; margin-left:4px; }
.logo03_img, .logo04_img { position:absolute; left:0; top:0; opacity:0; filter: alpha(opacity=0;); }
/*.logo .line01, .logo .line02 { position:absolute; width:4px; height:30px; background:#000;}
.logo .line01 { left:16px; top:1px;}
.logo .line02 { left:47px; top:22px;}*/

.btn_nav { position:absolute; display:block; width:26px; height:22px; left:75px; top:120px;-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; cursor:pointer; z-index:21;}
.btn_nav .line {position: absolute; display: block; width:29px; height:22px; right:4px; top:0; }
.btn_nav .line span {position: absolute; display: block; width:29px; height:2px; left:50%;  background: #ededed; transform: translate(-50%, 0px);-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
-webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); box-shadow:1px 1px 2px rgba(0, 0, 0, 0.2); }
.btn_nav .text { position:absolute;  left:100%; top:0;font-family: 'Jeju Myeongjo', serif; font-size:2.0em; line-height:0.8em; font-style:italic; color:#fff; text-align:center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); -moz-text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); text-shadow:1px 1px 2px rgba(0, 0, 0, 0.2);  }

.btn_nav .line01 { top:2px; }
.btn_nav .line02 { top:calc(50% - 1px); }
.btn_nav .line03 { bottom:2px; }

.btn_nav.open_nav .line01 {transform: translate(-50%, 7.5px) rotate(45deg); -ms-transform: translate(-50%, 7.5px) rotate(45deg); -webkit-transform: translate(-50%, 7.5px) rotate(45deg);}
.btn_nav.open_nav .line02 {opacity:0; filter: alpha(opacity=0;); }
/*.btn_nav.open_nav .text {opacity:0.5; filter: alpha(opacity=50;); }*/
.btn_nav.open_nav .line03 {transform: translate(-50%, -7.5px) rotate(-45deg); -ms-transform: translate(-50%, -7.5px) rotate(-45deg); -webkit-transform: translate(-50%, -7.5px) rotate(-45deg); }

.gnbArea { position:fixed; /*height:100%;*/ left:220px; top:0; padding:1% 0; background:url(/web/img/main/navi_bg.png); opacity:0; filter: alpha(opacity=0;); visibility:hidden;}
.open_nav .gnbArea { opacity:1; filter: alpha(opacity=100;); visibility:visible;}
.gnbArea:after {content:"";display:block;clear:both;}
.gnb_dl { display:inline-block; margin:0 3em 4em; }
.gnb_dl dt {	font-family: 'RIDIBatang'; font-size:2em; letter-spacing:-1.5px;color:#37373a; border-bottom:1px solid #37373a; padding:0 0 0.4em 0.5em; margin-bottom:0.5em;}
.gnb_dl dd {}
.gnb_dl dd:after {content:"";display:block;clear:both;}

.gnb > li { float:left; margin:0 2em; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.gnb li a.depth1 { position:relative; display:inline-block; font-weight:600; font-size:1.25em; line-height:1.5em; color:#37373a; text-transform:uppercase;  -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.gnb li a.depth1:hover, .gnb li a.depth1:focus { color:#000;}
.gnb > li .depth1_mobile { display:none;}
.gnb_sub { margin-top:0.8em;}
.gnb_sub li { }
.gnb_sub li a {font-family: 'Noto Sans KR', sans-serif; font-size:1.1em; line-height:1.8em; color:#666;  }
.gnb_sub li.this a { font-weight:700; }
.gnb_sub li a:hover, .gnb_sub li a:focus { text-decoration:underline; color:#000;}

.btn_reser { position:fixed; display:inline-block; left:65px; bottom:58px; font-family: 'Russo One', sans-serif; color:#000; letter-spacing:0.1em; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.btn_reser span { display:inline-block; width:16px; height:0; font-size:1.5em; vertical-align:middle; text-align:center; overflow:hidden; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
.btn_reser:hover , .btn_reser:focus { bottom:46px;}
.btn_reser:hover span, .btn_reser:focus span { height:24px;}

.btn_reser02 { display:block; background:#fff; text-align:center; color:#37373a; padding:8% 0;-webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
.btn_reser02 .arrow { display:inline-block; vertical-align:middle; font-family: 'GothamLight', sans-serif; font-weight:100; font-size:3.85em; margin-right:30px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.btn_reser02 .text { display:inline-block; vertical-align:middle; text-align:left;}
.btn_reser02 .text01 { display:block; font-family: 'GothamMedium', sans-serif; font-size:2.3em; line-height:1.2em; margin-bottom:0.2em; letter-spacing:0.15em; }
.btn_reser02 .text02 { display:block; font-size:1.07em; color:#818181;}
.btn_reser02:hover, .btn_reser02:focus { padding-left:20px;}

@media  (max-width: 1366px){
	.gnb_dl{margin:0 2em 1.5em !important; }
	.mainTypo{ width:36% !important; top:42% !important; right:31.5% !important;}
	.btn_nav{left:62px;}

}

@media  (max-width: 1600px){
.gnbArea{padding:1% 0;} .gnb_dl{margin:0 2em 2em;}
}

@media  (max-width: 1480px){


.logo03_img, .logo04_img { width:9px;}
.logo03 { left:7px; top:1px; }
.logo04 { left:28px; top:14px; }
.logo03_line, .logo04_line { width:2.5px; height:20px; margin-left:4px;}

.gnbArea { left:200px; padding:30px 0;}
.gnb_dl { margin:0 2.5em 2em;}
.gnb_dl dt { font-size:1.8em; padding-left:0.8em;}
.gnb > li { margin:0 1.5em;}
.gnb li a.depth1 { font-size:1.15em;}
.gnb_sub { margin-top:0.4em;}
.gnb_sub li a { font-size:1em;}

.btn_reser {  left:40px; bottom:40px;letter-spacing:0.1em; font-size:0.9em;}
.btn_reser span { width:14px;}

.mainSlider .lSAction{ bottom:25% !important; left:50% !important;}

.spList li.spCon04 .spText{ right:3% !important;}

}


.lSSlideOuter { position:relative; z-index:1;}
.lightSlider { z-index:1;}
.lightslider li { background-position:center center !important; background-repeat:no-repeat !important; background-size:cover !important; }
.lightslider li img { width:100%; vertical-align:top;}
/*.lSAction a { float:left; display:block; width:82px; height:84px; cursor:pointer; opacity:0.5; filter: alpha(opacity=50;);
-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.lSAction a:hover, .lSAction a:focus {opacity:0.8; filter: alpha(opacity=80;);}
.lSAction a.lSNext { background-position:-82px 0;}*/

/* footer */
#footer { position:relative; padding:2% 3% 2% 0; z-index:15;}
#footer:after {content:"";display:block;clear:both;}
.main_container #footer { position:absolute; width:calc(100% - 150px); left:150px; bottom:20px;}
.sub #footer { padding:50px 30px 50px 150px; background:#e2e2e2;}
.copyWarp { position:relative;  }
.copyWarp:after { content:"";display:block;clear:both;}
.sub .copyWarp { /*opacity:0; filter: alpha(opacity=0;);*/}
.sub .active .copyWarp {  opacity:1; filter: alpha(opacity=100;); transition: all 0.8s ease-in-out 0.3s}
.copy_dl { text-align:left;}
.copy_dl01 { float:left; margin-left:3%;}
.copy_dl02 { float:right; width:900px;}
.main_container .copy_dl02 {  bottom:0;}
.sub .copy_dl02 { top:0;}
.copy_dl02:after { content:"";display:block;clear:both;}
.copy_dl021 { float:left; margin-left:9%;}
.copy_dl021:first-child { margin-left:0;}
.copy_dl dt { font-family: 'Titillium Web', sans-serif; font-size:1.25em; line-height:1.5em; color:#000; letter-spacing:0.2em; text-transform:uppercase; font-weight:700; margin-bottom:1em;}
.copy_dl dd { font-size:1em; color:#383838;}
.copy_dl04 dd p { font-size:0.9em; text-transform:uppercase;}
.copyWarp a {color:#383838;}
.copy { font-size:0.75em;}
.link_talk { position:fixed; right:40px; bottom:40px; z-index:50;}
.link_talk li { float:left; margin-left:20px;}
.link_talk li a { display:block; width:32px; height:37px; padding-top:5px; color:#fff; opacity:0.6; filter: alpha(opacity=60;); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.link_talk li a:hover, .link_talk li a:focus { padding:0 0 5px;  opacity:1; filter: alpha(opacity=100;);}
.link_talk li a img { width:35px; height:35px;}

.main_navi_info a b:before {content: "";display: inline-block;background-image: url("http://hi-web.co.kr/web/img/hi_web_s.png");vertical-align: middle;width: 20px;height: 20px;background-size: cover;background-position: center;margin: 0 1px 4px 4px;}

@media  (max-width: 1480px){
.main_container #footer { width:calc(100% - 100px); left:100px;}
.sub #footer { padding:50px 30px 50px 110px;}
.copy_dl01 { margin-left:0;}
.copy_dl02 { width:720px;}
.copy_dl021 {margin-left:3%;}
.copy_dl dt { font-size:1.1em; line-height:1.5em; }
.copy_dl dd { font-size:0.9em;}

}

.specialPre .lSAction_sp { position:absolute; width:100%; left:0; top:30%; z-index:5; }
.lSAction_sp a { position:absolute; display:block; width:50px; height:50px; font-size:48px; line-height:50px; text-align:center; color:#fff; cursor:pointer; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.lSAction_sp .lSPrev_sp { left:-50px;}
.lSAction_sp .lSNext_sp { right:-50px;}
.lSAction_sp .lSPrev_sp:hover { left:-60px;}
.lSAction_sp .lSNext_sp:hover { right:-60px;}

.swiper-button { position:fixed; width:120px; height:56px; right:30px; top:50%; margin-top:-28px; text-align:right; z-index:10;}
.swiper-button a { display:inline-block;  margin:0 1px; cursor:pointer; visibility:visible; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;  }
.swiper-next { right:0; width:56px; height:56px;background:url(/web/img/main/main_ri_txt.png); background-size:100% 100%; }
.swiper-prev { left:0;  width:56px; height:56px;background:url(/web/img/main/main_le_txt.png); background-size:100% 100%; }
.swiper-next:hover, .swiper-next:focus {margin-right:-10px;}
.swiper-prev:hover, .swiper-prev:focus {margin-left:-10px;}

.swiper-button a.swiper-button-disabled { opacity:0; filter: alpha(opacity=0;);visibility:hidden; display:none;}

@media  (max-width: 1280px){


}

@media  (max-width: 640px){
} 

@media \0screen { /* IE8 웹폰트 설정*/
}


@media  (max-width: 1680px){
}

@media  (max-width: 1440px){

 #preroom {width:60%;}
}

@media  (max-width: 1280px){

.none1280 {display:none;} 
.block1280 {display:block !important;}
.in-block1280 {display:inline-block !important;}

}

@media  (max-width: 1024px){

.none1024 {display:none !important;} 
.block1024 {display:block !important;}
.in-block1024 {display:inline-block !important;}


} 

@media  (max-width: 768px){

.none768 {display:none !important;;} 
.block768 {display:block !important;;}
.in-block768 {display:inline-block !important;;}

}

@media  (max-width: 560px){

.none560 {display:none !important;;} 
.block560 {display:block !important;;}
.in-block560 {display:inline-block !important;;}

}

@media  (max-width: 480px){

.none480 {display:none !important;;} 
.block480 {display:block !important;;}
.in-block480 {display:inline-block !important;;}

}


@media  (max-width: 380px){

.none380 {display:none;} 
.block380 {display:block;}
.in-block380 {display:inline-block;}	
}