body {
  font-family: -apple-system, BlinkMacSystemFont, "ヒラギノ角ゴ ProN",
    "Hiragino Kaku Gothic ProN", HiraKakuProN-W3, "ヒラギノ角ゴ ProN",
    "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",
    "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium",
    "Yu Gothic Medium", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", "Helvetica Neue", HelveticaNeue, "Segoe UI", sans-serif;
  font-size: 1.6rem;
  font-weight: 300;
  color: #000;
}

.l-job {
  position: relative;
  margin-top: 90px;
  padding-bottom: 50px;
  width: 100%;
  font-feature-settings: "palt";
}
.c-heading02 {
	margin-top: 60px;
}
.l-job_section {
	max-width: 1232px;
	width: 88%;
	margin: 50px auto 130px auto;
}
.content_wrapper {
	display: flex;
	justify-content: space-between;
}

.job-list_navi {
	display: block;
	position: sticky;
	top: 110px;
	left: 0px;
	width: 20%;
	height: 30%
}
.job-list_navi li{
	padding-bottom: 20px;
}
.navi a {
	font-size: 16px;
	color: #b0b0b0;
	transition: .3s
}


.navi::before {
	content: '';
	display: inline-block;
	margin-right: 12px;
	width: 30px;
	background-size: contain;
	vertical-align: middle;
	transition: .3s
}
.navi01::before {
	height: 28.5px;
	background-image: url(../img/work/icon_job01_gray.png);
}
.navi02::before {
	height: 30px;
	background-image: url(../img/work/icon_job02_gray.png);
}
.navi03::before {
	height: 29.5px;
	background-image: url(../img/work/icon_job03_gray.png);
}
.navi04::before {
	height: 35.5px;
	background-image: url(../img/work/icon_job04_gray.png);
}
.navi05::before {
	height: 30px;
	background-image: url(../img/work/icon_job05_gray.png);
}
.navi06::before {
	height: 30px;
	background-image: url(../img/work/icon_job06_gray.png);
}
.navi07::before {
	height: 30px;
	background-image: url(../img/work/icon_job07_gray.png);
}
.navi08::before {
	content: '';
	height: 29.5px;
	background-image: url(../img/work/icon_job08_gray.png);
}
.navi09::before {
	height: 18.5px;
	background-image: url(../img/work/icon_job09_gray.png);
}

li.current a, .navi:hover a {
	color: #000;
	transition: .3s;
}
li.current::before, .navi:hover::before {
	transition: .3s;
}
li:first-child.current::before, .navi01:hover::before {
	background-image: url(../img/work/icon_job01.png);
}
li.current:nth-child(2)::before, .navi02:hover::before {
	background-image: url(../img/work/icon_job02.png);
}
li.current:nth-child(3)::before, .navi03:hover:before {
	background-image: url(../img/work/icon_job03.png);
}
li.current:nth-child(4)::before, .navi04:hover::before {
	background-image: url(../img/work/icon_job04.png);
}
li.current:nth-child(5)::before, .navi05:hover::before {
	background-image: url(../img/work/icon_job05.png);
}
li.current:nth-child(6)::before, .navi06:hover::before {
	background-image: url(../img/work/icon_job06.png);
}
li.current:nth-child(7)::before, .navi07:hover::before {
	background-image: url(../img/work/icon_job07.png);
}
li.current:nth-child(8)::before, .navi08:hover::before {
	background-image: url(../img/work/icon_job08.png);
}
li.current:last-child::before, .navi09:hover::before {
	background-image: url(../img/work/icon_job09.png);
}

.job-list {
	width: 84%;
	height: 100%;
}
.job-list_item {
	margin-bottom: 70px
}
.job-list_item_title {
	position: relative;
	padding-bottom: 20px;
	font-size: 28px;
	border-bottom: solid 1px #c1c1c1;
}
.job-list_item_title::before {
	content: '';
	display: inline-block;
	margin-right: 15px;
	width: 60px;
	background-size: contain;
	vertical-align: middle;
}
#job01 .job-list_item_title::before {
	height: 57px;
	background-image: url(../img/work/icon_job01.png);
}
#job02 .job-list_item_title::before {
	height: 60px;
	background-image: url(../img/work/icon_job02.png);
}
#job03 .job-list_item_title::before {
	height: 59.5px;
	background-image: url(../img/work/icon_job03.png);
}
#job04 .job-list_item_title::before {
	height: 71.5px;
	background-image: url(../img/work/icon_job04.png);
}
#job05 .job-list_item_title::before {
	height: 60px;
	background-image: url(../img/work/icon_job05.png);
}
#job06 .job-list_item_title::before {
	height: 65px;
	background-image: url(../img/work/icon_job06.png);
}
#job07 .job-list_item_title::before {
	height: 60px;
	background-image: url(../img/work/icon_job07.png);
}
#job08 .job-list_item_title::before {
	height: 69.5px;
	background-image: url(../img/work/icon_job08.png);
}
#job09 .job-list_item_title::before {
	height: 37.5px;
	background-image: url(../img/work/icon_job09.png);
}
.job-list_item_title::after {
	content: '';
	display: inline-block;
	position: absolute;
	left: 0;
	height: 3px;
	background-color: #e60213;
}
#job01 .job-list_item_title::after {
	top: 76px;
	width: 130px;
}
#job02 .job-list_item_title::after {
	top: 79px;
	width: 186px;
}
#job03 .job-list_item_title::after {
	top: 78px;
	width: 159px;
}
#job04 .job-list_item_title::after {
	top: 90px;
	width: 132px;
}
#job05 .job-list_item_title::after {
	top: 79px;
	width: 188px;
}
#job06 .job-list_item_title::after {
	top: 83px;
	width: 132px;
}
#job07 .job-list_item_title::after {
	top: 79px;
	width: 232px;
}
#job08 .job-list_item_title::after {
	top: 88px;
	width: 200px;
}
#job09 .job-list_item_title::after {
	top: 62px;
	width: 130px;
}

.job-list_content {
	display: flex;
	justify-content: space-between;
	margin-top: 40px;
}
.job-list_content_image {
	width: 44%;
	height: 100%;
}

.job-list_content_right {
	width: 52%;
	line-height: 2em;
}
.indent {
    text-indent: -1em;
    margin-left: 1em;
    font-size: 13px;
    padding-top: 15px;
}
.interview-link {
	margin-top: 40px;
}

.interview-link_title {
	padding-bottom: 15px;
	font-size: 17px;
	font-weight: bold;
	line-height: 0;
}

.interview-link_title::before {
	content: '';
	display: inline-block;
	position: relative;
	bottom: 4px;
	left: 0;
	margin-right: 6px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #e60213;

}
.interview-link_box {
	display: flex;
	justify-content: space-between;
	background-color: #f2f2f2;
	padding: 15px 6% 0 6%;
}
.interview-link_item {
	display: flex;
	align-items: center;
}

.interview-link_item {
	padding-bottom: 15px;
}
.interview-link_image {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	margin-right: 10px;
	overflow: hidden;
}
.interview-link_item img{
	transition: .3s;
}
.interview-link_item:hover img{
	transform: scale(1.1);
	transition: .3s;
}
.interview-link_item .occupation {
	font-size: 15px;
	font-weight: bold;
	color: #000;
	transition: .3s;
}
.interview-link_item:hover .occupation{
	color: #e60213;
	transition: .3s;
}
.interview-link_item .name{
	font-size: 12px;
	color: #3c3c3c;
	line-height: 1.5em;
}
@media (max-width: 1000px) {
	.interview-link_box {
		display: flex;
		flex-wrap: wrap;
	}

}
@media (max-width: 768px) {
	.l-job {
    	padding-bottom: 65px;
  	}
	.c-heading02 {
		margin-top: 40px;
	}
	body {
		font-size: 14px;
	}
	.l-job_section {
	margin: 20px 5% 50px 5%;
	}
	.content_wrapper {
		flex-direction: column;
	}
	.job-list_navi {
		position: static;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding-top: 20px;
		width: 100%;
	}
	.job-list_navi li {
		width: 48%;
		font-size: 18px;
	}
	.job-list_navi li a {
		font-size: 18px;
		color: #000;
	}
 
	.navi01::before, .navi02::before, .navi03::before, .navi04::before, .navi05::before, .navi06::before, .navi07::before, .navi08::before, .navi09::before{
		margin-right: 6px;
	}
	.navi01::before {
		background-image: url(../img/work/icon_job01.png);
	}
	.navi02::before {
		background-image: url(../img/work/icon_job02.png);
	}
	.navi03::before {
		background-image: url(../img/work/icon_job03.png);
	}
	.navi04::before {
		background-image: url(../img/work/icon_job04.png);
	}
	.navi05::before {
		background-image: url(../img/work/icon_job05.png);
	}
	.navi06::before {
		background-image: url(../img/work/icon_job06.png);
	}
	.navi07::before {
		background-image: url(../img/work/icon_job07.png);
	}
	.navi08::before {
		background-image: url(../img/work/icon_job08.png);
	}
	.navi09::before {
		background-image: url(../img/work/icon_job09.png);
	}
	.navi01::after, .navi02::after, .navi03::after, .navi04::after, .navi05::after, .navi06::after, .navi07::after, .navi08::after, .navi09::after{
		content: '';
		display: inline-block;
		position: relative;
		top: -4px;
		margin-left: 6px;
		width: 8px;
		height: 8px;
		border: 1px solid;
		border-color:  transparent transparent #000 #000;
		transform: rotate(-45deg);
		vertical-align: middle;
	}

  	.job-list {
  		width: 100%;
  		padding-top: 15px;
  	}
  	.job-list:first-of-type {
  		padding-top: 20px;
  	}
  	.job-list_item {
  		margin-bottom: 50px;
  	}
 	 .job-list_content {
  		flex-direction: column;
  		margin-top: 25px;
  	}
  	.job-list_content_image {
  		width: 100%;
 	 }
  	.job-list_content_right {
  		width: 100%;
  		padding-top: 15px;
  		line-height: 1.8em;
  	}
  	.job-list_item_title {
  		padding-bottom: 10px;
  		font-size: 22px;
  	}


  	.job-list_item_title::before {
  		margin-right: 10px;
		width: 36px;
  	}
  	#job01 .job-list_item_title::before {
		height: 34.2px;
	}
	#job02 .job-list_item_title::before {
		height: 36px;
	}
	#job03 .job-list_item_title::before {
		height: 35.7px;
	}
	#job04 .job-list_item_title::before {
		height: 42.9px;
	}
	#job05 .job-list_item_title::before {
		height: 36px;
	}
	#job06 .job-list_item_title::before {
		height: 39px;
	}
	#job07 .job-list_item_title::before {
		height: 36px;
	}
	#job08 .job-list_item_title::before {
		height: 41.7px;
	}
	#job09 .job-list_item_title::before {
		height: 22.5px;
	}


	#job01 .job-list_item_title::after {
		top: 43px;
		width: 92px;
	}
	#job02 .job-list_item_title::after {
		top: 46px;
		width: 134px;
	}
	#job03 .job-list_item_title::after {
		top: 45px;
		width: 115px;
	}
	#job04 .job-list_item_title::after {
		top: 52px;
		width: 92px;
	}
	#job05 .job-list_item_title::after {
		top: 45px;
		width: 136px;
	}
	#job06 .job-list_item_title::after {
		top: 48px;
		width: 90px;
	}
	#job07 .job-list_item_title::after {
		top: 45px;
		width: 172px;
	}
	#job08 .job-list_item_title::after {
		top: 51px;
		width: 148px;
	}
	#job09 .job-list_item_title::after {
		top: 36px;
		width: 92px;
	}


	.indent {
	    text-indent: -1em;
	    margin-left: 1em;
	    font-size: 10px;
	    padding-top: 10px;
	}
	.interview-link{
		margin-top: 30px;
	}
	.interview-link_box {
		padding: 15px 20px 0 20px;
	}
}