
/* ---------- 1. 设计变量 Design Tokens ---------- */
:root{
  --color:#B96809;          /* 品牌主色（琥珀棕 / 铜色），所有主题色辅助类都引用它 */
  --hovercolor:#EAEAEA;
  --fontcolor:#000000;      /* 正文主色 */
  --headercolor:#FFFFFF;
  --footercolor:#000000;
  --introcolor:#444444;     /* 次级文字：描述、面包屑 */
  --hometitlefont:36px;
  --fontsize12:12px; --fontsize13:13px; --fontsize14:14px; --fontsize15:15px;
  --fontsize16:16px; --fontsize17:17px; --fontsize18:18px; --fontsize20:20px;
  --fontsize22:22px; --fontsize24:24px; --fontsize26:26px; --fontsize28:28px; --fontsize30:30px;
  --fontbold3:300; --fontbold4:400; --fontbold5:500; --fontbold6:600; --fontbold7:700;
  --borderradius:8px;
  --fontfamily:"Lato","Open Sans","Roboto","Poppins","Oswald","Noto Sans","Montserrat",arial,sans-serif;
}

*{box-sizing:border-box}
html,body{padding:0;margin:0}
body{
  margin:0 auto;
  max-width:2560px;
  line-height:1.6;
  font-size:var(--fontsize16);
  color:var(--fontcolor);
  background:#FFFFFF;
  overflow-x:hidden;
  font-family:var(--fontfamily);
}

/* 居中内容容器：桌面 1700px 宽、左右 70px 内边距 */
.l-wrap{width:100%;max-width:1700px;padding:0 70px;margin:0 auto}


/* ---------- 2. 顶部 Banner（面包屑 + 标题） ---------- */
.banner-inner{overflow:hidden;background:#FAFAFA}
.banner-inner .banner-content{z-index:1;position:relative;padding:10px 0;background:#FAFAFA}
.banner-inner .banner-content .l-wrap{
  display:flex;align-items:center;justify-content:space-between;
}
.banner-inner .banner-breadcrumbs{font-size:var(--fontsize14);color:var(--introcolor)}
.banner-inner .banner-breadcrumbs .link-home em{margin-right:5px}
.banner-inner a:hover{color:var(--color)}
.banner-title-h1{font-size:var(--fontsize18);font-weight:var(--fontbold6);text-transform:capitalize}

/* 正文区垂直留白 */
.common-main{padding:50px 0}


/* ---------- 3. 模块通用容器 & 主题辅助类 ---------- */
.kche-wrap-width{clear:both;margin:0 auto;width:100%;padding:15px 0;max-width:1600px;box-sizing:border-box}
.kche-wrap-width1{clear:both;margin:0 auto;width:100%;padding:0;max-width:1600px;box-sizing:border-box}

/* 主题色辅助类：颜色 / 背景 / 边框，全部跟随 --color */
.kche-color-theme{color:var(--color,#333)!important}
.kche-bg-theme{background-color:var(--color,#666)!important}
.kche-border-theme{border-color:var(--color,#CCC)!important}

/* 通用 flex 工具类 */
.kche-flex{display:flex;flex-wrap:wrap}
.kche-flex-jc-sb{display:flex;flex-wrap:wrap;justify-content:space-between}
.kche-flex-jc-ai-c{display:flex;flex-wrap:wrap;justify-content:center;align-items:center}
.kche-flex-item4{width:24%;margin:10px 0}
.kche-text-align-c{text-align:center}


/* ---------- 4. 模块 t58：分段标题（居中 + 短线） ---------- */
.kche-t58 .kche-template-item{
  position:relative;display:flex;align-items:center;justify-content:center;
  padding:0 15px 15px;
}
.kche-t58 .kche-template-item h5{font-weight:var(--fontbold6,600);font-size:24px;margin:0;padding:0}
.kche-t58 .kche-template-item .kche-t58-line{
  position:absolute;left:50%;transform:translateX(-50%);bottom:0;
  width:50px;height:3px;background:var(--color,#000);
}


/* ---------- 5. 模块 t134：引言（左文右图，两栏） ---------- */
.kche-t134 .kche-t134-top{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between}
.kche-t134 .kche-t134-info{width:50%;box-sizing:border-box;padding-right:4%}
.kche-t134 .kche-t134-img{width:50%;text-align:right}
.kche-t134 .kche-t134-img img{max-width:100%;border-radius:10px;border:1px solid #eee;transition:all .2s linear}
.kche-t134 .kche-t134-title{
  display:flex;align-items:center;font-size:20px;color:#000;
  text-transform:capitalize;line-height:1.4;font-weight:var(--fontbold6,600);
}
.kche-t134 .kche-t134-title span{color:var(--color,#14afbb);font-size:60px}
.kche-t134 .kche-t134-des{font-size:16px;color:var(--introcolor,#555555);line-height:1.6}
.kche-t134 .kche-t134-des p{margin:0}
.kche-t134 .kche-t134-img:hover img{transform:scale(1.01)}


/* ---------- 6. 模块 t35：发展历程（年份时间轴） ---------- */
.kche-course-item{border-top:1px dashed #CCC}
.kche-course-item:nth-last-of-type(1){border-bottom:1px dashed #CCC}
.kche-course-item:nth-of-type(odd){background-color:#f6f7fb}
.kche-course-item>strong{
  font-size:22px;font-weight:400;padding:10px 20px;
  border-right:1px dashed #CCC;line-height:1.1;font-family:serif;
}
.kche-course-item>div{margin:0;flex:1;padding:10px 20px;position:relative;font-size:16px}
.kche-course-item>div>p{margin:0}
.kche-course-item>div>.icon{
  position:absolute;display:block;width:8px;height:8px;border-radius:50%;
  background-color:#FFF;border:2px solid #2cb740;left:-4px;top:calc(50% - 4px);box-sizing:border-box;
}
/* t35 把时间轴圆点边框改成品牌主色 */
.kche-t35 .kche-course-item>div>.icon{border-color:var(--color,#2cb740)}


/* ---------- 7. 模块 t40：产品网格（4 列图 + 标题浮层） ---------- */
.kche-item-title{margin:6px 0}
.kche-item-img{overflow:hidden}
.kche-item-img img{display:block;margin:0 auto;border:1px solid #eee;box-sizing:border-box}

.kche-position-title>.kche-flex-item{position:relative}
.kche-position-title>div>.kche-item-title{
  position:absolute;bottom:0;left:0;width:100%;margin:0;
  background:rgba(0,0,0,.15);color:#FFF;padding:6px 0;
}
.kche-scale .kche-item-img img{transition:all .3s}
.kche-scale .kche-flex-item:hover .kche-item-img img{transform:scale(1.2)}

.kche-t40 .kche-item-img img{width:100%}
.kche-t40>.kche-flex-jc-sb>.kche-flex-item{border:1px solid #FFF}


/* ---------- 8. 响应式 ---------- */
@media(max-width:1280px){:root{--hometitlefont:30px}}
@media(max-width:768px){
  body{padding-top:0}
  .l-wrap{padding:0 15px}
  .kche-t134 .kche-t134-info{width:100%;padding-right:0}
  .kche-t134 .kche-t134-img{width:100%;margin-top:20px}
  .kche-t134 .kche-t134-img img{width:100%}
  .kche-flex-item4{width:49%}
}
@media(max-width:480px){
  :root{--hometitlefont:22px}
  .kche-t58 .kche-template-item h5{font-size:16px!important}
}
