@charset "utf-8";

* {
  margin: 0;
  padding: 0;
}

html,
body {
  color: #222;
  font-family: Helvetica Neue, PingFang SC, Microsoft YaHei, Helvetica, Arial,
    sans-serif;
  background: #F7F6FB;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

ul,
li {
  list-style: none;
}

img {
  width: 100%;
}

.flex {
  display: flex;
}

.space-between {
  justify-content: space-between;
}

.items-center {
  align-items: center;
}

header {
  position: fixed;
  left: 0;
  right: 0;
  padding: 0.19rem 0;
  background: #F7F6FB;
  color: #222;
  z-index: 10;
}

nav {
  padding: 0 2.27rem 0 0.96rem;
}

.logo img {
  width: 0.72rem;
}

.logo span {
  font-weight: bold;
  font-size: 0.36rem;
  color: #333;
  margin-left: 0.2rem;
}
.link{
  display: flex;
  gap: 0.26rem;
}
.link a {
  background: #7335E8;
  color: #fff;
  padding: 0.18rem 0.42rem;
  border-radius: 0.6rem;
  border: 2px solid #fff;
  font-size: 0.18rem;
  display: block;
}

.link a:hover {
  background: #fff;
  border: 2px solid #7335E8;
  color: #7335E8;
  text-decoration: none;
}

.top-box{
  line-height: 0;
  position: relative;
}

.top-box-inner{
  position: absolute;
  top: 2.2rem;
  left: 1.14rem;
}

h1{
  color: #000;
  font-family: Roboto;
  font-size: 1.9rem;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
  letter-spacing: -0.1rem;
}

.tip{
  color: #666;
  font-size: 0.48rem;
  font-weight: 400;
  line-height: normal;
  margin-top: 0.25rem;
  width: 6.15rem;
}

.img-box{
  line-height: 0;
  width: 7.5rem;
}

.box-info{
  width: 8.67rem;
}

h2{
  color: #000;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #000;
  font-size: 0.64rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  width: 8.67rem;
}

.box1 p, .box2 p{
  color: #666;
  font-size: 0.44rem;
  font-weight: 400;
  line-height: normal;
  margin-top: 0.36rem;
}

.box1{
  padding: 1.05rem 1.22rem 1.05rem 0.63rem;
  gap: 1.18rem;
}  

.box2{
  padding: 1.05rem 1.01rem 1.05rem 1.99rem;
  gap: 1.37rem;
  text-align: right;
}

.box2 .box-info{
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.box2 .box-info h2{
  width: 6.31rem;
} 
 

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