.compare-row th {
  --color-background: 247, 247, 247; }

.compare-table-wrapper {
  overflow: hidden;
  overflow-x: auto;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  scrollbar-width: thin; }

.compare-table thead th {
  padding: 0; }

.compare-row:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

.compare-row th {
  min-width: 230px;
  padding: 24px 10px;
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  top: 0;
  z-index: 2;
  background: rgba(var(--color-background), 1);
  text-align: center; }

.compare-row td {
  min-width: 250px;
  padding: 24px 10px;
  z-index: 1;
  max-width: calc((100% - 230px) / 4);
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  text-align: center; }

.compare-row .color-lists {
  margin: 0;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }

.compare-row .card-cart-button {
  width: 100%; }

@media (max-width: 991px) {
  .compare-row th {
    min-width: 160px; }
  .compare-row td {
    min-width: 215px;
    padding: 20px 10px; } }

@media (max-width: 575px) {
  .compare-row th {
    min-width: 110px; }
  .compare-row td {
    min-width: 210px;
    padding: 16px 5px; }
  .compare-row .card-title-link {
    font-size: 20px; }
  .compare-row th {
    font-size: 17px; }
  .compare-row .text_16 {
    font-size: 14px; }
  .compare-row .button {
    min-width: 170px;
    height: 48px; } }