@font-face {
  font-family: "MiSans";
  src: url("../font/MiSans-Normal.ttf");
}
@font-face {
  font-family: "PingFang SC";
  src: url("../font/PingFangSC.ttf");
}

body {
  margin: 0;
  position: absolute;
  width: 100vw;
  overflow-x: hidden;
}

.page * {
  box-sizing: border-box;
  margin: 0;
}

.page a {
  text-decoration: none;
}

.page ul,
.page ol {
  list-style: none;
}

body > .page {
  font-family: "MiSans";
  margin: 0;
  position: relative;
  width: 100vw;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.page > div {
  position: relative;
}

/** head */
.head {
  background-image: url("../images/head@2x.png");
  background-size: 100%;
  background-repeat: no-repeat;
  top: 0;
  width: 100vw;
  height: 31.25vw;
  padding-left: 18.75vw;
  padding-top: 9.114583333333334vw;
  color: #ffffff;
}

.head > h1 {
  font-family: MiSans;
  font-size: 2.1875vw;
  font-weight: 600;
  line-height: 2.604166666666667vw;
}

.head > h2 {
  font-family: MiSans;
  font-size: 2.916666666666667vw;
  font-weight: 600;
  line-height: 2.604166666666667vw;
  margin: 1.0416666666666667vw 0 3.125vw 0;
}

.head > a {
  width: 9.166666666666668vw;
  height: 3.125vw;
  padding: 0.7291666666666667vw 2.0833333333333335vw;
  border-radius: 1.6666666666666667vw;
  background: #ffffff;
  display: block;
  color: #2a91ff;
  font-size: 1.25vw;
  font-weight: 500;
  margin-top: 2.604166666666667vw;
}

/** head END */
/** calculate */
.calculate {
  width: 100vw;
  overflow: hidden;
  color: #000000;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 0.10416666666666667vw;
}
.calculate > img {
  width: 47.395833333333336vw;
  margin: 1.875vw 0;
}
.calculate > h2 {
  font-size: 1.6666666666666667vw;
  font-weight: 500;
  line-height: normal;
  text-align: center;
  margin-bottom: 1.5625vw;
}
.calculate > div {
  display: flex;
}

.calculate form {
  border-radius: 1.1458333333333335vw;
  background-image: linear-gradient(to top, var(--color), var(--color2));
  margin: 0.625vw;
}
.calculate ul {
  margin: 0.10416666666666667vw;
  background-color: #fff;
  border-radius: 1.0416666666666667vw;
  width: 30.416666666666668vw;
  height: calc(100% - 0.20833333333333334vw);
  padding: 1.09375vw 1.7708333333333335vw;
}

.calculate li {
  padding: 0.8333333333333334vw 0;
  border-bottom: 0.052083333333333336vw #d8d8d8 solid;
  display: flex;
  flex-direction: column;
}

.calculate h3 {
  color: #292a2f;
  font-size: 1.6666666666666667vw;
  font-weight: 600;
  font-family: "PingFang SC";
  line-height: 2.604166666666667vw;
}
.calculate h4 {
  color: #292a2f;
  font-size: 1.0416666666666667vw;
  font-weight: 500;
  font-family: "PingFang SC";
  line-height: 1.875vw;
  white-space: nowrap;
}

.calculate label input {
  width: 0.8333333333333334vw;
  height: 0.8333333333333334vw;
  margin-right: 0.625vw;
  accent-color: var(--color);
}

.calculate label {
  color: #505668;
  font-size: 0.8333333333333334vw;
  font-weight: 400;
  font-family: "PingFang SC";
  height: 2.291666666666667vw;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.calculate button {
  line-height: 1.6666666666666667vw;
  opacity: 1;
  color: #ffffff;
  font-size: 1.25vw;
  font-weight: 500;
  font-family: "MiSans";
  width: 100%;
  border: 0;
  margin-top: 3.125vw;
  height: 3.125vw;
  border-radius: 1.6666666666666667vw;
  opacity: 1;
  background: var(--color);
  cursor: pointer;
}

.calculate h5 {
  width: 100%;
  text-align: center;
  color: #292a2f;
  font-size: 1.0416666666666667vw;
  font-weight: 500;
  font-family: "PingFang SC";
  line-height: 2.8125vw;
  margin-top: 0.3125vw;
}
.calculate h5 span {
  font-size: 1.875vw;
  font-weight: 700;
  font-family: "MiSans";
  color: var(--color);
  margin-right: 0.8333333333333334vw;
}
.calculate h6 {
  color: #9e9e9e;
  text-align: center;
  font-size: 0.8333333333333334vw;
  font-weight: 500;
  font-family: "PingFang SC";
  margin: 0.3125vw 0 2.291666666666667vw 0;
}
/** calculate END */

.statement {
  color: #a7a7a7;
  text-align: center;
  width: 100%;
  font-size: 1.0416666666666667vw;
  font-weight: 400;
  font-family: "MiSans";
  margin: 0.625vw 0;
}

.more {
  border-radius: 1.1458333333333335vw;
  background-image: linear-gradient(to right bottom, #2a68ff, #72c6fb);
  width: 62.5vw;
  margin: 0.625vw;
}

.more > div {
  margin: 0.10416666666666667vw;
  background-color: #fff;
  border-radius: 1.0416666666666667vw;
  padding: 2.0833333333333335vw;
}

.more img {
  width: 7.395833333333334vw;
  height: 7.395833333333334vw;
  border-radius: 0.625vw;
}

.more > div {
  display: flex;
}

.more .main {
  margin: 0.8333333333333334vw 0 0 1.25vw;
}

.more .main h2 {
  color: #292a2f;
  font-size: 1.6666666666666667vw;
  font-weight: 600;
  font-family: "PingFang SC";
  line-height: 1.875vw;
}
.more .main h3 {
  color: #292a2f;
  font-size: 1.0416666666666667vw;
  font-weight: 500;
  font-family: "PingFang SC";
  margin-top: 1.25vw;
  line-height: 1.4583333333333335vw;
}
.more .main h3 a {
  color: #2a68ff;
}