page {
      height: 100%;
  }
  .content {
      position: relative;
      width: 100%;
      height: 100%;
      font-family: "MicrosoftYaHei";
      font-weight: 400;
      background-image: url(../../static/images/背景.png);
      background-size:100% 100%;
      background-attachment: fixed;
      background-repeat:no-repeat
    .status_bar {
            position: fixed;
            top: 0;
            height: var(--status-bar-height);
            width: 100%;
            background: #f8f8f8;
            z-index: 1000;
        }
        .navBar{
            position: fixed;
            top: 0;
            left: 0;
            width: 750rpx;
            height: 55rpx;
            margin-top: 34rpx;
            color: #fff;
            font-weight: bold;
            background-color: rbga(0,0,0,0.1);
            text-align: center;
            line-height: 55rpx;
            .back{
                display: inline-block;
                position: absolute;
                top: 16rpx;
                left:30rpx ;
                width: 10px;
                height: 10px;
                border: none;
                border-bottom: 4rpx solid #fff;
                border-left: 4rpx solid #fff;
                transform: rotate(45deg);
                text-align: center;
                
            }
        }
    //   .bgImg {
    //       position: absolute;
    //       left: 0;
    //       top: 0;
    //       z-index: 1000;
    //       width: 100%;
    //       height: 100%;

		  
    //   }

      .messageCard {
          position: absolute;
          top: 330rpx;
          left: 36rpx;
          width: 678rpx;
          height: 680rpx;
          background: #fff;
          border-radius: 14rpx;
          box-sizing: border-box;

          .detail {
              display: flex;
              flex-direction: column;
              justify-content: space-between;
              width: 578rpx;
              height: 300rpx;
              margin-top: 50rpx;
              margin-left: 50rpx;

              .head {
                  display: flex;
                  justify-content: flex-start;

                  view {
                      width: 8rpx;
                      height: 30rpx;
                      background: #6EAFF0;
                      margin-top: 12rpx;
                      margin-right: 19rpx;
                  }

                  text {
                      font-size: 32rpx;
                      font-weight: bold;
                      color: #333333;
                      line-height: 54rpx;
                  }
              }

              .mes {
                  font-size: 28rpx;
                  line-height: 54rpx;
              }
          }

          .confirm {
              width: 322rpx;
              height: 80rpx;
              background: #6EAFF0;
              border-radius: 10rpx;
              margin: 0 auto;
              font-size: 28rpx;
              color: #FFFFFF;
              line-height: 80rpx;
              text-align: center;
              margin-top: 100rpx;
          }

          .footer {
              display: block;
              width: 578rpx;
              height: 63rpx;
              margin: 0 auto;
              margin-top: 38rpx;
              font-size: 24rpx;
              color: #B3B3B3;
              line-height: 40rpx;

          }
      }

      .messageBg1 {
          position: absolute;
          top: 344rpx;
          left: 51rpx;
          width: 648rpx;
          height: 680rpx;
          background: #FFFFFF;
          opacity: 0.7;
          border-radius: 14rpx;
      }

      .messageBg2 {
          position: absolute;
          top: 357rpx;
          left: 58rpx;
          width: 634rpx;
          height: 680rpx;
          background: #FFFFFF;
          opacity: 0.5;
          border-radius: 14rpx;
      }

  }