.warningBox{
  width: 100%;
  height: 700px;
  border-radius: 6px;
  border: 1px solid #E3E5EC;
  background: linear-gradient( 180deg, #EAF3FF 0%, #fff 10%);
  box-sizing: border-box;
  padding: 24px;
  overflow-y: auto;
  .detailBox{
    width: 100%;
    .serverPart{
      display: flex;
      //align-items: center;
      justify-content: space-between;
      width: 100%;
      height: 115px;
      border-bottom: 2px solid #EBEDF5;
      margin-bottom: 16px;
      .serverPartBox{
        width: 80px;
        height: 80px;
        border-radius: 8px;
        overflow: hidden;
        position: relative;
        margin-right: 12px;
        .serverPartBoxBg{
          width: 80px;
          height: 80px;
          position: absolute;
          top: 0;left: 0;
          z-index: 1;
        }
        .nameBox{
          position: absolute;
          z-index: 2;
          top: 14px;left: 10px;
          display: flex;
          flex-direction: column;
          .titleName{
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 14px;
            color: #2858CC;
            line-height: 20px;
            text-align: left;
            font-style: normal;
          }
          .labelName{
            font-family: PingFangSC, PingFang SC;
            font-weight: 500;
            font-size: 12px;
            color: #2858CC;
            line-height: 12px;
            text-align: left;
            font-style: normal;
          }
        }

        .statusBox{
          padding: 1px 4px;
          box-sizing: border-box;
          color: #fff;
          font-size: 10px;
          background: #2ABAC6;
          border-radius: 0px 8px 0px 8px;
          z-index: 2;
          display: inline-block;
          position: absolute;
          top: 0;right: 0;
        }
      }
      .serverPartDetail{
        .serverPartDetailTop{
          display: flex;
          align-items: center;
          flex-wrap: wrap;
          .serverPartName{
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 20px;
            color: #333333;
            line-height: 28px;
            text-align: left;
            font-style: normal;
          }
          .serverPartType{
            margin-left: 8px;
            background: linear-gradient( 134deg, #FFEED1 0%, #FFE1CD 100%);
            border-radius: 2px;
            box-sizing: border-box;
            color: #FFA509;
            padding: 0 10px;
          }
        }
        .serverPartDetailBottom{
          display: flex;
          margin-top: 12px;
          .businessBox{
            margin-right: 8px;
            background: #E7F0FF;
            box-sizing: border-box;
            padding: 2px 8px;
            border-radius: 2px;
            display: flex;
            align-items: center;
            .businessIcon{
              width: 16px;
              height: 16px;
              margin-right: 4px;
            }
            .businessText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: #1E58BE;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              margin-right: 4px;
              white-space: nowrap;
            }
            .businessValue{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 18px;
              color: #1E58BE;
              line-height: 22px;
              text-align: left;
              font-style: normal;
            }
          }
        }
      }

      .brandBox{
        display: flex;
        width: 250px;
        flex-direction: column;
        .brandIcon{
          width: 80px;
          height: 80px;
        }
        .brandName{
          font-family: PingFangSC, PingFang SC;
          font-weight: 600;
          font-size: 14px;
          color: #2858CC;
          line-height: 20px;
          text-align: left;
          font-style: normal;
          width: 170px;
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
        }
      }
    }


    .warningTypeBox{
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      width: 100%;
      // height: 69px;
      box-sizing: border-box;
      padding: 0 0 8px;
      border-bottom: 2px solid #EBEDF5;
      margin-bottom: 16px;
      .warningIconBox{
        width: 44px;
        height: 44px;
        border-radius: 6px;
        overflow: hidden;
        margin-right: 12px;
        .warningTypeIcon{
          width: 100%;
          height: 100%;
        }
      }
      .warningTextBox{
        .typeText{
          font-family: PingFangSC, PingFang SC;
          font-weight: 500;
          font-size: 14px;
          color: #FE7628;
          line-height: 20px;
          text-align: left;
          font-style: normal;
          padding: 1px 6px;
          background: #FFFFFF;
          border-radius: 2px;
        }
        .typeDesc{
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          font-size: 14px;
          color: rgba(0,0,0,0.65);
          line-height: 22px;
          text-align: left;
          font-style: normal;
          margin-left: 12px;
        }
      }
      .warningRow{
        display: flex;
        align-items: center;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 14px;
        color: #0B3680;
        line-height: 22px;
        text-align: left;
        font-style: normal;
        padding: 9px 12px;
        background: #E9F1FE;
        border-radius: 4px;
        border: 1px solid #86B4FD;
        .waringLight{
          width: 24px;
          height: 24px;
          margin-right: 4px;
        }
      }
      .questionBox{
        width: 20px;
        height: 20px;
        cursor: pointer;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 9px;
        .questionIcon{
          width: 20px;
          height: 20px;
        }
        .questionContent{
          display: none;
        }
      }
      .questionBox:hover{
        .questionContent{
          display: block;
          position: absolute;
          background: rgb(255, 255, 255);
          padding: 15px;
          border-radius: 8px;
          max-width: 600px;
          left: 0;
          top: 0;
          z-index: 97;
          white-space: nowrap;
          box-shadow: rgba(0, 0, 0, 0.05) 0px 9px 28px 8px, rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px -4px;
        }
      }
    }
    .contentBoxs{
      .contentItem{
        .contentTitleBox{
          display: flex;
          align-items: center;
          margin-bottom: 8px;
          .titleIcon{
            width: 24px;
            height: 24px;
            margin-right: 6px;
          }
          .titleName{
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 14px;
            color: #183362;
            line-height: 24px;
            text-align: left;
            font-style: normal;
          }
        }
        .contentDetail{
          .detailTop{
            position: relative;
            margin-left: 10px;
            margin-bottom: 8px;
            .yellowBgText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: #571519;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              padding: 1px 8px;
              background: #FCF1D3;
              border-radius: 2px;
              margin: 0 8px;
            }
            .YDBox{
              display: flex;
              align-items: center;
              margin: 0 4px;
              .YDIcon{
                width: 24px;
                height: 24px;
                margin-right: 2px;
              }
            }
            .warningRow{
              display: flex;
              align-items: center;
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: #0B3680;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              padding: 9px 12px;
              background: #E9F1FE;
              border-radius: 4px;
              border: 1px solid #86B4FD;
              .waringLight{
                width: 24px;
                height: 24px;
                margin-right: 4px;
              }
            }
          }
          .detailTop:before{
            position: absolute;
            content:'';
            left: -10px;
            top: 50%;
            transform: translateY(-50%);
            width: 4px;
            height: 14px;
            background: linear-gradient( 180deg, #3CB2FE 0%, #0F88FB 100%);
          }
          .textRowBox{
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: rgba(0,0,0,0.85);
            line-height: 22px;
            text-align: left;
            font-style: normal;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            margin-bottom: 8px;
            .dateIcon{
              margin-left: 4px;
              width: 16px;
              height: 16px;
              margin-right: 6px;
            }
            .timeText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 600;
              font-size: 14px;
              color: #2F6DFF;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              cursor: pointer;
            }
            .bigNumber{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 14px;
              color: #243F6E;
              line-height: 28px;
              text-align: left;
              font-style: normal;
            }
            .smallNumber{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 14px;
              color: #243F6E;
              line-height: 28px;
              text-align: left;
              font-style: normal;
            }
            .unit{
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: #788395;
              line-height: 22px;
              text-align: left;
              font-style: normal;
            }
            .orangeText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 600;
              font-size: 14px;
              color: #FE7628;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              margin: 0 4px;
            }
            .yellowText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: #571519;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              padding: 1px 8px;
              background: #FCF1D3;
              border-radius: 2px;
            }
            .sortText{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 14px;
              color: #2F6DFF;
              line-height: 28px;
              text-align: left;
              font-style: normal;
              margin-left: 8px;
              margin-right: 2px;
            }
            .blueText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 500;
              font-size: 14px;
              color: #243F6E;
              line-height: 22px;
              text-align: left;
              font-style: normal;
            }
            .blueText2{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 14px;
              color: #243F6E;
              line-height: 28px;
              text-align: left;
              font-style: normal;
            }
            .projectStateBox{
              font-family: PingFangSC, PingFang SC;
              font-weight: 600;
              font-size: 14px;
              color: #FE7628;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              .stateIcon{
                width: 24px;
                height: 24px;
                margin-right: 4px;
              }
            }
          }
          .warningRow{
            display: flex;
            align-items: center;
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: #0B3680;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            padding: 9px 12px;
            background: #E9F1FE;
            border-radius: 4px;
            border: 1px solid #86B4FD;
            .waringLight{
              width: 24px;
              height: 24px;
              margin-right: 4px;
            }
          }
          .questionBox{
            width: 20px;
            height: 20px;
            cursor: pointer;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-left: 9px;
            .questionIcon{
              width: 20px;
              height: 20px;
            }
            .questionContent{
              display: none;
            }
          }
          .questionBox:hover{
            .questionContent{
              display: block;
              position: absolute;
              background: rgb(255, 255, 255);
              padding: 15px;
              border-radius: 8px;
              max-width: 600px;
              left: 0;
              top: 0;
              z-index: 97;
              white-space: nowrap;
              box-shadow: rgba(0, 0, 0, 0.05) 0px 9px 28px 8px, rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px -4px;
            }
          }
        }
      }
    }
    .operateBox{
      margin-top: 24px;
      .operateTitle{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 8px;
        .operateLeft{
          display: flex;
          align-items: center;
          .operateIcon{
            width: 24px;
            height: 24px;
            margin-right: 6px;
          }
          .titleName{
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 14px;
            color: #183362;
            line-height: 24px;
            text-align: left;
            font-style: normal;
            
          }
        }
        .operateRight{
          .showAll{
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: #1890FF;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            padding: 5px 16px;
            background: #fff;
            border-radius: 2px;
            border: 1px solid rgba(0,0,0,0.15);
            cursor: pointer;
          }
        }
      }
      .warningRow{
        display: flex;
        align-items: center;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 14px;
        color: #0B3680;
        line-height: 22px;
        text-align: left;
        font-style: normal;
        padding: 9px 12px;
        background: #E9F1FE;
        border-radius: 4px;
        border: 1px solid #86B4FD;
        .waringLight{
          width: 24px;
          height: 24px;
          margin-right: 4px;
        }
      }
      .questionBox{
        width: 20px;
        height: 20px;
        cursor: pointer;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 9px;
        .questionIcon{
          width: 20px;
          height: 20px;
        }
        .questionContent{
          display: none;
        }
      }
      .questionBox:hover{
        .questionContent{
          display: block;
          position: absolute;
          background: rgb(255, 255, 255);
          padding: 15px;
          border-radius: 8px;
          max-width: 600px;
          left: 0;
          top: 0;
          z-index: 97;
          white-space: nowrap;
          box-shadow: rgba(0, 0, 0, 0.05) 0px 9px 28px 8px, rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px -4px;
        }
      }
      .operateItem{
        margin-bottom: 16px;
        .warningTypeBox{
          display: flex;
          align-items: flex-start;
          justify-content: space-between;
          width: 100%;
          // height: 69px;
          padding: 0 0 8px;
          border-bottom: 2px solid #EBEDF5;
          margin-bottom: 16px;
          .warningIconBox{
            width: 44px;
            height: 44px;
            border-radius: 6px;
            overflow: hidden;
            margin-right: 12px;
            .warningTypeIcon{
              width: 100%;
              height: 100%;
            }
          }
          .warningTextBox{
            .typeText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 500;
              font-size: 14px;
              color: #FE7628;
              line-height: 20px;
              text-align: left;
              font-style: normal;
              padding: 1px 6px;
              background: #FFFFFF;
              border-radius: 2px;
            }
            .typeDesc{
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: rgba(0,0,0,0.65);
              line-height: 22px;
              text-align: left;
              font-style: normal;
              margin-left: 12px;
            }
          }
          .warningRow{
            display: flex;
            align-items: center;
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: #0B3680;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            padding: 9px 12px;
            background: #E9F1FE;
            border-radius: 4px;
            border: 1px solid #86B4FD;
            .waringLight{
              width: 24px;
              height: 24px;
              margin-right: 4px;
            }
          }
          .questionBox{
            width: 20px;
            height: 20px;
            cursor: pointer;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-left: 9px;
            .questionIcon{
              width: 20px;
              height: 20px;
            }
            .questionContent{
              display: none;
            }
          }
          .questionBox:hover{
            .questionContent{
              display: block;
              position: absolute;
              background: rgb(255, 255, 255);
              padding: 15px;
              border-radius: 8px;
              max-width: 600px;
              left: 0;
              top: 0;
              z-index: 97;
              white-space: nowrap;
              box-shadow: rgba(0, 0, 0, 0.05) 0px 9px 28px 8px, rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px -4px;
            }
          }
        }

        .operateIndex{
          display: inline-block;
          font-family: PingFangSC, PingFang SC;
          font-weight: 500;
          font-size: 14px;
          color: #1A5D2B;
          line-height: 22px;
          text-align: center;
          font-style: normal;
          background: #E1F3E6;
          padding: 2px 8px;
          border-radius: 2px;
          margin-bottom: 8px;
          .textRowBox{
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: rgba(0,0,0,0.85);
            line-height: 22px;
            text-align: left;
            font-style: normal;
            flex-wrap: wrap;
            display: flex;
            align-items: center;
            margin-bottom: 8px;
            .dateIcon{
              margin-left: 4px;
              width: 16px;
              height: 16px;
              margin-right: 6px;
            }
            .timeText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 600;
              font-size: 14px;
              color: #2F6DFF;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              cursor: pointer;
            }
            .bigNumber{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 14px;
              color: #243F6E;
              line-height: 28px;
              text-align: left;
              font-style: normal;
            }
            .smallNumber{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 14px;
              color: #243F6E;
              line-height: 28px;
              text-align: left;
              font-style: normal;
            }
            .unit{
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: #788395;
              line-height: 22px;
              text-align: left;
              font-style: normal;
            }
            .orangeText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 600;
              font-size: 14px;
              color: #FE7628;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              margin: 0 4px;
            }
            .yellowText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: #571519;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              padding: 1px 8px;
              background: #FCF1D3;
              border-radius: 2px;
            }
            .sortText{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 14px;
              color: #2F6DFF;
              line-height: 28px;
              text-align: left;
              font-style: normal;
              margin-left: 8px;
              margin-right: 2px;
            }
            .blueText{
              font-family: PingFangSC, PingFang SC;
              font-weight: 500;
              font-size: 14px;
              color: #243F6E;
              line-height: 22px;
              text-align: left;
              font-style: normal;
            }
            .blueText2{
              font-family: DINAlternate, DINAlternate;
              font-weight: bold;
              font-size: 14px;
              color: #243F6E;
              line-height: 28px;
              text-align: left;
              font-style: normal;
            }
            .projectStateBox{
              font-family: PingFangSC, PingFang SC;
              font-weight: 600;
              font-size: 14px;
              color: #FE7628;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              .stateIcon{
                width: 24px;
                height: 24px;
                margin-right: 4px;
              }
            }
          }
        }
        .orangeText{
          font-family: PingFangSC, PingFang SC;
          font-weight: 600;
          font-size: 14px;
          color: #FE7628;
          line-height: 22px;
          text-align: left;
          font-style: normal;
          margin: 0 4px;
        }
        .textRowBox{
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          font-size: 14px;
          color: rgba(0,0,0,0.85);
          line-height: 22px;
          text-align: left;
          font-style: normal;
          flex-wrap: wrap;
          display: flex;
          align-items: center;
          margin-bottom: 8px;
          .dateIcon{
            margin-left: 4px;
            width: 16px;
            height: 16px;
            margin-right: 6px;
          }
          .timeText{
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 14px;
            color: #2F6DFF;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            cursor: pointer;
          }
          .bigNumber{
            font-family: DINAlternate, DINAlternate;
            font-weight: bold;
            font-size: 14px;
            color: #243F6E;
            line-height: 28px;
            text-align: left;
            font-style: normal;
          }
          .smallNumber{
            font-family: DINAlternate, DINAlternate;
            font-weight: bold;
            font-size: 14px;
            color: #243F6E;
            line-height: 28px;
            text-align: left;
            font-style: normal;
          }
          .unit{
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: #788395;
            line-height: 22px;
            text-align: left;
            font-style: normal;
          }
          .orangeText{
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 14px;
            color: #FE7628;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            margin: 0 4px;
          }
          .yellowText{
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: #571519;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            padding: 1px 8px;
            background: #FCF1D3;
            border-radius: 2px;
          }
          .sortText{
            font-family: DINAlternate, DINAlternate;
            font-weight: bold;
            font-size: 14px;
            color: #2F6DFF;
            line-height: 28px;
            text-align: left;
            font-style: normal;
            margin-left: 8px;
            margin-right: 2px;
          }
          .blueText{
            font-family: PingFangSC, PingFang SC;
            font-weight: 500;
            font-size: 14px;
            color: #243F6E;
            line-height: 22px;
            text-align: left;
            font-style: normal;
          }
          .blueText2{
            font-family: DINAlternate, DINAlternate;
            font-weight: bold;
            font-size: 14px;
            color: #243F6E;
            line-height: 28px;
            text-align: left;
            font-style: normal;
          }
          .projectStateBox{
            font-family: PingFangSC, PingFang SC;
            font-weight: 600;
            font-size: 14px;
            color: #FE7628;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            .stateIcon{
              width: 24px;
              height: 24px;
              margin-right: 4px;
            }
          }
        }
        .warningRow{
          display: flex;
          align-items: center;
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          font-size: 14px;
          color: #0B3680;
          line-height: 22px;
          text-align: left;
          font-style: normal;
          padding: 9px 12px;
          background: #E9F1FE;
          border-radius: 4px;
          border: 1px solid #86B4FD;
          .waringLight{
            width: 24px;
            height: 24px;
            margin-right: 4px;
          }
        }
        .questionBox{
          width: 20px;
          height: 20px;
          cursor: pointer;
          position: relative;
          display: flex;
          align-items: center;
          justify-content: center;
          margin-left: 9px;
          .questionIcon{
            width: 20px;
            height: 20px;
          }
          .questionContent{
            display: none;
          }
        }
        .questionBox:hover{
          .questionContent{
            display: block;
            position: absolute;
            background: rgb(255, 255, 255);
            padding: 15px;
            border-radius: 8px;
            max-width: 600px;
            left: 0;
            top: 0;
            z-index: 97;
            white-space: nowrap;
            box-shadow: rgba(0, 0, 0, 0.05) 0px 9px 28px 8px, rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px -4px;
          }
        }
        .operateRight{
          .showAll{
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: #1890FF;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            padding: 5px 16px;
            background: #fff;
            border-radius: 2px;
            border: 1px solid rgba(0,0,0,0.15);
            cursor: pointer;
          }
        }
      }
      .contentBoxs{
        .contentItem{
          .contentTitleBox{
            display: flex;
            align-items: center;
            margin-bottom: 8px;
            .titleIcon{
              width: 24px;
              height: 24px;
              margin-right: 6px;
            }
            .titleName{
              font-family: PingFangSC, PingFang SC;
              font-weight: 600;
              font-size: 14px;
              color: #183362;
              line-height: 24px;
              text-align: left;
              font-style: normal;
            }
          }
          .contentDetail{
            .detailTop{
              position: relative;
              margin-left: 10px;
              margin-bottom: 8px;
              .yellowBgText{
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                font-size: 14px;
                color: #571519;
                line-height: 22px;
                text-align: left;
                font-style: normal;
                padding: 1px 8px;
                background: #FCF1D3;
                border-radius: 2px;
                margin: 0 8px;
              }
              .YDBox{
                display: flex;
                align-items: center;
                margin: 0 4px;
                .YDIcon{
                  width: 24px;
                  height: 24px;
                  margin-right: 2px;
                }
              }
              .warningRow{
                display: flex;
                align-items: center;
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                font-size: 14px;
                color: #0B3680;
                line-height: 22px;
                text-align: left;
                font-style: normal;
                padding: 9px 12px;
                background: #E9F1FE;
                border-radius: 4px;
                border: 1px solid #86B4FD;
                .waringLight{
                  width: 24px;
                  height: 24px;
                  margin-right: 4px;
                }
              }
            }
            .detailTop:before{
              position: absolute;
              content:'';
              left: -10px;
              top: 50%;
              transform: translateY(-50%);
              width: 4px;
              height: 14px;
              background: linear-gradient( 180deg, #3CB2FE 0%, #0F88FB 100%);
            }
            .textRowBox{
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: rgba(0,0,0,0.85);
              line-height: 22px;
              text-align: left;
              font-style: normal;
              flex-wrap: wrap;
              display: flex;
              align-items: center;
              margin-bottom: 8px;
              .dateIcon{
                margin-left: 4px;
                width: 16px;
                height: 16px;
                margin-right: 6px;
              }
              .timeText{
                font-family: PingFangSC, PingFang SC;
                font-weight: 600;
                font-size: 14px;
                color: #2F6DFF;
                line-height: 22px;
                text-align: left;
                font-style: normal;
                cursor: pointer;
              }
              .bigNumber{
                font-family: DINAlternate, DINAlternate;
                font-weight: bold;
                font-size: 14px;
                color: #243F6E;
                line-height: 28px;
                text-align: left;
                font-style: normal;
              }
              .smallNumber{
                font-family: DINAlternate, DINAlternate;
                font-weight: bold;
                font-size: 14px;
                color: #243F6E;
                line-height: 28px;
                text-align: left;
                font-style: normal;
              }
              .unit{
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                font-size: 14px;
                color: #788395;
                line-height: 22px;
                text-align: left;
                font-style: normal;
              }
              .orangeText{
                font-family: PingFangSC, PingFang SC;
                font-weight: 600;
                font-size: 14px;
                color: #FE7628;
                line-height: 22px;
                text-align: left;
                font-style: normal;
                margin: 0 4px;
              }
              .yellowText{
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                font-size: 14px;
                color: #571519;
                line-height: 22px;
                text-align: left;
                font-style: normal;
                padding: 1px 8px;
                background: #FCF1D3;
                border-radius: 2px;
              }
              .sortText{
                font-family: DINAlternate, DINAlternate;
                font-weight: bold;
                font-size: 14px;
                color: #2F6DFF;
                line-height: 28px;
                text-align: left;
                font-style: normal;
                margin-left: 8px;
                margin-right: 2px;
              }
              .blueText{
                font-family: PingFangSC, PingFang SC;
                font-weight: 500;
                font-size: 14px;
                color: #243F6E;
                line-height: 22px;
                text-align: left;
                font-style: normal;
              }
              .blueText2{
                font-family: DINAlternate, DINAlternate;
                font-weight: bold;
                font-size: 14px;
                color: #243F6E;
                line-height: 28px;
                text-align: left;
                font-style: normal;
              }
              .projectStateBox{
                font-family: PingFangSC, PingFang SC;
                font-weight: 600;
                font-size: 14px;
                color: #FE7628;
                line-height: 22px;
                text-align: left;
                font-style: normal;
                .stateIcon{
                  width: 24px;
                  height: 24px;
                  margin-right: 4px;
                }
              }
            }
            .warningRow{
              display: flex;
              align-items: center;
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 14px;
              color: #0B3680;
              line-height: 22px;
              text-align: left;
              font-style: normal;
              padding: 9px 12px;
              background: #E9F1FE;
              border-radius: 4px;
              border: 1px solid #86B4FD;
              .waringLight{
                width: 24px;
                height: 24px;
                margin-right: 4px;
              }
            }
            .questionBox{
              width: 20px;
              height: 20px;
              cursor: pointer;
              position: relative;
              display: flex;
              align-items: center;
              justify-content: center;
              margin-left: 9px;
              .questionIcon{
                width: 20px;
                height: 20px;
              }
              .questionContent{
                display: none;
              }
            }
            .questionBox:hover{
              .questionContent{
                display: block;
                position: absolute;
                background: rgb(255, 255, 255);
                padding: 15px;
                border-radius: 8px;
                max-width: 600px;
                left: 0;
                top: 0;
                z-index: 97;
                white-space: nowrap;
                box-shadow: rgba(0, 0, 0, 0.05) 0px 9px 28px 8px, rgba(0, 0, 0, 0.08) 0px 6px 16px 0px, rgba(0, 0, 0, 0.12) 0px 3px 6px -4px;
              }
            }
          }
        }
      }
      .overTime{
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 14px;
        color: #571519;
        line-height: 22px;
        text-align: left;
        font-style: normal;
        padding: 1px 8px;
        background: #FCF1D3;
        border-radius: 2px;
        display: inline-block;
      }
    }
  }
}
