body {
 	background-color: #f5f7f9;
 	color: #333;
 	line-height: 1.6;
 	margin: 0;
 	padding: 0;
}

.container {
 	max-width: 1200px;
 	margin: 0 auto;
 	background: white;
 	border-radius: 10px;
 	box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
 	overflow: hidden;
 	margin-top: 20px;
 	margin-bottom: 20px;
 	display: flex;
 	flex-direction: column;
 	min-height: calc(100vh - 40px);
}

header {
 	background: linear-gradient(135deg, #2c3e50, #4a6572);
 	color: white;
 	padding: 5px;
 	text-align: center;
 	font-size: 25px;
}

.tabs {
 	display: flex;
 	background: #e8ebf0;
 	border-bottom: 1px solid #d1d9e6;
}

.tab-btn {
 	flex: 1;
 	padding: 15px;
 	text-align: center;
 	background: #e8ebf0;
 	border: none;
 	cursor: pointer;
 	font-size: 16px;
 	font-weight: 500;
 	transition: all 0.3s;
 	border-bottom: 3px solid transparent;
 	text-decoration: none;
 	color: #333;
}

.tab-btn:hover {
 	background: #dbe0e8;
}

.tab-btn.active {
 	background: white;
 	border-bottom: 3px solid #0d6efd;
 	color: #0d6efd;
}

.content {
 	flex: 1;
 	padding: 20px;
}

.box {
 	width: 1000px;
 	height: 600px;
 	/* border: 2px solid red; */
 	margin: 0 auto;
 	position: relative;
 	overflow: hidden; /* 隐藏超出容器的部分 */
}

.box>.imglist {
 	width: 100%;
 	height: 100%;
}

.box>.imglist>a {
 	position: absolute;
 	width: 100%;
 	height: 100%;
 	display: none;
 	/* 让图片在链接容器中居中 */
 	display: none;
 	align-items: center;
 	justify-content: center;
}

.box>.imglist>a>img {
 	/* 关键修改：图片自动缩放并保持比例 */
 	max-width: 100%;
 	max-height: 100%;
 	width: auto;
 	height: auto;
 	object-fit: contain; /* 保持图片完整显示在容器内 */
}

.leftBtn,
.rightBtn {
 	position: absolute;
 	top: 50%;
 	transform: translate(0, -50%);
 	font-size: 50px;
 	font-weight: bold;
 	cursor: pointer;
 	color: white;
 	text-shadow: 0 0 10px rgba(0,0,0,0.5);
 	user-select: none;
 	z-index: 10; /* 确保按钮在图片上方 */
}

.leftBtn {
 	left: 10px;
}

.rightBtn {
 	right: 10px;
}

.btnlist {
 	position: absolute;
 	bottom: 20px;
 	left: 50%;
 	transform: translate(-50%, 0);
 	display: flex;
 	z-index: 10; /* 确保按钮在图片上方 */
}

.btnlist>span {
 	background: #ccc;
 	width: 20px;
 	height: 20px;
 	border-radius: 100%;
 	display: block;
 	margin-right: 10px;
 	cursor: pointer;
}

.btnlist>span:last-child {
 	margin-right: 0px;
}

.che {
 	background: blue !important;
}

.show {
 	display: flex !important; /* 改为flex以启用居中对齐 */
}

footer {
 	text-align: center;
 	padding: 20px;
 	color: #6c757d;
 	font-size: 14px;
 	border-top: 1px solid #d1d9e6;
 	margin-top: auto;
}
body {
				margin: 0;
				padding: 0;
			}

			.showlist {
				display: flex;
				padding: 20px;
				border-bottom: 1px solid #ccc;
			}

			.showlist>img {
				width: 250px;
				height: 150px;
				margin-right: 20px;
			}
			.showlist>.info{
				margin-left: 30px;
			}