@charset "UTF-8";

.main_container {
	position: relative;
}

.main_container::before {
	display: block;
	position: fixed;
	top: 135px;
	left: 50%;
	z-index: -1;
	transform: translateX(-50%);
	max-width: 778px;
	width: 90%;
	background-color: #ffffff;
	background-image: url(../images/index_craft-bg.webp);
	background-repeat: no-repeat;
	background-position: center;
	background-blend-mode: multiply;
	background-size: 100%;
	opacity: 0.1;
	content: "";
	filter: blur(18px);

	mix-blend-mode: multiply;
	aspect-ratio: 389/415;
}

.breadcrumb {
	margin-top: 0 !important;
}

.staff_outline {
	display: block;
	max-width: 1500px;
	margin: 0 auto;
	font-weight: 600;
	font-size: clamp(0.938rem, 0.922rem + 0.06vw, 1rem);
	line-height: clamp(1.75rem, 1.674rem + 0.32vw, 2.063rem);
	text-align: justify;
	letter-spacing: clamp(0rem, -0.001rem + 0.01vw, 0.005rem);
}

.staff_list {
	display: flex;
	max-width: 960px;
	margin: 0 auto;
	flex-wrap: wrap;
	justify-content: space-between;
	counter-reset: number;
}

.staff_item-visual {
	display: block;
	position: relative;
	width: 100%;
}

.staff_item-visual::after {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 3;
	transform-origin: center;
	background-image: url(../images/interview_bg.webp);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100%;
	color: #d5301d;
	font-family: "Rajdhani", "sans-serif";
	content: "INTERVIEW "counter(number, decimal-leading-zero);
	counter-increment: number;
}

.staff_item-img , .staff_item-detail {
	display: block;
	max-width: 350px;
	width: calc(100% - 20px);
	margin: 0 auto;
}

.staff_item-img img {
	width: 100%;
	margin: auto;
}

/* .staff_item-img {
	overflow: hidden;
	max-width: 350px;
	width: calc(100% - 20px);
	margin: 0 auto;
	background-color: #ededed;

	aspect-ratio: 10/7;
} */

/* .staff_item-img img {
	width: 100%;
	height: 100%;

	object-fit: cover;
	object-position: center;
} */

.staff_profile {
	display: flex;
	position: relative;
	margin-bottom: 10px;
	font-weight: bold;
	align-items: flex-end;
}

.staff_department {
	font-size: clamp(1.063rem, 1.017rem + 0.19vw, 1.25rem);
}

.staff_name {
	font-size: clamp(1.563rem, 1.456rem + 0.45vw, 2rem);
}

.staff_name span {
	font-size: clamp(0.875rem, 0.343rem + 1.89vw, 1.25rem);
}

.staff_item-detail dl {
	margin-bottom: 15px;
	font-weight: 600;
	font-size: clamp(0.875rem, 0.86rem + 0.06vw, 0.938rem);
	line-height: clamp(1.438rem, 1.392rem + 0.19vw, 1.625rem);
	letter-spacing: 0.05em;
}

.staff_item-detail dl dt {
	float: left;
	clear: both;
}

.staff_item-detail dl dt::after {
	content: "：";
}

.staff_item-detail dl dd {
	display: flex;
	text-align: justify;
}


.staff_item-detail p {
	font-size: clamp(0.875rem, 0.86rem + 0.06vw, 0.938rem);
	line-height: clamp(1.563rem, 1.532rem + 0.13vw, 1.688rem);
	text-align: justify;
	letter-spacing: clamp(0rem, -0.011rem + 0.05vw, 0.047rem);
}

.staff_consensus-container {
	display: block;
	max-width: 1000px;
	width: 95%;
	margin: 0 auto;
	margin-top: 80px;
	padding: 81px 0;
	background-color: rgba(242,242,242,0.84);
}
.staff_consensus-contents {
	display: flex;
	max-width: 880px;
	width: calc(100% - 15px);
	margin: 0 auto;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.staff_consensus-contents img {
	max-width: 760px;
	width: 90%;
	margin: 0 auto;
}


.comment-textarea {
	display: block;
	width: 100%;
	border-top: 1px solid #252a3e;
	font-weight: 600;
	font-size: clamp(0.875rem, 0.538rem + 0.7vw, 1rem);
	line-height: clamp(1.75rem, 1.245rem + 1.05vw, 1.938rem);
	letter-spacing: 0.05em;
}

@media screen and (min-width: 601px) {
	.comment-textarea {
		text-align: center;
	}
}
@media screen and (max-width: 600px) {
	.comment-textarea {
		text-align: justify;
	}.comment-textarea br {
		display: none;
	}
}


/* .staff_group-visual {
	display: flex;
	width: 100%;
	margin-bottom: 70px;
	flex-direction: column-reverse;
}

.staff_group-img {
	overflow: hidden;
	max-width: 785px;
	width: 100%;
	margin: 0 auto;
	border-radius: 5px;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);

	aspect-ratio: 157/111;
}

.staff_group-img img {
	width: 100%;
	height: 100%;

	object-fit: cover;
	object-position: center;
}

.staff_group-visual figcaption {
	z-index: 1;
	color: #252a3e;
	opacity: 0.1;
	font-weight: 600;
	font-size: clamp(3.75rem, 2.65rem + 5.5vw, 9.25rem);
	text-align: right;
	letter-spacing: clamp(0rem, -0.37rem + 1.85vw, 1.85rem);
	white-space: nowrap;
}

.staff_group-comment {
	font-weight: 600;
	font-size: clamp(0.938rem, 0.922rem + 0.06vw, 1rem);
	line-height: clamp(1.625rem, 1.519rem + 0.45vw, 2.063rem);
	text-align: center;
	letter-spacing: 0.05em;
} */





@media screen and (min-width: 768px) {
	.main_container::before {
		top: 135px;
	}

	.main_container {
		padding: 140px 0 105px;
	}

	.breadcrumb {
		margin-bottom: 60px;
	}

	.common_page-title {
		margin-bottom: 50px;
	}

	.staff_outline {
		width: 95%;
		margin-bottom: 80px;
	}

	.staff_list {
		width: 95%;
		margin-bottom: 30px;

		row-gap: 45px;
	}

	.staff_item {
		max-width: 460px;
		width: 47.9167%;
	}

	.staff_item-visual {
		margin-bottom: 25px;
	}

	.staff_item-visual::after {
		transform: rotateZ(-8deg);
		padding: 0 clamp(0.938rem, -0.352rem + 2.69vw, 1.344rem);
		font-weight: 600;
		font-size: clamp(1.75rem, 0.957rem + 1.65vw, 2rem);
		letter-spacing: clamp(0rem, -0.635rem + 1.32vw, 0.2rem);
	}

	.staff_department {
		position: absolute;
		left: 0;
		font-size: 20px;
	}

	.staff_name {
		margin: 0 auto;
		text-align: center;
	}

	.staff_item-detail dl {
		margin-bottom: 15px;
		font-weight: 600;
	}

	.staff_item-detail p {
		font-weight: 500;
	}

	.staff_consensus-container {
		width: 95%;
		margin-top: 80px;
	}
	.staff_consensus-contents img {
		margin-bottom: 20px;
	}

	.comment-textarea {
		padding-top: 20px;
	}


	.staff_group-comment {
		font-weight: 600;
		text-align: center;
	}
}

@media screen and (max-width: 767px) {
	.main_container {
		padding: 80px 0 50px;
	}
	.main_container::before {
		top: 90px;
	}


	.breadcrumb {
		margin-bottom: 30px;
	}

	.common_page-title {
		margin-bottom: 30px;
	}

	.staff_outline {
		width: 100%;
		margin-bottom: 40px;
		padding: 0 30px;
	}

	.staff_list {
		width: 100%;
		margin-bottom: 20px;
		padding: 0 30px;
		flex-direction: column;
		align-items: center;

		row-gap: 30px;
	}

	.staff_item {
		max-width: 460px;
		width: 100%;
	}

	.staff_item-visual {
		margin-bottom: 15px;
	}

	.staff_item-visual::after {
		transform: rotateZ(-4deg);
		padding: 0 clamp(0.938rem, -0.113rem + 4.48vw, 1.344rem);
		font-weight: 500;
		font-size: clamp(1.75rem, 1.103rem + 2.76vw, 2rem);
		letter-spacing: clamp(0rem, -0.517rem + 2.21vw, 0.2rem);
	}

	.staff_profile {
		padding: 0 !important;
	}

	.staff_department {
		margin-right: 15px;
	}

	.staff_item-detail dl {
		margin-bottom: 10px;
		font-weight: 500;
	}

	.staff_item-detail p {
		font-weight: 400;
	}

	.staff_consensus-container {
		width: calc(100% - 30px);
		margin-top: 50px;
		padding: 41px 10px;
	}
	.staff_consensus-contents img {
		margin-bottom: 15px;
	}

	.comment-textarea {
		padding-top: 10px;
	}

	.form_nav-container {
		width: 100%;
		padding: 50px 30px;
	}

	.form_nav-list {
		flex-direction: column;
		align-items: center;

		row-gap: 30px;
	}

	.form_nav-item {
		width: 100%;
	}
}

@media screen and (max-width: 414px) {
	.comment-textarea .br-414 {
		display: none;
	}
}