body { background: radial-gradient(circle at 50% 0px, rgba(128, 33, 10, 0.34), transparent 520px), linear-gradient(rgb(17, 9, 6) 0%, rgb(7, 5, 4) 48%, rgb(18, 9, 5) 100%); color: rgb(216, 195, 155); }

#bannerbox { left: 0px; justify-content: center; background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(7, 4, 3, 0.62) 84%, rgb(8, 5, 3) 100%); }

#banner { min-height: 820px; background: rgb(9, 6, 4); }

#banner::after { content: ""; position: absolute; inset: 0px; z-index: 4; pointer-events: none; background: linear-gradient(90deg, rgba(7, 4, 3, 0.72), transparent 22%, transparent 68%, rgba(7, 4, 3, 0.55)), radial-gradient(circle at 56% 68%, rgba(222, 88, 18, 0.22), transparent 310px), linear-gradient(transparent 66%, rgba(7, 4, 3, 0.68) 100%); }

.bannervideo { z-index: 2; opacity: 0.78; filter: saturate(1.14) contrast(1.08) brightness(0.86); }

#bannerbg { z-index: 1; filter: saturate(1.1) contrast(1.05) brightness(0.82); }

#logo { left: calc(50% - 505px); top: 30px; z-index: 20; overflow: visible; }

#logo img { filter: drop-shadow(rgba(0, 0, 0, 0.72) 0px 10px 18px) drop-shadow(rgba(255, 135, 34, 0.28) 0px 0px 18px); }

#banner .txt1 { right: auto; left: calc(50% + 250px); top: 48px; z-index: 18; filter: drop-shadow(rgba(0, 0, 0, 0.78) 0px 15px 28px) drop-shadow(rgba(255, 118, 24, 0.18) 0px 0px 18px); }

#banner .txt2 { right: auto; left: calc(50% + 125px); top: 286px; z-index: 18; filter: drop-shadow(rgba(0, 0, 0, 0.72) 0px 10px 18px); }

.readmore { z-index: 20; bottom: 74px; filter: drop-shadow(rgba(255, 128, 34, 0.3) 0px 0px 14px); }

.hero-slogan { position: absolute; left: calc(50% - 170px); top: 650px; z-index: 22; height: 44px; padding: 0px 26px; line-height: 44px; color: rgb(255, 231, 176); font-size: 18px; font-weight: 700; text-shadow: rgb(0, 0, 0) 0px 2px 4px; background: linear-gradient(90deg, rgba(38, 19, 9, 0.12), rgba(38, 19, 9, 0.86) 16%, rgba(38, 19, 9, 0.86) 84%, rgba(38, 19, 9, 0.12)), linear-gradient(rgba(128, 66, 20, 0.78), rgba(38, 18, 8, 0.82)); border-top: 1px solid rgba(255, 207, 124, 0.42); border-bottom: 1px solid rgba(115, 54, 19, 0.8); box-shadow: rgba(0, 0, 0, 0.38) 0px 14px 32px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset; white-space: nowrap; }

.navlist { left: calc(50% - 585px); top: 230px; background: linear-gradient(rgba(35, 21, 12, 0.94), rgba(10, 7, 5, 0.94)), url("../images/bg-topnavbox.png") center top repeat-x; border: 1px solid rgba(205, 139, 62, 0.5); box-shadow: rgba(0, 0, 0, 0.52) 0px 20px 46px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset; }

.navlist a { color: rgb(255, 232, 189); background: linear-gradient(rgba(113, 59, 19, 0.62), rgba(27, 14, 8, 0.82)), url("../images/bg-topnav.png") center bottom no-repeat; border-left: 1px solid rgba(226, 164, 85, 0.18); border-right: 1px solid rgba(226, 164, 85, 0.18); }

.navlist a.current, .navlist a:hover { color: rgb(255, 255, 255); background: radial-gradient(circle, rgba(255, 123, 28, 0.22), transparent 64%), url("../images/bg-topnav-hover.png") center center no-repeat; }

#boxIOS, #boxAndroid { border: 1px solid rgba(226, 164, 85, 0.45); box-shadow: rgba(0, 0, 0, 0.42) 0px 14px 28px; }

#cadpa { left: calc(50% - 576px); z-index: 24; }

.mainboxtop { height: 0px; }

.school-section { min-width: 1200px; padding: 62px 0px 68px; background: linear-gradient(rgb(9, 6, 4) 0%, rgb(21, 11, 6) 48%, rgb(8, 5, 4) 100%), radial-gradient(circle at 50% 8%, rgba(178, 68, 15, 0.2), transparent 430px); border-top: 1px solid rgba(183, 103, 35, 0.28); border-bottom: 1px solid rgba(183, 103, 35, 0.18); }

.school-wrap { width: 1200px; margin: 0px auto; }

.school-title { text-align: center; margin-bottom: 32px; }

.school-title h2 { color: rgb(255, 223, 163); font-size: 46px; line-height: 1.2; font-weight: 800; text-shadow: rgba(0, 0, 0, 0.72) 0px 4px 14px, rgba(255, 106, 24, 0.24) 0px 0px 18px; }

.school-title h2::before, .school-title h2::after { content: ""; display: inline-block; width: 110px; height: 1px; margin: 0px 22px 13px; background: linear-gradient(90deg, transparent, rgba(235, 177, 93, 0.78), transparent); }

.school-title p { margin-top: 10px; color: rgb(205, 176, 131); font-size: 17px; line-height: 28px; }

.school-list { display: flex; gap: 18px; }

.school-role { flex: 1 1 0%; position: relative; padding: 24px 22px 22px; background: linear-gradient(rgba(39, 23, 13, 0.94), rgba(9, 6, 4, 0.96)); border: 1px solid rgba(202, 132, 55, 0.38); box-shadow: rgba(0, 0, 0, 0.38) 0px 18px 42px, rgba(255, 255, 255, 0.035) 0px 0px 0px 1px inset; }

.school-role::before { content: ""; position: absolute; left: 16px; right: 16px; top: 10px; height: 1px; background: linear-gradient(90deg, transparent, rgba(255, 211, 135, 0.52), transparent); }

.school-role h3 { margin-bottom: 18px; color: rgb(255, 240, 200); font-size: 30px; line-height: 1.2; text-align: center; text-shadow: rgba(0, 0, 0, 0.68) 0px 3px 10px; }

.school-build { min-height: 150px; padding: 17px 16px 16px; margin-top: 14px; background: rgba(0, 0, 0, 0.28); border: 1px solid rgba(206, 137, 61, 0.22); }

.school-build h4 { margin-bottom: 10px; color: rgb(255, 198, 111); font-size: 22px; line-height: 1.2; }

.school-build p { color: rgb(199, 178, 142); font-size: 14px; line-height: 25px; }

.school-build b { color: rgb(240, 208, 153); }

.role-warrior { background: radial-gradient(circle at 50% 0px, rgba(215, 72, 22, 0.2), transparent 190px), linear-gradient(rgba(39, 23, 13, 0.94), rgba(9, 6, 4, 0.96)); }

.role-mage { background: radial-gradient(circle at 50% 0px, rgba(198, 95, 20, 0.18), transparent 190px), linear-gradient(rgba(39, 23, 13, 0.94), rgba(9, 6, 4, 0.96)); }

.role-taoist { background: radial-gradient(circle at 50% 0px, rgba(165, 112, 42, 0.18), transparent 190px), linear-gradient(rgba(39, 23, 13, 0.94), rgba(9, 6, 4, 0.96)); }

.show { background: linear-gradient(rgba(10, 6, 4, 0.96), rgba(17, 9, 5, 0.94)), url("../images/bg-tese.jpg") center top no-repeat; border-top: 1px solid rgba(183, 103, 35, 0.16); }

.title-show { height: 98px; background: none; text-align: center; }

.title-show::before { content: "装备打造"; display: block; color: rgb(255, 223, 163); font-size: 44px; line-height: 52px; font-weight: 800; text-shadow: rgba(0, 0, 0, 0.72) 0px 4px 14px, rgba(255, 106, 24, 0.24) 0px 0px 18px; }

.title-show::after { content: "极品锻造，鉴定附魔，品质升华，装备越刷越有追求。"; display: block; margin-top: 8px; color: rgb(205, 176, 131); font-size: 17px; }

.zb-wrap .swiper-slide { background: linear-gradient(rgba(35, 22, 13, 0.94), rgba(8, 6, 5, 0.96)); border: 1px solid rgba(204, 136, 58, 0.36); box-shadow: rgba(0, 0, 0, 0.36) 0px 18px 36px; }

.zb-wrap .swiper-slide > img { width: auto; max-width: 100%; height: auto; max-height: 603px; }

.jietu { background: linear-gradient(rgba(8, 5, 4, 0.9), rgba(8, 5, 4, 0.86)), url("../images/bg-jietu.jpg") center top no-repeat; border-top: 1px solid rgba(183, 103, 35, 0.18); }

.title-jietu { height: 98px; background: none; text-align: center; }

.title-jietu::before { content: "热血战斗"; display: block; color: rgb(255, 223, 163); font-size: 44px; line-height: 52px; font-weight: 800; text-shadow: rgba(0, 0, 0, 0.72) 0px 4px 14px, rgba(255, 106, 24, 0.24) 0px 0px 18px; }

.title-jietu::after { content: "刺激战斗，无兄弟不热血"; display: block; margin-top: 8px; color: rgb(205, 176, 131); font-size: 17px; }

.pb-carouselWarp { background: linear-gradient(rgba(32, 20, 12, 0.94), rgba(6, 5, 4, 0.96)); border: 1px solid rgba(204, 136, 58, 0.36); box-shadow: rgba(0, 0, 0, 0.42) 0px 20px 44px; }

.pb-carouselWarp > ul > img { display: none; }

.pb-carouselWarp .pb-carousel-2 li img { width: auto; max-width: 600px; height: auto; max-height: 770px; }

#footer { background: linear-gradient(rgb(8, 5, 3), rgb(3, 2, 2)); border-top: 1px solid rgba(183, 103, 35, 0.2); }

.copyright a { color: rgb(216, 195, 155); }

.fixedbox .h5bar { background: linear-gradient(rgba(34, 20, 11, 0.94), rgba(5, 4, 3, 0.94)); border: 1px solid rgba(205, 139, 62, 0.48); box-shadow: rgba(0, 0, 0, 0.46) 0px 18px 42px, rgba(255, 255, 255, 0.04) 0px 0px 0px 1px inset; }

.fixedbox div { color: rgb(199, 178, 142); }

.fixedbox .kefutime, .fixedbox .code p { color: rgb(255, 223, 163); }

.fixedbox .code div { border: 1px solid rgba(205, 139, 62, 0.38); }

.h5open, .h5close { background: linear-gradient(rgba(117, 61, 20, 0.92), rgba(37, 18, 8, 0.95)), url("../images/btn.png") center top no-repeat; border: 1px solid rgba(205, 139, 62, 0.45); }

@media screen and (min-width: 768px) and (max-width: 1600px) {
  .navlist { left: calc(50% - 585px); }
}

#banner::after { background: linear-gradient(90deg, rgba(7, 4, 3, 0.56), transparent 24%, transparent 70%, rgba(7, 4, 3, 0.42)), radial-gradient(circle at 58% 66%, rgba(232, 94, 20, 0.26), transparent 340px), linear-gradient(transparent 70%, rgba(7, 4, 3, 0.56) 100%); }

.bannervideo { opacity: 0.86; filter: saturate(1.18) contrast(1.08) brightness(0.92); }

.hero-slogan { background: linear-gradient(90deg, rgba(31, 15, 7, 0.06), rgba(52, 24, 9, 0.92) 18%, rgba(72, 31, 9, 0.92) 50%, rgba(52, 24, 9, 0.92) 82%, rgba(31, 15, 7, 0.06)), linear-gradient(rgba(170, 83, 24, 0.7), rgba(39, 17, 7, 0.86)); border-top-color: rgba(255, 210, 125, 0.58); color: rgb(255, 240, 191); }

.navlist { border-color: rgba(214, 150, 70, 0.58); }

.navlist a { transition: color 0.18s, border-color 0.18s, box-shadow 0.18s, filter 0.18s; border-color: rgba(170, 112, 48, 0.24); }

.navlist a.current { color: rgb(255, 247, 220); background: linear-gradient(rgba(133, 68, 20, 0.82), rgba(47, 20, 8, 0.92)), url("../images/bg-topnav-hover.png") center center no-repeat; border-color: rgba(255, 204, 122, 0.58); box-shadow: rgba(255, 137, 34, 0.18) 0px 0px 18px inset, rgba(255, 100, 22, 0.18) 0px 0px 22px; }

.navlist a:hover { color: rgb(255, 245, 214); background: linear-gradient(rgba(123, 65, 22, 0.68), rgba(35, 17, 8, 0.86)), url("../images/bg-topnav.png") center bottom no-repeat; border-color: rgba(244, 183, 92, 0.48); box-shadow: rgba(255, 160, 58, 0.12) 0px 0px 12px inset, rgba(255, 105, 24, 0.12) 0px 0px 15px; filter: brightness(1.08); }

.school-section { padding-top: 76px; background: radial-gradient(circle at 50% 0px, rgba(138, 85, 38, 0.2), transparent 360px), linear-gradient(rgb(11, 7, 5) 0%, rgb(28, 17, 11) 46%, rgb(10, 6, 4) 100%); }

.school-title h2 { color: rgb(242, 211, 155); font-size: 48px; }

.school-title h2::before, .school-title h2::after { width: 86px; background: linear-gradient(90deg, transparent, rgba(180, 123, 62, 0.9), transparent); }

.school-title p { color: rgb(189, 164, 125); }

.school-list { gap: 20px; }

.school-role { overflow: hidden; padding: 26px 20px 22px; background: linear-gradient(rgba(42, 28, 18, 0.96), rgba(9, 6, 5, 0.98)); border-color: rgba(171, 113, 54, 0.46); }

.school-role::after { content: ""; position: absolute; left: -60px; right: -60px; top: -90px; height: 170px; background: radial-gradient(circle, rgba(255, 152, 48, 0.16), transparent 66%); pointer-events: none; }

.role-mark { position: relative; z-index: 1; width: 66px; height: 66px; margin: 0px auto 10px; border-radius: 50%; background: radial-gradient(circle at 50% 38%, rgba(255, 210, 132, 0.28), rgba(122, 67, 26, 0.16) 42%, rgba(0, 0, 0, 0.42) 70%), linear-gradient(rgba(120, 75, 38, 0.5), rgba(16, 11, 8, 0.9)); border: 1px solid rgba(221, 160, 82, 0.5); box-shadow: rgba(255, 154, 52, 0.12) 0px 0px 18px inset, rgba(0, 0, 0, 0.46) 0px 0px 18px; }

.role-mark::before { content: ""; position: absolute; inset: 17px; border: 1px solid rgba(255, 213, 139, 0.42); transform: rotate(45deg); }

.school-role h3 { position: relative; z-index: 1; margin-bottom: 16px; font-size: 32px; }

.school-build { position: relative; z-index: 1; min-height: 178px; padding: 18px 15px 15px 82px; background: linear-gradient(rgba(8, 6, 5, 0.72), rgba(23, 14, 9, 0.68)); border-color: rgba(160, 100, 45, 0.32); }

.school-build::before { content: ""; position: absolute; left: 14px; top: 14px; bottom: 14px; width: 1px; background: linear-gradient(transparent, rgba(238, 169, 87, 0.6), transparent); }

.build-badge { position: absolute; left: 22px; top: 22px; width: 42px; height: 42px; background: radial-gradient(circle at 50% 42%, rgba(255, 220, 148, 0.32), rgba(116, 62, 24, 0.2) 45%, rgba(0, 0, 0, 0.48) 74%); border: 1px solid rgba(222, 159, 79, 0.52); transform: rotate(45deg); box-shadow: rgba(0, 0, 0, 0.42) 0px 0px 14px; }

.build-badge::after { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(255, 221, 148, 0.38); }

.school-build h4 { margin-bottom: 8px; color: rgb(255, 210, 138); font-size: 24px; }

.build-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0px 0px 10px; }

.build-tags span { height: 22px; padding: 0px 8px; line-height: 22px; color: rgb(246, 213, 155); font-size: 12px; background: rgba(111, 56, 19, 0.45); border: 1px solid rgba(211, 142, 62, 0.28); }

.school-build p { display: flex; gap: 8px; font-size: 13px; line-height: 23px; }

.school-build b { position: relative; flex: 0 0 34px; color: rgb(232, 191, 124); }

.school-build p b::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0px 6px 1px 0px; background: rgb(181, 106, 37); box-shadow: rgba(255, 126, 35, 0.32) 0px 0px 8px; transform: rotate(45deg); }

.school-build p span { flex: 1 1 0%; color: rgb(201, 180, 143); }

.show { background: radial-gradient(circle at 50% 100px, rgba(224, 90, 20, 0.19), transparent 430px), linear-gradient(rgba(12, 7, 4, 0.98), rgba(32, 14, 7, 0.95) 54%, rgba(9, 6, 4, 0.98)), url("../images/bg-tese.jpg") center top no-repeat; }

.title-show::before { color: rgb(255, 208, 136); text-shadow: rgba(0, 0, 0, 0.74) 0px 5px 16px, rgba(255, 95, 18, 0.32) 0px 0px 22px; }

.title-show::after { color: rgb(211, 170, 118); }

.zb-wrap .swiper-slide { border-color: rgba(223, 132, 52, 0.5); box-shadow: rgba(0, 0, 0, 0.42) 0px 22px 48px, rgba(255, 104, 25, 0.08) 0px 0px 24px inset; }

.jietu { background: radial-gradient(circle at 50% 130px, rgba(104, 22, 10, 0.3), transparent 390px), linear-gradient(rgba(7, 5, 4, 0.96), rgba(12, 8, 7, 0.92)), url("../images/bg-jietu.jpg") center top no-repeat; }

.title-jietu::before { color: rgb(245, 199, 119); text-shadow: rgba(0, 0, 0, 0.78) 0px 5px 16px, rgba(180, 26, 12, 0.36) 0px 0px 20px; }

.title-jietu::after { color: rgb(202, 162, 122); }

.pb-carouselWarp { border-color: rgba(174, 62, 36, 0.5); box-shadow: rgba(0, 0, 0, 0.46) 0px 24px 54px, rgba(139, 28, 18, 0.12) 0px 0px 24px inset; }

:root { --btn-download-normal: url("../images/btn-download-normal.png"); --btn-download-hover: url("../images/btn-download-hover.png"); --btn-download-active: url("../images/btn-download-active.png"); --btn-chongzhi-normal: url("../images/btn-chongzhi-normal.png"); --btn-chongzhi-hover: url("../images/btn-chongzhi-hover.png"); --btn-chongzhi-active: url("../images/btn-chongzhi-active.png"); --btn-normal: url("../images/btn1-normal.png"); --btn-hover: url("../images/btn1-hover.png"); --btn-active: url("../images/btn1-active.png"); --nav-normal: url("../images/bg-topnav-normal.png"); --nav-hover: url("../images/bg-topnav-hover.png"); }

#logo { width: 385px; height: 217px; left: calc(50% - 668px); top: 18px; z-index: 34; }

#logo img, #banner .txt1 img, #banner .txt2 img { width: 100%; height: 100%; object-fit: contain; }

#banner .txt1 { width: 345px; height: 700px; left: calc(50% + 204px); top: 34px; }

#banner .txt2 { width: 84px; height: 326px; left: calc(50% + 514px); top: 280px; z-index: 24; }

.hero-download-panel { position: absolute; left: calc(50% - 422px); top: 684px; z-index: 28; box-sizing: border-box; width: 818px; padding: 28px 40px 30px; background: linear-gradient(90deg, rgba(12, 8, 5, 0.1), rgba(169, 102, 37, 0.2) 50%, rgba(12, 8, 5, 0.1)), linear-gradient(rgba(24, 14, 8, 0.68), rgba(5, 18, 19, 0.62)); border: 1px solid rgba(210, 145, 68, 0.38); border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.34) 0px 20px 46px, rgba(210, 123, 37, 0.13) 0px 0px 30px inset; }

.hero-download-panel::before, .hero-download-panel::after { content: ""; position: absolute; left: 22px; right: 22px; height: 1px; pointer-events: none; background: linear-gradient(90deg, rgba(222, 154, 71, 0), rgba(222, 154, 71, 0.36), rgba(222, 154, 71, 0)); }

.hero-download-panel::before { top: 5px; }

.hero-download-panel::after { bottom: 5px; }

.readmore { left: calc(50% - 88px); bottom: 70px; width: 150px; height: 70px; z-index: 26; }

.readmore img { width: 150px; height: 70px; }

.hero-slogan { position: relative; left: 0px; top: auto; width: 520px; height: 22px; line-height: 22px; margin: 18px auto 0px; padding: 0px; max-width: none; overflow: hidden; text-overflow: ellipsis; color: rgba(232, 203, 151, 0.88); font-size: 14px; font-weight: 600; letter-spacing: 0px; text-align: center; background: linear-gradient(90deg, rgba(20, 9, 5, 0), rgba(38, 16, 8, 0.18) 22%, rgba(58, 25, 10, 0.22) 50%, rgba(38, 16, 8, 0.18) 78%, rgba(20, 9, 5, 0)); border-top: 1px solid rgba(197, 124, 48, 0.1); border-bottom: 1px solid rgba(96, 39, 17, 0.12); box-shadow: none; text-shadow: rgb(0, 0, 0) 0px 2px 4px, rgba(231, 171, 89, 0.22) 0px 0px 7px; }

.hero-downloads { position: relative; left: 0px; top: 0px; z-index: 1; display: flex; gap: 32px; width: 100%; justify-content: center; align-items: center; }

.download-btn { display: flex; align-items: center; justify-content: center; width: 220px; height: 70px; line-height: 1; text-align: center; color: rgb(255, 248, 223); font-size: 26px; font-weight: 800; letter-spacing: 0px; text-shadow: rgb(0, 0, 0) 0px 2px 3px, rgba(255, 226, 168, 0.42) 0px 0px 10px, rgba(64, 22, 8, 0.9) 1px 1px 0px; padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; outline: none; overflow: visible; background-color: transparent; background-image: var(--btn-download-normal); background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; transition: filter 0.15s, color 0.15s; }

.download-btn img { width: 32px; height: 32px; margin-right: 14px; object-fit: contain; filter: drop-shadow(rgba(0, 0, 0, 0.75) 0px 2px 3px); }

.download-btn span { display: inline-block; white-space: nowrap; }

.download-btn:hover { color: rgb(255, 255, 255); background-color: transparent; background-image: var(--btn-download-hover); background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; filter: brightness(1.05); }

.download-btn:active { background-color: transparent; background-image: var(--btn-download-active); background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; }

.navlist { width: 205px; height: auto; padding: 8px 0px; top: 234px; left: calc(50% - 578px); background: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; }

.navlist ul { padding: 0px; }

.navlist ul li { height: 48px; margin: 7px 0px; }

.navlist ul li:last-child { display: none; }

.navlist a, .navlist a.current, .navlist a:hover { width: 205px; height: 48px; padding: 0px; line-height: 48px; font-size: 18px; color: rgb(255, 232, 190); background-color: transparent; background-repeat: no-repeat; background-position: center center; background-size: 205px 48px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; filter: none; }

.navlist a { background-image: var(--nav-normal); }

.navlist a.current { color: rgb(255, 248, 221); background-image: var(--nav-hover); text-shadow: rgb(0, 0, 0) 0px 2px 5px, rgba(255, 155, 45, 0.48) 0px 0px 12px; }

.navlist a:hover { color: rgb(255, 255, 255); background-image: var(--nav-hover); text-shadow: rgb(0, 0, 0) 0px 2px 5px, rgba(255, 155, 45, 0.32) 0px 0px 10px; }

.navlist a::after { display: none; }

#cadpa { top: auto; bottom: 34px; left: 32px; width: 66px; opacity: 0.86; }

#boxIOS, #boxAndroid { margin: -96px 0px 0px 202px; }

.school-title h2 { width: 520px; height: 122px; margin: 0px auto; text-indent: -9999px; overflow: hidden; background: url("../images/bg-title1.png") center center / contain no-repeat; }

.school-title h2::before, .school-title h2::after { display: none; }

.school-title p { margin-top: 4px; font-size: 18px; }

.school-list { align-items: stretch; }

.school-role { padding-top: 18px; }

.role-mark { width: 150px; height: 150px; margin-bottom: 2px; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: 0px; box-shadow: none; }

.role-mark::before { display: none; }

.role-mark img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(rgba(0, 0, 0, 0.56) 0px 12px 18px) drop-shadow(rgba(255, 132, 36, 0.18) 0px 0px 14px); }

.school-role h3 { margin: -6px 0px 12px; }

.school-build { min-height: 184px; padding: 18px 14px 14px 76px; }

.build-badge { left: 18px; top: 20px; width: 48px; height: 48px; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; transform: none; box-shadow: none; }

.build-badge::after { display: none; }

.build-badge img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(rgba(0, 0, 0, 0.48) 0px 6px 10px); }

.build-tags { gap: 5px; }

.build-tags span { white-space: nowrap; }

.school-build p { align-items: flex-start; gap: 7px; }

.school-build b { flex: 0 0 38px; white-space: nowrap; }

.school-build p span { min-width: 0px; word-break: keep-all; overflow-wrap: break-word; }

.title-show, .title-jietu { height: 122px; margin-bottom: 26px; background-repeat: no-repeat; background-position: center center; background-size: auto 100%; }

.title-show { background-image: url("../images/bg-title2.png"); }

.title-jietu { background-image: url("../images/bg-title3.png"); }

#bannerbg, #banner img.heightself { display: none !important; }

.bannervideo, .bannervideo video { opacity: 1 !important; }

.bannervideo { filter: none; }

#banner::after { background: linear-gradient(90deg, rgba(4, 3, 2, 0.68) 0%, rgba(4, 3, 2, 0.28) 22%, rgba(4, 3, 2, 0.1) 58%, rgba(4, 3, 2, 0.34) 100%), linear-gradient(rgba(0, 0, 0, 0.26) 0%, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, 0.42) 100%); }

#logo { left: max(24px, 50% - 858px); }

.navlist { left: max(114px, 50% - 768px); }

#banner .txt1 { left: calc(50% - 340px); top: 10px; }

#banner .txt2 { left: calc(50% + 18px); top: 294px; }

.hero-download-panel { left: calc(50% - 220px); top: 626px; }

.readmore { left: calc(50% + 114px); top: 790px; bottom: auto; }

#bannerbg, #banner img.heightself { display: none !important; }

.bannervideo { opacity: 1 !important; filter: none; }

.bannervideo video { opacity: 1 !important; }

#banner::after { background: linear-gradient(90deg, rgba(4, 3, 2, 0.68) 0%, rgba(4, 3, 2, 0.28) 22%, rgba(4, 3, 2, 0.1) 58%, rgba(4, 3, 2, 0.34) 100%), linear-gradient(rgba(0, 0, 0, 0.26) 0%, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, 0.42) 100%); }

#logo { left: max(24px, 50% - 858px); }

.navlist { left: max(114px, 50% - 768px); }

#banner .txt1 { left: calc(50% - 258px); top: 10px; }

#banner .txt2 { left: calc(50% + 100px); top: 294px; }

.hero-download-panel { left: calc(50% - 220px); top: 708px; }

.readmore { left: calc(50% + 114px); }

#banner .txt1 { left: calc(50% + 172px); top: 10px; }

#banner .txt2 { left: calc(50% + 530px); top: 294px; }

.hero-download-panel { left: calc(50% - 380px); top: 696px; }

.title-show::before, .title-show::after, .title-jietu::before, .title-jietu::after { display: none; }

.zb-wrap .swiper-slide > img { object-fit: contain; }

.pb-carouselWarp .pb-carousel-2 li:first-of-type { display: block; }

.pb-carouselWarp .pb-carousel-2 li img { object-fit: contain; }

#footer { height: auto; min-height: 210px; padding: 20px 0px; }

#footer .mainbox { display: flex; align-items: center; gap: 26px; height: auto; }

#footer .footerlogo { flex: 0 0 250px; float: none; width: 250px; height: auto; margin: 0px; }

#footer .footerlogo img { width: 240px; max-height: 135px; object-fit: contain; }

#footer .copyright { flex: 1 1 0%; float: none; width: auto; margin: 0px; padding: 0px; }

.fixedbox { width: 220px; height: auto; right: 18px; bottom: 24px; }

.fixedbox .h5bar { position: relative; width: 200px; height: auto; min-height: 0px; padding: 12px 0px 58px; }

.fixedbox .rightlogo { margin: 0px auto 6px; }

.fixedbox .rightlogo img { width: 170px; max-height: 96px; object-fit: contain; }

.fixedbox .qq, .fixedbox .group, .fixedbox .kefutime { margin: 6px 0px; }

.fixedbox .chongzhi { width: 168px; height: 60px; margin: 8px auto; }

.fixedbox .chongzhi a { width: 168px; height: 60px; background-image: var(--btn-chongzhi-normal); background-repeat: no-repeat; background-position: center center; background-size: 168px 60px; }

.fixedbox .chongzhi a:hover { background-image: var(--btn-chongzhi-hover); }

.fixedbox .chongzhi a:active { background-image: var(--btn-chongzhi-active); }

.fixedbox .chongzhi img { display: none; }

.fixedbox .code { margin: 8px auto 0px; }

.fixedbox .code div { width: 130px; height: 130px; }

.fixedbox .code img { width: 112px; height: 112px; margin-top: 9px; object-fit: contain; }

.fixedbox .top { width: 150px; height: 38px; left: 50%; bottom: 10px; margin: 0px 0px 0px -75px; }

.fixedbox .top a, .fixedbox .top img { width: 150px; height: 38px; }

.h5close { left: -30px; margin-top: 170px; }

.navlist, .navlist ul, .navlist li { background: none transparent !important; border: 0px !important; box-shadow: none !important; }

.navlist a { background: var(--nav-normal) no-repeat center / 205px 48px !important; }

.navlist a.current, .navlist a:hover { background: var(--nav-hover) no-repeat center / 205px 48px !important; }

.navlist a::before, .navlist a::after { display: none !important; }

.pb-carouselWarp .pb-carousel-2 > img { display: none !important; }

.pb-carouselWarp .pb-carousel-2 > li:first-of-type { display: block; left: 0px; }

.school-build { min-height: 214px; padding: 20px 18px 18px 88px; display: flex; flex-direction: column; justify-content: flex-start; background: radial-gradient(circle at 22% 14%, rgba(218, 139, 55, 0.12), transparent 116px), linear-gradient(rgba(42, 25, 13, 0.72), rgba(10, 7, 5, 0.82)); border-color: rgba(216, 147, 70, 0.34); box-shadow: rgba(255, 231, 178, 0.035) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0.22) 0px 10px 24px; }

.school-build h4 { margin: 2px 0px 9px; color: rgb(255, 213, 139); font-size: 25px; line-height: 1.18; letter-spacing: 0px; text-shadow: rgba(0, 0, 0, 0.78) 0px 2px 6px, rgba(221, 119, 31, 0.2) 0px 0px 10px; }

.build-badge { left: 19px; top: 18px; }

.build-zhanshen .build-badge, .build-jiansheng .build-badge, .build-huoxi .build-badge, .build-leixi .build-badge { width: 56px; height: 56px; }

.build-zhaohuan .build-badge, .build-xiedu .build-badge { width: 48px; height: 48px; }

.build-badge img { filter: drop-shadow(rgba(0, 0, 0, 0.58) 0px 7px 11px) drop-shadow(rgba(236, 149, 48, 0.18) 0px 0px 8px); }

.build-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 0px 0px 12px; }

.build-tags span { min-width: 34px; padding: 3px 8px 4px; color: rgb(255, 227, 167); font-size: 13px; line-height: 18px; text-align: center; background: linear-gradient(rgba(142, 71, 24, 0.38), rgba(45, 20, 9, 0.56)); border: 1px solid rgba(223, 148, 60, 0.32); border-radius: 3px; text-shadow: rgb(0, 0, 0) 0px 1px 3px; }

.school-build p { margin: 2px 0px 0px; display: flex; align-items: flex-start; gap: 9px; color: rgb(221, 199, 160); font-size: 15.5px; line-height: 1.62; }

.school-build b { flex: 0 0 40px; height: 24px; color: rgb(255, 210, 138); font-size: 15px; line-height: 24px; font-weight: 800; text-align: center; background: rgba(121, 55, 18, 0.28); border: 1px solid rgba(218, 141, 57, 0.18); border-radius: 2px; text-shadow: rgb(0, 0, 0) 0px 1px 3px; }

.school-build p span { flex: 1 1 0%; min-width: 0px; color: rgb(232, 212, 175); word-break: keep-all; overflow-wrap: break-word; }

.school-build { min-height: 218px; padding: 18px 18px 17px; display: grid; grid-template-columns: 62px auto 1fr; grid-auto-rows: auto; gap: 7px 10px; align-items: center; }

.build-badge { position: relative; left: auto; top: auto; grid-area: 1 / 1; place-self: center; }

.build-zhanshen .build-badge, .build-jiansheng .build-badge, .build-huoxi .build-badge, .build-leixi .build-badge { width: 62px; height: 62px; }

.build-zhaohuan .build-badge, .build-xiedu .build-badge { width: 48px; height: 48px; }

.school-build h4 { grid-area: 1 / 2; align-self: center; margin: 0px; font-size: 26px; line-height: 1.15; white-space: nowrap; }

.build-tags { grid-area: 1 / 3; align-self: center; margin: 0px; gap: 6px; }

.build-tags span { min-width: 32px; padding: 3px 7px 4px; font-size: 13.5px; line-height: 18px; }

.school-build p { grid-column: 1 / -1; margin: 3px 0px 0px; gap: 10px; font-size: 16.5px; line-height: 1.68; }

.school-build p:first-of-type { margin-top: 7px; }

.school-build b { flex: 0 0 42px; height: 25px; font-size: 15.5px; line-height: 25px; }

.school-build { --build-color: #ffd58b; --build-color-soft: rgba(223, 148, 60, .34); min-height: 226px; grid-template-columns: 70px 1fr; gap: 8px 12px; align-items: center; }

.build-zhanshen { --build-color: #ff9a52; --build-color-soft: rgba(255, 105, 45, .38); }

.build-jiansheng { --build-color: #b9dcff; --build-color-soft: rgba(111, 176, 232, .36); }

.build-huoxi { --build-color: #ffb052; --build-color-soft: rgba(255, 124, 35, .4); }

.build-leixi { --build-color: #9fd5ff; --build-color-soft: rgba(93, 180, 255, .38); }

.build-zhaohuan { --build-color: #ffe6a6; --build-color-soft: rgba(239, 190, 88, .36); }

.build-xiedu { --build-color: #a7e67a; --build-color-soft: rgba(112, 206, 85, .36); }

.build-badge { grid-area: 1 / 1; }

.build-zhanshen .build-badge, .build-jiansheng .build-badge, .build-huoxi .build-badge, .build-leixi .build-badge { width: 66px; height: 66px; }

.build-zhaohuan .build-badge, .build-xiedu .build-badge { width: 48px; height: 48px; }

.school-build h4 { grid-area: 1 / 2; color: var(--build-color); font-size: 27px; text-shadow: 0 2px 5px rgba(0,0,0,.86), 0 0 11px var(--build-color-soft); }

.build-tags { grid-area: 2 / 1 / auto / -1; min-height: 27px; margin: 1px 0px 3px; gap: 8px; align-items: center; }

.build-tags span { min-width: 34px; padding: 3px 8px 4px; color: rgb(247, 228, 191); font-size: 13.5px; line-height: 18px; background: linear-gradient(rgba(16, 10, 7, 0.22), rgba(24, 12, 7, 0.48)); border-color: var(--build-color-soft); box-shadow: inset 0 0 8px var(--build-color-soft); }

.school-build p { grid-column: 1 / -1; font-size: 17px; line-height: 1.72; }

.school-build p:first-of-type { margin-top: 5px; }

.school-build b { flex: 0 0 38px; height: auto; color: rgb(233, 201, 136); font-size: 15.5px; line-height: 1.72; font-weight: 700; background: transparent; border: 0px; text-align: left; text-shadow: rgb(0, 0, 0) 0px 1px 3px; }

.school-build b::before { content: ""; display: inline-block; width: 5px; height: 5px; margin: 0px 6px 2px 0px; background: var(--build-color); transform: rotate(45deg); box-shadow: 0 0 6px var(--build-color-soft); }

.school-build p span { color: rgb(241, 223, 189); font-weight: 500; }

.school-build { display: flex; flex-direction: column; min-height: 238px; padding: 16px; gap: 10px; }

.build-head { display: grid; grid-template-columns: 72px 1fr; column-gap: 12px; align-items: center; min-height: 78px; padding: 8px 10px 10px; background: linear-gradient(rgba(70, 38, 17, 0.24), rgba(15, 10, 7, 0.18)); border-bottom: 1px solid var(--build-color-soft); }

.build-head-main { min-width: 0px; }

.build-badge { grid-area: auto; place-self: center; }

.build-zhanshen .build-badge, .build-jiansheng .build-badge, .build-huoxi .build-badge, .build-leixi .build-badge { width: 68px; height: 68px; }

.build-zhaohuan .build-badge, .build-xiedu .build-badge { width: 50px; height: 50px; }

.school-build h4 { margin: 0px 0px 7px; font-size: 27px; line-height: 1.12; }

.build-tags { display: flex; flex-wrap: wrap; min-height: 25px; margin: 0px; gap: 7px; align-items: center; }

.build-tags span { padding: 2px 8px 3px; font-size: 13px; line-height: 18px; color: rgb(248, 231, 197); background: linear-gradient(rgba(9, 7, 6, 0.22), rgba(17, 10, 7, 0.5)); border: 1px solid var(--build-color-soft); box-shadow: inset 0 0 7px var(--build-color-soft); }

.build-body { flex: 1 1 0%; padding: 11px 12px 10px; background: linear-gradient(rgba(5, 5, 5, 0.54), rgba(20, 12, 7, 0.5)); border: 1px solid rgba(213, 151, 76, 0.22); box-shadow: rgba(0, 0, 0, 0.24) 0px 0px 16px inset; }

.school-build p { margin: 0px; display: flex; gap: 10px; font-size: 17px; line-height: 1.76; }

.school-build p + p { margin-top: 3px; }

.school-build p:first-of-type { margin-top: 0px; }

.school-build b { flex: 0 0 38px; line-height: 1.76; }

.build-zhanshen { --build-color: #c9271f; --build-color-soft: rgba(201, 39, 31, .46); }

.build-leixi { --build-color: #6f73ff; --build-color-soft: rgba(96, 85, 220, .48); }

.build-head { grid-template-columns: 82px 1fr; min-height: 92px; padding: 10px 12px 11px; column-gap: 13px; }

.build-badge { width: 78px; height: 78px; display: flex; align-items: center; justify-content: center; }

.build-zhanshen .build-badge, .build-jiansheng .build-badge, .build-huoxi .build-badge, .build-leixi .build-badge, .build-zhaohuan .build-badge, .build-xiedu .build-badge { width: 78px; height: 78px; }

.build-badge img { width: 100%; height: 100%; object-fit: contain; }

.build-leixi .build-badge img { transform: translateY(2px); }

.build-xiedu .build-badge img { transform: translateY(-2px); }

.build-head-main { display: flex; flex-direction: column; justify-content: center; gap: 8px; }

.school-build h4 { margin: 0px; }

.build-tags { min-height: 24px; gap: 6px; }

.build-tags span { padding: 2px 8px 3px; border-color: var(--build-color-soft); box-shadow: inset 0 0 6px var(--build-color-soft); }

.school-build { min-height: 260px; padding: 14px; gap: 10px; }

.build-zhanshen { --build-color: #b71918; --build-color-soft: rgba(183, 25, 24, .54); }

.build-jiansheng { --build-color: #b8cbd7; --build-color-soft: rgba(139, 178, 198, .4); }

.build-leixi { --build-color: #555eea; --build-color-soft: rgba(72, 74, 190, .54); }

.build-head { box-sizing: border-box; height: 104px; min-height: 104px; grid-template-columns: 90px 1fr; column-gap: 12px; padding: 9px 12px 8px; align-items: center; background: linear-gradient(rgba(72, 39, 17, 0.28), rgba(14, 9, 7, 0.2)); border-bottom: 1px solid var(--build-color-soft); }

.build-badge, .build-zhanshen .build-badge, .build-jiansheng .build-badge, .build-huoxi .build-badge, .build-leixi .build-badge, .build-zhaohuan .build-badge, .build-xiedu .build-badge { width: 86px; height: 86px; overflow: visible; }

.build-badge img { max-width: 100%; max-height: 100%; }

.build-zhanshen .build-badge img, .build-jiansheng .build-badge img, .build-huoxi .build-badge img { transform: scale(1.08); }

.build-leixi .build-badge img { transform: scale(1.08) translateY(2px); }

.build-zhaohuan .build-badge img { transform: scale(1); }

.build-xiedu .build-badge img { transform: scale(1) translateY(-2px); }

.build-head-main { justify-content: center; gap: 7px; }

.school-build h4 { font-size: 27px; line-height: 30px; }

.build-tags { min-height: 23px; gap: 6px; }

.build-tags span { padding: 2px 8px 3px; font-size: 13px; line-height: 17px; }

.build-body { box-sizing: border-box; width: 100%; height: 122px; padding: 12px 12px 10px; margin: 0px; }

.school-build p { display: grid; grid-template-columns: 44px 1fr; column-gap: 10px; align-items: start; font-size: 16.8px; line-height: 1.62; }

.school-build p + p { margin-top: 4px; }

.school-build b { display: block; line-height: 1.62; }

.school-build p span { display: block; line-height: 1.62; }

.build-zhanshen .build-badge img, .build-jiansheng .build-badge img, .build-huoxi .build-badge img { transform: scale(1.16); }

.build-leixi .build-badge img { transform: scale(1.16) translateY(2px); }

.build-zhaohuan .build-badge img { transform: scale(1); }

.build-xiedu .build-badge img { transform: scale(1) translateY(-2px); }

.build-tags { padding-top: 4px; }

.build-tags span { background: linear-gradient(180deg, var(--build-color-soft), rgba(12, 8, 7, .54)); border-color: var(--build-color-soft); box-shadow: inset 0 0 8px var(--build-color-soft), 0 1px 5px rgba(0,0,0,.28); }

.build-body { padding: 12px 12px 10px 20px; }

.school-build p { grid-template-columns: 44px 1fr; column-gap: 12px; }

.build-head { grid-template-columns: 92px 1fr; column-gap: 13px; height: 106px; min-height: 106px; padding: 10px 12px 9px; }

.build-head-main { align-items: flex-start; justify-content: center; gap: 10px; }

.school-build h4 { width: 100%; text-align: left; line-height: 29px; }

.build-zhanshen .build-badge img, .build-jiansheng .build-badge img, .build-huoxi .build-badge img { transform: scale(1.26); }

.build-leixi .build-badge img { transform: scale(1.26) translateY(2px); }

.build-zhaohuan .build-badge img { transform: scale(1); }

.build-xiedu .build-badge img { transform: scale(1) translateY(-2px); }

.build-tags { width: 100%; padding-top: 6px; justify-content: flex-start; align-items: center; gap: 7px; }

.build-tags span { display: inline-flex; align-items: center; justify-content: center; height: 22px; min-width: 36px; padding: 0px 9px; color: rgb(255, 244, 213); line-height: 1; background: linear-gradient(180deg, var(--build-color-soft), rgba(24, 13, 9, .74)); border-color: var(--build-color-soft); box-shadow: inset 0 0 10px var(--build-color-soft), 0 1px 5px rgba(0,0,0,.32); }

.build-body { padding: 12px 12px 10px 24px; }

.school-build p { grid-template-columns: 46px 1fr; column-gap: 13px; }

.school-build b, .school-build p span { line-height: 1.62; }

.show { position: relative; background: linear-gradient(rgba(10, 6, 4, 0.98) 0%, rgba(18, 11, 7, 0.96) 24%, rgba(20, 12, 8, 0.94) 58%, rgba(9, 6, 4, 0.98) 100%), radial-gradient(circle at 50% 140px, rgba(132, 86, 39, 0.1), transparent 420px), url("../images/bg-tese.jpg") center top no-repeat; border-top: 1px solid rgba(169, 111, 56, 0.1); box-shadow: rgba(8, 5, 3, 0.72) 0px 42px 70px inset, rgba(7, 5, 4, 0.72) 0px -48px 76px inset; }

.show::before, .show::after, .jietu::before, .jietu::after { content: ""; position: absolute; left: 0px; right: 0px; height: 92px; pointer-events: none; z-index: 0; }

.show::before, .jietu::before { top: 0px; background: linear-gradient(rgba(8, 5, 3, 0.78), rgba(8, 5, 3, 0)); }

.show::after, .jietu::after { bottom: 0px; background: linear-gradient(0deg, rgba(8, 5, 3, 0.8), rgba(8, 5, 3, 0)); }

.show > *, .jietu > * { position: relative; z-index: 1; }

.jietu { position: relative; background: linear-gradient(rgba(9, 6, 4, 0.98) 0%, rgba(17, 11, 8, 0.94) 38%, rgba(9, 6, 5, 0.98) 100%), radial-gradient(circle at 50% 150px, rgba(125, 79, 36, 0.09), transparent 410px), url("../images/bg-jietu.jpg") center top no-repeat; border-top: 1px solid rgba(169, 111, 56, 0.1); box-shadow: rgba(8, 5, 3, 0.7) 0px 42px 70px inset, rgba(7, 5, 4, 0.72) 0px -48px 76px inset; }

.zb-wrap .swiper-slide { background: linear-gradient(rgba(29, 21, 14, 0.8), rgba(9, 7, 5, 0.86)); border-color: rgba(176, 119, 59, 0.34); box-shadow: rgba(0, 0, 0, 0.36) 0px 18px 42px, rgba(170, 102, 42, 0.06) 0px 0px 18px inset; }

.pb-carouselWarp { background: linear-gradient(rgba(27, 20, 14, 0.72), rgba(7, 6, 5, 0.8)); border-color: rgba(162, 108, 54, 0.34); box-shadow: rgba(0, 0, 0, 0.4) 0px 20px 48px, rgba(154, 96, 39, 0.07) 0px 0px 18px inset; }

.show { background: linear-gradient(rgba(7, 5, 4, 0.99) 0%, rgba(13, 9, 6, 0.98) 16%, rgba(22, 15, 10, 0.94) 42%, rgba(16, 11, 8, 0.97) 74%, rgba(7, 5, 4, 0.99) 100%), radial-gradient(at 50% 116px, rgba(120, 78, 38, 0.18) 0%, rgba(69, 42, 22, 0.1) 34%, rgba(8, 5, 4, 0) 68%), radial-gradient(at 50% 54%, rgba(84, 53, 29, 0.1) 0%, rgba(8, 5, 4, 0) 58%), linear-gradient(90deg, rgba(4, 3, 3, 0.86) 0%, rgba(9, 6, 5, 0.18) 24%, rgba(9, 6, 5, 0.18) 76%, rgba(4, 3, 3, 0.86) 100%), url("../images/bg-tese.jpg") center top no-repeat; border-top-color: rgba(135, 91, 48, 0.08); box-shadow: rgba(5, 3, 2, 0.82) 0px 54px 84px inset, rgba(5, 3, 2, 0.82) 0px -62px 90px inset; }

.jietu { background: linear-gradient(rgba(7, 5, 4, 0.99) 0%, rgba(13, 9, 7, 0.97) 18%, rgba(21, 14, 10, 0.94) 46%, rgba(14, 10, 8, 0.97) 76%, rgba(7, 5, 4, 0.99) 100%), radial-gradient(at 50% 116px, rgba(116, 73, 35, 0.17) 0%, rgba(63, 39, 22, 0.1) 35%, rgba(8, 5, 4, 0) 70%), radial-gradient(at 50% 55%, rgba(75, 48, 28, 0.09) 0%, rgba(8, 5, 4, 0) 58%), linear-gradient(90deg, rgba(4, 3, 3, 0.88) 0%, rgba(9, 6, 5, 0.16) 25%, rgba(9, 6, 5, 0.16) 75%, rgba(4, 3, 3, 0.88) 100%), url("../images/bg-jietu.jpg") center top no-repeat; border-top-color: rgba(135, 91, 48, 0.08); box-shadow: rgba(5, 3, 2, 0.82) 0px 54px 84px inset, rgba(5, 3, 2, 0.82) 0px -62px 90px inset; }

.show::before, .jietu::before { height: 138px; background: radial-gradient(at 50% 72px, rgba(116, 77, 39, 0.12), rgba(8, 5, 4, 0) 68%), linear-gradient(rgba(6, 4, 3, 0.86), rgba(10, 7, 5, 0.24) 58%, rgba(10, 7, 5, 0)); }

.show::after, .jietu::after { height: 148px; background: radial-gradient(at 50% 100%, rgba(88, 55, 31, 0.1), rgba(8, 5, 4, 0) 66%), linear-gradient(0deg, rgba(6, 4, 3, 0.88), rgba(10, 7, 5, 0.22) 60%, rgba(10, 7, 5, 0)); }

.title-show, .title-jietu { background-repeat: no-repeat, no-repeat, no-repeat; background-position: center center, center 50%, center 62%; background-size: auto 100%, 820px 118px, 1040px 170px; }

.title-show { background-image: url("../images/bg-title2.png"), radial-gradient(rgba(114, 76, 38, 0.2), rgba(9, 6, 4, 0) 70%), linear-gradient(90deg, rgba(8, 5, 4, 0), rgba(49, 31, 18, 0.16) 42%, rgba(49, 31, 18, 0.16) 58%, rgba(8, 5, 4, 0)); }

.title-jietu { background-image: url("../images/bg-title3.png"), radial-gradient(rgba(108, 70, 36, 0.19), rgba(9, 6, 4, 0) 70%), linear-gradient(90deg, rgba(8, 5, 4, 0), rgba(45, 29, 18, 0.15) 42%, rgba(45, 29, 18, 0.15) 58%, rgba(8, 5, 4, 0)); }

.zb-wrap .swiper-slide { background: linear-gradient(rgba(24, 18, 13, 0.58), rgba(8, 6, 5, 0.72)); border-color: rgba(149, 102, 56, 0.26); box-shadow: rgba(0, 0, 0, 0.34) 0px 18px 42px, rgba(121, 78, 39, 0.05) 0px 0px 22px inset; }

.pb-carouselWarp { background: linear-gradient(rgba(23, 17, 13, 0.58), rgba(8, 6, 5, 0.72)); border-color: rgba(144, 96, 53, 0.26); box-shadow: rgba(0, 0, 0, 0.38) 0px 20px 46px, rgba(118, 75, 38, 0.05) 0px 0px 22px inset; }

.show, .jietu { background: radial-gradient(circle at 50% 0px, rgba(138, 85, 38, 0.2), transparent 360px), linear-gradient(rgb(11, 7, 5) 0%, rgb(28, 17, 11) 46%, rgb(10, 6, 4) 100%); border-top: 1px solid rgba(183, 103, 35, 0.28); border-bottom: 1px solid rgba(183, 103, 35, 0.18); box-shadow: none; }

.show::before, .show::after, .jietu::before, .jietu::after { display: none; }

.title-show, .title-jietu { background-repeat: no-repeat; background-position: center center; background-size: auto 100%; }

.title-show { background-image: url("../images/bg-title2.png"); }

.title-jietu { background-image: url("../images/bg-title3.png"); }

#bannerbg, #banner img.heightself { display: none !important; }

.bannervideo, .bannervideo video { opacity: 1 !important; }

.bannervideo { filter: none; }

#banner::after { background: linear-gradient(90deg, rgba(4, 3, 2, 0.68) 0%, rgba(4, 3, 2, 0.28) 22%, rgba(4, 3, 2, 0.1) 58%, rgba(4, 3, 2, 0.34) 100%), linear-gradient(rgba(0, 0, 0, 0.26) 0%, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, 0.42) 100%); }

#logo { left: max(24px, 50% - 858px); }

.navlist { left: max(114px, 50% - 768px); }

#banner .txt1 { left: calc(50% - 258px); top: 10px; }

#banner .txt2 { left: calc(50% + 100px); top: 294px; }

.hero-download-panel { left: calc(50% - 220px); top: 674px; }

.readmore { left: calc(50% + 114px); bottom: 62px; }

/* Hero MP4 final override: hide bg.jpg layers and align hero controls */
#bannerbg,
#banner img.heightself {
  display: none !important;
}

.bannervideo,
.bannervideo video {
  opacity: 1 !important;
}

.bannervideo {
  filter: none;
}

#banner:after {
  background:
    linear-gradient(90deg, rgba(4, 3, 2, .68) 0%, rgba(4, 3, 2, .28) 22%, rgba(4, 3, 2, .1) 58%, rgba(4, 3, 2, .34) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, .26) 0%, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, .42) 100%);
}

#logo {
  left: max(24px, calc(50% - 600px - 258px));
}

.navlist {
  left: max(114px, calc(50% - 600px - 168px));
}

#banner .txt1 {
  left: calc(50% - 600px + 260px);
  top: 10px;
}

#banner .txt2 {
  left: calc(50% - 600px + 618px);
  top: 294px;
}

.hero-download-panel {
  left: calc(50% - 600px + 380px);
  top: 626px;
}

.readmore {
  left: calc(50% - 600px + 714px);
  top: 790px;
  bottom: auto;
}

/* Hero final height/title cleanup for the MP4 first screen */
#bannerbox,
#banner {
  min-height: 100vh;
}

#banner {
  height: 100vh;
  overflow: hidden;
}

.bannervideo {
  height: 100%;
}

.bannervideo video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

#banner .txt1 {
  width: 304px;
  height: 616px;
  left: calc(50% - 600px + 286px);
  top: 20px;
}

#banner .txt1 img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#banner .txt2 {
  width: 74px;
  height: 287px;
  left: calc(50% - 600px + 598px);
  top: 286px;
}

#banner .txt2 img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.readmore {
  left: calc(50% - 600px + 714px);
  top: auto;
  bottom: 28px;
}

/* Hero title scale refinement */
#banner .txt1 {
  width: 294px;
  height: 596px;
  left: calc(50% - 600px + 286px);
  top: 8px;
}

#banner .txt2 {
  width: 70px;
  height: 274px;
  left: calc(50% - 600px + 588px);
  top: 282px;
}

/* Hero composition final adjustment: smaller title, attached subtitle, lower-right CTA */
#banner .txt1 {
  width: 260px;
  height: 527px;
  left: calc(50% - 600px + 256px);
  top: -4px;
}

#banner .txt2 {
  width: 64px;
  height: 250px;
  left: calc(50% - 600px + 536px);
  top: 258px;
}

.hero-download-panel {
  left: calc(50% - 600px + 460px);
  top: 660px;
}

.readmore {
  left: calc(50% - 600px + 794px);
  top: auto;
  bottom: 28px;
}

/* Hero 1080P final composition: clear warrior head and separate arrow */
#banner .txt1 {
  width: 220px;
  height: 446px;
  left: calc(50% - 600px + 200px);
  top: -18px;
}

#banner .txt2 {
  width: 58px;
  height: 226px;
  left: calc(50% - 600px + 438px);
  top: 188px;
}

.readmore {
  left: calc(50% - 600px + 794px);
  top: auto;
  bottom: 12px;
}

/* Hero subtitle final readability adjustment */
#banner .txt2 {
  width: 70px;
  height: 271px;
  left: calc(50% - 600px + 444px);
  top: 128px;
}

/* Immediate dark fallback during local refresh before video/poster paints */
html,
body {
  background-color: #050302;
}

#bannerbox,
#banner {
  background-color: #050302;
}

#banner {
  background-image:
    radial-gradient(circle at 56% 42%, rgba(92, 42, 12, .34), rgba(5, 3, 2, .72) 48%, rgba(0, 0, 0, .96) 100%),
    linear-gradient(180deg, #070403 0%, #030201 100%);
}

/* Equipment showcase videos replace the old GIF frames */
.zb-wrap .swiper-slide {
  overflow: hidden;
}

.zb-wrap .equip-video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  background: #050302;
}

/* Equipment showcase scale-up: larger 16:9 active video without resizing nav arrows */
.show {
  height: clamp(780px, 58vw, 980px);
  padding-top: clamp(48px, 4vw, 70px);
  overflow: hidden;
}

.show .mainbox {
  width: min(94vw, 1880px);
}

.zb-wrap {
  width: min(94vw, 1880px);
  height: clamp(600px, 42vw, 820px);
  margin: 0 auto;
}

.zb-wrap.ab {
  position: relative;
  left: auto;
  top: auto;
  margin: 0 auto;
}

.zb-wrap .swiper-container {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.zb-wrap .swiper-wrapper {
  align-items: center;
  height: 100%;
}

.zb-wrap .swiper-slide {
  aspect-ratio: 16 / 9;
  height: auto;
  padding: 0;
  box-sizing: border-box;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
}

.zb-wrap .swiper-slide-active {
  z-index: 20;
  box-shadow:
    rgba(0, 0, 0, .48) 0 26px 58px,
    rgba(255, 125, 32, .1) 0 0 30px inset;
}

.zb-wrap .equip-video {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  background-color: #050302;
}

.zb-wrap .swiper-slide-active .equip-video {
  width: clamp(960px, 52vw, 1280px);
  max-width: none;
  height: auto;
  aspect-ratio: 16 / 9;
  position: relative;
  box-shadow: rgba(0, 0, 0, .58) 0 28px 68px, rgba(202, 118, 42, .22) 0 0 0 1px;
}

.zb-wrap .swiper-button-prev,
.zb-wrap .swiper-button-next {
  width: 80px;
  height: 80px;
  top: 48%;
  margin-top: -40px;
  background-size: 80px 80px;
  transform: none;
  z-index: 40;
}

.zb-wrap .swiper-button-prev {
  left: max(30px, calc((100% - clamp(960px, 52vw, 1280px)) / 2 - 130px));
}

.zb-wrap .swiper-button-next {
  right: max(30px, calc((100% - clamp(960px, 52vw, 1280px)) / 2 - 90px));
}

@media (max-width: 1440px) {
  .show {
    height: 780px;
  }

  .show .mainbox,
  .zb-wrap {
    width: 1200px;
  }

  .zb-wrap {
    height: 560px;
  }

  .zb-wrap .swiper-slide-active .equip-video {
    width: min(88vw, 920px);
  }

  .zb-wrap .swiper-button-prev {
    left: max(30px, calc((100% - min(88vw, 920px)) / 2 - 130px));
  }

  .zb-wrap .swiper-button-next {
    right: max(30px, calc((100% - min(88vw, 920px)) / 2 - 90px));
  }
}

/* Battle showcase: replace old GIF frame with three responsive MP4 scenes */
.jietu {
  padding-bottom: clamp(86px, 7vw, 120px);
}

.jietu .imglistbox,
.jietu .imglist_1,
.jietu .imglist_1 > li {
  width: 100%;
}

.jietu .imglist_1 {
  justify-content: center;
}

.jietu .imglist_1 > li {
  height: auto;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

.jietu .pb-carouselWarp {
  width: clamp(760px, 46vw, 1120px);
  height: clamp(570px, 36vw, 835px);
  float: none;
  margin: 0 auto;
  overflow: hidden;
  background: linear-gradient(rgba(24, 18, 13, .58), rgba(8, 6, 5, .76));
}

.jietu .pb-carouselWarp .pb-carousel-2,
.jietu .pb-carouselWarp .battle-scene {
  width: 100%;
  height: 100%;
  list-style: none;
}

.jietu .pb-carouselWarp .battle-scene {
  align-items: center;
  justify-content: center;
  background: transparent;
}

.jietu .pb-carouselWarp .battle-video-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid rgba(180, 118, 56, .26);
  box-shadow: rgba(0, 0, 0, .46) 0 24px 58px, rgba(170, 94, 39, .08) 0 0 22px inset;
  background: #050302;
}

.jietu .battle-video-scene1-wrap {
  aspect-ratio: 1280 / 790;
}

.jietu .battle-video-scene2-wrap {
  aspect-ratio: 1280 / 954;
}

.jietu .battle-video-scene3-wrap {
  aspect-ratio: 1280 / 958;
}

.jietu .battle-video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  background: #050302;
}

.jietu .pb-carouselWarp .pb-arrow {
  top: 50%;
  margin-top: -25px;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.jietu .pb-carouselWarp .pb-arrow-prev {
  left: 18px;
}

.jietu .pb-carouselWarp .pb-arrow-next {
  right: 18px;
}

@media (max-width: 1440px) {
  .jietu .pb-carouselWarp {
    width: min(88vw, 900px);
    height: min(72vw, 700px);
  }
}

/* PC hero large-screen tuning: keep 1080P base layout untouched */
@media screen and (min-width: 2000px) and (min-height: 1000px) {
  #logo,
  .navlist {
    transform: scale(1.14);
    transform-origin: top left;
  }

  #banner .txt1,
  #banner .txt2 {
    transform: scale(1.1);
    transform-origin: top left;
  }

  .hero-download-panel {
    transform: scale(1.14);
    transform-origin: center center;
  }

  .fixedbox {
    right: 34px;
    bottom: 34px;
    transform: scale(1.1);
    transform-origin: right bottom;
  }

  .age {
    transform: scale(1.12);
    transform-origin: left bottom;
  }

  .readmore {
    transform: scale(1.1);
    transform-origin: center bottom;
  }

  .bannervideo video {
    object-fit: cover;
    object-position: center center;
  }
}