@charset "utf-8";
/* ====================公共样式========================= */
/*reset Css*/
* {margin: 0;padding: 0;}
/** 清除内外边距 **/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
th, td /* table elements 表格元素 */ {
margin: 0;padding: 0;
}
body {
background-color: #fff;/*整体背景颜色*/
-webkit-touch-callout: none;/*-webkit-user-select: none;*//*禁止复制*/
-webkit-text-size-adjust:100%;
-webkit-tap-highlight-color:rgba(255,255,255,0);/*点击高亮效果*/
--www: 16rem;
--interval: var(--www);
--nav_height: 1rem;
--theme-color: #00A180;
--theme-color-rgb: 0,161,128;
--swiper-theme-color: #00A180;
--sec-theme-color: #4ADE80;
}
/*==常用字号==*/
body {
--f14: 0.14rem;
--f16: 0.16rem;
--f18: 0.18rem;
--f20: 0.2rem;
--f22: 0.22rem;
--f24: 0.24rem;
--f26: 0.26rem;
--f28: 0.28rem;
--f30: 0.3rem;
--f32: 0.32rem;
--f34: 0.34rem;
--f36: 0.36rem;
--f38: 0.38rem;
--f40: 0.4rem;
--f42: 0.42rem;
--f44: 0.44rem;
--f46: 0.46rem;
--f48: 0.48rem;
--f50: 0.5rem;
--f52: 0.52rem;
--f54: 0.54rem;
--f56: 0.56rem;
--f58: 0.58rem;
--f60: 0.6rem;
--f62: 0.62rem;
--f64: 0.64rem;
--f66: 0.66rem;
--f68: 0.68rem;
--f70: 0.7rem;
--f72: 0.72rem;
--f80: 0.8rem;
--f100: 1rem;
}
@media screen and (max-width: 1520px) {
body {
--f14: 12px;
--f16: 14px;
--f18: 16px;
--f20: 18px;
--f22: 20px;
}
}
@media screen and (max-width: 1200px) {
body {
--f22: 16px;
--f24: 18px;
--f26: 20px;
--f28: 22px;
--f30: 0.36rem;
--f32: 0.36rem;
--f34: 0.38rem;
--f36: 0.4rem;
--f38: 0.4rem;
--f40: 0.4rem;
--f42: 0.4rem;
--f44: 0.4rem;
--f46: 0.4rem;
--f48: 0.4rem;
--f50: 0.42rem;
--f52: 0.46rem;
--f54: 0.48rem;
--f56: 0.52rem;
--f58: 0.52rem;
--f60: 0.54rem;
--f80: 0.72rem;
--interval: 5vw;
--nav_height: 58px;
}
}
@media screen and (max-width: 767px) {
body {
--f14: 0.24rem;
--f16: 0.26rem;
--f18: 0.28rem;
--f20: 0.28rem;
--f22: 0.30rem;
--f24: 0.32rem;
--f26: 0.34rem;
--f28: 0.36rem;
--f30: 0.4rem;
--f32: 0.4rem;
--f34: 0.4rem;
--f36: 0.4rem;
--f38: 0.4rem;
--f40: 0.42rem;
--f42: 0.42rem;
--f44: 0.42rem;
--f46: 0.42rem;
--f48: 0.42rem;
--f50: 0.42rem;
--f52: 0.42rem;
--f54: 0.44rem;
--f56: 0.46rem;
--f58: 0.46rem;
--f60: 0.48rem;
--f80: 0.64rem;
}
}
.f14{font-size: var(--f14);}
.f16{font-size: var(--f16);}
.f18{font-size: var(--f18);}
.f20{font-size: var(--f20);}
.f22{font-size: var(--f22);}
.f24{font-size: var(--f24);}
.f26{font-size: var(--f26);}
.f28{font-size: var(--f28);}
.f30{font-size: var(--f30);}
.f32{font-size: var(--f32);}
.f34{font-size: var(--f34);}
.f36{font-size: var(--f36);}
.f38{font-size: var(--f38);}
.f40{font-size: var(--f40);}
.f42{font-size: var(--f42);}
.f44{font-size: var(--f44);}
.f46{font-size: var(--f46);}
.f48{font-size: var(--f48);}
.f50{font-size: var(--f50);}
.f52{font-size: var(--f52);}
.f54{font-size: var(--f54);}
.f56{font-size: var(--f56);}
.f58{font-size: var(--f58);}
.f60{font-size: var(--f60);}
.f62{font-size: var(--f62);}
.f64{font-size: var(--f64);}
.f66{font-size: var(--f66);}
.f68{font-size: var(--f68);}
.f70{font-size: var(--f70);}
.f72{font-size: var(--f72);}
.f80{font-size: var(--f80);}
.f100{font-size: var(--f100);}
/*clearfix清除浮动*/
.clearfix{*zoom:1}
.clearfix:before,
.clearfix:after{display:table;content:""}
.clearfix:after{clear:both}
/* 默认合并表格边框 */
table{border-collapse:collapse;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
input,textarea{-webkit-appearance: none;border-radius:0;}
ol,ul,li{list-style: none;}
a, a:active{color:inherit;text-decoration:none;cursor:pointer;}
a{border:0;}
em,i{font-style:normal;}
/* 标签 */
input{border: none;appearance:none;-moz-appearance:none;outline:none;-webkit-appearance: none;}
input:focus{ outline:none; }/* input标签聚焦不出现默认边框 */
textarea { resize:none; } /* 禁用了文本的拖拉，尤其在谷歌下 */
select, button, input,img {vertical-align: middle;}/*去除图片底部缝隙并基于中线对齐*/
img {
width: auto;
height: auto;
width: auto\9;
max-width: 100%;
display: block;
-ms-interpolation-mode: bicubic;
}
/** 设置默认字体 **/
/*
宋体：\5B8B\4F53
新宋体：\65B0\5B8B\4F53
黑体：\9ED1\4F53
微软雅黑：\5FAE\8F6F\96C5\9ED1
楷体：\6977\4F53_GB2312
思源黑体： Source Han Sans CN
*/
body,button, input, select, textarea /* for ie */ {font: 14px/1 "DR",Arial,"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Droid Sans Fallback","WenQuanYi Micro Hei",sans-serif;}
body {background:#fff;-webkit-text-size-adjust:100%;color: #333;}
.admin-bar #c-header{top:32px;}
@media screen and (max-width:782px){.admin-bar #c-header{top:46px;}}
/*End reset*/
/*public Css*/
/* 重绘元素边框盒 */
*{ box-sizing:border-box;}
*::before, *::after{ box-sizing:border-box;}
*:focus{ outline:none;}
html{-ms-touch-action:none;/* 阻止windows Phone 的默认触摸事件 */}
/*兼容iphone去除默认input表单默认设置*/
input[type="submit"],input[type="reset"],input[type="button"],button{-webkit-appearance: none;}
/*clearfix清除浮动*/
.clearfix{*zoom:1}
.clearfix:before,
.clearfix:after{display:table;content:""}
.clearfix:after{clear:both}
/* 水平垂直居中 */
.cell_mid{ display: table; height:100%; width:100%; }
.cell_h{ height:100%;display: table-cell; vertical-align: middle; }
/*动画--规定动画移动出去的时间*/
a{-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;-webkit-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.animation{-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;-webkit-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
/* 指定文字禁止复制 */
.noSelect{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-khtml-user-select:none;user-select:none;}
/* 文字限制行数 */
/* 限制一行 */
.linelimit {white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
/* 【常用】限制多行 修改行数-webkit-line-clamp: 2;【兼容必须限高】 */
.linelimit-2 {overflow: hidden;display: -webkit-box;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.linelimit-3 {overflow: hidden;display: -webkit-box;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 3;}
.linelimit-4 {overflow: hidden;display: -webkit-box;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 4;}
/* 引入字体 */
@font-face {
font-family: 'DR';
src: url('../fonts/DMSans-Regular.ttf'),
url('../fonts/DMSans-Regular.eot'),
url('../fonts/DMSans-Regular.eot?#iefix') format('embedded-opentype'),
url('../fonts/DMSans-Regular.woff2') format('woff2'),
url('../fonts/DMSans-Regular.woff') format('woff'),
url('../fonts/DMSans-Regular.otf') format('truetype'),
url('../fonts/DMSans-Regular.svg#svgFontName') format('svg');
}
@font-face {
font-family: 'RB';
src: url('../fonts/Raleway-Bold.ttf'),
url('../fonts/Raleway-Bold.eot'),
url('../fonts/Raleway-Bold.eot?#iefix') format('embedded-opentype'),
url('../fonts/Raleway-Bold.woff2') format('woff2'),
url('../fonts/Raleway-Bold.woff') format('woff'),
url('../fonts/Raleway-Bold.otf') format('truetype'),
url('../fonts/Raleway-Bold.svg#svgFontName') format('svg');
}
@font-face {
font-family: 'DL';
src: url('../fonts/DMSans-Light.ttf'),
url('../fonts/DMSans-Light.eot'),
url('../fonts/DMSans-Light.eot?#iefix') format('embedded-opentype'),
url('../fonts/DMSans-Light.woff2') format('woff2'),
url('../fonts/DMSans-Light.woff') format('woff'),
url('../fonts/DMSans-Light.otf') format('truetype'),
url('../fonts/DMSans-Light.svg#svgFontName') format('svg');
}
@font-face {
font-family: 'CAI978';
src: url('../fonts/CAI978.ttf'),
url('../fonts/CAI978.eot'),
url('../fonts/CAI978.eot?#iefix') format('embedded-opentype'),
url('../fonts/CAI978.woff2') format('woff2'),
url('../fonts/CAI978.woff') format('woff'),
url('../fonts/CAI978.otf') format('truetype'),
url('../fonts/CAI978.svg#svgFontName') format('svg');
}
.DR{font-family: "DR";}
.RB{font-family: "RB";}
.DL{font-family: "DL";}
.CAI978{font-family: "CAI978";}
/*动画效果 所有属性获得过度*/
*{transition-property:all;}
.com-img{overflow: hidden;}
.com-img img{transition:all 0.5s ease-out; -webkit-transition:all 0.5s ease-out; -moz-transition:all 0.5s ease-out; -o-transition:all 0.5s ease-out;}
.com-img:hover img{transform:scale(1.1); -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -o-transform:scale(1.1);-ms-transform:scale(1.1);}
.fl{float: left;}
.fr{float: right;}
.show{display:block;}
.hide{display:none;}
.tac{text-align:center;}
.tal{text-align:left;}
.tar{text-align:right;}
.ttu{text-transform:uppercase;}/*全字母转换为大写*/
.ttc{text-transform:capitalize;}/*首字母转换为大写*/
.fwb{ font-weight: bold;}
.fwl{ font-weight: lighter;}
.ofh{overflow:hidden;}
.ofh img{width: 100%;transition: 1.5s cubic-bezier(.165,.84,.44,1);}
.ofh:hover img{-webkit-transform: scale(1.05);transform: scale(1.05);}
.ofc img{object-fit: contain !important;}
.pst-rel{position:relative;}
.pst-abs{position:absolute;}
.pst-pic{position: absolute;background-position: center;background-repeat: no-repeat;background-size: cover;}
.w100{width: 100%;}
.lh-1{line-height: 1;}
.lh-111{line-height: 1.11;}
.lh-115{line-height: 1.15;}
.lh-12{line-height: 1.2;}
.lh-13{line-height: 1.3;}
.lh-14{line-height: 1.4;}
.lh-15{line-height: 1.5;}
.lh-16{line-height: 1.6;}
.lh-17{line-height: 1.7;}
.lh-175{line-height: 1.75;}
.lh-18{line-height: 1.8;}
.color-0 { color: #000; }
.color-1 { color: #111; }
.color-2 { color: #222; }
.color-3 { color: #333; }
.color-4 { color: #444; }
.color-5 { color: #555; }
.color-6 { color: #666; }
.color-7 { color: #777; }
.color-8 { color: #888; }
.color-9 { color: #999; }
.color-a { color: #aaa; }
.color-b { color: #bbb; }
.color-c { color: #ccc; }
.color-d { color: #ddd; }
.color-e { color: #eee; }
.color-f { color: #fff; }
.color-blue{ color: #00307C;}
.color-sec-blue{ color: var(--sec-theme-color);}
.color-title{color: var(--sec-title-color);}
.color-white{ color: white;}
.color-black{ color: black;}
.color-dark{color: #001322;}
.bg-f8{background-color: #f8f9f9;}
.bg-f7{ background-color: #f7f8f9;}
.bg-f5{ background-color: #f5f5f5;}
.bg-f0{ background-color: #f0f1f5;}
.bg-f9{ background-color: #f9fcff;}
.bg-blue{background-color: #00307C;}
.bg-sec-blue{background-color: #0A2558;}
.bg-dark{background-color: #001322;}
.bg-red{background-color: var(--theme-color);}
.bg-white{ background-color: white;}
.bg-black{ background-color: black;}
.bg-666{ background-color: #666;}
.bg-888{ background-color: #888;}
.bg-555{ background-color: #555;}
.bg-aaa{ background-color: #aaa;}
.hmax{ height: 100% ;}
.wmax{ width: 100% ;}
.w50{ width: 50% ;}
.w55{ width: 55%;}
.w49-5{ width: 49.5%;}
.w25{ width: 25%;}
.w33{ width: 33%;}
.w35{ width: 35%;}
.w40{ width: 40%;}
.w60{ width: 60%;}
.w70{ width: 70%;}
.w48{ width: 48% ;}
.radius3{ border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; }
.radius5{ border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; }
.radius6{ border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; }
.radius8{ border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.radius10{ border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
.radius20{ border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; }
.radius40{ border-radius: 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px; }
.radius50{ border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.col-2{width:50%;float:left;}
.col-3{width:33.333333%;float:left;}
.col-4{width:25%;float:left;}
.col-5{width:20%;float:left;}
.col-6{widows: 16.6666%;float:left;}
.w12{width: 1200px;max-width: 92%;margin: 0 auto;}
.w14{width: 1440px;max-width: 92%;margin: 0 auto;}
.w15{width: 1500px;max-width: 92%;margin: 0 auto;}
.w16{width: 1600px;max-width: 92%;margin: 0 auto;}
.w18{width: 1800px;max-width: 92%;margin: 0 auto;}
.pc{display: block;}
.mb{display: none;}
.mt{margin-top: 100px;}
@media all and (max-width:1000px) {.pc{display: none;}.mb{display: block;}}
*[class*="rect-"]{position: relative;display: block; width: 100%;height: 0;overflow: hidden;}
*[class*="rect-"] ._full{position: absolute;left: 0;top:0;width: 100%;height: 100%;
*height: auto;object-fit: cover;}
*[class*="rect-"] ._full.w92{width: 92%;height: 92%;object-position: center;left: 4%;top: 4%;}
.rect-40{padding-bottom: 40%;}
.rect-50{padding-bottom: 50%;}
.rect-55{padding-bottom: 55%;}
.rect-5625{padding-bottom: 56.25%;}
.rect-60{padding-bottom: 60%;}
.rect-65{padding-bottom: 65%;}
.rect-67{padding-bottom: 67%;}
.rect-70{padding-bottom: 70%;}
.rect-75{padding-bottom: 75%;}
.rect-80{padding-bottom: 80%;}
.rect-85{padding-bottom: 85%;}
.rect-90{padding-bottom: 90%;}
.rect-100{padding-bottom: 100%;}
.rect-135{padding-bottom: 135%;}
.rect-140{padding-bottom: 140%;}
.rect-150{padding-bottom: 150%;}
li *[class*="pic"]{overflow: hidden;}
li *[class*="pic"]>img{-webkit-transition: 0.3s ease-out;-moz-transition: 0.3s ease-out;-ms-transition: 0.3s ease-out;-o-transition: 0.3s ease-out;transition: 0.3s ease-out;}
li:hover *[class*="pic"]>img {-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-o-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1);}
.trs3{-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.trs5{-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-ms-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}
.pd-40{padding: 0.4rem 0;}
.pt-40{padding-top: 0.4rem;}
.pb-40{padding-bottom: 0.4rem;}
.pd-60{padding: 0.6rem 0;}
.pt-60{padding-top: 0.6rem;}
.pb-60{padding-bottom: 0.6rem;}
.pd-80{padding: 0.8rem 0;}
.pt-80{padding-top: 0.8rem;}
.pb-80{padding-bottom: 0.8rem;}
.pd-100{padding: 1rem 0;}
.pt-100{padding-top: 1rem;}
.pb-100{padding-bottom: 1rem;}
.pd-120{padding: 1.2rem 0;}
.pt-120{padding-top: 1.2rem;}
.pb-120{padding-bottom: 1.2rem;}
.pd-140{padding: 1.4rem 0;}
.pt-140{padding-top: 1.4rem;}
.pb-140{padding-bottom: 1.4rem;}
.pd-160{padding: 1.6rem 0;}
.pt-160{padding-top: 1.6rem;}
.pb-160{padding-bottom: 1.6rem;}
.pd-180{padding: 1.8rem 0;}
.pt-180{padding-top: 1.8rem;}
.pb-180{padding-bottom: 1.8rem;}
.mt30{margin-top: 0.3rem;}
.mt40{margin-top: 0.4rem;}
.mt50{margin-top: 0.5rem;}
.mt60{margin-top: 0.6rem;}
.mt70{margin-top: 0.7rem;}
.mt80{margin-top: 0.8rem;}
.mt90{margin-top: 0.9rem;}
.mt100{margin-top: 1rem;}
.mt110{margin-top: 1.1rem;}
.mt120{margin-top: 1.2rem;}
.mt130{margin-top: 1.3rem;}
.mt140{margin-top: 1.4rem;}
.flex-1 {flex: 1;}
/* flex布局 */
.flex {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
/*默认 主轴为水平方向，起点在左端*/
.f-dr {-webkit-box-orient: horizontal;-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;}
/*主轴为水平方向，起点在右端*/
.f-dr-r {-webkit-box-orient: horizontal;-webkit-flex-direction: row-reverse;-ms-flex-direction: row-reverse;flex-direction: row-reverse;}
/*主轴为垂直方向，起点在上沿*/
.f-dc {-webkit-box-orient: vertical;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;}
/*主轴为垂直方向，起点在下沿*/
.f-dc-r {-webkit-box-orient: vertical;-webkit-flex-direction: column-reverse;-ms-flex-direction: column-reverse;flex-direction: column-reverse;}
/* 交叉轴的起点对齐 */
.f-as {-webkit-box-align: start;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;}
/* 交叉轴的中点对齐 */
.f-ac {-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
/* 交叉轴的终点对齐 */
.f-ae {-webkit-box-align: end;-webkit-align-items: flex-end;-ms-flex-align: end;align-items: flex-end;}
/* 项目的第一行文字的基线对齐 */
.f-ab {-webkit-box-align: baseline;-webkit-align-items: baseline;-ms-flex-align: baseline;align-items: baseline;}
/* 交叉轴拉伸对齐 */
.f-ast {-webkit-align-items: stretch;-moz-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;}
/* 左对齐 */
.f-js {-webkit-box-pack: start;-webkit-justify-content: flex-start;-ms-flex-pack: start;justify-content: flex-start;}
/* 居中 */
.f-jc {-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
/* 右对齐 */
.f-je {-webkit-box-pack: end;-webkit-justify-content: flex-end;-ms-flex-pack: end;justify-content: flex-end;}
/* 两端对齐，项目之间的间隔都相等 */
.f-jsb {-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;}
/* 每个项目两侧的间隔相等。所以，项目之间的间隔比项目与边框的间隔大一倍 */
.f-jsa {-webkit-box-pack: distribute;-webkit-justify-content: space-around;-ms-flex-pack: distribute;justify-content: space-around;}
/* 换行，第一行在上方 */
.f-warp {-webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;-ms-flex-wrap: wrap;-o-flex-wrap: wrap;flex-wrap: wrap;}
/* 换行，在第一行的下方 */
.f-warp-r {-webkit-flex-wrap: wrap-reverse;-moz-flex-wrap: wrap-reverse;-ms-flex-wrap: wrap-reverse;-o-flex-wrap: wrap-reverse;flex-wrap: wrap-reverse;}
/* flex布局 */
.flex {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
/*默认 主轴为水平方向，起点在左端*/
.f-dr {-webkit-box-orient: horizontal;-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;}
/*主轴为水平方向，起点在右端*/
.f-dr-r {-webkit-box-orient: horizontal;-webkit-flex-direction: row-reverse;-ms-flex-direction: row-reverse;flex-direction: row-reverse;}
/*主轴为垂直方向，起点在上沿*/
.f-dc {-webkit-box-orient: vertical;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;}
/*主轴为垂直方向，起点在下沿*/
.f-dc-r {-webkit-box-orient: vertical;-webkit-flex-direction: column-reverse;-ms-flex-direction: column-reverse;flex-direction: column-reverse;}
/* 交叉轴的起点对齐 */
.f-as {-webkit-box-align: start;-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;}
/* 交叉轴的中点对齐 */
.f-ac {-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
/* 交叉轴的终点对齐 */
.f-ae {-webkit-box-align: end;-webkit-align-items: flex-end;-ms-flex-align: end;align-items: flex-end;}
/* 项目的第一行文字的基线对齐 */
.f-ab {-webkit-box-align: baseline;-webkit-align-items: baseline;-ms-flex-align: baseline;align-items: baseline;}
/* 交叉轴拉伸对齐 */
.f-ast {-webkit-align-items: stretch;-moz-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;}
/* 左对齐 */
.f-js {-webkit-box-pack: start;-webkit-justify-content: flex-start;-ms-flex-pack: start;justify-content: flex-start;}
/* 居中 */
.f-jc {-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
/* 右对齐 */
.f-je {-webkit-box-pack: end;-webkit-justify-content: flex-end;-ms-flex-pack: end;justify-content: flex-end;}
/* 两端对齐，项目之间的间隔都相等 */
.f-jsb {-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;}
/* 每个项目两侧的间隔相等。所以，项目之间的间隔比项目与边框的间隔大一倍 */
.f-jsa {-webkit-box-pack: distribute;-webkit-justify-content: space-around;-ms-flex-pack: distribute;justify-content: space-around;}
/* 换行，第一行在上方 */
.f-warp {-webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;-ms-flex-wrap: wrap;-o-flex-wrap: wrap;flex-wrap: wrap;}
/* 换行，在第一行的下方 */
.f-warp-r {-webkit-flex-wrap: wrap-reverse;-moz-flex-wrap: wrap-reverse;-ms-flex-wrap: wrap-reverse;-o-flex-wrap: wrap-reverse;flex-wrap: wrap-reverse;}
/* 头部 */
.Header-wrapper {position: fixed;width: 100%;left: 0;top: 0;background-color: transparent;z-index: 99;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
/* .Header-wrapper:after {content: "";position: absolute;left: 0;bottom: 0;z-index: 0;width: 100%;height: 1px;background-color: #fff;opacity: .3;transition: opacity .3s;} */
.Header-wrapper.on {box-shadow: 0 2px 10px rgb(0 0 0 / 5%);background-color: #fff;}
.Header-wrapper.black{box-shadow: 0 2px 10px rgb(0 0 0 / 5%);background-color: #001322;}
/* .Header-wrapper.on::after {opacity: 0;} */
/* #c-header.c-head-move {top: -100px;} */
.Header-container {}
.Header-container .logo {}
.Header-container .logo {}
.Header-container .logo a {display: flex;align-items: center;font-size: 0;}
.Header-container .logo a img{width: auto;display: block;height: 0.42rem;}
.Header-wrapper.on .Header-container .logo a img+img,.Header-wrapper.white_bg .Header-container .logo a img+img{
display: block;
}
.Header-container .logo a img+img,.Header-wrapper.on .Header-container .logo a img,.Header-wrapper.white_bg .Header-container .logo a img{
display: none;
}
.Header-container .fr {display: flex;align-items: center;font-size: 0;}
@media all and (min-width:1000px){
.Header-container .c-nav {display: flex;align-items: center;font-size: var(--f20);flex-wrap: wrap;font-weight: 700;}
.Header-container .c-nav>li {position: relative;margin-right: 0.6rem;line-height: 100px;}
.Header-container .c-nav>li .c-title-box{display: flex;align-items: center;justify-content: center;color: #fff;}
.Header-container .c-nav>li .c-title-box>a {display: block;}
.Header-container .c-nav>li.active .c-title-box,.Header-container .c-nav>li:hover .c-title-box{color: var(--theme-color) !important;}
.Header-container .c-nav>li .c-title-box i {margin-left: 0.06rem;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.Header-container .c-nav>li>ul {min-width: 240px;position: absolute;top: 100%;left: 50%;margin-top: 0;background-color: #fff;z-index: 2;-webkit-transform: translate(-50%, 10px);-ms-transform: translate(-50%, 10px);transform: translate(-50%, 10px);-webkit-border-radius: 2px;-ms-border-radius: 2px;border-radius: 2px;padding: 15px 20px;opacity: 0;pointer-events: none;-webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);-ms-transition: all .3s cubic-bezier(.645, .045, .355, 1);transition: all .3s cubic-bezier(.645, .045, .355, 1);box-shadow: 0 5px 50px rgb(0 0 0 / 10%);}
.Header-container .c-nav>li:hover>ul {pointer-events: all;-webkit-transform: translate(-50%);-ms-transform: translate(-50%);transform: translate(-50%);-webkit-transition-delay: .1s;-ms-transition-delay: .1s;transition-delay: .1s;opacity: 1;}
.Header-container .c-nav>li>ul>li:not(:last-child) {border-bottom: 1px solid #eee;}
.Header-container .c-nav>li>ul>li>a {display: block;position: relative;font-size: 16px;padding: 10px 0;color: #58595b;-webkit-transition: color .3s cubic-bezier(.645, .045, .355, 1);-ms-transition: color .3s cubic-bezier(.645, .045, .355, 1);transition: color .3s cubic-bezier(.645, .045, .355, 1);line-height: initial;text-align: left;}
.Header-container .c-nav>li>ul>li>a:before {content: "";position: absolute;top: 7px;bottom: 7px;left: -20px;width: 4px;background: var(--theme-color);-webkit-transform: scaleY(0);-ms-transform: scaleY(0);transform: scaleY(0);-webkit-transition: -webkit-transform .3s cubic-bezier(.162, .85, .45, 1);transition: transform .3s cubic-bezier(.162, .85, .45, 1);}
.Header-container .c-nav>li>ul>li:hover>a:before {-ms-transform-origin: top;-webkit-transform-origin: top;transform-origin: top;-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1)}
.Header-container .c-nav>li>ul>li:hover>a {color: var(--theme-color);}
.Header-wrapper .Header-container .c-nav>li .c-title-box{color: #fff;}
.Header-wrapper.on .Header-container .c-nav>li .c-title-box,.Header-wrapper.white_bg .Header-container .c-nav>li .c-title-box{color: #000;}
}
.Header-container .tool {display: flex;align-items: center;color: #fff;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.Header-wrapper.on .Header-container .tool,.Header-wrapper.white_bg .Header-container .tool{color: #000;}
.Header-container .tool .search {background-color: transparent;}
.Header-container .tool .search i {position: relative;font-size: 24px;/* padding-right: 0.18rem;margin-right: 0.2rem; */cursor: pointer;vertical-align: middle;}
/* .Header-container .tool .search i::after {position: absolute;content: '';right: 0;top: 50%;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);width: 1px;height: 20px;background-color: rgb(255, 255, 255, .3);}
.Header-wrapper.on .Header-container .tool .search i::after {background-color: rgb(0,0,0,.3);} */
.Header-container .tool .language {position: relative;}
.Header-container .tool .language a {display: flex;align-items: center;color: white;}
.Header-container .tool .language i {font-size: 24px;}
.Header-container .tool .language p {font-size: 16px;margin-left: 0.08rem;display: flex;align-items: center;}
.Header-container .tool .language p::after {display: inline-block;margin-left: 5px;content: "\e60a";font-size: 12px;font-family: 'iconfont';-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.Header-container .tool .language.on p::after {-webkit-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);-ms-transform: rotate(180deg);}
.Header-container .tool .language .language_down {display: none;position: absolute;z-index: 2;left: 5px;top: 100%;width: 100%;height: auto;background: var(--theme-color);text-align: left;-webkit-transition: top 0.3s;-moz-transition: top 0.3s;-ms-transition: top 0.3s;-o-transition: top 0.3s;transition: top 0.3s;}
.Header-container .tool .language .language_down a {display: block;font-size: 14px;line-height: 1.3;padding: 10px 15px;color: rgba(255, 255, 255, .8);-webkit-transition: 0.3s;-moz-transition: 0.3s;-ms-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;text-align: center;}
.Header-container .tool .language .language_down a:hover {background-color: #3F3B3A;}
.Header-wrapper.on .Header-container .tool .language>a,.Header-wrapper.white_bg .Header-container .tool .language>a{color: #000;}
/*顶部导航开关*/
#c-header .c-switch {display: none;width: 24px;height: 20px;cursor: pointer;}
#c-header .c-switch i {position: relative;display: block;height: 2px;background: #000;-webkit-transition: all 0.3s;transition: all 0.3s;}
#c-header .c-switch i:nth-child(1) {top: 0;}
#c-header .c-switch i:nth-child(3) {bottom: 0;}
#c-header .c-switch i:nth-child(2) {margin: 6px 0;}
#c-header.on .c-switch i {background: #333;}
body.c-open #c-header .c-switch i:nth-child(2) {opacity: 0;}
body.c-open #c-header .c-switch i:nth-child(1) {top: 8px;-webkit-transform: rotate(45deg);transform: rotate(45deg);}
body.c-open #c-header .c-switch i:nth-child(3) {bottom: 8px;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
@media (max-width: 1000px) {
#c-header .c-switch {display: block;}
.Header-wrapper{line-height: 60px;}
.Header-container .tool .search{height: 60px;}
.Header-container .c-nav{height: 0;}
.Header-container .tool{padding-right: 0.24rem;}
.Header-container .tool .language p{margin-left: 0.12rem;}
.Header-container .logo a img{height: 28px;}
.mt{margin-top: 60px;}
/*顶部移动端导航*/
#c-header .c-nav {position: absolute;top: 60px;left: 0;width: 100%;height: 0;line-height: 50px;background: #fff;overflow-y: auto;transition: all 0.5s;text-align: left;overflow-x: hidden;}
#c-header .c-nav>li:last-child {border-bottom: 1px solid #f1f1f1;}
#c-header .c-nav li {width: 100%;padding: 0 4%;border-top: 1px solid #f1f1f1;}
#c-header .c-nav li .c-title-box {display: flex;align-items: center;justify-content: space-between;}
#c-header .c-nav li a {display: block;color: #333;-webkit-transition: all 0.3s;transition: all 0.3s;font-size: 16px;min-width: calc(100% - 50px);}
#c-header .c-nav li i {font-size: 20px;color: #333;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out; width: 20px;height: 50px;text-align: center;line-height: 50px;}
#c-header .c-nav li.on .c-title-box i{transform: rotate(180deg);}
#c-header .c-nav li a:hover,
#c-header .c-nav li.on > a {color: var(--theme-color);}
#c-header .c-nav li ul {display: none;}
.c-open #c-header .c-nav {height: calc(100vh - 60px);}
}
@media (max-width: 768px) {
#c-header .c-nav li {padding: 0 4%;}
#c-header .c-nav ul li{font-size: 16px;line-height: 45px;}
}
/* ================= Mega Menu 样式 ================= */
/* ================= 1. Mega Menu 定位与防溢出 ================= */
@media all and (min-width: 1000px) {
.Header-container .c-nav > li.has-mega { position: relative; }
.Header-container .c-nav > li.has-mega > .mega-menu {
position: absolute;
top: 100%;
left: 50%;
transform: translate(-50%, 15px);
width: 850px; /* 固定宽度，非全屏 */
max-width: 90vw;
background-color: #fff;
z-index: 99;
border-radius: 4px;
opacity: 0;
pointer-events: none;
transition: all .4s cubic-bezier(.645, .045, .355, 1);
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
overflow: hidden;
font-weight: 400;
}
.Header-container .c-nav > li.has-mega:hover > .mega-menu {
pointer-events: all;
transform: translate(-50%, 0);
opacity: 1;
}
/* 【关键修复】最右侧的1~2个菜单，改为向右对齐，防止超出屏幕 */
.Header-container .c-nav > li:last-child > .mega-menu,
.Header-container .c-nav > li:nth-last-child(2) > .mega-menu {
left: auto;
right: 0;
transform: translate(0, 15px);
}
.Header-container .c-nav > li:last-child:hover > .mega-menu,
.Header-container .c-nav > li:nth-last-child(2):hover > .mega-menu {
transform: translate(0, 0);
}
}
/* ================= 2. 左右布局划分 ================= */
.mega-menu .mega-left { width: 45%; padding: 40px; }
.mega-menu .mega-right { width: 55%; padding: 40px; }
/* ================= 3. 右侧链接特效 (下划线 + 箭头) ================= */
.mega-menu .mega-list li { margin-bottom: 20px; line-height: 1.3;}
.mega-menu .mega-list li:last-child { margin-bottom: 0; }
.mega-link {
display: inline-flex;
align-items: center;
cursor: pointer;
}
.link-text {
position: relative;
padding-bottom: 5px;
color: #666;
font-size: 16px;
transition: color 0.3s;
}
/* 仅文字宽度的下划线 */
.link-text::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 0;
height: 2px;
background-color: var(--theme-color, #0055c8);
transition: width 0.3s ease;
}
/* 默认隐藏并偏左的箭头 */
.link-arrow {
opacity: 0;
transform: translateX(-6px);
color: var(--theme-color);
margin-left: 10px;
font-size: 14px;
transition: all 0.3s ease;
}
/* 悬停状态触发动画 */
.mega-list li:hover .link-text { color: #222; font-weight: 600;}
.mega-list li:hover .link-text::after { width: 100%; }
.mega-list li:hover .link-arrow { opacity: 1; transform: translateX(0); }
/* ================= 4. 左侧淡入动画 ================= */
.mega-fade-enter { animation: megaFadeIn 0.4s ease forwards; }
@keyframes megaFadeIn {
0% { opacity: 0; transform: translateY(5px); }
100% { opacity: 1; transform: translateY(0); }
}
/* ================= 1. 右侧链接悬停特效 (下划线 + 箭头) ================= */
.mega-link {
display: inline-flex;
align-items: center;
padding: 5px 0;
}
.mega-link .link-text {
position: relative;
}
/* 默认隐藏下划线 (宽度为0) */
.mega-link .link-text::after {
content: '';
position: absolute;
left: 0;
bottom: -2px; /* 下划线距离文字的距离 */
width: 0;
height: 2px;
background-color: var(--theme-color); /* 使用您的主题色变量 */
transition: width 0.3s ease;
}
/* 默认隐藏右箭头 (透明度0，且向左偏移) */
.mega-link .link-arrow {
opacity: 0;
transform: translateX(-10px);
color: var(--theme-color);
margin-left: 8px;
transition: all 0.3s ease;
}
/* 鼠标触碰 li 时的状态变化 */
.mega-list li:hover .mega-link {
color: #000; /* 触碰后文字颜色加深 */
}
.mega-list li:hover .link-text::after {
width: 100%; /* 下划线从左到右展开 */
}
.mega-list li:hover .link-arrow {
opacity: 1; /* 箭头显现 */
transform: translateX(0); /* 箭头向右滑入归位 */
}
/* ================= 2. 修复最右侧菜单超出屏幕的问题 ================= */
/*
您原来的代码是 left: 50%; transform: translate(-50%, ...);
这会导致最右侧的菜单向右溢出。
这里强制让导航栏最后两个 li 的下拉菜单向右对齐。
*/
@media all and (min-width: 1000px) {
.Header-container .c-nav > li:last-child > .mega-menu,
.Header-container .c-nav > li:nth-last-child(2) > .mega-menu {
left: auto;
right: 0;
transform: translate(0, 15px);
}
.Header-container .c-nav > li:last-child:hover > .mega-menu,
.Header-container .c-nav > li:nth-last-child(2):hover > .mega-menu {
transform: translate(0, 0);
}
}
/* ================= 手机端适配 (小于 1000px) ================= */
@media all and (max-width: 999px) {
/* 1. 隐藏左侧图文展示，手机端只显示纯净的链接列表 */
.mega-menu .mega-left {
display: none;
}
/* 2. 右侧列表占满全宽 */
.mega-menu .mega-right {
width: 100%;
padding: 15px 20px;
background-color: #f8f9fa; /* 给子菜单加个浅色背景区分层级 */
}
.mega-menu .mega-right ul{
display: block !important;
}
/* 3. 下拉菜单改为静态定位，默认隐藏，由 JS 控制 slideToggle */
.Header-container .c-nav > li.has-mega > .mega-menu {
position: static;
width: 100%;
transform: none;
box-shadow: none;
opacity: 1;
pointer-events: auto;
display: none; /* 核心：默认隐藏 */
}
/* 取消 PC 端的 hover 自动展开，防止手机端误触 */
.Header-container .c-nav > li.has-mega:hover > .mega-menu {
transform: none;
}
/* 4. 手机端没有 hover，直接让右侧箭头默认显示即可 */
.mega-link .link-arrow {
opacity: 1;
transform: translateX(0);
color: #999;
}
/* 5. 调整父级标题栏，让文字和箭头两端对齐，方便点击 */
.c-title-box {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
/* 扩大箭头的点击热区，提升手机端点击体验 */
.c-title-box i {
padding: 10px 15px;
cursor: pointer;
font-size: 18px;
}
}
/* CHYN floating desktop navigation */
@media all and (min-width:1000px) {
.Header-wrapper { top: .28rem; background: transparent; box-shadow: none; }
.Header-wrapper .Header-container { width: 17.6rem; max-width: calc(100% - .8rem); min-height: 1rem; padding: 0 .36rem; background: rgba(255,255,255,.72); /* border: .01rem solid rgba(255,255,255,.62); */ border-radius: .5rem; box-shadow: 0 .04rem .08rem rgba(7,19,27,.1); -webkit-backdrop-filter: blur(.18rem) saturate(1.12); backdrop-filter: blur(.18rem) saturate(1.12); transition: width .35s ease, max-width .35s ease, padding .35s ease, border-color .35s ease, border-radius .35s ease, background .35s ease, box-shadow .35s ease; }
.Header-wrapper.on { top: 0; background: #fff; box-shadow: 0 .03rem .14rem rgba(7,19,27,.08); }
.Header-wrapper.on .Header-container { width: 100%; max-width: none; padding: 0 .6rem; border-color: transparent; border-radius: 0; background: #fff; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.Header-container .c-nav>li { margin-right: .42rem; line-height: 1rem; }
.Header-wrapper .Header-container .c-nav>li .c-title-box { color: #111827; }
.Header-wrapper .Header-container .logo a img { display: none; }
.Header-wrapper .Header-container .logo a img+img { display: block; }
.Header-container .tool { gap: .16rem; color: #111827; }
.Header-container .tool .search { width: .5rem; height: .5rem; display: flex; align-items: center; justify-content: center; border: .01rem solid #333; border-radius: 50%;color: #fff;cursor: pointer;}
.Header-container .tool .search i { font-size: var(--f22); }
.chyn-header-inquiry { min-height: .52rem; padding: .12rem .2rem; display: inline-flex; align-items: center; justify-content: center; gap: .09rem; color: #fff; border-radius: .36rem; background: var(--theme-color); transition: background .3s ease, transform .3s ease; }
.chyn-header-inquiry svg { width: .2rem; height: .2rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.chyn-header-inquiry:hover { color: #fff; background: #007c68; transform: translateY(-.02rem); }
.Header-container .c-nav>li.chyn-product-nav{position:static;}
.Header-container .c-nav>li.chyn-product-nav>.chyn-product-mobile-nav{display:none;}
.chyn-product-mega{position:fixed;left:0;right:0;top:1.28rem;z-index:98;background:linear-gradient(90deg,#f4f7f7 0,#f4f7f7 calc(50% - 3.8rem),#fff calc(50% - 3.8rem),#fff 100%);box-shadow:0 .18rem .42rem rgba(7,25,35,.14);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(.12rem);transition:opacity .3s ease,visibility .3s ease,transform .3s ease,top .3s ease;}
.Header-wrapper.on .chyn-product-mega,body.chyn-inner-fixed-nav .chyn-product-mega{top:1rem;}
.Header-container .c-nav>li.chyn-product-nav:hover>.chyn-product-mega,.Header-container .c-nav>li.chyn-product-nav:focus-within>.chyn-product-mega{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);}
.chyn-product-mega-inner{display:grid;grid-template-columns:4.2rem minmax(0,1fr);height:min(5.8rem,calc(100vh - 1.28rem));min-height:5.2rem;overflow:hidden;background:transparent;}
.chyn-product-mega-categories-shell{position:relative;min-height:0;background:#f4f7f7;box-shadow:-50vw 0 0 50vw #f4f7f7;}
.chyn-product-mega-categories{height:100%;min-height:0;padding:.34rem .28rem .38rem .26rem;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;}
.chyn-product-mega-categories::-webkit-scrollbar,.chyn-product-mega-scroll::-webkit-scrollbar,.chyn-news-toc #catalog::-webkit-scrollbar{display:none;width:0;}
.chyn-product-mega-label{margin-bottom:.24rem;color:#172a31;letter-spacing:-.01em;line-height:1.2;}
.chyn-product-mega-tab{display:flex;width:100%;min-height:.62rem;align-items:center;justify-content:space-between;gap:.18rem;padding:.13rem .15rem .13rem .18rem;border:0;border-radius:.1rem;background:transparent;color:#39474e;text-align:left;cursor:pointer;transition:color .25s ease,background-color .25s ease,box-shadow .25s ease,transform .25s ease;}
.chyn-product-mega-tab+.chyn-product-mega-tab{margin-top:.07rem;}
.chyn-product-mega-tab-name{line-height:1.35;}
.chyn-product-mega-tab-arrow{display:flex;flex:0 0 .34rem;width:.34rem;height:.34rem;border-radius:50%;background:rgba(255,255,255,.72);color:#87959b;transition:color .25s ease,background-color .25s ease,transform .25s ease;}
.chyn-product-mega-tab-arrow i{margin:auto;transition:transform .25s ease;}
.chyn-product-mega-tab:hover,.chyn-product-mega-tab.is-active{background:#fff;color:var(--theme-color);box-shadow:0 .08rem .24rem rgba(27,56,51,.08);transform:translateX(.04rem);}
.chyn-product-mega-tab:hover .chyn-product-mega-tab-arrow,.chyn-product-mega-tab.is-active .chyn-product-mega-tab-arrow{background:var(--theme-color);color:#fff;transform:translateX(.02rem);}
.chyn-product-mega-tab:hover .chyn-product-mega-tab-arrow i,.chyn-product-mega-tab.is-active .chyn-product-mega-tab-arrow i{transform:translateX(.01rem);}
.chyn-product-mega-tab:focus-visible{outline:.02rem solid var(--theme-color);outline-offset:.02rem;}
.chyn-product-mega-content{min-width:0;padding:.34rem .34rem .38rem;overflow:hidden;background:#fff;}
.chyn-product-mega-panel{display:none;height:100%;}
.chyn-product-mega-panel.is-active{display:flex;min-height:0;flex-direction:column;}
.chyn-product-mega-head{min-height:.5rem;align-items:center;padding-bottom:.08rem;}
.chyn-product-mega-title{max-width:72%;color:#18242a;line-height:1.3;}
.chyn-product-mega-all{display:inline-flex;align-items:center;gap:.09rem;color:#5d696f;transition:color .25s ease;}
.chyn-product-mega-all i{transition:transform .25s ease;}
.chyn-product-mega-all:hover{color:var(--theme-color);}
.chyn-product-mega-all:hover i{transform:translateX(.04rem);}
.chyn-product-mega-scroll-shell{position:relative;flex:1;min-height:0;margin-top:.16rem;}
.chyn-product-mega-scroll{height:100%;min-height:0;padding:.06rem .18rem .1rem .02rem;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;}
.chyn-product-mega-categories-shell>.chyn-scroll-track{right:.1rem;top:.34rem;bottom:.38rem;}
.chyn-product-mega-scroll-shell>.chyn-scroll-track{right:.02rem;top:.06rem;bottom:.1rem;}
.chyn-product-mega-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.18rem .22rem;}
.chyn-product-mega-card{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto;min-height:1.95rem;align-items:stretch;gap:.1rem;padding:.1rem;border-radius:.08rem;background:transparent;color:#28343a;transition:color .3s ease,background-color .3s ease,box-shadow .3s ease,transform .3s ease;}
.chyn-product-mega-card-media{display:block;width:100%;overflow:hidden;border-radius:.06rem;background:#fff;}
.chyn-product-mega-card-media img{object-fit:contain;transition:transform .4s ease;}
.chyn-product-mega-card-title{display:-webkit-box;align-self:start;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-height:1.35;}
.chyn-product-mega-card:hover{background:#f7f9f9;color:var(--theme-color);box-shadow:0 .08rem .22rem rgba(7,25,35,.08);transform:translateY(-.03rem);}
.chyn-product-mega-card:hover img{transform:scale(1.05);}
}
/* 底部 */
.Footer-wrapper {
position: relative;
background: #f5f5f8;
background: #F3F5F7 url('../images/i_foot_bg_01.jpg') no-repeat center/cover;
background-size: 45% auto;
background-position: 100% 100%;
}
.Footer-wrapper::before, .Footer-wrapper::after {
content: '';
width: 50%;
height: .08rem;
position: absolute;
left: 0;
top: 0;
background: var(--theme-color);
/* display: none; */
}
.Footer-wrapper::after {
left: auto;
right: 0;
background: #808080;
}
.Footer-container {}
/* .Footer-container .top {border-bottom: 1px solid rgba(255, 255, 255, 0.15);padding: 0.36rem 0;display: inline-block;width: 100%;}
.Footer-container .top .foot_logo {}
.Footer-container .top .foot_logo img {height: 0.52rem;}
.Footer-container .toate(180degp .foot_link {} */
.media_ul {}
.media_ul li {margin-right: 8px;}
.media_ul li:last-child {margin-right: 0;}
.media_ul li a {display: flex;align-items: center;justify-content: center;width: 0.4rem;height: 0.4rem;background-color: #3b5999;color: white;border-radius: 3px;font-size: 0;}
.media_ul li a i {font-size: var(--f20);}
.media_ul li a {background-color: rgb(0,0,0,.5);}
/* .media_ul li:nth-child(1) a {background-color: #1278F3;}
.media_ul li:nth-child(2) a {background-color: #0A66C2;}
.media_ul li:nth-child(3) a {background-color: #FB0204;}
.media_ul li:nth-child(4) a {background-color: #1D9BF0;}
.media_ul li:nth-child(5) a {background-color: #DA4369;}
.media_ul li:nth-child(6) a {background-color: #FF0013;}
.media_ul li:nth-child(7) a {background-color: #04C15F;} */
.Footer-container .mid {padding: 0.8rem 0 0.4rem;}
.Footer-container .mid .fl{
width: 25%;
}
.Footer-container .mid .fl .foot_logo{}
.Footer-container .mid .fl .foot_logo img{
height: 0.48rem;
}
.Footer-container .mid .fl .foot_txt{
}
.Footer-container .mid .fl .foot_link{}
.Footer-container .mid .fr{
width: 25%;
}
.Footer-container .mid .fr .tit{
position: relative;
padding-bottom: 0.15rem;
}
.Footer-container .mid .fr .tit::after{
position: absolute;
content: "";
width: 100%;
height: 2px;
background-color: #FFFFFF1A;
left: 0;
bottom: 0;
}
.Footer-container .mid .fr .tit:before{
position: absolute;
content: "";
width: 0.8rem;
height: 2px;
background-color: var(--theme-color);
left: 0;
bottom: 0;
}
.Footer-container .mid .fr .tit
.Footer-container .mid .fr .des{}
.Footer-container .mid .fr .info{}
.Footer-container .mid .fr .info dl{
display: flex;
align-items: flex-start;
justify-content: space-between;
margin-top: 0.15rem;
}
.Footer-container .mid .fr .info dt{
}
.Footer-container .mid .fr .info dt i{
font-size: var(--f20);
line-height: 1.5;
}
.Footer-container .mid .fr .info dd{
flex: 1;
padding-left: 0.12rem;
font-size: var(--f16);
line-height: 1.5;
}
.Footer-container .mid>ul {
width: 35%;
}
.Footer-container .mid>ul li {float: left;overflow: hidden;min-width: 200px;max-width: 50%;}
.Footer-container .mid>ul li p {text-transform: uppercase;font-size: var(--f24);line-height: 1.5;color: #000;display: block;margin-bottom: 0.12rem;font-family: "RB";}
.Footer-container .mid>ul li p i{margin-left: 0.06rem;}
.Footer-container .mid>ul li p{
position: relative;
padding-bottom: 0.15rem;
}
.Footer-container .mid>ul li p::after{
position: absolute;
content: "";
width: 100%;
height: 2px;
background-color: #FFFFFF1A;
left: 0;
bottom: 0;
}
.Footer-container .mid>ul li p:before{
position: absolute;
content: "";
width: 0.8rem;
height: 2px;
background-color: var(--theme-color);
left: 0;
bottom: 0;
}
.Footer-container .mid>ul li .foot_nav_title { position: relative; display: block; margin-bottom: .12rem; padding-bottom: .15rem; color: #000; font-family: "RB"; font-size: var(--f24); line-height: 1.5; text-transform: uppercase; }
.Footer-container .mid>ul li .foot_nav_title::after { position: absolute; content: ""; width: 100%; height: .01rem; left: 0; bottom: 0; background: rgba(0,0,0,.1); }
.Footer-container .mid>ul li .foot_nav_title::before { position: absolute; z-index: 1; content: ""; width: .8rem; height: .01rem; left: 0; bottom: 0; background: var(--theme-color); }
.Footer-container .mid>ul li .foot_nav_link a {font-size: var(--f16);color: #333;line-height: 1.5;display: block;padding: 0.06rem 0;}
.Footer-container .mid>ul li a:hover {text-decoration: underline;}
.Footer-container .mid>ul li.lxwm {max-width: 450px;margin-right: 0;}
.Footer-container .mid>ul li dl {}
.Footer-container .mid>ul li dd {position: relative;font-size: 14px;line-height: 20px;color: rgb(0,0,0,.8);margin-bottom: 16px;padding-left: 26px;}
.Footer-container .mid>ul li dd:last-child{margin-bottom: 0;}
.Footer-container .mid>ul li dd i {position: absolute;left: 0;top: 0;font-size: 18px;color: rgb(0,0,0,.8);}
.Footer-container .bot {font-size: var(--f16);line-height: 1.4;color: rgb(0,0,0,.8);text-align: center;padding: 0.3rem 0;border-top: 1px solid rgba(0,0,0,0.05);}
.Footer-container .bot a {font-size: var(--f16);color: rgb(0,0,0,.8);}
/* CHYN dark industrial footer */
.Footer-wrapper.i_foot_bg { color: rgba(255,255,255,.72); background: #101b22; }
.Footer-wrapper::before,.Footer-wrapper::after { display: none; }
.Footer-container .mid { padding-top: .72rem; }
.Footer-container .mid .fl .foot_txt,.Footer-container .mid .fr .des { color: rgba(255,255,255,.68); }
.Footer-container .mid>ul li p,.Footer-container .mid>ul li p a,.Footer-container .mid .fr .tit { color: #fff; }
.Footer-container .mid>ul li .foot_nav_title,.Footer-container .mid>ul li .foot_nav_title a { color: #fff; }
.Footer-container .mid>ul li .foot_nav_link a,.Footer-container .mid .fr .info dd,.Footer-container .mid .fr .info dd a { color: rgba(255,255,255,.68); }
.Footer-container .mid .fr .info dt i { color: #65d1b7; }
.Footer-container .mid>ul li .foot_nav_link a:hover,.Footer-container .mid .fr .info dd a:hover { color: #fff; text-decoration: none; }
.Footer-container .mid>ul li p::after,.Footer-container .mid .fr .tit::after { background: rgba(255,255,255,.13); }
.Footer-container .mid>ul li .foot_nav_title::after { background: rgba(255,255,255,.13); }
.media_ul li a { color: #fff; border: .01rem solid rgba(255,255,255,.18); background: rgba(255,255,255,.07); transition: color .3s ease, background .3s ease, border-color .3s ease, transform .3s ease; }
.media_ul li a:hover { color: #fff; border-color: var(--theme-color); background: var(--theme-color); transform: translateY(-.03rem); }
.Footer-container .bot { color: rgba(255,255,255,.5); border-top-color: rgba(255,255,255,.1); }
.Footer-container .bot a { color: rgba(255,255,255,.64); }
/* CHYN social links and floating contact shortcuts */
.chyn-footer-socials { display: flex; flex-wrap: wrap; align-items: center; gap: .1rem; }
.chyn-footer-social { width: .4rem; height: .4rem; display: inline-flex; align-items: center; justify-content: center; color: #fff; border-radius: .12rem; background: rgba(255,255,255,.09); font-size: var(--f18); line-height: 1; transition: color .3s ease, background .3s ease, transform .3s ease, box-shadow .3s ease; }
.chyn-footer-social:hover { color: #fff; background: var(--theme-color); transform: translateY(-.04rem); box-shadow: 0 .08rem .18rem rgba(0,0,0,.18); text-decoration: none; }
.chyn-footer-social-tiktok svg { width: .18rem; height: .18rem; fill: currentColor; }
.chyn-footer-social-x svg { width: .17rem; height: .17rem; fill: currentColor; }
.chyn-float-contact { position: fixed; right: .24rem; bottom: 1rem; z-index: 120; display: flex; flex-direction: column; gap: .1rem; }
.chyn-float-contact-link { width: .58rem; height: .58rem; position: relative; display: inline-flex; align-items: center; justify-content: center; color: #fff; border-radius: .17rem; background: #17343b; box-shadow: 0 .08rem .2rem rgba(7,22,28,.2); font-size: var(--f22); line-height: 1; transition: color .3s ease, background .3s ease, transform .3s ease, box-shadow .3s ease; }
.chyn-float-contact-link:hover { color: #fff; background: var(--theme-color); transform: translateX(-.04rem); box-shadow: 0 .12rem .25rem rgba(7,22,28,.27); text-decoration: none; }
.chyn-float-contact-link::after { content: attr(data-label); position: absolute; right: calc(100% + .1rem); top: 50%; padding: .08rem .12rem; color: #fff; border-radius: .07rem; background: #17343b; font-family: inherit; font-size: var(--f14); font-weight: 600; line-height: 1.2; white-space: nowrap; opacity: 0; pointer-events: none; transform: translate(.08rem,-50%); transition: opacity .25s ease, transform .25s ease; }
.chyn-float-contact-link:hover::after,.chyn-float-contact-link:focus-visible::after { opacity: 1; transform: translate(0,-50%); }
.chyn-float-whatsapp { background: #1c5c4d; }
.chyn-float-whatsapp i { font-size: var(--f28); }
/* 中间+共用部分 */
/* ind_banner */
.i_banner a{
display: block;
position: relative;
}
/* .i_banner a:before{
position: absolute;
content: "";
width: 100%;
height: 100%;
left: 0;
top: 0;
background-color: rgb(var(--theme-color-rgb),.75);
z-index: 1;
} */
.i_banner a img{
height: calc(100vh - 100px);
object-fit: cover;
}
.i_banner .ban_txt{
position: absolute;
width: 100%;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 2;
}
.i_banner .ban_txt .w50{
/* backdrop-filter: blur(10px); */
/* border-radius: 30px; */
}
.i_banner .ban_txt .tit{}
.i_banner .ban_txt .des{width: 11.43rem;max-width: 100%;}
.i_banner .btn{
display: inline-block;
padding: 0.18rem 0.4rem;
border-radius: 50px;
background-color: var(--theme-color);
color: #fff;
font-size: var(--f18);
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.i_banner .btn:hover{
background-color: var(--sec-theme-color);
}
.i_banner .btn i{
display: inline-block;
margin-left: 0.12rem;
transform: rotate(-45deg);
}
.i_banner .swiper-pagination{
bottom: 6% !important;
}
.i_banner .swiper-pagination-bullet, .i_mb_banner .swiper-pagination-bullet{
width: 0.6rem;
height: 0.03rem;
border-radius: 0;
opacity: .2;
}
.i_banner .swiper-pagination-bullet,.i_mb_banner .swiper-pagination-bullet{background-color: white;}
.i_banner .swiper-pagination-bullet-active,.i_mb_banner .swiper-pagination-bullet-active{background-color: white;opacity: 1;}
.i_banner .swiper-button-prev{
left: 2%;
}
.i_banner .swiper-button-next{
right: 2%;
}
.i_banner .swiper-button-prev,.i_banner .swiper-button-next{
width: 0.56rem;
height: 0.56rem;
background-color: rgb(255,255,255,.25);
border-radius: 50%;
}
.i_banner .swiper-button-prev::after,.i_banner .swiper-button-next::after{
color: rgb(255, 255, 255,.9);
font-size: 0.24rem;
}
/* md-sideBar */
.md-sideBar {position: fixed;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);right: 0.1rem;z-index: 200;box-shadow: 0 0.8rem 1.4rem 1px hsl(0deg 0% 80% / 35%);}
.md-sideBar .side_item {display: block;width: auto;position: relative;cursor: pointer;zoom: 1;}
.md-sideBar .side_item:hover .bd {right: 100%;opacity: 1;-webkit-transition: all 0.5s;transition: all 0.5s;width: auto;}
.md-sideBar .side_item .hd {width: 0.6rem;height: 0.6rem;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;border-bottom: 1px solid #ececec;position: relative;z-index: 202;background-color: #fff;}
.md-sideBar .side_item .hd i {font-size: 0.3rem;color: var(--theme-color);}
.md-sideBar .side_item .bd {color: var(--theme-color);position: absolute;right: 100%;top: 0;background-color: #fff;padding: 0 0.18rem;white-space: nowrap;-webkit-transition: all 0.5s;transition: all 0.5s;opacity: 0;right: 0;width: 0;overflow: hidden;font-size: 18px;line-height: 0.6rem;z-index: 201;}
.md-sideBar .side_item .bd.wx{padding: 0.08rem;}
.md-sideBar .side_item:hover .bd.wx{width: calc(100px + 0.16rem);}
.md-sideBar .side_item .bd img{width: 100px;height: 100px;}
/* tc_search s */
.tc_search {position: fixed;width: 100%;height: 100%;visibility: hidden;top: 0;left: 0;z-index: 10001;pointer-events: none;filter: alpha(opacity=0);-moz-opacity: 0;-khtml-opacity: 0;opacity: 0;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.tc_search.act {filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity: 1;visibility: visible;display: block;pointer-events: auto;}
.tc_search form {width: 9.6rem;max-width: 80%;margin: 0 auto;padding: 0 20px;border-bottom: 2px solid #eee;height: 0.7rem;position: relative;overflow: hidden;z-index: 2;}
.tc_search input {width: 80%;height: 0.7rem;font-size: 0.34rem;color: #c1c1c1;box-shadow: none;-webkit-appearance: none;float: left;border-right: 0;background: none;}
.tc_search input::placeholder {color: #c1c1c1;}
.tc_search button {max-width: 20%;height: 0.7rem;border: 0;line-height: 0.7rem;color: #c1c1c1;cursor: pointer;text-transform: uppercase;float: right;font-size: 0.48rem;background-color: transparent;}
.tc_search .search_bg {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, .85);z-index: 0;}
body.chyn-search-open { overflow: hidden; }
.tc_search .search_bg { max-width: none; }
/* tc_search e */
/* c_more s */
.c_more{display: block;border-radius: 3px;width: 180px;height: 55px;line-height: 55px;color: #fff;text-align: center;margin-top: 9vh;font-size: 0;transition: 0.36s;background-image: -moz-linear-gradient( 0deg, rgb(41,67,159) 0%, rgb(38,111,204) 100%);background-image: -webkit-linear-gradient( 0deg, rgb(41,67,159) 0%, rgb(38,111,204) 100%);background-image: -ms-linear-gradient( 0deg, rgb(41,67,159) 0%, rgb(38,111,204) 100%);}
.c_more span{display: inline-block;vertical-align: middle;font-size: 16px;}
.c_more i.fa{font-size: 18px;margin-left: 12px;vertical-align: middle;}
.c_more:hover{box-shadow: 3px 5px 12px 0 rgba(0, 0, 0, 0.12);transform: translateY(-3px);}
/* c_more e */
/* i_tit s */
.i_tit{
text-align: center;
}
.i_tit.tal{
text-align: left;
}
.i_tit span{
font-size: var(--f16);
color: var(--theme-color);
display: inline-block;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 700;
}
.i_tit span:before{
font-family: "iconfont";
content: "";
display: inline-flex;
align-items: center;
justify-content: center;
/* width: 0.26rem;
height: 0.26rem;
border-radius: 50%; */
font-size: var(--f16);
background-color: var(--theme-color);
/* color: #fff; */
color: var(--theme-color);
margin-right: 0.06rem;
vertical-align: middle;
font-weight: 700;
}
.i_tit span.color-white{
color: #fff;
}
.i_tit span.color-white:before{
background-color: #fff;
color: var(--theme-color);
}
.i_tit h3{
font-size: var(--f50);
font-family: "SSB";
line-height: 1.1;
color: #000;
margin-top: 0.12rem;
}
.i_tit p{
display: inline-block;
font-size: var(--f18);
line-height: 1.5;
color: #666;
margin-top: 0.12rem;
width: 12rem;
max-width: 100%;
}
.i_tit.color-white h3,.i_tit.color-white p{
color: #fff;
}
/* i_tit e */
/* i_tit2 s */
.i_tit2{text-align: center;margin-bottom: 0.5rem;}
.i_tit2 span{
display: inline-block;
color: var(--theme-color);
font-size: var(--f16);
font-weight: 600;
text-transform: uppercase;
margin-bottom: 0.1rem;
letter-spacing: 1px;
}
.i_tit2 h2{
font-size: var(--f46);
color: #111;
font-weight: 700;
line-height: 1.15;
}
.i_tit2 p{font-size: 18px;color: #47484b;line-height: 1.4;margin-top: 0.12rem;}
/* i_tit2 e */
/* c_ban */
.c_ban {position: relative;height: 5.2rem;background-repeat: no-repeat;background-position: center;background-size: cover;}
.c_ban:before{position: absolute;content: "";width: 100%;height: 100%;left: 0;top: 0;z-index: 3;background-color: rgb(0,0,0,.2);}
.c_ban .ban_txt {position: absolute;left: 50%;top: 50%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);color: #fff;text-align: center;z-index: 3;}
.c_ban .ban_txt h3 {font-size: 0.48rem;font-weight: 700;text-align: left;}
.c_ban .ban_txt p {font-size: 0.22rem;margin-top: 0.24rem;}
/* sort_nav */
.sort_nav {position: relative;box-shadow: 0 0 10px rgba(0, 0, 0, .15);z-index: 2;}
.sort_nav.no_shadow{box-shadow: none;}
.sort_nav .tit{display: none;color: white;padding: 0 4%;font-size: 14px;height: 42px;background: var(--color);align-items: center;color: #fff;}
.sort_nav .tit h3{font-size: 16px;text-align: left;-webkit-box-flex: 1;-webkit-flex: 1;flex: 1;}
.sort_nav .w16 {display: flex;justify-content: space-between;align-items: center;min-height: 80px;}
.sort_nav .c_form{
width: 50%;
transform: none;
}
.sort_nav .c_form input{
background-color: #f8f9f9;
padding-left: 0.3rem;
}
/* sort_nav_view */
.sort_nav_view {}
.sort_nav_view ul {display: flex;align-items: center;}
.sort_nav_view ul li {margin-left: 0.35rem;}
.sort_nav_view ul li a {position: relative;font-size: var(--f18);display: block;line-height: 80px;color: #111;}
.sort_nav_view ul li a:hover {color: var(--theme-color);}
.sort_nav_view ul li.active a {color: var(--theme-color);}
.sort_nav_view ul li.active a::after {content: "";display: block;width: 100%;height: 2px;position: absolute;bottom: -1px;left: 0;background-color: var(--theme-color);}
/* crumbs */
.crumbs {position: relative;}
.crumbs {padding-left: 25px;background: url('../images/ico_home.png') no-repeat center;background-position: 0 center;display: flex;align-items: center;}
.crumbs a {font-size: 18px;color: #666;display: inline-flex;align-items: center;}
.crumbs:before{
position: absolute;
content: "\e6b5";
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
font-family: "iconfont";
font-size: var(--f20);
}
.crumbs a:not(:last-child)::after {font: normal normal normal 14px/1 FontAwesome;content: "\f105";display: inline-block;margin: 0 0.08rem;}
.crumbs a:hover {color: var(--theme-color);}
/* bg */
.white_bg {background-color: white;}
.grey_bg {background-color: #fafafa;background-color: #EFF2F7;/* background-color: #f7f9fa; */}
/* com_page */
.com_page {display: flex;align-items: center;justify-content: center;padding-top: 0.55rem;}
.com_page a,.com_page span {width: .5rem;height: .5rem;border-radius: 50%;display: flex;align-items: center;justify-content: center;border: 1px solid #eee;font-size: var(--f16);color: #333;/* background: #fff; */margin: 0 .05rem;transition: all .3s;min-width: 32px;min-height: 32px;}
.com_page a.page-num-current,.com_page a:hover {border-color: var(--theme-color);background: var(--theme-color) !important;color: #fff;}
.com_page a:last-child,.com_page a:first-child {background-color: #eff2f7;}
.com_page a:last-child::after,.com_page a:first-child::after {font: normal normal normal 14px/1 FontAwesome;font-size: inherit;}
.com_page a:first-child::after {content: "\f104";}
.com_page a:last-child::after {content: "\f105";}
.com_page .com-page-disabled{background:#f5f7f8;color:#aeb7bb;cursor:not-allowed;}
.com_page .com-page-disabled:first-child::after,.com_page .com-page-disabled:last-child::after{font:normal normal normal 14px/1 FontAwesome;font-size:inherit;}
.com_page .com-page-disabled:first-child::after{content:"\f104";}
.com_page .com-page-disabled:last-child::after{content:"\f105";}
.no_page{font-size: var(--f18);font-family: "SSB" ;line-height: 5em;text-align: center;}
/* n_tit */
.n_tit{color: #212121;}
.n_tit p{font-size: 16px;line-height: 1.5;text-transform: uppercase;}
.n_tit h3{position: relative;font-size: 0.42rem;line-height: 1.3;font-weight: 700;/* padding-bottom: 0.15rem; */margin-bottom: 0.35rem;font-family: 'PB';}
/* .n_tit h3::after {content: '';display: block;width: 36px;height: 3px;background: var(--theme-color);position: absolute;left: 0;bottom: 0;} */
.n_tit.tac{text-align: center;}
.n_tit.tac h3::after{left: 50%;-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);}
/* morelink */
.morelink {display: inline-block;position: relative;font-size: 16px;line-height: 30px;color: #fff;padding: 10px 40px;background-color: var(--theme-color);border: 1px solid var(--theme-color);border-radius: 5px;text-transform: capitalize;transition: all 0.3s;cursor: pointer;}
.morelink:hover {color: var(--theme-color);}
/* btn-3 */
.btn-3 {position: relative;z-index: 1;overflow: hidden;}
.btn-3:before {content: '';width: 0;height: 0;-webkit-transform: rotate(360deg);border-style: solid;border-width: 0 0 0 0;border-color: transparent transparent transparent #fff;position: absolute;bottom: -5px;left: -5px;transition: all .5s;z-index: -1;}
.btn-3:after {content: '';width: 0;height: 0;-webkit-transform: rotate(360deg);border-style: solid;border-width: 0 0 0 0;border-color: transparent #fff transparent transparent;position: absolute;top: -5px;right: -5px;transition: all .5s;z-index: -1;}
.btn-3:hover:before {border-width: 300px 0 0 300px;}
.btn-3:hover:after {border-width: 0 300px 300px 0;}
/* swiper-page01 */
.swiper-page01.swiper-pagination-bullets.swiper-pagination-horizontal{bottom: 0;}
.swiper-page01.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.swiper-page01.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: var(--theme-color);width: 30px;height: 8px;border-radius: 4px;}
/* ====================首页样式========================= */
/* ====================内页样式========================= */
/* ====================关于样式========================= */
:root {
--yj-ab-theme: #0154A4; /* 深蓝色主题，可根据您的全局变量调整 */
--yj-ab-theme-hover: #155a8f;
--yj-ab-text-main: #333333;
--yj-ab-text-light: #666666;
--yj-ab-bg-light: #f8f9fa;
--yj-ab-border: #eaeaea;
--yj-ab-radius: 12px;
--yj-ab-transition: all 0.3s ease;
}
/* 针对本页面独立作用域的基础设置 */
.yj-ab-section {
color: var(--yj-ab-text-light);
font-size: 16px;
line-height: 1.5;
}
.yj-ab-title-ssb {
font-family: 'SSB', 'DR', sans-serif;
font-weight: 700;
color: var(--yj-ab-text-main);
}
/* ==================== 布局与公共类 ==================== */
.yj-ab-container {
width: 1600px;
margin: 0 auto;
padding: 0 20px;
max-width: 92%;
}
.yj-ab-section { padding: 80px 0; }
.yj-ab-bg-light { background-color: var(--yj-ab-bg-light); }
.yj-ab-text-center { text-align: center; }
.yj-ab-text-white, .yj-ab-text-white .yj-ab-title-ssb { color: #ffffff; }
.yj-ab-justify-center { justify-content: center; }
.mt-40 { margin-top: 40px; }
/* 网格系统 */
.yj-ab-grid { display: grid; gap: 30px; }
.yj-ab-grid-2 { grid-template-columns: repeat(2, 1fr); }
.yj-ab-grid-4 { grid-template-columns: repeat(4, 1fr); }
.yj-ab-grid-5 { grid-template-columns: repeat(5, 1fr); }
.yj-ab-align-center { align-items: center; }
/* 比例控制类 (Rect) */
[class*="yj-ab-rect-"]{height: auto;}
.yj-ab-rect-4-3 { aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--yj-ab-radius); }
.yj-ab-rect-16-9 { aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--yj-ab-radius); }
.yj-ab-rect-3-2 { aspect-ratio: 3 / 2; overflow: hidden; border-radius: var(--yj-ab-radius); }
.yj-ab-rect-4-3 img, .yj-ab-rect-16-9 img, .yj-ab-rect-3-2 img {
width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;
}
.yj-ab-rect-4-3:hover img, .yj-ab-rect-16-9:hover img, .yj-ab-rect-3-2:hover img {
transform: scale(1.05); /* 图片悬停微放大 */
}
/* 悬停浮动卡片 */
.yj-ab-hover-up { transition: var(--yj-ab-transition); }
.yj-ab-hover-up:hover {
transform: translateY(-8px);
box-shadow: 0 15px 30px rgba(0,0,0,0.08);
}
/* 按钮样式 */
.yj-ab-btn {
display: inline-flex; align-items: center; justify-content: center;
padding: 15px 35px; font-size: 16px; font-weight: 600;
border-radius: 30px; cursor: pointer;
}
.yj-ab-btn-primary { background-color: #0056b3; color: #fff; border: 2px solid #0056b3; }
.yj-ab-btn-primary:hover { background-color: #004494; border-color: #004494; }
.yj-ab-btn-outline { background-color: transparent; color: #fff; border: 2px solid #fff; }
.yj-ab-btn-outline:hover { background-color: #fff; color: var(--yj-ab-theme); }
.yj-ab-btn-light { background-color: #fff; color: var(--yj-ab-theme); border: 2px solid #fff; }
.yj-ab-btn-light:hover { background-color: #f0f0f0; }
/* 标题样式 */
.yj-ab-section-title { font-size: 42px; margin-bottom: 20px; line-height: 1.2; margin-top: 0; }
.yj-ab-section-desc { font-size: 18px; max-width: 1200px; margin: 0 auto 50px; text-align: center; }
/* ==================== 具体板块样式 ==================== */
/* 2. Company Profile */
.yj-ab-tag {
display: inline-block; font-size: 14px; font-weight: bold; color: var(--yj-ab-theme);
letter-spacing: 1px; margin-bottom: 15px; position: relative; padding-left: 40px;
}
.yj-ab-tag::before {
content: ''; position: absolute; left: 0; top: 50%; width: 30px; height: 2px; background-color: var(--yj-ab-theme);margin-top: -1px;
}
.yj-ab-profile-subtitle { font-size: 20px; color: var(--yj-ab-theme); margin-bottom: 25px; font-weight: 600; margin-top: 0; }
.yj-ab-profile-desc p { margin-bottom: 15px; font-size: 16px; }
/* 3. 卡片通用样式 */
.yj-ab-strength{
/* background: url('../images/yj-ab-strength-bg.jpg') no-repeat center/cover; */
}
.yj-ab-card {
background: #fff; padding: 40px 30px; border-radius: var(--yj-ab-radius); border: 1px solid var(--yj-ab-border);
}
.yj-ab-driven .yj-ab-grid{
/* 定义 3 列，每列宽度相等 (1fr 表示 1 份剩余空间) */
grid-template-columns: repeat(3, 1fr);
}
/* 关键：让最后一个卡片跨越两列 */
.yj-ab-driven .yj-ab-grid .yj-ab-card:last-child{
grid-column: span 2;
}
.yj-ab-icon {
width: 80px; height: 80px; background-color: #f0f4f8; color: var(--yj-ab-theme);
border-radius: 50%; display: flex; align-items: center; justify-content: center;
font-size: 24px; margin-bottom: 20px;
}
.yj-ab-icon img{
width: 50%;
}
.yj-ab-icon-blue { background-color: var(--yj-ab-theme); color: #fff; }
.yj-ab-card h4 { font-size: 20px; margin-bottom: 15px; margin-top: 0; }
/* 4. Factory Environment */
.yj-ab-factory-item { display: flex; align-items: center; gap: 50px; margin-bottom: 60px; }
.yj-ab-factory-item:last-child { margin-bottom: 0; }
.yj-ab-factory-item.yj-ab-row-reverse { flex-direction: row-reverse; }
.yj-ab-factory-img { flex: 1; }
.yj-ab-factory-text { flex: 1; }
.yj-ab-factory-text h3 { font-size: 28px; margin-bottom: 20px; margin-top: 0; }
.yj-ab-factory-text p+p{margin-top: 1em;}
/* 5. Quality Control */
.yj-ab-quality { background-color: var(--yj-ab-theme); background: linear-gradient(rgba(11, 59, 96, 0.96), rgba(11, 59, 96, 0.96)), url('../images/yj-ab-quality-bg.jpg') center/cover no-repeat;}
.yj-ab-quality-subdesc { max-width: 1000px; margin: 0 auto 50px; color: rgba(255,255,255,0.8); text-align: center; }
.yj-ab-qc-card {
position: relative; overflow: hidden; background: rgba(255,255,255,0.05);
border: 1px solid rgba(255,255,255,0.1); color: #fff;
}
.yj-ab-qc-card h4 { color: #fff; }
.yj-ab-qc-card p { color: rgba(255,255,255,0.8); margin-bottom: 0; }
.yj-ab-qc-num {
position: absolute; top: 10px; right: 10px; font-size: 100px; font-weight: 900;
color: rgba(255,255,255,0.05); line-height: 1;
}
/* 6. Certificates & 8. Exhibitions (Swiper) */
.yj-ab-swiper-wrapper { position: relative; padding: 0 50px; }
.yj-ab-swiper-wrapper .swiper{padding-bottom: 0.2rem;}
.yj-ab-cert-card {
background: #fff; padding: 20px; text-align: center;
border-radius: var(--yj-ab-radius); border: 1px solid var(--yj-ab-border);
}
.yj-ab-cert-icon { font-size: 50px; color: var(--yj-ab-theme); margin-bottom: 10px; }
.yj-ab-cert-card p { font-weight: 600; color: var(--yj-ab-text-main); margin-bottom: 0; }
.yj-ab-exhibit-card {
background: #fff; border-radius: var(--yj-ab-radius); border: 1px solid var(--yj-ab-border); overflow: hidden;
}
.yj-ab-exhibit-text { padding: 25px; }
.yj-ab-exhibit-text h4 { font-size: 20px; margin-bottom: 0; margin-top: 0; }
.yj-ab-exhibit-text p { margin-bottom: 0; }
/* Swiper 自定义按钮 */
.yj-ab-nav-btn {
color: var(--yj-ab-theme) !important; background: #fff; width: 40px !important; height: 40px !important;
border-radius: 50%; box-shadow: 0 4px 10px rgba(0,0,0,0.1); margin-top: -20px !important;
}
.yj-ab-nav-btn::after { font-size: 18px !important; font-weight: bold; }
.yj-ab-nav-btn.swiper-button-prev { left: 0 !important; }
.yj-ab-nav-btn.swiper-button-next { right: 0 !important; }
/* 9. OEM & ODM */
.yj-ab-oem { background: /* linear-gradient(rgba(11, 59, 96, 0.9), rgba(11, 59, 96, 0.9)), */ url('../images/yj-ab-oem.jpg') center/cover fixed; }
.yj-ab-oem-icon { font-size: 50px; margin-bottom: 20px; }
.yj-ab-oem-icon img{max-width: 0.64rem;display: inline-block;}
.yj-ab-oem-subtitle { font-size: 24px; margin-bottom: 20px; font-weight: 400; margin-top: 0; }
.yj-ab-oem-desc { max-width: 900px; margin: 0 auto 40px; font-size: 18px; color: rgba(255,255,255,0.8); }
/* 10. After-Sales */
.yj-ab-service-subtitle { font-size: 22px; color: var(--yj-ab-theme); margin-bottom: 20px; margin-top: 0; }
.yj-ab-service-cards .yj-ab-card { padding: 30px; }
/* 11. Join Us */
.yj-ab-join { background-color: var(--yj-ab-theme); background: url('../images/yj-ab-join-bg.jpg') center/cover}
.yj-ab-join-desc { font-size: 20px; max-width: 900px; margin: 0 auto 20px; }
.yj-ab-join-subdesc { font-size: 16px; max-width: 800px; margin: 0 auto; color: rgba(255,255,255,0.8); }
/* ==================== 响应式适配 ==================== */
@media (max-width: 1400px) {
.yj-ab-section-title { font-size: 36px; }
.yj-ab-hero-title { font-size: 46px; }
}
@media (max-width: 1200px) {
.yj-ab-grid-4, .yj-ab-grid-5 { grid-template-columns: repeat(3, 1fr); }
.yj-ab-factory-item { gap: 30px; }
}
@media (max-width: 992px) {
.yj-ab-grid-2, .yj-ab-grid-4, .yj-ab-grid-5 { grid-template-columns: repeat(2, 1fr); }
.yj-ab-factory-item, .yj-ab-factory-item.yj-ab-row-reverse { flex-direction: column; }
.yj-ab-factory-img, .yj-ab-factory-text { width: 100%; }
.yj-ab-section { padding: 60px 0; }
.yj-ab-hero { padding: 100px 0; }
}
@media (max-width: 768px) {
.yj-ab-grid-2, .yj-ab-grid-4, .yj-ab-grid-5 { grid-template-columns: 1fr; }
.yj-ab-hero-title { font-size: 36px; }
.yj-ab-section-title { font-size: 28px; }
.yj-ab-hero-btns { flex-direction: column; }
.yj-ab-swiper-wrapper { padding: 0 30px; }
.yj-ab-nav-btn { width: 30px !important; height: 30px !important; }
.yj-ab-nav-btn::after { font-size: 14px !important; }
}
/* ==========================================================================
About Us Page Styles (Zhejiang Hongyan Electric Co., Ltd.)
========================================================================== */
/* --- 通用辅助类 (仅作用于本页) --- */
.gap-10 { gap: 0.1rem; }
.gap-15 { gap: 0.15rem; }
.gap-20 { gap: 0.2rem; }
.object-contain { object-fit: contain; }
/* 纯色 SVG Icon 辅助 */
.yj-about-check-icon {
display: inline-block;
width: 0.2rem; height: 0.2rem;
background: url('data:image/svg+xml;utf8,') no-repeat center center;
background-size: contain;
}
.yj-about-check-icon.white {
background-image: url('data:image/svg+xml;utf8,');
}
.yj-about-arrow-icon {
display: inline-block;
width: 0.16rem; height: 0.16rem;
background: url('data:image/svg+xml;utf8,') no-repeat center center;
background-size: contain;
}
/* --- 1. Hero Section --- */
.yj-about-hero { min-height: 7.5rem; }
.yj-about-hero-mask { background: linear-gradient(90deg, rgba(0, 19, 34, 0.85) 0%, rgba(0, 19, 34, 0.4) 100%); }
.yj-about-tag {
font-size: var(--f14);
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 30px;
padding: 0.05rem 0.15rem;
margin: 0 0.15rem 0.15rem 0;
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(5px);
}
/* --- 2. Company Overview --- */
.yj-about-ov-text { text-align: justify; }
/* --- 3. Key Manufacturing Facts --- */
.yj-about-fact-card:hover { transform: translateY(-0.1rem); box-shadow: 0 15px 35px rgba(0,0,0,0.08); }
.yj-about-fact-card:hover .yj-about-fact-icon { transform: scale(1.1); }
/* --- 4. Development History (轮播图标版 修复截断与剪切) --- */
.px-20 { padding-left: 0.2rem; padding-right: 0.2rem; }
.yj-about-history-swiper {
position: relative;
/* 【关键修复】顶部增加 padding，防止圆点上半部分被 overflow:hidden 剪切 */
padding-top: 0.2rem !important;
}
/* 贯穿全局的时间线，不受 slide 间距影响 */
.yj-about-hist-global-line {
position: absolute;
top: 0.2rem; /* 与 swiper 的 padding-top 高度一致，确保与圆点居中对齐 */
left: 0;
width: 100%;
height: 2px;
background: #eee;
z-index: 1;
margin-top: -1px; /* 像素级对齐圆点中心 */
}
.yj-about-hist-dot {
width: 0.24rem;
height: 0.24rem;
top: 0;
left: 0;
transform: translateY(-50%);
border: 4px solid #ddd;
z-index: 2;
}
/* Hover 交互效果 */
.yj-about-hist-card:hover .yj-about-hist-dot {
border-color: var(--theme-color);
background: var(--theme-color);
box-shadow: 0 0 10px rgba(0, 91, 172, 0.4);
}
.yj-about-hist-card:hover .yj-about-hist-icon {
transform: translateY(-0.08rem) scale(1.05);
}
/* 调整左右箭头位置 */
.yj-about-history-swiper .swiper-button-prev,
.yj-about-history-swiper .swiper-button-next {
top: 50%;
color: var(--theme-color);
background: #fff;
width: 0.5rem;
height: 0.5rem;
border-radius: 50%;
box-shadow: 0 5px 15px rgba(0,0,0,0.08);
}
.yj-about-history-swiper .swiper-button-prev { left: 0; }
.yj-about-history-swiper .swiper-button-next { right: 0; }
.yj-about-history-swiper .swiper-button-prev:after,
.yj-about-history-swiper .swiper-button-next:after {
font-size: 0.2rem;
font-weight: bold;
}
/* --- 5. Manufacturing Environment --- */
.yj-about-env-swiper .swiper-pagination-bullet { background: #fff; opacity: 0.5; }
.yj-about-env-swiper .swiper-pagination-bullet-active { opacity: 1; background: var(--theme-color); }
.yj-about-env-tag {font-size: var(--f14);color: var(--theme-color);background: rgba(0, 91, 172, 0.1);padding: 0.08rem 0.16rem;border-radius: 4px;}
/* --- 6. Quality Control & Certifications --- */
.yj-about-cert-swiper.pb-40{
padding-bottom: var(--sp-40);
}
.yj-about-flow-num { width: 0.3rem; height: 0.3rem; font-weight: bold; font-size: var(--f14); }
.yj-about-cert-swiper { padding-bottom: 0.5rem; }
/* .yj-about-cert-swiper .swiper-slide { transition: all 0.3s ease; opacity: 0.5; transform: scale(0.85); }
.yj-about-cert-swiper .swiper-slide-active { opacity: 1; transform: scale(1); } */
.yj-about-cert-swiper .swiper-button-prev,
.yj-about-cert-swiper .swiper-button-next { color: var(--theme-color); }
/* --- 7. OEM & ODM --- */
.yj-about-oem-tag {font-size: var(--f14);color: #fff;background: rgba(255, 255, 255, 0.15);padding: 0.08rem 0.15rem;border-radius: 4px;border: 1px solid rgba(255, 255, 255, 0.2);}
/* --- 8. Product Capability --- */
.yj-about-pro-card:hover { transform: translateY(-0.05rem); box-shadow: 0 15px 30px rgba(0,0,0,0.08); }
/* --- 9. Culture & Values --- */
.yj-about-cul-mask { background: linear-gradient(to top, rgba(0, 19, 34, 0.9) 0%, rgba(0, 19, 34, 0.2) 60%, rgba(0, 19, 34, 0) 100%); }
.yj-about-cul-card:hover .yj-about-cul-mask { background: linear-gradient(to top, rgba(0, 91, 172, 0.9) 0%, rgba(0, 19, 34, 0.4) 100%); }
.yj-about-cul-desc { height: 0; opacity: 0; overflow: hidden; }
.yj-about-cul-card:hover .yj-about-cul-desc { height: auto; opacity: 1; margin-top: 0.1rem; }
/* --- 10. Global Cooperation --- */
.yj-about-glb-tag {
font-size: var(--f16);
color: var(--theme-color);
background: #fff;
padding: 0.1rem 0.2rem;
border-radius: 30px;
border: 1px solid var(--theme-color);
font-weight: 600;
transition: all 0.3s ease;
}
.yj-about-glb-tag:hover {
background: var(--theme-color);
color: #fff;
}
/* --- 通用按钮样式 (About 页面) --- */
.inline-flex { display: inline-flex; }
.ml-10 { margin-left: 0.1rem; }
.yj-about-btn {
height: 0.5rem;
padding: 0 0.3rem;
font-size: var(--f16);
font-weight: 600;
border-radius: 30px;
transition: all 0.3s ease;
cursor: pointer;
}
/* 主按钮 (实心主题色) */
.yj-about-btn.primary {
background: var(--theme-color);
color: #fff;
border: 1px solid var(--theme-color);
box-shadow: 0 4px 15px rgba(0, 91, 172, 0.3);
}
.yj-about-btn.primary:hover {
background: #fff;
color: var(--theme-color);
box-shadow: 0 6px 20px rgba(255, 255, 255, 0.2);
}
.yj-about-btn.primary svg {
transition: transform 0.3s ease;
}
.yj-about-btn.primary:hover svg {
transform: translateX(5px);
}
/* 幽灵按钮 (透明底白边，用于深色背景) */
.yj-about-btn.outline {
background: transparent;
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.5);
}
.yj-about-btn.outline:hover {
background: #fff;
color: var(--theme-color);
border-color: #fff;
}
/* 手机端按钮适配 */
@media screen and (max-width: 768px) {
.yj-about-btn-wrap.flex { flex-direction: column; width: 100%; }
.yj-about-btn { width: 100%; justify-content: center; margin-bottom: 0.15rem; }
}
/* ==========================================================================
响应式适配 (Responsive)
========================================================================== */
/* 平板端适配 (<1200px) */
@media screen and (max-width: 1200px) {
.yj-about-ov-wrap,
.yj-about-qc-wrap,
.yj-about-oem-wrap,
.yj-about-glb-wrap { flex-direction: column; }
.yj-about-ov-left, .yj-about-ov-right,
.yj-about-qc-box, .yj-about-qc-flow,
.yj-about-oem-txt, .yj-about-oem-list,
.yj-about-glb-txt, .yj-about-glb-img { width: 100%; margin-bottom: 0.4rem; }
.yj-about-fact-card, .yj-about-cul-card { width: 48%; margin-bottom: 0.4rem; }
.yj-about-pro-card { width: 48%; }
.yj-about-time-item { flex-direction: column !important; }
.yj-about-time-content, .yj-about-time-img { width: 100%; padding: 0 !important; text-align: left !important; }
.yj-about-time-img { margin-top: 0.3rem; }
.yj-about-timeline-line { left: 0; transform: none; }
.yj-about-time-dot { left: 0; top: 0; transform: translate(-4px, 0); }
.yj-about-time-content { padding-left: 0.4rem !important; }
.yj-about-env-mod { flex-direction: column !important; }
.yj-about-env-img, .yj-about-env-txt { width: 100%; padding: 0 !important; }
.yj-about-env-txt { margin-top: 0.3rem; }
}
/* 手机端适配 (<768px) */
@media screen and (max-width: 768px) {
.yj-about-hero { min-height: 5rem; padding-top: 1rem; }
.yj-about-hero-title { font-size: 0.42rem; }
.yj-about-fact-card, .yj-about-cul-card, .yj-about-pro-card { width: 100%; }
.yj-about-oem-box { padding: 0.4rem 0.2rem; }
.yj-about-oem-txt { padding: 0; }
.yj-about-oem-list { padding: 0.2rem; }
/* .yj-about-cert-swiper .swiper-slide { opacity: 1; transform: scale(1); } */
.yj-about-trust { padding: 0.8rem 0; }
.yj-about-trust-tags { flex-direction: column; align-items: flex-start; }
}
/* ====================产品样式========================= */
/* 产品列表 s */
/* 基础辅助类 */
.bg-theme { background-color: var(--theme-color); }
.color-theme { color: var(--theme-color); }
.box-shadow { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); }
.border-bottom { border-bottom: 1px solid #eee; }
.border-eee { border: 1px solid #eee; }
.cursor-pointer { cursor: pointer; }
.text-justify { text-align: justify; }
.border-none { border: none; }
/* ==================== 左侧边栏导航 (Sidebar) ========================= */
/* .sticky_sidebar {
position: -webkit-sticky;
position: sticky;
top: 1.2rem;
align-self: flex-start;
}
.yj-pro-menu > li { border-bottom: 1px solid #f5f5f5; }
.yj-pro-menu > li:last-child { border-bottom: none; }
.yj-pro-menu .menu-head>a{ padding: 0.15rem 0; }
.yj-pro-menu .menu-head a:hover { color: var(--theme-color); }
.yj-pro-menu > li.active .menu-head a { color: var(--theme-color); }
.yj-pro-menu > li.active .menu-head .toggle-btn { transform: rotate(180deg); color: var(--theme-color); }
/* 下拉箭头按钮，增加点击区域 */
.yj-pro-menu .toggle-btn { padding: 0 10px; font-size: 20px; }
/* 子菜单 (由 JS 控制显示隐藏，不再使用 display:block 行内样式) */
.yj-pro-menu .sub-menu { display: none; padding-bottom: 0.1rem; }
.yj-pro-menu .sub-menu li a {
display: block;
padding: 0.08rem 0 0.08rem 0.15rem;
font-size: var(--f16);
color: #666;
transition: all 0.3s;
}
.yj-pro-menu .sub-menu li a i { margin-right: 0.08rem; font-size: 12px; opacity: 0; transition: all 0.3s; }
.yj-pro-menu .sub-menu li a:hover,
.yj-pro-menu .sub-menu li a.active { color: var(--theme-color); padding-left: 0.2rem; }
.yj-pro-menu .sub-menu li a:hover i,
.yj-pro-menu .sub-menu li a.active i { opacity: 1; }
.yj-pro-rec-list .pic { width: 0.8rem; height: 0.8rem; flex-shrink: 0; }
.yj-pro-rec-list .pic img { width: 100%; height: 100%; object-fit: cover; }
.yj-pro-rec-list a:hover h4 { color: var(--theme-color); } */
/* ==================== 左侧边栏导航 (无限极菜单) ========================= */
.sticky_sidebar {
position: -webkit-sticky;
position: sticky;
top: 1.2rem;
align-self: flex-start;
}
.yj-pro-menu { list-style: none; padding: 0; margin: 0; }
/* 菜单项基础线 */
.yj-pro-menu li { border-bottom: 1px solid #f5f5f5; }
.yj-pro-menu li:last-child { border-bottom: none; }
/* 包含链接和箭头的头部 */
.yj-pro-menu .menu-head {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 0;
}
/* 菜单文字链接 */
.yj-pro-menu .menu-head a {
flex: 1;
font-size: 18px;
font-weight: 600;
color: #333;
transition: color 0.3s ease;
}
/* 下拉箭头按钮 */
.yj-pro-menu .menu-head .toggle-btn {
padding: 0 10px;
font-size: 20px;
color: #666;
cursor: pointer;
transition: transform 0.3s ease, color 0.3s ease;
}
/* 悬停与激活状态 */
.yj-pro-menu .menu-head a:hover { color: var(--theme-color); }
.yj-pro-menu li.active > .menu-head > a,.yj-pro-menu .sub-menu li.active>a{ color: var(--theme-color); }
.yj-pro-menu li.active > .menu-head > .toggle-btn {
transform: rotate(180deg);
color: var(--theme-color);
}
/* --- 子菜单递归样式 (核心) --- */
.yj-pro-menu .sub-menu {
display: none;
padding-left: 18px; /* 每一级自动向右缩进 18px */
padding-bottom: 10px;
}
/* 子菜单内的 li 不需要底边框 */
.yj-pro-menu .sub-menu li { border-bottom: none; }
/* 子菜单内的纯链接 (叶子节点) */
.yj-pro-menu .sub-menu > li > a {
display: block;
padding: 8px 0;
font-size: 15px;
color: #666;
transition: all 0.3s ease;
position: relative;
}
/* 给纯链接加个小横杠装饰，更有层级感 */
.yj-pro-menu .sub-menu > li > a::before {
content: '-';
margin-right: 8px;
color: #ccc;
transition: color 0.3s ease;
}
/* 子菜单链接悬停与激活 */
.yj-pro-menu .sub-menu > li > a:hover,
.yj-pro-menu .sub-menu > li > a.active {
color: var(--theme-color);
padding-left: 5px; /* 悬停时文字轻微右移 */
}
.yj-pro-menu .sub-menu > li > a:hover::before,
.yj-pro-menu .sub-menu > li > a.active::before {
color: var(--theme-color);
}
/* 覆盖深层嵌套时的 menu-head 样式 (让字号变小，字体变细) */
.yj-pro-menu .sub-menu .menu-head { padding: 8px 0; }
.yj-pro-menu .sub-menu .menu-head a { font-size: 16px; font-weight: 500; color: #555; }
.yj-pro-menu .sub-menu .menu-head .toggle-btn { font-size: 18px; }
/* ==================== 右侧产品网格 (Product List Grid) ========================= */
.yj-pro-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
align-items: flex-start;
gap: 0.3rem;
}
.yj-pro-card { border: 1px solid transparent; display: block;}
.yj-pro-card:hover { border-color: var(--theme-color); transform: translateY(-8px); }
.yj-pro-card:hover h3 { color: var(--theme-color); }
.yj-pro-btn {
display: inline-block;
padding: 0.1rem 0.3rem;
border: 1px solid var(--theme-color);
color: var(--theme-color);
border-radius: 50px;
}
.yj-pro-card:hover .yj-pro-btn {
background-color: var(--theme-color);
color: #fff;
}
/* 产品列表 e */
/* 产品详情 s */
/* ==================== 详情页板块间距管理 ========================= */
.yj-pro-detail-container .yj-pro-block {
margin-bottom: 0.4rem;
}
.yj-pro-detail-container .yj-pro-block:last-child {
margin-bottom: 0;
}
/* ==================== 详情页多图轮播 (Gallery) ========================= */
.yj-pro-gallery-main .pic { background-color: #fff; }
/* .yj-pro-gallery-thumbs .swiper-slide { opacity: 0.8; } */
.yj-pro-gallery-thumbs .swiper-slide-thumb-active,
.yj-pro-gallery-thumbs .swiper-slide:hover { opacity: 1; border-color: var(--theme-color); }
.yj-pro-thumbs-wrap {
padding: 0 35px;
}
/* 彻底隐藏 Swiper 原生箭头(伪元素和SVG) */
.yj-pro-thumbs-wrap .swiper-button-next::after,
.yj-pro-thumbs-wrap .swiper-button-prev::after,
.yj-pro-thumbs-wrap .swiper-button-next svg,
.yj-pro-thumbs-wrap .swiper-button-prev svg {
display: none !important;
content: none !important;
}
/* 强制重置按钮样式与垂直居中 */
.yj-pro-thumbs-wrap .swiper-button-next,
.yj-pro-thumbs-wrap .swiper-button-prev {
width: 25px;
height: 100%;
top: 0;
margin-top: 0 !important;
background-color: rgba(255, 255, 255, 0.8);
color: var(--theme-color);
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.yj-pro-thumbs-wrap .swiper-button-next { right: 0; }
.yj-pro-thumbs-wrap .swiper-button-prev { left: 0; }
/* 放大我们自己写的 i 标签，并强制 line-height 保证居中 */
.yj-pro-thumbs-wrap .swiper-button-next i,
.yj-pro-thumbs-wrap .swiper-button-prev i {
font-size: 20px;
line-height: 1;
}
.yj-pro-thumbs-wrap .swiper-button-next:hover,
.yj-pro-thumbs-wrap .swiper-button-prev:hover {
background-color: var(--theme-color);
color: #fff;
}
/* ==================== 详情页属性与操作按钮 ========================= */
.yj-pro-features { background: #f8f9f9; padding: 0.2rem; border-radius: 5px; border-left: 4px solid var(--theme-color); }
.yj-pro-features li { font-size: var(--f16); color: #333; line-height: 1.8; }
.yj-pro-features li strong { color: #000; display: inline-block; width: 1.6rem; }
.yj-pro-btn-solid {
padding: 0.15rem 0.4rem;
background-color: var(--theme-color);
color: #fff;
border-radius: 50px;
border: 2px solid var(--theme-color);
}
.yj-pro-btn-solid:hover { background-color: var(--sec-theme-color); border-color: var(--sec-theme-color); }
.yj-pro-btn-outline {
padding: 0.15rem 0.4rem;
background-color: transparent;
color: var(--theme-color);
border-radius: 50px;
border: 2px solid var(--theme-color);
}
.yj-pro-btn-outline:hover { background-color: var(--theme-color); color: #fff; }
/* ==================== 详情页 Tabs ========================= */
.yj-pro-tabs-nav a { position: relative; }
.yj-pro-tabs-nav a::after {
content: '';
position: absolute;
left: 50%;
bottom: -1px;
width: 0;
height: 3px;
background-color: var(--theme-color);
transition: all 0.3s ease;
transform: translateX(-50%);
}
.yj-pro-tabs-nav a:hover, .yj-pro-tabs-nav a.active { color: var(--theme-color); }
.yj-pro-tabs-nav a.active::after { width: 100%; }
.yj-pro-tab-pane { display: none; }
.yj-pro-tab-pane.active { display: block; }
.fade-in { animation: fadeIn 0.5s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
/* ==================== 左侧边栏搜索 (Sidebar Search) ========================= */
.yj-pro-search {
position: relative;
display: flex;
border: 1px solid #eee;
border-radius: 5px;
overflow: hidden;
transition: all 0.3s ease;
}
/* 当输入框获取焦点时，外层边框变色 */
.yj-pro-search:focus-within {
border-color: var(--theme-color);
box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
}
.yj-pro-search input {
flex: 1;
border: none;
padding: 12px 15px;
font-size: 14px;
font-family: 'Poppins', sans-serif;
outline: none;
color: #333;
background-color: #fafafa;
}
.yj-pro-search button {
width: 50px;
border: none;
background-color: var(--theme-color);
color: #fff;
font-size: 16px;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.yj-pro-search button:hover {
opacity: 0.9; /* 悬停时稍微变暗，兼容没有次级主题色的情况 */
}
/* ==================== 详情页文章排版 (H2, H3, H4) ========================= */
.yj-pro-detail-article h2 {
font-size: var(--f28);
line-height: 1.15;
font-weight: 700;
color: #000;
/* border-bottom: 2px solid #eee; */
padding-bottom: 0.1rem;
position: relative;
border: none !important;
padding-bottom: 0 !important;
}
/* .yj-pro-detail-article h2::after {
content: '';
position: absolute;
left: 0;
bottom: -2px;
width: 50px;
height: 2px;
background-color: var(--theme-color);
} */
.yj-pro-detail-article h3 {
font-size: var(--f24);
line-height: 1.1;
font-weight: 700;
margin-bottom: 0.15rem;
margin-top: 0.2rem;
border-left: 4px solid var(--theme-color);
padding-left: 0.15rem;
}
.yj-pro-detail-article h4 {
font-size: var(--f20);
line-height: 1.15;
font-weight: 700;
color: #444;
margin-bottom: 0.15rem;
margin-top: 0.2rem;
}
.yj-pro-detail-article p:not(:last-child){
margin-bottom: 1em;
}
.yj-pro-dl-list {
display: grid;
grid-template-columns: repeat(2, 1fr); /* PC端两列显示 */
gap: 15px; /* 两个dl之间的间距 */
margin: 25px 0; /* 上下外边距 */
}
.yj-pro-dl-list dl {
display: flex;
margin: 0;
border: 1px solid #eee;
border-radius: 5px;
overflow: hidden;
transition: all 0.3s ease;
}
.yj-pro-dl-list dl:hover {
border-color: var(--theme-color);
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
}
.yj-pro-dl-list dt {
width: 40%;
background-color: #f8f9f9;
color: #000;
font-weight: 600;
font-size: 16px;
padding: 12px 15px;
border-right: 1px solid #eee;
box-sizing: border-box;
display: flex;
align-items: center;
}
.yj-pro-dl-list dd {
width: 60%;
background-color: #fff;
color: #555;
font-size: 16px;
padding: 12px 15px;
margin: 0;
box-sizing: border-box;
display: flex;
align-items: center;
line-height: 1.5;
}
/* ==================== 内容区简单表格样式 ========================= */
.yj-pro-detail-article .scroll{
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.yj-pro-detail-article table {
border-collapse: collapse;
border: 1px solid #eee;
}
.yj-pro-detail-article table th,
.yj-pro-detail-article table td {
padding: 12px 15px;
border: 1px solid #eee;
}
/* .yj-pro-detail-article table thead th {
background-color: #f5f5f5;
color: #000;
font-weight: 600;
border-bottom: 2px solid var(--theme-color);
} */
.yj-pro-detail-article tbody tr:hover {
background-color: #f9f9f9;
}
/* 参数表格 (Specifications Tab) */
.yj-pro-table { border-collapse: collapse; }
.yj-pro-table th, .yj-pro-table td { border: 1px solid #eee; }
/* .yj-pro-table tr:nth-child(even) td { background-color: #fafafa; } */
/* ==================== 底部相关产品轮播 (Related Slider) ========================= */
.yj-pro-rel-slider {
padding-bottom: 60px;
}
.yj-pro-rel-slider .swiper-wrapper{
padding-top: 0.1rem;
}
/* 彻底隐藏 Swiper 原生箭头(伪元素和SVG) */
.yj-pro-rel-slider .swiper-button-next::after,
.yj-pro-rel-slider .swiper-button-prev::after,
.yj-pro-rel-slider .swiper-button-next svg,
.yj-pro-rel-slider .swiper-button-prev svg {
display: none !important;
content: none !important;
}
/* 强制重置按钮样式与垂直居中 */
.yj-pro-rel-slider .swiper-button-next,
.yj-pro-rel-slider .swiper-button-prev {
width: 40px;
height: 40px;
background-color: var(--theme-color);
border-radius: 50%;
color: #fff;
top: calc(50% - 20px);
bottom: 0;
margin-top: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.yj-pro-rel-slider .swiper-button-next { right: calc(0 - 20px); }
.yj-pro-rel-slider .swiper-button-prev { left: calc( 0 - 20px); }
/* 放大我们自己写的 i 标签，并强制 line-height 保证居中 */
.yj-pro-rel-slider .swiper-button-next i,
.yj-pro-rel-slider .swiper-button-prev i {
font-size: 24px;
line-height: 1;
}
.yj-pro-rel-slider .swiper-button-next:hover,
.yj-pro-rel-slider .swiper-button-prev:hover {
background-color: var(--sec-theme-color);
}
/* ==================== 底部留言表单 (Inquiry Form) ========================= */
.yj-pro-inquiry-form input,
.yj-pro-inquiry-form textarea {
border: 1px solid transparent;
transition: all 0.3s ease;
font-family: 'Poppins', sans-serif;
outline: none;
}
.yj-pro-inquiry-form input:focus,
.yj-pro-inquiry-form textarea:focus {
border-color: var(--theme-color);
background-color: #fff;
box-shadow: 0 0 10px rgba(1, 84, 164, 0.1);
}
/* 产品详情 e */
/* ==================== 响应式适配 (Responsive) ========================= */
@media screen and (max-width: 1400px) {
.yj-pro-grid { grid-template-columns: repeat(2, 1fr); }
}
@media screen and (max-width: 1000px) {
.chyn-service-page .chyn-service-copy,
.chyn-service-page .chyn-service-media { width: 100%; max-width: 100%; flex: 0 0 100%; }
.chyn-service-page .chyn-service-media { margin-top: .35rem; }
.yj-pro-sidebar { width: 100%; margin-bottom: 0.4rem; position: static; }
.yj-pro-content { width: 100%; }
.yj-pro-gallery { width: 100%; margin-bottom: 0.4rem; }
.yj-pro-summary { width: 100%; }
.yj-pro-features li strong { width: 1.5rem; }
}
@media screen and (max-width: 767px) {
.yj-pro-grid { grid-template-columns: 1fr; }
.yj-pro-tabs-nav { flex-wrap: wrap; }
.yj-pro-tabs-nav a { width: 100%; margin: 0 0 0.1rem 0; padding-bottom: 0.1rem; text-align: center; }
.yj-pro-inquiry-form input { width: 100%; }
.yj-pro-app-list li { width: 100%; }
.yj-pro-actions a { width: 100%; justify-content: center; margin-right: 0; }
.yj-pro-table th, .yj-pro-table td { display: block; width: 100%; }
.yj-pro-table th { border-bottom: none; }
}
/* ====================新闻样式========================= */
/* 新闻列表 s */
.n_newslist{}
.n_newslist ul{
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
align-items: flex-start;
row-gap: 0.3rem;
column-gap: 0.3rem;
}
.n_newslist ul li{}
.n_newslist ul li:nth-child(3n){
margin-right: 0;
}
.n_newslist ul li a{
display: block;
box-shadow: 0 0 0.3rem rgb(0 0 0 / .08);
}
.n_newslist ul li .info{
position: relative;
padding: 0.4rem 0.3rem 0.3rem;
}
.n_newslist ul li .date{
position: absolute;
left: 0.3rem;
bottom: 100%;
margin-bottom: -0.25rem;
z-index: 1;
width: 80px;
text-align: center;
}
.n_newslist ul li .date span{
display: block;
font-size: var(--f30);
line-height: 2.2;
color: #fff;
background-color: var(--theme-color);
}
.n_newslist ul li .date p{
background-color: #f3f4f7;
font-size: var(--f12);
line-height: 1.8;
}
.n_newslist ul li .tit{
height: 2.6em;
}
.n_newslist ul li .des{
height: 3em;
}
.n_newslist ul li .more::after{
color: var(--theme-color);
display: inline-block;
content: "\f0a9";
font-family: "FontAwesome";
font-size: 16px;
font-variant: normal;
font-weight: 600;
line-height: 1;
margin-left: 0.06rem;
position: relative;
text-shadow: none;
text-transform: none;
transition: all 0.3s ease 0s;
}
/* 新闻列表 e */
/* 新闻详情 s */
.n_news{
/* background-color: #eff1f5; */
}
.n_news .fl{
flex: 1;
width: calc(100% - 450px);
background-color: rgb(255, 255, 255);
box-shadow: 0 0 20px 0 rgba(84, 87, 93, .1);
}
.n_news .fl .top{}
.n_news .fl .top h3{
border-bottom: 1px solid rgb(221, 221, 221);
}
.n_news .fl .top .date{}
.n_news .fl .box{
padding: 0.6rem 0.7rem 0.3rem;
}
.n_news .fl .con{
}
/* .n_news .fl .con h2{
font-size: var(--f28);
line-height: 1.15;
color: #000;
font-weight: 600;
margin-bottom: 0.2rem;
}
.n_news .fl .con h3{
font-size: var(--f24);
line-height: 1.15;
color: #212121;
font-weight: 500;
margin-bottom: 0.12rem;
}
.n_news .fl .con h4{
font-size: var(--f20);
line-height: 1.15;
color: #333;
font-weight: 500;
margin-bottom: 0.08rem;
}
.n_news .fl .con p{
margin-bottom: 1em;
}
.n_news .fl .con a{
text-decoration: underline;
color: var(--theme-color);
}
.n_news .fl .con table{
max-width: 100%;
}
.n_news .fl .con table td,.n_news .fl .con table th{
border: 1px #eee solid;
padding: 0.06rem 0.04rem !important;
text-align: center;
} */
/* ==================================================
News Detail - Headings (H2, H3, H4, H5) Styles
================================================== */
/* 统一的基础设置：深色、加粗、合理的上下间距 */
.ar_article h2,
.ar_article h3,
.ar_article h4,
.ar_article h5 {
color: #222222;
font-weight: 700;
line-height: 1.4;
margin-top: 1.2em; /* 距离上一段远一点，拉开层次 */
margin-bottom: 0.6em; /* 距离下一段近一点，保持紧凑 */
}
/* H2：作为段落大标题，加一条极简的浅色底边框，显得非常规范 */
.ar_article h2 {
font-size: 26px;
padding-bottom: 12px;
border-bottom: 1px solid #eaeaea;
}
/* H3：中标题，纯文字靠字号区分 */
.ar_article h3 {
font-size: 24px;
}
/* H4：小标题 */
.ar_article h4 {
font-size: 20px;
}
/* H5：次级小标题 */
.ar_article h5 {
font-size: 18px;
color: #444444; /* 颜色稍微弱化一点 */
}
/* ==================================================
News Detail - Table (表格) Styles
================================================== */
/* 表格滚动外层容器：去掉 border，只做滚动控制 */
.ar_article .scroll {
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
margin: 25px 0;
/* 移除了 border 和 border-radius，避免与 table 边框冲突 */
}
/* 表格主体：边框加在这里 */
.ar_article table {
width: 100%;
min-width: 700px;
border-collapse: collapse;
border-spacing: 0;
border: 1px solid #eaeaea; /* 最外层边框 */
font-size: 15px;
color: #444444;
background-color: #ffffff;
}
.ar_article th,
.ar_article td {
padding: 14px 20px;
border: 1px solid #eaeaea; /* 内部网格线 */
vertical-align: middle;
line-height: 1.5;
}
.ar_article th p,
.ar_article td p{
margin-bottom: 0;
}
.ar_article th {
background-color: #f4f7f9;
color: #222222;
font-weight: 600;
text-align: left;
white-space: nowrap;
}
.ar_article tbody tr:nth-child(even) {
background-color: #fafbfc;
}
.ar_article tbody tr:hover {
background-color: #f0f5fa;
transition: background-color 0.3s ease;
}
/* ==================================================
News Detail - Paragraphs & Lists
================================================== */
/* P标签：增加底部留白和舒适的行高 */
.ar_article p {
font-size: 16px;
line-height: 1.75;
color: #444444;
margin-bottom: 1em; /* 底部外边距，拉开段落间距 */
}
/* 最后一个 P 标签不需要底部间距，避免撑大父容器 */
.ar_article p:last-child {
margin-bottom: 0;
}
.ar_article a{
color: var(--theme-color);
text-decoration: underline;
}
.ar_article strong{
font-weight: bold;
}
.ar_article span{
/* color: var(--sec-theme-color); */
color: #d32f2f;
}
/* 无序列表与有序列表 */
.ar_article ul,
.ar_article ol {
margin-bottom: 1.5em;
padding-left: 20px; /* 给默认的圆点/数字留出空间 */
color: #444444;
}
.ar_article ul {
list-style-type: disc; /* 实心圆点 */
}
.ar_article ol {
list-style-type: decimal; /* 数字序号 */
}
.ar_article li {
margin-bottom: 6px; /* 列表项之间的微小间距 */
line-height: 1.75;
list-style: disc;
}
.ar_article li:last-child {
margin-bottom: 0;
}
/* ================= 响应式适配 (Mobile) ================= */
@media (max-width: 768px) {
/* 手机端适当缩小标题字号 */
.ar_article h2 { font-size: 22px; }
.ar_article h3 { font-size: 20px; }
.ar_article h4 { font-size: 18px; }
.ar_article h5 { font-size: 16px; }
.ar_article p {font-size: 14px;}
/* 手机端表格内边距缩小，留出更多可视空间 */
.ar_article th,
.ar_article td {
padding: 8px 12px;
font-size: 14px;
}
}
/* ==================================================
News Detail - Blockquote (摘要/引用) Styles
================================================== */
.ar_article blockquote {
position: relative;
margin: 30px 0;
padding: 25px 30px 25px 40px;
background-color: #f8f9fa; /* 极浅的工业灰蓝背景 */
border-left: 4px solid var(--theme-color); /* 主题色左边框 */
border-radius: 0 8px 8px 0; /* 右侧微圆角，左侧直角贴合边框 */
font-size: 18px; /* 字体比正文稍微大一点 */
line-height: 1.8;
color: #444444; /* 字体颜色略深，提升辨识度 */
font-style: italic; /* 斜体增加引用感 */
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03); /* 极弱的阴影增加层次 */
z-index: 1;
overflow: hidden;
}
/* 添加一个纯 CSS 的巨大双引号作为背景水印，提升设计感 */
.ar_article blockquote::before {
content: "\201C"; /* 左双引号的 Unicode */
position: absolute;
top: -10px;
left: 10px;
font-size: 100px;
color: rgba(var(--theme-color-rgb), 0.08); /* 极透明的主题色 */
font-family: Georgia, serif; /* 强制使用带衬线的字体以确保双引号优雅 */
line-height: 1;
z-index: -1;
}
/* 确保 blockquote 内部的 p 标签样式正常 */
.ar_article blockquote p {
position: relative;
z-index: 2;
margin-bottom: 0; /* 如果只有一段，去掉底部多余间距 */
}
/* 如果有多个段落，除了最后一个，其他的保留间距 */
.ar_article blockquote p:not(:last-child) {
margin-bottom: 15px;
}
/* ================= 响应式适配 (Mobile) ================= */
@media (max-width: 768px) {
.ar_article blockquote {
padding: 20px;
font-size: 16px;
margin: 20px 0;
}
.ar_article blockquote::before {
font-size: 80px;
left: 5px;
top: -5px;
}
}
.n_news .fl .bot{
border-top: 1px #eee solid;
}
.n_news .fl .bot>div{
width: 45%;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.1rem;
}
.n_news .fl .prev{
text-align: left;
}
.n_news .fl .next{
text-align: right;
}
.n_news .fl .bot>div span{
font-weight: 600;
}
.n_news .fl .bot>div a{
color: #555;
display: inline-block;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
-webkit-flex: auto;
-moz-box-flex: 1;
-ms-flex: auto;
flex: auto;
width: 80%;
}
.n_news .fr{
width: 400px;
position: sticky;
top: 110px;
}
.n_news .fr .tab-con{
border-radius: 10px;
box-shadow: 0 0 20px 0 rgba(84, 87, 93, .1);
background-color: #fff;
}
.n_news .fr .tab-con h4{
padding: 20px 20px 0;
font-weight: 700;
}
.n_news .fr .blog-nav{
padding: 20px;
}
.n_news .fr .blog-nav li{
padding: 5px 0;
overflow: hidden;
}
.n_news .fr .blog-nav li a{
display: block;
}
.n_news .fr .blog-nav .one>a:before{
content: "";
display: inline-block;
width: 6px;
height: 6px;
margin-right: 0.08rem;
border-radius: 50%;
background-color: var(--theme-color);
vertical-align: middle;
margin-bottom: 3px;
}
.n_news .fr .blog-nav li a:hover{
text-decoration: underline;
}
.n_news .fr .blog-nav>li>ul{}
.n_news .fr .blog-nav>li>ul>li{}
#catalog .one>a{
font-weight: 600;
}
#catalog .two a {
margin-left: 0.12rem;
font-weight: 500;
}
.n_news .fr .recomm{
box-shadow: 0 0 20px 0 rgba(84, 87, 93, .1);
}
.n_news .fr .recomm h4{}
.n_news .fr .recomm ul{}
.n_news .fr .recomm ul li{
width: 100%;
}
.n_news .fr .recomm ul li+li{
margin-top: 0.2rem;
}
.n_news .fr .recomm ul li a{
display: flex;
align-items: center;
justify-content: space-between;
}
.n_news .fr .recomm ul li .img{
width: 120px;
}
.n_news .fr .recomm ul li .info{
width: calc(100% - 130px);
}
.n_news .fr .recomm ul li .info .tit{}
.n_news .fr .recomm ul li .info .date{}
/* 新闻详情 e */
/* ====================应用样式========================= */
/* 基础辅助类增强 */
.bg-theme { background-color: var(--theme-color); }
.color-theme { color: var(--theme-color); }
.box-shadow { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); }
.border-bottom { border-bottom: 1px solid #eee; }
/* 内页通用区块设置 */
.inner-section {
padding: 0.9rem 0;
}
.inner-sec-head {
margin-bottom: 0.5rem;
}
.inner-sec-head .sub-tit {
display: inline-block;
color: var(--theme-color);
font-size: var(--f16);
font-weight: 600;
text-transform: uppercase;
margin-bottom: 0.1rem;
letter-spacing: 1px;
}
.inner-sec-head .main-tit {
font-size: var(--f46);
color: #111;
font-weight: 700;
line-height: 1.2;
}
/* 方案列表 s */
.sol_grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.4rem;
}
.sol_card {
border: 1px solid #eee;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.sol_card:hover {
box-shadow: 0 15px 40px rgba(1, 84, 164, 0.1);
transform: translateY(-10px);
border-color: transparent;
}
.sol_card .info {
border-top: none;
}
.sol_more {
display: inline-flex;
align-items: center;
color: var(--theme-color);
transition: all 0.3s ease;
}
.sol_more i {
margin-left: 0.08rem;
transition: transform 0.3s ease;
}
.sol_card:hover .sol_more {
color: var(--sec-theme-color);
}
.sol_card:hover .sol_more i {
transform: translateX(5px);
}
/* 方案列表 e */
/* 方案详情 s */
.detail_content p {
margin-bottom: 0.2rem;
text-align: justify;
}
.detail_list li {
position: relative;
padding-left: 0.3rem;
margin-bottom: 0.15rem;
font-size: var(--f16);
line-height: 1.6;
color: #444;
}
.detail_list li i {
position: absolute;
left: 0;
top: 0.05rem;
color: var(--theme-color);
font-size: var(--f20);
}
.rel_pro_grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.3rem;
}
.rel_pro_item {
display: block;
border: 1px solid #eee;
transition: all 0.3s ease;
}
.rel_pro_item:hover {
box-shadow: 0 10px 20px rgba(0,0,0,0.08);
border-color: var(--theme-color);
}
.rel_pro_item:hover h4 {
color: var(--theme-color);
}
.side_form input, .side_form textarea {
border: 1px solid transparent;
transition: all 0.3s ease;
font-family: 'Poppins', sans-serif;
}
.side_form input:focus, .side_form textarea:focus {
border-color: var(--theme-color);
background-color: #fff;
box-shadow: 0 0 10px rgba(1, 84, 164, 0.1);
}
.side_form button:hover {
background-color: var(--sec-theme-color);
}
/* 右侧边栏跟随 (Sticky Sidebar) */
.sticky_sidebar {
position: -webkit-sticky;
position: sticky;
top: 1.2rem; /* 距离顶部的距离，可根据您网站实际的导航栏高度调整 */
align-self: flex-start; /* 必须加这个，否则在 flex 容器中会默认拉伸等高导致失效 */
}
/* 相关方案列表 (Related Solutions) */
.rel_sol_list li a:hover h4 { color: var(--theme-color); }
.rel_sol_list .pic { width: 0.8rem; height: 0.6rem; flex-shrink: 0; }
.rel_sol_list .pic img { width: 100%; height: 100%; object-fit: cover; }
/* 底部产品轮播 (Product Swiper) */
.rel_pro_slider { padding: 0.1rem 0.1rem 0.5rem; margin: -0.1rem; }
.rel_pro_item { display: block; border: 1px solid #eee; transition: all 0.3s ease; background: #fff; }
.rel_pro_item:hover { box-shadow: 0 10px 20px rgba(0,0,0,0.08); border-color: var(--theme-color); }
.rel_pro_item:hover h4 { color: var(--theme-color); }
/* 自定义轮播按钮样式 */
.rel_pro_slider .swiper-button-next,
.rel_pro_slider .swiper-button-prev {
width: 0.4rem;
height: 0.4rem;
background-color: var(--theme-color);
border-radius: 50%;
color: #fff;
top: auto;
bottom: 0;
margin: 0;
}
.rel_pro_slider .swiper-button-next { right: 45%; }
.rel_pro_slider .swiper-button-prev { left: 45%; }
.rel_pro_slider .swiper-button-next::after,
.rel_pro_slider .swiper-button-prev::after {
font-size: 0.18rem;
font-weight: bold;
}
.rel_pro_slider .swiper-button-next:hover,
.rel_pro_slider .swiper-button-prev:hover {
background-color: var(--sec-theme-color);
}
.side_form button{border: none;cursor: pointer;}
/* 表单样式 */
.side_form input, .side_form textarea { border: 1px solid transparent; transition: all 0.3s ease; }
.side_form input:focus, .side_form textarea:focus { border-color: var(--theme-color); background-color: #fff; box-shadow: 0 0 10px rgba(1, 84, 164, 0.1); }
.side_form button:hover { background-color: var(--sec-theme-color); }
/* 方案详情 e */
/* ==================== 响应式适配 (Responsive) ========================= */
@media screen and (max-width: 1200px) {
.sol_grid { gap: 0.2rem; }
.detail_left { width: 65%; }
.detail_right { width: 32%; }
}
@media screen and (max-width: 1000px) {
.sol_grid { grid-template-columns: repeat(2, 1fr); }
.detail_left { width: 100%; margin-bottom: 0.4rem; }
.detail_right { width: 100%; display: flex; gap: 0.2rem; }
.detail_right .sidebar_box { width: 50%; margin-bottom: 0; }
.rel_pro_grid { grid-template-columns: repeat(2, 1fr); }
}
@media screen and (max-width: 767px) {
.inner_ban { height: 3rem; }
.sol_grid { grid-template-columns: 1fr; }
.detail_right { flex-direction: column; gap: 0; }
.detail_right .sidebar_box { width: 100%; margin-bottom: 0.3rem; }
.rel_pro_grid { grid-template-columns: 1fr; }
.dl_item { flex-direction: column; align-items: flex-start; padding: 0.2rem; }
.dl_btn { margin-top: 0.2rem; width: 100%; justify-content: center; }
.dl_tabs a { width: 100%; text-align: center; margin: 0 0 0.1rem; }
.rel_sol_list .pic{width: 1.2rem;height: 0.9rem;}
}
/* ====================服务样式========================= */
/* 服务支持 s */
/* 服务支持 e */
/* 常见问题 s */
/* ================= 2. FAQ 手风琴 (FAQ Accordion) ================= */
.faq-accordion {
max-width: 14rem; /* 控制最大宽度，保证阅读体验 */
margin: 0 auto;
}
.faq-item {
margin-bottom: 0.2rem;
background: #fff;
border: 1px solid #e5e7eb;
border-radius: 4px;
transition: all 0.3s ease;
}
.faq-item.active {
border-color: var(--theme-color);
box-shadow: 0 8px 20px rgba(1, 172, 200, 0.08);
}
.faq-head {
padding: 0.25rem 0.3rem;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
background: #fdfdfd;
border-radius: 4px;
}
.faq-item.active .faq-head {
background: #fff;
}
.faq-q {
font-size: var(--f20);
color: #111;
font-weight: 600;
transition: color 0.3s;
padding-right: 0.3rem;
line-height: 1.4;
}
.faq-item:hover .faq-q,
.faq-item.active .faq-q {
color: var(--theme-color);
}
/* 加号/减号 动画图标 */
.faq-icon {
position: relative;
width: 18px;
height: 18px;
flex-shrink: 0;
}
.faq-icon::before, .faq-icon::after {
content: '';
position: absolute;
background: #111;
transition: all 0.3s ease;
}
.faq-icon::before {
top: 8px;
left: 0;
width: 18px;
height: 2px;
}
.faq-icon::after {
top: 0;
left: 8px;
width: 2px;
height: 18px;
}
.faq-item:hover .faq-icon::before,
.faq-item:hover .faq-icon::after,
.faq-item.active .faq-icon::before,
.faq-item.active .faq-icon::after {
background: var(--theme-color);
}
.faq-item.active .faq-icon::after {
transform: rotate(90deg);
opacity: 0;
}
.faq-body {
display: none;
padding: 0 0.3rem 0.3rem;
}
.faq-content {
font-size: var(--f16);
color: #666;
line-height: 1.75;
border-top: 1px dashed #e5e7eb;
padding-top: 0.25rem;
}
/* 常见问题 e */
/* 下载中心 s */
.dl_tabs a {
padding: 0.15rem 0.4rem;
color: #666;
background-color: #fff;
border: 1px solid #ddd;
margin: 0 0.1rem 0.2rem;
transition: all 0.3s ease;
}
.dl_tabs a:hover, .dl_tabs a.active {
background-color: var(--theme-color);
color: #fff;
border-color: var(--theme-color);
box-shadow: 0 5px 15px rgba(1, 84, 164, 0.2);
}
.dl_item {
border: 1px solid transparent;
}
.dl_item:hover {
border-color: var(--theme-color);
transform: translateY(-3px);
}
.dl_icon {
width: 0.8rem;
height: 0.8rem;
}
.dl_btn {
padding: 0.16rem 0.45rem;
}
.dl_item:hover .dl_btn {
background-color: var(--sec-theme-color);
}
/* 下载信息图标美化 */
.dl_meta span { display: inline-flex; align-items: center; }
.dl_meta i { color: var(--theme-color); font-size: var(--f18); }
/* 下载中心 e */
/* 视频中心 s */
/* 视频中心 e */
/* ====================联系样式========================= */
/* 联系我们 s */
.n_contact{}
.n_contact .fl{
width: 58%;
}
.n_contact .fl .con{}
.n_contact .fl form{}
.n_contact .fl .mui-input-row{
width: 48%;
margin-bottom: 0.15rem;
}
.n_contact .fl .mui-input-row input{
width: 100%;
font-size: var(--f16);
height: 0.6rem;
line-height: 0.6rem;
background: #F8F7FA;
border-radius: 0.05rem;
padding-left: 0.16rem;
border: none;
}
.n_contact .fl .mui-input-row.w100{
width: 100%;
}
.n_contact .fl .mui-input-row textarea{
font-size: var(--f16);
padding: 0.16rem;
line-height: 1.5;
width: 100%;
height: calc(9em + 0.32rem);
background: #F4F5F9;
border-radius: 0.05rem;
border: none;
}
.n_contact .fl .btn{}
.n_contact .fl .btn button{
display: inline-block;
background-color: var(--theme-color);
color: #fff;
padding: 0.2rem 0.5rem;
font-size: var(--f20);
text-transform: uppercase;
border: none;
}
.n_contact .fr{
width: 38%;
}
.n_contact .fr .des{}
.n_contact .fr .con{}
.n_contact .fr ul{}
.n_contact .fr ul li{
display: flex;
align-items: center;
justify-content: space-between;
}
.n_contact .fr ul li+li{
margin-top: 0.4rem;
}
.n_contact .fr ul li .icon{
display: flex;
align-items: center;
justify-content: center;
width: 80px;
height: 80px;
background-color: var(--theme-color);
}
.n_contact .fr ul li .icon:hover{
background-color: #000;
}
.n_contact .fr ul li .icon i{
font-size: var(--f30);
color: #fff;
}
.n_contact .fr ul li .text{
width: calc(100% - 100px);
line-height: 1.67;
}
.n_contact .fr ul li .text h5{
font-size: var(--f20);
font-weight: 600;
}
.n_contact .fr ul li .text p{
font-size: var(--f16);
line-height: 1.5;
margin-top: 0.05rem;
}
/* 联系我们 e */
/* ====================OEM样式========================= */
:root {
--chyn-oem-theme: #0b3b60; /* 主题深蓝 */
--chyn-oem-theme-light: #0154A4; /* 亮蓝色按钮/图标 */
--chyn-oem-text-main: #333333;
--chyn-oem-text-light: #666666;
--chyn-oem-bg-light: #f8f9fa;
--chyn-oem-border: #eaeaea;
--chyn-oem-radius: 12px;
--chyn-oem-transition: all 0.3s ease;
}
.chyn-oem-wwrapper{
color: var(--chyn-oem-text-light);
font-size: 16px;
line-height: 1.5;
background-color: #fff;
}
/* ==================== 公共布局类 ==================== */
.chyn-oem-container { position: relative; z-index: 2; }
.chyn-oem-section { padding: 80px 0; }
.chyn-oem-bg-light { background-color: var(--chyn-oem-bg-light); }
.chyn-oem-text-center { text-align: center; }
.chyn-oem-text-white { color: #ffffff; }
.chyn-oem-text-white .SSB { color: #ffffff; }
.chyn-oem-mx-auto { margin-left: auto; margin-right: auto; }
.chyn-oem-justify-center { justify-content: center; }
/* 悬停浮动效果 */
.chyn-oem-hover-up { transition: var(--chyn-oem-transition); }
.chyn-oem-hover-up:hover {
transform: translateY(-8px);
box-shadow: 0 15px 30px rgba(0,0,0,0.08);
}
/* 按钮样式 */
.chyn-oem-btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 15px 35px;
font-size: 16px;
font-weight: 600;
border-radius: 4px; /* 图中按钮偏方正 */
cursor: pointer;
text-align: center;
transition: var(--chyn-oem-transition);
}
.chyn-oem-btn-primary { background-color: var(--chyn-oem-theme-light); color: #fff; border: 2px solid var(--chyn-oem-theme-light); }
.chyn-oem-btn-primary:hover { background-color: #0b5ec2; border-color: #0b5ec2; color: #fff;}
.chyn-oem-btn-white { background-color: #fff; color: var(--chyn-oem-text-main); border: 2px solid #fff; }
.chyn-oem-btn-white:hover { background-color: #f0f0f0; color: var(--chyn-oem-theme-light); }
.chyn-oem-btn-outline { background-color: transparent; color: #fff; border: 2px solid #fff; }
.chyn-oem-btn-outline:hover { background-color: #fff; color: var(--chyn-oem-theme); }
/* 公共标题样式 */
.chyn-oem-tag-text {
font-size: 14px;
font-weight: bold;
color: var(--chyn-oem-theme-light);
letter-spacing: 1px;
margin-bottom: 10px;
text-transform: uppercase;
}
.chyn-oem-section-title {
font-size: 42px;
color: var(--chyn-oem-text-main);
margin-top: 0;
margin-bottom: 20px;
line-height: 1.2;
}
.chyn-oem-section-desc {
font-size: 18px;
max-width: 900px;
margin-bottom: 50px;
}
/* ==================== 1. Hero Section ==================== */
.chyn-oem-hero {
position: relative;
padding: 120px 0 80px; /* 底部留出空间给悬浮卡片 */
color: #fff;
}
.chyn-oem-hero-bg {
position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;
}
.chyn-oem-hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.chyn-oem-hero-bg::after {
content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
inset: 0;
/* background:linear-gradient(90deg,rgba(6, 37, 61, 0.92) 0%,rgba(1, 84, 164, 0.72) 45%,rgba(6, 37, 61, 0.55) 100%); */
background: linear-gradient(90deg, rgba(11, 59, 96, 0.98) 0%, rgba(11, 59, 96, 0.8) 100%);
}
.chyn-oem-hero-content { max-width: 900px; }
.chyn-oem-tag {
display: inline-block; padding: 5px 15px; background: rgba(255,255,255,0.1);
border: 1px solid rgba(255,255,255,0.3); font-size: 14px; margin-bottom: 20px;
}
.chyn-oem-hero-title { font-size: 54px; margin-top: 0; margin-bottom: 25px; line-height: 1.1; }
.chyn-oem-hero-desc { font-size: 20px; font-weight: 500; margin-bottom: 20px; }
.chyn-oem-hero-subdesc { font-size: 16px; opacity: 0.9; margin-bottom: 40px; }
.chyn-oem-hero-btns { display: flex; gap: 20px; }
/* Hero 悬浮卡片 */
.chyn-oem-hero-cards {
position: relative;
/* position: absolute; bottom: -80px; left: 50%; transform: translateX(-50%); */
display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; z-index: 3;margin-top: 0.5rem;
}
.chyn-oem-hero-card {
background: rgba(255,255,255,0.1); backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2); padding: 35px 30px;
color: #fff; border-radius: 8px; transition: var(--chyn-oem-transition);
}
.chyn-oem-hero-card:hover { background: rgba(255,255,255,0.2); transform: translateY(-5px); }
.chyn-oem-hero-card h3 { font-size: 24px; margin-top: 0; margin-bottom: 15px; }
.chyn-oem-hero-card p { font-size: 16px; opacity: 0.9; margin-bottom: 0; line-height: 1.5;}
/* ==========================================================================
Core Products - 双核旗舰布局
========================================================================== */
.yj-pro-dual-card {
height: 5.8rem; /* 足够高，显得大气 */
}
/* 默认遮罩：底部深色，顶部透明，保证文字清晰 */
.yj-pro-dual-mask {
background: linear-gradient(to top, rgba(0, 19, 34, 0.35) 0%, rgba(0, 19, 34, 0.2) 20%, rgba(0, 19, 34, 0) 100%);
}
/* Hover遮罩：融入品牌主题色，增加互动质感 */
.yj-pro-dual-card:hover .yj-pro-dual-mask {
background: linear-gradient(to top, rgba(0, 19, 34, 0.95) 0%, rgba(0, 91, 172, 0.7) 60%, rgba(0, 91, 172, 0.2) 100%);
}
.yj-pro-dual-list{
display: none;
}
/* 图标容器 */
.yj-pro-dual-icon {
width: 0.64rem;
height: 0.64rem;
box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.2);
}
.yj-pro-dual-icon img{
max-width: 55%;
}
/* 列表项的自定义圆点 */
.yj-pro-dual-list li {
position: relative;
padding-left: 0.2rem;
opacity: 0.9;
}
.yj-pro-dual-list li::before {
content: '';
position: absolute;
left: 0;
top: 0.06rem;
width: 0.08rem;
height: 0.08rem;
background-color: var(--theme-color);
border-radius: 50%;
transition: all 0.3s ease;
}
.yj-pro-dual-card:hover .yj-pro-dual-list li::before {
background-color: #fff; /* Hover时圆点变白，因为背景变蓝了 */
}
/* 响应式适配 */
@media screen and (max-width: 1200px) {
.yj-pro-dual-head { flex-direction: column; align-items: flex-start; }
.yj-pro-dual-head .w60, .yj-pro-dual-head .w40 { width: 100%; }
.yj-pro-dual-head .w40 { justify-content: flex-start; margin-top: 0.2rem; }
.yj-pro-dual-head p { text-align: left; }
.yj-pro-dual-card { height: 5rem; }
}
@media screen and (max-width: 992px) {
.yj-pro-dual-wrap { flex-direction: column; }
.yj-pro-dual-card { width: 100%; margin-bottom: 0.4rem; height: auto; min-height: 5rem; }
}
@media screen and (max-width: 768px) {
.yj-pro-dual-card { min-height: 4.5rem; }
.yj-pro-dual-card .p50 { padding: 0.3rem; }
.yj-pro-dual-list li { width: 100%; } /* 手机端列表单列显示 */
.yj-pro-dual-card h3 { font-size: 0.28rem; }
}
/* ==================== 2. Customization Advantages ==================== */
.chyn-oem-adv-grid {
display: grid;
grid-template-columns: repeat(4, 1fr); /* 一行两个 */
gap: 30px;
}
.chyn-oem-adv-card {
position: relative;
background: #fff;
padding: 50px 40px;
border-radius: var(--chyn-oem-radius);
border: 1px solid var(--chyn-oem-border);
overflow: hidden;
z-index: 1;
}
/* 数字水印背景 */
.chyn-oem-adv-num-bg {
position: absolute;
top: 20px;
right: 20px;
font-size: 100px;
font-weight: 900;
color: rgba(0,0,0,0.03);
line-height: 1;
z-index: -1;
user-select: none;
}
.chyn-oem-adv-icon {
font-size: 40px;
color: var(--chyn-oem-theme-light);
margin-bottom: 20px;
}
.chyn-oem-adv-card h3 { font-size: 24px; color: var(--chyn-oem-text-main); margin-top: 0; margin-bottom: 15px; }
.chyn-oem-adv-card p { font-size: 16px; margin-bottom: 0; }
/* ==================== 3. Customization Scope ==================== */
.chyn-oem-scope-grid { display: grid; grid-template-columns: 1fr 1fr; border-radius: var(--chyn-oem-radius); overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
.chyn-oem-scope-left { background: #1a1a1a; color: #fff; padding: 60px; }
.chyn-oem-scope-right { background: #fff; padding: 60px; }
.chyn-oem-scope-title { font-size: 32px; margin-top: 0; margin-bottom: 40px; }
.chyn-oem-scope-left .chyn-oem-scope-title { color: #fff; }
.chyn-oem-scope-right .chyn-oem-scope-title { color: var(--chyn-oem-text-main); }
.chyn-oem-scope-items { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.chyn-oem-scope-item { display: flex; flex-direction: column; }
.chyn-oem-scope-num { font-size: 36px; font-weight: 700; color: var(--chyn-oem-theme-light); margin-bottom: 10px; line-height: 1; }
.chyn-oem-scope-text h4 { font-size: 20px; color: #fff; margin-top: 0; margin-bottom: 10px; }
.chyn-oem-scope-text p { font-size: 15px; color: rgba(255,255,255,0.7); margin-bottom: 0; }
.chyn-oem-check-list { list-style: none; padding: 0; margin: 0; }
.chyn-oem-check-list li { position: relative; padding-left: 30px; margin-bottom: 20px; font-size: 18px; color: var(--chyn-oem-text-main); }
.chyn-oem-check-list li i { position: absolute; left: 0; top: 4px; color: var(--chyn-oem-theme-light); font-size: 18px; }
/* ==================== 4. Core Product Coverage ==================== */
.chyn-oem-coverage-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.chyn-oem-coverage-card { padding: 50px; border-radius: var(--chyn-oem-radius); }
.chyn-oem-coverage-light { background: #f8f9fa; border: 1px solid var(--chyn-oem-border); }
.chyn-oem-coverage-blue { background: var(--chyn-oem-theme-light); color: #fff; }
.chyn-oem-coverage-light h3 { font-size: 28px; color: var(--chyn-oem-text-main); margin-top: 0; margin-bottom: 30px; }
.chyn-oem-coverage-blue h3 { font-size: 28px; color: #fff; margin-top: 0; margin-bottom: 30px; }
.chyn-oem-dot-list { list-style: none; padding: 0; margin: 0; }
.chyn-oem-dot-list li { position: relative; padding-left: 20px; margin-bottom: 15px; font-size: 18px; }
.chyn-oem-coverage-light .chyn-oem-dot-list li { color: var(--chyn-oem-text-light); }
.chyn-oem-coverage-blue .chyn-oem-dot-list li { color: #fff; }
.chyn-oem-dot-list li::before {
content: ''; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; border-radius: 50%;
}
.chyn-oem-coverage-light .chyn-oem-dot-list li::before { background: var(--chyn-oem-theme-light); }
.chyn-oem-coverage-blue .chyn-oem-dot-list li::before { background: #fff; }
/* ==================== 5. How We Support ==================== */
.chyn-oem-process { position: relative; }
.chyn-oem-process-line {
position: absolute; top: 25px; left: 10%; width: 80%; height: 2px;
background: #dde2e6; z-index: 1;
}
.chyn-oem-process-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; position: relative; z-index: 2; }
.chyn-oem-process-item { text-align: center; background: #fff; padding: 30px 20px; border-radius: 8px; border: 1px solid var(--chyn-oem-border); }
.chyn-oem-process-circle {
width: 50px; height: 50px; margin: 0 auto 20px; background: #fff;
border: 2px solid var(--chyn-oem-theme-light); border-radius: 50%;
display: flex; align-items: center; justify-content: center;
font-size: 18px; font-weight: 700; color: var(--chyn-oem-theme-light);
}
.chyn-oem-process-item h4 { font-size: 18px; color: var(--chyn-oem-text-main); margin-top: 0; margin-bottom: 15px; }
.chyn-oem-process-item p { font-size: 14px; margin-bottom: 0; }
/* ==================== 6. Engineering Support ==================== */
.chyn-oem-support { position: relative; padding: 100px 0; background: linear-gradient(rgba(11, 59, 96, 0.9), rgba(11, 59, 96, 0.96)), url("../images/chyn-oem-support-bg.jpg") center / cover no-repeat;}
.chyn-oem-support-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.chyn-oem-rect-img { width: 100%; height: 100%; object-fit: cover; }
.chyn-oem-support-bg::after {
content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
background: rgba(11, 59, 96, 0.9); /* 深蓝色遮罩 */
}
.chyn-oem-support-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; margin-top: 50px; }
.chyn-oem-support-card {
background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.15);
padding: 40px 30px; border-radius: var(--chyn-oem-radius); color: #fff;
}
.chyn-oem-support-icon {
width: 50px; height: 50px; border: 1px solid rgba(255,255,255,0.3); border-radius: 50%;
display: flex; align-items: center; justify-content: center; font-size: 20px; margin-bottom: 20px;
}
.chyn-oem-support-card h4 { font-size: 22px; color: #fff; margin-top: 0; margin-bottom: 15px; }
.chyn-oem-support-card p { font-size: 15px; color: rgba(255,255,255,0.8); margin-bottom: 0; }
/* ==================== 7. Why Choose Shenheng ==================== */
.chyn-oem-why { position: relative; background: #08223a; color: #fff; padding: 100px 0; overflow: hidden;background: linear-gradient(rgba(8,34,58, 0.92), rgba(8,34,58, 0.98)), url("../images/chyn-oem-why-bg.jpg") center / cover no-repeat;}
.chyn-oem-why-bg {
position: absolute; top: 0; right: 0; width: 50%; height: 100%; opacity: 0.2;
background-image: radial-gradient(#ffffff 1px, transparent 1px); background-size: 20px 20px;
}
.chyn-oem-why-wrapper { display: grid; grid-template-columns: 40% 60%; gap: 50px; align-items: center; }
.chyn-oem-why-title { font-size: 48px; color: #fff; margin-top: 0; margin-bottom: 30px; line-height: 1.1; }
.chyn-oem-why-left p { font-size: 18px; color: rgba(255,255,255,0.8); margin-bottom: 40px; }
.chyn-oem-why-right { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.chyn-oem-why-card {
background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
padding: 40px 30px; border-radius: var(--chyn-oem-radius);
}
.chyn-oem-why-card h4 { font-size: 24px; color: #fff; margin-top: 0; margin-bottom: 15px; }
.chyn-oem-why-card p { font-size: 16px; color: rgba(255,255,255,0.7); margin-bottom: 0; line-height: 1.6;}
/* ==================== 8. CTA Section ==================== */
.chyn-oem-cta { background: var(--chyn-oem-theme); color: #fff; padding: 80px 0;background: url('../images/chyn-oem-cta-bg.jpg') no-repeat center/cover;}
.chyn-oem-cta-title { font-size: 42px; color: #fff; margin-top: 0; margin-bottom: 20px; }
.chyn-oem-cta-desc { font-size: 18px; max-width: 1000px; margin: 0 auto 40px; color: rgba(255,255,255,0.8); }
/* ==================== 响应式适配 ==================== */
@media (max-width: 1400px) {
.chyn-oem-hero-title { font-size: 46px; }
.chyn-oem-section-title, .chyn-oem-why-title, .chyn-oem-cta-title { font-size: 36px; }
.chyn-oem-scope-left, .chyn-oem-scope-right { padding: 40px; }
}
@media (max-width: 1200px) {
.chyn-oem-hero-cards { position: relative; bottom: 0; transform: none; left: 0; margin-top: 50px; }
.chyn-oem-hero { padding-bottom: 80px; }
.chyn-oem-advantages { padding-top: 80px; }
.chyn-oem-support-grid { grid-template-columns: repeat(2, 1fr); }
.chyn-oem-why-wrapper { grid-template-columns: 1fr; }
.chyn-oem-why-bg { width: 100%; }
}
@media (max-width: 992px) {
.chyn-oem-hero-cards { grid-template-columns: 1fr; }
.chyn-oem-adv-grid { grid-template-columns: 1fr; }
.chyn-oem-scope-grid { grid-template-columns: 1fr; }
.chyn-oem-coverage-grid { grid-template-columns: 1fr; }
.chyn-oem-process-grid { grid-template-columns: repeat(2, 1fr); }
.chyn-oem-process-line { display: none; } /* 平板以下隐藏流程线 */
}
@media (max-width: 768px) {
.chyn-oem-hero-title { font-size: 36px; }
.chyn-oem-section-title, .chyn-oem-why-title, .chyn-oem-cta-title { font-size: 28px; }
.chyn-oem-hero-btns { flex-direction: column; }
.chyn-oem-scope-items { grid-template-columns: 1fr; }
.chyn-oem-process-grid { grid-template-columns: 1fr; }
.chyn-oem-support-grid { grid-template-columns: 1fr; }
.chyn-oem-why-right { grid-template-columns: 1fr; }
.chyn-oem-scope-left, .chyn-oem-scope-right { padding: 30px 20px; }
}
/* -------------------------PC端--------------------------- */
@media all and (max-width:1700px) {
/* 1600 × (900/1024/1200) */
}
@media all and (max-width:1599px) {
/* 1440 × (900/1050) */
.Header-container .c-nav>li{
margin-right: 0.4rem;
}
}
@media all and (max-width:1439px) {
/* 1360 × (768) */
}
@media all and (max-width:1359px) {
/* 1280 × (800/854/1024) */
}
@media all and (max-width:1279px) {
/* 1152 × (864) */
}
@media all and (max-width:1151px) {
/* 1024 × (600/768) */
}
/* ------------------------手机端-------------------------- */
@media all and (max-width:1000px) {
/* 平板设备 720 适配 */
.pc{display: none;}
.mb{display: block;}
}
@media all and (max-width:768px) {
}
@media all and (max-width:640px) {
/* 移动终端以上 360 适配 */
}
@media all and (max-width:480px) {
}
@media all and (max-width:420px) {
}
@media all and (max-width:376px) {
}
/* ==================== CHYN inner pages ==================== */
.chyn-inner-banner { position: relative; min-height: 4.8rem; display: flex; align-items: flex-end; overflow: hidden; background: #18252b center/cover no-repeat; color: #fff; }
.chyn-inner-banner-shade { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(9,23,29,.82),rgba(9,23,29,.32) 58%,rgba(9,23,29,.58)),linear-gradient(0deg,rgba(9,23,29,.72),transparent 62%); }
.chyn-inner-banner-inner { position: relative; z-index: 1; width: 100%; padding-top: 1.8rem; padding-bottom: .64rem; }
.chyn-inner-banner-kicker { color: #8ae1cf; font-size: var(--f14); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.chyn-inner-banner-title { margin-top: .14rem; color: #fff; font-size: var(--f48); font-weight: 700; line-height: 1.08; }
.chyn-inner-banner-desc { max-width: 8.8rem; margin-top: .18rem; color: rgba(255,255,255,.78); font-size: var(--f18); line-height: 1.45; }
.chyn-inner-subnav { position: relative; z-index: 2; background: #fff; box-shadow: 0 .04rem .16rem rgba(17,24,39,.08); }
.chyn-inner-subnav > .tit { display: none; }
.chyn-inner-subnav .w16 { min-height: .78rem; }
.chyn-inner-subnav .crumbs { padding: .14rem 0; color: #6b7280; font-size: var(--f14); }
.chyn-inner-subnav .sort_nav_view ul { gap: .3rem; }
.chyn-inner-subnav .sort_nav_view ul li { margin-left: 0; }
.chyn-inner-subnav .sort_nav_view ul li a { line-height: .78rem; font-size: var(--f16); }
.chyn-inner-subnav .sort_nav_view ul li.active a { color: var(--theme-color); font-weight: 600; }
.chyn-inner-subnav .sort_nav_view ul li.active a::after { height: .02rem; bottom: .05rem; }
.chyn-page-section { padding: 1rem 0; background: #fff; }
.chyn-page-section.bg-soft { background: #f5f7f8; }
.chyn-page-head { max-width: 9.6rem; margin: 0 auto .56rem; }
.chyn-page-kicker { color: var(--theme-color); font-size: var(--f14); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.chyn-page-title { margin-top: .12rem; color: #17202a; font-size: var(--f40); font-weight: 700; line-height: 1.16; }
.chyn-page-intro { margin-top: .16rem; color: #6b7280; font-size: var(--f18); line-height: 1.55; }
.chyn-page-btn { display: inline-flex; align-items: center; justify-content: center; gap: .12rem; min-height: .5rem; padding: .15rem .24rem; border: 0; border-radius: .06rem; outline: none; appearance: none; color: #fff; background: var(--theme-color); font-size: var(--f16); font-weight: 600; line-height: 1.25; cursor: pointer; transition: color .35s ease, background .35s ease, border-color .35s ease, transform .35s ease, box-shadow .35s ease; }
.chyn-page-btn:hover { color: #fff; background: #007b65; transform: translateY(-.04rem); box-shadow: 0 .1rem .25rem rgba(0,161,128,.24); }
.chyn-page-btn:focus-visible { outline: .02rem solid rgba(0,161,128,.42); outline-offset: .04rem; }
.chyn-page-btn.is-outline { color: var(--theme-color); background: transparent; border: .01rem solid rgba(0,161,128,.6); }
.chyn-page-btn.is-outline:hover { color: #fff; background: var(--theme-color); }
.chyn-page-card { overflow: hidden; background: #fff; border-radius: .12rem; box-shadow: 0 .08rem .24rem rgba(17,24,39,.07); transition: transform .35s ease, box-shadow .35s ease; }
.chyn-page-card:hover { transform: translateY(-.06rem); box-shadow: 0 .16rem .34rem rgba(17,24,39,.12); }
.chyn-page-card .pic { overflow: hidden; }
.chyn-page-card .pic img { transition: transform .55s ease; }
.chyn-page-card:hover .pic img { transform: scale(1.045); }
.chyn-page-meta { color: #7b8790; font-size: var(--f14); }
.chyn-article { color: #3f4b53; font-size: var(--f18); line-height: 1.75; }
.chyn-article h2,.chyn-article h3 { color: #17202a; line-height: 1.25; }
.chyn-article h2 { margin: .44rem 0 .16rem; font-size: var(--f28); }
.chyn-article h3 { margin: .34rem 0 .12rem; font-size: var(--f22); }
.chyn-article img { max-width: 100%; height: auto; border-radius: .08rem; }
.chyn-article a { color: var(--theme-color); }
.chyn-form-field { width: 100%; min-height: .56rem; padding: 0 .18rem; color: #17202a; background: #f5f7f8; border: .01rem solid #e5e7eb; border-radius: .06rem; font: inherit; outline: none; transition: border-color .25s ease, box-shadow .25s ease, background .25s ease; }
.chyn-form-field:focus { border-color: var(--theme-color); background: #fff; box-shadow: 0 0 0 .04rem rgba(0,161,128,.12); }
.chyn-form-field.is-area { min-height: 1.6rem; padding-top: .14rem; resize: vertical; }
.chyn-contact-section { padding-top: 1.1rem; padding-bottom: 1.2rem; }
.chyn-contact-grid { gap: .6rem; }
.chyn-contact-form-wrap { min-width: 0; }
.chyn-contact-aside { width: 36%; min-width: 0; padding: .48rem .44rem; background: #f5f7f8; border-radius: .12rem; }
.chyn-contact-detail { gap: .16rem; min-height: .68rem; color: #17202a; }
.chyn-contact-detail + .chyn-contact-detail { margin-top: .12rem; }
.chyn-contact-detail > span:last-child > span { display: block; margin-top: .04rem; color: #6b7280; font-size: var(--f16); line-height: 1.4; }
.chyn-contact-detail strong { display: block; font-size: var(--f16); }
.chyn-contact-detail:hover strong { color: var(--theme-color); }
.chyn-contact-icon { width: .42rem; height: .42rem; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 .42rem; color: var(--theme-color); border: .01rem solid rgba(0,161,128,.35); border-radius: 50%; font-size: var(--f20); }
.chyn-contact-hours { padding-top: .2rem; color: #6b7280; border-top: .01rem solid #dfe5e6; font-size: var(--f16); line-height: 1.5; }
.chyn-contact-hours strong { display: block; color: #17202a; margin-bottom: .04rem; }
.chyn-guide-nav { position: sticky; top: 1rem; z-index: 20; background: rgba(255,255,255,.94); box-shadow: 0 .04rem .14rem rgba(17,24,39,.06); backdrop-filter: blur(.12rem); }
.chyn-guide-nav-inner { gap: .38rem; overflow-x: auto; }
.chyn-guide-nav-link { position: relative; flex: 0 0 auto; padding: .25rem 0; color: #364149; }
.chyn-guide-nav-link:hover { color: var(--theme-color); }
.chyn-guide-section:nth-of-type(even) { background: #f5f7f8; }
.chyn-guide-copy { max-width: 9.6rem; }
.chyn-guide-slider-wrap { position: relative; padding: 0 .34rem; }
.chyn-guide-slider { padding: .08rem .04rem .3rem; }
.chyn-guide-card { display: block; height: 100%; }
.chyn-guide-card-media { padding: .16rem .18rem 0; background: #fff; }
.chyn-guide-card-media img,.chyn-product-card-media img { object-fit: contain; }
.chyn-guide-card-copy { position: relative; min-height: 2rem; }
.chyn-guide-card-arrow { position: absolute; right: .24rem; bottom: .22rem; color: var(--theme-color); font-size: var(--f22); }
.chyn-guide-prev,.chyn-guide-next { position: absolute; top: 42%; z-index: 3; width: .52rem; height: .52rem; color: #17202a; background: #fff; border: 0; border-radius: 50%; box-shadow: 0 .08rem .2rem rgba(17,24,39,.14); cursor: pointer; transition: color .25s ease, background .25s ease, transform .25s ease; }
.chyn-guide-prev { left: 0; }.chyn-guide-next { right: 0; }
.chyn-guide-prev:hover,.chyn-guide-next:hover { color: #fff; background: var(--theme-color); transform: scale(1.06); }
.chyn-product-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .28rem; }
.chyn-product-card { display: block; }
.chyn-product-card-media { padding: .22rem; background: #fff; }
.chyn-product-card-copy h2 { color: #17202a; }
.chyn-product-card-more { color: var(--theme-color); }
.chyn-product-hub-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .24rem; }
.chyn-product-hub-card { display: block; overflow: hidden; color: #17202a; background: #f5f7f8; border-radius: .1rem; transition: transform .4s ease, box-shadow .4s ease; }
.chyn-product-hub-card:hover { color: #17202a; transform: translateY(-.06rem); box-shadow: 0 .14rem .32rem rgba(17,24,39,.11); }
.chyn-product-hub-media { padding: .14rem .16rem 0; overflow: hidden; background: #f5f7f8; }
.chyn-product-hub-media img { object-fit: contain; transition: transform .6s ease; }
.chyn-product-hub-card:hover .chyn-product-hub-media img { transform: scale(1.045); }
.chyn-product-hub-copy { position: relative; min-height: 1.55rem; padding: .22rem .24rem .28rem; background: #fff; }
.chyn-product-hub-copy h2 { margin-top: .1rem; padding-right: .35rem; }
.chyn-product-hub-copy > span { position: absolute; right: .22rem; bottom: .24rem; color: var(--theme-color); font-size: var(--f22); transition: transform .3s ease; }
.chyn-product-hub-card:hover .chyn-product-hub-copy > span { transform: translateX(.06rem); }
.chyn-product-list-page .yj-pro-sidebar { min-width: 0; }
.chyn-product-list-page .yj-pro-widget { border-radius: .1rem; box-shadow: 0 .08rem .24rem rgba(17,24,39,.06); }
.chyn-product-list-page .yj-pro-card { border: 0; }
.chyn-product-detail-page .yj-pro-sidebar { min-width: 0; }
.chyn-product-detail-page .yj-pro-widget { border-radius: .1rem; box-shadow: 0 .08rem .24rem rgba(17,24,39,.06); }
.chyn-product-detail-main { min-width: 0; }
.chyn-product-overview,.chyn-product-content-block,.chyn-product-related-block,.chyn-product-inquiry { padding: .42rem; background: #fff; border-radius: .12rem; box-shadow: 0 .08rem .24rem rgba(17,24,39,.06); }
.chyn-product-content-block,.chyn-product-related-block,.chyn-product-inquiry { margin-top: .28rem; }
.chyn-product-gallery-main { overflow: hidden; background: #f7f9f9; border-radius: .1rem; }
.chyn-product-gallery-main img,.chyn-product-thumbs img,.chyn-product-related-card img { object-fit: contain; }
.chyn-product-thumbs-wrap { position: relative; margin-top: .14rem; padding: 0 .44rem; }
.chyn-product-thumbs .swiper-slide { overflow: hidden; background: #f7f9f9; border: .01rem solid transparent; border-radius: .06rem; cursor: pointer; transition: border-color .25s ease; }
.chyn-product-thumbs .swiper-slide-thumb-active { border-color: var(--theme-color); }
.chyn-product-thumbs-wrap .thumb-prev,.chyn-product-thumbs-wrap .thumb-next,.chyn-product-related-slider .rel-prev,.chyn-product-related-slider .rel-next { position: absolute; z-index: 4; width: .36rem; height: .36rem; display: inline-flex; align-items: center; justify-content: center; color: #17202a; background: #fff; border: 0; border-radius: 50%; box-shadow: 0 .05rem .16rem rgba(17,24,39,.12); cursor: pointer; transition: color .25s ease, background .25s ease; }
.chyn-product-thumbs-wrap .thumb-prev { left: 0; top: 50%; transform: translateY(-50%); }
.chyn-product-thumbs-wrap .thumb-next { right: 0; top: 50%; transform: translateY(-50%); }
.chyn-product-thumbs-wrap button:hover,.chyn-product-related-slider button:hover { color: #fff; background: var(--theme-color); }
.chyn-product-title { margin-top: .14rem; color: #17202a; font-size: var(--f40); font-weight: 700; line-height: 1.16; }
.chyn-product-summary-text { margin-top: .24rem; }
.chyn-product-summary-points { display: grid; gap: .14rem; margin-top: .28rem; }
.chyn-product-summary-points > div { display: flex; align-items: center; gap: .12rem; color: #27343b; font-size: var(--f16); }
.chyn-product-summary-points span { width: .28rem; height: .28rem; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 .28rem; color: #fff; background: var(--theme-color); border-radius: 50%; font-size: var(--f14); }
.chyn-product-actions { gap: .14rem; margin-top: .34rem; }
.chyn-product-related-slider { position: relative; padding: .04rem .04rem .12rem; }
.chyn-product-related-card { display: block; overflow: hidden; color: #17202a; background: #f7f9f9; border-radius: .08rem; transition: transform .35s ease, box-shadow .35s ease; }
.chyn-product-related-card h3 { min-height: .74rem; padding: .18rem; background: #fff; }
.chyn-product-related-card:hover { color: #17202a; transform: translateY(-.04rem); box-shadow: 0 .1rem .24rem rgba(17,24,39,.1); }
.chyn-product-related-slider .rel-prev { left: .14rem; top: 42%; }
.chyn-product-related-slider .rel-next { right: .14rem; top: 42%; }
.chyn-product-inquiry-form .chyn-form-field { margin-bottom: 0; }
.chyn-news-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .3rem; }
.chyn-news-card { min-width: 0; background: #fff; }
.chyn-news-link { display: block; color: #17202a; }
.chyn-news-media { position: relative; overflow: hidden; border-radius: .1rem; }
.chyn-news-media img { transition: transform .6s ease; }
.chyn-news-card:hover .chyn-news-media img { transform: scale(1.05); }
.chyn-news-category { position: absolute; left: .18rem; bottom: .18rem; padding: .08rem .14rem; color: #fff; background: rgba(9,23,29,.78); border-radius: .04rem; backdrop-filter: blur(.08rem); }
.chyn-news-copy { position: relative; min-height: 2.5rem; padding-left: .96rem; }
.chyn-news-date { position: absolute; left: .3rem; top: .3rem; width: .48rem; color: #728087; text-align: center; }
.chyn-news-date strong,.chyn-news-date span,.chyn-news-date small { display: block; }
.chyn-news-date strong { color: var(--theme-color); font-size: var(--f32); line-height: 1; }
.chyn-news-date span { margin-top: .06rem; color: #17202a; font-size: var(--f14); font-weight: 700; text-transform: uppercase; }
.chyn-news-date small { margin-top: .02rem; font-size: var(--f14); }
.chyn-news-copy h2 { color: #17202a; }
.chyn-news-card:hover .chyn-news-copy h2,.chyn-news-more { color: var(--theme-color); }
.chyn-news-more span { display: inline-block; margin-left: .08rem; transition: transform .3s ease; }
.chyn-news-card:hover .chyn-news-more span { transform: translateX(.06rem); }
.chyn-news-crumb { padding: 1.3rem 0 .22rem; color: #6b7280; background: #fff; font-size: var(--f14); }
.chyn-news-article { width: 10.8rem; min-width: 0; background: #fff; }
.chyn-news-article-head { padding: .55rem .62rem .44rem; text-align: center; }
.chyn-news-article-title { max-width: 9rem; margin: .16rem auto 0; color: #17202a; font-size: var(--f40); line-height: 1.2; }
.chyn-news-article-meta { margin-top: .22rem; color: #7b8790; }
.chyn-news-article-meta span { margin-left: .18rem; }
.chyn-news-article-body { padding: .1rem .62rem .6rem; }
.chyn-news-aside { width: 4.3rem; min-width: 0; position: sticky; top: 1.2rem; }
.chyn-news-toc,.chyn-news-related { padding: .3rem; background: #fff; border-radius: .08rem; box-shadow: 0 .06rem .2rem rgba(17,24,39,.06); }
.chyn-news-toc #catalog li + li { margin-top: .1rem; }
.chyn-news-toc #catalog a { color: #59666d; }
.chyn-news-toc #catalog a:hover { color: var(--theme-color); }
.chyn-news-related-item { gap: .14rem; color: #17202a; }
.chyn-news-related-item + .chyn-news-related-item { margin-top: .18rem; }
.chyn-news-related-media { width: 1.05rem; height: .76rem; flex: 0 0 1.05rem; overflow: hidden; border-radius: .05rem; }
.chyn-news-related-media img { width: 100%; height: 100%; object-fit: cover; }
.chyn-news-related-item small { display: block; margin-top: .08rem; color: #8a959b; font-size: var(--f14); }
.chyn-news-related-item:hover strong { color: var(--theme-color); }
.chyn-news-turn { gap: .25rem; padding: .28rem .62rem; background: #17242b; }
.chyn-news-turn > div { width: 46%; color: rgba(255,255,255,.55); font-size: var(--f14); }
.chyn-news-turn > div:last-child { text-align: right; }
.chyn-news-turn span { font-size: var(--f20);}
.chyn-news-turn span,.chyn-news-turn a { display: block; }
.chyn-news-turn a { margin-top: .08rem; color: #fff; font-size: var(--f16); line-height: 1.4; }
.chyn-news-turn a:hover { color: #80dfca; }
.chyn-case-head { gap: .4rem; }
.chyn-case-head .chyn-page-title { max-width: 8.8rem; }
.chyn-case-head .chyn-page-intro { width: 36%; max-width: 5.6rem; margin-top: 0; }
.chyn-case-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .34rem; }
.chyn-case-card a { display: block; color: #17202a; }
.chyn-case-media { position: relative; overflow: hidden; }
.chyn-case-media img { transition: transform .65s ease; }
.chyn-case-card:hover .chyn-case-media img { transform: scale(1.05); }
.chyn-case-tag { position: absolute; left: .2rem; top: .2rem; padding: .08rem .14rem; color: #fff; background: rgba(9,23,29,.78); border-radius: .04rem; }
.chyn-case-body { position: relative; min-height: 2.05rem; }
.chyn-case-body h3 { max-width: 5.2rem; }
.chyn-case-arrow { position: absolute; right: .24rem; bottom: .24rem; width: .46rem; height: .46rem; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: var(--theme-color); border-radius: 50%; font-size: var(--f22); transition: transform .3s ease, background .3s ease; }
.chyn-case-card:hover .chyn-case-arrow { transform: translate(.04rem,-.04rem); background: #007b65; }
.chyn-case-detail-hero { background: #f5f7f8; }
.chyn-case-detail-head { gap: .35rem; }
.chyn-case-detail-title { max-width: 10.5rem; margin-top: .14rem; color: #17202a; font-size: var(--f46); line-height: 1.1; }
.chyn-case-detail-meta { display: flex; gap: .24rem; flex-wrap: wrap; color: #66747b; }
.chyn-case-detail-meta span { padding: .08rem .14rem; background: #fff; border-radius: .04rem; }
.chyn-case-detail-stat { min-width: 2.3rem; padding: .2rem .24rem; background: #fff; border-radius: .08rem; text-align: right; }
.chyn-case-detail-stat strong { display: block; color: var(--theme-color); font-size: var(--f42); line-height: 1; }
.chyn-case-detail-stat div { margin-top: .08rem; color: #6b7280; font-size: var(--f14); line-height: 1.4; }
.chyn-case-detail-cover { display: block; overflow: hidden; border-radius: .12rem; box-shadow: 0 .1rem .28rem rgba(17,24,39,.12); }
.chyn-case-detail-cover img { transition: transform .7s ease; }
.chyn-case-detail-cover:hover img { transform: scale(1.025); }
.chyn-case-detail-cta { padding: 1rem 0; background: #17242b url('../images/generated/power-quality-project-cta.webp') center/cover no-repeat; }
.chyn-case-detail-cta .chyn-page-kicker { color: #80dfca; }
.chyn-page-btn.is-light { color: #17202a; background: #fff; }
.chyn-page-btn.is-light:hover { color: #fff; background: var(--theme-color); }
.chyn-service-copy,.chyn-service-media { min-width: 0; }
.chyn-service-media { overflow: hidden; border-radius: .12rem; box-shadow: 0 .1rem .26rem rgba(17,24,39,.1); }
.chyn-service-media img { transition: transform .7s ease; }
.chyn-service-media:hover img { transform: scale(1.04); }
.chyn-service-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .18rem; }
.chyn-service-item { position: relative; min-height: 2.5rem; padding: .28rem .24rem .3rem; color: #17202a; background: #fff; border-radius: .08rem; box-shadow: 0 .06rem .18rem rgba(17,24,39,.05); transition: transform .3s ease, box-shadow .3s ease; }
.chyn-service-item:hover { color: #17202a; transform: translateY(-.05rem); box-shadow: 0 .12rem .26rem rgba(17,24,39,.1); }
.chyn-service-item h3 { margin-top: .18rem; }
.chyn-service-item i { position: absolute; right: .2rem; bottom: .2rem; color: var(--theme-color); font-size: var(--f22); font-style: normal; }
.chyn-service-icon { width: .46rem; height: .46rem; display: inline-flex; align-items: center; justify-content: center; color: var(--theme-color); border: .01rem solid rgba(0,161,128,.35); border-radius: 50%; font-size: var(--f22); }
.chyn-video-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .3rem; }
.chyn-video-card a { display: block; color: #17202a; }
.chyn-video-media { position: relative; overflow: hidden; }
.chyn-video-media img { transition: transform .65s ease; }
.chyn-video-card:hover .chyn-video-media img { transform: scale(1.05); }
.chyn-video-play { position: absolute; left: 50%; top: 50%; width: .64rem; height: .64rem; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: var(--theme-color); border-radius: 50%; transform: translate(-50%,-50%); box-shadow: 0 .08rem .2rem rgba(0,0,0,.22); }
.chyn-video-request { display: inline-flex; align-items: center; gap: .1rem; color: var(--theme-color); transition: gap .3s ease, color .3s ease; }
.chyn-video-card:hover .chyn-video-request { gap: .16rem; color: #007b65; }
.chyn-service-page .chyn-service-ban { position: relative; height: 6rem; overflow: hidden; background: #17242b; }
.chyn-service-page .chyn-service-ban-img,.chyn-service-page .chyn-service-ban-mask { position: absolute; inset: 0; }
.chyn-service-page .chyn-service-ban-img img { width: 100%; height: 100%; object-fit: cover; }
.chyn-service-page .chyn-service-ban-mask { background: linear-gradient(90deg,rgba(9,23,29,.76),rgba(9,23,29,.22)),rgba(0,0,0,.16); }
.chyn-service-page .chyn-service-ban-crumb { position: absolute; left: 50%; top: 1.4rem; z-index: 2; transform: translateX(-50%); color: #fff; font-size: var(--f16); }
.chyn-service-page .chyn-service-ban-crumb a { color: #fff; }
.chyn-service-page .chyn-service-ban-crumb i { display: inline-block; margin: 0 .12rem; font-size: var(--f14); }
.chyn-service-page .chyn-service-ban-copy { position: absolute; left: 50%; top: 50%; z-index: 2; transform: translate(-50%,-28%); }
.chyn-service-page .chyn-service-nav { position: relative; z-index: 4; width: 16rem; max-width: calc(100% - .4rem); margin: -.38rem auto 0; border-radius: .18rem; background: #fff; box-shadow: 0 .08rem .28rem rgba(0,0,0,.12); }
.chyn-service-page .chyn-service-nav .w16 { height: .76rem; gap: .55rem; }
.chyn-service-page .chyn-service-nav a { position: relative; height: 100%; display: flex; align-items: center; color: #59666d; text-transform: uppercase; }
.chyn-service-page .chyn-service-nav a::after { content: ''; position: absolute; left: 0; bottom: 0; width: 0; height: .03rem; background: var(--theme-color); transition: width .3s ease; }
.chyn-service-page .chyn-service-nav a.active,.chyn-service-page .chyn-service-nav a:hover { color: var(--theme-color); }
.chyn-service-page .chyn-service-nav a.active::after,.chyn-service-page .chyn-service-nav a:hover::after { width: 100%; }
.chyn-service-page .chyn-service-copy { width: 45%; align-self: center; }
.chyn-service-page .chyn-service-media { width: 49%; overflow: hidden; border-radius: .12rem; }
.chyn-service-page .chyn-service-lines { display: flex; flex-direction: column; align-items: flex-start; gap: .16rem; }
.chyn-service-page .chyn-service-lines a { display: flex; align-items: center; gap: .12rem; color: #17202a; }
.chyn-service-page .chyn-service-lines i { width: .4rem; height: .4rem; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--theme-color); border-radius: 50%; }
.chyn-service-page .chyn-service-lines a:hover { color: var(--theme-color); }
.chyn-service-page .chyn-service-advantages { background: #f5f7f8; }
.chyn-service-page .chyn-service-adv-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .18rem; }
.chyn-service-page .chyn-service-adv-grid article { padding: .42rem .28rem; background: #fff; border-radius: .1rem; text-align: center; box-shadow: 0 .05rem .16rem rgba(17,24,39,.04); transition: transform .35s ease, box-shadow .35s ease; }
.chyn-service-page .chyn-service-adv-grid article:hover { transform: translateY(-.05rem); box-shadow: 0 .16rem .34rem rgba(17,24,39,.1); }
.chyn-service-page .chyn-service-adv-grid article > i { color: var(--theme-color); font-size: var(--f36); }
.chyn-service-page .chyn-service-adv-grid article > span { display: block; width: .26rem; height: .03rem; margin: .22rem auto; background: var(--theme-color); }
.chyn-service-page .chyn-service-adv-grid h3 { margin-bottom: .18rem; }
.chyn-service-page .chyn-service-contact-copy { width: 38%; }
.chyn-service-page .chyn-service-form { width: 54%; }
.chyn-service-page .chyn-service-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .24rem .3rem; }
.chyn-service-page .chyn-service-form label span { display: block; margin-bottom: .09rem; color: #66747b; }
.chyn-service-page .chyn-service-form input,.chyn-service-page .chyn-service-form select,.chyn-service-page .chyn-service-form textarea { width: 100%; padding: .12rem 0; color: #17202a; border: 0; border-bottom: .01rem solid #cfd6d8; background: transparent; line-height: 1.5; outline: 0; }
.chyn-service-page .chyn-service-form input:focus,.chyn-service-page .chyn-service-form select:focus,.chyn-service-page .chyn-service-form textarea:focus { border-color: var(--theme-color); }
.chyn-service-page .chyn-service-form-wide { grid-column: 1 / -1; }
.chyn-service-page .chyn-service-consent { display: flex; align-items: flex-start; gap: .1rem; margin-top: .22rem; color: #66747b; line-height: 1.5; }
.chyn-service-page .chyn-service-consent input { width: .18rem; height: .18rem; flex: 0 0 .18rem; margin-top: .02rem; accent-color: var(--theme-color); }
.chyn-service-page .chyn-service-resource-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .24rem; }
.chyn-service-page .chyn-service-resource { position: relative; height: 3.6rem; overflow: hidden; border-radius: .12rem; }
.chyn-service-page .chyn-service-resource-img,.chyn-service-page .chyn-service-resource-mask { position: absolute; inset: 0; }
.chyn-service-page .chyn-service-resource-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.chyn-service-page .chyn-service-resource-mask { background: linear-gradient(90deg,rgba(5,18,25,.82),rgba(5,18,25,.14)); }
.chyn-service-page .chyn-service-resource-copy { position: absolute; left: .34rem; right: .34rem; bottom: .3rem; z-index: 2; }
.chyn-service-page .chyn-service-resource-copy h2,.chyn-service-page .chyn-service-resource-copy div { max-width: 82%; }
.chyn-service-page .chyn-service-resource-copy i { position: absolute; right: 0; bottom: .08rem; color: #fff; font-size: var(--f30); transition: transform .3s ease; }
.chyn-service-page .chyn-service-resource:hover img { transform: scale(1.05); }
.chyn-service-page .chyn-service-resource:hover .chyn-service-resource-copy i { transform: translateX(.08rem); }
@media screen and (max-width: 1100px) { .chyn-service-copy,.chyn-service-media { width: 100%; } .chyn-service-media { margin-top: .35rem; } .chyn-service-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .chyn-video-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media screen and (max-width: 640px) { .chyn-service-grid,.chyn-video-grid { grid-template-columns: 1fr; } }
.chyn-solution-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .36rem; }
.chyn-solution-card { overflow: hidden; background: #f5f7f8; border-radius: .12rem; }
.chyn-solution-card a { display: grid; grid-template-columns: 48% 52%; min-height: 4rem; color: #17202a; }
.chyn-solution-media { overflow: hidden; }
.chyn-solution-media .rect-67 { height: 100%; padding-bottom: 0; }
.chyn-solution-media img { transition: transform .65s ease; }
.chyn-solution-card:hover .chyn-solution-media img { transform: scale(1.05); }
.chyn-solution-copy { padding: .36rem .32rem; }
.chyn-solution-copy .chyn-page-btn { pointer-events: none; }
.chyn-solution-article { width: 11rem; min-width: 0; padding: .5rem .58rem; background: #fff; }
.chyn-solution-detail-title { margin-top: .14rem; color: #17202a; font-size: var(--f40); line-height: 1.18; }
.chyn-solution-cover { overflow: hidden; border-radius: .1rem; }
.chyn-solution-aside { width: 4.2rem; position: sticky; top: 1.2rem; }
.chyn-solution-contact,.chyn-solution-related { padding: .3rem; background: #fff; border-radius: .08rem; box-shadow: 0 .06rem .2rem rgba(17,24,39,.06); }
.chyn-solution-related-item { display: flex; justify-content: space-between; gap: .2rem; padding: .16rem 0; color: #3f4b53; font-size: var(--f16); line-height: 1.4; }
.chyn-solution-related-item + .chyn-solution-related-item { border-top: .01rem solid #edf0f1; }
.chyn-solution-related-item i { color: var(--theme-color); font-style: normal; transition: transform .3s ease; }
.chyn-solution-related-item:hover { color: var(--theme-color); }
.chyn-solution-related-item:hover i { transform: translateX(.05rem); }
.chyn-solution-products-slider { padding: .08rem .04rem .35rem; }
.chyn-solution-product-card { display: block; color: #17202a; }
.chyn-solution-product-card img { object-fit: contain; }
.chyn-solution-product-card h3 { min-height: .72rem; }
.chyn-about-overview { padding-top: 1.1rem; }
.chyn-about-overview-copy,.chyn-about-overview-media { min-width: 0; }
.chyn-about-overview-media { overflow: hidden; border-radius: .12rem; box-shadow: 0 .1rem .26rem rgba(17,24,39,.1); }
.chyn-about-overview-media img { transition: transform .7s ease; }
.chyn-about-overview-media:hover img { transform: scale(1.04); }
.chyn-about-facts-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .18rem; }
.chyn-about-facts-grid article { min-height: 2.2rem; padding: .3rem .25rem; display: grid; grid-template-columns: .56rem 1fr; column-gap: .16rem; align-content: center; background: #fff; border-radius: .08rem; box-shadow: 0 .06rem .18rem rgba(17,24,39,.05); }
.chyn-about-facts-grid img { width: .46rem; height: .46rem; grid-row: 1 / span 3; align-self: center; justify-self: center; }
.chyn-about-facts-grid strong { color: #fff; line-height: 1; }
.chyn-about-facts-grid span{color: #fff;}
.chyn-about-facts-grid h3 { margin-top: .08rem; color: #17202a; font-size: var(--f18); line-height: 1.25; }
.chyn-about-facts-grid div { margin-top: .06rem; color: rgb(255,255,255,.5); font-size: var(--f16); line-height: 1.45; }
.chyn-about-culture-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .26rem; }
.chyn-about-culture-card { position: relative; overflow: hidden; border-radius: .12rem; color: #fff; background: #17242b; }
.chyn-about-culture-card img { transition: transform .7s ease; }
.chyn-about-culture-card:hover img { transform: scale(1.04); }
.chyn-about-culture-copy { position: absolute; left: 0; right: 0; bottom: 0; padding: .3rem; background: linear-gradient(0deg,rgba(9,23,29,.86),rgba(9,23,29,.05)); }
.chyn-about-env-slider { overflow: visible; }
.chyn-about-environment .chyn-page-head .chyn-page-intro { width: 36%; }
.chyn-about-env-slider .swiper-slide { overflow: hidden; border-radius: .1rem; }
.chyn-about-env-slider img { transition: transform .7s ease; }
.chyn-about-env-slider .swiper-slide:hover img { transform: scale(1.035); }
.chyn-about-env-controls { margin-top: .2rem; display: flex; align-items: center; justify-content: center; gap: .18rem; }
.chyn-about-env-controls button { width: .42rem; height: .42rem; display: inline-flex; align-items: center; justify-content: center; color: #17202a; background: #fff; border: .01rem solid #dfe5e6; border-radius: 50%; cursor: pointer; transition: color .25s ease, background .25s ease; }
.chyn-about-env-controls button:hover { color: #fff; background: var(--theme-color); border-color: var(--theme-color); }
.chyn-about-env-controls .swiper-pagination { position: static; width: auto; }
.chyn-about-env-controls .swiper-pagination-bullet-active { background: var(--theme-color); }
.chyn-faq-list { max-width: 12rem; margin: 0 auto; }
.chyn-faq-item { background: #fff; border-bottom: .01rem solid #e5e7eb; }
.chyn-faq-item:first-child { border-top: .01rem solid #e5e7eb; }
.chyn-faq-head { width: 100%; min-height: .78rem; padding: .14rem .18rem; display: flex; align-items: center; justify-content: space-between; gap: .2rem; color: #17202a; background: transparent; border: 0; text-align: left; cursor: pointer; }
.chyn-faq-head h3 { flex: 1; }
.chyn-faq-head > span { position: relative; width: .28rem; height: .28rem; flex: 0 0 .28rem; color: var(--theme-color); }
.chyn-faq-head > span::before,.chyn-faq-head > span::after { content: ''; position: absolute; left: 50%; top: 50%; width: .16rem; height: .02rem; background: currentColor; transform: translate(-50%,-50%); transition: transform .3s ease; }
.chyn-faq-head > span::after { transform: translate(-50%,-50%) rotate(90deg); }
.chyn-faq-item.active .chyn-faq-head > span::after { transform: translate(-50%,-50%) rotate(0); }
.chyn-faq-item:hover .chyn-faq-head h3,.chyn-faq-item.active .chyn-faq-head h3 { color: var(--theme-color); }
.chyn-faq-body { display: none; padding: 0 .64rem .24rem .18rem; }
.chyn-faq-item.active .chyn-faq-body { display: block; }
.chyn-download-list { max-width: 12rem; margin: 0 auto; }
.chyn-download-item { gap: .3rem; padding: .24rem .28rem; background: #fff; border-radius: .08rem; box-shadow: 0 .06rem .18rem rgba(17,24,39,.05); }
.chyn-download-item + .chyn-download-item { margin-top: .14rem; }
.chyn-download-icon { width: .56rem; height: .56rem; display: inline-flex; align-items: center; justify-content: center; margin-right: .18rem; color: var(--theme-color); background: rgba(0,161,128,.1); border-radius: .06rem; font-size: var(--f14); font-weight: 700; }
@media screen and (max-width: 640px) { .chyn-download-item { align-items: flex-start; flex-direction: column; } }
@media screen and (max-width: 1000px) { .chyn-about-overview-copy,.chyn-about-overview-media { width: 100%; } .chyn-about-overview-media { margin-top: .35rem; } .chyn-about-facts-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media screen and (max-width: 640px) { .chyn-about-facts-grid,.chyn-about-culture-grid { grid-template-columns: 1fr; } }
@media screen and (max-width: 1100px) { .chyn-solution-grid { grid-template-columns: 1fr; } .chyn-solution-article { width: 68%; } .chyn-solution-aside { width: 29%; } }
@media screen and (max-width: 800px) { .chyn-solution-card a { grid-template-columns: 1fr; } .chyn-solution-media .rect-67 { height: auto; padding-bottom: 67%; } .chyn-solution-article,.chyn-solution-aside { width: 100%; } .chyn-solution-aside { margin-top: .3rem; position: static; } }
@media screen and (max-width: 900px) { .chyn-case-grid { grid-template-columns: 1fr; } .chyn-case-head .chyn-page-intro { width: 100%; max-width: none; margin-top: .15rem; } .chyn-case-detail-title { font-size: var(--f38); } }
@media screen and (max-width: 1200px) { .chyn-news-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .chyn-news-article { width: 68%; } .chyn-news-aside { width: 29%; } }
@media screen and (max-width: 900px) { .chyn-news-article,.chyn-news-aside { width: 100%; } .chyn-news-aside { margin-top: .35rem; position: static; } }
@media screen and (max-width: 640px) { .chyn-news-grid { grid-template-columns: 1fr; } .chyn-news-article-head,.chyn-news-article-body { padding-left: .24rem; padding-right: .24rem; } .chyn-news-copy { padding-left: .82rem; } }
@media screen and (max-width: 1000px) { .chyn-product-grid { grid-template-columns: 1fr 1fr; } .chyn-product-main { width: 100%; } }
@media screen and (max-width: 640px) { .chyn-product-grid { grid-template-columns: 1fr; } }
@media screen and (max-width: 1000px) { .chyn-contact-form-wrap,.chyn-contact-aside { width: 100%; } .chyn-contact-aside { margin-top: .35rem; } }
@media screen and (max-width: 1000px) {
.chyn-inner-banner { min-height: 4.1rem; }
.chyn-inner-banner-inner { padding: 1.4rem .24rem .46rem; }
.chyn-inner-banner-title { font-size: var(--f40); }
.chyn-inner-subnav .w16 { padding: 0 .24rem; }
.chyn-inner-subnav .sort_nav_view ul { flex-wrap: wrap; gap: .1rem .2rem; }
.chyn-inner-subnav .sort_nav_view ul li a { line-height: .48rem; }
.chyn-page-section { padding: .7rem 0; }
.chyn-page-title { font-size: var(--f32); }
}
/* CHYN HUANGHUA INNER REPLICA START */
/* ====================内页样式========================= */
/* ====================关于样式========================= */
/* 公司简介 s */
/* 公司简介 e */
/* 企业文化 s */
/* 企业文化 e */
/* 荣誉资质 s */
/* 荣誉资质 e */
/* 工厂环境 s */
/* 工厂环境 e */
/* ====================产品样式========================= */
/* 产品列表 s */
/* 产品列表 e */
/* 产品详情 s */
/* 产品详情 e */
/* ====================新闻样式========================= */
/* 新闻列表 s */
/* 新闻列表 e */
/* 新闻详情 s */
/* 新闻详情 e */
/* ====================应用样式========================= */
/* ====================服务样式========================= */
/* 服务支持 s */
/* 服务支持 e */
/* 常见问题 s */
/* 常见问题 e */
/* 下载中心 s */
/* 下载中心 e */
/* 视频中心 s */
/* 视频中心 e */
/* ====================联系样式========================= */
/* 联系我们 s */
/* 联系我们 e */
/* -------------------------PC端--------------------------- */
@media all and (max-width:1700px) {
/* 1600 × (900/1024/1200) */
}
@media all and (max-width:1599px) {
/* 1440 × (900/1050) */
.Header-container .c-nav>li{
margin-right: 0.4rem;
}
}
@media all and (max-width:1439px) {
/* 1360 × (768) */
}
@media all and (max-width:1359px) {
/* 1280 × (800/854/1024) */
}
@media all and (max-width:1279px) {
/* 1152 × (864) */
}
@media all and (max-width:1151px) {
/* 1024 × (600/768) */
}
/* ------------------------手机端-------------------------- */
@media all and (max-width:1000px) {
/* 平板设备 720 适配 */
.pc{display: none;}
.mb{display: block;}
}
@media all and (max-width:768px) {
}
@media all and (max-width:640px) {
/* 移动终端以上 360 适配 */
}
@media all and (max-width:480px) {
}
@media all and (max-width:420px) {
}
@media all and (max-width:376px) {
}
/* ==================== Huanghua inner pages ==================== */
.Header-wrapper.white_bg{background:#fff;box-shadow:0 .02rem .1rem rgba(0,0,0,.06);}
.Header-wrapper.white_bg .Header-container .logo a img+img{display:block;}
.Header-wrapper.white_bg .Header-container .logo a img{display:none;}
.Header-wrapper.white_bg .Header-container .logo a img+img{display:block;}
.Header-wrapper.white_bg .Header-container .tool{color:#111;}
@media all and (min-width:1001px){.Header-wrapper.white_bg .Header-container .c-nav>li>a,.Header-wrapper.white_bg .Header-container .c-nav>li .c-title-box{color:#111;}}
.chyn-sec-main{min-width:0;}
.chyn-sec-kicker{color:var(--theme-color);letter-spacing:.02rem;}
.chyn-sec-title{color:#111;}
.chyn-sec-desc{width:5.8rem;max-width:100%;}
.chyn-btn{display:inline-flex;align-items:center;justify-content:center;gap:.12rem;padding:.16rem .34rem;border:.01rem solid var(--theme-color);border-radius:.06rem;background:var(--theme-color);color:#fff;transition:.3s ease;}
.chyn-btn svg{width:.18rem;height:.18rem;flex:0 0 .18rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s ease;}
.chyn-btn:hover svg{transform:translateX(.04rem);}
.chyn-btn:hover{background:#111;border-color:#111;color:#fff;transform:translateY(-.03rem);}
.chyn-btn.chyn-btn-outline{background:#fff;color:var(--theme-color);}
.chyn-btn.chyn-btn-outline:hover{background:var(--theme-color);border-color:var(--theme-color);color:#fff;}
.chyn-pagination .nav-links{display:flex;align-items:center;justify-content:center;gap:.1rem;flex-wrap: wrap;}
.chyn-pagination .page-numbers{display:inline-flex;min-width:.46rem;height:.46rem;padding:0 .14rem;align-items:center;justify-content:center;border-radius:.06rem;background:#f1f5f4;color:#34414a;font-size:var(--f16);line-height:1;transition:background-color .3s ease,color .3s ease,transform .3s ease;}
.chyn-pagination a.page-numbers:hover,.chyn-pagination .page-numbers.current{background:var(--theme-color);color:#fff;transform:translateY(-.02rem);}
.chyn-pagination .page-numbers.is-disabled{opacity:.42;cursor:not-allowed;transform:none;}
@media all and (max-width:767px){
.chyn-pagination .page-numbers{min-width:44px;height:44px;padding:0 14px;}
}
.chyn-crumb{padding:.22rem 0;background:#f5f6f8;font-size:var(--f16);color:#666;}
.chyn-crumb a:hover{color:var(--theme-color);}
.chyn-crumb i,.chyn-ban-crumb i,.chyn-service-ban-crumb i{display:inline-block;margin:0 .12rem;font-size:.12rem;font-weight:400;line-height:1;color:currentColor;opacity:.72;vertical-align:.02rem;}
/* Inner banner */
.chyn-ban{position:relative;height:5.4rem;overflow:hidden;background:#151b25;color:#fff;}
.chyn-ban-media,.chyn-ban-mask{position:absolute;inset:0;}
.chyn-ban-media img{width:100%;height:100%;object-fit:cover;}
.chyn-ban-mask{background:linear-gradient(90deg,rgba(7,12,20,.76),rgba(7,12,20,.34) 55%,rgba(7,12,20,.58));}
.chyn-ban-crumb{position:absolute;left:50%;top:.35rem;z-index:2;transform:translateX(-50%);font-size:var(--f16);font-weight:600;}
.chyn-ban-crumb a{color:#fff;}
.chyn-ban-crumb a,.chyn-service-ban-crumb a{transition:color .3s ease,opacity .3s ease;}
.chyn-ban-crumb a:hover,.chyn-service-ban-crumb a:hover{color:#fff;opacity:.72;}
.chyn-ban-copy{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-38%);text-align:center;}
.chyn-ban-copy h1{font-size:var(--f54);font-weight:700;line-height:1.1;}
.chyn-ban-desc{margin-top:.2rem;font-size:var(--f18);line-height:1.5;}
/* Product list and detail */
.chyn-pro-page{background:#f7f8fa;}
.chyn-pro-side{position:sticky;top:1.2rem;align-self:flex-start;}
.chyn-pro-widget,.chyn-pro-block{background:#fff;border-radius:.1rem;box-shadow:0 .1rem .3rem rgba(0,0,0,.05);}
.chyn-pro-widget>h2{border-bottom:.01rem solid #e8e8e8;}
.chyn-pro-search{display:flex;overflow:hidden;border:.01rem solid #e4e7eb;border-radius:.06rem;}
.chyn-pro-search input{min-width:0;flex:1;padding:.14rem;border:0;background:#f7f8fa;}
.chyn-pro-search button{width:.5rem;border:0;background:var(--theme-color);color:#fff;cursor:pointer;}
.chyn-pro-menu>li{border-bottom:.01rem solid #eee;}
.chyn-pro-menu>li:last-child{border-bottom:0;}
.chyn-pro-menu-head{display:flex;align-items:center;justify-content:space-between;min-height:.54rem;gap:.12rem;}
.chyn-pro-menu-head>a{display:block;flex:1;padding:.14rem 0;}
.chyn-pro-toggle{display:flex;width:.38rem;height:.38rem;align-items:center;justify-content:center;flex:0 0 .38rem;border:0;border-radius:50%;background:transparent;color:#666;cursor:pointer;transition:background-color .3s ease,color .3s ease,transform .3s ease;}
.chyn-pro-toggle i{font-size:.2rem;transition:transform .3s ease;}
.chyn-pro-toggle:hover{background:#f2f3f5;color:var(--theme-color);}
.chyn-pro-menu>li.open>.chyn-pro-menu-head .chyn-pro-toggle{color:var(--theme-color);}
.chyn-pro-menu>li.open>.chyn-pro-menu-head .chyn-pro-toggle i{transform:rotate(180deg);}
.chyn-pro-menu li.active>.chyn-pro-menu-head>a,.chyn-pro-menu li.active>a,.chyn-pro-menu a:hover{color:var(--theme-color);}
.chyn-pro-menu .chyn-pro-sub{display:none;padding:0 0 .1rem .18rem;}
.chyn-pro-menu ul li{padding:.08rem 0;}
.chyn-pro-menu ul a:before{content:'–';margin-right:.08rem;color:#aaa;}
.chyn-pro-rec li+li{margin-top:.16rem;}
.chyn-pro-rec a{gap:.14rem;align-items:center;}
.chyn-pro-rec-img{width:.72rem;height:.72rem;flex:0 0 .72rem;border-radius:.06rem;overflow:hidden;background:#f7f7f7;}
.chyn-pro-rec-img img{width:100%;height:100%;object-fit:contain;}
.chyn-pro-rec a:hover h3{color:var(--theme-color);}
.chyn-pro-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem;}
.chyn-pro-card{display:block;overflow:hidden;border:.01rem solid #eceef1;border-radius:.1rem;background:#fff;box-shadow:0 .08rem .24rem rgba(0,0,0,.05);transition:.35s ease;}
.chyn-pro-card:hover{border-color:var(--theme-color);transform:translateY(-.06rem);box-shadow:0 .16rem .36rem rgba(0,0,0,.09);}
.chyn-pro-media{background:#fff;}
.chyn-pro-media img,.chyn-pro-related img{object-fit:contain!important;}
.chyn-pro-info h2,.chyn-pro-info h3{min-height:2.6em;}
.chyn-pro-more{color:var(--theme-color);}
.chyn-pro-card:hover .chyn-pro-more i{transform:translateX(.06rem);}
.chyn-pro-block{margin-bottom:.35rem;}
.chyn-search-page{background:#f7f8fa;}
.chyn-search-wrap{padding:0 .02rem;}
.chyn-search-toolbar{gap:.35rem;padding-bottom:.28rem;border-bottom:.01rem solid #e5e8eb;}
.chyn-search-heading{min-width:0;}
.chyn-search-kicker{color:var(--theme-color);letter-spacing:.08em;text-transform:uppercase;}
.chyn-search-keyword{color:var(--theme-color);}
.chyn-search-form{width:4.6rem;min-height:.56rem;overflow:hidden;border:.01rem solid #dfe3e7;border-radius:.06rem;background:#fff;}
.chyn-search-form input{min-width:0;flex:1;padding:.13rem .16rem;border:0;background:#fff;color:#222;}
.chyn-search-form button{display:flex;width:.56rem;height:.56rem;align-items:center;justify-content:center;flex:0 0 .56rem;padding:0;border:0;background:var(--theme-color);color:#fff;cursor:pointer;transition:background-color .25s ease;}
.chyn-search-form button:hover{background:#007b65;}
.chyn-search-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.3rem;}
.chyn-search-card{height:100%;}
.chyn-search-category{letter-spacing:.04em;text-transform:uppercase;}
.chyn-search-empty{padding:1rem .3rem;text-align:center;background:#fff;border:.01rem solid #e7eaed;border-radius:.08rem;color:#6a7076;font-size:var(--f18);}
.chyn-search-card .chyn-pro-info{min-height:2.55rem;}
.chyn-search-card .chyn-search-category{min-height:1em;}
.chyn-search-card h3{font-weight:500;}
.chyn-search-pagebar{margin-top:.35rem;}
.chyn-pro-gallery-main,.chyn-pro-gallery-thumbs .swiper-slide{overflow:hidden;border:.01rem solid #e8e8e8;border-radius:.08rem;background:#fff;}
.chyn-pro-gallery-thumbs .swiper-slide{cursor:pointer;transition:border-color .3s ease;}
.chyn-pro-gallery-thumbs .swiper-slide.swiper-slide-thumb-active{border-color:var(--theme-color);}
.chyn-pro-gallery-main img,.chyn-pro-gallery-thumbs img{object-fit:contain!important;}
.chyn-pro-thumbs{position:relative;padding:0 .34rem;}
.chyn-pro-thumbs button,.chyn-pro-related button{position:absolute;z-index:3;border:.01rem solid #d9dee3;background:#fff;color:#59636d;cursor:pointer;transition:background-color .3s ease,border-color .3s ease,color .3s ease;}
.chyn-pro-thumbs button:not(.swiper-button-disabled):hover,.chyn-pro-related button:not(.swiper-button-disabled):hover{border-color:var(--theme-color);background:var(--theme-color);color:#fff;}
.chyn-pro-thumbs button.swiper-button-disabled,.chyn-pro-related button.swiper-button-disabled{opacity:.42;cursor:default;}
.chyn-pro-thumbs button{top:0;width:.26rem;height:100%;}
.chyn-thumb-prev{left:0;}.chyn-thumb-next{right:0;}
.chyn-pro-tabs{gap:.32rem;border-bottom:.01rem solid #e7e7e7;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none;}
.chyn-pro-tabs::-webkit-scrollbar{display:none;}
.chyn-pro-tabs button{position:relative;padding:0 0 .16rem;border:0;background:none;white-space:nowrap;cursor:pointer;}
.chyn-pro-tabs button:after{position:absolute;content:'';left:50%;bottom:-.01rem;width:0;height:.03rem;background:var(--theme-color);transform:translateX(-50%);transition:.3s ease;}
.chyn-pro-tabs button.active,.chyn-pro-tabs button:hover{color:var(--theme-color);}
.chyn-pro-tabs button.active:after{width:100%;}
/* .chyn-pro-panes{padding-top:.3rem;} */
.chyn-pro-pane{display:none;}
.chyn-pro-pane.active{display:block;}
.chyn-pro-pane h2,.chyn-pro-pane h3,.chyn-pro-pane h4{font-weight:700;line-height:1.25;margin:.3rem 0 .16rem;color:#111;}
.chyn-pro-pane h2{font-size:var(--f30);}.chyn-pro-pane h3{font-size:var(--f24);}.chyn-pro-pane h4{font-size:var(--f20);}
.chyn-pro-pane p{margin-bottom:1em;line-height:1.7;}
.chyn-pro-detail-section{margin-bottom:.38rem;}
.chyn-pro-detail-section:last-child{margin-bottom:0;}
.chyn-pro-detail-text{color:#505962;text-wrap:pretty;}
.chyn-pro-detail-text+.chyn-pro-detail-text{margin-top:.14rem;}
.chyn-pro-detail-list{display:grid;gap:.1rem;margin-top:.16rem;padding-left:.2rem;}
.chyn-pro-detail-list li{margin-left:.16rem;list-style:disc;color:#505962;}
.chyn-pro-detail-list strong{color:#161a20;}
.chyn-pro-detail-note{margin-top:.22rem;padding:.2rem .22rem;border-radius:.07rem;background:#f4f6f8;color:#505962;}
.chyn-pro-detail-heading-2{margin:1.15em 0 .5em;color:#17202a;font-size:var(--f30);line-height:1.3;}
.chyn-pro-detail-heading-3{margin:1em 0 .45em;color:#17202a;font-size:var(--f24);line-height:1.35;}
.chyn-pro-detail-paragraph{margin-bottom:1em;color:#3f4b53;font-size:var(--f18);line-height:1.75;}
.chyn-pro-detail-list{display:grid;gap:.08rem;margin-bottom:1.15em;padding-left:.24rem;}
.chyn-pro-detail-list-item{list-style:disc;color:#3f4b53;font-size:var(--f18);line-height:1.7;}
.chyn-pro-table-wrap{max-width:100%;margin:.28rem 0 .4rem;overflow-x:auto;border-radius:.08rem;box-shadow:0 .06rem .16rem rgba(15,35,47,.06);}
.chyn-pro-detail-table{width:100%;min-width:7.6rem;border-collapse:collapse;background:#fff;}
.chyn-pro-detail-table th,.chyn-pro-detail-table td{padding:.15rem .16rem;border:.01rem solid #dfe5e7;color:#3f4b53;font-size:var(--f16);line-height:1.55;text-align:left;vertical-align:top;}
.chyn-pro-detail-table th{background:#eef7f5;color:#17202a;font-weight:700;}
.chyn-pro-detail-table tbody th[scope="row"]{width:32%;background:#fff;color:#263238;font-weight:600;}
.chyn-pro-detail-table tbody tr:nth-child(even) th[scope="row"]{background:#fafcfc;}
.chyn-pro-detail-table tr.chyn-pro-detail-table-group th{width:auto;padding:.12rem .16rem;background:#dcefeb;color:#007e67;font-size:var(--f16);font-weight:700;letter-spacing:.01em;}
.chyn-pro-detail-table tr:nth-child(even) td{background:#fafcfc;}
.chyn-pro-detail-figure{margin:.34rem auto;text-align:center;}
.chyn-pro-detail-image{width:auto;max-width:100%;height:auto;border-radius:.08rem;box-shadow:0 .08rem .22rem rgba(15,35,47,.08);}
.chyn-pro-detail-rule{height:.01rem;margin:.4rem 0;border:0;background:#e3e8ea;}
.chyn-pro-detail-quote{margin:.3rem 0;padding:.24rem .28rem;border-radius:.08rem;background:#eef7f5;color:#31434a;font-size:var(--f18);line-height:1.7;}
.chyn-pro-pane .chyn-pro-spec-table th{width:32%;color:#20262c;vertical-align:top;}
.chyn-pro-pane .chyn-pro-spec-table td{color:#505962;vertical-align:top;}
.chyn-pro-pane .scroll{max-width:100%;overflow-x:auto;}
.chyn-pro-pane table{width:100%;min-width:7rem;border-collapse:collapse;}
.chyn-pro-pane th,.chyn-pro-pane td{padding:.14rem;border:.01rem solid #e5e5e5;text-align:left;}
.chyn-pro-pane tr:nth-child(even){background:#f7f8f9;}
.chyn-pro-related-wrap{position:relative;margin-right:-.38rem;margin-left:-.38rem;padding:0 .38rem;}
.chyn-pro-block .chyn-pro-related{padding:.28rem .08rem;overflow:hidden;}
.chyn-pro-related-wrap>button{position:absolute;top:50%;z-index:3;width:.62rem;height:.62rem;border:.01rem solid #d9dee3;border-radius:50%;background:#fff;color:#44515a;cursor:pointer;box-shadow:0 .1rem .26rem rgba(7,27,39,.14);transform:translateY(-50%);transition:.3s ease;}
.chyn-pro-related-wrap>button:hover{border-color:var(--theme-color);background:var(--theme-color);color:#fff;}
.chyn-rel-prev{left:0;}.chyn-rel-next{right:0;}
.chyn-pro-form input,.chyn-pro-form textarea{margin-bottom:.18rem;padding:.16rem;border:.01rem solid transparent;border-radius:.06rem;background:#f4f5f7;line-height:1.5;}
.chyn-pro-form input:focus,.chyn-pro-form textarea:focus{border-color:var(--theme-color);background:#fff;outline:0;}
.chyn-pro-summary-actions{gap:.14rem;}
.chyn-pro-summary-actions .chyn-btn{min-height:.54rem;}
.chyn-pro-summary-actions .chyn-btn-outline{background:#fff;color:var(--theme-color);}
.chyn-pro-summary-actions .chyn-btn-outline:hover{background:var(--theme-color);color:#fff;}
.chyn-fluent-form .ff-t-container{display:flex;gap:.18rem;margin:0;}
.chyn-fluent-form .ff-t-cell{min-width:0;}
.chyn-fluent-form .ff-el-group{margin-bottom:.18rem;}
.chyn-fluent-form .ff-el-input--label{margin-bottom:.1rem;}
.chyn-fluent-form .ff-el-input--label label{color:#24343b;font-size:var(--f16);font-weight:500;line-height:1.35;}
.chyn-fluent-form .ff-default .ff-el-form-control{width:100%;min-height:.56rem;padding:.15rem .16rem;border:.01rem solid #e1e7e9;border-radius:.06rem;background:#f5f7f8;color:#263238;font-family:"DR",sans-serif;font-size:var(--f16);line-height:1.5;box-shadow:none;transition:border-color .25s ease,background-color .25s ease,box-shadow .25s ease;}
.chyn-fluent-form textarea.ff-el-form-control{min-height:1.5rem;resize:vertical;}
.chyn-fluent-form .ff-el-form-control:focus{border-color:var(--theme-color);background:#fff;box-shadow:0 0 0 .03rem rgba(0,161,128,.12);outline:0;}
.chyn-fluent-form .ff-btn-submit{min-height:.54rem;padding:.15rem .34rem;border:.01rem solid var(--theme-color);border-radius:.06rem;background:var(--theme-color);color:#fff;font-size:var(--f16);font-weight:600;line-height:1.2;cursor:pointer;transition:background-color .25s ease,border-color .25s ease,transform .25s ease;}
.chyn-fluent-form .ff-btn-submit:hover,.chyn-fluent-form .ff-btn-submit:focus{border-color:#111;background:#111;color:#fff;transform:translateY(-.03rem);}
.chyn-pro-form .ff-default .ff-el-input--label{position:absolute;width:.01rem;height:.01rem;margin:-.01rem;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.chyn-pro-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style{border-color:var(--theme-color);background:var(--theme-color);color:#fff;box-shadow:none;}
.chyn-pro-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style:hover,.chyn-pro-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style:focus{border-color:#008a6d;background:#008a6d;color:#fff;}
.chyn-pro-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style:focus-visible{outline:.02rem solid #006f59;outline-offset:.03rem;}
.chyn-contact-fluent-form{margin-top:.35rem;}
.chyn-contact-form .chyn-contact-fluent-form label{width:auto;}
.chyn-contact-form .chyn-contact-fluent-form input,.chyn-contact-form .chyn-contact-fluent-form textarea{margin:0;}
/* News */
.chyn-news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem;}
.chyn-news-card{overflow:hidden;border-radius:.1rem;background:#fff;box-shadow:0 .08rem .28rem rgba(0,0,0,.08);}
.chyn-news-card>a{display:block;}
.chyn-news-card:hover{transform:translateY(-.06rem);box-shadow:0 .16rem .36rem rgba(0,0,0,.12);}
.chyn-news-info{position:relative;padding-top:.46rem;}
.chyn-news-date{position:absolute;left:.3rem;bottom:100%;width:.82rem;text-align:center;box-shadow:0 .04rem .14rem rgba(0,0,0,.12);}
.chyn-news-date strong,.chyn-news-date span{display:block;}
.chyn-news-date strong{padding:.14rem 0;background:var(--theme-color);color:#fff;font-size:var(--f30);}
.chyn-news-date span{padding:.08rem;background:#f3f4f7;font-size:var(--f14);}
.chyn-news-card h2{height:2.6em;}
.chyn-news-card:hover h2,.chyn-news-more{color:var(--theme-color);}
.chyn-news-detail{background:#f5f6f8;}
.chyn-news-article{width:calc(100% - 4.5rem);overflow:hidden;border-radius:.1rem;background:#fff;box-shadow:0 .08rem .26rem rgba(0,0,0,.07);}
.chyn-news-head{border-bottom:.01rem solid #e8e8e8;}
.chyn-news-meta{color:#777;}
.chyn-news-side{position:sticky;top:1.2rem;width:4rem;align-self:flex-start;}
.chyn-news-toc,.chyn-news-rec{border-radius:.1rem;background:#fff;box-shadow:0 .08rem .26rem rgba(0,0,0,.07);}
.chyn-news-toc li{padding:.07rem 0;}
.chyn-news-toc li li{padding-left:.16rem;}
.chyn-news-toc a:hover{color:var(--theme-color);text-decoration:underline;}
.chyn-news-rec li+li{margin-top:.18rem;}
.chyn-news-rec a{gap:.14rem;align-items:center;}
.chyn-news-rec a>span{width:1.15rem;height:.78rem;flex:0 0 1.15rem;border-radius:.06rem;overflow:hidden;}
.chyn-news-rec img{width:100%;height:100%;object-fit:cover;}
.chyn-news-rec a:hover h3{color:var(--theme-color);}
.chyn-news-turn{border-top:.01rem solid #e8e8e8;gap:.2rem;}
.chyn-news-turn>div{display:flex;flex-direction:column;width:46%;gap:.08rem;}
.chyn-news-turn>div:last-child{text-align:right;}
.chyn-news-turn span{font-weight:700;color:var(--theme-color);}
.chyn-article h2,.chyn-article h3,.chyn-article h4,.chyn-article h5{margin:1.2em 0 .55em;font-weight:700;line-height:1.35;color:#171717;}
.chyn-article h2{font-size:var(--f30);padding-bottom:.12rem;border-bottom:.01rem solid #e8e8e8;}.chyn-article h3{font-size:var(--f24);}.chyn-article h4{font-size:var(--f20);}.chyn-article h5{font-size:var(--f18);}
.chyn-article p{margin-bottom:1em;line-height:1.75;}.chyn-article ul,.chyn-article ol{padding-left:.22rem;margin-bottom:1.2em;}.chyn-article li{list-style:disc;margin-bottom:.08rem;line-height:1.7;}
.chyn-article img{height:auto;max-width:100%;border-radius:.08rem;}.chyn-article .scroll{max-width:100%;overflow-x:auto;}.chyn-article table{width:100%;min-width:7rem;border-collapse:collapse;}.chyn-article th,.chyn-article td{padding:.13rem;border:.01rem solid #e5e5e5;line-height:1.5;}.chyn-article th{background:#f4f6f8;}.chyn-article tr:nth-child(even){background:#fafafa;}
.chyn-arrow-icon,.chyn-product-mega-all svg,.chyn-download-btn svg,.chyn-news-more svg,.chyn-sol-list-more svg,.chyn-sol-aside-action svg{width:.32rem;height:.32rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto;transition:transform .3s ease;}
.chyn-pro-more,.chyn-product-mega-all,.chyn-download-btn,.chyn-news-more,.chyn-sol-list-more,.chyn-sol-aside-action{display:inline-flex;align-items:center;gap:.08rem;}
a:hover>.chyn-arrow-icon,.chyn-product-mega-all:hover svg,.chyn-download-btn:hover svg,.chyn-news-more:hover svg,.chyn-sol-list-more:hover svg,.chyn-sol-aside-action:hover svg{transform:translateX(.05rem);}
.chyn-article blockquote{margin:.3rem 0;padding:.24rem .3rem;border-radius:.08rem;background:#f3f5f7;font-size:var(--f18);line-height:1.7;}
.chyn-news-anchor-heading{scroll-margin-top:1.35rem;}
.chyn-news-turn span.chyn-news-turn-disabled{font-weight:400;color:#9aa4a9;cursor:default;}
.chyn-scroll-shell{position:relative;min-height:0;}
.chyn-scroll-track{position:absolute;right:0;top:0;bottom:0;width:.04rem;border-radius:.04rem;background:#d5dcdb;opacity:0;pointer-events:none;transition:opacity .25s ease;}
.chyn-scroll-track.is-visible{opacity:1;}
.chyn-scroll-track span{display:block;width:100%;min-height:.8rem;border-radius:.04rem;background:var(--theme-color);transform-origin:top center;will-change:transform;}
.chyn-news-toc-scroll{position:relative;}
.chyn-news-toc #catalog{display:grid;max-height:4rem;gap:.17rem;padding-right:.18rem;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;}
.chyn-news-toc #catalog>li{padding:0;}
.chyn-news-toc #catalog>li+li{margin-top:0;}
.chyn-news-toc #catalog ul{display:grid;gap:.09rem;margin-top:.1rem;padding-left:.3rem;}
.chyn-news-toc #catalog a{position:relative;display:block;color:#65727a;text-decoration:none;transition:color .25s ease,transform .25s ease;}
.chyn-news-toc #catalog>.chyn-news-toc-primary>a{padding-left:.18rem;color:#28343a;font-size:var(--f18);font-weight:700;line-height:1.4;}
.chyn-news-toc #catalog>.chyn-news-toc-primary>a:before{position:absolute;left:0;top:.1rem;width:.07rem;height:.07rem;content:"";border-radius:50%;background:#c5ced2;transition:background-color .25s ease,transform .25s ease;}
.chyn-news-toc #catalog .chyn-news-toc-secondary{padding:0;}
.chyn-news-toc #catalog .chyn-news-toc-secondary a{font-size:var(--f16);font-weight:400;line-height:1.5;}
.chyn-news-toc #catalog a:hover,.chyn-news-toc #catalog a.is-active{color:var(--theme-color);text-decoration:none;}
.chyn-news-toc #catalog>.chyn-news-toc-primary>a:hover,.chyn-news-toc #catalog>.chyn-news-toc-primary>a.is-active{transform:translateX(.03rem);}
.chyn-news-toc #catalog>.chyn-news-toc-primary>a:hover:before,.chyn-news-toc #catalog>.chyn-news-toc-primary>a.is-active:before{background:var(--theme-color);transform:scale(1.28);}
.chyn-news-toc #catalog a:focus-visible{outline:.02rem solid var(--theme-color);outline-offset:.04rem;border-radius:.03rem;}
.chyn-news-toc .chyn-scroll-area{display:grid;max-height:4rem;gap:.14rem;padding-right:.18rem;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;}
.chyn-news-toc .chyn-scroll-area::-webkit-scrollbar{display:none;}
.chyn-news-toc .chyn-toc-link{position:relative;display:block;color:#65727a;text-decoration:none;transition:color .25s ease,transform .25s ease;}
.chyn-news-toc .chyn-toc-h2{padding-left:.18rem;color:#28343a;font-size:var(--f18);font-weight:700;line-height:1.4;}
.chyn-news-toc .chyn-toc-h2:before{position:absolute;left:0;top:.1rem;width:.07rem;height:.07rem;content:"";border-radius:50%;background:#c5ced2;transition:background-color .25s ease,transform .25s ease;}
.chyn-news-toc .chyn-toc-h3{padding-left:.3rem;font-size:var(--f16);font-weight:400;line-height:1.5;}
.chyn-news-toc .chyn-toc-link:hover,.chyn-news-toc .chyn-toc-link.is-active{color:var(--theme-color);}
.chyn-news-toc .chyn-toc-h2:hover,.chyn-news-toc .chyn-toc-h2.is-active{transform:translateX(.03rem);}
.chyn-news-toc .chyn-toc-h2:hover:before,.chyn-news-toc .chyn-toc-h2.is-active:before{background:var(--theme-color);transform:scale(1.28);}
.chyn-news-toc .chyn-toc-link:focus-visible{outline:.02rem solid var(--theme-color);outline-offset:.04rem;border-radius:.03rem;}
/* CHYN shared directional arrow */
.fa.fa-long-arrow-right{display:inline-block;width:.22rem;height:.22rem;flex:0 0 .22rem;background:currentColor;font-size:0;line-height:1;vertical-align:-.04rem;-webkit-mask:url('../images/generated/chyn-arrow-right.svg') center/contain no-repeat;mask:url('../images/generated/chyn-arrow-right.svg') center/contain no-repeat;}
.fa.fa-long-arrow-right:before{display:none;content:"";}
/* Contact */
.chyn-contact-form{width:58%;}.chyn-contact-info{width:36%;}
.chyn-contact-form form{row-gap:.18rem;}
.chyn-contact-form label{display:block;width:48%;}.chyn-contact-form label span{display:block;margin-bottom:.1rem;font-weight:600;}
.chyn-contact-form input,.chyn-contact-form textarea{width:100%;padding:.16rem;border:.01rem solid #e4e7eb;border-radius:.06rem;background:#f7f8fa;line-height:1.5;}
.chyn-contact-form input{height:.58rem;}.chyn-contact-form input:focus,.chyn-contact-form textarea:focus{border-color:var(--theme-color);background:#fff;outline:0;}
.chyn-contact-form .chyn-contact-wide{width:100%;}
.chyn-contact-info{padding:.4rem;border-radius:.12rem;background:#f5f6f8;}
.chyn-contact-info-list{display:flex;flex-direction:column;}
.chyn-contact-info li{display:flex;align-items:flex-start;gap:.22rem;padding:.26rem 0;border-bottom:.01rem solid #dde1e6;}
.chyn-contact-info li:last-child{border-bottom:0;}
.chyn-contact-info li>i{display:flex;width:.64rem;height:.64rem;align-items:center;justify-content:center;flex:0 0 .64rem;border-radius:50%;background:var(--theme-color);color:#fff;font-size:var(--f26);}
.chyn-contact-info-item{min-width:0;padding-top:.03rem;}
.chyn-contact-info-item h3{margin-bottom:.1rem;line-height:1.25;}
.chyn-contact-info-item a,.chyn-contact-address{display:block;line-height:1.5;overflow-wrap:anywhere;}
.chyn-contact-info li a:hover{color:var(--theme-color);}
/* Download and FAQ */
.chyn-download{background:#f6f7f9;}.chyn-download-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.2rem;}
.chyn-download-item{align-items:center;border:.01rem solid transparent;border-radius:.1rem;background:#fff;box-shadow:0 .08rem .22rem rgba(0,0,0,.05);transition:.3s ease;}
.chyn-download-item:hover{border-color:var(--theme-color);transform:translateY(-.04rem);}
.chyn-download-info{gap:.2rem;align-items:center;}.chyn-download-icon{display:flex;width:.72rem;height:.72rem;align-items:center;justify-content:center;flex:0 0 .72rem;border-radius:.08rem;background:#f4f5f7;color:var(--theme-color);font-size:var(--f36);}
.chyn-download-btn{display:inline-flex;align-items:center;gap:.1rem;padding:.14rem .22rem;border-radius:.05rem;background:var(--theme-color);color:#fff;white-space:nowrap;}.chyn-download-btn:hover{background:#111;color:#fff;}
.chyn-faq-list{width:14rem;max-width:100%;margin:0 auto;}
.chyn-faq-item{margin-bottom:.18rem;border:.01rem solid #e2e5e9;border-radius:.08rem;background:#fff;overflow:hidden;}
.chyn-faq-item.active{border-color:var(--theme-color);box-shadow:0 .08rem .2rem rgba(var(--theme-color-rgb),.09);}
.chyn-faq-head{display:flex;width:100%;align-items:center;justify-content:space-between;gap:.25rem;padding:.24rem .28rem;border:0;background:#fff;text-align:left;cursor:pointer;}
.chyn-faq-head h3{transition:.3s ease;}.chyn-faq-head>span{position:relative;width:.2rem;height:.2rem;flex:0 0 .2rem;}.chyn-faq-head>span:before,.chyn-faq-head>span:after{position:absolute;content:'';left:0;top:.09rem;width:.2rem;height:.02rem;background:#222;transition:.3s ease;}.chyn-faq-head>span:after{transform:rotate(90deg);}
.chyn-faq-item.active .chyn-faq-head h3,.chyn-faq-item:hover .chyn-faq-head h3{color:var(--theme-color);}.chyn-faq-item.active .chyn-faq-head>span:after{opacity:0;}
.chyn-faq-body{display:none;padding:0 .28rem .28rem;}.chyn-faq-item.active .chyn-faq-body{display:block;}.chyn-faq-body>div{padding-top:.22rem;border-top:.01rem solid #e6e7e9;}
/* Service and video */
.chyn-service-copy{width:45%;align-self:center;}.chyn-service-media{width:49%;overflow:hidden;border-radius:.12rem;}.chyn-service-links{background:#f5f6f8;}
.chyn-service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.24rem;}
.chyn-service-card{overflow:hidden;border-radius:.1rem;background:#fff;box-shadow:0 .08rem .24rem rgba(0,0,0,.06);}.chyn-service-card:hover{transform:translateY(-.06rem);}.chyn-service-card:hover img{transform:scale(1.05);}.chyn-service-card span{display:inline-block;color:var(--theme-color);}
.chyn-video-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem;}
.chyn-video-card{overflow:hidden;border-radius:.1rem;background:#fff;box-shadow:0 .08rem .26rem rgba(0,0,0,.08);}.chyn-video-card:hover{transform:none;}.chyn-video-img{position:relative;}.chyn-video-play{position:absolute;left:50%;top:50%;display:flex;width:.72rem;height:.72rem;align-items:center;justify-content:center;border:.01rem solid rgba(255,255,255,.8);border-radius:50%;background:rgba(0,0,0,.55);color:#fff;transform:translate(-50%,-50%);}.chyn-video-card:hover .chyn-video-play{background:var(--theme-color);transform:translate(-50%,-50%) scale(1.08);}.chyn-video-card:hover h2{color:var(--theme-color);}
/* Cases */
.chyn-case-list{background:#f5f6f8;}.chyn-case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;}
.chyn-case-card{position:relative;overflow:hidden;border-radius:.14rem;background:#101722;transition:transform .35s ease,box-shadow .35s ease;}.chyn-case-card>a{display:block;color:#fff;}.chyn-case-img:after{position:absolute;content:'';inset:0;background:linear-gradient(180deg,rgba(6,12,20,.02) 35%,rgba(6,12,20,.9) 100%);}.chyn-case-img img{transition:transform .6s ease;}.chyn-case-card:hover{transform:translateY(-.05rem);box-shadow:0 .18rem .38rem rgba(8,16,27,.18);}.chyn-case-card:hover img{transform:scale(1.05);}
.chyn-case-type{position:absolute;left:.24rem;top:.24rem;z-index:2;padding:.13rem .22rem;border-radius:.4rem;background:rgba(255,255,255,.18);backdrop-filter:blur(.08rem);}
.chyn-case-bottom{position:absolute;left:.26rem;right:.26rem;bottom:.24rem;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:.2rem;}.chyn-case-bottom h2{max-width:80%;}.chyn-case-bottom span{display:flex;width:.52rem;height:.52rem;align-items:center;justify-content:center;flex:0 0 .52rem;border-radius:50%;background:var(--theme-color);transition:background-color .3s ease,color .3s ease,transform .3s ease;}.chyn-case-bottom svg{width:.22rem;height:.22rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s ease;}.chyn-case-card:hover .chyn-case-bottom span{background:#fff;color:var(--theme-color);}.chyn-case-card:hover .chyn-case-bottom svg{transform:translateX(.03rem);}
.chyn-case-bottom .chyn-case-arrow{position:static;right:auto;bottom:auto;}
/* Inner page motion */
.chyn-news-card,.chyn-video-card,.chyn-service-adv-grid article,.chyn-service-grid article,.chyn-contact-info li{transition:transform .35s ease,box-shadow .35s ease,background-color .35s ease;}
.chyn-news-img img,.chyn-video-img img,.chyn-pro-media img,.chyn-pro-rec-img img{transition:transform .55s ease;}
.chyn-news-card:hover,.chyn-service-adv-grid article:hover,.chyn-service-grid article:hover{transform:translateY(-.05rem);box-shadow:0 .16rem .34rem rgba(8,16,27,.1);}
.chyn-video-card:hover{transform:none;box-shadow:0 .16rem .34rem rgba(8,16,27,.1);}
.chyn-news-card:hover .chyn-news-img img,.chyn-video-card:hover .chyn-video-img img,.chyn-pro-card:hover .chyn-pro-media img{transform:scale(1.04);}
.chyn-video-play,.chyn-download-btn,.chyn-pro-more i,.chyn-news-more i{transition:transform .3s ease,background-color .3s ease,color .3s ease;}
.chyn-video-card:hover .chyn-video-play{transform:translate(-50%,-50%) scale(1.08);}
.chyn-case-head{gap:.4rem;}.chyn-case-title{width:9.5rem;max-width:100%;}.chyn-case-meta{gap:.24rem;color:#555;}.chyn-case-meta i{margin-right:.07rem;color:var(--theme-color);}.chyn-case-stat{min-width:3rem;padding-left:.4rem;border-left:.01rem solid #d9dde2;}.chyn-case-stat strong{color:var(--theme-color);}
.chyn-case-cover{display:block;overflow:hidden;border-radius:.12rem;box-shadow:0 .16rem .4rem rgba(0,0,0,.12);}.chyn-case-overview{position:relative;background:#fff;}
.chyn-case-cta{position:relative;height:6.8rem;overflow:hidden;}.chyn-case-cta-img,.chyn-case-cta-mask{position:absolute;inset:0;}.chyn-case-cta-img img{width:100%;height:100%;object-fit:cover;}.chyn-case-cta-mask{background:rgba(0,31,68,.58);}.chyn-case-cta-copy{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);}.chyn-case-cta-copy>div{width:8rem;max-width:100%;margin-left:auto;margin-right:auto;}
@media all and (max-width:1400px){
.chyn-pro-grid,.chyn-search-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.chyn-service-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media all and (max-width:1000px){
.chyn-ban{height:4.6rem;}.chyn-ban-crumb{top:.26rem;}.chyn-ban-copy h1{font-size:.46rem;}
.chyn-pro-side,.chyn-pro-main{position:static;width:100%;}.chyn-pro-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.2rem;margin-bottom:.35rem;}.chyn-pro-widget{margin-bottom:0!important;}.chyn-pro-widget:last-child{display:none;}
.chyn-news-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.chyn-news-article,.chyn-news-side{position:static;width:100%;}.chyn-news-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.2rem;margin-top:.3rem;}.chyn-news-rec{margin-top:0!important;}
.chyn-contact-form,.chyn-contact-info,.chyn-service-copy,.chyn-service-media{width:100%;}.chyn-contact-info,.chyn-service-media{margin-top:.4rem;}
.chyn-download-list{grid-template-columns:1fr;}.chyn-case-grid{gap:.28rem;}.chyn-case-title{width:7rem;}.chyn-case-stat{min-width:2.5rem;}
}
@media all and (max-width:767px){
.chyn-sec-desc{width:100%;margin-top:.2rem;}.chyn-ban{height:3.9rem;}.chyn-ban-copy h1{font-size:.36rem;}.chyn-ban-desc{font-size:var(--f16);}
.chyn-pro-side{display:block;}.chyn-pro-widget{margin-bottom:.2rem!important;}.chyn-pro-grid,.chyn-news-grid,.chyn-video-grid,.chyn-case-grid,.chyn-service-grid,.chyn-search-grid{grid-template-columns:1fr;}
.chyn-search-toolbar{display:block;}.chyn-search-form{width:100%;margin-top:.25rem;}.chyn-search-heading h2{font-size:.3rem;}
.chyn-pro-block{padding:.22rem!important;}.chyn-pro-gallery,.chyn-pro-summary{width:100%;}.chyn-pro-summary{margin-top:.3rem;}.chyn-pro-tabs{gap:.22rem;}.chyn-pro-form input{width:100%;}
.chyn-news-side{display:block;}.chyn-news-rec{margin-top:.2rem!important;}.chyn-news-head,.chyn-article{padding:.24rem 0!important;}.chyn-news-head h1{font-size:.3rem;}.chyn-news-turn>div{width:100%;}.chyn-news-turn>div:last-child{text-align:left;}
.chyn-contact-form label{width:100%;}.chyn-contact-info{padding:.25rem;}.chyn-contact-info li>i{width:.54rem;height:.54rem;flex-basis:.54rem;}
.chyn-download-item{align-items:flex-start;flex-direction:column;gap:.22rem;padding:.22rem!important;}.chyn-download-btn{width:100%;justify-content:center;}.chyn-faq-head{padding:.2rem;}.chyn-faq-body{padding:0 .2rem .2rem;}
.chyn-case-type{left:.18rem;top:.18rem;}.chyn-case-bottom{left:.2rem;right:.2rem;bottom:.18rem;}.chyn-case-bottom h2{font-size:.22rem;}.chyn-case-head{display:block;}.chyn-case-title{width:100%;}.chyn-case-title h1{font-size:.36rem;}.chyn-case-stat{margin-top:.3rem;padding:.24rem 0 0;border-left:0;border-top:.01rem solid #d9dde2;}.chyn-case-cta{height:5.5rem;}.chyn-case-cta h2{font-size:.4rem;}
}
@media all and (max-width:480px){
.chyn-ban{height:3.5rem;}.chyn-ban-crumb{font-size:var(--f14);}.chyn-ban-copy{width:calc(100% - .3rem);}.chyn-news-card h2{height:auto;}.chyn-case-meta{display:block;}.chyn-case-meta span{display:block;margin-top:.1rem;}.chyn-case-bottom h2{max-width:calc(100% - .62rem);}.chyn-video-play{width:.62rem;height:.62rem;}
}
/* Customer service page - Seraphim reference structure */
.chyn-service-ban{position:relative;height:6rem;overflow:hidden;background:#222;}
.chyn-service-ban-img,.chyn-service-ban-mask{position:absolute;inset:0;}
.chyn-service-ban-img img{width:100%;height:100%;object-fit:cover;}
.chyn-service-ban-mask{background:rgba(0,0,0,.34);}
.chyn-service-ban-crumb{position:absolute;left:50%;top:.32rem;z-index:2;transform:translateX(-50%);font-size:var(--f16);color:#fff;}
.chyn-service-ban-crumb a{color:#fff;}
.chyn-service-ban-copy{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-35%);}
.chyn-service-nav{position:relative;z-index:4;width:16rem;max-width:calc(100% - .4rem);margin:-.38rem auto 0;border-radius:.18rem;background:#fff;box-shadow:0 .08rem .28rem rgba(0,0,0,.12);}
.chyn-service-nav .w16{height:.76rem;gap:.55rem;}
.chyn-service-nav a{position:relative;display:flex;height:100%;align-items:center;text-transform:uppercase;color:#666;}
.chyn-service-nav a:after{position:absolute;content:'';left:0;bottom:0;width:0;height:.03rem;background:var(--theme-color);transition:.3s ease;}
.chyn-service-nav a.active,.chyn-service-nav a:hover{color:var(--theme-color);}
.chyn-service-nav a.active:after,.chyn-service-nav a:hover:after{width:100%;}
.chyn-service-about .chyn-service-media{border-radius:.12rem;}
.chyn-service-lines{display:flex;flex-direction:column;align-items:flex-start;gap:.16rem;}
.chyn-service-lines a{display:flex;align-items:center;gap:.12rem;}
.chyn-service-lines i{display:flex;width:.4rem;height:.4rem;align-items:center;justify-content:center;border-radius:50%;background:var(--theme-color);color:#fff;}
.chyn-service-lines a:hover{color:var(--theme-color);}
.chyn-service-advantages{background:#f5f6f8;}
.chyn-service-adv-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.18rem;}
.chyn-service-adv-grid article{padding:.42rem .28rem;border-radius:.1rem;background:#fff;text-align:center;box-shadow:0 .05rem .16rem rgba(0,0,0,.03);}
.chyn-service-adv-grid article>i{color:var(--theme-color);font-size:var(--f36);}
.chyn-service-adv-grid article>span{display:block;width:.26rem;height:.03rem;margin:.22rem auto;background:var(--theme-color);}
.chyn-service-adv-grid h3{margin-bottom:.18rem;}
.chyn-service-contact-copy{width:38%;}.chyn-service-form{width:54%;}
.chyn-service-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.24rem .3rem;}
.chyn-service-form label span{display:block;margin-bottom:.09rem;color:#666;}
.chyn-service-form input,.chyn-service-form select,.chyn-service-form textarea{width:100%;padding:.12rem 0;border:0;border-bottom:.01rem solid #cfd3d8;background:transparent;line-height:1.5;}
.chyn-service-form input:focus,.chyn-service-form select:focus,.chyn-service-form textarea:focus{border-color:var(--theme-color);outline:0;}
.chyn-service-form-wide{grid-column:1/-1;}
.chyn-service-consent{display:flex;align-items:flex-start;gap:.1rem;margin-top:.22rem;color:#666;line-height:1.5;}
.chyn-service-consent input{width:.18rem;height:.18rem;flex:0 0 .18rem;margin-top:.02rem;accent-color:var(--theme-color);}
.chyn-service-resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.24rem;}
.chyn-service-resource{position:relative;height:3.6rem;overflow:hidden;border-radius:.12rem;}
.chyn-service-resource-img,.chyn-service-resource-mask{position:absolute;inset:0;}
.chyn-service-resource-img img{width:100%;height:100%;object-fit:cover;transition:.6s ease;}
.chyn-service-resource-mask{background:linear-gradient(90deg,rgba(5,12,22,.78),rgba(5,12,22,.12));}
.chyn-service-resource-copy{position:absolute;left:.34rem;right:.34rem;bottom:.3rem;z-index:2;}
.chyn-service-resource-copy h2,.chyn-service-resource-copy div{max-width:82%;}
.chyn-service-resource-copy i{position:absolute;right:0;bottom:.08rem;color:#fff;font-size:var(--f30);}
.chyn-service-resource:hover img{transform:scale(1.05);}
.chyn-service-resource:hover .chyn-service-resource-copy i{transform:translateX(.08rem);}
@media all and (max-width:1000px){
.chyn-service-ban{height:5rem;}.chyn-service-adv-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.chyn-service-contact-copy,.chyn-service-form{width:100%;}.chyn-service-form{margin-top:.4rem;}
}
@media all and (max-width:767px){
.chyn-service-ban{height:4rem;}.chyn-service-ban-copy h1{font-size:.38rem;}.chyn-service-ban-crumb{top:.22rem;}.chyn-service-nav{max-width:calc(100% - .3rem);overflow-x:auto;}.chyn-service-nav .w16{width:max-content;min-width:100%;height:.66rem;gap:.32rem;}.chyn-service-adv-grid,.chyn-service-resource-grid{grid-template-columns:1fr;}.chyn-service-form-grid{grid-template-columns:1fr;}.chyn-service-form-wide{grid-column:auto;}.chyn-service-resource{height:3rem;}
}
/* Huanghua Group About page */
.chyn-about-page{overflow-x:clip;background:#fff;color:#161a20;}
.chyn-about-page h1,.chyn-about-page h2,.chyn-about-page h3{text-wrap:balance;}
.chyn-about-page section[id]{scroll-margin-top:1.9rem;}
.chyn-about-page a,.chyn-about-page button{transition:color .3s ease,background-color .3s ease,transform .3s ease,box-shadow .3s ease;}
.chyn-about-page a:focus-visible,.chyn-about-page button:focus-visible{outline:.03rem solid #fff;outline-offset:.04rem;box-shadow:0 0 0 .06rem var(--theme-color);}
.chyn-about-banner{height:7.1rem;}
.chyn-about-banner .chyn-about-banner-image img{object-position:center 58%;}
.chyn-about-banner-mask{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,25,47,.92) 0%,rgba(4,25,47,.75) 34%,rgba(4,25,47,.18) 72%,rgba(4,25,47,.08) 100%);}
.chyn-about-banner-copy{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-45%);}
.chyn-about-banner-title{width:8rem;max-width:65%;letter-spacing:-.025em;}
.chyn-about-banner-desc{width:7.7rem;max-width:62%;}
.chyn-about-banner-note{font-weight:600;opacity:.88;}
.chyn-about-banner-actions{gap:.15rem;}
.chyn-about-btn{display:inline-flex;min-height:.54rem;align-items:center;justify-content:center;gap:.12rem;padding:.15rem .28rem;border-radius:.05rem;line-height:1.35;}
.chyn-about-btn-primary{background:var(--theme-color);color:#fff;}
.chyn-about-btn-primary:hover{background:#007b65;color:#fff;transform:translateY(-.03rem);}
.chyn-about-btn-ghost{border:.01rem solid rgba(255,255,255,.7);color:#fff;}
.chyn-about-btn-ghost:hover{background:#fff;color:#10253a;}
.chyn-about-btn-dark{background:#10253a;color:#fff;}
.chyn-about-btn-dark:hover{background:#051422;color:#fff;transform:translateY(-.03rem);}
.chyn-about-nav{position:sticky;top:1rem;z-index:12;background:#fff;box-shadow:0 .04rem .12rem rgba(7,25,43,.08);}
.chyn-about-nav-inner{height:.72rem;gap:.52rem;overflow-x:auto;}
.chyn-about-nav-link{position:relative;display:flex;height:100%;align-items:center;white-space:nowrap;color:#4e5863;text-transform:uppercase;}
.chyn-about-nav-link:after{position:absolute;content:"";left:0;bottom:0;width:0;height:.03rem;background:var(--theme-color);transition:width .3s ease;}
.chyn-about-nav-link:hover,.chyn-about-nav-link.active{color:var(--theme-color);}
.chyn-about-nav-link:hover:after,.chyn-about-nav-link.active:after{width:100%;}
.chyn-about-section-kicker{color:var(--theme-color);letter-spacing:.08em;text-transform:uppercase;}
.chyn-about-title{position:relative;padding-left:0;}
.chyn-about-title-text{letter-spacing:-.025em;}
.chyn-about-section-head{display:block;}
.chyn-about-section-head .chyn-about-title{max-width:10.6rem;}
.chyn-about-section-desc{width:8.6rem;max-width:100%;text-wrap:pretty;}
.chyn-about-overview-media{position:relative;width:47%;padding-bottom:0;overflow:visible;}
.chyn-about-overview-picture{border-radius:.14rem;box-shadow:0 .08rem .2rem rgba(8,28,47,.08);}
.chyn-about-overview-picture img{transition:transform .7s ease;}
.chyn-about-overview-media:hover .chyn-about-overview-picture img{transform:scale(1.035);}
.chyn-about-overview-play{position:absolute;left:50%;top:50%;z-index:3;display:flex;width:.82rem;height:.82rem;align-items:center;justify-content:center;border-radius:50%;background:rgba(0,161,128,.94);box-shadow:0 .08rem .18rem rgba(0,0,0,.22);color:#fff;transform:translate(-50%,-50%);}
.chyn-about-overview-play:before{position:absolute;content:"";inset:-.12rem;border:.01rem solid rgba(255,255,255,.62);border-radius:50%;}
.chyn-about-overview-play i{margin-left:.04rem;font-size:var(--f22);}
.chyn-about-overview-play:hover{background:#fff;color:var(--theme-color);transform:translate(-50%,-50%) scale(1.06);}
.chyn-about-overview-play:focus-visible{outline:.03rem solid #fff;outline-offset:.08rem;background:#fff;color:var(--theme-color);}
.chyn-about-overview-year{display:none;}
.chyn-about-overview-year span{margin-top:.08rem;}
.chyn-about-overview-copy{width:47%;padding-top:.05rem;}
.chyn-about-overview-paragraph{text-wrap:pretty;}
.chyn-about-text-link{display:inline-flex;align-items:center;gap:.11rem;color:var(--theme-color);}
.chyn-about-text-link:hover{color:#111;transform:translateX(.05rem);}
.chyn-about-facts{position:relative;overflow:hidden;background:#0b2028;}
.chyn-about-facts:before{position:absolute;content:"";inset:0;background:url('../images/generated/company-capability-background.webp') center 54%/cover no-repeat;}
.chyn-about-facts:after{position:absolute;content:"";inset:0;background:linear-gradient(90deg,rgba(4,18,27,.91),rgba(8,30,38,.82) 48%,rgba(3,39,37,.9));}
.chyn-about-facts-bg,.chyn-about-facts-mask{display:none;}
.chyn-about-facts-inner{position:relative;z-index:2;}
.chyn-about-facts-head{text-align:center;}
.chyn-about-facts-desc{width:8rem;max-width:100%;margin-right:auto;margin-left:auto;opacity:.78;}
.chyn-about-facts-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;}
.chyn-about-fact-item{position:relative;display:grid;grid-template-columns:.78rem minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:.2rem;color:#fff;text-align:left;}
.chyn-about-fact-item:not(:last-child):after{position:absolute;content:"";right:-.28rem;top:.08rem;width:.01rem;height:1.18rem;background:rgba(255,255,255,.16);}
.chyn-about-fact-icon{width:.76rem;height:.76rem;display:flex;align-items:center;justify-content:center;grid-row:1 / span 2;}
.chyn-about-fact-icon img{width:.68rem;height:.68rem;object-fit:contain;filter:brightness(0) invert(1);}
.chyn-about-fact-value{display:flex;align-items:flex-end;justify-content:flex-start;gap:.04rem;color:#fff;}
.chyn-about-fact-value strong{letter-spacing:-.035em;}
.chyn-about-fact-label{max-width:none;margin:0;line-height:1.45;color:rgba(255,255,255,.75);}
.chyn-about-history{position:relative;overflow:hidden;background:#f3f5f7;}
.chyn-about-history-background,.chyn-about-history-mask{position:absolute;inset:0;}
.chyn-about-history-background img{width:100%;height:100%;object-fit:cover;object-position:center 54%;filter:saturate(.72);}
.chyn-about-history-mask{background:linear-gradient(90deg,rgba(247,249,250,.98) 0%,rgba(247,249,250,.92) 48%,rgba(247,249,250,.72) 100%);}
.chyn-about-history-inner{position:relative;z-index:2;}
.chyn-about-history-head{gap:.45rem;}
.chyn-about-history-intro{width:7.2rem;max-width:48%;text-wrap:pretty;}
.chyn-about-history-carousel{margin-right:-.35rem;margin-left:-.35rem;}
.chyn-about-history-slider{overflow:hidden;padding:.22rem .35rem .34rem;}
.chyn-about-history-slider .swiper-slide{height:auto;opacity:.62;transform:scale(.92);transition:opacity .45s ease,transform .45s cubic-bezier(.22,1,.36,1);}
.chyn-about-history-slider .swiper-slide-active{z-index:2;opacity:1;transform:scale(1);}
.chyn-about-history-card{display:flex;min-height:3.25rem;height:100%;align-items:center;justify-content:center;flex-direction:column;padding:.42rem .4rem;border-radius:.12rem;background:rgba(255,255,255,.96);box-shadow:0 .14rem .34rem rgba(12,31,49,.1);text-align:center;transition:background-color .45s ease,color .45s ease,box-shadow .45s ease;}
.chyn-about-history-slider .swiper-slide-active .chyn-about-history-card{background:var(--theme-color);box-shadow:0 .18rem .42rem rgba(0,125,101,.24);color:#fff;}
.chyn-about-history-year{line-height:1.1;letter-spacing:-.035em;}
.chyn-about-history-year-present{font-size:var(--f36);}
.chyn-about-history-rule{display:block;width:.8rem;height:.03rem;margin:.22rem 0;background:var(--theme-color);transition:background-color .45s ease,width .45s ease;}
.chyn-about-history-slider .swiper-slide-active .chyn-about-history-rule{width:1.05rem;background:#fff;}
.chyn-about-history-copy{max-width:4.3rem;color:#4f5963;text-wrap:pretty;transition:color .45s ease;}
.chyn-about-history-slider .swiper-slide-active .chyn-about-history-copy{color:rgba(255,255,255,.94);}
.chyn-about-history-timeline{display:flex;align-items:flex-start;gap:.24rem;}
.chyn-about-history-prev,.chyn-about-history-next{display:flex;width:.58rem;height:.58rem;flex:0 0 .58rem;align-items:center;justify-content:center;margin-top:-.17rem;border:.01rem solid #bec6cd;border-radius:50%;background:#fff;color:#4f5963;cursor:pointer;box-shadow:0 .06rem .16rem rgba(12,31,49,.06);}
.chyn-about-history-prev:hover,.chyn-about-history-next:hover{border-color:var(--theme-color);background:var(--theme-color);color:#fff;transform:translateY(-.02rem);}
.chyn-about-history-prev svg,.chyn-about-history-next svg{width:.24rem;height:.24rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.chyn-about-history-years{position:relative;display:grid;min-width:0;flex:1;grid-template-columns:repeat(7,minmax(0,1fr));}
.chyn-about-history-line{position:absolute;left:7.15%;right:7.15%;top:.11rem;height:.01rem;background:#aeb6bd;}
.chyn-about-history-year-button{position:relative;z-index:1;display:flex;min-width:0;align-items:center;flex-direction:column;gap:.16rem;padding:0 .05rem;border:0;background:transparent;color:#4f5963;cursor:pointer;}
.chyn-about-history-year-button span{display:block;width:.22rem;height:.22rem;border:.03rem solid #fff;border-radius:50%;background:#aeb6bd;box-shadow:0 0 0 .01rem #aeb6bd;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease;}
.chyn-about-history-year-button strong{line-height:1.25;white-space:nowrap;transition:color .3s ease,transform .3s ease;}
.chyn-about-history-year-button:hover,.chyn-about-history-year-button.active{color:var(--theme-color);}
.chyn-about-history-year-button:hover span,.chyn-about-history-year-button.active span{background:var(--theme-color);box-shadow:0 0 0 .02rem rgba(0,161,128,.34);transform:scale(1.08);}
.chyn-about-history-year-button.active strong{transform:translateY(.02rem);}
.chyn-about-capability-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.24rem;}
.chyn-about-capability-card,.chyn-about-capability-card-wide{position:relative;grid-column:auto;overflow:hidden;border-radius:.14rem;background:#10263b;transition:transform .4s ease,box-shadow .4s ease;}
.chyn-about-capability-card:after{position:absolute;content:"";inset:0;background:linear-gradient(180deg,rgba(4,17,29,.02) 18%,rgba(4,17,29,.9) 100%);transition:background .4s ease;}
.chyn-about-capability-card:hover{transform:translateY(-.05rem);box-shadow:0 .14rem .24rem rgba(9,27,45,.16);}
.chyn-about-capability-card:hover:after{background:linear-gradient(180deg,rgba(4,17,29,.02) 8%,rgba(4,17,29,.96) 100%);}
.chyn-about-capability-image{overflow:hidden;}
.chyn-about-capability-image img{filter:saturate(.82) contrast(1.04);transition:transform .7s ease;}
.chyn-about-capability-card:hover .chyn-about-capability-image img{transform:scale(1.045);}
.chyn-about-capability-copy{position:absolute;left:0;right:0;bottom:0;z-index:2;min-height:2.05rem;padding:.42rem .36rem .3rem;color:#fff;}
.chyn-about-capability-icon{position:absolute;right:.32rem;top:.25rem;width:.52rem;height:.52rem;color:#fff;opacity:.92;}
.chyn-about-capability-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.chyn-about-capability-name{max-width:calc(100% - .7rem);}
.chyn-about-capability-desc{max-width:6.6rem;color:rgba(255,255,255,.78)!important;text-wrap:pretty;}
.chyn-about-environment{background:#f5f7f9;}
.chyn-about-environment-intro{width:8rem;max-width:100%;}
.chyn-about-environment-layout{gap:.55rem;}
.chyn-about-environment-copy{display:flex;width:4.1rem;height:5.6rem;flex:0 0 4.1rem;align-items:flex-start;flex-direction:column;}
.chyn-about-environment-step{font-weight:600;}
.chyn-about-environment-title{max-width:3.8rem;}
.chyn-about-environment-desc{text-wrap:pretty;}
.chyn-about-environment-bottom{width:100%;margin-top:auto;}
.chyn-about-environment-index strong{color:var(--theme-color);}
.chyn-about-environment-index span{margin-left:.08rem;}
.chyn-about-environment-controls{gap:.1rem;}
.chyn-about-environment-controls button,.chyn-about-certifications-controls button,.chyn-about-exhibition-controls button{display:flex;width:.56rem;height:.56rem;align-items:center;justify-content:center;border:0;border-radius:50%;background:#e3e7eb;color:#4e5863;cursor:pointer;font-size:var(--f22);}
.chyn-about-environment-controls button:hover,.chyn-about-certifications-controls button:hover,.chyn-about-exhibition-controls button:hover{background:var(--theme-color);color:#fff;transform:translateY(-.02rem);}
.chyn-about-environment-slider-wrap{width:calc(100vw - ((100vw - min(16rem,92vw))/2 + 4.65rem));max-width:none;margin-right:calc((min(16rem,92vw) - 100vw)/2);overflow:visible;}
.chyn-about-environment-slider{overflow:visible;}
.chyn-about-environment-slider .swiper-slide{width:8.7rem;opacity:.46;transition:opacity .45s ease,transform .45s ease;}
.chyn-about-environment-slider .swiper-slide-active{opacity:1;}
.chyn-about-environment-image{border-radius:.14rem;box-shadow:0 .12rem .26rem rgba(9,27,45,.1);}
.chyn-about-environment-image img{filter:saturate(.85) contrast(1.03);transition:transform .7s ease;}
.chyn-about-environment-slider .swiper-slide:hover img{transform:scale(1.035);}
.chyn-about-oem{position:relative;/* min-height:8rem */;overflow:hidden;background:#071827;}
.chyn-about-oem-image,.chyn-about-oem-mask{position:absolute;inset:0;}
.chyn-about-oem-image img{width:100%;height:100%;object-fit:cover;object-position:center;}
.chyn-about-oem-mask{background:linear-gradient(90deg,rgba(3,17,31,.96) 0%,rgba(4,25,45,.8) 48%,rgba(4,25,45,.3) 100%);}
.chyn-about-oem-inner{position:relative;z-index:2;}
.chyn-about-oem-copy{width:8.5rem;max-width:60%;}
.chyn-about-oem-desc{opacity:.85;}
.chyn-about-oem-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.18rem;}
.chyn-about-oem-item{min-height:2.45rem;padding:.28rem;border-radius:.1rem;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 .01rem rgba(255,255,255,.16);transition:background-color .35s ease,transform .35s ease;}
.chyn-about-oem-item:hover{background:rgba(255,255,255,.16);transform:translateY(-.04rem);}
.chyn-about-oem-icon{display:flex;width:.52rem;height:.52rem;margin-bottom:.32rem;align-items:center;justify-content:center;border-radius:.1rem;background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 .01rem rgba(255,255,255,.18);color:#fff;transition:background-color .35s ease,transform .35s ease;}
.chyn-about-oem-icon-svg{width:.32rem;height:.32rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.chyn-about-oem-item:hover .chyn-about-oem-icon{background:var(--theme-color);transform:translateY(-.02rem);}
.chyn-about-oem-item>div{opacity:.78;}
.chyn-about-certifications{position:relative;overflow:hidden;background-color:#0b1820;background-image:linear-gradient(90deg,rgba(5,15,22,.94) 0%,rgba(7,20,28,.84) 46%,rgba(7,18,24,.7) 100%),url('../images/generated/quality-certification-documents.webp');background-position:center;background-size:cover;background-repeat:no-repeat;}
.chyn-about-certifications:after{display:none;}
.chyn-about-certifications>.w16{position:relative;z-index:2;}
.chyn-about-certifications .chyn-about-title-text,.chyn-about-certifications .chyn-about-section-desc{color:#fff;}
.chyn-about-certifications-intro{width:8.4rem;max-width:100%;}
.chyn-about-certifications-heading{min-width:0;}
.chyn-about-certifications-controls{gap:.1rem;}
.chyn-about-certifications-controls .swiper-button-lock{display:none;}
.chyn-about-certifications-slider{overflow:hidden;padding:.08rem .04rem .22rem;}
.chyn-about-certifications-slider .swiper-slide{height:auto;}
.chyn-about-certificate{display:block;height:100%;padding:.24rem .24rem .28rem;border-radius:.12rem;background:#fff;text-align:center;transition:transform .35s ease,box-shadow .35s ease;}
.chyn-about-certificate:hover{box-shadow:0 .1rem .2rem rgba(9,27,45,.09);}
.chyn-about-certificate-image{display:flex;height:3.75rem;align-items:center;justify-content:center;overflow:hidden;border-radius:.06rem;/* background:#eef1f2; */}
.chyn-about-certificate-image img{width:auto;max-width:100%;height:100%;object-fit:contain;transition:transform .45s ease;}
.chyn-about-certificate:hover .chyn-about-certificate-image img{transform:scale(1.025);}
.chyn-about-certificate-meta{line-height:1.5;}
.chyn-about-exhibition{background:#fff;}
/* .chyn-about-exhibition-feature{gap:.75rem;} */
.chyn-about-exhibition-media{width:50%;overflow:hidden;border-radius:.14rem;box-shadow:0 .12rem .3rem rgba(9,27,45,.12);}
.chyn-about-exhibition-image{overflow:hidden;}
.chyn-about-exhibition-image.rect-75{padding-bottom:56.25%;}
.chyn-about-exhibition-image img{filter:saturate(.9);transition:transform .7s ease;}
.chyn-about-exhibition-feature:hover .chyn-about-exhibition-image img{transform:scale(1.035);}
.chyn-about-exhibition-content{width:46%;}
.chyn-about-exhibition-tag{color:var(--theme-color);letter-spacing:.06em;}
.chyn-about-exhibition-points{display:grid;gap:.13rem;}
.chyn-about-exhibition-point{display:flex;align-items:center;gap:.12rem;color:#35434b;line-height:1.45;}
.chyn-about-exhibition-point i{color:var(--theme-color);font-size:var(--f18);}
.chyn-about-culture{background:#f5f7f9;}
.chyn-about-culture-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.24rem;}
.chyn-about-culture-card-wide{grid-column:auto;}
.chyn-about-culture-card{position:relative;overflow:hidden;border-radius:.14rem;background:#0b1d30;}
.chyn-about-culture-card .chyn-about-culture-media{background-position:center;background-size:cover;}
.chyn-about-culture-card:nth-child(1) .chyn-about-culture-media{background-image:url('../images/generated/about-culture-chyn-culture-mission.webp');background-position:center;}
.chyn-about-culture-card:nth-child(2) .chyn-about-culture-media{background-image:url('../images/generated/about-culture-chyn-culture-vision.webp');background-position:center 54%;}
.chyn-about-culture-card:nth-child(3) .chyn-about-culture-media{background-image:url('../images/generated/about-culture-chyn-culture-values.webp');background-position:center;}
.chyn-about-culture-card .chyn-about-culture-media img{opacity:0;}
.chyn-about-culture-media img{filter:saturate(.88) contrast(1.02);transition:transform .75s cubic-bezier(.22,1,.36,1),filter .75s ease;}
.chyn-about-culture-mask{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,14,26,.12) 0%,rgba(3,14,26,.08) 28%,rgba(3,14,26,.9) 100%);transition:background .45s ease;}
.chyn-about-culture-number{position:absolute;left:.26rem;top:.25rem;z-index:2;color:#fff;text-shadow:0 .03rem .1rem rgba(3,14,26,.38);}
.chyn-about-culture-copy{position:absolute;z-index:2;}
.chyn-about-culture-copy svg{width:.44rem;height:.44rem;margin-bottom:.2rem;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.chyn-about-culture-desc{color:rgba(255,255,255,.9)!important;text-wrap:pretty;}
.chyn-about-culture-card:hover .chyn-about-culture-media img{transform:scale(1.035);filter:saturate(.95) contrast(1.04);}
.chyn-about-culture-card:hover .chyn-about-culture-mask{background:linear-gradient(180deg,rgba(3,14,26,0) 20%,rgba(3,14,26,.94) 100%);}
.chyn-about-responsibility{position:relative;height:6.4rem;overflow:hidden;background:#0a1723;}
.chyn-about-responsibility-image,.chyn-about-responsibility-mask{position:absolute;inset:0;}
.chyn-about-responsibility-image img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .85s cubic-bezier(.22,1,.36,1);}
.chyn-about-responsibility-mask{background:linear-gradient(90deg,rgba(3,14,25,.96) 0%,rgba(3,14,25,.78) 38%,rgba(3,14,25,.18) 68%,rgba(3,14,25,.04) 100%);}
.chyn-about-responsibility-inner{position:relative;height:100%;z-index:2;}
.chyn-about-responsibility-copy{position:absolute;left:0;top:50%;width:6.5rem;max-width:46%;transform:translateY(-50%);}
.chyn-about-responsibility-text{color:rgba(255,255,255,.9)!important;text-wrap:pretty;}
.chyn-about-responsibility:hover .chyn-about-responsibility-image img{transform:scale(1.025);}
.chyn-about-cta{background:#fff;}
.chyn-about-cta-panel{position:relative;min-height:3.75rem;gap:.5rem;overflow:hidden;padding:.58rem .64rem;border-radius:.14rem;background:#07192c;}
.chyn-about-cta-image,.chyn-about-cta-mask{position:absolute;inset:0;}
.chyn-about-cta-image img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .8s cubic-bezier(.22,1,.36,1);}
.chyn-about-cta-mask{background:linear-gradient(90deg,rgba(4,22,40,.92) 0%,rgba(4,22,40,.76) 56%,rgba(4,22,40,.52) 100%);}
.chyn-about-cta-copy{width:8.8rem;max-width:60%;}
.chyn-about-cta-kicker{letter-spacing:.08em;opacity:.8;}
.chyn-about-cta-desc{max-width:7.8rem;color:rgba(255,255,255,.88)!important;text-wrap:pretty;}
.chyn-about-cta-copy,.chyn-about-cta-actions{position:relative;z-index:2;}
.chyn-about-cta-actions{align-self:center;gap:.14rem;}
.chyn-about-cta-action{display:flex;min-width:2.05rem;min-height:.62rem;align-items:center;justify-content:center;gap:.14rem;padding:.16rem .22rem;border-radius:.08rem;transition:transform .3s cubic-bezier(.22,1,.36,1),background-color .3s ease,color .3s ease;}
.chyn-about-cta-action-primary{background:#fff;color:var(--theme-color);}
.chyn-about-cta-action-primary:hover{background:#07192c;color:#fff;transform:translateY(-.03rem);}
.chyn-about-cta-action-secondary{border:.01rem solid rgba(255,255,255,.65);color:#fff;}
.chyn-about-cta-action-secondary:hover{background:#fff;color:var(--theme-color);transform:translateY(-.03rem);}
.chyn-about-cta-action:focus-visible{outline:.03rem solid #fff;outline-offset:.04rem;}
.chyn-about-cta-panel:hover .chyn-about-cta-image img{transform:scale(1.025);}
@media all and (max-width:1400px){
.chyn-about-banner{height:6.4rem;}
.chyn-about-facts-grid{grid-template-columns:repeat(5,minmax(0,1fr));}
.chyn-about-environment-copy{width:3.8rem;flex-basis:3.8rem;}
.chyn-about-environment-slider-wrap{width:calc(100vw - ((100vw - min(16rem,92vw))/2 + 4.35rem));max-width:none;}
.chyn-about-oem-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.chyn-about-oem-item{min-height:2.1rem;}
}
@media all and (max-width:1200px){
.chyn-about-page section[id]{scroll-margin-top:2.35rem;}
.chyn-about-banner-title{max-width:74%;}
.chyn-about-banner-desc{max-width:70%;}
.chyn-about-environment-controls button,.chyn-about-certifications-controls button,.chyn-about-exhibition-controls button,.chyn-about-history-prev,.chyn-about-history-next{width:.64rem;height:.64rem;flex-basis:.64rem;}
.chyn-about-history-card{min-height:3.55rem;padding:.38rem .32rem;}
.chyn-about-culture-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.24rem;}
.chyn-about-culture-card-wide{grid-column:span 2;}
.chyn-about-culture-card .chyn-about-culture-media{padding-bottom:82%;}
.chyn-about-cta-panel{padding:.5rem .46rem;}
}
@media all and (max-width:1100px){
.chyn-about-overview-inner{display:block;}
.chyn-about-overview-media,.chyn-about-overview-copy{width:100%;}
.chyn-about-overview-picture{padding-bottom:55%;}
.chyn-about-overview-copy{margin-top:.5rem;}
.chyn-about-overview-year{right:.18rem;}
}
@media all and (max-width:1000px){
.chyn-about-page section[id]{scroll-margin-top:1.68rem;}
.chyn-about-nav{top:var(--nav_height);}
.chyn-about-banner{height:5.6rem;}
.chyn-about-banner-title,.chyn-about-banner-desc{max-width:78%;}
.chyn-about-overview-media,.chyn-about-overview-copy{width:100%;}
.chyn-about-overview-copy{margin-top:.5rem;}
.chyn-about-overview-year{right:.18rem;}
.chyn-about-section-desc{width:100%;max-width:100%;margin-top:.2rem;}
.chyn-about-history-head{display:block;}.chyn-about-history-intro{width:100%;max-width:100%;margin-top:.2rem;}
.chyn-about-capability-card,.chyn-about-capability-card-wide{grid-column:auto;}
.chyn-about-environment-layout{display:block;}
.chyn-about-environment-copy{width:100%;height:auto;min-height:3.4rem;}
.chyn-about-environment-desc{width:7rem;max-width:100%;}
.chyn-about-environment-bottom{margin-top:.35rem;}
.chyn-about-environment-slider-wrap{width:100%;max-width:100%;margin-top:.35rem;margin-right:0;}
.chyn-about-oem-copy{max-width:78%;}
.chyn-about-culture-card .chyn-about-culture-media{padding-bottom:72%;}
.chyn-about-responsibility-copy{max-width:65%;}
.chyn-about-cta-copy{width:100%;max-width:100%;}
.chyn-about-cta-actions{margin-top:.1rem;}
}
@media all and (max-width:900px){
.chyn-about-facts-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem .35rem;}
.chyn-about-fact-item{grid-column:auto;}
.chyn-about-fact-item:nth-last-child(-n+2){grid-column:auto;}
.chyn-about-fact-item:after{display:none;}
.chyn-about-certification-grid{grid-template-columns:1fr 1fr;}
.chyn-about-capability-image .rect-55{padding-bottom:70%;}
}
@media all and (max-width:767px){
/* .chyn-about-page{--f16:.32rem;--f18:.32rem;} */
.chyn-about-page section[id]{scroll-margin-top:2.1rem;}
.chyn-about-banner{height:8rem;}
.chyn-about-banner .chyn-about-banner-image img{object-position:68% center;}
.chyn-about-banner-mask{background:linear-gradient(90deg,rgba(4,25,47,.94),rgba(4,25,47,.66));}
.chyn-about-banner-crumb{display:none;}
.chyn-about-banner-title,.chyn-about-banner-desc{width:100%;max-width:100%;}
.chyn-about-banner-title{font-size:.56rem;line-height:1.15;}
.chyn-about-banner-desc{font-size:var(--f16);line-height:1.55;}
.chyn-about-banner-note{line-height:1.45;}
.chyn-about-banner-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:.14rem;}
.chyn-about-btn{width:100%;min-height:.86rem;padding:.12rem .16rem;text-align:center;}
.chyn-about-nav-inner{width:100%;height:.9rem;max-width:100%;gap:.38rem;padding:0 .3rem;box-sizing:border-box;scrollbar-width:none;}
.chyn-about-nav-inner::-webkit-scrollbar{display:none;}
.chyn-about-title-text{font-size:.5rem;line-height:1.2;}
.chyn-about-title{padding-left:0;}
.chyn-about-section-head{display:block;}
.chyn-about-overview-picture{border-radius:.1rem;}
.chyn-about-overview-picture{padding-bottom:65%;}
.chyn-about-overview-year{width:1.9rem;height:1.24rem;padding:.18rem .22rem;}
.chyn-about-overview-year strong{font-size:.38rem;}
.chyn-about-overview-play{width:.68rem;height:.68rem;}
.chyn-about-overview-text{line-height:1.7;}
.chyn-about-facts-head{display:block;}
.chyn-about-facts-head .chyn-about-title{display:inline-block;}
.chyn-about-facts-desc{width:100%;max-width:100%;margin-top:.2rem;}
.chyn-about-facts-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.38rem .25rem;}
.chyn-about-fact-item{grid-column:auto;}
.chyn-about-fact-item:nth-last-child(-n+2){grid-column:auto;}
.chyn-about-fact-item:last-child{grid-column:1/-1;width:100%;justify-self:stretch;}
.chyn-about-fact-item:after{display:none;}
.chyn-about-fact-value strong{font-size:.46rem;}
.chyn-about-history-carousel{margin-right:-.12rem;margin-left:-.12rem;}.chyn-about-history-slider{padding:.18rem .12rem .3rem;}.chyn-about-history-card{min-height:4.1rem;padding:.38rem .28rem;}.chyn-about-history-year{font-size:.48rem;}.chyn-about-history-year-present{font-size:.4rem;}.chyn-about-history-copy{font-size:var(--f16);line-height:1.65;}.chyn-about-history-timeline{gap:.14rem;overflow:hidden;}.chyn-about-history-prev,.chyn-about-history-next{width:.72rem;height:.72rem;flex-basis:.72rem;margin-top:-.24rem;}.chyn-about-history-years{min-width:10.5rem;overflow:visible;}.chyn-about-history-year-button strong{font-size:var(--f16);}.chyn-about-history-timeline{overflow-x:auto;scrollbar-width:none;}.chyn-about-history-timeline::-webkit-scrollbar{display:none;}
.chyn-about-capability-grid{display:block;}
.chyn-about-capability-card{margin-bottom:.22rem;}
.chyn-about-capability-card:last-child{margin-bottom:0;}
.chyn-about-capability-image .rect-55{padding-bottom:78%;}
.chyn-about-capability-copy{min-height:0;padding:.26rem;}
.chyn-about-capability-icon{right:.24rem;top:.22rem;width:.4rem;height:.4rem;}
.chyn-about-capability-name,.chyn-about-culture-name{font-size:.4rem;}
.chyn-about-environment-copy{min-height:4rem;}
.chyn-about-environment-title{font-size:.32rem;}
.chyn-about-environment-controls button,.chyn-about-certifications-controls button,.chyn-about-exhibition-controls button{width:.84rem;height:.84rem;}
.chyn-about-environment-slider .swiper-slide{width:85%;}
.chyn-about-environment-image{border-radius:.1rem;}
.chyn-about-oem{min-height:auto;}
.chyn-about-oem-image img{object-position:68% center;}
.chyn-about-oem-mask{background:linear-gradient(180deg,rgba(3,17,31,.93),rgba(3,17,31,.8));}
.chyn-about-oem-copy{width:100%;max-width:100%;}
.chyn-about-oem-grid{grid-template-columns:1fr;gap:.22rem;}
.chyn-about-oem-item{min-height:auto;padding:.32rem;}
.chyn-about-oem-icon{width:.78rem;height:.78rem;}
.chyn-about-oem-icon-svg{width:.46rem;height:.46rem;}
.chyn-about-oem-icon{margin-bottom:.24rem;}
.chyn-about-oem .chyn-about-btn{width:100%;}
.chyn-about-certifications-toolbar,.chyn-about-exhibition-toolbar{display:grid;grid-template-columns:1fr;align-items:end;}
.chyn-about-certifications-heading,.chyn-about-exhibition-heading{min-width:0;}
.chyn-about-certifications-controls,.chyn-about-exhibition-controls{justify-self:end;margin-top:.24rem;}
.chyn-about-certificate{padding:.22rem;}
.chyn-about-certificate-image{height:3.35rem;}
.chyn-about-culture-grid{grid-template-columns:1fr;}
.chyn-about-culture-card-wide{grid-column:auto;}
.chyn-about-exhibition-copy{padding:.25rem;}
.chyn-about-culture-card .chyn-about-culture-media{padding-bottom:82%;}
.chyn-about-culture-copy{left:.26rem;right:.26rem;bottom:.25rem;}
.chyn-about-culture-copy svg{width:.42rem;height:.42rem;margin-bottom:.16rem;}
.chyn-about-responsibility{height:8.1rem;}
.chyn-about-responsibility-image img{object-position:70% center;}
.chyn-about-responsibility-mask{background:linear-gradient(90deg,rgba(3,14,25,.97),rgba(3,14,25,.9) 58%,rgba(3,14,25,.58));}
.chyn-about-responsibility-copy{width:100%;max-width:100%;}
.chyn-about-responsibility-text{line-height:1.7;}
.chyn-about-cta-panel{min-height:0;align-items:flex-start;flex-direction:column;gap:.4rem;padding:.44rem .32rem;}
.chyn-about-cta-image img{object-position:64% center;}
.chyn-about-cta-title{font-size:.5rem;line-height:1.2;}
.chyn-about-cta-actions{display:grid;grid-template-columns:1fr;width:100%;margin-top:0;gap:.16rem;}
.chyn-about-cta-action{width:100%;min-height:.86rem;}
}
@media all and (max-width:480px){
.chyn-about-banner{height:7.2rem;}
.chyn-about-banner-actions{margin-top:.22rem;}
.chyn-about-facts-grid{grid-template-columns:1fr 1fr;}
.chyn-about-fact-label{font-size:var(--f16);}
.chyn-about-environment-intro{font-size:var(--f16);}
.chyn-about-culture-card .chyn-about-culture-media{padding-bottom:88%;}
.chyn-about-responsibility{height:8.4rem;}
}
@media (prefers-reduced-motion:reduce){
.chyn-about-page *{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}
/* ==================== OEM & ODM page ==================== */
.chyn-oem-page{--chyn-oem-navy:#071c30;--chyn-oem-blue:#007b65;--chyn-oem-red:#00a180;--chyn-oem-ink:#102234;--chyn-oem-muted:#5e6c79;--chyn-oem-line:#dce3e9;overflow:hidden;color:var(--chyn-oem-ink);background:#fff;}
.chyn-oem-page section[id]{scroll-margin-top:1.1rem;}
.chyn-oem-hero{position:relative;min-height:8.2rem;overflow:hidden;background:var(--chyn-oem-navy);}
.chyn-oem-hero-media,.chyn-oem-hero-shade{position:absolute;inset:0;}
.chyn-oem-hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;}
.chyn-oem-page .chyn-oem-hero-media img{
}
.chyn-oem-hero-shade{background:linear-gradient(90deg,rgba(3,18,34,.95) 0%,rgba(4,27,49,.8) 44%,rgba(4,27,49,.25) 78%,rgba(4,27,49,.12) 100%);}
.chyn-oem-hero-inner{position:relative;z-index:2;padding-top:.28rem;}
.chyn-oem-hero-crumb{display:flex;align-items:center;gap:.14rem;opacity:.76;}
.chyn-oem-hero-crumb i{font-size:.16rem;}
.chyn-oem-hero-copy{width:8.7rem;max-width:62%;padding-top:0.65rem;}
.chyn-oem-hero-title{max-width:8.3rem;line-height:1.08;letter-spacing:-.02rem;}
.chyn-oem-hero-desc{max-width:8.5rem;opacity:.92;}
.chyn-oem-hero-note{color:rgba(255,255,255,.78)!important;letter-spacing:.02rem;}
.chyn-oem-hero-actions{gap:.15rem;}
.chyn-oem-btn{display:inline-flex;min-height:.54rem;align-items:center;justify-content:center;gap:.16rem;padding:.13rem .24rem;border:.01rem solid transparent;border-radius:.06rem;transition:background-color .3s ease,color .3s ease,transform .3s ease,border-color .3s ease;}
.chyn-oem-btn i{font-size:.18rem;transition:transform .3s ease;}
.chyn-oem-btn:hover{transform:translateY(-.03rem);}
.chyn-oem-btn:hover i{transform:translateX(.04rem);}
.chyn-oem-btn-primary{background:var(--chyn-oem-red);color:#fff;}
.chyn-oem-btn-primary:hover{background:#007b65;color:#fff;}
.chyn-oem-btn-ghost{border-color:rgba(255,255,255,.65);color:#fff;}
.chyn-oem-btn-ghost:hover{border-color:#fff;background:#fff;color:var(--chyn-oem-navy);}
.chyn-oem-hero-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:11.7rem;border-top:.01rem solid rgba(255,255,255,.26);}
.chyn-oem-hero-fact{min-height:.85rem;padding:.23rem .24rem .08rem;border-right:.01rem solid rgba(255,255,255,.22);}
.chyn-oem-hero-fact:last-child{border-right:0;}
.chyn-oem-hero-fact strong{color:#fff;letter-spacing:.02rem;}
.chyn-oem-hero-fact div{opacity:.78;line-height:1.25;}
.chyn-oem-heading{position:relative;padding-left:.23rem;}
.chyn-oem-heading:before{content:"";position:absolute;left:0;top:.07rem;width:.05rem;height:.31rem;border-radius:.03rem;background:var(--chyn-oem-red);}
.chyn-oem-heading-title{line-height:1.12;letter-spacing:-.01rem;}
.chyn-oem-heading-light:before{background:#f3b8b9;}
.chyn-oem-section-head{gap:.5rem;}
.chyn-oem-section-intro{width:6.9rem;max-width:48%;}
.chyn-oem-advantages{position:relative;background:linear-gradient(125deg,#edf5f8 0%,#f7fafc 58%,#f8eeee 100%);}
.chyn-oem-advantages:after{content:"";position:absolute;right:-.55rem;top:.35rem;width:3.2rem;height:3.2rem;border:.01rem solid rgba(13,71,117,.09);border-radius:50%;pointer-events:none;}
.chyn-oem-advantages>.w16{position:relative;z-index:1;}
.chyn-oem-adv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.18rem;}
.chyn-oem-adv-card{position:relative;display:grid;grid-template-columns:.58rem 1fr;grid-template-rows:auto 1fr;column-gap:.2rem;min-height:1.85rem;padding:.3rem .32rem;border:0;border-radius:.14rem;background:rgba(255,255,255,.92);box-shadow:0 .08rem .28rem rgba(7,28,48,.055);transition:transform .3s ease,box-shadow .3s ease,background-color .3s ease;}
.chyn-oem-adv-card:hover{transform:translateY(-.04rem);border-color:#bcf0c0;box-shadow:0 .12rem .35rem rgba(7,28,48,.08);}
.chyn-oem-adv-top{grid-column:1;grid-row:1/span 2;display:flex;align-items:flex-start;justify-content:flex-start;}
.chyn-oem-adv-number{color:#dfe6ec;line-height:1;letter-spacing:-.02rem;}
.chyn-oem-adv-icon,.chyn-oem-support-icon{display:flex;width:.52rem;height:.52rem;align-items:center;justify-content:center;border:.01rem solid rgba(0,161,128,.18);border-radius:.12rem;background:#eaf8f5;color:var(--chyn-oem-red);box-shadow:0 .06rem .16rem rgba(0,161,128,.07);transition:background-color .3s ease,color .3s ease,transform .3s ease,border-color .3s ease;}
.chyn-oem-adv-icon svg,.chyn-oem-support-icon svg{width:.28rem;height:.28rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;}
.chyn-oem-adv-icon i,.chyn-oem-support-icon i{font-size:.22rem;line-height:1;}
.chyn-oem-adv-icon{border-color:var(--chyn-oem-red);background:var(--chyn-oem-red);color:#fff;}
.chyn-oem-adv-card:hover .chyn-oem-adv-icon{border-color:var(--chyn-oem-red);background:var(--chyn-oem-red);color:#fff;transform:translateY(-.03rem) rotate(-4deg);}
.chyn-oem-adv-card h3{grid-column:2;line-height:1.18;margin-top:.02rem!important;}
.chyn-oem-adv-card>div:last-child{grid-column:2;max-width:none;margin-top:.12rem!important;}
.chyn-oem-scope{background:#f4f7f9;}
.chyn-oem-scope-intro{max-width:8.5rem;}
.chyn-oem-scope-layout{align-items:stretch;gap:.22rem;}
.chyn-oem-scope-dark{width:66%;padding:.38rem;border-radius:.14rem;background:var(--chyn-oem-navy);}
.chyn-oem-scope-dark-title{max-width:5.6rem;line-height:1.15;}
.chyn-oem-scope-dark-desc{max-width:8.2rem;opacity:.8;}
.chyn-oem-scope-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.12rem;}
.chyn-oem-scope-item{display:grid;grid-template-columns:.42rem 1fr;gap:.16rem;min-height:1.22rem;padding:.2rem .18rem;border-radius:.09rem;background:#12324d;transition:background-color .3s ease,transform .3s ease;}
.chyn-oem-scope-item:hover{background:#174767;transform:translateY(-.02rem);}
.chyn-oem-scope-item>span{color:#fff;line-height:1;}
.chyn-oem-scope-item-icon{display:flex;width:.4rem;height:.4rem;align-items:flex-start;justify-content:flex-start;color:#fff;}
.chyn-oem-scope-item-icon i{font-size:.25rem;line-height:1;color:#fff;}
.chyn-oem-scope-item-icon svg{width:.24rem;height:.24rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;}
.chyn-oem-scope-item-wide{grid-column:1/-1;}
.chyn-oem-scope-item h3{line-height:1.12;}
.chyn-oem-scope-light{position:relative;width:34%;padding:.4rem;border:.01rem solid #e0e4e7;border-radius:.14rem;background:#fff;box-shadow:0 .16rem .42rem rgba(18,31,43,.075);overflow:hidden;}
.chyn-oem-scope-light:after{content:"";position:absolute;right:-.75rem;bottom:-.85rem;width:2.4rem;height:2.4rem;border-radius:50%;background:rgba(0,161,128,.035);pointer-events:none;}
.chyn-oem-scope-light>h3{position:relative;z-index:1;padding-bottom:.2rem;line-height:1.15;}
.chyn-oem-scope-light>h3:after{content:"";display:block;width:.46rem;height:.03rem;margin-top:.17rem;border-radius:.03rem;background:var(--chyn-oem-red);}
.chyn-oem-service-list{position:relative;z-index:1;}
.chyn-oem-service-line{position:relative;padding:.17rem 0 .17rem .24rem;border-top:.01rem solid #e5e8ea;}
.chyn-oem-service-line:first-child{padding-top:0;border-top:0;}
.chyn-oem-service-line:before{content:"";position:absolute;left:0;top:.25rem;width:.07rem;height:.07rem;border-radius:50%;background:var(--chyn-oem-red);box-shadow:0 0 0 .05rem rgba(0,161,128,.08);}
.chyn-oem-service-line:first-child:before{top:.08rem;}
.chyn-oem-service-line strong{line-height:1.2;}
.chyn-oem-engineering{background:#f7f9fa;}
.chyn-oem-engineering-copy{width:53%;}
.chyn-oem-support-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.26rem .4rem;}
.chyn-oem-support-row{display:grid;grid-template-columns:.5rem 1fr;gap:.16rem;align-items:start;}
.chyn-oem-support-row h3{line-height:1.15;}
.chyn-oem-support-icon{width:.46rem;height:.46rem;background:#fff;border:.01rem solid #d9e2e8;color:var(--chyn-oem-red);}
.chyn-oem-engineering-board{position:relative;width:42%;min-height:3.65rem;padding:.38rem;border-radius:.14rem;background:#fff;box-shadow:0 .16rem .45rem rgba(7,28,48,.08);overflow:hidden;}
.chyn-oem-engineering-board:after{content:"";position:absolute;right:-.35rem;bottom:-.48rem;width:2.3rem;height:2.3rem;border-radius:50%;background:#edf3f7;}
.chyn-oem-board-top{display:flex;justify-content:space-between;align-items:center;color:var(--chyn-oem-blue);letter-spacing:.04rem;}
.chyn-oem-board-status{padding:.07rem .1rem;border-radius:.03rem;background:#e8f7f4;color:var(--chyn-oem-red);letter-spacing:0;}
.chyn-oem-board-title{max-width:4.2rem;line-height:1.16;margin-top:.46rem;}
.chyn-oem-board-lines{margin-top:.3rem;padding:.15rem .16rem;border:.01rem solid #e1e8ed;background:repeating-linear-gradient(0deg,transparent 0,transparent .16rem,#e9eef2 .16rem,#e9eef2 .17rem);}
.chyn-oem-board-lines span{display:block;width:44%;height:.02rem;margin:.08rem 0;background:#b4c2cc;}
.chyn-oem-board-lines span:nth-child(2){width:66%;}.chyn-oem-board-lines span:nth-child(3){width:54%;}.chyn-oem-board-lines span:nth-child(4){width:34%;}
.chyn-oem-board-flow{position:relative;display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:.08rem;align-items:center;margin-top:.35rem;padding:.2rem;border-radius:.09rem;background:#edf3f7;}
.chyn-oem-board-flow>div{display:flex;flex-direction:column;gap:.08rem;align-items:flex-start;}
.chyn-oem-board-flow b{color:var(--chyn-oem-red);line-height:1;}.chyn-oem-board-flow span{line-height:1.2;}.chyn-oem-board-flow i{color:#7b8a95;font-size:.17rem;}
.chyn-oem-manufacturing{background:#fff;}
.chyn-oem-manufacturing-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.16rem;}
.chyn-oem-manufacturing-card{overflow:hidden;border:.01rem solid var(--chyn-oem-line);border-radius:.14rem;background:#fff;transition:transform .3s ease,box-shadow .3s ease;}
.chyn-oem-manufacturing-card:hover{transform:translateY(-.04rem);box-shadow:0 .12rem .35rem rgba(7,28,48,.08);}
.chyn-oem-manufacturing-media{position:relative;overflow:hidden;}
.chyn-oem-manufacturing-media img{transition:transform .45s ease;}
.chyn-oem-manufacturing-card:hover .chyn-oem-manufacturing-media img{transform:scale(1.04);}
.chyn-oem-manufacturing-copy{min-height:1.75rem;}
.chyn-oem-manufacturing-index{display:flex;width:.46rem;height:.46rem;align-items:center;justify-content:center;border:.01rem solid rgba(0,161,128,.18);border-radius:.1rem;background:#eaf8f5;color:var(--chyn-oem-red);box-shadow:0 .05rem .14rem rgba(0,161,128,.06);}
.chyn-oem-manufacturing-index svg{width:.25rem;height:.25rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;}
.chyn-oem-manufacturing-index i{font-size:.21rem;line-height:1;}
.chyn-oem-manufacturing-copy h3{line-height:1.16;}
.chyn-oem-process{position:relative;background:#f3f6f8;overflow:hidden;}
.chyn-oem-process:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 10% 20%,rgba(13,71,117,.07),transparent 24%),radial-gradient(circle at 88% 76%,rgba(0,161,128,.055),transparent 22%),linear-gradient(135deg,transparent 0 49.8%,rgba(13,71,117,.025) 50% 50.2%,transparent 50.4%);background-size:auto,auto,1.2rem 1.2rem;pointer-events:none;}
.chyn-oem-process>.w16{position:relative;z-index:1;}
.chyn-oem-process-head{position:relative;}
.chyn-oem-process-head .chyn-oem-heading{display:block;}
.chyn-oem-process-head .chyn-oem-section-intro{width:6.9rem;max-width:48%;margin:0;}
.chyn-oem-process-intro{max-width:8rem;}
.chyn-oem-process-track{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.1rem;}
.chyn-oem-process-track:before{content:"";position:absolute;left:.3rem;right:.3rem;top:.27rem;height:.02rem;background:#cbd8e0;}
.chyn-oem-process-step{position:relative;z-index:1;min-width:0;text-align:center;}
.chyn-oem-process-dot{display:flex;width:.56rem;height:.56rem;margin:0 auto;align-items:center;justify-content:center;border:.02rem solid var(--chyn-oem-red);border-radius:50%;background:#fff;color:var(--chyn-oem-red);}
.chyn-oem-process-dot svg{width:.29rem;height:.29rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;}
.chyn-oem-process-dot i{font-size:.21rem;line-height:1;}
.chyn-oem-process-step h3{max-width:2.65rem;margin-left:auto;margin-right:auto;line-height:1.15;}
.chyn-oem-process-step>div:last-child{max-width:2.75rem;margin-left:auto;margin-right:auto;}
.chyn-oem-why{position:relative;min-height:4.85rem;overflow:hidden;background:var(--chyn-oem-navy);}
.chyn-oem-why-media,.chyn-oem-why-shade{position:absolute;inset:0;}
.chyn-oem-why-media img{width:100%;height:100%;object-fit:cover;object-position:center;}
.chyn-oem-why-shade{background:linear-gradient(90deg,rgba(4,22,40,.97),rgba(4,22,40,.84) 50%,rgba(4,22,40,.52));}
.chyn-oem-why-inner{position:relative;z-index:2;}
.chyn-oem-why-inner>.chyn-oem-section-intro{max-width:8.9rem;}
.chyn-oem-why-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.12rem;}
.chyn-oem-why-item{min-height:1.6rem;padding:.2rem .18rem;border-top:.01rem solid rgba(255,255,255,.35);transition:border-color .3s ease,transform .3s ease;}
.chyn-oem-why-item:hover{border-color:#f17f83;transform:translateY(-.02rem);}
.chyn-oem-why-item strong{color:#f7b5b7;line-height:1;}
.chyn-oem-why-item h3{line-height:1.15;}
.chyn-oem-inquiry{position:relative;background:#fff;overflow:hidden;}
.chyn-oem-inquiry:before{display:none;}
.chyn-oem-inquiry-inner{position:relative;display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.66rem .7rem;border:0;border-radius:.16rem;background-color:#071c30;background-image:linear-gradient(90deg,rgba(4,18,32,.96) 0%,rgba(5,25,43,.88) 54%,rgba(7,25,42,.72) 100%),url('../images/generated/oem-inquiry-chyn-oem-inquiry-engineering-review.webp');background-position:center;background-size:cover;box-shadow:0 .18rem .5rem rgba(7,28,48,.16);overflow:hidden;}
.chyn-oem-inquiry-inner:after{display:none;}
.chyn-oem-inquiry-copy{position:relative;z-index:1;width:69%;}
.chyn-oem-inquiry-copy .chyn-oem-heading:before{background:#fff;}
.chyn-oem-inquiry-desc{max-width:8rem;opacity:.94;}
.chyn-oem-inquiry-note{max-width:8.7rem;opacity:.76;}
.chyn-oem-inquiry-actions{position:relative;z-index:1;display:grid;grid-template-columns:1fr;width:3.1rem;gap:.14rem;}
.chyn-oem-inquiry-actions .chyn-oem-btn{width:100%;}
.chyn-oem-btn-outline{border-color:#b8c9d4;color:var(--chyn-oem-blue);background:#fff;}
.chyn-oem-btn-outline:hover{border-color:var(--chyn-oem-blue);background:var(--chyn-oem-blue);color:#fff;}
@media all and (max-width:1400px){
.chyn-oem-hero-copy{max-width:68%;padding-top:.68rem;}.chyn-oem-hero-desc{margin-top:.18rem!important;}.chyn-oem-hero-facts{max-width:10.8rem;margin-top:.36rem!important;}.chyn-oem-scope-dark{width:64%;}.chyn-oem-scope-light{width:36%;}.chyn-oem-process-track{gap:.12rem;}.chyn-oem-process-step>div:last-child{max-width:2rem;}
}
@media all and (max-width:1100px){
.chyn-oem-page section[id]{scroll-margin-top:.8rem;}.chyn-oem-hero{min-height:7.7rem;}.chyn-oem-hero-copy{width:8.5rem;max-width:76%;}.chyn-oem-section-intro{width:6.5rem;max-width:44%;}.chyn-oem-adv-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.chyn-oem-scope-layout{display:block;}.chyn-oem-scope-dark,.chyn-oem-scope-light{width:100%;}.chyn-oem-scope-light{margin-top:.18rem;}.chyn-oem-engineering-copy,.chyn-oem-engineering-board{width:100%;}.chyn-oem-engineering-board{margin-top:.45rem;}.chyn-oem-manufacturing-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.chyn-oem-process-track{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:.45rem;}.chyn-oem-process-track:before{display:none;}.chyn-oem-why-grid{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:.25rem;}.chyn-oem-inquiry-inner{padding:.48rem;}.chyn-oem-inquiry-copy{width:64%;}.chyn-oem-inquiry-actions{width:2.9rem;}
}
@media all and (max-width:767px){
/* .chyn-oem-page{--f16:.32rem;--f18:.36rem;--f20:.38rem;--f22:.4rem;} */.chyn-oem-page section[id]{scroll-margin-top:1rem;}.chyn-oem-hero{min-height:10.8rem;}.chyn-oem-hero-media img{object-position:63% center;}.chyn-oem-hero-shade{background:linear-gradient(180deg,rgba(3,18,34,.9),rgba(4,27,49,.8) 62%,rgba(4,27,49,.9));}.chyn-oem-hero-inner{padding-top:.18rem;padding-bottom:.5rem;}.chyn-oem-hero-crumb{display:none;}.chyn-oem-hero-copy{width:100%;max-width:100%;padding-top:.75rem;}.chyn-oem-hero-title{font-size:.52rem;line-height:1.14;}.chyn-oem-hero-desc{max-width:100%;font-size:var(--f16);line-height:1.6;}.chyn-oem-hero-note{line-height:1.4;}.chyn-oem-hero-actions{display:grid;grid-template-columns:1fr;gap:.12rem;}.chyn-oem-btn{width:100%;min-height:.72rem;padding:.14rem .18rem;}.chyn-oem-hero-facts{grid-template-columns:repeat(2,minmax(0,1fr));max-width:100%;margin-top:.45rem;}.chyn-oem-hero-fact{min-height:.8rem;padding:.18rem .16rem .12rem;}.chyn-oem-heading-title{font-size:.5rem;line-height:1.18;}.chyn-oem-heading:before{top:.04rem;width:.04rem;height:.27rem;border-radius:.03rem;}.chyn-oem-section-head{display:block;}.chyn-oem-section-intro{width:100%;max-width:100%;margin-top:.18rem;line-height:1.6;}.chyn-oem-process-head .chyn-oem-section-intro{width:100%;max-width:100%;margin-top:.18rem;}.chyn-oem-adv-grid{grid-template-columns:1fr;gap:.14rem;}.chyn-oem-adv-card{min-height:0;padding:.24rem;border-radius:.11rem;}.chyn-oem-adv-card h3{font-size:.4rem;}.chyn-oem-scope-dark,.chyn-oem-scope-light{padding:.26rem;border-radius:.11rem;}.chyn-oem-scope-list{grid-template-columns:1fr;}.chyn-oem-scope-item-wide{grid-column:auto;}.chyn-oem-scope-item{grid-template-columns:.42rem 1fr;padding:.18rem .16rem;}.chyn-oem-engineering-board{min-height:3.6rem;padding:.26rem;border-radius:.11rem;}.chyn-oem-support-list{grid-template-columns:1fr;gap:.23rem;}.chyn-oem-support-row h3{font-size:.4rem;}.chyn-oem-manufacturing-grid{grid-template-columns:1fr;gap:.14rem;}.chyn-oem-manufacturing-copy{min-height:0;padding:.22rem;}.chyn-oem-manufacturing-media .rect-65{padding-bottom:62%;}.chyn-oem-process-track{grid-template-columns:1fr;gap:.28rem;margin-top:.42rem;}.chyn-oem-process-step{display:grid;grid-template-columns:.56rem 1fr;column-gap:.16rem;align-items:start;text-align:left;}.chyn-oem-process-dot{grid-row:span 2;width:.52rem;height:.52rem;margin:0;}.chyn-oem-process-step h3{max-width:none;margin-top:.02rem;margin-left:0;margin-right:0;font-size:.38rem;}.chyn-oem-process-step>div:last-child{grid-column:2;max-width:none;margin-top:.08rem;margin-left:0;margin-right:0;}.chyn-oem-why{min-height:8.6rem;}.chyn-oem-why-media img{object-position:60% center;}.chyn-oem-why-shade{background:linear-gradient(180deg,rgba(4,22,40,.92),rgba(4,22,40,.85));}.chyn-oem-why-grid{grid-template-columns:1fr 1fr;gap:.14rem;}.chyn-oem-why-item{min-height:1.7rem;padding:.18rem .12rem;}.chyn-oem-why-item h3{font-size:.38rem;}.chyn-oem-inquiry-inner{display:block;padding:.3rem;border-radius:.11rem;}.chyn-oem-inquiry-copy{width:100%;}.chyn-oem-inquiry-actions{width:100%;margin-top:.3rem;display:grid;grid-template-columns:1fr;gap:.12rem;}.chyn-oem-inquiry-desc,.chyn-oem-inquiry-note{max-width:100%;line-height:1.6;}
}
@media all and (max-width:480px){
.chyn-oem-hero{min-height:11.5rem;}.chyn-oem-hero-title{font-size:.5rem;}.chyn-oem-hero-fact strong{font-size:.28rem;}.chyn-oem-hero-fact div{font-size:var(--f16);}.chyn-oem-heading-title{font-size:.44rem;}.chyn-oem-scope-dark-title{font-size:.34rem;}.chyn-oem-scope-item h3,.chyn-oem-scope-light h3{font-size:.32rem;}.chyn-oem-board-flow{grid-template-columns:1fr;gap:.1rem;}.chyn-oem-board-flow i{display:none;}.chyn-oem-board-flow>div{flex-direction:row;align-items:center;gap:.12rem;}.chyn-oem-why-grid{grid-template-columns:1fr;}.chyn-oem-why{min-height:10rem;}
}
@media (prefers-reduced-motion:reduce){.chyn-oem-page *{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important;}}
/* OEM & ODM revised content blocks */
.chyn-oem-rd{background:#fff;}
.chyn-oem-rd-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.18rem;}
.chyn-oem-rd-card{min-height:3.35rem;padding:.3rem .28rem .32rem;border:.01rem solid #e2e8ed;border-radius:.14rem;background:#fff;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;}
.chyn-oem-rd-card:hover{transform:translateY(-.04rem);border-color:#bcf0c0;box-shadow:0 .12rem .35rem rgba(7,28,48,.08);}
.chyn-oem-rd-card-top{display:flex;align-items:flex-start;justify-content:space-between;}
.chyn-oem-rd-number{color:#dce5eb;line-height:1;}
.chyn-oem-rd-icon{display:flex;width:.64rem;height:.64rem;align-items:center;justify-content:flex-start;border:0;border-radius:0;background:transparent;color:#00a180;box-shadow:none;transition:color .3s ease,transform .3s ease;}
.chyn-oem-rd-icon svg{width:.64rem;height:.64rem;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round;}
.chyn-oem-rd-icon i{font-size:.29rem;line-height:1;}
.chyn-oem-rd-card:hover .chyn-oem-rd-icon{color:#007b65;transform:translateY(-.03rem);}
.chyn-oem-rd-card h3{line-height:1.18;}
.chyn-oem-services{background:#fff;}
.chyn-oem-service-intro{max-width:8.5rem;}
.chyn-oem-service-layout{gap:.18rem;}
.chyn-oem-service-card{width:50%;min-height:4.45rem;padding:.38rem;border-radius:.14rem;transition:transform .3s ease,box-shadow .3s ease;}
.chyn-oem-service-card:hover{transform:translateY(-.04rem);box-shadow:0 .14rem .4rem rgba(7,28,48,.1);}
.chyn-oem-service-card-dark{background:#071c30;}
.chyn-oem-service-card-light{background:#fff;border:.01rem solid #e1e8ed;}
.chyn-oem-service-card-top{display:flex;align-items:flex-start;justify-content:space-between;}
.chyn-oem-service-kicker{letter-spacing:.08rem;color:#00a180;}
.chyn-oem-service-card-dark .chyn-oem-service-kicker{color:#fff;}
.chyn-oem-service-card-icon{display:flex;width:auto;height:auto;align-items:center;justify-content:center;border:0;border-radius:0;background:transparent;color:#00a180;box-shadow:none;}
.chyn-oem-service-card-icon svg{width:.28rem;height:.28rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;}
.chyn-oem-service-card-icon i{font-size:.29rem;line-height:1;}
.chyn-oem-service-card-dark .chyn-oem-service-card-icon{color:#fff;}
.chyn-oem-service-card h3{line-height:1.1;max-width:5.4rem;}
.chyn-oem-service-includes{padding-top:.2rem;border-top:.01rem solid rgba(255,255,255,.25);}
.chyn-oem-service-card-light .chyn-oem-service-includes{border-top-color:#dbe4ea;}
.chyn-oem-service-includes ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.12rem .25rem;}
.chyn-oem-service-includes li{display:flex;gap:.1rem;align-items:flex-start;line-height:1.3;}
.chyn-oem-service-includes li i{margin-top:.04rem;color:#00a180;font-size:.14rem;}
.chyn-oem-inquiry-visual-frame img{object-position:center 55%;}
@media all and (max-width:1100px){
.chyn-oem-rd-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.chyn-oem-service-card{width:100%;}.chyn-oem-service-layout{display:block;}.chyn-oem-service-card+.chyn-oem-service-card{margin-top:.18rem;}
}
@media all and (max-width:767px){
.chyn-oem-rd-grid{grid-template-columns:1fr;gap:.14rem;}.chyn-oem-rd-card{min-height:0;padding:.24rem;border-radius:.11rem;}.chyn-oem-rd-card h3{font-size:.4rem;}.chyn-oem-service-card{min-height:0;padding:.26rem;border-radius:.11rem;}.chyn-oem-service-card h3{font-size:.44rem;}.chyn-oem-service-includes ul{grid-template-columns:1fr;}.chyn-oem-service-card+.chyn-oem-service-card{margin-top:.14rem;}
}
/* ==================== Product category guide ==================== */
.chyn-product-guide-page{--chyn-pg-navy:#191b20;--chyn-pg-blue:#007b65;--chyn-pg-red:#00a180;--chyn-pg-ink:#1b1d21;--chyn-pg-muted:#686b70;--chyn-pg-line:#e3e3e3;overflow:hidden;color:var(--chyn-pg-ink);background:#fff;}
.chyn-product-guide-page section[id]{scroll-margin-top:1.2rem;}
.chyn-product-guide-hero{position:relative;min-height:6.9rem;overflow:hidden;background:linear-gradient(112deg,#f7fbfd 0%,#fff 54%,#f4f9fb 100%);}
.chyn-product-guide-hero:before{content:"";position:absolute;right:-1.1rem;top:-1.9rem;width:7.6rem;height:7.6rem;border-radius:50%;background:radial-gradient(circle,rgba(0,161,128,.07) 0,rgba(0,161,128,.025) 42%,transparent 70%);}
.chyn-product-guide-hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(0,161,128,.025) .01rem,transparent .01rem),linear-gradient(90deg,rgba(0,161,128,.025) .01rem,transparent .01rem);background-size:.52rem .52rem;mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) 48%,#000 100%);}
.chyn-product-guide-hero-inner{position:relative;z-index:1;min-height:6.9rem;gap:.6rem;padding-top:.58rem;padding-bottom:.55rem;}
.chyn-product-guide-hero-copy{width:48%;padding-top:1.02rem;}
.chyn-product-guide-title{max-width:7.5rem;line-height:1.08;letter-spacing:-.025rem;}
.chyn-product-guide-intro{max-width:7.5rem;}
.chyn-product-guide-actions{gap:.15rem;}
.chyn-product-guide-btn{display:inline-flex;min-height:.66rem;align-items:center;justify-content:center;gap:.14rem;padding:.17rem .34rem;border:.01rem solid transparent;border-radius:.07rem;line-height:1.2;transition:transform .3s ease,background-color .3s ease,border-color .3s ease,color .3s ease;}
.chyn-product-guide-btn:hover{transform:translateY(-.03rem);}
.chyn-product-guide-btn i{transition:transform .3s ease;}.chyn-product-guide-btn:hover i{transform:translateX(.04rem);}
.chyn-product-guide-btn-primary{background:var(--chyn-pg-red);color:#fff;}.chyn-product-guide-btn-primary:hover{background:#007b65;color:#fff;}
.chyn-product-guide-btn-outline{border-color:#b8c7d1;background:#fff;color:var(--chyn-pg-blue);}.chyn-product-guide-btn-outline:hover{border-color:var(--chyn-pg-blue);background:var(--chyn-pg-blue);color:#fff;}
.chyn-product-guide-hero-visual{position:relative;width:46%;height:5.8rem;}
.chyn-product-guide-orbit{position:absolute;left:50%;top:50%;border:.01rem solid rgba(0,161,128,.17);border-radius:50%;transform:translate(-50%,-50%);}
.chyn-product-guide-orbit-outer{width:5.3rem;height:5.3rem;}.chyn-product-guide-orbit-inner{width:3.25rem;height:3.25rem;border-style:dashed;}
.chyn-product-guide-core{position:absolute;left:50%;top:50%;display:flex;width:1.72rem;height:1.72rem;align-items:center;justify-content:center;flex-direction:column;border:.01rem solid rgba(0,161,128,.2);border-radius:50%;background:#fff;box-shadow:0 .18rem .55rem rgba(7,28,48,.12);transform:translate(-50%,-50%);}
.chyn-product-guide-core span{color:var(--chyn-pg-red);letter-spacing:.05rem;}.chyn-product-guide-core strong{margin-top:.08rem;color:var(--chyn-pg-navy);}
.chyn-product-guide-hero-category{position:absolute;display:flex;width:1.45rem;align-items:center;flex-direction:column;gap:.09rem;text-align:center;color:var(--chyn-pg-ink);transition:transform .3s ease,color .3s ease;}
.chyn-product-guide-hero-category span{display:flex;width:.9rem;height:.9rem;align-items:center;justify-content:center;border:.01rem solid #dfe7ec;border-radius:.12rem;background:#fff;box-shadow:0 .12rem .35rem rgba(7,28,48,.09);transition:border-color .3s ease,box-shadow .3s ease;}
.chyn-product-guide-hero-category img{width:.58rem;height:.58rem;object-fit:contain;}
.chyn-product-guide-hero-category:hover{z-index:2;color:var(--chyn-pg-red);transform:translateY(-.04rem);}.chyn-product-guide-hero-category:hover span{border-color:#8bd6c7;box-shadow:0 .16rem .38rem rgba(7,28,48,.13);}
.chyn-product-guide-hero-category-1{left:12%;top:8%;}.chyn-product-guide-hero-category-2{right:10%;top:9%;}.chyn-product-guide-hero-category-3{right:0;top:43%;}.chyn-product-guide-hero-category-4{right:13%;bottom:3%;}.chyn-product-guide-hero-category-5{left:13%;bottom:3%;}.chyn-product-guide-hero-category-6{left:0;top:43%;}
.chyn-product-guide-nav{position:relative;z-index:4;padding:.52rem 0 .26rem;background:#fff;}
.chyn-product-guide-nav-inner{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.16rem;}
.chyn-product-guide-nav-link{display:grid;grid-template-columns:1fr .58rem;min-width:0;min-height:.94rem;align-items:center;gap:.2rem;padding:.17rem .2rem .17rem .25rem;border:.01rem solid #dedfe1;border-radius:.07rem;background:#fff;color:var(--chyn-pg-ink);box-shadow:0 .07rem .2rem rgba(24,25,29,.035);transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease,transform .3s ease;}
.chyn-product-guide-nav .chyn-product-guide-nav-link:hover,.chyn-product-guide-nav .chyn-product-guide-nav-link.active{border-color:rgba(0,161,128,.5);background:#fff;color:var(--chyn-pg-red);box-shadow:0 .12rem .3rem rgba(39,24,27,.08);transform:translateY(-.025rem);}
.chyn-product-guide-nav-icon{display:flex;grid-column:2;grid-row:1;width:.56rem;height:.56rem;align-items:center;justify-content:center;}.chyn-product-guide-nav-icon img{width:.46rem;height:.46rem;object-fit:contain;}
.chyn-product-guide-nav-name{grid-column:1;grid-row:1;min-width:0;font-size:var(--f18);line-height:1.25;}
.chyn-product-guide-sections>.chyn-product-guide-section:nth-child(even){background:#f7f9fb;}.chyn-product-guide-sections>.chyn-product-guide-section:nth-child(odd){background:#fff;}
.chyn-product-guide-section-head{gap:.6rem;}
.chyn-product-guide-section-copy{max-width:10rem;}.chyn-product-guide-section-title-row{gap:.16rem;}
.chyn-product-guide-section-icon{position:relative;display:flex;width:.56rem;height:.56rem;align-items:center;justify-content:center;border:.01rem solid rgba(0,161,128,.3);border-radius:.1rem;background:#fff;box-shadow:0 .08rem .22rem rgba(7,28,48,.06);}
.chyn-product-guide-section-icon:before{content:"";position:absolute;left:-.28rem;top:50%;width:.2rem;height:.01rem;background:var(--chyn-pg-red);}
.chyn-product-guide-section-icon img{width:.38rem;height:.38rem;object-fit:contain;}.chyn-product-guide-section-title{line-height:1.14;}
.chyn-product-guide-section-desc{max-width:9.6rem;}
.chyn-product-guide-view{display:inline-flex;min-width:2.08rem;min-height:.62rem;align-items:center;justify-content:center;gap:.14rem;padding:.15rem .34rem;border:.01rem solid #cfd9df;border-radius:.31rem;background:#fff;color:var(--chyn-pg-blue);white-space:nowrap;transition:background-color .3s ease,color .3s ease,border-color .3s ease,transform .3s ease;}
.chyn-product-guide-view:hover{border-color:var(--chyn-pg-red);background:var(--chyn-pg-red);color:#fff;transform:translateY(-.025rem);}.chyn-product-guide-view-icon{width:.21rem;height:.21rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s ease;}.chyn-product-guide-view:hover .chyn-product-guide-view-icon{transform:translateX(.04rem);}
.chyn-product-guide-carousel{position:relative;padding:0;}
.chyn-product-guide-carousel-empty{display:none;}
.chyn-product-guide-carousel .chyn-product-guide-swiper{width:calc(100% + .8rem);margin-left:-.4rem;overflow:hidden;padding:.32rem .4rem .55rem;}
.chyn-product-guide-swiper .swiper-slide{height:auto;}
.chyn-product-guide-card{display:flex;height:100%;min-height:4.55rem;overflow:hidden;flex-direction:column;border:.01rem solid var(--chyn-pg-line);border-radius:.1rem;background:#fff;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;}
.chyn-product-guide-card:hover{transform:translateY(-.04rem);border-color:#9edfd3;box-shadow:0 .14rem .38rem rgba(7,28,48,.09);}
.chyn-product-guide-card-top{min-height:.74rem;padding:.22rem .22rem 0;}.chyn-product-guide-card-title{min-height:.52rem;}
.chyn-product-guide-card-media{position:relative;overflow:hidden;background:#fff;}.chyn-product-guide-card-media img{object-fit:contain;transition:transform .4s ease;}.chyn-product-guide-card:hover .chyn-product-guide-card-media img{transform:scale(1.045);}
.chyn-product-guide-card-bottom{position:relative;display:flex;min-height:.93rem;align-items:flex-start;justify-content:space-between;gap:.12rem;margin-top:auto;padding:.16rem .2rem .2rem;border-top:.01rem solid #edf1f3;}
.chyn-product-guide-card-desc{max-width:82%;}.chyn-product-guide-card-arrow{display:flex;width:.35rem;height:.35rem;flex:0 0 .35rem;align-items:center;justify-content:center;border-radius:50%;background:#eaf8f5;color:var(--chyn-pg-red);transition:background-color .3s ease,color .3s ease;}
.chyn-product-guide-card-arrow svg{width:.18rem;height:.18rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}.chyn-product-guide-card:hover .chyn-product-guide-card-arrow{background:var(--chyn-pg-red);color:#fff;}
.chyn-product-guide-card-empty{justify-content:center;text-align:center;}.chyn-product-guide-card-empty .chyn-product-guide-card-media{width:1.55rem;margin:.25rem auto 0;}.chyn-product-guide-card-empty .chyn-product-guide-card-bottom{justify-content:center;}.chyn-product-guide-card-empty .chyn-product-guide-card-desc{max-width:100%;}
.chyn-product-guide-prev,.chyn-product-guide-next{position:absolute;z-index:3;top:50%;display:flex;width:.58rem;height:.58rem;align-items:center;justify-content:center;border:.01rem solid #d4dde3;border-radius:50%;background:#fff;color:var(--chyn-pg-blue);box-shadow:0 .08rem .22rem rgba(7,28,48,.08);transform:translateY(-50%);transition:background-color .3s ease,color .3s ease,border-color .3s ease;}
.chyn-product-guide-prev{left:-.76rem;}.chyn-product-guide-next{right:-.76rem;}.chyn-product-guide-prev:hover,.chyn-product-guide-next:hover{border-color:var(--chyn-pg-red);background:var(--chyn-pg-red);color:#fff;}
.chyn-product-guide-prev svg,.chyn-product-guide-next svg{width:.26rem;height:.26rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}.chyn-product-guide-prev.swiper-button-disabled,.chyn-product-guide-next.swiper-button-disabled{opacity:.35;cursor:default;}
.chyn-product-guide-cta{position:relative;overflow:hidden;background:linear-gradient(112deg,#071f25 0%,#086050 52%,#00a180 100%);}
.chyn-product-guide-cta:before{content:"";position:absolute;right:-1.2rem;top:-2.4rem;width:6.2rem;height:6.2rem;border:.01rem solid rgba(255,255,255,.1);border-radius:50%;box-shadow:0 0 0 .55rem rgba(255,255,255,.025),0 0 0 1.1rem rgba(255,255,255,.02);}
.chyn-product-guide-cta-inner{position:relative;z-index:1;gap:.6rem;}.chyn-product-guide-cta-copy{max-width:10.5rem;}.chyn-product-guide-cta-title{line-height:1.13;}.chyn-product-guide-cta-desc{max-width:9.5rem;opacity:.84;}
.chyn-product-guide-btn-light{min-width:2.8rem;background:#fff;color:var(--chyn-pg-blue);}.chyn-product-guide-btn-light:hover{background:var(--chyn-pg-red);color:#fff;}
@media all and (max-width:1400px){
.chyn-product-guide-hero-copy{width:51%;}.chyn-product-guide-hero-visual{width:44%;}.chyn-product-guide-nav-link{padding:.15rem .18rem .15rem .21rem;gap:.14rem;}.chyn-product-guide-prev{left:-.5rem;}.chyn-product-guide-next{right:-.5rem;}
}
@media all and (max-width:1100px){
.chyn-product-guide-page section[id]{scroll-margin-top:.95rem;}.chyn-product-guide-hero{min-height:6.25rem;}.chyn-product-guide-hero-inner{min-height:6.25rem;}.chyn-product-guide-hero-copy{width:54%;padding-top:.55rem;}.chyn-product-guide-hero-visual{width:42%;height:5rem;}.chyn-product-guide-orbit-outer{width:4.55rem;height:4.55rem;}.chyn-product-guide-orbit-inner{width:2.8rem;height:2.8rem;}.chyn-product-guide-hero-category{width:1.18rem;}.chyn-product-guide-hero-category span{width:.74rem;height:.74rem;}.chyn-product-guide-hero-category img{width:.48rem;height:.48rem;}.chyn-product-guide-core{width:1.45rem;height:1.45rem;}.chyn-product-guide-nav-inner{grid-template-columns:repeat(3,minmax(0,1fr));}.chyn-product-guide-section-head{align-items:flex-end;}.chyn-product-guide-card{min-height:4.25rem;}.chyn-product-guide-cta-copy{max-width:7.2rem;}
}
@media all and (max-width:767px){
.chyn-product-guide-page section[id]{scroll-margin-top:.85rem;}.chyn-product-guide-hero{min-height:10.4rem;}.chyn-product-guide-hero-inner{display:block;min-height:10.4rem;padding-top:.55rem;padding-bottom:.5rem;}.chyn-product-guide-hero-copy,.chyn-product-guide-hero-visual{width:100%;}.chyn-product-guide-hero-copy{padding-top:.45rem;}.chyn-product-guide-title{font-size:.52rem;line-height:1.14;}.chyn-product-guide-intro{font-size:var(--f16);line-height:1.65;}.chyn-product-guide-actions{display:grid;grid-template-columns:1fr;gap:.12rem;}.chyn-product-guide-btn{width:100%;min-height:.82rem;box-sizing:border-box;}.chyn-product-guide-btn svg{width:.24rem;height:.24rem;flex:0 0 .24rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}.chyn-product-guide-hero-visual{height:4.7rem;margin-top:.35rem;}.chyn-product-guide-orbit-outer{width:4.25rem;height:4.25rem;}.chyn-product-guide-orbit-inner{width:2.6rem;height:2.6rem;}.chyn-product-guide-core{width:1.32rem;height:1.32rem;}.chyn-product-guide-core span{font-size:.26rem;}.chyn-product-guide-core strong{font-size:.3rem;}.chyn-product-guide-hero-category{width:1.05rem;gap:.05rem;}.chyn-product-guide-hero-category span{width:.7rem;height:.7rem;border-radius:.09rem;}.chyn-product-guide-hero-category img{width:.44rem;height:.44rem;}.chyn-product-guide-hero-category strong{font-size:.22rem;line-height:1.15;}.chyn-product-guide-nav{padding:.34rem 0 .12rem;}.chyn-product-guide-nav-inner{grid-template-columns:1fr 1fr;gap:.12rem;}.chyn-product-guide-nav-link{min-height:.82rem;grid-template-columns:1fr .46rem;padding:.12rem .13rem .12rem .16rem;}.chyn-product-guide-nav-icon{width:.44rem;height:.44rem;}.chyn-product-guide-nav-icon img{width:.31rem;height:.31rem;}.chyn-product-guide-nav-name{font-size:var(--f16);}.chyn-product-guide-section{padding-top:.75rem;padding-bottom:.75rem;}.chyn-product-guide-section-head{display:block;}.chyn-product-guide-section-copy{max-width:100%;}.chyn-product-guide-section-title-row{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:.14rem;}.chyn-product-guide-section-icon{width:.5rem;height:.5rem;}.chyn-product-guide-section-icon:before{display:none;}.chyn-product-guide-section-title{font-size:.46rem;}.chyn-product-guide-section-desc{font-size:var(--f16);line-height:1.65;}.chyn-product-guide-view{margin-top:.24rem;}.chyn-product-guide-carousel{margin-top:.35rem;padding:0;}.chyn-product-guide-prev,.chyn-product-guide-next{display:none;}.chyn-product-guide-card{min-height:4rem;}.chyn-product-guide-card-top{padding:.2rem .18rem 0;}.chyn-product-guide-card-media{margin-left:.18rem;margin-right:.18rem;}.chyn-product-guide-card-bottom{padding:.15rem .18rem .18rem;}.chyn-product-guide-cta-inner{display:block;}.chyn-product-guide-cta-title{font-size:.48rem;}.chyn-product-guide-cta-desc{font-size:var(--f16);line-height:1.65;}.chyn-product-guide-btn-light{margin-top:.35rem;}
}
@media (prefers-reduced-motion:reduce){.chyn-product-guide-page *{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important;}}
/* CHYN HUANGHUA INNER REPLICA END */
/* CHYN solution list */
.chyn-sol-list-page{background:#f5f6f8;}
.chyn-sol-list .chyn-sol-list-head-main{max-width:8.8rem;}
.chyn-sol-list .chyn-sol-list-intro{width:5.5rem;max-width:38%;}
.chyn-sol-list .chyn-sol-list-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.36rem;}
.chyn-sol-list .chyn-sol-list-card{min-width:0;background:#fff;border-radius:.1rem;box-shadow:0 .08rem .24rem rgba(9,29,42,.07);transition:transform .35s ease,box-shadow .35s ease;}
.chyn-sol-list .chyn-sol-list-link{display:flex;height:100%;flex-direction:column;color:#17202a;}
.chyn-sol-list .chyn-sol-list-media{position:relative;overflow:hidden;border-radius:.1rem .1rem 0 0;background:#dfe6e8;}
.chyn-sol-list .chyn-sol-list-img{transition:transform .65s ease;}
.chyn-sol-list .chyn-sol-list-media:after{position:absolute;content:"";inset:0;background:linear-gradient(180deg,rgba(6,25,34,0) 52%,rgba(6,25,34,.28) 100%);pointer-events:none;}
.chyn-sol-list .chyn-sol-list-copy{display:flex;min-height:3.25rem;flex:1;align-items:flex-start;flex-direction:column;}
.chyn-sol-list .chyn-sol-list-title{min-height:2.6em;}
.chyn-sol-list .chyn-sol-list-desc{min-height:4.8em;}
.chyn-sol-list .chyn-sol-list-more{display:flex;width:100%;align-items:center;justify-content:space-between;margin-top:auto;color:#17202a;}
.chyn-sol-list .chyn-sol-list-arrow{display:flex;width:.46rem;height:.46rem;align-items:center;justify-content:center;border-radius:50%;background:#e9f7f4;color:var(--theme-color);transition:background-color .3s ease,color .3s ease,transform .3s ease;}
.chyn-sol-list .chyn-sol-list-arrow-icon{width:.22rem;height:.22rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.chyn-sol-list .chyn-sol-list-card:hover{transform:translateY(-.06rem);box-shadow:0 .18rem .38rem rgba(9,29,42,.13);}
.chyn-sol-list .chyn-sol-list-card:hover .chyn-sol-list-img{transform:scale(1.045);}
.chyn-sol-list .chyn-sol-list-card:hover .chyn-sol-list-arrow{background:var(--theme-color);color:#fff;transform:translateX(.03rem);}
.chyn-sol-list .chyn-sol-list-card:hover .chyn-sol-list-title,.chyn-sol-list .chyn-sol-list-card:hover .chyn-sol-list-more-text{color:var(--theme-color);}
/* CHYN solution detail */
.chyn-sol-detail{background:#fff;color:#161a20;}
.chyn-sol-hero{position:relative;height:7rem;overflow:hidden;background:#071827;}
.chyn-sol-hero-media,.chyn-sol-hero-mask{position:absolute;inset:0;}
.chyn-sol-hero-media img{width:100%;height:100%;object-fit:cover;}
.chyn-sol-hero-mask{background:linear-gradient(90deg,rgba(4,20,34,.94) 0%,rgba(4,20,34,.72) 46%,rgba(4,20,34,.2) 78%,rgba(4,20,34,.08) 100%);}
.chyn-sol-hero-crumb{position:absolute;left:50%;top:.35rem;z-index:2;transform:translateX(-50%);color:#fff;font-size:var(--f16);}
.chyn-sol-hero-crumb a{color:#fff;}
.chyn-sol-hero-crumb i{margin:0 .12rem;opacity:.72;}
.chyn-sol-hero-copy{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-42%);}
.chyn-sol-kicker,.chyn-sol-section-label{color:#75dfc8;letter-spacing:.08em;text-transform:uppercase;}
.chyn-sol-title{width:9.6rem;max-width:70%;margin-top:.15rem;line-height:1.08;}
.chyn-sol-lead{width:7.8rem;max-width:64%;opacity:.88;}
.chyn-sol-hero-actions{gap:.2rem;}
.chyn-sol-hero-link{display:inline-flex;min-height:.54rem;align-items:center;gap:.1rem;padding:.15rem .28rem;border:.01rem solid rgba(255,255,255,.7);border-radius:.06rem;color:#fff;}
.chyn-sol-hero-link:hover{background:#fff;color:#10253a;}
.chyn-sol-nav{position:sticky;top:1rem;z-index:10;background:#fff;box-shadow:0 .05rem .16rem rgba(7,25,43,.1);}
.chyn-sol-nav .chyn-sol-nav-inner{height:.72rem;gap:.48rem;}
.chyn-sol-nav a{position:relative;display:flex;height:100%;align-items:center;color:#56606a;text-transform:uppercase;}
.chyn-sol-nav a:after{position:absolute;content:"";left:0;bottom:0;width:0;height:.03rem;background:var(--theme-color);transition:width .3s ease;}
.chyn-sol-nav a:hover,.chyn-sol-nav a.active{color:var(--theme-color);}
.chyn-sol-nav a:hover:after,.chyn-sol-nav a.active:after{width:100%;}
.chyn-sol-article{width:11rem;min-width:0;}
.chyn-sol-section-label{color:var(--theme-color);}
.chyn-sol-heading{max-width:8.8rem;}
.chyn-sol-aside{position:sticky;top:2rem;width:4.25rem;align-self:flex-start;padding:.38rem .34rem;border-radius:.12rem;background:#0c2031;color:#fff;box-shadow:0 .16rem .36rem rgba(5,20,33,.16);}
.chyn-sol-aside-head>div{color:#75dfc8;letter-spacing:.06em;}
.chyn-sol-inputs{display:grid;gap:.16rem;}
.chyn-sol-inputs li{display:flex;align-items:center;gap:.14rem;padding-bottom:.16rem;border-bottom:.01rem solid rgba(255,255,255,.12);color:rgba(255,255,255,.82);}
.chyn-sol-inputs span{display:flex;width:.34rem;height:.34rem;align-items:center;justify-content:center;flex:0 0 .34rem;border-radius:50%;background:rgba(0,161,128,.2);color:#75dfc8;font-size:var(--f14);}
.chyn-sol-aside-action{display:inline-flex;align-items:center;gap:.1rem;color:#75dfc8;}
.chyn-sol-aside-action:hover{color:#fff;gap:.16rem;}
.chyn-sol-framework{position:relative;background:#f5f6f8;}
.chyn-sol-framework:after{position:absolute;content:"";left:50%;bottom:0;width:16rem;max-width:84%;height:.01rem;transform:translateX(-50%);background:linear-gradient(90deg,rgba(0,161,128,0),rgba(0,161,128,.24) 22%,rgba(0,161,128,.24) 78%,rgba(0,161,128,0));}
.chyn-sol-framework .chyn-sol-framework-heading{width:8.3rem;max-width:58%;}
.chyn-sol-framework .chyn-sol-framework-intro{width:5.5rem;max-width:38%;}
.chyn-sol-framework .chyn-sol-framework-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.24rem;}
.chyn-sol-framework .chyn-sol-framework-item{min-width:0;padding:.34rem .3rem .38rem;background:#fff;border-radius:.1rem;box-shadow:0 .07rem .22rem rgba(7,30,42,.06);transition:transform .35s ease,box-shadow .35s ease;}
.chyn-sol-framework .chyn-sol-framework-icon{display:flex;width:.68rem;height:.68rem;align-items:center;justify-content:center;border-radius:50%;background:#e9f7f4;color:var(--theme-color);transition:background-color .3s ease,color .3s ease;}
.chyn-sol-framework .chyn-sol-framework-icon i{font-size:var(--f28);line-height:1;}
.chyn-sol-framework .chyn-sol-framework-icon svg{width:.38rem;height:.38rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.chyn-sol-framework .chyn-sol-framework-copy{margin-top:.26rem;}
.chyn-sol-framework .chyn-sol-framework-item:hover{transform:translateY(-.05rem);box-shadow:0 .15rem .34rem rgba(7,30,42,.11);}
.chyn-sol-framework .chyn-sol-framework-item:hover .chyn-sol-framework-icon{background:var(--theme-color);color:#fff;}
.chyn-sol-delivery{position:relative;overflow:hidden;background:#0a202c;color:#fff;}
.chyn-sol-delivery:before{position:absolute;content:"";right:-1.2rem;top:-2.4rem;width:7.2rem;height:7.2rem;border-radius:50%;background:radial-gradient(circle,rgba(0,161,128,.2) 0%,rgba(0,161,128,0) 68%);pointer-events:none;}
.chyn-sol-delivery .chyn-sol-delivery-inner{position:relative;z-index:1;}
.chyn-sol-delivery .chyn-sol-delivery-head{width:5.25rem;}
.chyn-sol-delivery .chyn-sol-delivery-intro{color:rgba(255,255,255,.7);}
.chyn-sol-delivery .chyn-sol-delivery-link{width:max-content;}
.chyn-sol-delivery .chyn-sol-delivery-steps{position:relative;width:8.8rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:.5rem;row-gap:.38rem;}
.chyn-sol-delivery .chyn-sol-delivery-step{position:relative;display:grid;grid-template-columns:.34rem 1fr;gap:.18rem;min-width:0;padding-bottom:.32rem;border-bottom:.01rem solid rgba(255,255,255,.15);}
.chyn-sol-delivery .chyn-sol-delivery-step-mark{display:flex;justify-content:center;padding-top:.06rem;}
.chyn-sol-delivery .chyn-sol-delivery-step-dot{display:block;width:.16rem;height:.16rem;border:.04rem solid rgba(117,223,200,.3);border-radius:50%;background:#75dfc8;box-shadow:0 0 0 .06rem rgba(117,223,200,.08);transition:box-shadow .3s ease,transform .3s ease;}
.chyn-sol-delivery .chyn-sol-delivery-step-label{color:#75dfc8;letter-spacing:.055em;}
.chyn-sol-delivery .chyn-sol-delivery-step-desc{color:rgba(255,255,255,.68);}
.chyn-sol-delivery .chyn-sol-delivery-step:hover .chyn-sol-delivery-step-dot{transform:scale(1.12);box-shadow:0 0 0 .1rem rgba(117,223,200,.12);}
.chyn-sol-delivery .chyn-sol-delivery-step:hover .chyn-sol-delivery-step-title{color:#75dfc8;}
.chyn-sol-products{background:#f5f6f8;}
.chyn-sol-products-carousel{position:relative;margin-right:-.34rem;margin-left:-.34rem;padding:0 .34rem;}
.chyn-sol-products-slider{padding:.14rem .1rem .2rem;overflow:hidden;}
.chyn-sol-products-slider .swiper-slide{height:auto;}
.chyn-sol-products-slider .chyn-pro-card{height:100%;}
.chyn-sol-products-prev,.chyn-sol-products-next{position:absolute;top:50%;z-index:3;width:.64rem;height:.64rem;border:.01rem solid #d9dee3;border-radius:50%;background:#fff;color:#34414a;cursor:pointer;box-shadow:0 .1rem .26rem rgba(7,27,39,.13);transform:translateY(-50%);transition:.3s ease;}
.chyn-sol-products-prev i,.chyn-sol-products-next i,.chyn-sol-cases-prev i,.chyn-sol-cases-next i{display:block;font-size:.32rem;line-height:1;}
.chyn-sol-products-prev{left:0;}.chyn-sol-products-next{right:0;}
.chyn-sol-products-prev:hover,.chyn-sol-products-next:hover{border-color:var(--theme-color);background:var(--theme-color);color:#fff;}
.chyn-sol-cases{background:#fff;}
.chyn-sol-cases .chyn-sol-cases-heading{width:8.7rem;max-width:60%;}
.chyn-sol-cases .chyn-sol-cases-side{width:5.2rem;max-width:36%;}
.chyn-sol-cases .chyn-sol-cases-carousel{position:relative;margin-right:-.34rem;margin-left:-.34rem;padding:0 .34rem;}
.chyn-sol-cases .chyn-sol-cases-slider{padding:.12rem .06rem .2rem;overflow:hidden;}
.chyn-sol-cases .chyn-sol-cases-slider .swiper-slide{height:auto;}
.chyn-sol-cases .chyn-sol-case-card{min-width:0;}
.chyn-sol-cases .chyn-sol-case-link{position:relative;display:block;height:100%;overflow:hidden;border-radius:.12rem;background:#0b1e29;box-shadow:0 .12rem .3rem rgba(8,26,38,.12);}
.chyn-sol-cases .chyn-sol-case-mask{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,19,27,.03) 28%,rgba(5,19,27,.9) 100%);}
.chyn-sol-cases .chyn-sol-case-img{transition:transform .65s ease;}
.chyn-sol-cases .chyn-sol-case-copy{position:absolute;left:.34rem;right:.34rem;bottom:.32rem;z-index:2;padding-right:.66rem;}
.chyn-sol-cases .chyn-sol-case-label{color:#75dfc8;letter-spacing:.055em;}
.chyn-sol-cases .chyn-sol-case-desc{max-width:4.2rem;color:rgba(255,255,255,.82);line-height:1.65;}
.chyn-sol-cases .chyn-sol-case-arrow{position:absolute;right:0;bottom:0;display:flex;width:.48rem;height:.48rem;align-items:center;justify-content:center;border-radius:50%;background:var(--theme-color);color:#fff;transition:background-color .3s ease,color .3s ease,transform .3s ease;}
.chyn-sol-cases .chyn-sol-case-arrow svg{width:.22rem;height:.22rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.chyn-sol-cases .chyn-sol-case-card:hover .chyn-sol-case-img{transform:scale(1.05);}
.chyn-sol-cases .chyn-sol-case-card:hover .chyn-sol-case-arrow{background:#fff;color:var(--theme-color);transform:translateX(.03rem);}
.chyn-sol-cases-prev,.chyn-sol-cases-next{position:absolute;top:50%;z-index:3;width:.64rem;height:.64rem;border:.01rem solid rgba(255,255,255,.7);border-radius:50%;background:#fff;color:#34414a;cursor:pointer;box-shadow:0 .1rem .26rem rgba(7,27,39,.16);transform:translateY(-50%);transition:.3s ease;}
.chyn-sol-cases-prev{left:0;}.chyn-sol-cases-next{right:0;}
.chyn-sol-cases-prev:hover,.chyn-sol-cases-next:hover{border-color:var(--theme-color);background:var(--theme-color);color:#fff;}
.chyn-sol-contact{position:relative;height:6.6rem;overflow:hidden;background:#071827;}
.chyn-sol-contact-media,.chyn-sol-contact-mask{position:absolute;inset:0;}
.chyn-sol-contact-media img{width:100%;height:100%;object-fit:cover;}
.chyn-sol-contact-mask{background:rgba(4,24,40,.72);}
.chyn-sol-contact-copy{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);}
.chyn-sol-contact-copy>div:not(.chyn-sol-kicker){width:8.5rem;max-width:100%;margin-left:auto;margin-right:auto;}
.chyn-about-facts-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
.chyn-about-document-card{display:flex;min-height:3.6rem;align-items:center;justify-content:center;flex-direction:column;}
.chyn-about-document-icon{display:flex;width:.84rem;height:.84rem;align-items:center;justify-content:center;border-radius:50%;background:rgba(0,161,128,.1);color:var(--theme-color);font-size:var(--f36);}
.chyn-news-card .chyn-news-info{position:relative;}
.chyn-news-card .chyn-news-info .chyn-news-date{left:.3rem;top:auto;bottom:100%;width:.82rem;height:auto;margin:0;transform:none;margin-bottom: -0.25rem;box-shadow: none;}
.chyn-news-card .chyn-news-info .chyn-news-date span{margin:0;}
/* CHYN product, solution and application cross-links */
.chyn-pro-connections{padding-top:0;background:#f5f6f8;}
.chyn-pro-connections .chyn-pro-connections-heading{width:8.4rem;max-width:58%;}
.chyn-pro-connections .chyn-pro-connections-intro{width:5.4rem;max-width:38%;}
.chyn-pro-connections .chyn-pro-connections-layout{display:block;}
.chyn-pro-connections .chyn-pro-connect-solutions,.chyn-pro-connections .chyn-pro-connect-cases{min-width:0;}
.chyn-pro-connections .chyn-pro-connect-cases{margin-top:.65rem;}
.chyn-pro-connections .chyn-pro-connect-col-head{gap:.25rem;}
.chyn-pro-connections .chyn-pro-connect-all{color:var(--theme-color);}
.chyn-pro-connections .chyn-pro-connect-all i{margin-left:.07rem;transition:transform .3s ease;}
.chyn-pro-connections .chyn-pro-connect-all:hover i{transform:translateX(.05rem);}
.chyn-pro-connections .chyn-pro-connect-solution-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.3rem;}
.chyn-pro-connections .chyn-pro-connect-solution-link{display:grid;grid-template-columns:46% 54%;min-height:3.8rem;overflow:hidden;border-radius:.1rem;background:#fff;color:#17202a;box-shadow:0 .1rem .28rem rgba(8,27,39,.08);transition:transform .35s ease,box-shadow .35s ease;}
.chyn-pro-connections .chyn-pro-connect-solution-media{overflow:hidden;}
.chyn-pro-connections .chyn-pro-connect-solution-media>.rect-60{height:100%;padding-bottom:0;}
.chyn-pro-connections .chyn-pro-connect-solution-media img{object-fit:cover;object-position:center;}
.chyn-pro-connections .chyn-pro-connect-solution-rect{height:100%;padding-bottom:0;}
.chyn-pro-connections .chyn-pro-connect-solution-img{transition:transform .55s ease;}
.chyn-pro-connections .chyn-pro-connect-solution-copy{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;padding:.35rem .32rem;}
.chyn-pro-connections .chyn-pro-connect-solution-label{color:var(--theme-color);letter-spacing:.04em;}
.chyn-pro-connections .chyn-pro-connect-solution-more{display:block;color:var(--theme-color);}
.chyn-pro-connections .chyn-pro-connect-solution:hover .chyn-pro-connect-solution-link{transform:translateY(-.05rem);box-shadow:0 .18rem .4rem rgba(8,27,39,.14);}
.chyn-pro-connections .chyn-pro-connect-solution:hover .chyn-pro-connect-solution-img{transform:scale(1.045);}
.chyn-pro-connections .chyn-pro-connect-case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.3rem;}
.chyn-pro-connections .chyn-pro-connect-case-link{position:relative;display:block;overflow:hidden;border-radius:.1rem;background:#10242e;box-shadow:0 .12rem .32rem rgba(7,25,37,.12);}
.chyn-pro-connections .chyn-pro-connect-case-mask{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,20,29,.04) 30%,rgba(5,20,29,.9) 100%);}
.chyn-pro-connections .chyn-pro-connect-case-img{transition:transform .6s ease;}
.chyn-pro-connections .chyn-pro-connect-case-copy{position:absolute;left:.38rem;right:.38rem;bottom:.34rem;z-index:2;}
.chyn-pro-connections .chyn-pro-connect-case-label{color:#75dfc8;letter-spacing:.04em;}
.chyn-pro-connections .chyn-pro-connect-case-desc{max-width:6rem;color:rgba(255,255,255,.74);}
.chyn-pro-connections .chyn-pro-connect-case-arrow{display:flex;width:.52rem;height:.52rem;align-items:center;justify-content:center;margin-top:.22rem;border-radius:50%;background:var(--theme-color);color:#fff;transition:background-color .3s ease,color .3s ease,transform .3s ease;}
.chyn-pro-connections .chyn-pro-connect-case:hover .chyn-pro-connect-case-img{transform:scale(1.05);}
.chyn-pro-connections .chyn-pro-connect-case:hover .chyn-pro-connect-case-arrow{background:#fff;color:var(--theme-color);transform:translateX(.05rem);}
.chyn-case-links{background:#fff;}
.chyn-case-overview:after{position:absolute;content:"";left:50%;bottom:0;width:16rem;max-width:84%;height:.01rem;transform:translateX(-50%);background:linear-gradient(90deg,rgba(0,161,128,0),rgba(0,161,128,.28) 22%,rgba(0,161,128,.28) 78%,rgba(0,161,128,0));}
.chyn-case-overview .chyn-case-overview-inner{position:relative;}
.chyn-case-overview .chyn-case-overview-label{color:var(--theme-color);letter-spacing:.06em;}
.chyn-case-overview .chyn-case-overview-content{max-width:13.6rem;}
.chyn-case-overview .chyn-case-overview-content>h2:first-child{margin-top:.2rem;}
.chyn-case-links{position:relative;background:linear-gradient(180deg,#fff 0%,#f6f9f9 14%,#f5f7f8 100%);}
.chyn-case-links:before{position:absolute;content:"";left:50%;top:0;width:16rem;max-width:84%;height:1.2rem;transform:translate(-50%,-1px);background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,0));pointer-events:none;}
.chyn-case-links .chyn-case-links-heading{width:8.8rem;max-width:60%;}
.chyn-case-links .chyn-case-links-intro{width:5.3rem;max-width:37%;}
.chyn-case-links .chyn-case-links-layout{display:block;}
.chyn-case-links .chyn-case-link-solutions,.chyn-case-links .chyn-case-link-products{min-width:0;}
.chyn-case-links .chyn-case-link-products{margin-top:.7rem;}
.chyn-case-links .chyn-case-link-col-head{gap:.25rem;}
.chyn-case-links .chyn-case-link-all{color:var(--theme-color);}
.chyn-case-links .chyn-case-link-all,.chyn-case-links .chyn-case-link-solution-more,.chyn-case-links .chyn-case-link-product-more,.chyn-case-cta .chyn-btn{display:inline-flex;align-items:center;gap:.08rem;}
.chyn-case-links .chyn-case-link-icon,.chyn-case-cta .chyn-case-link-icon{width:.22rem;height:.22rem;flex:0 0 .22rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s ease;}
.chyn-case-links a:hover .chyn-case-link-icon,.chyn-case-cta .chyn-btn:hover .chyn-case-link-icon{transform:translateX(.05rem);}
.chyn-case-links .chyn-case-link-solution-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.3rem;}
.chyn-case-links .chyn-case-link-solution-anchor{display:grid;grid-template-columns:47% 53%;min-height:3.95rem;overflow:hidden;border-radius:.1rem;background:#f5f7f8;color:#17202a;box-shadow:0 .1rem .28rem rgba(8,27,39,.07);transition:transform .35s ease,box-shadow .35s ease;}
.chyn-case-links .chyn-case-link-solution-media{overflow:hidden;}
.chyn-case-links .chyn-case-link-solution-media>.rect-60{height:100%;padding-bottom:0;}
.chyn-case-links .chyn-case-link-solution-media img{object-fit:cover;object-position:center;}
.chyn-case-links .chyn-case-link-solution-rect{height:100%;padding-bottom:0;}
.chyn-case-links .chyn-case-link-solution-img{transition:transform .55s ease;}
.chyn-case-links .chyn-case-link-solution-copy{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;padding:.36rem .34rem;background-color: #fff;}
.chyn-case-links .chyn-case-link-solution-label,.chyn-case-links .chyn-case-link-solution-more{color:var(--theme-color);}
.chyn-case-links .chyn-case-link-solution-label{letter-spacing:.04em;}
.chyn-case-links .chyn-case-link-solution-more{display:block;}
.chyn-case-links .chyn-case-link-solution:hover .chyn-case-link-solution-anchor{transform:translateY(-.05rem);box-shadow:0 .18rem .4rem rgba(8,27,39,.13);}
.chyn-case-links .chyn-case-link-solution:hover .chyn-case-link-solution-img{transform:scale(1.045);}
.chyn-case-links .chyn-case-link-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.26rem;}
.chyn-case-links .chyn-case-link-product{border-radius:.1rem;background:#fff;}
.chyn-case-links .chyn-case-link-product-anchor{display:block;height:100%;color:#17202a;border-radius:.1rem;background:#fff;box-shadow:0 .08rem .24rem rgba(8,27,39,.06);transition:transform .35s ease,box-shadow .35s ease;}
.chyn-case-links .chyn-case-link-product-media{overflow:hidden;border-radius:.1rem .1rem 0 0;background:#fff;}
.chyn-case-links .chyn-case-link-product-img{/* object-fit:contain; */transition:transform .55s ease;}
.chyn-case-links .chyn-case-link-product-title{display:-webkit-box;min-height:2.6em;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;}
.chyn-case-links .chyn-case-link-product-more{color:var(--theme-color);}
.chyn-case-links .chyn-case-link-product:hover .chyn-case-link-product-anchor{transform:translateY(-.05rem);box-shadow:0 .17rem .36rem rgba(8,27,39,.12);}
.chyn-case-links .chyn-case-link-product:hover .chyn-case-link-product-img{transform:scale(1.035);}
/* CHYN inner-page fixed full-width navigation */
@media all and (min-width:1001px) {
/* Apply the inner-page navigation before public.js is ready, preventing a first-paint flash of the home header. */
body:has(.chyn-ban),
body:has(.chyn-service-page),
body:has(.chyn-case-detail),
body:has(.chyn-pro-detail),
body:has(.chyn-about-page),
body:has(.chyn-product-guide-page),
body:has(.chyn-sol-detail),
body:has(.chyn-contact-page),
body:has(.chyn-news-page),
body:has(.chyn-faq-page),
body:has(.chyn-download-page),
body:has(.chyn-video-page),
body:has(.chyn-case-page),
body:has(.chyn-pro-page),
body:has(.chyn-oem-page) {
overflow-x: clip;
}
body:has(.chyn-ban) .Header-wrapper,
body:has(.chyn-service-page) .Header-wrapper,
body:has(.chyn-case-detail) .Header-wrapper,
body:has(.chyn-pro-detail) .Header-wrapper,
body:has(.chyn-about-page) .Header-wrapper,
body:has(.chyn-product-guide-page) .Header-wrapper,
body:has(.chyn-sol-detail) .Header-wrapper,
body:has(.chyn-contact-page) .Header-wrapper,
body:has(.chyn-news-page) .Header-wrapper,
body:has(.chyn-faq-page) .Header-wrapper,
body:has(.chyn-download-page) .Header-wrapper,
body:has(.chyn-video-page) .Header-wrapper,
body:has(.chyn-case-page) .Header-wrapper,
body:has(.chyn-pro-page) .Header-wrapper,
body:has(.chyn-oem-page) .Header-wrapper {
top: 0;
background: rgba(5, 20, 29, .14);
box-shadow: inset 0 -.01rem 0 rgba(255, 255, 255, .14);
-webkit-backdrop-filter: blur(.14rem) saturate(1.08);
backdrop-filter: blur(.14rem) saturate(1.08);
}
body:has(.chyn-ban) .Header-wrapper .Header-container,
body:has(.chyn-service-page) .Header-wrapper .Header-container,
body:has(.chyn-case-detail) .Header-wrapper .Header-container,
body:has(.chyn-pro-detail) .Header-wrapper .Header-container,
body:has(.chyn-about-page) .Header-wrapper .Header-container,
body:has(.chyn-product-guide-page) .Header-wrapper .Header-container,
body:has(.chyn-sol-detail) .Header-wrapper .Header-container,
body:has(.chyn-contact-page) .Header-wrapper .Header-container,
body:has(.chyn-news-page) .Header-wrapper .Header-container,
body:has(.chyn-faq-page) .Header-wrapper .Header-container,
body:has(.chyn-download-page) .Header-wrapper .Header-container,
body:has(.chyn-video-page) .Header-wrapper .Header-container,
body:has(.chyn-case-page) .Header-wrapper .Header-container,
body:has(.chyn-pro-page) .Header-wrapper .Header-container,
body:has(.chyn-oem-page) .Header-wrapper .Header-container {
width: 100%;
max-width: none;
min-height: 1rem;
padding: 0 .8rem;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
body:has(.chyn-ban) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-service-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-case-detail) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-pro-detail) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-about-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-product-guide-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-sol-detail) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-contact-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-news-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-faq-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-download-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-video-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-case-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-pro-page) .Header-wrapper .Header-container .logo a img,
body:has(.chyn-oem-page) .Header-wrapper .Header-container .logo a img { display: block; }
body:has(.chyn-ban) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-service-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-case-detail) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-pro-detail) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-about-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-product-guide-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-sol-detail) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-contact-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-news-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-faq-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-download-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-video-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-case-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-pro-page) .Header-wrapper .Header-container .logo a img + img,
body:has(.chyn-oem-page) .Header-wrapper .Header-container .logo a img + img { display: none; }
body:has(.chyn-ban) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-ban) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-ban) .Header-wrapper .Header-container .tool,
body:has(.chyn-service-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-service-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-service-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-case-detail) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-case-detail) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-case-detail) .Header-wrapper .Header-container .tool,
body:has(.chyn-pro-detail) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-pro-detail) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-pro-detail) .Header-wrapper .Header-container .tool,
body:has(.chyn-about-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-about-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-about-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-product-guide-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-product-guide-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-product-guide-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-sol-detail) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-sol-detail) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-sol-detail) .Header-wrapper .Header-container .tool,
body:has(.chyn-contact-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-contact-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-contact-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-news-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-news-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-news-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-faq-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-faq-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-faq-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-download-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-download-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-download-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-video-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-video-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-video-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-case-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-case-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-case-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-pro-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-pro-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-pro-page) .Header-wrapper .Header-container .tool,
body:has(.chyn-oem-page) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-oem-page) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-oem-page) .Header-wrapper .Header-container .tool { color: #fff; }
body:has(.chyn-ban) .chyn-ban.mt,
body:has(.chyn-service-page) main.mt,
body:has(.chyn-case-detail) main.mt,
body:has(.chyn-pro-detail) main.mt,
body:has(.chyn-about-page) main.mt,
body:has(.chyn-product-guide-page) main.mt,
body:has(.chyn-sol-detail) main.mt,
body:has(.chyn-contact-page) main.mt,
body:has(.chyn-news-page) main.mt,
body:has(.chyn-faq-page) main.mt,
body:has(.chyn-download-page) main.mt,
body:has(.chyn-video-page) main.mt,
body:has(.chyn-case-page) main.mt,
body:has(.chyn-pro-page) main.mt,
body:has(.chyn-oem-page) .chyn-oem-hero.mt { margin-top: 0; }
body.chyn-inner-fixed-nav .Header-wrapper {
top: 0;
background: rgba(5, 20, 29, .14);
box-shadow: inset 0 -.01rem 0 rgba(255, 255, 255, .14);
-webkit-backdrop-filter: blur(.14rem) saturate(1.08);
backdrop-filter: blur(.14rem) saturate(1.08);
}
body.chyn-inner-fixed-nav .Header-wrapper .Header-container {
width: 100%;
max-width: none;
min-height: 1rem;
padding: 0 .8rem;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
body.chyn-inner-fixed-nav .Header-wrapper .Header-container .logo a img {
display: block;
}
body.chyn-inner-fixed-nav .Header-wrapper .Header-container .logo a img + img {
display: none;
}
body.chyn-inner-fixed-nav .Header-wrapper .Header-container .c-nav > li .c-title-box,
body.chyn-inner-fixed-nav .Header-wrapper .Header-container .c-nav > li > a,
body.chyn-inner-fixed-nav .Header-wrapper .Header-container .tool {
color: #fff;
}
body.chyn-inner-fixed-nav .Header-wrapper .Header-container .tool .search {
border-color: rgba(255, 255, 255, .72);
}
body.chyn-inner-fixed-nav .Header-wrapper.on {
background: #fff;
box-shadow: 0 .03rem .14rem rgba(7, 19, 27, .08);
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
body.chyn-inner-fixed-nav .Header-wrapper.on .Header-container {
background: #fff;
}
body.chyn-inner-fixed-nav .Header-wrapper.on .Header-container .logo a img {
display: none;
}
body.chyn-inner-fixed-nav .Header-wrapper.on .Header-container .logo a img + img {
display: block;
}
body.chyn-inner-fixed-nav .Header-wrapper.on .Header-container .c-nav > li .c-title-box,
body.chyn-inner-fixed-nav .Header-wrapper.on .Header-container .c-nav > li > a,
body.chyn-inner-fixed-nav .Header-wrapper.on .Header-container .tool {
color: #111827;
}
body.chyn-inner-fixed-nav .Header-wrapper.on .Header-container .tool .search {
border-color: #333;
color: #000;
}
body.chyn-inner-fixed-nav .chyn-ban.mt,
body.chyn-inner-fixed-nav main.mt,
body.chyn-inner-fixed-nav .chyn-oem-hero.mt {
margin-top: 0;
}
}
/* Detail pages without a hero image keep the navigation readable and clear the fixed header. */
@media all and (min-width:1001px) {
body:has(.chyn-detail-no-banner) .Header-wrapper,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) .Header-wrapper {
top: 0;
background: #fff;
box-shadow: 0 .03rem .14rem rgba(7,19,27,.08);
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
body:has(.chyn-detail-no-banner) .Header-wrapper .Header-container,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) .Header-wrapper .Header-container {
width: 100%;
max-width: none;
min-height: 1rem;
padding: 0 .6rem;
border: 0;
border-radius: 0;
background: #fff;
box-shadow: none;
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
body:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .logo a img,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .logo a img { display: none; }
body:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .logo a img + img,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .logo a img + img { display: block; }
body:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .c-nav > li > a,
body:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .tool,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .c-nav > li .c-title-box,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .c-nav > li > a,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .tool { color: #111827; }
body:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .tool .search,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) .Header-wrapper .Header-container .tool .search { border-color: #333; }
body:has(.chyn-detail-no-banner) main.chyn-detail-no-banner,
body.chyn-inner-fixed-nav:has(.chyn-detail-no-banner) main.chyn-detail-no-banner { margin-top: 1rem; }
}
/* ================= CHYN responsive refinement =================
Keep the desktop composition intact while giving the 1366px laptop and
375px phone layouts their own readable rhythm and touch-safe controls. */
@media screen and (max-width: 1360px) and (min-width: 1001px) {
.w16 { width: calc(100% - .72rem); }
.w18 { width: calc(100% - .72rem); }
.Header-container .c-nav > li { margin-right: .28rem; }
.Header-container .c-nav { font-size: var(--f18); }
.chyn-header-inquiry { padding-left: .14rem; padding-right: .14rem; }
.chyn-home-a .chyn-home-hero-copy { padding-left: .42rem; }
.chyn-home-section-head { gap: .28rem; }
.chyn-home-section-title { max-width: 9rem; }
.chyn-home-case-stage-tabs { width: 4.5rem; }
.chyn-home-a .chyn-home-case-stage-copy { bottom: .35rem; }
}
/* Footer accordion is a real disclosure control on phones, while desktop
keeps the familiar multi-column footer fully expanded. */
.chyn-footer-nav-toggle { display: none; border: 0; background: transparent; color: inherit; cursor: pointer; }
.chyn-footer-nav-toggle i { display: block; transition: transform .26s ease; }
.chyn-footer-nav-group.is-open .chyn-footer-nav-toggle i { transform: rotate(180deg); }
@media screen and (max-width: 767px) {
:root { --sp-100: 50px; }
/* body {
--f14: 14px; --f16: 16px; --f18: 18px; --f20: 20px; --f22: 22px;
--f24: 24px; --f26: 26px; --f28: 28px; --f30: 30px; --f32: 32px;
--f34: 32px; --f36: 34px; --f38: 34px; --f40: 36px; --f42: 36px;
--f44: 38px; --f46: 38px; --f48: 40px; --f50: 40px; --f52: 42px;
--f54: 42px; --f56: 44px; --f58: 44px; --f60: 44px; --f80: 54px;
} */
/* .w14, .w15, .w16, .w18 { width: calc(100% - 32px); max-width: none; } */
html, body { overflow-x: hidden; }
.tc_search, .tc_search .cell_mid, .tc_search .cell_h { width: 100%; max-width: 100%; overflow: hidden; }
.tc_search form { width: calc(100% - 32px); max-width: calc(100% - 32px); }
/* Fixed header: preserve a compact brand row and 44px touch targets. */
.Header-wrapper, .Header-wrapper.on { top: 0; min-height: 60px; background: #fff; box-shadow: 0 2px 12px rgba(17,24,39,.08); }
.Header-container, .Header-wrapper.on .Header-container { width: 100%; max-width: none; min-height: 60px; padding: 0 16px; border-radius: 0; background: #fff; }
.Header-container .logo a img, .Header-container .logo a img + img { height: 28px; }
.Header-container .logo a img { display: none; }
.Header-container .logo a img + img { display: block; }
.Header-container .fr { min-width: 0; gap: 8px; }
.Header-container .tool { padding-right: 0; gap: 8px; color: #111827; }
.Header-container .tool .search { width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; border: 1px solid #d7e1df; border-radius: 50%; }
.Header-container .tool .search i { font-size: 20px; }
.chyn-header-inquiry { display: none; }
#c-header .c-switch { width: 44px; height: 44px; padding: 12px 10px; display: flex; flex-direction: column; justify-content: center; gap: 0; }
#c-header .c-switch i { width: 24px; height: 2px; margin: 0; top: auto; bottom: auto; background: #17202a; }
#c-header .c-nav { top: 60px; height: 0; max-height: calc(100vh - 60px); padding-bottom: 12px; background: #fff; box-shadow: 0 14px 24px rgba(17,24,39,.08); }
.c-open #c-header .c-nav { height: calc(100vh - 60px); }
#c-header .c-nav > li { min-height: 52px; padding: 0 16px; border-top: 1px solid #edf1f1; line-height: 52px; }
#c-header .c-nav > li > a, #c-header .c-nav li .c-title-box > a { min-height: 52px; display: flex; align-items: center; font-size: 16px; color: #17202a; }
#c-header .c-nav li .c-title-box { min-height: 52px; }
#c-header .c-nav li i { width: 44px; height: 44px; line-height: 44px; font-size: 18px; }
#c-header .c-nav li ul { padding: 0 0 6px 14px; }
#c-header .c-nav li ul li { min-height: 44px; padding: 0; border: 0; line-height: 44px; }
#c-header .c-nav li ul li a { min-height: 44px; font-size: 16px; color: #5e6b70; }
.chyn-product-mega { display: none !important; }
/* Shared page rhythm and headings. */
.chyn-page-section { padding: 56px 0; }
.chyn-page-title, .chyn-home-section-title { font-size: 32px; line-height: 1.15; letter-spacing: -.02em; }
.chyn-page-intro, .chyn-home-section-desc { margin-top: 14px; font-size: 16px; line-height: 1.65; }
.chyn-inner-banner { min-height: 420px; }
.chyn-inner-banner-inner { padding: 128px 16px 48px; }
.chyn-inner-banner-title { max-width: 100%; font-size: 36px; line-height: 1.12; overflow-wrap: anywhere; }
.chyn-inner-banner-desc { max-width: 100%; margin-top: 16px; font-size: 16px; line-height: 1.6; }
.chyn-inner-subnav .w16 { width: calc(100% - 32px); min-height: 58px; }
.chyn-inner-subnav .sort_nav_view ul { gap: 2px 16px; }
.chyn-inner-subnav .sort_nav_view ul li a { line-height: 42px; font-size: 16px; }
.chyn-crumb { padding: 12px 0; font-size: 14px; line-height: 1.5; }
main.chyn-detail-no-banner { margin-top: 60px; }
.chyn-detail-no-banner .chyn-crumb { margin-top: 0; }
/* Home A/B: one deliberate column, more generous breathing room, no tiny cards. */
body .chyn-home-a .chyn-home-hero, body .chyn-home-a .chyn-home-hero-inner,
body .chyn-home-b .chyn-home-hero, body .chyn-home-b .chyn-home-hero-inner { min-height: 680px; }
body .chyn-home-a .chyn-home-hero-copy, body .chyn-home-b .chyn-home-hero-copy { width: 100%; max-width: none; padding-top: 80px; }
body .chyn-home-a .chyn-home-hero-title, body .chyn-home-b .chyn-home-hero-title { max-width: 100%; font-size: 38px; line-height: 1.14; }
body .chyn-home-a .chyn-home-hero-desc, body .chyn-home-b .chyn-home-hero-desc { max-width: 100%; margin-top: 18px; font-size: 16px; line-height: 1.65; }
body .chyn-home-a .chyn-home-hero-actions, body .chyn-home-b .chyn-home-hero-actions { margin-top: 28px; gap: 10px; }
body .chyn-home-a .chyn-home-hero-nav, body .chyn-home-b .chyn-home-hero-nav { width: 44px; height: 44px; }
body .chyn-home-a .chyn-home-hero-nav { top: auto; bottom: 92px; transform: none; }
body .chyn-home-a .chyn-home-hero-prev { left: 12px; }
body .chyn-home-a .chyn-home-hero-next { right: 68px; }
body .chyn-home-a .chyn-home-hero-nav:hover { transform: translateY(-2px) scale(1.04); }
body .chyn-home-a .chyn-home-section, body .chyn-home-b .chyn-home-section { padding: 58px 0; }
body .chyn-home-a .chyn-home-section-head, body .chyn-home-b .chyn-home-section-head { display: block; }
body .chyn-home-a .chyn-home-section-head > a, body .chyn-home-b .chyn-home-section-head > a { margin-top: 22px; }
body .chyn-home-a .chyn-home-products-track, body .chyn-home-b .chyn-home-products-track { width: calc(100% - 32px); }
body .chyn-home-a .chyn-home-products, body .chyn-home-b .chyn-home-products { overflow: hidden; }
body .chyn-home-a .chyn-home-products-track, body .chyn-home-b .chyn-home-products-track { overflow: hidden; }
body .chyn-home-a .chyn-home-products-swiper, body .chyn-home-b .chyn-home-products-swiper { overflow: hidden; }
body .chyn-home-a .chyn-home-product-media, body .chyn-home-b .chyn-home-product-media { min-height: 250px; }
body .chyn-home-a .chyn-home-product-title, body .chyn-home-b .chyn-home-product-title { font-size: 22px; }
body .chyn-home-a .chyn-home-about-inner, body .chyn-home-b .chyn-home-about-inner,
body .chyn-home-a .chyn-home-solutions-inner, body .chyn-home-b .chyn-home-solutions-inner,
body .chyn-home-a .chyn-home-capability-inner, body .chyn-home-b .chyn-home-capability-inner,
body .chyn-home-a .chyn-home-cta-inner, body .chyn-home-b .chyn-home-cta-inner { display: flex; flex-direction: column; gap: 28px; }
body .chyn-home-a .chyn-home-about-copy, body .chyn-home-a .chyn-home-about-media,
body .chyn-home-b .chyn-home-about-copy, body .chyn-home-b .chyn-home-about-media { width: 100%; order: initial; }
body .chyn-home-a .chyn-home-about-media, body .chyn-home-b .chyn-home-about-media { margin-top: 0; }
body .chyn-home-a .chyn-home-cases-grid, body .chyn-home-b .chyn-home-cases-grid,
body .chyn-home-a .chyn-home-news-list, body .chyn-home-b .chyn-home-news-list { grid-template-columns: 1fr; gap: 18px; }
body .chyn-home-a .chyn-home-case-stage-heading { top: 28px; display: block; }
body .chyn-home-a .chyn-home-case-stage-heading-copy { max-width: 100%; }
body .chyn-home-a .chyn-home-case-stage-copy { left: 16px; right: 16px; bottom: 176px; width: auto; }
body .chyn-home-a .chyn-home-case-stage-tabs { left: 16px; right: 16px; bottom: 22px; top: auto; width: auto; transform: none; gap: 4px; }
body .chyn-home-a .chyn-home-case-stage-tab { min-height: 44px; grid-template-columns: minmax(0,1fr) 38px; gap: 12px; }
body .chyn-home-a .chyn-home-case-stage-tab span { font-size: 16px; }
body .chyn-home-a .chyn-home-case-stage-tab i { width: 38px; height: 38px; }
body .chyn-home-a .chyn-home-process-list, body .chyn-home-b .chyn-home-process-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 10px; }
body .chyn-home-a .chyn-home-process-icon { width: 92px; height: 92px; flex-basis: 92px; }
body .chyn-home-a .chyn-home-process-arrow { display: none; }
body .chyn-home-a .chyn-home-news-layout { grid-template-columns: 1fr; gap: 18px; }
body .chyn-home-a .chyn-home-news-feed-list { height: auto; max-height: 420px; }
body .chyn-home-a .chyn-home-news-scroll { top: 16px; bottom: 16px; }
/* Inner page grids. */
.chyn-service-copy, .chyn-service-media, .chyn-about-overview-copy, .chyn-about-overview-media,
.chyn-solution-article, .chyn-solution-aside, .chyn-news-article, .chyn-news-aside,
.chyn-contact-form-wrap, .chyn-contact-aside, .chyn-product-main { width: 100%; }
.chyn-service-media, .chyn-about-overview-media, .chyn-news-aside, .chyn-solution-aside, .chyn-contact-aside { margin-top: 28px; }
.chyn-service-grid, .chyn-video-grid, .chyn-about-facts-grid, .chyn-about-culture-grid, .chyn-product-grid, .chyn-news-grid { grid-template-columns: 1fr; gap: 18px; }
.chyn-solution-grid, .chyn-news-grid { display: block; }
.chyn-solution-card, .chyn-news-card, .chyn-product-card { margin-bottom: 18px; }
.chyn-case-grid { grid-template-columns: 1fr; gap: 18px; }
.chyn-case-detail-title { font-size: 34px; line-height: 1.18; }
/* .chyn-case-detail-head, .chyn-pro-detail-main, .chyn-news-article-head { padding-left: 16px; padding-right: 16px; } */
.chyn-news-article-body { padding-left: 16px; padding-right: 16px; }
.chyn-news-copy { padding-left: 0; }
.chyn-pro-gallery, .chyn-pro-info { width: 100%; }
.chyn-pro-info { margin-top: 28px; }
.chyn-pro-detail-table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.chyn-pro-detail-table-wrap table { min-width: 620px; }
.chyn-oem-hero-title { font-size: 36px; line-height: 1.14; }
.chyn-oem-section-title, .chyn-oem-why-title, .chyn-oem-cta-title { font-size: 30px; line-height: 1.18; }
.chyn-oem-hero-btns { flex-direction: column; align-items: stretch; }
.chyn-oem-hero-btns a { width: 100%; }
.chyn-oem-process-grid, .chyn-oem-support-grid, .chyn-oem-scope-grid, .chyn-oem-coverage-grid, .chyn-oem-adv-grid { grid-template-columns: 1fr; }
/* Footer: stacked brand/contact and disclosure rows. */
.Footer-container { width: calc(100% - 32px); }
.Footer-container .mid { display: block; padding: 48px 0 28px; }
.Footer-container .mid .fl, .Footer-container .mid .fr, .Footer-container .mid > ul { width: 100%;float: none; }
.Footer-container .mid .fl .foot_txt { max-width: 30rem; margin-top: 18px; margin-bottom: 20px; }
.Footer-container .mid > ul { display: block; margin-top: 34px; }
.Footer-container .mid > ul > li { width: 100%; max-width: none; min-width: 0; float: none; overflow: visible; }
.Footer-container .mid > ul > li + li { margin-top: 0; }
.Footer-container .mid > ul li .foot_nav_title { width: 100%; box-sizing: border-box; min-height: 52px; display: flex; align-items: center; justify-content: space-between; margin: 0; padding: 0; font-size: 20px; line-height: 1.2; border-top: 1px solid rgba(255,255,255,.13); }
.Footer-container .mid > ul li .foot_nav_title::before, .Footer-container .mid > ul li .foot_nav_title::after { display: none; }
.Footer-container .mid > ul li .foot_nav_title a { min-height: 52px; display: flex; align-items: center; }
.chyn-footer-nav-toggle { width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; font-size: 20px; color: rgba(255,255,255,.78); }
.Footer-container .mid > ul li .foot_nav_link { display: none; padding: 0 0 16px; }
.Footer-container .mid > ul li .foot_nav_link a { min-height: 42px; display: flex; align-items: center; padding: 6px 0; font-size: 16px; line-height: 1.45; }
.Footer-container .mid .fr { margin-top: 34px; }
.Footer-container .mid .fr .tit { font-size: 22px; }
.Footer-container .mid .fr .info dl { margin-top: 16px; }
.Footer-container .bot { padding: 22px 0 calc(22px + env(safe-area-inset-bottom)); line-height: 1.6; }
.chyn-footer-socials { gap: 10px; }
.chyn-footer-social { width: 44px; height: 44px; border-radius: 12px; }
.chyn-footer-social-tiktok svg,.chyn-footer-social-x svg{ width: .32rem; height: .32rem; }
.chyn-footer-social i{font-size: 0.32rem;}
.chyn-float-contact { right: 12px; bottom: calc(18px + env(safe-area-inset-bottom)); gap: 8px; }
.chyn-float-contact-link { width: 48px; height: 48px; border-radius: 14px; font-size: 22px; }
.chyn-float-contact-link::after { display: none; }
}
@media screen and (max-width: 390px) {
.Header-container, .Header-wrapper.on .Header-container { padding-left: 12px; padding-right: 12px; }
/* .w14, .w15, .w16, .w18, .Footer-container { width: calc(100% - 24px); } */
body { overflow-x: hidden; }
.tc_search, .tc_search .cell_mid, .tc_search .cell_h { width: 100%; max-width: 100%; overflow: hidden; }
.tc_search form { width: calc(100% - 32px); max-width: calc(100% - 32px); }
body .chyn-home-a .chyn-home-hero, body .chyn-home-a .chyn-home-hero-inner,
body .chyn-home-b .chyn-home-hero, body .chyn-home-b .chyn-home-hero-inner { min-height: 640px; }
body .chyn-home-a .chyn-home-hero-title, body .chyn-home-b .chyn-home-hero-title { font-size: 34px; }
body .chyn-home-a .chyn-home-section, body .chyn-home-b .chyn-home-section { padding: 48px 0; }
body .chyn-home-a .chyn-home-process-list, body .chyn-home-b .chyn-home-process-list { gap: 16px 8px; }
body .chyn-home-a .chyn-home-process-item h3 { font-size: 18px; }
.chyn-inner-banner-title { font-size: 32px; }
.chyn-case-detail-title { font-size: 30px; }
}
@media (prefers-reduced-motion: reduce) {
.chyn-footer-nav-toggle i, .Footer-container .mid > ul li .foot_nav_link { transition: none; }
}
/* Mobile header wins over the home draft's floating desktop rule. */
@media screen and (max-width: 767px) {
html body:has(.chyn-home-a) .Header-wrapper,
html body:has(.chyn-home-a) .Header-wrapper.on,
html body:has(.chyn-home-b) .Header-wrapper,
html body:has(.chyn-home-b) .Header-wrapper.on {
top: 0; position: fixed; z-index: 99; background: #fff; box-shadow: 0 2px 12px rgba(17,24,39,.08);
}
html body:has(.chyn-home-a) .Header-wrapper .Header-container,
html body:has(.chyn-home-b) .Header-wrapper .Header-container { background: #fff; }
#c-header .c-nav { height: 0; padding-bottom: 0; visibility: hidden; opacity: 0; pointer-events: none; transition: height .28s ease, opacity .2s ease, visibility .2s ease; }
body.c-open #c-header .c-nav { height: calc(100vh - 60px); padding-bottom: 12px; visibility: visible; opacity: 1; pointer-events: auto; }
#c-header .c-switch { position: relative; z-index: 3; flex: 0 0 44px; }
#c-header .c-switch i { display: block; flex: 0 0 2px; min-height: 2px; height: 2px; width: 24px; background: #17202a; }
/* INDUSTRY SOLUTIONS: one readable story card per row at phone width. */
body .chyn-home-a .chyn-home-industry-grid { grid-template-columns: 1fr; grid-template-rows: none; gap: 14px; }
body .chyn-home-a .chyn-home-industry-item,
body .chyn-home-a .chyn-home-industry-large,
body .chyn-home-a .chyn-home-industry-item:nth-child(2),
body .chyn-home-a .chyn-home-industry-item:nth-child(3),
body .chyn-home-a .chyn-home-industry-item:nth-child(4) {
grid-column: auto; grid-row: auto; min-height: 238px;
}
body .chyn-home-a .chyn-home-industry-large { min-height: 290px; }
body .chyn-home-a .chyn-home-industry-content { left: 20px; right: 20px; bottom: 20px; }
body .chyn-home-a .chyn-home-industry-content h3 { font-size: 22px; line-height: 1.2; }
body .chyn-home-a .chyn-home-industry-content > div:last-of-type { margin-top: 8px; font-size: 16px; line-height: 1.5; }
body .chyn-home-a .chyn-home-industries-v2-inner { display: block; }
body .chyn-home-a .chyn-home-industries-v2-copy,
body .chyn-home-a .chyn-home-industry-v2-panel { width: 100%; }
body .chyn-home-a .chyn-home-industry-v2-tabs { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin: 22px 0 18px; }
body .chyn-home-a .chyn-home-industry-v2-tab { min-height: 82px; padding: 12px 8px; }
body .chyn-home-a .chyn-home-industry-v2-panel { min-height: 360px; }
/* APPLICATION CASES: reserve space for copy and the right-side choices. */
body .chyn-home-a .chyn-home-case-stage,
body .chyn-home-a .chyn-home-case-stage-media { height: 720px; min-height: 720px; padding-bottom: 0; }
body .chyn-home-a .chyn-home-case-stage-heading { top: 26px; }
body .chyn-home-a .chyn-home-case-heading-title { max-width: 320px; font-size: 28px; line-height: 1.18; }
body .chyn-home-a .chyn-home-case-heading-desc { max-width: 320px; margin-top: 10px; font-size: 15px; line-height: 1.5; }
body .chyn-home-a .chyn-home-case-stage-copy { left: 16px; right: 16px; bottom: 224px; width: auto; }
body .chyn-home-a .chyn-home-case-stage-title { max-width: 320px; font-size: 24px; line-height: 1.2; }
body .chyn-home-a .chyn-home-case-stage-desc { max-width: 320px; margin-top: 10px; font-size: 16px; line-height: 1.5; }
body .chyn-home-a .chyn-home-case-results { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 16px; }
body .chyn-home-a .chyn-home-case-result { min-width: 0; min-height: 58px; padding: 10px; gap: 8px; }
body .chyn-home-a .chyn-home-case-result-icon { width: 28px; height: 28px; flex-basis: 28px; }
body .chyn-home-a .chyn-home-case-results strong { font-size: 16px; }
body .chyn-home-a .chyn-home-case-results span { font-size: 14px; line-height: 1.3; }
body .chyn-home-a .chyn-home-case-detail-btn { margin-top: 16px; }
body .chyn-home-a .chyn-home-case-stage-tabs { left: 16px; right: 16px; bottom: 20px; top: auto; width: auto; gap: 4px; transform: none; }
}
/* Responsive completion for solution, case and article detail layouts. */
.chyn-news-table-wrap { max-width: 100%; margin: .24rem 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.chyn-news-table-wrap:focus-visible { outline: .02rem solid var(--theme-color); outline-offset: .04rem; }
@media screen and (max-width: 1000px) {
.chyn-sol-list .chyn-sol-list-head { display: block; }
.chyn-sol-list .chyn-sol-list-intro { width: 100%; max-width: none; margin-top: .2rem; }
.chyn-sol-list .chyn-sol-list-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: .24rem; }
.chyn-sol-framework .chyn-sol-framework-head { display: block; }
.chyn-sol-framework .chyn-sol-framework-heading,
.chyn-sol-framework .chyn-sol-framework-intro { width: 100%; max-width: none; }
.chyn-sol-framework .chyn-sol-framework-intro { margin-top: .2rem; }
.chyn-sol-framework .chyn-sol-framework-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.chyn-sol-delivery .chyn-sol-delivery-inner { display: block; }
.chyn-sol-delivery .chyn-sol-delivery-head,
.chyn-sol-delivery .chyn-sol-delivery-steps { width: 100%; }
.chyn-sol-delivery .chyn-sol-delivery-steps { margin-top: .45rem; }
.chyn-case-links .chyn-case-links-head { display: block; }
.chyn-case-links .chyn-case-links-heading,
.chyn-case-links .chyn-case-links-intro { width: 100%; max-width: none; }
.chyn-case-links .chyn-case-links-intro { margin-top: .2rem; }
.chyn-case-links .chyn-case-link-solution-list { grid-template-columns: 1fr; }
.chyn-case-links .chyn-case-link-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media screen and (max-width: 767px) {
.chyn-product-guide-page section[id] { scroll-margin-top: 72px; }
.chyn-about-page section[id],
.chyn-sol-detail section[id] { scroll-margin-top: 118px; }
.chyn-pro-detail #inquiry { scroll-margin-top: 76px; }
.chyn-ban-crumb { width: calc(100% - 32px); top: 14px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chyn-pro-detail .chyn-pro-side { display: none; }
.chyn-news-article .chyn-news-head h1 { font-size: 28px; line-height: 1.25; }
.chyn-sol-list .chyn-sol-list-head { margin-bottom: 32px; }
.chyn-sol-list .chyn-sol-list-grid { grid-template-columns: 1fr; gap: 20px; }
.chyn-sol-list .chyn-sol-list-copy { min-height: 0; padding: 22px; }
.chyn-sol-list .chyn-sol-list-title,
.chyn-sol-list .chyn-sol-list-desc { min-height: 0; }
.chyn-sol-list .chyn-sol-list-desc { margin-top: 12px; }
.chyn-sol-list .chyn-sol-list-more { margin-top: 20px; }
.chyn-sol-hero { height: 580px; }
.chyn-sol-hero-crumb { top: 76px; font-size: 14px; }
.chyn-sol-hero-copy { top: 118px; transform: translateX(-50%); }
.chyn-sol-title,
.chyn-sol-lead { width: 100%; max-width: none; }
.chyn-sol-title { font-size: 36px; line-height: 1.12; }
.chyn-sol-lead { margin-top: 18px; font-size: 16px; line-height: 1.55; }
.chyn-sol-hero-actions { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 24px; }
.chyn-sol-hero-actions .chyn-btn,
.chyn-sol-hero-actions .chyn-sol-hero-link { width: 100%; min-height: 48px; }
.chyn-sol-nav { top: 60px; overflow-x: auto; scrollbar-width: none; }
.chyn-sol-nav::-webkit-scrollbar { display: none; }
.chyn-sol-nav .chyn-sol-nav-inner { width: max-content; min-width: 100%; height: 58px; gap: 28px; padding: 0 16px; }
.chyn-sol-nav a { min-height: 58px; white-space: nowrap; }
.chyn-sol-framework .chyn-sol-framework-grid { grid-template-columns: 1fr; gap: 16px; }
.chyn-sol-framework .chyn-sol-framework-item { padding: 24px 22px; }
.chyn-sol-delivery .chyn-sol-delivery-steps { grid-template-columns: 1fr; gap: 22px; }
.chyn-sol-delivery .chyn-sol-delivery-step { grid-template-columns: 30px minmax(0,1fr); gap: 14px; padding-bottom: 22px; }
.chyn-sol-delivery .chyn-sol-delivery-link { width: 100%; min-height: 48px; justify-content: center; }
.chyn-sol-products-head,
.chyn-sol-cases-head { display: block; }
.chyn-sol-products-head > .chyn-btn,
.chyn-sol-cases-side { margin-top: 22px; }
.chyn-sol-cases .chyn-sol-cases-heading,
.chyn-sol-cases .chyn-sol-cases-side { width: 100%; max-width: none; }
.chyn-sol-products-carousel,
.chyn-sol-cases .chyn-sol-cases-carousel { margin-right: 0; margin-left: 0; padding: 0; }
.chyn-sol-products-prev,
.chyn-sol-products-next,
.chyn-sol-cases-prev,
.chyn-sol-cases-next { width: 44px; height: 44px; }
.chyn-sol-products-prev,
.chyn-sol-cases-prev { left: 4px; }
.chyn-sol-products-next,
.chyn-sol-cases-next { right: 4px; }
.chyn-sol-cases .chyn-sol-case-copy { left: 22px; right: 22px; bottom: 22px; padding-right: 54px; }
.chyn-sol-contact { height: 520px; }
.chyn-sol-contact-copy h2 { font-size: 34px; line-height: 1.16; }
.chyn-case-links .chyn-case-links-head { margin-bottom: 32px; }
.chyn-case-links .chyn-case-link-products { margin-top: 48px; }
.chyn-case-links .chyn-case-link-col-head { align-items: flex-end; }
.chyn-case-links .chyn-case-link-all { max-width: 128px; justify-content: flex-end; text-align: right; line-height: 1.35; }
.chyn-case-links .chyn-case-link-solution-list { gap: 18px; }
.chyn-case-links .chyn-case-link-solution-anchor { display: block; min-height: 0; }
.chyn-case-links .chyn-case-link-solution-media>.rect-60 { height: 0; padding-bottom: 60%; }
.chyn-case-links .chyn-case-link-solution-copy { padding: 22px; }
.chyn-case-links .chyn-case-link-solution-title { font-size: 24px; }
.chyn-case-links .chyn-case-link-product-grid { grid-template-columns: 1fr; gap: 16px; }
.chyn-case-links .chyn-case-link-product-anchor { display: grid; grid-template-columns: 120px minmax(0,1fr); overflow: hidden; }
.chyn-case-links .chyn-case-link-product-media { border-radius: .1rem 0 0 .1rem; }
.chyn-case-links .chyn-case-link-product-rect { height: 100%; min-height: 120px; padding-bottom: 0; }
.chyn-case-links .chyn-case-link-product-copy { padding: 18px; }
.chyn-case-links .chyn-case-link-product-title { min-height: 0; font-size: 18px; }
.chyn-news-table-wrap { margin: 18px 0 24px; padding-bottom: 4px; }
.chyn-news-table-wrap table { min-width: 620px; }
.chyn-about-nav { top: 60px; }
.chyn-float-contact { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); flex-direction: row; }
body .chyn-home-a .chyn-home-slider-button { width: 44px; height: 44px; }
body .chyn-home-a .chyn-home-products-prev { left: 8px; }
body .chyn-home-a .chyn-home-products-next { right: 8px; }
}
/* CHYN page-scoped responsive refinements. Keep shared spacing and font tokens unchanged. */
.chyn-product-guide-page .chyn-product-guide-nav-link { grid-template-columns: minmax(0,1fr) .68rem; gap: .18rem; }
.chyn-product-guide-page .chyn-product-guide-nav-icon { width: .64rem; min-width: .64rem; height: .64rem; flex: 0 0 .64rem; }
.chyn-product-guide-page .chyn-product-guide-nav-icon img { width: .5rem; height: .5rem; flex: 0 0 .5rem; }
.chyn-product-guide-page .chyn-product-guide-section-icon { width: .66rem; min-width: .66rem; height: .66rem; flex: 0 0 .66rem; }
.chyn-product-guide-page .chyn-product-guide-section-icon img { width: .44rem; height: .44rem; flex: 0 0 .44rem; }
.chyn-product-guide-page .chyn-product-guide-section-title { min-width: 0; }
.chyn-product-guide-page .chyn-product-guide-card-desc { max-width: calc(100% - .58rem); }
.chyn-product-guide-page .chyn-product-guide-card-arrow { width: .44rem; min-width: .44rem; height: .44rem; flex: 0 0 .44rem; transition: background-color .3s ease,color .3s ease,transform .3s ease; }
.chyn-product-guide-page .chyn-product-guide-card-arrow svg { width: .22rem; height: .22rem; flex: 0 0 .22rem; stroke-width: 1.8; }
.chyn-product-guide-page .chyn-product-guide-card:hover .chyn-product-guide-card-arrow { transform: translateX(.03rem); }
@media screen and (max-width: 1000px) {
body.c-open { overflow: hidden; }
#c-header .c-nav li .c-title-box > .chyn-nav-toggle { position: relative; width: .74rem; min-width: .74rem; height: .74rem; padding: 0; color: transparent; font-size: 0; line-height: .74rem; cursor: pointer; transform: none; }
#c-header .c-nav li .c-title-box > .chyn-nav-toggle::before { content: ""; position: absolute; left: 50%; top: 50%; width: .14rem; height: .14rem; border-right: .025rem solid #536168; border-bottom: .025rem solid #536168; transform: translate(-50%,-68%) rotate(45deg); transition: border-color .25s ease,transform .25s ease; }
#c-header .c-nav li.on > .c-title-box > .chyn-nav-toggle { transform: none; }
#c-header .c-nav li.on > .c-title-box > .chyn-nav-toggle::before { border-color: var(--theme-color); transform: translate(-50%,-30%) rotate(225deg); }
#c-header .c-nav li .c-title-box > .chyn-nav-toggle:focus-visible { outline: .025rem solid var(--theme-color); outline-offset: -.08rem; border-radius: 50%; }
#c-header .c-nav > li > ul { width: 100%; }
#c-header .c-nav .chyn-product-mobile-nav { padding: 0 0 .14rem .22rem; }
#c-header .c-nav .chyn-product-mobile-nav li { min-height: 0; padding: 0; border: 0; line-height: normal; }
#c-header .c-nav .chyn-product-mobile-nav li a { min-height: .74rem; display: flex; align-items: center; padding: .1rem 0; line-height: 1.4; }
body.c-open #c-header .c-nav > li.chyn-product-nav.on > .chyn-product-mega { display: none !important; }
#c-header .c-nav .chyn-product-mega { position: static; width: 100%; height: auto; margin: 0; padding: 0; background: transparent; box-shadow: none; }
#c-header .c-nav .chyn-product-mega-inner { display: block; width: 100%; height: auto; min-height: 0; overflow: visible; }
#c-header .c-nav .chyn-product-mega-categories-shell { width: 100%; min-height: 0; background: transparent; box-shadow: none; }
#c-header .c-nav .chyn-product-mega-categories { height: auto; padding: 0 0 .16rem .22rem; overflow: visible; }
#c-header .c-nav .chyn-product-mega-label,
#c-header .c-nav .chyn-product-mega-content,
#c-header .c-nav .chyn-scroll-track,
#c-header .c-nav .chyn-product-mega-tab-arrow { display: none; }
#c-header .c-nav .chyn-product-mega-tab { width: 100%; min-height: .74rem; padding: .08rem 0; color: #5e6b70; background: transparent; box-shadow: none; transform: none; }
#c-header .c-nav .chyn-product-mega-tab + .chyn-product-mega-tab { margin-top: 0; }
}
@media screen and (max-width: 767px) {
/* Product guide: preserve icon scale when category names wrap. */
.chyn-product-guide-page .chyn-product-guide-nav-link { min-height: .94rem; grid-template-columns: minmax(0,1fr) .64rem; }
.chyn-product-guide-page .chyn-product-guide-nav-icon { width: .64rem; min-width: .64rem; height: .64rem; }
.chyn-product-guide-page .chyn-product-guide-nav-icon img { width: .46rem; height: .46rem; flex-basis: .46rem; }
.chyn-product-guide-page .chyn-product-guide-section-icon { width: .9rem; min-width: .9rem; height: .9rem; flex-basis: .9rem; border-radius: .14rem; }
.chyn-product-guide-page .chyn-product-guide-section-icon img { width: .64rem; height: .64rem; flex-basis: .64rem; }
.chyn-product-guide-page .chyn-product-guide-section-icon i { font-size: .42rem; }
.chyn-product-guide-page .chyn-product-guide-card-arrow { width: .72rem; min-width: .72rem; height: .72rem; flex-basis: .72rem; }
.chyn-product-guide-page .chyn-product-guide-card-arrow svg { width: .34rem; height: .34rem; flex-basis: .34rem; }
/* Home hero and project delivery: balanced phone composition. */
body .chyn-home-a .chyn-home-hero,
body .chyn-home-a .chyn-home-hero-slide,
body .chyn-home-a .chyn-home-hero-inner { height: max(9.6rem,calc(100svh - 60px)); min-height: 9.6rem; }
body .chyn-home-a .chyn-home-hero-shade { position: absolute; inset: 0; display: block; background: linear-gradient(180deg,rgba(7,24,31,.15) 0%,rgba(7,24,31,.18) 28%,rgba(7,24,31,.68) 100%),linear-gradient(90deg,rgba(7,24,31,.48),rgba(7,24,31,.04)); }
body .chyn-home-a .chyn-home-hero-inner { display: flex; align-items: center; padding-top: .8rem; padding-bottom: 1.35rem; }
body .chyn-home-a .chyn-home-hero-copy { width: 100%; max-width: none; padding-top: 0; padding-left: 0; }
body .chyn-home-a .chyn-home-hero-kicker { margin-bottom: .26rem; font-size: var(--f14); line-height: 1.35; }
body .chyn-home-a .chyn-home-hero-title { max-width: 100%; font-size: .62rem; line-height: 1.14; }
body .chyn-home-a .chyn-home-hero-desc { max-width: 100%; margin-top: .28rem; font-size: var(--f16); line-height: 1.62; }
body .chyn-home-a .chyn-home-hero-actions { margin-top: .36rem; }
body .chyn-home-a .chyn-home-news-feature-title,
body .chyn-home-a .chyn-home-news-feed-item > strong {
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
body .chyn-home-a .chyn-home-hero-actions .chyn-home-btn { min-height: .92rem; padding: .2rem .32rem; border-radius: .1rem; }
body .chyn-home-a .chyn-home-hero-nav { width: .88rem; height: .88rem; bottom: 1.44rem; }
body .chyn-home-a .chyn-home-hero-prev { left: .27rem; }
body .chyn-home-a .chyn-home-hero-next { right: .27rem; }
body .chyn-home-a .chyn-home-hero-pagination { bottom: 1.66rem !important; }
body .chyn-home-a .chyn-home-process-list { gap: .4rem .2rem; }
body .chyn-home-a .chyn-home-process-item { padding-right: 0; padding-left: 0; }
body .chyn-home-a .chyn-home-process-top { min-height: 2.16rem; }
body .chyn-home-a .chyn-home-process-icon { width: 2.08rem; height: 2.08rem; flex-basis: 2.08rem; }
body .chyn-home-a .chyn-home-process-svg { width: .76rem; height: .76rem; }
body .chyn-home-a .chyn-home-process-item h3 { margin-top: .22rem; font-size: var(--f18); line-height: 1.35; }
body .chyn-home-a .chyn-home-process-item > div:last-child { width: 100%; max-width: none; margin-top: .12rem; font-size: var(--f14); line-height: 1.55; }
/* Solution detail: full content width and content-driven CTA height. */
.chyn-sol-detail .chyn-sol-overview-inner { display: block; }
.chyn-sol-detail .chyn-sol-article,
.chyn-sol-detail .chyn-sol-aside { width: 100%; max-width: none; flex: 0 0 100%; box-sizing: border-box; }
.chyn-sol-detail .chyn-sol-aside { position: static; margin-top: .5rem; padding: .42rem .34rem; }
.chyn-sol-detail .chyn-sol-contact { height: auto; min-height: 0; padding: 1.08rem 0; }
.chyn-sol-detail .chyn-sol-contact-copy { position: relative; left: auto; top: auto; transform: none; }
.chyn-sol-detail .chyn-sol-contact-copy h2 { font-size: .5rem; line-height: 1.18; }
/* Service page: page-scoped rules override the heavier desktop selectors. */
.chyn-service-page .chyn-service-nav { width: calc(100% - .54rem); max-width: none; overflow-x: auto; scrollbar-width: none; }
.chyn-service-page .chyn-service-nav::-webkit-scrollbar { display: none; }
.chyn-service-page .chyn-service-nav .w16 { width: max-content; min-width: 100%; height: .88rem; box-sizing: border-box; gap: .46rem; padding: 0 .28rem; }
.chyn-service-page .chyn-service-nav a { min-height: .88rem; }
.chyn-service-page .chyn-service-copy,
.chyn-service-page .chyn-service-media { width: 100%; max-width: 100%; flex: 0 0 100%; }
.chyn-service-page .chyn-service-media { margin-top: .46rem; }
.chyn-service-page .chyn-service-lines a { width: 100%; align-items: flex-start; overflow-wrap: anywhere; line-height: 1.5; }
.chyn-service-page .chyn-service-lines i { flex: 0 0 .68rem; width: .68rem; height: .68rem; }
.chyn-service-page .chyn-service-adv-grid { grid-template-columns: 1fr; gap: .24rem; }
.chyn-service-page .chyn-service-adv-grid article { display: grid; grid-template-columns: .82rem minmax(0,1fr); gap: .08rem .28rem; align-items: start; padding: .38rem .34rem; text-align: left; }
.chyn-service-page .chyn-service-adv-grid article > i { grid-row: 1 / span 2; display: flex; width: .82rem; height: .82rem; align-items: center; justify-content: center; border-radius: 50%; background: #e9f7f4; font-size: var(--f28); }
.chyn-service-page .chyn-service-adv-grid article > span { display: none; }
.chyn-service-page .chyn-service-adv-grid h3 { margin-bottom: .08rem; line-height: 1.3; }
.chyn-service-page .chyn-service-contact > .w16 { display: block; }
.chyn-service-page .chyn-service-contact-copy,
.chyn-service-page .chyn-service-form { width: 100%; max-width: 100%; }
.chyn-service-page .chyn-service-form { margin-top: .52rem; }
.chyn-service-page .chyn-service-form-grid { grid-template-columns: 1fr; gap: .32rem; }
.chyn-service-page .chyn-service-form-wide { grid-column: auto; }
.chyn-service-page .chyn-service-form input,
.chyn-service-page .chyn-service-form select { min-height: .8rem; padding: .14rem 0; }
.chyn-service-page .chyn-service-form textarea { min-height: 2.35rem; padding: .18rem 0; }
.chyn-service-page .chyn-service-form .chyn-btn { width: 100%; min-height: .8rem; }
.chyn-service-page .chyn-service-resource-grid { grid-template-columns: 1fr; gap: .28rem; }
.chyn-service-page .chyn-service-resource { width: 100%; height: 3.7rem; }
.chyn-service-page .chyn-service-resource-copy { left: .36rem; right: .36rem; bottom: .34rem; }
.chyn-service-page .chyn-service-resource-copy h2 { max-width: calc(100% - .8rem); font-size: .42rem; }
.chyn-service-page .chyn-service-resource-copy div { max-width: calc(100% - .8rem); }
.chyn-service-page .chyn-service-resource-copy i { right: 0; bottom: .04rem; font-size: .42rem; }
/* Home application cases: separate the section introduction, active case copy
and case selector into three readable phone zones. */
body .chyn-home-a .chyn-home-case-stage,
body .chyn-home-a .chyn-home-case-stage-media { height: 15.8rem; min-height: 15.8rem; }
body .chyn-home-a .chyn-home-case-stage-copy { top: 4.9rem; bottom: auto; }
body .chyn-home-a .chyn-home-case-stage-tabs {
bottom: .32rem;
display: flex;
max-height: 1.32rem;
flex-direction: row;
gap: .2rem;
overflow-x: auto;
overflow-y: hidden;
scrollbar-width: none;
}
body .chyn-home-a .chyn-home-case-stage-tabs::-webkit-scrollbar { display: none; }
body .chyn-home-a .chyn-home-case-stage-tab {
min-height: 1.08rem;
flex: 0 0 5.4rem;
grid-template-columns: minmax(0,1fr) .56rem;
gap: .18rem;
padding: .14rem .18rem;
border-radius: .08rem;
background: rgba(7,24,31,.42);
text-align: left;
-webkit-backdrop-filter: blur(.08rem);
backdrop-filter: blur(.08rem);
}
body .chyn-home-a .chyn-home-case-stage-tab.is-active { background: rgba(0,161,128,.78); }
body .chyn-home-a .chyn-home-case-stage-tab span { font-size: var(--f16); }
body .chyn-home-a .chyn-home-case-stage-tab i { width: .56rem; height: .56rem; }
/* Inner-page phone hierarchy and touch sizing. These selectors remain
scoped to CHYN page components and do not alter shared font tokens. */
.chyn-ban .chyn-ban-copy h1,
.chyn-service-page .chyn-service-ban-copy h1 { font-size: .5rem; line-height: 1.2; }
.chyn-case-detail h1 { font-size: .5rem; line-height: 1.22; }
/* .chyn-pro-detail h1 { font-size: .48rem; line-height: 1.25; } */
.chyn-product-guide-page .chyn-product-guide-card-arrow { width: .84rem; min-width: .84rem; height: .84rem; flex-basis: .84rem; }
.chyn-product-guide-page .chyn-product-guide-card-arrow svg { width: .38rem; height: .38rem; flex-basis: .38rem; }
.chyn-product-guide-page .chyn-product-guide-view,
.chyn-sol-detail .chyn-btn,
.chyn-sol-detail .chyn-sol-aside-action,
.chyn-case-detail .chyn-btn,
.chyn-download-page .chyn-download-btn,
.chyn-contact-page .chyn-btn,
.chyn-oem-page .chyn-oem-btn {
min-height: .88rem;
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: .14rem .32rem;
line-height: 1.3;
}
.chyn-product-guide-view{
padding: 0.1rem 0.36rem;
border-radius: 1rem;
}
.chyn-contact-page input,
.chyn-contact-page select { min-height: .88rem; padding: .14rem .18rem; box-sizing: border-box; }
.chyn-contact-page textarea { min-height: 3.1rem; padding: .18rem; box-sizing: border-box; }
.chyn-about-page .chyn-about-overview-play { width: .9rem; height: .9rem; }
.chyn-about-page .chyn-about-exhibition-feature { display: block; }
.chyn-about-page .chyn-about-exhibition-media,
.chyn-about-page .chyn-about-exhibition-content { width: 100%; max-width: none; }
.chyn-about-page .chyn-about-exhibition-content { margin-top: .42rem; padding-top: 0; }
.chyn-about-page .chyn-about-exhibition-name { font-size: .46rem; line-height: 1.25; }
.chyn-about-page .chyn-about-exhibition-desc { margin-top: .24rem; }
.chyn-about-page .chyn-about-exhibition-points { margin-top: .28rem; gap: .18rem; }
.chyn-about-page .chyn-about-exhibition-point { align-items: flex-start; }
.chyn-pro-page .chyn-pro-connections-head { display: block; }
.chyn-pro-page .chyn-pro-connections-heading,
.chyn-pro-page .chyn-pro-connections-intro { width: 100%; max-width: none; }
.chyn-pro-page .chyn-pro-connections-intro { margin-top: .24rem; }
.chyn-pro-page .chyn-pro-connect-solution-list,
.chyn-pro-page .chyn-pro-connect-case-grid { grid-template-columns: 1fr; gap: .3rem; }
.chyn-pro-page .chyn-pro-connect-solution-link { grid-template-columns: 1fr; grid-template-rows: auto auto; min-height: 0; }
.chyn-pro-page .chyn-pro-connect-solution-media>.rect-60 { height: 0; padding-bottom: 60%; }
.chyn-pro-page .chyn-pro-connect-solution-copy { padding: .3rem .26rem; }
.chyn-pro-page .chyn-pro-connect-case-link { min-height: 3.7rem; }
.chyn-pro-page .chyn-pro-connect-col-head { align-items: flex-end; }
.chyn-pro-page .chyn-pro-connect-all { min-height: .72rem; display: inline-flex; align-items: center; }
.chyn-about-page .chyn-about-environment-controls button,
.chyn-about-page .chyn-about-certifications-controls button,
.chyn-about-page .chyn-about-exhibition-controls button { width: .88rem; min-width: .88rem; height: .88rem; flex: 0 0 .88rem; }
.chyn-service-page .chyn-service-nav .w16 { height: 1.08rem; }
.chyn-service-page .chyn-service-nav a { min-height: 1.08rem; line-height: 1.25; }
.chyn-service-page .chyn-service-lines a { min-height: .88rem; }
.chyn-fluent-form .ff-t-container { display: block; }
.chyn-fluent-form .ff-el-group { margin-bottom: .24rem; }
.chyn-fluent-form .ff-el-form-control { min-height: .88rem; padding: .16rem .2rem; }
.chyn-fluent-form textarea.ff-el-form-control { min-height: 3rem; }
.chyn-fluent-form .ff-btn-submit { width: 100%; min-height: .88rem; }
.chyn-pro-summary-actions { align-items: stretch; }
.chyn-pro-summary-actions .chyn-btn { width: 100%; min-height: .88rem; }
}
@media screen and (max-width: 1366px) and (min-width: 1001px) {
body .chyn-home-a .chyn-home-case-stage-copy { bottom: .35rem; }
}
@media screen and (max-width: 1000px) {
#c-header .c-nav > li > ul:not(.chyn-product-mobile-nav) > li { min-height: .76rem; line-height: 1.35; }
#c-header .c-nav > li > ul:not(.chyn-product-mobile-nav) > li > a { min-height: .76rem; display: flex; align-items: center; padding: 0; line-height: 1.35; }
}
@media screen and (max-width: 767px) {
.chyn-about-page .chyn-about-text-link { min-height: .88rem; gap: .16rem; padding: .08rem 0; font-size: .34rem; line-height: 1.35; }
.chyn-about-page .chyn-about-text-link .chyn-arrow-icon { width: .32rem; height: .32rem; flex-basis: .32rem; }
.chyn-about-page .chyn-about-text-link i { font-size: .34rem; line-height: 1; }
.chyn-about-page .chyn-about-environment-copy { min-height: 0; margin-bottom: .35rem; }
.chyn-about-page .chyn-about-environment-slider-wrap { margin-top: 0; }
.tc_search .cell_mid,.tc_search .cell_h { overflow: visible; }
.tc_search form { width: calc(100% - .64rem); max-width: none; height: 1.12rem; align-items: center; padding: 0 .22rem; border: 0; border-radius: .12rem; background: #fff; box-shadow: 0 .18rem .5rem rgba(0,0,0,.22); }
.tc_search form:focus-within { box-shadow: 0 0 0 .04rem rgba(0,161,128,.3),0 .18rem .5rem rgba(0,0,0,.22); }
.tc_search input[type="search"] { width: calc(100% - .8rem); height: 1.12rem; color: #17202a; font-size: var(--f16); line-height: 1.4; }
.tc_search input[type="search"]::placeholder { color: #7a858b; }
.tc_search button[type="submit"] { width: .8rem; max-width: none; height: 1.12rem; line-height: 1.12rem; color: var(--theme-color); font-size: var(--f24); }
.tc_search .search_bg { width: 100%; max-width: none; height: 100%; }
.chyn-pro-connections{
padding-top: 0 !important;
}
}
/* Contact page: match the migrated two-column form while keeping Fluent Forms dynamic. */
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form .ff-el-input--label label {
color: #24343b;
font-family: "DR", sans-serif;
font-weight: 600;
}
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form .ff-el-form-control {
border-color: #e4e7eb;
background: #f7f8fa;
font-family: "DR", sans-serif;
font-weight: 500;
}
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style {
min-height: .54rem;
padding: .15rem .34rem;
border: .01rem solid var(--theme-color);
border-radius: .06rem;
background: var(--theme-color);
color: #fff;
font-family: "DR", sans-serif;
font-size: var(--f16);
font-weight: 600;
line-height: 1.2;
box-shadow: none;
}
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style:hover,
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style:focus {
border-color: #008a6d;
background: #008a6d;
color: #fff;
}
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style:focus-visible {
outline: .02rem solid #006f59;
outline-offset: .03rem;
}
/* WordPress supplies these states; the migrated header now renders them visibly. */
.Header-wrapper .Header-container .c-nav > li.current-menu-item > .c-title-box,
.Header-wrapper .Header-container .c-nav > li.current-menu-parent > .c-title-box,
.Header-wrapper .Header-container .c-nav > li.current-menu-ancestor > .c-title-box,
.Header-wrapper .Header-container .c-nav > li.current-menu-item > .c-title-box > a,
.Header-wrapper .Header-container .c-nav > li.current-menu-parent > .c-title-box > a,
.Header-wrapper .Header-container .c-nav > li.current-menu-ancestor > .c-title-box > a,
.Header-wrapper .Header-container .c-nav > li.current-menu-item > a,
.Header-wrapper .Header-container .c-nav > li.current-menu-parent > a,
.Header-wrapper .Header-container .c-nav > li.current-menu-ancestor > a,
body.single-product .Header-wrapper .Header-container .c-nav > li.chyn-product-nav > .c-title-box,
body.single-product .Header-wrapper .Header-container .c-nav > li.chyn-product-nav > .c-title-box > a,
body.single-solution .Header-wrapper .Header-container .c-nav > li:has(a[href$="/solutions/"]) > .c-title-box,
body.single-solution .Header-wrapper .Header-container .c-nav > li:has(a[href$="/solutions/"]) > .c-title-box > a,
body.single-post .Header-wrapper .Header-container .c-nav > li:has(a[href$="/blog/"]) > .c-title-box,
body.single-post .Header-wrapper .Header-container .c-nav > li:has(a[href$="/blog/"]) > .c-title-box > a,
body.single-project .Header-wrapper .Header-container .c-nav > li:has(a[href$="/project/"]) > .c-title-box,
body.single-project .Header-wrapper .Header-container .c-nav > li:has(a[href$="/project/"]) > .c-title-box > a {
color: var(--theme-color);
}
.Header-wrapper .Header-container .c-nav .sub-menu > li.current-menu-item > a,
.Header-wrapper .Header-container .c-nav .sub-menu > li.current-menu-parent > a,
.Header-wrapper .Header-container .c-nav .sub-menu > li.current-menu-ancestor > a {
color: var(--theme-color);
}
@media all and (min-width: 1001px) {
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form > fieldset > .ff-t-container {
gap: .36rem;
}
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form textarea.ff-el-form-control {
min-height: 1.98rem;
}
}
@media screen and (max-width: 767px) {
.chyn-oem-page .chyn-oem-hero {
height: auto;
min-height: 0;
padding-top: 0;
padding-bottom: 0;
}
.chyn-oem-page .chyn-oem-hero-inner {
height: auto;
min-height: 0;
}
.chyn-oem-page .chyn-oem-hero-facts {
display: none;
}
.chyn-news-card .chyn-news-info .chyn-news-date {
width: 1.2rem;
}
.chyn-news-card .chyn-news-info .chyn-news-date span {
white-space: nowrap;
}
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form .ff-el-form-control {
min-height: .88rem;
padding: .16rem .2rem;
}
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form textarea.ff-el-form-control {
min-height: 3rem;
}
.chyn-contact-page .chyn-contact-form .ff-default form.frm-fluent-form .ff-btn-submit.ff_btn_style {
width: 100%;
min-height: .88rem;
padding: .16rem .28rem;
}
.chyn-footer-social-tiktok svg {
width: .4rem;
height: .4rem;
}
}
/* CHYN submission confirmation and not-found pages. */
body.error404 #c-header,
body.chyn-thank-page-template #c-header {
background: rgba(255,255,255,.96);
box-shadow: 0 .02rem .18rem rgba(17,24,39,.06);
backdrop-filter: blur(.14rem);
}
body.error404 #c-header .Header-container .c-nav > li .c-title-box,
body.chyn-thank-page-template #c-header .Header-container .c-nav > li .c-title-box,
body.error404 #c-header .Header-container .tool,
body.chyn-thank-page-template #c-header .Header-container .tool {
color: #17202a;
}
body.error404 #c-header .Header-container .logo a img:first-child,
body.chyn-thank-page-template #c-header .Header-container .logo a img:first-child {
display: none;
}
body.error404 #c-header .Header-container .logo a img + img,
body.chyn-thank-page-template #c-header .Header-container .logo a img + img {
display: block;
}
.chyn-status-page {
padding-top: 1rem;
}
.chyn-status-page .chyn-status-section {
position: relative;
display: flex;
min-height: 7.2rem;
align-items: center;
overflow: hidden;
padding: 1rem 0;
}
.chyn-status-page .chyn-status-inner {
position: relative;
z-index: 2;
max-width: 10.4rem;
margin-right: auto;
margin-left: auto;
}
.chyn-status-page .chyn-status-title {
max-width: 10.4rem;
line-height: 1.12;
letter-spacing: -.02rem;
}
.chyn-status-page .chyn-status-desc {
max-width: 8.8rem;
margin-right: auto;
margin-left: auto;
}
.chyn-status-page .chyn-status-actions {
justify-content: center;
gap: .16rem;
}
.chyn-status-page .chyn-status-actions .chyn-btn {
min-width: 2.3rem;
min-height: .62rem;
}
.chyn-thank-page .chyn-status-section {
background: radial-gradient(circle at 50% 24%,rgba(0,161,128,.13),rgba(0,161,128,0) 3.8rem),linear-gradient(180deg,#f7faf9 0%,#fff 100%);
}
.chyn-thank-page .chyn-thank-icon {
display: flex;
width: 1.16rem;
height: 1.16rem;
align-items: center;
justify-content: center;
margin: 0 auto;
border-radius: 50%;
background: var(--theme-color);
box-shadow: 0 .18rem .5rem rgba(0,161,128,.2),0 0 0 .16rem rgba(0,161,128,.08);
}
.chyn-thank-page .chyn-thank-icon svg {
width: .62rem;
height: .62rem;
fill: none;
stroke: #fff;
stroke-width: 4;
stroke-linecap: round;
stroke-linejoin: round;
}
.chyn-thank-page .chyn-status-kicker {
color: var(--theme-color);
letter-spacing: .03rem;
}
.chyn-thank-page .chyn-thank-note a {
color: var(--theme-color);
font-weight: 600;
}
.chyn-404-page .chyn-status-section {
background: radial-gradient(circle at 50% 45%,rgba(0,161,128,.18),rgba(0,161,128,0) 4.2rem),linear-gradient(135deg,#101c25 0%,#172a32 58%,#0d3734 100%);
}
.chyn-404-page .chyn-404-code {
position: absolute;
left: 50%;
top: 50%;
z-index: -1;
color: rgba(255,255,255,.035);
font-size: 3.4rem;
line-height: .8;
letter-spacing: -.12rem;
transform: translate(-50%,-56%);
}
.chyn-404-page .chyn-status-kicker {
color: #52d8be;
letter-spacing: .04rem;
}
.chyn-404-page .chyn-status-title,
.chyn-404-page .chyn-status-desc {
color: #fff;
}
.chyn-404-page .chyn-status-desc {
opacity: .72;
}
.chyn-404-page .chyn-status-btn-light {
border-color: rgba(255,255,255,.36);
background: rgba(255,255,255,.08);
color: #fff;
}
.chyn-404-page .chyn-status-btn-light:hover {
border-color: #fff;
background: #fff;
color: #17202a;
}
@media screen and (max-width: 767px) {
.chyn-status-page {
padding-top: 1.2rem;
}
.chyn-status-page .chyn-status-section {
min-height: 7.8rem;
padding: .8rem 0;
}
.chyn-status-page .chyn-status-inner {
width: calc(100% - .56rem);
}
.chyn-status-page .chyn-status-title {
font-size: .54rem;
line-height: 1.16;
letter-spacing: -.01rem;
}
.chyn-status-page .chyn-status-desc {
font-size: var(--f16);
line-height: 1.65;
}
.chyn-status-page .chyn-status-actions {
display: grid;
grid-template-columns: 1fr 1fr;
gap: .12rem;
}
.chyn-status-page .chyn-status-actions .chyn-btn {
min-width: 0;
min-height: .86rem;
padding: .14rem .12rem;
}
.chyn-thank-page .chyn-thank-icon {
width: 1.28rem;
height: 1.28rem;
}
.chyn-thank-page .chyn-thank-icon svg {
width: .68rem;
height: .68rem;
}
.chyn-404-page .chyn-404-code {
font-size: 3rem;
}
}