@charset "utf-8";

/*-------------------------
共通css
---------------------------*/
.backgroundImage {
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	overflow: hidden;
	transition: .4s ease-out;
	pointer-events: none;
}
.backgroundImage figure {
	width: 100vw;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity .8s ease-out .4s;
}
.backgroundImage img,
.backgroundImage video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: relative;
	transition: filter .8s ease-out, transform .8s ease-out, opacity .8s ease-out;
}
.backgroundImage figure:nth-of-type(1),
.backgroundImage figure:nth-of-type(2),
.backgroundImage figure:nth-of-type(4),
.backgroundImage figure:nth-of-type(5),
.backgroundImage figure:nth-of-type(6),
.backgroundImage figure:nth-of-type(8) {
	background-color: #000;
}
.backgroundImage figure:nth-of-type(1),
.backgroundImage.scroll2 figure:nth-of-type(2),
.backgroundImage.scroll3 figure:nth-of-type(3),
.backgroundImage.scroll4 figure:nth-of-type(4),
.backgroundImage.scroll5 figure:nth-of-type(5),
.backgroundImage.scroll6 figure:nth-of-type(6),
.backgroundImage.scroll7 figure:nth-of-type(7),
.backgroundImage.scroll8 figure:nth-of-type(8) {
	opacity: 1;
}
.backgroundImage.scroll2 figure:nth-of-type(1) video,
.backgroundImage.scroll3 figure:nth-of-type(2) img,
.backgroundImage.scroll4 figure:nth-of-type(3) img,
.backgroundImage.scroll5 figure:nth-of-type(4) img,
.backgroundImage.scroll6 figure:nth-of-type(5) img,
.backgroundImage.scroll7 figure:nth-of-type(6) img,
.backgroundImage.scroll8 figure:nth-of-type(7) img {
	opacity: 0;
	-webkit-filter: blur(20px);
	filter: blur(20px);
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}
.backgroundImage.scroll9 {
	opacity: 0;
}
.text-glow {
	position: relative;
}
.text-glow > img,
.text-glow > p img {
	width: 100%;
	position: relative;
	z-index: 1;
}
.text-glow figure {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	-webkit-filter: blur(20px);
	filter: blur(20px);
}
a.text-glow:hover figure img {
	animation: hueRotate 1s linear infinite;
}
@keyframes hueRotate {
	from {
		-webkit-filter: hue-rotate(0deg);
		filter: hue-rotate(0deg);
	}
	to {
		-webkit-filter: hue-rotate(360deg);
		filter: hue-rotate(360deg);
	}
}
/*-------------------------
汎用css
---------------------------*/
.sp {
	display: none;
}
@media screen and (max-width: 640px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	span.sp {
		display: inline;
	}
}
.ib {
	display: inline-block;
	width: auto;
}
.ib-list .ib {
	margin-right: 1em;
}
a.ib:hover {
	color: var(--color-point);
}

/* box format */
.box-size {
	margin-right: auto;
	margin-left: auto;
}
.box-side {
	padding-right: 20px;
	padding-left: 20px;
}
.inner-padding {
	padding-top: 300px;
	padding-bottom: 300px;
}
.inner-padding-top {
	padding-top: 300px;
}
.size-320 {
	max-width: 320px;
}
.box-side.size-320 {
	max-width: 360px;
}
.size-380 {
	max-width: 380px;
}
.box-side.size-380 {
	max-width: 420px;
}
.size-580 {
	max-width: 580px;
}
.box-side.size-580 {
	max-width: 620px;
}
.size-600 {
	max-width: 600px;
}
.box-side.size-600 {
	max-width: 640px;
}
.size-620 {
	max-width: 620px;
}
.box-side.size-620 {
	max-width: 660px;
}
.size-680 {
	max-width: 680px;
}
.box-side.size-680 {
	max-width: 720px;
}
.size-705 {
	max-width: 705px;
}
.box-side.size-705 {
	max-width: 745px;
}
.size-940 {
	max-width: 940px;
}
.box-side.size-940 {
	max-width: 980px;
}
.size-1105 {
	max-width: 1105px;
}
.box-side.size-1105 {
	max-width: 1145px;
}
@media screen and (max-width: 640px) {
	.inner-padding {
		padding-top: 150px;
		padding-bottom: 150px;
	}
	.inner-padding-top {
		padding-top: 150px;
	}
}

/* flex box */
.flex-2-1 {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
.flex-4-2-1 {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	gap: 40px 20px;
}

.flex-2-1 > * {
	width: calc((100% - 20px) / 2);
}
.flex-4-2-1 > * {
	width: calc((100% - 60px) / 4);
}
@media screen and (max-width: 960px) {
	.flex-4-2-1 > * {
		width: calc((100% - 20px) / 2);
	}	
}
@media screen and (max-width: 640px) {
	.flex-2-1 > *,
	.flex-4-2-1 > * {
		width: 100%;
	}
}

/* List */
.d-list {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}
.d-list > dd {
	margin-bottom: 30px;
}
.d-list > dd:last-child {
	margin-bottom: 0;
}
.d-theme-4 > dt {
	width: 4em;
}
.d-theme-4 > dd {
	width: calc(100% - 4em);
	padding-left: 40px;
}
@media screen and (max-width: 640px) {
	.d-list {
		display: block;
	}
	.d-list dt {
		font-weight: 700;
	}
	.d-theme-4 dd {
		width: 100%;
		padding-left: 0;
	}
}

/* title */
h2.text-glow {
	margin: 0 auto;
}

/* font color */
.color-point {
	color: var(--color-point);
}
.color-light {
	color: #fff;
}

/* font family */
.font-ico {
	font-family: var(--font-ico);
}
.font-en {
	font-family: var(--font-en);
}

/* font size */
.font-size-s {
	font-size: .75rem !important; /* 12px */
}
.font-size-n {
	font-size: 1rem !important; /* 16px */
}
.font-size-l {
	font-size: 1.25rem !important; /* 20px */
}
.font-size-point {
	display: inline-block;
	padding: 0 .2em;
	transform-origin: center 70%;
	transform: scale(1.5);
}

/* font weight */
.font-weight-400 {
	font-weight: 400 !important;
}
.font-weight-500 {
	font-weight: 500 !important;
}
.font-weight-700 {
	font-weight: 700 !important;
}

/* text align */
.text-align-c {
	text-align: center;
}
.text-align-c-l,
.text-align-c-j {
	text-align: center;
}
.text-align-l-c {
	text-align: left;
}
.text-align-r {
	text-align: right;
}
@media screen and (max-width: 640px) {
	.text-align-c-l {
		text-align: left;
	}
	.text-align-c-j {
		text-align: justify;
	}
	.text-align-l-c {
		text-align: center;
	}
}

/* anchor */
.btn-cv {
	max-width: 320px;
	margin: 0 auto;
	position: relative;
}
.btn-cv a {
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
	background-color: #fff;
	height: 60px;
	font-size: 1.125rem;
	font-weight: 700;
	text-align: center;
	border-radius: 30px;
	position: relative;
	z-index: 2;
}
.btn-cv a::before,.btn-cv a::after {
	display: block;
	content: "";
	width: 12px;
	height: 8px;
	border: 1px solid #000;
	position: absolute;
	top: 26px;
	right: 20px;
}
.btn-cv a::after {
	border-top-width: 0;
	border-right-width: 0;
	top: 28px;
	right: 22px;
}
.btn-cv::after {
	display: block;
	content: "";
	background: var(--color-glow);
	width: 100%;
	height: 100%;
	border-radius: 30px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	-webkit-filter: blur(10px);
	filter: blur(10px);
}
.btn-cv:hover::after {
	animation: hueRotate 1s linear infinite;
}
@media (max-width: 640px) {
	.btn-cv {
		width: 100%;
		max-width: none;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 20;
	}
	.btn-cv a {
		border-radius: 0;
	}
	.btn-cv::after {
		display: none;
	}
}

/* list icon */
.ico-kome li {
	font-size: .875rem;
	padding-left: 1em;
	position: relative;
}
.ico-kome li span {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}

/* margin */
.mt20 {
	margin-top: 20px !important;
}
.mt30 {
	margin-top: 30px !important;
}
.mt40 {
	margin-top: 40px !important;
}
.mt60-40 {
	margin-top: 60px !important;
}
.mt80-40 {
	margin-top: 80px !important;
}
.mt120-60 {
	margin-top: 120px !important;
}
.mt150-60 {
	margin-top: 150px !important;
}
@media screen and (max-width: 640px) {
	.mt60-40,
	.mt80-40 {
		margin-top: 40px !important;
	}
	.mt120-60,
	.mt150-60 {
		margin-top: 60px !important;
	}
}

/*-------------------------
Map
---------------------------*/
.map {
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
}
.map-anchor a {
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
	background-color: #b3b4b4;
	color: #fff;
	width: 190px;
	height: 70px;
	border: 1px solid #b3b4b4;
	border-radius: 35px;
	position: relative;
}
.map-anchor a::after {
	display: block;
	content: url("../img/information/ico_blank.svg");
	width: 15px;
	margin-left: 10px;
	-webkit-filter: brightness(0) invert(1);
	filter: brightness(0) invert(1);
	transition: inherit;
}
.map-anchor a:hover {
	background-color: #fff;
	color: #b3b4b4;
}
.map-anchor a:hover::after {
	-webkit-filter: brightness(1) invert(0);
	filter: brightness(1) invert(0);
}
@media screen and (max-width: 640px) {
	.map {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		flex-direction: column;
	}
	.map-anchor {
		margin-top: 30px;
	}
}

/*-------------------------
Animaton
---------------------------*/
.setAnime,
.inView-in > * {
	transition-duration: 400ms;
}
.inView,
.inView-in > * {
	opacity: 0;
	-webkit-transform: translateY(30px);
	transform: translateY(30px);
}
.animated.inView,
.animated.inView-in > *{
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}
.inView-in > *:nth-of-type(2) {
	transition-delay: 200ms !important;
}
.inView-in > *:nth-of-type(3) {
	transition-delay: 400ms !important;
}
.inView-in > *:nth-of-type(4) {
	transition-delay: 600ms !important;
}
.inView-in > *:nth-of-type(5) {
	transition-delay: 800ms !important;
}
.inView-in > *:nth-of-type(6) {
	transition-delay: 1000ms !important;
}
.inView-in > *:nth-of-type(7) {
	transition-delay: 1200ms !important;
}
.inView-in > *:nth-of-type(8) {
	transition-delay: 1400ms !important;
}

/* delay */
.delay200-0 {
	transition-delay: 200ms !important;
}
.delay400-0 {
	transition-delay: 400ms !important;
}
.delay600-0 {
	transition-delay: 600ms !important;
}
@media screen and (max-width: 640px) {
	.delay200-0 {
		transition-delay: 0ms !important;
	}
	.delay400-0 {
		transition-delay: 0ms !important;
	}
	.delay600-0 {
		transition-delay: 0ms !important;
	}
}

/* heu */
.hue-rotate figure {
	animation: hueRotate 4s linear infinite;
}
@keyframes hueRotate {
	from {
		-webkit-filter: blur(10px) hue-rotate(0deg);
		filter: blur(10px) hue-rotate(0deg);
	}
	to {
		-webkit-filter: blur(10px) hue-rotate(360deg);
		filter: blur(10px) hue-rotate(360deg);
	}
}

/* Glitch */
.glitch {
	position: relative;
}
.glitch img {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.glitch img:nth-of-type(n + 2) {
	opacity: .3;
	z-index: 0;
}
.glitch img:nth-of-type(1) {
	position: relative;
	z-index: 1;
	animation: glitch-after 2s linear infinite alternate both;
}
.glitch img:nth-of-type(2) {
	animation: glitch-before 5s linear infinite alternate both;
}
.glitch img:nth-of-type(3) {
	filter: hue-rotate(290deg);
	animation: rgb-shift-r 1s steps(1, jump-end) infinite alternate both;
}
.glitch img:nth-of-type(4) {
	filter: hue-rotate(80deg);
	animation: rgb-shift-g 1.2s steps(1, jump-end) infinite alternate both;
}
.glitch img:nth-of-type(5) {
	filter: hue-rotate(160deg);
	animation: rgb-shift-b 1.4s steps(1, jump-end) infinite alternate both;
}
@keyframes glitch-before {
	0% {
		clip-path: polygon(0% 0.195635877%, 100% 0.195635877%, 100% 9.4348324631%, 0% 9.4348324631%);
		transform: translate(2.7853589525%, -0.2010732841%);
	}
	2% {
		clip-path: polygon(0% 31.8368846893%, 100% 31.8368846893%, 100% 33.5107671953%, 0% 33.5107671953%);
		transform: translate(-0.8779502486%, 0.3069691268%);
	}
	4% {
		clip-path: polygon(0% 26.0943527536%, 100% 26.0943527536%, 100% 32.348999845%, 0% 32.348999845%);
		transform: translate(1.5550504303%, 0.3220062107%);
	}
	6% {
		clip-path: polygon(0% 39.865503438%, 100% 39.865503438%, 100% 46.4268602391%, 0% 46.4268602391%);
		transform: translate(-4.1129439965%, 0.1611366315%);
	}
	8% {
		clip-path: polygon(0% 11.7081718526%, 100% 11.7081718526%, 100% 16.5177368039%, 0% 16.5177368039%);
		transform: translate(-4.5858373963%, -0.2470556375%);
	}
	10% {
		clip-path: polygon(0% 75.8422239901%, 100% 75.8422239901%, 100% 82.1506632512%, 0% 82.1506632512%);
		transform: translate(-1.4266259044%, -0.3269694058%);
	}
	12% {
		clip-path: polygon(0% 44.8960400439%, 100% 44.8960400439%, 100% 48.2044961841%, 0% 48.2044961841%);
		transform: translate(-2.0956528157%, -0.0437368848%);
	}
	14% {
		clip-path: polygon(0% 5.2708426428%, 100% 5.2708426428%, 100% 11.1968417662%, 0% 11.1968417662%);
		transform: translate(4.2190518482%, 0.4976763357%);
	}
	16% {
		clip-path: polygon(0% 60.3541079983%, 100% 60.3541079983%, 100% 68.066850951%, 0% 68.066850951%);
		transform: translate(5.4511256398%, -0.3818468489%);
	}
	18% {
		clip-path: polygon(0% 35.1408183708%, 100% 35.1408183708%, 100% 39.6902071237%, 0% 39.6902071237%);
		transform: translate(1.6228191775%, -0.0337925505%);
	}
	20%, 100% {
		clip-path: none;
		transform: none;
	}
}
@keyframes glitch-after {
	0% {
		clip-path: polygon(0% 15.0299696988%, 100% 15.0299696988%, 100% 18.5693732032%, 0% 18.5693732032%);
		transform: translate(-3.4124390213%, 0.0144473924%);
	}
	3% {
		clip-path: polygon(0% 15.452719825%, 100% 15.452719825%, 100% 22.2794971034%, 0% 22.2794971034%);
		transform: translate(-4.2181707413%, 0.4055929775%);
	}
	6% {
		clip-path: polygon(0% 76.6872633118%, 100% 76.6872633118%, 100% 83.8195833808%, 0% 83.8195833808%);
		transform: translate(-3.2894473145%, 0.0637578319%);
	}
	9% {
		clip-path: polygon(0% 22.8759341456%, 100% 22.8759341456%, 100% 31.9173450564%, 0% 31.9173450564%);
		transform: translate(4.4980018315%, 0.110343307%);
	}
	12% {
		clip-path: polygon(0% 48.8671104375%, 100% 48.8671104375%, 100% 51.5857612605%, 0% 51.5857612605%);
		transform: translate(-6.1095884455%, 0.2785609856%);
	}
	15% {
		clip-path: polygon(0% 19.9425231669%, 100% 19.9425231669%, 100% 22.9397150733%, 0% 22.9397150733%);
		transform: translate(7.661497078%, -0.1554533716%);
	}
	18% {
		clip-path: polygon(0% 14.642506704%, 100% 14.642506704%, 100% 22.5583430821%, 0% 22.5583430821%);
		transform: translate(6.1856614345%, -0.120519128%);
	}
	21% {
		clip-path: polygon(0% 30.6194633011%, 100% 30.6194633011%, 100% 32.7825303814%, 0% 32.7825303814%);
		transform: translate(-2.7776600904%, -0.2292312124%);
	}
	24% {
		clip-path: polygon(0% 53.1822449639%, 100% 53.1822449639%, 100% 56.3611642119%, 0% 56.3611642119%);
		transform: translate(-3.9783193253%, -0.1953074692%);
	}
	27% {
		clip-path: polygon(0% 77.6272146744%, 100% 77.6272146744%, 100% 85.9278586291%, 0% 85.9278586291%);
		transform: translate(0.6843730925%, 0.3422696082%);
	}
	30%, 100% {
		clip-path: none;
		transform: none;
	}
}
@keyframes rgb-shift-r {
	0% {
		transform: translate(-0.5976887365%, -0.379201877%);
	}
	4% {
		transform: translate(1.7439301774%, 0.3974938489%);
	}
	8% {
		transform: translate(-1.1178144474%, 0.2993780454%);
	}
	12% {
		transform: translate(0.8697892492%, -0.3338987448%);
	}
	16% {
		transform: translate(0.24095491%, 0.1180588286%);
	}
	20% {
		transform: translate(-1.0560192219%, 0.488690063%);
	}
	24% {
		transform: translate(0.9768431186%, 0.2034680804%);
	}
	28% {
		transform: translate(-0.1477124764%, -0.4931739852%);
	}
	32% {
		transform: translate(0.7658666488%, 0.0130653623%);
	}
	36% {
		transform: translate(-1.3671955575%, 0.0184138043%);
	}
	40%, 100% {
		transform: none;
	}
}
@keyframes rgb-shift-g {
	0% {
		transform: translate(0.52682986%, -0.4172543469%);
	}
	6% {
		transform: translate(-1.3354041016%, -0.4215177094%);
	}
	12% {
		transform: translate(-1.6276954835%, -0.1023525717%);
	}
	18% {
		transform: translate(0.348963209%, -0.382396349%);
	}
	24% {
		transform: translate(-1.7030717818%, -0.2214314592%);
	}
	30% {
		transform: translate(-0.5816840854%, 0.3888238097%);
	}
	36% {
		transform: translate(-1.7777581476%, 0.2594967111%);
	}
	42% {
		transform: translate(-0.2028895629%, 0.4911730647%);
	}
	48% {
		transform: translate(0.1940169387%, -0.1010047086%);
	}
	54% {
		transform: translate(-0.4195396613%, -0.0083977585%);
	}
	60%, 100% {
		transform: none;
	}
}
@keyframes rgb-shift-b {
	0% {
		transform: translate(-0.369177179%, 0.1070047401%);
	}
	5% {
		transform: translate(-1.2830968521%, -0.426490588%);
	}
	10% {
		transform: translate(-1.9642761993%, -0.2685498987%);
	}
	15% {
		transform: translate(0.2601073564%, -0.0288492649%);
	}
	20% {
		transform: translate(-0.1939851722%, -0.4923617789%);
	}
	25% {
		transform: translate(-1.5168779259%, -0.1876365762%);
	}
	30% {
		transform: translate(1.4418337594%, -0.3132970648%);
	}
	35% {
		transform: translate(0.1195800084%, 0.0763423722%);
	}
	40% {
		transform: translate(-0.2452481307%, -0.3189060923%);
	}
	45% {
		transform: translate(0.0207628594%, -0.4107373088%);
	}
	50%, 100% {
		transform: none;
	}
}