@charset "utf-8";

* {
  margin: 0;
  padding: 0;
}
html,
body {
  color: #000;
  font-family: Helvetica Neue, PingFang SC, Microsoft YaHei, Helvetica, Arial,
    sans-serif;
  height: 100%;
}
a {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}
a:any-link {
  color: unset;
}
ul,
li {
  list-style: none;
}
img{
  width: 100%;
}

header{
  position: fixed;
  left:0;
  right:0;
  background: #fff;
}

nav{
  padding: 0.8rem 1.3rem 0.43rem;
  display: flex;
  justify-content: space-between;
}

.logo{
  display: flex;
  align-items: center;
  color: #000;
  font-size: 0.36rem;
  font-weight: 600;
  gap: 0.28rem;
}

.logo img{
  width: 0.56rem;
}

.menu{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.4rem;
}

.menu a{
  display: block;
  border-radius: 0.4rem;
  border: 2px solid #3E55FF;
  font-weight: 500;
  font-size: 0.16rem;
  color: #3E55FF;
  padding: 0.14rem 0.24rem;
}

.menu a:hover{
  background: #3E55FF;
  color:#fff;
}

.top{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 0.33rem 0.19rem 1.3rem;
  padding-top: 1.78rem;
}

.top-l h1{
  font-weight: 500;
  font-size: 1.10rem;
  color: #000000;
  line-height: 1.54rem;
  flex:1;
}

.top-l p{
  font-size: 0.4rem;
  color: #4C4C4C;
  line-height: 0.48rem;
  margin: 0.19rem 0 0.6rem;
}

.top-l .download-btn{
  background: #3E55FF;
  border-radius: 8px 8px 8px 8px;
  font-weight: 500;
  font-size: 0.26rem;
  color: #FFFFFF;
  padding: 0.16rem 1rem;
}
.top-r{
  line-height: 0;
}
.top-r img{
  width: 9.78rem;
}

.features{
  background: linear-gradient( 270deg, #5EBDFF 0%, #165DFF 100%);
  display: flex;
  justify-content: space-between;
  padding: 1.7rem 1.28rem 0 1.1rem;
 
}

.features-l h2{
  font-size: 0.53rem;
  color: #FFFFFF;
  line-height: 0.64rem;
  font-weight: 600;
}

.features-l p{
  font-weight: 400;
  font-size: 0.4rem;
  color: rgba(255,255,255,0.8);
  line-height: 0.48rem;
  width: 6.74rem;
  margin-top: 0.4rem;
}
.features-r-t{
  display: flex;
  justify-content: space-between; 
  gap: 0.3rem;
  margin-bottom: 0.6rem;
}

.features-box{
  background: #fff;
  border-radius: 0.48rem;
  padding: 0.37rem 0.16rem 0.42rem;
  width: 2.56rem;
  border: 2px solid #fff;  
}

.features-box img{
  width: 0.52rem;
  display: block;
}

.features-box h4{
  font-weight: 500;
  font-size: 0.24rem;
  color: #1A1A1A;
  margin: 0.13rem 0 0.24rem;
}

.features-box p{
  font-weight: 400;
  font-size: 0.2rem;
  color: #1A1A1A;
}

.features-r-b{
  display: flex;
  justify-content: center;
  gap: 0.3rem;
  margin-bottom: -0.72rem;
}

.features-r-b .features-box{
  box-shadow: 0px 4px 33px 0px rgba(0,0,0,0.12);
}

.why{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 1.32rem;
}

.why-l{
  line-height: 0;
}

.why-l img{
  width: 7.84rem;
}

.why-r{
  margin-left: 0.15rem;
  flex: 1;
}

.why-r h2{
  font-weight: 500;
  font-size: 0.52rem;
  color: #000000;
  line-height: 0.73rem;
}

.why-r img{
  width: 0.42rem;
}

.why-r span{
  font-weight: 500;
  font-size: 0.24rem;
  color: #000;
  line-height: 0.34rem;
  margin-left: 0.04rem;
}

.why-r-info{
  display: flex;
  justify-content: space-between;
}

.why-r-list{
  display: flex;
  flex-direction: column;
}

.why-r-list > div{
  display: flex;
  align-items: center;
  margin-top: 0.95rem;
}

.why-r-list > div:nth-child(2){
 
}

@media screen and (max-width: 640px) {
}