/* 1.map */
.map-box {
  width: 100%;
  height: 100vh;
  background-image: -webkit-radial-gradient(
    50% 50%,
    circle closest-side,
    rgb(255, 255, 255) 0%,
    rgb(205, 205, 205) 99%
  );
  overflow: hidden;
}

.map-container {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.map-sub {
  width: 100%;
  height: auto;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -250px;
  font-size: 474px;
  color: #dbdbdb;
  line-height: 500px;
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
  opacity: 0.25;
  z-index: 5;
  white-space: nowrap;
}

.map-more {
  position: relative;
  z-index: 20;
  margin-bottom: 50px;
}

.map-img {
  display: none;
}

@media (max-width: 1400px) {
  .map-more {
    margin-bottom: 90px;
  }
}

@media (max-width: 1000px) {
  .map-section {
    height: 160px;
    background: #e6e6e7;
  }

  .map-box {
    height: 100%;
  }

  .map-sub {
    display: none;
  }

  .map-img {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
  }

  .map-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 5;
  }

  .map-box .skell-empty {
    display: none;
  }

  .map-more {
    margin-bottom: 0;
  }
}

/* 2.mapwrap */
.mapwrap {
  width: 1632px;
  height: 693px;
  position: relative;
  overflow: hidden;
  z-index: 25;
}

.mapwrap .img {
  width: 100%;
  height: 100%;
}

.mapwrap .img img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.map-list {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 30;
}

.map-list li {
  position: absolute;
  cursor: pointer;
}

.map-list li .ico {
  display: inline-block;
  width: 14px;
  height: auto;
  cursor: pointer;
}

.map-list li .ico img {
  width: 100%;
  height: auto;
  cursor: pointer;
}

.map-list li.li0 {
  left: 1254px;
  top: 240px;
}

.map-list li.li1 {
  left: 1395px;
  top: 216px;
}

.map-list li.li2 {
  left: 1348px;
  top: 212px;
}

.map-list li.li3 {
  left: 1232px;
  top: 315px;
}

.map-list li.li4 {
  left: 1128px;
  top: 298px;
}

.map-list li.li5 {
  left: 1251px;
  top: 85px;
}

.map-list li.li6 {
  left: 823px;
  top: 144px;
}

.map-list li.li7 {
  left: 772px;
  top: 129px;
}

.map-list li.li8 {
  left: 796px;
  top: 166px;
}

.map-list li.li9 {
  left: 315px;
  top: 118px;
}

.map-list li.li10 {
  left: 330px;
  top: 192px;
}

.map-list li.li11 {
  left: 1385px;
  top: 525px;
}

.map-list li.li12 {
  left: 1540px;
  top: 609px;
}

.map-list li.li13 {
  left: 1315px;
  top: 405px;
}

.map-list li.li14 {
  left: 1094px;
  top: 160px;
}

.map-list li.li15 {
  left: 985px;
  top: 283px;
}

.map-list li.li16 {
  left: 901px;
  top: 78px;
}

.map-list li.li17 {
  left: 848px;
  top: 88px;
}

.map-list li.li18 {
  left: 869px;
  top: 135px;
}

.map-list li.li19 {
  left: 805px;
  top: 136px;
}

.map-list li.li20 {
  left: 818px;
  top: 161px;
}

.map-list li.li21 {
  left: 889px;
  top: 549px;
}

.map-list li.li22 {
  left: 488px;
  top: 588px;
}

.map-list li.li23 {
  left: 333px;
  top: 288px;
}

.map-list li.li24 {
  left: 554px;
  top: 463px;
}

.map-list li.li25 {
  left: 1241px;
  top: 387px;
}

.map-list li.li26 {
  left: 1234px;
  top: 375px;
}

.map-list li.li27 {
  left: 1260px;
  top: 336px;
}

.map-list li.li28 {
  left: 995px;
  top: 348px;
}

.map-list li.li29 {
  left: 851px;
  top: 149px;
}

.map-list li .hover {
  position: absolute;
  bottom: 56px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  padding: 14px 19px 7px;
  background: #ffffff;
  border: 1px solid #e62129;
  border-radius: 10px;
  text-align: center;
  display: none;
  z-index: 5;
}

.map-list li .hover .nFlag {
  width: 40px;
}

.map-list li .hover p {
  font-size: 18px;
  line-height: 29px;
  color: #1d1d1d;
  white-space: nowrap;
}

.map-list li .hover:before {
  content: "";
  width: 26px;
  height: 11px;
  position: absolute;
  left: 50%;
  margin-left: -13px;
  bottom: -11px;
  background: url(/images/sheng/atlas/map-row.png) no-repeat center/cover;
}

.map-list li.on .ico {
  top: 0px;
  animation: letter 0.6s cubic-bezier(0.1, 0.5, 0.2, 1) infinite alternate;
}

@keyframes letter {
  from {
    -webkit-transform: translateY(-6px);
  }

  to {
    -webkit-transform: translateY(-20px);
  }
}

@media (max-width: 1700px) {
  .mapwrap {
    -webkit-transform: scale(0.8) translateX(0);
    -moz-transform: scale(0.8) translateX(0);
    -ms-transform: scale(0.8) translateX(0);
    transform: scale(0.8) translateX(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
}

@media (max-width: 1400px) {
  .mapwrap {
    -webkit-transform: scale(0.65) translateX(0);
    -moz-transform: scale(0.65) translateX(0);
    -ms-transform: scale(0.65) translateX(0);
    transform: scale(0.65) translateX(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
}

@media (max-width: 1000px) {
  .mapwrap {
    display: none;
  }
}

/* 3.network */
.network-box {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.network-tit {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  font-weight: bold;
}

.network-tit span:first-child {
  margin-right: 30px;
}

.network-tit img {
  margin-right: 10px;
}

.network-tit .Agents img {
  -webkit-transform: scale(0.6);
  transform: scale(0.6);
}

.network-tit .Branches img {
  -webkit-transform: scale(1);
  transform: scale(1);
}

@media (max-width: 1000px) {
  .network-tit {
    display: none;
  }
}

.network {
  width: 1632px;
  height: 693px;
  position: relative;
  margin:0 auto;
}

.network .img {
  width: 100%;
  height: 100%;
}

.network .img img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.netlist {
  width: 100%;
  height: 100%;
}

.netlist .Cont_ico {
  cursor: pointer;
  position: absolute;
  z-index: 2;
}

.netlist .Agents img {
  -webkit-transform: scale(0.6);
  transform: scale(0.6);
}

.netlist .Branches img {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.netlist .Cont_ico .hide {
  display: none;
  font-size: 16px;
  line-height: 28px;
  position: absolute;
  background: #fff;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  padding: 20px;
  left: -270px;
  width: 530px;
  bottom: 30px;
  text-align: left;
  z-index: 30;
}

.netlist .Cont_ico:hover .hide {
  display: block;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  -ms-transition: all 0.5s;
  transition: all 0.5s;
}

.netlist .Cont_ico .hide h6 {
  font-size: 18px;
  font-weight: bold;
  padding-bottom: 13px;
  color: #e60012;
}

.netlist .Cont_ico.Cont_ico1 {
  left: 25.2%;
  top: 162px;
}

.netlist .Cont_ico.Cont_ico2 {
  left: 15%;
  top: 210px;
}

.netlist .Cont_ico.Cont_ico3 {
  left: 19%;
  top: 290px;
}

.netlist .Cont_ico.Cont_ico4 {
  left: 33%;
  top: 450px;
}

.netlist .Cont_ico.Cont_ico5 {
  left: 29%;
  top: 550px;
}

.netlist .Cont_ico.Cont_ico6 {
  left: 45%;
  top: 200px;
}

.netlist .Cont_ico.Cont_ico7 {
  left: 46.5%;
  top: 168px;
}

.netlist .Cont_ico.Cont_ico8 {
  left: 48.5%;
  top: 147px;
}

.netlist .Cont_ico.Cont_ico9 {
  left: 49.5%;
  top: 164px;
}

.netlist .Cont_ico.Cont_ico10 {
  left: 50.7%;
  top: 141px;
}

.netlist .Cont_ico.Cont_ico11 {
  left: 51.8%;
  top: 119px;
}

.netlist .Cont_ico.Cont_ico12 {
  left: 53%;
  top: 175px;
}

.netlist .Cont_ico.Cont_ico13 {
  left: 53.5%;
  top: 152px;
}

.netlist .Cont_ico.Cont_ico14 {
  left: 54.5%;
  top: 204px;
}

.netlist .Cont_ico.Cont_ico15 {
  left: 54%;
  top: 276px;
}

.netlist .Cont_ico.Cont_ico16 {
  left: 52.3%;
  top: 553px;
}

.netlist .Cont_ico.Cont_ico17 {
  left: 61%;
  top: 97px;
}

.netlist .Cont_ico.Cont_ico18 {
  left: 60%;
  top: 280px;
}

.netlist .Cont_ico.Cont_ico19 {
  left: 66%;
  top: 266px;
}

.netlist .Cont_ico.Cont_ico20 {
  left: 72.2%;
  top: 319px;
}

.netlist .Cont_ico.Cont_ico21 {
  left: 74.2%;
  top: 236px;
}

.netlist .Cont_ico.Cont_ico22 {
  left: 74.5%;
  top: 325px;
}

.netlist .Cont_ico.Cont_ico23 {
  left: 72%;
  top: 362px;
}

.netlist .Cont_ico.Cont_ico24 {
  left: 73.5%;
  top: 395px;
}

.netlist .Cont_ico.Cont_ico25 {
  left: 75.8%;
  top: 441px;
}

.netlist .Cont_ico.Cont_ico26 {
  left: 79%;
  top: 217px;
}

.netlist .Cont_ico.Cont_ico27 {
  left: 82.5%;
  top: 218px;
}

.netlist .Cont_ico.Cont_ico28 {
  left: 77.5%;
  top: 330px;
}

.netlist .Cont_ico.Cont_ico29 {
  left: 81%;
  top: 522px;
}

@media (max-width: 1700px) {
  .network {
    -webkit-transform: scale(0.8) translateX(0);
    -moz-transform: scale(0.8) translateX(0);
    -ms-transform: scale(0.8) translateX(0);
    transform: scale(0.8) translateX(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
}

@media (max-width: 1400px) {
  .network {
    -webkit-transform: scale(0.65) translateX(0);
    -moz-transform: scale(0.65) translateX(0);
    -ms-transform: scale(0.65) translateX(0);
    transform: scale(0.65) translateX(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
}

@media (max-width: 1000px) {
  .network {
    width: 95%;
    height: auto;
    transform: scale(1) translate(0, 0);
  }
  .network img {
    display: none;
  }
  .netlist {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
  }
  .netlist .Cont_ico {
    position: static;
    width: 100%;
    height: auto;
  }
  .netlist .Cont_ico span {
    display: none;
  }
  .netlist .Cont_ico .hide {
    width: 100%;
    display: block;
    position: static;
    box-sizing: border-box;
    font-size: 14px;
    padding: 15px 20px;
  }
  .netlist .Cont_ico .hide h6 {
    font-size: 16px;
    padding-bottom: 0;
  }
  .netlist .Cont_ico:nth-child(n + 2) {
    margin-top: 15px;
  }
}