@charset "UTF-8";

/*===================== header =====================*/
.header {position:relative; z-index: 9999;}
.header .header_inner {}
.header .header_inner .header_top_cont { background-color: #e1e1e1;}
.header .header_inner .header_top_cont .inner_box { display: flex; justify-content: space-between; align-items: center; padding: 0 60px;}
.header .header_inner .header_top_cont .inner_box .site_list_area { margin: 0 0 0 -24px;}
.header .header_inner .header_top_cont .inner_box .site_list_area > .list { font-size: 0;}
.header .header_inner .header_top_cont .inner_box .site_list_area > .list > li { display: inline-block; vertical-align: middle;}
.header .header_inner .header_top_cont .inner_box .site_list_area > .list > li > .box { display: block; padding: 0 24px; text-align: center;}
.header .header_inner .header_top_cont .inner_box .site_list_area > .list > li > .box:hover,
.header .header_inner .header_top_cont .inner_box .site_list_area > .list > li > .box:focus { background-color: #ffffff;}
.header .header_inner .header_top_cont .inner_box .site_list_area > .list > li > .box .txt { display: inline-block; font-weight: 400; font-size: 15px; line-height: 35px; color: #191919;}
.header .header_inner .header_top_cont .inner_box .member_list_area {}

.header .header_inner .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 60px; position:relative; border-bottom: 1px solid #efefef; background-color: #ffffff;}
.header .header_inner .gnb_cont_area .logo_area {width: 162px;}
.header .header_inner .gnb_cont_area .logo_area .logo {display: block;}
.header .header_inner .gnb_cont_area .logo_area .logo img {}
.header .header_inner .gnb_cont_area .logo_area .logo img.main_logo {display: none;}
.header .header_inner .gnb_cont_area .gnb_area {flex: 1;}
.header .header_inner .gnb_cont_area .gnb_area #gnb {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li {flex: 1; position: relative; max-width: 215px; text-align: center;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li.none {display: none;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sitemap_tit {display: block; padding: 0 5px; font-size: 0;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sitemap_tit .text {display: inline-block; position: relative; font-weight: 700; font-size: 20px; line-height: 80px; color: #1b1b1b;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li:hover .sitemap_tit .text,
.header .header_inner .gnb_cont_area .gnb_area #gnb > li:focus .sitemap_tit .text { color: var(--com-sub-color) !important;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li:hover .sitemap_tit .text::before,
.header .header_inner .gnb_cont_area .gnb_area #gnb > li:focus .sitemap_tit .text::before { content: ''; position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background-color: var(--com-sub-color);}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area {display: none; position:absolute; right: 0; left: 0; padding: 12px 5px 32px 5px; z-index: 3;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb {}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb > li { padding: 8px 0;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb > li:last-child { margin: 0;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb > li > a {display: block; font-weight: 400; font-size: 16px; line-height: 24px; color: #181818;}
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb > li > a:hover,
.header .header_inner .gnb_cont_area .gnb_area #gnb > li .sub_gnb_area .sub_gnb > li > a:focus { font-weight: 500; color: var(--com-sub-color);}
.header .header_inner .gnb_cont_area .head_btn_area {font-size: 0;}
.header .header_inner .gnb_cont_area .head_btn_area > .list { font-size: 0;}
.header .header_inner .gnb_cont_area .head_btn_area > .list > li { display: inline-block; margin: 0 0 0 35px; vertical-align: middle;}
.header .header_inner .gnb_cont_area .head_btn_area > .list > li:first-child { margin: 0;}
.header .header_inner .gnb_cont_area .head_btn_area > .list > li > .btn { display: block; width: 100%; height: 100%; font-size: 0;}
.header .header_inner .gnb_cont_area .head_btn_area > .list > li > .btn i { color: #1b1b1b;}
.header .header_inner .gnb_cont_area .head_btn_area > .list > li > .btn.sch_btn i { font-size: 30px;}
.header .header_inner .gnb_cont_area .head_btn_area > .list > li > .btn.sitemap_btn i,
.header .header_inner .gnb_cont_area .head_btn_area > .list > li > .btn.m_gnb_btn i { font-size: 33px;}
.header .header_inner .gnb_cont_area .head_btn_area > .list > li > .btn.m_gnb_btn { display: none;}

/* 공통 헤더 마이페이지 관련 */
.header .member_list_area {}
.header .member_list_area > .list { font-size: 0;}
.header .member_list_area > .list > li { display: inline-block; position: relative; margin: 0 15px 0 0; padding: 0 16px 0 0; vertical-align: middle;}
.header .member_list_area > .list > li:last-child { margin: 0; padding: 0;}
.header .member_list_area > .list > li::before { content: ''; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 13px; background-color: rgba(0, 0, 0, 0.2);}
.header .member_list_area > .list > li:last-child::before { display: none;}
.header .member_list_area > .list > li .btn { display: block; width: 100%; text-align: left;}
.header .member_list_area > .list > li .btn .txt { display: inline-block; padding: 0 0 0 20px; background-position: left center; background-repeat: no-repeat; font-weight: 400; font-size: 15px; line-height: 35px; color: #191919; transition: all 0.3s;}
.header .member_list_area > .list > li .btn .txt i { position: absolute; top: 0; left: 0; font-weight: 400; font-size: 18px; line-height: 35px; color: #191919; transition: all 0.3s;}
.header .member_list_area > .list > li .btn:hover .txt,
.header .member_list_area > .list > li .btn:focus .txt,
.header .member_list_area > .list > li .btn:hover .txt i,
.header .member_list_area > .list > li .btn:focus .txt i { font-weight: 500; color: var(--com-sub-color) !important;}
.header .member_list_area > .list > li.mypage_li { position: relative;}
.header .member_list_area > .list > li.mypage_li .mypage_btn {}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont { display: none; overflow: hidden; position: absolute; top: 37px; left: 50%; transform: translateX(-50%); width: 168px; background-color: #ffffff; border-radius: 15px; box-shadow: 2px 3px 7px 0px rgba(0, 0, 0, 0.35); z-index: 111;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_info_area { background-color: var(--com-main-color); text-align: center;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_info_area .txt { font-weight: 400; font-size: 14px; line-height: 43px; color: #ffffff;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_info_area .txt .ft_b { display: inline-block; font-weight: 700;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_list_area { border-top: 1px solid #e5e5e5; padding: 5px 0;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_list_area > .list {}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_list_area > .list > li { padding: 5px 15px;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_list_area > .list > li:last-child { border-bottom: none;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_list_area > .list > li .link { position: relative; display: block; padding: 0 0 0 10px; font-weight: 400; font-size: 14px; line-height: 21px; color: #191919; word-break: break-all; transition: all 0.3s;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_list_area > .list > li .link::before { content: ''; position: absolute; top: 9px; left: 0;  width: 3px; height: 3px; background-color: #202020; border-radius: 50%;}
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_list_area > .list > li .link:hover,
.header .member_list_area > .list > li.mypage_li > .menu_list_cont .menu_list_area > .list > li .link:focus { font-weight: 700; color: var(--com-main-color);}
/* 공통 헤더 마이페이지 관련 */

/* pc bg */
.header .gnb_bg {display: none; position: absolute; left:0; display: none; width: 100%; background-color: #ffffff; background-image: url('/images/home/eng/user/header/gnb_bg_icon.png'); background-position: left bottom; background-repeat: no-repeat; box-shadow: 0 5px 10px rgba(211, 211, 211, 0.5); z-index: 2;}

/* m_gnb */
.header .m_gnb_wrap {display:none; position:fixed; right:-90%; top:0; overflow-y: auto; width: 90%; height:100%; background-color: #ffffff; z-index:999;}
.header .m_gnb_wrap .m_gnb_inner { width: 100%; height:100%; background-color: #ffffff;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb_top {position:relative; height: 70px; border-bottom: 1px solid #e0e0e0 ; padding: 0 0 0 20px;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb_top .container { display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 0; height: 100%;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb_top .container .member_list_area {}
.header .m_gnb_wrap .m_gnb_inner .m_gnb_top .container .member_list_area > .list > li.mypage_li > .menu_list_cont { left: 0; transform: inherit;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb_top .container .m_gnb_close {width: 70px; height: 70px; background-image: url('/images/home/eng/user/header/sitemap_close_icon_on.png'); background-color: var(--com-main-color); background-position: center; background-size: 28px auto; background-repeat: no-repeat;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb {}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list {}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li {border-bottom: 1px solid #e0e0e0;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li.m_atv {}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li > a {display: block; position: relative; padding: 0 20px; transition: all 0.3s;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li.m_atv > a {}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li > a .text {display: block; font-weight: 400; font-size: 22px; line-height: 65px; color: #282828;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li .sub_gnb_area {display: none; background-color: #fff3fd;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li .sub_gnb_area .m_sub_gnb { padding: 20px 0;}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li .sub_gnb_area .m_sub_gnb > li {}
.header .m_gnb_wrap .m_gnb_inner .m_gnb .item_list > li .sub_gnb_area .m_sub_gnb > li > a {display: block; position: relative; padding: 0 20px; font-weight: 400; font-size: 18px; line-height: 40px; color: #282828;}
/* mo bg */
.header .m_gnb_bg {display: none; position: fixed; top: 0; right: 0; bottom: 0; left:0; width: 100%; height: 100vh; background-color: #000000; z-index: 111;}

/* scrolled & on */
.header.scrolled {}
.header.scrolled .gnb_header {position:fixed; top:0; z-index:3; width:100%; box-shadow:0 2px 5px rgba(211,211,211,0.5);}
.header.on .header_inner .gnb_cont_area,
.header.scrolled .header_inner .gnb_cont_area {border-bottom: 1px solid #efefef; background-color: #ffffff;}

/* sitemap (10/10) */
.sitemap_wrap {display: none; position: fixed; left: 0; top: 0; right: 0; bottom: 0; padding: 0 0 0 580px; background-color: #ffffff; z-index: 9999; overflow: auto;}
.sitemap_wrap:before {content: ''; position: fixed; top: 0; left: 0; width: 100%; max-width: 580px; height: 100%; background-image: url('/images/home/eng/user/header/sitemap_bg.png'); background-position: left top; background-size: cover; background-repeat: no-repeat;}
.sitemap_wrap .logo_area {position:fixed; top: 0; left: 0; width: 100%; max-width: 580px; transform: translateY(-10%); text-align: right; opacity: 0; visibility: hidden; transition: all 0.3s ease-in;}
.sitemap_wrap.on .logo_area { transform: translateY(0); opacity: 1; visibility: visible;}
.sitemap_wrap .logo_area .logo_cont {display: inline-block; width: 100%; max-width: 345px; padding: 200px 0 0; text-align: left;}
.sitemap_wrap .logo_area .logo_cont img {}
.sitemap_wrap > .container {max-width: 100%; padding: 200px 60px 60px 60px;}
.sitemap_wrap > .container .sitemap {width: 100%; max-width: 990px; position: relative;}
.sitemap_wrap > .container .sitemap > li {margin: 0 0 60px 0;}
.sitemap_wrap > .container .sitemap > li:last-child {margin: 0;}
.sitemap_wrap > .container .sitemap > li > a {display: block; position: relative; transform: translateX(-5%); margin: 0 0 20px; opacity: 0; visibility: hidden; transition: all 0.3s ease-in; transition-delay: 0.3s;}
.sitemap_wrap.on > .container .sitemap > li > a {transform: translateX(0); opacity: 1; visibility: visible;}
.sitemap_wrap > .container .sitemap > li > a::before { content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 100%; height: 1px; background-color: #f0f0f0;}
.sitemap_wrap > .container .sitemap > li > a .text {display: inline-block; position: relative; padding: 0 20px 0 0; background-color: #ffffff; font-weight: 700; font-size: 30px; line-height: 45px; color: #282828;}
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area { display: block !important; height: inherit !important; margin: inherit !important; padding: inherit !important; transform: translateX(-5%); opacity: 0; visibility: hidden; transition: all 0.3s ease-in; transition-delay: 0.6s;}
.sitemap_wrap.on > .container .sitemap > li > .sub_gnb_area { transform: translateX(0); opacity: 1; visibility: visible;}
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area .sitemap_sub_gnb { font-size: 0;}
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li {display: inline-block; width: calc(25% - 15px); margin: 20px 20px 0 0; padding: 0; vertical-align: top;}
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:nth-child(-n+4) {margin: 0 20px 0 0;}
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:nth-child(4n) {margin: 20px 0 0 0;}
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li:nth-child(4) {margin: 0;}
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > a {display: flex; justify-content: center; align-items: center; height: 63px; background-color: #f4f4f4; font-weight: 500; font-size: 19px; line-height: 23px; color: #282828; text-align: center; transition: all 0.3s;}
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > a:hover,
.sitemap_wrap > .container .sitemap > li > .sub_gnb_area .sitemap_sub_gnb > li > a:focus { background-color: var(--com-main-color); color: #ffffff;}
.sitemap_wrap > .container .sitemap_close {position: absolute; top: 60px; right: 130px; width: 31px; height: 31px; -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 > .container .sitemap_close:hover, .sitemap_wrap .sitemap_close:focus {transform: rotate(180deg);}
/*===================== header =====================*/