.public_w {
  max-width: 1480;
  width: 85%;
  margin: 0 auto;
}
* {
  margin: 0;
  padding: 0;
}
.about {
  width: 100%;
  /* 导航 */
  /* About Guoshun */
  /* Certificate */
  /* Factory Display */
}
.about .about_nav {
  width: 85%;
  height: calc(46px + 2rem);
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* border: 1px solid #000; */
}
.about .about_nav > li {
  width: 33.3%;
  height: 100%;
  font-family: Gothic_bold;
  font-size: calc(10px + 0.5rem);
  color: #333333;
  transition: all 0.3s;
  /* border: 1px #f00 solid; */
}
.about .about_nav > li > a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.about .about_nav > li.hover,
.about .about_nav > li:hover {
  background: #00529D;
  color: #fff;
}
.about .about_nav > li:nth-of-type(1) {
  display: none;
}
.about .about_nav > span {
  width: 1px;
  height: calc(10px + 0.8rem);
  background: #DCDCDC;
}
.about .about_nav > span:nth-last-of-type(1),
.about .about_nav > span:nth-of-type(1) {
  display: none;
}
.about .about1 {
  width: 100%;
  background: url('../images/about_bg1.png') no-repeat center center;
  background-size: 100% 100%;
  padding-top: calc(44px + 3rem);
  padding-bottom: calc(50px + 3rem);
}
.about .about1 > .public_w {
  width: 85%;
  display: flex;
  flex-direction: column;
  /* border: 1px solid #000; */
}
.about .about1 > .public_w > p {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: Gothic_bold;
  font-size: calc(10px + 2rem);
  color: #333333;
}
.about .about1 > .public_w > p > span {
  width: calc(30px + 3rem);
  height: 4px;
  background: #00529D;
  margin-top: calc(10px + 0.5rem);
}
.about .about1 > .public_w > div:nth-of-type(1) {
  width: 100%;
  display: flex;
  flex-direction: column;
  text-align: center;
  font-family: CenturyGothic_Regular;
  font-size: calc(10px + 0.3rem);
  color: #333333;
  line-height: calc(10px + 0.9rem);
  margin-top: calc(16px + 1.5rem);
}
.about .about1 > .public_w > div:nth-of-type(1) > p:nth-of-type(3) {
  margin-top: calc(10px + 0.5rem);
}
.about .about1 > .public_w > ul {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: calc(20px + 2.5rem);
  /* border: 1px solid #000; */
}
.about .about1 > .public_w > ul > li {
  display: flex;
  align-items: center;
  transition: all 0.3s;
  cursor: pointer;
}
.about .about1 > .public_w > ul > li > img {
  margin-right: calc(13px + 1rem);
}
.about .about1 > .public_w > ul > li > div {
  display: flex;
  flex-direction: column;
}
.about .about1 > .public_w > ul > li > div > p {
  font-family: Gothic_bold;
  font-size: calc(10px + 0.5rem);
  color: #00529D;
  margin-bottom: 0.5rem;
  transition: all 0.3s;
}
.about .about1 > .public_w > ul > li > div > p > span {
  font-size: calc(12px + 1.5rem);
  transition: all 0.3s;
}
.about .about1 > .public_w > ul > li > div > span {
  font-family: CenturyGothic_Regular;
  font-size: calc(10px + 0.4rem);
  color: #666666;
  transition: all 0.3s;
}
.about .about1 > .public_w > ul > span {
  width: 1px;
  height: calc(10px + 2.5rem);
  background: #D9D9D9;
}
.about .about1 > .public_w > ul > li:nth-of-type(1) > img {
  width: calc(13px + 2.5rem);
  height: calc(18px + 2rem);
}
.about .about1 > .public_w > ul > li:nth-of-type(2) > img {
  width: calc(14px + 2rem);
  height: calc(18px + 2rem);
}
.about .about1 > .public_w > ul > li:nth-of-type(3) > img {
  width: calc(19px + 2rem);
  height: calc(11px + 2rem);
}
.about .about1 > .public_w > div:nth-of-type(2) {
  width: 100%;
  height: calc(130px + 15rem);
  display: flex;
  justify-content: space-between;
  margin-top: calc(10px + 2.5rem);
}
.about .about1 > .public_w > div:nth-of-type(2) > .l {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #00529D;
  border-radius: calc(10px + 1rem) 0px 0px 6px;
  padding: 0 calc(30px + 3.5rem);
  justify-content: center;
  /*padding-top: calc(50px + 5rem);*/
  /*padding-bottom: calc(30px + 5rem);*/
  /*overflow: hidden;*/
}
.about .about1 > .public_w > div:nth-of-type(2) > .l > p:nth-of-type(1) {
  font-family: Gothic_bold;
  font-size: calc(10px + 0.9rem);
  color: #FFFFFF;
  text-align: center;
  margin-bottom: calc(10px + 1rem);
}
.about .about1 > .public_w > div:nth-of-type(2) > .l > span {
  width: calc(19px + 1rem);
  height: 4px;
  background: #FFFFFF;
  opacity: 0.5;
}
.about .about1 > .public_w > div:nth-of-type(2) > .l > p:nth-of-type(2) {
  font-family: PingFang_Medium;
  font-size: calc(10px + 0.5rem);
  color: #FFFFFF;
  line-height: calc(10px + 1.5rem);
  text-align: center;
  margin-top: calc(10px + 0.75rem);
}
.about .about1 > .public_w > div:nth-of-type(2) > .r {
  width: 50%;
  height: 100%;
  border-radius: 0px 0px calc(10px + 1rem) 0px;
  overflow: hidden;
  position: relative;
}
.about .about1 > .public_w > div:nth-of-type(2) > .r > img {
  width: 100%;
  height: 100% !important;
}
.about .about1 > .public_w > div:nth-of-type(2) > .r > div {
  width: calc(36px + 5rem);
  height: calc(36px + 5rem);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  /* border: 1px solid #000; */
}
.about .about1 > .public_w > div:nth-of-type(2) > .r > div > img {
  width: calc(17px + 1rem);
  z-index: 10;
}
.about .about1 > .public_w > div:nth-of-type(2) > .r > div > div {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* width: 5px;
                            height: 5px; */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-self: center;
  opacity: 0.7;
}
.about .about1 > .public_w > div:nth-of-type(2) > .r > div > div:nth-of-type(1) {
  border: 1px solid #ffffff50;
  background: #ffffff00;
  animation: a2 5s  infinite;
}
.about .about1 > .public_w > div:nth-of-type(2) > .r > div > div:nth-of-type(2) {
  border: 1px solid #ffffff45;
  animation: a3 4s  infinite;
}
.about .about1 > .public_w > div:nth-of-type(2) > .r > div > div:nth-of-type(3) {
  border: 1px solid #ffffff40;
  animation: a4 3s  infinite;
}
.about .about1 > .public_w > div:nth-of-type(2) > .r > div > div:nth-of-type(4) {
  border: 1px solid #ffffff35;
  animation: a5 2s  infinite;
}
.about .about2 {
  width: 85%;
  display: flex;
  flex-direction: column;
  margin: calc(30px + 5rem) auto;
  /* border: 1px solid #000; */
}
.about .about2 .about2_top {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.about .about2 .about2_top > p {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* align-items: center; */
  font-family: Gothic_bold;
  font-size: calc(10px + 2rem);
  color: #333333;
}
.about .about2 .about2_top > p > span {
  width: calc(30px + 3rem);
  height: 4px;
  background: #00529D;
  margin-top: calc(10px + 0.5rem);
}
.about .about2 .about2_top > .qh {
  width: calc(60px + 3rem);
  /* height: 50px; */
  position: relative;
  /* border: 1px solid #f00; */
}
.about .about2 .about2_top > .qh > div {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  /* position: absolute; */
}
.about .about2 .about2_top > .qh > div > div {
  width: calc(20px + 1.5rem);
  height: calc(20px + 1.5rem);
  position: absolute;
  border-radius: 50%;
  background: #1D5D9F;
  color: #fff;
  /* border: 1px dashed #128F6B; */
}
.about .about2 .about2_top > .qh > div > .swiper-button-prev::after,
.about .about2 .about2_top > .qh > div > .swiper-button-next::after {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: calc(7px + 0.35rem);
}
.about .about2 .about2_top > .qh > div .swiper-button-prev {
  color: #fff;
  /* background: #1D5D9F; */
  left: 0;
}
.about .about2 .about2_top > .qh > div .swiper-button-next {
  color: #fff;
  /* background: #1D5D9F; */
  right: 0;
}
.about .about2 .about2_top > .qh > div .swiper-button-disabled {
  background: #F4F4F4;
  color: #1D5D9F;
  /* border: 1px dashed #7D7D7D; */
}
.about .about2 > .swiper1 {
  width: 100%;
  overflow: hidden;
  position: relative;
  margin-top: calc(22px + 1.5rem);
  /* padding-bottom: ; */
}
.about .about2 > .swiper1 .swiper-wrapper {
  width: 100%;
  margin-bottom: calc(15px + 2rem);
}
.about .about2 > .swiper1 .swiper-wrapper .swiper-slide {
  width: 100%;
  border: 1px solid #DCDCDC;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: calc(20px + 1.5rem);
  padding-bottom: calc(12px + 1rem);
}
.about .about2 > .swiper1 .swiper-wrapper .swiper-slide > a {
  width: 60.227%;
  /* border: 1px solid #000; */
}
.about .about2 > .swiper1 .swiper-wrapper .swiper-slide > a > img {
  width: 100%;
}
.about .about2 > .swiper1 .swiper-wrapper .swiper-slide > p {
  font-family: CenturyGothic_Regular;
  font-size: calc(10px + 0.5rem);
  color: #333333;
  margin-top: calc(10px + 1.1rem);
}
.about .about2 > .swiper1 .swiper-pagination {
  height: calc(12px + 0.5rem);
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  /* border: 1px solid #f00; */
}
.about .about2 > .swiper1 .swiper-pagination .swiper-pagination-bullet {
  border: none;
}
.about .about2 > .swiper1 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet {
  display: flex;
  width: calc(3px + 0.15rem);
  height: calc(3px + 0.15rem);
  /* border: 1px #aaa solid;  */
  align-items: center;
  justify-content: center;
  margin: 0 10px;
  background: #919191;
  opacity: 1;
}
.about .about2 > .swiper1 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet::after {
  position: absolute;
  display: block;
  content: "";
  width: calc(10px + 0.6rem);
  height: calc(10px + 0.6rem);
  border-radius: 50%;
  border: 2px #adadad00 solid;
}
.about .about2 > .swiper1 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #00529D;
}
.about .about2 > .swiper1 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after {
  border-color: #00529D;
}
.about .about3 {
  width: 100%;
  background: #F8F8F8;
  padding-top: calc(33px + 3.5rem);
  padding-bottom: calc(30px + 5rem);
}
.about .about3 > .public_w {
  width: 85%;
  display: flex;
  flex-direction: column;
  /* border: 1px solid #000; */
}
.about .about3 > .public_w .about3_top {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.about .about3 > .public_w .about3_top > p {
  /* width: 35%; */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* align-items: center; */
  font-family: Gothic_bold;
  font-size: calc(10px + 2rem);
  color: #333333;
}
.about .about3 > .public_w .about3_top > p > span {
  width: calc(30px + 3rem);
  height: 4px;
  background: #00529D;
  margin-top: calc(10px + 0.5rem);
}
.about .about3 > .public_w .about3_top > ul {
  /* width: 100%; */
  display: flex;
  align-items: center;
}
.about .about3 > .public_w .about3_top > ul > li {
  width: calc(70px + 5rem);
  height: calc(32px + 1rem);
  background: #FFFFFF;
  border: 1px solid #DCDCDC;
  border-radius: calc(32px + 1rem);
  font-family: CenturyGothic_Regular;
  font-size: calc(10px + 0.4rem);
  color: #333333;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: calc(10px + 0.5rem);
  cursor: pointer;
  transition: all 0.3s;
}
/*.about .about3 > .public_w .about3_top > ul > li:nth-of-type(1){*/
/*    display: none;*/
/*}*/
.about .about3 > .public_w .about3_top > ul > li:nth-last-of-type(1) {
  margin-right: 0;
}
.about .about3 > .public_w .about3_top > ul > li:hover,
.about .about3 > .public_w .about3_top > ul .on {
  background: #00529D;
  color: #fff;
}
.about .about3 > .public_w > div:nth-of-type(2) {
  width: 100%;
  margin-top: calc(20px + 2rem);
}
.about .about3 > .public_w > div:nth-of-type(2) .about3a {
  height: calc(126px + 20rem);
  display: flex;
  justify-content: space-between;
}
.about .about3 > .public_w > div:nth-of-type(2) .about3a > div {
  width: 41.48%;
  overflow: hidden;
}
.about .about3 > .public_w > div:nth-of-type(2) .about3a > div > img {
  width: 100%;
  transition: all 0.3s;
}
.about .about3 > .public_w > div:nth-of-type(2) .about3a > div:hover > img {
  transform: scale(1.1);
}
.about .about3 > .public_w > div:nth-of-type(2) .about3a > ul {
  width: 57.02%;
  /* height: 100%; */
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
  /* border: 1px solid #000; */
}
.about .about3 > .public_w > div:nth-of-type(2) .about3a > ul > li {
  width: 48.578%;
  overflow: hidden;
}
.about .about3 > .public_w > div:nth-of-type(2) .about3a > ul > li > img {
  width: 100%;
  transition: all 0.3s;
}
.about .about3 > .public_w > div:nth-of-type(2) .about3a > ul > li:hover > img {
  transform: scale(1.1);
}
/* vr */
.about_vr {
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.8);
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* display: none; */
  z-index: 1001;
  transition: all 3s;
}
.about_vr #frame_1 {
  width: 80%;
  height: 80%;
}
.about_vr > div {
  width: calc(80px + 5rem);
  height: calc(26px + 1.5rem);
  background: #00529D;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: calc(10px + 0.8rem);
  cursor: pointer;
}
.about_vr > div > img {
  width: calc(10px + 0.4rem);
}
.about_vr > div > p {
  font-family: CenturyGothic_Regular;
  font-size: calc(10px + 0.4rem);
  color: #FFFFFF;
  margin-left: calc(10px + 0.35rem);
}
@keyframes a2 {
  100% {
    transform: scale(30);
  }
  0% {
    transform: scale(2);
  }
}
@keyframes a3 {
  100% {
    transform: scale(35);
  }
  0% {
    transform: scale(2);
  }
}
@keyframes a4 {
  100% {
    transform: scale(40);
  }
  0% {
    transform: scale(2);
  }
}
@keyframes a5 {
  100% {
    transform: scale(50);
  }
  0% {
    transform: scale(2);
  }
}
@media screen and (max-width: 1100px) {
  .about {
    width: 100%;
    /* About Guoshun */
    /* Factory Display */
  }
  .about .about1 > .public_w > ul {
    width: 100%;
    flex-direction: column;
  }
  .about .about1 > .public_w > ul > li:nth-of-type(2) {
    margin: calc(10px + 4rem) 0;
  }
  .about .about1 > .public_w > ul > span {
    display: none;
  }
  .about .about1 > .public_w > div:nth-of-type(2) {
    flex-direction: column;
    height: 95rem;
  }
  .about .about1 > .public_w > div:nth-of-type(2) > .l {
    width: 100%;
    border-radius: calc(10px + 1rem) calc(10px + 1rem) 0px 0px;
    padding-bottom: calc(10px + 10rem);
  }
  .about .about1 > .public_w > div:nth-of-type(2) > .r {
    width: 100%;
  }
  .about .about3 > .public_w .about3_top {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
  }
  .about .about3 > .public_w .about3_top > ul {
    width: 100%;
    margin-top: calc(10px + 2rem);
  }
  .about .about3 > .public_w .about3_top > ul > li {
    width: 32%;
  }
  .about .about3 > .public_w > div:nth-of-type(2) {
    width: 100%;
  }
  .about .about3 > .public_w > div:nth-of-type(2) .about3a {
    flex-direction: column;
    height: 122rem;
  }
  .about .about3 > .public_w > div:nth-of-type(2) .about3a > div {
    width: 100%;
  }
  .about .about3 > .public_w > div:nth-of-type(2) .about3a > div > img {
    width: 100%;
  }
  .about .about3 > .public_w > div:nth-of-type(2) .about3a > ul {
    width: 100%;
    margin-top: calc(10px + 2rem);
  }
  .about .about3 > .public_w > div:nth-of-type(2) .about3a > ul > li {
    width: 48%;
    margin-top: calc(10px + 1rem);
  }
  .about .about3 > .public_w > div:nth-of-type(2) .about3a > ul > li > img {
    width: 100%;
  }
  .about .about3 > .public_w > div:nth-of-type(2) .about3a > ul > li:nth-of-type(1),
  .about .about3 > .public_w > div:nth-of-type(2) .about3a > ul > li:nth-of-type(2) {
    margin-top: 0;
  }
}