.hero-banner{position:relative;display:flex;align-items:center;padding:220px 0;background:linear-gradient(270deg,#0000 40%,#0006),var(--hero-bg);background-size:cover;background-position:right bottom;color:#fff;height:calc(100vh - var(--header-height));width:100%}.hero-banner__content{position:relative}.hero-banner__title,.hero-banner__heading{font-family:Wendy One,sans-serif;margin:0;font-weight:400;line-height:calc(90 / 76);font-size:76px;max-width:750px;color:#fff;text-shadow:0px 4px 4px #00000066;text-align:start}[lang=zh-TW] .hero-banner__heading,[lang=zh-TW] .hero-banner__title{font-family:"GenSeki Gothic 2 TW";font-weight:700;max-width:606px;line-height:calc(96 / 76)}.hero-banner__subheading{font-family:var(--font-body-family);font-size:40px;line-height:1.2;font-weight:500;text-shadow:0px 4px 4px #00000066;text-align:start;color:#fff;margin-top:10px;max-width:620px}[lang=zh-TW] .hero-banner__subheading{margin-top:20px;line-height:1}@media screen and (min-width:768px)and (max-width:1024px){.hero-banner{background:linear-gradient(360deg,#0000 65.87%,#0006),var(--hero-bg-mobile);background-size:cover;background-position:center 20%;align-items:start;padding:180px 0;min-height:120vw}.hero-banner .main-layout{padding-left:60px;padding-right:60px}.hero-banner__title,.hero-banner__heading{font-size:40px;margin:0 auto 8px;text-align:center;text-shadow:0px 4px 0px #000000cc}[lang=zh-TW] .hero-banner__title,[lang=zh-TW] .hero-banner__heading{margin:auto}.hero-banner__subheading{font-size:28px;text-align:center;margin:auto;text-shadow:0px 2px 0px #000000cc;max-width:100%}[lang=zh-TW] .hero-banner__subheading{margin-top:8px}}@media screen and (max-width:767px){.hero-banner{align-items:flex-start;padding:100px 0;background:linear-gradient(360deg,#0000 65.87%,#0006),var(--hero-bg-mobile);background-size:cover;background-position:center top;aspect-ratio:unset;min-height:120vw}.hero-banner__title,.hero-banner__heading{font-size:28px;max-width:290px;margin:0 auto 8px;text-align:center;text-shadow:0px 4px 0px #000000cc}[lang=zh-TW] .hero-banner__title,[lang=zh-TW] .hero-banner__heading{margin:auto}.hero-banner__subheading{font-size:20px;text-align:center;width:284px;margin:auto;text-shadow:0px 2px 0px #000000cc}[lang=zh-TW] .hero-banner__subheading{width:100%;margin-top:8px}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/section-hero-banner.css.map */