/* COMMON */
.dot-text { position: relative; padding-left: 0.86em; font-size: 1.8rem; }
.dot-text::before { content: ''; position: absolute; top: 0.725em; left: 0; width: 0.2em; height: 0.2em; background: currentColor; border-radius: 50%; will-change: transform; }
@media screen and (max-width: 1024px) {

}
@media screen and (max-width: 768px) {
    .dot-text { padding-left: 0.65em; }
}

[data-animate] [data-split] { opacity: 0; }
[data-animate] [data-split-ready] { opacity: 1; }
[data-animate] [data-split] .line { overflow: hidden; }
[data-animate] [data-split] .sentence { transform: translateY(100%); }

[data-header-theme="light"][data-header-sticky="true"] .header-primary { background: rgb(255, 246, 226, 0.5); }
[data-header-theme="light"][data-header-expanded="true"] .header-primary { background: rgb(255, 255, 255, 1); }
[data-header-theme="transparent"][data-header-sticky="true"] .header-primary { background: rgb(0, 0, 0, 0.5); }
[data-header-theme="transparent"][data-header-expanded="true"] .header-primary { background: rgb(255, 255, 255, 1); }


/* Page Navigation */
.page-navigation { --color: #999999; --color-hover: var(--clr-dark); --color-active: color: var(--clr-dark); overflow: hidden; display: flex; justify-content: center; }
.page-navigation__lists { display: flex; align-items: center; justify-content: center; }
.page-navigation__item { position: relative; padding: 0 30px; }
.page-navigation__item::after { content: ''; position: absolute; top: 0; bottom: 0; right: 0; margin: auto; width: 1px; height: 56%; background: #b3b3b3;}
.page-navigation__item:last-child::after { content: none; }
.page-navigation__link { font-size: 2.5rem; font-weight: 600; color: #999999; transition: all .1s ease; }
.page-navigation__item--active .page-navigation__link { color: var(--color-active); }
@media (hover: hover) and (pointer: fine) {
    .page-navigation__link:hover { color: var(--color-hover); }
}
@media screen and (max-width: 1024px) {
    .page-navigation__item { padding: 0 16px; }
    .page-navigation__link { font-size: 1.8rem; }
}
@media screen and (max-width: 768px) {
    .page-navigation__item { padding: 0 12px; }
    .page-navigation__link { font-size: 1.6rem; }

}


/* Page Lead */
.page-lead { padding: 360px 0 120px; text-align: center; }
.page-lead .premium-yebisu-master { margin-top: 14px; }
.page-lead .premium-yebisu-master::before { background-color: var(--clr-primary); }
.page-lead__wrap { margin-right: auto; margin-left: auto; max-width: var(--inner); width: 90%; }
.page-lead__badge { font-family: var(--font-display); font-size: 3.6rem; font-weight: 600; color: var(--clr-primary); }
.page-lead__heading { margin-top: 24px; line-height: 1.4; font-family: var(--font-secondary); font-size: 6.4rem; font-weight: 500; }
.page-lead__text { margin-top: 60px; font-size: 2.2rem; font-weight: 500; }
[data-theme="black"] .page-lead__badge,
[data-theme="dark"] .page-lead__badge { color: inherit; }
@media screen and (max-width: 1024px) {
    .page-lead .premium-yebisu-master { width: 240px; }
    .page-lead { padding: 160px 0 80px; }
	.page-lead__badge { font-size: 2.4rem; }
    .page-lead__heading { font-size: 4.2rem; margin-top: 10px; }
}
@media screen and (max-width: 768px) {
    .page-lead .premium-yebisu-master { width: 140px; }
    .page-lead { padding: 120px 0 60px; }
	.page-lead__badge { font-size: 1.8rem; }
    .page-lead__heading { font-size: 2.4rem; margin-top: 6px; }

}


/* Brand */
.text-period { display: inline-block; width: 10px; height: 10px; border: 2px solid currentColor; border-radius: 50%; }

.brand-main { padding-top: 60px; }
.brand-main__wrap { position: relative; }
.brand-wall { z-index: 2; position: relative; display: flex; justify-content: space-between; }
.brand-wall__col { display: flex; flex-direction: column; position: relative; width: 35.4167%; }
.brand-wall__head { display: flex; padding-bottom: 32.552vw; }
.brand-wall__main { overflow: hidden; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; }
.brand-wall__image { height: 100%; }
.brand-wall__image-item--main { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.brand-wall__heading { display: flex; justify-content: center; }
.brand-wall__heading-item { line-height: 1.8; font-family: var(--font-secondary); font-size: 4.6rem; font-weight: 500; letter-spacing: 0.06em; writing-mode: vertical-rl; text-orientation: mixed; }
.brand-wall__heading-item .text-pad { padding: 0.2em 0; }
.brand-wall__heading-item .text-period { margin: 0 0 0 20px; }
.brand-wall__body { padding: 100dvh 14.7059% 0; }
.brand-wall__contents { display: flex; align-items: center; height: 100vh; height: 100dvh; }
.brand-wall__text { margin: 24px 0; font-size: 2rem; }
.brand-wall__text--title { font-weight: 600; }
.brand-wall__text--p { margin-top: 40px; font-size: inherit; }
.brand-wall__small { display: block; margin-top: 20px; opacity: 0.4; }
.brand-wall__col--1 { z-index: 2; position: relative; }
.brand-wall__col--1 .brand-wall__body { flex: 1 1; position: relative; height: 100%; }
.brand-wall__col--1 .brand-wall__heading { overflow: hidden; display: flex; align-items: center; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; }
/* .brand-wall__col--2 { width: 29.1667%; } */
.brand-wall__col--2 { position: absolute; top: 0; left: 0; right: 0; margin: auto; width: 100%; height: 100%; will-change: width; }
.brand-wall__col--3 .brand-wall__body { padding-right: 11.7647%; }
.brand-background { position: absolute; top: 0; left: 0; padding-top: calc(100vh ); width: 100%; height: 100%; background: #060606; }
.brand-background__item { overflow: hidden; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; background: url('/images/sub/brand/brand-background.jpg') no-repeat center / cover; opacity: 0.8; }
.brand-background__item::before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-image: linear-gradient(to bottom, rgb(6 6 6 / 100%) 0%, rgb(6 6 6 / 0%) 40%); }
.brand-background__item::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-image: linear-gradient(to top, rgb(6 6 6 / 100%) 0%, rgb(6 6 6 / 0%) 40%); }
.brand-feature__head { padding: 530px 0 290px; text-align: center; background-image: linear-gradient(to bottom, var(--background-dark) 30%, var(--clr-primary) 120%); }
.brand-feature__heading-item { display: block; margin-top: 80px; font-size: 3.6rem; font-weight: 600; }
.brand-feature__body { background: var(--clr-primary); }
.brand-card { --padding: 200px; margin: 0 var(--gap); padding: 0 7.8125% var(--padding); background: url('/images/sub/brand/brand-card-background.jpg') no-repeat center / cover; color: var(--clr-dark); }
.brand-card__section { padding-top: var(--padding); }
.brand-card__head { display: flex; justify-content: space-between; }
.brand-card__heading { font-size: 3.6rem; font-weight: 600; }
.brand-card__order { display: flex; line-height: 1; font-family: var(--font-display); font-size: 12.4rem; font-weight: 500; color: var(--clr-primary); font-style: italic; }
.brand-card__text { margin-top: 24px; font-size: 2rem; }
.brand-card__body { margin-top: 100px; }
.brand-card-lists { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.brand-card-lists__item { position: relative; }
.brand-card-lists__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--clr-dark); }
.brand-card-lists__background-item { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.brand-card-lists__contents { z-index: 2; position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 40px; height: 100%; text-align: center; border: 1px solid rgba(63 4 6 / 20%); }
.brand-card-lists__heading { font-size: 2.8rem; font-weight: 600; }
.brand-card-lists__image { margin: 24px 0; }
.brand-layer-lists { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.brand-layer-lists__item { position: relative; }
.brand-layer-lists__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--clr-dark); border-radius: inherit; }
.brand-layer-lists__background-item { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.brand-layer-lists__contents { z-index: 2; position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 40px; height: 100%; text-align: center; border: 1px solid rgba(63 4 6 / 20%); }
.brand-layer-lists__heading { font-size: 2.8rem; font-weight: 600; }
.brand-layer-lists__front { z-index: 2; position: absolute; top: 0; left: 0; padding: 36px; width: 100%; height: 100%; color: #fff; background: #3F0406; backdrop-filter: blur(20px); opacity: 0; visibility: hidden; transition: all .35s ease; }
.brand-layer-lists__context { padding: 30px 0; border-bottom: 1px solid rgb(255 255 255 / 30%); }
.brand-layer-lists__context:first-child { padding-top: 0; }
.brand-layer-lists__context:last-child { padding-bottom: 0; border-bottom: none; }
.brand-layer-lists__image { margin: 34px 0; }
.brand-layer-lists__title { display: flex; align-items: center; font-size: 2.4rem; font-weight: 600; }
.brand-layer-lists__badge { display: inline-flex; align-items: center; margin-right: 0.8889em; padding: 0 20px; height: 40px; font-size: 1.8rem; color: var(--clr-primary); font-weight: 600; background: #fff; border-radius: 40px; white-space: nowrap; }
.brand-layer-lists__p { margin-top: 20px; font-weight: 500; }
.brand-layer-lists__small { display: block; margin-top: 20px; font-weight: 500; opacity: 0.4; }
.brand-layer-lists__icon { z-index: 2; position: absolute; right: 40px; bottom: 40px; width: 60px; height: 60px; background: #340008; border-radius: 50%; }
.brand-layer-lists__icon::before { content: ''; display: block; width: 100%; height: 100%; background-size: cover; background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.3359 30H40.6693' stroke='white' stroke-width='2'/%3E%3Cpath d='M30 40.6673V19.334' stroke='white' stroke-width='2'/%3E%3C/svg%3E%0A"); }
.brand-ban { position: relative; color: #fff; }
.brand-ban__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--clr-dark); border-radius: inherit; }
.brand-ban__background-item { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.brand-ban__contents { z-index: 2; position: relative; display: flex; justify-content: space-between; padding: 40px; }
.brand-ban__heading { font-size: 2.8rem; font-weight: 600; }
.brand-ban-lists { width: 50%; }
.brand-ban-lists__item { display: flex; padding: 20px 0; border-bottom: 1px solid rgb(249 249 249 / 20%); }
.brand-ban-lists__item:first-child { border-top: 1px solid rgb(249 249 249 / 20%); }
.brand-ban-lists__side { width: 160px; aspect-ratio: 1; }
.brand-ban-lists__image { display: block; }
.brand-ban-lists__contents { margin-left: 20px; padding-left: 22px; border-left: 1px solid rgb(249 249 249 / 20%); }
.brand-beer { position: relative; min-height: 1080px; height: 100vh; height: 100dvh; }
.brand-beer__media { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.brand-beer__media-item { display: block; width: 100%; height: 100%; object-fit: cover; }
.brand-beer__media-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.brand-beer__media-layer--top { height: 60%; background-image: linear-gradient(to bottom, hsla(357, 83%, 13%, 1) 0%, hsla(357, 83%, 13%, 0.9) 5%, hsla(357, 83%, 13%, 0.72) 13%, hsla(357, 83%, 13%, 0.5) 22%, hsla(357, 83%, 13%, 0.32) 31%, hsla(357, 83%, 13%, 0.18) 40%, hsla(357, 83%, 13%, 0.08) 49%, hsla(357, 83%, 13%, 0.02) 56%, hsla(357, 83%, 13%, 0.005) 61%, hsla(357, 83%, 13%, 0) 65%, hsla(357, 83%, 13%, 0) 100%); }
.brand-beer__media-layer--bottom { top: auto; bottom: 0; height: 70%; background-image: linear-gradient(to top, hsla(0, 0%, 0%, 0.85) 0%, hsla(0, 0%, 0%, 0.65) 8%, hsla(0, 0%, 0%, 0.45) 18%, hsla(0, 0%, 0%, 0.28) 30%, hsla(0, 0%, 0%, 0.15) 42%, hsla(0, 0%, 0%, 0.05) 55%, hsla(0, 0%, 0%, 0) 65%); }
.brand-beer__contents { display: flex; align-items: flex-end; justify-content: flex-end; position: relative; padding: 0 160px 120px; height: 100%; }
.brand-beer__heading { font-size: 3.6rem; font-weight: 600; }
.brand-beer__text { margin-top: 24px; font-size: 2rem; }
.brand-brew { color: var(--clr-dark); background: var(--background-primary); }
.brand-brew__wrap { padding: 200px 9.375%; }
.brand-brew__section { display: flex; align-items: center; padding-top: 200px; }
.brand-brew__section:first-child { padding-top: 0; }
.brand-brew__side { width: 49.359%; }
.brand-brew__contents { width: 50%; }
.brand-brew__heading { font-size: 2rem; font-weight: 600; color: var(--clr-primary); }
.brand-brew__title { margin-top: 24px; line-height: 1.5; font-size: 3.6rem; font-weight: 600; }
.brand-brew__text { margin-top: 24px; }
.brand-brew .button { margin-top: 64px; }

.brand-view .brand-layer-lists__front { position: static; padding: 24px; background: #fff; opacity: 1; visibility: visible; }
.brand-view .brand-layer-lists__badge { color: #fff; background: var(--clr-primary); }
.brand-view .brand-layer-lists__context { border-color: var(--border); }
.brand-view .brand-layer-lists__title { flex-direction: column; align-items: flex-start; }
.brand-view .brand-layer-lists__badge { margin-right: 0; margin-bottom: 10px; }
@media (hover: hover) and (pointer: fine) {
}
@media screen and (min-width: 1600px) {
    .brand-layer-lists__item:hover .brand-layer-lists__front { opacity: 1; visibility: visible; }
}
@media screen and (min-width: 1025px) {
    .brand-card__section:nth-child(odd) .brand-card__contents { display: flex; justify-content: flex-end; width: 80%; }
    .brand-card__section:nth-child(even) .brand-card__head { flex-direction: row-reverse; }
    .brand-brew__section { justify-content: space-between; }
    .brand-brew__section:nth-child(odd) { flex-direction: row-reverse; }
    .brand-brew__section--2 .brand-brew__side { width: 40.641%; }
}
@media screen and (max-width: 1800px) {
    .brand-layer-lists__title { font-size: 2rem; }
    .brand-layer-lists__context { padding: 24px 0; }
    .brand-layer-lists__p { font-size: 1.6rem; }
}
@media screen and (max-width: 1600px) {
    .brand-layer-lists__front { color: inherit; }
    .brand-layer-lists__icon { bottom: auto; top: 26px; right: 26px; width: 48px; height: 48px; }
}
@media screen and (max-width: 1024px) {
    .text-period { width: 8px; height: 8px; }

	.brand-main { padding-top: 0; }
    .brand-main__wrap { margin: auto; padding: 0 5%; max-width: 640px; }
    .brand-wall { display: block; }
    .brand-wall__col { width: 100%; }
    .brand-wall__head { gap: 10px; padding-bottom: 80px; }
    .brand-wall__body { padding: 0; }
    .brand-wall__text { margin: 18px 0; font-size: 1.8rem; }
    .brand-wall__small { margin-top: 10px; }
    .brand-wall__heading-item { font-size: 2.8rem; }
    .brand-wall__heading-item .text-period { margin-left: 12px; }
    .brand-wall__contents { height: auto; }
    .brand-wall__main { height: 960px; }
    .brand-background { display: none; }
    .brand-wall__col--1 .brand-wall__heading { padding-bottom: 80px; height: auto; }
    .brand-wall__col--2 { position: static; }
    .brand-wall__col--3 .brand-wall__head { order: 2; }
    .brand-wall__col--3 .brand-wall__body { order: 1; padding: 80px 0; }
    .brand-feature__head { padding: 160px 0 80px; }
    .brand-feature__heading-logo { width: 300px; }
    .brand-feature__heading-item { font-size: 2.4rem; margin-top: 40px; }
    .brand-card { --padding: 80px; }
    .brand-card__head { display: block; }
    .brand-card__order { font-size: 6.4rem; margin-bottom: 16px; }
    .brand-card__heading { font-size: 2.4rem; }
    .brand-card__text { font-size: 1.8rem; margin-top: 10px; }
    .brand-card__body { margin-top: 30px; }
    .brand-card-lists__contents { justify-content: flex-start; padding: 30px; height: 100%; }
    .brand-card-lists__heading { font-size: 2rem; }
    .brand-card-lists__image { margin: 16px 0; }
    .brand-layer-lists { grid-template-columns: repeat(1, 1fr); }
    .brand-layer-lists__contents { padding: 34px; }
    .brand-layer-lists__context { padding: 24px 0; }
    .brand-layer-lists__heading { font-size: 2rem; }
    .brand-layer-lists__title { font-size: 1.8rem; }
    .brand-layer-lists__front { color: inherit; }
    .brand-layer-lists__image { margin: 24px 0; }
    .brand-layer-lists__p { margin-top: 10px; }
    .brand-layer-lists__badge { height: 36px; font-size: 1.6rem; }
    .brand-layer-lists__icon { bottom: auto; top: 26px; right: 26px; width: 48px; height: 48px; }
    .brand-layer-lists__small { margin-top: 10px; }
    .brand-beer { width: 100%; height: auto; min-height: 500px; aspect-ratio: 16 / 9; }
    .brand-beer__contents { justify-content: flex-start; padding: 0 5% 80px; }
    .brand-beer__heading { font-size: 2.4rem; }
    .brand-beer__text { margin-top: 12px; font-size: 1.8rem; }
    .brand-brew__wrap { padding: 120px 5%; }
    .brand-brew__section { display: block; width: 100%; }
    .brand-brew__side { width: 100%; }
    .brand-brew__contents { padding-top: 24px; width: 100%; }
    .brand-brew__section { padding-top: 80px; }
    .brand-brew__heading { font-size: 1.8rem; }
    .brand-brew__title { margin-top: 8px; font-size: 2.4rem; }
    .brand-brew__text { margin-top: 14px; }
    .brand-brew .button { margin-top: 24px; }
    .brand-ban__contents { display: block; }
    .brand-ban-lists { width: 100%; }
    .brand-ban-lists__side { width: 100px; }
    .brand-ban__background-item { object-position: left; opacity: 0.6; }
    .brand-ban__heading { font-size: 2rem; }
}
@media screen and (max-width: 768px) {
    .text-period { width: 6px; height: 6px; border-width: 1px; }

    .brand-wall__text { font-size: 1.6rem; }
    .brand-wall__heading-item { font-size: 1.8rem; }
    .brand-wall__heading-item .text-period { margin-left: 6px; }
    .brand-wall__main { height: 640px; }
    .brand-feature__heading-logo { width: 240px; }
    .brand-feature__heading-item { margin-top: 24px; font-size: 2rem; }
    .brand-card { padding: 0 5% 60px; }
    .brand-card__order { font-size: 4.2rem; }
    .brand-card__heading { font-size: 2rem; }
    .brand-card__text { font-size: 1.6rem; }
    .brand-card-lists { grid-template-columns: repeat(1, 1fr); }
    .brand-card-lists__contents { height: auto; }
    .brand-card-lists__image { margin: 12px 0; }
    .brand-layer-lists__image { margin: 12px 0; }
    .brand-layer-lists__heading { font-size: 1.8rem; }
    .brand-layer-lists__title { font-size: 1.6rem; }
    .brand-layer-lists__badge { font-size: 1.5rem; }
    .brand-ban__heading { font-size: 1.8rem; }
    .brand-ban__contents { padding: 36px 24px; }
    .brand-ban-lists__side { width: 64px; }
    .brand-ban-lists__item { display: block; }
    .brand-ban-lists__contents { margin-left: 0; margin-top: 10px; padding-left: 0; border-left: none; }
    .brand-ban__background-item { object-position: 20%; }
    .brand-brew__section { padding-top: 80px; }
    .brand-beer__heading { font-size: 1.8rem; }
    .brand-beer__text { margin-top: 10px; font-size: 1.6rem; }
    .brand-brew__heading { font-size: 1.6rem; }
    .brand-brew__title { margin-top: 4px; font-size: 1.8rem; }
    .brand-brew .button { margin-top: 16px; }
    .brand-brew__wrap { padding-top: 80px; padding-bottom: 80px; }
    .brand-brew__text { margin-top: 10px; }
}
@media screen and (max-width: 480px) {
    .brand-layer-lists__contents { padding: 24px; height: auto; }
    .brand-layer-lists__icon{ top: 18px; right: 18px; width: 36px; height: 36px; }
}


/* Taste */
.taste-main .page-lead { padding-bottom: 60px; }
.taste-introduce { position: relative; height: 400vh; height: 400dvh; }
.taste-introduce__wrap { overflow: hidden; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh;  }
.taste-introduce__text { z-index: 2; position: relative; text-align: center; font-size: 2.2rem; font-weight: 500; }
.taste-introduce__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.taste-introduce__background-item { display: block; width: 100%; height: 100%; object-fit: cover; clip-path: polygon(0% 0%, 0% 100%, 0% 100%, 0% 0%, 100% 0%, 100% 100%, 100% 100%, 100% 0%); }
.taste-introduce__background-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-image: linear-gradient(
    to bottom,
    hsla(0, 0%, 2.35%, 0) 0%,
    hsla(0, 0%, 2.35%, 0.013) 5.5%,
    hsla(0, 0%, 2.35%, 0.049) 12.1%,
    hsla(0, 0%, 2.35%, 0.104) 19.6%,
    hsla(0, 0%, 2.35%, 0.175) 27.9%,
    hsla(0, 0%, 2.35%, 0.259) 36.6%,
    hsla(0, 0%, 2.35%, 0.352) 45.6%,
    hsla(0, 0%, 2.35%, 0.45) 54.6%,
    hsla(0, 0%, 2.35%, 0.55) 63.4%,
    hsla(0, 0%, 2.35%, 0.648) 71.7%,
    hsla(0, 0%, 2.35%, 0.741) 79.4%,
    hsla(0, 0%, 2.35%, 0.825) 86.2%,
    hsla(0, 0%, 2.35%, 0.896) 91.9%,
    hsla(0, 0%, 2.35%, 0.951) 96.3%,
    hsla(0, 0%, 2.35%, 0.987) 99%,
    hsl(0, 0%, 2.35%) 100%
  );
  opacity: 0;
}
.taste-introduce__heading { z-index: 2; position: absolute; top: 18.5185%; left: 9.375%; line-height: 1.5; font-size: 3.6rem; font-weight: 600; color: #fff; opacity: 0; visibility: hidden; }
.taste-introduce__context { z-index: 2; position: absolute; bottom: 18.5185%; right: 9.375%; width: 576px; color: #fff; opacity: 0; visibility: hidden; }
.taste-introduce__lists-item { margin-bottom: 3px; line-height: 1.5; font-size: 2.2rem; font-weight: 300; }
.taste-introduce__small { display: block; font-size: inherit; opacity: 0.4; }
.taste-feature { --padding-top: 300vh; --padding-v: 40px; --padding-h: 80px; position: relative; color: #fff; background: var(--background-dark); }
.taste-feature__wrap { overflow: hidden; display: flex; align-items: center; justify-content: center; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; }
.taste-feature__heading { text-align: center; }
.taste-feature__heading-item { margin-top: 80px; font-size: 3.6rem; font-weight: 600; }
.taste-feature__background { position: absolute; top: 0; left: 0; padding: var(--padding-v) var(--padding-h); width: 100%; height: 100%; transform: translateY(100%); will-change: transform; pointer-events: none; }
.taste-feature__background-wrap { overflow: hidden; position: relative; width: 100%; height: 100%; }
.taste-feature__background-item { display: block; position: relative; width: 100%; height: 100%; object-fit: cover; }
.taste-feature__contents { display: flex; justify-content: flex-end; padding: var(--padding-top) var(--padding-h) var(--padding-v); background-image: linear-gradient(to bottom, var(--background-dark) 45%, var(--clr-primary) 115%); }
.taste-feature__lists { padding-bottom: 6.5%; width: 36.9886%; }
.taste-feature__item:first-child { padding-top: 0; }
.taste-feature__item { padding-top: 160px; }
.taste-feature__image { overflow: hidden; position: relative; }
.taste-feature__image-name { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; font-size: 3.6rem; font-weight: 600; }
.taste-feature__title { margin: 30px 0 16px; font-size: 2.4rem; font-weight: 600; }
.taste-feature__text { font-size: 2rem; }
.taste-feature__small { margin-top: 4px; font-weight: 500; opacity: 0.4; }
.taste-secret { padding-top: 200px; color: var(--clr-dark); background: var(--background-primary); }
.taste-secret__heading { margin-right: auto; margin-left: auto; max-width: var(--inner); width: 90%; text-align: center; }
.taste-secret__heading-item { line-height: 1.5; font-size: 3.6rem; font-weight: 600; }
.taste-secret__heading-text { margin-top: 24px; font-size: 2rem; }
.taste-secret__discovery { position: relative; height: 900vh; height: 900dvh; }
.taste-secret__wrap { overflow: hidden; display: flex; align-items: center; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh;  }
.taste-secret__explorer { padding: 0 80px; width: 100%; }
.taste-balance { padding: 200px 0 var(--section-bottom); color: var(--clr-dark); background: var(--background-primary); }
.taste-balance__wrap { margin-right: auto; margin-left: auto; max-width: var(--inner); width: 90%; }
.taste-balance__heading { line-height: 1.5; font-size: 3.6rem; font-weight: 600; }
.taste-balance__text { margin-top: 24px; font-size: 2rem; }
.taste-balance__flex { display: flex; justify-content: space-between; margin-top: 100px; }
.taste-balance__side { width: 54.5513%; }
.taste-balance__contents { width: 31.282%; }
.taste-balance__section { margin-top: 60px; }
.taste-balance__section-heading { margin-bottom: 18px; line-height: 1.5; font-size: 2.8rem; font-weight: 600; }
.balance-lists { display: flex; gap: 4.7%; }
.balance-lists__item { flex: 1 1; }
.balance-lists__title { margin-top: 16px; line-height: 1.6; text-align: center; font-size: 2.2rem; font-weight: 600; }
.balance-chart__item { display: flex; gap: 10px; align-items: center; margin-bottom: 3px; }
.balance-chart__item:last-child { margin-bottom: 0; }
.balance-chart__label { line-height: 1.5; width: 100px; font-size: 2.2rem; font-weight: 500; }
.balance-chart__bar { flex: 1 1; position: relative; height: 20px; border-right: 1px solid var(--clr-dark); border-left: 1px solid var(--clr-dark); }
.balance-chart__bar::before { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background: currentColor; }
.balance-chart__bar-item { position: absolute; bottom: 50%; left: 0; width: 0; height: 3px; background: #B88C49; }
.balance-table { line-height: 1.5; font-size: 2.2rem; }
.balance-table__row { display: flex; position: relative; margin-bottom: 3px; }
.balance-table__row:last-child { margin-bottom: 0; }
.balance-table__label { position: relative; padding-right: 1em; }
.balance-table__label::before { content: ''; position: absolute; top: 0; bottom: 0; right: 0.5em; margin: auto; width: 1px; height: 60%; background: currentColor; will-change: transform; }
@media screen and (max-width: 1024px) {
    .taste-introduce { margin-top: -42px; padding-bottom: 80px; height: auto; }
    .taste-introduce__wrap { display: flex; flex-direction: column; position: static; padding: 0 5%; height: auto; }
    .taste-introduce__text { font-size: 1.8rem; }
    .taste-introduce__heading { order: 2; position: static; font-size: 2.4rem; color: inherit; opacity: 1; visibility: visible; }
    .taste-introduce__context { order: 3; position: static; color: inherit; opacity: 1; visibility: visible; }
    .taste-introduce__lists { margin-top: 16px; }
    .taste-introduce__lists-item { font-size: 1.8rem; }
    .taste-introduce__background { order: 1; position: static; margin: 30px auto; }
    .taste-introduce__background-item { clip-path: none; }
    .taste-introduce__background-layer { display: none; }
    .taste-feature { --padding-top: 80px; --padding-v: 40px; --padding-h: 5%; --radius: 8px; padding: 80px 0 0; }
    .taste-feature__heading-logo { width: 320px; }
    .taste-feature__heading-item { margin-top: 30px; font-size: 2.4rem; }
    .taste-feature__wrap { display: block; position: static; height: auto; }
    .taste-feature__background { position: static; margin-top: 60px; padding: 0; transform: none; }
    .taste-feature__image-name { font-size: 3rem; }
    .taste-feature__contents { display: block; }
    .taste-feature__lists { width: 100%; }
    .taste-feature__item { padding-top: 100px; }
    .taste-feature__title { margin: 20px 0 14px; font-size: 2rem; }
    .taste-feature__text { font-size: 1.8rem; }
    .taste-secret { padding-top: 120px; }
    .taste-secret__heading-item { font-size: 2.4rem; }
    .taste-secret__heading-text { font-size: 1.8rem; }
    .taste-secret__explorer { padding: 0 5%; }
    .taste-balance { padding-top: 0; }
    .taste-balance__heading { font-size: 2.4rem; }
    .taste-balance__text { margin-top: 18px; font-size: 1.8rem; }
    .taste-balance__flex { display: block; margin-top: 80px; }
    .taste-balance__side { width: 100%; }
    .taste-balance__contents { padding-top: 20px; width: 100%; }
    .taste-balance__section { margin-top: 40px; }
    .taste-balance__section-heading { margin-bottom: 14px; font-size: 2rem; }
    #marker1,
    #marker2,
    #marker3,
    #marker4,
    #marker5 { transform: scale(1.2); }

    .balance-lists { margin: auto; max-width: 640px; }
    .balance-lists__title { margin-top: 12px; font-size: 1.8rem; }
    .balance-chart__label { font-size: 1.8rem; }
    .balance-table { font-size: 1.8rem; }
}
@media screen and (max-width: 768px) {
    .taste-introduce__text { font-size: 1.5rem; }
    .taste-introduce__heading { font-size: 2rem; }
    .taste-introduce__lists { margin-top: 12px; }
    .taste-introduce__lists-item { font-size: 1.6rem; }
    .taste-introduce__background { margin: 20px 0; }
    .taste-feature { --padding-top: 60px; --padding-v: 32px; }
    .taste-feature__heading-logo { width: 200px; }
    .taste-feature__heading-item { margin-top: 20px; font-size: 2rem; }
    .taste-feature__background { margin-top: 40px; }
    .taste-feature__image-name { font-size: 2.4rem; }
    .taste-feature__item { padding-top: 100px; }
    .taste-feature__item { padding-top: 80px; }
    .taste-feature__title { margin: 16px 0 6px; font-size: 1.8rem; }
    .taste-feature__text { font-size: 1.6rem; }
    .taste-secret { padding-top: 80px; }
    .taste-secret__heading-item { font-size: 2rem; }
    .taste-secret__heading-text { font-size: 1.6rem; }
    .taste-balance__contents { padding-top: 0; }
    .taste-balance__section-heading { font-size: 1.8rem; }
    .taste-balance__heading { font-size: 1.8rem; }
    .taste-balance__text { font-size: 1.5rem; margin-top: 10px; }
    #marker1,
    #marker2,
    #marker3,
    #marker4,
    #marker5 { transform: scale(2.2) translate(-25%, -15%); }

    .balance-chart__label { font-size: 1.6rem; }
    .balance-lists__title { margin-top: 10px; font-size: 1.5rem; }
    .balance-table { font-size: 1.6rem; }

}


/* secret-explorer */
.secret-explorer { overflow: hidden; position: relative; margin: auto; max-width: 1760px; width: 100%; border: 1px solid var(--border); }
.secret-explorer__svg { display: block; width: 100%; height: auto; }
.secret-pagination__item { position: absolute; bottom: -1px; right: -1px; padding: 30px 30px 18px 86px; background: #fff; border: 1px solid var(--border); opacity: 0; visibility: hidden; }
.secret-pagination__order { display: flex; align-items: center; justify-content: center; position: absolute; top: 30px; left: 30px; width: 36px; height: 36px; font-weight: 600; border: 1px solid var(--border); border-radius: 50%; }
.secret-pagination__heading { line-height: 1.4; font-size: 2.2rem; font-weight: 700; }
.secret-pagination__text { margin-top: 10px; }
@media screen and (max-width: 1024px) {
    .secret-explorer { overflow: visible; border: none; }
    .secret-explorer__svg { border: 1px solid var(--border); }
    .secret-pagination__heading { font-size: 1.8rem; }
    .secret-pagination { position: relative; min-height: 220px; }
    .secret-pagination__item { padding: 32px; width: 100%; }
    .secret-pagination__order { position: static; margin-bottom: 14px; }
    .secret-pagination__text { margin-top: 6px; }

}
@media screen and (max-width: 768px) {
    .secret-pagination__heading { font-size: 1.6rem; }
    .secret-pagination__item { padding: 24px; }
}


/* History */
.history-introduce { position: relative; min-height: 980px; height: 100vh; height: 100dvh; color: #fff; }
.history-introduce__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.history-introduce__background-item { display: block; width: 100%; height: 100%; object-fit: cover; }
.history-introduce__heading { display: flex; align-items: center; position: absolute; top: 0; left: 9.375%; height: 100%; }
.history-introduce__heading-item { line-height: 1.8; font-family: var(--font-secondary); font-size: 4.6rem; font-weight: 500; letter-spacing: 0.06em; writing-mode: vertical-rl; text-orientation: mixed; }
.history-introduce__heading .text-pad { padding: 0.2em 0; }
.history-introduce__heading .text-period { margin: 0 0 0 20px; }
.history-introduce__contents { display: flex; align-items: flex-end; position: absolute; top: 0; right: 9.375%; padding-bottom: 160px; min-width: 540px; height: 100%; }
.history-introduce__title { line-height: 1.6; font-family: var(--font-secondary); font-size: 3.6rem; font-weight: 500; }
.history-introduce__text { margin-top: 24px; font-size: 2rem; }
.history-introduce__text:first-of-type { font-weight: 600; }
.history-journey { position: relative; }
.journey-top { display: flex; align-items: center; justify-content: center; position: relative; min-height: 980px; height: 100vh; height: 100dvh; }
.journey-top__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.journey-top__background-item { display: block; width: 100%; height: 100%; object-fit: cover; }
.journey-top__contents { z-index: 2; position: relative; text-align: center; color: #fff; }
.journey-top__logo { width: 395px; }
.journey-top__heading { margin: 60px 0 12px; font-size: 3.6rem; font-weight: 600; }
.journey-top__text { font-size: 2rem; }
.journey-main { --padding: 200px; --gap: 160px; --color: #DDDDDD; padding-bottom: var(--padding); padding-right: 30px; padding-left: 30px; }
.journey-main__section { padding-top: var(--padding); }
.journey-main__head { padding-bottom: 120px; text-align: center; margin-right: auto; margin-left: auto; max-width: var(--inner); width: 90%; }
.journey-main__body { position: relative; }
.journey-main__heading { line-height: 1.5; font-size: 3.6rem; font-weight: 600; }
.journey-main__text { margin-top: 12px; font-size: 2rem; }
.journey-list { margin: auto; max-width: 1280px; }
.journey-list__item { padding-top: 120px; padding-right: 50%; }
.journey-list__item:first-child { padding-top: 0; }
.journey-list__item--reverse { padding-right: 0; padding-left: calc(50% + 1px); }
.journey-list__item--reverse .journey-group__item { padding-right: 0; padding-left: var(--gap); }
.journey-list__item--reverse .journey-year__item { padding-left: var(--gap); padding-right: 0; }
.journey-list__item--reverse .journey-group__marker { right: 100%; left: auto; width: var(--gap); transform: scaleX(-1); transition: all ease .35s; }
.journey-list__item--reverse .journey-year .journey-group__marker { margin-left: 0; margin-right: calc(var(--gap) * -1); }
.journey-year { position: relative; }
.journey-year .journey-group__marker { margin-left: calc(var(--gap) * -1); }
.journey-year__item { display: block; margin-bottom: 30px; padding-right: var(--gap); line-height: 0.68; font-family: var(--font-display); font-size: 9rem; font-weight: 600; color: var(--clr-primary); letter-spacing: -0.06em; }
.journey-group__item { padding-top: 120px; padding-right: var(--gap); }
.journey-group__item:first-child { padding-top: 0; }
.journey-group__marker { position: absolute; top: 50%; left: 100%; width: calc(var(--gap) - 1px); height: 1px;
    background-image: linear-gradient(to right, var(--color) 3px, transparent 3px);
    background-size: 7px 100%;
    background-repeat: repeat-x;
}
.journey-group__marker::after { content: ''; z-index: 2; position: absolute; top: 0; left: 100%; margin: -5px 0 0 -5px; width: 12px; height: 12px; background: var(--color); border-radius: 50%; transition: background .35s ease; }
.journey-group__image { position: relative; margin-bottom: 30px; min-height: 200px; background: #000; }
.journey-group__image-item { width: 100%; }
.journey-group__title { line-height: 1.65; font-size: 2.4rem; font-weight: 700; }
.journey-group__text { margin-top: 8px; font-size: 2rem; }
.journey-progress { position: absolute; top: 3px; left: 50%; margin-left: -1px; width: 2px; height: 100%; background: var(--color); }
.journey-progress::before { content: ''; z-index: 2; position: absolute; top: 0; left: 0; margin: -5px 0 0 -5px; width: 12px; height: 12px; background: #fff; border: 3px solid var(--color); border-radius: 50%; transition: border .35s ease; }
.journey-progress__path { position: absolute; top: 0; left: 0; width: 100%; height: 0; background: var(--clr-primary); }

.journey-navigation { z-index: 3; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.journey-navigation__wrap { z-index: 3; display: flex; align-items: flex-end; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; }
.journey-navigation__lists { display: flex; align-items: center; position: relative; width: 100%; pointer-events: auto; }
.journey-navigation__lists::before,
.journey-navigation__lists::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgb(0 0 0 / 0%), rgb(0 0 0 / 100%) ); transition: opacity .35s ease; }
.journey-navigation__lists::after { background: linear-gradient(to bottom, rgb(255 250 240 / 0%) 0%, rgb(255 250 240 / 5%) 15%, rgb(255 250 240 / 15%) 28%, rgb(255 250 240 / 35%) 45%, rgb(255 250 240 / 60%) 65%, rgb(255 250 240 / 85%) 85%, rgb(255 250 240) 100%); opacity: 0; }
.journey-navigation__item { flex: 1 1; z-index: 2; position: relative; }
.journey-navigation__link { display: flex; align-items: center; justify-content: center; height: 100px; line-height: 1.2; text-align: center; font-size: 2rem; font-weight: 600; color: #fff; transition: color .35s ease; }
.journey-navigation__progress { --percent: 0; position: absolute; bottom: 0; left: 0; width: 100%; height: 10px; background: var(--background-primary); }
.journey-navigation__progress-bar { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--clr-primary); transform: scaleX(var(--percent)); transform-origin: left; }

.journey-navigation[data-journey-sticky] .journey-navigation__lists::before { opacity: 0; }
.journey-navigation[data-journey-sticky] .journey-navigation__lists::after { opacity: 1; }
.journey-navigation[data-journey-sticky] .journey-navigation__link { color: var(--clr-dark); }
.journey-group__item--active { --color: var(--clr-primary); }
.journey-list__item--active { --color: var(--clr-primary); }
.journey-progress--active::before { border-color: var(--clr-primary); }
@media screen and (max-width: 1024px) {
    .history-introduce { width: 100%; height: auto; min-height: 540px; aspect-ratio: 16 / 9; }
    .history-introduce__heading { display: none; }
    .history-introduce__contents { left: 5%; right: auto; padding-bottom: 80px; min-width: auto; }
    .history-introduce__title { font-size: 3rem; }
    .history-introduce__text { font-size: 1.8rem; margin-top: 18px; }

    .journey-top__logo { width: 300px; }
    .journey-top__heading { margin: 30px 0 10px; font-size: 2.4rem; }
    .journey-top__text { font-size: 1.8rem; }
    .journey-navigation__link { font-size: 1.8rem; height: 60px; }
    .journey-navigation__progress { height: 5px; }
    .journey-main { --padding: 100px; --gap: 60px; padding: 0 5% var(--section-bottom); }
    .journey-group__item { padding-right: 0; padding-left: var(--gap); }
    .journey-year__item { padding-left: var(--gap); padding-right: 0; font-size: 6rem; }
    .journey-list__item { padding-top: 80px; padding-right: 0; }
    .journey-group__item { padding-top: 80px; }
    .journey-group__image { margin-bottom: 20px; }
    .journey-group__title { font-size: 2rem; }
    .journey-group__text { font-size: 1.8rem; }
    .journey-group__marker { right: 100%; left: auto; width: var(--gap); transform: scaleX(-1); transition: all ease .35s; }
    .journey-group__marker::after { margin-left: -6px; }
    .journey-progress { left: 0; }
    .journey-list__item--reverse { padding-left: 0; }
    .journey-main__head { padding-bottom: 60px; }
    .journey-main__heading { font-size: 3rem; }
    .journey-main__text { font-size: 1.8rem; }
}
@media screen and (max-width: 768px) {
    .history-introduce__contents { padding-bottom: 60px; }
    .history-introduce__title { font-size: 2.2rem; }
    .history-introduce__text { font-size: 1.6rem; margin-top: 14px; }

    .journey-main { --padding: 80px; --gap: 40px; }
    .journey-top__logo { width: 240px; }
    .journey-top__heading { margin: 20px 0 6px; font-size: 2rem; }
    .journey-top__text { font-size: 1.6rem; }
    .journey-navigation__link { font-size: 1.6rem; height: 55px; }
    .journey-group__image { margin-bottom: 14px; }
    .journey-group__title { font-size: 1.8rem; }
    .journey-group__text { font-size: 1.5rem; }
    .journey-year__item { font-size: 3.6rem; }
    .journey-main__head { padding-bottom: 46px; }
    .journey-main__heading { font-size: 2.4rem; }
    .journey-main__text { font-size: 1.6rem; }
}


/* Discover */
.discover-introduce { position: relative; }
.discover-introduce .page-lead { z-index: 2; position: relative; }
.discover-introduce__wrap { overflow: hidden; display: flex; align-items: center; justify-content: center; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; min-height: 800px; text-align: center; color: #fff; }
.discover-introduce__heading { z-index: 2; position: relative; margin-top: 24px; line-height: 1.4; text-align: center; font-family: var(--font-secondary); font-size: 6.4rem; font-weight: 500; }
.discover-introduce__heading-span { margin-right: -3.185em; clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); }
.discover-introduce__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.discover-introduce__background-item { display: block; width: 100%; height: 100%; object-fit: cover; }
.discover-feature { padding-top: 200px; text-align: center; }
.discover-feature__heading { font-size: 3.6rem; font-weight: 600; }
.discover-feature__text { margin-top: 20px; }
.discover-premium { overflow: hidden; position: relative; margin-top: 110px; padding: 40px; background: #000; }
.discover-premium__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.discover-premium__background-item { display: block; width: 100%; height: 100%; object-fit: cover; }
.discover-premium__logo { z-index: 2; position: relative; margin: 120px 0; width: 394px; }
.discover-premium__lists { z-index: 2; position: relative; display: flex; align-items: center; gap: 20px; text-align: left; color: #fff; border-top: 1px solid rgb(249 249 249 / 20%); }
.discover-premium__item { display: flex; padding: 20px 0 0; width: 33.3333%; }
.discover-premium__order { font-size: 1.6rem; }
.discover-premium__side { flex-shrink: 0; width: 160px; aspect-ratio: 1; }
.discover-premium__image { display: block; }
.discover-premium__contents { display: flex; flex-direction: column; justify-content: space-between; margin-left: 20px; padding-left: 22px; border-left: 1px solid rgb(249 249 249 / 20%); }
.discover-find { padding: 210px 0 var(--section-bottom); }
.discover-find__heading { font-size: 3.6rem; font-weight: 600; }
.discover-find__text { margin-top: 24px; font-size: 2rem; }
.discover-find .finder { margin-top: 100px; }
@media screen and (max-width: 1024px) {
    .discover-introduce { height: auto; }
    .discover-introduce__wrap { display: block; height: auto; min-height: auto; }
    .discover-introduce__heading { display: none; }
    .discover-introduce__background { position: static; margin: auto; padding: 0 5%; max-width: 640px; height: auto; transform: none; }
    .discover-feature { padding-top: 80px; }
    .discover-feature__heading { font-size: 2.4rem; }
    .discover-feature__text { margin-top: 6px; }
    .discover-premium { margin-top: 80px; padding: 24px; }
    .discover-premium__logo { margin: 80px 0; width: 240px; }
    .discover-premium__order { font-size: 1.5rem; }
    .discover-premium__side { width: 80px; }
    .discover-premium__contents { margin-left: 12px; padding-left: 12px; }
    .discover-find { padding-top: 120px; }
    .discover-find__heading { font-size: 2.4rem; }
    .discover-find__text { font-size: 1.6rem; margin-top: 16px; }
    .discover-find .finder { margin-top: 80px; }
}
@media screen and (max-width: 768px) {
    .discover-feature { padding-top: 60px; }
    .discover-feature__heading { font-size: 2rem; }
    .discover-premium { margin-top: 60px; }
    .discover-premium__logo { margin: 46px 0; width: 140px; }
    .discover-premium__order { font-size: 1.4rem; }
    .discover-premium__lists { display: block; }
    .discover-premium__item { width: 100%; }
    .discover-premium__side { width: 64px; }
    .discover-premium__contents { margin-left: 10px; padding-left: 12px; }
    .discover-find { padding-top: 80px; }
    .discover-find__heading { font-size: 1.8rem; }
    .discover-find__text { font-size: 1.5rem; margin-top: 12px; }
    .discover-find .finder { margin-top: 60px; }
}


/* Brewery */
.shape-infinity { display: inline-flex; margin-left: 0.1em; width: 42px; height: 42px; transform: translateY(4px); }
.shape-infinity::before { content: ''; display: block; width: 100%; height: 100%;  background-color: currentColor; mask-size: contain; mask-repeat: no-repeat; mask-position: center; mask-image: url("data:image/svg+xml,%3Csvg width='43' height='18' viewBox='0 0 43 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.0437607 8.01893C0.683761 2.19493 6.95576 -1.83707 12.9718 0.850931C15.9798 2.19493 17.3238 3.34693 21.2278 6.86693C25.1318 3.34693 26.4758 2.19493 29.4838 0.850931C35.4358 -1.77307 41.7718 2.19493 42.4118 8.01893C42.9878 13.2669 38.6998 18.4509 33.0038 17.8749C26.4118 17.2349 22.7638 12.4349 21.2278 11.0909C19.6918 12.4349 16.0438 17.2349 9.45176 17.8749C3.56376 18.4509 -0.468239 12.7549 0.0437607 8.01893ZM3.69176 9.29893C3.75576 12.5629 7.01976 15.0589 10.5398 14.2269C14.1878 13.3309 15.2758 12.3709 18.6678 8.97893C15.4038 6.16293 13.6758 4.88293 11.4998 4.11493C6.25176 2.32293 3.62776 6.48293 3.69176 9.29893ZM38.7638 9.29893C38.8278 6.48293 36.2038 2.32293 30.9558 4.17893C28.7798 4.94693 27.0518 6.16293 23.7878 8.97893C27.1798 12.3709 28.2678 13.4589 31.9158 14.2909C35.4358 15.1229 38.6998 12.5629 38.7638 9.29893Z' /%3E%3C/svg%3E%0A"); }

.brewery-introduce { --blur: 30px; position: relative; height: 300vh; height: 300dvh; color: #fff; }
.brewery-introduce [data-animate] { visibility: hidden; opacity: 0; will-change: transform; }
.brewery-introduce__wrap { overflow: hidden; position: sticky; top: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; }
.brewery-introduce__wrap::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.brewery-introduce__background { overflow: hidden; width: 100%; height: 100%; background: #000; pointer-events: none; }
.brewery-introduce__background-back { display: block; width: 100%; height: 100%; object-fit: cover; }
.brewery-introduce__background-front { z-index: 3; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; opacity: 0; }
.brewery-introduce__background-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(0 0 0 / 15%); -webkit-backdrop-filter: blur(var(--blur)); backdrop-filter: blur(var(--blur)); opacity: 0; }
.brewery-introduce__left { display: flex; align-items: center; z-index: 2; position: absolute; left: 9.375%; width: 25%; height: 100%; }
.brewery-introduce__right { display: flex; align-items: center; z-index: 2; position: absolute; right: 9.375%; width: 25%; height: 100%; }
.brewery-introduce__right .brewery-introduce__contents { padding-top: 38%; }
.brewery-introduce__heading { line-height: 1.2; font-size: 6.4rem; font-weight: 600; }
.brewery-introduce__title { margin-top: 40px; font-size: 2.2rem; font-weight: 700; }
.brewery-introduce__text { margin-top: 24px; }
.brewery-prologue { background: var(--clr-apricot); }
.brewery-prologue__introduce { display: flex; min-height: 800px; height: 100vh; height: 100dvh; }
.brewery-prologue__side { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 50%; background: url('/images/sub/discover/brewery/brewery-prologue-background.jpg') repeat center / cover; }
.brewery-prologue__contents { display: flex; align-items: center; padding-left: 9.375%; width: 50%; }
.brewery-prologue__heading { margin-bottom: 40px; font-size: 6.4rem; font-weight: 500; }
.brewery-prologue__text { margin-top: 20px; }
.brewery-prologue__title { display: flex; align-items: center; margin-bottom: 100px; text-align: center; font-family: var(--font-display); font-size: 2.8rem; font-weight: 600; color: #fff; letter-spacing: -0.05em; }
.brewery-prologue__title-logo { margin: -0.25em 0 0 0.5em; width: 34px; }
.brewery-prologue__image { width: 62.5%; }
.prologue-space { position: relative; padding: 200px 0; }
.prologue-space__wrap { display: flex; }
.prologue-space__side { position: relative; padding: 40px 0 240px 9.375%; width: 33%; }
.prologue-space__contents { padding-right: 8.3333%; width: 69%; }
.prologue-indicator { position: sticky; top: calc(50% - 74px); left: 0; width: 100%; }
.prologue-indicator__wrap { display: flex; font-size: 2.8rem; font-weight: 600; }
.prologue-indicator__marker { margin-right: 20px; }
.prologue-indicator__item { padding: 0.05em 0; }
.prologue-indicator__item-span { background-image: linear-gradient(transparent calc(100% - 3px), var(--clr-dark) 3px); background-size: 0% 100%; background-repeat: no-repeat; transition: background-size .3s; opacity: 0.3; transition: all .35s ease; }
.prologue-indicator__item[data-current] .prologue-indicator__item-span { background-size: 100% 100%; opacity: 1; }
.prologue-space__section { overflow: hidden; position: relative; margin: 40px 0; height: 540px; }
.prologue-space__section:last-child { margin-bottom: 0; }
.prologue-space__section:first-child { margin-top: 0; }
.prologue-space__context { z-index: 2; position: absolute; top: 0; left: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 40px; width: 100%; height: 100%; color: #fff; background: linear-gradient(to bottom, rgb(0 0 0 / 0%) 0%, rgb(0 0 0 / 100%) 100%); }
.prologue-space__heading { display: flex; align-items: center; font-size: 2.2rem; font-weight: 500; }
.prologue-space__heading-hangul { position: relative; padding-right: 16px; }
.prologue-space__heading-hangul::after { content: ''; position: absolute; top: 0; bottom: 0; right: 8px; margin: auto; width: 1px; height: 50%; background: rgb(255 255 255 / 50%); }
.prologue-space__text { margin-top: 16px; font-size: 2rem; }
.prologue-slide { height: 100%; }
.prologue-slide__image { overflow: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; }
.prologue-slide__image-item { display: block; width: 100%; height: 100%; object-fit: cover; }
.prologue-space__section .swiper-pagination { gap: 10px; bottom: auto; top: 40px; left: 40px; width: auto; }
.prologue-space__section .swiper-pagination .swiper-pagination-bullet { display: inline-flex; align-items: center; justify-content: center; margin: 0; width: 36px; height: 36px; font-size: 2.2rem; color: #fff; background: transparent; border-radius: 0; opacity: 1; }
.prologue-space__section .swiper-pagination .swiper-pagination-bullet-active { background: #3F0406; }

.brewery-beer { padding-top: 200px; }
.brewery-beer__wrap { position: relative; margin-right: auto; margin-left: auto; max-width: var(--inner); width: 90%; }
.brewery-beer__heading-item { font-size: 3.6rem; font-weight: 500; }
.brewery-beer__heading-text { margin-top: 22px; }
.brewery-card { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; margin-top: 100px; padding: 40px; background: #EEE3D8; }
.brewery-card__item { position: relative; padding: 40px; background: #fff;}
.brewery-card__item:first-child .brewery-card__title { background: #9D684E; }
.brewery-card__heading-item { font-size: 2rem; font-weight: 500; }
.brewery-card__heading-large { margin-top: 10px; font-size: 3.6rem; font-weight: 500; }
.brewery-card__image { position: absolute; top: 40px; right: 40px; width: 182px; }
.brewery-card__title { display: inline-flex; align-items: center; margin-top: 112px; padding: 4px 16px; font-weight: 500; color: #fff; background: #2E2321; border-radius: 40px; }
.brewery-card__text { margin-top: 24px; }
.brewery-location { padding: 200px 0 var(--section-bottom); }
.brewery-location__wrap { position: relative; margin-right: auto; margin-left: auto; max-width: var(--inner); width: 90%; }
.brewery-location__heading-item { font-size: 3.6rem; font-weight: 500; }
.brewery-location__heading-text { margin-top: 22px; }
.brewery-access { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; margin-top: 100px; padding: 40px; background: #EEE3D8; }
.brewery-access__box { padding: 40px; background: #fff; border: 1px solid #9D684E; }
.brewery-access__block { padding-left: 40px; }
.brewery-access__heading { margin-bottom: 30px; }
.brewery-access__data { line-height: 1.6; }
.brewery-access__row { display: flex; margin-bottom: 12px; }
.brewery-access__row:last-child { margin-bottom: 0; }
.brewery-access__dt { width: 100px; font-weight: 500; }
.brewery-access__dd { flex: 1 1; padding-left: 20px; }
.brewery-access__small { display: block; margin-top: 4px; font-size: 1.6rem; color: #666666; }
.brewery-access__title { margin-bottom: 6px; font-family: var(--font-display); font-size: 6.4rem; font-weight: 700; color: #9D684E; }

@media (hover: hover) and (pointer: fine) {
}
@media screen and (min-width: 1025px) {
    .brewery-beer__buttons { position: absolute; top: 50px; right: 0; }
    .brewery-beer__heading { padding-right: 300px; }
    .brewery-location__buttons { position: absolute; top: 50px; right: 0; }
    .brewery-location__heading { padding-right: 300px; }
}
@media screen and (max-width: 1024px) {
    .shape-infinity { width: 34px; height: 34px; }

    .brewery-introduce { padding-bottom: 80px; height: auto; color: inherit; }
    .brewery-introduce [data-animate] { opacity: 1; visibility: visible; }
    .brewery-introduce__wrap { display: flex; flex-direction: column; position: static; padding: 0 5%; height: auto; }
    .brewery-introduce__left { order: 2; width: 100%; position: static; }
    .brewery-introduce__right { order: 3; width: 100%; position: static; }
    .brewery-introduce__background { order: 1; margin: 0 auto 60px; max-width: 640px; }
    .brewery-introduce__heading { font-size: 4.2rem; }
    .brewery-introduce__title { margin-top: 30px; font-size: 1.8rem; }
    .brewery-introduce__text { margin-top: 0; }
    .brewery-introduce__right .brewery-introduce__contents { padding-top: 40px; }
    .brewery-prologue__introduce { display: block; height: auto; min-height: auto; }
    .brewery-prologue__contents { padding: 80px 5%; width: 100%; }
    .brewery-prologue__side { padding: 80px 5%; width: 100%; }
    .brewery-prologue__heading { margin-bottom: 20px; font-size: 4.2rem; }
    .brewery-prologue__text { margin-top: 10px; }
    .brewery-prologue__title { font-size: 2.4rem; margin-bottom: 40px; }

    .prologue-space { padding: 80px 0; }
    .prologue-space__wrap { display: block; padding: 0 5%; }
    .prologue-space__side { display: none; }
    .prologue-space__contents { padding-right: 0; width: 100%; }
    .prologue-space__context { padding: 32px; }
    .prologue-space__section { margin: 30px 0; width: 100%; min-height: 300px; height: auto; aspect-ratio: 2.0592; }
    .prologue-space__section .swiper-pagination { gap: 5px; top: 32px; left: 32px; }
    .prologue-space__section .swiper-pagination .swiper-pagination-bullet { width: 30px; height: 30px; font-size: 1.5rem; }
    .prologue-space__heading { font-size: 1.8rem; }
    .prologue-space__text { font-size: 1.5rem; }
    .brewery-beer__heading-item { font-size: 2.4rem; }
    .brewery-beer__heading-text { margin-top: 10px; }
    .brewery-card { gap: 24px; margin-top: 40px; padding: 32px; }
    .brewery-card__item { padding: 32px; }
    .brewery-card__image { width: 112px; }
    .brewery-card__heading-item { font-size: 1.6rem; }
    .brewery-card__heading-large { font-size: 2.4rem; }
    .brewery-card__title { margin-top: 80px; }
    .brewery-card__text { margin-top: 16px; }
    .brewery-beer__buttons { margin-top: 40px; text-align: center; }
    .brewery-location__heading-item { font-size: 2.4rem; }
    .brewery-location__heading-text { margin-top: 10px; }
    .brewery-access { gap: 24px; margin-top: 40px; padding: 32px; }
    .brewery-access__box { padding: 32px; }
    .brewery-access__heading { margin-bottom: 20px; }
    .brewery-access__dt { width: 80px; }
    .brewery-access__small { font-size: 1.4rem; }
    .brewery-access__title { font-size: 4.2rem; }
    .brewery-access__block { padding-left: 16px; }
    .brewery-location__buttons { margin-top: 40px; text-align: center; }

    .brewery-beer { padding-top: 120px; }
    .brewery-location { padding-top: 120px; }
}
@media screen and (max-width: 768px) {
    .shape-infinity { width: 24px; height: 24px; }

    .brewery-introduce { padding-bottom: 80px; }
    .brewery-introduce__background { margin-bottom: 40px; }
    .brewery-introduce__heading { font-size: 2.4rem; }
    .brewery-introduce__title { margin-top: 14px; font-size: 1.6rem; }
    .brewery-prologue__contents { padding: 60px 5%; }
    .brewery-prologue__side { padding: 60px 5%; }
    .brewery-prologue__heading { margin-bottom: 10px; font-size: 2.4rem; }
    .brewery-prologue__text { margin-top: 8px; }
    .brewery-prologue__title { font-size: 2rem; margin-bottom: 30px; }
    .prologue-space__heading { font-size: 1.6rem; }
    .prologue-space__text { font-size: 1.4rem; }
    .brewery-beer__heading-item { font-size: 1.8rem; }
    .brewery-beer__heading-text { margin-top: 4px; }
    .brewery-card { grid-template-columns: repeat(1, 1fr); gap: 16px; margin-top: 30px; padding: 24px; }
    .brewery-card__item { padding: 24px; }
    .brewery-card__image { top: 24px; right: 20px; width: 96px; }
    .brewery-card__heading-item { font-size: 1.5rem; }
    .brewery-card__heading-large { font-size: 2rem; }
    .brewery-card__title { margin-top: 60px; }
    .brewery-card__text { margin-top: 14px; }
    .brewery-beer__buttons { margin-top: 34px; }
    .brewery-location__heading-item { font-size: 2rem; }
    .brewery-location__heading-text { margin-top: 6px; }
    .brewery-access { grid-template-columns: repeat(1, 1fr); gap: 16px; margin-top: 30px; padding: 24px; }
    .brewery-access__box { padding: 24px; }
    .brewery-access__heading { margin-bottom: 14px; }
    .brewery-access__dt { width: 80px; }
    .brewery-access__small { font-size: 1.3rem; }
    .brewery-access__title { font-size: 3rem; margin-top: 30px; }
    .brewery-access__block { padding-left: 0; }
    .brewery-location__buttons { margin-top: 34px; }


    .brewery-beer { padding-top: 80px; }
    .brewery-location { padding-top: 80px; }
}
@media screen and (max-width: 480px) {
    .brewery-card { padding: 16px; }
    .brewery-card__image { width: 72px; }
    .brewery-card__title { margin-top: 40px; padding: 10px 16px; line-height: 1.4; border-radius: 8px; }
    .brewery-access { padding: 16px; }
    .brewery-access__title { font-size: 2.4rem; }
    .brewery-access__row { display: block; }
    .brewery-access__dt { margin-bottom: 2px; width: 100%; }
    .brewery-access__dd { padding-left: 0; }
}


/* YEBISU MASTER */
.yebisu-main { text-align: center; color: #3F0406; }
.yebisu-main .inner { max-width: 1600px; }
.yebisu-main .section-badge { display: inline-flex; align-items: center; padding: 0 40px; height: 100px; color: #FCD475; background: #3F0406; border-radius: 100px; }
.yebisu-main .section-badge .order { position: relative; display: block; margin-right: 24px; padding-right: 24px; font-size: 2.8rem; font-weight: 600; }
.yebisu-main .section-badge .order::after { content: ''; position: absolute; top: 0; bottom: 0; right: 0; margin: auto; width: 1px; height: 50%; background: currentColor; }
.yebisu-main .section-badge .title { font-size: 2.8rem; font-weight: 600; }
.yebisu-main .section-hero { padding-top: var(--header-height); }
.yebisu-main .section-parent-1 { padding: 240px 0; background: url('/images/sub/discover/yebisu/introduce-background.jpg') no-repeat center / cover; }
.yebisu-main .section-introduce .text-top { margin: 96px 0; }
.yebisu-main .section-introduce .text-top .text { font-family: var(--font-secondary); font-size: 4rem; font-weight: 600; }
.yebisu-main .section-introduce .text-top .text b { font-size: 6.4rem; font-weight: 700; }
.yebisu-main .section-introduce .text-bottom { margin-top: 100px; }
.yebisu-main .section-introduce .text-bottom .text { margin-bottom: 48px; font-size: 3.6rem; font-weight: 500; }
.yebisu-main .section-introduce .text-bottom .text:last-child { margin-bottom: 0; }
.yebisu-main .section-grade { padding-top: 240px; }
.yebisu-main .section-grade .lists { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; margin-top: 100px; }
.yebisu-main .section-grade .lists .item { overflow: hidden; position: relative; padding: 110px 82px; background: #4B0000; }
.yebisu-main .section-grade .lists .item::after { content: ''; position: absolute; right: -66px; bottom: -66px; width: 132px; height: 132px; background: url('/images/sub/discover/yebisu/grade-shape.svg') no-repeat center / cover; }
.yebisu-main .section-grade .lists .line { margin: 52px 0; height: 11px; border-top: 2px solid #FCD475; border-bottom: 1px solid #FCD475; }
.yebisu-main .section-grade .lists .text { line-height: 1.5; font-family: var(--font-secondary); font-size: 3rem; color: #FCD475; }
.yebisu-main .section-ratio { padding: 192px 0 0; background: url('/images/sub/discover/yebisu/ratio-background.jpg') no-repeat center / cover;}
.yebisu-main .section-ratio .text-top { margin-bottom: 160px; }
.yebisu-main .section-ratio .text-top .heading { margin: 48px 0 32px; font-family: var(--font-secondary); font-size: 6.4rem; font-weight: 700; color: #fff; }
.yebisu-main .section-ratio .text-top .text { font-size: 3.6rem; font-weight: 500; color: #fff; }
.yebisu-main .section-ratio .image { position: relative; margin-bottom: -130px; }
.yebisu-main .section-ratio .image .lists { display: grid; gap: 30px; position: absolute; top: 0; left: 0; max-width: 200px; }
.yebisu-main .section-ratio .image .center { max-width: 694px; }
.yebisu-main .section-store { padding: 360px 0 var(--section-bottom); background: url('/images/sub/discover/yebisu/store-background.jpg') no-repeat top center / cover; }
.yebisu-main .section-store .text-top { margin: 48px 0 120px; }
.yebisu-main .section-store .text-top .heading { margin-bottom: 32px; line-height: 1.5; font-size: 6.4rem; font-family: var(--font-secondary); font-weight: 700; }
.yebisu-main .section-store .text-top .text { font-size: 3.2rem; font-weight: 500; }

.yebisu-premium { padding-top: var(--header-height); text-align: center; color: #440206; background: #fefcd6; }
.yebisu-premium .section-introduce { padding: 240px 0; background: url('/images/sub/campaign/premium/introduce-background.jpg') no-repeat center / cover; }
.yebisu-premium .section-introduce .text-top .text { line-height: 2; font-family: var(--font-secondary); font-size: 4rem; font-weight: 500; }
.yebisu-premium .section-introduce .text-top .heading { margin: 80px 0 240px; font-family: var(--font-secondary); font-size: 7.2rem; font-weight: 600; }
.yebisu-premium .section-introduce .media { position: relative; padding-top: 56.26%; }
.yebisu-premium .section-introduce .media iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
@media screen and (max-width: 1024px) {
    .yebisu-main .section-badge { padding: 0 24px; height: 64px; }
    .yebisu-main .section-badge .order { margin-right: 12px; padding-right: 12px; font-size: 1.8rem; }
    .yebisu-main .section-badge .title { font-size: 1.8rem; }
    .yebisu-main .section-parent-1 { padding: 120px 0; }
    .yebisu-main .section-introduce .text-top { margin: 48px 0; }
    .yebisu-main .section-introduce .text-top .text { font-size: 2.6rem; }
    .yebisu-main .section-introduce .text-top .text b { font-size: 3.6rem; }
    .yebisu-main .section-introduce .text-bottom { margin-top: 48px; }
    .yebisu-main .section-introduce .text-bottom .text { font-size: 2.4rem; margin-bottom: 24px; }
    .yebisu-main .section-grade { padding-top: 120px; }
    .yebisu-main .section-grade .lists { gap: 20px; margin-top: 48px; }
    .yebisu-main .section-grade .lists .item { padding: 64px 34px; }
    .yebisu-main .section-grade .lists .item::after { right: -50px; bottom: -50px; width: 100px; height: 100px; }
    .yebisu-main .section-grade .lists .image img { max-width: 180px; }
    .yebisu-main .section-grade .lists .text { font-size: 2rem; }
    .yebisu-main .section-grade .lists .line { margin: 32px 0; height: 9px; }
    .yebisu-main .section-ratio { padding: 120px 0 0; }
    .yebisu-main .section-ratio .text-top { margin-bottom: 64px; }
    .yebisu-main .section-ratio .text-top .heading { margin: 32px 0 16px; font-size: 3.6rem; }
    .yebisu-main .section-ratio .text-top .text { font-size: 2.4rem; }
    .yebisu-main .section-ratio .image { margin-bottom: -70px; }
    .yebisu-main .section-ratio .image .center { max-width: 370px; }
    .yebisu-main .section-ratio .image .lists { max-width: 112px; }
    .yebisu-main .section-store { padding: 160px 0 120px; }
    .yebisu-main .section-store .text-top { margin: 32px 0 60px; }
    .yebisu-main .section-store .text-top .heading { margin-bottom: 16px; font-size: 3.6rem; }
    .yebisu-main .section-store .text-top .text { font-size: 2.4rem; }

    .yebisu-premium .section-introduce { padding: 120px 0; }
    .yebisu-premium .section-introduce .text-top .text { font-size: 2.4rem; }
    .yebisu-premium .section-introduce .text-top .heading { margin: 48px 0 100px; font-size: 3.6rem; }
}
@media screen and (max-width: 768px) {
    .yebisu-main .section-badge { padding: 0 20px; height: 52px; }
    .yebisu-main .section-badge .order { margin-right: 8px; padding-right: 8px; font-size: 1.4rem; }
    .yebisu-main .section-badge .title { font-size: 1.4rem; }
    .yebisu-main .section-parent-1 { padding: 80px 0; }
    .yebisu-main .section-introduce .text-top { margin: 34px 0; }
    .yebisu-main .section-introduce .text-top .text { font-size: 1.6rem; }
    .yebisu-main .section-introduce .text-top .text b { font-size: 2.4rem; }
    .yebisu-main .section-introduce .text-bottom { margin-top: 34px; }
    .yebisu-main .section-introduce .text-bottom .text { font-size: 1.6rem; margin-bottom: 16px; }
    .yebisu-main .section-grade { padding-top: 80px; }
    .yebisu-main .section-grade .lists { grid-template-columns: repeat(1, 1fr); margin-top: 34px;  }
    .yebisu-main .section-grade .lists .item { padding: 48px 34px; }
    .yebisu-main .section-grade .lists .item::after { right: -32px; bottom: -32px; width: 64px; height: 64px; }
    .yebisu-main .section-grade .lists .text { font-size: 1.6rem; }
    .yebisu-main .section-grade .lists .line { margin: 24px 0; }
    .yebisu-main .section-grade .lists .image img { max-width: 140px; }
    .yebisu-main .section-ratio { padding: 80px 0 0; }
    .yebisu-main .section-ratio .text-top { margin-bottom: 34px; }
    .yebisu-main .section-ratio .text-top .heading { margin: 24px 0 12px; font-size: 2.4rem; }
    .yebisu-main .section-ratio .text-top .text { font-size: 1.8rem; }
    .yebisu-main .section-ratio .image { margin-bottom: -50px; }
    .yebisu-main .section-ratio .image .center { max-width: 270px; }
    .yebisu-main .section-ratio .image .lists { grid-template-columns: repeat(2, max-content); justify-content: center; gap: 12px; position: static; margin-bottom: 30px; max-width: none; }
    .yebisu-main .section-ratio .image .lists img { width: 80px; }
    .yebisu-main .section-store { padding: 120px 0 80px; }
    .yebisu-main .section-store .text-top { margin: 24px 0 42px; }
    .yebisu-main .section-store .text-top .heading { margin-bottom: 12px; font-size: 2.4rem; }
    .yebisu-main .section-store .text-top .text { font-size: 1.8rem; }

    .yebisu-premium .section-introduce { padding: 80px 0; }
    .yebisu-premium .section-introduce .text-top .text { font-size: 1.8rem; }
    .yebisu-premium .section-introduce .text-top .heading { margin: 36px 0 48px; font-size: 2.4rem; }
}


/* Campaign */
.campaign-main { padding-bottom: var(--section-bottom); }
.campaign-lists { margin-top: 100px; }
.campaign-lists__item { margin-top: 20px; }
.campaign-lists__item:first-child { margin-top: 0; }
.campaign-card { overflow: hidden; }
.campaign-card__link { display: block; position: relative; }
.campaign-card__contents { z-index: 2; position: relative; display: flex; flex-direction: column; padding: 80px; min-height: 390px; color: #fff; }
.campaign-card__heading { font-size: 3.6rem; font-weight: 500; }
.campaign-card__text { margin: 20px 0; font-size: 2.2rem; will-change: transform; }
.campaign-card__date { margin-top: auto; font-size: 2.2rem; }
.campaign-card__background { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; }
.campaign-card__background-item { display: block; width: 100%; height: 100%; object-fit: cover; transition-property: transform, opacity; transition-duration: 1s, 0.65s; transition-timing-function: ease; }
@media (hover: hover) and (pointer: fine) {
    .campaign-card__link:hover .campaign-card__background-item { transform: scale(1.1); opacity: 0.65; }
}
@media screen and (max-width: 1024px) {
    .campaign-lists { margin-top: 60px; }
    .campaign-lists__item { margin-top: 16px; }
    .campaign-card { border-radius: 8px; }
    .campaign-card__contents { padding: 42px; min-height: 260px; }
    .campaign-card__heading { font-size: 2.4rem; }
    .campaign-card__text { margin: 10px 0; font-size: 1.8rem; }
    .campaign-card__date { font-size: 1.8rem; }
}
@media screen and (max-width: 768px) {
    .campaign-lists { margin-top: 40px; }
    .campaign-card__contents { padding: 32px; min-height: 200px; }
    .campaign-card__heading { font-size: 1.8rem; }
    .campaign-card__text { font-size: 1.5rem; }
    .campaign-card__date { font-size: 1.4rem; }
}
@media screen and (max-width: 480px) {
    .campaign-card__contents { padding: 24px; }
}


/* Terms */
.terms { padding-bottom: var(--section-bottom); }
.terms .inner { max-width: 1200px; }
@media screen and (min-width: 1025px) {
	.terms .page-lead { padding: 200px 0 80px; }
}
@media screen and (max-width: 1024px) {
    .terms .page-lead { padding-bottom: 60px; }
}
@media screen and (max-width: 768px) {
    .terms .page-lead { padding-bottom: 40px; }

}


/* Finder */
.find-main { padding-bottom: var(--section-bottom); }
.find-main__body { padding-top: 80px; }
.find-main__foot { display: flex; align-items: center; justify-content: center; margin-top: 64px; }

.finder-map { position: relative; width: 100%; height: 100%; }
.finder-map__item { display: block; width: 100%; height: 100%; }

.finter-lists__badge { display: inline-flex; align-items: center; justify-content: center; padding: 0; min-width: 96px; height: 40px; text-align: center; font-size: 1.6rem; font-weight: 500; color: #fff; background: #340008; border-radius: 40px; }
.finter-lists__title { line-height: 1.4; font-size: 2.4rem; font-weight: 600; }
.finter-lists__text { margin-top: 10px; }
.finter-lists__body { padding: 20px 40px; border-top: 1px solid var(--border); }
.finter-lists__ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.finder { overflow: hidden; position: relative; height: 725px; background: #f5f5f5; }

.finder-popup { display: none; position: relative; padding: 16px 20px; width: 295px; height: 140px; background: #fff; border: 1px solid #ddd; border-radius: 8px; box-sizing: border-box; }
.finder-popup__title { display: block; margin-bottom: 14px; padding-bottom: 8px; font-size: 2rem; font-weight: 600; border-bottom: 1px solid #ddd; }
.finder-popup__data { line-height: 1.4; font-size: 1.6rem; color: #666; }
.finder-popup__row { display: flex; }
.finder-popup__row:first-child { margin-top: 0; }
.finder-popup__dt .icon { margin-top: 1px; width: 18px; height: 18px; margin-right: 8px; color: #aaa; }
.finder-popup::after { content: ''; position: absolute; top: calc(100% + 1px); left: 50%; transform: translateX(-50%); width: 20px;  height: 15px; margin-top: -1px; background-repeat: no-repeat; background-size: 100% 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 15'%3E%3Cpath d='M0 0 L10 15 L20 0' stroke='%23ddd' stroke-width='1.2' fill='white'/%3E%3C/svg%3E"); }
@media screen and (min-width: 1025px) {
    .finter-lists__col:nth-child(2) { padding: 0 60px; width: 53.34%; }
    .finter-lists__col:nth-child(3) { flex: 1 1; }
}
@media screen and (max-width: 1024px) {
    .finder { height: 560px; }
    .finter-lists__badge { margin-bottom: 16px; width: auto; min-width: 84px; height: 36px; font-size: 1.4rem; }
    .finter-lists__title { font-size: 1.8rem; }
    .finter-lists__text { font-size: 1.6rem; margin-top: 4px; }
    .finter-lists__address { font-size: 1.6rem; margin-top: 14px; }
    .finter-lists__body { padding: 0 0 36px; }
    .finter-lists__ul { gap: 10px; }

    .finder-popup { padding: 14px 16px; width: 240px; height: auto; min-height: 124px; }
    .finder-popup__title { font-size: 1.6rem; }
    .finder-popup__data { font-size: 1.3rem; }
    .finder-popup__dt .icon { width: 16px; height: 16px; }
}
@media screen and (max-width: 768px) {
    .finter-lists__badge { margin-bottom: 10px; min-width: 80px; height: 30px; font-size: 1.3rem; }
    .finter-lists__body { padding: 0 0 16px; }
    .finter-lists__title { font-size: 1.6rem; }
    .finter-lists__text { font-size: 1.4rem; }
    .finter-lists__address { margin-top: 10px; font-size: 1.4rem; }
    .finter-lists__ul { gap: 8px; }
}


/* Omnibox */
.omnibox-container { z-index: 100; position: absolute; top: 1px; left: 0; margin: 80px 40px 0; width: 570px; height: calc(100% - 80px); transition: transform cubic-bezier(0.22, 0.61, 0.36, 1) .55s; }
.omnibox { display: flex; flex-direction: column; position: relative; padding: 24px 20px; height: 100%; background: #fff; border: 1px solid var(--border); }
.omnibox .mobile-toggle {
    position: absolute; top: -30px; left: 50%; width: 80px; height: 30px; background: #fff;
    border-top: 1px solid var(--border); border-right: 1px solid var(--border); border-left: 1px solid var(--border);
    transform: translateX(-50%);
}
.omnibox-container[data-omnibox-expanded="true"] { transform: translateY(100%); }
.omnibox .mobile-toggle::before { content: ''; display: block; width: 100%; height: 100%; background: url('/images/chevron-down.svg') no-repeat center / auto 100%; transition: transform ease .15s; }
.omnibox .mobile-toggle[aria-pressed="true"]::before { transform: scaleY(-1); }
.omnibox-head { display: flex; align-items: center; padding-bottom: 24px; }
.omnibox-head .search { flex: 1 1; overflow: hidden; display: flex; align-items: center; position: relative; background: #F5F5F5; border-radius: 8px; }
.omnibox-head .search .input { flex: 1 1; padding: 0 24px; font-size: 1.6rem; background: transparent; border: none; border-radius: 0; outline: none; }
.omnibox-head .search .button { display: flex; align-items: center; justify-content: center; padding: 0; width: 64px; }
.omnibox-head .search .button .icon { margin-left: 0; }
.omnibox-head .button-reset { margin: 0 -10px 0 12px; padding: 0 10px; height: 65px; font-size: 1.6rem; font-weight: 400; color: #777777; border-radius: 8px; }
.omnibox-head .button-reset .icon { margin: 0 6px 0 0; }
.omnibox-body { flex: 1 1; overflow-x: hidden; overflow-y: auto; margin-right: -18px; padding-right: 18px; }
.omnibox-body .item { overflow: hidden; margin-bottom: 16px; }
.omnibox-body .item:last-child { margin-bottom: 0; }
.omnibox-body .item-empty { padding: 1em 0; text-align: center; color: #333; }
.omnibox-body .block { padding: 24px; width: 100%; text-align: left; font-size: 1.6rem; font-weight: 400; color: #666666; border: 1px solid var(--border); border-radius: 8px; transition: all ease .15s; outline: none; }
.omnibox-body .block[aria-selected="true"] { border-color: var(--clr-dark); }
.omnibox-body .title { margin-bottom: 10px; line-height: 1.4; font-size: 2.4rem; font-weight: 600; color: var(--clr-dark); }
.omnibox-body .data { display: flex; flex-wrap: wrap; justify-content: space-between; }
.omnibox-body .data .dt { display: flex; align-items: center; color: #aaaaaa; }
.omnibox-body .data .col { display: flex; align-items: center; }
.omnibox-body .data .col:first-child { margin-bottom: 6px; width: 100%; }
.omnibox-body .data .icon { margin-right: 8px; width: 18px; height: 18px; }
.omnibox-body .external { display: inline-flex; align-items: center; justify-content: center; }
.omnibox-body .external .icon { margin-left: 3px; }

.map-scroll-guide {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    padding: 12px 20px;
    border-radius: 6px;
    font-size: 14px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s;
    z-index: 100;
}

.map-scroll-guide.is-visible {
    opacity: 1;
}

/* .omnibox-head { display: none; }
.omnibox-container {
    margin: 180px 40px 0;
    height: calc(100% - 180px);
} */
@media (hover: hover) and (pointer: fine) {
    .omnibox-head .button-reset:hover { background: rgb(100 100 100 / 3%); }
}
@media screen and (max-width: 1024px) {
    .omnibox-container { margin: 200px 16px 0; width: 480px; height: calc(100% - 200px); }
    .omnibox { padding: 16px; }
    .omnibox .mobile-toggle { top: -26px; width: 64px; height: 26px; }
    .omnibox-head { padding-bottom: 16px; }
    .omnibox-head .search .input { font-size: 1.5rem; padding: 0 0 0 16px; }
    .omnibox-head .search .button { padding: 20px 16px 16px; width: 50px; }
    .omnibox-head .search .button .icon { display: flex; }
    .omnibox-head .button-reset { font-size: 1.4rem; }
    .omnibox-head .button-reset .icon { width: 20px; height: 20px; }
    .omnibox-body .block { padding: 16px; }
    .omnibox-body .title { font-size: 1.6rem; }
    .omnibox-body .data { font-size: 1.3rem; }
    .omnibox-body .data .icon { margin-right: 4px; width: 16px; height: 16px; }
    .omnibox-body .data .col:first-child { margin-bottom: 2px; }
}
@media screen and (max-width: 768px) {
    .omnibox-container { width: calc(100% - 32px); }
    .omnibox-head .search .input { font-size: 1.3rem; }
    .omnibox-head .button-reset { font-size: 1.3rem; margin-left: 0; padding: 0 16px; }
    .omnibox-body .title { font-size: 1.5rem; }
    .omnibox-body .data { font-size: 1.2rem; }
    .omnibox-body .data .icon { margin-right: 2px; width: 14px; height: 14px; }
    .omnibox-body .data .col:first-child { margin-bottom: 0; }
}
