@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('https://fonts.googleapis.com/css2?family=Karla:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Overpass:ital,wght@0,100;0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');

@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: 'Cafe24Danjunghae';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Cafe24Danjunghae.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Cafe24Simplehae';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Cafe24Simplehae.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: 'IBMPlexSansKR-Light';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-07@1.0/IBMPlexSansKR-Light.woff') format('woff');
    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',"Malgun Gothic","Nanum Gothic",NanumGothic,Dotum,"돋움",Arial; font-weight:300;}
*+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:#616161; 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;}
strong{font-weight:100;}
.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;}


#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: 25%;right: 4%;top: 52%;margin-top: 18.5em;text-align: right;color:#fff;font-size:1em;text-shadow:2px 2px 3px rgba(0, 0, 0, 0.4);opacity:0.8;z-index:5;}
.topTitle .title01 {display:block;font-size: 3.3em;text-align: right;line-height: 1.2em;font-weight: 600;letter-spacing:0.05em;text-transform:uppercase;margin-bottom:10px;  font-family: 'Cafe24Simplehae';}
.topTitle .title02 { display:block; font-size:1.5em; line-height:1.7em; font-weight:300;}
.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;}
/*@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%;}}*/

.topTitle01 {position:absolute;width:70%;left:15%;top:43%;margin-top: 0;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: 2.3em;/* line-height:1em; */font-weight:300 !important;letter-spacing:0.05em;text-transform:uppercase;margin-bottom:10px; }
.topTitle01 .title02 {display:block;font-size: 3.5em;line-height: 1.2em;font-weight:500;  font-family:'Cafe24Simplehae';}
.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;}




.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: 47%;height:80px;right:50%;top: 46%;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: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:-35px; top:52px; background-image:url('/web/img/prev.png');}
.topArea .lSAction > .lSNext {right: -103%;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%;}
.topTitle{margin-top:14.5em;}
}




@media  (max-width: 1366px){
.topTitle{margin-top:12.5em;}
.topArea .lSAction > .lSPrev{left:-43px;}
.cnt{right:48%; top:94%;}

.topTitle .title01{font-size:2.3em;}
.topTitle01 .title02{font-size:2.5em;} .topTitle01 .title01{font-size:1.5em;}
}



@media  (max-width: 1280px){
.topArea .lSAction > .lSPrev{left:-22px;}
.topArea .lSAction > .lSPrev{display:none;}

}



@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;}
.topTitle{margin-top:2.5em; width:31%;}


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

.topArea .btn_down { display:none;} .topTitle01{display:none;}

.topArea .lSAction { right:5px;}


}


@media  (max-width: 768px){
.topArea .lSAction > .lSPrev{display:block;}

.mainlight > .lSSlideOuter > .lSSlideWrapper > .lSAction{top:65% !important;}
.mainlight > .lSSlideOuter > .lSSlideWrapper > .lSAction >.lSPrev {left:-33px !important;}
.mainlight > .lSSlideOuter > .lSSlideWrapper > .lSAction >.lSNext {right:-59px !important;}

.cnt{right:45%;}

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

.topTitle { display:none;}

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

.topArea .lSAction > .lSPrev{left:-735px;} .topArea .lSAction > .lSNext{right:45%;}

}





@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: 480px){
.topArea .lSAction > .lSPrev{left:-385px;} .topArea .lSAction > .lSNext{right:45%;}
}

@media(max-width: 375px){
.topArea .lSAction > .lSPrev {left:-343px;}
}