.account{
  .my-accordion .pad .am-accordion-content-box {
    padding: 10px;
  }
  .my-accordion {
    margin: 6px 0;
  }
  .my-accordion .am-accordion-header  {
    font-size: 16px;
  }
  .account-balance-list{
    .am-list-body .am-list-content {
      color: #666;
    }
    .am-list-body .am-list-content span {
      display: inline-block;
      width: 80px;
      text-align: right;
      margin-right: 12px;
    } 
  }
  .list-item{
    .list-item-extra{
      color: #ccc;
      font-size: 12px;
      cursor: pointer;
    }
    .list-title{
      font-size: 16px;
      color: #666;
      margin: 0 8px;
    }
    .list-des{
      font-size: 12px;
      color: #999;
    }
  }
  .account-balance{
    padding: 3px 10px 5px;
    box-sizing: border-box;
    .ab-head {
      width: 100%;
      padding: 20px 18px;
      // text-align: center;
      height: 110px;
      position: relative;
      background: url(../../../assets/images/zhanghu-bg.png) no-repeat;
      background-size: auto 100%;
      color: #fff;
      overflow: hidden;
      box-sizing: border-box;
      p:nth-of-type(1){
        // margin-top: 20px;
        font-size: 14px;
      }
      p:nth-of-type(2){
        font-size: 20px;
        margin-top: 10px;
        &>span {
          font-size: 36px;
          margin-left: 6px;
        }
      }
    }
    .ab-cont {
      height: 80px;
      background: #fff;
      display: flex;
      &>div {
        width: 50%;
        display: flex;
        align-items: center;
        padding: 0 6px;
        box-sizing: border-box;
        color: #999;
        font-size: 14px;
      }
      &>div:nth-child(1) {
        border-right: 1px solid #eee;
      }
      img {
        width: 66px;
        height: 66px;
        margin-right: 5px;
      }
      span{
        font-weight: 400;
        strong {
          display: line-block;
          line-height: 32px;
          color: #333;
          font-size: 18px;
        }
      }
    }
  }
  .list-extra-span{
    font-size: 14px;
    font-weight: 700;
  }
  .colorFE9400{
    color: #FE9400;
  }
  .colorFA5C7C{
    color: #999;
    font-weight: 400;
  }
  .list-item-icon{
    font-size: 18px;
    color: #ccc;
    margin-right: 8px;
  }
  .pending-item .am-list-line.am-list-line-multiple {
    padding: 12px;
    padding-left: 0;
  }
  .pending-item.am-list-item .am-list-line .am-list-extra {
    flex-basis: 15%;
  }
  .pending-type {
    font-size: 14px;
  }
  .pending-admdate {
    margin: 2px 0;
    color: #999;
    font-size: 14px;
  }
  .pending-payment{
    margin-top: 6px;
    font-size: 14px;
    color: #999;
    strong {
      font-size: 16px;
      font-weight:400;
      color: #FA541C;
      margin-left: 2px;
    }
  }
}

// 充值
.recharge {
  // 充值金额
  .recharge-head{
    height: 45px;
    line-height: 45px;
    padding: 0 20px;
    box-sizing: border-box;
    font-size: 16px;
    color: #333;
  }
  .grid-list{
    display: flex;
    // justify-content: space-between;
    flex-wrap: wrap;
    padding: 16px 4px 4px 16px;
    background: #fff;
    box-sizing: border-box;
    li{
      width: 30%;
      height: 60px;
      line-height: 60px;
      text-align: center;
      margin-bottom: 12px;
      font-weight: 400;
      font-size: 20px;
      color: #666;
      cursor: pointer;
      border-radius:2px;
      margin-right: 3.3333333333333333%;
      box-shadow:0px 1px 4px 1px rgba(204,204,204,0.54);
    }
    .grid-list-active {
      background: #1890FF;
      color: #fff;
    }
  }
  .am-list-item.am-input-item.am-list-item-middle {
    height: 60px;
    .am-input-label.am-input-label-5 {
      font-size: 16px;
      color: #333;
      font-weight:400;
    }
    .fake-input-placeholder {
      font-size: 16px;
      color: #ccc;
    }
  }
  .am-list-item .am-input-control .fake-input-container .fake-input.focus:after {
    top: 0;
  }
}

// 充值成功
.recharge-successful{
  .am-icon-md{
    width: 60px;
    height: 60px;
  }
  .result-icon{
    font-size: 30px;
  }
  .am-result {
    .am-result-title{
      font-size: 18px;
      font-weight: 700;
      color: #666;
    }
    .am-result-message{
      font-size: 14px;
    }
  }
  .operation-button{
    padding: 36px 18px;
  }
}

// 账单
.bill{
  margin-top: 5px;
  .list-query-conditions>p {
    height: 32px;
    line-height: 32px;
    padding: 0 18px;
    box-sizing: border-box;
    font-size: 14px;
    color: #999;
    background-color: #fff;
    span:nth-child(1) {
      margin-right: 24px;
    }
    strong {
      font-weight: 400;
    }
  }
  .query-conditions{
    display: flex;
    &>div {
      width: 50%;
    }
    &>div:nth-child(1) {
      display: flex;
      align-items: center;
      align-items: center;
      position: relative;
      font-weight: 400;
      background-color: #fff;
      width: 50%;
      .query-conditions-content {
       
        width: 100%;
        height: 18px;
        border-right: 1PX solid #eee;
        box-sizing: border-box;
        padding: 0 6px 0 20px;
        font-size: 14px;
        color: #888;
        &>span {
          display: inline-block;
          width: 90%;
        }
        .iconfont {
          float: right;
          font-size: 14px;
          color: #ccc;
        }
      }
    }
    .am-list-item.am-list-item-middle {
      padding-left: 20px;
      .am-list-line {
        padding-right: 4px;
      }
    }
    .am-list-item .am-list-line .am-list-extra{
      flex-basis: 100%;
      text-align: left;
    }
  }
  .bill-detail-list{
    height: -webkit- calc(100%-127px);
    overflow: auto;
    i{
      font-size: 20px;
    }
    .am-list-item .am-list-line .am-list-content{
      font-size: 14px;
      color: #e4e4e4;
    }
    .am-list-item .am-list-line .am-list-brief{
      font-size: 12px;
      color: #999;
      margin-top: 0;
    }
    .am-list-extra{
      font-size: 14px;
      color: #e4e4e4;
      font-weight: 700;
    }
    .am-list-extra-income {
      color: #FE9400;
    }
  }
  .icon-weixin {
    color: #00D005;
  }
  .load-more{
    text-align: center;
    color: #0079FE;
    font-size: 14px;
    line-height: 36px;
    i{
      font-size: 12px;
    }
  }
  .no-more {
    text-align: center;
    font-size: 12px;
    color: #999;
    line-height: 36px;
  }
}

// 账单详情
.billing-details{
  .list-baseinfo{
    p{
      padding: 0 18px;
      border-bottom: 1px solid #e4e4e4;
      height: 70px;
      line-height: 70px;
      font-size: 16px;
      color: #666;
      i{
        font-size: 36px;
        color: #00D005;
        margin-right: 10px;
      }
      span{
        float: right;
        font-size: 28px;
        font-weight: 700;
        color: #FE9400;
      }
    }
  }
}

// 缴费
.account-payment{
  .tabs-style{
    margin-top: 5px;
    .tab-content{
      padding-top: 0;
      .am-list-item .am-list-line-multiple {
        padding: 8px 15px 8px 0;
      }
      .am-list-content {
        font-size: 16px;
        color: #666;
        font-weight: 400;
      }
      .am-list-item .am-list-line .am-list-brief{
        color: #999;
        font-weight: normal;
      }
    }
  }
  .tab-content{
    font-size: 14px;
    color: #333;
    height: 100%;
    
    .tabs-date{
      font-size: 12px;
      margin: 0 6px;
    }
    .tabs-type {
      display: inline-block;
      width:36px;
      height:20px;
      text-align: center;
      line-height: 20px;
      background:#ECFFF9;
      border:1px solid #33CC99;
      border-radius:3px;
      font-size:12px;
      color: #33CC99;
    }
    
  }
  .pending-payment{
    font-size: 14px;
    color: #999;
    strong {
      font-size: 16px;
      font-weight:400;
      color: #FA541C;
      margin-left: 2px;
    }
  }
  .already-paid{
    color: #999;
    font-weight: 400;
    font-size: 14px;
  }
}

// 缴费单详情
.payment-slip-details.payment-slip-details-bottom{
  padding-bottom: 42px;
  position: relative;
  box-sizing: border-box;
}
.payment-slip-details{
  height: 100%;
  padding-top: 5px;
  overflow: auto;
  box-sizing: border-box;
  .psd-list-header {
    .am-list-item.am-list-item-middle {
      height: 55px;
      .am-list-content {
        font-size: 16px;
        color: #666;
        font-weight: 400;
      }
      .am-list-extra {
        flex-basis: 70%;
        font-size: 16px;
        color: #999;
        font-weight: 400;
      }
    }
    .am-list-item.am-list-item-middle:last-of-type {
      .am-list-extra {
        color: #FA541C;
      }
    }
  }
  .accordion-style{
    .am-accordion {
      .am-accordion-item .am-accordion-header {
        font-size: 16px;
        color: #666;
        font-weight: 400;
      }
    }
    .title{
      height: 45px;
      line-height: 45px;
      font-size: 16px;
      color: #333;
      padding: 0 14px;
      font-weight: 400;
    }
  }
  .list-children{
    background: #f5f5f9;
    &>div{
      height: 28px;
      line-height: 28px;
    }
  }
  .am-accordion .am-accordion-item .am-accordion-header{
    color: #666;
    font-size: 14px;
  }
  .use-balance{
    height: 60px;
    font-size: 14px;
    color: #333;
    box-sizing: border-box;
    background: #fff;
    margin-top: 10px;
    .am-checkbox-agree .am-checkbox{
      top: 8px;
      width: 21px;
      height: 21px;
    }
    span{
      display: block;
      font-size: 12px;
      color: #FE9400;
    }
  }
}

.quick-date{
  padding: 36px 18px 24px;
  display: flex;
  justify-content: space-between;
  span {
    display: block;
    height: 26px;
    line-height: 26px;
    border: 1px solid #0079FE;
    width: 25%;
    color: #0079FE;
    font-size: 12px;
    border-radius: 4px;
  }
  .quick-active {
    background: #0079fe;
    color: #fff;
    font-weight: 500;
  }
}
.start-end-date{
  height: 32px;
  line-height: 32px;
  padding: 0 18px;
  box-sizing: border-box;
  text-align: left;
  .date{
    display: inline-block;
    width: 110px;
    text-align: center;
    height: 30px;
    border-bottom: 1px solid #e4e4e4;
    input {
      width: 100%;
      height: 30px;
      border: 0;
      text-align: center;
    }
  }
  .data-active{
    color: #0079fe;
    border-bottom-color: #0079fe;
  }
  strong {
    margin: 0 12px;
  }
  .am-button{
    float: right;
  }
}

.to-pay-noclick {
  color: hsla(0,0%,100%,.6);
  opacity: .4;
}