/* common form */
::placeholder,
::-webkit-input-placeholder,
::-ms-input-placeholder {color: #777;}
/* common form - input, select */
label {vertical-align: middle; margin-right: 0.5rem;}
input,
select {height: var(--content-btn); border-radius: 0.35rem; border: 1px solid #ddd; background: #fff; padding: 0 calc(var(--content-btn) * 0.2);}
select {background: url(/00_common/images/con_com_shr/sel_arr.png) #fff right calc(var(--content-btn) * 0.2) center no-repeat; padding-right: calc(10px + (var(--content-btn) * 0.4)); appearance: none;}
select::-ms-expand {display: none;}



/* width - px */
.w50px {width: 2.5rem !important;}
.w80px {width: 4rem !important;}
.w100px {width: 5rem !important;}
.w150px {width: 7.5rem !important;}
.w200px {width: 10rem !important;}
.w250px {width: 12.5rem !important;}
.w300px {width: 15rem !important;}
.w350px {width: 17.5rem !important;}
.w400px {width: 20rem !important;}
.w450px {width: 22.5rem !important;}
.w500px {width: 25rem !important;}

/* width - percent */
.w10pc {width: 10%;}
.w20pc {width: 20%;}
.w30pc {width: 30%;}
.w40pc {width: 40%;}
.w50pc {width: 50%;}
.w60pc {width: 60%;}
.w70pc {width: 70%;}
.w80pc {width: 80%;}
.w90pc {width: 90%;}
.w100pc {width: 100%;}

/* max-width - px */
.mx-w100px {width: 100%; max-width: 5rem;}
.mx-w200px {width: 100%; max-width: 10rem;}
.mx-w400px {width: 100%; max-width: 20rem;}
.mx-w600px {width: 100%; max-width: 30rem;}
.mx-w800px {width: 100%; max-width: 40rem;}



/* padding */
.pd0 {padding: 0 !important;}
.pd5 {padding: 0.25rem !important;}
.pd10 {padding: 0.5rem !important;}
.pd15 {padding: 0.75rem !important;}
.pd20 {padding: 1rem !important;}
.pd30 {padding: 1.5rem !important;}

/* padding - top */
.pdt0 {padding-top: 0 !important;}
.pdt5 {padding-top: 0.25rem !important;}
.pdt10 {padding-top: 0.5rem !important;}
.pdt15 {padding-top: 0.75rem !important;}
.pdt20 {padding-top: 1rem !important;}
.pdt30 {padding-top: 1.5rem !important;}
.pdt40 {padding-top: 2rem !important;}

/* padding - left */
.pdl0 {padding-left: 0 !important;}
.pdl5 {padding-left: 0.25rem !important;}
.pdl10 {padding-left: 0.5rem !important;}
.pdl15 {padding-left: 0.75rem !important;}
.pdl20 {padding-left: 1rem !important;}
.pdl30 {padding-left: 1.5rem !important;}

/* padding - right */
.pdr0 {padding-right: 0 !important;}
.pdr5 {padding-right: 0.25rem !important;}
.pdr10 {padding-right: 0.5rem !important;}
.pdr15 {padding-right: 0.75rem !important;}
.pdr20 {padding-right: 1rem !important;}
.pdr30 {padding-right: 1.5rem !important;}

/* padding - bottom */
.pdb0 {padding-bottom: 0 !important;}
.pdb5 {padding-bottom: 0.25rem !important;}
.pdb10 {padding-bottom: 0.5rem !important;}
.pdb15 {padding-bottom: 0.75rem !important;}
.pdb20 {padding-bottom: 1rem !important;}
.pdb30 {padding-bottom: 1.5rem !important;}



/* margin */
.mg0 {margin: 0 !important;}
.mg5 {margin: 0.25rem !important;}
.mg10 {margin: 0.5rem !important;}
.mg15 {margin: 0.75rem !important;}
.mg20 {margin: 1rem !important;}
.mg30 {margin: 1.5rem !important;}

/* margin - top */
.mgt5 {margin-top: 0.25rem !important;}
.mgt10 {margin-top: 0.5rem !important;}
.mgt15 {margin-top: 0.75rem !important;}
.mgt20 {margin-top: 1rem !important;}
.mgt30 {margin-top: 1.5rem !important;}
.mgt40 {margin-top: 2rem !important;}
.mgt5n {margin-top: -0.25rem !important;}
.mgt10n {margin-top: -0.5rem !important;}

/* margin - left */
.mgl0 {margin-left: 0rem !important;}
.mgl5 {margin-left: 0.25rem !important;}
.mgl10 {margin-left: 0.5rem !important;}
.mgl15 {margin-left: 0.75rem !important;}
.mgl20 {margin-left: 1rem !important;}
.mgl30 {margin-left: 1.5rem !important;}

/* margin - right */
.mgr0 {margin-right: 0rem !important;}
.mgr5 {margin-right: 0.25rem !important;}
.mgr10 {margin-right: 0.5rem !important;}
.mgr15 {margin-right: 0.75rem !important;}
.mgr20 {margin-right: 1rem !important;}
.mgr30 {margin-right: 1.5rem !important;}

/* margin - bottom */
.mgb0 {margin-bottom: 0 !important;}
.mgb5 {margin-bottom: 0.25rem !important;}
.mgb10 {margin-bottom: 0.5rem !important;}
.mgb15 {margin-bottom: 0.75rem !important;}
.mgb20 {margin-bottom: 1rem !important;}
.mgb30 {margin-bottom: 1.5rem !important;}



/* 들여쓰기 */
.indent {margin-left: 1.2rem;}



/* 타이틀 */
h3[class^="tit"],
h4[class^="tit"],
h5[class^="tit"] {font-weight: 700; line-height: 1.4; margin: 1.75em 0 0.5em;}
h3[class^="tit"][class*="1"] + h4[class^="tit"][class*="2"] {margin-top: 0.75rem;}
h4[class^="tit"][class*="2"] + h5[class^="tit"][class*="3"] {margin-top: 0.5rem;}
h5[class^="tit"][class*="3"] + h6[class^="tit"][class*="4"] {margin-top: 0.5rem;}
h3[class^="tit"]:first-child,
h4[class^="tit"]:first-child,
h5[class^="tit"]:first-child {margin-top: 0;}
.tit1 {font-size: var(--font-size-025);}
.tit2 {font-size: var(--font-size-021); color: var(--color-purple);}
.tit3 {font-size: var(--font-size-020); color: #7a7d96;}



/*
블릿 및 리스트 - 불릿
블릿 및 리스트 - 리스트 - 불릿 타입
*/
.bu_st1,
.bu_st2,
.bu_st3,
.bu_st4,
.list_st1 > li,
.list_st2 > li,
.list_st3 > li {margin-top: 0.3125em; position: relative;}
.bu_st1,
.list_st1 > li {padding-left: 1em; font-size: var(--font-size-016);}
.bu_st1::before,
.list_st1 > li::before {content: ""; width: 0.75em; height: 0.75em; border-radius: 50%; border: 0.1875em solid #437dea; position: absolute; left: 0; top: 0.4em;}
.bu_st2,
.list_st2 > li {padding-left: 0.75em; font-size: var(--font-size-016);}
.bu_st2::before,
.list_st2 > li::before {content: ""; display: block; width: 0.3125em; height: 0.3125em; border-radius: 50%; background: #999; position: absolute; left: 0; top: 0.6em;}
.bu_st3,
.list_st3 > li {padding-left: 0.8em; font-size: var(--font-size-015);}
.bu_st3::before,
.list_st3 > li::before {content: ""; width: 0.33em; height: 1px; background: #999; position: absolute; left: 0; top: 0.8em;}
.bu_st2 {margin-left: 1.125em;}
.bu_st3 {margin-left: 2em;}

/* 리스트 - 텍스트 타입 */
.list_stT1 li {margin-top: 0.3125em;}
.list_stT1 li > ol,
.list_stT1 li > ul {padding-left: 0.625em;}

/* 리스트 - 가로 나열 */
ul[class*="li_w"],
ol[class*="li_w"] {display: flex; flex-wrap: wrap;}
ul[class*="li_w"] > li,
ol[class*="li_w"] > li {padding-right: 1em;}
.li_w50 > li {width: 50%;}
.li_w30 > li {width: 33%;}
.li_w25 > li {width: 25%;}
.li_w20 > li {width: 20%;}

/* 리스트 - 순차적 리스트 타입 */
[class*="list_ol"] > li {padding-left: 1.75em; font-size: var(--font-size-016); margin-top: 0.3125em; position: relative;}
[class*="list_ol"] > li > span.num {display: flex; justify-content: center; align-items: center; width: 1.83em; height: 1.83em; border-radius: 50%; border: 1px solid transparent; background: transparent; font-size: 0.75em; font-weight: 700; letter-spacing: -0.1em; position: absolute; left: 0; top: 0.1em;}
[class*="list_ol"] > li > [class*="list_ol"] > li {font-size: 0.9375em;}
.list_ol1 > li > span.num {border-color: #999;}
.list_ol2 > li > span.num {border-color: #1f5f9d; background: #1f5f9d; color: #fff;}



/* 텍스트 요소 - 주의&경고&말풍선 타입 */
.bu_atte,
.bu_wnrn,
.bu_ment {padding-left: 1.375em; margin-top: 0.3125em; position: relative;}
.bu_atte::before {content: "\203b"; font-size: 1.625em; position: absolute; left: 0; top: -0.35em;}
.bu_wnrn::before,
.bu_ment::before {font-family: 'xeicon'; font-size: 1.125em; position: absolute; left: 0; top: -0.1em;}
.bu_wnrn {color: var(--color-purple);}
.bu_wnrn::before {content: "\e9aa";}
.bu_ment {color: #464a4e;}
.bu_ment::before {content: "\e9a7";}
div + .bu_atte,
div + .bu_wnrn,
div + .bu_ment,
table + .bu_atte,
table + .bu_wnrn,
table + .bu_ment,
ul + .bu_atte,
ul + .bu_wnrn,
ul + .bu_ment {margin-top: 1.25em;}

/* 텍스트 요소 - 폰트컬러 타입 */
.pc_black {color: var(--color-black) !important;}
.pc_blue {color: var(--color-blue) !important;}
.pc_red {color: var(--color-red) !important;}
.pc_green {color: var(--color-green) !important;}
.pc_sky {color: var(--color-sky) !important;}
.pc_org {color: var(--color-orange) !important;}

/* 텍스트 요소 :텍스트 배경색 */
.bg_black,
.bg_blue,
.bg_red,
.bg_green,
.bg_sky,
.bg_org {display: inline-block; padding: 1px 0.5rem !important; color: #fff !important;}
.bg_black {background: var(--color-black) !important;}
.bg_blue {background: var(--color-blue) !important;}
.bg_red {background: var(--color-red) !important;}
.bg_green {background: var(--color-green) !important;}
.bg_sky {background: var(--color-sky) !important;}
.bg_org {background: var(--color-orange) !important;}

/* 텍스트 요소 - 강조 타입 */
.Tline_b {text-decoration: underline !important;}
.font_Fr {font-weight: 400 !important;}
.font_Fm {font-weight: 600 !important;}
.font_Fb {font-weight: 700 !important;}

/* 텍스트 요소 - 폰트 크기 */
.fs14 {font-size: var(--font-size-014) !important;}
.fs15 {font-size: var(--font-size-015) !important;}
.fs16 {font-size: var(--font-size-016) !important;}
.fs17 {font-size: var(--font-size-017) !important;}
.fs18 {font-size: var(--font-size-018) !important;}
.fs19 {font-size: var(--font-size-019) !important;}
.fs20 {font-size: var(--font-size-020) !important;}
.fs22 {font-size: var(--font-size-022) !important;}
.fs26 {font-size: var(--font-size-026) !important;}
.fs32 {font-size: var(--font-size-032) !important;}
.fs50 {font-size: var(--font-size-050) !important;}

/* 텍스트 요소 - 링크 타입 */
a.bu_link,
a.bu_mail,
a.bu_down,
a.bu_tel {display: inline-block; color: #0d82d3; position: relative; word-break: break-all;}
a.bu_link::after,
a.bu_mail::after,
a.bu_down::after,
a.bu_tel::after {font-family: 'xeicon'; margin-left: 0.25em;}
a.bu_link::after {content: "\e980";}
a.bu_mail::after {content: "\ea07";}
a.bu_down::after {content: "\eb7c";}
a.bu_tel::after {content: "\e9d3";}
a.bu_link span,
a.bu_mail span,
a.bu_down span,
a.bu_tel span {text-decoration: underline;}



/* 버튼 */
.btns {display: flex; flex-wrap: wrap; margin: 1rem -3px 2rem;}

/* 버튼 - 기본 */
[class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]) {display: inline-block; min-width: 8.125em; border-radius: 0.625em; border: 1px solid transparent; background: transparent; padding: 0.65em 1em; font-size: var(--font-size-016); text-align: center; line-height: 1.4; margin: 0.1875em;}
.btn_bl {border-color: var(--color-blue) !important; background: #fff !important; color: var(--color-blue) !important;}
.btn_gr {border-color: var(--color-gray) !important; background: var(--color-gray) !important; color: #fff !important;}
.btn_red {border-color: var(--color-red) !important; background: var(--color-red) !important; color: #fff !important;}
.btn_grn {border-color: var(--color-green) !important; background: var(--color-green) !important; color: #fff !important;}
.btn_nvy {border-color: var(--color-navy) !important; background: var(--color-navy) !important; color: #fff !important;}
/* 버튼 - 기본 : active */
.btn_bl,
.btn_gr,
.btn_red,
.btn_grn,
.btn_nvy {transition: var(--trst-short);}
.btn_bl:hover,
.btn_bl:focus {background: var(--color-blue) !important; color: #fff !important;}
.btn_gr:hover,
.btn_gr:focus {background: #fff !important; color: var(--color-gray) !important;}
.btn_red:hover,
.btn_red:focus {background: #fff !important; color: var(--color-red) !important;}
.btn_grn:hover,
.btn_grn:focus {background: #fff !important; color: var(--color-green) !important;}
.btn_nvy:hover,
.btn_nvy:focus {background: #fff !important; color: var(--color-navy) !important;}

/* 버튼 - 아이콘 */
[class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).btn_ico {display: inline-flex; justify-content: space-between; text-align: left;}
[class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).btn_ico i {font-size: 1.375em; line-height: calc(var(--font-size-016) * 1.4); margin-left: 0.5rem;}

/* 버튼 - 아이콘만 */
[class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).btn_ico.ico {min-width: unset; padding: 0.65em 0.7em;}
[class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).btn_ico.ico i {margin-left: 0;}

/* 버튼 - mini */
[class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).mini {min-width: unset; border-radius: 0.46875em; padding: 0.4875em 0.75em !important; font-size: var(--font-size-015);}
[class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).mini i {font-size: 1em; line-height: inherit;}



/* 테이블 - 기본 타입 */
div[class*="tbl_st"] {width: 100%; background: #fff; line-height: 1.4; margin-top: 0.3125em; vertical-align: middle; position: relative; overflow: hidden;}
div[class*="tbl_st"] > table {width: calc(100% + 1px); border-top: 1px solid #a4bace; text-align: center; margin-left: -1px; word-break: keep-all; position: relative; -webkit-overflow-scrolling: touch;}
div[class*="tbl_st"] > table th {border-left: 1px solid #d9d9d9; padding: var(--font-size-015); font-size: var(--font-size-017); font-weight: 700;}
div[class*="tbl_st"] > table td {border-left: 1px solid #d9d9d9; padding: var(--font-size-020); color: #333; border-bottom: 1px solid #e9e9e9;}
div[class*="tbl_st"] > table tbody tr:last-child th,
div[class*="tbl_st"] > table tbody tr:last-child td {border-bottom: 1px solid #e1e1e1;}
div[class*="tbl_st"] > table thead th {border-bottom: 1px solid #a4bace; background: #dfebf6;}
div[class*="tbl_st"] > table tbody th,
div[class*="tbl_st"] > table tfoot th {border-bottom: 1px solid #e9e9e9; background: #f7f7f7; color: #333;}

/* 테이블 - 4면 라인 */
.tbl_st2 > table {width: 100%; margin-left: 0;}

/* 테이블 - 스크롤 */
.scrllWr:has(.scroll_wide) {position: relative;}
.scrllWr:has(.scroll_wide)::after {content: ""; display: block; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%) right top / 30px 100% no-repeat; position: absolute; right: 0; top: 0; pointer-events: none;}
.scrllWr:has(.scroll_wide) > [class*="scroll_"] {overflow-x: auto;}
.scrllWr:has(.scroll_wide) > [class*="scroll_"] > table {min-width: calc(100% + 1px); width: auto;}

/* 테이블 - 배경 */
.tbl_bg_bl,
.tbl_bg_bl th {color: #111; background-color: #e5eef6 !important;}
.tbl_bg_ye,
.tbl_bg_ye th {color: #111; background-color: #fff4e6 !important;}
.tbl_bg_re,
.tbl_bg_re th {color: #111; background-color: #ffe1e1 !important;}
.tbl_bg_gr,
.tbl_bg_gr th {color: #111; background-color: #eefff7 !important;}
.tbl_bg_org,
.tbl_bg_org th {color: #111; background-color: #ffe0d2 !important;}

/* 테이블 - 라인 */
.tbl_L {border: 2px solid #000 !important;}
.tbl_Lbl {border: 2px solid var(--color-blue) !important;}
.tbl_Lre {border: 2px solid var(--color-red) !important;}
.tbl_Lgr {border: 2px solid var(--color-green) !important;}
.tbl_Lsk {border: 2px solid var(--color-sky) !important;}
.tbl_Lor {border: 2px solid var(--color-orange) !important;}

/* 테이블 - 라인 - top */
.tbl_L_t {border-top: 2px solid #000 !important;}
.tbl_Lbl_t {border-top: 2px solid var(--color-blue) !important;}
.tbl_Lre_t {border-top: 2px solid var(--color-red) !important;}
.tbl_Lgr_t {border-top: 2px solid var(--color-green) !important;}
.tbl_Lsk_t {border-top: 2px solid var(--color-sky) !important;}
.tbl_Lor_t {border-top: 2px solid var(--color-orange) !important;}

/* 테이블 - 라인 - left */
.tbl_L_l {border-left: 2px solid #000 !important;}
.tbl_Lbl_l {border-left: 2px solid var(--color-blue) !important;}
.tbl_Lre_l {border-left: 2px solid var(--color-red) !important;}
.tbl_Lgr_l {border-left: 2px solid var(--color-green) !important;}
.tbl_Lsk_l {border-left: 2px solid var(--color-sky) !important;}
.tbl_Lor_l {border-left: 2px solid var(--color-orange) !important;}

/* 테이블 - 라인 - right */
.tbl_L_r {border-right: 2px solid #000 !important;}
.tbl_Lbl_r {border-right: 2px solid var(--color-blue) !important;}
.tbl_Lre_r {border-right: 2px solid var(--color-red) !important;}
.tbl_Lgr_r {border-right: 2px solid var(--color-green) !important;}
.tbl_Lsk_r {border-right: 2px solid var(--color-sky) !important;}
.tbl_Lor_r {border-right: 2px solid var(--color-orange) !important;}

/* 테이블 - 라인 - bottom */
.tbl_L_b {border-bottom: 2px solid #000 !important;}
.tbl_Lbl_b {border-bottom: 2px solid var(--color-blue) !important;}
.tbl_Lre_b {border-bottom: 2px solid var(--color-red) !important;}
.tbl_Lgr_b {border-bottom: 2px solid var(--color-green) !important;}
.tbl_Lsk_b {border-bottom: 2px solid var(--color-sky) !important;}
.tbl_Lor_b {border-bottom: 2px solid var(--color-orange) !important;}

/* 테이블 - form */
div[class*="tbl_st"] .bu_st1::before,
div[class*="tbl_st"] .list_st1 > li::before {top: 0.25em;}
div[class*="tbl_st"] .bu_st2::before,
div[class*="tbl_st"] .list_st2 > li::before {top: 0.45em;}
div[class*="tbl_st"] .bu_st3::before,
div[class*="tbl_st"] .list_st3 > li::before {top: 0.55em;}
table .btns {margin: 0;}
table [class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]),
table [class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).btn_ico,
table [class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).btn_ico.ico {min-width: unset; border-radius: 0.46875em; padding: 0.4875em 0.75em; font-size: var(--font-size-015);}
table [class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]) i,
table [class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).btn_ico i,
table [class*="btn_"]:not(div[class*="btn_"], ul[class*="btn_"]).btn_ico.ico i {font-size: 1em; line-height: inherit;}
table select,
table input {height: 2.5em; font-size: var(--font-size-016); margin: 0.1875em;}

/* 테이블 - 기타 */
.tbl_utile {font-size: var(--font-size-015); text-align: right; margin-top: calc(var(--font-size-015) * -1.6);}



/* 박스 */
[class^="box_st"] {line-height: 1.4; margin-top: 0.625em; position: relative; z-index: 0;}
[class^="box_st"] .box_tit {font-size: var(--font-size-020); color: var(--color-purple); font-weight: 700; margin-bottom: 0.5em;}
[class^="box_st"] .btns {margin: 0;}
[class^="box_st"] .bu_st1::before,
[class^="box_st"] .list_st1 > li::before {top: 0.25em;}
[class^="box_st"] .bu_st2::before,
[class^="box_st"] .list_st2 > li::before {top: 0.45em;}
[class^="box_st"] .bu_st3::before,
[class^="box_st"] .list_st3 > li::before {top: 0.55em;}

/* 박스 - box_st1 */
.box_st1 {border-radius: var(--font-size-020); background: #eee; padding: calc(var(--font-size-020) * 0.25); position: relative; overflow: hidden;}
.box_st1::before {content: ""; width: 20.5%; height: 45%; background: linear-gradient(90deg, #1165c3 0%, #54b9ff 100%); position: absolute; left: 0; top: 0;}
.box_st1::after {content: ""; width: 79.5%; height: 45%; background: #b1d4ed; position: absolute; right: 0; top: 0;}
.box_st1 .inner {display: flex; border-radius: calc(var(--font-size-020) * 0.75); background: #fff; padding: calc(var(--font-size-020) * 2.25) calc(var(--font-size-020) * 2.75); position: relative; z-index: 1;}
.box_st1 .inner .icnWr {flex-shrink: 0; width: calc(var(--font-size-020) * 4.55); height: calc(var(--font-size-020) * 4.55); margin-right: calc(var(--font-size-020) * 2.5);}
.box_st1 .inner .icnWr img {width: 100%; height: 100%; object-fit: contain;}
.box_st1 .inner .txtWr {flex: 1;}

/* 박스 - [class*="box_st"] */
[class*="box_st"]:not(.box_st1) {border-radius: 0.625em; border: 1px solid transparent; background: transparent; padding: 1.275em 1.875em; font-size: var(--font-size-016); color: #333;}
.box_st2 {border-color: #cacfda !important; background: #fff !important;}
.box_st3 {border-style: dotted !important; border-color: #4c66a5 !important; background: #fff !important;}
.box_st4 {border-color: #f6f6f6 !important; background: #f6f6f6 !important;}



/* 탭 - tab_st */
div[class^="tab_st"] {font-size: var(--font-size-018); margin-bottom: 1.66em; position: relative;}
div[class^="tab_st"] > .select {display: none; justify-content: center; align-items: center; height: 100%; border-radius: 0.55em; padding: 1em; text-align: center;}
div[class^="tab_st"] > ul {display: flex; flex-wrap: wrap; margin: -0.28em;}
div[class^="tab_st"] > ul > li {width: 25%; padding: 0.28em;}
div[class^="tab_st"] > ul > li > a {display: flex; justify-content: center; align-items: center; height: 100%; border-radius: 0.55em; padding: 1em; text-align: center;}
/* 탭 - tab_st : active */
div[class^="tab_st"] > ul > li > a {transition: var(--trst-short);}

/* 탭 - tab_st - tab_st1 */
.tab_st1 > ul > li > a {border: 1px solid #cacfda; background: #f2f8fb; color: #42567e;}
/* 탭 - tab_st - tab_st1 : active */
.tab_st1 > ul > li > a:hover,
.tab_st1 > ul > li > a:focus,
.tab_st1 > ul > li.on > a,
.tab_st1 > .select {border-color: #00317a; background: #00317a; box-shadow: 0 0 0.55em rgba(0,0,0,0.2); color: #fff; font-weight: 700;}

/* 탭 - tab_st - tab_st2 */
.tab_st2 > ul > li > a {border: 1px dashed #cacfda; color: #42567e;}
/* 탭 - tab_st - tab_st2 : active */
.tab_st2 > ul > li > a:hover,
.tab_st2 > ul > li > a:focus,
.tab_st2 > ul > li.on > a,
.tab_st2 > .select {border-color: #0d82d3; background: #0d82d3; color: #fff; font-weight: 700;}

/* 탭 - tab_list */
.tab_list {display: flex; flex-wrap: wrap; border-radius: 0.59em; border: 1px solid #cacfda; padding: 0.8em 1.47em; font-size: var(--font-size-017); line-height: 1.4; margin-bottom: 1.76em; position: relative;}
.tab_list > li {width: 25%;}
.tab_list > li > a {display: block; padding: 0.25em 1em; color: #42567e; position: relative;}
.tab_list > li > a::before {content: ""; display: block; width: 0.41em; height: 0.41em; border-radius: 50%; background: #bbb; position: absolute; left: 0; top: 0.7em;}
/* 탭 - tab_list : active */
.tab_list > li > a,
.tab_list > li > a::before {transition: var(--trst-short);}
.tab_list > li > a:hover,
.tab_list > li > a:focus,
.tab_list > li.on > a {color: #0d82d3; font-weight: 700;}
.tab_list > li > a:hover::before,
.tab_list > li > a:focus::before,
.tab_list > li.on > a::before {background: #0d82d3;}

/* 탭 - 한 열당 탭 갯수 */
.Tab_w50 li {width: 50% !important;}
.Tab_w30 li {width: calc(100% / 3) !important;}
.Tab_w20 li {width: 20% !important;}



/* 이미지 사이즈 - 확대보기 */
.box_img {padding: 4rem !important;}
.rsp_img {font-size: 0; line-height: 0; text-align: center; position: relative;}
.rsp_img img {max-width: 100%;}
.rsp_img .btn-zoom {display: block; width: 45px; height: 45px; background: url(/00_common/images/con_com_shr/ico_rsp_img.png) center / cover; position: absolute; right: 0; bottom: 0; z-index: 100; overflow: hidden;}



/* 콘텐츠 준비중 */
.Coming_soon {max-width: 40.41em; border-radius: 5.88em; background: linear-gradient(0deg, #3752c4 0%, #249bff 100%); padding: 4.75em 1.18em; font-size: var(--font-size-017); color: #fff; text-align: center; line-height: 1.4; margin: 0 auto; position: relative;}
.Coming_soon::before {content: ""; display: block; width: 13.53em; height: 14.48em; background: url(/00_common/images/con_com_shr/cmgSn_bg01.png) center bottom / contain no-repeat; position: absolute; left: -5.94em; bottom: -0.88em;}
.Coming_soon::after {content: ""; display: block; width: 20.18em; height: 14.48em; background: url(/00_common/images/con_com_shr/cmgSn_bg02.png) center bottom / contain no-repeat; position: absolute; right: -7.24em; bottom: -1.18em;}
.Coming_soon img {max-width: calc(var(--font-size-017) * 5.71); max-height: calc(var(--font-size-017) * 3.83); object-fit: contain; margin-bottom: calc(var(--font-size-017) * 0.5);}
.Coming_soon h3 {font-size: 2.35em; font-weight: 700;}
.Coming_soon h3 strong {color: #ffdc3b;}
.Coming_soon p {display: inline-block; padding-top: calc(2px + 1.5em); margin-top: 1.25em; position: relative;}
.Coming_soon p::before {content: ""; display: block; width: 100%; height: 2px; background: url(/00_common/images/con_com_shr/cmgSn_brdr.png); position: absolute; left: 0; top: 0;}



@media screen and (max-width: 1640px) {

	/* 이미지 사이즈 - 확대보기 */
	.box_img {padding: 2rem !important;}
}



@media screen and (max-width: 1440px) {

	/* 리스트 - 가로 나열 */
	.li_w20 > li {width: 25%;}

	/* 박스 - box_st1 */
	.box_st1 .inner {padding: calc(var(--font-size-020) * 1.25) calc(var(--font-size-020) * 1.75);}
	.box_st1 .inner .icnWr {width: calc(var(--font-size-020) * 4); height: calc(var(--font-size-020) * 4); margin-right: calc(var(--font-size-020) * 1.5);}

	/* 박스 - [class*="box_st"] */
	[class*="box_st"]:not(.box_st1) {padding: 1.25em 1.75em;}
}



@media screen and (max-width: 1240px) {

	/* 리스트 - 가로 나열 */
	.li_w25 > li,
	.li_w20 > li {width: calc(100% / 3);}

	/* 테이블 - 기타 */
	.tbl_utile {margin-top: 0;}

	/* 탭 - tab_st */
	div[class^="tab_st"].reactTab {font-size: var(--font-size-017);}
	div[class^="tab_st"].reactTab > .select {display: flex; justify-content: space-between; align-items: flex-start; padding: 0.75rem 1rem; text-align: left;}
	div[class^="tab_st"].reactTab > .select::after {content: "\e942"; font-family: 'xeicon'; margin-left: 1rem;}
	div[class^="tab_st"] > ul {display: none; border-radius: 0.55em; border: 1px solid #ccc; margin: 0; overflow: hidden;}
	div[class^="tab_st"] > ul > li {width: 100% !important; padding: 0;}
	div[class^="tab_st"] > ul > li > a {display: flex; justify-content: space-between; align-items: flex-start; border-radius: 0; padding: 0.5rem 1rem; font-size: 0.95em; text-align: left; position: relative;}
	/* 탭 - tab_st : active */
	div[class^="tab_st"] > ul > li.on > a::after {content: "\e92c"; font-family: 'xeicon'; margin-left: 0.5rem;}

	/* 탭 - tab_st - tab_st1 */
	.tab_st1 > ul {background: #f2f8fb;}
	.tab_st1 > ul > li + li {border-top: 1px solid #cacfda;}
	.tab_st1 > ul > li > a {border: 0; background: none;}
	/* 탭 - tab_st - tab_st1 : active */
	.tab_st1 > ul > li > a:hover,
	.tab_st1 > ul > li > a:focus,
	.tab_st1 > ul > li.on > a {background: none; box-shadow: unset; color: #00317a;}

	/* 탭 - tab_st - tab_st2 */
	.tab_st2 > ul {background: #fff;}
	.tab_st2 > ul > li + li {border-top: 1px dashed #cacfda;}
	.tab_st2 > ul > li > a {border: 0;}
	/* 탭 - tab_st - tab_st1 : active */
	.tab_st2 > ul > li > a:hover,
	.tab_st2 > ul > li > a:focus,
	.tab_st2 > ul > li.on > a {background: none; color: #0d82d3;}

	/* 탭 - tab_list */
	.tab_list {padding: 0.75rem 1rem;}

	/* 탭 - 한 열당 탭 갯수 */
	.Tab_w20 li {width: 25% !important;}
}



@media screen and (max-width: 1024px) {

	/* mobile - width - px */
	.mob_w10 {width: 10%;}
	.mob_w20 {width: 20%;}
	.mob_w25 {width: 25%;}
	.mob_w30 {width: 30%;}
	.mob_w33 {width: calc(100% / 3);}
	.mob_w40 {width: 40%;}
	.mob_w50 {width: 50%;}
	.mob_w60 {width: 60%;}
	.mob_w70 {width: 70%;}
	.mob_w75 {width: 75%;}
	.mob_w80 {width: 80%;}
	.mob_w90 {width: 90%;}
	.mob_w100 {width: 100%;}

	/* 테이블 - 기본 타입 */
	div[class*="tbl_st"] > table {word-break: break-all;}

	/* 테이블 - 스크롤 */
	.scrllWr:has(.scroll_wide, .scroll_gr) {position: relative;}
	.scrllWr:has(.scroll_wide, .scroll_gr)::after {content: ""; display: block; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%) right top / 30px 100% no-repeat; position: absolute; right: 0; top: 0; pointer-events: none;}
	.scrllWr:has(.scroll_wide, .scroll_gr) > [class*="scroll_"] {overflow-x: auto;}
	.scrllWr:has(.scroll_wide, .scroll_gr) > [class*="scroll_"] > table {min-width: unset; width: 1024px;}

	/* 박스 - box_st1 */
	.box_st1 .inner {padding: 1rem;}
	.box_st1 .inner:has(.icnWr) {padding-left: 1.5rem;}
	.box_st1 .inner .icnWr {width: calc(var(--font-size-020) * 3.5); height: calc(var(--font-size-020) * 3.5); margin-right: 1.5rem;}

	/* 박스 - [class*="box_st"] */
	[class*="box_st"]:not(.box_st1) {padding: 1em;}

	/* 탭 - tab_list */
	.tab_list > li {width: calc(100% / 3);}

	/* 탭 - 한 열당 탭 갯수 */
	.Tab_w20 li {width: calc(100% / 3) !important;}

	/* 이미지 사이즈 - 확대보기 */
	.box_img {padding: 1rem !important;}

	/* 콘텐츠 준비중 */
	.Coming_soon::before,
	.Coming_soon::after {height: 10.86em;}
}



@media screen and (max-width: 860px) {

	/* 테이블 - 스크롤 */
	.scrllWr:has(.scroll_wide, .scroll_gr) > [class*="scroll_"] > table {width: 860px;}
}



@media screen and (max-width: 768px) {

	/* 리스트 - 가로 나열 */
	.li_w30 > li,
	.li_w25 > li,
	.li_w20 > li {width: 50%;}
}



@media screen and (max-width: 680px) {

	/* 탭 - tab_list */
	.tab_list > li {width: 50%;}

	/* 탭 - 한 열당 탭 갯수 */
	.Tab_w30 li,
	.Tab_w20 li {width: 50% !important;}
}



@media screen and (max-width: 580px) {

	/* 리스트 - 가로 나열 */
	.li_w50 > li,
	.li_w30 > li,
	.li_w25 > li,
	.li_w20 > li {width: 100%;}

	/* 콘텐츠 준비중 */
	.Coming_soon {border-radius: 1.5rem; padding: 3em 1em;}
	.Coming_soon::before,
	.Coming_soon::after {display: none;}
	.Coming_soon h3 {font-size: 2em;}
	.Coming_soon p {padding-top: calc(2px + 1.25em); margin-top: 1em;}
}



@media screen and (max-width: 480px) {

	/* 박스 - box_st1 */
	.box_st1 .inner:has(.icnWr) {padding-left: 1rem;}
	.box_st1 .inner .icnWr {display: none;}

	/* 탭 - tab_list */
	.tab_list > li {width: 100%;}

	/* 탭 - 한 열당 탭 갯수 */
	.Tab_w50 li,
	.Tab_w30 li,
	.Tab_w20 li {width: 100% !important;}

	/* 콘텐츠 준비중 */
	.Coming_soon img {max-height: calc(var(--font-size-017) * 3.25);}
	.Coming_soon h3 {font-size: 1.75em;}
}



@media screen and (max-width: 380px) {

	/* 콘텐츠 준비중 */
	.Coming_soon {padding: 1.75em 1em;}
	.Coming_soon h3 {font-size: 1.5em;}
	.Coming_soon p {padding-top: calc(2px + 1em); margin-top: 0.75em;}
	.Coming_soon p br {display: none;}
}