.page {
  padding: 20px 25px;

  :global {
    .ant-carousel .slick-list .slick-slide {
      text-align: center;
      color: #fff;
      justify-content: center;
      line-height: 30vw;
      font-size: 24px;
    }

    .ant-table-header .ant-table-hide-scrollbar {
      min-width: 0;
    }

    .ant-table-fixed-header .ant-table-scroll .ant-table-header::-webkit-scrollbar {
      border: 0;
    }

    .ant-table-header::-webkit-scrollbar-thumb {
      background-color: transparent;
    }

    // body ::-webkit-scrollbar {
    //   width: 0;
    //   background-color: transparent;
    // }
  }
}

.list {
  height: 50%;
  overflow: auto;
}

.listItem {
  display: block !important;
  padding: 12px !important;
  // text-align: center;
  margin-bottom: 5px;
  color: #fff;
  font-size: 20px;
  border-bottom: 1px solid rgba(153, 231, 255, 0.4);
}

.title {
  text-align: center;
  font-size: 32px;
  letter-spacing: 10px;
  color: #c2e6ff;
  width: 100%;
  background-size: 100% 100%;
}

.searchBtn {
  padding: 10px 0 !important;
}

// .searchItem {
//   padding: 10px 0 !important;
// }

.select {
  background: #5f696e;
}

.areaBtn {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.area {
  width: 27vw;
  height: 27vw;
  margin-top: 50px;
  // border: solid #fff 2px;
  border: 0;
  border-radius: 20px;
  background-size: 100% 100%;
}

.selectedArea {
  width: 27vw;
  height: 27vw;
  margin-top: 50px;
  // border: solid #fff 2px;
  border: 0;
  border-radius: 10px;
  // background: #5f696e;
  background-size: 100% 100%;
}

.nameBackground {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  background-size: 100% 100%;
}

.areaName {
  color: #fff;
  font-size: 24px;
  margin-bottom: 20px;
  letter-spacing: 5px;
}

.back {
  position: fixed;
}

.detail {
  position: fixed;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 30vw;
  margin-top: 70px;
  margin-right: 20px;
}

.detailBlock {
  display: flex;
  align-items: center;
  width: 30vw;
  height: 30vw;
  border: solid #99e7ff 2px;
  border-radius: 10px;
  margin-bottom: 20px;
  position: relative;
}
.message {
  width: 100%;
  height: 36px;
  line-height: 36px;
  padding-left: 21px;
  background: linear-gradient(270deg, #99e7ff 0%, #60a8ff 100%);
}

.messageText {
  display: flex;
  flex-wrap: wrap;
}

.DataBlock {
  border: solid #99e7ff 2px;
  border-radius: 10px;
  margin-bottom: 20px;
  color: #fff;

  .DataItem {
    padding: 0 20px;
    font-size: 20px;
    color: '#fff';
    width: 100%;
  }

  .DataTitle {
    font-size: 24px;
    padding: 20px 0 10px;
    border-bottom: 1px solid rgba(232, 232, 232, 0.6);
  }

  .DataRowItem {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 10px;
    // width: 50%;
    // padding: 10px 35px;
  }

  .DataItemLeft {
    width: 70%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #d7e4e8;
  }
}

.descriptions {
  margin-left: 35vw;
}

.carousel {
  width: calc(30vw - 4px);
  height: 30vw;

  :global img {
    max-height: 28vw;
    object-fit: contain;
  }
}

.prev {
  width: 22px;
  height: 129px;
  color: #fff;
  position: absolute;
  z-index: 999;
  left: 0;
  background: url('@/assets/LimitedSpace/arrow-left.png') no-repeat center;
  background-size: 100% 100%;
}

.next {
  width: 22px;
  height: 129px;
  color: #fff;
  position: absolute;
  z-index: 999;
  right: 0;
  background: url('@/assets/LimitedSpace/arrow-right.png') no-repeat center;
  background-size: 100% 100%;
}

.selectModal {
  // .selectBlock {
  //   height: 94px;
  // }

  :global {
    .ant-input-number {
      width: 100%;
      border: 0;
      border-radius: 0;
    }

    .ant-tabs-tab {
      width: 14.5vw;
      text-align: center;
      overflow: hidden;
      text-overflow: ellipsis;
      margin-right: 5% !important;

      &:last-child {
        margin-right: 0 !important;
      }
    }
  }
}

.operationDetail {
  padding: 10px 20px 0px;
}
.opDetailBlock {
  padding: 20px 0px;
  border-bottom: 1px solid #99e7ff;
  &:last-child{
    padding-bottom: 0px;
    border: 0px;
  }
}
.opPicBlock {
  padding: 20px 0px;
  border-bottom: 1px solid #99e7ff;
  display: flex;
  justify-content: space-between;
}
.opPicDes {
  padding-right: 40px;
}
.opTitle {
  font-size: 20px;
  color: #c0f0ff;
  line-height: 23px;
  letter-spacing: 2px;
}
.opContent {
  font-size: 18px;
  color: #d8e4e8;
  line-height: 20px;
  letter-spacing: 2px;
  padding-top: 24px;
}
.opPic {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-right: 20px;
  img{
    max-width: 300px;
    max-height: 300px;
    margin-bottom: 20px;
    &:last-child{
      margin-bottom: 0px;
    }
  }
}
