@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);

/********** font **********/
/* Big Caslon Medium */
@font-face{
  font-family:"Big Caslon Medium";
  src:url("/static/pc/_font/Big Caslon Medium.eot?") format("eot"),
      url("/static/pc/_font/Big Caslon Medium.woff2") format("woff2"),/*firefox에서 글자 깨지는 경우를 위해 추가*/
      url("/static/pc/_font/Big Caslon Medium.woff") format("woff"),
      url("/static/pc/_font/Big Caslon Medium.ttf") format("truetype");
      font-weight:normal;
      font-style:normal;}

/* BIG JOHN */
@font-face{
  font-family:"BIG JOHN";
  src:url("/static/pc/_font/BIG JOHN.eot?") format("eot" ),
      url("/static/pc/_font/BIG JOHN.woff2") format("woff2"),/*firefox에서 글자 깨지는 경우를 위해 추가*/
      url("/static/pc/_font/BIG JOHN.woff") format("woff"),
      url("/static/pc/_font/BIG JOHN.ttf") format("truetype");
      font-weight:normal;
      font-style:normal;}
.bigCaslon{font-family:'Big Caslon Medium'}
.bigJohn{font-family:'BIG JOHN'}

/********** font **********/

/********** reset **********/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, section, summary,
time, mark, audio, video{margin:0;padding:0;border:0;font-family:'Noto Sans KR',sans-serif;vertical-align:baseline}
address,em{font-style:normal}
input,button,select{font-family:'Noto Sans KR',sans-serif;vertical-align:middle;margin:0;padding:0;}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section{display:block;}
hr{width:100%;height:1px;margin:50px 0;border:0;clear:both;background-color:#e7e7e7;}
html{font-family:'Noto Sans KR',sans-serif;font-size:12px;}
body{color:#000;}
html, body{width:100%;height:100%;background:#fff;overflow:hidden;}
ol,ul,li{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
button,input[type='button'],
input[type='reset'],
input[type='submit'] {-webkit-appearance:button;cursor:pointer;}
button{margin:0;padding:0;border:0;background-color:transparent;}
button:-moz-focus-inner,
input:-moz-focus-inner{border:0;padding:0;}
a{text-decoration:none;color:#666;}
a:focus{outline:none}
/* a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px;} */
strong,th,h1,h2,h3,h4,h5,h6{font-weight:normal;}
input[type=text],input[type=password],input[type=email],input[type=number],input[type=date],input[type=tel],input[type=datetime]{width:100%;height:37px;padding:3px 5px;border:1px solid #d3d4d6;border-radius:0;border-radius:5px;background:#fff;font-family:'Noto Sans KR',sans-serif;font-size:14px;color:#666;-webkit-appearance:one;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
input[type=radio],input[type=checkbox]{position:absolute;top:0;right:0;left:0;bottom:0;z-index:10;width:20px;height:20px;border:none;background:none;letter-spacing:0;vertical-align:middle;opacity:0;-webkit-appearance:none;-ms-appearance:none}
input[type=radio]{border-radius:100%}
input[type=radio] + i,input[type=checkbox] + i{display:none}
input[type=radio]:checked + i,input[type=checkbox]:checked + i{display:block;position:absolute;top:0;left:0}
input[type=radio]:checked + i{width:8px;height:8px;margin:5px 0 0 5px;border-radius:100%;background-color:#24a9e1}
input[type=checkbox]:checked + i{width:20px;height:20px;background-position:center -30px;background-repeat:no-repeat;background-size:20px auto;background-image:url(/static/pc/images/check_box.png);}
.radio,.checkbox{display:inline-block;position:relative;top:0;width:20px;height:20px;margin-right:5px;
background-position:center 0;background-repeat:no-repeat;background-size:20px auto;
background-image:url(/static/pc/images/check_box.png);vertical-align:middle;box-sizing:border-box}
.radio{width:20px;height:20px;border-radius:10px}

table{width:400px;border-collapse:collapse;border-spacing:0;font-size:22px;}
table th{padding:8px;font-size:13px;font-weight:500;color:#2f2f2f;text-align:left;border:1px solid #ddd;background:#eee}
table td{padding:8px;font-size:13px;line-height:1.2rem;color:#000;border:1px solid #ddd;}
/********** reset **********/


.hide,legend,caption{position:absolute;left:-9999px;width:0;height:0;overflow:hidden;text-indent:-9999px;}
caption{display:none;}
.a11y-hidden{overflow:hidden;clip:rect(0 0 0 0);clip:rect(0,0,0,0);position:absolute;width:1px;height:1px;margin:-1px;border:0;padding:0;}


/********** layout **********/
#wrap{height:100%;overflow:hidden;}
#container{height:100%}
#header{display:block;z-index:999;position:fixed;top:0;left:0;padding:50px 100px;color:#f2f2f2;text-align:center;box-sizing:border-box;}
#header:after{display:block;clear:both;content:''}
#header h1{position:relative;float:left;width:103px;}
header h1#logo{z-index:999;position:relative;display:inline-block;}
header h1#logo a{position:relative;display:inline-block;width:103px;}
header h1#logo a img{width:100%;opacity:0;vertical-align:top;}
header h1#logo a span{display:block;position:relative;width:100%;height:17px;}
header h1#logo a .logoW{background:url(/static/pc/images/logo_w.png) no-repeat center center / 100%;}
header h1#logo a .logoB{position:absolute;top:0;left:0;visibility:hidden;background:url(/static/pc/images/logo_b.png) no-repeat center center / 100%;}
#footer:after{content:'';display:block;clear:both}
#footer{z-index:10;position:absolute;bottom:0;left:0;width:100%;padding:45px 100px;font-size:12px;font-weight:400;color:#fff;box-sizing:border-box}
#footer div{float:right;}
#footer div:first-child{float:left;line-height:1.8rem;}
#footer div ul{margin-top:25px;}
#footer div ul li{display:inline}
#footer div ul li a{position:relative;display:inline-block;margin:0 15px;color:#fff}
#footer div ul li:first-child a:before{width:0}
#footer div ul li a:before{display:block;content:"";position:absolute;top:4px;left:-15px;width:1px;height:12px;background:#666;opacity:0.5}
#footer div li.insta a{width:25px;height:25px;margin-right:8px;background:url(/static/pc/images/sprite_icon.png) no-repeat 0;background-position:center 0px;text-indent:-9999px}
#sub #footer,#sub #footer div ul li a{color:#000}
#sub div li.insta a{background-position:center -28px;}

/* sub */
html.sub, body.sub{min-width:1280px;margin:0 auto !important;overflow-x:auto}
#sub{position:absolute;bottom:0;width:100%;min-width:1280px;background:#fff}
#sub h2{z-index:1 !important;position:absolute;top:120px;width:100%;font-size:120px;color:#d05b3a;font-family:"Big Caslon Medium";text-align:center;line-height:130px;}
#sub section{padding:200px 0 0;}
#sub .btn_home{z-index:999;position:fixed;top:45px;right:100px;color:#000;font-size:23px;font-family:"BIG JOHN";}
#sub .intro{text-align:center}
#sub .intro p{font-size:14px;font-weight:400;line-height:2rem}
#sub .intro .img{padding-bottom:50px;}
/********** layout **********/

/* skip */
body.intro header h1#logo a .logoB{visibility:visible}
.skip{height:100%;text-align:center;}
.video_wrap{position:relative;height:100%}
.video_wrap p{z-index:100;position:absolute;top:140px;width:100%;font-size:16px;font-family:"Big Caslon Medium"}
.video_wrap h2{z-index:1;position:absolute;top:50%;width:100%;margin-top:-180px;font-size:300px;font-family:"Big Caslon Medium";letter-spacing:55px}
#mainVideo{z-index:10;position:absolute;top:50%;left:50%;margin:-270px 0 0 -480px;width:960px;height:540px}
#mainVideo video{width:100%;height:100%;object-fit:cover;object-position:50% 50%;}

/* main */
.menu{z-index:10;top:0;position:absolute;width:100%;height:100%;background-color:transparent}
.menu ul{position:absolute;top:50%;left:25%;width:270px;margin-top:-180px;margin-left:-15px;text-align:left;}
.menu ul li a{display:inline-block;min-width:120px;padding:15px 0;font-family:"BIG JOHN";font-size:30px;color:#fff;cursor:pointer;}
.menu ul li.active a{font-family:"Big Caslon Medium";font-size:32px}
.menu ul li:nth-child(4).active a{;letter-spacing:3px}
.bg {position:fixed;z-index:-10;top:0;right:0;bottom:0;left:0;pointer-events:none;
  -moz-transition:all .8s;
  -webkit-transition:all .8s;
  transition:all .8s;
  -moz-transform:scale(1.1);
  -webkit-transform:scale(1.1);
  transform:scale(1.1);
  opacity: 0;
  visibility: hidden;
}
.menu ul li.active .bg{opacity:1;visibility:visible;z-index:-1;-moz-transform:scale(1);-webkit-transform:scale(1);transform:scale(1);}
.menu ul li:nth-child(1) a{width:120px}
.menu ul li:nth-child(2) a{width:185px}
.menu ul li:nth-child(3) a{width:130px}
.menu ul li:nth-child(4) a{width:250px}
.menu ul li:nth-child(1) .bg{opacity:1;visibility:visible;z-index:-9;background:url(/static/pc/images/main_bg01.png) no-repeat center / cover}
.menu ul li:nth-child(2) .bg{background:url(/static/pc/images/main_bg02.png) no-repeat center / cover}
.menu ul li:nth-child(3) .bg{background:url(/static/pc/images/main_bg03.png) no-repeat center / cover}
.menu ul li:nth-child(4) .bg{background:url(/static/pc/images/main_bg04.png) no-repeat center / cover}
.line-wrap{position:relative; }
.line, .line span{position:absolute;top:0;right:0;left:0;}
.line{bottom:0;overflow:hidden;pointer-events:none }
.line span{content: "";bottom: .18vw;border-bottom:1px solid #fff;}
.line-1 span:first-child {
    opacity:0;
    -webkit-transform:translateX(-102%);
    transform:translateX(-102%);
}
.line-1 span:last-child {
    -webkit-transition: -webkit-transform 1.2s cubic-bezier(.23,1,.32,1);
    transition: -webkit-transform 1.2s cubic-bezier(.23,1,.32,1);
    transition:transform 1.2s cubic-bezier(.23,1,.32,1);
    transition:transform 1.2s cubic-bezier(.23,1,.32,1),-webkit-transform 1.2s cubic-bezier(.23,1,.32,1);
    -webkit-transform:translateX(102%);
    transform:translateX(102%);
    opacity:1;
}
.menu ul li.active .line-wrap .line-1 span:first-child {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.23,1,.32,1);
    transition: -webkit-transform 1s cubic-bezier(.23,1,.32,1);
    transition:transform 1s cubic-bezier(.23,1,.32,1);
    transition:transform 1s cubic-bezier(.23,1,.32,1),-webkit-transform 1s cubic-bezier(.23,1,.32,1);
    -webkit-transform:translateX(0);
    transform:translateX(0);
    opacity:1;
}
.menu ul li.active .line-wrap .line-1 span:last-child {
    -webkit-transition:none;
    transition:none;
    -webkit-transform:translateX(0);
    transform:translateX(0);
    opacity:0;
}

/* about */
#sub .about .btn_home{color:#fff}
.about{color:#fff;background:#000}
.about .intro img{width:420px;}
.about .info{padding:450px 260px 180px;background:url(/static/pc/images/about_bg.png) no-repeat center 120px / 1920px;}
.about .info:after{content:'';display:block;clear:both}
.about .info > div{float:left;width:50%;font-size:14px;text-align:left}
.about .info > div h3{padding-bottom:30px;font-size:36px;font-family:"Big Caslon Medium"}
.about .info > div > div{padding-bottom:80px}
.about .info > div p{line-height:2rem}
.about .info > span{clear:both;display:block;font-size:110px;font-family:"Big Caslon Medium";letter-spacing:82px;opacity:0.08;text-align:center}
#sub .about #footer,#sub .about #footer div ul li a{color:#fff}
#sub .about div li.insta a{background-position:center 2px}

/* lounge */
#sub .lounge{background:#d6d6d6}
#sub .lounge h2{top:628px;font-family:"BIG JOHN"}
.lounge .intro img{width:530px;}
.baverage{padding:200px 0 0;}
.baverage .slider-nav{height:450px;}
.baverage .slider-nav li{height:450px;position:relative;}
.baverage .slider-nav h3{position:relative;top:50%;width:100%;margin-left:-6px;font-size:180px;word-break:keep-all;color:#fff;font-family:'BIG JOHN';text-align:center;overflow:hidden;line-height:180px;margin-top:-40px;}
.baverage .slider-nav .img{display:block;padding:0 58px;position:relative;margin-top: -35px;}
.baverage .slider-nav .img img{width:500px !important;position:relative;left:50%;margin-left:-250px;}
.baverage .slider-nav .nav02 .img{top:-80px;}
.baverage .slider-nav .nav02 h3{margin-top:-110px;}
.baverage .slider-nav .nav03 h3{letter-spacing:50px;padding-left:30px}
.baverage .slider-nav .slick-slide h3 span{display:block;font-family:'BIG JOHN';line-height:14rem;}
.baverage .slider-nav .slick-slide.on h3{border:1px solid red}
.baverage .slider-for{width:1200px;margin:0 auto;}
.baverage .slider-for:after{content:'';display:block;clear:both}
.baverage .slider-for ul li{padding-bottom:15px;}
.baverage .slider-for .variety{padding-left:200px;box-sizing:border-box;}
.baverage .slider-for .variety ul{display:table-cell;width:350px;box-sizing:border-box}
.baverage .slider-for .variety ul li{text-align:center;}
.baverage .slider-for .slick-slide{padding:60px 50px 130px;text-align:center}
.baverage .slider-for .slick-slide ul li{font-size:16px;font-family:"Big Caslon Medium";line-height:2.6rem}

/* space */
#sub .space{padding:0;background:#fff}
#sub .space h2{;-ms-transform:rotateZ(-90deg) !important;-webkit-transform:rotateZ(-90deg) !important;transform:rotateZ(-90deg) !important;top:50%;left:50%;width:600px;margin-left:-595px;margin-top:-170px;text-align:center}
#sub .space h2 span{display:block;font-family:'BIG JOHN'}
.space .intro{position:relative;height:100%}
.space .intro img{width:420px}
.space .intro .img{position:absolute;top:50%;left:0;width:100%;margin-top:-310px}
.space .intro .img p{padding-top:50px}
.space .info{display:table;width:100%;height:100%}
.space .info > div{display:table-cell;text-align:center;vertical-align:middle}
.space .info > div h3{padding-bottom:25px;font-size:36px;font-family:"Big Caslon Medium";visibility:hidden}
.space .info > div p{font-size:14px;font-weight:400;line-height:2rem;}
.space .info > div p{visibility:hidden}
[id*="section"]{position:relative}
[id*="section"] .info{position:relative;z-index:1;}
.img_list li:first-child{position:absolute;top:0;left:0;width:50%;height:100%}
.img_list li:last-child{position:absolute;top:0;right:0;width:50%;height:100%}
#section1 .img_list li:first-child{background:url(/static/pc/images/space/space01_left.png) no-repeat 0 / contain}
#section1 .img_list li:last-child{background:url(/static/pc/images/space/space01_right.png) no-repeat 100% 0 / contain;}
#section2 .img_list li:first-child{background:url(/static/pc/images/space/space02_left.png) no-repeat 0 / contain}
#section2 .img_list li:last-child{background:url(/static/pc/images/space/space02_right.png) no-repeat 100% 0 / contain}
#section3 .img_list li:first-child{background:url(/static/pc/images/space/space03_left.png) no-repeat 0 / contain}
#section3 .img_list li:last-child{background:url(/static/pc/images/space/space03_right.png) no-repeat 100% 0 / contain}
#section4 .img_list li:first-child{background:url(/static/pc/images/space/space04_left.png) no-repeat 0 / contain}
#section4 .img_list li:last-child{background:url(/static/pc/images/space/space04_right.png) no-repeat 100% 0 / contain}

/* rental */
#sub .rental{height:100%}
#sub .rental #footer{position:fixed}
#sub .rental:after{content:"";display:block;clear:both}
#sub .rental h2{width:600px;height:260px;top:50%;left:25%;margin-top:-130px;margin-left:-250px;color:#000;transform:rotate(-90deg);box-sizing:border-box;}
.rental h2 span{display:block;font-family:'BIG JOHN';padding-bottom:15px;}
.rental .rental_cont{position:relative;top:50%;left:50%;width:860px;height:650px;margin-top:-485px;margin-right:100px;}
.rental .intro p{font-weight:400;text-align:left}
.rental .intro h3{padding-bottom:40px;font-size:30px;font-family:"Big Caslon Medium";text-align:left}
.rental .info{padding-top:60px;}
.rental .info ul li{display:table;width:100%;font-size:14px;}
.rental .info ul li span{display:table-cell;padding-bottom:25px;}
.rental .info ul li span:first-child{width:150px;font-weight:bold}

/* contact */
.overlay-up .overlay-close{position:absolute;top:50px;right:50px;color:#e1512c;font-size:20px;font-family:'BIG JOHN'}
.contact{padding:85px 100px 0;}
.contact h2{font-size:60px;font-family:'BIG JOHN';text-align:left}
.contact .info{padding:45px 0 0;font-size:14px;}
.contact .info ul li{display:inline-block;padding:35px 0 55px;text-decoration:underline}
.contact .info ul li:first-child{padding-right:40px;text-decoration:none}
.input_area{border-top:4px solid #000;}
.input_area > div:first-of-type{box-sizing:border-box}

.input_area div{position:relative;margin:20px 0 0;}
.input_area > div > label{position:absolute;top:15px;left:10px;font-size:16px;font-family:"Big Caslon Medium";}
.input_area label.on{color:#e1512c}
.input_area input[type='text'],.input_area textarea{display:inline-block;width:100%;height:50px;padding-left:75px;font-size:14px;color:#000;border:0;text-align:left;background:transparent;opacity:1;border-radius:0;border-bottom:1px solid #000;box-sizing:border-box;outline:none}
.input_area > div > div{position:relative}
.input_area textarea{resize:none;height:100px;padding:20px 10px;margin-top:30px;font-family:'Noto Sans KR',sans-serif;}
.input_area .message span{position:absolute;top:12px;right:10px;font-size:14px;font-weight:100;color:#979797}
.input_area input.on{border-bottom:1px solid #e1512c;border-width:2px;}
.input_area em{display:none;z-index:-1;position:absolute;top:15px;left:76px;font-size:14px;color:#e1522e;}
.input_area em.on{display:block}
.input_area .message em{top:48px;left:10px;}
.input_area input:focus + em{display:none}
.input_area textarea:focus + em{display:none}
.input_area .check_area{margin:0;line-height:24px}
.input_area .check_area > p{position:relative;padding:15px 0 15px 10px;;border-bottom:1px solid #ddd}
.input_area .check_area p label{padding-left:8px;font-size:14px;vertical-align: middle;}
.input_area .check_area .personal_info{display:none;padding:0;margin:0;overflow-y:auto;}
.input_area .check_area .personal_info div{padding:20px 15px;}
.personal_info{padding:90px 26px 30px;box-sizing:border-box;}
.personal_info h2{padding-bottom:20px;font-weight:500}
.personal_info p{padding-bottom:5px;font-weight:300;font-size:13px;}
.personal_info table{width:600px;margin:20px 0}
.personal_info table th{text-align:center}
.personal_info table td{font-weight:300;line-height:1.4}
#toggle{position:absolute;right:10px;top:50%;display:block;width:22px;height:22px;margin-top:-9px;color:#000;}
.form_wrap button{display:block;width:90px;margin:50px auto 80px;padding:10px 0;font-size:18px;color:#000;font-family:"Big Caslon Medium";border-bottom:1px solid #000;letter-spacing:2px;}

.moreCrossIco{position:relative;display:block;width:30px;height:30px;margin:0 auto;}
.moreCrossIco.small{width:20px;height:20px;}
.moreCrossIco span{display:block;background:#000;position:absolute;}
.moreCrossIco span.barH{width:100%;height:2px;top:50%;left:0;}
.moreCrossIco span.barV{width:2px;height:100%;top:0;left:50%;}
.moreCrossIco.small span.barH{margin:-1px 0 0;}
.moreCrossIco.small span.barV{margin:0 0 0 -1px;}

/* error */
.error{position:absolute;top:50%;width:100%;margin-top:-180px;}
.error .icon{padding-bottom:70px;color:#eee;font-size:150px;font-family:'BIG JOHN';text-align:center}
.error > p strong{display:block;font-size:28px;font-weight:600;}
.error p{font-size:14px;font-weight:400;text-align:center}
.error p:nth-of-type(2){padding:20px 0}
.error.system{margin-top:-320px;}
.error.system > p strong{padding-bottom:35px;}
.error.system .txt{width:400px;margin:0 auto;padding:40px 20px;font-size:14px;border:1px solid #dfdfdf;border-right:0;border-left:0}
.error.system .txt strong{display:block;padding-bottom:8px;font-weight:600;text-align:left}
.error.system .txt ul li{position:relative;padding-left:10px;font-size:14px;line-height:2rem}
.error.system .txt ul li:before{display:block;content:'';position:absolute;top:12px;left:0;width:4px;height:1px;background:#000}
.error.system a{display:block;width:150px;margin:40px auto 0;padding:10px;font-size:14px;color:#fff;background:#000;text-align:center}

/* effect button */
a.animated-button.thar-one{z-index:100;display:block;position:absolute;left:50%;bottom:120px;width:70px;margin-left:-35px;padding:12px;color:black;cursor:pointer;border-bottom:1px solid #000;font-family:"Big Caslon Medium";font-size:18px;font-weight:normal;letter-spacing:2px;transition:all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;} a.animated-button.thar-one:hover{color:#fff !important;background-color:transparent;text-shadow:none;}
a.animated-button.thar-one:hover:before{height:100%;bottom:0%;top:auto;}
a.animated-button.thar-one:before{content:'';display:block;z-index:-1;position:absolute;left:0px;top:0px;height:0px;width:100%;color:#fff !important;background:#000;transition:all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;}


/* [s] 190225 edit : popup 추가*/
.privacy{display:none;z-index:9999;position:fixed;_position:absolute;top:0;left:0;width:100%;height:100%;color:#222}
.layer_bg{position:absolute;top:0;left:0;width:100%;height:100%;background:#000;opacity:0.7;filter:alpha(opacity=70);}
.popup{display:block;z-index:10;position:absolute;top:0;left:0;width:100%;height:100%;font-size:13px;background-color:#fff;letter-spacing:-1px;overflow-y:scroll;}
.privacy .close{z-index:999;position:fixed;top:45px;right:100px;color:#000;font-size:23px;font-family:"BIG JOHN";}
.privacy .personal_info{width:1200px;margin:0 auto;}
.privacy .personal_info h2{padding:30px 0 35px;margin-bottom:50px;font-weight:600;font-size:28px;border-bottom:2px solid #000;text-align:center}
.privacy .personal_info p{padding-bottom:10px;font-weight:400;}
/* [e] 190225 edit */

@media (max-width:1620px) {
  .rental .rental_cont{width:40%}
}