@charset "utf-8";
.l-contents__lbg {
	position: absolute;
	height:276px;
	top:-150px;
	left:0;
	right:0;
	background:url(../img/common/contents_lbg.jpg) no-repeat center center / cover;
	transform:skewY(-10deg);
}
.artist__bottom .l-contents__lbg {
	position: absolute;
	height:276px;
	top:-80px;
	left:0;
	right:0;
	background:url(../img/common/contents_lbg.jpg) no-repeat center center / cover;
	transform:skewY(10deg) rotateY(180deg);
}
@media screen and (max-width:768px){
	.l-contents__lbg {
		top:-14.3333vw;
		height:36.8vw !important;
	}
}
.contents__title {
	color:#FFF;
}
.artist__lists {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	/*margin-bottom:2.5em;*/
}
.artist__lists.member7 {
	justify-content: flex-start;
}
.artist__lists li {
	width:calc(100% / 7);
	padding:0 6px 25px 7px;
	position: relative;
}
@media screen and (max-width:768px){
	.artist__lists.member3 {
	justify-content: flex-start;
}
	.artist__lists li {
		width:calc(100% / 3);
		padding:0 1vw 4vw;
	}
}
.artist__lists li.hr {
	height:0;
	padding:0;
	width:100%;
}
@media screen and (max-width:768px){
	.artist__lists li.hr {
		display: none;
	}
}
.artist__lists li a {
	display: block;
	position: relative;
	text-decoration: none;
}
@media screen and (hover:hover){
	.artist__lists li a:before {
		content:'';
		display: block;
		position: absolute;
		left:0;
		top:0;
		right:0;
		padding-bottom:100%;
		border-radius: 10px;
		background: linear-gradient(109deg, rgba(179,153,198,1) 0%,rgba(232,135,126,1) 50%,rgba(179,153,198,1) 100%);
		filter:blur(8px);
		opacity:0;
		transition: all 0.3s ease;
	}
	.artist__lists li a:hover:before {
		opacity:1;
		transform:scale(1.05);
	}
}
.artist__thumb {
	position: relative;
	width:100%;
	top:0;
	left:0;
	border-radius: 10px;
	overflow: hidden;
	padding-top:100%;
	transition: all 0.3s ease;
	margin-bottom: 10px;
	background:#fff;
}
@media screen and (max-width:768px){
	.artist__thumb {
		border-radius:5px;
		margin-bottom:2.5vw;
	}
}
@media screen and (hover:hover){
	.artist__lists li a:hover .artist__thumb {
		transform: scale(1.05)
	}
}
.artist__thumb img {
	width:100%;
	height:100%;
	position: absolute;
	left:0;
	top:0;
	object-fit: contain;
	pointer-events: none;
}
.artist__name {
	font-size:16px;
	display: flex;
	justify-content: center;
	transform:rotate(0.03deg);
}
@media screen and (max-width:768px){
	.artist__name {
		font-size:3.2vw;
	}
}
.artist__enName {
	font-size:14px;
	display: flex;
	justify-content: center;
	transform:rotate(0.03deg);
}
@media screen and (max-width:768px){
	.artist__enName {
		font-size:3.2vw;
	}
}
.artist__group {}
.artist__group-hero {
	width:100%;
	position: relative;
	background-size:cover;
	background-position: center center;
	pointer-events: none;
}
.artist__group-hero:before {
	content:'';
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:rgba(0,0,0,.6);
	-webkit-backdrop-filter:blur(8px);
	backdrop-filter:blur(8px);
}
.artist__group-hero-inner {
	position: relative;
	margin:0 auto;
	max-width:1200px;
	width:100%;
}
.artist__group-hero-inner img {
	width:100%;
	height:auto;
	pointer-events: none;
}
.artist__group-logo {
	position: absolute;
	left:min(5%,56px);
	right:min(5%,56px);
	bottom:max(-113px,-9.38vw);
	height:min(225px,18.75vw);
	z-index:5;
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
}
@media screen and (max-width:768px){
	.artist__group-logo {
		bottom:-12.6vw;
		height:25.2vw;
	}
}
.artist__group-catch {
	padding:160px min(5%,56px) 40px;
	display: flex;
	justify-content: center;
	margin-bottom:60px;
}
@media screen and (max-width:768px){
	.artist__group-catch {
		padding:17vw 5% 10vw;
		margin-bottom:9.6vw;
	}
}
.artist__group-catch p {
	text-align: center;
	font-size:min(25px,2.6666vw);
	line-height: 1.75;
	font-weight: 700;
	color:var(--color-blue);
}
@media screen and (max-width:768px){
	.artist__group-catch p {
		font-size:3.8vw;
	}
}
.artist__single {
	min-height:min(60vw,720px);
	display: flex;
	position: relative;
	margin-bottom:60px;
}
@media screen and (max-width:768px){
	.artist__single {
		min-height:153.3333vw;
		margin-bottom:9.6vw;
	}
}
.artist__main {
	max-width: 1200px;
	width:100%;
	margin:0 auto;
	padding:min(3.3333%,40px) min(7.5%,90px);
	position: relative;
	min-height:min(60vw,720px);
	display: flex;
	justify-content: space-between;
	align-items: center;
}
@media screen and (max-width:768px){
	.artist__main {
		max-width:unset;
		padding:12vw 5vw;
		min-height:153.3333vw;
		display: block;
	}
}
.artist__main-img {
	position: absolute;
	width:100%;
	left:0;
	bottom:0;
}
.artist__main-img:before {
	content:'';
	position: relative;
	display: block;
	width:100%;
	padding-top:60%;
}
@media screen and (max-width:768px){
	.artist__main-img:before {
		padding-top:153.3333vw;
	}
}
.artist__main-img img {
	display: block;
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	pointer-events: none;
}
.artist__left {
	width:36%;
	position: relative;
	z-index:500;
}
@media screen and (max-width:768px){
	.artist__left {
		width:66%;
	}
}
.artist__lname {
	font-size:60px;
	word-break: keep-all;
	overflow-wrap: break-word;
	line-height:1;
	color:var(--color-blue);
	margin-bottom:20px;
}
@media screen and (max-width:768px){
	.artist__lname {
		font-size:8vw;
		margin-bottom:4vw;
	}
}
.artist__lname span {
	font-size:30px;
	display: block;
	padding-top:0.5em;
}
@media screen and (max-width:768px){
	.artist__lname span {
		font-size:4vw;
	}
}
.artist__birthday {
	width:86%;
	border:3px solid var(--color-blue);
	padding:5px;
	display: flex;
	margin-bottom:30px;
}
@media screen and (max-width:768px){
	.artist__birthday {
		width:75%;
		border:2px solid var(--color-blue);
		padding:2px;
		margin-bottom:3vw;
		font-size:3.2vw;
	}
}
.artist__birthday dt {
	width:32%;
	padding:.6em;
	line-height:1;
	color:var(--color-blue);
	transform:rotate(0.03deg);
	text-align: center;
}
.artist__birthday dd {
	width:68%;
	text-align: center;
	background:var(--color-blue);
	padding:.6em;
	line-height:1;
	transform:rotate(0.03deg);
	color:#fff;
}
.artist__description {
	width:86%;
	font-size:15px;
	transform:rotate(0.03deg);
	color:#000;
	margin-bottom:30px;
	text-shadow:
		-1px 0px 0px #fff,
		0px 0px 0px #fff,
		1px 0px 0px #fff,
		-1px 1px 0px #fff,
		0px 1px 0px #fff,
		1px 1px 0px #fff,
		-1px -1px 0px #fff,
		0px -1px 0px #fff,
		1px -1px 0px #fff;

}
@media screen and (max-width:768px){
	.artist__description {
		width:75%;
		font-size:2.8vw;
		margin-bottom:4vw;
	}
}
.artist__yt {
	width:86%;
}
@media screen and (max-width:768px){
	.artist__yt {
		width:75%;
	}
}
.artist__ytin {
	position: relative;
	width:100%;
	padding-top:56.25%;
	border-radius: 10px;
	overflow: hidden;
}
@media screen and (max-width:768px){
	.artist__ytin {
		border-radius: 5px;
	}
}
.artist__ytin iframe {
	display: block;
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.artist__right {
	width:20%;
	position: relative;
	z-index:500;
	height:100%;
	display: flex;
	align-items: flex-end;
}
@media screen and (max-width:768px){
	.artist__right {
		padding-top:7vw;
		width:49%;
		height:auto;
	}
}
.artist__accounts {
	width:100%;
}
.artist__accounts dt {
	text-align: center;
	font-size:min(34px,2.8333vw);
	color:var(--color-pink);
	text-shadow: 0px 0px 2px #FFF, 1px 0px 2px #FFF, 1px 0px 2px #FFF, -1px 0px 2px #FFF, -1px 0px 2px #FFF, 0px 1px 2px #FFF, 1px 1px 2px #FFF, 1px 1px 2px #FFF, -1px 1px 2px #FFF, -1px 1px 2px #FFF, 0px 1px 2px #FFF, 1px 1px 2px #FFF, 1px 1px 2px #FFF, -1px 1px 2px #FFF, -1px 1px 2px #FFF, 0px 1px 2px #FFF, 1px 1px 2px #FFF, 1px 1px 2px #FFF, -1px 1px 2px #FFF, -1px 1px 2px #FFF, 0px -1px 2px #FFF, 1px -1px 2px #FFF, 1px -1px 2px #FFF, -1px -1px 2px #FFF, -1px -1px 2px #FFF, 0px -1px 2px #FFF, 1px -1px 2px #FFF, 1px -1px 2px #FFF, -1px -1px 2px #FFF, -1px -1px 2px #FFF, 0px -1px 2px #FFF, 1px -1px 2px #FFF, 1px -1px 2px #FFF, -1px -1px 2px #FFF, -1px -1px 2px #FFF;
	line-height:1;
	margin-bottom:0.7em;
}
@media screen and (max-width:768px){
	.artist__accounts dt {
		font-size:4vw;
	}
}
.artist__accounts dd {
	margin-top:6px;
}
@media screen and (max-width:768px){
	.artist__accounts dd {
		margin-top:1.5vw;
	}
}
.artist__accounts dd a {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size:min(16px,1.3333vw);
	color:var(--color-pink);
	background:#FFF;
	border-radius: 25px;
	height:min(50px,4.2vw);
	text-decoration: none;
	transition:all 0.3s ease;
	border:2px solid var(--color-pink);
}
@media screen and (max-width:768px){
	.artist__accounts dd a {
		font-size:3.2vw;
		border-radius:4vw;
		height:7.4666vw;
	}
}
@media screen and (hover:hover){
	.artist__accounts dd a:hover {
		transform:scale(1.05);
		background:var(--color-pink);
		color:#fff;
	}
}
.artist__accounts dd a span {
	display: block;
	transform:rotate(0.03deg);
}
.sortSwitcher {
	position: absolute;
	right:6px;
	top:-60px;
	display: flex;
}
@media screen and (max-width:768px){
	.sortSwitcher {
		position: relative;
		right:unset;
		top:unset;
		justify-content: center;
		margin-bottom:5vw;
	}
}
.sortSwitcher li {
	width:140px;
	margin-left:10px;
}
@media screen and (max-width:768px){
	.sortSwitcher li {
		width:30vw;
		margin:0 1vw;
	}
}
.sortSwitcher li a {
	display: flex;
	justify-content: center;
	align-items: center;
	height:30px;
	border-radius: 20px;
	border:2px solid var(--color-darkblue);
	color:var(--color-darkblue);
	text-decoration: none;
	transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.sortSwitcher li a {
		height:8vw;
		border-radius:4vw;
		font-size:3.2vw;
	}
}
@media screen and (hover:hover){
	.sortSwitcher li a:hover {
		background:rgba(1,16,81,0.7);
		color:#FFF;
	}
}
.sortSwitcher li a.active {
	background: var(--color-darkblue);
	color:#FFF;
}

.artist__pager {
	position: absolute;
	left:min(20px,1.6666vw);
	right:min(20px,1.6666vw);
	top:50%;
	z-index:500;
	pointer-events: none;
	margin-top:max(-20px,-1.6666vw);
	display: flex;
	justify-content: space-between;
}
@media screen and (max-width:768px){
	.artist__pager {
		position: absolute;
		left:6.4vw;
		right:6.4vw;
		top:0;
		margin-top:0;
	}
}
.artist__pager li {
	width:min(40px,3.3333vw);
	height: min(40px,3.3333vw);
}
@media screen and (max-width:768px){
	.artist__pager li {
		width:7vw;
		height: 7vw;
	}
}
.artist__pager li a {
	display: flex;
	justify-content: center;
	align-items: center;
	width:min(40px,3.3333vw);
	height:min(40px,3.3333vw);
	border-radius: 50%;
	background:var(--color-blue);
	position: relative;
	pointer-events: auto;
	transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.artist__pager li a {
		width:7vw;
		height:7vw;
	}
}
@media screen and (hover:hover){
	.artist__pager li a:hover {
		transform:scale(1.15);
	}
}
.artist__pager li a:before {
	content:'';
	position: absolute;
	left:50%;
	top:50%;
	margin-top:max(-6px,-0.5vw);
	width:min(12px,1vw);
	height:min(12px,1vw);
	box-sizing: border-box;
	transform:rotate(45deg);
}
@media screen and (max-width:768px){
	.artist__pager li a:before {
		margin-top:-1vw;
		width:2vw;
		height:2vw;
		box-sizing: border-box;
		transform:rotate(45deg);
	}
}
.artist__pager li:first-child a:before {
	border-left:2px solid #fff;
	border-bottom:2px solid #fff;
	margin-left:max(-4px,-0.3333vw);
}
@media screen and (max-width:768px){
	.artist__pager li:first-child a:before {
		margin-left:-0.6666vw;
	}
}
.artist__pager li:last-child a:before {
	border-right:2px solid #fff;
	border-top:2px solid #fff;
	margin-left:max(-8px,-0.6666vw);
}
@media screen and (max-width:768px){
	.artist__pager li:last-child a:before {
		margin-left:-1.3333vw;
	}
}
.artist__group {
	padding:min(40px,3.3333vw) 0 min(50px,4.1666vw);
	border-bottom:1px dotted var(--color-pink);
}
@media screen and (max-width:768px){
	.artist__group {
		padding:6.4vw 0 3.2vw;
	}
}
.group__title {
	width:346px;
	height:56px;
	margin:0 auto min(30px,2.5vw);
}
@media screen and (max-width:768px){
	.group__title {
		width:46.1333vw;
		height:7.4666vw;
		margin:0 auto 3.2vw;
	}
}
.group__title a {
	display: flex;
	justify-content: center;
	align-items: center;
	height:56px;
	border-radius: 28px;
	background: linear-gradient(109deg, rgba(179,153,198,1) 0%,rgba(232,135,126,1) 50%,rgba(179,153,198,1) 100%);
	background-size:200% 100%;
	background-position: left center;
	text-decoration: none;
	color:#FFF;
	font-size:min(18px,1.5vw);
	position: relative;
	transition: all 0.3s ease;
}
@media screen and (max-width:768px){
	.group__title a {
		height:7.4666vw;
		border-radius: 4vw;
		font-size:3.6vw;
	}
}
@media screen and (hover:hover){
	.group__title a:hover {
		background-position:right top;
		transform:scale(1.05);
	}
}
.content__more {
	margin-top:2.5em;
}
.artist__tags {
	display: flex;
	flex-wrap: wrap;
	margin-bottom:15px;
}
@media screen and (max-width:768px){
	.artist__tags {
		margin-bottom:1.6vw;
	}
}
.artist__tag {
	margin:0 10px 10px 0;
}
@media screen and (max-width:768px){
	.artist__tag {
		margin:0 1.2vw 1.2vw 0;
	}
}
.artist__tagName {
	display:flex;
	align-items: center;
	padding:0 24px;
	background:var(--color-blue);
	height:32px;
	border-radius: 16px;
	line-height:1;
	color:#fff;
	padding-bottom:2px;
	transform:rotate(0.03deg);
}
@media screen and (max-width:768px){
	.artist__tagName {
		padding:0 2.8vw;
		height:6.4vw;
		border-radius:3.2vw;
		padding-bottom:0.1vw;
		font-size:2.8vw;
	}
}