:root {
	--red: #e60012;
	--dark: #303030;
	--muted: #777;
	--line: #dedede;
	--light: #f4f4f4;
	--shell: 80vw;
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	color: var(--dark);
	background: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 1.75;
	overflow-x: hidden;
}

img {
	display: block;
	max-width: 100%;
}
a {
	color: inherit;
	text-decoration: none;
}
button {
	font: inherit;
}


/* 分页容器整体布局 */
.page{
        margin: 70px 0px 0px;
}
.pagination.page {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	/* 按钮之间的间距 */
	list-style: none;
	padding: 0;
	margin: 0;
	font-family: sans-serif;
}

/* 所有按钮/页码通用样式 */
.pagination.page>* {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	padding: 2px 10px;
	border: 2px solid #ddd;
	border-radius: 8px;
	background-color: #fff;
	color: #333;
	font-size: 14px;
	text-decoration: none;
	cursor: pointer;
	transition: all 0.2s ease;
	box-sizing: border-box;
}

/* 数字页码单独调整宽度 */
.pagination.page .page-number {
padding: 2px 10px;
}

/* 当前激活页（蓝色背景、白色文字） */
.pagination.page .active.page-number {
	background-color:#de0c1cf0;
	border-color: #de0c1cf0;
	color: #fff;
}

/* 隐藏 SVG 箭头图标，替换为文字 */
.pagination.page .prev-page svg,
.pagination.page .next-page svg {
	display: none;
}

/* 给上一页/下一页加上文字 */
.pagination.page .prev-page::before {
	content: "上一页";
}

.pagination.page .next-page::after {
	content: "下一页";
}

/* 省略号样式（如果后续要加） */
.pagination.page .ellipsis {
	border: none;
	background: transparent;
	cursor: default;
}

/*  hover 交互效果 */
.pagination.page>*:hover:not(.active.page-number):not(.ellipsis) {
	border-color: #de0c1cf0;
	color: #de0c1cf0;
}

.ui-icon {
	display: inline-block;
	width: 1em;
	height: 1em;
	object-fit: contain;
	vertical-align: -0.12em;
}
.shell {
	width: var(--shell);
	max-width: none;
	margin: 0 auto;
}
.narrow {
	width: var(--shell);
	max-width: none;
}
.section-space {
	padding: 72px 0;
}
.section-space-sm {
	padding: 18px 0 70px;
}
.center {
	text-align: center;
}

.topbar {
	height: 34px;
	background: #f1f1f1;
	color: #555;
	font-size: 13px;
}
.topbar .shell {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.top-contact {
	display: flex;
	gap: 24px;
	color: #777;
	font-weight: 700;
}
.top-contact > span {
	display: inline-flex;
	align-items: center;
	gap: 7px;
    line-height: 1em;
}
.top-contact .ui-icon {
	width: 13px;
	height: 13px;
	filter: invert(12%) sepia(99%) saturate(6218%) hue-rotate(350deg)
		brightness(91%) contrast(112%);
}

.header {
	background: #fff;
	position: relative;
	z-index: 30;
}
.header .brand img{
    max-height: 70px;
    object-fit: contain;
}
.header-inner {
	height: 110px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.brand {
	display: inline-flex;
	align-items: center;
	letter-spacing: -3px;
	font-style: italic;
	line-height: 1;
}
.brand span {
	color: #111;
	font-size: 48px;
	font-weight: 900;
}
.brand strong {
	color: var(--red);
	font-size: 40px;
	font-weight: 900;
}
.main-nav > ul {
	display: flex;
	align-items: center;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.main-nav > ul > li {
	position: relative;
}
.main-nav > ul > li > a {
	display: block;
padding: 4px 12px;
	font-size: 16px;
	transition: color 0.25s ease;
}
.main-nav > ul > li:hover > a,
.main-nav > ul > li.is-active > a {
	color: var(--red);
}
.nav-sub {
	position: absolute;
	top: calc(100% - 20px);
	left: 50%;
	width: 152px;
	padding: 8px 0;
	background: #fff;
	border-top: 2px solid var(--red);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.13);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 12px);
	transition:
		opacity 0.25s ease,
		transform 0.25s ease,
		visibility 0.25s;
}
.nav-sub a {
	display: block;
	padding: 8px 20px;
	font-size: 14px;
}
.nav-sub a:hover {
	color: var(--red);
	background: #f7f7f7;
}
.main-nav li:hover .nav-sub {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0);
}
.nav-toggle {
	display: none;
	width: 42px;
	height: 42px;
	padding: 11px;
	border: 0;
	background: var(--red);
	cursor: pointer;
}
.nav-toggle .ui-icon {
	width: 100%;
	height: 100%;
	filter: brightness(0) invert(1);
}

.hero {
	position: relative;
	height: calc(100vh - 144px);
	min-height: 600px;
	overflow: hidden;
	background: #111;
}
.hero-track {
	position: relative;
	width: 100%;
	height: 100%;
}
.hero-slide {
	position: absolute;
	inset: 0;
	display: block;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.9s ease;
}
.hero-slide.is-active {
	opacity: 1;
	pointer-events: auto;
}
.hero-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.08);
	transition: transform 7.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.hero-slide.is-active img {
	transform: scale(1);
}
.hero-shade {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		rgba(0, 0, 0, 0.7) 0%,
		rgba(0, 0, 0, 0.3) 46%,
		rgba(0, 0, 0, 0.1) 100%
	);
}
.hero-caption {
	position: absolute;
	top: 50%;
	left: max(24px, calc((100% - var(--shell)) / 2));
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	max-width: 650px;
	color: #fff;
	transform: translateY(-44%);
}
.hero-caption small {
	display: none;
}
.hero-caption strong {
	margin: 13px 0 16px;
	font-size: clamp(46px, 5vw, 76px);
	font-weight: 600;
	line-height: 1.22;
	letter-spacing: 3px;
	opacity: 0;
	transform: translateY(30px);
	transition:
		opacity 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.34s,
		transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.34s;
}
.hero-caption em {
	padding-left: 3px;
	color: rgba(255, 255, 255, 0.84);
	font-size: 17px;
	font-style: normal;
	letter-spacing: 1px;
	opacity: 0;
	transform: translateY(24px);
	transition:
		opacity 0.7s ease 0.5s,
		transform 0.7s ease 0.5s;
}
.hero-caption b {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	margin-top: 32px;
	padding: 12px 24px;
	border: 1px solid rgba(255, 255, 255, 0.58);
	border-radius: 2px;
	background: rgba(0, 0, 0, 0.16);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 1px;
	opacity: 0;
	transform: translateX(-18px);
	transition:
		opacity 0.65s ease 0.66s,
		transform 0.65s ease 0.66s,
		background 0.25s,
		border-color 0.25s;
}
.hero-caption b:hover {
	border-color: #fff;
	background: var(--red);
}
.hero-caption b i {
	color: var(--red);
	font-size: 24px;
	font-style: normal;
	line-height: 1;
}
.hero-caption b i {
	display: none;
}
.hero-slide.is-active .hero-caption small,
.hero-slide.is-active .hero-caption strong,
.hero-slide.is-active .hero-caption em,
.hero-slide.is-active .hero-caption b {
	opacity: 1;
	transform: none;
}
.rail-arrow {
	position: absolute;
	z-index: 3;
	border: 0;
	color: #fff;
	background: rgba(0, 0, 0, 0.32);
	cursor: pointer;
	transition: background 0.25s ease;
}
.rail-arrow:hover {
	background: rgba(230, 0, 18, 0.85);
}
.rail-arrow .ui-icon {
	width: 24px;
	height: 24px;
	filter: brightness(0) invert(1);
}
.rail-arrow::after {
	color: #fff;
	font-size: 12px;
	font-weight: 400;
}
.rail-arrow.prev::after {
	content: "上一项";
}
.rail-arrow.next::after {
	content: "下一项";
}
.hero-progress {
	position: absolute;
	z-index: 3;
	bottom: 52px;
	left: max(24px, calc((100% - var(--shell)) / 2));
	display: flex;
	align-items: center;
	gap: 18px;
	color: #fff;
}
.hero-count {
	min-width: 69px;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: 1px;
}
.hero-count-item {
	display: none;
}
.hero-count-item.is-active {
	display: inline;
}
.hero-count i {
	color: rgba(255, 255, 255, 0.55);
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
}
.hero-line {
	width: 142px;
	height: 2px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.35);
}
.hero-line b {
	display: block;
	width: 50%;
	height: 100%;
	background: var(--red);
	transition: width 0.6s ease;
}
.hero-dots {
	display: flex;
	gap: 7px;
}
.hero-dots button {
	width: 7px;
	height: 7px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.72);
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
	transition:
		background 0.25s,
		transform 0.25s;
}
.hero-dots button.is-active {
	background: #fff;
	transform: scale(1.25);
}

.section-title {
	margin-bottom: 34px;
	text-align: center;
}
.section-title h2 {
	margin: 0;
	font-size: 38px;
	line-height: 1.2;
	font-weight: 500;
}
.section-title p {
	margin: 4px 0 0;
	color: #777;
	font-size: 14px;
	letter-spacing: 0.8px;
}
.home-products .section-title p,
.environment-section .section-title p,
.home-news .section-title p,
.honor-heading p,
.about-copy > span {
	display: none;
}
.category-tabs {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 34px;
	margin-bottom: 36px;
}
.category-tabs a {
	padding-bottom: 4px;
	border-bottom: 1px solid transparent;
	transition:
		color 0.25s,
		border-color 0.25s;
}
.category-tabs a:hover {
	color: var(--red);
	border-color: var(--red);
}

.product-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px 18px;
}
.product-card {
	border: 1px solid #e2e2e2;
	background: #fff;
	overflow: hidden;
}
.product-card a {
	display: block;
	position: relative;
}
.product-card .image-wrap {
	overflow: hidden;
	background: #eee;
	aspect-ratio: 4 / 3;
}
.product-card img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.product-card h3 {
	margin: 0;
	padding: 13px 10px 15px;
	text-align: center;
	font-size: 17px;
	font-weight: 400;
	transition: color 0.25s;
}
.product-card span {
	position: absolute;
	inset: auto 0 0;
	padding: 15px;
	color: #fff;
	background: rgba(230, 0, 18, 0.9);
	text-align: center;
	transform: translateY(100%);
	transition: transform 0.35s ease;
}
.product-card:hover img {
	transform: scale(1.06);
}
.product-card:hover h3 {
	color: var(--red);
}
.product-card:hover span {
	transform: translateY(0);
}

.home-about {
	position: relative;
	color: #fff;
	background:
		linear-gradient(90deg, rgba(18, 18, 18, 0.88), rgba(18, 18, 18, 0.66)),
		url("../images/hero-construction.jpg") center / cover no-repeat;
}
.about-home-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 54px;
}
.about-photo {
	min-height: 390px;
}
.about-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.about-copy {
	padding: 18px 0;
}
.about-copy {
	padding: 28px 30px;
	background: rgba(0, 0, 0, 0.28);
}
.about-copy > span {
	color: var(--red);
	font-size: 15px;
	letter-spacing: 2px;
}
.about-copy h2 {
	margin: 2px 0 22px;
	font-size: 36px;
}
.about-copy p {
	margin: 0 0 14px;
	color: #d7d7d7;
}
.outline-button,
.solid-button {
	display: inline-block;
	margin-top: 14px;
	padding: 10px 25px;
	transition:
		background 0.25s,
		color 0.25s,
		border-color 0.25s;
}
.outline-button {
	color: #fff;
	border: 1px solid #777;
}
.outline-button:hover {
	border-color: var(--red);
	background: var(--red);
}
.solid-button {
	color: #fff;
	background: var(--red);
}
.solid-button:hover {
	background: #b9000e;
}
.value-row {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	margin-top: 34px;
	border-top: 1px solid #4c4c4c;
}
.value-row > div {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 95px;
	border-right: 1px solid #4c4c4c;
}
.value-row > div:last-child {
	border-right: 0;
}
.value-row .ui-icon {
	width: 34px;
	height: 34px;
	filter: invert(12%) sepia(99%) saturate(6218%) hue-rotate(350deg)
		brightness(91%) contrast(112%);
}
.value-row span {
	font-size: 16px;
}
.value-row em {
	display: block;
	color: #888;
	font-size: 10px;
	font-style: normal;
}

.environment-section {
	background: #f5f5f5;
}
.rail {
	position: relative;
	overflow: hidden;
	cursor: grab;
	user-select: none;
}
.rail:active {
	cursor: grabbing;
}
.rail-track {
	display: flex;
	gap: 20px;
	transition: transform 0.55s ease;
	will-change: transform;
}
.rail-card {
	flex: 0 0 calc((100% - 60px) / 4);
	background: #fff;
	overflow: hidden;
	text-align: center;
}
.rail-card img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	transition: transform 0.45s;
}
.rail-card span {
	display: block;
	padding: 13px;
}
.rail-card:hover img {
	transform: scale(1.06);
}
.rail-arrow {
	display: none;
}

.news-home-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 128px;
}
.news-featured {
	display: grid;
	grid-template-rows: repeat(2, 1fr);
	gap: 18px;
}
.news-feature {
	min-height: 158px;
	display: grid;
	grid-template-columns: 42% 1fr;
	border: 1px solid #e3e3e3;
	overflow: hidden;
	transition:
		border-color 0.35s,
		transform 0.35s,
		box-shadow 0.35s;
}
.news-feature:hover {
	border-color: var(--red);
	transform: translateY(-6px);
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.13);
}
.news-feature-image {
	min-height: 158px;
	overflow: hidden;
	background: #eee;
}
.news-feature-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}
.news-feature:hover .news-feature-image img {
	transform: scale(1.06);
}
.news-feature-copy {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 16px 18px;
	background: #fff;
}
.news-feature-copy::before {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 3px;
	background: var(--red);
	content: "";
	transform: scaleY(0);
	transform-origin: center;
	transition: transform 0.35s ease;
}
.news-feature:hover .news-feature-copy::before {
	transform: scaleY(1);
}
.news-feature h3 {
	margin: 0 0 9px;
	font-size: 17px;
	line-height: 1.55;
	transition:
		color 0.3s ease,
		transform 0.3s ease;
}
.news-feature p {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: #777;
	font-size: 13px;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	transition:
		color 0.3s ease,
		transform 0.3s ease;
}
.news-feature:hover h3 {
	color: var(--red);
	transform: translateX(7px);
}
.news-feature:hover p {
	color: #555;
	transform: translateX(7px);
}
.news-row {
	display: flex;
	gap: 18px;
    padding: 17px 0;
    margin-bottom: 10px;
	border-bottom: 1px solid #e7e7e7;
}
.news-row time {
	min-width: 62px;
	color: var(--red);
	font-size: 18px;
}
.news-row time b {
	display: block;
	color: #888;
	font-size: 12px;
	font-weight: 400;
}
.news-row span {
	min-width: 0;
}
.news-row strong {
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.news-row em {
	display: -webkit-box;
	margin-top: 4px;
	overflow: hidden;
	color: #888;
	font-size: 13px;
	font-style: normal;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}
.news-rows::after {
	display: none;
}
.home-news .center {
	margin-top: 32px;
}

.honor-section {
	color: #fff;
	background: #222;
}
.honor-heading {
	margin-bottom: 30px;
}
.honor-heading h2 {
	display: inline-block;
	margin: 0 14px 0 0;
	font-size: 32px;
}
.honor-heading p {
	display: inline-block;
	color: #999;
}
.honor-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.certificate-link h3 {
	margin: 12px 0 0;
	color: #ddd;
	text-align: center;
	font-size: 16px;
	font-weight: 400;
}
.certificate {
	aspect-ratio: 1.38 / 1;
	/*padding: 22px 18px;*/
	/*border: 10px double #8b7b4a;*/
	/*outline: 5px solid #eee4bf;*/
	/*outline-offset: -12px;*/
	/*color: #6a5b31;*/
	/*background: radial-gradient(circle at 50% 25%, #fffdf4, #e8dfbf 78%);*/
	text-align: center;
}
.certificate img{
       height: 100%;
       width: 100%;
}
.certificate-star {
	color: #b89029;
	font-size: 30px;
	line-height: 1;
}
.certificate small,
.certificate strong,
.certificate p,
.certificate em {
	display: block;
}
.certificate small {
	margin: 8px 0;
	font-size: 10px;
	letter-spacing: 2px;
}
.certificate strong {
	font-family: Georgia, serif;
	font-size: 24px;
}
.certificate p {
	margin: 5px 0 10px;
	font-size: 9px;
	letter-spacing: 1px;
}
.certificate em {
	font-family: Georgia, serif;
	font-size: 12px;
}

.footer {
	padding-top: 32px;
	color: #aaa;
	background: #151515;
}
.footer-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px 30px;
	padding-bottom: 24px;
	border-bottom: 1px solid #353535;
}
.footer-links a:hover {
	color: #fff;
}
.footer-contact {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	padding: 26px 0;
	font-size: 14px;
}
.footer-contact span {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}
.footer-contact .ui-icon {
	flex: 0 0 14px;
	width: 14px;
	height: 14px;
	margin-top: 5px;
	filter: brightness(0.7);
}
.footer-bottom {
	padding: 14px 24px;
	color: #777;
	background: #0d0d0d;
	text-align: center;
	font-size: 13px;
}
.back-top {
	position: fixed;
	z-index: 50;
	right: 22px;
	bottom: 28px;
	width: 44px;
	height: 44px;
	padding: 13px;
	border: 0;
	color: #fff;
	background: var(--red);
	opacity: 0;
	transform: translateY(18px);
	pointer-events: none;
	transition: 0.3s;
	cursor: pointer;
}
.back-top {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	right: 24px;
	bottom: 26px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.8);
	border-radius: 50%;
	background: rgba(35, 35, 35, 0.94);
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.24);
	transition:
		opacity 0.3s,
		transform 0.3s,
		background 0.25s,
		box-shadow 0.25s;
}
.back-top .ui-icon {
	display: block;
	width: 17px;
	height: 17px;
	filter: brightness(0) invert(1);
	transition: transform 0.25s;
}
.back-top::after {
	content: none;
}
.back-top:hover {
	background: var(--red);
	box-shadow: 0 10px 24px rgba(230, 0, 18, 0.28);
	transform: translateY(-3px);
}
.back-top:hover .ui-icon {
	transform: translateY(-2px);
}
.back-top.is-show {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.back-top.is-show:hover {
	transform: translateY(-3px);
}

.inner-banner {
	height: 260px;
	background: url("../images/inner-banner.jpg") center 48% / cover no-repeat;
}
.breadcrumb {
	min-height: 44px;
	display: flex;
	align-items: center;
	color: #555;
	background: #f0f0f0;
	border: 1px solid #ddd;
	font-size: 14px;
}
.breadcrumb .shell {
	padding: 8px 0;
}
.breadcrumb .ui-icon {
	width: 15px;
	height: 15px;
	margin-right: 4px;
}
.breadcrumb a:hover {
	color: var(--red);
}
.article-page .section-title,
.news-list-page .section-title,
.gallery-list-page .section-title {
	padding-bottom: 20px;
	border-bottom: 1px solid var(--line);
}
.article-page .section-title h2,
.news-list-page .section-title h2,
.gallery-list-page .section-title h2 {
	font-size: 34px;
	font-weight: 700;
}
.rich-text {
	color: #444;
}
.rich-text p {
	margin: 0 0 24px;
	line-height: 2;
}

.content-with-side {
	display: grid;
	grid-template-columns: 205px 1fr;
	gap: 12px;
}
.sidebar {
	background: #f1f1f1;
	align-self: start;
}
.side-title {
	padding: 18px 16px;
	color: #fff;
	background: var(--red);
	text-align: center;
}
.side-title b,
.side-title span {
	display: block;
}
.side-title b {
	font-size: 20px;
}
.side-title span {
	font-size: 13px;
}
.side-nav {
	padding: 12px 0;
}
.side-nav a {
	display: block;
	padding: 7px 28px;
}
.side-nav a {
	position: relative;
	padding-left: 50px;
}
.side-nav a::before {
	content: "";
	position: absolute;
	left: 28px;
	top: 50%;
	width: 12px;
	height: 12px;
	background: url("../images/icons/list.svg") center / contain no-repeat;
	opacity: 0.24;
	transform: translateY(-50%);
}
.side-nav a:hover {
	color: var(--red);
}
.side-subtitle {
	padding: 8px 16px;
	color: #fff;
	background: var(--red);
	font-size: 18px;
}
.side-products {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	padding: 10px;
}
.side-products a {
	display: grid;
	grid-template-columns: 78px 1fr;
	align-items: center;
	gap: 10px;
}
.side-products img {
	width: 78px;
	height: 58px;
	aspect-ratio: auto;
	object-fit: cover;
}
.side-products span {
	display: block;
	margin-top: 0;
	text-align: left;
	font-size: 12px;
	line-height: 1.45;
}
.bar-title {
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 16px;
	color: #fff;
	background: var(--red);
}
.bar-title em {
	font-size: 13px;
	font-style: normal;
}
.list-product-grid {
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	padding: 10px;
	border: 1px solid var(--line);
	border-top: 0;
}
.list-product-grid .product-card h3 {
	padding: 7px 8px 9px;
}
.list-product-grid .product-card span,
.related-grid .product-card span {
	display: none;
}
.pagination {
	display: flex;
	justify-content: center;
	gap: 5px;
	margin-top: 36px;
}
.cqnr{
    margin: 20px 0px;
}
.cqnr video{
    width: 100%;
}
.cqnr img{
    height: auto;
    object-fit: contain;
    max-width: 100%;
}
.pagination > * {
	min-width: 34px;
	padding: 3px 9px;

	text-align: center;
	font-size: 13px;
}
.pagination b {
	color: #fff;
	background: #333;
	border-color: #333;
}

.product-detail {
	min-width: 0;
	border: 1px solid var(--line);
}
.product-detail .bar-title {
	margin: -1px -1px 24px;
}
.product-summary {
	display: grid;
	grid-template-columns: 52% 1fr;
	gap: 38px;
	padding: 0 20px 30px;
}
.product-summary > img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	padding: 5px;
	border: 1px solid var(--line);
}
.product-summary h1 {
	padding-bottom: 18px;
	margin: 14px 0 25px;
	border-bottom: 1px solid #eee;
	font-size: 26px;
}
.detail-tab {
	width: 130px;
	margin-bottom: 16px;
	padding: 10px 18px;
	color: #fff;
	background: var(--red);
	font-size: 18px;
}
.product-detail > .rich-text,
.product-detail > .prev-next,
.product-detail > .related-title,
.product-detail > .related-grid {
	margin-left: 12px;
	margin-right: 12px;
}
.prev-next {
	display: flex;
	flex-direction: column;
	gap: 7px;
	padding: 20px 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	font-size: 14px;
}
.related-title {
	margin-top: 24px;
	font-size: 20px;
}
.related-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	margin-bottom: 18px;
}

.news-card-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}
.news-card {
	border: 1px solid #e2e2e2;
}
.news-card a {
	display: block;
	min-height: 240px;
	transition:
		border-color 0.25s,
		box-shadow 0.25s;
}
.news-card-image {
	height: 230px;
	overflow: hidden;
	background: #eee;
}
.news-card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}
.news-card:hover .news-card-image img {
	transform: scale(1.05);
}
.news-card-copy {
	padding: 18px 20px 22px;
}
.news-card:hover {
	border-color: var(--red);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.07);
}
.news-card h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 400;
}
.news-card time {
	display: block;
	padding-bottom: 12px;
	margin: 3px 0 13px;
	color: #999;
	border-bottom: 1px solid #eee;
	font-size: 13px;
}
.news-card p {
	margin: 0;
	color: #888;
}

.detail-heading {
	margin-bottom: 22px;
	text-align: center;
}
.detail-heading h1 {
	margin: 0;
	font-size: 27px;
}
.detail-heading p {
	margin: 2px 0 0;
	color: #777;
	font-size: 14px;
}
.news-detail .rich-text {
	font-size: 15px;
}
.news-detail .rich-text p {
	margin-bottom: 8px;
	line-height: 2;
}
.related-news {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
}
.related-news a {
	padding: 13px 15px;
	border: 1px solid #e2e2e2;
}
.related-news time {
	display: block;
	color: #999;
	font-size: 12px;
}
.related-news span {
	display: block;
	margin-top: 5px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.gallery-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 34px 28px;
}
.gallery-card {
	text-align: center;
}
.gallery-card img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	transition:
		transform 0.4s,
		box-shadow 0.4s;
}
.gallery-card h3 {
	margin: 10px 0 0;
	font-size: 16px;
	font-weight: 400;
}
.gallery-card:hover img {
	transform: translateY(-5px);
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.14);
}
.honor-list-grid .certificate-link h3 {
	color: #444;
}
.gallery-visual {
	display: flex;
	justify-content: center;
	margin: 20px auto 30px;
}
.gallery-hero {
	width: min(800px, 100%);
	max-height: 820px;
	object-fit: contain;
}
.gallery-visual.is-certificate .certificate {
	width: min(790px, 100%);
}
.gallery-visual.is-certificate .certificate strong {
	margin-top: 30px;
	font-size: 52px;
}
.gallery-visual.is-certificate .certificate-star {
	margin-top: 30px;
	font-size: 72px;
}

.contact-intro {
	padding-bottom: 16px;
	margin: 0 0 20px;
	border-bottom: 1px solid var(--line);
}
.contact-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
}
.contact-grid > img {
	width: 100%;
	height: 100%;
	min-height: 340px;
	object-fit: cover;
}
.contact-panel {
	padding: 44px 38px;
	background: #f0f0f0;
}
.contact-panel h1 {
	margin: 0 0 18px;
	font-size: 27px;
	font-weight: 400;
}

/* 关于与联系页面 */
.article-page {
	background: linear-gradient(180deg, #fff 0%, #f6f6f6 100%);
}
.article-page .rich-text {
	max-width: 960px;
	margin: 0 auto;
	padding: 42px 54px;
	background: #fff;
	box-shadow: 0 16px 38px rgba(0, 0, 0, 0.07);
}
.article-page .rich-text p:first-child {
	margin-top: 0;
	color: #222;
	font-size: 19px;
}
.contact-page {
	background: #fff;
}
.contact-intro {
	max-width: 760px;
	margin-right: auto;
	margin-left: auto;
	border: 0;
	text-align: center;
	color: #666;
}
.contact-grid {
	overflow: hidden;
	background: #fff;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.05);
}
.contact-side {
	display: flex;
	flex-direction: column;
	background: #fff;
}
.contact-side .contact-panel {
	min-height: 340px;
}
.contact-panel {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 48px 46px;
	background: #242424;
	color: #fff;
}
.contact-panel h1 {
	padding-bottom: 14px;
	margin-bottom: 22px;
	border-bottom: 2px solid var(--red);
	color: #fff;
}
.contact-panel p {
	margin: 6px 0;
	color: rgba(255, 255, 255, 0.75);
}
.contact-form {
	flex: 1;
	padding: 30px 46px 42px;
	margin: 0;
	background: #fff;
}
.contact-form h2 {
	margin: 0 0 22px;
	font-size: 25px;
}
.form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.form-grid label {
	display: block;
	color: #555;
	font-size: 14px;
}
.form-grid input,
.form-grid textarea {
	width: 100%;
	padding: 11px 12px;
	margin-top: 6px;
	border: 1px solid #ddd;
	border-radius: 0;
	outline: none;
	font: inherit;
	transition:
		border-color 0.2s,
		box-shadow 0.2s;
}
.form-grid textarea {
	min-height: 124px;
	resize: vertical;
}
.form-grid label:last-child {
	grid-column: 1 / -1;
}
.form-grid input:focus,
.form-grid textarea:focus {
	border-color: var(--red);
	box-shadow: 0 0 0 3px rgba(230, 0, 18, 0.08);
}
.form-submit {
	padding: 11px 34px;
	margin-top: 20px;
	border: 0;
	background: var(--red);
	color: #fff;
	cursor: pointer;
}
.form-note {
	display: none;
	margin: 15px 0 0;
	color: #188048;
}
.form-note.is-visible {
	display: block;
}
.about-photo-strip {
	display: grid;
	grid-template-columns: 1.3fr 0.7fr;
	gap: 18px;
	max-width: 960px;
	margin: 0 auto 30px;
}
.about-photo-strip img {
	width: 100%;
	height: 210px;
	object-fit: cover;
}
.news-list-layout {
	display: grid;
	grid-template-columns: 190px minmax(0, 1fr);
	gap: 30px;
}
.news-list-page .news-card-grid {
	margin-left: 0;
}
.news-side-nav {
	align-self: start;
	background: #f3f3f3;
}
.news-side-nav h3 {
	padding: 14px 16px;
	margin: 0;
	color: #fff;
	background: var(--red);
	font-size: 18px;
}
.news-side-nav a {
	display: block;
	padding: 12px 18px;
	border-bottom: 1px solid #ddd;
	color: #555;
}
.news-side-nav a.is-active {
	color: #fff;
	background: #333;
}
.news-side-nav a:hover {
	padding-left: 24px;
	color: var(--red);
	background: #fff;
}
.gallery-list-page #site,
.gallery-list-page #site + .gallery-grid,
.gallery-list-page #honor,
.gallery-list-page #honor + .gallery-grid {
	display: none;
}

.reveal {
	--reveal-transform: translateY(26px);
	opacity: 0;
	filter: blur(7px);
	transform: var(--reveal-transform);
	transition:
		opacity 0.8s ease,
		transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1),
		filter 0.8s ease;
}
.xq{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.reveal.is-visible {
	opacity: 1;
	filter: blur(0);
	transform: none;
}

.home-products .section-title.reveal {
	--reveal-transform: translateX(-42px);
}
.home-products .category-tabs.reveal {
	--reveal-transform: scale(0.94);
	transition-delay: 0.12s;
}
.home-products .home-grid .product-card:nth-child(odd) {
	--reveal-transform: translateY(34px) rotate(-1deg);
}
.home-products .home-grid .product-card:nth-child(even) {
	--reveal-transform: translateY(-22px) rotate(1deg);
}
.home-products .home-grid .product-card:nth-child(2) {
	transition-delay: 0.08s;
}
.home-products .home-grid .product-card:nth-child(3) {
	transition-delay: 0.16s;
}
.home-products .home-grid .product-card:nth-child(4) {
	transition-delay: 0.24s;
}
.home-products .home-grid .product-card:nth-child(5) {
	transition-delay: 0.32s;
}
.home-products .home-grid .product-card:nth-child(6) {
	transition-delay: 0.4s;
}
.home-products .home-grid .product-card:nth-child(7) {
	transition-delay: 0.48s;
}
.home-products .home-grid .product-card:nth-child(8) {
	transition-delay: 0.56s;
}
.home-about .about-photo.reveal {
	--reveal-transform: translateX(-46px) scale(0.94);
}
.home-about .about-copy.reveal {
	--reveal-transform: translateX(46px);
	transition-delay: 0.16s;
}
.home-about .value-row > div {
	opacity: 0;
	transform: scale(0.8);
	transition:
		opacity 0.65s ease,
		transform 0.65s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.home-about:has(.about-copy.is-visible) .value-row > div {
	opacity: 1;
	transform: none;
}
.home-about .value-row > div:nth-child(2) {
	transition-delay: 0.1s;
}
.home-about .value-row > div:nth-child(3) {
	transition-delay: 0.2s;
}
.home-about .value-row > div:nth-child(4) {
	transition-delay: 0.3s;
}
.environment-section .section-title.reveal {
	--reveal-transform: translateX(42px);
}
.environment-section .rail.reveal {
	--reveal-transform: scale(0.94);
	transition-delay: 0.14s;
}
.home-news .section-title.reveal {
	--reveal-transform: translateY(-24px);
}
.home-news .news-feature:first-child {
	--reveal-transform: translateX(-38px);
}
.home-news .news-feature:nth-child(2) {
	--reveal-transform: translateX(38px);
	transition-delay: 0.14s;
}
.home-news .news-row:nth-child(1) {
	--reveal-transform: translateX(34px);
}
.home-news .news-row:nth-child(2) {
	--reveal-transform: translateX(24px);
	transition-delay: 0.08s;
}
.home-news .news-row:nth-child(3) {
	--reveal-transform: translateX(14px);
	transition-delay: 0.16s;
}
.home-news .news-row:nth-child(4) {
	--reveal-transform: translateX(4px);
	transition-delay: 0.24s;
}
.honor-section .certificate-link:nth-child(odd) {
	--reveal-transform: translateY(28px) scale(0.92);
}
.honor-section .certificate-link:nth-child(even) {
	--reveal-transform: translateY(-20px) scale(0.92);
}
.honor-section .certificate-link:nth-child(2) {
	transition-delay: 0.1s;
}
.honor-section .certificate-link:nth-child(3) {
	transition-delay: 0.2s;
}
.honor-section .certificate-link:nth-child(4) {
	transition-delay: 0.3s;
}

@media (prefers-reduced-motion: reduce) {
	.reveal,
	.home-about .value-row > div {
		transition-duration: 0.01ms !important;
		transition-delay: 0s !important;
	}
}

/* 首页产品中心横向画廊 */
.home-products .category-tabs {
	display: none;
}
.home-products .home-grid {
	display: flex;
	height: 410px;
	gap: 5px;
	overflow: hidden;
}
.home-products .home-grid .product-card {
	position: relative;
	flex: 0.72 1 0;
	min-width: 0;
	border: 0;
	border-radius: 4px;
	overflow: hidden;
	transition:
		flex 0.46s cubic-bezier(0.2, 0.75, 0.25, 1),
		box-shadow 0.28s ease;
	transition-delay: 0s !important;
}
.home-products .home-grid:not(:has(.is-expanded)) .product-card:first-child,
.home-products .home-grid .product-card.is-expanded {
	flex: 4.8 1 0;
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
}
.home-products .home-grid .product-card:not(.is-expanded)::after {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.3);
	content: "";
	pointer-events: none;
	transition: none;
}
.home-products
	.home-grid:not(:has(.is-expanded))
	.product-card:first-child::after {
	background: transparent;
}
.home-products .home-grid .product-card.is-expanded::after {
	background: transparent;
}
.home-products .home-grid .product-card a {
	width: 100%;
	height: 100%;
}
.home-products .home-grid .product-card .image-wrap {
	width: 100%;
	height: 100%;
	aspect-ratio: auto;
}
.home-products .home-grid .product-card img {
	filter: grayscale(0.08);
	transition:
		transform 0.46s ease-out,
		filter 0.3s ease;
}
.home-products .home-grid .product-card.is-expanded img,
.home-products
	.home-grid:not(:has(.is-expanded))
	.product-card:first-child
	img {
	filter: grayscale(0);
	transform: scale(1.04);
}
.home-products .home-grid .product-card h3 {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	margin: 0;
	padding: 65px 24px 48px;
	color: #fff;
	background: linear-gradient(transparent, rgba(0, 0, 0, 0.86));
	text-align: left;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.35;
	opacity: 0;
	transform: none;
	transition: none !important;
}
.home-products .home-grid .product-card.is-expanded h3,
.home-products .home-grid:not(:has(.is-expanded)) .product-card:first-child h3 {
	opacity: 1;
	transform: none;
}
.home-products .home-grid .product-card span {
	display: block;
	position: absolute;
	right: 24px;
	bottom: 20px;
	z-index: 3;
	padding: 0;
	color: rgba(255, 255, 255, 0.76);
	background: transparent;
	font-size: 13px;
	opacity: 0;
	transform: none;
	transition: none !important;
}
.home-products .home-grid .product-card.is-expanded span,
.home-products
	.home-grid:not(:has(.is-expanded))
	.product-card:first-child
	span {
	opacity: 1;
	transform: none;
}
.home-products .home-grid:has(.is-expanded) .product-card:not(.is-expanded) h3,
.home-products
	.home-grid:not(:has(.is-expanded))
	.product-card:not(:first-child)
	h3 {
	top: 50%;
	right: auto;
	bottom: auto;
	left: 50%;
	width: auto;
	padding: 0;
	background: transparent;
	text-align: center;
	white-space: nowrap;
	font-size: 15px;
	writing-mode: vertical-rl;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
	opacity: 1;
	transform: translate(-50%, -50%);
}
.home-products .home-grid .product-card.is-expanded:hover h3 {
	color: #fff;
	transform: none;
}
.home-products .home-grid .product-card:hover h3 {
	color: #fff;
}
.home-products .home-grid .product-card h3,
.home-products .home-grid .product-card span {
	animation: none !important;
}

@media (max-width: 900px) {
	:root {
		--shell: calc(100% - 30px);
	}
	.shell,
	.narrow {
		width: var(--shell);
	}
	.home-products .home-grid {
		height: 330px;
	}
	.home-products .home-grid .product-card h3 {
		padding: 54px 16px 38px;
		font-size: 19px;
	}
	.home-products .home-grid .product-card span {
		right: 16px;
		bottom: 14px;
	}
}

@media (max-width: 640px) {
	:root {
		--shell: calc(100% - 30px);
	}
	.home-products .home-grid {
		height: 265px;
		gap: 3px;
	}
	.home-products .home-grid .product-card {
		flex: 0.55 1 0;
	}
	.home-products .home-grid:not(:has(.is-expanded)) .product-card:first-child,
	.home-products .home-grid .product-card.is-expanded {
		flex: 5 1 0;
	}
	.home-products .home-grid .product-card h3 {
		padding: 48px 12px 30px;
		font-size: 16px;
	}
	.home-products .home-grid .product-card span {
		right: 12px;
		bottom: 8px;
		font-size: 11px;
	}
}

@media (max-width: 1100px) {
	.main-nav > ul > li > a {
		padding-left: 10px;
		padding-right: 10px;
		font-size: 14px;
	}
	.brand span {
		font-size: 40px;
	}
	.brand strong {
		font-size: 34px;
	}
	.product-grid {
		grid-template-columns: repeat(3, 1fr);
	}
	.home-grid .product-card:last-child,
	.home-grid .product-card:nth-last-child(2) {
		display: none;
	}
}

@media (max-width: 900px) {
    .rich-text p {
    font-size: 13px;
   
}
    .article-page .rich-text p:first-child {

    font-size: 16px;
}
    .article-page .rich-text {
   
    padding: 27px 25px;
    
}
    .header .brand img {
    max-height: 50px;
   
}
	.shell {
		width: min(calc(100% - 30px), var(--shell));
	}
	.topbar {
		height: auto;
		min-height: 36px;
	}
	.topbar .shell {
		gap: 12px;
		padding: 5px 0;
	}
	.topbar .shell > span:first-child {
		display: none;
	}
	.top-contact {
		margin-left: auto;
		font-size: 12px;
	}
	.header-inner {
		height: 64px;
	}
	.brand span {
		font-size: 34px;
	}
	.brand strong {
		font-size: 29px;
	}
	.nav-toggle {
		display: block;
	}
	.main-nav {
		position: absolute;
		top: 64px;
		left: 0;
		right: 0;
		max-height: 0;
		overflow: hidden;
		background: #fff;
		box-shadow: 0 12px 18px rgba(0, 0, 0, 0.1);
		transition: max-height 0.35s ease;
	}
	.main-nav.is-open {
		max-height: 560px;
	}
	.main-nav > ul {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		padding: 12px 15px 18px;
	}
	.main-nav > ul > li > a {
		padding: 10px 12px;
		border-bottom: 1px solid #eee;
	}
	.nav-sub {
		display: none;
	}
	.hero {
		height: calc(100vh - 120px);
		min-height: 540px;
	}
	.hero-caption {
		left: 30px;
		right: 30px;
		transform: translateY(-38%);
	}
	.hero-caption strong {
		font-size: clamp(42px, 8vw, 64px);
	}
	.hero-progress {
		bottom: 51px;
		left: 30px;
	}
	.product-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.home-grid .product-card:nth-last-child(2) {
		display: block;
	}
	.about-home-grid {
		grid-template-columns: 1fr;
	}
	.about-copy {
		padding-top: 30px;
	}
	.value-row {
		grid-template-columns: repeat(2, 1fr);
	}
	.value-row > div:nth-child(2) {
		border-right: 0;
	}
	.value-row > div:nth-child(-n + 2) {
		border-bottom: 1px solid #4c4c4c;
	}
	.rail-card {
		flex-basis: calc((100% - 20px) / 2);
	}
	.news-home-grid {
		grid-template-columns: 1fr;
		    gap: 47px;
	}
	.honor-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.footer-contact {
		grid-template-columns: repeat(2, 1fr);
	}
	.inner-banner {
		height: 210px;
	}
	.content-with-side {
		grid-template-columns: 1fr;
	}
	.sidebar {
		display: grid;
		grid-template-columns: 1fr 2fr;
	}
	.side-title {
		grid-column: 1;
	}
	.side-nav {
		grid-column: 1;
	}
	.side-subtitle {
		grid-column: 2;
		grid-row: 1;
	}
	.side-products {
		grid-column: 2;
		grid-row: 2;
		grid-template-columns: repeat(4, 1fr);
	}
	.side-products a {
		display: block;
	}
	.side-products img {
		width: 100%;
		height: auto;
		aspect-ratio: 4 / 3;
	}
	.side-products span {
		margin-top: 5px;
		text-align: center;
	}
	.product-detail {
		margin-top: 6px;
	}
	.gallery-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.certificate-link h3 {
    margin: 1px 0 0;
   
}
}

@media (max-width: 640px) {
	body {
		font-size: 15px;
	}
	.section-space {
		padding: 48px 0;
	}
	.top-contact {
		width: 100%;
		display: flex;
		justify-content: space-between;
		gap: 8px;
	}
	.hero {
		height: calc(100svh - 110px);
		min-height: 450px;
	}
	.hero-shade {
		background: linear-gradient(
			90deg,
			rgba(0, 0, 0, 0.67),
			rgba(0, 0, 0, 0.17)
		);
	}
	.hero-caption {
		top: 46%;
		left: 22px;
		right: 22px;
		transform: translateY(-42%);
	}
	.hero-caption small {
		font-size: 10px;
		letter-spacing: 2px;
	}
	.hero-caption strong {
		margin: 8px 0 13px;
		font-size: clamp(34px, 11vw, 48px);
		letter-spacing: 1px;
	}
	.hero-caption em {
		max-width: 255px;
		font-size: 13px;
		line-height: 1.7;
	}
	.hero-caption b {
		margin-top: 22px;
		font-size: 12px;
	}
	.hero-progress {
		bottom: 37px;
		left: 22px;
		gap: 10px;
	}
	.hero-count {
		min-width: 55px;
		font-size: 16px;
	}
	.hero-line {
		width: 70px;
	}
	.section-title h2 {
		font-size: 30px;
	}
	.category-tabs {
		gap: 8px 18px;
	}
	.product-grid {
		gap: 12px;
	}
	.product-card h3 {
		font-size: 14px;
	}
	.product-card span {
		display: none;
	}
	.about-photo {
		min-height: 250px;
	}
	.value-row > div {
		min-height: 78px;
	}
	.value-row b {
		font-size: 27px;
	}
	.value-row span {
		font-size: 14px;
	}
	.rail-card {
		flex-basis: 100%;
	}
	.news-featured {
		grid-template-rows: none;
	}
	.news-feature {
		min-height: 150px;
	}
	.footer-links {
		gap: 8px 18px;
	}
	.footer-contact {
		grid-template-columns: 1fr;
		gap: 7px;
	}
	.inner-banner {
		height: 145px;
	}
	body:has(.main-nav .is-active > a[href="list_site.html"])
		.gallery-list-page.section-space,
	body:has(.main-nav .is-active > a[href="list_honor.html"])
		.gallery-list-page.section-space {
		padding-top: 32px;
	}
	body:has(.main-nav .is-active > a[href="list_site.html"]) .inner-banner,
	body:has(.main-nav .is-active > a[href="list_honor.html"]) .inner-banner {
		height: 92px;
	}
	.breadcrumb {
		font-size: 12px;
	}
	.article-page .section-title h2,
	.news-list-page .section-title h2,
	.gallery-list-page .section-title h2 {
		font-size: 25px;
	}
	.sidebar {
		display: block;
	}
	.side-nav {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	.side-products {
		grid-template-columns: repeat(2, 1fr);
	}
	.bar-title em {
		display: none;
	}
	.list-product-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.product-summary {
		grid-template-columns: 1fr;
		gap: 18px;
		padding: 0 12px 20px;
	}
	.product-summary h1 {
		margin-top: 0;
	}
	.related-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.related-grid .product-card:last-child {
		display: none;
	}
	.news-card-grid {
		grid-template-columns: 1fr;
	}
	.news-card a {
		min-height: auto;
	}
	.detail-heading h1 {
		font-size: 23px;
	}
	.related-news {
		grid-template-columns: 1fr;
	}
	.gallery-grid {
		gap: 22px 12px;
	}
	.certificate {
		padding: 14px 10px;
		border-width: 7px;
	}
	.certificate strong {
		font-size: 17px;
	}
	.gallery-visual.is-certificate .certificate strong {
		margin-top: 15px;
		font-size: 28px;
	}
	.gallery-visual.is-certificate .certificate-star {
		margin-top: 12px;
		font-size: 42px;
	}
	.contact-grid {
		grid-template-columns: 1fr;
	}
	.contact-grid > img {
		min-height: 240px;
	}
	.contact-panel {
		padding: 28px 24px;
	}
	.form-grid {
		grid-template-columns: 1fr;
	}
	.form-grid label:last-child {
		grid-column: auto;
	}
	.contact-form {
		padding: 26px 20px;
	}
	.news-list-layout {
		grid-template-columns: 1fr;
	}
	.news-list-page .news-card-grid {
		margin-left: 0;
	}
	.news-side-nav {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
	.news-side-nav h3 {
		grid-column: 1 / -1;
	}
	.news-side-nav a {
		padding: 10px 14px;
		text-align: center;
	}
	.news-side-nav a:hover {
		padding-left: 14px;
	}
	.about-photo-strip {
		grid-template-columns: 1fr;
	}
	.about-photo-strip img {
		height: 190px;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}