@charset "UTF-8";

/* main-header */
@media all {
	.main-header {
		position: relative;
	}
	.main-header-ttl {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		position: absolute;
		font-weight: bold;
		color: #fff;
		z-index: 1;
	}
	.main-header-video {
		position: absolute;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.main-header::after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 100%;
		background-image: url(../img/home/movie-dot.png);
	}
}

/* main-header - sp */
@media only screen and (max-width: 767px) {
	.main-header {
		aspect-ratio: 1 / 1;
	}
	.main-header-ttl {
		top: 25rem;
		left: 5rem;
		font-size: 20rem;
		line-height: 1.2;
	}
	.main-header-ttl .small {
		margin-top: 10rem;
		font-size: 13rem;
	}
}

/* main-header - tab & pc */
@media print,
(min-width: 768px) {
	.main-header {
		aspect-ratio: 16 / 9;
		line-height: 1.4;
	}
}
/* main-header - tab */
@media  (min-width: 768px) and (max-width: 1024px) {
	.main-header-ttl {
		top: 70rem;
		left: 40rem;
		font-size: 35rem;
	}
	.main-header-ttl .small {
		margin-top: 10rem;
		font-size: 21rem;
	}
}

/* main-header - pc */
@media print,
(min-width: 1025px) {
	.main-header-ttl {
		top: 78rem;
		left: 40rem;
		height: 230rem;
		font-size: 45rem;
	}
	.main-header-ttl .small {
		margin-top: 20rem;
		font-size: 28rem;
	}
}

/* more-link */
@media all {
	.more-link {
		text-align: right!important;
	}
	.more-link a {
		display: inline-flex;
		align-items: center;
		justify-content: space-between;
		color: var(--fontgray);
	}
}
/* more-link sp */
@media (max-width: 767px) {
	.more-link {
		font-size: 13rem;
	}
	.more-link a {
		width: 110rem;
	}
	.news-more img.arrow {
		height: 12rem;
	}
	.more-link img {
		width: auto;
	}
}
/* more-link tab & pc */
@media print,
(min-width: 768px) {
	.more-link a {
		width: 120rem;
	}
	.news-more img.arrow {
		height: 14rem;
	}
	.more-link img.icon {
		height: 34rem;
	}
}



/* news-headline */
@media all {
	.aside-news {
		border-bottom: 1rem solid var(--lightgray);
	}
	.news-ttl {
		font-weight: bold;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
}
/* news-headline - sp */
@media only screen and (max-width: 767px) {
	.aside-news {
		padding: 20rem;
	}
	.news-ttl {
		margin-top: 14rem;
		-webkit-line-clamp: 2;
		font-size: 14rem;
	}
	.news-more {margin-top: 10rem;}
	.news-more img.icon {
		height: 30rem;
	}
}

/* news-headline - tab & pc */
@media print,
(min-width: 768px) {
	.aside-news {
		padding: 40rem 50rem 40rem 40rem;
	}
	.news-ttl {
		margin-top: 10rem;
		-webkit-line-clamp: 1;
		width: calc(100% - 200rem);
		font-size: 25rem;
	}
	.news-more img.icon {
		height: 36rem;
	}
}

/* news-headline - tab */
@media (min-width: 768px) and (max-width: 1024px) {
	.aside-news {
		padding: 30rem 30rem 10rem;
	}
	.news-ttl {
		font-size: 20rem;
		width: calc(100% - 120rem);
	}
}

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

/* areamaps */
@media all {
	.gmap {
		position: relative;
		display: block;
	}
	.gmap img {
		width: 100%;
		height: 100%;
	}
	.gmap:hover .areamap_text {opacity: 1;}
	.areamaps-caption,
	.area-list-caption {text-align: center;font-weight: bold;}
	.area-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 10rem;
	}
	.area-list li::before {
		content: '';
		display: inline-block;
		margin-right: .5em;
		height: 1.5em;
		width: 1.5em;
		background: center / contain no-repeat;
		line-height: 1;
		transform: translateY(.4em);
		/* border-radius: 50%;
		box-shadow: 0 2px 2px rgba(0, 0, 0, .3);
		border: 1px solid #fff;
		color: #fff; */
	}
	.area-list li.a::before {background-image: url(../img/home/a.png);}
	.area-list li.b::before {background-image: url(../img/home/b.png);}
	.area-list li.c::before {background-image: url(../img/home/c.png);}
	.area-list li.d::before {background-image: url(../img/home/d.png);}
	.area-list li.e::before {background-image: url(../img/home/e.png);}
	.area-list li.f::before {background-image: url(../img/home/f.png);}

	/* sp */
	@media only screen and (max-width: 767px) {
		.areamaps {margin: 3em auto 0;}
		.gmap {margin-top: 10rem;}
		.areamap_text {
			font-size: 11rem;
			text-align: center;
		}
		.area-list {
			flex-direction: column;
			width: 160rem;
			margin: 0 auto;
			font-size: 12rem;
			line-height: 2.4;
		}
		/* .area-list li:nth-child(odd) {width: 50%;}
		.area-list li:nth-child(even) {width: 40%;} */
		.areamaps .pc_right {margin-top: 2em;}
	}

	/* pc & tab */
	@media print,
	(min-width: 768px) {
		.areamaps {
			margin: 80rem auto 0;
			max-width: 1000rem;
		}
		.gmap {margin-top: 20rem;}
		.areamap_text {
			position: absolute;
			top: 0;
			left: 0;
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			height: 100%;
			opacity: 0;
			font-size: 30rem;
			font-weight: bold;
			color: #fff;
			background-color: rgba(0, 0, 0, .7);
			transition: opacity .3s;
		}
		.area-list a {transition: color .3s;}
		.area-list a:hover {color: var(--red);}

		/* pc */
		@media (min-width: 1025px) {
			.areamaps {
				display: flex;
			}
			.areamaps .pc_left {width: 72%;}
			.areamaps .pc_right {width: 28%;}
			.area-list {
				flex-direction: column;
				justify-content: left;
				padding-left: 40rem;
				font-size: 18rem;
				line-height: 3;
			}
		}
		/* tab */
		@media (max-width: 1024px) {
			.areamaps .pc_right {margin-top: 30rem;}
			.area-list {
				margin: 10rem auto;
				width: 420rem;
				line-height: 2.5;
				transform: translateX(3em);
			}
			.area-list li {width: 210rem;}
		}
	}
}

/* about,gallery */
@media all {
	.music-circle-wrapper {
		position: relative;
	}
	.music-circle {
		position: absolute;
		background: center / contain no-repeat url(../img/home/music-circle.svg);
		z-index: -1;
	}
	.music-circle-text {
		position: absolute;
		background: center / contain no-repeat url(../img/home/music-circle-text.svg);
	}
	.deco-line {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.section-content {
		line-height: 2;
	}
	.about-link a {
		width: 110rem;
	}
	.gallery-box {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
}

/* about,gallery - sp */
@media only screen and (max-width: 767px) {
	.music-circle-wrapper {
		padding: 0 10rem 100rem 15rem;
	}
	.music-circle {
		top: 400rem;
		left: 30rem;
		width: 520rem;
		height: 520rem;
	}
	.music-circle-text {
		width: 288rem;
		height: 255rem;
		top: 540rem;
		left: 120rem;
	}
	.deco-line {
		margin-top: 40rem;
	}
	.about-section {
		margin-top: 60rem;
	}
	.section-content {
		margin-top: 20rem;
	}
	.about-link,
	.gallery-link {
		margin-top: 12rem;
	}
	.about-link a {width: 107rem;}
	.about-link img.icon {
		height: 30rem;
	}
	.gallery-link img.icon {
		height: 36rem;
	}
	.gallery-section {
		margin-top: 560rem;
	}
	.gallery-box {
		margin-top: 80rem;
	}
	.gallery-box li {
		width: 30%;
		aspect-ratio: 1 / 1;
	}
	.gallery-box li:nth-child(n+6) {
		margin-top: 4.5%;
	}
	.youtube {
		margin-top: 90rem;
	}
	.deco-1 {width: 27.2rem;}
	.deco-2 {width: 20.1rem;}
	.deco-3 {width: 32.7rem;}
	.deco-4 {width: 15.3rem;}
	.deco-5 {width: 17rem;}
	.deco-6 {width: 15.5rem;}
	.deco-7 {
		top: 270rem;
		left: 0;
		width: 72.2rem;
	}
	.deco-8 {
		top: -120rem;
		left: 10rem;
		width: 22rem;
	}
	.deco-9 {
		top: -70rem;
		left: 100rem;
		width: 20.1rem;
	}
	.deco-10 {
		top: -170rem;
		left: -120rem;
		width: 288rem;
	}
	.deco-11 {
		bottom: -60rem;
		right: 30rem;
		width: 30.3rem;
	}
}
/* about,gallery - tab & pc */
@media print,
(min-width: 768px) {
	.section-content {
		font-size: 16rem;
		margin-top: 30rem;
	}
	.about-link,
	.gallery-link {
		margin-top: 20rem;
	}
}
/* about,gallery - tab */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.music-circle-wrapper {
		padding: 80rem 20rem 110rem 40rem;
	}
	.music-circle {
		top: 0rem;
		left: 460rem;
		width: 660rem;
		height: 660rem;
	}
	.music-circle-text {
		top: 174rem;
		left: 590rem;
		width: 365rem;
		height: 324rem;
	}
	.deco-line {
		width: 430rem;
	}
	.about-section {
		margin-top: 60rem;
	}
	.section-content {
		width: 350rem;
	}
	.gallery-section {
		margin-top: 100rem;
	}
	.gallery-box {
		margin-top: 40rem;
	}
	.gallery-box li {
		width: 22.5%;
		aspect-ratio: 1 / 1;
	}
	.gallery-box li:nth-child(n+7) {
		margin-top: 3%;
	}
	.youtube {
		margin: 160rem auto 0;
		width: 638rem;
	}
	.deco-1 {width: 48rem;}
	.deco-2 {width: 35rem;}
	.deco-3 {width: 57.4rem;}
	.deco-4 {width: 26.8rem;}
	.deco-4 {width: 26.8rem;}
	.deco-5 {width: 29.9rem;}
	.deco-6 {width: 27.2rem;}
	.deco-7 {
		top: -40rem;
		left: 300rem;
		width: 72.2rem;
	}
	.deco-8 {
		top: -120rem;
		left: 10rem;
	}
	.deco-9 {
		top: -70rem;
		left: 100rem;
	}
	.deco-10 {
		top: -300rem;
		left: -360rem;
	}
	.deco-11 {
		bottom: -60rem;
		right: 30rem;
	}
}
/* about,gallery - pc */
@media print,
(min-width: 1025px) {
	.music-circle-wrapper {
		padding: 200rem 0 80rem 40rem;
	}
	.music-circle {
		top: 0rem;
		left: 580rem;
		width: 1076rem;
		height: 1076rem;
	}
	.music-circle-text {
		top: 274rem;
		left: 790rem;
		width: 596rem;
		height: 528rem;
	}
	.deco-line {
		width: 600rem;
	}
	.about-section {
		margin-top: 100rem;
	}
	.section-content {
		margin-top: 32rem;
		width: 490rem;
		font-size: 16rem;
		line-height: 2;
	}

	.gallery-section {
		margin-top: 100rem;
	}
	.deco-1 {width: 64.34rem;}
	.deco-2 {width: 47.6rem;}
	.deco-3 {width: 77.42rem;}
	.deco-4 {width: 36.13rem;}
	.deco-5 {width: 40.31rem;}
	.deco-6 {width: 36.67rem;}
	.deco-7 {
		top: -20rem;
		left: 300rem;
		width: 72.21rem;
	}
	.deco-8 {
		top: -120rem;
		left: -100rem;
		width: 36.12rem;
	}
	.deco-9 {
		top: 70rem;
		left: -200rem;
		width: 26.72rem;
	}
	.deco-10 {
		top: -150rem;
		left: -500rem;
	}
	.deco-11 {
		bottom: -0rem;
		right: -130rem;
		width: 50.43rem;
	}
	.gallery-box {
		margin-top: 60rem;
		max-width: 1030rem;
	}
	.gallery-box li {
		width: 180rem;
		height: 180rem;
	}
	.gallery-box li:nth-child(n+6) {
		margin-top: 35rem;
	}
	.gallery-link {
		padding-right: 50rem;
	}
	
	.youtube {
		margin: 120rem auto 0;
		width: 608rem;
	}
}