/* 통합검색 */
.totalSearch { position:relative; width: 11rem; height: 2rem; border-radius: 0.5rem; overflow: hidden; background:#e6e6e6; }
.totalSearch input { padding: 0 2.25rem 0 0.5rem; width: 100%; height: 2rem; line-height: 2rem; font-size: 0.6rem; border: none; font-family: '돋움', Dotum; background:none;}
.totalSearch button { position: absolute; top:0; right:0; padding: 0; background:#0089f3; width: 2rem; height: 2rem; line-height:38px; color:#fff; border: none; font-size:1rem; border-radius: 0.5rem; /*0.9rem */ }
.totalSearch input::-webkit-input-placeholder { color: #555; }
.totalSearch input::placeholder { color: #555; }

/* header */
#header {height:4.35rem; box-shadow: 0 0.25rem 0.5rem -0.1rem rgba(0,0,0,0.1); border-bottom:1px solid #eee; margin-bottom:1px; margin-top:1.75rem; border-top:1px solid #ededed;}
#header:before {display:none;}
#header:after {content:''; position:absolute; top:-1.78rem; left:0; width:100%; height:1.75rem; background:#f9f9f9; z-index:-2;}
#header h1 {margin-left:-43rem;}
#header h1 em {font-size:0;}
#header h1 em.logo2 {display:none;}
#header h1 span {position:relative; display:inline-block; font-size:1.1rem; font-weight:600; color:#000; padding-left:1.25rem;}
#header h1 span:before {content:''; position:absolute; left:0.35rem; top:calc(50% - 0.15rem); width:0.3rem; height:0.3rem; border-radius:50%; background:#ccc;}

#header .topUtil {margin-right:-43rem; top:-1.7rem;}
#header .topUtil .go_pen {position:relative; font-size:0.65rem; color:#000; display:flex; align-items:center; padding:0 0.75rem; margin-right:0.25rem;}
#header .topUtil .go_pen:before {content:'|'; position:absolute; width:auto; height:auto; left:auto; background:none; right:-0; top:0.1rem; font-weight:300; font-size:0.65rem; color:#dbdbdb;}
#header .topUtil .go_pen i {display:inline-block; font-size:1.1rem; margin-left:0.2rem;}

/* header - 사이트맵 버튼 */
#header .h_btn { margin-right:-43rem; }
#mSearch .btnClose {right: 50%; margin-right:-39.9rem; top:-3.35rem;}

/* web navigation */
/* gnb common */
#gnb {background: #fff;} /* gnb 배경 */
#gnb .depth01 {height:4.25rem; max-width:60rem; padding-left:11rem;}
#gnb .depth01 > ul > li > a {color: #000; height:4.25rem;} /* 1차메뉴 텍스트 */
#gnb .depth01 > ul > li > a:before {background:#0088f3;} /* 1차메뉴 active */
#gnb .depth01 > ul > li > a span {position:relative; padding:0 0.25rem 0.15rem;}
#gnb .depth01 > ul > li > a span:before {content:''; position:absolute; left:0; bottom:0; width:0; height:0.65rem; background:#e0f3ed; z-index:-1; transition: 0.1s; -webkit-transition: 0.1s;}
/* gnb : active */
#gnb .depth01 > ul > li > a:hover,
#gnb .depth01 > ul > li > a:focus,
#gnb .depth01 > ul > li.on > a {font-weight:600;}
#gnb .depth01 > ul > li > a:hover span:before,
#gnb .depth01 > ul > li > a:focus span:before,
#gnb .depth01 > ul > li.on > a span:before{width:100%;}
/* gnb : oneDown */
#nav.oneDown .depth02 {top:4.25rem;}
/* gnb : fullDown */
#nav.fullDown #gnb:after {top: 4.25rem;}
#nav.fullDown .depth01 > ul > li:before {top: 4.25rem;}
#nav.fullDown .depth01 > ul > li:last-child:after {top: 4.25rem;}
#nav.fullDown #gnb.active:after {height: calc(100% - 4.25rem);}
/* gnb : oneFull */
#nav.oneFull .depth02 {top: 4.25rem;}

#header .topUtil .util {font-size:0.7rem;}
#header .topUtil .util > li {padding:0 0.75rem;}
#header .topUtil .util > li:before {content:'|'; position:absolute; width:auto; height:auto; left:auto; background:none; right:-0; top:0.05rem; font-weight:300; font-size:0.65rem; color:#dbdbdb;}
#header .topUtil .util > li strong i {font-size:0.9rem; font-weight:400; margin-right:0.25rem; vertical-align:middle; margin-top:-0.2rem;}
#header .topUtil .util > li a {font-size:0.7rem;}
#header .topUtil .util > li a i {font-size:0.75rem;}
#header .topUtil .font-size a {background:none; margin:0;}

#mNav .snb .util {margin: 0.25rem -0.75rem;}
#mNav .snb .util li {padding: 0 0.75rem;}
#mNav .snb .util > li:before {top:50%; transform:translateY(-50%);}
#mNav .snb .util > li:first-child:before {display:none;}
#mNav .snb .util > li a {padding:0.4rem 0;}
#mNav .snb .util > li a.loginfo {padding:0.1rem 0.5rem; border-radius:0.7rem; border:1px solid #ccc;}

/* moblie search */
#mSearch {top: 6.05rem;}
.open #mSearch {top:12.55rem;}

/* footer */
#footer { border-top:1px solid #ddd; color:#fff; background: #2b2b2b; }/* footer 배경, 폰트색상, border */
.footer_link li a:before{ border-left:1px solid #595959; }/* footer link 영역 라인색상 */
.footer_link li a strong { color: #feb80b; }/* footer link 강조 폰트색상 */
#footer .ftWrap {padding-left:16.2rem;}
#footer .f_logo {position:absolute; left:0; top:-0.25rem;}
#footer address {font-size:0.75rem;}
#footer address span {position:relative;}
#footer address span:before {content:'|';  font-size:0.6rem; color:#555; margin:-0.1rem 0.5rem 0 0.1rem;}
#footer address span:first-child:before {display:none;}
#footer .copyright { color:#acacac; font-size:0.7rem; margin-top:0.25rem; }/* footer link 강조 폰트색상 */

/* 방문자수 */
.visitant{background:#feb80b; }
.visitant a,
.visitant ul li{ color:#3a3b3d;}
.visitant ul li strong { color:#3a3b3d;}
.visitant ul li + li:before{ border-left:1px solid #ccc;}

/* lnb */
#lnb h2 span:before {background: #0088f3;}
#lnb .dep01 > li.dep.active > a:before {background:#0088f3;} /* 20230531 lnb 수정 */
#lnb .dep02 {border-color:#0088f3;} /* 20230531 lnb 수정 */
#lnb .dep03:before {background: #0088f3;} /* 20230531 lnb 수정 */

/* location : snsBox */
.snsBox button.active,
.snsBox button:hover,
.snsBox button:focus{ color:#fff; border-color:#0088f3; background:#0088f3;}

@media screen and (max-width: 1760px) {

    .container { padding:0 1rem;}
    
    /* header - 로고 */
	#header h1 {left: 1rem; margin-left:0;}
	
	/* header - 유틸리티 */
	#header .topUtil {right: 1rem; margin-right:0;}
	
	/* header - 사이트맵 버튼 */
	#header .h_btn { right: 1rem; margin-right:0; }
	#mSearch .btnClose {right: 4.1rem; margin-right:0;}
}

@media screen and (max-width: 1600px) {
	
	#gnb .depth01 {max-width:50rem;}
}

@media screen and (max-width: 1440px) {
	
	#header {height:3.5rem; margin-top:0; border-top:none;}
	#header:after {display:none;}
	
	/* header - 로고 */
	#header h1 {top:0.5rem; transform:none;}
	
	/* header - 유틸리티 */
	#header .topUtil {right: 1rem; top:1rem; padding-top:0;}
	#header .topUtil:before {display:none;}
	
	#header .topUtil .util {position:relative; width:auto; min-width:auto; top:auto; right:auto; margin-right:0.25rem;}
	
	/* header - 사이트맵 버튼 */
	#header .h_btn {top:4.05rem; }
	
    #nav {padding-top:3.5rem;}
    #nav:before {content:''; position:absolute; left:-1rem; right:-1rem; width:auto; height:0.001rem; background:#ddd; z-index:2;}
    
    /* web navigation */
	/* gnb common */
	#gnb:before {content:''; position:absolute; left:0; bottom:-1px; width:100%; height:1px; background:#eee;}
	#gnb .depth01 {height:3.5rem; max-width:100%; padding-right:8rem; padding-left:0;}
	#gnb .depth01 > ul > li > a {height:3.5rem;} /* 1차메뉴 텍스트 */
	/* gnb : oneDown */
	#nav.oneDown .depth02 {top:3.5rem;}
	/* gnb : fullDown */
	#nav.fullDown #gnb:after {top: 3.5rem;}
	#nav.fullDown .depth01 > ul > li:before {top: 3.5rem;}
	#nav.fullDown .depth01 > ul > li:last-child:after {top: 3.5rem;}
	#nav.fullDown #gnb.active:after {height: calc(100% - 3.5rem);}
	/* gnb : oneFull */
	#nav.oneFull .depth02 {top: 3.5rem;}
	
	#mSearch {top:7rem;}
	.open #mSearch {top:13.5rem;}
	#mSearch .btnClose {top:-3rem;}
	
	#container {padding-top:3.5rem;}
	#sub_container {padding-top:3.5rem;}
}

@media screen and (max-width: 1420px) {
	
	#header .header_wrap {padding:0;}
}

@media screen and (max-width: 1280px) {
	
	#footer .ftWrap {padding-left:11rem;}
	#footer .f_logo img {width:80%;}
	#footer .copyright {padding-right:5rem;}
}

@media screen and (max-width: 1200px) {
	
	.subCntBody {padding:1.5rem 1rem;}
	
	/* header - 유틸리티 */
	#header .topUtil {padding-top:0.75rem;}
	
	#header .topUtil .util {position:absolute; min-width:115%; width:max-content; top:-0.75rem; right:0; margin-right:0;}
}

@media screen and (max-width: 1024px) {

    /* moblie  */
    #header {border-bottom-color: #e0e0e0;}
    
    .open #mSearch {top:9.95rem !important;}
    
    .open.upPop #container {padding-top:9.5rem !important;}
    
    #footer .ftWrap {padding-left:0; margin-top:0.5rem;}
	#footer .f_logo {position:relative; top:auto; left:auto;}
	#footer .f_logo img {width:11rem;}
	#footer address {margin-top:0.5rem;}
}

@media screen and (max-width: 768px) {

    #header h1 span {font-size:0.95rem;}
}

@media screen and (max-width: 580px) {

    .open #mSearch {top:9.45rem !important;}
}

@media screen and (max-width: 380px) {
	#header h1 em.logo1 {display:none;}
    #header h1 em.logo2 {display:block;}
    #header h1 span {padding-left:0.25rem;}
    #header h1 span:before {display:none;}
    #header h1 a img {max-height:30px;}
    #header h1 span {font-size:0.9rem;}
}

@media screen and (max-width: 340px) {

    .open #mSearch {top:10.2rem !important;}
}