@charset "utf-8";
/*
	易菇网 · 手机版专题详情（/special/show.php?itemid=X）
	前缀 zt-m- 与 wp-/ui-/list- 隔离，仅 template/mobile/special/topic_show.htm 使用
*/

.zt-m-hero { background: #FFFFFF; overflow: hidden; scroll-margin-top: 48px; }
.zt-m-hero-img { background: #F1F7F4; line-height: 0; }
.zt-m-hero-img img { display: block; width: 100%; height: auto; max-height: 300px; object-fit: cover; }
.zt-m-hero-nopic {
	background-image: radial-gradient(120% 130% at 84% 0%, rgba(61,214,140,.26), transparent 62%),
	                  radial-gradient(90% 90% at 6% 100%, rgba(38,198,218,.18), transparent 60%),
	                  linear-gradient(135deg,#F2FAF6,#FFFFFF 60%,#F0F8FB);
}
.zt-m-hero-body { padding: 13px 13px 14px; display: flex; flex-direction: column; flex-wrap: nowrap; gap: 8px; }
.zt-m-tags { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.zt-m-tags i {
	font-style: normal; height: 21px; line-height: 21px; padding: 0 9px; border-radius: 11px;
	font-size: 11px; font-weight: 700; color: #0F8A5B;
	background: rgba(61,214,140,.14); border: 1px solid rgba(61,214,140,.34);
}
.zt-m-tags i.hot { color: #B4471F; background: rgba(242,84,91,.1); border-color: rgba(242,84,91,.3); }
.zt-m-hero h1 {
	margin: 0; font-size: 19px; line-height: 1.45; font-weight: 800; color: #12332A;
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
	max-height: 4.35em; overflow: hidden;
}
.zt-m-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; font-size: 11.5px; color: #86988F; }
.zt-m-meta span { position: relative; }
.zt-m-meta span + span::before {
	content: ''; position: absolute; left: -7px; top: 50%; width: 3px; height: 3px; margin-top: -1px;
	border-radius: 50%; background: #C6D8CE;
}
.zt-m-leadbox {
	padding: 11px 14px; background: #FFFFFF; font-size: 13.5px; line-height: 1.85; color: #4A6A5E;
	border-bottom: 1px solid #EDF4F0;
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
	max-height: 5.55em; overflow: hidden;
}

/* 横向锚点导航 */
.zt-m-nav {
	position: sticky; top: 0; z-index: 20;
	background: #FFFFFF; border-bottom: 1px solid #EDF4F0;
	box-shadow: 0 2px 10px rgba(18,51,42,.05);
	margin-bottom: 9px;
}
.zt-m-nav-in {
	display: flex; align-items: center; flex-wrap: nowrap; gap: 8px;
	padding: 8px 12px; overflow-x: auto; overflow-y: hidden;
	-webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.zt-m-nav-in::-webkit-scrollbar { display: none; height: 0; }
.zt-m-nav-in a:link, .zt-m-nav-in a:visited {
	flex: 0 0 auto; height: 30px; line-height: 30px; padding: 0 14px; border-radius: 15px;
	font-size: 13px; font-weight: 600; color: #33544A; text-decoration: none;
	background: #F4FAF7; border: 1px solid #E6F0EB;
}
.zt-m-nav-in a.on:link, .zt-m-nav-in a.on:visited { background: #0F8A5B; color: #FFFFFF; border-color: #0F8A5B; }

/* 板块 */
.zt-m-sec {
	background: #FFFFFF; margin: 0 0 9px; padding: 12px 12px 14px;
	border-top: 1px solid #EDF4F0; border-bottom: 1px solid #EDF4F0;
	scroll-margin-top: 48px;
}
.zt-m-sh { display: flex; align-items: center; gap: 8px; margin-bottom: 11px; }
.zt-m-sh::before { content: ''; display: block; width: 3px; height: 14px; border-radius: 2px; background: linear-gradient(180deg,#3DD68C,#26C6DA); flex: 0 0 auto; }
.zt-m-sh b { font-size: 15.5px; font-weight: 800; color: #12332A; }
.zt-m-sh em { font-style: normal; font-size: 11px; font-weight: 600; color: #7E958A; background: #F2F8F5; border-radius: 8px; padding: 2px 7px; }
.zt-m-sh a:link, .zt-m-sh a:visited { margin-left: auto; font-size: 12px; color: #0F8A5B; text-decoration: none; white-space: nowrap; }
.zt-m-bd { font-size: 14px; line-height: 1.95; color: #2E4A40; }
.zt-m-lead { margin: 0 0 12px; font-size: 14px; line-height: 1.95; color: #2E4A40; text-indent: 2em; }
.zt-m-rich { font-size: 14px; line-height: 1.95; color: #2E4A40; word-break: break-word; }
.zt-m-rich img { max-width: 100% !important; height: auto !important; border-radius: 8px; }
.zt-m-rich p { margin: 0 0 12px; text-indent: 2em; }
.zt-m-sum { margin-top: 12px; padding: 11px 13px; border-radius: 10px; background: linear-gradient(135deg, rgba(124,107,245,.07), rgba(38,198,218,.05)); border: 1px solid rgba(124,107,245,.2); }
.zt-m-sum b { display: block; font-size: 12px; font-weight: 800; color: #6A5AE0; margin-bottom: 6px; letter-spacing: .6px; }
.zt-m-sum p { margin: 0; font-size: 13.5px; line-height: 1.9; color: #2E4A40; text-indent: 2em; }
.zt-m-sum-jy { margin: 0 0 12px; background: linear-gradient(135deg, rgba(61,214,140,.09), rgba(38,198,218,.05)); border-color: rgba(61,214,140,.26); }
.zt-m-sum-jy b { color: #0F8A5B; }

.zt-m-noimg { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 11px; letter-spacing: 2px; color: #A2B7AC; background: linear-gradient(135deg,#EAF4EF,#F5FAF7); }

/* 图片墙 2 列 */
.zt-m-pg { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.zt-m-pc { display: block; text-decoration: none; }
.zt-m-pic { position: relative; width: 100%; aspect-ratio: 4 / 3; border-radius: 8px; overflow: hidden; background: #F1F7F4; }
.zt-m-pic img { display: block; width: 100%; height: 100%; object-fit: cover; }
.zt-m-pc b {
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
	max-height: 3.2em; overflow: hidden; margin-top: 6px;
	font-size: 13px; line-height: 1.6; font-weight: 600; color: #12332A;
}

/* 视频 1 列 */
.zt-m-vg { display: grid; grid-template-columns: 1fr; gap: 12px; }
.zt-m-vc { display: block; text-decoration: none; }
.zt-m-vpic { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: #0E2A22; }
.zt-m-vpic img { display: block; width: 100%; height: 100%; object-fit: cover; }
.zt-m-play { position: absolute; left: 50%; top: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; border-radius: 50%; background: rgba(8,26,20,.46); border: 2px solid rgba(255,255,255,.86); }
.zt-m-play::after { content: ''; position: absolute; left: 50%; top: 50%; width: 0; height: 0; margin: -7px 0 0 -4px; border-left: 11px solid #FFFFFF; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.zt-m-vc b { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; max-height: 3.2em; overflow: hidden; margin-top: 6px; font-size: 13.5px; line-height: 1.6; font-weight: 600; color: #12332A; }

/* 图文 1 列 */
.zt-m-lg { display: flex; flex-direction: column; flex-wrap: nowrap; gap: 9px; }
.zt-m-li { display: flex; align-items: flex-start; gap: 10px; padding: 9px; border-radius: 9px; background: #FAFDFC; border: 1px solid #EDF4F0; text-decoration: none; }
.zt-m-lpic { flex: 0 0 100px; width: 100px; height: 70px; border-radius: 7px; overflow: hidden; background: #F1F7F4; }
.zt-m-lpic img { display: block; width: 100%; height: 100%; object-fit: cover; }
.zt-m-ltx { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; flex-wrap: nowrap; gap: 6px; }
.zt-m-ltx b { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; max-height: 3.1em; overflow: hidden; font-size: 13.5px; line-height: 1.55; font-weight: 600; color: #12332A; }
.zt-m-ltx span { font-size: 11px; color: #94A99E; }

/* 速览条 */
.zt-m-brief { display: flex; flex-direction: column; flex-wrap: nowrap; }
.zt-m-brief-i { display: flex; align-items: center; gap: 9px; padding: 11px 2px; border-bottom: 1px dashed #EDF4F0; text-decoration: none; }
.zt-m-brief-i:last-child { border-bottom: 0; }
.zt-m-brief-i i { flex: 0 0 auto; width: 5px; height: 5px; border-radius: 50%; background: #3DD68C; }
.zt-m-brief-i b { flex: 1 1 auto; min-width: 0; font-size: 14px; line-height: 1.55; font-weight: 600; color: #12332A; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zt-m-brief-i span { flex: 0 0 auto; font-size: 11px; color: #A2B7AC; }

/* 关键词 */
.zt-m-kws { display: flex; flex-wrap: wrap; gap: 8px; }
.zt-m-kws a:link, .zt-m-kws a:visited { padding: 5px 12px; border-radius: 14px; font-size: 12.5px; color: #2E7A5C; text-decoration: none; background: #F2F9F5; border: 1px solid #DFF0E7; }

/* 同栏目 / 热门 */
.zt-m-rl, .zt-m-hl { display: flex; flex-direction: column; flex-wrap: nowrap; }
.zt-m-rl a:link, .zt-m-rl a:visited { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px dashed #EDF4F0; text-decoration: none; }
.zt-m-rl a:last-child { border-bottom: 0; }
.zt-m-rl b { flex: 1 1 auto; min-width: 0; font-size: 13.5px; font-weight: 600; color: #2E4A40; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zt-m-rl span { flex: 0 0 auto; font-size: 11px; color: #A2B7AC; }
.zt-m-hl a:link, .zt-m-hl a:visited { display: flex; align-items: flex-start; gap: 8px; padding: 8px 0; border-bottom: 1px dashed #EDF4F0; text-decoration: none; }
.zt-m-hl a:last-child { border-bottom: 0; }
.zt-m-hl i { flex: 0 0 18px; width: 18px; height: 18px; line-height: 18px; text-align: center; font-style: normal; font-size: 10px; font-weight: 700; color: #85998E; background: #F2F8F5; border-radius: 4px; margin-top: 1px; }
.zt-m-hl a:nth-child(1) i, .zt-m-hl a:nth-child(2) i, .zt-m-hl a:nth-child(3) i { background: #0F8A5B; color: #FFFFFF; }
.zt-m-hl b { flex: 1 1 auto; min-width: 0; font-size: 13px; line-height: 1.6; font-weight: 600; color: #2E4A40; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; max-height: 3.2em; overflow: hidden; }
.zt-m-hl span { flex: 0 0 auto; font-size: 11px; color: #A2B7AC; margin-top: 1px; }

/* 空态 / 分页 / 播放 */
.zt-m-empty { padding: 44px 0; text-align: center; font-size: 13px; color: #94A99E; }
.zt-m-pages { margin-top: 14px; text-align: center; font-size: 13px; }
.zt-m-pt { width: 100%; background: #0B1F19; border-radius: 9px; overflow: hidden; }
.zt-m-pt video, .zt-m-pt iframe { display: block; width: 100%; height: auto; }

@media screen and (max-width: 360px) {
	.zt-m-pg { grid-template-columns: 1fr; }
	.zt-m-lpic { flex: 0 0 88px; width: 88px; height: 62px; }
	.zt-m-cover h1 { font-size: 17px; }
}
/* 总结语（页面底部） */
.zt-m-end { background: linear-gradient(135deg, rgba(124,107,245,.06), rgba(38,198,218,.045) 52%, rgba(61,214,140,.07)); }
.zt-m-end .zt-m-sh::before { background: linear-gradient(180deg,#7C6BF5,#26C6DA); }
.zt-m-end .zt-m-sh b { color: #6A5AE0; }
.zt-m-endp { margin: 0; font-size: 14px; line-height: 1.95; color: #2E4A40; text-indent: 2em; }
.zt-m-end-inline { margin-top: 12px; padding: 12px 13px; border-radius: 10px; border: 1px solid rgba(124,107,245,.2); }