* {
  margin: 0;
  padding: 0;
}

.public_w {
  max-width: 1400px;
  width: 85%;
  margin: 0 auto;
}

.header_pc {
  width: 100%;
}

.header {
  max-width: 1620px;
  width: 87%;
  height: calc(12px + 4rem);
  margin: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;

}

.logo {
  width: 18.9%;

}

.logo img {
  width: 100%;

  object-fit: contain;
}

.right {
  flex: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: calc(5px + 2rem);
  height: 100%;
}

.nav1_box {
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: calc(5px + 2rem);


}

.nav_item {
  height: 100%;
  position: relative;
  display: flex;
  align-items: center;
}

.nav_item p {

  font-family: PINGFANG;
  font-weight: 600;
  font-size: calc(8px + 0.5rem);
  color: #4D4D4D;
  line-height: 60px;
}

.nav_item p:hover {
  color: #D30303;
}

.change_lang a {

  font-family: PINGFANG;
  font-weight: 400;
  font-size: calc(8px + 0.5rem);
  color: #333333;
  opacity: 0.5;
}

.change_lang a:nth-of-type(1) {
  opacity: 1;
}

.right_logo {
  width: calc(3px + 10rem);
  height: calc(6px + 1rem);
  margin-left: 5%;
}

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

.xiala {
  width: calc(20px + 10rem);
  background: #FFFFFF;
  box-shadow: 0px 6px 10px 0px rgba(29, 65, 97, 0.04);
  position: absolute;
  top: 100%;
  left: -50%;
  z-index: 10;
  transition:.5s ease-in-out;
  opacity: 0;
  height: 0;
  overflow: hidden;

}



.nav_item:hover .xiala {
  opacity: 1;
  height: auto;
}


.xiala p {

  font-family: PINGFANG;
  font-weight: 500;
  font-size: calc(6px + 0.5rem);
  color: #333333;
  line-height: calc(20px + 1rem);
  padding: 0 calc(5px + 0.5rem);

}

.xiala p:hover {
  background: #FDF5F5;
  color: #D30303;
}

.right .nav1_box .active {
  color: #D30303;
}