@charset "utf-8";

@import "reset_cache.css";
@import "module_cache.css";
@import "company_cache.css";

/* Common Layout */
.body_wrap { position: relative; min-width: @body_width@px;}

.wrapper { position: relative; width: 100%; min-width: @body_width@px;}
.wrapper > div { position: relative; max-width: @wrap_width@px; margin: 0 auto; padding: 0 @wrap_margin_left_right@px;}
.wrapper > div:after { content: ""; display: block; clear: both;}

/*
.col_headline { padding: 0 0 40px;}
.line_box { border-top: 2px solid #222; padding: 40px 0;}
.line_box .comlay { background: url(../bg/bg_line_cen.png) repeat-y 66.8% 0;}
.line_box > .col03 { background: url(../bg/bg_line_col03.png) repeat-y 26px 0;}
*/

/* 상단 네비게이션 */
.top_util { font-size: 13px; background: #f5f5f5; font-family: 'NanumSquareRound', sans-serif;}
.top_util ul:after { content: ""; display: block; clear: both;}
.top_util ul li { float: left;}

.top_util .tn_left { float: left;}
.top_util .tn_left:after { content: ""; display: block; clear: both;}
.top_util .tn_left li { position: relative; padding-left: 6px; margin-left: 6px;}
.top_util .tn_left li:first-child { background: none; padding-left: 0; margin-left: 0;}
.top_util .tn_left li a { position: relative; display: block; height: 40px; line-height: 39px; padding-left: 21px;}
.top_util .tn_left li a:after { position: absolute; left: 0; top: 50%; content: ""; display: block; width: 15px; height: 14px; margin-top: -8px;}
.top_util .tn_left li a.tl01:after { background: url(../icon/icon_tl01.png) no-repeat 0 0;}
.top_util .tn_left li a.tl02:after { background: url(../icon/icon_tl02.png) no-repeat 0 0;}
.top_util .tn_left li a:hover { text-decoration: underline;}

.top_util .tn_right { float: right;}
.top_util .tn_right:after { content: ""; display: block; clear: both;}
.top_util .tn_right li { position: relative; padding-left: 8px; margin-left: 9px;}
.top_util .tn_right li:after { position: absolute; left: -2px; top: 50%; margin-top: -2px; content: ""; display: block; width: 3px; height: 3px; background: #b2b2b9; border-radius: 50%;}
.top_util .tn_right li:first-child:after { display: none;}
.top_util .tn_right li a { display: block; height: 40px; line-height: 39px;}
.top_util .tn_right li a:hover { text-decoration: underline;}

/* 날짜 */
.today_txt { float: left; font-size: 15px; text-align: right; color: #222; margin-bottom: -3px; font-size: 11px; margin: 9px 4px 0 7px;}

/* Header */
.head_top { position: sticky; top: 0; border-bottom: 1px solid @border_main_color@; background: #fff; z-index: 999; font-family: 'NanumSquareRound', sans-serif;}
.head_top > div { position: static;}
.head_top > div h1 { position: relative; float: left; display: table; margin-right: 30px; z-index: 2;}
.head_top > div h1 b { display: table-cell; height: 73px; padding-bottom: 7px; vertical-align: middle; text-align: left;}

#gnb { text-align: center; height: 80px; margin-bottom: -3px;}
#gnb:after { content: ""; display: block; clear: both;}
#gnb > li { float: left; display: block;}
#gnb > li > a { position: relative; display: block; height: 83px; line-height: 83px; font-size: 19px; padding: 0 20px; color: #000; font-weight: bold; margin-right: -1px; z-index: 1;}
#gnb > li > a > span { position: relative; display: block;}
#gnb > li > a.on, #gnb > li > a.active { color: @main_color@;}

.gnb_depth { position: absolute; left: 0; top: 83px; background: #fff; width: 100%; border-top: 1px solid @border_main_color@; border-bottom: 1px solid @border_main_color@; box-shadow: 0 3px 6px rgba(0,0,0,.15); z-index: 510; text-align: left;}
.gnb_depth > div { position: relative; width:@wrap_width@px; margin:0 auto;}
.gnb_depth > a { display: block; width: 100%;}

.gnb_depth .gnb_con_wrap { position: relative; padding: 0 0 25px;}
.gnb_depth .gnb_con_wrap h2 { position: absolute; left: 0; top: 26px; font-size: 22px; color: #24262a; padding: 0 20px; width: 110px;}

.gnb_depth .gnb_con_wrap > div { position: relative; display: flex; flex-wrap: wrap;}
.gnb_depth .gnb_con_wrap > div > div { width: 25%;}

.gnb_depth .depth_nav { position: relative;}
.gnb_depth .depth_nav ul { position: relative; /* border-left: 1px solid #e2e2e2; */ margin-top: 25px;}
.gnb_depth .depth_nav > div:first-child ul { border: 0;}
.gnb_depth .depth_nav ul > li { position: relative;}
.gnb_depth .depth_nav ul > li > a { display: block; font-weight: bold; padding: 5px 0 8px; font-size: 16px; color: #333; font-weight: bold; transition: all .3s ease;}
.gnb_depth .depth_nav ul > li > a:hover, .depth_nav ul > li > a.active, .depth_nav ul > li > a.on { color: @main_color@; transform: translateX(1px);}
.gnb_depth .sub_tit a { color: @main_color@ !important; font-size: 18px !important;}

.head_cen { position: relative; background: #e8e8ec; border-top: 2px solid #fff;}
.head_cen > div:after { content: ""; display: block; clear: both;}

.head_cen .hb_left { float: left;}
.head_cen .hb_left:after { content: ""; display: block; clear: both;}
.head_cen .hb_right { float: right;}
.head_cen .hb_right:after { content: ""; display: block; clear: both;}

.top_util .today { float: left; font-size: 15px; font-weight: bold; color: #333; padding-top: 12px; margin-right: 25px;}
.top_util .weather { float: left; padding-top: 5px;}
.head_cen .hb_left .head_skin { position: relative; float: left; width: 510px; background: #d5d5da; height: 48px; margin-left: -60px;}
.head_cen .hb_left .head_skin .arl_077 .recent_art { background: transparent;}
.head_cen .hb_left .edit_top { position: absolute !important; width: 100%; top: -16px;}

.top_util .sns_link { float: left; margin-top: 5px; margin-right: 10px;}
.top_util .sns_link:after { content: ""; display: block; clear: both;}
.top_util .sns_link > li { float: left; margin-right: 3px;}
.top_util .sns_link > li > a { display: block; width: 30px; height: 30px; background: url(../btn/btn_sns.png) no-repeat 0 0; text-indent: -9999em;}
.top_util .sns_link > li > a.sl01 { background-position: 0 0;}
.top_util .sns_link > li > a.sl02 { background-position: -30px 0;}
.top_util .sns_link > li > a.sl03 { background-position: -60px 0;}
.top_util .sns_link > li > a.sl04 { background-position: -90px 0;}
.top_util .sns_link > li > a.sl05 { background-position: -120px 0;}
.top_util .sns_link > li > a:hover { background-position-y: -30px;}

.head_link { display: flex; position: absolute; right: 60px; top: -43px; z-index: 502; font-family: 'NanumSquareRound', sans-serif;}
.head_link li { margin-left: 15px;}
.head_link li a { font-size: 17px; font-weight: bold; color: #5e84a7;}
.head_link li a:hover { color: @main_color@;}

/* Search */
.hidden_p { overflow: hidden;}

.btn_all_search { position: absolute; top: -50px; right: 0; display: block; width: 30px; height: 30px; text-indent: -9999px; background: url(../btn/btn_search.png?210805) no-repeat center center; z-index: 501; transition: background-color .3s ease; margin-left: 15px;}
.btn_all_search:hover { opacity: .85;}

.search_box { position: fixed; left: 0; top: 0; width: 100%; height: 100%; min-width: @body_width@px; background: rgba(0,0,0,.75); z-index: 3000000010; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);}

.search_con { display: table; width: 100%; height: 100%;}
.search_con > div { display: table-cell; width: 100%; height: 100%; vertical-align: middle; position: relative;}
.search_con > div:after { content: ""; display: block; clear: both;}

.btn_all_search_close { position: absolute; right: 30px; top: 20px; display: block; width: 50px; height: 50px; text-indent: -9999px; background: url(../btn/btn_search_collap_w.png) no-repeat -50px 0; z-index: 130;}

.search_in { position: relative; width: 700px; margin: 0 auto;}
.search_in label { display: block; text-align: center; font-family: 'NanumSquareRound', sans-serif; font-size: 24px; color: #fff; margin-bottom: 20px; letter-spacing: 0;}
.search_in input { border: 5px solid #fff; font-size: 18px; padding: 20px 20px 19px; width: 600px; background: transparent; color: #fff; font-family: 'NanumSquareRound', sans-serif; letter-spacing: 0;}
.search_in .btn_search { position: absolute; right: 0; bottom: 0; width: 65px; height: 65px; background: #fff url(../btn/btn_search.png) no-repeat center center; text-indent: -9999px;}

/* Footer */
#footer { background: #f5f5f5; font-family: 'NanumSquareRound', sans-serif;}
#footer > div { max-width: @wrap_width@px;}
.foot_wrap { position: relative; padding: 45px 0;}
.foot_wrap:after { content: ""; display: block; clear: both;}
.foot_wrap h6 { position: absolute; left: 0; top: 35px; margin-right: 40px; margin-top: 5px;}
.foot_wrap h6 b { display: block;}
.foot_wrap h6 p { display: block; color: #656568; margin-top: 15px; font-size: 18px;}
.foot_wrap > div { padding-left: 330px;}

.foot_flex { display: flex;}
.foot_flex > div { margin-right: 80px;}

.foot_con, .foot_con a { color: #656568;}
.foot_con .foot_link { position: relative;}
.foot_con .foot_link:after { content: ""; display: block; clear: both;}
.foot_con .foot_link li { margin-bottom: 7px; font-size: 13px;}
.foot_con .foot_link li:first-child { background: none; padding-left: 0; margin-left: 0;}
.foot_con .foot_link li a { display: block; height: 16px; line-height: 14px; font-size: 12px;}
.foot_con .foot_link li a:hover { text-decoration: underline;}
.foot_con > p { font-size: 13px; color: #656568; letter-spacing: 0; margin-top: 25px;}
.foot_con > b { position: absolute; right: 0; bottom: 42px;}
.foot_con .btn_inc { position: absolute; right: 0; bottom: 65px;}

.icon_mail { display: block; height: 16px; line-height: 14px; font-size: 13px; padding-left: 18px; background: url(../icon/icon_tail_mail_b.png) no-repeat 0 1px; letter-spacing: 0;}
.icon_tel { display: block; height: 16px; line-height: 14px; font-size: 13px; padding-left: 18px; background: url(../icon/icon_tail_tel_b.png) no-repeat 1px 2px; letter-spacing: 0;}
.icon_address { display: block; height: 16px; line-height: 14px; font-size: 13px; padding-left: 18px; background: url(../icon/icon_tail_address_b.png) no-repeat 0 0; letter-spacing: 0;}

.contact_txt { margin-top: 17px;}
.contact_txt:after { content: ""; display: block; clear: both;}
.contact_txt > li { float: left; margin-right: 14px; margin-bottom: 7px;}
.contact_txt > li a:hover { text-decoration: underline;}

/* Content */
#container { position: relative;}
#container > div { padding: 35px 0 70px;}

.main_con { padding: 45px 0;}
.main_con.bg_gray { background: #333;}

.page_tit { position:relative; font-size: 26px; padding-bottom: 17px; line-height: 1.2; margin-left: -2px; border-bottom: 1px solid @border_main_color@; margin-bottom: 20px;}

.btn_mobile { position: relative; text-align: center; padding: 15px 0;}
.sublay { background: url(../bg/bg_linewrap.png) repeat-y 800px 0;}
.aside_box { position: relative; padding-left: 60px; padding-bottom: 65px;}

.scroll-in01, .scroll-in02 { z-index: 10;}

.arv_008 .fix_art_top.fix { top: 83px !important;}