/**
 * 关于我们：单文件样式（页面专用，仅配合 common.css）
 * 资质证书轮播使用原站同款 Swiper 7.2（swiper-bundle），封面流动效依赖 overflow:visible + 等宽 slide。
 */

/* ----- Swiper 5 精简（资质证书轮播） ----- */
.swiper-container {
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: visible;
	list-style: none;
	padding: 0;
	z-index: 1;
}
.swiper-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: flex;
	transition-property: transform;
	box-sizing: content-box;
}
.swiper-slide {
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	position: relative;
	transition-property: transform;
}
:root {
	--swiper-navigation-size: 44px;
}
.swiper-button-next,
.swiper-button-prev {
	--swiper-navigation-color: #007aff;
	color: #007aff;
}

/* ========= 与 common.css 固定顶栏、页脚的协调 ========= */
.page-about {
	padding-top: var(--page-header-offset, 118px);
	background: #fff;
	overflow-x: hidden;
}

/* 原先用 commbann 的 margin-top 顶开固定头，易与 margin 折叠/子元素 z-index 打架；改为 .page-about 内边距更稳 */
.page-about .commbann {
	margin-top: 0 !important;
	position: relative;
	z-index: 0;
	line-height: 0;
	background: #111;
}

#top {
	z-index: 210;
	background: #fff;
}

/* 强化顶栏内导航所在行仍在白底上（避免被下方深色横幅“透”上来造成错觉） */
#top .content {
	background: #fff;
}

/* 底部文字色对齐参考站 www.hke28.com */
.site-chrome-footer a,
.footer a {
	color: #585E6C !important;
}
.foot-copy a {
	color: #585E6C !important;
}
.foot-nav dt a {
	color: #ccc !important;
}

/* 顶栏高度由 header 脚本写入 --page-header-offset，避免写死 padding 在顶栏与 BANNER 之间挤出白条 */

/* ========= 布局与内页公用 ========= */
.clearfix {
	clear: both;
}

.w_auto {
	width: 1200px;
	max-width: 100%;
	margin: 0 auto;
	display: block;
	box-sizing: border-box;
	padding-left: 16px;
	padding-right: 16px;
}

.commbann .site-advert-banner,
.commbann .advert-carousel {
	width: 100%;
}
.commbann .advert-carousel__slide img,
.commbann img {
	display: block;
	width: 100%;
	height: auto;
	vertical-align: top;
}

/* ========= 公司简介两栏 ========= */
.about-jj {
	width: 1200px;
	max-width: 100%;
	margin: 0 auto;
	padding: 60px 16px;
	overflow: hidden;
	box-sizing: border-box;
}

.about-jj .left {
	float: left;
	width: 54%;
}

.about-jj .left p.en {
	font-size: 40px;
	color: #eaeaea;
}

.about-jj .left h3 {
	font-size: 36px;
	color: #333;
	position: relative;
	padding-bottom: 25px;
	margin-bottom: 25px;
}

.about-jj .left h3:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 70px;
	height: 2px;
	background-color: #333;
}

.about-jj .left div.ct {
	font-size: 16px;
	color: #666;
	line-height: 33px;
}

.about-jj .right {
	float: right;
	width: 42%;
}

.about-jj .right img {
	display: block;
	width: 100%;
	height: auto;
}

.abo_team {
	line-height: 0;
}

.abo_team img {
	display: block;
	width: 100%;
	height: auto;
}

/* ========= 资质证书（背景 + Swiper 封面流动效，对齐 www.hke28.com/about/） ========= */
.revealator-slideup.revealator-within,
.revealator-slideup.revealator-partially-above,
.revealator-slideup.revealator-above {
	transform: translate(0, 0);
	opacity: 1;
	width: 1200px;
	max-width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
	padding-left: 16px;
	padding-right: 16px;
}

.box-do {
	padding-top: 50px;
	padding-bottom: 10px;
	background: url("../images/ab_08.jpg") bottom repeat-x;
	font-size: 14px;
	color: #202020;
}

.title-h2 {
	font-size: 36px;
	color: #202020;
	text-align: center;
	line-height: 1.2;
	padding-top: 10px;
	padding-bottom: 60px;
	margin: 0;
}

/* 与原站一致：每张 slide 固定 600px，证书图在格子里居中；容器 overflow 可见才能露出左右缩小的证书 */
.revealator-slideup.ihonor {
	padding-left: 0;
	padding-right: 0;
	overflow: hidden;
}

.ihonor {
	position: relative;
	padding-bottom: 50px;
}

.ihonor .swiper-container {
	width: 600px;
	height: 450px;
	margin: 0 auto;
	overflow: visible !important;
}

.ihonor .swiper-container .swiper-wrapper {
	height: 450px;
	align-items: center;
}

.ihonor .swiper-slide {
	text-align: center;
	width: 100%;
	height: 450px;
}

.ihonor .swiper-container img {
	display: inline-block;
	width: auto;
	max-width: none;
	height: 450px;
	vertical-align: top;
}

.ihonor .swiper-container .swiper-button-prev,
.ihonor .swiper-container .swiper-button-next {
	--swiper-navigation-color: #007aff;
	color: #007aff;
	margin-top: 0;
	z-index: 20;
}

.ihonor .swiper-container .swiper-button-prev {
	left: 230px !important;
	top: 57% !important;
}

.ihonor .swiper-container .swiper-button-next {
	right: 230px !important;
	top: 57% !important;
}

/* ========= 客户 logo ========= */
.wo .wo_cn,
.fu_cn {
	font-size: 30px;
	color: #111;
	line-height: 35px;
	text-align: center;
}

.wo .wo_en,
.shi .fu_en,
.wen .fu_en {
	font-size: 24px;
	color: #666;
	line-height: 28px;
	text-transform: uppercase;
	text-align: center;
	margin-top: 8px;
}

.wo .wo_en span,
.fu_en span {
	color: #dd2918;
}

.fu_cn {
	color: #111;
}

.gao_cn {
	color: #111;
}

.fu {
	background: #edf1f1;
	padding: 80px 0;
	position: relative;
	background-size: cover;
}

.fu_en {
	color: #333;
	font-size: 24px;
	line-height: 28px;
	text-transform: uppercase;
	text-align: center;
	margin-top: 8px;
}

.fu_li {
	margin-top: 35px;
	padding-bottom: 45px;
}

.fu_li ul {
	position: relative;
	zoom: 1;
}

.fu_li li {
	width: 158px;
	background: #fff;
	float: left;
	display: inline-block;
	margin: 1px;
	padding: 20px;
	text-align: center;
}

.fu_li li img {
	max-width: 90%;
}

.fu_li li:hover img {
	transform: scale(1.1);
}

/* ========= 视频区 ========= */
.shi {
	padding: 80px 0;
}

.ind_vid {
	margin-top: 50px;
}

.ind_vid .vid_box {
	position: relative;
	width: 1200px;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
	aspect-ratio: 16 / 9;
	background: #000;
}

.ind_vid .vid_box video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ind_vid .vid_box span {
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 50%;
	z-index: 10;
	cursor: pointer;
	margin: -76px 0 0 -76px;
}

.ind_vid .vid_box span img {
	height: auto;
	display: block;
}

@media only screen and (max-width: 1280px) {
	.w_auto {
		width: 100% !important;
	}

	.about-jj {
		width: 100%;
	}

	.ind_vid .vid_box {
		width: 100%;
	}
}

@media only screen and (max-width: 960px) {
	.about-jj {
		padding: 40px 16px;
	}

	.about-jj .left,
	.about-jj .right {
		float: none;
		width: 100% !important;
	}

	.about-jj .right {
		margin-top: 24px;
	}

	.about-jj .left p.en {
		font-size: 15px;
	}

	.about-jj .left h3 {
		font-size: 22px;
	}

	.about-jj .left h3:after {
		width: 40px;
	}

	.title-h2 {
		font-size: 22px;
		padding-bottom: 30px;
	}

	.ihonor .swiper-container {
		width: 70%;
		height: 320px;
		overflow: visible;
	}

	.ihonor .swiper-container .swiper-wrapper,
	.ihonor .swiper-slide {
		width: 100%;
		height: 320px;
	}

	.ihonor .swiper-container img {
		height: 320px;
		max-width: none;
	}

	.ihonor .swiper-container .swiper-button-prev {
		left: 8px !important;
	}

	.ihonor .swiper-container .swiper-button-next {
		right: 8px !important;
	}

	.wo .wo_cn,
	.fu_cn {
		font-size: 18px;
		line-height: 24px;
	}

	.wo .wo_en,
	.shi .fu_en,
	.fu_en,
	.wen .fu_en {
		font-size: 14px;
		margin-top: 0;
	}

	.fu_li li {
		width: 42%;
		margin: 4%;
	}

	.fu_li li img {
		width: 100%;
		height: auto;
	}

	.fu {
		padding: 40px 16px;
	}

	.shi {
		padding: 40px 16px;
	}

	.ind_vid {
		margin-top: 24px;
	}

	.ind_vid .vid_box span {
		margin: -40px 0 0 -40px;
	}

	.ind_vid .vid_box span img {
		max-width: 80px;
		height: auto;
	}
}

@media only screen and (max-width: 640px) {
	.commbann {
		position: relative;
		overflow: hidden;
	}

	.commbann img {
		width: 100%;
		margin-left: 0;
		max-width: 100%;
		height: auto;
	}

	.ihonor .swiper-container {
		width: 78%;
		height: 240px;
		overflow: visible !important;
	}

	.ihonor .swiper-container .swiper-wrapper,
	.ihonor .swiper-slide {
		width: 100%;
		height: 240px;
	}

	.ihonor .swiper-container img {
		height: 240px;
		max-width: none;
	}

	.abo_team img {
		width: 100%;
		height: auto;
	}

	.fu_li ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
}

.about-map {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 40px 15px 60px;
	box-sizing: border-box;
}

.about-map:empty {
	display: none;
	padding: 0;
	margin: 0;
}

.about-map #map {
	margin: 0 auto;
}
