.circles-container {
	position: relative;
	width: 100%;
	max-width: 600px;
	height: 350px;
	/* padding-bottom: 80%; */
	/* 保持宽高比，响应式调整 */
	margin: 100px auto 50px auto;
}

.circle {
	position: absolute;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-family: Arial, sans-serif;
	font-weight: bold;
	text-align: center;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* 心灵鸡汤 - 黄色圆形 */
.circle-soul {
	width: 120px;
	height: 120px;
	background-color: #ff9a9e;
	color: #fff;
	font-size: 18px;
	top: 1%;
	left: 5%;
}

/* 情感 - 浅绿色大圆形 */
.circle-emotion {
	width: 180px;
	height: 180px;
	background-color: #d1fae5;
	color: #059669;
	font-size: 24px;
	top: 25%;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	/* 确保中间圆形在上方 */
}

/* 科技 - 浅绿色圆形 */
.circle-tech {
	width: 120px;
	height: 120px;
	background-color: #dcfce7;
	color: #059669;
	font-size: 18px;
	top: 4%;
	right: 5%;
}

/* 职场 - 浅蓝色圆形 */
.circle-career {
	width: 130px;
	height: 130px;
	background-color: #cce5ff;
	color: #004085;
	font-size: 24px;
	bottom: 5%;
	left: 8%;
}

/* 文化 - 淡紫色圆形 */
.circle-culture {
	width: 140px;
	height: 140px;
	background-color: #fff3cd;
	color: #856404;
	font-size: 22px;
	bottom: 8%;
	right: 3%;
}

/* 响应式调整 */
@media (max-width: 500px) {

	.circle-soul,
	.circle-tech,
	.circle-career,
	.circle-culture {
		width: 100px;
		height: 100px;
		font-size: 16px;
	}

	.circle-emotion {
		width: 150px;
		height: 150px;
		font-size: 20px;
	}
}