@charset "utf-8";
.second_hdr_inner {
		position: relative;
}
.second_hdr_inner .crew_figure {
		position: absolute;
		width: 560px;
		top: -180px;
		right: 74px;
		z-index: 10;
}
.crew_figure .shadow, .crew_figure .people {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%
}
.crew_figure img {
		width: 100%;
		height: auto;
}
@media(max-width: 1100px) {
		.second_hdr_inner .crew_figure {
				width: 56vw;
				top: -180px;
				right: 30px;
		}
}
@media(max-width: 768px) {
		.page_crew .second_hdr {
				height: calc(135vw + 50px);
				padding-top: 100px;
				display: block;
		}
		.second_hdr_inner .crew_figure {
				position: static;
				position: relative;
				width: 74vw;
				top: inherit;
				right: inherit;
				margin: 30px auto 0;
		}
}
.crew_wrap {
		max-width: 1036px;
		margin: 0 auto;
		min-height: 1000px;
		padding-bottom: 300px;
		position: relative;
		z-index: 5;
		font-family: "Inter Medium";
		padding: 0 40px 250px;
}
.crew_hd {
		padding-bottom: 13px;
		margin: 0 0 50px;
		border-bottom: 1px solid #1e1e1e;
}
.crew_hd h3 {
		width: 380px;
}
.crew_hd h3 img {
		width: 100%;
		height: auto;
}
.crew_wrap h4 {
		font-size: 36px;
		font-weight: 600;
		margin: 0 0 50px;
}
.crew_name {
		font-family: "Inter Medium";
		font-size: 24px;
		margin: 0 0 5px;
}
@media(max-width: 960px) {
		.crew_name {
				font-size: 20px;
		}
}
.crew_status {
		font-family: "Inter Medium";
		font-size: 14px;
}
.partner_flex {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		gap: 20px 20px;
}
.partner_item {
		overflow: hidden;
}
.partner_item img {
		width: 100%;
		height: auto;
		transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), filter 0.3s;
}
@media (hover: hover) {
		.partner_item:hover img {
				transform: scale(1.12);
				filter: brightness(70%);
		}
}
@media(max-width: 1200px) {
		.partner_flex {
				display: grid;
				grid-template-columns: repeat(5, 1fr);
				gap: 15px 15px;
		}
}
@media(max-width: 960px) {
		.partner_flex {
				display: grid;
				grid-template-columns: repeat(4, 1fr);
				gap: 15px 15px;
		}
}
@media(max-width: 840px) {
		.crew_flex {
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
				margin-bottom: 60px;
		}
		.crew_item {
				width: 50%;
				margin: 0 0 24px;
		}
		.partner_flex {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: 15px 15px;
		}
}
@media(max-width: 767px) {
		.crew_wrap h4 {
				font-size: 24px;
				margin: 0 0 30px;
		}
		.crew_hd {
				padding-bottom: 8px;
				margin: 0 0 30px;
		}
		.crew_wrap {
				padding: 0 30px 120px;
		}
		.crew_name {
				font-size: 4vw;
		}
		.crew_status {
				font-size: 11px;
		}
		.crew_hd h3 {
				width: 60%;
		}
		.partner_flex {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: 5px 5px;
		}
}
/* =================== */
.staffCard_tile {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 55px 87.5px;
		margin-bottom: 100px;
}
@media(max-width: 1100px) {
		.staffCard_tile {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: 45px 60px;
		}
}
@media(max-width: 960px) {
		.staffCard_tile {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: 45px 40px;
		}
}
@media(max-width: 767px) {
		.staffCard_tile {
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				gap: 35px 15px;
		}
}
.staffCard_item {
		cursor: pointer;
}
.staffCard_item.fadeInNml {
		transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s;
		transform: scale(1.1)
}
.staffCard_item.fadeInNmlActive {
		transform: scale(1)
}
@media(min-width: 768px) {
		.staffCard_item.fadeInNml:nth-child(2), .staffCard_item.fadeInNml:nth-child(3n + 2) {
				transition-delay: 0.1s
		}
		.staffCard_item.fadeInNml:nth-child(3n) {
				transition-delay: 0.2s
		}
}
@media(max-width: 767px) {
		.staffCard_item.fadeInNml:nth-child(even) {
				transition-delay: 0.13s
		}
}
.staffCard {
		width: 100%;
		aspect-ratio: 5 / 6.34;
		position: relative;
		-webkit-tap-highlight-color: transparent;
		margin: 0 0 10px;
}
.staffCard img {
		width: 100%;
		height: auto;
		display: block
}
.staffCardFront img, .staffCardBack {
		border-radius: 20px;
}
@media(max-width: 960px) {
		.staffCardFront img, .staffCardBack {
				border-radius: 14px;
		}
}
@media(max-width: 767px) {
		.staffCardFront img, .staffCardBack {
				border-radius: 10px;
		}
}
.staffCard .staffCardFront, .staffCard .staffCardBack {
		transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
}
.staffCard .staffCardFront {
		z-index: 2
}
.staffCard .staffCardBack {
		transform: rotateY(180deg);
		background: #FFFAF0;
		aspect-ratio: 5 / 6.34;
		display: flex;
		align-items: flex-end;
		box-sizing: border-box;
		padding: 0 0 25px;
		text-align: center;
}
.staffCardBack .jump {
		position: absolute;
		top: -30px;
		left: 0;
		width: 100%;
		transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s;
		transform: translateY(150px);
		opacity: 0;
}
.isActive .staffCardBack .jump {
		transform: translateY(0px);
		opacity: 1;
}
.jump img {
		width: 100%;
		height: auto
}
.staffCardBack_caption {
		width: 100%;
		text-align: center;
}
.jump_hd {
		width: 155px;
		margin: 0 auto 10px;
		transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
		transition-delay: 0.05s;
		transform: translateY(10px);
		opacity: 0;
}
.isActive .jump_hd {
		transform: translateY(0px);
		opacity: 1;
}
.staffCardBack_caption p {
		line-height: 1.8;
		font-weight: 500;
		opacity: 0;
		transition: opacity 0.45s;
		transition-delay: 0.15s;
		font-family: "Noto Sans JP", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
		font-feature-settings: "palt";
		letter-spacing: 0.02em
}
.isActive .staffCardBack {
		transform: rotateY(0);
}
.isActive .staffCardFront {
		transform: rotateY(-180deg);
}
.isActive .staffCardBack_caption p {
		opacity: 1;
}
@media(max-width: 960px) {
		.staffCard .staffCardBack {
				padding: 0 0 15px;
		}
		.jump_hd {
				width: 120px;
		}
		.staffCardBack_caption p {
				font-size: 14px;
		}
}
@media(max-width: 767px) {
		.jump_hd {
				width: 80px;
				margin-bottom: 5px;
		}
		.staffCardBack .jump {
				top: -23px;
		}
		.staffCardBack_caption p {
				font-size: 10px;
				line-height: 1.6;
				padding: 0;
				letter-spacing: 0
		}
}