@charset "utf-8";

#footer,
#footer2 {
	padding-top: 0;
}

.gn-footer {
	--gn-footer-background: #f8f4ec;
	--gn-footer-page-background: #fff5f4;
	--gn-footer-surface: #f0ece3;
	--gn-footer-surface-strong: #e6e2d8;
	--gn-footer-brand-surface: #4a4949;
	--gn-footer-text: #4a4a4a;
	--gn-footer-muted: #8e8e8e;
	--gn-footer-border: #b9b9b6;
	--gn-footer-divider: #242424;
	--gn-footer-pattern: #f5f0e6;
	--gn-footer-icon-border: #d7d7d7;
	--gn-footer-on-brand: #fff;
	--gn-footer-copyright: #a6a6a6;
	--gn-footer-font: "Zen Maru Gothic", "Noto Sans Japanese", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	--gn-footer-font-size: 14px;
	--gn-footer-font-size-icon: 13px;
	--gn-footer-font-size-formal: 12px;
	--gn-footer-font-size-copyright: 10px;
	--gn-footer-font-weight: 500;
	--gn-footer-font-weight-bold: 700;
	--gn-footer-line-height: 1.55;
	--gn-footer-letter-spacing: 0.04em;
	--gn-footer-letter-spacing-copyright: 0.03em;
	--gn-footer-content-width-mobile: 375px;
	--gn-footer-content-width-wide: 450px;
	--gn-footer-content-width-pc: 1200px;
	--gn-footer-content-gutter-pc: 40px;
	--gn-footer-column-gap-pc: 28px;
	--gn-footer-row-gap-pc: 32px;
	--gn-footer-content-padding-pc: 28px;
	--gn-footer-content-padding-pc-wide: 32px var(--gn-footer-content-gutter-pc) 28px;
	--gn-footer-section-padding-pc: 24px;
	--gn-footer-content-padding-bottom: 22px;
	--gn-footer-content-padding: 24px 16px var(--gn-footer-content-padding-bottom);
	--gn-footer-content-padding-wide: 24px 28px var(--gn-footer-content-padding-bottom);
	--gn-footer-dock-clearance: 64px;
	--gn-footer-logo-width: 180px;
	--gn-footer-logo-gap: 38px;
	--gn-footer-primary-gap: 28px;
	--gn-footer-section-gap: 30px;
	--gn-footer-section-padding: 44px;
	--gn-footer-row-height: 48px;
	--gn-footer-brand-row-height: 48px;
	--gn-footer-formal-row-height: 33px;
	--gn-footer-radius: 4px;
	--gn-footer-rule-width: 1px;
	--gn-footer-focus-width: 2px;
	--gn-footer-pattern-position: 0 0, 0 15px, 15px -15px, -15px 0;
	--gn-footer-pattern-size: 30px 30px;
	--gn-footer-hover-opacity: 0.72;
	--gn-footer-focus-offset: -3px;
	--gn-footer-link-indent: 23px;
	--gn-footer-heading-height: 24px;
	--gn-footer-arrow-size: 18px;
	--gn-footer-arrow-gap: 8px;
	--gn-footer-heading-gap: 10px;
	--gn-footer-menu-row-padding: 14px 23px 13px;
	--gn-footer-shop-indent: 42px;
	--gn-footer-shop-icon-left: 22px;
	--gn-footer-shop-icon-size: 12px;
	--gn-footer-menu-arrow-width: 5px;
	--gn-footer-menu-arrow-height: 7px;
	--gn-footer-child-indent: 43px;
	--gn-footer-brand-gap: 6px;
	--gn-footer-brand-padding: 14px 38px 13px 22px;
	--gn-footer-social-icon-size: 20px;
	--gn-footer-social-link-padding: 14px 38px 13px 50px;
	--gn-footer-social-icon-left: 20px;
	--gn-footer-external-icon-size: 7px;
	--gn-footer-formal-gap: 7px 9px;
	--gn-footer-formal-margin: 18px;
	--gn-footer-formal-padding: 6px 24px 6px 10px;
	--gn-footer-company-gap: 10px;
	--gn-footer-company-margin: 30px;
	--gn-footer-company-padding: 20px;
	--gn-footer-company-indent: 13px;
	--gn-footer-copyright-margin: 30px;
	box-sizing: border-box;
	background: var(--gn-footer-page-background);
	color: var(--gn-footer-text);
	font-family: var(--gn-footer-font);
	font-size: var(--gn-footer-font-size);
	font-weight: var(--gn-footer-font-weight);
	letter-spacing: var(--gn-footer-letter-spacing);
	line-height: var(--gn-footer-line-height);
}

.gn-footer *,
.gn-footer *::before,
.gn-footer *::after {
	box-sizing: border-box;
}

.gn-footer a,
.gn-footer a:visited {
	color: inherit;
	text-decoration: none;
}

.gn-footer a:hover {
	opacity: var(--gn-footer-hover-opacity);
}

.gn-footer a:focus-visible {
	outline: var(--gn-footer-focus-width) solid currentColor;
	outline-offset: var(--gn-footer-focus-offset);
}

.gn-footer__inner {
	width: min(100%, var(--gn-footer-content-width-mobile));
	margin: 0 auto;
	padding: var(--gn-footer-content-padding);
	background-color: var(--gn-footer-background);
	background-image: conic-gradient(
		var(--gn-footer-pattern) 25%,
		transparent 0 50%,
		var(--gn-footer-pattern) 0 75%,
		transparent 0
	);
	background-position: 0 0;
	background-size: var(--gn-footer-pattern-size);
}

.gn-footer__logo {
	display: block;
	width: var(--gn-footer-logo-width);
	margin-bottom: var(--gn-footer-logo-gap);
}

.gn-footer__logo img {
	display: block;
	width: 100%;
	height: auto;
}

.gn-footer__primary-links {
	display: grid;
	gap: var(--gn-footer-primary-gap);
	margin-bottom: var(--gn-footer-section-gap);
}

.gn-footer__primary-heading,
.gn-footer__menu a,
.gn-footer__company-links a {
	position: relative;
	display: block;
	padding-left: var(--gn-footer-link-indent);
}

.gn-footer__primary-heading {
	min-height: var(--gn-footer-heading-height);
	padding-left: 0;
	border-bottom: var(--gn-footer-rule-width) solid var(--gn-footer-border);
	font-weight: var(--gn-footer-font-weight-bold);
}

.gn-footer__primary-heading::after,
.gn-footer__heading-link::after,
.gn-footer__inline-arrow {
	display: inline-grid;
	width: var(--gn-footer-arrow-size);
	height: var(--gn-footer-arrow-size);
	margin-left: var(--gn-footer-arrow-gap);
	padding: 0 0 2px 1px;
	place-items: center;
	border: var(--gn-footer-rule-width) solid var(--gn-footer-icon-border);
	border-radius: 50%;
	background: var(--gn-footer-on-brand);
	content: "›";
	font-size: var(--gn-footer-font-size-icon);
	line-height: 1;
	vertical-align: middle;
}

.gn-footer__primary-heading--multiline::after {
	display: none;
}

.gn-footer__primary-heading-line {
	display: inline;
}

.gn-footer__menu a::before,
.gn-footer__company-links a::before {
	position: absolute;
	top: 50%;
	left: 8px;
	width: 0;
	height: 0;
	border-top: calc(var(--gn-footer-menu-arrow-height) / 2) solid transparent;
	border-bottom: calc(var(--gn-footer-menu-arrow-height) / 2) solid transparent;
	border-left: var(--gn-footer-menu-arrow-width) solid currentColor;
	content: "";
	transform: translateY(-50%);
}

.gn-footer__section {
	margin-top: var(--gn-footer-section-gap);
	padding-top: var(--gn-footer-section-padding);
	border-top: var(--gn-footer-rule-width) solid var(--gn-footer-divider);
}

.gn-footer__heading {
	margin: 0 0 var(--gn-footer-heading-gap);
	color: var(--gn-footer-muted);
	font-size: var(--gn-footer-font-size);
	font-weight: var(--gn-footer-font-weight);
}

.gn-footer__menu {
	border-top: var(--gn-footer-rule-width) solid var(--gn-footer-border);
}

.gn-footer__menu a {
	min-height: var(--gn-footer-row-height);
	padding: var(--gn-footer-menu-row-padding);
	border-bottom: var(--gn-footer-rule-width) solid var(--gn-footer-border);
	background: var(--gn-footer-surface);
}

.gn-footer__menu .gn-footer__shop-availability {
	padding-left: var(--gn-footer-shop-indent);
	background: var(--gn-footer-surface-strong);
}

.gn-footer__menu .gn-footer__shop-availability::before {
	width: var(--gn-footer-shop-icon-size);
	height: var(--gn-footer-shop-icon-size);
	left: var(--gn-footer-shop-icon-left);
	border: 0;
	background: currentColor;
	content: "";
	-webkit-mask: url("/img/footer/calendar.svg") center / contain no-repeat;
	mask: url("/img/footer/calendar.svg") center / contain no-repeat;
}

.gn-footer__menu .gn-footer__menu-child {
	padding-left: var(--gn-footer-child-indent);
}

.gn-footer__menu a.gn-footer__menu-child::before {
	left: 27px;
}

.gn-footer__brand-links {
	display: grid;
	gap: var(--gn-footer-brand-gap);
}

.gn-footer a.gn-footer__brand-link {
	position: relative;
	display: block;
	min-height: var(--gn-footer-brand-row-height);
	padding: var(--gn-footer-brand-padding);
	border-radius: var(--gn-footer-radius);
	background: var(--gn-footer-brand-surface);
	color: var(--gn-footer-on-brand);
}

.gn-footer__brand-link::after,
.gn-footer__social-link::after,
.gn-footer__formal-links a::after {
	position: absolute;
	top: 50%;
	right: 17px;
	width: var(--gn-footer-external-icon-size);
	height: var(--gn-footer-external-icon-size);
	border: var(--gn-footer-rule-width) solid currentColor;
	box-shadow: 2px -2px 0 -1px var(--gn-footer-brand-surface), 2px -2px 0 0 currentColor;
	content: "";
	transform: translateY(-50%);
}

.gn-footer__social-links {
	display: grid;
	gap: var(--gn-footer-brand-gap);
}

.gn-footer a.gn-footer__social-link {
	position: relative;
	display: flex;
	min-height: var(--gn-footer-brand-row-height);
	align-items: center;
	padding: var(--gn-footer-social-link-padding);
	border-radius: var(--gn-footer-radius);
	background: var(--gn-footer-brand-surface);
	color: var(--gn-footer-on-brand);
}

.gn-footer__social-icon {
	position: absolute;
	left: var(--gn-footer-social-icon-left);
	width: var(--gn-footer-social-icon-size);
	height: var(--gn-footer-social-icon-size);
	fill: none;
	stroke: var(--gn-footer-copyright);
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
}

.gn-footer__social-icon-fill {
	fill: var(--gn-footer-copyright);
	stroke: none;
}

.gn-footer__formal-links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gn-footer-formal-gap);
	margin-top: var(--gn-footer-formal-margin);
}

.gn-footer__formal-links a {
	position: relative;
	min-height: var(--gn-footer-formal-row-height);
	padding: var(--gn-footer-formal-padding);
	border: var(--gn-footer-rule-width) solid var(--gn-footer-border);
	border-radius: var(--gn-footer-radius);
	font-size: var(--gn-footer-font-size-formal);
}

.gn-footer__formal-links a::after {
	right: 7px;
	box-shadow: 2px -2px 0 -1px var(--gn-footer-background), 2px -2px 0 0 currentColor;
}

.gn-footer__company-links {
	display: grid;
	gap: var(--gn-footer-company-gap);
	margin-top: var(--gn-footer-company-margin);
	padding-top: var(--gn-footer-company-padding);
	border-top: var(--gn-footer-rule-width) solid var(--gn-footer-divider);
}

.gn-footer__company-links a {
	padding-left: var(--gn-footer-company-indent);
}

.gn-footer__company-links a::before {
	left: 0;
}

.gn-footer__copyright {
	margin: var(--gn-footer-copyright-margin) 0 0;
	color: var(--gn-footer-copyright);
	font-size: var(--gn-footer-font-size-copyright);
	letter-spacing: var(--gn-footer-letter-spacing-copyright);
	text-align: center;
}

@media screen and (min-width: 768px) {
	.gn-footer__inner {
		width: var(--gn-sp-view-width, var(--gn-footer-content-width-wide));
		padding: var(--gn-footer-content-padding-wide);
	}

	body:not(.gn-sp-view) .gn-footer {
		background-color: var(--gn-footer-background);
	}

	body:not(.gn-sp-view) .gn-footer__inner {
		width: min(
			calc(100% - (var(--gn-footer-content-gutter-pc) * 2)),
			var(--gn-footer-content-width-pc)
		);
		padding: var(--gn-footer-content-padding-pc);
		background-image: none;
	}

	body:not(.gn-sp-view) .gn-footer__brand-link {
		word-break: keep-all;
	}

	body:not(.gn-sp-view) .gn-footer__navigation {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--gn-footer-row-gap-pc) var(--gn-footer-column-gap-pc);
	}

	body:not(.gn-sp-view) .gn-footer__primary-links {
		grid-column: 1 / -1;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin-bottom: 0;
	}

	body:not(.gn-sp-view) .gn-footer__section,
	body:not(.gn-sp-view) .gn-footer__company-links {
		margin-top: 0;
		padding-top: var(--gn-footer-section-padding-pc);
	}

	body:not(.gn-sp-view) .gn-footer__company-links {
		align-self: start;
	}

	body:not(.gn-sp-view) .gn-footer__copyright {
		margin-top: var(--gn-footer-row-gap-pc);
	}
}

@media screen and (min-width: 1080px) {
	body:not(.gn-sp-view) .gn-footer__inner {
		padding: var(--gn-footer-content-padding-pc-wide);
	}

	body:not(.gn-sp-view) .gn-footer__navigation {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	body:not(.gn-sp-view) .gn-footer__primary-links {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media screen and (max-width: 480px) {
	.gn-footer {
		--gn-footer-dock-clearance: 47px;
	}
}

@media screen and (max-width: 1079px) {
	.gn-footer__inner {
		padding-bottom: calc(
			var(--gn-footer-content-padding-bottom) + var(--gn-footer-dock-clearance) + env(safe-area-inset-bottom)
		);
	}
}
