.box {
  display: flex;
  flex-direction: column;
  padding: 0.5rem;
}

.info {
  display: flex;
  flex-direction: column;
}

.info h3 {
  font-size: 1rem;
  padding: 1rem 0;
}

.info .span1 {
  color: #d18821;
}

.info .span2 {
  color: #555555;
}

.info .span3 {
  font-size: 0.6rem;
  color: #dddddd;
}

.wrap {
  display: flex;
  justify-content: space-between;
}

.company {
  display: flex;
  flex-direction: column;
  color: #666;
  font-size: 0.5rem;
}

.company .icon {
  width: 0.6rem;
  height: 0.6rem;
  margin-right: 0.2rem;
}

.item {
  margin-bottom: 0.5rem;
}

.code {
  width: 6rem;
  height: 6rem;
}

.map {
  width: 50%;
  height: 250px;
  border: 0.1rem solid #ddd;
}

.message {
  display: flex;
  flex-direction: column;
}

.message h3 {
  font-size: 1rem;
  padding: 1rem 0;
  text-align: center;
}

.message h3 .span1 {
  color: #555555;
}

.message h3 .span2 {
  color: #d18821;
}

.message .form {
  margin: 0 auto;
}
.message .form .item {
  display: flex;
}

.message .form .item div {
  width: 2rem;
  font-size: 0.5rem;
  color: #262626;
}
.message .form .item span {
  color: #ea5845;
}

.message .form .item input {
  border: 1px solid #dddddd;
  background-color: #fff;
  padding: 0.2rem;
  width: 10rem;
}

.message .form .item textarea {
  width: 10rem;
  border: 1px solid #dddddd;
  background-color: #fff;
  padding: 0.2rem;
  overflow: auto;
  vertical-align: top;
  resize: none;
  height: 100px;
}

.submit {
  width: 3rem;
  background-color: #d18821;
  color: #fff;
  padding: 0.2rem 0.5rem;
  text-align: center;
  border-radius: 0.1rem;
  cursor: pointer;
  margin: 0 auto;
  position: relative;
  left: 1rem;
}

/* 手机 */
@media (min-width: 0px) and (max-width: 767.98px) {
  .wrap {
    flex-direction: column;
  }
  .map {
    width: 100%;
  }
}
