*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
li{
    list-style: none;
}
button{
	cursor: pointer;
}

/* 通用 */
.listbanner{
    width: 100%;
}
.listbanner img{
    width: 100%;
}
.navlist{
    width: 100%;
}
.listnav{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
	flex-wrap: wrap;
}
.navul{
    display: flex;
	flex-wrap: wrap;
}
.navul a{
    position: relative;
    font-size: 15px;
    height: 80px;
    line-height: 80px;
    padding: 0px 30px;
    color: #333;
    display: block;
    transition: 0.3s ease 0s;
}
.navul a::after{
    content: "";
    position: absolute;
    width: 1px;
    height: 15px;
    display: block;
    background: #ccc;
    top: 50%;
    margin-top: -7px;
    right: 0px;
}
.navul a::before{
    position: absolute;
    content: '';
    left: 50%;
    bottom: 0px;
    width: 0%;
    height: 3px;
    background-color: none;
    transition: all .3s;
}
.navul a:hover{
    color: #f08200;
}
.navul a:hover::before{
    width: 80%;
    left: 10%;
    background-color: #f08200;
}
.navkj{
    line-height: 80px;
	padding-left:10px;
}
.navkj a{
    font-size: 14px;
    transition: all .3s;
}
.navkj a:hover{
    color: #f08200;
}


/* 页码 */
#pages{
	text-align:center;
	margin:20px 0 0;
}
#pages a{
	padding:5px 5px;
	border:1px solid #f08200;
	line-height:1;
	display:inline-block;
	transition: all 0.5s;
	/* color:#f08200; */
}
#pages a:hover{
	background:#f08200;
	color:white;
}
#pages span{
	padding:5px 5px;
	border:1px solid #f08200;
	line-height:1;
	display:inline-block;
	background:#f08200;
	color:white;
}

/* 上下篇 */
.nextprev{
    display: flex;
}

/* 动画 */
@keyframes topmove{
    0%{
        top:100%
    }
    100%{
        top:0
    }
}
@keyframes magnify{
    0%{
        transform: scale(1);
    }
    100%{
        transform: scale(1.2);
    }
}


/* 首页 */
/* 通用 */
.ih3{
    font-size: clamp(20px,2.5vw,42px);
    text-align: center;
    font-weight: bold;
}
.ih4{
    font-size: clamp(12px,1vw,16px);
    text-align: center;
    color: #666666;
    margin-top: clamp(10px ,1vw ,20px);
}

/* 挂件 */
.gjlist{
    position: fixed;
    right: 20px;
    top: 30%;
    transform: translate(0,-50%);
    z-index: 998;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.gjitem{
    background: #eee;
    padding: 15px 30px 15px 40px;
    border-radius: 10px;
    position: relative;
    transition:all 1s ease;
}
.gjitem:hover{
    background: #f08200;
}
.gjitem a{
    width: 100%;
    display: block;
    font-size: 14px;
}
.gjitem a img{
    height: 30px;
}
.gjitem1::before{
    position: absolute;
    content: '';
    width: 30px;
    height: 20px;
    left: 5px;
    top: 50%;
    transform: translate(0,-50%);
    background: url(/images/RFQ.png) no-repeat center;
    background-size: auto 100%;
}
.gjitem2::before{
    position: absolute;
    content: '';
    width: 30px;
    height: 20px;
    left: 5px;
    top: 50%;
    transform: translate(0,-50%);
    background: url(/images/gjphone.png) no-repeat center;
    background-size: auto 100%;
}
.gjitem3::before{
    position: absolute;
    content: '';
    width: 30px;
    height: 20px;
    left: 5px;
    top: 50%;
    transform: translate(0,-50%);
    background: url(/images/gjwhatsapp.png) no-repeat center;
    background-size: auto 100%;
}
.gjitem4::before{
    position: absolute;
    content: '';
    width: 30px;
    height: 20px;
    left: 5px;
    top: 50%;
    transform: translate(0,-50%);
    background: url(/images/gjemail.png) no-repeat center;
    background-size: auto 100%;
}

/* banner */
.ibanner .swiper-slide{
    position: relative;
}
.ibannertext{
    position: absolute;
    color: white;
    font-size: clamp(16px,3vw,48px);
    bottom: calc(3% + 50px);
    text-align: center;
    /* left: 50%; */
    /* transform: translateX(-50%); */
    filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.5));
}

/* 产品 */
.iproduct{
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 10px;
    margin-top: clamp(30px ,3vw ,50px);
}
.ipro{
    width: 100%;
    max-width: 1920px;
    margin: 0 auto 0;
    margin-top: clamp(30px ,3vw ,50px);
}
#wrap{
    overflow: hidden;
    margin:auto;
    width: 100%;
    aspect-ratio: 32 /11;
}
#wrap ul li img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
#wrap > ul{
    width: 100%;
    list-style: none;
    display: flex; /* 使用flex布局替代浮动 */
    height: 100%;
    gap: 15px;
}
#wrap > ul > li{
    height: 100%;
    cursor: pointer;
    flex: 0 0 calc(15% - 15px); /* 初始宽度15% */
    transition: all 0.5s ease; /* 使用CSS过渡替代jQuery动画 */
    position: relative;
    overflow: hidden;
    border-radius: 20px;
}
#wrap > ul > li.curr{
    flex: 0 0 55%; /* 激活状态宽度55% */
}
#wrap > ul > li > .text{
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    left: 0;
    top: 0;
}
.curr .text{
    background: rgba(0, 0, 0, 0.0) !important;
    animation: all 0.5s;
}
#wrap > ul > li > .text p{
    color: #fff;
    font-size: clamp(12px,1vw,18px);
    text-transform: uppercase;
    /*line-height: 1;*/
}
.iprotext{
    position: absolute;
    width: 90%;
    display: flex;
    bottom: 0;
    right: 0;
    align-items: end;
    justify-content: space-between;
    padding: 20px 40px 20px 0;
    border-bottom: none;
}
.curr .iprop{
    padding-left: 50px;
}
.iprop{
    position: relative;
    padding-left: 0px;
}
.iprop span{
    font-size: 14px;
}
.iprop br{
    height: 0;
}
.curr .iprop::after{
    display: block;
}
.iprop::after{
    position: absolute;
    content: '';
    display: none;
    width: 50px;
    height: 100%;
    left: 0;
    top: 0;
    background: url(../../images/iproicon1.png) no-repeat bottom;
    background-size: auto 100%;
}
#wrap > ul > li .iprojt{
    display: none;
}
.curr .iprojt{
    width: 40px;
    height: 40px;
    background-color: white;
    border-radius: 50%;
    display: flex !important;
    align-items: center;
    justify-content: center;
}
.curr .iprojt:hover{
    filter: drop-shadow(0 0px 7px rgba(244,156,38,1));
}
.iprojt img{
    width: 80% !important;
    height:80% !important;
    object-fit: contain !important;
}

/* 公司简介 */
.iintroduction{
    width: 100%;
    background: url(../../images/iintroduction.png) no-repeat center;
    background-size: 100% auto;
    margin-top: clamp(30px ,3vw ,50px);
}
.iintmain{
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 10px;
}
.iintmain .clearfix{
    display: flex;
    /* grid-template-columns: repeat(auto-fill, minmax(calc(33.33%), 1fr)); */
    justify-content: start;
}
.iintmain .clearfix li{
    width: 25%;
}
.iintmain .clearfix .item div{
    color: white;
}
.countup{
    padding: 20px 0;
    border-bottom: 1px solid white;
    overflow: hidden;
}
.numCX{
    font-size: 48px;
    font-weight: bold;
}
.indc{
    font-size: 14px;
}
.iintcont{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(50% - 20px), 1fr));
    gap:20px;
    overflow: hidden;
	padding-bottom:20px;
}
.iicleft{
    width: 100%;
    display: flex;
    flex-direction: column;
}
.iicright{
    width: 100%;
}

.iicright img{
    width: 100%;
}
.iicleft h2{
    text-align: left;
    color: white;
    margin-top: clamp(30px ,3vw ,50px);
    line-height: 1;
}
.iicleftp{
    width: 95%;
    font-size: 18px;
    color: white;
    padding:10px 0 20px;
    border-bottom: 2px solid white;
}
.iicdes{
    width: 95%;
    font-size: 16px;
    color: white;
    text-align: justify;
    margin: 30px 0 40px;
}
.iica{
    width: 150px;
    background-color: white;
    padding: 10px 0 10px 10px;
    border-radius: 10px;
    position: relative;
}
/*.iica::after{*/
/*    position: absolute;*/
/*    content: '';*/
/*    background: url(../../images/cjt.png) no-repeat center;*/
/*    width: 30px;*/
/*    height: 20px;*/
/*    background-size: 100% auto;*/
/*    right: 15px;*/
/*    top: 50%;*/
/*    transform: translate(0,-50%);*/
/*}*/

/* 案例 */
.icase{
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 10px;
    margin-top: clamp(30px ,3vw ,50px);
}
.mySwiper1 .swiper-wrapper{
    margin-top: clamp(30px ,3vw ,50px);
    margin-bottom: clamp(10px ,1vw ,20px);
}
.mySwiper1 .swiper-wrapper .swiper-slide{
    position: relative;
    border-radius: 20px;
    overflow: hidden;
	aspect-ratio: 71 /47;
}
.mySwiper1 .swiper-wrapper .swiper-slide:hover .icasea{
    animation: topmove 2s ease forwards;
}
.mySwiper1 .swiper-wrapper .swiper-slide:hover img{
    animation: magnify 2s ease forwards;
}
.icasea{
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background-color: rgba(0, 0, 0, 0.5);
    left: 0;
    top: 100%;
    color: white;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 一站式 */
.ionestop{
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    margin-top: clamp(30px ,3vw ,50px);
}
.ionelist{
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(50% - 20px), 1fr));
    gap:20px;
    overflow: hidden;
}
.ioneimg{
    position: absolute;
	max-width:20%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 10;
}
.ioneimg img{
	width:100%;
}
.ionitem{
    position: relative;
    overflow: hidden;
}
.ionea{
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background-color: rgba(0, 0, 0, 0.5);
    left: 0;
    top: 100%;
    color: white;
    font-size: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.ionitem:hover .ionea{
    animation: topmove 2s ease forwards;
}
.ionea p{
    font-size: 24px;
}
.ionea img{
    width: 65px;
    height: 65px;
    object-fit: contain;
}
.ionitem img{
    width: 100%;
}
.ionitemimg{
	border-radius: 20px;
	height:100%;
	object-fit:cover;
}

/* 新闻 */
.inews{
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    margin-top: clamp(30px ,3vw ,50px);
	padding:0 10px;
	box-sizing:border-box;
}
.inewslist{
    width: 100%;
    margin-top: clamp(20px ,2vw ,40px);
    /* display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(30%), 1fr));
    gap:3.3%; */
}
/* .inewsitem{
    width: 100%;
} */
.inewsitop i{
    font-size: 16px;
    color: #666666;
    filter: drop-shadow(0px 3px 2px rgba(244,156,38,1));
}
.inewsitop h3{
    width: 100%;
    font-size: 20px;
	height:20px;
    margin: 10px 0;
    font-weight: bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1;
}
.inewsitop p{
    width: 100%;
    font-size: 14px;
	height:40px;
    color: #999999;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.inewsibottom{
    width: 100%;
    aspect-ratio: 41 /23;
    overflow: hidden;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    margin-top: 20px;
}
.inewsibottom img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.inewslist .swiper-slide:hover .inewsibottom img{
    animation: magnify 2s ease forwards;
}

/* 底部联系 */
.allbottom{
    width: 100%;
    display: flex;
    margin-top: clamp(30px ,4vw ,75px);
}
.allbottomleft{
    width: 50%;
}
.allbottomleft img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.allbottomright{
    width: 50%;
    background-color: #f08200;
    display: flex;
    justify-content: start;
    align-items: center;
}
.allbottomright h3{
    font-size: clamp(18px,2vw,38px);
    color: white;
    font-weight: bold;
    text-align: center;
    line-height: 1;
}
.allbline{
    width: 60%;
    max-width: 600px;
    height: 2px;
    background-color: white;
    margin: clamp(18px,2vw,38px) auto;
}
.allbrmain{
    width: 80%;
    max-width: 960px;
    margin: 0 10%;
}
.inputlist{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.inputlist input{
    grid-column: span 1;
    width: 100%;
    aspect-ratio: 57 /20;
    border-radius: 10px;
    border: none;
    text-align: start;
    padding: 10px;
    box-sizing: border-box;
    transition: all 1s;
}
.inputlist input:focus{
    filter: drop-shadow(0px 5px 5px rgba(0,0,0,.5));
}
.inputlist textarea{
    grid-column: span 3;
    width: 100%;
    aspect-ratio: 177 /20;
    border-radius: 10px;
    border: none;
    padding: 10px;
    box-sizing: border-box;
    transition: all 1s;
}
.inputlist textarea:focus{
    filter: drop-shadow(0px 5px 5px rgba(0,0,0,.5));
}
.allbform button{
    width: 200px;
    height: 46px;
    background-color: white;
    border-radius: 10px;
    border: none;
    margin: 20px auto 0;
    color: #666666;
    display: block;
}

/* 底部 */
footer{
    width: 100%;
    background-color: black;
}
.footer{
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
}
.footertop{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    padding:clamp(18px,2vw,38px) 0 clamp(18px,2vw,38px);
    border-bottom: 1px solid white;
}
.footerone{
    grid-column: span 1;
    display: flex;
    flex-direction: column;
    padding-left: 10px;
    box-sizing: border-box;
}
.footeroneline{
    width: 100%;
    height: 1.5px;
    background-color: white;
    margin: 25px 0 15px;
}
.footerone p{
    position: relative;
    color: #a9a9a7;
    font-size: 16px;
    padding-left: 20px;
    margin-top: 15px;
    line-height: 2;
}
.footerone p:nth-child(3)::before{
    position: absolute;
    content: '';
    width: 20px;
    height: 20px;
    top: 5px;
    left: 0;
    transform: translate(-50%,-0%);
    background: url(../../images/phone.png) no-repeat center;
    background-size: 100% 100%;
}
.footerone p:nth-child(4)::before{
    position: absolute;
    content: '';
    width: 20px;
    height: 20px;
    top: 5px;
    left: 0;
    transform: translate(-50%,-0%);
    background: url(../../images/email.png) no-repeat center;
    background-size: 100% 100%;
}
.footerone p:nth-child(5)::before{
    position: absolute;
    content: '';
    width: 20px;
    height: 20px;
    top: 5px;
    left: 0;
    transform: translate(-50%,-0%);
    background: url(../../images/adress.png) no-repeat center;
    background-size: 15.4px 20px;
}
.footertwo{
    grid-column: span 2;
    align-content: center;
}
.footertwo ul{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(33.3% - 50px), 1fr));
    gap: 50px;
}
.footertwo a{
    color: white;
    font-size: 18px;
    margin-left: 20px;
}
.footerthree{
    grid-column: span 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.footerthree h3{
    color: white;
    font-size: 24px;
}
.footerthree ul{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(25% - 20px), 1fr));
    gap: 20px;
    padding-top: 20px;
}
.footerthree ul li img{
    width: 45px;
    height: 45px;
    object-fit: contain;
}
.footerbottom{
    display: flex;
    justify-content: center;
    gap: 30px;
    align-items: center;
    padding: 10px 0;
	flex-wrap: wrap;
}
.footerbottom p{
    font-size: 14px;
    color: #999999;
}
.footerbottom a{
    font-size: 14px;
    color: #999999;
}




/* 内页 */
/* 关于我们 */
.cateabout{
    width: 100%;
    /* padding:0 10px; */
    background-color: rgba(243,247,250,0.6);
}
.catemain{
    padding: 30px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}
.catemain h3{
    font-size: clamp(18px,2vw,38px);
    text-align: center;
    font-weight: normal;
    margin-bottom: 2%;
}
.catemain p{
    font-size: 16px;
    line-height: 2;
    color: #696969;
}

.aboutculture{
	position: relative;
    width: 100%;
    height: calc(100vh - 100px);
    background-color: rgba(243,247,250,0.6);
    box-sizing: border-box;
}
.aboutcultureh3{
    font-size: clamp(18px,2vw,38px);
    text-align: center;
    font-weight: normal;
    padding: 10px 0 0;
    text-transform: uppercase;
    background-color: rgba(243,247,250,0.6);
}
.aboutcultureh4{
    font-size: 16px;
    color: #666;
    text-align: center;
    font-weight: normal;
    padding-bottom: 30px;
    background-color: rgba(243,247,250,0.6);
}
#aboutpa{
	position: absolute;
	top:-100px;
}
.mySwipercul{
    width: 100%;
    height: 100%;
}
.mySwipercul .swiper-slide{
    position: relative;
}
.cultureimg{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.culturemain{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
}
.culturecont{
    position: relative;
    width: 100%;
    max-width: 1400px;
    height: 100%;
    margin: 0 auto;
    padding: 0 10px 100px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}
.culturelist{
    display:grid;
    grid-template-columns: repeat(2,1fr);
    gap: 30px;
}
.cultureitem{
    grid-column: span 1;
}
.cultureitem h3{
    color: white;
    font-size: 32px;
    font-weight: bold;
}
.cultureitem p{
    color: rgba(255, 255, 255, 0.8);
    font-size: 18px;
    line-height: 1.6;
	margin-top:10px;
}
.culturepa{
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 50px;
}
.culturepamain{
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    gap: 20px;
}
.mySwipercul .swiper-button-next{
    width: 50px;
    height: 50px;
    background: url(../../images/cultureright.png);
    background-size: 100% 100%;
    position: relative;
    left: 0;
}
.mySwipercul .swiper-button-next::after{
    display: none;
}
.mySwipercul .swiper-button-prev{
    width: 50px;
    height: 50px;
    background: url(../../images/cultureleft.png);
    background-size: 100% 100%;
    position: relative;
    left: 0;
}
.mySwipercul .swiper-button-prev::after{
    display: none;
}


.aboutbottom{
    width: 100%;
    min-height: 300px;
    padding: 5% 0 0;
    box-sizing: content-box;
    /*background: url(../../images/aboutcate.png) no-repeat center;*/
    background-color: black;
    background-size: 100% ;
}
.aboutbmain{
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding:0 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
}
.aboutbmright{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-around;
    width: 100%;
    /*max-width: 370px;*/
    background-color: rgba(255, 255, 255, 1);
    padding-left: 25px;
    padding-top: 50px;
    padding-bottom: 50px;
    padding-right: 25px;
    border-radius: 20px;
	align-items: center;
}
.aboutmrone{
    display: flex;
    flex-direction: column;
}
.aboutbmright h3{
    font-size: 20px;
    color: rgba(52, 52, 52, 1);
}
.aboutbmright p{
    font-size: 14px;
    color: rgba(119, 119, 119, 1);
    margin: 6px 0;
}
.aboutbmrimg{
    max-width:300px;
    display: flex;
    flex-direction: column;
}
.aboutbmrimg img{
    width: 100%;
}
.aboutbmrimg span{
    font-size: 16px;
    text-align: center;
}


/* 优势 */
.pagecore{
    width: 100%;
    margin-bottom: 50px;
}
.corelist{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}
.coreitem{
    position: relative;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.coreitem h3{
    font-size: 24px;
    font-weight: bold;
    color: #f08200;
}
.corepo{
    position: absolute;
    bottom: 0;
    right: 0;
}
.corepo span {
    font-size: 150px;
    line-height: 1;
    font-weight: bold;
    background: linear-gradient(to bottom, rgba(240, 130, 0, 0.8), rgba(0, 0, 0, 0));
    /* 关键属性：将背景裁剪到文字 */
    -webkit-background-clip: text;
    background-clip: text;
    /* 将文字颜色设置为透明，让背景渐变显示出来 */
    color: transparent;
    -webkit-text-fill-color: transparent;
}



/* 产品 */
.products{
    width: 100%;
    background-color: rgba(242, 242, 242, 1);
    padding:clamp(18px,2vw,38px) 0 clamp(18px,2vw,38px);
}
.productlist{
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
}
.productitem{
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.1);
    transition: all 1s;
}
.productitem:hover .proimg img{
    animation: magnify 1s ease forwards;
}
.productitem:hover .protitle{
    background-color: #f08200;
}
.productitem:hover .proname p{
    color: white;
}
.proimg{
    display: block;
    width: 100%;
    height: 0px;
    padding-bottom: 75%;
    position: relative;
    overflow: hidden;
}
.proimg img{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0%;
    left: 0;
}
.protitle{
    background-color:rgba(242, 242, 242, 1);
	transition: all 1s;
}
.proname{
    display: flex;
    justify-content: space-between;
    padding: 20px 20px 10px;
    transition: all 1s;
}
.proname p{
    color: #707070;
    font-size: 16px;
}
.productline{
    position: relative;
    padding-bottom: 20px;
    width: 100%;
    height: 2px;
}
.productline::before{
    content: '';
    position: absolute;
    right: 20px;
    display: block;
    width: 30px;
    height: 1px;
    background: #999;
    transition: all .5s ease;
}
.productitem:hover .productline::before{
    width: calc(100% - 40px);
    background: white;
}

/* 新闻 */
.news{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
}
.newnews{
    width: 100%;
    background-color: #eee;
    padding: 15px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.newnewstitle{
    width: 60%;
}
.newnewstitle span{
    display: block;
    color: #f08200;
    font-size: 14px;
    line-height: 24px;
    font-style: italic;
}
.newnewstitle h3{
    width: 100%;
    font-size: 24px;
    line-height: 30px;
    margin-top: 38px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}
.newnewstitle p{
    color: #737d86;
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    text-overflow: ellipsis;
}
.newnewstitle a{
    display: block;
    width: 136px;
    height: 44px;
    line-height: 44px !important;
    text-align: center;
    background: #ffffff;
    border: solid 1px #194a5b;
    color: #333333;
    margin-top: 32px;
    transition: all 1s;
}
.newnewstitle a:hover{
    background: #f08200;
    color: white;
}
.newnewsimg{
    position: relative;
    width: 37%;
    aspect-ratio: 4 /3;
}
.newnewsimg img{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
}

.newslist{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3,1fr);
	/* grid-template-columns: repeat(auto-fill, minmax(calc(33.3% - 20px), 1fr)); */
    gap: 20px;
    margin: clamp(18px,2vw,38px) auto;
}
.newsitem{
    background-color:#f6f6f4 ;
	grid-column: span 1;
	width:100%;
}
.newsitemimg{
    width: 100%;
    aspect-ratio: 4 /3;
}
.newsitemimg img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.newsitemmain{
    padding: 12px 10px;
}
.newsitemmain h3{
    display: block;
    font-size: 18px;
    line-height: 26px;
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden;
    text-overflow: ellipsis;
}
.newsitemmain p{
    width: 100%;
    line-height: 1;
    font-size: 16px;
    height: 2em;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
	margin-top:10px;
}
.newsitemmain span{
    display: block;
    color: #f08200;
    font-size: 14px;
    line-height: 24px;
    margin-top: 13px;
}











/* 内容页 */
/* 产品 */
.showproduct{
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
}
.showproone{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 30px;
    background-color: white;
}
.showproothumb{
    width: 100%;
}
.showpeooimg{
    position: relative;
    width: 100%;
    padding-top: 75%;
}
.showpeooimg img{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 0;
    top: 0;
}
.showproospe{
    padding: 30px 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.showproospe h3{
    line-height: 1.8;
    font-size: 30px;
    font-weight: bold;
    color: rgba(51, 51, 51, 1);
    border-bottom: 1px dashed #666;
    margin-bottom: 20px;
}
.showprobtn{
    display: flex;
    gap: 30px;
}
.showprobtn a{
    display: flex;
    width: 160px;
    padding: 10px 8px;
    background-color: #f08200;
    color: white;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}
.showprobtn a:hover{
    background-color: black;
}

.showproint{
    width: 100%;
    max-width: 1400px;
    margin: 30px auto 0;
    padding: 30px;
    box-sizing: border-box;
    background-color: white;
}
.showprointh3{
    font-size: clamp(18px,2vw,38px);
    line-height: 1;
    padding-bottom: 20px;
    margin: 20px 0;
    border-bottom: 1px solid #666;
}
.showproint p{
    font-size: 16px;
}
.showproint img{
    width:100%;
    /*max-width: 800px;*/
}


.showproabout{
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 10px 30px;
    box-sizing: border-box;
}
.showproabout h3{
    font-size: clamp(18px,2vw,38px);
    line-height: 1;
    padding-bottom: 20px;
    margin: 20px 0;
    border-bottom: 1px solid #666;
}
.showprore{
    position: relative;
    width: 100%;
    padding-top: 75%;
    display: block;
}
.showprore img{
    position: absolute;
    width: 100%;
    height: calc(100% - 36px);
    object-fit: cover;
    top: 0;
    left: 0;
    border-radius: 10px;
}
.showprore p{
    margin: 10px 0; 
    font-size: 16px;
    text-align: center;
    line-height: 1;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp:1;
    overflow: hidden;
    text-overflow: ellipsis;
}

.showproform{
	position: relative;
    width: 100%;
    margin: 30px 0;
}
#showproformpa{
	position: absolute;
	top:-100px;
}
.showproform h3{
    font-size: clamp(18px,1.8vw,32px);
    font-weight: bold;
    text-align: center;
}
.showproform p{
    width: 45px;
    height: 4px;
    margin: 16px auto;
    background-color: #f08200;
}
.showproform form{
    background-color: white;
    padding: 30px ;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    box-sizing: border-box;
}
.showproform .showproformmain{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
}
.showproform input{
    grid-column: span 1;
    padding: .375rem .75rem;
    line-height: 1.5;
    font-size: 14px;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s 
    ease-in-out, box-shadow .15s 
    ease-in-out;
}
.showproform textarea{
    display: block;
    font-size: 14px;
    grid-column: span 2;
    min-height: 150px;
    padding: .375rem .75rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s 
    ease-in-out, box-shadow .15s 
    ease-in-out;
}
.showproform button{
    display: block;
    text-align: center;
    box-sizing: border-box;
    width: 150px;
    padding: 8px;
    margin: 20px auto 0;
    background: #f08200;
    border: none;
    color: white;
    border-radius: 8px;
}


/* 新闻 */
.shownews{
    width: 100%;
    max-width: 1200px;
    margin: 0px auto 30px;
    padding: 0 10px;
    box-sizing: border-box;
}
.shownewsdate{
    display: flex;
    width: 100%;
    max-width: 1200px;
    margin: 15px auto 0;
    padding: 20px 10px;
    box-sizing: border-box;
    border-top: 1px solid #d9d9d9;
}
.shownewsdate a{
    font-size: 14px;
    color: #707070;
}
.shownewsdate p{
    font-size: 14px;
    color: #595959;
    margin-left: 30px;
}
.shownewsh3{
    text-align: center;
    font-size: 26px;
    color: #262626;
}
.shownewscont{
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
}
.shownewscont p{
    font-size: 16px;
    line-height: 1.8;
    color: #595959;
    margin-top: 15px;
}
/* .shownewscont img{
	width:100%;
} */
.shownewscont p img{
    display: block;
    text-align: center;
    margin: 0 auto;
	max-width:100%;
}

.shownewsnext .prev{
    font-size: 16px;
    line-height: 1.4;
    color: #595959;
}
.shownewsnext {
    width: 100%;
    padding: 0 10px;
    margin-top: 30px;
    box-sizing: border-box;
    justify-content: space-between;
}
.shownewsnext .next{
    font-size: 16px;
    line-height: 1.4;
    color: #595959;
}

/* 案例 */
.showcase{
    width: 100%;
    max-width: 1400px;
    padding: 0 10px;
    margin: 0 auto;
    box-sizing: border-box;
}
.showcase h3{
    font-size: clamp(18px,2vw,32px);
    text-align: center;
    margin: clamp(18px,2vw,32px) 0;
}
.showcaseimg{
    width: 100%;
}
.showcaseimg img{
    width: 100%;
    height: 100%;
    margin: 0 auto;
    display: block;
}






/* 联系我们 */
.pagecontact{
    width: 100%;
    margin-top: 30px;
}
.pagecontmain{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
    display: flex;
}
.pagecontmleft{
    width: 50%;
    padding-right: 20px;
    box-sizing: border-box;
}
.pagecontmleft img{
    width: 100%;
}
.pagecontmleft p{
    font-size: 16px;
    line-height: 2;
    color: #808080;
}
.pagecontmright{
    width: 50%;
}
.pagecontmright img{
    width: 100%;
}

.pagecontmes{
	position: relative;
    width: 98%;
    margin: 0 auto;
    /* margin-top: clamp(30px ,3vw ,50px); */
    background-color: rgba(248, 248, 248, 1);
}
#pagecontpa{
	position: absolute;
	top:-100px;
}
.pagecontmesmain{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: clamp(30px ,3vw ,50px) 10px;
    box-sizing: border-box;
}
.pagecontmesmain h3{
    font-size: 32px;
    color: #333;
    line-height: 1.6;
    text-align: center;
}
.pagecontmesmain i{
    display: block;
    width: 50px;
    height: 4px;
    margin: 18px auto;
    background-color: #333;
}
.pagecontform{
    width: 100%;
}
.pagecontform form{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
    font-size: 14px;
}
.pagecontform form textarea{
    grid-column: span 2;
    width: 100%;
    padding: 10px;
    min-height: 160px;
    box-sizing: border-box;
    border: none;
}
.pagecontform form input{
    grid-column: span 1;
    height: 42px;
    padding: 10px;
    box-sizing: border-box;
    border: none;
}
.pagecontform form button{
    grid-column: span 2;
    border: none;
    height: 42px;
    background-color: #262626;
    color: white;
}







/* 自适应 */
@media screen and (max-width: 1650px){
	.aboutbottom{
		background-size: auto 100%;
	}
	.iprop::after{
        background-size:auto 100%;
    }
}
@media screen and (max-width: 1200px){
    .header{
        background: white;
		height:80px;
    }
    .header .img1,.logo{
        filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.5));
    }
    .ibanner{
        margin-top: 80px;
    }
	.listbanner{
		margin-top: 80px;
	}
/* 	.footertop{
		    grid-template-columns: repeat(3, 1fr);
	} */
	.footerthree{
		display:none;
	}
}

@media screen and (max-width: 1000px){
	.iintroduction{
		background-size:auto;
	}
	.iintcont{
		grid-template-columns: repeat(auto-fill, minmax(calc(100% - 20px), 1fr));
	}
	.allbottom{
		flex-direction: column;
	}
	.allbottomleft{
		width:100%;
	}
	.allbottomright{
		width:100%;
	}
	.allbrmain{
		padding:20px 10px;
		width:100%;
		margin:0 auto;
		box-sizing:border-box;
	}
	.footerone{
		grid-column: span 2;
	}
	.footertwo ul{
		grid-template-columns: repeat(auto-fill, minmax(calc(50% - 50px), 1fr));
	}

}
@media screen and (max-width: 800px){
	#wrap{
		aspect-ratio: auto;
	}
	#wrap > ul{
		flex-direction: column;
		flex-wrap: wrap;
	}
	#wrap > ul > li.indexli{
		flex: 0 0 calc(50% - 15px);
	}
	.listnav{
		flex-direction: column;
	}
	.navul a{
		padding:0 10px;
		height: 40px;
		line-height:40px;
	}
	.navkj{
		line-height:1;
		padding-left:10px;
		padding-bottom:10px;
		padding-top:10px;
	}
	.culturelist {
		grid-template-columns: repeat(1, 1fr);
		gap: 10px;
	}
	.productlist{
		grid-template-columns: repeat(2, 1fr);
	}
	.showproone {
		grid-template-columns: repeat(1, 1fr);
		gap:0;
	}
	.showprobtn{
		margin-top:30px;
	}
	.newnews{
		display:none;
	}
	.newslist{
		grid-template-columns: repeat(2, 1fr);
	}
	.pagecontmain{
		flex-direction: column;
	}
	.pagecontmleft{
		width:100%;
		padding-right: 0px;
	}
	.pagecontmright{
		width:100%;
	}
}
@media screen and (max-width: 500px){
	.footertwo{
		display:none;
	}
	.footerone{
		grid-column: span 4;
	}
	.ionelist{
		gap:10px;
	}
	.inputlist input{
		grid-column: span 3;
		aspect-ratio: auto;
	}
	.inputlist textarea{
		aspect-ratio: 177 / 40;
	}
	.numCX{
		font-size: 24px;
	}
	.iintmain .clearfix li {
		width: 33.3%;
	}
	.iicleftp{
		width:100%;
		font-size: 16px;
		line-height:1.2;
	}
	.iicdes{
		width:100%;
		font-size: 16px;
		line-height:1.2;
		margin: 15px 0 20px;
	}
	.catemain{
		padding:30px 10px;
	}
	.catemain p {
		line-height: 1.6;
		text-align: justify;
	}
	.footerbottom{
		justify-content: flex-start;
		gap:10px;
	}
	.coreitem h3{
		font-size: 18px;
		margin-top:20px;
	}
	.showprobtn a{
		width:120px;
		font-size:14px;
	}
	.productlist{
		grid-template-columns: repeat(1, 1fr);
	}
	.showproform input{
		grid-column: span 2;
	}
	.newslist{
		grid-template-columns: repeat(1, 1fr);
	}
	.pagecontform form input{
		grid-column: span 2;
	}
	.pagecontact{
		margin-top:0;
	}
	.showprore p{
		font-size:12px;
	}
	.gjlist{
	    top:unset;
	    bottom: 0%;
	}
	.cultureitem h3{
	    font-size: 24px;
	}
	.cultureitem p{
	    line-height: 1.2;
	    margin-top: 0;
	}
	.aboutbmright{
	    flex-direction: column-reverse;
	}
	.shownewsh3{
	    font-size: 20px;
	}
	.nextprev a span{
	    font-size:12px
	}
		.ionea img{
	    display: none;
	}
	.ionea p{
	    font-size: 16px;
	}
}