.brand-story{position:relative;overflow:hidden}.brand-story-intro{position:relative}.brand-story-intro__kv{position:relative;overflow:hidden;height:820px}.brand-story-intro__kv .page-width{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;color:var(--color-black);text-align:center}.brand-story-intro__kv .kv-logo{aspect-ratio:628/100;width:min(386px,100%);margin:0 auto;background:center center/cover no-repeat var(--background)}.brand-story-intro__kv .kv-headline{margin-top:24px;font-weight:600;word-wrap:break-word;font-size:36px;line-height:1.45;letter-spacing:-.01em}@media (max-width: 750px){.brand-story-intro__kv .kv-headline{font-size:18px;letter-spacing:-.005em}}.brand-story-intro__kv .kv-desc{margin-top:6px;font-size:24px;line-height:1.45;letter-spacing:-.005em}@media (max-width: 750px){.brand-story-intro__kv .kv-desc{font-size:16px;line-height:1.5;letter-spacing:0}}.brand-story-intro__kv .kv-date{margin-top:24px;font-size:20px;line-height:1.45}@media (max-width: 750px){.brand-story-intro__kv .kv-date{font-size:14px;line-height:1.5}}.brand-story-intro__kv .kv-object{position:absolute;inset:50% 0 auto 0;height:1210px;transform:translateY(-50%);background-color:var(--color-white)}.brand-story-intro__kv .kv-object img{width:100%;height:100%;object-fit:cover;opacity:.75}.brand-story-intro__content{display:grid;grid-template-columns:1fr 1fr;height:clamp(700px,calc(960 / var(--page-width-cqi) * 100cqi),960px)}.brand-story-intro__content .content-text{display:flex;flex-direction:column;justify-content:center;align-items:center;word-wrap:break-word;height:100%;padding:0 var(--page-padding);background-color:var(--color-bg)}.brand-story-intro__content .content-text img{width:clamp(150px,calc(300 / var(--page-width-cqi) * 100cqi),300px)}.brand-story-intro__content .content-text strong{display:block;width:min(580px,100%);margin:48px auto 0;text-align:center;font-size:36px;line-height:1.45;letter-spacing:-.01em}@media (max-width: 750px){.brand-story-intro__content .content-text strong{font-size:20px;letter-spacing:-.0075em}}.brand-story-intro__content .content-text p{width:min(580px,100%);margin:24px auto 0;text-align:center;color:var(--color-gray09);word-wrap:break-word;font-size:24px;line-height:1.45;letter-spacing:-.005em}@media (max-width: 750px){.brand-story-intro__content .content-text p{font-size:16px;line-height:1.5;letter-spacing:0}}.brand-story-intro__content .content-bg{overflow:hidden}.brand-story-intro__content .content-bg img{width:100%;height:100%;object-fit:cover}@media (max-width: 750px){.brand-story-intro__content{display:block;height:auto}.brand-story-intro__content .content-text{padding-block:clamp(70px,calc(140 / var(--page-width-cqi) * 100cqi),140px)}.brand-story-intro__content .content-text img{width:180px}.brand-story-intro__content .content-text strong{margin-top:40px}.brand-story-intro__content .content-text p{margin-top:12px}}.brand-story-skill{position:relative;height:100vh}.brand-story-skill__intro{height:100%;background:center center/cover no-repeat var(--background);opacity:0;z-index:0;pointer-events:none;transition:all var(--duration-extra-longer)}.brand-story-skill__intro.active{opacity:1;z-index:1;pointer-events:auto}.brand-story-skill__intro .page-width{display:flex;align-items:center;column-gap:40px;height:100%;word-wrap:break-word;color:var(--color-white)}.brand-story-skill__intro .skill-title{font-weight:600;opacity:0;transform:translateY(60px);transition:all 1s ease;font-size:40px;line-height:1.4;letter-spacing:-.01em}.brand-story-skill__intro .skill-title.is-visible{opacity:1;transform:translateY(0)}@media (max-width: 750px){.brand-story-skill__intro .skill-title{font-size:20px;line-height:1.45;letter-spacing:-.0075em}}.brand-story-skill__intro .skill-desc{margin-top:12px;word-wrap:break-word;opacity:0;transform:translateY(60px);transition:all 1s ease;font-size:20px;line-height:1.45}.brand-story-skill__intro .skill-desc.is-visible{opacity:1;transform:translateY(0)}@media (max-width: 750px){.brand-story-skill__intro .skill-desc{font-size:14px;line-height:1.5}}.brand-story-skill__intro img{margin-left:auto;width:min(400px,100%);opacity:0;transform:translateY(60px);transition:all 1s ease}.brand-story-skill__intro img.is-visible{opacity:1;transform:translateY(0)}@media (max-width: 750px){.brand-story-skill__intro{background:center center/cover no-repeat var(--background-mo)}.brand-story-skill__intro .page-width{flex-direction:column;justify-content:center;align-items:flex-start}.brand-story-skill__intro img{margin-top:40px;margin-left:0}}.brand-story-skill__story{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--color-bg) center center/cover no-repeat var(--background);opacity:0;z-index:0;pointer-events:none;transition:all var(--duration-extra-longer)}.brand-story-skill__story.active{opacity:1;z-index:1;pointer-events:auto}.brand-story-skill__story.active .story-swiper{transform:translate(0);opacity:1;transition-delay:var(--duration-default)}.brand-story-skill__story.active .story-title,.brand-story-skill__story.active .story-text{transform:translateY(0);opacity:1;transition-delay:var(--duration-default)}.brand-story-skill__story .page-width{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.brand-story-skill__story .story-swiper{position:relative;width:100%;overflow:hidden;transform:translate(-100px);opacity:0;transition:all var(--duration-extra-longer)}.brand-story-skill__story .story-swiper .swiper-slide{position:relative;overflow:hidden;aspect-ratio:5/4}.brand-story-skill__story .story-swiper .swiper-slide img{width:100%;height:100%;object-fit:cover;transition:transform var(--duration-default)}.brand-story-skill__story .story-swiper .swiper-slide:hover img{transform:scale(1.05)}.brand-story-skill__story .story-swiper .c-swiper-pagination{display:none;position:static;margin-top:24px}.brand-story-skill__story .story-title{margin-top:64px;font-weight:600;text-align:center;word-wrap:break-word;transform:translateY(-70px);opacity:0;transition:all var(--duration-extra-longer);font-size:32px;line-height:1.5;letter-spacing:-.01em}@media (max-width: 750px){.brand-story-skill__story .story-title{font-size:20px;line-height:1.45;letter-spacing:-.0075em}}.brand-story-skill__story .story-text{width:min(800px,100%);margin-top:12px;text-align:center;word-wrap:break-word;transform:translateY(-70px);opacity:0;transition:all var(--duration-extra-longer);font-size:20px;line-height:1.45}@media (max-width: 750px){.brand-story-skill__story .story-text{font-size:14px;line-height:1.5}}@media (max-width: 750px){.brand-story-skill__story .page-width{align-items:flex-start}.brand-story-skill__story .story-swiper .c-swiper-pagination{display:flex}.brand-story-skill__story .story-title{text-align:left;margin-top:24px}.brand-story-skill__story .story-text{text-align:left}}.brand-story-ingredients{position:relative;height:100vh;background-color:var(--color-white)}.brand-story-ingredients__carousel{position:absolute;z-index:10;left:40px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column}.brand-story-ingredients__carousel .pagination{width:6px;height:6px;margin:9px;border-radius:100%;background-color:#0000004d}.brand-story-ingredients__carousel .pagination.active{background-color:var(--color-black)}@media (max-width: 750px){.brand-story-ingredients__carousel{top:32px;left:var(--page-padding);transform:none}}.brand-story-ingredients__section{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;z-index:0;pointer-events:none;transition:all var(--duration-extra-longer)}.brand-story-ingredients__section.active{opacity:1;z-index:1;pointer-events:auto}.brand-story-ingredients__section-object{width:100%;height:100%;opacity:.8}.brand-story-ingredients__section-object img,.brand-story-ingredients__section-object video{width:100%;height:100%;object-fit:cover}.brand-story-ingredients__section-content{position:absolute;top:0;left:0;width:100%;height:100%}.brand-story-ingredients__section-content .page-width{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;word-wrap:break-word;height:100%}.brand-story-ingredients__section-content .ingredients-title{font-weight:600;font-size:40px;line-height:1.4;letter-spacing:-.01em}@media (max-width: 750px){.brand-story-ingredients__section-content .ingredients-title{font-size:16px;line-height:1.5;letter-spacing:0}}.brand-story-ingredients__section-content .ingredients-desc{margin-top:24px;color:var(--color-gray09);font-size:24px;line-height:1.45;letter-spacing:-.005em}@media (max-width: 750px){.brand-story-ingredients__section-content .ingredients-desc{font-size:14px;line-height:1.5;letter-spacing:0}}.brand-story-ingredients__section-content .ingredients-link{display:inline-block;margin-top:48px;font-weight:800;text-decoration:underline;font-size:24px;line-height:1.45;letter-spacing:-.005em}@media (max-width: 750px){.brand-story-ingredients__section-content .ingredients-link{font-size:12px;line-height:1.4;letter-spacing:0}}.brand-story-outro{position:relative;height:100vh;background:center center/cover no-repeat var(--background)}.brand-story-outro:before{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#00000040;content:""}.brand-story-outro__object{width:100%;height:100%}.brand-story-outro__object img,.brand-story-outro__object video{width:100%;height:100%;object-fit:cover}.brand-story-outro .page-width{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;word-wrap:break-word;text-align:center;height:100%;color:var(--color-white)}.brand-story-outro__title{font-weight:600;opacity:0;transform:translateY(60px);transition:all 1s ease;font-size:40px;line-height:1.4;letter-spacing:-.01em}.brand-story-outro__title.is-visible{opacity:1;transform:translateY(0)}@media (max-width: 750px){.brand-story-outro__title{font-size:24px}}.brand-story-outro__desc{margin-top:12px;opacity:0;transform:translateY(60px);transition:all 1s ease;font-size:20px;line-height:1.45}.brand-story-outro__desc.is-visible{opacity:1;transform:translateY(0)}@media (max-width: 750px){.brand-story-outro__desc{font-size:14px;line-height:1.5}}.brand-story-outro__link{display:inline-block;margin-top:48px;font-weight:800;text-decoration:underline;opacity:0;transform:translateY(60px);transition:all 1s ease;font-size:16px;line-height:1.5}.brand-story-outro__link.is-visible{opacity:1;transform:translateY(0)}@media (max-width: 750px){.brand-story-outro__link{font-size:12px;line-height:1.4}}@media (max-width: 750px){.brand-story-outro{background:center center/cover no-repeat var(--background-mo)}}
/*# sourceMappingURL=/cdn/shop/t/12/assets/brand-story.scss.css.map */
