body {
  margin: 0;
}
body .about-us {
  width: 100%;
}
body .about-us .header {
  width: 100%;
  height: 638px;
  background-image: url(./../images/other/about_us_banner02.png);
  background-position: center center;
  background-size: cover;
}
body .about-us .header .nav {
  width: 100%;
}
body .about-us .header .nav .nav-wrap {
  width: 1200px;
  height: 68px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
body .about-us .header .nav .nav-wrap .nav-left img {
  height: 29px;
}
body .about-us .header .nav .nav-wrap .nav-right {
  width: 63%;
}
body .about-us .header .nav .nav-wrap .nav-right ul {
  width: 100%;
  height: 100%;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  list-style: none;
}
body .about-us .header .nav .nav-wrap .nav-right ul li {
  font-size: 16px;
  font-weight: 400;
  margin-right: 50px;
  font-family: PingFangSC;
}
body .about-us .header .nav .nav-wrap .nav-right ul li a {
  color: #ccc;
  text-decoration: none;
}
body .about-us .header .nav .nav-wrap .nav-right ul li a:hover {
  color: #fff;
}
body .about-us .header .nav .nav-wrap .nav-right ul li:last-child {
  margin-right: 0;
}
body .about-us .video-content {
  width: 1200px;
  height: 627px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
}
body .about-us .video-content .video-content-left {
  width: 50%;
  text-align: right;
  padding-right: 100px;
}
body .about-us .video-content .video-content-left .video-content-left-title {
  font-size: 32px;
  color: #333333;
  font-weight: 500;
  font-family: PingFang;
}
body .about-us .video-content .video-content-left .video-content-left-subtitle {
  font-size: 14px;
  color: #333333;
  font-weight: 400;
  line-height: 14px;
  margin-top: 14px;
}
body .about-us .video-content .video-content-left .video-row {
  margin: 24px 0;
}
body .about-us .video-content .video-content-left .video-row .video-row-title {
  font-size: 20px;
  color: #333333;
  font-weight: 500;
  line-height: 48px;
}
body .about-us .video-content .video-content-left .video-row .video-row-title img {
  width: 24px;
  height: 22px;
  margin-left: 10px;
  position: relative;
  top: 2px;
}
body .about-us .video-content .video-content-left .video-row .video-row-text {
  font-size: 14px;
  color: #999999;
  font-weight: 400;
  line-height: 24px;
}
body .about-us .video-content .video-content-right {
  width: 50%;
}
body .about-us .video-content .video-content-right .video-wrap {
  width: 623px;
   height: 405px;
  border: 1px solid grey;
  /* background-image: url(./../images/other/video-img.png); */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .about-us .video-content .video-content-right .video-wrap img{
    width: 50px;
    height: 50px;
}
body .about-us .video-content .video-content-right .view-more {
  width: 623px;
  font-size: 13px;
  padding: 5px 0;
  color: #666666;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
}
body .about-us .video-content .video-content-right .view-more img {
  opacity: 0.75;
}
body .about-us .video-content .video-content-right .view-more:hover {
  cursor: pointer;
  color: #666666;
}
body .about-us .video-content .video-content-right .view-more:hover img {
  opacity: 1;
}
body .about-us .video-dialog {
  display: none;
  width: 100%;
  height: 100%;
  padding-top: 8%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 33;
  background-color: rgba(0, 0, 0, 0.5);
}
body .about-us .video-dialog .video-con {
  width: 1200px;
  height: 600px;
  margin: 0 auto;
}
body .about-us .video-dialog .video-con .close {
  width: 100%;
  text-align: right;
  color: white;
  cursor: pointer;
}
body .about-us .video-dialog .video-con video::-internal-media-controls-download-button {
  display: none;
}
body .about-us .video-dialog .video-con video::-webkit-media-controls-enclosure {
  overflow: hidden;
}
body .about-us .video-dialog .video-con video::-webkit-media-controls-panel {
  width: calc(130%);
}
body .about-us .growth {
  height: 375px;
  width: 1200px;
  margin: 0 auto;
}
body .about-us .growth .growth-header {
  width: 100%;
  text-align: center;
}
body .about-us .growth .growth-header .growth-header-title {
  font-size: 26px;
  line-height: 25px;
  color: #333333;
  font-weight: 500;
}
body .about-us .growth .growth-header .growth-header-subtitle {
  padding: 10px 0;
  font-size: 14px;
  color: #666666;
  font-weight: 300;
  opacity: 0.8;
}
body .about-us .growth .growth-path {
  height: 0px;
  margin-top: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  border: 1px solid #DDDDDD;
}
body .about-us .growth .growth-path .groeth-path-box {
  position: relative;
  top: 22px;
  width: 240px;
  height: 235px;
  margin-right: 53px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
body .about-us .growth .growth-path .groeth-path-box .growth-img{
  display: none;
}
 
body .about-us .growth .growth-path .groeth-path-box:hover {
  cursor: pointer;
}
/* body .about-us .growth .growth-path .groeth-path-box:hover .growth-img{
  display: block;
  position: absolute;
  left: -90px;
  top: -43px;
} */
body .about-us .growth .growth-path .groeth-path-box img {
  width: 260px;
  height: 169px;
  margin-left: -20px;
}
body .about-us .growth .growth-path .groeth-path-box .circle {
  width: 8px;
  height: 8px;
  background-color: #00A4FF;
  border-radius: 100%;
  margin-top: 91px;
}
body .about-us .growth .growth-path .groeth-path-box .circle:hover {
  box-shadow: 0 0 10px 10px #addffc;
}
body .about-us .growth .growth-path .groeth-path-box .groeth-path-box-time {
  line-height: 40px;
  font-size: 16px;
  color: #00A4FF;
  font-weight: 300;
}
body .about-us .growth .growth-path .groeth-path-box .groeth-path-box-text {
  font-size: 16px;
  color: #333333;
  font-weight: 400;
}
body .about-us .environment {
  width: 100%;
  background-color: #023546;
}
body .about-us .environment .environment-wrap {
  width: 1200px;
  height: 600px;
  margin: 0 auto;
}
body .about-us .environment .environment-wrap .environment-header {
  text-align: center;
  color: #FFFFFF;
  padding-top: 59px;
  padding-bottom: 76px;
}
body .about-us .environment .environment-wrap .environment-header .environment-header-title {
  height: 38px;
  font-size: 26px;
  font-weight: 500;
}
body .about-us .environment .environment-wrap .environment-header .environment-header-subtitle {
  font-size: 14px;
  font-weight: 200;
}
body .about-us .environment .environment-wrap .environment-content {
  height: 414px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-left {
  position: relative;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-left img {
  width: 586px;
  height: 590px;
  padding: 30px;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-left .environment-left-text {
  position: absolute;
  bottom: 60px;
  left: 45px;
  color: #FFFFFF;
  font-size: 18px;
  font-weight: 500;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-right-text {
  width: 629px;
  margin-left: 6px;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-right-text .environment-right-text-title {
  font-size: 32px;
  color: #FFFFFF;
  font-weight: 400;
  padding: 15px 0;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-right-text .environment-right-text-title > div {
  font-family: PingFang;
  font-weight: 400;
  color: #ffffff;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-right-text .environment-right-text-subtitle {
  color: #FFFFFF;
  font-size: 15px;
  font-weight: 200;
  padding-top: 30px;
  opacity: 0.8;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-show {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  margin-top: 50px;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-show .environment-show-row {
  margin-right: 38px;
  position: relative;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-show .environment-show-row img {
  width: 270px;
  height: 335px;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-show .environment-show-dirow {
  margin-right: 38px;
  position: relative;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-show .environment-show-dirow img {
  width: 330px;
  height: 250px;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-show .environment-show-row .environment-show-row-text {
  position: absolute;
  left: 25px;
  bottom: 14px;
  color: #FFFFFF;
  font-size: 18px;
  font-weight: 500;
}
body .about-us .environment .environment-wrap .environment-content .environment-content-right .environment-show .environment-show-dirow .environment-show-row-text {
  position: absolute;
  left: 25px;
  bottom: 14px;
  color: #FFFFFF;
  font-size: 18px;
  font-weight: 500;
}
body .about-us .culture {
  width: 100%;
  height: 522px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
body .about-us .culture .culture-title {
  font-size: 26px;
  line-height: 25px;
  margin-top: 100px;
  color: #333333;
  font-weight: 500;
  font-family: PingFang-SC-Medium;
}
body .about-us .culture .culture-subtitle {
  font-size: 14px;
  padding: 10px 0;
  color: #666666;
  font-weight: 300;
  opacity: 0.8;
}
body .about-us .quality-service {
  width: 100%;
  height: 610px;
  background-image: url(./../images/other/pic-bg.png);
  background-position: center center;
  background-repeat: no-repeat;
}
body .about-us .quality-service .quality-service-wrap {
  width: 1200px;
  margin: 0 auto;
}
body .about-us .quality-service .quality-service-wrap .services {
  height: 120px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
body .about-us .quality-service .quality-service-wrap .services .services-box {
  bottom: 0;
  width: 378px;
  height: 290px;
  background-color: #FFFFFF;
  border-radius: 2px;
  box-shadow: 0px 0px 13px 0px rgba(189, 202, 224, 0.3);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
body .about-us .quality-service .quality-service-wrap .services .services-box .services-box-zhihui {
  width: 52px;
  height: 52px;
  margin: 10px 0;
  background-image: url(./../images/other/gywm_icon_zhgt2.png);
  background-repeat: no-repeat;
  background-size: 52px 52px;
}
body .about-us .quality-service .quality-service-wrap .services .services-box .services-box-xingdong {
  width: 52px;
  height: 52px;
  margin: 10px 0;
  background-size: 52px 52px;
  background-repeat: no-repeat;
  background-image: url(./../images/other/gywm_icon_xd2.png);
}
body .about-us .quality-service .quality-service-wrap .services .services-box .services-box-souhuo {
  width: 52px;
  height: 52px;
  margin: 10px 0;
  background-size: 52px 52px;
  background-repeat: no-repeat;
  background-image: url(./../images/other/gywm_icon_sh2.png);
}
body .about-us .quality-service .quality-service-wrap .services .services-box .services-box-title {
  height: 50px;
  font-size: 22px;
  font-weight: 500;
  color: #333333;
}
body .about-us .quality-service .quality-service-wrap .services .services-box .services-box-content {
  font-size: 16px;
  line-height: 30px;
  color: #999999;
  font-weight: 400;
}
body .about-us .quality-service .quality-service-wrap .services .services-box:hover {
  color: #FFFFFF;
  background-color: #00a4ff;
  cursor: pointer;
}
body .about-us .quality-service .quality-service-wrap .services .services-box:hover .services-box-title {
  color: #FFFFFF;
}
body .about-us .quality-service .quality-service-wrap .services .services-box:hover .services-box-content {
  color: #FFFFFF;
}
body .about-us .quality-service .quality-service-wrap .services .services-box:hover .services-box-zhihui {
  background-image: url(./../images/other/gywm_icon_zhgt1.png);
}
body .about-us .quality-service .quality-service-wrap .services .services-box:hover .services-box-xingdong {
  background-image: url(./../images/other/gywm_icon_xd1.png);
}
body .about-us .quality-service .quality-service-wrap .services .services-box:hover .services-box-souhuo {
  background-image: url(./../images/other/gywm_icon_sh1.png);
}
body .about-us .quality-service .quality-service-wrap .quality-service-middle {
  height: 200px;
  margin-top: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
}
body .about-us .quality-service .quality-service-wrap .quality-service-middle .quality-service-middle-title {
  font-size: 28px;
  font-weight: 400;
  line-height: 60px;
}
body .about-us .quality-service .quality-service-wrap .quality-service-middle .quality-service-middle-sub {
  font-size: 14px;
  font-weight: 400;
  opacity: 0.8;
}
body .about-us .quality-service .quality-service-wrap .performance {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
body .about-us .quality-service .quality-service-wrap .performance .performance-box {
  width: 240px;
  height: 180px;
  color: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
body .about-us .quality-service .quality-service-wrap .performance .performance-box img {
  height: 30px;
  margin: 15px 0;
}
body .about-us .quality-service .quality-service-wrap .performance .performance-box .performance-box-number {
  font-size: 32px;
  font-weight: 300;
  opacity: 0.7;
}
body .about-us .quality-service .quality-service-wrap .performance .performance-box .performance-box-number .symbol {
  font-size: 14px;
}
body .about-us .quality-service .quality-service-wrap .performance .performance-box .performance-box-text {
  font-size: 14px;
  opacity: 0.7;
}
body .about-us .contact-us {
  width: 1200px;
  margin: 0 auto;
}
body .about-us .contact-us .contact-header {
  height: 167px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
body .about-us .contact-us .contact-header .contact-title {
  font-size: 26px;
  color: #333333;
  font-weight: 500;
}
body .about-us .contact-us .contact-header .contact-subtitle {
  line-height: 30px;
  font-size: 14px;
  color: #666666;
  font-weight: 300;
  opacity: 0.8;
}
body .about-us .contact-us .contact-content {
  padding: 20px 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
body .about-us .contact-us .contact-content .contact-left {
  width: 530px;
}
body .about-us .contact-us .contact-content .contact-left .left-contact-style {
  height: 300px;
  padding-left: 30px;
  border-radius: 3px 3px 0px 0px;
  border-top: 4px solid #2dccc7;
  box-shadow: 0px 0px 29px 0px rgba(0, 54, 70, 0.04);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}
body .about-us .contact-us .contact-content .contact-left .left-contact-style .contact-style-title-wrap {
  height: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
}
body .about-us .contact-us .contact-content .contact-left .left-contact-style .contact-style-title-wrap .contact-style-img {
  margin-right: 10px;
}
body .about-us .contact-us .contact-content .contact-left .left-contact-style .contact-style-title-wrap .contact-style-img img {
  width: 64px;
  height: 54px;
}
body .about-us .contact-us .contact-content .contact-left .left-contact-style .contact-style-title-wrap .contact-style-title .contact-style-title-text {
  font-size: 22px;
  color: #414141;
  font-weight: 400;
}
body .about-us .contact-us .contact-content .contact-left .left-contact-style .contact-style-title-wrap .contact-style-title .contact-style-title-sub {
  line-height: 30px;
  font-size: 16px;
  color: #414141;
  opacity: 0.5;
}
body .about-us .contact-us .contact-content .contact-left .left-contact-style .contact-style-content {
  font-size: 16px;
  color: #5b5d62;
  line-height: 32px;
}
body .about-us .contact-us .contact-content .contact-left .adress {
  margin-top: 32px;
  border-top: 4px solid #00a4ff;
}
body .about-us .contact-us .contact-content .contact-right {
  width: 535px;
  height: 500px;
  padding: 5px;
  border: 1px solid #e5e5e5;
}
body .about-us .contact-us .contact-content .contact-right .container-map {
  width: 100%;
  height: 100%;
}
body .about-us .join-us {
  width: 1200px;
  margin: 0 auto;
}
body .about-us .join-us .join-wrap {
  height: 167px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
body .about-us .join-us .join-wrap .join-title {
  font-size: 26px;
  font-weight: 500;
  color: #333333;
}
body .about-us .join-us .join-wrap .join-sub {
  font-size: 14px;
  font-weight: 300;
  opacity: 0.8;
  color: #666666;
}
body .about-us .join-us .join-con {
  width: 100%;
  height: 390px;
  margin-bottom: 60px;
  background-image: url(./../images/other/pic-bg_join.png);
  background-repeat: no-repeat;
  background-position: center center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
body .about-us .join-us .join-con .join-row {
  width: 80%;
  padding: 5px 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
body .about-us .join-us .join-con .join-row img {
  width: 246px;
  height: 56px;
  margin-bottom: 20px;
}
body .about-us .join-us .join-con .join-row .join-input input {
  width: 280px;
  height: 42px;
  border-radius: 2px;
  margin-right: 20px;
  border: 0;
  font-size: 15px;
  color: #5b5d62;
}
body .about-us .join-us .join-con .join-row .join-input input::placeholder {
  font-size: 14px;
  color: #999999;
}
body .about-us .join-us .join-con .join-row button {
  width: 156px;
  height: 42px;
  border-radius: 21px;
  font-size: 16px;
  color: #ffffff;
  background-color: #b13230;
  border: none;
  outline: none;
}
body .about-us .join-us .join-con .join-row textarea {
  width: 100%;
  height: 110px;
  padding: 5px;
  font-size: 15px;
  color: #5b5d62;
  resize: none;
  font-weight: 500;
}
body .about-us .join-us .join-con .join-row textarea::placeholder {
  font-size: 14px;
  color: #999999;
}
body .about-us .join-us .join-con .join-row span {
  padding-top: 33px;
  font-size: 16px;
  color: #ffffff;
}
