﻿@charset "utf-8";
*{margin:0;padding:0;outline:0;}
body,html{overflow-x:hidden;color:#000;font:14px/30px 'kanitregular', "Microsoft Yahei", "PingFang SC", "Helvetica Neue", Helvetica, Arial;background:#fff;}
blockquote,body,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0;}
input[type=text],input[type=submit],textarea,button{-webkit-border-radius:0;font-family:'kanitregular', "Microsoft Yahei", "PingFang SC", "Helvetica Neue", Helvetica, Arial;-webkit-appearance:none;}
input:focus{outline:0;}
textarea{resize:none;}
h1,h2,h3,h4,h5,h6{font-style:normal;font-size:100%;}
abbr,em,i,li,ol,ul{list-style-type:none;font-style:normal;}
img{border:0;vertical-align:middle;}
img{image-rendering:-moz-crisp-edges;image-rendering:-o-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;-ms-interpolation-mode:nearest-neighbor;}
table{border-collapse:collapse;border-spacing:0;}
.clearfix{display:block;zoom:1;}
.clearfix:before{display:table;content:"";}
.clearfix:after{clear:both;display:block;visibility:hidden;height:0;content:"";}
* html .clearfix{height:1%;}
*{box-sizing:border-box;}
a{color:#000;text-decoration:none;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-ms-transition:.3s;}
a:hover{color:#1168ab;text-decoration:none;}
.hide,.none,ins{display:none;}
.fl{float:left;display:inline-block;}
.fr{float:right;display:inline-block;}
.wrap{clear:both;display:block;margin:0 auto;max-width:1400px;width:100%;padding:0 0}
.animate img{position:relative;opacity:1;-webkit-transition:.5s all;-moz-transition:.5s all;-o-transition:.5s all;transition:.5s all;-webkit-transform:scale(1,1) rotate(0);-ms-transition:.5s all;}
a:hover .animate img{-webkit-transform:scale(1.06,1.06);-moz-transform:scale(1.06,1.06);-o-transform:scale(1.06,1.06);transform:scale(1.06,1.06);-ms-transform:scale(1.06,1.06);}
.animate img:hover{-webkit-transform:scale(1.06,1.06);-moz-transform:scale(1.06,1.06);-o-transform:scale(1.06,1.06);transform:scale(1.06,1.06);-ms-transform:scale(1.06,1.06);}
.tran,.tran a,a.tran,.tran img{-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;-ms-transition:all .3s;}
.rotate,.rotate2 img{-webkit-transition:all 0.8s;-moz-transition:all 0.8s;transition:all 0.8s;-ms-transition:all 0.8s;}
a:hover .rotate,a:hover rotate2 img{-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg);-webkit-transition:all 0.8s;-moz-transition:all 0.8s;transition:all 0.8s;-ms-transition:all 0.8s;}
.bor_box::after,.bor_box::before{pointer-events:none;}
.bor_box::after,.bor_box::before{position:absolute;top:20px;right:20px;bottom:20px;left:20px;content:'';opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;}
.bor_box::before{border-top:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:scale(0,1);transform:scale(0,1);}
.bor_box::after{border-right:1px solid #fff;border-left:1px solid #fff;-webkit-transform:scale(1,0);transform:scale(1,0);}
a:hover .bor_box::after,a:hover .bor_box::before{opacity:.7;-webkit-transform:scale(1);transform:scale(1);}


#header{ width:100%;z-index:999; border-bottom:4px solid #1168ab}
#header .wrap{display: flex;justify-content:space-between ;align-items:center; height:100px}
#header .logo img{ height:60px;}
#header .right{ display:flex;align-items:center;}
#header .right .nav ul{display:flex;align-items:center;}
#header .right .nav ul li{position:relative}
#header .right .nav ul li h3 a{ font-weight:normal; font-size:16px;position:relative; line-height:100px; display:block; padding:0 20px}
#header .right .nav ul li h3 a::before {content: '';height: 4px;position: absolute;left: 50%;bottom:-4px;background: #e00d1c;width: 0;transition: all 0.36s ease;transform:translatex(-50%); z-index:99}
#header .right .nav ul li .sub{ display:none; position:absolute; left:50%; top:104px; background:#fff; width:200px; border-top:1px solid #eee; z-index:99;transform:translatex(-50%);}
#header .right .nav ul li .sub dl{padding:5px 0}
#header .right .nav ul li .sub dl p{ border-bottom:1px solid #eee; padding:5px 0; font-size:16px; text-align:center}
#header .right .nav ul li.active h3 a{ color:#1168ab; font-weight:700}
#header .right .nav ul li.active h3 a::before {left:0%;width: 100%;transform:translatex(0%);}

#header .right .search{ margin-left:3vw;}
#header .right .search .title i{ font-size:26px;line-height:80px}
#header .right .search .sub{ display:none; width:100%; background:#fff; padding:100px 20%; position:absolute; left:0; top:80px;border-top:1px solid #eee; z-index:99}
#header .right .search .sub .searchbox{border-bottom:1px solid #eee}
#header .right .search .sub .searchbox form{ display:flex;}
#header .right .search .sub .searchbox .text{ border:0; line-height:40px; width:80%}
#header .right .search .sub .searchbox .btn{ border:0; background:none; width:20%; font-size:24px; text-align:right}
#header .right .nav ul li:hover h3 a { color:#1168ab}
#header .right .nav ul li:hover h3 a::before { width:100%}
#header .right .mnav{ display:none}

#banner{ width:100%}
#banner .focus{ position: relative; overflow: hidden}
#banner .focus .swiper-slide{ position:relative;}
#banner .focus .swiper-slide img{ width:100%}
#banner .focuss{ position: relative; overflow: hidden}
#banner .focuss .swiper-slide{ position:relative;}
#banner .focuss .swiper-slide img{ width:100%}
#banner .pc{ display:block}
#banner .m{ display:none}

.stitle{ text-align:center}
.stitle .t{ font-size:36px; font-weight:700; line-height:1}
.stitle .p{ font-size:16px; text-align:center; color:#888; margin-top:10px}
#product{ width:100%; padding:50px 0}
#product .list{ margin-top:30px}
#product .list ul{ display:flex;justify-content:flex-start;align-items:flex-start;flex-wrap:wrap;gap:30px 30px}
#product .list ul li{ width:calc((100% - 90px) / 4)}
#product .list ul li .img{ overflow: hidden; padding:30px; border:#eee 1px solid; border-radius:6px;}
#product .list ul li .img img{ width:100%}
#product .list ul li .info{ margin-top:20px}
#product .list ul li .info .title{ font-size:16px; font-weight:700}
#product .list ul li .info .p{ color:#666; line-height:1.7; margin-top:5px}
#product .list ul li .info .p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical}


#news{ width:100%; padding:50px 0; background:#f8f8f8}
#news .list{ margin-top:30px}
#news .list ul{ display:flex;justify-content:flex-start;align-items:flex-start;flex-wrap:wrap;gap:30px 30px}
#news .list ul li{ width:calc((100% - 60px) / 3)}
#news .list ul li .img{ overflow: hidden; height:290px; border-radius:6px;}
#news .list ul li .img img{width:100%;height:100%;object-fit:cover}
#news .list ul li .info{ margin-top:20px}
#news .list ul li .info .title{ font-size:16px; font-weight:700}
#news .list ul li .info .title{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;display:-webkit-box;-webkit-box-orient:vertical}
#news .list ul li .info .p{ color:#666; line-height:1.7; margin-top:5px}
#news .list ul li .info .p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical}
#news .list ul li .info .time{ color:#888}
#news .list .more{ text-align:center; margin-top:40px; opacity:.6}

#footer{ width:100%; background:#474747; border-top:4px solid #e00d1c}
#footer .map{ padding:40px 0;display: flex;justify-content:space-between ; }
#footer .map .item h3{ font-size:16px; color:#fff; margin-bottom:10px}
#footer .map .item .contact{ color:#fff; line-height:1.7;}
#footer .map .item .qrcode{ color:#fff; margin-top:10px}
#footer .map .item .qrcode img{ width:140px}
#footer .map .item p{ line-height:1.7}
#footer .map .item p a{ color:#fff;}
#footer .map .item .input .text{ border:0; width:300px; line-height:40px; background:#fff; display: block; margin-bottom:10px; text-indent:10px}
#footer .map .item .input .btn{ border:0; line-height:40px; color:#fff; background:#e00d1c; padding: 0 10px}
#footer .copyright{ padding:15px 0;display: flex;justify-content:space-between ; border-top:1px solid rgba(255,255,255,.2) }
#footer .copyright .left{ color:#fff}
#footer .copyright .left a{ color:#fff; margin-left:10px}
#footer .copyright .right{display: flex;}
#footer .copyright .right a{ color:#fff; margin-left:10px}

@media (max-width:800px){
	body,html{font-size:.23rem;line-height:.34rem;}	
	#header{padding:0 .3rem; position:relative}
	#header .wrap{height:1rem;}
	#header .logo img{ height:.6rem;}
	#header .right{ display:flex;align-items:center;}
	#header .right .nav{position: absolute;background:#fff;height:auto;min-height:100vh;width:100%;top:1rem;z-index:105;padding:.1rem .25rem 0;transform:translatex(100%);left:0;border-top:1px solid #eee;}
	#header .right .nav ul{display: block}
	#header .right .nav ul li{ margin-right:0}
	#header .right .nav ul li h3{border-bottom:1px solid #eee; text-align:left}
	#header .right .nav ul li h3 a{ font-size:.24rem; line-height:.7rem; width:100%; padding:0}
	#header .right .nav ul li h3 a::before {left:0;transform:translatex(0%)}
	#header .right .nav ul li .sub{ display:none; position: inherit; left: auto; top:auto; background:#fff; width:100%; border-top:1px solid #eee;transform:translatex(0);}
	#header .right .nav ul li .sub dl{ width:100%;padding:.2rem 0}
	#header .right .nav ul li .sub dl p{ border-bottom:1px solid #eee; padding:.15rem .3rem; font-size:.24rem; text-align:left}
	#header .right .mnav.isopen .s3{top:.1rem;transform:rotate(-45deg);}
	#header .right .search{ margin-left:4vw;}
	#header .right .search .title i{ font-size:.3rem;line-height:1rem; color:#333;}
	#header .right .search .sub{ padding:.5rem .3rem; position:absolute; left:0; top:1rem;}
	#header .right .mnav{ display:block; margin-left:4vw}
	#header .right .mnav{position:relative;display:block;width:.34rem;height:.25rem;cursor:pointer;}
	#header .right .mnav span{position:absolute;display:block;width:.34rem;height:.05rem;background:#e00d1c;transition:all .5s;border-radius:.05rem}
	#header .right .mnav .s1{top:0;}
	#header .right .mnav .s2{top:.1rem;width:.26rem;}
	#header .right .mnav .s3{top:.2rem;}
	#header .right .mnav.isopen .s1{top:.1rem;transform:rotate(45deg);}
	#header .right .mnav.isopen .s2{width:0;opacity:0;}
	#header .right .nav.isopen{transform:translatex(0); display:block}
	
	#banner .pc{ display:none}
	#banner .m{ display:block}

	.stitle{ text-align:center}
	.stitle .t{ font-size:.44rem;}
	.stitle .p{ font-size:.22rem; margin-top:.1rem}
	
	#product{padding:.5rem .3rem}
	#product .list{ margin-top:.3rem}
	#product .list ul{gap:.3rem}
	#product .list ul li{ width:100%}
	#product .list ul li .img{padding:.3rem .5rem;}
	#product .list ul li .info{ margin-top:.2rem}
	#product .list ul li .info .title{ font-size:.26rem;}
	#product .list ul li .info .p{ margin-top:.1rem; font-size:.22rem}
	#product .list ul li .info .p{-webkit-line-clamp:20;}

	#news{padding:.5rem .3rem;}
	#news .list{ margin-top:.3rem}
	#news .list ul{ gap:.3rem}
	#news .list ul li{ width:100%}
	#news .list ul li .img{ overflow: hidden; height: auto}
	#news .list ul li .info{ margin-top:.2rem}
	#news .list ul li .info .title{ font-size:.26rem;}
	#news .list ul li .info .title{-webkit-line-clamp:20;}	
	#news .list ul li .info .p{margin-top:.1rem; font-size:.22rem}
	#news .list ul li .info .p{-webkit-line-clamp:20;}	
	
	#footer .map{ padding:.5rem .3rem; }
	#footer .map{ display:block}
	#footer .map .item h3{ font-size:.24rem; margin-bottom:.1rem}
	#footer .map .item .contact{ font-size:.22rem}
	#footer .map .item .qrcode{ margin-top:.1rem}
	#footer .map .item .input .text{ border:0; width:100%; font-size:.22rem}
	#footer .map .item .input .btn{ border:0; line-height:40px; padding: 0 20px}
	#footer .map .item:nth-child(2){ display:none}
	#footer .map .item:nth-child(3){ display:none}
	#footer .map .item:nth-child(4){ margin-top:.5rem}
	#footer .copyright{ padding:.2rem 0;display: block; font-size:.2rem}
	#footer .copyright .left{ text-align:center}
	#footer .copyright .right{justify-content:center ;}
	#footer .copyright .right a{margin:0 .1rem}
	

}

#nbanner{ width:100%}
#nbanner img{ width:100%}
#nbanner.pc{ display:block}
#nbanner.m{ display:none}

#main{ width:100%}

#main .nlist{ margin-top:30px;display: flex;justify-content:center;align-items:center;}
#main .nlist a{background:#2197ba; color:#fff; border-radius:6px; padding:10px 30px; font-size:16px; margin-right:10px;}
#main .nlist a.currclass{background:#1168ab; }

#main .local{ border-bottom:1px solid #eee;}
#main .local{display: flex;justify-content:space-between ;align-items:center;}
#main .local .left{display: flex;}
#main .local .left a{ margin-right:50px; font-size:20px; position:relative; padding:15px 0}
#main .local .left a::after{content: "";position: absolute;width: 1px;height: 15px;display: block;background: #ccc;top: 50%;margin-top: -7px;right: -25px;}
#main .local .left a:last-child::after{ display:none}
#main .local .left a::before {position: absolute;content: '';left: 50%;bottom: 0px;width: 0%;height: 3px;transition: all .3s;}
#main .local .left a:hover::before{ left:0; width:100%; background:#1168ab}
#main .local .left a.active{ color:#1168ab; font-weight:700}
#main .local .left a.active::before{ left:0; width:100%; background:#1168ab}
#main .local .weizhi{ display:flex;align-items:center;}
#main .local .weizhi i.fas{ color:#e00d1c; margin-right:10px}
#main .local .weizhi span{ color:#999}
#main .local .weizhi span a{ color:#999}
#main .local .weizhi span i{ margin:0 8px}

#main .product{ padding:50px 0;display: flex;justify-content:space-between ;}
#main .product .left{ width:250px;}
#main .product .left .cate .title{ background:#1168ab; padding:10px 20px;display: flex;justify-content:space-between ;;align-items:center}
#main .product .left .cate .title .t{ font-size:18px; font-weight:700; color:#fff}
#main .product .left .cate .title .icon{ color:#fff; display:none}
#main .product .left .cate .clist{ border:1px solid #1168ab; padding:20px}
#main .product .left .cate .clist ul li{ border-bottom:1px solid #eee; padding:6px 0}
#main .product .left .cate .clist ul li h3 a{ font-size:15px}
#main .product .left .cate .clist ul li dl{ padding:10px 0}
#main .product .left .cate .clist ul li dl dd { line-height:1.8}
#main .product .left .cate .clist ul li dl dd a{ color:#666;}
#main .product .left .cate .clist ul li dl dd a:hover{ color:#1168ab;}
#main .product .left .contact{ margin-top:10px;}
#main .product .left .contact .title{ background:#1168ab; padding:10px 20px;}
#main .product .left .contact .title .t{ font-size:18px; font-weight:700; color:#fff}
#main .product .left .contact .content{ border:1px solid #1168ab; padding:20px}
#main .product .right{ width:calc(100% - 280px)}
#main .product .right .rtitle{ font-size:24px; font-weight:700; padding:10px 0; border-bottom:1px solid #eee}
#main .product .right .list{ margin-top:30px}
#main .product .right .list ul{ display:flex;justify-content:flex-start;align-items:flex-start;flex-wrap:wrap;gap:30px 30px}
#main .product .right .list ul li{ width:calc((100% - 60px) / 3)}
#main .product .right .list ul li .img{ overflow: hidden; padding:30px; border:#eee 1px solid; border-radius:6px;}
#main .product .right .list ul li .img img{ width:100%}
#main .product .right .list ul li .info{ margin-top:20px}
#main .product .right .list ul li .info .title{ font-size:16px; font-weight:700}
#main .product .right .list ul li .info .p{ color:#666; line-height:1.7; margin-top:5px}
#main .product .right .list ul li .info .p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical}


#main .product .proview{ width:calc(100% - 280px)}
#main .product .proview .p_focus{display:flex;justify-content:space-between;align-items:flex-start;}
#main .product .proview .p_focus .img{width:480px}
#main .product .proview .p_focus .img .big{border:1px solid #eee}
#main .product .proview .p_focus .img .big .swiper-container .swiper-slide{width:480px;height:480px;}
#main .product .proview .p_focus .img .big .swiper-container .swiper-slide img{width:100%}
#main .product .proview .p_focus .img .small{position:relative;margin-top:10px}
#main .product .proview .p_focus .img .small .swiper-container{margin-left:40px;width:400px}
#main .product .proview .p_focus .img .small .swiper-container .swiper-slide{width:70px;height:70px;border:1px solid #eee;margin:0 5px}
#main .product .proview .p_focus .img .small .swiper-container .swiper-slide img{width:100%}
#main .product .proview .p_focus .img .small .arrow-left{border:1px solid #eee;height:70px;width:24px;display:block;background:url(../images/feel3.png) no-repeat center center;position:absolute;left:0;top:0;z-index:10;}
#main .product .proview .p_focus .img .small .arrow-right{border:1px solid #eee;height:70px;width:24px;display:block;background:url(../images/feel4.png) no-repeat center center;position:absolute;right:0;top:0;z-index:10;}
#main .product .proview .p_focus .img .small .swiper-container .swiper-slide img{padding:2px;}
#main .product .proview .p_focus .img .small .swiper-container .swiper-slide.active-nav img{padding:0;border:2px solid #F00;}

#main .product .proview .p_focus .info{ width:calc(100% - 520px)}
#main .product .proview .p_focus .info h1{ font-size:24px; font-weight:700; border-bottom:1px solid #eee; padding:20px 0}
#main .product .proview .p_focus .info .intro{ margin-top:20px; line-height:1.7; min-height:200px}
#main .product .proview .p_focus .info .btn{ margin-top:20px; display:flex}
#main .product .proview .p_focus .info .btn a{ display:inline-block; background:#1168ab; color:#fff; border-radius:6px; padding:10px 30px; font-size:16px; margin-right:10px;}
#main .product .proview .p_focus .info .btn a:nth-child(2){ background:#1f97ba}
#main .product .proview .content{ margin-top:50px}
#main .product .proview .content .title{ font-size:24px; font-weight:700; padding-bottom:10px; border-bottom:1px solid #eee}
#main .product .proview .content .text{ margin-top:20px; line-height:2; font-size:16px}
#main .product .proview .updown{ margin-top:50px; border-top:1px solid #eee; padding-top:50px}

#main .brand{ padding:50px 0}
#main .brand ul li{padding:10px 0}
#main .brand ul li a{display: flex;justify-content:space-between;align-items:center; }
#main .brand ul li .img{ width:48%; border:1px solid #eee;display:flex;justify-content:center;align-items:center; min-height:380px; border-radius:10px}
#main .brand ul li .img img{ max-width:80%; max-height:80%; height:200px}
#main .brand ul li .text{ width:48%}
#main .brand ul li .text .title{ font-size:24px;font-weight:700}
#main .brand ul li .text .info{ line-height:1.8; margin-top:10px; font-size:16px}
#main .brand ul li:nth-child(2n) a{flex-direction:row-reverse}
#main .brand ul li:nth-child(2n) .text .title{ text-align:right}
#main .brand ul li:nth-child(2n) .text .info{ text-align:right}

#main .news{ padding:50px 0;}



#main .news ul {
    list-style: none; /* 移除默认列表样式 */
    padding: 0;
    margin: 0;
}

#main .news ul li {
    margin-bottom: 20px; /* 设置 li 之间的间距 */
}

/* 设置 a 标签为 Flex 容器 */
#main .news ul li  a {
    display: flex; /* 启用 Flexbox 布局 */
    align-items: flex-start; /* 子元素顶部对齐 */
    gap: 20px; /* 设置子元素之间的间距 */
    text-decoration: none; /* 移除链接下划线 */
    color: inherit; /* 继承父元素文字颜色 */
}

/* 设置图片容器的样式 */
#main .news ul li a .img {
    flex: 0 0 auto; /* 图片容器不伸缩，保持原始大小 */
    width: 200px; /* 默认图片容器的宽度 */
    height: 150px; /* 默认图片容器的高度 */
    overflow: hidden; /* 隐藏超出部分 */
    border-radius: 4px; /* 圆角效果 */
}

#main .news ul li a .img img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 图片填充容器并保持比例 */
}

/* 设置信息容器的样式 */
#main .news ul li a .info {
    flex: 1; /* 信息容器占据剩余空间 */
    display: flex;
    flex-direction: column; /* 垂直排列子元素 */
    gap: 10px; /* 设置子元素之间的间距 */
}

/* 设置标题样式 */
#main .news ul li a .info .title {
    font-size: 18px;
    font-weight: bold;
    margin: 0;
}

/* 设置时间样式 */
#main .news ul li a .info .time {
    font-size: 14px;
    color: #888;
    margin: 0;
}

/* 设置简介样式 */
#main .news ul li a .info .p {
    font-size: 14px;
    color: #666;
    margin: 0;
    line-height: 1.5;
}

/* 设置外部时间样式 */
#main .news ul li a .time {
    font-size: 14px;
    color: #888;
    margin: 0;
    align-self: flex-start; /* 顶部对齐 */
}

/* 响应式布局 */
@media (max-width: 768px) {
    /* 中等屏幕（平板） */
    #main .news ul li a {
        flex-direction: column; /* 改为垂直排列 */
        gap: 10px; /* 调整间距 */
    }

    #main .news ul li a .img {
        width: 100%; /* 图片容器占满宽度 */
        height: auto; /* 高度自适应 */
        aspect-ratio: 16 / 9; /* 设置图片宽高比 */
    }

    #main .news ul li a .info {
        width: 100%; /* 信息容器占满宽度 */
    }
}

@media (max-width: 480px) {
    /* 小屏幕（手机） */
    #main .news ul li a .info .title {
        font-size: 16px; /* 缩小标题字体 */
    }

    #main .news ul li a .info .p {
        font-size: 12px; /* 缩小简介字体 */
    }

   #main .news ul li a .time {
        font-size: 12px; /* 缩小时间字体 */
    }
}


#main .view{ padding:50px 0;}
#main .view .title{ border-bottom:1px solid #eee; padding-bottom:20px}
#main .view .title h1{ font-size:26px; text-align:center}
#main .view .title .info{ color:#999; text-align:center; margin-top:20px}
#main .view .title .info span{ margin:0 10px}
#main .view .content{ padding:30px 0; font-size:16px; line-height:1.6; min-height:300px}
#main .view .content img{ max-width:1000px}
#main .view .content  p{ margin-bottom:10px}
#main .view .updown{ margin-top:20px; padding-top:20px; border-top:1px solid #eee}

#main .mcontact{ width:100%; padding:50px 10%}
#main .mcontact .lxfs .stitle{ text-align:center}
#main .mcontact .lxfs .stitle h2{ font-size:34px; line-height:1}
#main .mcontact .lxfs .stitle p{ color:#666; margin-top:10px}
#main .mcontact .lxfs .box{display: flex;justify-content:space-between ;align-items:center; margin-top:30px}
#main .mcontact .lxfs .box .map{ width:45%}
#main .mcontact .lxfs .box .map iframe{ width:100%; height:400px}
#main .mcontact .lxfs .box .text{ width:45%}
#main .mcontact .lxfs .box .text .company{ font-size:30px; margin-bottom:20px;}
#main .mcontact .lxfs .box .text .content{ margin-top:8px;font-size:18px; line-height:2}
#main .mcontact .bd{ border-top:1px solid #eee; margin-top:50px; padding-top:50px}
#main .mcontact .bd .stitle{ text-align:center}
#main .mcontact .bd .stitle h2{ font-size:28px}
#main .mcontact .bd .stitle p{ color:#666; margin-top:10px}
#main .mcontact .bd .box{ margin-top:30px}
#main .mcontact .bd .one{display: flex;justify-content:space-between ;align-items:center;}
#main .mcontact .bd .one .input{ width:32%}
#main .mcontact .bd .one .input .text{  border:1px solid #ddd; line-height:50px; width:100%; text-indent:10px; font-size:16px; border-radius:4px;}
#main .mcontact .bd .textarea .text{  border:1px solid #ddd; height:150px; width:100%;margin-top:20px; padding:10px; font-size:16px; border-radius:4px;}
#main .mcontact .bd .button{ text-align:center; margin-top:30px}
#main .mcontact .bd .button .btn{ display:inline-block; background:#1168ab; border-radius:4px; padding:15px 80px; color:#fff; font-size:18px; border:0}


#main .aboutcontent{ width:100%; padding:50px 0; font-size:16px; line-height:2}
#main .aboutcontent img{ max-width:1000px}

#main .search{ padding:50px 0}
#main .search ul{ display:flex;justify-content:flex-start;align-items:flex-start;flex-wrap:wrap;gap:30px 30px}
#main .search ul li{ width:calc((100% - 60px) / 3)}
#main .search ul li .img{ overflow: hidden; padding:30px; border:#eee 1px solid; border-radius:6px;}
#main .search ul li .img img{ width:100%}
#main .search ul li .info{ margin-top:20px}
#main .search ul li .info .title{ font-size:16px; font-weight:700}
#main .search ul li .info .p{ color:#666; line-height:1.7; margin-top:5px}
#main .search ul li .info .p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;display:-webkit-box;-webkit-box-orient:vertical}

@media (max-width:800px){
	body,html{font-size:.23rem;line-height:.34rem;}	
	#main{ width:100%}
	
	#nbanner.pc{ display:none}
	#nbanner.m{ display:block}
	
	#main .local{padding:0 .3rem;display: block; border:0}
	#main .local .left{border-bottom:1px solid #eee; }
	#main .local .left a{ margin-right:.5rem; font-size:.24rem; padding:.25rem 0}
	#main .local .left a::after{height: .2rem;margin-top: -.1rem;right: -.25rem;}
	#main .local .weizhi{ display:none}
	
	#main .product{ padding:.5rem .3rem;display: block;}
	#main .product .left{ width:100%;}
	#main .product .left .cate .title{ padding:.2rem;}
	#main .product .left .cate .title .t{ font-size:.24rem;}
	#main .product .left .cate .title .icon{transform:rotate(180deg); display:block}
	#main .product .left .cate .clist{padding:.2rem; display:none}
	#main .product .left .cate .clist ul li{ padding:.1rem 0}
	#main .product .left .cate .clist ul li h3 a{ font-size:.24rem}
	#main .product .left .cate .clist ul li dl{ padding:.1rem 0}
	#main .product .left .cate .clist ul li dl dd { line-height:1.8}
	#main .product .left .cate .clist ul li dl dd a{ color:#666; font-size:.22rem}
	#main .product .left .cate.active .clist{ display:block}
	#main .product .left .cate.active .title .icon{transform:rotate(0)}
	#main .product .left .contact{ display:none}
	#main .product .right{ width:100%; margin-top:.3rem}
	#main .product .right .rtitle{ font-size:.3rem; padding:.2rem 0; }
	#main .product .right .list{ margin-top:.3rem}
	#main .product .right .list ul{gap:.3rem}
	#main .product .right .list ul li{ width:100%}
	#main .product .right .list ul li .img{padding:.3rem .5rem;}
	#main .product .right .list ul li .info{ margin-top:.2rem}
	#main .product .right .list ul li .info .title{ font-size:.26rem;}
	#main .product .right .list ul li .info .p{ margin-top:.1rem; font-size:.22rem}
	#main .product .right .list ul li .info .p{-webkit-line-clamp:20;}
	
	#main .product .view{ width:100%}
	#main .product .view .p_focus{display:block; margin-top:.2rem}
	#main .product .view .p_focus .img{width:100%}
	#main .product .view .p_focus .img .small{margin-top:.2rem}
	#main .product .view .p_focus .img .small .swiper-container{margin-left:calc((100% - 4.4rem) / 2);width:4.4rem}
	#main .product .view .p_focus .img .small .swiper-container .swiper-slide{width:1rem;height:1rem;margin:0 .05rem}
	#main .product .view .p_focus .img .small .arrow-left{height:1rem;width:.4rem;}
	#main .product .view .p_focus .img .small .arrow-right{height:1rem;width:.4rem;}
	#main .product .view .p_focus .info{ width:100%; margin-top:.5rem}
	#main .product .view .p_focus .info h1{ font-size:.3rem;  padding:.2rem 0}
	#main .product .view .p_focus .info .intro{ margin-top:.2rem; min-height:auto}
	#main .product .view .p_focus .info .btn{ margin-top:.3rem}
	#main .product .view .p_focus .info .btn a{ padding:.2rem .6rem; font-size:.24rem}
	#main .product .view .content{ margin-top:.5rem}
	#main .product .view .content .title{ font-size:.3rem;padding-bottom:.2rem;}
	#main .product .view .content .text{ margin-top:.2rem; line-height:2; font-size:.24rem}
	#main .product .view .updown{ margin-top:.5rem; border-top:1px solid #eee; padding-top:.5rem}
	
	#main .brand{ padding:.5rem .3rem}
	#main .brand ul li{display: block; padding:.2rem 0}
	#main .brand ul li .img{ width:100%; min-height:3rem;}
	#main .brand ul li .img img{ height:2rem}
	#main .brand ul li .text{ width:100%; margin-top:.3rem}
	#main .brand ul li .text .title{ font-size:.3rem;}
	#main .brand ul li .text .info{ margin-top:.2rem; font-size:.22rem}
	#main .brand ul li:nth-child(2n){flex-direction:row-reverse}
	#main .brand ul li:nth-child(2n) .text .title{ text-align:left}
	#main .brand ul li:nth-child(2n) .text .info{ text-align:left}
	

	#main .news{padding:.5rem .3rem;}
	#main .news ul{ gap:.3rem}
	#main .news ul li{ width:100%}
	#main .news ul li .img{ overflow: hidden; height: auto}
	#main .news ul li .info{ margin-top:.2rem}
	#main .news ul li .info .title{ font-size:.26rem;}
	#main .news ul li .info .title{-webkit-line-clamp:20;}	
	#main .news ul li .info .p{margin-top:.1rem; font-size:.22rem}
	#main .news ul li .info .p{-webkit-line-clamp:20;}	
	
	#main .view{ padding:.5rem .2rem}
	#main .view .title{padding-bottom:.2rem}
	#main .view .title h1{ font-size:.3rem;}
	#main .view .title .info{margin-top:.2rem; font-size:.2rem}
	#main .view .title .info span{ margin:0 .1rem}
	#main .view .content{ padding:.3rem 0; font-size:.24rem; line-height:1.8; min-height:3rem}
	#main .view .content img{ max-width:100%}
	#main .view .content  p{ margin-bottom:.1rem}
	#main .view .updown{ margin-top:.2rem; padding-top:.2rem;}
	
	#main .mcontact{padding:.5rem .3rem}
	#main .mcontact .lxfs .stitle h2{ font-size:.4rem;}
	#main .mcontact .lxfs .stitle p{ font-size:.2rem}
	#main .mcontact .lxfs .box{flex-wrap:wrap;flex-direction:column-reverse; margin-top:.3rem}
	#main .mcontact .lxfs .box .map{ width:100%; margin-top:.5rem}
	#main .mcontact .lxfs .box .map iframe{height:4rem}
	#main .mcontact .lxfs .box .text{ width:100%; margin-top:.5rem}
	#main .mcontact .lxfs .box .text .company{ font-size:.3rem; margin-bottom:.2rem;}
	#main .mcontact .lxfs .box .text .item{ margin-top:.1rem; font-size:.24rem}
	#main .mcontact .lxfs .box .text .item span{ width:1.2rem}
	#main .mcontact .bd{  margin-top:.5rem; padding-top:.5rem}
	#main .mcontact .bd .stitle h2{ font-size:.4rem}
	#main .mcontact .bd .box{ margin-top:.3rem}
	#main .mcontact .bd .one{display: block}
	#main .mcontact .bd .one .input{ width:100%; margin-top:.2rem}
	#main .mcontact .bd .one .input .text{ line-height:.7rem; font-size:.24rem;}
	#main .mcontact .bd .textarea .text{   height:2rem; margin-top:.2rem; padding:.1rem; font-size:.24rem;}
	#main .mcontact .bd .button{ margin-top:.3rem}
	#main .mcontact .bd .button .btn{ padding:.2rem 1rem; font-size:.26rem;}
	
	#main .aboutcontent{padding:.5rem .3rem; font-size:.24rem; line-height:1.8}
	#main .aboutcontent img{ max-width:100%}
}

#fenye{padding:50px 0;text-align:center;clear:both;}
#fenye table{text-align:center;margin:0 auto}
#fenye a{margin:0 2px;color:#5a5a5a;text-decoration:none;padding:10px 15px;border:1px solid #eee; background:#FFF}
#fenye .prev,#fenye .next{width:52px;text-align:center}
#fenye a.curr{font-weight:700;color:#fff;background:#1168ab;border:1px solid #1168ab}
#fenye a:hover{background:#1168ab;color:#fff;border:1px solid #1168ab}
#fenye span{margin:0 2px;color:#5a5a5a;text-decoration:none;padding:10px 15px;border:1px solid #eee;background:#FFF}
@media (max-width:800px){
	#fenye{padding:.5rem 0 0px;}
	#fenye a{margin:0 .02rem;padding:.1rem .15rem}
	#fenye .prev,#fenye .next{width:.55rem;}
	#fenye span{margin:0 .02rem;padding:.1rem .15rem}
	#fenye .num,#fenye .prev{ display:none}
}