@charset "utf-8";
html {
    font-family: -apple-system, 'Microsoft Yahei', sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
   /* font-size: 100px;*/
}
body {width: 100%; background:#ffffff; margin: 0; font-size: 1.4rem; color: #555555;}
*{  margin: 0; padding:0;}

img,object {border: none;max-width: 100%;border: 0;overflow: hidden;vertical-align: middle;}
ul,li{list-style:none;}
input {outline: none;border:0px;}
i{font-style: normal;}
a{text-decoration:none;color: #555555;-webkit-tap-highlight-color:rgba(0,0,0,0); background: none;}
a:visited{color: #000000; }
a:hover{text-decoration:none;color: #F18F01;}
a,p,span {text-decoration: none;text-shadow: none;font-weight: normal;}
h1,h2{ font-weight: normal; font-size: 20px}
.fl{float:left;}
.fr{float:right;display:inline;}
.width-1200{ width: 1180px; margin: 0px auto; padding: 0px 10px;}
.width-1018{ width: 1018px; margin: 0px auto}
.box-huidi{ background: #ededed; /*background: #F7F9FA; */overflow: hidden;}
.white-bg{background: #ffffff;}
.top-m-10{ margin-top: 10px;}
.top-m-15{ margin-top: 15px;}



a, a:focus, a:active, a:hover {
    outline: none;
    border: none ;
    text-decoration: none;
}



/*公共头部*/

.header{ overflow: hidden; height: 60px;
    background: #000000;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, .3);
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9999;
    -o-transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    transition: .3s;
}

.header .nav-box{
    width: 1200px; margin: 0 auto;
}

.header .nav-box .logo{ width: 150px;height: 60px; margin-top: 10px; float: left;}
.header .nav-box .logo img{max-width: 150px;}
.header  h1{  margin-top: 5px!important;}
.header  img{max-width: 120px;}

.header .nav{ float: right;}
.header .nav ul li{ float: left;
    line-height: 60px;
    width: 100px;
    margin-right: 10px;
}
.header .nav ul li a{ display: inline-block;
    width: 100%;
    text-align: center;
    font-size: 14px;
    border-bottom: 2px solid #000000;
    height: 60px;
}

.header .nav ul li a:hover{ border-bottom: 2px solid #ffffff; color:#ffffff; }
.header .nav ul li.onnav a{ border-bottom: 2px solid #ffffff; color:#ffffff; }
.header .nav ul li a:visited{color: #ffffff; }

.header .nav-box .other{ float: right; margin-left: 60px;}
.header .nav-box .other p{background: url(../img/tel_bg.png) left center no-repeat;
    line-height: 60px;
    float: right;
    padding-left: 30px;
    color: #F18F01;
    font-size: 16px;}

.sp_nav{ display: none;}
.sjj_nav{ display: none;}


/*底部*/
.footer{ background: #000000; color: #ffffff; font-size: 13px;    font-family: 'Inter', Roboto, sans-serif; border-top: 3px solid #000000; overflow: hidden; margin: 0px 0px  0px 0px; padding: 30px 0px 20px 0px;}
.footer .footer-nav{ text-align: center; margin-bottom: 10px;}
.footer a{ color: #ffffff}
.footer a:visited{ color: #ffffff}
/*.footer .footer-nav ul li{ float: left;}*/
.footer .text{ line-height: 30px; color: #ffffff; text-align: center;}

.footer .whatapp {
    width: 88px;
    display: block;
    bottom: 100px;
    right: 10px;
    position: fixed;
}

/*首页*/
.box{ margin-top: 60px;}

.index-box{ padding: 0px 30px;}
.index-hero { width: 1200px; margin: 0 auto!important; display: block;  padding: 150px 100px 100px 100px; text-align: center;}
.index-hero h1{font-size: 36px; color: #000; margin-bottom: 15px; font-weight: bold;}
.index-hero p {
    font-size: 16px;
    color: #333;
    margin-bottom: 30px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.quote-btn {
    background-color: #F18F01;
    color: #ffffff;
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
}

.quote-btn:hover { color: #ffffff }
.quote-btn:visited { color: #ffffff }


.filter-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; padding: 15px; background-color: #f9f9f9; border-radius: 8px; }
.filter-options { display: flex; gap: 20px; }
.filter-options select { padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; }
.search-box { padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; width: 250px; }
/*.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.product-card { border: 1px solid #eee; border-radius: 8px; padding: 0px; text-align: center; }
.product-card img { width: 100%; !*height: 180px;*! object-fit: contain; margin-bottom: 15px; }
.product-card h3 { color: #000; margin-bottom: 10px; font-size: 18px; }
.product-card .wholesale-price { color: #F18F01; font-weight: bold; margin-bottom: 10px; }
.product-card .moq { color: #666; font-size: 14px; margin-bottom: 15px; }
.product-card .btn { background-color: #F18F01; color: #000; padding: 8px 16px; border: none; border-radius: 4px; text-decoration: none; font-weight: bold; }*/
.pagination { display: flex; justify-content: center; gap: 10px; margin-top: 40px; }
.pagination a { color: #000; text-decoration: none; padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px; }
.pagination a.active { background-color: #F18F01; color: #000; border: 1px solid #F18F01; }



.other-hero { width: 1200px; margin: 0 auto!important; display: block;  padding: 50px; text-align: center;}
.other-hero h1{font-size: 26px; color: #000; margin-bottom: 15px; font-weight: bold;}
.other-hero p {
    font-size: 16px;
    color: #333;
    margin-bottom: 30px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}



.list-search{ overflow: hidden}
.list-search div{float: left;}
.list-search div.submit{ margin-left: 5px;}


.category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 50px 0; }
.category-card { text-align: center; padding: 20px; border: 1px solid #eee; border-radius: 8px; }
.category-card h3 { color: #000; margin: 15px 0; }
.category-card p { color: #666; font-size: 14px; }
.advantage-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin: 50px 0; }
.advantage-card { text-align: center; }
.advantage-card i { font-size: 30px; color: #F18F01; margin-bottom: 15px; }
.advantage-card h3 { color: #000; margin-bottom: 10px; }
.advantage-card p { color: #666; font-size: 14px; }
.hot-products { margin: 40px 0; }
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.product-card { border: 1px solid #eee; border-radius: 5px; padding: 0px; text-align: center; }
.product-card img { width: 100%; /*height: 180px;*/ object-fit: contain; margin-bottom: 5px; }
.product-card h3 { color: #000; margin-bottom: 10px;  border-top: 1px solid #eeeeee; margin-top: 0px; padding-top: 10px;}
.product-card .wholesale-price { color: #F18F01; font-weight: bold; margin-bottom: 10px; }
.product-card .moq { color: #666; font-size: 14px; margin-bottom: 15px; }
.product-card .btn { background-color: #F18F01; color: #000; padding: 8px 16px; border: none; border-radius: 4px; text-decoration: none; font-weight: bold; }
.oem-section { text-align: center; padding: 40px 0 60px 0; background-color: #f9f9f9; border-radius: 8px; margin: 40px 0 0 0; }
.oem-section h2 { color: #000; margin-bottom: 15px; }
.oem-section p { color: #666; margin-bottom: 20px; }




.main-content { margin-top: 0px; margin-bottom: 10px; background-color: #fff; padding: 30px; min-height: calc(100vh - 160px); }
.about-title { color: #000; font-size: 28px; text-align: center; margin-bottom: 40px; }
.about-content { max-width: 1000px; margin: 0 auto; line-height: 1.8; color: #333; }
.about-content h2 { color: #000; margin: 25px 0 15px; }
.factory-images { display: flex; gap: 20px; margin: 30px 0; }
.factory-images img { width: 50%; height: 300px; object-fit: cover; border-radius: 8px; }
.core-values { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin: 30px 0; }
.value-card { text-align: center; padding: 20px; border: 1px solid #eee; border-radius: 8px; }
.value-card i { font-size: 30px; color: #F18F01; margin-bottom: 15px; }
.value-card h3 { color: #000; margin-bottom: 10px; }
.value-card p { color: #666; font-size: 14px; }
.certifications { text-align: center; margin: 30px 0; }
.certifications img { height: 180px; margin: 0 15px; }
.contact-section { background-color: #f9f9f9; padding: 30px; border-radius: 8px; margin: 40px 0 0 0; text-align: center; }
.contact-section .contact-info{ width: 1200px; margin: 0 auto;}
.contact-section h2 { color: #000; margin-bottom: 15px; }
.contact-info { display: flex; justify-content: center; gap: 40px; margin-top: 20px; }

.contact-info .contact-item { width: 25%;}
.contact-item { text-align: center; /*display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 50px 0;*/}
.contact-item i { font-size: 24px; color: #F18F01; margin-bottom: 10px; }
.contact-item h3 { color: #000; margin-bottom: 5px; }
.contact-item p { color: #666; }



.more{text-align: center;  margin: 20px 50px;}
.more a{ padding: 30px; font-weight: bold;}

.box-top{ overflow: hidden; height: 405px;}
.box-top .industry{ float: left; width: 160px;}

.pc-img{ display: inline-block!important;}
.mobile-img{ display: none!important;}

.tit-i { text-align: center; padding: 50px 0 30px 0; line-height: 36px; overflow: hidden;}
.tit-i h3 { font-size: 30px; color: #002; margin-bottom: 10px;}
.tit-i h5 { font-size: 20px; color: #cacace; text-transform: uppercase; font-family: Arial;}
.tit-i h5 span { color: #F18F01;}


.ul-icon-i{ overflow: hidden; font-size: 14px; line-height: 24px; color: #666;}
.ul-icon-i li {
    float: left;
    width: 33%;
    text-align: center;
    padding-bottom: 70px;
    overflow: hidden;
    display: block;
}
.ul-icon-i li .pad {
    padding: 0 90px;
    position: relative;
}

.ul-icon-i li span {

    width: 134px;
    height: 134px;
    display: inline-block;
    margin-bottom: 0px;
}
.ul-icon-i li h3 {
    font-size: 16px;
    margin-bottom: 8px;
}
.ul-icon-i li em {
    width: 100px;
    border-bottom: 2px solid #707070;
    display: inline-block;
    margin-bottom: 10px;
}
.ul-icon-i li p {
    text-align: left;
}


/*-----------*/
.case-img, .case-img a img {
    width: 100%;
}
.case-img {
    position: relative;
    overflow: hidden;
}
.case-img .hover {
    position: absolute;
    left: 0;
    top: -434px;/*top: -433px;*/
    -o-transition:.3s;
    -ms-transition:.3s;
    -moz-transition:.3s;
    -webkit-transition:.3s;
    transition:.3s;
    width: 100%;
    height: 100%;
    text-align: center;
    background: url("../img/bg_blue.png") repeat;
    color: #fff;
}
.case-img.on .hover {
    top: 0;
}
.ul-case-i {
    overflow: hidden;;
}
.ul-case-i li {
    float: left;
    width: 25%;
    padding: 0 15px;
    margin-bottom: 30px;
    overflow: hidden;
}
.ul-case-i li a {
    display: block;
    position: relative;
    -o-transition:.3s;
    -ms-transition:.3s;
    -moz-transition:.3s;
    -webkit-transition:.3s;
    transition:.3s;
}
.ul-case-i li .pic img {
    width: 100%;
    display: block;
}
.ul-case-i li a .hover {
    position: absolute;
    left: 0;
    top: -100%;
    width: 100%;
    height: 100%;
    text-align: center;
    background: url("../img/bg_blue.png") repeat;
    color: #fff;
    /*display: none;*/
    -o-transition:.3s;
    -ms-transition:.3s;
    -moz-transition:.3s;
    -webkit-transition:.3s;
    transition:.3s;
}
.ul-case-i li .hover b, .ul-case-i li .hover .txt, .case-img .hover b, .case-img .hover .txt {
    display: inline-block;
    vertical-align: middle;
}
.ul-case-i li .hover b, .case-img .hover b {
    width: 0;
    height: 100%;
}
.ul-case-i li a:hover .hover {
    /*display: block;*/
    top: 0;
}
.ul-case-i-1 li {
    width: 25%;
}
.more-i{ text-align: center; margin-bottom: 15px;}
.more-i a {
    display: inline-block;
    width: 65px;
    height: 65px; margin: 0 auto;
    background: url(../img/arr2.png) center center no-repeat #000014;
    border-radius: 100%;
}
.more-i a:hover{
    background: url(../img/arr2.png) center center no-repeat #F18F01;
}
/*-------*/


/*-----------*/
.ul-news-i {
    overflow: hidden;;
}
.ul-news-i li {
    float: left;
    width: 25%;
    padding: 0 15px;
    margin-bottom: 30px;
    overflow: hidden;
}
.ul-news-i li a {
    display: block;
    position: relative;

}

.ul-news-i li a:hover {
    color:  #F18F01;
}

.ul-news-i li .txt-t{ line-height: 36px; font-weight: bold; overflow:hidden;  text-overflow:ellipsis; white-space:nowrap;}
.ul-news-i li .txt-c{ line-height: 26px; overflow: hidden; max-height: 75px;}

.news-more {
    text-align: center;
    padding-bottom: 50px;
    padding-top: 20px;
}
.news-more a {
    display: inline-block;
    width: 178px;
    height: 48px;
    border: 1px solid #333333;
    border-radius: 5px;
    line-height: 48px;
    text-align: center;
    font-size: 18px;
    color: #333333;
    text-transform: uppercase;
}
.news-more a:hover {
    background-color: #F18F01;
    color: #ffffff;
    border: 1px solid #ffffff;
    -o-transition:.3s;
    -ms-transition:.3s;
    -moz-transition:.3s;
    -webkit-transition:.3s;
    transition:.3s;
}
/*-------*/

.ban-in{ height: 200px; position: relative;}
.ban-in .ban-bg{background: url(../img/ban_bg.png) center top no-repeat;
    height: 54px;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: -30px;
    z-index: 60;
}

.page-c{ width: 980px; margin: 0 auto; text-align: left;
    font-size: 14px;
    line-height: 34px;
    color: #666;
    padding-bottom: 50px;
}
/*---*/
.ul-about-i{ overflow: hidden; font-size: 14px; line-height: 24px; color: #666;}
.ul-about-i li {
    float: left;
    width: 33%;
    text-align: center;
    padding-bottom: 70px;
    overflow: hidden;
    display: block;
}
.ul-about-i li .pad {
    padding: 0 70px;
    position: relative;
}

.ul-about-i li span {

    width: 134px;
    height: 134px;
    dul-about-iisplay: inline-block;
    margin-bottom: 0px;
}
.ul-about-i li h3 {
    font-size: 16px;
    margin-bottom: 8px;
}
.ul-about-i li em {
    width: 100px;
    border-bottom: 2px solid #707070;
    display: inline-block;
    margin-bottom: 10px;
}
.ul-about-i li p {
    text-align: left;
}

.contact_f{ overflow: hidden; margin-top: 0px; margin-bottom: 30px;}
.contact_f .fl{ width: 50%;}
.contact_f .fr{ width: 50%;}
.ul-contact li {
    padding-right: 40px; text-align: right; margin-right: 30px;
    font-size: 14px;
    margin-bottom: 20px;
    line-height: 30px;
}
.ul-contact li.li1{background: url(../img/contact_01.png) no-repeat right;}
.ul-contact li.li2{background: url(../img/contact_02.png) no-repeat right;}
.ul-contact li.li3{background: url(../img/contact_03.png) no-repeat right;}

.fr-form{ width: 300px; margin-left: 20px;}
.fr-form{ overflow: hidden; margin-bottom: 10px;}
.fr-form p {
    height: 30px;
    width: 80px;
    text-align: right;
    font-size: 14px;
    color: #333;
    float: left;
    margin-right: 10px; line-height: 30px;
}
.fr-form p span{ color: #ff0000;}
.sr-txt1 {
    height: 28px;
    border: 1px solid #DCDCDC;
    outline: none;
    width: 50%;
    float: left; text-indent: 5px;
}
.sr-txt2 {
    height: 28px;
    border: 1px solid #DCDCDC;
    outline: none;
    width: 100%;
    float: left; text-indent: 5px;
    margin-bottom: 10px;
}



.fr-form textarea {
    float: left;
    width: 100%;
    padding: 5px;
    height: 60px;
    resize: none;
    outline: none;
    border: 1px solid #DCDCDC; margin-bottom: 10px;
}

.fr-form label {
    margin-left: 10px;
}


.contact-form .inp {
    width: 100%;
    border: 1px solid #6d6d88;
    height: 33px;
    padding: 0 10px;
    margin-bottom: 10px;
}
.contact-form .sub {
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    background-color: #63637f;
    border: 0;
    cursor: pointer;
    font-family:"微软雅黑", "Microsoft Yahei";
    font-size: 16px;
}
.liuyanchenggong{ text-align: center; font-size: 18px; color: #333333; line-height: 100px; /*width: 500px;*/  padding:0px 30px 20px 30px;}

.ul-case {
   /* margin: 0 -15px;*/ overflow: hidden; margin: 0px;
}
.ul-case li {
    float: left;
    width: 33.3333%;
    padding: 0 15px;
    margin-bottom: 30px;
    overflow: hidden;
    position: relative;
}
.ul-case li .block {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

/*
.ul-case li .block .card {
    background: white;
    border-radius: 10px;
    padding: 30px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    transition: transform 0.3s;
}

.ul-case li .block:hover  {
    transform: translateY(-5px);
}
*/


.ul-case li .pic img {
    display: block;
    width: 100%;
}
.ul-case li .txt {
    position: absolute;
    left: 0;
    top: 0%;
    width: 100%;
    height: 100%;
    background: url("../img/bg_blue.png") repeat;
    text-align: center;
    color: #fff;
    -o-transition:.3s;
    -ms-transition:.3s;
    -moz-transition:.3s;
    -webkit-transition:.3s;
    transition:.3s;
    opacity:0;
}
.ul-case li .txt h5, .ul-case li .txt h3 {
    color: #fff;
}
.ul-case li .txt:hover {
    opacity:1;
}
.ul-case li .txt b, .ul-case li .txt .pad {
    display: inline-block;
    vertical-align: middle;
}
.ul-case li .txt b {
    width: 0;
    height: 100%;
}
.ul-case li .txt h5 {
    font-size: 16px;
}
.ul-case li .txt em {
    width: 45px;
    height: 0;
    border-bottom: 1px solid #fff;
    display: inline-block;
    margin: 20px 0 40px 0;
}
.ul-case li .txt h3 {
    font-size: 18px;
    margin-bottom: 40px;
}
.ul-case li .txt .more {
    width: 122px;
    height: 45px;
    display: inline-block;
    text-align: center;
    line-height: 45px;
    background-color: #F18F01;
    color: #fff;
    border-radius: 5px;
    font-size: 14px;
}
.ul-case li .txt .more:hover {
    opacity: .8;
    -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity= 80)';
    filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
}
.ul-case li.on .txt {
    top: 0;
}

/*-------------*/
.detalis_box_content{ overflow: hidden;display: block; position: relative; }
.detalis_box_content .fl{width: 748px;}
.detalis_box_content .fl .content { overflow: hidden;}
.detalis-content .d-information{ background: url("../img/time.gif") no-repeat; background-position: 15px 14px; text-indent: 35px;}
.detalis-content .detalis_content_c{ padding: 10px; line-height: 35px!important; color: #333333!important; }
.detalis-content .detalis_content_c img{ max-width: 100%;}
.detalis_box_content div.title{/* padding: 10px;*/  border-bottom: 1px solid #EEE; padding: 10px 0px 10px 0px; text-indent: 10px; width: 100%; /*width: calc(100% - 20px);*/ }
.detalis_box_content div.title span{ color: #666666; font-size: 14px;}
.detalis_box_content .fr{width: 260px;}



/*.box-detalis_box_content .fr div{ padding: 10px; margin-top: 10px;}
.detalis_box_content .fr div:first-child{ margin-top: 0px;}*/

/*图片详情页*/
.detalis-content{ }
.detalis-content .d-title{ font-size: 18px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    font-weight: bold;
    height: 33px;;
    padding-top: 10px;
    padding-left: 15px;

}
.detalis-content .d-information {color: #999; display: block; line-height: 38px;
    height: 38px;
    padding-left: 0px; font-size: 12px;
    border-bottom: 1px solid #EEE;
}

.detalis_paging{
    padding: 10px 10px 20px 10px; overflow: hidden;
}
.detalis_paging .d_fl{ float: left;}
.detalis_paging .d_fr{float: right;}
.detalis_paging  .disabled  span,
.detalis_paging  .disabled  span:hover,
.detalis_paging  .disabled  span:focus,
.detalis_paging  .disabled  a,
.detalis_paging  .disabled  a:hover,
.detalis_paging  .disabled  a:focus {
    color: #999;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}

/*分页样式*/
.paging{ text-align:left; width: 100%; display: block;}
.pagination {
    display: inline-block;
    padding-left: 0;
    /*margin: 20px auto;*/
    border-radius: 2px;
}
.pagination > li {
    display: inline;
}
.pagination > li > a,
.pagination > li > span {
    position: relative;
    float: left;
    padding: 8px 16px;
    /* padding: 10px 18px;*/
    margin-left: -1px;
    line-height: 1.42857143;
    color: #666666;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;font-size: 14px!important;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    color: #F18F01;
    background-color: #eee;
    border-color: #ddd;
    font-size: 14px!important;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #F18F01;
    border-color: #F18F01;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
    color: #999;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}
.clear{
    clear: both;
}
/*分页样式结束*/


.hot-recomm{ overflow: hidden; margin: 10px; padding-bottom: 4px; /*background: url(../img/list_bg.gif) no-repeat left 2px;*/ }
.hot-recomm ul li{ width:250px; margin-bottom: 5px; background: url(../img/list_bg.gif) no-repeat left 2px;}
.hot-recomm ul li.i0{ background-position:0px 3px;  }
.hot-recomm ul li.i1{ background-position:0px -20px;}
.hot-recomm ul li.i2{ background-position:0px -45px;}
.hot-recomm ul li.i3{ background-position:0px -70px;}
.hot-recomm ul li.i4{ background-position:0px -93px;}
.hot-recomm ul li.i5{ background-position:0px -118px;}
.hot-recomm ul li.i6{ background-position:0px -141px;}
.hot-recomm ul li.i7{ background-position:0px -166px;}
.hot-recomm ul li.i8{ background-position:0px -190px;}
.hot-recomm ul li.i9{ background-position:0px -214px;}

.hot-recomm ul li span{line-height: 20px; padding: 0px 10px 4px 20px; display: block;;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.right-content-fixed{ position: fixed; _position:absolute; left:50%; top: 90px; right: 0px;
    margin: 0 0 0 249px;
}

.hot-shop{  padding: 5px 10px 10px 10px;}
.hot-shop ul li{ overflow: hidden; border-bottom: 1px dashed #dedede; padding: 5px 0px 5px 0px; }
.hot-shop ul li.listHeight a{   background: url(../img/list_bg.gif) no-repeat left 7px; padding: 1px 0px 2px 20px;}

.hot-shop ul li:first-child{ border-top:0px;}
.hot-shop .productImg{ float: left; margin: 0px;}
.hot-shop .productInfo{ float: right; width: 145px;}
.hot-shop .productInfo p{ font-size: 12px; color: #666666; margin: 0px;}
.hot-shop h3{ font-size: 14px; margin-top: 0px; margin-bottom: 5px;color: #F18F01;}
.hot-shop h3 a{ color: #F18F01;}


.hot-shop ul li.num1 a{ background-position:0px 3px;}
.hot-shop ul li.num2 a{ background-position:0px -20px;}
.hot-shop ul li.num3 a{ background-position:0px -45px;}
.hot-shop ul li.num4 a{ background-position:0px -70px;}
.hot-shop ul li.num5 a{ background-position:0px -93px;}
.hot-shop ul li.num6 a{ background-position:0px -118px;}
.hot-shop ul li.num7 a{ background-position:0px -141px;}
.hot-shop ul li.num8 a{ background-position:0px -166px;}
.hot-shop ul li.num9 a{ background-position:0px -190px;}
.hot-shop ul li.num10 a{ background-position:0px -214px;}




/** 1366分辨率笔记本 **/


@media only screen and (max-width: 1366px) {
    /*.width-1200{ width: 100%; margin: 0px auto}
    .width-1018{ width: 100%; margin: 0px auto}*/
    .box .ul-case{ padding: 0px 20px;}
    .box .ul-news-i{ padding: 0px 10px;}
    .contact-section .contact-info{ width: 100%;}


}

/** 平板 **/
@media only screen and (min-width: 1002px) and (max-width: 1365px) {
    .contact-section .contact-info{ width: 100%;}

    .index-hero { width: 890px;   padding: 50px; }
    .index-hero h1{font-size: 24px; }
    .index-hero p {font-size: 14px;  margin-bottom: 30px; max-width: 800px;   }

    .other-hero { width: 890px;   padding: 50px; }
    .other-hero h1{font-size: 24px; }
    .other-hero p {font-size: 14px;  margin-bottom: 30px; max-width: 800px;   }




    .width-1200{  width: 990px; margin: 0px auto}
    .width-1018{ width: 990px; margin: 0px auto}
    .detalis_box_content .fl {
        width: 720px;
    }

    .header{ overflow: hidden; height: 60px; }
    .header .nav-box{  width: 100%; margin: 0 auto; }
    .header  .logo{ width: 120px;height: 60px; margin-top: 0px; float: left; margin-left: 20px;}
    .header .nav ul li{ line-height: 60px; width: 80px; margin-right: 10px; }
    .header .nav ul li a{height: 60px; }
    .header .nav-box .other{ float: right; margin-left: 40px; margin-right: 20px;}
    .header .nav-box .other p{ line-height: 60px; padding-left: 30px;}
    .box{ margin-top: 60px;}

    .index .ul-case-i{ padding-left: 10px;}
    .index .ul-case-i li { width: 33%; }
    .index .ul-case-i li:nth-child(7),.ul-case-i li:nth-child(8){ display: none;}
    .index .ul-news-i{ padding-left: 10px;}
    .index .ul-news-i li {   width: 33%; margin-bottom: 30px; }
    .index .ul-news-i li:nth-child(4){ display: none;}

    .box .ul-case{ /*padding: 0px 20px; width: calc(100% - 40px);*/}
    .page-c{ padding: 0px 40px; width: calc(100% - 80px);}
    .ul-about-i li .pad{padding: 0px 30px;}

   /* .detalis_box_content .right-content{ display: none;}*/
    /*.detalis_box_content  .fl{ width: calc(100% - 40px); margin: 10px 20px 20px 20px;}*/

    .ul-icon-i li .pad{padding: 0 70px;}
    .pagination{ padding-left: 20px!important;}
}

@media only screen and (min-width: 750px) and (max-width: 1002px) {

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


    .contact-section .contact-info{ width: 100%;}

    .index-hero { width: 700px;   padding: 25px; }
    .index-hero h1{font-size: 24px; }
    .index-hero p {font-size: 14px;  margin-bottom: 30px; max-width: 700px;   }

    .other-hero { width: 700px;   padding: 25px; }
    .other-hero h1{font-size: 24px; }
    .other-hero p {font-size: 14px;  margin-bottom: 30px; max-width: 700px;   }




    .width-1200{ width: 100%; margin: 0px auto}
    .width-1018{ width: 100%; margin: 0px auto}

    .header{ overflow: hidden; height: 60px; }
    .header .nav-box{  width: 100%; margin: 0 auto; }
    .header .nav-box .logo{ width: 100px;height: 60px; margin-top: 5px; float: left; margin-left: 10px;}
    .header  h1{ margin-top: 8px !important}
    /*.header .nav-box .logo h1{  margin-top: 15px;}

    .header .nav-box .logo img{max-width: 100px;}*/
    .header .nav ul li{ line-height: 60px; width: 70px; margin-right: 10px; }
    .header .nav ul li a{height: 60px; }
    .header .nav-box .other{ float: right; margin-left: 20px; margin-right: 10px;}
    .header .nav-box .other p{ line-height: 60px; padding-left: 30px;}
    .box{ margin-top: 60px;}

    .index .ul-case-i{ padding-left: 10px;}
    .index .ul-case-i li { width: 33%; }

    .index .ul-case-i li:nth-child(7),.ul-case-i li:nth-child(8){ display: none;}
    .index .ul-news-i{ padding-left: 10px;}
    .index .ul-news-i li {   width: 33%; margin-bottom: 30px; }
    .index .ul-news-i li:nth-child(4){ display: none;}
    .box .ul-case{ /*padding: 0px 20px; width: calc(100% - 40px);*/}
    .page-c{ padding: 0px 40px; width: calc(100% - 80px);}
    .ul-about-i li .pad{padding: 0px 30px;}
    .detalis_box_content .right-content{ display: none;}
    .detalis_box_content  .fl{ width: calc(100% - 40px); margin: 10px 20px 20px 20px;}
    .ul-icon-i li {padding-left: 40px;}
    .ul-icon-i li .pad{padding: 0 10px; width: calc(100% - 20px);}
    .ul-news-i li .txt-c{ line-height: 20px; max-height: 42px;}
    .paging{ padding-left: 20px;}


}


@media only screen and (max-width: 749px) {
    .contact-section .contact-info{ width: 100%;}

    .contact-info .contact-item { width: 100%;}
    .contact-info {display: block; justify-content: normal; gap: 0px; }

    .certifications img { height: 80px; margin: 0 10px; }

    .core-values {grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 10px 0; }


    .index-hero { width: 100%; padding: 20px 0px 10px 0px; }
    .index-hero h1{font-size: 18px; }
    .index-hero p {font-size: 12px;  margin-bottom: 30px; max-width: 100%;   }

    .other-hero { width: 100%; padding: 20px 0px 10px 0px; }
    .other-hero h1{font-size: 18px; }
    .other-hero p {font-size: 12px;  margin-bottom: 30px; max-width: 100%;   }


    .category-grid { grid-template-columns: repeat(1, 1fr); }
    .advantage-grid { grid-template-columns: repeat(2, 1fr); }
    .product-grid { grid-template-columns: repeat(1, 1fr); }
    .product-grid { display: grid; grid-template-columns: repeat(2, 1fr); }

    .width-1200{ width: 100%; margin: 0px auto}
    .width-1018{ width: 100%; margin: 0px auto}

    .header{ overflow: hidden; height: 60px; }
    .header .nav-box{  width: 100%; margin: 0 auto; }
    .header .nav-box .logo{ width: 120px;height: 60px; margin-top: 5px; float: left; margin-left: 10px;}
    .header  h1{ margin-top: 12px !important}
    .header .nav-box .logo img{max-width: 120px;}
    /*
        .header .nav ul li{ line-height: 60px; width: 70px; margin-right: 10px; }
        .header .nav ul li a{height: 60px; }*/
    .header .nav-box .other{ display: none}
    .header .nav{display: none}

    .sp_nav{ display: inline-block;}
    .sjj_nav{ display: inline-block;}

    .sp_nav{width:50px;float:right;position:relative;cursor:pointer;height:30px;margin-top:18px; margin-right: 5px;}
    .sp_nav span{display:block;background:#F18F01;width:30px;height:2px;position:absolute;left:10px;transition:all ease 0.35s}
    .sp_nav span:nth-of-type(1){top:0px}
    .sp_nav span:nth-of-type(2){top:10px}
    .sp_nav span:nth-of-type(3){top:20px}
    .sp_nav_se span:nth-of-type(1){top:10px;transform:rotate(45deg)}
    .sp_nav_se span:nth-of-type(2){width:0}
    .sp_nav_se span:nth-of-type(3){top:10px;transform:rotate(-45deg)}
    .sjj_nav{position:fixed;z-index:9;background:#ffffff;width:100%;/*height:calc(100% - 104px);*/font-size:14px;line-height:40px;top:-100%;left:0;overflow:auto;overflow-x:hidden;transition:top ease 0.35s;}
    .nav_show{top:50px}
    .sjj_nav>ul>li:first-child{overflow:hidden;border-top:0}
    .sjj_nav>ul>li:first-child>a{float:left;width:calc(100% - 70px)}
    .sjj_nav>ul>li:first-child .language{float:right;width:70px;overflow:hidden;line-height:30px;margin-top:5px}
    .sjj_nav>ul>li:first-child .language a{width:35px;float:left;border-left:1px #ddd solid;text-align:center;color:#999;}
    .sjj_nav ul li i{position:absolute;top:5px;right:0px;border-left:1px #ddd solid;height:30px;padding:0px 7px 0 7px;}
    .sjj_nav ul li i svg{transform:rotate(-90deg);transition:all ease 0.35s}
    .sjj_nav ul li .sjj_nav_i_se svg{transform:rotate(0deg)}
    .sjj_nav ul li{border-top:1px #ddd solid;margin-left:20px;margin-right:20px;position:relative;line-height:40px;font-size:14px}
    .sjj_nav>ul >li:last-child{border-bottom:1px #ddd solid;}
    .sjj_nav ul li ul{display:none}
    .sjj_nav ul li a{color:#666;display: block;}
    .sjj_nav ul li ul li a{color:#999;display:block;text-align:left;}
    .sjj_nav ul li i svg{width:20px;height:20px;fill:#555;}
    .sjj_nav ul li .sjj_nav_i_se svg{fill:#F18F01}
    .sjj_nav ul li ul li>ul{margin-left:10px}
    .sjj_nav  ul li a:hover{ border-bottom: 0px solid #F18F01; color:#F18F01; }
    .sjj_nav  ul li.onnav a{ border-bottom: 0px solid #F18F01; color:#F18F01; }

    .box{ margin-top: 60px;}
    .index .ul-case-i{ padding-left: 0px;}
    .index .ul-case-i li { width: 100%; padding: 0 15px; margin-bottom: 30px; overflow: hidden; }
    .index .ul-case-i li:nth-child(7),.ul-case-i li:nth-child(8){ display: none;}
    .index .ul-news-i{ padding-left: 10px;}
    .index .ul-news-i li {   width:100%; margin-bottom: 10px; }
   /* .index .ul-news-i li:nth-child(4){ display: none;}*/
    .box .ul-case{ /*padding: 0px 20px; width: calc(100% - 40px);*/ }
    .page-c{ padding: 0px 10px; width: calc(100% - 20px);}
    .ul-about-i li{ width: 100%;}
    .ul-about-i li .pad{padding: 0px 0px;}
    .ul-about-i li .pad p{padding: 0px 10px 0px 10px;}

    .detalis_box_content .right-content{ display: none;}
    /*.detalis_box_content  .fl{ width: calc(100% - 40px); margin: 10px 20px 20px 20px;}*/
    .detalis_box_content .fl{ width: 100%; margin: 0px;}
    .ul-icon-i li { float: none; width: 100%; text-align: center; padding-bottom: 20px; }
    .ul-icon-i li .pad{padding: 0 10px;}
    .ul-news-i li .txt-c{ line-height: 20px; max-height: 42px;}
   .box .ban-in{ display:none;}
    .tit-i {  padding: 20px 0 10px 0; line-height: 26px;}
    .box .ul-case { /* margin: 0 -15px;*/ overflow: hidden; margin: 0px;  }
    .box .ul-case li {  float: left; width: 100%; padding: 0px; margin-bottom: 10px; }
    .paging{ text-align: center;}
    .pagination{ margin: 0 auto; margin-top: 20px;}
    .pagination li{ display: none;}
    .pagination li.m_x{ display: inline-block;}
    .pagination li.m_r{ margin-left: 50px;}
    .ul-news-i li { float: left; width: 100%; padding: 0px;  margin-bottom: 10px; }
    .m_y{ display: none;}
    .detalis_paging a span{ display: none;}

    .contact_f .fl{ width: 100%; }
    .contact_f .fr{ width: 100%; }
    .ul-contact{ padding: 10px 10px 0px 10px;}
    .ul-contact li {
        padding-left: 40px; text-align: left; margin-right: 0px;
        font-size: 14px;
        margin-bottom: 20px;
        line-height: 30px;
    }
    .ul-contact li.li1{background: url(../img/contact_01.png) no-repeat left;}
    .ul-contact li.li2{background: url(../img/contact_02.png) no-repeat left;}
    .ul-contact li.li3{background: url(../img/contact_03.png) no-repeat left;}

    .fr-form{ /*width: calc(100% - 20px);*/ width: 100%; padding: 10px; margin-left:0px;}
    .liuyanchenggong{  font-size: 16px; line-height: 150px;width: 300px;}


    .pc-img{ display: none!important;}
    .mobile-img{ display: inline-block!important;}




}

.list-nothing{ text-align: left;}




/* 页面主体：最大1200px 居中 */
.main-content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}
/* 产品布局 */
.product-detail {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
}
.product-images, .product-info {
    width: 100%;
}
/* 电脑端左右布局 */
@media (min-width: 768px) {
    .product-images, .product-info {
        width: calc(50% - 15px);
    }
}

/* 左侧图片：最大宽高控制在800px以内 */
.product-images {
    max-width: 800px;
    max-height: 800px;
    margin: 0 auto;
}
.main-img {
    width: 100%;
    height: auto;
    max-height: 563px; /* 主图高度限制 */
    object-fit: contain;
    border: 1px solid #eee;
    border-radius: 8px;
    margin-bottom: 15px;
}
.img-thumbnails {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom:5px;
    justify-content: center;
}
.img-thumbnails img {
    width: 70px;
    height: 70px;
    object-fit: cover;
    border: 1px solid #eee;
    border-radius: 4px;
    cursor: pointer;
    flex-shrink: 0;
}
.img-thumbnails img.active {
    border-color: #F18F01;
    border-width:2px;
}

/* 产品信息样式 */
.product-info h1 {
    font-size: 22px;
    margin-bottom: 15px;
}
@media (min-width: 768px) {
    .product-info h1 {
        font-size: 28px;
    }
}
.retail-price {
    text-decoration: line-through;
    color: #666;
    margin-bottom: 10px;
}
.price-table {
    width: 100%;
    border-collapse: collapse;
    margin:15px 0;
}
.price-table th, .price-table td {
    border: 1px solid #eee;
    padding: 8px;
    text-align: left;
    font-size:14px;
}
.price-table th {
    background-color: #f9f9f9;
}
.moq {
    color: #000;
    font-weight: bold;
    margin: 15px 0;
}
.product-features ul {
    padding-left: 20px;
    line-height:1.6;
}
.cta-buttons {
    display: flex;
    gap: 10px;
    margin:20px 0;
    flex-wrap: wrap;
}
.cta-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    font-size:14px;
}
.quote-btn { background-color: #F18F01; color: #000; }
.add-quote-btn { background-color: #fff; color: #000; border: 1px solid #000; }

/* 标签页 */
.tabs {
    display: flex;
    gap: 8px;
    margin:20px 0;
    flex-wrap: wrap;
}
.tab-btn {
    padding: 8px 15px;
    background-color: #f9f9f9;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size:14px;
}
.tab-btn.active {
    background-color: #F18F01;
    color: #000;
}
.tab-content { display: none; }
.tab-content.active { display: block; line-height:1.7; }