html,
body {
   font-family: "MiSans", "PingFang SC", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.phidden {
   display: none;
}

.gradient {
   color: transparent;
   -webkit-background-clip: text;
   background-clip: text;
   background-image: linear-gradient(45deg, #ffcd78, #ffb448);
}

.itemInfo {
   width: 100%;
   background-size: cover;
   padding: 1rem 3rem;
   color: #FFF;
}

.MainTitle {
   font-size: 0.44rem;
   line-height: 0.68rem;
   font-weight: 600;
   /* letter-spacing: 0.02rem; */
}

.subtitle {
   font-size: 0.28rem;
   /* letter-spacing: 0.02rem; */
   display: block;
   font-weight: 400;
}

.subheading {
   font-size: 0.22rem;
   /* letter-spacing: 0.01rem; */
}

.copywriting {
   display: block;
   font-size: 0.20rem;
   /* letter-spacing: 0.01rem; */
   line-height: 0.32rem;
}

/*主题内容开始*/
.mainInfo {
   background-image: url(https://ltechv-1305900169.cos.ap-beijing.myqcloud.com/super_panel/homeKit/mainbg.jpg);
   height: 10rem;
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   gap: 0.4rem;
}

.mainInfo .mainIcon {
   max-width: 4.23rem;
   margin-top: 1.4rem;
}

.certificationInfo .subtitle {
   margin-top: 0.4rem;
   margin-left: 0.35rem;
}

.certificationInfo .certification {
   max-width: 13rem;
   display: block;
   margin: auto;
   margin-top: 0.8rem;
}

.intelligenceInfo .introduce {
   margin-top: 0.8rem;
   display: flex;
   gap: 0.52rem;
}

.intelligenceInfo .introduce img {
   max-width: 2.95rem;
}

.dataInfo {
   position: relative;
   height: 6.2rem;
}

.dataInfo .introduce {
   position: absolute;
   top: 1.2rem;
   left: 3rem;
   width: 7.4rem;
}

.dataInfo .introduce .subtitle {
   margin-top: 0.6rem;
   font-size: 0.28rem;
}

.dataInfo .dataIcon {
   max-width: 1.8rem;
   margin-left: 10.2rem;
   margin-top: 1.4rem;
}

.expandInfo {
   background-image: url(https://ltechv-1305900169.cos.ap-beijing.myqcloud.com/super_panel/homeKit/expandbg.jpg);
   height: 12rem;
}

.expandInfo .expand {
   max-width: 13rem;
   margin-top: 1.3rem;
}


.familyInfo .family {
   max-width: 13rem;
   margin-top: 0.5rem;
}

.familyInfo .userText {
   color: #559aef;
}

.familyInfo .subtitle {
   margin-top: 0.4rem;
   font-size: 0.28rem;
}


.ecologyInfo .ecology {
   max-width: 13rem;
   margin-top: 0.5rem;
}

.ecologyInfo .subtitle {
   margin-top: 0.4rem;
}


.longInfo img {
   max-width: 13rem;
}

.longInfo .gradient {
   background-image: linear-gradient(45deg, #6aadff, #1278ff);
}

.longInfo .long-range {
   margin-top: 1rem;
   margin-bottom: 0.7rem;
}

.longInfo .subtitle {
   font-size: 0.26rem;
   line-height: 0.48rem;
}

.longInfo .long-rangeIcon {
   margin-top: 0.4rem;
}


.automaticInfo .automatic {
   max-width: 13rem;
   margin-top: 0.6rem;
}

.automaticInfo .gradient {
   background-image: linear-gradient(45deg, #95f7ff, #b19ee8);
}


.siriInfo {
   text-align: center;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 0.9rem;
}

.siriInfo .siri {
   max-width: 11rem;
}

.siriInfo .copywriting {
   max-width: 9rem;
}

.speakerInfo {
   text-align: center;
}

.speakerInfo .introduce {
   margin-top: 0.6rem;
   display: flex;
   align-items: center;
   gap: 0.8rem;
}

.speakerInfo .introduce .titleInfo {
   text-align: left;
}

.speakerInfo .introduce .titleInfo .subtitle {
   font-size: 0.24rem;
   line-height: 0.4rem;
   margin-bottom: 0.4rem;
}

.speakerInfo .speaker {
   max-width: 4.8rem;
}

.speakerInfo .introduce .titleInfo .gradient {
   background-image: linear-gradient(45deg, #95f7ff, #b19ee8);
}

.speakerInfo .introduce .titleInfo .MainTitle {
   font-size: 0.46rem;
   line-height: 0.62rem;
}

.speakerInfo .funInfo {
   max-width: 13rem;
   margin-top: 0.8rem;
}

.powerfulInfo .MainTitle {
   line-height: 0.66rem;
}

.powerfulInfo .gradient {
   background-image: linear-gradient(45deg, #75f8d2, #6096db 50%, #2ae3fc 100%);
}


.villaInfo .gradient {
   background-image: linear-gradient(45deg, #75f8d2, #6096db 50%, #2ae3fc 100%);
}

.villaInfo .villa {
   max-width: 13rem;
   margin-top: 0.68rem;
}

.meshInfo {
   margin-top: -2rem;
}

.meshInfo .gradient {
   background-image: linear-gradient(45deg, #ffe9c2, #dc9e2a);
}

.meshInfo .gradientMain {
   background-image: linear-gradient(45deg, #75f8d2, #6096db 50%, #2ae3fc 100%);
   font-size: 0.52rem;
}

.meshInfo .introduce {
   font-size: 0.28rem;
   display: flex;
   align-items: start;
   gap: 0.9rem;
   margin-top: 0.5rem;
   /* letter-spacing: 0.03rem; */
}

.meshInfo .introduce .MainTitle {
   font-size: 1rem;
   line-height: 2rem;
}

.meshInfo .introduce .times {
   text-align: center;
}

.meshInfo .copywriting {
   margin-left: 8.9rem;
   margin-top: 0.2rem;
}


.standardInfo {
   text-align: center;
   margin-top: -1.3rem;
}

.standardInfo .standard {
   max-width: 13rem;
}

.standardInfo .standardText {
   margin-top: -0.3rem;
   color: #dac89d;
}

.technologyInfo {
   background-image: url(https://ltechv-1305900169.cos.ap-beijing.myqcloud.com/super_panel/homeKit/en/technology.jpg);
   height: 10.6rem;
   padding-top: 0.5rem;
}

.technologyInfo .gradient {
   background-image: linear-gradient(45deg, #75f8d2, #6096db 50%, #2ae3fc 100%);
}

.technologyInfo .subtitle {
   margin-top: 0.6rem;
   font-size: 0.38rem;
   font-weight: 500;
}

.technologyInfo .Text {
   margin-top: 2.4rem;
}

.pwmInfo {
   background-image: url(../images/homeKit/PWMbg.jpg);
   height: 15.8rem;
}

.pwmInfo .gradient {
   background-image: linear-gradient(45deg, #75f8d2, #6096db 50%, #2ae3fc 100%);
}

.pwmInfo .introduce {
   text-align: center;
   padding-top: 1.2rem;
}

.pwmInfo .introduce img {
   max-width: 12rem;
   margin-top: .7rem;
}

.pwmInfo .introduce .subtitle {
   font-weight: 500;
   display: inline;
}

.Adaptive .gradient {
   background-image: linear-gradient(45deg, #75f8d2, #6096db 50%, #2ae3fc 100%);
}

.Adaptive img {
   max-width: 13rem;
   margin-top: 0.5rem;
}

.colorationInfo{
   padding-bottom: 0.2rem;
}
.colorationInfo .gradient {
   background-image: linear-gradient(45deg, #75f8d2, #6096db 50%, #2ae3fc 100%);
   line-height: 0.50rem;
}

.colorationInfo .MainTitlew {
   font-size: 0.32rem;
   margin-top: 0.1rem;
   display: block;
}

.colorationInfo .coloration {
   max-width: 6rem;
   margin: 0.5rem 0;
}

.colorationInfo .introduce {
   display: flex;
   margin-bottom: 0.33rem;
   gap: 0.5rem;
}

.colorationInfo .introduce div {
   width: 50%;

}

.colorationInfo .introduce .subtitle {
   font-weight: 500;
   font-size: 0.32rem;
}

.colorationInfo .introduce .copywriting {
   font-size: 0.20rem;
   margin-top: 0.05rem;
}

.parameterInfo .gradient {
   background-image: linear-gradient(45deg, #75f8d2, #6096db 50%, #2ae3fc 100%);
}

.parameterInfo .subtitle {
   font-weight: 500;
   display: inline-block;
   margin-top: 0.2rem;
}

.parameterInfo .parameter {
   max-width: 12.6rem;
   margin-bottom: 1rem;
   margin-top: 1rem;
}


.renderingInfo {
   background-image: url(https://ltechv-1305900169.cos.ap-beijing.myqcloud.com/super_panel/homeKit/en/rendering.jpg);
   height: 13.6rem;
}

.intelligenceInfo {
   text-align: center;
}

@media(max-width:780px) {
   .mhidden {
      display: none;
   }

   .phidden {
      display: block;
   }

   /* 手机尺寸开始 */
   .MainTitle {
      font-size: 0.85rem;
      line-height: 1.32rem;
   }

   .subtitle {
      font-size: 0.52rem;
      line-height: 0.98rem;
   }

   .subheading {
      font-size: 0.54rem;
   }

   .copywriting {
      font-size: 0.48rem;
      line-height: .78rem;
   }

   .itemInfo {
      padding: 2rem 1.4rem;
      color: #FFF;
   }

   /* 主体开始 */
   .mainInfo {
      background-image: url(../images/homeKit/mobile/mainbg.jpg);
      height: 28rem;
      padding-top: 14.5rem;
   }

   .mainInfo .mainIcon {
      max-width: 8.23rem;
      margin-top: 0rem;
   }

   .certificationInfo .certification {
      max-width: 16.8rem;
      margin-top: 1.6rem;
   }


   .intelligenceInfo .introduce {
      margin-top: 1rem;
   }

   .intelligenceInfo .introduce img {
      max-width: 3.7rem;
   }

   .dataInfo {
      height: 9.2rem;
   }


   .dataInfo .introduce {
      left: 1.2rem;
      width: 14rem;
   }

   .dataInfo .introduce .subtitle {
      margin-top: 0.6rem;
      font-size: 0.44rem;
      display: block;
      width: 10.5rem;
      font-weight: 500;
      line-height: 0.76rem;
   }

   .dataInfo .dataIcon {
      max-width: 2.8rem;
      margin-left: 12.2rem;
      margin-top: 2.0rem;
   }

   .expandInfo {
      background-image: url(../images/homeKit/mobile/expandbg.jpg);
      height: 23rem;
   }

   .expandInfo .expand {
      max-width: 16.6rem;
   }

   .familyInfo {
      padding: 2rem 0;
   }

   .familyInfo div {
      padding: 0 1.2rem;
   }

   .familyInfo .family {
      max-width: 100%;
      margin-top: 1.2rem;
   }

   .familyInfo .subtitle {
      font-size: 0.56rem;
   }

   .ecologyInfo {
      padding: 2rem 0;
   }

   .ecologyInfo div {
      padding: 0 1.2rem;
   }

   .ecologyInfo .ecology {
      max-width: 100%;
      margin-top: 1.2rem;
   }

   .longInfo .long-range {
      max-width: 16.4rem;
      margin-top: 1.2rem;
      margin-bottom: 1rem;
   }

   .longInfo .subtitle {
      font-size: 0.38rem;
      line-height: 0.68rem;
   }

   .longInfo img {
      max-width: 16.4rem;
      margin-top: 1rem;
   }

   .longInfo .long-rangeIcon {
      margin-top: 1rem;
   }

   .automaticInfo {
      padding: 2rem 0;
   }

   .automaticInfo div {
      padding: 0 1.2rem;
   }

   .automaticInfo .automatic {
      max-width: 100%;
      margin-top: 1.2rem;
   }

   .siriInfo {
      margin-top: -1rem;
      gap: 1.4rem;
   }

   .siriInfo .siri {
      max-width: 14rem;
   }

   .siriInfo .copywriting {
      max-width: 100%;
   }

   .speakerInfo .introduce {
      margin-top: 1.2rem;
   }

   .speakerInfo .speaker {
      max-width: 6.8rem;
   }

   .speakerInfo .introduce .titleInfo .subtitle {
      font-size: 0.4rem;
      line-height: 0.6rem;
   }

   .speakerInfo .introduce .titleInfo .MainTitle {
      font-size: 0.68rem;
      line-height: 0.92rem;
   }

   .speakerInfo .funInfo {
      max-width: 16.4rem;
      margin-top: 1.8rem;
   }

   .powerfulInfo .MainTitle {
      line-height: 1.4rem;
   }

   .villaInfo .villa {
      max-width: 16.4rem;
      margin-top: 1rem;
   }


   .meshInfo .gradientMain {
      font-size: 1.02rem;
   }

   .meshInfo .introduce {
      font-size: 0.34rem;
      gap: 1rem;
      margin-top: .8rem;
   }

   .meshInfo .introduce .MainTitle {
      font-size: 1.5rem;
   }

   .meshInfo .copywriting {
      margin-left: 9.8rem;
      margin-top: 0.2rem;
      font-size: 0.3rem;
   }

   .standardInfo {
      margin-top: -2.2rem;
   }

   .standardInfo .standard {
      max-width: 16.4rem;
   }

   .technologyInfo {
      background-image: url(../images/homeKit/mobile/technology.jpg);
      height: 16.4rem;
   }

   .technologyInfo .subtitle {
      margin-top: 1rem;
      font-size: 0.52rem;
   }

   .technologyInfo .Text {
      margin-top: 2.0rem;
   }

   .pwmInfo {
      background-image: url(../images/homeKit/mobile/pwmbg.jpg);
      height: 23.8rem;
      padding-top: 2.5rem;
   }

   .pwmInfo .introduce {
      padding-top: 2.2rem;
   }

   .pwmInfo .introduce .subtitle {
      font-size: 0.68rem;
   }

   .pwmInfo .introduce img {
      max-width: 16rem;
      margin-top: 1rem;
   }

   .Adaptive img {
      max-width: 16.4rem;
      margin-top: 0.7rem;
   }

   .colorationInfo .MainTitlew {
      font-size: 0.9rem;
   }

   .colorationInfo .coloration {
      max-width: 11rem;
      margin: 0.8rem 0;
   }

   .colorationInfo .introduce .subtitle {
      font-size: 0.61rem;
      letter-spacing: 0;
   }

   .colorationInfo .introduce .copywriting {
      font-size: 0.44rem;
      letter-spacing: 0;
      font-weight: 300;
   }

   .colorationInfo .introduce {
      margin-top: 0.55rem;
   }

   .renderingInfo {
      background-image: url(../images/homeKit/mobile/rendering.jpg);
      height: 18.8rem;
   }

   .parameterInfo .parameter {
      max-width: 16.4rem;
      margin-bottom: 1rem;
      margin-top: 1rem;
   }
}