#ol_svc a {
  color: var(--bs-gray-700);
  text-decoration: none;
}

#ol_svc span {
  font-size: 0.6rem;
  color: var(--bs-gray-500);
  padding: 0 0.25rem;
}

#ol_after a {
  text-decoration: none;
}

#ol_after .profile_img img {
  border-radius: 0.25rem;
  height: 22px;
}

#ol_after_hd {
  line-height: 38px;
}

#ol_after_private {
  list-style: none;
  margin: 0;
  padding: 0.5rem;
}

#ol_after_private li {
  padding: 0.25rem;
}

#ol_after_private li i {
  width: 0.938rem;
  text-align: center;
}

#ol_after_private li a {
  color: var(--bs-gray-700);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.offcanvas {
  width: 320px; /* 기본 PC 기준 최소 폭 */
}

/* 아주 작은 모바일 (<= 360px) */
@media (max-width: 360px) {
  .offcanvas {
    width: 85vw; /* 화면의 85% */
  }
}

/* 모바일 일반 (361px ~ 576px) */
@media (min-width: 361px) and (max-width: 576px) {
  .offcanvas {
    width: 80vw; /* 화면의 80% */
  }
}

/* 모바일 와이드 & 폴드 펼침 (577px ~ 768px) */
@media (min-width: 577px) and (max-width: 768px) {
  .offcanvas {
    width: 40vw; /* 화면의 40% */
    max-width: 360px;
  }
}

/* 태블릿 (769px ~ 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  .offcanvas {
    width: 40vw; /* 화면의 40% */
    max-width: 380px;
  }
}

/* PC (>= 1025px) */
@media (min-width: 1025px) {
  .offcanvas {
    width: 340px; /* 고정 */
  }
}

.list-group .bi-chat-square-text {
  opacity: 0.7;
}
.list-group a:hover {
  background: rgba(255, 255, 255, 0.08);
}

.accordion-button:focus {
  border-color: #fcfcfcff !important;
  box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5) !important;
}
.accordion-button:not(.collapsed) {
  border-color: #fcfcfcff !important;
}
.accordion-button::after {
  display: none !important;
}
.accordion-collapse {
  overflow: visible !important;
}

.accordion-body {
  overflow: visible !important;
}

/* 아코디언 패널 열고/닫힐 때 겹침 방지 */
.accordion-collapse {
  overflow: hidden !important;
  transition: height 0.28s ease-in-out !important;
}

/* 아코디언 헤더 디자인 개선 */
.accordion-button {
  background: #2c2c2c;
  color: #fff;
  padding: 12px 18px;
  font-size: 15px;
  border: none;
  box-shadow: none !important;
}

.accordion-button:not(.collapsed) {
  background: #1f1f1f;
  color: #ffd66b;
}

/* hover 효과 */
.accordion-button:hover {
  background: #383838;
}

/* 내부 리스트 디자인 */
.accordion-body ul li {
  border-bottom: 1px solid #3e3e3e;
  transition: background 0.2s;
}

.accordion-body ul li:hover {
  background: rgba(255, 255, 255, 0.06);
}
