:root{--hero-height:300px}.hero-banner{background-color:var(--color-primary-dark);z-index:1;position:relative;overflow:hidden}.hero-banner .graphic-wave{z-index:4;pointer-events:none;width:100%;height:120px;position:absolute;bottom:-1px;left:0}@keyframes move-graphic-waveI{0%{background-position:0 bottom}to{background-position:-10000px bottom}}@keyframes move-graphic-waveII{0%{background-position:0 bottom}to{background-position:-10000px bottom}}@keyframes move-graphic-waveIII{0%{background-position:0 bottom}to{background-position:10000px bottom}}.hero-banner .graphic-wave .graphic{background-repeat:repeat-x;background-size:cover;width:100%;position:absolute;bottom:0;left:0}.hero-banner .graphic-wave .graphic.-I{z-index:-3;background-image:url(/img/static/hero-graphic01.png);height:90px;animation:1200s linear infinite move-graphic-waveI}.hero-banner .graphic-wave .graphic.-II{z-index:-2;background-image:url(/img/static/hero-graphic02.png);height:85px;animation:1800s linear infinite move-graphic-waveII}.hero-banner .graphic-wave .graphic.-III{z-index:-1;background-image:url(/img/static/hero-graphic03.png);height:80px;animation:1500s linear infinite move-graphic-waveIII}.hero-banner .link{display:block}.hero-banner .ratio{z-index:1;background-color:#0000;position:relative}.hero-banner .ratio:before{content:"";padding-top:var(--hero-height);display:block}.hero-banner .ratio img{object-fit:contain;object-position:center;width:100%;height:100%;position:absolute;top:0;left:0}.hero-banner .ratio .blur{content:"";z-index:-1;object-fit:cover;object-position:center;filter:blur(30px);position:absolute;inset:-20px}.hero-banner .video-cover{z-index:1;padding-top:var(--hero-height);margin:0;position:relative}.hero-banner .video-cover iframe,.hero-banner .video-cover video{object-fit:cover;object-position:center;pointer-events:none;border:none;width:100%;height:100%;position:absolute;top:0;left:0}.hero-banner .content{z-index:2;justify-content:center;align-items:flex-end;display:flex;position:absolute;inset:0}.hero-banner .content .inner{text-align:center;max-width:1200px;margin:0 auto;padding-bottom:110px}.hero-banner .content .title{color:var(--color-light);font-size:var(--typo-md);font-weight:var(--fw-bold);text-shadow:var(--text-shadow2);-webkit-line-clamp:1;letter-spacing:0;max-height:1.2em;margin-bottom:0;line-height:1.2em}.hero-banner .content .desc{color:var(--color-light);font-weight:var(--fw-medium);font-size:var(--typo-default);text-shadow:var(--text-shadow2);-webkit-line-clamp:1;letter-spacing:0;max-height:1.5em;line-height:1.5em}.hero-banner .content .subdesc{background-color:#fff3;border-radius:25px;margin:16px auto 0;padding:8px 12px;display:inline-block}.hero-banner .content .subdesc .txt{color:var(--color-light);font-weight:var(--fw-normal);font-size:var(--typo-vxs);-webkit-line-clamp:1;letter-spacing:0;max-height:1.5em;line-height:1.5em}.hero-banner .swiper-pagination{text-align:right;flex-direction:column;justify-content:center;align-items:flex-end;gap:8px;max-width:40px;margin:0;padding:0;display:flex;inset:0 40px 0 auto}.hero-banner .swiper-pagination-bullets.swiper-pagination-horizontal{top:0;left:auto}.hero-banner-swiper{position:relative}.hero-banner-swiper .swiper-slide{visibility:hidden}.hero-banner-swiper .swiper-slide.swiper-slide-active{visibility:visible}html[data-asw-filter=dark-contrast] .hero-banner{background-color:var(--color-dark)}html[data-asw-filter=dark-contrast] .hero-banner .graphic-wave,html[data-asw-filter=dark-contrast] .hero-banner .video-cover,html[data-asw-filter=dark-contrast] .hero-banner .ratio{filter:grayscale()}html[data-asw-filter=dark-contrast] .hero-banner .swiper-pagination .swiper-pagination-bullet{background-color:var(--color-gray);border-color:var(--color-gray)}html[data-asw-filter=dark-contrast] .hero-banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:var(--color-light)}html[data-asw-filter=dark-contrast] .hero-banner .content .title,html[data-asw-filter=dark-contrast] .hero-banner .content .desc{color:var(--color-light)}html[data-asw-filter=dark-contrast] .hero-banner .content .subdesc{background-color:#fff3}html[data-asw-filter=dark-contrast] .hero-banner .content .subdesc .txt{color:var(--color-light)}html[data-asw-filter=yellow-contrast] .hero-banner{background-color:var(--color-dark)}html[data-asw-filter=yellow-contrast] .hero-banner .graphic-wave,html[data-asw-filter=yellow-contrast] .hero-banner .video-cover,html[data-asw-filter=yellow-contrast] .hero-banner .ratio{filter:grayscale()}html[data-asw-filter=yellow-contrast] .hero-banner .swiper-pagination .swiper-pagination-bullet{background-color:var(--color-yellow-dark)}html[data-asw-filter=yellow-contrast] .hero-banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:var(--color-yellow)}html[data-asw-filter=yellow-contrast] .hero-banner .content .title,html[data-asw-filter=yellow-contrast] .hero-banner .content .desc{color:var(--color-yellow)}html[data-asw-filter=yellow-contrast] .hero-banner .content .subdesc{background-color:#c8c80033}html[data-asw-filter=yellow-contrast] .hero-banner .content .subdesc .txt{color:var(--color-yellow)}@media (max-width:1440px){.hero-banner .ratio img{object-fit:cover}.hero-banner .graphic-wave{height:90px}.hero-banner .graphic-wave .graphic.-I{height:70px}.hero-banner .graphic-wave .graphic.-II{height:65px}.hero-banner .graphic-wave .graphic.-III{height:60px}}@media (max-width:1199px){.hero-banner .ratio:before,.hero-banner .video-cover{padding-top:28%}.hero-banner .video-react{height:28dvh}}@media (max-width:991px){.hero-banner .ratio:before,.hero-banner .video-cover{padding-top:36%}.hero-banner .video-react{height:36dvh}.hero-banner .content .inner{padding-bottom:110px}}@media (max-width:767px){.hero-banner .graphic-wave,.hero-banner .graphic-wave .graphic.-I{height:30px}.hero-banner .graphic-wave .graphic.-II{height:25px}.hero-banner .graphic-wave .graphic.-III{height:20px}.hero-banner .swiper-pagination{gap:4px;padding:0;right:15px}.hero-banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width:4px}.hero-banner .ratio:before,.hero-banner .video-cover{padding-top:40%}.hero-banner .video-react{height:40dvh}.hero-banner .content .inner{padding-bottom:40px}.hero-banner .content .title{font-size:var(--typo-sm);text-shadow:none}.hero-banner .content .desc{font-size:var(--typo-xs);text-shadow:none}.hero-banner .content .subdesc{margin:10px auto 0;padding:4px 8px}.hero-banner .content .subdesc .txt{font-size:var(--typo-vxs);text-shadow:var(--text-shadow2)}}