@charset "UTF-8"; /*font*/
@import url("../font/remixicon.css"); /* 기본 아이콘 : http://remixicon.com/에서 확인가능 */
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 100;src: url('../font/NotoSansKR-Thin.woff2') format('woff2'), url('../font/NotoSansKR-Thin.woff') format('woff'), url('../font/NotoSansKR-Thin.otf') format('OpenType');}
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 200;src: url('../font/NotoSansKR-Light.woff2') format('woff2'), url('../font/NotoSansKR-Light.woff') format('woff'), url('../font/NotoSansKR-Light.otf') format('OpenType');}
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 300;src: url('../font/NotoSansKR-DemiLight.woff2') format('woff2'), url('../font/NotoSansKR-DemiLight.woff') format('woff'), url('../font/NotoSansKR-DemiLight.otf') format('OpenType');}
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 400;src: url('../font/NotoSansKR-Regular.woff2') format('woff2'), url('../font/NotoSansKR-Regular.woff') format('woff'), url('../font/NotoSansKR-Regular.otf') format('OpenType');}
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 500;src: url('../font/NotoSansKR-Medium.woff2') format('woff2'), url('../font/NotoSansKR-Medium.woff') format('woff'), url('../font/NotoSansKR-Medium.otf') format('OpenType');}
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 600;src: url('../font/NotoSansKR-Bold.woff2') format('woff2'), url('../font/NotoSansKR-Bold.woff') format('woff'), url('../font/NotoSansKR-Bold.otf') format('OpenType');}
@font-face {font-family: 'NotoSansKR';font-style: normal;font-weight: 700;src: url('../font/NotoSansKR-Black.woff2') format('woff2'), url('../font/NotoSansKR-Black.woff') format('woff'), url('../font/NotoSansKR-Black.otf') format('OpenType');}
/*Pretendard*/
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 900;src: url('../font/Pretendard-Black.woff2') format('woff2');}
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 700;src: url('../font/Pretendard-Bold.woff2') format('woff2');}
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 800;src: url('../font/Pretendard-ExtraBold.woff2') format('woff2');}
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 600;src: url('../font/Pretendard-SemiBold.woff2') format('woff2');}
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 300;src: url('../font/Pretendard-Light.woff2') format('woff2');}
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 500;src: url('../font/Pretendard-Medium.woff2') format('woff2');}
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 400;src: url('../font/Pretendard-Regular.woff2') format('woff2');}
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 200;src: url('../font/Pretendard-ExtraLight.woff2') format('woff2');}
@font-face {font-family: 'Pretendard';font-style: normal;font-weight: 100;src: url('../font/Pretendard-Thin.woff2') format('woff2');}
/* RESET -------------------------------------------------------------------------------------------------------------------------------------------- */
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;vertical-align: baseline;font-size: inherit;color: inherit;box-sizing: border-box;letter-spacing: -0.2px;-webkit-print-color-adjust: exact;print-color-adjust: exact;}
dl, ul, ol, menu, li {list-style: none}
fieldset, img {border: 0 none;box-sizing: border-box}
input, select, textarea, button {vertical-align: middle;margin: 0;padding: 0;font-family: inherit;box-sizing: border-box;border: 0 none;}
button {border: 0 none;background-color: transparent;cursor: pointer;box-sizing: border-box;background: none;}
address, caption, cite, code, dfn, em, var {font-style: normal;font-weight: normal;box-sizing: border-box}
input, textarea, img {max-width: 100%}
input:focus:not([type="file"]), select:focus {outline: 1px dashed #000;}
a, a:hover, a:visited, a:active {text-decoration: none}
a:focus, button:focus {outline: 1px dashed #000;}
sup {font-size: small;vertical-align: text-top}
sub {font-size: small;vertical-align: text-bottom}
button, select {-webkit-appearance: none;appearance: none}


input[type^="date"]{position: relative; width: 150px; height: 34px; border: 1px solid #ccc;border-radius: 4px; padding: 0 45px 0 14px; color: #606060; overflow: hidden; font-size: 1.4rem}
input[type^='date']::before {content: attr(data-placeholder);  width: 100%; height: 100%; color: #999999; display: flex; align-items: center}
input[type^='date']:focus::before, input[type^='date']:valid::before { display: none;}
input[type^="date"]::-webkit-calendar-picker-indicator {background:rgba(0,0,0,0); position: absolute; right: 0; top: 0;z-index: 1; width:100%; height: 100%}
input[type^="date"]::after{content:'';width:40px;height: 100%;position: absolute;top: 50%; display: block;right: 0;transform: translateY(-50%);background: rgba(0,0,0,0) url("../img/sub/icon_carendar.png") no-repeat 50% 50%;}
pre{overflow: auto;white-space: pre-wrap;text-wrap: unset;}  
/* Hide Native Arrow IE 10, 11 -------------------------------------------------------------------------------------------------------------------------------------------- */
table {width: 100%;table-layout: fixed;border-collapse: collapse;border-spacing: 0}
table.autotable{ table-layout: auto} 
table caption {overflow: hidden;font-size: 0;line-height: 0;font-size: 0;height: 0;width: 1px;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block}
/* HTML5 for older browsers -------------------------------------------------------------------------------------------------------------------------------------------- */
section, main {display: block}
img {vertical-align: top}
h1, h2, h3, h4, h5, h6, em, strong {font-weight: 600;}
/**********Common element**********/
:lang(ko) {word-break: keep-all}
:lang(en) {word-break: break-all}
html {height: 100%;font-weight: 400;scroll-padding-top: 80px;scroll-behavior: smooth;-ms-scroll-padding-top: 80px;font-size: 62.5%;letter-spacing: -0.2px;}
html * {font-family: 'Pretendard','NotoSansKR','Malgun Gothic', '맑은 고딕', Helvetica,'Apple SD Gothic Neo', Arial, Sans-serif;}
body {position: relative;;font-size: 1.5rem;color: #606060;-webkit-text-size-adjust: 100%;-webkit-font-smoothing: antialiased;height: 100%;}
/* margin
------------------------------------------------------------- */
.mgt0 {margin-top: 0px !important;} .mgt5 {margin-top: 5px !important;} .mgt10 {margin-top: 10px !important;} .mgt15 {margin-top: 15px !important;} .mgt20 {margin-top: 20px !important;} .mgt30 {margin-top: 30px !important;} .mgt40 {margin-top: 40px !important;} .mgt45 {margin-top: 45px !important;} .mgt50 {margin-top: 50px !important;} .mgb0 {margin-bottom: 0px !important;} .mgb5 {margin-bottom: 5px !important;} .mgb10 {margin-bottom: 10px !important;} .mgb15 {margin-bottom: 15px !important;} .mgb20 {margin-bottom: 20px !important;} .mgl0 {margin-left: 0px !important;} .mgl5 {margin-left: 5px !important;} .mgl10 {margin-left: 10px !important;} .mgl15 {margin-left: 15px !important;} .mgl20 {margin-left: 20px !important;} .mgl40 {margin-left: 40px !important;} .mgl70 {margin-left: 70px !important;} .mgr0 {margin-right: 0px !important;} .mgr5 {margin-right: 5px !important;} .mgr10 {margin-right: 10px !important;} .mgr15 {margin-right: 15px !important;} .mgr20 {margin-right: 20px !important;} .mgr25 {margin-right: 25px !important;} .mgb10 {margin-bottom: 10px;}
/* IPHONE -------------------------------------------------------------------------------------------------------------------------------------------- */
input:disabled, textarea:disabled {opacity: 1;-webkit-text-fill-color: inherit}
textarea, input {border-radius: 0}
input[type="number"] {-webkit-appearance: none;appearance: none;box-shadow: none}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {-webkit-appearance: none;margin: 0}
/*Normalize v8.0.0 | MIT License | github.com/necolas/*/
html {-webkit-text-size-adjust: 100%}
small {font-size: 80%}
sub, sup {position: relative;line-height: 0;font-size: 60%;vertical-align: baseline}
sub {bottom: -0.25em}
sup {top: -0.5em}
button, input, optgroup, select, textarea {font-family: inherit;line-height: 1.15;margin: 0}
button, input {overflow: visible}
button, select {text-transform: none}
button, [type="button"], [type="reset"], [type="submit"] {-webkit-appearance: button}
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {border-style: none;padding: 0}
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {outline: 1px dotted ButtonText}
button {color: inherit;font-size: inherit;}
textarea {overflow: auto}
[type="checkbox"], [type="radio"] {box-sizing: border-box;padding: 0}
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height: auto}
[type="search"] {-webkit-appearance: textfield;outline-offset: -2px}
[type="search"]::-webkit-search-decoration {-webkit-appearance: none}
input::-ms-clear, input::-ms-reveal {display: none;width: 0;height: 0}
input::-webkit-search-decoration, input::-webkit-search-cancel-button, input::-webkit-search-results-button, input::-webkit-search-results-decoration {display: none}
::-webkit-file-upload-button {-webkit-appearance: button;font: inherit}
abbr[title] {border-bottom: none;-webkit-text-decoration: underline dotted;text-decoration: underline dotted}
progress {vertical-align: baseline}
details {display: block}
summary {display: list-item}
[hidden], template, hr {display: none}
/* Input -------------------------------------------------------------------------------------------------------------------------------------------- */
input[type="text"], input[type="password"], input[type="number"], input[type="email"], input[type="tel"] {min-width: 135px;min-height: 34px;padding: 0 10px;border: 1px solid #dedfe4;background-color: #fff;box-sizing: border-box;font-size: 1.3rem;color: #222;border-radius: 6px;}
textarea:-ms-input-placeholder {color: #6E6E6E;font-size: 1.3rem;font-weight: 400;}
textarea::placeholder {color: #6E6E6E;font-size: 1.6rem;font-weight: 400;}
input[type="text"].full, input[type="password"].full, input[type="number"].full, input[type="email"].full, input[type="tel"].full {width: 100%}
label {font-size: 1.3rem;color: #333}
label+input[type="text"], label+input[type="password"] {margin-left: 5px}
label:first-child+input[type="text"], label:first-child+input[type="password"] {margin-left: 0}
label.essential::before {content: '*';display: inline-block;margin-right: 4px;vertical-align: middle}
input[type="text"]:not(.dates):read-only, input[type="password"]:read-only, input[type="number"]:read-only, input[type="email"]:read-only, input[type="text"]:disabled, input[type="password"]:disabled, input[type="number"]:disabled, input[type="email"]:disabled, input[type="tel"]:disabled {background-color: #fff;color: #646464 ;border: 1px solid #c5c5c5;}
input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="tel"]:-ms-input-placeholder {color: #999;font-size: 1.6rem;font-weight: 300;}
input[type="text"]::placeholder, input[type="password"]::placeholder, input[type="number"]::placeholder, input[type="email"]::placeholder, input[type="tel"]::placeholder {color: #999;font-size: 1.3rem;font-weight:400;}
textarea {resize: none;width: 100%;min-height: 70px;padding: 10px 20px;border: 1px solid #c5c5c5;background-color: #fff;box-sizing: border-box;font-size: 1.4rem;line-height: 24px;color: #222}
textarea:focus{outline: 1px dashed #000;}

::-webkit-input-placeholder {color: #6E6E6E !important;font-weight: normal;font-style: normal}
::-moz-placeholder {color: #6E6E6E !important;font-weight: normal;font-style: normal}
:-ms-input-placeholder {color: #6E6E6E !important;font-weight: normal !important;font-style: normal}
:-moz-placeholder {color: #6E6E6E !important;font-weight: normal;font-style: normal}
/* RADIO -------------------------------------------------------------------------------------------------------------------------------------------- */
.pass_bx {display: flex;gap: 50px;margin-left: 5px;align-items: center;}
input[type="radio"] {width: 20px;height: 20px;}
input[type="radio"]:checked {border: 1px solid #E0E0E0;}
[type="radio"]:checked, [type="radio"]:not(:checked) {position: absolute;left: -9999px;}
[type="radio"]:checked + label, [type="radio"]:not(:checked) + label {position: relative;padding-left: 28px;cursor: pointer;line-height: 18px;display: inline-block;color: #333;letter-spacing: -0.05em}
[type="radio"]:checked + label:before, [type="radio"]:not(:checked) + label:before {content: '';position: absolute;left: 0;top: 0;width: 12px;height: 12px;border: 5px solid #fff;border-radius: 100%;background-color: #E0E0E0;outline: 1px solid #e0e0e0;}
[type="radio"]:checked + label:before {border: 5px solid #3339CD;}
/*[type="radio"]:focus-within + label:before {outline: 1px solid #3339CD;border-color: transparent;}*/
[type="radio"]:checked + label:after, [type="radio"]:not(:checked) + label:after {content: '';width: 12px;height: 12px;background: #fff;position: absolute;top: 5px;left: 5px;border-radius: 100%;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
[type="radio"]:not(:checked) + label:after {opacity: 0;-webkit-transform: scale(0);transform: scale(0);}
[type="radio"]:checked + label:after {opacity: 1;-webkit-transform: scale(1);transform: scale(1); display: none}
[type="radio"]:checked + label:before{ background: #fff; width: 10px; height: 10px; border-width: 6px; outline-color:#3339CD } 
/* checkbox -------------------------------------------------------------------------------------------------------------------------------------------- */

input[type="checkbox"] {width: 20px;height: 20px;}
input[type="checkbox"]:checked {border: 5px solid #E0E0E0;}
[type="checkbox"]:checked, [type="checkbox"]:not(:checked) {position: absolute;left: -9999px;}
[type="checkbox"]:checked + label, [type="checkbox"]:not(:checked) + label {position: relative;padding-left: 28px;cursor: pointer;line-height: 18px;display: inline-block;color: #333;letter-spacing: -0.05em;}
[type="checkbox"]:checked + label:before, [type="checkbox"]:not(:checked) + label:before{content: '';position: absolute;left: 0;top: 0;width: 12px;height: 12px;border: 5px solid #fff;border-radius: 100%;background-color: #E0E0E0;outline: 1px solid #e0e0e0;}
[type="checkbox"]:checked + label:before {border: 5px solid #3339CD; outline: 0 none;}
/* [type="checkbox"]:focus-within + label:before {outline: 5px solid #3339CD;border-color: transparent;} */
[type="checkbox"]:checked + label:after, [type="checkbox"]:not(:checked) + label:after {content: '';width: 12px;height: 12px;background: #fff;position: absolute;top: 5px;left: 5px;border-radius: 100%;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
[type="checkbox"]:not(:checked) + label:after {opacity: 0;-webkit-transform: scale(0);transform: scale(0);}
[type="checkbox"]:checked + label:after {opacity: 1;-webkit-transform: scale(1);transform: scale(1);}
.switch_label::after, .switch_label::before{display: none;}

/* COLOR -------------------------------------------------------------------------------------------------------------------------------------------- */
.black {color: #222 !important;}
.blurple {color: #3339cd !important;}
.cerulean {color: #006ae5 !important;}
.red {color: #e50000 !important;}
.green {color: #38b261 !important;}
/* old -------------------------------------------------------------------------------------------------------------------------------------------- */
/*.blind, .hidden { visibility: hidden; overflow: hidden; position: absolute; top: 0; left: 0; width: 0; height: 0; font-size: 0; line-height: 0}
.sr-only { display: block !important; position: absolute !important; top: -9999px !important; left: 0 !important; margin: 0 !important; padding: 0 !important; font-size: 0 !important; line-height: 0 !important; border: 0 !important; overflow: hidden !important;}
.hide { overflow: hidden; display: block; position: absolute; border: 0; width: 1px; height: 1px; clip: rect(1px, 1px, 1px, 1px)} .al { text-align: left !important;}*/
.sr,.sr-only {clip: rect(1px, 1px, 1px, 1px);position: absolute;margin: -1px;height: 1px;width: 1px;border: 0;padding: 0;overflow: hidden;word-wrap: normal;}
.ar {text-align: right !important;}
.ac {text-align: center !important;}
.ws_nowrap {white-space: nowrap !important}
.ws_wrap {white-space: normal!important}
.fsn {font-style: normal}
.clearfix:before, .clearfix:after {display: block;content: '';line-height: 0;}
.clearfix:after {clear: both;}
/* 말줄임 -------------------------------------------------------------------------------------------------------------------------------------------- */
.txt_nowrap {display: block;width: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}
.txt_nowrap2 {display: block;width: 100%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.txt_nowrap3 {display: block;width: 100%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
/* img_box -------------------------------------------------------------------------------------------------------------------------------------------- */
.img_box img {width: 100%;height: 100%;object-fit: cover; max-width: none}
/*페이징 -------------------------------------------------------------------------------------------------------------------------------------------- */
.board-paging, .pagination {margin: 20px auto 14px;text-align: center; }
.pagination{ gap:5px} 
.paging-list,.pagination {width: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
.board_list .total{margin-bottom: 10px;color: #222;font-size: 1.3rem;}
.board_list .total span,.board_list .total strong.primary{color: #3339cd; font-weight: 700;}
.primary{ color: #3339cd !important} 
.paging-list li {}
.paging-list li~li {margin-left: 5px;}
.paging-list li a, .pagination a {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 20px;height: 20px;font-size: 1.2rem}
.board_list .paging-list li a,.pagination a {width: auto; min-width: 22px;height: 22px; padding: 0 5px}
.paging-list li.on a, .pagination a.current {background-color: #3339cd;color: #fff;font-weight: bold;;border-radius:12px}
.paging-list li a:hover,.pagination a:hover {color: #3339cd;}
.paging-list li.on a:hover,.pagination a.current:hover {color: #fff;}
.board-paging .prev, .board-paging .first, .board-paging .next, .board-paging .last, .pagination a.first, .pagination a.prev, .pagination a.next, .pagination a.last     {border-radius: 50%;border: 1px solid #f5f5f5;}
.board-paging .prev,  .pagination a.prev {background: url(../img/common/icon_splite.png) no-repeat -3px -4px #f5f5f5;}
.board-paging .prev:hover, .pagination a.prev:hover {background-color: #fff;border: 1px solid #e1e1e1;}
.board-paging .first, .pagination a.first {background: url(../img/common/icon_splite.png) no-repeat -60px -4px #f5f5f5}
.board-paging .first:hover, .pagination a.first:hover {background-color: #fff;border: 1px solid #e1e1e1;}
.board-paging .next, .pagination a.next {background: url(../img/common/icon_splite.png) no-repeat -28px -4px #f5f5f5;}
.board-paging .next:hover, .pagination a.next:hover {background-color: #fff;border: 1px solid #e1e1e1;}
.board-paging .last,.pagination a.last {background: url(../img/common/icon_splite.png) no-repeat -91px -4px #f5f5f5;}
.board-paging .last:hover,.pagination a.last:hover {background-color: #fff;border: 1px solid #e1e1e1;}
.paging-list li a.disabled, .pagination a.disabled{ display: none} 

/* TAB-------------------------------------------------------------------------------------------------------------------------------------------- */
.tab_box .tabs {}
[role="tablist"] {display: flex;}
[role="tab"] {width: 90px;height: 44px ;z-index: 2;padding: 14px 0;border-bottom: 1px solid #dbdbdb;background: #F8F8F8;outline: none;overflow: hidden;text-align: center;cursor: pointer;font-size: 1.4rem;}
[role="tab"] ~ [role="tab"] {border-left: 1px solid #dbdbdb;}
[role="tab"][aria-selected="true"] {background: #3339cd;color: #fff;}
[role="tabpanel"] {padding: 16px 13px;border-radius: 0 5px 5px;background: #fff;min-height: 10em;width: 100%;}
[role="tabpanel"].is-hidden {display: none;}
[role="tabpanel"] p {margin: 0;}
/*검색-------------------------------------------------------------------------------------------------------------------------------------------- */
.search_con {position: relative;margin-bottom: 20px;padding: 15px 35px;border: 1px solid #e5e6ea;border-radius: 15px;box-shadow: 2.5px 3.1px 2px 0 rgba(230, 230, 230, 0.5); display: flex; justify-content: space-between; align-items: center; gap:70px; width: 100%}
.search_con .search_box{ width: 100%} 
/*테두리*/
.board-search-box {display: flex;align-items: center; width: 100% }
.board-search-box > p {margin-right: 24px;font-size: 1.3rem;font-weight: 800;color: #222;}
.board-search-box > div {background-color: #fff;}
.board-search-box .board-search-keyword {position: relative; width: 100%; min-width:150px;margin: 0 10px; max-width: 450px}
.board-search-box .board-search-keyword [type="text"] {width: 100%;}
.board-search-box .board-search-keyword [type="text"]::placeholder {font-size: 1.3rem;color: #868f9a;}
.searchBtn {min-width: 96px; height: 34px;padding: 0px 12px 0px 12px;box-shadow: 2px 2px 4px #e5e6ea;border: solid 1px #999999; border-radius: 16.5px; display: inline-flex; gap:8px; align-items: center; justify-content: center; color: #606060}
.searchBtn:before{ content: ""; display: block; width: 14px; height: 14px;background: url(../img/common/icon_search.png)no-repeat; background-size: 14px;} 

.searchBtn span {font-size: 1.4rem; font-weight: 600}
.board-search-category,select {position: relative;font-size: 1.3rem;color: #222;}
.board-search-category::after {content: "";position: absolute;top: 50%;right: 8px;width: 16px;height: 16px;background: url(../img/common/icon_arrow.png);transform: translateY(-50%);transition: .3s;}
select:not(.input-text){background: url(../img/common/icon_arrow.png) no-repeat right 12px top 50%; padding-right: 40px !important}
.search_box .board-search-category::before {position: absolute;top: 50%;right: 32px;width: 1px;height: 14px;transform: translateY(-50%);transition: .3s;background: #dedfe4; content: ""}
.board-search-category select {min-width: 142px; padding: 7px 40px 7px 14px;border-right: 1px solid #333;border: solid 1px #dedfe4;border-radius: 6px;}
/*board-search-type1_중앙정렬*/
.board-search-type1 {justify-content: center;}
/*board-search-type3_게시판_왼쪽정렬*/
.board-search-type3 {justify-content: flex-start;}
/*board-search-type2_s_size*/
.board-search-type2 .board-search-category select {min-width: 90px; font-size: 1.5rem; font-weight: 600;}
.board-search-type2 .board-search-category::before{display: none;}
.board-search-type2 .board-search-keyword {min-width: 138px;}
.board-search-type2 .searchBtn {min-width: 90px;  font-size: 1.5rem; font-weight: 600;}
.board-search-box:focus-within input,.board-search-box:focus-within select, .board-search-box:focus-within .searchBtn{ border-color: #676768} 
/*table-------------------------------------------------------------------------------------------------------------------------------------------- */
.board_list tbody [class*="hover"] td{background-color: #F4F5FD;}
.board_list tbody [class*="hover"] td.read_app{background-color:rgba(254,86,75,0.1)}
.tag_inner .board_list tbody [class*="hover"],.risk_inner .board_list tbody [class*="hover"]{cursor: pointer;}


.table_box {}
.table_box table {border-collapse: collapse;border-top: 2px solid #3339cd;border-bottom: 1px solid #b5b5b5;}
.table_box table th, .table_box table td {position:relative;padding: 8px 8px;vertical-align: middle;text-align: center;word-break: keep-all;font-size: 1.4rem;}
.table_box table thead tr th {height: 40px;font-weight: 600;color: #222;border: 1px solid #ddd;background-color: #F9F9F9;}
.table_box table tbody td {border: 1px solid #e1e1e1;color: #707070; height: 47px}
.table_box table tbody td .txt_box{ text-align: left} 
.table_box table tbody td.read_app, .table_box table thead th.read_app{ color: #222; border-color: rgba(51,57,205,0.3)} 



.table_box.table_type01 table th, .table_box.table_type01 table td{font-size: 1.3rem;}
h3 {font-size: 2rem;line-height: 40px;color: #222;font-weight: 700;line-height: 1;padding-bottom: 21px;}
/*필수표시 * -------------------------------------------------------------------------------------------------------------------------------------------- */
.tip::after {display: inline-block;content: "*";padding-right: 2px;color: #df0000;}

/*button btn-------------------------------------------------------------------------------------------------------------------------------------------- */
a[class^="btn"]:not(.btn_page) {display: block;color: #fff;padding-top: 11px;font-size: 1.3rem; white-space: nowrap}
.btn_exc {position: relative;background-color: #6173f4;/* width: 139px; */height: 38px;text-align: center;border-radius: 8px;padding: 0 20px !important; display: inline-flex !important; align-items: center; justify-content: center; gap:5px}
.btn_exc::before {content: '';display:block;width:  20px;height: 20px;background: url(../img/sub/icon_dowmload.png) no-repeat 50% 50% ;}
.btn_exc2::before { background-image: url(../img/sub/icon_upload.png) ;}
.btn_exc3{padding:0 10px !important;}
.btn_exc3::before {background-image: url(../img/sub/icon_select.png) ;}
.btn_exc4::before {background-image: url(../img/sub/icon_input.png) ;}
.btn_exc5::before {background-image: url(../img/sub/icon_input.png) ; border-bottom: 1px solid #fff; background-position: 50% 0; opacity: 0.7}
[class*="btn_posit_"]{ position: absolute; right: 0; top: 0}

.btn_exc4, .btn_exc5{  } 
.btn_exc:not(.btn_exc5) + .btn_exc4{ margin-left: 15px;background:#3339cd !important;} 
.btn_exc:not(.btn_exc4) + .btn_exc5{ margin-left: 15px;background:#3339cd !important;} 
.btn_exc4 + .btn_exc5, .btn_exc5 + .btn_exc4{background:#3339cd !important;} 
.btn_set {display: flex;justify-content: center;gap: 10px;margin-top: 30px; width: 100%}
.btn_set button { min-width: 55px}
button[class^="btn0"]{padding: 11px 12px;color: #fff;font-weight: 600;font-size: 1.4rem;border-radius: 6px;}
.btn01 {background: #999;}
.btn02 {background: #777}
.btn03 {background: #3339cd}
.btn_exc:hover, .btn_exc:not(.btn_exc5) + .btn_exc4:hover{ background-color: #4d50d3 !important} 
#switch:checked+.switch_label {background: #3339cd;border: 2px solid #3339cd;}
#switch:checked+.switch_label:hover {background: #2a2ea7;}
#switch:checked+.switch_label .onf_btn {left: 17px;background: #fff;}
#switch {position: absolute;appearance: none;-webkit-appearance: none;-moz-appearance: none;}
.switch_label {position: relative;cursor: pointer;display: inline-block;width: 40px;height: 20px;background: #fff;border: 2px solid #3339cd;border-radius: 20px;transition: 0.2s;}
.switch_label:hover {background: #efefef;}

.onf_btn {position: absolute;top: 0;left: -1px;display: inline-block;width: 16px;height: 16px;border-radius: 20px;background: #3339cd;transition: 0.2s;}

.round_btn span{display: inline-block;width: 70px;padding: 5px;color: #fff;font-size: 1.1rem;text-align: center; border-radius: 10px;}
.round_btn .round_r{background-color: #fe564b;}
.round_btn .round_dr{background-color:#9f1107;}
.round_btn .round_b{background-color: #2354de;}
.round_btn .round_s{background-color: #15c2fa;}

.btn_on_off{position: absolute; display: block ;padding: 3px 0;border-radius: 15px; width: 38px; background-color: #38b261; color: #fff;text-align: center;font-size: 1.2rem;}/*공통*/

.btn_on_off[status="OFF"], .btn_on_off.off{background-color: #606060} 
/*popup*/
.popupLayer {display: none;position: fixed;top: 54%;left: 50%;transform: translate(-50%, -50%);background-color: #fff;z-index: 110;border-radius: 15px;box-shadow: 4px 2px 4px 0 rgba(0, 0, 0, 0.1);border: solid 1px #f4f4f4;}
.popup_header_box {position: relative;}
.dim {position: fixed;top: 0;left: 0;bottom: 0;right: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, .5);z-index: 109;}
*[class*=pop-close] {position: absolute;top: 0;right: 30px;color: #999;padding: 0;background-color: #fff;font-size: 15px;line-height: 1.5;}
*[class*=pop-close] i {position: relative;display: inline-block;width: 14px;height: 14px;transform: rotate(45deg);transition: all 0.3s ease-out;vertical-align: middle;}
*[class*=pop-close] i:before {content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 2px;height: 18px;background-color: #999;}
*[class*=pop-close] i:after {content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 18px;height: 2px;background-color: #999;}
*[class*=pop-close]:hover i {transform: rotate(225deg);}
*[class*=pop-close]:hover i:before, *[class*=pop-close]:hover i:after {background-color: rgba(0, 0, 0, 1);}
*[class*=pop-close]:hover i:before {}
*[class*=pop-close]:hover i:after {}
*[class*=pop-close]:focus{ outline-offset: 3px}
/* 달력 */
.cal_bx {position: relative;}
.ui-datepicker, #ui-datepicker-div {padding: 0;width: 272px !important;border: 1px solid #c5c5c5 !important;display: none;}
.ui-widget-header {}
.ui-datepicker .ui-widget-header {background: #fff;border: none;border-bottom: 1px solid #ddd;border-radius: 0;}
.ui-datepicker .ui-datepicker-title {margin: 0;text-align: center;padding: 7px 0;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {margin: 0 3px;border-color: #999999;min-width: auto;height: 30px;}
.ui-datepicker select.ui-datepicker-year + select.ui-datepicker-month {margin-left: 5px;}
.ui-datepicker table {background: #ebf7ff;margin-bottom: 0;border-top: 0;}
.ui-datepicker th {padding: 0;font-size: 12px !important;background: none !important;border: none !important;}
.ui-datepicker th, .ui-datepicker td {height: 30px;border: none;text-align: center;padding: 0;vertical-align: middle;}
.ui-datepicker .ui-state-default, .ui-datepicker.ui-widget-content .ui-state-default, .ui-datepicker .ui-widget-header .ui-state-default, .ui-datepicker .ui-button, html .ui-datepicker .ui-button.ui-state-disabled:hover, html .ui-datepicker .ui-button.ui-state-disabled:active {border: none;text-align: center;font-size: 16px;background: #ebf7ff;color: #454545 !important;font-weight: 500;}
.ui-datepicker .ui-state-highlight, .ui-datepicker.ui-widget-content .ui-state-highlight,.ui-datepicker .ui-state-default.ui-state-active {border: 1px solid rgba(51,140,213,0.2);background: rgba(51,140,213,0.15);color: rgba(51,140,213,1) !important;}
.ui-datepicker .ui-state-default.ui-state-hover {background: rgba(51,140,213,0.15);color: rgba(51,140,213,1) !important;}
.ui-datepicker-trigger {position: absolute;top: 0;right: 0;padding: 11px 15px;}
.ui-datepicker .ui-datepicker-buttonpane {margin: 0}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {top: 10px;}
.ui-datepicker .ui-datepicker-prev {left: 10px;}
.ui-datepicker .ui-datepicker-next {right: 10px;}

/*layout*/
body {background: #eceff8;}
#wrap {width: 100%; max-width: 1782px;margin: 0 auto; padding: 0 50px; min-width: 1500px}
#wrap .header {padding: 20px 35px 15px 51px; display: flex; align-items: center; justify-content: space-between; gap:20px; position: relative}
#wrap .header.clearfix:after,#wrap .header.clearfix:before{ display: none} 
h1 {font-size: 2rem;color: #7f8894;font-weight: 300;  display: flex; align-items: center; line-height: 1;  justify-content: center}
h1 a{} 
h1 > span, h1 > a > span {color: #3339cd;font-weight: 700;}
#wrap .header .user_btn {}
#wrap .header .user_btn {display: block;color: #3339cd;background: url(.././img/common/icon_user.png)no-repeat left center;background-size: 28px;padding: 0px 0px 0px 34px;letter-spacing: -0.6px;}
#wrap .header .user_btn span.user_name {font-weight: 700}

#wrap .header .user_btn .logout{ border: 1px solid  #6173f4;   font-size: 1.3rem;height: 30px;text-align: center;border-radius: 8px; background: #fff; padding: 0 10px; color:#3339cd; font-weight: 600; margin-left: 10px } 
#wrap .header .last_update > strong{ display: none} 
#wrap .main {position: relative;display: grid;grid-template-columns: 108px 1fr;background-color: #fff;border-radius: 38px;width: 100%;}
#wrap .main nav {padding: 52px 30px 52px 26px;background-color: #3339cd;border-top-left-radius: 38px;border-bottom-left-radius: 38px; min-height:760px}
.nav .nav_1depth .nav_1box{position: relative;}
.nav .nav_1depth .nav_1box ~ .nav_1box {margin-top: 35px;}
.nav .nav_1depth .nav_1box .tit_1depth {width: 52px;height: 52px;display: block;background: url(../img/common/icon_menu.png) no-repeat;position: relative; z-index: 13}
.nav .nav_1depth .nav_1box .tit_1depth:after, .nav .nav_1depth .nav_1box .tit_1depth:before{ content: ""; background:#3339cd; width: 30px; height: 60px; background: #3339cd; display: block; position: absolute; right: -30px; top:0; z-index: -1} 

.nav .nav_1depth .nav_1box .tit_1depth:before{ background: #3339cd; width: 100%; height: 10px; top: auto; bottom:-10px; right: 0} 

.nav .nav_1depth .nav_1box.open .tit_1depth {background:#3339cd url(../img/common/icon_menu_hover.png) no-repeat; }
/*클릭하여 메뉴 노출 시 */
.nav .nav_1depth .nav_1box .tit_1depth.active {background:#3339cd url(../img/common/icon_menu_hover.png) no-repeat;}
/*현재 페이지 active*/
.nav .nav_1depth .nav_1box:nth-of-type(1) .tit_1depth {background-position: -10px -10px;}
.nav .nav_1depth .nav_1box:nth-of-type(2) .tit_1depth {background-position: -72px -10px;}
.nav .nav_1depth .nav_1box:nth-of-type(3) .tit_1depth {background-position: -134px -10px;}
.nav .nav_1depth .nav_1box:nth-of-type(4) .tit_1depth {background-position: -196px -10px;}
.nav .nav_1depth .nav_1box:nth-of-type(5) .tit_1depth {background-position: -258px -10px;}
.nav .nav_1depth .nav_2depth {visibility: hidden;opacity: 0;position: absolute;top: 0;left:0;width: 0;height: 100%; z-index: -1; transition: left .1.5s}
.nav .nav_1depth .nav_1box:last-of-type .nav_2depth{ top: auto; bottom: 0} 


.nav .nav_1depth .nav_2depth li{height: 60px;display: flex;align-items: center;padding: 0 13px 0 30px; font-weight: 700; width: 100%;}
.nav .nav_1depth .nav_2depth li:hover, .nav .nav_1depth .nav_2depth li.curr{background-color: #c6ccfd;border-right: 3px solid #3339cd;color: #fff; transition: background .3s;  }
.nav .nav_1depth .nav_2depth li.curr{ transition: none} 
.nav .nav_1depth .nav_2depth li a{display: flex;width: 100%;height: 100%;align-items: center;justify-content: flex-start;}
.nav .nav_1depth .nav_2depth li a span{font-size: 1.5rem;;}
.nav.nav_open::after {position: absolute;top: 0;left: 108px;content: '';display: block;width: 100%;height: 100%;background: #0000007e;z-index: 10;}
.nav.nav_open .nav_1depth::after {position: absolute;top: 0;left: 108px;content: '';display: block;width: 230px;height: 100%;background: #fff;z-index: 11;box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.15);}
.nav.nav_open .nav_1depth .nav_1box.open .nav_2depth {visibility: visible;opacity: 1;left: 83px;z-index: 12; width: 230px; transition:all .3s cubic-bezier(0.46, 0.03, 0.52, 0.96); }

@media screen and (max-width: 1200px) {
    body{overflow: auto;position: relative;}
    #wrap .main {width: 100%;}
}
.gray_box{padding: 24px 24px 19px;border-radius: 15px;border: solid 1px #e7e9eb;box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.07);}
.gray_box ~ .gray_box{margin-top: 22px;}
footer{ padding: 20px 50px 15px 50px; font-size: 1.2rem} 
footer .copyright{} 


/* SOS 팝업*/
[class*="modal_sos_"]{ width: 440px !important; border: none !important; border-radius: 40px !important}
[class*="modal_sos_"] .modal_header{ display: flex; justify-content: space-between; color: #fff;  padding: 30px 10px 20px 10px !important; align-items: flex-end}
[class*="modal_sos_"] .modal_header > *{ color: #fff; font-size: 31px; font-weight: 700} 
[class*="modal_sos_"] .modal_header .lv{ font-size: 23px} 
.modal_sos_lv1{ background:#FEC02A !important} 
.modal_sos_lv2{ background:#FF8647 !important} 
.modal_sos_lv3{ background:#FE564B !important} 
[class*="modal_sos_"] .detail_bx{ background: #fff; border-radius:16px; padding: 20px !important } 
[class*="modal_sos_"] .detail_bx dl{ display: flex; gap:25px; padding: 10px 0; align-items: center}
[class*="modal_sos_"] .detail_bx dt{ width: 140px; flex: none; color: #606060} 
[class*="modal_sos_"] .detail_bx dd{ font-size: 14px; font-weight: 500; color:#000000} 
[class*="modal_sos_"] .detail_bx dl + dl:not(.img_box){ border-top: 1px solid #E1E1E1} 
[class*="modal_sos_"] .detail_bx dl.img_box{ padding: 0} 
[class*="modal_sos_"] .btn_set .btn_ok{ background:#333333; color: #fff; border-radius: 26px; height: 52px; font-weight: 600; font-size: 18px; padding: 0 50px; display: inline-flex; flex: none; align-items: center; justify-content: center  } 

/* HTML: <div class="loader"></div> */
.load_bx{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center} 
.loader {--c:no-repeat linear-gradient(#4549b5 0 0); background:var(--c),var(--c),var(--c),var(--c),var(--c),var(--c),var(--c),var(--c),var(--c); background-size: 10px 10px; animation:l32-1 1s infinite, l32-2 1s infinite;}
body > .load_bx{ max-height: 100vh; position: fixed} 
@keyframes l32-1 { 
    0%,100% {width:22px;height: 22px}  
    35%,65% {width:40px;height: 40px}
}
@keyframes l32-2 {
  0%,40%  {background-position: 0 0,0 50%, 0 100%,50% 100%,100% 100%,100% 50%,100% 0,50% 0,  50% 50% }
  60%,100%{background-position: 0 50%, 0 100%,50% 100%,100% 100%,100% 50%,100% 0,50% 0,0 0,  50% 50% }
}

/* 스크롤바 설정*/
::-webkit-scrollbar { width: 10px; height: 10px;}
::-webkit-scrollbar-thumb {height: 10px;background-color: rgba(186, 186, 186, 1); border-radius:10px;}
/* 스크롤바 뒷 배경 설정*/
::-webkit-scrollbar-track { background-color:rgba(0,0,0,0);}
.modalLayer::-webkit-scrollbar-track {  }