/*@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR&display=swap');*/
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css");
@import url("https://cdn.jsdelivr.net/npm/nouislider@15.7.1/dist/nouislider.min.css");

a, a:hover {
  text-decoration: none;
  cursor: pointer;
  filter: darkness(85%); !important;
}

*:focus {
  outline: none;
  box-shadow: none; 
}

ul, li {
  list-style: none;
}

label, input[type="checkbox"], input[type="radio"], select {
  cursor: pointer;
}

.cur-p {
  cursor: pointer;
}

.row {
  align-items: center;
  margin-left: 0;
  margin-right: 0;
}

.btns-wrap {
  gap: 1rem;
  flex: 1;
  justify-content: right;
  align-items: center;
  margin-left: auto;
}

.btn {
  border-radius: 5px;
}

.btn-nav, .btn-pop, .btn-config {
  cursor: pointer;
  min-width: 4.8rem;
  text-align: center;
  border: 1px solid #CCC;
  border-radius: 5px;
  padding: 0.375rem 0.75rem;
  background-color: white;
  color: #666;
}

.btn-nav:hover {
  border: 1px solid #73bcff;
  background-color: #F8F8F8;
  font-weight: 500;
}

.btn-nav.active {
  background-color: #0d6efd;
  border-color: #0d6efd;
  color: white;
}

.btn-nav.active:hover {
  background-color: #0054d0;
  border: 1px solid #0054d0;
}

.btn-pop {
  color: #224b6e;
  background-color: aliceblue;
  border-color: #CCC;
}

.btn-pop:hover {
  background-color: #d8e9f8;
  border-color: #a6c6e2;
  font-weight: 500;
}

.btn-config {
  font-size: 0.9rem;
  background-color: #f4f7ff;
}

.btn-config:hover {
  background-color: #e7eeff;
  font-weight: 500;
}

.btn-select { color: #888; padding: .25rem 1rem; border-radius: 5px; border: 1px solid #dee2e6; cursor: pointer; }
.btn-select.selected { background-color: #fafbff; color: #666; border: 1px solid #CCC; }
.btn-select.selected:before { content: "\f26e"; color: #AAA; font-family: bootstrap-icons !important; padding-right: 0.25rem; }
.btn-select:hover { background-color: #FAFAFA; }

.btn-ok, .btn-cancel {
  min-width: 4.5rem;
}

.btn-find { border: 1px solid #ced4da; font-size: 0.8rem; color: #959595; background-color: #FAFAFA; padding: 0.45rem 0.35rem 0.45rem .75rem;  border-radius: 0.4rem; display: none; }
.btn-find-close { padding: .5rem .15rem .5rem .25rem; cursor: pointer; }

.btn-more-option { border: 1px solid #edd0f4; padding: 0.5rem 1rem; border-radius: 50px; color: #be4cd8; background-color: #fef9ff; }

/*팝업창 닫기 아이콘*/
.btn-popup-close { font-size: 1.5rem; color: gray; position: absolute; right: 0; top: 0; width: 3rem; padding: 0.25rem 0.75rem; cursor: pointer; border-radius: 0.5rem; }
.btn-popup-close:before { content: "\f62a"; font-family: 'bootstrap-icons'; }

.bi.bi-three-dots-vertical { font-size: 1rem; color: #666; cursor: pointer; }
.bi.bi-search { opacity: 0.6; cursor: pointer; }
.bi.bi-search:hover { opacity: 1; font-weight: bold; }

/* swipe begin */
.swipe-icon {
  position: fixed;
  font-size: 48px;
  color: rgba(0,0,0,0.6);
  opacity: 0; /* 초기 숨김 */
  pointer-events: none;
  z-index: 9999;
  transition: opacity 0.1s;
}
.swipe-icon.left   { top: 50%; left: 15%;  }
.swipe-icon.right  { top: 50%; left: 15%;  }
.swipe-icon.up     { top: 50%; bottom: auto; left: 50%; }
.swipe-icon.down   { top: 50%; bottom: auto; left: 50%; }
/*swipe end*/

/* iframe begin */
#iframe-wrap { display: none; background-color: white; z-index: 500; }
#iframe-inner-wrap, #iframe { border-radius: 0.5rem 0.5rem 0 0; width: 100%; height: 100%; }  
/* iframe end */

/* bottom-sheet begin */
.bottom-sheet { position: fixed; bottom: -100%; left: 50%; transform: translate(-50%, 0); width: calc(100vw - 3rem); max-height: 90vh; height: 90vh; max-width: 991px; 
                border-radius: 0.5rem 0.5rem 0 0; z-index: 500; background-color: white;  display: flex; flex-direction: column; }
.bottom-sheet:after { content: ""; position: absolute; top: 5px; left: 50%; transform: translateX(-50%); width: 40px; height: 4px; background: #707070; border-radius: 5px; }

#iframe-wrap.bottom-sheet { max-width: 1280px; }

/*터치로 쓸어내릴때를 반영하기 위해 투명의 사각형을 넣음*/
#iframe-wrap.bottom-sheet:before { content: ""; position: absolute; top: 5px; left: 50%; transform: translateX(-50%); width: 50%; height: 15px; background: #707070; border-radius: 5px; opacity: 0; }

.bottom-sheet { transition: bottom 0.3s ease; } 
.bottom-sheet.active { bottom: 0; } 

@media (max-width: 810px) {
  .bottom-sheet { width: 100%; }
}
@media (max-width: 575px) {
  .bottom-sheet { max-height: 82vh; }
}  
/* bottom-sheet end */

.no-more-list, .more-list {
  text-align: center;
  margin: 1.25rem;
  width: 100%;
}

.btn-more {
  color: dodgerblue;
  cursor: pointer;
}

.btn-more.up:before {
  content: '\f148';
  position: relative;
  top: 0;
  right: 6px;
  font-size: 0.7rem;
  font-family: "bootstrap-icons";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

.btn-more.down:before {
  content: '\f128';
  position: relative;
  top: 0;
  right: 6px;
  font-size: 0.7rem;
  font-family: "bootstrap-icons";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

.btn-more:after {
  content: "더보기";
  font-size: 0.8rem;
}

.no-more-list {
  color: #d2d2d2 !important;
  position: relative;
  padding: .75rem 5rem 0.75rem 0rem;
  margin: 4rem 40% 0rem 40%;
  font-size: .5rem;
  font-weight: 700;
  border-top: 1px dashed rgba(100, 100, 100, 0.1);  
}

.no-more-list:after {
  content: "END OF DATA";
  position: absolute;
  top: -7px;
  padding: 0 1rem;
  background: white;
}

.goto-top {
  position: absolute;
  right: 20px;
  bottom: 20px;
  border: 1px solid #797979;
  border-radius: 50%;
  height: 40px;
  width: 40px;
  text-align: center;
  padding: 8px;
  cursor: pointer;
  background-color: white;
  opacity: 0.3;
  z-index: 20000;
}
.goto-top:hover {
  background-color: #4ec4f8;
}
.goto-top:after {
  font-family: "bootstrap-icons";
  content: "\F148";
}

.goto-top-icon {
  color: black;
  font-size: 20px;
}

.d-flex-center {
  display: flex; height: 100%; width: 100%; justify-content: center; align-items: center; 
}

.modal-center-popup {
  display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 95vw; max-height: 90vh; min-width: 300px; z-index: 600; border-radius: 5px; 
  background-color: white; border: 1px solid #ced4da; padding: 0.5rem;
}

.modal-caption { color: #191919; font-weight: 500; font-size: 0.9rem; }

.fade-wrap { position: fixed; left: -50vw; top: -200px; width: 200vw; height: 200vh; background-color: #000; opacity: 0.6; display: none; z-index: 200; }

@media (max-width: 1199px) {
  .container { max-width:100%!important; }
  .modal-lg,.modal-xl { max-width: 95%!important; }
  .modal-md { max-width: 768px!important; }
}

@media (min-width: 1199px) {
  .container { max-width:1140px!important; }
  .modal-lg,.modal-xl { max-width: 1140px!important; }
  .modal-md { max-width: 768px!important; }
}

@media (max-width: 992px) {
  .container { max-width:992px!important; }
  .modal-lg,.modal-xl { max-width: 992px!important; }
  .modal-md { max-width: 768px!important; }
}

@media (max-width: 768px) {
  .container { max-width:768px!important; }
  .modal-lg,.modal-xl { max-width: 768px!important; }
  .modal-md { max-width: 768px!important; margin: auto; }
}

@media (max-width: 575px) {
  .modal-sm { max-width:300px; margin: auto; }
}

/* tab 시작 */
.tab-wrap { padding-top: 10px; display: flex; flex-direction: row; gap: 1rem; padding-left: 1rem; }
.tab-btns { color: #222; font-weight: 500; padding: 5px 15px 10px 15px; cursor: pointer; }
.tab-btns a { color: #888; }
.tab-btns:hover { color: black; font-weight: bold; } 
.tab-btns.active { font-weight: bold; border-bottom: 2px solid dodgerblue; }
.tab-btns.active a { color: #1E90FF; }

@media (max-width: 575px) {
  .tab-wrap { gap: 0.5rem; }
  .tab-btns { padding: 5px 10px 10px 10px; }
}

@media (max-width: 400px) {
  .tab-wrap { padding-left: 5px; gap: 0.1rem; }
  .tab-btns { font-size: 0.9rem; padding: 5px 6px 10px 6px; }
}
/* tab 끝 */


.dropdown-menu {
  box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 3px;
}

.dropdown-menu {
  min-width: auto;
}

.dropdown-menu > li {
  line-height: 1;
}  

/* bootstrap 시작 */

div.form-check {  /* 기본 체크박스도 inline-block으로 */
  display: inline-block;
  margin-right: 0.5rem;
}
.form-check-input {
  width: 1.2em; 
  height: 1.2em; 
  margin-top: .15em;
}   
.form-check-input:focus {
  box-shadow: none!important;
}
.form-check-input[type="radio"] {
  width: 1em; 
  height: 1em; 
  margin-top: .2em;
}  
.form-check-input:checked {
  background-color: #4878be; 
  border-color: #4878be;
}
.form-check-input.partial:checked {
  background-color: #b7d4ff; 
  border-color: #b7d4ff;
}

.btn-close:focus,.btn-close:active {
   outline: none !important;
   box-shadow: none;
}

/* bootstrap 끝 */

/* bootstrap selectpicker 시작 --------------------------- */

/* 기본 Bootstrap-Select 화살표 제거 */
.bootstrap-select .dropdown-toggle::after {
    display: none !important;
}

/* 화살표 아이콘 추가 */
.bootstrap-select .dropdown-toggle {
    background-color: #ffffff !important; /* 버튼 배경 흰색 */
    color: #000000 !important; /* 글자색 검정 */
    border: 1px solid #ced4da !important; /* 테두리 스타일 */
    padding: 0.3rem 0.6rem !important; 
    font-size: 1rem; /* 글자 크기 조정 */
    border-radius: 0.3rem; /* 버튼 모서리 둥글게 */    
}

.bootstrap-select .dropdown-toggle::before {
    font-family: "bootstrap-icons";
    content: "\F282"; /* bi-chevron-down (아래 화살표) */
    color: #888;
    font-size: 0.9rem;
    font-weight: bold;
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.2s ease-in-out;
}

.bootstrap-select .dropdown-toggle:focus {
  outline: none !important;  
}

/* 선택된 옵션이 너무 길 경우 줄임표(...) 표시 */
.bootstrap-select .filter-option-inner-inner {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: calc(100% - 25px); /* 너비 초과 방지 */
}

/* 드롭다운이 열렸을 때 아이콘 변경 */
.bootstrap-select.show .dropdown-toggle::before {
    content: "\F286"; /* bi-chevron-up (위 화살표) */
}

/* 기존 체크 아이콘 숨기기 */
.bootstrap-select .dropdown-menu .selected span.check-mark {
    display: none !important;
}

/* 사용자 정의 체크 아이콘 추가 */
.bootstrap-select .dropdown-menu .selected a.selected::after {
    content: "\F272"; /* Bootstrap Icons의 bi-check-circle */
    font-family: "Bootstrap-icons";
    font-size: 1.2rem;
    color: #0d6efd; /* 원하는 색상 */
    position: absolute;
    right: 5px; /* 오른쪽 여백 조정 */
    top: 50%;
    transform: translateY(-50%);
}

.bootstrap-select button {  
  max-width: 9rem;
}

.bootstrap-select .dropdown-item.active { 
  color: black;
  border-radius: 4px;
  background-color: #adceff;
} 

/* bootstrap selectpicker 끝 --------------------------- */

/* daterangepicker 시작 -------------------------------- */
  .daterange, .singledaterange, .singledateminuterange, .datepicker, .dateminutepicker, .datesecondpicker {
    border: 1px solid #ced4da;
    background-color: #f8fcff;
    border-radius: 0.3rem;
    padding: 0.375rem 0.2rem;
    text-align: center;
    font-family: 'Pretendard';
    max-width: 13rem;
    cursor: pointer;
  }

  .daterangepicker {
    box-shadow: 0 3px 10px rgba(0,0,0,0.5);
  }

  .datepicker {
    padding: 0.375rem 0.2rem;
    max-width: 7rem;
  }

  .dateminutepicker {
    padding: 0.375rem 0.2rem;
    max-width: 9.1rem;
  }

  .singledateminuterange {
    padding: 0.375rem 0.2rem;
    width: 16rem;
    max-width: 16rem;
  }

  .daterangepicker .ranges li {
    font-size: 0.9rem !important;
    font-family: 'Pretendard';
  }  

  .daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
    font-family: 'Pretendard';
    font-size: 0.9rem !important;
  } 

  .daterangepicker .drp-buttons .btn {
    font-family: 'Pretendard';
    font-size: 0.9rem !important;
  } 

  .daterangepicker .drp-selected {
    font-family: 'Pretendard';
    font-size: 0.9rem !important;
  } 

/* daterangepicker 끝 -------------------------------- */

/*bootstrap input spinner*/
.input-spinner~ .input-group { background-color: #e8f2ff; height: 1.75rem; align-items: center; border-radius: 35px; }
.input-spinner~ .input-group button { color: #555; padding: 0; margin-top: -6px; min-width: 1.5rem !important; border: none; }
.input-spinner~ .input-group input { background-color: transparent; font-size: 0.9rem; height: 20px; margin-top: -2px; width: 20px; border: none; padding: 0; }

/* bootstrap 시작 */
.btn-outline-secondary {
  border-color: #ced4da;
}

/* slider 시작 */
.nouislider.noUi-target { border: none; box-shadow: none; background: transparent; }
.nouislider .noUi-horizontal .noUi-handle { height: 22px ; width: 22px ; }
.nouislider .noUi-handle { width: 20px; height: 20px; border-radius: 50%; cursor: pointer;  box-shadow: none; }
.nouislider .noUi-handle:hover { background: #ccddee; }
.nouislider .noUi-handle:after, .noUi-handle:before { font-size: 8px; color: #3d5394; left: 5px; top: 3px; 
                                                      font-family: "bootstrap-icons"; content: "\f287"; height: 0; width: 0; background: none; }
.nouislider .noUi-horizontal { height: 10px; }
.nouislider .noUi-target { border: none; }
.nouislider .noUi-connects { height: 8px; background: transparent; border-radius: 10px; }
.nouislider .noUi-connect:nth-child(2) { background: #42a5f5; } 
.nouislider .noUi-connect:nth-child(3) { background: #66bb6a; } 
.nouislider .noUi-connect:nth-child(4) { background: #ffa726; } 
/* slider 끝 */

/* 파일첨부 시작 */
.file-input .btn-file {
  display: flex;
  width: 90px;
  height: 34px;
  text-align: center;
/*  font-size: 0.9rem;*/
/*  font-weight: 600;*/
  background: white;
  color: #666;
  border-color: #CCC;
  cursor: pointer;
  text-transform: uppercase;
  transition: all 0.4s;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border-radius: 5px;
}  

.file-input .btn-file:hover {
  background-color: #EEE;
}

.file-input .file-caption {
  background-color: transparent;
  width: auto;
  box-sizing: border-box;
  padding: 5px 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  height: 100%;
  align-items: center;
  font-size: 0.9rem;
  color: #DDD;
  font-weight: 500;
  display: flex;
  border-radius: 4px;
  border: 1px solid #cfd0d0;    
}

.file-input .fileinput-remove-button {
  display: none;
}
/* 파일첨부 끝 */

/* summernote 시작 */
.note-btn.btn-fullscreen.note-codeview-keep { display: none; }
.note-modal-footer { display: none; }
.note-editor.note-frame .note-icon-caret:before { display: none!important; }
/* summernote 끝 */

/* captcha begin */
#captcha canvas, #captcha .sliderbg {
  border-radius: 5px;
}
/* captcha end */

/*modal shake 시작 */
@keyframes pulse-scale {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.005); }
  60%  { transform: scale(0.995); }
  100% { transform: scale(1); }
}

.scale-pulse {
  animation: pulse-scale 0.4s ease-in-out;
}
/*modal shake 끝 */

.new-icon:after {
  content:"NEW";
  color: white;
  font-weight: bold;
  font-size: 0.5rem;
  padding: 01px 4px;
  margin-left: 3px;
  background-color: red;
  border-radius: 3px;
}

/* border radius 시작 */
.br-1  { border-radius: .1rem;  }
.br-2  { border-radius: .2rem;  }
.br-3  { border-radius: .3rem;  }
.br-4  { border-radius: .4rem;  }
.br-5  { border-radius: .5rem;  }
.br-6  { border-radius: .6rem;  }
.br-7  { border-radius: .7rem;  }
.br-8  { border-radius: .8rem;  }
.br-9  { border-radius: .9rem;  }
.br-10 { border-radius: 1.0rem; }
.br-11 { border-radius: 1.1rem; }
.br-12 { border-radius: 1.2rem; }
.br-13 { border-radius: 1.3rem; }
.br-14 { border-radius: 1.4rem; }
.br-15 { border-radius: 1.5rem; }
/* border radius 끝 */


/* font size begin */
.fs-02 { font-size: 0.2rem; }
.fs-03 { font-size: 0.3rem; }
.fs-04 { font-size: 0.4rem; }
.fs-05 { font-size: 0.5rem; }
.fs-06 { font-size: 0.6rem; }
.fs-07 { font-size: 0.7rem; }
.fs-08 { font-size: 0.8rem; }
.fs-09 { font-size: 0.9rem; }
.fs-10 { font-size: 1rem;   }
.fs-11 { font-size: 1.1rem; }
.fs-12 { font-size: 1.2rem; }
.fs-13 { font-size: 1.3rem; }
.fs-14 { font-size: 1.4rem; }
.fs-15 { font-size: 1.5rem; }
.fs-16 { font-size: 1.6rem; }
.fs-17 { font-size: 1.7rem; }
.fs-18 { font-size: 1.8rem; }
.fs-19 { font-size: 1.9rem; }
.fs-20 { font-size: 2.0rem; }
.fs-21 { font-size: 2.1rem; }
.fs-22 { font-size: 2.2rem; }
.fs-23 { font-size: 2.3rem; }
.fs-24 { font-size: 2.4rem; }
.fs-25 { font-size: 2.5rem; }
.fs-26 { font-size: 2.6rem; }
.fs-27 { font-size: 2.7rem; }
.fs-28 { font-size: 2.8rem; }
.fs-29 { font-size: 2.9rem; }
.fs-30 { font-size: 3.0rem; }
.fs-31 { font-size: 3.1rem; }
.fs-32 { font-size: 3.2rem; }
.fs-33 { font-size: 3.3rem; }
.fs-34 { font-size: 3.4rem; }
.fs-35 { font-size: 3.5rem; }
.fs-36 { font-size: 3.6rem; }
.fs-37 { font-size: 3.7rem; }
.fs-38 { font-size: 3.8rem; }
.fs-39 { font-size: 3.9rem; }
.fs-40 { font-size: 4.0rem; }
.fs-41 { font-size: 4.1rem; }
.fs-42 { font-size: 4.2rem; }
.fs-43 { font-size: 4.3rem; }
.fs-44 { font-size: 4.4rem; }
.fs-45 { font-size: 4.5rem; }
.fs-46 { font-size: 4.6rem; }
.fs-47 { font-size: 4.7rem; }
.fs-48 { font-size: 4.8rem; }
.fs-49 { font-size: 4.9rem; }
.fs-50 { font-size: 5.0rem; }
.fs-51 { font-size: 5.1rem; }
.fs-52 { font-size: 5.2rem; }
.fs-53 { font-size: 5.3rem; }
.fs-54 { font-size: 5.4rem; }
.fs-55 { font-size: 5.5rem; }
.fs-56 { font-size: 5.6rem; }
.fs-57 { font-size: 5.7rem; }
.fs-58 { font-size: 5.8rem; }
.fs-59 { font-size: 5.9rem; }
.fs-60 { font-size: 6.0rem; }
.fs-61 { font-size: 6.1rem; }
.fs-62 { font-size: 6.2rem; }
.fs-63 { font-size: 6.3rem; }
.fs-64 { font-size: 6.4rem; }
.fs-65 { font-size: 6.5rem; }
.fs-66 { font-size: 6.6rem; }
.fs-67 { font-size: 6.7rem; }
.fs-68 { font-size: 6.8rem; }
.fs-69 { font-size: 6.9rem; }
.fs-70 { font-size: 7.0rem; }
.fs-71 { font-size: 7.1rem; }
.fs-72 { font-size: 7.2rem; }
.fs-73 { font-size: 7.3rem; }
.fs-74 { font-size: 7.4rem; }
.fs-75 { font-size: 7.5rem; }
.fs-76 { font-size: 7.6rem; }
.fs-77 { font-size: 7.7rem; }
.fs-78 { font-size: 7.8rem; }
.fs-79 { font-size: 7.9rem; }
.fs-80 { font-size: 8.0rem; }
.fs-81 { font-size: 8.1rem; }
.fs-82 { font-size: 8.2rem; }
.fs-83 { font-size: 8.3rem; }
.fs-84 { font-size: 8.4rem; }
.fs-85 { font-size: 8.5rem; }
.fs-86 { font-size: 8.6rem; }
.fs-87 { font-size: 8.7rem; }
.fs-88 { font-size: 8.8rem; }
.fs-89 { font-size: 8.9rem; }
.fs-90 { font-size: 9.0rem; }
.fs-91 { font-size: 9.1rem; }
.fs-92 { font-size: 9.2rem; }
.fs-93 { font-size: 9.3rem; }
.fs-94 { font-size: 9.4rem; }
.fs-95 { font-size: 9.5rem; }
.fs-96 { font-size: 9.6rem; }
.fs-97 { font-size: 9.7rem; }
.fs-98 { font-size: 9.8rem; }
.fs-99 { font-size: 9.9rem; }
/* font size end */

.text-black {
  color: #191919 !important;
}
.text-gray {
  color: #959595 !important;
}
.text-darkgray {
  color: #6C6C6C !important;
}
.text-lightgray {
  color: lightgray !important;
}

.bg-sky {
  background-color: #eef2fd !important;
}