﻿@layer base, component, layout, project, utility;
@layer base {
	html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, address, em, img, strong, sub, sup, b, i, dl, dt, dd, ol, ul, li, form, label, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, figcaption, figure, footer, header, hgroup, menu, nav, section, time, audio, video, fieldset {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-size: 100%;
		font-style: normal;
		vertical-align: baseline;
		background: rgba(0, 0, 0, 0)
	}
	html {
		-webkit-text-size-adjust: 100%
	}
	.l-root-container img, .l-root-container svg {
		line-height: 0;
		vertical-align: top
	}
	.l-root-container main, .l-root-container article, .l-root-container aside, .l-root-container details, .l-root-container figcaption, .l-root-container figure, .l-root-container footer, .l-root-container header, .l-root-container hgroup, .l-root-container menu, .l-root-container nav, .l-root-container section, .l-root-container time, .l-root-container picture, .l-root-container summary {
		display: block
	}
	.l-root-container blockquote, .l-root-container q {
		quotes: none
	}
	.l-root-container blockquote:before, .l-root-container blockquote:after, .l-root-container q:before, .l-root-container q:after {
		content: none
	}
	.l-root-container a {
		color: inherit;
		margin: 0;
		padding: 0;
		font-size: 100%;
		vertical-align: baseline;
		background: rgba(0, 0, 0, 0)
	}
	.l-root-container table {
		border-collapse: collapse;
		border-spacing: 0
	}
	.l-root-container hr {
		display: block;
		height: 1px;
		border: 0;
		border-top: 1px solid #ccc;
		margin: 1em 0;
		padding: 0
	}
	.l-root-container input, .l-root-container select, .l-root-container textarea, .l-root-container label {
		vertical-align: top
	}
	.l-root-container input, .l-root-container textarea, .l-root-container button, .l-root-container select {
		color: inherit;
		font-family: inherit;
		font-size: inherit;
		outline: none;
		resize: none
	}
	.l-root-container button {
		cursor: pointer;
		padding: 0;
		border: 0;
		background: rgba(0, 0, 0, 0)
	}
	.l-root-container button[disabled] {
		cursor: default
	}
	.l-root-container *, .l-root-container ::before, .l-root-container ::after {
		box-sizing: border-box;
		overflow-wrap: break-word
	}
	.l-root-container select::-ms-expand {
		display: none
	}
	.l-root-container summary::-webkit-details-marker {
		display: none
	}
	.l-root-container input[type=number] {
		-moz-appearance: textfield
	}
	.l-root-container input[type=number]::-webkit-outer-spin-button, .l-root-container input[type=number]::-webkit-inner-spin-button {
		-webkit-appearance: none
	}
	:root {
		--vw: 1vw;
		--color-background-gray: #fffaed;
		--color-black: #232323;
		--color-border: #d3d3d3;
		--color-primary: #1a3b90;
		--color-yellow: #d5b746;
		--color-yellow-deep: #b09738;
		--color-green: #54a288;
		--color-green-deep: #468a74;
		--color-blue: #6488ae;
		--color-blue-deep: #4e6c8b;
		--color-light-blue: #009fd4;
		--color-orange: #d17b3a;
		--color-orange-deep: #ba6d32;
		--color-pink: #eb6d65;
		--color-pink-deep: #bf5751;
		--color-purple: #a699ae;
		--color-purple-deep: #8c8194;
		--basic-pc-size: 1760;
		--basic-sp-size: 390;
		--basic-contents-width: 1520;
		--basic-contents-width-slim: 960;
		--contents-width: min(100% - 3.75rem, 24.375rem);
		--contents-width-slim: min(100% - 3.75rem, 24.375rem);
		--contents-margin: max(1.875rem, 50% - 12.1875rem);
		--contents-margin-slim: max(1.875rem, 50% - 12.1875rem);
		--font-english: 'Bungee', 'M PLUS Rounded 1c', sans-serif;
		--header-height: 3.75rem;
		--leading-trim: calc((1em - 1lh) / 2);
		--section-padding-block: 5rem
	}
	@media(min-width: 768px) {
		:root {
			--contents-width: calc(var(--basic-contents-width) / 16 * 1rem);
			--contents-width-slim: calc(var(--basic-contents-width-slim) / 16 * 1rem);
			--contents-margin: calc(50% - (var(--basic-contents-width) / 2 / 16 * 1rem));
			--contents-margin-slim: calc(50% - (var(--basic-contents-width-slim) / 2 / 16 * 1rem));
			--header-height: 5rem;
			--section-padding-block: 7.5rem
		}
	}
	@supports not (height: 1lh) {
		:root {
			--leading-trim: calc((1em - 1.75em) / 2)
		}
	}
	html {
		color: var(--color-primary)
	}
	@media(min-width: 390px) {
		html {
			font-size: clamp(16px, var(--vw)*16/var(--basic-sp-size)*100, 18px)
		}
	}
	@media(min-width: 768px) {
		html {
			font-size: calc(var(--vw)*16/var(--basic-pc-size)*100)
		}
	}
	@media(min-width: 1760px) {
		html {
			font-size: 16px
		}
	}
	@media(min-width: 1920px) {
		html {
			font-size: calc(var(--vw)*16/1920*100)
		}
	}
	body .l-root-container {
		font-size: .875rem;
		font-family: "M PLUS Rounded 1c", sans-serif;
		font-weight: bold;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		line-height: 1.5;
		transition: opacity .3s ease
	}
	@media(min-width: 768px) {
		body .l-root-container {
			font-size: 1rem
		}
	}
	body.is-locked {
		overflow: hidden
	}
	body.is-hidden {
		opacity: 0;
		pointer-events: none
	}
	body a:where(:not(.c-text-link)) {
		text-decoration: none
	}
	body ul:where(:not(.c-basic-list)) {
		list-style: none
	}
	body img {
		display: block;
		height: auto
	}
	body img:where(:not([width])) {
		width: 100%
	}
}
@layer component {
	.c-layout-row {
		display: flex;
		flex-wrap: wrap
	}
	@media(min-width: 768px) {
		.c-layout-row.md\:is-unwrapped {
			flex-wrap: nowrap
		}
	}
	.c-layout-stack {
		display: grid;
		grid-template-columns: minmax(0, 1fr)
	}
	.c-layout-stack[data-justify=center] {
		justify-items: center
	}
	.c-container {
		padding-inline: var(--contents-margin)
	}
	.c-container--slim {
		padding-inline: var(--contents-margin-slim)
	}
	.c-inner {
		margin-inline: auto;
		width: var(--contents-width)
	}
	.c-inner--slim {
		margin-inline: auto;
		width: var(--contents-width-slim)
	}
	.c-layout-2columns {
		--_gap: 2.5rem;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: var(--_gap)
	}
	@media(min-width: 768px) {
		.c-layout-2columns {
			--_gap: 5rem;
			grid-template-columns: repeat(2, minmax(0, 1fr))
		}
	}
	.c-layout-3columns {
		--_gap: 1.875rem;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: var(--_gap)
	}
	@media(min-width: 768px) {
		.c-layout-3columns {
			--_gap: 2.5rem;
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr))
		}
	}
}
@layer component {
	.c-button--primary {
		--_h: 3.5rem;
		--_w: 17.5rem;
		line-height: 1.5;
		display: grid;
		place-items: center;
		width: fit-content;
		min-width: var(--_w);
		min-height: var(--_h);
		border-radius: var(--_h)
	}
	@media(min-width: 768px) {
		.c-button--primary {
			--_h: 4rem;
			--_w: 20rem
		}
	}
}
@layer component {
	.c-item {
		border: .125rem solid #fff;
		border-radius: .3125rem;
		width: fit-content;
		color: #fff;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		padding: .5rem .625rem
	}
	@media(min-width: 768px) {
		.c-item {
			border-width: .25rem;
			border-radius: .625rem;
			padding: 1rem 1.25rem .75rem
		}
	}
	.c-price {
		border-top: 2px dashed #fff;
		font-family: var(--font-english);
		font-weight: normal;
		line-height: 1cap;
		text-align: right;
		margin-block-start: .5rem;
		padding-block-start: .5rem
	}
	@media(min-width: 768px) {
		.c-price {
			margin-block-start: .625rem;
			padding-block-start: .75rem
		}
	}
}
@layer component {
	.c-heading1 {
		--_stroke-color: var(--color-primary);
		font-family: var(--font-english);
		color: #fff;
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		font-weight: normal;
		letter-spacing: 0;
		font-size: 2rem
	}
	@media(min-width: 768px) {
		.c-heading1 {
			font-size: 4.5rem
		}
	}
	.c-heading1 span {
		position: relative;
		z-index: 1;
		line-height: 1cap
	}
	.c-heading1 span::before {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-text-stroke: .4063rem var(--_stroke-color);
		content: attr(data-text);
		z-index: -1
	}
	@media(min-width: 768px) {
		.c-heading1 span::before {
			-webkit-text-stroke: .875rem var(--_stroke-color)
		}
	}
	.c-heading1 i {
		line-height: 1cap
	}
	.c-heading1 small {
		position: relative;
		z-index: 1;
		font-size: .8438em;
		line-height: 1cap
	}
	@media(min-width: 768px) {
		.c-heading1 small {
			font-size: .8333em
		}
	}
	.c-heading1 small::before {
		position: absolute;
		top: 0;
		left: 0;
		-webkit-text-stroke: .4063rem var(--_stroke-color);
		content: attr(data-text);
		z-index: -1
	}
	@media(min-width: 768px) {
		.c-heading1 small::before {
			-webkit-text-stroke: .875rem var(--_stroke-color)
		}
	}
	.c-text:where(:first-child) {
		margin-block-start: var(--leading-trim)
	}
	.c-text:where(:last-child) {
		margin-block-end: var(--leading-trim)
	}
	.c-text-link {
		text-decoration: underline
	}
	@media(hover: hover), (-ms-high-contrast: none) {
		.c-text-link:hover {
			text-decoration: none
		}
	}
}
@layer layout {
	.l-header {
		--_logo-width: 7.5rem;
		--_pi: 1.25rem
	}
	@media(min-width: 768px) {
		.l-header {
			--_logo-width: 10.875rem;
			--_pi: var(--contents-margin)
		}
	}
	.l-header {
		display: flex;
		justify-content: space-between;
		padding-left: var(--_pi);
		height: var(--header-height)
	}
	@media(min-width: 768px) {
		.l-header {
			padding-inline: var(--_pi)
		}
	}
	.l-header__logo {
		width: var(--_logo-width)
	}
	.l-header-navigation {
		--_gap: 1.25rem;
		--_fz: 1rem
	}
	@media(min-width: 768px) {
		.l-header-navigation {
			--_gap: 1.5rem;
			--_fz: 1rem
		}
	}
	@media not all and (min-width: 768px) {
		.l-header-navigation {
			position: fixed;
			inset: 0;
			overflow: auto
		}
	}
	.l-header-navigation__list {
		display: flex;
		gap: var(--_gap)
	}
	@media not all and (min-width: 768px) {
		.l-header-navigation__list {
			flex-direction: column
		}
	}
	.l-header-navigation__item {
		font-size: var(--_fz)
	}
	.l-header__toggle {
		height: 100%;
		width: var(--header-height);
		background: linear-gradient(currentColor 0 0) no-repeat center/1.75rem 2px;
		position: relative;
		z-index: 1
	}
	@media(min-width: 768px) {
		.l-header__toggle {
			display: none
		}
	}
	.l-header__toggle::before, .l-header__toggle::after {
		position: absolute;
		left: 0;
		right: 0;
		top: calc(50% - 1px - 0.5rem);
		content: "";
		height: 2px;
		width: 1.75rem;
		background-color: currentColor;
		margin-inline: auto;
		transition: rotate .4s ease, op .4s ease
	}
	.l-header__toggle::after {
		top: calc(50% - 1px + 0.5rem)
	}
	.l-header__toggle.is-active {
		background: none
	}
	.l-header__toggle.is-active::before, .l-header__toggle.is-active::after {
		background-color: #fff;
		top: calc(50% - 1px)
	}
	.l-header__toggle.is-active::before {
		rotate: 135deg
	}
	.l-header__toggle.is-active::after {
		rotate: -135deg
	}
}
@layer layout {
	.l-main {
		overflow: hidden
	}
}
@layer layout {
	.l-footer {
		background-color: var(--color-primary);
		color: #fff;
		padding-block: 1.25rem .9375rem;
		gap: 1.5625rem
	}
	@media(min-width: 768px) {
		.l-footer {
			padding-block: 2.75rem 2.125rem;
			gap: 4rem
		}
	}
	.l-footer__logo {
		width: 9.75rem
	}
	@media(min-width: 768px) {
		.l-footer__logo {
			width: 17.5rem
		}
	}
	.l-footer__copyright {
		line-height: 1
	}
	@media(min-width: 768px) {
		.l-footer__copyright {
			font-size: 1rem
		}
	}
}
@layer project {
	.p-about {
		background-color: var(--color-background-gray);
		border-top: .9375rem solid var(--color-primary);
		padding-block: 4.375rem 5.9375rem;
		gap: 2.3438rem
	}
	@media not all and (min-width: 768px) {
		.p-about {
			padding-inline: .9375rem
		}
	}
	@media(min-width: 768px) {
		.p-about {
			border-width: 1.875rem;
			padding-block: 6.5rem;
			gap: 5.5rem
		}
	}
	.p-about__information {
		font-family: var(--font-english);
		display: flex;
		flex-wrap: wrap;
		align-items: baseline;
		justify-content: center;
		width: 16.1875rem;
		gap: .8125rem 0
	}
	@media(min-width: 768px) {
		.p-about__information {
			gap: 2rem 0;
			width: 50rem
		}
	}
	.p-about__information dt {
		line-height: 1cap;
		font-size: .9375rem
	}
	@media(min-width: 768px) {
		.p-about__information dt {
			font-size: 2.875rem
		}
	}
	.p-about__information dt[data-type=open] {
		width: 100%;
		text-align: center;
		color: var(--color-yellow);
		font-size: 1.5rem
	}
	@media(min-width: 768px) {
		.p-about__information dt[data-type=open] {
			font-size: 2.625rem
		}
	}
	.p-about__information dt[data-type=weekdays], .p-about__information dt[data-type=weekends] {
		color: var(--color-green)
	}
	@media(min-width: 768px) {
		.p-about__information dt[data-type=weekdays], .p-about__information dt[data-type=weekends] {
			padding-inline-start: 1em
		}
	}
	.p-about__information dt[data-type=weekends] {
		color: var(--color-blue)
	}
	.p-about__information dt[data-type=lo] {
		color: var(--color-orange)
	}
	@media not all and (min-width: 768px) {
		.p-about__information dt[data-type=lo] {
			font-size: 1.125rem
		}
	}
	.p-about__information dd {
		line-height: 1cap;
		font-size: 1.125rem
	}
	@media(min-width: 768px) {
		.p-about__information dd {
			font-size: 3.375rem
		}
	}
	.p-about__information dd[data-type=open] {
		width: 100%;
		margin-block-end: .8125rem
	}
	@media(min-width: 768px) {
		.p-about__information dd[data-type=open] {
			margin-block-end: 2.5rem
		}
	}
	.p-about__information dd[data-type=open] img {
		margin-inline: auto
	}
	.p-about__information dd[data-type=weekdays], .p-about__information dd[data-type=weekends] {
		color: var(--color-green)
	}
	@media(min-width: 768px) {
		.p-about__information dd[data-type=weekdays], .p-about__information dd[data-type=weekends] {
			padding-inline-end: 1em
		}
	}
	.p-about__information dd[data-type=weekdays]::before, .p-about__information dd[data-type=weekends]::before {
		font-family: "Potta One", sans-serif;
		content: "/";
		margin-inline: .2em
	}
	.p-about__information dd[data-type=weekends] {
		color: var(--color-blue)
	}
	.p-about__information dd[data-type=lo] {
		color: var(--color-orange)
	}
	@media(min-width: 768px) {
		.p-about__information dd[data-type=lo] {
			font-size: 2.875rem
		}
	}
	.p-about__body {
		gap: 3.125rem
	}
	@media(min-width: 768px) {
		.p-about__body {
			gap: 5.5rem
		}
	}
	.p-about__location, .p-access__location {
		font-weight: 800;
		font-feature-settings: "palt";
		font-family: "Noto Sans JP", sans-serif;
		text-align: center;
		font-size: .875rem;
		line-height: 1.625rem
	}
	@media(min-width: 768px) {
		.p-about__location, .p-access__location {
			font-size: 2.375rem;
			line-height: 3.5rem
		}
	}
	.p-about__location b, .p-access__location b {
		font-weight: 800;
		font-size: 1.25rem
	}
	@media(min-width: 768px) {
		.p-about__location b, .p-access__location b {
			font-size: 3.125rem
		}
	}
	@media(min-width: 768px) {
		.p-about__location span, .p-access__location span {
			font-size: 2.25rem
		}
	}
	.p-about__text {
		font-size: .75rem;
		font-weight: 500;
		font-feature-settings: "palt";
		font-family: "Noto Sans JP", sans-serif;
		letter-spacing: .05em;
		line-height: 2;
		text-align: center
	}
	@media(min-width: 768px) {
		.p-about__text {
			font-size: 1.125rem;
			line-height: 2.6667
		}
	}
	.p-about__text--address {
		font-size: .8125rem;
		line-height: 1.6154
	}
	@media not all and (min-width: 768px) {
		.p-about__text--address {
			margin-block: -1.25rem
		}
	}
	@media(min-width: 768px) {
		.p-about__text--address {
			margin-block: -2rem -1.5rem;
			font-size: 1.625rem
		}
	}
	.p-about__button {
		background-color: var(--color-primary);
		color: #fff;
		width: 15.3846em;
		height: 3.0769em;
		border-radius: 1.5385em;
		font-family: "Noto Sans JP", sans-serif;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0 .5em;
		font-size: .8125rem;
		transition: background-color .3s ease
	}
	@media(min-width: 768px) {
		.p-about__button {
			font-size: 1.625rem
		}
	}
	.p-about__button::after {
		content: "";
		aspect-ratio: 18/10;
		background-color: currentColor;
		width: .6923em;
		clip-path: polygon(0 0, 100% 0, 50% 100%)
	}
	@media(hover: hover), (-ms-high-contrast: none) {
		.p-about__button:hover {
			background-color: var(--color-orange)
		}
	}
}
@layer project {
	.p-access {
		padding-block: 3.125rem
	}
	@media(min-width: 768px) {
		.p-access {
			padding-block: 10rem 11.5rem
		}
	}
	.p-access__heading {
		margin-block-end: 2.1875rem
	}
	@media(min-width: 768px) {
		.p-access__heading {
			margin-block-end: 5rem
		}
	}
	@media(min-width: 768px) {
		.p-access__location {
			font-size: 2.4375rem
		}
	}
	@media(min-width: 768px) {
		.p-access__location b {
			font-size: 3.25rem
		}
	}
	@media(min-width: 768px) {
		.p-access__location span {
			font-size: 2.3125rem
		}
	}
	.p-access__text {
		font-family: "Noto Snas JP", sans-serif;
		font-size: .75rem;
		text-align: center;
		line-height: 1.5;
		margin-block: 1.875rem
	}
	@media(min-width: 768px) {
		.p-access__text {
			font-size: 1.25rem;
			margin-block: 2.5rem 3.5rem
		}
	}
	.p-access__map {
		position: relative;
		width: 100%;
		height: 17.4375rem
	}
	@media(min-width: 768px) {
		.p-access__map {
			height: 28.125rem
		}
	}
	.p-access__map iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%
	}
	.p-access__banner {
		display: block;
		position: relative;
		background-color: var(--color-yellow);
		border-radius: .625rem;
		color: #fff;
		margin-block-start: 3.125rem;
		width: 100%;
		height: 6.25rem
	}
	@media(min-width: 768px) {
		.p-access__banner {
			border-radius: 1.5rem;
			width: 62.5rem;
			height: 12.5rem;
			margin-block-start: 10rem
		}
	}
	.p-access__banner::before, .p-access__banner::after {
		position: absolute;
		bottom: 0;
		content: ""
	}
	.p-access__banner::before {
		aspect-ratio: 430/338;
		background: url("../img/bnr_decoration_l.webp") no-repeat center/contain;
		width: 5.1875rem;
		left: -0.9375rem
	}
	@media(min-width: 768px) {
		.p-access__banner::before {
			width: 13.4375rem;
			left: -2.5rem
		}
	}
	.p-access__banner::after {
		aspect-ratio: 386/350;
		background: url("../img/bnr_decoration_r.webp") no-repeat center/contain;
		width: 4.375rem;
		right: -0.4375rem
	}
	@media(min-width: 768px) {
		.p-access__banner::after {
			width: 12.0625rem;
			right: -0.875rem
		}
	}
	@media(hover: hover), (-ms-high-contrast: none) {
		.p-access__banner {
			transition: background-color .4s ease
		}
		.p-access__banner:hover {
			background-color: var(--color-primary)
		}
	}
	.p-access__banner__inner {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		align-content: center;
		line-height: 1;
		text-align: center;
		height: 100%;
		gap: .25rem;
		font-size: 1.0625rem
	}
	@media(min-width: 768px) {
		.p-access__banner__inner {
			font-size: 2.25rem;
			gap: 1rem
		}
	}
	.p-access__banner__inner::before {
		aspect-ratio: 1;
		content: "";
		background-color: currentColor;
		-webkit-mask: url("../img/logo_instagram.webp") no-repeat center/contain;
		mask: url("../img/logo_instagram.webp") no-repeat center/contain;
		width: 1.75rem
	}
	@media(min-width: 768px) {
		.p-access__banner__inner::before {
			width: 3.375rem
		}
	}
}
@layer project {
	.p-cocktail {
		position: relative;
		z-index: 1;
		overflow: hidden;
		--_mbs: 5.625rem;
		margin-block-start: calc(var(--_mbs)*-1);
		padding-block: 6.125rem 2.0625rem
	}
	@media(min-width: 768px) {
		.p-cocktail {
			--_mbs: 13.25rem;
			--_left-column-width: 34.6875rem;
			padding-block: 9.375rem 2.375rem
		}
	}
	.p-cocktail::before {
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		content: "";
		background: url("../img/cocktail_bg_vertical.webp") no-repeat center bottom/cover;
		width: 48rem;
		left: calc(50% - 24rem);
		clip-path: polygon(0 var(--_mbs), 100% 0, 100% 100%, 0 100%);
		z-index: -1
	}
	@media(min-width: 768px) {
		.p-cocktail::before {
			background-image: url("../img/cocktail_bg.webp");
			width: 120rem;
			left: calc(50% - 60rem)
		}
	}
	.p-cocktail__header {
		position: relative;
		display: flex;
		flex-wrap: wrap;
		gap: 1.5625rem 0
	}
	@media not all and (min-width: 768px) {
		.p-cocktail__header {
			margin-block-end: 1.875rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail__header {
			display: grid;
			grid-template-columns: minmax(0, 1fr) auto;
			grid-template-rows: auto 1fr;
			align-items: start;
			width: calc(100% - var(--_left-column-width));
			margin-inline-start: auto;
			gap: 3.3125rem 0
		}
	}
	.p-cocktail__header::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-cocktail__header::before {
			--_ratio: 80/55;
			--_w: 5rem;
			--_img: url('../img/cocktail_decoration1.webp');
			top: -4.125rem;
			left: calc(100% + 3rem)
		}
	}
	.p-cocktail__header::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-cocktail__header::after {
			--_ratio: 59/59;
			--_w: 3.6875rem;
			--_img: url('../img/cocktail_decoration3.webp');
			top: calc(100% + 2.625rem);
			left: calc(100% + 4.625rem)
		}
	}
	.p-cocktail__heading {
		--_stroke-color: var(--color-light-blue);
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		font-size: 2.5rem;
		gap: .6875rem
	}
	@media(min-width: 768px) {
		.p-cocktail__heading {
			font-size: 6.25rem;
			grid-column: 2;
			grid-row: 1;
			justify-items: end;
			gap: 1.75rem
		}
	}
	.p-cocktail__logo {
		width: 6.25rem
	}
	@media not all and (min-width: 768px) {
		.p-cocktail__logo {
			translate: .5rem 0
		}
	}
	@media(min-width: 768px) {
		.p-cocktail__logo {
			grid-column: 1;
			grid-row: 1/span 2;
			margin-inline-start: 4rem;
			margin-block-start: 3.375rem;
			width: 19.375rem
		}
	}
	.p-cocktail-price {
		display: flex;
		align-items: center;
		gap: .9375rem
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-price {
			justify-content: center;
			margin-inline: auto
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-price {
			grid-column: 2;
			grid-row: 2;
			justify-self: end;
			margin-inline-end: 1.375rem;
			gap: 2rem
		}
	}
	.p-cocktail-price__text {
		color: var(--color-light-blue);
		font-size: 2.8125rem;
		font-family: var(--font-english);
		font-weight: normal;
		line-height: 1cap
	}
	@media(min-width: 768px) {
		.p-cocktail-price__text {
			font-size: 4.75rem
		}
	}
	.p-cocktail-price__sub {
		order: -1;
		color: var(--color-light-blue);
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		align-content: center;
		justify-items: center;
		background-color: #fff;
		border-radius: .3125rem;
		width: 7.6875rem;
		height: 2.625rem
	}
	@media(min-width: 768px) {
		.p-cocktail-price__sub {
			border-radius: .625rem;
			width: 13.5rem;
			height: 4.625rem;
			gap: .375rem
		}
	}
	.p-cocktail-price__sub dt {
		line-height: 1;
		font-size: .875rem
	}
	@media(min-width: 768px) {
		.p-cocktail-price__sub dt {
			font-size: 1.5525rem
		}
	}
	.p-cocktail-price__sub dd {
		font-family: var(--font-english);
		font-weight: normal;
		line-height: 1cap;
		font-size: 1.3125rem
	}
	@media(min-width: 768px) {
		.p-cocktail-price__sub dd {
			font-size: 2.3294rem
		}
	}
	.p-cocktail__contents {
		display: grid;
		grid-template-columns: minmax(0, 1fr)
	}
	@media not all and (min-width: 768px) {
		.p-cocktail__contents {
			gap: 3.125rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail__contents {
			--_pbe: 1.5rem;
			align-items: start;
			grid-template-columns: var(--_left-column-width) minmax(0, 1fr)
		}
	}
	.p-cocktail-ff {
		position: relative
	}
	@media(min-width: 768px) {
		.p-cocktail-ff {
			margin-block-start: -15.75rem;
			padding-block: 2.8125rem var(--_pbe)
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-ff::after {
			position: absolute;
			content: "";
			top: 0;
			bottom: 0;
			left: 100%;
			width: .1875rem;
			border-radius: .1875rem;
			background-color: #fff
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-ff__heading {
			padding-block-start: .625rem
		}
	}
	.p-cocktail__title {
		font-size: 2.5rem;
		font-family: var(--font-english);
		font-weight: normal;
		color: var(--color-light-blue);
		mix-blend-mode: multiply;
		line-height: 1cap
	}
	@media not all and (min-width: 768px) {
		.p-cocktail__title {
			width: fit-content;
			margin-inline: auto
		}
	}
	@media(min-width: 768px) {
		.p-cocktail__title {
			font-size: 4.25rem
		}
	}
	.p-cocktail-ff__list {
		position: relative;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		justify-items: center;
		gap: 1.25rem 0;
		margin-block-start: -0.5rem
	}
	@media(min-width: 768px) {
		.p-cocktail-ff__list {
			grid-template-columns: auto minmax(0, 1fr);
			width: fit-content;
			align-items: end;
			gap: .75rem 2.5rem;
			margin-block-start: -1.125rem
		}
	}
	.p-cocktail-ff__item {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-items: center
	}
	.p-cocktail-ff__item[data-id=ginger]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-cocktail-ff__item[data-id=ginger]::before {
			--_ratio: 69/69;
			--_w: 4.3125rem;
			--_img: url('../img/cocktail_decoration2.webp');
			top: 5.5rem;
			right: calc(100% + 5.625rem)
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-ff__item[data-id=pineapple] {
			translate: 0 3.125rem
		}
	}
	.p-cocktail-ff__item[data-id=pineapple]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-ff__item[data-id=pineapple]::before {
			--_ratio: 1;
			--_w: 1.875rem;
			--_img: url('../img/cocktail_decoration4.webp');
			top: -1.0625rem;
			left: calc(100% - 0.4375rem)
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-ff__item[data-id=passion-fruit] {
			margin-block-start: 4.375rem
		}
	}
	.p-cocktail-ff__item[data-id=passion-fruit]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-ff__item[data-id=passion-fruit]::before {
			--_ratio: 1;
			--_w: 2.1875rem;
			--_img: url('../img/cocktail_decoration2.webp');
			bottom: 0;
			right: calc(100% + 5.3125rem)
		}
	}
	.p-cocktail-ff__image {
		position: relative;
		margin-block-end: -0.5rem
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-ff__image {
			font-size: .5938rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-ff__image {
			margin-block-end: -1rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-ff__item[data-id=ginger] .p-cocktail-ff__image {
			translate: 10% 0
		}
	}
	.p-cocktail-sc__name, .p-cocktail-ff__name {
		border: .125rem solid #fff;
		border-radius: .3125rem;
		width: fit-content;
		color: #fff;
		line-height: 1;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		letter-spacing: -0.05em;
		font-size: 1.0625rem;
		padding: .4688rem .875rem;
		gap: .1875rem
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__name, .p-cocktail-ff__name {
			border-width: .1875rem;
			border-radius: .625rem;
			font-size: 1.6688rem;
			gap: .5rem;
			padding: 1rem 1.25rem
		}
	}
	.p-cocktail-sc__name::after, .p-cocktail-ff__name::after {
		content: attr(data-en);
		font-size: .875rem
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__name::after, .p-cocktail-ff__name::after {
			font-size: 1.25rem;
			line-height: 1;
			letter-spacing: 0
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-ff__item[data-id=passion-fruit] .p-cocktail-ff__name {
			margin-inline-start: -1.25rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc {
			padding-block: 4.375rem var(--_pbe);
			align-self: end
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__heading {
			text-align: center;
			line-height: 1
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__heading {
			padding-inline-start: 3.125rem;
			margin-block-end: .5rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__list {
			margin-block-start: -0.5rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__list {
			display: flex;
			align-items: flex-end;
			padding-inline-start: 2.625rem;
			gap: 0 1.1875rem
		}
	}
	.p-cocktail-sc__item {
		position: relative
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__item {
			width: fit-content
		}
	}
	.p-cocktail-sc__item[data-id=pina-colada]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__item[data-id=pina-colada]::before {
			--_ratio: 35/35;
			--_w: 2.1875rem;
			--_img: url('../img/cocktail_decoration4.webp');
			bottom: 8.25rem;
			left: -0.9375rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__item[data-id=brazilian-mojito] {
			margin-inline: auto -0.5625rem;
			margin-block-start: -8.125rem
		}
	}
	.p-cocktail-sc__item[data-id=brazilian-mojito]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__item[data-id=brazilian-mojito]::before {
			--_ratio: 33/33;
			--_w: 2.0625rem;
			--_img: url('../img/cocktail_decoration5.webp');
			bottom: 13.75rem;
			right: 3.125rem
		}
	}
	.p-cocktail-sc__item[data-id=tequila-mary]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__item[data-id=tequila-mary]::before {
			--_ratio: 33/33;
			--_w: 1.375rem;
			--_img: url('../img/cocktail_decoration5.webp');
			top: calc(100% + 2.5rem);
			right: 100%
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__item[data-id=paloma] {
			display: grid;
			grid-template-columns: minmax(0, 1fr);
			justify-items: center;
			margin-inline-start: auto;
			margin-block-start: -9.375rem
		}
	}
	.p-cocktail-sc__item[data-id=paloma]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none;
		--_ratio: 80/39;
		--_w: 3rem;
		--_img: url('../img/cocktail_decoration6.webp');
		bottom: 4.8125rem
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__item[data-id=paloma]::before {
			left: calc(100% - 1rem)
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__item[data-id=paloma]::before {
			--_w: 5rem;
			bottom: 8.125rem;
			right: -1.8125rem
		}
	}
	.p-cocktail-sc__image {
		position: relative;
		margin-block-end: -0.5rem
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__image {
			font-size: .5938rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__image {
			margin-block-end: -0.75rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__item[data-id=pina-colada] .p-cocktail-sc__image {
			margin-inline-start: -1rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__item[data-id=brazilian-mojito] .p-cocktail-sc__image {
			margin-inline: auto;
			width: fit-content
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__item[data-id=brazilian-mojito] .p-cocktail-sc__image {
			margin-inline-start: 1.75rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-cocktail-sc__item[data-id=tequila-mary] .p-cocktail-sc__image {
			width: fit-content;
			margin-inline-start: .3125rem;
			margin-block-start: -1.875rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__item[data-id=tequila-mary] .p-cocktail-sc__image {
			margin-inline-start: -3rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__item[data-id=paloma] .p-cocktail-sc__image {
			margin-inline-start: -6.75rem
		}
	}
	@media(min-width: 768px) {
		.p-cocktail-sc__name {
			padding: 1rem 1rem
		}
	}
}
@layer project {
	.p-drink-food {
		padding-block-start: 2.3125rem
	}
	@media(min-width: 768px) {
		.p-drink-food {
			padding-block-start: 8.5rem
		}
	}
	.p-drink-food__heading {
		width: fit-content;
		margin-inline: auto;
		margin-block-end: 2.1875rem
	}
	@media(min-width: 768px) {
		.p-drink-food__heading {
			margin-block-end: 7.5rem
		}
	}
	.p-drink-food__wrap {
		display: grid;
		grid-template-columns: minmax(0, 1fr)
	}
	@media not all and (min-width: 768px) {
		.p-drink-food__wrap {
			padding-inline: 0
		}
	}
	@media(min-width: 768px) {
		.p-drink-food__wrap {
			overflow: hidden;
			grid-template-columns: 61.25rem minmax(0, 1fr);
			background: linear-gradient(to right, var(--color-purple) 50.1%, var(--color-green) 50.1%)
		}
	}
}
@layer project {
	.p-hero {
		height: 31.25rem;
		align-content: center;
		overflow: hidden;
		position: relative;
		background: url("../img/hero_bg_vertical.webp") no-repeat center/23.4375rem auto
	}
	@media(min-width: 768px) {
		.p-hero {
			background-image: url("../img/hero_bg.webp");
			background-size: 120rem auto;
			height: clamp(45rem, 100vh, 67.5rem);
			height: clamp(45rem, 100svh, 67.5rem)
		}
	}
	.p-hero::before {
		position: absolute;
		bottom: 0;
		content: "";
		aspect-ratio: 928/644;
		background: url("../img/hero_decoration_l2.webp") no-repeat center bottom/contain;
		width: 9.7813rem;
		right: calc(50% + 2.9688rem)
	}
	@media(min-width: 768px) {
		.p-hero::before {
			aspect-ratio: 836/656;
			background-image: url("../img/hero_decoration_l.webp") no-repeat left 0.375rem/contain;
			right: calc(50% + 34.125rem);
			width: 26.125rem
		}
	}
	.p-hero::after {
		position: absolute;
		bottom: 0;
		content: "";
		aspect-ratio: 926/782;
		background: url("../img/hero_decoration_r2.webp") no-repeat center bottom/contain;
		width: 9.5938rem;
		left: calc(50% + 2.875rem)
	}
	@media(min-width: 768px) {
		.p-hero::after {
			aspect-ratio: 858/794;
			background: url("../img/hero_decoration_r.webp") no-repeat right 0.375rem/contain;
			left: calc(50% + 33.75rem);
			width: 26.8125rem
		}
	}
	.p-hero__logo {
		width: 17.875rem
	}
	@media(min-width: 768px) {
		.p-hero__logo {
			width: 56.1875rem
		}
	}
}
@layer project {
	.p-more-drinks {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr)
	}
	@media not all and (min-width: 768px) {
		.p-more-drinks {
			padding-inline: 0
		}
	}
	@media(min-width: 768px) {
		.p-more-drinks {
			background: linear-gradient(to right, var(--color-orange) 50.1%, var(--color-yellow) 50.1%);
			grid-template-columns: repeat(2, minmax(0, 1fr))
		}
	}
	.p-beer {
		position: relative;
		padding-block-start: 2.1875rem
	}
	@media not all and (min-width: 768px) {
		.p-beer {
			padding-block-end: 7.8125rem;
			padding-inline: var(--contents-margin);
			background-color: var(--color-orange)
		}
	}
	@media(min-width: 768px) {
		.p-beer {
			padding-block-start: 5rem;
			z-index: 2
		}
	}
	.p-beer::before {
		--_ratio: 108/110;
		--_w: 3.375rem;
		--_img: url('../img/beer_decoration1.webp');
		top: 1.6875rem;
		left: calc(50% + 6.5625rem);
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-beer::before {
			--_w: 6.75rem;
			top: -3.375rem;
			right: calc(100% + 2.5rem);
			left: auto
		}
	}
	.p-beer__heading {
		--_stroke-color: var(--color-orange-deep);
		font-size: 2.5rem
	}
	@media not all and (min-width: 768px) {
		.p-beer__heading {
			width: fit-content;
			margin-inline: auto;
			margin-block-end: 1.5625rem
		}
	}
	@media(min-width: 768px) {
		.p-beer__heading {
			font-size: 5rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-beer__list {
			display: grid;
			grid-template-columns: minmax(0, 1fr);
			justify-items: start
		}
	}
	@media(min-width: 768px) {
		.p-beer__list {
			display: flex;
			flex-wrap: wrap;
			justify-content: flex-end;
			padding-inline: 6.75rem 1.375rem;
			gap: 2.625rem 9.5rem;
			margin-block-start: -2.5rem
		}
	}
	.p-beer__item {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr)
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=premium] {
			order: -1;
			margin-inline-start: calc(50% - 6.875rem)
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=premium] {
			margin-block-end: .875rem;
			padding-block-end: .875rem
		}
	}
	.p-beer__item[data-id=premium]::after {
		--_ratio: 1;
		--_w: 1.7188rem;
		--_img: url('../img/beer_decoration2.webp');
		top: calc(100% + 3.125rem);
		left: -1.25rem;
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=premium]::after {
			--_w: 3.4375rem;
			bottom: 1rem;
			right: calc(100% + 8.125rem);
			top: auto;
			left: auto
		}
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=craft] {
			margin-block-start: 2rem;
			margin-inline-start: calc(50% - 6.875rem)
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=craft] {
			margin-block-start: auto
		}
	}
	.p-beer__item[data-id=craft]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=craft]::before {
			--_ratio: 92/96;
			--_w: 1.4375rem;
			--_img: url('../img/beer_decoration6.webp');
			left: calc(100% + 5.9375rem);
			top: 1.5rem
		}
	}
	.p-beer__item[data-id=craft]::after {
		--_ratio: 76/74;
		--_w: 2.375rem;
		--_img: url('../img/beer_decoration3.webp');
		left: 1.25rem;
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=craft]::after {
			bottom: calc(100% + 3.3125rem)
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=craft]::after {
			--_w: 4.75rem;
			right: calc(100% + 11.25rem);
			top: calc(100% - 2.25rem);
			left: auto
		}
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=ale] {
			order: -1;
			margin-inline-start: auto;
			margin-block-start: 2.9375rem
		}
	}
	.p-beer__item[data-id=ale]::after {
		--_ratio: 46/48;
		--_w: 1.4375rem;
		--_img: url('../img/beer_decoration4.webp');
		top: calc(100% - 0.625rem);
		left: 2.5rem;
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=ale]::after {
			--_w: 2.875rem;
			top: calc(100% + 2.5rem);
			left: 2.125rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=tower] {
			margin-inline-start: calc(50% - 5.6875rem);
			margin-block-start: 7.5rem
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=tower] {
			margin-inline-end: auto;
			margin-inline-start: .625rem
		}
	}
	.p-beer__item[data-id=tower]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=tower]::before {
			--_ratio: 124/114;
			--_w: 2rem;
			--_img: url('../img/beer_decoration7.webp');
			top: calc(100% + 2.1875rem);
			right: -0.625rem
		}
	}
	.p-beer__item[data-id=tower]::after {
		--_ratio: 79/64;
		--_w: 2.4688rem;
		--_img: url('../img/beer_decoration5.webp');
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=tower]::after {
			left: 1.75rem;
			bottom: calc(100% + 2rem)
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=tower]::after {
			--_w: 4.9375rem;
			top: calc(100% + 7.5rem);
			left: auto;
			right: calc(100% + 10.625rem)
		}
	}
	.p-beer__image {
		position: absolute
	}
	@media not all and (min-width: 768px) {
		.p-beer__image {
			font-size: .6rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=premium] .p-beer__image {
			top: -3.125rem;
			right: calc(100% - 0.625rem)
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=premium] .p-beer__image {
			top: -5.25rem;
			right: calc(100% - 1.25rem)
		}
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=craft] .p-beer__image {
			top: -2.5rem;
			right: calc(100% - 0.625rem)
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=craft] .p-beer__image {
			top: -4rem;
			right: calc(100% - 1.125rem)
		}
	}
	.p-beer__item[data-id=ale] .p-beer__image {
		top: -1.5625rem;
		right: calc(100% - 0.875rem)
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=ale] .p-beer__image {
			top: -2.375rem;
			right: calc(100% - 1.125rem)
		}
	}
	@media not all and (min-width: 768px) {
		.p-beer__item[data-id=tower] .p-beer__image {
			top: -5rem;
			right: calc(100% - 0.375rem)
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=tower] .p-beer__image {
			top: -1.25rem;
			right: calc(100% - 1.5rem)
		}
	}
	.p-beer__name, .p-others__name, .p-non-alcohol__name, .p-highball-gin__name {
		line-height: 1.167;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		margin-block-start: var(--leading-trim);
		letter-spacing: -0.05em;
		font-size: 1.1875rem
	}
	@media(min-width: 768px) {
		.p-beer__name, .p-others__name, .p-non-alcohol__name, .p-highball-gin__name {
			font-size: 1.8825rem
		}
	}
	.p-beer__name::after, .p-others__name::after, .p-non-alcohol__name::after, .p-highball-gin__name::after {
		content: attr(data-en);
		letter-spacing: 0;
		font-size: .9rem;
		margin-block-start: .25em
	}
	@media(min-width: 768px) {
		.p-beer__name::after, .p-others__name::after, .p-non-alcohol__name::after, .p-highball-gin__name::after {
			font-size: 1.25rem
		}
	}
	.p-beer__item[data-id=premium] .p-beer__name, .p-beer__item[data-id=premium] .p-others__name, .p-beer__item[data-id=premium] .p-non-alcohol__name, .p-beer__item[data-id=premium] .p-highball-gin__name {
		letter-spacing: -0.075em
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=premium] .p-beer__name, .p-beer__item[data-id=premium] .p-others__name, .p-beer__item[data-id=premium] .p-non-alcohol__name, .p-beer__item[data-id=premium] .p-highball-gin__name {
			font-size: 2.2594rem
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=premium] .p-beer__name::after, .p-beer__item[data-id=premium] .p-others__name::after, .p-beer__item[data-id=premium] .p-non-alcohol__name::after, .p-beer__item[data-id=premium] .p-highball-gin__name::after {
			font-size: 1.5rem
		}
	}
	.p-beer__item[data-id=ale] .p-beer__name, .p-beer__item[data-id=ale] .p-others__name, .p-beer__item[data-id=ale] .p-non-alcohol__name, .p-beer__item[data-id=ale] .p-highball-gin__name {
		padding-inline: .875rem
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=ale] .p-beer__name, .p-beer__item[data-id=ale] .p-others__name, .p-beer__item[data-id=ale] .p-non-alcohol__name, .p-beer__item[data-id=ale] .p-highball-gin__name {
			padding-inline: .5rem 2.5rem
		}
	}
	.p-beer__price, .p-others__price {
		font-size: 1.375rem
	}
	@media(min-width: 768px) {
		.p-beer__price, .p-others__price {
			font-size: 2.25rem
		}
	}
	@media(min-width: 768px) {
		.p-beer__item[data-id=premium] .p-beer__price, .p-beer__item[data-id=premium] .p-others__price {
			font-size: 2.7313rem;
			margin-block-start: 1rem;
			padding-block-start: .875rem
		}
	}
	.p-beer__note {
		position: absolute;
		width: 8.4375rem
	}
	@media not all and (min-width: 768px) {
		.p-beer__note {
			bottom: calc(100% + 0.9375rem);
			right: 0
		}
	}
	@media(min-width: 768px) {
		.p-beer__note {
			width: 15.75rem;
			top: calc(100% + 1.25rem);
			left: 1.25rem
		}
	}
	.p-highball-gin {
		position: relative
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin {
			background-color: var(--color-yellow);
			order: 2;
			margin-block-start: -5.1563rem;
			padding-block: 7.5rem 2rem;
			padding-inline: var(--contents-margin)
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin {
			padding-block: 5rem 2.375rem;
			padding-inline-start: 4.75rem
		}
	}
	.p-highball-gin::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin::before {
			--_ratio: 222/200;
			--_w: 3.4688rem;
			--_img: url('../img/hbg_decoration1_sp.webp');
			top: 2.9375rem;
			left: calc(50% + 7.5rem);
			z-index: 2
		}
	}
	.p-highball-gin::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin::after {
			--_ratio: 608/424;
			--_w: 9.5rem;
			--_img: url('../img/hbg_decoration5_sp.webp');
			bottom: 0;
			left: calc(50% + 2.8125rem)
		}
	}
	.p-highball-gin__heading {
		--_stroke-color: var(--color-yellow-deep);
		font-size: 2.5rem
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__heading {
			width: 15rem;
			gap: 1.25rem 0
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__heading {
			font-size: 4.875rem;
			margin-block-end: 3.625rem
		}
	}
	.p-highball-gin__heading small {
		font-size: 1.875rem
	}
	@media(min-width: 768px) {
		.p-highball-gin__heading small {
			font-size: 3.5rem
		}
	}
	.p-highball-gin__list {
		display: grid
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__list {
			grid-template-columns: minmax(0, 1fr) 52%;
			align-items: start;
			gap: 1.25rem .5rem
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__list {
			display: flex;
			flex-wrap: wrap;
			gap: 1.875rem 2.75rem;
			padding-inline-start: .5rem
		}
	}
	.p-highball-gin__item {
		position: relative
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__item {
			width: 100%
		}
	}
	.p-highball-gin__item[data-id=gin-soda]::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__item[data-id=gin-soda]::before {
			--_ratio: 544/250;
			--_w: 8.5625rem;
			--_img: url('../img/hbg_decoration2_sp.webp');
			left: .25rem;
			bottom: calc(100% + 1.0625rem)
		}
	}
	.p-highball-gin__item[data-id=gin-soda]::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__item[data-id=gin-soda]::after {
			--_ratio: 96/96;
			--_w: 1.5rem;
			--_img: url('../img/hbg_decoration3_sp.webp');
			bottom: -0.5rem;
			left: 1.0625rem
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__item[data-id=gin-soda]::after {
			--_ratio: 62/57;
			--_w: 3.875rem;
			--_img: url('../img/hbg_decoration1.webp');
			top: -2.125rem;
			right: calc(100% + 0.875rem)
		}
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__item[data-id=lemon-sour] {
			order: -1;
			grid-column: 2
		}
	}
	.p-highball-gin__item[data-id=lemon-sour]::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-highball-gin__item[data-id=lemon-sour]::after {
			--_ratio: 1;
			--_w: 3rem;
			--_img: url('../img/hbg_decoration2.webp');
			top: calc(100% - 1.5rem);
			right: calc(100% - 1.5rem)
		}
	}
	.p-highball-gin__item[data-id=kaku]::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__item[data-id=kaku]::after {
			--_ratio: 124/114;
			--_w: 1.9375rem;
			--_img: url('../img/hbg_decoration4_sp.webp');
			top: -1.25rem;
			right: -0.5rem
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__item[data-id=kaku]::after {
			--_ratio: 98/105;
			--_w: 6.125rem;
			--_img: url('../img/hbg_decoration3.webp');
			top: 1.0625rem;
			left: calc(100% + 7.0625rem)
		}
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__item[data-id=makers-mark] {
			order: 2;
			grid-column: 1/span 2;
			width: fit-content
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__item[data-id=makers-mark] {
			margin-inline-start: auto;
			margin-block-start: .5rem
		}
	}
	.p-highball-gin__item[data-id=makers-mark]::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-highball-gin__item[data-id=makers-mark]::after {
			--_ratio: 128/105;
			--_w: 8rem;
			--_img: url('../img/hbg_decoration4.webp');
			top: .25rem;
			right: calc(100% + 2.5rem)
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__item[data-id=jim-beam] {
			margin-inline-start: auto;
			margin-block-start: .5rem
		}
	}
	.p-highball-gin__image {
		position: absolute
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__image {
			font-size: .5938rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__item[data-id=lemon-sour] .p-highball-gin__image {
			bottom: calc(100% - 0.25rem);
			right: 0
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__item[data-id=lemon-sour] .p-highball-gin__image {
			top: -1.25rem;
			left: calc(100% - 0.625rem)
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__name {
			letter-spacing: 0
		}
	}
	@media not all and (min-width: 768px) {
		.p-highball-gin__item[data-id=lemon-sour] .p-highball-gin__name {
			letter-spacing: -0.075em;
			white-space: nowrap
		}
	}
	@media(min-width: 768px) {
		.p-highball-gin__price {
			font-size: 2.25rem
		}
	}
	.p-non-alcohol {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		z-index: 1
	}
	@media not all and (min-width: 768px) {
		.p-non-alcohol {
			align-content: start;
			min-height: 23.4375rem;
			margin-block-start: -5.3125rem;
			padding-block: 1rem;
			padding-inline: var(--contents-margin);
			background: linear-gradient(to bottom, transparent 2.6563rem, var(--color-orange) 2.6563rem, var(--color-orange) 50%, var(--color-yellow) 50%, var(--color-yellow) calc(100% - 2.6563rem), transparent calc(100% - 2.6563rem))
		}
	}
	@media(min-width: 768px) {
		.p-non-alcohol {
			position: absolute;
			overflow: hidden;
			width: 43.75rem;
			bottom: 0;
			left: 0;
			right: 0;
			margin-inline: auto;
			padding-block: 2.5rem 2rem
		}
	}
	.p-non-alcohol::before {
		position: absolute;
		top: 0;
		content: "";
		border-radius: 50%;
		background-color: var(--color-blue)
	}
	@media not all and (min-width: 768px) {
		.p-non-alcohol::before {
			width: 28.3125rem;
			left: calc(50% - 14.1563rem);
			bottom: 0
		}
	}
	@media(min-width: 768px) {
		.p-non-alcohol::before {
			aspect-ratio: 1;
			left: 0;
			width: 100%
		}
	}
	.p-non-alcohol__heading {
		--_stroke-color: var(--color-blue-deep);
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		gap: .875rem;
		margin-block-end: 3rem
	}
	@media(min-width: 768px) {
		.p-non-alcohol__heading {
			margin-block-end: 5.75rem;
			gap: 1.625rem
		}
	}
	.p-non-alcohol__list {
		display: grid
	}
	@media not all and (min-width: 768px) {
		.p-non-alcohol__list {
			grid-template-columns: minmax(0, 1fr);
			width: 100%;
			gap: .875rem
		}
	}
	@media(min-width: 768px) {
		.p-non-alcohol__list {
			display: flex;
			align-items: flex-end;
			justify-content: flex-end;
			padding-inline-end: 1.375rem;
			gap: 0 5.125rem;
			width: 100%
		}
	}
	.p-non-alcohol__item {
		position: relative;
		z-index: 1
	}
	@media not all and (min-width: 768px) {
		.p-non-alcohol__item[data-id=all-free] {
			margin-left: 50%
		}
	}
	@media not all and (min-width: 768px) {
		.p-non-alcohol__item[data-id=zeroppa] {
			margin-left: calc(50% - 5rem)
		}
	}
	.p-non-alcohol__item[data-id=zeroppa]::before {
		--_ratio: 65/64;
		--_w: 2rem;
		--_img: url('../img/na_decoration1.webp');
		bottom: calc(100% + 4.8438rem);
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-non-alcohol__item[data-id=zeroppa]::before {
			left: -1.875rem
		}
	}
	@media(min-width: 768px) {
		.p-non-alcohol__item[data-id=zeroppa]::before {
			--_w: 4.375rem;
			bottom: calc(100% + 2rem);
			right: 3.3125rem
		}
	}
	.p-non-alcohol__item[data-id=zeroppa]::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-non-alcohol__item[data-id=zeroppa]::after {
			--_ratio: 110/106;
			--_w: 1.8125rem;
			--_img: url('../img/na_decoration2.webp');
			left: calc(100% + 2.25rem);
			bottom: 2.25rem
		}
	}
	.p-non-alcohol__image {
		position: absolute
	}
	@media not all and (min-width: 768px) {
		.p-non-alcohol__image {
			font-size: .6rem
		}
	}
	.p-non-alcohol__item[data-id=all-free] .p-non-alcohol__image {
		top: -2.25rem;
		right: calc(100% - 0.75rem)
	}
	@media(min-width: 768px) {
		.p-non-alcohol__item[data-id=all-free] .p-non-alcohol__image {
			top: -4.5rem;
			right: calc(100% - 1.5rem)
		}
	}
	.p-non-alcohol__item[data-id=zeroppa] .p-non-alcohol__image {
		top: -3.4375rem;
		right: calc(100% - 0.625rem)
	}
	@media(min-width: 768px) {
		.p-non-alcohol__item[data-id=zeroppa] .p-non-alcohol__image {
			top: -6.5rem;
			right: calc(100% - 1.25rem)
		}
	}
	.p-non-alcohol__name {
		font-size: 1.2rem
	}
	.p-non-alcohol__name small {
		font-size: .9rem
	}
	@media(min-width: 768px) {
		.p-non-alcohol__name small {
			font-size: 1.25rem
		}
	}
	@media(min-width: 768px) {
		.p-non-alcohol__price {
			font-size: 2.25rem
		}
	}
}
@layer project {
	.p-others {
		position: relative;
		background-color: var(--color-purple)
	}
	@media not all and (min-width: 768px) {
		.p-others {
			padding-block: 2.3125rem 2rem;
			padding-inline: var(--contents-margin)
		}
	}
	@media(min-width: 768px) {
		.p-others {
			padding-block: 3rem 3.5rem;
			padding-inline-end: 2.5rem
		}
	}
	.p-others::before {
		--_img: url('../img/others_decration1_sp.webp');
		--_ratio: 73/271;
		--_w: 2.2813rem;
		top: 1.625rem;
		left: calc(50% + 7.1875rem);
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-others::before {
			--_img: url('../img/others_decration1.webp');
			--_ratio: 116/160;
			--_w: 7.25rem;
			top: 3.3125rem;
			right: 2.8125rem;
			left: auto
		}
	}
	@media(min-width: 768px) {
		.p-others::after {
			--_ratio: 170/102;
			--_w: 10.625rem;
			--_img: url('../img/others_decration4.webp');
			content: "";
			aspect-ratio: var(--_ratio);
			width: var(--_w);
			background: var(--_img) no-repeat center/contain;
			position: absolute;
			pointer-events: none;
			bottom: 0;
			right: calc(100% - 3.5rem)
		}
	}
	.p-others__heading {
		--_stroke-color: var(--color-purple-deep);
		font-size: 2.5rem;
		margin-block-end: 2rem
	}
	@media not all and (min-width: 768px) {
		.p-others__heading {
			width: fit-content;
			margin-inline: auto
		}
	}
	@media(min-width: 768px) {
		.p-others__heading {
			font-size: 5rem;
			margin-block-end: 3.375rem
		}
	}
	.p-others__list {
		display: grid
	}
	@media not all and (min-width: 768px) {
		.p-others__list {
			grid-template-columns: minmax(0, 1fr);
			gap: 1.5rem
		}
	}
	@media(min-width: 768px) {
		.p-others__list {
			--_item-column-width: 26.875rem;
			--_column-gap: 2.5rem;
			display: flex;
			flex-wrap: wrap;
			writing-mode: vertical-lr;
			gap: var(--_column-gap) 1.75rem;
			height: 37.1875rem;
			width: 100%
		}
	}
	.p-others__item {
		position: relative;
		writing-mode: horizontal-tb
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=champagne] {
			margin-block-end: 1.625rem;
			width: 26.5rem
		}
	}
	.p-others__item[data-id=champagne]::after {
		--_ratio: 1;
		--_w: 1.6563rem;
		--_img: url('../img/others_decration2.webp');
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-others__item[data-id=champagne]::after {
			left: -0.8125rem;
			bottom: .625rem
		}
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=champagne]::after {
			--_w: 3.3125rem;
			top: calc(100% - 0.25rem);
			left: calc(100% - 0.75rem)
		}
	}
	.p-others__item[data-id=tequila] {
		width: 16.0625rem
	}
	@media not all and (min-width: 768px) {
		.p-others__item[data-id=tequila] {
			margin-inline-start: auto
		}
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=tequila] {
			width: var(--_item-column-width)
		}
	}
	@media not all and (min-width: 768px) {
		.p-others__item[data-id=tequila]::before {
			--_ratio: 55/53;
			--_w: 2.625rem;
			--_img: url('../img/others_decration3.webp');
			content: "";
			aspect-ratio: var(--_ratio);
			width: var(--_w);
			background: var(--_img) no-repeat center/contain;
			position: absolute;
			pointer-events: none;
			bottom: 1.25rem;
			right: calc(100% + 1.875rem)
		}
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=wine] {
			margin-block-start: -6.25rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-others__item[data-id=wine]::after {
			--_ratio: 174/158;
			--_w: 2.75rem;
			--_img: url('../img/others_decration5.webp');
			content: "";
			aspect-ratio: var(--_ratio);
			width: var(--_w);
			background: var(--_img) no-repeat center/contain;
			position: absolute;
			pointer-events: none;
			top: .5rem;
			left: calc(100% + 2.625rem)
		}
	}
	.p-others__label {
		aspect-ratio: 1;
		border-radius: 50%;
		background-color: #fff;
		color: var(--color-purple);
		position: absolute;
		display: grid;
		place-items: center;
		line-height: 1.2;
		padding-inline: .5em;
		width: 3.75em;
		text-align: center;
		font-size: .75rem
	}
	@media(min-width: 768px) {
		.p-others__label {
			font-size: 1.25rem
		}
	}
	.p-others__item[data-id=champagne] .p-others__label {
		top: -0.9375rem;
		right: 3.5625rem
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=champagne] .p-others__label {
			top: -1.5rem;
			right: 6rem
		}
	}
	.p-others__item[data-id=tequila] .p-others__label {
		top: -1.1563rem;
		right: .5rem
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=tequila] .p-others__label {
			top: -2.125rem;
			right: .875rem
		}
	}
	.p-others__image {
		position: absolute
	}
	@media not all and (min-width: 768px) {
		.p-others__image {
			font-size: .6rem
		}
	}
	.p-others__item[data-id=champagne] .p-others__image {
		top: -2.5rem;
		right: .375rem
	}
	@media not all and (min-width: 768px) {
		.p-others__item[data-id=champagne] .p-others__image {
			z-index: 1
		}
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=champagne] .p-others__image {
			top: -4.625rem;
			right: 1.625rem
		}
	}
	.p-others__item[data-id=tequila] .p-others__image {
		top: 1.5rem;
		right: .75rem
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=tequila] .p-others__image {
			top: 2.3125rem;
			right: 1.1875rem
		}
	}
	.p-others__name small {
		font-size: .875rem
	}
	@media(min-width: 768px) {
		.p-others__name small {
			font-size: 1.5rem
		}
	}
	.p-others__item[data-id=champagne] .p-others__name small:nth-of-type(2), .p-others__item[data-id=tequila] .p-others__name small:nth-of-type(2) {
		font-size: .75rem
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=champagne] .p-others__name small:nth-of-type(2), .p-others__item[data-id=tequila] .p-others__name small:nth-of-type(2) {
			font-size: 1.25rem
		}
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=wine] .p-others__name small {
			font-size: 1.25rem
		}
	}
	@media(min-width: 768px) {
		.p-others__en {
			font-size: 1.25rem;
			line-height: 2rem
		}
	}
	.p-others__en b {
		font-weight: bold
	}
	@media(min-width: 768px) {
		.p-others__en b {
			font-size: 1.5rem
		}
	}
	@media(min-width: 768px) {
		.p-others__en small {
			font-size: 1.0456rem
		}
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=tequila] .p-others__en {
			line-height: 1.5625rem
		}
	}
	.p-others__item[data-id=tequila] .p-others__en b {
		display: block
	}
	@media(min-width: 768px) {
		.p-others__item[data-id=tequila] .p-others__en b {
			line-height: 2rem
		}
	}
	.p-others-sub {
		position: relative;
		writing-mode: horizontal-tb;
		width: 100%
	}
	@media not all and (min-width: 768px) {
		.p-others-sub {
			padding-block-end: 1.25rem
		}
	}
	@media(min-width: 768px) {
		.p-others-sub {
			width: calc(100% - var(--_item-column-width) - var(--_column-gap));
			flex: 1;
			display: block
		}
	}
	.p-others-sub::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media not all and (min-width: 768px) {
		.p-others-sub::after {
			--_ratio: 170/102;
			--_w: 5.3125rem;
			--_img: url('../img/others_decration4.webp');
			bottom: calc(100% + 0.125rem);
			right: -0.375rem
		}
	}
	@media(min-width: 768px) {
		.p-others-sub::after {
			--_ratio: 55/53;
			--_w: 3.4375rem;
			--_img: url('../img/others_decration3.webp');
			top: calc(100% - 2rem);
			right: calc(100% - 1.25rem)
		}
	}
	.p-others-sub__price, .p-soft-drink__price {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		align-content: center;
		justify-items: start;
		font-family: var(--font-english);
		color: var(--color-purple);
		background-color: #fff;
		border-radius: .3125rem;
		width: 5.4375rem;
		height: 2.625rem;
		padding-inline: .75rem;
		gap: .3125rem;
		margin-inline-start: auto;
		margin-block-end: -1.875rem
	}
	@media(min-width: 768px) {
		.p-others-sub__price, .p-soft-drink__price {
			border-radius: .625rem;
			gap: .5rem;
			width: 9.0625rem;
			height: 5.8125rem;
			padding-inline: 1.25rem;
			margin-block-end: -3.5rem
		}
	}
	.p-others-sub__price span, .p-soft-drink__price span {
		line-height: 1cap;
		font-size: .875rem
	}
	@media(min-width: 768px) {
		.p-others-sub__price span, .p-soft-drink__price span {
			font-size: 1.4644rem
		}
	}
	.p-others-sub__price b, .p-soft-drink__price b {
		line-height: 1cap;
		font-size: 1.375rem
	}
	@media(min-width: 768px) {
		.p-others-sub__price b, .p-soft-drink__price b {
			font-size: 2.2594rem
		}
	}
	.p-others-sub__list {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-rows: auto auto auto auto auto auto;
		grid-auto-flow: column;
		align-content: start;
		align-items: start;
		gap: .625rem .1875rem
	}
	@media(min-width: 768px) {
		.p-others-sub__list {
			margin-inline-start: -0.5rem;
			gap: 1.0625rem .25rem
		}
	}
	.p-others-sub__item, .p-soft-drink__item {
		position: relative;
		padding-inline-start: 1em;
		line-height: 1.5;
		font-size: 1rem
	}
	@media(min-width: 768px) {
		.p-others-sub__item, .p-soft-drink__item {
			font-size: 1.375rem
		}
	}
	.p-others-sub__item:nth-child(1), .p-soft-drink__item:nth-child(1) {
		grid-column: 1/span 2
	}
	.p-others-sub__item::before, .p-soft-drink__item::before {
		position: absolute;
		top: 0;
		left: 0;
		content: "・"
	}
	.p-others-sub__name, .p-soft-drink__name {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		letter-spacing: -0.05em
	}
	.p-others-sub__name::after, .p-soft-drink__name::after {
		content: attr(data-en);
		line-height: 1.25;
		letter-spacing: 0;
		font-size: .75rem
	}
	@media(min-width: 768px) {
		.p-others-sub__name::after, .p-soft-drink__name::after {
			font-size: 1.0625rem
		}
	}
}
@layer project {
	.p-soft-drink {
		position: relative
	}
	@media not all and (min-width: 768px) {
		.p-soft-drink {
			background-color: var(--color-green);
			padding-block: 2.1875rem;
			padding-inline: var(--contents-margin)
		}
	}
	@media(min-width: 768px) {
		.p-soft-drink {
			padding-block-start: 3rem;
			padding-inline-start: 2.125rem
		}
	}
	.p-soft-drink::before {
		--_ratio: 70/69;
		--_w: 2.1875rem;
		--_img: url('../img/soft_drink_decration1.webp');
		top: -0.875rem;
		left: calc(50% + 8.125rem);
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-soft-drink::before {
			--_w: 4.375rem;
			top: 8rem;
			left: calc(100% + 4rem)
		}
	}
	@media(min-width: 768px) {
		.p-soft-drink::after {
			--_ratio: 576/329;
			--_w: 36rem;
			--_img: url('../img/soft_drink_decration2.webp');
			content: "";
			aspect-ratio: var(--_ratio);
			width: var(--_w);
			background: var(--_img) no-repeat center/contain;
			position: absolute;
			pointer-events: none;
			bottom: 0;
			right: -5.6875rem
		}
	}
	.p-soft-drink__heading {
		--_stroke-color: var(--color-green-deep);
		font-size: 2.5rem
	}
	@media not all and (min-width: 768px) {
		.p-soft-drink__heading {
			width: fit-content;
			margin-inline: auto;
			margin-block-end: 1.25rem
		}
	}
	@media(min-width: 768px) {
		.p-soft-drink__heading {
			font-size: 5rem;
			margin-inline-start: -0.875rem;
			margin-block-end: 2.5rem
		}
	}
	.p-soft-drink__contents {
		width: 100%;
		padding-block-end: 1.25rem
	}
	@media(min-width: 768px) {
		.p-soft-drink__contents {
			padding-block-end: 2rem
		}
	}
	.p-soft-drink__price {
		color: var(--color-green)
	}
	.p-soft-drink__list {
		width: 100%;
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-rows: auto auto auto auto;
		grid-auto-flow: column;
		margin-inline-start: -0.25rem;
		align-content: start;
		align-items: start;
		gap: .625rem .25rem
	}
	@media(min-width: 768px) {
		.p-soft-drink__list {
			margin-inline-start: -0.5rem;
			gap: 3rem .25rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-soft-drink__item {
			font-size: .9375rem
		}
	}
	@media not all and (min-width: 768px) {
		.p-soft-drink__name {
			white-space: nowrap
		}
	}
}
@layer project {
	.p-tacos {
		position: relative;
		background-color: var(--color-pink);
		padding-block: 2.125rem
	}
	@media(min-width: 768px) {
		.p-tacos {
			padding-block: 5rem 8.5rem
		}
	}
	.p-tacos::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none;
		--_ratio: 1536/667;
		--_w: 48rem;
		--_img: url('../img/tacos_decoration_top_sp.webp');
		top: -1.5625rem;
		left: calc(50% - 24rem);
		z-index: 1
	}
	@media(min-width: 768px) {
		.p-tacos::before {
			--_ratio: 2880/705;
			--_w: 120rem;
			--_img: url('../img/tacos_decoration_top.webp');
			top: -3.0625rem;
			left: calc(50% - 60rem)
		}
	}
	.p-tacos::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none;
		--_ratio: 1536/692;
		--_w: 48rem;
		--_img: url('../img/tacos_decoration_bottom_sp.webp');
		bottom: 2.5rem;
		left: calc(50% - 24rem);
		z-index: 2
	}
	@media(min-width: 768px) {
		.p-tacos::after {
			--_ratio: 2880/711;
			--_w: 120rem;
			--_img: url('../img/tacos_decoration_bottom.webp');
			bottom: 1.5rem;
			left: calc(50% - 60rem)
		}
	}
	.p-tacos__heading {
		--_stroke-color: var(--color-pink-deep);
		font-size: 2.5rem
	}
	@media not all and (min-width: 768px) {
		.p-tacos__heading {
			width: fit-content;
			margin-inline: auto;
			margin-block-end: 1.375rem
		}
	}
	@media(min-width: 768px) {
		.p-tacos__heading {
			font-size: 6.25rem;
			margin-block-end: 4.5rem
		}
	}
	.p-tacos__contents {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 1.4375rem
	}
	@media(min-width: 768px) {
		.p-tacos__contents {
			align-items: start;
			grid-template-columns: 34.625rem minmax(0, 1fr);
			gap: 0 3.75rem
		}
	}
	.p-tacos-information {
		position: relative;
		border: .125rem solid #fff;
		border-radius: .75rem;
		color: #fff;
		padding: 1.25rem .9375rem
	}
	@media not all and (min-width: 768px) {
		.p-tacos-information {
			display: grid;
			grid-template-columns: minmax(0, 1fr);
			justify-items: center
		}
	}
	@media(min-width: 768px) {
		.p-tacos-information {
			border-width: .25rem;
			border-radius: 1.5rem;
			padding: 2.0625rem 2.5rem 1.6875rem
		}
	}
	.p-tacos-information::before {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-tacos-information::before {
			--_ratio: 62/69;
			--_w: 3.875rem;
			--_img: url('../img/tacos_decoration1.webp');
			top: -3.125rem;
			left: 14.75rem
		}
	}
	.p-tacos-information::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-tacos-information::after {
			--_ratio: 46/44;
			--_w: 2.875rem;
			--_img: url('../img/tacos_decoration3.webp');
			top: 16.625rem;
			left: calc(100% + 2.5rem)
		}
	}
	.p-tacos-information__title {
		line-height: 1;
		font-size: 1.5rem;
		letter-spacing: -0.08em;
		gap: .5rem
	}
	@media(min-width: 768px) {
		.p-tacos-information__title {
			font-size: 2.625rem;
			gap: 1.125rem
		}
	}
	.p-tacos-information__title::after {
		content: attr(data-en);
		line-height: 1cap;
		letter-spacing: 0;
		font-size: .9375rem
	}
	@media(min-width: 768px) {
		.p-tacos-information__title::after {
			font-size: 2.125rem
		}
	}
	.p-tacos-information__image {
		position: relative;
		margin-block-start: -0.375rem;
		margin-inline: -2.1875rem
	}
	@media(min-width: 768px) {
		.p-tacos-information__image {
			margin-block-start: -0.375rem;
			margin-inline: -3.75rem
		}
	}
	.p-tacos-information__image::after {
		content: "";
		aspect-ratio: var(--_ratio);
		width: var(--_w);
		background: var(--_img) no-repeat center/contain;
		position: absolute;
		pointer-events: none
	}
	@media(min-width: 768px) {
		.p-tacos-information__image::after {
			--_ratio: 1;
			--_w: 2.1875rem;
			--_img: url('../img/tacos_decoration2.webp');
			top: -1.1875rem;
			right: 5.625rem
		}
	}
	.p-tacos-information__price {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		align-items: center;
		gap: 0 .625rem;
		margin-block-start: 1.25rem
	}
	@media(min-width: 768px) {
		.p-tacos-information__price {
			margin-block-start: 1rem;
			gap: 0 1rem
		}
	}
	.p-tacos-information__price dt {
		font-size: 1.3125rem;
		line-height: 1.6364
	}
	@media(min-width: 768px) {
		.p-tacos-information__price dt {
			font-size: 2.25rem;
			line-height: 1.3728
		}
	}
	.p-tacos-information__price dd {
		font-size: 1.8125rem;
		font-family: var(--font-english);
		font-weight: normal;
		line-height: 1cap
	}
	@media(min-width: 768px) {
		.p-tacos-information__price dd {
			font-size: 2.75rem
		}
	}
	.p-tacos-more {
		display: flex
	}
	@media not all and (min-width: 768px) {
		.p-tacos-more {
			flex-wrap: wrap;
			justify-content: center;
			margin-inline: -0.9375rem;
			gap: 0 .5rem
		}
	}
	@media(min-width: 768px) {
		.p-tacos-more {
			align-items: flex-start;
			gap: 0 2rem
		}
	}
	.p-tacos-more__lead {
		width: 7.1875rem
	}
	@media(min-width: 768px) {
		.p-tacos-more__lead {
			width: 16.1875rem;
			margin-block-start: -1.75rem
		}
	}
	.p-tacos-more__note {
		width: 13.4375rem;
		margin-block-start: 1.625rem
	}
	@media not all and (min-width: 768px) {
		.p-tacos-more__note {
			order: -1
		}
	}
	@media(min-width: 768px) {
		.p-tacos-more__note {
			width: 21.9375rem;
			margin-block-start: -6.5rem
		}
	}
	.p-tacos-more__image {
		width: 20.1875rem
	}
	@media not all and (min-width: 768px) {
		.p-tacos-more__image {
			translate: -4% 0;
			margin-block-start: -3.125rem
		}
	}
	@media(min-width: 768px) {
		.p-tacos-more__image {
			position: absolute;
			bottom: -1.5rem;
			left: calc(50% - 7.5rem);
			width: 57.5rem
		}
	}
}
@layer project {
	.p-form select, .p-form textarea, .p-form input[type=text], .p-form input[type=email], .p-form input[type=tel], .p-form input[type=number] {
		padding-block: var(--_pb);
		padding-inline: var(--_pi);
		border-radius: var(--_radius);
		background-color: var(--_bg);
		border: var(--_border);
		display: block;
		width: 100%
	}
	.p-form select.error, .p-form textarea.error, .p-form input.error[type=text], .p-form input.error[type=email], .p-form input.error[type=tel], .p-form input.error[type=number] {
		border-color: var(--_red)
	}
	.p-form {
		--_radius: 0;
		--_pb: 0.75em;
		--_pi: 0.5em;
		--_bg: #f0f0f0;
		--_border-width: 1px;
		--_border: var(--_border-width) solid var(--_bg);
		--_red: #d00;
		--_pc-label-width: 15rem;
		--_gap: 2.5rem;
		--_mark-width: 2em;
		line-height: 1.5;
		padding-bottom: var(--section-padding-block)
	}
	@media(min-width: 768px) {
		.p-form {
			--_radius: 0;
			--_pb: 0.75em;
			--_pi: 1em;
			--_gap: 4rem
		}
	}
	.p-form input[type=radio], .p-form input[type=checkbox] {
		display: none
	}
	.p-form input[name=postal_code] {
		width: 15em
	}
	.p-form input[name=age] {
		width: 10em
	}
	.p-form select {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		padding-right: 3em
	}
	.p-form textarea {
		height: 12.5rem
	}
	@media(min-width: 768px) {
		.p-form textarea {
			height: 15rem
		}
	}
	.p-form__contents {
		display: grid;
		gap: var(--_gap)
	}
	.p-form__field {
		display: grid
	}
	@media not all and (min-width: 768px) {
		.p-form__field {
			gap: .625rem
		}
	}
	@media(min-width: 768px) {
		.p-form__field {
			align-items: strat;
			grid-template-columns: var(--_pc-label-width) minmax(0, 1fr)
		}
	}
	@media(min-width: 768px) {
		.p-form:not(.is-confirm) .p-form__label {
			padding-top: calc(var(--_border-width) + var(--_pb))
		}
	}
	@media(min-width: 768px) {
		.p-form__field:has(.p-form__list) .p-form__label {
			padding-top: calc(var(--_mark-width)*.5 - .5lh)
		}
	}
	@media(min-width: 768px) {
		.p-form.is-confirm .p-form__field:has(.p-form__list) .p-form__label {
			padding-top: 0
		}
	}
	.p-form__content {
		position: relative
	}
	.p-form.is-confirm .p-form__content {
		display: none
	}
	.p-form__content:has(.p-form__prefix), .p-form__content:has(.p-form__suffix) {
		display: flex;
		align-items: center;
		gap: 1em
	}
	.p-form__content .error-text {
		color: var(--_red)
	}
	.p-form:not(.is-confirm) .p-form__confirm {
		display: none
	}
	.p-form__list {
		display: grid;
		gap: .9375rem
	}
	@media(min-width: 768px) {
		.p-form__list {
			grid-template-columns: repeat(3, minmax(0, 1fr));
			justify-items: start;
			gap: 1rem 1.5rem
		}
	}
	.p-form__radio span {
		position: relative;
		display: grid;
		grid-template-columns: var(--_mark-width) minmax(0, 1fr);
		align-items: center;
		gap: 1em
	}
	.p-form__radio span::before {
		content: "";
		aspect-ratio: 1;
		border-radius: 50%;
		background-color: var(--_bg)
	}
	.p-form__radio span::after {
		content: "";
		aspect-ratio: 1;
		border-radius: 50%;
		width: var(--_mark-width);
		background-color: var(--color-primary);
		position: absolute;
		top: 0;
		left: 0;
		scale: .5;
		display: none
	}
	.p-form__radio input[type=radio]:checked+span::after {
		display: block
	}
	.p-form__checkbox span {
		position: relative;
		display: grid;
		grid-template-columns: var(--_mark-width) minmax(0, 1fr);
		align-items: center;
		gap: 1em
	}
	.p-form__checkbox span::before {
		content: "";
		aspect-ratio: 1;
		background-color: var(--_bg)
	}
	.p-form__checkbox span::after {
		content: "";
		aspect-ratio: 2;
		width: var(--_mark-width);
		border-left: 3px solid var(--color-primary);
		border-bottom: 3px solid var(--color-primary);
		position: absolute;
		top: 0;
		left: 0;
		rotate: -45deg;
		translate: 0 25%;
		scale: .75;
		display: none
	}
	.p-form__checkbox span:has(a) {
		grid-template-columns: var(--_mark-width) auto minmax(0, 1fr)
	}
	.p-form__checkbox input[type=checkbox]:checked+span::after {
		display: block
	}
	.p-form__select {
		position: relative;
		width: fit-content
	}
	.p-form__select::after {
		content: "";
		aspect-ratio: 1.618;
		background-color: var(--color-primary);
		position: absolute;
		width: 1em;
		right: 1em;
		top: 50%;
		translate: 0 -40%;
		clip-path: polygon(0 0, 100% 0, 50% 100%)
	}
	.p-form__hidden {
		height: 0;
		overflow: hidden
	}
	.p-form__agree {
		margin-top: var(--_gap);
		display: grid;
		justify-items: center
	}
	.p-form__buttons {
		display: grid;
		justify-items: center;
		margin-top: var(--_gap)
	}
	.p-form.is-confirm .p-form__button.is-confirm {
		display: none
	}
	.p-form__button.is-confirm:disabled {
		opacity: .5
	}
	.p-form:not(.is-confirm) .p-form__button.is-submit {
		display: none
	}
	.p-form:not(.is-confirm) .p-form__button.is-back {
		display: none
	}
}
@layer utility {
	.u-mbs0 {
		margin-block-start: 0
	}
	.u-mbs05em {
		margin-block-start: .5em
	}
	.u-mbs1em {
		margin-block-start: 1em
	}
	.u-mbs15em {
		margin-block-start: 1.5em
	}
	.u-mbs2em {
		margin-block-start: 2em
	}
	.u-mbs8 {
		margin-block-start: .3125rem
	}
	@media(min-width: 768px) {
		.u-mbs8 {
			margin-block-start: .5rem
		}
	}
	.u-mbs16 {
		margin-block-start: .625rem
	}
	@media(min-width: 768px) {
		.u-mbs16 {
			margin-block-start: 1rem
		}
	}
	.u-mbs24 {
		margin-block-start: 1.25rem
	}
	@media(min-width: 768px) {
		.u-mbs24 {
			margin-block-start: 1.5rem
		}
	}
	.u-mbs32 {
		margin-block-start: 1.5625rem
	}
	@media(min-width: 768px) {
		.u-mbs32 {
			margin-block-start: 2rem
		}
	}
	.u-mbs40 {
		margin-block-start: 1.875rem
	}
	@media(min-width: 768px) {
		.u-mbs40 {
			margin-block-start: 2.5rem
		}
	}
	.u-mbs48 {
		margin-block-start: 2.1875rem
	}
	@media(min-width: 768px) {
		.u-mbs48 {
			margin-block-start: 3rem
		}
	}
	.u-mbs56 {
		margin-block-start: 2.5rem
	}
	@media(min-width: 768px) {
		.u-mbs56 {
			margin-block-start: 3.5rem
		}
	}
	.u-mbs64 {
		margin-block-start: 2.8125rem
	}
	@media(min-width: 768px) {
		.u-mbs64 {
			margin-block-start: 4rem
		}
	}
	.u-mbs72 {
		margin-block-start: 3.125rem
	}
	@media(min-width: 768px) {
		.u-mbs72 {
			margin-block-start: 4.5rem
		}
	}
	.u-mbs80 {
		margin-block-start: 3.75rem
	}
	@media(min-width: 768px) {
		.u-mbs80 {
			margin-block-start: 5rem
		}
	}
	.u-mbs88 {
		margin-block-start: 3.75rem
	}
	@media(min-width: 768px) {
		.u-mbs88 {
			margin-block-start: 5.5rem
		}
	}
	.u-mbs96 {
		margin-block-start: 3.75rem
	}
	@media(min-width: 768px) {
		.u-mbs96 {
			margin-block-start: 6rem
		}
	}
	.u-mbs104 {
		margin-block-start: 3.75rem
	}
	@media(min-width: 768px) {
		.u-mbs104 {
			margin-block-start: 6.5rem
		}
	}
	.u-mbs112 {
		margin-block-start: 4.375rem
	}
	@media(min-width: 768px) {
		.u-mbs112 {
			margin-block-start: 7rem
		}
	}
	.u-mbs120 {
		margin-block-start: 4.375rem
	}
	@media(min-width: 768px) {
		.u-mbs120 {
			margin-block-start: 7.5rem
		}
	}
	.u-lh1 {
		line-height: 1
	}
	.u-lh15 {
		line-height: 1.5
	}
	.u-lh175 {
		line-height: 1.75
	}
	.u-lh2 {
		line-height: 2
	}
	.u-w-100p {
		width: 100%
	}
	.u-w-fit {
		width: fit-content
	}
	@supports(text-box-trim: trim-both) {
		.u-trim-box {
			text-box: trim-both text text
		}
	}
	.u-trim {
		margin-block: var(--leading-trim)
	}
	.u-trim-top {
		margin-block-start: var(--leading-trim)
	}
	.u-trim-bottom {
		margin-bottom: var(--leading-trim)
	}
	.u-block-center {
		margin-inline: auto
	}
	.u-text-center {
		text-align: center
	}
	.u-text-right {
		text-align: right
	}
	@media(min-width: 768px) {
		.md\:u-text-center {
			text-align: center
		}
	}
	.u-has-mark {
		text-indent: -1em;
		padding-left: 1em
	}
	.u-text-proportional {
		font-feature-settings: "palt"
	}
	.u-sup {
		vertical-align: super;
		font-size: .75em
	}
	.u-sub {
		vertical-align: sub;
		font-size: .75em
	}
	.u-visually-hidden {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		padding: 0 !important;
		margin: -1px !important;
		overflow: hidden !important;
		clip: rect(0, 0, 0, 0) !important;
		white-space: nowrap !important;
		border: 0 !important
	}
	@media(min-width: 768px) {
		.u-is-sp {
			display: none
		}
	}
	@media not all and (min-width: 768px) {
		.u-is-pc {
			display: none
		}
	}
	.u-color {
		color: var(--color-primary)
	}
	.u-white {
		color: #fff
	}
	.u-bold {
		font-weight: bold
	}
	.u-mid {
		font-weight: 500
	}
}