html,
body {
  padding: 0px;
  margin: 0px;
  background: #f1f5fe;
}
@font-face {
  font-family: "MiSans Normal";
  src: url(../font/misans/MiSans-Normal.ttf);
  font-display: swap;
}
@font-face {
  font-family: "MiSans Heavy";
  src: url(../font/misans/MiSans-Heavy.ttf);
  font-display: swap;
}
@font-face {
  font-family: "MiSans Medium";
  src: url(../font/misans/MiSans-Medium.ttf);
  font-display: swap;
}
@font-face {
  font-family: "SourceHanSansCN Regular";
  src: url(../font/SourceHanSansCN/SourceHanSansCN-Regular.otf);
  font-display: swap;
}
@font-face {
  font-family: "SourceHanSansCN Bold";
  src: url(../font/SourceHanSansCN/SourceHanSansCN-Bold.otf);
  font-display: swap;
}
@font-face {
  font-family: "SourceHanSansCN Normal";
  src: url(../font/SourceHanSansCN/SourceHanSansCN-Normal.otf);
  font-display: swap;
}
.bold-font {
  text-shadow: 0.3px 0 currentColor, -0.3px 0 currentColor, 0 0.3px currentColor,
    0 -0.3px currentColor;
}

/* Banner */
.banner {
  font-size: calc((64 / 1800) * 100vw);
  width: 100%;
  height: calc((900 / 1800) * 100vw);
  background: url("../img/banner_v2.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.banner .banner-bg {
  width: 100%;
  display: block;
}
.banner .banner-container {
}
.banner .banner-container .logo {
  padding-left: calc((200 / 1800) * 100vw);
  padding-top: calc((52 / 1800) * 100vw);
  width: calc((206 / 1800) * 100vw);
  display: block;
}
.banner .banner-container .hreo-text {
  padding-left: calc((212 / 1800) * 100vw);
  padding-top: calc((144 / 1800) * 100vw);
}
.banner .banner-container .hreo-text span {
  font-weight: 400;
  font-size: calc((64 / 1800) * 100vw);
  color: #ffffff;
}
.banner .banner-container .hreo-text .left-hero-text {
  font-family: "MiSans Normal";
}
.banner .banner-container .hreo-text .right-hero-text {
  font-family: "MiSans Heavy";
}
.banner .banner-container .sub-title {
  font-family: "MiSans Medium";
  display: block;
  margin-top: calc((34 / 1800) * 100vw);
  padding-left: calc((212 / 1800) * 100vw);
  font-size: calc((70 / 1800) * 100vw);
  background: -webkit-linear-gradient(
    180deg,
    #a5def4 0%,
    #98dbf8 52%,
    #b4e1f5 78%,
    #8bd9fb 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.banner .banner-container .bottom-title {
  margin-top: calc((154 / 1800) * 100vw);
  letter-spacing: calc((12 / 1800) * 100vw);
  padding-left: calc((216 / 1800) * 100vw);
  font-weight: 400;
}
.banner .banner-container .bottom-title span {
  font-family: "SourceHanSansCN Regular";
  line-height: calc((54 / 1800) * 100vw);
  font-weight: 400;
  font-size: calc((22 / 1800) * 100vw);
  display: block;
}
.banner .banner-container .to-icon {
  margin: calc((108 / 1800) * 100vw) auto 0px;
  width: calc((40 / 1800) * 100vw);
  padding-left: calc((880 / 1800) * 100vw);
}

/* 关于我们 */
.about-us {
  width: 100%;
  padding-left: calc((220 / 1800) * 100vw);
  padding-top: calc((154 / 1800) * 100vw);
  padding-bottom: calc((106 / 1800) * 100vw);
  background: #f1f5fe;
  display: flex;
  align-items: flex-start;
  box-sizing: border-box;
}
.about-us .xfh-logo {
  width: calc((510 / 1800) * 100vw);
  margin-right: calc((84 / 1800) * 100vw);
}
.about-us .mobile-xfh-logo {
  display: none;
}
.about-us .container {
  width: calc((740 / 1800) * 100vw);
  display: flex;
  flex-direction: column;
}
.about-us .container .about-us-icon {
  width: calc((439 / 1800) * 100vw);
  display: block;
  margin-bottom: calc((16 / 1800) * 100vw);
}
.about-us .container .about-us-text-1,
.about-us .container .about-us-text-2 {
  font-family: "SourceHanSansCN Normal";
  font-weight: 400;
  font-size: calc((16 / 1800) * 100vw);
}
.about-us .container .about-us-text-2 {
  margin-top: calc((52 / 1800) * 100vw);
}
.about-us .container .about-us-text-1 span,
.about-us .container .about-us-text-2 span {
  font-family: "SourceHanSansCN Bold";
}

/* 鑫福花APP下载 */
.xfh-app-mobile-pic {
  display: none;
}
.xfh-app {
  width: 100%;
  height: calc((700 / 1800) * 100vw);
  display: flex;
  /* background: url("../img/xfh-app-bg.png"); */
  background: url("../img/xfh_app_mobile.png");
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: right top;
  box-sizing: border-box;
  padding-left: calc((245 / 1800) * 100vw);
  flex-direction: column;
}
.xfh-app .xfh-app-icon {
  padding-top: calc((27 / 1800) * 100vw);
  width: calc((439 / 1800) * 100vw);
  display: block;
  margin-bottom: calc((38 / 1800) * 100vw);
}
.xfh-app .xfh-app-service-text-1,
.xfh-app .xfh-app-service-text-2 {
  font-family: "SourceHanSansCN Normal";
  font-weight: 400;
  font-size: calc((16 / 1800) * 100vw);
  color: #25344a;
  line-height: calc((30 / 1800) * 100vw);
}
.xfh-app .xfh-app-service-text-1 span,
.xfh-app .xfh-app-service-text-2 span {
  font-family: "SourceHanSansCN Bold";
}
.xfh-app .xfh-app-service-text-2 {
  margin-top: calc((18 / 1800) * 100vw);
  line-height: calc((24 / 1800) * 100vw);
}
.qrcode {
  margin-top: calc((112 / 1800) * 100vw);
  display: flex;
  flex-direction: row;
}
.qrcode .qrcode-img {
  width: calc((180 / 1800) * 100vw);
  margin-right: calc((44 / 1800) * 100vw);
}
.qrcode .down-btn {
  width: calc((160 / 1800) * 100vw);
  height: calc((54 / 1800) * 100vw);
  background: linear-gradient(171deg, #4fa1fd 0%, #3e70fc 100%);
  border-radius: calc((28 / 1800) * 100vw);
  margin-top: calc((109 / 1800) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.down-text {
  font-family: "SourceHanSansCN Normal";
  font-weight: 400;
  font-size: calc((16 / 1800) * 100vw);
  color: #ffffff;
  margin-right: calc((4 / 1800) * 100vw);
}
.down-icon {
  width: calc((18 / 1800) * 100vw);
  height: calc((18 / 1800) * 100vw);
}

/* 主营业务 */
.business {
  width: 100%;
  height: calc((800 / 1800) * 100vw);
  background: url("../img/business_bg.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: calc((64 / 1800) * 100vw);
  /* padding-left: calc((236 / 1800) * 100vw);
  padding-right: calc((236 / 1800) * 100vw); */
  /* padding-right: calc((230 / 1800) * 100vw); */
  box-sizing: border-box;
}
.business .business-title {
  font-family: "SourceHanSansCN Bold";
  font-size: calc((28 / 1800) * 100vw);
  color: #306dff;
  padding: 0px;
  margin: 0;
  margin-bottom: calc((20 / 1800) * 100vw);
  width: 100%;
  text-align: center;
}
.business .business-subtitle {
  font-family: "SourceHanSansCN Normal";
  font-size: calc((16 / 1800) * 100vw);
  color: #25344a;
  line-height: calc((24 / 1800) * 100vw);
  margin-bottom: calc((50 / 1800) * 100vw);
}
.business .business-subtitle span {
  font-family: "SourceHanSansCN Bold";
}
.business .business-list {
  display: flex;
  flex-wrap: wrap;
  padding-left: calc((230 / 1800) * 100vw);
}
.business .business-item {
  width: calc((400 / 1800) * 100vw);
  height: calc((242 / 1800) * 100vw);
  position: relative;
  margin-right: calc((60 / 1800) * 100vw);
  margin-top: calc((24 / 1800) * 100vw);
}
.business .business-item:nth-child(3n + 3) {
  margin-right: 0px;
}
.business .business-item .item-icon {
  position: absolute;
  padding-left: calc((148 / 1800) * 100vw);
  width: calc((104 / 1800) * 100vw);
  top: 0px;
}
.business .business-item .business-item-container {
  margin-top: calc((42 / 1800) * 100vw);
  height: calc((200 / 1800) * 100vw);
  background: linear-gradient(172deg, #dae9ff 0%, #e1f1fd 48%, #e5f9ff 98%);
  border-radius: calc((26 / 1800) * 100vw);
  box-sizing: border-box;
  padding-top: calc((98 / 1800) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.business .business-item-container .item-title {
  font-family: "SourceHanSansCN Bold";
  font-size: calc((20 / 1800) * 100vw);
  color: #25344a;
}
.business .business-item-container .item-text {
  font-family: "MiSans Normal";
  margin-top: calc((19 / 1800) * 100vw);
  font-weight: 400;
  font-size: calc((14 / 1800) * 100vw);
  color: #25344a;
  text-align: center;
}

/* 愿景使命 */
.vision-mission {
  margin-top: calc((146 / 1800) * 100vw);
  width: 100%;
  height: calc((800 / 1800) * 100vw);
  background: url("../img/vision_bg.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding-top: calc((257 / 1800) * 100vw);
  padding-right: calc((190 / 1800) * 100vw);
  padding-left: calc((269 / 1800) * 100vw);
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
}
.vision .vision-icon {
  width: calc((281 / 1800) * 100vw);
  margin-bottom: calc((20 / 1800) * 100vw);
}
.mission .mission-icon {
  width: calc((353 / 1800) * 100vw);
  margin-bottom: calc((20 / 1800) * 100vw);
}
.vision-mission .vision-mission-text {
  display: flex;
  flex-direction: column;
}
.vision-mission .vision-mission-text {
  font-family: "SourceHanSansCN Regular";
  font-weight: 400;
  font-size: calc((28 / 1800) * 100vw);
  color: #2973eb;
  line-height: calc((54 / 1800) * 100vw);
}

/* 备案信息 */
.beian-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: calc((67 / 1800) * 100vw);
  padding-bottom: calc((56 / 1800) * 100vw);
}
.copyright,
.beian-1,
.beian-2 {
  font-family: "SourceHanSansCN Regular";
  font-weight: 400;
  font-size: calc((14 / 1800) * 100vw);
  color: #b3bbc7;
  line-height: calc((22 / 1800) * 100vw);
}
.beian-1 a {
  color: #b3bbc7;
  text-decoration: none;
}

/* 媒体查询 */
@media screen and (max-width: 1400px) {
  /* 主营业务 */
  .business .business-item .business-item-container {
    padding-top: calc((80 / 1800) * 100vw);
    padding-left: calc((20 / 1800) * 100vw);
    padding-right: calc((20 / 1800) * 100vw);
  }
  .business .business-item-container .item-text {
    margin-top: calc((10 / 1800) * 100vw);
  }
}
@media screen and (max-width: 1200px) {
  /* 关于我们 */
  .about-us {
    padding-top: calc((154 / 1200) * 100vw);
    padding-bottom: calc((154 / 1200) * 100vw);
    align-items: center;
  }
  .about-us .container {
    width: calc((830 / 1800) * 100vw);
    display: flex;
    flex-direction: column;
  }
  .about-us .container .about-us-icon {
    width: calc((439 / 1400) * 100vw);
    margin-bottom: calc((16 / 1400) * 100vw);
  }
  .about-us .container .about-us-text-2 {
    margin-top: calc((30 / 1800) * 100vw);
  }
  /* 主营业务 */
  .business {
    padding-top: calc((80 / 800) * 100vw);
    padding-bottom: calc((80 / 800) * 100vw);
    height: auto;
  }
  .business .business-title {
    font-size: calc((28 / 1200) * 100vw);
    margin-bottom: calc((20 / 1200) * 100vw);
  }
  .business .business-subtitle {
    font-size: calc((16 / 1200) * 100vw);
    line-height: calc((24 / 1200) * 100vw);
    margin-bottom: calc((50 / 1200) * 100vw);
  }
  /* 备案信息 */
  .beian-info {
    padding-top: calc((67 / 1200) * 100vw);
    padding-bottom: calc((56 / 1200) * 100vw);
  }
  .copyright,
  .beian-1,
  .beian-2 {
    font-size: calc((20 / 1800) * 100vw);
    line-height: calc((32 / 1800) * 100vw);
  }
}
@media screen and (max-width: 900px) {
  /* 鑫福花APP下载 */
  .xfh-app .xfh-app-service-text-1,
  .xfh-app .xfh-app-service-text-2 {
    line-height: calc((40 / 1800) * 100vw);
  }
  /* 主营业务 */
  .business .business-item .business-item-container {
    padding-top: calc((70 / 1800) * 100vw);
  }
  .business .business-item-container .item-text {
    margin-top: calc((5 / 1800) * 100vw);
  }
}
@media screen and (max-width: 800px) {
  /* Banner */
  .to-icon {
    display: none;
  }
  /* 关于我们 */
  .about-us {
    width: 100%;
    padding-left: calc((165 / 1200) * 100vw);
    padding-right: calc((165 / 1200) * 100vw);
    padding-bottom: calc((106 / 1200) * 100vw);
    background: #f1f5fe;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
  }
  .about-us .xfh-logo {
    display: none;
  }
  .about-us .mobile-xfh-logo {
    display: block;
    width: 100%;
  }
  .about-us .container {
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  .about-us .container .about-us-icon {
    width: 100%;
    margin-bottom: calc((16 / 1000) * 100vw);
  }
  .about-us .container .about-us-text-1,
  .about-us .container .about-us-text-2 {
    font-weight: 400;
    font-size: calc((28 / 1000) * 100vw);
    line-height: calc((40 / 1000) * 100vw);
  }
  .about-us .container .about-us-text-2 {
    margin-top: calc((48 / 1000) * 100vw);
  }

  /* 鑫福花APP下载 */
  .xfh-app-mobile .xfh-app-mobile-pic {
    display: block;
    width: 100%;
    padding-left: calc((165 / 1200) * 100vw);
    padding-right: calc((165 / 1200) * 100vw);
    box-sizing: border-box;
    margin-top: 20px;
    margin-bottom: 10px;
  }
  .xfh-app {
    background: none;
    padding-left: calc((165 / 1200) * 100vw);
    padding-right: calc((165 / 1200) * 100vw);
    height: auto;
  }
  .xfh-app .xfh-app-icon {
    width: 100%;
    margin-bottom: calc((32 / 1000) * 100vw);
  }
  .xfh-app .xfh-app-service-text-1,
  .xfh-app .xfh-app-service-text-2 {
    font-size: calc((28 / 1000) * 100vw);
    line-height: calc((40 / 1000) * 100vw);
  }
  .xfh-app .xfh-app-service-text-2 {
    margin-top: calc((32 / 1000) * 100vw);
  }
  .qrcode {
    margin-top: calc((112 / 1000) * 100vw);
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .qrcode .qrcode-img {
    width: calc((400 / 800) * 100vw);
    margin-right: 0px;
  }
  .qrcode .down-btn {
    width: 100%;
    height: calc((80 / 800) * 100vw);
    border-radius: calc((40 / 800) * 100vw);
    margin-top: calc((109 / 1000) * 100vw);
  }
  .down-text {
    font-weight: 400;
    font-size: calc((32 / 800) * 100vw);
    margin-right: calc((10 / 800) * 100vw);
  }
  .down-icon {
    width: calc((36 / 800) * 100vw);
    height: calc((36 / 800) * 100vw);
  }

  /* 主营业务 */
  .business {
    height: auto;
    background: none;
    padding-top: calc((80 / 800) * 100vw);
    padding-left: calc((165 / 1200) * 100vw);
    padding-right: calc((165 / 1200) * 100vw);
  }
  .business .business-title {
    text-align: left;
    font-size: calc((40 / 800) * 100vw);
    margin-bottom: calc((16 / 600) * 100vw);
  }
  .business .business-subtitle {
    font-size: calc((28 / 800) * 100vw);
    line-height: calc((24 / 800) * 100vw);
    margin-bottom: calc((80 / 800) * 100vw);
    display: block;
    width: 100%;
    text-align: left;
  }
  .business .business-list {
    display: flex;
    flex-wrap: wrap;
    padding-left: 0px;
  }
  .business .business-item {
    width: 100%;
    height: calc((400 / 800) * 100vw);
    margin-right: 0px;
    margin-top: calc((30 / 800) * 100vw);
  }
  .business .business-item .item-icon {
    padding-left: calc(50% - 40px);
    width: 80px;
  }
  .business .business-item .business-item-container {
    margin-top: 40px;
    height: calc((300 / 800) * 100vw);
    border-radius: calc((26 / 800) * 100vw);
    padding: 60px 20px 0px;
  }
  .business .business-item-container .item-title {
    font-size: calc((28 / 800) * 100vw);
    color: #25344a;
  }
  .business .business-item-container .item-text {
    margin-top: calc((19 / 800) * 100vw);
    font-size: calc((24 / 800) * 100vw);
  }

  /* 愿景使命 */
  .vision-mission {
    margin-top: calc((146 / 1800) * 100vw);
    height: auto;
    background-size: auto 100%;
    background-position: center bottom;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom: calc((257 / 1800) * 100vw);
  }
  .vision .vision-icon {
    width: calc((281 / 1000) * 100vw);
    margin-bottom: calc((20 / 800) * 100vw);
  }
  .mission .mission-icon {
    width: calc((353 / 1000) * 100vw);
    margin-bottom: calc((20 / 800) * 100vw);
  }
  .vision-mission .vision-mission-text {
    display: flex;
    flex-direction: column;
  }
  .vision-mission .vision-mission-text {
    font-weight: 400;
    font-size: calc((28 / 800) * 100vw);
    color: #2973eb;
    line-height: calc((54 / 800) * 100vw);
  }

  /* 备案信息 */
  .beian-info {
    padding-top: calc((67 / 800) * 100vw);
    padding-bottom: calc((56 / 800) * 100vw);
  }
  .copyright,
  .beian-1,
  .beian-2 {
    font-size: calc((24 / 800) * 100vw);
    line-height: calc((36 / 800) * 100vw);
  }
}
