@charset "UTF-8";

/*===================== header =====================*/
.header {width:100%;background-color:#fff;position:fixed;left:0;top:0;z-index:9999}

.header .header_inner {position: relative}
.header .header_top {border-bottom: 1px solid var(--colorBorderGray);position:relative;z-index:9998;transition:all 0.3s}
.header .header_top .container {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; align-items: center; justify-content: space-between; padding: 19px 0;transition:all 0.3s}
.header .header_top .logo_area {}
.header .header_top .logo_area .logo {display:inline-block;width:255px;height:54px;color:transparent;background-repeat:no-repeat;background-position:left top;background-size:cover;vertical-align:bottom}
.header .header_top .head_sch_cont_area {position:relative; width: 100%; max-width:400px; padding: 0 50px 0 0;border:1px solid var(--colorGray90);border-radius: 41px;transition:width 0.3s}
.header .header_top .head_sch_cont_area .head_inp {width:calc(100% - 28px); height:15px;font-size:1em;border: none; background-color: inherit;}
.header .header_top .head_sch_cont_area .sch_btn {display:flex;align-items:center;justify-content:center;width:50px;height:100%;font-size:26px;text-align:left;position:absolute;right:0;top:0}
.header .header_top .right_btn_group {display:inline-flex;column-gap:24px;align-items:flex-end;transform:translateY(10px)}
.header .header_top .right_btn_group .btn_li {font-size:1.05em}
.header .header_top .right_btn_group .btn_li .btn {display:flex;align-items:center;column-gap:6px;font-weight:700}
.header .header_top .right_btn_group .btn_li .btn .icon {font-size:21px}
.header .header_top .right_btn_group .btn_li .btn .text {}
.header .header_top .top_small_btn {position:absolute;right:0;top:8px}
.header .header_top .top_small_btn .btn {display:inline-block;margin-right:20px;background-position:left center;background-repeat:no-repeat;vertical-align:top}
.header .header_top .top_small_btn .btn:last-child {margin-right:0}
.header .header_top .top_small_btn .btn.ic01 {padding-left:20px;background-image:url(/images/other/kor/user/header/ic_home.png)}
.header .header_top .top_small_btn .btn .text {display:inline-block;vertical-align:middle}

.header .gnb_cont_area {position:relative;z-index:9998;border-bottom: 1px solid var(--colorBorderGray)}
/*.header .gnb_cont_area .container {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; align-items: center; justify-content: space-between; position:relative;}*/
.header .gnb_cont_area .gnb_area {}
.header .gnb_cont_area #gnb {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center;}
.header .gnb_cont_area #gnb > li {flex:1;height:60px;font-size:1.1em;position:relative}
.header .gnb_cont_area #gnb > li.none {display: none;}
.header .gnb_cont_area #gnb > li .sitemap_tit {display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:1.1em;position:relative}
.header .gnb_cont_area #gnb > li .sitemap_tit::before {display:block;width:0;height:3px;content:'';background-color:var(--colorMain);position:absolute;left:0;bottom:0;transition:width 0.3s}
.header .gnb_cont_area #gnb > li .sitemap_tit .text {display:grid;grid-template-columns:auto max-content;align-items:center;column-gap:8px;font-weight:700}
.header .gnb_cont_area #gnb > li .sitemap_tit .text::after {font-family:'xeicon';content:'\e943';font-size:0.98rem}
.header .gnb_cont_area #gnb > li .sub_gnb_area {display:none;background-color:#fff;border-left:1px solid var(--colorGray10);position:absolute;right:0;left:0;z-index:3}
.header .gnb_cont_area #gnb > li .sub_gnb_area:last-child {border-right:var(--colorGray10)}
.header .gnb_cont_area #gnb > li .sub_gnb {}
.header .gnb_cont_area #gnb > li .sub_gnb > li {}
.header .gnb_cont_area #gnb > li .sub_gnb > li > a {display:block;padding:10px 18px;font-size:1.1em;color:var(--colorGray70);transition:0.3s}
.header .gnb_cont_area #gnb > li .sub_gnb > li.on > a, 
.header .gnb_cont_area #gnb > li .sub_gnb > li > a:hover, 
.header .gnb_cont_area #gnb > li .sub_gnb > li > a:focus-within {color:var(--colorMain);font-weight:700;background-color:#ECF2FE}
.header .gnb_cont_area #gnb > li .sub_gnb > li > a:focus-within {outline-offset:-2px}
.header .gnb_cont_area #gnb > li .depth3_list {}
.header .gnb_cont_area #gnb > li .depth3_list > li {}
.header .gnb_cont_area #gnb > li .depth3_list > li > a {display:block;padding:8px 20px;font-size:1em;color:var(--colorGray60)}
.header .gnb_cont_area #gnb > li .depth3_list > li > a::before {display:inline-block;width:6px;height:1px;margin-right:6px;content:'';background-color:var(--colorGray60);border-radius:100%;vertical-align:middle;transform:translateY(-2px)}
.header .gnb_cont_area #gnb > li .depth3_list > li > a:hover,
.header .gnb_cont_area #gnb > li .depth3_list > li > a:focus-within {color:var(--colorMain);font-weight:700;background-color:#fff}
.header .gnb_cont_area #gnb > li .depth3_list > li > a:focus-within {outline-offset:-2px}
.header .gnb_cont_area #gnb > li.on .sitemap_tit {}
.header .gnb_cont_area #gnb > li.on .sitemap_tit::before {width:100%}
.header .gnb_cont_area #gnb > li.on .sitemap_tit .text {}
.header .gnb_cont_area #gnb > li.on .sub_gnb_area {background-color:#F9F9F9}

.header .head_etc_btn_area {}
.header .head_etc_btn_area > .list { display: flex; justify-content: space-between; align-items: center;text-align:center}
.header .head_etc_btn_area > .list > li { display: inline-block; margin: 0 5px 0 0; vertical-align: middle;}
.header .head_etc_btn_area > .list > li:last-child { margin: 0;}
.header .head_etc_btn_area > .list > li .btn { display: block; padding:10px 17px 9px 17px;line-height:1; border-radius: 20px; background:rgba(0,0,0,0.1); color:var(--colorBlack); font-size: 15px; font-weight: 500;}
.header .head_etc_btn_area > .list > li .btn.link_btn {  background: var(--colorGray80); color:var(--colorWhite)}
.header .head_etc_btn_area > .list > li .btn .icon {line-height:15px;vertical-align:baseline;transform:translateY(1px)}
.header .head_etc_btn_area > .list > li .btn:hover, 
.header .head_etc_btn_area > .list > li .btn:focus-within {color:var(--colorWhite);background-color:var(--colorSub)}}
.header .head_btn_box { display: flex; justify-content: space-between; align-items: center; gap: 0 13px;}

.header .gnb_bg {position: absolute; left:0; display: none; width: 100%; background-color:#fff; box-shadow: 0 5px 10px rgba(211,211,211,0.5); z-index: 2;}

/* header scrolled */
.header.scrolled {position:fixed;left:0;top:0}
.header.scrolled > .utility_bar {width:100%;animation:scrolledHeader 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) forwards}
.header.scrolled > .utility_bar .container {max-width:inherit;margin:0 60px}
.header.scrolled .header_top .container {max-width:inherit;margin:0 60px;padding:12px 0}
.header.scrolled .header_top .top_small_btn {top:4px}
.header.scrolled .header_top .logo_area .logo {width:220px;height:46px}
.header.scrolled .header_top .head_sch_cont_area {min-width:220px;animation:schWidth 0.5s 1 forwards}
.header.scrolled .gnb_cont_area .container {max-width:inherit;margin:0 60px}

@keyframes scrolledHeader{
    from {transform:translateY(-100%);opacity:0}
    to {transform:translateY(0);opacity:1}
}
@keyframes schWidth{
	from {max-width:400px}
	to {max-width:42%}
}


/* 각 지역 이미지 로고 별도 */
.boryeong .header .header_top .logo_area .logo {width:200px;height:61px;background-image:url(/images/other/kor/user/common/logo_boryeong.png)}
.boryeong .header.scrolled .header_top .logo_area .logo {width:186px;height:56px}
.buyeo .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_buyeo.png)}
.cheonan_dong .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_cheonan_dong.png)}
.cheonan_seo .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_cheonan_seo.png)}
.cheongyang .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_cheongyang.png)}
.dangjin .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_dangjin.png)}
.geumsan .header .header_top .logo_area .logo {width:227px;background-image:url(/images/other/kor/user/common/logo_geumsan.png)}
.geumsan .header.scrolled .header_top .logo_area .logo {width:208px}
.gongju .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_gongju.png)}
.hongseong .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_hongseong.png)}
.nonsan .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_nonsan.png)}
.onyang .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_onyang.png)}
.seocheon .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_seocheon.png)}
.seosan .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_seosan.png)}
.taean .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_taean.png)}
.yesan .header .header_top .logo_area .logo {background-image:url(/images/other/kor/user/common/logo_yesan.png)}


/* sitemap */
.sitemap_wrap {display:none;padding:0 0 0 540px;background:linear-gradient(196.09deg, #ECF2FE 0%, #B1CEFB 100%);position:fixed;left:0;top:0;right:0;bottom:0;z-index:9999;overflow:hidden}
.sitemap_wrap::before {content:'';width:100%;max-width:540px;height:100%;background-image:url(/images/other/kor/user/header/bg_sitemap.png);background-position:left bottom -50px;background-repeat:no-repeat;position:fixed;top:0;left:0}
.sitemap_wrap .sitemap_obj {height:100%}
.sitemap_wrap .sitemap_close {width:40px;height:40px;font-size:34px;position:absolute;top:60px;right:50px;transform-origin:center}
.sitemap_wrap .sitemap_close .icon {transition:transform 0.3s}
.sitemap_wrap .sitemap_close:hover .icon, 
.sitemap_wrap .sitemap_close:focus .icon {transform:rotate(180deg)}
.sitemap_wrap .logo_area {width:100%;max-width:540px;padding-right:60px;text-align:right;position:absolute;top:0;left:0}
.sitemap_wrap .logo_area .logo {display:inline-block;text-align:left}
.sitemap_wrap .logo_area .logo img {display:inline-block;width:100%;max-width:255px;padding:100px 0 0;text-align:left}
.sitemap_wrap .container {max-width:100%;height:100%}
.sitemap_wrap .sitemap {height:100%;padding:65px 140px 22px 80px;font-size:0;background-color:var(--colorWhite);position:relative;overflow-y:auto}
.sitemap_wrap .sitemap > li {display:block;width:100%;margin:0;padding:29px 0;font-size:0;vertical-align: top;}
.sitemap_wrap .sitemap > li.on {}
.sitemap_wrap .sitemap > li > a {display:inline-block;padding-left:22px;-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;position:relative}
.sitemap_wrap .sitemap > li > a::before {display:inline-block;width:6px;height:calc(100% - 23px);content:'';background-color:var(--colorMain);position:absolute;left:0;top:50%;transform:translateY(-50%)}
.sitemap_wrap .sitemap > li > a .text {font-weight:700;font-size:32px;-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;z-index:0}
.sitemap_wrap .sitemap .sub_gnb_area {display:block;width:100%;margin-top:10px;padding-top:15px;border-top:1px solid var(--colorBorderGray);vertical-align:middle;top: inherit !important}
.sitemap_wrap .sitemap .sub_gnb_area .title_area {display:none}
.sitemap_wrap .sitemap .sub_gnb_area .gnb_tit {display:none}
.sitemap_wrap .sitemap_sub_gnb {display:flex;flex-wrap:wrap;gap:18px 24px;padding-left:24px}
.sitemap_wrap .sitemap_sub_gnb > li {display:inline-block;width:calc(100% / 4 - 18px);position:relative}
.sitemap_wrap .sitemap_sub_gnb > li:last-child {margin-right:0;padding-right:0}
.sitemap_wrap .sitemap_sub_gnb > li.none {display:none !important}
.sitemap_wrap .sitemap_sub_gnb > li > a {display:block;padding:6px 16px;font-size:22px;-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_sub_gnb > li.on > a, 
.sitemap_wrap .sitemap_sub_gnb > li > a:hover,
.sitemap_wrap .sitemap_sub_gnb > li > a:focus {color:#fff;background-color:var(--colorMain);border-radius:8px}
.sitemap_wrap .sitemap_sub_gnb .depth3_list {display:block;margin:12px 0 0 18px;font-size:19px}
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li {margin-bottom:10px}
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li:last-child {margin-bottom:0}
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a {padding-left:14px;position:relative}
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a::before {display:block;width:4px;height:4px;content:'';background-color:var(--colorGray60);border-radius:100%;vertical-align:top;position:absolute;left:0;top:9px;transition:0.2s}
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a::after {width:0;height:1px;content:'';background-color:var(--colorMain);position:absolute;left:14px;bottom:0;transition:width 0.2s}
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a:hover, 
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a:focus-within {color:var(--colorMain);font-weight:500}
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a:hover::before, 
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a:focus-within::before {background-color:var(--colorMain)}
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a:hover::after, 
.sitemap_wrap .sitemap_sub_gnb .depth3_list > li > a:focus-within::after {width:calc(100% - 14px)}

@media screen and (min-width:1081px){
	.sitemap_wrap .sitemap .sub_gnb_area {height:100% !important}
}


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

/* ==================== POPZON ==================== */
.head_popzon {background-color: #31435a;}
.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/other/kor/user/header/popzon_prev_icon.png');}
.head_popzon .popzon_box .nav_box .nav.next {background-image: url('/images/other/kor/user/header/popzon_next_icon.png');}
.head_popzon .popzon_box .nav_box .num {display: inline-block; margin: 0 0 0 30px; font-weight: 300; font-size: 16px; line-height: 24px; color: #ffffff; vertical-align: middle;}
.head_popzon .popzon_box .nav_box .num .now {font-weight: 500;}
.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; line-height: 30px; color: #ffffff; 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-weight: 400; font-size: 16px; line-height: 24px; 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/other/kor/user/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 #ffffff; background-position: center; background-repeat: no-repeat; transform: translateY(-50%);}
.head_popzon .popzon_box .chk_each .chk_inp:checked {background-image: url('/images/other/kor/user/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-weight: 400; font-size: 14px; line-height: 21px; color: #ffffff;}
/* ==================== POPZON ==================== */
.gnb_header {position:relative; }
.header .scroll_indicator {position:absolute; right: 0; bottom: 0; left: 0; height: 4px; font-size: 0;}
.header .scroll_indicator span {display: inline-block; height: 4px; background-color: #000;  -webkit-transition: width .4s ease-out; transition: width .4s ease-out;}