@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1+Code:wght@100..700&family=Oswald:wght@200..700&display=swap');



/* mainimage
-----------------------------------------------------------------------------------*/
#mainimage {background: url("../recruit/img/mainimage-recruit.svg") bottom -50% right 15%/auto 78% no-repeat;}
#mainimage h2 span {background-image: url("../recruit/img/mainimage-title-recruit.svg");}

@media screen and (max-width: 897px) {
	#mainimage {background-position: bottom 5px right 5%;}
}

@media screen and (max-width: 480px) {
	#mainimage {
		background-size: auto 50%;
		background-position: bottom 35px right 5%;
	}
}






/* all
-----------------------------------------------------------------------------------*/
main {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.recruit-area {width: 100%;}
.recruit-area .headtitle {
	margin-bottom: 3em;
	min-height: clamp(2.188rem, 1.979rem + 0.69vw, 2.813rem);/*45~35px*/
	background-position: top center;
	background-size: contain;
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.recruit-area .title-subtext {
	text-align: center;
	font-weight: 600;
	font-size: clamp(1.25rem, 1.136rem + 0.3vw, 1.5rem);/*24~20px*/
}






/* top
-----------------------------------------------------------------------------------*/
#recruit-top {
	padding-top: 135px;
	padding-bottom: 120px;
	background: url("../recruit/img/bg-recruit.jpg") top center/cover no-repeat;
}
#recruit-top .headtitle {
	height: clamp(5rem, 3.071rem + 3.01vw, 6.688rem);/*107~80px*/
	background-image: url("../recruit/img/title-recruit-headtext1.svg");
}
#recruit-top .title-subtext {margin-bottom: clamp(5.625rem, 3.92rem + 4.55vw, 9.375rem);/*150~90px*/}
#recruit-top ul {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(2, 1fr);
	grid-gap: 1.2em;
}
#recruit-top ul li {
	height: 100%;
	background: #fff;
	transition: all 0.3s ease;
	overflow: hidden;
	z-index: 0;
}
#recruit-top ul li:not(.no1) {min-height: clamp(15.625rem, 4.911rem + 16.74vw, 25rem);}
#recruit-top ul li::before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: linear-gradient(45deg,  rgba(0,91,151,1) 0%,rgba(0,117,190,1) 14%,rgba(30,156,215,1) 44%,rgba(194,224,148,1) 100%);
	opacity: 0;
	transition: all 0.3s ease;
	z-index: 1;
}
#recruit-top ul li:hover::before {opacity: 1;}
#recruit-top ul li.no1 {grid-area: 1/1 / 3/2;}
#recruit-top ul li.no2 {grid-area: 1/2 / 2/3;}
#recruit-top ul li.no3 {grid-area: 1/3 / 2/4;}
#recruit-top ul li.no7 {grid-area: 1/4 / 2/5;}
#recruit-top ul li.no4 {grid-area: 2/2 / 3/3;}
#recruit-top ul li.no5 {grid-area: 2/3 / 3/4;}
#recruit-top ul li.no6 {grid-area: 2/4 / 3/5;}
#recruit-top ul li a {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0 1em 11em;
	height: calc(100% - 11em - 10px);
	border: solid #004097 5px;
	background-position: bottom 33% center;
	background-size: 10.5em;
	background-repeat: no-repeat;
	position: relative;
	z-index: 1;
}
#recruit-top ul li.no1 a {background-image: url("../recruit/img/icon-mark-company.svg");}
#recruit-top ul li.no2 a {background-image: url("../recruit/img/icon-mark-message.svg");}
#recruit-top ul li.no3 a {background-image: url("../recruit/img/icon-mark-graph.svg");}
#recruit-top ul li.no7 a {background-image: url("../recruit/img/icon-mark-character.svg");}
#recruit-top ul li.no4 a {background-image: url("../recruit/img/icon-mark-card.svg");}
#recruit-top ul li.no5 a {background-image: url("../recruit/img/icon-mark-hand.svg");}
#recruit-top ul li.no6 a {background-image: url("../recruit/img/icon-mark-job.svg");}
#recruit-top ul li a:hover {background-size: 11.5em;}
#recruit-top ul li p {
	width: 100%;
	height: clamp(1.563rem, 1.307rem + 0.68vw, 2.125rem);/*34~25px*/
	background-position: top center;
	background-size: contain;
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#recruit-top ul li.no1 p {
	height: 80px;
	background-image: url("../recruit/img/title-about2.svg");
}
#recruit-top ul li.no2 p {background-image: url("../recruit/img/title-message.svg");}
#recruit-top ul li.no3 p {background-image: url("../recruit/img/title-graph1.svg");}
#recruit-top ul li.no4 p {background-image: url("../recruit/img/title-introduction.svg");}
#recruit-top ul li.no5 p {background-image: url("../recruit/img/title-overseas.svg");}
#recruit-top ul li.no6 p {background-image: url("../recruit/img/title-job.svg");}
#recruit-top ul li.no7 p {background-image: url("../recruit/img/title-character1.svg");}

@media screen and (max-width: 897px) {
	#recruit-top ul {grid-template-columns: repeat(3, 1fr);}
	#recruit-top ul li a {background-size: 7em;}
	#recruit-top ul li a:hover {background-size: 7.5em;}
	#recruit-top ul li.no1 {grid-area: 1/1 / 2/2;}
	#recruit-top ul li.no2 {grid-area: 1/2 / 2/3;}
	#recruit-top ul li.no3 {grid-area: 1/3 / 2/4;}
	#recruit-top ul li.no7 {grid-area: 2/1 / 3/2;}
	#recruit-top ul li.no4 {grid-area: 2/2 / 3/3;}
	#recruit-top ul li.no5 {grid-area: 2/3 / 3/4;}
	#recruit-top ul li.no6 {grid-area: 3/1 / 4/2;}
	#recruit-top ul li.no1 p,
	#recruit-top ul li.no3 p,
	#recruit-top ul li.no7 p,
	#recruit-top ul li.no6 p {height: 60px;}
	#recruit-top ul li.no3 p {background-image: url("../recruit/img/title-graph2.svg");}
	#recruit-top ul li.no6 p {background-image: url("../recruit/img/title-job2.svg");}
	#recruit-top ul li.no7 p {background-image: url("../recruit/img/title-character2.svg");}
}

@media screen and (max-width: 600px) {
	#recruit-top .headtitle {
		height: 35vw;
		background-image: url("../recruit/img/title-recruit-headtext2.svg");
	}
	#recruit-top ul {
		display: inherit;
	}
	#recruit-top ul li.no1,
	#recruit-top ul li:not(.no1) {
		width: 100%;
		height: 130px;
		min-height: inherit;
	}
	#recruit-top ul li:not(.no6) {margin-bottom: 1em;}
	#recruit-top ul li a {
		padding: 1em;
		height: calc(100% - 2em - 10px);
		background-position: left 1em center;
		background-size: auto 70%;
	}
	#recruit-top ul li a:hover {background-size: auto 75%;}
	#recruit-top ul li p {
		background-position: right center;
		background-size: contain;
	}
}






/* about
-----------------------------------------------------------------------------------*/
#about {
	padding: 100px 0;
	background-color: #edf7f9;
}
#about .headtitle {background-image: url("../recruit/img/title-about1.svg");}
#about .about-area {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	grid-column-gap: 1em;
}
#about .about-area .box {
	display: grid;
	grid-template-rows: subgrid;
	grid-row: span 3;
	grid-row-gap: 1.2em;
	margin-top: 5em;
	margin-left: auto;
	margin-right: auto;
	padding: 1em;
	max-width: 410px;
	background-color: #fff;
	border: solid #004097 5px;
	position: relative;
	z-index: 0;
}
#about .about-area .box::before {
	position: absolute;
	inset: -2em auto auto -5px;
	padding: 0.5em 1em 0.5em 0.5em;
	width: calc(clamp(6.25rem, 4.821rem + 2.23vw, 7.5rem) - 1em);/*120~100px*/
	background: url("../recruit/img/bg-heading.svg") left top/contain no-repeat;
	text-align: center;
	line-height: 1;
	font-size: clamp(1rem, 0.714rem + 0.45vw, 1.25rem);/*20~16px*/
	color: #fff;
	z-index: 2;
}
#about .about-area .box.no1::before {content: '匠認定';}
#about .about-area .box.no2::before,
#about .about-area .box.no3::before {content: '採択事業';}
#about .about-area .box.no4::before {content: '書籍掲載';}
#about .about-area .box .title {
	flex-grow: 1;
	text-align: center;
	line-height: 1.4;
	font-family: "Arial Black", "M PLUS 1 Code", monospace;
	font-size: clamp(1.25rem, 1.193rem + 0.15vw, 1.375rem);/*22~20px*/
	color: #004097;
}
#about .about-area .box .text {
	font-size: 1.125em;
}
#about .about-area .box .img {
	margin: 0 auto;
	width: 100%;
	align-self: flex-end;
}
#about .about-area .box.no1 .img {
	max-width: 230px;
	max-height: 230px;
	text-align: center;
}
#about .about-movie {
	margin: 3em auto 0;
	padding-top: 1em;
	width: 100%;
	max-width: 1100px;
	box-sizing: border-box;
	background-color: #004097;
	border: solid #004097 1em;
	text-align: center;
}
#about .about-movie h4.title {
	margin-bottom: 0.7em;
	color: #fff;
}
#about .about-movie video,
#about .about-movie iframe {
	width: 100%;
	box-sizing: border-box;
	vertical-align: top;
	border: solid #fff 0.5em;
	aspect-ratio: 16 / 9;
	height: auto;
}

@media screen and (max-width: 1440px) {
	#about .about-area .box .title .sp {display: none;}
}

@media screen and (max-width: 897px) {
	#about .about-area {grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));}
	#about .about-area .box .title .sp {display: block;}
	#about .about-area .box.no1 .title .sp {display: none;}
}

@media screen and (max-width: 600px) {
	#about .about-area .box .title {font-size: 18px;}
	#about .about-area .box.no4 .title .sp {display: none;}
}

@media screen and (max-width: 480px) {
	#about .about-area {grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));}
	#about .about-area .box.no1 .title .sp,
	#about .about-area .box.no4 .title .sp {display: block;}
}






/* message
-----------------------------------------------------------------------------------*/
#message {
	padding: 100px 0;
	background-color: #fff;
	font-size: 1.125em;
}
#message .headtitle {background-image: url("../recruit/img/title-message.svg");}
#message p {margin-bottom: 1em;}
#message .message-subtext {
	font-size: clamp(1.563rem, 1.333rem + 0.76vw, 2.25rem);/*36~25px*/;
	font-weight: bold;
	color: #ff1d25;
}
#message .img-area {
	float: right;
	margin-left: clamp(1.875rem, -0.865rem + 4.89vw, 5rem);/*80~30px*/
	width: 100%;
	max-width: clamp(18.75rem, 14.583rem + 13.89vw, 31.25rem);/*500~300px*/
	text-align: center;
	color: #000;
}
#message .img-area span {
	margin-left: 0.5em;
	font-size: clamp(1.25rem, 1.136rem + 0.3vw, 1.5rem);/*24~20px*/
}
#message .img-area .img {
	margin-bottom: 0.5em;
	border-radius: 50%;
	overflow: hidden;
}

@media screen and (max-width: 600px) {
	#message .img-area {
		float: inherit;
		margin-left: 0;
		max-width: inherit;
		text-align: center;
	}
	#message .img-area .img {
		margin: 0 auto 1.5em;
		max-width: 300px;
	}
}






/* graph
-----------------------------------------------------------------------------------*/
#graph {
	padding: 100px 0;
	background-color: #edf7f9;
}
#graph .headtitle {background-image: url("../recruit/img/title-graph1.svg");}
#graph ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	grid-row-gap: 2em;
}
#graph ul li {width: calc(90% / 5);}

@media screen and (max-width: 1024px) {
	#graph ul {grid-row-gap: 15px;}
	#graph ul li {width: calc(95% / 5);}
}

@media screen and (max-width: 600px) {
	#graph ul li {width: calc(96% / 2);}
}






/* introduction
-----------------------------------------------------------------------------------*/
#introduction {
	padding: 100px 0;
	background-color: #fff;
}
#introduction .headtitle {background-image: url("../recruit/img/title-introduction.svg");}
.tab-area,.tab-label-area {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	grid-gap: 1em;
}
/* tab label */
.tab-label-area {width: calc(60% - 1em);}
.tab-label {
	display: block;
	width: clamp(3.75rem, 1.25rem + 8.33vw, 11.25rem);/*180~60px*/
	height: clamp(3.75rem, 1.25rem + 8.33vw, 11.25rem);/*180~60px*/
	background-color: #f2f2f2;
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
	border: solid #f2f2f2 2px;
	border-radius: 50%;
	cursor: pointer;
	transition: all 0.3s ease;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.tab-label-area::after {
	content: '';
	display: block;
	width: clamp(3.75rem, 1.25rem + 8.33vw, 11.25rem);/*180~60px*/
}
.tab-label:hover,
.tab-area input:checked + .tab-label {
	border-color: #ff1d25;
}
.tab-label.no1,.tab-content .img.no1 {background-image: url("../recruit/img/img-introduction-man01.svg");}
.tab-label.no2,.tab-content .img.no2 {background-image: url("../recruit/img/img-introduction-woman01.svg");}
.tab-label.no3,.tab-content .img.no3 {background-image: url("../recruit/img/img-introduction-man02.svg");}
.tab-label.no4,.tab-content .img.no4 {background-image: url("../recruit/img/img-introduction-woman02.svg");}
.tab-label.no5,.tab-content .img.no5 {background-image: url("../recruit/img/img-introduction-man03.svg");}
.tab-label.no6,.tab-content .img.no6 {background-image: url("../recruit/img/img-introduction-man04.svg");}
.tab-label.no7,.tab-content .img.no7 {background-image: url("../recruit/img/img-introduction-man05.svg");}
.tab-label.no8,.tab-content .img.no8 {background-image: url("../recruit/img/img-introduction-man06.svg");}
.tab-label.no9,.tab-content .img.no9 {background-image: url("../recruit/img/img-introduction-man07.svg");}
.tab-label.no10,.tab-content .img.no10 {background-image: url("../recruit/img/img-introduction-man08.svg");}
.tab-label.no11,.tab-content .img.no11 {background-image: url("../recruit/img/img-introduction-man09.svg");}
.tab-label.no12,.tab-content .img.no12 {background-image: url("../recruit/img/img-introduction-man10.svg");}
.tab-label.no13,.tab-content .img.no13 {background-image: url("../recruit/img/img-introduction-man11.svg");}
.tab-label.no14,.tab-content .img.no14 {background-image: url("../recruit/img/img-introduction-man12.svg");}
.tab-label.no15,.tab-content .img.no15 {background-image: url("../recruit/img/img-introduction-woman03.svg");}
.tab-label.no16,.tab-content .img.no16 {background-image: url("../recruit/img/img-introduction-woman04.svg");}
.tab-label.no17,.tab-content .img.no17 {background-image: url("../recruit/img/img-introduction-woman05.svg");}
.tab-label.no18,.tab-content .img.no18 {background-image: url("../recruit/img/img-introduction-woman06.svg");}
.tab-label.no19,.tab-content .img.no19 {background-image: url("../recruit/img/img-introduction-woman07.svg");}
/* tab content */
.tab-content {
	display: none;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto repeat(2, 1fr);
	width: 35%;
	animation: fadeIn 1s ease;
	position: relative;
}
.tab-content .position {
	grid-area: 1/1 / 2/2;
	margin-bottom: 0.5em;
}
.tab-content .position span {
	display: block;
	margin-bottom: 0.6em;
	font-size: 18px;
}
.tab-content .name {
	grid-area: 2/1 / 3/2;
	font-size: 24px;
	color: #004097;
}
.tab-content .name small{
	margin-left: 0.5em;
	font-size: 0.75em;
}
.tab-content .img {
	margin-bottom: 2em;
	width: clamp(9.375rem, 6.25rem + 10.42vw, 18.75rem);/*300~150px*/
	height: clamp(9.375rem, 6.25rem + 10.42vw, 18.75rem);/*300~150px*/
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
	grid-area: 1/2 / 3/3;
}
.tab-content .text {
	grid-area: 3/1 / 4/3;
	font-size: 1.125em;
}
.tab-content .text :is(.Q1,.Q2) {
	padding-left: 1.9em;
	font-weight: 600;
	color: #004097;
	position: relative;
}
.tab-content .text :is(.Q1,.Q2)::before {
	position: absolute;
	left: 0;
	margin-right: 0.5em;
}
.tab-content .text .Q1::before {content: 'Q1';}
.tab-content .text .Q2::before {content: 'Q2';}
.tab-content .text .ans {margin-left: 1.9em;}
.tab-content .text .ans:not(:last-of-type) {margin-bottom: 1.3em;}
@keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
/* tab挙動 */
input[name="tab_switch"] {display: none;}
.tab-label-area:has(#tab01:checked) ~ #tab01-content,
.tab-label-area:has(#tab02:checked) ~ #tab02-content,
.tab-label-area:has(#tab03:checked) ~ #tab03-content,
.tab-label-area:has(#tab04:checked) ~ #tab04-content,
.tab-label-area:has(#tab05:checked) ~ #tab05-content,
.tab-label-area:has(#tab06:checked) ~ #tab06-content,
.tab-label-area:has(#tab07:checked) ~ #tab07-content,
.tab-label-area:has(#tab08:checked) ~ #tab08-content,
.tab-label-area:has(#tab09:checked) ~ #tab09-content,
.tab-label-area:has(#tab10:checked) ~ #tab10-content,
.tab-label-area:has(#tab11:checked) ~ #tab11-content,
.tab-label-area:has(#tab12:checked) ~ #tab12-content,
.tab-label-area:has(#tab13:checked) ~ #tab13-content,
.tab-label-area:has(#tab14:checked) ~ #tab14-content,
.tab-label-area:has(#tab15:checked) ~ #tab15-content {display: block grid;}

@media screen and (max-width: 1280px) {
	.tab-label-area {width: calc(50% - 1em);}
	.tab-label-area::after {width: calc(95% / 4 - 1em);}
	.tab-content {width: 45%;}
}

@media screen and (max-width: 897px) {
	.tab-label-area {width: calc(45% - 1em);}
	.tab-content {
		width: 50%;
		grid-template-rows: 1fr repeat(3, auto);
	}
	.tab-content .position {grid-area: 2/1 / 3/3;}
	.tab-content .name {grid-area: 3/1 / 4/3;}
	.tab-content .img {
		grid-area: 1/1 / 2/3;
		margin: 0 auto 2em;
		width: clamp(9.375rem, 2.181rem + 23.98vw, 15.625rem);/*250~150px*/
		height: clamp(9.375rem, 2.181rem + 23.98vw, 15.625rem);
	}
	.tab-content .text {
		grid-area: 4/1 / 5/3;
		margin-top: 2em;
	}
}

@media screen and (max-width: 600px) {
	.tab-label-area {
		padding-bottom: 2em;
		width: 100%;
		flex-wrap:nowrap;
		overflow-x: scroll;
	}
	.tab-content {
		width: 100%;
		grid-template-rows: auto 1fr auto;
	}
	.tab-content .position {grid-area: 1/1 / 2/2;}
	.tab-content .name {grid-area: 2/1 / 3/2;}
	.tab-content .img {grid-area: 1/2 / 3/3;}
	.tab-content .text {
		grid-area: 3/1 / 4/3;
		margin-top: 0;
	}
}






/* overseas
-----------------------------------------------------------------------------------*/
#overseas {
	padding: 100px 0;
	background-color: #edf7f9;
	/*width: calc(50% - 1px);*/
}
/*#overseas section {margin: 0 20px;}*/
#overseas .headtitle {background-image: url("../recruit/img/title-overseas.svg");}
#overseas .overseas-area {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(2, 1fr);
	grid-gap: 2px;
	margin: 0 auto;
	width: 100%;
	max-width: 1150px;
}
#overseas .overseas-area .box {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	flex-wrap: wrap;
	background-color: #fff;
	position: relative;
	overflow: hidden;
}
#overseas .overseas-area .box.no1 {grid-area: 1/1 / 2/2;}
#overseas .overseas-area .box.no2 {grid-area: 1/2 / 2/3;}
#overseas .overseas-area .box.no3 {grid-area: 2/1 / 3/3;}
#overseas .overseas-area .box.no4 {grid-area: 1/3 / 3/4;}
#overseas .overseas-area .box p {
	padding: 25px;
	width: calc(100% - 50px);
}
#overseas .overseas-area .box p:nth-of-type(1) {
	background-color: #3fa9f5;
	font-size: clamp(1.125rem, 0.875rem + 0.31vw, 1.25rem);/*20~18px*/
	color: #fff;
}
#overseas .overseas-area .box p:nth-of-type(1) span {
	display: block;
	margin-top: 1em;
	line-height: 1.2;
	font-size: clamp(1.563rem, 1.188rem + 0.47vw, 1.75rem);/*28~25px*/
}
#overseas .overseas-area .box img {
	position: absolute;
	inset: 0;
	margin: auto;
}

@media screen and (max-width: 1280px) {
	#overseas .overseas-area .box p {
		padding: 15px;
		width: calc(100% - 30px);
	}
}

@media screen and (max-width: 1024px) {
	#overseas {width: 100%;}
	#overseas .overseas-area .box p {
		padding: 25px;
		width: calc(100% - 50px);
	}
	#overseas .overseas-area .box p:nth-of-type(1) {font-size: clamp(1.125rem, 1.015rem + 0.37vw, 1.25rem);}
	#overseas .overseas-area .box p:nth-of-type(1) span {font-size: clamp(1.563rem, 1.397rem + 0.55vw, 1.75rem);}
}

@media screen and (max-width: 897px) {
	#overseas .overseas-area {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(3, 1fr);
	}
	#overseas .overseas-area .box.no1 {grid-area: 1/1 / 2/2;}
	#overseas .overseas-area .box.no2 {grid-area: 2/1 / 3/2;}
	#overseas .overseas-area .box.no3 {grid-area: 3/1 / 4/3;}
	#overseas .overseas-area .box.no4 {grid-area: 1/2 / 3/3;}
}

@media screen and (max-width: 600px) {
	#overseas .overseas-area .box img {
		width: auto;
		height: 100%;
	}
}

@media screen and (max-width: 480px) {
	#overseas .overseas-area {
		grid-template-columns: 60% 40%;
		grid-template-rows: repeat(3, auto);
	}
	#overseas .overseas-area .box.no1 {grid-area: 1/1 / 2/3;}
	#overseas .overseas-area .box.no2 {grid-area: 2/1 / 3/2;}
	#overseas .overseas-area .box.no3 {grid-area: 3/1 / 4/2;}
	#overseas .overseas-area .box.no4 {grid-area: 2/2 / 4/3;}
	#overseas .overseas-area .box:not(.no4) img {
		position: inherit;
		width: 100%;
		height: auto;
	}
}






/* job
-----------------------------------------------------------------------------------*/
#job {
	padding: 100px 0;
	background-color: #fff;
	/*width: calc(50% - 1px);*/
}
/*#job section {margin: 0 20px;}*/
#job .headtitle {background-image: url("../recruit/img/title-job.svg");}
#job .title-subtext {
	margin-bottom: 3em;
	font-size: 18px;
}
#job table {
	margin: 0 auto;
	width: 100%;
	max-width: 1000px;
	border-spacing: 0;
	border-top: solid #ccc 1px;
	font-size: 18px;
}
#job table th,
#job table td {
	padding: 1em;
	border-bottom: solid #ccc 1px;
}
#job table th:not(:last-child),
#job table td:not(:last-child) {border-right: solid #eee 1px;}

@media screen and (max-width: 1024px) {
	#job {width: 100%;}
	#job table {font-size: 1em;}
}

@media screen and (max-width: 600px) {
	#job table {border-top: none;}
	#job table th,
	#job table td {
		display: block;
		background-color: #fff;
		border-bottom: none;
	}
	#job table th:not(:last-child),
	#job table td:not(:last-child) {border-right: none;}
	#job table th {
		background-color: #dde7e9;
	}
	#job table tr:first-child {display: none;}
	#job table td:is(.sales,.manufacturing)::before {
		display: block;
		margin-bottom: 10px;
		padding: 2px 0;
		width: 100%;
		text-align: center;
		font-weight: 600;
		color: #fff;
	}
	#job table td.sales::before {
		content: '営業職';
		background-color: #3070c7;
	}
	#job table td.manufacturing::before {
		content: '製造職';
		background-color: #00a99d;
	}
}