dorm-manager/dorm-manager-wx/pages/handle/write/write.wxss

page{
  background-color: #efefef;
  height: 100%;
}
.tab{
  height: 130rpx;
  display: flex;
  align-items: center;
  background: #fff;
}
.top{
  width: 690rpx;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  border-radius: 10rpx;
  /* overflow: hidden; */
}
.top :first-child{
  border-radius: 10rpx 0rpx 0rpx 10rpx;
}
.top :last-child{
  border-radius: 0rpx 10rpx 10rpx 0rpx;
}
.top view{
  width: 40%;
  height: 70rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 30rpx;
  border-collapse: collapse;
  border:1rpx solid #33ad37;
  margin-right: -1rpx
}
.select{
  color: #fff;
  background-color: #33ad37;
}
/* tab结束 */
/* 审批条件 */
.top2{
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30rpx 0rpx;
  background-color: #fff;
}
.msg1{
  width: 690rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.triangle1{
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 12rpx 12rpx 12rpx 0;
  border-color: transparent #33ad37 transparent transparent;
}
.msg_content1{
  background-color: #33ad37;
  color: #fff;
  font-size: 24rpx;
  height: 100%;
  border-radius: 10rpx;
  padding: 20rpx 20rpx;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.content{
  width: 690rpx;
  margin: 0 auto;
}
.sp-title{
  font-size: 30rpx;
  color:#333;
  height: 86rpx;
  display: flex;
  align-items: center;
  border-bottom: 1rpx solid #efefef;
}
.sp-content_text view{
  font-size: 26rpx;
  color:#666;
  margin-top: 24rpx;
  line-height: 50rpx;
}
.ps{
  margin-top: 60rpx;
  padding-bottom: 40rpx;
  font-size: 24rpx;
  color: #999;
}
.btn{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 50rpx;
  padding-bottom: 100rpx;
}
.btn button{
  width: 240rpx;
  height: 70rpx;
  background-color: #33ad37;
  color: #fff;
  border-radius: 70rpx;
  line-height: 70rpx;
  font-size: 30rpx;
}
/* 审批条件结束 */
.top1{
  padding: 30rpx 0rpx;
  background-color: #fff;
}
.msg{
  width: 690rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  margin-left: 20rpx;
}
.triangle_view{
  position: relative;
  width: 12rpx;
  height: 150rpx;
}
.triangle{
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 12rpx 12rpx 12rpx 0;
  border-color: transparent #33ad37 transparent transparent;
  position: absolute;
  top: 20rpx;
}
.msg_content{
  background-color: #33ad37;
  color: #fff;
  font-size: 24rpx;
  height: 100%;
  border-radius: 10rpx;
  padding: 20rpx 40rpx;
  display: flex;
}
.content{
  width: 690rpx;
  margin: 0 auto;
}
.title{
  font-size: 30rpx;
  color:#333;
  height: 86rpx;
  display: flex;
  align-items: center;
  border-bottom: 1rpx solid #efefef;
}
.content_text view{
  font-size: 26rpx;
  color:#333;
}
.content_text :last-child{
  border: none;
}
.form{
  display: flex;
  align-items: center;
  padding:20rpx 0rpx;
  border-bottom: 1rpx solid #efefef;
}
.form :last-child{
  color: #666;
}
.xing{
  width: 24rpx;
  color: red !important;
}

.form_title{
  width: 240rpx;
  font-size: 26rpx;
  color: #666;
  display: flex;
  align-items: center;
}
.picker{
  width: 400rpx;
  display: flex;
  align-items: center;
}
.picker image{
  margin-left: 20rpx;
}
.input{
  width: 60%;
}
.place{
  font-size: 26rpx;
  color: #999;
}
.img{
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}
.img_title{
  display: flex;
  align-items: center;
  padding: 30rpx 0rpx;
}
.img_title text{
  font-size: 26rpx;
  color:#333;
}
.img_title  image{
  width: 26rpx;
  height: 26rpx;
  margin-left: 10rpx;
}
.image{
  width: 120rpx;
  height: 120rpx;
  background-color: #f8f8f8;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 20rpx;
}
.image image{
  width: 80rpx;
  height: 80rpx;
}
.submit{
  display: flex;
  justify-content: center;
  padding: 80rpx;
}
.submit view{
  width: 240rpx;
  height: 70rpx;
  font-size: 30rpx;
  border:1rpx solid #33ad37;
  border-radius: 70rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}
.submit :last-child{
  background: #33ad37;
  color: #fff;
  margin-left: 60rpx;
}
.img-content{
  display: flex;
  flex-wrap: wrap;
  /* flex-direction: row;
   */
}
.bdimg{
   position: relative;

}
.bdimg image{
  width: 120rpx;
  height: 120rpx;
  margin-left: 16rpx;
}
.delete-img{
  width: 20rpx;
  height: 20rpx;
  position: absolute;
  top: 0;
  right: 0;
}
/* 预约页面 */
.reservation{
  display: flex;
  height: 80rpx;
  align-items: center;
}
.reservation-title{
  font-size: 30rpx;
  color: #333;
}
.reservation-text{
  margin-left: 26rpx;
  font-size: 30rpx;
  color: #666;
}
/* 选择时间 */
.reservation-time{
  width: 370rpx;
  height: 60rpx;
  border:1rpx solid #666;
  border-radius: 20rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}
.reservation-time image{
  width: 18rpx;
  height: 18rpx;
  margin-left: 20rpx;
}
/* 预约时间选择 */
.reservation-date{
  display: flex;
  margin-top: 40rpx;
  justify-content: center;
  align-items: center;
}

.reserva{
  width: 330rpx;
  height: 186rpx;
  border:1rpx solid #999;
  border-radius: 16rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.reserva text{
  font-size: 30rpx;
  color:#333;
  display: flex;
  justify-content: center;
  align-items: center;
}
.reserva-check{
  width: 290rpx;
  height: 102rpx;
  border-radius: 16rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #bfbfbf;
  margin-top: 14rpx;
}
.reserva-check view{
  font-size: 26rpx;
  color:#fff;
}
.reserva-select{
  background-color:#33ad37;
}
/* 验证码 */
.phoneCode{
  display: flex;
  
}
.phoneCode view{
  width:170rpx;
  height:60rpx;
  color:#fff;
  font-size:26rpx;
  background-color: #28a5f9;
  border-radius: 16rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 30rpx;
}
/* 申报确认 */
.result-title{
  display: flex;
  align-items: center;
  padding-left: 34rpx;
  height: 90rpx;
  background-color: #fff;
  margin-top: 30rpx;
  font-size: 30rpx;
  color:#333;
}
.result-left{
  display: flex;
  align-items: center;
  width: 94%;
}
.result-left image{
  width: 36rpx;
  height: 36rpx;
}
.result-left view{
  width: 88%;
  margin-left: 20rpx;
  font-size: 30rpx;
  color: #333;
}
.result-show{
  width: 36rpx;
  height: 36rpx;
  margin-right: 34rpx;
}
.result{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 34rpx;
  padding:20rpx;
  background-color: #fff;
  margin-top: 30rpx;
}
/* 遮罩层 */
.mask{
  width:100%;
  height:100%;
  position:fixed;
  background-color:rgba(70, 70, 70, 0.5);
  z-index:9999;
  top:0;
  left:0;
  opacity:1;
  display: flex;
  justify-content: center;
  align-items: center;
  
}
.mask_content{
  width:542rpx;
  height: 320rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #fff;
  border-radius: 20rpx;
}
.mask_content text{
  font-size: 30rpx;
  color:#333;
  margin-top: 54rpx;
}
.mask-input{
  height: 60rpx;
  border-bottom: 1rpx solid #000;
  text-align: center;
  margin-top: 30rpx;
  width: 388rpx;
}
.mask-btn{
  display: flex;
  justify-content: center;
  margin-top: 40rpx;
}
.mask-clear{
  width: 160rpx;
  height: 60rpx;
  border:1rpx solid #33ad37;
  border-radius: 60rpx;
  font-size: 26rpx;
  color: #33ad37;
  display: flex;
  justify-content: center;
  align-items: center;
}
.mask-true{
   width: 160rpx;
  height: 60rpx;
  background-color:#33ad37;
  border-radius: 60rpx;
  font-size: 26rpx;
  color: #fff;
  margin-left:50rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}
.clear{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 60rpx;
}
.clear image{
  width: 60rpx;
  height: 60rpx;
}
/* 底部悬浮 */
/* .fixed{
  width: 100%;
  position: fixed;
  bottom: 0;
  height: 100rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
}
.fixed view{
  width: 190rpx;
  height: 68rpx;
  border:1rpx solid #33ad37;
  border-radius: 70rpx;
  color: #33ad37;
  background-color: #fff;
  font-size: 30rpx;
  display: flex;
  align-items: center;
  margin: 30rpx;
  overflow: hidden;
}
.fixed view button{
  background-color: transparent;
  color:#33ad37;
  font-size: 30rpx;
  width: 100%;
} */
.flxed-bottom{
  position: fixed;
  width: 100%;
  height: 100rpx;
  bottom: 0rpx;
  display: flex;
  background-color: #fff;
  align-items: center;
  justify-content: center;
}
.flxed-bottom1{
  position: fixed;
  width: 100%;
  height: 260rpx;
  bottom: 0rpx;
  background-color: #fff;
}
/* .flxed-bottom input,.flxed-bottom1 input{
  width: 70%;
  margin-bottom: 22rpx;
  margin-left: 164rpx;
  padding-bottom:10rpx; 
  border-bottom: 1rpx solid #efefef;
} */
.mode{
  display: flex;
  align-items: center;
  padding: 16rpx;
}
.mode view{
  /* margin-left: 70rpx; */
}
.sub{
  display: flex;
  width: 100%;
  justify-content: space-around;
  align-items: center;
  height: 100rpx;
}
.sub view{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 190rpx;
  height: 68rpx;
  border:1rpx solid #33ad37;
  border-radius:50rpx; 
  color: #33ad37;
  overflow: hidden;
}
.sub button{
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  color:#fff;
  background-color: #33ad37;
  font-size: 30rpx;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.mode-view{
  height: 140rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 30rpx;
}
.radio-group :last-child{
  margin-left: 10rpx;
}
.sub button::after{ border: none; }

/* 展开 */
.basis{
  /* height: 80rpx; */
  padding:20rpx;
  width: 690rpx;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.basis text{
  font-size: 30rpx;
  color: #333;
}
.basis image{
  width: 36rpx;
  height: 36rpx;
}
.basis-content{
  height: 0;
  font-size: 30rpx;
  color:#666;
  /* padding-bottom: 30rpx; */
  line-height: 50rpx;
}
.kind-list-item-bd {
  height: 0;
  overflow: hidden;
}
.kind-list-item-bd-show {
  height: auto;
  background-color: #fff;
}
.navigator-box {
  opacity: 0;
  position: relative;
  line-height: 1.41176471;
  transform: translateY(-50%);
  transition: .3s;
  width: 690rpx;
  margin: 0 auto;
  font-size: 28rpx;
}
.navigator-box-show {
  opacity: 1;
  transform: translateY(0);
  display: flex;
  flex-wrap: wrap;
}
.no1{
  display: flex;
  flex-wrap: wrap;
}
/* 单选 */
/* 未选中的 背景样式 */
radio .wx-radio-input{ 
    height: 36rpx; 
    width: 36rpx;
    border-radius: 50%;
    background: transparent;
 }
/* 选中后的 背景样式 */
radio .wx-radio-input.wx-radio-input-checked{
   border: none;
}
/* 选中后的 对勾样式 */
radio .wx-radio-input.wx-radio-input-checked::before{
   border-radius: 50%;
   width: 36rpx; 
   height: 36rpx;
   line-height: 36rpx;
   text-align: center;
   font-size:36rpx; 
   color:#fff;
   background: #33ad37;
   border: 6rpx solid #33ad37;
}

/* 测试 */
.test_display {
  font-size: 26rpx;
  color: #666;
  vertical-align: middle;
  white-space:nowrap;
  }

.scroll_display {
  width: 50%;
  height: 56rpx;
  font-size: 35rpx;
  vertical-align: middle;
  overflow: hidden;
  /* padding-left: 60rpx; */
}