* {
  margin: 0;
  padding: 0;
}
.wrapper {
  width: 100%;
  min-height: 100%;
}
.wrapper header {
  padding: 40px 0 24px;
  background-color: #fff;
}
.wrapper header .title-wrap {
  width: 1080px;
  margin: 0 auto;
}
.wrapper header .title-wrap .title {
  font-size: 40px;
  line-height: 56px;
  font-weight: bold;
  color: #FF6523;
}
#main-part {
  width: 100%;
  position: relative;
  height: calc((1080 / 1920) * 100vw);
  background: url("../img/main-part-bg.png") center 0 no-repeat;
  background-size: 100%;
}

.nav {
  width: 100%;
  height: calc((120 / 1080) * 100%);
  z-index: 20;
  background-color: white;
  position: relative;
}

.top-logo {
  position: absolute;
  width: calc((276 / 1920) * 100%);
  height: calc((90 / 120) * 100%);
  background: url("../img/topLogo.png") center 0 no-repeat;
  background-size: 100%;
  top: calc((10 / 120) * 100%);
  left: calc((250 / 1920) * 100%);
}

#main-part .nav ul {
  float: right;
  margin: 1.5vw;
  margin-right: 14vw;
}

#main-part .nav ul li {
  float: left;
  padding-left: 3vw;
}

#main-part .nav ul li a {
  font-size: 1vw;
  font-weight: 300;
  color: #333333;
  border-bottom-width: 0.2vw;
  border-bottom-style: solid;
  border-bottom-color: #FF9E0E;
  padding-bottom: 0.6vw;
}

ul,
li {
  list-style: none;
}

a {
  text-decoration: none;
  margin: 1px 4px;
  color: #fff;
}

#indeWrapper {
  width: 100%;
  height: calc((1024 / 1080) * 100%);
  background: url("../img/bg.png") center 0 no-repeat;
  background-size: 100%;
  position: relative;
}

.phone {
  position: absolute;
  width: calc((817 / 1920) * 100%);
  height: calc((873 / 1024) * 100%);
  background: url("../img/phone.png") center 0 no-repeat;
  background-size: 100%;
  top: calc((150 / 1080) * 100%);
  left: calc((130 / 1920) * 100%);
}
.content-pic {
  position: absolute;
  width: calc((528 / 1920) * 100%);
  height: calc((194 / 1024) * 100%);
  background: url("../img/contentPic1.png") center 0 no-repeat;
  background-size: 100%;
  top: calc((380 / 1080) * 100%);
  left: calc((980 / 1920) * 100%);
}
.ios-download {
  position: absolute;
  width: calc((296 / 1920) * 100%);
  height: calc((110 / 1024) * 100%);
  background: url("../img/iosDownload.png") center 0 no-repeat;
  background-size: 100%;
  top: calc((720 / 1080) * 100%);
  left: calc((900 / 1920) * 100%);
}
.android-download {
  position: absolute;
  width: calc((538 / 1920) * 100%);
  height: calc((256 / 1080) * 100%);
  background: url("../img/btn-img.png") center 0 no-repeat;
  background-size: 100%;
  top: calc((720 / 1080) * 100%);
  left: calc((1010 / 1920) * 100%);
}
.code {
  position: absolute;
  width: calc((324 / 1920) * 100%);
  height: calc((170 / 940) * 100%);
  background: url("../img/codeDownload.png") center 0 no-repeat;
  background-size: 100%;
  top: calc((720 / 1080) * 100%);
  left: calc((1400 / 1920) * 100%);
}

.buttom-part {
  height: 10vh;
  height: calc((140 / 1080) * 100%);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
  background-color: white;
  font-size: 12px;
  font-family: Adobe Heiti Std;
  font-weight: normal;
  color: #000000;
  line-height: 28px;
  padding-top: 2%;
  border-top: 1px solid #EEE;
}
.beian-link {
  color: #000;
  text-decoration: underline;
  cursor: pointer;
}

#productInduce {
  width: 100%;
  height: calc((1050 / 1080) * 100%);
  background: url("../img/productInduceBg.png") center 0 no-repeat;
  background-size: 100%;
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
}

.block-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 42px;
}

.block-item {
  width: 534px;
  height: 202px;
  background: #ffffff;
  box-shadow: -4px 0px 30px 0px rgba(173, 138, 161, 0.29);
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.part-one {
  width: 430px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.block-icon1 {
  width: 36px;
  height: 36px;
  background-size: 100% 100%;
  background-image: url("http://img.hnypvoice.cn/MTYwNjI4NzY2NTM3MSM5NTgjcG5n.png");
}
.block-title1 {
  font-size: 22px;
  font-family: PingFang SC;
  font-weight: 300;
  color: #ef91db;
  line-height: 24px;
}
.block-icon2 {
  width: 36px;
  height: 36px;
  background-size: 100% 100%;
  background-image: url("http://img.hnypvoice.cn/MTYwNjI4NzY2NTA1MSMzMTgjcG5n.png");
}
.block-title2 {
  font-size: 22px;
  font-family: PingFang SC;
  font-weight: 300;
  color: #ffad74;
  line-height: 24px;
}
.block-icon3 {
  width: 36px;
  height: 36px;
  background-size: 100% 100%;
  background-image: url("http://img.hnypvoice.cn/MTYwNjI4NzY2NTA0NyMzNTcjcG5n.png");
}
.block-title3 {
  font-size: 22px;
  font-family: PingFang SC;
  font-weight: 300;
  color: #f77b9e;
  line-height: 24px;
}
.block-icon4 {
  width: 36px;
  height: 36px;
  background-size: 100% 100%;
  background-image: url("http://img.hnypvoice.cn/MTYwNjI4NzY2NTA1OSM0MjgjcG5n.png");
}
.block-title4 {
  font-size: 22px;
  font-family: PingFang SC;
  font-weight: 300;
  color: #a662f8;
  line-height: 24px;
}

.part-two {
  width: 430px;
  font-size: 18px;
  font-family: PingFang SC;
  font-weight: 300;
  color: #000000;
  line-height: 30px;
  opacity: 0.5;
  margin-top: 16px;
}

/* 关于我们 */
#aboutUs {
  width: 100%;
  height: calc((1050 / 1080) * 100%);
  background: url("../img/aboutUsBg.png") center 0 no-repeat;
  background-size: 100%;
  position: relative;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-direction: column;
}

.click-jump-part {
  width: 20%;
  height: 10%;
}

.about {
  width: 1080px;
  margin: 0 auto 92px;
  font-size: 18px;
  line-height: 34px;
  color: #333;
}
.about__header {
  margin-bottom: 40px;
}
.about__header img {
  width: 157px;
  height: 39px;
}
.about__main {
  margin-bottom: 40px;
}