@charset "UTF-8";

/*
 * Recruit
 *
 * 「採用なしテキスト」内で .detail-table を使用した場合のみ、
 * Aboutページに準じた募集要項の表組みを適用する。
 *
 * .detail-table を使用しない通常テキストは、
 * shared/css/main.css の従来表示を維持する。
 */


/* Lead
===============================================================*/

#recruit .recruit-lead {
	margin-bottom: clamp(30px, 5vw, 50px);
	text-align: center;
}


/* Detail table
===============================================================*/

#recruit .detail-table {
	text-align: left;
}

#recruit .detail-table > dl {
	padding: 30px 0;
	border-bottom: 1px solid #DBDBDB;
}

#recruit .detail-table > dl:first-child {
	padding-top: 0;
}

#recruit .detail-table > dl:last-child {
	padding-bottom: 0;
	border-bottom: none;
}

#recruit .detail-table > dl > dt {
	font-size: 10px;
	color: #A5A5A5;
	font-weight: 500;
	line-height: 1.8;
}

#recruit .detail-table > dl > dd {
	margin-top: 5px;
	font-weight: 500;
	line-height: 1.8;
}

#recruit .detail-table > dl > dd strong {
	display: block;
}

#recruit .detail-table > dl > dd li {
	padding-left: 1em;
	text-indent: -1em;
	font-weight: 500;
}

#recruit .detail-table > dl > dd p {
	display: flex;
	font-weight: 500;
}

#recruit .detail-table > dl > dd i {
	width: 45px;
	flex: 0 0 45px;
	color: #A5A5A5;
}

#recruit .detail-table > dl > dd span {
	width: calc(100% - 40px);
}

#recruit .detail-table p + p {
	margin-top: 2px;
}

#recruit .detail-table p.note {
	font-size: 12px;
	color: #A5A5A5;
}


/* Recruit contact
===============================================================*/

#recruit .recruit-contact {
	margin-top: 50px;
	text-align: center;
}

#recruit .recruit-contact .btn-link {
	margin-top: 25px;
}


/* PC
===============================================================*/

@media screen and (min-width: 768px) {

	#recruit .detail-table > dl {
		display: flex;
		padding: 45px 0;
	}

	#recruit .detail-table > dl:first-child {
		padding-top: 45px;
		border-top: 1px solid #DBDBDB;
	}

	#recruit .detail-table > dl:last-child {
		padding-bottom: 45px;
		border-bottom: 1px solid #DBDBDB;
	}

	#recruit .detail-table > dl > dt {
		width: 150px;
		flex: 0 0 150px;
		font-size: 13px;
	}

	#recruit .detail-table > dl > dd {
		width: calc(100% - 150px);
		margin-top: 0;
		font-size: 16px;
	}

	#recruit .detail-table > dl > dd strong {
		display: inline;
		padding-left: 20px;
	}

	#recruit .detail-table > dl > dd span {
		width: calc(100% - 45px);
	}

	#recruit .detail-table p + p {
		margin-top: 15px;
	}

	#recruit .recruit-contact {
		margin-top: 80px;
	}

	#recruit .recruit-contact .btn-link {
		margin-top: 30px;
	}

}