/* ==== inline ==== */
ul{ margin: 0px; padding: 0px; }li{ list-style: none; }p{ margin: 0px; }a{ color: rgb(18, 21, 26); text-decoration: none; }body, h2, h3{ margin: 0px; }body{ padding: 0px; width: 100%; }.padding-fl{ box-sizing: border-box; padding: 0px 15%; }.title{ font-size: 56px; position: relative; }
@media screen and (max-width: 1024px) {.padding-fl{ padding: 0px 5%; }.title{ font-size: 46px; }
}
@media screen and (max-width: 600px) {.title{ font-size: 28px; }
}body, html{ font-family: DreamHan; }/* ==== inline ==== */
.header-box.isTop{ background-color: rgba(0, 0, 0, 0.2); box-shadow: none; color: rgb(255, 255, 255); }.header-box.isTop .right .menubtn .diglog{ color: rgb(255, 255, 255); }.header-box.isTop .right .menubtn .arrow{ border-left: 3px solid rgb(255, 255, 255); border-top: 3px solid rgb(255, 255, 255); }.header-box.isTop .right .menu a{ color: rgb(255, 255, 255); }.header-box.isTop::after{ background: linear-gradient(90deg, transparent 0px, transparent 10%, rgba(255, 255, 255, 0.3) 20%, rgba(255, 255, 255, 0.4) 30%, rgba(255, 255, 255, 0.5) 40%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0.4) 70%, rgba(255, 255, 255, 0.3) 80%, transparent 90%, transparent); content: ""; display: block; height: 1px; left: 0px; position: absolute; top: 100px; width: 100%; z-index: 99; }.header-box{ background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 10px; height: 100px; left: 0px; position: fixed; top: 0px; transform: translateY(0px); transition: 0.3s ease-in-out; width: 100%; z-index: 99; }.header-box .left .logo{ align-items: center; display: flex; left: 15vw; position: absolute; text-align: center; top: 50%; transform: translateY(-50%); }.header-box .left .logo img{ height: 48px; object-fit: contain; width: 97px; }.header-box .left .logo .name{ font-size: 24px; margin-left: 5px; }.header-box .right{ align-items: center; display: flex; gap: 70px; overflow: hidden; position: absolute; right: 15vw; top: 50%; transform: translateY(-50%); transition: 0.3s ease-in-out; }.header-box .right .menubtn{ align-items: center; display: flex; gap: 10px; }.header-box .right .menubtn .diglog{ cursor: pointer; display: flex; flex-direction: column; font-size: 20px; }.header-box .right .menubtn .diglog .open{ transform: translateY(50%); transition: transform 0.5s; }.header-box .right .menubtn .diglog .close{ transform: translateY(30px); transition: transform 0.5s; }.header-box .right .menubtn .arrow-group{ align-items: center; display: flex; margin-left: 5px; }.header-box .right .menubtn .arrow{ animation: 2s ease 0s infinite normal none running flash-58f1e745; border-left: 3px solid rgb(230, 33, 42); border-top: 3px solid rgb(230, 33, 42); display: inline-block; opacity: 0.2; transform: rotate(-45deg); }.header-box .right .menubtn .arrow.big{ animation-delay: 0.8s; height: 12px; width: 12px; }.header-box .right .menubtn .arrow.mid{ animation-delay: 0.4s; height: 9px; width: 9px; }.header-box .right .menubtn .arrow.small{ animation-delay: 0s; height: 6px; width: 6px; }
@keyframes flash-58f1e745 {0%{ opacity: 0.2; transform: rotate(-45deg) scale(1); }30%{ opacity: 1; transform: rotate(-45deg) scale(1.2); }60%{ opacity: 0.2; transform: rotate(-45deg) scale(1); }100%{ opacity: 0.2; transform: rotate(-45deg) scale(1); }
}.header-box .right .menu{ display: flex; opacity: 0; transform: translateY(40px); transition: 0.5s; }.header-box .right .menu .menu-item{ font-size: 17px; font-weight: 400; margin-left: 4vw; position: relative; }.header-box .right .menu .menu-item a::after{ background: rgb(230, 33, 42); bottom: -2px; content: ""; height: 2px; left: 0px; position: absolute; transition: width 0.3s; width: 0px; }.header-box .right .menu .menu-item:hover a{ color: rgb(230, 33, 42); }.header-box .right .menu .menu-item:hover a::after{ width: 100%; }.header-box .right.isshow .menubtn .diglog .open{ transform: translateY(-30px); transition: transform 0.5s; }.header-box .right.isshow .menubtn .diglog .close{ transform: translateY(-50%); transition: transform 0.5s; }.header-box .right.isshow .menubtn .arrow-group{ opacity: 0; pointer-events: none; transform: translate(6px); transition: opacity 0.18s, visibility 0.18s, transform 0.18s; visibility: hidden; }.header-box .right.isshow .menu{ opacity: 1; transform: translateY(0px); }.header-box.hide{ transform: translateY(-100%); }
@media screen and (max-width: 1420px) {.header-box .left .logo{ left: 3.5vw; }.header-box .right{ right: 3.5vw; }
}
@media screen and (max-width: 1024px) {.header-box .left .logo{ left: 5vw; }.header-box .right{ gap: 50px; right: 5vw; }.header-box .right .menu .menu-item{ font-size: 16px; margin-left: 3vw; }
}
@media screen and (max-width: 900px) {.header-box.isTop{ position: relative; }.header-box.isTop::after{ top: 50px; }.header-box{ height: 50px; }.header-box .left .logo{ height: 50px; left: 50%; top: 50%; transform: translate(-50%, -50%); }.header-box .left .logo img{ width: 60px; }.header-box .left .logo .name{ font-size: 18px; }.header-box .right{ display: none; }
}/* ==== inline ==== */
.footer{ background: rgb(230, 33, 42); height: 100%; }.footer .footMain{ box-sizing: border-box; display: flex; flex-direction: column; height: 100%; justify-content: space-between; padding-bottom: 30px; padding-top: 60px; width: 100%; }.footer .footMain .container{ box-sizing: border-box; display: flex; gap: 100px; padding: 0px 80px; }.footer .footMain .container .menu{ color: rgb(255, 255, 255); font-size: 20px; }.footer .footMain .container .menu .info-title{ letter-spacing: -1px; margin-bottom: 20px; }.footer .footMain .container .menu .qrcode{ display: flex; gap: 30px; justify-content: center; }.footer .footMain .container .menu .qrcode img{ height: 140px; width: 140px; }.footer .footMain .container .menu .item{ margin-bottom: 10px; opacity: 0.5; }.footer .footMain .container .menu .item.active{ opacity: 1; }.footer .footMain .container .contact .items{ opacity: 0; position: absolute; }.footer .footMain .container .contact .items.show{ opacity: 1; }.footer .footMain .container .contact .item{ opacity: 0; transform: translateY(10px); transition: 0.5s; }.footer .footMain .container .contact .item.active{ opacity: 1; transform: translateY(0px); }.footer .footMain .container .email{ color: rgb(255, 255, 255); margin-left: auto; }.footer .footMain .container .email .ce-title{ display: flex; font-size: 18px; justify-content: space-between; line-height: 135%; margin-bottom: 20px; }.footer .footMain .container .email .mail{ font-size: 40px; }.footer .footMain .otherInfo{ color: rgb(255, 255, 255); display: flex; font-size: 20px; justify-content: center; margin-top: 20px; padding: 0px 3%; }.footer .footMain .otherInfo a{ color: rgb(255, 255, 255); }.footer .footMain .scrollyfont{ background: transparent; height: auto; overflow: hidden; position: relative; white-space: nowrap; width: 100%; }.footer .footMain .scrollyfont .scroll-track{ animation: 60s linear 0s infinite normal none running scroll-left-bc2608ce; display: inline-block; opacity: 0.4; white-space: nowrap; }.footer .footMain .scrollyfont span{ color: rgb(255, 255, 255); display: inline-block; font-family: PublicSans-Regular; font-size: 300px; letter-spacing: -20px; padding-right: 100px; -webkit-font-smoothing: antialiased; text-rendering: optimizelegibility; }
@keyframes scroll-left-bc2608ce {0%{ transform: translate(0px); }100%{ transform: translate(-50%); }
}
@media screen and (max-width: 1200px) {.footer .footMain .container{ width: 100%; }.footer .footMain .container .con-center .row{ gap: 20px; }
}
@media screen and (max-width: 1400px) {.footer .footMain .container{ padding: 0px 30px; }.footer .footMain .container .menu{ font-size: 16px; }.footer .footMain .container .menu .qrcode img{ height: 120px; width: 120px; }.footer .footMain .container .email .mail{ font-size: 40px; }
}
@media screen and (max-width: 1100px) {.footer .footMain .scrollyfont span{ font-size: 250px; }.footer .footMain .container .menu{ font-size: 14px; }.footer .footMain .container .menu .qrcode img{ height: 100px; width: 100px; }.footer .footMain .container .email .mail{ font-size: 30px; }.footer .footMain .otherInfo{ font-size: 14px; }
}
@media screen and (max-width: 900px) {.footer .footMain .email{ display: none; }
}
@media screen and (max-width: 689px) {.footer .footMain{ min-height: 400px; }.footer .footMain .container .menu:first-child, .footer .footMain .scrollyfont{ display: none; }.footer .footMain .otherInfo{ font-size: 12px; }
}/* ==== inline ==== */
html{ font-size: 16px; }
@font-face { font-family: PublicSans-Regular; src: url("/_nuxt/PublicSans-Regular-14.IfOS3yHD.woff2"); }
@font-face { font-display: swap; font-family: DreamHan; font-style: normal; font-weight: 400; src: url("/_nuxt/DreamHanSansCN-W7.C3YpVapE.ttf") format("truetype"); }.body{ display: flex; flex-direction: column; font-family: Alibaba-PuHuiTi-Regular; height: 100%; min-height: 100vh; scroll-behavior: smooth; }.cursor-trail{ background: rgb(38, 35, 118); border-radius: 50%; height: 12px; pointer-events: none; position: fixed; transform: translate(-50%, -50%); transition: transform 0.3s cubic-bezier(0.25, 1.5, 0.5, 1), background-color 0.2s; width: 12px; z-index: 9999; }.cursor-trail.light{ background: rgb(255, 255, 255); }.cursor-trail.enlarged{ transform: translate(-50%, -50%) scale(5); }.cursor-trail.target{ transform: translate(-50%, -50%) scale(1.5); }.cursor-trail.enlarged::after{ color: rgb(255, 255, 255); content: "Click"; left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%) scale(0.2); }
@media screen and (max-width: 1024px) {.cursor-trail{ display: none; }
}/* ==== inline ==== */
.page .scroll-next-btn{ align-items: center; background-color: rgb(230, 33, 42); border-radius: 100%; bottom: 40px; box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 12px; cursor: pointer; display: flex; height: 50px; justify-content: center; position: fixed; right: 40px; transition: 0.3s; width: 50px; z-index: 1000; }.page .scroll-next-btn:hover{ background: rgb(47, 48, 138); transform: scale(1.1); }.page .content-one{ background: rgb(255, 255, 255); padding-bottom: 100px; padding-top: 100px; }.page .content-four, .page .content-two{ background: rgb(247, 248, 252); padding: 70px 0px; }.page .content-five{ background: rgb(255, 255, 255); padding-bottom: 100px; padding-top: 100px; }
@media screen and (max-width: 900px) {.page .content-one{ padding-bottom: 50px; padding-top: 50px; }.page .content-four, .page .content-two{ padding: 50px 0px; }.page .content-five{ padding-bottom: 50px; padding-top: 50px; }
}
@media screen and (max-width: 600px) {.page .banner{ padding-bottom: 40px; }
}/* ==== inline ==== */
.banner-box{ height: 100%; width: 100%; }.banner-box .mySwiper{ position: relative; }.banner-box .mySwiper img{ height: 100%; width: 100%; }.banner-box .mySwiper .swiper-slide:first-child .img{ filter: brightness(0.5) contrast(1.1); }.banner-box .mySwiper .to-red-900\/70{ --tw-gradient-to: rgba(127,29,29,.7) var(--tw-gradient-to-position); }.banner-box .mySwiper .via-blue-800\/60{ --tw-gradient-stops: rgba(30,58,138,.8),rgba(30,64,175,.6),rgba(127,29,29,.7); }.banner-box .mySwiper .from-blue-900\/80{ --tw-gradient-from: rgba(30,58,138,.8); }.banner-box .mySwiper .absolute{ position: absolute; }.banner-box .mySwiper .inset-0{ inset: 0px; }.banner-box .mySwiper .bg-gradient-to-r{ background-image: linear-gradient(90deg, rgba(30, 58, 138, 0.8), rgba(30, 64, 175, 0.6), rgba(127, 29, 29, 0.7)); }.banner-box .mySwiper .container{ padding: 0px 12vw; position: absolute; top: 50%; transform: translateY(-50%); width: 100%; }.banner-box .mySwiper .container h1{ color: rgb(255, 255, 255); font-size: 72px; letter-spacing: -1.8px; line-height: 1; }.banner-box .mySwiper .container p{ color: rgb(255, 255, 255); font-size: 20px; line-height: 28px; max-width: 672px; }.banner-box .mySwiper .container .text-lg{ color: rgb(219, 234, 254); margin-bottom: 40px; }.banner-box .mySwiper .container .flex-col .btn-box{ align-items: center; background: rgb(230, 33, 42); border-radius: 10px; box-sizing: border-box; color: rgb(255, 255, 255); cursor: pointer; display: flex; gap: 5px; height: 74px; justify-content: center; white-space: nowrap; width: 227px; }.banner-box .mySwiper .container .flex-col .btn-box span{ font-size: 20px; }.banner-box .mySwiper .container .flex-col .btn-box:hover{ background: rgb(239, 68, 68); }.banner-box .mySwiper .extend{ align-items: center; bottom: 50px; display: flex; flex-direction: column; left: 50%; position: absolute; transform: translate(-50%); }.banner-box .mySwiper .extend .text-white{ color: rgba(255, 255, 255, 0.8); font-size: 16px; line-height: 25px; margin-bottom: 10px; }.banner-box .mySwiper .extend .rounded-full{ border: 2px solid rgba(255, 255, 255, 0.5); border-radius: 9999px; box-sizing: border-box; display: flex; height: 50px; justify-content: center; padding-top: 10px; width: 30px; }.banner-box .mySwiper .extend .rounded-full .animate-bounce{ animation: 1s ease 0s infinite normal none running bounce-7cc52a1f; background-color: rgba(255, 255, 255, 0.8); border-radius: 9999px; height: 10px; width: 5px; }
@keyframes bounce-7cc52a1f {0%, 100%{ animation-timing-function: cubic-bezier(0.8, 0, 1, 1); transform: translateY(-25%); }50%{ animation-timing-function: cubic-bezier(0, 0, 0.2, 1); transform: none; }
}.banner-box .mySwiper .border{ backdrop-filter: blur(16px); background-color: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 15px; bottom: 150px; box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px; box-sizing: border-box; padding: 30px; position: absolute; right: 10%; width: 380px; }.banner-box .mySwiper .border .grid{ display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0px, 1fr)); }.banner-box .mySwiper .border .grid .text-center{ text-align: center; }.banner-box .mySwiper .border .grid .text-center .num{ font-size: 37px; font-weight: 700; line-height: 45px; }.banner-box .mySwiper .border .grid .text-center .num .plus{ font-size: 18px; vertical-align: super; }.banner-box .mySwiper .border .grid .text-center .text-sm{ color: rgba(255, 255, 255, 0.8); font-size: 17px; line-height: 25px; }
@media screen and (max-width: 1400px) {.banner-box .mySwiper .container h1{ font-size: 50px; }.banner-box .mySwiper .container p{ font-size: 16px; max-width: 480px; }.banner-box .mySwiper .container .flex-col .btn-box{ height: 60px; width: 180px; }.banner-box .mySwiper .container .flex-col .btn-box span{ font-size: 16px; }.banner-box .mySwiper .border{ width: 300px; }.banner-box .mySwiper .border .grid .text-center .num{ font-size: 30px; }.banner-box .mySwiper .border .grid .text-center .text-sm{ font-size: 15px; }
}
@media screen and (max-width: 1100px) {.banner-box .mySwiper .border, .banner-box .mySwiper .container .flex-col{ display: none; }
}
@media screen and (max-width: 1000px) {.banner-box .mySwiper .extend{ display: none; }
}
@media screen and (max-width: 768px) {.banner-box .mySwiper .container h1{ font-size: 30px; }.banner-box .mySwiper .container p{ font-size: 14px; max-width: 350px; }
}
@media screen and (max-width: 500px) {.banner-box .mySwiper .container h1{ font-size: 25px; }.banner-box .mySwiper .container p{ font-size: 12px; line-height: 20px; max-width: 300px; }
}/* ==== inline ==== */
@font-face{ font-family: swiper-icons; font-style: normal; font-weight: 400; src: url("data:application/font-woff;charset=utf-8;base64, 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"); }:root{ --swiper-theme-color: #007aff; }:host{ display: block; margin-left: auto; margin-right: auto; position: relative; z-index: 1; }.swiper{ display: block; list-style: none; margin-left: auto; margin-right: auto; overflow: hidden; padding: 0px; position: relative; z-index: 1; }.swiper-vertical > .swiper-wrapper{ flex-direction: column; }.swiper-wrapper{ box-sizing: content-box; display: flex; height: 100%; position: relative; transition-property: transform; transition-timing-function: var(--swiper-wrapper-transition-timing-function,initial); width: 100%; z-index: 1; }.swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper{ transform: translateZ(0px); }.swiper-horizontal{ touch-action: pan-y; }.swiper-vertical{ touch-action: pan-x; }.swiper-slide{ display: block; flex-shrink: 0; height: 100%; position: relative; transition-property: transform; width: 100%; }.swiper-slide-invisible-blank{ visibility: hidden; }.swiper-autoheight, .swiper-autoheight .swiper-slide{ height: auto; }.swiper-autoheight .swiper-wrapper{ align-items: flex-start; transition-property: transform, height; }.swiper-backface-hidden .swiper-slide{ backface-visibility: hidden; transform: translateZ(0px); }.swiper-3d.swiper-css-mode .swiper-wrapper{ perspective: 1200px; }.swiper-3d .swiper-wrapper{ transform-style: preserve-3d; }.swiper-3d{ perspective: 1200px; }.swiper-3d .swiper-cube-shadow, .swiper-3d .swiper-slide{ transform-style: preserve-3d; }.swiper-css-mode > .swiper-wrapper{ overflow: auto; scrollbar-width: none; }.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar{ display: none; }.swiper-css-mode > .swiper-wrapper > .swiper-slide{ scroll-snap-align: start; }.swiper-css-mode.swiper-horizontal > .swiper-wrapper{ scroll-snap-type: x mandatory; }.swiper-css-mode.swiper-vertical > .swiper-wrapper{ scroll-snap-type: y mandatory; }.swiper-css-mode.swiper-free-mode > .swiper-wrapper{ scroll-snap-type: none; }.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide{ scroll-snap-align: none; }.swiper-css-mode.swiper-centered > .swiper-wrapper::before{ content: ""; flex-shrink: 0; order: 9999; }.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide{ scroll-snap-align: center; scroll-snap-stop: always; }.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child{ margin-inline-start: var(--swiper-centered-offset-before); }.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before{ height: 100%; min-height: 1px; width: var(--swiper-centered-offset-after); }.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child{ margin-block-start: var(--swiper-centered-offset-before); }.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before{ height: var(--swiper-centered-offset-after); min-width: 1px; width: 100%; }.swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top{ height: 100%; left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; z-index: 10; }.swiper-3d .swiper-slide-shadow{ background: rgba(0, 0, 0, 0.15); }.swiper-3d .swiper-slide-shadow-left{ background-image: linear-gradient(270deg, rgba(0, 0, 0, 0.5), transparent); }.swiper-3d .swiper-slide-shadow-right{ background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.5), transparent); }.swiper-3d .swiper-slide-shadow-top{ background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), transparent); }.swiper-3d .swiper-slide-shadow-bottom{ background-image: linear-gradient(rgba(0, 0, 0, 0.5), transparent); }.swiper-lazy-preloader{ border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-radius: 50%; border-top: 4px solid transparent; box-sizing: border-box; height: 42px; left: 50%; margin-left: -21px; margin-top: -21px; position: absolute; top: 50%; transform-origin: 50% center; width: 42px; z-index: 10; }.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader, .swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{ animation: 1s linear 0s infinite normal none running swiper-preloader-spin; }.swiper-lazy-preloader-white{ --swiper-preloader-color: #fff; }.swiper-lazy-preloader-black{ --swiper-preloader-color: #000; }
@keyframes swiper-preloader-spin {0%{ transform: rotate(0deg); }100%{ transform: rotate(1turn); }
}.swiper-virtual .swiper-slide{ backface-visibility: hidden; transform: translateZ(0px); }.swiper-virtual.swiper-css-mode .swiper-wrapper::after{ content: ""; left: 0px; pointer-events: none; position: absolute; top: 0px; }.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{ height: 1px; width: var(--swiper-virtual-size); }.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{ height: var(--swiper-virtual-size); width: 1px; }:root{ --swiper-navigation-size: 44px; }.swiper-button-next, .swiper-button-prev{ align-items: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); cursor: pointer; display: flex; height: var(--swiper-navigation-size); justify-content: center; margin-top: calc(0px - var(--swiper-navigation-size)/2); position: absolute; top: var(--swiper-navigation-top-offset,50%); width: calc(var(--swiper-navigation-size)/44*27); z-index: 10; }.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{ cursor: auto; opacity: 0.35; pointer-events: none; }.swiper-button-next.swiper-button-hidden, .swiper-button-prev.swiper-button-hidden{ cursor: auto; opacity: 0; pointer-events: none; }.swiper-navigation-disabled .swiper-button-next, .swiper-navigation-disabled .swiper-button-prev{ display: none !important; }.swiper-button-next svg, .swiper-button-prev svg{ height: 100%; object-fit: contain; transform-origin: center center; width: 100%; }.swiper-rtl .swiper-button-next svg, .swiper-rtl .swiper-button-prev svg{ transform: rotate(180deg); }.swiper-button-prev, .swiper-rtl .swiper-button-next{ left: var(--swiper-navigation-sides-offset,10px); right: auto; }.swiper-button-lock{ display: none; }.swiper-button-next::after, .swiper-button-prev::after{ font-family: swiper-icons; font-size: var(--swiper-navigation-size); font-variant: normal; letter-spacing: 0px; line-height: 1; text-transform: none !important; }.swiper-button-prev::after, .swiper-rtl .swiper-button-next::after{ content: "prev"; }.swiper-button-next, .swiper-rtl .swiper-button-prev{ left: auto; right: var(--swiper-navigation-sides-offset,10px); }.swiper-button-next::after, .swiper-rtl .swiper-button-prev::after{ content: "next"; }.swiper-pagination{ position: absolute; text-align: center; transform: translateZ(0px); transition: opacity 0.3s; z-index: 10; }.swiper-pagination.swiper-pagination-hidden{ opacity: 0; }.swiper-pagination-disabled > .swiper-pagination, .swiper-pagination.swiper-pagination-disabled{ display: none !important; }.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{ bottom: var(--swiper-pagination-bottom,8px); left: 0px; top: var(--swiper-pagination-top,auto); width: 100%; }.swiper-pagination-bullets-dynamic{ font-size: 0px; overflow: hidden; }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{ position: relative; transform: scale(0.33); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{ transform: scale(1); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{ transform: scale(0.66); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{ transform: scale(0.33); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{ transform: scale(0.66); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{ transform: scale(0.33); }.swiper-pagination-bullet{ background: var(--swiper-pagination-bullet-inactive-color,#000); border-radius: var(--swiper-pagination-bullet-border-radius,50%); display: inline-block; height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px)); opacity: var(--swiper-pagination-bullet-inactive-opacity,.2); width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px)); }button.swiper-pagination-bullet{ appearance: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; box-shadow: none; margin: 0px; padding: 0px; }.swiper-pagination-clickable .swiper-pagination-bullet{ cursor: pointer; }.swiper-pagination-bullet:only-child{ display: none !important; }.swiper-pagination-bullet-active{ background: var(--swiper-pagination-color,var(--swiper-theme-color)); opacity: var(--swiper-pagination-bullet-opacity,1); }.swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical > .swiper-pagination-bullets{ left: var(--swiper-pagination-left,auto); right: var(--swiper-pagination-right,8px); top: 50%; transform: translate3d(0px, -50%, 0px); }.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet{ display: block; margin: var(--swiper-pagination-bullet-vertical-gap,6px) 0; }.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic{ top: 50%; transform: translateY(-50%); width: 8px; }.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{ display: inline-block; transition: transform 0.2s, top 0.2s; }.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{ margin: 0 var(--swiper-pagination-bullet-horizontal-gap,4px); }.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{ left: 50%; transform: translate(-50%); white-space: nowrap; }.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{ transition: transform 0.2s, left 0.2s; }.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{ transition: transform 0.2s, right 0.2s; }.swiper-pagination-fraction{ color: var(--swiper-pagination-fraction-color,inherit); }.swiper-pagination-progressbar{ background: var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25)); position: absolute; }.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: var(--swiper-pagination-color,var(--swiper-theme-color)); height: 100%; left: 0px; position: absolute; top: 0px; transform: scale(0); transform-origin: left top; width: 100%; }.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ transform-origin: right top; }.swiper-horizontal > .swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{ height: var(--swiper-pagination-progressbar-size,4px); left: 0px; top: 0px; width: 100%; }.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-vertical, .swiper-vertical > .swiper-pagination-progressbar{ height: 100%; left: 0px; top: 0px; width: var(--swiper-pagination-progressbar-size,4px); }.swiper-pagination-lock{ display: none; }.swiper-scrollbar{ background: var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1)); border-radius: var(--swiper-scrollbar-border-radius,10px); position: relative; touch-action: none; }.swiper-scrollbar-disabled > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-disabled{ display: none !important; }.swiper-horizontal > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal{ bottom: var(--swiper-scrollbar-bottom,4px); height: var(--swiper-scrollbar-size,4px); left: var(--swiper-scrollbar-sides-offset,1%); position: absolute; top: var(--swiper-scrollbar-top,auto); width: calc(100% - var(--swiper-scrollbar-sides-offset, 1%)*2); z-index: 50; }.swiper-scrollbar.swiper-scrollbar-vertical, .swiper-vertical > .swiper-scrollbar{ height: calc(100% - var(--swiper-scrollbar-sides-offset, 1%)*2); left: var(--swiper-scrollbar-left,auto); position: absolute; right: var(--swiper-scrollbar-right,4px); top: var(--swiper-scrollbar-sides-offset,1%); width: var(--swiper-scrollbar-size,4px); z-index: 50; }.swiper-scrollbar-drag{ background: var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5)); border-radius: var(--swiper-scrollbar-border-radius,10px); height: 100%; left: 0px; position: relative; top: 0px; width: 100%; }.swiper-scrollbar-cursor-drag{ cursor: move; }.swiper-scrollbar-lock{ display: none; }.swiper-zoom-container{ align-items: center; display: flex; height: 100%; justify-content: center; text-align: center; width: 100%; }.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg{ max-height: 100%; max-width: 100%; object-fit: contain; }.swiper-slide-zoomed{ cursor: move; touch-action: none; }.swiper .swiper-notification{ left: 0px; opacity: 0; pointer-events: none; position: absolute; top: 0px; z-index: -1000; }.swiper-free-mode > .swiper-wrapper{ margin: 0px auto; transition-timing-function: ease-out; }.swiper-grid > .swiper-wrapper{ flex-wrap: wrap; }.swiper-grid-column > .swiper-wrapper{ flex-flow: column wrap; }.swiper-fade.swiper-free-mode .swiper-slide{ transition-timing-function: ease-out; }.swiper-fade .swiper-slide{ pointer-events: none; transition-property: opacity; }.swiper-fade .swiper-slide .swiper-slide{ pointer-events: none; }.swiper-fade .swiper-slide-active, .swiper-fade .swiper-slide-active .swiper-slide-active{ pointer-events: auto; }.swiper.swiper-cube{ overflow: visible; }.swiper-cube .swiper-slide{ backface-visibility: hidden; height: 100%; pointer-events: none; transform-origin: 0px 0px; visibility: hidden; width: 100%; z-index: 1; }.swiper-cube .swiper-slide .swiper-slide{ pointer-events: none; }.swiper-cube.swiper-rtl .swiper-slide{ transform-origin: 100% 0px; }.swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-active .swiper-slide-active{ pointer-events: auto; }.swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-next, .swiper-cube .swiper-slide-prev{ pointer-events: auto; visibility: visible; }.swiper-cube .swiper-cube-shadow{ bottom: 0px; height: 100%; left: 0px; opacity: 0.6; position: absolute; width: 100%; z-index: 0; }.swiper-cube .swiper-cube-shadow::before{ background: rgb(0, 0, 0); inset: 0px; content: ""; filter: blur(50px); position: absolute; }.swiper-cube .swiper-slide-next + .swiper-slide{ pointer-events: auto; visibility: visible; }.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom, .swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left, .swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right, .swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{ backface-visibility: hidden; z-index: 0; }.swiper.swiper-flip{ overflow: visible; }.swiper-flip .swiper-slide{ backface-visibility: hidden; pointer-events: none; z-index: 1; }.swiper-flip .swiper-slide .swiper-slide{ pointer-events: none; }.swiper-flip .swiper-slide-active, .swiper-flip .swiper-slide-active .swiper-slide-active{ pointer-events: auto; }.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom, .swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left, .swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right, .swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{ backface-visibility: hidden; z-index: 0; }.swiper-creative .swiper-slide{ backface-visibility: hidden; overflow: hidden; transition-property: transform, opacity, height; }.swiper.swiper-cards{ overflow: visible; }.swiper-cards .swiper-slide{ backface-visibility: hidden; overflow: hidden; transform-origin: center bottom; }/* ==== inline ==== */
#company-introduce .container{ display: flex; justify-content: center; margin-top: 70px; max-height: 500px; position: relative; }.container .conleft{ border-bottom: 3px solid rgb(219, 220, 220); border-top: 3px solid rgb(219, 220, 220); width: 35%; }.container .conleft .list{ height: 100%; }.container .conleft .list .box{ align-items: center; border-bottom: 1px solid rgb(219, 220, 220); display: flex; font-weight: 300; height: 33.33%; justify-content: center; overflow: hidden; padding: 0px 20px; position: relative; z-index: 1; }.container .conleft .list .box:hover{ color: rgb(255, 255, 255); }.container .conleft .list .box:not(:hover){ transition: color 0.5s 0.3s; }.container .conleft .list .box::after, .container .conleft .list .box::before{ background: rgb(230, 33, 42); content: ""; height: calc(50% + 1px); left: 0px; position: absolute; transform: scaleY(0); transform-origin: center center; transition: transform 0.4s; width: 100%; z-index: -1; }.container .conleft .list .box::before{ top: 0px; transform-origin: center bottom; }.container .conleft .list .box::after{ bottom: 0px; transform-origin: center top; }.container .conleft .list .box:hover::after, .container .conleft .list .box:hover::before{ transform: scaleY(1); }.container .conleft .list .box .op{ height: 100%; position: relative; }.container .conleft .list .box .beforehover{ display: block; }.container .conleft .list .box .afterhover, .container .conleft .list .box:hover .beforehover{ display: none; }.container .conleft .list .box:hover .afterhover{ display: block; }.container .conleft .list .box:first-child{ position: relative; text-align: center; }.container .conleft .list .box:first-child .op{ opacity: 0; position: absolute; transition: 0.6s; }.container .conleft .list .box:first-child .op .tag{ font-weight: 700; opacity: 0; position: absolute; top: 30px; transition: 0.6s; width: 100%; }.container .conleft .list .box:first-child .op .tag.activetag{ opacity: 0.6; }.container .conleft .list .box:first-child .op .text{ align-items: center; display: flex; font-size: 18px; height: 100%; opacity: 0; transform: translateY(40px); transition: 0.6s; }.container .conleft .list .box:first-child .op .text.enter-active{ opacity: 1; transform: translateY(0px); z-index: 2; }.container .conleft .list .box:first-child .op .text.leave-active{ opacity: 0; transform: translateY(-40px); z-index: 1; }.container .conleft .list .box:first-child .op.active{ opacity: 1; }.container .conleft .list .box:nth-child(2) .op{ align-items: center; display: flex; }.container .conleft .list .box:nth-child(2) .op .afterhover, .container .conleft .list .box:nth-child(2) .op .beforehover{ font-size: 22px; }.container .conleft .list .box:nth-child(2) .op .afterhover p{ margin-bottom: 5px; }.container .conleft .list .box:nth-child(3){ font-size: 14px; }.container .conleft .list .box:nth-child(3) .op{ align-items: center; display: flex; }.container .conleft .list .box:last-child{ border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }.container .conright{ height: 500px; width: 65%; }.container .conright img{ display: block; height: 100%; object-fit: cover; width: 100%; }.container .mobile-card{ background: rgb(255, 255, 255); display: none; }.container .mobile-card, .container .mobile-card .item:nth-child(2){ border: 1px solid rgb(219, 220, 220); }.container .mobile-card .item{ padding: 20px; text-align: center; }
@media screen and (max-width: 1024px) {#company-introduce .container{ flex-direction: column; max-height: none; }.container .conleft{ display: none; }.container .conright{ height: auto; width: 100%; }.container .mobile-card{ display: block; }
}
@media screen and (max-width: 900px) {#company-introduce .container{ margin-top: 50px; }
}/* ==== inline ==== */
.productshow{ position: relative; }.productshow .pro-slider{ margin-top: 70px; width: 100%; }.productshow .pro-slider_item{ display: flex; justify-content: space-between; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_img{ align-items: center; display: flex; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_img img{ opacity: 1; transition-delay: 0.3s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content{ margin-top: 40px; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > *{ opacity: 1; transform: none; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :first-child{ transition-delay: 0.3s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(2){ transition-delay: 0.4s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(3){ transition-delay: 0.5s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(4){ transition-delay: 0.6s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(5){ transition-delay: 0.7s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(6){ transition-delay: 0.8s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(7){ transition-delay: 0.9s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(8){ transition-delay: 1s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(9){ transition-delay: 1.1s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(10){ transition-delay: 1.2s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(11){ transition-delay: 1.3s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(12){ transition-delay: 1.4s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(13){ transition-delay: 1.5s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(14){ transition-delay: 1.6s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(15){ transition-delay: 1.7s; }.productshow .pro-slider_img{ background: rgb(255, 255, 255); border-radius: 20px; width: 50%; }.productshow .pro-slider_img img{ width: 100%; }.productshow .pro-slider_content{ width: 45%; }.productshow .pro-slider_content > *{ opacity: 0; transform: translateY(25px); transition: 0.4s; }.productshow .pro-slider_content .promeunnum{ font-size: 20px; }.productshow .pro-slider_content .promeuntitle{ color: rgb(230, 33, 42); font-size: 35px; font-weight: 500; line-height: 1.2; margin-top: 5px; white-space: nowrap; }.productshow .pro-slider_content .device-table{ color: rgb(51, 51, 51); font-size: 14px; }.productshow .pro-slider_content .table{ margin-top: 50px; }.productshow .pro-slider_content .table .tabs{ align-items: flex-end; background: rgb(247, 248, 252); border-bottom: 1px solid rgb(221, 221, 221); display: flex; justify-content: center; margin-bottom: 20px; position: relative; }.productshow .pro-slider_content .table .tabs .tab{ align-items: center; color: rgb(0, 0, 0); cursor: pointer; display: flex; font-size: 20px; font-weight: 300; justify-content: center; margin: 0px 2px; padding: 12px 32px; position: relative; }.productshow .pro-slider_content .table .tabs .tab.active{ background: radial-gradient(rgba(38, 35, 118, 0.05), rgb(255, 255, 255)); border-width: 1px 1px medium; border-style: solid solid none; border-color: rgb(221, 221, 221) rgb(221, 221, 221) currentcolor; border-image: none; border-radius: 30px 30px 0px 0px; color: rgb(230, 33, 42); margin-bottom: -1px; z-index: 1; }.productshow .pro-slider_content .table .row{ border-bottom: 1px solid rgb(221, 221, 221); display: flex; }.productshow .pro-slider_content .table .row .key{ border-right: 1px solid rgb(221, 221, 221); font-weight: 400; line-height: 2; padding: 10px 0px 10px 10px; width: 20%; }.productshow .pro-slider_content .table .row .value{ color: rgb(90, 90, 95); line-height: 2; opacity: 0.9; padding: 10px 0px 10px 10px; width: 80%; }.productshow .pro-slider_pagination{ position: absolute; right: 13%; text-align: center; top: 50%; transform: translateY(-50%); z-index: 21; bottom: auto !important; left: auto !important; width: 11px !important; }.productshow .pro-slider_pagination .swiper-pagination-bullet{ background: rgb(6, 39, 68); border-radius: 10px; display: block; height: 11px; margin: 8px 0px; opacity: 0.2; transition: 0.3s; width: 11px; }.productshow .pro-slider_pagination .swiper-pagination-bullet-active{ background: rgb(38, 35, 118); height: 30px; opacity: 1; }.productshow .proswiper-mobile{ display: none; }
@media screen and (max-width: 1024px) {.productshow .pro-slider_pagination{ right: 0px; }
}
@media screen and (max-width: 900px) {#product-show .title{ padding-bottom: 30px; }.productshow{ display: block; padding: 0px !important; }.productshow .proswiper{ display: none; }.productshow .promenu{ height: 100%; padding: 0px 5vw 40px; position: static; }.productshow .prolist, .productshow .promenu .promenumain .promenusub{ display: none; }.productshow .proswiper-mobile{ display: block; padding: 20px; position: relative; }.productshow .proswiper-mobile .mySwiper{ background: rgb(255, 255, 255); border-radius: 15px; height: 100%; padding-bottom: 15px; text-align: center; width: 100%; }.productshow .proswiper-mobile .mySwiper img{ display: block; height: 100%; margin: 0px auto; width: 80%; }.productshow .proswiper-mobile .mySwiper .title{ font-size: 18px; font-weight: 700; margin-top: 10px; }.productshow .proswiper-mobile .mySwiper .text{ font-size: 12px; }.productshow .proswiper-mobile .pagination{ bottom: -16px; display: flex; gap: 20px; position: absolute; right: 50%; transform: translate(50%); z-index: 10; }.productshow .proswiper-mobile .pagination .pagination-dot{ background-color: rgba(255, 255, 255, 0.65); border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 10px; height: 12px; transition: background-color 0.3s, transform 0.3s; width: 12px; }.productshow .proswiper-mobile .pagination .pagination-dot.active{ background: rgb(38, 35, 118); }
}
@media screen and (max-width: 600px) {.productshow .promenu{ margin-top: 0px; padding: 0px 5vw 20px; }.productshow .promenu .promenumain .promenutitle .title{ font-size: 28px; }
}/* ==== inline ==== */
.tb-pd{ margin: 70px 0px; }#application .container{ align-items: center; display: flex; flex-direction: column; justify-content: center; margin-top: 70px; }.switch-bar{ background-color: rgb(243, 244, 246); border-radius: 14px; display: inline-block; padding: 4px; position: relative; }.switch-bar .slider{ background: rgb(255, 255, 255); border-radius: 10px; bottom: 4px; left: 0px; position: absolute; top: 4px; transition: 0.3s; z-index: 5; }.switch-bar .tabs{ display: flex; position: relative; z-index: 10; }.switch-bar .tab{ align-items: center; color: rgb(75, 85, 99); cursor: pointer; display: flex; font-size: 13px; justify-content: center; padding: 10px 40px; white-space: nowrap; }.switch-bar .tab.active{ color: rgb(51, 51, 51); cursor: default; font-weight: 700; }.card-list{ display: grid; gap: 32px; grid-template-columns: repeat(3, minmax(0px, 1fr)); margin-top: 70px; opacity: 0; transform: translateY(60px); transition: 0.8s cubic-bezier(0.25, 1, 0.5, 1) 0.05s; }.card-list.visible{ opacity: 1; transform: translateY(0px); }.card-list .carditem{ background: rgb(255, 255, 255); border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px; overflow: hidden; padding: 35px; position: relative; transition: transform 0.3s; }.card-list .carditem:hover{ transform: translateY(-5px); }.card-list .carditem:hover .glow{ opacity: 0.3; transform: scale(1.5); transition: transform 0.3s; }.card-list .carditem .glow{ background-color: var(--glow-color); border-radius: 9999px; filter: blur(40px); height: 100px; opacity: 0.2; position: absolute; right: -80px; top: -80px; width: 100px; }.card-list .carditem .dal{ background: var(--line-color); height: 15px; width: 4px; }.card-list .carditem h3{ align-items: center; display: flex; font-size: 20px; gap: 10px; line-height: 28px; margin-bottom: 20px; }.card-list .carditem p{ color: rgb(75, 85, 99); font-size: 14px; margin-bottom: 25px; }.card-list .carditem .card-bottom-line{ background: var(--line-color); bottom: 0px; height: 4px; left: 0px; position: absolute; width: 100%; }
@media screen and (max-width: 1024px) {.card-list{ grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media screen and (max-width: 600px) {#application .card-list, #application .container{ margin-top: 40px; }.card-list{ grid-template-columns: repeat(1, minmax(0px, 1fr)); }.card-list .carditem{ padding: 20px; }
}/* ==== inline ==== */
.hz-news .mySwiper{ margin-top: 70px; padding-bottom: 48px; padding-left: 30px; }.hz-news .mySwiper .swiper-slide{ border-radius: 12px; overflow: hidden; transition: transform 0.3s; }.hz-news .mySwiper .infobox{ background: rgb(255, 255, 255); border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 20px; cursor: pointer; height: 630px; overflow: hidden; padding-bottom: 40px; transition: 0.3s ease-in-out; }.hz-news .mySwiper .infobox .card-img{ height: 50%; position: relative; }.hz-news .mySwiper .infobox .card-img img{ display: block; height: 100%; object-fit: cover; width: 100%; }.hz-news .mySwiper .infobox .card-body{ height: 50%; padding: 40px 40px 0px; }.hz-news .mySwiper .infobox .card-body h3{ font-size: 22px; font-weight: 300; margin: 12px 0px; }.hz-news .mySwiper .infobox .card-body p{ display: -webkit-box; font-size: 17px; margin-top: 30px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; color: rgb(90, 90, 95); opacity: 0.9; }.hz-news .mySwiper .infobox:hover{ transform: scale(1.03); }.pagination .paddleNav_grid{ display: flex; gap: 20px; justify-content: center; }.pagination .paddleNav_grid button{ align-items: center; border: 0px; border-radius: 50%; cursor: pointer; display: flex; height: 50px; justify-content: center; outline: none; width: 50px; }.pagination .paddleNav_grid button.disabled svg path{ fill: rgb(204, 204, 204); }.modal-backdrop{ align-items: start; backdrop-filter: blur(20px); background-color: rgba(0, 0, 0, 0.48); display: flex; height: 100vh; justify-content: center; left: 0px; overflow-y: auto; position: fixed; top: 0px; width: 100%; z-index: 9999; }.modal-content{ background: rgb(255, 255, 255); border-radius: 12px; height: auto; margin-top: 40px; padding: 76px; position: relative; scrollbar-color: rgb(153, 153, 153) rgb(241, 241, 241); scrollbar-width: thin; width: min(1260px, 87.5vw); }.modal-content h2{ font-size: 40px; font-weight: 600; margin-bottom: 64px; }.modal-content .info p{ color: rgb(110, 110, 115); display: flex; font-size: 25px; justify-content: center; line-height: 1.6; margin-bottom: 5px; }.modal-content .info img{ border-radius: 8px; margin: 20px 0px; max-width: 100%; }.BaseModal_closeButton{ position: absolute; right: 16px; top: 20px; }.BaseModal_closeButton .modal-close{ align-items: center; background: rgb(0, 0, 0); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 50%; cursor: pointer; display: flex; font-size: 24px; height: 36px; justify-content: center; outline: none; width: 36px; }.BaseModal_closeButton .modal-close .IconControl_centeredIcon___gj73{ height: 20px; width: 20px; fill: rgb(255, 255, 255); }.fade-enter-active, .fade-leave-active{ transition: opacity 0.3s; }.fade-enter-from, .fade-leave-to{ opacity: 0; }
@media screen and (max-width: 1500px) {.hz-news .mySwiper .infobox .card-body h3{ font-size: 20px; }.hz-news .mySwiper .infobox .card-body p{ font-size: 16px; }
}
@media screen and (max-width: 1000px) {.hz-news .mySwiper{ margin-top: 50px; }.hz-news .mySwiper .infobox .card-body{ padding: 30px; }.hz-news .mySwiper .infobox .card-body h3{ font-size: 18px; }.hz-news .mySwiper .infobox .card-body p{ font-size: 14px; }
}
@media screen and (max-width: 789px) {.hz-news .mySwiper .infobox{ height: 500px; }.hz-news .mySwiper .infobox .card-body{ padding: 20px; }.hz-news .mySwiper .infobox .card-body h3{ font-size: 16px; margin: 0px; }.hz-news .mySwiper .infobox .card-body p{ font-size: 12px; }
}
@media screen and (max-width: 689px) {.hz-news .mySwiper{ padding-left: 10px; padding-right: 10px; }.modal-content{ margin: 30px; padding: 30px; }.modal-content h2{ font-size: 25px; margin-bottom: 20px; }.modal-content .info p{ font-size: 16px; }.BaseModal_closeButton{ top: 10px; }.BaseModal_closeButton .modal-close{ height: 25px; width: 25px; }
}
@media screen and (max-width: 600px) {.hz-news .mySwiper .infobox{ height: 500px; }.hz-news .mySwiper .infobox .card-img{ height: 55%; }
}/* ==== inline ==== */
.brandbox{ margin-top: 70px; }.brandbox .list{ display: flex; flex-wrap: wrap; gap: 20px; height: auto; margin-bottom: 20px; width: 100%; }.brandbox .list .item{ height: 81px; position: relative; width: calc(12.5% - 18px); }.brandbox .list .item img{ height: 100%; left: 0px; object-fit: contain; position: absolute; width: 100%; }.brandbox .list .item .item-name{ align-items: center; color: rgb(255, 255, 255); display: flex; height: 100%; justify-content: center; left: 50%; opacity: 0; position: absolute; top: 50%; transform: translate(-50%, -50%); transition: opacity 0.4s; width: 100%; }.brandbox .list .item .item-name::after{ background: rgb(230, 33, 42); content: ""; height: 100%; left: 0px; position: absolute; transform: scaleY(0); transform-origin: center top; transition: transform 0.4s cubic-bezier(0.25, 1.5, 0.5, 1); width: 100%; z-index: -1; }.brandbox .list .item:hover .item-name{ opacity: 1; }.brandbox .list .item:hover .item-name::after{ transform: scaleY(1); }
@media screen and (max-width: 689px) {.brandbox{ margin-top: 40px; }.brandbox .list .item{ width: calc(25% - 18px); }
}/* ==== http://hz.oto.cn/_nuxt/entry.CvLNy0Yf.css ==== */
.header-box.isTop{ background-color: rgba(0, 0, 0, 0.2); box-shadow: none; color: rgb(255, 255, 255); }.header-box.isTop .right .menubtn .diglog{ color: rgb(255, 255, 255); }.header-box.isTop .right .menubtn .arrow{ border-left: 3px solid rgb(255, 255, 255); border-top: 3px solid rgb(255, 255, 255); }.header-box.isTop .right .menu a{ color: rgb(255, 255, 255); }.header-box.isTop::after{ background: linear-gradient(90deg, transparent 0px, transparent 10%, rgba(255, 255, 255, 0.3) 20%, rgba(255, 255, 255, 0.4) 30%, rgba(255, 255, 255, 0.5) 40%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0.4) 70%, rgba(255, 255, 255, 0.3) 80%, transparent 90%, transparent); content: ""; display: block; height: 1px; left: 0px; position: absolute; top: 100px; width: 100%; z-index: 99; }.header-box{ background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 10px; height: 100px; left: 0px; position: fixed; top: 0px; transform: translateY(0px); transition: 0.3s ease-in-out; width: 100%; z-index: 99; }.header-box .left .logo{ align-items: center; display: flex; left: 15vw; position: absolute; text-align: center; top: 50%; transform: translateY(-50%); }.header-box .left .logo img{ height: 48px; object-fit: contain; width: 97px; }.header-box .left .logo .name{ font-size: 24px; margin-left: 5px; }.header-box .right{ align-items: center; display: flex; gap: 70px; overflow: hidden; position: absolute; right: 15vw; top: 50%; transform: translateY(-50%); transition: 0.3s ease-in-out; }.header-box .right .menubtn{ align-items: center; display: flex; gap: 10px; }.header-box .right .menubtn .diglog{ cursor: pointer; display: flex; flex-direction: column; font-size: 20px; }.header-box .right .menubtn .diglog .open{ transform: translateY(50%); transition: transform 0.5s; }.header-box .right .menubtn .diglog .close{ transform: translateY(30px); transition: transform 0.5s; }.header-box .right .menubtn .arrow-group{ align-items: center; display: flex; margin-left: 5px; }.header-box .right .menubtn .arrow{ animation: 2s ease 0s infinite normal none running flash-58f1e745; border-left: 3px solid rgb(230, 33, 42); border-top: 3px solid rgb(230, 33, 42); display: inline-block; opacity: 0.2; transform: rotate(-45deg); }.header-box .right .menubtn .arrow.big{ animation-delay: 0.8s; height: 12px; width: 12px; }.header-box .right .menubtn .arrow.mid{ animation-delay: 0.4s; height: 9px; width: 9px; }.header-box .right .menubtn .arrow.small{ animation-delay: 0s; height: 6px; width: 6px; }
@keyframes flash-58f1e745 {0%{ opacity: 0.2; transform: rotate(-45deg) scale(1); }30%{ opacity: 1; transform: rotate(-45deg) scale(1.2); }60%{ opacity: 0.2; transform: rotate(-45deg) scale(1); }100%{ opacity: 0.2; transform: rotate(-45deg) scale(1); }
}.header-box .right .menu{ display: flex; opacity: 0; transform: translateY(40px); transition: 0.5s; }.header-box .right .menu .menu-item{ font-size: 17px; font-weight: 400; margin-left: 4vw; position: relative; }.header-box .right .menu .menu-item a::after{ background: rgb(230, 33, 42); bottom: -2px; content: ""; height: 2px; left: 0px; position: absolute; transition: width 0.3s; width: 0px; }.header-box .right .menu .menu-item:hover a{ color: rgb(230, 33, 42); }.header-box .right .menu .menu-item:hover a::after{ width: 100%; }.header-box .right.isshow .menubtn .diglog .open{ transform: translateY(-30px); transition: transform 0.5s; }.header-box .right.isshow .menubtn .diglog .close{ transform: translateY(-50%); transition: transform 0.5s; }.header-box .right.isshow .menubtn .arrow-group{ opacity: 0; pointer-events: none; transform: translate(6px); transition: opacity 0.18s, visibility 0.18s, transform 0.18s; visibility: hidden; }.header-box .right.isshow .menu{ opacity: 1; transform: translateY(0px); }.header-box.hide{ transform: translateY(-100%); }
@media screen and (max-width: 1420px) {.header-box .left .logo{ left: 3.5vw; }.header-box .right{ right: 3.5vw; }
}
@media screen and (max-width: 1024px) {.header-box .left .logo{ left: 5vw; }.header-box .right{ gap: 50px; right: 5vw; }.header-box .right .menu .menu-item{ font-size: 16px; margin-left: 3vw; }
}
@media screen and (max-width: 900px) {.header-box.isTop{ position: relative; }.header-box.isTop::after{ top: 50px; }.header-box{ height: 50px; }.header-box .left .logo{ height: 50px; left: 50%; top: 50%; transform: translate(-50%, -50%); }.header-box .left .logo img{ width: 60px; }.header-box .left .logo .name{ font-size: 18px; }.header-box .right{ display: none; }
}.footer{ background: rgb(230, 33, 42); height: 100%; }.footer .footMain{ box-sizing: border-box; display: flex; flex-direction: column; height: 100%; justify-content: space-between; padding-bottom: 30px; padding-top: 60px; width: 100%; }.footer .footMain .container{ box-sizing: border-box; display: flex; gap: 100px; padding: 0px 80px; }.footer .footMain .container .menu{ color: rgb(255, 255, 255); font-size: 20px; }.footer .footMain .container .menu .info-title{ letter-spacing: -1px; margin-bottom: 20px; }.footer .footMain .container .menu .qrcode{ display: flex; gap: 30px; justify-content: center; }.footer .footMain .container .menu .qrcode img{ height: 140px; width: 140px; }.footer .footMain .container .menu .item{ margin-bottom: 10px; opacity: 0.5; }.footer .footMain .container .menu .item.active{ opacity: 1; }.footer .footMain .container .contact .items{ opacity: 0; position: absolute; }.footer .footMain .container .contact .items.show{ opacity: 1; }.footer .footMain .container .contact .item{ opacity: 0; transform: translateY(10px); transition: 0.5s; }.footer .footMain .container .contact .item.active{ opacity: 1; transform: translateY(0px); }.footer .footMain .container .email{ color: rgb(255, 255, 255); margin-left: auto; }.footer .footMain .container .email .ce-title{ display: flex; font-size: 18px; justify-content: space-between; line-height: 135%; margin-bottom: 20px; }.footer .footMain .container .email .mail{ font-size: 40px; }.footer .footMain .otherInfo{ color: rgb(255, 255, 255); display: flex; font-size: 20px; justify-content: center; margin-top: 20px; padding: 0px 3%; }.footer .footMain .otherInfo a{ color: rgb(255, 255, 255); }.footer .footMain .scrollyfont{ background: transparent; height: auto; overflow: hidden; position: relative; white-space: nowrap; width: 100%; }.footer .footMain .scrollyfont .scroll-track{ animation: 60s linear 0s infinite normal none running scroll-left-bc2608ce; display: inline-block; opacity: 0.4; white-space: nowrap; }.footer .footMain .scrollyfont span{ color: rgb(255, 255, 255); display: inline-block; font-family: PublicSans-Regular; font-size: 300px; letter-spacing: -20px; padding-right: 100px; -webkit-font-smoothing: antialiased; text-rendering: optimizelegibility; }
@keyframes scroll-left-bc2608ce {0%{ transform: translate(0px); }100%{ transform: translate(-50%); }
}
@media screen and (max-width: 1200px) {.footer .footMain .container{ width: 100%; }.footer .footMain .container .con-center .row{ gap: 20px; }
}
@media screen and (max-width: 1400px) {.footer .footMain .container{ padding: 0px 30px; }.footer .footMain .container .menu{ font-size: 16px; }.footer .footMain .container .menu .qrcode img{ height: 120px; width: 120px; }.footer .footMain .container .email .mail{ font-size: 40px; }
}
@media screen and (max-width: 1100px) {.footer .footMain .scrollyfont span{ font-size: 250px; }.footer .footMain .container .menu{ font-size: 14px; }.footer .footMain .container .menu .qrcode img{ height: 100px; width: 100px; }.footer .footMain .container .email .mail{ font-size: 30px; }.footer .footMain .otherInfo{ font-size: 14px; }
}
@media screen and (max-width: 900px) {.footer .footMain .email{ display: none; }
}
@media screen and (max-width: 689px) {.footer .footMain{ min-height: 400px; }.footer .footMain .container .menu:first-child, .footer .footMain .scrollyfont{ display: none; }.footer .footMain .otherInfo{ font-size: 12px; }
}html{ font-size: 16px; }
@font-face { font-family: PublicSans-Regular; src: url("/template/pc/skin/hz/fonts/PublicSans-Regular-14.woff2"); }
@font-face { font-display: swap; font-family: DreamHan; font-style: normal; font-weight: 400; src: url("/template/pc/skin/hz/fonts/DreamHanSansCN-W7.ttf") format("truetype"); }.body{ display: flex; flex-direction: column; font-family: Alibaba-PuHuiTi-Regular; height: 100%; min-height: 100vh; scroll-behavior: smooth; }.cursor-trail{ background: rgb(38, 35, 118); border-radius: 50%; height: 12px; pointer-events: none; position: fixed; transform: translate(-50%, -50%); transition: transform 0.3s cubic-bezier(0.25, 1.5, 0.5, 1), background-color 0.2s; width: 12px; z-index: 9999; }.cursor-trail.light{ background: rgb(255, 255, 255); }.cursor-trail.enlarged{ transform: translate(-50%, -50%) scale(5); }.cursor-trail.target{ transform: translate(-50%, -50%) scale(1.5); }.cursor-trail.enlarged::after{ color: rgb(255, 255, 255); content: "Click"; left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%) scale(0.2); }
@media screen and (max-width: 1024px) {.cursor-trail{ display: none; }
}/* ==== http://hz.oto.cn/_nuxt/index.BRvlXBKN.css ==== */
@font-face{ font-family: swiper-icons; font-style: normal; font-weight: 400; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA"); }.swiper-virtual .swiper-slide{ backface-visibility: hidden; transform: translateZ(0px); }.swiper-virtual.swiper-css-mode .swiper-wrapper::after{ content: ""; left: 0px; pointer-events: none; position: absolute; top: 0px; }.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{ height: 1px; width: var(--swiper-virtual-size); }.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{ height: var(--swiper-virtual-size); width: 1px; }:root{ --swiper-navigation-size: 44px; }.swiper-button-next, .swiper-button-prev{ align-items: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); cursor: pointer; display: flex; height: var(--swiper-navigation-size); justify-content: center; margin-top: calc(0px - var(--swiper-navigation-size)/2); position: absolute; top: var(--swiper-navigation-top-offset,50%); width: calc(var(--swiper-navigation-size)/44*27); z-index: 10; }.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{ cursor: auto; opacity: 0.35; pointer-events: none; }.swiper-button-next.swiper-button-hidden, .swiper-button-prev.swiper-button-hidden{ cursor: auto; opacity: 0; pointer-events: none; }.swiper-navigation-disabled .swiper-button-next, .swiper-navigation-disabled .swiper-button-prev{ display: none !important; }.swiper-button-next svg, .swiper-button-prev svg{ height: 100%; object-fit: contain; transform-origin: center center; width: 100%; }.swiper-rtl .swiper-button-next svg, .swiper-rtl .swiper-button-prev svg{ transform: rotate(180deg); }.swiper-button-prev, .swiper-rtl .swiper-button-next{ left: var(--swiper-navigation-sides-offset,10px); right: auto; }.swiper-button-lock{ display: none; }.swiper-button-next::after, .swiper-button-prev::after{ font-family: swiper-icons; font-size: var(--swiper-navigation-size); font-variant: normal; letter-spacing: 0px; line-height: 1; text-transform: none !important; }.swiper-button-prev::after, .swiper-rtl .swiper-button-next::after{ content: "prev"; }.swiper-button-next, .swiper-rtl .swiper-button-prev{ left: auto; right: var(--swiper-navigation-sides-offset,10px); }.swiper-button-next::after, .swiper-rtl .swiper-button-prev::after{ content: "next"; }.swiper-pagination{ position: absolute; text-align: center; transform: translateZ(0px); transition: opacity 0.3s; z-index: 10; }.swiper-pagination.swiper-pagination-hidden{ opacity: 0; }.swiper-pagination-disabled > .swiper-pagination, .swiper-pagination.swiper-pagination-disabled{ display: none !important; }.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{ bottom: var(--swiper-pagination-bottom,8px); left: 0px; top: var(--swiper-pagination-top,auto); width: 100%; }.swiper-pagination-bullets-dynamic{ font-size: 0px; overflow: hidden; }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{ position: relative; transform: scale(0.33); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{ transform: scale(1); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{ transform: scale(0.66); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{ transform: scale(0.33); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{ transform: scale(0.66); }.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{ transform: scale(0.33); }.swiper-pagination-bullet{ background: var(--swiper-pagination-bullet-inactive-color,#000); border-radius: var(--swiper-pagination-bullet-border-radius,50%); display: inline-block; height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px)); opacity: var(--swiper-pagination-bullet-inactive-opacity,.2); width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px)); }button.swiper-pagination-bullet{ appearance: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; box-shadow: none; margin: 0px; padding: 0px; }.swiper-pagination-clickable .swiper-pagination-bullet{ cursor: pointer; }.swiper-pagination-bullet:only-child{ display: none !important; }.swiper-pagination-bullet-active{ background: var(--swiper-pagination-color,var(--swiper-theme-color)); opacity: var(--swiper-pagination-bullet-opacity,1); }.swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical > .swiper-pagination-bullets{ left: var(--swiper-pagination-left,auto); right: var(--swiper-pagination-right,8px); top: 50%; transform: translate3d(0px, -50%, 0px); }.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet{ display: block; margin: var(--swiper-pagination-bullet-vertical-gap,6px) 0; }.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic{ top: 50%; transform: translateY(-50%); width: 8px; }.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{ display: inline-block; transition: transform 0.2s, top 0.2s; }.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{ margin: 0 var(--swiper-pagination-bullet-horizontal-gap,4px); }.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{ left: 50%; transform: translate(-50%); white-space: nowrap; }.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{ transition: transform 0.2s, left 0.2s; }.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{ transition: transform 0.2s, right 0.2s; }.swiper-pagination-fraction{ color: var(--swiper-pagination-fraction-color,inherit); }.swiper-pagination-progressbar{ background: var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25)); position: absolute; }.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ background: var(--swiper-pagination-color,var(--swiper-theme-color)); height: 100%; left: 0px; position: absolute; top: 0px; transform: scale(0); transform-origin: left top; width: 100%; }.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{ transform-origin: right top; }.swiper-horizontal > .swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{ height: var(--swiper-pagination-progressbar-size,4px); left: 0px; top: 0px; width: 100%; }.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-vertical, .swiper-vertical > .swiper-pagination-progressbar{ height: 100%; left: 0px; top: 0px; width: var(--swiper-pagination-progressbar-size,4px); }.swiper-pagination-lock{ display: none; }.swiper-scrollbar{ background: var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1)); border-radius: var(--swiper-scrollbar-border-radius,10px); position: relative; touch-action: none; }.swiper-scrollbar-disabled > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-disabled{ display: none !important; }.swiper-horizontal > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal{ bottom: var(--swiper-scrollbar-bottom,4px); height: var(--swiper-scrollbar-size,4px); left: var(--swiper-scrollbar-sides-offset,1%); position: absolute; top: var(--swiper-scrollbar-top,auto); width: calc(100% - var(--swiper-scrollbar-sides-offset, 1%)*2); z-index: 50; }.swiper-scrollbar.swiper-scrollbar-vertical, .swiper-vertical > .swiper-scrollbar{ height: calc(100% - var(--swiper-scrollbar-sides-offset, 1%)*2); left: var(--swiper-scrollbar-left,auto); position: absolute; right: var(--swiper-scrollbar-right,4px); top: var(--swiper-scrollbar-sides-offset,1%); width: var(--swiper-scrollbar-size,4px); z-index: 50; }.swiper-scrollbar-drag{ background: var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5)); border-radius: var(--swiper-scrollbar-border-radius,10px); height: 100%; left: 0px; position: relative; top: 0px; width: 100%; }.swiper-scrollbar-cursor-drag{ cursor: move; }.swiper-scrollbar-lock{ display: none; }.swiper-zoom-container{ align-items: center; display: flex; height: 100%; justify-content: center; text-align: center; width: 100%; }.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg{ max-height: 100%; max-width: 100%; object-fit: contain; }.swiper-slide-zoomed{ cursor: move; touch-action: none; }.swiper .swiper-notification{ left: 0px; opacity: 0; pointer-events: none; position: absolute; top: 0px; z-index: -1000; }.swiper-free-mode > .swiper-wrapper{ margin: 0px auto; transition-timing-function: ease-out; }.swiper-grid > .swiper-wrapper{ flex-wrap: wrap; }.swiper-grid-column > .swiper-wrapper{ flex-flow: column wrap; }.swiper.swiper-cube{ overflow: visible; }.swiper-cube .swiper-slide{ backface-visibility: hidden; height: 100%; pointer-events: none; transform-origin: 0px 0px; visibility: hidden; width: 100%; z-index: 1; }.swiper-cube .swiper-slide .swiper-slide{ pointer-events: none; }.swiper-cube.swiper-rtl .swiper-slide{ transform-origin: 100% 0px; }.swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-active .swiper-slide-active{ pointer-events: auto; }.swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-next, .swiper-cube .swiper-slide-prev{ pointer-events: auto; visibility: visible; }.swiper-cube .swiper-cube-shadow{ bottom: 0px; height: 100%; left: 0px; opacity: 0.6; position: absolute; width: 100%; z-index: 0; }.swiper-cube .swiper-cube-shadow::before{ background: rgb(0, 0, 0); inset: 0px; content: ""; filter: blur(50px); position: absolute; }.swiper-cube .swiper-slide-next + .swiper-slide{ pointer-events: auto; visibility: visible; }.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom, .swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left, .swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right, .swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{ backface-visibility: hidden; z-index: 0; }.swiper.swiper-flip{ overflow: visible; }.swiper-flip .swiper-slide{ backface-visibility: hidden; pointer-events: none; z-index: 1; }.swiper-flip .swiper-slide .swiper-slide{ pointer-events: none; }.swiper-flip .swiper-slide-active, .swiper-flip .swiper-slide-active .swiper-slide-active{ pointer-events: auto; }.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom, .swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left, .swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right, .swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{ backface-visibility: hidden; z-index: 0; }.swiper-creative .swiper-slide{ backface-visibility: hidden; overflow: hidden; transition-property: transform, opacity, height; }.swiper.swiper-cards{ overflow: visible; }.swiper-cards .swiper-slide{ backface-visibility: hidden; overflow: hidden; transform-origin: center bottom; }.banner-box{ height: 100%; width: 100%; }.banner-box .mySwiper{ position: relative; }.banner-box .mySwiper img{ height: 100%; width: 100%; }.banner-box .mySwiper .swiper-slide:first-child .img{ filter: brightness(0.5) contrast(1.1); }.banner-box .mySwiper .to-red-900\/70{ --tw-gradient-to: rgba(127,29,29,.7) var(--tw-gradient-to-position); }.banner-box .mySwiper .via-blue-800\/60{ --tw-gradient-stops: rgba(30,58,138,.8),rgba(30,64,175,.6),rgba(127,29,29,.7); }.banner-box .mySwiper .from-blue-900\/80{ --tw-gradient-from: rgba(30,58,138,.8); }.banner-box .mySwiper .absolute{ position: absolute; }.banner-box .mySwiper .inset-0{ inset: 0px; }.banner-box .mySwiper .bg-gradient-to-r{ background-image: linear-gradient(90deg, rgba(30, 58, 138, 0.8), rgba(30, 64, 175, 0.6), rgba(127, 29, 29, 0.7)); }.banner-box .mySwiper .container{ padding: 0px 12vw; position: absolute; top: 50%; transform: translateY(-50%); width: 100%; }.banner-box .mySwiper .container h1{ color: rgb(255, 255, 255); font-size: 72px; letter-spacing: -1.8px; line-height: 1; }.banner-box .mySwiper .container p{ color: rgb(255, 255, 255); font-size: 20px; line-height: 28px; max-width: 672px; }.banner-box .mySwiper .container .text-lg{ color: rgb(219, 234, 254); margin-bottom: 40px; }.banner-box .mySwiper .container .flex-col .btn-box{ align-items: center; background: rgb(230, 33, 42); border-radius: 10px; box-sizing: border-box; color: rgb(255, 255, 255); cursor: pointer; display: flex; gap: 5px; height: 74px; justify-content: center; white-space: nowrap; width: 227px; }.banner-box .mySwiper .container .flex-col .btn-box span{ font-size: 20px; }.banner-box .mySwiper .container .flex-col .btn-box:hover{ background: rgb(239, 68, 68); }.banner-box .mySwiper .extend{ align-items: center; bottom: 50px; display: flex; flex-direction: column; left: 50%; position: absolute; transform: translate(-50%); }.banner-box .mySwiper .extend .text-white{ color: rgba(255, 255, 255, 0.8); font-size: 16px; line-height: 25px; margin-bottom: 10px; }.banner-box .mySwiper .extend .rounded-full{ border: 2px solid rgba(255, 255, 255, 0.5); border-radius: 9999px; box-sizing: border-box; display: flex; height: 50px; justify-content: center; padding-top: 10px; width: 30px; }.banner-box .mySwiper .extend .rounded-full .animate-bounce{ animation: 1s ease 0s infinite normal none running bounce-7cc52a1f; background-color: rgba(255, 255, 255, 0.8); border-radius: 9999px; height: 10px; width: 5px; }
@keyframes bounce-7cc52a1f {0%, 100%{ animation-timing-function: cubic-bezier(0.8, 0, 1, 1); transform: translateY(-25%); }50%{ animation-timing-function: cubic-bezier(0, 0, 0.2, 1); transform: none; }
}.banner-box .mySwiper .border{ backdrop-filter: blur(16px); background-color: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 15px; bottom: 150px; box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px; box-sizing: border-box; padding: 30px; position: absolute; right: 10%; width: 380px; }.banner-box .mySwiper .border .grid{ display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0px, 1fr)); }.banner-box .mySwiper .border .grid .text-center{ text-align: center; }.banner-box .mySwiper .border .grid .text-center .num{ font-size: 37px; font-weight: 700; line-height: 45px; }.banner-box .mySwiper .border .grid .text-center .num .plus{ font-size: 18px; vertical-align: super; }.banner-box .mySwiper .border .grid .text-center .text-sm{ color: rgba(255, 255, 255, 0.8); font-size: 17px; line-height: 25px; }
@media screen and (max-width: 1400px) {.banner-box .mySwiper .container h1{ font-size: 50px; }.banner-box .mySwiper .container p{ font-size: 16px; max-width: 480px; }.banner-box .mySwiper .container .flex-col .btn-box{ height: 60px; width: 180px; }.banner-box .mySwiper .container .flex-col .btn-box span{ font-size: 16px; }.banner-box .mySwiper .border{ width: 300px; }.banner-box .mySwiper .border .grid .text-center .num{ font-size: 30px; }.banner-box .mySwiper .border .grid .text-center .text-sm{ font-size: 15px; }
}
@media screen and (max-width: 1100px) {.banner-box .mySwiper .border, .banner-box .mySwiper .container .flex-col{ display: none; }
}
@media screen and (max-width: 1000px) {.banner-box .mySwiper .extend{ display: none; }
}
@media screen and (max-width: 768px) {.banner-box .mySwiper .container h1{ font-size: 30px; }.banner-box .mySwiper .container p{ font-size: 14px; max-width: 350px; }
}
@media screen and (max-width: 500px) {.banner-box .mySwiper .container h1{ font-size: 25px; }.banner-box .mySwiper .container p{ font-size: 12px; line-height: 20px; max-width: 300px; }
}#company-introduce .container{ display: flex; justify-content: center; margin-top: 70px; max-height: 500px; position: relative; }.container .conleft{ border-bottom: 3px solid rgb(219, 220, 220); border-top: 3px solid rgb(219, 220, 220); width: 35%; }.container .conleft .list{ height: 100%; }.container .conleft .list .box{ align-items: center; border-bottom: 1px solid rgb(219, 220, 220); display: flex; font-weight: 300; height: 33.33%; justify-content: center; overflow: hidden; padding: 0px 20px; position: relative; z-index: 1; }.container .conleft .list .box:hover{ color: rgb(255, 255, 255); }.container .conleft .list .box:not(:hover){ transition: color 0.5s 0.3s; }.container .conleft .list .box::after, .container .conleft .list .box::before{ background: rgb(230, 33, 42); content: ""; height: calc(50% + 1px); left: 0px; position: absolute; transform: scaleY(0); transform-origin: center center; transition: transform 0.4s; width: 100%; z-index: -1; }.container .conleft .list .box::before{ top: 0px; transform-origin: center bottom; }.container .conleft .list .box::after{ bottom: 0px; transform-origin: center top; }.container .conleft .list .box:hover::after, .container .conleft .list .box:hover::before{ transform: scaleY(1); }.container .conleft .list .box .op{ height: 100%; position: relative; }.container .conleft .list .box .beforehover{ display: block; }.container .conleft .list .box .afterhover, .container .conleft .list .box:hover .beforehover{ display: none; }.container .conleft .list .box:hover .afterhover{ display: block; }.container .conleft .list .box:first-child{ position: relative; text-align: center; }.container .conleft .list .box:first-child .op{ opacity: 0; position: absolute; transition: 0.6s; }.container .conleft .list .box:first-child .op .tag{ font-weight: 700; opacity: 0; position: absolute; top: 30px; transition: 0.6s; width: 100%; }.container .conleft .list .box:first-child .op .tag.activetag{ opacity: 0.6; }.container .conleft .list .box:first-child .op .text{ align-items: center; display: flex; font-size: 18px; height: 100%; opacity: 0; transform: translateY(40px); transition: 0.6s; }.container .conleft .list .box:first-child .op .text.enter-active{ opacity: 1; transform: translateY(0px); z-index: 2; }.container .conleft .list .box:first-child .op .text.leave-active{ opacity: 0; transform: translateY(-40px); z-index: 1; }.container .conleft .list .box:first-child .op.active{ opacity: 1; }.container .conleft .list .box:nth-child(2) .op{ align-items: center; display: flex; }.container .conleft .list .box:nth-child(2) .op .afterhover, .container .conleft .list .box:nth-child(2) .op .beforehover{ font-size: 22px; }.container .conleft .list .box:nth-child(2) .op .afterhover p{ margin-bottom: 5px; }.container .conleft .list .box:nth-child(3){ font-size: 14px; }.container .conleft .list .box:nth-child(3) .op{ align-items: center; display: flex; }.container .conleft .list .box:last-child{ border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }.container .conright{ height: 500px; width: 65%; }.container .conright img{ display: block; height: 100%; object-fit: cover; width: 100%; }.container .mobile-card{ background: rgb(255, 255, 255); display: none; }.container .mobile-card, .container .mobile-card .item:nth-child(2){ border: 1px solid rgb(219, 220, 220); }.container .mobile-card .item{ padding: 20px; text-align: center; }
@media screen and (max-width: 1024px) {#company-introduce .container{ flex-direction: column; max-height: none; }.container .conleft{ display: none; }.container .conright{ height: auto; width: 100%; }.container .mobile-card{ display: block; }
}
@media screen and (max-width: 900px) {#company-introduce .container{ margin-top: 50px; }
}.swiper-fade.swiper-free-mode .swiper-slide{ transition-timing-function: ease-out; }.swiper-fade .swiper-slide{ pointer-events: none; transition-property: opacity; }.swiper-fade .swiper-slide .swiper-slide{ pointer-events: none; }.swiper-fade .swiper-slide-active, .swiper-fade .swiper-slide-active .swiper-slide-active{ pointer-events: auto; }.productshow{ position: relative; }.productshow .pro-slider{ margin-top: 70px; width: 100%; }.productshow .pro-slider_item{ display: flex; justify-content: space-between; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_img{ align-items: center; display: flex; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_img img{ opacity: 1; transition-delay: 0.3s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content{ margin-top: 40px; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > *{ opacity: 1; transform: none; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :first-child{ transition-delay: 0.3s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(2){ transition-delay: 0.4s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(3){ transition-delay: 0.5s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(4){ transition-delay: 0.6s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(5){ transition-delay: 0.7s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(6){ transition-delay: 0.8s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(7){ transition-delay: 0.9s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(8){ transition-delay: 1s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(9){ transition-delay: 1.1s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(10){ transition-delay: 1.2s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(11){ transition-delay: 1.3s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(12){ transition-delay: 1.4s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(13){ transition-delay: 1.5s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(14){ transition-delay: 1.6s; }.productshow .pro-slider_item.swiper-slide-active .pro-slider_content > :nth-child(15){ transition-delay: 1.7s; }.productshow .pro-slider_img{ background: rgb(255, 255, 255); border-radius: 20px; width: 50%; }.productshow .pro-slider_img img{ width: 100%; }.productshow .pro-slider_content{ width: 45%; }.productshow .pro-slider_content > *{ opacity: 0; transform: translateY(25px); transition: 0.4s; }.productshow .pro-slider_content .promeunnum{ font-size: 20px; }.productshow .pro-slider_content .promeuntitle{ color: rgb(230, 33, 42); font-size: 35px; font-weight: 500; line-height: 1.2; margin-top: 5px; white-space: nowrap; }.productshow .pro-slider_content .device-table{ color: rgb(51, 51, 51); font-size: 14px; }.productshow .pro-slider_content .table{ margin-top: 50px; }.productshow .pro-slider_content .table .tabs{ align-items: flex-end; background: rgb(247, 248, 252); border-bottom: 1px solid rgb(221, 221, 221); display: flex; justify-content: center; margin-bottom: 20px; position: relative; }.productshow .pro-slider_content .table .tabs .tab{ align-items: center; color: rgb(0, 0, 0); cursor: pointer; display: flex; font-size: 20px; font-weight: 300; justify-content: center; margin: 0px 2px; padding: 12px 32px; position: relative; }.productshow .pro-slider_content .table .tabs .tab.active{ background: radial-gradient(rgba(38, 35, 118, 0.05), rgb(255, 255, 255)); border-width: 1px 1px medium; border-style: solid solid none; border-color: rgb(221, 221, 221) rgb(221, 221, 221) currentcolor; border-image: none; border-radius: 30px 30px 0px 0px; color: rgb(230, 33, 42); margin-bottom: -1px; z-index: 1; }.productshow .pro-slider_content .table .row{ border-bottom: 1px solid rgb(221, 221, 221); display: flex; }.productshow .pro-slider_content .table .row .key{ border-right: 1px solid rgb(221, 221, 221); font-weight: 400; line-height: 2; padding: 10px 0px 10px 10px; width: 20%; }.productshow .pro-slider_content .table .row .value{ color: rgb(90, 90, 95); line-height: 2; opacity: 0.9; padding: 10px 0px 10px 10px; width: 80%; }.productshow .pro-slider_pagination{ position: absolute; right: 13%; text-align: center; top: 50%; transform: translateY(-50%); z-index: 21; bottom: auto !important; left: auto !important; width: 11px !important; }.productshow .pro-slider_pagination .swiper-pagination-bullet{ background: rgb(6, 39, 68); border-radius: 10px; display: block; height: 11px; margin: 8px 0px; opacity: 0.2; transition: 0.3s; width: 11px; }.productshow .pro-slider_pagination .swiper-pagination-bullet-active{ background: rgb(38, 35, 118); height: 30px; opacity: 1; }.productshow .proswiper-mobile{ display: none; }
@media screen and (max-width: 1024px) {.productshow .pro-slider_pagination{ right: 0px; }
}
@media screen and (max-width: 900px) {#product-show .title{ padding-bottom: 30px; }.productshow{ display: block; padding: 0px !important; }.productshow .proswiper{ display: none; }.productshow .promenu{ height: 100%; padding: 0px 5vw 40px; position: static; }.productshow .prolist, .productshow .promenu .promenumain .promenusub{ display: none; }.productshow .proswiper-mobile{ display: block; padding: 20px; position: relative; }.productshow .proswiper-mobile .mySwiper{ background: rgb(255, 255, 255); border-radius: 15px; height: 100%; padding-bottom: 15px; text-align: center; width: 100%; }.productshow .proswiper-mobile .mySwiper img{ display: block; height: 100%; margin: 0px auto; width: 80%; }.productshow .proswiper-mobile .mySwiper .title{ font-size: 18px; font-weight: 700; margin-top: 10px; }.productshow .proswiper-mobile .mySwiper .text{ font-size: 12px; }.productshow .proswiper-mobile .pagination{ bottom: -16px; display: flex; gap: 20px; position: absolute; right: 50%; transform: translate(50%); z-index: 10; }.productshow .proswiper-mobile .pagination .pagination-dot{ background-color: rgba(255, 255, 255, 0.65); border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 10px; height: 12px; transition: background-color 0.3s, transform 0.3s; width: 12px; }.productshow .proswiper-mobile .pagination .pagination-dot.active{ background: rgb(38, 35, 118); }
}
@media screen and (max-width: 600px) {.productshow .promenu{ margin-top: 0px; padding: 0px 5vw 20px; }.productshow .promenu .promenumain .promenutitle .title{ font-size: 28px; }
}.tb-pd{ margin: 70px 0px; }#application .container{ align-items: center; display: flex; flex-direction: column; justify-content: center; margin-top: 70px; }.switch-bar{ background-color: rgb(243, 244, 246); border-radius: 14px; display: inline-block; padding: 4px; position: relative; }.switch-bar .slider{ background: rgb(255, 255, 255); border-radius: 10px; bottom: 4px; left: 0px; position: absolute; top: 4px; transition: 0.3s; z-index: 5; }.switch-bar .tabs{ display: flex; position: relative; z-index: 10; }.switch-bar .tab{ align-items: center; color: rgb(75, 85, 99); cursor: pointer; display: flex; font-size: 13px; justify-content: center; padding: 10px 40px; white-space: nowrap; }.switch-bar .tab.active{ color: rgb(51, 51, 51); cursor: default; font-weight: 700; }.card-list{ display: grid; gap: 32px; grid-template-columns: repeat(3, minmax(0px, 1fr)); margin-top: 70px; opacity: 0; transform: translateY(60px); transition: 0.8s cubic-bezier(0.25, 1, 0.5, 1) 0.05s; }.card-list.visible{ opacity: 1; transform: translateY(0px); }.card-list .carditem{ background: rgb(255, 255, 255); border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px; overflow: hidden; padding: 35px; position: relative; transition: transform 0.3s; }.card-list .carditem:hover{ transform: translateY(-5px); }.card-list .carditem:hover .glow{ opacity: 0.3; transform: scale(1.5); transition: transform 0.3s; }.card-list .carditem .glow{ background-color: var(--glow-color); border-radius: 9999px; filter: blur(40px); height: 100px; opacity: 0.2; position: absolute; right: -80px; top: -80px; width: 100px; }.card-list .carditem .dal{ background: var(--line-color); height: 15px; width: 4px; }.card-list .carditem h3{ align-items: center; display: flex; font-size: 20px; gap: 10px; line-height: 28px; margin-bottom: 20px; }.card-list .carditem p{ color: rgb(75, 85, 99); font-size: 14px; margin-bottom: 25px; }.card-list .carditem .card-bottom-line{ background: var(--line-color); bottom: 0px; height: 4px; left: 0px; position: absolute; width: 100%; }
@media screen and (max-width: 1024px) {.card-list{ grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media screen and (max-width: 600px) {#application .card-list, #application .container{ margin-top: 40px; }.card-list{ grid-template-columns: repeat(1, minmax(0px, 1fr)); }.card-list .carditem{ padding: 20px; }
}
@font-face { font-family: swiper-icons; font-style: normal; font-weight: 400; src: url("data:application/font-woff;charset=utf-8;base64, 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"); }:root{ --swiper-theme-color: #007aff; }:host{ display: block; margin-left: auto; margin-right: auto; position: relative; z-index: 1; }.swiper{ display: block; list-style: none; margin-left: auto; margin-right: auto; overflow: hidden; padding: 0px; position: relative; z-index: 1; }.swiper-vertical > .swiper-wrapper{ flex-direction: column; }.swiper-wrapper{ box-sizing: content-box; display: flex; height: 100%; position: relative; transition-property: transform; transition-timing-function: var(--swiper-wrapper-transition-timing-function,initial); width: 100%; z-index: 1; }.swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper{ transform: translateZ(0px); }.swiper-horizontal{ touch-action: pan-y; }.swiper-vertical{ touch-action: pan-x; }.swiper-slide{ display: block; flex-shrink: 0; height: 100%; position: relative; transition-property: transform; width: 100%; }.swiper-slide-invisible-blank{ visibility: hidden; }.swiper-autoheight, .swiper-autoheight .swiper-slide{ height: auto; }.swiper-autoheight .swiper-wrapper{ align-items: flex-start; transition-property: transform, height; }.swiper-backface-hidden .swiper-slide{ backface-visibility: hidden; transform: translateZ(0px); }.swiper-3d.swiper-css-mode .swiper-wrapper{ perspective: 1200px; }.swiper-3d .swiper-wrapper{ transform-style: preserve-3d; }.swiper-3d{ perspective: 1200px; }.swiper-3d .swiper-cube-shadow, .swiper-3d .swiper-slide{ transform-style: preserve-3d; }.swiper-css-mode > .swiper-wrapper{ overflow: auto; scrollbar-width: none; }.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar{ display: none; }.swiper-css-mode > .swiper-wrapper > .swiper-slide{ scroll-snap-align: start; }.swiper-css-mode.swiper-horizontal > .swiper-wrapper{ scroll-snap-type: x mandatory; }.swiper-css-mode.swiper-vertical > .swiper-wrapper{ scroll-snap-type: y mandatory; }.swiper-css-mode.swiper-free-mode > .swiper-wrapper{ scroll-snap-type: none; }.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide{ scroll-snap-align: none; }.swiper-css-mode.swiper-centered > .swiper-wrapper::before{ content: ""; flex-shrink: 0; order: 9999; }.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide{ scroll-snap-align: center; scroll-snap-stop: always; }.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child{ margin-inline-start: var(--swiper-centered-offset-before); }.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before{ height: 100%; min-height: 1px; width: var(--swiper-centered-offset-after); }.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child{ margin-block-start: var(--swiper-centered-offset-before); }.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before{ height: var(--swiper-centered-offset-after); min-width: 1px; width: 100%; }.swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top{ height: 100%; left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%; z-index: 10; }.swiper-3d .swiper-slide-shadow{ background: rgba(0, 0, 0, 0.15); }.swiper-3d .swiper-slide-shadow-left{ background-image: linear-gradient(270deg, rgba(0, 0, 0, 0.5), transparent); }.swiper-3d .swiper-slide-shadow-right{ background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.5), transparent); }.swiper-3d .swiper-slide-shadow-top{ background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), transparent); }.swiper-3d .swiper-slide-shadow-bottom{ background-image: linear-gradient(rgba(0, 0, 0, 0.5), transparent); }.swiper-lazy-preloader{ border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-radius: 50%; border-top: 4px solid transparent; box-sizing: border-box; height: 42px; left: 50%; margin-left: -21px; margin-top: -21px; position: absolute; top: 50%; transform-origin: 50% center; width: 42px; z-index: 10; }.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader, .swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{ animation: 1s linear 0s infinite normal none running swiper-preloader-spin; }.swiper-lazy-preloader-white{ --swiper-preloader-color: #fff; }.swiper-lazy-preloader-black{ --swiper-preloader-color: #000; }
@keyframes swiper-preloader-spin {0%{ transform: rotate(0deg); }100%{ transform: rotate(1turn); }
}.hz-news .mySwiper{ margin-top: 70px; padding-bottom: 48px; padding-left: 30px; }.hz-news .mySwiper .swiper-slide{ border-radius: 12px; overflow: hidden; transition: transform 0.3s; }.hz-news .mySwiper .infobox{ background: rgb(255, 255, 255); border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 20px; cursor: pointer; height: 630px; overflow: hidden; padding-bottom: 40px; transition: 0.3s ease-in-out; }.hz-news .mySwiper .infobox .card-img{ height: 50%; position: relative; }.hz-news .mySwiper .infobox .card-img img{ display: block; height: 100%; object-fit: cover; width: 100%; }.hz-news .mySwiper .infobox .card-body{ height: 50%; padding: 40px 40px 0px; }.hz-news .mySwiper .infobox .card-body h3{ font-size: 22px; font-weight: 300; margin: 12px 0px; }.hz-news .mySwiper .infobox .card-body p{ display: -webkit-box; font-size: 17px; margin-top: 30px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; color: rgb(90, 90, 95); opacity: 0.9; }.hz-news .mySwiper .infobox:hover{ transform: scale(1.03); }.pagination .paddleNav_grid{ display: flex; gap: 20px; justify-content: center; }.pagination .paddleNav_grid button{ align-items: center; border: 0px; border-radius: 50%; cursor: pointer; display: flex; height: 50px; justify-content: center; outline: none; width: 50px; }.pagination .paddleNav_grid button.disabled svg path{ fill: rgb(204, 204, 204); }.modal-backdrop{ align-items: start; backdrop-filter: blur(20px); background-color: rgba(0, 0, 0, 0.48); display: flex; height: 100vh; justify-content: center; left: 0px; overflow-y: auto; position: fixed; top: 0px; width: 100%; z-index: 9999; }.modal-content{ background: rgb(255, 255, 255); border-radius: 12px; height: auto; margin-top: 40px; padding: 76px; position: relative; scrollbar-color: rgb(153, 153, 153) rgb(241, 241, 241); scrollbar-width: thin; width: min(1260px, 87.5vw); }.modal-content h2{ font-size: 40px; font-weight: 600; margin-bottom: 64px; }.modal-content .info p{ color: rgb(110, 110, 115); display: flex; font-size: 25px; justify-content: center; line-height: 1.6; margin-bottom: 5px; }.modal-content .info img{ border-radius: 8px; margin: 20px 0px; max-width: 100%; }.BaseModal_closeButton{ position: absolute; right: 16px; top: 20px; }.BaseModal_closeButton .modal-close{ align-items: center; background: rgb(0, 0, 0); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 50%; cursor: pointer; display: flex; font-size: 24px; height: 36px; justify-content: center; outline: none; width: 36px; }.BaseModal_closeButton .modal-close .IconControl_centeredIcon___gj73{ height: 20px; width: 20px; fill: rgb(255, 255, 255); }.fade-enter-active, .fade-leave-active{ transition: opacity 0.3s; }.fade-enter-from, .fade-leave-to{ opacity: 0; }
@media screen and (max-width: 1500px) {.hz-news .mySwiper .infobox .card-body h3{ font-size: 20px; }.hz-news .mySwiper .infobox .card-body p{ font-size: 16px; }
}
@media screen and (max-width: 1000px) {.hz-news .mySwiper{ margin-top: 50px; }.hz-news .mySwiper .infobox .card-body{ padding: 30px; }.hz-news .mySwiper .infobox .card-body h3{ font-size: 18px; }.hz-news .mySwiper .infobox .card-body p{ font-size: 14px; }
}
@media screen and (max-width: 789px) {.hz-news .mySwiper .infobox{ height: 500px; }.hz-news .mySwiper .infobox .card-body{ padding: 20px; }.hz-news .mySwiper .infobox .card-body h3{ font-size: 16px; margin: 0px; }.hz-news .mySwiper .infobox .card-body p{ font-size: 12px; }
}
@media screen and (max-width: 689px) {.hz-news .mySwiper{ padding-left: 10px; padding-right: 10px; }.modal-content{ margin: 30px; padding: 30px; }.modal-content h2{ font-size: 25px; margin-bottom: 20px; }.modal-content .info p{ font-size: 16px; }.BaseModal_closeButton{ top: 10px; }.BaseModal_closeButton .modal-close{ height: 25px; width: 25px; }
}
@media screen and (max-width: 600px) {.hz-news .mySwiper .infobox{ height: 500px; }.hz-news .mySwiper .infobox .card-img{ height: 55%; }
}.brandbox{ margin-top: 70px; }.brandbox .list{ display: flex; flex-wrap: wrap; gap: 20px; height: auto; margin-bottom: 20px; width: 100%; }.brandbox .list .item{ height: 81px; position: relative; width: calc(12.5% - 18px); }.brandbox .list .item img{ height: 100%; left: 0px; object-fit: contain; position: absolute; width: 100%; }.brandbox .list .item .item-name{ align-items: center; color: rgb(255, 255, 255); display: flex; height: 100%; justify-content: center; left: 50%; opacity: 0; position: absolute; top: 50%; transform: translate(-50%, -50%); transition: opacity 0.4s; width: 100%; }.brandbox .list .item .item-name::after{ background: rgb(230, 33, 42); content: ""; height: 100%; left: 0px; position: absolute; transform: scaleY(0); transform-origin: center top; transition: transform 0.4s cubic-bezier(0.25, 1.5, 0.5, 1); width: 100%; z-index: -1; }.brandbox .list .item:hover .item-name{ opacity: 1; }.brandbox .list .item:hover .item-name::after{ transform: scaleY(1); }
@media screen and (max-width: 689px) {.brandbox{ margin-top: 40px; }.brandbox .list .item{ width: calc(25% - 18px); }
}.page .scroll-next-btn{ align-items: center; background-color: rgb(230, 33, 42); border-radius: 100%; bottom: 40px; box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 12px; cursor: pointer; display: flex; height: 50px; justify-content: center; position: fixed; right: 40px; transition: 0.3s; width: 50px; z-index: 1000; }.page .scroll-next-btn:hover{ background: rgb(47, 48, 138); transform: scale(1.1); }.page .content-one{ background: rgb(255, 255, 255); padding-bottom: 100px; padding-top: 100px; }.page .content-four, .page .content-two{ background: rgb(247, 248, 252); padding: 70px 0px; }.page .content-five{ background: rgb(255, 255, 255); padding-bottom: 100px; padding-top: 100px; }
@media screen and (max-width: 900px) {.page .content-one{ padding-bottom: 50px; padding-top: 50px; }.page .content-four, .page .content-two{ padding: 50px 0px; }.page .content-five{ padding-bottom: 50px; padding-top: 50px; }
}
@media screen and (max-width: 600px) {.page .banner{ padding-bottom: 40px; }
}/* ===== 附加：新闻详情弹窗开关（默认隐藏，点卡片打开） ===== */
/* ===== 新闻详情弹窗（原版 modal，默认隐藏，点卡片打开） ===== */
.kpea-news-modal{display:none}.kpea-news-modal.open{display:block}.kpea-news-modal .modal-content h2{word-break:break-word}.kpea-news-modal .modal-content .info{overflow:hidden}.kpea-news-modal .modal-content{box-sizing:border-box}/* ===== 附加：场景两组卡片互斥显示（原站为单列表切换渲染） ===== */
.card-list{display:none}.card-list.visible{display:grid}/* ===== 附加：移动端产品轮播（img 限高，防止后台上传大图撑破布局） ===== */
.proswiper-mobile .mySwiper img{height:auto;max-height:240px;object-fit:contain}/* .title 保留原站 30px 下内边距，保证卡片高度与原站一致 */
.proswiper-mobile .mySwiper .title{padding-bottom:30px}/* 无产品图时保留原站 20px 图片占位高度 */
.proswiper-mobile .swiper-slide.noimg::before{content:'';display:block;height:20px}
/* ===== 附加：新闻弹窗关闭按钮（右上角黑色圆圈白色×）+ 日期样式 ===== */
.kpea-news-modal .modal-content .modal-close{position:absolute;top:24px;right:24px;width:36px;height:36px;margin:0;padding:0;border:0;border-radius:50%;background:#000;color:#fff;font-size:18px;line-height:36px;text-align:center;cursor:pointer;transition:background .2s}
.kpea-news-modal .modal-content .modal-close:hover{background:#3a3a3a}
.kpea-news-modal .modal-content .createtime{margin:0 0 32px;color:#9a9aa0;font-size:16px;letter-spacing:1px}
@media screen and (max-width:689px){.kpea-news-modal .modal-content .modal-close{top:12px;right:12px;width:28px;height:28px;font-size:14px;line-height:28px}.kpea-news-modal .modal-content .createtime{margin:0 0 16px;font-size:13px}}