/* 全局重置与基础样式 */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "PingFang SC", Helvetica, "Helvetica Neue", "Microsoft Yahei", "SimSun", Tahoma, Arial, sans-serif, verdana;

}

body {
	color: #333;
	line-height: 1.6;
	background-color: #f9f7f5;
	overflow-x: hidden;
}

a {
	text-decoration: none;
	color: inherit;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
}

p {
	margin: 0px;
	padding: 0px;
}

ul,
li,
dl,
dd {
	padding: 0px;
	margin: 0px;
	list-style: none;
}




/* 容器样式 */
.container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}
.content {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0px;
}
/* 通用标题样式 */
.section-title {
	font-size: 40px;
	font-weight: 700;
	text-align: center;
	margin-bottom: 20px;
	position: relative;
	color: #333333;
}

.section-desc {
	font-size: 18px;
	color: #9aa1ab;
	text-align: center;
	max-width: 1100px;
	font-weight: 400;
	margin: 0 auto 60px;
}

/* 头部导航 */
.header {
	background-color: #fff;
	padding: 20px 0;
	position: relative;
}

.header .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 15px;
}

.header-logo {

	display: flex;
	align-items: center;
	gap: 8px;
	order: 1;
}

.header-nav {
	display: flex;
	gap:60px;
	font-size: 18px;
	color: #333333;
	font-weight: 500;
	order: 2;
}

.header-nav a:hover {
	color: #27c293;
}

.header-login {
	margin: 0px 10px;
	/* 排序：桌面端第3位，移动端第2位 */
	order: 3;
}

.header-login a {
	border: 1px solid #27c293;
	border-radius: 30px;
	font-size: 14px;
	outline: none;
	color: #27c293;
	min-width:90px;
	max-width: 110px;
	display: flex;
	flex-wrap: nowrap;
	text-align: center;
	justify-content: center;
	line-height:26px;
}
.header-login a:hover{
	background-color: #27c293;
	color: #ffffff;
}

/* 汉堡菜单样式 */
.hamburger {
	width: 36px;
	height: 17px;
	flex-direction: column;
	justify-content: space-between;
	cursor: pointer;
	z-index: 100;
	/* 排序：桌面端隐藏，移动端第3位（最右侧） */
	order: 4;
	display: none;
}

.hamburger span {
	display: block;
	width: 100%;
	height: 3px;
	background-color: #00a884;
	border-radius: 2px;
	transition: all 0.3s ease;
}
/* 新增登录框样式 */

	.loginmain{
		width: 100%;
		background: url(../img/loginbg.png) bottom center no-repeat;
		
	}
    /* 核心颜色变量 - 仅保留用到的 */
        :root {
          --color-primary: #10B981;
          --color-primary-hover: #1db083;
          --color-secondary: #ECFDF5;
          --color-gray-200: #E5E7EB;
          --color-gray-300: #D1D5DB;
          --color-gray-500: #6B7280;
          --color-gray-800: #1F2937;
          --color-white: #FFFFFF;
          --login-card-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
          --transition-default: all 0.2s ease;
		  /* 复选框自定义变量 */
		  --checkbox-border-color: #c4d8d2; /* 未选中边框色 */
		  --checkbox-checked-bg: #27c293; /* 选中背景色 */
		  --checkbox-checked-border: #27c293; /* 选中边框色 */
		  --checkbox-size: 16px; /* 复选框尺寸 */
        }
    
       /* 头部核心样式 - 简化版 */
           .login-header {
             background: white;
             padding: 16px;
             box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
           }
           .login-header .header-content {
             max-width: 1200px;
             margin: 0 auto;
             display: flex;
             justify-content: space-between;
             align-items: center;
           }
           .login-header .logo-box {
             display: flex;
             align-items: center;
           }
           .login-header .logo {
             width: 40px;
             height: 40px;
             background: var(--color-primary);
             border-radius: 50%;
             display: flex;
             align-items: center;
             justify-content: center;
             color: white;
             margin-right: 8px;
           }
           .login-header .logo-text h1 {
             font-size: 18px;
             font-weight: 600;
             color: var(--color-gray-800);
           }
           .login-header .logo-text p {
             font-size: 12px;
             color: var(--color-gray-500);
           }
           .login-header .menu-btn {
             color: var(--color-gray-500);
             border: none;
             background: transparent;
             cursor: pointer;
           }
       
           /* 登录区域核心样式 - 右侧布局 */
           .login-section {
             
             padding: 46px 20px;
             flex-grow: 1;
             display: flex;
             align-items: center;
             justify-content: flex-end;
             max-width: 1200px;
             margin: 0 auto;
             width: 100%;
           }
		  
           .login-card-wrapper {
             width: 100%;
             max-width:422px;
             position: relative; /* 作为右上角按钮的定位参考 */
             z-index: 10;
             margin-right: 0px;
           }
           /* 核心修改：固定login-card高度，消除切换抖动 */
           .login-card {
             background: white;
             border-radius: 12px;
             padding: 40px;
             box-shadow: var(--login-card-shadow);
             position: relative;
             height: 417px; /* 固定高度417px */
             overflow: hidden; /* 防止内容溢出 */
           }
       
           /* Tab切换样式 - 核心布局调整 */
           .tab-container {
             display: flex;
             align-items: center;
             justify-content: center;
             margin-bottom: 30px;
             position: relative;
             height: 40px; /* 固定Tab容器高度 */
           }
           .tab-group {
             display: flex;
             gap: 32px;
           }
           .tab-btn {
             padding: 8px 4px;
             font-weight: 500;
             border: none;
             background: transparent;
             color: #222222;
             cursor: pointer;
             transition: var(--transition-default);
             position: relative; /* 伪元素定位参考 */
			 font-size: 22px;
           }
           /* 核心修改：Tab激活态下划线改为30px宽度，居中显示 */
           .tab-btn.active {
             color: var(--color-primary);
			 font-weight: 600;
           }
           .tab-btn.active::after {
             content: '';
             position: absolute;
             bottom: 0;
             left: 50%;
             transform: translateX(-50%);
             width: 30px; /* 固定30px宽度 */
             height: 2px;
             background-color: var(--color-primary);
           }
           .tab-btn:hover {
             color: var(--color-primary);
           }
       
           /* 二维码切换按钮 - 40px*40px + login-card-wrapper右上角 */
           .qrcode-switch-btn {
             position: absolute;
             top: 10px; /* 和login-card内边距对齐 */
             right: 10px; /* 和login-card内边距对齐 */
             width: 40px;
             height: 40px;
             border-radius: 50%;
             display: flex;
             align-items: center;
             justify-content: center;
             color: var(--color-gray-500);
             border: none;
             background: transparent;
             cursor: pointer;
             transition: var(--transition-default);
             font-size: 18px;
             z-index: 11; /* 确保在最上层 */
           }
           .qrcode-switch-btn:hover {
             color: var(--color-primary);
             background-color: #f5f5f5;
           }
       
           /* 登录面板容器：统一高度，消除切换抖动 */
           .login-panel {
             height: calc(100% - 64px); /* 减去Tab高度+margin */
             display: flex;
             flex-direction: column;
           }
       
           /* 输入框样式 */
           .form-group {
             margin-bottom: 16px;
           }
           .input-with-icon {
             position: relative;
           }
           .input-icon {
             position: absolute;
             left: 20px;
             top: 50%;
             transform: translateY(-50%);
             pointer-events: none;
           }
           .form-input {
             width: 100%;
             padding: 10px 16px 10px 59px;
             border: 1px solid #c4d8d2;
             border-radius: 4px;
             font-size: 14px;
             transition: var(--transition-default);
           }
		   .borderline{
			   border: 1px solid #c4d8d2;
			   border-radius: 2px;
		   }
		   .bordernone{
			  border-style: none;
			   transition: var(--transition-default);
		   }
           .form-input:focus {
             border-color: var(--color-primary);
             box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2);
             outline: none;
           }
       
           /* 密码切换按钮 */
           .password-toggle {
             position: absolute;
             right: 12px;
             top: 50%;
             transform: translateY(-50%);
             color: var(--color-gray-500);
             border: none;
             background: transparent;
             cursor: pointer;
             transition: var(--transition-default);
			 width: 18px; /* 图片宽度，可自定义 */
			   height: 15px; /* 图片高度，可自定义 */
           }
		   .password-toggle img {
		     width: 100%;
		     height: 100%;
		     object-fit: contain; /* 保持图片比例，不会拉伸变形 */
		   }
           .password-toggle:hover {
             opacity: 0.8; /* hover时轻微透明，提升交互感 */
           }
       
           /* 验证码区域 */
           .captcha-group {
             display: flex;
             gap: 8px;
			 border: 1px solid #c4d8d2;
			 border-radius: 4px;
           }
           .captcha-input {
             flex: 1;
           }
           .captcha-img {
             width: 105px;
             height: 40px;
             display: flex;
             align-items: center;
             justify-content: center;
             cursor: pointer;
             transition: var(--transition-default);
             user-select: none;
           }
           .captcha-img:hover {
             background-color: #eee;
           }
       
           /* 协议勾选区域 */
           .agreement-group {
             display: flex;
             align-items: center;
             justify-content: space-between;
             font-size: 14px;
             margin-bottom: 10px;
           }
           .agreement-checkbox {
             display: flex;
             align-items: center;
             color: var(--color-gray-500);
           }
           .agreement-checkbox input {
             margin-right: 8px;
			 border: #27c293 solid 1px;
           }
           .forgot-pwd {
             color: var(--color-primary);
             text-decoration: none;
           }
           .forgot-pwd:hover {
             text-decoration: underline;
           }
       .borderline{
       			   border: 1px solid #c4d8d2;
       			   border-radius: 2px;
       }
	   /* 协议勾选区域 - 核心：自定义checkbox样式 */
	       .agreement-group {
	         display: flex;
	         align-items: center;
	         justify-content: space-between;
	         font-size: 14px;
	         margin-bottom: 16px;
	       }
	       .agreement-checkbox {
	         display: flex;
	         align-items: center;
	         color: var(--color-gray-500);
	         cursor: pointer; /* 整个label可点击 */
	         position: relative;
	       }
	       /* 隐藏原生checkbox */
	       .agreement-checkbox input[type="checkbox"] {
	         position: absolute;
	         opacity: 0; /* 隐藏但保留功能 */
	         width: 0;
	         height: 0;
	       }
	       /* 模拟checkbox的边框样式 */
	       .agreement-checkbox .checkbox-custom {
	         width: var(--checkbox-size);
	         height: var(--checkbox-size);
	         border: 1px solid var(--checkbox-border-color);
	         border-radius: 2px; /* 圆角可自定义 */
	         margin-right: 8px;
	         display: inline-block;
	         position: relative;
	         transition: all 0.2s ease;
	       }
	       /* hover状态的边框样式 */
	       .agreement-checkbox:hover .checkbox-custom {
	         border-color: var(--color-primary);
	       }
	       /* 选中后的样式 */
	       .agreement-checkbox input[type="checkbox"]:checked + .checkbox-custom {
	         background-color: var(--checkbox-checked-bg);
	         border-color: var(--checkbox-checked-border);
	       }
	       /* 选中后的对勾样式 */
	       .agreement-checkbox input[type="checkbox"]:checked + .checkbox-custom::after {
	         content: '';
	         position: absolute;
	         left: 4px;
	         top: 1px;
	         width: 4px;
	         height: 8px;
	         border: solid white;
	         border-width: 0 2px 2px 0;
	         transform: rotate(45deg);
	       }
	       /* 可选：选中后hover样式 */
       .agreement-checkbox input[type="checkbox"]:checked:hover + .checkbox-custom {
         background-color: var(--color-primary-hover);
       }
       /* 用户协议和隐私政策链接样式 */
       .agreement-checkbox a {
         color: var(--color-primary);
         text-decoration: none;
         margin: 0 2px;
       }
       .agreement-checkbox a:hover {
         text-decoration: underline;
       }
           /* 登录按钮 - 固定在面板底部 */
           .login-btn {
             width: 100%;
             background-color: #27c293;
             color: white;
             padding: 10px 0;
             border-radius: 4px;
             font-size: 16px;
             font-weight: 500;
             border: none;
             cursor: pointer;
             transition: all 0.3s ease;
             margin-top: auto; /* 自动顶到底部，统一按钮位置 */
			 box-shadow:0 6px 10px rgba(39,194,147,0.3) ;
           }
           .login-btn:hover {
             background-color: var(--color-primary-hover);
           }
       
           /* 短信验证码按钮 */
           .sms-captcha-btn {
             padding: 8px 12px;
             background-color: #FFFFFF;
             color: #27c293;
             border: none;
             cursor: pointer;
             transition: var(--transition-default);
           }
           .sms-captcha-btn:hover {
             background-color: #FFFFFF;
			 color: #14be8a;
			 font-weight: bold;
           }
       
           /* 二维码登录面板 */
           .qrcode-panel {
             display: none;
             text-align: center;
             padding: 20px 0;
             height: calc(100% - 64px); /* 统一高度 */
             display: flex;
             flex-direction: column;
             justify-content: center;
			 margin-top: 30px;
           }
           .qrcode-panel h3 {
             font-size: 22px;
             font-weight:800;
             margin-bottom: 10px;
			 
           }
           .qrcode-panel .desc {
             font-size: 16px;
             color:#333333;
             margin-bottom: 14px;
           }
           .qrcode-box {
             width: 227px;
             height: 227px;
             border-radius: 0px;
		 border: #dddddd 1px solid;
             display: flex;
             align-items: center;
             justify-content: center;
             margin: 0 auto 15px;
             color: #999;
             font-size: 14px;
             position: relative;
             text-align: center;
           }
           .qrcode-box canvas {
             display: block;
             margin: 0 auto;
           }
           .qrcode-box span {
             display: flex;
             align-items: center;
             justify-content: center;
             width: 100%;
             height: 100%;
           }
           .qrcode-panel .policy-text {
             font-size: 14px;
             color: var(--color-gray-500);
           }
           .qrcode-panel .policy-text a {
             color: #27c293;
             text-decoration: none;
           }
           .qrcode-panel .policy-text a:hover {
             text-decoration: underline;
           }
           
           /* 二维码加载状态 */
           .qrcode-loading {
             position: absolute;
             top: 0;
             left: 0;
             right: 0;
             bottom: 0;
             background-color: rgba(255, 255, 255, 0.9);
             display: flex;
             flex-direction: column;
             align-items: center;
             justify-content: center;
             z-index: 10;
           }
           .loading-spinner {
             width: 40px;
             height: 40px;
             border: 3px solid #f3f3f3;
             border-top: 3px solid #27c293;
             border-radius: 50%;
             animation: spin 1s linear infinite;
             margin-bottom: 10px;
           }
           @keyframes spin {
             0% { transform: rotate(0deg); }
             100% { transform: rotate(360deg); }
           }
           /* 二维码确认登录遮罩层 */
           .qrcode-confirm {
             position: absolute;
             top: 0;
             left: 0;
             right: 0;
             bottom: 0;
             background-color: rgba(255, 255, 255, 0.9);
             display: flex;
             flex-direction: column;
             align-items: center;
             justify-content: center;
             z-index: 20;
           }
           .confirm-content {
             text-align: center;
           }
           .confirm-content .confirm-title {
             font-size: 18px;
             font-weight: bold;
             font-family: "SimHei", "黑体", sans-serif;
             color: #333333;
             margin: 0 0 15px 0;
             line-height: 1.4;
           }
           .confirm-content .confirm-subtitle {
             font-size: 14px;
             color: #666666;
             margin: 0;
             line-height: 1.4;
           }
           .confirm-content .confirm-back-link {
             color: #27c293;
             text-decoration: none;
             transition: all 0.3s ease;
           }
           .confirm-content .confirm-back-link:hover {
             text-decoration: underline;
           }

       
           /* 返回按钮 - 40px*40px + login-card-wrapper右上角（和二维码按钮位置完全一致） */
           .back-btn {
             position: absolute;
             top: 10px; /* 和qrcode-switch-btn完全一致 */
             right:10px; /* 和qrcode-switch-btn完全一致 */
             width: 40px; /* 统一40px宽度 */
             height: 40px; /* 统一40px高度 */
             border-radius: 50%;
             display: flex;
             align-items: center;
             justify-content: center;
             color: #999;
             border: none;
             background: transparent;
             cursor: pointer;
             transition: var(--transition-default);
             z-index: 11; /* 确保在最上层 */
             font-size: 18px; /* 和二维码按钮字号一致 */
           }
           .back-btn:hover {
             background-color: #f5f5f5;
             color: var(--color-primary);
           }
       
           /* 登录选择弹窗 */
           #login-modal {
             display: flex;
             visibility: hidden;
             opacity: 0;
             transition: all 0.2s ease;
             background-color: rgba(0, 0, 0, 0.5);
             align-items: center;
             justify-content: center;
             position: absolute;
             top: 0;
             left: 0;
             width: 100%;
             height: 100%;
             border-radius: 12px;
             pointer-events: none;
             z-index: 50;
           }
           #login-modal.active {
             visibility: visible;
             opacity: 1;
             pointer-events: auto;
           }
           .login-modal-content {
             background: white;
             border-radius: 12px;
             padding: 20px;
             width: 90%;
             max-width: 350px;
             box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
             position: relative;
             transform: translateY(-10%);
           }
       /* MFA验证弹窗 */
       #mfa-modal, #sms-verify-modal {
         display: flex;
         visibility: hidden;
         opacity: 0;
         transition: all 0.2s ease;
         background-color: rgba(0, 0, 0, 0.5);
         align-items: center;
         justify-content: center;
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         border-radius: 12px;
         pointer-events: none;
         z-index: 50;
       }
       #mfa-modal.active, #sms-verify-modal.active {
         visibility: visible;
         opacity: 1;
         pointer-events: auto;
       }
       .mfa-modal-content {
         background: white;
         border-radius: 12px;
         padding: 30px;
         width: 90%;
         max-width: 350px;
         box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
         position: relative;
		 padding-bottom: 40px;
       }
       /* MFA弹窗标题 */
       .mfa-title {
         text-align: center;
         font-size: 20px;
         font-weight: 600;
         color: var(--color-gray-800);
         margin-top: 5px;
		 margin-bottom: 20px;
		 
       }
       
       /* MFA描述文字 */
       .mfa-desc {
         text-align: center;
         font-size: 15px;
         color: #999999;
         margin-bottom: 20px;
       }
       
       /* MFA输入框 */
       .mfa-input-group {
         margin-bottom: 20px;
       }
       .mfa-input {
         width: 100%;
         padding: 10px 16px;
         border: 1px solid #c4d8d2;
         border-radius: 4px;
         font-size: 14px;
         text-align: center;
         transition: var(--transition-default);
       }
       .mfa-input:focus {
         border-color: var(--color-primary);
         box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2);
         outline: none;
       }
       
       /* MFA进入按钮 */
       .mfa-enter-btn {
         width: 100%;
         background-color: #27c293;
         color: white;
         padding: 10px 0;
         border-radius: 4px;
         font-size: 16px;
         font-weight: 500;
         border: none;
         cursor: pointer;
         transition: all 0.3s ease;
       			 box-shadow:0 6px 10px rgba(39,194,147,0.3) ;
       }
       .mfa-enter-btn:hover {
         background-color: var(--color-primary-hover);
       }
       
           /* 弹窗关闭按钮 - 优化尺寸和样式 */
           .modal-close-btn {
             position: absolute;
             top: 0px;
             right: 10px;
             width: 36px;
             height: 36px;
             border-radius: 50%;
             display: flex;
             align-items: center;
             justify-content: center;
             color: #666;
             font-size: 24px;
             font-weight: 500;
             border: none;
             background: transparent;
             cursor: pointer;
             transition: var(--transition-default);
           }
           .modal-close-btn:hover {
             color: #333;
           }
       
           /* 弹窗内容样式 */
           .modal-title {
             text-align: center;
             font-size: 20px;
             font-weight: 500;
             color: var(--color-gray-800);
             margin-bottom:20px;
           }
           .modal-btn-group {
             display: grid;
             grid-template-columns: repeat(2, 1fr);
             gap: 16px;
           }
           .modal-btn {
             padding: 12px 0;
             border-radius: 8px;
             border: 1px solid #ffffff;
             background: transparent;
             cursor: pointer;
             transition: var(--transition-default);
             display: flex;
             flex-direction: column;
             align-items: center;
           }
           .modal-btn:hover {
             border-color: var(--color-primary);
             background-color: var(--color-secondary);
           }
           .modal-btn .icon-box {
             width: 91px;
             height: 100px;
             display: flex;
             align-items: center;
             justify-content: center;
             color: var(--color-gray-500);
           }
           .modal-btn .btn-text {
             font-size: 16px;
             font-weight: 600;
			 line-height: 40px;
           }
       .btn-text:hover{
		   color: #27c293;
	   }
           /* 辅助隐藏类 */
           .hidden {
             display: none !important; /* 强制隐藏，避免布局影响 */
           }

/* 遮罩样式（完全保留） */
.mask,
.mobile_menu_mask {
	display: block;
	display: none;
}

/* Banner轮播样式（保留原有逻辑，适配外部图片） */
.banner {
	position: relative;
	overflow: hidden;
	min-height: 510px;
}

.banner-carousel {
	display: flex;
	width: 100%;
	height: 100%;
	transition: transform 0.5s ease;
}

.banner-item {
	flex: 0 0 100%;
	width: 100%;
	display: flex;
	align-items: center;
	background-position: center;
	background-size: cover;
}

/* 区分桌面和移动端图片显示（核心：控制外部图片的显示切换） */
.banner-desktop-img {
	display: block;
	width: 100%;
	height: 510px;
	object-fit: cover;
	/* 保持图片比例，避免拉伸 */
}

.banner-mobile-img {
	display: none;
	width: 100%;
	height: 300px;
	object-fit: cover;
	/* 移动端图片比例适配 */
}

/* Banner轮播控制按钮（完全保留） */
.banner-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
	background-color: rgba(0, 0, 0, 0.3);
	color: #fff;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border: none;
	outline: none;
	z-index: 10;
	opacity: 0;
	transition: opacity 0.3s ease;
	font-size: 24px;
	font-weight: bold;
	font-family: "SimSun", Tahoma, Arial, sans-serif, verdana;
}

.banner:hover .banner-btn {
	opacity: 1;
}

.banner-prev {
	left: 20px;
}

.banner-next {
	right: 20px;
}

.banner-btn:hover {
	background-color: rgba(0, 0, 0, 0.7);
}

/* Banner轮播指示器（完全保留） */
.banner-indicators {
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 10px;
}

.banner-indicator {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.5);
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.banner-indicator.active {
	background-color: #00a884;
}

/* 数据统计区 */
.stats {
	padding: 40px 0;
	background-color: #fff;
	min-height: 164px;
}

.stats .container {
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding: 0px;
}

/* 区分桌面和移动端图片显示（核心：控制外部图片的显示切换） */
.stats-desktop-img {
	display: block;
	max-height: 164px;
	
	object-fit: cover;
	/* 保持图片比例，避免拉伸 */
}

.stats-mobile-img {
	display: none;
	width: 100%;
	height: 585px;
	object-fit: cover;
	/* 移动端图片比例适配 */
}


/* 解决方案区 */
.solution {
	padding: 30px 0;
	background-color: #f7fcfb;
	padding-top: 100px;
	
}

.solution-img {
	display: flex;
	justify-content: space-around;
	align-items: center;
	max-height: 533px;
}

.solution-desktop-img {
	display: block;
	width: 100%;
		object-fit: cover;
	/* 保持图片比例，避免拉伸 */
}

.solution-mobile-img {
	display: none;
	width: 100%;
	height: 374px;
	object-fit: cover;
	/* 移动端图片比例适配 */
}

/* 业务流程区 */
.process {
	padding: 100px 0;
	background: url(../img/bg1.png) bottom center no-repeat #e6f8f3;
}


.process-img{
	display: flex;
	justify-content: space-around;
	align-items: center;
	max-height: 533px;
}

.process-desktop-img {
	display: block;
	width: 100%;
	object-fit: cover;
	
	/* 保持图片比例，避免拉伸 */
}

.process-mobile-img {
	display: none;
	width: 100%;
	object-fit: cover;
	/* 移动端图片比例适配 */
}

/* 教学方式区 */
.teaching {
	padding: 100px 0;
	background-color: #fff;
}

.teaching-cards {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: center;
}

.teaching-card {
	
}

.teaching-card ul{
	margin: 0 -12px;
	  display: flex;
	  display: -webkit-flex;
}
.teaching-card li{
	width: 25%;
}
.cardbox{
	margin: 0 12px;
	background: #fff;
	    border: 1px solid #64d8b7;
		border-radius: 46px 12px;
}
.boxtit{
	height: 66px;
	    display: flex;
	    display: -webkit-flex;
	    justify-content: center;
	    align-items: center;
	    background: linear-gradient( to bottom, rgba(183, 240, 224), rgba(255, 255, 255) );
		border-radius: 46px 12px 12px 0px;
}
.boxtit span {
    position: relative;
    width: 34px;
    height: 34px;
    margin-left: -4px;
    margin-right: 18px;
    text-align: center;
    
    font-weight: normal;
}
.boxtit h3 {
    font-size:20px;
    color: #101319;
    font-weight: 900;
	line-height: 36px;
}
.cardbox .txt {
    height: 100px;
    margin: 9px 16px;
    font-size: 14px;
    line-height: 22px;
}
.cardbox .pic {
    width: auto;
	margin: 14px auto;
	margin-bottom:27px;
	text-align: center;
}
/* 功能覆盖区 */
.features {
	padding: 100px 0;
	background: url(../img/bg.png) bottom center no-repeat #24c292;
	color: #fff;
}

.features .section-title,
.features .section-desc {
	color: #fff;
}

.features .section-title::after {
	background-color: #fff;
}

.features-card {
	
}
.features-card ul{
	  display: flex;
	  display: -webkit-flex;
	          margin: 0 -12px;
}
.features-card li{
	width: 25%;
	
}
.featurescardbox{
	background: url(../img/listbg1.png) top center no-repeat;
	width:259px;
	height:455px;
	margin: 0 12px;
}
.featuresboxtit{
	height: 118px;
	    display: flex;
	    display: -webkit-flex;
	    align-items: center;
		margin-bottom: 14px;
		margin-left: 31px;
}
.featuresboxtit span {
    position: relative;
    width: 58px;
    height: 58px;
    margin-top: -20px;
    
    text-align: center; 
    font-weight: normal;
}
.featuresboxtit h3 {
    font-size:24px;
    color: #ffffff;
    font-weight: 500;
	line-height: 36px;
	padding-top: 38px;
	margin-right:30px;
}

.card-list {
	
	padding-left: 53px;
}

.card-list dd {
	position: relative;
	padding-left: 12px;
	display: block;
	font-size: 18px;
	line-height:48px;
	color: #333333;
}


/* 课程资源区 */
.resources {
	padding: 100px 0;
	background-color: #f7fcfb;
	padding-bottom: 0px;
}

.resources-stats {
	display: flex;
	justify-content: center;
	gap: 30px;
	flex-wrap: wrap;
	background-color: #ffffff;
	padding: 40px;
	border-radius: 10px;
	margin-bottom: 50px;
	box-shadow: 0px 0px 20px rgba(0,0,0,0.1);
}
.resstats-img{
	display: flex;
	justify-content: space-around;
	align-items: center;
	max-height: 64px;
	max-width: 1080px;
	margin: 0 auto;
}

.resstats-desktop-img {
	display: block;
	width: 100%;
	object-fit: cover;
	
	/* 保持图片比例，避免拉伸 */
}

.resstats-mobile-img {
	display: none;
	width: 100%;
	object-fit: cover;
	/* 移动端图片比例适配 */
}

.resources-img{
	display: flex;
	justify-content: space-around;
	align-items: center;
	max-height: 502px;
	max-width: 1313px;
	margin: 0 auto;
}

.resources-desktop-img {
	display: block;
	width: 100%;
	object-fit: cover;
	margin-top:80px;
	
	/* 保持图片比例，避免拉伸 */
}

.resources-mobile-img {
	display: none;
	width: 100%;
	object-fit: cover;
	/* 移动端图片比例适配 */
}


/* 走马灯通用样式 */
.carousel {
	position: relative;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto 50px;
	overflow: hidden;
}

.carousel-track {
	display: flex;
	animation: marquee 20s linear infinite;
}

.carousel-item {
	flex: 0 0 auto;
	padding: 0 10px;
	margin: 15px;
}

.carousel-btn {
	display: none !important;
}

@keyframes marquee {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-50%);
	}
}

.carousel:hover .carousel-track {
	animation-play-state: paused;
}

/* 课程资源走马灯专属样式 */
.resources-carousel .carousel-item {
	width: 330px;
	margin: 5px;
}

.resources-carousel img {
	width: 100%;
	object-fit: cover;
}

/* 合作院校走马灯专属样式 */
.carousela{
	position: relative;
	width: 100%;
	margin: 0 auto 50px;
	overflow: hidden;
}
.partners-carousel {
	width: 100%;
	margin: 0 auto;
}

  /* 核心容器：限定可视区域，隐藏溢出 */
        .carousel-container {
            width: 100%;
            overflow: hidden;
            position: relative;
            border-radius: 8px;
            height: 360px; /* 4行 * 80px + 3个间距 * 20px */
        }

        /* 遮罩修复：适配容器高度、响应式宽度、提升层级 */
        .mask {
            position: absolute;
            width: 12vw; /* 改用vw适配不同屏幕 */
            height: 100%; /* 与容器高度一致 */
            z-index: 10; /* 确保高于内容 */
            pointer-events: none; /* 不遮挡鼠标悬停事件 */
        }
        .left-mask {
            left: 0;
            background: linear-gradient(90deg, 
                rgb(255, 255, 255) 0%, 
                rgba(255, 255, 255, 0.92) 42%, 
                rgba(255, 255, 255, 0) 100%); /* 修正渐变方向 */
        }
        .right-mask {
            right: 0;
            background: linear-gradient(90deg, 
                rgba(255, 255, 255, 0) 0%, 
                rgba(255, 255, 255, 0.92) 58%, 
                rgb(255, 255, 255) 100%);
        }

 /* 核心容器：100%页面宽度，隐藏溢出 */
         .partners-carousel {
             width: 100vw; /* 页面100%宽度 */
             overflow: hidden;
             position: relative;
             height: 300px; /* 适配4行内容高度，可调整 */
             margin: 0 auto;
             /* 把内边距移到容器上，避免内容组之间叠加 */
             padding: 0 10px; 
         }
 
         /* 滚动轨道：承载原内容+克隆内容，横向排列（关键！）
            移除所有可能的间距：gap/margin/padding */
         .carousel-track {
             display: flex;
             flex-direction: row; /* 横向排列原/克隆内容组 */
             gap: 0 !important; /* 强制消除flex间距 */
             margin: 0 !important;
             padding: 0 !important;
             width: 200vw; /* 原内容(100vw) + 克隆内容(100vw) */
             height: 100%;
             animation: seamlessScroll 30s linear infinite; /* 无缝滚动动画 */
         }
 
         /* 内容组：每个组包含4行，宽度100vw（页面100%）
            移除左右padding，避免和克隆组叠加产生间距 */
         .carousel-group {
             display: flex;
             flex-direction: column; /* 纵向排列4行 */
             gap: 10px; /* 行间距，可调整 */
             width: 100vw; /* 必须和页面宽度一致 */
             flex-shrink: 0 !important; /* 禁止压缩，保证宽度稳定 */
             height: 100%;
             margin: 0 !important;
             padding: 0 !important; /* 关键：移除内容组的左右内边距 */
         }
 
         /* 单行样式：横向排列6个不等宽item，高度统一 */
         .carousel-row {
             display: flex;
             align-items: center; /* 垂直居中，保证图片高度一致 */
             gap: 8px; /* 列间距，可调整 */
             height: calc((100% - 30px) / 4); /* 均分4行高度（减去3个行间距） */
             width: 100%;
             margin: 0 !important;
             padding: 0 !important;
         }
 
         /* 单个item：宽度自定义，高度统一 */
         .carousel-item {
             flex: 0 0 auto; /* 禁止压缩/拉伸 */
             display: flex;
             align-items: center;
             justify-content: center;
             height: 100%; /* 继承行高，保证所有item高度一致 */
             /* 宽度通过内联样式设置，每行6个宽度不等 */
         }
 
         /* 图片样式：高度统一，宽度自适应 */
         .carousel-item img {
             /* 统一高度 */
             width: auto; /* 宽度自适应，保持比例 */
             object-fit: contain;
             transition: filter 0.3s ease;
			
         }
 
         .carousel-item img:hover {
         }
 
         /* 核心无缝滚动动画：滚动100vw（刚好到克隆内容起点，无偏移） */
         @keyframes seamlessScroll {
             0% {
                 transform: translateX(0); /* 初始位置：显示原内容 */
             }
             100% {
                 transform: translateX(-100vw); /* 滚动到克隆内容起点，无间距 */
             }
         }
 
         /* 鼠标悬浮暂停滚动 */
         .partners-carousel:hover .carousel-track {
             animation-play-state: paused;
         }
  @media (max-width: 1199px) {
	  .stats .container {
			 	
			 	padding: 0px 40px;
			 }
			 }
         /* 响应式适配：小屏调整高度和间距 */
         @media (max-width: 768px) {
             .partners-carousel {
                 height: 160px;
                 padding: 0 8px; /* 小屏调整容器内边距 */
             }
             .carousel-group {
                 gap: 8px;
             }
             .carousel-row {
                 gap: 5px;
                 height: calc((100% - 24px) / 4);
             }
             .carousel-track {
                 animation-duration: 25s; /* 小屏滚动稍快，可调整 */
             }
			 
         }
 
         @media (max-width: 480px) {
             .partners-carousel {
                 height: 140px;
                 padding: 0 6px; /* 超小屏调整容器内边距 */
             }
             .carousel-group {
                 gap: 6px;
             }
             .carousel-row {
                 gap: 3px;
                 height: calc((100% - 18px) / 4);
             }
             .carousel-track {
                 animation-duration: 20s;
             }
         }
       
/* 服务特点区 */
.service-features {
	padding: 100px 0;
	background: url(../img/bg2.png) bottom center no-repeat #e9faf6;
	padding-bottom: 0px;
}


.features-img{
	display: flex;
	justify-content: space-around;
	align-items: center;
	max-height: 608px;
}

.features-desktop-img {
	display: block;
	width: 100%;
	object-fit: cover;
	
	/* 保持图片比例，避免拉伸 */
}

.features-mobile-img {
	display: none;
	width: 100%;
	object-fit: cover;
	/* 移动端图片比例适配 */
}
/* 服务优势区 */
.service-advantages {
	padding: 100px 0;
	background-color: #fff;
}

.service-img{
	display: flex;
	justify-content: space-around;
	align-items: center;
	max-height: 472px;
}

.service-desktop-img {
	display: block;
	width: 100%;
	object-fit: cover;
	
	/* 保持图片比例，避免拉伸 */
}

.service-mobile-img {
	display: none;
	width: 100%;
	object-fit: cover;
	/* 移动端图片比例适配 */
}

/* 合作院校区 */
.partners {
	padding-top: 60px;
	background: url(../img/bg3.png) bottom center no-repeat #ecf8f4;
}

/* 页脚区 */
.footer {
	background-color: #272727;
	color: #757575;
	padding: 50px 0 20px;
}

.footer-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	
	padding-top: 10px;
	padding-bottom: 10px;
}

.footer-logo {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
}
.footer-logo img{
	width: 283px;
	height: 60px;
}
.footericon img{
	width:12px ;
	height:14px ;
	margin-right: 12px;
	
}


.footer-contact {
	font-size: 16px;
	line-height:2;
}
.footerleft{
	font-size: 16px;
}
.footer-qrcode {
	display: flex;
	gap: 30px;
}

.qrcode-item {
	text-align: center;
}

.qrcode-item img {
	width: 125px;
	height:125px;
	background-color: #fff;
	margin-bottom: 5px;
}

.qrcode-item span {
	font-size: 14px;
	display: block;
	text-align: center;
	line-height: 3;
}

.footer-nav {
	display: flex;
	flex-wrap: wrap;
	gap:90px;
	justify-content: center;
	margin-bottom: 30px;
	font-size: 16px;
}

.nav-column h3 {
	font-size: 18px;
	color: #fff;
	margin-bottom: 5px;
}

.nav-column ul {
	font-size: 16px;
	line-height: 2.2;
}
.navboder{
	display: block;
	background-color: #26c293;
	width: 35px;
	height: 2px;
	margin-bottom: 14px;
}
.nav-column ul li a:hover {
	color: #00a884;
}
.font18{
	font-size: 18px;
}
.footer-bottom {
	font-size: 13px;
	text-align: center;
	line-height:2.4;
	padding-top: 20px;
	border-top: 1px solid #484848;
}

.footer-bottom span{
	margin-right: 10px;
}
 /* 主容器 - 100%宽度 */
        .logo-carousel {
            width: 100vw;
            position: relative;
            left: 50%;
            right: 50%;
            margin-left: -50vw;
            margin-right: -50vw;
            overflow: hidden;
            padding: 60px 0;
			padding-top: 0px;
        }
        
        /* 走马灯容器 */
        .logo-infinite-section {
            width: 100%;
            overflow: hidden;
            position: relative;
        }
        
        /* 左右渐变遮罩 */
        .logo-infinite-section::before,
        .logo-infinite-section::after {
            content: '';
            position: absolute;
            top: 0;
            width: 200px;
            height: 100%;
            z-index: 10;
            pointer-events: none;
        }
        
        .logo-infinite-section::before {
            left: 0;
            background: linear-gradient(to right, #edf8f5, rgba(255, 255, 255, 0));
        }
        
        .logo-infinite-section::after {
            right: 0;
            background: linear-gradient(to left, #f8fcfb, rgba(255, 255, 255, 0));
        }
        
        /* 走马灯行 */
        .marquee-row {
            display: flex;
            margin-bottom: 25px;
        }
        
        /* 走马灯轨道 - 关键优化 */
        .marquee-track {
            display: flex;
            animation: marqueeScroll linear infinite;
            /* 轨道宽度自动撑开 */
            width: max-content;
        }
        
        /* 不同行的动画速度和方向 */
        .marquee-row:nth-child(1) .marquee-track {
            animation-duration: 70s;
        }
        
        .marquee-row:nth-child(2) .marquee-track {
            animation-duration: 80s;
            animation-direction: reverse;
        }
        
        .marquee-row:nth-child(3) .marquee-track {
            animation-duration: 90s;
        }
        
        .marquee-row:nth-child(4) .marquee-track {
            animation-duration: 100s;
        }
        
        /* 动画定义 - 无缝循环 */
        @keyframes marqueeScroll {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(-50%);
            }
        }
        
        /* Logo项样式 */
        .logo-item {
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 70px;
            margin: 0 20px;
            padding: 10px 25px;
            transition: transform 0.3s ease;
        }
        
        .logo-item:hover {
            transform: translateY(-5px);
        }
        
        .logo-item img {
            height: 50px;
            width: auto;
            object-fit: contain;
            filter: grayscale(0.3);
            transition: filter 0.3s ease;
        }
        
        /* 重置密码弹窗样式 */
        .reset-pwd-modal {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
            z-index: 200;
            display: flex;
            flex-direction: column;
            padding: 30px 40px;
        }
        
        .reset-pwd-modal.hidden {
            display: none;
        }
        
        .reset-pwd-content {
            width: 100%;
            height: 100%;
            position: relative;
        }
        
        .reset-pwd-close {
            position: absolute;
            top: 10px;
            right: 15px;
            font-size: 15px;
            color: #26c293;
            background: none;
            border: none;
            cursor: pointer;
            padding: 5px;
            text-decoration: underline;
        }
        
        .reset-pwd-close:hover {
            color: #15ae80;
        }
        
        .modal-title {
            text-align: center;
            font-size: 22px;
            color: #333;
            margin-bottom: 30px;
            font-weight: bold;
        }
        
        .step-btn {
            width: 100%;
            height: 44px;
            background-color: #26c293;
            color: #fff;
            border: none;
            border-radius: 4px;
            font-size: 16px;
            cursor: pointer;
            margin-top: 10px;
            margin-bottom: 15px;
        }
        
        .step-btn:hover {
            background-color: #1db083;
        }
        
        .back-btn-text {
            width: 100%;
            height: 44px;
            background-color: #fff;
            color: #666;
            border: 1px solid #ddd;
            border-radius: 4px;
            font-size: 16px;
            cursor: pointer;
        }
        
        .back-btn-text:hover {
            background-color: #f0fefb;
            border-color: #26c293;
            color: #333;
        }
        
        /* 成功状态图标 */
        .success-icon-circle {
            width: 80px;
            height: 80px;
            background-color: #26c293;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 40px auto 20px;
        }
        
        .success-icon-check {
            width: 30px;
            height: 15px;
            border-left: 4px solid #fff;
            border-bottom: 4px solid #fff;
            transform: rotate(-45deg);
            margin-top: -5px;
        }
        
        .success-text {
            text-align: center;
            font-size: 18px;
            color: #333;
            margin-bottom: 40px;
        }
        
        .logo-item:hover img {
            filter: grayscale(0);
        }
        
        /* 响应式设计 */
        @media (max-width: 1200px) {
            .logo-item {
                margin: 0 25px;
                height: 65px;
            }
            
            .logo-infinite-section::before,
            .logo-infinite-section::after {
                width: 150px;
            }
        }
        
        @media (max-width: 992px) {
            .logo-item {
                margin: 0 20px;
                height: 60px;
                padding: 10px 20px;
            }
            
            .logo-item img {
                height:50px;
            }
        }
        
        @media (max-width: 768px) {
           
        }
        
        @media (max-width: 480px) {
           
        }
/* 响应式适配（核心：调整显示/隐藏与排序，保留原有移动端样式） */
@media (max-width: 768px) {

	/* 移动端：隐藏导航菜单，显示汉堡菜单 */
	.header-nav {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		flex-direction: column;
		gap: 0px;
		display: none;
		z-index: 99;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
	}

	.hamburger {
		display: flex;
	}

	/* 移动端排序：logo(1) -> 搜索框(2) -> 汉堡菜单(4，最右侧) */
	.header-login {
		order: 2;
	}

	.header-nav a {
		line-height: 49px;
		border-bottom: 1px solid #f1f3f5;
		display: block;
		padding: 0 24px;
		font-size: 16px;
		font-weight: 600;
		color: #222;
	}

	.header-nav.active {
		display: flex !important;
	}

	/* Banner移动端图片切换 */
	.banner-desktop-img {
		display: none;
	}

	.banner-mobile-img {
		display: block;
	}

	.banner {
		min-height: auto;
	}

	.stats .container {
		flex-direction: column;
	}

	.stats-desktop-img {
		display: none;
	}

	.stats-mobile-img {
		display: block;
	}

	.teaching-card,
	.features-card {
		width: 100%;
		max-width: 300px;
	}

	.resources-carousel .carousel-item {
		width: 300px;
	}

	.partners-carousel .carousel-item {
		width: 120px;
	}

	.carousel-track {
		animation-duration: 15s;
	}

	.footer-top {
		flex-direction: column;
		text-align: center;
	}

	.footer-nav {
		flex-direction: column;
		text-align: center;
		gap: 20px;
	}
	.logo-item {
	    margin: 0 15px;
	    height: 55px;
	    padding: 8px 15px;
	}
	
	.logo-item img {
	    height: 30px;
	    max-width: 100px;
	}
	
	.logo-infinite-section::before,
	.logo-infinite-section::after {
	    width: 80px;
	}
	
	.marquee-row {
	    margin-bottom: 20px;
	}
	.logo-item {
	    margin: 0 15px;
	    height: 55px;
	    padding: 8px 15px;
	}
	
	.logo-item img {
	    height: 50px;
	    max-width: 100px;
	}
	
	.logo-infinite-section::before,
	.logo-infinite-section::after {
	    width: 80px;
	}
	
	.marquee-row {
	    margin-bottom: 20px;
	}
}

/* 桌面端适配（核心：隐藏汉堡菜单，显示导航菜单，保留原有样式） */
@media (min-width: 769px) {

	/* 桌面端：显示导航菜单，隐藏汉堡菜单 */
	.hamburger {
		display: none;
	}

	.header-nav {
		display: flex;
	}

	/* 桌面端排序：logo(1) -> 导航菜单(2) -> 搜索框(3) */
	.header-nav {
		order: 2;
	}

	.header-login {
		order: 3;
	}
	.logo-item {
	    margin: 0 15px;
	    height: 55px;
	    padding: 8px 15px;
	}
	
	.logo-item img {
	    height: 50px;
	}
	
	.logo-infinite-section::before,
	.logo-infinite-section::after {
	    width: 80px;
	}
	
	.marquee-row {
	    margin-bottom: 20px;
	}
	.logo-item {
	    margin: 15px;
	    height: 55px;
	    padding: 8px 15px;
	}
	
	.logo-item img {
	    height: 50px;
	}
	
	.logo-infinite-section::before,
	.logo-infinite-section::after {
	    width: 80px;
	}
	
	.marquee-row {
	    margin-bottom: 20px;
	}
}

/* 小屏手机适配（完全保留） */
@media (max-width: 480px) {
	.section-title {
		font-size: 24px;
	}

	.banner {
		min-height: 250px;
	}

	.banner-item {
		height: 250px;
	}

	.banner-content h1 {
		font-size: 20px;
	}

	.resources-carousel .carousel-item {
		width: 100%;
		max-width: 200px;
	}

	.partners-carousel .carousel-item {
		width: 100px;
	}

	.carousel-track {
		animation-duration: 12s;
	}
	.logo-item {
	    margin: 0 12px;
	    height: 50px;
	    padding: 6px 12px;
	}
	
	.logo-item img {
	    height: 26px;
	    max-width: 80px;
	}
	
	.logo-infinite-section::before,
	.logo-infinite-section::after {
	    width: 50px;
	}
	
	.marquee-row {
	    margin-bottom: 15px;
	}
	.logo-item {
	    margin: 0 12px;
	    height: 50px;
	    padding: 6px 12px;
	}
	
	.logo-item img {
	    height: 26px;
	    max-width: 80px;
	}
	
	.logo-infinite-section::before,
	.logo-infinite-section::after {
	    width: 50px;
	}
	
	.marquee-row {
	    margin-bottom: 15px;
	}
}
		/* APP下载页专用样式 */
			.app-download-page {
				
				background-color: #fff;
			}

			/* Banner 区域 */
			.app-banner {
				background: url('../img/appbanner.jpg') no-repeat center center;
				background-size: cover;
				
				height: 230px;
				position: relative;
				display: flex;
				align-items: center;
				overflow: visible;
			}

			

			.app-banner .container {
				position: relative;
				z-index: 2;
				height: 100%;
				display: flex;
				align-items: center;
				width: 100%;
			}

			.banner-content {
				width: 100%;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}

			.banner-text {
				color: #fff;
				max-width: 600px;
				padding-left: 20px;
			}

			.banner-text h1 {
				font-size: 42px;
				margin-bottom: 15px;
				font-weight: bold;
			}

			.banner-text p {
				font-size: 18px;
				opacity: 0.9;
				line-height: 1.5;
			}

			.cloud-icon {
				position: absolute;
				right: 305px;
				top: 50%;
				transform: translateY(-50%);
				width: 198px;
				height:155px;
				background: url('../img/xzpic.png') no-repeat center;
				background-size: contain;
			}

			/* 下载区域 */
			.download-section {
				padding: 40px 0 90px;
				background-color: #fff;
				position: relative;
			}

			.download-container {
				display: flex;
				justify-content: space-between;
				align-items: flex-start;
			}

			.download-left {
				display: flex;
				gap: 100px;
				padding-top: 40px;
			}

			.qr-block-wrapper {
				display: flex;
				gap: 30px;
				align-items: center;
			}

			.qr-group {
				text-align: center;
			}

			.qr-box {
				width: 237px;
				height: 237px;
				border: 1px solid #e5e5e5;
				padding:1px;
				background: #fff;
				margin-bottom: 15px;
				box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
			}

			.qr-box img {
				width: 100%;
				height: 100%;
				object-fit: contain;
			}

			.qr-text {
				font-size: 16px;
				color: #666;
			}

			.btn-group {
				display: flex;
				flex-direction: column;
				gap: 30px;
				justify-content: center;
			}

			.download-btn {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 200px;
				height: 56px;
				border-radius: 60px;
				background-color: #26c293;
				color: #fff;
				text-decoration: none;
				font-size: 20px;
				transition: all 0.3s;
				box-shadow: 0 4px 6px rgba(26, 188, 156, 0.3);
			}

			.download-btn:hover {
				background-color: #16a085;
				transform: translateY(-2px);
			}

			.download-btn img {
				width: 25px;
				height: 29px;
				margin-right: 10px;
				filter: brightness(0) invert(1);
			}

			.phone-wrapper {
				
				width: 350px;
				z-index: 10;
				background: url('../img/apppic.png') no-repeat right center;
				height: 592px;
				margin-top:-223px ;
				margin-right: -43px;
			}

			.phone-wrapper img {
				
			}

			/* 响应式调整 */
			@media (max-width: 1136px) {
				
				.banner-text h1 {
					font-size: 36px;
				}

				.banner-text p {
					font-size: 16px;
				}
				
				.download-left {
					gap: 30px;
				}
				
				.qr-box {
					width: 200px;
					height:200px;
				}
				
				
			}
@media (max-width: 1000px) {
				
				.banner-text h1 {
					font-size: 36px;
				}

				.banner-text p {
					font-size: 16px;
				}
				
				.download-left {
					gap: 30px;
				}
				
				.qr-box {
					width: 140px;
					height:140px;
				}
				.phone-wrapper {
					
					width: 260px;
				
					height: 487px;
					margin-top:-223px ;
					margin-right: -43px;
					background-size: cover;
				}
				.download-btn {
					width:140px ;
					height:46px ;
					font-size: 15px;
				}
				.download-btn img {
					width: 20px;
					height: 23px;
					
				}
				.cloud-icon{
					width:150px ;
					height:117px ;
					    right: 240px;
				}
				
			}
			@media (max-width: 768px) {
				.app-banner {
					height: auto;
					padding: 40px 0;
					text-align: center;
				}

				.banner-content {
					flex-direction: column;
				}

				.banner-text {
					margin-bottom: 30px;
				}

				.cloud-icon {
					display: none;
				}

				.download-section {
					padding: 40px 0;
				}

				.download-container {
					flex-direction: column;
					align-items: center;
				}

				.download-left {
					flex-direction: column;
					align-items: center;
					gap: 40px;
					padding-top: 0;
				}
				.qr-box {
					width: 237px;
					height:237px;
				}
				.qr-block-wrapper {
					flex-direction: column;
				}
.cloud-icon{ display: none;}
				.phone-wrapper {
					display: none;
				}
				.download-btn {
					width: 200px;
					height: 56px;
					font-size: 20px;
				}
			}
			/* 重置密码弹窗样式 */
			.reset-pwd-modal {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background-color: #fff;
				border-radius: 8px;
				box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
				z-index: 200;
				display: flex;
				flex-direction: column;
				padding: 30px 40px;
			}
			
			.reset-pwd-modal.hidden {
				display: none;
			}
			
			.reset-pwd-content {
				width: 100%;
				height: 100%;
				position: relative;
			}
			
			.reset-pwd-close {
				position: absolute;
				top: 10px;
				right: 15px;
				font-size: 15px;
				color: #26c293;
				background: none;
				border: none;
				cursor: pointer;
				padding: 5px;
				text-decoration: underline;
			}
			
			.reset-pwd-close:hover {
				color: #15ae80;
			}
			
			.modal-title {
				text-align: center;
				font-size: 22px;
				color: #333;
				margin-bottom: 30px;
				font-weight: bold;
			}
			
			.step-btn {
				width: 100%;
				height: 44px;
				background-color: #26c293;
				color: #fff;
				border: none;
				border-radius: 4px;
				font-size: 16px;
				cursor: pointer;
				margin-top: 10px;
				margin-bottom: 15px;
			}
			
			.step-btn:hover {
				background-color: #1db083;
			}
			
			.back-btn-text {
				width: 100%;
				height: 44px;
				background-color: #fff;
				color: #666;
				border: 1px solid #ddd;
				border-radius: 4px;
				font-size: 16px;
				cursor: pointer;
			}
			
			.back-btn-text:hover {
				background-color: #f0fefb;
				border-color: #26c293;
				color: #333;
			}
			
			/* 成功状态图标 */
			.success-icon-circle {
				width: 80px;
				height: 80px;
				background-color: #26c293;
				border-radius: 50%;
				display: flex;
				align-items: center;
				justify-content: center;
				margin: 40px auto 20px;
			}
			
			.success-icon-check {
				width: 30px;
				height: 15px;
				border-left: 4px solid #fff;
				border-bottom: 4px solid #fff;
				transform: rotate(-45deg);
				margin-top: -5px;
			}
			
			.success-text {
				text-align: center;
				font-size: 18px;
				color: #333;
				margin-bottom: 40px;
			}
			
			/* 修复验证码输入框聚焦样式 - 使其与右侧按钮/图片一体化 */
			.captcha-group {
				transition: all 0.2s ease;
			}
			
			.captcha-group:focus-within {
				border-color: #26c293;
				box-shadow: 0 0 0 2px rgba(38, 194, 147, 0.2);
			}
			
			.captcha-group .form-input:focus {
				box-shadow: none !important;
				border: none !important;
			}
			/* 页面通用样式 */
			.section-title {
				font-size:40px;
				color: #333;
				text-align: center;
				margin-bottom: 60px;
				position: relative;
				padding-bottom: 5px;
			}
			
			.section-title::after {
				content: '';
				position: absolute;
				bottom: 0;
				left: 50%;
				transform: translateX(-50%);
				width: 76px;
				height: 3px;
				background-color: #26c293;
			}
			
			/* Banner */
			.about-banner {
				width: 100%;
				height: auto;
				background: url('../img/aboutpic.jpg') no-repeat center bottom;
				height: 230px;
			}
			.about-banner img {
				width: 100%;
				display: block;
			}
			
			/* 公司介绍 */
			.company-culture-wrapper {
				background: url('../img/aboutbg.png') no-repeat center bottom #ffffff;
				
			}
			
			.company-intro {
				padding: 60px 0;
				background-color: transparent;
				padding-bottom: 26px;
			}
			
			.intro-text {
				font-size: 16px;
				line-height: 2;
				color: #666;
				text-align: justify;
				margin-bottom: 26px;
				text-indent: 2em;
			}
			
			.intro-text p {
				margin-bottom: 20px;
			}
			
			/* 数据统计 */
			.stats-row {
				display: flex;
				justify-content: space-between;
				margin-bottom: 60px;
				text-align: center;
			}
			
			.stat-item {
				flex: 1;
			}
			
			.stat-icon {
				height: 60px;
				margin-bottom: 15px;
			}
			
			.stat-num {
				font-size: 36px;
				color: #333;
				font-weight: bold;
				margin-bottom: 5px;
			}
			
			.stat-num span {
				font-size: 16px;
				font-weight: normal;
			}
			
			.stat-desc {
				font-size: 14px;
				color: #666;
			}
			
			/* 企业文化卡片 */
			.culture-section {
				background-color: transparent;
				padding: 0px;
				padding-bottom: 100px;
			}
			
			.culture-container {
				max-width: 1200px;
				margin: 0 auto;
				padding: 0;
			}
			
			.culture-row {
				display: flex;
				justify-content: space-between;
				gap: 40px;
			}
			
			.culture-card {
				flex: 1;
				background: linear-gradient(180deg, #e5f4ef 0%, #ffffff 60%);
				padding: 32px 30px;
				text-align: center;
				border-radius: 10px;
				transition: all 0.3s ease;
				box-shadow: 0 5px 20px rgba(0,0,0,0.05);
				border: 1px solid #ffffff;
				position: relative;
				top: 0;
			}
			
			.culture-card:hover {
				box-shadow: 0 15px 30px rgba(38, 194, 147, 0.15);
				transform: translateY(-10px);
				border-color: #26c293;
			}
			
			.culture-icon {
				width: 127px;
				height: 133px;
				display: flex;
				align-items: center;
				justify-content: center;
				margin: 0 auto;
			}
			
			.culture-icon img {
				width: 127px;
				height: 133px;
			}
			
			.culture-title {
				font-size: 28px;
				color: #333;
				margin-bottom: 19px;
				font-weight: bold;
			}
			
			.culture-desc {
				font-size: 15px;
				color: #666;
				line-height: 1.8;
				text-align: justify;
				text-align-last: center; /* 让最后一行也居中，保持美观 */
				border-top: #e9e9e9 solid 1px;
				padding-top: 25px;
			}
			
			/* 发展历程 */
			.history-section {
				background: url('../img/fzlcbg.jpg') no-repeat center center;
				background-size: cover;
				padding: 87px 0 80px;
				color: #fff;
				overflow: hidden;
			}
			
			.history-section .section-title {
				color: #fff;
				margin-bottom: 32px;
			}
			
			.history-section .section-title::after {
				background-color: #26c293;
			}
			
		
			
			/* 证书走马灯样式 */
			.carousel {
				position: relative;
				width: 100%;
				max-width: 1200px;
				margin: 24px auto 0;
				overflow: hidden;
			}
			
			.carousel-track {
				display: flex;
				animation: marquee 30s linear infinite;
			}
			
			.certificates-carousel .carousel-item {
				flex: 0 0 auto;
				padding: 0 10px;
				margin: 0 10px;
				height: 186px;
			}
			
			.certificates-carousel .carousel-item img {
				width: 100%;
				display: block;
				box-shadow: 0 5px 15px rgba(0,0,0,0.2);
				border-radius: 4px;
				transition: transform 0.3s;
			}
			
			.certificates-carousel .carousel-item img:hover {
				transform: scale(1.05);
			}
			
			@keyframes marquee {
				0% { transform: translateX(0); }
				100% { transform: translateX(-50%); }
			}
			
			.carousel:hover .carousel-track {
				animation-play-state: paused;
			}
			
			/* 联系我们 */
			.contact-section {
				background: url('../img/lxwmbg.png') no-repeat center bottom;
				background-size: cover;
				padding: 87px 0;
			}
			
			.contact-cards {
				display: flex;
				justify-content: space-between;
				
				background: #fff;
				box-shadow: 0 5px 20px rgba(0,0,0,0.05);
				border-radius: 10px;
			}
			
			.contact-card {
				flex: 1;
				
				padding: 40px 20px;
				text-align: center;
				
				
			}
			
			.contact-icon {
				margin-bottom: 20px;
			}
			
			.contact-icon img {
				height: 50px;
			}
			
			.contact-title {
				font-size: 18px;
				color: #333;
				margin-bottom: 15px;
				font-weight: bold;
			}
			
			.contact-info {
				font-size: 15px;
				color: #666;
				line-height: 1.6;
			}
			
			/* 响应式调整 */
			@media (max-width: 768px) {
				.stats-row {
					flex-wrap: wrap;
				}
				.stat-item {
					flex: 0 0 50%;
					margin-bottom: 30px;
				}
				
				.culture-row {
					flex-direction: column;
				}
				
				.contact-cards {
					flex-direction: column;
				}
				
				.timeline-container {
					overflow-x: auto;
				}
				
				.cert-img {
					width: 45%;
				}
			}
			/* 时间轴样式 */
			.timeline-container {
				position: relative;
				margin: 40px 0 50px;
				padding: 180px 0; /* 增加内边距以容纳上下内容 */
				overflow-x: visible; /* 桌面端默认显示，避免遮挡 */
			}
			
			.timeline-line {
				height: 2px;
				background: #26c293;
				position: absolute;
				top: 50%;
				left: 0;
				width: 100%;
				min-width: 1000px; 
			}
			
			.timeline-items {
				display: flex;
				justify-content: space-between;
				position: relative;
				/* min-width: 1200px;  移除固定最小宽度 */
				width: 100%;
				max-width: 1200px; /* 限制最大宽度 */
				margin: 0 auto;
				align-items: center;
			}
			
			.timeline-item {
				position: relative;
				/* width: 180px; 移除固定宽度 */
				flex: 1; /* 自适应宽度 */
				text-align: center;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				/* flex-shrink: 0; 允许收缩 */
			}
			
			.timeline-dot {
				width: 16px;
				height: 16px;
				background: #26c293;
				border-radius: 50%;
				margin: 0 auto;
				position: relative;
				z-index: 2;
			}
			
			.timeline-year {
				color: #26c293; /* 保持绿色，与设计风格统一 */
				font-size: 18px; /* 增大字号，增加区分度 */
				font-weight: bold;
				margin: 0;
				position: absolute;
				width: 100%;
				left: 0;
			}
			
			.timeline-content {
				background: #26c293;
				padding:16px;
				border-radius: 12px;
				font-size: 15px;
				line-height: 1.6;
				color: #fff;
				position: absolute;
				width: auto; /* 宽度自适应 */
				
				left: 50%;
				transform: translateX(-50%);
			}
			
			.timeline-content::after {
				content: '';
				position: absolute;
				width: 0;
				height: 0;
				border-style: solid;
				left: 50%;
				transform: translateX(-50%);
			}
			
			/* 上方内容 (年份在下方) */
			.timeline-item:nth-child(odd) .timeline-content {
				bottom: 40px; /* 距离中心点的距离 */
			}
			.timeline-item:nth-child(odd) .timeline-content::after {
				bottom: -10px;
				border-width: 10px 10px 0;
				border-color: #26c293 transparent transparent transparent;
			}
			.timeline-item:nth-child(odd) .timeline-year {
				top: 30px; /* 位于圆点下方 */
			}
			
			/* 下方内容 (年份在上方) */
			.timeline-item:nth-child(even) .timeline-content {
				top: 40px; /* 距离中心点的距离 */
			}
			.timeline-item:nth-child(even) .timeline-content::after {
				top: -10px;
				border-width: 0 10px 10px;
				border-color: transparent transparent #26c293 transparent;
			}
			.timeline-item:nth-child(even) .timeline-year {
				bottom: 30px; /* 位于圆点上方 */
				top: auto;
			}
			
			/* 差异化定制：每个卡片的宽度和颜色不一样 */
			/* 1. 2009年 (Odd, 上方) */
			.timeline-item:nth-child(1) .timeline-content {
				width: 190px;
				background-color: #2ba783; /* 标准绿 */
			}
			.timeline-item:nth-child(1) .timeline-content::after {
				border-bottom-color: transparent; /* 覆盖默认 */
				border-top-color: #2ba783;
			}
			
			/* 2. 2015年 (Even, 下方) */
			.timeline-item:nth-child(2) .timeline-content {
				width: 252px;
				background-color: #2c997c; /* 稍浅 */
			}
			.timeline-item:nth-child(2) .timeline-content::after {
				border-top-color: transparent;
				border-bottom-color: #2c997c;
			}
			
			/* 3. 2020年 (Odd, 上方) */
			.timeline-item:nth-child(3) .timeline-content {
				width: 260px;
				background-color: #2a9979; /* 稍深 */
			}
			.timeline-item:nth-child(3) .timeline-content::after {
				border-bottom-color: transparent;
				border-top-color: #2a9979;
			}
			
			/* 4. 2021年 (Even, 下方) */
			.timeline-item:nth-child(4) .timeline-content {
				width: 264px;
				background-color: #2e7d6a; /* 深青 */
			}
			.timeline-item:nth-child(4) .timeline-content::after {
				border-top-color: transparent;
				border-bottom-color: #2e7d6a;
			}
			
			/* 5. 2023年 (Odd, 上方) */
			.timeline-item:nth-child(5) .timeline-content {
				width: 200px;
				background-color: #2a9778; /* 亮青 */
			}
			.timeline-item:nth-child(5) .timeline-content::after {
				border-bottom-color: transparent;
				border-top-color: #2a9778;
			}
			
			/* 6. 2024年 (Even, 下方) */
			.timeline-item:nth-child(6) .timeline-content {
				width: 327px;
				background-color: #28b58b; /* 回归标准绿，但宽度最大 */
			}
			.timeline-item:nth-child(6) .timeline-content::after {
				border-top-color: transparent;
				border-bottom-color: #28b58b;
			}
			
			/* 响应式调整 */
			@media (max-width: 1200px) {
				.timeline-container {
					padding: 0px 0; /* 减小上下内边距 */
					overflow-x: hidden;
				}
				
				.timeline-items {
					flex-direction: column;
					padding: 0;
					gap: 0; /* 移除flex gap */
				}
				.culture-container{margin: 0px 20px;}
				.timeline-line {
					width: 2px;
					height: 100%;
					min-width: auto;
					left: 50%;
					transform: translateX(-50%);
					top: 0;
				}
				
				.timeline-item {
					width: 100%;
					flex-direction: row;
					justify-content: center;
					margin-bottom: 20px; /* 减小间距，更紧凑 */
					height: auto;
					padding: 0 10px; /* 减小左右内边距 */
					align-items: center; /* 垂直居中对齐 */
				}
				
				.timeline-dot {
					position: absolute;
					left: 50%;
					transform: translateX(-50%);
					width: 16px; /* 稍微调小圆点 */
					height: 16px;
					flex-shrink: 0;
				}
				
				.timeline-year {
					position: relative;
					width: 46%; /* 稍微减小宽度给中间留空 */
					text-align: right;
					padding-right:0px; /* 增加与中线的距离 */
					left: auto;
					top: auto !important;
					bottom: auto !important;
					margin: 0;
					font-size: 18px; /* 增大年份字号 */
					color: #26c293; /* 改为白色 */
					background: none; /* 移除背景 */
					padding-top: 0;
					padding-bottom: 0;
					line-height: 1.2;
					font-weight: bold;
				}
				
				.timeline-content {
					position: relative;
					width: 46% !important;
					max-width: none;
					left: auto;
					transform: none;
					text-align: left;
					top: auto !important;
					bottom: auto !important;
					margin: 0;
					padding: 12px 15px; /* 调整内边距 */
					font-size: 16px; /* 调整字号 */
				}
				
				/* 奇数项 (1, 3, 5) - 左文右年 */
				.timeline-item:nth-child(odd) {
					flex-direction: row;
				}
				.timeline-item:nth-child(odd) .timeline-content {
					order: 1; 
					margin-right: auto; 
					margin-left: 0;
					text-align: justify;
				}
				.timeline-item:nth-child(odd) .timeline-year {
					order: 3;
					text-align: left; /* 年份在右侧，左对齐靠中线 */
					padding-left: 0px;
					padding-right: 0;
				}
				
				/* 偶数项 (2, 4, 6) - 左年右文 */
				.timeline-item:nth-child(even) {
					flex-direction: row;
				}
				.timeline-item:nth-child(even) .timeline-content {
					order: 3;
					margin-left: auto;
					margin-right: 0;
					text-align: justify;
				}
				.timeline-item:nth-child(even) .timeline-year {
					order: 1;
					text-align: right; /* 年份在左侧，右对齐靠中线 */
					padding-right: 25px;
					padding-left: 0;
				}
				
				/* 箭头调整 */
				.timeline-content::after {
					top: 50% !important;
					transform: translateY(-50%);
					bottom: auto !important;
					border-width: 6px !important; /* 稍微减小箭头 */
				}
				
				.timeline-item:nth-child(odd) .timeline-content::after {
					left: 100%;
					right: auto;
					border-color: transparent transparent transparent #2ba783; 
				}
				.timeline-item:nth-child(even) .timeline-content::after {
					right: 100%;
					left: auto;
					border-color: transparent #2c997c transparent transparent;
				}
				
				/* 颜色覆盖 */
				.timeline-item:nth-child(1) .timeline-content::after { border-color: transparent transparent transparent #2ba783; }
				.timeline-item:nth-child(2) .timeline-content::after { border-color: transparent #2c997c transparent transparent; }
				.timeline-item:nth-child(3) .timeline-content::after { border-color: transparent transparent transparent #2a9979; }
				.timeline-item:nth-child(4) .timeline-content::after { border-color: transparent #2e7d6a transparent transparent; }
				.timeline-item:nth-child(5) .timeline-content::after { border-color: transparent transparent transparent #2a9778; }
				.timeline-item:nth-child(6) .timeline-content::after { border-color: transparent #28b58b transparent transparent; }
			}


/* 首页新增样式 */	
.header-user{
display: none; align-items: center; order: 3;	
}
.username{
	color: #26c293; font-size: 16px; margin-right: 25px;
}
.username img{
	width: 16px; vertical-align: middle; margin-right:10px;
}
.header-user a{
	color: #26c293; text-decoration: none; font-size: 16px;
}
.header-user a:hover{
	text-decoration: underline;
}

/* 讲师招聘 */
.recmain{
	width: 500px;
	margin: 0 auto;
	font-size: 16px;
	line-height: 2.5;
	color: #666;
	text-align: justify;
	margin-bottom: 26px;
}
.recmain span{
	font-weight: 600;
	line-height: 40px;
	color: #333;
}