@charset "UTF-8";
.bag-row {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  margin-left: -15px;
  margin-right: -15px;
  --grid-gap: 30px;
}
.bag-row.no-gutters {
  margin-left: 0;
  margin-right: 0;
}
.bag-row.no-gutters > .bag, .bag-row.no-gutters > [class*=bag-] {
  margin-left: 0;
  margin-right: 0;
  --grid-gap: 0px;
}

.bag-xl_1700-12, .bag-xl_1700-11, .bag-xl_1700-10, .bag-xl_1700-9, .bag-xl_1700-8, .bag-xl_1700-7, .bag-xl_1700-6, .bag-xl_1700-5, .bag-xl_1700-4, .bag-xl_1700-3, .bag-xl_1700-2, .bag-xl_1700-1, .bag-xl_1700-auto, .bag-xl_1700, .bag-xl_1600-12, .bag-xl_1600-11, .bag-xl_1600-10, .bag-xl_1600-9, .bag-xl_1600-8, .bag-xl_1600-7, .bag-xl_1600-6, .bag-xl_1600-5, .bag-xl_1600-4, .bag-xl_1600-3, .bag-xl_1600-2, .bag-xl_1600-1, .bag-xl_1600-auto, .bag-xl_1600, .bag-xl_1440-12, .bag-xl_1440-11, .bag-xl_1440-10, .bag-xl_1440-9, .bag-xl_1440-8, .bag-xl_1440-7, .bag-xl_1440-6, .bag-xl_1440-5, .bag-xl_1440-4, .bag-xl_1440-3, .bag-xl_1440-2, .bag-xl_1440-1, .bag-xl_1440-auto, .bag-xl_1440, .bag-xl_1366-12, .bag-xl_1366-11, .bag-xl_1366-10, .bag-xl_1366-9, .bag-xl_1366-8, .bag-xl_1366-7, .bag-xl_1366-6, .bag-xl_1366-5, .bag-xl_1366-4, .bag-xl_1366-3, .bag-xl_1366-2, .bag-xl_1366-1, .bag-xl_1366-auto, .bag-xl_1366, .bag-xl_1200-12, .bag-xl_1200-11, .bag-xl_1200-10, .bag-xl_1200-9, .bag-xl_1200-8, .bag-xl_1200-7, .bag-xl_1200-6, .bag-xl_1200-5, .bag-xl_1200-4, .bag-xl_1200-3, .bag-xl_1200-2, .bag-xl_1200-1, .bag-xl_1200-auto, .bag-xl_1200, .bag-lg_1024-12, .bag-lg_1024-11, .bag-lg_1024-10, .bag-lg_1024-9, .bag-lg_1024-8, .bag-lg_1024-7, .bag-lg_1024-6, .bag-lg_1024-5, .bag-lg_1024-4, .bag-lg_1024-3, .bag-lg_1024-2, .bag-lg_1024-1, .bag-lg_1024-auto, .bag-lg_1024, .bag-lg_992-12, .bag-lg_992-11, .bag-lg_992-10, .bag-lg_992-9, .bag-lg_992-8, .bag-lg_992-7, .bag-lg_992-6, .bag-lg_992-5, .bag-lg_992-4, .bag-lg_992-3, .bag-lg_992-2, .bag-lg_992-1, .bag-lg_992-auto, .bag-lg_992, .bag-lg_991-12, .bag-lg_991-11, .bag-lg_991-10, .bag-lg_991-9, .bag-lg_991-8, .bag-lg_991-7, .bag-lg_991-6, .bag-lg_991-5, .bag-lg_991-4, .bag-lg_991-3, .bag-lg_991-2, .bag-lg_991-1, .bag-lg_991-auto, .bag-lg_991, .bag-md_849-12, .bag-md_849-11, .bag-md_849-10, .bag-md_849-9, .bag-md_849-8, .bag-md_849-7, .bag-md_849-6, .bag-md_849-5, .bag-md_849-4, .bag-md_849-3, .bag-md_849-2, .bag-md_849-1, .bag-md_849-auto, .bag-md_849, .bag-md_812-12, .bag-md_812-11, .bag-md_812-10, .bag-md_812-9, .bag-md_812-8, .bag-md_812-7, .bag-md_812-6, .bag-md_812-5, .bag-md_812-4, .bag-md_812-3, .bag-md_812-2, .bag-md_812-1, .bag-md_812-auto, .bag-md_812, .bag-md_768-12, .bag-md_768-11, .bag-md_768-10, .bag-md_768-9, .bag-md_768-8, .bag-md_768-7, .bag-md_768-6, .bag-md_768-5, .bag-md_768-4, .bag-md_768-3, .bag-md_768-2, .bag-md_768-1, .bag-md_768-auto, .bag-md_768, .bag-md_767-12, .bag-md_767-11, .bag-md_767-10, .bag-md_767-9, .bag-md_767-8, .bag-md_767-7, .bag-md_767-6, .bag-md_767-5, .bag-md_767-4, .bag-md_767-3, .bag-md_767-2, .bag-md_767-1, .bag-md_767-auto, .bag-md_767, .bag-md_667-12, .bag-md_667-11, .bag-md_667-10, .bag-md_667-9, .bag-md_667-8, .bag-md_667-7, .bag-md_667-6, .bag-md_667-5, .bag-md_667-4, .bag-md_667-3, .bag-md_667-2, .bag-md_667-1, .bag-md_667-auto, .bag-md_667, .bag-md_640-12, .bag-md_640-11, .bag-md_640-10, .bag-md_640-9, .bag-md_640-8, .bag-md_640-7, .bag-md_640-6, .bag-md_640-5, .bag-md_640-4, .bag-md_640-3, .bag-md_640-2, .bag-md_640-1, .bag-md_640-auto, .bag-md_640, .bag-sm_576-12, .bag-sm_576-11, .bag-sm_576-10, .bag-sm_576-9, .bag-sm_576-8, .bag-sm_576-7, .bag-sm_576-6, .bag-sm_576-5, .bag-sm_576-4, .bag-sm_576-3, .bag-sm_576-2, .bag-sm_576-1, .bag-sm_576-auto, .bag-sm_576, .bag-sm_480-12, .bag-sm_480-11, .bag-sm_480-10, .bag-sm_480-9, .bag-sm_480-8, .bag-sm_480-7, .bag-sm_480-6, .bag-sm_480-5, .bag-sm_480-4, .bag-sm_480-3, .bag-sm_480-2, .bag-sm_480-1, .bag-sm_480-auto, .bag-sm_480, .bag-sm_428-12, .bag-sm_428-11, .bag-sm_428-10, .bag-sm_428-9, .bag-sm_428-8, .bag-sm_428-7, .bag-sm_428-6, .bag-sm_428-5, .bag-sm_428-4, .bag-sm_428-3, .bag-sm_428-2, .bag-sm_428-1, .bag-sm_428-auto, .bag-sm_428, .bag-sm_414-12, .bag-sm_414-11, .bag-sm_414-10, .bag-sm_414-9, .bag-sm_414-8, .bag-sm_414-7, .bag-sm_414-6, .bag-sm_414-5, .bag-sm_414-4, .bag-sm_414-3, .bag-sm_414-2, .bag-sm_414-1, .bag-sm_414-auto, .bag-sm_414, .bag-sm_390-12, .bag-sm_390-11, .bag-sm_390-10, .bag-sm_390-9, .bag-sm_390-8, .bag-sm_390-7, .bag-sm_390-6, .bag-sm_390-5, .bag-sm_390-4, .bag-sm_390-3, .bag-sm_390-2, .bag-sm_390-1, .bag-sm_390-auto, .bag-sm_390, .bag-sm_360-12, .bag-sm_360-11, .bag-sm_360-10, .bag-sm_360-9, .bag-sm_360-8, .bag-sm_360-7, .bag-sm_360-6, .bag-sm_360-5, .bag-sm_360-4, .bag-sm_360-3, .bag-sm_360-2, .bag-sm_360-1, .bag-sm_360-auto, .bag-sm_360, .bag-xs_320-12, .bag-xs_320-11, .bag-xs_320-10, .bag-xs_320-9, .bag-xs_320-8, .bag-xs_320-7, .bag-xs_320-6, .bag-xs_320-5, .bag-xs_320-4, .bag-xs_320-3, .bag-xs_320-2, .bag-xs_320-1, .bag-xs_320-auto, .bag-xs_320, .bag-12, .bag-11, .bag-10, .bag-9, .bag-8, .bag-7, .bag-6, .bag-5, .bag-4, .bag-3, .bag-2, .bag-1, .bag-auto, .bag {
  position: relative;
  width: calc(100% - var(--grid-gap));
  margin-left: 15px;
  margin-right: 15px;
}

.bag {
  flex: 1 1 0;
  max-width: calc(100% - var(--grid-gap));
}

.bag-auto {
  flex: 0 0 auto;
  width: auto;
  max-width: calc(100% - var(--grid-gap));
}

.bag-1 {
  flex: 0 0 calc(8.3333333333% - var(--grid-gap));
  max-width: calc(8.3333333333% - var(--grid-gap));
}

.bag-2 {
  flex: 0 0 calc(16.6666666667% - var(--grid-gap));
  max-width: calc(16.6666666667% - var(--grid-gap));
}

.bag-3 {
  flex: 0 0 calc(25% - var(--grid-gap));
  max-width: calc(25% - var(--grid-gap));
}

.bag-4 {
  flex: 0 0 calc(33.3333333333% - var(--grid-gap));
  max-width: calc(33.3333333333% - var(--grid-gap));
}

.bag-5 {
  flex: 0 0 calc(41.6666666667% - var(--grid-gap));
  max-width: calc(41.6666666667% - var(--grid-gap));
}

.bag-6 {
  flex: 0 0 calc(50% - var(--grid-gap));
  max-width: calc(50% - var(--grid-gap));
}

.bag-7 {
  flex: 0 0 calc(58.3333333333% - var(--grid-gap));
  max-width: calc(58.3333333333% - var(--grid-gap));
}

.bag-8 {
  flex: 0 0 calc(66.6666666667% - var(--grid-gap));
  max-width: calc(66.6666666667% - var(--grid-gap));
}

.bag-9 {
  flex: 0 0 calc(75% - var(--grid-gap));
  max-width: calc(75% - var(--grid-gap));
}

.bag-10 {
  flex: 0 0 calc(83.3333333333% - var(--grid-gap));
  max-width: calc(83.3333333333% - var(--grid-gap));
}

.bag-11 {
  flex: 0 0 calc(91.6666666667% - var(--grid-gap));
  max-width: calc(91.6666666667% - var(--grid-gap));
}

.bag-12 {
  flex: 0 0 calc(100% - var(--grid-gap));
  max-width: calc(100% - var(--grid-gap));
}

@media (min-width: 320px) {
  .bag-xs_320-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xs_320 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xs_320-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-xs_320-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-xs_320-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-xs_320-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-xs_320-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-xs_320-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-xs_320-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-xs_320-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-xs_320-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-xs_320-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-xs_320-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-xs_320-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 360px) {
  .bag-sm_360-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_360 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_360-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-sm_360-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-sm_360-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-sm_360-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-sm_360-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-sm_360-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-sm_360-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-sm_360-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-sm_360-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-sm_360-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-sm_360-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-sm_360-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 390px) {
  .bag-sm_390-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_390 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_390-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-sm_390-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-sm_390-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-sm_390-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-sm_390-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-sm_390-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-sm_390-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-sm_390-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-sm_390-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-sm_390-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-sm_390-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-sm_390-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 414px) {
  .bag-sm_414-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_414 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_414-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-sm_414-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-sm_414-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-sm_414-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-sm_414-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-sm_414-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-sm_414-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-sm_414-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-sm_414-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-sm_414-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-sm_414-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-sm_414-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 428px) {
  .bag-sm_428-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_428 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_428-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-sm_428-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-sm_428-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-sm_428-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-sm_428-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-sm_428-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-sm_428-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-sm_428-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-sm_428-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-sm_428-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-sm_428-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-sm_428-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 480px) {
  .bag-sm_480-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_480 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_480-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-sm_480-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-sm_480-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-sm_480-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-sm_480-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-sm_480-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-sm_480-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-sm_480-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-sm_480-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-sm_480-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-sm_480-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-sm_480-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 576px) {
  .bag-sm_576-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_576 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-sm_576-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-sm_576-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-sm_576-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-sm_576-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-sm_576-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-sm_576-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-sm_576-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-sm_576-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-sm_576-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-sm_576-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-sm_576-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-sm_576-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 640px) {
  .bag-md_640-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_640 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_640-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-md_640-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-md_640-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-md_640-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-md_640-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-md_640-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-md_640-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-md_640-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-md_640-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-md_640-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-md_640-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-md_640-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 667px) {
  .bag-md_667-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_667 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_667-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-md_667-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-md_667-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-md_667-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-md_667-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-md_667-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-md_667-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-md_667-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-md_667-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-md_667-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-md_667-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-md_667-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 767px) {
  .bag-md_767-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_767 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_767-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-md_767-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-md_767-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-md_767-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-md_767-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-md_767-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-md_767-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-md_767-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-md_767-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-md_767-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-md_767-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-md_767-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 768px) {
  .bag-md_768-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_768 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_768-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-md_768-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-md_768-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-md_768-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-md_768-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-md_768-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-md_768-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-md_768-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-md_768-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-md_768-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-md_768-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-md_768-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 812px) {
  .bag-md_812-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_812 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_812-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-md_812-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-md_812-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-md_812-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-md_812-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-md_812-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-md_812-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-md_812-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-md_812-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-md_812-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-md_812-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-md_812-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 849px) {
  .bag-md_849-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_849 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-md_849-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-md_849-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-md_849-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-md_849-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-md_849-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-md_849-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-md_849-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-md_849-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-md_849-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-md_849-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-md_849-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-md_849-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 991px) {
  .bag-lg_991-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-lg_991 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-lg_991-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-lg_991-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-lg_991-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-lg_991-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-lg_991-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-lg_991-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-lg_991-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-lg_991-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-lg_991-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-lg_991-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-lg_991-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-lg_991-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 992px) {
  .bag-lg_992-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-lg_992 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-lg_992-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-lg_992-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-lg_992-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-lg_992-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-lg_992-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-lg_992-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-lg_992-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-lg_992-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-lg_992-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-lg_992-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-lg_992-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-lg_992-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 1024px) {
  .bag-lg_1024-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-lg_1024 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-lg_1024-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-lg_1024-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-lg_1024-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-lg_1024-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-lg_1024-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-lg_1024-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-lg_1024-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-lg_1024-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-lg_1024-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-lg_1024-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-lg_1024-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-lg_1024-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 1200px) {
  .bag-xl_1200-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1200 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1200-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-xl_1200-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-xl_1200-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-xl_1200-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-xl_1200-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-xl_1200-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-xl_1200-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-xl_1200-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-xl_1200-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-xl_1200-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-xl_1200-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-xl_1200-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 1366px) {
  .bag-xl_1366-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1366 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1366-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-xl_1366-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-xl_1366-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-xl_1366-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-xl_1366-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-xl_1366-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-xl_1366-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-xl_1366-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-xl_1366-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-xl_1366-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-xl_1366-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-xl_1366-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 1440px) {
  .bag-xl_1440-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1440 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1440-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-xl_1440-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-xl_1440-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-xl_1440-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-xl_1440-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-xl_1440-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-xl_1440-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-xl_1440-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-xl_1440-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-xl_1440-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-xl_1440-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-xl_1440-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 1600px) {
  .bag-xl_1600-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1600 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1600-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-xl_1600-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-xl_1600-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-xl_1600-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-xl_1600-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-xl_1600-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-xl_1600-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-xl_1600-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-xl_1600-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-xl_1600-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-xl_1600-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-xl_1600-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
@media (min-width: 1700px) {
  .bag-xl_1700-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1700 {
    flex: 1 1 0;
    max-width: calc(100% - var(--grid-gap));
  }
  .bag-xl_1700-1 {
    flex: 0 0 calc(8.3333333333% - var(--grid-gap));
    max-width: calc(8.3333333333% - var(--grid-gap));
  }
  .bag-xl_1700-2 {
    flex: 0 0 calc(16.6666666667% - var(--grid-gap));
    max-width: calc(16.6666666667% - var(--grid-gap));
  }
  .bag-xl_1700-3 {
    flex: 0 0 calc(25% - var(--grid-gap));
    max-width: calc(25% - var(--grid-gap));
  }
  .bag-xl_1700-4 {
    flex: 0 0 calc(33.3333333333% - var(--grid-gap));
    max-width: calc(33.3333333333% - var(--grid-gap));
  }
  .bag-xl_1700-5 {
    flex: 0 0 calc(41.6666666667% - var(--grid-gap));
    max-width: calc(41.6666666667% - var(--grid-gap));
  }
  .bag-xl_1700-6 {
    flex: 0 0 calc(50% - var(--grid-gap));
    max-width: calc(50% - var(--grid-gap));
  }
  .bag-xl_1700-7 {
    flex: 0 0 calc(58.3333333333% - var(--grid-gap));
    max-width: calc(58.3333333333% - var(--grid-gap));
  }
  .bag-xl_1700-8 {
    flex: 0 0 calc(66.6666666667% - var(--grid-gap));
    max-width: calc(66.6666666667% - var(--grid-gap));
  }
  .bag-xl_1700-9 {
    flex: 0 0 calc(75% - var(--grid-gap));
    max-width: calc(75% - var(--grid-gap));
  }
  .bag-xl_1700-10 {
    flex: 0 0 calc(83.3333333333% - var(--grid-gap));
    max-width: calc(83.3333333333% - var(--grid-gap));
  }
  .bag-xl_1700-11 {
    flex: 0 0 calc(91.6666666667% - var(--grid-gap));
    max-width: calc(91.6666666667% - var(--grid-gap));
  }
  .bag-xl_1700-12 {
    flex: 0 0 calc(100% - var(--grid-gap));
    max-width: calc(100% - var(--grid-gap));
  }
}
html {
  font-size: 1rem;
}

body {
  font-family: Arial, Helvetica, 微軟正黑體, sans-serif;
  line-height: 1.5;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

a {
  text-decoration: none;
  transition: all 0.35s;
}
a:hover, a:focus a:active {
  text-decoration: none;
}

.for-mobile-lg {
  display: none !important;
}
@media (max-width: lg px) {
  .for-mobile-lg {
    display: block !important;
  }
}

@media (max-width: lg px) {
  .for-desk-lg {
    display: none !important;
  }
}

ul,
ol {
  margin: 0;
}

ul {
  padding: 0;
  list-style: none;
}

ol {
  padding-left: 20px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
  font-weight: normal;
}

h1 {
  font-size: 2rem;
}

h2 {
  font-size: 1.5rem;
}

h3 {
  font-size: 1.25rem;
}

h4 {
  font-size: 1.2rem;
}

h5 {
  font-size: 1.125rem;
}

h6 {
  font-size: 1rem;
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
  color: 1.125rem;
}
@media (max-width: lg px) {
  p {
    font-size: 1rem;
  }
}

* {
  padding: 0;
  margin: 0;
}

body {
  background: #000;
  font-family: "DIN Pro", Arial, Helvetica, Sans-Serif;
}

dl, ol, ul {
  margin-top: 0;
  margin-bottom: 1rem;
}

label {
  margin-bottom: 0.5rem;
}

/*繼承Extent*/
.spec_title:before, .auto_Spec .tabs_box input[type=radio]:checked + label:before, .kv_features_grid .kv_features_txt h4:before, .pa_menu_flex .pa_menu_list:last-child ul li a:hover:before, .pa_menu_flex .pa_menu_list:last-child ul li a.state:before {
  content: "";
  position: absolute;
}

.pandora_mv .pandora_mv_txt, .peripheral_flex .peripheral_list .peripheral_txt {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

[class*=flex] {
  display: flex;
}

[class*=grid] {
  display: grid;
}

img {
  max-width: 100%;
}

.product_grid {
  justify-items: center;
  padding: 30px 0 45px;
  margin: 20px 0 0;
  background: url("../images/Product_kv.jpg") no-repeat top center/cover, linear-gradient(to top, #000000 0%, #ffffff 100%);
  grid-template-columns: repeat(16, 10%);
  grid-auto-rows: minmax(340px, auto);
}
@media (min-width: 768px) {
  .product_grid {
    grid-auto-rows: minmax(225px, auto);
  }
}
@media (min-width: 1930px) {
  .product_grid {
    background: url(../images/Product_kv_l.jpg) no-repeat top center/cover;
  }
}
.product_grid .product_pic {
  grid-area: 1/2/1/10;
  position: relative;
  display: grid;
  align-content: end;
}
@media (min-width: 768px) {
  .product_grid .product_pic {
    grid-area: 1/4/1/8;
  }
}
.product_grid .product_pic .brand {
  filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.8));
  position: relative;
  text-align: center;
  margin: 18px 0 0;
}
@media (min-width: 996px) {
  .product_grid .product_pic .brand {
    bottom: 50%;
    left: -38%;
    width: 45%;
    position: absolute;
  }
}
@media (min-width: 1300px) {
  .product_grid .product_pic .brand {
    bottom: 50%;
    left: -32%;
  }
}
.product_grid .product_pic .rtx {
  color: white;
  font-size: 1.8rem;
  text-shadow: 0 0 8px black;
  position: relative;
  text-align: center;
}
@media (min-width: 996px) {
  .product_grid .product_pic .rtx {
    right: -29%;
    top: 24%;
    font-size: 1.3rem;
    position: absolute;
  }
}
@media (min-width: 1300px) {
  .product_grid .product_pic .rtx {
    right: -24%;
    top: 24%;
    font-size: 2rem;
  }
}
.product_grid .product_pic .rtx strong {
  font-size: 2.4rem;
  font-weight: 400;
  margin: 0 0 0 6px;
}
@media (min-width: 996px) {
  .product_grid .product_pic .rtx strong {
    font-size: 1.8rem;
    margin: 0 0 0 0px;
  }
}
@media (min-width: 1300px) {
  .product_grid .product_pic .rtx strong {
    font-size: 2.6rem;
  }
}
.product_grid .product_txt {
  color: white;
  grid-area: 2/2/3/10;
  color: white;
  text-align: center;
}
@media (min-width: 768px) {
  .product_grid .product_txt {
    grid-area: 2/3/3/9;
  }
}
.product_grid .product_txt .product_title {
  font-size: 2rem;
  font-weight: bolder;
  margin: 20px 0 30px;
  text-align: center;
  color: #fff;
}
@media (min-width: 768px) {
  .product_grid .product_txt .product_title {
    font-size: 2.25rem;
    font-weight: bolder;
    margin: 20px 0 30px;
    text-align: center;
    color: #fff;
  }
}
.product_grid .product_txt p {
  font-size: 0.8rem;
  line-height: 24px;
  padding-bottom: 10px;
  padding-top: 10px;
}
@media (min-width: 768px) {
  .product_grid .product_txt p {
    font-size: 0.938rem;
    line-height: 1.666em;
  }
}
.product_grid .nv_logo {
  grid-area: 1/8/1/11;
  margin: 0 22px 0 0;
}
@media (min-width: 768px) {
  .product_grid .nv_logo {
    grid-area: 1/6/1/14;
  }
}

.product_flex {
  align-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}
.product_flex .product_list_flex {
  width: calc(100% - 10px);
  background: #252525;
  text-align: center;
  padding: 45px 22px 30px;
  margin: 5px;
  border-radius: 8px;
  justify-content: center;
  flex-direction: row;
  transition: transform 0.3s ease;
}
@media (min-width: 390px) {
  .product_flex .product_list_flex {
    flex-direction: column;
  }
}
@media (min-width: 768px) {
  .product_flex .product_list_flex {
    width: calc(50% - 10px);
  }
}
@media (min-width: 996px) {
  .product_flex .product_list_flex {
    width: calc(33.3333333333% - 10px);
  }
}
@media (min-width: 1600px) {
  .product_flex .product_list_flex {
    width: calc(25% - 10px);
  }
}
.product_flex .product_list_flex a {
  color: white;
}
.product_flex .product_list_flex a h3 {
  font-size: 1.1rem;
  margin: 17px 0 0;
  line-height: 25px;
}
.product_flex .product_list_flex a:hover {
  text-decoration: none;
}
.product_flex .product_list_flex a .product_spec {
  margin: 12px 20px 15px;
  display: inline-block;
  width: 45%;
}
@media (min-width: 390px) {
  .product_flex .product_list_flex a .product_spec {
    width: auto;
  }
}
.product_flex .product_list_flex a .product_spec li {
  font-size: 0.85rem;
  line-height: 25px;
  list-style: disc;
  color: #919191;
  text-align: left;
}
.product_flex .product_list_flex a .product_spec + a {
  display: block;
  color: white;
  padding: 6px 9px 8px;
  margin: 20px 0;
  text-decoration: none;
  text-align: center;
  border-radius: 8px;
}
.product_flex .product_list_flex .custom-checkbox {
  width: 100%;
  cursor: pointer;
}
.product_flex .product_list_flex:hover {
  background: #1a1a1a;
  border: solid 1px #484848;
  transform: scale3d(1.03, 1.03, 1.03);
}

/*NV*/
.chip_box {
  color: #fff;
  text-align: center;
  margin: 35px 0;
  cursor: pointer;
}
.chip_box small {
  font-size: 1.25rem;
}
.chip_box h2 {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.25em;
  margin: 10px 0;
}
@media (min-width: 768px) {
  .chip_box h2 {
    font-size: 2.25rem;
  }
}
.chip_box p {
  font-size: 0.938rem;
  padding-bottom: 10px;
  padding-top: 10px;
}
.chip_box header small {
  font-size: 1.25rem;
  display: block;
}
.chip_box .icon {
  width: 200px;
  margin: 0 auto 30px;
}
@media (min-width: 768px) {
  .chip_box .icon {
    width: 380px;
  }
}
.chip_box .nv_box_flex_a {
  justify-content: center;
  background: url(../images/nv_list_pic_1m.jpg) no-repeat bottom center/100%;
  min-height: 730px;
  align-items: self-start;
  padding: 60px 20px;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_a {
    background: url(../images/nv_list_pic_1.jpg) no-repeat top center/cover;
    min-height: 750px;
    align-items: self-start;
    padding: 60px 90px;
  }
}
.chip_box .nv_box_flex_b {
  justify-content: center;
  background: url(../images/nv_list_pic_2.jpg) no-repeat top center/cover;
  min-height: 730px;
  align-items: flex-start;
  padding: 60px 20px;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_b {
    background: url(../images/nv_list_pic_2.jpg) no-repeat top center/cover;
    min-height: 750px;
    align-items: center;
    padding: 60px 90px;
  }
}
.chip_box .nv_box_flex_b .nv_list {
  margin: 0 0px;
  text-align: left;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_b .nv_list {
    margin: 0 85px;
  }
}
@media (min-width: 1300px) {
  .chip_box .nv_box_flex_b .nv_list {
    margin: 0 157px;
  }
}
.chip_box .nv_box_flex_c {
  justify-content: center;
  background: url(../images/nv_list_pic_3.jpg) no-repeat top center/cover;
  min-height: 730px;
  align-items: flex-start;
  padding: 60px 20px;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_c {
    background: url(../images/nv_list_pic_3.jpg) no-repeat top center/cover;
    min-height: 750px;
    align-items: center;
    padding: 60px 90px;
  }
}
.chip_box .nv_box_flex_d {
  justify-content: flex-start;
  background: url(../images/nv_list_pic_7m.jpg) no-repeat top center/100%;
  min-height: 730px;
  align-items: flex-end;
  padding: 60px 20px;
  text-align: left;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_d {
    background: url(../images/nv_list_pic_7.jpg) no-repeat top center/cover;
    min-height: 750px;
    align-items: center;
    padding: 60px 40px;
  }
}
.chip_box .nv_box_flex_d .nv_list {
  width: 430px;
}
.chip_box .nv_box_flex_e {
  justify-content: center;
  background: url(../images/nv_list_pic_5m.jpg) no-repeat bottom center/100%;
  min-height: 730px;
  align-items: flex-start;
  padding: 60px 20px;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_e {
    background: url(../images/nv_list_pic_5.jpg) no-repeat top center/cover;
    min-height: 750px;
    align-items: center;
    padding: 60px 90px;
  }
}
.chip_box .nv_box_flex_f {
  justify-content: center;
  background: url(../images/nv_list_pic_6.jpg) no-repeat top center/cover;
  min-height: auto;
  align-items: center;
  padding: 60px 0px;
  flex-direction: column;
}
@media (min-width: 1300px) {
  .chip_box .nv_box_flex_f {
    background: url(../images/nv_list_pic_6.jpg) no-repeat top center/cover;
    min-height: 750px;
    align-items: center;
    padding: 60px 90px;
  }
}
.chip_box .nv_box_flex_f .creators_box {
  display: flex;
  flex-wrap: wrap;
  margin: 20px 0 0;
  justify-content: center;
}
.chip_box .nv_box_flex_f .creators_box .creators_list {
  width: calc(50% - 4px);
  padding: 20px 10px 10px;
  background: rgba(0, 0, 0, 0.3607843137);
  margin: 0 1px;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_f .creators_box .creators_list {
    width: calc(25% - 22px);
  }
}
.chip_box .nv_box_flex_f .creators_box .creators_list h5 {
  font-size: 0.95rem;
  margin: 2px 0 5px;
}
.chip_box .nv_box_flex_f .creators_box .creators_list figure {
  margin: 0 10px 10px;
}
.chip_box .nv_box_flex_f .creators_box .creators_list p {
  line-height: 18px;
  font-size: 0.9rem;
  font-weight: 200;
}
.chip_box .nv_box_flex_g {
  justify-content: center;
  margin: 60px 0 0;
  flex-direction: column;
}
.chip_box .nv_box_flex_g .ray_box h4 {
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1.25em;
}
.chip_box .nv_box_flex_g .additional_box {
  display: flex;
  flex-wrap: wrap;
  margin: 20px 0 0;
  justify-content: center;
}
.chip_box .nv_box_flex_g .additional_box .additional_list {
  width: calc(50% - 4px);
  padding: 20px 4px 10px;
  background: rgba(0, 0, 0, 0.3607843137);
  margin: 0 1px;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_g .additional_box .additional_list {
    width: calc(50% - 22px);
    padding: 20px 10px 10px;
  }
}
.chip_box .nv_box_flex_g .additional_box .additional_list header {
  text-align: left;
  padding: 16px 4px 4px;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_g .additional_box .additional_list header {
    padding: 16px 27px 4px;
  }
}
.chip_box .nv_box_flex_g .additional_box .additional_list header h5 {
  font-size: 1.2rem;
  margin: 2px 0 5px;
  font-weight: 700;
  line-height: 1.25em;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_g .additional_box .additional_list header h5 {
    font-size: 1.5rem;
  }
}
.chip_box .nv_box_flex_g .additional_box .additional_list header p {
  line-height: 18px;
  font-size: 0.938rem;
  line-height: 1.666em;
}
.chip_box .nv_box_flex_g .additional_box .additional_list figure {
  margin: 0 10px 10px;
}
.chip_box .nv_box_flex_g .additional_box .additional_list .icon {
  width: 160px;
  margin: 0;
}
.chip_box .nv_box_flex_g .additional_box .additional_list .additional_pic {
  margin: 0 20px;
}
@media (min-width: 768px) {
  .chip_box .nv_box_flex_g .additional_box .additional_list .additional_pic {
    margin: 0 110px;
  }
}

.chip_flex {
  margin: 0 0 0 85px;
}

.chip_list {
  width: 50%;
  display: flex;
  align-items: center;
}
.chip_list:first-child {
  justify-content: center;
}
.chip_list figure {
  text-align: center;
}
.chip_list ul {
  margin: 0;
}
.chip_list ul li {
  list-style: none;
  text-align: left;
  margin: 0 0 30px 0;
}
.chip_list ul li h4 {
  font-size: 1.75rem;
  font-weight: 700;
  margin: 6px 0;
}

.chip_box .chip_icon_flex {
  justify-content: center;
  flex-wrap: wrap;
}
.chip_box .chip_icon_flex .chip_icon {
  width: calc(50% - 4px);
  background: #1a1a1a;
  margin: 2px;
  padding: 20px 8px 25px;
  text-align: center;
}
@media (min-width: 768px) {
  .chip_box .chip_icon_flex .chip_icon {
    width: calc(25% - 20px);
  }
}
.chip_box .chip_icon_flex .chip_icon figure {
  justify-items: center;
}
.chip_box .chip_icon_flex .chip_icon .chip_icon_title {
  font-size: 1.25rem;
  margin: 0 0 6px;
  font-weight: bold;
}
.chip_box .chip_icon_flex .chip_icon p {
  font-size: 0.85rem;
  line-height: 20px;
  margin: 4px 0;
  text-align: center;
}

@media (max-width: 760px) {
  .chip_flex {
    margin: 0;
    flex-wrap: wrap;
  }
  .chip_list {
    width: 100%;
    justify-content: center;
  }
  .chip_list ul li {
    text-align: center;
  }
  .chip_list:first-child {
    justify-content: center;
  }
}
/*側邊選單*/
@media (min-width: 768px) {
  .sidebar_flex {
    flex-wrap: nowrap;
  }
}
.sidebar_flex .custom-checkbox input[type=checkbox] {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  background: #3d3d3d;
  border-radius: 4px;
  position: relative;
  top: 3px;
  cursor: pointer;
}
.sidebar_flex .custom-checkbox input[type=checkbox]:checked {
  background-color: #5495dd;
}
.sidebar_flex .custom-checkbox input[type=checkbox]:checked::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 6px;
  height: 10px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.sidebar_flex.sidebar_w .product_list_flex a {
  color: #303030;
}
.sidebar_flex.sidebar_w .product_list_flex a ul li {
  color: #565656;
}
.sidebar_flex.sidebar_w .product_list_flex a + label {
  color: #303030;
}
.sidebar_flex.sidebar_w .product_list_flex a + label input[type=checkbox] {
  background: #979797;
}
.sidebar_flex.sidebar_w .product_list_flex img {
  filter: drop-shadow(5px 5px 5px #a1a1a1);
}
.sidebar_flex.sidebar_w .product_list_flex:hover {
  border: none;
  box-shadow: 0px 0px 6px 0px #707070;
}
.sidebar_flex.sidebar_w .product_list_flex, .sidebar_flex.sidebar_w aside {
  background: #dddddd;
}
.sidebar_flex.sidebar_w .sidebar .filter-title {
  border-bottom: 1px solid #a3a3a3;
  color: #303030;
}
.sidebar_flex.sidebar_w .sidebar .filter-options {
  color: #303030;
}
.sidebar_flex.sidebar_w .sidebar .filter-options label:hover {
  color: #000000;
}

@media (min-width: 768px) {
  aside {
    background: #252525;
    margin: 5px;
    border-radius: 8px;
  }
}

.sidebar {
  width: 254px;
  background: #252525;
  padding: 85px 20px 20px;
  position: relative;
  transition: transform 0.3s ease;
  z-index: 1000;
}
@media (min-width: 768px) {
  .sidebar {
    width: 280px;
    margin: 5px;
    border-radius: 8px;
    background: none;
    padding: 45px 20px 20px;
  }
}
.sidebar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.sidebar .filter-title {
  font-size: 1.18rem;
  padding: 10px 0;
  cursor: pointer;
  border-bottom: 1px solid #333;
  display: flex;
  align-items: center;
  font-weight: bolder;
}
.sidebar .filter-title .arrow {
  margin-right: 8px;
  display: inline-block;
  width: 14px;
}
.sidebar .filter-options {
  padding: 8px 0 12px 20px;
  display: none;
}
.sidebar .filter-options label {
  display: flex;
  font-size: 0.938rem;
  cursor: pointer;
  transition: all 0.3s ease;
}
.sidebar .filter-options label input {
  margin: 0 5px 0 0;
}
.sidebar .filter-options label:hover {
  color: #5495dd;
}
.sidebar .filter-options .has-submenu {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}
.sidebar .filter-options .has-submenu .symbol {
  margin-left: 8px;
}
.sidebar .filter-options .has-submenu + .sub-menu li a {
  color: #979797;
  font-size: 0.938rem;
  line-height: 30px;
}
.sidebar .filter-options .has-submenu + .sub-menu li a:hover {
  color: white;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  display: none;
  z-index: 1000;
  transition: opacity 0.3s ease;
}

#openFilter {
  position: fixed;
  top: 87px;
  right: 15px;
  z-index: 1000;
  padding: 8px 14px;
  background: #444;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 15px;
  display: none;
}

.close-btn {
  background: transparent;
  color: #fff;
  border: none;
  font-size: 22px;
  cursor: pointer;
}

.mobile-only {
  display: none;
}

@media (max-width: 768px) {
  .sidebar {
    position: fixed;
    top: 0;
    left: 0;
    transform: translateX(-100%);
    height: 100vh;
    width: 300px;
    overflow-y: auto;
  }
  .mobile-only {
    display: block;
  }
  #openFilter {
    display: block;
  }
}
@media (min-width: 769px) {
  .overlay, .close-btn, #openFilter {
    display: none !important;
  }
}
.slider {
  margin: 15px auto;
}
.slider .slick-slide {
  margin: 0 5px;
  transition: all ease-in-out 0.3s;
  opacity: 1;
}
.slider .slick-slide img {
  width: 100%;
  border-radius: 8px;
}
.slider .slick-slide.slick-active, .slider .slick-slide.slick-current {
  opacity: 1;
}
.slider .slick-prev:before,
.slider .slick-next:before {
  color: black;
}

#scroll-container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

#myimg {
  max-width: 90%;
  max-height: 90%;
  -o-object-fit: contain;
     object-fit: contain;
  transition: opacity 0.5s ease-in-out;
}

#trigger {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #ddd;
  font-size: 1.5rem;
}

section {
  padding: 60px 0;
  position: relative;
  color: white;
}
@media (min-width: 768px) {
  section {
    padding: 130px 0;
  }
}
@media (min-width: 996px) {
  section {
    padding: 80px 0;
  }
}
section figure {
  text-align: center;
  padding: 0 10px;
}
@media (min-width: 768px) {
  section figure {
    padding: 0;
  }
}

.pa_menu_flex {
  padding: 13% 0 20px;
  flex-wrap: wrap;
}
.pa_menu_flex .pa_menu_list {
  width: 100%;
  position: relative;
}
@media (min-width: 768px) {
  .pa_menu_flex .pa_menu_list {
    width: 50%;
  }
}
.pa_menu_flex .pa_menu_list h1 {
  color: white;
  font-size: 1.35rem;
}
.pa_menu_flex .pa_menu_list h1 small {
  display: block;
}
.pa_menu_flex .pa_menu_list:last-child {
  align-content: flex-end;
  justify-items: flex-end;
}
.pa_menu_flex .pa_menu_list:last-child ul {
  margin: 35px 0 0;
  position: relative;
}
@media (min-width: 768px) {
  .pa_menu_flex .pa_menu_list:last-child ul {
    margin: 0;
  }
}
.pa_menu_flex .pa_menu_list:last-child ul li {
  display: inline-block;
}
.pa_menu_flex .pa_menu_list:last-child ul li a {
  color: #c2c2c2;
  display: block;
  font-size: 0.9rem;
  margin: 10px 27px;
  text-decoration: blink;
  position: relative;
  transition: all 0.2s linear;
}
@media (min-width: 996px) {
  .pa_menu_flex .pa_menu_list:last-child ul li a {
    margin: 0 15px 25px;
  }
}
@media (min-width: 1600px) {
  .pa_menu_flex .pa_menu_list:last-child ul li a {
    margin: 0 15px;
  }
}
.pa_menu_flex .pa_menu_list:last-child ul li a.state {
  color: white;
}
.pa_menu_flex .pa_menu_list:last-child ul li a.state:before {
  width: 100%;
  height: 1px;
  background: #ffcc00;
  bottom: -5px;
}
.pa_menu_flex .pa_menu_list:last-child ul li a:hover {
  color: white;
}
.pa_menu_flex .pa_menu_list:last-child ul li a:hover:before {
  width: 100%;
  height: 1px;
  background: #ffcc00;
  bottom: -5px;
}

.empowers_box {
  text-align: left;
}
@media (min-width: 768px) {
  .empowers_box {
    text-align: center;
  }
}
.empowers_box .pa_title {
  border-bottom: solid 2px #ffcc00;
  display: inline-block;
  padding: 5px 0;
}
.empowers_box p {
  margin: 10px 0 25px;
}

.pandora_txt_rignt {
  padding: 65px 0;
  text-align: right;
  margin: 0 0 0 50%;
}
@media (min-width: 996px) {
  .pandora_txt_rignt {
    margin: 0 0 0 45%;
  }
}
@media (min-width: 1600px) {
  .pandora_txt_rignt {
    margin: 0;
  }
}

.pandora_txt_left {
  padding: 65px 0;
  text-align: left;
  margin: 0 50% 0 0;
}
@media (min-width: 996px) {
  .pandora_txt_left {
    margin: 0 45% 0 0;
  }
}
@media (min-width: 1600px) {
  .pandora_txt_left {
    margin: 0;
  }
}

.smarthub_flex .smarthub_list {
  width: 100%;
  padding: 10px;
}
@media (min-width: 768px) {
  .smarthub_flex .smarthub_list {
    width: 50%;
  }
}

.modern_flex .modern_list {
  width: 100%;
  padding: 10px;
  position: relative;
}
@media (min-width: 768px) {
  .modern_flex .modern_list {
    width: 50%;
  }
}
.modern_flex .modern_list figure figcaption {
  margin: 0 0 10px;
  font-size: 1.15rem;
  color: #ffcc00;
}

.friendly_flex .friendly_list {
  width: 100%;
  padding: 10px;
}
@media (min-width: 768px) {
  .friendly_flex .friendly_list {
    width: 33.3333333333%;
  }
}

.kv_features_grid {
  background: url(../images/banner_bg_m.jpg) no-repeat top center/cover;
  grid-template-columns: repeat(16, 10%);
  grid-auto-rows: minmax(225px, auto);
  background-attachment: fixed;
  margin: 33px 0 0;
}
@media (min-width: 768px) {
  .kv_features_grid {
    background: url(../images/banner_bg.jpg) no-repeat top center/cover;
    grid-auto-rows: minmax(104px, auto);
  }
}
.kv_features_grid .kv_features_txt {
  grid-area: 2/2/3/10;
  color: white;
  display: grid;
  align-items: center;
}
@media (min-width: 768px) {
  .kv_features_grid .kv_features_txt {
    grid-area: 1/2/3/6;
  }
}
@media (min-width: 1600px) {
  .kv_features_grid .kv_features_txt {
    grid-area: 1/3/3/6;
  }
}
.kv_features_grid .kv_features_txt .features_page {
  margin: 0 0 0 0;
}
@media (min-width: 768px) {
  .kv_features_grid .kv_features_txt .features_page {
    margin: 0 20% 0 0;
  }
}
.kv_features_grid .kv_features_txt .features_page .features_logo {
  margin: 0 0 40px;
}
.kv_features_grid .kv_features_txt h4 {
  position: relative;
  display: inline-block;
  margin: 0 0 20px;
}
.kv_features_grid .kv_features_txt h4:before {
  width: 100%;
  height: 1px;
  background: #ffcc00;
  bottom: -10px;
}
.kv_features_grid .kv_features_txt ul {
  margin: 0 0 0 18px;
}
.kv_features_grid .kv_features_txt ul li {
  list-style-type: disc;
}
.kv_features_grid .kv_features_pc {
  grid-area: 1/2/2/10;
  display: grid;
  align-items: center;
  margin: 0 0 24px;
}
@media (min-width: 768px) {
  .kv_features_grid .kv_features_pc {
    grid-area: 1/6/3/11;
    margin: 0;
  }
}
@media (min-width: 996px) {
  .kv_features_grid .kv_features_pc {
    grid-area: 1/6/3/10;
  }
}
@media (min-width: 1600px) {
  .kv_features_grid .kv_features_pc {
    grid-area: 1/6/3/9;
  }
}

.auto_Spec table .caption {
  background: #ffcc00;
  color: #000;
  text-align: left;
}
.auto_Spec table th {
  border-right: 1px solid #ffcc00;
  padding: 10px 15px;
  color: #ffffff;
  border-bottom: 1px solid #ffcc00;
}
.auto_Spec table td {
  border-bottom: 1px solid #ffcc00;
  padding: 10px 7px;
  color: #d0d0d0;
  border-right: 1px solid #ffcc00;
}
.auto_Spec table td:last-child {
  border-right: none;
}
.auto_Spec table td ul {
  padding: 0px;
  margin: 0;
}
.auto_Spec table td ul li {
  text-align: left;
  list-style: none;
}
.auto_Spec .tabs_box {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  -moz-column-gap: 5px;
       column-gap: 5px;
  margin: 2em auto;
}
.auto_Spec .tabs_box input[type=radio] {
  display: none;
}
.auto_Spec .tabs_box input[type=radio]:checked + label {
  position: relative;
  color: #f2c917;
  margin: 0 0 25px;
  transform: translatey(1px);
}
.auto_Spec .tabs_box input[type=radio]:checked + label:before {
  width: 81%;
  height: 1px;
  background: #ffcc00;
  bottom: -3px;
  left: 0;
  right: 0;
  margin: auto;
}
.auto_Spec .tabs_box input[type=radio]:checked + label + .tab-content {
  display: block;
}
.auto_Spec .tabs_box input[type=radio]:checked + label + .tab-content .peripheral_flex {
  margin: 40px 0 0px;
}
.auto_Spec .tabs_box label {
  padding: 0.5em 0.45em;
  color: #939393;
  font-size: 1.25rem;
  border-bottom: unset;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  cursor: pointer;
  order: 0;
}
@media (min-width: 768px) {
  .auto_Spec .tabs_box label {
    padding: 0.5em 0.75em;
  }
}
.auto_Spec .tabs_box label:hover {
  color: #f2c917;
}
.auto_Spec .tabs_box .tab-content {
  display: none;
  width: 100%;
  order: 1;
}
.auto_Spec.download_list table {
  margin: 0 0 40px;
}
.auto_Spec.download_list table tr {
  text-align: center;
}
.auto_Spec.download_list table tr td a {
  font-size: 1.3rem;
  color: #d0d0d0;
}
.auto_Spec.download_list table tr td a:hover {
  color: #ffcc00;
}
.auto_Spec.download_list table tr:nth-child(3) td:last-child {
  border-right: solid 1px #ffcc00;
}

.resolve_box {
  position: relative;
}
.resolve_box .empowers_box {
  position: relative;
}
@media (min-width: 768px) {
  .resolve_box .empowers_box {
    text-align: left;
    width: 63%;
  }
}

.peripheral_flex {
  margin: 0 0 55px;
}
.peripheral_flex .peripheral_list {
  width: 100%;
  position: relative;
  margin: 15px 0 30px;
}
@media (min-width: 996px) {
  .peripheral_flex .peripheral_list {
    width: 50%;
    margin: 15px 0 0;
  }
}
.peripheral_flex .peripheral_list .peripheral_txt {
  position: absolute;
}

#flyout_menu {
  position: absolute;
  top: 250px;
  right: 5px;
  width: 65px;
  color: #fff;
  padding: 5px;
  z-index: 1000;
  transition: top 0.3s ease;
}
@media (min-width: 768px) {
  #flyout_menu {
    width: 90px;
  }
}
#flyout_menu .menu-item {
  display: block;
  color: #fff;
  text-decoration: none;
  margin: 10px 0;
  transition: all 0.2s linear;
}

#flyout_menu .menu-item:hover {
  transform: scale(1.1);
}
#flyout_menu .menu-item:hover img { /* Safari */
  filter: hue-rotate(280deg);
}

/*about*/
.brand_left_flex {
  background: url(../images/about_basemap_1m.jpg) no-repeat left top/100%, #10191e;
  justify-content: flex-end;
  padding: 50% 0 25px;
  background-attachment: fixed;
}
@media (min-width: 1300px) {
  .brand_left_flex {
    padding: 150px 0;
    background: url(../images/about_basemap_1.jpg) no-repeat left top/100%, #10191e;
    background-attachment: fixed;
  }
}
@media (min-width: 1600px) {
  .brand_left_flex {
    padding: 150px 0px 50px;
    background: url(../images/about_basemap_1m.jpg) no-repeat left top/60%, #10191e;
    background-attachment: fixed;
  }
}
@media (min-width: 1930px) {
  .brand_left_flex {
    padding: 150px 0;
    background: url(../images/about_basemap_1.jpg) no-repeat left center/cover, #10191e;
    background-attachment: fixed;
  }
}
.brand_left_flex .brand_box {
  border-radius: 8px;
  padding: 38px 35px 30px;
  background: #22292c;
  width: 100%;
  margin: 0 14px;
}
@media (min-width: 1300px) {
  .brand_left_flex .brand_box {
    padding: 38px 43px 30px;
    margin: 0 60px;
  }
}
@media (min-width: 768px) {
  .brand_left_flex .brand_box {
    border-radius: 8px;
    padding: 38px 35px 30px;
    background: #22292c;
    width: 670px;
    margin: 0 14px;
  }
}
@media (min-width: 768px) and (min-width: 1300px) {
  .brand_left_flex .brand_box {
    padding: 38px 43px 30px;
    margin: 0 60px;
  }
}
.brand_left_flex .brand_box h3 {
  font-size: 2rem;
  font-weight: bold;
}
@media (min-width: 1300px) {
  .brand_left_flex .brand_box h3 {
    font-size: 1.8rem;
  }
}
@media (min-width: 1600px) {
  .brand_left_flex .brand_box h3 {
    font-size: 2rem;
  }
}
.brand_left_flex .brand_box p {
  font-size: 0.95rem;
  margin-top: 1rem;
}
@media (min-width: 768px) {
  .brand_left_flex .brand_box p {
    font-size: 1.125rem;
  }
}
@media (min-width: 1300px) {
  .brand_left_flex .brand_box p {
    font-size: 1rem;
  }
}
@media (min-width: 1600px) {
  .brand_left_flex .brand_box p {
    font-size: 1.125rem;
  }
}
.brand_left_flex:nth-of-type(2) {
  background: url(../images/about_basemap_2m.jpg) no-repeat left top/100%, #10191e;
  justify-content: flex-start;
}
@media (min-width: 1300px) {
  .brand_left_flex:nth-of-type(2) {
    padding: 150px 0;
    background: url(../images/about_basemap_2.jpg) no-repeat left top/100%, #10191e;
  }
}
@media (min-width: 1600px) {
  .brand_left_flex:nth-of-type(2) {
    padding: 15% 0px;
    background: url(../images/about_basemap_2m.jpg) no-repeat left center/cover, #10191e;
  }
}
@media (min-width: 1930px) {
  .brand_left_flex:nth-of-type(2) {
    padding: 150px 0;
    background: url(../images/about_basemap_2.jpg) no-repeat left center/cover, #10191e;
  }
}
.brand_left_flex:nth-of-type(2) .brand_box {
  border-radius: 8px;
  padding: 38px 35px 30px;
  background: #1a3b4a;
  width: 100%;
  margin: 0 14px;
}
@media (min-width: 1300px) {
  .brand_left_flex:nth-of-type(2) .brand_box {
    padding: 38px 43px 30px;
    margin: 0 60px;
  }
}
@media (min-width: 768px) {
  .brand_left_flex:nth-of-type(2) .brand_box {
    border-radius: 8px;
    padding: 38px 35px 30px;
    background: #1a3b4a;
    width: 670px;
    margin: 0 14px;
  }
}
@media (min-width: 768px) and (min-width: 1300px) {
  .brand_left_flex:nth-of-type(2) .brand_box {
    padding: 38px 43px 30px;
    margin: 0 60px;
  }
}
.brand_left_flex:nth-of-type(3) {
  background: url(../images/about_basemap_3m.jpg) no-repeat left top/100%, #161616;
  background-attachment: fixed;
}
@media (min-width: 1300px) {
  .brand_left_flex:nth-of-type(3) {
    padding: 150px 0;
    background: url(../images/about_basemap_3.jpg) no-repeat left top/100%, #10191e;
    background-attachment: fixed;
  }
}
@media (min-width: 1600px) {
  .brand_left_flex:nth-of-type(3) {
    padding: 15% 0px 15%;
    background: url(../images/about_basemap_3m.jpg) no-repeat left center/cover, #10191e;
    background-attachment: fixed;
  }
}
@media (min-width: 1930px) {
  .brand_left_flex:nth-of-type(3) {
    padding: 150px 0;
    background: url(../images/about_basemap_3.jpg) no-repeat left center/cover, #10191e;
    background-attachment: fixed;
  }
}
.brand_left_flex:nth-of-type(3) .brand_box {
  border-radius: 8px;
  padding: 38px 35px 30px;
  background: #4a4b54;
  width: 100%;
  margin: 0 14px;
}
@media (min-width: 1300px) {
  .brand_left_flex:nth-of-type(3) .brand_box {
    padding: 38px 43px 30px;
    margin: 0 60px;
  }
}
@media (min-width: 768px) {
  .brand_left_flex:nth-of-type(3) .brand_box {
    border-radius: 8px;
    padding: 38px 35px 30px;
    background: #4a4b54;
    width: 670px;
    margin: 0 14px;
  }
}
@media (min-width: 768px) and (min-width: 1300px) {
  .brand_left_flex:nth-of-type(3) .brand_box {
    padding: 38px 43px 30px;
    margin: 0 60px;
  }
}
.brand_left_flex:nth-of-type(4) {
  background: url(../images/about_basemap_4m.jpg) no-repeat left top/100%, #10191e;
  padding: 100% 0px 75px;
}
@media (min-width: 1300px) {
  .brand_left_flex:nth-of-type(4) {
    padding: 150px 0;
    background: url(../images/about_basemap_4.jpg) no-repeat left top/100%, #10191e;
  }
}
@media (min-width: 1600px) {
  .brand_left_flex:nth-of-type(4) {
    padding: 89px 0px 25%;
    background: url(../images/about_basemap_4.jpg) no-repeat left center/cover, #10191e;
  }
}
@media (min-width: 1930px) {
  .brand_left_flex:nth-of-type(4) {
    padding: 150px 0;
    background: url(../images/about_basemap_4.jpg) no-repeat left center/cover, #10191e;
  }
}
.brand_left_flex:nth-of-type(4) .brand_box {
  border-radius: 8px;
  padding: 38px 35px 30px;
  background: #274e71;
  width: 100%;
  margin: 0 14px;
}
@media (min-width: 1300px) {
  .brand_left_flex:nth-of-type(4) .brand_box {
    padding: 38px 43px 30px;
    margin: 0 60px;
  }
}
@media (min-width: 768px) {
  .brand_left_flex:nth-of-type(4) .brand_box {
    border-radius: 8px;
    padding: 38px 35px 30px;
    background: #274e71;
    width: 980px;
    margin: 0 14px;
  }
}
@media (min-width: 768px) and (min-width: 1300px) {
  .brand_left_flex:nth-of-type(4) .brand_box {
    padding: 38px 43px 30px;
    margin: 0 60px;
  }
}

/*community*/
.yt_slider {
  margin: 30px 0 70px;
}
.yt_slider iframe {
  width: 100%;
  height: 200px;
}
@media (min-width: 768px) {
  .yt_slider iframe {
    height: 350px;
  }
}

.community_flex {
  flex-wrap: wrap;
}
.community_flex .community_list {
  width: calc(100% - 2px);
  margin: 1px 1px 35px;
  display: grid;
}
.community_flex .community_list iframe {
  width: 100%;
  height: 200px;
  border: solid 4px #333333;
}
@media (min-width: 768px) {
  .community_flex .community_list iframe {
    width: 100%;
    height: 235px;
    border: solid 5px #333333;
  }
}
@media (min-width: 576px) {
  .community_flex .community_list {
    width: calc(50% - 30px);
    margin: 15px;
  }
}
@media (min-width: 768px) {
  .community_flex .community_list {
    width: calc(33.3333333333% - 30px);
  }
}

/*community end*/
.innovationSlider .item {
  padding: 0 10px;
  display: flex !important;
  justify-content: center;
}
.innovationSlider .instaWrap {
  border-radius: 8px;
  overflow: hidden;
}
.innovationSlider .slick-prev,
.innovationSlider .slick-next {
  z-index: 2;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 40%;
  background: rgba(255, 255, 255, 0.397);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.innovationSlider .slick-prev i,
.innovationSlider .slick-next i {
  font-size: 20px;
  color: #000000;
}
.innovationSlider .slick-prev {
  left: -17px;
}
.innovationSlider .slick-next {
  right: -17px;
}

.pandora_mv {
  text-align: center;
  position: relative;
}
.pandora_mv .pandora_mv_txt {
  position: absolute;
}
.pandora_mv video {
  width: 100%;
}

.product_box {
  background: url(../images/product_basemap.png) no-repeat top center/cover;
  padding: 0px 0 90px;
}
@media (min-width: 768px) {
  .product_box {
    padding: 120px 0;
  }
}
@media (min-width: 1930px) {
  .product_box {
    background: url(../images/product_basemap_l.png) no-repeat center/cover;
    padding: 0px 0 90px;
  }
}
.product_box .product_flex {
  justify-content: center;
  align-items: center;
  margin: 40px 20px 0;
}
@media (min-width: 768px) {
  .product_box .product_flex {
    margin: 40px 0 0;
  }
}
.product_box .product_flex .product_logo {
  padding: 0 40px 0px;
}
@media (min-width: 768px) {
  .product_box .product_flex .product_logo {
    padding: 0 40px;
  }
}
.product_box .product_flex .product_p {
  margin: 30px 0 0;
}
.product_box .product_flex .product_p h4 {
  margin: 14px 0;
}
.product_box .product_flex .product_p p {
  line-height: 27px;
  font-size: 0.938rem;
}
.product_box .graphics_flex {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
}
.product_box .graphics_flex .graphics_list {
  z-index: 4;
}
.product_box .graphics_flex .graphics_list a {
  display: block;
  background: #e02060;
  position: absolute;
  border-radius: 50px;
  left: 46px;
  top: 71px;
  width: 7px;
  height: 7px;
  box-shadow: 0px 0px 8px 3px #e02060;
  animation: light 1.5s infinite;
}
@media (min-width: 768px) {
  .product_box .graphics_flex .graphics_list a {
    width: 15px;
    height: 15px;
  }
  @keyframes light {
    0% {
      box-shadow: 0px 0px 14px 4px #e02060;
    }
    50% {
      box-shadow: 0px 0px 14px 8px #e02060;
    }
    100% {
      box-shadow: 0px 0px 14px 4px #e02060;
    }
  }
}
.product_box .graphics_flex .graphics_list:nth-of-type(2) a {
  left: 47%;
  top: 48%;
}
.product_box .graphics_flex .graphics_list:nth-of-type(3) a {
  left: 30%;
  top: 47%;
}
.product_box .graphics_flex .graphics_list:nth-of-type(3) a + a {
  left: 6%;
  top: 60%;
}
.product_box .graphics_flex .graphics_list:nth-of-type(4) a {
  left: 27%;
  top: 22%;
}
.product_box .graphics_flex .graphics_list:nth-of-type(4) a + a {
  left: 40%;
  top: 53%;
}

.gallery_flex {
  flex-wrap: wrap;
}
.gallery_flex .gallery_list {
  width: calc(50% - 10px);
  background: #262626;
  margin: 5px;
  align-items: center;
  padding: 20px;
  justify-content: center;
  display: flex;
  transition: all 0.2s linear;
  cursor: pointer;
}
@media (min-width: 768px) {
  .gallery_flex .gallery_list {
    width: calc(25% - 10px);
  }
}
.gallery_flex .gallery_list:hover {
  background: #707070;
}

.tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  -moz-column-gap: 5px;
  column-gap: 5px;
  margin: 0 auto 6em;
  width: 100%;
}
@media (min-width: 768px) {
  .tabs {
    flex-wrap: wrap-reverse;
  }
}
.tabs input[type=radio] {
  display: none;
}
.tabs input[type=radio]:checked + label {
  color: #fff;
  transform: translateY(1px);
  border-bottom: solid 1px #fbc700;
}
.tabs input[type=radio]:checked + label + .tab-content {
  display: block;
}
.tabs label {
  padding: 0.5em 0.45em;
  color: #616161;
  border-bottom: unset;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  cursor: pointer;
  order: 0;
}
@media (min-width: 768px) {
  .tabs label {
    padding: 0.5em 0.75em;
  }
}
.tabs label:hover {
  color: #fff;
}
.tabs .tab-content {
  display: none;
  padding: 1em;
  width: 100%;
  order: 1;
  position: relative;
  margin: 17px 0 0;
}
@media (min-width: 768px) {
  .tabs .tab-content {
    margin: 0;
  }
}

.extreme_box .product_title {
  font-size: 2rem;
  font-weight: bolder;
  margin: 20px 0 30px;
  text-align: center;
  color: #fff;
}
@media (min-width: 768px) {
  .extreme_box .product_title {
    font-size: 2.25rem;
    font-weight: bolder;
    margin: 20px 0 30px;
    text-align: center;
    color: #fff;
  }
}
.extreme_box .extreme_list {
  position: relative;
  z-index: 2;
  align-content: center;
  grid-template-rows: auto auto;
}
@media (min-width: 768px) {
  .extreme_box .extreme_list {
    grid-area: 1/1;
  }
}
.extreme_box .extreme_list:last-child {
  z-index: 1;
  padding: 10px 0 0;
}
@media (min-width: 768px) {
  .extreme_box .extreme_list:last-child {
    padding: 0;
  }
}
.extreme_box .extreme_list .extreme_flex {
  flex-wrap: wrap;
  margin: 0;
  justify-content: center;
}
@media (min-width: 768px) {
  .extreme_box .extreme_list .extreme_flex {
    margin: 0 23%;
    flex-wrap: nowrap;
  }
}
.extreme_box .extreme_list .extreme_flex .extreme_page {
  padding: 0 0px 20px;
  text-shadow: 0px 0px 5px #0c0c0c, 0px 0px 10px #0c0c0c, 0px 0px 15px #0c0c0c;
}
@media (min-width: 768px) {
  .extreme_box .extreme_list .extreme_flex .extreme_page {
    padding: 0 10px;
  }
}
.extreme_box .extreme_list.flex_bios {
  justify-content: right;
  margin: 0;
  align-items: center;
}
@media (min-width: 768px) {
  .extreme_box .extreme_list.flex_bios {
    margin: 18px 27px 0 0;
  }
}
.extreme_box .extreme_list h4 {
  margin: 0 0 14px;
  font-weight: 700;
  font-size: 1.4rem;
}
.extreme_box .extreme_bios {
  width: 100%;
}
@media (min-width: 768px) {
  .extreme_box .extreme_bios {
    width: 50%;
  }
}
.extreme_box .extreme_bios p {
  font-size: 0.9rem;
}
.extreme_box .features_row {
  margin: 30px 0 30%;
}
@media (min-width: 768px) {
  .extreme_box .features_row {
    margin: 30px 0 15.5%;
  }
}
.extreme_box .features_row .features_list {
  margin: 45px 0 0;
}
@media (min-width: 768px) {
  .extreme_box .features_row .features_list {
    margin: 0;
  }
}
.extreme_box .features_row .features_list h5 {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 20px 0;
}
@media (min-width: 768px) {
  .extreme_box .features_row .features_list h5 {
    margin: 30px 0;
  }
}
.extreme_box .features_row .features_list p {
  font-size: 0.938rem;
  line-height: 1.666em;
}
.extreme_box .features_row .features_list p + ul {
  margin: 0 0px 0 22px;
}
.extreme_box .features_row .features_list p + ul li {
  list-style: disc;
}
.extreme_box .features_row .features_list p + ul li ul {
  margin: 0 0px 0 22px;
}
.extreme_box .features_row .features_list p + small {
  font-size: 0.75rem;
}
.extreme_box .features_row .features_list img {
  background-image: linear-gradient(#ffffff, white), linear-gradient(35deg, #ffffff, rgba(255, 255, 255, 0), #ffffff);
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
  border-width: 1.2px;
  border-style: solid;
  border-color: transparent;
}

/*lightbox*/
.lightbox {
  display: none;
}
.lightbox:target {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1001;
}
.lightbox figcaption {
  width: 22rem;
  position: relative;
  background-color: #070707;
  text-align: center;
  line-height: 30px;
  color: #fff;
  box-shadow: 0px 0px 6px 1px #fff;
  border-radius: 8px;
  overflow: hidden;
}
.lightbox figcaption a {
  color: #5165f6;
}
.lightbox figcaption p {
  margin: 12px 25px 28px;
}
@media (min-width: 768px) {
  .lightbox figcaption {
    width: 40rem;
  }
}
.lightbox .closure {
  position: relative;
  display: block;
}
.lightbox .closure::after {
  content: "×";
  position: absolute;
  right: -2rem;
  top: -2rem;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #3a3a3a;
  color: white;
  border-radius: 50%;
  z-index: 1;
  cursor: pointer;
  font-size: 1.3rem;
}
.lightbox .closure::before {
  content: "";
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  cursor: default;
}

/*ScrollTrigger*/
.scrolltrigger {
  display: none;
}
.scrolltrigger:target {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1001;
}
.scrolltrigger figcaption {
  width: 22rem;
  position: relative;
  background-color: #070707;
  text-align: center;
  line-height: 30px;
  color: #fff;
  box-shadow: 0px 0px 6px 1px #fff;
  border-radius: 8px;
  overflow: hidden;
}
.scrolltrigger figcaption a {
  color: #5165f6;
}
.scrolltrigger figcaption p {
  margin: 12px 25px 28px;
}
@media (min-width: 768px) {
  .scrolltrigger figcaption {
    width: 40rem;
  }
}

/* 空div不佔空間 */
#close {
  display: none;
}

/*lightbox end*/
/*spec*/
.product-spec {
  text-align: center;
  margin: 0 0 45px;
}

.spec_title {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  color: rgb(255, 204, 0);
  text-align: left;
  font-size: 1.5rem;
  caption-side: top;
  margin: 0 0 19px;
  position: relative;
  display: inline-block;
}
.spec_title:before {
  width: 100%;
  height: 1px;
  background: #ffffff;
  bottom: 0px;
}

.spec-table {
  display: grid;
  grid-template-columns: 29% 1fr;
  border: 1px solid #666666;
  color: #ccc;
}
.spec-table dt {
  font-weight: bold;
  padding: 13px 30px;
  border-bottom: 1px solid #666666;
}
.spec-table dt:nth-of-type(odd) {
  background: #1c1c1c;
}
.spec-table dd {
  margin: 0;
  padding: 13px 30px;
  border-bottom: 1px solid #666666;
  border-left: solid 1px #666666;
}
.spec-table dd:nth-of-type(odd) {
  background: #1c1c1c;
}
.spec-table dd a {
  display: inline-block;
  color: #ccc;
  text-decoration: underline;
}
.spec-table dd a:hover {
  color: #ffcc00;
  text-decoration: none;
}
.spec-table dt:last-of-type,
.spec-table dd:last-of-type {
  border-bottom: none;
}
@media screen and (max-width: 500px) {
  .spec-table {
    grid-template-columns: 1fr;
  }
  .spec-table dt {
    background-color: #232323;
  }
  .spec-table dd {
    border-left: none;
  }
  .spec-table dd:nth-of-type(odd) {
    background: initial;
  }
}

/*news*/
.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 40px 20px;
  font-family: sans-serif;
  flex-wrap: wrap;
}
.pagination a {
  display: inline-block;
  min-width: 36px;
  font-size: 0.9rem;
  padding: 6px 12px 6px;
  text-align: center;
  text-decoration: none;
  border: 1px solid #707070;
  border-radius: 4px;
  color: #ffffff;
  transition: background-color 0.2s;
}
.pagination a:hover:not(.active):not(.disabled) {
  background-color: #f0f0f0;
  color: #212529;
}
.pagination a.active {
  background-color: #e0e0e0;
  color: #212529;
  font-weight: bold;
  pointer-events: none;
}
.pagination a.disabled {
  color: #212529;
  border-color: #eee;
  background-color: #fff;
  pointer-events: none;
}

.news_flex {
  justify-content: space-between;
  align-items: center;
  margin: 5em 0 15px;
}

.news_list {
  background: #0d0d0d;
  margin: 0 0px 25px;
  display: block;
  transition: all 0.2s linear;
  border-radius: 12px;
  overflow: hidden;
  color: white;
}
.news_list time {
  margin: 10px 0;
  display: block;
  font-size: 0.9rem;
}
.news_list .news_txt {
  padding: 7px 22px 25px;
}
.news_list .news_txt .news_title {
  font-size: 1.125rem;
  margin: 10px 0;
  line-height: 26px;
  font-size: 0.98rem;
}
.news_list .news_txt p {
  margin: 11px 0;
  color: #bfbfbf;
  font-weight: 300;
  font-size: 0.85rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 1.5;
}
.news_list:hover {
  transform: scale3d(1.03, 1.03, 1.03);
  color: white;
  background: #181818;
  text-decoration: blink;
}

/*news end*/
/*spec end*/
/*Review*/
.award-flex {
  flex-wrap: wrap;
  gap: 15px;
  margin: 0 0 65px;
}
@media (min-width: 768px) {
  .award-flex {
    margin: 0;
  }
}
.award-flex .award-list {
  width: 100%;
}
@media (min-width: 768px) {
  .award-flex .award-list {
    width: calc(50% - 8px);
  }
}
.award-flex .award-list .award-card {
  display: grid;
  grid-template-columns: 100px 1fr;
  background-color: #121212;
  color: #fff;
}
.award-flex .award-list .award-card .image {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 10px;
}
.award-flex .award-list .award-card .image img {
  max-width: 100%;
  height: auto;
}
.award-flex .award-list .award-card .info-table {
  display: grid;
  grid-template-columns: 120px 1fr;
  margin: 0 0 0 0;
}
.award-flex .award-list .award-card .info-table dt {
  padding: 4px 8px;
  background-color: #2c2c2c;
  color: #999;
  border-bottom: 1px solid #333;
  font-weight: 300;
}
.award-flex .award-list .award-card .info-table dt:last-child {
  border-bottom: none;
}
.award-flex .award-list .award-card .info-table dd {
  padding: 4px 8px;
  font-weight: 300;
  color: #fff;
  border-bottom: 1px solid #333;
  margin: 0;
}
.award-flex .award-list .award-card .info-table dd:last-child {
  border-bottom: none;
}
@media screen and (max-width: 600px) {
  .award-flex .award-list .award-card {
    grid-template-columns: 1fr;
  }
  .award-flex .award-list .award-card .info-table {
    grid-template-columns: 1fr 1fr;
  }
}
.award-flex.award_white .award-card {
  background: #4c4c4c;
}
.award-flex.award_white .award-card .info-table dt, .award-flex.award_white .award-card .info-table dd {
  border-bottom: 1px solid #959595;
}

/*Review end*/
/*download*/
.dl_box {
  margin: 35px 0;
  color: #ccc;
}
.dl_box .dl_title {
  margin: 0 0 10px;
  font-size: 1.25rem;
  color: white;
}
.dl_box .table-wrap {
  display: flex;
  flex-direction: column;
  font-size: 14px;
}
@media (min-width: 768px) {
  .dl_box .table-wrap {
    border: 1px solid #666666;
  }
}
.dl_box .table-header, .dl_box .table-row {
  display: flex;
  padding: 8px;
  border-bottom: 1px solid #666666;
  text-align: center;
}
.dl_box .table-header:last-child, .dl_box .table-row:last-child {
  border-bottom: solid 1px #595959;
}
@media (min-width: 768px) {
  .dl_box .table-header:last-child, .dl_box .table-row:last-child {
    border-bottom: none;
  }
}
.dl_box .table-header div, .dl_box .table-row div {
  flex: 1;
  padding: 4px 3px;
  word-break: break-word;
}
.dl_box .table-header div a, .dl_box .table-row div a {
  color: #ccc;
  font-size: 1.2rem;
}
.dl_box .table-header div a:hover, .dl_box .table-row div a:hover {
  color: #ffcc00;
}
.dl_box .table-header button, .dl_box .table-row button {
  padding: 4px 8px;
}
.dl_box .table-header {
  background: #1c1c1c;
  color: #fff;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .dl_box .table-header {
    display: none;
  }
  .dl_box .table-row {
    flex-direction: column;
    border: 1px solid #666666;
    margin-bottom: 8px;
  }
  .dl_box .table-row div {
    display: flex;
    justify-content: space-between;
    padding: 8px;
    border-bottom: solid 1px #595959;
  }
  .dl_box .table-row div:last-child {
    border-bottom: none;
  }
  .dl_box .table-row div::before {
    content: attr(data-label);
    font-weight: bold;
  }
  .dl_box .table-row div:nth-child(1)::before {
    content: "Type";
  }
  .dl_box .table-row div:nth-child(2)::before {
    content: "Ver.";
  }
  .dl_box .table-row div:nth-child(3)::before {
    content: "File Size";
  }
  .dl_box .table-row div:nth-child(4)::before {
    content: "OS";
  }
  .dl_box .table-row div:nth-child(5)::before {
    content: "Update";
  }
  .dl_box .table-row div:nth-child(6)::before {
    content: "Download";
  }
}

/*download end*/
/*community*/
.ig_box {
  margin: 60px 0;
}
.ig_box .ig_list {
  text-align: center;
}
.ig_box .ig_list iframe {
  display: inline-block !important;
}
.ig_box .product_title {
  font-size: 2rem;
  font-weight: bolder;
  margin: 20px 0 30px;
  text-align: center;
  color: #fff;
}
@media (min-width: 768px) {
  .ig_box .product_title {
    font-size: 2.25rem;
    font-weight: bolder;
    margin: 20px 0 30px;
    text-align: center;
    color: #fff;
  }
}

/*community end*/
/*spec*/
.tabs {
  display: flex;
  flex-wrap: wrap-reverse;
  justify-content: center;
  -moz-column-gap: 5px;
       column-gap: 5px;
  margin: 0 auto 6em;
  width: 100%;
}
.tabs input[type=radio] {
  display: none;
}
.tabs input[type=radio]:checked + label {
  color: #fff;
  transform: translateY(1px);
  border-bottom: solid 1px #fbc700;
}
.tabs input[type=radio]:checked + label + .tab-content {
  display: block;
}
.tabs label {
  padding: 0.5em 0.75em;
  color: #616161;
  border-bottom: unset;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  cursor: pointer;
  order: 0;
}
.tabs label:hover {
  color: #fff;
}
.tabs .tab-content {
  display: none;
  padding: 1em;
  width: 100%;
  order: 1;
  position: relative;
}

.features_flex {
  position: absolute;
  width: 38%;
  right: 13%;
  top: 32%;
  flex-wrap: nowrap;
}
.features_flex h4 {
  font-size: 1.4rem;
  font-weight: 700;
  margin: 0 0 15px;
}
.features_flex p {
  font-size: 0.938rem;
  line-height: 1.666em;
}

/*spec end*/
/*award_review*/
.award_flex {
  flex-wrap: wrap;
  justify-content: center;
}
@media (min-width: 996px) {
  .award_flex {
    justify-content: space-between;
  }
}

.award_review.news_flex {
  flex-wrap: wrap;
  justify-content: center;
}
.award_review.tabs {
  flex-wrap: wrap;
}

/*award_review end*/
/*Add to comparison list*/
#compare-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #242424;
  padding: 10px;
  display: flex;
  align-items: center;
  border-top: 1px solid #000000;
  z-index: 1000;
  transition: all 0.3s ease;
}
#compare-bar.hidden {
  display: none;
}
#compare-bar .compare-items {
  flex: 1;
  display: flex;
  gap: 10px;
  overflow-x: auto;
}
#compare-bar .compare-item {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 5px;
  background: #fff;
  font-size: 0.9rem;
  text-align: center;
  color: #000000;
  border-radius: 8px;
  flex-direction: column;
}
@media (min-width: 768px) {
  #compare-bar .compare-item {
    flex-direction: row;
    font-size: 0.95rem;
    text-align: left;
  }
}
#compare-bar .compare-item img {
  width: 95px;
}
#compare-bar .compare-item .remove-item {
  background: #f44336;
  color: #fff;
  border: none;
  cursor: pointer;
  border-radius: 50px;
  width: 25px;
  height: 25px;
}
#compare-bar #compare-btn {
  padding: 8px 16px;
  background: #5495dd;
  color: #fff;
  border: none;
  cursor: pointer;
  border-radius: 8px;
}
@media (max-width: 768px) {
  #compare-bar {
    padding: 10px;
    justify-content: space-between;
  }
  #compare-bar.collapsed .compare-items {
    display: none;
  }
  #compare-bar .compare-items {
    flex-wrap: nowrap;
    overflow-x: auto;
  }
  #compare-bar #compare-btn {
    flex-shrink: 0;
    padding: 8px 12px;
  }
  #compare-bar #toggle-compare {
    background: #5495dd;
    color: #fff;
    border: none;
    cursor: pointer;
    padding: 8px 12px;
    margin-right: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

.modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  align-items: center;
  justify-content: center;
}
.modal .modal-content {
  background: #fff;
  padding: 20px 30px;
  border-radius: 10px;
  max-width: 300px;
  width: 90%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  text-align: center;
  color: #262626;
}
.modal .modal-content button {
  margin-top: 15px;
  padding: 8px 20px;
  background: #5495dd;
  border: none;
  color: #fff;
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px;
}

/*Add to comparison list end*/
/*comparison*/
.result_flex {
  justify-content: right;
  padding: 15% 0 0px;
}
.result_flex .result_list a {
  display: block;
  color: white;
}
.result_flex .result_list a:hover {
  text-decoration: underline;
}

.comparison-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  box-sizing: border-box;
  overflow-x: auto;
  margin: 20px 0 80px;
}
.comparison-wrapper .comparison-container {
  overflow-x: auto;
  width: 100%;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  border-top: 1px solid #666666;
  border-right: 1px solid #666666;
}
.comparison-wrapper .comparison-container .comparison {
  display: flex;
  flex-direction: column;
  min-width: -moz-fit-content;
  min-width: fit-content;
}
.comparison-wrapper .comparison-container .comparison .comparison-group {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
}
.comparison-wrapper .comparison-container .comparison .comparison-group .comparison-list {
  border-bottom: 1px solid #666666;
  border-left: 1px solid #666666;
  padding: 25px 8px;
  word-break: break-word;
  overflow-wrap: break-word;
  min-width: 200px;
  text-align: center;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  flex-shrink: 0;
  color: white;
  flex-direction: column;
  font-size: 0.875rem;
}
.comparison-wrapper .comparison-container .comparison .comparison-group .comparison-list.headeritem {
  font-weight: bold;
  background: #f0f0f0;
  flex-direction: column;
}
.comparison-wrapper .comparison-container .comparison .comparison-group:nth-child(even) {
  background: #1c1c1c;
}
.comparison-wrapper .delete-btn {
  cursor: pointer;
  color: rgba(255, 255, 255, 0.295);
  font-size: 22px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.comparison-wrapper .delete-btn:hover {
  color: rgba(255, 255, 255, 0.767);
}
.comparison-wrapper .slider-btn {
  display: none;
  cursor: pointer;
  font-size: 24px;
  padding: 8px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: #555;
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  border-radius: 4px;
  margin: 0 5px;
}
.comparison-wrapper .slider-btn:hover {
  background-color: #eee;
}

@media (max-width: 1050px) {
  .comparison-wrapper .slider-btn {
    display: inline-flex;
  }
  .comparison-wrapper .comparison-container {
    overflow-x: auto;
    overflow-y: visible;
  }
  .comparison-wrapper .comparison-container .comparison .comparison-group {
    display: flex;
    flex-wrap: nowrap;
  }
  .comparison-wrapper .comparison-container .comparison .comparison-group .comparison-list {
    flex-shrink: 0;
  }
  .comparison-wrapper .comparison-container .comparison .comparison-group .comparison-list:first-child {
    position: sticky;
    left: 0;
    background: #000000;
    z-index: 2;
    border-right: 1px solid #ccc;
    min-width: 100px;
  }
}
/*comparison end*/
/*white series*/
.white_bg {
  background: #ffffff;
}
.white_bg .extreme_box .features_row {
  margin: 30px 0 15.5%;
  color: #333333;
}
.white_bg .extreme_box .title_b {
  font-size: 2.25rem;
  font-weight: bolder;
  margin: 20px 0 30px;
  text-align: center;
  color: #323232;
}
.white_bg .btn-light {
  background: #e9e9e9;
}
.white_bg .spec_title {
  color: #000;
}
.white_bg .spec_title:before {
  background: #ffcc00;
}
.white_bg .gallery_flex .gallery_list {
  background: #707070;
}
.white_bg .gallery_flex .gallery_list:hover {
  background: #262626;
}
.white_bg .dl_box {
  color: #1c1c1c;
}
.white_bg .dl_box .dl_title {
  color: #1c1c1c;
}
.white_bg .spec-table {
  color: #505050;
}
.white_bg .spec-table dt:nth-of-type(odd) {
  color: white;
  background: #505050;
}
.white_bg .spec-table dd:nth-of-type(odd) {
  color: white;
  background: #505050;
}

.white_series {
  justify-items: center;
  padding: 30px 0 73px;
  margin: 20px 0 0;
  background: url("../images/Product_white_kv_m.png") no-repeat bottom center/cover, linear-gradient(to top, #000000 0%, #ffffff 100%);
  grid-template-columns: repeat(16, 10%);
  grid-auto-rows: minmax(116px, auto);
}
@media (min-width: 768px) {
  .white_series {
    background: url("../images/Product_white_kv_2L.jpg") no-repeat bottom center/cover, linear-gradient(to top, #000000 0%, #ffffff 100%);
    grid-template-columns: repeat(16, 10%);
    grid-auto-rows: minmax(155px, auto);
  }
}
@media (min-width: 1300px) {
  .white_series {
    background: url("../images/Product_white_kv.png") no-repeat bottom center/cover, linear-gradient(to top, #000000 0%, #ffffff 100%);
    grid-template-columns: repeat(16, 10%);
    grid-auto-rows: minmax(300px, auto);
  }
}
.white_series .product_pic {
  grid-area: 2/2/3/10;
  display: grid;
  align-content: end;
}
@media (min-width: 768px) {
  .white_series .product_pic {
    grid-area: 2/3/3/9;
  }
}
@media (min-width: 1600px) {
  .white_series .product_pic {
    grid-area: 1/3/3/9;
  }
}
.white_series .product_pic .brand {
  bottom: 25%;
}
.white_series .product_pic .rtx {
  top: 39%;
}
.white_series .product_txt {
  grid-area: 3/2/3/10;
  display: grid;
  align-content: center;
}
@media (min-width: 1300px) {
  .white_series .product_txt {
    grid-area: 3/3/3/9;
  }
}
.white_series .product_txt p {
  padding-bottom: 105px;
}
@media (min-width: 768px) {
  .white_series .product_txt p {
    padding-bottom: 80px;
  }
}
@media (min-width: 1300px) {
  .white_series .product_txt p {
    padding-bottom: 10px;
  }
}

.chip_gradient {
  background: linear-gradient(to bottom, #000000 12%, #000000 39%);
}

.w_bg {
  background: url(../images/product_basemap_w.png) no-repeat center/cover, linear-gradient(to top, #ffffff 52%, #000000 100%);
  padding: 107px 0 142px;
}
.w_bg .product_flex {
  color: #333333;
}

.tabs_w input[type=radio]:checked + label {
  color: #222222;
}
.tabs_w label:hover {
  color: #222222;
}

.tabs_w .extreme_bios {
  color: #333333;
}
@media (min-width: 768px) {
  .tabs_w .extreme_bios {
    color: #ffffff;
  }
}

/*hearder*/
.header_w {
  border-bottom: 1px solid rgb(195, 195, 195);
}
.header_w .w_header {
  background: #fff;
}
.header_w .w_header .navbar-nav .nav-item .navitem-link {
  color: #484848;
}
.header_w .w_header .navbar-nav .nav-item .dropdown-menu {
  border: initial;
}
@media (min-width: 768px) {
  .header_w .w_header .navbar-nav .nav-item .dropdown-menu {
    border: solid 1px #c9c9c9;
  }
}
.header_w .w_header .navbar-nav .nav-item .dropdown-menu li a {
  color: #484848;
}
.header_w .w_header .navbar-toggler span {
  background: #999999;
}
.header_w .w_header .navbar-toggler span:before {
  background: #999999;
}
.header_w .w_header .navbar-toggler span:after {
  background: #999999;
}
.header_w .w_header .navbar-toggler:not(.collapsed) span {
  background: transparent;
}
.header_w .w_header .navbar-toggler:focus {
  box-shadow: initial;
}
.header_w .form-select {
  color: #292929;
  border-color: rgba(60, 60, 60, 0.5);
  background-image: url(../images/arrow_b.svg);
}
.header_w .form-select option {
  background-color: #fff;
}

.w_pa_menu .pa_menu_list h1 {
  color: #484848;
}
.w_pa_menu .pa_menu_list:last-child ul li a {
  color: #939393;
}
.w_pa_menu .pa_menu_list:last-child ul li a:hover {
  color: #484848;
}
.w_pa_menu .pa_menu_list:last-child ul li a.state {
  color: #484848;
}

/*contact*/
.contact_box {
  padding: 0 0 20px;
}
@media (min-width: 768px) {
  .contact_box {
    padding: 0 0 70px;
  }
}
.contact_box .container {
  position: relative;
}
.contact_box .container .contact_flex {
  color: white;
  justify-content: center;
  position: relative;
  flex-wrap: wrap;
  bottom: 0px;
  left: 0;
  right: 0;
  margin: 0 auto 60px;
}
@media (min-width: 1300px) {
  .contact_box .container .contact_flex {
    position: absolute;
    margin: 0 auto 0px;
    bottom: -30px;
  }
}
.contact_box .container .contact_flex .contact_list {
  background: rgba(0, 0, 0, 0.45);
  border: solid 1px #484848;
  padding: 20px 27px 5px;
  border-radius: 12px;
  width: calc(100% - 0px);
  margin: 0 2px 10px;
}
@media (min-width: 768px) {
  .contact_box .container .contact_flex .contact_list {
    width: calc(50% - 20px);
  }
}
@media (min-width: 1300px) {
  .contact_box .container .contact_flex .contact_list {
    width: calc(25% - 4px);
  }
}
.contact_box .container .contact_flex .contact_list h4 {
  font-weight: bolder;
  font-size: 1.28rem;
}
.contact_box .container .contact_flex .contact_list p {
  margin: 0;
}
.contact_box .container .contact_flex .contact_list ul {
  margin: 10px 0 17px;
}
.contact_box .container .contact_flex .contact_list ul li {
  line-height: 28px;
}
.contact_box .container .contact_flex .contact_list ul li a {
  color: #e5e5e5;
  display: inline-block;
  text-decoration: underline;
}
.contact_box .container .contact_flex .contact_list ul li a:hover {
  color: white;
  text-decoration: none;
}
.contact_box img {
  width: 100%;
}

/*rma*/
.tabs_box {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  -moz-column-gap: 5px;
       column-gap: 5px;
  margin: 0 auto;
}
.tabs_box input[type=radio] {
  display: none;
}
.tabs_box input[type=radio]:checked + label {
  color: #f2c917;
  transform: translatey(1px);
}
.tabs_box input[type=radio]:checked + label + .tab-content {
  display: block;
}
.tabs_box label {
  padding: 0.5em 0.75em;
  color: #939393;
  font-size: 1.25rem;
  font-weight: bold;
  border-bottom: unset;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  cursor: pointer;
  order: 0;
}
.tabs_box label:hover {
  color: #f2c917;
}
.tabs_box .tab-content {
  display: none;
  padding: 2em 0em;
  width: 100%;
  order: 1;
}
.tabs_box h4 {
  margin: 28px 0 5px;
}
.tabs_box p {
  margin: 0;
}
.tabs_box ul {
  margin: 7px 0 0 20px;
}
.tabs_box ul li {
  line-height: 28px;
  list-style: disc;
}

/*wallpapers*/
.bg-wall {
  margin: 15px 0px 30px;
}
.bg-wall figure {
  border: solid 1px #3f3f3f;
}
.bg-wall .bg-flex {
  justify-content: space-between;
}
.bg-wall .bg-flex .select_country {
  color: #7F7F7F;
  background: #000;
  border: 1px solid #4e4e4e;
  padding-left: 10px;
  width: 180px;
  height: 25px;
}

/*Authorized Social Media Channels*/
.social_box_flex {
  flex-wrap: wrap;
  justify-content: center;
}
.social_box_flex .social_flex {
  justify-content: space-around;
  flex-wrap: wrap;
  background: #0d0d0d;
  padding: 45px 15px;
  border-radius: 8px;
  margin: 5px;
  width: 100%;
  flex-direction: row;
}
@media (min-width: 768px) {
  .social_box_flex .social_flex {
    width: calc(50% - 10px);
    flex-direction: column;
    justify-content: flex-start;
  }
}
@media (min-width: 996px) {
  .social_box_flex .social_flex {
    width: calc(33.3333333333% - 10px);
  }
}
.social_box_flex .social_flex .platform-logo {
  margin: 0 0px 24px;
}
.social_box_flex .social_flex .social_list {
  text-align: center;
}
.social_box_flex .social_flex .social_list li {
  display: block;
  margin: 0 0px 22px 0px;
  padding: 0 0 0 20px;
  text-align: left;
  width: 100%;
}
@media (min-width: 768px) {
  .social_box_flex .social_flex .social_list li {
    display: inline-block;
    width: calc(50% - 28px);
  }
}
.social_box_flex .social_flex .social_list li h3 {
  font-size: 1rem;
}
.social_box_flex .social_flex .social_list li a {
  text-decoration: underline;
  color: #636363;
  font-size: 0.9rem;
}
.social_box_flex .social_flex .social_list li a:hover {
  text-decoration: none;
  color: white;
}

/*footer*/
.footer_w .navbar {
  background: #fff;
}
.footer_w .navbar .navitem-link {
  color: #4b4b4b;
}
.footer_w .navbar .navitem-link:hover {
  color: #000000 !important;
}
.footer_w .footer-secondary {
  border-top: 1px solid #c3c3c3;
}
.footer_w .social-icons a {
  color: #565656;
}
.footer_w .small {
  color: #565656;
}
.footer_w .small a {
  color: #565656;
}/*# sourceMappingURL=style.css.map */