/* @charset "utf-8"; */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;700&display=swap');

/*  Reset CSS */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; font-family: 'Noto Sans KR', sans-serif; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; color: #111; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
a { text-decoration: none; }

* { margin: 0; padding: 0; box-sizing: border-box; }
*:focus { outline: none !important; box-shadow: none !important; }
*:hover { -webkit-transition: all 0.2s; transition: all 0.2s; }
body { font-size: 14px; line-height: 28px; letter-spacing: -0.5px; font-family: 'Noto Sans KR', sans-serif; color: #333; }
section { margin-top: 100px; margin-bottom: 80px; min-height: calc(100vh - 380px); position: relative; }
pre { line-height: 16px; overflow: inherit; }

.pointer:hover { cursor: pointer; }
.clear { clear: both; }
/* === Design Setting === */


/* = width = */
.w-10 { width: 10%; } .w-20 { width: 20%; } .w-30 { width: 30%; } .w-40 { width: 40%; } .w-50 { width: 50%; }
.w-60 { width: 60%; } .w-70 { width: 70%; } .w-80 { width: 80%; } .w-90 { width: 90%; } .vw-100 {width: 100vw;} 
.w-100px { width: 100px; } .w-140px { width: 140px; } .w-300px { width: 300px; }

/* = height = */
.h-10 { height: 10%; } .h-20 { height: 20%; } .h-30 { height: 30%; } .h-40 { height: 40%; } .h-50 { height: 50%; }
.h-60 { height: 60%; } .h-70 { height: 70%; } .h-80 { height: 80%; } .h-90 { height: 90%; } .vh-100 { height: 100vh; }

/* = margin = */
.m-2px { margin: 2px; } .m-4px { margin: 4px; } .m-6px { margin: 6px; } .m-8px { margin: 8px; } .m-10px { margin: 10px; }
.m-12px { margin: 12px; } .m-14px { margin: 14px; } .m-16px { margin: 16px; } .m-18px { margin: 18px; } .m-20px { margin: 20px; }
.m-30px { margin: 30px; } .m-40px { margin: 40px; } .m-50px { margin: 50px; } .m-60px { margin: 60px; }
.m-70px { margin: 70px; } .m-80px { margin: 80px; } .m-90px { margin: 90px; } .m-100px { margin: 100px; }
.m-120px { margin: 120px; } .m-140px { margin: 140px; } .m-160px { margin: 160px; } .m-180px { margin: 180px; } .m-200px { margin: 200px;}

.mt-2px { margin-top: 2px; } .mt-4px { margin-top: 4px; } .mt-6px { margin-top: 6px; } .mt-8px { margin-top: 8px; } .mt-10px { margin-top: 10px; }
.mt-12px { margin-top: 12px; } .mt-14px { margin-top: 14px; } .mt-16px { margin-top: 16px; } .mt-18px { margin-top: 18px; } .mt-20px { margin-top: 20px; }
.mt-30px { margin-top: 30px; } .mt-40px { margin-top: 40px; } .mt-50px { margin-top: 50px; } .mt-60px { margin-top: 60px; }
.mt-70px { margin-top: 70px; } .mt-80px { margin-top: 80px; } .mt-90px { margin-top: 90px; } .mt-100px { margin-top: 100px; }
.mt-120px { margin-top: 120px; } .mt-140px { margin-top: 140px; } .mt-160px { margin-top: 160px; } .mt-180px { margin-top: 180px; }.mt-200px { margin-top: 200px;}

.mb-2px { margin-bottom: 2px; } .mb-4px { margin-bottom: 4px; } .mb-6px { margin-bottom: 6px; } .mb-8px { margin-bottom: 8px; } .mb-10px { margin-bottom: 10px; }
.mb-12px { margin-bottom: 12px; } .mb-14px { margin-bottom: 14px; } .mb-16px { margin-bottom: 16px; } .mb-18px { margin-bottom: 18px; } .mb-20px { margin-bottom: 20px; }
.mb-30px { margin-bottom: 30px; } .mb-40px { margin-bottom: 40px; } .mb-50px { margin-bottom: 50px; } .mb-60px { margin-bottom: 60px; }
.mb-70px { margin-bottom: 70px; } .mb-80px { margin-bottom: 80px; } .mb-90px { margin-bottom: 90px; } .mb-100px { margin-bottom: 100px; }
.mb-120px { margin-bottom: 120px; } .mb-140px { margin-bottom: 140px; } .mb-160px { margin-bottom: 160px; } .mb-180px { margin-bottom: 180px; } .mb-200px { margin-bottom: 200px;}

.ml-2px { margin-left: 2px; } .ml-4px { margin-left: 4px; } .ml-6px { margin-left: 6px; } .ml-8px { margin-left: 8px; } .ml-10px { margin-left: 10px; }
.ml-12px { margin-left: 12px; } .ml-14px { margin-left: 14px; } .ml-16px { margin-left: 16px; } .ml-18px { margin-left: 18px; } .ml-20px { margin-left: 20px; }
.ml-30px { margin-left: 30px; } .ml-40px { margin-left: 40px; } .ml-50px { margin-left: 50px; } .ml-60px { margin-left: 60px; }
.ml-70px { margin-left: 70px; } .ml-80px { margin-left: 80px; } .ml-90px { margin-left: 90px; } .ml-100px { margin-left: 100px; }
.ml-120px { margin-left: 120px; } .ml-140px { margin-left: 140px; } .ml-160px { margin-left: 160px; } .ml-180px { margin-left: 180px; } .ml-200px { margin-left: 200px;}

.mr-2px { margin-right: 2px; } .mr-4px { margin-right: 4px; } .mr-6px { margin-right: 6px; } .mr-8px { margin-right: 8px; } .mr-10px { margin-right: 10px; }
.mr-12px { margin-right: 12px; } .mr-14px { margin-right: 14px; } .mr-16px { margin-right: 16px; } .mr-18px { margin-right: 18px; } .mr-20px { margin-right: 20px; }
.mr-30px { margin-right: 30px; } .mr-40px { margin-right: 40px; } .mr-50px { margin-right: 50px; } .mr-60px { margin-right: 60px; }
.mr-70px { margin-right: 70px; } .mr-80px { margin-right: 80px; } .mr-90px { margin-right: 90px; } .mr-100px { margin-right: 100px; }
.mr-120px { margin-right: 120px; } .mr-140px { margin-right: 140px; } .mr-160px { margin-right: 160px; } .mr-180px { margin-right: 180px; } .mr-200px { margin-right: 200px;}

.mx-2px { margin-left: 2px; margin-right: 2px; } .mx-4px { margin-left: 4px; margin-right: 4px; } .mx-6px { margin-left: 6px; margin-right: 6px; } .mx-8px { margin-left: 8px; margin-right: 8px; } .mx-10px { margin-left: 10px; margin-right: 10px; }
.mx-12px { margin-left: 12px; margin-right: 12px; } .mx-14px { margin-left: 14px; margin-right: 14px; } .mx-16px { margin-left: 16px; margin-right: 16px; } .mx-18px { margin-left: 18px; margin-right: 18px; } .mx-20px { margin-left: 20px; margin-right: 20px; }
.mx-30px { margin-left: 30px; margin-right: 30px; } .mx-40px { margin-left: 40px; margin-right: 40px; } .mx-50px { margin-left: 50px; margin-right: 50px; } .mx-60px { margin-left: 60px; margin-right: 60px; }
.mx-70px { margin-left: 70px; margin-right: 70px; } .mx-80px { margin-left: 80px; margin-right: 80px; } .mx-90px { margin-left: 90px; margin-right: 90px; } .mx-100px { margin-left: 100px; margin-right: 100px; }
.mx-120px { margin-left: 120px; margin-right: 120px; } .mx-140px { margin-left: 140px; margin-right: 140px; } .mx-160px { margin-left: 160px; margin-right: 160px; } .mx-180px { margin-left: 180px; margin-right: 180px; } .mx-200px { margin-left: 200px; margin-right: 200px;}

.my-2px { margin-top: 2px; margin-bottom: 2px; } .my-4px { margin-top: 4px; margin-bottom: 4px; } .my-6px { margin-top: 6px; margin-bottom: 6px; } .my-8px { margin-top: 8px; margin-bottom: 8px; } .my-10px { margin-top: 10px; margin-bottom: 10px; }
.my-30px { margin-top: 30px; margin-bottom: 30px; } .my-40px { margin-top: 40px; margin-bottom: 40px; } .my-50px { margin-top: 50px; margin-bottom: 50px; } .my-60px { margin-top: 60px; margin-bottom: 60px; }
.my-12px { margin-top: 12px; margin-bottom: 12px; } .my-14px { margin-top: 14px; margin-bottom: 14px; } .my-16px { margin-top: 16px; margin-bottom: 16px; } .my-18px { margin-top: 18px; margin-bottom: 18px; } .my-20px { margin-top: 20px; margin-bottom: 20px; }
.my-70px { margin-top: 70px; margin-bottom: 70px; } .my-80px { margin-top: 80px; margin-bottom: 80px; } .my-90px { margin-top: 90px; margin-bottom: 90px; } .my-100px { margin-top: 100px; margin-bottom: 100px; }
.my-120px { margin-top: 120px; margin-bottom: 120px; } .my-140px { margin-top: 140px; margin-bottom: 140px; } my-160px { margin-top: 160px; margin-bottom: 160px; } .my-180px { margin-top: 180px; margin-bottom: 180px; } .my-200px { margin-top: 200px; margin-right: 200px;}

/* = padding = */
.p-2px { padding: 2px; } .p-4px { padding: 4px; } .p-6px { padding: 6px; } .p-8px { padding: 8px; } .p-10px { padding: 10px; }
.p-12px { padding: 12px; } .p-14px { padding: 14px; } .p-16px { padding: 16px; } .p-18px { padding: 18px; } .p-20px { padding: 20px; }
.p-30px { padding: 30px; } .p-40px { padding: 40px; } .p-50px { padding: 50px; } .p-60px { padding: 60px; }
.p-70px { padding: 70px; } .p-80px { padding: 80px; } .p-90px { padding: 90px; } .p-100px { padding: 100px; }
.p-120px { padding: 120px; } .p-140px { padding: 140px; } .p-160px { padding: 160px; } .p-180px { padding: 180px; } .p-200px { padding: 200px; }

.pt-2px { padding-top: 2px; } .pt-4px { padding-top: 4px; } .pt-6px { padding-top: 6px; } .pt-8px { padding-top: 8px; } .pt-10px { padding-top: 10px; }
.pt-12px { padding-top: 12px; } .pt-14px { padding-top: 14px; } .pt-16px { padding-top: 16px; } .pt-18px { padding-top: 18px; } .pt-20px { padding-top: 20px; }
.pt-30px { padding-top: 30px; } .pt-40px { padding-top: 40px; } .pt-50px { padding-top: 50px; } .pt-60px { padding-top: 60px; }
.pt-70px { padding-top: 70px; } .pt-80px { padding-top: 80px; } .pt-90px { padding-top: 90px; } .pt-100px { padding-top: 100px; }
.pt-120px { padding-top: 120px; } .pt-140px { padding-top: 140px; } .pt-160px { padding-top: 160px; } .pt-180px { padding-top: 180px; } .pt-200px { padding-top: 200px; }

.pb-2px { padding-bottom: 2px; } .pb-4px { padding-bottom: 4px; } .pb-6px { padding-bottom: 6px; } .pb-8px { padding-bottom: 8px; } .pb-10px { padding-bottom: 10px; }
.pb-12px { padding-bottom: 12px; } .pb-14px { padding-bottom: 14px; } .pb-16px { padding-bottom: 16px; } .pb-18px { padding-bottom: 18px; } .pb-20px { padding-bottom: 20px; }
.pb-30px { padding-bottom: 30px; } .pb-40px { padding-bottom: 40px; } .pb-50px { padding-bottom: 50px; } .pb-60px { padding-bottom: 60px; }
.pb-70px { padding-bottom: 70px; } .pb-80px { padding-bottom: 80px; } .pb-90px { padding-bottom: 90px; } .pb-100px { padding-bottom: 100px; }
.pb-120px { padding-bottom: 120px; } .pb-140px { padding-bottom: 140px; } .pb-160px { padding-bottom: 160px; } .pb-180px { padding-bottom: 180px; } .pb-200px { padding-bottom: 200px; }

.pl-2px { padding-left: 2px; } .pl-4px { padding-left: 4px; } .pl-6px { padding-left: 6px; } .pl-8px { padding-left: 8px; } .pl-10px { padding-left: 10px; }
.pl-12px { padding-left: 12px; } .pl-14px { padding-left: 14px; } .pl-16px { padding-left: 16px; } .pl-18px { padding-left: 18px; } .pl-20px { padding-left: 20px; }
.pl-30px { padding-left: 30px; } .pl-40px { padding-left: 40px; } .pl-50px { padding-left: 50px; } .pl-60px { padding-left: 60px; }
.pl-70px { padding-left: 70px; } .pl-80px { padding-left: 80px; } .pl-90px { padding-left: 90px; } .pl-100px { padding-left: 100px; }
.pl-120px { padding-left: 120px; } .pl-140px { padding-left: 140px; } .pl-160px { padding-left: 160px; } .pl-180px { padding-left: 180px; } .pl-200px { padding-left: 200px; }

.pr-2px { padding-right: 2px; } .pr-4px { padding-right: 4px; } .pr-6px { padding-right: 6px; } .pr-8px { padding-right: 8px; } .pr-10px { padding-right: 10px; }
.pr-12px { padding-right: 12px; } .pr-14px { padding-right: 14px; } .pr-16px { padding-right: 16px; } .pr-18px { padding-right: 18px; } .pr-20px { padding-right: 20px; }
.pr-30px { padding-right: 30px; } .pr-40px { padding-right: 40px; } .pr-50px { padding-right: 50px; } .pr-60px { padding-right: 60px; }
.pr-70px { padding-right: 70px; } .pr-80px { padding-right: 80px; } .pr-90px { padding-right: 90px; } .pr-100px { padding-right: 100px; }
.pr-120px { padding-right: 120px; } .pr-140px { padding-right: 140px; } .pr-160px { padding-right: 160px; } .pr-180px { padding-right: 180px; } .pr-200px { padding-right: 200px; }

.pw-2px { padding-left: 2px; padding-right: 2px; } .pw-4px { padding-left: 4px; padding-right: 4px; } .pw-6px { padding-left: 6px; padding-right: 6px; } .pw-8px { padding-left: 8px; padding-right: 8px; } .pw-10px { padding-left: 10px; padding-right: 10px; }
.pw-12px { padding-left: 12px; padding-right: 12px; } .pw-14px { padding-left: 14px; padding-right: 14px; } .pw-16px { padding-left: 16px; padding-right: 16px; } .pw-18px { padding-left: 18px; padding-right: 18px; } .pw-20px { padding-left: 20px; padding-right: 20px; }
.pw-30px { padding-left: 30px; padding-right: 30px; } .pw-40px { padding-left: 40px; padding-right: 40px; } .pw-50px { padding-left: 50px; padding-right: 50px; } .pw-60px { padding-left: 60px; padding-right: 60px; }
.pw-70px { padding-left: 70px; padding-right: 70px; } .pw-80px { padding-left: 80px; padding-right: 80px; } .pw-90px { padding-left: 90px; padding-right: 90px; } .pw-100px { padding-left: 100px; padding-right: 100px; }
.pw-120px { padding-left: 120px; padding-right: 120px; } .pw-140px { padding-left: 140px; padding-right: 140px; } .pw-160px { padding-left: 160px; padding-right: 160px; } .pw-180px { padding-left: 180px; padding-right: 180px; } .pw-200px { padding-left: 200px; padding-right: 200px; }

.py-2px { padding-top: 2px; padding-bottom: 2px; } .py-4px { padding-top: 4px; padding-bottom: 4px; } .py-6px { padding-top: 6px; padding-bottom: 6px; } .py-8px { padding-top: 8px; padding-bottom: 8px; } .py-10px { padding-top: 10px; padding-bottom: 10px; }
.py-12px { padding-top: 12px; padding-bottom: 12px; } .py-14px { padding-top: 14px; padding-bottom: 14px; } .py-16px { padding-top: 16px; padding-bottom: 16px; } .py-18px { padding-top: 18px; padding-bottom: 18px; } .py-20px { padding-top: 20px; padding-bottom: 20px; }
.py-30px { padding-top: 30px; padding-bottom: 30px; } .py-40px { padding-top: 40px; padding-bottom: 40px; } .py-50px { padding-top: 50px; padding-bottom: 50px; } .py-60px { padding-top: 60px; padding-bottom: 60px; }
.py-70px { padding-top: 70px; padding-bottom: 70px; } .py-80px { padding-top: 80px; padding-bottom: 80px; } .py-90px { padding-top: 90px; padding-bottom: 90px; } .py-100px { padding-top: 100px; padding-bottom: 100px; }
.py-120px { padding-top: 120px; padding-bottom: 120px; } .py-140px { padding-top: 140px; padding-bottom: 140px; } .py-160px { padding-top: 160px; padding-bottom: 160px; } .py-180px { padding-top: 180px; padding-bottom: 180px; } .py-200px { padding-top: 200px; padding-bottom: 200px; }

/* === 헤더 === */
header { position: fixed; width: 100%; top: 0; left: 0; z-index: 30000; }
#htop { width: 100%; height: 40px; border-bottom: 1px solid #dddce3; }
#htop>div, #htop a {color: #666; }
#htopLeft { height: 18px; margin-top: 9px; }
#htopLeft img { height: 18px; }
#gnb { vertical-align: middle; display: inline-block; margin-top: 5px; }
#gnb>div::after { content: ""; display: inline-block; width: 1px; height: 10px; background-color: #999; line-height: 60px; transform: translateX(14px); }
#gnb>div:last-of-type::after { content: none; clear: both; }
#htop a:hover { color: #D23345; }
/* #hbot { width: 100%; height: 80px; border-bottom: 1px solid #ddddec; letter-spacing: -0.04em; } */
#hbot { width: 100%; height: 60px; border-bottom: 1px solid #ddddec; letter-spacing: -0.04em; position: relative; }
#hbot:after { position: absolute; content: ""; width: 100%; height: 1px; background-color: #ddddec; top: 59px; left: 0; }
#lnb { overflow: hidden; height: 60px; z-index: 10001; }
/* .main { width: calc(100% / 5); float: left; text-align: center; position: relative } */
#lnb > ul { display: flex; justify-content: center; }
.main { flex: 1 1 100%; text-align: center; position: relative }
.main>a { width: 100%; height: 60px; line-height: 60px; font-size: 18px; color:#333 }
.main:hover>a, .main.active>a { color: #D23345; }
.main>a::after { content: ""; width: 0; height: 4px; background-color: #D23345; position: absolute; top: 56px; left: 50%; transform: translateX(-50%); transition: all 0.2s; z-index: 10000;}
.main:hover>a::after, .main.active>a::after { width: 100%; }
/* .sub { width: 100%; height: calc((60px * 9) + 24px); padding-top: 12px; position: relative; z-index: 20000; } */
.sub { width: 100%; height: calc(100% - 60px); padding-top: 10px; padding-bottom: 12px; position: relative; z-index: 20000; }
.sub a { display: block; height: 38px; font-size: 16px; color: #333; }
.sub a > div { height: 100% !important; display: flex; justify-content: center; align-items: center; }
.sub a:hover > div > p, .sub a.active > div > p { color: #D23345; font-weight: bold; }
#menuback { top: 100px; height: 100%; border-bottom: 1px solid #e5e5e5; z-index: 10000; display: none; }
.sub > li > a > div > p { line-height: 20px; }

/* == Mobile Menu == */
#ham { color: #333; display:none; width: 40px; height: 40px; font-size: 40px; border: none; }
#mback { top: 0; bottom: 0; left: 0; right: 0; background-color: black; opacity: 0.5; z-index: 10000; display: none; }
#mmenu { box-sizing: border-box; width: 280px; height: 100%; top: 0; right: -280px; z-index: 20000; }
#mgnb { border-bottom: 2px solid #aaa; }
#mgnb > li { width: 100%; }
#mgnbTop > button { float: left; height: 50px; width: 50%; border: none; background-color: transparent; }
#mgnbTop > button > a { display: block; color: #fff; height: 100%; line-height: 50px; }
#mgnbTop > button:first-of-type > a { background-color: #D23345; text-align: center; }
#mgnbTop > button:last-of-type > a { background-color: #333; }
#mgnbBot { margin: 8px 0; }
#mgnbBot a { color: #333; }
#mgnbBot a:first-of-type { margin-right: 8px; }
#mgnbBot a:first-of-type::after { content: ""; display: inline-block; width: 1px; height: 10px; background-color: #999; line-height: 60px; transform: translateX(10px); }
#mgnbBot a:last-of-type { margin-left: 8px; }
#mgnbBot span { margin: 0 10px; }
#mlnb { height: calc(100% - 104px); overflow: auto; }
.mmain { border-bottom: 1px solid #dddce3; }
.mmain > a { width: 100%; height: 60px; line-height: 60px; color: #333; font-weight: bold; }
.mmain > a:hover { color: #333; }
.mmain.active > a { color: #D23345 }
.mmain > a > div { float: right; width: 20px; height: 20px; margin-right: 11px; margin-top: 20px; position: relative; }
.msub { display: none; }
.msub a { color: #666; font-size: 0.92em; background: #f0f0f0; font-weight: bold; height: 45px; line-height: 45px; padding-left: 20px; display: block; border-bottom: 1px solid #e0e0e0; }
.msub a.active { color: #D23345; }

/* === section === */
.listdash > li { margin-left: 5px; padding-left: 6px; list-style-type: "\2d"; }
.listdecimal > li { margin-left: 5px; padding-left: 6px; list-style-type: decimal; }

/* == 메인비주얼 == */
.subpageBg { height:160px; }
.subpageBg::after { content: ""; position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.64); top: 0; left: 0; }
.subpageBg img { position:absolute; top: 50%; transform: translate(0, -50%); width: 100%; }
.subpageBg p { font-size:34px; text-align:center; position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 4; }

/* == 브레드크럼 == */
.breadcrumbBar { margin-top: 40px; margin-bottom: 20px; }
.breadcrumbBar > nav { height: 30px !important; }
.breadcrumb { margin-bottom: 0; }
.breadcrumb li { color: #6c757d; }

/* == 페이지 내용 == */
.form-check .form-check-input { margin-left: -20px !important; }
.form-check { padding-left: 20px !important; }

/* = 탭메뉴 = */
.tabbtnbox { width: 100%; overflow: auto; margin-bottom: 40px; display: flex; flex-wrap: wrap; }
.tabbtn { font-size: 16px; line-height: 16px; height: 50px; border: 1px solid #888; border-right: 0; background-color: white; color: #888; cursor: pointer; float: left; }
.tabbtn:last-of-type { border-right: 1px solid #888; }
.tabbtn:hover, .tabbtn.active { background-color: #D23345; border: #D23345; color: white; }
.bidtab { font-size: 16px; line-height: 16px; height: 50px; border: 1px solid #888; border-right: 0; background-color: white; color: #888; cursor: pointer; float: left; }
.bidtab:last-of-type { border-right: 1px solid #888; }
.bidtab:hover, .bidtab.active { background-color: #D23345; border: #D23345; color: white; }
.tabcont { display: none; }
.tabcont:first-of-type { display: block; }
#tabHistory > button { width: calc(100% / 5); }
#tabCommonSense > button { width: calc(100% / 5); }
#tabBidInfo > button { width: calc(100% / 7); }

.tabCommonSenseCont > .tabcont > p > span { font-size: 18px; font-weight: bold; line-height: 18px; color: #555; }
.tabCommonSenseCont > .tabcont .cmListLv1 > li { margin-top: 40px; }
.tabCommonSenseCont > .tabcont .cmListLv1 > li > p:first-of-type { font-size: 20px; line-height: 20px; margin-bottom: 10px; margin-top: 20px; font-weight: bold; color: #D23345; }
.tabCommonSenseCont > .tabcont .cmlistdash > li { margin-left: 5px; padding-left: 6px; list-style-type: "\2d"; }
.tabCommonSenseCont > .tabcont .cmAccList > li > p:first-of-type { margin-bottom: 10px; font-size: 18px; line-height: 18px; font-weight: bold; }
.tabCommonSenseCont > .tabcont .cmListLv2 > li { margin-top: 20px; margin-left: 14px; }
.tabCommonSenseCont > .tabcont .cmListLv2 > li > p:first-of-type { font-size: 18px; line-height: 18px; margin-bottom: 10px; margin-top: 20px; font-weight: bold; }
.tabCommonSenseCont > .tabcont .cmListLv3 > li { margin-left: 14px; margin-bottom: 10px; }
.tabCommonSenseCont > .tabcont .cmListLv3 > li > p { font-weight: bold; }
.tabCommonSenseCont > .tabcont .csimg1ul { display: flex; flex-wrap: wrap; }
.tabCommonSenseCont > .tabcont .csimg1ul > div { flex: 1 1 50%; display: flex; }
.tabCommonSenseCont > .tabcont .csimg1ul > div > ul { flex: 1 1 50%; }
.tabCommonSenseCont > .tabcont .csimg2ul { display: flex; flex-wrap: wrap; }
.tabCommonSenseCont > .tabcont .csimg2ul > ul { flex: 1 1 25%; }
.csimg { max-width: 600px; width: 100%; }

/* = 아코디언 = */
#dictionaryAccordian .accli:last-of-type { border-bottom: 1px solid #cfcfcf;}
#dictionaryAccordian .accli .accbtn { border-top: 1px solid #cfcfcf; font-weight: bold; padding: 16px 20px; cursor: pointer; min-height: 80px; display: flex; justify-content: space-between; align-items: center; }
#dictionaryAccordian .accli .accbtn > div { display: inline-block; }
#dictionaryAccordian .accli .accbtn > div > p { font-size: 14px; line-height: 18px !important; }
#dictionaryAccordian .accli .accbtn > div > p:last-of-type { margin-top: 10px; }
#dictionaryAccordian .accli .accbtn > i { font-size: 1.5em; vertical-align: -0.1em; display: inline-block; transition: all 0.4s; margin-left: 30px; }
#dictionaryAccordian .accli .acccont { width: 100%; border-top: 1px solid #cfcfcf; background-color: #F8F9FA; padding: 30px 40px; line-height: 22px; display: none; }
#dictionaryAccordian .aactive { border-left: 5px solid #D23345;}
#dictionaryAccordian .aactive > .accbtn { color: #D23345; }

#commonSenseAccordion { border: 1px solid #dee2e6; border-radius: 6px; }
#commonSenseAccordion .accordion, #commonSenseAccordion .accordion-item, #commonSenseAccordion .accordion-button { background-color: transparent; }
#commonSenseAccordion .accordion-button:not(.collapsed) { color: #d23345; font-weight: bold; background-color: transparent; box-shadow: none !important; border-bottom: 1px solid #d23345; }
#commonSenseAccordion .accordion-button:not(.collapsed)::after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23D23345'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }

#organizationAccordion { border-radius: 6px; }
#organizationAccordion .subTitle1{ margin: 10px 0; }
#organizationAccordion .accordion, #organizationAccordion .accordion-item, #organizationAccordion .accordion-button { background-color: transparent; }
#organizationAccordion .accordion-button:not(.collapsed) { color: #333; background-color: transparent; box-shadow: none !important; border-bottom: none; }
#organizationAccordion .accordion-button:not(.collapsed)::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23D23345'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }

/* = 목록으로 = */
.listBack { margin-bottom: 20px; }
.listBack a { color: #333; }

/* = 서치바 = */
.searchBar { width: 100%; padding: 12px 12px; background-color: #F0F1F2; margin-bottom: 40px; }
.searchBar > .searchSelectGroup { float: left; }
.searchBar > .searchInputGroup { float: right; }
.searchBar > .searchSelectGroup > ul > li { margin-right: 16px; display: inline-block; }
.searchBar > .searchInputGroup > ul > li { display: inline-block; }
.searchBar > div > ul > li:last-of-type { margin-right: 0; }
.searchBar > div > ul > li > p { width: auto; margin-right: 6px; display: inline-block; }
.searchBar > div > ul > li > select { width: auto; display: inline-block; }
.searchBar .input-group { width: 300px; }
.btnSearch { background-color: #D23345; border: 0; color:#fff; width: 40px; border-radius: 0 6px 6px 0; }
.btnSearch:hover { background-color: #b32535; border: 0; color:#fff; }

/* = 조선용어집 = */
.dictionarySearch { background-color: #F0F1F2; margin-bottom: 20px; padding: 30px; border-radius: 8px; text-align: center; }
.dictionarySearch > div > p { font-weight: bold; font-size: 20px; margin-bottom: 6px; }
.dictionarySearch > div > div { display: flex; justify-content: center; flex-wrap: wrap; margin: 0 auto; }
.dictionarySearch >.korBtnBox > div { max-width: 364px; }
.dictionarySearch >.engBtnBox > div { max-width: 676px; }
.dictionarySearch > div > div > button { margin: 4px 4px; width: 44px; height: 44px; border-radius: 22px; font-size: 18px; font-weight: bold; background-color: #fff; color: #D23345; border: 1px solid #D23345; }
.dictionarySearch > div > div > button:hover, .dictionarySearch > div > div > div > button.active { color: #fff; background-color: #D23345; }
.dictionarySearch > div > div > button.btnActive { background-color: #D23345; border: #D23345; color: white; }

/* = 페이지네이션 = */
#paginationBar { position: relative; margin-top: 40px; }
#paginationBar .page-link { border: 0; }
#paginationBar .page-link:hover { background-color: transparent; }
.active>.page-link, .page-link.active { background-color: transparent; font-weight: bold; color: #D23345 !important; }
#paginationBar .page-link:focus { background-color: transparent; }
#paginationBar .page-arrow { font-size: 20px; color: #D23345 }
#paginationBar a { color: #333; line-height: 28px; }
#paginationBar .tablePostBtn, #paginationBar .tableListDownBtn { height: 40px; position: absolute; top: 0; right: 0; width: auto; padding: 0 30px; border: none; background-color: #D23345; z-index: 100; border-radius: 4px; }
#paginationBar .tablePostBtn:hover, #paginationBar .tableListDownBtn:hover { background-color: #b32535; }
#paginationBar .tablePostBtn > a, #paginationBar .tableListDownBtn > a { color: #fff; font-weight: bold; }

/* = 테이블 = */
.tableBasic { table-layout: fixed; margin-bottom: 0px; border-top: 4px solid #D23345; }
.tableBasic thead { font-weight: bold; background-color: #f0f1f2; border-bottom: 2px solid #333; }
.tableBasic tbody tr { border-bottom: 1px solid #ccc; }
.tableBasic th, .tableBasic td { height: 54px; padding: 6px !important; text-align: center; border-right: 1px solid #ccc; vertical-align: middle; line-height: 1.2rem; }
.tableBasic > thead > tr > th:last-of-type, .tableBasic > tbody > tr > td:last-of-type { border-right: none; }
.tableBasic a { color: #333; display: block; line-height: 1.2rem; }
.tableBasic a:hover { color: #0D6EFD; }
.tableBasic a span { font-size: 18px; color: #D23345; }
.tableBasic tbody tr .tableTitleCont { text-align: left; }
.tableBasic tbody tr .tableTitleCont a { color: #333; display: block; padding-left: 10px; max-width: 95%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break: break-all; }
.tableBasic tbody tr:last-of-type { border-bottom: 2px solid #333; }
.tableBasic .noFound { text-align: center; font-weight: bold; font-size: 20px; padding: 40px 0 !important; }

.commonSenseTableBox { display: flex; flex-wrap: wrap; }
.commonSenseTableBox * { text-align: center; padding: 0; }
.commonSenseTable { text-align: center; border-bottom: 2px solid #333; border-left: 1px solid #333; width: 33.33%; }
.commonSenseTable:nth-of-type(1), .commonSenseTable:nth-of-type(2), .commonSenseTable:nth-of-type(3) { border-top: 4px Solid #333; }
.commonSenseTable:nth-of-type(3), .commonSenseTable:nth-of-type(6), .commonSenseTable:nth-of-type(9), .commonSenseTable:nth-of-type(12), .commonSenseTable:nth-of-type(15), .commonSenseTable:nth-of-type(16) { border-right: 1px solid #333; }
.commonSenseTable .th { height: 36px; line-height: 36px; background-color: #f0f1f2; font-weight: bold; border-bottom: 1px solid #ccc; }
.commonSenseTable .tbody { height: 100%; }
.commonSenseTable ul li { height: 36px; line-height: 36px; }
.commonSenseTable .leftRow { border-right: 1px solid #ccc; }
.commonSenseTable .leftRow, .commonSenseTable .rightRow { width: 50%; height: calc(100% - 36px) !important; float: left; }

.tableBusiness th { font-weight: bold; background-color: #f0f1f2; width: 30%; }
.tableBusiness td { text-align: left; padding: 12px !important;}
.tableBusiness td ul { margin-left: 5px; }
.tableBusiness td ul li { margin-left: 5px; margin-bottom: 4px; padding-left: 6px; list-style-type: "\2d"; }
.tableBusiness td a.bt-file { color: #0D6EFD; text-decoration: underline; display: inline; }
.tableBusiness td a.bt-file:hover { font-weight: bold; }
.businessTable .subTitle1 { margin-bottom: 20px; }

.tableMemberInfo { width: 100%; border-top: 4px solid #D23345; margin-bottom: 60px; border-bottom: 2px solid #333; }
.tableMemberInfo > li > ul { display: flex; }
.memberInfoTr { min-height: 54px; }
.memberInfoTr > ul { min-height: 54px; display: flex; }
.tableMemberInfo > li > ul > .memberInfoTr { width: 50%; }
.tableMemberInfo > .memberInfoTr { width: 100%; }
.memberInfoTh, .memberInfoTd { display:flex; align-items: center; line-height: 1.2rem; padding: 10px; }
.memberInfoTh { width: 140px; background-color: #f0f1f2; justify-content: center; font-weight: bold; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; }
.tableMemberInfo > li > ul > .memberInfoTr > ul > .memberInfoTd { width: calc(100% - 140px); padding-left: 14px; border-bottom: 1px solid #ccc; }
.tableMemberInfo > li > ul > .memberInfoTr:first-of-type > ul > .memberInfoTd { border-right: 1px solid #ccc; }
.tableMemberInfo > .memberInfoTr > ul > .memberInfoTd { width: calc(100% - 140px); padding-left: 14px; border-bottom: 1px solid #ccc; }
.tableMemberInfo > .memberInfoTr:last-of-type .memberInfoTh, .tableMemberInfo > .memberInfoTr:last-of-type .memberInfoTd { border-bottom: 0; }
.memberInfoTd > a { color: #333; }
.memberInfoTd > a:hover { color: #0D6EFD; }

.memberPageTitle { font-weight: bold; font-size: 28px; line-height: 28px; display: inline-block;margin-bottom: 40px !important; }
.memberResultTitle { font-weight: bold; font-size: 24px; line-height: 24px; text-align: center; display: inline-block; margin-bottom: 30px; position: relative; }
.memberResultTitle::before { position: absolute; content: ""; width: 20px; height: 4px; background-color: #D23345; top: 50%; left: -20px; transform: translate(-50%, 0) }
.memberResultTitle::after { position: absolute; content: ""; width: 20px; height: 4px; background-color: #D23345; top: 50%; right: -40px; transform: translate(-50%, 0) }

.noticeViewTable thead { border-top: 4px solid #D23345; border-bottom: 1px solid #ccc; min-height: 52px; line-height: 52px;}
.noticeViewTable tbody tr { border-bottom: 1px solid #ccc; font-size: 16px; }
.noticeViewTable tbody tr:first-of-type, .noticeViewTable .attachedFileList, .noticeViewTable tbody .noticeViewContent, .noticeViewTable tbody tr:last-of-type { border-bottom: 2px solid #333; }
.noticeViewTable tbody a { color: #333; }
.noticeViewTable tbody a:hover { font-weight: bold; }
.noticeViewContent > td { padding-top: 50px !important; padding-bottom: 50px !important; }
.noticeViewContent > td * { all: revert-layer; }
.noticeViewContent pre { white-space: pre-wrap; }
.noticeViewContent > td > img { width: 100%;; }
.noticeViewContList { display: inline-block; font-weight: bold; width: 100px; }
/* .attachedFileList > li { line-height: 1.2rem; } */
.attachedFileList > td > p { font-weight: bold; margin-right: 10px; display: inline-block; vertical-align: top; }
.attachedFileList > td > ul { display: inline-block; vertical-align: top; }
.attachedFileList > td > ul > li > a { text-decoration: underline; color: #0D6EFD !important; line-height: 1.2rem; display: inline-block; }
.marketInfo { margin-bottom: 40px; }
.marketInfo > li { margin-bottom: 4px;}
.marketInfo > li > span { font-weight: bold; display: inline-block; width: 60px; }
.list-bottom button { border: none; height: 40px; font-weight: bold; background-color: #D23345; width: 100px; border-radius: 0; border-radius: 4px; }
.list-bottom button:hover, .list-bottom button:focus { background-color: #D23345; border-color: #D23345; }
.list-bottom button#btnBack { color: #FFF; }

.marketInfoInput .form-check-input[type=radio] { margin-top: 8px; }
.marketInfoInput textarea.form-control { min-height: 300px !important; }

#marketModal .modal { display: none; position: fixed; z-index: 100000; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,0.5); overflow: auto; }
#marketModal .modalwin { opacity: 0; background-color: white; border-radius: 8px; box-shadow: 0 10px 18p rgba(0,0,0,0.5); max-width: 500px; width: calc(100% - 30px); margin: 50px auto; }
#marketModal .modalhead { padding: 10px; border-bottom: 1px solid #ccc; }
#marketModal .modalhead > span { font-size: 20px; font-weight: bold; }
#marketModal .modalclose { float: right; width: 31px; height: 31px; border: none; background-color: transparent; font-size: 42px; display: flex; align-items: center; justify-content: center; }
#marketModal .modalcont { padding: 30px; border-bottom: 1px solid #ccc; }
#marketModal .modalcont > p { margin-bottom: 18px; }
#marketModal .modalfoot { padding: 10px; text-align: right; }
#marketModal .modalBtn { background-color: #D23345; color: white; border: none; }
#marketModal .modalBtn:hover { background-color: #b32535; color: white;}

.tableNormal > thead > tr > th:nth-of-type(1), .tableNormal > thead > tr > th:nth-of-type(1) { width: 8%; }
.tableNormal > thead > tr > th:nth-of-type(2), .tableNormal > thead > tr > th:nth-of-type(2) { width: 72%; }
.tableNormal > thead > tr > th:nth-of-type(3), .tableNormal > thead > tr > th:nth-of-type(3) { width: 12%; }
.tableNormal > thead > tr > th:nth-of-type(4), .tableNormal > thead > tr > th:nth-of-type(4) { width: 8%; }

.tableMarket > thead > tr > th:nth-of-type(1), .tableMarket > thead > tr > th:nth-of-type(1) { width: 8%; }
.tableMarket > thead > tr > th:nth-of-type(2), .tableMarket > thead > tr > th:nth-of-type(2) { width: 64%; }
.tableMarket > thead > tr > th:nth-of-type(3), .tableMarket > thead > tr > th:nth-of-type(3) { width: 8%; }
.tableMarket > thead > tr > th:nth-of-type(4), .tableMarket > thead > tr > th:nth-of-type(4) { width: 12%; }
.tableMarket > thead > tr > th:nth-of-type(5), .tableMarket > thead > tr > th:nth-of-type(5) { width: 8%; }

.tableBidInfo > thead > tr > th:nth-of-type(1), .tableBidInfo > thead > tr > th:nth-of-type(1) { width: 12%; }
.tableBidInfo > thead > tr > th:nth-of-type(2), .tableBidInfo > thead > tr > th:nth-of-type(2) { width: 6%; }
.tableBidInfo > thead > tr > th:nth-of-type(3), .tableBidInfo > thead > tr > th:nth-of-type(3) { width: 38%; }
.tableBidInfo > thead > tr > th:nth-of-type(4), .tableBidInfo > thead > tr > th:nth-of-type(4) { width: 18%; }
.tableBidInfo > thead > tr > th:nth-of-type(5), .tableBidInfo > thead > tr > th:nth-of-type(5) { width: 14%; }
.tableBidInfo > thead > tr > th:nth-of-type(6), .tableBidInfo > thead > tr > th:nth-of-type(6) { width: 12%; }

.tableMemberList > thead > tr > th:nth-of-type(1), .tableMemberList > thead > tr > th:nth-of-type(1) { width: 8%; }
.tableMemberList > thead > tr > th:nth-of-type(2), .tableMemberList > thead > tr > th:nth-of-type(2) { width: 28%; }
.tableMemberList > thead > tr > th:nth-of-type(3), .tableMemberList > thead > tr > th:nth-of-type(3) { width: 12%; }
.tableMemberList > thead > tr > th:nth-of-type(4), .tableMemberList > thead > tr > th:nth-of-type(4) { width: 12%; }
.tableMemberList > thead > tr > th:nth-of-type(5), .tableMemberList > thead > tr > th:nth-of-type(5) { width: 15%; }
.tableMemberList > thead > tr > th:nth-of-type(6), .tableMemberList > thead > tr > th:nth-of-type(6) { width: 25%; }

.organizationTable-executive > thead > tr > th:nth-of-type(1), .organizationTable-executive > thead > tr > th:nth-of-type(1) { width: 10%; }
.organizationTable-executive > thead > tr > th:nth-of-type(2), .organizationTable-executive > thead > tr > th:nth-of-type(2) { width: 10%; }
.organizationTable-executive > thead > tr > th:nth-of-type(3), .organizationTable-executive > thead > tr > th:nth-of-type(3) { width: 25%; }
.organizationTable-executive > thead > tr > th:nth-of-type(4), .organizationTable-executive > thead > tr > th:nth-of-type(4) { width: 40%; }
.organizationTable-executive > thead > tr > th:nth-of-type(5), .organizationTable-executive > thead > tr > th:nth-of-type(5) { width: 15%; }

.organizationTable-staff > thead > tr > th:nth-of-type(1), .organizationTable-staff > thead > tr > th:nth-of-type(1) { width: 10%; }
.organizationTable-staff > thead > tr > th:nth-of-type(2), .organizationTable-staff > thead > tr > th:nth-of-type(2) { width: 10%; }
.organizationTable-staff > thead > tr > th:nth-of-type(3), .organizationTable-staff > thead > tr > th:nth-of-type(3) { width: 10%; }
.organizationTable-staff > thead > tr > th:nth-of-type(4), .organizationTable-staff > thead > tr > th:nth-of-type(4) { width: 16%; }
.organizationTable-staff > thead > tr > th:nth-of-type(5), .organizationTable-staff > thead > tr > th:nth-of-type(5) { width: 54%; }


.cardListBox .cardImgBox { height: 250px; }
.cardListBox .cardImgBox .card-img-top { height: 100%; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); border-bottom: 1px solid rgba(0, 0, 0, 0.175); }
.cardListBox .card-text a { color: #333; }
.cardListBox .card-text a:hover { color: #0D6EFD; }
.cardListBox .noFound { width: calc(100% - 20px); text-align: center; font-weight: bold; font-size: 20px; margin:0 10px; padding: 50px 0 60px; border-bottom: 1px solid #333; }
.shipListBox .card-body { padding: 16px; }
.shipListBox .card-text .shipInfo { margin-bottom: 20px; }
.shipListBox .card-text .shipInfo:last-of-type { margin-bottom: 8px; }
.shipListBox .card-text .shipInfoTitle { font-size: 12px; line-height: 12px; color: #666; }
.shipListBox .card-text .shipInfoCont { font-size: 16px; line-height: 18px; margin-top: 6px; }
.siteListBox .card-text .siteInfoCont .siteInfoTitle { font-weight: bold; font-size: 18px; line-height: 20px; margin-bottom: 6px; }
.siteListBox .card-body { padding: 20px; }
.siteListBox .card-body .siteInfoCont li.col:first-of-type { padding-right: 0px; }
.siteListBox .card-body .siteInfoCont li.col:last-of-type { padding-left: 0px; }

.ceoListBox .ceoCard { padding: 20px; display: flex; align-items: center; }
.ceoListBox .ceoCard .ceoCardImg { width: 150px; height: 150px; }
.ceoListBox .ceoCard .ceoCardImg img { width: 100%; height: 100%; }
.ceoListBox .ceoCard .ceoCardTxt { padding-left: 20px; width: calc(100% - 150px - 20px -20px); }
.ceoListBox .ceoCard .ceoCardTxt p:nth-of-type(1) { font-weight: bold; font-size: 18px; color: #D23345; margin-bottom: 12px;}
.ceoListBox .ceoCard .ceoCardTxt p:nth-of-type(2) { font-weight: bold; font-size: 22px; line-height: 24px; margin-bottom: 12px;}
.ceoListBox .ceoCard .ceoCardTxt p:nth-of-type(2) > span { display: inline-block; font-weight: normal; font-size: 14px; line-height: 18px;}
.ceoListBox .ceoCard .ceoCardTxt p:nth-of-type(3) { font-size: 16px; }
.ceoListBox { margin-bottom: 80px; }

.joinIntroBox, .temsIntroBox, .formBox { margin: 0 auto; margin-top: 80px; }
.tabcont .formBox { margin-top: 40px; }
.subTitle1 { position: relative; font-weight: bold; font-size: 24px; padding-left: 14px; margin-bottom: 40px; }
.subTitle1::before { position: absolute; content: ""; width: 4px; height: 28px; background-color: #D23345; left: 0; top: 0;}
.subTitle2Box { margin-bottom: 24px; }
.subTitle2Caption { font-size: 14px; line-height: 18px; }
.subTitle2 { font-weight: bold; font-size: 20px; border-bottom: 2px solid #333; padding-bottom: 8px; margin-bottom: 8px;}
.regiFormBox .inputGroup { margin-bottom: 20px; }
.regiFormBox .inputGroup .formLabel { float: left; vertical-align: top; width: 180px; }
.regiFormBox .inputGroup .formInput { float: left; vertical-align: top; font-size: 16px; line-height: 34px; width: calc(100% - 180px);}
.regiFormBox .inputGroup .formInput p { font-size: 14px; line-height: 18px; margin-top: 6px; }
.regiFormBox .idCheckBtn { height: 34px; width: 100px; margin-left: 20px; border: 0; background-color: #D23345; color: #fff; vertical-align: top; }
.regiFormBox .idCheckBtn:hover { background-color: #b32535; }

.bannerFormBox .inputGroup { margin-bottom: 20px; }
.bannerFormBox .inputGroup .formLabel { float: left; vertical-align: top; width: 180px; }
.bannerFormBox .inputGroup .formInput { float: left; vertical-align: top; font-size: 16px; line-height: 34px; width: calc(100% - 180px);}
.bannerFormBox .inputGroup .formInput p { font-size: 14px; line-height: 18px; margin-top: 6px; }
.bannerFormBox .inputGroup input[type=checkbox] { width: 18px; height: 18px; }
.bannerFormBox .inputGroup .form-control[type=file] { border-radius: 0; line-height: 30px; }
.bannerFormBox .inputGroup .bannerRadioGroup label { margin-left: 6px; }

.formBox label, .formBox input, .formBox select { font-size: 16px; height: 34px; line-height: 34px; display: inline-block; }
.formBox input, .formBox select { width: 280px; padding: 0 8px; border: 1px solid #bebebe; color: #333; }
.threeInputBox > input, .threeInputBox > select { width: calc((100% - 60px) / 3); }
.inputGroup .threeInputBox > input, .inputGroup .threeInputBox > select { width: calc((280px - 60px) / 3); }
.twoInputBox > input, .twoInputBox > select { width: calc((100% - 30px) / 2); }
.inputGroup .twoInputBox > input, .inputGroup .twoInputBox > select { width: calc((280px - 30px) / 2); }
.inputDash { height: 34px; width: 30px; position: relative; }
.threeInputBox .inputDash::after { position: absolute; content: ""; height: 2px; width: 12px; background-color: #333; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.twoInputBox > select { float: left; margin-left: 20px; }
.btnRedBox { margin-top: 60px; text-align: center; }
.btnLoginBox { margin-top: 40px; text-align: center; }
.btnRedBox .d-flex { justify-content: space-evenly; }
.btnRedBox button { width: 160px; }
.btnLoginBox button { width: 320px; }
.btnRed { background-color: #D23345; color: #fff; border: 0; height: 40px; border-radius: 4px; font-weight: bold; }
.btnRed > a { display: block; color: #fff; }
.btnRed:hover { background-color: #b32535; }

.btnDarkBox { text-align: center; }
.btnDark { background-color: #333; color: #fff; border: 0; height: 40px; border-radius: 4px; font-weight: bold; }
.btnDark > a { display: block; color: #fff; }
.ceoListBtnBox { display: flex; justify-content: end; }
.ceoListBtnBox .btnDark { width: 260px; }
.ceoListBtnBox .btnDark:last-of-type { margin-left: 8px; }

.findAccountBox { margin-top: 80px; }
.findAccountBox > .tabcontbox > .tabcont > .formBox > div { padding: 40px; border: 1px solid #bebebe; }
.findAccountBox > .tabcontbox > .tabcont > .formBox > div:last-of-type { border-left: 0; }
.findAccountBox .twoInputBox > select { width: calc((100% - 30px) / 2) !important; float: right; margin-left: 0px; margin-top: 10px; }
.findAccountBox .formBox p:last-of-type { font-size: 16px; line-height: 22px; min-height: 66px; }
.loginInquiryBox { margin-top: 40px; text-align: end; }
.loginInquiryBox > p:first-of-type { font-size: 16px; }
.loginInquiryBox > p:last-of-type { font-size: 24px; font-weight: bold; margin-top: 2px; }
.accountPageAlert { margin-top: 80px; }
.accountPageAlert > p:nth-of-type(1) { text-align: center; font-weight: bold; font-size: 24px; color: #D23345; margin-bottom: 20px; }
.accountPageAlert > p:nth-of-type(2) { text-align: center; font-size: 16px; }
.accountPageAlert > .formBox { margin-top: 40px; }
.passwordRule > p { text-align: center; margin-top: 40px; line-height: 22px; padding: 0; }

.joinIntroBox .subTitle1 { margin-bottom: 30px !important; }
.joinIntroBox .bg-light { border-radius: 8px; padding: 30px; font-size: 16px; margin-bottom: 60px; }
.joinIntroBox .bg-light ul { padding-left: 10px; list-style-type: "\2d"; }
.joinIntroBox .bg-light ul li { padding-left: 6px; }
.joinIntroBox .form-check { font-size: 20px; color: #333; }
.joinIntroBox .form-check .form-check-input { margin-left: -30px !important; }
.joinIntroBox .form-check { padding-left: 30px !important; }
.joinIntroBox .agreeBox { height: 100px; padding: 0 10px; border-top: 1px solid #A2A2A2; border-bottom: 1px solid #A2A2A2; display: flex; align-items: center; justify-content: space-between;}
.joinIntroBox .agreeBox:first-of-type { border-bottom: 0; }
.joinIntroBox .agreeBox button { height: 50px; border-radius: 25px; width: 120px; border: 1px solid #999CA1; background-color: #f0f1f2; }
.joinIntroBox .agreeBox button:hover { background-color: #e7e7e9; }
.joinIntroBox .agreeBox button > a { display: block; color: #999CA1; font-size: 16px; }

.temsIntroBox .subTitle2Box { margin-top: 30px; margin-bottom: 10px; }
.temsIntroBox span { display: inline-block; vertical-align: top; }
.temsIntroBox span.temsNum { width: 20px; }
.temsIntroBox span.temsCont { width: calc(100% - 20px); }
.temsIntroBox ul > li > ul{ margin-left: 20px; }

.historyList > li { padding: 0 10px; margin-bottom: 20px; }
.historyYear { font-size: 32px; font-weight: bold; border-top: 4px solid #D23345; color: #D23145; padding: 10px 0 0; }
.historyTxt > li { font-size: 16px; margin-bottom: 34px; border-top: 2px solid #ccc;  padding: 20px 0 0; }
.historyTxt > li > .historyMonth { font-size: 24px; font-weight: bold; width: 70px; color: #707070; }
.historyTxt > li > .historyCont {  width: calc(100% - 70px); }
.historyTxt > li > .historyCont > div { margin-bottom: 16px; }
.historyTxt > li > .historyCont > div:first-of-type { margin-top: 1px; }
.historyTxt > li > .historyCont > div > ul { margin-left: 6px; }
.historyTxt > li > .historyCont > div > ul > li { list-style-type: "\2d"; padding-left: 8px; }

.flucationPage > p { font-size: 16px; }
.flucationPage > .flucationTable > .subTitle1 { margin-top: 40px; }

.mapPage > .mapBox { width: 100%; height: 500px; background-color: #ccc; margin-bottom: 60px; }
.mapPage .subTitle1 { margin-bottom: 8px; }
.mapPage .subTitle1 span { display: inline-block; margin-left: 4px; font-size: 16px; }
.mapPage .col { margin-bottom: 30px; }
.mapPage .col .mapTxt { margin-left: 15px; font-size: 16px; }
.mapPage .col .mapTxt > li > span { font-weight: bold; }
.mapPage .col .mapNaviTxt > li { list-style-type: square; margin-left: 20px; margin-bottom: 10px;; }
.mapPage .col .mapNaviTxt > li > ul > li{ list-style-type: "\2d"; margin-left: 6px; padding-left: 8px; }


.greetingTop { position: relative; height: 390px; }
.greetingTop > .gtTxt > div > i { color: #d23345; font-size: 60px; }
.greetingTop > .gtTxt > div > i.bi-quote::before { margin-left: -8px }
.greetingTop > .gtTxt > div > p { color: #d23345; font-size: 28px; font-weight: bold; line-height: 36px; }
.greetingTop > .gtTxt > div:nth-of-type(2) { width: 50px; height: 2px; background-color: #d23345; margin: 30px 0; }
.greetingTop > .gtTxt > p { font-size: 18px; font-weight: bold; color: #333; }
.greetingTop > .gtImg { position: absolute; top: 60px; right: 0; width: auto; }
.greetingTop > .gtImg > img { width: 220px; margin-left: 10px; }
.greetingTop > .gtImg > p { display: inline-block; text-align: right; font-size: 20px; letter-spacing: 0.08em; margin-top: -10px; transform: translate(0, -6px); }
.greetingTop > .gtImg > p > span { font-size: 32px; font-weight: bold; margin-left: 10px; display: inline-block; }
.greetingBottom { padding: 40px; margin-top: 40px; }

.goalTop { border: 4px solid #d23345; padding: 30px; font-size: 18px; font-weight: bold; letter-spacing: -0.07rem; margin-bottom: 40px; }
.goalBot { margin-top: 20px; padding: 30px; }
.goalBot ul li { list-style-type: decimal; margin-left: 20px; padding-left: 4px; }

.introducePage > div:nth-of-type(1) { margin-bottom: 40px; letter-spacing: -0.09rem; line-height: 24px; }
.introducePage > .purposePaperBox { margin-bottom: 40px; padding: 30px; display: flex; }
.introducePage > .purposePaperBox > div:nth-of-type(1) { width: 320px; margin-right: 30px; }
.introducePage > .purposePaperBox > div:nth-of-type(1) > p { font-weight: bold; font-size: 28px; line-height: 30px; color: #d23345; margin-bottom: 50px; }
.introducePage > .purposePaperBox > div > .purposePageBtn{ width: 100%; border: 0; padding: 2px; background-color: transparent; }
.introducePage > .purposePaperBox > div > .purposePageBtn > img { width: 100%; }
.introducePage > .purposePaperBox > div > .purposePageBtn:hover, .introducePage > .purposePaperBox > div > .purposePageBtn:focus { padding: 0; }
.introducePage > .purposePaperBox > div:nth-of-type(2) { width: calc(100% - 350px); }
.introducePage > .purposePaperBox > div:nth-of-type(2) > p { margin-bottom: 30px; }
.introducePage > .purposePaperBox > div:nth-of-type(2) > p > span { display: inline-block; height: 30px; }
.introducePage > .purposePaperBox > div:nth-of-type(2) > div { text-align: right; }
.introducePage > .purposePaperBox > div:nth-of-type(2) > div > p { margin-bottom: 12px; line-height: 22px; }
.introducePage > .purposePaperBox > div:nth-of-type(2) > div > p:last-of-type { margin-bottom: 0px; }
.introducePage > .purposePaperBox > div:nth-of-type(2) > div > p:last-of-type > span { margin-left: 12px; }
.introducePage > div:nth-of-type(3) { padding: 30px; }
.introducePage > div:nth-of-type(3) > p { font-weight: bold; font-size: 18px; }
.introducePage > div:nth-of-type(3) > ul { margin-top: 12px; }
.introducePage > div:nth-of-type(3) > ul > li { position: relative; padding-left: 22px; }
.introducePage > div:nth-of-type(3) > ul > li > span { position: absolute; left: 0; }
.introBtnBox { margin-top: 40px; }
.introBtnBox { display: flex; justify-content: space-between; }
.introBtnBox .ibRedBox .btnRed:nth-child(1) { width: 140px; }
.introBtnBox .ibDarkBox .btnDark:nth-child(1) { width: 140px; margin-right: 10px; }
.introBtnBox .ibDarkBox .btnDark:nth-child(2) { width: 180px; margin-right: 10px; }
.introBtnBox .ibDarkBox .btnDark:nth-child(3) { width: 260px; }
.introducePage .modal-dialog { max-width: 100% !important; }
.introducePage .modal-dialog .modal-content { width: auto !important; margin: 0 auto; }


/* = organization = */
.orgChartBox { height: 750px; margin-bottom: 50px; }
.orgChartBox div { display: flex; justify-content: center; align-items: center; }
.orgChartBox .orgLevel1 > div { color: #fff; background-color: #D23145; width: 200px; height: 60px; font-size: 22px; font-weight: bold; position: absolute; left: 50%; transform: translate(-50%, 0); }
.orgChartBox .orgLevel1 .orgLevel2 > div { color: #fff; background-color: #560607; width: 200px; height: 60px; text-align: center; font-size: 20px; font-weight: bold; position: absolute; }
.orgChartBox .orgLevel1 .orgLevel2:nth-of-type(1) > div { left: 50%; transform: translate(-450px, 0); }
.orgChartBox .orgLevel1 .orgLevel2:nth-of-type(2) > div { left: 50%; transform: translate(250px, 0); }
.orgChartBox .orgLevel1 .orgLevel2:nth-of-type(3) > div { left: 50%; transform: translate(-50%, 0); }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 > div { color: #560607; background-color: #fff; border: 2px solid #560607; width: 200px; height: 60px; text-align: center; font-size: 16px; font-weight: bold; letter-spacing: -0.06em; position: absolute; }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(1) > div { left: 50%; transform: translate(-450px, 0); }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(2) > div { left: 50%; transform: translate(250px, 0); }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(3) > div { left: 50%; transform: translate(-50%, 130px); }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:last-of-type > div { color: #FFF; background-color: #534544; border: 0; width: 200px; height: 60px; text-align: center; font-size: 18px; font-weight: bold; }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4 > div { color: #FFF; background-color: #827F7A; width: 200px; height: 60px; text-align: center; font-size: 18px; font-weight: bold; position: absolute; }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) > div { left: 50%; transform: translate(-450px, 0); }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) > div { left: 50%; transform: translate(250px, 0); }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4 .orgLevel5 > div { color: #827F7A; background-color: #FFF; border: 2px solid #827F7A; width: 200px; height: 60px; text-align: center; font-size: 16px; font-weight: bold; position: absolute; }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(1) > div { left: 37px; }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(2) > div { left: 357px; }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(1) > div { right: 37px; }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(2) > div { right: 357px; }
.orgLevel1 > ul, .orgLevel2 > ul, .orgLevel3 > ul, .orgLevel4 > ul { width: 100%;  padding-top: 140px; }
.orgLevel4 > ul { height: 60px; position: absolute; }
.orgLevel3 > ul { height: 200px; padding-top: 270px; }
.orgLevel2 > ul { height: 610px; }
.orgLevel1 > ul { height: 750px; }
.orgLevel2 > div::before, .orgLevel3 > div::before, .orgLevel4 > div::before, .orgLevel5 > div::before { content: ""; position: absolute; height: 40px; width: 2px; background-color: #333; top:-40px; left: 50%; transform: translate(-50%, 0); }
.orgLevel1 > div::before { content: ""; position: absolute; height: 40px; width: 2px; background-color: #333; top: 60px; left: 50%; transform: translate(-50%, 0); }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:last-of-type > div::before { content: ""; position: absolute; height: 40px; width: 2px; background-color: #333; top: 60px; left: 50%; transform: translate(-50%, 0); }
.orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:last-of-type > div::after { content: ""; position: absolute; height: 210px; width: 2px; background-color: #333; top: -210px; left: 50%; transform: translate(-50%, 0); }
.orgLevel1::after { content: ""; position: absolute; height: 2px; width: 700px; background-color: #333; top: 100px; left: 50%; transform: translate(-50%, 0); }
.orgLevel2::after { content: ""; position: absolute; height: 2px; width: 700px; background-color: #333; top: 242px; left: 50%; transform: translate(-50%, 0); }
.orgLevel3::after { content: ""; position: absolute; height: 2px; width: 700px; background-color: #333; top: 510px; left: 50%; transform: translate(-50%, 0); }
.orgLevel4:nth-of-type(1):after { content: ""; position: absolute; height: 2px; width: 322px; background-color: #333; top: 650px; left: 297px; transform: translate(-50%, 0); }
.orgLevel4:nth-of-type(2):after { content: ""; position: absolute; height: 2px; width: 322px; background-color: #333; top: 650px; right: 297px; transform: translate(50%, 0); }
.orgLevel4 > div::after { content: ""; position: absolute; height: 40px; width: 2px; background-color: #333; top: 60px; left: 50%; transform: translate(-50%, 0); }


.joinGuideBox { margin-top: 0px !important; }
.joinProcedureBox { margin-bottom: 60px; display: flex; justify-content: space-between; }
.joinProcedureBox > div.border{ padding: 20px; position: relative; border: 2px solid #909090 !important; width: calc((100% - 60px) / 4); }
.joinProcedureBox > div.border > .jpbStep { position: absolute; padding-top: 7px; width: 70px; height: 80px; font-size: 18px; font-weight: bold; text-align: center; background-color: #d23345; color: #FFF; top: 20px; left: -2px; }
.joinProcedureBox > div.border > .jpbStep span { font-size: 32px; letter-spacing: 0.1rem; }
.joinProcedureBox > div.border > .jpbStep::after { content: ""; position: absolute; display: block; width: 30px; height: 80px; top: 0; right: -30px; border-top: 40px solid transparent; border-bottom: 40px solid transparent; border-left: 30px solid #d23345; }
.joinProcedureBox > div.border > .jpbTxt { margin-top: 100px; }
.joinProcedureBox > div.border > .jpbTxt > p:nth-of-type(1) { font-size: 20px; letter-spacing: -0.08rem; font-weight: bold; color: #d23345; height: 40px; }
.subscriptionList li a { color: #333; }
.subscriptionList li a:hover { color: #0D6EFD; }
.jiBtnBox { text-align: right; }
.jiBtnBox > button { width: 280px; }



/* === 메인페이지 === */
.indexBox { position: relative; top: 0; min-height: calc(100vh - 380px); padding-bottom: 60px; }

.mv { max-width: 2543px; width: 100%; margin: 0 auto; display: flex; }
.mainImgBox { position: relative; width: calc(100% - 600px); height: calc(300px + 240px); }
.mainImgBox > .mainImg  { height: 100%; overflow: hidden; position: relative; }
.mainImgBox > .mainImg > img { height: 100%; width: auto; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.mainImgBox > .mainImg > .imgCover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 500; background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0));}
.mainImgBox > .mainTxt { position: absolute; top: 100px; left: 60px; color: #FFF; z-index: 600; }
.mainImgBox > .mainTxt > p:nth-of-type(1) { font-size: 60px; line-height: 60px; font-weight: bold; margin-bottom: 10px; }
.mainImgBox > .mainTxt > p:nth-of-type(2) { font-size: 28px; line-height: 28px; font-weight: bold; margin-bottom: 10px; }
.mainImgBox > .mainTxt > p:nth-of-type(3) { font-size: 18px; line-height: 18px; }
.mainQuickMenuBox { width: 600px; display: flex; flex-wrap: wrap; position: relative; }
.mainQuickMenuBox > .mqmLeft { flex: 1 1 50%; }
.mainQuickMenuBox > .mqmLeft a { display: block; position: relative; height: 100%; color: #FFF; padding: 20px 18px; }
.mainQuickMenuBox > .mqmLeft > div { background-color: #D23145; height: 100px; border-bottom: 1px solid #fff; }
.mainQuickMenuBox > .mqmLeft > div:hover { background-color: #b32535 }
.mainQuickMenuBox > .mqmLeft > div:last-of-type { border-bottom: 0; }
.mainQuickMenuBox > .mqmRight { flex: 1 1 50%; }
.mainQuickMenuBox > .mqmRight a { display: block; position: relative; width: 100%; height: 100%; color: #333; padding: 20px 18px; }
.mainQuickMenuBox > .mqmRight > div { height: 120px; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; }
.mainQuickMenuBox > .mqmRight > div:hover { background-color: #f0f0f0; }
.mainQuickMenuBox > .mqmRight > div:nth-of-type(2) { border-bottom: 0; }
.mainQuickMenuBox > .mqmRight > .brochureLink { height: 60px; background-color: #2f548f; border-bottom: 0; border-right: 0; }
.mainQuickMenuBox > .mqmRight > .brochureLink:hover { background-color: #254477; }
.mainQuickMenuBox > .mqmRight > .brochureLink > a { color: #FFF; }
.mainQuickMenuBox .qmTitle { font-size: 20px; line-height: 20px; font-weight: bold; }
.mainQuickMenuBox .qmMore { position: absolute; bottom: 14px; right: 14px; }
.mainQuickMenuBox > .bidQuick { flex: 1 1 100%; width: 100%; height: 240px; background-color: #333; color: #FFF; padding: 20px 18px; position: relative; }
.mainQuickMenuBox > .bidQuick .bqTitle { height: 24px; margin-bottom: 14px; }
.mainQuickMenuBox > .bidQuick .bqMore { color: #FFF; font-size: 24px; }
.mainQuickMenuBox > .bidQuick .bqMore:hover { transform: rotate(90deg) translate(1px, -1px); }
.mainQuickMenuBox > .bidQuick .bqCont li { margin-bottom: 6px; }
.mainQuickMenuBox > .bidQuick .bqCont li a { color: #FFF; width: 100%; display: flex; justify-content: space-between; align-items: center; }
.mainQuickMenuBox > .bidQuick .bqContTxt { display: inline-block; width: calc(100% - 124px - 36px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break: break-all; }
.mainQuickMenuBox > .bidQuick .bqContDate { display: inline-block; letter-spacing: -0.08em; width: 140px; text-align: right; }

.indexNewsBox { margin: 60px auto 0; width: 100%; }
.indexNewsList { padding-left: 0; }
.indexNoticeList { padding-right: 0; }
.indexNewsBox > div > .border { min-height: 242px; }
.indexNewsBox ul li { margin-bottom: 4px; }
.indexNewsBox ul li a { color: #333; display: flex; justify-content: space-between; align-items: center; }
.indexNewsBox ul li a p:first-of-type { display: inline-block; width: calc(100% - 100px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break: break-all; }
.indexNewsBox ul li a p:last-of-type { display: inline-block; }
.indexListTitle { margin-bottom: 20px; }
.indexListTitle > p { font-size: 24px; font-weight: bold; display: inline-block; position: relative; }
.indexListTitle > p::after { position: absolute; content: ""; width: 100%; height: 4px; background-color: #D23145; bottom: -10px; left: 0; }
.indexListTitle > a { font-size: 24px; color: #333; }
.indexListTitle > a:hover { transform: rotate(90deg) translate(1px, -1px); }

.bannerZone { margin: 60px auto 0; width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; }
.bannerZone .banner { width: 300px; height: 148px; }
.bannerZone .banner img { width: 100%; height: 100%; }

.rollingBannerBox { width: 100%; height: 60px; position: absolute; bottom: -80px; }
.relatedOrgSlider { width: 100%; height: 60px; background-color: #e3e4e6; position: absolute; bottom: 0; }
.relatedOrgSlider .container { height: 100%; position: relative; overflow: hidden; padding: 0; border-left: 12px solid #e3e4e6; border-right: 12px solid #e3e4e6; }
.relatedOrgSlider img { height: 26px; margin-top: 17px; position: absolute;  }




/* === Footer === */
footer { background-color: #333; padding: 50px 0;  color: #999; }
footer img { height: 18px; }
#footerLink { margin-top: 18px;}
#footerLink li, #footerLink ul { display: inline-block; }
#footerLink a { color: #999; margin: 0 12px; font-weight: bold; }
#footerLink > li:first-of-type > ul > li:first-of-type > a { margin-left: 0px; }
#footerLink > li:last-of-type > ul > li:last-of-type > a { margin-right: 0px; }
#footerLink > li > ul > li > a::after { content: ""; display: inline-block; width: 1px; height: 10px; background-color: #999; line-height: 60px; transform: translateX(13px); }
#footerLink > li:last-of-type > ul > li:last-of-type > a::after { content: none; clear: both; }
#footerAddress > li { margin: 0 12px; display: inline-block; }
#footerAddress > li:first-of-type { margin-left: 0px; }
#footerAddress > li:last-of-type { margin-right: 0px; }
#footerAddress > li::after { content: ""; display: inline-block; width: 1px; height: 10px; background-color: #999; line-height: 60px; transform: translateX(14px); }
#footerAddress > li:last-of-type::after { content: none; }















.d-block-1400, .d-block-1025, .d-block-992, .d-block-767, .d-block-576 { display: none; }

@media all and (max-width: 1400px) {
    .d-block-1400 { display: block; }
    .sub > li > a > div > p { line-height: 20px; }
    
    /* === 메인페이지 === */
	.mainImgBox > .mainImg > img { height: 100%; width: auto; transform: translate(-50%, -50%); }
    .mainImgBox > .mainTxt > p:nth-of-type(1) { font-size: 50px; line-height: 50px; }
    .mainImgBox > .mainTxt > p:nth-of-type(2) { font-size: 24px; line-height: 24px; letter-spacing: -0.06em; }
    .mainImgBox > .mainTxt > p:nth-of-type(3) { font-size: 16px; line-height: 16px; letter-spacing: -0.06em; }
    .mainQuickMenuBox > .mqmRight > div { border-right: 0; }
    .bannerZone .banner { width: 260px; height: 128px; }

    .introBtnBox { display: flex; justify-content: space-between; flex-direction: column; }
    .introBtnBox .ibRedBox { display: flex; justify-content: end; margin-bottom: 10px;}
    .introBtnBox .ibDarkBox { display: flex; justify-content: end;}

    .introducePage > .purposePaperBox > div:nth-of-type(1) { width: 280px; margin-right: 30px; }
    .introducePage > .purposePaperBox > div:nth-of-type(2) { width: calc(100% - 310px); }

    .orgChartBox .orgLevel1 .orgLevel2:nth-of-type(1) > div { transform: translate(-425px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2:nth-of-type(2) > div { transform: translate(225px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(1) > div { transform: translate(-425px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(2) > div { transform: translate(225px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) > div { left: 50%; transform: translate(-425px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) > div { left: 50%; transform: translate(225px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(1) > div { left: 0px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(2) > div { left: 260px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(1) > div { right: 0px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(2) > div { right: 260px; }
    .orgLevel1::after { width: 650px; }
    .orgLevel2::after { width: 650px; }
    .orgLevel3::after { width: 650px; }
    .orgLevel4:nth-of-type(1):after { width: 262px; left: 230px; }
    .orgLevel4:nth-of-type(2):after { width: 262px; right: 230px; }

    .joinProcedureBox > div.border > .jpbTxt > p:nth-of-type(1) { height: 70px; }
}


@media all and (max-width: 1200px) {
    .d-none-1200 { display: none; }

    #ums-searchBar > .searchSelectGroup { float:none; }
    #ums-searchBar > .searchInputGroup { float: none; margin-top: 10px; }
    
    .mainImgBox { width: calc(100% - 460px); height: calc(300px + 220px); }
    .mainImgBox > .mainTxt { top: 80px; left: 30px; color: #FFF; z-index: 600; }
    .mainQuickMenuBox { width: 460px; display: flex; flex-wrap: wrap; position: relative; }
    .mainQuickMenuBox > .mqmLeft a { padding: 14px; }
    .mainQuickMenuBox > .mqmRight a { padding: 14px; }
    .mainQuickMenuBox > .mqmRight > div { border-right: 0; }
    .mainQuickMenuBox .qmTitle { font-size: 18px; line-height: 18px; font-weight: bold; }
    .mainQuickMenuBox .qmMore { bottom: 12px; right: 12px; }
    .mainQuickMenuBox > .bidQuick { height: 220px; padding: 14px; }
    .mainQuickMenuBox > .bidQuick .bqCont li { margin-bottom: 2px; }
    .mainQuickMenuBox > .bidQuick .bqContTxt { width: calc(100% - 124px - 16px); }

    .bannerZone .banner { width: 220px; height: 108px; }

    .greetingTop { height: auto; }
    .greetingTop > .gtImg { position: relative; top: 0px; text-align: right; margin-top: 30px; }
    .greetingTop > .gtImg > img { width: 180px; margin-left: 10px; }

    .goalBot ul li { letter-spacing: -0.04rem; }

    .introducePage > .purposePaperBox { flex-direction: column; }
    .introducePage > .purposePaperBox > div:nth-of-type(1) { width: 100%; margin-right: 0px; text-align: center; }
    .introducePage > .purposePaperBox > div:nth-of-type(1) > p { margin-bottom: 20px; }
    .introducePage > .purposePaperBox > div:nth-of-type(2) { width: 100%; }

    .orgChartBox .orgLevel1 .orgLevel2:nth-of-type(1) > div { transform: translate(-358px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2:nth-of-type(2) > div { transform: translate(158px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(1) > div { transform: translate(-358px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(2) > div { transform: translate(158px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) > div { left: 50%; transform: translate(-358px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) > div { left: 50%; transform: translate(158px, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(1) > div { left: 0px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(2) > div { left: 220px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(1) > div { right: 0px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(2) > div { right: 220px; }
    .orgLevel1::after { width: 514px; }
    .orgLevel2::after { width: 514px; }
    .orgLevel3::after { width: 514px; }
    .orgLevel4:nth-of-type(1):after { width: 222px; left: 210px; }
    .orgLevel4:nth-of-type(2):after { width: 222px; right: 210px; }
    
    .joinProcedureBox { flex-wrap: wrap; }
    .joinProcedureBox > div.border{ width: calc((100% - 20px) / 2); }
    .joinProcedureBox > div.border:nth-of-type(3), .joinProcedureBox > div.border:nth-of-type(4) { margin-top: 20px; }
    .joinProcedureBox > div.border > .jpbTxt > p:nth-of-type(1) { height: 40px; }

    .mainQuickMenuBox > .mqmRight > .brochureLink > a > div:first-of-type { margin-top: 7px; }
    .mainQuickMenuBox > .mqmRight > .brochureLink .qmMore { bottom: 15px; }
}

@media all and (max-width: 1025px) {
    .d-block-1025 { display: block; }

    header { height: 60px; }
    #htop { height: 60px; position: absolute;}
    #hbot { height: 0px !important; }
    #hbot:after { content: none; }
    h1 { margin-top: 16px; }
    #htopLeft { margin-top: 20px; }
    #lnb, #gnb { display: none; }
    #ham, #leftMenuham { display: block; }

    section { margin-top: 60px; }

    footer { text-align: center; }
}


@media all and (max-width: 992px) {
    .d-block-992 { display: block; }
    .d-none-992 { display: none; }

    section { margin-bottom: 60px; }
    
    .subTitle1 { margin-bottom: 20px; }
    .subTitle2 { font-size: 17px; padding-bottom: 6px; }
    
    .subpageBg p { font-size:22px; width: 100%; }
    .breadcrumbBar { margin-top: 20px; margin-bottom: 10px; }

    .tableBidInfo > thead > tr > th:nth-of-type(1), .tableBidInfo > thead > tr > th:nth-of-type(1) { width: 18%; }
    .tableBidInfo > thead > tr > th:nth-of-type(2), .tableBidInfo > thead > tr > th:nth-of-type(2) { width: 7%; }
    .tableBidInfo > thead > tr > th:nth-of-type(3), .tableBidInfo > thead > tr > th:nth-of-type(3) { width: 31%; }
    .tableBidInfo > thead > tr > th:nth-of-type(4), .tableBidInfo > thead > tr > th:nth-of-type(4) { width: 18%; }
    .tableBidInfo > thead > tr > th:nth-of-type(5), .tableBidInfo > thead > tr > th:nth-of-type(5) { width: 14%; }
    .tableBidInfo > thead > tr > th:nth-of-type(6), .tableBidInfo > thead > tr > th:nth-of-type(6) { width: 12%; }

    .tableMemberList > thead > tr > th:nth-of-type(1), .tableMemberList > thead > tr > th:nth-of-type(1) { width: 8%; }
    .tableMemberList > thead > tr > th:nth-of-type(2), .tableMemberList > thead > tr > th:nth-of-type(2) { width: 32%; }
    .tableMemberList > thead > tr > th:nth-of-type(3), .tableMemberList > thead > tr > th:nth-of-type(3) { width: 10%; }
    .tableMemberList > thead > tr > th:nth-of-type(4), .tableMemberList > thead > tr > th:nth-of-type(4) { width: 10%; }
    .tableMemberList > thead > tr > th:nth-of-type(5), .tableMemberList > thead > tr > th:nth-of-type(5) { width: 20%; }
    .tableMemberList > thead > tr > th:nth-of-type(6), .tableMemberList > thead > tr > th:nth-of-type(6) { width: 20%; }

    .tableMemberInfo > li > ul { display: block; }
    .memberInfoTr > ul { display: flex !important; }
    .tableMemberInfo > li > ul > .memberInfoTr { width: 100%; }
    .tableMemberInfo > .memberInfoTr { width: 100%; }
    .memberInfoTh { width: 120px; }
    .memberInfoTd { border-right: 0 !important; }
    .tableMemberInfo > li > ul > .memberInfoTr > ul > .memberInfoTd { width: calc(100% - 120px); }
    .tableMemberInfo > .memberInfoTr > ul > .memberInfoTd { width: calc(100% - 120px); }

    #paginationBar .tableListDownBtn { position: relative; float: right; transform: translateY(-20px); }

    .shipListBox .card { flex-direction: row; }
    .shipListBox .cardImgBox { height: 100%; width: 50%; }
    .shipListBox .card-body { padding: 18px; width: 50%; }
    .shipListBox .card-text .shipInfo { margin-bottom: 12px; }
    .shipListBox .card-text .shipInfoCont { font-size: 14px; line-height: 16px; margin-top: 3px; }

    .findAccountBox > .tabcontbox > .tabcont > .formBox > div { padding: 30px 20px; }
    .findAccountBox > .tabcontbox > .tabcont > .formBox > div:last-of-type { border-left: 1px solid #bebebe; border-top: 0; }

    .btnRedBox { margin-top: 40px; }

    .ceoListBox .ceoCard { padding: 14px; }
    .ceoListBox .ceoCard .ceoCardImg { width: 110px; height: 110px; }
    .ceoListBox .ceoCard .ceoCardTxt { padding-left: 14px; width: calc(100% - 110px - 14px -14px); }
    .ceoListBox .ceoCard .ceoCardTxt p:nth-of-type(1) { font-weight: bold; font-size: 16px; color: #D23345; margin-bottom: 6px;}
    .ceoListBox .ceoCard .ceoCardTxt p:nth-of-type(2) { font-weight: bold; font-size: 20px; line-height: 22px; margin-bottom: 6px;}
    .ceoListBox .ceoCard .ceoCardTxt p:nth-of-type(2) > span { display: inline-block; font-weight: normal; font-size: 14px; line-height: 14px;}
    .ceoListBox .ceoCard .ceoCardTxt p:nth-of-type(3) { font-size: 14px; }
    .ceoListBox { margin-bottom: 40px; }
    
    .mapPage > .mapBox { height: 340px; }
    
    .mv { flex-direction: column; }
    .mainImgBox { width: 100%; height: 300px; }
    .mainImgBox > .mainImg > .imgCover { background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.2));}
	/* .mainImgBox > .mainImg > img { width: 100%; transform: translate(-50%, -60%); } */
    .mainImgBox > .mainTxt { top: 60px; left: 30px; }
    .mainQuickMenuBox { width: 100%; display: flex; flex-wrap: wrap; position: relative; }
    .mainQuickMenuBox > .mqmLeft a { padding: 14px 20px; }
    .mainQuickMenuBox > .mqmRight a { padding: 14px 20px; }
    .mainQuickMenuBox .qmMore { bottom: 14px; right: 20px; }
    .mainQuickMenuBox > .bidQuick { padding: 14px 20px; }
    .mainQuickMenuBox > .bidQuick .bqCont li { margin-bottom: 2px; }
    .mainQuickMenuBox > .bidQuick .bqContTxt { width: calc(100% - 124px - 40px); }

    .indexNewsBox { margin-top: 40px; }
	.indexNewsBox > div > .border { min-height: auto; }
    .indexNewsList { padding-right: 0; margin-bottom: 16px; }
    .indexNoticeList { padding-left: 0; }
    .bannerZone { margin-top: 40px; }
    .bannerZone .banner { width: calc((100% - (16px * 3)) / 4); height: 83px; }
    .rollingBannerBox { bottom: -60px; }

    .commonSenseTable { width: 50%; }
    .commonSenseTable:nth-of-type(3) { border-top: 0; }
    .commonSenseTable:nth-of-type(3), .commonSenseTable:nth-of-type(6), .commonSenseTable:nth-of-type(9), .commonSenseTable:nth-of-type(12), .commonSenseTable:nth-of-type(15), .commonSenseTable:nth-of-type(16) { border-right: 0; }
    .commonSenseTable:nth-of-type(2), .commonSenseTable:nth-of-type(4), .commonSenseTable:nth-of-type(6), .commonSenseTable:nth-of-type(8), .commonSenseTable:nth-of-type(10), .commonSenseTable:nth-of-type(12), .commonSenseTable:nth-of-type(14), .commonSenseTable:nth-of-type(16) { border-right: 1px solid #333; }

    .orgChartBox { height: auto; }
    .orgChartBox .orgLevel1 > div { width: 100%; height: 50px; font-size: 18px; position: relative; left: 0; transform: translate(0, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 > div { width: calc(100% - 30px); height: 50px; font-size: 18px; position: relative; margin-bottom: 10px; }
    .orgChartBox .orgLevel1 .orgLevel2:nth-of-type(1) > div, .orgChartBox .orgLevel1 .orgLevel2:nth-of-type(2) > div, .orgChartBox .orgLevel1 .orgLevel2:nth-of-type(3) > div { left: 30px; transform: translate(0, 0); }
    .orgChartBox .orgLevel1 .orgLevel2:nth-of-type(3) > div { margin-bottom: 0px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 > div, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:last-of-type > div  { width: calc(100% - 60px); height: 50px; font-size: 16px; letter-spacing: -0.06em; position: relative; margin-bottom: 10px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(1) > div, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(2) > div, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(3) > div { left: 60px; transform: translate(0, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:nth-of-type(3) > div { margin-bottom: 0px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:last-of-type > div { font-size: 18px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:last-of-type { padding-top: 20px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4 > div { width: calc(100% - 90px); height: 50px; font-size: 18px; position: relative; margin-bottom: 10px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) > div, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) > div { left: 90px; transform: translate(0, 0); margin-bottom: 0px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4 .orgLevel5 > div { width: calc(100% - 120px); height: 50px; position: relative; margin-bottom: 10px; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(1) > div, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(2) > div, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(1) > div, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(2) > div, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(2) .orgLevel5:nth-of-type(2)  .orgLevel5 > div { left: 120px; right: 0; }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3 .orgLevel4:nth-of-type(1) .orgLevel5:nth-of-type(2) > div { margin-bottom: 0; }
    .orgLevel1 > ul, .orgLevel2 > ul, .orgLevel3 > ul, .orgLevel4 > ul{ width: 100%;  padding-top: 20px; }
    .orgLevel5 > ul { width: 100%; padding-top: 0px; }
    .orgLevel4 > ul { height: auto; position: relative; }
    .orgLevel3 > ul { height: auto;  }
    .orgLevel2 > ul { height: auto; }
    .orgLevel1 > ul { height: auto; }
    .orgLevel1 > div::before { content: none; }
    .orgLevel1::after { content: ""; position: absolute; height: 165px; width: 2px; background-color: #333; top: 50px; left: 10px; transform: translate(0, 0); }
    .orgLevel2::after { content: none; }
    .orgLevel2 > div::before, .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:last-of-type > div::before { content: ""; position: absolute; height: 2px; width: 20px; background-color: #333; left: -20px; top: 50%; transform: translate(0, -50%); }
    .orgLevel2:last-of-type > div::after { content: ""; position: absolute; height: 165px; width: 2px; background-color: #333; top: 50px; left: 10px; transform: translate(0, 0); }
    .orgLevel3::after { content: none; }
    .orgLevel3 > div::before { content: ""; position: absolute; height: 2px; width: 20px; background-color: #333; left: -20px; top: 50%; transform: translate(0, -50%); }
    .orgLevel2:last-of-type > div::after { content: ""; position: absolute; height: 165px; width: 2px; background-color: #333; top: 50px; left: 10px; transform: translate(0, 0); }
    .orgChartBox .orgLevel1 .orgLevel2 .orgLevel3:last-of-type > div::after { content: ""; position: absolute; height: 245px; width: 2px; background-color: #333; top: 50px; left: 10px; transform: translate(0, 0); }
    .orgLevel4:nth-of-type(1):after { content: none; }
    .orgLevel4:nth-of-type(2):after { content: none; }
    .orgLevel4:nth-of-type(1) > div::after { content: ""; position: absolute; height: 106px; width: 2px; background-color: #333; top: 50px; left: 10px; transform: translate(0, 0); }
    .orgLevel4:nth-of-type(2) > div::after { content: ""; position: absolute; height: 106px; width: 2px; background-color: #333; top: 50px; left: 10px; transform: translate(0, 0); }
    .orgLevel4 > div::before { content: ""; position: absolute; height: 2px; width: 20px; background-color: #333; left: -20px; top: 50%; transform: translate(0, -50%); }
    .orgLevel5 > div::before { content: ""; position: absolute; height: 2px; width: 20px; background-color: #333; left: -20px; top: 50%; transform: translate(0, -50%); }
    
    #footerAddress>li:first-of-type { display: block; margin-right:0px; }
    #footerAddress>li:first-of-type::after { content: none; }
}


@media all and (max-width: 767px) {
    .d-block-767 { display: block; }
    .d-none-767 { display: inlin; }

    .searchBar .searchSelectGroup > ul > li { margin-right: 0; display: block; margin-bottom: 6px; }
    #ums-searchBar > .searchSelectGroup > ul > li > p { width: 80px; }
    .searchInputGroup { width: 100%; }
    .searchInputGroup > ul { display: flex; width: 100%; }
    .searchInputGroup > ul > li:first-of-type { flex-shrink: 0; width: auto; margin-right: 3px; }
    .searchInputGroup > ul > li:last-of-type { flex-grow: 1; }
    .searchBar .input-group { width: 100% !important; }

    .tableNormal > thead > tr > th:nth-of-type(1), .tableNormal > thead > tr > th:nth-of-type(1) { width: 10%; }
    .tableNormal > thead > tr > th:nth-of-type(2), .tableNormal > thead > tr > th:nth-of-type(2) { width: 64%; }
    .tableNormal > thead > tr > th:nth-of-type(3), .tableNormal > thead > tr > th:nth-of-type(3) { width: 16%; }
    .tableNormal > thead > tr > th:nth-of-type(4), .tableNormal > thead > tr > th:nth-of-type(4) { width: 10%; }

    .tableMarket > thead > tr > th:nth-of-type(1), .tableMarket > thead > tr > th:nth-of-type(1) { width: 10%; }
    .tableMarket > thead > tr > th:nth-of-type(2), .tableMarket > thead > tr > th:nth-of-type(2) { width: 56%; }
    .tableMarket > thead > tr > th:nth-of-type(3), .tableMarket > thead > tr > th:nth-of-type(3) { width: 10%; }
    .tableMarket > thead > tr > th:nth-of-type(4), .tableMarket > thead > tr > th:nth-of-type(4) { width: 16%; }
    .tableMarket > thead > tr > th:nth-of-type(5), .tableMarket > thead > tr > th:nth-of-type(5) { width: 10%; }
    
    .tableBidInfo, .tableMemberList, .organizationTable-executive, .organizationTable-staff { width: 696px; }
    .tableScrollXBid, .tableScrollXMember, .tableScrollXOrganiztion { width: 100%; overflow-x: scroll; }
    
    .accountPageAlert > p:nth-of-type(1) { font-size: 18px; letter-spacing: -0.04em; margin-bottom: 20px; }
    .accountPageAlert > p:nth-of-type(2) { line-height: 20px; font-size: 14px; letter-spacing: -0.04em; background-color: #0950bc; }

    .regiFormBox label { font-size: 14px; height: 20px; line-height: 20px; margin-bottom: 6px; font-weight: bold; }
    .regiFormBox .inputGroup { margin-bottom: 20px; }
    .regiFormBox .inputGroup .formLabel { float: none; width: 100%; }
    .regiFormBox .inputGroup .formInput { float: none; width:100%;}
    .regiFormBox .idCheckBtn { height: 34px; width: 100px; margin-left: 20px; border: 0;}

    .bannerFormBox label { font-size: 14px; height: 20px; line-height: 20px; margin-bottom: 6px; font-weight: bold; }
    .bannerFormBox .inputGroup { margin-bottom: 20px; }
    .bannerFormBox .inputGroup .formLabel { float: none; width: 100%; }
    .bannerFormBox .inputGroup .formInput { float: none; width: 100%; }
    .bannerFormBox .inputGroup .bannerRadioGroup label { font-size: 16px; margin-bottom: 0px; font-weight: normal; }

    .joinIntroBox .form-check { font-size: 16px; color: #333; }
    .joinIntroBox .form-check .form-check-input { margin-left: -22px !important; margin-top: 7px; }
    .joinIntroBox .form-check { padding-left: 22px !important; }
    .joinIntroBox .agreeBox { height: 80px; letter-spacing: -0.08em; }
    .joinIntroBox .agreeBox button { height: 44px; width: 100px; border-radius: 22px; }
    .joinIntroBox .agreeBox button > a { font-size: 14px; }

    #paginationBar .tablePostBtn { position: relative; float: right; transform: translateY(-20px); }

    .greetingTop { height: auto; }
    .greetingTop > .gtTxt > div > i { color: #d23345; font-size: 40px; }
    .greetingTop > .gtTxt > div > i.bi-quote::before { margin-left: -6px }
    .greetingTop > .gtTxt > div > p { font-size: 20px; line-height: 28px; letter-spacing: -0.1rem; }
    .greetingTop > .gtTxt > div:nth-of-type(2) { margin: 20px 0; }
    .greetingTop > .gtTxt > p { font-size: 16px; line-height: 24px; letter-spacing: -0.1rem; }
    .greetingTop > .gtImg { position: relative; top: 0px; text-align: right; margin-top: 30px; }
    .greetingTop > .gtImg > img { width: 180px; margin-left: 10px; }
    .greetingTop > .gtImg > p { font-size: 16px; letter-spacing: 0.02em; transform: translate(0, -2px); }
    .greetingTop > .gtImg > p > span { font-size: 24px; margin-left: 6px; }
    .greetingBottom { padding: 20px; margin-top: 40px; letter-spacing: -0.08rem; }

    .goalTop { padding: 20px; font-size: 16px; line-height: 24px; }
    .goalBot { padding: 20px; }
    
    .introducePage > .purposePaperBox { padding: 20px; }
    .introducePage > .purposePaperBox > div:nth-of-type(1) > p { font-size: 20px; line-height: 24px; }
    .introducePage > div:nth-of-type(3) { padding: 20px; }
    .introducePage > div:nth-of-type(3) > ul { margin-top: 12px; }
    .introBtnBox { margin-top: 40px; }
    .introBtnBox { display: flex; justify-content: space-between; }
    .introBtnBox .ibRedBox { margin-bottom: 20px; }
    .introBtnBox .ibRedBox .btnRed:nth-child(1) { width: 100%; }
    .introBtnBox .ibDarkBox { flex-direction: column; }
    .introBtnBox .ibDarkBox .btnDark:nth-child(1) { width: 100%; margin-right: 0px; margin-bottom: 10px; }
    .introBtnBox .ibDarkBox .btnDark:nth-child(2) { width: 100%; margin-right: 0px; margin-bottom: 10px; }
    .introBtnBox .ibDarkBox .btnDark:nth-child(3) { width: 100%; }
    .introducePage .modal-dialog { max-width: 600px !important; }
    .introducePage .modal-dialog .modal-content { width: 100% !important; margin: 0 auto; }
    .introducePage .modal-dialog .modal-content .modal-body img { width: 100% !important; margin: 0 auto; }

    .joinProcedureBox{  margin-bottom: 40px;}
    .joinProcedureBox > div.border { width: 100%; margin-top: 20px; }
    .joinProcedureBox > div.border:first-of-type { margin-top: 0px; }

    .mainImgBox { height: 200px; }
    .mainImgBox > .mainTxt { top: 54px; }
    .mainImgBox > .mainTxt > p:nth-of-type(1) { font-size: 38px; line-height: 38px; }
    .mainImgBox > .mainTxt > p:nth-of-type(2) { font-size: 20px; line-height: 20px; }
    .mainImgBox > .mainTxt > p:nth-of-type(3) { font-size: 14px; line-height: 14px; }
    .bannerZone .banner { width: calc((100% - 16px) / 2); height: 123px; margin-bottom: 16px; }
    .bannerZone .banner:nth-of-type(3), .bannerZone .banner:nth-of-type(4) { margin-bottom: 0; }

    #footerAddress>li:first-of-type::after { content: none; }
    #footerLink { margin-top: 8px;}

	.tabCommonSenseCont > .tabcont .csimg2ul > ul { flex: 1 1 50%; }
}


@media all and (max-width: 576px) {
    .d-block-576 { display: block; }
    .d-none-576 { display: none; }

    .subpageBg { height: 100px; }

    .tableNormal, .tableMarket { width: 516px; }
    .tableScrollXNormal { width: 100%; overflow-x: scroll; }

    .cardListBox .card { flex-direction: column; }
    .cardListBox .cardImgBox { height: 250px; width: 100%; }
    .cardListBox .card-body { width: 100%; }

    .regiFormBox .idCheckBtn { margin-left: 0px; margin-top: 10px; vertical-align: top; float: right; }
    .formBox input, .formBox select { width: 100%; }
    .bannerFormBox { margin-top: 0 !important; }
    .bannerFormBox .wonInput { width: calc(100% - 108px) !important; }
    .threeInputBox > input, .threeInputBox > select { width: calc((100% - 60px) / 3) !important; }
    .twoInputBox > input, .twoInputBox > select { width: calc((100% - 30px) / 2) !important; }
    .twoInputBox > select { float: right; margin-left: 0px; margin-top: 10px; }

    .formBox label { font-size: 14px; height: 20px; line-height: 20px; margin-bottom: 4px; font-weight: bold; }
    .btnLoginBox button { width: 220px; }
    .btnRedBox .d-flex { flex-direction: column; justify-content: center; align-items: center; }
    .btnRedBox .d-flex > button { margin-top: 20px; }
    .btnRedBox .d-flex > button:first-of-type { margin-top: 0px; }
    .btnLoginBox button { width: 220px; }

    .joinIntroBox .btnRedBox .d-flex { flex-direction: row; justify-content: space-evenly; }
    .joinIntroBox .btnRedBox .d-flex > button { margin-top: 0px; }
    .btnRedBox button { width: 140px; }
    
    .joinIntroBox .bg-light { padding: 20px; font-size: 14px; letter-spacing: -0.04em; line-height: 20px; margin-bottom: 40px; }

    .dictionarySearch { padding: 20px 10px; }
    #dictionaryAccordian .accli .accbtn { padding: 16px 10px; cursor: pointer; }
    #dictionaryAccordian .accli .acccont { padding: 20px 30px; }

    .ceoListBtnBox { display: flex; justify-content: center; align-items: center; flex-direction: column; }
    .ceoListBtnBox .btnDark:last-of-type { margin-left: 0px; margin-top: 12px; }

    .historyYear { border-top: 3px solid #D23145; }
    .historyTxt { padding: 0; }
    .historyTxt > li { border-top: 0; margin-bottom: 0; padding-bottom: 0px; }
    .historyTxt > li > .historyCont { border-bottom: 1px solid #ccc; }
    .historyTxt > li:last-of-type > .historyCont { border-bottom: 0; }
    .historyTxt > li > .historyCont > p { margin-bottom: 20px; }

    .mapPage > .mapBox { height: 280px; }

    .mainImgBox > .mainTxt { top: 54px; left: 16px; }
    .mainImgBox > .mainTxt > p:nth-of-type(1) { font-size: 28px; line-height: 28px; }
    .mainImgBox > .mainTxt > p:nth-of-type(2) { font-size: 18px; line-height: 18px; }
    .mainImgBox > .mainTxt > p:nth-of-type(3) { font-size: 12px; line-height: 12px; }
    
    .mainQuickMenuBox > .bidQuick .bqContTxt { width: calc(100% - 124px - 10px); }
    
    .mainQuickMenuBox > .mqmRight > div { height: 100px; }
    .mainQuickMenuBox > .mqmRight > .brochureLink { height: 100px; }
    .mainQuickMenuBox > .mqmRight > .brochureLink > a > div:first-of-type { margin-top: 0px; }
    .mainQuickMenuBox > .mqmRight > .brochureLink .qmMore { bottom: 12px; }
    
    .indexNewsBox ul li a p:first-of-type { width: calc(100% - 80px); }

    .bannerZone .banner {height: 80px; }

    .commonSenseTable { width: 100%; }
    .commonSenseTable:nth-of-type(2) { border-top: 0; }
    .commonSenseTable { border-right: 1px solid #333 !important; }

    .joinIntroBox .subscriptionList li { letter-spacing: -0.06rem; margin-bottom: 10px; }
    .joinIntroBox .subscriptionList li:last-of-type { margin-bottom: 0;}
    .jiBtnBox { text-align: center; }

    #footerLink > li { display: block; }
    #footerLink > li:first-of-type > ul > li:first-of-type > a, #footerLink > li:last-of-type > ul > li:first-of-type > a { margin-left: 0px; }
    #footerLink > li:first-of-type > ul > li:last-of-type > a, #footerLink > li:last-of-type > ul > li:last-of-type > a { margin-right: 0px; }
    #footerLink > li > ul > li > a::after { content: ""; display: inline-block; width: 1px; height: 10px; background-color: #999; line-height: 60px; transform: translateX(13px); }
    #footerLink > li:first-of-type > ul > li:last-of-type > a::after, #footerLink > li:last-of-type > ul > li:last-of-type > a::after  { content: none; clear: both; }
    #footerAddress { margin-top: 10px; }
    #footerAddress > li { margin: 0; display: block; }
    #footerAddress > li::after  { content: none; }
    
    .businessTable .subTitle1 span { display: block; margin-left: 0; }
    
    #tabCommonSense > button { width: 50% !important; }
    #tabCommonSense > button:nth-of-type(3), #tabCommonSense > button:nth-of-type(4), #tabCommonSense > button:nth-of-type(5) { border-top: 0; }
    #tabCommonSense > button:nth-of-type(2), #tabCommonSense > button:nth-of-type(4) { border-right: 1px solid #888; }
    #tabCommonSense > button:last-of-type { width: calc(50% + 1px) !important; }
    
    #tabBidInfo > button { width: 25% !important; }
    #tabBidInfo > button:nth-of-type(5), #tabBidInfo > button:nth-of-type(6), #tabBidInfo > button:nth-of-type(7) { border-top: 0; }
    #tabBidInfo > button:nth-of-type(4) { border-right: 1px solid #888; }
    #tabBidInfo > button:last-of-type { width: calc(25% + 1px) !important; }
    
    .tabCommonSenseCont > .tabcont .cmListLv2 > li {  margin-left: 0px; }
	.tabCommonSenseCont > .tabcont .cmListLv3 > li { margin-left: 0px; }
	
	.tabCommonSenseCont > .tabcont .csimg1ul > div { flex-wrap: wrap; }
	.tabCommonSenseCont > .tabcont .csimg1ul > div > ul { flex: 1 1 100%; }
	.tabCommonSenseCont > .tabcont .csimg2ul > ul { flex: 1 1 100%; }
	
	.joinIntroBox, .temsIntroBox, .formBox { margin-top: 40px; }
}


@media all and (max-width: 500px) {
    /* .mainImgBox > .mainImg > img { transform: translate(-50%, -50%); } */
}