@charset "utf-8";

/* 2024-05-30 추가 */
@keyframes slide-modal-close {
	to {visibility:hidden; opacity:0;}
}

body .loading {position:fixed; width:100%; height:100%; background-color:#fff; visibility:visible; opacity:.8; left:0; top:0; z-index:99;}
body.load .loading {animation:slide-modal-close .5s forwards;}
body .box-loading {position:relative; display:inline-block; left:50%; top:50%; transform:translate(-50%, -50%);}

/* 2022-12-27 추가 */
.btn, button, a {transition:all 0.2s ease; font:inherit;}

/* input */
::placeholder {color:#777;}

input[type="text"], input[type="password"], select {border:1px solid #ddd; font-size:13px; padding:11px 15px; color:#777;}
select {padding:11px 35px 11px 15px; background:url('../img/common/ico_sel_arrow.png') #fff no-repeat center right 15px; background-size:7px 5px;}
select:focus {border:1px solid #024788;}
input[type="text"]:focus {border:1px solid #024788;}

input[type="checkbox"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(0 0 0 0); border:0;}
input[type="checkbox"] + label {position:relative; display:inline-block; padding-left:37px; line-height:27px; height:27px; vertical-align:middle; font-family:'nanum-square-r'; font-size:14px; color:#333; cursor:pointer;}
input[type="checkbox"] + label:before {content:""; display:inline-block; position:absolute; left:0; top:0; width:27px; height:27px; background:url('../img/common/ico_check_off.png') center no-repeat;}
input[type="checkbox"]:checked + label:before {background-image:url('../img/common/ico_check_on.png');}
input[type="checkbox"]:focus + label {position:relative; outline:#666 dotted 1px; z-index:2;}

input[type="checkbox"] + label.check-back {padding-right:37px; padding-left:0; font-family:'nanum-square-b';}
input[type="checkbox"] + label.check-back.pd-0 {padding-right:27px;}
input[type="checkbox"] + label.check-back:before {display:none;}
input[type="checkbox"] + label.check-back:after {content:""; display:inline-block; position:absolute; right:0; top:0; width:27px; height:27px; background:url('../img/common/ico_check2_off.png') center no-repeat;}
input[type="checkbox"]:checked + label.check-back:after {background-image:url('../img/common/ico_check2_on.png');}

input[type="radio"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(0 0 0 0); border:0;}
input[type="radio"] + label {position:relative; display:inline-block; padding-left:36px; line-height:26px; height:26px; vertical-align:middle; font-family:'nanum-square-r'; font-size:14px; color:#333; cursor:pointer;}
input[type="radio"]:checked + label {color:#014788;}
input[type="radio"] + label:before {content:""; display:inline-block; position:absolute; left:0; top:0; width:26px; height:26px; background:url('../img/common/ico_radio_off.png') center no-repeat;}
input[type="radio"]:checked + label:before {background-image:url('../img/common/ico_radio_on.png');}
input[type="radio"]:focus + label {position:relative; outline:#666 dotted 1px; z-index:2;}

input[type="file"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(0 0 0 0); border:0;}
input[type="file"]:focus + label {outline:#666 dotted 1px;}

textarea {border:1px solid #e7e7e7; padding:11px 15px; font-size:14px; color:#777; outline:0;}
textarea:focus {border-color:#014788;}

/* button */
.btn {display:inline-block; text-align:center; cursor:pointer; user-select:none; background-color:transparent; border:1px solid transparent; padding:11px 15px; transition:all 0.2s ease-in-out;}
.btn:disabled {background-color:#838383; pointer-events:none;}
.btn_blue {position:relative; background-color:#014788; color:#fff; font-size:14px;}
.btn_red {position:relative; background-color:#bf3f3f; color:#fff; font-size:14px;}
.btn_blue:hover, .btn_blue:focus {background-color:#00396e;}
.btn_red:hover, .btn_red:focus {background-color:#bd2121;}
.btn_black {font-size:14px; color:#fff; background-color:#222;}
.btn_black:hover, .btn_black:focus {background-color:#111;}
.btn_dgray {font-size:14px; color:#fff; background-color:#555555;}
.btn_dgray:hover, .btn_dgray:focus {background-color:#333;}
.btn_blue_outline {color:#014788 !important; border:1px solid #014788 !important; background-color:#fff !important;}
.btn_blue_outline:hover, .btn_blue_outline:focus {background-color:#e0f0ff !important;}
.btn_red_outline {color:#bf3f3f !important; border:1px solid #bf3f3f !important; background-color:#fff !important;}
.btn_red_outline:hover, .btn_red_outline:focus {background-color:#ffeded !important;}
.btn_black_outline {color:#222222 !important; border:1px solid #222222 !important; background-color:#fff !important;}
.btn_black_outline:hover, .btn_black_outline:focus {background-color:#e9e9e9 !important;}

.btn_blue.saveReq::before, .btn_blue.saveReq::after {content:' '; position:absolute; top:0; left:0; right:0; bottom:0;}
.btn_blue.saveReq::before{background:#fff;}
.btn_blue.saveReq::after{background:url('http://localhost/resources/images/cms/ajax-loader.gif') no-repeat center center;}

.pro_info .btn_blue {background-color:#3163e1;}
.pro_info .btn_blue:hover, #buyingUrls .btn_blue.blue2:focus {background-color:#1c49bb;}
.pro_info .btn_blue_outline {border:1px solid #3163e1 !important;}
.pro_info .btn_blue_outline:hover, .pro_info .btn_blue_outline:focus {color:#000 !important; border-color:#000 !important;}
.btn_group {display:flex; flex-wrap:wrap; justify-content:center; gap:5px;}
.btn_group > * {width:188px; height:50px; font-size:14px;}

/* 2022-09-14 버튼 속성 추가 */
.sub_contents2022 .btn_group.atr, .info_wrap .btn_group.atr {position:absolute; top:0; right:0;}
.sub_contents2022 .btn_group .btn, .info_wrap .btn_group .btn {color:#fff; width:auto; padding:0 20px;}
.btn_exel {background-color:#066302; color:#fff;}
.btn_exel:hover, .btn_group .btn.btn_exel:focus {background-color:#023100;}

.sub_contents2022 .btn_in_conts {padding:2px 10px 3px; background-color:#3163e1; color:#fff; font-size:14px; border-radius:3px;}

/* popup */
.popup_layer {display:flex; justify-content:center; align-items:center; visibility:hidden; opacity:0; position:fixed; top:0; left:0; width:100vw; height:100vh; z-index:15;}
.popup_layer.show {opacity:1; visibility:visible; animation:fadeIn 0.2s forwards;}
.popup_layer .popup_bg {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.5);}
.popup_layer .popup_inner {position:relative; max-width:90%; background-color:#fff; z-index:10;}
.popup_inner h2 {text-align:left; font-family:'nanum-square-eb'; color:#fff; font-size:20px; padding:25px 15px; background-color:#014788;}
.popup_inner .popup_con {overflow-y:auto; max-height:calc(95vh - 80px); text-align:left; padding:30px 40px; font-family:'nanum-square-r';}
.popup_inner .btn_close {position:absolute; width:35px; height:36px; top:1rem; right:1rem; font-size:0;}
.popup_inner .btn_close:before, .popup_inner .btn_close:after {position:absolute; top:0; left:50%; display:block; content:''; width:1px; height:35px; background-color:#fff; transform:translateX(-50%) rotate(-45deg);}
.popup_inner .btn_close:after {transform:rotate(45deg);}
.popup_inner .search_area {margin:0 0 25px 0; padding:25px; text-align:center; background:#f6f7fb;}
.popup_inner .pagination {margin-bottom:0;}
.popup_inner .tbl_per th button, .popup_inner .tbl_per td button {padding:4px 8px;}
.popup_layer.popup_sm .popup_inner {max-width:500px;}
.popup_layer.popup_md .popup_inner {max-width:700px;}
.popup_layer.popup_lg .popup_inner {max-width:1000px;}

/* 업로드 실패 내역 팝업*/
.popup_layer.popup_layer_result .popup_inner .popup_con {height:600px;}

/* InfoNavi */
#skip-navi-info {font-size:0; color:#fff; text-indent:-99999px;}

/* SkipNavi */
#skip-navi {height:0;}
#skip-navi a {position:absolute; top:-9999px; z-index:20000; width:100%; height:30px; background-color:#000; color:#fff; font-weight:600; text-align:center; line-height:30px; opacity:0.6;}
#skip-navi a:hover, #skip-navi a:focus, #skip-navi a:active {top:0; color:#fff;}

/* wrap */
.inner {position:relative; max-width:1360px; margin:0 auto;}

/* Header - tnb *****/
header {position:relative; background-color:#fff;}
.tnb {position:relative; background-color:#fff; z-index:10;}
.tnb .tnb_bottom .inner {padding:20px 0; display:flex; align-items:center; justify-content:space-between;}
.tnb .tnb_bottom .inner h1 > a {max-height:52px;}

/* 로그인 영역 */
.tnb_top {position:relative; border-bottom:1px solid #e5e5e5; padding:7px 0;}
.tnb_top .mem_menu {display:flex; justify-content:flex-end;}
.tnb_top .mem_menu li a {font-size:14px; margin-left:29px; position:relative;}
.tnb_top .mem_menu li a::after {content:''; width:1px; height:9px; background:#999; position:absolute; top:calc(50% - 4px); right:-16px;}
.tnb_top .mem_menu li:last-child a::after {display:none;}

/* 타임세션 */
.tnb .time_session {display:flex; font-size:15px; justify-content:end; margin-top:4px; color:#555;}
.tnb .time_session span {margin-right:21px; position:relative;}
.tnb .time_session span::after {content:''; width:1px; height:12px; background:#999; position:absolute; top:calc(50% - 6px); right:-10px; transform:rotate(30deg);}
.tnb .time_session strong {margin:0 8px 0 4px; color:#f00;}
.tnb .time_session > a {padding:0px 12px; color:#fff; background:#ff5959; border-radius:25px; font-size:14px;}
.tnb_search_wrap {display:flex; gap:10px;}
.tnb_search_group.on {position:absolute; top:75px; right:0; overflow:hidden; z-index:10;}
.tnb_search_group.on .tnb_search {display:block; position:relative; z-index:10; padding:20px; background-color:#fff; border:2px solid #15416f;}
.tnb_search_group.on .tnb_search .search {position:relative; display:inline-block; vertical-align:middle;}
.tnb_search label {position:absolute; width:80px; height:42px; line-height:40px; background:#15416f; font-size:14px; color:#fff; text-align:center; border-radius:25px; box-shadow:2px 0px 3px 0px rgb(0 0 0 / 30%);}
.tnb_search input[type="text"] {height:42px; padding:11px 40px 11px 15px; font-size:15px; border:1px solid #ccc; border-radius:25px; box-sizing:border-box;}
.tnb_search input[type="text"]:hover, #header .tnb_search input[type="text"]:focus, #header .tnb_search input[type="text"]:active {border-color:#0c82e9; background:#eef3fd; transition:all .2s; outline:none;}
.tnb_search input[type="text"]:hover ~ button, #header .tnb_search input[type="text"]:focus ~ button, #header .tnb_search input[type="text"]:active ~ button {background-position-y:-42px;}
.tnb_search_btn {position:relative; width:42px; height:42px; background:#e6ecfb; font-size:0; border:none; border-radius:25px; box-sizing:border-box;}
.tnb_search_btn::after {content:''; width:42px; height:42px; overflow:hidden; position:absolute; top:0; right:0; background:url(../img/common/2022_icon_common.png) no-repeat 0 0;}
.tnb_search_group.on .tnb_search input[type="text"] {width:280px;}
.tnb_search_group.on .btn_Search {right:8px;}
.tnb_search {display:none;}
.tnb_search_group.on .btn_Close {display:inline-block; width:40px; height:42px; background:url(../img/common/2022_icon_common.png) no-repeat -80px 0 !important; font-size:0; line-height:0; color:transparent; transition:none !important; vertical-align:middle;}
.btn_Search {width:40px; height:42px; overflow:hidden; position:absolute; top:0; right:8px; background:url(../img/common/2022_icon_common.png) no-repeat 0 0;}
.btn_srch {width:40px; height:40px; overflow:hidden; position:absolute; top:0; right:5px; background:url(../img/common/2022_icon_common.png) no-repeat 0 0; font-size:0;}
.btn_mobile {overflow:hidden; display:none; vertical-align:middle;}
.btn_mobile button {overflow:hidden; font-size:0; width:40px; height:42px; margin-left:5px; background:url(../img/common/2022_icon_common.png) no-repeat 0 0;}
.btn_mobile .btn_m_menu {background-position-x:-40px;}
.btn_mgnb {display:none;}

/* Header - GNB *******/
.gnb {background-color:#eff2fa; font-size:18px;}
.gnb .inner {display:flex; align-items:center; justify-content:space-between;}

/* 상품 카테고리 */
.tnb .category {display:none;}
.category {position:absolute; top:-10px; z-index:1;}
.category .btn_category {width:183px; padding:22px 20px 10px 56px; font-size:17px; font-weight:500; background:#15416f; color:#fff; position:relative; border-radius:10px; font-family:'G-Market-Sans'; box-shadow:5px 5px 10px rgba(0, 0, 0, .15);}
.category .btn_category:before {content:""; display:inline-block; width:14px; height:14px; position:absolute; top:26px; left:34px; background:url(../img/common/2022_main_categorimenu.png) 0 0 no-repeat; transition:all 0.5s linear;}
.category .btn_category:hover::before {transform:rotateY(360deg);}
.category .snb {position:absolute; top:53px; left:0; width:183px; height:455px; background-color:#fff; z-index:20; display:none; font-size:15px; font-family:'NotoSans'; border:2px solid #014788; border-radius:10px;}
.category .snb.is-active {display:block;}
.category .snb > *:not(ul) {background-color:#fff; position:relative; border-bottom:1px solid #ddd; height:50px; line-height:50px; padding:0px 30px;}
.category .snb .depth1 li {position:relative;}
.category .snb .depth1 li * {transition:all 0.2s ease-out; white-space:nowrap;}
.category .snb .depth1 li a {display:block; padding:2px 10px; font-size:15px;}
.category .snb .depth1 li a:hover {background:#006ae2; color:#fff;}
.category .snb .depth1 ul {position:absolute; top:4px; left:calc(100% - 30px); min-width:200px; background-color:#fff; opacity:0; visibility:hidden; z-index:-1; border:2px solid #014788; padding:10px 0; border-radius:10px;}
.category .snb .depth2 ul {top:16px; left:calc(100% - 50px); background-color:#fff; border-radius:10px;}
.category .snb .depth1 li:hover > ul, .category .snb ul.is-show {visibility:visible; opacity:1; z-index:5;}
.category .snb .depth1 li:hover > a, .category .snb li > a.on {background:#006ae2; color:#fff;}
.category .snb .depth2 li a {padding:8px 20px;}
.main .category .snb.on, .category .snb.on {display:block;}

/* 주메뉴 */
.main_menu {display:flex; align-items:center;}
.main_menu li {position:relative;}
.main_menu > li {padding:10px 12px;}
.main_menu > li > a {display:block; height:100%; padding:4px 10px 0 10px; font-size:16px; font-weight:500; color:#333; font-family:'G-Market-Sans';}
.main_menu > li > a:after {top:calc(100% - 15px);}
.main_menu > li > ul {transition:all 0.2s ease-out; opacity:0; visibility:hidden; position:absolute; left:-3px; top:53px; min-width:250px; background-color:#fff; border:2px solid #014788; padding:8px 24px; z-index:9;}
.main_menu > li > ul a {position:relative; display:inline-block; color:#555; font-size:16px; padding:10px 0;}
.main_menu > li > ul a:after {content:''; width:0; position:absolute; bottom:4px; left:0; border-bottom:1px solid #014788; transition:all 0.2s ease-out;}
.main_menu > li > ul a:hover:after, .tnb .main_menu > li > ul a:focus:after, .tnb .main_menu > li > ul a:active:after {width:100%;}
.main_menu > li:hover ul, .tnb .main_menu > li > ul.is-show {opacity:1; visibility:visible;}
.btn_Search {width:40px; height:42px; overflow:hidden; position:absolute; top:0; right:8px; background:url(../img/common/2022_icon_common.png) no-repeat 0 0;}
.btn_Search:before {content:''; display:inline-block; width:17px; height:22px; margin:2px 8px 0 0; vertical-align:top;}
.btn_Search.detail, .btn_Search.map {display:none;}
.btn_Search.map:before {background:url(../img/common/2022_icon_wrap.png) no-repeat 0 -25px; transition:all 0.5s linear;}
.btn_Search.detail:before {background :url(../img/common/2022_icon_wrap.png) no-repeat 0 0; transition:all 0.5s linear;}
.btn_Sitemap {position:relative; width:120px; height:40px; background:#15416f; border-radius:50px;}
.btn_Sitemap::after {background:url(../img/common/2022_icon_wrap.png) no-repeat 0 -25px; transition:all 0.5s linear;}
.btn_Sitemap span {color:#fff; font-family:'G-Market-Sans'; font-weight:bold;}
.map:hover::before {transform:rotateY(360deg);}

.main_tabs {width:800px; display:flex; height:57px; background-color:#fff; margin:35px auto; border-radius:30px; box-sizing:border-box; box-shadow:5px 5px 10px #ccc;}
.main_tabs li {width:50%; text-align:center; font-weight:500; font-size:20px; height:57px; line-height:59px; border-radius:30px; background-color:transparent;}
.main_tabs li:nth-of-type(1).act {background-color:#e46f10; transition:all 0.3s;}
.main_tabs li:nth-of-type(2).act {background-color:#3a78ba; transition:all 0.3s;}
.main_tabs li:nth-of-type(3).act {background-color:#1fa1a6; transition:all 0.3s;}
.main_tabs li:nth-of-type(4).act {background-color:#4f4ba7; transition:all 0.3s;}
.main_tabs li.act a {color:#fff;}
.main_tabs li a {width:100%; height:100%; background-color:transparent; font-family:'G-Market-Sans'; color:#545964; font-weight:500;}
.main_tab_cont {position:relative; display:none; flex-wrap:wrap; gap:27px;}
.main_tab_cont.act {display:flex;}
.visual_r_conts {width:25%; display:flex; flex-direction:column; gap:25px;}
.visual_r_conts .go {width:100%; height:175px; position:relative; padding:30px; border-radius:10px; box-shadow:5px 5px 10px #ccc;}
.visual_r_conts .go::after {content:''; display:block; width:112px; height:112px; position:absolute; top:50px; left:calc(65% - 10px); background:url(../img/main/2024_icon_fav.png) no-repeat 0 0;}
.visual_r_conts .go h2 {padding-bottom:10px; font-size:26px; font-weight:500; color:#fff; font-family:'G-Market-Sans'; line-height:1.2;}
.visual_r_conts .go h2 > p {font-size:26px; font-weight:900; color:#fff; font-family:'G-Market-Sans';}
.visual_r_conts .go a {position:relative; display:inline-block; padding:6px 20px; color:#fff; border-radius:20px; background-color:rgba(0, 0, 0.5, 0.3); font-size:15px; transition:all 0.2s ease-out;}
.visual_r_conts .go a:hover {background-color:rgb(255, 255, 255, 0.2); font-weight:900;}
.visual_r_conts .go a::after {content:''; width:15px; height:15px; position:absolute; top:11px; left:14px; background:url(../img/common/go.png) no-repeat 0 0;}
.visual_r_conts .go a span {margin-left:15px;}
.visual_r_conts .product_srch {background:#e46f10;}
.visual_r_conts .product_srch::after {background-position:0 -112px;}
.visual_r_conts .map_wrap {background-color:#bf5906;}
.visual_r_conts .map_wrap::after {background-position:-112px -112px;}
.visual_r_conts .result_srch {background-color:#3a78ba;}
.visual_r_conts .result_srch::after {background-position:-224px -112px;}
.visual_r_conts .result_state {background-color:#15416f;}
.visual_r_conts .result_state::after {background-position:-336px -112px;}
.visual_r_conts .production_introduce {background-color:#1fa1a6;}
.visual_r_conts .production_introduce::after {background-position:-448px -112px;}
.visual_r_conts .production_issue {background-color:#1e787e;}
.visual_r_conts .production_issue::after {background-position:-560px -112px;}
.visual_r_conts .employment_introduce {background-color:#4f4ba7;}
.visual_r_conts .employment_introduce::after {background-position:-672px -112px;}
.visual_r_conts .employment_information {background-color:#2c2876;}
.visual_r_conts .employment_information::after {background-position:-784px -112px;}

/* Footer */
nav.fnb {width:100%; background-color:#2e3b49;}
nav.fnb .inner {display:flex; justify-content:space-between; align-items:center; max-width:1360px; height:70px;}
nav.fnb .btn_footer {display:none; height:50px; width:220px; color:#fff; padding:0 25px; text-align:left; background:#434f5b; font-size:15px; position:relative; transition:all 0.2s ease-out;}
nav.fnb .btn_footer:hover {background:#083967;}
nav.fnb .btn_footer:after {content:''; width:14px; height:8px; background:url('../img/common/2022_icon_wrap.png') no-repeat 0 -50px; transition:all 0.2s ease-out; position:absolute; right:25px; top:21px;}
nav.fnb .btn_footer.is-active:after {transform:rotate(-180deg);}
nav.fnb ul.menu {display:flex;}
nav.fnb ul.menu li:not(:last-child) {margin-right:40px;}
nav.fnb ul.menu a {position:relative; display:block; font-weight:300; color:#fff; transition:all 0.2s ease-out;}
nav.fnb ul.menu a:after {content:''; position:absolute; background-color:#fff; top:100%; left:50%; width:0; height:2px; transform:translate(-50%, 2px); transition:0.3s ease-in-out;}
nav.fnb ul.menu a:hover:after {width:100%;}
nav.fnb ul.menu a strong {color:#69baff; font-weight:400;}
nav.fnb ul.menu li.f-blue a.f-person:after {content:''; position:absolute; background-color:#222; top:100%; left:50%; width:100%; height:1px;}

nav.fnb .family {position:relative; z-index:2;}
nav.fnb .family .btn_family {height:40px; width:220px; color:#fff; padding:0 25px; text-align:left; background:#434f5b; font-size:14px; position:relative; border-radius:5px; transition:all 0.2s ease-out;}
nav.fnb .family .btn_family:hover {background:#56616b;}
nav.fnb .family .btn_family:after {content:''; width:14px; height:8px; background:url('../img/common/2022_icon_wrap.png') no-repeat 0 -50px; transition:all 0.2s ease-out; position:absolute; right:15px; top:15px;}
nav.fnb .family .btn_family.is-active:after {transform:rotate(-180deg);}
nav.fnb .family .btn_family + ul {visibility:hidden; opacity:0; position:absolute; width:100%; background:#fff; border:1px solid rgba(0, 0, 0, 0.15); bottom:100%; left:0; padding:10px; height:350px; overflow-y:scroll;}
nav.fnb .family .btn_family + ul li a {font-size:14px; display:inline-block; color:#222; transition:all 0.2s ease-out; padding:5px 0; position:relative;}
nav.fnb .family .btn_family + ul li a::after {content:''; width:0; height:1px; border-bottom:1px solid #014788; position:absolute; left:0; bottom:1px; transition:all 0.2s ease-out;}
nav.fnb .family .btn_family + ul li a:hover {color:#014788;}
nav.fnb .family .btn_family + ul li a:hover::after {width:100%;}
nav.fnb .family .btn_family.is-active + ul {visibility:visible; opacity:1; animation:fadeIn 0.3s forwards;}

.footer_info {padding:25px 0; background-color:#2e3b49; color:#fff; line-height:1.8;}
.footer_info .inner {display:flex; justify-content:space-between; align-items:flex-end; max-width:1360px;}
.footer_info .addr address {margin-top:20px; color:#9ea1aa; font-size:14px;}
.footer_info .addr address span {position:relative; display:inline-block; margin-right:30px;}
.footer_info .addr address span:not(:last-child):after {content:''; position:absolute; right:-18px; top:7px; width:1px; background:#555; height:12px; transform:rotate(30deg);}
.footer_info .foot_right {display:flex; margin-top:15px;}
.footer_info .cs {margin-right:40px;}
.footer_info .cs .cs_tit {display:flex; align-items:center;}
.footer_info .cs .cs_icon {position:relative; display:inline-block; width:58px; height:58px; background-color:#4c5d6e; border-radius:50%;}
.footer_info .cs .cs_icon span {position:absolute; top:14px; left:14px; display:inline-block; width:35px; height:32px; background:url(../img/common/f_call.png) no-repeat 0 0;}
.footer_info .cs .footer_h2 {display:inline-block; margin-left:15px; font-size:30px; font-weight:500; font-family:'G-Market-Sans';}
.footer_info .cs address {font-size:30px; color:#69baff; font-weight:500; font-weight:bold;}
.footer_info .cs address span {color:#c7cad2; font-family:'Noto-Sans'; font-size:21px;}
.footer_info .cs p {color:#c7cad2;}
.footer_info .cert {text-align:right; display:flex; align-items:flex-end; margin-top:20px;}
.footer_info .cert a {margin:0 10px;}
.footer_info .cert a:nth-child(2) img {height:35px; margin-top:10px;}

/* floating banner */
.f_banner {position:fixed; z-index:4; right:40px; bottom:50px; width:120px; height:378px; background-color:#fff; border:1px solid #ddd; padding:20px; font-size:15px; text-align:center; transition:all 0.2s ease-out;}
.f_banner h2 {font-family:'nanum-square-b'; color:#321c1c;}
.f_banner ul {margin:0 auto; padding:10px 0; border-bottom:1px dashed #ccc;}
.f_banner li {width:80px; height:80px; margin:10px 0;}
.f_banner li img {width:100%; height:100%;}
.f_banner .btn_top {font-family:'nanum-square-eb'; color:#000; width:100%; padding:10px;}
.f_banner .btn_top:after {content:''; display:inline-block; margin-left:5px; width:9px; height:9px; background:url('../img/common/ico_top.svg') center no-repeat;}
.f_banner.sub_on {top:300px; bottom:auto;}
.f_banner .top_tit {font-family:'nanum-square-b'; color:#321c1c;}

/* 필수값 */
.req_info {margin-bottom:10px; font-size:15px; color:#222; text-align:right !important;}

/* ========= Mobile ========= */
@media screen and (max-width:1360px) {
	nav.fnb .inner {height:auto; padding:15px 15px 0 15px;}
	.footer_info {padding:25px 15px;}
	#header {border-bottom:1px solid #e3e6e9; box-shadow:5px 2px 2px rgba(173, 189, 201, .14);}
	#header .btn_link {left:15px;}
	.tnb .tnb_bottom .inner {display:block; padding:20px 15px;}
	#header.on .tnb .tnb_bottom .inner {padding:0;}
	.tnb .tnb_bottom .inner:after {display:block; content:''; line-height:0; clear:both;}
	.tnb .tnb_bottom .inner h1 {float:left;}
	#header.on .tnb .tnb_bottom .inner h1 {float:none; padding:20px 15px;}
	#header.on .tnb .tnb_bottom .inner h1 a {display:inline-block;}
	.tnb .logo {width:200px;}
	.tnb_search_wrap {display:block; float:right;}
	#header.on .tnb_search_wrap {float:none;}
	.tnb_search_group {width:auto; margin-top:5px;}
	.tnb_search {display:none;}
	.btn_Sitemap {display:none;}
	.tnb .btn_mobile {display:inline-block;}
	.tnb .tnb_top {display:none;}
	.tnb .tnb_bottom {padding:0;}
	#header.on .tnb .tnb_bottom {overflow-y:auto; height:100vh;}
	.btn_mgnb {display:block; position:absolute; top:50%; transform:translateY(-50%); right:15px; width:20px; height:16px; background:url(../img/common/2022_icon_wrap.png) no-repeat -65px 0; border-radius:0;}

    /* gnb */
    .gnb {overflow-y:auto; display:none; position:absolute; top:90px; left:0; width:100vw; border:none; border-top:1px solid #222; background:#fff; z-index:999;}
    .gnb .inner {display:block; height:calc(100vh - 99px);}
	#header.on .tnb .category {display:block; position:static;}
	.category {display:none;}
    .category .btn_category {position:relative; display:none; width:100%; padding:15px 20px 15px 56px; font-size:16px; border:none; border-bottom:1px solid #222; border-radius:0; box-shadow:none; font-family:'NotoSans';}
	#header.on .category .btn_category {display:block;}
	.category .btn_category:after {content:""; position:absolute; top:15px; right:20px; width:20px; height:20px; background:url(../img/common/2022_icon_common.png) -170px -10px no-repeat;}
	.category .btn_category.is-active {color:#fff; background-color:#477bff;}
	.category .btn_category.is-active:before {background-position-y:-52px;}
    #main .category .snb, .category .snb {display:none; position:relative; top:auto; left:auto; width:100%; height:auto; padding:10px 10px 10px 58px; border:none; border-bottom:1px solid #222; background:#efefef; border-radius:0;}
    .category .snb .depth1 {margin:0;}
	.category .snb .depth1 ul {display:none;}
	.category .snb .depth1 li a {position:relative; display:inline-block; padding:5px 0; color:#555;}
	.category .snb .depth1 li a:hover, .category .snb .depth1 li a:focus, .category .snb .depth1 li a:active {background:none; color:#555;}
	.category .snb .depth1 li a:before {content:""; display:inline-block; width:1px; height:6px; margin:8px 10px 0 0; vertical-align:top; background:#222; transform:rotate(-25deg);}
	.category .snb .depth1 li a:after {content:''; width:0; position:absolute; bottom:4px; left:0; border-bottom:1px solid #014788; transition:all 0.2s ease-out;}
	.category .snb .depth1 li a:hover:after, .category .snb .depth1 li a:focus:after, .category .snb .depth1 li a:active:after {width:100%;}
    .category .snb .depth1 li:hover > ul, .category .snb ul.is-show, .category .snb .depth1 ul.is-show {display:none; visibility:hidden;}
    .tnb .main_menu {display:none;}
	#header.on .tnb .main_menu {display:block; border-bottom:1px solid #222;}
    .tnb .main_menu > li {padding:0;}
    .tnb .main_menu > li > a {height:auto; padding:10px 55px 10px 55px; border-radius:0; background:none; font-family:'NotoSans';}
	.tnb .main_menu > li > a:after {content:""; position:absolute; top:10px; right:20px; width:20px; height:20px; background:url(../img/common/2022_icon_common.png) -170px -10px no-repeat;}
    .tnb .main_menu > li > ul {display:none; position:relative; top:auto; left:auto; width:100%; padding:10px 10px 10px 60px; border:none; border-bottom:1px solid #222; background:#efefef;}
	.tnb .main_menu > li:last-of-type > ul {border-bottom:none;}
    .tnb .main_menu > li > ul a {padding:5px 0; font-size:15px;}
    .tnb .main_menu > li > ul a:before {content:""; display:inline-block; width:1px; height:6px; margin:8px 10px 0 0; vertical-align:top; background:#222; transform:rotate(-25deg);}
    .gnb .btn_Search {width:100%; padding:14px 0 14px 28px; font-size:16px; text-align:left; border-bottom:1px solid #222;}
    .gnb .btn_Search::before {left:30px;}

    /* gnb on */
	#header.on {background-color:#ecf2ff;}
	#header.on .gnb {display:none;}
	#header.on .btn_mobile .btn_m_menu {position:absolute; right:15px; top:27px; background-position-x:-80px;}
	#header.on .btn_m_srch {display:none;}

	/* search on */
	.tnb_search_group.on {top:0; right:auto; left:15px; width:calc(100% - 15px); padding:20px 0; background:#fff;}
	.tnb_search_group.on .tnb_search {display:inline-block; position:relative; width:calc(100% - 50px); vertical-align:middle; padding:0; border:0; background-color:transparent;}
	.tnb_search_group.on .tnb_search .search {display:block;}
	.tnb_search_group.on .tnb_search input[type="text"] {width:100%; border-width:2px;}
	.tnb_search_group.on .tnb_search button {width:40px; height:42px; overflow:hidden; position:absolute; top:0; right:8px; background:url(../img/common/2022_icon_common.png) no-repeat 0 0;}
	.tnb_search_group.on .btn_mobile .btn_m_srch {margin-left:2px; background-position-x:-80px;}
	.tnb_search_group.on .btn_mobile .btn_m_menu {display:none;}
	.tnb_search_btn, .tnb_search_group.on .btn_Close {display:none;}

	/* category on */
	#main .category.on .btn_category, .category.on .btn_category {color:#fff; background:#477bff;}
	#main .category.on .btn_category:before, .category.on .btn_category:before, #main .category.on .btn_category:after, .category.on .btn_category:after {background-position-y:-52px;}
    .tnb .main_menu > li.on {background:#477bff;}
    .tnb .main_menu > li.on > a {color:#fff;}
	.tnb .main_menu > li.on > a:after {background-position-y:-52px;}
    .tnb .main_menu > li.on > ul {display:block; visibility:visible; opacity:1;}
	nav.fnb .fmenu_wrap {position:relative; width:50%;}
	nav.fnb .btn_footer {display:block; width:100%; background-color:#2e3b49;}
	nav.fnb .btn_footer + ul {visibility:hidden; opacity:0; display:block; position:absolute; width:100%; background:#fff; border:1px solid rgba(0, 0, 0, 0.15); bottom:100%; left:0; padding:10px; height:350px; overflow-y:scroll;}
    nav.fnb ul.menu li:not(:last-child) {margin-right:0;}
	nav.fnb .btn_footer + ul li a {font-size:14px; display:inline-block; color:#222; transition:all 0.2s ease-out; padding:5px 0; position:relative;}
	nav.fnb .btn_footer + ul li a::after {content:''; width:0; height:1px; border-bottom:1px solid #014788; position:absolute; top:auto; left:0; bottom:1px; transition:all 0.2s ease-out; transform:translate(0);}
	nav.fnb .btn_footer + ul li a:hover {color:#014788;}
	nav.fnb .btn_footer + ul li a:hover::after {width:100%;}
    nav.fnb .btn_footer + ul li a strong {color:inherit;}
	nav.fnb .btn_footer.is-active + ul {visibility:visible; opacity:1; animation:fadeIn 0.3s forwards;}
	nav.fnb .family {width:50%;}
	nav.fnb .family .btn_family {width:100%;}
	.gnb .btn_Search.detail, .gnb .btn_Search.map {display:block;}
	.btn_Search {position:relative;}
	#header.on .btn_Search.detail, #header.on .btn_Search.map {display:block; width:100%; height:auto; padding:14px 0 14px 28px; right:0; font-size:16px; text-align:left; border-bottom:1px solid #222; background:none;}
	.main_tab_cont {gap:20px;}

	.visual_r_conts {display:flex; flex-direction:row; justify-content:space-around; width:100%; padding:0 10px; gap:0;}
	.visual_r_conts .go {width:calc(100% / 2 - 20px);}
	.visual_r_conts .shortcut {padding-top:20px;}
	.visual_r_conts .main_sec {height:220px; margin:40px 0 0 0;}
	.visual_r_conts .main_sec > ul > li {display:flex; justify-content:center; gap:0 20px;}
}
@media screen and (max-width:1024px) {
	.btn_exel {display:none;}
}
@media screen and (max-width:850px) {
    .tnb_search label {display:none;}
	.tnb_search input[type="text"] {padding-left:15px;}
    .footer_info .inner {display:block;}
    .footer_info .addr, .footer_info .foot_right {width:100%;}
    .footer_info .addr address span {margin-right:10px;}
    .footer_info .addr address span:after {display:none;}
    .footer_info .footer_h1 {text-align:center;}
    .footer_info .cs, .footer_info .cert {position:relative; width:50%; margin:0;}
    .footer_info .cs address {font-size:20px;}
    .footer_info .cert {justify-content:flex-end;}

	.main_tabs {width:calc(100% - 40px); height:auto; flex-wrap:wrap; margin:20px auto; border-radius:15px;}
	.main_tabs li {border-radius:15px;}

	.visual_r_conts {padding:0 20px; flex-direction:column; gap:20px;}
	.visual_r_conts .go {width:100%;}
	.visual_r_conts .main_sec {height:400px;}
	.visual_r_conts .main_sec > ul > li {flex-direction:column; align-items:center;}
}
@media screen and (max-width:400px) {
	.gnb {top:60px;}
	.gnb .inner {height:calc(100vh - 70px);}
	.tnb .inner {padding:20px 0 15px 15px;}
	.tnb .logo {width:180px;}
	.tnb_search_group {top:7px;}
	.tnb_search_group.on {padding:19px 0;}
	.main_tabs li {height:48px; font-size:17px; line-height:50px;}
	.footer_info .foot_right {display:block;}
	.footer_info .cs, .footer_info .cert {width:100%;}
	.footer_info .cert {display:none; margin-top:20px; justify-content:flex-start;}
	.visual_r_conts .go h2 {font-size:21px;}
	.visual_r_conts .go h2 > p {font-size:21px;}
	.visual_r_conts .go::after {bottom:0; right:10px; top:auto; left:auto;}
}