.fl1{ padding-top:30px; }
.w1600{color: #333}
.fl1 .title h1{ color:#333; font-size:46px }
.fl1 .title h4{ color:#333; font-size:18px; line-height: 60px}
.fl1 .desc{ padding-top:15px; }
.fl1 .desc .js{  width:49%; padding:25px; background:#f2f2f2 ;height:100%;display:table-cell; }
.fl1 .desc  h5{ font-size:16px; line-height:18px; font-weight:600; padding-bottom:10px; }
.fl1 .desc .js .cont{ font-size:14px;  line-height: 26px; min-height:130px}
.fl1 .desc .ys{  width:49%; background:#f2f2f2; padding:25px; height:100%;  display:table-cell;}
.fl1 .desc .ys .cont{font-size:14px;  line-height: 26px; min-height:130px}
.fl1 .desc .ys .cont ul{ padding-left:15px; }
.fl1 .desc .ys .cont ul li{ line-height:26px; list-style:disc; }
.sfdfd{ display:table-cell;width:2%}
 .main {
    margin: 0 auto;
    box-shadow: 0 1em 1em #999;
    height: 465px;
  }
h2{ font-weight:400}
.cl{ clear:both;}
.prodxl{ background:#f2f2f2; padding-top:15px; padding-bottom:15px; margin-top:50px; } 
.prodxl h2{ line-height:60px; padding-left:25px }
.prodxl .catelist ul li{float: left;width: 23%; margin-right: 1%;margin-left: 1%; position: relative; margin-bottom: 40px; overflow: hidden;}
.prodxl .catelist ul li img{width: 100%; height: auto}
.prodxl .catelist ul li .tit{ position:absolute; left:0px; top:0px; width:100%; height:100%; background:#003f7d;opacity:0.7;  text-align:center; color:#fff; font-size:30px; }
.prodxl .catelist ul li .tit h4{ margin-top:28% }
.prodxl .catelist .hidinfo {position: absolute; left: 0;width: 100%;height: 100%;padding: 0 20px;box-sizing: border-box;bottom: -1500px;z-index: 2;transition: 0.3s; color: #fff}
.prodxl .catelist .hidinfo .pmig{ padding:20px; text-align:center; }
.prodxl .catelist .hidinfo .pmig h5{ font-size:20px; width:100%; border-bottom: solid 1px #fff; line-height:25px; height:50px; overflow:hidden; }
.prodxl .catelist .hidinfo .pmig .text{ line-height:20px; padding:15px; height:60px; }
.prodxl .catelist .hidinfo .pmig .more{ text-align:right; padding-top:15px; }
.prodxl .catelist ul li a:hover .hidinfo{bottom: 0px;}
.prodxl .catelist ul li a:hover .tit h4{display: none;}
.prodxl .catelist ul li a:hover .tit {opacity:1;}
.solid{ background:#fff }
.solid h2{ line-height:60px; padding-left:25px }
.mhn-inner{ background:#f2f2f2; text-align: center;}
.mhn-slide .mhn-item{width:100%; padding-left:15px; padding-right:15px; text-align:left; padding-bottom:15px;}
.mhn-slide,.mhn-slide1{ padding-bottom:50px;}
.mhn-slide .mhn-inner{width:100%;box-shadow: 0 0 10px rgba(0,0,0,0.2);  border-radius:3px }
.mhn-slide .mhn-text h4{ width: 100%; font-size: 16px; line-height: 28px; height:56px; color: #003f7e;overflow:hidden; text-align: center; color: #333; padding-bottom: 15px;}
.mhn-slide .mhn-text .desc{ text-align:center; line-height:24px; height:48px; overflow:hidden; margin-bottom:25px; }
.mhn-slide .mhn-text .more{ border: solid 1px #333; padding:5px 0px; border-radius:3px; margin-bottom:15px; width:100px; margin: 0 auto; }
.mhn-slide .mhn-item img{ width:100%; height:100%}
.mhn-slide .mhn-img{ height:230px;}
.mhn-slide .mhn-text{padding:5%;}
.mhn-slide .mhn-text span{height: 22px; padding:5px 10px 5px 10px; text-align: center; border-radius:4px; line-height: 22px; color: #fff ; font-size: 12px; background: #003f7e; margin-bottom: 25px;}
.mhn-slide .mhn-text span a{color:#fff}
.mhn-slide .mhn-text h2{ font-weight: normal; font-size: 14px; color: #999;}
.mhn-slide .mhn-text h2 a{ display: inline-block; font-size: 14px; color: #666; float: right;}
.mhn-slide .mhn-inner a:hover .more{ background:#003f7d; color:#fff }
.mhn-slide .owl-stage-outer{z-index:1}
.mhn-slide .owl-nav svg{color:currentColor}
.mhn-slide .owl-nav .disabled{display:none}
.mhn-slide1 .owl-nav .disabled{display:none}
.mhn-slide .owl-prev,
.mhn-slide .owl-next{top:25%;z-index:2;width:40px;height:40px;padding:8px;margin-top:-20px;position:absolute;border-radius:50%;background-color:#fff;-webkit-box-shadow:0 4px 4px rgba(0,0,0,.3),0 0 4px rgba(0,0,0,.2);box-shadow:0 4px 4px rgba(0,0,0,.3),0 0 4px rgba(0,0,0,.2)}
.mhn-slide1 .owl-prev,.mhn-slide1 .owl-next{top:42%;z-index:2;width:40px;height:40px;padding:8px;margin-top:-20px;position:absolute;border-radius:50%;background-color:#fff;-webkit-box-shadow:0 4px 4px rgba(0,0,0,.3),0 0 4px rgba(0,0,0,.2); box-shadow:0 4px 4px rgba(0,0,0,.3),0 0 4px rgba(0,0,0,.2)}
.mhn-slide .owl-prev{left:-25px}
.mhn-slide .owl-next{right:-25px}
.mhn-slide1 .owl-prev{left:-20px}
.mhn-slide1 .owl-next{right:-20px}
.mhn-inner img{ width:100%}
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}

@-webkit-keyframes L_circle_rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes L_circle_rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes L_stroke_rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}100%{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@keyframes L_stroke_rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}100%{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@-webkit-keyframes L_stroke_left_grow{0%,100%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}50%{-webkit-transform:rotate(-140deg);transform:rotate(-140deg)}}@keyframes L_stroke_left_grow{0%,100%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}50%{-webkit-transform:rotate(-140deg);transform:rotate(-140deg)}}@-webkit-keyframes L_stroke_right_grow{0%,100%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}50%{-webkit-transform:rotate(140deg);transform:rotate(140deg)}}@keyframes L_stroke_right_grow{0%,100%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}50%{-webkit-transform:rotate(140deg);transform:rotate(140deg)}}.loader-circle{top:50%;left:50%;z-index:1;color:#444;margin-top:-1em;margin-left:-1em;position:absolute;-webkit-animation:L_circle_rotate 1.568s linear infinite both;animation:L_circle_rotate 1.568s linear infinite both}.loader-circle .loader-stroke-left:before,.loader-circle .loader-stroke-right:before,.loader-circle:before{content:'';display:block;border-style:solid;border-width:.21429em;border-color:currentColor}.loader-circle,.loader-circle .loader-stroke-left,.loader-circle .loader-stroke-left:before,.loader-circle .loader-stroke-right,.loader-circle .loader-stroke-right:before,.loader-circle:before{width:2em;height:2em;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box}.loader-circle .loader-stroke-left:before,.loader-circle .loader-stroke-right{position:absolute;clip:rect(0 2em 2em 1em)}.loader-circle .loader-stroke-left,.loader-circle .loader-stroke-right:before{position:absolute;clip:rect(0 1em 2em 0)}.loader-circle:before{position:absolute;clip:rect(0 1.05em 1em .95em)}.loader-circle .loader-stroke-left,.loader-circle .loader-stroke-right,.loader-circle:before{-webkit-animation:L_stroke_rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both;animation:L_stroke_rotate 5332ms cubic-bezier(.4,0,.2,1) infinite both}.loader-circle .loader-stroke-right:before{-webkit-animation:L_stroke_right_grow 1333ms cubic-bezier(.4,0,.2,1) infinite both;animation:L_stroke_right_grow 1333ms cubic-bezier(.4,0,.2,1) infinite both}.loader-circle .loader-stroke-left:before{-webkit-animation:L_stroke_left_grow 1333ms cubic-bezier(.4,0,.2,1) infinite both;animation:L_stroke_left_grow 1333ms cubic-bezier(.4,0,.2,1) infinite both}
.flor4{ background:#f2f2f2 }

.flor4 .videoleft{ float:left; width:63%; }
.flor4 .caseright{ float:right;width:32.8%; }
.flor4 .tit h2{ line-height:70px;  }
.sp-thumbnail-container{}
.sp-thumbnail{  color:#333; text-align:center; width:100%; height:100%; background:#c1c1c1; line-height:40px; }

.caseright .catelist{ max-height:680px; overflow-y:none; overflow-x:none}
.caseright .catelist ul li{ padding-bottom:30px }
.caseright .catelist ul li img{width: 100%; height: auto;}
.caseright .catelist ul li div{ position:relative; }
.caseright .catelist .tit{ position:absolute; bottom:0px; left:0px; background:#003f7d; color:#fff; width:100%; height:35px; line-height:35px; padding-left:3%; padding-right:3% ;opacity:0.8; }
.flor5{ padding-top:40px; padding-bottom:40px; }
.cp-xx3 dl{
	margin:0;
	margin-left: -2%;
}
.voidetitle{ text-align:center; position:absolute;bottom:0px; width:90%; height:30px; line-height:30px;}
.cp-xx3 dd{
	float: left;
	width: 31.333333%;
	margin-left: 2%;
	height: 306px;
	background-color: #f3f3f3;
	padding: 37px 30px 0;

}
.voidelist li{float:left;width:33px}
.cp-xx4{
	margin-top: 50px;
}
.cp-xx4-list-wp{
	padding:10px 0 15px;
}
.cp-xx4-list .item{
	background-color: #f3f3f3;
	padding: 35px;
	padding-bottom: 0;
}
.cp-xx4-list .imgbox_a{
	padding-bottom: 100%;
	background-color: #f3f3f3;
}

.cp-xx4-con{
	padding: 20px 40px 40px;
	text-align: center;
}

/*.cp-xx4-list .cp-xx4-pic{
	width: 80%;
	margin:0 auto;
}*/

.cp-xx4-con h1{
	font-size: 15px;
	font-weight: bold;
	color: #000;
	line-height: 1.4;
	margin:0;
	height: 42px;
	overflow: hidden;
}
.cp-xx4-con h1 a:hover{
	color: #003f7d;

}
.cp-xx4-con p{
	font-size: 15px;
	color: #666;
	line-height: 1.4;
	margin:0;
	height: 63px;
	overflow: hidden;
	margin-top: 18px;
}
.more3{
	margin-top: 25px;
}
.more3 a{
	display: block;
	width: 122px;
	height: 36px;
	line-height: 34px;
	border-radius: 6px;
	border:1px solid #ddd;
	font-size: 15px;
	color: #222;
	font-weight: bold;
	margin:0 auto;
	background: #f5f5f5;
}

.more3 a:hover{
	background-color: #ddd;
	border-color:#ddd;
	color: #222;
}

.cp-xx3-title{
	font-size: 22px;
	color: #000;
	font-weight: bold;
	text-align: center;
	padding-bottom: 30px;
}


.cp-xx3-ul ul{
	margin:0;
	margin-left: -3%;
}

.cp-xx3-ul li{
	float: left;
	width: 30.33333%;
	margin-left: 3%;
	background: #306496;
}
.cp-xx3-ul li>a{
	display: block;
	padding: 55px 0;
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: cover;
	background-size: cover;
	background-image: url(../images/cp-xx3-ico0.jpg);
	text-align: center;
	color: #fff;
	font-size: 15px;font-weight: bold;

}

.cp-xx3-ul li>a img{
	display: block;
	margin:0 auto 8px;
}

.cp-xx3-ul li>a:hover{
	background-image: none;
	background-color: #003f7d;

}


.cp-xx3 dd .main4-list{
	padding-top: 0;
}

.cp-xx3 dd .main4-list li h2{
	margin-top: 7px;
}
.cp-xx3-3-div {
	font-size: 15px;
	color: #000;
	text-align: center;
	padding-top: 30px;
}
.cp-xx3-3-div img{
	display: block;
	margin:0 auto 12px;
}

.contact_a{
	position: fixed;
	right: 25px;
	bottom: 25px;
	width: 170px;
	height: 60px;
	line-height: 60px;
	border-radius: 60px;
	background-color: #003f7d;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	z-index: 1005;
}

.contact_a img{
	margin-top: -3px;
	margin-right: 10px;
}
.contact_a>a{
	display: block;
	height: 100%;
}
.ellipsis {
  overflow: hidden; /* 确保溢出的内容会被隐藏 */
  white-space: nowrap; /* 确保文本在一行内显示，不换行 */
  text-overflow: ellipsis; /* 使用省略号表示文本溢出 */
}
.cp-xx3 .list-unstyled1 li{ background:url(../images/jtsx.jpg) left center no-repeat; line-height:32px; overflow:hidden;padding-left:20px; height:32px; overflow:hidden; white-space: nowrap;text-overflow: ellipsis; }
        .g-scrolling-carousel {
            position: relative;
        }
        .g-scrolling-carousel .items {
            overflow-x: scroll;
           white-space:nowrap;
            width: 100%;
            -webkit-overflow-scrolling: touch;
        }
        .g-scrolling-carousel .items::-webkit-scrollbar { 
            display: none; 
        }
        .jc-right,
        .jc-left {
            width: 36px;
            height: 36px;
            color:#757575;
            margin-bottom: auto;
            margin-top:auto;
            box-shadow: 0 0 0 1px rgba(0,0,0,0.04), 0 4px 8px 0 rgba(0,0,0,0.20);
            background: #fff;
            border-radius: 50%;
            cursor: pointer;
            position: absolute;
            top: 0;
            bottom: 0;
            z-index:2;
            opacity: 0.94;

        }
        .jc-right {
            right:-18px;
        }
        .jc-left {
            left:-18px;
        }

        .jc-right:hover,
        .jc-left:hover{
            opacity: 0.98;
        }
        .jc-right svg,
        .jc-left svg{
            position: absolute;
            left: 0;right: 0;bottom: 0;top: 0;
            margin: auto;
            width: 24px;
            height: 24px;
            fill: #757575;
        }
        .jc-right:hover svg,
        .jc-left:hover svg{
           fill: #000;
        }
        @media (pointer: coarse) {
          .jc-right,
          .jc-left {
            display: none !important;
          }
        }
        .noselect {
          -webkit-touch-callout: none; /* iOS Safari */
            -webkit-user-select: none; /* Safari */
             -khtml-user-select: none; /* Konqueror HTML */
               -moz-user-select: none; /* Firefox */
                -ms-user-select: none; /* Internet Explorer/Edge */
                    user-select: none;
        }

        .g-scrolling-carousel .items{
            padding: 5px 0;
        }
        .g-scrolling-carousel .items a{
            display: inline-block; /* notice the comments between inline-block items */
            box-shadow: 0 0 5px #000;
            text-align: center;
            width:32%;
            margin-right:1%;
      
        }

.g-scrolling-carousel .items div.dlwn{ width:100%;  background-size: cover;background-image: url(../images/cp-xx3-ico0.jpg); padding:35px 10px 35px 10px;}
.g-scrolling-carousel .items div.dlwn img{ text-align:center; }
.g-scrolling-carousel .items div.dlwn h4{ color:#fff; font-size:14px; padding-top:10px; width:90%; margin:0 auto; line-height:26px; height:88px;  white-space:break-spaces; overflow:hidden; }



.flex img,
.flex div {
  margin: .2em;
  cursor: pointer;
  border-radius: 2px;
  max-width: calc(50% - 12px);
  box-shadow: 0px .1em .7em rgba(0, 0, 0, 0.2);
}

.flex div {
  display: inline-block;
  margin: 5px;
  /*max-width: calc(50% - 12px);*/
}

#local_image_container img {
  max-height: 200px;
}

.background-image {
  height: 200px;
  width: 300px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.credit {
  padding: 25px 4%;
  margin: 0;

  color: #6D6D6D;
  font-size: .95em;
}
.credit p {
  margin: 0;
}

.vid {
 
}

.vid:before, .vid:after{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  transition: opacity .2s;
}

.vid:after {
  background-repeat: no-repeat;

  opacity: .5;
  background-size: 2em;
}

.vid:before {
 
  opacity: .9;
}

.vid:hover:after {
  opacity: .8;
}

.vid:hover:before {
  opacity: .85;
}


.text-trigger {
  color: #D4EF6A;
  text-decoration: none;
  cursor: pointer;
}
.text-trigger:hover {
  text-decoration: underline;
}

#bp_loader {
  box-shadow: none;
}

@media all and (max-width: 1076px) {
  #broken_vid {
    height: auto;
    padding-bottom: 20.2%;
  }
}

@media all and (max-width: 450px) {
  body {
    font-size: 15px;
  }
  .header p {
    margin: 1rem 0!important;
  }
  .container {
    padding: 3rem 4% 4rem;
  }
  .logo img {
    width: 100%;
  }
  .logo:before {
    display: none;
  }
  .flex div, .flex img {
    max-width: 98%;
  }
  #broken_vid {
    padding-bottom: 42%;
  }
}

@media (min-width: 1700px) {
  body {
    font-size: 17px;
  }
  .header {
    padding: 5em 4%;
  }
}

@media (min-width: 1550px) {
  .main {
    margin: 0 auto;
    box-shadow: 0 1em 1em #999;
  }
}


@media (max-width:1600px ) {
.caseright .catelist{ max-height:600px; overflow-y:none}
.prodxl .catelist .hidinfo .pmig h5{ font-size:22px}

}

@media (max-width:1440px ) {
.caseright .catelist{ max-height:500px; overflow-y:none}
.prodxl .catelist .hidinfo .pmig h5{ font-size:20px; line-height:30px}
.prodxl .catelist .hidinfo .pmig .text{ padding:5px; line-height:22px;}
 .g-scrolling-carousel .items a{
            display: inline-block; /* notice the comments between inline-block items */
            box-shadow: 0 0 5px #000;
            text-align: center;
            width:48%;
            margin-right:2%;
      
        }

}

@media (max-width:1000px ) {
.caseright .catelist{ max-height:auto; overflow-y:none}
.fl1 .desc .js{width: 100%;display:block}
.fl1 .desc .ys{width: 100%;display:block;margin-top:20px}
.prodxl .catelist ul li{width: 90%; margin: 0 auto; float: none; margin-bottom: 20px}
.catelist{width: 100%}
.flor4 .videoleft{ width:100% }
.flor4 .caseright{width: 100%}
.cp-xx3 dd{width: 100%; float: none;  border-bottom: #fff solid 15px;}
.g-scrolling-carousel .items div{width:100px;}
.fl1 .title h1{ font-size:36px; }
.title{ padding-left:15px; }
.sfdfd{display:none;width:0%}
}

/* ===== 产品列表页面新布局 ===== */
.products_container {
    display: flex;
    gap: 30px;
    max-width: 1400px;
    margin: 0 auto;
    padding: 30px 20px 60px;
}

/* 左侧筛选栏 */
.products_sidebar {
    width: 280px;
    flex-shrink: 0;
}

.sidebar_inner {
    position: sticky;
    top: 100px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06);
    padding: 20px;
}

/* 面包屑 */
.sidebar_breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #666;
    padding-bottom: 16px;
    border-bottom: 1px solid #eee;
    margin-bottom: 16px;
}

.sidebar_breadcrumb a {
    color: #666;
    text-decoration: none;
    transition: color 0.2s;
}

.sidebar_breadcrumb a:hover {
    color: #003f7d;
}

.breadcrumb_home {
    display: flex;
    align-items: center;
}

.breadcrumb_sep {
    color: #ccc;
}

.breadcrumb_current {
    color: #003f7d;
    font-weight: 500;
}

/* 当前筛选 */
.current_filter {
    background: linear-gradient(135deg, #e8f1fa 0%, #f0f6ff 100%);
    border-radius: 12px;
    padding: 14px;
    margin-bottom: 20px;
}

.current_filter_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.current_filter_label {
    font-size: 12px;
    color: #666;
}

.clear_all_filters {
    font-size: 12px;
    color: #003f7d;
    text-decoration: none;
}

.clear_all_filters:hover {
    text-decoration: underline;
}

.current_filter_tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.current_filter_tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    background: #fff;
    border-radius: 20px;
    padding: 6px 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    font-size: 13px;
    overflow: hidden;
}

.filter_tag_type {
    color: #666;
    white-space: nowrap;
    flex-shrink: 0;
}

.filter_tag_name {
    color: #333;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px;
}

.filter_tag_remove {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5;
    border-radius: 50%;
    color: #999;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s;
}

.filter_tag_remove:hover {
    background: #e74c3c;
    color: #fff;
}

/* 侧边栏区块 */
.sidebar_section {
    margin-bottom: 20px;
}

.sidebar_title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin: 0 0 12px 0;
    padding: 0;
}

.sidebar_title svg {
    color: #003f7d;
}

/* 分类列表 */
.sidebar_category_list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sidebar_category_item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    text-decoration: none;
    color: #555;
    transition: all 0.2s;
}

.sidebar_category_item:hover {
    background: #f5f8fa;
    color: #003f7d;
}

.sidebar_category_item.active {
    background: #e8f1fa;
    color: #003f7d;
}

.sidebar_category_item.hidden {
    display: none;
}

.category_icon {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.category_name {
    flex: 1;
    font-size: 14px;
}

.category_product_count {
    font-size: 12px;
    color: #999;
    background: #f0f0f0;
    padding: 2px 8px;
    border-radius: 10px;
}

.category_arrow {
    opacity: 0;
    transition: opacity 0.2s;
}

.sidebar_category_item:hover .category_arrow {
    opacity: 1;
}

/* 筛选区块 */
.filter_section .sidebar_title {
    cursor: pointer;
    padding: 10px 0;
    border-top: 1px solid #eee;
    margin-top: 0;
}

.filter_section .toggle_arrow {
    margin-left: auto;
    transition: transform 0.3s;
}

.filter_section.expanded .toggle_arrow {
    transform: rotate(180deg);
}

.filter_type_count {
    display: none;
    font-size: 11px;
    background: #003f7d;
    color: #fff;
    padding: 2px 6px;
    border-radius: 10px;
    margin-left: auto;
    margin-right: 8px;
}

.filter_type_count.show {
    display: inline-block;
}

.filter_list {
    display: none;
    flex-direction: column;
    gap: 2px;
    padding-left: 28px;
}

.filter_section.expanded .filter_list {
    display: flex;
}

.filter_item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    text-decoration: none;
    color: #666;
    font-size: 13px;
    transition: all 0.2s;
}

.filter_item:hover {
    background: #f5f8fa;
    color: #333;
}

.filter_item.active {
    background: #e8f1fa;
    color: #003f7d;
    font-weight: 500;
}

.filter_checkbox {
    width: 16px;
    height: 16px;
    border: 2px solid #ddd;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.filter_checkbox .check_icon {
    opacity: 0;
    transition: opacity 0.2s;
}

.filter_item.active .filter_checkbox {
    background: #003f7d;
    border-color: #003f7d;
}

.filter_item.active .filter_checkbox .check_icon {
    opacity: 1;
    color: #fff;
}

/* 联系咨询 */
.sidebar_contact {
    background: linear-gradient(to right, #e60112, #f34a2f);
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    color: #fff;
    margin-top: 20px;
}

.contact_icon {
    font-size: 32px;
    margin-bottom: 10px;
}

.contact_title {
    font-size: 15px;
    font-weight: 600;
    margin: 0 0 6px 0;
}

.contact_desc {
    font-size: 12px;
    opacity: 0.9;
    margin: 0 0 14px 0;
    line-height: 1.5;
}

.contact_btn {
    display: inline-block;
    background: #fff;
    color: #e60112;
    padding: 8px 24px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s;
}

.contact_btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    color: #e60112;
}

/* 右侧产品列表 */
.products_main {
    flex: 1;
    min-width: 0;
}

/* 工具栏 */
.products_toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
    margin-bottom: 24px;
}

.result_count {
    font-size: 15px;
    color: #666;
}

.result_count strong {
    color: #003f7d;
}

.filter_summary {
    color: #666;
    font-size: 14px;
}

.filtered_count {
    color: #003f7d;
    font-weight: 600;
}

.clear_filter_btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #fff5f5;
    border: 1px solid #ffcdd2;
    border-radius: 20px;
    color: #e53935;
    font-size: 13px;
    text-decoration: none;
    transition: all 0.2s;
}

.clear_filter_btn:hover {
    background: #e53935;
    border-color: #e53935;
    color: #fff;
}

/* 产品分类区块 */
.product_category_section {
    margin-bottom: 40px;
}

.product_category_section.hidden {
    display: none;
}

.category_header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%);
    border-radius: 12px;
    margin-bottom: 20px;
    border: 1px solid #eee;
}

.category_icon_wrap {
    width: 48px;
    height: 48px;
    background: #fff;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.category_icon_wrap img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.category_title {
    flex: 1;
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.category_count {
    font-size: 13px;
    color: #999;
    background: #f0f0f0;
    padding: 4px 12px;
    border-radius: 12px;
}

/* 产品网格 */
.product_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

/* 产品卡片 */
.product_card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: all 0.3s;
}

.product_card.hidden {
    display: none;
}

.product_card.show {
    display: block;
}

.product_card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

.product_card a {
    text-decoration: none;
    display: block;
}

.product_image {
    height: 180px;
    background: linear-gradient(135deg, #f8f9fa 0%, #eef2f7 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.product_image img {
    max-width: 80%;
    max-height: 80%;
    object-fit: contain;
    transition: transform 0.4s;
}

.product_card:hover .product_image img {
    transform: scale(1.08);
}

.product_info {
    padding: 16px;
}

.product_name {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0 0 6px 0;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product_desc {
    font-size: 13px;
    color: #888;
    margin: 0 0 10px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.5;
}

.product_tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.product_tag {
    font-size: 11px;
    padding: 3px 8px;
    background: #e8f1fa;
    color: #003f7d;
    border-radius: 4px;
    transition: all 0.2s;
}

.product_tag.highlight {
    background: #003f7d;
    color: #fff;
}

.product_action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px;
    background: #f8f9fa;
    color: #333;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s;
}

.product_card:hover .product_action {
    background: linear-gradient(to right, #e60112, #f34a2f);
    color: #fff;
}

/* 分类内无产品提示 */
.no_products_in_category {
    text-align: center;
    padding: 40px 20px;
    color: #999;
    background: #f9f9f9;
    border-radius: 12px;
}

/* 无结果 */
.no_results {
    text-align: center;
    padding: 80px 20px;
    background: #fff;
    border-radius: 16px;
}

.no_results_icon {
    font-size: 56px;
    margin-bottom: 20px;
}

.no_results_title {
    font-size: 22px;
    color: #333;
    margin: 0 0 10px 0;
}

.no_results_desc {
    font-size: 14px;
    color: #999;
    margin: 0 0 24px 0;
}

.no_results_btn {
    display: inline-block;
    margin-top: 16px;
    padding: 12px 32px;
    background: linear-gradient(to right, #e60112, #f34a2f);
    color: #fff;
    border-radius: 25px;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s;
}

.no_results_btn:hover {
    background: linear-gradient(to right, #c70010, #e60112);
    transform: translateY(-2px);
    color: #fff;
}

/* ===== 响应式布局 ===== */
@media (max-width: 1200px) {
    .product_grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 992px) {
    .products_container {
        flex-direction: column;
    }

    .products_sidebar {
        width: 100%;
    }

    .sidebar_inner {
        position: static;
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
    }

    .sidebar_breadcrumb {
        width: 100%;
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .current_filter {
        width: 100%;
        margin-bottom: 0;
    }

    .sidebar_section {
        flex: 1;
        min-width: 200px;
        margin-bottom: 0;
    }

    .sidebar_contact {
        width: 100%;
        margin-top: 0;
    }

    .filter_section .filter_list {
        display: flex;
    }

    .filter_section .toggle_arrow {
        display: none;
    }

    .product_grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .products_container {
        padding: 20px 15px 40px;
    }

    .product_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .product_image {
        height: 140px;
    }

    .product_info {
        padding: 12px;
    }

    .product_name {
        font-size: 14px;
    }

    .product_desc {
        display: none;
    }

    .category_header {
        padding: 12px 16px;
    }

    .category_title {
        font-size: 16px;
    }

    .products_toolbar {
        flex-direction: column;
        gap: 10px;
        padding: 12px 16px;
    }

    .toolbar_left, .toolbar_right {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .product_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .product_image {
        height: 120px;
    }

    .product_info {
        padding: 10px;
    }

    .product_name {
        font-size: 13px;
        -webkit-line-clamp: 1;
    }

    .product_tags {
        display: none;
    }

    .product_action {
        padding: 10px;
        font-size: 12px;
    }

    .sidebar_section {
        min-width: 100%;
    }
}