@charset "utf-8";

.wrap {
	max-width:none;
	background-color:#2EA999;
	color:#FFF;
}

/* main_artist
---------------------------------------------- */

#music {
	width:calc(100% - 90px);
	max-width:620px;
	margin:0 auto;
	padding-top:120px;
}
	@media(max-width:767px) {
		#music {
			padding-top:90px;
		}
	}

#music > header {
	position:relative;
	width:275px;
	margin:0 auto 100px auto; /* margin:0 auto 60px auto; */
}
	@media(max-width:767px) { /* hontohanasi */
		#music > header { /* hontohanasi */
			margin:0 auto 50px auto; /* hontohanasi */
		} /* hontohanasi */
	} /* hontohanasi */
	@media(max-width:479px) { /* hontohanasi */
		#music > header { /* hontohanasi */
			margin:0 auto 90px auto; /* hontohanasi */
		} /* hontohanasi */
	} /* hontohanasi */

#music > header > strong {
	font-size:15px;
	display:block;

	font-family: "Tsukimi Rounded", sans-serif;
	font-weight: 500;
	font-style: normal;
}
#music > header > span > img {
	width:227px;
	padding:12px 0 18px 0;
	max-width:100%;
}
#music > header > h1 {
	color:#BE1D63;
	font-size:20px;
	display:block;
	margin-bottom:20px;

	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 800;
	font-style: normal;
}
#music > header > a.pcOnly > img {
	width:100%;
}
#music > header > a.spOnly > img {
	width:100px;
}

#music > header > img {
	width:240px;
	position:absolute;
	top:-30px;
	right:-380px;
}
	@media(max-width:1279px) {
		#music > header > img {
			width:200px;
			right:-260px;
		}
	}
	@media(max-width:979px) {
		#music > header > img {
			width:160px;
			right:-130px;
		}
	}
	@media(max-width:767px) {
		#music > header > img {
			width:120px; /* width:150px; */
			right:-70px;
			top:0px; /* top:100px; */
		}
	}
	@media(max-width:479px) {
		#music > header > img {
			width:125px;
			right:0px; /* right:30px; */
			top:80px;  /* hontohanasi */
		}
	}

#music > header > img {
  animation: anime2 2s ease-in-out infinite;
}
@keyframes anime2 {
  0%  {
    transform: scale(1.0, 1.0) translate(0, 0);
  }
  10% {
    transform: scale(0.98, 0.9) translate(0, 5px);
  }
  20% {
    transform: scale(1.02, 1.0) translate(0, 8px);
  }
  35% {transform: scale(0.98, 1.05) translate(0, -8px);
  }
  50% {
    transform: scale(1.0, 0.9) translate(0, 5px);
  }
  70% {
    transform: scale(1.0, 1.0) translate(0, 0);
  }
  0%, 100% {
    opacity: 1;
  }
}



#main_artist > header, #local_artist > header {
	color:#BE1D63;
	text-align:center;
	margin-bottom:25px;

	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 600;
	font-style: normal;
}
#main_artist > header > h2, #local_artist > header > h2 {
	font-size:26px;
	margin-bottom:5px;
}
#main_artist > header > span, #local_artist > header > span {
	font-size:14px;
}
#main_artist > ul, #local_artist > ul {
	max-width:620px;
	margin-bottom:80px;
}
#main_artist > ul > li {
	margin-bottom:100px;
}
	@media(max-width:767px) {
		#main_artist > ul > li {
			margin-bottom:75px;
		}
	}

#local_artist > ul {
	display:flex;
	flex-wrap:wrap;
}
#local_artist > ul > li, #dj > ul > li, #show > ul > li {

	width:45%;
	float:left;
	margin-right:10%;
	margin-bottom:40px;
}
#local_artist > ul > li:nth-child(2n), #dj > ul > li:nth-child(2n), #show > ul > li:nth-child(2n) {
	margin-right:0;
}

	@media(max-width:767px) {
		#local_artist > ul > li, #dj > ul > li, #show > ul > li {
			width:100%;
			float:none;
			margin-right:0;
		}
	}

#main_artist > ul > li img, #local_artist > ul > li img, #dj > ul > li img, #show > ul > li img {
	width:100%;
	margin-bottom:15px;
}
#main_artist > ul > li > a:hover > img, #local_artist > ul > li > a:hover > img, #dj > ul > li > a:hover > img {
	opacity:0.8;
}
#main_artist > ul > li > a:hover, #local_artist > ul > li > a:hover, #dj > ul > li > a:hover {
	color:#006D63;
}
#main_artist > ul > li h3, #local_artist > ul > li h3, #dj > ul > li h3, #show > ul > li h3 {
	font-size:22px;
	margin-bottom:15px;
	text-align:center;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 600;
	font-style: normal;
}
#show > ul > li h3 {
	line-height:1.2;
}
#main_artist > ul > li h3 > span, #local_artist > ul > li h3 > span, #dj > ul > li h3 > span, #show > ul > li h3 > span {
	font-size:13px;
	display:block;
	margin-top:5px;
	text-align:center;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 600;
	font-style: normal;
}
#main_artist > ul > li > p, #local_artist > ul > li > p, #dj > ul > li > p, #show > ul > li > p {
	font-size:13px;
	line-height:1.8;
	text-align: justify;
}
#main_artist > ul > li > p > a:hover, #local_artist > ul > li > p > a:hover, #dj > ul > li > p > a:hover {
	color:#006D63;
}

div#dj {
	margin-bottom:120px;
}
div#dj > h3 {
	font-size:24px;
	text-align:center;
	color:#BE1D63;
	margin-bottom:10px;
}


div.stage {
	color:#0E6158;
	background-color:#FEAC39;
	padding:30px 35px;
	border-radius:10px;
	line-height:1.6;
	margin-bottom:80px;

	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-size:17px;
}
	@media(max-width:479px) {
		div.stage {
			padding:20px 20px;
		}
	}

div.stage > h3 {
	line-height:1.3;
	font-size:22px;
	display:block;
	text-align:center;
	margin-bottom:15px;

	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 600;
	font-style: normal;
}

div.stage > p {
	width:60%;
	float:left;
}
	@media(max-width:767px) {
		div.stage > p {
			width:auto;
			float:none;
		}
	}

div.stage > figure {
	padding-top:5px;
	width:35%;
	float:right;
}
	@media(max-width:767px) {
		div.stage > figure {
			padding-top:15px;
			width:100%;
			float:none;
		}
	}

div.stage > figure > a {
	color:#0E6158;
}
div.stage > figure > a > img {
	width:100%;
	margin-bottom:5px;
}
div.stage > figure > a > figcaption {
	font-size:15px;
}



/* show
---------------------------- */

.wrap2 {
	max-width:none;
	background-color:#2B66A0;
	color:#FFF;
}

#show {
	width:calc(100% - 90px);
	max-width:620px;
	margin:0 auto;
	padding-top:80px;
}
	@media(max-width:767px) {
		#show {
			padding-top:60px;
		}
	}

#show > header {
	width:275px;
	margin:0 auto 50px auto;
}

#show > header > strong {
	font-size:15px;
	display:block;

	font-family: "Tsukimi Rounded", sans-serif;
	font-weight: 500;
	font-style: normal;
}
#show > header > span > img {
	width:200px;
	padding:12px 0 18px 0;
	max-width:100%;
}
#show > header > h2 {
	color:#FFB516;
	font-size:20px;
	display:block;
	margin-bottom:20px;

	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 800;
	font-style: normal;
}