@charset "UTF-8";
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 100;
  src: url(/assets/fonts/NotoSans-Thin.woff2) format("woff2"), url(/assets/fonts/NotoSans-Thin.woff) format("woff"), url(/assets/fonts/NotoSans-Thin.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 300;
  src: url(/assets/fonts/NotoSans-Light.woff2) format("woff2"), url(/assets/fonts/NotoSans-Regular.woff) format("woff"), url(/assets/fonts/NotoSans-Light.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 400;
  src: url(/assets/fonts/NotoSans-Regular.woff2) format("woff2"), url(/assets/fonts/NotoSans-Medium.woff) format("woff"), url(/assets/fonts/NotoSans-Regular.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 500;
  src: url(/assets/fonts/NotoSans-Medium.woff2) format("woff2"), url(/assets/fonts/NotoSans-Medium.woff) format("woff"), url(/assets/fonts/NotoSans-Medium.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 700;
  src: url(/assets/fonts/NotoSans-Bold.woff2) format("woff2"), url(/assets/fonts/NotoSans-Bold.woff) format("woff"), url(/assets/fonts/NotoSans-Bold.otf) format("opentype");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 900;
  src: url(/assets/fonts/NotoSans-Black.woff2) format("woff2"), url(/assets/fonts/NotoSans-Black.woff) format("woff"), url(/assets/fonts/NotoSans-Black.otf) format("opentype");
}
@font-face {
  font-family: "JalnanGothic";
  src: url("https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_231029@1.1/JalnanGothic.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
/********************************************************************************************************************************************************************************************************************************************
	기본 베이스 스타일
********************************************************************************************************************************************************************************************************************************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, button,
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: 15px;
  color: #222;
  line-height: 1.428571429;
  font-family: "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-weight: 400;
  vertical-align: baseline;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  word-break: break-all;
}

/* Chrome용 스크롤 바 */
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

::-webkit-scrollbar-track {
  background: none;
  box-shadow: none;
  border-radius: 10px;
}

::-webkit-scrollbar-track:hover {
  background: none;
  box-shadow: none;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background-color: #b9bec2;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #b9bec2;
}

/*::-webkit-scrollbar-button { width: 8px;}*/
::-webkit-scrollbar-button {
  display: none;
}

/* HTML5 display-role reset for older browsers */
ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after {
  content: "";
  content: none;
}

q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

strong {
  font-weight: 700;
}

textarea {
  display: block;
}

legend, caption {
  visibility: hidden;
  overflow: hidden;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
}

/* 클래스 지정  --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* Clear Fix */
.clearfix {
  width: 100%;
  height: auto;
}

.clearfix:after, .clearfix::after {
  content: "";
  display: block;
  clear: both;
  width: 100%;
  height: 0;
}

/* IR */
.blind, .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.none {
  display: none !important;
}

/*overflow*/
.overflow-y {
  overflow-y: auto;
  overflow-x: hidden;
}

.overflow-x {
  overflow-x: auto;
}
.overflow-x + .table {
  margin-top: 15px;
}

/* ALIGN */
.tx-left, .tx-left th, .tx-left td {
  text-align: left !important;
}

.tx-center {
  text-align: center !important;
}

tr.tx-center th {
  text-align: center !important;
}

.table.tx-center td, .table.tx-center th {
  text-align: center;
}

.tx-right, .tx-right td {
  text-align: right !important;
}

/* COLOR POINT */
.tit-d-bl {
  color: #005098;
}

.tit-bl {
  color: #005696;
}

.tit-rd {
  color: #e93d3d;
}

.tit-vo {
  color: #7441db;
}

.tit-gr {
  color: #378835;
}

.tit-acc {
  font-weight: 700;
  color: #005098;
}

.tit-str {
  font-weight: 500;
  color: #d71d1d;
}

.tit-gy {
  color: #666666;
}

/* SIZE */
.wfull {
  width: 100% !important;
}
.wfull select {
  width: 100%;
}

.wp50 {
  width: 50%;
}

.w30 {
  width: 30px !important;
}

.w50 {
  width: 50px !important;
}

.w60 {
  width: 60px !important;
}

.w80 {
  width: 80px !important;
}

.w90 {
  width: 90px !important;
}

.w95 {
  width: 95px !important;
}

.w100 {
  width: 100px !important;
}

.w150 {
  width: 150px !important;
}

.w200 {
  width: 200px !important;
}

.w300 {
  width: 300px !important;
}

.w400 {
  width: 400px !important;
}

.w500 {
  width: 500px !important;
}

.w600 {
  width: 600px !important;
}

.w700 {
  width: 700px !important;
}

.w800 {
  width: 800px !important;
}

.w900 {
  width: 900px !important;
}

.w1000 {
  width: 1000px !important;
}

.hfull {
  height: 100% !important;
}

.h50 {
  height: 50px !important;
}

.h70 {
  height: 70px !important;
}

.h80 {
  height: 80px !important;
}

.h100 {
  height: 100px !important;
}

.h150 {
  height: 150px !important;
}

.h200 {
  height: 200px !important;
}

.h250 {
  height: 250px !important;
}

.h300 {
  height: 300px !important;
}

.h400 {
  height: 400px !important;
}

.h500 {
  height: 500px !important;
}

.h600 {
  height: 600px !important;
}

.h700 {
  height: 700px !important;
}

/* MARGIN & PADDING */
.mt0 {
  margin-top: 0 !important;
}

.mt5 {
  margin-top: 5px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mt60 {
  margin-top: 60px !important;
}

.mt150 {
  margin-top: 150px !important;
}

.mb5 {
  margin-bottom: 5px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.mb80 {
  margin-bottom: 80px !important;
}

.mr5 {
  margin-right: 5px !important;
}

.mr10 {
  margin-right: 10px !important;
}

.mr15 {
  margin-right: 15px !important;
}

.mr20 {
  margin-right: 20px !important;
}

.mr30 {
  margin-right: 30px !important;
}

.ml5 {
  margin-left: 5px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.ml15 {
  margin-left: 15px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.ml25 {
  margin-left: 25px !important;
}

.pd0 {
  padding: 0 !important;
}

.pt5 {
  padding-top: 5px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

/********************************************************************************************************************************************************************************************************************************************
	컴포넌트 스타일
********************************************************************************************************************************************************************************************************************************************/
/* select */
.select-box {
  height: 35px;
}
.select-box select {
  width: 100%;
  height: 100%;
  padding: 0 25px 1px 8px;
  line-height: 28px;
  background-image: url("/assets/images/common/icon-select-arrow-down.png");
  background-position: calc(100% - 10px) 50%;
  background-repeat: no-repeat;
  background-size: 10px;
}
.select-box select:focus {
  outline: 2px solid #222;
}
.select-box select {
  cursor: pointer;
  outline: none;
  -webkit-appearance: none; /* for chrome*/
  -moz-appearance: none; /* for firefox*/
  appearance: none;
}
.select-box select::-ms-expand {
  display: none; /* for IE10, 11*/
}

/* search */
.search-box {
  display: flex;
  align-items: center;
  width: 100%;
  height: 35px;
  border: 1px solid #d7d7d7;
  border-radius: 4px;
  background-color: #fff;
}
.search-box:focus-within {
  outline: 2px solid #222;
}
.search-box input[type=search] {
  width: calc(100% - 40px);
  height: 100%;
  line-height: 28px;
  border: none;
  vertical-align: top;
  background-color: transparent;
  outline: none;
}
.search-box .i-btn {
  width: 32px;
  height: 32px;
  background-image: url("/assets/images/common/icon-search.png");
}
.search-box.integrated {
  width: 700px;
  height: 52px;
  margin: 0 auto;
  padding: 0 20px;
  border-radius: 1000px;
  border: 2px solid #0390d5;
}
.search-box.integrated input[type=search] {
  flex: auto;
}
.search-box.integrated .i-btn {
  background-image: url("/assets/images/common/icon-search_02.png");
}
.search-box.integrated .i-btn:focus {
  outline: auto;
}

/* checkbox & radio */
.radios, .checkboxes {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}

input[type=radio] {
  overflow: hidden;
  position: absolute;
  clip: rect(0 0 0 0);
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}
input[type=radio] + label {
  position: relative;
  padding: 0 6px 0 25px;
  white-space: nowrap;
  user-select: none;
  vertical-align: middle;
  color: #222;
}
input[type=radio] + label:before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  width: 16px;
  height: 16px;
  border: 1px solid #d7d7d7;
  border-radius: 2px;
  background-color: #fff;
  text-align: center;
  transition: transform 200ms ease-out;
}
input[type=radio] + label:after {
  content: "";
  position: absolute;
  transform: scale(0);
  transition: transform 200ms ease-out;
}

input[type=radio] + label:before, input[type=radio] + label:after {
  border-radius: 50%;
  background-color: #fff;
}
input[type=radio] + label:after {
  left: 4px;
  top: 7px;
  width: 10px;
  height: 10px;
}
input[type=radio]:checked + label:before {
  animation: border 300ms ease-in;
}
input[type=radio]:checked + label:after {
  background: #005098;
  transform: scale(1);
}
input[type=radio]:focus + label:before {
  outline: 2px solid #222;
  outline-offset: 1px;
}

input[type=checkbox] {
  overflow: hidden;
  position: absolute;
  clip: rect(0 0 0 0);
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}
input[type=checkbox] + label {
  position: relative;
  padding: 1px 6px 0 25px;
  white-space: nowrap;
  user-select: none;
  color: #222;
  vertical-align: middle;
}
input[type=checkbox] + label:focus {
  outline: 2px solid #222;
}
input[type=checkbox] + label:before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  width: 16px;
  height: 16px;
  border: 1px solid #d7d7d7;
  border-radius: 2px;
  background-color: #fff;
  text-align: center;
  transition: transform 200ms ease-out;
}
input[type=checkbox] + label:before:focus {
  outline: 2px solid #222;
}
input[type=checkbox] + label:after {
  content: "";
  position: absolute;
  transform: scale(0);
  transition: transform 200ms ease-out;
}
input[type=checkbox]:focus + label:before {
  outline: 2px solid #222;
  outline-offset: 1px;
}

input[type=checkbox] + label:after {
  content: "";
  display: block;
  position: absolute;
  left: 6px;
  top: 5px;
  width: 4px;
  height: 7px;
  opacity: 0;
  border-bottom: 2px solid #005098;
  border-right: 2px solid #005098;
  transform: rotate(45deg);
}
input[type=checkbox]:checked + label:before {
  content: "";
}
input[type=checkbox]:checked + label:after {
  content: "";
  opacity: 1;
}

input[type=text]:disabled {
  background-color: #f3f3f3;
}

input[type=file] {
  position: absolute;
  width: 1px !important;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* 첨부파일 */
.filebox {
  position: relative;
}
.filebox:focus-within {
  outline: 2px solid #222;
  border-radius: 4px;
}
.filebox .upload-name {
  width: calc(100% - 18px);
  height: 24px;
  border-radius: 4px;
  border: 1px solid #d7d7d7;
  font-size: 15px;
  color: #222;
  background-color: #fff;
  padding: 5px 8px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.filebox input[type=file] {
  position: absolute;
  width: 1px !important;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.filebox label {
  width: 28px;
  height: 28px !important;
  border-radius: 2px;
  font-size: 0;
}
.filebox label.i-search_01 {
  position: absolute;
  right: 10px;
  top: calc(50% - 14px);
  background: #fff url("/assets/images/common/icon-search.png") 50% 50% no-repeat;
}

/* 첨부파일 2 */
.uploadbox {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 0 0 0 7px;
}
.uploadbox .file-nm {
  font-size: 14px;
  text-align: left;
  color: #555;
}
.uploadbox .btn-fileselect {
  flex: none;
}

/* 달력 기본 input */
.date-box, .birth-date-box {
  display: inline-flex;
  align-items: center;
  width: 140px;
  height: 35px;
  padding: 0 10px;
  border: 1px solid #d7d7d7;
  border-radius: 4px;
  cursor: pointer;
  background-color: #fff;
}
.date-box:focus-within, .birth-date-box:focus-within {
  outline: 2px solid #222;
}
.date-box + em, .birth-date-box + em {
  margin: 0 5px;
}
.date-box input[type=text], .birth-date-box input[type=text] {
  width: calc(100% - 23px);
  height: 33px;
  padding: 4px 0;
  border: none;
  outline: 0;
  background-color: transparent;
  cursor: pointer;
}

/* Datepicker */
.ui-datepicker {
  display: none;
  width: 260px;
  height: auto;
  min-height: 200px;
  margin: 2px 0 0 -9px;
  padding: 15px 10px 10px 10px;
  border: 1px solid #d7d7d7;
  background-color: #fff;
}
.ui-datepicker .ui-datepicker-header {
  position: relative;
  padding: 0.2em 0;
}
.ui-datepicker .ui-datepicker-prev {
  position: absolute;
  top: 4px;
  left: 5%;
  width: 20px;
  height: 20px;
}
.ui-datepicker .ui-datepicker-next {
  position: absolute;
  top: 4px;
  right: 5%;
  width: 20px;
  height: 20px;
}
.ui-datepicker .ui-datepicker-prev:focus, .ui-datepicker .ui-datepicker-next:focus {
  outline: 2px solid #222;
}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
  display: block;
  position: absolute;
  top: 0;
  cursor: pointer;
}
.ui-datepicker .ui-datepicker-prev span:focus-within, .ui-datepicker .ui-datepicker-next span:focus-within {
  outline: 2px solid #222;
}
.ui-datepicker .ui-datepicker-title {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  text-align: center;
  color: #333;
}
.ui-datepicker .ui-datepicker-title :focus-within {
  outline: 2px solid #222;
}
.ui-datepicker select {
  height: 30px;
  margin: -3px 5px;
  padding: 0px 10px;
}
.ui-datepicker select .ui-datepicker-year {
  width: 100%;
}
.ui-datepicker select .ui-datepicker-month {
  width: 50%;
}
.ui-datepicker table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0 auto;
  font-size: 12.5px;
}
.ui-datepicker table th {
  padding: 7px 0 6px;
  text-align: center;
  border: 0;
  font-size: 16px;
  font-weight: 700;
}
.ui-datepicker table th:first-child span {
  color: #ff5d5d;
}
.ui-datepicker table td {
  padding: 2px 0;
}
.ui-datepicker table td.ui-datepicker-week-end a {
  color: #ff5d5d;
}
.ui-datepicker table td a {
  display: block;
  width: 25px;
  height: 25px;
  margin: 0px 3px;
  border-radius: 50%;
  text-align: center;
  line-height: 25px;
  background-color: #fff;
}
.ui-datepicker table td a:hover {
  background-color: rgba(3, 144, 213, 0.15);
  text-decoration: none;
}
.ui-datepicker table td a:focus {
  outline: 2px solid #222;
}
.ui-datepicker table td a.ui-datepicker-today a {
  background-color: rgba(3, 144, 213, 0.15);
  color: #fff;
}
.ui-datepicker table td a.ui-state-active {
  background-color: #0390d5;
  color: #fff;
}
.ui-datepicker table td span {
  display: block;
  width: 25px;
  height: 25px;
  margin: 0px 3px;
  border-radius: 50%;
  text-align: center;
  line-height: 25px;
  background-color: #fff;
}
.ui-datepicker table tbody tr:first-child td {
  padding-top: 7px;
}
.ui-datepicker .ui-icon {
  display: block;
  width: 22px;
  height: 22px;
  text-indent: -99999px;
  overflow: hidden;
}
.ui-datepicker .ui-icon-circle-triangle-w {
  background: url("/assets/images/common/btn_prev_01.png") 45% 49% no-repeat;
}
.ui-datepicker .ui-icon-circle-triangle-e {
  background: url("/assets/images/common/btn_next_01.png") 55% 49% no-repeat;
}
.ui-datepicker .ui-datepicker-row-break {
  clear: both;
  width: 100%;
  font-size: 0;
}
.ui-datepicker .ui-widget-header {
  height: 28px;
  margin: 0;
  border-bottom: 0;
  color: #333;
  font-size: 12px;
}
.ui-datepicker .ui-widget-header .ui-datepicker-title {
  font-size: 16px;
  font-weight: 700;
}
.ui-datepicker .ui-widget-header .ui-datepicker-title span {
  font-size: 16px;
  font-weight: 700;
}

/*–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	** 컴포넌트 컨텐츠류
/*––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* 필터 내부에 filter-item은 속성넣지 마세요!
	. filter-item 내부에 input-group 단독 1개이상 사용 x
		인풋그룹 2개 사용시 form그룹에 묶어주세요

	팝업에서 필터 사용시 filter-item 빼주세요.
*/
/*
 fitler-item + filter-item  mt10
*/
/* 페이지 필터 레이아웃 내부에 .filter-item이 없을 시 style 사라짐*/
.filter:has(.filter-item) {
  padding: 15px;
  border-radius: 10px;
  background-color: #f4f8fa;
}

.filter + div {
  margin-top: 35px;
}
.filter .label {
  min-width: 90px;
  font-weight: 500;
  white-space: nowrap;
}
.filter .filter-item + .filter-item {
  margin-top: 10px;
}
.filter .filter-item .filter-group {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  gap: 8px;
}
.filter .filter-item .filter-group .select-box {
  flex: none;
}
.filter .filter-item .filter-group .box-group {
  display: flex;
  align-items: center;
  gap: 5px;
}
.filter .filter-item .form-group {
  width: 100%;
  gap: 8px;
}
.filter .form-group {
  display: flex;
  align-items: center;
}
.filter .form-group.between {
  justify-content: space-between;
}
.filter .input-group {
  display: flex;
  align-items: center;
  gap: 8px;
}
.filter .input-group em {
  padding: 0 8px;
}
.filter .input-group .search-box + .i-btn {
  flex: 1 0 auto;
  margin-left: 8px;
}

/* 단순 묵음용으로 묶어줘야하는데 flex가 필요할때 사용해주세요! (기본값 수평 sta / 수직 정렬 center */
.flex-box {
  display: flex;
  align-items: center;
}
.flex-box.end {
  justify-content: flex-end;
}
.flex-box.center {
  justify-content: center;
}
.flex-box.between {
  justify-content: space-between;
}

/* input group 내 요소 */
.radio-list {
  display: flex;
  align-items: center;
  gap: 15px;
}
.radio-list.center {
  justify-content: center;
}

.check-cnt, .radio-cnt, .date-cnt {
  display: flex;
  align-items: center;
}
.check-cnt.center, .radio-cnt.center, .date-cnt.center {
  justify-content: center;
}

/*리스트탑 (테이블,리스트정보류 위에 들어가는 클래스 */
.listtop, .listbtm {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.listtop:has(.s-tit) .s-tit, .listbtm:has(.s-tit) .s-tit {
  margin: 0;
}
.listtop.end, .listbtm.end {
  justify-content: end;
}
.listtop + div, .listtop + .table, .listbtm + div, .listbtm + .table {
  margin-top: 15px;
}
.listtop .list-item, .listbtm .list-item {
  display: flex;
  align-items: center;
}
.listtop .list-item .label, .listbtm .list-item .label {
  margin-right: 8px;
}
.listtop .list-item .select-box + .btn-reset, .listbtm .list-item .select-box + .btn-reset {
  margin-left: 8px;
}

/*테이블 (테이블 하단에 들어가는 리스트바텀)*/
.table-wrap + .list-style-box {
  margin-top: 30px;
}
.table-wrap + .listbtm {
  margin-top: 10px;
}

/* 탭 스타일 */
.tabArea > ul {
  display: flex;
  position: relative;
  margin-bottom: 50px;
  border-radius: 10px;
  overflow: hidden;
}
.tabArea > ul > li {
  flex: 1;
  border-radius: inherit;
}
.tabArea > ul > li a {
  width: 100%;
  height: 100%;
  padding: 10px 20px;
  font-size: 16px;
  text-align: center;
}
.tabArea > ul > li.on a {
  border: 1px solid #005098;
  border-radius: inherit;
  font-weight: 500;
  color: #005098;
  background-color: #fff;
  box-shadow: 0px 0px 9.9px 0.1px rgba(0, 0, 0, 0.15);
}
.tabArea .tabs {
  background-color: #efefef;
}
.tabArea .tabs li {
  height: 42px;
}
.tabArea .tabs li a {
  display: block;
}
.tabArea .subtabs {
  gap: 20px;
}
.tabArea .subtabs li {
  height: 74px;
}
.tabArea .subtabs li a {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 25px;
  border-radius: 10px;
  border: 1px solid #d7d7d7;
}
.tabArea .subtabs li a i {
  width: 40px;
  height: 45px;
}
.tabArea .subtabs li a i.i-offline_report {
  background-image: url("/assets/images/sub/icon-offline_report.png");
}
.tabArea .subtabs li a i.i-member_report {
  background-image: url("/assets/images/sub/icon-member_report.png");
}
.tabArea .subtabs li a i.i-nonmember_report {
  background-image: url("/assets/images/sub/icon-nonmember_report.png");
}
.tabArea .subtabs li a i.i-manager {
  background-image: url("/assets/images/sub/icon-manager.png");
}
.tabArea .subtabs.single {
  justify-content: center;
}
.tabArea .subtabs.single li {
  flex: none;
  width: 50%;
}

/*탭 스타일 추가2*/
.tabArea02 > ul {
  display: flex;
  gap: 10px;
  flex-flow: wrap;
  margin-bottom: 50px;
}
.tabArea02 > ul > li {
  border-radius: inherit;
  height: 40px;
}
.tabArea02 > ul > li a {
  width: 100%;
  height: 100%;
  display: inline-block;
  padding: 8px 18px;
  font-size: 16px;
  text-align: center;
  border-radius: 20px;
  background-color: #efefef;
  color: #666666;
}
.tabArea02 > ul > li.on a {
  border: 1px solid #005098;
  font-weight: 500;
  letter-spacing: -0.5px;
  color: #005098;
  background-color: #fff;
  box-shadow: 0px 0px 9.9px 0.1px rgba(0, 0, 0, 0.15);
}

.tabcontents, .subtabcontents, .poptabcontents {
  display: none;
}
.tabcontents .contents + .contents, .subtabcontents .contents + .contents, .poptabcontents .contents + .contents {
  margin-top: 50px;
}
.tabcontents.on, .subtabcontents.on, .poptabcontents.on {
  display: block;
}

/* 페이지네이션 스타일 */
.paginate-wrap {
  position: relative;
  margin-top: 35px;
}

.paginate {
  text-align: center;
}
.paginate a, .paginate strong {
  display: inline-block;
  padding: 0 8px;
  margin: 0 8px;
  min-width: 22px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  vertical-align: middle;
}
.paginate strong {
  color: #005098;
  border-bottom: 2px solid #005098;
}
.paginate a {
  color: #4e4e4e;
}
.paginate a:hover {
  color: #222;
}
.paginate a.direction {
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
.paginate a.direction.first {
  background-image: url("/assets/images/common/btn_first_01.png");
}
.paginate a.direction.prev {
  background-image: url("/assets/images/common/btn_prev_01.png");
}
.paginate a.direction.next {
  background-image: url("/assets/images/common/btn_next_01.png");
}
.paginate a.direction.last {
  background-image: url("/assets/images/common/btn_last_01.png");
}
.paginate a.direction.disabled {
  display: none;
}

/*툴팁 tool-tip 스타일*/
.i-tool-tip {
  position: relative;
  z-index: 1;
  width: 16px;
  height: 16px;
  background-image: url("/assets/images/sub/guide_02.png");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-color: transparent;
  border: 0;
  text-align: left;
  vertical-align: middle;
}

.i-tool-tip::before {
  content: attr(data-tooltip); /*툴팁 표시 내용은 버튼의 "data-tooltip" 속성값으로 */
  display: flex;
  justify-content: center;
  align-items: center;
  visibility: hidden; /* 기본 상태는 안보이게 */
  position: absolute;
  left: -50%;
  bottom: 165%;
  transform: translateX(-50%);
  z-index: 999;
  min-width: 250px;
  max-width: 400px;
  padding: 7px;
  border-radius: 5px;
  font-size: 13px;
  letter-spacing: -0.5px;
  white-space: pre-wrap;
  color: #fff;
  background-color: #005098;
}

.i-tool-tip::after {
  content: "";
  display: inline-block;
  position: absolute;
  left: 50%;
  bottom: 97%;
  z-index: 1200;
  transform: translate(-50%, 0);
  border-width: 6px;
  border-style: solid;
  border-color: transparent;
  border-top-color: #005098;
  width: 0;
  height: 0;
  visibility: hidden;
}

.i-tool-tip:hover:before {
  visibility: visible;
}

.i-tool-tip:hover:after {
  visibility: visible;
}

/*가이드 단일*/
.t-guide {
  padding-left: 22px;
  background-image: url("/assets/images/sub/guide_01.png");
  background-repeat: no-repeat;
  color: #666666;
  font-size: 14px;
  letter-spacing: -0.5px;
}
.t-guide.type01 {
  padding-top: 5px;
  background-image: url("/assets/images/sub/guide_01.png");
  background-position: 0 7px;
}
.t-guide.type02 {
  padding: 4px 0 4px 22px;
  background-image: url("/assets/images/sub/guide_02.png");
  background-position-y: 6px;
}
.t-guide.type03 {
  padding: 2px 0 2px 22px;
  background-image: url("/assets/images/sub/guide_03.png");
  background-position-y: 4px;
}
.t-guide.type04 {
  background-image: url("/assets/images/sub/guide_04.png");
  background-position-y: 2px;
}
.t-guide strong {
  color: #ff5d5d;
}

/*가이드 멀티*/
.t-guide-multi {
  margin: 5px;
}
.t-guide-multi li {
  display: flex;
  gap: 4px;
  font-size: 12.5px;
  letter-spacing: -0.5px;
}
.t-guide-multi li + li {
  margin-top: 5px;
}
.t-guide-multi li::before {
  display: inline-block;
  content: "";
  flex: none;
  margin-top: 2px;
  width: 16px;
  height: 16px;
  background: url("/assets/images/sub/guide_05.png") 0 0 no-repeat;
}

/* tree 레이아웃 스타일*/
.tree-box {
  background: #fff;
}
.tree-box .tree {
  width: 100%;
  height: 400px;
  padding: 5px 10px;
  overflow: auto;
}
.tree-box .tree > li:last-child::after {
  content: "";
  position: absolute;
  left: -2px;
  bottom: 0;
  width: 2px;
  height: 15px;
  background-color: #fff;
}
.tree-box .tree li {
  position: relative;
  padding: 2px 0 2px 25px;
  border-left: 1px dashed #bcbec0;
}
.tree-box .tree li:before {
  content: "";
  position: absolute;
  top: 12px;
  left: 0;
  width: 25px;
  height: 1px;
  border-bottom: 1px dashed #bcbec0;
}
.tree-box .tree li > .tree-toggle {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 1px solid #ccc;
  outline: 2px solid #fff;
  border-radius: 4px;
  cursor: pointer;
  z-index: 100;
  position: absolute;
  left: -8px;
  top: 2px;
  background: #fff url(/assets/images/sub/icon-plus.png) center no-repeat;
}
.tree-box .tree li > .tree-toggle:focus {
  outline: 2px solid #222;
}
.tree-box .tree li.expanded > .tree-toggle {
  background-image: url(/assets/images/sub/icon-minus.png);
}
.tree-box .tree li > .tree-label {
  padding: 1px 2px 2px 3px;
}
.tree-box .tree li > .tree-label:hover {
  border-radius: 4px;
  background: #f3f8ff;
}
.tree-box .tree li > .tree-label:focus {
  border-radius: 4px;
  outline: 2px solid #222;
}
.tree-box .tree li.has-child > ul {
  display: none;
}
.tree-box .tree li.has-child.expanded > ul {
  display: block;
  margin-top: 3px;
}
.tree-box .tree li .tree-label.active {
  border-radius: 4px;
  font-weight: 600;
  color: #005098;
  background: rgba(0, 80, 152, 0.1);
}

/********************************************************************************************************************************************************************************************************************************************
	테이블 스타일
********************************************************************************************************************************************************************************************************************************************/
/* 기본 테이블 ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.table {
  width: 100%;
  vertical-align: top;
  border-top: 2px solid #333;
}
.table .table {
  border-top: 1px solid #d7d7d7;
}
.table th, .table td {
  padding: 10px 12px;
  font-weight: normal;
  text-align: left;
  vertical-align: middle;
}
.table th {
  background-color: #f6f6f6;
}
.table td {
  position: relative;
  border-right: 1px solid #e0e0e0;
}
.table td:last-child {
  border-right: 0;
}
.table td.no-result p {
  display: flex;
  flex-direction: column;
  color: #666666;
}
.table td.no-result p::before {
  content: "";
  display: block;
  width: 100%;
  height: 64px;
  margin: 0 auto 13px;
  background: url("/assets/images/sub/table-no-result.png") 51% 50% no-repeat;
}
.table + textarea {
  margin-top: 10px;
}
.table svg {
  vertical-align: middle;
}
.table thead tr:first-child th:first-child {
  border-left: 0;
}
.table thead th {
  text-align: center;
  border-left: 1px solid #ddd;
  font-weight: 500;
}
.table tbody th {
  text-align: center;
  font-weight: 500;
}
.table tbody th:last-child {
  border-left: 1px solid #ddd;
}
.table tbody td {
  border-bottom: 1px solid #ddd;
  vertical-align: top;
}
.table .i-btn {
  width: 23px;
  height: 23px;
}
.table .i-btn.btn-detailview {
  background-image: url("/assets/images/sub/icon-detailview.png");
}
.table .i-btn.btn-delete {
  background-image: url("/assets/images/sub/icon-delete_03.png");
}
.table .i-btn.btn-remove {
  background-image: url("/assets/images/sub/icon-remove.png");
}
.table .i-btn.btn-application {
  background-image: url("/assets/images/sub/icon-application.png");
}
.table .i-btn.btn-fileselect {
  background-image: url("/assets/images/sub/icon-fileselect.png");
}
.table .i-btn-line.btn-add {
  background-image: url("/assets/images/sub/icon-plus_02.png");
}
.table .i-btn-line.btn-remove {
  background-image: url("/assets/images/sub/icon-miuns_02.png");
}

/* 폼 타입 테이블 --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.table.form {
  border-top: 1px solid #808080;
}
.table.form + .form {
  margin-top: 10px;
}
.table.form + .list {
  margin-top: 50px;
}
.table.form th {
  font-weight: 500;
  text-align: center;
  border-bottom: 1px solid #ddd;
}
.table.form td {
  vertical-align: top;
  background-color: rgba(255, 255, 255, 0.01);
}
.table.form thead tr.line th {
  border-bottom: 1px solid #ddd;
}
.table.form thead tr.line th:last-child {
  border-bottom: 0;
}
.table.form thead th {
  padding: 10px 15px;
  font-size: 16px;
}
.table.form tbody tr td:first-child {
  border-left: 0;
}
.table.form tbody tr th {
  border-right: 1px solid #ddd;
}
.table.form tbody tr + tr th {
  border-top: 1px solid #ddd;
}
.table.form tbody td {
  padding: 8px 12px;
  border-bottom: 1px solid #ddd;
  border-left: 1px solid #ddd;
  vertical-align: middle;
}
.table.form tbody td.border-Lnone {
  border-left: 0;
}

/* 리스트 타입 테이블 --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.table.list {
  table-layout: fixed;
}
.table.list thead th {
  border-bottom: 1px solid #ddd;
}
.table.list thead th.th-filter {
  position: relative;
}
.table.list thead th.th-filter .i-btn {
  position: absolute;
  right: 10px;
}
.table.list thead th.th-filter .filter-drop {
  position: absolute;
  top: 30px;
  right: -20px;
  min-width: 80px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
  border-radius: 4px;
  border: 1px solid #d7d7d7;
  background-color: #fff;
}
.table.list thead th.th-filter .filter-drop li a {
  display: block;
  padding: 3px 10px;
  font-size: 14px;
}
.table.list thead th.th-filter .filter-drop li a:hover {
  background-color: #2c53b2;
}
.table.list thead th .sort {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  font-size: 13px;
}
.table.list thead th .sort.down::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 7px solid #333;
  margin-left: 7px;
}
.table.list thead th .sort.up::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 7px solid #333;
  margin-left: 5px;
}
.table.list tbody td {
  padding: 10px 6px;
  vertical-align: middle;
  border-bottom: 0;
}
.table.list tbody tr {
  border-bottom: 1px solid #ddd;
  cursor: pointer;
}
.table.list tbody tr:hover td {
  background-color: rgba(239, 246, 255, 0.3);
}
.table.list tbody tr.active td {
  background-color: #f3f8ff;
  color: #005098;
}
.table.list tbody tr.sum {
  background-color: #f0f6ff;
}
.table.list th, .table.list td {
  text-align: center;
}
.table.list th {
  padding: 7px;
}
.table.list tr.odd-row td {
  background-color: rgba(239, 246, 255, 0.3);
}
.table.list td.last {
  border-right: none;
}

.table.listform {
  table-layout: fixed;
}
.table.listform thead th {
  border-bottom: 1px solid #ddd;
}
.table.listform tbody td {
  padding: 10px 6px;
  vertical-align: middle;
  border-bottom: 0;
}
.table.listform tbody tr {
  border-bottom: 1px solid #ddd;
}
.table.listform tbody tr.active td {
  background-color: #f3f8ff;
  color: #005098;
}
.table.listform tbody tr.sum {
  background-color: #f0f6ff;
}
.table.listform th, .table.listform td {
  text-align: center;
}
.table.listform th {
  padding: 7px;
}

/* 테이블 내 컴포넌트 요소  --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.table + .table-wrap {
  margin-top: 20px;
}
.table th:has(> .i-tool-tip) .i-tool-tip {
  margin-left: 5px;
}
.table .btn-table-wrap {
  display: flex;
  align-items: center;
}
.table .btn-table-wrap + .excld-site-group {
  margin-top: 10px;
}
.table .btn-table-wrap.end {
  justify-content: end;
}
.table .flex-tb-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.table .flex-tb-between + .flex-tb-between {
  margin-top: 5px;
}
.table .border-Lnone {
  border-left: 0 !important;
}
.table .border-Rnone {
  border-right: 0 !important;
}
.table .border-Bnone {
  border-bottom: 0 !important;
}
.table .border-Tnone {
  border-top: 0 !important;
}
.table .image-box {
  margin: 5px 0 0 0;
  padding: 15px 10px;
  line-height: 1.2;
  border: 1px solid #d7d7d7;
  border-radius: 4px;
  text-align: center;
}
.table .image-box small {
  font-size: 13px;
}
.table .file-txt {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  width: 100%;
}
.table .file-txt p {
  margin-right: 7px;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.table .file-txt i {
  flex: none;
}
.table .flex-line {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 5px;
}
.table .flex-line.between {
  justify-content: space-between;
}
.table .flex-line.between + .flex-line {
  margin-top: 6px;
}
.table .flex-line.between .i-btn-line {
  flex: none;
}
.table .flex-line .check-cnt label {
  min-width: 80px;
}
.table .flex-line .flex-auto {
  flex: auto;
}
.table .flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.table .flex-between:has(> .attached-file) {
  align-items: stretch;
  gap: 10px;
}
.table .flex-between:has(> .attached-file) button {
  flex: none;
}
.table .flex-between .i-btn {
  flex: none;
}
.table .input-group {
  display: grid;
  align-items: center;
  gap: 6px;
}
.table .input-group.addr {
  grid-template-columns: 1fr auto 0.5fr;
}
.table .input-group.email {
  grid-template-columns: 1fr auto 1fr auto;
}
.table .input-group span {
  font-size: 14px;
}
.table .date-cnt span {
  width: 100%;
}
.table .table + .caption {
  margin-top: 10px;
}
.table .caption::before {
  display: inline-block;
  content: "*";
  margin: 0 7px 0 0px;
  color: #005098;
  vertical-align: top;
}
.star::before {
  display: inline-block;
  content: "*";
  margin: 0 2px 0 -10px;
  color: #ff5d5d;
  vertical-align: top;
}

.table .num {
  text-align: right;
  font-weight: 500;
  color: #005098;
}
.table .new::after {
  display: inline-block;
  content: "N";
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 13px;
  height: 15px;
  color: #fff;
  background-color: #f14747;
  vertical-align: middle;
  border-radius: 3px;
  font-size: 10px;
}
.table .btn-sort {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.table .btn-sort::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  margin-left: 10px;
}
.table .btn-sort.down::after {
  border-top: 7px solid #333;
}
.table .btn-sort.up::after {
  border-bottom: 7px solid #333;
}

.table-scroll-wrap {
  position: relative;
  padding-top: 32px;
  height: 100%;
  border-top: 2px solid #333;
}
.table-scroll-wrap .table-scroll {
  height: 100%;
  overflow-y: auto;
}
.table-scroll-wrap .table-scroll .fixed-header-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 34px;
  background-color: #f6f6f6;
  border-bottom: 1px solid #ddd;
}
.table-scroll-wrap .table-scroll .table.list thead th {
  height: 0;
  border: none;
  padding: 0;
}
.table-scroll-wrap .table-scroll .table.list thead th:first-child {
  background-color: #f6f6f6;
}
.table-scroll-wrap .table-scroll .table.list thead th:first-child .fixed-th::after {
  background-color: transparent;
}
.table-scroll-wrap .table-scroll .fixed-th {
  position: absolute;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 33px;
}
.table-scroll-wrap .table-scroll .fixed-th::after {
  content: "";
  position: absolute;
  top: 0;
  left: -0.5px;
  width: 1px;
  height: 100%;
  background-color: #e2e2e2;
}

.pop-filter {
  display: inline-block;
  position: relative;
  height: 20px;
  vertical-align: middle;
}
.pop-filter .i-btn.btn-filter {
  width: 20px;
  height: 20px;
  border-radius: 4px;
  border: 1px solid #d7d7d7;
  background-color: #fff;
}
.pop-filter .i-btn.btn-filter:hover {
  border-color: #bababa;
}
.pop-filter .i-btn.btn-filter {
  margin-left: 6px;
  background-image: url("/assets/images/sub/icon-select-arrow.png");
}
.pop-filter .i-btn.btn-cancel {
  width: 24px;
  height: 24px;
  border-radius: 4px;
  border: 1px solid #d7d7d7;
  background-color: #fff;
}
.pop-filter .i-btn.btn-cancel:hover {
  border-color: #bababa;
}
.pop-filter .i-btn.btn-cancel {
  background-image: url("/assets/images/sub/icon-cancel.png");
}
.pop-filter .i-btn.btn-apply {
  width: 24px;
  height: 24px;
  border-radius: 4px;
  border: 1px solid #d7d7d7;
  background-color: #fff;
}
.pop-filter .i-btn.btn-apply:hover {
  border-color: #bababa;
}
.pop-filter .i-btn.btn-apply {
  border-color: #005098;
  background-image: url("/assets/images/sub/icon-apply.png");
}
.pop-filter .i-btn.btn-apply:hover {
  border-color: #0375cd;
}
.pop-filter .i-btn.btn-filter-reset {
  background-image: url("/assets/images/sub/icon-filter-reset.png");
}
.pop-filter .i-btn.active.btn-filter {
  background-image: url("/assets/images/sub/icon-filter.png");
}
.pop-filter .pop-filter-box {
  display: none;
  position: absolute;
  right: -11px;
  top: 25px;
  z-index: 30;
  min-width: 100px;
  border-radius: 8px;
  background-color: #fff;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.25);
}
.pop-filter .pop-filter-box .filter-inner {
  min-width: 100px;
}
.pop-filter .pop-filter-box .filter-inner ul {
  overflow-y: auto;
  max-height: 150px;
  padding: 10px;
}
.pop-filter .pop-filter-box .filter-inner li {
  text-align: left;
  white-space: nowrap;
}
.pop-filter .pop-filter-box .filter-inner li + li {
  margin-top: 3px;
}
.pop-filter .pop-filter-box .filter-inner li input[type=checkbox] + label {
  padding: 1px 6px 0 23px;
}
.pop-filter .pop-filter-box .filter-inner li input[type=checkbox] + label::before {
  top: 3px;
}
.pop-filter .pop-filter-box .filter-inner li input[type=checkbox] + label::after {
  top: 5px;
}
.pop-filter .pop-filter-box .filter-inner li:first-child {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 4px;
  border-bottom: #eee 1px solid;
}
.pop-filter .pop-filter-box .filter-inner li:first-child label {
  font-weight: 500;
}
.pop-filter .pop-filter-box .filter-inner .btm-sec {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 3px;
  height: 40px;
  padding: 0 10px;
  border-radius: 0 0 8px 8px;
  background-color: #f2f2f2;
}
.pop-filter .pop-filter-box .r-guide {
  width: 220px;
  background-color: #edeff0;
}

/********************************************************************************************************************************************************************************************************************************************
	기본 버튼 스타일
********************************************************************************************************************************************************************************************************************************************/
.r-btn {
  text-align: right;
}

.l-btn {
  text-align: left;
}

.c-btn {
  text-align: center;
}

.btn-group, .btn-wrap {
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 5px;
}
.btn-group + .table, .btn-wrap + .table {
  margin-top: 10px;
}
.btn-group.start, .btn-wrap.start {
  justify-content: flex-start;
}
.btn-group.between, .btn-wrap.between {
  justify-content: space-between;
}
.btn-group.center, .btn-wrap.center {
  justify-content: center;
}
.btn-group:has(.star), .btn-wrap:has(.star) {
  gap: 20px;
}
.btn-group:has(.star) .star, .btn-wrap:has(.star) .star {
  font-size: 13px;
}

.btn-wrap:has(input) {
  display: block;
  text-align: center;
}
.btn-wrap:has(input) .btn, .btn-wrap:has(input) .btn-link, .btn-wrap:has(input) .btn-link-small, .btn-wrap:has(input) .btn-full, .btn-wrap:has(input) .btn-table, .btn-wrap:has(input) .btn-large, .btn-wrap:has(input) .btn-small {
  margin-top: 20px;
}

/*기본 텍스트 버튼*/
.btn, .btn-link, .btn-link-small, .btn-full, .btn-table, .btn-large, .btn-small {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 42px;
  padding: 0 40px;
  line-height: 2;
  font-weight: 500;
  white-space: nowrap;
  word-spacing: -1px;
  background-color: #fff;
  text-transform: capitalize;
  border-radius: 4px;
  border-color: #d7d7d7;
  border-width: 1px;
  border-style: solid;
}
.btn-small {
  height: 35px;
  padding: 0 20px;
  font-size: 14px;
}
.btn-large {
  min-width: 200px;
  height: 50px;
  border-radius: 100px;
}
.btn-table {
  height: 30px;
  padding: 0 10px;
  font-size: 13px;
}
.btn-full {
  width: 100%;
}
.btn:hover, .btn-link:hover, .btn-link-small:hover, .btn-small:hover, .btn-large:hover, .btn-table:hover, .btn-full:hover {
  border-color: #a3a3a3;
}
.btn.on, .on.btn-link, .on.btn-link-small, .on.btn-small, .on.btn-large, .on.btn-table, .on.btn-full {
  border: #0B7EB7 1px solid;
  background-color: #0B7EB7;
  color: #fff;
}
.btn.on:hover, .on.btn-link:hover, .on.btn-link-small:hover, .on.btn-small:hover, .on.btn-large:hover, .on.btn-table:hover, .on.btn-full:hover {
  background-color: #096695;
  border-color: #096695;
}

/*기본 디폴트 버튼*/
button.btn:has(> i) i, button.btn-link:has(> i) i, button.btn-link-small:has(> i) i, button.btn-small:has(> i) i, button.btn-large:has(> i) i, button.btn-table:has(> i) i, button.btn-full:has(> i) i {
  margin: 0 0 0 10px;
}
button.btn:has(> i) i.i-download, button.btn-link:has(> i) i.i-download, button.btn-link-small:has(> i) i.i-download, button.btn-small:has(> i) i.i-download, button.btn-large:has(> i) i.i-download, button.btn-table:has(> i) i.i-download, button.btn-full:has(> i) i.i-download {
  background-image: url("/assets/images/common/icon-download.png");
}
button.btn:has(> i) i.i-search, button.btn-link:has(> i) i.i-search, button.btn-link-small:has(> i) i.i-search, button.btn-small:has(> i) i.i-search, button.btn-large:has(> i) i.i-search, button.btn-table:has(> i) i.i-search, button.btn-full:has(> i) i.i-search {
  background-image: url("/assets/images/common/icon-search_w.png");
}
button.btn:has(> i) i.i-share, button.btn-link:has(> i) i.i-share, button.btn-link-small:has(> i) i.i-share, button.btn-small:has(> i) i.i-share, button.btn-large:has(> i) i.i-share, button.btn-table:has(> i) i.i-share, button.btn-full:has(> i) i.i-share {
  background-image: url("/assets/images/sub/icon-share.png");
}
button.point {
  background-color: #0B7EB7;
  border-color: #0B7EB7;
  color: #fff;
}
button.point:hover {
  background-color: #096695;
  border-color: #096695;
}
button.line {
  border-color: #005098;
  color: #005098;
}
button.line:hover {
  border-color: #0375cd;
}
button.gray {
  text-align: center;
  border: 1px solid #555;
  color: #444;
}
button.gray:hover {
  border: 1px solid #5f5f5f;
}
button:has(i) {
  display: flex;
  align-items: center;
}

/* 기본 아이콘 */
i {
  display: block;
  width: 16px;
  height: 16px;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
i.i-reset {
  background-image: url("/assets/images/common/icon-reset_02.png");
}
i.i-file {
  background-image: url("/assets/images/sub/icon-file.png");
}
i.i-hwp {
  background-image: url("/assets/images/sub/icon-hwp.png");
}
i.i-pdf {
  background-image: url("/assets/images/sub/icon-pdf.png");
}
i.i-logo_sw {
  width: 20px;
  height: 20px;
  margin: 0 10px 0 0;
  background-image: url("/assets/images/sub/icon-logo_01.png");
}
i.i-check {
  width: 20px;
  height: 20px;
  margin: auto;
  background-image: url("/assets/images/sub/icon-check.png");
}
i.i-uncheck {
  width: 20px;
  height: 20px;
  margin: auto;
  background-image: url("/assets/images/sub/icon-uncheck.png");
}

/*아이콘 스타일 버튼 (순수아이콘만 들어갈시 i-btn , 박스가 들어갈시 i-btn-line 붙여주기 제너럴한 아이콘이 아닌 이상 여기다 정의 XXX*/
.i-btn, .i-btn-line {
  display: inline-block;
  font-size: 0;
  line-height: 0;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
.i-btn.btn-reset, .btn-reset.i-btn-line {
  background-image: url("/assets/images/sub/icon-reset.png");
}
.i-btn-line {
  width: 35px;
  height: 35px;
  border-radius: 4px;
  border: 1px solid #d7d7d7;
  background-color: #fff;
}
.i-btn-line:hover {
  border-color: #bababa;
}
.i-btn-line.on {
  border-color: #005098;
  background-color: #005098;
}
.i-btn-line.btn-search {
  flex: none;
  background-image: url("/assets/images/common/icon-search_w.png");
}

/*link 버튼*/
.btn-link, .btn-link-small {
  width: 100%;
  background-color: #0B7EB7;
  border-color: #0B7EB7;
  color: #fff;
}
.btn-link:hover, .btn-link-small:hover {
  background-color: #0a75ab;
  border-color: #0a75ab;
}
.btn-link-small {
  width: 50%;
}
.btn-link.line, .line.btn-link-small {
  border-color: #005098;
  background-color: #fff;
  color: #005098;
}
.btn-link.line:hover, .line.btn-link-small:hover {
  border-color: #0375cd;
}

/*on-off 토글 스위치버튼*/
.btn-onoff {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.btn-onoff:focus-within {
  outline: 2px solid #222;
  border-radius: 1000px;
}
.btn-onoff input {
  display: block;
  position: absolute;
  opacity: 0;
}
.btn-onoff input:checked ~ span {
  border: 1px solid #005098;
  background: #005098;
}
.btn-onoff input:checked ~ span:before {
  content: "On";
  right: 18px;
  color: #fff;
}
.btn-onoff input:checked ~ span:after {
  content: "";
  left: 32px;
}
.btn-onoff input ~ span:before {
  content: "Off";
  display: block;
  width: 24px;
  height: 24px;
  position: absolute;
  right: 2px;
  font-weight: 500;
  font-size: 11px;
  letter-spacing: -0.5px;
  line-height: 2;
  color: #444;
  text-transform: uppercase;
  -webkit-transition: 500ms;
  -moz-transition: 500ms;
  -ms-transition: 500ms;
  transition: 500ms;
}
.btn-onoff input ~ span:after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  top: 2px;
  left: 4px;
  background: #fff;
  border-radius: 50%;
  -webkit-transition: 400ms;
  -moz-transition: 400ms;
  -ms-transition: 400ms;
  transition: 400ms;
}
.btn-onoff span {
  position: relative;
  display: block;
  width: 54px;
  height: 24px;
  border-radius: 40px;
  background: #ccc;
  border: 1px solid #ccc;
  -webkit-transition: 400ms;
  -moz-transition: 400ms;
  -ms-transition: 400ms;
  transition: 400ms;
}
.btn-onoff:hover input ~ span:after {
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  transform: scale(0.9);
}

/*필터 sort 버튼*/
.btn-sort-group {
  display: inline-flex;
  align-items: center;
}
.btn-sort-group .btn-sort.on {
  font-weight: 700;
  color: #005098;
}
.btn-sort-group .btn-sort + .btn-sort::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 12px;
  margin: 0 12px;
  background-color: #888888;
}

/*sns 공유버튼*/
.share-list .i-btn i, .share-list .i-btn-line i {
  border-radius: 100%;
  background-size: contain;
}
.share-list .i-btn i.i-twitter, .share-list .i-btn-line i.i-twitter {
  background-image: url("/assets/images/sub/icon-logo-twitter.svg");
  border: 1px solid #d7d7d7;
}
.share-list .i-btn i.i-instagram, .share-list .i-btn-line i.i-instagram {
  background-image: url("/assets/images/sub/icon-logo-insta.svg");
}
.share-list .i-btn i.i-facebook, .share-list .i-btn-line i.i-facebook {
  background-image: url("/assets/images/sub/icon-logo-facebook.svg");
}
.share-list .i-btn i.i-kakao, .share-list .i-btn-line i.i-kakao {
  background-image: url("/assets/images/sub/icon-logo-kakao.svg");
}
.share-list .i-btn i.i-link, .share-list .i-btn-line i.i-link {
  background-image: url("/assets/images/sub/icon-logo-link.svg");
  border: 1px solid #d7d7d7;
}
.share-list .i-btn i.i-naver, .share-list .i-btn-line i.i-naver {
  background-image: url("/assets/images/sub/icon-logo-naver.svg");
  border: 1px solid #d7d7d7;
}
.share-list .i-btn i.i-yutube, .share-list .i-btn-line i.i-yutube {
  background-image: url("/assets/images/sub/icon-logo-yutube.svg");
  border: 1px solid #d7d7d7;
}

/********************************************************************************************************************************************************************************************************************************************
	기본 pc 레이아웃 스타일 (헤더/푸터영역)
********************************************************************************************************************************************************************************************************************************************/
#skipNav {
  position: relative;
  z-index: 9999;
}
#skipNav a {
  position: absolute;
  top: -200px;
  left: 0;
  width: 160px;
  line-height: 30px;
  background-color: #444;
  color: #fff;
}
#skipNav a:focus, #skipNav a:active {
  top: 0;
}

/* header 영역 레이아웃 ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  z-index: 1000;
  width: 100%;
  height: 110px;
  border-bottom: #ddd 1px solid;
  background-color: #fff;
}
#header .top-user-set {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 1300px;
  height: 56px;
}
#header .top-user-set h1 {
  width: 192px;
  height: 30px;
}
#header .top-user-set h1 a {
  display: block;
  width: 100%;
  height: 100%;
  background: url("/assets/images/common/index-logo.png") 50% 50% no-repeat;
}
#header .top-user-set .top-subnav {
  display: flex;
  align-items: center;
  gap: 15px;
}
#header .top-user-set .top-subnav span {
  font-size: 14px;
}
#header .top-user-set .top-subnav span strong {
  font-size: inherit;
}
#header .top-user-set .top-subnav a {
  font-size: 14px;
}
#header .top-user-set .top-subnav a:first-child::before {
  display: none;
}
#header .top-user-set .top-subnav a::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 11px;
  margin: 1px 12px 0 0;
  background-color: #999;
}
#header .top-user-set .top-subnav a span, #header .top-user-set .top-subnav a strong {
  font-size: inherit;
}
#header .top-user-set .top-subnav .nuli {
  display: inline-block;
  margin-left: 12px;
  padding: 3px 10px;
  background: #005098;
  border-radius: 4px;
  color: #fff;
}
#header .top-user-set .top-subnav .nuli:before {
  display: none;
}
#header .top-user-set .top-subnav .all-menu {
  width: 23px;
  height: 23px;
  background: url("/assets/images/common/header-manu-icon.png") center no-repeat;
  font-size: 0;
}
#header #gnb {
  position: relative;
  width: 100%;
  height: 54px;
}
#header #gnb .gnbWrap {
  display: grid;
  grid-template-columns: repeat(7, min-content);
  justify-content: space-between;
  justify-items: center;
  width: 1300px;
  height: 100%;
  margin: 0 auto;
  text-align: center;
  white-space: nowrap;
}
#header #gnb .gnbWrap > li.on > a {
  border-bottom: 2px solid #005098;
}
#header #gnb .gnbWrap > li > a {
  font-size: 16px;
}
#header #gnb .gnbWrap > li > a:hover {
  font-weight: 700;
  color: #005098;
}
#header #gnb .gnbWrap li {
  position: relative;
  height: 100%;
}
#header #gnb .gnbWrap li a {
  display: flex;
  align-items: center;
  height: 100%;
  font-weight: 500;
}
#header #gnb .gnbWrap li .dep2Gnb {
  display: none;
}
#header #gnb .gnbWrap li .dep2Gnb a {
  color: #666666;
}
#header #gnb .gnbWrap li.on {
  position: relative;
}
#header #gnb .gnbWrap.on::before {
  content: "";
  position: absolute;
  top: 54px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 400px;
  background: #f4f8fa url("/assets/images/main/submenu-bg.png") left 60px no-repeat;
  box-shadow: -1px 16px 22px -12px rgba(0, 0, 0, 0.344);
}
#header #gnb .gnbWrap.on li a:hover {
  color: #2c53b2;
}
#header #gnb .gnbWrap.on li .dep2Gnb {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  position: absolute;
  top: 65px;
  left: 50%;
  transform: translateX(-50%);
}

/*header mobile*/
#header-mo {
  display: none;
  height: 56px;
  width: 100vw;
  padding: 0 20px;
  position: fixed;
  top: 0;
  z-index: 999;
  background-color: #fff;
  overflow: hidden;
  transition: max-height 0.5s ease-in-out;
}
#header-mo .top-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#header-mo .top-wrap h1 {
  width: 192px;
  height: 30px;
}
#header-mo .top-wrap h1 a {
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(/assets/images/common/index-logo.png);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: initial;
}
#header-mo .top-wrap h1 a > span {
  display: block;
  position: absolute;
  z-index: -1;
  clip: rect(0 0 0 0);
  width: 0;
  height: 0;
  overflow: hidden;
}
#header-mo .top-wrap .btn-wrap-mo .menu-btn {
  width: 30px;
  height: 30px;
  background: url("/assets/images/main/header-manu-icon.png") 50% 50% no-repeat;
}
#header-mo .top-wrap .btn-wrap-mo .menu-btn.on {
  background-image: url("/assets/images/main/header-manu-icon-on.png");
}
#header-mo .left_menu {
  display: none;
  width: 100%;
  height: calc(100% - 130px);
  overflow: auto;
  border-top: 2px solid #005098;
}
#header-mo .left_menu ul li {
  width: 100%;
  cursor: pointer;
  position: relative;
}
#header-mo .left_menu ul li a {
  display: block;
  border-bottom: 1px solid #ddd;
  font-size: 17px;
  line-height: 3;
  padding: 7px 50px 7px 10px;
}
#header-mo .left_menu ul li a.select {
  color: #005696;
  font-weight: 500;
}
#header-mo .left_menu ul li ul {
  padding: 7px 10px;
}
#header-mo .left_menu ul li ul li {
  border-bottom: none;
}
#header-mo .left_menu ul li ul li:last-child {
  border-bottom: none;
}
#header-mo .left_menu ul li ul li a {
  font-size: 16px;
  padding-left: 15px;
  line-height: 1.8;
  border-bottom: none;
  color: #555;
}
#header-mo .left_menu ul li ul li a.select {
  color: #222;
}
#header-mo .left_menu ul li ul li ul {
  padding-left: 0;
  background-color: #f4f8fa;
  border-radius: 10px;
}
#header-mo .left_menu ul li ul li ul li {
  height: 40px;
  border-bottom: none;
}
#header-mo .left_menu ul li ul li ul li a {
  padding-left: 30px;
}
#header-mo .left_menu ul li ul li ul li a.select {
  color: #005696;
}
#header-mo .left_menu ul li.collapse_link {
  position: relative;
}
#header-mo .left_menu ul li.collapse_link > a:after {
  content: "";
  display: inline-block;
  width: 18px;
  height: 11px;
  background: url("/assets/images/main/2depth-manu-on.png") 50% 50% no-repeat;
  position: absolute;
  top: 26px;
  right: 10px;
}
#header-mo .left_menu ul li.collapse_link .collapse_link2 {
  position: relative;
}
#header-mo .left_menu ul li.collapse_link .collapse_link2 > a:after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 10px;
  background: url("/assets/images/main/2depth-manu-on.png") 50% 50% no-repeat;
  background-size: 12px;
  position: absolute;
  top: 18px;
  right: 1px;
}
#header-mo .left_menu .aside-nav-list {
  height: calc(100% - 60px);
}
#header-mo .user-info-mo {
  display: none;
  gap: 10px;
  height: 60px;
  background-color: #fff;
}
#header-mo .user-info-mo a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 20px 0;
  text-align: center;
}

#header-mo.active {
  height: 100%;
  transition: max-height 0.5s ease-in-out;
}
#header-mo.active .top-wrap {
  height: 56px;
}
#header-mo.active .left_menu {
  display: block;
}
#header-mo.active .user-info-mo {
  display: flex;
}

/*nav 섹션별 컬러 액티브 효과 (메인&서브 공통으로 뺐음)*/
nav {
  position: fixed;
  top: 50%;
  right: 30px;
  transform: translateY(-50%);
  z-index: 100;
  padding: 15px;
  border-radius: 15px;
  transition: all 0.5s ease;
}
nav ul {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  list-style: none;
  gap: 10px;
}
nav ul li {
  width: 100%;
}
nav ul li a {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-decoration: none;
  transition: all 0.3s ease;
  padding: 5px 0;
  position: relative;
}
nav ul li a span {
  color: #757575;
  font-size: 14px;
}
nav ul li a .nav-dot {
  width: 5px;
  height: 5px;
  border: 2px solid #9a9a9a;
  background: #9a9a9a;
  border-radius: 50%;
  margin-left: 10px;
  transition: all 0.3s ease;
}
nav ul li a .nav-text {
  transition: all 0.3s ease;
  padding: 2px 7px;
}
nav ul li a:hover .nav-dot {
  transform: scale(1);
}
nav ul li a:hover .nav-text {
  opacity: 1;
  text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
}
nav.sub ul li a[data-tooltip="섹션 1"].active .nav-dot {
  background-color: #0390d5;
  border-color: #0390d5;
  transform: scale(2);
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
nav.sub ul li a[data-tooltip="섹션 1"].active .nav-text {
  opacity: 1;
  font-weight: 700;
  color: #0390d5;
}
nav.sub ul li a[data-tooltip="섹션 2"].active .nav-dot {
  background-color: #005696;
  border-color: #005696;
  transform: scale(2);
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
nav.sub ul li a[data-tooltip="섹션 2"].active .nav-text {
  opacity: 1;
  font-weight: 700;
  color: #005696;
}
nav.sub ul li a[data-tooltip="섹션 3"].active .nav-dot {
  background-color: #2c53b2;
  border-color: #2c53b2;
  transform: scale(2);
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
nav.sub ul li a[data-tooltip="섹션 3"].active .nav-text {
  opacity: 1;
  font-weight: 700;
  color: #2c53b2;
}
nav.sub ul li a[data-tooltip="섹션 4"].active .nav-dot {
  background-color: #7942b1;
  border-color: #7942b1;
  transform: scale(2);
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
nav.sub ul li a[data-tooltip="섹션 4"].active .nav-text {
  opacity: 1;
  font-weight: 700;
  color: #7942b1;
}
nav.sub ul li a[data-tooltip="섹션 5"].active .nav-dot {
  background-color: #0391d5;
  border-color: #0391d5;
  transform: scale(2);
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
nav.sub ul li a[data-tooltip="섹션 5"].active .nav-text {
  opacity: 1;
  font-weight: 700;
  color: #0391d5;
}

/*풀스크린 메뉴*/
.submenu-full {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  background: #fff;
  width: 100%;
  height: 100vh;
  z-index: 1001;
  transition: 3s;
}
.submenu-full .menu-top {
  width: 1280px;
  height: 60px;
  margin: 0 auto;
  border-bottom: 2px solid #005696;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid #005696;
}
.submenu-full .menu-top h2 {
  width: 220px;
  height: 30px;
  font-size: 0;
  background-image: url("/assets/images/main/index_logo.png");
  background-position: left center;
  background-repeat: no-repeat;
}
.submenu-full .menu-top button {
  width: 22px;
  height: 22px;
  background: url("/assets/images/main/header-manu-icon-on.png") no-repeat;
  overflow: hidden;
  font-size: 0;
}
.submenu-full .menu_wrap {
  width: 1280px;
  height: calc(100% - 100px);
  overflow-y: scroll;
  margin: 0 auto;
}
.submenu-full .menu_wrap .menu-list-wrap {
  padding: 5px 0;
  display: flex;
  flex-direction: column;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box {
  width: 100%;
  display: flex;
  flex-direction: row;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .title-box {
  width: 300px;
  padding: 5px;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .title-box h3 {
  width: 100%;
  height: 100%;
  padding: 20px;
  font-size: 20px;
  font-weight: 500;
  border-radius: 4px;
  background-color: #f4f8fa;
  color: #005696;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav {
  width: calc(100% - 300px);
  padding: 20px 0 20px 20px;
  border-bottom: 1px solid #d7d7d7;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav ul {
  width: 100%;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav ul .tit-dot {
  width: 32%;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav ul .tit-dot.extend {
  width: 40%;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav ul .tit-dot > a {
  font-weight: 500;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav ul .tit-dot::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 10px;
  background-color: #005696;
  margin: 3px 7px;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav ul .tit-dot ul {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin: 10px 0;
  padding: 0 20px;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav ul .tit-dot ul li {
  text-indent: -10px;
  padding-left: 10px;
}
.submenu-full .menu_wrap .menu-list-wrap .menu-box .menu-nav ul .tit-dot ul li::before {
  display: inline-block;
  content: "";
  width: 6px;
  height: 2px;
  margin: 10px 7px 0 0;
  vertical-align: top;
  background-color: #777;
}

.submenu-full.on {
  display: block;
  opacity: 1;
  transition: 5s;
}

/* footer 영역 레이아웃 ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.footer {
  width: 100%;
  background-color: #fff;
}
.footer .inner {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding: 50px 20px;
}
.footer .inner .footer-frame {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.footer .inner .footer-frame.left .bt-txt {
  color: #777777;
}
.footer .inner .footer-frame.left .bt-txt.list ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 20px;
}
.footer .inner .footer-frame.left .bt-txt.list ul li {
  font-weight: 500;
}
.footer .inner .footer-frame.left .bt-txt.list ul li a {
  font-weight: inherit;
}
.footer .inner .footer-frame.left .bt-txt.list ul li .col-bl {
  font-weight: 600;
}
.footer .inner .footer-frame.left .bt-txt address, .footer .inner .footer-frame.left .bt-txt p {
  line-height: 2;
  color: inherit;
}
.footer .inner .footer-frame.right .bt-img ul {
  display: flex;
  gap: 30px;
}
.footer .inner .footer-frame.right .bt-img ul li img {
  width: 100%;
}
.footer .inner .footer-frame.right .site-map-wrap {
  display: flex;
  align-items: center;
  gap: 1px;
  width: 320px;
  height: 45px;
  border-radius: 7px;
  border: 1px solid #d7d7d7;
}
.footer .inner .footer-frame.right .site-map-wrap :focus-within {
  outline: 2px solid #222;
}
.footer .inner .footer-frame.right .site-map-wrap .select-box {
  width: 100%;
  height: 100%;
  outline: 0;
}
.footer .inner .footer-frame.right .site-map-wrap .select-box select {
  padding: 2px 40px 3px 15px;
  border: 0;
  background-color: transparent;
}
.footer .inner .footer-frame.right .site-map-wrap .site-move {
  display: block;
  width: 90px;
  height: 100%;
  border-radius: 0 7px 7px 0;
  border-left: 1px solid #d7d7d7;
  line-height: 41px;
  text-align: center;
  background-color: #f8f8f8;
}
.footer.sub {
  border-top: 1px solid #ddd;
}

/********************************************************************************************************************************************************************************************************************************************
	팝업 스타일
********************************************************************************************************************************************************************************************************************************************/
/* modal (기본팝업/다이얼로그팝업)---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*기본 팝업*/
/*기본 팝업 박스*/
.pop-box .top-area {
  display: none;
}
.pop-box .top-area h1, .pop-box .top-area h1 > span {
  font-size: 22px;
  font-weight: 500;
}
.pop-box .top-area .i-btn {
  width: 28px;
  height: 28px;
}
.pop-box .top-area .i-btn.btn-close {
  background-image: url("/assets/images/sub/icon-close.png");
}
.pop-box .body-area {
  border-radius: 0 0 15px 15px;
  background-color: #fff;
}
.pop-box .body-area .body-inner {
  padding: 20px 20px 25px 20px;
  min-height: 150px;
}
.pop-box .body-area .body-inner h2 {
  height: 20px;
  margin-bottom: 15px;
  font-size: 16px;
  font-weight: 500;
}
.pop-box .body-area .body-inner h2::before {
  content: "";
  display: inline-block;
  width: 13px;
  height: 14px;
  margin: 0 7px 3px 0;
  background: url("/assets/images/sub/list-style_01.png") 50% 50% no-repeat;
  vertical-align: middle;
}
.pop-box .body-area .body-inner .contents + .contents {
  margin-top: 35px;
}
.pop-box .body-area .body-inner .contents.box {
  min-height: 300px;
  padding: 15px 20px;
  border: 1px solid #d7d7d7;
  border-radius: 4px;
  overflow-y: auto;
}
.pop-box .body-area .body-inner .contents .paginate-wrap::after {
  content: "";
  display: block;
  clear: both;
}
.pop-box .body-area .body-inner .contents .paginate-wrap .total {
  float: left;
}
.pop-box .body-area .body-inner .contents.qwchange {
  min-width: 250px;
  padding: 20px;
  text-align: center;
}
.pop-box .body-area .body-inner .contents.qwchange i {
  display: block;
  width: 50px;
  height: 50px;
  margin: 0 auto;
  margin-bottom: 20px;
  background-position: 50%;
  background-repeat: no-repeat;
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-save {
  background-image: url("/assets/images/sub/icon-qw_save.png");
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-certificate {
  background-image: url("/assets/images/sub/icon-certificate.png");
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-change {
  background-image: url("/assets/images/sub/icon-change.png");
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-confirm {
  background-image: url("/assets/images/sub/icon-confirm.png");
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-delete {
  background-image: url("/assets/images/sub/icon-delete.png");
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-notification {
  background-image: url("/assets/images/sub/icon-qw_notification.png");
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-time {
  background-image: url("/assets/images/sub/icon-qw_time.png");
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-return {
  background-image: url("/assets/images/sub/icon-qw_return.png");
}
.pop-box .body-area .body-inner .contents.qwchange i.i-qw-unlock {
  background-image: url("/assets/images/sub/icon-qw_unlock.png");
}
.pop-box .body-area .body-inner .contents.qwchange .time {
  margin-bottom: 10px;
  font-size: 30px;
}
.pop-box .body-area .body-inner .contents.qwchange .time span {
  font-size: 34px;
  font-weight: 600;
}
.pop-box .body-area .body-inner .contents .bullet-point {
  font-weight: 500;
}
.pop-box .body-area .body-inner .contents .bullet-point::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin: 0 7px 3px 0;
  border: 3px solid #356e9a;
  border-radius: 100%;
  vertical-align: middle;
}
.pop-box .body-area .body-inner .preview {
  overflow: auto;
  width: 100%;
  height: 100%;
  border: 1px solid #d7d7d7;
}
.pop-box .body-area .body-inner .filterbox + .listtop, .pop-box .body-area .body-inner .filterbox + .contents {
  margin-top: 20px;
}
.pop-box .body-area .body-inner .filterbox .filter-group {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pop-box .body-area .body-inner .filterbox .filter-group.end {
  justify-content: flex-end;
}
.pop-box .body-area .body-inner .filterbox .filter-group .input-group {
  display: flex;
  align-items: center;
  gap: 8px;
}
.pop-box .body-area .body-inner .filterbox .filter-group .i-tool-tip + input[type=checkbox] + label {
  margin-left: 7px;
}
.pop-box .body-area .body-inner .listtop h2 {
  margin-bottom: 0;
}
.pop-box .body-area .body-inner .listbtm .check-cnt {
  gap: 10px;
}
.pop-box .body-area .body-inner .split-layout {
  grid-template-columns: 1fr;
  grid-auto-flow: column dense;
  gap: 20px;
  min-width: 350px;
}
.pop-box .body-area .body-inner .split-layout:has(.contents) {
  grid-template-columns: 1fr 1fr;
  width: 700px;
}
.pop-box .body-area .body-inner .filter-box + .addr-area {
  margin-top: 20px;
}
.pop-box .body-area .body-inner .addr-area {
  height: 300px;
  overflow-y: auto;
}
.pop-box .body-area .body-inner .addr-area .addr-ex p {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px dashed #ddd;
}
.pop-box .body-area .body-inner .addr-area .addr-ex .example {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.pop-box .body-area .body-inner .addr-area .addr-ex .example + .example {
  margin-top: 10px;
}
.pop-box .body-area .body-inner .addr-area .r_info_body {
  margin-bottom: 10px;
}
.pop-box .body-area .body-inner .addr-area .addr-list li {
  padding: 10px;
  border-radius: 4px;
  border: 1px solid #d7d7d7;
}
.pop-box .body-area .body-inner .addr-area .addr-list li.active {
  background-color: rgba(0, 80, 152, 0.04);
  border: 1px solid #005098;
}
.pop-box .body-area .body-inner .addr-area .addr-list li:hover {
  background-color: rgba(0, 80, 152, 0.02);
}
.pop-box .body-area .body-inner .addr-area .addr-list li + li {
  margin-top: 10px;
}
.pop-box .body-area .body-inner .addr-area .addr-list li a {
  display: block;
  width: 100%;
  height: 100%;
}
.pop-box .body-area .body-inner .addr-area .addr-list li a .addr-tit {
  font-size: 16px;
  font-weight: 500;
}
.pop-box .body-area .body-inner .addr-area .addr-list li a .addr-tit + .addr-detail {
  margin-top: 10px;
}
.pop-box .body-area .body-inner .addr-area .addr-list li a .addr {
  display: grid;
  grid-template-columns: auto 1fr;
}
.pop-box .body-area .body-inner .addr-area .addr-list li a .addr + .addr {
  margin-top: 10px;
}
.pop-box .body-area .body-inner .addr-area .addr-list li a .addr label {
  display: inline-block;
  min-width: 55px;
  height: 24px;
  margin-right: 10px;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 14px;
  text-align: center;
  background-color: #eee;
}
.pop-box .body-area .body-btm {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 68px;
  padding: 0 25px;
  border-radius: 0 0 15px 15px;
  background-color: #f2f2f2;
}
.pop-box .body-area .body-btm .btn-wrap {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.pop-box .body-area .body-btm .btn {
  height: 38px;
}
.pop-box .body-area .body-btm .btn + .btn {
  margin: 0 0 0 6px;
}
.pop-box .body-area .body-btm.center {
  justify-content: center;
}
.pop-box .body-area .body-btm.between {
  justify-content: space-between;
}
.pop-box.win {
  width: 100%;
  height: 100%;
  border-radius: 0;
  box-shadow: none;
}
.pop-box.win .body-area {
  height: calc(100% - 60px);
}
.pop-box.win .body-area .body-inner {
  height: 100%;
}
.pop-box.win .body-area .body-inner .contents + .btn-wrap {
  margin-top: 20px;
}
.pop-box.win .body-area .body-inner .contents + .btn-wrap .btn {
  width: 100%;
}
.pop-box .txt-box {
  position: relative;
  margin-bottom: 20px;
  padding: 15px;
  border: 1px solid #d7d7d7;
  text-align: center;
  line-height: 1.428571429;
}
.pop-box .txt-box.fill {
  color: #888788;
  background-color: rgba(238, 238, 238, 0.5);
  line-height: 1.6;
}
.pop-box .txt-box.fill p {
  font-weight: 500;
}
.pop-box .txt-box + .contents-area {
  margin: 70px 0 0 0;
}
.pop-box .txt-box .title {
  font-size: 22px;
  font-weight: 500;
  text-align: left;
  color: #222;
}

.notify-box {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 15px 0;
}
.notify-box i {
  width: 80px;
  height: 80px;
}
.notify-box i.i-notify-delete {
  background-image: url("/assets/images/sub/icon-notify-delete.png");
}
.notify-box p {
  margin-top: 15px;
  font-size: 17px;
}

/*저작권 바로지금 서명 팝업(커스텀)*/
.pop-box.certificate {
  position: relative;
  width: 630px;
  height: 900px;
  border-radius: 35px;
  background-color: #041e47;
}
.pop-box.certificate .btn-close {
  position: absolute;
  top: -30px;
  right: -15px;
  width: 70px;
  height: 70px;
  border-radius: 1000px;
  background: #fff url("/assets/images/sub/icon-close_02.png") 50% 50% no-repeat;
}
.pop-box.certificate .con-sec {
  width: 100%;
  height: calc(100% - 180px);
}
.pop-box.certificate .con-sec .frame-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 45px 0 0 0;
  background-image: url("/assets/images/sub/rightnow-popup-frame.png");
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.pop-box.certificate .con-sec .frame-box .date {
  display: inline-block;
  width: max-content;
  height: 30px;
  margin-bottom: 15px;
  padding: 0 30px;
  border-radius: 1000px;
  line-height: 2.2;
  font-family: "JalnanGothic";
  color: #fff;
  text-align: center;
  background-color: #0069ba;
}
.pop-box.certificate .con-sec .frame-box .tit-cnt h1 {
  font-family: "JalnanGothic";
  font-size: 26px;
}
.pop-box.certificate .con-sec .frame-box .tit-cnt .user-name {
  font-family: "JalnanGothic";
  font-size: 36px;
  text-align: center;
}
.pop-box.certificate .con-sec .frame-box .tit-cnt .user-name strong {
  font-family: inherit;
  font-size: inherit;
  color: #0fb0f5;
}
.pop-box.certificate .con-sec .frame-box .img-cnt-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 215px;
}
.pop-box.certificate .con-sec .frame-box .img-cnt-wrap .img-cnt {
  width: 160px;
  height: 180px;
  margin-bottom: 20px;
  background-image: url("/assets/images/sub/rightnow-popup-img.png");
  background-position: 50% bottom;
  background-repeat: no-repeat;
}
.pop-box.certificate .con-sec .frame-box .img-cnt-wrap .desc-cnt {
  font-family: "JalnanGothic";
  font-size: 18px;
  text-align: center;
  color: #003a77;
}
.pop-box.certificate .con-sec .frame-box .img-cnt-wrap.legitimate .img-cnt {
  background-image: url("/assets/images/sub/rightnow-popup-img_02.png");
}
.pop-box.certificate .con-sec .frame-box .img-cnt-wrap.rules .img-cnt {
  background-image: url("/assets/images/sub/rightnow-popup-img_03.png");
}
.pop-box.certificate .con-sec .frame-box .img-cnt-wrap.correctly .img-cnt {
  background-image: url("/assets/images/sub/rightnow-popup-img_04.png");
}
.pop-box.certificate .con-sec .frame-box .logo-cnt {
  display: flex;
  align-items: center;
  gap: 30px;
}
.pop-box.certificate .con-sec .frame-box .logo-cnt img {
  height: 26px;
  object-fit: contain;
}
.pop-box.certificate .con-sec .frame-box .logo-cnt:nth-child(1) {
  width: 132px;
}
.pop-box.certificate .con-sec .frame-box .logo-cnt:nth-child(2) {
  width: 160px;
}
.pop-box.certificate .btm-sec {
  width: 100%;
  height: 180px;
  padding: 15px;
  border-radius: 0 0 35px 35px;
  background-color: #092654;
}
.pop-box.certificate .btm-sec .top {
  padding-bottom: 15px;
  border-bottom: #384d6e solid 1px;
}
.pop-box.certificate .btm-sec .top .btn-group {
  gap: 20px;
  margin-bottom: 18px;
}
.pop-box.certificate .btm-sec .top .btn-group button {
  border-radius: 1000px;
  font-weight: 700;
}
.pop-box.certificate .btm-sec .top .btn-group button i {
  width: 18px;
  height: 18px;
  margin: 0 10px 0 0;
}
.pop-box.certificate .btm-sec .top .btn-group button i.i-download {
  background-image: url("/assets/images/sub/icon-download.png");
}
.pop-box.certificate .btm-sec .top .btn-group:nth-child(2) {
  background-color: #fff;
}
.pop-box.certificate .btm-sec .top p {
  font-size: 14px;
  font-weight: 500;
  color: #dcdcdc;
  text-align: center;
}
.pop-box.certificate .btm-sec .btm {
  padding-top: 15px;
}
.pop-box.certificate .btm-sec .btm .flex-box {
  gap: 25px;
  padding: 0 20px;
}
.pop-box.certificate .btm-sec .btm .flex-box .btn-copy {
  flex: none;
  width: 30px;
  height: 36px;
  background-image: url("/assets/images/sub/icon-copy.png");
}
.pop-box.certificate .btm-sec .btm .flex-box .tag-cnt {
  width: 85%;
}
.pop-box.certificate .btm-sec .btm .flex-box .tag-cnt span {
  font-size: 14px;
  color: #fff;
}

/*얼럿 메시지팝업*/
.alert-popup {
  display: block;
  position: absolute;
  top: calc(50% - 45px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 200;
  width: max-content;
  min-width: 400px;
  min-height: 85px;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.alert-popup .message-body {
  display: flex;
  align-items: center;
  min-height: 50px;
  padding-left: 80px;
  background-position: 15px 50%;
  background-repeat: no-repeat;
}
.alert-popup .message-body p {
  padding-top: 3px;
  font-size: 16px;
  color: #fff;
}
.alert-popup.success {
  background-color: #005098;
}
.alert-popup.success .message-body {
  background-image: url("/assets/images/sub/icon-alert_success.png");
}
.alert-popup.failed {
  background-color: #c74040;
}
.alert-popup.failed .message-body {
  background-image: url("/assets/images/sub/icon-alert_failed.png");
}

/*# sourceMappingURL=common.css.map */