@charset "utf-8";
/* =========================================================
   citronix_my11 · 现代化改版覆盖层 (theme-modern.css)
   2026-10-19 · 加载于 base.css / style.css 之后
   仅做覆盖，不修改源样式文件，删除本文件即可整体回滚
   ========================================================= */

:root{
  --cx-red:#a20000;
  --cx-red-dark:#7f0000;
  --cx-ink:#1c2430;
  --cx-text:#4b5563;
  --cx-muted:#8a94a3;
  --cx-line:#e6e9ee;
  --cx-bg:#f5f7fa;
  --cx-radius:10px;
  --cx-shadow:0 8px 24px rgba(15,23,42,.08);
  --cx-shadow-lg:0 12px 32px rgba(15,23,42,.16);
}

/* ---------- 基础排版 ---------- */
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body{font-size:15px;line-height:1.75;color:var(--cx-text);background:#fff;}
input,select,textarea,button{font-size:14px;}
a{transition:color .2s ease,background-color .2s ease;}
img{max-width:100%;height:auto;}

/* ---------- 顶部通栏 ---------- */
.header{padding:16px 0;background:#fff;border-bottom:1px solid var(--cx-line);}
.header .top{margin-top:22px;}
.header .top p{font-size:21px;color:var(--cx-ink);font-weight:600;letter-spacing:1px;}
.header .tel{padding-left:56px;}
.header .tel span{color:var(--cx-muted);font-size:13px;}
.header .tel b{font-size:25px;color:var(--cx-red);font-style:normal;font-weight:700;letter-spacing:.5px;line-height:34px;}

/* ---------- 导航栏：吸顶 + 下拉菜单 ---------- */
.navArea{position:sticky;top:0;z-index:9000;overflow:visible;
  background:linear-gradient(135deg,#b00909 0%,var(--cx-red) 45%,var(--cx-red-dark) 100%);
  box-shadow:0 2px 12px rgba(127,0,0,.28);}
/* flow-root：包含内部浮动（替代原 overflow:hidden），同时不裁剪下拉菜单 */
.navArea .main{overflow:visible;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.navArea .nav{overflow:visible;display:flow-root;flex:1 1 auto;width:auto;min-width:0;order:1;}
.navArea .cx-search{order:2;}
.nav > li{float:left;position:relative;}
.nav > li > a{display:block;padding:0 21px;line-height:52px;height:52px;font-size:15px;color:#fff;
  letter-spacing:.5px;transition:background-color .25s ease,box-shadow .25s ease;}
.nav > li > a:hover,.nav > li:hover > a,.nav > li > a.on{background:rgba(0,0,0,.18);color:#fff;box-shadow:inset 0 -3px 0 rgba(255,255,255,.35);}
/* 下拉子菜单（悬停弹出，纯 CSS，支持键盘焦点） */
.nav > li .sub-menu{position:absolute;top:100%;left:50%;transform:translate(-50%,10px);min-width:200px;
  background:#fff;border-radius:0 0 10px 10px;box-shadow:var(--cx-shadow-lg);padding:8px 0;
  opacity:0;visibility:hidden;transition:opacity .22s ease,transform .22s ease,visibility .22s;z-index:999;}
.nav > li .sub-menu::before{content:"";position:absolute;top:-6px;left:50%;margin-left:-6px;
  border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #fff;}
.nav > li:hover .sub-menu,.nav > li:focus-within .sub-menu{opacity:1;visibility:visible;transform:translate(-50%,0);}
.nav > li .sub-menu li{float:none;}
.nav > li .sub-menu a{display:block;line-height:40px;height:40px;padding:0 20px;font-size:14px;color:var(--cx-text);
  white-space:nowrap;transition:all .18s ease;}
.nav > li .sub-menu a:hover{background:var(--cx-bg);color:var(--cx-red);padding-left:26px;}
/* 下拉箭头 */
.nav > li.has-sub > a{padding-right:30px;}
.nav > li.has-sub > a::after{content:"";display:inline-block;margin-left:8px;vertical-align:middle;margin-top:-3px;
  border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(255,255,255,.85);
  transition:transform .25s ease;}
.nav > li.has-sub:hover > a::after{transform:rotate(180deg);}

/* ---------- 导航栏搜索框 ---------- */
.cx-search{flex:0 0 auto;position:relative;width:220px;}
.cx-search input[type="text"]{width:100%;height:32px;line-height:32px;padding:0 74px 0 14px;border:none;border-radius:16px;
  background:rgba(255,255,255,.96);font-size:13px;color:var(--cx-ink);box-sizing:border-box;transition:box-shadow .2s ease;}
.cx-search input[type="text"]::placeholder{color:#9aa3b0;}
.cx-search input[type="text"]:focus{box-shadow:0 0 0 3px rgba(255,255,255,.28);outline:none;}
.cx-search button{position:absolute;right:3px;top:3px;height:26px;line-height:26px;padding:0 14px;border:none;border-radius:13px;
  background:var(--cx-red);color:#fff;font-size:13px;cursor:pointer;transition:background-color .2s ease;}
.cx-search button:hover{background:var(--cx-red-dark);}

/* ---------- 区块标题 ---------- */
.min .tit{position:relative;padding-bottom:14px;margin-bottom:32px;}
.min .tit::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:36px;height:3px;
  background:var(--cx-red);border-radius:2px;}
.min .tit h2{font-size:30px;line-height:38px;font-weight:700;color:var(--cx-ink);letter-spacing:1px;margin-bottom:4px;}
.min .tit p{font-size:13px;color:var(--cx-muted);letter-spacing:3px;text-transform:uppercase;}

/* ---------- 产品卡片 ---------- */
.prot .list ul li{width:23.5%;margin-right:2%;background:#fff;border:1px solid var(--cx-line);border-radius:var(--cx-radius);
  overflow:hidden;box-shadow:0 2px 8px rgba(15,23,42,.05);transition:transform .3s ease,box-shadow .3s ease;}
.prot .list ul li:hover{transform:translateY(-4px);box-shadow:var(--cx-shadow);}
.prot .list ul li:nth-child(4n){margin-right:0;}
.prot .list ul li.lit3,.prot .list ul li.lit6{margin-right:2%;}
.prot .list ul li p{position:static;height:46px;line-height:46px;background:#fff;color:var(--cx-ink);
  font-size:14px;font-weight:500;transition:none;}
.prot .list ul li:hover p{background:#fff;color:var(--cx-red);}
/* 首页产品页签 */
.min12 a{padding:7px 26px;border-radius:999px;border:1px solid var(--cx-line);color:var(--cx-text);font-size:14px;background:#fff;
  transition:all .25s ease;}
.min12 a:hover,.min12 a.menuOn{background:var(--cx-red);border-color:var(--cx-red);color:#fff;
  box-shadow:0 4px 12px rgba(162,0,0,.25);}
.min .more a{border-color:var(--cx-red);color:var(--cx-red);border-radius:999px;transition:all .25s ease;}
.min .more a:hover{background:var(--cx-red);color:#fff;}

/* ---------- 关于我们区块 ---------- */
.ab{background:var(--cx-bg);padding:56px 0;}
.ab02{background:#fff;border-radius:var(--cx-radius);box-shadow:0 2px 10px rgba(15,23,42,.05);padding:26px;}
.ab02 .infom{font-size:14px;color:var(--cx-text);line-height:1.9;}
.ab02 .infom h2{font-size:20px;color:var(--cx-ink);}
.ab02 .infom h2 a{color:var(--cx-ink);}

/* ---------- 资讯 / 案例列表 ---------- */
.min .titt h2{font-size:20px;font-weight:700;color:var(--cx-ink);}
.min .titt span{background:var(--cx-red);height:2px;}
.new .list ul li,.news_list2 li{border-bottom:1px solid var(--cx-line);}
.new .list ul li a:hover,.news_list2 li span.title a:hover,.wenti ul li a:hover{color:var(--cx-red);}
.news_list2 li{height:48px;line-height:48px;padding:0 10px;transition:background-color .2s ease;}
.news_list2 li:hover{background:var(--cx-bg);}
.news_list2 li span.title{width:75%;font-size:15px;}
.news_list2 li span.time{color:var(--cx-muted);}
.wenti ul li a{font-size:15px;color:var(--cx-ink);transition:color .2s ease;}

/* ---------- 内页侧栏与标题 ---------- */
.cont-left .top .tim{background:var(--cx-ink);border-radius:8px 8px 0 0;text-indent:18px;font-size:17px;letter-spacing:1px;}
.cont-left .top ul{border-color:var(--cx-line);border-radius:0 0 8px 8px;box-shadow:0 2px 8px rgba(15,23,42,.04);}
.cont-left .cet .cett{border:1px solid var(--cx-line);border-radius:8px;padding:18px 14px;box-shadow:0 2px 8px rgba(15,23,42,.04);}
.cont-right .subtitle span.catname{font-size:22px;font-weight:700;color:var(--cx-ink);}
.cont-right .subtitle span.xian{height:3px;border-radius:2px;background:var(--cx-red);width:64px;}

/* ---------- 分页 ---------- */
.page_list ul li{border:1px solid var(--cx-line);border-radius:6px;background:#fff;transition:all .2s ease;}
.page_list ul li:hover{background:var(--cx-bg);border-color:var(--cx-line);}
.page_list ul li:hover a{color:var(--cx-red);}
.page_list ul li.thisclass{background:var(--cx-red);border-color:var(--cx-red);}
.page_list ul li.thisclass a,.page_list ul li.thisclass span{color:#fff;}

/* ---------- 页脚 ---------- */
.foot{background:var(--cx-ink);padding:40px 0 24px;}
.foot .foot1 ul dl dt{font-size:16px;margin-bottom:12px;}
.foot .foot1 ul dl dt a{color:#d7dce3;}
.foot .foot1 ul dl dt a:hover{color:#fff;}
.foot .foot1 ul dl dd a{color:#8f99a7;font-size:13px;line-height:28px;}
.foot .foot1 ul dl dd a:hover{color:#fff;}
.foot .foot1 .f-right .dd span{color:#d7dce3;font-size:14px;}
.foot .foot1 .f-right .dd p.t{color:#fff;font-style:normal;font-size:28px;font-weight:700;letter-spacing:1px;}
.foot .foot1 .f-right .dd p.d{color:#8f99a7;}
.footer{background:#141a22;padding:16px 0;}
.footer p{color:#6b7684;font-size:13px;line-height:24px;}
.footer p a{color:#8f99a7;}
.footer p a:hover{color:#fff;text-decoration:underline;}
#goodlink{background:#141a22 !important;border-top:1px solid #232b36;color:#6b7684 !important;font-size:12px !important;}
#goodlink a{color:#8f99a7;}
#goodlink a:hover{color:#fff;}

/* ---------- 移动端顶栏 ---------- */
.head{background:var(--cx-ink);height:50px;}
.head .webname{font-size:17px;line-height:50px;font-weight:600;letter-spacing:1px;}
.head .home{top:13px;}
.head .catebar{top:15px;}
.head .navt{background:#fff;padding:8px 12px 12px;box-shadow:0 14px 28px rgba(15,23,42,.18);}
.head .navt li a{border-bottom:1px solid var(--cx-line);color:var(--cx-ink);height:44px;line-height:44px;font-size:15px;}
.head .navt li a.cx-sub{padding-left:28px;color:var(--cx-text);font-size:14px;}
.head .navt li a:hover{color:var(--cx-red);background:var(--cx-bg);}
/* 移动端手风琴子菜单：默认折叠，点箭头展开 */
.head .navt li.cx-has-sub{position:relative;}
.head .navt li.cx-has-sub > a{padding-right:48px;}
.head .navt .cx-caret-m{position:absolute;right:0;top:0;width:48px;height:44px;line-height:44px;text-align:center;cursor:pointer;z-index:2;color:#8a94a3;font-size:15px;}
.head .navt .cx-caret-m::before{content:"▾";display:inline;transition:transform .2s ease;}
.head .navt li.cx-open > .cx-caret-m::before{display:inline-block;transform:rotate(180deg);}
.head .navt ul.cx-m-sub{display:none;padding:0 0 4px;background:var(--cx-bg);border-radius:6px;margin:0 0 6px;}
.head .navt li.cx-open > ul.cx-m-sub{display:block;}
.head .navt ul.cx-m-sub li a{border-bottom:none;background:transparent;}
/* 移动端搜索框 */
.cx-m-search{padding:10px 2px 6px;position:relative;}
.cx-m-search input[type="text"]{width:100%;height:38px;border:1px solid var(--cx-line);border-radius:19px;
  padding:0 78px 0 16px;font-size:14px;box-sizing:border-box;background:var(--cx-bg);color:var(--cx-ink);}
.cx-m-search input[type="text"]:focus{outline:none;border-color:var(--cx-red);}
.cx-m-search button{position:absolute;right:5px;top:12px;height:30px;line-height:30px;padding:0 16px;border:none;border-radius:15px;
  background:var(--cx-red);color:#fff;font-size:13px;cursor:pointer;}

/* ---------- 搜索结果页 ---------- */
.cx-search-head{padding:4px 0 16px;font-size:16px;color:var(--cx-text);}
.cx-search-head b{color:var(--cx-red);}
.cx-search-empty{padding:50px 0;text-align:center;color:var(--cx-muted);font-size:15px;}

/* ---------- 响应式 ---------- */
@media screen and (max-width:1200px){
  .nav > li > a{padding:0 14px;font-size:14px;}
  .nav > li.has-sub > a{padding-right:24px;}
  .cx-search{width:170px;}
  .cx-search input[type="text"]{padding-right:66px;}
}
@media screen and (max-width:1050px){
  .cx-search{display:none;}
}
@media screen and (max-width:1000px){
  .header .top p{font-size:17px;}
  .header .tel b{font-size:19px;line-height:28px;}
  .prot .list ul li{width:48%;}
  .prot .list ul li:nth-child(4n){margin-right:2%;}
  .prot .list ul li:nth-child(2n){margin-right:0;}
  .prot .list ul li p{height:40px;line-height:40px;}
  .min .tit h2{font-size:26px;}
  .ab02{padding:20px;}
}
@media screen and (max-width:640px){
  .min .tit h2{font-size:22px;line-height:30px;}
  .min .tit p{letter-spacing:2px;}
  .prot .list ul li p{height:36px;line-height:36px;font-size:13px;}
  .news_list2 li{height:44px;line-height:44px;padding:0 6px;}
  .news_list2 li span.title{width:72%;font-size:14px;}
  .cont-right .subtitle span.catname{font-size:18px;}
  .ab02{padding:14px;}
  .ab02 .infom{font-size:13px;line-height:1.8;}
  .foot .foot1 ul dl dt a{font-size:15px;}
}