﻿
.program-list {
	display: grid;
	gap: calc(1vw + 10px); /* 灵活控制间距 */
	padding: 20px;
}

/* 移动端：每行最多 2 个 */
@media (max-width: 767px) {
	.program-list {
		grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	}
}

/* 平板及以上：每行最多 3 个 */
@media (min-width: 768px) {
	.program-list {
		grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	}
}

/* 可选：强制在 >= 768px 的设备中只显示最多 3 个/行 */
@media (min-width: 768px) and (max-width: 9999px) {
	.program-list {
		grid-template-columns: repeat(3, minmax(240px, 1fr));
	}
}
.program-list .product_c {
	position: relative;
	width: 100%;
	aspect-ratio: 10 / 16; /* iPhone 屏幕比例 */
	background: url('../images/project/mobile.png') no-repeat center center / contain;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 50px;
}
.program-list .swiper {

	width: calc(100% - 30px); /* 增加宽度 */
	height: calc(100% - 10px); /* 增加高度 */
	border-radius: 30px;
	overflow: hidden;
}

/* 移动端：每行最多 2 个 */
@media (max-width: 767px) {
	.program-list .swiper {

		width: calc(100% - 48px); /* 增加宽度 */
		height: calc(100% - 16px); /* 增加高度 */
		border-radius: 16px;
		overflow: hidden;
	}
}

/* 平板及以上：每行最多 3 个 */
@media (min-width: 768px) {
	.program-list .swiper {

		width: calc(100% - 80px); /* 增加宽度 */
		height: calc(100% - 10px); /* 增加高度 */
		border-radius: 30px;
		overflow: hidden;
	}
}

/* 可选：强制在 >= 768px 的设备中只显示最多 3 个/行 */
@media (min-width: 768px) and (max-width: 9999px) {
	.program-list .swiper {

		width: calc(100% - 106px); /* 增加宽度 */
		height: calc(100% - 26px); /* 增加高度 */
		border-radius: 34px;
		overflow: hidden;
	}
}
.product_c  .swiper .swiper-wrapper {
	width: 100%;
	height: 100%;
}

.product_c  .swiper .swiper-slide {
	width: 100%;
	height: 100%;
}
.program-list .swiper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/*border-radius: 30px;*/
}
.product_c .bt-title{
	position: absolute;
	width: 100%;
	text-align: center;
	bottom: -40px;
}




