@charset "UTF-8";

/* job
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.job {
	.job-chart {
		border-collapse: separate;
		border-spacing: 17px;
		margin: 0 -17px;
		width: calc(100% + 34px);
		table-layout: fixed;
		height: 500px;
		&:first-child {
			margin-top: -60px;
		}
		tr {
			height: 1%;
		}
		th {
			vertical-align: middle;
			font-weight: normal;
			font-size: 18px;
			letter-spacing: 0.15em;
			line-height: 1.4;
			padding: 0;
			border: none;
		}
		th span {
			position: relative;
			margin-right: 30px;
			padding-left: 30px;
			height: 58px;
			display: flex;
			justify-content: center;
			align-items: flex-start;
		}
		th:nth-child(n+2) span::before {
			content: '';
			display: block;
			background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IuODrOOCpOODpOODvF8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDI4LjMgNTguNyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjguMyA1OC43OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4gLnN0MHtmaWxsLXJ1bGU6ZXZlbm9kZDtjbGlwLXJ1bGU6ZXZlbm9kZDtmaWxsOiNFMTIzMzY7fTwvc3R5bGU+PHBhdGggaWQ9Imljbl9hcnJvdy5zdmciIGNsYXNzPSJzdDAiIGQ9Ik0yMy4zLDI5LjNMMCw1LjJMMCwwbDI4LjMsMjkuNEwwLDU4LjdsMC01LjJMMjMuMywyOS4zeiIvPjwvc3ZnPg==") no-repeat 50% 50%;
			background-size: contain;
			width: 22px;
			height: 52px;
			position: absolute;
			top: 60%;
			left: -25px;
			transform: translate(0,-50%);
		}
		th span::after {
			content: '';
			display: block;
			position: absolute;
			top: 60%;
			left: 5px;
			right: -25px;
			transform: translate(0,-50%);
			border-top: 3px solid #E12336;
		}
		td {
			text-align: center;
			vertical-align: middle;
			padding: 0;
		}
		thead td {
			vertical-align: top;
		}
		tbody td:not([rowspan]) {
			height: 60px;
		}
		td p {
			margin: 0 5px;
		}
		.icon {
			text-align: center;
			margin: 0;
		}
		.icon + p {
			font-size: 1.3rem;
			text-align: left;
		}
		tbody a {
			display: flex;
			line-height: 1.4;
			font-weight: 400;
			height: 100%;
			border: 1px solid #E12336;
			justify-content: center;
			align-items: center;
			background: #FFF;
			position: relative;
		}
		tbody a > span {
			display: inline-flex;
			justify-content: center;
			align-items: center;
			flex-wrap: wrap;
		}
		tbody a > span::after {
			content: '';
			display: inline-block;
			vertical-align: middle;
			border-bottom: none;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 3px 0 3px 10px;
			border-top-color: transparent;
			border-right-color: transparent;
			border-bottom-color: transparent;
			box-sizing: border-box;
			margin: 3px 5px;
		}
		tbody a span span {
			font-size: 1.3rem;
			font-weight: 300;
		}
		td[colspan="2"] a[href="#job_04"] {
			border-right: none;
			text-indent: -100vw;
			margin-right: -18px;
			overflow: hidden;
		}
		td[rowspan="3"] a[href="#job_04"]::before {
			content: '';
			position: absolute;
			bottom: -1px;
			right: -1px;
			height: 60px;
			width: calc(100% * 3 + 41px);
			z-index: 2;
		}
		td[rowspan="3"] a[href="#job_04"]::after {
			content: '';
			position: absolute;
			bottom: 0.5px;
			left: -2px;
			height: 57.5px;
			width: 3px;
			z-index: 2;
			background: #FFF;
		}
	}
	.job-head {
		position: relative;
		z-index: 2;
		margin-bottom: -90px;
		.image {
			position: relative;
			margin-block: 0;
		}
		img {
			width: 100%;
		}
		.image::after {
			content: '';
			background: linear-gradient(to right,  rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.1) 40%,rgba(0,0,0,0.1) 100%);
			position: absolute;
			z-index: 2;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
		}
		& > div {
			&:not(.image) {
				position: absolute;
				left: 0;
				top: 0;
				display: flex;
				flex-direction: column;
				justify-content: end;
				width: 100%;
				height: 100%;
				box-sizing: border-box;
				z-index: 3;
			}
			& > * {
				margin: 0;
			}
			.num {
				font-size: 8rem;
				line-height: 1;
				color: #E12336;
				padding: 0 0 0.2em;
			}
			h2 {
				display: inline-block;
				font-size: 3.6rem;
				font-weight: 300;
				text-align: left;
				vertical-align: middle;
				line-height: 1.2;
				padding: 0.5em 0 0;
				min-height: 90px;
				box-sizing: border-box;
				color: #FFF;
				&::before {
					bottom: auto;
					top: 0;
				}
				&.wh {
					color: #FFF;
				}
			}
		}
	}
	.job-body {
		position: relative;
		padding: 30px 0 0;
		section {
			display: flex;
			gap: 40px;
			margin: 80px 0;
			& > div > :last-child {
				margin-bottom: 0;
			}
			h3 {
				flex: 0 0 auto;
				margin: 0;
				width: 11em;
				padding-right: 40px;
				border-right: 1px solid #E12336;
			}
		}

	}
	.member-list {
		display: flex;
		flex-wrap: wrap;
		gap: 50px 0;
		.grid-sizer,
		.item {
			width: calc((100% - 1px) / 3);
		}
		.thum-wrap {
			margin: 0;
			position: relative;
		}
		.thum-wrap .name {
			position: absolute;
			display: inline-block;
			z-index: 2;
			bottom: 0;
			left: 0;
			background: #E12336;
			color: #FFF;
			font-size: 1.5rem;
			font-weight: 400;
			line-height: 1.6;
			padding: 0.2em 0.5em;
			margin: 0;
			transition: 0.2s ease;
		}
		a:hover .thum-wrap .name {
			padding: 0.4em 0.7em;
			/*background: #FF4040;*/
		}
		.profile {
			color: #000;
			font-size: 1.3rem;
			line-height: 1.8;
			margin: 20px 1em 0;
		}
		.thum-wrap .thumbnail {
			box-shadow: 0 10px 25px rgba(0,0,0,0.15);
		}
		.thum-wrap .thumbnail img {
			position: relative;
			z-index: 2;
		}
	}
	@media screen and (max-width: 1023px) {
		.job-chart {
			border-spacing: 5px;
			margin: 0 -5px;
			width: calc(100% + 10px);
			height: 1%;
			&:first-child {
				margin-top: -30px;
			}
			th {
				font-size: 1.2rem;
				letter-spacing: 0;
			}
			th span {
				margin-right: 10px;
				padding-left: 10px;
				height: 50px;
			}
			th:nth-child(n+2) span::before {
				width: 14px;
				height: 29px;
				top: 60%;
				left: -12px;
			}
			th span::after {
				top: 60%;
				left: 5px;
				right: -7px;
				border-top-width: 2px;
			}
			tbody td:not([rowspan]) {
				height: 60px;
			}
			td p {
				margin: 0;
			}
			.icon {
				margin: 0;
			}
			.icon img {
				width: 60px;
				height: auto;
			}
			.icon + p {
				display: none;
			}
			tbody a {
				font-size: 1.1rem;
				line-height: 1.2;
				letter-spacing: 0;
				padding: 0 2px;
			}
			tbody .arrow::after {
				width: 16px;
				height: 32px;
				margin: 0 0 0 3px;
			}
			tbody a > span::after {
				border-width: 3px 0 3px 8px;
			}
			tbody a span span {
				font-size: 1rem;
			}
			td[colspan="2"] a[href="#job_04"] {
				margin-right: -6px;
			}
			td[rowspan="3"] a[href="#job_04"]::before {
				content: '';
				position: absolute;
				bottom: -1px;
				right: -1px;
				height: 60px;
				width: calc(100% * 3 + 17px);
				z-index: 2;
			}
		}
		.job-head {
			margin-bottom: -30px;
			padding-block: 30px 0;
			.image {
				height: 30vw;
				min-height: 120px;
				img {
					object-fit: cover;
					object-position: 80% 50%;
					width: 100%;
					height: 100%;
				}
			}
			& > div {
				font-size: 1.8rem;
				letter-spacing: 0.05em;
				.num {
					font-size: 4rem;
				}
				h2 {
					font-size: 2rem;
					letter-spacing: 0.05em;
					min-height: 0;
					padding-bottom: 20px;
					text-shadow: 0 0 3px rgba(0,0,0,0.30);
				}
			}
		}
		.job-body {
			padding-top: 0;
			section {
				display: block;
				margin: 40px 0;
				h3 {
					border: none;
					padding: 0;
					width: auto;
					margin-bottom: 20px;
				}
			}
		}
		.member-list {
			gap: 30px 0;
			.item {
				width: 50%;
			}
			.thum-wrap {
				margin: 0;
				position: relative;
			}
			.thum-wrap .name {
				position: relative;
				bottom: auto;
				left: auto;
				font-size: 1.2rem;
				padding: 0.2em 0.5em !important;
				box-shadow: 0 10px 25px rgba(0,0,0,0.15);
			}
			.profile {
				font-size: 1.1rem;
				margin: 5px 0.5em 0;
			}
			.thum-wrap .thumbnail {
				box-shadow: 0 5px 18px rgba(0,0,0,0.15);
			}
		}
	}
}

/* member
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.member .lead {
	margin-top: -40px;
	margin-bottom: -40px;
}
.member .filter {
	margin-bottom: -40px;
}
.member .button-group {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	justify-content: space-between;
}
.member .button-group > div {
	display: flex;
	align-items: center;
}
.member .button-group > div p {
	font-size: 2rem;
	letter-spacing: 0.2em;
	font-weight: 400;
	line-height: 1.6;
	color: #E12336;
	margin-right: 0.5em;
}
.member .filter ul {
	display: flex;
	list-style: none;
	flex-wrap: wrap;
	margin-right: 2em;
}
.member .filter ul li {
	margin: 0 0.4em;
}
.member .filter ul li a {
	display: flex;
	padding: 0.2em 0.8em;
	color: #000;
	position: relative;
	border-radius: 50px;
}
.member .filter ul li a.is-checked {
	color: #E12336;
}
.member .filter ul li a::before,
.member .filter ul li a.is-checked::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border-radius: 50px;
	background: #FFF;
	z-index: -1;
}
.member .filter ul li a.is-checked::after {
	border: 1px solid #E12336;
}

.member .filter ul li a:hover {
	color: #FF4040;
}
.member .filter ul li a:hover::before,
.member .filter ul li a.is-checked:hover::after {
	animation: btn 0.4s ease both;
}
@keyframes btn {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.05);
	}
	100% {
		transform: scale(1);
	}
}
.member .filter .reset-btn {
	color: #E12336;
	display: flex;
	margin-top: 30px;
	line-height: 1.6;
}
.member .filter .reset-btn::before,
.member .filter .reset-btn::after {
	content: '';
	border-top: 1px solid;
	flex: 2 2 auto;
}
.member .filter .reset-btn a {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100px;
	flex: 0 0 auto;
	text-align: center;
	text-indent: 0.2em;
	margin: -30px 0 0;
}
.member .filter .reset-btn a::before {
	content: '';
	display: block;
	width: 60px;
	height: 60px;
	background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9Imljbl9yZXNldC5zdmciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgNTEgNTEiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxIDUxOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4gLnN0MHtmaWxsOm5vbmU7c3Ryb2tlOiNFMTIzMzY7fSAuc3Qxe2ZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO2ZpbGw6I0UxMjMzNjt9PC9zdHlsZT48cGF0aCBpZD0i6ZW35pa55b2iXzcyMSIgY2xhc3M9InN0MCIgZD0iTTI1LjUsMC41YzEzLjgsMCwyNSwxMS4yLDI1LDI1YzAsMTMuOC0xMS4yLDI1LTI1LDI1cy0yNS0xMS4yLTI1LTI1YzAtNi42LDIuNi0xMyw3LjMtMTcuNyAiLz48cGF0aCBpZD0i5aSa6KeS5b2iXzFf44Gu44Kz44OU44O8XzIiIGNsYXNzPSJzdDEiIGQ9Ik0xMi45LDMuNWwtNC45LDkuN0wzLjIsOC41TDEyLjksMy41eiIvPjwvc3ZnPg==") no-repeat 50% 50%;
	background-size: 60px auto;
	margin: 0 0 3px;
	transition: 0.4s ease;
}
.member .filter .reset-btn a:hover::before {
	transform: rotate(360deg);
}
.member .member-list .grid-sizer,
.member .member-list .item {
	width: calc((100% - 1px) / 3);
	margin: 0 0 50px;
}
.member .member-list .thum-wrap {
	margin: 0;
	position: relative;
}
.member .member-list .thum-wrap .name {
	position: absolute;
	display: inline-block;
	z-index: 2;
	bottom: 0;
	left: 0;
	background: #E12336;
	color: #FFF;
	font-size: 1.8rem;
	font-weight: 400;
	line-height: 1.6;
	padding: 0.5em 0.8em;
	margin: 0;
	transition: 0.2s ease;
}
.member .member-list a:hover .thum-wrap .name {
	padding: 0.7em 1em;
	/*background: #FF4040;*/
}
.member .member-list .profile {
	color: #000;
	font-size: 1.4rem;
	line-height: 1.8;
	margin: 20px 1em 0;
}
.member .member-list .thum-wrap .thumbnail img {
	position: relative;
	z-index: 2;
}


@media screen and (max-width: 1023px) {
	.member .lead {
		margin-top: -30px;
		margin-bottom: -30px;
	}
	.member .filter {
		margin-bottom: -40px;
	}
	.member .button-group {
		display: block;
	}
	.member .button-group > div {
		display: block;
	}
	.member .button-group > div p {
		font-size: 1.5rem;
		letter-spacing: 0.15em;
		margin-right: 0;
		margin-bottom: 10px;
	}
	.member .filter ul {
		margin-right: 0;
		margin-bottom: 10px;
	}
	.member .filter ul li {
		margin: 0 0.3em 0.6em;
		font-size: 1.2rem;
	}
	.member .filter .reset-btn {
		margin-top: 30px;
	}
	.member .filter .reset-btn a {
		width: 70px;
		margin: -20px 0 0;
	}
	.member .filter .reset-btn a::before {
		width: 40px;
		height: 40px;
		background-size: 40px auto;
		margin: 0 0 2px;
		transform: none !important;
	}
	.member .member-list .grid-sizer,
	.member .member-list .item {
		width: 50%;
		margin: 0 0 30px;
	}
	.member .member-list .thum-wrap {
		margin: 0;
		position: relative;
	}
	.member .member-list .thum-wrap .name {
		position: relative;
		bottom: auto;
		left: auto;
		font-size: 1.3rem;
		padding: 0.2em 0.5em !important;
		box-shadow: 0 10px 25px rgba(0,0,0,0.15);
	}
	.member .member-list .profile {
		font-size: 1.2rem;
		margin: 5px 0.5em 0;
	}
}
.modal {
	visibility: hidden;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	opacity: 0;
	transition: 0.4s ease;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 50px 0;
}
.modal .overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(27,27,27,0.85);
}
.modal.open {
	visibility: visible;
	opacity: 1;
}
.modal-in {
	width: 1000px;
	height: 100%;;
	overflow: auto;
	position: relative;
	z-index: 2;
}
.modal .close {
	text-indent: -100vw;
	overflow: hidden;
	width: 40px;
	height: 40px;
	position: absolute;
	bottom: 40px;
	right: 40px;
	cursor: pointer;
	margin: 0;
	padding: 0;
	transition: 0.2s ease;
	border: none;
	color: #FFF;
	outline: none;
}
.pc-view .modal .close:hover {
}
.modal .close::before,
.modal .close::after {
	content: '';
	display: block;
	border-top: 1px solid;
	width: 40px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) rotate(45deg);
	transition: 0.2s ease;
}
.modal .close::after {
	transform: translate(-50%,-50%) rotate(-45deg);
}
.pc-view .modal .close:hover::before,
.pc-view .modal .close:hover::after {
	width: 50px;
}

.job .modal-nav {
	position: static;
	margin: 0;
}
.job .modal-nav li {
	position: fixed;
	top: 50%;
	transform: translate(0,-50%);
	margin: 0;
	list-style: none;
}
.job .modal-nav li.next {
	right: calc(50% - 500px + 30px);
}
.job .modal-nav li.prev {
	left: calc(50% - 500px + 30px);
}
.job .modal-nav li.prev a {
	transform: scale(-1,1);
}
.job .modal-nav li a {
	display: block;
	width: 70px;
	height: 70px;
	overflow: hidden;
	text-indent: -100vw;
}
.job .modal-nav li a::before,
.job .modal-nav li a::after {
	content: '';
	position: absolute;
	z-index: 4;
	display: block;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	transition: 0.2s ease;
}
.job .modal-nav li a::before {
	border-bottom: none;
	margin: 0 0 0 15px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 3px 0 3px 10px;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	box-sizing: border-box;
}
.job .modal-nav li a::after {
	border-top: 1px solid;
	top: 50%;
	width: 30px;
}
.pc-view .job .modal-nav li a:hover::before {
	margin: 0 0 0 25px;
}
.pc-view .job .modal-nav li a:hover::after {
	width: 40px;
	margin-left: 5px;
}
@media screen and (max-width: 1280px) and (min-width: 1024px) {
	.modal-in {
		height: calc(100% - 50px);
		margin-bottom: 50px;
	}
	.modal .close {
		bottom: 10px;
		right: 10px;
	}
}
@media screen and (max-width: 1023px) {
	.modal .close {
		width: 20px;
		height: 20px;
		top: 10px;
		bottom: auto;
		right: 15px;
	}
	.modal .close::before,
	.modal .close::after {
		width: 30px;
	}
}

/* member-detail
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.member-detail .page-header .hero {
	padding-bottom: 0;
}
.member-detail .page-header .title-wrap {
	position: relative;
}
.member-detail .page-header .title-wrap div:first-child {
	position: absolute;
	z-index: 2;
	left: 0.5em;
	bottom: 0;
	font-size: 4rem;
}
.member-detail .page-header .num {
	font-size: 10rem;
	color: #E12336;
	letter-spacing: 0;
	margin: 0 0 -0.08em;
	line-height: 0.9;
}
.member-detail .page-header h1 {
	position: relative;
	bottom: auto;
	left: auto;
	background: transparent;
	padding: 0.2em 0;
	margin: 0;
	letter-spacing: 0.1em;
	line-height: 1.45;
}
.member-detail .page-header h1 span {
	color: #FFF;
	background: #E12336;
	padding: 0.2em 0;
	box-shadow: 0.5em 0 0 #E12336, -0.5em 0 0 #E12336;
}
.member-detail .page-header .profile {
	color: #FFF;
	display: flex;
	align-items: center;
	font-size: 4rem;
	line-height: 1.8;
	margin: 0 calc(5vw + 0.5em) 0 0.5em;
	padding: 0.6em 0;
}
.member-detail .page-header .title-wrap {
	position: relative;
}

.member-detail .page-header .profile p {
	font-size: 1.5rem;
	margin: 0;
}
.member-detail .page-header .profile .name {
	font-size: 2.4rem;
	font-weight: 400;
	flex: 0 0 auto;
	margin: 0 1.5em 0 0;
}
.member-detail .page-header .profile .note {
	color: rgba(255,255,255,0.80);
}
.member-detail .page-header + .profile {
	margin-top: -60px;
}
.member-detail .page-header + .profile h2 {
	color: #E12336;
	font-size: 2.6rem;
	text-align: left;
	display: block;
	padding: 0;
	margin-bottom: 30px;
}
.member-detail .page-header + .profile h2::before {
	display: none;
}
.member-detail .bg-clr h2 {
	transform: translate(0,-0.7em) !important;
	justify-content: flex-start !important;
	text-align: left !important;
}
.member-detail .bg-clr:nth-of-type(even) h2 {
	justify-content: flex-end !important;
	text-align: right !important;
}
.member-detail .question {
	font-size: 2rem;
	line-height: 1.6;
	letter-spacing: 0.2em;
	font-weight: 400;
	color: #E12336;
	overflow: hidden;
	padding: 0 0 40px 20px;
	margin-top: 50px;
	margin-bottom: 20px;
	position: relative;
}
.member-detail .question::before {
	content: '';
	border-left: 1.3px solid;
	position: absolute;
	left: 30px;
	bottom: 0;
	height: 30px;
	transform: skewX(-20deg);
}
.member-detail .question::after {
	content: '';
	border-left: 1px solid;
	border-bottom: 1px solid;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 30px;
	top: 0;
}


@media screen and (max-width: 1023px) {
	.member-detail .page-header .title-wrap div:first-child {
		font-size: 1.8rem;
		margin-bottom: -1.55em;
	}
	.member-detail .page-header .num {
		font-size: 5rem;
		margin: 0 0 -0.06em;
	}
	.member-detail .page-header h1 {
		font-size: 1.8rem;
		line-height: 1.5;
		padding: 0.2em 0;
	}
	.member-detail .page-header h1 span {
		padding: 0.2em 0;
	}
	.member-detail .page-header h1 br {
		display: none;
	}
	.member-detail .page-header .image img {
		max-width: none;
		width: 180%;
		margin: 0 -30% 0 -50%;
	}
	.member-detail .page-header .profile {
		font-size: 1.8rem;
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		padding-top: 1.9em;
	}
	.member-detail .page-header .profile p {
		font-size: 1.2rem;
	}
	.member-detail .page-header .profile .name {
		font-size: 1.6rem;
		margin: 0 1.5em 0 0;
	}
	.member-detail .page-header + .profile {
		margin-top: -30px;
	}
	.member-detail .page-header + .profile h2 {
		font-size: 1.8rem;
		margin-bottom: 15px;
	}
	.member-detail .bg-clr h2,
	.member-detail .bg-clr:nth-of-type(even) h2 {
		font-size: 1.8rem !important;
		margin-left: 0;
		margin-right: 0;
		margin-bottom: 20px;
		transform: translate(0,-0.7em) !important;
		justify-content: flex-start !important;
		text-align: left !important;
	}
	.member-detail .question {
		font-size: 1.5rem;
		letter-spacing: 0.15em;
		padding: 0 0 20px 10px;
		margin-top: 25px;
		margin-bottom: 10px;
	}
	.member-detail .question::before {
		left: 15px;
		height: 15px;
	}
	.member-detail .question::after {
		bottom: 15px;
	}
}


/* voice
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.voice .qa {
	margin-top: 20px;
}
.voice .qa:not(:last-of-type) {
	margin-bottom: 20px;
}
.voice .question {
	position: relative;
	box-sizing: border-box;
	height: 150px;
	font-size: 2rem;
	font-weight: 400;
	color: #E12336;
	justify-content: flex-start;
	align-items: center;
	margin: 0 0 0 150px;
	padding: 1.6em;
	background: #FFF;
	transition: 0.2s ease;
}
.voice .question.open {
	color: #FFF !important;
	background: #E12336;
}
.voice .question:hover {
	color: #FF4040;
}
.voice .question :lang(en) {
	color: #FFF;
	font-size: 10rem;
	letter-spacing: 0.05em;
	line-height: 0.8;
	text-shadow: 0 6px 20px rgba(225,35,54,0.05);
	position: absolute;
	top: 50%;
	right: 100%;
	transform: translate(0,-50%);
	margin: 0 0.1em 0 0;
	transition: 0.2s ease;
}
.voice .question.open :lang(en) {
	color: #E12336;
}
.voice .question::before {
	display: none;
}
.voice .question::after {
	content: '';
	display: block;
	position: absolute;
	z-index: 3;
	width: 60px;
	height: 60px;
	border-radius: 60px;
	background: #FFF;
	box-shadow: 0 15px 45px rgba(0,0,0,0.15);
	top: 50%;
	right: 4vw;
	transform: translate(0,-50%);
}
.voice .question span:last-child::before,
.voice .question span:last-child::after {
	content: '';
	position: absolute;
	z-index: 4;
	display: block;
	color: #E12336;
	top: 50%;
	right: calc(4vw + 60px / 2);
	transform: translate(50%,-50%);
	transition: 0.2s ease;
	border-top: 1px solid;
	width: 24px;
}
.voice .question span:last-child::after {
	transform: translate(50%,-50%) rotate(-90deg);
}
.voice .question.open span:last-child::before {
	opacity: 0;
	transform: translate(50%,-50%) rotate(90deg);
}
.voice .question.open span:last-child::after {
	transform: translate(50%,-50%) rotate(0deg);
}

.voice .question:hover::after {
	animation: btn-icon 0.4s ease both;
}

.voice .answer {
}
.voice .item {
	display: flex;
	align-items: flex-start;
	margin: 80px 0;
}
.voice .item:nth-child(even) {
	flex-direction: row-reverse;
}
.voice .person .image {
	width: 120px;
	border-radius: 120px;
	margin: 0 auto 5px;
	overflow: hidden;
}
.voice .person {
	position: relative;
	font-size: 1.3rem;
	line-height: 1.8;
	text-align: center;
	width: 300px;
	flex: 0 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}

.voice .person p {
	margin: 0;
}
.voice .person .name {
	font-size: 1.6rem;
	font-weight: 500;
}
.voice .comment {
	position: relative;
	border-left: 1px solid #E12336;
	padding: 0 0 0 50px;
	line-height: 2;
}
.voice .item:nth-child(even) .comment {
	border-left: none;
	border-right: 1px solid #E12336;
	padding: 0 50px 0 0;
}
.voice .comment::before {
	content: '';
	display: block;
	border-top: 1px solid #E12336;
	width: 50px;
	position: absolute;
	top: 40px;
	right: 100%;
	transform: skewY(-20deg);
}
.voice .item:nth-child(even) .comment::before {
	right: auto;
	left: 100%;
	transform: skewY(20deg);
}
.voice .comment p:last-child {
	margin-bottom: 0;
}

@media screen and (max-width: 1023px) {
	.voice .page-header .image img {
		width: 100%;
		margin: 0;
	}
	.voice .qa {
		margin-top: 10px;
	}
	.voice .qa:not(:last-of-type) {
		margin-bottom: 10px;
	}
	.voice .question {
		height: auto;
		min-height: 70px;
		font-size: 1.5rem;
		padding: 0.5em calc(4vw + 35px) 0.5em 1em;
		margin: 0 0 0 60px;
	}
	.voice .question :lang(en) {
		font-size: 4rem;
		font-weight: 700;
		letter-spacing: 0;
		text-shadow: 0 3px 10px rgba(225,35,54,0.05);
	}
	.voice .question::before {
		display: none;
	}
	.voice .question::after {
		width: 30px;
		height: 30px;
		box-shadow: 0 10px 25px rgba(0,0,0,0.15);
	}
	.voice .question span:last-child::before,
	.voice .question span:last-child::after {
		right: calc(4vw + 30px / 2);
		width: 14px;
	}

	.voice .answer .item {
		display: block;
		margin: 40px 0;
	}
	.voice .person {
		font-size: 1.1rem;
		line-height: 1.6;
		width: auto;
		padding: 0;
		text-align: left;
		display: flex;
		align-items: center;
		margin: 0 0 15px;
	}
	.voice .item:nth-child(even) .person {
		text-align: right;
		flex-direction: row-reverse;
	}
	.voice .person .image {
		width: 50px;
		margin: 0 10px 0 0;
		flex: 0 0 auto;
		
	}
	.voice .item:nth-child(even) .person .image  {
		margin: 0 0 0 10px;
	}
	.voice .person .name {
		font-size: 1.4rem;
	}
	.voice .comment {
		padding: 0 0 0 15px;
		margin: 0 0 0 60px;
		line-height: 1.8;
	}
	.voice .item:nth-child(even) .comment {
		padding: 0 15px 0 0;
		margin: 0 60px 0 0;
	}
	.voice .comment::before {
		width: 30px;
		top: 20px;
		transform: skewY(20deg);
	}
	.voice .item:nth-child(even) .comment::before {
		transform: skewY(-20deg);
	}
}


/* global
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.global section > h2:lang(en),
.honest-talk section > h2:lang(en) {
	color: #E12336;
	letter-spacing: 0.2em;
	padding: 0;
}
.global section > h2:lang(en)::before,
.honest-talk section > h2:lang(en)::before {
	display: none;
}
.global .member-list-wrap {
	position: relative;
	margin-bottom: 350px;
}
.global .map img {
	width: 100%;
	height: auto;
	opacity: 0.9;
}
.global .member-list .item {
	position: absolute;
	padding: 0 20px;
	line-height: 1.6;
	width: 18%;
	text-shadow: 1px 1px 0 #F9F1EB, -1px -1px 0 #F9F1EB;
	padding-top: 40px;
}
.global .member-list .item:nth-child(1) {
	top: 30%;
	left: 18%;
	transform: translate(-56.5px, 56.5px);
}
.global .member-list .item:nth-child(2) {
	top: 4%;
	left: 52%;
	transform: translate(-56.5px, 56.5px);
}
.global .member-list .item:nth-child(3) {
	text-align: right;
	top: 55%;
	right: 25.5%;
	transform: translate(56.5px, 56.5px);
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.global .member-list .item:nth-child(4) {
	top: 27%;
	left: 78%;
	transform: translate(56.5px, 56.5px);
}
.global .member-list .item::before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 100%;
	height: 80px;
	border-left: 1px solid #E12336;
	box-shadow: 1px 1px 0 #F9F1EB, -1px -1px 0 #F9F1EB;
	transform: rotate(45deg);
	transform-origin: 0 100%;
}
.global .member-list .item::after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	border-left: 1px solid #E12336;
	box-shadow: 1px 1px 0 #F9F1EB, -1px -1px 0 #F9F1EB;
}
.global .member-list .item:nth-child(3)::before {
	left: auto;
	right: 0;
	box-shadow: -1px 1px 0 #F9F1EB, 1px -1px 0 #F9F1EB;
	transform: rotate(-45deg);
	transform-origin: 100% 100%;
}
.global .member-list .item:nth-child(3)::after {
	left: auto;
	right: 0;
	box-shadow: -1px 1px 0 #F9F1EB, 1px -1px 0 #F9F1EB;
}
.global .member-list .item:nth-child(4)::before {
	box-shadow: -1px 1px 0 #F9F1EB, 1px -1px 0 #F9F1EB;
	transform: rotate(-45deg);
	transform-origin: 0 100%;
}
.global .member-list .item:nth-child(4)::after {
	box-shadow: -1px 1px 0 #F9F1EB, 1px -1px 0 #F9F1EB;
}
.global .member-list .image {
	width: 120px;
	margin: 0 0 20px;
	flex: 0 0 auto;
}
.global .member-list .country {
	font-size: 1.4rem;
	color: #E12336;
	font-weight: 400;
	margin: 0 0 10px;
}
.global .member-list .name {
	font-size: 1.8rem;
	font-weight: 400;
	margin: 0 0 5px;
}
.global .member-list .name + p {
	font-size: 1.3rem;
	margin: 0;
}
.theme > h2:lang(en) {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	transform: translate(0, -50%);
}
.theme .video-list {
	display: flex;
	flex-wrap: wrap;
}
.theme .video-list .item {
	width: calc((100% - 5vw) / 2);
	margin: 0 0 60px;
}
.theme .video-list .item:nth-child(even) {
	margin-left: 5vw;
}
.theme .video-list .item:nth-last-child(-n+2) {
	margin-bottom: 0;
}
.theme .video-list .title {
	margin: 20px 0 0;
	display: flex;
	align-items: baseline;
	color: #000;
	font-size: 1.8rem;
	line-height: 1.8;
	position: relative;
	z-index: 2;
}
.theme .video-list .title :lang(en) {
	flex: 0 0 auto;
	font-size: 3rem;
	color: #E12336;
	line-height: 1;
	margin: 0 15px 0 0;
}
.theme .video-list .thumbnail {
	position: relative;
	background: #000;
}
.theme .video-list .thumbnail img {
	opacity: 0.9;
}
.theme .video-list a:hover .thumbnail img {
	opacity: 1;
}
.theme .video-list .thumbnail::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 80px;
	height: 80px;
	border-radius: 80px;
	background: rgba(255,255,255,0.70);
	transform: translate(-50%,-50%);
	box-shadow: 0 15px 45px rgba(0,0,0,0.15);
	z-index: 2;
	transition: background-color 0.2s ease;
}
.theme .video-list a:hover .thumbnail::before {
	animation: btn-play 0.4s ease both;
	background: rgba(255,255,255,1);
}
@keyframes btn-play {
	0% {
		transform: translate(-50%,-50%) scale(1);
	}
	50% {
		transform: translate(-50%,-50%) scale(1.1);
	}
	100% {
		transform: translate(-50%,-50%) scale(1);
	}
}
.theme .video-list .thumbnail::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: 3px;
	transform: translate(-50%,-50%);
	z-index: 3;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 14px 0 14px 32px;
	border-color: transparent transparent transparent #E12336;
}


.modal-in.video {
	width: 640px;
	height: auto;
}
.modal-in.video > div {
	padding: 56.25% 0 0 0;
	position: relative;
}
.modal-in.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 1023px) {
	.global .member-list-wrap {
		margin-bottom: 0;
	}
	.global .map {
		width: 130%;
		margin: 0 -15% -5vw;
	}
	.global .map img {
		opacity: 1;
	}
	.global .member-list {
		display: flex;
		flex-wrap: wrap;
	}
	.global .member-list .item {
		position: relative;
		padding: 0 0 0 10px;
		margin: 0 0 30px;
		box-sizing: border-box;
		width: calc((100% - 5vw) / 2);
		text-shadow: none;
		padding-top: 0;
		top: auto !important;
		left: auto !important;
		right: auto !important;
		transform: none !important;
		display: block !important;
		text-align: left !important;
	}
	.global .member-list .item:nth-child(even) {
		margin-left: 5vw;
	}
	.global .member-list .item::before {
		display: none;
	}
	.global .member-list .item::after {
		left: 0 !important;
		right: auto !important;
	}
	.global .member-list .image {
		width: 50%;
		margin: 0 0 10px;
	}
	.global .member-list .country {
		font-size: 1.2rem;
		margin: 0 0 10px;
	}
	.global .member-list .name {
		font-size: 1.5rem;
		margin: 0 0 3px;
	}
	.global .member-list .name + p {
		font-size: 1.1rem;
	}
	.theme .video-list .item {
		width: 100%;
		margin: 0 0 30px !important;
	}
	.theme .video-list .item:nth-last-child(-n+1) {
		margin-bottom: 0 !important;
	}
	.theme .video-list .title {
		margin: 10px 0 0;
		font-size: 1.5rem;
		line-height: 1.6;
	}
	.theme .video-list .title :lang(en) {
		font-size: 2rem;
		margin: 0 10px 0 0;
	}
	.theme .video-list .thumbnail::before {
		width: 60px;
		height: 60px;
		box-shadow: 0 10px 25px rgba(0,0,0,0.15);
	}
	.theme .video-list .thumbnail::after {
		margin-left: 2px;
		border-width: 11px 0 11px 24px;
	}
	
	.modal-in.video {
		width: 100%;
	}
}

/* honest-talk
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.honest-talk .member-list {
	display: flex;
	justify-content: space-between;
}
.honest-talk .member-list .item {
	padding: 0 0 0 20px;
	line-height: 1.6;
	width: calc((100% - 40px * 3) / 4);
	box-sizing: border-box;
	position: relative;
}
.honest-talk .member-list .item::before {
	content: '';
	position: absolute;
	top: 20px;
	bottom: 0;
	left: 0;
	border-left: 1px solid #E12336;
}
.honest-talk .member-list :lang(en) {
	color: #E12336;
	font-size: 3rem;
	line-height: 1;
	position: absolute;
	top: 0;
	left: -0.3em;
	transform: translate(0,-50%);
}
.honest-talk .member-list .image {
	width: 100%;
	margin: 0 0 20px;
}
.honest-talk .member-list .name {
	font-size: 1.8rem;
	font-weight: 400;
	margin: 0 0 5px;
}
.honest-talk .member-list .name + p {
	font-size: 1.3rem;
	margin: 0;
}
@media screen and (max-width: 1023px) {
	.honest-talk .member-list {
		flex-wrap: wrap;
	}
	.honest-talk .member-list .item {
		padding: 0 0 0 10px;
		margin: 0 0 30px;
		width: calc((100% - 5vw) / 2);
	}
	.honest-talk .member-list .item::before {
		top: 15px;
	}
	.honest-talk .member-list :lang(en) {
		font-size: 2rem;
	}
	.honest-talk .member-list .image {
		margin: 0 0 10px;
	}
	.honest-talk .member-list .name {
		font-size: 1.5rem;
		margin: 0 0 3px;
	}
	.honest-talk .member-list .name + p {
		font-size: 1.1rem;
	}
}