::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}
::-webkit-scrollbar-thumb {
    background-color: #414a58;;
    border-radius: 10px;
    background-clip: padding-box;
    border: 1px solid transparent;
}
::-webkit-scrollbar-thumb:hover {
    background: #525965;
}
::-webkit-scrollbar-thumb:active {
    background: #313842;
}
::-webkit-scrollbar-track {
    background-color: rgba(255, 255, 255, 0);
    border-radius: 10px;
}
::-webkit-scrollbar-track:hover {
    background-color: #e7e7e7;
}
::-webkit-scrollbar-track:active {
    background-color: #e7e7e7;
}
::-webkit-scrollbar-corner {
    background: transparent;
}

/* 외부 스크롤바 기본 상태는 투명 */
.external-scrollbar {
    position: fixed;
    top: 0;
    right: 0;
    width: 7px;
    height: 100vh;
    z-index: 9999;
    background-color: rgba(255, 255, 255, 0); /* track 투명 */
    border-radius: 10px;
    pointer-events: none;
}

.external-scrollbar-thumb {
    pointer-events: auto;
    width: 100%;
    position: absolute;
    top: 0;
    height: 100px;
    background-color: #414a58;
    border-radius: 10px;
    background-clip: padding-box;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background 0.2s ease;
}

/* hover 상태 */
.external-scrollbar-thumb:hover {
    background-color: #525965;
}

/* 클릭 상태 */
.external-scrollbar-thumb:active {
    background-color: #313842;
}

/* 트랙 hover/active 상태 */
.external-scrollbar:hover {
    background-color: #e7e7e7;
}
.external-scrollbar:active {
    background-color: #e7e7e7;
}

/* thumb 기본 상태 */
.simplebar-scrollbar:before {
    position: absolute;
    content: "";
    background: #000;
    border-radius: 7px;
    left: 2px;
    right: 2px;
    opacity: 0;
    transition: opacity .2s linear;
}

/* track 기본 상태 */
[data-simplebar=init] .simplebar-track:before {
    content: "";
    top: 2px;
    bottom: 2px;
    left: 2px;
    right: 2px;
    position: absolute;
    background: #e9e9e9;
    opacity: 0 !important;
    border-radius: 7px;
}

/* 마우스가 스크롤 가능한 영역에 올라왔을 때 강제로 보이게 */
[data-simplebar=init]:hover>.simplebar-track>.simplebar-scrollbar:before {
    opacity: 1 !important;
}

[data-simplebar=init] .simplebar-scrollbar:before {
    background: #9e9e9e;
}

/* thumb hover */
[data-simplebar=init] .simplebar-track.simplebar-hover .simplebar-scrollbar.simplebar-hover:before,
[data-simplebar=init] .simplebar-trackhover .simplebar-scrollbar.simplebar-hover:before {
    opacity: 1 !important;
    background: #616161 !important;
}

/* track hover */
[data-simplebar=init] .simplebar-track.simplebar-hover:before, [data-simplebar=init] .simplebar-track:hover:before {
    opacity: 1 !important;
}

/* active */
[data-simplebar=init].simplebar-dragging .simplebar-track:before {
    opacity: 1 !important;
}

[data-simplebar=init].simplebar-dragging .simplebar-track .simplebar-scrollbar.simplebar-visible:before {
    opacity: 1 !important;
    background: #616161 !important;
}

/*  select2 에서 min 설정 제외 */
/*.select2-results__options .simplebar-scrollbar {*/
/*    min-height: 4px !important;*/
/*}*/

/*.select2-results__options .simplebar-track.simplebar-horizontal .simplebar-scrollbar {*/
/*    min-width: 4px !important;*/
/*}*/