@charset "UTF-8";
/*
	コンテンツ共通
-----------------------------------------------------------------------------------------------*/

/* リスト装飾
============================== */
a.peopleLink{
	display: block;
	width: max(240px, calc(240 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	position: relative;
	transition: none;
}
.peopleLink::before,
.peopleLink::after{
	content: '';
	height: 1px;
	position: absolute;
	bottom: 0;
	left: 0;
}
.peopleLink::before{
	width: 100%;
	background: var(--colorGrey200);
}
.peopleLink::after{
	width: max(50px, calc(50 / var(--baseWidth) * 100vw));
	transition: var(--transitionBase);
}
.peopleFigure{
	position: relative;
}
.peopleImg{
	width: max(240px, calc(240 / var(--baseWidth) * 100vw));
	height: max(320px, calc(320 / var(--baseWidth) * 100vw));
	margin-left: auto;
	border-radius: max(24px, calc(24 / var(--baseWidth) * 100vw));
	transition: width var(--transitionBase);
	overflow: hidden;
}
.peopleImg img{
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	transform: scale(1.0);
	transform-origin: center;
	transition: var(--transitionBase);
	object-fit: cover;
	object-position: center;
}
.captionDep{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: max(80px, calc(80 / var(--baseWidth) * 100vw));
	height: max(20px, calc(20 / var(--baseWidth) * 100vw));
	padding-inline: max(12px, calc(12 / var(--baseWidth) * 100vw));
	color: #fff;
	font-size: max(1.0rem, calc(10 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	text-align: center;
	line-height: 1.0;
	letter-spacing: .1rem;
	border-radius: max(10px, calc(10 / var(--baseWidth) * 100vw));
	position: absolute;
	top: max(16px, calc(16 / var(--baseWidth) * 100vw));
	left: max(16px, calc(16 / var(--baseWidth) * 100vw));
}
.peopleCaption .captionCopy{
	margin-left: max(24px, calc(24 / var(--baseWidth) * 100vw));
	padding: max(14px, calc(14 / var(--baseWidth) * 100vw)) max(10px, calc(10 / var(--baseWidth) * 100vw)) max(10px, calc(10 / var(--baseWidth) * 100vw)) max(20px, calc(20 / var(--baseWidth) * 100vw));
	display: flex;
	align-items: center;
	font-size: max(1.4rem, calc(14 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	text-align: left;
	letter-spacing: 0;
	border-radius: max(24px, calc(24 / var(--baseWidth) * 100vw)) 0 0 0;
	background: #fff;
	position: absolute;
	right: -1px;
	bottom: -1px;
	transition: 0s;
}
.peopleProfile{
	padding-block: max(16px, calc(16 / var(--baseWidth) * 100vw));
	padding-inline: max(16px, calc(16 / var(--baseWidth) * 100vw)) max(30px, calc(30 / var(--baseWidth) * 100vw));
	text-align: left;
	position: relative;
}
.peopleProfile::before{
	content: '';
	width: max(26px, calc(26 / var(--baseWidth) * 100vw));
	height: max(26px, calc(26 / var(--baseWidth) * 100vw));
	border-radius: max(13px, calc(13 / var(--baseWidth) * 100vw));
	background: var(--colorBlack) url(/recruit/images/ico_top_arrow_wh.svg) no-repeat 50% center / 40%;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
	transition: var(--transitionBase);
}
.profileName{
	display: inline-flex;
	vertical-align: middle;
	font-family: var(--ffEn);
	font-size: max(2.4rem, calc(24 / var(--baseWidth) * 100vw));
	font-weight: 700;
	line-height: 1.0;
	letter-spacing: 0;
}
.profilePosition{
	display: block;
	margin-top: max(10px, calc(10 / var(--baseWidth) * 100vw));
	color: var(--colorGrey300);
	font-size: max(1.0rem, calc(10 / var(--baseWidth) * 100vw));
	font-weight: var(--fwMedium);
	line-height: 1.3;
	letter-spacing: .1rem;
}
.profilePosition span{
	display: block;
}
/* 部署ごとのカラー */
.administration .peopleLink::after,
.administration .captionDep{
	background: var(--colorRed);
}
.hrd .peopleLink::after,
.hrd .captionDep{
	background: var(--colorRed);
}
.marketing .peopleLink::after,
.marketing .captionDep{
	background: var(--colorOrange);
}
.sales .peopleLink::after,
.sales .captionDep{
	background: var(--colorGreen);
}
.policy-maintenance .peopleLink::after,
.policy-maintenance .captionDep{
	background: var(--colorBlue);
}
.product-dev .peopleLink::after,
.product-dev .captionDep{
	background: var(--colorYellow);
}
.contract-dev .peopleLink::after,
.contract-dev .captionDep{
	background: var(--colorLightBlue);
}
/* hover
============================== */
@media (any-hover: hover){
	.peopleLink:hover::after{
		width: 100%;
		transition: var(--transitionBase);
	}
	.peopleLink:hover .peopleImg img{
		transform: scale(1.05);
		transition: var(--transitionBase);
	}
	.peopleLink:hover .peopleProfile::before{
		transition: var(--transitionBase);
	}
	.administration .peopleLink:hover .peopleProfile::before{
		background-color: var(--colorRed);
	}
	.hrd .peopleLink:hover .peopleProfile::before{
		background-color: var(--colorRed);
	}
	.marketing .peopleLink:hover .peopleProfile::before{
		background-color: var(--colorOrange);
	}
	.sales .peopleLink:hover .peopleProfile::before{
		background-color: var(--colorGreen);
	}
	.policy-maintenance .peopleLink:hover .peopleProfile::before{
		background-color: var(--colorBlue);
	}
	.product-dev .peopleLink:hover .peopleProfile::before{
		background-color: var(--colorYellow);
	}
	.contract-dev .peopleLink:hover .peopleProfile::before{
		background-color: var(--colorLightBlue);
	}
}
/* トップページ スライダーactive／社員インタビュー（一覧）リスト
============================== */
.is-sync a.peopleLink,
.interviewList a.peopleLink{
	width: max(300px, calc(300 / var(--baseWidth) * 100vw));
}
.is-sync .peopleImg,
.interviewList .peopleImg{
	width: max(300px, calc(300 / var(--baseWidth) * 100vw));
	height: max(400px, calc(400 / var(--baseWidth) * 100vw));
	border-radius: var(--bdrs30);
	transition: width var(--transitionBase);
}
.is-sync .captionDep,
.interviewList .captionDep{
	min-width: max(100px, calc(100 / var(--baseWidth) * 100vw));
	height: max(26px, calc(26 / var(--baseWidth) * 100vw));
	font-size: max(1.3rem, calc(13 / var(--baseWidth) * 100vw));
	border-radius: max(13px, calc(13 / var(--baseWidth) * 100vw));
	top: max(20px, calc(20 / var(--baseWidth) * 100vw));
	left: max(20px, calc(20 / var(--baseWidth) * 100vw));
}
.is-sync .peopleCaption .captionCopy,
.interviewList .captionCopy{
	margin-left: var(--bdrs30);
	padding: max(18px, calc(18 / var(--baseWidth) * 100vw)) max(10px, calc(10 / var(--baseWidth) * 100vw)) max(10px, calc(10 / var(--baseWidth) * 100vw)) max(22px, calc(22 / var(--baseWidth) * 100vw));
	height: auto;
	font-size: max(1.7rem, calc(17 / var(--baseWidth) * 100vw));
	border-radius: var(--bdrs30) 0 0 0;
	transition: 0s;
}
.is-sync .peopleProfile,
.interviewListc .peopleProfile{
	padding-block: max(20px, calc(20 / var(--baseWidth) * 100vw));
	padding-inline: max(20px, calc(20 / var(--baseWidth) * 100vw)) max(30px, calc(30 / var(--baseWidth) * 100vw));
}
.is-sync .profileName,
.interviewList .profileName{
	font-size: max(3.0rem, calc(30 / var(--baseWidth) * 100vw));
}
.is-sync .profilePosition,
.interviewListc .profilePosition{
	font-size: max(1.3rem, calc(13 / var(--baseWidth) * 100vw));
}

/* 注釈テキスト
========================================*/
.topNotes{
	display: none;
}

/*
	トップページ スライダー
-----------------------------------------------------------------------------------------------*/
.peopleSplide{
	width: calc((100vw - var(--widthBase)) / 2 + 800px);
	height: 100%;
	position: relative;
	overflow: visible;
	z-index: 0;
}
.peopleSplide .splide__track{
	overflow: visible;
}
.splide__list{
	/* height: max(515px, calc(515 / var(--baseWidth) * 100vw)); */
}
.splide__slide{
	width: max(240px, calc(240 / var(--baseWidth) * 100vw));
	margin-right: max(30px, calc(30 / var(--baseWidth) * 100vw));
	position: relative;
	opacity: 0;
	transition: var(--transitionBase);
	overflow: hidden;
	pointer-events: none;
	z-index: 0;
}
/* active */
.is-sync,
.is-sync ~ li{
	opacity: 1!important;
	pointer-events: all!important;
}
.splide__slide.is-sync{
	width: fit-content;
	transition: var(--transitionBase);
}

/*
	社員インタビュー（一覧）
-----------------------------------------------------------------------------------------------*/
.pageInterview #ctsWrapper{
	padding-bottom: 0;
}
/* 絞り込みボタン
========================================*/
.filterList{
	display: flex;
	justify-content: center;
	gap: max(10px, calc(10 / var(--baseWidth) * 100vw));
	flex-wrap: wrap;
	max-width: max(750px, calc(750 / var(--baseWidth) * 100vw));
	margin: 0 auto max(50px, calc(50 / var(--baseWidth) * 100vw));
}
.filterBtn{
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(140px, calc(140 / var(--baseWidth) * 100vw));
	height: max(35px, calc(35 / var(--baseWidth) * 100vw));
	color: var(--colorGrey400);
	font-size: max(1.4rem, calc(14 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	border: 1px solid var(--colorGrey400);
	border-radius: max(5px, calc(5 / var(--baseWidth) * 100vw));
	transition: background-color .4s;
}
@media (any-hover: hover){
	.filterBtn:not(.active):hover{
		color: #fff;
		background: var(--colorGrey400);
		transition: background-color .4s;
	}
	/* 各部署カラー */
	.filterBtn.sales:not(.active):hover{
		background: var(--colorGreen);
		border: 1px solid var(--colorGreen);
	}
	.filterBtn.product-dev:not(.active):hover{
		background: var(--colorYellow);
		border: 1px solid var(--colorYellow);
	}
	.filterBtn.policy-maintenance:not(.active):hover{
		background: var(--colorBlue);
		border: 1px solid var(--colorBlue);
	}
	.filterBtn.marketing:not(.active):hover{
		background: var(--colorOrange);
		border: 1px solid var(--colorOrange);
	}
	.filterBtn.hrd:not(.active):hover,
	.filterBtn.administration:not(.active):hover{
		background: var(--colorRed);
		border: 1px solid var(--colorRed);
	}
	.filterBtn.contract-dev:not(.active):hover{
		background: var(--colorLightBlue);
		border: 1px solid var(--colorLightBlue);
	}
}

/* active */
.filterBtn.active{
	color: #fff;
}
.all.active{
	background: var(--colorGrey400);
}
.administration.active{
	border: 1px solid var(--colorRed);
	background: var(--colorRed);
}
.hrd.active{
	border: 1px solid var(--colorRed);
	background: var(--colorRed);
}
.marketing.active{
	border: 1px solid var(--colorOrange);
	background: var(--colorOrange);
}
.sales.active{
	border: 1px solid var(--colorGreen);
	background: var(--colorGreen);
}
.policy-maintenance.active{
	border: 1px solid var(--colorBlue);
	background: var(--colorBlue);
}
.product-dev.active{
	border: 1px solid var(--colorYellow);
	background: var(--colorYellow);
}
.contract-dev.active{
	border: 1px solid var(--colorLightBlue);
	background: var(--colorLightBlue);
}
/* リスト
============================== */
.interviewList{
	display: flex;
	flex-wrap: wrap;
	gap: max(50px, calc(50 / var(--baseWidth) * 100vw));
	max-width: var(--width1000);
	margin: 0 auto;
}
.interviewList .peopleLink{
	height: stretch;
}
.interviewList .peopleProfile{
	height: calc(100% - max(400px, calc(400 / var(--baseWidth) * 100vw)));
	padding-block: max(24px, calc(24 / var(--baseWidth) * 100vw));
	padding-inline: 0 max(40px, calc(40 / var(--baseWidth) * 100vw));
}
.interviewList .profilePosition{
	min-height: max(34px, calc(34 / var(--baseWidth) * 100vw));
	font-size: max(1.3rem, calc(13 / var(--baseWidth) * 100vw));
}

/*
	社員インタビュー詳細
-----------------------------------------------------------------------------------------------*/
/* コンテンツ共通
============================== */
.detailHead{
	margin-bottom: max(20px, calc(20 / var(--baseWidth) * 100vw));
	font-size: max(2.4rem, calc(24 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	line-height: 1.4;
	letter-spacing: .2rem;
}
.detailTxt{
	font-size: max(1.5rem, calc(15 / var(--baseWidth) * 100vw));
	font-weight: var(--fwRegular);
	line-height: 1.8;
	text-align: justify;
	letter-spacing: .1rem;
}
.detailHeadEn{
	display: block;
	margin-top: max(10px, calc(10 / var(--baseWidth) * 100vw));
	font-family: var(--ffEn);
	font-size: max(1.6rem, calc(16 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	color: var(--colorMain);
	line-height: 1.0;
	letter-spacing: .1rem;
}
[class^="pageDetail-"] [class$="Img"]{
	overflow: hidden;
}
[class^="pageDetail-"] [class*="Img"] img{
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* #pageKv
============================== */
[class^="pageDetail-"] .pageKvInner{
	height: auto;
	min-height: max(450px, calc(450 / var(--baseWidth) * 100vw));
	background: var(--bgNoise), url(/recruit/images/bg_detail01_pc.png) no-repeat center center / cover;
}
[class^="pageDetail-"] .pageKvImg{
	width: max(750px, calc(750 / var(--baseWidth) * 100vw));
}
[class^="pageDetail-"] .pageHead{
	max-width: max(770px, calc(770 / var(--baseWidth) * 100vw));
}
[class^="pageDetail-"] .pageHeadTxt{
	height: max(60px, calc(60 / var(--baseWidth) * 100vw));
	padding-block: max(2px, calc(2 / var(--baseWidth) * 100vw)) max(6px, calc(6 / var(--baseWidth) * 100vw));
	padding-inline: max(16px, calc(16 / var(--baseWidth) * 100vw));
	font-size: max(3.0rem, calc(30 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	line-height: 2.0;
	letter-spacing: .1rem;
	color: #fff;
	border-radius: max(5px, calc(5 / var(--baseWidth) * 100vw));
	background: var(--colorBlack);
	position: relative;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}
.pageData{
	width: max(320px, calc(320 / var(--baseWidth) * 100vw));
	display: flex;
	align-items: start;
	flex-direction: column;
	gap: max(10px, calc(10 / var(--baseWidth) * 100vw));
	margin-top: max(22px, calc(22 / var(--baseWidth) * 100vw));
}
[class^="pageDetail-"] .captionDep{
	height: max(30px, calc(30 / var(--baseWidth) * 100vw));
	padding-inline: max(20px, calc(20 / var(--baseWidth) * 100vw));
	font-size: max(1.5rem, calc(15 / var(--baseWidth) * 100vw));
	border-radius: max(15px, calc(15 / var(--baseWidth) * 100vw));
	position: static;
}
/* カラー */
.pageDetail-sales .captionDep,
[class^="sales"] .captionDep{
	background: var(--colorGreen);
}
.pageDetail-contract-dev .captionDep,
.contract-dev .captionDep{
	background: var(--colorLightBlue);
}
.pageDetail-policy-maintenance .captionDep,
.policy-maintenance .captionDep{
	background: var(--colorBlue);
}
.pageDetail-product-dev .captionDep,
.product-dev .captionDep{
	background: var(--colorYellow);
}
.pageDetail-marketing .captionDep,
.marketing .captionDep{
	background: var(--colorOrange);
}
.pageDetail-administration .captionDep,
.administration .captionDep{
	background: var(--colorRed);
}
.pageDetail-hrd .captionDep,
.hrd .captionDep{
	background: var(--colorRed);
}

[class^="pageDetail-"] .profileName{
	font-size: max(4.0rem, calc(40 / var(--baseWidth) * 100vw));
}
[class^="pageDetail-"] .profilePosition{
	margin-top: 0;
	font-size: max(1.5rem, calc(15 / var(--baseWidth) * 100vw));
	color: var(--colorBlack);
	line-height: 1.5;
}
/* #articleWrapper
============================== */
#articleWrapper .ctsArea{
	display: flex;
	flex-direction: column;
	gap: max(50px, calc(50 / var(--baseWidth) * 100vw));
	width: var(--width1000);
	padding-top: 0;
	text-align: left;
}
.outline{
	padding-bottom: max(50px, calc(50 / var(--baseWidth) * 100vw));
	border-bottom: 1px solid var(--colorGrey100);
}
.article-2clm{
	display: flex;
	justify-content: start;
	flex-wrap: wrap;
	gap: max(50px, calc(50 / var(--baseWidth) * 100vw));
	text-align: justify;
}
.articleHead{
	/* min-height: max(68px, calc(68 / var(--baseWidth) * 100vw)); */
	margin-bottom: max(16px, calc(16 / var(--baseWidth) * 100vw));
	color: var(--colorMain);
}
.articleHeadNum{
	display: inline-block;
	margin-bottom: max(8px, calc(8 / var(--baseWidth) * 100vw));
	font-family: var(--ffEn);
	font-size: max(2.0rem, calc(20 / var(--baseWidth) * 100vw));
	font-weight: 500;
	line-height: 1.0;
	letter-spacing: 0;
	color: var(--colorMain);
}
.articleHead .detailHead{
	margin-bottom: 0;
}
.articleHeadSubtxt{
	display: block;
	margin-top: max(8px, calc(8 / var(--baseWidth) * 100vw));
	font-size: max(1.8rem, calc(18 / var(--baseWidth) * 100vw));
	font-weight: var(--fwMedium);
	line-height: 1.0;
	letter-spacing: .1rem;
}
.articleBox:has(img){
	height: max(500px, calc(500 / var(--baseWidth) * 100vw));
	border-radius: var(--bdrs30);
	overflow: hidden;
}
.articleBox:has(img) img{
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.article-2clm .articleBox{
	width: calc((100% - max(50px, calc(50 / var(--baseWidth) * 100vw))) / 2);
}
.article-2clm .articleBox:has(img){
	height: max(300px, calc(300 / var(--baseWidth) * 100vw));
}
/* #scheduleWrapper
============================== */
#scheduleWrapper{
	background: var(--bgNoise), url(/recruit/images/bg_detail02_pc.png) no-repeat top center / cover;
	margin-bottom: max(80px, calc(80 / var(--baseWidth) * 100vw));
	position: relative;
}
#scheduleWrapper:has(.scheduleImg){
	background: var(--bgNoise), url(/recruit/images/bg_detail02_pc.png) no-repeat top center / 100% max(650px, calc(650 / var(--baseWidth) * 100vw));
	margin-bottom: 0;
}
.scheduleList{
	display: flex;
	flex-wrap: nowrap;
	/* margin-inline: 70px; */
	text-align: left;
	letter-spacing: .1rem;
}
.scheduleList li{
	flex: 1;
}
.scheduleTime{
	margin-bottom: max(15px, calc(15 / var(--baseWidth) * 100vw));
	padding-bottom: max(15px, calc(15 / var(--baseWidth) * 100vw));
	font-family: var(--ffEn);
	font-size: max(1.6rem, calc(16 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	position: relative;
}
.scheduleTime::before,
.scheduleTime::after{
	content: '';
	background: var(--colorBlack);
	position: absolute;
}
.scheduleTime::before{
	width: max(11px, calc(11 / var(--baseWidth) * 100vw));
	height: max(11px, calc(11 / var(--baseWidth) * 100vw));
	border-radius: max(6px, calc(6 / var(--baseWidth) * 100vw));
	bottom: max(-5px, calc(-5 / var(--baseWidth) * 100vw));
	left: max(-5px, calc(-5 / var(--baseWidth) * 100vw));
}
.scheduleTime::after{
	width: 100%;
	height: max(2px, calc(2 / var(--baseWidth) * 100vw));
	bottom: 0;
	left: 0;
}
.scheduleTime ~ *{
	padding-right: max(20px, calc(20 / var(--baseWidth) * 100vw));
}
.scheduleTit{
	font-size: max(1.4rem, calc(14 / var(--baseWidth) * 100vw));
	font-weight: var(--fwBold);
	color: var(--colorMain);
	line-height: 1.4;
}
.scheduleTxt{
	margin-top: max(8px, calc(8 / var(--baseWidth) * 100vw));
	font-size: max(1.2rem, calc(12 / var(--baseWidth) * 100vw));
	font-weight: var(--fwRegular);
	line-height: 1.5;
}
.scheduleImg{
	width: var(--width1000);
	height: max(500px, calc(500 / var(--baseWidth) * 100vw));
	margin: max(50px, calc(50 / var(--baseWidth) * 100vw)) auto 0;
	border-radius: var(--bdrs30);
	position: relative;
	overflow: hidden;
}
/* #messageWrapper
============================== */
#messageWrapper{
	display: flex;
	align-items: start;
	justify-content: center;
	flex-direction: column;
	width: var(--width1000);
	min-height: max(350px, calc(350 / var(--baseWidth) * 100vw));
	margin: 0 auto;
	padding-right: 0;
	text-align: left;
	position: relative;
}
#messageWrapper:has(.messageImg){
	padding-right: max(400px, calc(400 / var(--baseWidth) * 100vw));
}
.messageImg{
	width: max(350px, calc(350 / var(--baseWidth) * 100vw));
	height: max(350px, calc(350 / var(--baseWidth) * 100vw));
	border-radius: max(175px, calc(175 / var(--baseWidth) * 100vw));
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
}
/* #jobsWrapper
============================== */
#jobsWrapper{
	width: var(--width1000);
	min-height: max(350px, calc(350 / var(--baseWidth) * 100vw));
	margin-block: max(50px, calc(50 / var(--baseWidth) * 100vw)) max(80px, calc(80 / var(--baseWidth) * 100vw));
	margin-inline: auto;
	padding-left: max(400px, calc(400 / var(--baseWidth) * 100vw));
	position: relative;
}
.jobsBox{
	display: flex;
	align-items: start;
	justify-content: center;
	flex-direction: column;
	gap: max(20px, calc(20 / var(--baseWidth) * 100vw));
}
.jobsIllust{
	display: flex;
	align-items: center;
	justify-content: center;
	width: max(350px, calc(350 / var(--baseWidth) * 100vw));
	height: max(350px, calc(350 / var(--baseWidth) * 100vw));
	border: max(35px, calc(35 / var(--baseWidth) * 100vw)) solid;
	border-radius: max(175px, calc(175 / var(--baseWidth) * 100vw));
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0, -50%);
}
/* カラー */
[class^="sales"] .jobsIllust{
	border-color: var(--colorGreen);
}
.contract-dev .jobsIllust{
	border-color: var(--colorLightBlue);
}
.policy-maintenance .jobsIllust{
	border-color: var(--colorBlue);
}
.product-dev .jobsIllust{
	border-color: var(--colorYellow);
}
.marketing .jobsIllust{
	border-color: var(--colorOrange);
}
.administration .jobsIllust,
.hrd .jobsIllust{
	border-color: var(--colorRed);
}

.jobsImg{
	width: max(140px, calc(140 / var(--baseWidth) * 100vw));
}
/* #indexWrapper
============================== */
#indexWrapper{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: var(--width1000);
	margin: 0 auto;
	padding-block: max(30px, calc(30 / var(--baseWidth) * 100vw));
	border-top: 1px solid var(--colorGrey100);
	border-bottom: 1px solid var(--colorGrey100);
}
[class^="indexLink-"]{
	/* font-family: var(--ffEn); */
	font-size: max(1.8rem, calc(18 / var(--baseWidth) * 100vw));
	font-weight: 700;
}
.indexImg{
	width: max(30px, calc(30 / var(--baseWidth) * 100vw));
	margin: 0 auto max(10px, calc(10 / var(--baseWidth) * 100vw));
}
.indexLink-prev,
.indexLink-next{
	position: relative;
}
[class^="indexLink-"] .btnIcon{
	width: max(25px, calc(25 / var(--baseWidth) * 100vw));
	height: max(25px, calc(25 / var(--baseWidth) * 100vw));
	background: var(--colorBlack) url(/recruit/images/ico_arrow_wh.svg) no-repeat 50% center / 50%;
	position: absolute;
	transition: var(--transitionBase);
}
.indexLink-prev{
	padding-left: max(40px, calc(40 / var(--baseWidth) * 100vw));
}
.indexLink-prev .btnIcon{
	left: 0;
	scale: -1 1;
}
.indexLink-next{
	padding-right: max(40px, calc(40 / var(--baseWidth) * 100vw));
}
.indexLink-next .btnIcon{
	right: 0;
}
@media (any-hover: hover){
	[class^="indexLink-"]:hover{
		color: var(--colorMain);
	}
	[class^="indexLink-"]:hover .btnIcon{
		background-color: var(--colorMain);
		transition: var(--transitionBase);
	}
}
@media screen and (width <= 812px){
	/*
		コンテンツ共通
	-----------------------------------------------------------------------------------------------*/
	/* リスト装飾
	============================== */
	a.peopleLink{
		width: 85%;
	}
	.peopleImg{
		width: 100%;
		border-radius: 16px;
	}
	.captionDep{
		min-width: 60px;
		height: 18px;
		padding-inline: 12px;
		font-size: 1.0rem;
		border-radius:9px;
		top: 13px;
		left: 13px;
	}
	.peopleCaption .captionCopy{
		padding: 16px 10px 12px 20px;
		height: auto;
		font-size: 1.4rem;
	}
	.peopleProfile{
		padding-block: 16px;
		padding-left: 13px;
	}
	.profileName{
		font-size: 2.2rem;
	}
	.profilePosition{
		margin-top: 6px;
	}
	/* トップページ スライダーactive／社員インタビュー（一覧）リスト
	============================== */
	.is-sync a.peopleLink,
	.interviewList a.peopleLink{
		width: 100%;
	}
	.is-sync .peopleImg,
	.interviewList .peopleImg{
		width: 100%;
	}
	.is-sync .captionDep,
	.interviewList .captionDep{
		min-width: 80px;
		height: 22px;
		font-size: 1.2rem;
		border-radius: 11px;
		top: 15px;
		left: 15px;
	}
	.is-sync .peopleCaption .captionCopy,
	.interviewList .captionCopy{
		padding: 15px 10px 14px 18px;
		height: auto;
		font-size: 1.4rem;
	}
	.is-sync .peopleProfile,
	.interviewListc .peopleProfile{
		padding-block: 20px;
		padding-left: 15px;
	}
	.is-sync .profileName,
	.interviewList .profileName{
		font-size: 2.4rem;
	}
	.is-sync .profilePosition,
	.interviewListc .profilePosition{
		font-size: 1.1rem;
	}
	/* 注釈テキスト
	========================================*/
	.topNotes{
		display: block;
		margin-bottom: 20px;
		text-align: center;
		font-size: 1.2rem;
	}


	/*
		トップページ スライダー
	-----------------------------------------------------------------------------------------------*/
	.peopleSplide{
		width: 100%;
	}
	.splide__list{
		height: auto;
	}
	.splide__slide{
		width: 85%;
		margin-right: 25px;
	}
	.splide__slide .topNotes{
		padding-inline: 20px;
		text-align: left;
	}



	/*
		社員インタビュー（一覧）
	-----------------------------------------------------------------------------------------------*/
	.pageInterview #ctsWrapper{
		padding-bottom: 0;
	}
	/* 絞り込みボタン
	========================================*/
	.filterList{
		justify-content: start;
		max-width: none;
		margin: 0 auto 36px;
	}
	.filterList li{
		width: calc((100% - 10px)/2);
	}
	.filterBtn{
		width: 100%;
		height: 35px;
		font-size: 1.2rem;
	}
	/* リスト
	============================== */
	.interviewList{
		gap: 30px;
	}
	.interviewList li{
		width: 100%;
	}
	.interviewList .peopleLink{
		height: stretch;
	}
	.interviewList .peopleImg{
		height: auto;
	}
	.interviewList .peopleProfile{
		height: auto;
		padding-block: 20px 16px;
	}
	.interviewList .profilePosition{
		min-height: auto;
		font-size: 1.2rem;
	}
	/*
		社員インタビュー詳細
	-----------------------------------------------------------------------------------------------*/
	/* コンテンツ共通
	============================== */
	.detailHead{
		margin: 0 0 22px;
		font-size: 2.2rem;
		line-height: 1.4;
		letter-spacing: .1rem;
	}
	.detailTxt{
		font-size: 1.4rem;
		line-height: 1.7;
	}
	.detailHeadEn{
		margin-top: 6px;
		font-size: 1.3rem;
	}
	[class^="pageDetail-"] [class$="Img"]{
		overflow: hidden;
	}
	[class^="pageDetail-"] [class$="Img"] img{
		width: 100%;
		max-width: none;
		height: 100%;
		object-fit: cover;
		object-position: center;
	}
	/* #pageKv
	============================== */
	[class^="pageDetail-"] .pageKvInner{
		height: auto;
		min-height: max(450px, calc(450 / var(--baseWidth) * 100vw));
	}
	.pageKvCts{
		position: relative;
	}
	[class^="pageDetail-"] .pageKvImg{
		height: 370px;
	}
	[class^="pageDetail-"] .pageHead{
		max-width: max(760px, calc(750 / var(--baseWidth) * 100vw));
		padding: 0 18px;
		line-height: 1.4;
		position: absolute;
		bottom: 30px;
	}
	[class^="pageDetail-"] .pageHeadTxt{
		padding: 2px 10px 4px;
		font-size: 2.0rem;
		line-height: 2.0;
	}
	.pageData{
		gap: 6px;
		width: 100%;
		margin-top: 0;
		padding: 30px 55px 28px;
	}
	[class^="pageDetail-"] .captionDep{
		height: 22px;
		padding-inline: 14px;
		font-size: 1.2rem;
		border-radius: 11px;
	}
	[class^="pageDetail-"] .profileName{
		font-size: 2.8rem;
	}
	[class^="pageDetail-"] .profilePosition{
		font-size: 1.2rem;
		line-height: 1.4;
	}
	/* イラスト */
	[class^="pageDetail-"] .graphic02{
		bottom: -55px;
	}

	/* #articleWrapper
	============================== */
	#articleWrapper .ctsArea{
		gap: 36px;
	}
	.outline{
		padding-bottom: 36px;
	}
	.article-2clm{
		flex-direction: column;
		gap: 36px;
	}
	.articleHead{
		min-height: auto;
		margin-bottom: 10px;
	}
	.articleHead .detailHead{
		margin-bottom: 0;
	}
	.articleHeadSubtxt{
		margin-top: 3px;
		font-size: 1.6rem;
		line-height: 1.3;
		letter-spacing: 0;
	}
	.articleBox:has(img){
		height: 60vw;
		max-height: 300px;
	}
	.article-2clm .articleBox{
		width: 100%;
	}
	.article-2clm .articleBox:has(img){
		height: 60vw;
		max-height: 300px;
	}
	/* #scheduleWrapper
	============================== */
	#scheduleWrapper{
		background: var(--bgNoise), url(/recruit/images/bg_detail02_pc.png) no-repeat top center / cover;
		margin-bottom: 40px;
	}
	#scheduleWrapper:has(.scheduleImg){
		background: var(--bgNoise), url(/recruit/images/bg_detail02_pc.png) no-repeat top center / 100% calc(100% - (70px + 30vw));
		margin-bottom: 0;
	}
	#scheduleWrapper .ctsArea{
		max-width: none;
		padding-inline: 0;
	}
	.scheduleList{
		margin-inline: 25px;
		padding: 0 25px;
		overflow-x: scroll;
	}
	.scheduleList li{
		flex: none;
		width: 150px;
	}
	.scheduleTime{
		margin-bottom: 12px;
		padding-bottom: 10px;
		font-size: 1.2rem;
	}
	.scheduleTime::before{
		width: 9px;
		height: 9px;
		border-radius: 5px;
		bottom: -3px;
		left: max(-5px, calc(-5 / var(--baseWidth) * 100vw));
	}
	.scheduleTime::after{
		width: 100%;
		height: max(2px, calc(2 / var(--baseWidth) * 100vw));
		bottom: 0;
		left: 0;
	}
	.scheduleTime ~ *{
		padding-right: 16px;
	}
	.scheduleTit{
		font-size: 1.3rem;
		line-height: 1.3;
	}
	.scheduleTxt{
		margin-top: 5px;
		font-size: 1.1rem;
		line-height: 1.4;
	}
	.scheduleImg{
		width: calc(100% - 50px);
		max-width: 500px;
		height: 60vw;
		max-height: 300px;
		margin: 30px auto 0;
	}
	/* #messageWrapper
	============================== */
	#messageWrapper{
		align-items: center;
		min-height: auto;
		padding: 0 25px;
		text-align: center;
	}
	#messageWrapper:has(.messageImg){
		max-width: 500px;
		padding-right: 25px;
	}
	.messageImg{
		width: 65%;
		height: auto;
		margin-bottom: 18px;
		border-radius: 100%;
		position: static;
		transform: none;
		aspect-ratio: 1 / 1;
	}
	/* #jobsWrapper
	============================== */
	#jobsWrapper{
		max-width: 500px;
		min-height: auto;
		margin-block: 50px 70px;
		padding: 0 25px;
		text-align: center;
	}
	.jobsBox{
		align-items: center;
	}
	.jobsIllust{
		width: 65%;
		height: auto;
		border: 25px solid;
		border-radius: 100%;
		position: static;
		transform: none;
		aspect-ratio: 1 / 1;
	}
	.jobsImg{
		width: 60%;
	}
	/* #indexWrapper
	============================== */
	#indexWrapper{
		width: calc(100% - 50px);
		margin: 0 25px;
		padding-block: 18px;
	}
	[class^="indexLink-"]{
		font-size: 1.4rem;
		letter-spacing: .07rem;
	}
	.indexImg{
		width: 23px;
		margin: 0 auto 4px;
	}
	[class^="indexLink-"] .btnIcon{
		width: 20px;
		height: 20px;
	}
	.indexLink-prev{
		padding-left: 28px;
	}
	.indexLink-next{
		padding-right: 28px;
	}
}