|
- *{
- 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;
- }
- }
|