/* 文章 FAQ */
.article-faq{
	margin: 36px 0 28px;
	padding-top: 28px;
}
.article-faq .faq-head{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 18px;
}
.article-faq .faq-heading{
	position: relative;
	margin: 0;
	padding-left: 14px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
	color: #111;
	flex: 1;
	min-width: 0;
}
.article-faq .faq-heading::before{
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 4px;
	height: 16px;
	margin-top: -8px;
	border-radius: 2px;
	background-color: #00B496;
}
.article-faq .faq-toggle-btn{
	flex-shrink: 0;
	height: 30px;
	padding: 0 14px;
	border: 1px solid #00B496;
	border-radius: 15px;
	background: #fff;
	color: #00B496;
	font-size: 12px;
	line-height: 28px;
	cursor: pointer;
	transition: background-color .25s ease, color .25s ease;
}
.article-faq .faq-toggle-btn:hover{
	background-color: #00B496;
	color: #fff;
}
.faq-list{
	padding: 16px 0;
	margin: 0;
}
.faq-item{
	margin-bottom: 12px;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0 2px 10px rgba(0,0,0,.06);
	overflow: hidden;
	transition: box-shadow .25s ease;
}
.faq-item:last-child{
	margin-bottom: 0;
}
.faq-item[open],
.faq-item:hover{
	box-shadow: 0 4px 16px rgba(0,0,0,.08);
}
.faq-item summary{
	position: relative;
	padding: 18px 48px 18px 20px;
	cursor: pointer;
	list-style: none;
	outline: none;
	-webkit-tap-highlight-color: transparent;
}
.faq-item summary::-webkit-details-marker,
.faq-item summary::marker{
	display: none;
	content: "";
}
.faq-item summary h4{
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.65;
	color: #222;
	transition: color .25s ease;
}
.faq-item summary:hover h4,
.faq-item[open] summary h4{
	color: #00B496;
}
.faq-item summary::after{
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 8px;
	height: 8px;
	margin-top: -6px;
	border-right: 2px solid #999;
	border-bottom: 2px solid #999;
	transform: rotate(45deg);
	transition: transform .28s ease, border-color .28s ease;
}
.faq-item[open] summary::after{
	border-color: #00B496;
	margin-top: -2px;
	transform: rotate(225deg);
}
.faq-content{
	padding: 0 48px 18px 20px;
	animation: faqFadeIn .28s ease;
}
.faq-content p{
	margin: 0;
	font-size: 16px;
	line-height: 1.85;
	color: #555;
	white-space: pre-wrap;
	word-break: break-word;
}
@keyframes faqFadeIn{
	from{opacity:0;transform:translateY(-4px);}
	to{opacity:1;transform:translateY(0);}
}
@media (max-width: 768px){
	.article-faq{
		margin: 28px 0 20px;
		padding-top: 22px;
	}
	.article-faq .faq-head{
		margin-bottom: 12px;
	}
	.article-faq .faq-heading{
		font-size: 16px;
	}
	.article-faq .faq-toggle-btn{
		height: 28px;
		padding: 0 10px;
		line-height: 26px;
		font-size: 12px;
	}
	.faq-list{
		padding: 12px;
		border-radius: 10px;
	}
	.faq-item{
		margin-bottom: 10px;
		border-radius: 8px;
	}
	.faq-item summary{
		padding: 14px 40px 14px 14px;
	}
	.faq-item summary h4{
		font-size: 14px;
	}
	.faq-item summary::after{
		right: 16px;
	}
	.faq-content{
		padding: 0 40px 14px 14px;
	}
	.faq-content p{
		font-size: 13px;
		line-height: 1.75;
	}
}
