football/components/page-component/app-phone-binding/app-phone-binding.scss

.app-phone-binding {
  position: absolute;
  height: 100%;
  width: 100%;
  background-color: #f7f7f7;
  .app-unbound {
    width: 100%;
    background-color: #f7f7f7;
    .header {
      width: 100%;
      height: #{86rpx};
      background-color: white;
      border-bottom: #{1rpx} solid #e2e2e2;
      text-align: center;
      margin-bottom: #{8rpx};
      .box-grow-1 {
        text {
          display: inline-block;
          height: #{84rpx};
          line-height: #{84rpx};
          border-bottom-color: transparent;
          border-bottom-style: solid;
          border-bottom-width: #{2rpx};
          color: #353535;
          font-size: #{28rpx};
        }
        .active-index {
          border-bottom-color: #ff4544;
          color: #ff4544;
        }
      }
    }
    .content {
      width: 100%;
      height: #{110rpx};
      background-color: white;
      padding: #{10rpx} 0;
      box-sizing: border-box;
      .input-view {
        margin-left: #{24rpx};
        background-color: white;
        height: #{80rpx};
        width: #{750-24rpx};
        .input {
          height: #{80rpx};
          width: #{516rpx};
          line-height: #{80rpx};
          background-color: #f7f7f7;
          padding-left: #{24rpx};
          box-sizing: border-box;
          font-size: #{28rpx};
          color: #999999;
          margin-right: #{16rpx};
        }
        .input-value {
          color: #353535;
        }
        .line {
          width: #{1rpx};
          height: #{36rpx};
          background-color: #e2e2e2;
        }
        .button {
          width: #{194rpx};
          height: #{80rpx};
          line-height: #{80rpx};
          color: #ff4544;
          font-size: #{28rpx};
          background-color: white;
          border: none;
          border-radius: 0;
          text-align: center;
          padding: 0;
          box-sizing: border-box;
        }
      }
      .manual-input {
        width: 100%;
        height: #{200rpx};
        background-color: white;
        .top {
          height: #{100rpx};
          font-size: #{28rpx};
          border-bottom: #{1rpx} solid #e2e2e2;
          >input {
            width: #{750rpx};
            height: #{60rpx};
            margin: #{20rpx} 0;
            padding-left: #{40rpx};
            box-sizing: border-box;
          }
        }
        .bottom {
          height: #{100rpx};
          >input {
            width: #{750-220-1rpx};
            line-height: #{60rpx};
            padding-left: #{40rpx};
            font-size: #{28rpx};
            margin: #{20rpx} 0;
            box-sizing: border-box;
          }
          .line {
            width: #{1rpx};
            height: #{32rpx};
            background-color: #e2e2e2;
          }
          .btn {
            height: #{100rpx};
            line-height: #{100rpx};
            width: #{220rpx};
            font-size: #{28rpx};
            text-align: center;
            color: #ff4544;
          }
        }
      }
      .sure-button {
        width: #{702rpx};
        height: #{88rpx};
        line-height: #{88rpx};
        text-align: center;
        margin: #{80rpx 20rpx 0 24rpx};
        background-color: #ff4544;
        color: white;
        font-size: #{32rpx};
        border-radius: #{44rpx};
      }
    }
  }
  .app-bound {
    width: #{750rpx};

    .app-image {
      width: #{288rpx};
      height: #{288rpx};
      margin: #{64rpx 0rpx 56rpx 0rpx};
    }

    .app-phone-text {
      text-align: center;
      color: #666;
      font-size: #{30rpx};
      margin-bottom: #{60rpx};

      .app-hone {
        margin-top: #{15rpx};
      }

      .app-button {
        height: 100%;
        border: none;
        font-size: #{26rpx};
        color: #ff4544;
        padding: 0 0;
        margin-top: #{64rpx};
        margin-left: #{24rpx};
        margin-right: #{24rpx};
      }

      .app-button:after {
        display: none;
      }
    }
  }
}