@charset "UTF-8";


/* ------------------ */
/* ### 기본 설정 GLOBAL */
/* ------------------ */

/* ## root */
:root {
  --warning: #ff8f00;
  --kakao-primary: #FEE500;
  --kakao-primary-active: #fff297;
  --kakao-primary-hover: #e8ce00;
  /* 연차 상태 색상 */
  --pto-pending: var(--bs-gray-200);
  --pto-annual: #004D78;
  --pto-weekend: #FF8800;
  --pto-rejected: var(--bs-red);
  --pto-official: var(--bs-yellow);
  --pto-family: var(--bs-indigo);
  --pto-birthday: var(--bs-active-success);
  --pto-special: var(--bs-pink);
  --pto-staggered: #43BFC7;
}

/* ## reset */
body {
  /* 폰트 재설정 */
  font-family: "MinSans", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}

/* ## 스크롤바 */
div,
main,
ol,
pre,
span,
ul {
  scrollbar-color: #dde4eb transparent;
}


/* ------------------------ */
/* ### 메트로닉 커스텀 METRONIC */
/* ------------------------ */

/* ## 사이드바 */
[data-kt-aside-minimize=on] .aside:not(.aside-hoverable) .aside-logo .logo.d-flex,
[data-kt-aside-minimize=on] .aside:not(:hover) .aside-logo .logo.d-flex {
  display: none !important;
}

/* ## 인풋 */
/* 검색창 삭제 버튼 커스텀 */
input[type="search" i]::-webkit-search-cancel-button {
  appearance: none;
  height: .7rem;
  width: .8rem;
  top: 50%;
  right: 1rem;
  position: absolute;
  transform: translateY(-58%);
  background-color: var(--bs-gray-700) !important;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: var(--bs-gray-700);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-gray-700%29'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e");
  mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-gray-700%29'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e");
}

/* 인풋 클리어 버튼 */
.btn-clear {
  height: 12px;
  width: 12px;
  padding: 0 !important;
  top: 50%;
  right: 1rem;
  position: absolute !important;
  transform: translateY(-58%);
  background-color: var(--bs-gray-700) !important;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  background-color: var(--bs-gray-700);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-gray-700%29'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e");
  mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-gray-700%29'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e");
}

input.search-with-icon[type="search" i]::-webkit-search-cancel-button {
  right: 34px;
}

/* ## textarea */
textarea.form-control:disabled {
  opacity: 0.5;
}

/* ## form */
.form-text {
  color: var(--bs-gray);
}

/* ## 카드 */
/* 카드 > 확장 */
[aria-expanded="true"] i {
  transition: all 0.3s;
}

[aria-expanded="true"] i {
  color: var(--bs-primary);
  rotate: 180deg;
}

/* ## 버튼 */
.btn {
  display: flex;
  align-items: center;
  justify-content: center;
}

[class^="btn-outline"] {
  border-style: solid !important;
  border-width: 1px !important;
}

.btn-light-primary.btn-outline {
  border-color: #009ef7;
}

.btn-outline i {
  color: inherit;
}

/* 버튼 포커스 커스텀 .btn-custom */
/* 버튼 > light primary */
.btn-custom.btn.btn-light-primary:focus:not(.btn-active) {
  color: #009ef7 !important;
  border-color: #f1faff !important;
  background-color: #f1faff !important;
  outline: 2px solid #d4efff !important;
}

.btn-custom.btn.btn-light-primary:focus:not(.btn-active) i {
  color: #009ef7 !important;
}

.btn-custom.btn.btn-light-primary:hover:not(.btn-active) {
  color: #fff !important;
  border-color: #009ef7 !important;
  background-color: #009ef7 !important;
}

.btn-custom.btn.btn-light-primary:hover:not(.btn-active) i {
  color: #fff !important;
}

.btn-outline-primary:hover {
  color: #fff;
}

/* 버튼 > light danger */
.btn-custom.btn.btn-light-danger:focus:not(.btn-active) {
  color: #f1416c !important;
  border-color: #fff5f8 !important;
  background-color: #fff5f8 !important;
  outline: 2px solid #ffe0e9 !important;
}

.btn-custom.btn.btn-light-danger:focus:not(.btn-active) i {
  color: #f1416c !important;
}

.btn-custom.btn.btn-light-danger:hover:not(.btn-active) {
  color: #fff !important;
  border-color: #f1416c !important;
  background-color: #f1416c !important;
}

.btn-custom.btn.btn-light-danger:hover:not(.btn-active) i {
  color: #fff !important;
}

.btn-outline-danger:hover {
  color: #fff;
}

/* 버튼 > light warning */
.btn-custom.btn.btn-light-warning {
  color: var(--warning);
}

.btn-custom.btn.btn-light-warning:focus:not(.btn-active) {
  color: var(--warning) !important;
  border-color: #fff8dd !important;
  background-color: #fff8dd !important;
  outline: 2px solid #fbedb8 !important;
}

.btn.btn-light-warning .svg-icon,
.btn.btn-light-warning i {
  color: var(--warning);
}

.btn-custom.btn.btn-light-warning:focus:not(.btn-active) i {
  color: var(--warning) !important;
}

.btn-custom.btn.btn-light-warning:hover:not(.btn-active) {
  color: #fff !important;
  border-color: var(--warning) !important;
  background-color: var(--warning) !important;
}

.btn-custom.btn.btn-light-warning:hover:not(.btn-active) i {
  color: #fff;
}

/* 버튼 > light info */
.btn-custom.btn.btn-light-info:focus:not(.btn-active) {
  color: #7239ea !important;
  border-color: #f8f5ff !important;
  background-color: #f8f5ff !important;
  outline: 2px solid #efe6ff !important;
}

.btn-custom.btn.btn-light-info:focus:not(.btn-active) i {
  color: #7239ea !important;
}

.btn-custom.btn.btn-light-info:hover:not(.btn-active) {
  color: #fff !important;
  border-color: #7239ea !important;
  background-color: #7239ea !important;
}

.btn-custom.btn.btn-light-info:hover:not(.btn-active) i {
  color: #fff !important;
}

/* 버튼 > light success */
.btn-custom.btn.btn-light-success:focus:not(.btn-active) {
  color: #50cd89 !important;
  border-color: #e8fff3 !important;
  background-color: #e8fff3 !important;
  outline: 2px solid #c3f1da !important;
}

.btn-custom.btn.btn-light-success:focus:not(.btn-active) i {
  color: #50cd89 !important;
}

.btn-custom.btn.btn-light-success:hover:not(.btn-active) {
  color: #fff !important;
  border-color: #50cd89 !important;
  background-color: #50cd89 !important;
}

.btn-custom.btn.btn-light-success:hover:not(.btn-active) i {
  color: #fff !important;
}

.btn-search.btn-outline {
  border-color: #f1faff;
}

.btn-xs {
  padding: calc(.25rem + 1px) calc(0.75rem + 1px) !important;
  font-size: 0.875rem !important;
}

/* ## 텍스트 */
.text-warning {
  color: var(--warning) !important;
}

/* ## 탭 */
.nav-request .nav-link {
  color: var(--bs-gray-900);
  background-color: var(--bs-gray-300);
}

.nav-request:is(.nav-pills) .nav-link.active,
.nav-request:is(.nav-pills) .show>.nav-link {
  background-color: var(--bs-gray-900);
}

.nav-link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: .5rem 1.5rem;
  font-size: 1.2rem;
  font-weight: 500;
}

.nav-link .badge {
  min-width: 2rem;
  width: auto !important;
  padding: 0 0.5rem;
  border-radius: 1.75rem;
  font-weight: 700;
}

/* ## 뱃지 */
.badge-group {
  display: flex;
  gap: .25rem;
  flex-wrap: wrap;
  justify-content: center;
}

.badge-light {
  background-color: var(--bs-gray-200);
}

.badge-light-warning {
  color: var(--warning);
}

.badge-light-pink {
  background-color: #ffedf8;
  color: #df13d3;
}

.badge-xl {
  padding: 0.5rem;
  font-size: 1.2rem;
}

/* ## 프로그레스바 */
.progress {
  height: 10px;
  background-color: var(--bs-gray-300);
}


/* -------------------- */
/* ### 유틸리티 UTILITIES */
/* -------------------- */

/* ## 그리드 컬럼 */
/* 사용법: d-grid + grid-cols-{n} + gap-{n} */
.grid-cols-1 {
  grid-template-columns: repeat(1, 1fr);
}

.grid-cols-2 {
  grid-template-columns: repeat(2, 1fr);
}

.grid-cols-3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid-cols-4 {
  grid-template-columns: repeat(4, 1fr);
}

/* ## 텍스트 */
.text-keep {
  word-break: keep-all;
}

/* ## 사이즈 */
.rounded-left-1 {
  border-top-left-radius: .475rem !important;
  border-bottom-left-radius: .475rem !important;
}

.z-index-4 {
  z-index: 4;
}

.resize-none {
  resize: none;
}

/* dvh 유틸리티 (10 ~ 100, step 10) */
.h-10dvh { height: 10dvh; }
.h-20dvh { height: 20dvh; }
.h-30dvh { height: 30dvh; }
.h-40dvh { height: 40dvh; }
.h-50dvh { height: 50dvh; }
.h-60dvh { height: 60dvh; }
.h-70dvh { height: 70dvh; }
.h-80dvh { height: 80dvh; }
.h-90dvh { height: 90dvh; }
.h-100dvh { height: 100dvh; }

.min-h-10dvh { min-height: 10dvh; }
.min-h-20dvh { min-height: 20dvh; }
.min-h-30dvh { min-height: 30dvh; }
.min-h-40dvh { min-height: 40dvh; }
.min-h-50dvh { min-height: 50dvh; }
.min-h-60dvh { min-height: 60dvh; }
.min-h-70dvh { min-height: 70dvh; }
.min-h-80dvh { min-height: 80dvh; }
.min-h-90dvh { min-height: 90dvh; }
.min-h-100dvh { min-height: 100dvh; }

.max-h-10dvh { max-height: 10dvh; }
.max-h-20dvh { max-height: 20dvh; }
.max-h-30dvh { max-height: 30dvh; }
.max-h-40dvh { max-height: 40dvh; }
.max-h-50dvh { max-height: 50dvh; }
.max-h-60dvh { max-height: 60dvh; }
.max-h-70dvh { max-height: 70dvh; }
.max-h-80dvh { max-height: 80dvh; }
.max-h-90dvh { max-height: 90dvh; }
.max-h-100dvh { max-height: 100dvh; }


/* ---------------------- */
/* ### 플러그인 커스텀 PLUGINS */
/* ---------------------- */

/* ## Select2 */
.select2-container--bootstrap5 .select2-selection__clear {
  transform: translateY(-58%);
}

.select2 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 상태값별 텍스트 색상 */
.select2-selection__rendered[title="예정"] {
  color: #ffc700 !important;
}

.select2-selection__rendered[title="진행"],
.select2-selection__rendered[title="지급완료"],
.select2-selection__rendered[title="발송예약"] {
  color: #50cd89 !important;
}

.select2-selection__rendered[title="종료"] {
  color: #a1a5b7 !important;
}

.select2-selection__rendered[title="완료"],
.select2-selection__rendered[title="접수"] {
  color: #7239ea !important;
}

.select2-selection__rendered[title="처리중"],
.select2-selection__rendered[title="발송완료"] {
  color: #009ef7 !important;
}

.select2-selection__rendered[title="접수취소"],
.select2-selection__rendered[title="발송취소"] {
  color: #f1416c !important;
}

/* 비활성 */
.select2 .select2-selection.select2-selection--single.disabled {
  pointer-events: none;
  background-color: #eff2f5 !important;
}

/* Select2 + 인풋 조합 레이아웃 */
.duplicate-wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.type-wrap>.content-wrap,
.duplicate-wrap .duplicate-origin>.input-group+.d-flex,
.duplicate-wrap .btn-type-wrap>.input-group+.d-flex {
  height: 42.94px;
}

/* ## Flatpickr */
.flatpickr-input:disabled {
  pointer-events: none;
  opacity: 0.5;
  background-color: #eff2f5;
}

.flatpickr-input:disabled::placeholder {
  color: #a1a5b7;
  opacity: 1;
}

.fake-input.disabled {
  pointer-events: none;
  background-color: #eff2f5;
  color: #a1a5b7;
}

/* ## DataTable */
table.dataTable>thead>tr>td:not(.sorting_desc, .sorting_asc),
table.dataTable>thead>tr>th:not(.sorting_desc, .sorting_asc) {
  padding-right: 0.75rem;
}

.table td:last-child,
.table th:last-child,
.table tr:last-child {
  padding-right: 0 !important;
}

/* sorting 아이콘 활성시 정렬 */
table.dataTable>thead .sorting_asc,
table.dataTable>thead .sorting_desc {
  vertical-align: inherit;
}

/* ## Tagify */
.tagify--focus {
  overflow: hidden;
  /* 태그 박스내 placeholder 넘침 가림 */
}

/* ## Swiper */
.swiper-custom.swiper {
  border-radius: 0.475rem;
  border: 1px solid #e4e6ef;
}

.swiper-custom .swiper-slide {
  display: flex !important;
  justify-content: center;
  align-items: center;
}

.swiper-custom .swiper-slide img {
  max-width: 100%;
  max-height: 100%;
}

.swiper-custom .swiper-button-prev:after,
.swiper-custom .swiper-button-next:after {
  content: "";
}

.swiper-custom .swiper-pagination-bullet {
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
  font-size: 12px;
  color: #000;
  opacity: 1;
  background: rgba(0, 158, 247, 0.23);
}

.swiper-custom .swiper-pagination-bullet-active {
  color: #fff;
  background: var(--bs-primary);
}


/* ---------------- */
/* ### 레이아웃 LAYOUT */
/* ---------------- */

/* ## sticky */
/* 상세 페이지 고정 탭 */
.sticky-tab {
  background: #f5f8fa;
  position: sticky;
  top: 65px;
  z-index: 99;
}

.sticky-card-header {
  background: #ffffff !important;
  position: sticky;
  top: 65px;
  left: 0;
  z-index: 99;
}


/* -------------------- */
/* ### 컴포넌트 COMPONENTS */
/* -------------------- */

/* ## 테이블 */
/* border-custom */
.table.border-custom,
.table.border-custom th,
.table.border-custom td {
  border: 1px solid var(--bs-gray-300);
}

.table.border-custom td:first-child,
.table.border-custom th:first-child,
.table.border-custom tr:first-child {
  padding-left: .75rem;
}

.table.border-custom td:last-child,
.table.border-custom th:last-child,
.table.border-custom tr:last-child {
  padding-right: .75rem;
}

.table.border-custom tfoot {
  border-top: 3px solid var(--bs-gray-300);
}

/* 퍼블리싱 URL 목록 테이블 */
/* tbody별 row 카운터 */
.pub-url-table {
  counter-reset: row;
}

.pub-url-table tbody tr {
  counter-increment: row;
}

.pub-url-table tbody .num::before {
  content: counter(row);
}

/* tbody 호버시 rowspan 셀 포함 하이라이트 */
.pub-url-table tbody:hover td[rowspan],
.pub-url-table tbody:hover th[rowspan],
.pub-url-table tbody tr:hover th,
.pub-url-table tbody tr:hover td {
  background-color: var(--bs-gray-200);
}

.pub-url-table a {
  font-weight: bold;
}

/* ## 카카오 */
.bg-kakao {
  background-color: var(--kakao-primary);
}

.btn-kakao {
  background-color: var(--kakao-primary);
  color: #000000;
}

.btn-kakao:focus:not(.btn-active) {
  border-color: var(--kakao-primary-active) !important;
  background-color: var(--kakao-primary-active) !important;
  outline: 2px solid var(--kakao-primary-hover) !important;
}

.btn-kakao:hover:not(.btn-active) {
  border-color: var(--kakao-primary-hover) !important;
  background-color: var(--kakao-primary-hover) !important;
}

.btn-kakao:hover:not(.btn-active) i {
  color: #000 !important;
}

.btn:is(.btn-kakao):is(:active, :hover):not(.btn-active) {
  border-color: var(--kakao-primary-active) !important;
  background-color: var(--kakao-primary-active) !important;
}

/* ## 마이크로사이트 */
.mic-draggable-zone .draggable {
  position: relative;
  justify-content: center;
}

.btn-com-edit {
  padding: 10px 0 !important;
  position: absolute;
  right: 51px;
  top: 50%;
  transform: translateY(-50%);
}

.btn-com-del {
  padding: 10px 0 !important;
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}

/* ## 이미지 */
.img-cover {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ## 휴무 관리 */
/* # 상태값 배경색 */
/* 1. 대기중 */
.bg-pto-pending {
  background-color: var(--pto-pending);
  color: var(--bs-gray-900);
}

/* 2. 연차 */
.bg-pto-annual {
  background-color: var(--pto-annual);
}

/* 3. 시차 */
.bg-pto-staggered {
  background-color: var(--pto-staggered);
}

/* 4. 주말근무 */
.bg-pto-weekend {
  background-color: var(--pto-weekend);
}

/* 5. 반려 */
.bg-pto-rejected {
  background-color: var(--pto-rejected);
}

.bg-pto-holiday {
  background-color: var(--pto-rejected);
}

/* 공무 휴가 */
.bg-pto-official {
  background-color: var(--pto-official);
}

/* 경조 휴가 */
.bg-pto-family {
  background-color: var(--pto-family);
}

/* 생일 휴가 */
.bg-pto-birthday {
  background-color: var(--pto-birthday);
}

/* 특별 휴가 */
.bg-pto-special {
  background-color: var(--pto-special);
}

/* # 캘린더 범례 */
.sample-annual {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 3px;
  background-color: var(--pto-pending);
  color: #7e8299;
}

.sample-annual .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--pto-annual);
}

.sample-annual.annual {
  background-color: var(--pto-annual);
  color: #fff;
}

.sample-annual.staggered {
  background-color: var(--pto-staggered);
  color: #fff;
}

.sample-annual.rejected {
  background-color: var(--pto-rejected);
  color: #fff;
}

.sample-annual.weekend {
  background-color: var(--pto-weekend);
  color: #fff;
}

.sample-annual.official {
  background-color: var(--pto-official);
  color: #fff;
}

.sample-annual.family {
  background-color: var(--pto-family);
  color: #fff;
}

.sample-annual.birthday {
  background-color: var(--pto-birthday);
  color: #fff;
}

.sample-annual.special {
  background-color: var(--pto-special);
  color: #fff;
}

/* # 연차 소진율 */
.progress {
  height: 20px;
}

/* # 승인 스텝 인디케이터 */
.approval-steps {
  display: flex;
  align-items: center;
  justify-content: center;
}

.approval-step {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* 원형 번호 (기본: 대기) */
.approval-step .step-circle {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 1rem;
  background-color: #f5f8fa;
  color: #7e8299;
}

/* 라벨 (기본: 대기) */
.approval-step .step-label {
  font-weight: bold;
  margin-top: 4px;
  font-size: 0.8rem;
  color: #7e8299;
}

/* 연결선 (기본: 점선 회색) */
.step-line {
  width: 20px;
  margin-bottom: 1.5rem;
  border-bottom: 2px dashed #ccc;
}

/* 승인완료 */
.approval-step.step-done .step-circle {
  background-color: #009ef7;
  color: #fff;
}

.approval-step.step-done .step-label {
  color: #009ef7;
}

.approval-step.step-done+.step-line {
  border-bottom: 2px solid #009ef7;
}

/* 진행중 */
.approval-step.step-current .step-circle {
  background-color: #f5f8fa;
  color: #7e8299;
}

.approval-step.step-current .step-label {
  color: #7e8299;
}

/* 반려 */
.approval-step.step-rejected .step-circle {
  background-color: #f1416c;
  color: #fff;
}

.approval-step.step-rejected .step-label {
  color: #f1416c;
}


/* ---------- */
/* ### @MEDIA */
/* ---------- */

/* ## @keyframes */
.aniBounce {
  animation: bounce 4s infinite;
}

@keyframes bounce {

  0%,
  100% {
    top: 45%;
  }

  50% {
    top: 52%
  }
}

.aniDrop {
  animation: drop 5s infinite;
}

@keyframes drop {
  0% {
    top: 0;
    opacity: 0;
  }

  30%,
  70% {
    opacity: 100%;
  }

  100% {
    top: 80%;
    opacity: 0;
  }
}

.aniZigzag {
  animation: zigzag 3s linear infinite;
}

@keyframes zigzag {
  0% {
    top: 0;
    left: 20%;
    opacity: 0;
  }

  30% {
    left: 0;
    top: 20%;
    opacity: 1;
    rotate: -5deg;
  }

  70% {
    left: 40%;
    top: 50%;
    opacity: 1;
    rotate: 10deg;
  }

  100% {
    top: 100%;
    left: 20%;
    opacity: 0;
    rotate: -10deg;
  }
}

/* ## 미디어 쿼리 */
@media (max-width: 767px) {

  .type-wrap>.content-wrap,
  .duplicate-wrap .duplicate-origin>.input-group+.d-flex,
  .duplicate-wrap .btn-type-wrap>.input-group+.d-flex {
    height: 39.78px;
  }
}

/* 태블릿, 모바일 */
@media (pointer: coarse) {

  /* form */
  .form-label,
  .form-control {
    font-size: 16px;
  }

  .form-check .form-check-label {
    font-size: 16px;
    line-height: 1;
  }

  .join-wrap .mb-4 {
    margin-bottom: 1.5rem !important;
  }

  /* 버튼 */
  .btn {
    font-size: 1.3rem;
  }

  /* 버튼 포커스 커스텀 .btn-custom */
  .btn-custom.btn:is(.btn-outline-primary, .btn-light-primary):is(:active, :hover):not(.btn-active) {
    color: #009ef7 !important;
    border-color: #f1faff !important;
    background-color: #f1faff !important;
    outline: 2px solid #d4efff !important;
  }

  .btn-custom.btn:is(.btn-outline-primary, .btn-light-primary):is(:active, :hover):not(.btn-active) i {
    color: #009ef7 !important;
  }

  /* 버튼 > light danger */
  .btn-custom.btn:is(.btn-outline-danger, .btn-light-danger):is(:active, :hover):not(.btn-active) {
    color: #f1416c !important;
    border-color: #fff5f8 !important;
    background-color: #fff5f8 !important;
    outline: 2px solid #ffe0e9 !important;
  }

  .btn-custom.btn:is(.btn-outline-danger, .btn-light-danger):is(:active, :hover):not(.btn-active) i {
    color: #f1416c !important;
  }

  /* 버튼 > light warning */
  .btn-custom.btn:is(.btn-outline-warning, .btn-light-warning):is(:active, :hover):not(.btn-active) {
    color: #ffc700 !important;
    border-color: #fff8dd !important;
    background-color: #fff8dd !important;
    outline: 2px solid #fbedb8 !important;
  }

  .btn-custom.btn:is(.btn-outline-warning, .btn-light-warning):is(:active, :hover):not(.btn-active) i {
    color: #ffc700 !important;
  }

  /* 버튼 > light info */
  .btn-custom.btn:is(.btn-outline-info, .btn-light-info):is(:active, :hover):not(.btn-active) {
    color: #7239ea !important;
    border-color: #f8f5ff !important;
    background-color: #f8f5ff !important;
    outline: 2px solid #efe6ff !important;
  }

  .btn-custom.btn:is(.btn-outline-info, .btn-light-info):is(:active, :hover):not(.btn-active) i {
    color: #7239ea !important;
  }

  /* 버튼 > light success */
  .btn-custom.btn:is(.btn-outline-success, .btn-light-success):is(:active, :hover):not(.btn-active) {
    color: #50cd89 !important;
    border-color: #e8fff3 !important;
    background-color: #e8fff3 !important;
    outline: 2px solid #c3f1da !important;
  }

  .btn-custom.btn:is(.btn-outline-success, .btn-light-success):is(:active, :hover):not(.btn-active) i {
    color: #50cd89 !important;
  }
}