@media (max-width: 767px) {
    .carousel-inner .carousel-item > div {
        display: none;
    }
    .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

/* medium and up screens */
@media (min-width: 768px) {
    
    .carousel-inner .carousel-item-end.active,
    .carousel-inner .carousel-item-next {
      transform: translateX(25%);
    }
    
    .carousel-inner .carousel-item-start.active, 
    .carousel-inner .carousel-item-prev {
      transform: translateX(-25%);
    }
}

.carousel-inner .carousel-item-end,
.carousel-inner .carousel-item-start { 
  transform: translateX(0);
}



		.swiper[data-v-b8bb2b00] {
			position: relative;
			overflow: hidden;
			height: 436px;
			max-width: 1920px;
			margin: 0 auto
		}

		.swiper-slide[data-v-b8bb2b00] {
			overflow: hidden;
			width: 450px; 
			height: 364px;
			-webkit-transition: all .8s cubic-bezier(.19, 1, .22, 1);
			transition: all .8s cubic-bezier(.19, 1, .22, 1)
		}

		.swiper-slide[data-v-b8bb2b00]:hover {
			width: 780px !important;
		}

		.swiper-slide:hover .solution-info[data-v-b8bb2b00] {
			background-color: rgba(42, 42, 42, 0.65);
			
		}

		.swiper-slide:hover .solution-info h2[data-v-b8bb2b00] {
			margin-top: 0
		}

		.solution-info[data-v-b8bb2b00] {
			display: block;
			width: 100%;
			height: 100%;
			position: absolute;
			left: 0;
			top: 0;
			padding: 32px 32px 0;
			color: #fff
		}

		.solution-info[data-v-b8bb2b00],
		.solution-info h2[data-v-b8bb2b00] {
			-webkit-transition: all 1s cubic-bezier(.19, 1, .22, 1);
			transition: all 1s cubic-bezier(.19, 1, .22, 1)
		}

		.solution-info h2[data-v-b8bb2b00] {
			font-weight: 600;
			font-size: 22px;
			margin-bottom: 0;
			margin-top: 272px
		}

		.solution-info div[data-v-b8bb2b00] {
			margin-top: 32px;
			font-size: 18px
		}

		.solution-info span.iconfont[data-v-b8bb2b00] {
			display: block;
			margin-top: 56px;
			font-size: 42px
		}

		.swiper-btn-wrap[data-v-b8bb2b00] {
			width: 100%;
			height: 364px;
			position: absolute;
			top: 0;
			left: 0;
			font-size: medium
		}

		.swiper-btn-wrap .container[data-v-b8bb2b00] {
			height: 100%;
			position: relative
		}

		.swiper-button[data-v-b8bb2b00] {
			width: 50px;
			height: 64px;
			line-height: 64px;
			-webkit-transform: translateY(-50%);
			transform: translateY(-50%);
			text-align: center;
			background-color: rgba(0, 0, 0, .2);
			background-image: none;
			color: #fff;
			z-index: 1;
			-webkit-transition: all .8s cubic-bezier(.19, 1, .22, 1);
			transition: all .8s cubic-bezier(.19, 1, .22, 1)
		}

		.swiper-button span[data-v-b8bb2b00] {
			font-size: 24px
		}

		.swiper-button[data-v-b8bb2b00]:hover {
			background-color: #0e5fac
		}

		@media screen and (max-width:768px) {
			.swiper[data-v-b8bb2b00] {
				height: 9.6rem
			}

			.swiper-slide[data-v-b8bb2b00] {
				height: 8.32rem
			}

			.swiper-slide[data-v-b8bb2b00]:hover {
				width: 100% !important
			}

			.swiper-slide:hover .solution-info[data-v-b8bb2b00] {
				background-color: transparent
			}

			.swiper-slide:hover .solution-info h2[data-v-b8bb2b00] {
				margin-top: 0
			}

			.solution-info[data-v-b8bb2b00] {
				padding: .4rem .4rem 0
			}

			.solution-info h2[data-v-b8bb2b00] {
				margin-top: 0;
				font-size: .426667rem
			}

			.solution-info div[data-v-b8bb2b00] {
				margin-top: .746667rem;
				font-size: .426667rem
			}

			.solution-info span.iconfont[data-v-b8bb2b00] {
				margin-top: .746667rem;
				font-size: 1.013333rem
			}
		}