.contact {
  width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
}
.contact .content {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.contact .content .contact-list {
  display: flex;
  width: max-content;
  margin: auto;
  justify-content: center;
  margin-top: 24.8%;
}
.contact .content .contact-list .item .a {
  display: block;
  width: 9.3vw;
  padding: 0 1.6vw;
}
.contact .content .contact-list .item .a .pic {
  width: 70%;
  margin: auto;
}
.contact .content .contact-list .item .a .name {
  font-size: 2.4rem;
  margin: auto;
  text-align: center;
  max-width: 80%;
  line-height: 1.4;
}
@media all and (max-width: 768px) {
  .contact .content {
    margin: 0 auto;
    max-width: 57.7%;
  }
  .contact .content .contact-list {
    flex-direction: column;
    justify-content: center;
    margin: 0 auto;
    row-gap: 2vh;
  }
  .contact .content .contact-list .item .a {
    display: flex;
    width: auto;
    align-items: center;
  }
  .contact .content .contact-list .item .a .pic {
    width: 20vw;
    flex-shrink: 0;
    margin: 0 0 0 0;
  }
  .contact .content .contact-list .item .a .name {
    margin-left: 23px;
    font-size: 4vw;
    letter-spacing: 0.2px;
    text-align: left;
  }
}