@charset "utf-8";
@import url(format.css);

.page-box {
  max-width: 10rem;
  margin: 0 auto;
  box-sizing: border-box;
}

.head-box {
  width: 100%;
  background: #3d4343;
  color: #fff;
  padding: .4rem .4rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.head-box .h-left {
  display: flex;
  align-items: center;
  font-weight: 400;
}

.head-box .h-left img {
  width: 1.0667rem;
  height: 1.0667rem;
  margin-right: .2133rem;
}

.head-box .h-left .h-left_box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.head-box .h-left .h-left-box .h-name {
  font-size: .4267rem;
}

.head-box .h-left .h-left-box .h-text {
  margin-top: .1067rem;
  font-size: .32rem;
}

.head-box .h-down .h-down-btn {
  color: #fff;
  font-size: .32rem;
  background-color: #05D394;
  border-radius: .8533rem;
  padding: .2133rem .2933rem;
}

.section-one {
  position: relative;
  width: 100%;
  height: 18.6667rem;
}

.section-one img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-one .one-title-box {
  position: absolute;
  top: .4427rem;
  left: .4533rem;
  color: #000;
}

.section-one .one-title-box .one-title {
  font-size: 1.5467rem;
  letter-spacing: .16rem;
  font-weight: bold;
}

.section-one .one-title-box .one-subtitle {
  font-size: 1.0667rem;
  font-weight: 500;
  margin-top: .6667rem;
}

.section-one .one-bottom {
  position: absolute;
  bottom: 3.9rem;
  left: 50%;
  transform: translateX(-50%);
}

.section-one .one-bottom .d-btn {
    color: #fff;
    display: flex;
    align-items: center;
    padding: .32rem 1.3333rem;
    font-size: .6467rem;
    font-weight: 500;
    background-color: #05D394;
    border-radius: .8533rem;
    white-space: pre;
}

.marginB28 {
  margin-bottom: .7467rem;
}

.line {
  width: 100%;
  height: .0533rem;
  background-color: #000;
}

.section-one .one-bottom .d-btn img {
  width: .6667rem;
  height: .6667rem;
  margin-right: .1333rem;
}

.section-two {
  padding: 1.3333rem .4rem;
}

.section-two .t-subtitle {
  font-size: .4933rem;
  color: #1A8CFF;
}

.section-two .t-title {
  margin-top: .4267rem;
  color: var(--Colors-Basic-Color-1, #12022F);
  font-weight: 600;
  font-size: .64rem;
}

.section-two .t-list {
  margin-top: 1.28rem;
}

.section-two .t-list .t-list-item {
  margin-bottom: .8rem;
  display: flex;
  align-items: center;
}

.section-two .t-list .t-list-item .item-icon {
  background-color: #05D394;
  border-radius: .5333rem;
  width: 1.7067rem;
  height: 1.7067rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-right: .64rem;
}

.section-two .t-list .t-list-item .item-icon img {
  width: .6667rem;
  height: .6667rem;
}

.section-two .t-list .t-list-item:last-child {
  margin-bottom: 0;
}

.section-two .t-list .t-list-item .item-right {
  flex: 1;
  min-width: 0;
}

.section-two .t-list .t-list-item .item-right .r-title {
  color: var(--Colors-Basic-Color-1, #12022F);
  font-size: .5333rem;
  font-weight: 500;
  font-weight: 600;
}

.section-two .t-list .t-list-item .item-right .r-subtitle {
  color: var(--Colors-Basic-Color-2, #594D6D);
  font-size: .3733rem;
  margin-top: .1067rem;
}

.section-two .t-header {
  display: flex;
  align-items: center;
  margin-top: 1.0667rem;
}

.section-two .t-header img {
  width: 1.28rem;
  height: 1.28rem;
  margin-right: .4267rem;
}

.section-two .t-header .t-header-right {
  flex: 1;
  min-width: 0;
}

.section-two .t-header .t-header-right .h-title {
  font-size: .4267rem;
  font-weight: 600;
  color: #12022F;
}

.section-two .t-header .t-header-right .h-subtitle {
  font-size: .3733rem;
  color: #594D6D;
  margin-top: .2133rem;
}

.section-two .image-box {
  margin-top: 1.8667rem;
}

.section-two .image-box img {
  width: 100%;
  object-fit: cover;
}

.section-three {
  padding: 1.28rem .4rem;
  background-color: #05D394;
  color: #fff;
  text-align: center;
}

.section-three .avatar-list {
  padding: 0 1.8667rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.section-three .avatar-list img:nth-child(2) {
  width: 1.92rem;
  height: 1.92rem;
}

.section-three .avatar-list img:nth-child(1), .section-three .avatar-list img:nth-child(3) {
  width: 1.28rem;
  height: 1.28rem;
}

.section-three .three-desc {
  margin-top: 1.28rem;
  font-size: .48rem;
  font-weight: 500;
}

.section-three .three-user {
  font-size: .4267rem;
  margin-top: .5333rem;
}

.section-three .three-source {
  font-size: .3733rem;
  opacity: 0.5;
  margin-top: .1333rem;
}

.section-four {
  padding: .4rem;
}

.section-four .f-header {
  display: flex;
  align-items: center;
}

.section-four .f-header img {
  width: .8533rem;
  height: .8533rem;
  margin-right: .16rem;
}

.section-four .f-header .f-name {
  color: #333;
  font-size: .5867rem;
  font-weight: 600;
}

.section-four .download-btn {
  display: block;
  color: #fff;
  font-size: .4267rem;
  font-weight: 500;
  background-color: #05D394;
  border-radius: .7467rem;
  width: 100%;
  height: 1.4933rem;
  line-height: 1.4933rem;
  text-align: center;
  margin-top: 1.0667rem;
}

.section-four .mail-text {
  margin-top: 1.3333rem;
  font-size: .4267rem;
  text-align: center;
  font-weight: 400;
}

.section-four .f-line {
  width: 100%;
  height: .0267rem;
  background-color: #E7E5EA;
  margin-top: .5333rem;
}

.section-four .f-menu {
  display: flex;
  align-items: center;
  margin-top: 1.28rem;
}

.section-four .f-menu .menu-title {
  font-size: .3733rem;
  margin-right: .8rem;
}

.section-four .version {
  font-size: .3733rem;
  color: #594D6D;
  margin-top: .8rem;
  margin-left: .5333rem;
}