/*
	Helios by HTML5 UP
	html5up.net | @ajlkn
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

/* ========== 基础重置 ========== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

*:focus,
*:focus-visible,
*:active,
*:visited {
    outline: none !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent !important;
}

body {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 300;
    background: #f0f4f4;
    color: #5b5b5b;
    font-size: 16px;
    line-height: 1.6;
    overflow-x: auto;
    min-width: 1200px;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    text-decoration: none;
    transition: all 0.3s ease;
}

ul, ol {
    list-style: none;
}

/* ========== 全局主容器 ========== */
.page-wrapper {
    width: 1920px;
    margin: 0 auto;
    background: #fff;
    position: relative;
}


/* header 底部图片层 */
	.header-bottom-image {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		text-align: center;
		z-index: 2;
	}

	.header-bottom-image img {
		width: 100%;
		max-height: 300px;
		object-fit: cover;
		display: block;
	}

	/* top-navbar顶部通栏导航栏 */
	.top-navbar {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		/* max-height: 50px; */
		z-index: 1000;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background:rgba(255, 255, 255, 0.138);
		backdrop-filter: blur(10px);
		padding: 10px 2%;
		box-sizing: border-box;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
	}

	/* 左侧区域 */
	.navbar-left {
		display: flex;
		align-items: center;
		gap: 12px;
	}
	.navbar-logo {
		width: 45px;
		height: 45px;
		object-fit: contain;
		border-radius: 10px;
	}

	.navbar-text {
		color: #fff;
		line-height: 1.3; 
		text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
	}

	.navbar-title {
		font-size: 16px;
		font-weight: 600;
		letter-spacing: 1px;
		margin-bottom: 2px;
		font-family:"SimSun", "宋体", serif;
	}

	.navbar-subtitle {
		font-size: 11px;
		opacity: 0.8;
		letter-spacing: 0.5px;
	}

	/* 右侧菜单 */
	.navbar-right {
		display: flex;
		font-size: 18px;
	}

	.navbar-menu {
		list-style: none;
		display: flex;
		gap: 0.3em;
		margin: 0;
		padding: 0;
	}

	.navbar-menu li {
		margin: 0;
		padding: 0;
	}

	.navbar-menu li a {
		color: #fff;
		text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
		text-decoration: none;
		padding: 8px 18px;
		border-radius: 30px;
		font-size: 16px;
		font-weight: 400;
		transition: all 0.3s ease;
		border: none;
	}

	.navbar-menu li a:hover {
		background: rgba(0, 0, 0, 0.1);
		color: rgb(255, 255, 255);
	}

/* Header */
/* 背景图容器 */
	#header {
		position: relative;
		min-height: 100vh;      /* 至少占满视口高度 */
		overflow: hidden;        /* 防止图片溢出 */
	}

	/* 背景图片 */
	#header .header-bg {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		/* object-fit: cover;   */
		object-position: center; /* 居中显示 */
		z-index: 0;
	}
	#header:before {
		content: '';
		display: inline-block;
		vertical-align: middle;
		height: 100%;
	}

	#header .inner {
		position: absolute;     /* 改为 absolute，相对于 #header 定位 */
		left: 70%;              /* 水平居中 */
		top: 50%;              /* 垂直位置，可以根据需要调整百分比 */
		transform: translate(-50%, -50%);  /* 让居中生效 */
		z-index: 1;
		width: 50%;            /* 宽度百分比 */
		max-width: 1200px;
		text-align: center;
		text-align: right;
		
	}
	#header .inner header p1{
		letter-spacing: 0.3em;
		margin-right: -0.2em;
		word-spacing: 0.1em;
		/* line-height: 1; */
		font-size: 18px;
		/* font-weight: 600; */
		font-family: 'Montserrat', 'Helvetica Neue', sans-serif;
		line-height: 2;
		color: #fff;
	}
	#header .inner header p3{
		display: block; 
		letter-spacing: 0.3em;
		margin-right: -0.2em;
		word-spacing: 0.5em;
		line-height: 1;
		font-size: 18px;
		/* font-weight: 600; */
		font-family: 'Montserrat', 'Helvetica Neue', sans-serif;
		color: #fff;
	}
	#header .inner header p2{
		letter-spacing: 0.8em;
		margin-right: -0.8em;
		color: #fff;
		font-size: 18px;
	}
	#header header {
		display: inline-block;
	}

		#header header > p {
			font-size: 24px;
			margin: 0;
		}

	#header h1 {
		letter-spacing: 0.1em;
		margin-right: -0.1em;
		color: #fff;
		font-size: 40px;
		line-height: 1.5em;
		margin-top: 0.1em;
		font-weight: normal;
	}

		#header h1 a {
			color: inherit;
		}

	#header hr {
		top: 1.5em;
		margin-bottom: 3em;
		border-bottom-color: rgba(192, 192, 192, 0.35);
		box-shadow: inset 0 1px 0 0 rgba(192, 192, 192, 0.35);
	}

		#header hr:before, #header hr:after {
			background: rgba(192, 192, 192, 0.35);
		}

	#header footer {
		margin: 1em 0 0 0;
	}

	/* 手机设备（小于 768px） */
	@media (max-width: 768px) {
		#header h1 {
			letter-spacing: 0.1em;
			margin-right: -0.1em;
			color: #fff;
			font-size: 36px;
			line-height: 1.5em;
			margin-top: 0.1em;
			font-weight: normal;
		}
		#header .inner header p1{
			letter-spacing: 0.3em;
			margin-right: -0.2em;
			word-spacing: 0.1em;
			/* line-height: 1; */
			font-size: 15px;
			/* font-weight: 600; */
			font-family: 'Montserrat', 'Helvetica Neue', sans-serif;
			line-height: 2;
			color: #fff;
		}
		#header .inner header p3{
			display: block; 
			letter-spacing: 0.3em;
			margin-right: -0.2em;
			word-spacing: 0.5em;
			line-height: 1;
			font-size: 15px;
			/* font-weight: 600; */
			font-family: 'Montserrat', 'Helvetica Neue', sans-serif;
			color: #fff;
		}
		#header .inner header p2{
			letter-spacing: 0.8em;
			margin-right: -0.8em;
			color: #fff;
			font-size: 16px;
		}
	}
/* Banner */

	#banner {
    background: transparent;
    padding: 8% 0;
    margin-bottom: 0;
    position: relative;
	}

	.banner-images {
		position: relative;
		max-width: 1200px;
		margin: 0 auto;
		text-align: center;
	}

	/* 底层图片（背景装饰） */
	.banner-img-bg {
		display: block;
		margin: 0 auto;
	}

	/* 上层图片（主要内容） */
	.banner-img-main {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		max-width: 600px;
		display: block;
	}


/* Carousel */
	/* ========== 3D 卡片轮播样式 ========== */
	.carousel-wrapper {
		width: 100%;
		/* padding: 5% 0; */
		overflow: hidden;
	}

	.carousel-title {
		font-size: 32px;
		font-weight: 700;
		color: #1a3e50;
		text-align: center;
		margin-bottom: 40px;
	}

	.carousel-container {
		/* width: 100%; */
		height: 360px;
		position: relative;
		perspective: 1000px;
		margin: 0 auto;
	}

	.carousel-track {
		width: 80%;
		height: 100%;
		position: relative;
		transform-style: preserve-3d;
		margin: 0 auto;
	}

	/* 卡片基础样式 */
	.card {
		position: absolute;
		width: 350px;
		height: 300px;
		left: 50%;
		top: 50%;
		background: #fff;
		border-radius: 10%;
		overflow: hidden;
		box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
		transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
		cursor: pointer;
	}

	.card img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	/* 中间卡片 */
	.card.center {
		transform: translate(-50%, -50%) translateX(0) scale(1);
		z-index: 10;
		opacity: 1;
	}

	/* 左边第1张 */
	.card.left-1 {
		transform: translate(-50%, -50%) translateX(-100%) scale(0.85);
		z-index: 5;
		opacity: 0.8;
	}

	/* 左边第2张 */
	.card.left-2 {
		transform: translate(-50%, -50%) translateX(-185%) scale(0.7);
		z-index: 3;
		opacity: 0.6;
	}

	/* 右边第1张 */
	.card.right-1 {
		transform: translate(-50%, -50%) translateX(100%) scale(0.85);
		z-index: 5;
		opacity: 0.8;
	}

	/* 右边第2张 */
	.card.right-2 {
		transform: translate(-50%, -50%) translateX(185%) scale(0.7);
		z-index: 3;
		opacity: 0.6;
	}

	/* 隐藏其他卡片 */
	.card.hidden {
		transform: translateX(0) scale(0);
		opacity: 0;
		pointer-events: none;
		z-index: 0;
	}

	/* 卡片悬停 - 保持原位置只放大 */
	.card.center:hover {
		transform: translate(-50%, -50%) scale(1.1) ;
		transition: all 0.3s ease;
		z-index: 20;
		opacity: 1;
	}

	.card.left-1:hover{
		transform: translate(-50%, -50%) translateX(-100%) scale(1) ;
		transition: all 0.3s ease;
		z-index: 15;
		opacity: 1;
	}
	.card.right-1:hover{
		transform: translate(-50%, -50%) translateX(100%) scale(1) ;
		transition: all 0.3s ease;
		z-index: 15;
		opacity: 1;
	}
	.card.left-2:hover{
		transform: translate(-50%, -50%) translateX(-185%) scale(0.8) ;
		transition: all 0.3s ease;
		z-index: 15;
		opacity: 1;
	}
	.card.right-2:hover {
		transform: translate(-50%, -50%) translateX(185%) scale(0.8) ;
		transition: all 0.3s ease;
		z-index: 15;
		opacity: 1;
	}

	/* 左右箭头按钮（无背景） */
	.nav-arrow {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		background: transparent;
		border: none;
		cursor: pointer;
		z-index: 20;
		padding: 0;
	}

	/* 箭头外层容器（背景框） */
	.arrow-wrapper {
		width: 80px;
		height: 80px;
		border-radius: 20%;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s ease;
	}

	/* 箭头图片 */
	.arrow-wrapper img {
		width: 44px;
		height: 44px;
		object-fit: contain;
		display: block;
	}

	/* 鼠标悬停时背景框变色（和导航栏效果一样） */
	.nav-arrow:hover .arrow-wrapper {
		background: rgba(128, 128, 128, 0.35);
		transform: scale(1.2);
	}

	.nav-arrow.left {
		left: 5%;
	}

	.nav-arrow.right {
		right: 5%;
	}

	/* 点状导航 */
	.dots-3d {
		display: flex;
		justify-content: center;
		gap: 12px;
		margin-top: 6%;
		height: 18px;
	}

	.dot-3d {
		width: 12px;
		height: 12px;
		border-radius: 50%;
		background: rgba(44, 130, 186, 0.3);
		cursor: pointer;
		transition: all 0.3s ease;
	}

	.dot-3d.active {
		background: #2c82ba;
		transform: scale(1.3);
	}

	/* 响应式 - 平板 */
	@media (max-width: 768px) {
		.carousel-container {
			height: 350px;
		}
		
		.card {
			width: 200px;
			height: 200px;
			margin-left: -100px;
			margin-top: -130px;
			top: 90%;
			left: 60%;
		}
		
		.card.left-1 {
			transform: translate(-50%, -50%) translateX(-100%) scale(0.85);
		}
		
		.card.left-2 {
			transform: translate(-50%, -50%) translateX(-185%) scale(0.7);
		}
		
		.card.right-1 {
			transform: translate(-50%, -50%) translateX(100%) scale(0.85);
		}
		
		.card.right-2 {
			transform: translate(-50%, -50%) translateX(185%) scale(0.7);
		}
		
		.nav-arrow {
			width: 36px;
			height: 36px;
			font-size: 22px;
		}
	}

	/* 响应式 - 手机 */
	@media (max-width: 480px) {
		.carousel-container {
			height: 320px;
		}
		
		.card {
			width: 200px;
			height: 200px;
			margin-left: -80px;
			margin-top: -105px;
			top: 90%;
			left: 60%;
		}
		
		.card.left-1 {
			transform: translate(-50%, -50%) translateX(-100%) scale(0.85);
		}
		
		.card.left-2 {
			transform: translate(-50%, -50%) translateX(-185%) scale(0.7);
		}
		
		.card.right-1 {
			transform: translate(-50%, -50%) translateX(100%) scale(0.85);
		}
		
		.card.right-2 {
			transform: translate(-50%, -50%) translateX(185%) scale(0.7);
		}
	}

/* wrapper style1 */
	.wrapper-style1 {
		position: relative;
		overflow: hidden;
		padding-top: 10%;
	}

	/* 右下角背景图 - 绝对定位 */
	.wrapper-bg-img {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 40%;
		height: auto;
		z-index: 0;
	}

	/* 确保所有内容在背景图上面 */
	.wrapper-style1 .section-top,
	.wrapper-style1 .section-middle,
	.wrapper-style1 .section-bottom {
		position: relative;
		z-index: 1;
	}
/* section-top */
	.section-top {
		position: relative;
		text-align: center;
		margin-bottom: 10%;
		width: 100%; 
	}

	.section-top img {
		display: block;
		margin: 0 auto;
		max-width: 100%;
		height: auto;
	}

	/* 底层图片（背景装饰） */
	.section-top-img-bg {
		display: block;
		margin: 0 auto;
		width: 60%; 
	}

	/* 上层图片（主要内容） */
	.section-top-img-main {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		/* max-width: 600px; */
		display: block;
		/* width: 80%;  */
	}

/* section-middle */
	.section-middle {
		position: relative;
		margin-bottom: 0%;
		padding-left: 10%;
	}

	.section-middle img {
		display: block;
		max-width: 100%;
		height: auto;
	}
	.section-middle-img-up {
		display: block;
		margin: 0;           /* 去掉 auto，改为 0 */
		margin-bottom: 2em;  /* 图片之间的间距 */
		margin-top: 5em;
		width: 33%; 
		left: 20em;
	}	
	.section-middle-img-line {
		display: block;
		margin: 0;           /* 去掉 auto，改为 0 */
		margin-bottom: 2em;  /* 图片之间的间距 */
		left: 20em;
		width: 60%; 
		/* z-index: -100; */
	}	
	.section-middle-img-down {
		display: block;
		margin: 0;           /* 去掉 auto，改为 0 */
		margin-bottom: -6em;  /* 图片之间的间距 */
		width: 33%; 
		left: 20em;
	}
/* section-bottom */
	.section-bottom {
		position: relative;
		text-align: center;
	}

	.section-bottom-img-middle {
		position: relative;
		z-index: 0;
		display: block;
		/* margin: 0; */
		max-width: 100%;
		height: 50%;
	}

	.section-bottom-img-bottom {
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
		z-index: 1;
		width: 80%;
		/* opacity: 0.5; */
	}

/* wrapper style2 */

	.section-top-2 {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		width: 100%;
		padding: 60px 10%;
		box-sizing: border-box;
	}

	/* 左边 div 宽度 */
	.top-left {
		width: 45%;           /* 左边占 55% */
		text-align: left;
	}

	/* 右边 div 宽度 */
	.top-right {
		width: 50%;           /* 右边占 35% */
		text-align: right;
		align-self: flex-end;
		top: 80px;
	}

	.left-text {
		line-height: 1.8;
		font-size: 20px;
		font-weight: bold;
		color: #2b252c;
	}

	.right-text {
		letter-spacing: 0.1em;
		font-size: 24px;
		font-weight: bold;
		/* white-space: pre;  */
		color: #2b252c;
	}
	
	.section-middle-2 {
		position: relative;
		text-align: center;
		margin-bottom: 2em;
		margin-top: 5%;
	}

	.section-middle-2 img {
		display: block;
		margin: 0 auto;
		max-width: 100%;
		height: auto;
	}
	/* 底层图片（背景装饰） */
	.section-middle-2-img-down {
		display: block;
		margin: 0 auto;
		width: 60%; 
	}

	/* 上层图片（主要内容） */
	.section-middle-2-img-up {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		max-width: 600px;
		display: block;
		/* width: 80%;  */
	}

	/* section-bottom-2 左中右排列 */
	.section-bottom-2 {
		display: flex;
		justify-content: center;
		align-items: center;     /* 垂直居中 */
		gap: 5%;
		padding: 80px 10%;
		flex-wrap: wrap;
		position: relative;
	}


	.section-bottom-2-img-left,
	.section-bottom-2-img-middle,
	.section-bottom-2-img-right {
		width: 30%;           /* 三张等宽 */
		height: auto;
		display: block;
		z-index: 1;
	}

	/* 箭头通用样式 */
	.arrow-icon {
		position: absolute;
		width: 1%;
		z-index: 10;
		top: 71%;
	}

	/* 第一个箭头 - 定位到左边图片 */
	.arrow-1 {
		left: 32%;
	}

	/* 第二个箭头 - 定位到中间图片 */
	.arrow-2 {
		right: calc(39%);  /* 需要根据 gap 调整 */
	}

	/* 第三个箭头 - 定位到右边图片 */
	.arrow-3 {
		right: calc(11%);  /* 需要根据 gap 调整 */
	}
/* Footer */

	#footer {
		position: relative;
		overflow: hidden;
		background: #EBEBEB;
		color: #2b252c;
		word-break: normal; 
	}
	.footer-contact {
		display: flex;
		justify-content: space-between;
		padding: 60px 10%;
	}
	
	.footer-left,
	.footer-right {
		flex: 1;
	}
	
	.footer-left {
		text-align: left;
		flex: 1;
	}
	
	.footer-right {
		text-align: left;
		padding-left: 15%;
	}
	
	/* 左边第1行 */
	.footer-left .line-1 {
		font-size: 32px;
		line-height: 1.3;
		margin-bottom: 6px;   /* 下方间距 */
	}
	
	/* 左边第2行 */
	.footer-left .line-2 {
		font-size: 18px;
		line-height: 1;
		letter-spacing: 0.05em;
	}
	/* 左边第3行 */
	.footer-left .line-3 {
		font-size: 18px;
		line-height: 1;
		letter-spacing: 0.05em;
	}
	/* 左边第4行 */
	.footer-left .line-4 {
		font-size: 54px;
		font-weight: 300;
		margin-top: 18px;      /* 上方间距 */
	}
	
	/* 左边第5行 */
	.footer-left .line-5 {
		font-size: 18px;
		margin-bottom: 18px;   /* 下方间距 */
	}
	
	/* 右边第1行 */
	.footer-right .line-1 {
		font-size: 24px;
		font-weight: bold;
		margin-top: 4px;
	}
	
	/* 右边第2行 */
	.footer-right .line-2 {
		font-size: 48px;
		font-weight: bold;
	}
	
	/* 右边第3行 */
	.footer-right .line-3 {
		font-size: 24px;
		font-weight: bold;
		line-height: 2;
	}

	/* 右边第4行 */
	.footer-right .line-4 {
		font-size: 18px;
	}
	
	/* 分界线 */
	.footer-divider {
		width: 80%;              /* 宽度与内容对齐 */
		margin: -36px  auto -16px;
		height: 1.5px;
		background:#2b252c;
	}
	/* 备案号 */
	.end {
		position: relative;
		font-size: 14px;
		left: 10%; 
		margin-top: 3%;
		margin-bottom: 3%;
	}