@charset "UTF-8";
/* =========================================================
   景洪瀚焕邝商贸有限公司 全站样式  (还原参考站 demoall.5fa.cn/31415)
   主色 #ec7729 橙 | 辅色 #c3161c 深红 | 深底 #2d343f
   ========================================================= */

/* ---------- 全局重置 ---------- */
*{margin:0;padding:0;box-sizing:border-box;}
html{background:#fff;-webkit-text-size-adjust:100%;width:100%;overflow-x:hidden;}
body{font-family:"Microsoft YaHei","Cabin-Regular",Arial,sans-serif;font-size:16px;color:#333;line-height:1.6;background:#fff;}
a{text-decoration:none;color:inherit;transition:all .35s ease;outline:0;}
a:hover{color:#ec7729;}
img{border:0;max-width:100%;display:block;}
ul,ol,li{list-style:none;}
h1,h2,h3,h4,h5,h6{font-weight:normal;font-size:100%;}
input,button,textarea,select{font-family:inherit;font-size:inherit;outline:0;border:0;background:none;}
button{cursor:pointer;}
table{border-collapse:collapse;border-spacing:0;}

/* ---------- 通用容器 ---------- */
.main{width:90%;max-width:1500px;margin:0 auto;display:block;}
.main:before,.main:after{content:" ";display:table;}
.main:after{clear:both;}
.clearfix:before,.clearfix:after{content:" ";display:table;}
.clearfix:after{clear:both;}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar{width:9px;background:#fff;}
::-webkit-scrollbar-thumb{border:2px solid #fff;border-radius:4px;background:#373c41;}
::selection{background:#ec7729;color:#fff;}

/* ---------- 图片404兜底 ---------- */
.img-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:200px;color:#fff;font-size:14px;text-align:center;padding:10px;}

/* ---------- 通用淡入动画 ---------- */
.fadeUp{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform .9s ease;}
.fadeUp.show{opacity:1;transform:translateY(0);}

/* =========================================================
   一、顶部 topbox (固定头部：logo + 导航 menubox + 电话)
   ========================================================= */
.topbox{position:fixed;top:0;left:0;width:100%;height:90px;z-index:999;background:rgba(0,0,0,.25);
  border-bottom:1px solid rgba(255,255,255,0);transition:all .5s ease;display:flex;align-items:center;}
.topbox.scroll{background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.1);}
.topbox .inner{width:92%;max-width:1600px;margin:0 auto;display:flex;align-items:center;}

/* logo 区 lotbox */
.lotbox{width:20%;display:flex;align-items:center;}
.lotbox .logo{display:flex;align-items:center;gap:10px;}
.lotbox .logo .logo-ico{width:46px;height:46px;flex-shrink:0;}
.lotbox .logo .logo-ico svg{width:100%;height:100%;display:block;}
.lotbox .logo .logo-txt{line-height:1.1;}
.lotbox .logo .logo-txt .b1{font-size:22px;font-weight:bold;color:#fff;letter-spacing:1px;transition:color .5s;}
.lotbox .logo .logo-txt .b2{font-size:12px;color:rgba(255,255,255,.85);letter-spacing:3px;margin-top:4px;transition:color .5s;}
.topbox.scroll .lotbox .logo .logo-txt .b1{color:#333;}
.topbox.scroll .lotbox .logo .logo-txt .b2{color:#999;}

/* 导航 menubox */
.menubox{width:62%;display:flex;justify-content:flex-end;align-items:center;padding-right:1%;}
.menubox .nav-ul{display:flex;align-items:center;width:100%;justify-content:flex-end;}
.menubox .nav-li{position:relative;margin:0 .6vw;}
.menubox .nav-li>a{position:relative;display:block;line-height:90px;font-size:16px;color:#fff;text-align:center;padding:0 6px;transition:color .5s;}
.topbox.scroll .menubox .nav-li>a{color:#333;}
.menubox .nav-li>a:before{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:0;height:3px;background:#ec7729;transition:all .5s;}
.menubox .nav-li:hover>a:before,.menubox .nav-li.active>a:before{width:100%;opacity:1;}
.menubox .nav-li.active>a,.menubox .nav-li:hover>a{color:#ec7729;}

/* 下拉子菜单 */
.menubox .sub-box{position:absolute;left:-50%;right:0;width:200%;opacity:0;visibility:hidden;z-index:110;padding:6px 0;transform:translate3d(0,18px,0);transition:all .5s ease;background:rgba(236,119,41,.88);box-shadow:0 4px 10px rgba(0,0,0,.08);}
.menubox .nav-li:hover .sub-box{opacity:1;visibility:visible;transform:translate3d(0,0,0);}
.menubox .sub-box a{display:block;text-align:center;height:38px;line-height:38px;color:#fff;font-size:14px;}
.menubox .sub-box a:hover{background:rgba(0,0,0,.12);}

/* 顶栏电话 */
.topbar-tel{width:18%;display:flex;justify-content:flex-end;align-items:center;}
.topbar-tel a{display:flex;align-items:center;gap:6px;color:#fff;font-size:18px;font-family:Arial;}
.topbox.scroll .topbar-tel a{color:#ec7729;}
.topbar-tel a svg{width:20px;height:20px;}

/* 移动端汉堡按钮 */
.nav-btn{display:none;position:absolute;top:18px;right:18px;width:40px;height:40px;background:#ec7729;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:5px;z-index:20;}
.nav-btn span{display:block;width:60%;height:2px;background:#fff;border-radius:1px;transition:all .4s;}
.nav-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-btn.open span:nth-child(2){opacity:0;}
.nav-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* =========================================================
   二、Banner 全屏轮播 (圆点 + 圆形进度动画)
   ========================================================= */
.banner{position:relative;overflow:hidden;}
.banner .swiper-wrap{position:relative;width:100%;overflow:hidden;}
.banner .slide{display:none;position:relative;width:100%;}
.banner .slide.active{display:block;}
.banner .slide .banner-pic{display:block;width:100%;height:100vh;max-height:820px;object-fit:cover;}
.banner .slide .banner-mask{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.32);z-index:2;}
.banner .slide .banner-text{position:absolute;left:8.33%;top:50%;transform:translateY(-50%);color:#fff;z-index:3;max-width:680px;}
.banner .slide .banner-text .bt-en{font-size:18px;letter-spacing:4px;opacity:.85;text-transform:uppercase;}
.banner .slide .banner-text .bt-cn{font-size:54px;font-weight:bold;line-height:1.25;margin:14px 0 22px;text-shadow:0 2px 12px rgba(0,0,0,.4);}
.banner .slide .banner-text .bt-desc{font-size:18px;line-height:1.8;max-width:560px;opacity:.95;}
.banner .slide .banner-text .bt-btn{display:inline-block;margin-top:30px;padding:13px 38px;border:1px solid #fff;color:#fff;font-size:15px;letter-spacing:2px;}
.banner .slide .banner-text .bt-btn:hover{background:#ec7729;border-color:#ec7729;}

/* 圆点分页 + 圆形进度 */
.banner .page-dots{position:absolute;left:0;bottom:5%;width:100%;text-align:center;z-index:5;font-size:0;}
.banner .page-dots .dot{display:inline-block;vertical-align:middle;position:relative;width:12px;height:12px;margin:0 14px;border-radius:50%;background:rgba(255,255,255,.55);cursor:pointer;}
.banner .page-dots .dot.active{width:42px;height:42px;background:transparent;border:2px solid rgba(255,255,255,.45);}
.banner .page-dots .dot.active .ring-r{display:block;}
.banner .page-dots .dot.active .ring-l{display:block;}
.banner .page-dots .dot .ring{position:absolute;top:0;width:42px;height:42px;border:2px solid transparent;border-radius:50%;box-sizing:border-box;display:none;}
.banner .page-dots .dot .ring-r{right:0;border-bottom:2px solid #fff;border-left:2px solid #fff;transform:rotate(-135deg);animation:ringR 6.5s linear infinite;}
.banner .page-dots .dot .ring-l{left:0;border-top:2px solid #fff;border-right:2px solid #fff;transform:rotate(-135deg);animation:ringL 6.5s linear infinite;}
@keyframes ringR{0%{transform:rotate(-135deg);}50%,100%{transform:rotate(45deg);}}
@keyframes ringL{0%,50%{transform:rotate(-135deg);}100%{transform:rotate(45deg);}}

/* =========================================================
   三、通用标题 in-tit / 更多按钮 in-more
   ========================================================= */
.in-tit{max-width:60%;}
.in-tit h3{color:#ec7729;font-size:46px;font-weight:bold;line-height:1.2;}
.in-tit h3.white{color:#fff;}
.in-tit .bar{display:block;width:42px;height:3px;margin:14px 0;background:#c3161c;}
.in-tit .bar.white{background:#fff;}
.in-tit p{color:#666;font-size:16px;line-height:1.7;padding-top:8px;padding-bottom:26px;}
.in-tit p.white{color:#fff;opacity:.9;}

.in-more{position:relative;max-width:180px;text-align:center;overflow:hidden;z-index:1;}
.in-more a{position:relative;z-index:3;display:block;color:#fff;font-size:14px;line-height:46px;padding:0 24px;transition:color .5s;}
.in-more:after{content:'';position:absolute;left:0;bottom:0;width:100%;height:100%;background:#ec7729;z-index:2;transition:transform .5s ease;}
.in-more:hover:after{transform:translateY(-100%);}
.in-more:hover a{color:#1b242b;}
.in-more.white:hover a{color:#fff;}
.in-more.white:hover:after{background:rgba(255,255,255,.15);}

/* =========================================================
   四、产品分类 in-class (3列 大图+橙遮罩+图标+文字)
   ========================================================= */
.in-class{padding:5rem 0;}
.in-class .cls-head{margin-bottom:40px;}
.in-class ul{display:flex;flex-wrap:wrap;}
.in-class li{width:calc(100%/3 - 2%);margin-right:3%;position:relative;}
.in-class li:nth-child(3n){margin-right:0;}
.in-class li .imgbox{position:relative;width:100%;min-height:440px;overflow:hidden;}
.in-class li .imgbox>img{width:100%;height:440px;object-fit:cover;transition:transform 1.5s ease;}
.in-class li:hover .imgbox>img{transform:scale(1.06);}
.in-class li .contentbox{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;background:rgba(236,119,41,.72);transition:background .5s;}
.in-class li:hover .contentbox{background:rgba(27,36,43,.55);}
.in-class li .gridbox{width:100%;padding:5%;}
.in-class li .ico{width:50px;height:50px;margin-bottom:18px;}
.in-class li .ico svg{width:100%;height:100%;fill:#fff;transition:transform 1s;}
.in-class li:hover .ico svg{transform:rotateY(360deg);}
.in-class li .txt h3{color:#fff;font-size:24px;line-height:1.5;}
.in-class li .txt p{color:#fff;font-size:14px;line-height:1.8;margin-top:14px;opacity:.85;}
.in-class li .cls-btn{position:relative;margin-top:34px;padding-top:20px;border-top:2px solid rgba(255,255,255,.2);}
.in-class li .cls-btn:after{content:'';position:absolute;left:0;top:-2px;width:16%;height:2px;background:#fff;transition:width .8s;}
.in-class li:hover .cls-btn:after{width:100%;}
.in-class li .cls-btn a{color:#fff;font-size:14px;display:flex;align-items:center;gap:6px;}

/* =========================================================
   五、产品展示 in-pro (固定背景 + 横向轮播)
   ========================================================= */
.in-pro{padding:5rem 0;background:url('https://images.unsplash.com/photo-1618724980108-a4d3856fd8f5?w=1920&h=900&fit=crop&auto=format&q=80') center center/cover fixed;}
.in-pro .pro-head{display:flex;align-items:flex-end;margin-bottom:36px;}
.in-pro .pro-head .in-tit{width:74%;}
.in-pro .pro-head .more{width:26%;display:flex;justify-content:flex-end;}
.in-pro .pro-head .in-more{background:#1b242b;}
.in-pro .carousel{position:relative;overflow:hidden;padding:10px 0 50px;}
.in-pro .track{display:flex;transition:transform .6s ease;}
.in-pro .track>li{flex:0 0 calc(100%/4);padding:0 10px;box-sizing:border-box;}
.in-pro .card{background:#fff;padding:8px;box-sizing:border-box;}
.in-pro .card .img{position:relative;width:100%;padding-bottom:100%;overflow:hidden;background:#f5f5f5;}
.in-pro .card .img img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1);width:100%;height:auto;transition:transform .5s ease;}
.in-pro .card:hover .img img{transform:translate(-50%,-50%) scale(1.1);}
.in-pro .card h3{color:#333;font-size:17px;line-height:2;text-align:center;margin:8px 0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .5s;}
.in-pro .card:hover h3{color:#ec7729;}
.in-pro .pro-dots{position:absolute;left:0;bottom:0;width:100%;text-align:center;font-size:0;}
.in-pro .pro-dots span{display:inline-block;width:10px;height:10px;margin:0 5px;border-radius:50%;background:#d2d5d9;cursor:pointer;transition:all .5s;}
.in-pro .pro-dots span.active{background:#ec7729;width:24px;border-radius:5px;}

/* =========================================================
   六、关于我们 in-about (左文 + 右2特性卡)
   ========================================================= */
.in-about{padding:5rem 0;}
.in-about .box{display:flex;align-items:center;}
.in-about .fl{width:49%;}
.in-about .fl .txt{color:#666;font-size:16px;line-height:1.85;margin:18px 0 28px;}
.in-about .fr{width:49%;margin-left:2%;}
.in-about .fr li{display:flex;align-items:center;margin:12px 0;background:#f3f3f3;transition:background .5s;}
.in-about .fr li .ic{width:19%;display:flex;justify-content:center;color:#ec7729;}
.in-about .fr li .ic .icw{max-width:64px;}
.in-about .fr li .ic svg{width:100%;height:100%;fill:currentColor;}
.in-about .fr li:hover .ic{color:#fff;}
.in-about .fr li .tx{width:81%;padding:24px 14px;}
.in-about .fr li .tx h3{color:#ec7729;font-size:20px;margin-bottom:8px;transition:color .5s;}
.in-about .fr li .tx p{color:#666;font-size:14px;line-height:1.6;transition:color .5s;}
.in-about .fr li:hover{background:#ec7729;}
.in-about .fr li:hover .tx h3,.in-about .fr li:hover .tx p{color:#fff;}

/* =========================================================
   七、厂房展示 in-quality (左图轮播+标题遮罩 右文+图, 橙底固定)
   ========================================================= */
.in-quality{padding:5rem 0;background:url('https://images.unsplash.com/photo-1740803292374-1b167c1558b1?w=1920&h=900&fit=crop&auto=format&q=80') center center/cover fixed;}
.in-quality .box{display:flex;align-items:center;background:rgba(236,119,41,.82);}
.in-quality .fl{position:relative;width:48.5%;}
.in-quality .fl .qcarousel{position:relative;width:100%;overflow:hidden;}
.in-quality .fl .qslide{display:none;position:relative;width:100%;padding-bottom:67.5%;overflow:hidden;}
.in-quality .fl .qslide.active{display:block;}
.in-quality .fl .qslide img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;}
.in-quality .fl .qslide .qtt{position:absolute;left:3%;top:0;width:94%;}
.in-quality .fl .qslide .qtt h3{color:#fff;font-size:24px;line-height:40px;padding:18px 0;text-shadow:1px 1px 5px #000;}
.in-quality .qdots{position:absolute;left:0;bottom:14px;width:100%;text-align:center;font-size:0;z-index:3;}
.in-quality .qdots span{display:inline-block;width:10px;height:10px;margin:0 5px;border-radius:50%;border:2px solid #fff;background:transparent;cursor:pointer;}
.in-quality .qdots span.active{background:#fff;}
.in-quality .fr{width:48.5%;margin-left:3%;}
.in-quality .fr .fr-inner{padding-right:5%;}
.in-quality .fr .txt{color:#fff;font-size:16px;line-height:1.85;margin:18px 0;}
.in-quality .fr .qimg{max-width:560px;margin-bottom:24px;}
.in-quality .fr .qimg img{width:100%;}

/* =========================================================
   八、新闻动态 in-news (3列 列表)
   ========================================================= */
.in-news{padding:5rem 0;}
.in-news .nhead{display:flex;align-items:flex-end;margin-bottom:30px;}
.in-news .nhead .in-tit{width:74%;}
.in-news .nhead .more{width:26%;display:flex;justify-content:flex-end;}
.in-news .nhead .in-more{background:#1b242b;}
.news-list{display:flex;flex-wrap:wrap;}
.news-list>li{flex-basis:30%;margin-right:5%;margin-top:24px;}
.news-list>li:nth-child(3n){margin-right:0;}
.news-list li .box{padding:0;}
.news-list li .lin{position:relative;width:100%;height:1px;background:#ededed;margin-bottom:22px;}
.news-list li .lin:before{content:'';position:absolute;left:0;top:0;width:0;height:100%;background:#ec7729;transition:width .5s;}
.news-list li:hover .lin:before{width:100%;}
.news-list li .time{font-size:14px;color:#777;margin-bottom:14px;letter-spacing:.5px;}
.news-list li .title{font-size:19px;font-weight:bold;color:#373c41;line-height:1.3;min-height:48px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .5s;}
.news-list li:hover .title{color:#ec7729;}
.news-list li .txt{font-size:15px;color:#777;line-height:1.55;margin:16px 0 22px;min-height:66px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.news-list li .more-btn{font-size:13px;font-weight:bold;color:#777;letter-spacing:.5px;text-transform:uppercase;display:inline-flex;align-items:center;gap:8px;transition:color .5s;}
.news-list li:hover .more-btn{color:#ec7729;}

/* =========================================================
   九、友情链接 friend-link
   ========================================================= */
.friend-link{background:#f5f5f5;padding:22px 0;border-top:1px solid #eee;}
.friend-link .main{display:flex;align-items:center;flex-wrap:wrap;}
.friend-link .lab{color:#333;font-weight:bold;margin-right:18px;font-size:15px;}
.friend-link .lk{display:flex;flex-wrap:wrap;}
.friend-link .lk a{color:#777;font-size:14px;margin-right:22px;line-height:28px;}
.friend-link .lk a:hover{color:#ec7729;}

/* =========================================================
   十、页脚 footer
   ========================================================= */
footer{background:#2d343f;padding:2.6rem 0 2rem;}
footer .f_top{border-bottom:1px solid rgba(255,255,255,.2);display:flex;align-items:center;flex-wrap:wrap;}
footer .f_logo{width:20%;}
footer .f_logo .box{max-width:200px;margin:18px 0;display:flex;align-items:center;gap:10px;}
footer .f_logo .logo-ico{width:46px;height:46px;}
footer .f_logo .logo-ico svg{width:100%;height:100%;}
footer .f_logo .b1{font-size:18px;font-weight:bold;color:#fff;line-height:1.2;}
footer .f_logo .b2{font-size:11px;color:rgba(255,255,255,.6);letter-spacing:2px;margin-top:3px;}
footer .f_nav{width:80%;}
footer .f_nav ul{margin:18px 0;display:flex;flex-wrap:wrap;justify-content:flex-end;}
footer .f_nav li{margin-left:2%;}
footer .f_nav li a{display:block;color:#fff;font-size:17px;line-height:30px;}
footer .f_nav li a:hover{color:#ec7729;}
footer .f_bottom{margin-top:34px;display:flex;flex-wrap:wrap;}
footer .f_fl{width:58.45%;}
footer .f_fl .lianxi{color:#fff;font-size:16px;line-height:1.9;margin-bottom:22px;max-width:650px;}
footer .f_fl .lianxi a{color:#fff;}
footer .f_fl .lianxi a:hover{color:#ec7729;}
footer .f_fl .lianxi p{margin-bottom:6px;}
footer .f_fl .lianxi .ico-inline{display:inline-flex;align-items:center;gap:6px;}
footer .f_fl .lianxi svg{width:16px;height:16px;fill:#ec7729;vertical-align:middle;}
footer .f_fr{width:38.55%;margin-left:3%;text-align:right;}
footer .f_fr h3{color:#fff;font-size:22px;margin-bottom:18px;}
footer .f_fr .qr{display:inline-block;}
footer .f_fr .qr img{width:120px;height:120px;background:#fff;padding:6px;box-sizing:border-box;}
footer .f_fr .qr-txt{color:rgba(255,255,255,.85);font-size:13px;margin-top:8px;}
footer .copyright{color:rgba(255,255,255,.8);font-size:13px;line-height:2;margin-top:18px;}
footer .copyright a{color:rgba(255,255,255,.8);}
footer .copyright a:hover{color:#ec7729;}

/* =========================================================
   十一、右侧悬浮 right-bar
   ========================================================= */
.right-bar{position:fixed;top:50%;right:0;transform:translateY(-50%);z-index:50;display:flex;flex-direction:column;}
.right-bar li{position:relative;}
.right-bar li a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;background:#ec7729;opacity:.85;color:#fff;font-size:12px;margin-bottom:2px;gap:4px;flex-direction:column;}
.right-bar li a:hover{opacity:1;background:#c3161c;}
.right-bar li a svg{width:22px;height:22px;fill:#fff;}
.right-bar .rb-qr{display:none;position:absolute;right:60px;top:0;background:#fff;padding:6px;}
.right-bar .rb-qr img{width:140px;height:140px;}
.right-bar li:hover .rb-qr{display:block;}

/* =========================================================
   十二、内页 banner small-banner
   ========================================================= */
.small-banner{position:relative;height:46vh;min-height:300px;max-height:520px;overflow:hidden;margin-top:0;}
.small-banner .pic{position:absolute;inset:0;background-size:cover;background-position:center;}
.small-banner .pic img{width:100%;height:100%;object-fit:cover;}
.small-banner .mask-bg{position:absolute;inset:0;background:rgba(0,0,0,.4);}
.small-banner .mask{position:absolute;width:80%;left:10%;bottom:80px;color:#fff;z-index:4;}
.small-banner .mask .a1{font-size:46px;font-weight:bold;text-align:left;line-height:1.2;text-shadow:0 2px 10px rgba(0,0,0,.5);}
.small-banner .mask .a2{height:1px;width:120px;background:rgba(255,255,255,.55);margin:22px 0 16px;}

/* =========================================================
   十三、面包屑 location (tabs ny-class + 位置 weizhi)
   ========================================================= */
.location{width:100%;background:#f5f5f5;}
.location .main{width:90%;display:flex;align-items:center;}
.ny-class{position:relative;width:70.34%;z-index:9;}
.ny-class ul{display:flex;flex-wrap:nowrap;}
.ny-class li a{position:relative;font-size:17px;height:78px;line-height:78px;padding:0 30px;color:#333;font-weight:bold;display:block;transition:.3s;}
.ny-class li a:before{content:'';position:absolute;left:50%;bottom:0;width:0;height:3px;background:none;transition:all .3s;}
.ny-class li a:after{content:'';position:absolute;right:0;top:50%;margin-top:-7px;width:1px;height:15px;background:#ccc;}
.ny-class li:last-child a:after{display:none;}
.ny-class li a:hover,.ny-class li a.cur{color:#ec7729;}
.ny-class li a:hover:before,.ny-class li a.cur:before{width:80%;left:10%;background:#ec7729;}
.weizhi{width:29.66%;text-align:right;padding-right:20px;color:#555;line-height:30px;}
.weizhi span{position:relative;padding-left:22px;}
.weizhi span:before{content:'\25C8';position:absolute;left:0;top:0;color:#ec7729;font-size:16px;}
.weizhi a{color:#555;}
.weizhi a:hover{color:#ec7729;}

/* =========================================================
   十四、列表页通用 img-list (4列 网格)
   ========================================================= */
.img-list-box{margin:3.5rem 0;}
.img-list{display:flex;flex-wrap:wrap;}
.img-list li{width:calc(100%/4 - 2%);margin-right:2.6%;margin-bottom:2.6%;padding:10px;background:#f6f6f6;transition:box-shadow .3s;}
.img-list li:nth-child(4n){margin-right:0;}
.img-list li:hover{box-shadow:0 6px 18px rgba(0,0,0,.12);}
.img-list li .img{position:relative;width:100%;padding-bottom:67.5%;overflow:hidden;}
.img-list li .img img{position:absolute;width:100%;height:100%;top:0;left:0;object-fit:cover;transition:transform .5s;}
.img-list li:hover .img img{transform:scale(1.1);}
.img-list li h3{color:#666;font-size:16px;text-align:center;padding:3% 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .3s;}
.img-list li:hover h3{color:#ec7729;}

/* =========================================================
   十五、产品列表/详情 pro-box (左侧栏 + 右侧)
   ========================================================= */
.pro-box{padding:3.5rem 0;background:#f2f2f2;}
.pro-box .main{display:flex;}
.pro-box .pro-fl{width:300px;flex-shrink:0;}
.pro-box .pro-class{background:#fff;}
.pro-box .pro-class .cls-tit{color:#fff;font-size:24px;font-weight:bold;line-height:74px;padding:0 18px;background:linear-gradient(135deg,#ec7729,#c3161c);}
.pro-box .pro-class .cls-list{padding:10px 18px;}
.pro-box .pro-class .cls-list li a{display:block;padding:14px 6px;border-bottom:1px solid #f0f0f0;color:#333;font-size:15px;transition:all .3s;}
.pro-box .pro-class .cls-list li:last-child a{border-bottom:none;}
.pro-box .pro-class .cls-list li a:hover,.pro-box .pro-class .cls-list li a.cur{color:#ec7729;padding-left:14px;}
.pro-box .pro-lx{margin:18px 0;background:#fff;padding:18px;}
.pro-box .pro-lx .lx-tit{color:#ec7729;font-size:18px;font-weight:bold;margin-bottom:10px;}
.pro-box .pro-lx p{color:#777;font-size:14px;line-height:1.9;}
.pro-box .pro-lx .tel{color:#c3161c;font-size:22px;font-weight:bold;font-family:Arial;margin:8px 0;}

.pro-box .pro-fr{width:calc(100% - 340px);margin-left:40px;background:#fff;padding:24px;box-sizing:border-box;}
.pro-box .list-box .lb-tit{color:#333;font-size:26px;line-height:50px;border-bottom:1px solid #f0f0f0;}
.pro-box .list-box .lb-list{display:flex;flex-wrap:wrap;padding-top:20px;}
.pro-box .list-box .lb-list li{width:calc(100%/3);padding:10px;box-sizing:border-box;}
.pro-box .list-box .lb-list li .img{position:relative;overflow:hidden;width:100%;padding-bottom:100%;border:1px solid #ddd;border-bottom:0;}
.pro-box .list-box .lb-list li .img img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;transition:transform .5s;}
.pro-box .list-box .lb-list li .show-box{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;background:rgba(236,119,41,.78);transition:opacity .5s;display:flex;align-items:center;justify-content:center;}
.pro-box .list-box .lb-list li .show-box span{color:#fff;font-size:14px;padding:8px 0;border-top:1px solid #fff;border-bottom:1px solid #fff;width:60%;text-align:center;}
.pro-box .list-box .lb-list li .tit{padding:14px;border:1px solid #ddd;border-top:0;}
.pro-box .list-box .lb-list li .tit h3{color:#333;font-size:15px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .3s;}
.pro-box .list-box .lb-list li:hover .img img{transform:translate(-50%,-50%) scale(1.1);}
.pro-box .list-box .lb-list li:hover .show-box{opacity:1;}
.pro-box .list-box .lb-list li:hover .tit h3{color:#ec7729;}

/* 产品详情 */
.pro-show{display:flex;flex-wrap:wrap;padding:10px 0;}
.pro-show .gallery{width:42%;max-width:480px;}
.pro-show .gallery .gmain{position:relative;width:100%;padding-bottom:100%;overflow:hidden;border:1px solid #eee;}
.pro-show .gallery .gmain img{position:absolute;width:100%;height:100%;top:0;left:0;object-fit:cover;}
.pro-show .gallery .gthumbs{display:flex;gap:8px;margin-top:12px;}
.pro-show .gallery .gthumbs .gthumb{flex:0 0 calc(25% - 6px);position:relative;padding-bottom:calc(25% - 6px);overflow:hidden;border:2px solid #eee;cursor:pointer;transition:border-color .3s;}
.pro-show .gallery .gthumbs .gthumb.active{border-color:#ec7729;}
.pro-show .gallery .gthumbs .gthumb img{position:absolute;width:100%;height:100%;top:0;left:0;object-fit:cover;}
.pro-show .info{width:54%;margin-left:4%;padding-top:6px;}
.pro-show .info h3{color:#262626;font-size:30px;font-weight:bold;line-height:1.3;}
.pro-show .info .info-line{width:50px;height:3px;background:#ec7729;margin:14px 0;}
.pro-show .info .desc{font-size:15px;color:#666;line-height:1.9;padding-bottom:18px;border-bottom:1px solid #f0f0f0;}
.pro-show .info .params{margin:20px 0;}
.pro-show .info .params table{width:100%;font-size:14px;}
.pro-show .info .params td{padding:9px 8px;border-bottom:1px dashed #eee;}
.pro-show .info .params td.k{color:#999;width:32%;background:#fafafa;}
.pro-show .info .params td.v{color:#333;}
.pro-show .info .actions{display:flex;gap:14px;align-items:center;margin-top:18px;}
.pro-show .info .actions a.btn-buy{display:inline-block;padding:11px 32px;background:#ec7729;color:#fff;font-size:14px;}
.pro-show .info .actions a.btn-buy:hover{background:#c3161c;}
.pro-show .info .actions .tel{font-size:14px;color:#707070;display:flex;align-items:center;gap:6px;}
.pro-show .info .actions .tel b{color:#ec7729;font-size:20px;font-family:Arial;}

/* 产品详情正文 */
.pro-content{margin-top:30px;}
.pro-content .ctit{background:#f5f5f5;border-bottom:4px solid #ec7729;height:60px;line-height:60px;font-size:22px;font-weight:bold;color:#333;padding:0 18px;}
.pro-content .cbody{padding:22px 6px;}
.pro-content .cbody p{color:#666;font-size:16px;line-height:1.9;padding-bottom:14px;}
.pro-content .cbody h4{font-size:18px;color:#ec7729;font-weight:bold;margin:18px 0 10px;}
.pro-content .cbody img{max-width:100%;margin:14px auto;}
.pro-content .feature-list{display:flex;flex-wrap:wrap;gap:16px;margin:10px 0;}
.pro-content .feature-list .fl-item{flex:1;min-width:200px;background:#fafafa;padding:20px;border-left:3px solid #ec7729;}
.pro-content .feature-list .fl-item .fic{width:40px;height:40px;margin-bottom:10px;}
.pro-content .feature-list .fl-item .fic svg{width:100%;height:100%;fill:#ec7729;}
.pro-content .feature-list .fl-item h5{font-size:16px;font-weight:bold;color:#333;margin-bottom:6px;}
.pro-content .feature-list .fl-item p{font-size:13px;color:#888;padding:0;}

/* 相关推荐 */
.pro-rel{margin-top:26px;}
.pro-rel .rtit{background:#ededed;height:54px;line-height:54px;font-size:18px;font-weight:bold;color:#000;padding:0 16px;}
.pro-rel ul{display:flex;flex-wrap:wrap;border:1px solid #f0f0f0;padding:18px;}
.pro-rel li{width:calc(100%/4);padding:8px;box-sizing:border-box;}
.pro-rel li .img{position:relative;width:100%;padding-bottom:100%;overflow:hidden;}
.pro-rel li .img img{position:absolute;width:100%;height:100%;top:0;left:0;object-fit:cover;transition:transform .5s;}
.pro-rel li:hover .img img{transform:scale(1.1);}
.pro-rel li h3{font-size:14px;text-align:center;line-height:2.4;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .3s;}
.pro-rel li:hover h3{color:#ec7729;}

/* 上下篇 reLink */
.re-link{display:flex;margin:24px 0;padding-bottom:20px;border-bottom:1px solid #d9d9d9;}
.re-link .prev,.re-link .next{width:50%;color:#595959;line-height:1.6;}
.re-link .next{text-align:right;}
.re-link a{color:#595959;}
.re-link a:hover{color:#ec7729;}

/* =========================================================
   十六、文章详情 nr-page
   ========================================================= */
.nr-page{margin:3.5rem 0;background:#fff;}
.nr-page .title{max-width:86%;font-size:30px;font-weight:bold;color:#373c41;text-align:center;margin:0 auto;line-height:1.4;}
.nr-page .status{color:#595959;font-size:14px;text-align:center;padding-bottom:18px;margin-top:18px;border-bottom:1px solid #d9d9d9;}
.nr-page .status span{margin-right:20px;}
.nr-page .status .cat{color:#fff;background:#ec7729;padding:2px 12px;border-radius:3px;font-size:12px;}
.nr-page .content{padding:24px 0;text-align:justify;}
.nr-page .content p{font-size:16px;color:#666;padding-bottom:15px;line-height:1.9;}
.nr-page .content h4{font-size:20px;color:#ec7729;font-weight:bold;margin:20px 0 12px;}
.nr-page .content img{max-width:100%;height:auto;margin:14px auto;display:block;}
.nr-page .content .quote{background:#f6f6f6;border-left:4px solid #ec7729;padding:16px 20px;margin:18px 0;color:#666;font-size:15px;}

/* =========================================================
   十七、联系我们 contact
   ========================================================= */
.contact-box{margin:3.5rem 0;}
.contact-box .box{display:flex;justify-content:space-between;}
.contact-box .lianxi{width:39%;color:#fff;padding:46px 36px;background:linear-gradient(135deg,#ec7729,#c3161c);box-sizing:border-box;}
.contact-box .lianxi h3{font-size:26px;line-height:1.2;}
.contact-box .lianxi .cl-bar{display:inline-block;width:60px;height:2px;margin:22px 0;background:#fff;}
.contact-box .lianxi p{font-size:15px;line-height:2;display:flex;align-items:flex-start;gap:10px;}
.contact-box .lianxi p svg{width:18px;height:18px;fill:#fff;flex-shrink:0;margin-top:6px;}
.contact-box .lianxi p b{font-weight:normal;}
.contact-box .lianxi p a{color:#fff;}
.contact-box .map{width:60.95%;min-height:380px;position:relative;overflow:hidden;background-color:#e9eef2;}
/* 模拟地图：街区网格 */
.contact-box .map .map-grid{position:absolute;inset:0;
  background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);
  background-size:44px 44px;opacity:.75;}
/* 主干道 */
.contact-box .map .map-grid:before,.contact-box .map .map-grid:after{content:'';position:absolute;background:#d7dee5;}
.contact-box .map .map-grid:before{left:-10%;top:44%;width:120%;height:14px;transform:rotate(-7deg);}
.contact-box .map .map-grid:after{left:58%;top:-10%;width:14px;height:120%;transform:rotate(9deg);}
/* 河流/绿地点缀 */
.contact-box .map .map-grid span.river{position:absolute;left:-5%;bottom:18%;width:70%;height:30px;background:#cfe3f0;border-radius:30px;transform:rotate(-12deg);}
.contact-box .map .map-grid span.park{position:absolute;right:8%;top:14%;width:90px;height:64px;background:#d6ead8;border-radius:8px;}
/* 定位点脉冲 */
.contact-box .map .map-dot{position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:rgba(236,119,41,.35);z-index:2;}
.contact-box .map .map-dot:after{content:'';position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(236,119,41,.35);animation:mapPulse 2s ease-out infinite;}
@keyframes mapPulse{0%{transform:scale(.6);opacity:.9;}100%{transform:scale(2.4);opacity:0;}}
/* 定位图钉 */
.contact-box .map .map-pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);width:44px;height:44px;color:#ec7729;filter:drop-shadow(0 4px 6px rgba(0,0,0,.28));z-index:3;}
.contact-box .map .map-pin svg{width:100%;height:100%;fill:#ec7729;}
/* 地址标签 */
.contact-box .map .map-label{position:absolute;left:50%;top:50%;transform:translate(-50%,18px);background:#fff;padding:11px 18px;border-radius:6px;box-shadow:0 8px 20px rgba(0,0,0,.16);text-align:center;max-width:82%;z-index:3;}
.contact-box .map .map-label strong{display:block;color:#333;font-size:15px;}
.contact-box .map .map-label span{display:block;color:#888;font-size:12px;margin-top:4px;line-height:1.5;}

/* 留言表单 message */
.message{padding:3.5rem 0;background:#f5f5f5;}
.message .mtit{text-align:center;margin-bottom:26px;}
.message .mtit h3{color:#333;font-size:32px;font-weight:bold;}
.message .mtit p{color:#787878;font-size:15px;line-height:1.6;padding:6px 0;}
.inner-form{display:flex;flex-wrap:wrap;max-width:900px;margin:0 auto;}
.inner-form .f-item{float:left;width:31%;margin:0 2% 16px 0;}
.inner-form .f-item.full{width:100%;margin-right:0;}
.inner-form input,.inner-form textarea{width:100%;border:1px solid #ccc;border-radius:4px;padding:11px 14px;font-size:14px;background:#fff;box-shadow:inset 0 1px 2px rgba(0,0,0,.05);box-sizing:border-box;transition:border-color .3s;}
.inner-form textarea{min-height:140px;resize:none;}
.inner-form input:focus,.inner-form textarea:focus{border-color:#ec7729;}
.inner-form .btn{width:100%;text-align:center;margin-top:6px;}
.inner-form .btn button{width:100%;max-width:300px;padding:13px;font-size:16px;color:#fff;background:#ec7729;text-transform:uppercase;letter-spacing:2px;transition:background .3s;}
.inner-form .btn button:hover{background:#c3161c;}

/* =========================================================
   十八、关于我们 about 专用
   ========================================================= */
.about-intro{padding:3.5rem 0;}
.about-intro .box{display:flex;align-items:center;gap:40px;}
.about-intro .fl{width:46%;}
.about-intro .fl img{width:100%;}
.about-intro .fr{width:54%;}
.about-intro .fr h3{font-size:26px;color:#ec7729;font-weight:bold;margin-bottom:14px;}
.about-intro .fr p{color:#666;font-size:15px;line-height:1.95;margin-bottom:14px;}
.about-intro .fr .stats{display:flex;flex-wrap:wrap;margin-top:22px;}
.about-intro .fr .stats .st{flex:1;min-width:110px;text-align:center;border-right:1px solid #eee;}
.about-intro .fr .stats .st:last-child{border-right:none;}
.about-intro .fr .stats .st b{display:block;color:#ec7729;font-size:34px;font-family:Arial;font-weight:bold;}
.about-intro .fr .stats .st span{color:#888;font-size:13px;}

/* 发展历程时间轴 */
.history{padding:3.5rem 0;background:#f6f6f6;}
.history .htit{text-align:center;margin-bottom:40px;}
.history .htit h3{font-size:30px;color:#333;font-weight:bold;}
.history .htit .bar{width:50px;height:3px;background:#ec7729;margin:14px auto 0;}
.timeline{position:relative;max-width:900px;margin:0 auto;padding:10px 0;}
.timeline:before{content:'';position:absolute;left:50%;top:0;bottom:0;width:2px;background:#e0c9b8;transform:translateX(-50%);}
.timeline .tnode{position:relative;width:50%;padding:0 36px 30px;box-sizing:border-box;}
.timeline .tnode:nth-child(odd){left:0;text-align:right;}
.timeline .tnode:nth-child(even){left:50%;text-align:left;}
.timeline .tnode:before{content:'';position:absolute;top:6px;width:14px;height:14px;border-radius:50%;background:#ec7729;border:3px solid #fff;box-shadow:0 0 0 2px #ec7729;}
.timeline .tnode:nth-child(odd):before{right:-7px;}
.timeline .tnode:nth-child(even):before{left:-7px;}
.timeline .tnode .year{color:#ec7729;font-size:24px;font-weight:bold;font-family:Arial;}
.timeline .tnode h4{font-size:17px;color:#333;font-weight:bold;margin:4px 0;}
.timeline .tnode p{color:#777;font-size:14px;line-height:1.7;}

/* 企业文化卡片 */
.culture{padding:3.5rem 0;}
.culture .ctit{text-align:center;margin-bottom:36px;}
.culture .ctit h3{font-size:30px;color:#333;font-weight:bold;}
.culture .ctit .bar{width:50px;height:3px;background:#ec7729;margin:14px auto 0;}
.culture .culist{display:flex;flex-wrap:wrap;gap:24px;}
.culture .culist .cu{flex:1;min-width:240px;background:#fff;border:1px solid #eee;padding:34px 26px;text-align:center;transition:all .4s;}
.culture .culist .cu:hover{box-shadow:0 10px 26px rgba(236,119,41,.18);transform:translateY(-6px);border-color:transparent;}
.culture .culist .cu .cic{width:64px;height:64px;margin:0 auto 16px;background:#fff4ec;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.culture .culist .cu .cic svg{width:32px;height:32px;fill:#ec7729;}
.culture .culist .cu h4{font-size:20px;color:#ec7729;font-weight:bold;margin-bottom:10px;}
.culture .culist .cu p{color:#777;font-size:14px;line-height:1.8;}

/* 团队 team */
.team{padding:3.5rem 0;background:#f6f6f6;}
.team .ttit{text-align:center;margin-bottom:36px;}
.team .ttit h3{font-size:30px;color:#333;font-weight:bold;}
.team .ttit .bar{width:50px;height:3px;background:#ec7729;margin:14px auto 0;}
.team .tlist{display:flex;flex-wrap:wrap;gap:20px;}
.team .tlist .tm{flex:1;min-width:160px;background:#fff;text-align:center;overflow:hidden;transition:transform .4s;}
.team .tlist .tm:hover{transform:translateY(-6px);}
.team .tlist .tm .avt{position:relative;width:100%;padding-bottom:100%;overflow:hidden;}
.team .tlist .tm .avt img{position:absolute;width:100%;height:100%;top:0;left:0;object-fit:cover;}
.team .tlist .tm .meta{padding:16px 8px;}
.team .tlist .tm .meta h4{font-size:18px;color:#333;font-weight:bold;}
.team .tlist .tm .meta span{display:block;color:#ec7729;font-size:13px;margin-top:4px;}

/* =========================================================
   十九、分页 page
   ========================================================= */
.page{text-align:center;padding:24px 0;}
.page a{min-width:38px;color:#666;font-size:14px;display:inline-block;padding:0 12px;margin:3px;line-height:36px;border:1px solid #ddd;background:#fff;transition:all .4s;}
.page a:hover,.page a.cur{color:#fff;background:#ec7729;border-color:#ec7729;}

/* ---------- 新闻列表卡片 news-cards (缩略图+日期+标题+摘要) ---------- */
.news-cards{margin:3.5rem 0;}
.news-cards .nc-item{display:flex;background:#fff;margin-bottom:22px;border:1px solid #f0f0f0;transition:box-shadow .35s,transform .35s;}
.news-cards .nc-item:hover{box-shadow:0 10px 28px rgba(0,0,0,.1);transform:translateY(-3px);}
.news-cards .nc-item .nc-pic{width:32%;flex-shrink:0;position:relative;overflow:hidden;}
.news-cards .nc-item .nc-pic img{width:100%;height:100%;object-fit:cover;min-height:200px;transition:transform .6s;}
.news-cards .nc-item:hover .nc-pic img{transform:scale(1.06);}
.news-cards .nc-item .nc-body{flex:1;padding:24px 28px;display:flex;flex-direction:column;justify-content:center;}
.news-cards .nc-item .nc-meta{font-size:13px;color:#999;margin-bottom:8px;display:flex;align-items:center;gap:14px;}
.news-cards .nc-item .nc-meta .nc-date{color:#ec7729;font-weight:bold;}
.news-cards .nc-item .nc-meta .nc-cat{background:#ec7729;color:#fff;padding:1px 10px;border-radius:3px;font-size:12px;}
.news-cards .nc-item .nc-title{font-size:20px;font-weight:bold;color:#333;line-height:1.4;margin-bottom:10px;transition:color .3s;}
.news-cards .nc-item:hover .nc-title{color:#ec7729;}
.news-cards .nc-item .nc-desc{font-size:14px;color:#888;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
@media only screen and (max-width:768px){
  .news-cards .nc-item{flex-direction:column;}
  .news-cards .nc-item .nc-pic{width:100%;}
  .news-cards .nc-item .nc-pic img{min-height:180px;}
  .news-cards .nc-item .nc-body{padding:16px;}
  .news-cards .nc-item .nc-title{font-size:17px;}
}

/* =========================================================
   二十、响应式断点
   ========================================================= */
@media only screen and (max-width:1366px) and (min-width:1025px){
  .topbox .inner{width:96%;}
  .menubox .nav-li>a{font-size:15px;}
  .topbar-tel a{font-size:16px;}
}
@media only screen and (max-width:1200px){
  footer .f_nav li a{font-size:15px;}
  .in-tit h3{font-size:40px;}
  .in-class li .imgbox{min-height:380px;}
  .in-class li .imgbox>img{height:380px;}
}
@media only screen and (max-width:1024px){
  body{font-size:15px;}
  .topbox{height:70px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.08);}
  .topbox .inner{width:100%;justify-content:space-between;}
  .lotbox{width:55%;}
  .lotbox .logo .logo-txt .b1{color:#333;font-size:18px;}
  .lotbox .logo .logo-txt .b2{color:#999;}
  .lotbox .logo .logo-ico{width:38px;height:38px;}
  .menubox{width:auto;position:fixed;top:70px;left:0;right:0;height:0;overflow:hidden;background:rgba(27,36,43,.98);transition:height .5s ease;}
  .menubox.open{height:calc(100vh - 70px);overflow-y:auto;}
  .menubox .nav-ul{flex-direction:column;align-items:stretch;width:100%;padding:6px 0;}
  .menubox .nav-li{margin:0;border-bottom:1px solid rgba(255,255,255,.08);}
  .menubox .nav-li>a{line-height:50px;color:#fff;font-size:15px;padding:0 8%;text-align:left;}
  .menubox .nav-li>a:before{display:none;}
  .menubox .sub-box{position:static;width:100%;opacity:1;visibility:visible;transform:none;background:rgba(0,0,0,.2);padding:0;display:none;}
  .menubox .nav-li.open .sub-box{display:block;}
  .menubox .sub-box a{text-align:left;padding-left:18%;height:42px;line-height:42px;}
  .topbar-tel{display:none;}
  .nav-btn{display:flex;}
  .banner .slide .banner-pic{height:70vh;}
  .banner .slide .banner-text{left:6%;}
  .banner .slide .banner-text .bt-cn{font-size:34px;}
  .banner .slide .banner-text .bt-desc{font-size:15px;}
  .in-tit h3{font-size:32px;}
  .in-class,.in-pro,.in-about,.in-quality,.in-news{padding:3rem 0;}
  .in-class li{width:calc(100%/2 - 2%);margin-bottom:3%;}
  .in-class li:nth-child(3n){margin-right:3%;}
  .in-class li:nth-child(2n){margin-right:0;}
  .in-class li .imgbox{min-height:320px;}
  .in-class li .imgbox>img{height:320px;}
  .in-pro .track>li{flex-basis:calc(100%/3);}
  .in-about .box,.in-quality .box{flex-direction:column;}
  .in-about .fl,.in-about .fr,.in-quality .fl,.in-quality .fr{width:100%;margin:0;margin-bottom:24px;}
  .news-list>li{flex-basis:100%;margin-right:0;}
  footer .f_nav{display:none;}
  footer .f_fl,footer .f_fr{width:100%;margin:0 0 1.5rem;text-align:left;}
  footer .f_fr h3{text-align:left;}
  .right-bar{display:none;}
  .small-banner{height:36vh;}
  .small-banner .mask .a1{font-size:32px;}
  .location .main{display:block;}
  .ny-class{width:100%;border-bottom:1px solid #ddd;}
  .weizhi{width:100%;text-align:left;padding:10px 0;}
  .pro-box .main{display:block;}
  .pro-box .pro-fl,.pro-box .pro-fr{width:100%;margin:0 0 18px;}
  .pro-box .list-box .lb-list li{width:calc(100%/2);}
  .pro-show{flex-direction:column;}
  .pro-show .gallery,.pro-show .info{width:100%;margin:0;}
  .pro-rel ul{display:block;}
  .pro-rel li{width:100%;}
  .contact-box .box{flex-direction:column;}
  .contact-box .lianxi,.contact-box .map{width:100%;}
  .inner-form .f-item{width:100%;margin-right:0;}
  .about-intro .box{flex-direction:column;}
  .about-intro .fl,.about-intro .fr{width:100%;}
}
@media only screen and (max-width:768px){
  body{font-size:14px;}
  .main{width:92%;}
  .banner{padding-top:70px;}
  .banner .slide .banner-pic{height:60vh;}
  .banner .slide .banner-text .bt-cn{font-size:24px;margin:10px 0 14px;}
  .banner .slide .banner-text .bt-desc{font-size:13px;}
  .banner .slide .banner-text .bt-btn{padding:10px 24px;font-size:13px;}
  .banner .page-dots .dot{width:8px;height:8px;margin:0 6px;}
  .banner .page-dots .dot.active{width:30px;height:30px;}
  .banner .page-dots .dot .ring{width:30px;height:30px;}
  .in-tit h3{font-size:24px;}
  .in-pro .pro-head,.in-news .nhead{flex-direction:column;align-items:flex-start;}
  .in-pro .pro-head .in-tit,.in-news .nhead .in-tit,.in-pro .pro-head .more,.in-news .nhead .more{width:100%;margin-bottom:14px;}
  .in-news .nhead .more{justify-content:flex-start;}
  .in-class,.in-pro,.in-about,.in-quality,.in-news{padding:2.2rem 0;}
  .in-class li{width:100%;margin-right:0;margin-bottom:14px;}
  .in-class li .imgbox{min-height:240px;}
  .in-class li .imgbox>img{height:240px;}
  .in-pro .track>li{flex-basis:calc(100%/2);}
  .in-quality{background-attachment:scroll;}
  .in-pro{background-attachment:scroll;}
  .in-about .fr li .ic{display:none;}
  .in-about .fr li .tx{width:100%;padding:18px;}
  .news-list li .title{font-size:17px;}
  .small-banner{height:32vh;min-height:200px;}
  .small-banner .mask{bottom:36px;width:90%;left:5%;}
  .small-banner .mask .a1{font-size:24px;}
  .ny-class li a{font-size:14px;height:60px;line-height:60px;padding:0 20px;}
  .img-list li,.img-list li:nth-child(4n){width:calc(100%/2 - 3%);margin-right:3%;}
  .img-list li:nth-child(2n){margin-right:0;}
  .pro-box .list-box .lb-list li{width:100%;}
  .pro-show .info h3{font-size:22px;}
  .pro-content .ctit{font-size:18px;}
  .nr-page .title{font-size:20px;}
  .nr-page .content p{font-size:14px;}
  .message .mtit h3{font-size:22px;}
  .timeline:before{left:14px;}
  .timeline .tnode{width:100%;left:0!important;text-align:left!important;padding:0 0 24px 36px;}
  .timeline .tnode:before{left:7px!important;right:auto!important;}
  .culture .culist .cu,.team .tlist .tm{min-width:100%;}
  footer .f_bottom{margin-top:20px;}
  footer .f_fl .lianxi{font-size:14px;}
}