.c-carousel .slick-list {
  @apply w-full;
}

.c-carousel .slick-track {
  @apply h-full;
}

.c-carousel-pagination {
  bottom: 64px;

  @apply px-24 relative;

  &::after {
    content: '';
    height: 1px;
    top: 8px;

    @apply absolute w-full bg-white z-10 left-0 right-0 z-10;
  }

  ul {
    @apply flex justify-end;

    li {
      @apply mx-1;

      &.slick-active {
        button {
          @apply bg-black;
        }
      }

      button {
        font-size: 0;
        @apply flex h-4 w-4 rounded-full ease-in-out transition-colors duration-300 bg-white relative z-20;

        &:focus {
          @apply outline-none;
        }

        @screen md {
          &:hover {
            @apply bg-gray-500;
          }
        }
      }
    }
  }
}
