@charset "utf-8";

html { font-size: 16px; }
html, body { margin: 0; padding: 0; background: #fff; color: #333; font-family: 'Noto Sans KR', sans-serif; font-weight: 400; line-height: 1.25; word-break: keep-all; }
body { font-size: 1rem; overflow-x: hidden; }
ol, ul, li, dl, dt, dd { margin: 0; padding: 0; list-style: none; }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 700; line-height: 1.25; }
p { margin: 0; }
b { font-weight: 700; }
strong { font-weight: 900; }

a { color: #333; text-decoration: none; }
a:hover { text-decoration: none; }

/* 본문 바로가기 */
#skip_to_container { display: none; }

/* 테마 컬러 */
.theme-color-1 { color: #293991; }
.theme-color-2 { color: #3b62e5; }
.theme-color-3 { color: #4264d4; }
.theme-color-4 { color: #5b7be5; }
.theme-bg-color-1 { background-color: #293991; }
.theme-bg-color-2 { background-color: #3b62e5; }
.theme-bg-color-3 { background-color: #4264d4; }
.theme-bg-color-4 { background-color: #5b7be5; }

/*scrollbar color*/
/* ::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background-color: transparent; }
::-webkit-scrollbar-thumb { border-radius: 3px; background-color: #293991; }
::-webkit-scrollbar-button { width: 0; height: 0; } */

/* 레이아웃 */
#root { position: relative; }
#root > hr { display: none; }
#hd, #gnb, #pop, #vis, #wrapper, #ask, #kit, #stv, #hub, #ft { clear: both; }
#hd:after, #gnb:after, #pop:after, #vis:after, #wrapper:after, #ask:after, #kit:after, #stv:after, #hub:after, #ft:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_wrap, #gnb_wrap, #pop_wrap, #container, #ask_wrap, #kit_wrap, #stv_wrap, #hub_wrap, #ft_wrap, .section { display: block; margin: auto; width: 100%; max-width: 1460px; }


/*================================================================
    헤더
================================================================*/
#hd {}
#h1 { display: none; }
#hd { position: relative; border-bottom: 1px solid #ddd; }
#hd:before { position: absolute; left: 0; right: 0; top: 0; content: ""; z-index: 0; visibility: visible; background: #3f4553; height: 40px; }
#hd:after { display: none; position: absolute; left: 0; right: 0; top: 40px; bottom: 0; content: ""; z-index: 0; visibility: visible; background: #fff; border-bottom: 1px solid #ddd; box-shadow: 0px 1px 5px rgba(0,0,0,.05); }

#hd_home, #hd_user, #hd_etcbar, #hd_social, #hd_contact,
#hd_home a, #hd_user a, #hd_etcbar a, #hd_social a, #hd_contact a { color: rgba(255,255,255,1); }
#hd_home a:hover, #hd_user a:hover, #hd_etcbar a:hover, #hd_social a:hover, #hd_contact a:hover { color: rgba(255,255,255,0.5); }

#hd #hd_top { clear: both; position: relative; width: 100%; }
#hd #hd_top .hd_top_x { position: absolute; top: 50%; right: 0; width: 32px; height: 32px; background: none; border: 0; padding: 0; display: block; cursor: pointer; z-index: 1; transform: translate(-50%, -50%); }
#hd #hd_top .hd_top_x:before,
#hd #hd_top .hd_top_x:after { content: ""; position: absolute; top: 16px; left: 0; width: 100%; height: 1px; background: #000; }
#hd #hd_top .hd_top_x:before { transform: rotate(45deg); }
#hd #hd_top .hd_top_x:after { transform: rotate(-45deg); }

#hd_wrap { position: relative; margin: 0 auto; padding: 40px 0 0; }
#hd_wrap > * { z-index: 1; }

#hd_logo { margin: 0; padding: 0; height: 80px; position: relative; }
#hd_logo a { margin: auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; margin: auto; padding: 0; height: 50px; overflow: hidden; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#hd_logo img { display: block; max-width:none; max-height: 50px; }
#hd_logo .hd_logo_wt { display: none; }

#hd_home { display: none; opacity: 1; visibility: visible; position: absolute; z-index: 1; top: 0; left: 0; font-size: 12px; color: #000; text-transform: uppercase; }
#hd_home > ul { clear: both; overflow: hidden; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: auto; height: 40px; }
#hd_home > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_home > ul > li { float: left; display: block; border-left: 1px solid rgba(255,255,255,.15); }
#hd_home > ul > li:last-child { display: none; border-right: 1px solid rgba(255,255,255,.15);; }
#hd_home > ul > li > a { display: block; width: 40px; height: 40px; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; align-items: center; justify-content: center; }
#hd_home .fa,
#hd_home .material-icons { font-size: 18px; width: 1em; height: 1em; }

#hd_user { opacity: 1; visibility: visible; position: absolute; z-index: 1; top: 0; right: 1rem; font-size: 12px; text-transform: uppercase; }
#hd_user > ul { clear: both; overflow: hidden; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: auto; height: 40px; }
#hd_user > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_user > ul > li { float: left; display: block; margin-right: 0.75rem; }
#hd_user > ul > li:last-child { margin-right: 0; }
#hd_user > ul > li b { font-weight: bold; }
#hd_user > ul > li.tnb_admin a {}

#hd_navbar { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,.75); z-index: 99; display: block; display: none; } 
#hd_navbar .hd_navbar { position: relative; overflow: hidden; margin: 120px auto auto auto; width: 1200px; min-height: 400px; background: #fff; position: relative; opacity: 0; visibility: hidden; transition: all 0.25s ease-in-out; }
#hd_navbar .hd_navbar:before { content: 'SITEMAP'; display: block; margin: 0; padding: 20px 50px; border-bottom: 1px solid #ddd; height: 80px; box-shadow: 0px 1px 5px rgba(0,0,0,.05); font-size: 38px; font-family: 'Montserrat','Noto Sans KR',sans-serif; font-weight: 800; }
#hd_navbar .hd_navbar:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_navbar .hd_navbar { position: relative; opacity: 0; visibility: hidden; }
#hd_navbar .hd_navbar h2 { margin: 0; padding: 20px 50px; border-bottom: 1px solid #ddd; height: 80px; box-shadow: 0px 1px 5px rgba(0,0,0,.05); font-size: 38px; font-family: 'Montserrat','Noto Sans KR',sans-serif; font-weight: 800; }
#hd_navbar .hd_navbar h2 sub { position: static; margin: 0 0 0 .5em; font-size: 20px; line-height: inherit; font-weight: 400; }
#hd_navbar .hd_navbar #map_navbar { position: absolute; top: 0; right: 0; width: 80px; height: 80px !important; padding: 0 !important; border-radius: 0; border: 0; background: transparent; }
#hd_navbar .hd_navbar #map_navbar * { display: none; }
#hd_navbar .hd_navbar #map_navbar:before,
#hd_navbar .hd_navbar #map_navbar:after { content: ""; margin: auto; display: block; width: 50%; height: 1px; background: #000; }
#hd_navbar .hd_navbar #map_navbar:before { transform: rotate(-45deg); }
#hd_navbar .hd_navbar #map_navbar:after { transform: rotate(45deg); }
#hd_navbar .hd_navbar > ul { overflow: hidden; padding: 40px; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; align-items: start; justify-content: start; }
#hd_navbar .hd_navbar > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_navbar .hd_navbar > ul > li { -webkit-box-flex: 1 1 auto; -moz-box-flex: 1 1 auto; -ms-flex: 1 1 auto; -webkit-flex: 1 1 auto; flex: 1 1 auto; }
#hd_navbar .hd_navbar > ul > li > a,
#hd_navbar .hd_navbar > ul > li > ul { display: block; margin: 10px; }
#hd_navbar .hd_navbar > ul > li > a { display: block; padding-bottom: 10px; border-bottom: 1px solid #ddd; font-size: 20px; }
#hd_navbar .hd_navbar > ul > li > ul { padding-left: 20px; }
#hd_navbar .hd_navbar > ul > li > ul > li { list-style: square; }
#hd_navbar .hd_navbar > ul > li > ul > li > a { display: block; padding: 2px 0; }
#hd_navbar.is-open { display: block; }
#hd_navbar.is-open .hd_navbar { opacity: 1; visibility: visible; }

#hd_etcbar { opacity: 1; visibility: visible; display: block; position: absolute; top: 5px; left: 30px; right: 30px; font-size: 12px; z-index: 1; display: none; }
#hd_etcbar > ul { position: relative; clear: both; overflow: hidden; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border-radius: 15px; background: rgba(255,255,255,0.75); margin: auto; padding: 0; width: 300px; height: 30px; border: 1px solid rgba(0,0,0,0.15); color: #999; transition: all 0.25s ease-in-out; }
#hd_etcbar > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_etcbar > ul:hover { border-color: rgba(0,0,0,0.3); color: #666; }
#hd_etcbar > ul a { color: #999; transition: all 0.25s ease-in-out; }
#hd_etcbar > ul a:hover { color: #333; }
#hd_etcbar > ul > li { float: left; display: block; margin-right: 0.75rem; flex: 0 0 auto; -ms-flex: 0 0 auto; }
#hd_etcbar > ul > li:last-child { margin-right: 0; }

#hd_social { opacity: 1; visibility: visible; display: block; position: absolute; top: 5px; left: 30px; right: 30px; font-size: 16px; display: none; }
#hd_social > ul { position: relative; clear: both; overflow: hidden; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; margin: auto; padding: 0; width: 200px; height: 30px; color: #999; transition: all 0.25s ease-in-out; border-radius: 15px; }
#hd_social > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_social > ul:hover { border-color: rgba(0,0,0,0.3); color: #666; }
#hd_social > ul > li { float: left; display: block; margin-right: 0.5rem; }
#hd_social > ul > li > a { display: block; }
#hd_social > ul > li:last-child { margin-right: 0; }
#hd_social .unit-label,
#hd_social .unit-field { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

#hd_contact { display: none; opacity: 1; visibility: visible; padding: 0 15px; position: absolute; z-index: 1; top: 0; left: 80px; font-size: 12px; color: #000; }
#hd_contact > ul { clear: both; overflow: hidden; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: auto; height: 40px; }
#hd_contact > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_contact > ul > li { float: left; display: block; margin-right: 0.75rem; }
#hd_contact > ul > li:last-child { margin-right: 0; }
#hd_contact .unit-label { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

#hd_search { opacity: 1; visibility: visible; display: block; position: absolute; top: calc(50% + 20px); left: 50%; transform: translate(-50%,-50%); font-size: 16px; z-index: 11; display: none; }
#hd_search .hd_search { clear: both; overflow: hidden; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: auto; height: 50px; }
#hd_search .hd_search:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_search .hd_search > form { position: relative; }
#hd_search #sch_stx { width: 810px; height: calc(2.25em + 2px); height: 50px; font-size: 1em; background: #fff; border: 3px solid #000; border-color: #000; border-radius: 0; transition: all 0.15s ease-in-out; }
#hd_search #sch_stx:focus { outline: 0; box-shadow: none; border-color: #000; }
#hd_search #sch_submit { position: absolute; top: 0; bottom: 0; right: 0; border: 0; background: none; font-size: 1em; color: #000; }
#hd_search #sch_submit:hover, 
#hd_search #sch_submit:focus { border: 0; background: none; outline: 0; box-shadow: none; color: inherit; }
#hd_search #sch_search { margin: 0 !important; padding: 0 !important; margin-left: 5px !important; font-size: 1em; display: none; color: #000; }
#hd_search.is-open { display: block; }

#hd_button { opacity: 1; visibility: visible; display: block; position: absolute; top: calc(50% + 20px); right: 0; transform: translateY(-50%); }
#hd_button > ul { clear: both; overflow: hidden; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: auto; height: 50px; }
#hd_button > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_button > ul > li { float: left; display: block; height: 100%; }
#hd_button > ul > li > button { display: block; width: 70px; height: 100%; padding: 0; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; align-items: center; justify-content: center; background: none; border: 0; background-image: url('../images/hd_button.png'); background-position: 0 0; background-repeat: no-repeat; background: none; font-size: 1.75rem; }
#hd_button > ul > li > button.hd_button_search { background-position: -70px 0; }
#hd_button > ul > li > button.hd_button_search.active,
#hd_button > ul > li > button.hd_button_search:hover { background-position: -70px -50px; }
#hd_button > ul > li > button.hd_button_navbar { background-position: -140px 0; }
#hd_button > ul > li > button.hd_button_navbar.active,
#hd_button > ul > li > button.hd_button_navbar:hover { background-position: -140px -50px; }

#hd_gadget { opacity: 1; visibility: visible; display: block; position: absolute; top: 55px; right: 0; z-index: 2; display: none; }
#hd_gadget > ul { clear: both; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; width: auto; height: 50px; }
#hd_gadget > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#hd_gadget > ul > li { float: left; display: block; height: 100%; position: relative; }
#hd_gadget > ul > li > .hd_gadget_btn { display: block; width: 50px; height: 100%; padding: 0; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; align-items: center; justify-content: center; background: none; border: 0; background-position: center center; background-repeat: no-repeat; }
#hd_gadget > ul > li > .hd_gadget_obj { display: none; position: absolute; }
#hd_gadget > ul > li > .hd_gadget_member_obj { white-space: nowrap; top: 100%; left: 50%; transform: translateX(-50%); background-color: #3f4553; color: #fff; padding: 0.5rem; z-index: 1; }
#hd_gadget > ul > li > .hd_gadget_member_obj a { display: block; min-width: 80px; font-size: 0.875rem; color: #fff; padding: 0.25rem 1rem; position: relative; transition: padding 0.25s ease-in-out; }
#hd_gadget > ul > li > .hd_gadget_member_obj a:hover { color: #fff; }
#hd_gadget > ul > li > .hd_gadget_member_obj a:hover:before { position: absolute; top: 50%; transform: translateY(-50%); left: 5px; content: ''; background-color: #fff; width: 3px; height: 3px; }
#hd_gadget > ul > li > .hd_gadget_search_obj { width: 250px; top: 100%; right: 0; color: #fff; }
#hd_gadget > ul > li > .hd_gadget_search_obj .unified-search { border: 0; background-color: #fff; color: inherit; border-radius: 0.25rem; height: 40px; }
#hd_gadget > ul > li > .hd_gadget_search_obj .unified-search-submit { width: 40px; }
#hd_gadget > ul > li > .hd_gadget_search_obj .unified-search-submit::after { font-size: 24px; }

#hd_mapper { opacity: 1; visibility: visible; display: block; position: absolute; top: 55px; right: 0; width: 50px; height: 50px; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; display: none; transition: all 0.25s ease-in-out; }
#hd_mapper > button { display: block; width: 50px; height: 100%; padding: 0; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; align-items: center; justify-content: center; background: none; border: 0; background-position: center center; background-repeat: no-repeat; }
#hd_mapper > button::after { content: "\e5c3"; font-family: "Material Icons"; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; -moz-osx-font-smoothing: grayscale; font-feature-settings: 'liga'; font-size: 32px; line-height: 1; }

#hd_toggle { opacity: 1; visibility: visible; display: block; position: absolute; top: calc(50% + 20px); right: 0; transform: translateY(-50%); width: 50px; height: 50px; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; display: none; }

#hd, #hd_logo, #hd_logo a, #hd_home, #hd_user, #hd_navbar, #hd_navbar .hd_navbar, #hd_etcbar, #hd_contact, #hd_social, #hd_search, #hd_search .hd_search, #sch_search, #hd_button, #hd_gather { transition: all 0.25s ease-in-out; }


/*================================================================
  GNB
================================================================*/
#gnb { opacity: 1; visibility: visible; display: block; position: absolute; top: auto; margin-top: -80px; left: calc(50% - 600px + 220px); right: calc(50% - 600px + 170px); /* font-size: 20px; */ z-index: 10; }
#gnb_wrap { display: block; width: auto; height: 80px; }
#gnb_wrap h2 { border-bottom: 1px solid #eee; }
#gnb_wrap #gnb_container { height: 100%; }

#gnb_1dul { display: flex; justify-content: center; align-items: center; height: 100%; }
#gnb_1dul .gnb_1dli { float: left; position: relative; display: block; height: 80px; margin: 0 0.5em; }
#gnb_1dul .gnb_1dli:not(:first-child):before { display: none; position: absolute; top: calc(50% - 0.25rem); left: 0; width: 1px; height: 0.5em; background: rgba(0,0,0,0.15); content: ""; }
#gnb_1dul .gnb_1dli .gnb_1da { -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; align-items: center; justify-content: center; height: 100%; padding: 0.5em 1em; line-height: 1; }

#gnb_1dul .gnb_1dli {}
#gnb_1dul .gnb_1da { font-weight: 700; }

/* #gnb_1dul .gnb_2dul { display: block; opacity: 0; visibility: hidden; position: absolute; top: 120%; left: 50%; transform: translateX(-50%); width: auto; margin: 0; line-height: 1; transition: all 0.25s ease-in-out; min-width: 200px; background: #3f4553; color: #fff; }
#gnb_1dul .gnb_2dul:after { display: block; visibility: hidden; clear: both; content: ""; }
#gnb_1dul .gnb_2dli { position: relative; display: block; border-bottom: 1px solid rgba(255,255,255,.1); }
#gnb_1dul .gnb_2dli:last-child { border-bottom: 0; }
#gnb_1dul .gnb_2da { overflow: hidden; width: 100%; display: block; padding: .75em 1.25em; text-align: center; text-decoration: none; font-size: 1rem; color: #fff; }
#gnb_1dul .gnb_2da:hover { color: #fff; background: rgba(255,255,255,.1); }

#gnb_1dul .gnb_3dul { display: block; opacity: 0; visibility: hidden; position: absolute; top: 40px; left: 100%; width: auto; margin: 0; white-space: nowrap; line-height: 1; transition: all 0.25s ease-in-out; min-width: 160px; max-width: 200px; background: #6d788f; color: #fff; }
#gnb_1dul .gnb_3dul:after { display: block; visibility: hidden; clear: both; content: ""; }
#gnb_1dul .gnb_3dli { position: relative; display: block; border-bottom: 1px solid rgba(255,255,255,.1); }
#gnb_1dul .gnb_3dli:last-child { border-bottom: 0; }
#gnb_1dul .gnb_3da { overflow: hidden; width: 100%; display: block; padding: .75em 1.25em; text-align: left; text-decoration: none; font-size: 1rem; white-space: nowrap; text-overflow: ellipsis; color: #fff; }
#gnb_1dul .gnb_3da:hover { color: #fff; background: rgba(255,255,255,.1); }

#gnb_1dul .gnb_1dli_air .gnb_2da {}
#gnb_1dul .gnb_1dli_on .gnb_2da {}
#gnb_1dul .gnb_2da:focus, .gnb_2da:hover {}

#gnb_1dul .gnb_1dli_over .gnb_2dul { display: block; opacity: 1; visibility: visible; top: 85%; }
#gnb_1dul .gnb_1dli_over2 .gnb_2dul { display: block; opacity: 1; visibility: visible; top: 85%; }

#gnb_1dul .gnb_1da:hover,
#gnb_1dul .gnb_1dli_over .gnb_1da {}
#gnb_1dul .gnb_2da:hover {}

#gnb_1dul .gnb_2dli_over .gnb_3dul { display: block; opacity: 1; visibility: visible; top: 0; }
#gnb_1dul .gnb_2dli_over2 .gnb_3dul { display: block; opacity: 1; visibility: visible; top: 0; }

#gnb_1dul .gnb_wrap .gnb_empty { padding: 10px 0; width: 100%; text-align: center; line-height: 2em; }
#gnb_1dul .gnb_wrap .gnb_empty a { text-decoration: underline; }
#gnb_1dul .gnb_wrap .gnb_al_ul .gnb_empty, .gnb_wrap .gnb_al_ul .gnb_empty a {} */


/*================================================================
    모바일 네비게이션
================================================================*/
#off { position: fixed; top: 0; left: auto; bottom: 0; right: -300px; overflow: hidden; z-index: 99; min-width: 300px; transition: right 0.25s ease-in-out; }
#off.in { right: 0; box-shadow: 0 0 20px rgb(0 0 0 / 30%); }
#off_wrap { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; }
#off h2 { position: absolute; top: 0; right: 0; bottom: auto; left: 0; height: 70px; padding: 15px 20px; }
#off h2 > a { display: inline-block; height: 100%; }
#off h2 img { display: block; width: auto; height: 100%; }
#off h2 .offcanvas-toggle { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); }
#off #off_container { width: 100%; height: 100%; margin-top: 70px; border-top: 1px solid #ddd; overflow-x: hidden; overflow-y: auto; }

#off #off_member { -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; flex-wrap: nowrap; margin: 0; padding: 10px 20px; border-bottom: 1px solid #ddd; }
#off #off_member li { flex: 1 0 0; }
#off #off_member a { display: block; white-space: nowrap; font-size: 0.875rem; margin: 0 5px; padding: 0.25rem 0.5rem; border: 1px solid #ddd; text-align: center; transition: all 0.25s ease-in-out; }
#off #off_member a:focus,
#off #off_member a:hover { background-color: #007bff; border-color: #007bff; color: #fff; }

#off #off_search { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; background-color: #f2f2f2; }
#off #off_search .unified-search { border: 0; height: 45px; }
#off #off_search .unified-search-cancel::after, 
#off #off_search .unified-search-submit::after { font-size: 32px; }

#off #off_1dul {}
#off #off_1dul .off_1dli { display: block; }
#off #off_1dul .off_1dli > a { position: relative; display: block; padding: 10px 20px; white-space: nowrap; border-bottom: 1px solid #ddd; color: initial; }
#off #off_1dul .off_1dli > a:hover { color: initial; }
#off #off_1dul .off_1dli_family > a::before,
#off #off_1dul .off_1dli_family > a::after { content: ""; display: block; position: absolute; width: 15px; height: 1px; right: 20px; top: 50%; background: #007bff; transition: transform .3s ease; }
#off #off_1dul .off_1dli_family > a::before {}
#off #off_1dul .off_1dli_family > a::after { transform: rotate(270deg); }
#off #off_1dul .off_1dli_family.is-open > a::after { transform: rotate(0deg); }
#off #off_1dul .off_2dul { display: none; background-color: #fafafa; }
#off #off_1dul .off_2dli { border-bottom: 1px solid #eee; }
#off #off_1dul .off_2dli > a { position: relative; display: block; padding: 10px 20px; white-space: nowrap; }
#off #off_1dul .off_2dli > a:hover { color: initial; }
#off #off_1dul .off_2dli_family > a::before,
#off #off_1dul .off_2dli_family > a::after { content: ""; display: block; position: absolute; width: 15px; height: 1px; right: 20px; top: 50%; background: #aaa; transition: transform .3s ease; }
#off #off_1dul .off_2dli_family > a::before {}
#off #off_1dul .off_2dli_family > a::after { transform: rotate(270deg); }
#off #off_1dul .off_2dli_family.is-open > a::after { transform: rotate(0deg); }
#off #off_1dul .off_3dul { background-color: #fafafa; padding: 0 20px 10px 30px; }
#off #off_1dul .off_3dli { margin: 5px; }
#off #off_1dul .off_3dli > a { position: relative; display: block; padding: 0; white-space: nowrap; font-size: 14px; }
#off #off_1dul .off_3dli > a:hover { color: initial; }

#off #off_1dul .off_3dul { background-color: rgb(221 231 237 / 13%); padding: 0 20px 10px 30px; }
#off #off_1dul .off_3dli { margin: 5px; }
#off #off_1dul .off_3dli > a { position: relative; display: block; padding: 0; white-space: nowrap; font-size: 14px; }
#off #off_1dul .off_3dli > a:hover { color: initial; }

#off #off_1dul .off_1dli.off_1dli_active > a { color: #005BAC; font-weight: 700; }
#off #off_1dul .off_1dli.is-open > a { background: #005BAC; color: #fff; font-weight: 700; }
#off #off_1dul .off_1dli_family.is-open > a::before, #off #off_1dul .off_1dli_family.is-open > a::after { background: #fff; }
#off #off_1dul .off_2dli.off_2dli_active > a { color: #005BAC; font-weight: 700; }

#off #off_1dul .off_3dul { padding: 0; }
#off #off_1dul .off_3dli { margin: 0; }
#off #off_1dul .off_3dli:not(:last-child) > a { border-bottom: 1px dashed #ddd; }
#off #off_1dul .off_3dli > a { padding: 10px 30px; background: rgba(8,76,177,0.05); }
#off #off_1dul .off_3dli.off_3dli_active > a { color: #005BAC; font-weight: 700; }



/* 레이아웃: #pop */


/*================================================================
    타이틀러 : 상단 비주얼
================================================================*/
#vis {}
#vis_wrap { width: 100%; }
#vis_wrap .no-img,
#vis #mainSlider .swiper-slide { background-position: center; background-size: cover; background-repeat: no-repeat; }
#vis_wrap .no-img { width: 100%; height: 100%; }
#vis_wrap .no-img img { opacity: 0; visibility: hidden; display: block; width: 100%; margin: auto; }
#vis #mainSlider .swiper-slide { background-position: center; background-size: cover; background-repeat: no-repeat; }
#vis #mainSlider .swiper-slide a { display: block; width: 100%; height: 100%; }
#vis #mainSlider .swiper-slide img { opacity: 0; visibility: hidden; display: block; width: 100%; margin: auto; }

#vis #titler { position: relative; background-position: center center; background-repeat: no-repeat; background-size: cover; height: 380px; }
#vis #titler .leader,
#vis #titler .helper { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); margin: 0 1rem; text-align: center; color: #fff; font-size: 42px; font-family: 'GmarketSansMedium',sans-serif; line-height: 1.25; }
#vis #titler .leader a { color: #fff; text-decoration: none; }
#vis #titler .leader { font-size: 2.5rem; transform: translateY(-100%); white-space: nowrap; }
#vis #titler .helper { display: none; font-size: 1rem; transform: translateY(0); opacity: 0.75; font-family: inherit; }

/* 메뉴탭 */
.menutab { position: relative; top: 100%; bottom: auto; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -ms-flex-pack: center; border-top: 0; border-bottom: 1px solid #E5E5E5; z-index: 2; }
.menutab h3 { display: table-cell; vertical-align: middle; padding: 0 2.5rem; color: #232323; font-size: 1.125rem; font-weight: 500; letter-spacing: 0; cursor: pointer; }
.menutab h3 i { position: absolute; top: 50%; right: 2.5rem; transform: translateY(-50%); color: #666; font-size: 0.667rem; transition: all .2s; }
.menutab .dep-wrap { display: flex; width: 100%; max-width: 1460px; }
.menutab .dep-wrap .dep { height: 5rem; }
.menutab .dep-wrap .home { display: none; width: 5rem; border-right: 1px solid #E5E5E5; background: rgb(0,214,178); }
.menutab .dep-wrap .home a { display: block; width: 100%; height: 100%; background: url("../images/menutab_home.png") center no-repeat; }
.menutab .dep-wrap .dep1 { display: none; width: 18.125rem; color: #0E8299; }
.menutab .dep-wrap .dep1 h3, .menutab .dep-wrap .dep1 i { color: #0E8299; font-weight: 700; }
.menutab .dep-wrap .dep2 { width: 100%; }
.menutab .dep-wrap .dep3 { display: none; width: 18.125rem; }
.menutab .dep-wrap .dep > div { position: relative; display: none; width: 100%; height: 100%; }
.menutab .dep-wrap .dep > div.open i { transform: translateY(-50%) rotate(180deg); }
.menutab ul { display: flex; justify-content: center; height: 100%; }
.menutab ul li a { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0 2.5rem; width: 100%; height: 100%; padding: 0.5rem 1.667rem; font-size: 1.25rem; font-weight: 500; letter-spacing: 0; line-height: 1.25; transition: all .2s; }
.menutab ul li a::after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 3px; background: #293991; }
.menutab ul li.on a { color: #293991; font-weight: 700; }
.menutab ul li.on a::after { width: 100%; }
@media (max-width: 1500px) {
  .menutab {  }
}
@media ( max-width: 1200px ) {
  .menutab .dep-wrap { border-left: 0; }
}
@media ( max-width: 768px ) {
  .menutab .dep-wrap > div:last-child { border-right: 0; }
  .menutab .dep-wrap .home, .menutab .dep-wrap .dep3 { display: none; }
  .menutab .dep-wrap .dep1, .menutab .dep-wrap .dep2 { width: 50%; }
  .menutab h3 { padding: 0 2rem 0 1rem; }
  .menutab h3 i { right: 1rem; }

  .menutab .dep-wrap .dep > div { position: relative; display: table; width: 100%; height: 100%; }
  .menutab h3 { display: table-cell; vertical-align: middle; padding: 0 2.5rem; color: #232323; font-size: 1.125rem; font-weight: 500; letter-spacing: 0; cursor: pointer; }
  .menutab h3 i { position: absolute; top: 50%; right: 2.5rem; transform: translateY(-50%); color: #666; font-size: 0.667rem; transition: all .2s; }
  .menutab .dep > div.open i { transform: translateY(-50%) rotate(180deg); }

  .menutab ul { height: auto; padding: 0.5rem 0; background: #f5f5f5; display: none; }
  .menutab ul li { flex: 1 0 auto; width: 100%; max-width: 100%; }
  .menutab ul li a { display: block; height: auto; font-size: 1rem; width: 100%; height: 100%; padding: 0.5rem 2.5rem; line-height: 1.25; transition: all .2s; }
  .menutab ul li.on a { color: #293991; font-weight: 600; }
  .menutab ul li.on a::after { display: none; }

  .menutab .dep-wrap .dep1 { color: #0E8299; }
  .menutab .dep-wrap .dep1 h3, .menutab .dep-wrap .dep1 i { color: #0E8299; font-weight: 700; }
  
  .menutab .dep-wrap .dep1 { display: none; }
  .menutab .dep-wrap .dep2 { width: 100%; height: 3.5rem; border: 0; }
  .menutab .dep-wrap .dep:last-of-type { background: inherit; color: inherit; }
  .menutab .dep-wrap .dep:last-of-type h3, .menutab .dep-wrap .dep:last-of-type i { color: inherit; }
}
@media ( max-width: 768px ) {
  .menutab h3 { padding: 0 1rem; }
  .menutab h3 i { right: 1rem; }
  .menutab ul li a { padding: 0.5rem 1rem; }
}
@media (hover: hover), (-ms-high-contrast:none) {
  .menutab ul li:hover a { color: #293991; }
}


#vis #titler .segment { position: absolute; top: 50%; left: 0; right: 0; transform: translateY(120%); display: none; }
#vis #titler .segment > ul { display: block; overflow: hidden; margin: auto; width: auto; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; align-items: center; justify-content: center; flex-wrap: nowrap; color: #fff; }
#vis #titler .segment > ul > li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
#vis #titler .segment > ul > li > a { display: block; color: #fff; }
#vis #titler .segment > ul > li:first-child > a { text-indent: -9999em; min-width: 20px; background: url('../images/segment_home.png') center center no-repeat; }
#vis #titler .segment > ul > li:not(:first-child) { padding-left: 40px; background: url('../images/segment_arrow.png') 20px center no-repeat; }


/* 레이아웃: main */
#main {}
#container { min-height: 650px; }

/* 헤드라인 */
#container .heading { margin: 4.375rem 0 3.125rem; text-align: center; }
#container .heading h2 { font-size: 38px; }
#container .heading h2 strong { color: #cf3232; }
#container .heading .description { margin: 0.75rem 0 0 0; font-size: 20px; color: #999; line-height: 1.25; }

/* 탭 리스트 : 하위메뉴 출력 */
.tablist { margin: 3rem 0; }
.tablist ul { display: flex; flex-wrap: wrap; justify-content: center; margin-bottom: 2rem; }
.tablist ul li { /* flex: 1 0 0; */ flex: 1 0 20%; position: relative; max-width: 280px; min-height: 2.75rem; margin: -1px 0 0 -1px; }
.tablist ul li a { position: relative; display: inline-flex; justify-content: center; align-items: center; text-align: center; width: 100%; height: 100%; padding: 0.25rem 0.5rem; border-radius: 0; font-size: 1.125rem; letter-spacing: 0; transition: all .25s; }

.tablist .tablist_3d li { border-bottom: 1px solid #E5E5E5; }
.tablist .tablist_3d li:not(:last-child)::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 1.125rem; background: #E5E5E5; z-index: 1; }
.tablist .tablist_3d li a::before { content: ""; position: absolute; bottom: 0; left: 0; right: 0; width: 0; height: 2px; background: #004E94; z-index: 1; }
.tablist .tablist_3d li.on a { color: #004E94; font-weight: 700; }
.tablist .tablist_3d li.on a::before { width: 100%; }

.tablist .tablist_4d li { flex: 0 0 auto; background: #f5f5f5; }
.tablist .tablist_4d li a { padding: 0.25rem 1rem; }
.tablist .tablist_4d li.on a { background: #004E94; color: #fff; }
@media ( max-width: 768px ) {
  .tablist ul { flex-wrap: wrap; justify-content: center; }
  .tablist ul li { flex: 1 0 auto; }
  .tablist ul li a { padding: 0.25rem 0.75rem; font-size: 1rem; line-height: 1.25; word-break: break-all; }
}
@media (hover: hover), (-ms-high-contrast:none) {
  /* .tablist ul li a:hover { color: #004E94; }
  .tablist ul li.on a:hover { color: #fff; } */
}

/* 아웃라인 */
#container .outline { padding-bottom: 10px; margin-bottom: 20px; border-bottom: 1px solid #000; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-end; justify-content: space-between; -ms-flex-pack: space-between; }
#container .outline .outline_title { position: relative; margin: 0; padding: 0 0 0 42px; font-family: 'GmarketSansMedium',sans-serif; line-height: 1; color: #000; font-size: 32px; letter-spacing: -0.05em; }
.outline .outline_title:before { position: absolute; top: 0; left: 0; width: auto; display: block; content: "\e871"; font-family: 'Material Icons'; font-size: 34px; }
#container .outline .outline_history { margin: 0; font-family: 'GmarketSansMedium',sans-serif; line-height: 1; color: #ccc; }
#container .outline .outline_history a { color: #000; }
#container .outline .outline_history a:hover { color: #999; }
#container .outline.mecode_10 .outline_title:before {}
#container .outline.mecode_20 .outline_title:before {}
#container .outline.mecode_30 .outline_title:before {}
#container .outline.mecode_40 .outline_title:before {}
#container .outline.mecode_50 .outline_title:before {}

/* 서브페이지 사이드 메뉴 SNB */
#container { margin: 75px auto; -ms-flex: 1 0 auto; flex: 1 0 auto; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
#container .contentWrap { -ms-flex: 1 1 auto; flex: 1 1 auto; width: 100%; }
#container .contentMenu { -ms-flex: 0 0 auto; flex: 0 0 auto; width: 240px; margin-top: -35px; margin-right: 70px; display: none; }

#container .contentMenu > h3 { padding: 45px 30px 25px 30px; background-color: #394881; color: #fff; font-size: 1rem; border-top-left-radius: 30px; border-top-right-radius: 60px; border-bottom: 4px solid #FCCD11; }
#container .contentMenu > ul {}
#container .contentMenu > ul > li { border-bottom: 1px solid #ddd; }
#container .contentMenu > ul > li > a { position: relative; display: block; padding: 20px 25px; line-height: 1; font-size: 17px; }
#container .contentMenu > ul > li > a::after { content: ''; width: 10px; height: 10px; border-top: 3px solid #394881; border-right: 3px solid #394881; display: inline-block; overflow: hidden; transform: rotate(135deg); position: absolute; top: 21px; left: 210px; display: none; }
#container .contentMenu > ul > li > ul { padding: 12px; background-color: #F5F9FF; display: none; }
#container .contentMenu > ul > li > ul > li {}
#container .contentMenu > ul > li > ul > li > a { position: relative; display: block; padding: 12px; line-height: 1; font-size: 15px; }

#container .contentMenu > ul > li.on > a { color: #394881; font-weight: 800; }
#container .contentMenu > ul > li.in > a::after { display: block; }
#container .contentMenu > ul > li.on > a::after { transform: rotate(315deg); top: 25px; }
#container .contentMenu > ul > li.on > ul { display: block; }
#container .contentMenu > ul > li > ul > li.on > a { color: #394881; font-weight: 800; }

/* 레이아웃: footer */
#ft { position: relative; border-top: 1px solid rgba(0,0,0,0.15); color: #3f4553; font-size: 14px; line-height: 1.5; }
#ft:after { content: ""; display: block; position: absolute; left: 0; right: 0; bottom: 50px; border-top: 1px solid rgba(0,0,0,.075); visibility: visible; }
#ft a {}
#ft a:hover {}
#ft_wrap { position: relative; overflow: hidden; }
#ft_link { position: absolute; left: 0; bottom: 0; }
#ft_link > ul { clear: both; overflow: hidden; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; height: 50px; }
#ft_link > ul:after { display: block; visibility: hidden; clear: both; content: ""; }
#ft_link > ul > li { float: left; display: block; margin-right: 0.75rem; flex: 0 0 auto; -ms-flex: 0 0 auto; }
#ft_sign { float: left; display: block; margin: 20px 0 20px 0; max-width: 200px; text-align: center; }
#ft_sign a { display: inline-block; }
#ft_sign img { max-height: 3em; }
#ft_sign .ft_logo_wt { display: none; }
#ft_info { float: left; display: block; margin: 20px; max-width: 780px; }
#ft_info:after { display: block; visibility: hidden; clear: both; content: ""; }
#ft_info h3 { margin: 0; text-transform: uppercase; font-weight: 400; font-size: 14px; line-height: 1.5; }
#ft_info .ft_info { display: block; overflow: hidden; }
#ft_info .ft_info:after { display: block; visibility: hidden; clear: both; content: ""; }
#ft_info .ft_comp {}
#ft_info .ft_comp > h3 { margin-right: 1em; display: none; }
#ft_info .ft_comp > ul { margin: auto; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-wrap: wrap; }
#ft_info .ft_comp > ul > li { display: block; }
#ft_info .ft_comp > ul > li > dl { display: inline-block; }
#ft_info .ft_comp > ul > li > dl > dt,
#ft_info .ft_comp > ul > li > dl > dd { display: inline-block; font-weight: normal; }
#ft_info .ft_comp > ul > li > dl > dt { margin-right: 0.5em; color: #999; }
#ft_info .ft_comp > ul > li > dl > dd { margin-right: 1.5em; }
#ft_info .ft_comp > ul > li.cp_com { display: none; }
#ft_info .ft_comp > ul > li.cp_owner {}
#ft_info .ft_comp > ul > li.cp_addr {}
#ft_info .ft_comp > ul > li.cp_biz {}
#ft_info .ft_comp > ul > li.cp_tno {}
#ft_info .ft_comp > ul > li.cp_tel {}
#ft_info .ft_comp > ul > li.cp_fax {}
#ft_info .ft_comp > ul > li.cp_email {}
#ft_info .ft_comp > ul > li.cp_fao {}
#ft_info .ft_menu { overflow: hidden; display: inline-block; display: none; }
#ft_info .ft_menu:after { display: block; visibility: hidden; clear: both; content: ""; }
#ft_info .ft_menu > * { vertical-align: middle; }
#ft_info .ft_menu > h3 { display: inline-block; margin-right: 1em; display: none; }
#ft_info .ft_menu > ul { display: inline-block; word-break: break-all; }
#ft_info .ft_menu > ul > li { display: block; float: left; margin-right: 1em; }
#ft_info .ft_contact {}
#ft_info .ft_contact > h3 {}
#ft_info .ft_contact > ul {}
#ft_info .ft_contact > ul > li {}
#ft_info .ft_notice {}
#ft_info .ft_notice > h3 {}
#ft_info .ft_notice > ul { display: table; border-collapse: collapse; }
#ft_info .ft_notice > ul > li { display: table-row;  }
#ft_info .ft_notice > ul > li > a,
#ft_info .ft_notice > ul > li > span { display: table-cell; white-space: nowrap; overflow: hidden; }
#ft_info .ft_notice > ul > li > a { max-width: 270px; text-overflow: ellipsis; }
#ft_info .ft_notice > ul > li > a:before { content: "\25AA"; }
#ft_info .ft_notice > ul > li > span { width: 90px; text-align: right; }

#ft_family { float: right; margin: 20px 0 20px 20px; width: 180px; position: relative; display: none; }
#ft_family:after { display: block; visibility: hidden; clear: both; content: ""; }
#ft_family h3 { display: block; font-size: 1rem; border: 1px solid #ddd; padding: 0.375rem 0.75rem; background-color: #fff; font-weight: normal; cursor: pointer; }
#ft_family ul { display: block; word-break: break-all; position: absolute; top: calc(100% - 1px); z-index: 1; border: 1px solid #ddd; width: 100%; background-color: #fff; display: none; }
#ft_family ul > li { display: block; }
#ft_family ul > li:nth-child(n+2) { border-top: 1px solid #eee; }
#ft_family ul > li > a { display: block; padding: 0.375rem 0.75rem; }
#ft_family ul > li > a:hover { background-color: rgba(0,0,0,0.05); }

#ft_social { float: right; display: none; margin: 20px 0 20px 20px; width: 180px; position: relative; }
#ft_social h3 { display: none; }
#ft_social ul { overflow: hidden; margin: 0; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
#ft_social ul > li { margin: 0 2px; }
#ft_social ul > li > a { display: block; width: 30px; height: 30px; border: 1px solid transparent; border-radius: 0.25rem; font-size: 18px; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: flex; align-items: center; justify-content: center; transition: all 0.25s ease-in-out; color: #3f4553; }
#ft_social ul > li > a:hover { background: #3f4553; border-color: #3f4553; color: #fff; }

#ft_copy { clear: both; padding: 10px 0; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: flex-end; text-align: right; height: 50px; }
#ft_link h3 { display: none; }
#ft_link a {}
#ft_link a:hover {}

#ft_goto { position: fixed; right: 2rem; bottom: -5px; z-index: 99; opacity: 0; visibility: hidden; transition: all 0.25s; }
#ft_goto #totop { display: block; width: 45px; height: 45px; -webkit-box-flex: 1 0 auto; -moz-box-flex: 1 0 auto; -ms-flex: 1 0 auto; -webkit-flex: 1 0 auto; flex: 1 0 auto; display: flex; align-items: center; justify-content: center; font-size: 20px; border: 1px solid #1696F6; border-radius: 0; background-color: #293991; transition: all 0.2s ease-in-out; border: none; border-radius: 50%; font-size: 14px; font-weight: 700; color: #fff; line-height: 1; }
#ft_goto #totop:hover { background-color: #293991; border: none; color: #fff; }
html:not([data-scroll="0"]) #ft_goto { opacity: 1; visibility: visible; bottom: 4rem; }

html #ft #ft_goto.active{ position: fixed; opacity: 0; bottom: 50px; visibility: hidden; }
html #ft #ft_goto.fixed.active {position: fixed; opacity: 1; top: auto; bottom: 50px; visibility: visible; }
html #ft #ft_goto.fixed{ position: absolute; opacity: 1; top: -25px; bottom: auto; }

/* 반응형 기본 */
/* Media Query - PC First */
/* https://getbootstrap.com/docs/4.6/layout/overview/ */
@media (max-width: 1500px) {
  #hd_wrap { padding: 40px 2rem 0; }
  #ft_wrap, #container { padding: 0 2rem; }
  #hd_user { right: 3rem; } 
  #hd_button,  #hd_toggle { right: 2rem; }
  #ft_link { left: 2rem; }
}
/* X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1400px) {
}
@media (max-width: 1200px) {
  html { font-size: 15px; }
  #container { padding: 0 2rem; }
  #hd_search { left: 50%; right: auto; transform: translate(-50%,-50%); }
  #hd_search #sch_stx { width: auto; }
  #hd_button { display: none; }
  #hd_gadget { display: none; }
  #hd_mapper { display: none; }
  #hd_toggle { display: flex; }
  #gnb { display: none; }
  #vis #titler { height: 300px; }
  #vis #titler .leader { font-size: 2rem; }
  #ft_sign, #ft_info, #ft_family, #ft_social, #ft_link, #ft_copy { float: none; }
  #ft_sign { margin: 20px; max-width: none; }
  #ft_info, #ft_link, #ft_copy { text-align: center; }
  #ft_info { max-width: none; }
  #ft_info .ft_comp > ul { -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; }
  #ft_info .ft_comp > ul > li > dl { margin-left: 0.75em; }
  #ft_info .ft_comp > ul > li > dl > dd { margin-right: 0.75em; }
  #ft_family, #ft_social { width: calc(100% - 40px); }
  #ft_family + #ft_social { margin-top: 0; }
  #ft_link { margin-left: 20px; }
  #ft_copy { margin-right: 20px; }
}
/* Medium devices (tablets, less than 992px) */
@media (max-width: 992px) {
}
/* Small devices (landscape phones, less than 768px) */
@media (max-width: 768px) {
  html { font-size: 14px; }
  #container, #ft_wrap { padding: 0 1rem; }
  #container { margin: 3.5rem auto 75px; }
  #hd_wrap { padding: 40px 1rem 0; }
  #hd_user { right: 1.5rem; } 
  #hd_toggle { right: 1rem; }
  #hd_contact { display: none; }
  #hd_search { display: none; }
  #ft_link { position: static; left: auto; right: auto; margin: 0; }
  #ft_link > ul > li { margin: 0 0.375rem; }
  #ft_copy { margin: 0; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; }
}
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 576px) {
  .mb_form, .mb_join { width: calc(100% - 20px); }
}