* {
  padding: 0;
  margin: 0;
}

@font-face {
  font-family: 'Alibaba';
  src: url("../fonts/Alibaba-PuHuiTi-Regular.ttf");
}

@font-face {
  font-family: 'Gilroy-Regular';
  src: url("../fonts/Gilroy-Regular.woff");
}

@font-face {
  font-family: 'Gilroy-Bold';
  src: url("../fonts/Gilroy-Bold.woff");
}

@font-face {
  font-family: 'pingfang';
  src: url("../fonts/400-regular.ttf");
}

html .index_life {
  position: relative;
  height: 100vh;
  z-index: 2;
  overflow-x: hidden;
}

html .index_life .index_life_bg {
  width: 100%;
  height: 100%;
}

html .index_life .index_life_bg .triangle_bg {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 0;
  border-left: 203.33vh solid transparent;
  border-right: 203.33vh solid transparent;
  border-top: 100vh solid #f8faff;
}

html .index_life .container {
  width: 1920px;
  height: 1201px;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

html .index_life .container .wrap {
  position: absolute;
  width: 100%;
  height: 100%;
}

html .index_life .container .wrap .svg-wrap {
  position: absolute;
  width: 1633px;
  height: 943px;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  left: 50%;
  bottom: 0;
}

html .index_life .container .wrap .svg-wrap .st0 {
  opacity: 0.2;
}

html .index_life .container .wrap .svg-wrap .st1 {
  fill: none;
  stroke: #09d8e0;
  stroke-width: 10;
}

html .index_life .container .wrap .svg-wrap .st2 {
  fill: none;
  stroke: #ffffff;
  stroke-dasharray: 4, 2;
}

html .index_life .container .wrap .svg-wrap .stbg0 {
  fill: none;
}

html .index_life .container .wrap .svg-wrap .stbg1 {
  opacity: 3.900000e-02;
  fill: #1F75FE;
  enable-background: new;
}

html .index_life .container .wrap .svg-wrap .stbg2 {
  enable-background: new;
}

html .index_life .container .wrap .svg-wrap .stbg3 {
  fill: none;
  stroke: #D2E3FF;
  stroke-width: 0.9985;
  stroke-miterlimit: 10;
  stroke-dasharray: 3.9959,1.998;
}

html .index_life .container .wrap .svg-wrap .stbg4 {
  fill: #C4D5F0;
}

html .index_life .container .wrap .svg-wrap .stbg5 {
  fill: #EFF5FF;
}

html .index_life .container .wrap .svg-wrap .ball {
  width: 12px;
  height: 12px;
  -webkit-border-radius: 100%;
          border-radius: 100%;
  position: absolute;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#73B5FB), to(#1370E8));
  background-image: -webkit-linear-gradient(#73B5FB, #1370E8);
  background-image: -o-linear-gradient(#73B5FB, #1370E8);
  background-image: linear-gradient(#73B5FB, #1370E8);
  z-index: 20;
  -webkit-transform-origin: 50% 50%;
      -ms-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
}

html .index_life .container .wrap .text {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  top: 0;
  z-index: 11;
}

html .index_life .container .wrap .text ul {
  list-style: none;
}

html .index_life .container .wrap .text ul li {
  position: absolute;
}

html .index_life .container .wrap .text ul li .title {
  -webkit-transform: translateY(-11px);
      -ms-transform: translateY(-11px);
          transform: translateY(-11px);
  font-family: Alibaba;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-transform-origin: 50% 50%;
      -ms-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  will-change: transform;
}

html .index_life .container .wrap .text ul li .title.on {
  -webkit-transform: translateY(-11px) scale(1.2);
      -ms-transform: translateY(-11px) scale(1.2);
          transform: translateY(-11px) scale(1.2);
}

html .index_life .container .wrap .text ul li .title h4 {
  text-align: center;
  font-size: 23px;
  font-weight: 400;
  color: #061E39;
}

html .index_life .container .wrap .text ul li .title p {
  font-size: 16px;
  text-align: center;
  font-weight: 400;
  color: #A9AFC1;
}

html .index_life .container .wrap .text ul li:nth-child(1) {
  left: 29.5%;
  top: 26.2%;
}

html .index_life .container .wrap .text ul li:nth-child(1) .icon {
  width: 270px;
  height: 216px;
}

html .index_life .container .wrap .text ul li:nth-child(2) {
  left: 20.5%;
  top: 41.5%;
}

html .index_life .container .wrap .text ul li:nth-child(2) .icon {
  width: 211px;
  height: 198px;
}

html .index_life .container .wrap .text ul li:nth-child(3) {
  left: 38%;
  top: 44.3%;
}

html .index_life .container .wrap .text ul li:nth-child(3) .title {
  padding-left: 120px;
  -webkit-transform-origin: 70%;
      -ms-transform-origin: 70%;
          transform-origin: 70%;
}

html .index_life .container .wrap .text ul li:nth-child(3) .icon {
  width: 256px;
  height: 254px;
}

html .index_life .container .wrap .text ul li:nth-child(4) {
  left: 48.1%;
  top: 20.7%;
}

html .index_life .container .wrap .text ul li:nth-child(4) .icon {
  width: 147px;
  height: 171px;
}

html .index_life .container .wrap .text ul li:nth-child(5) {
  left: 62%;
  top: 24%;
}

html .index_life .container .wrap .text ul li:nth-child(5) .title {
  -webkit-transform: translateY(50px);
      -ms-transform: translateY(50px);
          transform: translateY(50px);
}

html .index_life .container .wrap .text ul li:nth-child(5) .title.on {
  -webkit-transform: translateY(50px) scale(1.2);
      -ms-transform: translateY(50px) scale(1.2);
          transform: translateY(50px) scale(1.2);
}

html .index_life .container .wrap .text ul li:nth-child(5) .icon {
  width: 210px;
  height: 224px;
}

html .index_life .container .wrap .text ul li:nth-child(6) {
  left: 66.6%;
  top: 49.5%;
}

html .index_life .container .wrap .text ul li:nth-child(6) .title {
  margin-top: 9px;
  padding-left: 5px;
}

html .index_life .container .wrap .text ul li:nth-child(6) .icon {
  width: 220px;
  height: 152px;
}

html .index_life .container .wrap .text ul li:nth-child(7) {
  left: 50.9%;
  top: 57.6%;
}

html .index_life .container .wrap .text ul li:nth-child(7) .title {
  padding-left: 10px;
}

html .index_life .container .wrap .text ul li:nth-child(7) .icon {
  width: 295px;
  height: 220px;
}

html .index_life .container .wrap .text ul li:nth-child(8) {
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  top: 8.4%;
  width: 550px;
  text-align: center;
}

html .index_life .container .wrap .text ul li:nth-child(8) h3 {
  font-size: 42px;
  color: #061E39;
  font-family: Gilroy-Bold;
}

html .index_life .container .wrap .text ul li:nth-child(8) h3 span {
  font-family: Gilroy-Regular;
}

html .index_life .container .wrap .text ul li:nth-child(8) h4 {
  font-size: 42px;
  font-weight: 400;
  font-family: pingfang;
  color: #061E39;
}

html .index_life #app {
  width: 1920px;
  height: 1201px;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 12;
  pointer-events: none;
}
