/* AB模板网 整站模板下载 */ /* 模板：Www.AdminBuy.Cn */ /* 仿站：Fang.AdminBuy.Cn */ /* 素材：Sc.AdminBuy.Cn */ /* js特效：js.AdminBuy.Cn */ /* 在线工具 Tool.Adminbuy.Cn */ /* QQ：9490489 */ * {-webkit-tap-highlight-color:transparent;} body {background-color:#fff; color:#333; font:16px/1.75em Arial,"Microsoft Yahei"; overflow-x:hidden;} article, aside, details, figcaption, figure, footer, header, main, nav, section {display:block;} div,html,body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {margin:0; padding:0;} select,input,textarea{border-radius:0; -webkit-border-radius:0; background:none; border:none;outline:none; font-family: inherit; font-size: 1em;} input:focus {outline:none;} textarea{resize:none;} /*rows*/ [class*=rows_]{display:-webkit-box;-webkit-box-orient:vertical;text-overflow:ellipsis;overflow:hidden;} .rows_1{display: block; white-space: nowrap;} .rows_2{line-clamp:2; -webkit-line-clamp:2;} .rows_3{line-clamp:3; -webkit-line-clamp:3;} .rows_4{line-clamp:4; -webkit-line-clamp:4;} .rows_5{line-clamp:5; -webkit-line-clamp:5;} /*flex*/ .flex{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;--align:center;align-items:var(--align);--justify:space-between;justify-content:var(--justify);--wrap:wrap;flex-wrap:var(--wrap);} /**Carousel*/ .owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;touch-action:manipulation;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot{background:0 0;color:inherit;border:none;padding:0!important;font:inherit}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-ms-touch-action:pan-y;touch-action:pan-y;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""]{max-height:0}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(../images/owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%} /*全局样式*/ .inner {width:93.75%; max-width:1280px; margin:0 auto;} .submit {-webkit-appearance:none;} .thumbnail {overflow:hidden; position:relative; } .thumbnail a {display:block; overflow: hidden; } .thumbnail img {display:block; width:100%; transition:all 0.5s} .thumbnail a:hover img {transform:scale(1.1,1.1);} table {background-color: transparent; border-spacing: 0; border-collapse: collapse; width:100%;border-top:solid 1px #ddd;border-left:solid 1px #ddd; box-sizing: border-box; table-layout:fixed;} table th{background-color:#f9f9f9;text-align:center; box-sizing: border-box;} table td,table th{padding:5px 10px;border:1px solid #ddd; box-sizing: border-box;} a {text-decoration:none; outline:none; color:#333;} a:focus {outline:none; -moz-outline:none;} a:hover {color:#9a0e0e;} a img {border:none;} img {vertical-align: middle;} li {list-style:none;} .clear{ clear:both; height:0px; overflow:hidden;} /*footer*/ .footer {background-color:#f9f9f9;padding:3.5% 0;color:#555;font-size:14px;line-height:1.75em; border-top:1px solid #eee;} .footer a {color:#555;} .footer a:hover {color:#9a0e0e;} .footer .left {margin-right:280px} .footer .pic {height:45px;overflow:hidden;margin-bottom:1.293%;} .footer .pic img {display:block;height:100%;width:auto;max-width:100%;} .footer .right {float:right;} .follow {padding:20px 0;} .follow ul {font-size:0;line-height:normal;text-align:center;} .follow li {display:inline-block;margin-left:20px;width:120px;} .follow li .qrcode {margin-bottom:5px;background-color:#fff;border:1px solid #e1e1e1;padding:5px;} .follow li img {display:block;width:100%;height:auto;} .follow li p {font-size:14px;color:#333;line-height:1.75em;} .pagesList {margin-bottom:5px;} .pagesList ul {overflow:hidden;} .pagesList li {float:left;padding-right:21px;position:relative;} .pagesList li:after {width:1px;height:15px;background-color:#333;content:'';display:block;position:absolute;right:10px;top:50%;margin-top:-7.5px;} .pagesList li:last-child {padding-right:0;} .pagesList li:last-child:after {display:none;} .copyright {text-transform:uppercase;} .copyright p {margin-bottom:5px;} .copyright a {display: inline-block;} .copyright img {display: inline-block; width: auto; height: 20px; vertical-align: middle; margin-top: -3px;} .social {padding:5px 0;} .social ul {font-size:0;line-height:normal;} .social li {display:inline-block;margin-right:15px;vertical-align:middle;position:relative;} .social li a {display:block;width:35px;height:35px;background:no-repeat center center;background-size:65%;border:1px solid #333;border-radius:50%;text-indent:-99999em;} .social li a:hover {opacity:0.85;} .social li.weixin a {background-image:url(../images/icon_weixin.png);} .social li.weibo a {background-image:url(../images/icon_weibo.png);} .social li.qq a {background-image:url(../images/icon_qq.png);} .social li.mail a {background-image:url(../images/icon_mail.png);} .social li .qrcode {width:100px;height:100px;border:1px solid #e5e5e5;padding:5px;position:absolute;left:50%;bottom:50px;background-color:#fff;margin-left:-56px;display:none;} .social li .qrcode:after {width:8px;height:8px;background-color:#fff;border-right:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;transform:rotate(45deg);content:'';display:block;position:absolute;left:50%;bottom:-5px;margin-left:-5px;} .social li .qrcode img {display:block;width:100%;height:100%;} /*header*/ .header {position:sticky;top:0;width:100%;background-color:#fff;z-index:9;box-shadow:0px 2px 3px #bbb;} /*logo*/ .logo {float:left;padding:15px 0;width:190px;} .logo a {display:block;background:no-repeat left center;background-size:contain; position: relative; overflow: hidden; padding-bottom: 23.684211%;} .logo i {display: block; position:absolute; left:0; top:0; width: 100%; height: 100%; overflow: hidden; text-indent:-9999em;} /*searchForm*/ .searchForm {position:absolute;top:100%;right:0;width:100%;display:none;} .searchForm .inner {margin-top:2px;} .searchForm form {background-color:rgba(255,255,255,0.8);border:1px solid #fff;border-radius:4px;width:300px;float:right;overflow:hidden;padding:8px;} .searchForm .submit {display:block;float:right;width:35px;height:35px;background:url(../images/icon_search.png) no-repeat center center;background-size:20px auto;cursor:pointer;} .searchForm .input {margin-right:45px;} .searchForm .text {background-color:#fff;height:25px;line-height:25px;padding:5px 0;text-indent:5px;width:100%;font-size:14px;color:#353535;} /*nav*/ .nav {margin:0 30px 0 200px;} .nav ul {float:right;} .nav li {float:left;font-size:18px;color:#333;line-height:75px; width: 100px;;position:relative; padding: 0 5px; text-align: center;} .nav li a {color:#333;display:block; position:relative; transition:color .3s;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .nav li a:after {width:0; height:2px; position:absolute; left:0; bottom:0; content:''; display:block; background-color:#9a0e0e; transition:width .3s;} .nav li.on > a, .nav li.cur > a, .nav li li a:hover {color:#9a0e0e;} .nav li.on > a:after, .nav li.cur > a:after {width:100%;} .nav li ul {position:absolute;left:50%;top:101%;background-color:rgba(255,255,255,0.8);border:1px solid #fff;border-top:none;border-radius:0 0 4px 4px;width:140px;margin-left:-71px;padding:5px 0;display:none;} .nav li li {float:none;padding:0;text-align:center; line-height:1.875em; font-size:16px;} .nav li li a {padding:5px 10px;} .nav li em {display:none;} /*slides*/ .slides .item {background:no-repeat center center;background-size:cover;} .slides .item a {display:block;text-indent:-9999em;position:relative;} .slides .owl-dots {position:absolute;left:50%;transform:translateX(-50%);bottom:20px;font-size:0;line-height:normal;text-align:center;padding:2px 0;} .slides .owl-dot {display:inline-block;} .slides .owl-dot span {display:block;width:15px;height:4px;background-color:#fff; background-color:rgba(255,255,255,.3); margin:0 5px;transition:all 0.3s;} .slides .owl-dot.active span {width:35px; background-color:#fff;} .slides .owl-nav {display:none;} .slides .load {padding-bottom:40%;} /*ab_box*/ .ab_box {padding:5% 0;} .ab_bg {background-color:#f9f9f9;} /*ab_news*/ .ab_top {float:right; width:600px;} .ab_top .thumbnail {position:relative; overflow:hidden;} .ab_top .item a {display:block; position:relative; overflow:hidden;} .ab_top .item a:hover img {transition:scale(1.1,1.1);} .ab_top .item h3 {position:absolute; left:0; bottom:0; background-color:#000; background-color:rgba(0,0,0,.35); color:#fff; font-size:14px; width:90%; padding:8px 5%; line-height:1.75em; font-weight:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:center;} .ab_top .load {padding-bottom:75%;} .ab_top .owl-dots {display:none;} .ab_top .owl-nav button {position:absolute; top:50%; transform:translateY(-50%); display:block;} .ab_top .owl-nav span {display:block; width:14px; height:24px; background:url(../images/icon_arrow.png) no-repeat 0 0; background-size:100% auto; text-indent:-9999em; z-index:2;} .ab_top .owl-prev {left:10px;} .ab_top .owl-next {right:10px;} .ab_top .owl-prev span {background-position:0 100%;} .ab_news {overflow:hidden;} .ab_news ul {overflow:hidden;margin-right:630px;} .ab_news li {margin-bottom:10px; overflow:hidden;} .ab_news li .thumbnail {float:left; width:140px;overflow:hidden;} .ab_news li .info {margin-left:155px; overflow:hidden;} .ab_news li h3 {font-size:16px; font-weight:normal; line-height:1.5em; white-space:nowrap; overflow:hidden;text-overflow:ellipsis;margin-bottom:5px; margin-top: 5px;} .ab_news li p {font-size:14px;color:#555;line-height:1.8em;text-align:justify;} .ab_news li time {display:block;font-size:14px;color:#999;} /*ab_about*/ .ab_about {display:table;table-layout:fixed;width:100%;} .ab_about .pic {display:table-cell;vertical-align:top;width:500px;} .ab_about figure {padding:0 15px 15px 0; position:relative;} .ab_about figure:before {width:90%; height:90%; content:''; background-color:#bb2424; display:block; position:absolute; right:0; bottom:0;} .ab_about .pic img {display:block;width:100%;height:auto; position:relative; z-index:2;} .ab_about .info {display:table-cell;vertical-align:middle;padding-right:3.5%;text-align:justify;} .ab_about .intro {font-size:16px;line-height:1.875em;overflow:hidden;} .ab_about .intro p {padding:7px 0;} /*ab_cat*/ .ab_cat ul {overflow:hidden;} .ab_cat li {width:20%; float:left; transition:all .3s; opacity:.6;} .ab_cat li.cur {width:40%; opacity:1;} .ab_cat li a {position:relative; display:block; padding-bottom:350px; background:no-repeat center center; background-size:auto 100%; color:#fff;} .ab_cat li h2 {font-size:18px; font-weight:normal; position:absolute; text-align:center; left:10%; width:70%; bottom:-100%; transition:all .3s; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:2% 5%;} .ab_cat .cur h2 {bottom:50%; transform:translateY(50%); background-color:rgba(154,14,14,.85);} /*ab_title*/ .ab_title {overflow:hidden; margin-bottom:3%; position:relative;} .ab_title h2 {font-size:24px; font-weight:normal; line-height:1.35em; float:left; position:relative; padding-bottom:10px;} .ab_title h2:before, .ab_title h2:after {width:75px; height:1px; background-color:#eee; content:''; display:block; position:absolute; left:0; bottom:0;} .ab_title h2:after {width:30px; background-color:#9a0e0e;} .ab_title a {display:block; position:absolute; right:0; top:50%; margin-top:-7px; padding:0 10px;} .ab_title i {display:block; width:7px; height:7px; border-radius:50%; background-color:#ccc;} .ab_title i:before, .ab_title i:after {content:''; display:block; width:7px; height:7px; border-radius:50%; position:absolute; top:0;} .ab_title i:before {left:0; background-color:#bbb;} .ab_title i:after {right:0; background-color:#ddd;} /*ab_pro*/ .ab_pro {overflow:hidden;} .ab_pro ul {overflow:hidden; width:101%;} .ab_pro li {float:left; width:18.9%; padding-right:1.1%; padding-bottom:1.05%;} .ab_pro li.li1 {width:38.9%; padding-bottom:0.75%;} .ab_pro li a {overflow:hidden; display:block; position:relative;} .ab_pro li a:after {content:''; display:block; position:absolute; left:0; top:0; background-color:rgba(0,0,0,.5); width:100%; height:100%; opacity:0; transition:opacity .3s;} .ab_pro li .thumbnail {} .ab_pro li img {transition:all .3s;} .ab_pro li h3 {font-size:14px; font-weight:normal; background-color:#9a0e0e; background-color:rgba(154,14,14,.85); position:absolute; left:10%; top:-100%; color:#fff; border-radius:3px; width:70%; padding:0 5%; height:30px; line-height:30px; text-align:center;z-index:2; opacity:0; transition:all .5s; margin-top:-14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;} .ab_pro li a:hover:after {opacity:1;} .ab_pro li a:hover h3 {top:50%;opacity:1;} .ab_pro li a:hover img {transform:scale(1.1);} /*ab_video*/ .ab_video .inner {overflow:hidden;} .ab_video ul {width:102%;overflow:hidden;} .ab_video li {float:left;width:23%;padding-right:2%;padding-bottom:2%;} .ab_video h4 {text-align:center;font-size:16px;font-weight:normal;padding:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .ab_video .thumbnail a:hover:after {background-color:transparent;} /*links*/ .links {padding:15px 0;background-color:#f6f6f6;} .links .inner {overflow:hidden;} .links h2 {float:left;font-size:14px;line-height:1.875em; font-weight:normal; color:#333;} .links ul {overflow:hidden;margin-left:70px;} .links li {font-size:14px;line-height:1.875em;float:left;padding:0 1%;} .links li a {display:block; color:#555;} .links li a:hover {color:#000;} /*banner*/ .banner img {display:block;width:100%;height:auto;} /*pageTitle*/ .pageTitle {position:absolute; left:0; top:0; background-color:#9a0e0e;color:#fff; padding:15px 20px; width:120px; text-align:center;} .pageTitle .cn, .pageTitle .en {font-weight:normal; line-height:24px;} .pageTitle .cn {font-size:18px;} .pageTitle .en {font-size:12px; text-transform:uppercase;} /*bar*/ .bar {background-color:#f9f9f9; border-bottom:1px solid #eee; margin-bottom:20px;} .bar .inner {position:relative;} /*menu*/ .submenu {padding:15px; margin-left:160px; margin-right:200px;} .submenu ul {overflow:hidden;} .submenu li {float:left;font-size:14px;color:#333; line-height:2em;} .submenu li a {color:#333;padding:0 22px;display:block; position:relative;} .submenu li.cur a:before {width:4px; height:4px; background-color:#9a0e0e; border-radius:50%; content:''; display:block; position:absolute; left:10px; top:50%; margin-top:-2px;} .submenu li a:hover, .submenu li.cur a {color:#9a0e0e;} /*breadcrumb*/ .breadcrumb {max-width:200px;float:right;font-size:12px; line-height:28px;color:#888;background:url(../images/icon_home.png) no-repeat left center;background-size:auto 12px;padding:15px 0 15px 15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .breadcrumb i {font-style:normal;padding:0 3px;color:#888;font-family:'Simsun';} .breadcrumb a {color:#888;} /*wrapper*/ .wrapper {padding:3.5% 0;} .wrapper .inner {overflow:hidden;} /*newsitem*/ .newslist {overflow:hidden;} .newsitem {border-bottom:1px solid #eee;overflow:hidden;margin-bottom:3.5%;padding-bottom:3.5%; position:relative;} .newsitem .istop {color:#fff; font-size:12px; position:absolute; left:5px; top:0; border-radius:0 0 3px 3px; width:1em; line-height:1.5em; padding:5px; background-color:#9a0e0e;} .newsitem .thumbnail {float:left;width:300px;overflow:hidden;} .newsitem .thumbnail a {transition:all 0.3s;} .newsitem .thumbnail a:hover {transform:scale(1.1);} .newsitem .info {margin-left:300px;overflow:hidden;padding:10px 120px 10px 30px;position:relative;} .newsitem .info:after {width:1px; height:80%; background-color:#f1f1f1; position:absolute; right:85px; top:10%; content:''; display:block;} .newsitem h2 {font-size:24px;color:#333;font-weight:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35em;margin-bottom:13px;} .newsitem h2 strong {color:#9a0e0e;} .newsitem .excerpt {color:#666;font-size:16px;line-height:1.875em;height:7.5em; text-align:justify;} .newsitem .date {font-size:14px;line-height:1.5em; color:#999; overflow:hidden; margin-top:18px;} .newsitem .date span {display:block; float:left; padding:0 20px 0 10px; position:relative;} .newsitem .date span:before {width:4px; height:4px; background-color:#999; border-radius:50%; content:''; display:block; position:absolute; left:0; top:50%; margin-top:-2px;} .newsitem .date i {font-size:60px;line-height:1em;font-style:normal;display:block;} .newsitem .more {text-align:center; position:absolute; right:0; top:50%; margin-top:-24px;} .newsitem .more a { width:48px; height:48px;display:block; border:1px solid #999; border-radius:50%;} .newsitem .more i {display:block; background:url(../images/icon_more.png) no-repeat 0 0; width:24px; height:24px; position:absolute; left:50%; top:50%; margin:-12px 0 0 -12px; background-size:100% auto;} .newsitem .more a:hover {border-color:#9a0e0e;} .newsitem .more a:hover i {background-position:0 100%;} /*pagenavi*/ .pagenavi {text-align:center;display: flex;justify-content: center;flex-wrap: wrap;font-size:14px;} .pagenavi a, .pagenavi .now-page {display:block;color:#666; background-color:#f9f9f9; border-radius:0.214em; height:2.286em;line-height:2.286em;padding:0 0.5em;margin:0.143em;box-sizing: border-box; min-width: 2.286em;} .pagenavi .now-page,.pagenavi a:hover {background-color:#9a0e0e;color:#fff;border-color:#9a0e0e;} /*products*/ .products {overflow:hidden; margin-bottom:2%;} .products ul {overflow:hidden;width:102%;} .products li {width:23%;float:left;padding-right:2%;padding-bottom:2%;} .products li .thumbnail {overflow:hidden;} .products li .thumbnail a {transition:transform 0.3s;} .products li .thumbnail a:hover {transform:scale(1.1);} .products li .box {border:1px solid #eee;} .products li h2 {font-size:16px;font-weight:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:3.704% 7.937%;line-height:1.875em;text-align:center;} /*relatedpro*/ .relatedpro ul {overflow:hidden;width:102%;} .relatedpro li {width:14.666%;} /*main*/ .main {margin-right:310px;overflow:hidden;} /*posttitle*/ .posttitle {text-align:center;font-size:28px;font-weight:normal;line-height:1.35em;margin-bottom:2.5%;} /*postmeta*/ .postmeta {font-size:0;line-height:normal;text-align:center;border-bottom:1px solid #eee; padding-bottom:10px; margin-bottom:3.5%;} .postmeta span {display:inline-block;font-size:12px;line-height:1.75em;padding:0 15px 0 18px;color:#888;background:no-repeat left center;background-size:auto 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .postmeta .date {background-image:url(../images/icon_date.png);} .postmeta .author {background-image:url(../images/icon_author.png);} .postmeta .views {background-image:url(../images/icon_views.png);} .postmeta .cate {background-image:url(../images/icon_cate.png);} .postmeta a {color:#888;} .postmeta a:hover {color:#333;} /*postnavi*/ .postnavi {overflow:hidden; padding:2.5% 0; margin-bottom:2.5%; width:102%; border-top:1px solid #eee;} .postnavi span {float:left; display:block; font-size:14px; line-height:1.75em; color:#666; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:48%; padding-right:2%;} .postnavi .r {text-align:right;} .postnavi a {color:#555;} /*singlepage*/ .singlepage .entry {padding:3.5% 0 5%;} /*video*/ .video {margin-bottom:1.875%; overflow:hidden;} .video video {display:block; width:100%; height:auto;} /*entry*/ .entry {font-size:16px;line-height:1.875em;color:#333;margin-bottom:1.5%;overflow:hidden;} .entry p,.entry h1,.entry h2,.entry h3,.entry h4,.entry h5,.entry h6,.entry table,.entry hr {margin-bottom:1.875%;} .entry img {width:auto; max-width:100%;height:auto!important;} .entry hr {border:none;border-bottom:1px solid #e6e6e6;} .entry blockquote {background-color:#f9f9f9;border-left:8px solid #e3e3e3;padding:1.65% 1.65% 0;overflow:hidden;margin:0 2em 1.875%;font-style:italic;color:#666;} .entry ul,.entry ol {margin-left:2em;margin-bottom:1.875%;} .entry ul li,.entry ol li {margin-left:1em;} .entry ul li {list-style:outside disc none;} .entry ol li {list-style:outside decimal none;} .entry li p {display:inline;} .entry video {max-width:100%; height:auto;} /*tags*/ .tags {overflow:hidden;margin-bottom:3.5%;} .tags h3 {float:left;font-size:14px;color:#555;line-height:1.75em;font-weight:normal;} .tags ul {margin-left:56px;overflow:hidden;} .tags li {float:left;font-size:14px;line-height:1.75em;padding:0 5px;} .tags li a {color:#9a0e0e;} .tags li a:hover {opacity:0.85;} /*boxtitle*/ .boxtitle {font-size:18px; font-weight:normal; line-height:1.35em; position:relative; padding-bottom:8px; margin-bottom:20px;} .boxtitle:before, .boxtitle:after {width:80px; height:1px; background-color:#eee; content:''; display:block; position:absolute; left:0; bottom:0;} .boxtitle:after {width:35px; height:2px; background-color:#9a0e0e; bottom:-0.5px;} /*relatednews*/ .relatednews {overflow:hidden; margin-bottom:3.5%;} .relatednews ul {overflow:hidden; width:105%;} .relatednews li {float:left; width:45%; font-size:16px; line-height:1.875em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:2px 5% 2px 0;} .relatednews li a {padding-left:20px; position:relative; color:#555;} .relatednews li a:before {content:''; display:block; width:6px; height:6px; background-color:#ccc; border-radius:50%; position:absolute; left:0; top:50%; margin-top:-3px;} /*commentsList*/ .commentsList,.commentForm {overflow:hidden;margin-bottom:3.5%;} .commentsList .avatar {float:left;width:50px;padding-top:5px;} .commentsList .avatar span {padding-bottom:100%; position:relative;overflow:hidden; display:block;border-radius:50%;} .commentsList .avatar img {position:absolute; left:0; top:0; display:block;width:100%;height:100%;} .commentsList .info {margin-left:60px;overflow:hidden;} .commentsList .top {overflow:hidden;} .commentsList .top span {display:block;font-size:12px;line-height:1.75em;} .commentsList .top .name {float:left;font-weight:bold; font-size:16px;} .commentsList .top .name a {color:#333;} .commentsList .top .reply {float:right;} .commentsList .top .reply a {color:#666;} .commentsList .mid {color:#999;font-size:12px;line-height:1.75em;} .commentsList .btm {font-size:14px; color:#333;line-height:1.875em; padding:5px 0;} .commentsList li {overflow:hidden;margin-bottom:2.5%;} .commentsList li li {margin-left:60px;margin-top:5px;margin-bottom:0;} .commentsList li li .avatar {display:none;} .commentsList li li .info {margin-left:0;background-color:#fff;border:1px solid #e4e4e4;padding:10px 15px;} #comment .item {overflow:hidden;margin-bottom:1.5%;} #comment label {display:block;float:left;height:2.625em;line-height:2.625em;font-size:16px;} #comment .input {margin-left:50px;border:1px solid #e4e4e4;border-radius:5px;overflow:hidden;} #comment .text {width:100%;padding:0.5625em 1em;display:block;height:2.625em;line-height:1.5em;font-size:16px;color:#333;font-family:'Microsoft Yahei';background-color:#fff; box-sizing: border-box;} #comment textarea.text {height:7.5em;} #comment .btn {overflow:hidden;width: auto; margin-left: 50px;} #comment .submit {background-color:#9a0e0e;color:#fff;width:7.5em;height:2.5em;border-radius:0.25em;cursor:pointer;float:right; -webkit-appearance:none;} #comment .submit:hover {opacity:0.75;} #comment .verify img {display:block; float:right; height:42px; width:auto;} /*sidebar*/ .sidebar {float:right;width:280px;} .stitle {background-color:#9a0e0e;padding:8px 10px;border-top-left-radius:5px;color:#fff;} .stitle h3 {font-size:16px;font-weight:normal;line-height:1.35em;} .stitle h4 {font-size:12px;font-weight:normal;opacity:0.75;line-height:1.125em;text-transform:uppercase;} .related, .widget {margin-bottom:20px; overflow:hidden;} .related li {padding:15px 0;overflow:hidden;border-bottom:1px solid #eee;} .related li .thumbnail {float:left;width:75px;overflow:hidden;} .related li .thumbnail a {transition:transform 0.3s;} .related li .thumbnail a:hover {transform:scale(1.1);} .related li .info {margin-left:85px;overflow:hidden;} .related li h5 {font-size:16px;line-height:1.75em;font-weight:normal;height:3.5em;overflow:hidden;} .widget ul, .widget .textwidget {padding:12px 0; overflow:hidden;} .widget li {font-size:14px; border-bottom:1px solid #eee; padding:8px 0; line-height:1.75em;} .widget li a {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding-left:15px; position:relative;} .widget li a:before {width:5px; height:5px; border:1px solid #cacaca; border-radius:50%; content:''; display:block; position:absolute; left:0; top:50%; margin-top:-3.5px;} .widget li a:hover:before {border-color:#9a0e0e;} .widget .divTags {width:102%;} .widget .divTags li {width:48%; float:left; padding-right:2%;} .divCalendar td, .divCalendar th {padding:2%; font-size:14px; text-align:center;} .widget .divMisc li {width:45%; float:left; border-bottom:none;} .widget .divMisc li img {display:block; width:100%; height:auto;} .widget .divMisc li a {padding-left:0;} .widget .divMisc li a:before {display:none;} .widget .divSearchPanel {padding:25px 10px;border:1px solid #e4e4e4;border-top:none;} .widget .divSearchPanel form {display:block; overflow:hidden; padding-right:50px; position:relative;} .widget .divSearchPanel input[type='text'] {background-color:#eee; height:24px; line-height:24px; padding:5px 2%; width:96%;} .widget .divSearchPanel input[type='submit'] {background-color:#9a0e0e; color:#fff; height:34px; width:50px; position:absolute; right:0; top:0; cursor:pointer;} /*picList*/ .picList {float:left;width:450px;} .picList .cur,.picList .item {border:1px solid #e4e4e4;padding:5px;background-color:#fff;} .picList .cur {margin-bottom:10px;} .picList .on {border-color:#9a0e0e;} .picList .pic {padding-bottom:100%;position:relative;} .picList .pic img {display:block;position:absolute;left:0;top:0;width:100%;height:100%;} .picList .list {padding:0 30px;} .picList .load {padding-bottom:18.077%;} .picList .item {cursor:pointer;} .picList .owl-nav button {display:block;position:absolute;top:0;height:100%;width:25px;text-indent:-99999em;} .picList .owl-nav .disabled {opacity:0.5;cursor:default;} .picList .owl-nav span {display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:#eee no-repeat center center;opacity:0.85;} .picList .owl-nav .owl-prev {left:-30px;} .picList .owl-nav .owl-prev span {background-image:url(../images/arrow_left.png);} .picList .owl-nav .owl-next {right:-30px;} .picList .owl-nav .owl-next span {background-image:url(../images/arrow_right.png);} .product .proInfo {overflow:hidden;margin-bottom:3.5%;} .product .right {margin-left:490px;overflow:hidden;} .product .posttitle {text-align:left; margin-bottom:4%;} .product .intro {background-color:#f9f9f9;padding:20px;font-size:16px;line-height:1.875em;color:#666;margin-bottom:4%; border-radius:15px 0 15px 0;} .product .meta {font-size:14px;margin-bottom:5%;} .product .meta .cat {padding:5px 0;} .product .meta span {display:block;float:left;color:#333;font-weight:bold;height:36px;line-height:36px;} .product .meta ul {margin-left:70px;overflow:hidden;} .product .meta li {float:left;padding:2px 5px;} .product .meta a {color:#555;display:block;border:1px solid #eee;padding:0 15px; font-size:12px; height:30px; line-height:30px;} .product .meta a:hover {border-color:#9a0e0e;color:#9a0e0e;} .product .btn {text-align:center; display: flex; align-items: center; flex-wrap: wrap; width: 102%; overflow: hidden;} .product .btn span {display:block;width:31.33%; padding-right: 2%;} .product .btn a {display:block;color:#fff;font-size:16px;height:42px;line-height:42px;background-color:#1296db;border-radius:5px;} .product .btn a:hover {opacity:0.85;} .product .btn .msg {background-color:#ee5e7b;} .product .btn .buy {background-color:#ff5000;} .product .proTitle {background-color:#f9f9f9;margin-bottom:3%;} .product .proTitle h2 {font-size:14px;font-weight:normal;overflow:hidden;padding:5px 20px 0;} .product .proTitle span {display:block;float:left;padding:5px 15px;border:1px solid #eee;border-bottom:none;color:#666;background-color:#fff;} /*error404*/ .error404 .error {padding:5% 0 10%;} .error404 .title {text-align:center;font-size:38px;font-weight:normal;line-height:1.5em;margin-bottom:1.5%;} .error404 .intro {font-size:24px;color:#333;text-align:center;line-height:1.75em;} @media only screen and (max-width:1365px){ .inner {width:93.75%;} } /* 2026 design concept refresh: high-tech editorial system */ :root { --kd-ink: #07111f; --kd-text: #182233; --kd-muted: #647184; --kd-soft: #eef3f7; --kd-panel: #ffffff; --kd-line: rgba(16, 34, 55, .1); --kd-dark: #08111e; --kd-dark-2: #111d2c; --kd-cyan: #18b7cf; --kd-green: #36c58a; --kd-coral: #ff7a59; --kd-shadow: 0 24px 70px rgba(13, 32, 54, .12); --kd-radius: 8px; } html { background: #f4f7fb; scroll-behavior: smooth; } body { background: linear-gradient(180deg, #f7fafc 0, #eef3f7 520px, #f7fafc 100%); color: var(--kd-text); font-family: "Inter", "Microsoft YaHei", "PingFang SC", Arial, sans-serif; font-size: 16px; line-height: 1.75; letter-spacing: 0; } a { color: inherit; } img { max-width: 100%; } .inner { width: min(1200px, calc(100vw - 56px)); } .thumbnail img, .pic img, .entry img { background: #f4f7fb; } /* Header */ .header { position: sticky; top: 0; z-index: 99; background: rgba(8, 17, 30, .9); border-bottom: 1px solid rgba(255, 255, 255, .09); box-shadow: 0 16px 45px rgba(0, 0, 0, .18); backdrop-filter: blur(18px); } .header .inner { display: flex; align-items: center; min-height: 74px; overflow: visible; } .logo { float: none; flex: 0 0 188px; width: 188px; height: 50px; } .logo a { height: 50px; background-size: contain; background-position: left center; } .nav { float: none; flex: 1 1 auto; margin-left: 28px; } .nav ul { display: flex; justify-content: flex-end; align-items: center; gap: 2px; float: none; } .nav li { float: none; width: auto !important; position: relative; } .nav li a { padding: 27px 13px; color: rgba(255, 255, 255, .78); font-size: 14px; font-weight: 500; line-height: 20px; } .nav li a:after { display: none; } .nav li.cur > a, .nav li:hover > a { color: #fff; } .nav li.cur > a:before, .nav li:hover > a:before { content: ""; position: absolute; left: 13px; right: 13px; bottom: 17px; height: 2px; border-radius: 999px; background: linear-gradient(90deg, var(--kd-cyan), var(--kd-green)); } .nav li ul { top: 72px; width: 190px; padding: 10px; border: 1px solid rgba(255, 255, 255, .1); border-radius: var(--kd-radius); background: rgba(9, 18, 31, .96); box-shadow: 0 24px 60px rgba(0, 0, 0, .28); } .nav li ul li a { padding: 10px 12px; color: rgba(255, 255, 255, .76); border-radius: 6px; } .nav li ul li a:hover { background: rgba(255, 255, 255, .08); } .language-switcher { order: 3; float: none; margin-left: 14px; padding: 0 !important; } .language-btn { height: 38px; padding: 0 12px; border: 1px solid rgba(255, 255, 255, .16); border-radius: 999px; background: rgba(255, 255, 255, .08); color: rgba(255, 255, 255, .86); font-size: 13px; } .language-btn .globe-icon img { width: 19px !important; opacity: .88; } .language-dropdown { top: 48px; right: 0; left: auto; width: 280px !important; padding: 10px; border: 1px solid rgba(255, 255, 255, .12); border-radius: var(--kd-radius); background: rgba(9, 18, 31, .97); box-shadow: 0 24px 60px rgba(0, 0, 0, .3); } .language-item { border-radius: 6px; } .language-item a { color: rgba(255, 255, 255, .82); } .language-item:hover { background: rgba(255, 255, 255, .08); } .searchForm { display: none !important; } /* Hero */ .heroStage { position: relative; min-height: 680px; overflow: hidden; background: var(--kd-dark); } .heroStage:before { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(5, 12, 22, .92) 0, rgba(5, 12, 22, .74) 45%, rgba(5, 12, 22, .2) 100%), radial-gradient(circle at 78% 24%, rgba(24, 183, 207, .28), transparent 34%), repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px 90px); pointer-events: none; } .heroStage:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; height: 140px; background: linear-gradient(180deg, transparent, #f4f7fb); pointer-events: none; } .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item { height: 680px; } .slides .item img, .heroMedia .item img { height: 680px; object-fit: cover; transform: scale(1.03); filter: saturate(1.06) contrast(1.04); } .heroCopy { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; padding-top: 0; pointer-events: none; } .heroCopy .inner, .heroGrid { display: grid; grid-template-columns: minmax(0, 1.05fr) 380px; align-items: center; gap: 48px; } .heroIntro, .heroSignal, .heroActions a { pointer-events: auto; } .heroCopy span, .capabilityLead span, .sectionDeck span, .homeBrandHead span, .brandOverview .copy span, .brandDirectoryHead span, .brandRow .info span { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; color: var(--kd-cyan); font-size: 12px; font-weight: 800; line-height: 1; text-transform: uppercase; letter-spacing: 0; } .heroCopy span:before, .capabilityLead span:before, .sectionDeck span:before, .homeBrandHead span:before, .brandOverview .copy span:before, .brandDirectoryHead span:before, .brandRow .info span:before { content: ""; width: 28px; height: 2px; border-radius: 999px; background: currentColor; } .heroCopy h1 { max-width: 780px; color: #fff; font-size: clamp(42px, 5vw, 72px); font-weight: 800; line-height: 1.08; letter-spacing: 0; } .heroCopy p { max-width: 680px; margin-top: 22px; color: rgba(255, 255, 255, .76); font-size: 18px; line-height: 1.85; } .heroActions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 34px; } .heroActions a, .homeBrandHead > a, .ab_title a, .textMore, .product .btn a, .commentForm .submit { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border: 1px solid rgba(24, 183, 207, .3); border-radius: 999px; background: rgba(255, 255, 255, .08); color: #fff; font-size: 14px; font-weight: 700; line-height: 1; transition: transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease; } .heroActions a.primary, .product .btn a, .commentForm .submit { border-color: transparent; background: linear-gradient(135deg, var(--kd-cyan), var(--kd-green)); color: #05111c; box-shadow: 0 18px 44px rgba(24, 183, 207, .24); } .heroActions a:hover, .homeBrandHead > a:hover, .ab_title a:hover, .textMore:hover, .product .btn a:hover, .commentForm .submit:hover { transform: translateY(-2px); } .heroSignal { position: relative; padding: 28px; border: 1px solid rgba(255, 255, 255, .16); border-radius: var(--kd-radius); background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.06)); box-shadow: 0 28px 80px rgba(0, 0, 0, .28); backdrop-filter: blur(16px); } .heroSignal strong { display: block; color: #fff; font-size: 32px; line-height: 1.1; } .heroSignal p { margin-top: 10px; color: rgba(255, 255, 255, .68); font-size: 14px; line-height: 1.65; } .heroSignal ul { margin-top: 24px; } .heroSignal li { display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 12px; padding: 14px 0; border-top: 1px solid rgba(255, 255, 255, .1); color: rgba(255, 255, 255, .86); } .heroSignal em { width: 36px; height: 36px; border-radius: 50%; background: rgba(24, 183, 207, .16); color: var(--kd-cyan); font-size: 12px; font-style: normal; font-weight: 800; text-align: center; line-height: 36px; } /* Home sections */ .homeMain { position: relative; z-index: 4; } .homeCapability, .ab_box, .homeBrand, .homeNews { padding: 78px 0; } .homeCapability { margin-top: -46px; padding-top: 0; } .capabilityLead { display: grid; grid-template-columns: 320px minmax(0, 1fr); align-items: end; gap: 52px; margin-bottom: 28px; } .capabilityLead h2, .sectionDeck h2, .homeBrandHead h2, .brandOverview h1, .brandDirectoryHead h2, .pageTitle .cn { color: var(--kd-ink); font-size: clamp(30px, 3.2vw, 46px); font-weight: 800; line-height: 1.18; letter-spacing: 0; } .capabilityGrid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 16px; } .capabilityGrid article { min-height: 220px; padding: 26px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(255,255,255,.78)), radial-gradient(circle at 80% 10%, rgba(54, 197, 138, .18), transparent 34%); box-shadow: 0 18px 48px rgba(16, 34, 55, .08); } .capabilityGrid .wide { grid-row: span 2; min-height: 456px; background: linear-gradient(150deg, rgba(8, 17, 30, .96), rgba(16, 31, 48, .9)), radial-gradient(circle at 20% 10%, rgba(24, 183, 207, .26), transparent 34%); color: #fff; } .capabilityGrid article span { color: var(--kd-cyan); font-size: 12px; font-weight: 800; text-transform: uppercase; } .capabilityGrid h3 { margin-top: 18px; color: inherit; font-size: 24px; font-weight: 800; line-height: 1.25; } .capabilityGrid p { margin-top: 14px; color: var(--kd-muted); font-size: 15px; line-height: 1.8; } .capabilityGrid .wide p { color: rgba(255,255,255,.72); max-width: 360px; } .sectionDeck, .homeBrandHead, .sectionHead { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 28px; margin-bottom: 34px; } .sectionDeck p, .homeBrandHead p, .brandDirectoryHead p, .brandOverview .copy p { max-width: 700px; margin-top: 12px; color: var(--kd-muted); font-size: 16px; line-height: 1.8; } .sectionDeck a, .homeBrandHead > a { min-width: 128px; border-color: var(--kd-line); background: var(--kd-panel); color: var(--kd-ink); box-shadow: 0 12px 32px rgba(16, 34, 55, .08); } .sectionDeck a i { position: static; display: block; width: 18px; height: 18px; margin: 0; background: none; } .sectionDeck a i:before { content: "More"; color: var(--kd-ink); font-size: 13px; font-style: normal; } .homeProducts { background: #f8fafc; } .ab_pro ul, .products ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; width: auto; overflow: visible; } .ab_pro li, .ab_pro li.li1, .products li { float: none; width: auto; padding: 0; } .ab_pro li:first-child { grid-column: span 2; grid-row: span 2; } .ab_pro li a, .products li .box { position: relative; display: block; height: 100%; min-height: 252px; overflow: hidden; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: var(--kd-panel); box-shadow: 0 16px 40px rgba(16, 34, 55, .08); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .ab_pro li:first-child a { min-height: 522px; background: var(--kd-dark); } .ab_pro li a:after { display: none; } .ab_pro li .thumbnail, .products li .thumbnail { height: 200px; overflow: hidden; } .ab_pro li:first-child .thumbnail { height: 100%; } .ab_pro li img, .products li .thumbnail img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; } .ab_pro li h3, .ab_pro li a:hover h3, .products li h2 { position: static; width: auto; height: auto; margin: 0; padding: 16px 18px 18px; border-radius: 0; background: var(--kd-panel); color: var(--kd-ink); opacity: 1; text-align: left; font-size: 16px; font-weight: 800; line-height: 1.35; white-space: normal; } .ab_pro li:first-child h3 { position: absolute; left: 22px; right: 22px; bottom: 22px; z-index: 2; padding: 18px 20px; border: 1px solid rgba(255,255,255,.16); background: rgba(8, 17, 30, .72); color: #fff; backdrop-filter: blur(14px); } .ab_pro li a:hover, .products li .box:hover, .homeBrandList article:hover, .newsitem:hover, .brandRow:hover { transform: translateY(-5px); border-color: rgba(24, 183, 207, .32); box-shadow: 0 26px 70px rgba(13, 32, 54, .14); } .ab_pro li a:hover img, .products li .box:hover img { transform: scale(1.06); } .homeBrand { position: relative; overflow: hidden; background: linear-gradient(135deg, #08111e 0, #122336 100%), radial-gradient(circle at 80% 20%, rgba(24, 183, 207, .22), transparent 34%); } .homeBrand:before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 78px 78px; opacity: .45; pointer-events: none; } .homeBrand .inner { position: relative; z-index: 1; } .homeBrandHead h2, .homeBrandHead p { color: #fff; } .homeBrandHead p { color: rgba(255, 255, 255, .66); } .homeBrandHead > a { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .16); color: #fff; } .homeBrandList { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .homeBrandList article { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 18px; align-items: center; min-height: 190px; padding: 18px; border: 1px solid rgba(255, 255, 255, .12); border-radius: var(--kd-radius); background: rgba(255, 255, 255, .08); box-shadow: none; backdrop-filter: blur(12px); } .homeBrandList figure { height: 150px; border-radius: 6px; background: rgba(255, 255, 255, .08); } .homeBrandList img { width: 100%; height: 100%; object-fit: cover; } .homeBrandList h3 { color: #fff; font-size: 19px; font-weight: 800; line-height: 1.35; } .homeBrandList p { margin-top: 10px; color: rgba(255,255,255,.66); font-size: 14px; line-height: 1.75; } .homeNews { background: #f4f7fb; } .ab_news .ab_top { display: none; } .ab_news ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } .ab_news li { display: block; margin: 0; padding: 0; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; overflow: hidden; box-shadow: 0 16px 40px rgba(16, 34, 55, .07); } .ab_news li .thumbnail { width: 100%; height: 156px; overflow: hidden; } .ab_news li .thumbnail img { width: 100%; height: 100%; object-fit: cover; } .ab_news li .info { margin: 0; padding: 18px; } .ab_news li h3 { font-size: 17px; font-weight: 800; line-height: 1.45; } .ab_news li p { margin-top: 8px; color: var(--kd-muted); font-size: 14px; } .ab_news li time { display: block; margin-top: 14px; color: var(--kd-cyan); font-size: 13px; font-weight: 700; } /* Inner pages */ .bar { margin: 0; border: 0; background: linear-gradient(135deg, #08111e 0, #13253a 100%), radial-gradient(circle at 76% 18%, rgba(24, 183, 207, .25), transparent 32%); } .bar .inner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 54px 0 34px; overflow: visible; } .pageTitle, .breadcrumb { float: none; max-width: none; } .breadcrumb { order: 2; padding: 0; color: rgba(255,255,255,.58); font-size: 13px; } .breadcrumb a { color: rgba(255,255,255,.78); } .pageTitle { order: 1; padding: 0; } .pageTitle .cn { color: #fff; } .pageTitle .en { margin-top: 10px; color: rgba(255,255,255,.4); font-size: 14px; font-weight: 600; text-transform: uppercase; } .submenu { order: 3; display: flex; flex-wrap: wrap; gap: 10px; float: none; padding: 0; margin: 0; } .submenu li { float: none; } .submenu li a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(255,255,255,.06); color: rgba(255,255,255,.72); font-size: 14px; } .submenu li.cur a, .submenu li a:hover { border-color: rgba(24,183,207,.42); background: rgba(24,183,207,.15); color: #fff; } .wrapper { padding: 58px 0 78px; background: #f7fafc; } .wrapper .inner { overflow: visible; } .singlepage, .product, .brandDirectory, .commentForm { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 18px 52px rgba(16, 34, 55, .08); } .singlepage, .product { padding: 34px; } .entry { color: var(--kd-text); font-size: 16px; line-height: 1.9; } .entry p { margin: 0 0 18px; } .entry h1, .entry h2, .entry h3 { margin: 28px 0 14px; color: var(--kd-ink); font-weight: 800; line-height: 1.28; } .entry img { max-height: 780px; width: auto; border-radius: 6px; } .aboutPage .entry img { display: block; margin: 18px auto; } /* Product list and detail */ .products { margin-bottom: 0; } .products li .thumbnail { height: 230px; } .products li h2 { text-align: left; } .proInfo { display: grid; grid-template-columns: minmax(0, .95fr) minmax(360px, .75fr); gap: 34px; padding-bottom: 40px; border-bottom: 1px solid var(--kd-line); } .picList { width: auto; } .picList .cur { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #f4f7fb; overflow: hidden; } .picList .cur .pic { aspect-ratio: 4 / 3; } .picList .cur img { width: 100%; height: 100%; object-fit: contain; } .picList .list { margin-top: 12px; } .product .right { padding: 8px 0 0; } .posttitle { color: var(--kd-ink); font-size: clamp(30px, 3vw, 44px); font-weight: 800; line-height: 1.2; } .product .intro { margin-top: 18px; padding: 18px; border-left: 3px solid var(--kd-cyan); background: #f4f7fb; color: var(--kd-muted); } .product .meta { margin-top: 22px; border-top: 1px solid var(--kd-line); } .product .cat { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--kd-line); } .product .cat span { color: var(--kd-muted); } .product .cat li a { color: var(--kd-ink); font-weight: 700; } .product .btn { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; } .product .btn span { display: block; } .proTitle { margin: 38px 0 22px; border: 0; } .proTitle h2 { border: 0; } .proTitle h2 span { display: inline-flex; align-items: center; gap: 10px; color: var(--kd-ink); font-size: 24px; font-weight: 800; } .proTitle h2 span:before { content: ""; width: 28px; height: 3px; border-radius: 999px; background: linear-gradient(90deg, var(--kd-cyan), var(--kd-green)); } .postnavi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 32px; border: 0; } .postnavi span { padding: 14px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #f8fafc; } .commentForm { padding: 24px; margin-top: 32px; } .commentForm .item { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; margin-bottom: 14px; } .commentForm label { color: var(--kd-muted); font-weight: 700; line-height: 42px; } .commentForm .text, .commentForm textarea, .searchPage .text, .messageForm .text { width: 100%; min-height: 42px; border: 1px solid var(--kd-line); border-radius: 6px; background: #f8fafc; color: var(--kd-text); font-size: 15px; outline: none; } .commentForm textarea { min-height: 116px; } /* News */ .newslist { display: grid; gap: 18px; } .newsitem { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; margin: 0; padding: 18px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 14px 40px rgba(16, 34, 55, .07); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .newsitem .thumbnail { float: none; width: 100%; border-radius: 6px; overflow: hidden; } .newsitem .thumbnail a, .newsitem .thumbnail img { display: block; width: 100%; height: 180px; object-fit: cover; } .newsitem .info { margin: 0; padding: 0; } .newsitem .info:after, .newsitem .more { display: none; } .newsitem h2 { margin: 0 0 12px; color: var(--kd-ink); font-size: 23px; font-weight: 800; line-height: 1.35; } .newsitem .excerpt, .newsitem .date { color: var(--kd-muted); font-size: 15px; } .newsitem .date { margin-top: 16px; } /* Brand */ .brandOverview { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: 18px; margin-bottom: 22px; } .brandOverview .copy, .brandOverview .points div { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 16px 42px rgba(16, 34, 55, .07); } .brandOverview .copy { min-height: 320px; padding: 36px; background: linear-gradient(150deg, rgba(255,255,255,.95), rgba(255,255,255,.78)), radial-gradient(circle at 86% 16%, rgba(24, 183, 207, .16), transparent 34%); } .brandOverview .points { display: grid; gap: 12px; } .brandOverview .points div { padding: 24px; } .brandOverview strong { color: var(--kd-ink); font-size: 19px; font-weight: 800; } .brandOverview .points p { margin-top: 8px; color: var(--kd-muted); font-size: 15px; } .brandDirectory { padding: 30px; } .brandDirectoryHead { display: block; margin-bottom: 24px; } .brandGrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .brandRow { display: block; padding: 0; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; overflow: hidden; transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .brandRow figure { width: 100%; height: 190px; overflow: hidden; } .brandRow figure img { width: 100%; height: 100%; object-fit: cover; } .brandRow .info { padding: 20px; } .brandRow h3 { color: var(--kd-ink); font-size: 20px; font-weight: 800; line-height: 1.35; } .brandRow p { margin-top: 10px; color: var(--kd-muted); font-size: 14px; line-height: 1.75; } .textMore { width: fit-content; min-height: 36px; margin-top: 16px; padding: 0 14px; border-color: transparent; background: #eef7f8; color: var(--kd-ink); box-shadow: none; } .brandArticleHead { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 18px 52px rgba(16, 34, 55, .08); } .brandArticleHead h1 { color: var(--kd-ink); font-weight: 800; } /* Pagination and footer */ .pagebar { padding: 28px 0 0; } .pagebar .pagination { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; } .pagebar a, .pagebar span { min-width: 38px; height: 38px; padding: 0 12px; border: 1px solid var(--kd-line); border-radius: 999px; background: #fff; color: var(--kd-muted); font-size: 14px; line-height: 38px; } .pagebar a:hover, .pagebar .active, .pagebar span { border-color: rgba(24,183,207,.36); background: #eaf8fa; color: var(--kd-ink); } .footer { padding: 46px 0; border: 0; background: #07111f; color: rgba(255,255,255,.64); } .footer a { color: rgba(255,255,255,.7); } .footer a:hover { color: #fff; } .footer .pic { height: 38px; opacity: .9; } .footer .qrcode { border-radius: 6px; } @media only screen and (max-width: 1180px) { .inner { width: min(94vw, 100%); } .header .inner { min-height: 66px; } .logo { flex-basis: 154px; width: 154px; } .nav li a { padding: 23px 9px; font-size: 13px; } .heroCopy .inner, .heroGrid { grid-template-columns: minmax(0, 1fr) 330px; gap: 28px; } .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media only screen and (max-width: 1024px) { .header .inner { min-height: 62px; } .nav { position: fixed; top: 62px; right: -330px; width: 330px; height: calc(100vh - 62px); margin: 0; padding: 14px; border-left: 1px solid rgba(255,255,255,.1); background: rgba(8, 17, 30, .98); box-shadow: 0 24px 80px rgba(0,0,0,.34); } .nav.open { right: 0; } .nav ul { display: block; } .nav li a { padding: 13px 14px; border-radius: 6px; } .nav li.cur > a:before, .nav li:hover > a:before { display: none; } .nav li ul { position: static; width: auto; margin: 0; padding: 0 0 8px 12px; border: 0; background: transparent; box-shadow: none; } .nav li em { display: block; } .heroStage, .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item, .slides .item img, .heroMedia .item img { height: 620px; } .heroCopy .inner, .heroGrid, .capabilityLead, .brandOverview, .proInfo { grid-template-columns: 1fr; } .heroSignal { display: none; } .capabilityGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .capabilityGrid .wide { grid-row: auto; grid-column: span 2; min-height: 260px; } .homeBrandList { grid-template-columns: 1fr; } } @media only screen and (max-width: 768px) { body { font-size: 15px; } .inner { width: min(92vw, 100%); } .header .inner { min-height: 58px; } .logo { flex-basis: 128px; width: 128px; } .language-switcher { display: none; } .nav { top: 58px; right: -100%; width: 100%; height: calc(100vh - 58px); } .heroStage, .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item, .slides .item img, .heroMedia .item img { height: 540px; } .heroCopy h1 { max-width: 92vw; font-size: 38px; } .heroCopy p { max-width: 90vw; font-size: 15px; } .heroActions { margin-top: 22px; } .heroActions a { min-height: 40px; padding: 0 16px; } .homeCapability, .ab_box, .homeBrand, .homeNews { padding: 46px 0; } .homeCapability { margin-top: 0; padding-top: 38px; } .capabilityGrid, .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: 1fr 1fr; gap: 14px; } .capabilityGrid .wide, .ab_pro li:first-child { grid-column: span 2; } .ab_pro li:first-child a { min-height: 360px; } .sectionDeck, .homeBrandHead, .sectionHead { display: block; } .sectionDeck a, .homeBrandHead > a { margin-top: 18px; } .bar .inner { padding: 36px 0 24px; } .wrapper { padding: 34px 0 50px; } .singlepage, .product, .brandDirectory, .commentForm { padding: 20px; } .newsitem { grid-template-columns: 132px minmax(0, 1fr); gap: 14px; padding: 14px; } .newsitem .thumbnail img, .newsitem .thumbnail a { height: 108px; } .newsitem h2 { font-size: 17px; } .newsitem .excerpt { display: none; } .brandOverview .copy { min-height: auto; padding: 24px; } .postnavi { grid-template-columns: 1fr; } } @media only screen and (max-width: 520px) { .capabilityGrid, .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: 1fr; } .capabilityGrid .wide, .ab_pro li:first-child { grid-column: auto; } .capabilityGrid .wide { min-height: 240px; } .ab_pro li:first-child a { min-height: 310px; } .homeBrandList article { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; min-height: auto; } .homeBrandList figure { height: 112px; } .newsitem { grid-template-columns: 1fr; } .newsitem .thumbnail img, .newsitem .thumbnail a { height: 170px; } .commentForm .item, .product .cat { grid-template-columns: 1fr; gap: 6px; } .commentForm label { line-height: 1.5; } } @media only screen and (max-width:1280px){ .nav {margin-left:150px;} .nav li {line-height:65px; padding:0 15px; font-size:16px;} .ab_cat ul {width:102%;} .ab_cat li, .ab_cat li.cur {width:23%; padding-right:2%; opacity:1;} .ab_cat li a {padding-bottom:68.36%;} .ab_cat li h2 {bottom:50%; background-color:rgba(154,14,14,.85); transform:translateY(50%);font-size:14px; padding:2%; width:76%;} .ab_title h2 {font-size:20px;} .ab_top {width:520px;} .ab_news ul {margin-right:545px;} .ab_news li .thumbnail {width:120px;} .ab_news li .info {margin-left:130px;} .ab_news li time {display:none;} .ab_about .pic {width:450px;} .ab_about .info {padding-right:3%;} .ab_about .intro {line-height:1.75em;} .pageTitle {padding-left:15px; padding-right:15px;} .submenu {margin-left:150px; position:relative;} .submenu li a {padding-right:15px;} .related .title {padding:10px 15px;} .related h3 {font-size:18px;} .related h4 {font-size:14px;} .picList {width:380px;} .product .right {margin-left:410px;} /*1280px*/ .logo {width:148px;} } @media only screen and (max-width:1024px){ .nav li{ width:100% !important; text-align:left} .nav {position:fixed; top:55px; right:-220px; background-color:rgba(255,255,255,.95); height:100%; width:220px; overflow-y:auto; -webkit-overflow-scrolling:touch; transition:right .3s; z-index: 5; border-left:1px solid #fff; margin:0;} .nav.open {right:0;} .nav ul {float:none; padding:10px 0 55px;} .nav li {float:none; line-height: 25px; position:relative; padding:0;} .nav li a {padding:10px 45px 10px 1.5em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color:#222;} .nav li em {position:absolute; right:0; top:0; width:45px; height:45px; z-index: 2; display: block; cursor:pointer;} .nav li em:after {content:''; display:block; width:8px; height:8px; border-right:1px solid #010101; border-bottom:1px solid #010101; transform:rotate(45deg); position:absolute; left:50%; top:50%; margin:-6.3px 0 0 -6.3px; transition:all .3s;} .nav li em.open:after {transform:rotate(-135deg); margin-top:-2.5px;} .nav li ul {position:static; left:auto; top:auto; padding:0; margin:0; width:auto; background-color: transparent; border:none;} .nav li li {text-align:left;} .nav li li a {padding:10px 1.5em 10px 2.5em;} .nav li li a:hover {color:#222;} .ab_top {width:410px;} .ab_news ul {margin-right:435px;} .ab_news li .thumbnail {width:90px;} .ab_news li .info {margin-left:100px;} .ab_news li h3 {line-height:1.125em;} .ab_news li p {line-height:1.65em; height:3.3em;} .ab_about .intro {font-size:14px;} .ab_about .pic {width:46.875%;vertical-align: middle;} .ab_about figure {padding:0 5px 5px 0;} .bar {background-color:transparent; line-height:normal; border-bottom:none; margin-bottom:0;} .breadcrumb {float:none; max-width:none; padding-top:1.5%; padding-bottom:1.5%;} .pageTitle {display:none;} .submenu {margin:0; padding:0;} .submenu ul {font-size:0; line-height:normal; text-align:center;} .submenu li {float:none; display:inline-block; padding:5px 15px;} .submenu li a {padding:2px 15px;background-color:#9a0e0e; color:#fff; border-radius:8px 0 8px 0;} .submenu li a:hover, .submenu li.cur a, .submenu li.on a {color:#fff;} .submenu li.cur a:before {display:none;} .newsitem .thumbnail {width:250px;} .newsitem .info {margin-left:250px; padding:0 81px 0 20px;} .newsitem .info:after {right:60px;} .newsitem .more a {width:40px; height:40px;} .newsitem h2 {font-size:22px; margin-bottom:10px;} .newsitem .excerpt {line-height:1.75em; height:7em;} .newsitem .date {margin-top:13px;} .posttitle {font-size:24px;} .commentsList .avatar {width:35px; height:35px;} .commentsList .info, .commentsList li li {margin-left:45px;} .sidebar {display:none;} .main {margin:0;} /*1024px*/ .logo {padding:12px 0;width:127px; } } @media only screen and (max-width:960px){ .ab_top {width:350px;} .ab_news ul {margin-right:365px;} .ab_news li .thumbnail {width:77px;} .ab_news li .info {margin-left:87px;} .ab_news li h3 {line-height:1.5em;} .ab_news li p {height:auto; white-space:nowrap; text-overflow:ellipsis;} .newsitem .more {display:none;} .newsitem .info {padding-right:0;} .newsitem .info:after {display:none;} .products li h2 {font-size:14px;} #comment .text, #comment label {font-size:14px;} #comment .btn, #comment .input {margin-left:45px;} #comment .submit {font-size:14px;} #comment .verify img {height:36px;} .sidebar {float:none; width:auto; margin-bottom:3.5%;} .related .title {border-top-left-radius: 0; overflow: hidden;} .related h3 {font-size:16px; float:left; line-height: 22px;} .related h4 {float:left; line-height: 22px; padding:0 5px;} .picList {width:320px;} .product .right {margin-left:350px;} .product .posttitle {text-align:center;} .product .intro {padding:15px;} .product .btn a {font-size:12px;} } @media only screen and (max-width:768px){ .language-switcher{ padding: 13px 10px 0 0 !important;} .language-dropdown{width: 280% !important;left: -124% !important;} .language-item{ padding: 0 !important;} .nav {width:100%; right:-100%; background-color:#fff; top:54px; border-top:1px solid #e4e4e4;} .nav ul {padding-bottom:54px; padding-top:0;} .nav li {border-bottom:1px solid #eee;} .nav li li {border-top:1px solid #eee; border-bottom:none;} .slides .owl-dots {bottom:8.3%;} .slides .owl-dot.active span {width:25px;} .searchForm form {float:none; width:auto; padding:5px;} .searchForm .input {margin-right:40px;} .ab_cat li, .ab_cat li.cur {width:48%; padding-top:1%; padding-bottom:1%;} .ab_cat li h2 {font-size:12px; border-radius:5px;} .ab_title {margin-bottom:3.9%;} .ab_title h2 {font-size:18px; padding-bottom:5px;} .ab_pro li.li1 {width:48%; padding-bottom:2%;} .ab_pro li {width:48%; padding-right:2%; padding-bottom:2%;} .ab_pro li h3 {opacity:1; top:auto; bottom:5%; margin-top:0; left:5%; width:80%;} .ab_pro li a:hover:after {opacity:0;} .ab_pro li a:hover h3 {top:auto;opacity:1;} .ab_pro li a:hover img {transform:none;} .ab_top {width:auto; float:none; margin-bottom:10px;} .ab_news ul {margin-right:0;} .ab_news li .thumbnail {width:120px;} .ab_news li .info {margin-left:130px;} .ab_news li h3 {line-height:1.75em;} .ab_news li p {line-height:1.875em; height:3.75em; white-space:normal;} .ab_about {display:block; width:auto;} .ab_about .info {display:block; width:auto; padding-right:0; } .ab_about .intro p {padding:0; margin-bottom:10px;} .ab_about .pic {display:block; width:auto;} .ab_video li {width:48%; padding-bottom:1%;} .ab_video h4 {padding:5px; font-size:14px;} .links {padding:10px 0;} .footer {padding:5% 0 3%;} .footer .right {display: none;} .footer .left {margin-right:0;} .footer .pic {display:none;} .pagesList ul {font-size:0; line-height: normal; text-align:center;} .pagesList li {display:inline-block; float:none; font-size:14px; line-height: 1.75em;} .copyright {text-align:center; line-height: 1.5em; font-size:12px;} .social ul {text-align:center;} .social li {margin:0 5px;} .social li a {width:30px; height:30px;} .submenu {margin-top:1.5%;} .submenu li {font-size:12px; padding:2px 8px;} .wrapper {padding:5.5% 0;} .newslist, .products {margin-bottom:3%;} .newsitem {padding-bottom:10px; margin-bottom:10px;} .newsitem .thumbnail {width:110px;} .newsitem .info {margin-left:120px; padding:0;} .newsitem h2 {font-size:16px; white-space:normal; line-height:1.5em; max-height:3em; margin-bottom:5px;} .newsitem .excerpt {font-size:14px; height:auto; display: block; white-space:nowrap;} .newsitem .more, .newsitem .date {display: none;} .posttitle {font-size:18px; line-height:1.5em; margin-bottom:3.5%;} .postmeta {margin-bottom:5%;} .boxtitle {font-size:16px; margin-bottom:12px;} .postnavi {width:auto;} .postnavi span {float:none; width:auto; padding:2px 0;} .postnavi .r { text-align:left;} .relatednews ul {width:auto;} .relatednews li {width:auto; float:none; padding:2px 0; font-size:14px;} .entry {font-size:14px;} .entry p, .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6, .entry table, .entry hr, .entry ul, .entry ol, .video {margin-bottom:3.5%;} .entry blockquote {margin-bottom:3.5%; padding:3.5% 3.5% 0 3.5%; border-left-width:5px;} .tags {margin-bottom:3.5%;} #comment label {float:none; height:auto; line-height: 1.75em;} #comment .input, #comment .btn {margin-left:0;} #comment .submit {float:none;} .picList {float:none; width:auto; margin-bottom:15px;} .product .right {margin-left:0;} .product .intro {font-size:14px; margin-bottom:10px;} .product .meta {margin-bottom:10px;} .product .meta span {height:34px; line-height: 34px;} .product .meta a {padding:0 10px;} .product .meta .cat {padding:2px 0;} .product .btn a {height:32px; line-height: 32px; font-size:14px;} .product .proTitle {margin-bottom:15px;} .product .proTitle h2 {padding:5px 15px 0;} .error404 .title {font-size:24px;} .error404 .intro {font-size:16px;} .error404 .intro a {display: block;clear:both;color:#9a0e0e;} /*768px*/ .pagenavi {font-size:12px;} } @media only screen and (max-width:540px){ .products ul {width:103%;} .products li {width: 47%; padding-right:3%; padding-bottom:3%;} .products li h2 {padding-left:5px; padding-right:5px;} } .adminbuy_cn img{ max-width:100% !important; height:auto !important;display:inline-block;} .adminbuy_cn p{text-wrap: inherit !important;} .adminbuy_cn p span{text-wrap: inherit !important;} /* AB模板网新增分页样式 www.admibnuy.cn */ .pagebar { padding:20px; overflow:hidden; clear:both} .pagebar .pagination { display: flex; justify-content: center; margin-top: 10px; } .pagination a { background: #fff; border: 1px solid #ccc; color: #333; font-size: 12px; padding: 8px 10px; margin: 0 2px; border-radius: 3px; line-height:100% } .pagination span { color: #333; font-size: 12px; padding: 7px 2px; margin: 0 2px; border-radius: 3px; } .pagination a:hover { color: #333; border: 1px solid #333; } .pagination a.page-num-current { color: #fff; background: #333; border: 1px solid #333; } .pagination .st{ font-family:宋体} .text-secondary{ text-align:center; padding:20px 0} /* 语言切换按钮容器 */ .language-switcher { position: relative; display: inline-block;float: right;padding: 23px 10px 0 0; } /* 语言切换按钮 */ .language-btn { display: flex; border-radius: 4px; cursor: pointer; gap: 5px; font-size: 14px; color: #333; } .language-btn .globe-icon { font-size: 16px; } .language-btn .arrow-icon { margin-left: 5px; transition: transform 0.3s; } .language-list .hidden{ display:none} /* 下拉框容器 */ .language-dropdown { position: absolute; top: calc(100% + 5px); right: 0; background: #fff; border: 1px solid #ddd; border-radius: 4px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); display: none; z-index: 1000; width:400px; } /* 语言列表 */ .language-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; padding: 10px; max-height: 230px; overflow-y: auto; } /* 语言选项 */ .language-item { display: flex; align-items: center; padding: 6px 8px; cursor: pointer; border-radius: 4px; gap: 5px; font-size: 13px; color: #333; height: 30px;overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .language-item a{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;} .language-item:hover { background: #f5f5f5; } .language-item img { width: 16px; height: 12px; object-fit: cover; } /* More Language按钮 */ .more-languages { text-align: center; padding: 8px; border-top: 1px solid #eee; cursor: pointer; color: #666; font-size: 13px; height: 40px; line-height: 40px; } .more-languages:hover { color: #333; background: #f5f5f5; } /* 展开状态 */ .language-dropdown.active { display: block; background: white; } .language-list.show-all { max-height: 400px; } /* 滚动条样式 */ .language-list::-webkit-scrollbar { width: 6px; } .language-list::-webkit-scrollbar-track { background: #f1f1f1; } .language-list::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; } .language-list::-webkit-scrollbar-thumb:hover { background: #999; } .brandIntro { margin-bottom: 28px; padding-bottom: 20px; border-bottom: 1px solid #ececec; } .brandIntro h1 { font-size: 28px; line-height: 1.35; color: #222; margin-bottom: 10px; } .brandIntro p { font-size: 15px; line-height: 1.9; color: #666; } .brandGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; } .brandCard { border: 1px solid #eee; background: #fff; transition: border-color .2s, box-shadow .2s, transform .2s; } .brandCard:hover { border-color: #d8d8d8; box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-2px); } .brandCard a { display: block; color: inherit; } .brandThumb { aspect-ratio: 4 / 3; background: #f6f6f6; overflow: hidden; } .brandThumb img { width: 100%; height: 100%; object-fit: cover; display: block; } .brandInfo { padding: 18px; } .brandInfo h2 { font-size: 18px; line-height: 1.45; color: #222; margin-bottom: 10px; } .brandInfo p { min-height: 52px; font-size: 14px; line-height: 1.8; color: #666; } .brandInfo span { display: inline-block; margin-top: 14px; font-size: 13px; color: #0b65c2; } .brandDetail { max-width: 980px; margin: 0 auto; } .brandHead { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid #ececec; } .brandHead p { margin-bottom: 8px; font-size: 14px; color: #0b65c2; } .brandHead h1 { font-size: 30px; line-height: 1.35; color: #222; } .brandHead time { flex: 0 0 auto; font-size: 14px; color: #888; } .brandCover { margin: 28px 0; background: #f6f6f6; text-align: center; } .brandCover img { max-width: 100%; height: auto; display: inline-block; } .brandBody { font-size: 16px; line-height: 1.9; color: #444; } @media screen and (max-width: 900px) { .brandGrid { grid-template-columns: repeat(2, 1fr); gap: 16px; } } @media screen and (max-width: 640px) { .brandGrid { grid-template-columns: 1fr; } .brandHead { display: block; } .brandHead h1 { font-size: 24px; } .brandHead time { display: block; margin-top: 10px; } } /* Inner page refresh */ .banner { display: none; } .bar { margin: 0; border-bottom: 1px solid #e8edf3; background: #fff; } .bar .inner { position: relative; padding: 34px 0 22px; overflow: visible; } .pageTitle { display: block; position: static; float: left; width: auto; min-width: 220px; padding: 0; background: transparent; color: #1f2933; text-align: left; } .pageTitle .cn { font-size: 30px; line-height: 1.3; font-weight: 600; color: #1f2933; } .pageTitle .en { margin-top: 6px; font-size: 13px; line-height: 1.4; color: #8a97a6; letter-spacing: 0; } .breadcrumb { float: right; max-width: 48%; padding: 9px 0 0; background: none; color: #8a97a6; line-height: 1.7; } .breadcrumb a { color: #687484; } .submenu { clear: both; margin: 24px 0 0; padding: 0; font-size: 0; } .submenu li { float: none; display: inline-block; margin: 0 10px 10px 0; font-size: 14px; line-height: 1.4; } .submenu li a { display: block; padding: 8px 16px; border: 1px solid #dce3eb; border-radius: 4px; color: #425466; background: #fff; } .submenu li.cur a, .submenu li a:hover { color: #fff; border-color: #0b65c2; background: #0b65c2; } .submenu li.cur a:before { display: none; } .wrapper { padding: 42px 0 56px; background: #fff; } .wrapper .inner { overflow: visible; } .singlepage, .brandDetail, .product, .newslist, .products { max-width: 1120px; margin: 0 auto; } .singlepage .posttitle { margin-bottom: 22px; text-align: left; font-size: 30px; font-weight: 600; color: #1f2933; } .singlepage .entry { padding: 0; } .entry { color: #36414c; font-size: 16px; line-height: 1.95; } .entry p, .entry table { margin-bottom: 20px; } .entry table { width: 100% !important; border-collapse: collapse; } .entry table td, .entry table th { padding: 10px 12px; border: 1px solid #e1e7ef; } .entry img { border-radius: 4px; } .brandIntro { margin-bottom: 30px; padding: 0 0 22px; border-bottom: 1px solid #e8edf3; } .brandIntro h1 { font-size: 28px; font-weight: 600; color: #1f2933; } .brandIntro p { max-width: 760px; color: #647281; } .brandGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; } .brandCard { border-color: #e3e9f0; border-radius: 6px; overflow: hidden; } .brandInfo h2 { font-weight: 600; } .brandInfo span { color: #0b65c2; } .brandHead { align-items: center; padding-bottom: 22px; border-bottom-color: #e8edf3; } .brandHead h1 { font-weight: 600; } .brandCover { margin: 28px 0 30px; border-radius: 6px; overflow: hidden; } .newsitem { padding: 18px; margin-bottom: 18px; border: 1px solid #e3e9f0; border-radius: 6px; transition: border-color .2s, box-shadow .2s; } .newsitem:hover { border-color: #cbd6e2; box-shadow: 0 8px 22px rgba(31,41,51,.06); } .newsitem .thumbnail { width: 260px; border-radius: 4px; background: #f4f7fa; } .newsitem .info { margin-left: 280px; padding: 4px 0 0 24px; } .newsitem .info:after, .newsitem .more { display: none; } .newsitem h2 { font-size: 22px; font-weight: 600; } .products ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; width: auto; } .products li { float: none; width: auto; padding: 0; } .products li .box { height: 100%; border-color: #e3e9f0; border-radius: 6px; overflow: hidden; background: #fff; transition: border-color .2s, box-shadow .2s; } .products li .box:hover { border-color: #cbd6e2; box-shadow: 0 8px 22px rgba(31,41,51,.06); } .products li .thumbnail { aspect-ratio: 4 / 3; background: #f4f7fa; } .products li .thumbnail img { width: 100%; height: 100%; object-fit: cover; } .products li h2 { padding: 14px 16px; font-weight: 600; text-align: left; } .pagebar { margin-top: 28px; } .pagination { text-align: center; } .pagination a, .pagination span { display: inline-block; margin: 0 3px 6px; padding: 8px 12px; border: 1px solid #dce3eb; border-radius: 4px; color: #425466; } .pagination a:hover, .pagination .active, .pagination .page-num-current { color: #fff; border-color: #0b65c2; background: #0b65c2; } @media only screen and (max-width: 960px) { .pageTitle, .breadcrumb { float: none; max-width: none; } .breadcrumb { padding-top: 14px; } .submenu { margin-top: 18px; } .products ul, .brandGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media only screen and (max-width: 768px) { .bar .inner { padding: 24px 0 16px; } .pageTitle { display: block; } .pageTitle .cn, .singlepage .posttitle, .brandHead h1 { font-size: 24px; } .submenu { text-align: left; } .submenu li { padding: 0; margin-right: 6px; } .submenu li a { padding: 7px 12px; border-radius: 4px; background: #fff; color: #425466; } .submenu li.cur a, .submenu li a:hover { color: #fff; background: #0b65c2; } .wrapper { padding: 28px 0 42px; } .newsitem { padding: 12px; } .newsitem .thumbnail { width: 110px; } .newsitem .info { margin-left: 122px; padding: 0; } .newsitem h2 { font-size: 16px; } .products ul, .brandGrid { gap: 14px; } } @media only screen and (max-width: 520px) { .products ul, .brandGrid { grid-template-columns: 1fr; } } /* Product-led homepage refinement */ .slides .item img { max-height: 560px; object-fit: cover; } main .ab_box { padding: 48px 0; } .ab_bg { background: #f7f9fb; } .ab_title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; } .ab_title h2 { font-size: 28px; font-weight: 600; color: #1f2933; } .ab_title h2:after { display: none; } .ab_title a { position: static; width: auto; height: auto; color: #0b65c2; font-size: 14px; } .ab_title a i { display: none; } .ab_pro ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; width: auto; } .ab_pro li, .ab_pro li.li1 { float: none; width: auto; padding: 0; } .ab_pro li a { border: 1px solid #e3e9f0; border-radius: 6px; background: #fff; overflow: hidden; transition: border-color .2s, box-shadow .2s; } .ab_pro li a:after { display: none; } .ab_pro li a:hover { border-color: #cbd6e2; box-shadow: 0 8px 22px rgba(31,41,51,.06); } .ab_pro li .thumbnail { aspect-ratio: 4 / 3; background: #eef3f8; } .ab_pro li img { width: 100%; height: 100%; object-fit: cover; } .ab_pro li h3, .ab_pro li a:hover h3 { position: static; width: auto; height: auto; margin: 0; padding: 14px 16px; border-radius: 0; background: #fff; color: #1f2933; opacity: 1; text-align: left; font-weight: 600; line-height: 1.45; } .homeBrand { padding: 48px 0; background: #fff; } .homeBrandHead { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 22px; } .homeBrandHead span, .brandOverview .copy span, .brandArticleHead .copy span { display: inline-block; margin-bottom: 8px; color: #0b65c2; font-size: 13px; } .homeBrandHead h2, .brandOverview h1 { font-size: 28px; font-weight: 600; color: #1f2933; line-height: 1.35; } .homeBrandHead p { max-width: 700px; margin-top: 8px; color: #647281; line-height: 1.8; } .homeBrandHead > a { flex: 0 0 auto; padding: 9px 18px; border: 1px solid #0b65c2; border-radius: 4px; color: #0b65c2; } .homeBrandList { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .homeBrandList article { display: grid; grid-template-columns: 96px 1fr; gap: 16px; padding: 16px; border: 1px solid #e3e9f0; border-radius: 6px; background: #f9fbfd; } .homeBrandList figure { aspect-ratio: 1 / 1; overflow: hidden; border-radius: 4px; background: #eef3f8; } .homeBrandList img { width: 100%; height: 100%; object-fit: cover; } .homeBrandList h3 { font-size: 17px; font-weight: 600; line-height: 1.4; } .homeBrandList p { margin-top: 8px; color: #647281; line-height: 1.7; } .ab_news { background: #fff; } .links { display: none; } /* Brand system pages */ .brandOverview { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 34px; align-items: stretch; margin-bottom: 36px; } .brandOverview .copy { padding: 34px; border: 1px solid #e3e9f0; border-radius: 6px; background: #fff; } .brandOverview .copy p { margin-top: 12px; color: #647281; font-size: 16px; line-height: 1.9; } .brandOverview .points { display: grid; gap: 12px; } .brandOverview .points div { padding: 20px; border: 1px solid #e3e9f0; border-radius: 6px; background: #f7f9fb; } .brandOverview strong { display: block; margin-bottom: 6px; color: #1f2933; font-size: 16px; } .brandOverview .points p { color: #647281; line-height: 1.75; } .sectionHead { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid #e8edf3; } .sectionHead h2 { color: #1f2933; font-size: 24px; font-weight: 600; } .sectionHead p { max-width: 620px; color: #647281; line-height: 1.8; } .brandList { display: grid; gap: 16px; } .brandRow { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 22px; padding: 18px; border: 1px solid #e3e9f0; border-radius: 6px; background: #fff; transition: border-color .2s, box-shadow .2s; } .brandRow:hover { border-color: #cbd6e2; box-shadow: 0 8px 22px rgba(31,41,51,.06); } .brandRow figure { aspect-ratio: 4 / 3; overflow: hidden; border-radius: 4px; background: #eef3f8; } .brandRow img { width: 100%; height: 100%; object-fit: cover; } .brandRow h3 { margin-top: 4px; font-size: 21px; line-height: 1.4; font-weight: 600; } .brandRow p { margin-top: 10px; color: #647281; line-height: 1.85; } .textMore { display: inline-block; margin-top: 14px; color: #0b65c2; } .brandArticle { max-width: 1080px; margin: 0 auto; } .brandArticleHead { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 34px; align-items: center; margin-bottom: 34px; padding: 28px; border: 1px solid #e3e9f0; border-radius: 6px; background: #f9fbfd; } .brandArticleHead h1 { color: #1f2933; font-size: 32px; line-height: 1.35; font-weight: 600; } .brandArticleHead .copy p { margin-top: 12px; color: #647281; line-height: 1.85; } .brandArticleHead figure { overflow: hidden; border-radius: 6px; background: #eef3f8; } .brandArticleHead img { width: 100%; max-height: 240px; object-fit: cover; display: block; } .brandBody { max-width: 880px; margin: 0 auto 28px; } .brandBody p:has(img) { display: inline-block; width: 31.6%; margin: 0 1.2% 18px 0; vertical-align: top; } .brandBody p:has(img) img { width: 100%; height: 180px !important; object-fit: cover; display: block; } .brandCover, .brandGrid, .brandIntro { display: none; } @media only screen and (max-width: 960px) { .ab_pro ul { grid-template-columns: repeat(3, minmax(0, 1fr)); } .homeBrandList, .brandOverview, .brandArticleHead { grid-template-columns: 1fr; } .brandArticleHead figure { max-width: 360px; } } @media only screen and (max-width: 768px) { .slides .item img { max-height: 360px; } main .ab_box, .homeBrand { padding: 32px 0; } .ab_pro ul, .homeBrandList { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .homeBrandHead, .sectionHead { display: block; } .homeBrandHead > a { display: inline-block; margin-top: 14px; } .brandOverview .copy, .brandArticleHead { padding: 20px; } .brandRow { grid-template-columns: 120px minmax(0, 1fr); gap: 14px; padding: 14px; } .brandBody p:has(img) { width: 48%; } } @media only screen and (max-width: 520px) { .ab_pro ul, .homeBrandList { grid-template-columns: 1fr; } .homeBrandList article, .brandRow { grid-template-columns: 88px minmax(0, 1fr); } .brandBody p:has(img) { width: 100%; margin-right: 0; } } /* 2026 final visual refresh override */ :root { --kd-ink: #07111f; --kd-text: #182233; --kd-muted: #647184; --kd-soft: #eef3f7; --kd-panel: #fff; --kd-line: rgba(16, 34, 55, .1); --kd-dark: #08111e; --kd-cyan: #18b7cf; --kd-green: #36c58a; --kd-coral: #ff7a59; --kd-shadow: 0 24px 70px rgba(13, 32, 54, .12); --kd-radius: 8px; } html { background: #f4f7fb; } body { background: linear-gradient(180deg, #f7fafc 0, #eef3f7 560px, #f7fafc 100%); color: var(--kd-text); font-family: "Inter", "Microsoft YaHei", "PingFang SC", Arial, sans-serif; font-size: 16px; line-height: 1.75; letter-spacing: 0; } a, a:hover { color: inherit; } .inner { width: min(1200px, calc(100vw - 56px)); max-width: none; } .header { position: sticky; top: 0; z-index: 99; background: rgba(8, 17, 30, .9); border-bottom: 1px solid rgba(255,255,255,.09); box-shadow: 0 16px 45px rgba(0,0,0,.18); backdrop-filter: blur(18px); } .header .inner { display: flex; align-items: center; min-height: 74px; overflow: visible; } .logo { float: none; flex: 0 0 188px; width: 188px; height: 50px; } .logo a { height: 50px; background-size: contain; background-position: left center; } .language-switcher { order: 3; float: none; margin-left: 14px; padding: 0 !important; } .language-btn { height: 38px; padding: 0 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.86); font-size: 13px; } .language-btn .globe-icon img { width: 19px !important; } .language-dropdown { top: 48px; right: 0; left: auto; width: 280px !important; padding: 10px; border: 1px solid rgba(255,255,255,.12); border-radius: var(--kd-radius); background: rgba(9,18,31,.97); box-shadow: 0 24px 60px rgba(0,0,0,.3); } .language-item { border-radius: 6px; } .language-item a { color: rgba(255,255,255,.82); } .language-item:hover { background: rgba(255,255,255,.08); } .nav { float: none; flex: 1 1 auto; margin-left: 28px; } .nav ul { display: flex; justify-content: flex-end; align-items: center; gap: 2px; float: none; } .nav li { float: none; width: auto !important; } .nav li a { padding: 27px 13px; color: rgba(255,255,255,.78); font-size: 14px; font-weight: 500; line-height: 20px; } .nav li a:after { display: none; } .nav li.cur > a, .nav li:hover > a { color: #fff; } .nav li.cur > a:before, .nav li:hover > a:before { content: ""; position: absolute; left: 13px; right: 13px; bottom: 17px; height: 2px; border-radius: 999px; background: linear-gradient(90deg, var(--kd-cyan), var(--kd-green)); } .nav li ul { top: 72px; width: 190px; padding: 10px; border: 1px solid rgba(255,255,255,.1); border-radius: var(--kd-radius); background: rgba(9,18,31,.96); box-shadow: 0 24px 60px rgba(0,0,0,.28); } .nav li ul li a { padding: 10px 12px; color: rgba(255,255,255,.76); border-radius: 6px; } .nav li ul li a:hover { background: rgba(255,255,255,.08); } .searchForm { display: none !important; } .heroStage { position: relative; min-height: 680px; overflow: hidden; background: var(--kd-dark); } .heroStage:before { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(5,12,22,.92) 0, rgba(5,12,22,.74) 45%, rgba(5,12,22,.2) 100%), radial-gradient(circle at 78% 24%, rgba(24,183,207,.28), transparent 34%), repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px 90px); pointer-events: none; } .heroStage:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; height: 140px; background: linear-gradient(180deg, transparent, #f4f7fb); pointer-events: none; } .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item, .slides .item img, .heroMedia .item img { height: 680px; } .slides .item img, .heroMedia .item img { object-fit: cover; transform: scale(1.03); filter: saturate(1.06) contrast(1.04); } .heroCopy { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; padding-top: 0; pointer-events: none; } .heroCopy .inner, .heroGrid { display: grid; grid-template-columns: minmax(0, 1.05fr) 380px; align-items: center; gap: 48px; } .heroIntro, .heroSignal, .heroActions a { pointer-events: auto; } .heroCopy span, .capabilityLead span, .sectionDeck span, .homeBrandHead span, .brandOverview .copy span, .brandDirectoryHead span, .brandRow .info span { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; color: var(--kd-cyan); font-size: 12px; font-weight: 800; line-height: 1; text-transform: uppercase; letter-spacing: 0; } .heroCopy span:before, .capabilityLead span:before, .sectionDeck span:before, .homeBrandHead span:before, .brandOverview .copy span:before, .brandDirectoryHead span:before, .brandRow .info span:before { content: ""; width: 28px; height: 2px; border-radius: 999px; background: currentColor; } .heroCopy h1 { max-width: 780px; color: #fff; font-size: clamp(42px, 5vw, 72px); font-weight: 800; line-height: 1.08; letter-spacing: 0; } .heroCopy p { max-width: 680px; margin-top: 22px; color: rgba(255,255,255,.76); font-size: 18px; line-height: 1.85; } .heroActions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 34px; } .heroActions a, .homeBrandHead > a, .ab_title a, .textMore, .product .btn a, .commentForm .submit { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border: 1px solid rgba(24,183,207,.3); border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; font-size: 14px; font-weight: 700; line-height: 1; transition: transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease; } .heroActions a.primary, .product .btn a, .commentForm .submit { border-color: transparent; background: linear-gradient(135deg, var(--kd-cyan), var(--kd-green)); color: #05111c; box-shadow: 0 18px 44px rgba(24,183,207,.24); } .heroActions a:hover, .homeBrandHead > a:hover, .ab_title a:hover, .textMore:hover { transform: translateY(-2px); } .heroSignal { position: relative; padding: 28px; border: 1px solid rgba(255,255,255,.16); border-radius: var(--kd-radius); background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.06)); box-shadow: 0 28px 80px rgba(0,0,0,.28); backdrop-filter: blur(16px); } .heroSignal strong { display: block; color: #fff; font-size: 32px; line-height: 1.1; } .heroSignal p { margin-top: 10px; color: rgba(255,255,255,.68); font-size: 14px; line-height: 1.65; } .heroSignal ul { margin-top: 24px; } .heroSignal li { display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 12px; padding: 14px 0; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.86); } .heroSignal em { width: 36px; height: 36px; border-radius: 50%; background: rgba(24,183,207,.16); color: var(--kd-cyan); font-size: 12px; font-style: normal; font-weight: 800; text-align: center; line-height: 36px; } .homeMain { position: relative; z-index: 4; } .homeCapability, .ab_box, .homeBrand, .homeNews { padding: 78px 0; } .homeCapability { margin-top: -46px; padding-top: 0; } .capabilityLead { display: grid; grid-template-columns: 320px minmax(0, 1fr); align-items: end; gap: 52px; margin-bottom: 28px; } .capabilityLead h2, .sectionDeck h2, .homeBrandHead h2, .brandOverview h1, .brandDirectoryHead h2, .pageTitle .cn { color: var(--kd-ink); font-size: clamp(30px, 3.2vw, 46px); font-weight: 800; line-height: 1.18; letter-spacing: 0; } .capabilityGrid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 16px; } .capabilityGrid article { min-height: 220px; padding: 26px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 18px 48px rgba(16,34,55,.08); } .capabilityGrid .wide { grid-row: span 2; min-height: 456px; background: linear-gradient(150deg, rgba(8,17,30,.96), rgba(16,31,48,.9)), radial-gradient(circle at 20% 10%, rgba(24,183,207,.26), transparent 34%); color: #fff; } .capabilityGrid article span { color: var(--kd-cyan); font-size: 12px; font-weight: 800; text-transform: uppercase; } .capabilityGrid h3 { margin-top: 18px; color: inherit; font-size: 24px; font-weight: 800; line-height: 1.25; } .capabilityGrid p { margin-top: 14px; color: var(--kd-muted); font-size: 15px; line-height: 1.8; } .capabilityGrid .wide p { color: rgba(255,255,255,.72); } .sectionDeck, .homeBrandHead, .sectionHead { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 28px; margin-bottom: 34px; } .sectionDeck p, .homeBrandHead p, .brandDirectoryHead p, .brandOverview .copy p { max-width: 700px; margin-top: 12px; color: var(--kd-muted); font-size: 16px; line-height: 1.8; } .sectionDeck a, .homeBrandHead > a { min-width: 128px; border-color: var(--kd-line); background: var(--kd-panel); color: var(--kd-ink); box-shadow: 0 12px 32px rgba(16,34,55,.08); } .sectionDeck a i { position: static; width: auto; height: auto; margin: 0; background: none; } .sectionDeck a i:before { content: "More"; color: var(--kd-ink); font-size: 13px; font-style: normal; } .homeProducts { background: #f8fafc; } .ab_pro ul, .products ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; width: auto; overflow: visible; } .ab_pro li, .ab_pro li.li1, .products li { float: none; width: auto; padding: 0; } .ab_pro li:first-child { grid-column: span 2; grid-row: span 2; } .ab_pro li a, .products li .box { position: relative; display: block; height: 100%; min-height: 252px; overflow: hidden; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: var(--kd-panel); box-shadow: 0 16px 40px rgba(16,34,55,.08); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .ab_pro li:first-child a { min-height: 522px; background: var(--kd-dark); } .ab_pro li a:after { display: none; } .ab_pro li .thumbnail, .products li .thumbnail { height: 200px; overflow: hidden; } .ab_pro li:first-child .thumbnail { height: 100%; } .ab_pro li img, .products li .thumbnail img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; } .ab_pro li h3, .ab_pro li a:hover h3, .products li h2 { position: static; width: auto; height: auto; margin: 0; padding: 16px 18px 18px; border-radius: 0; background: var(--kd-panel); color: var(--kd-ink); opacity: 1; text-align: left; font-size: 16px; font-weight: 800; line-height: 1.35; white-space: normal; } .ab_pro li:first-child h3 { position: absolute; left: 22px; right: 22px; bottom: 22px; z-index: 2; padding: 18px 20px; border: 1px solid rgba(255,255,255,.16); background: rgba(8,17,30,.72); color: #fff; backdrop-filter: blur(14px); } .ab_pro li a:hover, .products li .box:hover, .homeBrandList article:hover, .newsitem:hover, .brandRow:hover { transform: translateY(-5px); border-color: rgba(24,183,207,.32); box-shadow: 0 26px 70px rgba(13,32,54,.14); } .ab_pro li a:hover img, .products li .box:hover img { transform: scale(1.06); } .homeBrand { position: relative; overflow: hidden; background: linear-gradient(135deg, #08111e 0, #122336 100%), radial-gradient(circle at 80% 20%, rgba(24,183,207,.22), transparent 34%); } .homeBrand:before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 78px 78px; opacity: .45; pointer-events: none; } .homeBrand .inner { position: relative; z-index: 1; } .homeBrandHead h2, .homeBrandHead p { color: #fff; } .homeBrandHead p { color: rgba(255,255,255,.66); } .homeBrandHead > a { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.16); color: #fff; } .homeBrandList { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .homeBrandList article { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 18px; align-items: center; min-height: 190px; padding: 18px; border: 1px solid rgba(255,255,255,.12); border-radius: var(--kd-radius); background: rgba(255,255,255,.08); box-shadow: none; backdrop-filter: blur(12px); } .homeBrandList figure { height: 150px; border-radius: 6px; } .homeBrandList img { width: 100%; height: 100%; object-fit: cover; } .homeBrandList h3 { color: #fff; font-size: 19px; font-weight: 800; line-height: 1.35; } .homeBrandList p { margin-top: 10px; color: rgba(255,255,255,.66); font-size: 14px; line-height: 1.75; } .homeNews, .ab_news { background: #f4f7fb; } .ab_news .ab_top { display: none; } .ab_news ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } .ab_news li { display: block; margin: 0; padding: 0; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; overflow: hidden; box-shadow: 0 16px 40px rgba(16,34,55,.07); } .ab_news li .thumbnail { width: 100%; height: 156px; } .ab_news li .thumbnail img { width: 100%; height: 100%; object-fit: cover; } .ab_news li .info { margin: 0; padding: 18px; } .ab_news li h3 { font-size: 17px; font-weight: 800; line-height: 1.45; } .ab_news li p { margin-top: 8px; color: var(--kd-muted); font-size: 14px; } .ab_news li time { display: block; margin-top: 14px; color: var(--kd-cyan); font-size: 13px; font-weight: 700; } .bar { margin: 0; border: 0; background: linear-gradient(135deg, #08111e 0, #13253a 100%), radial-gradient(circle at 76% 18%, rgba(24,183,207,.25), transparent 32%); } .bar .inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 54px 0 34px; overflow: visible; } .pageTitle, .breadcrumb { float: none; max-width: none; } .breadcrumb { order: 2; padding: 0; color: rgba(255,255,255,.58); font-size: 13px; } .breadcrumb a { color: rgba(255,255,255,.78); } .pageTitle { order: 1; padding: 0; } .pageTitle .cn { color: #fff; } .pageTitle .en { margin-top: 10px; color: rgba(255,255,255,.4); font-size: 14px; font-weight: 600; text-transform: uppercase; } .submenu { order: 3; display: flex; flex-wrap: wrap; gap: 10px; float: none; padding: 0; margin: 0; } .submenu li { float: none; } .submenu li a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(255,255,255,.06); color: rgba(255,255,255,.72); font-size: 14px; } .submenu li.cur a, .submenu li a:hover { border-color: rgba(24,183,207,.42); background: rgba(24,183,207,.15); color: #fff; } .wrapper { padding: 58px 0 78px; background: #f7fafc; } .wrapper .inner { overflow: visible; } .singlepage, .product, .brandDirectory, .commentForm { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 18px 52px rgba(16,34,55,.08); } .singlepage, .product { padding: 34px; } .entry { color: var(--kd-text); font-size: 16px; line-height: 1.9; } .entry p { margin: 0 0 18px; } .entry h1, .entry h2, .entry h3 { margin: 28px 0 14px; color: var(--kd-ink); font-weight: 800; line-height: 1.28; } .entry img { max-height: 780px; width: auto; border-radius: 6px; } .products { margin-bottom: 0; } .products li .thumbnail { height: 230px; } .products li h2 { text-align: left; } .proInfo { display: grid; grid-template-columns: minmax(0, .95fr) minmax(360px, .75fr); gap: 34px; padding-bottom: 40px; border-bottom: 1px solid var(--kd-line); } .picList { width: auto; } .picList .cur { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #f4f7fb; overflow: hidden; } .picList .cur .pic { aspect-ratio: 4 / 3; } .picList .cur img { width: 100%; height: 100%; object-fit: contain; } .product .right { padding: 8px 0 0; } .posttitle { color: var(--kd-ink); font-size: clamp(30px, 3vw, 44px); font-weight: 800; line-height: 1.2; } .product .intro { margin-top: 18px; padding: 18px; border-left: 3px solid var(--kd-cyan); background: #f4f7fb; color: var(--kd-muted); } .product .meta { margin-top: 22px; border-top: 1px solid var(--kd-line); } .product .cat { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--kd-line); } .product .cat span { color: var(--kd-muted); } .product .btn { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; } .product .btn span { display: block; } .proTitle { margin: 38px 0 22px; border: 0; } .proTitle h2 { border: 0; } .proTitle h2 span { display: inline-flex; align-items: center; gap: 10px; color: var(--kd-ink); font-size: 24px; font-weight: 800; } .proTitle h2 span:before { content: ""; width: 28px; height: 3px; border-radius: 999px; background: linear-gradient(90deg, var(--kd-cyan), var(--kd-green)); } .postnavi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 32px; border: 0; } .postnavi span { padding: 14px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #f8fafc; } .commentForm { padding: 24px; margin-top: 32px; } .commentForm .item { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; margin-bottom: 14px; } .commentForm label { color: var(--kd-muted); font-weight: 700; line-height: 42px; } .commentForm .text, .commentForm textarea { width: 100%; min-height: 42px; border: 1px solid var(--kd-line); border-radius: 6px; background: #f8fafc; color: var(--kd-text); font-size: 15px; } .commentForm textarea { min-height: 116px; } .newslist { display: grid; gap: 18px; } .newsitem { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; margin: 0; padding: 18px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 14px 40px rgba(16,34,55,.07); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .newsitem .thumbnail { float: none; width: 100%; border-radius: 6px; } .newsitem .thumbnail a, .newsitem .thumbnail img { display: block; width: 100%; height: 180px; object-fit: cover; } .newsitem .info { margin: 0; padding: 0; } .newsitem .info:after, .newsitem .more { display: none; } .newsitem h2 { margin: 0 0 12px; color: var(--kd-ink); font-size: 23px; font-weight: 800; line-height: 1.35; } .newsitem .excerpt, .newsitem .date { color: var(--kd-muted); font-size: 15px; } .newsitem .date { margin-top: 16px; } .brandOverview { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: 18px; margin-bottom: 22px; } .brandOverview .copy, .brandOverview .points div { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 16px 42px rgba(16,34,55,.07); } .brandOverview .copy { min-height: 320px; padding: 36px; } .brandOverview .points { display: grid; gap: 12px; } .brandOverview .points div { padding: 24px; } .brandOverview strong { color: var(--kd-ink); font-size: 19px; font-weight: 800; } .brandOverview .points p { margin-top: 8px; color: var(--kd-muted); font-size: 15px; } .brandDirectory { padding: 30px; } .brandDirectoryHead { display: block; margin-bottom: 24px; } .brandGrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .brandRow { display: block; padding: 0; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; overflow: hidden; transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .brandRow figure { width: 100%; height: 190px; overflow: hidden; } .brandRow figure img { width: 100%; height: 100%; object-fit: cover; } .brandRow .info { padding: 20px; } .brandRow h3 { color: var(--kd-ink); font-size: 20px; font-weight: 800; line-height: 1.35; } .brandRow p { margin-top: 10px; color: var(--kd-muted); font-size: 14px; line-height: 1.75; } .textMore { width: fit-content; min-height: 36px; margin-top: 16px; padding: 0 14px; border-color: transparent; background: #eef7f8; color: var(--kd-ink); box-shadow: none; } .pagebar { padding: 28px 0 0; } .pagebar .pagination { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; } .pagebar a, .pagebar span { min-width: 38px; height: 38px; padding: 0 12px; border: 1px solid var(--kd-line); border-radius: 999px; background: #fff; color: var(--kd-muted); font-size: 14px; line-height: 38px; } .footer { padding: 46px 0; border: 0; background: #07111f; color: rgba(255,255,255,.64); } .footer a { color: rgba(255,255,255,.7); } .footer a:hover { color: #fff; } .footer .pic { height: 38px; } @media only screen and (max-width: 1180px) { .inner { width: min(94vw, 100%); } .header .inner { min-height: 66px; } .logo { flex-basis: 154px; width: 154px; } .nav li a { padding: 23px 9px; font-size: 13px; } .heroCopy .inner, .heroGrid { grid-template-columns: minmax(0, 1fr) 330px; gap: 28px; } .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media only screen and (max-width: 1024px) { .nav { position: fixed; top: 62px; right: -330px; width: 330px; height: calc(100vh - 62px); margin: 0; padding: 14px; border-left: 1px solid rgba(255,255,255,.1); background: rgba(8,17,30,.98); } .nav.open { right: 0; } .nav ul { display: block; } .nav li a { padding: 13px 14px; border-radius: 6px; } .nav li.cur > a:before, .nav li:hover > a:before { display: none; } .nav li ul { position: static; width: auto; margin: 0; padding: 0 0 8px 12px; border: 0; background: transparent; box-shadow: none; } .nav li em { display: block; } .heroStage, .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item, .slides .item img, .heroMedia .item img { height: 620px; } .heroCopy .inner, .heroGrid, .capabilityLead, .brandOverview, .proInfo { grid-template-columns: 1fr; } .heroSignal { display: none; } .capabilityGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .capabilityGrid .wide { grid-row: auto; grid-column: span 2; min-height: 260px; } .homeBrandList { grid-template-columns: 1fr; } } @media only screen and (max-width: 768px) { body { font-size: 15px; } .inner { width: min(92vw, 100%); } .header .inner { min-height: 58px; } .logo { flex-basis: 128px; width: 128px; } .language-switcher { display: none; } .nav { top: 58px; right: -100%; width: 100%; height: calc(100vh - 58px); } .heroStage, .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item, .slides .item img, .heroMedia .item img { height: 540px; } .heroCopy h1 { max-width: 92vw; font-size: 38px; } .heroCopy p { max-width: 90vw; font-size: 15px; } .homeCapability, .ab_box, .homeBrand, .homeNews { padding: 46px 0; } .homeCapability { margin-top: 0; padding-top: 38px; } .capabilityGrid, .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: 1fr 1fr; gap: 14px; } .capabilityGrid .wide, .ab_pro li:first-child { grid-column: span 2; } .ab_pro li:first-child a { min-height: 360px; } .sectionDeck, .homeBrandHead, .sectionHead { display: block; } .sectionDeck a, .homeBrandHead > a { margin-top: 18px; } .bar .inner { padding: 36px 0 24px; } .wrapper { padding: 34px 0 50px; } .singlepage, .product, .brandDirectory, .commentForm { padding: 20px; } .newsitem { grid-template-columns: 132px minmax(0, 1fr); gap: 14px; padding: 14px; } .newsitem .thumbnail img, .newsitem .thumbnail a { height: 108px; } .newsitem h2 { font-size: 17px; } .newsitem .excerpt { display: none; } .brandOverview .copy { min-height: auto; padding: 24px; } .postnavi { grid-template-columns: 1fr; } } @media only screen and (max-width: 520px) { .capabilityGrid, .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: 1fr; } .capabilityGrid .wide, .ab_pro li:first-child { grid-column: auto; } .ab_pro li:first-child a { min-height: 310px; } .homeBrandList article { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; min-height: auto; } .homeBrandList figure { height: 112px; } .newsitem { grid-template-columns: 1fr; } .newsitem .thumbnail img, .newsitem .thumbnail a { height: 170px; } .commentForm .item, .product .cat { grid-template-columns: 1fr; gap: 6px; } } /* 2026 navigation button restore */ .navBtn { position: relative; order: 5; display: none; flex: 0 0 42px; width: 42px; height: 42px; margin-left: 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(255,255,255,.08); cursor: pointer; } .navBtn span, .navBtn span:before, .navBtn span:after { position: absolute; left: 12px; width: 18px; height: 2px; border-radius: 999px; background: #fff; content: ""; transition: transform .22s ease, top .22s ease, opacity .22s ease; } .navBtn span { top: 20px; } .navBtn span:before { top: -7px; } .navBtn span:after { top: 7px; } .navBtn.open span { background: transparent; } .navBtn.open span:before { top: 0; transform: rotate(45deg); } .navBtn.open span:after { top: 0; transform: rotate(-45deg); } @media only screen and (max-width: 1100px) { .header .inner { flex-wrap: nowrap; min-height: 64px; padding: 0; } .logo { flex: 0 0 148px; width: 148px; height: 44px; } .logo a { height: 44px; } .language-switcher { display: none; } .navBtn { display: block; margin-left: auto; } .nav { position: fixed !important; top: 64px !important; right: -340px !important; order: initial; display: block; width: 320px !important; height: calc(100vh - 64px) !important; margin: 0 !important; padding: 14px !important; border-left: 1px solid rgba(255,255,255,.1) !important; background: rgba(8,17,30,.98) !important; box-shadow: 0 24px 80px rgba(0,0,0,.34) !important; overflow-y: auto; transition: right .25s ease; } .nav.open { right: 0 !important; } .nav ul { display: block !important; width: auto; padding: 0 0 18px; overflow: visible; } .nav li { width: 100% !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; text-align: left; } .nav li a { display: block; padding: 13px 42px 13px 14px !important; border-radius: 6px; color: rgba(255,255,255,.82); font-size: 14px; line-height: 20px; white-space: nowrap; } .nav li.cur > a, .nav li:hover > a { background: rgba(24,183,207,.14); color: #fff; } .nav li.cur > a:before, .nav li:hover > a:before { display: none !important; } .nav li ul { position: static !important; display: none; width: auto !important; margin: 0 !important; padding: 0 0 8px 12px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } .nav li em { display: block; position: absolute; top: 0; right: 0; width: 42px; height: 46px; cursor: pointer; } .nav li em:after { content: ""; position: absolute; left: 16px; top: 17px; width: 8px; height: 8px; border-right: 1px solid rgba(255,255,255,.72); border-bottom: 1px solid rgba(255,255,255,.72); transform: rotate(45deg); transition: transform .2s ease; } .nav li em.open:after { top: 20px; transform: rotate(-135deg); } } @media only screen and (max-width: 520px) { .header .inner { min-height: 58px; } .logo { flex-basis: 126px; width: 126px; } .nav { top: 58px !important; right: -100% !important; width: 100% !important; height: calc(100vh - 58px) !important; } .nav.open { right: 0 !important; } } /* 2026 logo vertical alignment fix */ .header .logo { display: flex !important; align-items: center !important; align-self: center !important; height: 50px !important; padding: 0 !important; } .header .logo a { display: block !important; width: 100% !important; height: 38px !important; padding: 0 !important; background-repeat: no-repeat !important; background-position: left center !important; background-size: contain !important; } .header .logo i { position: absolute; inset: 0; height: auto; } @media only screen and (max-width: 1100px) { .header .logo { height: 44px !important; } .header .logo a { height: 34px !important; } } @media only screen and (max-width: 520px) { .header .logo { height: 40px !important; } .header .logo a { height: 31px !important; } } /* 2026 home copy and hero mask cleanup */ .heroStage:after { display: none !important; } .homeCapability { margin-top: 0 !important; padding-top: 78px !important; } .capabilityLead { display: block !important; margin-bottom: 26px !important; } .homeNews .sectionDeck p { display: none !important; } @media only screen and (max-width: 768px) { .homeCapability { padding-top: 46px !important; } } /* 2026 small desktop navigation fix */ @media only screen and (max-width: 1100px) { .header .inner { flex-wrap: wrap; align-items: center; row-gap: 0; padding: 8px 0 0; } .logo { flex: 0 0 148px; width: 148px; height: 44px; } .logo a { height: 44px; } .language-switcher { display: none; } .nav { position: static !important; order: 4; flex: 0 0 100%; width: 100% !important; height: auto !important; margin: 6px 0 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible; } .nav ul { display: flex !important; justify-content: flex-start; gap: 4px; width: 100%; padding: 0 0 8px; overflow-x: auto; overflow-y: visible; scrollbar-width: none; } .nav ul::-webkit-scrollbar { display: none; } .nav li { flex: 0 0 auto; width: auto !important; border: 0 !important; } .nav li a { display: block; padding: 9px 12px !important; border-radius: 999px; color: rgba(255,255,255,.78); font-size: 13px; line-height: 18px; white-space: nowrap; } .nav li.cur > a, .nav li:hover > a { background: rgba(24,183,207,.14); color: #fff; } .nav li.cur > a:before, .nav li:hover > a:before { display: none !important; } .nav li ul { display: none !important; } } @media only screen and (max-width: 520px) { .header .inner { width: min(94vw, 100%); } .logo { flex-basis: 126px; width: 126px; } .nav li a { padding: 8px 10px !important; font-size: 12px; } } /* 2026 full UI redesign: clean technology style */ :root { --kd-ink: #132033; --kd-text: #334155; --kd-muted: #6b7a90; --kd-line: #e4ebf3; --kd-soft: #f5f8fc; --kd-panel: #ffffff; --kd-blue: #1268f3; --kd-blue-2: #0b4fb8; --kd-cyan: #11a7b7; --kd-green: #19a974; --kd-shadow: 0 14px 40px rgba(19, 32, 51, .08); --kd-shadow-sm: 0 8px 22px rgba(19, 32, 51, .06); } html { scroll-behavior: smooth; } body { background: var(--kd-panel); color: var(--kd-text); font: 16px/1.8 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "Microsoft Yahei", sans-serif; letter-spacing: 0; text-rendering: optimizeLegibility; } a { color: inherit; } a:hover { color: var(--kd-blue); } .inner { width: min(92vw, 1240px); max-width: 1240px; } .clear { clear: both; } img { max-width: 100%; } /* Header */ .header { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .94); border-bottom: 1px solid rgba(228, 235, 243, .9); box-shadow: 0 10px 28px rgba(19, 32, 51, .06); backdrop-filter: saturate(150%) blur(14px); } .header .inner { min-height: 74px; display: flex; align-items: center; gap: 18px; } .logo { float: none; flex: 0 0 176px; width: 176px; padding: 0; } .logo a { padding-bottom: 24%; } .nav { flex: 1 1 auto; margin: 0; } .nav ul { float: right; display: flex; align-items: center; gap: 4px; } .nav li { float: none; width: auto; min-width: 0; padding: 0; font-size: 15px; line-height: 1; } .nav li a { padding: 28px 13px; color: var(--kd-ink); font-weight: 500; } .nav li a:after { left: 13px; right: 13px; bottom: 18px; width: auto; height: 2px; transform: scaleX(0); transform-origin: center; background: var(--kd-blue); transition: transform .22s ease; } .nav li.on > a, .nav li.cur > a, .nav li:hover > a { color: var(--kd-blue); } .nav li.on > a:after, .nav li.cur > a:after, .nav li:hover > a:after { width: auto; transform: scaleX(1); } .nav li ul { top: 100%; left: 50%; width: 150px; margin-left: -75px; padding: 8px; border: 1px solid var(--kd-line); border-radius: 6px; background: rgba(255, 255, 255, .98); box-shadow: var(--kd-shadow-sm); } .nav li li { font-size: 14px; line-height: 1.3; } .nav li li a { padding: 10px 12px; border-radius: 4px; } .nav li li a:after { display: none; } .language-switcher { order: 3; float: none; padding: 0; } .language-btn { height: 38px; align-items: center; padding: 0 12px; border: 1px solid var(--kd-line); border-radius: 6px; background: #fff; color: var(--kd-ink); } .language-btn .globe-icon img { width: 18px !important; } .current-lang { font-size: 13px; } .language-dropdown { top: calc(100% + 12px); width: 390px; border-color: var(--kd-line); border-radius: 6px; box-shadow: var(--kd-shadow); } .language-item { height: 32px; border-radius: 4px; } .searchForm { border-top: 1px solid var(--kd-line); background: var(--kd-soft); } .searchForm form { border: 1px solid var(--kd-line); border-radius: 8px; background: #fff; } /* Hero */ .slides { position: relative; background: #06172a; } .slides .item { background: #06172a; } .slides .item a { text-indent: 0; } .slides .item img { width: 100%; height: clamp(360px, 46vw, 620px); max-height: none; object-fit: cover; display: block; } .slides:after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(6,23,42,.40), rgba(6,23,42,.06) 46%, rgba(6,23,42,.22)); } .heroCopy { position: absolute; inset: 0; z-index: 3; pointer-events: none; } .heroCopy .inner { height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; } .heroCopy span { display: inline-block; margin-bottom: 14px; padding: 6px 11px; border: 1px solid rgba(255,255,255,.34); border-radius: 6px; color: rgba(255,255,255,.86); font-size: 13px; font-weight: 700; } .heroCopy h1 { max-width: 760px; color: #fff; font-size: clamp(34px, 5vw, 64px); line-height: 1.12; font-weight: 750; } .heroCopy p { max-width: 620px; margin-top: 18px; color: rgba(255,255,255,.82); font-size: 18px; line-height: 1.8; } .heroActions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; pointer-events: auto; } .heroActions a { display: inline-flex; align-items: center; justify-content: center; min-width: 126px; height: 44px; padding: 0 20px; border: 1px solid rgba(255,255,255,.55); border-radius: 6px; color: #fff; font-weight: 700; background: rgba(255,255,255,.08); } .heroActions a.primary, .heroActions a:hover { border-color: var(--kd-blue); background: var(--kd-blue); } .slides .owl-dots { bottom: 28px; z-index: 2; } .slides .owl-dot span { width: 26px; height: 3px; border-radius: 2px; background: rgba(255,255,255,.42); } .slides .owl-dot.active span { width: 52px; background: #fff; } .slides .load { display: none; } /* Section system */ main .ab_box, .homeBrand { padding: 64px 0; } .ab_bg { background: linear-gradient(180deg, #f7faff 0%, #ffffff 100%); } .ab_title, .homeBrandHead, .sectionHead { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 30px; } .ab_title h2, .homeBrandHead h2, .sectionHead h2, .brandOverview h1 { color: var(--kd-ink); font-size: 32px; line-height: 1.28; font-weight: 650; } .ab_title h2:after { display: none; } .ab_title a, .homeBrandHead > a, .textMore { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 18px; border: 1px solid rgba(18,104,243,.28); border-radius: 6px; color: var(--kd-blue); background: #fff; font-size: 14px; font-weight: 600; } .ab_title a:hover, .homeBrandHead > a:hover, .textMore:hover { color: #fff; border-color: var(--kd-blue); background: var(--kd-blue); } .ab_title a i { display: none; } .thumbnail { background: #eef3f8; } .thumbnail img { display: block; } /* Home products */ .ab_pro ul, .products ul, .homeBrandList { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; width: auto; } .ab_pro li, .ab_pro li.li1, .products li { float: none; width: auto; padding: 0; } .ab_pro li a, .products li .box, .brandCard, .brandRow, .newsitem, .homeBrandList article { border: 1px solid var(--kd-line); border-radius: 8px; background: #fff; box-shadow: none; overflow: hidden; transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; } .ab_pro li a:hover, .products li .box:hover, .brandCard:hover, .brandRow:hover, .newsitem:hover, .homeBrandList article:hover { transform: translateY(-3px); border-color: rgba(18,104,243,.28); box-shadow: var(--kd-shadow-sm); } .ab_pro li a:after { display: none; } .ab_pro li .thumbnail, .products li .thumbnail, .brandThumb, .brandRow figure { aspect-ratio: 4 / 3; overflow: hidden; } .ab_pro li img, .products li .thumbnail img, .brandThumb img, .brandRow img { width: 100%; height: 100%; object-fit: cover; } .ab_pro li h3, .ab_pro li a:hover h3, .products li h2 { position: static; width: auto; height: auto; margin: 0; padding: 15px 16px; border-radius: 0; background: #fff; color: var(--kd-ink); opacity: 1; text-align: left; font-size: 16px; line-height: 1.45; font-weight: 650; } /* Home brand */ .homeBrand { background: #fff; } .homeBrandHead span, .brandOverview .copy span, .brandArticleHead .copy span { display: inline-block; margin-bottom: 8px; color: var(--kd-cyan); font-size: 13px; font-weight: 700; } .homeBrandHead p, .sectionHead p, .brandOverview .copy p, .brandOverview .points p, .brandRow p, .homeBrandList p, .brandArticleHead .copy p { color: var(--kd-muted); line-height: 1.85; } .homeBrandList { grid-template-columns: repeat(3, minmax(0, 1fr)); } .homeBrandList article { display: grid; grid-template-columns: 94px 1fr; gap: 16px; padding: 16px; background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%); } .homeBrandList figure { aspect-ratio: 1 / 1; overflow: hidden; border-radius: 6px; background: #eef3f8; } .homeBrandList img { width: 100%; height: 100%; object-fit: cover; } .homeBrandList h3 { color: var(--kd-ink); font-size: 17px; line-height: 1.4; font-weight: 650; } /* Home news */ .ab_news { background: var(--kd-soft); } .ab_top { border-radius: 8px; overflow: hidden; } .ab_news ul { display: grid; gap: 14px; } .ab_news li { padding: 12px; border: 1px solid var(--kd-line); border-radius: 8px; background: #fff; } .ab_news li h3, .ab_news .item h3 { color: var(--kd-ink); font-weight: 650; } .ab_news li p, .ab_news time { color: var(--kd-muted); } .links { display: none; } /* Inner title */ .banner { display: none; } .bar { margin: 0; border-bottom: 1px solid var(--kd-line); background: linear-gradient(90deg, rgba(18,104,243,.08), rgba(17,167,183,.06) 42%, rgba(255,255,255,0)), #fff; } .bar .inner { padding: 42px 0 26px; overflow: visible; } .pageTitle { display: block; position: static; float: left; width: auto; min-width: 220px; padding: 0; background: transparent; color: var(--kd-ink); text-align: left; } .pageTitle .cn { color: var(--kd-ink); font-size: 34px; line-height: 1.25; font-weight: 700; } .pageTitle .en { margin-top: 8px; color: var(--kd-cyan); font-size: 13px; line-height: 1.5; font-weight: 700; letter-spacing: 0; } .breadcrumb { float: right; max-width: 50%; padding: 8px 0 0; background: none; color: var(--kd-muted); line-height: 1.7; } .breadcrumb a { color: var(--kd-muted); } .submenu { clear: both; margin: 26px 0 0; padding: 0; } .submenu li { float: none; display: inline-block; margin: 0 8px 8px 0; padding: 0; font-size: 14px; line-height: 1.4; } .submenu li a { padding: 8px 15px; border: 1px solid var(--kd-line); border-radius: 6px; background: #fff; color: var(--kd-text); } .submenu li.cur a, .submenu li a:hover { border-color: var(--kd-blue); background: var(--kd-blue); color: #fff; } .submenu li.cur a:before { display: none; } .wrapper { padding: 52px 0 70px; background: #fff; } .wrapper .inner { overflow: visible; } /* Listings */ .newslist, .products, .brandDirectory, .singlepage, .product, .brandArticle { max-width: 1120px; margin: 0 auto; } .newsitem { padding: 18px; margin-bottom: 18px; } .newsitem .thumbnail { width: 250px; border-radius: 6px; overflow: hidden; } .newsitem .info { margin-left: 270px; padding: 6px 0 0 24px; } .newsitem .info:after, .newsitem .more { display: none; } .newsitem h2 { color: var(--kd-ink); font-size: 22px; font-weight: 650; } .newsitem .excerpt, .newsitem .date { color: var(--kd-muted); } .products ul { grid-template-columns: repeat(4, minmax(0, 1fr)); } /* Detail typography */ .posttitle, .singlepage .posttitle, .brandArticleHead h1, .product .posttitle { color: var(--kd-ink); font-weight: 700; letter-spacing: 0; } .singlepage .posttitle { margin-bottom: 24px; text-align: left; font-size: 32px; } .entry { color: var(--kd-text); font-size: 16px; line-height: 1.95; } .entry p, .entry table, .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 { margin-bottom: 20px; } .entry h1, .entry h2, .entry h3 { color: var(--kd-ink); font-weight: 700; line-height: 1.35; } .entry img { border-radius: 6px; } .entry table { width: 100% !important; border-collapse: collapse; overflow: hidden; border-radius: 6px; } .entry table td, .entry table th { padding: 11px 13px; border: 1px solid var(--kd-line); } .entry table tr:nth-child(odd) td { background: #f8fbff; } /* Product detail */ .proInfo { display: grid; grid-template-columns: minmax(360px, .92fr) minmax(0, 1.08fr); gap: 38px; align-items: start; margin-bottom: 44px; } .picList { float: none; width: auto; } .picList .cur { border: 1px solid var(--kd-line); border-radius: 8px; background: #f7faff; overflow: hidden; } .picList .pic { aspect-ratio: 4 / 3; } .picList .pic img { width: 100%; height: 100%; object-fit: cover; } .product .right { margin-left: 0; } .product .posttitle { text-align: left; font-size: 34px; } .product .intro { padding: 18px 0; border-top: 1px solid var(--kd-line); border-bottom: 1px solid var(--kd-line); color: var(--kd-muted); } .product .meta .cat { border-bottom: 1px solid var(--kd-line); } .product .meta span { color: var(--kd-muted); } .product .meta a { border-radius: 5px; background: var(--kd-soft); color: var(--kd-text); } .product .btn a, #comment .submit { border-radius: 6px; background: var(--kd-blue); color: #fff; } .product .btn a:hover, #comment .submit:hover { background: var(--kd-blue-2); } .proTitle h2 { border-bottom-color: var(--kd-line); } .proTitle h2 span { color: var(--kd-ink); border-bottom-color: var(--kd-blue); font-weight: 700; } /* Brand pages */ .brandOverview { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr); gap: 30px; align-items: stretch; margin-bottom: 42px; } .brandOverview .copy, .brandOverview .points div, .brandArticleHead { border: 1px solid var(--kd-line); border-radius: 8px; background: #fff; } .brandOverview .copy { padding: 34px; background: linear-gradient(135deg, rgba(18,104,243,.08), rgba(17,167,183,.06)), #fff; } .brandOverview .points { display: grid; gap: 12px; } .brandOverview .points div { padding: 20px; background: #f8fbff; } .brandOverview strong { display: block; margin-bottom: 6px; color: var(--kd-ink); font-size: 16px; } .brandRow { display: grid; grid-template-columns: 178px minmax(0, 1fr); gap: 22px; padding: 18px; } .brandRow h3 { color: var(--kd-ink); font-size: 21px; line-height: 1.4; font-weight: 650; } .brandArticleHead { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 34px; align-items: center; margin-bottom: 34px; padding: 28px; background: linear-gradient(135deg, rgba(18,104,243,.08), rgba(17,167,183,.06)), #fff; } .brandArticleHead h1 { font-size: 34px; } .brandArticleHead figure { overflow: hidden; border-radius: 8px; background: #eef3f8; } .brandArticleHead img { width: 100%; max-height: 240px; display: block; object-fit: cover; } .brandBody { max-width: 880px; margin: 0 auto 30px; } .brandBody p:has(img) { display: inline-block; width: 31.6%; margin: 0 1.2% 18px 0; vertical-align: top; } .brandBody p:has(img) img { width: 100%; height: 180px !important; object-fit: cover; display: block; } .brandCover, .brandGrid, .brandIntro { display: none; } /* Forms and footer */ #comment { padding: 24px; border: 1px solid var(--kd-line); border-radius: 8px; background: var(--kd-soft); } #comment .text { border: 1px solid var(--kd-line); border-radius: 6px; background: #fff; } .footer { padding: 42px 0; border-top: 1px solid var(--kd-line); background: #0b1728; color: rgba(255,255,255,.72); } .footer a { color: rgba(255,255,255,.78); } .footer a:hover { color: #fff; } .pagesList li { margin-right: 14px; } .copyright { color: rgba(255,255,255,.62); } .social li a { border-radius: 6px; background-color: rgba(255,255,255,.08); } .footer .qrcode { border-radius: 8px; overflow: hidden; } /* Responsive */ @media only screen and (max-width: 1180px) { .header .inner { min-height: 64px; } .logo { flex-basis: 148px; width: 148px; } .nav li a { padding: 24px 9px; font-size: 14px; } .language-btn { padding: 0 9px; } } @media only screen and (max-width: 1024px) { .nav { position: fixed; top: 65px; right: -320px; width: 320px; height: calc(100vh - 65px); margin: 0; border-left: 1px solid var(--kd-line); background: #fff; box-shadow: var(--kd-shadow); overflow-y: auto; transition: right .25s ease; } .nav.open { right: 0; } .nav ul { display: block; float: none; padding: 12px; } .nav li { width: 100% !important; text-align: left; border-bottom: 1px solid var(--kd-line); } .nav li a { padding: 14px 42px 14px 12px; } .nav li a:after { display: none; } .nav li ul { position: static; width: auto; margin: 0; padding: 0 0 8px 10px; border: 0; box-shadow: none; } .nav li em { display: block; } .language-switcher { margin-left: auto; } .ab_pro ul, .products ul { grid-template-columns: repeat(3, minmax(0, 1fr)); } .homeBrandList, .brandOverview, .brandArticleHead, .proInfo { grid-template-columns: 1fr; } .brandArticleHead figure { max-width: 360px; } } @media only screen and (max-width: 768px) { body { font-size: 15px; } .inner { width: min(92vw, 100%); } .header .inner { min-height: 58px; } .logo { flex-basis: 126px; width: 126px; } .nav { top: 59px; width: 100%; right: -100%; height: calc(100vh - 59px); } .language-switcher { display: none; } .slides .item img { height: 330px; } .heroCopy h1 { max-width: 86vw; } .heroCopy p { max-width: 84vw; font-size: 15px; } .heroActions { margin-top: 18px; } main .ab_box, .homeBrand { padding: 38px 0; } .ab_title, .homeBrandHead, .sectionHead { display: block; } .ab_title h2, .homeBrandHead h2, .sectionHead h2, .pageTitle .cn { font-size: 25px; } .ab_title a, .homeBrandHead > a { margin-top: 14px; } .ab_pro ul, .products ul, .homeBrandList { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .bar .inner { padding: 28px 0 18px; } .pageTitle, .breadcrumb { float: none; max-width: none; } .breadcrumb { padding-top: 14px; } .submenu { margin-top: 18px; } .wrapper { padding: 34px 0 48px; } .newsitem .thumbnail { width: 112px; } .newsitem .info { margin-left: 126px; padding: 0; } .newsitem h2 { font-size: 17px; } .newsitem .date, .newsitem .more { display: none; } .brandOverview .copy, .brandArticleHead { padding: 20px; } .brandRow { grid-template-columns: 120px minmax(0, 1fr); gap: 14px; padding: 14px; } .brandBody p:has(img) { width: 48%; } .footer { padding: 34px 0; } } @media only screen and (max-width: 520px) { .ab_pro ul, .products ul, .homeBrandList { grid-template-columns: 1fr; } .homeBrandList article, .brandRow { grid-template-columns: 88px minmax(0, 1fr); } .brandArticleHead figure { max-width: none; } .brandBody p:has(img) { width: 100%; margin-right: 0; } } /* 2026 final visual refresh override */ :root { --kd-ink: #07111f; --kd-text: #182233; --kd-muted: #647184; --kd-soft: #eef3f7; --kd-panel: #fff; --kd-line: rgba(16, 34, 55, .1); --kd-dark: #08111e; --kd-cyan: #18b7cf; --kd-green: #36c58a; --kd-coral: #ff7a59; --kd-shadow: 0 24px 70px rgba(13, 32, 54, .12); --kd-radius: 8px; } html { background: #f4f7fb; } body { background: linear-gradient(180deg, #f7fafc 0, #eef3f7 560px, #f7fafc 100%); color: var(--kd-text); font-family: "Inter", "Microsoft YaHei", "PingFang SC", Arial, sans-serif; font-size: 16px; line-height: 1.75; letter-spacing: 0; } a, a:hover { color: inherit; } .inner { width: min(1200px, calc(100vw - 56px)); max-width: none; } .header { position: sticky; top: 0; z-index: 99; background: rgba(8, 17, 30, .9); border-bottom: 1px solid rgba(255,255,255,.09); box-shadow: 0 16px 45px rgba(0,0,0,.18); backdrop-filter: blur(18px); } .header .inner { display: flex; align-items: center; min-height: 74px; overflow: visible; } .logo { float: none; flex: 0 0 188px; width: 188px; height: 50px; } .logo a { height: 50px; background-size: contain; background-position: left center; } .language-switcher { order: 3; float: none; margin-left: 14px; padding: 0 !important; } .language-btn { height: 38px; padding: 0 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.86); font-size: 13px; } .language-btn .globe-icon img { width: 19px !important; } .language-dropdown { top: 48px; right: 0; left: auto; width: 280px !important; padding: 10px; border: 1px solid rgba(255,255,255,.12); border-radius: var(--kd-radius); background: rgba(9,18,31,.97); box-shadow: 0 24px 60px rgba(0,0,0,.3); } .language-item { border-radius: 6px; } .language-item a { color: rgba(255,255,255,.82); } .language-item:hover { background: rgba(255,255,255,.08); } .nav { float: none; flex: 1 1 auto; margin-left: 28px; } .nav ul { display: flex; justify-content: flex-end; align-items: center; gap: 2px; float: none; } .nav li { float: none; width: auto !important; } .nav li a { padding: 27px 13px; color: rgba(255,255,255,.78); font-size: 14px; font-weight: 500; line-height: 20px; } .nav li a:after { display: none; } .nav li.cur > a, .nav li:hover > a { color: #fff; } .nav li.cur > a:before, .nav li:hover > a:before { content: ""; position: absolute; left: 13px; right: 13px; bottom: 17px; height: 2px; border-radius: 999px; background: linear-gradient(90deg, var(--kd-cyan), var(--kd-green)); } .nav li ul { top: 72px; width: 190px; padding: 10px; border: 1px solid rgba(255,255,255,.1); border-radius: var(--kd-radius); background: rgba(9,18,31,.96); box-shadow: 0 24px 60px rgba(0,0,0,.28); } .nav li ul li a { padding: 10px 12px; color: rgba(255,255,255,.76); border-radius: 6px; } .nav li ul li a:hover { background: rgba(255,255,255,.08); } .searchForm { display: none !important; } .heroStage { position: relative; min-height: 680px; overflow: hidden; background: var(--kd-dark); } .heroStage:before { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(5,12,22,.92) 0, rgba(5,12,22,.74) 45%, rgba(5,12,22,.2) 100%), radial-gradient(circle at 78% 24%, rgba(24,183,207,.28), transparent 34%), repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px 90px); pointer-events: none; } .heroStage:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; height: 140px; background: linear-gradient(180deg, transparent, #f4f7fb); pointer-events: none; } .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item, .slides .item img, .heroMedia .item img { height: 680px; } .slides .item img, .heroMedia .item img { object-fit: cover; transform: scale(1.03); filter: saturate(1.06) contrast(1.04); } .heroCopy { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; padding-top: 0; pointer-events: none; } .heroCopy .inner, .heroGrid { display: grid; grid-template-columns: minmax(0, 1.05fr) 380px; align-items: center; gap: 48px; } .heroIntro, .heroSignal, .heroActions a { pointer-events: auto; } .heroCopy span, .capabilityLead span, .sectionDeck span, .homeBrandHead span, .brandOverview .copy span, .brandDirectoryHead span, .brandRow .info span { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; color: var(--kd-cyan); font-size: 12px; font-weight: 800; line-height: 1; text-transform: uppercase; letter-spacing: 0; } .heroCopy span:before, .capabilityLead span:before, .sectionDeck span:before, .homeBrandHead span:before, .brandOverview .copy span:before, .brandDirectoryHead span:before, .brandRow .info span:before { content: ""; width: 28px; height: 2px; border-radius: 999px; background: currentColor; } .heroCopy h1 { max-width: 780px; color: #fff; font-size: clamp(42px, 5vw, 72px); font-weight: 800; line-height: 1.08; letter-spacing: 0; } .heroCopy p { max-width: 680px; margin-top: 22px; color: rgba(255,255,255,.76); font-size: 18px; line-height: 1.85; } .heroActions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 34px; } .heroActions a, .homeBrandHead > a, .ab_title a, .textMore, .product .btn a, .commentForm .submit { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border: 1px solid rgba(24,183,207,.3); border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; font-size: 14px; font-weight: 700; line-height: 1; transition: transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease; } .heroActions a.primary, .product .btn a, .commentForm .submit { border-color: transparent; background: linear-gradient(135deg, var(--kd-cyan), var(--kd-green)); color: #05111c; box-shadow: 0 18px 44px rgba(24,183,207,.24); } .heroActions a:hover, .homeBrandHead > a:hover, .ab_title a:hover, .textMore:hover { transform: translateY(-2px); } .heroSignal { position: relative; padding: 28px; border: 1px solid rgba(255,255,255,.16); border-radius: var(--kd-radius); background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.06)); box-shadow: 0 28px 80px rgba(0,0,0,.28); backdrop-filter: blur(16px); } .heroSignal strong { display: block; color: #fff; font-size: 32px; line-height: 1.1; } .heroSignal p { margin-top: 10px; color: rgba(255,255,255,.68); font-size: 14px; line-height: 1.65; } .heroSignal ul { margin-top: 24px; } .heroSignal li { display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 12px; padding: 14px 0; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.86); } .heroSignal em { width: 36px; height: 36px; border-radius: 50%; background: rgba(24,183,207,.16); color: var(--kd-cyan); font-size: 12px; font-style: normal; font-weight: 800; text-align: center; line-height: 36px; } .homeMain { position: relative; z-index: 4; } .homeCapability, .ab_box, .homeBrand, .homeNews { padding: 78px 0; } .homeCapability { margin-top: -46px; padding-top: 0; } .capabilityLead { display: grid; grid-template-columns: 320px minmax(0, 1fr); align-items: end; gap: 52px; margin-bottom: 28px; } .capabilityLead h2, .sectionDeck h2, .homeBrandHead h2, .brandOverview h1, .brandDirectoryHead h2, .pageTitle .cn { color: var(--kd-ink); font-size: clamp(30px, 3.2vw, 46px); font-weight: 800; line-height: 1.18; letter-spacing: 0; } .capabilityGrid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 16px; } .capabilityGrid article { min-height: 220px; padding: 26px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 18px 48px rgba(16,34,55,.08); } .capabilityGrid .wide { grid-row: span 2; min-height: 456px; background: linear-gradient(150deg, rgba(8,17,30,.96), rgba(16,31,48,.9)), radial-gradient(circle at 20% 10%, rgba(24,183,207,.26), transparent 34%); color: #fff; } .capabilityGrid article span { color: var(--kd-cyan); font-size: 12px; font-weight: 800; text-transform: uppercase; } .capabilityGrid h3 { margin-top: 18px; color: inherit; font-size: 24px; font-weight: 800; line-height: 1.25; } .capabilityGrid p { margin-top: 14px; color: var(--kd-muted); font-size: 15px; line-height: 1.8; } .capabilityGrid .wide p { color: rgba(255,255,255,.72); } .sectionDeck, .homeBrandHead, .sectionHead { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 28px; margin-bottom: 34px; } .sectionDeck p, .homeBrandHead p, .brandDirectoryHead p, .brandOverview .copy p { max-width: 700px; margin-top: 12px; color: var(--kd-muted); font-size: 16px; line-height: 1.8; } .sectionDeck a, .homeBrandHead > a { min-width: 128px; border-color: var(--kd-line); background: var(--kd-panel); color: var(--kd-ink); box-shadow: 0 12px 32px rgba(16,34,55,.08); } .sectionDeck a i { position: static; width: auto; height: auto; margin: 0; background: none; } .sectionDeck a i:before { content: "More"; color: var(--kd-ink); font-size: 13px; font-style: normal; } .homeProducts { background: #f8fafc; } .ab_pro ul, .products ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; width: auto; overflow: visible; } .ab_pro li, .ab_pro li.li1, .products li { float: none; width: auto; padding: 0; } .ab_pro li:first-child { grid-column: span 2; grid-row: span 2; } .ab_pro li a, .products li .box { position: relative; display: block; height: 100%; min-height: 252px; overflow: hidden; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: var(--kd-panel); box-shadow: 0 16px 40px rgba(16,34,55,.08); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .ab_pro li:first-child a { min-height: 522px; background: var(--kd-dark); } .ab_pro li a:after { display: none; } .ab_pro li .thumbnail, .products li .thumbnail { height: 200px; overflow: hidden; } .ab_pro li:first-child .thumbnail { height: 100%; } .ab_pro li img, .products li .thumbnail img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; } .ab_pro li h3, .ab_pro li a:hover h3, .products li h2 { position: static; width: auto; height: auto; margin: 0; padding: 16px 18px 18px; border-radius: 0; background: var(--kd-panel); color: var(--kd-ink); opacity: 1; text-align: left; font-size: 16px; font-weight: 800; line-height: 1.35; white-space: normal; } .ab_pro li:first-child h3 { position: absolute; left: 22px; right: 22px; bottom: 22px; z-index: 2; padding: 18px 20px; border: 1px solid rgba(255,255,255,.16); background: rgba(8,17,30,.72); color: #fff; backdrop-filter: blur(14px); } .ab_pro li a:hover, .products li .box:hover, .homeBrandList article:hover, .newsitem:hover, .brandRow:hover { transform: translateY(-5px); border-color: rgba(24,183,207,.32); box-shadow: 0 26px 70px rgba(13,32,54,.14); } .ab_pro li a:hover img, .products li .box:hover img { transform: scale(1.06); } .homeBrand { position: relative; overflow: hidden; background: linear-gradient(135deg, #08111e 0, #122336 100%), radial-gradient(circle at 80% 20%, rgba(24,183,207,.22), transparent 34%); } .homeBrand:before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 78px 78px; opacity: .45; pointer-events: none; } .homeBrand .inner { position: relative; z-index: 1; } .homeBrandHead h2, .homeBrandHead p { color: #fff; } .homeBrandHead p { color: rgba(255,255,255,.66); } .homeBrandHead > a { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.16); color: #fff; } .homeBrandList { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .homeBrandList article { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 18px; align-items: center; min-height: 190px; padding: 18px; border: 1px solid rgba(255,255,255,.12); border-radius: var(--kd-radius); background: rgba(255,255,255,.08); box-shadow: none; backdrop-filter: blur(12px); } .homeBrandList figure { height: 150px; border-radius: 6px; } .homeBrandList img { width: 100%; height: 100%; object-fit: cover; } .homeBrandList h3 { color: #fff; font-size: 19px; font-weight: 800; line-height: 1.35; } .homeBrandList p { margin-top: 10px; color: rgba(255,255,255,.66); font-size: 14px; line-height: 1.75; } .homeNews, .ab_news { background: #f4f7fb; } .ab_news .ab_top { display: none; } .ab_news ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } .ab_news li { display: block; margin: 0; padding: 0; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; overflow: hidden; box-shadow: 0 16px 40px rgba(16,34,55,.07); } .ab_news li .thumbnail { width: 100%; height: 156px; } .ab_news li .thumbnail img { width: 100%; height: 100%; object-fit: cover; } .ab_news li .info { margin: 0; padding: 18px; } .ab_news li h3 { font-size: 17px; font-weight: 800; line-height: 1.45; } .ab_news li p { margin-top: 8px; color: var(--kd-muted); font-size: 14px; } .ab_news li time { display: block; margin-top: 14px; color: var(--kd-cyan); font-size: 13px; font-weight: 700; } .bar { margin: 0; border: 0; background: linear-gradient(135deg, #08111e 0, #13253a 100%), radial-gradient(circle at 76% 18%, rgba(24,183,207,.25), transparent 32%); } .bar .inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 54px 0 34px; overflow: visible; } .pageTitle, .breadcrumb { float: none; max-width: none; } .breadcrumb { order: 2; padding: 0; color: rgba(255,255,255,.58); font-size: 13px; } .breadcrumb a { color: rgba(255,255,255,.78); } .pageTitle { order: 1; padding: 0; } .pageTitle .cn { color: #fff; } .pageTitle .en { margin-top: 10px; color: rgba(255,255,255,.4); font-size: 14px; font-weight: 600; text-transform: uppercase; } .submenu { order: 3; display: flex; flex-wrap: wrap; gap: 10px; float: none; padding: 0; margin: 0; } .submenu li { float: none; } .submenu li a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(255,255,255,.06); color: rgba(255,255,255,.72); font-size: 14px; } .submenu li.cur a, .submenu li a:hover { border-color: rgba(24,183,207,.42); background: rgba(24,183,207,.15); color: #fff; } .wrapper { padding: 58px 0 78px; background: #f7fafc; } .wrapper .inner { overflow: visible; } .singlepage, .product, .brandDirectory, .commentForm { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 18px 52px rgba(16,34,55,.08); } .singlepage, .product { padding: 34px; } .entry { color: var(--kd-text); font-size: 16px; line-height: 1.9; } .entry p { margin: 0 0 18px; } .entry h1, .entry h2, .entry h3 { margin: 28px 0 14px; color: var(--kd-ink); font-weight: 800; line-height: 1.28; } .entry img { max-height: 780px; width: auto; border-radius: 6px; } .products { margin-bottom: 0; } .products li .thumbnail { height: 230px; } .products li h2 { text-align: left; } .proInfo { display: grid; grid-template-columns: minmax(0, .95fr) minmax(360px, .75fr); gap: 34px; padding-bottom: 40px; border-bottom: 1px solid var(--kd-line); } .picList { width: auto; } .picList .cur { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #f4f7fb; overflow: hidden; } .picList .cur .pic { aspect-ratio: 4 / 3; } .picList .cur img { width: 100%; height: 100%; object-fit: contain; } .product .right { padding: 8px 0 0; } .posttitle { color: var(--kd-ink); font-size: clamp(30px, 3vw, 44px); font-weight: 800; line-height: 1.2; } .product .intro { margin-top: 18px; padding: 18px; border-left: 3px solid var(--kd-cyan); background: #f4f7fb; color: var(--kd-muted); } .product .meta { margin-top: 22px; border-top: 1px solid var(--kd-line); } .product .cat { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--kd-line); } .product .cat span { color: var(--kd-muted); } .product .btn { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; } .product .btn span { display: block; } .proTitle { margin: 38px 0 22px; border: 0; } .proTitle h2 { border: 0; } .proTitle h2 span { display: inline-flex; align-items: center; gap: 10px; color: var(--kd-ink); font-size: 24px; font-weight: 800; } .proTitle h2 span:before { content: ""; width: 28px; height: 3px; border-radius: 999px; background: linear-gradient(90deg, var(--kd-cyan), var(--kd-green)); } .postnavi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 32px; border: 0; } .postnavi span { padding: 14px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #f8fafc; } .commentForm { padding: 24px; margin-top: 32px; } .commentForm .item { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; margin-bottom: 14px; } .commentForm label { color: var(--kd-muted); font-weight: 700; line-height: 42px; } .commentForm .text, .commentForm textarea { width: 100%; min-height: 42px; border: 1px solid var(--kd-line); border-radius: 6px; background: #f8fafc; color: var(--kd-text); font-size: 15px; } .commentForm textarea { min-height: 116px; } .newslist { display: grid; gap: 18px; } .newsitem { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; margin: 0; padding: 18px; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 14px 40px rgba(16,34,55,.07); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .newsitem .thumbnail { float: none; width: 100%; border-radius: 6px; } .newsitem .thumbnail a, .newsitem .thumbnail img { display: block; width: 100%; height: 180px; object-fit: cover; } .newsitem .info { margin: 0; padding: 0; } .newsitem .info:after, .newsitem .more { display: none; } .newsitem h2 { margin: 0 0 12px; color: var(--kd-ink); font-size: 23px; font-weight: 800; line-height: 1.35; } .newsitem .excerpt, .newsitem .date { color: var(--kd-muted); font-size: 15px; } .newsitem .date { margin-top: 16px; } .brandOverview { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: 18px; margin-bottom: 22px; } .brandOverview .copy, .brandOverview .points div { border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; box-shadow: 0 16px 42px rgba(16,34,55,.07); } .brandOverview .copy { min-height: 320px; padding: 36px; } .brandOverview .points { display: grid; gap: 12px; } .brandOverview .points div { padding: 24px; } .brandOverview strong { color: var(--kd-ink); font-size: 19px; font-weight: 800; } .brandOverview .points p { margin-top: 8px; color: var(--kd-muted); font-size: 15px; } .brandDirectory { padding: 30px; } .brandDirectoryHead { display: block; margin-bottom: 24px; } .brandGrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .brandRow { display: block; padding: 0; border: 1px solid var(--kd-line); border-radius: var(--kd-radius); background: #fff; overflow: hidden; transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; } .brandRow figure { width: 100%; height: 190px; overflow: hidden; } .brandRow figure img { width: 100%; height: 100%; object-fit: cover; } .brandRow .info { padding: 20px; } .brandRow h3 { color: var(--kd-ink); font-size: 20px; font-weight: 800; line-height: 1.35; } .brandRow p { margin-top: 10px; color: var(--kd-muted); font-size: 14px; line-height: 1.75; } .textMore { width: fit-content; min-height: 36px; margin-top: 16px; padding: 0 14px; border-color: transparent; background: #eef7f8; color: var(--kd-ink); box-shadow: none; } .pagebar { padding: 28px 0 0; } .pagebar .pagination { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; } .pagebar a, .pagebar span { min-width: 38px; height: 38px; padding: 0 12px; border: 1px solid var(--kd-line); border-radius: 999px; background: #fff; color: var(--kd-muted); font-size: 14px; line-height: 38px; } .footer { padding: 46px 0; border: 0; background: #07111f; color: rgba(255,255,255,.64); } .footer a { color: rgba(255,255,255,.7); } .footer a:hover { color: #fff; } .footer .pic { height: 38px; } @media only screen and (max-width: 1180px) { .inner { width: min(94vw, 100%); } .header .inner { min-height: 66px; } .logo { flex-basis: 154px; width: 154px; } .nav li a { padding: 23px 9px; font-size: 13px; } .heroCopy .inner, .heroGrid { grid-template-columns: minmax(0, 1fr) 330px; gap: 28px; } .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media only screen and (max-width: 1024px) { .nav { position: fixed; top: 62px; right: -330px; width: 330px; height: calc(100vh - 62px); margin: 0; padding: 14px; border-left: 1px solid rgba(255,255,255,.1); background: rgba(8,17,30,.98); } .nav.open { right: 0; } .nav ul { display: block; } .nav li a { padding: 13px 14px; border-radius: 6px; } .nav li.cur > a:before, .nav li:hover > a:before { display: none; } .nav li ul { position: static; width: auto; margin: 0; padding: 0 0 8px 12px; border: 0; background: transparent; box-shadow: none; } .nav li em { display: block; } .heroStage, .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item, .slides .item img, .heroMedia .item img { height: 620px; } .heroCopy .inner, .heroGrid, .capabilityLead, .brandOverview, .proInfo { grid-template-columns: 1fr; } .heroSignal { display: none; } .capabilityGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .capabilityGrid .wide { grid-row: auto; grid-column: span 2; min-height: 260px; } .homeBrandList { grid-template-columns: 1fr; } } @media only screen and (max-width: 768px) { body { font-size: 15px; } .inner { width: min(92vw, 100%); } .header .inner { min-height: 58px; } .logo { flex-basis: 128px; width: 128px; } .language-switcher { display: none; } .nav { top: 58px; right: -100%; width: 100%; height: calc(100vh - 58px); } .heroStage, .heroMedia, .heroMedia .owl-stage-outer, .heroMedia .owl-stage, .heroMedia .owl-item, .heroMedia .item, .slides .item img, .heroMedia .item img { height: 540px; } .heroCopy h1 { max-width: 92vw; font-size: 38px; } .heroCopy p { max-width: 90vw; font-size: 15px; } .homeCapability, .ab_box, .homeBrand, .homeNews { padding: 46px 0; } .homeCapability { margin-top: 0; padding-top: 38px; } .capabilityGrid, .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: 1fr 1fr; gap: 14px; } .capabilityGrid .wide, .ab_pro li:first-child { grid-column: span 2; } .ab_pro li:first-child a { min-height: 360px; } .sectionDeck, .homeBrandHead, .sectionHead { display: block; } .sectionDeck a, .homeBrandHead > a { margin-top: 18px; } .bar .inner { padding: 36px 0 24px; } .wrapper { padding: 34px 0 50px; } .singlepage, .product, .brandDirectory, .commentForm { padding: 20px; } .newsitem { grid-template-columns: 132px minmax(0, 1fr); gap: 14px; padding: 14px; } .newsitem .thumbnail img, .newsitem .thumbnail a { height: 108px; } .newsitem h2 { font-size: 17px; } .newsitem .excerpt { display: none; } .brandOverview .copy { min-height: auto; padding: 24px; } .postnavi { grid-template-columns: 1fr; } } @media only screen and (max-width: 520px) { .capabilityGrid, .ab_pro ul, .products ul, .ab_news ul, .brandGrid { grid-template-columns: 1fr; } .capabilityGrid .wide, .ab_pro li:first-child { grid-column: auto; } .ab_pro li:first-child a { min-height: 310px; } .homeBrandList article { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; min-height: auto; } .homeBrandList figure { height: 112px; } .newsitem { grid-template-columns: 1fr; } .newsitem .thumbnail img, .newsitem .thumbnail a { height: 170px; } .commentForm .item, .product .cat { grid-template-columns: 1fr; gap: 6px; } } /* 2026 navigation button restore */ .navBtn { position: relative; order: 5; display: none; flex: 0 0 42px; width: 42px; height: 42px; margin-left: 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(255,255,255,.08); cursor: pointer; } .navBtn span, .navBtn span:before, .navBtn span:after { position: absolute; left: 12px; width: 18px; height: 2px; border-radius: 999px; background: #fff; content: ""; transition: transform .22s ease, top .22s ease, opacity .22s ease; } .navBtn span { top: 20px; } .navBtn span:before { top: -7px; } .navBtn span:after { top: 7px; } .navBtn.open span { background: transparent; } .navBtn.open span:before { top: 0; transform: rotate(45deg); } .navBtn.open span:after { top: 0; transform: rotate(-45deg); } @media only screen and (max-width: 1100px) { .header .inner { flex-wrap: nowrap; min-height: 64px; padding: 0; } .logo { flex: 0 0 148px; width: 148px; height: 44px; } .logo a { height: 44px; } .language-switcher { display: none; } .navBtn { display: block; margin-left: auto; } .nav { position: fixed !important; top: 64px !important; right: -340px !important; order: initial; display: block; width: 320px !important; height: calc(100vh - 64px) !important; margin: 0 !important; padding: 14px !important; border-left: 1px solid rgba(255,255,255,.1) !important; background: rgba(8,17,30,.98) !important; box-shadow: 0 24px 80px rgba(0,0,0,.34) !important; overflow-y: auto; transition: right .25s ease; } .nav.open { right: 0 !important; } .nav ul { display: block !important; width: auto; padding: 0 0 18px; overflow: visible; } .nav li { width: 100% !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; text-align: left; } .nav li a { display: block; padding: 13px 42px 13px 14px !important; border-radius: 6px; color: rgba(255,255,255,.82); font-size: 14px; line-height: 20px; white-space: nowrap; } .nav li.cur > a, .nav li:hover > a { background: rgba(24,183,207,.14); color: #fff; } .nav li.cur > a:before, .nav li:hover > a:before { display: none !important; } .nav li ul { position: static !important; display: none; width: auto !important; margin: 0 !important; padding: 0 0 8px 12px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } .nav li em { display: block; position: absolute; top: 0; right: 0; width: 42px; height: 46px; cursor: pointer; } .nav li em:after { content: ""; position: absolute; left: 16px; top: 17px; width: 8px; height: 8px; border-right: 1px solid rgba(255,255,255,.72); border-bottom: 1px solid rgba(255,255,255,.72); transform: rotate(45deg); transition: transform .2s ease; } .nav li em.open:after { top: 20px; transform: rotate(-135deg); } } @media only screen and (max-width: 520px) { .header .inner { min-height: 58px; } .logo { flex-basis: 126px; width: 126px; } .nav { top: 58px !important; right: -100% !important; width: 100% !important; height: calc(100vh - 58px) !important; } .nav.open { right: 0 !important; } } /* 2026 logo vertical alignment fix */ .header .logo { display: flex !important; align-items: center !important; align-self: center !important; height: 50px !important; padding: 0 !important; } .header .logo a { display: block !important; width: 100% !important; height: 38px !important; padding: 0 !important; background-repeat: no-repeat !important; background-position: left center !important; background-size: contain !important; } .header .logo i { position: absolute; inset: 0; height: auto; } @media only screen and (max-width: 1100px) { .header .logo { height: 44px !important; } .header .logo a { height: 34px !important; } } @media only screen and (max-width: 520px) { .header .logo { height: 40px !important; } .header .logo a { height: 31px !important; } } /* 2026 home copy and hero mask cleanup */ .heroStage:after { display: none !important; } .homeCapability { margin-top: 0 !important; padding-top: 78px !important; } .capabilityLead { display: block !important; margin-bottom: 26px !important; } .homeNews .sectionDeck p { display: none !important; } @media only screen and (max-width: 768px) { .homeCapability { padding-top: 46px !important; } }