.universal {
  position: relative;
}
.opacity-background {
  background: url('./../../img/product/columba/special-background.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.relative-box {
  position: relative;
}
.universal .title {
  font-size: 0.50rem;
  font-weight: 500;
  color: #1E1E1E;
  line-height: 0.50rem;
}

.universal .content-text {
  font-size: 0.28rem;
  font-weight: 500;
  color: #323232;
  line-height: 0.28rem;
}

.universal  .theme-color {
  color: #2BA69D;
}
/* home */
.home {
  text-align: center;
  height: 8.34rem;
  padding-top: 1.19rem;
  background: linear-gradient(180deg, #FFFFFF 0%, #ECF3F8 68%, #E9ECF1 70%, #F3F5F7 85%, #FFFFFF 100%);
}
.home .title {
  font-size: 0.48rem;
  font-weight: bold;
  color: #000000;
  line-height: 0.48rem;
}
.home .subtitle {
  font-size: 0.24rem;
  font-weight: bold;
  color: #888889;
  margin-top: 0.18rem;
  line-height: 0.24rem;
}
.home .slogan {
  width: 2.32rem;
  height: 0.46rem;
  background: #D4F0FC;
  border-radius: 0.20rem;
  line-height: 0.46rem;
  font-size: 0.30rem;
  font-weight: 500;
  color: #005C6A;
  margin: 0.40rem auto 0;
}
.home .columba {
  width: 4.44rem;
  height: 3.08rem;
  margin: 1.15rem auto 0;
}

/* industry */
.industry {
  height: 10.82rem;
  padding-top: 0.87rem;
  text-align: center;
  box-sizing: border-box;
}
.industry .slogan {
  font-size: 0.60rem;
  font-weight: 400;
  color: #1E1E1E;
  line-height: 0.60rem;
  font-family: 'SourceHanSansCN-Normal';
}
.industry .line {
  width: 2.85rem;
  height: 0.04rem;
  background: linear-gradient(90deg, #C8EFFF 0%, #3EE2D6 50%, #C8EFFF 100%);
  border-radius: 0.08rem;
  margin: 0.40rem auto 0;
}
.industry .title {
  margin-top: 0.80rem;
  line-height: 0.50rem;
}

.industry .describe {
  width: 3.78rem;
  height: 1.58rem;
  padding-top: 0.28rem;
  text-align: center;
  background: url('./../../img/product/columba/round-background.png');
  margin: 0.48rem auto 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.industry .describe > p > span {
  font-size: 0.42rem;
  line-height: 0.42rem;
}
.industry .describe > p:nth-child(2) {
  margin-top: 0.20rem;
  color: #000000;
}
.industry img {
  width: 7.50rem;
  height: 10.82rem;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}

/* innovate */
.innovate {
  text-align: left;
  padding-top: 1.20rem;

}
.innovate .slogan {
  font-size: 0.66rem;
  font-weight: 400;
  color: #1E1E1E;
  letter-spacing: 0.04rem;
  text-align: center;
  line-height: 0.66rem;
  font-family: 'SourceHanSansCN-Normal';
}
.innovate .line {
  width: 2.85rem;
  height: 0.04rem;
  background: linear-gradient(90deg, #C8EFFF 0%, #3EE2D6 50%, #C8EFFF 100%);
  border-radius: 0.08rem;
  margin: 0.40rem auto 0;
}
.innovate .title {
  margin-top: 0.80rem;
  text-align: center;
  padding-left: 0.30rem;
}
.innovate .level {
  padding-left: 0.30rem;
  margin-top: 0.60rem;
}
.innovate .mt24 {
  margin-top: 0.24rem;
}
.innovate .level .line-bar {
  margin-top: 0.16rem;
  height: 0.20rem;
  border-radius: 0.10rem;
  background: #35B7AD;
}
.innovate .level .level-1 {
  width: 6.90rem;
}
.innovate .level .level-2 {
  width: 3.93rem;
  opacity: 0.7;
}
.innovate .level .level-3 {
  width: 3.10rem;
  opacity: 0.4;
}

.innovate img {
  margin-top: 0.80rem;
  width: 7.50rem;
  height: 4.02rem;
}

.innovate .special {
  height: 1.96rem;
  margin: 0.30rem auto 0;
  width: 7.14rem;
}
.innovate .special > div {
  width: 3.56rem;
  height: 1.96rem;
  padding: 0.33rem 0 0 0.36rem;
  border-radius: 0.20rem;
  box-sizing: border-box;
}
.innovate .special > div > p:nth-child(2) {
  margin: 0.15rem 0 0.10rem;
}
.innovate .special .value {
  font-weight: bold;
  color: #2BA69D;
  line-height: 0.48rem;
  font-size: 0.28rem;
}
.innovate .special .value > span {
  font-size: 0.52rem;
}

/* range */
.range {
  text-align: center;
  padding-top: 1.09rem;
}
.range .range-text-box {
  margin-top: 0.70rem;
}
.range .subtitle > p:nth-child(2) {
  margin-top: 0.20rem;
}
.range .range-text {
  position: absolute;
  left: 2.20rem;
  top: 0.44rem;
}
.range .fast-box {
  position: absolute;
  left: 3.20rem;
  top: 0.14rem;
}
.range .fast-box > p > span {
  font-size: 0.56rem;
}
.range .range-img {
  width: 7.50rem;
  height: 5.15rem;
  margin-bottom: 1.00rem;
}
.range .fast-img {
  width: 7.50rem;
  height: 4.22rem;
}
.range .special {
  margin: 0.30rem auto 0;
  width: 7.14rem;
}
.range .special > div {
  width: 3.58rem;
  height: 1.58rem;
  padding: 0.33rem 0 0 0.36rem;
  box-sizing: border-box;
  border-radius: 0.20rem;
  text-align-last: left;
}
.range .special > div > p > span {
  font-size: 0.52rem;
  font-weight: bold;
  line-height: 0.52rem;
}
.range .special > div > p:nth-child(2) {
  margin-top: 0.12rem;
}

/* guage */
.guage {
  text-align: center;
  padding-top: 1.09rem;
  padding-bottom: 0.7rem;
  margin-bottom: 0.38rem;
}
.guage .subtitle {
  margin-top: 0.80rem;
}
.guage .range {
  margin: 0.29rem auto 0;
  width: 7.12rem;
  height: 1.54rem;
  border-radius: 0.20rem;
  background: url('./../../img/product/columba/compare.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-sizing: border-box;
  padding-top: 0.36rem;
}
/* bar比较部分 */
.guage .range .compare {
  box-sizing: border-box;
  padding-left: 0.44rem;
  margin-top: 0.12rem;
}
.guage .range .compare .bar {
  margin-left: 0.26rem;
  width: 5.40rem;
}
.guage .range .compare .value {
  font-size: 0.22rem;
  font-weight: 500;
  color: #1A1A1A;
}
.guage .range .compare .line {
  width: 3.86rem;
  height: 0.20rem;
  border-radius: 0.8rem;
  overflow: hidden;
  margin: 0;
}
.guage .range .compare .line .left{
  width: 50%;
  background: #2BA69D;
  height: 100%;
}
.guage .range .compare .line .right{
  width: 50%;
  background:#0071FF;
  height: 100%;
}

.guage .special {
  margin: 1.06rem auto 0;
  font-size: 0.66rem;
  line-height: 0.66rem;
  font-weight: 400;
  color: #1E1E1E;
  letter-spacing: 0.04rem;
  width: 6.04rem;
  height: 0.66rem;
}
.guage .line {
  width: 2.85rem;
  height: 0.04rem;
  background: linear-gradient(90deg,#C8EFFF 0%, #3EE2D6 50%, #C8EFFF 100%);
  border-radius: 0.08rem;
  margin: 0.40rem auto 0;
}
.guage .mt80{
  margin-top: 0.80rem;
}
.guage .mt46{
  margin-top: 0.46rem;
}

.guage .slogan {
  width: 7.10rem;
  margin: 0.30rem auto 0;
  text-align-last: left;
  box-sizing: border-box;
  padding: 0.40rem 0 0 0.36rem;
  border-radius: 0.20rem;
  height: 2.23rem;
  background: url('./../../img/product/columba/charge.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.guage .slogan .number {
  font-size: 0.52rem;
  font-weight: 400;
}
.guage .slogan > p:nth-child(2) {
  margin-top: 0.22rem;
}
.guage .slogan > p:nth-child(3) {
  margin-top: 0.22rem;
  font-size: 0.22rem;
}
.guage .battery {
  width: 5.75rem;
  height: 4.26rem;
  margin: 0.30rem auto 0;
}
.guage .view-img {
  width: 5.06rem;
  height: 3.11rem;
  margin: 0.40rem auto 0;
}
.guage .view {
  width: 7.14rem;
  margin: 0.30rem auto 0;
  height: 1.97rem;
}
.guage .view > div {
  width: 3.55rem;
  height: 100%;
  box-sizing: border-box;
  padding-top: 0.15rem;
  border-radius: 0.20rem;
  box-sizing: border-box;
  padding-left: 0.36rem;
}
.guage .view > div:nth-child(2) {
  padding-top: 0.60rem;
}
.guage .view > div > p {
  text-align: left;
  line-height: 1.4;
}
.guage .view > div > p > span {
  font-size: 0.58rem;
  font-weight: bold;
}