@charset "UTF-8";

:root {
	--sans-serif: "M PLUS Rounded 1c", "Zen Maru Gothic", sans-serif;
	--yakuhan: "YakuHanJP", "M PLUS Rounded 1c", "Zen Maru Gothic", sans-serif;
	-webkit-text-size-adjust: 100%;
	line-height: 1;
	
	--max1px: max(1px, 1rem);
	--max2px: max(2px, 2rem);

	font-family: var(--sans-serif);
	font-weight: 500;
}
/* sp */
@media only screen and (max-width: 767px) {
	:root {
		font-size: 0.3125vw;	/* w=320px */
		font-size: 0.25vw;		/* w=400px */
	}
	.site-header,
	.site-main,
	.site-footer {
		font-size: 15rem;
	}
}

/* tab & pc */
@media print,
(min-width: 768px) {
	:root {
		font-size: 1px;
	}
	.site-header,
	.site-main,
	.site-footer {
		font-size: 15rem;
	}

	/* pc */
	@media (min-width: 1025px) {
		.site-header,
		.site-main,
		.site-footer {min-width: 1280px;}
	}

	/* wide */
	@media (min-width: 1600px) {
		:root {
			font-size: 0.0625vw;
		}
	}
}

/* sp & tab */
@media (max-width: 1024px) {
	.site-main {overflow: clip;}
}


/* --HEADER-- */
@media all {
	.site-header {
		position: fixed;
		z-index: 1000;
		top: 0;
		left: 0;
	}
	.site-header-logo {
		position: absolute;
		z-index: 1000;
		top: 0;
		left: 0;
		background-color: #fff;
		border-right: var(--max2px) solid #000;
		border-bottom: var(--max2px) solid #000;
	}
	.site-header-nav {
		position: absolute;
	}

	.site-header-nav-item a,
	.site-header-nav-item span {
		position: relative;
		display: inline-block;
	}
	/* .site-header-nav-item.entry a {
		background-color: rgba(212,224,92, 1);
	} */

	.site-header-nav-item a::before,
	.site-header-nav-item span::before {
		content: '';
		position: absolute;
		left: 0;
		display: block;
		width: 100%;
		height: var(--max2px);
		background-color: rgba(237,76,140, 0);
		transition: .2s;
	}
	.site-header-nav-item a:hover::before,
	#about .site-header-nav-item.about a::before,
	#artist .site-header-nav-item.artist a::before,
	#gallery .site-header-nav-item.gallery a::before,
	#archive .site-header-nav-item.archive a::before {
		background-color: rgba(237,76,140, 1);
	}
	.site-header-nav-item:is(.news, .entry, .map, .timetable) a:hover::before,
	#map .site-header-nav-item.map a::before,
	#timetable .site-header-nav-item.timetable a::before,
	#news .site-header-nav-item.news a::before,
	#entry .site-header-nav-item.entry a::before,
	#reserve .site-header-nav-item.entry a::before {
		background-color: rgba(30,184,203,1);
	}

	.site-header-nav-item.disabled {color: #bbb;}

	body.nav-active {overflow: hidden;}

	/* tab & sp */
	@media only screen and (max-width: 1024px) {
		.site-header-nav {
			position: fixed;
			z-index: 1000;
		}
		.site-header-nav-list {
			position: absolute;
			top: 0;
			left: 0;
			background-color: #fff;
			transition: left .5s;
		}
		.site-header-nav-item + .site-header-nav-item {margin-top: 1em;}
		.site-header-nav-item a,
		.site-header-nav-item span {
			padding: 2rem .5em;
		}
		.site-header-nav-item a::before,
		.site-header-nav-item span::before {
			bottom: -4rem;
		}

		.site-header-nav-list {
			width: 100vw;
			padding: 2.778em 0;
			border-radius: 30rem 0 0 30rem;
			border: var(--max2px) solid #000;
			border-right: none;
			font-size: 18rem;
		}
		
		/* sp */
		@media only screen and (max-width: 767px) {
			.site-header-logo {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 270rem;
				height: 72rem;
				border-bottom-right-radius: 24rem;
			}
			.site-header-logo img {width: 231rem;}

			.site-header-nav {
				left: 100%;
				top: 88rem;
			}
			.site-header-nav-list {
				padding-left: 4em;
				border-radius: 24rem 0 0 24rem;
				font-size: 18rem;
			}
			.nav-active .site-header-nav-list {
				left: -270rem;
			}
		}

		/* tab */
		@media (min-width: 768px) {
			.site-header-nav {
				left: 100%;
				top: 100rem;
			}
			.site-header-nav-list {
				padding-left: 2em;
				border-radius: 30rem 0 0 30rem;
				font-size: 18rem;
			}
			.nav-active .site-header-nav-list {
				left: -210rem;
			}
		}
	}


	/* tab & pc */
	@media (min-width: 768px) {
		.site-header {
			width: 100%;
			font-size: 14rem;
		}
		.site-header-logo {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 297rem;
			height: 82rem;
			border-bottom-right-radius: 30rem;
		}
		.site-header-logo img {width: 250rem;}

		/* pc */
		@media (min-width: 1025px) {
			.site-header-nav {
				top: 22rem;
				right: 40rem;
				display: flex;
				align-items: center;
				justify-content: center;
				border: var(--max2px) solid #000;
				border-radius: 999rem;
				background-color: #fff;
				width: 840rem;
				height: 60rem;
			}
			.site-header-nav-list {
				display: flex;
				justify-content: space-between;
				width: 770rem;
				line-height: 1;
			}
			.site-header-nav-item a {
				padding: var(--max2px) var(--max2px) var(--max1px);
			}

			.site-header-nav-item a::before {
				bottom: -4rem;
			}
		}
	}
}


/* --BURGER-- */
@media all {

	/* sp & tab */
	@media only screen and (max-width: 1024px) {

		.menu-trigger-wrapper {
			position: fixed;
			z-index: 999;
			top: 0;
			right: 0;
			background-color: #fff;
			border: var(--max2px) solid #000;
			border-radius: 50%;
		}
		.menu-trigger,
		.menu-trigger span {
			display: inline-block;
			transition: all .4s;
			box-sizing: border-box;
			width: 30rem;
		}

		.menu-trigger {
			position: absolute;
			top: 22rem;
			right: 10rem;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			height: 27rem;
			visibility: visible;
			opacity: 1;
			transition: transform .5s;
			cursor: pointer;
		}

		.menu-trigger span {
			width: 100%;
			height: 3rem;
			border-radius: 99rem;
			background-color: rgba(30,184,203,1);
		}


		.nav-active .menu-trigger span:nth-of-type(2) {
			opacity: 0;
		}

		.nav-active .menu-trigger {
			visibility: visible !important;
			opacity: 1 !important;
		}

		.menu-trigger.hidden {
			visibility: hidden;
			opacity: 0;
			transition: .5s;
		}

		.menu-bg,
		.bg-trigger {
			display: block;
			position: fixed;
			z-index: 998;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			visibility: hidden;
		}

		.menu-bg {
			background: rgba(0, 0, 0, .5);
			opacity: 0;
			transition: .5s;
			backdrop-filter: blur(2rem);
		}

		.nav-active .menu-bg {
			opacity: 1;
			visibility: visible;
		}

		.bg-trigger {
			cursor: pointer;
		}

		.nav-active .bg-trigger {
			visibility: visible;
		}

		/* sp */
		@media (max-width: 767px) {
			.menu-trigger-wrapper {
				top: 16rem;
				right: 10rem;
				height: 56rem;
				width: 56rem;
			}
			.menu-trigger {
				top: 13rem;
				right: 11rem;
				width: 30rem;
				height: 26rem;
			}
			.menu-trigger span {
				height: 4rem;
			}
			.nav-active .menu-trigger span:nth-of-type(1) {
				transform: translateY(12rem) rotate(-220deg) scaleX(1.25);
			}
			.nav-active .menu-trigger span:nth-of-type(3) {
				transform: translateY(-11rem) rotate(220deg) scaleX(1.25);
			}
		}

		/* tab */
		@media (min-width: 768px) {
			.menu-trigger-wrapper {
				top: 18rem;
				right: 10rem;
				height: 64rem;
				width: 64rem;
			}
			.menu-trigger {
				top: 15rem;
				right: 13rem;
				width: 34rem;
				height: 30rem;
			}
			.menu-trigger span {
				height: 4rem;
			}
			.nav-active .menu-trigger span:nth-of-type(1) {
				transform: translateY(13.5rem) rotate(-220deg) scaleX(1.25);
			}
			.nav-active .menu-trigger span:nth-of-type(3) {
				transform: translateY(-13rem) rotate(220deg) scaleX(1.25);
			}
		}
	}

	/* --BURGER-- pc */
	@media print,
	(min-width: 1025px) {

		.menu-trigger,
		.menu-bg,
		.bg-trigger {
			display: none;
		}
	}
	
}

/* main-section */
@media all {
	.main-section {position: relative;}
	.main-section-ttl {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
	}

	/* sp */
	@media (max-width: 767px) {
		.main-section-ttl {height: 56rem;}
		.main-section-ttl-en img {
			width: auto;
			height: 35rem;
		}
	}

	/* tab & pc */
	@media print,
	(min-width: 768px) {
		.main-section-ttl {height: 67rem;}
		.main-section-ttl-en img {
			width: auto;
			height: 42rem;
		}
		
		/* tab */
		@media (max-width: 1024px) {}
		
		/* pc */
		@media (min-width: 1025px) {}
	}
	
}


/* cloud back */
@media all {
	.cl2, .cl3, .cl4, .cl7 {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		height: 32rem;
		height: 2.13333em;
		background: center / contain no-repeat;
		font-family: var(--yakuhan);
		color: #fff;
	}
	.cl2 {
		background-image: url(../img/common/cl2.svg);
		width: 58rem;
	}
	.cl3 {
		background-image: url(../img/common/cl3.svg);
		width: 104rem;
	}
	.cl4 {
		background-image: url(../img/common/cl4.svg);
		width: 137rem;
	}
	.cl7 {
		background-image: url(../img/common/cl12.svg);
		width: 235rem;
	}
}

/* .more-link & span.arrow */
@media all {
	.more-link {flex-shrink: 0;}
	.more-link :is(a, span) {
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 99em;
		width: 100%;
		height: 100%;
		font-weight: bold;
		color: #fff;
		transition: .3s;
	}
	.more-link.black :is(a, span) {
		border: var(--max1px) solid #000;
		background-color: #fff;
		color: #000;
	}
	.more-link.blue a {
		background-color: rgba(30,184,203,1);
	}
	.more-link.red a {
		background-color: rgba(237,76,140,1);
	}

	.more-link span.arrow {
		display: inline-block;
		width: 18rem;
		height: 5rem;
		border: none;
		border-bottom: var(--max1px) solid;
		border-right: var(--max2px) solid;
		border-radius: 0;
		transform: skewX(50deg);
		transition: .3s;
	}
	.more-link span.arrow.arrow2 {
		position: relative;
		border-right: none;
		transform: none;
	}
	.more-link span.arrow.arrow2::after {
		content: '';
		position: absolute;
		bottom: 0;
		right: 0;
		display: block;
		width: 2rem;
		height: 10rem;
		background-color: #000;
		transform-origin: bottom right;
		transform: rotate(-50deg);
	}

	.more-link.black a,
	.more-link.black a .arrow {border-color: #000;}


	/* sp */
	@media (max-width: 767px) {}

	/* tab & pc */
	@media print,
	(min-width: 768px) {
		.more-link.blue a:hover {
			background-color: rgba(30,184,203,.7);
		}
		.more-link.black a:hover {
			background-color: #000;
			color: #fff;
		}
		.more-link.red a:hover {
			background-color: rgba(237,76,140,.7);
		}

		.more-link a:hover .arrow:not(.arrow2) {
			transform: skewX(50deg) translateX(10rem);
		}
		.more-link.black a:hover .arrow {
			border-color: #fff;
			background: #000;
		}
		
		/* tab */
		@media (max-width: 1024px) {}
		
		/* pc */
		@media (min-width: 1025px) {}
	}
	
}

/* gallery */
@media all {
	.gallery-box li {
		overflow: hidden;
		border-radius: 10rem;
	}
	.gallery-box li a:hover img{
		transform: scale(1.05);
	}
	.gallery-box li img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: .3s;
	}
	.youtube {
		position: relative;
		aspect-ratio: 16 / 9;
	}
	.youtube iframe {
		width: 100%;
		height: 100%;
	}
}

/* FOOTER */
@media all {
		.site-footer {
			position: relative;
			background-color: rgba(249,248,239,1);
		}
		.site-footer::before {
			content: '';
			position: absolute;
			top: -1px;
			display: block;
			width: 100%;
			background: center / cover no-repeat url(../img/common/wave-w.svg);
			transform: scaleY(-1);
		}
		.footer-char img {
			width: auto;
			height: 100%;
			animation: footer-char .5s cubic-bezier(0.55, 0.06, 0.68, 0.19) alternate infinite;
		}
		.footer-char1 img {
			animation-delay: -.5s;
		}
		@keyframes footer-char {
			0% {transform: translateY(0);}
			100% {transform: translateY(25%);}
		}

		.footer-committee {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
		}
		.footer-committee dd {
			padding-top: .4em;
			font-weight: bold;
		}
		.footer-committee em {
			font-style: normal;
			font-weight: bold;
		}
		.committee-notice {
			display: inline-block;
			margin-top: 8rem;
			color: #999;
			font-weight: 500;
			font-size: 13rem;
		}
		.footer-committee :where(.email, .tel) {
			display: inline-block;
			margin-top: .5em;
		}

		.footer-lower {
			background-color: #fff;
			border-top: var(--max2px) solid #000;
			border-bottom: var(--max2px) solid #000;
		}
			.footer-logo-list {
				display: flex;
				flex-wrap: wrap;
				align-items: center;
				justify-content: space-between;
			}
		.footer-logo-item img {
			width: auto;
			height: 45rem;
		}
		.footer-logo-item:is(.zaidan, .sunshine, .bunka) img {height: 50rem;}
		.footer-logo-item.tobu img {height: 30rem;}

		.copyright {
			display: flex;
			align-items: center;
			justify-content: center;
			height: 50rem;
			font-size: 12rem;
		}
		

		/* sp */
		@media (max-width: 767px) {
			.site-footer {padding-top: 80rem;}
			.site-footer::before {height: 20rem;}
			.footer-char {
				height: 100rem;
			}
			.footer-char1 {
				top: 20rem;
				left: 20rem;
			}
			.footer-char2 {
				top: 200rem;
				right: 15rem;
			}

			.footer-upper {padding-bottom: 50rem;}
			.footer-logo {
				margin: 0 auto;
				width: 220rem;
				height: 220rem;
			}
			.footer-nav {display: none;}

			.footer-committee {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				margin-top: 50rem;
			}
			.footer-nav-ttl {font-size: 13rem;}

			.footer-committee dd {
				margin-top: 1em;
				font-size: 16rem;
				text-align: center;
			}
			.footer-committee dd + dt {
				margin-top: 36rem;
			}
			.footer-committee :is(.email, .tel) {font-size: 13rem;}
			.footer-committee .email {margin-top: 1em;}

			.footer-lower {padding: 20rem 0;}
			.footer-logo-list {
				justify-content: center;
				row-gap: 10rem;
			}
			.footer-logo-item {
				width: 45%;
				text-align: center;
			}
			.footer-logo-item.bunka {
				margin-top: 10rem;
				padding-top: 25rem;
				width: 90%;
				border-top: 1px solid #ccc;
			}
			
		}

		/* tab & pc */
		@media print,
		(min-width: 768px) {
			.site-footer {
				padding-top: 100rem;
			}
			.site-footer::before {
				height: 40rem;
			}
			.footer-logo {
				margin: 0 auto;
				width: 350rem;
				height: 350rem;
			}
			.footer-char {
				top: -60rem;
				height: 250rem;
			}
			.footer-char1 {
				left: max(0px, calc(50% - 580rem));
			}
			.footer-char2 {
				right: max(0px, calc(50% - 565rem));
			}

			.footer-upper {padding-bottom: 50rem;}
			.footer-nav-ttl {
				padding-top: 1px;
				font-size: 13rem;
			}
			.footer-nav-list {
				display: flex;
				flex-direction: column;
				flex-wrap: wrap;
				justify-content: flex-start;
				margin-top: 14rem;
				width: 400rem;
				height: 100rem;
				font-size: 14rem;
				line-height: 1.5;
			}
			.footer-nav-item {
				margin-top: .3em;
				width: 57.5%;
			}
			.footer-nav-item:is(:first-child, :nth-child(4n+1)) {margin-top: 0;}
			.footer-nav-item:nth-child(n+5) {width: 42.5%;}
			.footer-nav-item a {
				position: relative;
				display: block;
				white-space: nowrap;
				transition: opacity .3s;
			}
			.footer-nav-item a:hover {opacity: .6;}
			.footer-nav-item a::before {
				content: '';
				display: inline-block;
				width: 8rem;
				height: 8rem;
				background-color: #000;
				border-radius: 50%;
				margin-right: .5em;
			}
			.footer-nav-item a::after {
				position: absolute;
				right: 0;
				width: 100rem;
				content: attr(data-en);
			}
			.footer-nav-item:nth-child(n+5) a::after {width: 70rem;}

			.footer-nav-ttl {height: 28rem;}
			.footer-committee {width: 520rem;}
			.footer-committee .footer-nav-ttl.cl4 {width: 120rem;}
			.footer-committee dd {
				width: 380rem;
				font-size: 14rem;
			}
			.footer-committee em {font-size: 18rem;}

			.footer-logo-list {
				margin: 0 auto;
				padding: 0 10rem;
				height: 120rem;
				max-width: 1020rem;
			}


			/* tab */
			@media (max-width: 1024px) {
				.footer-nav-comittee {margin-top: 40rem;}
				.footer-nav {
					margin: 0 auto;
					width: 400rem;
					text-align: center;
				}
				.footer-nav-list {text-align: left;}
				.footer-committee {
					margin: 10rem auto 0;
					width: 520rem;
				}

				.footer-logo-list {
					justify-content: center;
					row-gap: 15rem;
					margin: 0 auto;
					padding: 20rem 0;
					width: 650rem;
					height: auto;
				}
				.footer-logo-item {
					width: 33%;
					text-align: center;
				}
				.footer-logo-item.bunka {
					margin-top: 5rem;
					padding-top: 20rem;
					width: 50%;
					border-top: 1px solid #ccc;
				}
			}
			
			/* pc */
			@media (min-width: 1025px) {
				.footer-committee .footer-nav-ttl.cl2 {margin-right: 4em;}
				.footer-nav-comittee {
					display: flex;
					justify-content: space-between;
					width: 1030rem;
					margin: 60rem auto 0;
					transform: translateX(14rem);
				}

				.footer-logo-item.wacca {
					margin-left: -10rem;
					margin-right: -10rem;
				}
				.footer-logo-item.bunka {
					padding-left: 20rem;
					border-left: 1px solid #ccc;
				}
			}
		}

		/* sp & tab */
		@media screen and (max-width: 1024px) {
			.footer-committee {
				flex-direction: column;
				align-items: center;
				max-width: 400rem;
				text-align: center;
			}
			.footer-committee dt {margin-top: 3em;}
			.footer-committee dd {margin-top: 1em;}
			.footer-committee .email {margin-top: 1em;}
		}
	}



/* 印刷用 */
@media print {
	body {
		width: 100%;
	}

	.site-header {
		position: absolute;
	}
	.site-header-nav,
	.to-top {
		display: none !important;
	}

}


/* --TO TOP-- */
@media all {
	.to-top {
		display: none;
		position: fixed;
		bottom: 20px;
		right: 20px;
		background: #3B4C85;
		width: 3.4375em;
		height: 3.4375em;
		border-radius: 50%;
		box-shadow: 0 0 2px rgba(255, 255, 255, .8);
		font-size: 12px;
		overflow: hidden;
		z-index: 1;
	}

	.to-top a {
		display: block;
		width: 100%;
		height: 100%;
	}
	.to-top a::after {
		content: '';
		position: absolute;
		top: 42.5%;
		left: 35%;
		width: 25%;
		height: 25%;
		border: 3px solid #fff;
		border-left: none;
		border-bottom: none;
		transform: translateY(0) rotate(-45deg);
		transition: .3s;
	}

	.to-top a:hover::after {
		transform: translateY(-30%) rotate(-45deg);
	}
}
@media only screen and (max-width: 767px) {
	.to-top {
		font-size: var(--sp-vw-12px);
	}
}
@media (min-width: 1025px) {
	.to-top a {
		font-size: 12.8px;
	}
}

/* inview */
@media not print {
	.elemFadeIn {
		opacity: 0;
		filter: blur(1rem);
		transition: 1s opacity, 1s filter, 1s transform;
	}

	.elemFadeIn.animated {
		opacity: 1;
		filter: blur(0);
	}
}

/* pagination */
@media all {
	.pagination {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin: 0 auto;
		padding: 0 10rem;
	}
	.page-item {
		margin: 0 2rem;
	}
	.page-item.disabled {display: none;}
	.page-item:first-child,
	.page-item:first-child a,
	.page-item:first-child a:hover,
	.page-item:last-child,
	.page-item:last-child a,
	.page-item:last-child a:hover {
		color: transparent;
		background-position: center;
		background-size: 7rem;
		background-repeat: no-repeat;
		background-image: url(../img/icon_gt-g.svg);
	}
	.page-item:first-child a:hover,
	.page-item:last-child a:hover {
		background-image: url(../img/icon_gt-w.svg);
	}
	.page-item .page-link {
		display: flex;
		justify-content: center;
		align-items: center;
		padding-bottom: 1rem;
		border-radius: 1em;
		min-width: 1.5em;
		height: 1.5em;
		font-size: 13rem;
		transition: .3s;
	}
	.page-item a:hover,
	.page-item.active span {
		background-color: #000;
		color: #fff;
	}
}

/* --Util--*/
@media all {
	.clearfix::after {
		content: '';
		display: block;
		clear: both;
	}

	/* sp */
	@media only screen and (max-width: 767px) {
		.spNone {
			display: none!important;
		}
	}

	/* tab & sp */
	@media only screen and (max-width: 1024px) {
		.pcOnly {
			display: none!important;
		}
	}

	/* tab & pc */
	@media print,
	(min-width: 768px) {
		.spOnly {
			display: none!important;
		}
	}

	/* pc */
	@media print,
	(min-width: 1025px) {
		.pcNone {
			display: none!important;
		}
	}
}


/* the_content() */
@media all {
	.the_content ul li {
		margin-left: 1.5em;
		list-style-type: disc;
	}
	.the_content ol li {
		margin-left: 1.5em;
		list-style-type: decimal;
	}
	.the_content a {color: rgba(30,184,203,1);}
}
@media only screen and (max-width: 767px) {
	.the_content img {
		width: 100%;
	}
}
@media print,
(min-width: 768px) {
	.the_content::after {
		content: '';
		display: block;
		clear: both;
	}
	.the_content a {transition: opacity .3s;}
	.the_content a:hover {opacity: .6;}
	.aligncenter {
		display: block;
		margin: 1em auto;
	}
	.alignleft {
		float: left;
	}
	.alignright {
		float: right;
	}
}


/* decoration image */
@media all {
	.deco {position: absolute;}
}




/* reCaptcha */
@media all {
	body .grecaptcha-badge {display: none!important;}
	.footer-nav-item a {transition: color .3s;}
	.footer-nav-item.disabled a {
		color: #ccc;
		pointer-events: none;
	}
	.footer-nav-item.disabled a::before {background-color: #ccc;}
	.footer-nav-item a:hover {color: var(--red);}
}