.mainbox {
  display: flex;
  padding: 0.25rem;
  padding-top: 0.15rem;
}
.mainbox .column {
  width: 6.9679rem;
}
.mainbox .centerbox {
  width: 16.4375rem;
  padding-right: 0.25rem;
}
.mainbox .column .mainbox,
.mainbox .centerbox .mainbox {
  padding: 0;
}
.mainbox .column .mainbox .column,
.mainbox .centerbox .mainbox .column {
  width: 7.9999rem;
  margin-right: 0.25rem;
}
.mainbox .column .mainbox .column:last-child,
.mainbox .centerbox .mainbox .column:last-child {
  margin-right: 0;
}
.mainbox .column .panel,
.mainbox .centerbox .panel {
  background-color: #0b2c47;
  margin-bottom: 0.25rem;
  padding-top: 0.125rem;
}
.mainbox .column .panel:last-child,
.mainbox .centerbox .panel:last-child {
  margin-bottom: 0;
}
.mainbox .column .panel .panel-title,
.mainbox .centerbox .panel .panel-title {
  margin-right: 0.25rem;
  margin-left: 0.125rem;
  height: 0.5rem;
  display: flex;
  align-items: center;
}
.mainbox .column .panel .panel-title .panel-title-icon01,
.mainbox .centerbox .panel .panel-title .panel-title-icon01 {
  width: 0.25rem;
  height: 0.25rem;
  margin-left: 0.125rem;
  margin-right: 0.125rem;
  background-image: url(../../img/index/panel-title-icon01.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.mainbox .column .panel .panel-title .panel-title-text,
.mainbox .centerbox .panel .panel-title .panel-title-text {
  color: #fff;
  font-size: 0.225rem;
  font-weight: normal;
  position: relative;
  top: 0.025rem;
}
.mainbox .column .panel .panel-title .panel-title-icon02,
.mainbox .centerbox .panel .panel-title .panel-title-icon02 {
  margin-left: auto;
  margin-right: 0.0625rem;
  width: 0.2rem;
  height: 0.1625rem;
  background-image: url(../../img/index/panel-title-icon02.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.mainbox .column .panel .panel-title .panel-title-select,
.mainbox .centerbox .panel .panel-title .panel-title-select {
  border: none;
  outline: none;
  height: 0.3125rem;
  background-color: #0b4879;
  font-size: 0.175rem;
  color: #fff;
  padding: 0 0.125rem;
}
.mainbox .column .panel.dynamic-monitoring .panel-content,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content {
  height: 5.125rem;
  position: relative;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper {
  position: absolute;
  top: -0.1875rem;
  right: 0;
  display: flex;
  justify-content: flex-end;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper .panel-content-search-item,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper .panel-content-search-item {
  width: 3.25rem;
  height: 0.375rem;
  position: relative;
  margin-right: 0.6875rem;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper .panel-content-search-item .panel-content-search-item-icon,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper .panel-content-search-item .panel-content-search-item-icon {
  width: 0.1625rem;
  height: 0.175rem;
  position: absolute;
  top: 0.1rem;
  left: 0.1625rem;
  background-image: url(../../img/dynamicMonitoring/dynamicMonitoring-search-icon.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper .panel-content-search-item .panel-content-search-item-input,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper .panel-content-search-item .panel-content-search-item-input {
  padding-left: 0.4375rem;
  padding-right: 0.1625rem;
  display: block;
  width: 3.25rem;
  height: 0.375rem;
  border-radius: 0.375rem;
  font-size: 0.175rem;
  color: #333;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper .panel-content-search-item .panel-content-search-item-input::placeholder,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-search-wrapper .panel-content-search-item .panel-content-search-item-input::placeholder {
  color: #7e7e7e;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 1.5rem;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper .panel-content-num-item,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper .panel-content-num-item {
  margin-right: 1.55rem;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper .panel-content-num-item:last-child,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper .panel-content-num-item:last-child {
  margin-right: 0;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper .panel-content-num-item .panel-content-num-item-title,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper .panel-content-num-item .panel-content-num-item-title {
  font-size: 0.225rem;
  color: #fff;
  margin-bottom: 0.225rem;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper .panel-content-num-item .panel-content-num-item-num,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-num-wrapper .panel-content-num-item .panel-content-num-item-num {
  font-size: 0.225rem;
  color: #fff;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper {
  height: 3.6453rem;
  margin: 0 0.35rem;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item {
  width: 3.625rem;
  height: 3.375rem;
  background-color: #fff;
  margin-right: 0.3125rem;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item:last-child,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item:last-child {
  margin-right: 0;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item .panel-content-monitoring-item-monitoring,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item .panel-content-monitoring-item-monitoring {
  width: 3.625rem;
  height: 2.4375rem;
  background-image: url(../../img/dynamicMonitoring/monitoring-test-bg.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item .panel-content-monitoring-item-title,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item .panel-content-monitoring-item-title {
  margin-left: 0.35rem;
  margin-right: 0.35rem;
  margin-top: 0.15rem;
  margin-bottom: 0.075rem;
  font-size: 0.1875rem;
  color: #1d73c5;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item .panel-content-monitoring-item-dsc,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .swiper-wrapper .swiper-slide .panel-content-monitoring-item .panel-content-monitoring-item-dsc {
  margin-left: 0.35rem;
  margin-right: 0.35rem;
  font-size: 0.1875rem;
  color: #666666;
  line-height: 1.3;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .panel-content-monitoring-pagination,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .panel-content-monitoring-pagination {
  bottom: 0.0625rem;
}
.mainbox .column .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .panel-content-monitoring-pagination .swiper-pagination-bullet,
.mainbox .centerbox .panel.dynamic-monitoring .panel-content .panel-content-monitoring-wrapper .panel-content-monitoring-pagination .swiper-pagination-bullet {
  width: 0.5rem;
  height: 0.0625rem;
  border-radius: 0.25rem;
  background-color: #eee;
}
.mainbox .column .panel.speciess-tatistics .panel-title .panel-title-select,
.mainbox .centerbox .panel.speciess-tatistics .panel-title .panel-title-select {
  height: 0.4rem;
  font-size: 0.1875rem;
  margin-left: auto;
  background-color: #163656;
}
.mainbox .column .panel.speciess-tatistics .panel-content,
.mainbox .centerbox .panel.speciess-tatistics .panel-content {
  height: 5.125rem;
}
.mainbox .column .panel.species-classification .panel-title .panel-title-select,
.mainbox .centerbox .panel.species-classification .panel-title .panel-title-select {
  height: 0.4rem;
  font-size: 0.1875rem;
  margin-left: auto;
  background-color: #163656;
}
.mainbox .column .panel.species-classification .panel-content,
.mainbox .centerbox .panel.species-classification .panel-content {
  height: 5.125rem;
  display: flex;
}
.mainbox .column .panel.species-classification .panel-content .panel-content-chart,
.mainbox .centerbox .panel.species-classification .panel-content .panel-content-chart {
  width: 3.9843rem;
  height: 5.125rem;
  position: relative;
}
.mainbox .column .panel.species-classification .panel-content .panel-content-chart::before,
.mainbox .centerbox .panel.species-classification .panel-content .panel-content-chart::before {
  content: '';
  display: block;
  width: 0.1125rem;
  height: 0.1125rem;
  border-radius: 50%;
  background-color: #098fcd;
  position: absolute;
  top: 6%;
  left: 10%;
}
.mainbox .column .panel.map .panel-content,
.mainbox .centerbox .panel.map .panel-content {
  height: 5.125rem;
}
.mainbox .column .panel.monitoring .panel-content,
.mainbox .centerbox .panel.monitoring .panel-content {
  height: 5.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mainbox .column .panel.monitoring .panel-content .panel-content-monitoring,
.mainbox .centerbox .panel.monitoring .panel-content .panel-content-monitoring {
  width: 2.525rem;
  height: 2.525rem;
}
