.layout {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
}

.layout.wide {
  padding-right: 350px;
}

.layout > div {
  position: relative;
  height: 100%;
}

.address {
  width: 1085px;
  height: 851px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}


.address > a {
  position: absolute;
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  text-decoration: none;
  pointer-events: none;
}

.address > a > span {
  width: 26px;
  height: 26px;
  text-align: center;
  line-height: 26px;
  background-color: #fa3800;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  margin-left: 8px;
  font-size: 16px;
}

.yf {
  left: 7%;
  top: 40%;
}

.bs {
  left: 25%;
  top: 29%;
}

.sc {
  top: 42.5%;
  left: 24%;
}

.jf {
  top: 48%;
  left: 20%;
}

.nz {
  top: 60%;
  left: 5%;
}

.ht {
  top: 70%;
  left: 17%;
}

.gt {
  top: 57%;
  left: 22%;
}

.xc {
  top: 48.5%;
  left: 33.5%;
}

.nt {
  top: 69%;
  left: 34%;
}

.js {
  left: 45%;
  top: 82%;
}

.da {
  left: 45%;
  top: 53.5%;
}

.tj {
  left: 51%;
  top: 69%;
}

.tl {
  top: 61.3%;
  left: 56%;
}

.hh {
  top: 60%;
  left: 67%;
}

.qa {
  top: 20%;
  left: 75%;
}

.yx {
  top: 94%;
  left: 58%;
}



.map-item {
  position: absolute;
  background-color: rgba(0,0,0,0.1);
  opacity: 0.8
}

.map-yf {
  left: 0;
  top: 21%;
  width: 21%;
}

.map-bs {
  top: 20.3%;
  left: 15.3%;
  width: 30.5%;
}

.map-nz {
  left: 1.5%;
  width: 17.5%;
  top: 47.5%;
}

@media screen and (max-width: 1400px){
  .address {
    width: 900px;
    height: 650px;
  }
  .nz {
    top: 60%;
    left: 10%;
  }
  .yx {
    top: 90%;
    left: 57%;
  }
  .hh{
    top:57%;
    left: 64%;
  }
}
