@charset "UTF-8";
/* 全局样式重置与基础配置 */
body {
    padding: 0;
    margin: 0;
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif; /* 更舒适的中文字体 */
    background-color: #f8f9fa; /* 页面背景浅灰，提升层次感 */
}

/* 顶部banner */
.indexMain .banner {
    display: block;
    width: 100%;
    object-fit: cover; /* 保证图片适配，不拉伸变形 */
}

/* 表单容器 */
.indexMain .form {
    padding: 40px 30px 60px; /* 底部增加内边距，避免内容贴底 */
}

/* 标题样式 */
.indexMain .form .tit {
    text-align: center;
    margin-bottom: 40px;
    position: relative;
}
.indexMain .form .tit span {
    display: block;
    font-size: 38px;
    color: #00a2ae; /* 品牌主色，替代浅灰 */
    line-height: 1;
    letter-spacing: 2px; /* 字母间距，更精致 */
}
.indexMain .form .tit h3 {
    font-size: 38px;
    color: #333;
    line-height: 1;
    font-weight: 500; /* 字体加粗，更醒目 */
    margin-top: 10px; /* 调整间距，更协调 */
}

/* 表单输入/下拉框通用样式 */
.indexMain .form .lable {
    margin-bottom: 25px; /* 调整间距，更紧凑 */
    position: relative;
}
.indexMain .form .lable input,
.indexMain .form .lable select {
    width: 100%;
    height: 86px;
    font-size: 26px;
    line-height: 86px;
    color: #333; /* 输入文字深灰，更清晰 */
    padding: 0 25px;
    border: 1px solid #e5e7eb; /* 更浅的边框色，更柔和 */
    border-radius: 12px; /* 圆角优化 */
    background-color: #f9fafb; /* 浅灰背景，区分输入区域 */
    box-sizing: border-box; /* 盒模型优化，避免溢出 */
    transition: all 0.3s ease; /* 过渡动画，交互更丝滑 */
    appearance: none; /* 清除默认下拉样式 */
    -webkit-appearance: none;
}

/* 下拉框专属样式 */
.indexMain .form .lable select {
    background-image: url(../images/arrow.png);
    background-repeat: no-repeat;
    background-position: 96% center;
    background-size: 24px; /* 箭头尺寸优化 */
}

/* 输入框/下拉框聚焦状态 */
.indexMain .form .lable input:focus,
.indexMain .form .lable select:focus {
    outline: none;
    border-color: #00a2ae; /* 聚焦时边框变主色 */
    box-shadow: 0 0 0 4px rgba(0, 162, 174, 0.1); /* 聚焦光晕，提升交互感 */
    background-color: #fff; /* 聚焦时背景变白 */
}

/* 占位符样式优化 */
.indexMain .form .lable input::placeholder {
    color: #9ca3af; /* 占位符浅灰，更舒适 */
}

/* 提交按钮样式 */
.indexMain .form .tj {
    width: 100%;
    height: 86px;
    font-size: 30px;
    line-height: 86px;
    color: #fff; /* 文字白色，更醒目 */
    background: linear-gradient(135deg, #00a2ae 0%, #008fa0 100%); /* 渐变背景，更有质感 */
    border-radius: 12px; /* 圆角优化 */
    border: 0;
    margin: 60px auto 0; /* 调整间距 */
    cursor: pointer;
    transition: all 0.3s ease; /* 过渡动画 */
    box-shadow: 0 6px 16px rgba(0, 162, 174, 0.2); /* 按钮阴影，提升立体感 */
    font-weight: 500; /* 字体加粗 */
    letter-spacing: 1px; /* 文字间距 */
}

/* 按钮hover/active状态 */
.indexMain .form .tj:hover {
    background: linear-gradient(135deg, #008fa0 0%, #007d8b 100%); /* hover加深渐变 */
    transform: translateY(-2px); /* 轻微上移，交互反馈 */
    box-shadow: 0 8px 20px rgba(0, 162, 174, 0.25);
}
.indexMain .form .tj:active {
    transform: translateY(0); /* 点击回弹 */
    box-shadow: 0 4px 12px rgba(0, 162, 174, 0.2);
}

/* 同意协议勾选框 */
.indexMain .agree-box {
    display: flex;
    align-items: center;
    font-size: 22px;
    color: #6b7280; /* 文字浅灰，更舒适 */
    margin-top: 30px; /* 调整间距 */
    line-height: 1.4; /* 行高优化 */
}
.indexMain .agree-box .agree {
    width: 32px;
    height: 32px;
    background-color: #f9fafb; /* 背景色统一 */
    border: 2px solid #e5e7eb; /* 边框色优化 */
    border-radius: 6px; /* 圆角 */
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-right: 12px; /* 间距优化 */
    transition: all 0.2s ease;
}
.indexMain .agree-box .agree:hover {
    border-color: #00a2ae; /* hover边框变主色 */
}
.indexMain .agree-box .agree img {
    display: none;
    width: 20px; /* 勾选图标尺寸优化 */
    height: 20px;
    object-fit: contain;
}
.indexMain .agree-box .agree img.active {
    display: block;
}
/* 勾选后样式 */
.indexMain .agree-box .agree:has(img.active) {
    background-color: #00a2ae; /* 勾选后背景主色 */
    border-color: #00a2ae;
}

/* 协议链接样式 */
.indexMain .agree-box a {
    color: #00a2ae; /* 链接主色 */
    text-decoration: none; /* 清除下划线 */
    transition: color 0.2s ease;
}
.indexMain .agree-box a:hover {
    color: #008fa0; /* hover加深 */
    text-decoration: underline; /* hover显示下划线 */
}
/* ===== header & back button ===== */
.qirui-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 84px; /* 增高以容纳更大按钮 */
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 18px;
  background: #fff;
  box-shadow: 0 1px 8px rgba(0,0,0,0.06);
  z-index: 999;
}
.qirui-header .back-btn {
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border: 0;
  background: transparent;
  cursor: pointer;
  color: #333;
  font-size: 1.6rem;
}
.qirui-header .back-btn svg { display:block; width:30px; height:30px; }
.qirui-header .title {
  font-size: 1.5rem;
  font-weight: 600;
  color: #333;
} 

/* ===== 隐私页面容器调整，避免与固定头部重叠 ===== */
.privacyMain{
  font-size: 1.3rem; /* 更适合移动端的可读性 */
  color: #333;
  line-height: 1.8;
  padding: 130px 18px 30px; /* 顶部留出固定头部高度（加大） */
  max-width: 980px;
  margin: 0 auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.04);
} 
.privacyMain h1{
  font-size: 26px;
  text-align: center;
  margin-bottom: 10px;
}
.privacyMain h3{
  margin: 20px 0;
  font-size: 20px;
}
.privacyMain h4{
  margin: 15px 0;
  font-size: 18px;
}
.privacyMain p{
  margin-bottom: 12px;
  color: #444;
}
.privacyMain a{
  color: #00a2ae;
  text-decoration: none;
}
.privacyMain a:hover{
  text-decoration: underline;
}

/* ===== 服务页面样式（与隐私页一致） ===== */
.serviceMain{
  font-size: 1.3rem; /* 兼顾移动端可读性 */
  color: #333;
  line-height: 1.8;
  padding: 130px 18px 30px; /* 顶部留出固定头部高度（加大） */
  max-width: 980px;
  margin: 0 auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.04);
}
.serviceMain h1{
  font-size: 26px;
  text-align: center;
  margin-bottom: 10px;
}
.serviceMain h3{
  margin: 20px 0;
  font-size: 20px;
}
.serviceMain h4{
  margin: 15px 0;
  font-size: 18px;
}
.serviceMain p{
  margin-bottom: 12px;
  color: #444;
}
.serviceMain a{
  color: #00a2ae;
  text-decoration: none;
}
.serviceMain a:hover{ text-decoration: underline }

.card_table table,.card_table tbody{
  width: 2000px;
}
.card_table td,.card_table th{
  border-top: 1px solid #000;
  border-left: 1px solid #000;
  vertical-align: top;
  padding: 20px;
  font-size: 26px;
}
.card_table td:last-of-type, .card_table th:last-of-type {
  border-right: 1px solid #000;
}
.card_table tr:last-of-type td {
  border-bottom: 1px solid #000;
}