@charset "UTF-8";

/*===================== header =====================*/
header {transition:all 0.2s}
header.on {position: relative;z-index: 9999;}
.header {background-color:var(--colorWhite);position:relative z-index: 9999;}
.header.on, 
.header.fixed {background-color:var(--colorWhite)}
.header.on .gnb_cont_area, 
.header.fixed .gnb_cont_area {border-bottom:1px solid var(--colorLightGray)}

.header .head_top {background-color:var(--colorMain)}
.header .head_top .inner_wrap {padding:0 40px}
.header .head_top .txt_list {min-height:28px}
.header .head_top .txt_list .txt {display:inline-block;margin-right:10px;padding-right:16px;color:var(--colorWhite);vertical-align:middle;position:relative}
.header .head_top .txt_list .txt::after {width:1px;height:14px;content:"";background-color:var(--colorWhite);opacity:0.6;position:absolute;right:0;top:50%;transform:translateY(-50%)}
.header .head_top .txt_list .txt:last-child {margin-right:0;padding-right:0}
.header .head_top .txt_list .txt.noline::after, 
.header .head_top .txt_list .txt:last-child::after {display:none}
.header .head_top .txt_list .btn {padding:10px 20px;line-height:1;color:var(--colorWhite);background-color:rgba(0,0,0,0.3)}
.header .head_top .txt_list .btn:hover {background-color:rgba(0,0,0,0.5)}
.header .head_top .txt_list .link:hover {text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;opacity:0.8}

.header .gnb_cont_area {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; align-items: center; justify-content: space-between; padding:0 40px; position:relative;border-bottom:1px solid var(--colorLightGray)}
.header .gnb_cont_area .logo_area {width:309px;height:33px}
.header .gnb_cont_area .logo_area .logo {display: block;height:100%;background-image:url(/images/header/logo.png);background-position:left top;background-repeat:no-repeat;background-size:cover}
.header .gnb_cont_area .gnb_area {position:relative}
.header .gnb_cont_area .gnb_area #gnb {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex: 1;}
.header .gnb_cont_area .gnb_area #gnb > li {width:258px;text-align:center;position:relative}
.header .gnb_cont_area .gnb_area #gnb > li.none {display: none;}
.header .gnb_cont_area .gnb_area #gnb > li .sitemap_tit {display: block;position:relative}
.header .gnb_cont_area .gnb_area #gnb > li .sitemap_tit .text {font-weight:700; font-size:18px; line-height: 87px;position:relative;transition:0.2s}
.header .gnb_cont_area .gnb_area #gnb > li .sitemap_tit .text::before {width:0;height:0;content:"";background-color:var(--colorMain);border-radius:100%;position:absolute;top:-3px;left:-10px;transition:0.2s}
.header .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area {display:none;padding:25px 0;border-right:1px solid var(--colorLightGray);position:absolute;right:0;left:0;z-index:9999}
.header .gnb_cont_area .gnb_area #gnb > li:first-child .sub_gnb_area {border-left:1px solid var(--colorLightGray)}
.header .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb {}
.header .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb > li {}
.header .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb > li > a {display:inline-block;margin:9px 0;color:var(--colorBlack2);border-bottom:1px solid transparent}
.header .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb > li .depth3 {display: none;}
.header .gnb_cont_area .gnb_area #gnb > li:hover .sitemap_tit .text {color:var(--colorMain) !important}
.header .gnb_cont_area .gnb_area #gnb > li:hover .sitemap_tit .text::before {width:6px;height:6px}
.header .gnb_cont_area .gnb_area #gnb > li:hover .sub_gnb_area {}
.header .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area.on {background-color:var(--colorMain)}
.header .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area.on .sub_gnb > li > a {color:var(--colorWhite)}
.header .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area.on .sub_gnb > li > a:hover {border-bottom-color:var(--colorWhite)}

.header .gnb_cont_area .head_btn_area {}
.header .gnb_cont_area .head_btn_area .sitemap_btn {display:inline-block;font-size:2.1875rem;vertical-align:middle;transition:0.2s}
.header .gnb_cont_area .head_btn_area .sitemap_btn:hover {}
.header .gnb_bg {display:none;width:100%;background-color:var(--colorWhite);box-shadow:0 5px 10px rgba(0,0,0,0.2);position:absolute;left:0;z-index:9998}

/* sitemap (10/10) */
.sitemap_wrap {display:none;padding:0 0 0 520px;background:linear-gradient(0deg, #ffd871, #fffabe);position:fixed;left:0;top:0;right:0;bottom:0;z-index:9999;overflow:hidden}
.sitemap_wrap::before {content:'';width:100%;max-width:520px;height:100%;background-image:url(/images/header/sitemap_bg.jpg);background-position:left bottom;background-repeat:no-repeat;position:fixed;top:0;left:0}
.sitemap_wrap .sitemap_close {display:flex;align-items:center;justify-content:center;width:40px;height:40px;font-size:34px;line-height:1;position:absolute;top:60px;right:50px;transform-origin:center;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s}
.sitemap_wrap .sitemap_close:hover, 
.sitemap_wrap .sitemap_close:focus {color:var(--colorMain);transform:rotate(180deg)}
.sitemap_wrap .sitemap_close:hover .icon, 
.sitemap_wrap .sitemap_close:focus .icon {transform:translateY(0)}
.sitemap_wrap .logo_area {width:100%;max-width:540px;text-align:right;position:absolute;top:0;left:0}
.sitemap_wrap .logo_area .logo_cont {display:inline-block;width:100%;max-width:455px;padding:100px 0 0;text-align:left}
.sitemap_wrap .logo_area .logo_cont img {}
.sitemap_wrap .container {max-width:100%;height:100%}
.sitemap_wrap .sitemap {height:100%;padding:80px 80px 50px 30px;font-size:0;background-color:var(--colorWhite);position:relative;overflow-y:auto}
.sitemap_wrap .sitemap > li {display:block;width:100%;margin:0;padding:58px 0;font-size:0;border-bottom:1px solid #f1f1f1;vertical-align: top;}
.sitemap_wrap .sitemap > li:last-child {margin:0;border-bottom:0}
.sitemap_wrap .sitemap > li > a {display:inline-block;padding:0 53px 0 30px;text-align:center;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition: all 0.3s;vertical-align:middle}
.sitemap_wrap .sitemap > li > a .text {padding:3px 7px 0 0;font-weight:800;font-size:30px;line-height:60px;color:var(--colorBlack2);-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;position:relative}
.sitemap_wrap .sitemap > li > a .text::before {width:0;height:0;content:"";background-color:var(--colorMain);border-radius:100%;position:absolute;top:1px;left:-10px;transition:0.2s}
.sitemap_wrap .sitemap > li > a:hover .text, 
.sitemap_wrap .sitemap > li > a:focus .text, 
.sitemap_wrap .sitemap > li.on > a .text {color:var(--colorMain)}
.sitemap_wrap .sitemap > li > a:hover .text::before, 
.sitemap_wrap .sitemap > li > a:focus .text::before, 
.sitemap_wrap .sitemap > li.on > a .text::before {width:7px;height:7px}
.sitemap_wrap .sitemap > li > .sub_gnb_area {display:inline-block;height:100%;vertical-align:middle;top: inherit !important}
.sitemap_wrap .sitemap > li > .sub_gnb_area .title_area {display:none}
.sitemap_wrap .sitemap > li > .sub_gnb_area .gnb_tit {display:none}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb {font-size:0}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li {display:inline-block;margin:0 17px 0 0;padding:0 23px 0 0;font-size:0;text-align:center;position:relative}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:last-child {margin-right:0;padding-right:0}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li.none {display:none !important}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li::after {content:'/';font-weight:400;font-size:16px;line-height:28px;color:var(--colorLightGray);position:absolute;top:0;right:0}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:last-child:after {display: none;}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > a {display:inline-block;font-weight:400;font-size:16px;line-height:28px;color:var(--colorBlack2);background-position:left center;background-repeat:no-repeat;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:hover > a,
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:focus > a {padding-left:18px;color:var(--colorSub)}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > .depth3 {display: none;}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > .depth3 > li {}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > .depth3 > li > a {}

/* hover 시 그래프 효과 */
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li::before, 
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > a::before, 
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > a::after {display:none;width:3px;content:"";background-color:var(--colorSub);position:absolute;bottom:7px}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li::before {height:16px;left:0}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > a::before {height:12px;left:5px}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > a::after {height:8px;left:10px}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:hover::before, 
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:focus::before {display:inline-block;animation:hoverPoint 1.7s infinite forwards}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:hover > a::before, 
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:focus > a::before {display:inline-block;animation:hoverPoint2 1.6s infinite forwards;animation-delay:0.2s}
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:hover > a::after, 
.sitemap_wrap .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:focus > a::after {display:inline-block;animation:hoverPoint3 1.8s infinite forwards;animation-delay:0.2s}

@keyframes hoverPoint{
	0% {height:16px}
	25% {height:8px}
	50% {height:12px}
	75% {height:8px}
	100% {height:16px}
}
@keyframes hoverPoint2{
	0% {height:12px}
	25% {height:14px}
	50% {height:10px}
	75% {height:13px}
	100% {height:10px}
}
@keyframes hoverPoint3{
	0% {height:6px}
	25% {height:8px}
	50% {height:10px}
	75% {height:8px}
	100% {height:6px}
}

/*===================== header =====================*/

/* ==================== POPZON ==================== */
.head_popzon {background-color:var(--colorDarkGray)}
.head_popzon .popzon_box {position: relative; width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 150px; font-size: 0; text-align: center;}
.head_popzon .popzon_box .nav_box {position: absolute; top: 50%; left: 5px; margin: -13px 0 0; font-size: 0;}
.head_popzon .popzon_box .nav_box.m {display: none;}
.head_popzon .popzon_box .nav_box .nav {display: inline-block; width: 26px; height: 26px; margin: 0 5px 0 0; text-indent: -9999px; background-position: 0 0; background-size: contain; background-repeat: no-repeat; vertical-align: middle;}
.head_popzon .popzon_box .nav_box .nav:last-child {margin: 0;}
.head_popzon .popzon_box .nav_box .nav.prev {background-image: url('/images/header/popzon_prev_icon.png');}
.head_popzon .popzon_box .nav_box .nav.next {background-image: url('/images/header/popzon_next_icon.png');}
.head_popzon .popzon_box .nav_box .num {display: inline-block; margin: 0 0 0 30px;font-size:initial; line-height: 24px; color:rgba(255,255,255,0.6); vertical-align: middle}
.head_popzon .popzon_box .nav_box .num .now {color:var(--colorWhite);font-weight:700;opacity:1}
.head_popzon .popzon_box .slide_zon {}
.head_popzon .popzon_box .slide_zon #head_slide {}
.head_popzon .popzon_box .slide_zon #head_slide li {}
.head_popzon .popzon_box .slide_zon #head_slide li a {display: block; padding: 18px 0 19px;}
.head_popzon .popzon_box .slide_zon #head_slide li a .title {height: 30px; margin: 0 0 5px; font-weight: 700; font-size: 20px;color: var(--colorWhite); word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.head_popzon .popzon_box .slide_zon #head_slide li a .text {height: 24px;font-size:initial;color: rgba(255, 255, 255, 0.6); word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.head_popzon .popzon_box .head_popzon_close {display: inline-block; position:absolute; top: 10px; right: 5px; width: 19px; height: 18px; background-image: url('/images/header/popzon_close.png'); background-size: cover; background-repeat: no-repeat;}
.head_popzon .popzon_box .slide_zon #head_slide .slick-dots {display: none !important;}

.head_popzon .popzon_box .chk_each {position: absolute; bottom: 10px; right: 5px; padding: 0 0 0 23px;}
.head_popzon .popzon_box .chk_each .chk_inp {display: block; position: absolute; left: 0; top: 50%; z-index: 1; width: 15px; height: 15px; margin: 0; border: 1px solid var(--colorWhite); background-position: center; background-repeat: no-repeat; transform: translateY(-50%);}
.head_popzon .popzon_box .chk_each .chk_inp:checked {background-image: url('/images/board/chk.png');}
.head_popzon .popzon_box .chk_each label {display: block; font-size: 0;}
.head_popzon .popzon_box .chk_each label .text {display: inline-block;font-size: 0.875rem; color: var(--colorWhite);}
/* ==================== POPZON ==================== */
.gnb_header {position:relative; }