.panel-blog-carousel.bc .swiper-horizontal>.swiper-scrollbar, .panel-blog-carousel.bc .swiper-scrollbar.swiper-scrollbar-horizontal {
  left: calc(var(--custom-rem, 1rem) * 0);
  bottom: calc(var(--custom-rem, 1rem) * 0);
  height: calc(var(--custom-rem, 1rem) * .2);
  width: 27.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(223 226 229 / var(--tw-bg-opacity))
}

@media (max-width: 767px) {
  .panel-blog-carousel.bc .swiper-horizontal>.swiper-scrollbar, .panel-blog-carousel.bc .swiper-scrollbar.swiper-scrollbar-horizontal {
    margin-left: calc(var(--custom-rem, 1rem) * 5)
  }
}

@media (min-width: 768px) {
  .panel-blog-carousel.bc .swiper-horizontal>.swiper-scrollbar, .panel-blog-carousel.bc .swiper-scrollbar.swiper-scrollbar-horizontal {
    width: 92rem
  }
}

.panel-blog-carousel.bc .swiper-wrapper {
  align-items: stretch
}

.panel-blog-carousel.bc .swiper-scrollbar-drag {
  --tw-bg-opacity: 1;
  background-color: rgb(0 101 189 / var(--tw-bg-opacity))
}

.panel-blog-carousel.bc .swiper-slide {
  margin-bottom: calc(var(--custom-rem, 1rem) * 5.2);
  height: auto
}

@media (min-width: 768px) {
  .panel-blog-carousel.bc .swiper-slide {
    margin-bottom: calc(var(--custom-rem, 1rem) * 3.2)
  }
}

.panel-blog-carousel.bc .panel-blog-carousel-prev circle, .panel-blog-carousel.bc .panel-blog-carousel-prev path, .panel-blog-carousel.bc .panel-blog-carousel-next circle, .panel-blog-carousel.bc .panel-blog-carousel-next path {
  transition: stroke 1s ease
}

.panel-blog-carousel.bc .panel-blog-carousel-prev circle, .panel-blog-carousel.bc .panel-blog-carousel-next circle {
  stroke: #dfe2e5
}

@media (hover: hover) and (pointer: fine) {
  .panel-blog-carousel.bc .panel-blog-carousel-prev[aria-disabled=false]:hover circle, .panel-blog-carousel.bc .panel-blog-carousel-prev[aria-disabled=false]:hover path, .panel-blog-carousel.bc .panel-blog-carousel-next[aria-disabled=false]:hover circle, .panel-blog-carousel.bc .panel-blog-carousel-next[aria-disabled=false]:hover path {
    stroke: #2a63b7
  }
}