@charset "utf-8";

/* 버튼 */
.button {display: inline-flex; align-items: center; justify-content: center; }
.button--primary {background-color: var(--Primary); border-color: var(--Primary); color: #fff;}
.button--secondary {background-color: #fff; border-color: #dee5ee; color: var(--Gray_80);}
.button--secondary:hover, .button--secondary:focus, .button--secondary:active {border-color: var(--Primary); color: var(--Primary);}
.button--icon {width: 5.6rem; min-width: 5.6rem; padding: 0;}
.button--small {min-height: 3.4rem; padding: 0 1.4rem; font-size: 1.4rem;}
.button.is-disabled, .button:disabled {background-color: #e5e5e5; border-color: #e5e5e5; color: #8a8a8a;}


/* 버튼 반응형 - 모바일 */
@media (max-width: 768px) {
  .button {min-height: 4.4rem; padding: 0 1.8rem; font-size: 1.5rem;}
}


/* 폼 */
.form-input {width: 100%; height: 5.6rem; padding: 0 2rem; border: 1px solid #d8e1ea; border-radius: var(--Radius_Pill); background-color: #fff; color: var(--Gray_100);}
.form-input::placeholder {color: #777;}

/* 배지 */
.badge {display: inline-flex; align-items: center; justify-content: center; min-width: 4.8rem; min-height: 3.9rem; padding: .6rem 1rem; border-radius: var(--Radius_M); color: #fff; font-size: 1.4rem; font-weight: 700; line-height: 1;}
.badge--region {background-color: #8DC63F}
.badge--notice {background-color: var(--Primary);}
.badge--schedule {background-color: var(--Success);}
.badge--info {background-color: var(--Secondary);}

@media screen and (max-width:768px) {
  .badge{min-height: 3rem;}
}

/* 섹션 리스트 + 버튼*/
.section--list{position: relative;}
.section--list .list-more{position: absolute;right: 0;top: 0;}


/* 카드 */
.card-link {display: block; color: inherit;}
.card-link:hover, .card-link:focus, .card-link:active {text-decoration: none;}
.card-link:focus-visible {outline-offset: 5px;}

/* 모달 */
.modal {display: none; position: fixed; inset: 0; z-index: 1000; align-items: center; justify-content: center; padding: 3rem; background-color: rgba(0,0,0,.55);}
.modal.is-open {display: flex;}
.modal__dialog {width: min(86rem, 100%); max-height: 88vh; overflow: hidden; border-radius: var(--Radius_M); background-color: #fff; box-shadow: 0 1.6rem 5rem rgba(0,0,0,.25);}
.modal__header {display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2rem 2.4rem; border-bottom: 1px solid #e5e7eb;}
.modal__title {font-size: 2rem; font-weight: 800;}
.modal__close {display: inline-flex; flex: 0 0 4rem; align-items: center; justify-content: center; width: 4rem; height: 4rem; padding: 0; border-radius: 50%; font-size: 2.4rem; line-height: 1; text-align: center;}
.modal__close:hover, .modal__close:focus, .modal__close:active {background-color: #f2f4f7;}
.modal__body {max-height: calc(88vh - 8.1rem); overflow-y: auto; padding: 2.4rem;}

/* 모달 반응형 - 모바일 */
@media (max-width: 768px) {
  .modal {padding: 1.6rem;}
  .modal__header {padding: 1.6rem 2rem;}
  .modal__body {padding: 2rem;}
}

/* 커스텀 테마 */
/* 트랙 */
.os-theme-custom.os-scrollbar .os-scrollbar-track {
  background: #D9D9D9;
  border-radius: 30px;
}

/* 핸들 */
.os-theme-custom.os-scrollbar .os-scrollbar-handle {
  background: #FBB03F;
  border-radius: 30px;
}
.os-theme-custom.os-scrollbar .os-scrollbar-handle:hover  { background: #e89e2e; }
.os-theme-custom.os-scrollbar .os-scrollbar-handle:active { background: #d4821a; }

/* 너비 */
.os-theme-custom.os-scrollbar-vertical { width: 8px;  }

/* auto-hide 강제 무력화 */
.os-theme-custom.os-scrollbar-auto-hide { opacity: 1 !important; visibility: visible !important; }