/* 全局样式重置与基础设置 */ * { margin: 0; padding: 0; font-family: "SimSun", "宋体", serif; } page { padding-bottom: 0; } .contract-container { width: 100%; background-color: #fff; padding: 15px; box-sizing: border-box; margin: 0 auto; position: relative; word-break: break-word; overflow-x: hidden; } /* 导航栏样式 */ .nav { display: flex; justify-content: space-between; align-items: center; padding: 20rpx 30rpx; border-bottom: 1px solid #e5e5e5; background-color: #fafafa; } .nav-title { font-size: 32rpx; font-weight: bold; color: #333333; } .save-btn { font-size: 26rpx; color: #0066cc; background: transparent; padding: 0; margin: 0; } /* 滚动容器样式 */ .contract-scroll { width: 100%; padding: 20rpx 30rpx; box-sizing: border-box; } /* 合同内容区基础样式 */ .contract-content { width: 100%; line-height: 1.8; font-size: 28rpx; color: #333333; } /* 合同头部样式 */ .header { margin-bottom: 40rpx; /* text-align: center; */ } .qrcode-tip { font-size: 24rpx; color: #666666; margin-bottom: 20rpx; } .contract-title { font-size: 36rpx; font-weight: bold; margin: 20rpx 0; color: #333333; } .party-info { text-align: left; margin: 30rpx 0; line-height: 2; } .preamble { text-indent: 56rpx; /* 首行缩进2字符(28rpx*2) */ margin-bottom: 20rpx; } /* 条款通用样式 */ .clauses { margin-bottom: 60rpx; } .clause { margin-bottom: 40rpx; } .clause-num { font-size: 30rpx; font-weight: bold; margin: 20rpx 0; color: #333333; } .clause-content { margin-left: 40rpx; line-height: 1.8; } /* 服务项样式 */ .service-item { font-size: 28rpx; font-weight: 600; margin: 20rpx 0 10rpx 0; display: block; } .service-desc { text-indent: 56rpx; margin: 10rpx 0; display: block; } .service-list { list-style: disc; margin-left: 50rpx; margin-bottom: 20rpx; padding-left: 20rpx; } .service-list li { margin-bottom: 15rpx; line-height: 1.8; display: block; } /* 表格通用样式 */ .fee-table, .info-table { width: 100%; border-collapse: collapse; margin: 20rpx 0; font-size: 26rpx; } .fee-table th, .fee-table td, .info-table th, .info-table td { border: 1px solid #333333; padding: 12rpx 8rpx; text-align: center; } .fee-table th, .info-table th, .info-table .table-label { background-color: #f5f5f5; font-weight: bold; } /* 填写项样式 */ .fill-input { border: 1px solid #ddd; border-radius: 4rpx; padding: 0 8px; margin: 0 4rpx; font-size: 13px; color: #333333; background-color: #ffffff; flex-shrink: 0; height: 28px; width: 80px; box-sizing: border-box; vertical-align: middle; } .fill-tiny { width: 60px; /* 小尺寸输入框(如百分比、台数) */ text-align: center; } .fill-small { width: 140px; /* 中尺寸输入框(如银行名称、其他说明) */ } .fill-normal { width: 300rpx; /* 常规尺寸输入框(如商户名称、地址) */ } .fill-date { width: 220rpx; /* 日期输入框 */ text-align: center; } .fill-table { width: 100%; /* 表格内输入框:填满单元格 */ margin: 0; box-sizing: border-box; } /* 单选/多选样式 */ .radio-label, .checkbox-label { margin-right: 25rpx; margin-bottom: 15rpx; display: inline-flex; align-items: center; font-size: 26rpx; color: #333; flex-wrap: wrap; gap: 8rpx; line-height: 1.6; } /* 单选/多选组容器:控制整体间距 */ .radio-group-container, .checkbox-group-container { display: flex; flex-direction: column; gap: 15rpx; margin: 15rpx 0; width: 100%; } /* 单个单选/多选选项:垂直居中对齐,统一高度 */ .radio-label, .checkbox-label { display: flex; align-items: flex-start; margin-right: 0; margin-bottom: 0; word-break: break-word; max-width: 100%; flex-wrap: wrap; gap: 8rpx; /* radio/checkbox 与文本的间距 */ font-size: 26rpx; color: #333; padding: 8rpx 0; line-height: 1.8; } /* 商户更名输入框:仅在选中时显示,与文本对齐 */ #input-original-name { margin-left: 10rpx; /* 与“商户更名”文本的间距 */ margin-top: 0; /* 清除默认margin,确保垂直居中 */ } /* 备注/说明文本样式 */ .note, .mode-note, .risk-note, .deduct-note, .table-note, .appendix-footnote { font-size: 24rpx; color: #666666; margin: 10rpx 0; text-indent: 56rpx; } /* 签字区域样式 */ .sign-main, .sign-appendix { display: flex; justify-content: space-between; margin: 60rpx 0; padding: 0 40rpx; } .sign-party { text-align: center; width: 45%; line-height: 2.2; } /* 附件通用样式 */ .appendix { margin: 80rpx 0; padding: 20rpx; border-top: 1px dashed #cccccc; } .appendix-title { font-size: 32rpx; font-weight: bold; text-align: center; margin: 30rpx 0; color: #333333; } .appendix-subtitle { font-size: 28rpx; font-weight: bold; margin: 30rpx 0 15rpx; color: #333333; } .appendix-note { font-size: 24rpx; color: #666666; text-align: right; margin-bottom: 30rpx; } /* 授权书内容样式 */ .authorization-content { text-indent: 56rpx; margin: 15rpx 0; line-height: 1.8; } /* 提交按钮样式 */ .submit-btn { width: 90%; margin: 0 auto; background-color: #0066cc; color: #ffffff; font-size: 32rpx; padding: 18rpx 0; border-radius: 12rpx; font-weight: 600; } /* 适配小程序端滚动条样式(隐藏默认滚动条) */ ::-webkit-scrollbar { width: 0; height: 0; color: transparent; } /* 补充样式优化 */ .radio-group-container { display: flex; flex-wrap: wrap; gap: 20rpx; margin: 10rpx 0; } .radio-label, .checkbox-label { display: inline-flex; align-items: center; margin-right: 25rpx; margin-bottom: 10rpx; font-size: 26rpx; } .checkbox-group { display: flex; flex-wrap: wrap; gap: 15rpx; } .service-list li { margin-bottom: 15rpx; line-height: 1.6; } .fee-label { display: block; margin: 8rpx 0; } .mode-item { margin: 15rpx 0; text-indent: 56rpx; } .mode-note { font-size: 24rpx; color: #666; margin: 10rpx 0; text-indent: 56rpx; } .table-note { font-size: 24rpx; color: #666; margin: 10rpx 0 5rpx 0; } .authorization-content { text-indent: 56rpx; margin: 15rpx 0; line-height: 1.8; } .sign-appendix { display: flex; flex-direction: column; gap: 20rpx; margin: 40rpx 0; padding: 0 20rpx; } .sign-appendix p { line-height: 2; font-size: 26rpx; display: flex; align-items: center; gap: 10rpx; } /* 优化表格内输入框 */ .info-table .fill-input, .fee-table .fill-input { box-sizing: border-box; border: 1px solid #0066cc; margin: 2rpx; } /* 优化单选/多选按钮对齐 */ radio, checkbox { margin-right: 8rpx; vertical-align: middle; }