.table-wrap,
.article-section-table-scroll {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-color: #8f9ca2 #dfe8ec;
  scrollbar-width: thin;
  cursor: grab;
}

.table-wrap::-webkit-scrollbar,
.article-section-table-scroll::-webkit-scrollbar {
  display: block;
  height: 14px;
}

.table-wrap::-webkit-scrollbar-track,
.article-section-table-scroll::-webkit-scrollbar-track {
  background: #dfe8ec;
  border-radius: 999px;
}

.table-wrap::-webkit-scrollbar-thumb,
.article-section-table-scroll::-webkit-scrollbar-thumb {
  background: #8f9ca2;
  border: 3px solid #dfe8ec;
  border-radius: 999px;
}

.table-wrap::-webkit-scrollbar-thumb:hover,
.article-section-table-scroll::-webkit-scrollbar-thumb:hover {
  background: #6f7d84;
}

.table-wrap:focus-visible,
.article-section-table-scroll:focus-visible {
  outline: 3px solid rgba(7, 136, 198, 0.22);
  outline-offset: 3px;
}

.table-wrap.is-dragging,
.article-section-table-scroll.is-dragging {
  cursor: grabbing;
  user-select: none;
}

.table-wrap.is-wide-table table,
.article-section-table-scroll.is-wide-table table {
  width: max-content;
  max-width: none;
  min-width: 100%;
}

.table-wrap.is-wide-table th,
.table-wrap.is-wide-table td,
.article-section-table-scroll.is-wide-table th,
.article-section-table-scroll.is-wide-table td {
  min-width: 140px;
}

@media (max-width: 640px) {
  .table-wrap::-webkit-scrollbar,
  .article-section-table-scroll::-webkit-scrollbar {
    height: 12px;
  }

  .table-wrap.is-wide-table th,
  .table-wrap.is-wide-table td,
  .article-section-table-scroll.is-wide-table th,
  .article-section-table-scroll.is-wide-table td {
    min-width: 128px;
  }
}
