CSS Scroll bar 커스텀

.box-cart::-webkit-scrollbar {
    width: 11px; /* 스크롤바의 너비 */
}

.box-cart::-webkit-scrollbar-thumb {
    height: 75%; /* 스크롤바의 길이 */
    background: white; /* 스크롤바의 색상 */
    background-clip: padding-box;
    border: 4px solid #eae8fe;
    border-radius: 50px;
}

.box-cart::-webkit-scrollbar-track {
    background: #eae8fe; /*스크롤바 뒷 배경 색상*/
}

스크롤바에는 따로 마진, 패딩을 줄 수 없다.
그래서 -webkit-scrollbar-thumb 안에 background-clip:padding box를 준 후, 보더값을 통해 공간이 생긴 것 처럼 연출할 수 있다.