* {
		font-family: "Pretendard Variable", Pretendard, -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;
	}
	/* 트리 컨테이너 스타일 */
	.dynatree-container {
	  background-color: #f5f5f5;
	  border-radius: 4px;
	  padding: 10px;
	}
	
	/* 트리 노드 스타일 */
	.dynatree-container li {
	  padding: 5px;
	}
	
	/* 폴더 아이콘 스타일 */
	.dynatree-icon {
	  background-image: url("/images/folder.png")!important;
	  background-repeat: no-repeat!important;
	  background-position: center!important;
	  width: 16px;
	  height: 16px;
	}
	
	/* 파일 아이콘 스타일 */
	.dynatree-ico-file {
	  background-image: url("file-icon.png");
	  background-repeat: no-repeat;
	  background-position: center;
	  width: 16px;
	  height: 16px;
	}
	.select option {
	  background: black;
	  color: #fff;
	  padding: 3px 0;
	}
	
	    .rating {
	  display: flex;
	  flex-direction: row-reverse;
	  justify-content: left;
	}
	
	.rating > input{ display:none;}
	
	.rating > label {
	  position: relative;
	    width: 1em;
	    font-size: 20px;
	    color: #FFD600;
	    cursor: pointer;
	}
	.rating > label::before{ 
	  content: "\2605";
	  position: absolute;
	  opacity: 0;
	}
	.rating > label:hover:before,
	.rating > label:hover ~ label:before {
	  opacity: 1 !important;
	}
	
	.rating > input:checked ~ label:before{
	  opacity:1;
	}
  .rating:hover > input:checked ~ label:before {
    opacity: 1;
  }
    .newPost{
  	margin-bottom: 30px!important;
  }
.replyTitle {
	font-size: 14px; height:30px; border-bottom:1px solid #E1E1DF;
}
.replyBody {
	font-size: 14px; margin-top:5px;
}
.boardReadBtn {
	display: flex; 
	align-items: center; 
	margin-right: 3px;
}
.formTitle{
	line-height: 33px;
	font-weight: 600;
}
.signAreaCenter{
	background-color: white;
}
.signAreaBottom{
	background-color: white;
}
.signTitle{
	background-color: white;
}
  .status th{
  	width: 100px;
  }
  .status td{
  	width: 300px;
  }
  .timeline-xs{
  	line-height: 25px;
  }
  .boardTitle {
  font-size: 30px;
    line-height: 88px;
  }
  .timeline-xs {
  	border-left: 3px solid #007aff;
  }
  .stepDesc{
  	font-weight: 500;
  }
  .signAreaTop{
  	background-color: #8C8C8C;
  	color: #F8F8F8;
  }
  .swMain ul{
  	background: none!important;
  }
  @media (max-width: 990px) {
  .modal-backdrop {
    display: none!important;
  }
}

.sk-cube-grid {
  width: 40px;
  height: 40px;
  margin: 100px auto;
}
#loading-overlay {
  z-index: 9998;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sk-cube-grid .sk-cube {
  z-index: 9999;
  width: 33%;
  height: 33%;
  background-color: white;
  float: left;
  -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
          animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; 
}
.sk-cube-grid .sk-cube1 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube2 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube3 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s; }
.sk-cube-grid .sk-cube4 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube5 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube6 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube7 {
  -webkit-animation-delay: 0s;
          animation-delay: 0s; }
.sk-cube-grid .sk-cube8 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube9 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }

@-webkit-keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1); 
  }
}

@keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1);
  } 
}

    @media(min-width: 768px) {
        .onlymobile {
        	display: none;
        }
    }
    /* 모바일에만 적용되는 스타일 */
    @media(max-width: 767px) {
        .onlypc {
        	display: none;
        }
        #myTab1 {
        	overflow-x: auto;
        	overflow-y: hidden;
   		 white-space: nowrap;
   		 display: flex;
        }
    }

/* ========================================
   사이드바 네비게이션 섹션 구분 스타일
   ======================================== */

/* 섹션 라벨 기본 스타일 */
.navbar-vertical-label {
  background-color: #e9edf1;
  font-size: 0.9rem !important;
  padding: 0.6rem 1rem !important;
  color: #2c3e50 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  transition: all 0.3s ease;
}

/* 섹션 구분선 스타일 개선 */
.navbar-vertical-line {
  position: relative;
  margin: 0.5rem 1.5rem 1rem 1.5rem !important;
  height: 0 !important;
  border: 0 !important;
  border-top: 2px solid rgba(222, 226, 230, 0.4) !important;
  background: linear-gradient(90deg, rgba(222, 226, 230, 0.6) 0%, rgba(222, 226, 230, 0.2) 50%, transparent 100%);
}

/* 구분선 장식 효과 */
.navbar-vertical-line::after {
  content: '';
  position: absolute;
  left: 0;
  top: -1px;
  width: 40px;
  height: 2px;
  background: linear-gradient(90deg, var(--phoenix-primary, #4A90E2) 0%, transparent 100%);
}

/* 호버 효과 */
.navbar-vertical-label:hover {
  background-color: #dce2e9;
  transform: translateX(2px);
  color: #1a252f !important;
}


/* 접힌 사이드바 상태에서 라벨 숨김 처리 */
.navbar-vertical-collapsed .navbar-vertical-label {
  opacity: 0;
  width: 0;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden;
}

.navbar-vertical-collapsed .navbar-vertical-line {
  margin: 0.25rem 0.5rem !important;
}

/* 기안하기 버튼 컨테이너 (최상단 고정) */
.sidebar-top-button {
  padding: 0.75rem !important;
}

/* 사이드바 접힘 상태에서 기안하기 버튼 */
.navbar-vertical-collapsed .sidebar-top-button {
  padding: 0.5rem !important;
}

.navbar-vertical-collapsed .sidebar-top-button .sidebar-fixed-text {
  display: none !important;
}

.navbar-vertical-collapsed .sidebar-top-button .btn-sidebar-fixed {
  justify-content: center !important;
  padding: 0.625rem !important;
}

/* nav-item-wrapper 전체를 relative로 설정 */
.nav-item-wrapper {
  position: relative !important;
}

/* 문서함 카운트 스타일 - 절대 위치로 우측 끝 고정 */
.nav-doc-count {
  position: absolute !important;
  right: 2rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #1976d2 !important;  /* 파란색 */
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  min-width: 1.5rem !important;
  text-align: right !important;
  background: none !important;
  border: none !important;
  z-index: 1 !important;
}

/* 카운트가 있는 경우 텍스트가 겹치지 않도록 padding 추가 */
.nav-link-text-wrapper:has(.nav-doc-count) .nav-link-text {
  padding-right: 3rem !important;
}

/* 하위 메뉴 아이템 relative 설정 */
.parent-wrapper .nav-item {
  position: relative !important;
}

.parent-wrapper .nav-link {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  position: relative !important;
}

/* 하위 메뉴의 카운트도 절대 위치로 우측 끝 고정 */
.parent-wrapper .nav-doc-count {
  position: absolute !important;
  right: 1rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #1976d2 !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  min-width: 1.5rem !important;
  text-align: right !important;
  background: none !important;
  border: none !important;
  margin-left: 0 !important;
}

/* 하위 메뉴에서 카운트가 있는 텍스트에 padding 추가 */
.parent-wrapper .nav-link:has(.nav-doc-count) .nav-link-text {
  padding-right: 3rem !important;
}

/* 호버 시 카운트 강조 */
.nav-link:hover .nav-doc-count {
  color: #1565c0 !important;
  font-weight: 700 !important;
}

/* 활성 상태에서 카운트 색상 */
.nav-link.active .nav-doc-count {
  color: #0d47a1 !important;
}

/* 사이드바 접힘 상태에서 카운트 숨김 */
.navbar-vertical-collapsed .nav-doc-count {
  display: none !important;
}