@charset "utf-8";
/* CSS Document */
/* 상단 네비게이션 영역 */
header {/*height: 7rem;*/ position: fixed; width: 100%; top: 0rem; z-index: 99;}
.header.header_hide {transform: translateY(-100%);}
.header_fixed {position: fixed !important; width: 100%; backdrop-filter: blur(30px); z-index: 99 !important; background: #141414b5;}
.header {display: flex;position: relative;z-index: 99;height: 6rem;border-bottom: 0.1rem solid #61605f;transition: all 0.5s;padding: 0rem 3rem;backdrop-filter: blur(3px);}
.header .header_logo {position: absolute;top:50%;transform: translate(0%,-50%);font-size: 2rem;color:#fff;background: url("../images/layout/logo_img.png") 0% 0% no-repeat;padding-left:3rem;background-size: 2.2rem;}
.header nav {position: relative; width: 100%; /*max-width: 140rem;*/ margin:0 auto;}
.header .lnb .depth1 {display: flex;justify-content: flex-end;height: 100%;width: 100%;}
.header .lnb .depth1 > li {padding:0rem 2%;}
.header .lnb .depth1 > li > a { display: flex; height: 100%; align-items: center; font-size:1.8rem; transition: all 0.5s; color:#fff;}
.header .lnb .depth1 > li > a:hover { color: #f6ff00 !important;}
.header .lnb .depth1 > .on > a {font-weight: bold; color: red;}
.header .lnb .depth1 li.on .depth2 { visibility: visible; top:0px;  opacity: 1; }
.header .lnb .depth2 {display: flex; align-items: flex-start; justify-content: center; opacity: 0; visibility: hidden; position: fixed; left: 0; top: -50px; z-index: -1; width: 100%;  background-color: #fff; padding: 10rem 7rem 5rem 7rem; box-shadow:0 0 20px 0px #383737; transition: all 0.2s;}
.header .lnb .depth2 > li {width: 10%; text-align: center; }
.header .lnb .depth2 > li > a {padding: 1rem 0rem; display: block; font-size:1.8rem; font-weight: bold;}
.header .lnb .depth3  {flex-direction: column; display: flex;}  
.header .lnb .depth3 li a {position: relative; display: block; font-size:1.6rem; padding: 1rem 0rem;} 
.header a:hover {text-decoration: underline; text-underline-offset: 10px;}
.login_area {display: flex; align-items: center; justify-content: center; min-width: 20rem;}
.login_area a {position: relative; color:#fff; font-size:1.6rem; padding:0rem 1rem 0rem 3rem;}
.login_area a:hover {color: #f6ff00 !important;}
.login_area a i {margin:0rem 0.4rem; font-size:2rem; position: absolute; top:50%; left:0%; transform: translate(0%,-50%);}
.header .lnb .depth1 .active a {color: #f6ff00 !important; text-decoration: underline; text-underline-offset: 10px;}
/* 상단 사이트맵 영역 */
.sitemap_btn {color:#fff;}
.sitemap_btn i {font-size:3.5rem; transition: all 0.5s;}
.sitemap_btn:hover i {color: #f6ff00 !important; text-decoration: underline; text-underline-offset: 10px;}
.sitemap_area {visibility:hidden; position:fixed; width:100%; height:100%; top:0px; right:-100%; transition: all 0.5s; z-index: 999; overflow: auto; background:#fff url("../images/main-letter.jpg");}
.sitemap_on {visibility:visible; right:0%;}
.sitemap_box {position: relative;max-width: 100rem;margin:0 auto;padding:7rem;}
.sitemap_nav ul li {display: flex; width: 100%;}
.sitemap_nav ul li a:hover {color: #8b4a4a;}
.sitemap_nav .depth1 > li {position: relative;border-bottom:0.1rem solid #D3D8E5;}
.sitemap_nav .depth1 > li:last-child {border-bottom: none;}
.sitemap_nav .depth1 > li > a {position: relative;font-size:2.3rem !important;width: 100%;color: #111111;font-weight: bold;padding: 3rem 3rem 3rem 1rem;cursor: pointer;}
.sitemap_nav .depth1 > li > a:after {content: "\e940"; font-family: "xeicon"; position: absolute; top:50%; right:1%; transform: translate(0%,-50%);}
.sitemap_nav .depth1 > li:after {content: ""; position: absolute; bottom: -0.1rem; left:0rem; width: 0%; height: 0.3rem; background: #8b4a4a;}
.sitemap_nav .depth1 > li:hover:after {width: 100%;transition: all 0.5s;}
.sitemap_on .sitemap_close {position: absolute;top: 7rem;right: 6rem;z-index: 99;}
.sitemap_on .sitemap_close:hover {color: red;}
.sitemap_close i {font-size:3.5rem;}
.mini_login {display: flex;padding: 3rem 0rem;background: url("../images/layout/te2.png") 100% 100% no-repeat;}
.mini_login .mini_login_title {width: 90%;}
.mini_login_title h2 {font-size: 5rem;color: #1d316d;padding: 2rem 0rem;}
.mini_login_title p {font-size:1.6rem;line-height: 2.5rem;padding: 1rem 0rem;color: #000000;word-break: keep-all;font-weight: 400;width: 70%;}
.mini_login .mini_login_btn {width: 40%;display: flex;display: none;justify-content:flex-end;align-items: center;}
.mini_login .mini_login_btn a {display: flex;justify-content: center;align-items: center;color:#4067e4;border-radius: 10rem;margin-left:1rem;font-size:1.8rem;height: 4rem;width: 11rem;border: 0.1rem solid transparent;background-image: linear-gradient(#fff, #fff), linear-gradient(to right, #437ccd 0%, #68b9f0 29%, #69c8f0 67%, #60ddef 100%);background-origin: border-box;background-clip: content-box, border-box;min-width: 10rem;}
.mini_login .mini_login_btn a:hover {color: red;}

/* 상단 사용자 정보 */
.login_area_after {padding: 1rem;}
.login_area_after {display: flex;}
.login_area_after div {position: relative; text-align: center; display: flex;  align-items: center; justify-content: center;}
.login_area_after button {position: relative;color:#fff;font-size:1.6rem;padding: 1rem 1rem;}
.login_area_after button i {font-size:2.5rem;}
.login_area_after a {position: relative; color:#fff; font-size:1.6rem; padding: 1rem 1rem;}
.login_area_after a i {font-size:2.5rem;}
.tab_menu_text {display: none; position: absolute;  top: 100%;  left: 50%;  width: 23rem; transform: translate(-50%,0%) !important; border-radius: 1rem; padding: 1.5rem; box-shadow: 0.1rem 0.2rem 0.6rem rgba(128, 128, 128, 0.6); background: #fff;}
.tab_menu_text li{border-bottom: 0.1rem dotted #c5c6cd; text-align: center;}
.tab_menu_text li a {display: block;  padding: 1rem 0rem; font-size: 1.6rem; color:#111;}
.tab_menu_text li a:hover {background: #f3f3f3}
.tab_menu_text li ul {background: #f6f6f6; padding: 0rem 2rem; margin-top: 1rem;}
.tab_menu_text li ul li {padding: 1rem 0rem;}
.tab_menu_text li ul li span {display: block; }
.tab_menu_text li ul li {font-size:1.4rem;}
.tab_menu_text li:last-child{border-bottom: none;}
.info_name i {position: absolute; top:50%; left:0rem; transform:translate(0%,-50%);}
.info_name button {padding-left:3rem;}
.login_area_after div{position: relative; width: 100%;}
.login_area_after .info_name {min-width: 11rem;}
.login_area_after .alarm_count {position: absolute;top: 0.5rem;right:0rem;background: red;border-radius: 100rem;padding: 0.1rem;min-width: 2rem;}
.tab_menu_colse {color:#fff !important;background: #6f6b6b;margin-top: 1rem;width: 100%;padding: 1rem !important;}						
.tab_menu_colse:hover {text-decoration: underline; text-underline-offset: 10px; background: #111;}
.in_na_on {display: block;}
.info_alarm ul li {position: relative;}
.info_alarm ul li a {text-align: left;word-break: keep-all;} 
.info_alarm ul li a:hover {text-decoration: underline; text-underline-offset: 5px; background: #f3f3f3;}
.info_alarm ul li a h4 {padding: 0.5rem 0rem 0.5rem 0rem;}
.info_alarm ul li a p {line-height: 2rem; font-size: 1.4rem;}
.info_alarm ul li .delete_alarm {color: #919191;position: absolute;top: 0.5rem;right:0%;padding-right: 0rem;}
.info_alarm ul li .delete_alarm:hover {color: #8b4a4a;}
.info_alarm ul li .delete_alarm i {font-size: 2rem;}
.alarm_data_none div {font-size:1.8rem; flex-direction: column; margin:1rem 0rem;}
.alarm_data_none div i {display: block; font-size: 4rem; color:#cecece; padding: 1rem 0rem;}
.alarm_data_none div h4 {display: block;}
.alarm_data_none div p {padding:1rem 0rem;}

@media screen and (max-width: 1023px){
.header {padding: 0rem 1rem 0rem 1rem;}
.header .lnb .depth1 {display: none;}
.mini_login {flex-direction: column; margin-bottom: 3rem;}
.sitemap_box {padding:2rem;}
.mini_login_title h2 {font-size: 4rem;}
.mini_login_title p {font-size: 1.6rem;}
.sitemap_nav .depth1 > li {padding:0rem; flex-direction: column; border-bottom: 0rem;}
.sitemap_nav .depth1 > li:first-child {border-top:0.1rem solid #d3d8e5;}
.sitemap_nav .depth1 > li > a {padding:2rem 1rem; border-bottom: 0.1rem solid #d3d8e5; width: 100%; font-size:2rem !important; box-sizing: border-box;}
.sitemap_nav .depth2 {flex-wrap:wrap; border-bottom: 0.1rem solid #d3d8e5;}
.sitemap_nav .depth2 > li {margin-right:0rem; width: 50%; padding:0.5rem 0rem;}
.sitemap_nav .depth2 > li > a {text-align: left; padding:1rem 0rem; background: none;}
.sitemap_nav .depth3 {padding:0rem;}
.sitemap_nav .depth3 > li a {font-size:1.5rem;}
.mini_login_title p {width: 100%;}
.sitemap_on .sitemap_close {position: absolute;top: 3rem;right: 2rem;z-index: 99;}
}

@media screen and (max-width: 769px){
.header .header_logo {font-size: 1.8rem; background-size:contain;}
/*.login_area_after .info_name {display: none;}*/
}
@media screen and (max-width: 490px){
.header .header_logo {font-size: 1.3rem; padding-left:2rem;}
	.login_area_after {padding:0rem;}

}