@charset "UTF-8";
/**
 * 首页
 * date: 2024-4-2
 * author: fxyue;
 */
.banner {
  height: 462px;
  position: relative;
  overflow: hidden;
  padding-top: 105px;
  box-sizing: border-box;
}
.banner > video {
  position: absolute;
  z-index: -100;
  min-width: 100%;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
}
.banner-box {
  width: 396px;
  color: #fff;
  font-size: 16px;
}
.banner-info {
  height: 72px;
  overflow: hidden;
  line-height: 24px;
  margin: 14px 0;
  text-align: justify;
}
.banner-more {
  color: #fff;
}

.uplink {
  background: url("../images/uplink_bg.png") top center no-repeat;
  background-size: 100% 100%;
  padding: 80px 0;
}
.uplink-bd {
  margin-top: 40px;
  height: 427px;
}
.uplink-left {
  width: 579px;
}
.uplink-loc {
  height: 24px;
  line-height: 24px;
  padding-left: 28px;
  font-weight: bold;
  font-size: 16px;
  background: url("../images/loc_icon.png") left center no-repeat;
}
.uplink-all {
  height: 24px;
  line-height: 24px;
  cursor: pointer;
}
.uplink-city {
  display: none;
  height: 24px;
  line-height: 24px;
  margin-left: 24px;
  color: #224B7F;
  position: relative;
}
.uplink-city::before {
  content: "";
  position: absolute;
  left: -20px;
  width: 16px;
  height: 16px;
  top: 50%;
  transform: translateY(-50%);
  background: url("../images/loc_arr.png") no-repeat;
}
.uplink-map {
  margin-top: 6px;
  height: 398px;
  background: url("../images/map_bg.png") no-repeat;
  position: relative;
}
.uplink-map .map-chart {
  width: 100%;
  height: 100%;
}
.uplink-right {
  width: 588px;
  padding: 24px 0;
}
.uplink-box {
  width: calc(50% - 24px);
  padding: 24px;
  box-sizing: border-box;
  box-shadow: 0px 4px 19.6px 0px rgba(207, 225, 243, 0.58);
}
.uplink-box:nth-child(n+2) {
  margin-left: 24px;
}
.uplink-title {
  text-align: center;
  height: 28px;
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
}
.uplink-item {
  border-radius: 4px;
  padding: 11px;
  height: 85px;
  box-sizing: border-box;
  border: 1px solid #B8D6FF;
  box-shadow: 0px 4px 12.3px 0px rgba(211, 225, 246, 0.6);
  background: linear-gradient(180deg, #F7FAFF 0%, rgba(224, 232, 245, 0.76) 100%);
  margin-top: 16px;
  font-size: 16px;
}
.uplink-name {
  height: 25px;
  line-height: 25px;
  padding-left: 22px;
  margin-left: -4px;
  background: url("../images/share_list_icon.png") 0 5px no-repeat;
}
.uplink-num {
  height: 36px;
  line-height: 36px;
}
.uplink-num span {
  margin-right: 12px;
  color: #224B7F;
  font-size: 24px;
  font-weight: 700;
}

.share {
  background: #EAF1F7;
  padding: 80px 0;
}
.share-bd {
  margin-top: 32px;
  height: 434px;
}
.share-left {
  width: 131px;
  background: linear-gradient(180deg, rgba(234, 243, 255, 0.35) 0%, rgba(146, 184, 236, 0.18) 100%);
  height: 100%;
  position: relative;
  border-radius: 10px;
}
.share-left::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border-radius: 10px;
  border: 1px solid #D6E5F9;
}
.share-node {
  height: 50%;
  position: relative;
  font-size: 0;
  text-align: center;
  cursor: pointer;
}
.share-node:nth-child(1) > span {
  background-image: url("../images/share_node_icon1.png");
}
.share-node:nth-child(2) > span {
  background-image: url("../images/share_node_icon2.png");
}
.share-node.active {
  background-image: url("../images/share_node_bgh.png");
  color: #fff;
  font-weight: 700;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1);
}
.share-node > span {
  display: inline-block;
  vertical-align: middle;
  padding-top: 80px;
  line-height: 18px;
  font-size: 16px;
  background: top center no-repeat;
}
.share-node::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 0;
  height: 100%;
}
.share-right {
  margin-left: 24px;
  width: calc(100% - 131px - 24px);
}
.share-top {
  height: 62px;
  line-height: 62px;
  box-sizing: border-box;
  border-bottom: 1px solid #224B7F;
}
.share-sub {
  float: left;
  min-width: 212px;
  margin-right: 10px;
  padding-left: 60px;
  background: 12px 50% no-repeat;
  font-size: 20px;
  box-sizing: border-box;
  color: #666;
  cursor: pointer;
}
.share-sub:nth-child(1) {
  background-image: url("../images/share_sub_icon1.png");
}
.share-sub:nth-child(2) {
  background-image: url("../images/share_sub_icon2.png");
}
.share-sub:nth-child(3) {
  background-image: url("../images/share_sub_icon3.png");
}
.share-sub:nth-child(4) {
  background-image: url("../images/share_sub_icon4.png");
}
.share-sub.active {
  font-weight: 700;
  color: #224B7F;
}
.share-bottom {
  height: 372px;
  overflow: hidden;
}
.share-list {
  height: 62px;
  line-height: 62px;
  box-sizing: border-box;
  padding-left: 25px;
  border-bottom: 1px solid #DEE5EC;
  background: url("../images/share_list_icon.png") 2px 25px no-repeat;
}
.share-list:hover {
  background-color: #E8F1FF;
  border-bottom-color: #224B7F;
  color: #224B7F;
}
.share-list:hover .share-info {
  color: #224B7F;
}
.share-info {
  width: calc(100% - 100px);
  color: #000;
  font-size: 16px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.share-date {
  margin-right: 6px;
  color: rgba(0, 0, 0, 0.4);
}

.diamonds-item {
  position: absolute;
  top: 0;
  left: 0;
  width: 17px;
  height: 21px;
  background: url("../images/map_icon.png") no-repeat;
  animation: move 2.5s linear infinite;
  pointer-events: none;
}
.diamonds-item.active {
  background-image: url("../images/map_iconh.png");
}

.diamonds-item[data-name=武汉市] {
  left: 418px;
  top: 214px;
}

.diamonds-item[data-name=黄石市] {
  left: 463px;
  top: 281px;
}

.diamonds-item[data-name=十堰市] {
  left: 140px;
  top: 64px;
  animation-delay: 0.2s;
}

.diamonds-item[data-name=宜昌市] {
  left: 183px;
  top: 204px;
}

.diamonds-item[data-name=襄阳市] {
  left: 232px;
  top: 107px;
}

.diamonds-item[data-name=鄂州市] {
  left: 442px;
  top: 247px;
}

.diamonds-item[data-name=荆门市] {
  left: 285px;
  top: 178px;
}

.diamonds-item[data-name=孝感市] {
  left: 374px;
  top: 173px;
}

.diamonds-item[data-name=荆州市] {
  left: 271px;
  top: 279px;
}

.diamonds-item[data-name=黄冈市] {
  left: 487px;
  top: 219px;
}

.diamonds-item[data-name=咸宁市] {
  left: 409px;
  top: 305px;
}

.diamonds-item[data-name=随州市] {
  left: 343px;
  top: 120px;
}

.diamonds-item[data-name=恩施土家族苗族自治州] {
  left: 36px;
  top: 250px;
}

.diamonds-item[data-name=仙桃市] {
  left: 344px;
  top: 249px;
}

.diamonds-item[data-name=潜江市] {
  left: 282px;
  top: 246px;
}

.diamonds-item[data-name=天门市] {
  left: 320px;
  top: 216px;
}

.diamonds-item[data-name=神农架林区] {
  left: 104px;
  top: 136px;
}

@keyframes move {
  0% {
    transform: translateY(-2px);
  }
  50% {
    transform: translateY(2px);
  }
  100% {
    transform: translateY(-2px);
  }
}