@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'); 
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i');
@import url('//fonts.googleapis.com/earlyaccess/jejumyeongjo.css'); 
@import url('https://fonts.googleapis.com/css?family=Questrial'); 
@import url('https://fonts.googleapis.com/css?family=Cormorant:300,400,400i,500,600,700,700i'); 
@import url('https://fonts.googleapis.com/css?family=Karla:400,700'); 
@import url('https://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,600,700'); 
@import url('https://fonts.googleapis.com/css?family=Catamaran'); 
@import url('https://fonts.googleapis.com/css?family=Cormorant+Infant'); 
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100,200,300,400,500,600,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@100,200,300,400,500,600,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Khula:wght@300;400;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Didact+Gothic&display=swap');

@import url(//fonts.googleapis.com/earlyaccess/jejumyeongjo.css);


@font-face {
    font-family: 'HangultuelGothic';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_ten@1.10/HangultuelGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Cafe24Dangdanghae';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.2/Cafe24Dangdanghae.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'YiSunShinDotumM';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/YiSunShinDotumM.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
     font-family: 'S-CoreDream-3Light';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}

@font-face {
    font-family: 'Cafe24Oneprettynight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Cafe24Oneprettynight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'KCC-eunyoung';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/KCC-eunyoung-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard-Light';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard-SemiBold';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
    font-weight: 600;
    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',"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", "NanumBarunGothic", 'NanumSquare', 'Noto Sans KR', "Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial;}
body{visibility:visible; width:100%; font-size:13px;color:#3e3e3e; background:#fff; line-height:1.5em; }
/*span, strong{font-weight:bold !important;} */
img,fieldset{border:none;}
em,address{font-style:normal;}
a{text-decoration:none;color:#3e3e3e;}
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);}

.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;}

::-webkit-scrollbar {width: 5px;}
::-webkit-scrollbar-thumb {background-color: #687480;}
::-webkit-scrollbar-track {background-color: #a9a9a9; }


#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%; left:0; top: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; z-index:30; }



/*사진 슬라이드*/
.topArea .lSAction { position:absolute; width:30px; height:80px; right:50%; top:90%; margin-top:-40px; z-index:5; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.15);}
.topArea .lSAction > a { width:30px; height:30px; margin:0; text-align:center; opacity:0.7; filter: alpha(opacity=70;); color:#fff; f
-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;}
.topArea .lSAction > a i { font-size:3em; line-height:30px; color:#fff;}
.topArea .lSAction > a:hover, .topArea .lSAction > a:focus {opacity:1; filter: alpha(opacity=100;);}
.topArea .lSAction > .lSPrev:hover, .topArea .lSAction > .lSPrev:focus { /*left:-60px;*/ opacity:0.85;}
.topArea .lSAction > .lSNext:hover, .topArea .lSAction > .lSNext:focus { /*right:-95px;*/ opacity:0.85;}
.cnt{position: absolute;right: 48.8%;z-index: 100;text-align: center;color: #fff;top: 92.5%;height: 20px;margin-top: -10px;text-shadow:2px 2px 3px rgba(0, 0, 0, 0.15); letter-spacing:2px;}



.topArea { position:absolute; width:100%; left:0; top:0; z-index:3;}
.topTitle {position:absolute;width:70%;left:15%;top: 0;margin-top: 70%;text-align:center;color:#fff;font-size: 1em;text-shadow: 0px 7px 6px rgb(0 0 0);opacity: 1;z-index:5;}
.topTitle .title01 {display:block;font-size:1.3em;line-height:1em;font-weight:300 !important;letter-spacing:0.05em;text-transform:uppercase;margin-bottom:10px;font-family: "Cormorant",sans-serif;}
.topTitle .title02 {display:block;font-size:2.2em;line-height: 1.5em;font-weight: 200;font-family: 'Jeju Myeongjo', serif;}
.topTitle{	animation-duration:3s ;animation-name:myani; -webkit-animation-duration:3s; -webkit-animation-name:myani;	 -moz-animation-duration:3s; -moz-animation-name:myani; -webkit-animation-fill-mode:both;}

.topArea { position:absolute; width:100%; left:0; top:0; z-index:3;}
.topTitle01 { position:absolute; width:70%; left:15%; top:43%; margin-top:23.5em; text-align:center; color:#fff;  font-size:1em; text-shadow:2px 2px 3px rgba(0, 0, 0, 0.4); opacity:0.8; z-index:5;}
.topTitle01 .title01 {display:block;font-size:1.3em;line-height:1em;font-weight:300 !important;letter-spacing:0.05em;text-transform:uppercase;margin-bottom: 20px;font-family:'S-CoreDream-3Light';}
.topTitle01 .title02 {display:block;font-size: 2.5em;line-height:1em;font-family: 'Jeju Myeongjo', serif;font-weight:500;}
.topTitle01{	animation-duration:3s ;animation-name:myani; -webkit-animation-duration:3s; -webkit-animation-name:myani;	 -moz-animation-duration:3s; -moz-animation-name:myani; -webkit-animation-fill-mode:both;}
/*@keyframes myani{0%{ top:30%; opacity:0;} 100%{top:50%;}}
@-webkit-keyframes myani{0%{ top:30%; opacity:0;}100%{top:50%;}}
@-moz-keyframes myani{0%{ top:30%; opacity:0;}100%{top:50%;}}*/




.lSSlideOuter { position:relative; z-index:1;}
.lightslider { background:#ddd; 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;}
.topArea .btn_down { position:absolute; width:97px; left:50%; bottom:30px; margin-left:-48px;-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; opacity:0; filter: alpha(opacity=0;); z-index:6;}
.topArea .btn_down img { width:100%; vertical-align:top;}
.topArea .btn_down:hover, .topArea .btn_down:focus { margin-bottom:-10px;}


.topArea .lSAction {position:absolute;width: 97%;height:80px;right: 0;left: 0;top: 46%;margin: auto;margin-top:-40px;z-index:5;text-shadow:2px 2px 3px rgba(0, 0, 0, 0.15);}
.topArea .lSAction > a {width: 30px;height: 9px;margin:0;text-align:center;opacity:1;filter: alpha(opacity=70;);color:#fff;f
-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;font-size: 3.5em;}
.topArea .lSAction > a i { font-size:3em; line-height:30px; color:#fff;}
.topArea .lSAction > a:hover, .topArea .lSAction > a:focus {opacity:1; filter: alpha(opacity=100;);}
.topArea .lSAction > .lSPrev {left: 0;top:52px;/*background-image:url('/web/img/prev.png');*/}
.topArea .lSAction > .lSNext {right: 0;top:52px;/*background-image:url('/web/img/next.png');*/}
.topArea .lSAction > .lSPrev:hover, .topArea .lSAction > .lSPrev:focus { /*left:-60px;*/ opacity:0.75;}
.topArea .lSAction > .lSNext:hover, .topArea .lSAction > .lSNext:focus {/*right:-95px;*/ opacity:0.75;}


.active .topLine, .active .topTypo {opacity:1; filter: alpha(opacity=100;);  transition: all 0.8s ease-in-out 0.8s;}

.subTop {opacity:0; 
-webkit-transition: all 1.1s cubic-bezier(0.44, 0.45, 0.35, 1), -webkit-transform 1.1s cubic-bezier(0.44, 0.45, 0.35, 1); 
transition: all 1.1s cubic-bezier(0.44, 0.45, 0.35, 1), -webkit-transform 1.1s cubic-bezier(0.44, 0.45, 0.35, 1); 
-o-transition: all 1.1s cubic-bezier(0.44, 0.45, 0.35, 1);}
.active.subTop {transition-delay:0.2s; -ms-transition-delay : 0.2s; -moz-transition-delay : 0.2s; -o-transition-delay : 0.2s; -webkit-transition-delay : 0.2s;  opacity:1; }



@media  (max-width: 1660px){
.cnt { right:48.7%; top:93%;}
.topTitle01{margin-top:19.5em;}
}


@media  (max-width: 1440px){
.topTitle{ margin-top:75%;}
}


@media  (max-width: 1366px){
.cnt{right:48%; top:94%;}
.topTitle01{margin-top:15.5em;}

.topTitle01 .title02{font-size:2em;} .topTitle01 .title01{font-size:1em;}

}



@media  (max-width: 1280px){


}



@media  (max-width: 1024px){

.gnbArea { padding-top:90px;}
.gnb > li { float:none; margin-top:15px;}
/*.gnb > li .num { display:none;}*/
.gnb > li a.depth1 { display:none;}
.gnb > li .depth1_mobile { display:block;font-size:1.5vw; line-height:1em;}
.gnb > li.this .depth1_mobile, .gnb li .depth1_mobile:hover, .gnb > li:hover .depth1_mobile  { font-weight:400;}
.gnb_sub { position:relative; display:none; padding:0; margin:5px 0 8px; }
.gnb_sub li { display:inline;  margin:0 5px;}
.gnb_sub li a { font-size:0.95em; line-height:1.8em;}
.gnb li.this .gnb_sub { display:block; }

.topArea { position:relative; top:0;}


.topTypo { left:17px; bottom:46px;}
.topTypo img { width:9px;}

.topArea .btn_down { display:none;}



.topTitle01{display:none;}  .topTitle{display:none;}


}


@media  (max-width: 768px){

.mainlight > .lSSlideOuter > .lSSlideWrapper > .lSAction{top:65% !important;}


.cnt{right:42%;}

.topTypo { left:7px; bottom:26px;}
.topTypo img { width:7px;}

.topTitle { display:none;}

.topArea .lSAction {  height:60px; right:0; top:33%; margin-top:-30px; left:0;}
.topArea .lSAction > a { width:20px; height:20px;opacity:1; filter: alpha(opacity=100;); }
.topArea .lSAction > a i { font-size:2em; line-height:20px;}


}





@media  (max-width: 1280px){
}

@media  (max-width: 640px){
} 

@media \0screen { /* IE8 웹폰트 설정*/
}

@media  (max-width: 1680px){
}

@media  (max-width: 1420px){
}

@media  (max-width: 1280px){
}

@media (max-width : 550px){ 
}

@media (max-width : 500px){ 
.topTitle{display:block; margin-top:-7.5em; display:none;}
.topTitle .title02{font-size:1.5em;} .topTitle .title01{font-size:1.1em;} 
}

@media  (max-width: 480px){


}

@media(max-width: 375px){
.topArea .lSAction > a{font-size:3.5em;} 
/*.topArea .lSAction{display:none !important;}*/
}
@media(max-width: 360px){

}
@media(max-width: 330px){
.topArea .lSAction > a{font-size:2.5em;} 
}