@charset "utf-8";

*,*::before,*::after{box-sizing:border-box;}
:where(ul,ol){list-style:none;padding:0;}
:where(img,svg,video,canvas,iframe){vertical-align:middle;}
:where(img[height],video[height],picture img){height:auto;}
:where(input,button,textarea,select,small){font:inherit;}
:where(body,h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl,dd){margin:0;}
:where(img,picture,video,iframe){display:inline-block;max-width:100%;}
:where(a){color:inherit;text-decoration:inherit;text-decoration-skip-ink:auto;}
:where(button){-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background:none;}
:where(sub){vertical-align:baseline;}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}}

:root {
	--themecolor: #d60000;
	--themegrad: linear-gradient(to top, #981b16, 15%, #de3b3b);
	--themegrad_lr: linear-gradient(to right, #981b16, 15%, #de3b3b);
	--themegrad_rl: linear-gradient(to left, #981b16, 15%, #de3b3b);
	--bggray: #e9e9e9;
	--bordergray: #d7d7d7;
	--black: #505050;
	--green: #20a200;
	--blue: #06acbe;
	--purple: #ab0080;
	
	--fonts: "Work Sans", "Zen Kaku Gothic New", sans-serif;
	--fontJa: "Zen Kaku Gothic New", sans-serif;
	--fontEn: "Work Sans", sans-serif;
	
	--easeIn: cubic-bezier(.3,0,.7,0);
	--easeOut: cubic-bezier(.3,1,.7,1);
	--easeInOut: cubic-bezier(.7,0,.3,1);
	--easeBack: cubic-bezier(.2,1.6,.6,1);
	--easeGraph: cubic-bezier(.5,.1,.1,1);
	
	--radius: clamp(4px, 10vw / 7.68, 10px);
	--radius_b: clamp(5px, 11vw / 7.68, 11px);
	
	--sidegap: clamp(16px, 40vw / 12, 40px);
	--breakout: calc(50% - 50vw);
	--contentwidth: calc(100% - var(--sidegap) * 2);
	--scrollBarWidth: 0;
	
	--header: clamp(48px, 60vw / 7.68, 60px);
}
.has-scrollbar {
	--breakout: calc(50% - 50vw + var(--scrollBarWidth) / 2);
}
html {
	overflow: hidden auto;
	-webkit-text-size-adjust: 100%;
}
body {
	overflow: hidden auto;
	overscroll-behavior: auto;
	color: #505050;
	font-size: clamp(.875em, 16vw / 3.75, 1em);
	line-height: 1.9375;
	font-family: var(--fontJa);
	font-weight: 400;
	letter-spacing: .08em;
	font-feature-settings: "palt";
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	background: white;
}
.is-touch {
	scroll-behavior: smooth;
}
.page-recruit {
	overflow: initial;
}
section[id] {
	scroll-margin-top: 100px;
}
@media screen and (max-width: 480px) {
	body {
		font-size: clamp(.75em, 16vw / 3.75, 1em);
	}
}

/**
 * mediaquery について
 * default style (Desktop/Tablet/Mobile 共通の style)
 *
 * @media print, (min-width: 768px) {} Mobile には適用しない style (レイアウトは Desktop 仕様)
 *
 * @media print, (min-width: 1400px) {} Desktop
 * @media screen and (max-width: 1080px) {} Tablet
 *
 * @media screen and (max-width: 767px) {} Desktop には適用しない style (レイアウトは Mobile 仕様)
 * @media screen and (max-width: 480px) {} Mobile (ここから font-size が Mobile 仕様になる)
 * @media screen and (max-width: 359px) {}
 *
 * MEMO: 1080~768 は極力リキッド (iPad は縦でも横でも同じ見え方になるように)
 *
 * font-size のルール
 * default: 1080px から Desktop 仕様でリキッド (最小サイズは Mobile 仕様サイズ)
 * clamp( 1.5rem, 30vw / 10.8, 1.875rem )
 *
 * @media screen and (max-width: 767px) {} Mobile 仕様でリキッド (最小サイズを指定する場合は max)
 * calc( 24vw / 3.75 ) || max( 24vw / 3.75, 1.5rem )
 * -------------------------------------------------- */
.l-header .drawer { z-index: 4; }
.l-header .links,
.l-header .logo { z-index: 3; }
.l-menu { z-index: 3; }
.l-footer { z-index: 1; }


/**
 * Header
 * ---------------------------------------- */
.l-header {
	pointer-events: none;
	top: 0;
	left: 0;
	width: 100%;
	padding-left: var(--sidegap);
}
.l-header > * {
	pointer-events: auto;
}
.page-home .l-header {
	grid-template-columns: 1fr 232px 1fr;
}
.page-home .l-header a {
	display: block;
}

/* :::::: Logo :::::: */
.l-header .logo {
	display: flex;
	align-items: center;
	position: fixed;
	top: 0;
	left: var(--sidegap);
	height: var(--header);
	line-height: 0;
}
.l-header .logo a {
	display: block;
}
.l-header .logo img {
	width: 232px;
}

@media screen and (max-width: 767px) {
	.l-header .logo {
		left: calc(50% - 97px);
		width: 194px;
	}
}

/* :::::: Links :::::: */
.l-header .links {
	display: grid;
	grid-template-columns: auto auto;
	align-items: center;
	gap: 1em;
	position: fixed;
	top: var(--header);
	right: 0;
	width: var(--header);
	margin-top: 1em;
	font-weight: 500;
	writing-mode: vertical-rl;
	white-space: nowrap;
	letter-spacing: .18em;
}
.l-header .links * {
	width: 100%;
}
.l-header .links a {
	display: flex;
	align-items: center;
	padding: .2em 0;
	background: linear-gradient(currentcolor, currentcolor) right calc(var(--header) / 2 - 1em) top / 1px 100% no-repeat;
}
.l-header .links .item .ico {
	margin-top: .2em;
}

@media (hover) {
	.l-header .links a {
		transition: background-size .4s var(--easeOut);
	}
	.l-header .links a:hover {
		background-position: right calc(var(--header) / 2 - 1em) bottom;
		background-size: 1px 0;
		transition-duration: .2s;
	}
}
@media screen and (max-width: 767px) {
	.l-header .links {
		/* display: none; */
	}
}

/* :::::: Drawer :::::: */
.l-header .drawer {
	--bar: clamp(24px, 32vw / 7.68, 32px);
	cursor: pointer;
	position: fixed;
	top: 0;
	right: 0;
	width: var(--header);
	height: var(--header);
	margin-left: auto;
	background: black;
}
.l-header .drawer .bar {
	position: absolute;
	top: calc(50% - 2.5px);
	left: calc(var(--header) / 2 - var(--bar) / 2);
	width: var(--bar);
	fill: none;
	stroke: white;
	stroke-width: 2;
	stroke-dasharray: var(--bar) var(--bar);
	/* MEMO: Safari14 以下で stroke-dasharray に変数が適用されないみたい */
	stroke-dasharray: clamp(24px, 32vw / 7.68, 32px) clamp(24px, 32vw / 7.68, 32px);
	stroke-dashoffset: calc(var(--dash) - var(--bar));
}
.l-header .drawer .bar.-b1 {
	--dash: calc(var(--bar) * 3);
	transform: translateY(calc(var(--bar) / -3));
}
.l-header .drawer .bar.-b2 {
	--dash: calc(var(--bar) * 2.75);
}
.l-header .drawer .bar.-b3 {
	--dash: calc(var(--bar) * 2.5);
	transform: translateY(calc(var(--bar) / 3));
}
.l-header .drawer .bar.-b4 {
	transform: rotate(45deg);
}
.l-header .drawer .bar.-b5 {
	transform: rotate(135deg);
}
.l-header .drawer .bar.-b4,
.l-header .drawer .bar.-b5 {
	--dash: var(--bar);
	stroke-dashoffset: calc(var(--bar) * 3);
}

@media (hover) {
	.l-header .drawer .bar.-b1,
	.l-header .drawer .bar.-b2,
	.l-header .drawer .bar.-b3 {
		transition: stroke-dashoffset .4s var(--easeOut);
	}
	.l-header .drawer:not(:hover) .bar.-b1 {
		transition-delay: .1s;
	}
	.l-header .drawer .bar.-b2 {
		transition-delay: .05s;
	}
	.l-header .drawer:hover .bar.-b1 {
		stroke-dashoffset: calc(var(--bar) * .5);
	}
	.l-header .drawer:hover .bar.-b2 {
		stroke-dashoffset: calc(var(--bar) * .25);
	}
	.l-header .drawer:hover .bar.-b3 {
		stroke-dashoffset: 0;
		transition-delay: .1s;
	}
}

.l-header .drawer.is-active .bar.-b1,
.l-header .drawer.is-active .bar.-b2,
.l-header .drawer.is-active .bar.-b3 {
	stroke-dashoffset: var(--bar);
	transition: none;
}
.l-header .drawer.is-anim .bar.-b1,
.l-header .drawer.is-anim .bar.-b2,
.l-header .drawer.is-anim .bar.-b3 {
	transition: stroke-dashoffset .4s var(--easeOut);
}
.l-header .drawer:not(.is-active).is-anim .bar.-b1 { transition-delay: .25s; }
.l-header .drawer:not(.is-active).is-anim .bar.-b2 { transition-delay: .3s; }
.l-header .drawer:not(.is-active).is-anim .bar.-b3 { transition-delay: .35s; }

.l-header .drawer.is-active .bar.-b4,
.l-header .drawer.is-active .bar.-b5 {
	stroke-dashoffset: calc(var(--bar) * 2);
}
.l-header .drawer:not(.is-active).is-anim .bar.-b4,
.l-header .drawer:not(.is-active).is-anim .bar.-b5 {
	stroke-dashoffset: var(--bar);
}
.l-header .drawer.is-anim .bar.-b4,
.l-header .drawer.is-anim .bar.-b5 {
	transition: stroke-dashoffset .4s var(--easeOut);
}
.l-header .drawer.is-anim .bar.-b4 { transition-delay: .05s; }
.l-header .drawer.is-anim.is-active .bar.-b4 { transition-delay: .25s; }
.l-header .drawer.is-anim.is-active .bar.-b5 { transition-delay: .3s; }


/**
 * Drawer menu
 * ---------------------------------------- */
.l-menu,
.l-menu .overlay {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
}
.l-menu {
	display: grid;
	justify-content: center;
	overflow: hidden auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

/* Scrollbar */
.l-menu {
	scrollbar-width: none;
	scrollbar-color: transparent;
}
.l-menu::-webkit-scrollbar {
	width: 0;
	height: 0;
}
.l-menu::-webkit-scrollbar-thumb {
	background: transparent;
}
.l-menu::-webkit-scrollbar-track {
	background: transparent;
}

/* :::::: Overlay :::::: */
.l-menu .overlay {
	overflow: hidden;
	background: white;
}
.l-menu .overlay::before,
.l-menu .overlay::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--bggray);
	opacity: .5;
}
.l-menu .overlay::before {
	clip-path: polygon(0 0, 30% 0, 100% 60%, 100% 100%, 40% 100%, 0 25%);
}
.l-menu .overlay::after {
	clip-path: polygon(100% 0, 40% 100%, 0 100%, 0 50%);
}

/* :::::: Container :::::: */
.l-menu .container {
	position: relative;
	padding: 20vh var(--sidegap);
}

/* Animation */
.l-menu:not(.is-active) {
	pointer-events: none;
	visibility: hidden;
}
.l-menu .container {
	z-index: 1;
}
.l-menu .overlay:not(.is-active),
.l-menu .container:not(.is-active) {
	opacity: 0;
}
.l-menu .overlay.is-anim,
.l-menu .container.is-anim {
	transition: opacity .4s;
	will-change: opacity;
	backface-visibility: hidden;
}
.l-menu .overlay.is-anim:not(.is-active),
.l-menu .container.is-anim.is-active {
	transition-delay: .2s;
}

@media screen and (max-width: 767px) {
	.l-menu .container {
		padding: calc(44vw / 3.75);
	}
}

/* :::::: Menu :::::: */
.l-menu .menu > .item + .item {
	margin-top: 1em;
}
.l-menu .menu a {
	display: inline-block;
	padding: .2em;
}
.l-menu .menu a[aria-current="page"] {
	pointer-events: none;
	color: var(--themecolor);
}
.l-menu .menu .-comingsoon {
	/* pointer-events: none; */
}
.l-menu .menu .-comingsoon a {
	color: silver;
}
.l-menu .menu .label {
	font-size: 1.375rem;
	font-family: var(--fontEn);
	font-weight: 500;
}
.l-menu .menu .sub {
	padding-left: 1em;
	font-size: 1rem;
	font-weight: 500;
	letter-spacing: .14em;
}
.l-menu .menu .ico {
	pointer-events: auto;
	width: .8em;
	height: .8em;
	margin: -.1em 0 0 .3em;
	padding: .15em;
	border: 1px solid currentcolor;
	border-radius: 1em;
	line-height: 0;
	vertical-align: middle;
}
.l-menu .menu .children {
	padding: .2em .2em .2em 1em;
}
.l-menu .menu .children .item {
	line-height: 1.4;
}
.l-menu .menu .children .label {
	font-size: 1rem;
}
.l-menu .menu .children .sub {
	padding-left: .3em;
	font-size: .875rem;
}

@media screen and (max-width: 767px) {
	.l-menu .menu > .item > a > .sub {
		display: none;
	}
	.l-menu .menu .children a {
		display: flex;
	}
}
@media screen and (max-width: 480px) {
	.l-menu .menu .label {
		font-size: 1rem;
	}
	.l-menu .menu .sub {
		font-size: .75rem;
	}
	.l-menu .menu .children .label {
		font-size: .875rem;
	}
	.l-menu .menu .children .sub {
		font-size: .75rem;
	}
}
@media (hover) {
	.l-menu .menu a[href] {
		transition: color .4s;
	}
	.l-menu .menu a[href]:hover {
		color: black;
		transition-duration: .2s;
	}
}
@media print, (min-width: 768px) and (hover) {
	/* Pulldown */
	.l-menu .menu:not(.is-accordion) .children {
		display: grid;
		grid-template-rows: repeat(3, 0);
		overflow: hidden;
		transition: grid-template-rows .4s var(--easeOut);
	}
	.l-menu .menu:not(.is-accordion) .item:hover .children,
	.l-menu .menu:not(.is-accordion) .item:focus-visible .children,
	.l-menu .menu:not(.is-accordion) .item:focus-within .children {
		grid-template-rows: repeat(3, 2em);
	}
	.l-menu .menu:not(.is-accordion) .item.-interview .children { grid-template-rows: repeat(9, 0); }
	.l-menu .menu:not(.is-accordion) .item.-recruit .children { grid-template-rows: repeat(2, 0); }
	.l-menu .menu:not(.is-accordion) .item.-interview:hover .children,
	.l-menu .menu:not(.is-accordion) .item.-interview:focus-visible .children,
	.l-menu .menu:not(.is-accordion) .item.-interview:focus-within .children { grid-template-rows: repeat(9, 2em); }
	.l-menu .menu:not(.is-accordion) .item.-recruit:hover .children,
	.l-menu .menu:not(.is-accordion) .item.-recruit:focus-visible .children,
	.l-menu .menu:not(.is-accordion) .item.-recruit:focus-within .children { grid-template-rows: repeat(2, 2em); }
}

/* アコーディオンの時 */
.l-menu .menu.is-accordion > .item {
	clip-path: inset(-3px);
}
.l-menu .menu.is-accordion > .item.is-active .ico use {
	transform-origin: 50% 50%;
	transform: rotateX(180deg);
}
.l-menu .menu.is-accordion > .item.is-anim {
	transition: height .4s var(--easeOut);
}
.l-menu .menu.is-accordion > .item.is-anim .ico use {
	transition: transform .4s var(--easeOut);
}
.l-menu .menu.is-accordion > .item.is-anim.is-active,
.l-menu .menu.is-accordion > .item.is-anim.is-active .ico use {
	transition-timing-function: var(--easeInOut);
}

/* :::::: Links :::::: */
.l-menu .links {
	margin-top: 40px;
	grid-area: 2 / 2;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	justify-self: center;
	gap: 32px;
	font-size: .875rem;
	line-height: 1.2;
	font-weight: 700;
	white-space: nowrap;
	text-align: center;
}
.l-menu .links a {
	display: grid;
	place-items: center;
	height: 3.2em;
	padding: .2em 1em;
	border: 1px solid currentcolor;
	border-radius: 2em;
}
.l-menu .links .-loyalty a {
	letter-spacing: -.1em;
}
.l-menu .links .-recruit a {
	z-index: 0;
	position: relative;
	color: white;
	border-color: var(--themecolor);
	background: none;
}
.l-menu .links .-recruit a::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background: var(--themegrad);
}

@media (hover) {
	.l-menu .links .-loyalty a {
		transition: color .4s, background .4s;
	}
	.l-menu .links .-recruit a {
		transition: color .4s;
	}
	.l-menu .links .-recruit a::before {
		transition: opacity .4s;
	}
	.l-menu .links .-loyalty a:hover {
		color: white;
		background: #505050;
		transition-duration: .2s;
	}
	.l-menu .links .-recruit a:hover {
		color: var(--themecolor);
		transition-duration: .2s;
	}
	.l-menu .links .-recruit a:hover::before {
		opacity: 0;
		transition-duration: .2s;
	}
}
@media print, (min-width: 768px) {
	.l-menu .links a {
		min-width: 144px;
	}
}
@media screen and (max-width: 767px) {
	.l-menu .links {
		grid-template-columns: repeat(2, 1fr);
		gap: calc(12vw / 3.75);
	}
	.l-menu .links a {
		height: 48px;
	}
}
@media screen and (max-width: 480px) {
	.l-menu .links {
		font-size: .75rem;
	}
}


/**
 * Main
 * ---------------------------------------- */
.l-main {
	position: relative;
	min-height: 100dvh;
	padding-top: var(--header);
}


/**
 * Footer
 * ---------------------------------------- */
.l-footer {
	display: grid;
	grid-template-columns: 280px auto;
	justify-content: space-between;
	align-items: end;
	gap: 24px;
	box-sizing: content-box;
	position: relative;
	max-width: 1080px;
	margin: 0 auto;
	padding: 104px var(--sidegap) 24px;
	border-image: linear-gradient(#ccc9c9, #ccc9c9) 0 fill / 0 / 0 50vw;
}
:where(body:not(.page-home)) .l-footer {
	margin-top: clamp(80px, 144vw / 10.8, 144px);
}
.l-footer .logo {
	grid-area: 1 / 1 / 3 / 2;
}
.l-footer .sitemap {
	grid-area: 1 / 2;
}
.l-footer .links {
	grid-area: 2 / 2;
}
.l-footer .award_lineup,
.l-footer .privacypolicy,
.l-footer .copyright {
	grid-column: 1 / 3;
}

@media screen and (max-width: 1199px) {
	.l-footer {
		grid-template-columns: max(280vw / 12, 235px) auto;
	}
}
@media screen and (max-width: 1279px) {
	.l-footer {
		grid-template: auto auto / auto;
		justify-content: center;
		justify-items: center;
		text-align: center;
	}
	.l-footer .logo {
		grid-area: 1 / 1;
	}
	.l-footer .sitemap {
		grid-area: 2 / 1;
	}
	.l-footer .links {
		grid-area: 3 / 1;
	}
	.l-footer .award_lineup,
	.l-footer .privacypolicy,
	.l-footer .copyright {
		grid-column: 1;
	}
}
@media screen and (max-width: 767px) {
	.l-footer {
		justify-items: inherit;
		text-align: inherit;
		padding-top: calc(40vw / 3.75);
	}
}

/* :::::: Pagetop :::::: */
.pin-spacer {
	pointer-events: none;
}
.pin-spacer > * {
	pointer-events: auto;
}
.pagetop {
	pointer-events: auto;
	z-index: 1;
	position: absolute;
	top: 40px;
	right: calc(var(--breakout) + var(--sidegap));
	font-size: clamp(1rem, 21vw / 4.8, 1.3125rem);
	font-family: var(--fontEn);
	font-weight: 500;
	writing-mode: vertical-rl;
	white-space: nowrap;
	letter-spacing: .1em;
}
.pagetop .t {
	display: flex;
	align-items: center;
	gap: .2em;
	transform: rotate(180deg);
}
.pagetop .ico {
	transform: scale(-1);
}

@media screen and (max-width: 767px) {
	.pagetop {
		right: var(--sidegap);
	}
}

/* :::::: Logo :::::: */
.l-footer .logo {
	width: 100%;
	max-width: 280px;
}
.l-footer .logo a {
	display: block;
	padding: .5em 0;
}
.l-footer .logo img {
	width: 100%;
}

@media screen and (max-width: 480px) {
	.l-footer .logo {
		max-width: 235px;
	}
}

/* :::::: Sitemap :::::: */
.l-footer .sitemap {
	font-size: .875rem;
	font-family: var(--fonts);
}
.l-footer .sitemap .item {
	position: relative;
}
.l-footer .sitemap .-comingsoon {
	/* pointer-events: none; */
}
.l-footer .sitemap .item .sub {
	margin-left: .3em;
}
.l-footer .sitemap a {
	display: block;
	padding: .5em .96rem;
}
.l-footer .sitemap .-comingsoon a {
	color: darkgray;
}
.l-footer .sitemap > .item > a {
	min-width: 4.8em;
}
.l-footer .sitemap .ico {
	width: .8em;
	height: .8em;
	margin: -.1em 0 0 .3em;
	padding: .15em;
	border: 1px solid currentcolor;
	border-radius: 1em;
	line-height: 0;
	vertical-align: middle;
}
.l-footer .sitemap .children {
	font-size: 80%;
	text-align: left;
}
.l-footer .menu .children .item {
	line-height: 1.4;
}
.l-footer .sitemap .children a {
	padding-block: .2em;
}
/* footer は下層表示しない */
.l-footer .sitemap > .item > a > .sub {
	display: none;
}

@media print, (min-width: 768px) {
	.l-footer .sitemap {
		justify-self: center;
		display: flex;
		white-space: nowrap;
	}
	.is-touch .l-footer .sitemap .children {
		display: none;
	}
}
@media screen and (max-width: 1080px) {
	.l-footer .sitemap {
		font-size: 1rem;
	}
}
@media screen and (max-width: 767px) {
	.l-footer .sitemap {
		font-size: 1.125rem;
	}
	.l-footer .sitemap > .item + .item {
		margin-top: .5em;
	}
	.l-footer .sitemap > .item > a {
		padding-left: 0;
	}
	.l-footer .sitemap .children a {
		display: flex;
	}
}
@media screen and (max-width: 480px) {
	.l-footer .sitemap {
		font-size: .875rem;
	}
	.l-footer .sitemap a {
		padding-block: .2em;
	}
	.l-footer .sitemap .label {
		font-size: 1rem;
	}
	.l-footer .sitemap .sub {
		font-size: .75rem;
	}
	.l-footer .sitemap .children a {
		padding-block: 0;
	}
	.l-footer .sitemap .children .label {
		font-size: .875rem;
	}
	.l-footer .sitemap .children .sub {
		font-size: .75rem;
	}
}
@media (hover) {
	.l-footer .sitemap a[href] {
		transition: color .4s;
	}
	.l-footer .sitemap a[href]:hover {
		color: black;
		transition-duration: .2s;
	}
}
@media print, (min-width: 768px) and (hover) {
	/* Pulldown */
	.l-footer .sitemap .children {
		transition: opacity .4s, transform .4s var(--easeOut);
	}
	.l-footer .sitemap .children {
		position: absolute;
		bottom: 100%;
		left: 0;
	}
	.l-footer .sitemap .item .children {
		pointer-events: none;
		opacity: 0;
		transform: translateY(1em);
	}
	.l-footer .sitemap .item:hover .children,
	.l-footer .sitemap .item:focus-visible .children,
	.l-footer .sitemap .item:focus-within .children {
		pointer-events: auto;
		opacity: initial;
		transform: none;
		transition-duration: .2s;
	}
}

/* :::::: Links :::::: */
.l-footer .links {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: min(32vw / 12, 32px);
	font-size: .875rem;
	line-height: 1.2;
	font-weight: 700;
	white-space: nowrap;
	text-align: center;
}
.l-footer .links a {
	display: grid;
	place-content: center;
	place-items: center;
	height: 3.2em;
	padding: .2em 1em;
	border: 1px solid #505050;
	border-radius: 2em;
}
.l-footer .links .-loyalty a {
	letter-spacing: -.1em;
}
.l-footer .links .-recruit a {
	z-index: 0;
	position: relative;
	color: white;
	border-color: var(--themecolor);
	background: none;
}
.l-footer .links .-recruit a::before {
	content: "";
	z-index: -1;
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background: var(--themegrad);
}

@media (hover) {
	.l-footer .links .-loyalty a {
		transition: color .4s, background .4s;
	}
	.l-footer .links .-recruit a {
		transition: color .4s;
	}
	.l-footer .links .-recruit a::before {
		transition: opacity .4s;
	}
	.l-footer .links .-loyalty a:hover {
		color: white;
		background: #505050;
		transition-duration: .2s;
	}
	.l-footer .links .-recruit a:hover {
		color: var(--themecolor);
		transition-duration: .2s;
	}
	.l-footer .links .-recruit a:hover::before {
		opacity: 0;
		transition-duration: .2s;
	}
}
@media print, (min-width: 768px) {
	.l-footer .links {
		justify-self: center;
	}
	.l-footer .links a {
		min-width: 144px;
	}
}
@media screen and (max-width: 767px) {
	.l-footer .links {
		grid-template-columns: repeat(2, 1fr);
		gap: calc(12vw / 3.75);
		margin-top: 1em;
	}
	.l-footer .links a {
		height: 48px;
	}
}
@media screen and (max-width: 480px) {
	.l-footer .links {
		font-size: .75rem;
	}
}

/* :::::: Privacy Policy :::::: */
.l-footer .privacypolicy {
	margin-top: 1em;
	font-size: .75rem;
	font-family: var(--fontEn);
	text-align: center;
}
.l-footer .award_lineup + .privacypolicy {
	margin-top: 80px;
}

/* :::::: Copyright :::::: */
.l-footer .copyright {
	margin-top: 0;
	font-size: .75rem;
	font-family: var(--fontEn);
	text-align: center;
}

@media screen and (max-width: 767px) {
	.l-footer .copyright {
		margin-top: 1em;
	}
}

/* :::::: Award lineup :::::: */
.award_lineup {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: min(48vw / 10.8, 48px);
}
.award_lineup [width="444"] { width: min(444 * .5vw / 10.8, 444 * .5px); }
.award_lineup [width="352"] { width: min(352 * .5vw / 10.8, 352 * .5px); }
.award_lineup [width="376"] { width: min(376 * .5vw / 10.8, 376 * .5px); }
.award_lineup [width="370"] { width: min(370 * .5vw / 10.8, 370 * .5px); }
@media screen and (max-width: 767px) {
	.award_lineup {
		gap: calc(24vw / 3.75);
	}
	.award_lineup [width="444"] { width: calc(444 * .25vw / 3.75); }
	.award_lineup [width="352"] { width: calc(352 * .25vw / 3.75); }
	.award_lineup [width="376"] { width: calc(376 * .25vw / 3.75); }
	.award_lineup [width="370"] { width: calc(370 * .25vw / 3.75); }
}
.l-main .award_lineup {
	margin-top: 0;
	padding-bottom: 200px;
}
@media screen and (max-width: 767px) {
	.l-main .award_lineup {
		padding-bottom: calc(40vw / 3.75);
	}
}
.l-footer .award_lineup {
	margin-top: 24px;
}
.l-footer .award_lineup [width="444"] { width: min(444 * .25vw / 10.8, 444 * .25px); }
.l-footer .award_lineup [width="352"] { width: min(352 * .25vw / 10.8, 352 * .25px); }
.l-footer .award_lineup [width="376"] { width: min(376 * .25vw / 10.8, 376 * .25px); }
.l-footer .award_lineup [width="370"] { width: min(370 * .25vw / 10.8, 370 * .25px); }
@media screen and (max-width: 767px) {
	.l-footer .award_lineup [width="444"] { width: calc(444 * .15vw / 3.75); }
	.l-footer .award_lineup [width="352"] { width: calc(352 * .15vw / 3.75); }
	.l-footer .award_lineup [width="376"] { width: calc(376 * .15vw / 3.75); }
	.l-footer .award_lineup [width="370"] { width: calc(370 * .15vw / 3.75); }
}
.l-footer .award_lineup + .copyright {
	grid-row: 5;
	margin-top: 40px;
}


/**
 * Utility / JavaScript
 * -------------------------------------------------- */
.is-smooth .js-sc-wrapper {
	position: fixed;
	inset: 0;
	width: 100%;
}
.is-smooth .js-sc-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	backface-visibility: hidden;
	will-change: transform;
}
/* .has-scrollbar .is-smooth .js-sc-container {
	overflow-y: scroll;
} */
.js-underlay {
	pointer-events: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.u-visuallyhidden {
	position: absolute;
	top: 0;
	left: 0;
	clip: rect(0 0 0 0);
	overflow: hidden;
	width: 1px;
	height: 1px;
}
@media print, (min-width: 768px) {
	.u-md {
		display: none;
	}
}
.u-kng0 { letter-spacing: 0; }
.u-kng1 { letter-spacing: -.01em; }
.u-kng2 { letter-spacing: -.02em; }
.u-kng3 { letter-spacing: -.03em; }
.u-kng4 { letter-spacing: -.04em; }
.u-kng5 { letter-spacing: -.05em; }
.u-kng6 { letter-spacing: -.06em; }
.u-kng7 { letter-spacing: -.07em; }
.u-kng8 { letter-spacing: -.08em; }

@media (hover) {
	.cursor {
		--cursorSize: 4px;
		pointer-events: none;
		display: grid;
		place-items: center;
		z-index: 10;
		position: fixed;
		top: 0;
		left: 0;
		width: var(--cursorSize);
		height: var(--cursorSize);
		margin-top: calc(var(--cursorSize) / -2);
		margin-left: calc(var(--cursorSize) / -2);
		border-radius: var(--cursorSize);
		background: #d6000088;
		opacity: 0;
		transition: opacity .2s, --cursorSize .2s;
	}
	.cursor .arr {
		width: 50%;
		height: auto;
		margin-top: -5%;
		fill: white;
		stroke: white;
	}
	.cursor[data-on="link"] {
		--cursorSize: 32px;
		opacity: 1;
		transition-duration: .1s;
	}
	@property --cursorSize {
		syntax: "<length>";
		initial-value: 10px;
		inherits: false;
	}
}