@charset "utf-8";

/* To embed Google fonts
----------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@100;200;300;400;500;600;700;800;900&family=Noto+Sans+JP:wght@100..900&display=swap');


html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	font-size: 62.5%;
}

body {
	margin: 0;
	color: #000000;
	font-family: "Noto Sans JP", "YuGothic", "Yu Gothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", "Meiryo", "sans-serif";
	font-size: 1.6rem;
	line-height: 1;
	opacity: 0;
}

body.is-complete {
	opacity: 1;
	transition: 1.5s ease 0.25s;
}

input, button, select, textarea {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
}

*, *:after, *:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* -----------------------------------------------
 * Scroll Fade Effect Elements
 ---------------------------------------------- */

.fadein {
	opacity: 0;
	transform: translate(0, 50px);
	transition-property: opacity transform;
	transition: 1.5s ease 0.25s;
}

.fadein.active {
	opacity: 1;
	transform: translate(0, 0);
}



/* ! inline Break(carriage return) Control Classes
----------------------------------------------- */
br.sp-inline {
	display: inline-block !important;
}

@media (min-width: 768px) {
	br.sp-inline {
		display: none !important;
	}
}

br.pc-inline {
	display: none !important;
}

@media (min-width: 768px) {
	br.pc-inline {
		display: inline-block !important;
	}
}



figure {
	margin: 0;
}

figure img {
	width: 100%;
}




/* ----------------------------------------------
 * Header
 ---------------------------------------------- */

.l-header {
	position: relative;
	background-image: url("../images/main_sp.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}

@media screen and (min-width: 900px) {
	.l-header {
		background-image: url("../images/main.jpg");
	}
}

.l-header::before {
	content: '';
	display: block;
	padding-top: 171.79%;
}

@media screen and (min-width: 900px) {
	.l-header::before {
		padding-top: 56.25%;
	}
}


.l-header__container {
	position: absolute;
	top: 11.282vw;
	right: 6.1538vw;
}

@media screen and (min-width: 900px) {
	.l-header__container {
		top: 5.1875vw;
		left: 15.1875vw;
		right: auto;
	}
}

.l-header__container h1 {
	margin: 0;
	font-size: 1px;
	line-height: 1;
}

.l-header__container .l-header__title {
	margin: 0;
	width: 39.487vw;
}

@media screen and (min-width: 900px) {
	.l-header__container .l-header__title {
		width: 22vw;
	}
}




/* ----------------------------------------------
 * Reverse
 ---------------------------------------------- */

.reverse {
	display: flex;
	flex-direction: column-reverse;
}

@media screen and (min-width: 900px) {
	.reverse {
		flex-direction: column;
	}
}



/* ----------------------------------------------
 * Catch
 ---------------------------------------------- */

.p-catch {
	padding-top: 13.846vw;
	padding-bottom: 16.2vw;
}

@media screen and (min-width: 900px) {
	.p-catch {
		padding-top: 9.375vw;
		padding-bottom: 7.1875vw;
	}
}



.p-catch__container {
	width: fit-content;
	margin: 0 auto;
}

.p-catch__container figure {
	width: 82.05vw;
	margin: 0;
	text-align: left;
}

@media screen and (min-width: 900px) {
	.p-catch__container figure {
		width: 68.125vw;
	}
}

.p-catch__container figure img {
	width: 100%;
}

.p-catch__container h2 {
	margin: 0.8em 0 0;
	font-size: 10.256vw;
	line-height: 1.55;
}

@media screen and (min-width: 900px) {
	.p-catch__container h2 {
		text-align: center;
		font-size: 3.4375vw;
		line-height: 1.0;
	}
}


/* ----------------------------------------------
 * Sns
 ---------------------------------------------- */

.p-sns {
	
}

.p-sns__container ul {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin: 0;
	padding: 0;
	list-style-type: none;
	border-top: solid 0.1rem #000000;
	
}

@media screen and (min-width: 900px) {
	.p-sns__container ul {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	}
}

.p-sns__container li {
	position: relative;
	border-bottom: solid 0.1rem #000000;
	border-left: solid 0.1rem #000000;
}

.p-sns__container li:first-of-type {
	border-left: none;
}

.p-sns__container li.end {
	
}

@media screen and (min-width: 900px) {
	.p-sns__container li.end {
		display: none;
	}
}

.p-sns__container li a {
	display: block;
	width: 100%;
	padding-top: 36.08%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 12.82vw;
	transition: background 0.5s ease;
}

@media screen and (min-width: 900px) {
	.p-sns__container li a {
		padding-top: 38.5%;
		background-size: 5vw;
	}
	.p-sns__container li a:hover {
		background-color: #000000;
	}
}

.p-sns__container li.YouTube a {
	background-image: url("../images/icon_youtube.svg");
}

.p-sns__container li.Instagram a {
	background-image: url("../images/icon_instagram.svg");
}
.p-sns__container li.x-twitter a {
	background-image: url("../images/icon_x-twitter.svg");
	display: none;
}

/*
.p-sns__container li.facebook a {
	background-image: url("../images/icon_facebook.svg");
}
*/
.p-sns__container li.Line a {
	background-image: url("../images/icon_line.svg");
}

.p-sns__container li.TikTok a {
	background-image: url("../images/icon_tiktok.svg");
}

.p-sns__container li.Threads a {
	background-image: url("../images/icon_threads.svg");
}

@media screen and (min-width: 900px) {
	.p-sns__container li.YouTube a:hover {
		background-image: url("../images/icon_youtube_w.svg");
	}

	.p-sns__container li.Instagram a:hover {
		background-image: url("../images/icon_instagram_w.svg");
	}

	.p-sns__container li.x-twitter {
		display: none;
	}

	.p-sns__container li.x-twitter a:hover {
		background-image: url("../images/icon_x-twitter_w.svg");
	}
/*
	.p-sns__container li.facebook a:hover {
		background-image: url("../images/icon_facebook_w.svg");
	}
*/
	.p-sns__container li.Line a:hover {
		background-image: url("../images/icon_line_w.svg");
	}

	.p-sns__container li.TikTok a:hover {
		background-image: url("../images/icon_tiktok_w.svg");
	}

	.p-sns__container li.Threads a:hover {
		background-image: url("../images/icon_threads_w.svg");
	}
}




/* ----------------------------------------------
 * Profile
 ---------------------------------------------- */

.p-profile {
	border-top: solid 0.1rem #000000;
	border-bottom: solid 0.1rem #000000;
}

@media screen and (min-width: 900px) {
	.p-profile {
		border-top: none;
	}
}

.p-profile__container {
	padding: 13.846vw 0 0;
}

@media screen and (min-width: 900px) {
	.p-profile__container {
		display: flex;
		justify-content: space-between;
		width: 69.375vw;
		margin: 0 auto;
		padding: 8.75vw 0 7.8125vw;
	}
}

.p-profile__image {
	width: 61.538vw;
	margin: 0 auto;
}

@media screen and (min-width: 900px) {
	.p-profile__image {
		width: 29.37%;
		margin: 0;
	}
}



.p-profile__contents {
	padding: 10.5vw 7.6923vw 7.0vw;
}

@media screen and (min-width: 900px) {
	.p-profile__contents {
		padding: 0;
		width: 66.21%;
	}
}

.p-profile__contents h3 {
	margin: 0 0 0.9em;
	font-size: 6.41vw;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
}

@media screen and (min-width: 900px) {
	.p-profile__contents h3 {
		margin: 0 0 1.5em;
		font-size: 1.5625vw;
	}
}

.p-profile__contents p {
	margin: 0 0 1.5em;
	font-size: 3.589vw;
	line-height: 1.666;
}

@media screen and (min-width: 900px) {
	.p-profile__contents p {
		font-size: 0.9375vw;
	}
}

.p-profile__contents p:last-of-type {
	margin-bottom: 0;
}

/* ----------------------------------------------
 * Main
 ---------------------------------------------- */

.p-main {
	
}

.p-main__header {
	padding-top: 9.5vw;
	padding-bottom: 6.2vw;
}

.p-main__header__container {
	padding: 0 8.974vw;
}

@media screen and (min-width: 900px) {
	.p-main__header__container {
		width: 75.625vw;
		margin: 0 auto;
		padding: 0;
	}
}




.p-main__header__symbol {
	width: 45.641vw;
}

@media screen and (min-width: 900px) {
	.p-main__header__symbol {
		width: 18.5625vw;
	}
}





.p-main__header__title {
	margin-top: 0.8em;
	font-size: 6.66666vw;
	line-height: 1.613;
}

@media screen and (min-width: 900px) {
	.p-main__header__title {
		font-size: 3.875vw;
	}
}




.p-main__contents ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

@media screen and (min-width: 900px) {
	.p-main__contents ul {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
	}
}

.p-main__contents li {
	padding: 5.1282vw 7.692vw 5.1282vw 5.128vw;
	border-bottom: solid 0.1rem #000000;
}

@media screen and (min-width: 900px) {
	.p-main__contents li {
		padding: 5.3125vw;
		border-left: solid 0.1rem #000000;
	}

	.p-main__contents li:nth-of-type(3n+1) {
		border-left: none;
	}

}


.p-main__contents li.end {
	display: none;
}

@media screen and (min-width: 900px) {
	.p-main__contents li.end {
		display: block;
	}
}





.p-main__contents li h4 {
	display: flex;
	align-items: center;
	margin: 0;
	font-size: 4.3589vw;
	font-weight: 500;
	line-height: 1.35;
}

@media screen and (min-width: 900px) {
	.p-main__contents li h4 {
		height: 3.625vw;
		font-size: 1.1875vw;
		line-height: 1.526;
	}
}

.p-main__contents li h4 span {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: 16.8333vw;
	height: 7.82vw;
	margin: 0 4.3589vw 0 0;
	padding-right: 2.564vw;
	background-image: url("../images/button_sp.svg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	color: #ffffff;
	font-family: "Barlow", sans-serif;
	font-size: 3.589vw;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.1em;
}

@media screen and (min-width: 900px) {
	.p-main__contents li h4 span {
		justify-content: flex-start;
		width: 6.625vw;
		height: 3.0625vw;
		margin-right: 1.25vw;
		padding: 0 0 0 1.0vw;
		background-image: url("../images/button.svg");
		font-size: 1.25vw;
	}
}


.p-main__contents li h4.active span {
	justify-content: flex-start;
	padding: 0 0 0 2.564vw;
	background-image: url("../images/button.svg");
}








.p-main__contents li p {
	display: none;
	margin: 1.0em 0;
	font-size: 3.846vw;
	line-height: 1.8125;
}


@media screen and (min-width: 900px) {
	.p-main__contents li p {
		display: block;
		margin: 2.0em 0 0;
		font-size: 1vw;
		line-height: 1.8125;
	}
}




.p-main__bottom {
	position: relative;
	background-color: #faf5e5;
}
@media screen and (min-width: 900px) {
	.p-main__bottom::before {
		content: '';
		display: block;
		position: absolute;
		bottom: 1.0rem;
		left: 0;
		width: 100%;
		border-bottom: solid 0.1rem #000000;
	}
}

.p-main__bottom__container {
	padding: 14.615vw 10.256vw 20.769vw;
}

@media screen and (min-width: 900px) {
	.p-main__bottom__container {
		padding: 8.125vw 0 6.75vw;
	}
}

.p-main__bottom__container h3 {
	width: fit-content;
	margin: 0;
	font-size: 5.1282vw;
	line-height: 1.0;
	letter-spacing: 0.1em;
}

@media screen and (min-width: 900px) {
	.p-main__bottom__container h3 {
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 0 auto;
		padding: 0 0.5em;
		font-size: 1.875vw;
		line-height: 1.0;
		background: linear-gradient(transparent 85%, #ffff00 85%);
	}
}

.p-main__bottom__container h3 span {
	margin: 0 0.1em;
	color: #16509f;
	font-family: "Barlow", sans-serif;
	font-size: 8.205vw;
	font-weight: 700;
	letter-spacing: 0.05em;
}

@media screen and (min-width: 900px) {
	.p-main__bottom__container h3 span {
		font-size: 3.0vw;
	}
}

.p-main__bottom__container h3 span.small {
	font-size: 1.33em;
}


.p-main__bottom__container h3 i {
	display: none;
}

@media screen and (min-width: 900px) {
	.p-main__bottom__container h3 i {
		display: block;
	}
}



.p-main__bottom__container p {
	margin: 1.3em auto 0;
	font-size: 4.3589vw;
	line-height: 1.7;
}

@media screen and (min-width: 900px) {
	.p-main__bottom__container p {
		width: 51vw;
		margin: 1.3em auto 0;
		font-size: 1.875vw;
		font-weight: 400;
		line-height: 1.7333;
	}
}




.p-main__slid {
	background: linear-gradient(90deg, #202780 0%, #4985be 75%);
}

.p-main__slid ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.p-main__slid li {
	margin: 0;
	padding: 0;
}

.p-main__slid figure {
	display: flex;
	align-items: center;
	width: 37.69vw;
	height: 11.282vw;
	margin: 0;
}

@media screen and (min-width: 900px) {
	.p-main__slid figure {
		width: 17.875vw;
		height: 5.375vw;
	}
}


.p-main__slid img {
	width: 100%;
}







/* ----------------------------------------------
 * What
 ---------------------------------------------- */

.p-what {
	background-color: #edf4f3;
}

.p-what__header {
	padding: 11.282vw 0 15.897vw;
	border-bottom: solid 0.1rem #000000;
}

@media screen and (min-width: 900px) {
	.p-what__header {
		padding: 5.3125vw 0 5.375vw;
	}
}

.p-what__header__container {
	width: 72.5vw;
	margin: 0 auto;
}

.p-what__title {
	margin: 0;
	font-size: 7.6923vw;
	line-height: 1.46;
}

@media screen and (min-width: 900px) {
	.p-what__title {
		font-size: 3.875vw;
	}
}

.p-what__title img {
	margin: 0 0.2em;
	height: 0.806em;
	transform: translateY(-0.05em);
}

.p-what__subtitle {
	margin: 0.9em 0 0;
	font-size: 4.10256vw;
	font-weight: 700;
	line-height: 1.0;
	letter-spacing: 0.05em;
}

@media screen and (min-width: 900px) {
	.p-what__subtitle {
		font-size: 2.0625vw;
	}
}




.p-what__contents ul {
	
	margin: 0;
	padding: 0;
	list-style-type: none;
}

@media screen and (min-width: 900px) {
	.p-what__contents ul {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
}

.p-what__contents li {
	padding: 13.3333vw 8.97435vw 11.538vw;
	border-bottom: solid 0.1rem #000000;
	border-left: solid 0.1rem #000000;
}

@media screen and (min-width: 900px) {
	.p-what__contents li {
		padding: 5.3125vw 6.5625vw 5.9375vw;
	}
}



.p-what__contents li h4 {
	margin: 0;
	font-size: 5.1282vw;
	font-weight: 500;
	line-height: 1.526;
}

@media screen and (min-width: 900px) {
	.p-what__contents li h4 {
		font-size: 1.5vw;
	}
}

.p-what__contents li h4 img {
	display: block;
	height: 1.475em;
	margin: 0.5em 0 0;
}

@media screen and (min-width: 900px) {
	.p-what__contents li h4 img {
		height: 1.68em;
		margin: 0.8em 0 0;
	}
}


.p-what__contents li p {
	margin: 1.5em 0 0;
	font-size: 3.846vw;
	line-height: 1.73333;
}

@media screen and (min-width: 900px) {
	.p-what__contents li p {
		margin: 2.0em 0 0;
		font-size: 1vw;
		line-height: 1.8125;
	}
}



.p-what__history {
	
}

@media screen and (min-width: 900px) {
	.p-what__history {
		display: flex;
		justify-content: space-between;
	}
}

.p-what__history__image {
	width: 57.6923vw;
	margin: 0 auto;
}

@media screen and (min-width: 900px) {
	.p-what__history__image {
		width: 14.0625vw;
		margin: 0;
	}
}

.p-what__history__text {
	margin-top: 10.769vw;
}

@media screen and (min-width: 900px) {
	.p-what__history__text {
		width: 20.125vw;
		margin-top: 0;
	}
}




.p-what__bottom {
	background: linear-gradient(90deg, #202780 0%, #4985be 75%);
}

.p-what__bottom__container {
	padding: 17.9487vw 0 24.36vw;
	text-align: center;
	color: #ffffff;
}

@media screen and (min-width: 900px) {
	.p-what__bottom__container {
		padding: 8.4375vw 0;
	}
}

.p-what__bottom__text {
	margin: 0;
	font-size: 4.1025vw;
	font-weight: 500;
	line-height: 1.625;
}

@media screen and (min-width: 900px) {
	.p-what__bottom__text {
		font-size: 1.4375vw;
		line-height: 1.74;
	}
}

.p-what__bottom__message {
	margin: 2.0em 0 0;
	font-size: 5.897vw;
	font-weight: 600;
	line-height: 1.695;
}

@media screen and (min-width: 900px) {
	.p-what__bottom__message {
		margin-top: 1.3em;
		font-size: 2.1875vw;
		line-height: 1.6;
	}
}



/* ----------------------------------------------
 * Album
 ---------------------------------------------- */

.p-album {
	padding: 2.564vw;
}

@media screen and (min-width: 900px) {
	.p-album {
		padding: 2.625vw;
	}
}

.p-album ul {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2.564vw 2.05128vw;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media screen and (min-width: 900px) {
	.p-album ul {
		grid-template-columns: 1fr 1fr 1fr;
		gap: 1.875vw 1.5625vw;
	}
}

.p-album li {
	margin: 0;
	padding: 0;
}

.p-album figure {
	margin: 0;
}

.p-album img {
	width: 100%;
}






/* ----------------------------------------------
 * Stagr
 ---------------------------------------------- */





.p-stage__title {
	margin: 0 0 14.87vw;
	text-align: center;
	font-size: 4.61538vw;
}

@media screen and (min-width: 900px) {
	.p-stage__title {
		width: 75vw;
		margin: 0 auto 2.9em;
		text-align: left;
		font-size: 1.75vw;
	}
}


.p-stage__container {
	padding: 14.87vw 0 8.75vw;
}

@media screen and (min-width: 900px) {
	.p-stage__container {
		padding: 3.4375vw 0 8.75vw;
	}
}

.p-stage__contents {
	overflow-x: scroll
}

@media screen and (min-width: 900px) {
	.p-stage__contents {
		overflow-x: auto;
	}
}

.p-stage__contents ul {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 8.205vw;
	width: 277.43589vw;
	margin: 0;
	padding: 0 10.256vw 15.3846vw;
	list-style-type: none;
}

@media screen and (min-width: 900px) {
	.p-stage__contents ul {
		width: 75vw;
		gap: 2.3125vw;
		margin: 0 auto;
		padding: 0;
	}
}

.p-stage__contents li {
	
}


.p-stage__contents h4 {
	margin: 0 0 1.0em;
	text-align: center;
	font-size: 4.1538vw;
	line-height: 1;
}

@media screen and (min-width: 900px) {
	.p-stage__contents h4  {
		font-size: 1.125vw;
	}
}


.p-stage__item {
	position: relative;
	border: solid 0.1rem #000000;
	border-radius: 50%;
}

.p-stage__item::before {
	content: '';
	display: block;
	padding-top: 100%;
}

.p-stage__item__container {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.p-stage__item__container p {
	margin: 0;
	padding: 1.0em 0;
	text-align: center;
	font-size: 3.6923vw;
	line-height: 1.5;
	border-bottom: solid 0.1rem;
	white-space: nowrap;
}

.p-stage__item__container p:last-of-type{
	border-bottom: none;
}



@media screen and (min-width: 900px) {
	.p-stage__item__container p {
		font-size: 1.0vw;
	}
}

.p-contact__container {
    padding: 8.75vw 0;
	text-align: center;
}

.p-contact__container_title {
	font-weight: 600;
    font-size: 4.61538vw;
	margin: 0 0 0.5em;
}

.p-contact__container_address {
	line-height: 1.6;
	margin: 0;
}

@media screen and (min-width: 900px) {
	.p-contact__container {
		padding: 0 0 2.75vw;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.p-contact__container_title {
		font-size: 1.6rem;
		margin: 0 2em 0 0;
		line-height: 1;
	}

	.p-contact__container_address {
		line-height: 1;
	}

	.p-contact__container_address .tel {
		margin-left: 1.5em;
	}
}

/* ----------------------------------------------
 * youtube
 ---------------------------------------------- */
.p-sns .movie .inner {
	position: relative;
    width: 100%;
    padding-top: 56.25%;
	height: 0;
}

.p-sns .movie .inner iframe {
	position: absolute;
	top: 0;
	left:0;
	width: 100%;
	height: 100%;
}

@media screen and (min-width: 900px) {
	.p-sns .movie {
		width: 69.375vw;
		margin: 0 auto;
		padding-top: 8.75vw;
	}
}

.p-contact__container dt {
	font-size: 1.6rem;

}

@media screen and (min-width: 900px) {
	.p-contact__container {
		display: block;
		padding: 0 0 2.75vw;
	}

	.p-contact__container dl {
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: left;
	}
}