@charset "utf-8";

/* ============================================================
 * scroll-jump : 스크롤바 트랙 클릭 시 해당 위치로 즉시 이동
 * - 네이티브 스크롤바를 감추고 같은 자리에 커스텀 스크롤바를 그린다.
 * - 폭/위치는 scroll-jump.js 가 인라인 스타일로 지정한다.
 * ============================================================ */

/* 커스텀 스크롤바가 적용된 스크롤 영역 (네이티브 스크롤바 감춤)
 * 개별 화면에서 지정한 scrollbar-width(예: .cont-area.cont-auto {scrollbar-width:thin})가
 * 선택자 우선순위상 더 강해 네이티브 스크롤바가 남는 문제가 있어 !important 로 강제한다.
 * (크롬은 scrollbar-width 가 auto 가 아니면 ::-webkit-scrollbar 규칙을 무시한다) */
.sj-host {scrollbar-width:none!important; -ms-overflow-style:none!important;}
.sj-host::-webkit-scrollbar {display:none!important; width:0!important; height:0!important;}

/* 커스텀 스크롤바 */
.sj-bar {display:none; position:absolute; z-index:10; touch-action:none; -webkit-user-select:none; -ms-user-select:none; user-select:none;}
.sj-bar.is-active {display:block;}
.sj-bar .sj-track {position:absolute; top:0; right:0; bottom:0; border-radius:10px; background:rgba(0, 0, 0, 0.05);}
.sj-bar .sj-thumb {position:absolute; top:0; right:0; border-radius:10px; background:rgba(0, 0, 0, 0.25);}
.sj-bar:hover .sj-thumb {background:rgba(0, 0, 0, 0.4);}
.sj-bar.is-dragging .sj-thumb {background:rgba(0, 0, 0, 0.5);}

/* 드래그 중 본문 텍스트가 선택되지 않도록 */
body.sj-dragging {-webkit-user-select:none; -ms-user-select:none; user-select:none;}

@media print {
	.sj-bar {display:none!important;}
}