@charset "utf-8"; /* *******************************************************
 * filename : layout.css
 * description : 전체 레이아웃 CSS
 * date : 2021-08-05
******************************************************** */
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300; 400; 500; 700&display=swap'); /* Ubuntu */ 
@import url('https://fonts.googleapis.com/css2?family=Monda:wght@400; 700&display=swap'); /* Monda */
@import url('https://fonts.googleapis.com/css2?family=Play:wght@400; 700&display=swap'); /*Play*/

/* ****************** LAYOUT ********************** */
body, table, th, td, button, select, input, textarea { font-family:'Pretendard-Regular','Noto Sans KR', "나눔고딕", NanumGothic, "Nanum Gothic","돋움", 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:1400px; margin:0px auto; } /* width 홈페이지 컨텐츠 가로값에 맞게 변경 */
.area-box { max-width:1680px; margin:0px auto; } 
.wrap_narrow { max-width: 1200px; margin: 0 auto; } 
.font-monda { font-family: 'Monda', sans-serif; } 
.font-play { font-family: 'Play', sans-serif;; } 

/* -------- 공통 :: 버튼 -------- */
.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; display:block; border:2px 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:60px; color:#fff; 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); } 
.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 { color:#fff } 
/* 버튼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:100px; top:0; left:0; width:100%; z-index:9999; 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 } /* 배경위에 헤더가있으면 absolute변경 후 headerInnerWrap 배경삭제 */
.main-wrapper #header { width:calc(100% - 400px); } 
.fullpage-wrapper #header { position: fixed; } 
.sub-wrapper #headerInnerWrap { background-color:#222 } 
#headerInnerWrap { position:absolute; top:0px; left:0px; width:100%; height:100%; 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:29px 0 20px; } /* padding값 적절히 바꿔주세요 */
#header .logo a { display:block; position:relative; color:#fff; font-size: 32px; letter-spacing: 1px; } 
#header .logo img.blue { display: none; } 
#header.blue .logo a { color: #034ea1; } 
#header.blue .logo img { display: none; } 
#header.blue .logo img.blue { display: block; } 
/* -------- Header :: UTIL BOX -------- */
.header-util-box { position:absolute; top:50%; right:0; margin-top:-18px; z-index:100; } 
.linked-btn { float:left; font-size: 20px; color:#fff; line-height:40px; } 
/* Header :: 언어선택 */
.header-lang { position:relative; float:left; width:200px; height:100%; z-index:100; margin-left:35px; } 
.header-lang:before { content:""; width:24px; height:24px; position: absolute; left:-17px; top:6px; background: url(../img/lang_select_icon.png)no-repeat; display: block; background-size: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } 
.header-lang > ul > li { float:left; width:33.3%; } 
.header-lang > ul > li > a { position:relative; display:block; font-size:14px; line-height:40px; color:#999; text-align:center; -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:-6px; top:16px; background: url(../img/arrow_right.png)no-repeat; width: 16px; height: 8px; } 
.header-lang > ul > li:first-child > a:before { display: none; } 
.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; left:40%; 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 { font-family: 'Pretendard-SemiBold'; position:relative; z-index:100; display:table; height:100px; line-height:1.3; padding:0 60px; text-align:center; color:#fff; font-size:20px; letter-spacing:0.25px; 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:600; } 

/* 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:96px; left:50%; transform: translateX(-50%); z-index:99; width:180px; text-align:left; 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:#fff; border-radius: 7px; border: 1px solid #898989; -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 25px 0; } 
#gnb.each-menu > ul > li .gnb-2dep ul li { position:relative; padding:9px 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:#666; font-size:15px; font-weight:500; 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) } 
/* 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; border-bottom: 1px solid #ddd; } 
#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 { content:""; width:24px; height:24px; position: absolute; left:-17px; top:6px; background: url(../img/lang_select_icon_b.png)no-repeat; display: block; background-size: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } 
#header.blue .header-lang > ul > li > a { color:#999; } 
#header.blue .header-lang > ul > li > a:before { content:""; display:block; position:absolute; left:-6px; top:16px; background: url(../img/arrow_right_b.png)no-repeat; width: 16px; height: 8px; } 
#header.blue .header-lang > ul > li:first-child > a:before { display: none; } 
#header.blue .header-lang > ul > li.selected > a, #header.blue .header-lang > ul > li > a:hover { color:#111; } 
#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 { content:""; display:block; position:absolute; left:-6px; top:16px; background: url(../img/arrow_right_b.png)no-repeat; width: 16px; height: 8px; } 
#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 :: 레이아웃 -------- */
#footer { position:relative; background: #232323; text-align:center; z-index:100; } 
#footer .footer_top { padding: 42px 0 45px; border-bottom: 1px solid #444; background: #232323 } 
#footer .footer-left-con { float: left; } 
#footer .footer-right-con { float: right; } 
#footer .footer_top .footer-left-con li { float:left; padding-right: 42px; } 
#footer .footer_top .footer-left-con li a { font-size: 14px; font-family: 'Pretendard-SemiBold'; color: #aaa; } 
#footer .footer_top .footer-left-con li a.privacy { color: #eee; } 
#footer .footer_top .footer-right-con li { float: left; padding-left: 58px; font-size: 16px; color: #999; } 
#footer .footer_top .footer-right-con li strong { color: #eee; font-family: 'Pretendard-Regular'; display: inline-block; padding-right: 9px; } 
#footer .footer_btm { padding-top: 33px; } 
#footer .footer_btm .footer-address-list { text-align: left; margin-bottom: 17px; } 
#footer .footer_btm .footer-address-list p.item { font-family: 'Pretendard-Regular'; display: inline-block; font-size: 14px; color: #999; padding-right: 30px; } 
#footer .footer_btm .footer-address-list p.item .tit { display: inline-block; padding-right: 5px; } 
#footer .footer_btm .footer-address-list .footer-copyright.item { display: block; color: #999; padding: 28px 0 33px; } 
#footer .footer_btm .footer-address-list .footer-copyright span { color: #eee; } 
#footer .site_wrap { float: right; } 

/* -------- FOOTER :: site -------- */
.family-site-wrap { margin-left: 33px; } 
.family-site-box { /* position:absolute; top:20px; right:0; */ position:relative; width:160px; text-align:left; letter-spacing:-0.25px; /*float:left*/display:inline-block } 
.family-site-box .family-site-open-btn { display:block; width:100%; height:42px; line-height:30px; text-align:left; font-size:13px; border-bottom:1px solid rgba(255,255,255,0.19); color:#999; box-sizing:border-box; } 
.family-site-box .family-site-open-btn:after { position:absolute; right:10px; top:50%; transform:translateY(-50%); font-size:16px; font-family: 'xeicon'; content:"\e942"; } 
.family-site-box.open .family-site-open-btn:after { content:"\e945"; } 
.family-site-list { position:absolute; bottom:100%; left:0px; width:100%; padding:10px 0; background-color:#fff; border:1px solid #ddd; border-bottom:0; z-index:11; display:none; box-sizing:border-box; } 
.family-site-list a { display:block; padding:10px; color:#333; font-size:12px; } 
.family-site-list a:hover { color:#000; text-decoration:underline; } 


/* ****************** SUB LAYOUT ********************** */
/* SUB LAYOUT :: 서브메뉴(스타일1) */
#topMenu01 { position:relative; width:100%; padding:30px 0; top:100px; background-color: #fff; transition: padding 0.4s; } 
/* #topMenu01:before { content:""; width:100%; height: 270px; background-color: #fff; position:absolute; top:100%; left:0; } */
#topMenu01 .side-menu-inner { width:100%; position:relative; padding: 0 190px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } 
#topMenu01 .location-to-home-btn { position:absolute; left:0; top:50%; margin-top:-25px; width: 50px; height:50px; border: 1px solid #ddd; text-align:center; line-height: 48px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } 
#topMenu01 .location-to-home-btn i { color: #000; } 
#topMenu01 .sub-menu-tit { font-size: 25px; letter-spacing:20px; color: #000; text-transform: uppercase; position:absolute; right:0; top:50%; margin-top:-12.5px; } 
#topMenu01 .side-menu-inner ul { display:inline-block; *display:inline; *zoom:1; margin:0 -25px; } 
#topMenu01 .side-menu-inner ul li { float:left; max-width:330px; height: 70px; margin:0 25px; } /* max-width 자유롭게 수정 */
#topMenu01 .side-menu-inner ul li > a { display:block; display:table; position:relative; width:100%; height:100%; line-height:1.2; color:#000; font-size:18px; letter-spacing:-0.5px; word-break:keep-all; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; -o-transition:all 0.4s; -ms-transition:all 0.4s; transition:all 0.4s; } 
#topMenu01 .side-menu-inner ul li > a span { } 
#topMenu01 .side-menu-inner ul li > a span em { position:relative; font-weight:700; padding-bottom: 10px; } 
#topMenu01 .side-menu-inner ul li > a span em:before { position:absolute; bottom:-1px; left:50%; width:0; height:2px; background-color:#000; content:""; -webkit-transition:all 0.4s; -moz-transition:all 0.4s; -o-transition:all 0.4s; -ms-transition:all 0.4s; transition:all 0.4s; } 
#topMenu01 .side-menu-inner ul li > a > span { display:table-cell; vertical-align:middle; } 
#topMenu01 .side-menu-inner ul li > a:hover span em:before, 
#topMenu01 .side-menu-inner ul li.on > a span em:before { width:100%; margin-left:-50%; } 

/* SUB LAYOUT :: 서브메뉴 Fixed (공통) */
@media all and (min-width:1221px){
 .fixed-sub-menu.fixed .side-menu-inner { position:fixed; top:0px; left:0px; z-index:9999; } 
 }

/* SUB LAYOUT :: 모바일메뉴(공통) */
#topMenuM01,#topMenuM02 { display:none; } 

/* SUB LAYOUT :: 컨텐츠 레이아웃 */
#middleArea { } 
#middleArea.wide { padding-bottom: 0; } 


/* ****************** SUB LAYOUT ********************** */
/* SUB LAYOUT :: 공통 서브비주얼 */
#visual { position:relative; overflow:hidden; width:100%; height: 494px; } 
#visual .visual-img-con { position:absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover!important; overflow: hidden } 
#visual .visual-img-con p { position: absolute; top: 50%; transform: translateY(-50%); margin-top: 63px; color: #fff; font-size: 40px; font-family:'Pretendard-Bold'; line-height: 1.4; left: 17%; word-break: keep-all; } 
#visual .visual-img-con.sub_visual1 { background: url(../img/sub_visual1.jpg)no-repeat 50% 0; } 
#visual .visual-img-con.sub_visual2 { background: url(../img/sub_visual3.jpg)no-repeat 50% 0; } 
#visual .visual-img-con.sub_visual3 { background: url(../img/sub_visual2.jpg)no-repeat 50% 0; } 
#visual .visual-img-con.sub_visual4 { background: url(../img/sub_visual4.jpg)no-repeat 50% 0; } 
#visual .visual-img-con.sub_visual5 { background: url(../img/sub_visual5.jpg)no-repeat 50% 0; } 
#visual .visual-img-con.sub_visual6 { background: url(../img/sub_visual6.jpg)no-repeat 50% 0; } 
#visual .visual-img-con span { display:block; width:100%; height:100%; background-size:cover !important; -webkit-transform: scale(1.2,1.2); transform: scale(1.2,1.2); -webkit-transition:transform 5000ms ease-in-out; transition:transform 5000ms ease-in-out; } 
#visual .visual-txt-con { z-index:1; text-align:center; display:table; width:100%; height:100%; background-color:#0090d3 } 
#visual .visual-txt-container { position:relative; width:100%; height:100% } 
#visual .visual-txt-container:after { position:absolute; content:""; width:322px; height:145px; background:url("../../img/visual_logo.png") no-repeat; background-size:contain !important; bottom:-20px; left:5px; z-index:0 } 
#visual .visual-txt-container .visual-txt-inner { position:absolute; width:100%; right:0; top:50%; transform:translateY(-50%); text-align:left; box-sizing: border-box; padding-left:8%; } 
#visual .visual-tit,
#visual .visual-sub-txt,
#visual .location { opacity:0; filter:Alpha(opacity=0); -webkit-transform: translateY(30px); transform: translateY(30px); -webkit-transition:opacity 1.0s, transform 1.0s; transition:opacity 1.0s, transform 1.0s; } 
#visual .visual-tit { display:inline-block; vertical-align:bottom; font-weight:400; margin-right:20px; color:#fff; -webkit-transition-delay:0.2s; transition-delay:0.2s; } 
#visual .visual-tit span { font-size: 20px; font-weight: 600; opacity: 0.8; filter:Alpha(opacity=80); } 
#visual .visual-tit strong { display: block; font-weight: normal; text-transform: uppercase; margin-top:7px; font-size:55px; } 
#visual .visual-sub-txt { display:block; vertical-align:bottom; font-size:17px; font-weight:400; color:#fff; -webkit-transition-delay:0.2s; transition-delay:0.2s; margin-top:23px } 
#visual .visual-sub-txt span { display:block; margin:12px 0 } 
#visual .visual-sub-txt span:last-child { margin-bottom:0 } 
#visual .visual-sub-txt b { font-weight:600 } 
#visual .location { -webkit-transition-delay:0.6s; transition-delay:0.6s; } 

/* SUB LAYOUT :: 서브메뉴 */
#Sub_depth { position:relative; width:100%; height: 72px; z-index:12; } 
#Sub_depth .side-menu-inner { width:100%; height: 72px; background-color: #f5f5f5; border-bottom:1px solid #e5e5e5; z-index:11; } 
#Sub_depth .side-menu-inner > div { position:relative; height: 100%; } 
/*#Sub_depth .cm-top-menu { padding:0 40px; } */
#Sub_depth .location-to-home-btn { float:left; width:6%; text-align: center; height:100%; line-height: 72px } 
#Sub_depth .location-to-home-btn i { color:#222; font-size:18px; line-height:72px; } 
#Sub_depth .menu-location { position:relative; float:left; min-width:200px; } 
#Sub_depth .menu-location.location2 { min-width:240px; } 
#Sub_depth .menu-location:before { position:absolute; top: 50%; transform: translateY(-50%); height: 23px; left:0; width:1px; background-color:#e5e5e5; content:""; } 
#Sub_depth .menu-location.location1:before { display: none; } 
#Sub_depth .menu-location > .cur-location { position:relative; display:block; height: 72px; padding:0 26px 0 21px; text-align:left } 
#Sub_depth .menu-location > .cur-location span { display:block; width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:72px; color:#646464; font-size:16px; font-family: 'Pretendard-SemiBold' } 
#Sub_depth .menu-location.location2 > .cur-location span { color: #444; } 
#Sub_depth .menu-location > .cur-location .arrow { position:absolute; top:50%; transform: translateY(-50%); right:25px; } 
#Sub_depth .menu-location > .cur-location .arrow i { font-size:16px; color:#000; font-weight: 700; } 
#Sub_depth .menu-location > .cur-location.open .arrow { transform:rotate(-180deg); margin-top:-10px; } 
#Sub_depth .menu-location .location-menu-con { display:none; position:absolute; top:72px; left:-1px; width:calc(100% - 1px); border:1px solid #e5e5e5; border-top:0; background-color:#f5f5f5; z-index:11; } 
#Sub_depth .menu-location .location-menu-con li a { position:relative; display:block; padding:10px 23px; font-size:15px; line-height:1.5; font-weight:400; color:#222; } 
#Sub_depth .menu-location .location-menu-con li a .gnb-icon { position:absolute; top:10px; right:15px; } 
#Sub_depth .menu-location .location-menu-con li.on { position:relative; } 
#Sub_depth .menu-location .location-menu-con li.on a { color:#04367b; } 

/* SUB LAYOUT :: 서브메뉴 Fixed (공통) */
.fixed-sub-menu.top-fixed .side-menu-inner { position:fixed; top:0px; left:0px; z-index:9999; } 


@media all and (max-width:1024px){
 .fixed-sub-menu.top-fixed .side-menu-inner { top:80px; } 
 }
@media all and (max-width:480px){
 .fixed-sub-menu.top-fixed .side-menu-inner { top:60px; } 
 }

/* SUB LAYOUT :: 상단효과 active */
#visual.active .visual-img-con span { -webkit-transform: scale(1.0,1.0) rotate(0.002deg); transform: scale(1.0,1.0) rotate(0.002deg); } 
#visual.active .visual-tit,
#visual.active .visual-sub-txt,
#visual.active .location { opacity:1.0; filter:Alpha(opacity=100); -webkit-transform: translateY(0px); transform: translateY(0px); } 

/* SUB LAYOUT :: 비주얼 중단 카테고리 */
#bo_cate { height: 50px; box-sizing: border-box; text-align:center; } 
#bo_cate h2 { position:absolute; font-size:0; line-height:0; overflow:hidden } 
#bo_cate ul { display: inline-block; *display: inline; *zoom: 1; } 
#bo_cate li { float: left; } 
#bo_cate a { display: block; display: table; margin:0 5px; position: relative; height: 100%; line-height: 50px; color: #04367b; border:1px solid #04367b; font-size:18px; letter-spacing: -0.5px; -webkit-transition: color 0.4s; transition: color 0.4s; } 
#bo_cate a:hover { background-color:#04367b; color:#fff; } 
#bo_cate a span { display: table-cell; vertical-align: middle; padding: 0 50px; } 
#bo_cate #bo_cate_on, #bo_cate a:hover { background-color:#04367b; color:#fff; } 
#bo_cate #bo_cate_on:before, #bo_cate a:hover:before { width:90px; } 

/* ****************** BOARD ********************** */
/* BOARD :: 게시판 공통(total,search,admin_btn) */
/*
.bo_top_area .cm-fr { width:27%; min-width:450px } 
#bo_list_total { font-size:15px; color: #222; font-weight: 600; line-height: 62px } 
#bo_list_total span { display:inline-block; color: #04367b; margin-left: 5px } 
.bo_sch_wrap { width: 100%; background-color: #f3f3f3; border-radius: 50px; position: relative; } 
.bo_sch { display:block; position:relative } 
.bo_sch:before { position: absolute; content: ""; width: 1px; height: 11px; background-color: #cecece; left:170px; top: 50%; transform: translateY(-50%); } 
.bo_sch:after { display:block; visibility:hidden; clear:both; content:"" } 
.bo_sch form { display:block; position:relative } 
.bo_sch select { border: 0; background-color: transparent; height: 62px; float: left; font-weight: 400; font-size: 1.125em; color: #848484; letter-spacing: -0.5px; width: 170px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(../img/select_arrow.png) no-repeat 82% 50%; padding-left: 40px; position: relative; } 
.bo_sch .sch_bar { border: 0; height: 62px; float: left; font-weight: 400; font-size: 1.125em; color: #848484; letter-spacing: -0.5px; width: calc(100% - 242px); } 
.bo_sch .sch_input { display:block; width:100%; height: 100%; border: 0; background-color: transparent; text-indent: 25px; } 
.bo_sch .sch_btn { position: absolute; top: 0; right: 30px; font-size: 28px; color: #000; width: 35px; height: 62px; text-align: center; } 
#bo_btn_top { margin:10px 0; background: #f5f5f5; border-top:1px solid #ddd; border-bottom:1px solid #ddd } 
#bo_btn_top:after { display:block; visibility:hidden; clear:both; content:"" } 
.bo_fx { margin-bottom:5px; float:right; zoom:1 } 
.bo_fx:after { display:block; visibility:hidden; clear:both; content:"" } 
.bo_fx ul { margin:0; padding:0; list-style:none } 
#bo_btn_top .cm-fl { line-height:35px } 
*/


/* ****************** 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; } 



/*애니메이션 */
/* 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; } 


/* 이메일무단수집거부 */
#mail_pop { position:fixed; width:100%; height:100%; top:0; left:0; display:none; z-index:9999; background: rgba(0,0,0,0.5); } 
#mail_pop .no_mail { width:900px; height:495px; position:absolute; top:50%; left:50%; border:2px solid #1a70ce; margin-left: -450px; margin-top: -275.5px; } 
.pop_content { background-color: #f6f6f6; text-align: center; font-size: 16px; line-height: 26px; height: 100%; box-sizing: border-box; padding: 85px 30px; } 
.pop_content strong { display: block; font-size: 20px; line-height: 1; margin-bottom: 18px; padding-top: 180px; background:url(/img/ico_mail.png) no-repeat 50% 0; line-height:1.4 } 
.pop_content .small_txt { display: block; padding-top: 12px; font-size: 14px; color: #6a85d2; } 
.close_btn { position: absolute; right: 0; top: 0; width: 60px; height: 60px; background:url(/img/close_btn.png) no-repeat center; font-size: 0; text-indent: -9999%; display:block; } 


/* *******************************************************
 * 미디어쿼리 시작
******************************************************** */

/* ****************** 공통레이아웃 ********************** */
@media all and (max-width:1700px) { /* max-width : (area-box width) + 20px */
.area-box { padding:0 30px; } 
 }
@media all and (max-width: 1348px){
 .area1328 { padding:0 30px } 
 }
@media all and (max-width:1420px){
 .area { padding:0 10px; } 
 }
@media all and (max-width:1024px){
 .area-box, .area1328,
.area { padding:0 15px } 
 }

/* ****************** HEADER ********************** */
@media all and (max-width:1750px){
 #header .header-util-box { right:30px; } 
 }
@media all and (max-width:1650px){
 #gnb { left: 35%; } 
 }
@media all and (max-width:1470px) { /*#gnb { right:0; left: 200px; } */
 #gnb > ul > li > a { font-size: 18px; padding: 0 48.5px; } 
 }
@media all and (max-width: 1366px) { /* -------- Header :: Layout -------- */
 .main-wrapper #header { width:calc(100% - 200px); } 
 .header-lang { margin-left:20px; } 
 .header-lang > ul > li > a { line-height:40px; } 
 /* -------- Header :: GNB(PC) -------- */
 #gnb { left: 30%; } 
 #gnb > ul { padding:0; } 
 #gnb > ul > li > a { padding:0 48px; font-size:16px } 
 #gnb > ul > li .gnb-2dep ul li a { font-size:14px; } 
 }
@media all and (max-width: 1200px){
 #header .header-util-box { right: 0; } 
 #gnb { left: 28%; } 
 #gnb > ul > li > a { padding: 0 38px; } 
 }
@media all and (max-width: 1024px) { /* 1024까지 레이아웃유지가 안될시 max-width: 컨텐츠너비+20px */
 #header, #headerInnerWrap { height:80px; } 
 #header.fixed, #header.fixed #headerInnerWrap { background-color: #04367b; } 
 #header { width:100% !important; } 
 #headerInnerWrap { /* position:fixed; */ z-index:99; } 
 #header .logo { padding: 17px 0; } /* padding값 적절히 바꿔주세요 */
 #header .logo img { height: 37px; } 
 #header.fixed #headerInnerWrap { background-color:#04367b; } 

 /* -------- 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; margin-left:-1px; padding: 0 10px;} 
 .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; color: rgba(255,255,255,0.35); font-size: 14px; font-weight:500; } 

 .header-util-menu-box .lang-select li.cur { position:relative; float:left; width:70px; height:100%; z-index:100; margin-left:30px; padding:0;} 
 .header-util-menu-box .lang-select li.cur a { color: #fff; } 
 .header-util-menu-box .lang-select li.cur:before { content:""; width:22px; height:22px; position: absolute; left:-25px; top:8px; background: url(../img/lang_select_icon.png)no-repeat; display: block; background-size: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } 
 /*.header-util-menu-box .lang-select li.cur a { color:#04367b; 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:80%; height:100%; max-width:280px; background-color:#04367b; 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 0; background-color:#fff; } 
 #navigation > li .gnb-2dep > li { height:auto !important; } 
 #navigation > li .gnb-2dep > li > a { display:block; font-size:14px; padding:12px 15px; color:#444; } 
 #navigation > li .gnb-2dep > li.on > a { color:#04367b; 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:#fff; 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 .nav-open-btn { display:none; } 
 #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; background: #fff } 
 #header .logo { padding:12px 0; } /* padding값 적절히 바꿔주세요 */
 #header .logo img { height:32px; } 
 #header .logo img.blue { opacity: 1; } 

 /* -------- 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:20px; margin-top:0; } 
 .nav-open-btn img { height: 14px; } 
 .nav-open-btn .line { width:20px; height:2px; background: #444; } 
 .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; } 
 }

/* ****************** FOOTER ********************** */
@media all and (max-width:1200px){
 #footer .footer_top .footer-right-con li { font-size: 15px; padding-left: 38px; } 
 }
@media all and (max-width:1056px){
 #footer .footer_top { border-bottom: none; padding: 42px 0 33px; } 
 #footer .footer_top .footer-right-con li { padding-left: 0; padding-right: 38px; } 
 #footer .footer_btm { padding-top: 0; } 
 .footer-left-con,.footer-right-con { float:none; width:100%; } 
 .footer-right-con { margin-top: 20px; padding-top:20px; padding-right:0; border-top:1px solid rgba(255,255,255,0.2); border-left:0; padding-left:0; } 
 #footer .site_wrap { float: none; width: 100%; } 
 #footer .site_wrap .footer-right-con { float: left; width: 50%; margin-top: 0; padding: 10px 0; } 
 .family-site-box .family-site-open-btn { border-bottom: none; } 
 .ft-Logo-con { top:50%; transform:translateY(-50%) } 
 .ft-Logo-con span img { height:32px } 
 /* Footer :: 정보 style02 */
 .footer-address-list dl { font-size:12px; padding-left:125px; } 
 .footer-right-con dl:nth-of-type(1) dd:nth-of-type(1) span { margin-left:0 } 
 }
@media all and (max-width:680px){
 .footer-left-con { padding-left:0 } 
 .ft-Logo-con { display:none } 
 }
@media all and (max-width:540px){
 #footer { height: 360px; } 
 .family-site-wrap { margin-left: 0; } 
 }
@media all and (max-width:480px){
 #footer .footer_top { border-bottom: none; padding: 20px 0 20px; } 
 #footer .footer_top .footer-left-con li { padding-right: 26px; } 
 #footer .footer_top .footer-left-con li { padding-right: 15px; } 
 #footer .footer_top .footer-left-con li a { font-size: 12px; } 
 #footer .footer_top .footer-right-con li { line-height: 1.4; font-size: 14px; } 
 #footer .footer_btm .footer-address-list p.item { padding-right: 15px; line-height: 1.4; font-size: 13px; } 
 #footer .footer_btm .footer-address-list { margin-bottom: 7px; } 
 #footer .footer_btm .footer-address-list .footer-copyright.item { padding: 15px 0; } 
 }
@media all and (max-width: 375px){
 #footer { height: 350px; } 
 }
 
/* ****************** SUB LAYOUT ********************** */
@media all and (max-width:1400px) { /* SUB LAYOUT :: 공통서브비주얼 */
 #visual .visual-img-con p { font-size: 36px; } 
 }
@media all and (max-width:1220px) { /* SUB LAYOUT :: 컨텐츠 레이아웃 */
 #topMenu01 .sub-menu-tit { display:none; } 
 #topMenu01 .side-menu-inner { padding:0 0 0 100px; } 
 }
@media all and (max-width:1024px){
 #topMenu01 { top: 80px; } 
 #middleArea { margin-top:0 } 
 /* -------- 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 :: 비주얼 중단 카테고리 */
 #bo_cate { margin-bottom:50px } 
 #bo_cate a span { padding: 0 42px; } 
 
 /* SUB LAYOUT :: 공통 서브 비주얼 */
 #visual { height: 300px; } 
 #visual > div { padding:0 } 
 #visual .visual-img-con p { font-size: 28px; margin-top: 27px; } 
 }

@media all and (max-width:800px) { /* SUB LAYOUT :: 서브메뉴(스타일1,2,3) */
 #topMenu01 { display:none } 
 /* SUB LAYOUT :: 서브메뉴 모바일 (스타일2) */
 #topMenuM02 { display:block; position:relative; height:45px; top:80px; background-color: #fff; } 
 #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; background-color:#fff; 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:10px; 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 LAYOUT :: 컨텐츠 레이아웃 */
 #content { padding:20px 15px } 
 #content:before { height: 135px; } 
 #content.wide { padding-bottom: 0 } 

 /* SUB LAYOUT :: 비주얼 */
 #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; } 

 /* ****************** BOARD ********************** */
 /* BOARD :: 게시판 공통(total,search,admin_btn) */
 #bo_list_total { font-size:13px; line-height:45px } 
 .bo_top_area .cm-fr { width:60%; min-width:inherit } 
 .bo_sch:before { left: 120px; } 
 .bo_sch select { width: 120px; padding-left: 20px; background-size: 11px; } 
 .bo_sch select, .bo_sch .sch_bar { height: 45px; font-size:12px } 
 .bo_sch .sch_bar { width: calc(100% - 165px); } 
 .bo_sch .sch_input { text-indent:15px; font-size:12px } 
 .bo_sch .sch_btn { height: 45px; font-size:16px; width: 25px; right: 15px; } 
 }
@media all and (max-width: 768px){
 #visual .visual-img-con p { font-size: 24px; left: 10%; } 
 }
@media all and (max-width:650px) { /* SUB LAYOUT :: 비주얼 */
 #visual .visual-area { display:block; height:auto } 
 #visual .visual-area > div { display:block; width:100%; height: 170px; } 
 #visual .visual-img-con p { font-size: 21px; left: 7%; } 
 /* SUB LAYOUT :: 비주얼 중단 카테고리 */
 #bo_cate a { font-size: 12px; } 
 #bo_cate a span { padding: 0 15px; } 
 /* ****************** BOARD ********************** */
 /* BOARD :: 게시판 공통(total,search,admin_btn) */
 .bo_sch select,.bo_sch:before { display:none } 
 .bo_sch .sch_bar { width:100% } 
 }
@media all and (max-width: 600px) { /* SUB LAYOUT :: 공통서브비주얼 */
 #visual .visual-img-con p { padding-right: 15%; } 
 #visual .visual-img-con p br { display: none; } 


 /* SUB LAYOUT :: 서브메뉴 */
 #Sub_depth { height: 60px; } 
 #Sub_depth .wrap_narrow { margin: 0; } 
 #Sub_depth .side-menu-inner { height: 60px; } 
 #Sub_depth .location-to-home-btn { display: none; } 
 #Sub_depth .menu-location, #Sub_depth .menu-location.location2 { min-width: 50%; } 
 #Sub_depth .menu-location > .cur-location { height: 60px; } 
 #Sub_depth .menu-location > .cur-location span { line-height: 60px; } 
 #Sub_depth .menu-location .location-menu-con { top: 60px; } 
 }
@media all and (max-width: 540px ) { /* SUB LAYOUT :: 공통서브비주얼 */
 #visual .visual-img-con p { padding-right: 12%; } 
 }
@media all and (max-width: 480px ) { /* SUB LAYOUT :: 서브메뉴 */
 #Sub_depth .menu-location > .cur-location { padding: 0 0 0 12px; } 
 #Sub_depth .menu-location > .cur-location span { font-size: 14px; } 
 #Sub_depth .menu-location > .cur-location .arrow { right: 3px; } 
 #Sub_depth .menu-location { min-width: 40%; } 
 #Sub_depth .menu-location.location2 { min-width: 60%; } 
 #Sub_depth .menu-location .location-menu-con li a { padding: 5px 0 5px 12px; font-size: 14px; } 
 }
@media all and (max-width: 420px ) { /* 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); } 
 /* SUB LAYOUT :: 비주얼 */
 #visual .visual-img-con p { font-size: 18px; left: 5%; } 
 }
@media all and (max-width: 375px ){
 #visual .visual-img-con p { font-size: 16px; } 
 /* SUB LAYOUT :: 비주얼 중단 카테고리 */
 #bo_cate a { font-size: 11px; } 
 #bo_cate a span { padding: 0 10px; } 
 }

