@charset "UTF-8";

.hakenTopMv {
	display: flex;
	align-items: center;
	background: url("/assets/img/haken/top_mv.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	height: 450px
}
.webp .hakenTopMv {
	background-image: url("/assets/img/haken/top_mv.webp");
}
@media screen and (max-width:560px) {
	.hakenTopMv {
		height: 210px;
		background-position: 20% 50%
	}
}
.hakenTopHeading {
	padding-left: 2em;
	margin-right: auto
}
.hakenTopMvContent {
	background: rgba(255, 255, 255, 0.7);
	width: 40%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center
}
@media screen and (max-width:560px) {
	.hakenTopMvContent {
		background: white;
		padding: 2em 0;
		width: 100%
	}
}
.hakenTopMvContentInner {
	width: 80%
}
@media screen and (max-width:560px) {
	.hakenTopMvContentInner {
		width: 90%
	}
}
.hakenTopMvTitle {
	font-size: 24px;
	color: #004831;
	font-weight: bold;
	margin-bottom: 1em;
	text-align: center
}
@media screen and (max-width:560px) {
	.hakenTopMvTitle {
		font-size: 20px
	}
}
.hakenTopMvTitle>img {
	padding-right: 0.5em
}
@media screen and (max-width:560px) {
	.hakenTopMvTitle>img {
		padding-right: 0.3em;
		width: 30px
	}
}
.hakenMvTopLabel {
	font-weight: bold;
	padding-bottom: 0.4em;
	font-size: 14px
}
@media screen and (max-width:560px) {
	.hakenMvTopLabel {
		font-size: 12px
	}
}
.hakenMvTopSearchContainer {
	width: 100%;
	border-radius: 6px;
	position: relative;
	background: #fff;
	margin-bottom: 1em;
	border: 1px solid #cdd6dd
}
@media screen and (max-width:560px) {
	.hakenMvTopSearchContainer {
		background: #f0f3f5;
		border: none
	}
}
.hakenMvTopSearchContainer>input {
	display: inline-block;
	width: 100%;
	padding: 1em
}
.hakenMvTopSearchInput {
	height: 80%;
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	transition: all 0.3s
}
.hakenMvTopSearchInput>input {
	transition: all 0.3s;
	height: 100%;
	background: #004831;
	color: #fff;
	border-radius: 30px;
	padding: 0 2em 0 1em;
	border: 2px solid #004831
}
@media screen and (max-width:560px) {
	.hakenMvTopSearchInput {
		font-size: 14px
	}
}
.hakenMvTopSearchInput:hover>input {
	background: #fff;
	color: #004831
}
.hakenMvTopSearchInput:hover::before, .hakenMvTopSearchInput:hover::after {
	background: #004831
}
.hakenMvTopSearchInput::before, .hakenMvTopSearchInput::after {
	content: "";
	width: 8px;
	height: 2px;
	display: inline-block;
	border-radius: 2px;
	background: #fff;
	position: absolute;
	right: 13px;
	transition: all 0.3s
}
.hakenMvTopSearchInput::before {
	top: calc(50% + 2px);
	transform: rotate(-45deg)
}
.hakenMvTopSearchInput::after {
	top: calc(50% - 3px);
	transform: rotate(45deg)
}
.hakenMvTopButtonsContainer {
	display: flex;
	justify-content: space-between;
}
.hakenMvTopButtonsContainer .hakenMvTopButtons:first-child {
	margin-right: 1em
}
@media screen and (max-width:560px) {
	.hakenMvTopButtonsContainer .hakenMvTopButtons:first-child {
		margin-right: 0.5em
	}
}
.hakenMvTopButtons {
	display: inline-block;
	text-align: center;
	padding: 1em 1em 1em 0;
	flex: 1;
	border-radius: 6px;
	background: #004831;
	color: #ffffff;
	font-weight: bold;
	position: relative;
	transition: all 0.3s;
	border: 2px solid #004831
}
.hakenMvTopButtons:hover {
	background: #fff;
	color: #004831
}
.hakenMvTopButtons:hover::before, .hakenMvTopButtons:hover::after {
	background: #004831
}
.hakenMvTopButtons>p {
	font-size: 16px
}
@media screen and (max-width:560px) {
	.hakenMvTopButtons>p {
		font-size: 12px
	}
}
.hakenMvTopButtons>p>span {
	padding-right: 0.3em;
	font-size: 20px
}
@media screen and (max-width:560px) {
	.hakenMvTopButtons>p>span {
		font-size: 16px
	}
}
.hakenMvTopButtons::before, .hakenMvTopButtons::after {
	content: "";
	width: 8px;
	height: 2px;
	display: inline-block;
	border-radius: 2px;
	background: #fff;
	position: absolute;
	right: 10px;
	transition: all 0.3s
}
.hakenMvTopButtons::before {
	top: calc(50% + 2px);
	transform: rotate(-45deg)
}
.hakenMvTopButtons::after {
	top: calc(50% - 3px);
	transform: rotate(45deg)
}
.hakenTopNavi {
	padding-top: 4em;
	padding-bottom: 4em;
}
@media screen and (max-width:560px) {
	.hakenTopNavi {
		padding-top: 1em;
		padding-bottom: 2em;
	}
}
.hakenTopFeatures {
	background: rgba(246, 152, 150, 0.15);
	padding: 4em 0
}
@media screen and (max-width:560px) {
	.hakenTopFeatures {
		padding: 2em 0
	}
}
.hakenTopFeaturesTitle {
	font-size: 32px;
	font-weight: bold;
	color: #3b4043;
	text-align: center
}
@media screen and (max-width:560px) {
	.hakenTopFeaturesTitle {
		font-size: 20px;
		color: #004831
	}
}
.hakenTopFeaturesList {
	/* width: 90%;
	max-width: 1160px; */
	/* width: 1160px; */
	width: 1240px;
	padding: 3em 20px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 40px;
}
@media screen and (max-width:560px) {
	.hakenTopFeaturesList {
		width: 90%;
		padding: 2em 0;
		display: block
	}
}
.hakenTopFeaturesItem {
	background-repeat: no-repeat;
	background-size: cover;
	height: 260px;
	border-radius: 6px;
	display: flex;
	align-items: flex-end;
	width: calc(50% - 20px);
}
.hakenFeatures1 {
	background-image: url("/assets/img/haken/top_feature1.jpg");
}
.webp .hakenFeatures1 {
	background-image: url("/assets/img/haken/top_feature1.webp");
}
.hakenFeatures2 {
	background-image: url("/assets/img/haken/top_feature2.jpg");
}
.webp .hakenFeatures2 {
	background-image: url("/assets/img/haken/top_feature2.webp");
}
.hakenFeatures3 {
	background-image: url("/assets/img/haken/top_feature3.jpg");
}
.webp .hakenFeatures3 {
	background-image: url("/assets/img/haken/top_feature3.webp?var=2");
}
.hakenFeatures4 {
	background-image: url("/assets/img/haken/top_feature4.jpg");
	background-position: left -30px;
}
.webp .hakenFeatures4 {
	background-image: url("/assets/img/haken/top_feature4.webp?var=2");
}
.hakenSidebarFeaturesList .hakenFeatures4 {
	background-position: center;
}

@media screen and (max-width:560px) {
	.hakenTopFeaturesItem {
		width: 100%;
		height: auto;
		/* aspect-ratio: 1.6666666667; */
		padding-top: 39vw;
		margin-bottom: 20px;
	}
	.hakenFeatures4,
	.hakenSidebarFeaturesList .hakenFeatures4 {
		background-position: left -4vw;
	}
}
.hakenTopFeaturesItem p {
	display: inline-block;
	transition: all 0.3s;
	border-bottom: 1px solid transparent
}
.hakenTopFeaturesItem:hover {
	color: #fff
}
.hakenTopFeaturesItem:hover p {
	border-color: #fff
}
.hakenTopFeaturesItem:hover .circle {
	background: #fff;
	border: 2px solid #004831
}
.hakenTopFeaturesItem:hover .circle::before, .hakenTopFeaturesItem:hover .circle::after {
	background: #004831
}
.hakenTopFeaturesItemContent {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	padding: 1em;
	background: rgba(0, 72, 49, 0.7);
	color: #fff;
	font-size: 18px
}
@media screen and (max-width:560px) {
	.hakenTopFeaturesItemContent {
		font-size: 16px
	}
}
.hakenTopFeaturesItemContent>p {
	display: inline-block
}
.hakenTopFeaturesButtonContainer {
	margin-top: 2em;
	display: flex;
	justify-content: center
}
@media screen and (max-width:560px) {
	.hakenTopFeaturesButtonContainer {
		margin-top: 0
	}
}
.hakenTopFeaturesButtonBallon {
	position: absolute;
	z-index: 2;
	top: -10%;
	left: 10%;
	transform: translateY(-50%);
	display: inline-block;
	margin: 1.5em 15px 1.5em 0;
	padding: 2em 5px;
	width: 90px;
	height: 90px;
	line-height: 1.5;
	text-align: center;
	color: #004831;
	font-size: 14px;
	font-weight: bold;
	background: #c4d700;
	border-radius: 50%;
	box-sizing: border-box
}
@media screen and (max-width:560px) {
	.hakenTopFeaturesButtonBallon {
		width: 55px;
		height: 55px;
		font-size: 11px;
		left: -5%;
		padding: 1.1em 5px
	}
}
.hakenTopFeaturesButtonBallon::before {
	content: "";
	position: absolute;
	bottom: -12px;
	right: -8px;
	margin-top: -20px;
	border: 15px solid transparent;
	border-left: 25px solid #c4d700;
	z-index: 1;
	transform: rotate(45deg)
}
@media screen and (max-width:560px) {
	.hakenTopFeaturesButtonBallon::before {
		bottom: 0px;
		right: -10px;
		border: 5px solid transparent;
		border-left: 15px solid #c4d700;
		transform: rotate(35deg)
	}
}
.hakenTopFeaturesButton {
	width: 560px;
	padding: 1.5em 0;
	font-size: 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: relative
}
@media screen and (max-width:560px) {
	.hakenTopFeaturesButton {
		width: 70%;
		font-size: 14px
	}
}
.hakenTopFeaturesButton>.circle {
	margin-right: 1.5em;
	margin-left: -1.5em
}
@media screen and (max-width:560px) {
	.hakenTopFeaturesButton>.circle {
		background: #004831
	}
	.hakenTopFeaturesButton>.circle::before, .hakenTopFeaturesButton>.circle::after {
		background: #fff
	}
}
.hakenTopFeaturesButton:hover>.circle {
	background: #004831
}
.hakenTopFeaturesButton:hover>.circle::before, .hakenTopFeaturesButton:hover>.circle::after {
	background: #fff
}
.hakenTopInner {
	/* width: 90%;
	max-width: 1160px; */
	/* width: 1160px; */
	width: 1240px;
	padding: 0 20px;
	margin: 0 auto
}
.hakenTopRecruitment {
	padding: 5em 0
}
@media screen and (max-width:560px) {
	.hakenTopInner {
		width: 90%;
		padding: 0;
	}
	.hakenTopRecruitment {
		padding: 35px 0 30px 0
	}
}
.hakenTopRecruitmentTitleContainer {
	display: flex;
	justify-content: space-between;
	align-items: center
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentTitleContainer {
		display: block
	}
}
.hakenTopRecruitmentTitle {
	font-size: 32px;
	font-weight: bold;
	color: #004831
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentTitle {
		font-size: 20px;
		text-align: center
	}
}
.hakenTopRecruitmentTabContainer {
	width: 70%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	/* gap: 0.5em */
}
.hakenTopRecruitmentTabContainer .hakenTopRecruitmentTab:first-child {
	margin-right: 0.5em;
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentTabContainer {
		margin-top: 2em;
		width: 100%
	}
}
.hakenTopRecruitmentTab {
	flex: 1;
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	padding: 0.5em 0;
	background: #fff;
	border: 2px solid #004831;
	color: #004831;
	border-radius: 6px;
	position: relative
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentTab {
		font-size: 14px
	}
}
.hakenTopRecruitmentTab::before, .hakenTopRecruitmentTab::after {
	content: "";
	width: 8px;
	height: 2px;
	display: inline-block;
	border-radius: 2px;
	background: #004831;
	position: absolute;
	top: calc(50%)
}
.hakenTopRecruitmentTab::before {
	right: 21px;
	transform: rotate(45deg)
}
.hakenTopRecruitmentTab::after {
	right: 16.5px;
	transform: rotate(-45deg)
}
.hakenTopRecruitmentTab.active {
	background: #004831;
	color: #e1e7eb
}
.hakenTopRecruitmentTab.active::before {
	width: inherit;
	height: inherit;
	background: none;
	right: inherit;
	top: inherit;
	content: "";
	border-top: 15px solid #004831;
	border-right: 15px solid transparent;
	border-bottom: 15px solid transparent;
	border-left: 15px solid transparent;
	position: absolute;
	bottom: -30px;
	left: 50%;
	transform: translateX(-50%)
}
.hakenTopRecruitmentLinkContainer {
	display: flex;
	justify-content: center
}
.hakenTopRecruitmentLink {
	padding: 1em 0;
	width: 300px;
	text-align: center
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentLink {
		width: 100%;
		padding: 10px 0 0 0;
		font-weight: bold;
		font-size: 12px;
		display: flex;
		align-items: center;
		justify-content: center;
		/* gap: 10px */
	}
	.hakenTopRecruitmentLink .circle {
		margin-right: 10px
	}
}
.area {
	display: none
}
.area.active {
	display: block
}
.hakenTopRecruitmentList {
	padding: 3em 0 1em 0;
	gap: 2em 3em
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentList {
		grid-template-columns: repeat(1, 1fr);
		gap: 2em
	}
}
.hakenTopRecruitmentItem {
	border: 1px solid #cdd6dd;
	border-radius: 6px;
	margin-bottom: 2em
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItem:last-child {
		margin-bottom: 0
	}
}
.hakenTopRecruitmentItemTop {
	padding: 1em 2em;
	display: flex;
	align-items: center;
	border-bottom: 1px solid #cdd6dd;
	background: rgba(240, 243, 245, 0.5);
	font-weight: bold;
	font-size: 20px
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemTop {
		padding: 0.7em 1.2em
	}
}
.hakenTopRecruitmentItemTopRight {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-left: 1em
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemTopRight {
		width: calc(100% - 40px);
		display: block;
	}
}
.hakenTopRecruitmentItemTopRight>h3 {
	margin-right: auto
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemTopRight>h3 {
		line-height: 1.5;
		display: inline;
		font-size: 16px
	}
}
.hakenTopRecruitmentItemBottom {
	padding: 1em 2em;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2em
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottom {
		display: block;
		padding: 0.7em 1.5em 1em 1.5em
	}
}
.hakenTopRecruitmentItemBottomImg {
	width: 20%
}
.hakenTopRecruitmentItemBottom .noImage {
	line-height: 145px;
	text-align: center;
	background-color: #eee;
	font-size: 14px;
	width: 20%;
}
.hakenTopRecruitmentItemBottomInfo {
	width: 50%
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottomInfo {
		width: 100%
	}
}
.hakenTopRecruitmentItemBottomInfo>p {
	font-weight: bold;
	padding-bottom: 1em
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottomInfo>p {
		font-size: 14px
	}
}
.hakenTopRecruitmentItemBottomInfo li {
	position: relative;
	font-size: 14px;
	padding: 0 0 0.7em 0.5em;
	padding-left: 0.7em
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottomInfo li {
		font-size: 13px
	}
}
.hakenTopRecruitmentItemBottomInfo li>span {
	font-weight: bold;
	color: #3b4043
}
.hakenTopRecruitmentItemBottomInfo li:before {
	content: "";
	border-radius: 50%;
	width: 5px;
	height: 5px;
	display: block;
	position: absolute;
	left: 0;
	top: 0.6em;
	background: #98a6b5
}
.hakenTopRecruitmentItemBottomInfoSp {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1em
}
.hakenTopRecruitmentItemBottomInfoSp img {
	width: 30%
}
.hakenTopRecruitmentItemBottomButtons {
	width: 20%
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottomInfoSp {
		display: block;
		font-size: 13px;
		line-height: 1.8em;
	}
	.hakenTopRecruitmentItemBottomButtons {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		/* gap: 0.5em; */
		margin-top: 1em
	}
	.hakenTopRecruitmentItemBottomButtons .btn{ 
		margin-right: 0.5em;
	}
}
.hakenTopRecruitmentItemBottomButtons .btn {
	text-align: left;
	display: inline-block;
	width: 100%;
	padding: 1em 0 1em 1em;
	font-size: 14px
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottomButtons .btn {
		font-size: 12px;
		padding: 1em 0 1em 2em
	}
}
.hakenTopRecruitmentItemBottomButtons .btn:nth-child(n - 2) {
	margin-bottom: 0.5em
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottomButtons .btn:nth-child(n - 2) {
		margin-bottom: 0
	}
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottomButtons .btn:last-child {
		padding-right: 0.5em
	}
}
.hakenTopRecruitmentItemBottomButtons.is-small {
	padding-top: 1em;
	width: 50%;
	margin: 0 auto
}
.hakenTopRecruitmentItemBottomButtons.is-small>a {
	text-align: center
}
.hakenTopRecruitmentItemBottomButtons.is-small>a::after {
	position: absolute;
	top: 34%;
	left: 15%;
	transform: translateY(-50%)
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemBottomButtons.is-small>a::after {
		top: 31%
	}
}
.hakenTopMiddle {
	padding: 3em 0;
	background-image: url("/assets/img/haken/top_middle.png");
	background-size: cover;
	background-repeat: no-repeat;
	position: relative
}
.hakenTopMiddle::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 2;
	background: rgba(59, 64, 67, 0.5)
}
@media screen and (max-width:560px) {
	.hakenTopMiddle {
		display: none
	}
}
.hakenTopMiddleContent {
	width: 70%;
	max-width: 960px;
	position: sticky;
	z-index: 3;
	margin: 0 auto;
	background: #fff;
	padding: 2em 3em;
	display: flex;
	align-items: center;
	border: 5px solid #f0f3f5
}
.hakenTopMiddleContent>p {
	font-size: 20px;
	margin-left: 1em;
	margin-right: auto
}
.hakenTopMiddleLink {
	width: 30%;
	padding: 1em 0;
	position: relative
}
.hakenTopMiddleLink>svg {
	margin-right: 1em
}
.hakenTopFeature {
	background: rgba(27, 100, 171, 0.15);
	padding: 3em 0
}
.hakenTopFeatureTitle {
	font-size: 32px;
	font-weight: bold;
	color: #004831;
	text-align: center
}
@media screen and (max-width:560px) {
	.hakenTopFeatureTitle {
		font-size: 20px
	}
}
.hakenTopFeatureList {
	width: 90%;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1em 2em;
	margin-top: 2em
}
@media screen and (max-width:560px) {
	.hakenTopFeatureList {
		grid-template-columns: repeat(1, 1fr)
	}
}
.hakenTopFeatureItem {
	display: flex;
	align-items: center;
	background: #fff;
	border: 1px solid #cdd6dd;
	border-radius: 6px
}
.hakenTopFeatureItem>img {
	width: 173px;
	height: auto
}
@media screen and (max-width:560px) {
	.hakenTopFeatureItem>img {
		width: 84px;
		height: 84px;
		object-fit: cover
	}
}
.hakenTopFeatureItemTitle {
	width: 70%;
	font-weight: lighter;
	padding: 0 1em 0 2em;
	display: flex;
	justify-content: space-between;
	align-items: center
}
@media screen and (max-width:560px) {
	.hakenTopFeatureItemTitle {
		padding: 0 0em 0 1em
	}
}
.hakenTopFeatureItemTitle>h3 {
	width: 100%;
	font-size: 20px;
	display: inline-block;
	margin-right: auto
}
@media screen and (max-width:560px) {
	.hakenTopFeatureItemTitle>h3 {
		font-size: 14px;
		line-height: 1.5
	}
}
.hakenTopFeatureItemTitle>h3>span {
	font-weight: bold
}
@media screen and (max-width:560px) {
	.hakenTopFeatureItemTitle>h3>span {
		display: block
	}
}
.hakenTopBottom {
	padding: 5em 0
}
@media screen and (max-width:560px) {
	.hakenTopBottom {
		padding: 3em 0 13px 0;
		background: rgba(240, 243, 245, 0.5)
	}
}
.hakenTopBottomTxt {
	text-align: center;
	color: #004831;
	font-size: 24px
}
@media screen and (max-width:560px) {
	.hakenTopBottomTxt {
		display: block;
		line-height: 1.5;
		width: 90%;
		margin: 0 auto;
		font-size: 20px
	}
}
.hakenTopBottomContent {
	/* width: 90%;
	max-width: 1160px; */
	/* width: 1160px; */
	width: 1240px;
	padding: 3em 20px 0;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 3em;
}
@media screen and (max-width:560px) {
	.hakenTopBottomContent {
		width: 90%;
		padding: 0;
		display: block;
		grid-template-columns: repeat(1, 1fr);
		padding: 2em 0 0;
	}
}
.hakenTopBottomLink {
	border-radius: 3px;
	border-top: 1px solid #cdd6dd;
	display: flex;
	font-size: 16px;
	align-items: center;
	padding: 1.5em 0;
	font-weight: bold;
	transition: all 0.3s
}
@media screen and (max-width:560px) {
	.hakenTopBottomLink {
		margin-bottom: 0.5em;
		height: 64px;
		font-size: 13px;
		padding: 15px 0
	}
}
.hakenTopFooter {
	padding: 1em 0;
	background: #d83763;
	text-align: center;
	color: #ffffff
}
@media screen and (max-width:560px) {
	.hakenTopFooter {
		position: sticky;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 98
	}
	.login .hakenTopFooter {
		position: relative;
	}
}
.hakenTopFooterBtnContainer {
	padding-top: 1em
}
.hakenTopFooterBtn {
	padding: 1em 0;
	display: inline-block;
	width: 70%
}
.hakenTopFooterBtn::after {
	border-color: #d83763
}
.hakenSearchKeyword {
	font-size: 24px;
	color: #004831;
	font-weight: bold;
	padding-bottom: 4em
}
@media screen and (max-width:560px) {
	.hakenTopFooterBtnContainer {
		padding-top: 0;
	}
	.headerNavBottom .tenshokuTopMiddleLink svg {
		margin-right: 10px;
	}
	.hakenTopFooterBtn svg {
		fill: #d83763;
		margin-right: 10px;
	}
	.hakenSearchKeyword {
		font-size: 16px;
		padding-bottom: 2em
	}
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitment {
		padding: 3em 0 2em 0;
		width: 90%;
		margin: 0 auto
	}
}
.hakenSearchResultContainer {
	display: flex;
	justify-content: space-between;
	align-items: center
}
.hakenSearchResult {
	font-size: 14px;
	color: #3b4043
}
@media screen and (max-width:560px) {
	.hakenSearchResult {
		font-size: 12px
	}
}
.hakenSearchPagination {
	display: flex;
	align-items: center
}
@media screen and (max-width:560px) {
	.hakenSearchPagination {
		font-size: 13px
	}
}
.hakenSearchPagination a {
	padding-right: 1.5em;
	transition: all 0.3s
}
.hakenSearchPagination a:hover {
	color: #004831;
	text-decoration: underline
}
@media screen and (max-width:560px) {
	.hakenSearchPagination a {
		padding-right: 1em
	}
}
.hakenSearchPagination a.current {
	font-weight: bold
}
.hakenSearchPagination a.next {
	color: #3b4043;
	padding-left: 1em;
	padding-right: 0;
	margin-left: 0.5em;
	border-left: 1px solid #cdd6dd
}
.hakenSearchRecruitmentList {
	padding: 3em 0 1em 0;
	gap: 2em 3em
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentList {
		grid-template-columns: repeat(1, 1fr);
		gap: 2em
	}
}
.hakenSearchRecruitmentItem {
	border: 1px solid #cdd6dd;
	border-radius: 6px;
	margin-bottom: 2em;
	box-shadow: 7px 7px 7px rgba(0, 0, 0, 0.03)
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItem {
		margin-bottom: 20px
	}
}
.hakenSearchRecruitmentItemTop {
	padding: 1em 2em;
	display: flex;
	align-items: center;
	border-bottom: 1px solid #cdd6dd;
	background: rgba(240, 243, 245, 0.5);
	font-weight: bold;
	font-size: 20px
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemTop {
		padding: 0.7em 1.2em
	}
}
.hakenSearchRecruitmentItemTopRight {
	width: calc(100% - 40px);
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-left: 1em
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemTopRight {
		display: block
	}
}
.hakenSearchRecruitmentItemTopRight h2 {
	margin-right: auto
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemTopRight h2 {
		font-size: 16px;
		line-height: 1.5;
		display: inline
	}
}
.hakenSearchRecruitmentItemBottom {
	padding: 2em 3em 1em 3em;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 2em
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemBottom {
		display: block;
		padding: 0.7em 1.5em 1em 1.5em
	}
}
.hakenSearchRecruitmentItemBottomInfo {
	width: 100%;
}
.hakenTopRecruitmentItemIsImg .hakenSearchRecruitmentItemBottomInfo {
	width: 70%;
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemIsImg {
		width: 100%;
	}
	.hakenTopRecruitmentItemIsImg .hakenSearchRecruitmentItemBottomInfo {
		width: 100%;
	}
	.hakenTopRecruitmentItemIsImg .hakenTopRecruitmentItemDl {
		width: 100%;
	}
	.hakenSearchRecruitmentItemBottomInfo {
		width: 100%
	}
}
.hakenSearchRecruitmentItemBottomInfo>p {
	font-weight: bold;
	padding-bottom: 1em;
	line-height: 1.4;
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemBottomInfo>p {
		font-size: 14px;
	}
}
.hakenTopRecruitmentItemDlBlock {
	display: flex;
	font-size: 14px;
}
.hakenTopRecruitmentItemDlBlock:nth-child(n + 2) {
	padding: 0.7em 0 0 0;
}
.hakenTopRecruitmentItemDt::before,
.hakenSearchRecruitmentItemBottomInfoTtl::before {
	content: "";
	border-radius: 50%;
	width: 5px;
	height: 5px;
	display: block;
	position: absolute;
	left: 0;
	top: 0.6em;
	background: #98a6b5;
}
.hakenTopRecruitmentItemDt,
.hakenSearchRecruitmentItemBottomInfoTtl {
	font-weight: bold;
	color: #3b4043;
	position: relative;
	padding-left: 10px;
}
.hakenTopRecruitmentItemDlBlock:nth-child(1) .hakenTopRecruitmentItemDt {
	width: 6.5em;
}
.hakenTopRecruitmentItemDlBlock:nth-child(1) .hakenTopRecruitmentItemDd {
	width: calc(100% - 6.5em);
}
.hakenTopRecruitmentItemDlBlock:nth-child(2) .hakenTopRecruitmentItemDt {
	width: 6em;
}
.hakenTopRecruitmentItemDlBlock:nth-child(2) .hakenTopRecruitmentItemDd {
	width: calc(100% - 6em);
}
.hakenTopRecruitmentItemDlBlock:nth-child(3) .hakenTopRecruitmentItemDt {
	width: 6em;
}
.hakenTopRecruitmentItemDlBlock:nth-child(3) .hakenTopRecruitmentItemDd {
	width: calc(100% - 6em);
}
.hakenTopRecruitmentItemDlBlock:nth-child(4) .hakenTopRecruitmentItemDt {
	width: 4em;
}
.hakenTopRecruitmentItemDlBlock:nth-child(4) .hakenTopRecruitmentItemDd {
	width: calc(100% - 4em);
}
.hakenTopRecruitmentItemDlBlock:nth-child(5) .hakenTopRecruitmentItemDt {
	width: 4em;
}
.hakenTopRecruitmentItemDlBlock:nth-child(5) .hakenTopRecruitmentItemDd {
	width: calc(100% - 4em);
}
.hakenTopRecruitmentItemDlBlock:nth-child(6) .hakenTopRecruitmentItemDt {
	width: 5em;
}
.hakenTopRecruitmentItemDlBlock:nth-child(6) .hakenTopRecruitmentItemDd {
	width: calc(100% - 5em);
}
@media screen and (max-width:560px) {
	.hakenTopRecruitmentItemDlBlock {
		font-size: 13px;
	}
}
.hakenSearchRecruitmentItemBottomInfoSp {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1em;
	line-height: 1.5;
	width: 100%;
}
.hakenSearchRecruitmentItemBottomImg {
	width: 30%;
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemBottomInfoSp {
		display: block;
		font-size: 13px;
		line-height: 1.8em;
	}
	.hakenTopRecruitmentItemBottomInfoSp img {
		width: 40%;
	}
	.hakenSearchRecruitmentItemBottomImg {
		float: right;
		padding: 0 0 0.5em 0.5em;
		width: 40%;
	}
}
.hakenSearchRecruitmentItemBottomButtons {
	width: 70%;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 2em 0
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemBottomButtons {
		width: 90%;
		margin-top: 1em;
		margin-bottom: 1.5em;
		padding: 0
	}
}
.hakenSearchRecruitmentItemBottomButtons .btn {
	text-align: left;
	display: inline-block;
	width: 33%;
	font-size: 14px;
	padding: 1em 0 1em 1em
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemBottomButtons .btn {
		font-size: 12px;
		padding: 1em 0 1em 2em
	}
}
.hakenSearchRecruitmentItemBottomButtons .btn:nth-child(n - 2) {
	margin-bottom: 0.5em
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemBottomButtons .btn {
		width: 100%;
	}
	.hakenSearchRecruitmentItemBottomButtons .btn:nth-child(n - 2) {
		margin-bottom: 0
	}
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemBottomButtons .btn:last-child {
		padding-right: 0.5em
	}
}
.hakenSearchRecruitmentItemBottomButtons.is-small {
	width: 50%;
	margin: 1em auto 0;
}
.hakenSearchRecruitmentItemBottomButtons.is-small .btn {
	text-align: center;
	display: block;
}
.hakenSearchRecruitmentItemBottomButtons.is-small .btn::after {
	position: absolute;
	top: 34%;
	left: 15%;
	transform: translateY(-50%)
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentItemBottomButtons.is-small .btn::after {
		top: 31%
	}
}
.hakenSearchRecruitmentRecommend {
	margin-top: 80px;
	text-align: center;
}
.hakenSearchRecruitmentRecommend .btn {
	padding: 1em 0;
	width: 30%;
	display: inline-block;
}
.hakenSearchRecruitmentRecommend svg {
	width: 20px;
	fill: #fff;
	margin-right: 5px;
}
@media screen and (max-width:560px) {
	.hakenSearchRecruitmentRecommend {
		margin-top: 40px;
	}
	.hakenSearchRecruitmentRecommend .btn {
		width: 80%;
	}
}
.searchRecommendTop {
	width: 100%
}
.searchRecommendTopTxt {
	text-align: center;
	line-height: 1.8;
	padding: 3em 0
}
@media screen and (max-width:560px) {
	.searchRecommendTopTxt {
		text-align: left;
		padding: 30px 0 25px 0
	}
}
.companyContactButtonsContainer {
	display: flex;
	align-items: center;
	background: #004831;
	border-radius: 10px;
	margin-bottom: 5em
}
@media screen and (max-width:560px) {
	.companyContactButtonsContainer {
		display: block;
		margin-bottom: 60px
	}
}
.companyContactButton {
	flex: 1;
	padding: 1em;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: #ffffff;
	font-weight: bold
}
.companyContactButton>div {
	width: calc(100% - 25px);
	font-size: 16px;
	text-align: left;
	line-height: 1.5;
	padding-left: 1em
}
@media screen and (max-width:560px) {
	.companyContactButton>div {
		text-align: left;
		font-size: 14px
	}
}
.companyContactButton>div>span {
	display: block;
	font-size: 12px
}
.companyContactButton:not(:last-child) {
	border-right: 1px solid #FFFFFF
}
@media screen and (max-width:560px) {
	.companyContactButton:not(:last-child) {
		border-right: none;
		border-bottom: 1px solid #FFFFFF
	}
}
.companyContactButton .circle::before, .companyContactButton .circle::after {
	width: 7px
}
.companyContactButton .circle::before {
	left: 9px;
	top: calc(50% + 0px);
	transform: rotate(-45deg)
}
@media screen and (max-width:560px) {
	.companyContactButton .circle::before {
		left: 6.8px
	}
}
.companyContactButton .circle::after {
	left: 4.5px;
	top: calc(50% + 0px);
	transform: rotate(45deg)
}
@media screen and (max-width:560px) {
	.companyContactButton .circle::after {
		left: 3.3px
	}
}
.searchRecommendStrongContents {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 3em;
	position: relative;
	padding-bottom: 0;
	margin-bottom: 5em
}
@media screen and (max-width:560px) {
	.searchRecommendStrongContents {
		display: block;
		align-items: flex-start;
		margin-bottom: 60px
	}
}
.searchRecommendStrongContents::after {
	content: "他";
	position: absolute;
	bottom: 2em;
	right: 2em
}
.searchRecommendList {
	flex: 1
}
@media screen and (max-width:560px) {
	.searchRecommendList:first-of-type {
		margin-bottom: 0
	}
}
.searchRecommendTitle {
	margin-bottom: 0
}
@media screen and (max-width:560px) {
	.hakenSidebarFeaturesListContainer .headingLarge.isCenter {
		margin-bottom: 35px
	}
}
.hakenSidebarFeaturesListContainer>.hakenSidebarFeaturesListInner .hakenSidebarFeaturesList:last-child {
	padding: 0
}
@media screen and (max-width:560px) {
	.hakenSidebarFeaturesListContainer>.hakenSidebarFeaturesListInner {
		width: 90%;
		margin: 0 auto
	}
}
@media screen and (max-width:560px) {
	.hakenSidebarFeaturesListContainer {
		padding: 35px 0 0 0;
		background: rgba(240, 243, 245, 0.5)
	}
}
.searchRecommendEntryBg {
	background: rgba(246, 152, 150, 0.15);
	padding: 3em 0;
	text-align: center;
	margin-bottom: 5em
}
@media screen and (max-width:560px) {
	.searchRecommendEntryBg {
		padding: 40px 0;
		margin-bottom: 40px
	}
}
.searchRecommendSubmit {
	display: flex;
	justify-content: center;
	align-items: center
}
@media screen and (max-width:560px) {
	.searchRecommendSubmit {
		margin: 1em 0
	}
}
.searchRecommendSubmit>a {
	padding: 1em 7em
}
.searchRecommendReasonList {
	margin-bottom: 4em
}
@media screen and (max-width:560px) {
	.searchRecommendReasonList {
		margin-bottom: 40px
	}
}
.searchRecommendReasonItem {
	border: 1px solid #c4d700;
	background: rgba(196, 215, 0, 0.05);
	padding: 2em 3em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 4em;
	margin-bottom: 20px
}
@media screen and (max-width:560px) {
	.searchRecommendReasonItem {
		display: block;
		padding: 30px 20px 20px 20px
	}
}
.searchRecommendReasonItem .leadText {
	margin-bottom: 1em
}
@media screen and (max-width:560px) {
	.searchRecommendReasonItem .leadText {
		text-align: center;
		font-size: 20px
	}
}
@media screen and (max-width:560px) {
	.searchRecommendReasonItemImgContainer {
		display: flex;
		justify-content: center;
		padding-bottom: 1em
	}
}
.searchDetailSidebarEntryBg {
	background: rgba(246, 152, 150, 0.15);
	padding: 2em 0;
	margin-bottom: 2em;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%
}
.searchDetailSidebarButtonContainer {
	width: 90%
}
.searchDetailSidebarButtonContainer .btn {
	display: block;
	width: 100%;
	padding: 1em 0;
	font-size: 12px;
	line-height: 1.5;
}
.searchDetailSidebarButtonContainer .btn span {
	display: block;
}
.searchDetailSidebarButtonContainer .btnPink,
.searchDetailSidebarButtonContainer .btnGray {
	margin-bottom: 1em;
	font-size: 16px;
}
.searchDetailSidebarButtonContainer .btnFavorite {
	text-align: left;
	padding-left: 2em
}
.hakenDetailsTagContainer {
	display: flex;
	/* gap: 0.5em; */
	flex-wrap: wrap;
	padding-bottom: 2em;
	margin: -0.5em 0 0 -0.3em;
}
.hakenDetailsTagContainer p {
	font-size: 11px;
	background: #F0F3F5;
	border: 1px solid #CDD6DD;
	padding: 0.4em 0.8em;
	border-radius: 20px;
	margin: 0.5em 0 0 0.5em;
}
.searchDetailEntryBg {
	background: rgba(246, 152, 150, 0.15);
	padding: 3em 0;
	margin-bottom: 5em;
	display: flex;
	justify-content: center;
	align-items: center
}
@media screen and (max-width:560px) {
	.searchDetailEntryBg {
		margin-bottom: 60px
	}
}
@media screen and (max-width:560px) {
	.searchDetailButtonContainer {
		width: 100%
	}
}
.searchDetailButtonContainer .btn {
	display: block;
	width: 300px
}
@media screen and (max-width:560px) {
	.searchDetailButtonContainer .btn {
		width: 100%;
		margin: 0 auto
	}
}
.searchDetailButtonContainer .btnPink,
.searchDetailButtonContainer .btnGray {
	padding: 1em 0;
	margin-bottom: 1em
}
@media screen and (max-width:560px) {
	.searchDetailButtonContainer .btnPink,
	.searchDetailButtonContainer .btnGray {
		width: 90%;
		background: #D83763;
		border: 2px solid #D83763
	}
}
@media screen and (max-width:560px) {
	.searchDetailButtonContainer .btnPink:hover {
		background: #fff;
		color: #D83763
	}
	.searchDetailButtonContainer .btnPink:hover::before, .searchDetailButtonContainer .btnPink:hover::after {
		background: #D83763
	}
}
.searchDetailButtonContainer .btnFavorite {
	padding: 0.7em 0;
	text-align: left;
	padding-left: 2em
}
@media screen and (max-width:560px) {
	.searchDetailButtonContainer .btnFavorite {
		width: 50%
	}
}
@media screen and (max-width:560px) {
	.sidebarLayout {
		display: flex;
		flex-direction: column-reverse
	}
}
.hakenSidebar {
	background: rgba(246, 152, 150, 0.6);
	border-radius: 6px;
	padding: 1.5em
}
@media screen and (max-width:560px) {
	.hakenSidebar {
		border-radius: 0
	}
}
.hakenSidebarTitle {
	font-size: 20px;
	color: #1A1A1A;
	font-weight: bold;
	margin-bottom: 1em;
	text-align: center
}
@media screen and (max-width:560px) {
	.hakenSidebarTitle {
		font-size: 20px
	}
}
.hakenSidebarTitle>img {
	width: 30px;
	padding-right: 0.5em
}
.hakenSidebarLabel {
	font-weight: bold;
	padding-bottom: 0.4em;
	font-size: 14px
}
@media screen and (max-width:560px) {
	.hakenSidebarLabel {
		font-size: 12px
	}
}
.hakenSidebarSearchContainer {
	width: 100%;
	border-radius: 6px;
	position: relative;
	background: #fff;
	margin-bottom: 1em;
	border: 1px solid #CDD6DD
}
@media screen and (max-width:560px) {
	.hakenSidebarSearchContainer {
		background: #F0F3F5;
		border: none
	}
}
.hakenSidebarSearchContainer>input {
	display: inline-block;
	width: 100%;
	padding: 1em;
	font-size: 14px
}
.hakenSidebarSearchInput {
	height: 80%;
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	font-size: 14px
}
.hakenSidebarSearchInput>input {
	height: 100%;
	background: #004831;
	color: #fff;
	border-radius: 30px;
	padding: 0 2em 0 1em
}
.hakenSidebarSearchInput::before, .hakenSidebarSearchInput::after {
	content: "";
	width: 8px;
	height: 2px;
	display: inline-block;
	border-radius: 2px;
	background: #fff;
	position: absolute;
	right: 10px;
	transition: all 0.3s
}
.hakenSidebarSearchInput::before {
	top: calc(50% + 2px);
	transform: rotate(-45deg)
}
.hakenSidebarSearchInput::after {
	top: calc(50% - 3px);
	transform: rotate(45deg)
}
.hakenSidebarButtonsContainer {
	display: flex;
	justify-content: space-between;
	/* gap: 1em */
}
.hakenSidebarButtonsContainer .hakenSidebarButton:first-child {
	margin-right: 1em;
}
@media screen and (max-width:560px) {
	/* .hakenSidebarButtonsContainer {
		gap: 0.5em
	} */
	.hakenSidebarButtonsContainer .hakenSidebarButton:first-child {
		margin-right: 0.5em;
	}
}
.hakenSidebarButton {
	display: inline-block;
	text-align: left;
	padding: 1em;
	flex: 1;
	border-radius: 6px;
	background: #004831;
	color: #ffffff;
	font-weight: bold;
	position: relative;
	box-sizing: border-box;
	border: 2px solid #004831;
	transition: all 0.3s
}
.hakenSidebarButton:hover {
	background: #fff;
	color: #004831
}
.hakenSidebarButton:hover::before, .hakenSidebarButton:hover::after {
	background: #004831
}
.hakenSidebarButton>p {
	font-size: 16px
}
@media screen and (max-width:560px) {
	.hakenSidebarButton>p {
		font-size: 12px
	}
}
.hakenSidebarButton>p>span {
	padding-right: 0.3em;
	font-size: 20px
}
@media screen and (max-width:560px) {
	.hakenSidebarButton>p>span {
		font-size: 16px
	}
}
.hakenSidebarButton::before, .hakenSidebarButton::after {
	content: "";
	width: 8px;
	height: 2px;
	display: inline-block;
	border-radius: 2px;
	background: #fff;
	position: absolute;
	right: 13px;
	transition: all 0.3s
}
.hakenSidebarButton::before {
	top: calc(50% + 2px);
	transform: rotate(-45deg)
}
.hakenSidebarButton::after {
	top: calc(50% - 3px);
	transform: rotate(45deg)
}
.hakenSidebarFeatures {
	background: rgba(246, 152, 150, 0.15);
	padding: 4em 0
}
@media screen and (max-width:560px) {
	.hakenSidebarFeatures {
		padding: 2em 0
	}
}
.hakenSidebarFeaturesTitle {
	font-size: 32px;
	font-weight: bold;
	color: #3B4043;
	text-align: center
}
@media screen and (max-width:560px) {
	.hakenSidebarFeaturesTitle {
		font-size: 20px
	}
}
.hakenSidebarFeaturesList {
	padding: 3em 0;
	width: 100%;
	margin: 0 auto
}
.hakenSidebarFeaturesList:first-child {
	padding-top: 0;
}
@media screen and (max-width:560px) {
	.hakenSidebarFeaturesList {
		padding: 2em 0;
		display: block
	}
}
.hakenSidebarFeaturesItem {
	flex: 1;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
	aspect-ratio: 1.5;
	border-radius: 6px;
	margin-bottom: 1em;
	display: flex;
	align-items: flex-end
}
@media screen and (max-width:560px) {
	.hakenSidebarFeaturesItem {
		width: 100%;
		height: auto;
		aspect-ratio: 1.6666666667;
		margin-bottom: 1.5em
	}
}
.hakenSidebarFeaturesItem>div>div:first-of-type {
	width: 80%
}
.hakenSidebarFeaturesItem p {
	display: inline-block;
	transition: all 0.3s;
	text-decoration: underline;
	text-decoration-color: transparent
}
.hakenSidebarFeaturesItem:hover {
	color: #fff
}
.hakenSidebarFeaturesItem:hover p {
	text-decoration-color: #fff
}
.hakenSidebarFeaturesItem:hover .circle {
	background: #fff;
	border: 2px solid #004831
}
.hakenSidebarFeaturesItem:hover .circle::before, .hakenSidebarFeaturesItem:hover .circle::after {
	background: #004831
}
.hakenSidebarFeaturesItemContent {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	padding: 1em;
	background: rgba(0, 72, 49, 0.7);
	color: #fff;
	font-size: 14px
}
@media screen and (max-width:560px) {
	.hakenSidebarFeaturesItemContent {
		font-size: 16px
	}
}
.hakenSidebarFeaturesItemContent>p {
	display: inline-block;
	width: 80%
}
.staffroomSidebar::before {
	top: calc(50% + 3.5px)
}
.staffroomSidebar::after {
	top: calc(50% - 1px)
}
@media screen and (max-width:560px) {
	.staffroomSidebar .sidebarItem {
		padding-right: 50px
	}
}
@media screen and (min-width:992px) {
	.staffroomSidebar .sidebarItem.isPdf::before {
		display: none
	}
	.staffroomSidebar .sidebarItem.isPdf::after {
		content: url("/assets/img/icon/pdf_icon.svg");
		top: 35%;
		transform: translateY(-50%)
	}
	.staffroomSidebar .sidebarItem.isSougou::before {
		display: none
	}
	.staffroomSidebar .sidebarItem.isSougou::after {
		background: none;
		content: url("/assets/img/icon/sougou_icon.svg");
		top: 35%;
		transform: translateY(-50%)
	}
}
@media screen and (min-width:561px) and (max-width:991px) {
	.staffroomSidebar .sidebarItem.isPdf::before {
		display: none
	}
	.staffroomSidebar .sidebarItem.isPdf::after {
		content: url("/assets/img/icon/pdf_icon.svg");
		top: 35%;
		transform: translateY(-50%)
	}
	.staffroomSidebar .sidebarItem.isSougou::before {
		display: none
	}
	.staffroomSidebar .sidebarItem.isSougou::after {
		content: url("/assets/img/icon/sougou_icon.svg");
		top: 35%;
		transform: translateY(-50%)
	}
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitment {
		padding: 3em 0 2em 0;
		width: 90%;
		margin: 0 auto
	}
}
.tenshokuSearchResultContainer {
	display: flex;
	justify-content: space-between;
	align-items: center
}
.tenshokuSearchResult {
	font-size: 14px;
	color: #3B4043
}
@media screen and (max-width:560px) {
	.tenshokuSearchResult {
		font-size: 12px
	}
}
.tenshokuSearchRecruitmentList {
	padding: 2em 0;
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 2em
}
.tenshokuSearchRecruitmentItem {
	border: 1px solid #CDD6DD;
	border-radius: 6px
}
.tenshokuSearchRecruitmentItemTop {
	padding: 1em 2em;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid #CDD6DD;
	background: rgba(240, 243, 245, 0.5);
	font-weight: bold;
	font-size: 20px
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemTop>h3 {
		line-height: 1.5;
		font-size: 16px;
		display: inline
	}
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemTop {
		padding: 0.7em 1em;
		display: block
	}
}
.tenshokuSearchRecruitmentItemBottom {
	padding: 2em;
	display: flex;
	justify-content: space-between;
	align-items: center
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemBottom {
		padding: 1em;
		display: block
	}
}
.tenshokuSearchRecruitmentItemBottomInfo {
	width: 75%
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemBottomInfo {
		width: 100%
	}
}
.tenshokuSearchRecruitmentItemBottomInfo>p {
	font-weight: bold;
	padding-bottom: 1em
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemBottomInfo>p {
		font-size: 14px
	}
}
.tenshokuSearchRecruitmentItemBottomButtons {
	width: 20%
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemBottomButtons {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 0.5em;
		margin-top: 1em
	}
}
.tenshokuSearchRecruitmentItemBottomButtons>a {
	display: inline-block;
	width: 100%;
	padding: 1em 0 1em 1em;
	text-align: left
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemBottomButtons>a {
		text-align: center;
		font-size: 12px
	}
}
.tenshokuSearchRecruitmentItemBottomButtons>a:first-child {
	margin-bottom: 1em
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemBottomButtons>a:first-child {
		margin-bottom: 0
	}
}
@media screen and (max-width:560px) {
	.tenshokuSearchRecruitmentItemBottomButtons>a:last-child {
		padding-right: 0.5em
	}
}
.companyOutlineList {
	width: 100%
}
.companyOutlineList.mb {
	margin-bottom: 3em
}
@media screen and (max-width:560px) {
	.companyOutlineList.mb {
		margin-bottom: 40px
	}
}
.companyOutlineItem {
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	padding: 1.5em 0;
	border-top: 1px solid #CDD6DD
}
.companyOutlineItemHeader {
	width: 20%
}
@media screen and (max-width:560px) {
	.companyOutlineItemHeader {
		font-size: 12px;
		width: 28%
	}
}
.companyOutlineItemData {
	width: 70%;
	font-size: 16px;
	line-height: 1.5
}
@media screen and (max-width:560px) {
	.companyOutlineItemData {
		width: 65%;
		font-size: 14px
	}
}
.companyOutlineItemDataImg {
	width: 40%;
}
.companyOutlineItemData>.weight {
	font-weight: bold
}
.tenshokuDetailEntryButtonContainer {
	background: rgba(27, 100, 171, 0.15);
	padding: 3em 0;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 3em 0
}
@media screen and (max-width:560px) {
	.tenshokuDetailEntryButtonContainer {
		margin: 1em 0
	}
}
.tenshokuDetailEntryButtonContainer>a {
	padding: 1em 3em
}
.supplementText {
	color: #3B4043;
	font-size: 14px;
	padding: 0.5em 0
}
.supplementText.mb {
	margin-bottom: 1em;
	line-height: 1.5
}
.supplementText.isCenter {
	text-align: center
}
.supplementText.isRight {
	text-align: right
}
.tenshokuDetailBackButtonContainer {
	display: flex;
	justify-content: center
}
.tenshokuDetailBackButtonContainer>a {
	text-align: left;
	font-size: 14px;
	padding: 17px 58px 17px 32px
}
@media screen and (max-width:560px) {
	.tenshokuDetailBackButtonContainer>a {
		text-align: center;
		padding: 10px 0;
		width: 100%;
		margin: 0 auto 3em auto
	}
}
@media screen and (max-width:560px) {
	.tenshokuDetailBackButtonContainer {
		padding: 10px 0;
		width: 70%;
		margin: 0 auto 0 auto
	}
}
.hakenContactThanksButton {
	margin: 60px 0 90px 0;
	padding: 0
}
@media screen and (max-width:560px) {
	.hakenContactThanksButton {
		margin: 40px auto 60px auto
	}
}
.hakenContactEndContainer {
	width: 80%;
	max-width: 960px;
	margin: 0 auto;
	border: 8px solid #F0F3F5;
	padding: 2em
}
@media screen and (max-width:560px) {
	.hakenContactEndContainer {
		width: 100%
	}
}
.hakenContactEndLinksContainer {
	display: flex;
	justify-content: space-between;
	gap: 2em
}
@media screen and (max-width:560px) {
	.hakenContactEndLinksContainer {
		display: block
	}
}
.hakenContactEndLink {
	flex: 1;
	border-top: 1px solid #CDD6DD;
	text-align: center;
	padding-top: 1em
}
@media screen and (max-width:560px) {
	.hakenContactEndLink:first-of-type {
		padding-bottom: 1em
	}
}
.hakenContactEndLinkName {
	font-weight: bold;
	font-size: 20px
}
@media screen and (max-width:560px) {
	.hakenContactEndLinkName {
		font-size: 16px
	}
}
.hakenContactEndLinkTxt {
	font-size: 16px;
	margin: 1em 0 2em 0
}
@media screen and (max-width:560px) {
	.hakenContactEndLinkTxt {
		font-size: 14px;
		margin-bottom: 10px
	}
}
.hakenContactEndLinkButton {
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1em
}
@media screen and (max-width:560px) {
	.hakenContactEndLinkButton {
		font-size: 12px
	}
}
.hakenSearchWindow {
	width: 960px;
	margin: 0 auto;
	background: rgba(246, 152, 150, 0.6);
	border-radius: 6px;
	padding: 1.5em 3em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	margin-bottom: 5em
}
.hakenSearchWindow.mbNone {
	margin: 60px auto
}
@media screen and (max-width:560px) {
	.hakenSearchWindow.mbNone {
		margin: 0
	}
}
@media screen and (max-width:560px) {
	.hakenSearchWindow {
		display: block;
		margin-bottom: 0;
		border-radius: 0;
		width: 100%;
		padding: 34px 23px 26px 23px
	}
}
.hakenSearchWindowContentsContainer {
	flex: 1
}
.hakenSearchWindowTitle {
	font-size: 20px;
	color: #1a1a1a;
	font-weight: bold;
	text-align: center
}
@media screen and (max-width:560px) {
	.hakenSearchWindowTitle {
		margin-bottom: 1em;
		font-size: 20px
	}
}
.hakenSearchWindowTitle>img {
	width: 30px;
	padding-right: 0.5em
}
.hakenSearchWindowLabel {
	font-weight: bold;
	padding-bottom: 0.4em;
	font-size: 14px
}
@media screen and (max-width:560px) {
	.hakenSearchWindowLabel {
		font-size: 12px
	}
}
.hakenSearchWindowSearchContainer {
	width: 100%;
	border-radius: 6px;
	position: relative;
	background: #fff;
	border: 1px solid #cdd6dd
}
@media screen and (max-width:560px) {
	.hakenSearchWindowSearchContainer {
		margin-bottom: 1em;
		background: #f0f3f5;
		border: none
	}
}
.hakenSearchWindowSearchContainer>input {
	display: inline-block;
	width: 100%;
	padding: 1em
}
.hakenSearchWindowSearchInput {
	height: 80%;
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold
}
.hakenSearchWindowSearchInput>input {
	transition: all 0.3s;
	height: 100%;
	background: #004831;
	color: #fff;
	border-radius: 30px;
	padding: 0 2em 0 1em;
	box-sizing: border-box;
	border: 2px solid #004831
}
@media screen and (max-width:560px) {
	.hakenSearchWindowSearchInput {
		font-size: 14px
	}
}
.hakenSearchWindowSearchInput:hover>input {
	background: #fff;
	color: #004831
}
.hakenSearchWindowSearchInput:hover::before, .hakenSearchWindowSearchInput:hover::after {
	background: #004831
}
.hakenSearchWindowSearchInput::before, .hakenSearchWindowSearchInput::after {
	content: "";
	width: 8px;
	height: 2px;
	display: inline-block;
	border-radius: 2px;
	background: #fff;
	position: absolute;
	right: 10px;
	transition: all 0.3s
}
.hakenSearchWindowSearchInput::before {
	top: calc(50% + 2px);
	transform: rotate(-45deg)
}
.hakenSearchWindowSearchInput::after {
	top: calc(50% - 3px);
	transform: rotate(45deg)
}
.hakenSearchWindowButtonsContainer {
	display: flex;
	justify-content: space-between;
	/* gap: 1em */
}
.hakenSearchWindowButtonsContainer .hakenSearchWindowButton:first-child{
	margin-right: 1em;
}
@media screen and (max-width:560px) {
	/* .hakenSearchWindowButtonsContainer {
		gap: 0.5em
	} */
	.hakenSearchWindowButtonsContainer .hakenSearchWindowButton:first-child{
		margin-right: 0.5em;
	}
}
.hakenSearchWindowButton {
	display: inline-block;
	text-align: left;
	padding: 1em;
	flex: 1;
	border-radius: 6px;
	background: #004831;
	color: #ffffff;
	font-weight: bold;
	position: relative;
	transition: all 0.3s;
	box-sizing: border-box;
	border: 2px solid #004831
}
.hakenSearchWindowButton:hover {
	background: #fff;
	color: #004831
}
.hakenSearchWindowButton:hover::before, .hakenSearchWindowButton:hover::after {
	background: #004831
}
.hakenSearchWindowButton>p {
	font-size: 16px
}
@media screen and (max-width:560px) {
	.hakenSearchWindowButton>p {
		font-size: 16px
	}
}
.hakenSearchWindowButton>p>span {
	padding-right: 0.3em;
	font-size: 20px
}
@media screen and (max-width:560px) {
	.hakenSearchWindowButton>p>span {
		font-size: 16px
	}
}
.hakenSearchWindowButton::before, .hakenSearchWindowButton::after {
	content: "";
	width: 8px;
	height: 2px;
	display: inline-block;
	border-radius: 2px;
	background: #fff;
	position: absolute;
	right: 13px;
	transition: all 0.3s
}
.hakenSearchWindowButton::before {
	top: calc(50% + 2px);
	transform: rotate(-45deg)
}
.hakenSearchWindowButton::after {
	top: calc(50% - 3px);
	transform: rotate(45deg)
}
@media screen and (max-width:560px) {
	.hakenSearchWindowButtonTxt {
		padding-left: 0.3em;
		font-size: 12px !important
	}
}
.linkList {
	width: 100%;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1em 2em;
	padding: 0 0 2em 0
}
@media screen and (max-width:560px) {
	.linkList {
		padding: 0;
		gap: 10px;
		grid-template-columns: repeat(1, 1fr);
		margin-bottom: 40px;
	}
}
.mypageResumeSubmit {
	background: rgba(246, 152, 150, 0.15);
	padding: 3em 0;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 3em 0
}
.mypageResumeSubmit .submitBtnContainer {
	width: 100%;
	text-align: center;
}
.isConfirm {
	display: block;
}
.isConfirm .submitBtnContainer {
	text-align: center;
}
.mypageResumeSubmit .submitBtnContainer .btn {
	padding: 1em 3em;
	min-width: 300px;
}
@media screen and (max-width:560px) {
	.mypageResumeSubmit {
		margin: 1em 0;
	}
	.mypageResumeSubmit .submitBtnContainer .btn {
		width: 80%;
		padding: 23px 0;
		font-size: 14px;
	}
}
.mypageApplicationList {
	width: 100%
}
.mypageApplicationItem {
	border-top: 1px solid #cdd6dd;
	padding: 36px 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.mypageApplicationContent {
	width: calc(100% - 165px);
	padding-right: 20px;
}
@media screen and (max-width:560px) {
	.mypageApplicationItem:last-of-type {
		padding-bottom: 0
	}
	.mypageApplicationContent {
		width: 100%;
		padding: 0;
	}
}
@media screen and (max-width:560px) {
	.mypageApplicationItem {
		display: block
	}
}
.mypageApplicationItem .leadText {
	color: #1a1a1a;
	margin: 0.7em 0
}
.mypageApplicationLabel {
	display: inline-block;
	text-align: center;
	font-size: 12px;
	color: #98a6b5;
	padding: 0.3em 0;
	font-weight: bold;
	border-radius: 3px;
	border: 2px solid #98a6b5;
	width: 130px
}
@media screen and (max-width:560px) {
	.mypageApplicationLabel {
		width: fit-content;
		padding: 0.2em 0;
		font-size: 14px;
		border: none
	}
}
.mypageApplicationLabel.isEntry {
	color: #e60000;
	border: 2px solid #e60000
}
@media screen and (max-width:560px) {
	.mypageApplicationLabel.isEntry {
		border: none
	}
}
.mypageApplicationLabel.isFavorite {
	color: #f69896;
	border: 2px solid #f69896
}
@media screen and (max-width:560px) {
	.mypageApplicationLabel.isFavorite {
		border: none
	}
}
.mypageApplicationDate {
	font-size: 12px;
	color: #1a1a1a
}
.mypageApplicationButtonContainer {
	text-align: center;
	width: 165px;
}
.mypageApplicationButtonContainer .btn {
	display: block;
	padding-left: 0;
	padding-right: 20px;
}
@media screen and (max-width:560px) {
	.mypageApplicationButtonContainer {
		margin-top: 20px;
		width: 100%;
	}
}
.mypageApplicationButtonContainer>a {
	padding: 13px 50px 13px 30px;
	color: #004831 !important
}
.mypageApplicationButtonContainer>a:hover {
	color: #fff !important
}
@media screen and (max-width:560px) {
	.mypageApplicationButtonContainer .btn {
		font-size: 12px;
		padding: 1em 0;
		display: inline-block;
		width: 80%
	}
}
.mypageApplicationButtonContainer .custum-checkbox {
	width: fit-content;
	margin: 2em auto 0 auto
}
@media screen and (max-width:560px) {
	.mypageApplicationButtonContainer .custum-checkbox {
		margin: 15px auto 0 auto
	}
}
.companyContactList {
	padding: 2em 0 4em 0
}
@media screen and (max-width:560px) {
	.companyContactList {
		padding: 1em 0 2em 0
	}
}
.companyContactItem {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top: 1px solid #cdd6dd;
	padding: 1em 0
}
@media screen and (max-width:560px) {
	.companyContactItem {
		display: block
	}
}
.companyContactItem .heading04 {
	margin-bottom: 0.5em
}
.companyContactItem .txt {
	margin-bottom: 0
}
.companyContactItem .txt>a {
	text-decoration: underline;
	transition: all 0.3s
}
.companyContactItem .txt>a:hover {
	color: #004831
}
@media screen and (max-width:560px) {
	.companyContactItem .txt {
		margin: 1em 0
	}
}
.mypageTaiakiButtonContainer {
	display: flex;
	justify-content: center;
	padding: 2em 0 1.5em 0
}
.mypageTaiakiButtonContainer .btn {
	padding: 1em 5em
}
@media screen and (max-width:560px) {
	.mypageTaiakiButtonContainer .btn {
		padding: 1em 0;
		display: inline-block;
		width: 80%
	}
}
.mypageTaiakiLinkContainer {
	display: flex;
	justify-content: center;
	align-items: center;
	/* gap: 1em; */
	font-weight: bold;
	width: 100%;
}
.mypageTaiakiLinkContainer .circle {
	margin-right: 1em;
}
@media screen and (max-width:560px) {
	.mypageTaiakiLinkContainer {
		font-size: 12px
	}
}
.entryContainer {
	width: 100%;
	border: 1px solid #cdd6dd;
	border-radius: 6px
}
@media screen and (max-width:560px) {
	.entryContainer {
		border: none
	}
}
.entryInner {
	width: 70%;
	margin: 0 auto;
	padding: 5em 0
}
@media screen and (max-width:560px) {
	.entryInner {
		width: 100%;
		margin: 0 auto;
		padding: 0
	}
}
.entryWorksContainer {
	width: 100%;
	border: 1px solid #cdd6dd;
	display: flex;
	margin-bottom: 4em;
	font-size: 14px
}
@media screen and (max-width:560px) {
	.entryWorksContainer {
		display: block;
		margin-bottom: 40px
	}
}
.entryWorksContainer>span {
	width: 30%;
	text-align: center;
	font-weight: bold;
	background: #f0f3f5;
	border-right: 1px solid #cdd6dd;
	padding: 2em 0
}
@media screen and (max-width:560px) {
	.entryWorksContainer>span {
		display: inline-block;
		width: 100%;
		border: none;
		padding: 8px 0
	}
}
.entryWorksContainer>p {
	display: inline-block;
	width: 100%;
	padding: 2em 0 2em 2em
}
@media screen and (max-width:560px) {
	.entryWorksContainer>p {
		padding: 12px
	}
}
.hakenEntryConfirmTxt {
	margin: 60px 0
}
@media screen and (max-width:560px) {
	.hakenEntryConfirmTxt {
		margin: 40px 0 60px 0
	}
}
@media screen and (max-width:560px) {
	.Sidebar .hakenServiceSidebarTop {
		pointer-events: none
	}
}
@media screen and (max-width:560px) {
	.Sidebar .hakenServiceSidebarTop::before, .Sidebar .hakenServiceSidebarTop::after {
		display: none
	}
}
.tableOfContents {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1em 2em
}
.tableOfContents.mb {
	margin-bottom: 5em
}
@media screen and (max-width:560px) {
	.tableOfContents.mb {
		margin-bottom: 60px
	}
}
@media screen and (max-width:560px) {
	.tableOfContents {
		display: block;
		padding: 1em 2em;
		border: 1px solid #cdd6dd;
		border-radius: 4px;
		background: rgba(240, 243, 245, 0.5)
	}
}
.tableOfContents>a {
	display: block;
	color: #1a1a1a;
	font-size: 14px;
	padding-left: 1.5em;
	position: relative
}
@media screen and (max-width:560px) {
	.tableOfContents>a {
		padding-left: 0;
		margin-bottom: 1em;
		font-size: 12px;
		font-weight: bold
	}
}
.tableOfContents>a::before, .tableOfContents>a::after {
	content: "";
	width: 8px;
	height: 2px;
	display: inline-block;
	border-radius: 2px;
	background: #98A6B5;
	position: absolute;
	transition: all 0.3s;
	top: calc(50%)
}
.tableOfContents>a::before {
	left: -4.5px;
	transform: rotate(45deg)
}
@media screen and (max-width:560px) {
	.tableOfContents>a::before {
		left: inherit;
		right: 0
	}
}
.tableOfContents>a::after {
	left: 0;
	transform: rotate(135deg)
}
@media screen and (max-width:560px) {
	.tableOfContents>a::after {
		left: inherit;
		right: -4.5px
	}
}
.beginnersImg {
	width: 100%;
	margin: 5em 0 6em 0
}
@media screen and (max-width:560px) {
	.beginnersImg {
		margin: 30px 0 60px 0
	}
}
.beginnersImg.isSmall {
	width: 60%;
	margin: 0 auto;
	padding-bottom: 4em
}
.beginnersImg.isSmall>img {
	width: 100%
}
.beginnersTable {
	padding-bottom: 5em
}
@media screen and (max-width:560px) {
	.beginnersTable {
		table-layout: fixed;
		padding-bottom: 60px
	}
}
.beginnersTable th, .beginnersTable td {
	line-height: 1.5
}
@media screen and (max-width:560px) {
	.beginnersTable td {
		padding: 20px 10px 10px 10px
	}
}
.beginnersTable td {
	line-height: 1.5
}
.beginnerstdHeader01 {
	width: 25%
}
@media screen and (max-width:560px) {
	.beginnerstdHeader01 {
		width: 63px
	}
}
.beginnerstdHeader02 {
	width: 25%
}
@media screen and (max-width:560px) {
	.beginnerstdHeader02 {
		width: 38%
	}
}
.beginnerSmallTitle {
	color: #004831
}
.beginnersFlowContainer {
	margin-bottom: 5em
}
.beginnersMbContents {
	margin-bottom: 5em
}
@media screen and (max-width:560px) {
	.beginnersMbContents {
		font-weight: normal
	}
}
.beginnerOrderList {
	padding-top: 1em
}
.hakenHelp .txt {
	line-height: 1.8;
}
.helpHeading {
	line-height: 1.5
}
.helpTopContainer {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 60px;
}
@media screen and (max-width:560px) {
	.hakenHelp .txt {
		line-height: 2;
	}
	.helpTopContainer {
		display: block;
	}
}
.helpTopContainer.isReverse {
	margin-bottom: 0;
	flex-direction: row-reverse
}
@media screen and (max-width:560px) {
	.helpTopContainer.isReverse {
		flex-direction: column
	}
}
.helpTopContainer img {
	width: 460px;
}
@media screen and (max-width:560px) {
	.helpTopContainer img {
		width: 100%;
		margin-bottom: 30px
	}
}
.helpTopContainer .txt {
	width: calc(100% - 460px);
}
.messageList {
	padding: 2em 0 4em 0
}
@media screen and (max-width:560px) {
	.helpTopContainer .txt {
		width: 100%;
	}
	.messageList {
		padding: 1em 0 2em 0
	}
}
.messageList.mbBottom {
	padding: 0 0 2em 0
}
.messageItem {
	transition: all 0.3s
}
.messageItem>a {
	display: flex;
	align-items: center;
	border-top: 1px solid #cdd6dd;
	padding: 1em 0
}
.messageItemImg {
	width: 20%;
	margin-right: 2em
}
@media screen and (max-width:560px) {
	.messageItemImg {
		aspect-ratio: 1;
		object-fit: cover;
		margin-right: 1em
	}
}
.messageItemContent {
	margin-right: auto;
	width: 65%
}
.messageItemDepartment {
	font-weight: bold;
	font-size: 14px;
	color: #004831
}
@media screen and (max-width:560px) {
	.messageItemDepartment {
		font-size: 13px
	}
}
.messageItemName {
	font-weight: bold;
	font-size: 24px;
	padding: 0.5em 0 1em 0
}
@media screen and (max-width:560px) {
	.messageItemName {
		font-size: 16px
	}
}
.messageItemTxt {
	color: #3b4043;
	font-size: 16px;
	line-height: 1.5
}
@media screen and (max-width:560px) {
	.messageItemTxt {
		font-size: 13px
	}
}
.wpContent.hakenConsultant {
	margin: 0;
}
.messageDetailsTitle {
	line-height: 1.5
}
.messageDetailImg {
	width: 100%;
	margin: 30px 0 60px 0
}
@media screen and (max-width:560px) {
	.messageDetailImg {
		margin: 0 0 30px 0
	}
}
.messageDetailQAContainer {
	margin-bottom: 40px
}
@media screen and (max-width:560px) {
	.messageDetailQAContainer {
		margin-bottom: 30px
	}
}
.messageDetailQuestion {
	font-size: 20px;
	font-weight: bold;
	display: flex;
	align-items: flex-start;
	gap: 20px;
	margin: 1em 0;
	line-height: 1.5
}
.messageDetailQuestion>span {
	color: #004831;
	font-size: 24px;
	font-weight: bold
}
@media screen and (max-width:560px) {
	.messageDetailQuestion>span {
		font-size: 16px
	}
}
@media screen and (max-width:560px) {
	.messageDetailQuestion {
		font-size: 16px
	}
}
.messageDetailAnswer {
	font-size: 16px;
	line-height: 2;
	display: flex;
	align-items: flex-start;
	gap: 20px
}
.messageDetailAnswer>span {
	color: #707f89;
	font-weight: bold;
	font-size: 24px
}
@media screen and (max-width:560px) {
	.messageDetailAnswer>span {
		font-size: 16px
	}
}
@media screen and (max-width:560px) {
	.messageDetailAnswer {
		font-size: 14px;
		line-height: 1.5
	}
}
.messageBottomContainer {
	border-top: 1px solid #cdd6dd;
	border-bottom: 1px solid #cdd6dd;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	position: relative;
	margin-top: 60px;
}
/* .messageBottomContainer::before {
	content: "";
	border: 1px solid #d3d3d3;
	align-self: stretch;
	order: 2
} */
.messageBottomLinkWrap:nth-child(1) {
	padding: 35px 40px 35px 20px;
	width: 50%;
}
.messageBottomLinkWrap:nth-child(2) {
	padding: 35px 20px 35px 40px;
	width: 50%;
}
.messageBottomLinkWrap:first-child {
	border-right: 1px solid #d3d3d3;
}
@media screen and (max-width:560px) {
	.messageBottomLinkWrap:first-child {
		padding: 30px 20px 30px 0;
	}
	.messageBottomLinkWrap:last-child {
		padding: 30px 0 30px 20px;
	}
}
.messageBottomLink {
	
}
.messageBottomLink.isNext {
	/* order: 3 */
}
.messageBottomLink.isNext>div {
	flex-direction: row-reverse
}
.messageBottomLink.isPrev .circle::before {
	transform: rotate(-135deg) translateX(10%)
}
.messageBottomLink.isPrev .circle::after {
	transform: rotate(135deg) translateX(0%) translateY(30%)
}
.messageBottomLinkTop {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-bottom: 2em;
	font-weight: bold;
	font-size: 14px
}
@media screen and (max-width:560px) {
	.messageBottomLinkTop {
		font-size: 12px
	}
}
.messageBottomLinkBottom {
	display: flex;
	align-items: center;
	gap: 2em
}
@media screen and (max-width:560px) {
	.messageBottomLinkBottom {
		display: block;
		width: 70%;
		margin: 0 auto;
		text-align: center
	}
}
.messageBottomLinkBottom>img {
	width: 30%
}
@media screen and (max-width:560px) {
	.messageBottomLinkBottom>img {
		width: 100%;
		margin-bottom: 1em
	}
}
.messageBottomLinkBottom .messageItemDepartment {
	display: inline-block
}
.messageBottomLinkBottom .messageItemName {
	padding-bottom: 0
}
.messageBottomLinkContainer {
	padding: 4em 0;
	display: flex;
	justify-content: center
}
@media screen and (max-width:560px) {
	.messageBottomLinkContainer {
		padding: 40px 0 60px 0
	}
}
.messageBottomLinkContainer>a {
	padding: 1em 4em
}
@media screen and (max-width:560px) {
	.messageBottomLinkContainer>a {
		padding: 20px 0;
		display: inline-flex;
		width: 85%;
		margin: 0 auto;
		display: flex;
		align-items: center;
		justify-content: center
	}
}
.interviewItem {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top: 1px solid #cdd6dd;
	padding: 2em 1em 2em 0;
}
@media screen and (max-width:560px) {
	.interviewItem {
		padding: 1em 1em 1em 0;
	}
}
.interviewList2 {
	margin-bottom: 3em;
	display: flex;
	flex-wrap: wrap;
	gap: 0 2em;
}
.interviewList2 .interviewItemWrap {
	width: calc(50% - 1em);
}
@media screen and (max-width:560px) {
	.interviewList2 {
		display: block;
	}
	.interviewList2 .interviewItemWrap {
		width: 100%;
	}
}
.interviewJobName, .interviewTxt, .interviewDate {
	transition: all 0.3s;
	text-decoration: underline;
	text-decoration-color: transparent
}
.interviewItemContent {
	width: 90%
}
.interviewJobName {
	font-weight: bold;
	font-size: 20px;
	line-height: 1.5
}
.interviewJobName .iconPdf {
	margin-left: 10px;
	vertical-align: middle;
}
@media screen and (max-width:560px) {
	.interviewJobName.isSmall {
		font-size: 14px
	}
}
@media screen and (max-width:560px) {
	.interviewJobName.pt {
		padding-top: 11px
	}
}
@media screen and (max-width:560px) {
	.interviewJobName {
		font-size: 16px
	}
}
.interviewTxt {
	margin-top: 1em;
	color: #1a1a1a;
	font-size: 16px
}
@media screen and (max-width:560px) {
	.interviewTxt {
		font-size: 13px
	}
}
.interviewDate {
	margin-top: 1em;
	color: #1a1a1a;
	font-size: 12px
}
.interviewDetailsTop {
	border: 8px solid #f0f3f5;
	display: flex;
	align-items: center;
	padding: 2em;
	position: relative
}
.interviewDetailsTop::before {
	content: "";
	border: 1px solid #cdd6dd;
	align-self: stretch;
	order: 2;
	margin-right: 2em
}
.interviewDetailsJobsContainer {
	margin-right: auto
}
.interviewDetailsNameContainer {
	order: 3;
	text-align: center;
	font-weight: bold;
	line-height: 1.5
}
.interviewDetailsNameContainer>p {
	font-size: 14px
}
.interviewDetailsNameContainer>p.isSmall {
	font-size: 12px
}
.interviewDetailsTxt {
	font-size: 16px;
	line-height: 1.5;
	margin: 3em 0
}
.interviewDetailsDate {
	font-size: 14px;
	color: #3b4043;
	text-align: right
}
.interviewJobLabel {
	color: #004831;
	font-weight: bold;
	font-size: 14px
}
.hakenInterview {
	margin-top: 60px;
}
@media screen and (max-width:560px) {
	.interviewJobLabel.isSmall {
		display: inline-block;
		font-size: 12px
	}
	.messageDetailsTitle {
		margin-top: 40px;
	}
	.hakenInterview {
		margin-top: 40px;
	}
}
.interviewDetailsBottomContainer {
	border-top: 1px solid #cdd6dd;
	border-bottom: 1px solid #cdd6dd;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	position: relative;
	margin-top: 60px;
}
/* .interviewDetailsBottomContainer::before {
	content: "";
	border: 1px solid #d3d3d3;
	align-self: stretch;
	order: 2
} */
.interviewDetailsBottomLinkWrap:nth-child(1) {
	padding: 35px 40px 35px 20px;
	width: 50%;
}
.interviewDetailsBottomLinkWrap:nth-child(2) {
	padding: 35px 20px 35px 40px;
	width: 50%;
}
.interviewDetailsBottomLinkWrap:first-child {
	border-right: 1px solid #d3d3d3;
}
/* .interviewDetailsBottomLink {
	padding: 2em 1em;
	flex: 1
}
.interviewDetailsBottomLink.isNext {
	order: 3
} */
.interviewDetailsBottomLink.isNext>div {
	flex-direction: row-reverse
}
.interviewDetailsBottomLink.isPrev .circle::before {
	transform: rotate(-135deg) translateX(10%)
}
.interviewDetailsBottomLink.isPrev .circle::after {
	transform: rotate(135deg) translateX(0%) translateY(30%)
}
.interviewDetailsBottomLinkTop {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-bottom: 2em;
	font-weight: bold;
	font-size: 14px
}
@media screen and (max-width:560px) {
	.interviewDetailsBottomLinkTop {
		font-size: 12px
	}
}
.interviewDetailsBottomLinkBottom .interviewJobName {
	/* width: 70%; */
	line-height: 1.5
}
@media screen and (max-width:560px) {
	.interviewDetailsBottomLinkBottom .interviewJobName {
		width: 100%
	}
}
/* .interviewDetailsBottomLinkBottom.pl {
	padding-left: 1em
} */
@media screen and (max-width:560px) {
	.interviewDetailsBottomLinkBottom.pl {
		padding-left: 0
	}
}
.interviewDetailsBottomLinkBottom .interviewJobContainer {
	align-items: flex-start
}
.destinationItem {
	padding: 1em;
	border-top: 1px solid #cdd6dd;
	font-size: 16px;
	font-weight: bold
}
@media screen and (max-width:560px) {
	.destinationItem {
		font-size: 14px;
		font-weight: normal;
		padding: 1.5em 1em
	}
}
@media screen and (max-width:560px) {
	.welfareTxt {
		margin-bottom: 14px !important
	}
}
@media screen and (max-width:560px) {
	.welfareTable {
		table-layout: fixed
	}
}
.welfareTable th, .welfareTable td {
	line-height: 1.5
}
@media screen and (max-width:560px) {
	.welfareTable td.isSmall {
		width: 48px
	}
}
.guideLinkContainer {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	/* gap: 1em; */
	font-weight: bold;
	margin-bottom: 1em
}
.guideLinkContainer .circle{
	margin-right: 1em;
}
@media screen and (max-width:560px) {
	.guideLinkContainer {
		font-size: 12px
	}
}
.guideButtonContainer {
	width: 100%;
	background: rgba(246, 152, 150, 0.15);
	padding: 3em 0;
	margin: 3em 0;
	display: flex;
	justify-content: center;
	align-items: center
}
.guideButtonContainer>a {
	display: block;
	width: 300px
}
.guideButtonContainer>a.btnPink {
	margin-bottom: 0
}
@media screen and (max-width:560px) {
	.guideButtonContainer>a {
		width: 80%
	}
}
.guideButtonContainer .btnPink {
	padding: 1em 0;
	margin-bottom: 1em;
}
.guideButtonContainer .btn::before, .guideButtonContainer .btn::after {
	display: none;
}
.guideButtonContainer .btnPink svg{
	margin-right: 10px;
}
.guideButtonContainer .btnFavorite {
	padding: 0.7em 0;
	text-align: left;
	padding-left: 2em
}
.guideAccessContainer {
	border-top: 1px solid #cdd6dd;
	padding: 1em 0
}
.guideAccessContainer.mt {
	margin-top: 1em
}
.companyAccessTitle {
	font-size: 20px;
	font-weight: bold;
	padding-bottom: 0.5em
}
@media screen and (max-width:560px) {
	.companyAccessTitle {
		font-size: 14px
	}
}
.carrerupTable {
	margin-bottom: 2em;
	padding: 0;
}
.carrerupTableTh1 {
	width: 10%;
}
.carrerupTableTh2 {
	width: 40%;
}
@media screen and (max-width:560px) {
	.carrerupTable {
		table-layout: fixed
	}
	.carrerupTableTh2 {
		width: 30%;
	}
}
.carrerupTable.mbNone {
	margin-bottom: 0
}
.carrerupTable.pbNone {
	padding-bottom: 0
}
.carrerupTable th.isRed, .carrerupTable td.isRed {
	color: #e60000
}
.carrerupTable th.isMedium {
	width: 30%
}
.carrerupTable td.isSmall {
	width: 10%
}
.carrerupTable td.isMedium {
	width: 30%
}
@media screen and (max-width:560px) {
	.carrerupTable td.isMedium.spSmall {
		width: 15%
	}
}
@media screen and (max-width:560px) {
	.carrerupTable td.isCourse {
		width: 75px
	}
}
.careerupAccessContainer {
	margin-bottom: 5em;
	border: 1px solid #cdd6dd;
	border-radius: 3px
}
@media screen and (max-width:560px) {
	.careerupAccessContainer {
		margin-bottom: 60px
	}
}
.careerupAccessTop {
	padding: 1em 2em
}
.careerupAccessBottom {
	border-top: 1px solid #cdd6dd;
	padding: 1em 2em
}
.mainContainer .hakenEnquete {
	margin: 0;
}
.enqueteList {
	width: 100%
}
.enqueteItem {
	padding: 2em 0;
	border-top: 1px solid #cdd6dd
}
.enqueteItemTitleContainer {
	display: flex;
	align-items: center;
	gap: 1em;
	font-weight: bold
}
.enqueteItemTitleContainer>span {
	font-size: 24px;
	color: #004831
}
@media screen and (max-width:560px) {
	.enqueteItemTitleContainer>span {
		font-size: 16px
	}
}
.enqueteItemTitle {
	font-size: 20px
}
@media screen and (max-width:560px) {
	.enqueteItemTitle {
		font-size: 14px
	}
}
.enqueteItemContents {
	width: 100%;
	display: flex;
	justify-content: center;
	margin-top: 2em
}
.enqueteItemImg.isSmall {
	width: 60%
}
@media screen and (max-width:560px) {
	.enqueteItemImg.isSmall {
		width: 80%
	}
}
.enqueteItemImg.isLarge {
	width: 100%
}
@media screen and (max-width:560px) {
	.staffroomSidebarTop.sidebarTop {
		pointer-events: none
	}
	.staffroomSidebarTop.sidebarTop::before, .staffroomSidebarTop.sidebarTop::after {
		display: none
	}
}
.staffroomSidebarAccessContainer {
	border: 8px solid #f0f3f5;
	padding: 2em 0
}
@media screen and (max-width:560px) {
	.staffroomSidebarAccessContainer {
		width: 90%;
		margin: 2em auto 0 auto
	}
}
.staffroomSidebarAccessTitle {
	text-align: center;
	font-size: 20px;
	font-weight: bold
}
@media screen and (max-width:560px) {
	.staffroomSidebarAccessTitle {
		font-size: 14px;
		font-weight: normal
	}
}
.staffroomSidebarAccessContents {
	padding: 1.5em 0;
	width: 90%;
	margin: 0 auto
}
@media screen and (max-width:560px) {
	.staffroomSidebarAccessContents {
		margin-top: 1em;
		border-top: 1px solid #cdd6dd
	}
}
.staffroomSidebarAccessContents:last-of-type {
	padding-bottom: 0
}
.staffroomSidebarAccessContents>p {
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 1em
}
.staffroomSidebarAccessContents .btnBlack {
	line-height: 1.5;
	display: block;
	font-size: 12px;
	width: 100%;
	padding: 0.5em 0
}
@media screen and (max-width:560px) {
	.staffroomSidebarAccessContents .btnBlack {
		font-size: 14px
	}
}
.staffroomSidebarAccessContents .btnBlack>span {
	display: block
}
.staffroomSidebarAccessContents .btnTel {
	display: block;
	font-size: 12px;
	width: 100%;
	text-align: center;
	margin-bottom: 1em;
	padding-left: 1em
}
.staffroomSidebarAccessContents .btnTel::before, .staffroomSidebarAccessContents .btnTel::after {
	display: none
}
@media screen and (max-width:560px) {
	.staffroomSidebarAccessContents .btnTel {
		font-size: 14px
	}
}
@media screen and (max-width:560px) {
	.newsSidebar {
		border: 1px solid #cdd6dd;
		border-radius: 4px;
		margin-bottom: 2em
	}
}
@media screen and (max-width:560px) {
	.newsSidebar>.accordionArea {
		padding: 20px;
	}
}
@media screen and (max-width:560px) {
	.newsSidebar.Sidebar {
		padding: 0
	}
}
.newsSidebar>.sidebarTop {
	position: relative
}
@media screen and (max-width:560px) {
	.newsSidebar>.sidebarTop::before {
		display: none
	}
}
@media screen and (max-width:560px) {
	.newsSidebar>.sidebarTop {
		text-align: left;
		padding: 1em;
		margin-bottom: 0
	}
}
@media screen and (max-width:560px) and (max-width:560px) {
	.newsSidebar>.sidebarTop::before {
		content: ""
	}
}
.newsMenuCircle {
	width: 18px;
	height: 18px;
	border: 2px solid #98a6b5;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%)
}
.newsMenuCircle::after {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 2px;
	border-bottom: 2px solid #98a6b5;
	border-right: 2px solid #98a6b5;
	transform: rotate(45deg) translateY(-50%);
	position: absolute;
	top: 40%;
	right: 6px
}
.staffroomLoginContainer {
	text-align: center
}
.staffroomLoginContainer>.txt {
	text-align: left;
	display: inline-block;
	width: 70%;
	margin: 0 auto 3em auto
}
.staffroomLoginContainer>.textCenter {
	text-align: center
}
@media screen and (max-width:560px) {
	.staffroomLoginContainer>.txt {
		width: 100%
	}
	.staffroomLoginContainer>.textCenter {
		text-align: left;
	}
}
.topNews {
	padding: 0 0 90px 0;
	margin: 0 auto;
	display: flex;
	justify-content: space-between
}
@media screen and (max-width:560px) {
	.topNews {
		padding: 0;
		display: block
	}
}
.topNewsLeft {
	width: 20%
}
@media screen and (max-width:560px) {
	.topNewsLeft {
		padding-bottom: 2em;
		padding-left: 0;
		width: 100%;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		align-items: center
	}
}
.topNewsList {
	width: 70%
}
.topNewsList.isLarge {
	padding: 2em 0;
	width: 100%
}
@media screen and (max-width:560px) {
	.topNewsList {
		width: 100%
	}
}
.topNewsTitle {
	font-size: 28px;
	line-height: 1.5;
	font-weight: bold;
	color: #004831;
	padding-bottom: 0.8em
}
@media screen and (max-width:560px) {
	.topNewsTitle {
		padding-bottom: 1em;
		font-size: 22px
	}
}
.topNewsLink {
	font-size: 14px;
	font-weight: bold;
	display: flex;
	align-items: center;
	gap: 1em
}
@media screen and (max-width:560px) {
	.topNewsLink {
		font-size: 12px
	}
}
.topNewsItemTop {
	width: 90%
}
.topNewsItem {
	width: 100%;
	border-top: 1px solid #cdd6dd;
	padding: 1.5em 0;
	display: flex;
	align-items: center;
	justify-content: space-between
}
@media screen and (max-width:560px) {
	.topNewsItem:last-of-type {
		padding-bottom: 0
	}
}
.topNewsItemBottom {
	width: 70%;
	display: flex;
	padding-bottom: 1em;
	transition: all 0.3s
}
@media screen and (max-width:560px) {
	.topNewsItemBottom {
		width: 100%;
		gap: 10px
	}
	.topNewsItemBottom p {
		width: 90%
	}
}
.staffroomTopNewsButtonContainer {
	width: 80%;
	margin: 0 auto;
	padding: 2em 0
}
.staffroomTopNewsButtonContainer>a {
	font-size: 12px;
	padding: 0.8em 0;
	display: inline-block;
	width: 100%
}
.staffroomTopCardsList {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1em 2em
}
.staffroomTopCardsList>a {
	transition: all 0.3s;
	text-decoration: underline;
	text-decoration-color: transparent
}
@media screen and (max-width:560px) {
	.staffroomTopCardsList {
		gap: 0.3em 0.5em
	}
	.staffroomTopCardsList .LinkCardIcon {
		margin: 0;
		width: auto;
	}
}
@media screen and (max-width:560px) {
	.staffroomTopCardItem>img {
		padding: 0
	}
}
@media screen and (max-width:560px) {
	.staffroomTopCardItem {
		flex-direction: column;
		/* gap: 1em */
	}
	.staffroomTopCardItem .border {
		margin-top: 1em;
	}
}
.aboutSitemapContentsList {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0 2em;
	margin: 3em 0
}
@media screen and (max-width:560px) {
	.aboutSitemapContentsList {
		grid-template-columns: repeat(1, 1fr)
	}
}
.aboutSitemapContentsItem {
	padding-right: 1em;
	border-top: 1px solid #cdd6dd
}
.firstJobListContainer2 {
	padding-left: 1em;
}
.aboutSitemapContentsItem2 {
	border-top: 1px solid #cdd6dd
}
.sitemapLink {
	padding: 1.5em 0;
	display: flex;
	align-items: center;
	font-weight: bold;
	font-size: 16px
}
@media screen and (max-width:560px) {
	.sitemapLink {
		padding: 1em 0;
		font-size: 14px
	}
}
.sitemapLink>span {
	display: inline-block;
	width: 85%
}
.sitemapLink>span>img {
	margin-left: 10px
}
@media screen and (max-width:560px) {
	.sitemapLink>span>img {
		margin-left: 7px
	}
}
.sitemapBottomList {
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 1.5em
}
@media screen and (max-width:560px) {
	.sitemapBottomList {
		padding-bottom: 1em
	}
}
.sitemapBottomItem {
	font-size: 16px;
	color: #3b4043;
	padding-right: 0.3em;
	line-height: 2
}
@media screen and (max-width:560px) {
	.sitemapBottomItem {
		font-size: 13px
	}
}
.sitemapBottomItem:not(:last-child)::after {
	content: "/";
	padding-left: 0.5em
}
.staffroomTopContainer {
	width: 80%;
	max-width: 960px;
	margin: 0 auto;
	border: 8px solid #f0f3f5;
	padding: 2em
}
.staffroomTopContainer>.txt {
	text-align: center
}
@media screen and (max-width:560px) {
	.staffroomTopContainer {
		width: 100%
	}
}
.staffroomTopLinksContainer {
	display: flex;
	justify-content: space-between;
	gap: 2em
}
@media screen and (max-width:560px) {
	.staffroomTopLinksContainer {
		display: block
	}
}
.staffroomTopLink {
	flex: 1;
	border-top: 1px solid #cdd6dd;
	text-align: center;
	padding-top: 1em
}
.staffroomTopLinksContainer .txt{
	margin-bottom: 10px;
}
@media screen and (max-width:560px) {
	.staffroomTopLinksContainer .txt {
		margin-bottom: 0;
	}
}
.staffroomTopLinkName {
	font-weight: bold;
	font-size: 20px;
	margin-bottom: 20px;
}
@media screen and (max-width:560px) {
	.staffroomTopLinkName {
		font-size: 16px;
	}
}
.staffroomTopLinkButtonContainer {
	padding: 1.5em 0;
	width: 80%;
	margin: 0 auto
}
@media screen and (max-width:560px) {
	.staffroomTopLinkButtonContainer {
		width: 100%
	}
}
.staffroomTopLinkButtonContainer .btnBlack {
	line-height: 1.5;
	display: block;
	font-size: 16px;
	width: 100%;
	padding: 0.5em 0
}
@media screen and (max-width:560px) {
	.staffroomTopLinkButtonContainer .btnBlack {
		font-size: 14px
	}
}
.staffroomTopLinkButtonContainer .btnBlack>span {
	display: block
}
.staffroomTopLinkButtonContainer .btnTel {
	display: block;
	font-size: 16px;
	width: 100%;
	text-align: center;
	margin-bottom: 1em
}
.staffroomTopLinkButtonContainer .btnTel::before {
	display: none
}
@media screen and (max-width:560px) {
	.staffroomTopLinkButtonContainer .btnTel {
		font-size: 14px
	}
}
.newsDetailTop {
	display: flex;
	justify-content: flex-end
}
.newsDetailTop .newsCategory {
	margin-right: 0
}
.staffroomNews {
	margin-top: 60px;
}
@media screen and (max-width:560px) {
	.staffroomNews {
		margin-top: 40px;
	}
}
.newsDetailTitle {
	padding: 2em 0;
	border-bottom: 1px solid #cdd6dd
}
@media screen and (max-width:560px) {
	.newsDetailTitle {
		padding: 20px 0 30px 0
	}
}
.newsDetailImg {
	width: 100%;
	margin-bottom: 2em
}
.borderContainer {
	border: 8px solid #f0f3f5;
	padding: 2em;
	margin-bottom: 5em
}
@media screen and (max-width:560px) {
	.borderContainer {
		margin-bottom: 40px
	}
}
.borderContainer.mbNone {
	margin-bottom: 0
}
.staffroomHolidaySupplement {
	line-height: 1.5;
	margin-top: 20px
}
.holidayFormContainer {
	display: flex;
	align-items: center;
	margin-bottom: 0.5em
}
@media screen and (max-width:560px) {
	.holidayFormContainer {
		justify-content: flex-start
	}
}
.holidayFormDataHeading {
	font-weight: bold;
	font-size: 14px;
	padding-top: 13px;
	line-height: 1.5
}
@media screen and (max-width:560px) {
	.holidayFormDataHeading {
		padding: 0
	}
}
.firstJobListContainer {
	width: 100%
}
.changeBottomLinkContainer {
	display: flex;
	justify-content: center;
	padding-top: 60px
}
@media screen and (max-width:560px) {
	.changeBottomLinkContainer {
		padding-top: 30px
	}
}
.isDl {
	padding: 1em 5em
}
.isDl::before, .isDl::after {
	display: none
}
.isDl svg {
	position: absolute;
	top: 50%;
	right: 30px;
	transform: translateY(-50%);
	transition: all 0.3s;
	width: 17px;
	fill: #fff;
}
.isDl:hover svg {
	fill: #004831;
}
.timecardButtonContainer {
	margin: 5em 0;
	display: flex;
	justify-content: center
}
@media screen and (max-width:560px) {
	.isDl svg {
		width: 17px;
	}
	.timecardButtonContainer {
		margin: 40px 0 60px 0
	}
}
.timecardButtonContainer>a {
	padding: 1em 6em
}
.timecardModal {
	margin: 1em 0 3em 0;
	position: relative;
	display: block
}
@media screen and (max-width:560px) {
	.timecardModal {
		margin-bottom: 20px
	}
}
.timecardModal>img {
	width: 100%
}
.timecardLabel {
	background: #004831;
	display: flex;
	align-items: center;
	gap: 1em;
	position: absolute;
	top: 0;
	right: 0;
	padding: 0.4em 1em;
	border-bottom-left-radius: 3px
}
.timecardLabel>p {
	color: #fff;
	font-weight: bold;
	font-size: 14px
}
.sexualList {
	line-height: 2
}
@media screen and (max-width:560px) {
	.sexualList {
		line-height: 1.5
	}
}
.sexualList strong {
	display: inline-block;
	padding: 0.5em 0
}
.sexualList span {
	display: block
}
.sexualList div {
	margin: 0.3em 0
}
.txtIndent {
	padding-left: 2em;
	display: inline-block
}
.storageMItemContents {
	display: flex;
}
.storageMItemContents img{
	margin-left: 1em;
}
.questionContentsContainer {
	margin: 1em 0 3em 0
}
.questionItem {
	padding: 1em 2em;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border: 1px solid #cdd6dd;
	border-radius: 6px;
	margin-bottom: 1em
}
.questionTitle {
	width: 80%;
	display: flex;
	gap: 3em;
	align-items: center
}
@media screen and (max-width:560px) {
	.questionTitle {
		gap: 0;
		display: block;
		font-size: 14px;
		margin-right: 2em
	}
}
.questionMark {
	font-size: 24px;
	font-weight: bold;
	color: #004831
}
@media screen and (max-width:560px) {
	.questionMark {
		display: block;
		margin-bottom: 0.5em;
		font-size: 16px
	}
}
.questionButtonContainer {
	display: flex;
	/* gap: 0.5em; */
	align-items: center
}
.questionButton {
	flex: 1;
	background: #98a6b5;
	font-size: 20px;
	color: #fff;
	border-radius: 3px;
	font-weight: bold;
	padding: 0.5em;
	cursor: pointer;
	transition: all 0.3s;
	width: 40px;
	height: 40px;
	position: relative
}
.questionButton:first-child {
	margin-right: 0.5em;
}
.questionButton.isOk::before {
	content: "";
	width: 18px;
	height: 18px;
	border: 3px solid #fff;
	background: transparent;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%)
}
.questionButton.isOk:hover,
.questionButton.isOk--active {
	background: #ff2c30
}
.questionButton.isNo::before, .questionButton.isNo::after {
	content: "";
	width: 3px;
	height: 18px;
	background: #fff;
	position: absolute;
	top: 50%;
	border-radius: 3px;
	left: 45%
}
.questionButton.isNo::before {
	transform: rotate(45deg) translateX(-180%) translateY(-30%)
}
.questionButton.isNo::after {
	transform: rotate(-45deg) translateX(180%) translateY(-30%)
}
.questionButton.isNo:hover,
.questionButton.isNo--active {
	background: #619be5
}
.qaBottomContainer {
	width: 100%;
	margin-top: 3em
}
@media screen and (max-width:560px) {
	.qaBottomContainer {
		margin-top: 40px
	}
}
@media screen and (max-width:560px) {
	.storageMTxt {
		text-indent: -23px;
		padding-left: 23px
	}
}
@media screen and (max-width:560px) {
	.storageMTxt.idLarge {
		text-indent: -31px;
		padding-left: 31px
	}
}

.mT1 {
	margin-top: 1em;
}


@media screen and (max-width:380px) {
	.messageItemName {
		font-size: 14px
	}
}

.enqueteBlock {
	display: flex;
	align-items: center;
	gap: 0 40px;
	justify-content: center;
}
.enqueteText {
	font-weight: bold;
	text-align: left;
	width: 200px;
}
.enqueteBlock--Bar {
	align-items: flex-start;
}

.enqueteBlock--Bar .enqueteText {
	width: 300px;
}
.enqueteBlock--Bar .enqueteText1{
}
.enqueteText2 {
	position: relative;
	width: 300px;
}
.enqueteText2_2 {
	text-indent: calc((15px + 1em) * -1);
	padding-left: calc(15px + 1em);
	line-height: 1.4;
	margin-top: 0.5em !important;
}
.enqueteText2_3 {
    line-height: 1.4;
    top: 15px;
    position: absolute;
		margin-top: 0 !important;
}
.enqueteText2_3:nth-child(1) {

}
.enqueteText2_3:nth-child(2) {
	top: 69px;
}
.enqueteText2_3:nth-child(3) {
	top: calc(51px * 2 + 1.4em);
}
.enqueteText2_3:nth-child(4) {
	top: calc(51px * 3 + 1.4em);
}
.enqueteText2_3:nth-child(5) {
	top: calc(51px * 4 + 1.4em);
}
.enqueteText2_3:nth-child(6) {
	top: calc(51px * 5 + 1.4em);
}
.enqueteText2_3:nth-child(7) {
	top: calc(51px * 6 + 1.4em);
}
.enqueteText2_3:nth-child(8) {
	top: calc(51px * 7 + 1.4em);
}
.enqueteText2_3:nth-child(9) {
	top: calc(51px * 8 + 1.4em);
}
.enqueteText2_3:nth-child(10) {
	top: calc(51px * 9 + 1.4em);
}
.enqueteText2_3:nth-child(11) {
	top: calc(51px * 10 + 1.4em);
}
.enqueteBlock--Bar .enqueteText2_3:first-child{
	margin-top: 0 !important;
}
.enqueteBlock--Bar .circleNum {
	display: none;
}
.graphIcon {
	width: 15px;
	height: 15px;
	display: inline-block;
	margin-right: 1em;
}
.graphIcon1 {
	background-color: #D55681;
}
.graphIcon2 {
	background-color: #FF96BF;
}
.graphIcon3 {
	background-color: #EDE8E4;
}
.graphIcon4 {
	background-color: #356C93;
}
.graphIcon5 {
	background-color: #00395C;
}
.graphWrap {
	position: relative;
}
.enqueteAvgWrap {
	position: absolute;
	font-weight: bold;
	line-height: 1.2;
	top: calc(50% - 1.2em);
	left: calc(50% - 25px);
}
.enqueteAvg {
	font-size: 1.4em !important;
}

@media screen and (max-width:560px) {
	.enqueteBlock {
		gap: 0 10vw;
	}
	.enqueteText {
		width: 30vw;
	}
	.enqueteText2 {
		width: 100%;
	}
	.enqueteBlock--Bar {
		flex-wrap: wrap;
    gap: 20px 0;
    flex-direction: column-reverse;
	}
	.enqueteBlock--Bar .enqueteText {
		width: 100%;
		padding-left: 4vw;
	}
	.enqueteBlock--Bar .enqueteText2_3:first-child {
		margin-top: 1em !important;
	}
	.enqueteBlock--Bar .enqueteText2_3 {
    position: initial;
    margin-top: 1em !important;
    padding-left: 2em;
    text-indent: -2em;
	}
	.enqueteBlock--Bar .circleNum {
    width: 1.5em;
    display: inline-block;
    border-radius: 50%;
    line-height: 1.5em;
    text-align: center;
    color: #fff;
    background-color: #00395C;
    margin-right: 0.5em;
		text-indent: 0;
		font-size: 14px;
	}
	.enqueteAvgWrap {
		left: calc(50% - 23px);
	}
	.graphWrap2 {
		position: relative;
	}
	.spCircleNum {
		position: absolute;
    left: 4vw;
	}
}

.beginnersFlowTitle2 {
	text-indent: -4em;
	padding-left: 4em;
	font-weight: bold;
}
.beginnersFlowContentsAWrap {
	text-indent: -4em;
	padding-left: 4em;
}
.beginnersFlowContentsA {
	color: inherit !important;
}