@charset "utf-8";

.case-list{width: 100%;background: #f5f8fc;padding: 80px 0 40px 0;}
.case-list ul{width: 100%;position: relative;}
.case-list .center{position: absolute;left: 50%;transform: translateX(-50%);}
.case-list .center::before{position: absolute;top: 0;content: "";width: 1px;left: 50%;top: 0px;height: 300px;background: #007ed3;}
.case-list .center::after{position: absolute;top: 0;content: "";width: 20px;left: 50%;top: 0px;transform: translateX(-50%);height: 2px;background: #007ed3;}

.case-list li .case-left{display: flex;justify-content: space-between;width: 814px;position: relative;}
.case-list li .text{width: 680px;overflow: hidden;}
.case-list li img:hover{transform: scale(1.1);}
.case-list li .text img.big-img{width: 100%;cursor: pointer;overflow: hidden;object-fit: cover;display: block;transition: all .6s linear;-webkit-transition: all .6s linear;}
.case-list li .text h3{font-size: 28px;line-height: 30px;color: #007ed3;font-family: "微软雅黑";display: inline-block;margin: 40px 0 22px 0;}
.case-list li .text .line{width: 48px;height: 2px;background: #007ed3;margin-bottom: 40px;}
.case-list li .text p{font-size: 18px;line-height: 36px;color: #666;font-family: "微软雅黑";}
.case-list li .text button{background: #007ed3;color: #fff;width: 150px;cursor: pointer;
	height: 48px;border: none;margin-top: 40px;border-radius: 30px;font-size: 18px;line-height: 36px;font-family: "微软雅黑";}
.case-list li .text button i{width: 6px;height: 10px;margin-left: 14px;}
.case-list li .right{height: 100%;}
.case-list li .right h2{right: 0;top: 50%;font-size: 72px;line-height: 36px;color: #007ed3;font-family: "Impact";position: absolute;}
.case-list li .right h2::before{position: absolute;top: 0;content: "";width: 1px;left: 50%;top: 80px;height: 300px;background: #007ed3;}
.case-list li .right h2::after{position: absolute;top: 0;content: "";width: 20px;left: 50%;top: 80px;transform: translateX(-50%);height: 2px;background: #007ed3;}
.case-list li:nth-child(2n){float: left;}
.case-list li:nth-child(odd){float: right;}
.case-list li:nth-child(odd) .right h2::before{position: absolute;top: 0;content: "";width: 1px;left: 4%;top: 80px;height: 300px;background: #007ed3;}
.case-list li:nth-child(odd) .right h2::after{position: absolute;top: 0;content: "";width: 20px;left: 4%;top: 80px;transform: translateX(-50%);height: 2px;background: #007ed3;}
.case-list li:nth-child(odd) .right h2{left: 0;}
.case-list li:not(:nth-child(2)){margin-top: -260px;}
.case-list li:nth-child(n+6){margin-top: -200px;}
.case-list li:last-child .right h2::before{height: 200px;}

@media (max-width:1680px) {
	.case-list li:nth-child(odd){width: 52%;}
	.case-list li:nth-child(2n){width: 52%;}
	.case-list li .case-left{width: 100%;}
	.case-list li .text{width: 84%;}
}
@media (max-width:1440px) {
	.case-list li .right h2{font-size: 52px;}
}
@media (max-width:1280px) {
	.case-list li .text h3{font-size: 22px;margin: 24px 0 10px 0;}
	.case-list li .text .line{margin-bottom: 24px;}
	.case-list li .text p{font-size: 16px;line-height: 30px;}
	.case-list li .text button{margin-top: 20px;font-size: 14px;width: 120px;height: 40px;}
	.case-list .center::before{height: 250px;}
	.case-list li .right h2::before{height: 180px;}
	.case-list li:nth-child(odd) .right h2::before{height: 180px;}
	.case-list li:nth-child(odd){height: 600px;}
	.case-list li:nth-child(2n){height: 600px;}
	.case-list li:nth-child(n+6){margin-top: -260px;}
}
@media (max-width:1080px) {
	.case-list{padding: 6% 0 2% 0;}
	.case-list .center::before{height: 230px;}
	.case-list li .right h2{font-size: 40px;}
}
@media (max-width:769px) {
	.case-list .center{display: none;}
	.case-list li{margin-bottom: 4%;}
	.case-list li:nth-child(odd){float: unset;width: 100%;height: auto;}
	.case-list li:nth-child(2n){float: unset;width: 100%;height: auto;}
	.case-list li:not(:nth-child(2)){margin-top: 0;}
	.case-list li:nth-child(odd) .case-left{justify-content: flex-start;}
	.case-list li:nth-child(odd) .right h2{left: unset;right: 0;}
	.case-list li:nth-child(odd) .right h2::before{left: 50%;}
	.case-list li:nth-child(odd) .right h2::after{left: 50%;}
	.case-list li .right h2{top: 0;}
	.vice-nav ul{justify-content: flex-start;}
}
@media (max-width:480px) {
	.case-list li .text h3{font-size: 18px;}
	.case-list li .text .line{margin-bottom: 2%;}
	.case-list li .text p{font-size: 12px;line-height: 24px;}
	.case-list li .text button{font-size: 12px;width:90px ;height: 30px;line-height: 30px;}
}


/* 解决方案 详情 */
.case-plan{width: 100%;background-color: rgb(245,248,252);padding: 80px  0;}
.case-plan .title-detail{text-align: center;}
.case-plan h2{font-size: 36px;line-height: 40px;font-weight: bold;color: #006fba;display: inline-block;margin-bottom: 80px;font-family:"微软雅黑";}
.case-plan .title-detail p{font-size: 18px;line-height: 36px;color: #666;font-family:"微软雅黑";text-align: left;text-indent: 2em;}
.big-img{margin-top: 70px;margin-bottom: 40px;width: 100%;}
.big-img img{width: 100%;object-fit: contain;}
.case-swiper{overflow: hidden;width: 100%;}
.swiper-slide .li{margin: 0 10px;}
.swiper-slide .img{border-radius: 18px;width: 100%;overflow: hidden;}
.swiper-slide .img img{width: 100%;object-fit: cover;transition: all .6s linear;-webkit-transition: all .6s linear;}

.swiper-slide .li:hover img{transform: scale(1.1);}
@media (max-width:1280px) {
	.case-plan{padding: 4% 0;}
	.big-img{margin: 4% 0 2% 0;}
	.case-plan h2{margin-bottom: 2%;font-size: 30px;line-height: 38px;}
	.case-plan .title-detail p{font-size: 16px;line-height: 32px;}
}
@media (max-width:769px) {
	.case-plan h2{font-size: 18px;}
	.case-plan .title-detail p{font-size: 14px;line-height: 28px;}
}
@media (max-width:480px) {
	.case-plan .title-detail p{line-height: 20px;}
	.swiper-slide .li{margin: 0 4px;}
}