main {
  padding-top: 1.1rem;
}

main .header .top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 1.37rem;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

main .header .top .title {
  font-size: 0.7rem;
  color: #4c4c4c;
  letter-spacing: 0.07rem;
}

main .header .top .description {
  font-size: 0.20rem;
  color: #333;
  padding-right: 1.54rem;
}

main #about-header-bg {
  width: 100%;
  height: 6.7rem;
  -o-object-fit: cover;
  object-fit: cover;
}

main .center {
  position: relative;
}

main .center .box1 {
  background-color: #39aeb2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 1.2rem 1.4rem 1rem 1.35rem;
}

main .center .box1 .left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

main .center .box1 .left .title1 {
  color: #fff;
  font-size: 1.64rem;
}

main .center .box1 .left .line {
  width: 0.14rem;
  background-color: #fff;
  height: 0.06rem;
  margin-top: 0.6rem;
}

main .center .box1 .left .title2 {
  font-size: 0.44rem;
  color: #fff;
  margin-top: 0.2rem;
}

main .center .box1 .left .title3 {
  font-size: 0.44rem;
  color: #fff;
}

main .center .box1 .right {
  color: #fff;
  font-size: 0.23rem;
  letter-spacing: 0.01rem;

}

main .center .box2 {
  position: absolute;
  left: 0;
  padding: 1.2rem 0.84rem;
  background-color: #f2f2f2;
  border-radius: 2px;
  z-index: 11;
  width: 12.73rem;
  height: 4.85rem;
  top: 4.95rem;
}

main .center .box2 .contentTitle {
  color: #4c4c4c;
  font-size: 0.56rem;
  margin-bottom: 0.58rem;
}

main .center .box2 .content {
  color: rgba(0, 0, 0, 0.8);
  font-size: 0.18rem;

}

main .center .box2 .content1 {
  color: rgba(0, 0, 0, 0.8);
  font-size: 0.18rem;

  margin-top: 0.53rem;
}

main .center .box2 ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 0.4rem;
}

main .center .box2 ul li {
  margin-left: 1.5rem;
  position: relative;
}

main .center .box2 ul li div:nth-of-type(1) {
  font-size: 0.44rem;
}

main .center .box2 ul li div:nth-of-type(2) {
  color: #4c4c4c;
  font-size: 0.18rem;

}

main .center .box2 ul li::after {
  position: absolute;
  width: 1px;
  height: 0.46rem;
  background-color: rgba(0, 0, 0, 0.3);
  content: "";
  display: block;
  right: -0.67rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

main .center .box2 ul li:nth-of-type(1)::after {
  display: none;
}

main .center .box3 {
  margin-top: 3rem;
  padding-bottom: 1.17rem;
  padding-right: calc(100% - 12.73rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

main .center .box3 .title {
  color: #4c4c4c;
  font-size: 0.56rem;
}

main .center .box3 .description {
  font-size: 0.17rem;

  color: rgba(0, 0, 0, 0.8);
  margin-right: 1.8rem;
}

main .profile-video {
  width: 100%;
  height: 8.07rem;
}

main .profile-video img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

main .profile-video video {
  -o-object-fit: cover;
  object-fit: cover;
}

main .nav-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 1.2rem 1.4rem;
}

main .nav-list .nav {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  border: 1px solid #d4d8d7;
  height: 2.57rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-right: 0.5rem;
  cursor: pointer;
  -webkit-transition: all 0.45s;
  transition: all 0.45s;
}

main .nav-list .nav .title {
  font-size: 0.32rem;
  line-height: 0.5rem;
  color: #4c4c4c;
}

main .nav-list .nav .bottom-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 0.4rem;
}

main .nav-list .nav .bottom-box div {
  color: #333;
  font-size: 0.19rem;

  -webkit-transition: all 0.45s;
  transition: all 0.45s;
}

main .nav-list .nav .bottom-box img {
  width: 0.17rem;
  margin-right: 0.24rem;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

main .nav-list .nav .bottom-img {
  display: none;
}

main .nav-list .nav:hover {
  background-color: #e7efee;
}

main .nav-list .nav:hover .bottom-box div {
  color: #f08b58;
}

main .nav-list .nav:nth-of-type(3),
main .nav-list .nav:nth-of-type(2) {
  border-right: none;
}

@media (max-width: 1012px){
  main {
    padding-top: 1.1rem;
  }
  main .header .top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0.66rem 0.79rem 1.58rem 0.74rem;
  }
  main .header .top .title {
    color: #4c4c4c;
    letter-spacing: 0.07rem;
    width: 100%;
  }
  main .header .top .description {
    font-size: 0.28rem;
    line-height: 0.33rem;
    margin-top: 0.41rem;
  
    color: #333;
    padding-left: 0;
    padding-right: 0;
  }
  main #about-header-bg {
    width: 100%;
    height: 4.26rem;
    -o-object-fit: cover;
    object-fit: cover;
  }
  main .center {
    position: relative;
  }
  main .center .box1 {
    background-color: #39aeb2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0.89rem 0.95rem 1rem 0.75rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  main .center .box1 .left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  main .center .box1 .left .title1 {
    color: #fff;
    font-size: 1.09rem;
  }
  main .center .box1 .left .line {
    width: 0.14rem;
    background-color: #fff;
    height: 0.06rem;
    margin-top: 0.2rem;
  }
  main .center .box1 .left .title2 {
    font-size: 0.29rem;
    color: #fff;
    margin-top: 0.2rem;
  }
  main .center .box1 .left .title3 {
    font-size: 0.29rem;
    color: #fff;
  }
  main .center .box1 .right {
    color: #fff;
    font-size: 0.27rem;
    line-height: 0.33rem;
    letter-spacing: 0.01rem;
    font-family: Roboto-Regluar;
    margin-top: 0.45rem;
  }
  main .center .box2 {
    position: static;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 1.2rem 0.75rem 1rem 0.75rem;
    background-color: #f2f2f2;
    width: 100%;
    height: auto;
  }
  main .center .box2 .contentTitle {
    color: #4c4c4c;
    margin-bottom: 0.58rem;
  }
  main .center .box2 .content {
    color: rgba(0, 0, 0, 0.8);
    
    font-size: 0.27rem;
    line-height: 0.37rem;
  }
  main .center .box2 .content1 {
    color: rgba(0, 0, 0, 0.8);
    font-size: 0.27rem;
    line-height: 0.37rem;
    
    margin-top: 0.93rem;
    display: block;
  }
  main .center .box2 ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1rem;
  }
  main .center .box2 ul li {
    margin-right: 0;
    position: relative;
  }
  main .center .box2 ul li div:nth-of-type(1) {
    font-size: 0.53rem;
  }
  main .center .box2 ul li div:nth-of-type(2) {
    color: #4c4c4c;
    font-size: 0.22rem;
    margin-top: 0.25rem;
  
  }
  main .center .box2 ul li::after {
    position: absolute;
    width: 1px;
    height: 0.46rem;
    background-color: rgba(0, 0, 0, 0.3);
    content: "";
    display: none;
    right: -0.67rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  main .center .box2 ul li:nth-of-type(3)::after {
    display: none;
  }
  main .center .box3 {
    margin-top: 0rem;
    padding: 1.2rem 0.8rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
  main .center .box3 .title {
    color: #4c4c4c;
    font-size: 0.4rem;
  }
  main .center .box3 .description {
    font-size: 0.27rem;
    line-height: 0.37rem;
    
    color: rgba(0, 0, 0, 0.8);
    margin-top: 0.46rem;
    margin-left: 0;
    margin-right: 0;
  }
  main .profile-video {
    width: 100%;
    height: 4rem;
  }
  main .profile-video img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
  main .profile-video video {
    -o-object-fit: cover;
    object-fit: cover;
  }
  main .nav-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.15rem 0.73rem;
  }
  main .nav-list .nav {
    width: 100%;
    border: 1px solid #d4d8d7;
    height: 1.13rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding-left: 0;
    padding: 0 0.34rem;
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    cursor: pointer;
    -webkit-transition: all 0.45s;
    transition: all 0.45s;
  }
  main .nav-list .nav .title {
    font-size: 0.12rem;
    color: #4c4c4c;
  }
  main .nav-list .nav .bottom-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: none;
    margin-top: 0.4rem;
  }
  main .nav-list .nav .bottom-box div {
    color: #333;
    font-size: 0.21rem;
  
    -webkit-transition: all 0.45s;
    transition: all 0.45s;
  }
  main .nav-list .nav .bottom-box img {
    width: 0.17rem;
    margin-left: 0.24rem;
  }
  main .nav-list .nav .bottom-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  main .nav-list .nav .bottom-img img {
    width: 0.3rem;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  main .nav-list .nav:nth-of-type(3) {
    border-right: 1px solid #d4d8d7;
  }
  main .nav-list .nav:nth-of-type(1),
  main .nav-list .nav:nth-of-type(2) {
    border-bottom: none;
    border-right: 1px solid #d4d8d7;
  }
}
/*# sourceMappingURL=profile.css.map */