/* slick sliders css */
.slick-use {
    position: relative;
    z-index: 1;
}
.slick-list {
    position: relative;
    z-index: 1;
}
.slick-list.draggable {
    overflow: hidden;
}
.slick-track {
    display: grid;
    grid-auto-flow: column; 
    gap: 0;
}
.slick-track > * {
    box-sizing: border-box;
}
.slick-vertical .slick-track {
    display: block;
    gap: 0;
}
.slick-arrow {
    position: absolute;
    z-index: 100;
    inset: 0;
    margin: auto;
    width: max-content;
    height: max-content;
    font-size: 0;
    padding: .5rem 1.15rem;
    background-color: rgba(0,0,0,.15);
    outline: 0 !important;
    border-radius: 50%;
    border: none;
}
.slick-arrow:hover {
    background-color: rgba(0,0,0,.35);
}
.slick-arrow::after {
    content: '\E839';
    font-family: 'sipico';
    font-size: 2rem;
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.slick-arrow.slick-next {
    margin: auto 1rem auto auto;
}
.slick-arrow.slick-prev {
    margin: auto auto auto 1rem;
}
.slick-arrow.slick-prev::after {
    content: '\E83A';
}

.slick-use .slick-arrow {
    opacity: .2;
}
.slick-use:hover .slick-arrow {
    opacity: 1;
}

.slick-dots {
    margin: 0;
    padding: .25rem;
    list-style: none;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    justify-content: center;
}
.slick-dots > li {
    margin: 0;
    padding: 0;
    list-style: none;
}
.slick-dots > li > button {
    display: block;
    padding: 0;
    margin: 0;
    background-color: rgba(0,0,0,.15);
    border-radius: 50%;
    font-size: 0;
    width: 1rem;
    height: 1rem;
    cursor: pointer;
    outline: none;
    border: none;
}
.slick-dots > li > button:hover {
    background-color: rgba(0,0,0,.25);
}
.slick-dots > li.slick-active > button {
    background-color: rgba(0,0,0,.45);
    cursor: default;
}

.slick-vertical .slick-arrow.slick-next {
    transform: rotate(90deg);
}
.slick-vertical .slick-arrow.slick-prev {
    transform: rotate(90deg);
}

.slick-slide.dragging a {
    pointer-events:none
}

.slick-use:not(.slick-initialized) > * + * {
    display: none;
}

.slick-track > * {
    padding: .75rem;
}
.slick-list {
    margin-left: -.75rem;
    margin-right: -.75rem;
}


.trans300, .slick-arrow { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.trans700 { -webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -ms-transition: all 0.7s ease; -o-transition: all 0.7s ease; transition: all 0.7s ease; }
