/* pages/fnSubscribeDocument/fnSubscribeDocument.wxss */
@import "../../utils/areaSelector/selector.wxss";
page {
background: white
}
.subscribeDocument {
background: white;
position: relative;
z-index: 1;
}
.tip {
background: #ffd5dd;
height: 45px;
font-size: 12px;
line-height: 45px;
text-align: center;
color: #ee7289;
font-weight: normal
}
.topBar {
width: 73px;
margin-left: 50%;
transform: translateX(-50%);
margin-top: 10px;
display: flex;
flex-direction: row;
}
.topBar-left {
width: 44px;
height: 3px;
background: #ffd5dd;
border-radius: 50px 0px 0px 50px;
}
.topBar-right {
width: 44px;
height: 3px;
background: #ffd5dd;
border-radius: 0px 50px 50px 0px;
margin-left: 3px;
}
.lightHight {
background: #f4879b;
}
.title {
position: relative;
margin-top: 27px;
margin-left: 15px;
margin-bottom: 20.5px;
height: 15px;
align-items: center;
}
.title image {
position: absolute;
width: 15px;
height: 15px;
margin-top: 0px;
}
.title text {
position: absolute;
margin-left: 20px;
font: medium;
font-size: 15px;
color: #ee7289;
line-height: 15px;
margin-top: 0px;
}
.input {
position: relative;
display: flex;
align-items: center;
justify-content: flex-start;
height: 44px;
border-radius: 5px;
margin-top: 9px;
margin-left: 15px;
margin-right: 15px;
border-radius: 10px;
border: 2px solid transparent;
background-image: linear-gradient(#fff, #fff),
linear-gradient(to bottom left,#FFB4B4,#FF8EA9);
background-origin: border-box;
background-clip: content-box, border-box;
border-radius: 20px;
}
/* 必填*/
.mustFillIn {
background-color: #fff;
}
/* 必填*/
.prohibit {
background-color: #ececec;
}
/*填写类别的红色title的设置 min-width属性保障了不会被换行*/
.input text {
font-size: 13px;
color: #ee7289;
margin-left: 15px;
min-width: 58px;
}
.input input {
position: absolute;
font-size: 14px;
color: #5e5e5e;
left: 85px;
height: 44px
}
.input_dele {
height: 10px;
width: 10px;
position: absolute;
right: 15px;
}
.input-placeholder {
color: #979797
}
.next {
width: 670upx;
height: 100rpx;
background: linear-gradient(135deg, #FFB4B4 0%, #FF8EA9 100%);
border-radius: 20rpx 20rpx 20rpx 20rpx;
opacity: 1;
font-size: 34rpx;
font-weight: 500;
color: #FFFFFF;
margin: 34rpx;
line-height: 64rpx;
}
.blankbottom {
height: 55px;
}
.nationality {
width: 50%;
margin-right: 0rpx;
}
.national {
width: 50%;
margin-left: 5px;
}
/*国籍民族*/
.nationalityNational {
display: flex;
flex-direction: row;
align-items: center;
}
.picker {
min-height: 44px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
}
.picker__text {
position: absolute;
left: 85px;
top: 0;
font-size: 14px;
color: #979797;
line-height: 44px;
right: 20px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
}
.picker__right {
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
width: 12px;
height: 12px;
}
.add_picker {
position: absolute;
left: 85px;
top: 0px;
right: 35px;
min-height: 44px;
display: flex;
flex-direction: column;
justify-content: center;
}
.add_picker__text {
font-size: 14px;
color: #979797;
line-height: 14px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.add_picker__btn {
position: absolute;
top: 28px;
right: -30px;
font-size: 10px;
color: #417dcc;
}
.address {
height: 89px;
}
.address text {
position: absolute;
top: 13px;
}
.address__picker__right {
position: absolute;
right: 15px;
top: 20%;
transform: translateY(-50%);
width: 12px;
height: 12px;
}
/*当前详细地址*/
.address__input {
top: 45px;
left: 0px;
right: 0px;
border-top: 1px solid #f4879b;
}
/*---------------------------------三级联动布局----------------------------*/
.addr-body {
position: relative;
box-sizing: border-box;
overflow: hidden;
}
.input-long {
width: 79%;
}
.inline-block {
display: inline-block;
}
.addr-body,
.form {
height: 100%;
box-sizing: border-box;
overflow: hidden;
}
.top-sec {
margin: 8px 0;
background: white;
border-bottom: 1rpx solid #e5e5e5;
}
.input-wrapper {
height: 58px;
padding: 0 17px;
box-sizing: border-box;
line-height: 58px;
font-size: 15px;
border-bottom: 1rpx solid #f2f2f2;
}
.top-sec .input-wrapper .input-title {
vertical-align: top;
display: inline-block;
width: 21%;
}
.top-sec .input-wrapper input {
vertical-align: top;
display: inline-block;
height: 58px;
line-height: 58px;
}
.area-wrapper {
display: inline-block;
width: 79%;
text-align: right;
}
.bottom-sec {
padding: 0 17px;
box-sizing: border-box;
border-bottom: 1rpx solid #e5e5e5;
border-top: 1rpx solid #e5e5e5;
background: white;
}
.check-box {
position: relative;
padding-left: 25px;
}
.check-box:before,
.active:after {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.active:after {
left: 4px;
width: 6px;
height: 6px;
background-color: #2fa7e0;
border-radius: 50%;
}
.check-box:before {
left: 0;
width: 12px;
height: 12px;
border: 1px solid #2fa7e0;
border-radius: 50%;
}
.bottom-sec .input-wrapper {
padding: 0;
}
.add-address {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.address-btn {
color: white;
background-color: #2fa7e0;
}
.set-area-wrapper {
top: 0;
left: 0;
height: 100%;
width: 100%;
position: fixed;
z-index: 4;
}
.area-mask {
height: 100%;
width: 100%;
position: absolute;
z-index: 3;
background-color: rgba(0, 0, 0, 0.6);
}
.white-bg {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 200px;
background: white;
opacity: 1;
color: black;
z-index: 1000;
}
.white-bg .top-option {
position: absolute;
top: 0;
right: 0;
height: 40px;
width: 100%;
font-size: 16px;
color: #2fa7e0;
z-index: 10000;
opacity: 1;
background: white;
}
.ok,
.cancel {
position: absolute;
top: 0;
height: 40px;
line-height: 40px;
width: 50%;
}
.cancel {
left: 12px;
text-align: left;
}
.ok {
right: 12px;
text-align: right;
}
.tongshang {
position: absolute;
top: 58px;
left: 15px;
font-size: 12px;
}
.checkbox-sty {
position: relative;
display: flex;
align-items: center;
justify-content: flex-start;
margin-top: 9px;
margin-left: 15px;
margin-right: 15px;
}