.service-wrap11 {
  position: relative;
  cursor: url('../images/drag.webp'), auto;
}

.service-wrap11 .service-card-thumb-wrap {
  position: absolute;
  overflow: hidden;
  inset: 0 -340px;
  z-index: -1
}

@media(max-width: 1500px) {
  .service-wrap11 .service-card-thumb-wrap {
    inset: 0 -120px
  }
}

.service-wrap11 .service-card-thumb-wrap .service-card-thumb {
  position: absolute;
  inset: 0;
  opacity: 0;
  -webkit-transition: .4s;
  transition: .4s
}

.service-wrap11 .service-card-thumb-wrap .service-card-thumb:after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--primary-text-color);
  opacity: .2;
  -webkit-transition: .4s;
  transition: .4s
}

.service-wrap11 .service-card-thumb-wrap .service-card-thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.service-wrap11 .service-card-thumb-wrap .service-card-thumb.active {
  opacity: 1
}

.service-card-wrap11.item-active .service-card11 {
  border-left: 1px solid #fff;
  border-right: 1px solid #fff
}

.service-card-wrap11.item-active .service-card11:after {
  opacity: 1
}

.service-card-wrap11.item-active .service-card11 .active-box-content {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0)
}

@media(max-width: 767px) {
  .service-card-wrap11.swiper-slide-active .service-card11 {
    border-left: 1px solid #fff;
    border-right: 1px solid #fff
  }

  .service-card-wrap11.swiper-slide-active .service-card11:after {
    opacity: 1
  }

  .service-card-wrap11.swiper-slide-active .service-card11 .active-box-content {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
  }
}

.service-card11 {
  border-left: 1px solid hsla(0, 0%, 100%, .5);
  border-right: 1px solid hsla(0, 0%, 100%, .5);
  padding: 40px;
  height: 650px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-line-pack: justify;
  align-content: space-between;
  position: relative;
  -webkit-transition: .4s;
  transition: .4s;
  overflow: hidden
}

@media(max-width: 1399px) {
  .service-card11 {
    height: 550px
  }
}

@media(max-width: 991px) {
  .service-card11 {
    padding: 40px 30px
  }
}

@media(max-width: 767px) {
  .service-card11 {
    padding: 40px
  }
}

@media(max-width: 575px) {
  .service-card11 {
    height: 500px
  }
}

@media(max-width: 375px) {
  .service-card11 {
    padding: 40px 30px
  }
}

.service-card11:after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(11, 20, 34, .5);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  z-index: -1;
  opacity: 0;
  -webkit-transition: .4s;
  transition: .4s
}

.service-card11 .box-title {
  max-width: 230px;
  font-weight: 600;
  font-size: 24px;
  color: #fff;
}

.service-card11 .box-text {
  color: #fff;
}

.service-card11 .btn-group {
  margin-top: 20px
}

.service-card11 .active-box-content {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all .4s ease;
  transition: all .4s ease;
  -webkit-transform: translate(0, 50px);
  transform: translate(0, 50px)
}