nsgk_wechat/pages/index/index.wxss

.singleLinHidenEllipsis{
    color: black;
    text-align: center;
    width: auto;
}
.information_header{
  /* padding: 30rpx 32rpx 54rpx; */
  padding: 10rpx 32rpx 54rpx;
  display: flex;
  position: relative;
}
.information_header .setup{
  width: 38rpx;
  height: 38rpx;
  position: absolute;
  right: 34rpx;
  top: 15rpx;
  display: block;
}
.information_header .portrait_head{
  width: 110rpx;
  height: 110rpx;
  background: #000;
  border-radius: 50%;
}
.information_header .information_main{
  flex: 1;
  padding-left: 16rpx;
}
.information_header  .name_wrap{
 display: flex;
 height: 54rpx;
 align-items: center;
 margin-bottom: 10rpx;
}
.information_header  .name_wrap .name{
  font-size: 46rpx;
}
.information_header  .name_wrap .jobs{
  margin-left: 18rpx;
  width: 155rpx;
  height: 40rpx;
  background: #5bae75;
  border:2rpx solid #2c8e68;
  color: #fff;
  border-radius: 40rpx;
  display: flex;
  font-size: 28rpx;
  justify-content: center; 
  align-items: center;
}
.information_header .name_wrap .jobs .icon{
  width: 26rpx;
  height: 27rpx;
  margin-right: 5rpx;
}

.information_header .task_wrap{
  display: flex;
  height: 44rpx;
  margin-bottom: 18rpx;
}
.information_header .unfinished{
  margin-left: 12rpx;
}
.information_header .task_wrap .flex_block{
  
  height: 48rpx;
  display: flex;
  background: #fff;
  line-height: 44rpx;
  border-radius: 44rpx;
  border:2rpx solid #2c8e68;
  text-align: center;
  font-size: 24rpx;
}

.information_header .task_wrap .flex_block .icon{
  width: 30rpx;
  height: 30rpx;
  vertical-align: sub;
  display:inline-block;
}
.information_header .task_wrap .flex_block .desc{
  width: 115rpx;
  background: #2c8e68;
  position:relative;
  overflow: hidden;
  color: #fff;
  line-height: 44rpx;
  border-top-left-radius: 44rpx;
  border-bottom-left-radius: 44rpx;
  margin-top: -1rpx;
  margin-left: -1rpx;
}

.information_header .task_wrap .flex_block .desc::before{
  position:absolute;
  top:-40rpx;
  right:-40rpx;
  content:"";
  z-index:1;
  width:110rpx; /*如果需要圆角的话 不用比box的宽度长,如果不需要圆角需要增长*/
  height:40rpx;
  background-color:#fff;
  transform:rotate(-75deg);
  transform-origin:right bottom;
  border-radius:0px;
}

.information_header .task_wrap .flex_block .event{
  color: #2c8e68;
  margin-left: -2%;
  padding:0 20rpx 0 20rpx;
}


.information_header .address_wrap{
  font-size: 26rpx;
  color: #2b8e68;
  height: 46rpx;
  line-height: 46rpx;
}

.navList_main{
  width: 685rpx;
  height: 228rpx;
  background-color: #fff;
  border-radius: 24rpx;
  margin:0 auto;
  display: flex;
  box-shadow: 0rpx 0rpx 12rpx rgba(0,0,0,.2);
}
.navList_main  .tab_item{
  flex: 1;
  display: flex;
  justify-content: center; 
  align-items: center; 
  flex-direction: column;
}

.navList_main  .tab_item .icon{
  width: 100rpx;
  height: 100rpx;
  margin-bottom: 12rpx;
}
.navList_main  .tab_item .icon_img{
  width: 100rpx;
  height: 100rpx;
}
.navList_main  .tab_item .desc{
  font-size: 26rpx;
}

.child_function{
  margin: 55rpx 20rpx 0;
  display: flex;
}
.child_function .flex_block{
  flex: 1;
  display: flex;
  justify-content: center; 
  align-items: center; 
  flex-direction: column;
}
.child_function .flex_block .image{
  width: 76rpx;
  height: 70rpx;
  margin-bottom: 20rpx;
}
.child_function .flex_block .attribute{
  width: 76rpx;
  height: 70rpx;
}

.child_function .flex_block .desc{
  font-size: 26rpx;
}

.work_plan{
  padding: 40rpx 32.5rpx 30rpx;
  display: flex;
}

.work_plan  .menu_item{
  height: 60rpx;
  width: 140rpx;
  background-color: #fff;
  box-shadow: 0rpx 0rpx 9rpx rgba(0,0,0,.2);
  border-radius: 60rpx;
  line-height: 60rpx;
  text-align: center;
  font-size: 32rpx;
  position: relative;
  margin-right: 16rpx;

}
.work_plan  .menu_item.active{
  background-color: #5bae78;
  color: #fff;
}
.work_plan .menu_item .remind{
  height: 30rpx;
  background: #e90101;
  color: #fff;
  font-size: 26rpx;
  position: absolute;
  line-height: 30rpx;
  padding:0 10rpx;
  border-radius: 50px;
  top: -10rpx;
  right: -10rpx;
}

.work_plan .more{
  flex: 1;
  text-align: center;
  line-height: 60rpx;
  font-size: 36rpx;
  color: #31936c;
}

.workflow{
  padding: 10rpx 32.5rpx;
}
.workflow .workflow_list{
  height: 150rpx;
  background-color: #fff;
  border-radius: 24rpx;
  box-shadow:0rpx 0rpx 10rpx rgba(0,0,0,.1);
  margin-bottom: 20rpx;
  padding:15rpx 25rpx 10rpx 35rpx;
}
.workflow .workflow_list .process_intro{
  display: flex;
  height: 62rpx;
  align-items: center; 
}

.workflow .process_intro .name{
  width: 390rpx;
  font-size: 34rpx;
  margin-right: 30rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.workflow .process_intro .name .name_tit{
  width: 290rpx;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workflow .process_intro .state{
  width: 93rpx;
  height: 42rpx;
  background-color: #fbe3e3;
  color: #f31e1f;
  border-radius: 12rpx;
  text-align: center;
  line-height: 42rpx;
}

.workflow .process_intro .time{
  flex: 1;
  text-align: right;
  font-size: 32rpx;
  color: #9ea1aa;
}


.workflow .workflow_list .process_pay{
  display: flex;
  height: 52rpx;
  align-items: center; 
}


.workflow .workflow_list .process_pay .describe{
  font-size: 30rpx;
  width: 330rpx;
  color: #3c9370;
  display: flex;
  align-items: center; 
}
.workflow .workflow_list .process_pay .describe .amount_icon{
  width: 32rpx;
  height: 32rpx;
  margin-right: 12rpx;
}

.workflow .workflow_list .process_pay .amount{
  font-size: 38rpx;
  flex: 1;
  text-align: right;
  color: #f31e1f;
}
.workflow .workflow_list .process_pay .amount .unit{
  font-size: 26rpx;
}

.textLimit{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.btn{
  width: 100%;
  height:90rpx;
  padding:0 24rpx;
  box-sizing:border-box;
  line-height: 90rpx;
  text-align: center;
  display: flex;
  background:rgba(255,255,255,.8);
  justify-content: space-between;
}
.address-item {
  min-height: 98rpx;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border-bottom: 1px solid #f1f1f1;
  padding: 0 32rpx
}

.item-title {
  width: 140rpx;
  color: #4d4c4c;
  font-size: 28rpx;
  height: 98rpx;
  line-height: 98rpx;
}
.item-content {
  width: 520rpx;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 28rpx;
  height: 98rpx;
  line-height: 98rpx;
  color: #4d4c4c;
}
/* 地区级联选择器 */

.picker-view {
  width: 100%;
  display: flex;
  background-color: #fff;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  bottom: 0rpx;
  left: 0rpx;
}

.picker-item {
  line-height: 70rpx;
  margin-left: 5rpx;
  margin-right: 5rpx;
  text-align: center;
}

.picker-view__pane {
  height: 100rpx;
  width: 100%;
  padding: 20rpx 32rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
}

.picker-view__pane text{
  color: #00cc88;
  font-size: 30rpx;
}

.pick-view__group {
  width: 96%;
  height: 450rpx;
}
.agree{
  background-color: rgba(92, 174, 119, 0.1);
  color:#5CAE77 ;
  text-align: center;
  float: right;
  padding: 2px 5px;
  border-radius: 5px;
  font-size: 12px;
}
.in{
  background-color: rgba(245, 163, 39, 0.1);
  color:#F5A327 ;
  text-align: center;
  float: right;
  padding: 2px 5px;
  border-radius: 5px;
  font-size: 12px;
}
.disagree{
  background-color: rgba(233, 0, 0, 0.1);
  color:#E90000 ;
  text-align: center;
  float: right;
  padding: 2px 5px;
  border-radius: 5px;
  font-size: 12px;
}