スクロールバー表示の調査

function scrollbarXVisible(element) {
  return element.scrollHeight > element.clientHeight;
}
// or
function scrollbarYVisible(element) {
  return element.scrollWidth > element.clientWidth;
}

let table = document.querySelectorAll('.table_scroll .table_main');
if(table[0]){
  let clientWidth = table[0].clientWidth;
  let offsetWidth = table[0].offsetWidth;
  let scrollbarWidth = offsetWidth - clientWidth;
  console.log(scrollbarWidth);
}

.sample {
  -ms-overflow-style: none; /* IE, Edge 対応 */
  scrollbar-width: none;    /* Firefox 対応 */
}

.smaple::-webkit-scrollbar {
  display: none; /* Chrome, Safari 対応 */
}

/* スクロールバー（幅）	対象要素 */
scrollbar-width: thin;

/* スクロールバー軌道（色）	対象要素 */
scrollbar-color: thumb track;

/* 移動タブ（色）	対象要素 */
scrollbar-color: thumb track;

/* Firefox 以外に対応 */
  *::-webkit-scrollbar {
    /* スクロールバー全体のstyle: width, height はここでしかできなそう */
    width: 32px; // y
    height: 32px; // x
    background: red;
  }

  ::-webkit-scrollbar-track {
    /* スクロールバーの背景 */
    width: 24px; // 効かない
    height: 24px; // 効かない
    background: yellow;
    border-radius: 8px;
  }

  ::-webkit-scrollbar-thumb {
    /* スクロールバーのスクロールして動かす部分 */
    width: 20px; // 効かない
    height: 20px; // 効かない
    background: blue;
    border-radius: 50px;
  }