.consultation-body-main { background-color: #F5F5F7; width: 100%; min-width: 1190px; padding-bottom: 125px; } .consultation-body-main .input-block { position: relative; z-index: 1; width: 960px; background-color: #fff; margin: -20px auto 0 auto; padding: 40px; box-sizing: border-box; } .consultation-body-main .success-block { width: 960px; background-color: #fff; /* margin: 10px auto 0 auto; */ margin: -20px auto 0 auto; box-sizing: border-box; position: relative; display: none; text-align: center; padding: 32px 0 40px; box-sizing: border-box; } .consultation-body-main .info-block { width: 960px; background-color: #fff; margin: 10px auto 0 auto; padding: 40px; box-sizing: border-box; } .consultation-body-main .img-block { position: relative; } .consultation-body-main .success-block img { width: 240px; height: 240px; } .consultation-body-main .success-block p { position: absolute; top: 204px; left: 0; text-align: center; width: 100%; color: #333333; font-size: 24px; font-weight: 500; } .consultation-body-main .success-back { margin: 40px 40px 0; background-color: #EBF1FD; border-radius: 8px; box-sizing: border-box; padding: 8px; } .consultation-body-main .success-back .content { border-radius: 8px; border: 1px solid #ACC7F9; padding: 40px 210px; box-sizing: border-box; text-align: left; font-size: 14px; color: #2A2A2C; } .consultation-body-main .success-back .content.consult { padding: 40px 50px; } .input-block ul { padding: 0; margin: 0; list-style: none; text-align: left; } ul.input-box .input-title p { margin: 0; font-size: 16px; font-weight: 500; color: #1D1D1F; } ul.input-box .input-detail-row { margin-top: 24px; display: flex; } ul.input-box .input-detail-row.type-freight { display: flex; } ul.input-box .input-detail-row.type-service { display: none; } ul.input-box .input-detail-row .name { width: 100px; padding-right: 32px; font-size: 14px; color: #1D1D1F; line-height: 32px; font-weight: 400; } ul.input-box .input-detail-row span { font-size: 14px; color: #1D1D1F; line-height: 22px; font-weight: 400; } .input-detail-row .input-content { width: 280px; height: 32px; background: #FFFFFF; border: 1px solid #DDDDDD; border-radius: 4px; padding: 0 12px; font-size: 14px; color: #1D1D1F; line-height: 22px; box-sizing: border-box; } .input-detail-row #input-waybill-first { width: 91px; } input.input-content::placeholder { color: #999999; font-size: 14px; } .input-detail-row .input-detail-block, .input-detail-row .form-textarea { position: relative; } .input-detail-row .input-detail-block .tel-message, .input-detail-row .form-textarea .tel-message { position: absolute; top: 30px; left: 0; color: red; font-size: 12px; width: 200px; } .input-detail-row .form-textarea .charCount { position: absolute; top: 80px; right: 5px; color: #999999; font-size: 12px; text-align: right; } .input-detail-row .form-textarea .tel-message { top: 103px; } .input-detail-row .input-detail-block #input-time { position: absolute; bottom: 0; left: 0; } .input-detail-row .input-detail-block #input-time2 { position: absolute; bottom: 0; left: 0; background-color: transparent; color: transparent; height: 1; } .input-detail-row .form-button { width: 132px; height: 40px; border: 1px solid #DDDDDD; border-radius: 4px; padding: 9px 10px; margin-right: 16px; text-align: center; box-sizing: border-box; } .input-detail-row .form-button.first { border: 1px solid #286EF0; } .input-detail-row .submit-btn { background-color: #286EF0; width: 64px; height: 32px; border-radius: 4px; line-height: 32px; color: #fff; font-size: 14px; margin-top: 16px; text-align: center; } /* .input-detail-row .submit-btn span { color: #fff; font-size: 14px; } */ /* .form-button [type='radio'] { cursor: pointer; -webkit-appearance: radio; } */ .radio-label { position: relative; padding-left: 25px; /* 使文本和圆圈对齐 */ cursor: pointer; font-size: 14px; user-select: none; /* 防止文本被选中 */ color: #1D1D1F; } /* 隐藏原生的radio按钮 */ .radio-label input { position: absolute; opacity: 0; cursor: pointer; box-sizing: border-box; } /* 自定义的圆圈 */ .radio-label .checkmark { position: absolute; top: 0; left: 0; height: 16px; /* 圆圈的大小 */ width: 16px; /* 圆圈的大小 */ background-color: #fff; /* 背景颜色 */ border: 1px solid #DDDDDD; /* 边框，模拟空心效果 */ border-radius: 50%; /* 使圆圈变圆 */ } /* 当radio按钮被选中时，改变内部标记的样式 */ .radio-label input:checked~.checkmark { background-color: #fff; /* 填充颜色 */ border: 5px solid #286EF0; /* 边框，模拟空心效果 */ box-sizing: border-box; } .radio-label input:checked ::before::before { border: 2px solid blue; /* 选中时的边框颜色 */ } .input-detail-row .textarea-content { width: 520px; height: 104px; box-sizing: border-box; padding: 5px 12px; background: #fff; border-radius: 4px; border: 1px solid #DDDDDD; font-size: 14px; line-height: 22px; color: #1D1D1F; } textarea.textarea-content::placeholder { /* textarea 也需要单独设置 */ color: #999999; font-size: 14px; } .info-block .info-title { color: #1D1D1F; font-size: 16px; font-weight: 500; padding-bottom: 24px; line-height: 22px; } .info-block .info-content { color: #1D1D1F; font-size: 14px; line-height: 22px; } .line-row { margin: 40px 0; padding-left: 130px; } .from-line { height: 1px; width: 100%; background-color: #EEEEEE; } .history-row { margin-top: 15px; text-align: left; } .history-row span { font-size: 14px; color: #1D1D1F; font-weight: 500; } .write-waybill { position: absolute; top: 16px; left: 16px; } .history-waybill { overflow: hidden; } .history-waybill li { margin-top: 8px; } .write-waybill li { margin-bottom: 8px; background: #F5F5F5; } .textarea-content::-webkit-input-placeholder, .input-content::-webkit-input-placeholder { font-size: 14px; color: #999999; line-height: 22px; font-family: '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica', 'Arial', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif; } /* 使用webkit内核的浏览器 */ .textarea-content::-moz-placeholder, .input-content::-moz-placeholder { font-size: 14px; color: #999999; line-height: 22px; font-family: '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica', 'Arial', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif; } /* Firefox版本4-18 */ .textarea-content:-moz-placeholder, .input-content:-moz-placeholder { font-size: 14px; color: #999999; line-height: 22px; font-family: '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica', 'Arial', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif; } /* Firefox版本19+ */ .textarea-content::-ms-input-placeholder, .input-content::-ms-input-placeholder { font-size: 14px; color: #999999; line-height: 22px; font-family: '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica', 'Arial', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif; } /* 清除浮动 */ .clear-float { clear: both; } .explain-block { width: 960px; background-color: #fff; margin: 10px auto 0 auto; } .explain-content { padding: 24px 40px; } .explain-title { font-weight: 500; } .explain-row { font-size: 14px; color: #151515; text-align: justify; line-height: 22px; } /* 验证码 */ .code-row { height: 32px; } .code-row div{ float: left; } .code-row .input-content { width: 150px; } .code-row .form-verify { margin-left: 16px; margin-top: 5px; } .code-row .form-verify #img-verify{ height: 25px; } .code-row .img-change-box { margin-left: 16px; height: 32px; color: #286EF0; font-size: 14px; line-height: 32px; background: transparent; }