*{margin: 0;padding: 0; outline: 0 ;}
a{
  text-decoration: none;
}
input::placeholder, textarea::placeholder {
  font-size: 12px;
  color: #000000;
}
body{
  background: #fff;
}
.header{
  width: 100%;
  background: url('./bg.png') no-repeat;
  background-size: 100% 100%;
  background-color: #040B12;
  font-size: 16px;
  color: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 119px;
  margin-bottom: 35px;
} 
.common-box{
  width: 1180px;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.nav-box{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 18px 0 83px;
}
.nav-box .name{
  display: flex;
  align-items: center;
  font-weight: 600;
  font-size: 14px;
  color: #FFFFFF;
}
.nav-box img{
  width: 32px;
  height: 32px;;
  border-radius: 11px;
  margin-right: 5px;
}
.nav-list{
  display: flex;
}
.nav-list a{
  font-size: 12px;
  color: #FFFFFF;
  padding: 7px 16px;
  margin-left: 30px;
}
.nav-list .active, .nav-list a:hover{
  background: #A56BFF;
  border-radius: 14px;
}
.wel{
  width: 100%;
  text-align:center;
  font-weight: bold;
  font-size: 60px;
  color: #FFFFFF;
  line-height: 89px;
  margin-bottom: 60px;
}
.header .text{
  width: 635px;
  line-height: 38px;
  text-align: center;
}
.description{
  margin-bottom: 87px;
}
.title{
  font-weight: bold;
  font-size: 36px;
  color: #333333;
  line-height: 82px;
  text-align: center;
}
.description .con{
  margin-top: 8px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.description h2{
  font-size: 12px;
  color: #333;
  margin-bottom: 20px;
}
.description .text{
  width: 441px;
  font-size: 12px;
  color: #333333;
  line-height: 30px;
}
.line-img{
  width: 17px;
  height: 309px;
}
.des-img{
  width: 494px;
  height: 339px
}
.howtouse{
  width: 100%;
  background: #F5F4F6;
  padding: 26px 0 50px;
  margin-bottom: 62px;
}
.howtouse .list{
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.howtouse .sub-title{
  font-size: 17px;
  color: #A56BFF;
  margin-bottom: 20px
}
.howtouse .sub{
  width: 580px;
  background: #E6DCF7;
  border-radius: 5px;
  padding: 16px 16px 16px 0;
  box-sizing: border-box;
  font-size: 11px;
  color: #000000;
  line-height: 15px;
  display: flex;
  align-items: center;
  margin-bottom: 6px
}
.howtouse img{
  width: 29px;
  height: 29px;
  margin-left: -14px;
  margin-right: 8px;
}
.howtouse h3{
  font-size: 12px;
  color: #000000;
  margin-bottom: 5px
}
.queries{
  margin-bottom: 149px;
}
.queries .list{
  width: 100%;
  display:flex;
  justify-content: space-between;
  align-items: center;
}
.queries-img{
  width: 434px;
  height: 339px
}
.green-line-img{
  width: 17px;
  height: 309px;
}
.queries .wrap{
  width: 476px;
  margin-bottom: 20px;
  font-size: 12px;
  color: #333333;
  line-height: 23px;
}
.queries .wrap h3{
  font-size: 15px;
  color: #333333;
  line-height: 18px;
  margin-bottom: 10px;
}
.footer{
  width: 100%;
  background: url('./footer-img.png') no-repeat;
  background-size: 100% 100%;
  padding: 42px 0 80px;
  font-size: 11px;
  color: #FFFFFF;
}
.footer .common-box{
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}
.footer .left{
  display: flex;
  flex-direction: column;
}
.footer .link{
  display: flex;
  align-items: center;
}
.footer a{
  font-size: 11px;
  color: #FFFFFF;
  line-height: 23px;
  margin-bottom: 23px;
}
.footer .link a{
  margin-right: 109px;
}
.footer a:hover{ text-decoration: underline;}
.footer .right{
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.footer .name{
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: 18px;
  color: #FFFFFF;
  margin-bottom: 25px;
}
.footer .logo{
  width: 50px;
  height: 50px;
  border-radius: 12px;
  margin-right: 20px
}
.about-header{
  background: url('./about-bg.png') no-repeat;
  background-size: 100% 100%;
  padding-bottom: 74px;
  margin-bottom: 0;
}
.about-header .title-des{
  width: 232px;
  height: 56px;
  background: #A56BFF;
  line-height: 56px;
  text-align:center;
  font-size: 43px;
  color: #FFFFFF;
  margin-top: 63px;
}
.about-header .common-box{ align-items: flex-start;}
.about-con{
  width: 100%;
  background: #F4F4F6;
}
.about-con .common-box{
  background: #fff;
  padding: 34px 35px 200px;
  box-sizing: border-box;
  font-weight: bold;
  font-size: 12px;
  color: #333333;
  line-height: 23px;
  text-align:left;
  align-items: flex-start;
}
.about-con .info{
  width: 100%;
  background: #E6DCF7;
  border-radius: 11px;
  padding: 24px;
  box-sizing: border-box;
  margin-top: 23px;
}
.about-con .info p{margin-bottom: 16px;}
.about-header .title-des1{
  width: 300px; 
}
.pri-header{
  background: url('./pri.png') no-repeat;
  background-size: 100% 100%;
}