@import url(//fonts.googleapis.com/earlyaccess/jejumyeongjo.css); /* font-family: 'Jeju Myeongjo', serif; */
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

html {
    font-family: "Noto Sans KR", sans-serif;
}

body,
ul,
li {
    margin: 0;
    padding: 0;
    list-style: none;
    color: #555555;
}

a {
    color: #707070;
    text-decoration: none;
}

/* 라이브러리 */
.con {
    margin: 0 auto;
}
.con2 {
    margin: 0 auto;
    
}
.con3 {
    margin: 0 auto;
}
.con1700 {
    margin: 0 auto;
}
.reser {
    margin: 0 auto;
}
.img-box > img {
    width: 100%;
    display: block;

}

.row::after {
    content: "";
    display: block;
    clear: both;
}

.cell {
    box-sizing: border-box;
    float: left;
}
.cell2 {
    box-sizing: border-box;
     float: left;
}

.cell-right {
    
    box-sizing: border-box;
    float: right;
}

.con {
    max-width: 94%;
}
.con2 {
    max-width: 1400px;
}
.con3 {
    max-width: 950px;
}
.con1700 {
    max-width: 1700px;
}
.reser {
    max-width: 1400px;
}
@media (max-width: 850px) {
.reser {
        width: 100%;
    }
}


html{
width:100%;height:100%;overflow-y:auto;overflow-x:hidden;-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", "NanumBarunGothic",'Noto Sans KR', "Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial; font-size:13px; line-height:1.5em;
}
*+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: "NanumBarunGothic", "Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial; font-size:13px; line-height:1.5em;
}
body{
visibility:visible; width:100%; font-size:13px;color:#666;line-height:1.5em;  background:url(../img/bg.jpg);
}
img,fieldset{
border:none;
}
/*em,address{
font-style:normal;
}*/
li{
list-style:none;
}
select,textarea{
border-radius:0;
}
.clear {}
.clear:after {
content:"";display:block;clear:both;
}
.block { 
display:block !important; width:100%;
}
.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; color:#666; 
}
.underline {
text-decoration:underline;
}

.block1280, .block1024, .block768, .block560, .block480, .block380 {display:none;}
.in-block1280, .in-block1024, .in-block768, .in-block560, .in-block480, .in-block380 {display:none;}
* {-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);}
.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;}


/* header */
.sticky-wrapper {
position:relative; width:100%; height:auto !important; z-index:11;
}
#header { 
position:relative; 
width:100%; 
background:url(../img/bg.jpg); 
/*opacity:0;
transition: opacity 2s;

#header:hover {
    opacity:1; 
}*/
opacity:1; 
filter: alpha(opacity=0;); /* 탑메뉴 천천히 보이게 */
-webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; 
z-index:10;
}
#header:after {
content:"";display:block;clear:both;
}
.logo { 
position:relative; width:220px; margin:0 60px; text-align:center; z-index:10;
}
.logo a { 
display:block; padding:40px 0 100px; 
}
.logo img { 
width:100%; max-width:216px; vertical-align:top; 
-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;
}
.logo a { 
display:block;
}


/* 모바일 좌측메뉴 시작 */
/* 삼선아이콘 */
.ico {
    display: inline-block;
    width: 20px;
    height: 20px;
    position: relative;
    cursor: pointer;
}

.ico > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 20%;
    background-color: black;
}

.ico > div:nth-child(2) {
    top: 40%;
    transition: visibility 0s 0.3s;
}

.ico > div:nth-child(3) {
    top: 80%;
}

.ico.active > div:nth-child(2) {
    visibility: hidden;
    transition: visibility 0s;
}

.ico > div:nth-child(1),
.ico > div:nth-child(3) {
    transition: top 0.15s 0.15s, transform 0.15s 0s;
}

.ico.active > div:nth-child(1),
.ico.active > div:nth-child(3) {
    top: 40%;
    transform: rotate(45deg);
    transition: top 0.15s, transform 0.15s 0.15s;
}

.ico.active > div:nth-child(3) {
    transform: rotate(-45deg);
}

/* 모바일 좌측메뉴 시작 */
.visible-on-sm-down {
    display: none;
}

@media (max-width: 1010px) {

	.no-margin-on-sm-down {
        margin-left: 0;
        margin-right: 0;
    }

    .visible-on-sm-down {
        display: block;
    }

    .visible-on-md-up {
        display: none;
    }

    html.hide-y-scroll-bar-on-sm-down,
    html.hide-y-scroll-bar-on-sm-down > body {
        overflow-y: hidden;
    }
}


/* 모바일 탑1 바 */

.toggle-side-bar-btn {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}

/* 좌측 사이드 바 */
.left-side-bar-box {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    visibility: hidden;
    transition: visibility 0s 0.3s, background-color 0.5s;
    z-index: 9;
}

.left-side-bar-box.active {
    background-color: rgba(0, 0, 0, 0.5);
    visibility: visible;
    transition: visibility 0s;
}

.left-side-bar {
    position: absolute;
    top: 0;
    left: -300px;
    width: 300px;
    height: 100%;
    padding-top: 70px;
    background-color: rgba(0, 0, 0, 0.6);
    transition: left 0.3s;
	overflow-y:auto;
    box-sizing:border-box;
}

.left-side-bar-box.active .left-side-bar {
    left: 0;
}

.left-side-bar .menu-1 > ul {
}

.left-side-bar .menu-1 ul > li > a {
    display: block;
    padding: 10px 0;
    padding-left: 8px;
    color: white;
	font-size:1rem;
    background-color: rgba(0, 0, 0, 0.5);
}
.left-side-bar .menu-1 ul > li > ul > li > a {
    display: block;
    padding: 10px 0;
    padding-left: 8px;
    color: inherit;
	font-size:0.9rem;
    background-color: white;
}

.left-side-bar .menu-1 ul > li > a::after {
    content: "";
    float: right;
    margin-right: 15px;
}

.left-side-bar .menu-1 ul > li > a:not(:only-child)::after {
    content: "+";
}

.left-side-bar .menu-1 ul > li.active > a:not(:only-child)::after {
    content: "+";
}

.left-side-bar .menu-1 > ul ul {
    display: none;
    background-color: #efefef;
}

.left-side-bar .menu-1 > ul ul ul {
    display: none;
    background-color: #dfdfdf;
}

.left-side-bar .menu-1 li.active > ul {
    display: block;
}

.left-side-bar .menu-1 > ul ul > li > a {
    padding-left: 10px;
}

.left-side-bar .menu-1 > ul ul ul > li > a {
    padding-left: 20px;
}

.to-top-btn {
    position: fixed;
    bottom: 15px;
    left: 50%;
    margin-left: 630px;
    background-color: rgba(0, 0, 0, 0.9);
    padding: 5px 10px;
    font-size: 1.4rem;
    border-radius: 0px;
    cursor: pointer;
}

/* 모바일 좌측메뉴 끝 */



#gnbArea { 
position:absolute; width:60%; left:20%; top:0; text-align:center; 
-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:2;
}
#gnbArea:hover { }
.gnb { position:relative; display:inline-block; margin:0 auto; padding-top:40px}
.gnb:after { content:"";display:block;clear:both;}
.gnb > li { float:left; margin:0 0.5em; -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; width:1.6em; padding:5px 0 2px;font-family: 'Jeju Myeongjo', serif; font-size:1.28em; line-height:1.6em; color:#222; letter-spacing:0.2em; 
-webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; border-right:2px solid #efede5; border-right:2px solid rgba(34, 34, 34, 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;
}
.gnb li a.depth1:after { /* 오버시 2픽셀 line */
content:""; position:absolute; right:0; top:0; width:2px; height:0; background:#555; z-index:-1; 
-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:after, .gnb li a.depth1:focus:after { height:100%;}
.gnb li.this a.depth1 { color:#fff;}
.gnb li.this a.depth1:after { width:100%; height:100%;}
.gnb li span.depth1_mobile { display:none;}
.gnb_sub { display:none !important; position:absolute; padding:5px 10px 0; background:#fff; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease;-79 ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; display:none; margin-left:-20px; }
.gnb_sub:after, .gnb_sub > ul:after, .gnb_third:after {content:"";display:block;clear:both;}
.gnb_sub li { float:left; margin:0 10px;  }
.gnb_sub li a { display:block; color:#333; font-size:14px; line-height:1.8em; padding-bottom:5px }
.gnb_sub li .depth2_mobile { display:none;}
.gnb_sub li.this > a, .gnb_third li.this a { font-weight:700;}
.gnb_third { position:absolute; display:none !important; padding:5px 14px 10px; background:#fff; left:0; border-top:1px solid #eee;}
.gnb_sub li:hover .gnb_third, .gnb_sub li.on .gnb_third { display:block !important;}
.gnb_sub_bg { position:absolute; width:3px; height:17px; right:-3px; top:0; background:#fff; margin:0 !important; z-index:2;}
.gnb_third li { margin:0 5px; }
.gnb_third li a {font-size:12px;}
#header .btn_reser { position:absolute; display:inline-block; right:60px; top:50px; padding:1em 2.5em; /* font-family: 'Roboto', sans-serif; */    font-family: 'Jeju Myeongjo', serif; color:#222; letter-spacing:0.1em; border:1px solid #222; -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; }
#header .btn_reser:hover, #header .btn_reser:focus { background:#222; color:#fff; }

.is-sticky #header { -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); }
.is-sticky .logo { width:150px; margin:0 30px; }
.is-sticky .logo a { padding:30px 0 80px;}
.is-sticky .gnb {  padding-top:30px; }
.is-sticky .btn_nav { right:10px; top:7px; }
.is-sticky #header .btn_reser { right:30px; top:30px; }

@media \0screen { 
}

@media  (max-width: 1480px){

.logo { width:180px; margin:0 40px; }
.logo a { padding:30px 0 80px; }

.gnb { padding-top:30px}
.gnb > li { margin:0 0.3em; }
.gnb li a.depth1 { width:1.6em; padding:5px 0 2px; font-size:1.28em; line-height:1.6em; color:#222; letter-spacing:0.1em; }

#header .btn_reser { right:40px; top:30px; padding:1em 2.5em; font-size:0.9em; letter-spacing:0.1em; }
.is-sticky #header { }
.is-sticky .logo { width:140px; margin:0 20px; }
.is-sticky .logo a { padding:20px 0 60px;}
.is-sticky .gnb {  padding-top:20px; }
.is-sticky #header .btn_reser { right:20px; top:20px; }

}

@media  (max-width: 1280px){
.none1280 {display:none !important;} 
.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;}

.sticky-wrapper { position:relative; }

.btn_nav { display:block;}
.logo { width:140px; margin:0 10px; top:10px; }/* 모바일 로고크기*/
.logo a { padding:10px 0;}
#header .btn_reser { right:40px; top:30px; padding:0.6em 1.5em; font-size:0.8em; letter-spacing:0.1em; border:1px solid rgba(34, 34, 34, 0.3) } /* 모바일 실시간버튼 */


#gnbArea { position:fixed; width:100%; height:100%; left:auto !important; right:0 !important; top:-100% !important; background:url(../images/bg/white_80.png); margin:0 !important;  }
.open_nav #gnbArea { top:0 !important;}
.gnb {  height:auto;  background:none; padding-top:120px; }
.gnb > li { float:left; width:2em; margin:0 0.5em; }
.gnb li a.depth1 {width:2em;font-size:1.45em; padding:8px 0;  line-height:2em; }
.gnb_sub {position:relative; width:280px; display:none; padding:12px 5px 12px 20px; background:#333; margin-left:-20px !important; }
.gnb > li:hover .gnb_sub, .gnb > li.this .gnb_sub { display:block;}
.gnb_sub li { float:left; margin-right:6px;}
.gnb_sub li a { display:inline-block; color:#fff; font-size:14px; line-height:1.8em; letter-spacing:-0.02em; padding-bottom:0; }
.gnb2 .gnb_sub li a.depth2_web { display:none;}

.is-sticky .logo { width:100px; margin:0 10px; }
.is-sticky .logo a { padding:10px 0; }
.is-sticky #header .btn_reser { right:10px; top:12px; }
.is-sticky .gnb { padding-top:130px;}

}


/* copyright */
#footer { position:relative; min-height:155px; padding:5em 6em 4em;z-index:10;}
.footer_area { position:relative; width:100%; max-width:1600px; margin:0 auto; color:#4b4b4b; z-index:1; }
.footer_area a { color:#4b4b4b; }
.footer_area:after {content:"";display:block;clear:both;}
.footer01 { font-size:1em; line-height:1.5em; font-weight:700; color:#4b4b4b; margin-bottom:20px;}
.footer01 span { display:inline-block; font-family: 'Jeju Myeongjo', serif; font-size:1.7em; font-weight:400; margin-right:5px; vertical-align:middle; }
.footer02, .footer03 { font-size:1em; line-height:1.4em;} 
.footer04 { text-align:right;  font-size:0.9em; margin-top:0.5em; color:#343434;  }

/* 아이콘 3개 */
#footer .footer_link { position:absolute; right:-0.5em; bottom:100px; opacity:0; filter: alpha(opacity=0;); z-index:2;}
.footer_link li { float:left; margin-left:0.7em; font-size:1.8rem; }
.footer_link li a { display:inline-block; color:#acacac;}
.footer_link span { float:center; margin-left:0.7em; margin-top:1.9em;font-size:0.7rem; text-align:center; }
.active#footer .footer_link { opacity:1; filter: alpha(opacity=100;); bottom:30px; }

@media  (max-width: 768px){
#footer { padding:1em 1em 0;font-size:0.9em; line-height:1.3em; z-index:1;margin-top:30px; }
#footer p { }
#footer .footer_link { position:absolute; right:-0.5em; bottom:100px; opacity:0; filter: alpha(opacity=0;); z-index:2;}
.footer01 br {  }
.footer_link li { float:left; margin-left:0.7em; font-size:1.8rem; }
.footer_link li a { display:inline-block; color:#acacac;}
.footer_link span { float:center; margin-left:0.7em; margin-top:1.9em; font-size:0.7rem; text-align:center; }
.active#footer .footer_link { opacity:1; filter: alpha(opacity=100;); bottom:-60px; }
}


/* 메인 slider */
.topArea { position:relative; height:calc(100vw * 0.365); background:#ddd; overflow:hidden; z-index:1;}
.lightSlider li img { width:100%; vertical-align:top;}
.topArea .lightSlider li {background-repeat:no-repeat !important; background-size:cover !important; background-position:center center !important;}
@media ( max-width:850px ) {
	.lightSlider li background-image {
	    background-size: 100% 900px;
	}
    .lightSlider li img { width:100%; height:150%; vertical-align:top;}
}

.topArea .lSAction { position:absolute; width:30px; height:140px;right:2.5%; top:50%; margin-top:-70px; z-index:4; }
.topArea .lSAction a{ position:absolute;  display:block; width:30px; font-size:1.8em; line-height:1.35em; color:#fff; left:0; text-align:center; margin:0; -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; opacity:0.9; filter: alpha(opacity=90;);  -webkit-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); -moz-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); text-shadow:2px 2px 3px rgba(0, 0, 0, 0.1);}
.topArea .lSPager { display:none;}
.lSAction>.lSPrev { top:0;}
.lSAction>.lSNext { top:auto; bottom:0;}
.topArea .lSPager.lSGallery { position:absolute; left:0; bottom:0; display:block !important; background:#fff; padding:5px 0 0; z-index:5;}

.topArea .count { position:absolute; width:30px; height:70px; right:2.5%; top:50%; margin-top:-35px;  text-align:center; font-family: 'Playfair Display', serif; color:#fff; z-index:2; }
.topArea .count span { position:absolute; display:block; width:30px; text-align:center; font-size:1.25em; line-height:30px; -webkit-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); -moz-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); text-shadow:2px 2px 3px rgba(0, 0, 0, 0.1);}
.topArea .count .current { top:0;}
.topArea .count .line { height:1px; background:#fff; left:0; top:50%; opacity:0.8; filter: alpha(opacity=80;);}
.topArea .count .total { bottom:0;}

.topArea .topTypo { position:absolute; width:60%; left:20%;color:#FFF; font-weight:400; text-align:center; 
-webkit-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2); -moz-text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2); text-shadow:2px 2px 3px rgba(0, 0, 0, 0.2); z-index:5; }
.topTypo { height:100%; top:0; text-align:center; }
.topTypo .title01 { display:block; width:26%; max-width:155px; margin:0 auto; }
.topTypo .title01 span { display:block; width:1px; height:6vw; background:url(../img/white_30.png); margin:0 auto;}
.topTypo .title01 .line02 { height:19.5vw;}
.topTypo .title02 { display:block; font-family: 'Jeju Myeongjo', serif; font-size:1.4em; line-height:1.5em; margin-top:-30%;}
.sub .topTypo .title02 { display:none;}

.topArea .btn_scroll {position:absolute; left:50%; bottom:0; margin-left:-32px; z-index:5;}
.topArea .btn_scroll img { vertical-align:top;}



@media  (max-width: 1280px){
.vertical_typo_r3 {width:120px;}
.topTypo .title02 { font-size:1em; line-height:1.5em; margin-top:-36%;}
.vertical_typo li.vt_001 {margin:0 0.8em;  font-size:0.4em; color:#a7a7a7; line-height:1.6em; letter-spacing:0.1em;}
.vertical_typo li.vt_002 { font-size:0.9em; line-height:1em; color:#222; letter-spacing:0;}
}

@media  (max-width: 1024px){
.topArea { height:calc(100vw * 0.45);}
}
@media  (max-width: 768px){
.topArea { height:calc(100vw * 0.5);}
.topTypo .title01 .line02 { height:27vw;}
}
@media  (max-width: 560px){
.topTypo dt {font-size:10.5vw; }
.main .topTypo dt {font-size:6.6vw;}
}

