/*	.artist
============================== */
.artist {
	position:relative;
}
.artist:before {
	content:"";
	background-color:hsla(0,0%,0%,0.9);
	background-image:url(../img/bg_black.svg);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:100% 100%;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	-webkit-transform:skewY(-5deg);
	transform:skewY(-5deg);
	z-index:-1;
}
#dance .artist:before {
	content:"";
	background-color:hsla(240,82%,45%,0.7);
	background-image:none;
}
#stage .artist:nth-child(odd):before {
	content:"";
	background-color:hsla(240,82%,45%,0.7);
	background-image:none;
}
#stage .artist:nth-child(even):before {
	content:"";
	background-color:hsla(240,82%,45%,0.6);
	background-image:none;
}
.artist article {
	text-align:left;
}
.artist > article > header {
	text-align:center;
}
.artist > article > header h2 {
	color:#fff;
	line-height:1.5;
	margin-bottom:0.5em;
}
.artist > article > header h2:before {
	content:"";
	display:inline-block;
	background-image:url(../img/h2_logo.png);
	background-repeat:no-repeat;
	background-size:cover;
	margin-right:10px;
}

.artist article > section.artist-unit {
/*	background-color:hsla(0,0%,0%,0.5); */
	border:2px solid #fff;
}
.artist > article > section.artist-unit h3 {
	color:#ff00b4;
	color:#fff;
	text-align:center;
	line-height:1.5;
	margin-bottom:0.5em;
}

.artist article p {
	margin-bottom:1em;
}
.artist article header p {
	line-height:1.5;
}
.artist article header p span {
	display:inline-block;
	color:#c2ff00;
	background-image: -webkit-gradient(linear, center top, center bottom, from(transparent), color-stop(0.5, transparent), color-stop(0.5, hsla(221,100%,50%,0.8)), to(hsla(221,100%,50%,0.8)));
	background-image: linear-gradient(transparent 50%, hsla(221,100%,50%,0.8) 50%);
}

.artist article > ul,
.artist article > section.artist-unit ul {
	display:flex;
	flex-wrap: wrap;
	justify-content:left;
}
.artist article > ul.case-center,
.artist article > section.artist-unit ul.case-center {
	justify-content:center;
}
.artist article ul > li,
.artist article > section.artist-unit ul > li {
	display: flex;
	flex-direction:column;
	justify-content: center;
}
.artist article > ul > li a, .artist article > ul > li > span,
.artist article > section.artist-unit ul > li a, .artist article > section.artist-unit ul > li > span {
	display: flex;
	justify-content:center;
	align-items: center;
	text-align:center;
	line-height:1.25;
	padding:1.25em 1em;
	/**/
	height:100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.artist article > ul > li a,
.artist article > section.artist-unit ul > li a {
	color:#000;
	background-color:hsla(0,0%,100%,1);
	text-decoration:none;
	/**/
	background-image: -webkit-gradient(linear, center top, center bottom, from(transparent), color-stop(0.5, transparent), color-stop(0.1, hsla(0,0%,50%,0.1)), to(hsla(0,0%,50%,0.1)));
	background-image: linear-gradient(transparent 50%, hsla(0,0%,50%,0.1) 50%);
}
.artist article > ul > li > span,
.artist article > section.artist-unit ul > li > span {
	color:#c2ff00;
	background-color:hsla(0,0%,100%,0.2);
}
#stage .artist article > ul > li > span,
.artist article > section.artist-unit ul > li > span {
	color:#000;
	background-color:hsla(0,0%,100%,0.7);
}
.artist article > ul > li a:hover,
.artist article > section.artist-unit ul > li a:hover {
	background-color:#ffe04e;
}

.artist article > p,
.artist article > section > p {
	color:#fff;
	text-align:center;
	line-height:1.25;
	margin-bottom:0.5em;
}
.artist article > p:not(:last-child),
.artist article > section > p:not(:last-child) {
	margin-bottom:1.5em;
}
.artist article > p.etc {
	font-weight:bold;
	color:#ff00b4;
	line-height:1.5;
}
@media all and (min-width: 768px) {
/* .artist {
	margin:60px 0;
} */
#artist .artist {
/*	margin-top:60px; */
}
#stage .artist:last-child {
	margin-bottom:60px;
}
.artist article {
	max-width:1080px;
	margin:0 auto;
	padding:80px 0;
}
.artist > article > header h2 {
	font-size:250%;
}
.artist > article > header h2:before {
	width:65px;
	height:84px;
	margin-bottom:-0.5em;
}
.artist article > section.artist-unit {
	padding:24px;
}
.artist article > section.artist-unit:not(:last-child) {
	margin-bottom:40px;
}
.artist > article > section.artist-unit h3 {
	font-size:175%;
}
.artist article header p {
	font-size:175%;
}
.artist > article > ul,
.artist article > section.artist-unit ul {
	gap: 20px;
}
.artist > article > ul.case-misia,
.artist article > section.artist-unit ul.case-misia {
	margin-top:60px;
}
.artist > article > ul > li,
.artist article > section.artist-unit ul > li {
	width:calc((100% - 20*2px)/3);
}
.artist > article > ul > li > a,
.artist article > section.artist-unit ul > li > a,
.artist > article > ul > li > span,
.artist article > section.artist-unit ul > li > span {
	font-size:112.5%;
}
.artist > article > ul:not(:last-child),
.artist article > section.artist-unit ul:not(:last-child) {
	margin-bottom:40px;
}
.artist article p.etc {
	font-size:150%;
}
}
@media all and (min-width: 768px) and (max-width: 979px) {
.artist > article > ul.case-wide > li,
.artist article > section.artist-unit ul.case-wide > li {
	width:65%;
}
}
@media all and (max-width: 767px) {
/* .artist {
	margin:30px 0;
} */
#artist .artist {
/*	margin-top:30px; */
}
#stage .artist:last-child {
	margin-bottom:30px;
}
.artist article {
	padding:40px 10px;
}
.artist article > section.artist-unit {
	padding:12px;
}
.artist article > section.artist-unit:not(:last-child) {
	margin-bottom:20px;
}
.artist > article > header h2 {
	font-size:5vw;
}
.artist > article > header h2:before {
	width:50px;
	height:64px;
	margin-bottom:-0.5em;
}
.artist > article > section.artist-unit h3 {
	font-size:112.5%;
}
.artist article header p {
	font-size:112.5%;
}
.artist article > p {
	font-size:87.5%;
}
.artist article p.etc {
	font-size:100%;
}
.artist > article > ul.case-misia,
.artist article > section.artist-unit ul.case-misia {
	margin-top:30px;
}
.artist > article > ul:not(:last-child),
.artist article > section.artist-unit ul:not(:last-child) {
	margin-bottom:20px;
}
.artist > article > ul > li > a,
.artist article > section.artist-unit ul > li > a,
.artist > article > ul > li > span,
.artist article > section.artist-unit ul > li > span {
	font-size:83%;
}
}
@media all and (min-width: 375px) and (max-width: 767px) {
.artist > article > ul,
.artist article > section.artist-unit ul {
	gap: 10px;
}
.artist > article > ul > li,
.artist article > section.artist-unit ul > li {
	width:calc((100% - 10*1px)/2);
}
.artist > article > ul.case-wide > li,
.artist article > section.artist-unit ul.case-wide > li {
	width:90%;
}
}
@media all and (max-width: 374px) {
.artist > article > ul,
.artist article > section.artist-unit ul {
	flex-direction:column;
}
.artist > article > ul > li,
.artist article > section.artist-unit ul > li {
	width:100%;
}
.artist > article > ul > li:not(:last-child),
.artist article > section.artist-unit ul > li:not(:last-child) {
	margin-bottom:10px;
}
}

/*	.mrk
============================== */
.artist > article > ul > li > a span.mrk {
	display:inline-block;
	text-decoration:none;
	color:#fff;
	background-color:#c00;
	font-weight:bold;
	white-space:nowrap;
	margin-left:1em;
}
@media all and (min-width: 768px) {
.artist > article > ul > li > a span.mrk {
	font-size:14px;
	line-height:24px;
	height:24px;
	padding:0 12px;
	border-radius:12px;
}
}
@media all and (max-width: 767px) {
.artist > article > ul > li > a span.mrk {
	font-size:12px;
	line-height:18px;
	height:18px;
	padding:0 9px;
	border-radius:9px;
}
}
@media all and (min-width: 375px) and (max-width: 767px) {
}
@media all and (max-width: 374px) {
}

/*	.new
============================== */
.artist > article > ul > li.new > a,
.artist > article > ul > li.new > span,
.artist article > section.artist-unit ul > li.new > a,
.artist article > section.artist-unit ul > li.new > span {
	position:relative;
}
.artist > article > ul > li.new > a:after,
.artist > article > ul > li.new > span:after,
.artist article > section.artist-unit ul > li.new > a:after,
.artist article > section.artist-unit ul > li.new > span:after {
	content:"NEW";
	font-size:12px;
	position:absolute;
	display:inline-block;
	text-decoration:none;
	color:#e0ff00;
	background-color:#ff7be0;
	font-weight:bold;
	padding:0 6px;
}
@media all and (min-width: 768px) {
.artist > article > ul > li.new > a:after,
.artist > article > ul > li.new > span:after,
.artist article > section.artist-unit ul > li.new > a:after,
.artist article > section.artist-unit ul > li.new > span:after {
	line-height:18px;
	right:-3px;
	bottom:-3px;
}
}
@media all and (max-width: 767px) {
.artist > article > ul > li.new > a:after,
.artist > article > ul > li.new > span:after,
.artist article > section.artist-unit ul > li.new > a:after,
.artist article > section.artist-unit ul > li.new > span:after {
	line-height:16px;
	right:-2px;
	bottom:-2px;
}
}

/*	.dance
============================== */
.artist > article > ul > li.dance > a {
	position:relative;
}
.artist > article > ul > li.dance > a:before {
	content:"ダンス企画";
	font-size:12px;
	position:absolute;
	display:inline-block;
	text-decoration:none;
	color:#000;
	background-color:#fc0;
	font-weight:bold;
	padding:0 6px;
}
@media all and (min-width: 768px) {
.artist > article > ul > li.dance > a:before {
	line-height:18px;
	left:-3px;
	top:-3px;
}
}
@media all and (max-width: 767px) {
.artist > article > ul > li.dance > a:before {
	line-height:16px;
	left:-2px;
	top:-2px;
}
}

span.cdtv-logo {
	display:inline-block;
	text-indent:110%;white-space:nowrap;overflow:hidden;
	background-image:url(../img/cdtv.png);
	background-repeat:no-repeat;
	background-size:cover;
}
@media all and (min-width: 768px) {
span.cdtv-logo {
	width:196px;
	height:32px;
	margin-bottom:-8px;
}
}
@media all and (max-width: 767px) {
span.cdtv-logo {
	width:147px;
	height:24px;
	margin-bottom:-7px;
}
}