.home-services{ width: 100%; padding: 55px 0; background: url(../images/homeserbg.jpg) no-repeat center; background-size:cover;}
.home-services h1{ text-align:center; margin-bottom:30px; line-height:42px; font-size:2rem;}
.home-services-box{ gap: 30px; grid-template-columns: repeat(2, 1fr); /* 3 列 */  display: grid;}
.home-services-item{ width: 100%; color: #FFFFFF; padding: 40px 32px;}
.home-services-item h2{ color: #FFFFFF; font-size: 1.7rem; line-height: 32px; margin: 40px 0 20px 0;}
.home-services-item p{ font-size: 1rem;}
.home-services-item a{ display: inline-block; height: 40px; line-height: 40px; padding: 0 20px; margin-top: 50px; background: #FFFFFF;border-radius: 19px; color: #C2272D;}
.home-services-item a img{ margin-left: 10px;}
.home-services-item:nth-child(1){ background: url(../images/hsbg1.jpg) no-repeat center; background-size:cover;}
.home-services-item:nth-child(2){ background: url(../images/hsbg2.jpg) no-repeat center; background-size:cover;}

/* ===== Only Hover Effects (keep your old css) ===== */

/* 让卡片可以承载遮罩/高光 */
.home-services-item{
  position: relative;
  overflow: hidden;
  border-radius: 8px; /* 不想改变圆角就删掉这行 */
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
  will-change: transform;
}

/* hover 浮起 + 阴影 */
.home-services-item:hover{
  transform: translateY(-8px);
  box-shadow: 0 20px 55px rgba(0,0,0,.28);
}

/* 暗色遮罩（默认很淡，hover 加深） */
.home-services-item::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.45) 100%);
  opacity: .35;
  transition: opacity .25s ease;
  z-index: 1;
  pointer-events:none;
}
.home-services-item:hover::after{
  opacity: .75;
}

/* 高光层（hover 出现一点点亮面） */
.home-services-item::before{
  content:"";
  position:absolute;
  inset:-40px;
  background: radial-gradient(circle at 20% 10%, rgba(255,255,255,.22), rgba(255,255,255,0) 55%);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .25s ease, transform .25s ease;
  z-index: 2;
  pointer-events:none;
}
.home-services-item:hover::before{
  opacity: 1;
  transform: translateY(0);
}

/* 保证卡片内容在遮罩/高光之上 */
.home-services-item > *{
  position: relative;
  z-index: 3;
}

/* 图标微动 */
.home-services-item > img{
  transition: transform .25s ease, filter .25s ease;
}
.home-services-item:hover > img{
  transform: translateY(-2px) scale(1.04);
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.25));
}

/* 标题/文案轻微上移（不改原字号等） */
.home-services-item h2,
.home-services-item p{
  transition: transform .25s ease, opacity .25s ease;
}
.home-services-item:hover h2,
.home-services-item:hover p{
  transform: translateY(-2px);
  opacity: .98;
}

/* 按钮 hover：颜色切换 + 光扫 */
.home-services-item a{
  position: relative;
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}

/* 你要的主色调 #171C61（仅 hover 时改，不影响默认） */
.home-services-item:hover a{
  transform: translateY(-1px);
  background:#171C61;
  color:#fff;
  box-shadow: 0 14px 28px rgba(23,28,97,.35);
}

/* 光扫效果 */
.home-services-item a::before{
  content:"";
  position:absolute;
  top:-40%;
  left:-70%;
  width:55%;
  height:180%;
  transform: rotate(18deg);
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.55) 50%,
    rgba(255,255,255,0) 100%);
  transition: left .6s ease;
  pointer-events:none;
}
.home-services-item:hover a::before{
  left:130%;
}

/* 箭头 hover 右移 + 变白（适配深色按钮） */
.home-services-item a img{
  transition: transform .2s ease, filter .2s ease;
}
.home-services-item:hover a img{
  transform: translateX(4px);
  filter: brightness(0) invert(1);
}


.home-brand{ width: 100%; height: auto; background: url(../images/homebrandbg.jpg) no-repeat center; background-size:cover; padding: 60px 0; color: #FFFFFF;}


.home-brand-title{ text-align: center;}
.home-brand-title em{ display: block; line-height: 32px; font-size: 1rem;}
.home-brand-title h2{ color: #FFFFFF; font-size: 3.2rem; line-height: 80px; text-transform:uppercase;}
.home-brand-list{margin: 20px auto;}
.home-brand-list a{ display: block; width: 16%; margin: 1%; border-radius: 8px; padding: 5px; background: #FFFFFF;}
.home-brand-list a img{ width: 100%; height: auto;}
.home-brand-list a:nth-child(6){ margin-left: 10%;}
.home-brand-list a:hover{  transition: transform .2s ease; transform: translateX(10px); }


.home-brand-more{ width: 100%; text-align: center; margin-top: 30px;}
.home-brand-more a{ display: inline-block; height: 65px; line-height: 65px; background: #C2272D;border-radius: 30px; color: #FFFFFF; padding: 0 45px; font-size: 1.2rem;}
.home-brand-more a img{ margin-left: 25px;}
/* 按钮 hover：颜色切换 + 光扫 */
.home-brand-more a{
  position: relative;
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}

/* 你要的主色调 #171C61（仅 hover 时改，不影响默认） */
.home-brand-more a:hover {
  transform: translateY(-1px);
  background:#171C61;
  color:#fff;
  box-shadow: 0 14px 28px rgba(23,28,97,.35);
}

/* 光扫效果 */
.home-brand-more a::before{
  content:"";
  position:absolute;
  top:-40%;
  left:-70%;
  width:55%;
  height:180%;
  transform: rotate(18deg);
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.55) 50%,
    rgba(255,255,255,0) 100%);
  transition: left .6s ease;
  pointer-events:none;
}
.home-brand-more a:hover::before{
  left:130%;
}

/* 箭头 hover 右移 + 变白（适配深色按钮） */
.home-brand-more a img{
  transition: transform .2s ease, filter .2s ease;
}
.home-brand-more a:hover img{
  transform: translateX(4px);
  filter: brightness(0) invert(1);
}

.home-title{ padding: 55px 0 30px 0;}
.home-title h2{ font-size: 1.8rem; line-height: 40px;}
.home-title a{ display: inline-block;height: 40px; font-size: 1rem; line-height: 38px; border: 1px solid #13141D; border-radius:30px; padding: 0 25px;}
.home-title a img{ margin-left: 20px;}
.home-title a:hover{ background: #c2272d; color: #FFFFFF; border-color:#c2272d ;}
.home-title a:hover img{filter: brightness(0) invert(1); transform: translateX(4px);}

.home-products{ padding-bottom: 55px;}
.home-products-list{gap: 20px; grid-template-columns: repeat(5, 1fr); /* 3 列 */  display: grid;}
.home-products-list a{ display: block; width: 100%; text-align: center;}
.home-products-list a img{ width: 150px; height: 150px;}
.home-products-list a p{ font-size: 1.1rem; line-height: 24px; padding: 15px 0;}
.home-products-list a:hover{ background: #FFFFFF; border-radius:8px;  transform: translateY(8px);}



.home-feaproducts{ width: 100%; background: #032E5D; padding-bottom: 90px;}
.home-feaproducts h2{ color: #FFFFFF;}
.home-feaproducts .home-title a{  border: 1px solid #FFFFFF; color: #FFFFFF;}
.home-feaproducts .home-title a:hover{ border-color:#c2272d ;}

.home-feaproducts-box{}
.main_visual1{ width: 100%; height: 100%; position: relative;}
.main_visual1 .owl-carousel,.main_visual1 .owl-stage-outer,.main_visual1 .owl-stage,.main_visual1 .owl-carousel .owl-item{width: 100%;height: 100% !important; }
.main_visual1 .owl-carousel .item{width: 100%;height: 100%; background: #FFFFFF; border-radius: 8px; padding: 20px 15px;}
.main_visual1 .owl-carousel .item .homefea-pic{ width: 100%; height: auto; overflow: hidden;}
.main_visual1 .owl-carousel .item .homefea-pic img{ width: 80%; height: auto; margin: 0 auto;}
.main_visual1 .owl-carousel .item .homefea-info{ margin-top: 15px;}
.main_visual1 .owl-carousel .item .homefea-info a{ display: block; color: #111111; font-family: myFirstFont1; height: 24px; line-height: 24px; overflow: hidden;}
.main_visual1 .owl-carousel .item .homefea-info p{ line-height: 18px; height: 18px; overflow:hidden;}
.main_visual1 .owl-carousel .item .homefea-stock{ width: 100%; line-height: 20px; margin-top: 10px;}
.main_visual1 .owl-carousel .item .homefea-stock b{ font-size: 0.8rem;}
.main_visual1 .owl-carousel .item .homefea-stock b span{ color: #C2272D;}
.main_visual1 .owl-carousel .item .homefea-cart{ margin-top: 10px;}
.main_visual1 .owl-carousel .item .homefea-cart a{height: 28px;background: #F6F8FA;border-radius: 6px;}
.main_visual1 .owl-carousel .item .homefea-cart img{ width: 11px; height: 11px; display: inline-block; margin-right: 8px;}

.main_visual1 .owl-carousel .item:hover .homefea-pic img{transform: scale(1.1); -webkit-transform: scale(1.1);}
.main_visual1 .owl-carousel .item:hover .homefea-info a{ color: #C2272D;}
.main_visual1 .owl-carousel .item:hover .homefea-cart a{ background: #C2272D; color: #FFFFFF;}
.main_visual1 .owl-carousel .item:hover .homefea-cart a img{filter: brightness(0) invert(1); transform: translateX(4px);}

.main_visual1 .owl-prev,.main_visual1 .owl-next{ display: none; text-indent: -999px; overflow: hidden;}

.main_visual1 .owl-dots{ width: 100%; text-align: center; height: 4px; position:absolute; left: 0; bottom:-30px;  z-index: 999;}
.main_visual1 .owl-dots .owl-dot{display: inline-block;  margin:0 4px;}
.main_visual1 .owl-dots .owl-dot span{  display: inline-block; width: 8px; height: 8px; background:#CCCCCC; border-radius: 4px;}
.main_visual1 .owl-dot.active span{ background:#c2272d; width: 26px;}
.main_visual1 .owl-nav{ display: none; height: 0;}


.home-relevant{ width: 100%; height: auto; background: url(../images/homeappbg.jpg) no-repeat center; background-size:cover; padding-bottom: 60px;}

/* ===== Relevant Tabs ===== */
.home-relevant-tab{
  background:#fff;
  height:68px;
  border-radius:12px;
  box-shadow: 0 12px 30px rgba(0,0,0,.08);
  border: 1px solid rgba(0,0,0,.06);
  overflow:hidden;
}

.home-relevant-tab ul{
  height:100%;
  margin:0;
  padding:0;
  list-style:none;
  display:flex;
  align-items:center;
}

/* 每个 tab */
.home-relevant-tab ul li{
  flex:1;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;

  font-size:15px;
  font-weight:600;
  color:#4b5563;
  cursor:pointer;
  position:relative;
  user-select:none;

  transition: background .2s ease, color .2s ease;
}

/* 竖线分隔（最后一个不显示） */
.home-relevant-tab ul li:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:18px;
  width:1px;
  height:32px;
  background: rgba(0,0,0,.10);
}

/* hover */
.home-relevant-tab ul li:hover{
  color:#111827;
  background:#f7f7f7;
}

/* active（图里红色块） */
.home-relevant-tab ul li.active{
  background:#C2272D;
  color:#fff;
}
.home-relevant-tab ul li.active::after{
  opacity:0; /* active 的右侧线条隐藏更像图里效果 */
}

/* ===== Image Area ===== */
.home-relevant-box{
  margin-top:15px;
}

.home-relevant-list{
  width:100%;
  height:auto;
  display:none; /* 交给 JS 控制 */
}

/* 默认显示第一张（即使 JS 还没跑也能看到） */
.home-relevant-box .home-relevant-list:first-child{
  display:block;
}

.home-relevant-list a{
  display:block;
  width:100%;
  border-radius:16px;
  overflow:hidden;
  box-shadow: 0 18px 46px rgba(0,0,0,.18);
  border: 1px solid rgba(0,0,0,.08);
}

.home-relevant-list img{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
  transform: translateZ(0);
}

/* 可选：图片 hover 轻微放大（更高级） */
.home-relevant-list a:hover img{
  transform: scale(1.01);
  transition: transform .35s ease;
}


.home-blog{ width: 100%; background: url(../images/homeblogbg.jpg) no-repeat center; background-size:cover; padding-bottom: 55px;}
.home-blog h2{ color: #FFFFFF;}
.home-blog .home-title a{  border: 1px solid #FFFFFF; color: #FFFFFF;}
.home-blog .home-title a:hover{ border-color:#c2272d ;}

.home-blog-list{gap: 12px; grid-template-columns: repeat(4, 1fr); /* 3 列 */  display: grid;}
.home-blog-item{ width: 100%; background: #FFFFFF; border-radius: 6px; padding: 25px 20px; cursor: pointer;}
.home-blog-item:hover{ transform: translateY(8px);  transition: transform .25s ease;}
.home-blog-item:hover a.homebloglinks1{ color: #C2272D;}
.home-blog-item:hover a.homebloglinks2{ border-color:#C2272D; color: #C2272D;}
.home-blog-item em{ display: block; height: 24px; line-height: 24px; color: #C2272D;}
.home-blog-item a.homebloglinks1{ display: block; font-family: myFirstFont1; font-size: 1.1rem; line-height: 24px; height: 48px; overflow: hidden; margin-top: 5px;}
.home-blog-item-pic{ width: 100%;height: auto; overflow: hidden; border-radius: 6px;  margin-top: 20px;} 
.home-blog-item-pic img{width: 100%;height: auto;  border-radius: 6px;}
.home-blog-item-pic a:hover img{ transform: scale(1.05); transition: transform .35s ease;}
.home-blog-item p{ color: #666666; line-height: 52px; height: 52px; overflow: hidden;}

.home-blog-item a.homebloglinks2{height: 34px;border-radius: 16px;border: 1px solid #CCCCCC; padding: 0 20px;}
.home-blog-item a.homebloglinks2 i{ font-size: 1.2rem;}


@media (max-width: 768px) {

.home-services{ padding: 25px 0;}
.home-services-box{ gap:15px; grid-template-columns: repeat(1, 1fr);}
.home-services-item{ padding: 25px;}
.home-services-item h2{ font-size: 1.2rem; margin: 10px 0;}
.home-services-item p{ font-size: 0.9rem;}
.home-services-item a{ margin-top: 20px;}


.home-brand{  padding: 25px 0; }

.home-brand-title em{  line-height: 24px; font-size: 0.9rem;}
.home-brand-title h2{font-size: 1.6rem; line-height: 40px;}
.home-brand-list{margin: 10px auto;}
.home-brand-list a{ display: block; width: 48%; margin: 1%; border-radius: 8px; padding: 5px; background: #FFFFFF;}
.home-brand-list a:nth-child(6){ margin-left: 0;}


.home-brand-more{ margin-top: 20px;}
.home-brand-more a{ height: 45px; line-height: 45px; color: #FFFFFF; padding: 0 25px; font-size: 1rem;}
.home-brand-more a img{ margin-left: 15px;}

.home-title{ padding: 20px 0;}
.home-title h2{ font-size: 1.4rem; line-height: 30px;}
.home-title a{ display: none;}


 .home-relevant-tab{ height:auto; }
  .home-relevant-tab ul{
    flex-wrap:wrap;
  }
  .home-relevant-tab ul li{
    flex: 1 1 33.33%;
    height:54px;
  }
  .home-relevant-tab ul li:not(:last-child)::after{
    display:none; /* 小屏不画竖线更干净 */
  }

 .home-relevant-tab ul li{
    flex: 1 1 50%;
    height:52px;
    font-size:14px;
  }
  .home-products-list{
    display: flex;                 /* 改成横向 */
    overflow-x: auto;
    overflow-y: hidden;
    gap: 14px;
    padding: 10px 6px 20px;

    scroll-snap-type: x mandatory; /* 关键：滑动吸附 */
    -webkit-overflow-scrolling: touch;
  }

  /* 隐藏横向滚动条（iOS/Android） */
  .home-products-list::-webkit-scrollbar{
    display: none;
  }

  .home-products-list a{
    flex: 0 0 68%;                 /* 每次滑一张（可改 80% / 60%） */
    max-width: 68%;
    background: #fff;
    border-radius: 12px;
    box


}

.home-products-list a img{ width: 100px; height: 100px;}

.home-blog{ padding-bottom: 25px;}


.home-blog-list{gap: 12px; grid-template-columns: repeat(1, 1fr); /* 3 列 */  display: grid;}



}