:root {
--tw-accent: #f08a22;
--tw-accent-dark: #d97110;
--tw-home-overlay: rgba(4, 13, 42, 0.72);
--tw-home-white-soft: rgba(255, 255, 255, 0.78);
/* 棣栭〉鍖哄潡鏍囬銆佺粺璁℃暟瀛楃瓑鍝佺墝钃濓紙PS #1a2285锛?*/
--tw-home-title-blue: #1a2285;
/* 瑕嗙洊 style.min.css锛氶《鏍?鍐呴〉瀵艰埅 bg-white 瀹為檯涓哄搧鐗岃摑锛屼笌椤佃剼 #1a2285 涓€鑷?*/
--tw-primary: #1a2285;
--tw-primary-light: #2a32a8;
--tw-primary-dark: #14196d;
}
/* PSD 杞挱鍥? 涓绘爣棰橈細AlimamaShuHeiTi 78px锛坢anifest 瀵煎嚭锛?*/
@font-face {
font-family: "Alimama ShuHeiTi";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url("../fonts/AlimamaShuHeiTi-Bold.woff2") format("woff2");
}
/* 鏈湴鎬濇簮榛戜綋锛氭鏂囩粺涓€浼樺厛璧伴」鐩唴瀛椾綋鏂囦欢 */
@font-face {
font-family: "Source Han Sans SC";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../fonts/SourceHanSansSC-Regular.woff2") format("woff2");
}
@font-face {
font-family: "Source Han Sans SC";
font-style: normal;
font-weight: 500;
font-display: swap;
src: url("../fonts/SourceHanSansSC-Medium.woff2") format("woff2");
}
@font-face {
font-family: "Source Han Sans SC";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url("../fonts/SourceHanSansSC-Bold.woff2") format("woff2");
}
header.tw-header-home {
position: absolute !important;
top: 0;
left: 0;
width: 100%;
background: linear-gradient(180deg, rgba(0, 7, 24, 0.78), rgba(0, 7, 24, 0.06)) !important;
box-shadow: none !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
header.tw-header-home .container {
padding-left: 0.75rem;
padding-right: 0.75rem;
}
header.tw-header-home .nav-pc .menu > ul > li > .tw-nav-item > a,
header.tw-header-home .lang-text,
header.tw-header-home .lang-icon,
header.tw-header-home .lang-icon-img,
header.tw-header-home .search-icon {
color: rgba(255, 255, 255, 0.92) !important;
}
header .lang-icon-img,
header .search-icon-img {
display: block;
flex-shrink: 0;
}
header.tw-header-home .lang-icon-img,
header.tw-header-home .search-icon-img {
filter: brightness(0) invert(1);
opacity: 0.92;
}
/* 鍐呴〉瀵艰埅鍚屼负娣辫摑搴曪紝鎼滅储/璇█鍥炬爣涓庨椤典竴鑷翠负鐧借壊 */
header:not(.tw-header-home) .lang-icon-img,
header:not(.tw-header-home) .search-icon-img {
filter: brightness(0) invert(1);
opacity: 0.92;
}
header:not(.tw-header-home) .lang-wrapper:hover .lang-icon-img,
header:not(.tw-header-home) .search-icon:hover .search-icon-img {
opacity: 1 !important;
}
header .search-icon {
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
line-height: 0;
margin-right: 24px !important;
}
header.tw-header-home .nav-pc .menu > ul > li > .tw-nav-item > a {
position: relative;
}
header.tw-header-home .nav-pc .menu > ul > li > .tw-nav-item > a.active,
header.tw-header-home .nav-pc .menu > ul > li:hover > .tw-nav-item > a,
header.tw-header-home .search-icon:hover,
header.tw-header-home .lang-wrapper:hover .lang-text {
color: #ffffff !important;
}
header.tw-header-home .lang-wrapper:hover .lang-icon-img,
header.tw-header-home .search-icon:hover .search-icon-img {
opacity: 1 !important;
}
header.tw-header-home .nav-pc .menu > ul > li:hover > .tw-nav-item > a::after,
header.tw-header-home .nav-pc .menu > ul > li > .tw-nav-item > a.active::after {
content: "";
position: absolute;
left: 50%;
bottom: 14px;
width: 28px;
height: 2px;
background: #ffffff;
transform: translateX(-50%);
}
header.tw-header-home .lang-btn {
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 999px;
padding: 0 12px;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
}
header.tw-header-home .lang-dropdown ul {
background: rgba(10, 20, 52, 0.95);
}
header.tw-header-home .lang-dropdown ul li a {
color: rgba(255, 255, 255, 0.85);
}
header.tw-header-home .lang-dropdown ul li a:hover {
color: #fff;
background: rgba(255, 255, 255, 0.08);
}
/* logo2锛?hys-logo锛夛細涓庡唴椤典竴鑷存樉绀猴紱鑻ュ浘涓烘繁鑹插簳绋垮彲鍙栨秷涓嬭 filter */
/* Mobile nav (see style.min @media max-width 991.98px): L1 rows are white; undo header white link color. Hamburger/close icons on blue bar. */
@media (max-width: 991.98px) {
header .menu-mobile .open-icon,
header .menu-mobile .close-icon {
filter: brightness(0) invert(1);
opacity: 0.94;
}
header .menu-mobile:active .open-icon,
header .menu-mobile:active .close-icon {
opacity: 1;
}
header .nav-pc .menu > ul > li > .tw-nav-item > a {
color: var(--tw-primary) !important;
}
header .nav-pc .menu > ul > li > .tw-nav-item > a.active {
color: var(--tw-accent) !important;
font-weight: 600;
}
header .nav-pc .menu > ul > li:hover > .tw-nav-item > a {
color: var(--tw-primary-light) !important;
}
header.tw-header-home .nav-pc .menu > ul > li > .tw-nav-item > a {
color: var(--tw-primary) !important;
}
header.tw-header-home .nav-pc .menu > ul > li > .tw-nav-item > a.active {
color: var(--tw-accent) !important;
}
header.tw-header-home .nav-pc .menu > ul > li:hover > .tw-nav-item > a {
color: var(--tw-primary-light) !important;
}
header .nav-pc .menu > ul > li > .tw-nav-item > a::after,
header.tw-header-home .nav-pc .menu > ul > li:hover > .tw-nav-item > a::after,
header.tw-header-home .nav-pc .menu > ul > li > .tw-nav-item > a.active::after {
content: none !important;
display: none !important;
}
/*
* 内页 header.bg-white：style.min 中一级链接触为白字、hover 仍为 #fff，手机下拉白底会看不见。
* 需带 .bg-white 提高特异性，压过 header.bg-white … > li:hover > .tw-nav-item > a
*/
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li > .tw-nav-item > a {
color: var(--tw-primary) !important;
}
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li > .tw-nav-item > a.active {
color: var(--tw-accent) !important;
font-weight: 600;
}
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li:hover > .tw-nav-item > a,
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li > .tw-nav-item > a:hover,
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li > .tw-nav-item > a:active {
color: var(--tw-primary-light) !important;
}
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li:hover > .tw-nav-item > a.active,
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li > .tw-nav-item > a.active:hover,
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li > .tw-nav-item > a.active:active {
color: var(--tw-accent) !important;
}
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li:hover > .tw-nav-item > a::after,
header.bg-white:not(.tw-header-home) .nav-pc .menu > ul > li > .tw-nav-item > a.active::after {
content: none !important;
display: none !important;
}
}
header.tw-header-home .hys-logo {
display: flex !important;
align-items: center;
flex-shrink: 0;
}
header.tw-header-home .hys-logo img {
display: block;
max-width: 60px;
width: auto;
height: auto;
}
/* PSD 棣栭〉 杞挱鍥? 鍖哄煙楂樺害绾?1027px锛?920 鐢诲竷锛?*/
.tw-home-hero .swiper-slide {
min-height: 1027px;
background: #020915;
overflow: hidden;
}
@media (min-width: 1200px) {
.tw-home-hero .swiper-slide {
height: 1027px;
min-height: 1027px;
}
}
/* 浣跨敤杞挱鍥?瑙嗛浣滀负棣栧睆涓昏瑙夛紝涓庤璁＄涓€鑷达紱鏃犲浘鏃剁敱搴曡壊鍏滃簳 */
.tw-home-hero .swiper-slide::before {
display: none;
content: none;
}
/* 瑕嗙洊 style.min 涓?max-height:800px锛屽惁鍒欏浘鍙樉绀?800px 楂橈紝slide 鏇撮珮鏃跺簳閮ㄤ細闇插嚭搴曡壊/榛戞潯 */
.tw-home-hero.main-slider .swiper-slide .swiper-silde-img,
.tw-home-hero.main-slider .swiper-slide video.swiper-silde-img {
position: absolute;
inset: 0;
width: 100% !important;
height: 100% !important;
min-height: 100% !important;
max-height: none !important;
object-fit: cover;
opacity: 1;
visibility: visible;
z-index: 1;
transform: scale(1);
transition: transform 5s ease-out;
}
.tw-home-hero.main-slider .swiper-slide-active .swiper-silde-img,
.tw-home-hero.main-slider .swiper-slide-active video.swiper-silde-img {
transform: scale(1.06) !important;
}
/* 宸插幓鎺?image-layer / image-layer-overlay 钂欑増锛岃疆鎾浘鐩存帴鏄剧ず鍘熷浘 */
/* 鏁村睆鐐瑰嚮璺宠浆锛堜粎鍥剧墖杞挱锛涙枃妗堝眰 pointer-events:none 璁╃偣鍑荤┛閫忓埌鏈眰锛?*/
.tw-home-hero-slide-hit {
position: absolute;
inset: 0;
z-index: 4;
overflow: hidden;
}
.tw-home-hero-slide-hit .tw-sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
/* 瑕嗙洊 style.min锛氶灞忔枃妗堟寜 PSD 椤跺榻愶紙闈炲瀭鐩村眳涓級锛屽乏瀵归綈绾?110px */
.tw-home-hero .swiper-slide-content {
display: flex !important;
flex-direction: column;
align-items: flex-start !important;
justify-content: flex-start;
box-sizing: border-box;
padding-top: clamp(88px, 12vw, 230px);
padding-left: clamp(20px, 5.73vw, 110px);
padding-right: 24px;
z-index: 5;
pointer-events: none;
}
.tw-home-hero .swiper-slide-content.container {
max-width: none !important;
width: 100%;
margin-left: 0;
margin-right: 0;
}
.tw-home-hero.swiper-container {
overflow: hidden;
}
.tw-home-hero .main-slider__content {
max-width: none;
width: 100%;
box-sizing: border-box;
}
/* 璁捐绋块『搴忎笌闂磋窛锛坢anifest 杞挱鍥? 鍥惧眰 bbox锛?920脳1027锛夛細涓绘爣棰?y鈮?30 鈫?鍓爣棰?y鈮?16(闂磋窛13) 鈫?璇存槑绮?y鈮?22(闂磋窛169) 鈫?姝ｆ枃 y鈮?73(闂磋窛14) 鈫?鎸夐挳 y鈮?34(闂磋窛43) */
.tw-home-hero h2.tw-hero-title,
.tw-home-hero .main-slider__content > h2 {
font-family: "Alimama ShuHeiTi", "Source Han Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: 78px;
line-height: 1.02;
font-weight: 700;
letter-spacing: 0.02em;
margin: 0 0 13px;
max-width: none;
width: 100%;
word-break: normal;
overflow-wrap: break-word;
text-shadow: 0 2px 24px rgba(0, 0, 0, 0.35);
}
/* Banner 鍥涜鏂囨锛氱粺涓€鍏ュ満銆佸悓鏃跺姩锛堟棤闃舵 delay锛夛紱闈炴縺娲婚〉 transition-delay:0 渚夸簬鍒囬〉绔嬪嵆澶嶄綅 */
.tw-home-hero .main-slider__content h2.tw-hero-title,
.tw-home-hero .main-slider__content > h2,
.tw-home-hero .main-slider__content .tw-hero-kicker,
.tw-home-hero .main-slider__content .tw-hero-lead,
.tw-home-hero .main-slider__content .tw-hero-desc {
opacity: 0;
transform: translate3d(0, 40px, 0);
transition: opacity 4s cubic-bezier(0.22, 1, 0.36, 1), transform 4s cubic-bezier(0.22, 1, 0.36, 1);
transition-delay: 0s;
visibility: hidden;
}
.tw-home-hero .swiper-slide-active .main-slider__content h2.tw-hero-title,
.tw-home-hero .swiper-slide-active .main-slider__content > h2,
.tw-home-hero .swiper-slide-active .main-slider__content .tw-hero-kicker,
.tw-home-hero .swiper-slide-active .main-slider__content .tw-hero-lead,
.tw-home-hero .swiper-slide-active .main-slider__content .tw-hero-desc {
opacity: 1;
transform: translate3d(0, 0, 0);
visibility: visible;
transition-delay: 0s;
}
.tw-home-hero .tw-hero-kicker {
margin: 0 0 clamp(48px, 12vw, 169px);
color: rgba(255, 255, 255, 0.95);
font-family: "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: 38px;
font-weight: 500;
letter-spacing: 0.02em;
line-height: 1.15;
}
.tw-home-hero .tw-hero-lead {
max-width: 100%;
margin: 0 0 14px;
color: #ffffff;
font-family: "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: 38px;
font-weight: 700;
line-height: 1.15;
letter-spacing: 0.01em;
text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}
/* 桌面端说明标题行尽量单行展示（移动端仍允许换行） */
@media (min-width: 992px) {
.tw-home-hero .tw-hero-lead {
white-space: nowrap;
}
}
.tw-home-hero .tw-hero-desc {
max-width: 560px;
margin: 0 0 43px;
color: rgba(255, 255, 255, 0.92);
font-family: "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: 18px;
font-weight: 400;
line-height: 1.5;
letter-spacing: 0.02em;
text-shadow: 0 1px 8px rgba(0, 0, 0, 0.3);
}
/* 仅有说明标题行时占位第二行，垂直间距与正文行一致，避免按钮上移 */
.tw-home-hero .tw-hero-desc.tw-hero-desc--spacer {
color: transparent !important;
text-shadow: none !important;
overflow: hidden;
padding: 0;
pointer-events: none;
user-select: none;
min-height: calc(1em * 1.5);
}
.tw-home-hero .swiper-slide-active .main-slider__content .tw-hero-desc.tw-hero-desc--spacer {
opacity: 0 !important;
visibility: hidden !important;
}
.tw-home-hero .main-slider__content .more {
display: inline-flex;
align-items: center;
justify-content: space-between;
min-width: 320px;
min-height: 67px;
padding: 14px 18px 14px 32px;
border: 1px solid rgba(95, 153, 255, 0.34);
border-radius: 999px;
background: rgba(20, 52, 149, 0.9);
box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);
letter-spacing: 0;
text-transform: none;
opacity: 0;
transform: translate3d(0, 40px, 0);
transition:
opacity 4s cubic-bezier(0.22, 1, 0.36, 1),
transform 4s cubic-bezier(0.22, 1, 0.36, 1),
background-color 0.25s ease,
border-color 0.25s ease,
box-shadow 0.25s ease;
transition-delay: 0s;
visibility: hidden;
}
.tw-home-hero .swiper-slide-active .main-slider__content .more {
opacity: 1;
transform: translate3d(0, 0, 0);
visibility: visible;
transition-delay: 0s;
}
.tw-home-hero .main-slider__content .more span {
color: #ffffff;
font-family: "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: 24px;
font-weight: 400;
line-height: 1.2;
}
.tw-home-hero .main-slider__content .more img,
.tw-home-hero .main-slider__content .more .tw-hero-play-icon {
width: 36px;
height: 36px;
margin-left: 18px;
flex-shrink: 0;
}
.tw-home-hero .tw-hero-play-icon {
filter: brightness(0) invert(1);
}
.tw-home-hero .swiper-slide-active .main-slider__content .more:hover {
background: rgba(13, 39, 122, 0.96);
border-color: rgba(255, 255, 255, 0.35);
transform: translate3d(0, -2px, 0);
}
@media (prefers-reduced-motion: reduce) {
.tw-home-hero .main-slider__content h2.tw-hero-title,
.tw-home-hero .main-slider__content > h2,
.tw-home-hero .main-slider__content .tw-hero-kicker,
.tw-home-hero .main-slider__content .tw-hero-lead,
.tw-home-hero .main-slider__content .tw-hero-desc,
.tw-home-hero .main-slider__content .more {
transition-duration: 0.01ms;
transition-delay: 0s !important;
}
}
.tw-home-hero #main-slider-pagination {
bottom: 48px;
z-index: 50;
}
.tw-home-hero #main-slider-pagination .swiper-pagination-bullet {
background: rgba(255, 255, 255, 0.55);
}
.tw-home-hero #main-slider-pagination .swiper-pagination-bullet-active {
background: #ffffff;
}
.tw-section-title h2 {
position: relative;
z-index: 2;
}
.tw-network {
padding: 92px 0 70px;
background: #f8fafc;
}
/* 涓枃鐩稿鑻辨枃姘村嵃涓嬬Щ锛氳鏂囦欢鏈熬 #tw-global-network / translateY锛堥伩鍏嶅崟鐢?padding 琚鐩栨垨鐪嬩笉鍑哄彉鍖栵級 */
.tw-network .tw-section-title {
position: relative;
z-index: 2;
}
.tw-network .tw-section-title h2 {
color: var(--tw-home-title-blue);
font-weight: 700;
}
.tw-network-watermark {
color: rgba(14, 40, 92, 0.05);
font-size: clamp(84px, 11vw, 156px);
letter-spacing: 0.16em;
-webkit-text-stroke: 1px rgba(27, 47, 91, 0.06);
}
.tw-network-map {
position: relative;
/* 鍘?1180px 鍦ㄥぇ灞忎笅鐣欑櫧杩囧锛涙斁瀹戒互璐磋繎 .container 鍙敤瀹藉害 */
max-width: min(100%, 1520px);
margin: 0 auto 48px;
padding-bottom: 56px;
}
.tw-map-img {
width: 100%;
height: auto;
display: block;
opacity: 1 !important; /* 瑕嗙洊 style.min 涓?.tw-map-img { opacity: .8 }锛屽湴鍥惧嬁鍘嬫殫 */
}
.tw-map-img--body {
max-width: 100%;
object-fit: contain;
vertical-align: top;
}
/* 鍥句緥锛歅SD 宸︿笅 */
.tw-map-legend-wrap {
position: absolute;
left: 12px;
bottom: 8px;
z-index: 4;
pointer-events: none;
}
.tw-network-legend {
flex-direction: column;
align-items: flex-start;
gap: 10px 0;
margin: 0;
padding: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}
.tw-legend-item {
display: inline-flex;
align-items: center;
gap: 0.5rem;
color: #475467;
font-size: 15px;
text-shadow:
0 0 8px rgba(255, 255, 255, 0.98),
0 0 4px rgba(255, 255, 255, 0.95),
0 1px 0 rgba(255, 255, 255, 0.9);
}
.tw-legend-icon {
position: relative;
flex-shrink: 0;
width: 28px;
height: 28px;
object-fit: contain;
display: block;
}
/* 鏍囪鐐癸細鍥炬爣 + 鍚嶇О + 鎮仠娴眰 */
.tw-map-marker {
position: absolute;
z-index: 3;
transform: translate(-50%, -50%);
}
.tw-map-marker:hover,
.tw-map-marker:focus-within {
z-index: 30;
}
.tw-map-marker__hit {
position: relative;
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
gap: 4px;
max-width: none;
text-decoration: none;
color: #101828;
font-size: 12px;
font-weight: 500;
line-height: 1.2;
outline: none;
}
.tw-map-marker__hit:hover {
color: var(--tw-primary);
}
/* 瀹㈡埛瓒宠抗锛氭棤閾炬帴锛屼粎灞曞紑鍚嶇О/姘旀场 */
.tw-map-marker__hit--static {
cursor: pointer;
}
.tw-map-marker__icon {
flex-shrink: 0;
filter: drop-shadow(0 1px 2px rgba(15, 23, 42, 0.12));
}
.tw-map-marker__icon--png {
width: 20px;
height: 20px;
object-fit: contain;
display: block;
}
/* 鍥炬爣涓嬫柟甯搁┗鏄剧ず涓枃鍚嶇О */
.tw-map-marker__label {
position: relative;
left: auto;
top: auto;
transform: none;
z-index: 2;
max-width: min(7.5em, 28vw);
padding: 2px 6px;
border-radius: 6px;
background: rgba(255, 255, 255, 0.96);
border: 1px solid rgba(26, 26, 94, 0.12);
box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
white-space: normal;
text-align: center;
font-size: 11px;
font-weight: 600;
line-height: 1.25;
word-break: break-word;
opacity: 1;
visibility: visible;
pointer-events: none;
}
.tw-map-marker__label-text {
display: inline-block;
}
/* 瀹㈡埛瓒宠抗锛氭枃瀛楃洿鎺ュ彔鍦ㄥ湴鍥句笂锛屾棤搴曟 */
.tw-map-marker--footprint .tw-map-marker__label {
padding: 3px 0 0;
background: transparent;
border: none;
box-shadow: none;
border-radius: 0;
color: #152a52;
font-weight: 600;
text-shadow:
0 0 6px rgba(255, 255, 255, 0.95),
0 1px 2px rgba(255, 255, 255, 0.9),
0 0 1px rgba(255, 255, 255, 1);
}
.tw-map-tooltip {
position: absolute;
left: 50%;
bottom: calc(100% + 10px);
transform: translateX(-50%);
z-index: 40;
min-width: 200px;
max-width: 280px;
padding: 12px 14px;
border-radius: 8px;
font-size: 12px;
line-height: 1.45;
color: #fff;
background: linear-gradient(135deg, #ff972f, #f06b11);
box-shadow: 0 14px 28px rgba(240, 138, 34, 0.28);
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity 0.18s ease, visibility 0.18s ease;
}
.tw-map-tooltip::after {
content: "";
position: absolute;
left: 50%;
bottom: -6px;
transform: translateX(-50%);
border-width: 6px 6px 0 6px;
border-style: solid;
border-color: #f07f1b transparent transparent transparent;
}
/* 寮圭獥锛氫腑鏂囧湪涓婏紙鍙琛岋級锛岃嫳鏂囧湪涓?*/
.tw-map-tooltip__zh {
display: block;
font-size: 14px;
font-weight: 700;
line-height: 1.45;
white-space: pre-line;
}
.tw-map-tooltip__en {
display: block;
margin-top: 8px;
padding-top: 8px;
border-top: 1px solid rgba(255, 255, 255, 0.28);
font-size: 11px;
font-weight: 500;
line-height: 1.4;
letter-spacing: 0.02em;
opacity: 0.92;
}
.tw-map-marker:hover .tw-map-tooltip,
.tw-map-marker:focus-within .tw-map-tooltip {
opacity: 1;
visibility: visible;
}
/* 瑙︽懜璁惧锛氬悕绉板父椹伙紱浠呮皵娉＄敱 .is-touch-open 鎺у埗 */
@media (hover: none) {
.tw-map-marker:not(.is-touch-open):hover .tw-map-tooltip,
.tw-map-marker:not(.is-touch-open):focus-within .tw-map-tooltip {
opacity: 0;
visibility: hidden;
}
.tw-map-marker.is-touch-open .tw-map-tooltip {
opacity: 1;
visibility: visible;
}
}
.tw-network-stats {
padding-top: 28px;
border-top: none !important;
}
.tw-stat-item + .tw-stat-item {
border-left: 1px solid rgba(18, 30, 64, 0.12);
}
.tw-network .tw-stat-number .number {
color: var(--tw-home-title-blue) !important;
font-size: 58px;
}
.tw-network .tw-stat-suffix {
color: var(--tw-home-title-blue);
font-size: 18px;
font-weight: 600;
}
.tw-stat-label {
color: #6b7280;
}
/* 瀵煎嚭/01-棣栭〉/manifest 浼佷笟鏂囧寲锛?920 鐢诲竷锛夛細鍥惧眰 2 搴曞浘 1920脳1247锛涙爣棰?y鈮?477鈫掕窛鍖洪《 203px锛涘洓鍗?y鈮?766 楂?532锛屽 355/354/355/355锛涙爣棰樹笅娌垮埌鍗￠《 鈮?42px锛涘崱搴曞埌鑳屾櫙搴?鈮?23px */
.tw-culture {
position: relative;
overflow: hidden;
padding: clamp(56px, 7vw, 88px) 0 clamp(64px, 8vw, 96px);
background: #0b1024;
box-sizing: border-box;
}
@media (min-width: 1200px) {
.tw-culture {
padding: 0;
min-height: 1247px;
}
/* 203 + 鏍囬鍧楃害 47 + 242 + 532 + 223 鈮?1247 */
.tw-culture .tw-culture-inner {
padding-top: 203px;
padding-bottom: 223px;
}
.tw-culture-cards--psd {
max-width: 1080px;
width: 100%;
gap: 24px;
justify-content: center;
grid-template-columns: repeat(4, minmax(0, 252px));
}
}
@media (min-width: 1480px) {
.tw-culture-cards--psd {
grid-template-columns: repeat(4, minmax(0, 268px));
gap: 28px;
max-width: 1196px;
}
}
/* 搴曞浘 1920脳1247锛氱瓑姣旈摵婊″尯鍧楋紝绂佹 100%脳100% 寮忛潪绛夋瘮鎷変几锛涢《瀵归綈鏇存帴杩?PSD 鏋勫浘 */
.tw-culture-bg {
position: absolute;
inset: 0;
z-index: 0;
overflow: hidden;
background-color: #0b1024;
background-image: url("../images/home-culture-bg.jpg");
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
background-attachment: scroll;
}
/* 灏?manifest 瀵煎嚭銆屼紒涓氭枃鍖?鏄熺┖鑳屾櫙/鍥惧眰 2.png銆嶅鍒朵负 tomowa/images/瀵煎嚭棣栭〉/浼佷笟鏂囧寲-鏄熺┖鑳屾櫙.png 鍚庡惎鐢?*/
.tw-culture-bg--export {
background-image: url("../images/home-culture-bg.jpg");
}
/* 鐩存帴灞曠ず搴曞浘锛氬叧闂?style.min 鐨?rgba 钂欑増涓庢湰灞傛笎鍙橈紙::after 涓嶆覆鏌擄級 */
.tw-culture-bg::after {
display: none;
}
.tw-culture-bg .tw-culture-watermark {
position: absolute;
left: 50%;
top: 9.06%;
transform: translateX(-50%);
z-index: 0;
font-family: "Alimama ShuHeiTi", "Noto Sans SC", sans-serif;
font-size: clamp(72px, 14vw, 150px);
font-weight: 700;
letter-spacing: 0.12em;
line-height: 1;
white-space: nowrap;
pointer-events: none;
color: transparent;
-webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.28);
text-shadow: 0 0 40px rgba(255, 255, 255, 0.06);
}
.tw-culture-inner {
z-index: 1;
}
.tw-culture-heading {
margin-bottom: clamp(40px, 6vw, 100px);
}
@media (min-width: 1200px) {
.tw-culture-heading {
margin-bottom: 242px;
}
}
.tw-culture .tw-section-title h2,
.tw-culture-heading h2 {
color: #ffffff;
font-size: clamp(28px, 3.2vw, 48px);
font-weight: 700;
letter-spacing: 0.06em;
margin: 0;
}
.tw-culture-heading h2 .tw-home-section-title-link {
color: inherit;
text-decoration: none;
cursor: pointer;
}
.tw-culture-heading h2 .tw-home-section-title-link:hover {
opacity: 0.92;
}
.tw-culture-cards--psd {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 20px;
justify-content: center;
max-width: 1200px;
margin-left: auto;
margin-right: auto;
}
.tw-culture-card-link {
display: flex;
flex-direction: column;
align-items: stretch;
height: 100%;
text-decoration: none;
color: inherit;
}
.tw-culture-card-link:focus-visible {
outline: 2px solid rgba(255, 255, 255, 0.45);
outline-offset: 4px;
border-radius: 14px;
}
.tw-culture-card {
position: relative;
isolation: isolate;
flex: 1 1 auto;
min-height: 0;
padding: 42px 22px 56px;
display: flex;
flex-direction: column;
align-items: center;
/* 鐏拌壊搴?70% 閫忔槑锛坅lpha 0.3锛夛紱鎮仠鐣ユ祬鐏帮紝鍚屼负 0.3 */
background: linear-gradient(180deg, rgba(100, 108, 118, 0.3) 0%, rgba(72, 78, 88, 0.3) 100%);
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 12px;
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
transition: background 0.35s ease, transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}
.tw-culture-card-link:hover .tw-culture-card,
.tw-culture-card-link:focus-within .tw-culture-card {
transform: translateY(-4px);
background: linear-gradient(180deg, rgba(190, 198, 208, 0.3) 0%, rgba(165, 174, 186, 0.3) 100%);
border-color: rgba(255, 255, 255, 0.32);
box-shadow: 0 22px 48px rgba(0, 0, 0, 0.22);
}
.tw-culture-card-link:hover .tw-culture-icon,
.tw-culture-card-link:focus-within .tw-culture-icon {
border-color: transparent;
background: transparent;
}
/* 鏃犲渚у渾鐜紱浠呬繚鐣欏浘鏍囧尯鍩燂紙PSD 涓虹函鍥炬爣锛?*/
.tw-culture-icon {
position: relative;
z-index: 1;
margin: 0 auto 14px;
border: none;
background: none;
border-radius: 0;
width: auto;
height: auto;
min-height: 0;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
}
/* 鐧藉瓧 + 鐧借壊绾跨鍥炬爣锛堜笌娣辫壊/娴呴€忓崱瀵规瘮锛?*/
.tw-culture-card-link:nth-child(1) .tw-culture-icon-img--vision {
filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.35));
opacity: 1;
}
.tw-culture-card-link:nth-child(2) .tw-culture-icon-img,
.tw-culture-card-link:nth-child(3) .tw-culture-icon-img {
filter: brightness(0) invert(1) drop-shadow(0 0 12px rgba(255, 255, 255, 0.35));
opacity: 1;
}
.tw-culture-card-link:nth-child(4) .tw-culture-icon-img {
filter: brightness(0) invert(1) drop-shadow(0 0 8px rgba(255, 200, 160, 0.45));
}
.tw-culture-card-link:nth-child(1):hover .tw-culture-icon-img--vision,
.tw-culture-card-link:nth-child(1):focus-within .tw-culture-icon-img--vision {
filter: drop-shadow(0 0 14px rgba(255, 255, 255, 0.5));
}
.tw-culture-card-link:nth-child(2):hover .tw-culture-icon-img,
.tw-culture-card-link:nth-child(2):focus-within .tw-culture-icon-img,
.tw-culture-card-link:nth-child(3):hover .tw-culture-icon-img,
.tw-culture-card-link:nth-child(3):focus-within .tw-culture-icon-img {
filter: brightness(0) invert(1) drop-shadow(0 0 14px rgba(255, 255, 255, 0.45));
}
.tw-culture-card-link:nth-child(4):hover .tw-culture-icon-img,
.tw-culture-card-link:nth-child(4):focus-within .tw-culture-icon-img {
filter: brightness(0) invert(1) drop-shadow(0 0 10px rgba(255, 200, 160, 0.55));
}
.tw-culture-icon-img {
width: 56px;
height: 56px;
object-fit: contain;
}
@media (min-width: 1200px) {
.tw-culture-icon-img {
width: 64px;
height: 64px;
}
}
.tw-culture-card h4 {
position: relative;
z-index: 1;
font-size: clamp(17px, 1.35vw, 22px);
font-weight: 700;
margin-bottom: 12px;
color: #ffffff;
transition: color 0.3s ease;
width: 100%;
text-align: center;
}
/* 姝ｆ枃鍖烘寜 4 琛岄珮搴﹀崰浣嶏紱4 琛屽崱鐢?1.75 琛岃窛锛? 琛屽崱鐢ㄦ洿澶ц璺濅娇鎬婚珮涓?4 琛屼竴鑷达紙涓庨椤?index 鍥涘崱鏂囨琛屾暟瀵瑰簲锛?*/
.tw-culture-card p {
position: relative;
z-index: 1;
font-size: clamp(13px, 1.05vw, 15px);
line-height: 1.75;
color: rgba(255, 255, 255, 0.92);
transition: color 0.3s ease;
margin: 0;
padding-bottom: 12px;
width: 100%;
text-align: center;
flex: 1 1 auto;
min-height: calc(4 * 1.75em + 0.5em);
box-sizing: border-box;
}
.tw-culture-card-link:nth-child(1) p,
.tw-culture-card-link:nth-child(3) p,
.tw-culture-card-link:nth-child(4) p {
line-height: calc((4 * 1.75 + 0.5) / 3);
}
.tw-culture-card-link:nth-child(2) p {
line-height: 1.75;
}
/* 瑕嗙洊 style.min.css 鏃ц鍒欙細.tw-culture-card:hover h4,p { color:#333 }锛屾偓鍋滀繚鎸佺櫧瀛?*/
#tw-home-culture .tw-culture-cards--psd .tw-culture-card:hover h4,
#tw-home-culture .tw-culture-cards--psd .tw-culture-card-link:hover .tw-culture-card h4 {
color: #ffffff;
}
#tw-home-culture .tw-culture-cards--psd .tw-culture-card:hover p,
#tw-home-culture .tw-culture-cards--psd .tw-culture-card-link:hover .tw-culture-card p {
color: rgba(255, 255, 255, 0.92);
}
#tw-home-culture .tw-culture-cards--psd .tw-culture-card:hover .tw-culture-icon {
color: inherit;
border-color: transparent;
}
@media (max-width: 1199.98px) {
.tw-culture-cards--psd {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
max-width: 720px;
}
}
@media (max-width: 575.98px) {
.tw-culture-cards--psd {
grid-template-columns: 1fr;
gap: 14px;
}
}
.tw-honor {
position: relative;
padding: 96px 0 82px;
background: #f7fbff;
box-sizing: border-box;
}
.tw-honor::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg, #f7fbff 0%, #eef3f9 100%);
pointer-events: none;
z-index: 0;
}
/* 鈥斺€?棣栭〉鑽ｈ獕璧勮川锛氬鍑?01-棣栭〉/manifest銆岃崳瑾夎瘉涔︺€嶇粍 1920脳1604 鈥斺€?*/
.tw-honor.tw-honor--psd::before {
display: none;
}
/* 鈥斺€?棣栭〉鑽ｈ獕璧勮川锛氶珮搴﹀弬鐓т紒涓氭枃鍖栧尯锛堢害 1247px 閲忕骇锛夛紝鐣ュ帇缂╁師 1604 鐢绘澘鐣欑櫧 鈥斺€?*/
.tw-honor--psd {
position: relative;
padding: 0;
padding-bottom: clamp(40px, 10vw, 200px);
background: #f7fbff;
box-sizing: border-box;
min-height: clamp(560px, 65vw, 1247px);
}
.tw-honor-bg {
position: absolute;
inset: 0;
z-index: 0;
overflow: hidden;
pointer-events: none;
}
/*
* 鍥惧眰 23锛歝over 宸查摵婊℃暣鍧楀尯鍩燂紙鏃犮€屽彧閾轰竴鍗娿€嶇殑 bug锛夈€? * 绔栧悜 cover 浼氳鎺夊鍑虹殑楂樺害锛氳嫢鐢?center bottom锛屼細瑁佹帀鍥俱€屼笂鏂广€嶃€侀湶鍑哄亸鐧界殑銆屼笅鍗婂紶銆嶏紱
* 璁捐绋垮缓绛戝鍦ㄥ浘涓婇儴锛屾晠鐢?center top锛屼紭鍏堜繚鐣欏缓绛戙€佽鎺夊浘搴曢儴鐣欑櫧銆? */
.tw-honor-decor-layer {
position: absolute;
inset: 0;
background-color: #f7fbff;
background-image: url("../images/honor-psd-bg-layer-23.png");
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
opacity: 1;
pointer-events: none;
}
.tw-honor--psd .tw-honor-watermark {
position: absolute;
left: 50%;
top: 7.36%;
transform: translateX(-50%);
margin: 0;
font-family: "Alimama ShuHeiTi", "Noto Sans SC", sans-serif;
font-size: clamp(64px, 7.8vw, 150px);
font-weight: 700;
line-height: 1;
letter-spacing: 0.1em;
font-style: normal;
text-transform: none;
color: transparent;
-webkit-text-stroke: 1.5px rgba(16, 38, 80, 0.14);
text-shadow: none;
}
.tw-honor-inner {
position: relative;
z-index: 2;
}
.tw-honor--psd .tw-honor-inner {
padding-top: clamp(48px, 8vw, 120px);
}
/* manifest锛氳崳瑾夎祫璐?SourceHanSansCN-Bold 48px */
.tw-honor--psd .tw-honor-heading h2 {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
font-size: clamp(28px, 2.5vw, 48px);
font-weight: 700;
letter-spacing: 0.06em;
color: var(--tw-home-title-blue);
margin: 0;
line-height: 1.1;
}
.tw-honor--psd .tw-honor-heading h2 .tw-home-section-title-link {
color: inherit;
text-decoration: none;
cursor: pointer;
}
.tw-honor--psd .tw-honor-heading h2 .tw-home-section-title-link:hover {
opacity: 0.9;
}
/* 鏍囬涓庝富鍐呭鍖洪棿璺濓紱涓枃涓嬬Щ瑙佹枃浠舵湯灏?#tw-home-honor + translateY */
.tw-honor--psd .tw-honor-heading {
margin-bottom: clamp(36px, 6vw, 120px);
}
.tw-honor-grid--psd {
display: grid;
grid-template-columns: minmax(0, 646px) minmax(0, 820px);
align-items: center;
max-width: min(1620px, 100%);
margin: 0 auto;
column-gap: clamp(24px, 4vw, 56px);
row-gap: 28px;
}
.tw-honor-col--copy {
text-align: center;
max-width: 669px;
margin-left: auto;
margin-right: auto;
}
/* 鑽ｈ獕鏂囨鍖猴細涓绘爣棰樹笌鍓枃鍧囧眳涓?*/
.tw-honor--psd .tw-honor-col--copy .tw-honor-desc {
text-align: center;
margin-left: auto;
margin-right: auto;
}
.tw-honor-lead {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
font-size: clamp(28px, 4.1vw, 78px);
font-weight: 700;
line-height: 1.15;
margin: 0 0 clamp(12px, 2vw, 22px);
color: var(--tw-home-title-blue);
}
/* manifest锛氬疄鍔涜璇?瀹㈡埛涔嬮€?SourceHanSansCN-Bold 鈮?8.37px */
.tw-honor--psd .tw-honor-lead {
color: #000000;
font-size: clamp(28px, 4.09vw, 78px);
line-height: 1.15;
}
@media (min-width: 992px) {
.tw-honor--psd .tw-honor-lead {
white-space: nowrap;
}
}
.tw-honor-desc {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
font-size: clamp(15px, 1.72vw, 33px);
font-weight: 400;
line-height: 1.45;
margin: 0 auto;
max-width: 42em;
color: #3d4a5c;
}
/* manifest锛氳鏄庢枃妗?SourceHanSansCN-Regular 鈮?3px */
.tw-honor--psd .tw-honor-desc {
font-size: clamp(16px, 1.72vw, 33px);
line-height: 1.45;
}
.tw-honor--psd .tw-honor-tags {
display: flex;
justify-content: center;
margin-top: clamp(16px, 2.5vw, 28px);
}
/* 浠呬繚鐣?PSD 鐭╁舰搴曞浘涓€閲嶆弿杈癸紝鍕垮啀鍙犲姞 CSS border */
.tw-honor--psd .tw-honor-tag--epson {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 192px;
min-height: 41px;
padding: 4px 16px;
font-family: "Microsoft YaHei", "Noto Sans SC", sans-serif;
font-size: clamp(16px, 1.45vw, 28px);
font-weight: 400;
color: var(--tw-home-title-blue);
border: none;
border-radius: 0;
background: url("../images/honor-psd-tag-bg.png") center center / contain no-repeat;
background-color: transparent;
}
.tw-honor-col--visual {
display: flex;
justify-content: center;
align-items: flex-start;
}
/* 璇佷功缁勶細姣斾緥涓?PSD 724:557 涓€鑷?*/
.tw-honor-visual {
position: relative;
width: 100%;
max-width: 820px;
min-height: 631px;
margin: 0 auto;
overflow: visible;
filter: drop-shadow(0 12px 32px rgba(15, 35, 70, 0.1));
}
.tw-honor-visual .tw-honor-frame {
position: absolute;
left: 15.75%;
top: 0;
width: 84.25%;
max-width: 690px;
line-height: 0;
z-index: 1;
}
.tw-honor-frame-base {
width: 100%;
height: auto;
display: block;
vertical-align: top;
}
.tw-honor-frame-inner {
position: absolute;
left: 6.56%;
top: 9.53%;
width: 85.57%;
height: auto;
display: block;
pointer-events: none;
}
.tw-honor-visual .tw-honor-trophy {
position: absolute;
left: 0;
top: 35.35%;
width: 32.46%;
max-width: 235px;
z-index: 3;
}
.tw-honor-trophy-cup {
width: 100%;
height: auto;
display: block;
vertical-align: top;
}
.tw-honor-trophy-logo {
position: absolute;
left: 39.15%;
top: 84.97%;
width: 21.7%;
height: auto;
display: block;
pointer-events: none;
}
/* 璇佷功灞€閮ㄦ斁澶э細鍦嗗舰鏀惧ぇ闀滃彔鍦ㄧ敾妗嗗彸涓婁晶锛堜笌璇佷功鍚屽浘锛屾斁澶ц鍒囷級锛涚暐瓒呭嚭鍙崇紭浠ヨ创杩戣璁＄ */
.tw-honor-magnify {
position: absolute;
left: auto;
right: -7%;
top: 18%;
z-index: 5;
width: min(28%, 200px);
max-width: 200px;
pointer-events: none;
text-align: center;
}
.tw-honor-magnify__glass {
position: relative;
width: 100%;
aspect-ratio: 1;
margin: 0 auto;
border-radius: 50%;
overflow: hidden;
border: 3px solid rgba(255, 255, 255, 0.98);
box-shadow:
0 0 0 1px rgba(15, 35, 70, 0.08),
0 12px 40px rgba(15, 35, 70, 0.22);
background: #fff;
}
.tw-honor-magnify__img {
position: absolute;
left: 50%;
top: 50%;
width: 260%;
max-width: none;
height: auto;
transform: translate(-50%, -48%);
display: block;
}
.tw-honor-magnify__caption {
margin: 10px 0 0;
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
font-size: clamp(12px, 1.1vw, 15px);
font-weight: 600;
color: var(--tw-home-title-blue);
letter-spacing: 0.04em;
}
@media (max-width: 1199.98px) {
.tw-honor-magnify {
width: min(34%, 160px);
right: -3%;
top: 14%;
}
}
@media (max-width: 575.98px) {
.tw-honor-magnify {
width: min(34%, 120px);
}
}
/* 鏁村潡鍖哄煙搴曢儴銆屾煡鐪嬫洿澶氥€嶏細鐩稿鍘?manifest 宸﹀亸绉?x鈮?11锛屽啀鏁翠綋鍙崇Щ涓€娈?*/
.tw-honor--psd .tw-honor-more {
position: relative;
z-index: 4;
margin: 0;
margin-left: clamp(20px, calc(5.78vw + 24px), 150px);
margin-top: 0;
margin-bottom: 0;
padding: 0;
width: fit-content;
max-width: min(92%, calc(100% - 32px));
text-align: left;
}
/* manifest锛氱偣鍑绘煡鐪嬫洿澶氣€?SourceHanSansCN-Regular 20px */
.tw-honor--psd .tw-honor-more a {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
font-size: clamp(14px, 1.042vw, 20px);
font-weight: 400;
color: #5a6a82;
text-decoration: none;
border-bottom: 1px solid rgba(90, 106, 130, 0.35);
padding-bottom: 2px;
transition: color 0.2s ease, border-color 0.2s ease;
}
.tw-honor--psd .tw-honor-more a:hover {
color: var(--tw-home-title-blue);
border-color: rgba(26, 34, 133, 0.45);
}
@media (min-width: 1200px) {
/* 椤惰窛鍙傜収浼佷笟鏂囧寲鍖虹暐鏀剁揣锛堟枃鍖栧尯 lg 绾?203px锛?*/
.tw-honor--psd .tw-honor-inner {
padding-top: clamp(72px, 8.5vw, 168px);
}
.tw-honor--psd .tw-honor-content--psd {
padding-bottom: 0;
}
.tw-honor--psd .tw-honor-more {
position: relative;
width: fit-content;
margin-left: clamp(20px, calc(5.78vw + 24px), 150px);
margin-top: clamp(28px, 2.5vw, 40px);
margin-bottom: 0;
text-align: left;
}
.tw-honor-grid--psd {
grid-template-columns: minmax(0, 1fr) minmax(0, 860px);
max-width: min(1620px, 100%);
column-gap: clamp(40px, 5vw, 72px);
}
.tw-honor-col--copy {
max-width: none;
margin: 0;
text-align: center;
padding-right: 0;
align-self: center;
}
/* 璧勮川鍥鹃潬鍙筹紙灏哄涓嶅彉锛屼粎甯冨眬鍙崇Щ锛?*/
.tw-honor-col--visual {
justify-content: flex-end;
justify-self: end;
width: 100%;
}
.tw-honor--psd .tw-honor-visual {
margin-left: clamp(20px, 3.5vw, 56px);
}
}
@media (min-width: 1500px) {
.tw-honor-grid--psd {
grid-template-columns: 620px 860px;
}
}
@media (max-width: 1199.98px) {
.tw-honor--psd {
min-height: 0;
padding-bottom: clamp(40px, 8vw, 120px);
}
.tw-honor--psd .tw-honor-heading {
margin-bottom: clamp(32px, 8vw, 120px);
}
.tw-honor-grid--psd {
grid-template-columns: 1fr;
gap: 28px;
}
.tw-honor--psd .tw-honor-col--copy {
text-align: center;
padding-right: 0;
}
.tw-honor-visual {
position: relative;
aspect-ratio: 820 / 631;
width: 100%;
max-width: 820px;
min-height: 0;
margin: 0 auto;
}
.tw-honor-visual .tw-honor-frame {
position: absolute;
left: 15.75%;
width: 84.25%;
}
.tw-honor-visual .tw-honor-trophy {
top: 35.35%;
width: min(32.46%, 235px);
}
.tw-honor--psd .tw-honor-more {
position: relative;
margin-left: clamp(16px, calc(4vw + 20px), 48px);
margin-top: 28px;
padding: 0;
max-width: none;
text-align: left;
}
}
/* 椤佃剼锛歮anifest 椤舵爮 SourceHanSansCN-Bold 18px锛涙爮鍐呮鏂?鏍囬 Regular 14px leading鈮?0px锛汣ontact us Bold 鈮?6px */
.tw-footer {
font-family: "Source Han Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
background: #1a2285;
color: rgba(255, 255, 255, 0.82);
padding-top: 40px;
-webkit-font-smoothing: antialiased;
}
/* 椤佃剼鑷€傚簲锛氱獎灞忕旱鍚戝爢鍙狅紝lg 璧?6 鍒楁爡鏍间笌椤惰瀵归綈 */
.tw-footer-layout {
display: flex;
flex-direction: column;
gap: 22px;
padding-bottom: 34px;
}
.tw-footer-layout__logo {
display: inline-block;
align-self: center;
}
.tw-footer-layout__logo img {
max-width: 180px;
height: auto;
vertical-align: middle;
}
.tw-footer-layout__nav {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 10px 20px;
margin: 0;
padding: 0;
}
.tw-footer-layout__nav a {
color: #ffffff;
font-size: 18px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0;
white-space: nowrap;
}
.tw-footer-layout__nav a:hover {
color: #ffffff;
}
.tw-footer-layout__contact-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
min-width: 0;
}
.tw-footer-layout__contact-title {
margin: 0;
padding: 0;
color: #ffffff;
font-size: clamp(28px, 3.2vw, 36px);
font-weight: 700;
line-height: 1.15;
letter-spacing: 0.02em;
text-align: left;
flex: 1 1 auto;
min-width: 0;
}
.tw-footer-layout__contact-logo2 {
flex: 0 0 auto;
margin-left: auto;
display: block;
height: auto;
max-height: 38px;
width: auto;
max-width: min(140px, 42vw);
object-fit: contain;
}
.tw-footer-layout__rule {
height: 0;
margin: 0;
border: 0;
border-top: 1px solid rgba(255, 255, 255, 0.45);
}
@media (min-width: 992px) {
.tw-footer-layout {
display: grid;
/* 涓棿 7 鍒?0.72fr锛汣ontact 鐣ユ敹绐勶紙2.1fr锛夛紝閬垮厤鍙充晶杩囧 */
grid-template-columns:
168px
minmax(28px, 48px)
repeat(7, minmax(0, 0.72fr))
minmax(240px, 2.1fr);
column-gap: clamp(12px, 1.6vw, 28px);
row-gap: 0;
align-items: start;
padding-bottom: 34px;
width: 100%;
max-width: 100%;
}
.tw-footer-layout__logo {
grid-column: 1;
grid-row: 1;
align-self: center;
}
/* 涓庝笅鏂规爮鍚屼负銆屽垪宸︾紭瀵归綈銆嶏細鍕跨敤 text-align:center锛屽惁鍒欏瓧鍦ㄦ牸鍐呭眳涓紝浼氭樉寰楁瘮宸﹀榻愮殑姝ｆ枃銆屽亸鍙炽€嶏紝鐪嬭捣鏉ュ儚娌″榻?*/
.tw-footer-layout__nav {
grid-column: 3 / span 7;
grid-row: 1;
align-self: center;
display: grid;
grid-template-columns: repeat(7, minmax(0, 1fr));
justify-items: stretch;
align-items: center;
gap: 0;
padding: 0;
width: 100%;
max-width: 100%;
box-sizing: border-box;
}
.tw-footer-layout__nav a {
min-width: 0;
text-align: left;
justify-self: stretch;
}
.tw-footer-layout__contact-head {
grid-column: 10;
grid-row: 1;
align-self: center;
}
.tw-footer-layout__rule {
grid-column: 1 / -1;
grid-row: 2;
margin: 18px 0 26px;
}
/* 宸﹀垪涓庝腑闂存爮绛夐珮锛屽垎浜尯鐢?margin-top:auto 娌夊簳锛屼笉绱ц创浜岀淮鐮?*/
.tw-footer-layout__qr {
grid-column: 1;
grid-row: 3;
align-self: stretch;
display: flex;
flex-direction: column;
}
/* 棣栭〉 | 鍏充簬鎴戜滑 | 浜у搧鏈嶅姟 | 浼佷笟鍔ㄦ€?| 鍚堜綔妗堜緥 | 浜烘墠鎷涜仒 | 鏈嶅姟鏀寔 */
.tw-footer-layout__col--home {
grid-column: 3;
grid-row: 3;
}
.tw-footer-layout__col--about {
grid-column: 4;
grid-row: 3;
}
/* 鍏徃淇℃伅杈冨锛氬乏缂樹笌銆屼骇鍝佹湇鍔°€嶅悓鍒楋紝鍚戝彸璺ㄨ嚦銆屼汉鎵嶆嫑鑱樸€嶅垪锛岄伩鍏嶅崟鍒楄繃绐?*/
.tw-footer-layout__col--product {
grid-column: 5 / span 4;
grid-row: 3;
}
.tw-footer-layout__col--support {
grid-column: 9;
grid-row: 3;
}
.tw-footer-layout__col--contact {
grid-column: 10;
grid-row: 3;
}
}
.tw-footer-brand {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
max-width: 200px;
margin-left: auto;
margin-right: auto;
}
@media (min-width: 992px) {
.tw-footer-brand {
margin-left: 0;
margin-right: 0;
align-items: center;
flex: 1 1 auto;
min-height: 0;
width: 100%;
}
}
.tw-footer-share-label {
margin: 18px 0 10px;
color: rgba(255, 255, 255, 0.72);
font-size: 14px;
font-weight: 400;
width: 100%;
text-align: center;
}
@media (min-width: 992px) {
.tw-footer-share-label {
margin-top: auto;
margin-bottom: 12px;
}
}
.tw-footer-qrcodes {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin-bottom: 22px;
}
.tw-footer-qrcode img {
width: 132px;
height: 132px;
object-fit: cover;
background: #fff;
padding: 6px;
border-radius: 6px;
}
.tw-footer-qrcode p {
margin-top: 8px;
color: rgba(255, 255, 255, 0.72);
font-size: 13px;
}
.tw-footer-share {
display: flex;
justify-content: center;
gap: 14px;
width: 100%;
}
.tw-footer-share a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
border: 1px solid rgba(255, 255, 255, 0.22);
border-radius: 50%;
color: #fff;
cursor: pointer;
}
.tw-footer-share a:hover {
background: rgba(255, 255, 255, 0.1);
}
/* 微信分享弹层：顶栏与页脚同色 #1a2285，白底紧凑，二维码居中；仅保留右上角关闭 */
.tw-footer-share-qrcode-host {
box-sizing: border-box;
}
body .layui-layer.tw-layer-wechat-share {
border-radius: 10px;
overflow: hidden;
box-shadow: 0 20px 56px rgba(0, 0, 0, 0.35);
border: 1px solid rgba(255, 255, 255, 0.12);
}
body .layui-layer.tw-layer-wechat-share .layui-layer-title {
height: 48px;
line-height: 48px;
padding: 0 50px 0 18px;
margin: 0;
font-size: 15px;
font-weight: 600;
letter-spacing: 0.02em;
color: #fff;
background: #1a2285;
border: none;
}
body .layui-layer.tw-layer-wechat-share .layui-layer-setwin {
top: 0;
right: 0;
line-height: 48px;
width: auto;
font-size: 0; /* 去掉子元素间空隙，仅保留一个关闭时排版稳定 */
}
/* 防御：全局面层可能带最小化/最大化，此类弹窗只应显示关闭 */
body .layui-layer.tw-layer-wechat-share .layui-layer-setwin .layui-layer-min,
body .layui-layer.tw-layer-wechat-share .layui-layer-setwin .layui-layer-max {
display: none !important;
}
/* layui 关闭是 icon.png 雪碧图，默认 16×16。勿把 a 设成 48×48，否则不缩放背景时同一行会露出 3 个图块。用 padding 扩大热区。 */
body .layui-layer.tw-layer-wechat-share .layui-layer-setwin a.layui-layer-ico,
body .layui-layer.tw-layer-wechat-share .layui-layer-setwin a[class*="layui-layer-close"] {
box-sizing: content-box !important;
width: 16px !important;
height: 16px !important;
padding: 16px;
margin: 0 !important;
background-clip: content-box !important;
background-origin: content-box !important;
border-radius: 0 9px 0 0;
filter: brightness(0) invert(1);
opacity: 0.9;
transition: opacity 0.2s ease, background-color 0.2s ease;
}
body .layui-layer.tw-layer-wechat-share .layui-layer-setwin a.layui-layer-ico:hover,
body .layui-layer.tw-layer-wechat-share .layui-layer-setwin a[class*="layui-layer-close"]:hover {
opacity: 1;
/* 禁止写 background: 简写，会清掉雪碧图 background-image */
background-color: rgba(255, 255, 255, 0.12);
}
body .layui-layer.tw-layer-wechat-share .layui-layer-content {
padding: 20px 22px 22px;
background: #fff;
height: auto !important;
overflow: visible !important;
line-height: 0;
}
body .layui-layer.tw-layer-wechat-share .tw-footer-share-qrcode-host {
display: flex !important;
justify-content: center;
align-items: center;
}
body .layui-layer.tw-layer-wechat-share .tw-footer-share-qrcode-host table {
margin: 0 auto;
}
body .layui-layer.tw-layer-wechat-share #qrcode {
display: flex;
justify-content: center;
align-items: center;
min-height: 0;
}
body .layui-layer.tw-layer-wechat-share #qrcode table {
margin: 0 auto;
}
.tw-footer-layout__col {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0;
min-width: 0;
}
.tw-footer-link {
display: block;
margin-bottom: 10px;
color: rgba(255, 255, 255, 0.8);
font-size: 14px;
font-weight: 400;
line-height: calc(30 / 14);
text-decoration: none;
}
.tw-footer-link:last-child {
margin-bottom: 0;
}
.tw-footer-link:hover {
color: #ffffff;
}
.tw-footer-subhead {
margin: 0 0 8px;
padding: 0;
color: #ffffff;
font-size: 14px;
font-weight: 700;
line-height: calc(30 / 14);
}
.tw-footer-layout__col--product .tw-footer-product-block:first-child .tw-footer-subhead {
margin-top: 0;
}
.tw-footer-product-block {
margin-bottom: 18px;
width: 100%;
}
.tw-footer-product-block:last-child {
margin-bottom: 0;
}
.tw-footer-link--sub {
font-size: 14px;
font-weight: 400;
line-height: calc(30 / 14);
color: rgba(255, 255, 255, 0.72);
margin-bottom: 6px;
word-break: break-word;
}
.tw-footer-link--sub:hover {
color: rgba(255, 255, 255, 0.92);
}
.tw-footer-layout__col--contact {
text-align: left;
}
.tw-footer-layout__col--contact .tw-footer-contact {
padding-left: 0;
width: 100%;
max-width: 100%;
text-align: left;
}
.tw-footer-contact {
padding-left: 0;
padding-top: 0;
text-align: left;
}
.tw-footer-contact-list {
display: flex;
flex-direction: column;
gap: 24px;
}
.tw-footer-contact-block {
padding-bottom: 18px;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.tw-footer-contact-block:last-child {
padding-bottom: 0;
border-bottom: 0;
}
.tw-footer-contact-company {
margin-bottom: 10px;
color: #ffffff;
font-size: 14px;
font-weight: 400;
line-height: calc(30 / 14);
}
.tw-footer-contact--minimal .tw-footer-contact-list--stack {
gap: 20px;
}
.tw-footer-contact-block--minimal {
padding-bottom: 16px;
}
.tw-footer-contact-block--minimal .tw-footer-contact-company {
margin-bottom: 8px;
}
.tw-footer-contact-email {
font-size: 14px;
font-weight: 400;
line-height: 1.5;
word-break: break-all;
}
.tw-footer-contact-email a {
color: rgba(255, 255, 255, 0.92);
text-decoration: none;
}
.tw-footer-contact-email a:hover,
.tw-footer-contact-email a:focus-visible {
color: #ffffff;
}
.tw-footer-contact-phone {
margin-top: 6px;
font-size: 14px;
font-weight: 400;
line-height: 1.5;
word-break: break-all;
}
.tw-footer-contact-phone a {
color: rgba(255, 255, 255, 0.92);
text-decoration: none;
}
.tw-footer-contact-phone a:hover,
.tw-footer-contact-phone a:focus-visible {
color: #ffffff;
}
.tw-footer-contact h4 {
margin-bottom: 20px;
color: #ffffff;
font-size: 26px;
font-weight: 700;
}
.tw-footer-contact-item {
display: flex;
align-items: flex-start;
gap: 12px;
margin-bottom: 12px;
font-size: 14px;
font-weight: 400;
line-height: 1.65;
}
.tw-footer-contact-item span {
flex: 1 1 auto;
min-width: 0;
word-break: break-word;
overflow-wrap: break-word;
}
.tw-footer-contact-item i {
flex-shrink: 0;
margin-top: 4px;
color: rgba(255, 255, 255, 0.86);
width: 14px;
text-align: center;
font-size: 13px;
}
/* 閫氭爮搴曟潯锛氬乏鍙宠创榻愯鍙ｏ紱鏂囨浠嶅湪 .container 鍐呬笌涓诲鑸榻?*/
.tw-footer-bottom {
width: 100%;
margin: 0;
padding: 0;
border-top: 1px solid rgba(255, 255, 255, 0.12);
background: #1a2285;
font-size: 14px;
font-weight: 400;
box-sizing: border-box;
}
.tw-footer-bottom-inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 18px;
padding: 16px 0 22px;
box-sizing: border-box;
}
@media (max-width: 575.98px) {
.tw-footer-bottom-inner {
flex-direction: column;
align-items: flex-start;
}
.tw-footer-legal-links {
justify-content: flex-start;
max-width: 100%;
}
}
.tw-footer-bottom p {
margin: 0;
color: rgba(255, 255, 255, 0.75);
}
.tw-footer-bottom a {
color: rgba(255, 255, 255, 0.78);
}
.tw-footer-legal-links {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-end;
gap: 0;
margin: 0;
max-width: min(100%, 520px);
}
.tw-footer-legal-link {
color: rgba(255, 255, 255, 0.78);
text-decoration: none;
white-space: nowrap;
}
.tw-footer-legal-link:hover,
.tw-footer-legal-link:focus-visible {
color: #fff;
text-decoration: underline;
text-underline-offset: 3px;
}
.tw-footer-legal-links .tw-footer-legal-link + .tw-footer-legal-link::before {
content: "·";
margin: 0 10px;
color: rgba(255, 255, 255, 0.35);
pointer-events: none;
text-decoration: none;
display: inline-block;
}
/* 无 Banner 的纯正文详情（政策/声明等单页） */
.tw-detail-plain {
padding-top: 48px;
padding-bottom: 80px;
background: linear-gradient(180deg, #f7f8fb 0%, #ffffff 42%);
}
.tw-detail-plain__article {
max-width: 900px;
margin: 0 auto;
}
.tw-detail-plain__title {
margin: 0 0 28px;
font-size: clamp(26px, 3.2vw, 36px);
font-weight: 600;
line-height: 1.25;
color: #1a2285;
letter-spacing: 0.02em;
}
.tw-detail-plain__body {
padding: 40px 44px !important;
background: #fff;
border-radius: 12px;
box-shadow: 0 2px 24px rgba(26, 34, 133, 0.06);
line-height: 1.85;
font-size: 15px;
color: #3d4454;
}
.tw-detail-plain__body h2 {
margin: 32px 0 14px;
font-size: 20px;
font-weight: 600;
color: #1a2285;
}
.tw-detail-plain__body h2:first-child {
margin-top: 0;
}
.tw-detail-plain__body h3 {
margin: 22px 0 10px;
font-size: 16px;
font-weight: 600;
color: #2d3748;
}
.tw-detail-plain__body p {
margin-bottom: 12px;
}
.tw-detail-plain__body ul,
.tw-detail-plain__body ol {
margin: 0 0 14px;
padding-left: 1.35em;
}
.tw-detail-plain__body li {
margin-bottom: 6px;
}
.tw-detail-plain__body img {
max-width: 100%;
height: auto;
border-radius: 8px;
}
@media (max-width: 575.98px) {
.tw-detail-plain {
padding-top: 32px;
padding-bottom: 56px;
}
.tw-detail-plain__body {
padding: 24px 20px !important;
}
}
@media (max-width: 1199.98px) {
.tw-home-hero .swiper-slide {
min-height: 860px;
}
.tw-home-hero .swiper-slide-content {
padding-top: clamp(72px, 10vw, 180px);
}
.tw-home-hero h2.tw-hero-title,
.tw-home-hero .main-slider__content > h2 {
font-size: 56px;
margin-bottom: 12px;
}
.tw-home-hero .tw-hero-kicker {
font-size: 28px;
margin-bottom: clamp(40px, 8vw, 120px);
line-height: 1.2;
}
.tw-home-hero .tw-hero-lead {
font-size: 28px;
margin-bottom: 12px;
}
.tw-home-hero .tw-hero-desc {
font-size: 16px;
margin-bottom: 32px;
}
.tw-home-hero .main-slider__content .more span {
font-size: 20px;
}
.tw-footer-contact {
padding-left: 0;
}
}
@media (max-width: 991.98px) {
header.tw-header-home {
position: fixed !important;
background: rgba(4, 13, 42, 0.92) !important;
}
.tw-home-hero .swiper-slide {
min-height: 640px;
}
.tw-home-hero .swiper-slide-content {
padding-top: 88px;
padding-left: clamp(18px, 4vw, 48px);
}
.tw-home-hero .tw-hero-kicker {
font-size: 18px;
margin-bottom: 36px;
line-height: 1.35;
}
.tw-home-hero h2.tw-hero-title,
.tw-home-hero .main-slider__content > h2 {
font-size: 40px;
margin-bottom: 10px;
line-height: 1.08;
}
.tw-home-hero .tw-hero-lead {
max-width: 100%;
font-size: 20px;
margin-bottom: 10px;
line-height: 1.35;
}
.tw-home-hero .tw-hero-desc {
max-width: 100%;
font-size: 15px;
margin-bottom: 26px;
line-height: 1.55;
}
.tw-home-hero .main-slider__content .more {
min-width: 260px;
min-height: 56px;
padding: 12px 16px 12px 20px;
}
.tw-home-hero .main-slider__content .more span {
font-size: 17px;
}
.tw-network {
padding-top: 64px;
padding-bottom: 56px;
}
.tw-honor--psd {
min-height: 0 !important;
}
.tw-honor--psd .tw-honor-inner {
padding-top: clamp(40px, 6vw, 96px) !important;
}
.tw-honor--psd .tw-honor-heading {
margin-bottom: 40px !important;
}
.tw-honor--psd .tw-honor-content--psd {
padding-bottom: 0 !important;
}
.tw-culture {
padding-top: 56px;
padding-bottom: 56px;
min-height: 0 !important;
}
.tw-network-map {
margin-bottom: 22px;
}
.tw-network-stats {
gap: 24px;
}
.tw-stat-item + .tw-stat-item {
border-left: none;
padding-left: 0;
}
.tw-culture-card {
min-height: 0;
margin-bottom: 0;
}
.tw-culture-cards--psd {
gap: 14px;
}
.tw-honor-text h2 {
font-size: 32px;
}
.tw-honor--psd .tw-honor-lead {
white-space: normal;
font-size: clamp(22px, 5.5vw, 32px);
}
.tw-honor-cert {
margin: 22px 0;
}
.tw-honor-cert-text strong {
font-size: 18px;
}
.tw-honor-cert-text span {
font-size: 16px;
}
.tw-footer-layout {
padding-bottom: 26px;
}
.tw-footer-contact-list {
gap: 18px;
}
}
@media (max-width: 575.98px) {
.tw-home-hero .swiper-slide {
min-height: 520px;
}
.tw-home-hero .swiper-slide-content {
padding-top: 72px;
padding-left: 18px;
padding-right: 18px;
}
.tw-home-hero h2.tw-hero-title,
.tw-home-hero .main-slider__content > h2 {
font-size: 30px;
line-height: 1.12;
margin-bottom: 8px;
}
.tw-home-hero .tw-hero-kicker {
font-size: 14px;
margin-bottom: 28px;
line-height: 1.4;
}
.tw-home-hero .tw-hero-lead {
font-size: 17px;
line-height: 1.35;
margin-bottom: 8px;
}
.tw-home-hero .tw-hero-desc {
font-size: 14px;
line-height: 1.55;
margin-bottom: 22px;
}
.tw-home-hero .main-slider__content .more {
min-width: 220px;
min-height: 52px;
width: 100%;
max-width: 280px;
}
.tw-home-hero .main-slider__content .more span {
font-size: 15px;
}
.tw-network-watermark,
.tw-honor-watermark {
font-size: clamp(56px, 18vw, 88px);
letter-spacing: 0.08em;
}
.tw-network-map {
overflow-x: auto;
padding-bottom: 0;
}
.tw-map-img {
min-width: 720px;
max-width: none;
}
.tw-map-legend-wrap {
position: relative;
left: 0;
bottom: auto;
margin-top: 12px;
pointer-events: auto;
}
.tw-network-legend {
flex-direction: column;
align-items: flex-start;
flex-wrap: nowrap;
gap: 10px 0;
}
.tw-network .tw-stat-number .number {
font-size: 40px;
}
.tw-footer-bottom-inner {
flex-direction: column;
align-items: flex-start;
}
}
.tw-about-hero {
position: relative;
min-height: 360px;
display: flex;
align-items: flex-end;
overflow: hidden;
}
/* 鑽ｈ獕/鏂囧寲 Banner锛歮anifest 鑽ｈ獕/鍥惧眰 2 = 1920脳455锛屾枃鍖?鍥惧眰 2 = 1920脳465锛岀粺涓€涓?1920:460锛涙棤閬僵锛屼粎鐢ㄥ簳鍥?*/
.tw-about-hero.tw-about-hero-honor,
.tw-about-hero.tw-about-hero-culture {
min-height: 0;
aspect-ratio: 1920 / 460;
align-items: center;
/* 涓庨《鏍?shadow 琛旀帴澶勫井鍙狅紝娑堥櫎 bg-light 鍙戜笣缂?*/
margin-top: -3px;
}
.tw-about-hero-honor .container,
.tw-about-hero-culture .container {
position: relative;
z-index: 1;
width: 100%;
}
.tw-about-hero-bg {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
/* 浼佷笟鏂囧寲锛歝over 灞呬腑瑁佸垏鏄撳湪椤堕儴鐣欏嚭鍋忔殫鏉″甫锛涚暐涓嬬Щ鐒︾偣骞跺井鏀惧ぇ锛岄摵婊″鍣紙鑽ｈ獕椤典繚鎸侀粯璁よ鍒囷級 */
.tw-about-hero-culture .tw-about-hero-bg {
object-position: center 30%;
transform: scale(1.025);
transform-origin: center center;
}
.tw-about-hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(8, 21, 61, 0.72) 0%, rgba(8, 21, 61, 0.28) 45%, rgba(8, 21, 61, 0.08) 100%);
}
.tw-about-hero-overlay-warm {
background:
radial-gradient(circle at 36% 42%, rgba(255, 233, 161, 0.42), transparent 20%),
linear-gradient(90deg, rgba(71, 35, 4, 0.34) 0%, rgba(71, 35, 4, 0.12) 100%);
}
.tw-about-hero-inner {
position: relative;
z-index: 1;
padding: 0 0 72px;
color: #fff;
}
.tw-about-hero-inner h1 {
margin: 0;
font-size: 54px;
font-weight: 500;
letter-spacing: 1px;
}
.tw-about-hero-inner p {
margin: 12px 0 0;
font-size: 24px;
color: rgba(255, 255, 255, 0.88);
text-transform: uppercase;
letter-spacing: 2px;
}
/* 鑽ｈ獕璧勮川 + 浼佷笟鏂囧寲锛歮anifest 鏍囬绾?81px銆佸壇鏍囬绾?34.5px锛涘乏鍋忕Щ绾?247/1920 */
.tw-about-hero-honor .tw-about-hero-inner,
.tw-about-hero-culture .tw-about-hero-inner {
padding: 0;
padding-left: clamp(20px, 12.9vw, 248px);
padding-right: 0.75rem;
text-align: left;
}
.tw-about-hero-honor .tw-about-hero-inner h1,
.tw-about-hero-culture .tw-about-hero-inner h1 {
font-size: 81px;
line-height: 1.2;
font-weight: 400;
letter-spacing: 0;
}
.tw-about-hero-honor .tw-about-hero-inner p,
.tw-about-hero-culture .tw-about-hero-inner p {
margin: 28px 0 0;
font-size: 34.5px;
line-height: 1.1;
font-weight: 400;
color: rgba(255, 255, 255, 0.95);
text-transform: uppercase;
letter-spacing: 0.04em;
}
.tw-about-subnav {
background: #f8f2e7;
border-bottom: 1px solid rgba(21, 33, 95, 0.08);
}
.tw-about-subnav ul {
display: flex;
justify-content: center;
align-items: center;
gap: 46px;
margin: 0;
padding: 13px 0 12px;
list-style: none;
}
.tw-about-subnav li a {
position: relative;
display: inline-block;
color: #2c2f77;
font-size: 15px;
font-weight: 500;
padding: 0 4px 8px;
}
.tw-about-subnav li.active a::after {
content: "";
position: absolute;
left: 50%;
bottom: 0;
width: 36px;
height: 2px;
background: #2c2f77;
transform: translateX(-50%);
}
.tw-about-section {
padding: 72px 0 90px;
background: #fff;
}
.tw-about-section.tw-honor-page {
padding-top: 80px;
padding-bottom: 104px;
}
.tw-about-richtext {
margin-top: 56px;
}
.tw-about-richtext img {
max-width: 100%;
height: auto;
}
/* 浼佷笟鏂囧寲锛氬瘜鏂囨湰涓庣粍 6 姝ｆ枃涓€鑷达紙14px / 琛岃窛 27锛夛紝涓庝笂鏂规ā鍧楅棿璺濆榻?*/
.tw-culture-page .tw-about-richtext {
margin-top: 48px;
font-size: 14px;
line-height: 27px;
color: #555;
}
.tw-culture-page .tw-about-richtext p {
margin: 0 0 0.85em;
}
.tw-culture-page .tw-about-richtext p:last-child {
margin-bottom: 0;
}
.tw-culture-layout {
display: flex;
flex-direction: column;
gap: 34px;
}
/* 浼佷笟鏂囧寲璇︽儏妯″潡 鈥?瀵归綈 manifest銆屾枃鍖?缁?6銆嶅崱鐗?604脳400銆佹爣棰?鍓爣棰?姝ｆ枃瀛楀彿涓庤璺?*/
/* manifest锛歋ourceHanSansCN-Bold锛堟爣棰?30/24px銆佽璺?42锛? Regular锛堟鏂?~14px銆佽璺?27锛夛紱瑕嗙洊 style.min 鍏ㄥ眬 Noto锛岀粺涓€涓洪」鐩唴鎬濇簮榛戜綋 */
.tw-culture-page {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
}
.tw-culture-page h1,
.tw-culture-page h2,
.tw-culture-page h3,
.tw-culture-page h4,
.tw-culture-page h5,
.tw-culture-page h6 {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
}
/* 琛屼笌琛屼箣闂存棤绔栧悜鐣欑櫧锛屽浘鏂囧潡涓婁笅璐撮綈锛堜笌 manifest 缁?6 杩炵画鍜悎锛?*/
.tw-culture-page .tw-culture-layout {
gap: 0;
}
/*
* 鍏充簬鎴戜滑-浼佷笟鏂囧寲锛氱埗绾?.tw-culture-layout 瀹氫箟鍞竴鍒楄建 + 瀛愬潡 subgrid銆? * 鍒楀椤诲绉帮紙1fr 1fr锛夛細鑻ョ敤 604px + 1fr锛屽垯宸﹀垪鍥惧浐瀹?604銆佸彸鍒楀浘鍦ㄧ浜岃建浼氭洿瀹斤紝宸﹀彸鍥惧ぇ灏忎笉涓€銆? */
.tw-culture-block {
display: grid;
align-items: center;
gap: 0;
}
/* 首页带 # 锚点进入时，为固定顶栏预留滚动位移 */
.tw-culture-page .tw-culture-block[id] {
scroll-margin-top: 5.5rem;
}
@media (max-width: 991.98px) {
.tw-culture-page .tw-culture-block[id] {
scroll-margin-top: 4.5rem;
}
}
@supports (grid-template-columns: subgrid) {
@media (min-width: 992px) {
.tw-culture-page .tw-culture-layout {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
max-width: 1320px;
margin-left: auto;
margin-right: auto;
width: 100%;
row-gap: 0;
column-gap: 0;
}
.tw-culture-page .tw-culture-layout .tw-culture-block {
display: grid;
grid-template-columns: subgrid;
grid-column: 1 / -1;
max-width: none;
margin: 0;
width: 100%;
}
.tw-culture-page .tw-culture-layout .tw-culture-block:not(.is-reverse) .tw-culture-media {
grid-column: 1;
grid-row: 1;
}
.tw-culture-page .tw-culture-layout .tw-culture-block:not(.is-reverse) .tw-culture-copy {
grid-column: 2;
grid-row: 1;
}
.tw-culture-page .tw-culture-layout .tw-culture-block.is-reverse .tw-culture-media {
grid-column: 2;
grid-row: 1;
}
.tw-culture-page .tw-culture-layout .tw-culture-block.is-reverse .tw-culture-copy {
grid-column: 1;
grid-row: 1;
}
}
}
@supports not (grid-template-columns: subgrid) {
@media (min-width: 992px) {
.tw-culture-block {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: center;
gap: 0;
max-width: 1320px;
margin-left: auto;
margin-right: auto;
}
.tw-culture-block:not(.is-reverse) .tw-culture-media {
grid-column: 1;
grid-row: 1;
}
.tw-culture-block:not(.is-reverse) .tw-culture-copy {
grid-column: 2;
grid-row: 1;
}
.tw-culture-block.is-reverse .tw-culture-media {
grid-column: 2;
grid-row: 1;
}
.tw-culture-block.is-reverse .tw-culture-copy {
grid-column: 1;
grid-row: 1;
}
}
}
/* 椤诲浐瀹氶珮搴︼細浠?min-height 鏃?img 鐨?height:100% 鏃犳硶瑙ｆ瀽锛屽悇鍥炬簮灏哄涓嶅悓浼氬鑷村洓鍧楀浘鍖洪珮搴︿笉涓€鑷达紱manifest 鏂囧寲鍗＄墖 604脳400 */
.tw-culture-media {
height: 400px;
min-height: 400px;
min-width: 0;
width: 100%;
overflow: hidden;
background: #eef3fb;
}
.tw-culture-media img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.tw-culture-copy {
min-width: 0;
padding: 0 10px 0 48px;
color: #1a1f58;
}
/* 鍥惧湪宸︺€佹枃鍦ㄥ彸锛氭枃妗堣窛鍥剧害 20px锛堟枃鍖?缁?6/2 绛夛級 */
.tw-culture-page .tw-culture-block:not(.is-reverse) .tw-culture-copy {
padding: 0 10px 0 20px;
}
/* 鏂囧湪宸︺€佸浘鍦ㄥ彸锛氭枃妗堣窛鍥剧害 48px锛堟枃鍖?缁?6/缁?5/1 绛夛級 */
.tw-culture-page .tw-culture-block.is-reverse .tw-culture-copy {
padding: 0 48px 0 10px;
}
.tw-culture-copy h3 {
margin: 0 0 14px;
font-size: 36px;
font-weight: 700;
color: #1b2375;
}
.tw-culture-copy h4 {
margin: 0 0 18px;
font-size: 22px;
line-height: 1.65;
font-weight: 700;
color: #111;
}
.tw-culture-copy p {
margin: 0;
font-size: 15px;
line-height: 2;
color: #555;
}
/* 浼佷笟鏂囧寲銆岃鏄庛€嶏細鎸夊悗鍙版崲琛?+
鍒嗘锛堝 鈥?寮€澶存瘡琛屼竴鏉★級 */
.tw-culture-copy .tw-culture-desc {
margin: 0;
font-size: 15px;
line-height: 2;
color: #555;
}
/* manifest 缁?6锛氭鍓?娈靛悗 space_before路space_after 鍧囦负 0锛岃闂磋窛鐢?leading 鎵挎媴 */
.tw-culture-page .tw-culture-copy h3 {
margin: 0;
font-size: 30px;
line-height: 42px;
font-weight: 700;
color: #1b2375;
}
.tw-culture-page .tw-culture-copy h4 {
margin: 0;
font-size: 24px;
line-height: 42px;
font-weight: 700;
color: #111;
white-space: pre-wrap;
}
/* 缁忚惀鐞嗗康锛氫笁琛屽壇鏍囬琛岃窛 36px锛坢anifest 缁?6/3锛?*/
.tw-culture-page .tw-culture-block:nth-child(3) .tw-culture-copy h4 {
line-height: 36px;
}
.tw-culture-page .tw-culture-copy p {
margin: 0;
font-size: 14px;
line-height: 27px;
color: #555;
}
/* 涓?manifest Regular 13.95px鈮?4px銆乴eading 27 涓€鑷达紙瑕嗙洊 .tw-culture-copy .tw-culture-desc 鐨?15px / line-height:2锛?*/
.tw-culture-page .tw-culture-copy .tw-culture-desc {
margin: 0;
font-size: 14px;
line-height: 27px;
font-weight: 400;
color: #555;
}
.tw-honor-cert-wrap {
position: relative;
margin: 0 auto 76px;
padding: 0 52px;
}
.honor-cert-swiper {
overflow: hidden;
}
.honor-cert-swiper .swiper-slide {
height: auto;
box-sizing: border-box;
}
.tw-honor-cert-wrap .honor-cert-prev,
.tw-honor-cert-wrap .honor-cert-next {
position: absolute;
top: 42%;
transform: translateY(-50%);
z-index: 3;
width: 44px;
height: 44px;
margin: 0;
padding: 0;
border: 1px solid rgba(27, 35, 117, 0.15);
border-radius: 50%;
background: #fff;
color: #1b2375;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
}
.tw-honor-cert-wrap .honor-cert-prev:hover,
.tw-honor-cert-wrap .honor-cert-next:hover {
background: #1b2375;
color: #fff;
border-color: #1b2375;
}
.tw-honor-cert-wrap .honor-cert-prev {
left: 0;
}
.tw-honor-cert-wrap .honor-cert-next {
right: 0;
}
.tw-honor-cert-wrap .honor-cert-prev i,
.tw-honor-cert-wrap .honor-cert-next i {
font-size: 20px;
line-height: 1;
}
.tw-honor-cert-wrap .honor-cert-prev.swiper-button-disabled,
.tw-honor-cert-wrap .honor-cert-next.swiper-button-disabled {
opacity: 0.3;
cursor: default;
pointer-events: none;
}
/* 绔欑偣淇℃伅瀵屾枃鏈細鍐呭绠＄悊鍥鹃泦 DOC_GALLERY锛堟í婊?+ 鑷姩鎾斁 + 鍒嗛〉鐐癸紱澶栧眰涓庡崟鍥惧鍣ㄩ€忔槑锛?*/
.tw-manufacturing-richtext-content .tw-site-doc-gallery,
.tw-trade-intro .tw-site-doc-gallery,
.tw-project-copy .tw-site-doc-gallery {
position: relative;
margin: 26px auto 6px;
padding: 18px 52px 10px;
max-width: 100%;
border-radius: 18px;
background: transparent;
border: none;
box-shadow: none;
}
.tw-site-doc-gallery__surface {
position: relative;
}
.tw-site-doc-gallery__swiper {
overflow: hidden;
border-radius: 14px;
}
/* 澶氬垪鏃舵媺榻愭瘡鍒楅珮搴︼紝閬垮厤杈冪煯 slide 涓嬫柟鍑虹幇涓€鏉＄┖鐧?*/
.tw-site-doc-gallery__swiper .swiper-wrapper {
align-items: stretch;
}
.tw-site-doc-gallery__swiper .swiper-slide {
display: flex;
flex-direction: column;
box-sizing: border-box;
height: auto;
align-self: stretch;
}
.tw-site-doc-gallery__item {
position: relative;
display: block;
margin: 0;
width: 100%;
flex: 1 0 auto;
min-height: 0;
/* 鍥哄畾鍙姣斾緥锛沜over 浼氭寜姝ゆ瑁佸垏锛屼笌婧愬浘姣斾緥鏃犲叧 */
aspect-ratio: 4 / 3;
overflow: hidden;
background: #dde3ee;
border-radius: 12px;
padding: 0;
border: none;
box-shadow: 0 8px 26px rgba(14, 28, 68, 0.1);
text-align: left;
font-size: 0;
line-height: 0;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.tw-site-doc-gallery__swiper .swiper-slide:hover .tw-site-doc-gallery__item {
transform: translateY(-2px);
box-shadow: 0 12px 32px rgba(14, 28, 68, 0.14);
}
.tw-site-doc-gallery__item img {
position: absolute;
inset: 0;
display: block;
width: 100%;
height: 100%;
margin: 0;
object-fit: cover;
border-radius: 0;
}
.tw-site-doc-gallery--single .tw-site-doc-gallery__swiper .swiper-slide {
width: 100% !important;
}
.tw-site-doc-gallery--single .tw-site-doc-gallery__prev,
.tw-site-doc-gallery--single .tw-site-doc-gallery__next,
.tw-site-doc-gallery--single .tw-site-doc-gallery__pagination {
display: none;
}
/* 鍒嗛〉 */
.tw-site-doc-gallery .tw-site-doc-gallery__pagination {
position: relative;
margin-top: 14px;
padding-bottom: 4px;
}
.tw-site-doc-gallery .tw-site-doc-gallery__pagination.swiper-pagination-horizontal {
bottom: 0;
}
.tw-site-doc-gallery .tw-site-doc-gallery__pagination .swiper-pagination-bullet {
width: 8px;
height: 8px;
margin: 0 5px !important;
background: rgba(24, 49, 109, 0.22);
opacity: 1;
transition: background 0.2s ease, transform 0.2s ease;
}
.tw-site-doc-gallery .tw-site-doc-gallery__pagination .swiper-pagination-bullet-active {
background: rgba(27, 73, 180, 0.95);
transform: scale(1.15);
}
.tw-site-doc-gallery .tw-site-doc-gallery__pagination .swiper-pagination-bullet-active-main {
background: rgba(27, 73, 180, 0.95);
}
.tw-site-doc-gallery .tw-site-doc-gallery__prev,
.tw-site-doc-gallery .tw-site-doc-gallery__next {
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 3;
width: 44px;
height: 44px;
margin: 0;
padding: 0;
border: 1px solid rgba(27, 35, 117, 0.12);
border-radius: 50%;
background: rgba(255, 255, 255, 0.95);
color: #1b2375;
box-shadow: 0 4px 18px rgba(14, 28, 68, 0.12);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}
.tw-site-doc-gallery .tw-site-doc-gallery__prev:hover,
.tw-site-doc-gallery .tw-site-doc-gallery__next:hover {
background: #1b2375;
color: #fff;
border-color: #1b2375;
box-shadow: 0 6px 22px rgba(27, 35, 117, 0.35);
}
.tw-site-doc-gallery .tw-site-doc-gallery__prev {
left: 0;
}
.tw-site-doc-gallery .tw-site-doc-gallery__next {
right: 0;
}
.tw-site-doc-gallery .tw-site-doc-gallery__prev i,
.tw-site-doc-gallery .tw-site-doc-gallery__next i {
font-size: 19px;
line-height: 1;
}
.tw-site-doc-gallery .tw-site-doc-gallery__prev.swiper-button-disabled,
.tw-site-doc-gallery .tw-site-doc-gallery__next.swiper-button-disabled {
opacity: 0.28;
cursor: default;
pointer-events: none;
}
@media (max-width: 767.98px) {
.tw-manufacturing-richtext-content .tw-site-doc-gallery,
.tw-trade-intro .tw-site-doc-gallery,
.tw-project-copy .tw-site-doc-gallery {
padding: 14px 42px 8px;
margin-left: -4px;
margin-right: -4px;
}
}
.tw-honor-cert-card {
text-align: left;
}
.tw-honor-cert-media {
background: #fff;
padding: 22px 18px 12px;
min-height: 196px;
/* 涓庝笅鏂规枃妗堝悓涓€姘村钩璧风偣锛屼究浜庝笌鍥剧墖宸︾紭瀵归綈 */
text-align: left;
}
.tw-honor-cert-media img {
display: block;
max-width: 100%;
max-height: 116px;
width: auto;
height: auto;
object-fit: contain;
}
.tw-honor-cert-meta {
margin-top: 10px;
/* 涓?.tw-honor-cert-media 宸﹀彸 padding 涓€鑷达紝骞翠唤/鎻忚堪涓庡浘鐗囧乏缂樺榻?*/
padding: 0 18px;
width: 100%;
box-sizing: border-box;
}
.tw-honor-cert-meta__year {
margin: 0 0 8px;
font-size: 18px;
font-weight: 500;
line-height: 1.35;
color: #333;
text-align: left;
}
.tw-honor-cert-meta__desc {
margin: 0;
font-size: 14px;
line-height: 1.55;
color: #555;
text-align: left;
}
.tw-honor-timeline {
position: relative;
box-sizing: border-box;
/* 涓?container 鍚屽锛屼笉鍐嶉澶栨敹绐勶紱宸﹀彸鐣欑櫧閫備腑 */
max-width: 80%;
margin-left: auto;
margin-right: auto;
padding: 12px clamp(16px, 3vw, 36px) 16px 64px;
}
.tw-honor-timeline::before {
content: "";
position: absolute;
left: 10px;
top: 4px;
bottom: 4px;
width: 1px;
background: #ee3b3b;
}
.tw-honor-timeline-item {
position: relative;
display: flex;
flex-direction: column;
align-items: stretch;
gap: 10px;
margin-bottom: 26px;
}
.tw-honor-timeline-item::before {
content: "";
position: absolute;
left: -64px;
top: 50%;
width: 10px;
height: 10px;
margin-top: -5px;
border-radius: 50%;
background: #ee3b3b;
box-shadow: 0 0 0 5px #fff;
}
.tw-honor-timeline-year {
font-size: 18px;
font-weight: 500;
color: #4b4b4b;
padding-top: 0;
line-height: 1.35;
text-align: left;
}
.tw-honor-timeline-card {
background: #f5f5f5;
border: 1px solid #eee;
}
.tw-honor-timeline-card--text .tw-honor-timeline-desc {
position: relative;
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 8px;
margin: 0;
padding: 14px 18px;
font-size: 14px;
line-height: 1.75;
color: #555;
text-align: left;
}
.tw-honor-timeline-card--text .tw-honor-timeline-desc::before {
content: "";
flex: 0 0 6px;
width: 6px;
height: 6px;
/* 涓庨琛岃楂樺瀭鐩村眳涓紱涓嶆敮鎸?lh 鏃堕€€鍥炶繎浼煎€?*/
margin-top: 0.58em;
margin-top: calc(0.5lh - 3px);
border-radius: 50%;
background: #ee3b3b;
align-self: flex-start;
}
@media (max-width: 1199.98px) {
.tw-about-hero.tw-about-hero-honor,
.tw-about-hero.tw-about-hero-culture {
aspect-ratio: 1920 / 460;
min-height: 0;
}
.tw-about-hero-inner h1 {
font-size: 44px;
}
.tw-about-hero-honor .tw-about-hero-inner h1,
.tw-about-hero-culture .tw-about-hero-inner h1 {
font-size: 64px;
}
.tw-about-hero-honor .tw-about-hero-inner p,
.tw-about-hero-culture .tw-about-hero-inner p {
font-size: 28px;
margin-top: 22px;
}
.tw-culture-media {
height: 320px;
min-height: 320px;
}
.tw-culture-copy {
padding: 0 28px;
}
.tw-culture-page .tw-culture-block:not(.is-reverse) .tw-culture-copy,
.tw-culture-page .tw-culture-block.is-reverse .tw-culture-copy {
padding: 0 28px;
}
.tw-honor-cert-wrap {
padding: 0 46px;
}
}
@media (max-width: 991.98px) {
.tw-about-hero.tw-about-hero-honor,
.tw-about-hero.tw-about-hero-culture {
aspect-ratio: 1920 / 460;
min-height: 0;
}
.tw-about-hero-inner {
padding-bottom: 48px;
}
.tw-about-hero-honor .tw-about-hero-inner,
.tw-about-hero-culture .tw-about-hero-inner {
padding-bottom: 0;
}
.tw-about-hero-inner h1 {
font-size: 36px;
}
.tw-about-hero-inner p {
font-size: 18px;
}
.tw-about-hero-honor .tw-about-hero-inner h1,
.tw-about-hero-culture .tw-about-hero-inner h1 {
font-size: 52px;
}
.tw-about-hero-honor .tw-about-hero-inner p,
.tw-about-hero-culture .tw-about-hero-inner p {
font-size: 24px;
margin-top: 18px;
}
.tw-about-subnav ul {
gap: 28px;
}
.tw-about-section {
padding: 54px 0 64px;
}
.tw-about-section.tw-honor-page {
padding-top: 60px;
padding-bottom: 72px;
}
.tw-culture-block {
grid-template-columns: 1fr;
}
.tw-culture-block .tw-culture-media,
.tw-culture-block .tw-culture-copy {
grid-column: 1;
grid-row: auto;
}
.tw-culture-copy {
padding: 28px 0 0;
}
.tw-culture-copy h3 {
font-size: 30px;
}
.tw-culture-copy h4 {
font-size: 20px;
}
.tw-culture-page .tw-culture-copy h3 {
font-size: 26px;
line-height: 36px;
}
.tw-culture-page .tw-culture-copy h4 {
font-size: 20px;
line-height: 34px;
}
.tw-culture-page .tw-culture-block:nth-child(3) .tw-culture-copy h4 {
line-height: 30px;
}
.tw-culture-page .tw-culture-copy p {
font-size: 14px;
line-height: 26px;
}
.tw-culture-page .tw-culture-copy .tw-culture-desc {
font-size: 14px;
line-height: 26px;
}
.tw-culture-page .tw-about-richtext {
margin-top: 40px;
font-size: 14px;
line-height: 26px;
}
.tw-honor-timeline {
padding: 10px 20px 14px 44px;
}
.tw-honor-timeline::before {
left: 8px;
}
.tw-honor-timeline-item::before {
left: -44px;
}
}
@media (max-width: 767.98px) {
.tw-about-hero.tw-about-hero-honor,
.tw-about-hero.tw-about-hero-culture {
aspect-ratio: 1920 / 460;
min-height: 0;
}
.tw-about-hero-inner h1 {
font-size: 30px;
}
.tw-about-hero-honor .tw-about-hero-inner,
.tw-about-hero-culture .tw-about-hero-inner {
padding-left: clamp(16px, 5vw, 32px);
}
.tw-about-hero-honor .tw-about-hero-inner h1,
.tw-about-hero-culture .tw-about-hero-inner h1 {
font-size: 40px;
}
.tw-about-hero-honor .tw-about-hero-inner p,
.tw-about-hero-culture .tw-about-hero-inner p {
font-size: 20px;
margin-top: 14px;
}
.tw-about-subnav ul {
gap: 18px;
overflow-x: auto;
justify-content: flex-start;
padding-left: 12px;
padding-right: 12px;
white-space: nowrap;
}
.tw-culture-layout {
gap: 26px;
}
.tw-culture-page .tw-culture-layout {
gap: 0;
}
.tw-culture-media {
height: 220px;
min-height: 220px;
}
.tw-culture-copy h3 {
font-size: 26px;
}
.tw-culture-copy h4 {
font-size: 18px;
}
.tw-culture-page .tw-culture-copy h3 {
font-size: 24px;
line-height: 34px;
}
.tw-culture-page .tw-culture-copy h4 {
font-size: 18px;
line-height: 30px;
}
.tw-culture-page .tw-culture-block:nth-child(3) .tw-culture-copy h4 {
line-height: 28px;
}
.tw-culture-page .tw-culture-copy p {
font-size: 13px;
line-height: 24px;
}
.tw-culture-page .tw-culture-copy .tw-culture-desc {
font-size: 13px;
line-height: 24px;
}
.tw-culture-page .tw-about-richtext {
margin-top: 32px;
font-size: 13px;
line-height: 24px;
}
.tw-honor-cert-wrap {
padding: 0 40px;
margin-bottom: 46px;
}
.tw-honor-timeline-card--text .tw-honor-timeline-desc {
padding: 12px 14px;
}
}
/* 椤堕儴瀵艰埅锛氫簩绾х櫧搴曡摑瀛楋紱涓夌骇鍏ㄥ娴呯伆閫忔槑搴曡摑瀛楋紙sub-menu 鏁翠綋閫忔槑锛岄伩鍏嶄笁绾т粎涓棿涓€鏉°€佷袱渚х暀鐧斤級 */
/* PC锛氬簳妗?fixed 閾烘弧瑙嗗彛锛?-tw-nav-shift 鐢?JS 鎸変竴绾ч」涓績瀵归綈鍐呴儴 .container */
.nav-pc .menu > ul > li .sub-menu {
background: transparent !important;
box-shadow: 0 12px 32px rgba(12, 31, 78, 0.14);
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier2-bar .container,
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-panel > .container {
transform: translateX(var(--tw-nav-shift, 0px));
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier2-bar {
width: 100%;
background: #fff;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-list--level2 {
flex-wrap: wrap;
gap: 0;
row-gap: 0;
background: transparent;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-item {
position: relative;
}
/* 浜岀骇閾炬帴锛氳摑瀛?*/
.nav-pc .menu > ul > li .sub-menu .sub-menu-item > a,
.nav-pc .menu > ul > li .sub-menu .sub-menu-item .sub-menu-item__link {
color: var(--tw-primary, #18316d) !important;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-item > a:hover,
.nav-pc .menu > ul > li .sub-menu .sub-menu-item .sub-menu-item__link:hover {
color: var(--tw-primary, #18316d) !important;
background: rgba(24, 49, 109, 0.06) !important;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-item > a::after,
.nav-pc .menu > ul > li .sub-menu .sub-menu-item .sub-menu-item__link::after {
background: var(--tw-primary, #18316d) !important;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-item--has-child.is-sub-active > .sub-menu-item__link {
color: var(--tw-primary, #18316d) !important;
background: rgba(24, 49, 109, 0.08) !important;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3 {
width: 100%;
margin: 0;
padding: 0;
background: transparent;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-panel {
display: none;
width: 100%;
padding: 0;
box-sizing: border-box;
}
/* 涓夌骇锛氭暣琛岄摵婊¤鍙ｅ锛屽崐閫忔槑鐏板彔鍦ㄤ笅鏂瑰唴瀹逛笂锛堥椤电瓑鍙€忓嚭 banner锛?*/
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-panel.is-active {
display: block;
border-top: 1px solid rgba(12, 31, 78, 0.08);
background: rgba(245, 247, 251, 0.6);
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-panel.is-active > .container {
padding-top: 12px;
padding-bottom: 16px;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-inner {
gap: 6px 10px;
row-gap: 8px;
max-width: 100%;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-link {
display: inline-block;
padding: 8px 16px;
font-size: 13px;
font-weight: 500;
color: var(--tw-primary, #18316d) !important;
border-radius: 4px;
transition: color 0.2s ease, background 0.2s ease;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-link:hover {
color: var(--tw-primary, #18316d) !important;
background: rgba(24, 49, 109, 0.08) !important;
}
@media (max-width: 943px) {
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier2-bar .container,
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-panel > .container {
transform: none !important;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier2-bar {
background: #f8f8f8 !important;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-panel.is-active {
border-top: 1px solid rgba(12, 31, 78, 0.08);
background: rgba(245, 247, 251, 0.6);
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-panel.is-active > .container {
padding: 8px 12px 12px;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-link {
display: block;
padding: 8px 0;
font-size: 14px;
font-weight: 500;
color: var(--tw-primary, #18316d) !important;
border-radius: 0;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-tier3-link:hover {
color: var(--tw-primary, #18316d) !important;
background: rgba(24, 49, 109, 0.06) !important;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-item--has-child.is-sub-active > .sub-menu-item__link {
color: var(--tw-primary, #18316d) !important;
background: rgba(24, 49, 109, 0.06) !important;
font-weight: 600;
}
.nav-pc .menu > ul > li .sub-menu .sub-menu-item > a,
.nav-pc .menu > ul > li .sub-menu .sub-menu-item .sub-menu-item__link {
color: var(--tw-primary, #18316d) !important;
}
}
.tw-manufacturing-page {
background:
linear-gradient(120deg, rgba(20, 39, 85, 0.03) 0%, rgba(20, 39, 85, 0) 26%),
linear-gradient(300deg, rgba(20, 39, 85, 0.06) 0%, rgba(20, 39, 85, 0) 28%),
#f5f7fb;
/* 椤舵爮涓?Banner 椤跺榻愶細鍕垮姞 padding-top锛堝師 12px 浼氬湪瀵艰埅涓嬪舰鎴愭祬鐏版潯锛?*/
padding: 0 0 88px;
}
.tw-manufacturing-page > .container:first-child {
position: relative;
z-index: 5;
display: flex;
justify-content: center;
margin-bottom: 12px;
}
.tw-company-tabs {
position: relative;
display: flex;
align-items: center;
justify-content: center;
gap: 42px;
padding: 0;
background: transparent;
box-shadow: none;
transform: none;
}
.tw-company-tab {
position: relative;
-webkit-appearance: none;
appearance: none;
border: 0;
min-width: 0;
padding: 10px 0 12px;
background: transparent;
border-radius: 0;
font-size: 14px;
font-weight: 500;
line-height: 1.4;
font-family: inherit;
color: #5b6575;
cursor: pointer;
white-space: nowrap;
transition: color 0.2s ease;
}
.tw-company-tab::after {
content: "";
position: absolute;
left: 50%;
bottom: 0;
width: 0;
height: 3px;
margin-left: 0;
background: var(--tw-primary, #18316d);
border-radius: 999px;
transform: translateX(-50%);
transition: width 0.2s ease;
}
.tw-company-tab.is-active {
background: transparent;
color: var(--tw-primary, #18316d);
box-shadow: none;
}
.tw-company-tab.is-active::after {
width: 34px;
}
.tw-company-tab:hover {
color: var(--tw-primary, #18316d);
}
/* 鍏徃鍒囨崲 Tab锛氫粎闅愯棌瑙嗚锛涗繚鐣?DOM 涓庤剼鏈紝hash锛?mfg-youhe銆?trade-dg 绛夛級涓庡鑸粛鍙垏鎹?*/
.tw-manufacturing-page > .container:first-child:has(.tw-company-tabs),
.tw-trade-page > .container:first-child:has(.tw-company-tabs) {
display: none !important;
}
.tw-manufacturing-panel {
display: none;
margin-top: 0;
}
.tw-manufacturing-panel.is-active {
display: block;
}
/* Banner锛?920脳818锛涢珮搴︽寜銆屾湰鍖哄潡瀹藉害銆嶇瓑姣旓紙padding % 鐩稿鍖呭惈鍧楀搴︼級锛屽嬁鐢?100vw 浠ュ厤涓庡尯鍧楀疄闄呭搴︿笉涓€鑷村鑷?cover 鏃犳硶閾烘弧 */
.tw-manufacturing-hero {
position: relative;
overflow: hidden;
width: 100%;
height: 0;
box-sizing: content-box;
padding-bottom: min(818px, max(440px, calc(100% * 818 / 1920)));
/* 鏁村鐭╁舰椤跺浘锛氫笉璁惧渾瑙掞紙鍦嗚鏃跺洓瑙掍細闇插嚭椤甸潰鐏板簳锛?*/
border-radius: 0;
box-shadow: 0 30px 70px rgba(14, 28, 68, 0.18);
}
/* 涓庣櫧鍗?margin-top 鍚屽€硷細鏂囨鍖鸿创鍦?Banner 鍐呬笌鐧藉崱椤剁浉鎺ュ锛堝簳瀵归綈鍒板彔鍏ョ嚎锛?*/
.tw-manufacturing-hero > .container {
position: absolute;
inset: 0;
z-index: 2;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-end;
padding-top: 0;
padding-bottom: 340px;
box-sizing: border-box;
pointer-events: none;
}
.tw-manufacturing-hero .tw-product-service-banner-inner {
pointer-events: auto;
}
/* padding-bottom 鎾戦珮锛氬嬁鐢?height:100%锛堟槗鎸夊唴瀹归珮 0 绠楋級銆傛í鍚戦』鏄惧紡鎷夋弧锛歸idth:auto 鏃堕儴鍒嗘祻瑙堝櫒鎸夊浘鐗囧浐鏈夊搴︾敾锛屽灞忎細鍙充晶鐣欑櫧 */
.tw-manufacturing-hero > img,
.tw-manufacturing-hero > .tw-project-hero-fallback {
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 100%;
min-width: 100%;
height: auto;
display: block;
max-width: none;
}
.tw-manufacturing-hero > img {
object-fit: cover;
object-position: center center;
}
.tw-manufacturing-hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(8, 17, 42, 0.68) 0%, rgba(8, 17, 42, 0.3) 46%, rgba(8, 17, 42, 0.1) 100%);
}
/* 浜у搧鏈嶅姟 Banner锛氫笌 HYS 鐧藉崱鍚屽垪瀹斤紙max-width 1600 灞呬腑锛夛紝閬垮厤澶у睆 .container 88% 鏃朵笌姝ｆ枃閿欎綅 */
/* 鏂囨绾靛悜浣嶇疆鐢?.tw-manufacturing-hero > .container 鐨?padding-bottom锛? 鐧藉崱鍙犲叆閲忥級鎺у埗 */
.tw-product-service-banner-inner {
width: 100%;
max-width: 1600px;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
display: flex;
justify-content: flex-end;
align-items: flex-start;
min-height: 0;
}
.tw-product-service-banner-inner--mfg {
padding-left: 68px;
padding-right: 68px;
}
.tw-product-service-banner-inner--trade {
padding-left: 60px;
padding-right: 60px;
}
.tw-manufacturing-hero-copy {
position: relative;
z-index: 1;
min-height: 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-end;
max-width: 720px;
padding: 0;
margin: 0;
color: #fff;
text-align: right;
}
.tw-manufacturing-hero-copy h1:first-child {
margin-top: 0;
}
.tw-manufacturing-hero-copy span {
display: inline-flex;
width: fit-content;
padding: 7px 16px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.14);
font-size: 12px;
letter-spacing: 0.2em;
text-transform: uppercase;
}
.tw-manufacturing-hero-copy h1 {
display: inline-block;
width: fit-content;
max-width: 100%;
margin: 18px 0 14px;
padding: 14px 22px;
font-size: 42px;
line-height: 1.15;
font-weight: 700;
letter-spacing: 0.01em;
color: #f8fafc;
text-shadow:
0 0 1px rgba(0, 0, 0, 0.9),
0 1px 3px rgba(0, 0, 0, 0.78),
0 4px 22px rgba(0, 0, 0, 0.38);
text-align: right;
vertical-align: top;
background: linear-gradient(145deg, rgba(23, 49, 109, 0.1) 0%, rgba(12, 26, 58, 0.085) 100%);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 14px;
box-shadow: 0 1px 4px rgba(8, 15, 40, 0.08);
-webkit-backdrop-filter: blur(10px) saturate(1.15);
backdrop-filter: blur(10px) saturate(1.15);
}
.tw-manufacturing-hero-copy .tw-hero-title-logo,
.tw-trade-hero-copy .tw-hero-title-logo {
display: block;
max-width: min(100%, 240px);
max-height: 56px;
width: auto;
height: auto;
margin: 18px 0 0 auto;
object-fit: contain;
}
.tw-manufacturing-hero-copy .tw-hero-title-logo + p,
.tw-trade-hero-copy .tw-hero-title-logo + p {
margin-top: 12px;
margin-left: auto;
max-width: none;
white-space: nowrap;
}
.tw-manufacturing-hero-copy p {
display: inline-block;
width: fit-content;
max-width: 100%;
margin: 0;
padding: 12px 20px;
font-size: 22px;
line-height: 1.55;
font-weight: 600;
letter-spacing: 0.02em;
color: #f8fafc;
text-shadow:
0 0 1px rgba(0, 0, 0, 0.88),
0 1px 3px rgba(0, 0, 0, 0.74),
0 3px 18px rgba(0, 0, 0, 0.36);
text-align: right;
vertical-align: top;
background: linear-gradient(145deg, rgba(23, 49, 109, 0.1) 0%, rgba(12, 26, 58, 0.085) 100%);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 14px;
box-shadow: 0 1px 4px rgba(8, 15, 40, 0.08);
-webkit-backdrop-filter: blur(10px) saturate(1.15);
backdrop-filter: blur(10px) saturate(1.15);
}
.tw-manufacturing-card {
position: relative;
width: 100%;
max-width: 1600px;
margin: -340px auto 0;
padding: 54px 68px 58px;
background: #ffffff;
border-radius: 26px;
box-shadow: 0 34px 80px rgba(20, 39, 85, 0.1);
}
/*
* 浜у搧鏈嶅姟瀵屾枃鏈細浠呮鏂囪壊鏀逛负 rgb(126,126,126)锛堝惈鍔犵矖/閾炬帴锛夛紱瀛楀彿琛岄珮缁存寔 manifest 鍘熷€笺€? */
.tw-manufacturing-richtext-content {
color: rgb(126, 126, 126);
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", "Microsoft YaHei", sans-serif;
font-size: 18px;
font-weight: 400;
line-height: 32px;
}
.tw-manufacturing-richtext-content > *:last-child {
margin-bottom: 0;
}
.tw-manufacturing-richtext-content h2 {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
font-size: 30px;
font-weight: 700;
line-height: 42px;
color: #17316d;
margin: 0 0 14px;
}
.tw-manufacturing-richtext-content h2::before {
content: "|";
color: #17316d;
font-size: inherit;
font-weight: inherit;
font-family: inherit;
margin-right: 0.35em;
}
.tw-manufacturing-richtext-content h3 {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
font-size: 24px;
font-weight: 700;
line-height: 42px;
color: #000000;
margin: 24px 0 12px;
}
.tw-manufacturing-richtext-content h2 + h3 {
margin-top: 0;
}
.tw-manufacturing-richtext-content h2:first-child,
.tw-manufacturing-richtext-content h3:first-child {
margin-top: 0;
}
.tw-manufacturing-richtext-content h4 {
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", sans-serif;
font-size: 18px;
font-weight: 700;
line-height: 32px;
color: #000000;
margin: 0 0 8px;
}
.tw-manufacturing-richtext-content p {
margin: 0 0 1em;
font-size: 18px;
font-weight: 400;
line-height: 32px;
color: rgb(126, 126, 126);
}
.tw-manufacturing-richtext-content ul,
.tw-manufacturing-richtext-content ol {
margin: 0 0 1em 1.25em;
padding: 0;
font-size: 18px;
line-height: 32px;
color: rgb(126, 126, 126);
}
.tw-manufacturing-richtext-content li {
margin-bottom: 0.5em;
color: rgb(126, 126, 126);
}
.tw-manufacturing-richtext-content li:last-child {
margin-bottom: 0;
}
.tw-manufacturing-richtext-content strong,
.tw-manufacturing-richtext-content b {
font-weight: 700;
color: rgb(126, 126, 126);
}
.tw-manufacturing-richtext-content em {
color: rgb(126, 126, 126);
}
.tw-manufacturing-richtext-content a {
color: rgb(126, 126, 126);
text-decoration: underline;
text-underline-offset: 2px;
}
.tw-manufacturing-richtext-content a:hover {
color: rgb(100, 100, 100);
}
.tw-manufacturing-richtext-content td {
color: rgb(126, 126, 126);
}
@media (max-width: 767.98px) {
.tw-manufacturing-richtext-content {
font-size: 16px;
line-height: 28px;
}
.tw-manufacturing-richtext-content h2 {
font-size: 26px;
line-height: 36px;
}
.tw-manufacturing-richtext-content h3 {
font-size: 20px;
line-height: 34px;
}
.tw-manufacturing-richtext-content h4,
.tw-manufacturing-richtext-content p,
.tw-manufacturing-richtext-content ul,
.tw-manufacturing-richtext-content ol {
font-size: 16px;
line-height: 28px;
}
.tw-manufacturing-richtext-content th {
font-size: 15px;
}
}
/* 浜у搧鏈嶅姟瀵屾枃鏈唴鍥剧墖缁熶竴鍦嗚锛堜笌鍙充晶澶у浘鍖?manifest 椋庢牸涓€鑷达級 */
.tw-manufacturing-richtext-content img {
display: inline-block;
max-width: 100%;
height: auto;
vertical-align: top;
border-radius: 16px;
}
.tw-manufacturing-richtext-content figure img {
display: block;
width: 100%;
height: auto;
}
/* 富文本内本地上传视频：自适应宽度；背景避免加载前白块 */
.tw-manufacturing-richtext-content video,
.tw-richtext-video {
display: block;
max-width: 100%;
width: 100%;
height: auto;
aspect-ratio: var(--tw-video-ar, 16 / 9);
border-radius: 16px;
vertical-align: top;
background: #111;
}
/*
* 同一行多张图：flex 排版；具体行高由 styles.js 按「当前列宽下等比缩放后的高度」取 max/min 动态写入（非固定 px）。
* 可选 data-tw-img-row="max"|"min"（默认 max），写在同一 或
上。
*/
.tw-manufacturing-richtext-content p:has(> img + img) {
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: stretch;
}
.tw-manufacturing-richtext-content p:has(> img + img) > img {
flex: 1 1 200px;
min-width: 0;
width: auto;
max-width: 100%;
object-fit: cover;
object-position: center;
vertical-align: middle;
}
.tw-manufacturing-richtext-content p:has(> figure + figure) {
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: stretch;
}
.tw-manufacturing-richtext-content p:has(> figure + figure) > figure {
flex: 1 1 200px;
min-width: 0;
margin: 0;
max-width: 100%;
}
.tw-manufacturing-richtext-content p:has(> figure + figure) > figure > img {
width: 100%;
max-width: none;
object-fit: cover;
object-position: center;
}
/* 琛ㄦ牸涓€琛屽鏍笺€佹瘡鏍间粎涓€鍥撅細琛岄珮鐢辫剼鏈笌涓婃枃涓€鑷?*/
.tw-manufacturing-richtext-content td > img:only-child,
.tw-manufacturing-richtext-content th > img:only-child {
display: block;
width: 100%;
object-fit: cover;
object-position: center;
}
/* 瀵屾枃鏈叏灞€ img{height:auto} 鍐欏湪鍚庨潰锛屼細鐩栨帀 DOC_GALLERY 杞挱鐨?cover 濉厖锛岄』鍗曠嫭瑕嗙洊 */
.tw-manufacturing-richtext-content .tw-site-doc-gallery figure.tw-site-doc-gallery__item {
margin: 0;
}
.tw-manufacturing-richtext-content .tw-site-doc-gallery__item img {
position: absolute;
inset: 0;
display: block;
width: 100%;
height: 100%;
max-width: none;
object-fit: cover;
border-radius: 12px;
box-shadow: none;
}
/* 瀵屾枃鏈唴缂栬緫鍣ㄨ〃鏍硷細浠呭垪瀹戒笌鍗曞厓鏍煎榻愶紝涓嶈鐩栧瓧浣撲笌棰滆壊 */
.tw-manufacturing-richtext-content table {
width: 100%;
max-width: 100%;
border-collapse: collapse;
}
.tw-manufacturing-richtext-content td,
.tw-manufacturing-richtext-content th {
vertical-align: top;
padding: 4px 6px;
}
.tw-manufacturing-richtext-content th {
font-size: 17px;
font-weight: 600;
line-height: 1.45;
color: rgb(126, 126, 126);
}
/* ========== 璁惧閰嶇疆琛ㄦ牸锛堟寜鍙傝€冨浘杩樺師锛氭繁钃濊〃澶?+ 鐧界伆鏂戦┈绾癸級 ========== */
.tw-equipment-spec {
margin: 30px 0 34px;
}
.tw-equipment-spec__title {
display: flex;
align-items: center;
gap: 12px;
margin: 0 0 18px;
font-size: 21px;
font-weight: 700;
color: #24365e;
letter-spacing: 0;
}
.tw-equipment-spec__title::before {
content: "";
width: 14px;
height: 14px;
border-radius: 50%;
background: radial-gradient(circle at 35% 35%, #2749ba 0%, #17358b 58%, #0b2466 100%);
box-shadow: 0 0 0 4px rgba(23, 53, 139, 0.08);
flex-shrink: 0;
}
.tw-equipment-spec--with-bg {
position: relative;
margin-left: -12px;
margin-right: -12px;
padding: 28px 24px 32px;
border-radius: 18px;
overflow: hidden;
isolation: isolate;
}
.tw-equipment-spec--with-bg::before {
content: "";
position: absolute;
inset: 0;
z-index: 0;
background: linear-gradient(
125deg,
rgba(4, 16, 48, 0.92) 0%,
rgba(6, 36, 82, 0.85) 45%,
rgba(4, 22, 58, 0.94) 100%
),
url("/assets/addons/ldcms/tomowa/images/origin.jpg") center / cover no-repeat;
pointer-events: none;
}
.tw-equipment-spec--with-bg > * {
position: relative;
z-index: 1;
}
.tw-equipment-spec--with-bg .tw-equipment-spec__title {
color: #fff;
text-shadow: 0 0 28px rgba(0, 200, 255, 0.35);
}
.tw-equipment-table-card {
margin-bottom: 20px;
border-radius: 16px;
overflow: hidden;
background: #ffffff;
box-shadow: 0 10px 26px rgba(39, 58, 102, 0.08);
}
.tw-equipment-table-card:last-child {
margin-bottom: 0;
}
.tw-equipment-spec__scroll {
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
border-radius: 16px;
}
.tw-equipment-table {
width: 100%;
min-width: 520px;
border-collapse: separate;
border-spacing: 0;
table-layout: fixed;
font-size: 14px;
line-height: 1.55;
color: #4b5568;
}
/* 琛ㄥご鏁磋锛氱洿鎺ヤ娇鐢ㄨ儗鏅浘锛屼笉鍙犲姞绾壊 */
.tw-equipment-table thead,
.tw-equipment-table thead tr {
background-color: #1a2285;
background-image: url("/assets/addons/ldcms/tomowa/images/origin.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
.tw-equipment-table thead th {
position: relative;
padding: 12px 16px 18px;
font-size: 17px;
line-height: 1.45;
font-weight: 700;
color: #fff;
text-align: center;
vertical-align: middle;
background: transparent;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
/* 琛ㄥご搴曡竟锛氬悜涓嬪嚫鍑虹殑钃濊壊灏忎笁瑙?*/
.tw-equipment-table thead th::after {
content: "";
position: absolute;
left: 50%;
bottom: -3px;
width: 0;
height: 0;
margin-left: -6px;
border-style: solid;
border-width: 7px 6px 0 6px;
border-color: rgba(26, 34, 133, 0.7) transparent transparent transparent;
z-index: 2;
pointer-events: none;
}
.tw-equipment-table thead th:first-child {
border-top-left-radius: 16px;
}
.tw-equipment-table thead th:last-child {
border-top-right-radius: 16px;
}
.tw-equipment-table tbody td {
padding: 14px 18px;
vertical-align: middle;
border-bottom: 1px solid #edf0f4;
word-break: break-word;
background: #ffffff;
}
.tw-equipment-table tbody tr:last-child td {
border-bottom: none;
}
/* 鏂戦┈绾癸細鎸夊弬鑰冨浘涓烘祬鐏?/ 鐧借壊浜ゆ浛 */
.tw-equipment-table tbody tr:nth-child(odd) td {
background: #ffffff;
}
.tw-equipment-table tbody tr:nth-child(even) td {
background: #f3f3f3;
}
.tw-equipment-table tbody tr:last-child td:first-child {
border-bottom-left-radius: 16px;
}
.tw-equipment-table tbody tr:last-child td:last-child {
border-bottom-right-radius: 16px;
}
/* 5 鍒楋細璁惧绫诲瀷 / 鍝佺墝 / 浜у湴 / 鏁伴噺 / 鍏抽敭鍙傛暟 */
.tw-equipment-table--cols-5 th:nth-child(1),
.tw-equipment-table--cols-5 td:nth-child(1) {
width: 26%;
}
.tw-equipment-table--cols-5 th:nth-child(2),
.tw-equipment-table--cols-5 td:nth-child(2),
.tw-equipment-table--cols-5 th:nth-child(3),
.tw-equipment-table--cols-5 td:nth-child(3) {
width: 16%;
}
.tw-equipment-table--cols-5 th:nth-child(4),
.tw-equipment-table--cols-5 td:nth-child(4) {
width: 12%;
}
.tw-equipment-table--cols-5 th:nth-child(5),
.tw-equipment-table--cols-5 td:nth-child(5) {
width: 30%;
}
.tw-equipment-table--main-equipment th:nth-child(1),
.tw-equipment-table--main-equipment td:nth-child(1) {
width: 16%;
}
.tw-equipment-table--cols-3 th:nth-child(1),
.tw-equipment-table--cols-3 td:nth-child(1) {
width: 22%;
}
.tw-equipment-table--cols-3 th:nth-child(2),
.tw-equipment-table--cols-3 td:nth-child(2) {
width: 38%;
}
.tw-equipment-table--cols-3 th:nth-child(3),
.tw-equipment-table--cols-3 td:nth-child(3) {
width: 40%;
}
.tw-equipment-table--cols-4 th:nth-child(1),
.tw-equipment-table--cols-4 td:nth-child(1) {
width: 10%;
}
.tw-equipment-table--cols-4 th:nth-child(2),
.tw-equipment-table--cols-4 td:nth-child(2) {
width: 34%;
}
.tw-equipment-table--cols-4 th:nth-child(3),
.tw-equipment-table--cols-4 td:nth-child(3) {
width: 34%;
}
.tw-equipment-table--cols-4 th:nth-child(4),
.tw-equipment-table--cols-4 td:nth-child(4) {
width: 22%;
}
.tw-equipment-table--cols-2 th:nth-child(1),
.tw-equipment-table--cols-2 td:nth-child(1) {
width: 24%;
}
.tw-equipment-table--cols-2 {
min-width: 360px;
}
.tw-equipment-table--serial th,
.tw-equipment-table--serial td {
text-align: center;
}
.tw-equipment-table--serial.tw-equipment-table--cols-5 th:nth-child(1),
.tw-equipment-table--serial.tw-equipment-table--cols-5 td:nth-child(1) {
width: 10%;
}
.tw-equipment-table--serial.tw-equipment-table--cols-5 th:nth-child(2),
.tw-equipment-table--serial.tw-equipment-table--cols-5 td:nth-child(2) {
width: 28%;
}
.tw-equipment-table--serial.tw-equipment-table--cols-5 th:nth-child(3),
.tw-equipment-table--serial.tw-equipment-table--cols-5 td:nth-child(3),
.tw-equipment-table--serial.tw-equipment-table--cols-5 th:nth-child(4),
.tw-equipment-table--serial.tw-equipment-table--cols-5 td:nth-child(4),
.tw-equipment-table--serial.tw-equipment-table--cols-5 th:nth-child(5),
.tw-equipment-table--serial.tw-equipment-table--cols-5 td:nth-child(5) {
width: 20.5%;
}
/* 鐗规畩鏍峰紡琛ㄦ牸锛氶粯璁ゅ眳涓紱鑻ユ煇鍒楀唴瀹硅繃闀匡紝鐢?JS 涓烘暣鍒楀姞 .tw-equipment-table__cell--left 鍒囦负灞呭乏 */
.tw-equipment-table.tw-equipment-table--auto-balance thead th,
.tw-equipment-table.tw-equipment-table--auto-balance tbody td {
text-align: center;
vertical-align: middle;
white-space: normal;
overflow-wrap: anywhere;
word-break: break-word;
}
.tw-equipment-table.tw-equipment-table--auto-balance tbody td.tw-equipment-table__cell--left {
text-align: left;
}
@media (max-width: 767.98px) {
.tw-equipment-spec--with-bg {
margin-left: 0;
margin-right: 0;
padding: 22px 14px 26px;
}
.tw-equipment-table {
font-size: 13px;
}
.tw-equipment-table thead th {
font-size: 15px;
}
.tw-equipment-table thead th,
.tw-equipment-table tbody td {
padding: 10px 12px;
}
.tw-equipment-spec__title {
font-size: 18px;
}
}
.tw-manufacturing-stat-list {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 36px;
margin: 42px 0 54px !important;
padding: 0 !important;
list-style: none;
}
.tw-manufacturing-stat-list li {
position: relative;
margin: 0;
padding: 0 36px;
text-align: center;
}
.tw-manufacturing-stat-list li:not(:first-child)::before {
content: "";
position: absolute;
left: 0;
top: 8px;
width: 2px;
height: 88px;
background: #1f3b86;
}
.tw-manufacturing-stat-list strong {
display: block;
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: 50px;
line-height: 1;
font-weight: 700;
color: #1f3b86;
letter-spacing: 0;
}
.tw-manufacturing-stat-list span {
display: block;
margin-top: 12px;
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: 24px;
line-height: 1.75;
font-weight: 400;
color: #2d3c56;
}
.tw-manufacturing-section {
padding: 0 0 42px;
margin-bottom: 42px;
border-bottom: 1px solid rgba(24, 49, 109, 0.12);
}
.tw-manufacturing-section:last-child {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: 0;
}
/* 鏃堕棿杞村尯鍧楋細涓嶈榛樿搴曢儴鍒嗗壊绾匡紙鍘?.tw-manufacturing-section 鐨?border-bottom锛?*/
.tw-manufacturing-section.tw-manufacturing-history {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
.tw-manufacturing-heading {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 18px;
}
.tw-manufacturing-heading span {
width: 3px;
height: 22px;
border-radius: 999px;
background: #1b49b4;
}
.tw-manufacturing-heading h2 {
margin: 0;
font-size: 24px;
font-weight: 600;
color: #17316d;
}
.tw-manufacturing-intro > p {
margin: 0;
font-size: 15px;
line-height: 2;
color: #556072;
}
.tw-manufacturing-stats {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
}
.tw-manufacturing-stat {
position: relative;
padding: 0 18px;
}
.tw-manufacturing-stat:not(:first-child)::before {
content: "";
position: absolute;
left: 0;
top: 10px;
width: 1px;
height: 52px;
background: rgba(24, 49, 109, 0.18);
}
.tw-manufacturing-stat strong {
display: block;
font-size: 34px;
line-height: 1;
font-weight: 700;
color: #1f3b86;
}
.tw-manufacturing-stat strong small {
font-size: 20px;
font-weight: 600;
}
.tw-manufacturing-stat span {
display: block;
margin-top: 10px;
font-size: 13px;
color: #6b7482;
}
.tw-manufacturing-history-grid {
display: grid;
grid-template-columns: 120px minmax(0, 1fr);
gap: 26px 112px;
align-items: start;
justify-content: start;
max-width: 100%;
margin: 0;
}
/* 鍙戝睍鍘嗙▼锛氬乏渚у勾浠芥渶澶氬彲瑙?7 鏉★紝涓婁笅绠ご婊氬姩锛堢敱 styles.js 娴嬮噺瑙嗗彛楂樺害锛?*/
/* 绠ご锛氬湪鏁村垪锛堢珫绾?+ 骞翠唤鏂囧瓧锛夊搴﹀唴姘村钩灞呬腑锛屼笉鍗曞榻愯酱绾?*/
.tw-manufacturing-history-nav-wrap {
display: flex;
flex-direction: column;
align-items: center;
gap: 0;
min-width: 0;
width: 100%;
}
.tw-manufacturing-history-nav-viewport {
align-self: stretch;
width: 100%;
min-height: 0;
min-width: 0;
overflow-y: auto;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
-ms-overflow-style: none;
}
.tw-manufacturing-history-nav-viewport::-webkit-scrollbar {
display: none;
}
.tw-manufacturing-history-nav-arrow {
flex-shrink: 0;
width: 40px;
height: 32px;
margin: 0;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
color: #2450b2;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
font-weight: 400;
line-height: 1;
transition: color 0.2s ease, opacity 0.2s ease;
}
.tw-manufacturing-history-nav-arrow .fa {
display: block;
line-height: 1;
}
.tw-manufacturing-history-nav-arrow--up {
margin-bottom: 6px;
}
.tw-manufacturing-history-nav-arrow--down {
margin-top: 6px;
}
.tw-manufacturing-history-nav-arrow:hover:not(:disabled) {
color: #1a3d8a;
}
.tw-manufacturing-history-nav-arrow:disabled {
opacity: 0.45;
cursor: not-allowed;
}
/* 绔栫嚎 left:7px銆佸 1px 鈫?杞寸嚎 7.5px锛涘渾鐐?7px 瀹?鈫?鍦嗗績瀵归綈杞寸嚎锛歭eft = 7.5px - 24px(nav 宸﹀唴杈硅窛) - 3.5px */
.tw-manufacturing-history-nav {
position: relative;
display: flex;
flex-direction: column;
gap: 45px;
margin: 0;
--tw-history-nav-pl: 24px;
padding: 8px 0 8px var(--tw-history-nav-pl);
}
.tw-manufacturing-history-nav::before {
content: "";
position: absolute;
left: 7px;
top: 12px;
bottom: 12px;
width: 1px;
background: rgba(24, 49, 109, 0.22);
}
.tw-manufacturing-history-year {
position: relative;
border: 0;
background: transparent;
padding: 0 0 0 18px;
text-align: left;
font-size: 30px;
line-height: 42px;
font-weight: 700;
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
color: #6b7482;
cursor: pointer;
transition: color 0.2s ease;
display: flex;
align-items: center;
min-height: 42px;
}
.tw-manufacturing-history-year::before {
content: "";
position: absolute;
left: calc(7.5px - var(--tw-history-nav-pl) - 3.5px);
top: 50%;
transform: translateY(-50%);
width: 7px;
height: 7px;
border-radius: 50%;
background: #cfd5e2;
box-shadow: 0 0 0 4px #fff;
}
.tw-manufacturing-history-year.is-active::before {
background: #2450b2;
}
.tw-manufacturing-history-year.is-active,
.tw-manufacturing-history-year:hover {
color: #2450b2;
}
.tw-manufacturing-history-stage {
position: relative;
min-height: 100%;
width: 100%;
max-width: none;
padding-left: 48px;
}
.tw-manufacturing-history-panel {
display: none;
}
.tw-manufacturing-history-panel.is-active {
display: block;
}
.tw-manufacturing-history-media {
margin: 0 0 12px;
}
.tw-manufacturing-history-media img,
.tw-manufacturing-media img {
display: block;
width: 100%;
max-width: 760px;
height: auto;
border-radius: 16px;
box-shadow: 0 18px 42px rgba(24, 49, 109, 0.12);
}
.tw-manufacturing-history-copy p {
margin: 0;
font-size: 18px;
line-height: 40px;
font-weight: 700;
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
color: rgb(126, 126, 126);
/* 涓庣珯鐐逛俊鎭噷銆岃鏄庛€嶄腑鐨勬崲琛屼竴鑷达細鍥炶溅 / \n 鍧囨崲琛屾樉绀?*/
white-space: pre-line;
overflow-wrap: anywhere;
word-break: break-word;
}
.tw-manufacturing-split {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 500px);
gap: 36px;
align-items: start;
}
.tw-manufacturing-split.is-reverse {
grid-template-columns: minmax(0, 500px) minmax(0, 1fr);
}
.tw-manufacturing-split.is-text-only {
grid-template-columns: 1fr;
}
.tw-manufacturing-copy {
min-width: 0;
}
.tw-manufacturing-richtext {
color: rgb(126, 126, 126);
}
.tw-manufacturing-richtext p {
margin: 0 0 14px;
font-size: 15px;
line-height: 2;
color: rgb(126, 126, 126);
}
.tw-manufacturing-richtext p:last-child {
margin-bottom: 0;
}
.tw-manufacturing-richtext strong,
.tw-manufacturing-richtext b {
color: rgb(126, 126, 126);
font-weight: 600;
}
.tw-manufacturing-media {
margin: 0;
}
.tw-manufacturing-contact .tw-manufacturing-richtext p {
margin-bottom: 10px;
}
.page-content-card .card-body.is-hidden {
display: none;
}
@media (max-width: 1199.98px) {
.tw-manufacturing-page > .container:first-child {
margin-bottom: 10px;
}
.tw-manufacturing-card {
margin-top: -297px;
padding: 46px 38px 48px;
}
.tw-product-service-banner-inner--mfg {
padding-left: 38px;
padding-right: 38px;
}
.tw-manufacturing-hero-copy h1 {
font-size: 36px;
}
.tw-manufacturing-history-grid,
.tw-manufacturing-split,
.tw-manufacturing-split.is-reverse {
grid-template-columns: 1fr;
}
.tw-manufacturing-history-stage {
padding-left: 0;
}
.tw-manufacturing-history-nav-wrap {
display: block;
width: 100%;
}
.tw-manufacturing-history-nav-arrow {
display: none !important;
}
.tw-manufacturing-history-nav-viewport {
overflow: visible !important;
max-height: none !important;
}
.tw-manufacturing-history-nav {
flex-direction: row;
flex-wrap: wrap;
gap: 16px 22px;
padding: 0 0 4px;
}
.tw-manufacturing-history-nav::before {
display: none;
}
.tw-manufacturing-history-year {
padding-left: 0;
font-size: 24px;
line-height: 34px;
}
.tw-manufacturing-history-year::before {
display: none;
}
.tw-manufacturing-history-copy p {
font-size: 16px;
line-height: 28px;
white-space: normal;
}
.tw-manufacturing-history-stage,
.tw-manufacturing-history-media img {
max-width: 100%;
}
}
@media (max-width: 991.98px) {
.tw-manufacturing-page {
padding: 0 0 68px;
}
.tw-manufacturing-page > .container:first-child {
margin-bottom: 8px;
}
.tw-manufacturing-card {
margin-top: -252px;
padding: 36px 24px 40px;
border-radius: 22px;
}
.tw-product-service-banner-inner--mfg {
padding-left: 24px;
padding-right: 24px;
}
.tw-manufacturing-stat-list {
grid-template-columns: 1fr;
gap: 24px;
margin: 32px 0 40px !important;
}
.tw-manufacturing-stat-list li {
padding: 0;
}
.tw-manufacturing-stat-list li:not(:first-child)::before {
display: none;
}
.tw-manufacturing-stat-list strong {
font-size: 38px;
}
.tw-manufacturing-stat-list span {
font-size: 18px;
line-height: 1.6;
}
.tw-manufacturing-stats {
grid-template-columns: 1fr;
gap: 18px;
}
.tw-manufacturing-stat {
padding: 0;
}
.tw-manufacturing-stat:not(:first-child)::before {
display: none;
}
}
@media (max-width: 767.98px) {
.tw-company-tabs {
justify-content: center;
gap: 30px;
transform: none;
}
.tw-company-tab {
flex: 0 0 auto;
}
.tw-manufacturing-page > .container:first-child {
margin-bottom: 8px;
}
.tw-manufacturing-hero-copy h1 {
font-size: 28px;
padding: 11px 16px;
border-radius: 12px;
}
.tw-manufacturing-hero-copy .tw-hero-title-logo,
.tw-trade-hero-copy .tw-hero-title-logo {
max-width: min(100%, 180px);
max-height: 42px;
}
.tw-manufacturing-hero-copy .tw-hero-title-logo + p,
.tw-trade-hero-copy .tw-hero-title-logo + p {
margin-top: 8px;
max-width: 320px;
white-space: normal;
}
.tw-manufacturing-hero-copy p {
font-size: 18px;
line-height: 1.8;
padding: 10px 14px;
border-radius: 12px;
}
.tw-manufacturing-card {
margin-top: -195px;
padding: 28px 18px 32px;
}
.tw-product-service-banner-inner--mfg {
padding-left: 18px;
padding-right: 18px;
}
.tw-manufacturing-heading h2 {
font-size: 20px;
}
.tw-manufacturing-history-year {
font-size: 18px;
line-height: 26px;
}
.tw-manufacturing-history-copy p {
font-size: 13px;
line-height: 22px;
}
}
.tw-project-hero {
position: relative;
overflow: hidden;
min-height: 560px;
background: linear-gradient(120deg, #0f3b74 0%, #1d5d98 54%, #2c79a9 100%);
}
.tw-project-hero img,
.tw-project-hero-fallback {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
}
.tw-project-hero img {
object-fit: cover;
}
.tw-project-hero-fallback {
background:
linear-gradient(135deg, rgba(255, 255, 255, 0.16) 0 15%, rgba(255, 255, 255, 0) 15% 100%),
linear-gradient(320deg, rgba(255, 255, 255, 0.08) 0 16%, rgba(255, 255, 255, 0) 16% 100%),
linear-gradient(120deg, #0f3b74 0%, #1d5d98 54%, #2c79a9 100%);
}
.tw-project-hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(10, 22, 46, 0.12) 0%, rgba(10, 22, 46, 0.04) 54%, rgba(10, 22, 46, 0.24) 100%);
}
/* Hero 鏂囨鍖轰笌 HYS 鍚屽垪瀹斤紙1600 灞呬腑锛夛紝涓庝笅鏂圭櫧鍗″彸缂樺榻愶紱姝ｆ枃浠嶇敤澶栧眰 .container + 鐧藉崱 max-width:1600 */
.tw-project-hero .container {
position: relative;
min-height: 560px;
max-width: 1600px;
margin-left: auto;
margin-right: auto;
width: 100%;
box-sizing: border-box;
}
.tw-project-hero-label {
position: absolute;
right: 68px;
bottom: 120px;
max-width: min(720px, calc(100% - 136px));
text-align: right;
color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 1.3;
text-shadow: 0 8px 22px rgba(7, 15, 38, 0.22);
}
.tw-project-page {
position: relative;
background:
linear-gradient(121deg, rgba(25, 50, 114, 0.03) 0 17%, transparent 17% 100%),
linear-gradient(304deg, rgba(25, 50, 114, 0.025) 0 14%, transparent 14% 100%),
#f7f8fb;
padding: 12px 0 92px;
}
.tw-project-panel {
margin-top: 0;
}
.tw-project-card {
position: relative;
width: 100%;
max-width: 1600px;
margin: -108px auto 0;
padding: 54px 68px 58px;
background: #ffffff;
border-radius: 4px;
box-shadow: 0 28px 72px rgba(20, 39, 85, 0.08);
z-index: 2;
}
.tw-project-heading {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 22px;
}
.tw-project-heading span {
width: 3px;
height: 28px;
border-radius: 999px;
background: #1b49b4;
}
.tw-project-heading h2 {
margin: 0;
color: #2f3d59;
font-size: 31px;
font-weight: 500;
line-height: 1.2;
}
.tw-project-copy h3 {
margin: 0 0 18px;
color: #1f2c45;
font-size: 17px;
font-weight: 700;
line-height: 1.9;
}
.tw-project-copy p {
margin: 0 0 18px;
color: #6b7383;
font-size: 14px;
line-height: 2.1;
}
.tw-project-copy p:last-child {
margin-bottom: 0;
}
.tw-project-gallery {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 54px;
margin-top: 62px;
}
.tw-project-gallery-card {
overflow: hidden;
border-radius: 8px;
background: #fff;
}
.tw-project-gallery-media {
position: relative;
height: 245px;
background: #e8edf6;
}
.tw-project-gallery-media img,
.tw-project-gallery-placeholder {
display: block;
width: 100%;
height: 100%;
}
.tw-project-gallery-media img {
object-fit: cover;
}
.tw-project-gallery-placeholder {
background:
linear-gradient(135deg, rgba(255, 255, 255, 0.7) 0 14%, rgba(255, 255, 255, 0) 14% 100%),
linear-gradient(120deg, #dfe5f0 0%, #eef2f7 100%);
}
.tw-project-gallery-caption {
display: flex;
align-items: center;
justify-content: center;
height: 46px;
background: rgba(17, 27, 57, 0.58);
color: #fff;
font-size: 17px;
font-weight: 400;
line-height: 1;
}
@media (max-width: 1199.98px) {
.tw-project-hero,
.tw-project-hero .container {
min-height: 430px;
}
.tw-project-hero-label {
right: 38px;
bottom: 88px;
max-width: min(720px, calc(100% - 76px));
font-size: 22px;
}
.tw-project-card {
padding: 46px 38px 48px;
margin-top: -92px;
}
.tw-project-gallery {
gap: 20px;
margin-top: 44px;
}
}
@media (max-width: 991.98px) {
.tw-project-hero,
.tw-project-hero .container {
min-height: 360px;
}
.tw-project-card {
padding: 36px 24px 40px;
margin-top: -72px;
}
.tw-project-hero-label {
right: 24px;
max-width: min(720px, calc(100% - 48px));
}
.tw-project-heading h2 {
font-size: 26px;
}
.tw-project-gallery {
grid-template-columns: 1fr;
gap: 20px;
}
}
@media (max-width: 767.98px) {
.tw-project-hero,
.tw-project-hero .container {
min-height: 260px;
}
.tw-project-hero-label {
right: 18px;
bottom: 44px;
max-width: min(720px, calc(100% - 36px));
font-size: 18px;
}
.tw-project-card {
padding: 28px 18px 32px;
margin-top: -48px;
}
.tw-project-heading {
margin-bottom: 16px;
}
.tw-project-heading h2 {
font-size: 22px;
}
.tw-project-copy h3 {
font-size: 15px;
line-height: 1.8;
}
.tw-project-copy p {
font-size: 13px;
line-height: 1.9;
}
.tw-project-gallery {
margin-top: 28px;
}
.tw-project-gallery-media {
height: 200px;
}
.tw-project-gallery-caption {
font-size: 15px;
}
}
/* HK 鏍稿績浜у搧绯诲垪锛氱珯鐐逛俊鎭厤缃?+ 瀵屾枃鏈?[HK_PRODUCT_CARDS] */
.tw-trade-product-series {
margin: 28px 0 16px;
width: 100%;
}
#tw-hk-core-product-series {
scroll-margin-top: 96px;
}
@media (max-width: 991.98px) {
#tw-hk-core-product-series {
scroll-margin-top: 80px;
}
}
.tw-trade-product-series__grid {
display: grid;
width: 100%;
grid-template-columns: repeat(4, minmax(0, 1fr));
column-gap: 28px;
row-gap: 28px;
align-items: stretch;
}
.tw-trade-product-series__card {
position: relative;
display: block;
overflow: hidden;
border-radius: 14px;
min-height: 720px;
width: 100%;
cursor: pointer;
text-decoration: none;
color: #fff;
box-shadow: 0 18px 40px rgba(14, 28, 68, 0.12);
transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.tw-trade-product-series__card:hover {
box-shadow: 0 22px 48px rgba(24, 49, 109, 0.22);
transform: translateY(-2px);
}
.tw-trade-product-series__bg {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
img.tw-trade-product-series__bg {
filter: brightness(0.76) saturate(0.92);
}
.tw-trade-product-series__bg--placeholder {
background: linear-gradient(135deg, #1e2d4a 0%, #121a2a 100%);
}
.tw-trade-product-series__shade {
position: absolute;
inset: 0;
background: rgba(4, 10, 24, 0.62);
transition: background 0.28s ease;
pointer-events: none;
}
.tw-trade-product-series__card:hover .tw-trade-product-series__shade {
background: rgba(6, 14, 36, 0.74);
}
.tw-trade-product-series__body {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 20px;
min-height: 720px;
padding: 48px 24px 40px;
text-align: center;
}
.tw-trade-product-series__icon-wrap {
display: flex;
align-items: center;
justify-content: center;
width: 96px;
height: 96px;
}
.tw-trade-product-series__icon {
max-width: 100%;
max-height: 96px;
width: auto;
height: auto;
object-fit: contain;
}
.tw-trade-product-series__title {
font-size: 17px;
font-weight: 600;
line-height: 1.35;
text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}
@media (max-width: 991px) {
.tw-trade-product-series__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
column-gap: 22px;
row-gap: 22px;
}
.tw-trade-product-series__card,
.tw-trade-product-series__body {
min-height: 520px;
}
}
@media (max-width: 575px) {
.tw-trade-product-series__grid {
grid-template-columns: 1fr;
column-gap: 0;
row-gap: 20px;
}
.tw-trade-product-series__card,
.tw-trade-product-series__body {
min-height: 440px;
}
}
/* 涓滆帪鍙嬪拰鐩涳細涓氬姟鑼冪暣鍙屽崱 [DG_BUSINESS_SCOPE] */
.tw-dg-business-scope {
margin: 28px 0 24px;
width: 100%;
}
.tw-dg-business-scope__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
width: 100%;
align-items: stretch;
}
.tw-dg-business-scope__card {
position: relative;
overflow: hidden;
border-radius: 16px;
/* 绋匡細涓滆帪鍙嬪拰鐩?鎸夐挳/缁?7/鐭╁舰 13 size 565脳369 */
aspect-ratio: 565 / 369;
width: 100%;
min-height: 0;
box-shadow: 0 18px 40px rgba(14, 28, 68, 0.12);
}
.tw-dg-business-scope__bg {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
/* 瀵屾枃鏈唴 img 鍏ㄥ眬瑙勫垯鍚?height:auto銆乵ax-width:100%锛屼細鐩栨帀涓婃潯瀵艰嚧搴曡竟鐣欑櫧锛岄』鎻愰珮浼樺厛绾?*/
.tw-manufacturing-richtext-content .tw-dg-business-scope__bg {
display: block;
max-width: none;
width: 100%;
height: 100%;
vertical-align: top;
object-fit: cover;
object-position: center;
}
.tw-dg-business-scope__bg--placeholder {
background: linear-gradient(135deg, #2a3f63 0%, #1a2740 100%);
}
.tw-dg-business-scope__shade {
position: absolute;
inset: 0;
background: linear-gradient(
180deg,
rgba(8, 12, 24, 0.35) 0%,
rgba(8, 12, 24, 0.25) 40%,
rgba(8, 12, 24, 0.55) 100%
);
pointer-events: none;
}
/* 涓氬姟鑼冪暣鍗＄墖锛氳鐩栧叏灞€ h 鏍囬鏍峰紡锛岀嫭绔嬩簬瀵屾枃鏈鏂?*/
.tw-manufacturing-richtext-content .tw-dg-business-scope__title,
.tw-dg-business-scope__title {
position: absolute;
z-index: 1;
top: 0;
left: 0;
margin: 0;
padding: 28px 28px 16px;
max-width: 82%;
font-size: clamp(28px, 3.2vw, 40px);
font-weight: 700;
line-height: 1.2;
color: #ffffff;
text-shadow: 0 2px 20px rgba(0, 0, 0, 0.55);
}
.tw-manufacturing-richtext-content .tw-dg-business-scope__desc,
.tw-dg-business-scope__desc {
position: absolute;
z-index: 1;
right: 0;
bottom: 0;
margin: 0;
padding: 16px 28px 28px;
max-width: 88%;
font-size: 15px;
font-weight: 500;
line-height: 1.65;
color: #ffffff;
text-align: right;
text-shadow: 0 1px 14px rgba(0, 0, 0, 0.55);
}
@media (max-width: 767px) {
.tw-dg-business-scope__grid {
grid-template-columns: 1fr;
gap: 20px;
}
.tw-manufacturing-richtext-content .tw-dg-business-scope__title,
.tw-dg-business-scope__title {
padding: 22px 22px 12px;
max-width: 92%;
font-size: clamp(24px, 5vw, 32px);
}
.tw-manufacturing-richtext-content .tw-dg-business-scope__desc,
.tw-dg-business-scope__desc {
padding: 12px 22px 22px;
max-width: 94%;
font-size: 14px;
}
}
.tw-trade-page {
background:
linear-gradient(118deg, rgba(17, 44, 104, 0.04) 0 20%, transparent 20% 100%),
linear-gradient(300deg, rgba(17, 44, 104, 0.035) 0 16%, transparent 16% 100%),
#f5f7fb;
padding: 0 0 92px;
}
.tw-trade-page > .container:first-child {
position: relative;
z-index: 5;
display: flex;
justify-content: center;
margin-bottom: 12px;
}
.tw-trade-panel {
display: none;
}
.tw-trade-panel.is-active {
display: block;
}
.tw-trade-hero {
position: relative;
overflow: hidden;
width: 100%;
height: 0;
box-sizing: content-box;
padding-bottom: min(818px, max(440px, calc(100% * 818 / 1920)));
border-radius: 0;
background: linear-gradient(120deg, #0d2d67 0%, #174493 48%, #1f58b6 100%);
box-shadow: 0 30px 70px rgba(14, 28, 68, 0.18);
}
.tw-trade-hero > .container {
position: absolute;
inset: 0;
z-index: 2;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-end;
padding-top: 0;
padding-bottom: 340px;
box-sizing: border-box;
pointer-events: none;
}
.tw-trade-hero .tw-product-service-banner-inner {
pointer-events: auto;
}
/* HK 贸易列表/详情：Banner 与白卡交界处右侧为公司全称（列表/详情返回按钮均在白卡内容区内） */
.tw-trade-hero-trade-footer {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-end;
gap: 12px 28px;
width: 100%;
}
.tw-trade-hero-trade-footer .tw-trade-hero-copy {
flex: 0 1 720px;
max-width: min(100%, 720px);
}
/* 详情 Banner 仅保留公司名一行时，原先靠「面包屑 | 公司名」两侧分布；去掉左侧后需把公司名推回右侧 */
.tw-trade-hero-trade-footer > .tw-trade-hero-copy:only-child {
margin-left: auto;
}
.tw-trade-hero > img,
.tw-trade-hero > .tw-trade-hero-fallback {
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 100%;
min-width: 100%;
height: auto;
display: block;
max-width: none;
}
.tw-trade-hero > img {
object-fit: cover;
object-position: center center;
}
.tw-trade-hero > .tw-trade-hero-fallback {
background:
linear-gradient(135deg, rgba(255, 255, 255, 0.14) 0 15%, rgba(255, 255, 255, 0) 15% 100%),
linear-gradient(320deg, rgba(255, 255, 255, 0.1) 0 16%, rgba(255, 255, 255, 0) 16% 100%),
linear-gradient(120deg, #0d2d67 0%, #174493 48%, #1f58b6 100%);
}
.tw-trade-hero-overlay {
position: absolute;
inset: 0;
background:
radial-gradient(circle at 74% 36%, rgba(255, 255, 255, 0.18), transparent 20%),
linear-gradient(90deg, rgba(6, 15, 40, 0.72) 0%, rgba(6, 15, 40, 0.38) 44%, rgba(6, 15, 40, 0.14) 100%);
}
.tw-trade-hero-copy {
position: relative;
z-index: 1;
min-height: 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-end;
max-width: 720px;
padding: 0;
margin: 0;
color: #fff;
text-align: right;
}
.tw-trade-hero-copy h1:first-child {
margin-top: 0;
}
.tw-trade-hero-copy span {
display: inline-flex;
width: fit-content;
padding: 7px 16px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.14);
font-size: 12px;
letter-spacing: 0.2em;
text-transform: uppercase;
}
.tw-trade-hero-copy h1 {
display: inline-block;
width: fit-content;
max-width: 100%;
margin: 18px 0 14px;
padding: 14px 22px;
font-size: 42px;
line-height: 1.15;
font-weight: 700;
letter-spacing: 0.01em;
color: #f8fafc;
text-shadow:
0 0 1px rgba(0, 0, 0, 0.9),
0 1px 3px rgba(0, 0, 0, 0.78),
0 4px 22px rgba(0, 0, 0, 0.38);
text-align: right;
vertical-align: top;
background: linear-gradient(145deg, rgba(23, 49, 109, 0.1) 0%, rgba(12, 26, 58, 0.085) 100%);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 14px;
box-shadow: 0 1px 4px rgba(8, 15, 40, 0.08);
-webkit-backdrop-filter: blur(10px) saturate(1.15);
backdrop-filter: blur(10px) saturate(1.15);
}
.tw-trade-hero-copy p {
display: inline-block;
width: fit-content;
max-width: 100%;
margin: 0;
padding: 12px 20px;
font-size: 22px;
line-height: 1.55;
font-weight: 600;
letter-spacing: 0.02em;
color: #f8fafc;
text-shadow:
0 0 1px rgba(0, 0, 0, 0.88),
0 1px 3px rgba(0, 0, 0, 0.74),
0 3px 18px rgba(0, 0, 0, 0.36);
text-align: right;
vertical-align: top;
background: linear-gradient(145deg, rgba(23, 49, 109, 0.1) 0%, rgba(12, 26, 58, 0.085) 100%);
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 14px;
box-shadow: 0 1px 4px rgba(8, 15, 40, 0.08);
-webkit-backdrop-filter: blur(10px) saturate(1.15);
backdrop-filter: blur(10px) saturate(1.15);
}
.tw-manufacturing-hero-copy,
.tw-trade-hero-copy {
transform: none;
}
@media (max-width: 1199.98px) {
.tw-manufacturing-hero > .container,
.tw-trade-hero > .container {
padding-bottom: 297px;
}
}
@media (max-width: 991.98px) {
.tw-manufacturing-hero > .container,
.tw-trade-hero > .container {
padding-bottom: 252px;
}
}
@media (max-width: 767.98px) {
.tw-manufacturing-hero > .container,
.tw-trade-hero > .container {
padding-bottom: 195px;
}
}
/* 涓庣敓浜у埗閫?HYS 鐧藉崱锛?tw-manufacturing-card锛夊悓涓€濂楀昂瀵镐笌鐣欑櫧 */
.tw-trade-card {
position: relative;
width: 100%;
max-width: 1600px;
margin: -340px auto 0;
padding: 54px 68px 58px;
background: #ffffff;
border-radius: 26px;
box-shadow: 0 34px 80px rgba(20, 39, 85, 0.1);
}
.tw-trade-main {
display: block;
}
a.tw-company-tab {
text-decoration: none;
display: inline-block;
box-sizing: border-box;
}
.tw-trade-list-wrap {
min-width: 0;
}
.tw-trade-list-head {
display: flex;
align-items: flex-start;
gap: 18px;
margin-bottom: 28px;
padding: 4px 0 20px;
border-bottom: 1px solid rgba(24, 49, 109, 0.12);
}
.tw-trade-list-head__icon {
flex: 0 0 auto;
width: 42px;
height: 42px;
display: inline-flex;
align-items: center;
justify-content: center;
color: #202020;
font-size: 38px;
line-height: 1;
}
.tw-trade-list-head__icon-img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
object-position: center;
/* 涓婂眰鍗＄墖鍥炬爣绱犳潗涓虹櫧鑹诧紝鍒楄〃澶撮儴闇€杞负榛戣壊鏄剧ず */
filter: brightness(0) saturate(100%);
}
.tw-trade-list-head__copy {
min-width: 0;
flex: 1 1 auto;
}
.tw-trade-list-head__title {
margin: 0;
color: #202020;
font-size: 18px;
font-weight: 700;
line-height: 1.25;
}
.tw-trade-list-head__desc {
margin: 6px 0 0;
max-width: none;
color: #666666;
font-size: 14px;
font-weight: 400;
line-height: 1.7;
}
.tw-trade-product-list.product-list.row {
margin-left: -12px;
margin-right: -12px;
}
.tw-trade-product-list .product-item {
padding-left: 12px;
padding-right: 12px;
}
/* 鍏ㄧ悆璐告槗-浜у搧鍒楄〃鍗★細瀵归綈璁捐绋匡紝搴曢儴涓哄乏鏍囬 + 鍙冲渾绠ご */
.tw-trade-product-list .product-item {
margin: 14px 0;
}
.tw-trade-product-list .product-item .product-item-wrapper {
display: flex;
flex-direction: column;
min-height: 415px;
border-radius: 0;
background: #ffffff;
box-shadow: 0 10px 28px rgba(24, 49, 109, 0.08);
position: relative;
top: 0;
overflow: hidden;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.tw-trade-product-list .product-item .product-item-wrapper:hover {
top: 0;
transform: translateY(-3px);
box-shadow: 0 16px 34px rgba(24, 49, 109, 0.12);
}
.tw-trade-product-list .product-item .product-item-wrapper:hover .pic img {
transform: none;
}
.tw-trade-product-list .product-item .pic {
display: flex;
align-items: center;
justify-content: center;
min-height: 350px;
padding: 34px 20px 22px;
overflow: hidden;
border-top-left-radius: 0;
border-top-right-radius: 0;
background: #ffffff;
}
.tw-trade-product-list .product-item .pic img {
display: block;
width: 100%;
height: 100%;
max-width: 82%;
max-height: 220px;
object-fit: contain;
object-position: center;
transform: none;
}
.tw-trade-product-list .product-item .content-wrapper.tw-trade-product-card__footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin: 0 14px 14px;
padding: 14px 0 0;
border-top: 1px solid rgba(24, 49, 109, 0.14);
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
background: transparent;
}
.tw-trade-product-list .product-item .product-item-title {
margin: 0;
min-width: 0;
flex: 1 1 auto;
color: #202020;
font-size: 16px;
font-weight: 500;
line-height: 1.35;
text-align: left;
}
.tw-trade-product-list .product-item .tw-trade-product-card__arrow {
flex: 0 0 auto;
width: 23px;
height: 23px;
border: 1.5px solid #283d97;
border-radius: 50%;
color: #283d97;
display: inline-flex;
align-items: center;
justify-content: center;
}
.tw-trade-product-list .product-item .tw-trade-product-card__arrow .fa {
font-size: 18px;
line-height: 1;
margin-left: 1px;
}
.tw-trade-list-pagination.page-pagination {
margin-top: 36px;
}
.tw-trade-detail-wrap {
min-width: 0;
}
.tw-trade-detail-back {
margin-bottom: 22px;
}
.tw-trade-detail-back__link {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 16px 8px 12px;
border-radius: 999px;
border: 1px solid rgba(24, 49, 109, 0.18);
background: rgba(255, 255, 255, 0.9);
color: var(--tw-primary, #18316d);
font-size: 14px;
font-weight: 600;
text-decoration: none;
transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.tw-trade-detail-back__link:hover {
border-color: rgba(24, 49, 109, 0.35);
background: #fff;
color: #2450b2;
}
.tw-trade-detail-back__link .fa {
font-size: 18px;
line-height: 1;
margin-top: -1px;
}
.tw-product-list-back {
margin-bottom: 20px;
}
.tw-trade-detail-info {
margin-bottom: 0;
}
.tw-trade-detail-gallery-top .swiper-slide img {
display: block;
width: 100%;
height: auto;
object-fit: contain;
}
.tw-trade-detail-noimg {
display: flex;
align-items: center;
justify-content: center;
min-height: 220px;
padding: 24px;
border-radius: 16px;
background: linear-gradient(135deg, #eef3fb 0%, #e4ecf8 100%);
color: #6b7482;
font-size: 14px;
}
.tw-trade-detail-body {
margin-top: 18px;
min-width: 0;
}
.tw-trade-detail-params {
margin-top: 32px;
padding-bottom: 8px;
}
.tw-trade-detail-params-card {
padding: 28px 32px 32px;
}
.tw-trade-detail-params__title {
margin: 0 0 18px;
padding-bottom: 14px;
border-bottom: 1px solid rgba(24, 49, 109, 0.12);
color: #17316d;
font-size: 20px;
font-weight: 700;
}
.tw-trade-detail-params__body {
min-width: 0;
}
.tw-trade-detail-fallback {
padding: 48px 0 80px;
}
.tw-trade-intro {
min-width: 0;
margin-bottom: 0;
}
.tw-trade-products {
min-width: 0;
padding-top: 42px;
border-top: 1px solid rgba(24, 49, 109, 0.12);
}
/* 璐告槗鍖轰骇鍝佺綉鏍肩瓑锛氭鏂囨帓鐗堢敱瀵屾枃鏈帶鍒讹紱姝ゅ浠呯粍浠剁骇甯冨眬 */
.tw-trade-section-heading {
display: flex;
align-items: end;
justify-content: space-between;
gap: 24px;
margin-bottom: 26px;
padding-bottom: 18px;
border-bottom: 1px solid rgba(24, 49, 109, 0.12);
}
.tw-trade-section-heading span {
display: inline-block;
margin-bottom: 10px;
color: #2450b2;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.16em;
text-transform: uppercase;
}
.tw-trade-section-heading h2 {
margin: 0;
color: #17316d;
font-size: 30px;
font-weight: 700;
line-height: 1.2;
}
.tw-trade-section-heading p {
max-width: 420px;
margin: 0;
color: #6b7482;
font-size: 14px;
line-height: 1.9;
text-align: left;
}
.tw-trade-product-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
}
.tw-trade-product-card {
min-width: 0;
}
.tw-trade-product-link {
display: block;
height: 100%;
overflow: hidden;
border-radius: 20px;
background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
box-shadow: 0 18px 42px rgba(20, 39, 85, 0.08);
transition: transform 0.24s ease, box-shadow 0.24s ease;
}
.tw-trade-product-link:hover {
transform: translateY(-6px);
box-shadow: 0 24px 52px rgba(20, 39, 85, 0.14);
}
.tw-trade-product-media {
position: relative;
height: 246px;
overflow: hidden;
background: linear-gradient(135deg, #eef3fb 0%, #dfe8f7 100%);
}
.tw-trade-product-media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.28s ease;
}
.tw-trade-product-link:hover .tw-trade-product-media img {
transform: scale(1.04);
}
.tw-trade-product-body {
padding: 22px 22px 24px;
}
.tw-trade-product-meta {
margin-bottom: 10px;
}
.tw-trade-product-meta span {
display: inline-flex;
align-items: center;
min-height: 28px;
padding: 0 12px;
border-radius: 999px;
background: rgba(36, 80, 178, 0.08);
color: #2450b2;
font-size: 12px;
font-weight: 600;
}
.tw-trade-product-body h3 {
margin: 0 0 10px;
color: #203454;
font-size: 19px;
font-weight: 700;
line-height: 1.45;
}
.tw-trade-product-body p {
min-height: 52px;
margin: 0;
color: #677284;
font-size: 14px;
line-height: 1.85;
}
.tw-trade-product-more {
display: inline-flex;
align-items: center;
gap: 8px;
margin-top: 18px;
color: #17316d;
font-size: 14px;
font-weight: 700;
}
.tw-trade-empty {
padding: 42px 32px;
border-radius: 20px;
background: linear-gradient(180deg, rgba(36, 80, 178, 0.05) 0%, rgba(36, 80, 178, 0.02) 100%);
border: 1px dashed rgba(36, 80, 178, 0.22);
text-align: center;
}
.tw-trade-empty strong {
display: block;
margin-bottom: 8px;
color: #17316d;
font-size: 20px;
font-weight: 700;
}
.tw-trade-empty p {
margin: 0;
color: #6b7482;
font-size: 14px;
line-height: 1.8;
}
@media (max-width: 1199.98px) {
.tw-trade-card {
margin-top: -297px;
padding: 46px 38px 48px;
}
.tw-product-service-banner-inner--trade {
padding-left: 38px;
padding-right: 38px;
}
.tw-trade-section-heading {
align-items: start;
flex-direction: column;
}
.tw-trade-section-heading p {
max-width: none;
text-align: left;
}
}
@media (max-width: 991.98px) {
.tw-trade-page {
padding: 0 0 68px;
}
.tw-trade-page > .container:first-child {
margin-bottom: 8px;
}
.tw-trade-card {
margin-top: -252px;
padding: 36px 24px 40px;
border-radius: 22px;
}
.tw-product-service-banner-inner--trade {
padding-left: 24px;
padding-right: 24px;
}
.tw-trade-products {
padding-top: 34px;
}
.tw-trade-product-grid {
grid-template-columns: 1fr;
}
}
@media (max-width: 767.98px) {
.tw-trade-page > .container:first-child {
margin-bottom: 8px;
}
.tw-product-service-banner-inner--trade {
padding-left: 18px;
padding-right: 18px;
}
.tw-trade-hero-copy h1 {
font-size: 28px;
padding: 11px 16px;
border-radius: 12px;
}
.tw-trade-hero-copy p {
font-size: 18px;
line-height: 1.8;
padding: 10px 14px;
border-radius: 12px;
}
.tw-trade-hero-trade-footer {
flex-direction: column;
align-items: stretch;
gap: 8px;
}
.tw-trade-hero-trade-footer .tw-trade-hero-copy {
align-self: flex-end;
max-width: 100%;
}
.tw-trade-list-head {
gap: 12px;
padding-bottom: 16px;
}
.tw-trade-list-head__icon {
width: 32px;
height: 32px;
font-size: 28px;
}
.tw-trade-list-head__title {
font-size: 17px;
}
.tw-trade-list-head__desc {
margin-top: 4px;
font-size: 13px;
line-height: 1.65;
}
.tw-trade-card {
margin-top: -195px;
padding: 28px 18px 32px;
}
.tw-trade-product-list .product-item .product-item-wrapper {
min-height: 372px;
}
.tw-trade-product-list .product-item .pic {
min-height: 308px;
padding: 26px 16px 18px;
}
.tw-trade-product-list .product-item .pic img {
max-width: 84%;
max-height: 186px;
}
.tw-trade-product-list .product-item .content-wrapper.tw-trade-product-card__footer {
margin: 0 12px 12px;
padding-top: 12px;
}
.tw-trade-products {
padding-top: 28px;
}
.tw-trade-section-heading h2 {
font-size: 22px;
}
.tw-trade-product-media {
height: 210px;
}
.tw-trade-product-body {
padding: 18px 18px 20px;
}
.tw-trade-product-body h3 {
font-size: 17px;
}
}
.tw-news-page {
padding: 78px 0 96px;
background: linear-gradient(180deg, #f7f8fb 0%, #ffffff 100%);
}
/* 鍏ㄥ眬鍐呴〉 Banner锛氬幓鎺?style.min 涓摑绱笎鍙橀伄缃╋紝鏄剧ず鍘熷浘 */
.page-banner .page-banner-overlay {
background: none;
}
.page-banner .page-banner-content h1 {
order: 1;
text-shadow: 0 1px 18px rgba(0, 0, 0, 0.35);
}
.page-banner .page-banner-content .page-banner-ename {
order: 2;
margin-top: 0;
text-shadow: 0 1px 14px rgba(0, 0, 0, 0.32);
}
/* 鍘绘帀 Banner 搴曢儴 Tab 鍚庯紝鏍囬鍦ㄥ浘鍖哄瀭鐩村眳涓紙瑕嗙洊 style.min 鐨?bottom锛?*/
.page-banner .page-banner-content {
bottom: auto;
top: 50%;
transform: translateY(-50%);
}
/*
* 鍐呴〉 Banner 鏍囬椤哄簭锛氫腑鏂囦富鏍囬鍦ㄤ笂锛岃嫳鏂囧壇鏍囬鍦ㄤ笅銆? * pagebanner.html 涓?DOM 涓?ename 鍦ㄥ墠銆乭1 鍦ㄥ悗锛岄渶 flex 閲嶆帓銆? */
.page-banner .page-banner-content .container {
display: flex;
flex-direction: column;
align-items: flex-start;
}
/*
* 04/05/07 manifest銆屽ぇ鍥俱€嶇粺涓€锛氶珮绾?456px锛涗富鏍囬 81px SourceHanSansCN-Normal锛? * 鑻辨枃鍓爣棰橈紙DYNAMICS/COOPERATION/SERVICE锛夌害 34.5px锛涘乏涓?248/1920鈮?2.92%锛屾爣棰樺尯绾﹀湪 banner 鍐?31%锛堢浉瀵?y99 澶у浘椤讹級銆? */
.page-banner.page-banner--manifest,
.page-banner.page-banner--service-support {
height: auto;
min-height: 456px;
}
.page-banner--manifest .page-banner-content,
.page-banner--service-support .page-banner-content {
bottom: auto;
top: 31%;
left: 12.92%;
right: auto;
transform: none;
width: auto;
max-width: min(720px, calc(100% - 12.92% - 24px));
}
.page-banner--manifest .page-banner-content .container,
.page-banner--service-support .page-banner-content .container {
display: flex;
flex-direction: column;
align-items: flex-start;
margin: 0;
padding-left: 0;
padding-right: 0;
max-width: none;
width: auto;
}
.page-banner--manifest .page-banner-content h1,
.page-banner--service-support .page-banner-content h1 {
order: 1;
margin: 0;
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: clamp(40px, 4.2vw, 81px);
font-weight: 400;
line-height: 1.12;
letter-spacing: 0;
}
.page-banner--manifest .page-banner-content .page-banner-ename,
.page-banner--service-support .page-banner-content .page-banner-ename {
order: 2;
margin: 28px 0 0;
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: clamp(20px, 1.8vw, 35px);
font-weight: 400;
line-height: 1.1;
letter-spacing: 0.08em;
text-transform: none;
color: rgba(255, 255, 255, 0.92);
}
.tw-service-page {
padding: 48px 0 90px;
background:
linear-gradient(135deg, rgba(27, 55, 132, 0.03) 0 12%, transparent 12% 100%),
linear-gradient(315deg, rgba(27, 55, 132, 0.03) 0 12%, transparent 12% 100%),
#f6f7fb;
}
.tw-service-card {
max-width: 1320px;
margin: 0 auto;
padding: 52px 60px 68px;
background: #fff;
box-shadow: 0 22px 70px rgba(17, 32, 79, 0.08);
}
.tw-service-section + .tw-service-section {
margin-top: 54px;
padding-top: 50px;
border-top: 1px solid #e6eaf2;
}
.tw-service-heading {
display: flex;
align-items: flex-start;
gap: 12px;
margin-bottom: 32px;
}
/* manifest銆屽浘灞?4銆嶇珫鏉?5脳36锛涙爣棰樸€屾湇鍔℃祦绋?鍚堜綔鑱旂郴銆?8px Bold锛涘壇鏂囨 18px Regular */
.tw-service-heading span {
width: 5px;
height: 36px;
border-radius: 999px;
background: var(--tw-primary);
}
.tw-service-heading h2 {
margin: 0;
color: #1a2440;
font-size: 38px;
font-weight: 700;
line-height: 1.1;
}
.tw-service-heading p {
margin: 8px 0 0;
color: #6b7280;
font-size: 18px;
font-weight: 400;
line-height: 1.65;
letter-spacing: 0;
}
.tw-service-process-grid {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 26px 20px;
}
.tw-service-step {
position: relative;
text-align: center;
cursor: default;
}
.tw-service-step-icon {
position: relative;
display: flex;
align-items: flex-start;
justify-content: center;
width: 132px;
height: 132px;
margin: 0 auto -8px;
padding-top: 22px;
border: 0;
border-radius: 0;
background: transparent;
color: #9ca3af;
font-size: 40px;
transition: color 0.22s ease;
}
.tw-service-step-icon::before {
content: "";
position: absolute;
inset: 0;
border-radius: 50%;
background: conic-gradient(
from 0deg,
#c4c8d2 0deg 145deg,
transparent 145deg 215deg,
#c4c8d2 215deg 360deg
);
-webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px));
mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px));
transition: background 0.22s ease;
}
.tw-service-step-icon i {
position: relative;
z-index: 1;
line-height: 1;
}
.tw-service-step:first-child .tw-service-step-icon {
color: var(--tw-primary);
}
.tw-service-step:first-child .tw-service-step-icon::before {
background: conic-gradient(
from 0deg,
#223591 0deg 145deg,
transparent 145deg 215deg,
#223591 215deg 360deg
);
}
.tw-service-step h3 {
min-height: 0;
position: relative;
z-index: 2;
margin: -42px 0 8px;
color: #7f8495;
font-size: 16px;
font-weight: 600;
line-height: 1.45;
transition: color 0.22s ease;
}
.tw-service-step strong {
display: block;
color: #aeb3c1;
font-size: 42px;
line-height: 1;
font-weight: 700;
letter-spacing: 0.02em;
transition: color 0.22s ease;
}
.tw-service-step:first-child h3,
.tw-service-step:first-child strong {
color: var(--tw-primary);
}
.tw-service-step:hover .tw-service-step-icon {
color: var(--tw-primary);
}
.tw-service-step:hover .tw-service-step-icon::before {
background: conic-gradient(
from 0deg,
rgba(33, 88, 255, 0.72) 0deg 145deg,
transparent 145deg 215deg,
rgba(33, 88, 255, 0.72) 215deg 360deg
);
}
.tw-service-step:hover h3,
.tw-service-step:hover strong {
color: var(--tw-primary);
}
.tw-service-contact-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 34px;
}
.tw-service-contact-card {
min-height: 180px;
}
.tw-service-contact-grid--stack {
grid-template-columns: 1fr;
gap: 28px;
max-width: none;
margin-left: 0;
margin-right: 0;
justify-items: start;
}
.tw-service-contact-card--minimal {
min-height: 0;
padding-bottom: 20px;
border-bottom: 1px solid rgba(27, 36, 67, 0.1);
}
.tw-service-contact-card--minimal:last-child {
padding-bottom: 0;
border-bottom: 0;
}
.tw-service-contact-card--minimal h3 {
margin-bottom: 10px;
}
.tw-service-contact-email {
font-size: 16px;
line-height: 1.65;
word-break: break-all;
}
.tw-service-contact-email a {
color: var(--tw-primary);
text-decoration: none;
}
.tw-service-contact-email a:hover,
.tw-service-contact-email a:focus-visible {
color: #2148c8;
}
.tw-service-contact-email + .tw-service-contact-phone {
margin-top: 10px;
}
.tw-service-contact-phone {
font-size: 16px;
line-height: 1.65;
word-break: break-all;
}
.tw-service-contact-card--minimal .tw-service-contact-phone {
margin-top: 8px;
}
.tw-service-contact-phone a {
color: var(--tw-primary);
text-decoration: none;
}
.tw-service-contact-phone a:hover,
.tw-service-contact-phone a:focus-visible {
color: #2148c8;
}
.tw-service-contact-card h3 {
margin: 0 0 14px;
color: #1b2443;
font-size: 22px;
font-weight: 700;
line-height: 1.45;
}
.tw-service-contact-item {
display: flex;
align-items: flex-start;
gap: 10px;
color: #5c6370;
font-size: 15px;
line-height: 1.85;
}
.tw-service-contact-item + .tw-service-contact-item {
margin-top: 4px;
}
.tw-service-contact-item i {
width: 16px;
margin-top: 6px;
color: #9fa7ba;
}
/* 鍚堜綔妗堜緥椤碉細manifest銆屼互鍏ㄦ柊浠峰€尖€︺€?0px Bold锛涘垎琛屼笟鏍囬 38px Bold锛堜笌 .tw-service-heading 涓€鑷达級锛沴ogo 鏍?328脳151锛?5-鍚堜綔妗堜緥.psd锛?*/
.tw-case-page {
--tw-case-logo-cell-h: 11vw;
padding: 68px 0 92px;
background: #f7f8fb;
}
.tw-case-page > .container {
max-width: 80%;
}
.tw-case-intro {
margin-bottom: 32px;
text-align: center;
}
.tw-case-intro h2 {
margin: 0;
color: var(--tw-primary);
font-size: 50px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.02em;
}
/* 琛屼笟涓庤涓氫箣闂寸暀鐧斤紙鍚堜綔妗堜緥鍒楄〃鎸?industry 鍒嗙粍锛?*/
.tw-case-group + .tw-case-group {
margin-top: 96px;
}
.tw-case-group-heading {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 18px;
}
.tw-case-group-heading span {
width: 5px;
height: 36px;
border-radius: 999px;
background: var(--tw-primary);
flex-shrink: 0;
}
.tw-case-group-heading h3 {
margin: 0;
color: var(--tw-primary);
font-size: 38px;
font-weight: 700;
line-height: 1.1;
}
.tw-case-logo-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
grid-auto-rows: var(--tw-case-logo-cell-h);
gap: 16px 18px;
align-items: start;
}
.tw-case-logo-card {
box-sizing: border-box;
min-width: 0;
height: var(--tw-case-logo-cell-h);
max-height: var(--tw-case-logo-cell-h);
overflow: hidden;
background: transparent;
border: 0;
box-shadow: none;
}
.tw-case-logo-card.is-placeholder {
background: transparent;
border: 0;
box-shadow: none;
pointer-events: none;
}
.tw-case-logo-card .tw-case-logo-body {
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
width: 100%;
height: 100%;
padding: 12px 16px;
overflow: hidden;
}
.tw-case-logo-card img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
object-position: center center;
}
.tw-case-logo-card span {
place-self: center;
max-width: 100%;
padding: 8px 10px;
color: #2d3550;
font-size: 14px;
font-weight: 600;
line-height: 1.5;
}
.tw-news-page-heading {
margin-bottom: 34px;
text-align: center;
}
.tw-news-page-kicker {
margin: 0 0 12px;
color: var(--tw-primary);
font-size: 14px;
font-weight: 600;
letter-spacing: 0.3em;
text-transform: uppercase;
}
.tw-news-page-heading h2 {
margin: 0;
color: #182033;
font-size: 40px;
font-weight: 700;
}
.tw-news-page-heading span {
display: inline-block;
margin-top: 10px;
color: #98a1b3;
font-size: 14px;
letter-spacing: 0.26em;
text-transform: uppercase;
}
.tw-news-filter-bar {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 36px;
padding: 24px 28px;
border-radius: 24px;
background: #fff;
box-shadow: 0 18px 48px rgba(17, 32, 79, 0.06);
}
.tw-news-ajax-region {
transition: opacity 0.2s ease;
}
.tw-news-ajax-region.is-loading {
opacity: 0.5;
pointer-events: none;
}
.tw-news-filter-bar-year {
justify-content: flex-start;
}
.tw-news-filter-form {
margin: 0;
}
.tw-news-filter-select {
position: relative;
display: inline-flex;
align-items: center;
min-width: 180px;
}
.tw-news-filter-select select {
width: 100%;
min-height: 48px;
padding: 0 42px 0 16px;
border: 1px solid #d9deea;
border-radius: 8px;
background: #fff;
color: #17233c;
font-size: 14px;
appearance: none;
cursor: pointer;
}
.tw-news-filter-select i {
position: absolute;
right: 16px;
color: #7d879d;
pointer-events: none;
}
.tw-filter-tabs {
display: flex;
align-items: center;
justify-content: center;
gap: 28px;
flex-wrap: wrap;
}
.tw-filter-tab {
position: relative;
padding: 4px 0 10px;
color: #98a1b3;
font-size: 14px;
font-weight: 500;
transition: color 0.25s ease;
}
.tw-filter-tab::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 2px;
border-radius: 999px;
background: transparent;
transition: background 0.25s ease;
}
.tw-filter-tab:hover,
.tw-filter-tab.is-active {
color: var(--tw-primary);
}
.tw-filter-tab.is-active::after {
background: var(--tw-primary);
}
.tw-news-list-wrap {
display: grid;
gap: 26px;
}
.tw-news-story-card {
display: grid;
grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
min-height: 276px;
border-radius: 28px;
overflow: hidden;
background: #fff;
box-shadow: 0 24px 60px rgba(17, 32, 79, 0.08);
}
.tw-news-story-media {
position: relative;
display: block;
min-height: 276px;
overflow: hidden;
}
.tw-news-story-media img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.4s ease;
}
.tw-news-story-card:hover .tw-news-story-media img {
transform: scale(1.05);
}
.tw-news-story-body {
display: flex;
flex-direction: column;
justify-content: center;
padding: 34px 40px;
}
.tw-news-story-meta {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
margin-bottom: 18px;
color: #7d879d;
font-size: 14px;
}
.tw-news-story-meta em {
padding: 6px 14px;
border-radius: 999px;
background: rgba(33, 88, 255, 0.08);
color: var(--tw-primary);
font-style: normal;
}
.tw-news-story-body h3 {
margin: 0 0 14px;
color: #17233c;
font-size: 28px;
line-height: 1.45;
font-weight: 700;
}
.tw-news-story-body h3 a {
color: inherit;
}
.tw-news-story-body p {
margin: 0;
color: #667085;
font-size: 15px;
line-height: 1.9;
}
.tw-news-story-more {
display: inline-flex;
align-items: center;
gap: 10px;
margin-top: 24px;
color: var(--tw-primary);
font-size: 15px;
font-weight: 600;
}
.tw-media-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 28px;
}
.tw-media-card {
border-radius: 24px;
overflow: hidden;
background: #fff;
box-shadow: 0 24px 60px rgba(17, 32, 79, 0.08);
transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.tw-media-card:hover {
transform: translateY(-6px);
box-shadow: 0 28px 70px rgba(17, 32, 79, 0.14);
}
.tw-media-card-link {
display: block;
color: inherit;
}
.tw-media-card-cover {
position: relative;
aspect-ratio: 1 / 0.68;
overflow: hidden;
background: #edf1f7;
}
.tw-media-card-cover img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.4s ease;
}
.tw-media-card:hover .tw-media-card-cover img {
transform: scale(1.06);
}
.tw-media-play {
position: absolute;
top: 50%;
left: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
width: 74px;
height: 74px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.9);
color: var(--tw-primary);
font-size: 22px;
transform: translate(-50%, -50%);
box-shadow: 0 16px 36px rgba(0, 0, 0, 0.18);
}
.tw-media-play i {
margin-left: 4px;
}
.tw-media-card-body {
padding: 24px 24px 28px;
}
.tw-media-card-meta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 14px;
}
.tw-media-card-meta span {
display: inline-flex;
align-items: center;
min-height: 32px;
padding: 4px 14px;
border-radius: 999px;
background: rgba(33, 88, 255, 0.08);
color: var(--tw-primary);
font-size: 13px;
font-weight: 600;
}
.tw-media-card-meta em {
color: #9099ab;
font-size: 13px;
font-style: normal;
}
.tw-media-card-body h3 {
min-height: 68px;
margin: 0 0 12px;
color: #17233c;
font-size: 22px;
line-height: 1.55;
font-weight: 700;
}
.tw-media-card-body p {
margin: 0;
color: #667085;
font-size: 14px;
line-height: 1.85;
}
.page-content.tw-news-detail-page {
padding-top: 22px;
}
.tw-news-detail-card .card-body {
padding: 48px 56px 56px;
}
.tw-news-detail-subtitle {
display: inline-flex;
align-items: center;
min-height: 36px;
margin: 0 0 24px;
padding: 6px 16px;
border-radius: 999px;
background: rgba(33, 88, 255, 0.08);
color: var(--tw-primary);
font-size: 14px;
font-weight: 600;
}
.tw-news-qrcode-panel {
display: none;
}
.tw-news-detail-player {
margin: 14px 0 36px;
}
.tw-news-detail-player video {
display: block;
width: 100%;
max-height: 620px;
aspect-ratio: var(--tw-video-ar, 16 / 9);
border-radius: 24px;
background: #000;
box-shadow: 0 20px 50px rgba(16, 24, 40, 0.16);
}
.tw-news-detail-content {
color: #344054;
font-size: 16px;
line-height: 1.95;
}
.tw-news-detail-content > *:first-child {
margin-top: 0;
}
.tw-news-detail-content img,
.tw-news-detail-content video,
.tw-news-detail-content iframe {
max-width: 100%;
border-radius: 18px;
}
.tw-news-detail-content video,
.tw-news-detail-content iframe {
display: block;
width: 100%;
min-height: 0;
aspect-ratio: var(--tw-video-ar, 16 / 9);
margin: 24px auto;
background: #000;
}
.tw-news-detail-content p {
margin-bottom: 18px;
}
.tw-news-detail-content h2,
.tw-news-detail-content h3,
.tw-news-detail-content h4 {
margin-top: 30px;
margin-bottom: 16px;
color: #182033;
font-weight: 700;
}
.tw-news-page .page-pagination {
margin-top: 40px;
}
@media (max-width: 1199.98px) {
.page-banner--manifest .page-banner-content,
.page-banner--service-support .page-banner-content {
top: 28%;
left: 48px;
max-width: min(640px, calc(100% - 96px));
}
.page-banner--manifest .page-banner-content h1,
.page-banner--service-support .page-banner-content h1 {
font-size: clamp(44px, 5vw, 64px);
}
.page-banner--manifest .page-banner-content .page-banner-ename,
.page-banner--service-support .page-banner-content .page-banner-ename {
margin-top: 22px;
font-size: clamp(18px, 2vw, 28px);
}
/* 瑕嗙洊 style.min 鍦?鈮?199 灏?.page-banner 鍘嬫垚 250px */
.page-banner.page-banner--manifest,
.page-banner.page-banner--service-support {
height: auto !important;
min-height: 400px;
}
.tw-service-card {
padding: 44px 42px 56px;
}
.tw-service-process-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 24px;
}
.tw-news-story-card {
grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
}
.tw-media-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 991.98px) {
/* 瑕嗙洊 style.min 鍦?鈮?91 灏?.page-banner 鍘嬫垚 220px */
.page-banner.page-banner--manifest,
.page-banner.page-banner--service-support {
height: auto !important;
min-height: 340px;
}
.page-banner--manifest .page-banner-content,
.page-banner--service-support .page-banner-content {
top: 27%;
left: 28px;
}
.tw-service-card {
padding: 34px 24px 42px;
}
.tw-service-section + .tw-service-section {
margin-top: 40px;
padding-top: 34px;
}
.tw-service-heading {
margin-bottom: 24px;
}
.tw-service-heading h2 {
font-size: 32px;
}
.tw-service-heading p {
font-size: 16px;
}
.tw-service-process-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.tw-service-contact-grid {
grid-template-columns: 1fr;
gap: 24px;
}
.tw-case-page {
--tw-case-logo-cell-h: 120px;
padding: 60px 0 80px;
}
.tw-case-group + .tw-case-group {
margin-top: 72px;
}
.tw-case-intro h2 {
font-size: 36px;
}
.tw-case-group-heading h3 {
font-size: 28px;
}
.tw-case-group-heading span {
height: 30px;
}
.tw-case-logo-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 20px 24px;
}
.tw-news-page {
padding: 64px 0 80px;
}
.tw-news-filter-bar {
padding: 18px 20px;
margin-bottom: 28px;
}
.tw-news-page-heading h2 {
font-size: 32px;
}
.tw-news-story-card {
grid-template-columns: 1fr;
}
.tw-news-story-media {
min-height: 240px;
}
.tw-news-story-body {
padding: 28px 26px 30px;
}
.tw-news-story-body h3 {
font-size: 24px;
}
.tw-news-detail-card .card-body {
padding: 34px 26px 38px;
}
}
@media (max-width: 767.98px) {
.page-banner.page-banner--manifest,
.page-banner.page-banner--service-support {
height: auto !important;
min-height: 260px;
}
.page-banner--manifest .page-banner-content,
.page-banner--service-support .page-banner-content {
top: 26%;
left: 20px;
max-width: calc(100% - 40px);
}
.page-banner--manifest .page-banner-content h1,
.page-banner--service-support .page-banner-content h1 {
font-size: clamp(28px, 8vw, 36px);
}
.page-banner--manifest .page-banner-content .page-banner-ename,
.page-banner--service-support .page-banner-content .page-banner-ename {
margin-top: 14px;
font-size: clamp(14px, 3.5vw, 18px);
}
.tw-service-page {
padding: 28px 0 64px;
}
.tw-service-heading h2 {
font-size: 26px;
}
.tw-service-heading p {
font-size: 15px;
}
.tw-service-process-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 20px 16px;
}
.tw-service-step-icon {
width: 110px;
height: 110px;
padding-top: 18px;
font-size: 32px;
}
.tw-service-step h3 {
margin-top: -32px;
font-size: 15px;
}
.tw-service-step strong {
font-size: 32px;
}
.tw-case-intro {
margin-bottom: 24px;
}
.tw-case-intro h2 {
font-size: clamp(20px, 5.2vw, 26px);
line-height: 1.35;
}
.tw-case-group-heading h3 {
font-size: 20px;
}
.tw-case-group-heading span {
width: 4px;
height: 22px;
}
.tw-case-group + .tw-case-group {
margin-top: 56px;
}
.tw-case-page {
--tw-case-logo-cell-h: 96px;
}
.tw-case-logo-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px 14px;
}
.tw-news-filter-bar,
.tw-news-filter-bar-year {
justify-content: flex-start;
}
.tw-news-filter-select {
width: 100%;
min-width: 0;
}
.tw-filter-tabs {
gap: 18px;
justify-content: flex-start;
}
.tw-media-grid {
grid-template-columns: 1fr;
gap: 22px;
}
.tw-news-page-heading {
margin-bottom: 26px;
}
.tw-news-page-heading h2 {
font-size: 28px;
}
.tw-news-story-meta,
.tw-media-card-meta {
font-size: 13px;
}
.tw-news-story-body h3 {
font-size: 21px;
}
.tw-media-card-body h3 {
min-height: 0;
font-size: 20px;
}
.tw-news-detail-content {
font-size: 15px;
}
.page-content.tw-news-detail-page {
padding-top: 16px;
}
.tw-news-detail-content video,
.tw-news-detail-content iframe {
min-height: 220px;
}
}
/* style.min 鍦?鈮?75 灏?.page-banner 鍘嬫垚 180px */
@media (max-width: 575.98px) {
.page-banner.page-banner--manifest,
.page-banner.page-banner--service-support {
height: auto !important;
min-height: 200px;
}
}
/*
* 浜烘墠鎷涘嫙鏁撮〉 鈥?瀵煎嚭/06-浜烘墠鎷涘嫙/manifest.json
* 瀛椾綋锛歋ource Han Sans SC锛堜笌 PSD SourceHanSansCN Normal/Bold 瀵瑰簲锛? * Banner 楂樺害锛氳璁＄绾?500鈥?60px锛堝ぇ灞忥級锛屽弻鍗″彔鍏ョ害 56鈥?0px
* 涓绘爣棰?鑻辨枃宸︿笂锛涖€屽姞鍏ユ垜浠€嶄笅涓夊垎涔嬩竴鍖恒€佷笌宸﹀崱鍚屽垪瀹藉苟鍙冲榻愶紙涓庨寮犲崱鐗囧彸缂樺榻愶級
* 銆屼俊銆嶇櫧鍗★細鏍囬 Bold 32px / 姝ｆ枃 Regular 18px / 琛岃窛鈮?.7锛涙鏂囪壊 rgb(126,126,126) 涓庝骇鍝佹湇鍔″瘜鏂囨湰涓€鑷? */
.tw-recruit {
/* 璁捐锛欻ero 鍖虹害鍗犻灞?45%鈥?0% 楂橈紝钀藉湴绾?540鈥?60px */
--r6-hero-h: min(560px, 52vh);
--r6-overlap: 80px;
--r6-band-max: 1203px;
/* 涓?.tw-recruit-panels 涓€鑷达紱鈮?199 涓庡獟浣撴煡璇㈠唴 gap 鍚屾 */
--r6-panels-gap: 61px;
/* manifest锛歋ourceHanSansCN锛堟鏂?Regular / 鏍囬 Bold锛夆啋 椤圭洰鍐呮€濇簮榛戜綋 */
font-family: "Source Han Sans SC", "Source Han Sans CN", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
/* 鍙屽崱鍖轰笌涓嬫柟姝ｆ枃鍖哄悓涓€娴呯伆搴曪紱鍕夸粎缁?.tw-recruit-main 涓婅壊锛屽惁鍒欏弻鍗′笌涓や晶閫忓嚭 body 鐧藉簳 */
background-color: #eef1f6;
}
.tw-recruit-hero {
position: relative;
z-index: 1;
overflow: hidden;
height: var(--r6-hero-h);
min-height: min(560px, 52vh);
background: #3a5080;
/* 閬垮厤瀛愮骇璐?margin 涓庡厔寮熸姌鍙犳椂鍙犲眰澶辨晥 */
isolation: isolate;
}
.tw-recruit-hero-bg {
position: absolute;
inset: 0;
z-index: 0;
}
.tw-recruit-hero-bg img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
display: block;
}
.tw-recruit-hero-wrap {
position: relative;
z-index: 1;
box-sizing: border-box;
max-width: 1920px;
height: 100%;
margin: 0 auto;
padding: 0;
}
/* 鏍囬鍖猴細鐩稿澶у浘椤?142/773銆佸乏 248/1920锛坢anifest锛?*/
.tw-recruit-hero-head {
position: absolute;
top: 18.37%;
left: 12.92%;
max-width: 640px;
margin: 0;
color: #fff;
}
.tw-recruit-hero-head h1 {
margin: 0;
/* manifest 澶у浘/浜烘墠鎷涘嫙锛氱害 81px锛堟€濇簮榛戜綋 Normal锛?*/
font-size: clamp(40px, 4.2vw, 81px);
font-weight: 400;
line-height: 1.12;
letter-spacing: 0;
text-shadow: 0 2px 24px rgba(0, 0, 0, 0.35);
}
.tw-recruit-hero-en {
/* 涓庝笅鏂广€屽姞鍏ユ垜浠€嶆媺寮€绾?40鈥?0px 瑙嗚闂磋窛锛堥殢瀛楀彿鐣ュ彉锛?*/
margin: 20px 0 0;
/* manifest 澶у浘/RECRUITMENT锛氱害 34.5px */
font-size: clamp(20px, 1.8vw, 35px);
font-weight: 400;
line-height: 1.1;
letter-spacing: 0.08em;
text-transform: none;
color: rgba(255, 255, 255, 0.92);
text-shadow: 0 1px 16px rgba(0, 0, 0, 0.3);
}
/* 鍙崇紭涓庨寮犲崱鐗囧彸缂樺榻愶細鍕跨敤銆屽乏鍒楀搴︺€嶄綔 width锛屽惁鍒欐暣鍙ョ暐瀹戒細鍙墿涓€涓瓧鍦ㄧ浜岃 */
.tw-recruit-hero-lead {
position: absolute;
top: 66%;
left: auto;
right: calc(50% + var(--r6-panels-gap) / 2);
z-index: 2;
box-sizing: border-box;
width: max-content;
max-width: calc(50% - var(--r6-panels-gap) / 2 - 15px);
margin: 0;
padding: 0;
font-size: clamp(20px, 1.55vw, 28px);
font-weight: 400;
line-height: 1.55;
letter-spacing: 0.02em;
color: #fff;
text-align: right;
text-shadow: 0 2px 20px rgba(0, 0, 0, 0.35);
}
/* 鍙屽崱鍗曠嫭涓€灞傦紱娴呯伆搴曠敱 .tw-recruit 缁熶竴閾鸿壊锛屼笌 .tw-recruit-main 涓€鑷?*/
.tw-recruit-panels-band {
position: relative;
z-index: 3;
margin-top: calc(-1 * var(--r6-overlap));
}
.tw-recruit-panels-band .container {
max-width: var(--r6-band-max);
}
.tw-recruit-panels {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 61px;
}
.tw-recruit-main {
position: relative;
z-index: 2;
padding: 0 0 96px;
}
.tw-recruit-main .container {
max-width: var(--r6-band-max);
}
.tw-recruit-panel {
position: relative;
display: flex;
align-items: stretch;
justify-content: space-between;
gap: 20px;
box-sizing: border-box;
min-height: 288px;
padding: 45px 40px 40px 49px;
overflow: hidden;
border-radius: 22px;
background: #fff;
box-shadow: 0 22px 56px rgba(17, 32, 79, 0.12);
}
.tw-recruit-panel-body {
display: flex;
flex-direction: column;
flex: 1;
min-width: 0;
max-width: 280px;
}
.tw-recruit-panel-body h2 {
margin: 0;
color: #1e2f7a;
/* manifest 鏍″洯/绀句細鎷涜仒鏍囬琛岋細Bold 鈮?6px */
font-size: 56px;
font-weight: 700;
line-height: 1.1;
}
.tw-recruit-panel-body > p {
margin: 12px 0 0;
color: rgb(126, 126, 126);
/* manifest 鍓爣棰橈細Regular 18px */
font-size: 18px;
font-weight: 400;
line-height: 1.55;
}
.tw-recruit-panel-more {
display: inline-flex;
align-items: center;
gap: 8px;
align-self: flex-start;
margin-top: auto;
padding: 10px 18px;
border: 1px solid #e2e6ef;
border-radius: 999px;
background: #fff;
color: #8b92a8;
/* manifest 鏌ョ湅璇︽儏锛歊egular 16px */
font-size: 16px;
font-weight: 400;
text-decoration: none;
transition:
color 0.2s ease,
border-color 0.2s ease,
background 0.2s ease;
}
.tw-recruit-panel-more:hover {
color: var(--tw-primary, #2158ff);
border-color: rgba(33, 88, 255, 0.35);
background: rgba(33, 88, 255, 0.04);
}
.tw-recruit-panel-icon {
flex-shrink: 0;
align-self: flex-end;
color: #ccc;
font-size: 72px;
line-height: 1;
}
.tw-recruit-story {
position: relative;
margin-top: 64px;
/* manifest銆屼俊銆嶇櫧鍗＄墖锛氬ぇ鍐呰竟璺濄€佽交闃村奖 */
padding: 52px 56px 60px 52px;
overflow: hidden;
border-radius: 18px;
background: #fff;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.06);
}
.tw-recruit-story-hd {
margin-bottom: 28px;
}
.tw-recruit-story-hd h2 {
margin: 0;
color: #1d3557;
/* manifest锛氭爣棰?Bold 32px */
font-size: 32px;
font-weight: 700;
line-height: 1.25;
}
.tw-recruit-story-bd {
max-width: 920px;
color: rgb(126, 126, 126);
}
.tw-recruit-story-bd p {
margin: 0;
/* manifest锛氭鏂?Regular 18px锛岃璺濈害 48.5px 鈫?line-height 鈮?2.7 */
font-size: 18px;
font-weight: 400;
line-height: 1.7;
}
.tw-recruit-story-bd strong,
.tw-recruit-story-bd b {
color: rgb(126, 126, 126);
font-weight: 600;
}
.tw-recruit-story-bd p + p {
margin-top: 1em;
}
.tw-recruit-story-ico {
position: absolute;
right: 40px;
bottom: 32px;
color: #e2e5ec;
font-size: 56px;
line-height: 1;
}
@media (max-width: 1399.98px) {
.tw-recruit-hero-head {
left: 120px;
top: 120px;
}
.tw-recruit-hero-lead {
top: 64%;
font-size: clamp(20px, 1.55vw, 28px);
font-weight: 400;
}
}
@media (max-width: 1199.98px) {
.tw-recruit {
--r6-hero-h: min(480px, 48vh);
--r6-overlap: 72px;
--r6-panels-gap: 32px;
}
.tw-recruit-hero {
min-height: min(480px, 48vh);
}
.tw-recruit-hero-head {
left: 48px;
top: 88px;
}
.tw-recruit-hero-head h1 {
font-size: 52px;
}
.tw-recruit-hero-en {
font-size: 28px;
}
.tw-recruit-hero-lead {
top: 62%;
font-size: clamp(20px, 2vw, 26px);
font-weight: 400;
}
.tw-recruit-panels {
gap: 32px;
}
.tw-recruit-panel-body h2 {
font-size: 40px;
}
.tw-recruit-story {
padding: 40px 36px 48px;
}
}
@media (max-width: 991.98px) {
.tw-recruit {
--r6-hero-h: auto;
--r6-overlap: 80px;
}
.tw-recruit-hero {
height: auto;
min-height: 440px;
padding-bottom: 48px;
}
.tw-recruit-hero-wrap {
height: auto;
min-height: 400px;
}
.tw-recruit-hero-head {
position: relative;
left: auto;
top: auto;
max-width: none;
padding: 72px 28px 0;
}
.tw-recruit-hero-lead {
position: relative;
left: auto;
right: auto;
top: auto;
width: auto;
max-width: none;
margin: 40px 28px 0;
font-size: 19px;
font-weight: 400;
text-align: center;
}
.tw-recruit-panels {
grid-template-columns: 1fr;
gap: 20px;
}
.tw-recruit-panel {
min-height: 0;
}
.tw-recruit-panel-body h2 {
font-size: 34px;
}
}
@media (max-width: 767.98px) {
.tw-recruit {
--r6-overlap: 48px;
}
.tw-recruit-hero-head {
padding: 48px 20px 0;
}
.tw-recruit-hero-head h1 {
font-size: 34px;
}
.tw-recruit-hero-en {
margin-top: 16px;
font-size: 18px;
}
.tw-recruit-hero-lead {
margin: 24px 20px 0;
font-size: 15px;
line-height: 1.55;
font-weight: 400;
text-align: center;
}
.tw-recruit-main {
padding-bottom: 64px;
}
.tw-recruit-panel {
padding: 28px 22px 28px;
}
.tw-recruit-panel-body h2 {
font-size: 28px;
}
.tw-recruit-panel-body > p {
font-size: 15px;
}
.tw-recruit-panel-more {
font-size: 14px;
padding: 8px 14px;
}
.tw-recruit-panel-icon {
font-size: 56px;
}
.tw-recruit-story {
margin-top: 28px;
padding: 28px 22px 96px;
}
.tw-recruit-story-hd h2 {
font-size: 22px;
}
.tw-recruit-story-bd p {
font-size: 15px;
line-height: 1.9;
}
.tw-recruit-story-ico {
right: 20px;
bottom: 20px;
font-size: 48px;
}
}
/*
* 棣栭〉鍖哄潡鏍囬锛氫腑鏂囩浉瀵硅儗鍚庤嫳鏂囨按鍗帮紙NETWORK / HONOR锛夌暐涓嬬Щ銆佽交鍘嬪湪瀛楁瘝涓娿€? * 鏁板€煎疁灏忥紝杩囧ぇ鏄撲笌鑻辨枃鑴辫妭锛涘彲鎸夐渶寰皟 clamp 涓変釜鏁般€? */
#tw-global-network.tw-network .tw-section-title h2 {
transform: translateY(clamp(16px, 2.4vw, 34px)) !important;
}
#tw-home-honor.tw-honor--psd .tw-honor-heading h2 {
transform: translateY(clamp(16px, 2.4vw, 34px)) !important;
}