@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");

/* ---------------------------------------------
*   /rec/
--------------------------------------------- */
html {
	scroll-behavior: smooth;
}
.rec_lp {
	font-family: "Noto Sans JP", sans-serif;
}

.rec_lp .page_img_box {
	position: relative;
}

.rec_page-title {
	width: clamp(118px, calc(236 / 750 * 100vw), 236px);
	height: clamp(118px, calc(236 / 750 * 100vw), 236px);
	background: rgba(255, 255, 255, 0.85);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: min(calc(20 / 750 * 100vw), 20px);
}

.rec_page-title__name {
	font-size: clamp(6px, calc(12.3 / 750 * 100vw), 12.3px);
	color: #e6002c;
	font-weight: 700;
	letter-spacing: 0.1em;
}

.rec_page-title__main {
	font-size: clamp(14px, calc(28 / 750 * 100vw), 28px);
	font-weight: 700;
	color: #313233;
	letter-spacing: 0.075em;
	text-align: center;
}

.intro-btn_wrap {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(16px, calc(26 / 750 * 100vw), 61px);
	max-width: 711px;
	margin-inline: auto;
	margin-bottom: clamp(35px, calc(70 / 750 * 100vw), 55px);
}

.intro-btn {
	background: #e6002c;
	border-radius: 8px;
	max-width: 325px;
	min-height: clamp(50px, calc(100 / 750 * 100vw), 75px);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: clamp(8px, calc(16 / 750 * 100vw), 16px);
	font-weight: 700;
	position: relative;
}

.intro-btn:before {
	content: "▼";
	padding-right: 0.2em;
}

.intro-btn:hover {
	opacity: 0.7;
}

.intro-btn__label {
	font-size: clamp(13px, calc(26 / 750 * 100vw), 26px);
	padding-left: clamp(4px, calc(8 / 750 * 100vw), 8px);
}

.rec_contents {
	margin-bottom: clamp(45px, calc(90 / 750 * 100vw), 50px);
}

.rec_page-title__lv3 {
	border-block: 2px solid #e6002c;
	background: #fff8fa;
	min-height: clamp(54px, calc(107 / 750 * 100vw), 78px);
	color: #e6002c;
	font-size: clamp(12px, calc(24 / 750 * 100vw), 18px);
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.5em;
	margin-bottom: clamp(22px, calc(44 / 750 * 100vw), 42px);
}

.lv3__main {
	font-size: clamp(19px, calc(38 / 750 * 100vw), 28px);
	color: #333;
}



/* table */
:root {
	--table-border: 1px solid #7c7c7c;
}

.job-table {
	border-top: var(--table-border);
}

.job-section {
	border-right: var(--table-border);
	border-left: var(--table-border);
	display: grid;
	grid-template-columns: 115px 1fr;
}
@media screen and (max-width: 740px) {
  .job-section {
	  grid-template-columns: calc(143 / 750 * 100vw) 1fr;
  }
}

.job-section__title {
	padding: clamp(5px, calc(15 / 750 * 100vw), 15px);
	background: #f7f7f7;
	font-size: clamp(11px, calc(22 / 750 * 100vw), 14px);
	font-weight: 700;
	display: flex;
	align-items: center;
	border-right: var(--table-border);
	border-bottom: var(--table-border);
}
@media screen and (max-width: 740px) {
  .job-section__title {
	  justify-content: center;
	  text-align: center;
  }
}

.job-list {}

.job-list--single .job-list__item {
	display: grid;
	grid-template-columns: 1fr;
}

.job-list__item {
	display: grid;
	grid-template-columns: 107px 1fr;
}
@media screen and (max-width: 740px) {
  .job-list__item{
	  grid-template-columns: 1fr;
  }
}


.job-list--double_2tiers {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 740px) {
  .job-list--double_2tiers {
	  grid-template-columns: 1fr;
  }
}


.job-list__item dt,
.job-list__item dd {
	padding: clamp(5px, calc(15 / 750 * 100vw), 15px);
	border-bottom: var(--table-border);
	font-size: clamp(11px, calc(21 / 750 * 100vw), 14px);
}

.job-list__item dt {
	background: #f7f7f7;
	border-right: var(--table-border);
	font-weight: 700;
	text-align: center;
}
@media screen and (max-width: 740px) {
  .job-list__item dt {
	  border-right: none;
  }
}


.job-list__item dd {
  background: #fff;
}

/* 採用担当者（PCレイアウト） */
@media screen and (min-width: 741px) {
	.job-list--double_2tiers .job-list__item:nth-child(even) {
		border-left: var(--table-border);
	}
}

/* 加入保険、昇給賞与（PCレイアウト） */
@media screen and (min-width: 741px) {
	.job-section--grouping {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: stretch;
	}
	.job-section--grouping .job-section:nth-child(even) {
		border-left: none;
	}
	.job-section--grouping > .job-section {
		display: grid;
		grid-template-columns: 115px minmax(0, 1fr);
		height: 100%;
	}
	.job-section--grouping .job-list__item {
		height: 100%;
	}
}

/* 給与（PCレイアウト）*/
@media screen and (min-width: 741px) {
	.salary .job-list__item {
		text-align: center;
	}
	
	.job-list--salary .job-list__item {
		display: grid;
		grid-template-columns: 107px repeat(5, 1fr);
	}
	
	.job-list--salary .job-list__item dd {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.job-list--salary .job-list__item dd:not(:last-child) {
		border-right: var(--table-border);
	}
}

/* 給与（SPレイアウト）*/
@media screen and (max-width: 740px) {
	.salary__area {
		font-size: clamp(11px, calc(22 / 750 * 100vw), 14px);
		display: grid;
		grid-template-columns: 1fr;
		border-bottom: var(--table-border);
	}

	.salary__area h4 {
		padding: clamp(5px, calc(15 / 750 * 100vw), 15px);
		font-weight: 700;
		background: #f7f7f7;
	}

	.salary__list > div {
  		display: grid;
  		grid-template-columns: 1fr auto;
	}

	.salary__list dt,
	.salary__list dd {
  		padding: clamp(5px, calc(15 / 750 * 100vw), 15px);
	}
	
	.salary__list dd {
  		text-align: right;
  		white-space: nowrap;
	}
	
	.salary__total {
		border-top: var(--table-border);
		border-top-style: dotted;
	}
}

.job-list__item .text-large {
	font-size: clamp(12.5px, calc(25 / 750 * 100vw), 17px);
}

.job-list__item .text-small {
	font-size: clamp(10px, calc(20 / 750 * 100vw), 12px);
}

.job-list__item .text-red {
	color: #e6002c;
}

.mail-address img {
	max-height: clamp(11px, calc(21 / 750 * 100vw), 14px);
}

.entry-btn {
	max-width: clamp(300px, calc(600 / 750 * 100vw), 385px);
	height: clamp(43px, calc(86 / 750 * 100vw), 55px);
	margin-inline: auto;
	margin-top: clamp(25px, calc(50 / 750 * 100vw), 40px);
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #e6002c;
	border-radius: 8px;
	font-size: clamp(12px, calc(24 / 750 * 100vw), 16px);
	color: #e6002c;
	font-weight: 700;
}

.entry-btn:hover {
	opacity: 0.7;
}

.page-top a {
	font-size: clamp(10px, calc(20 / 750 * 100vw), 15px);
	color: #e6002c;
	font-weight: 700;
	display: block;
	text-align: right;
}
.page-top:not(:last-child) {
	margin-bottom: clamp(25px, calc(50 / 750 * 100vw), 40px);
}
