@charset "utf-8";
/* *******************************************************
 * filename : layout.css
 * description : 전체 레이아웃 CSS
******************************************************** */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Teko:wght@300;400;500;600;700&display=swap');


/* ****************** LAYOUT ********************** */
body, table, th, td, button, select, input, textarea {
	font-family: 'Noto Sans KR', 'Lato', "돋움", Dotum, Arial, sans-serif;
	font-size:13px;
	color:#666;
	-webkit-text-size-adjust:none;
}
body { background-color:#fff; }
body.lagn_kor{word-break:keep-all; -webkit-word-break:keep-all}
body.lagn_eng{word-break:break-word; -webkit-word-break:break-word}
#wrap {overflow:hidden; width:100%; min-width:320px; position:relative; }
.area { max-width:1200px; margin:0px auto;} /* width 홈페이지 컨텐츠 가로값에 맞게 변경 */
.area1400 { max-width:1400px; margin:0px auto;} /* width 홈페이지 컨텐츠 가로값에 맞게 변경 */
.area-box{ max-width:1680px; margin:0px auto; }
.font-teko {font-family: 'Teko', sans-serif !important;}
.blue {color: #1e7023 !important;} 
.bg_blue {background: #2875d4 !important; } 


/* -------- 공통 :: 버튼 -------- */
.cm-button-style04,
.cm-button-style04 strong,
.cm-button-style04 i{-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s; box-sizing:border-box; -webkit-box-sizing:border-box}
.cm-button-style04{position:relative; overflow:hidden; border:1px solid #222; text-align:left; background-color:#222; display:table; width:100%;  height:100%}
.cm-button-style04:before{
    display:block; position:absolute; left:-130%; bottom:0; content:""; width:120%; height:150%; background:#fff; /* opacity:0;filter:Alpha(opacity=0); */
    transform:skew(-20deg); 
    -webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s
}
.cm-button-style04 strong{position:relative; left:0px; z-index:1; display:table-cell; color:#fff; font-size:16px; font-weight:600; text-indent:25px;  width:100%; height:100%; vertical-align:middle}
.cm-button-style04 i{position:absolute; top:0px; right:15px; line-height:55px; color:#333; font-size:24px;}
.cm-button-style04:hover{}
.cm-button-style04:hover strong{color:#333;}
.cm-button-style04:hover i{color:#333}
.cm-button-style04:hover:before{left:-10%; opacity:1.0;filter:Alpha(opacity=100);}
.type2 .cm-button-style04{ display:inline-block; width:calc(38% - 15px); }
.radius .cm-button-style04{ border-radius:30px;}
.transparent .cm-button-style04{background: transparent;}
.cm-button-style04.white{ border-color:#fff}
.cm-button-style04.white i {line-height: 42px; color: #fff}

.cm-button-style04.btn-ac strong{text-indent:0; text-align:center}
/*white btn*/
.cm-button-style04.btn_white{ background-color:#fff;}
.cm-button-style04.btn_white strong{ color:#222;}
.cm-button-style04.btn_white:before{ background-color:#222;}
.cm-button-style04:hover strong, .cm-button-style04:hover i {color:#111}
/* 버튼02 */
.business-btn-box{text-align:center; margin-top:85px;}
.business-btn-box a{display:inline-block; width: 350px; height:70px; margin:0 5px; background-color:#ed1d25;}
.business-btn-box a span {display:table; width: 100%; height:100%;}
.business-btn-box a em {display:table-cell; vertical-align:middle; color: #fff; font-size: 16px; letter-spacing:-0.25px; }
 
@media all and (max-width:800px){
.cm-button-style04 strong{ font-size:14px}
}
/* ****************** HEADER ********************** */
#header{position:absolute; height:120px; top:0; left:0; z-index:12; width:100%;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s; background: #fff; }	/* 배경위에 헤더가있으면 absolute변경 후 headerInnerWrap 배경삭제 */
.main-wrapper #header{width:calc(100% - 400px);}
.fullpage-wrapper #header {position: fixed;}
/*.sub-wrapper #headerInnerWrap{ background-color:#222}*/
#headerInnerWrap {position:relative; top:0px; left:0px; width:100%; height:120px; max-width: 1400px; margin: 0 auto; z-index:9999; -webkit-transition:background-color 0.3s;-moz-transition:background-color 0.3s;-o-transition:background-color 0.3s;-ms-transition:background-color 0.3s;transition:background-color 0.3s}
#headerInner{position:relative; height:100%; margin:0px auto; -webkit-transition:padding 0.3s;-moz-transition:padding 0.3s;-o-transition:padding 0.3s;-ms-transition:padding 0.3s;transition:padding 0.3s}
/* -------- Header :: Logo -------- */
#header .logo{position:relative; z-index:100; float:left; padding:40px 0; }		/* padding값 적절히 바꿔주세요 */
#header .logo a{display:block; position:relative}
#header .logo img{display:block; vertical-align:top;}
#header .logo img.blue {position:absolute; top:0; left:0; opacity:0;filter:Alpha(opacity=0);}
/* -------- Header :: UTIL BOX -------- */
.header-util-box{position:absolute; top:50%; right:0; margin-top:-22px; z-index:100;}
.linked-btn {float:left; font-size: 20px; color:#fff; line-height:40px;}
/* Header :: 언어선택 */
.header-lang {position:relative; float:left; width:112px; height:40px; z-index:100; margin-left:35px; overflow:hidden; }
.header-lang:before {content:""; width:100%; height:100%; border:1px solid #ddd; position:absolute; left:0; top:0; overflow:hidden;  -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;box-sizing: border-box; }
.header-lang > ul > li {float:left; width:50%; overflow:hidden;}
.header-lang > ul > li > a {position:relative; display:block; font-size:14px; line-height:40px; color:#111; text-align:center; overflow:hidden;
-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s }
.header-lang > ul > li > a span {position:relative; z-index:1; }
.header-lang > ul > li > a:before{content:""; display:block; position:absolute; left:-150%; bottom:0; content:""; width:133%; height:124%; background:#1e7023;
	transform:skew(-20deg); opacity:0;filter:Alpha(opacity=0); z-index:0;
	-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s}
.header-lang > ul > li.selected > a , .header-lang > ul > li > a:hover {color:#fff; }
.header-lang > ul > li > a:hover:before , .header-lang > ul > li.selected a:before{left:-10.5%; opacity:1.0;filter:Alpha(opacity=100);}

/* Header :: 사이트맵(기본형 or 커스텀) */
.sitemap-custom-btn {width:32px; height:32px; display:none;}
@media all and (min-width: 1025px){
.sitemap-custom-btn {display:block;}
.main-wrapper .sitemap-custom-btn {display:none;}
}
/* -------- Header :: GNB(PC) -------- */
.gnb-overlay-bg{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:9997;}	/* gnb overlay BG */
#gnb{position:absolute; text-align:center; top:0; right:0px;  z-index:99;}
#gnb > ul{display:inline-block; *display:inline;*zoom:1;}
#gnb > ul > li{position:relative; float:left; word-break:keep-all;}
#gnb > ul > li > a{
	position:relative; z-index:100; display:table; height:116px; padding:0 40px; text-align:center; color:#111; font-size:20px; letter-spacing:-0.75px; transition:all 0.5s;
}
#gnb > ul > li > a span {display:table-cell; vertical-align:middle; }
#gnb > ul > li > a span em {position:relative;  font-weight:400; }
#gnb > ul > li > a span em:before {content:""; position:absolute; bottom:-10px; left:50%; width:0; height:3px; background-color: #fff; opacity:0;filter:Alpha(opacity=0); transition:all 0.4s;}
#gnb > ul > li > a:hover span em:before , #gnb > ul > li.on > a span em:before {opacity:1;filter:Alpha(opacity=100); left:0; width:100%;}

/* GNB :: 2차메뉴 Over (높이변경) */
#gnb.open #gnbBg{height:350px}
#gnb.open > ul > li .gnb-2dep{height:250px; opacity:1.0;filter:Alpha(opacity=100);visibility:visible;-webkit-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.2s;-moz-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.2s;-ms-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.2s;-o-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.2s;transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out 0.2s;}
/* GNB :: 2차 각각메뉴 */
#gnb.each-menu > ul > li .gnb-2dep{/* display:none; */position:absolute; top:120px; left:50%;margin-left:-100px;z-index:99;width:200px; text-align:center; visibility:hidden;opacity:0;filter:Alpha(opacity=0);}
#gnb.each-menu > ul > li .gnb-2dep:before{content:""; position:absolute; top:-20px; left:0px; right:0px; height:0; opacity:0;filter:Alpha(opacity=0); background-color:rgba(0,0,0,0.8); -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
#gnb.each-menu > ul > li .gnb-2dep.m_only{ display:none}
#gnb.each-menu > ul > li .gnb-2dep ul{padding:0px 0px 15px 0;}
#gnb.each-menu > ul > li .gnb-2dep ul li{position:relative; padding:14px 25px; opacity:0;filter:Alpha(opacity=0);-webkit-transition:all 0s 0s;-moz-transition:all  0s 0s;-o-transition:all  0s 0s;-ms-transition:all  0s 0s;transition:all  0s 0s; }
#gnb.each-menu > ul > li .gnb-2dep ul li a { display:block; color:#aaa; font-size:16px; font-weight:400;  line-height:1.3; transition:color 0.4s; opacity:0.85; filer:Alpha(opacity=85);}
#gnb.each-menu > ul > li .gnb-2dep ul li a:hover{ opacity:1; filter:Alpha(opacity=100); color: #fff}
/* over했을때 */
#gnb.each-menu > ul > li:hover .gnb-2dep:before{height:calc(100% + 20px); opacity:1.0;filter:Alpha(opacity=100);}
#gnb.each-menu > ul > li .gnb-2dep.open{visibility:visible; opacity:1.0;filter:Alpha(opacity=100);}
#gnb > ul > li .gnb-2dep.open ul li{opacity:1.0;filter:Alpha(opacity=100); -webkit-transition:all 0.8s;-moz-transition:all 0.8s;-o-transition:all 0.8s;-ms-transition:all 0.8s;transition:all 0.8s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(1){-webkit-transition-delay: 0.1s;-moz-transition-delay: 0.1s;-o-transition-delay: 0.1s;-ms-transition-delay: 0.1s;transition-delay:0.1s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(2){-webkit-transition-delay: 0.2s;-moz-transition-delay: 0.2s;-o-transition-delay: 0.2s;-ms-transition-delay: 0.2s;transition-delay:0.2s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(3){-webkit-transition-delay: 0.3s;-moz-transition-delay: 0.3s;-o-transition-delay: 0.3s;-ms-transition-delay: 0.3s;transition-delay:0.3s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(4){-webkit-transition-delay: 0.4s;-moz-transition-delay: 0.4s;-o-transition-delay: 0.4s;-ms-transition-delay: 0.4s;transition-delay:0.4s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(5){-webkit-transition-delay: 0.5s;-moz-transition-delay: 0.5s;-o-transition-delay: 0.5s;-ms-transition-delay: 0.4s;transition-delay:0.5s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(6){-webkit-transition-delay: 0.6s;-moz-transition-delay: 0.6s;-o-transition-delay: 0.6s;-ms-transition-delay: 0.4s;transition-delay:0.6s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(7){-webkit-transition-delay: 0.7s;-moz-transition-delay: 0.7s;-o-transition-delay: 0.7s;-ms-transition-delay: 0.4s;transition-delay:0.7s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(8){-webkit-transition-delay: 0.8s;-moz-transition-delay: 0.8s;-o-transition-delay: 0.8s;-ms-transition-delay: 0.4s;transition-delay:0.8s;}

/* -------- Header :: Blue.ver -------- */
#header.blue #headerInnerWrap{ background-color:#fff;}
#header.blue .logo img.default {opacity:0;filter:Alpha(opacity=0);}
#header.blue .logo img.blue {opacity:1;filter:Alpha(opacity=100);}
#header.blue .linked-btn {color: #111; }
#header.blue .header-lang:before {border-color: #111; }
#header.blue .header-lang > ul > li > a {color:#111;}
#header.blue .header-lang > ul > li > a:before {background-color:#0090d3;}
#header.blue .header-lang > ul > li.selected > a, #header.blue .header-lang > ul > li > a:hover {color:#fff; }
#header.blue #gnb > ul > li > a {color:#111; }
#header.blue #gnb > ul > li > a span em:before{ background-color:#111}

/* blue헤더 오버시 */
#header.blue.open .logo img.blue {opacity:0;filter:Alpha(opacity=0);}
#header.blue.open .logo img.default {opacity:1;filter:Alpha(opacity=100);}
#header.blue.open .linked-btn {color: #fff; }
#header.blue.open .header-lang:before {border-color: #fff; }
#header.blue.open .header-lang > ul > li > a {color:#fff;}
#header.blue.open .header-lang > ul > li > a:before {background-color:#fff;}
#header.blue.open .header-lang > ul > li.selected > a, #header.blue.open .header-lang > ul > li > a:hover {color:#111; }
#header.blue.open #gnb > ul > li > a {color:#fff; }

/* -------- Header :: GNB(Mobile) -------- */
.nav-open-btn{display:none;}
#gnbM{display:none}
#headerMenuM {display:none;}

/* -------- Header :: 서브페이지헤더 -------- */
.sub-wrapper #header.blue {position:relative;}
.sub-wrapper #header.blue #headerInnerWrap {background-color: #313131;}
/* .sub-wrapper #header.blue .sitemap-custom-btn {display:block;}  */
.sub-wrapper #header {position:fixed;}

/* -------- Header :: Sub 헤더  숨기기  -------- */
#header.sub-hidden{/* top:-101px; */ -ms-transform: translateY(-101px); -o-transform: translateY(-101px);   -moz-transform: translateY(-101px);-webkit-transform: translateY(-101px);   transform: translateY(-101px);}
#header.sub-hidden #topMenu01 {padding:0;}
#header.sub-hidden.up{/* top:0px; */-ms-transform: translateY(0); -o-transform: translateY(0); -moz-transform: translateY(0);-webkit-transform: translateY(0); transform: translateY(0);}

/* ****************** FOOTER ********************** */
#footer{position:relative; background-color:#fff; padding: 2.2% 0 5%;; z-index:100; border-top: 1px solid #eee;}
#footer p, .footer-copyright {font-size:15px; letter-spacing:-0.5px; color:#888; line-height: 1.6;}
/* -------- FOOTER :: 상단 -------- */
#footerTop {padding-bottom: 26px; border-bottom: 1px solid #eee;}
#footerBottom {padding-top: 33px;}
.footer-right-con .foot-menu {}
.footer-right-con .foot-menu li {display: inline-block; border:1px solid #ddd; margin-left: 17px;}
.footer-right-con .foot-menu li a {display: block; padding: 8px 20px; color: #444; font-size: 13px; font-weight: 500;}
.footer-right-con .foot-menu li a:hover {background: #444; color: #fff;}


#topMenu01 {display: none;}



/* Footer :: TOP버튼 */
.to-top-btn{
	position:fixed; bottom:-100px; right:15px; display:block; width:46px; height:46px; background-color:#fff; text-align:center; color:#333; z-index:1000;
	border:1px solid #eee;
	box-sizing:border-box;
	opacity:0;filter:Alpha(opacity=0);
	-webkit-transition:all 0.6s;-moz-transition:all 0.6s;-o-transition:all 0.6s;-ms-transition:all 0.6s;transition:all 0.6s;
	-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;
}
.to-top-btn.bottom-fixed{bottom:15px; opacity:1.0;filter:Alpha(opacity=100);}
.to-top-btn i{display:inline-block; font-size:16px; line-height:46px; transition:all 0.3s}
.to-top-btn:hover i{transform:translateY(-3px)}

.footer-privacy-btn {display:inline-block; position:relative; font-size: 14px; color:#fff; opacity:0.4;filter:Alpha(opacity=40); padding-bottom:5px;}
.footer-privacy-btn:before {content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background-color: #fff;}



/* ****************** SUB-FOOTER ********************** */
/* -------- FOOTER :: 레이아웃 -------- */
#sub_footer {background-color:#818285;}
#sub_footer .footer-area {max-width:1600px; margin:0 auto;}
#sub_footer .footer-area > div{ -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; position:relative; }
#footerInner{position:relative; }
.footer-left-con{float:left;}
.footer-right-con{float:right; } 



/*  SUB LAYOUT :: 비주얼 */
#visual{position: absolute;  /*fixed*/ width:100%; top: 0; left: 0; background-color: #fff; overflow: hidden;}
.ie-browser #visual{position: absolute;}
/*#visual .visual-img-con{ background-color:rgba(238,238,238); background-repeat:no-repeat; background-position:50% 0;}*/
#visual .visual-img-con{-webkit-transform: scale(1.2,1.2) rotate(0.002deg); transform: scale(1.2,1.2) rotate(0.002deg); position:absolute; top:120px; left:0px; width:100%; height:433px; background-size:100% !important; opacity:0.2;filter:Alpha(opacity=20); -webkit-transition:all 1.5s; transition:all 1.5s;}
#visual.active .visual-img-con{-webkit-transform: scale(1.0,1.0) rotate(0.002deg); transform: scale(1.0,1.0) rotate(0.002deg);}
#visual .visual-txt-con{position:relative; z-index:1; text-align:center; display:table; width:100%; padding-top:120px !important; box-sizing:border-box; height: 553px;}
#visual .visual-txt-container{position:relative; width:100%;}
#visual .visual-tit{font-size:60px; font-weight:600; letter-spacing:-0.5px; color:#fff;}
#visual .visual-sub-txt{font-size:20px; font-weight:600; letter-spacing: -0.25px; color: rgba(255,255,255,0.5); padding-top:30px;}
#visual .visual-img-con.sub_visual1{background:url(../../images/sub_visual1.jpg)no-repeat;}
#visual .visual-img-con.sub_visual2{background:url(../../images/sub_visual2.jpg)no-repeat;}
#visual .visual-img-con.sub_visual3{background:url(../../images/sub_visual3.jpg)no-repeat;}
#visual .visual-img-con.sub_visual4{background:url(../../images/sub_visual4.jpg)no-repeat;}
/*  SUB LAYOUT :: 비주얼 타이틀 active */
#visual .visual-tit{position: relative; opacity: 0; transition: all 0.5s; overflow: hidden;}
#visual .visual-tit .char{position:relative; font-weight:inherit;}
/*  SUB LAYOUT :: 비주얼 active */
#visual.active .visual-img-con{opacity:1;filter:Alpha(opacity=100) ;}
#visual.active .visual-tit{opacity: 1.0;}
#visual.active .visual-tit .char{animation: text-active-animation 1s cubic-bezier(.5, 0, .5, 1) both;}

@keyframes text-active-animation {
	from {opacity:0;filter:Alpha(opacity=0); top:1em;}
	to {opacity:1.0;filter:Alpha(opacity=100); top:0;}
}

@keyframes text-up {
  from {transform: translate3d(0, 150%, 0);}
  to {transform: translate3d(0, 0, 0);}
}

/* ****************** SUB LAYOUT ********************** */
/*  SUB LAYOUT :: 컨텐츠 레이아웃 */
#middleArea {position: relative; z-index: 11; margin-top: 30%;/*header높이에 맞게*/ }
/*#middleArea #sub_content{width: 100%;box-sizing: border-box; position: relative;padding: 130px 0;}*/


/* SUB LAYOUT :: 서브메뉴(스타일2) */
#topMenu02 {position:relative; width:100%; height:68px;}
#topMenu02 .side-menu-inner {text-align:center; width:100%; height:68px; background-color: #fff;}
#topMenu02 .side-menu-inner ul {display: flex;}
#topMenu02 .side-menu-inner ul li {display:inline-block; flex: 1; -webkit-transition:all 0.5s; transition:all 0.5s; border:1px solid #ddd; margin-left: -1px;}
#topMenu02 .side-menu-inner ul li > a{display:block; display:table; position:relative;width:100%;height:68px; line-height:1.2; color:#111; font-size:17px; font-weight:400; word-break:keep-all;-webkit-transition:all 0.3s; transition:all 0.3s;}
#topMenu02 .side-menu-inner ul li > a:before{position:absolute;top: 50%; margin-top: -7px;left:0;width:1px;height:14px;background-color:rgba(255,255,255,0.1);content:"";-webkit-transition:all 0.4s;transition:all 0.4s;}
#topMenu02 .side-menu-inner ul li > a > span{display:table-cell; vertical-align:middle; padding:0 15px;}
#topMenu02 .side-menu-inner ul li.on{background-color: #fff;}
#topMenu02 .side-menu-inner ul li.on:hover{background-color: #fff;}
#topMenu02 .side-menu-inner ul li:hover{background-color:#1e7023;}
#topMenu02 .side-menu-inner ul li:hover a {color: #fff;}
#topMenu02 .side-menu-inner ul li.on > a:before {opacity: 0;}
#topMenu02 .side-menu-inner ul li.on > a {color:#fff; background: #1e7023; font-weight: 600;}



/* SUB LAYOUT :: 모바일메뉴(공통)  */
#topMenuM01,#topMenuM02{display:none;}
/* SUB LAYOUT :: 서브 타이틀 (공통)  */
.sub-title-Area{ margin-bottom:65px}
.sub-title-Area > div{ padding-bottom:30px}
.sub-title-Area .sec-tit{ font-size:32px; color:#222;}
.sub-title-Area .sec-tit.big-tit{ font-size:40px}
.sub-title-Area .sec-tit b{ font-weight:600;}
.sub-title-Area .cm-fr ul { padding-top: 20px;}
.sub-title-Area .cm-fr ul li{display: inline-block; position: relative; padding-right: 30px;font-size: 14px;color: #777;}
.sub-title-Area .cm-fr ul li:after{content:'/'; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: #e0e0e0;font-size: 11px;}
.sub-title-Area .cm-fr ul li:last-child:after{ display:none}
.sub-title-Area .cm-fr ul li.location2{ color: #444; padding-right: 7px;font-weight: 500;}
.sub-title-Area .cm-fr ul li img{ vertical-align:top}




/* ****************** MODAL LAYERPOPUP ********************** */
/* modal layer */
.modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:9999; background:#000; background:rgba(0,0,0,0.8);}
.modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.modal-inner-content{text-align:left;}
.loading {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 8px solid rgba(255,255,255,.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}
@keyframes spin {
  to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); transform: rotate(360deg);  }
}
/* modal layer content */
.footer-modal-content{position:relative; width:96%; max-width:1000px; margin:20px auto; }
.footer-modal-content h1{font-size:24px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0 50px 20px; color:#fff;}
.modal-close-btn{position:absolute; top:-6px; right:-6px; color:#fff; }
.modal-close-btn i{font-size:38px;}
.modal-close-btn i:hover {color:#fff}
.footer-inner-box{padding:30px; background-color:#fff; }
.footer-inner{padding:20px; height:400px; overflow-y:auto; overflow-x:hidden; border:1px solid #ddd; }


.foot-privacy-btn{text-align:right;}
.foot-privacy-btn a{overflow:hidden; position:relative; display:inline-block; width:133px; height:40px; line-height:40px; border:2px solid #b9b9b9; text-align:center; transition: all 0.5s ease-in-out}
.foot-privacy-btn a em{position:relative; color:#313131; font-size:14px; letter-spacing:-0.5px;opacity:0.5;filter:Alpha(opacity=50); z-index:1;  transition: all 0.5s ease-in-out}
.foot-privacy-btn span{
	position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-radius: 50%;
    background-color: #b9b9b9;
    transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
    transform: translate(-50%, -50%);
}
.foot-privacy-btn a:hover{background-color:#b9b9b9}
.foot-privacy-btn a:hover em{color:#fff;}


/*애니메이션 */
/* card */
/*
.up_motion > * {-webkit-transform: translate3d(0, 50px, 0);transform: translate3d(0, 50px, 0);opacity: 0;-webkit-transition: opacity 800ms, -webkit-transform 1s ease-out;transition: opacity 800ms, -webkit-transform 1s ease-out;transition: transform 1s ease-out, opacity 800ms;transition: transform 1s ease-out, opacity 800ms, -webkit-transform 1s ease-out;}
.up_motion > *:nth-child(1) {-webkit-transition-delay: 300ms;transition-delay: 300ms;}
.up_motion > *:nth-child(2) {-webkit-transition-delay: 450ms;transition-delay: 450ms;}
.up_motion > *:nth-child(3) {-webkit-transition-delay: 600ms;transition-delay: 600ms;}
.up_motion > *:nth-child(4) {-webkit-transition-delay: 750ms;transition-delay: 750ms;}
.up_motion > *:nth-child(5) {-webkit-transition-delay: 900ms;transition-delay: 900ms;}
.up_motion > *:nth-child(6) {-webkit-transition-delay: 1050ms;transition-delay: 1050ms;}
.up_motion > *:nth-child(7) {-webkit-transition-delay: 1200ms;transition-delay: 1200ms;}
.up_motion > *:nth-child(8) {-webkit-transition-delay: 1350ms;transition-delay: 1350ms;}
.up_motion > *:nth-child(9) {-webkit-transition-delay: 1500ms;transition-delay: 1500ms;}
.up_motion > *:nth-child(10) {-webkit-transition-delay: 1650ms;transition-delay: 1650ms;}
.up_motion > *:nth-child(11) {-webkit-transition-delay: 1850ms;transition-delay: 1850ms;}
.up_motion > *:nth-child(12) {-webkit-transition-delay: 2000ms;transition-delay: 2000ms;}
.up_motion > *:nth-child(13) {-webkit-transition-delay: 2150ms;transition-delay: 2150ms;}
.up_motion > *:nth-child(14) {-webkit-transition-delay: 2300ms;transition-delay: 2300ms;}
.up_motion > *:nth-child(15) {-webkit-transition-delay: 2450ms;transition-delay: 2450ms;}
.up_motion > *:nth-child(16) {-webkit-transition-delay: 2600ms;transition-delay: 2600ms;}
.up_motion > *:nth-child(17) {-webkit-transition-delay: 2750ms;transition-delay: 2750ms;}
.up_motion > *:nth-child(18) {-webkit-transition-delay: 2900ms;transition-delay: 2900ms;}
.up_motion > *:nth-child(19) {-webkit-transition-delay: 3050ms;transition-delay: 3050ms;}
.up_motion > *:nth-child(20) {-webkit-transition-delay: 3200ms;transition-delay: 3200ms;}
.up_motion > *:nth-child(21) {-webkit-transition-delay: 2350ms;transition-delay: 2350ms;}
.up_motion > *:nth-child(22) {-webkit-transition-delay: 2500ms;transition-delay: 2500ms;}
.up_motion > *:nth-child(23) {-webkit-transition-delay: 3650ms;transition-delay: 3650ms;}
.up_motion > *:nth-child(24) {-webkit-transition-delay: 3850ms;transition-delay: 3800ms;}
*/





/* *******************************************************
 * 미디어쿼리 시작
******************************************************** */
/* ****************** 공통레이아웃 ********************** */
@media all and (max-width: 1400px){
	.area1400, .area, .area-box  {padding:0 30px}
    #header .logo {padding-left: 30px;}
}
@media all and (max-width:786px){
    .sub-title-Area .cm-fr .location {display: none;}
	.area1400, .area, .area-box {padding:0 15px}
}


/* ****************** HEADER ********************** */
@media all and (max-width:1750px){
    #header .header-util-box {right:30px;}	
    #gnb{ right:0px}
}
@media all and (max-width: 1400px ){
    /* -------- Header :: Layout -------- */
    .main-wrapper #header {width:calc(100% - 200px); }
    /* -------- Header :: GNB(PC) -------- */
    #gnb {right: 32px;}
    #gnb > ul {padding:0;}
    #gnb > ul > li > a{padding:0 40px; font-size:16px}
    #gnb > ul > li .gnb-2dep ul li a{font-size:14px; }
}
@media all and (max-width: 1200px ){
}
@media all and (max-width: 1024px ){	/* 1024까지 레이아웃유지가 안될시 max-width: 컨텐츠너비+20px */
    #header,  #headerInnerWrap {height:80px; border-bottom: 1px solid #eee;}
    #header.fixed, #header.fixed #headerInnerWrap {background-color: #fff;}
    #header {width:100% !important; position: fixed; }
    #headerInnerWrap{/* position:fixed; */ z-index:99;}
    #header .logo{padding: 19px 15px;}	/* padding값 적절히 바꿔주세요 */
    #header .logo img{height: 41px;}
    #header.fixed #headerInnerWrap{background-color:#fff;}

    /* -------- Header :: UTIL BOX -------- */
    .header-util-box{display:none;}
    /* 언어선택 */
    .header-util-menu-box .lang-select{padding:19px 15px; }
    .header-util-menu-box .lang-select li{float:left; border:1px solid #e5e5e5; margin-left:-1px}
    .header-util-menu-box .lang-select li:first-child{margin-left:0;}
    .header-util-menu-box .lang-select li > a{position:relative; display:block; min-width:18px; text-align:center ; height:40px; line-height:40px; padding:0 10px; color:#fff; font-size:12px; font-weight:500;}	
    .header-util-menu-box .lang-select li.cur{border-color:#fff; background-color:#fff; position:relative; z-index:1;}
    .header-util-menu-box .lang-select li.cur a{color:#1e7023 ; z-index:1;}

    /* -------- Header :: GNB(Pc) -------- */
    #gnb{display:none;}
    .gnb-overlay-bg{display:none}

    /* -------- Header :: GNB(Mobile/기본스타일) -------- */
    .gnb-overlay-bg-m{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:9998;}	
    #gnbM {display:block; position:fixed; top:0px; right:-82%; width:70%; height:100%; background-color: #1e7023 ; z-index:9999; transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  -webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);   visibility:hidden;}
    #gnbM.open{right:0px; visibility:visible;}
    /* GNB Mobile :: 레이아웃 */
    .gnb-navigation-wrapper{position:relative; height:100%; box-sizing:border-box; padding-top:80px; overflow-y:auto;}	/* padding-top : Header 높이값 */
    .header-util-menu-box + .gnb-navigation-wrapper{padding-top:0}

    /* GNB Mobile :: 메뉴영역 :: 1차 */
    #navigation > li{border-bottom:1px solid rgba(255,255,255,0.3)}
    #navigation > li:first-child{border-top:1px solid rgba(255,255,255,0.3)}
    #navigation > li > a {position:relative; display:block; padding:15px; color:#fff; font-size:17px; font-weight:500; cursor:pointer}
    #navigation > li.active > a{color:#fff;}
    #navigation > li.has-2dep > a:before{font-family:xeicon; content: "\e914"; position:absolute; top:50%; right:15px; font-size:1.3em; transform:translateY(-50%);}
    #navigation > li.has-2dep.active > a:before{content: "\e91b";}
    /* GNB Mobile ::  메뉴영역 :: 2차 */
    #navigation > li .gnb-2dep{display:none; padding:15px 21px; background-color:#fff; }
    #navigation > li .gnb-2dep > ul > li {line-height: 1.5; height:auto !important;}
    #navigation > li .gnb-2dep > ul > li > a{display:block;  font-size:14px; padding:5px; color:#444;}
    #navigation > li .gnb-2dep > ul > li.on > a{color:#1e7023 ; font-weight:500;}
    /* GNB Mobile :: 메뉴영역 ::  3차 */
    #navigation > li .gnb-2dep > li > .gnb-3dep{display:none; padding:10px; background-color:#aaa; margin:0 10px}
    #navigation > li .gnb-2dep > li > .gnb-3dep > li > a{display:block; padding:8px 0; font-size:13px; color:#fff;}
    #navigation > li .gnb-2dep > li > .gnb-3dep > li > a:before{display:inline-block; content:"-"; margin-right:5px;}


    /* -------- GNB Mobile :: 언어선택 -------- */
    .header-util-menu-box{height:80px;}

    /* -------- Header :: 네비게이션 오픈 버튼 -------- */
    .nav-open-btn{display:block; position:fixed; top:24px;  right:15px; z-index:10000; height:30px;-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); }
    .nav-open-btn .line{display:block; width:28px; height:3px; background-color:#111; border-radius:5px; margin: 4px auto;-webkit-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
    #header.blue .nav-open-btn .line {background-color: #000;}
    .nav-open-btn.active .line{background-color:#fff;}
    #header.blue .nav-open-btn.active .line {background-color: #fff;}
    .nav-open-btn.active .line:nth-child(2), .nav-open-btn.active .line:nth-child(4){opacity: 0;}
    .nav-open-btn.active .line:nth-child(1){
       -webkit-transform: translateY(7px) rotate(45deg);
        transform: translateY(7px) rotate(45deg);
    }
    .nav-open-btn.active .line:nth-child(3){
       -webkit-transform: translateY(-7px) rotate(-45deg);
        transform: translateY(-7px) rotate(-45deg);
    }

    #header.top-fixed .nav-open-btn .line{background-color:#333}
    #header.sub-hidden.up .nav-open-btn {display:block;} 

    /* -------- Header :: 모바일 메뉴-------- */
    #headerMenuM {display:block; position:absolute; top: 80px; left:0; width:100%; height: 40px; border-top: 1px solid rgba(255,255,255,0.15); border-bottom: 1px solid rgba(255,255,255,0.15);  text-align: center; transition: background-color 0.4s;}
    #headerMenuM ul li {float:left; width:25%; }
    #headerMenuM ul li a {line-height:1.4; font-size:12px; color: #fff; display:table; width:100%; height:40px;}
    #headerMenuM ul li a span {display:table-cell; vertical-align:middle;}
    .sub-wrapper #header.blue #headerMenuM {background-color: #0090d3; }
    .main-wrapper #header.fixed #headerMenuM {background-color: #0090d3;}
    .main-wrapper #header.fixed #headerMenuM {position:fixed;  }
    .main-wrapper #header.fixed #headerInnerWrap {position:fixed; }
}

@media all and (max-width: 480px ){
    #header,#headerInnerWrap{height:60px;}
    #header .logo{padding:15px 15px;}	/* padding값 적절히 바꿔주세요 */
    #header .logo img{height:30px;}

    /* -------- Header :: UTIL BOX -------- */
    .header-util-box{padding-right:20px;}
    /* Header :: 언어선택 */
    .header-lang{width:60px; margin-left:5px}
    .header-lang strong{display:none;}
    .header-lang > ul{border-color:#ccc;}
    .header-lang > ul > li > a{padding:0; text-align:center;}


    /* Header :: 사이트맵, 네비게이션 버튼 */
    .nav-open-btn{top:15px; right:15px; margin-top:0;}
    .nav-open-btn img {height: 14px;}
    .nav-open-btn .line{width:20px; height:2px;}
    .nav-open-btn.active .line:nth-child(1){-webkit-transform: translateY(6px) rotate(45deg);-ms-transform: translateY(6px) rotate(45deg); -o-transform: translateY(6px) rotate(45deg);transform: translateY(6px) rotate(45deg);}
    .nav-open-btn.active .line:nth-child(3){-webkit-transform: translateY(-6px) rotate(-45deg);-ms-transform: translateY(-6px) rotate(-45deg);-o-transform: translateY(-6px) rotate(-45deg);transform: translateY(-6px) rotate(-45deg);}
    /* Header :: GNB(Mobile) */
    .gnb-navigation-wrapper{padding-top:60px} /* padding-top : Header 높이값 */
    .gnb-style-full .header-util-menu-box + .gnb-navigation-wrapper{top:60px; }
    .gnb-style-full-member .gnb-navigation-wrapper{bottom:60px;}
    #navigation > li > a{font-size:15px;}
    #navigation > li .gnb-2dep > li > a{font-size:13px;}

    /* Header :: 언어선택  */
    .header-util-menu-box{height:60px;}	
    /* 언어선택 */
    .header-util-menu-box .lang-select{padding:10px; }
    .header-util-menu-box .lang-select li > a{height:38px; line-height:38px}	
    /* -------- Header :: 모바일 메뉴-------- */
    #headerMenuM {top:60px;}
}






/* ****************** SUB LAYOUT ********************** */
@media all and (max-width:1400px){	
    /*  SUB LAYOUT :: 비주얼 */
    #visual .visual-txt-container:after{left:10px}
    #visual .visual-txt-container .visual-txt-inner{width:100%; padding:0 30px; box-sizing:border-box}
    #visual .visual-img-con{top:120px; left:0px; height:317px;}
    #visual .visual-txt-con{padding-top:120px !important; height: 437px;}
    #middleArea {margin-top: 33%}
}
@media all and (max-width:1280px){
    /*  SUB LAYOUT :: 비주얼 */	
    #visual .visual-tit strong{ font-size:42px}
}
@media all and (max-width:1220px){
    /*  SUB LAYOUT :: 컨텐츠 레이아웃 */
    #topMenu01 .sub-menu-tit {display:none; }
    #topMenu01 .side-menu-inner {padding:0  0 0 100px;}

    /*  SUB LAYOUT :: 비주얼 */
    #visual .visual-tit{display:block}
    #visual .visual-sub-txt{display:block; margin-top:15px}
}
@media all and (max-width:1024px){
    #visual .visual-img-con{top:80px; left:0px; height:232px;}
    #visual .visual-txt-con{padding-top:80px !important; height: 312px;}
    #topMenu01 {top:80px;}
    /* -------- Header :: Sub 헤더  숨기기  -------- */
    #header.sub-hidden{-ms-transform: translateY(-81px); -o-transform: translateY(-81px); -moz-transform: translateY(-81px);-webkit-transform: translateY(-81px);  transform: translateY(-81px);}
    /*  SUB LAYOUT :: 비주얼 */
    #visual > div{padding:0}
    #visual .visual-tit span{ font-size:17px}
    #visual .visual-tit strong{ font-size:35px}
    #visual .visual-sub-txt{ font-size:16px}
    /*  SUB LAYOUT :: 비주얼 중단 카테고리 */
    #bo_cate { margin-bottom:50px}	
    #bo_cate a span{padding: 0 42px;}
    #topMenu02 .side-menu-inner ul li > a{font-size:15px;}
}
@media all and (max-width:800px){
    #visual .visual-img-con{top:80px; left:0px; height:175px;}
    #visual .visual-txt-con{padding-top:80px !important; height: 255px;}
    #middleArea {margin-top: 36%}
    /*  SUB LAYOUT ::  서브메뉴(스타일1,2,3) */
    #topMenu01{display:none}
    #topMenu02{display:none}
    /*  SUB LAYOUT :: 서브메뉴 모바일 (스타일2) */
    #topMenuM02{display:block; position:relative; height:45px; top:40px; background-color: #fff; border-top: 1px solid #ddd; margin-bottom: 5%;}
    #topMenuM02 .side-menu-inner{height:44px; border-bottom:1px solid #ddd; }
    #topMenuM02 .location-to-home-btn{position:absolute; width:40px; height:40px; left:0px; top:0px; text-align:center; }
    #topMenuM02 .location-to-home-btn i{color:#000; font-size:20px; line-height:40px;}
    #topMenuM02 .menu-location{position:relative;}
    #topMenuM02 .location-to-home-btn + .menu-location{margin-left:40px}
    #topMenuM02 .menu-location > .cur-location{position:relative; display:block; height:44px; padding:0 30px 0 15px; border-left:1px solid #ddd;}
    #topMenuM02 .menu-location > .cur-location span{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:44px; font-weight:600; font-size:15px; color: #000;}
    #topMenuM02 .menu-location > .cur-location .arrow{position:absolute; top:50%; right:0; width:20px; height:20px;margin-top:-8px; font-size:20px;color:#000; }
    #topMenuM02 .menu-location.open > .cur-location .arrow{transform:rotate(-180deg); margin-top:-10px;}
    #topMenuM02 .menu-location .location-menu-con{display:none; position:absolute; top:44px; left:0px; width:calc(100% - 2px); border:1px solid #ddd; border-top:0; background-color:#fff; z-index:11; }
    #topMenuM02 .menu-location.location1 .location-menu-con{width:calc(100% - 1px)}
    #topMenuM02 .menu-location .location-menu-con li a{display:block; padding:7px 15px; font-size:14px; line-height:1.5;}
    #topMenuM02 .menu-location .location-menu-con li.on{position:relative;}
    #topMenuM02 .menu-location .location-menu-con li.on a, #topMenuM02 .menu-location .location-menu-con li.active a{color:#0090d3;}
    #topMenuM02 .menu-location .location-menu-con li.on a em{ font-weight:500}
    
    .sub-title-Area{margin-bottom: 20px;}
    .sub-title-Area .cm-fr ul {padding-top: 0;}
    .location {display: none;}
    
    /*  SUB LAYOUT :: 컨텐츠 레이아웃 */
    #content {padding:20px 15px}
    #content:before {height: 135px;}
    #content.wide{ padding-bottom: 0}

    /*  SUB LAYOUT :: 비주얼 */
    #visual .visual-img-con {background-size: 110%!important;}
    #visual .visual-area{height:200px}
    #visual .visual-txt-container:after{width: 55%;height: 82px;}
    #visual .visual-txt-container .visual-txt-inner{padding:0 15px}
    #visual .visual-tit span {font-size: 14px;}
    #visual .visual-tit strong {font-size: 25px;}
    #visual .visual-sub-txt { font-size:13px; margin-top:10px}
    #visual .visual-sub-txt span {margin: 7px 0; line-height: 1.45;}

    /*  SUB LAYOUT :: 비주얼 중단 카테고리 */
    #bo_cate {height: 50px;}
    #bo_cate a {font-size: 15px;height: 50px;}
    #bo_cate a span{padding: 0 20px;}
    #bo_cate #bo_cate_on, #bo_cate a:hover { color: #010101;}
    #bo_cate #bo_cate_on:before, #bo_cate a:hover:before{width: 55px; }

}
@media all and (max-width:650px){
    /*  SUB LAYOUT :: 비주얼 */	
    #visual .visual-img-con {background-size: 150%!important; background-position: right 30% center!important}
    #visual .visual-area{ display:block; height:auto}
    #visual .visual-area > div{ display:block; width:100%; height: 170px;}
    
    #middleArea {margin-top: 45%;}
    
    /*  SUB LAYOUT :: 비주얼 중단 카테고리 */
    #bo_cate a{ font-size: 12px;}
    #bo_cate a span { padding: 0 15px;}
}
@media all and (max-width: 480px ){	
    #visual .visual-img-con {background-size: 185%!important; background-position: right 30% center!important}
    /*  SUB LAYOUT :: 서브메뉴 모바일 */
/*    #topMenuM02 {top:60px;}*/
    /* -------- Header :: Sub 헤더  숨기기  -------- */
    #header.sub-hidden{-ms-transform: translateY(-61px); -o-transform: translateY(-61px); -moz-transform: translateY(-61px);-webkit-transform: translateY(-61px); transform: translateY(-61px);}
    #visual .visual-img-con {}
    #visual .visual-txt-con {padding-top: 60px !important; height: 200px;}
    
    #middleArea {margin-top: 50%;}
}
@media all and (max-width: 420px ){	
    /*  SUB LAYOUT :: 비주얼 중단 카테고리 */
    #bo_cate a{ font-size: 11px;}
    #bo_cate a span { padding: 0 10px;}
}



/* ****************** FOOTER ********************** */
@media all and (max-width:680px){
    .footer-left-con,.footer-right-con {float:none; width:100%; text-align: center;}
    .foot-logo img {height:32px}
    #footerTop {padding-top: 20px;}
    .footer-right-con .foot-menu {margin-top: 20px;}
    #footer p {font-size: 13px;}
    .footer-copyright {font-size: 11px;}
}
@media all and (max-width:480px){
    .footer-right-con .foot-menu li {margin-left: 0;}
}