::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  width: 6px;
  background: rgba(#101f1c, 0.1);
  -webkit-border-radius: 2em;
  -moz-border-radius: 2em;
  border-radius: 2em;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(144, 147, 153, 0.5);
  background-clip: padding-box;
  min-height: 28px;
  -webkit-border-radius: 2em;
  -moz-border-radius: 2em;
  border-radius: 2em;
  transition: background-color 0.3s;
  cursor: pointer;
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(144, 147, 153, 0.3);
}

.swiper-wrapper {
  height: auto !important;
}
.header-container,
.footer-container,
.app-container {
  width: 100%;
  min-width: 1200px;
  max-width: 1920px;
  overflow-x: hidden;
}

.swiper-list {
  margin-top: 84px;
  height: 400px;
}
.swiper-list .swiper-item {
  width: 50%;
  height: 100%;
  transition: all 0.3s;
}
.swiper-list .swiper-item.active {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%) scale(1.2);
  z-index: 9;
}
.swiper-list .left-arrow,
.swiper-list .right-arrow {
  position: absolute;
  top: 80%;
  border-radius: 50%;
  font-size: 48px;
  color: #aaa;
  height: 54px;
  width: 54px;
  line-height: 1;
  background: #fff;
  text-align: center;
  box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.1);
  cursor: pointer;
}
.swiper-list .left-arrow:hover,
.swiper-list .right-arrow:hover {
  color: #fff;
  user-select: none;
  background: var(--primary-color);
}
.swiper-list .left-arrow {
  left: 124px;
}
.swiper-list .right-arrow {
  right: 124px;
}
/**
 * header
 */
.header-container .active {
  color: var(--primary-color);
}
.header-container .nav-wrap {
  gap: 240px;
  height: 52px;
}
.header-container .header-main.fixed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  background: #fff;
  width: 100%;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
}
.side-bar {
  position: fixed;
  top: 50%;
  right: 12px;
  z-index: 9999;
}
.side-bar li {
  display: flex;
  width: 48px;
  height: 48px;
  background: rgb(243, 154, 45);
  border: 1px solid #d6d6d6;
}
.side-bar li:hover {
  background: #f78903;
}
.side-bar li .iconfont {
  font-size: 24px;
  color: #fff;
  text-align: center;
  line-height: 1.9;
}
.side-bar li a {
  text-align: center;
  line-height: 2;
}
.side-bar li .phone {
  position: absolute;
  text-align: center;
  display: none;
  width: 164px;
  height: 48px;
  line-height: 48px;
  background: var(--primary-bg-color);
  transform: translateX(-120px);
  border-radius: 4px;
  font-size: 16px;
  line-height: 1;
  transition: all 0.3s;
}
.side-bar li .phone::after {
  content: '';
  position: absolute;
  border: 6px solid var(--primary-bg-color);
  border-left-color: transparent;
  border-bottom-color: transparent;
  transform: rotate(45deg);
  right: -6px;
  bottom: 14px;
}
.side-bar .tab-phone:hover .phone {
  display: flex;
}
.side-bar li .phone .iconfont {
  color: var(--primary-text-color);
}
.side-bar li .wechat-img {
  position: absolute;
  display: none;
  transform: translateX(-90px);
  background: var(--primary-bg-color);
}
.side-bar li .wechat-img::after {
  content: '';
  position: absolute;
  border: 6px solid var(--primary-bg-color);
  border-left-color: transparent;
  border-bottom-color: transparent;
  transform: rotate(45deg);
  right: -6px;
  bottom: 50px;
}
.side-bar .tab-wechat:hover .wechat-img {
  display: flex;
}
.side-bar .to-top {
  cursor: pointer;
}
/**
 * footer
 */
.footer-container {
  background: #2e3033;
}
.footer-container footer {
  color: #fff;
}
footer a {
  color: var(--secondary-text-color);
}
footer dd {
  margin-bottom: 12px;
}
.extra-msg a {
  color: var(--primary-color);
}

footer .contact-information {
  border-right: 1px solid var(--primary-border-color);
}
footer .wechat {
  border-left: 1px solid var(--primary-border-color);
}
footer {
  border-bottom: 1px solid var(--primary-border-color);
}
.dialog {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999;
  display: none;
}
.dialog .close-icon {
  width: 100%;
  height: 16px;
}
.dialog .close-icon .icon {
  position: absolute;
  top: -24px;
  right: -8px;
  color: var(--secondary-text-color);
  cursor: pointer;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 1;
}
.dialog .close-icon .icon:hover {
  color: var(--primary-color);
}
.dialog-content {
  padding: 32px;
  background: #fff;
  border-radius: 12px;
}
.dialog-content a {
  color: var(--primary-color);
}
.dialog-content .tip {
  color: var(--secondary-text-color);
}

/**
 * 环境控制
 */
.banner {
  position: relative;
  height: 520px;
  color: #fff;
  overflow: hidden;
}

.banner-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.banner-content {
  position: absolute;
  /* left: 120px; */
  top: 104px;
  gap: 32px;
}
.banner .title h2 {
  line-height: 1.5;
  letter-spacing: 4px;
  font-size: 48px;
}

.banner .description {
  font-size: 16px;
  line-height: 2;
}

.banner .consult-btn {
  width: 120px;
  height: 32px;
  background: #fff;
  border-radius: 20px;
  color: var(--primary-color);
  line-height: 1.2;
  font-size: 14px;
  cursor: pointer;
  font-weight: 500;
}
.copywriting .text {
  position: relative;
}
.copywriting .before-border::before {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  border: 1px solid var(--primary-color);
}

.copywriting .before-border-left::before {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 40px;
  border: 1px solid var(--primary-color);
  transition: all 0.3s;
}

.scheme-description .img-item {
  padding: 48px;
  width: 32%;
  box-shadow: 0 0 4px 6px #f7f7f7;
}
.scheme-description .img-item img {
  width: 100%;
  transition: all 0.3s;
}
.scheme-description .img-item:hover img {
  transform: scale(1.1);
}
.resolve-pain-point p {
  color: var(--secondary-text-color);
}

.resolve-pain-point p:nth-of-type(even) {
  margin-bottom: 12px;
}
.resolve-pain-point img {
  width: 100%;
  height: 100%;
}
.system-feature .card-list .title {
  color: var(--primary-color);
}

.system-feature .card-item {
  width: 49%;
  box-shadow: 0 0 4px 6px #f7f7f7;
  transition: background 0.5s;
}
.system-feature .card-item img {
  width: 100px;
  height: 100px;
}

.system-feature .card-item:hover {
  background: var(--primary-color);
}
.system-feature .card-item:hover .title {
  color: #fff;
}
.system-feature .card-item:hover .text {
  color: #fff;
}

.monitor-argument .img-item {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: var(--primary-color);
}

.monitor-argument .img-item img {
  width: 60px;
  height: 60px;
}

.scheme-select .instructions {
  color: var(--secondary-text-color);
}
.scheme-select .scheme-item {
  width: 33%;
}
/* .scheme-select .scheme-item .msg {
  height: 350px;
} */

.merits-demerits table {
  width: 100%;
}

.merits-demerits tr,
.merits-demerits td {
  text-align: center;
  line-height: 2;
}

.scheme-advantage .card-item {
  width: 49%;
  background: #fff;
}
.scheme-advantage .card-item .title .text {
  width: max-content;
}
.scheme-advantage .card-item:hover .before-border-left::before {
  width: 100%;
}
.scheme-advantage .icon-img {
  background: var(--primary-color);
}

.scheme-advantage img {
  width: 60px;
  height: 60px;
}

/**
 * 能源解决方案
 */
.energy-banner .banner-content {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  gap: 16px;
}
.energy-banner .banner-content h2 {
  font-size: 64px;
  background: url('../assets/images/energy/banner-text-bg.png') no-repeat;
  background-repeat: no-repeat;
  background-size: contain;
}

.project-introduction .copywriting .before-border-left::before {
  bottom: -16px;
  border-top-width: 0;
  z-index: 2;
}
.project-introduction .copywriting .title::after {
  content: '';
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 1px;
  background-color: var(--primary-bg-color);
  z-index: 1;
}
.project-introduction .copywriting .english-text {
  color: var(--secondary-text-color);
  z-index: -1;
}
.project-introduction .copywriting p {
  line-height: 2;
}
.project-introduction .copywriting a {
  color: var(--primary-color);
}

.energy-pain-point {
  /* background: url('../assets/images/energy/pain-point-bg.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.energy-pain-point .pain-point-list .item {
  overflow: hidden;
  box-shadow: 0 0 4px 4px rgba(255, 255, 255, 0.4);
  transition: all 0.3s;
}
.energy-pain-point .pain-point-list .item:hover {
  transform: scale(1.1);
}
.energy-pain-point .pain-point-list img {
  display: block;
}

.energy-effect .copywriting .text::after,
.management-platform .copywriting .text::after {
  content: '';
  position: absolute;
  bottom: -16px;
  left: 50%;
  width: 100px;
  transform: translateX(-50%);
  border-top: 1px solid #fadfbc;
  z-index: 1;
}
.energy-effect .copywriting .text::before,
.management-platform .copywriting .text::before {
  content: '';
  position: absolute;
  bottom: -25px;
  left: 50%;
  width: 12px;
  height: 6px;
  transform: translateX(-50%);
  background: #f4bc67;
  border: 4px solid #fff;
  border-radius: 0 0 12px 12px;
  z-index: 2;
}

.energy-effect .english-text,
.management-platform .english-text {
  position: absolute;
  top: -16px;
  left: 50%;
  width: 100%;
  text-align: center;
  transform: translateX(-50%);
  color: #fadfbc;
  z-index: -1;
}

.energy-effect-list .effect-item {
  width: 32%;
  transition: all 0.3s;
}
.energy-effect-list .effect-item:hover {
  background: linear-gradient(0.25turn, #1990c7, #2c6ba9);
  color: #fff;
  /* transform: scale(1.1); */
}
.energy-effect-list .effect-item .description {
  color: var(--secondary-text-color);
  height: 42px;
}

.energy-effect-list .effect-item .icon {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: red;
  transition: all 0.3s;
}
.energy-effect-list .effect-item:hover .icon {
  background: #fff !important;
  transform: scale(1.1);
}

.energy-effect-list .effect-item:hover .iconfont {
  background: linear-gradient(180deg, #b08655, #f4bc67);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.energy-effect-list .effect-item:hover .description {
  color: #d6d6d6;
}
.energy-effect .iconfont {
  font-size: 48px;
  color: #fff;
}

.correlation-product {
  /* background: url('../assets/images/energy/product-bg.png') no-repeat 0 0,
    url('../assets/images/energy/product-bg02.png') no-repeat 0 180px; */
  padding-bottom: 84px;
}
.correlation-product .text {
  width: 400px;
  color: #fff;
  border: 1px solid #fff;
  padding: 6px 0 24px;
}
.correlation-product .english-text {
  color: var(--secondary-text-color);
  z-index: -1;
}

.correlation-product .make::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  border: 1px solid #ff8200;
}

.correlation-product .more-product-btn {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 50%);
  background: #ff8200;
  color: #fff;
  padding: 8px 24px;
}

.correlation-product .product-nav-bar {
  box-shadow: 0 2px 4px #ccc;
}
.correlation-product .product-nav-bar ul {
  height: 54px;
  cursor: pointer;
}
.correlation-product .product-nav-bar ul::after,
.correlation-product .product-nav-bar ul::before {
  content: '';
  position: absolute;
  top: 0;
  height: 100%;
  width: 360px;
  background: #fff;
}
.correlation-product .product-nav-bar ul::after {
  left: 0;
  transform: translateX(-100%);
}
.correlation-product .product-nav-bar ul::before {
  right: 0;
  transform: translateX(100%);
}
.correlation-product .product-nav-bar ul li {
  border-right: 1px solid #d6d6d6;
  background: #fff;
}
.correlation-product .product-nav-bar ul li:first-child {
  border-left: 1px solid #d6d6d6;
}
.correlation-product .product-nav-bar .active {
  background: transparent;
}
.correlation-product .banderole {
  position: absolute;
  top: 0;
  left: 0;
  height: 2px;
  width: 200px;
  background: #ff8200;
  transition: all 0.2s;
}
.correlation-product .product-swiper {
  overflow: hidden;
}
.correlation-product .product-list {
  transition: all 0.3s;
}
.correlation-product .product-list .item .name {
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  background: rgba(0, 0, 0, 0.7);
  padding: 8px 0;
}
.correlation-product .product-list .masking {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  z-index: -1;
  transition: all 0.3s;
  opacity: 0;
}
.correlation-product .product-list .mask-name {
  border-top: 1px solid var(--primary-border-color);
  border-bottom: 1px solid var(--primary-border-color);
}
.correlation-product .product-list .taobao-link {
  color: #fff;
  padding: 8px 24px;
  border: 1px solid #fff;
}
.correlation-product .product-list .item:hover .masking {
  z-index: 99;
  opacity: 1;
}
.energy-product-list .item > .title .additional {
  color: var(--secondary-text-color);
}

.energy-product-list .item > .title::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: #74b635;
}
.energy-product-list .item .img {
  padding: 16px 84px;
  width: 100%;
  background: #ccc;
}
.energy-product-list .item .introduce .title,
.energy-product-list .item .taobao-link {
  color: var(--primary-color);
  width: max-content;
}
.energy-product-list .item .introduce .description {
  color: var(--secondary-text-color);
}
.management-platform .container {
  padding-bottom: 84px;
}
.management-platform .copywriting .english-text {
  width: 400px;
  z-index: -1;
}
.management-platform .content .item p:last-child {
  color: var(--secondary-text-color);
}

/**
 * 无线网关
 */
.gateway-banner .banner-content {
  top: 164px;
  left: 64px;
}
.gateway-banner .product-list .img {
  position: absolute;
}
.gateway-banner .product-list .img:nth-of-type(3) {
  top: 100px;
  left: 550px;
}
.gateway-banner .product-list .img:nth-of-type(2) {
  top: 145px;
  left: 800px;
}
.gateway-banner .product-list .img:nth-of-type(1) {
  top: 180px;
  left: 1000px;
}
.gateway-advantage .list {
  z-index: 9;
}
.gateway-advantage .wrapper .item {
  width: 160px;
  height: 200px;
  box-shadow: 0 0 1px 2px #f1f1f1;
  background: #fff;
  z-index: 9;
}
.gateway-advantage .wrapper img {
  transition: all 0.3s;
}
.gateway-advantage .wrapper .item:hover img {
  transform: scale(1.1);
}

.gateway-pain-point {
  transform: translateY(-144px);
  /* background: url('../assets/images/wifi-gateway/pain-point-bg.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.gateway-pain-point .placeholder {
  height: 200px;
  margin-top: 48px;
}
.gateway-pain-point .description {
  color: #fff;
}
.gateway-pain-point .list {
  position: absolute;
  width: 100%;
  top: 224px;
}
.gateway-pain-point .list .item {
  background: skyblue;
  padding: 64px 24px;
  width: 24%;
  height: 420px;
  transition: transform 0.2s ease;
  overflow: hidden;
}
.gateway-pain-point .list .item:hover {
  transform: translateY(-32px);
  color: #fff;
  /* transition-delay: 0.1s; */
}
.gateway-pain-point .list .item .title {
  width: max-content;
}
.gateway-pain-point .list .item .title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -16px;
  height: 2px;
  width: 40px;
  background: var(--primary-color);
  border-radius: 4px;
  transition: all 0.3s;
}
.gateway-pain-point .list .item:hover .title::after {
  width: 100%;
}
.gateway-product-introduction .feature-introduction {
  margin-top: 48px;
  /* background: url('../assets/images/wifi-gateway/product-bg.png') no-repeat; */
  background-repeat: no-repeat;
}

.gateway-product-introduction .product-img img {
  position: absolute;
  top: -172px;
  left: 146px;
}
.gateway-product-introduction .advantage-list .item {
  width: 24%;
  height: 280px;
  background: #fff;
  box-shadow: 0 0 1px 2px #f1f1f1;
}

.gateway-product-introduction .advantage-list .img {
  width: 100px;
  height: 100px;
}
.gateway-product-introduction .advantage-list .img img {
  width: 100%;
}
.platform-introduce .swiper-item .text {
  font-size: 14px;
}
.platform-introduce .swiper-item:nth-of-type(1) .text {
  padding-left: 84px;
}
.platform-introduce .swiper-item:nth-of-type(2) .text {
  padding-left: 224px;
}
.platform-introduce .swiper-item:nth-of-type(3) .text {
  padding-left: 400px;
}

/**
 * 无线智能采集终端
 */
.turmass-485 .title h2,
.turmass-485 .title .type {
  color: var(--primary-text-color);
}
.turmass-485 .title .type {
  text-align: right;
}
.turmass-485 .banner-content {
  left: 120px;
}
.turmass-485-advantage-list {
  margin-top: 124px;
}
.turmass-485-advantage-list .item {
  width: 18%;
  height: 300px;
  background: #e5e5e5;
  border-radius: 2px 2px 114px 114px;
}
.turmass-485-advantage-list .item:hover {
  background: rgba(69, 133, 242, 0.2);
}
.turmass-485-advantage-list .item:hover .ceiling {
  background: var(--primary-color);
  color: #f3f5f7;
}
.turmass-485-advantage-list .item .ceiling {
  width: 100%;
  height: 280px;
  border-radius: 2px 2px 114px 114px;
  background: #fff;
  transition: all 0.3s;
}
.turmass-485-advantage-list .icon {
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: linear-gradient(#e5e5e5 1%, #fff);
  box-shadow: 0 10px 20px 0 #666;
  transform: translateY(-80px);
}
.turmass-485-advantage-list .icon img {
  width: 80px;
  height: 80px;
}
.turmass-485-advantage-list .item .msg {
  transform: translateY(-40px);
}
.turmass-485-feature .product-bg {
  position: absolute;
  bottom: 84px;
  left: 0;
  width: 50%;
  height: 400px;
  border-radius: 0 200px 200px 0;
  background: linear-gradient(
    59deg,
    rgb(241, 238, 238) 0%,
    rgb(240, 235, 240) 27%,
    rgb(225, 230, 228) 62%,
    rgb(236, 247, 249) 100%
  );
  z-index: -1;
}
.turmass-485-feature .product {
  width: 50%;
}
.turmass-485-feature .product img {
  transform: translate(100px, -60px);
}

.turmass-485-feature .buy-btn {
  width: 160px;
  height: 40px;
  background: #fff;
  border-radius: 20px;
  color: var(--primary-color);
  cursor: pointer;
  line-height: 1;
  font-weight: 500;
  border: 1px solid var(--primary-border-color);
}
.turmass-485-feature .description {
  transform: translateY(140px);
}
.turmass-485-feature .description p {
  line-height: 2;
}
pre {
  line-height: 1.5;
}
.trumass-485-product-more .content {
  margin-left: 128px;
  border: 2px solid var(--primary-color);
}
.trumass-485-product-more .content img {
  transform: translateX(-128px);
}
.trumass-485-product-config .container {
  padding-top: 84px;
}
.trumass-485-product-config .img,
.trumass-485-product-install .img {
  width: 50%;
}

/**
 * 通信管理主机
 */

.communication .banner-content {
  top: 140px;
}

.communication .banner-content .buy-btn {
  display: block;
  width: 120px;
  height: 40px;
  border: 1px solid #fff;
  text-align: center;
  border-radius: 40px;
  line-height: 2.4;
  color: #fff;
}
.z-index-text {
  z-index: 9;
}
.position-english-text {
  position: absolute;
  top: -28px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 48px;
  color: #d5d5d5;
}

.IO-product-introduction .before-border-left::before {
  bottom: -14px;
}

.IO-product-introduction .buy-btn a {
  width: 132px;
  height: 48px;
  border: 1px solid var(--primary-border-color);
  border-radius: 40px;
  line-height: 2.9;
  text-align: center;
}
.IO-product-introduction .other-list .item {
  width: 160px;
  height: 150px;
  background: var(--primary-color);
}
.IO-product-introduction .other-list img {
  transition: all 0.3s;
}
.IO-product-introduction .other-list .item:hover img {
  transform: scale(1.1);
}
.IO-pain-point {
  padding-top: 84px;
}
.IO-pain-point .copywriting .title {
  height: 72px;
}
.IO-pain-point-bg {
  position: absolute;
  top: 188px;
  width: 100%;
  height: 360px;
  background: #333;
  z-index: -1;
}
.IO-pain-point .pain-point-list .item {
  height: 360px;
  transition: all 0.3s;
  overflow: hidden;
}
.IO-pain-point .pain-point-list .icon,
.IO-pain-point .pain-point-list .msg,
.IO-pain-point .pain-point-list .item .divider {
  transition: all 0.3s;
}
.IO-pain-point .pain-point-list .item {
  /* background: url('../assets/images/communication-manage-host/pain-point01.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.IO-pain-point .pain-point-list .item .divider {
  height: 1px;
  width: 20px;
  background: #fff;
}
.IO-pain-point .pain-point-list .item .description {
  height: 0;
  transition: all 0.2s;
  transform: translateY(132px);
}
.IO-pain-point .pain-point-list .item:hover .icon {
  transform: translateY(-72px);
}
.IO-pain-point .pain-point-list .item:hover .msg {
  transform: translateY(-20px);
}
.IO-pain-point .pain-point-list .item:hover .description {
  height: auto;
  transform: translateY(0);
}
.IO-peculiarity .summarize {
  background: var(--primary-color);
}
.IO-peculiarity .summarize pre {
  line-height: 2;
}
.IO-peculiarity .peculiarity-list .item {
  width: 280px;
  height: 280px;
  box-shadow: 0 0 4px 4px #f3f5f7;
}
.IO-peculiarity .peculiarity-list .item .img {
  height: 90px;
}

.IO-configuration-platform {
  /* background: url('../assets/images/communication-manage-host/configuration-platform-bg.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.IO-configuration-platform .description {
  padding: 48px 0 16px;
  text-align: center;
  background: #fff;
  color: var(--primary-color);
  font-weight: 600;
}
.IO-programming .programming-list .item {
  padding-top: 64px;
  width: 48%;
  box-shadow: 0 0 4px 4px #f3f5f7;
}
.IO-programming .programming-list .item:nth-of-type(1):after {
  content: '积木编程';
  text-align: center;
  font-size: 16px;
  color: #fff;
  line-height: 3;
}
.IO-programming .programming-list .item::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 48px;
  width: 100%;
  background: var(--primary-color);
  border-radius: 12px 12px 0 0;
}

.IO-programming .programming-list .item:nth-of-type(n + 2) img {
  width: 100%;
  height: 100%;
}
.IO-scene .scene-list::after {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  width: 1px;
  background: var(--primary-color);
}
.IO-scene .scene-list::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0%;
  transform: translateY(-50%);
  height: 1px;
  width: 100%;
  background: var(--primary-color);
}

.IO-scene .scene-list .item {
  width: 49%;
}
.IO-scene .scene-list .item .text {
  position: absolute;
  left: 0;
  padding: 12px;
  width: 590px;
  text-align: center;
  background: rgba(69, 133, 242, 0.7);
}
.IO-scene .scene-list .item:nth-of-type(1) .text,
.IO-scene .scene-list .item:nth-of-type(2) .text {
  bottom: 0;
}
.IO-scene .scene-list .item:nth-of-type(3) .text,
.IO-scene .scene-list .item:nth-of-type(4) .text {
  top: 0;
}

/**
 * 解决方案目录
 */
.energy-solution .img {
  width: 400px;
}
.energy-solution .img img {
  transform: translateX(-392px);
}
.energy-solution .description {
  margin-left: 240px;
}
.energy-solution .description p {
  line-height: 2;
}
.see-detail a {
  padding: 12px 48px;
  border-radius: 24px;
  border: 1px solid var(--product-primary-color);
  color: var(--product-primary-color);
  font-size: 16px;
  text-align: center;
  line-height: 1;
  width: max-content;
}
.environmental-control-solution .description p {
  line-height: 2;
  text-align: right;
}
.environmental-control-solution .img {
  width: 400px;
  margin-left: 240px;
}

/**
 * 产品目录
 */
.product-banner .banner-content {
  position: static;
  height: 100%;
  gap: 64px;
}
.product-banner > img {
  z-index: -1;
}
.product-banner .banner-content .product-img img:nth-of-type(1) {
  transform: translateY(140px);
}
.product-banner .banner-content .product-img img:nth-of-type(2) {
  transform: translateY(120px);
}
.product-banner .banner-content .product-img img:nth-of-type(3) {
  transform: translateY(100px);
}

.product-banner .gradation-text {
  font-size: 96px;
  background: linear-gradient(100deg, #c09359, #f4b765, #fddc90);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  line-height: 1;
}
.product-banner .tip {
  color: var(--product-primary-color);
}
.product-banner .gradation-text:nth-child(1) {
  transform: translate(-20px, 40px);
}
.product-banner .three-line {
  width: max-content;
  color: #fff;
  background: var(--product-primary-color);
  padding: 4px 8px;
  border-radius: 24px;
}
.product-banner .four-line {
  color: var(--product-primary-color);
}
.product-banner .four-line .item:nth-child(1) {
  width: 14px;
  line-height: 1;
}
.product-banner .four-line .item .icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--product-primary-color);
}
.product-container .product-nav-bar {
  background: #3d3d3d;
}
.product-container .product-nav-bar .nav-item {
  line-height: 3;
  text-align: center;
  width: 240px;
  color: #fff;
  cursor: pointer;
  transition: all 0.3s;
}
.product-container .product-nav-bar .nav-item.active {
  background: var(--primary-color);
}
.product-container .product-nav-bar .nav-item:hover {
  background: var(--primary-color);
}

.product-container .product-list .item {
  margin-bottom: 32px;
  width: 32%;
  box-shadow: 0 0 4px 4px #f3f5f7;
  border-radius: 4px;
}
.product-container .product-list .item .img {
  height: 280px;
  width: 100%;
  background: var(--primary-bg-color);
}
.product-container .product-list .item .img img {
  height: 100%;
}
.product-container .product-list .item .description .title {
  color: var(--primary-text-color);
}
.product-container .product-list .item .description .msg {
  height: 32px;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
}
.product-container .product-list .item .description a {
  color: var(--product-primary-color);
  padding: 8px 32px;
  border: 1px solid var(--product-primary-color);
  border-radius: 8px;
  line-height: 1.1;
}
.product-container .product-list .item:hover .description {
  background: var(--primary-color);
  transition: all 0.3s;
}
.product-container .product-list .item:hover .description .title {
  color: #fff;
}
.product-container .product-list .item:hover .description .msg {
  color: #f5f5f5;
}
.product-container .product-list .item:hover .description a {
  color: #fff;
  border-color: #ccc;
}

/**
 * 灯控开关
 */
.lamp-feature .copywriting .text {
  color: var(--product-primary-color);
}
.lamp-product-series .title-bg {
  /* background: url('../assets/images/lamp-control/product-series-bg.png'); */
}
.lamp-feature .copywriting .title .english-text {
  color: var(--secondary-text-color);
}
.lamp-feature .content {
  margin: 32px 132px 0;
  padding: 64px 32px;
  border: 1px solid var(--product-primary-color);
}
.lamp-feature .content .border {
  width: 0;
  height: 0;
}
.lamp-feature .content .border div {
  position: absolute;
  width: 40px;
  height: 40px;
}
.lamp-feature .content .border div:nth-of-type(1) {
  top: -1px;
  left: -1px;
  border-top: 2px solid var(--product-primary-color);
  border-left: 2px solid var(--product-primary-color);
  z-index: -1;
}
.lamp-feature .content .border div:nth-of-type(2) {
  top: -1px;
  right: -1px;
  border-top: 2px solid var(--product-primary-color);
  border-right: 2px solid var(--product-primary-color);
}
.lamp-feature .content .border div:nth-of-type(3) {
  bottom: -1px;
  right: -1px;
  border-bottom: 2px solid var(--product-primary-color);
  border-right: 2px solid var(--product-primary-color);
}
.lamp-feature .content .border div:nth-of-type(4) {
  bottom: -1px;
  left: -1px;
  border-bottom: 2px solid var(--product-primary-color);
  border-left: 2px solid var(--product-primary-color);
}
.lamp-feature .content .wrap:nth-of-type(1) .img {
  width: 200px;
}
.lamp-feature .content .img {
  width: 134px;
  height: 115px;
}
.lamp-feature .content .text {
  color: var(--product-primary-color);
}
.lamp-feature .content .wrap:nth-of-type(3) .img {
  background: #e7bebe;
}
.lamp-feature .content .wrap:nth-of-type(1) img {
  position: absolute;
  top: -164px;
  left: -164px;
}
.lamp-product-series .product-type .item {
  width: 32%;
  box-shadow: 0 0 4px 4px #f3f5f7;
  margin-bottom: 32px;
}
.lamp-product-series .product-type .item .img {
  height: 280px;
  width: 100%;
  background: var(--product-primary-color);
  border: 1px solid #df4949;
}
.lamp-product-series .product-type .item .description a {
  color: var(--product-primary-color);
  padding: 12px 64px;
  border: 1px solid var(--product-primary-color);
  border-radius: 32px;
  line-height: 1;
}
.lamp-communication-mode .container > .img,
.lamp-communication-mode .container > .description {
  width: 50%;
}
.lamp-communication-mode .container > .description {
  margin-left: 64px;
  gap: 48px;
}
.lamp-communication-mode .container > .img img {
  transform: translateX(-360px);
}
.lamp-communication-mode .container .description .english-text {
  color: var(--secondary-text-color);
}
.lamp-communication-mode .container .description .item .icon {
  width: 60px;
  height: 60px;
  border: 1px solid var(--product-primary-color);
  border-radius: 50%;
}
.lamp-communication-mode .container .description .item .key {
  color: var(--product-primary-color);
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .icon {
  color: var(--product-primary-color);
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .iconfont {
  font-size: 28px !important;
}
.lamp-peculiarity .peculiarity-list .peculiarity-item {
  width: 18%;
  border: 1px solid var(--product-primary-color);
  transition: all 0.3s;
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .title {
  color: var(--product-primary-color);
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .icon {
  width: 60px;
  height: 60px;
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .border {
  width: 0;
  height: 0;
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .border div {
  position: absolute;
  width: 20px;
  height: 20px;
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .border div:nth-of-type(1) {
  top: -1px;
  left: -1px;
  border-top: 2px solid var(--product-primary-color);
  border-left: 2px solid var(--product-primary-color);
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .border div:nth-of-type(2) {
  top: -1px;
  right: -1px;
  border-top: 2px solid var(--product-primary-color);
  border-right: 2px solid var(--product-primary-color);
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .border div:nth-of-type(3) {
  bottom: -1px;
  right: -1px;
  border-bottom: 2px solid var(--product-primary-color);
  border-right: 2px solid var(--product-primary-color);
}
.lamp-peculiarity .peculiarity-list .peculiarity-item .border div:nth-of-type(4) {
  bottom: -1px;
  left: -1px;
  border-bottom: 2px solid var(--product-primary-color);
  border-left: 2px solid var(--product-primary-color);
}
.lamp-peculiarity .peculiarity-list .peculiarity-item:hover {
  background: var(--product-primary-color);
}
.lamp-peculiarity .peculiarity-list .peculiarity-item:hover .title,
.lamp-peculiarity .peculiarity-list .peculiarity-item:hover .msg,
.lamp-peculiarity .peculiarity-list .peculiarity-item:hover .icon {
  color: #fff;
}
.lamp-peculiarity .peculiarity-list .peculiarity-item:hover .border div {
  border-color: #f2e665;
}
.lamp-peculiarity .wifi6-peculiarity,
.ac-companion-communication .wifi6-peculiarity {
  margin-top: 72px;
  width: 100%;
  height: 500px;
  /* background: url('../assets/images/lamp-control/wifi6-bg.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.lamp-peculiarity .wifi6-peculiarity .explain {
  color: var(--secondary-text-color);
}
.lamp-peculiarity .wifi6-peculiarity .title,
.ac-companion-communication .wifi6-peculiarity .title {
  font-size: 96px;
}
.lamp-industry-pain-point .english-text {
  color: var(--secondary-text-color);
}
.lamp-industry-pain-point .pain-point-bg {
  height: 280px;
  background: #b48d54;
}
.lamp-industry-pain-point .pain-point-list {
  transform: translateY(50%);
}
.lamp-industry-pain-point .pain-point-list .item {
  width: 16.4%;
  height: 280px;
}
.lamp-industry-pain-point .pain-point-list .item img {
  width: 100%;
  height: 100%;
}
.lamp-industry-pain-point .pain-point-list .item .text {
  position: absolute;
  top: 0;
  left: 0;
  height: 60px;
  width: 100%;
  background: rgba(255, 255, 255, 0.3);
  color: #fff;
}
.lamp-performance-parameter {
  margin-top: 100px;
}
.lamp-performance-parameter .params-container {
  padding: 0 84px;
}
.lamp-performance-parameter .params-container .table {
  overflow: hidden;
}
.lamp-performance-parameter .params-container .table .item:first-child {
  background: var(--product-primary-color);
  padding: 24px;
}
.lamp-performance-parameter .params-container .table .item:nth-child(n + 2) {
  border-top: 2px solid #fff;
}
.lamp-performance-parameter .params-container .table .item {
  padding: 16px 84px;
  background: var(--primary-bg-color);
}
.lamp-performance-parameter .params-container .table .item .label {
  width: 33%;
}

/**
 * 智能空调
 */
.ac-banner .banner-content {
  position: static;
  height: 100%;
}
.ac-banner > img {
  height: 111%;
  z-index: -1;
}
.ac-banner .description {
  margin-left: 140px;
}
.ac-banner .banner-content .img {
  margin-left: 36px;
}
.ac-banner .banner-content .description .icon img {
  width: 20px;
  height: 20px;
}
.ac-banner .banner-content .description .title {
  font-size: 36px;
}
.ac-banner .banner-content .description .icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--product-primary-color);
}
.ac-banner .banner-content .description .buy-btn {
  border-radius: 32px;
  overflow: hidden;
  font-size: 14px;
}
.ac-banner .banner-content .description .buy-btn span {
  background: #000;
  color: #fff;
  padding: 4px 36px;
}
.ac-banner .banner-content .description .buy-btn a {
  padding: 4px 24px;
  background: var(--product-primary-color);
  color: #000;
}
.ac-feature .copywriting .title .before-border::before,
.ac-scene .copywriting .title .before-border::before {
  border: 2px solid #44b2ca;
  border-radius: 2px;
}
.ac-feature .content .feature-wrapper .text {
  position: relative;
  padding: 8px 16px;
  background: #44b2ca;
  border-radius: 4px;
  color: #fff;
}
.ac-feature .content .feature-wrapper .text::before {
  content: '';
  position: absolute;
  bottom: -100%;
  left: 0;
  border-radius: 4px;
  width: 100%;
  height: 100%; /* 倒影高度可调整 */
  background: linear-gradient(to bottom, rgba(68, 178, 202, 0.5), #fff);
}
.ac-feature .content .feature-wrapper .line {
  width: 80px;
  height: 2px;
  background: #44b2ca;
}
.ac-feature .content .feature-wrapper .point {
  width: 4px;
  height: 4px;
  background: #44b2ca;
  border-radius: 50%;
}
.ac-feature .content .feature-wrapper .item {
  position: absolute;
}
.ac-feature .content .feature-left .item:nth-of-type(1) {
  top: 80px;
  left: 120px;
}
.ac-feature .content .feature-left .item:nth-of-type(2) {
  top: 220px;
  left: 80px;
}
.ac-feature .content .feature-left .item:nth-of-type(3) {
  top: 340px;
  left: 120px;
}
.ac-feature .content .feature-right .item:nth-of-type(1) {
  top: 80px;
  right: 120px;
}
.ac-feature .content .feature-right .item:nth-of-type(2) {
  top: 220px;
  right: 80px;
}
.ac-feature .content .feature-right .item:nth-of-type(3) {
  top: 340px;
  right: 120px;
}
.ac-supportive {
  /* background: url('../assets/images/ac-control/supportive-bg.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.ac-supportive .supportive-list {
  background: rgba(255, 255, 255, 0.8);
  width: max-content;
}
.ac-supportive .supportive-list .swipper .item {
  padding: 48px 0;
  width: 264px;
  transition: all 0.3s;
}
.ac-supportive .supportive-list .swipper .item .icon {
  width: 60px;
  height: 60px;
  border: 1px solid #657899;
  border-radius: 50%;
}
.ac-supportive .supportive-list .swipper .item p {
  line-height: 1.6;
}
.ac-supportive .supportive-list .item.active {
  background: #657899;
  color: #fff;
}
.ac-supportive .supportive-list .item.active .icon {
  border-color: #fff;
}
.ac-supportive .supportive-list .item.active .text {
  color: #fff;
}
.ac-supportive .supportive-list .item .text {
  color: #657899;
}
.ac-supportive .advantage-list {
  justify-content: space-evenly;
  padding: 0 8px;
}
.ac-supportive .advantage-list .item .icon {
  width: 30px;
  height: 30px;
}
.ac-supportive .advantage-list .item {
  width: 22%;
  padding: 24px 0 0;
  border: 1px solid #657899;
}
.ac-supportive .advantage-list .item .title {
  color: #657899;
}
.ac-supportive .advantage-list .item .border {
  width: 0;
  height: 0;
}
.ac-supportive .advantage-list .item .border div {
  position: absolute;
  width: 20px;
  height: 20px;
}
.ac-supportive .advantage-list .item .border div:nth-of-type(1) {
  top: -2.5px;
  left: -2.5px;
  border-top: 4px solid #657899;
  border-left: 4px solid #657899;
}
.ac-supportive .advantage-list .item .border div:nth-of-type(2) {
  top: -2.5px;
  right: -2.5px;
  border-top: 4px solid #657899;
  border-right: 4px solid #657899;
}
.ac-supportive .advantage-list .item .border div:nth-of-type(3) {
  bottom: -2.5px;
  right: -2.5px;
  border-bottom: 4px solid #657899;
  border-right: 4px solid #657899;
}
.ac-supportive .advantage-list .item .border div:nth-of-type(4) {
  bottom: -2.5px;
  left: -2.5px;
  border-bottom: 4px solid #657899;
  border-left: 4px solid #657899;
}

.ac-peculiarity .copywriting .before-border-left::before {
  border: 2px solid #44b2ca;
  border-radius: 2px;
}
.ac-peculiarity .copywriting,
.ac-peculiarity .img {
  width: 50%;
}
.ac-peculiarity .img img {
  transform: translateX(-360px);
}
.ac-peculiarity .copywriting {
  padding: 48px 0 0 84px;
}
.ac-peculiarity .copywriting pre {
  margin-top: 64px;
}
.ac-scene .content .first-line .img-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 8px;
}
.ac-scene .content .img img {
  display: block;
}
.ac-scene .content .img .text {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 12px;
  width: 100%;
  text-align: center;
  background: rgba(101, 120, 153, 0.5);
}

/**
 * 空调伴侣
 */
.ac-companion-banner .img {
  height: 100%;
}
.banner.ac-companion-banner {
  overflow: visible;
}
.ac-companion-banner .banner-content {
  position: relative;
  top: 0;
  left: 0;
  height: 100%;
}
.ac-companion-banner .banner-content .description {
  width: 100%;
  margin-top: 64px;
}
.ac-companion-banner .banner-content .title {
  font-size: 48px;
}
.ac-companion-banner .banner-content .advantage-list {
  padding: 32px;
  width: 100%;
  background: #fff;
  color: var(--primary-text-color);
  transform: translate(-52%, 30px);
  gap: 48px;
}
.ac-companion-banner .banner-content .img {
  position: absolute;
  right: 60px;
  bottom: -72px;
}
.ac-companion-introduce {
  margin-top: 64px;
}
.ac-companion-introduce .description {
  gap: 48px;
}
.ac-companion-introduce .description .english-text {
  margin-top: 12px;
  color: var(--secondary-text-color);
}
.ac-companion-introduce .description .msg p {
  line-height: 2;
}
.ac-companion-introduce .description a {
  padding: 12px 48px;
  border-radius: 32px;
  background: #fd8300;
  color: #fff;
}
.ac-companion-introduce .product {
  margin-right: 32px;
}
.ac-companion-introduce .product .img {
  padding: 24px 64px;
  background: #d5dbde;
}
.ac-companion-introduce .product .english-text {
  position: absolute;
  top: 144px;
  right: -124px;
  transform: rotate(90deg);
}
.ac-companion-communication .way-list .way-item:nth-of-type(1) {
  /* background: url('../assets/images/ac-companion/way01.png'); */
}
.ac-companion-communication .way-list .way-item:nth-of-type(2) {
  /* background: url('../assets/images/ac-companion/way02.png'); */
  width: 324px;
  height: 400px;
}
.ac-companion-communication .way-list .way-item:nth-of-type(3) {
  /* background: url('../assets/images/ac-companion/way03.png'); */
  width: 324px;
  height: 400px;
}
.ac-companion-communication .way-list .icon-list {
  width: 70%;
}
.ac-companion-communication .way-list .icon-list .icon {
  width: 54px;
  height: 54px;
  border: 1px solid #fff;
  border-radius: 50%;
}
.ac-companion-communication .way-list .way-item:nth-of-type(1) .msg p {
  line-height: 2;
}
.ac-companion-communication .way-list .way-item .categary-list .title {
  color: var(--product-primary-color);
}
.ac-companion-communication .wifi6-peculiarity {
  /* background: url('../assets/images/ac-companion/wifi6.png'); */
}
.ac-companion-communication .wifi6-peculiarity .explain {
  color: #f3f5f7;
}
.ac-companion-feature-introduce {
  position: relative;
  /* background: url('../assets/images/ac-companion/feature01.png') no-repeat; */
  background-repeat: no-repeat;
  z-index: -1;
}
.ac-companion-feature-introduce::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(255, 255, 255, 0.6);
  z-index: -1;
}
.ac-companion-feature-introduce .product-img,
.ac-companion-feature-introduce .feature-wrapper {
  width: 50%;
}
.ac-companion-feature-introduce .product-img img {
  transform: translate(-160px, 154px);
}
.ac-companion-feature-introduce .feature-wrapper .item {
  margin-top: 48px;
  margin-left: 32px;
}
.ac-companion-feature-introduce .feature-wrapper .item .title::after {
  content: '';
  position: absolute;
  top: 50%;
  left: -64px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  transform: translateY(-50%);
  background: var(--product-primary-color);
}
.ac-companion-feature-introduce .feature-wrapper .item .msg {
  color: #6d6d6d;
}

/**
 * 管理平台
 */
.home-banner .banner-content,
.platform-banner .banner-content {
  position: relative;
  top: 0;
  left: 0;
  height: 100%;
}
.platform-banner.banner .description {
  font-size: 14px;
}
.platform-banner .banner-content .description {
  margin-top: 132px;
  margin-left: 64px;
}
.platform-banner .banner-content .description .title {
  font-size: 48px;
  line-height: 1;
}
.platform-banner .banner-content .title::after {
  content: '';
  position: absolute;
  top: -48px;
  right: -24px;
  width: 50%;
  height: 2px;
  background: #fff;
}
.platform-banner .banner-content .title::before {
  content: '';
  position: absolute;
  top: -54px;
  right: -18px;
  width: 2px;
  height: 250%;
  background: #fff;
}
.platform-banner .banner-content .description .try-btn {
  margin-top: 48px;
  padding: 2px;
  border: 1px solid #9aa5d3;
  width: max-content;
}
.try-btn a {
  padding: 4px 64px;
  background: #9aa5d3;
  color: #fff;
  line-height: 2;
}
.platform-content .page-wrapper {
  margin-top: 64px;
}
.platform-content .page-wrapper .item {
  padding: 16px 32px;
  background: var(--primary-bg-color);
  height: 110px;
  transition: all 0.3s;
}
.platform-content .page-wrapper .content .img img {
  width: 100%;
  height: 596px;
}
.platform-content .page-wrapper .item .description {
  width: 180px;
}
.platform-content .page-wrapper .navbar .item img {
  transition: all 0.3s;
}
.platform-content .page-wrapper .navbar .item.active img {
  transform: rotateY(180deg);
}
.platform-content .page-wrapper .item.active {
  background: #9aa5d3;
}
.platform-content .page-wrapper .item .title {
  margin-bottom: 12px;
}

/**
 * 首页
 */
.home-banner .title {
  margin-top: 72px;
  font-size: 64px;
  color: #333;
  line-height: 1;
}
.home-banner .msg {
  color: #333;
  font-size: 12px;
}
.home-banner .more-btn {
  padding: 12px 54px;
  background: #fff;
  border-radius: 24px;
  color: #8dcfff;
  width: max-content;
  line-height: 1;
  font-size: 14px;
}
.home-banner .img-content img {
  position: absolute;
}
.home-banner .img-content img:nth-of-type(1) {
  top: 14px;
  left: 184px;
  width: 500px;
}
.home-banner .img-content img:nth-of-type(2) {
  width: 200px;
  top: 156px;
  left: 150px;
}
.home-banner .img-content img:nth-of-type(3) {
  width: 200px;
  top: 210px;
  left: 0;
}
.hot-product .content .left-box {
  /* background: url('../assets/images/index/product-bg01.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 48px;
}
.hot-product .content .left-box .msg .text:nth-of-type(1) {
  color: #d6d6d6;
}
.hot-product .content .more-btn a {
  padding: 8px 48px;
  background: transparent;
  color: #fff;
  border: 1px solid #fff;
}
.hot-product .content .right-box .box {
  /* background: url('../assets/images/index/product-bg02.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hot-product .content .right-box .top-box .msg {
  color: #d6d6d6;
  font-size: 12px;
}
.hot-product .content .right-box .bottom-box .msg {
  color: #d6d6d6;
  font-size: 12px;
}
.hot-product .content .right-box .bottom-box .text {
  margin-right: 64px;
}
.hot-product .tip {
  text-align: right;
  margin-top: 64px;
  font-size: 12px;
}
.importance-product .content {
  /* background: url('../assets/images/index/importance-product.png') no-repeat center / cover; */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.importance-product .content::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.5);
}
.importance-product .content .main {
  z-index: 9;
}
.importance-product .content .main .card {
  background: rgba(255, 255, 255, 0.8);
}
.importance-product .content .main .card > .img {
  height: 200px;
}
.importance-product .content .main .card .text {
  font-size: 12px;
}
.importance-product .content .main .card .main {
  transition: all 0.3s;
}
.importance-product .content .main .card:hover .main {
  background: #fff;
}
.internet-of-things-platform .content > img {
  display: block;
}
.internet-of-things-platform .content .introduce-platform {
  position: absolute;
  top: -650px;
  right: 64px;
  padding: 48px;
  background: #fff;
  border-radius: 12px;
  width: 600px;
}
.internet-of-things-platform .content .introduce-platform .feature-list .item {
  width: 50%;
}
.internet-of-things-platform .content .introduce-platform .try-btn a {
  color: #fff;
  background: #f7a838;
  padding: 8px 48px;
}

.internet-of-things-platform .news-list .news-card {
  background: #fcfcfc;
  box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.1);
  gap: 16px;
  width: 24%;
}
.internet-of-things-platform .news-list .news-card .title {
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 限制最大行数为2 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all; /* 对于英文单词，可以考虑换成word-wrap: break-word; */
  height: calc(2 * 1em); /* 计算高度为两行的高度 */
  width: 90%;
  line-height: 1;
}
.internet-of-things-platform .news-list .news-card .description {
  display: -webkit-box;
  -webkit-line-clamp: 4; /* 限制最大行数为2 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.5;
  text-overflow: ellipsis;
  word-break: break-all; /* 对于英文单词，可以考虑换成word-wrap: break-word; */
  height: calc(4 * 1.5em); /* 计算高度为两行的高度 */
  color: #666;
}
.internet-of-things-platform .news-list .news-card .more-btn a {
  color: red;
}
.internet-of-things-platform .container > .more-btn a {
  padding: 8px 48px;
  color: #fff;
  background: red;
}

/** 
 * 新闻页面
 */
.news-nav-bar {
  background: #92d4ff;
}
.news-nav-bar .container {
  padding: 0 232px;
  height: 64px;
}
.news-nav-bar .container .item a {
  text-align: center;
  line-height: 3.2;
}
.news-nav-bar .container .active::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  border-radius: 3px;
  background: var(--primary-color);
}
.news-container .search-card {
  padding: 6px 32px;
  margin: 32px auto;
  width: 400px;
  box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.1);
}
.news-container .search-card input {
  padding: 8px 32px 8px 0;
  height: 100%;
  font-size: 14px;
  border: none;
}
.news-container .search-card input:focus-visible {
  outline: none;
}
.news-container .search-card .search-btn {
  padding-left: 16px;
  color: var(--primary-color);
  cursor: pointer;
  line-height: 1;
  user-select: none;
}
.news-container .search-card .search-btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 2px;
  height: calc(100% + 4px);
  transform: translateY(-45%);
  background: var(--primary-color);
  border-radius: 2px;
}
.news-container .search-card .input-content .close-icon {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  text-align: left;
  line-height: 1.2;
  font-size: 16px;
  cursor: pointer;
  display: none;
}

.news-container .news-list .item .title {
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 限制最大行数为2 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all; /* 对于英文单词，可以考虑换成word-wrap: break-word; */
  height: calc(2 * 1.5em); /* 计算高度为两行的高度 */
  width: 90%;
}
.news-container .news-list {
  padding: 0 84px;
}
.news-container .news-list .item {
  padding: 32px;
  gap: 54px;
  cursor: pointer;
  /* box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.1); */
}
.news-container .news-list .item:hover .title {
  color: var(--primary-color);
}
.news-container .news-list .item .description {
  display: -webkit-box;
  -webkit-line-clamp: 4; /* 限制最大行数为2 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.5;
  text-overflow: ellipsis;
  word-break: break-all; /* 对于英文单词，可以考虑换成word-wrap: break-word; */
  height: calc(4 * 1.5em); /* 计算高度为两行的高度 */
  color: #666;
}
.news-container .pagination {
  margin: 32px;
}
.news-container .news-list .item .date {
  color: #666;
}
.news-container .pagination .start-page,
.news-container .pagination .end-page {
  cursor: pointer;
  padding: 8px 16px;
  border-radius: 4px;
  border: 1px solid var(--primary-text-color);
  line-height: 1.1;
}
.news-container .pagination .num {
  cursor: pointer;
  padding: 8px 16px;
  border-radius: 4px;
}
.news-container .pagination .num.active {
  background: var(--primary-color);
  color: #fff;
}

.news-container .pagination .num:hover {
  color: var(--primary-color);
}
.news-container .pagination .page-num .active:hover {
  color: #fff;
}
.news-container .pagination .start-page:hover,
.news-container .pagination .end-page:hover {
  color: var(--primary-color);
  border-color: var(--primary-color);
}

/**
 * 联系我们
 */
.contact-container .text {
  line-height: 1;
}
.contact-container .decorate {
  width: 120px;
  height: 4px;
  background: var(--primary-color);
  border-radius: 4px;
}
.contact-container .decorate::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--primary-color);
}
.contact-container .title .decorate:nth-of-type(1)::after {
  right: -5px;
}
.contact-container .title .decorate:nth-of-type(2)::after {
  left: -5px;
}
.contact-container .content .label {
  width: 48px;
}
.contact-container .content {
  margin-top: 64px;
  padding: 0 48px;
  gap: 64px;
}
.contact-container .map {
  height: 360px;
  width: 640px;
}

/**
 * 文章详情
 */
.article-main .content p {
  line-height: 1.5;
  word-wrap: break-word;
  word-break: break-all;
  white-space: normal;
}
.article-main a {
  color: var(--primary-color);
}
.article-main .content ul,
.article-main .content ol {
  padding-left: 16px;
}
.article-main .content ul,
.article-main .content li {
  list-style: decimal;
}
.article-main pre {
  margin: 4px 0;
  padding: 16px;
  background: var(--primary-bg-color);
  border: 1px solid #e6e6e6;
  border-radius: 8px;
  white-space: pre-wrap;
}

/**
 * 关于我们
 */
.about-us .description {
  gap: 48px;
}
.idea-us .left-content .title,
.idea-us .right-content .title {
  line-height: 1;
}
.idea-us .left-content .title::after,
.idea-us .right-content .title::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  background: #f29522;
  border-radius: 50%;
}
.idea-us .left-content .title::after {
  right: -24px;
}
.idea-us .right-content .title::after {
  left: -24px;
}

/**
 * 技术文档
 */
.spec-container .spec-content {
  padding: 84px 16px;
}
.spec-container .spec-content .spec-header {
  padding: 24px 32px;
}
.spec-container .spec-content .spec-card {
  background: var(--primary-bg-color);
  padding: 24px 48px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.spec-container .spec-content .spec-header {
  border-radius: 12px 12px 0 0;
  background: var(--primary-color);
}
.spec-container .spec-content .online-preview {
  font-size: 16px;
  cursor: pointer;
}

/**
 * 智能插座
 */
.socket-container {
  position: relative;
  background: #839cbb;
  padding-bottom: 84px;
}
.socket-container::after {
  content: '';
  position: absolute;
  top: 1020px;
  left: 0;
  width: 100%;
  height: 365px;
  background: #fffcf6;
}
.socket-container img {
  display: block;
  z-index: 9;
}
.socket-container img:nth-child(n + 2) {
  margin: 84px 0;
}
.socket-container img:nth-child(1) {
  position: relative;
  transform: translateX(-360px);
}
.socket-container img:nth-child(11) {
  transform: translateX(-180px);
}