body {
  background-color: #f5f5f5;
}

.container {
  position: relative;
  margin: 1.57rem 1.3rem;
}

.container .title {
  width: 6.32rem;
  height: 1.22rem;
}

.container .title span {
  display: block;
}

.container .title span:first-child {
  font-size: .56rem;
  font-weight: 700;
  color: rgba(51, 51, 51, 1);
  font-family: 'HarmonyOS Sans SC';
  margin-bottom: .2rem;
}

.container .title span:last-child {
  font-size: .2rem;
  line-height: .36rem;
  font-weight: 400;
  color: rgba(102, 102, 102, 1);
  font-family: 'HarmonyOS Sans SC';
}

.container .content {
  display: flex;
  gap: .6rem;
  margin-top: .6rem;
}

.container .content .info {
  background: rgba(255, 255, 255, 1);
  padding: .5rem .45rem;
  width: 4.9rem;
}

.container .content .info .contact-address {
    margin-bottom: .32rem;
}

.container .content .info .contact-address .contact-address-label {
  color: #333;
  font-weight: 400;
  opacity: .6;
  margin-bottom: .16rem;
}

.container .content .info .contact-address .contact-address-select {
  /*width: 4.9rem;*/
  height: .48rem;
  border: 0.01rem solid #DFDFDF;
  position: relative;
}

.container .content .info .contact-address .contact-address-select::after {
  content: "";
  width: .16rem;
  height: .1rem;
  background: url("../img/arricon.png") no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: .21rem;
}

.container .content .info .contact-address .contact-address-select select {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  box-sizing: border-box;
  padding-left: .16rem;
  color: #333;
  font-weight: 400;
}

.container .content .info .address-con {
  margin-top: .32rem;
  display: none;
}

.container .content .info .address-con:first-child {
  display: block;
}

.container .content .info .address-con .address-base {
  padding-bottom: .3rem;
  border-bottom: 1px solid #dfdfdf;
}

.container .content .info .address-con .address-base .address-base-name {
  margin-bottom: .2rem;
  color: #333;
  font-weight: 400;
}

.container .content .info .address-con .address-base .address-base-detail {
  color: #0053E7;
  font-weight: 500;
  line-height:.3rem;
}

.container .content .info .address-con .addres-item {
  padding-top: .3rem;
  padding-bottom: .3rem;
  border-bottom: 1px solid #dfdfdf;
}

.container .content .info .address-con .addres-item .addres-item-label {
  margin-bottom: .16rem;
  color: #333;
  font-weight: 400;
}

.container .content .info .address-con .addres-item .addres-item-value {
  color: #0053E7;
  font-weight: 500;
}

.container .content .info .address-con .addres-email {
  padding-top: .3rem;
}

.container .content .info .address-con .addres-email .addres-email-label {
  color: #333;
  font-weight: 400;
  margin-bottom: .16rem;
}

.container .content .info .address-con .addres-email .addres-email-item {
  display: flex;
  align-items: center;
  margin-bottom: .16rem;
}

.container .content .info .address-con .addres-email .addres-email-item span:first-child {
  color: #646464;
  font-weight: 400;
}

.container .content .info .address-con .addres-email .addres-email-item span:last-child {
  color: #0053E7;
  font-weight: 500;
}

.container .contact-con {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.51rem;
  margin: .5rem 0 0 0;
}

.container .contact-con .contact-left {
    width: 4.9rem;
}

.container .contact-con .contact-left .contact-address .contact-address-label {
  color: #333;
  font-weight: 400;
  opacity: .6;
  margin-bottom: .16rem;
}

.container .contact-con .contact-left .contact-address .contact-address-select {
  width: 4.9rem;
  height: .48rem;
  border: 0.01rem solid #DFDFDF;
  position: relative;
}

.container .contact-con .contact-left .contact-address .contact-address-select::after {
  content: "";
  width: .16rem;
  height: .1rem;
  background: url("../img/arricon.png") no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: .21rem;
  z-index: 0;
}

.container .contact-con .contact-left .contact-address .contact-address-select select {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  box-sizing: border-box;
  padding-left: .16rem;
  color: #333;
  font-weight: 400;
  position: relative;
  z-index: 1;
}

.container .contact-con .contact-left .address-con {
  margin-top: .32rem;
  display: none;
}

.container .contact-con .contact-left .address-con:first-child {
  display: block;
}

.container .contact-con .contact-left .address-con .address-base {
  padding-bottom: .3rem;
  border-bottom: 1px solid #dfdfdf;
}

.container .contact-con .contact-left .address-con .address-base .address-base-name {
  margin-bottom: .2rem;
  color: #333;
  font-weight: 400;
}

.container .contact-con .contact-left .address-con .address-base .address-base-detail {
  color: #0053E7;
  font-weight: 500;
  line-height:.3rem;
}

.container .contact-con .contact-left .address-con .addres-item {
  padding-top: .3rem;
  padding-bottom: .3rem;
  border-bottom: 1px solid #dfdfdf;
}

.container .contact-con .contact-left .address-con .addres-item .addres-item-label {
  margin-bottom: .16rem;
  color: #333;
  font-weight: 400;
}

.container .contact-con .contact-left .address-con .addres-item .addres-item-value {
  color: #0053E7;
  font-weight: 500;
}

.container .contact-con .contact-left .address-con .addres-email {
  padding-top: .3rem;
}

.container .contact-con .contact-left .address-con .addres-email .addres-email-label {
  color: #333;
  font-weight: 400;
  margin-bottom: .16rem;
}

.container .contact-con .contact-left .address-con .addres-email .addres-email-item {
  display: flex;
  align-items: center;
  margin-bottom: .16rem;
}

.container .contact-con .contact-left .address-con .addres-email .addres-email-item span:first-child {
  color: #646464;
  font-weight: 400;
}

.container .contact-con .contact-left .address-con .addres-email .addres-email-item span:last-child {
  color: #0053E7;
  font-weight: 500;
}

.container .contact-con .content-right {
  width: 10.18rem;
}

.container .contact-con .content-right .content-right__img {
  display: none;
  width: 10.18rem;
  height: 6.85rem;
  object-fit: cover;
}

.container .contact-con .content-right .content-right__img:first-child {
  display: block;
}

/*================*/

.container .content .info .label {
  font-size: .16rem;
  font-weight: 400;
  color: rgba(51, 51, 51, .6);
  font-family: 'HarmonyOS Sans SC';
  margin-bottom: .16rem;
}

.container .content .info .select {
  /*width: 4.9rem;*/
  height: .38rem;
  margin-bottom: .32rem;
  position: relative;
}

.container .content .info .select select {
  width: 100%;
  height: 100%;
  padding: 0 .2rem;
  border: .01rem solid rgba(223, 223, 223, 1);
  font-size: .16rem;
  font-family: 'HarmonyOS Sans SC';
  color: rgba(51, 51, 51, 1);
  background-color: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  transition: border-color .3s;
}

.container .content .info .select select:hover {
  border-color: rgba(192, 215, 255, 1);
}

.container .content .info .select select:focus {
  /* border-color: rgba(0, 83, 231, 1); */
  /* box-shadow: 0 0 0 .02rem rgba(0, 83, 231, .1); */
}

.container .content .info .select::after {
  content: '';
  position: absolute;
  top: 50%;
  right: .15rem;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: .06rem solid transparent;
  border-right: .06rem solid transparent;
  border-top: .06rem solid rgba(153, 153, 153, 1);
  pointer-events: none;
  transition: all .3s;
}

.container .content .info .select select:focus+ ::after {
  border-top-color: rgba(0, 83, 231, 1);
}

/* 自定义下拉框样式 */
.container .content .info .select.custom-select {
  position: relative;
}

.container .content .info .select.custom-select select {
  display: none;
}

.container .content .info .select.custom-select .select-wrapper {
  position: relative;
}

.container .content .info .select.custom-select .select-value {
  width: 100%;
  height: 100%;
  padding: 0 .2rem;
  border: .01rem solid rgba(223, 223, 223, 1);
  font-size: .16rem;
  font-family: 'HarmonyOS Sans SC';
  color: rgba(51, 51, 51, 1);
  background-color: #fff;
  cursor: pointer;
  line-height: .38rem;
  transition: border-color .3s;
  position: relative;
}

.container .content .info .select.custom-select .select-value:hover {
  border-color: rgba(192, 215, 255, 1);
}

.container .content .info .select.custom-select .select-value::after {
  content: '';
  position: absolute;
  top: 50%;
  right: .15rem;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: .06rem solid transparent;
  border-right: .06rem solid transparent;
  border-top: .06rem solid rgba(153, 153, 153, 1);
  pointer-events: none;
  transition: all .3s;
}

.container .content .info .select.custom-select .select-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: .02rem;
  border: .01rem solid rgba(223, 223, 223, 1);
  border-radius: .04rem;
  background-color: #fff;
  box-shadow: 0 .04rem .12rem rgba(0, 0, 0, .1);
  z-index: 10;
  display: none;
}

.container .content .info .select.custom-select.active .select-dropdown {
  display: block;
}

.container .content .info .select.custom-select.active .select-value::after {
  transform: translateY(-50%) rotate(180deg);
}

.container .content .info .select.custom-select .select-option {
  padding: .1rem .2rem;
  font-size: .16rem;
  font-family: 'HarmonyOS Sans SC';
  color: rgba(51, 51, 51, 1);
  cursor: pointer;
  transition: background-color .3s;
}

.container .content .info .select.custom-select .select-option:hover {
  background-color: rgba(240, 246, 255, 1);
}

.container .content .info .select.custom-select .select-option.active {
  color: rgba(0, 83, 231, 1);
  background-color: rgba(240, 246, 255, 1);
}



.container .content .info .company {
  font-size: .18rem;
  font-weight: 400;
  color: rgba(51, 51, 51, 1);
  font-family: 'HarmonyOS Sans SC';
  margin-bottom: .2rem;
}

.container .content .info .address {
  font-size: .22rem;
  font-weight: 500;
  color: rgba(0, 83, 231, 1);
  font-family: 'HarmonyOS Sans SC';
  line-height: .3rem;
}

.container .content .info .fax {
  font-size: .24rem;
  font-weight: 500;
  color: rgba(0, 83, 231, 1);
  font-family: 'HarmonyOS Sans SC';
}

.container .content .info .phone {
  font-size: .24rem;
  font-weight: 500;
  color: rgba(0, 83, 231, 1);
  font-family: 'HarmonyOS Sans SC';
}

.container .content .info .email {
  display: flex;
  align-items: start;
  flex-direction: column;
}

.container .content .info .email span {
  font-family: 'HarmonyOS Sans SC';
  font-weight: 400;
  font-size: .16rem;
  margin-bottom: .16rem;
}

.container .content .info .email a {
  font-weight: 500;
  cursor: pointer;
  color: rgba(0, 83, 231, 1);
  text-decoration: none;
}

.container .content .info hr {
  margin: .3rem 0;
  border: .01rem solid rgba(223, 223, 223, 1);
}

.container .content .map {
  position: relative;
}

.container .content .map img {
  width: 10.18rem;
  height: 7.35rem;
}

.container .content .map .positioning-icon {
  position: absolute;
  top: 3.49rem;
  left: 5.76rem;
  width: .3607rem;
  height: .4rem;
}

.container .content .map .point {
  position: absolute;
  top: 4.01rem;
  left: 5.42rem;
  width: 0;
  height: 0;
  border-top: 0 solid transparent;
  border-right: .5rem solid transparent;
  border-left: .5rem solid transparent;
  border-bottom: .28rem solid rgba(255, 255, 255, 1);
}

.container .content .map .positioning {
  position: absolute;
  bottom: 2.04rem;
  left: 4.03rem;
  width: 3.83rem;
  height: 1.14rem;
  background-color: rgba(255, 255, 255, 1);
  backdrop-filter: blur(30px);
  display: flex;
  align-items: start;
  flex-direction: column;
  justify-content: center;
  padding: 0 .24rem;
}


.container .content .map .positioning span {
  display: block;
}

.container .content .map .positioning span:first-child {
  font-size: .16rem;
  font-weight: 400;
  color: rgba(51, 51, 51, 1);
  font-family: 'HarmonyOS Sans SC';
  margin-bottom: .09rem;
}

.container .content .map .positioning span:nth-child(2) {
  font-size: .20rem;
  font-weight: 500;
  color: rgba(0, 83, 231, 1);
  line-height: .26rem;
  font-family: 'HarmonyOS Sans SC';
}
