@charset "utf-8";
/* ============= */
main {
		padding: 80px 0 0;
}
@media(max-width: 767px) {
		main {
				padding: 30px 0 0;
		}
}
/* ============= */
.kv {
		background: #fff;
		position: relative;
		height: 100vh;
		display: flex;
		justify-content: center;
		align-items: center;
}
.kv .kv_right_parts {
		font-family: 'Poppins', sans-serif;
		font-weight: 600;
		font-size: 14px;
		letter-spacing: 0.04em;
		color: #fff;
		position: absolute;
		right: -150px;
		top: 50%;
		display: flex;
		align-items: center;
		transform: rotate(90deg);
		width: 420px;
}
.kv_right_parts a {
		color: #fff;
		text-decoration: none;
}
.kv_right_copyright {
		margin-right: 20px;
}
@media(max-width: 767px) {
		.kv .kv_right_parts {
				display: none
		}
}
.kv .kv_news {
		position: absolute;
		left: 60px;
		bottom: 60px;
		height: 40px;
		color: #fff;
		z-index: 10;
		display: flex;
}
.kv_news_hd {
		font-family: 'Poppins', sans-serif;
		font-size: 16px;
		font-weight: 600;
		margin-right: 20px;
		position: relative;
}
.kv_news_hd span {
		position: relative;
		display: inline-block;
}
.kv_news_hd span::after {
		content: '';
		display: block;
		width: 12px;
		height: 1px;
		background: #fff;
		position: absolute;
		top: 14px;
		right: -15px;
		transform: rotate(110deg);
}
.kv_news_cont {
		flex: 1;
		position: relative;
		top: 5px;
}
.kv_news a {
		color: #fff;
		text-decoration: none;
}
.kv_news a dl {
		font-size: 14px;
		height: 40px;
}
.kv_news a dl dt {
		font-weight: 500;
		margin: 0 0 3px;
}
.kv_news a dl dd p {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
		-webkit-line-clamp: 1;
}
.kv_news_cont .swiper {
		height: 40px;
		width: 450px;
}
@media(max-width: 767px) {
		.kv .kv_news {
				display: block;
				left: 30px;
				bottom: 20px;
				height: 80px;
				width: calc(100% - 50px);
		}
		.kv_news_hd {
				font-size: 14px;
				margin: 0;
		}
		.kv_news_hd span::after {
				top: 11px;
				right: -15px;
		}
		.kv_news_cont {
				top: 0;
		}
		.kv_news_cont .swiper {
				height: 40px;
				width: auto;
		}
		.kv_news a dl {
				display: flex;
				align-items: center;
				font-size: 13px;
		}
		.kv_news a dl dt {
				margin-right: 5px;
				letter-spacing: 0;
		}
		.kv_news a dl dd {
				flex: 1;
				position: relative;
				top: -2px;
		}
}
.kv .kv_scroll_outer {
		width: 90px;
		height: 94px;
		position: absolute;
		left: 0px;
		top: calc(50vh - 50px);
		z-index: 10;
		display: flex;
		justify-content: center;
		align-items: flex-end;
}
@media(max-width: 767px) {
		.kv .kv_scroll_outer {
				display: none
		}
}
.kv_scroll_outer {
		transition: opacity 0.5s;
}
.kv_scroll_outer.inactive {
		opacity: 0;
}
.kv_scroll_outer p {
		font-family: 'Poppins', sans-serif;
		font-weight: 600;
		letter-spacing: 1px;
		font-size: 14px;
		position: absolute;
		top: -40px;
		left: 20px;
		transform: rotate(90deg);
		color: #fff;
}
.kv_scroll_bar {
		height: 94px;
		width: 1px;
		background: none;
		margin: 10px auto 0;
		position: relative;
}
.kv_scroll_bar::after {
		content: '';
		display: block;
		width: 1px;
		height: 94px;
		position: absolute;
		left: 5px;
		top: 10px;
		background: #fff;
		transform-origin: center top;
		transform: scale(0);
		animation: kvScroll 2s ease infinite;
}
@keyframes kvScroll {
		0%, 15% {
				transform: scale(0);
				opacity: 0;
		}
		30% {
				transform: scale(1);
				opacity: 1;
		}
		80% {
				transform: scale(1);
				opacity: 1;
		}
		100% {
				transform: scale(1);
				opacity: 0;
		}
}
/* ================ */
/* ============= */
.artist_section {
		padding-bottom: 120px;
}
@media(max-width: 960px) {
		.artist_section {
				padding-bottom: 120px;
		}
}
@media(max-width: 767px) {
		.artist_section {
				padding-bottom: 80px;
		}
}
.artist_base.satoh {
		margin-top: 180px;
		position: relative;
}
.artist_base.kamiki {
		margin-left: 20vw;
		position: relative
}
.artist_satoh img {
		width: 100%;
		height: auto;
		mask-image: url("../images/top_artist_mask_l.svg");
		-webkit-mask-image: url("../images/top_artist_mask_l.svg");
		mask-repeat: no-repeat;
		-webkit-mask-repeat: no-repeat;
		mask-size: cover;
		-webkit-mask-size: cover;
		mask-position: 0 0;
		-webkit-mask-position: 0 0;
		opacity: 0;
}
.artist_kamiki img {
		width: 100%;
		height: auto;
		mask-image: url("../images/top_artist_mask_r.svg");
		-webkit-mask-image: url("../images/top_artist_mask_r.svg");
		mask-repeat: no-repeat;
		-webkit-mask-repeat: no-repeat;
		mask-size: cover;
		-webkit-mask-size: cover;
		mask-position: 0 0;
		-webkit-mask-position: 0 0;
		opacity: 0;
}
.artist_satoh {
		width: 70vw;
		padding: 4vw 18vw 4vw 0;
		background-repeat: no-repeat;
		background-position: right top;
		background-size: 100%;
		background-image: url("../images/top_artist_bg_left_pc.png");
}
.artist_kamiki {
		width: 70vw;
		padding: 4vw 0 4vw 18vw;
		background-repeat: no-repeat;
		background-position: left bottom;
		background-size: 100%;
		background-image: url("../images/top_artist_bg_right_pc.png");
}
.isActive .artist_satoh img {
		animation: moveLeft 0.6s cubic-bezier(0.11, 0, 0.5, 0) forwards;
		opacity: 1
}
.isActive .artist_kamiki img {
		animation: moveRight 0.6s cubic-bezier(0.11, 0, 0.5, 0) forwards;
		opacity: 1
}
@media (hover: hover) {
		.name_wrap:hover .name_base::after {
				transform: scaleX(1);
		}
}
.name_slide .name_base img {
		opacity: 1;
}
.artist_section .name_slide .more_btn {
		opacity: 1;
}
@keyframes moveLeft {
		0% {
				-webkit-mask-position: 600% 0;
				opacity: 0;
		}
		100% {
				-webkit-mask-position: 100% 0;
				opacity: 1
		}
}
@keyframes moveRight {
		0% {
				-webkit-mask-position: -600% 0;
				opacity: 0;
		}
		100% {
				-webkit-mask-position: 0% 0;
				opacity: 1;
		}
}
@keyframes moveLeftSP {
		0% {
				-webkit-mask-position: 100vw 0;
				opacity: 0;
		}
		100% {
				-webkit-mask-position: 0% 0;
				opacity: 1;
		}
}
.name_wrap {
		cursor: pointer;
}
.artist_base .name_wrap {
		position: absolute;
		top: calc(50% - 95px);
		height: 190px;
}
.name_wrap h2 {
		position: relative;
		z-index: 5
}
.name_wrap h2 img {
		width: 100%;
		height: auto;
}
.artist_base.satoh .name_wrap {
		left: 56vw;
}
.name_base {
		padding: 25px 50px;
		box-sizing: border-box;
		position: relative;
		margin: 0 0 30px;
		display: inline-block;
}
.name_base.kamiki {
		padding-bottom: 15px;
}
.name_base::before, .name_base::after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		transform-origin: left center;
		transform: scaleX(0);
		opacity: 1;
		transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s;
}
.name_base.kamiki::before, .name_base.kamiki::after {
		transform-origin: right center;
}
.name_base::before {
		background: #fff;
}
.name_base::after {
		transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.7s;
}
.isActive .name_base::before {
		opacity: 1;
		transform: scaleX(1)
}
.name_base::after {
		opacity: 1;
		background: #3D3A39;
}
.artist_satoh_name h2 {
		width: 510px;
}
.artist_kamiki_name h2 {
		width: 690px;
}
.artist_base.kamiki .name_wrap {
		left: 0;
}
.name_base path {
		transition: fill 0.2s;
}
@media (hover: hover) {
		.name_wrap:hover .name_base path {
				fill: #fff !important;
		}
		.name_wrap:hover .name_base img {
				filter: invert(1) brightness(2);
		}
}
@media(max-width: 2100px) {
		.artist_satoh_name h2 {
				width: 22vw;
		}
		.artist_kamiki_name h2 {
				width: 29.76vw;
		}
		.artist_base .name_wrap {
				top: calc(50% - 8.5vw);
				height: 17vw;
		}
}
@media(max-width: 1600px) {
		.name_base {
				padding: 15px 30px;
		}
		.name_base.kamiki {
				padding-bottom: 5px;
		}
}
@media(max-width: 960px) {
		.name_base {
				margin-bottom: 15px;
		}
}
@media(max-width: 767px) {
		.artist_base.satoh {
				margin-top: 60px;
				margin-bottom: 30px;
		}
		.artist_satoh, .artist_kamiki {
				width: 80vw;
		}
		.artist_satoh, .artist_kamiki {
				padding: 0;
				background: none;
		}
		.artist_satoh img, .artist_kamiki img {
				width: 100%;
				height: auto;
				mask-image: url("../images/top_artist_mask_sp.png");
				-webkit-mask-image: url("../images/top_artist_mask_sp.png");
				mask-repeat: no-repeat;
				-webkit-mask-repeat: no-repeat;
				mask-size: cover;
				-webkit-mask-size: cover;
				mask-position: 0 0;
				-webkit-mask-position: 0 0;
				opacity: 0;
		}
		.isActive .artist_satoh img {
				animation: moveLeftSP 0.8s cubic-bezier(0.32, 0, 0.67, 0) forwards;
		}
		.isActive .artist_kamiki img {
				animation: moveLeftSP 0.8s cubic-bezier(0.32, 0, 0.67, 0) forwards;
		}
		.artist_satoh, .artist_kamiki {
				width: calc(100vw - 50px);
		}
		.artist_base.kamiki {
				margin-left: 50px;
		}
		.artist_base.satoh .artist_satoh_name {
				height: 100px;
				top: inherit;
				bottom: 10px;
				left: inherit;
				right: 0;
		}
		.artist_satoh_name h2 {
				width: 44vw;
		}
		.name_base {
				padding: 8px 20px 5px;
		}
		.name_base.kamiki {
				padding-bottom: 0px;
				padding-left: 30px;
		}
		.artist_base.kamiki .artist_kamiki_name {
				position: absolute;
				height: 100px;
				top: inherit;
				bottom: 10px;
				right: inherit;
				left: -30px
		}
		.artist_kamiki_name h2 {
				width: 63vw;
		}
		.artist_satoh_name .linkBtn a, .artist_kamiki_name .linkBtn a {
				width: 150px;
				height: 35px;
				font-size: 12px;
		}
		.artist_satoh_name .linkBtn {
				transform: translateX(0px);
		}
		.artist_kamiki_name .linkBtn {
				transform: translateX(20px);
		}
}
/* ============= */
.section_title {
		max-width: 1500px;
		margin: 0 auto;
		padding: 0 30px;
		position: relative;
		z-index: 10;
}
.news_section .section_title {
		margin-bottom: 80px;
}
@media(max-width: 767px) {
		.news_section .section_title {
				display: none
		}
}
.section_title h2 {
		font-family: 'Poppins', sans-serif;
		font-weight: 600;
		font-size: 60px;
		letter-spacing: 0;
}
.section_title h2 span {
		position: relative;
		display: inline-block;
}
.news_section h2 span::after, .concept_section h2 span::after {
		content: '';
		display: block;
		width: 4px;
		height: 50px;
		background: #3D3A39;
		position: absolute;
		top: 25px;
		right: -40px;
		transform: skew(-20deg);
}
@media(max-width: 767px) {
		.concept_section .section_title {
				text-align: center;
		}
		.news_section h2 span::after, .concept_section h2 span::after {
				display: none
		}
}
@media(max-width: 767px) {
		.section_title h2 {
				font-size: 40px;
		}
}
.concept_section {
		background: #fff;
		padding: 0 30px 100px;
}
.concept_inner {
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 180px 0;
}
.concept_logo {
		width: 500px;
		margin: 0 auto 100px;
}
.concept_logo img {
		width: 100%;
		height: auto
}
.concept_body p {
		font-size: 18px;
		line-height: 2.8;
		text-align: center;
		letter-spacing: 0.08em;
}
@media(max-width: 960px) {
		.concept_logo {
				width: 400px;
				margin: 0 auto 80px;
		}
}
@media(max-width: 767px) {
		.concept_section {
				padding: 80px 0px;
		}
		.concept_inner {
				padding: 80px 0;
		}
		.concept_logo {
				width: 240px;
				margin-bottom: 60px;
		}
		.concept_body p {
				font-size: 14px;
				line-height: 2.2;
		}
}