@charset "UTF-8";

.a-images {
  width: 100%;
  position: -webkit-sticky;
  position: sticky;
  top: 0
}

@media (max-width:575px) {
  .a-images {
    position: relative
  }
}

.a-images__list {
  margin: 0;
  padding: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 1px solid var(--bg-blocks-color, #f7f8fa);
  border-radius: var(--border-radius, 6px);
  overflow: hidden;
  margin-bottom: var(--grid-gutter-width, 20px)
}

.a-images__item {
  position: relative;
  height: 600px;
  background: #fff
}

@media (max-width:1199px) {
  .a-images__item {
    height: 420px
  }
}

@media (max-width:767px) {
  .a-images__item {
    height: 310px
  }
}

.a-images__item .fancy-modal:first-child {
  width: 100%;
  height: 100%
}

.a-image-item__link {
  display: flex;
  align-items: center;
  justify-content: center
}

.a-thumbs-slider {
  margin-bottom: var(--grid-gutter-width, 20px)
}

.a-thumbs-slider__item {
  position: relative;
  display: block;
  height: 100px;
  background: #fff;
  -webkit-appearance: none;
  width: 100%;
  cursor: pointer;
  transition: opacity var(--transition-fast) linear;
  border: 1px solid var(--bg-blocks-color, #f7f8fa);
  border-radius: var(--border-radius, 6px)
}

.a-thumbs-slider__item:hover {
  opacity: .6
}

@media (max-width:989px) {
  .a-thumbs-slider__item {
    height: 70px
  }
}

.a-thumbs-slider__img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  padding: 6px
}

.owl-item.current .a-thumbs-slider__item {
  opacity: .6
}

.a-image-item__figure {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
  cursor: zoom-in;
  width: 100%;
  height: 100%;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0
}

.a-image-item__figure:after {
  content: '';
  position: absolute;
  background: #fff;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 1;
  transition: .3s opacity
}

.a-image-item__figure_zoomable:hover .a-image-item__img,
.a-image-item__figure_zoomable:hover:after {
  opacity: 0;
  pointer-events: none
}

.a-image-item__img {
  transition: opacity .5s;
  background: #fff;
  -o-object-fit: scale-down !important;
  object-fit: scale-down !important;
  position: relative;
  z-index: 2;
  height: 100% !important
}

.a-carousel__arrow {
  border: none;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  transition: all var(--transition-fast, .2s) linear;
  background-color: var(--bg-blocks-color, #f7f8fa);
  font-weight: 500;
  line-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-appearance: button;
  position: absolute;
  top: 50%;
  z-index: 99;
  transform: translateY(-50%);
}
.slides-slider {
  position: relative;
}
.image-slider__buttons {
  width: 100%;
}

.a-carousel__arrow:hover {
  background-color: var(--main-color, #2879fe);
  color: var(--hovered-text-color, #fff)
}
.a-carousel__arrow--left {
  left: 0;
}
.a-carousel__arrow--right {
  left: auto;
  right: 0;
}
.a-carousel__images {
  padding-left: 45px;
  position: relative
}
.swiper-slide-thumb-active .c-images__slider__img {
  border: 1px solid var(--main-color);
}
.a-carousel__images .owl-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly
}

.c-images__slider {
  margin-top: 10px
}

.c-images__slider__item {
  position: relative;
  display: block;
  height: 75px;
  background: #fff;
  cursor: pointer
}

.owl-item.current .c-images__slider__item {
  border: 1px solid var(--main-color)
}

@media (max-width:989px) {
  .c-images__slider__item {
    height: 70px
  }
}

.c-images__slider__item img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  padding: 6px
}

.slider-wrap {
  position: -webkit-sticky;
  position: sticky;
  top: 50px
}

.c-images .fancy-modal:first-child {
  width: 100%;
  height: 100%
}

.owl-nav {
  display: none
}

.c-carousel__images .owl-nav {
  display: block;
  position: absolute;
  width: 100%;
  top: 50%;
  height: 0 !important
}

.c-carousel__images .owl-prev {
  left: -20px
}

.c-carousel__images .owl-next {
  right: -20px
}

.c-main-img__inner {
  height: 100%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center
}

.c-main-img__wrap {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
  cursor: zoom-in;
  width: 100%;
  height: 100%;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0
}

.c-main-img__wrap:after {
  content: '';
  position: absolute;
  background: #fff;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 1;
  transition: .3s opacity
}

.c-images__link {
  display: flex;
  align-items: center;
  justify-content: center
}

.c-images__link {
  display: flex;
  align-items: center;
  justify-content: center
}

.c-main-img__wrap_zoomable:hover .c-main-img,
.c-main-img__wrap_zoomable:hover:after {
  opacity: 0;
  pointer-events: none
}

.c-main-img {
  transition: opacity .5s;
  background: #fff;
  -o-object-fit: scale-down !important;
  object-fit: scale-down !important;
  position: relative;
  z-index: 2;
  height: 100% !important
}

.c-carousel__images .owl-stage {
  display: block !important
}

.a-image-item {
  max-height: 400px
}

.a-image-item__img {
  -o-object-fit: scale-down;
  object-fit: scale-down
}

@media (max-width:450px) {
  .product__images .c-carousel {
    padding: 0
  }
}
