*{ box-sizing:border-box; } html{ background: #EEF6F8; } body{ position: relative; } #fromBg{ position: absolute; bottom: 0; left: 0; width: 100% } .fromSec{ width: 1100px; margin: 0 auto; } .header{ background: #282E3B; padding: 20px 0; height: 80px; line-height: 40px; font-size: 30px; color: #fff } .header a{ color: #59A7FF; } .headerLine{ margin: 0 20px; } .chickT{ color: #3E3F3F; font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 40px } .chickForm_sec{ margin:80px 0 70px; position: relative; z-index: 9; } .chickForm_sec .fromSec{ background: #fff; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, .1); box-shadow: 0 0 10px rgba(0, 0, 0, .1); border-radius: 4px; padding: 40px 35px 60px; } .chickRemind{ margin: 0 20px; height: 40px; line-height: 38px; font-size: 12px; color: #E62D31; padding: 0 10px; border: 1px dashed #E62D31; margin-bottom: 30px; } .chickRemind img{ margin-right: 6px; width: 20px; position: relative; top: -1px; } .chickInput{ margin: 20px auto 0; width: 720px; font-size: 14px; color: #222222; } .chickInputLable{ float: left; width: 20%; padding-right: 10px; text-align: right; line-height: 40px; color: #6A6A6A } .chickInputLable span{ color: #E62D31; } .chickInput > input{ height: 40px; width: 80%; margin-left: 20%; display: block; border: 1px solid #DDDDDD; padding: 7px 12px; line-height: 24px; } .chickInput2 > input{ width: 530px; } .layui-input-inline{ width: 100%; } .chickInputBox .layui-input-inline > img{ position: absolute; height: 24px; right: 5px; top: 0; bottom: 0; margin: auto; z-index: 0 } .chickInputBox{ line-height: 40px; color: #666666; margin-left: 20%; } .chickInputTxt{ font-size: 12px; color: #E62D31 } #chickUpload{ width: 107px; height: 107px; border: 1px solid #E9E9E9; overflow: hidden; margin: 0; cursor: pointer; text-align: center; } #chickUpload img{ width: 100%; height: 100%; } #chickUpload .layui-upload-img{ width: 50%; height: auto; margin-top: 8px; } #chickUpload div{ font-size: 14px; color: #DCDBDB; } .chickUploadTxt{ height: 36px; width: 255px; line-height: 34px; text-align: center; font-size: 12px; color: #E62D31; border: 1px solid #E9E9E9; } .chickFormSec1Img{ position: absolute; top: 12px; right: 30px; width: 311px; max-height: 432px; border: 1px solid #CCCCCC; overflow: hidden; font-size: 0; display: none; } .chickFormSec1Img img{ width: 100%; } .chickLine{ position: relative; height: 28px; line-height: 28px; overflow: hidden; margin: 40px 0; } .chickLine:after{ content: ''; position: absolute; border-top: 1px #E1E1E1 dashed; width: 100%; height: 1px; left: 0; top: 0; bottom: 0; margin: auto; } .chickLine > *{ background: #fff; position: relative; z-index: 3 } .chickLine span{ color: #E62D31; font-size: 12px; } .chickLine span:first-child{ padding-right: 15px; float: left; } .chickLineR{ padding-left: 15px; float: right; cursor: pointer; } .chickLineR img{ width: 10px; margin-right: 5px; position: relative; top: -1px; transition:all .5s; -moz-transition:all .5s; -ms-transition:all .5s; -o-transition:all .5s; -webkit-transition:all .5s; } .chickInputBox .layui-form-select{ height: 40px; width: 100%; } .chickInputBox > input{ width: 255px; float: left; margin-left: 20px; } .chickInputBox > a{ color: #E62D31; } .chickSec2Box .chickInput:first-child{ margin: 0; } .chickForm_sec2.active .chickLineR img{ transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg); -webkit-transform:rotate(180deg); } .chickBtn{ width: 465px; height: 40px; border-radius: 8px; background: #F9A810; font-size: 16px; color: #fff; text-align: center; line-height: 40px; margin: 40px auto 0; cursor: pointer; } .footer{ font-size: 13px; color: #fff; padding-bottom: 50px; position: relative; z-index: 9; text-align: center; } @media(max-width:1100px) { .fromSec{ width: 84% } .chickInput{ width: 80% } } @media(max-width:768px) { .chickBtn{ width: 80%; } .chickInputLable{ width: 100%; float: initial; } .chickInput > input,.chickInputBox{ width: 100%; margin-left: 0; } .header{ font-size: 18px; line-height: 24px; padding: 10px; height: 44px; } .headerLine { margin: 0 8px; } .fromSec { width: 94%; } .chickForm_sec { margin: 50px 0 30px; position: relative; z-index: 9; } .chickForm_sec .fromSec { padding: 30px 0; } .chickT { font-size: 16px; margin-bottom: 30px; } .chickInput { margin: 15px auto 0; width: 94%; font-size: 13px; } .footer{ padding-bottom: 10px; } }