.mainimage {
  width: 100%;
  margin-bottom: 3.07291vw;
  background-image: url("../img/works/main_works.png");
  background-repeat: no-repeat;
  background-size: contain;
  aspect-ratio: 24/5;
}

.workList{
	width: 100%;
	display: flex;
	justify-content: center;
	padding: 0;
}
.workList li{
	/*border: #ffffff 0.15625vw solid;*/
	background: #f0f0f0;
	color: #004097;
	font-weight: bold;
	text-align: center;
	font-size:0.8333333333vw;
	line-height:2.08333333vw
}
.workList li.active{
	width: 20.833333333vw;;
	line-height: 2.08333333vw;
	background: #004097;
	color: #fff;

}
.workList li a{
	display: inline-block;
	width: 20.833333333vw;
	text-decoration: none;
	color: #004097;
	font-weight: 500;
	transition: none;

}
.workList li a:hover{
	background:#5EA8DD;
	color:#fff;
	opacity: 0.5;
}

.jobList.chitoseList{
background:#5EA8DD;
}

.workList.chitoseList li.active{
	background:#5EA8DD;
}
.workList.chitoseList li a:hover{
	background:#004097;

}

.jobList{
	width: 100%;
	background: #004097;
	display: flex;
	justify-content: center;
	gap:1.041666666vw;;
	padding: 1.041666666vw 0;
	margin-bottom: 3.07291vw;
	  
}
.jobList li{
	font-weight: bold;
	text-align: center;
	font-size:0.9375vw;
	line-height: 2.50416666vw;
	border-radius: 20vw;
	background:#fff;
	/*border:solid #004097 0.052083vw;*/
}
.jobList li:hover{
	/*opacity: 0.75;*/
	background:rgba(255,255,255,0.75);
}
.jobList li:hover a{
	opacity: 1;
}
.jobList li a{
	display: inline-block;
	padding: 0 1.5625vw;
	height: 2.60416666vw;
	text-decoration: none;
	color: #004097;
	font-weight: 500;
	min-width:5.2083333vw;
	position:relative;
	user-select: none;

}

.jobList.chitoseList li a{
	color: #5EA8DD;
}

.jobList li a span img{
	width: 1.5625vw;
	position: absolute;
	right: 0.2604166vw;
	top: 50%;
	transform: translate(0,-50%);
}
article section.section_chitose_bike {
  margin-bottom: 4.21875vw;
}
.chitose-bike_logo {
  width: 7.5vw;
  margin: 0 auto;
  margin-bottom: 2.70833vw;
}

.chitose_works {
  width: 41.66666vw;
  color: #FFF;
  background-color: rgba(94, 168, 221, 1);
  border-radius: 2.60416vw;
  padding: 1.45833vw 2.39583vw 2.5vw;
  box-sizing: border-box;
}
.chitose_works p:nth-child(1) {
  font-size: 1.25vw;
  font-weight: 600;
  text-align: center;
  line-height: 1;
  margin-bottom: 0.83333vw;
}
.chitose_works p:nth-child(2) {
  font-size: 0.9375vw;
  font-weight: 400;
  text-align: left;
  line-height: 1.77777;
}
article section.section_workflow {
  margin-bottom: 4.0625vw;
}
.flow_wrapper {
  width: 41.66666vw;
  display: flex;
  justify-content: space-between;
}
.flow {
  width: 13.02083vw;
  height: auto;
  border: 1px solid rgba(94, 168, 221, 1);
  box-sizing: border-box;
  position: relative;
  padding: 1.77083vw calc(34vw /19.2) 1.82291vw;
}
.flow_num {
  width: 3.125vw;
  aspect-ratio: 1/1;
  border-radius: 3.125vw;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-style: italic;
  color: #FFF;
  font-size: 1.25vw;
  text-align: center;
  background-color: rgba(94, 168, 221, 1);
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-0.52083vw, -0.52083vw);
}
.flow_title {
  font-size: 0.9375vw;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  margin-bottom: 1.25vw;
  color: rgba(94, 168, 221, 1);
}
.flow_details {
  font-size: 0.83333vw;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
}
article section.section_businesscontent{
	margin-bottom: 4.16666vw;
}

.busicont {
  width: 41.66666vw;
  height: 5.20833vw;
  background-color: rgba(94, 168, 221, 1);
  border-radius: 5.20833vw;
  display: flex;
  box-sizing: border-box;
  padding: 1.04166vw;
  margin-bottom: 1.04166vw;
}
.busicont_title {
  background-color: #fff;
  color: rgba(94, 168, 221, 1);
  font-size: 0.9375vw;
  font-weight: 600;
  width: 9.375vw;
  height: 3.125vw;
  border-radius: 3.125vw;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0
}
.busicont_details {
  color: #fff;
  font-size: 0.83333vw;
  font-weight: 400;
  line-height: 1.5;
	margin: auto;
  margin-left: 1.25vw;
  margin-right: 1vw;
}
.linehack{
	margin-top:-0.5em;
}

.job_container{
	position: relative;
	margin-bottom: 5.20833vw;
}
.job_wrapper{
	filter: drop-shadow(0.26041vw 0.26041vw 0 #5EA8DD);
	transform: translateZ(0);
	box-sizing: border-box
}
.job_wrapper_border{
	width: 41.66666vw;
	height: auto;
	background-color:  rgba(94, 168, 221, 1);
	clip-path: polygon(
		calc(0% + 2.60416vw) 0%,
		100% 0%,
		100% calc(100% - 2.60416vw),
		calc(100% - 2.60416vw) 100%,
		0% 100%,
		0% calc(0% + 2.60416vw)
	);
	padding: 1px;
	box-sizing: border-box
}
.job_wrapper_inner{
	width: 100%;
	height: auto;
	background-color:#FFF;
	clip-path: polygon(
		calc(0% + 2.60416vw) 0%,
		100% 0%,
		100% calc(100% - 2.60416vw),
		calc(100% - 2.60416vw) 100%,
		0% 100%,
		0% calc(0% + 2.60416vw)
	);
	margin: auto;
	padding: 3.125vw 2.60416vw 2.5vw;
	box-sizing: border-box
}
.job_wrapper_inner img{
	/*float: left;
     width: 50%; */
    margin: 0 0 1.041666vw 0;
}
.job_name{
	font-size: 1.25vw;
	font-weight: 600;
	color: rgba(94, 168, 221, 1);
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%,-50%);
	padding:0 0.72916vw;
	line-height: 1;
	text-align: center;
	background-color: #fff;
	white-space: nowrap;
}

article section.section_g{
	width:  100%;
	background-color:#f0f0f0;
	padding: 3.64583vw 0 calc(54vw /19.2);
	text-align: center;
	margin-bottom: 6.45833vw;
}
.chitose-g_logo{
	width: 10.46875vw;
	margin: 0 auto;
	margin-bottom: calc(10vw /19.2);
	transform: translate(calc(-6vw /19.2));
}
.section_g a{	
	font-size: 0.83333vw;
    font-weight: 400;
	line-height: 1;
	text-align: center;
	font-weight: 500;
	/*background-image: url("../img/about/datamore_arrow.svg");
	background-position: right bottom;
	background-size: 1.5625vw;
	background-repeat: no-repeat;
	padding-right: 2.10937vw;
	margin-right: -2.10937vw;*/
	text-decoration: none;
	color: rgba(0,0,0,1.00);
	display: inline-block;
	margin-left: calc(40vw /19.2);
}

/*千歳商会*/
.chitose-g .mainimage{
  background-image: url("../img/works/main_works.png");
}

.chitose-g .chitose-bike_logo {
  width: 10.46875vw;
  margin-bottom: 2.60416vw;
}

.chitose-g .chitose_works {
   background-color: #004097;
}
.chitose-g .flow {
  border: 1px solid #004097;
}
.chitose-g .flow_num {
  background-color: #004097;
}
.chitose-g .flow_title {
  color: #004097;
}

.chitose-g .busicont {
  background-color: #004097;
}
.chitose-g .busicont_title {
  color: #004097;
}
.chitose-g .job_wrapper{
	filter: drop-shadow(0.26041vw 0.26041vw 0 #004097);
	transform: translateZ(0);
}
.chitose-g .job_wrapper_border{
	background-color:#004097;
}
.job_wrapper_inner{
font-size: 0.833333vw;
line-height: 2;
}
	
.chitose-g .job_name{
	color:#004097;
}
.chitose-g .chitose-g_logo{
	width: 7.5vw;
	margin: 0 auto;
	margin-bottom: 0.83333vw;
}

@media screen and (max-width: 767.98px) {
	#figure1 {
  		width: 11.70483vw;
  		top: 19.84732vw;
  		left: 14.75826vw;
	}
	#figure2 {
  		width: 8.14249vw;
  		top: 33.07888vw;
  		left: 76.59033vw;
	}
	.mainimage {
  		margin-bottom: 12.72264vw;
  		background-image: url("../img/works/main_works_sp.png");
 		aspect-ratio: 393/300;
	}

	.workList{
	width: 100%;
	display: flex;
	justify-content: center;
	padding: 0;
}
.workList li{
	/*border: #ffffff 0.15625vw solid;*/
	background: #f0f0f0;
	color: #004097;
	font-weight: bold;
	text-align: center;
	font-size:4.0712468193vw;
	line-height:10.178117vw;
		width: 50%;
}
.workList li.active{
	width: 50%;
	line-height:10.178117vw;
	background: #004097;
	color: #fff;

}
.workList li a{
		width: 100%;
	display: inline-block;
	text-decoration: none;
	color: #004097;
	font-weight: 500;

}
.workList li a:hover{
	background:#5EA8DD;
	color:#fff;
}

.jobList.chitoseList{
background:#5EA8DD;
}
.jobList.chitoseList li img{
	opacity: 0.6;

}
.workList.chitoseList li.active{
	background:#5EA8DD;
}
.workList.chitoseList li a:hover{
	background:#004097;

}

.jobList{
	background: #004097;
	display: flex;
	justify-content: center;
	padding: 5.08905vw;
	margin-bottom: 12.72264vw;
	flex-direction: column;
	gap:3.07291vw;;
	width: auto;
}
.jobList li{
	font-weight: bold;
	text-align: center;
	font-size:4.580152671vw;
	line-height: 10.178117vw;
	border-radius: 20vw;
	background:#fff;
	/*border:solid #004097 0.052083vw;*/
}
.jobList li:hover{
	opacity: 0.75;
}

.jobList li a{
	display: block;
	padding: 0 1.5625vw;
	line-height: 10.178117vw;
	text-decoration: none;
	color: #004097;
	height: auto;
	font-weight: 500;
	min-width:5.2083333vw;
	position:relative;
	user-select: none;
	width: auto;

}

.jobList.chitoseList li a{
	color: #5EA8DD;
}

.jobList li a span img{
	width: 7.6350534351145vw;
	position: absolute;
	right: 1.2722652993vw;
	top: 50%;
	transform: translate(0,-50%);
}
	article section.section_chitose_bike {
  		margin-bottom: 13.74045vw;
	}
	.chitose-bike_logo {
 		width: 36.38676vw;
  		margin-bottom: 7.63358vw;
	}
	.chitose_works {
 		width: 84.73282vw;
		border-radius: 7.63358vw;
		padding: 7.37913vw 5.08905vw 11.19592vw;
	}
	.chitose_works p:nth-child(1) {
  		font-size: 6.10687vw;
  		margin-bottom: 4.07124vw;
	}
	.chitose_works p:nth-child(2) {
  		font-size: 4.58015vw;
  		line-height: 1.77777;
	}
	
	article section.section_workflow {
  		margin-bottom: 13.74045vw;
	}
	.flow_wrapper {
  		width: 63.61323vw;
  		flex-direction: column;
		margin: 0 auto;
	}
	.flow {
  		width: 63.61323vw;
		height: auto;
  		padding: 8.65139vw 8.77862vw;
		margin:  0 auto;
		margin-bottom: 10.17811vw;
	}
	.flow:last-child{
		margin-bottom: 0;
	}
	.flow_num {
  		width: 15.26717vw;
  		aspect-ratio: 1/1;
  		border-radius: 15.26717vw;
  		font-size: 6.10687vw;
  		transform: translate(-2.54452vw, -2.54452vw);
	}
	.flow_title {
  		font-size: 4.58015vw;
  		margin-bottom: 6.10687vw;
	}
	.flow_details {
 		font-size: 4.07124vw;
	}
	
	article section.section_businesscontent{
		margin-bottom: 12.72264vw;
	}

	.busicont {
  		width: 84.73282vw;
  		height: auto;
		border-radius: 6.36132vw;
		flex-direction: column;
  		padding: 5.08905vw;
  		margin-bottom: 5.08905vw;
	}
	.busicont_title {
  		font-size: 4.58015vw;
  		font-weight: 600;
  		width: 100%;
  		height: 7.63358vw;
  		border-radius: 3.81679vw;
		margin-bottom: 4.45292vw;
  	}
	.busicont_details {
  		font-size: 4.07124vw;
  		display: block;
  		margin-left: 0;
		line-height:1.777777777777;
	}
	.busicont_details p{
		text-indent: -1.5em;
		padding-left: 1.5em;
	}

	.job_container{
		margin-bottom: 12.72264vw;
	}
	.chitose-g .job_wrapper{
		filter: drop-shadow(1.27226vw 1.27226vw 0 #004097);
		transform: translateZ(0);
	}
	.job_wrapper{
		filter: drop-shadow(1.27226vw 1.27226vw 0 #5EA8DD);
		transform: translateZ(0);
	}
	.job_wrapper_border{
		width: 84.73282vw;
		clip-path: polygon(
		calc(0% + 6.36132vw) 0%,
		100% 0%,
		100% calc(100% - 6.36132vw),
		calc(100% - 6.36132vw) 100%,
		0% 100%,
		0% calc(0% + 6.36132vw)
	);
	padding: 1px;
	box-sizing: border-box
}
.job_wrapper_inner{
	clip-path: polygon(
		calc(0% + 6.36132vw) 0%,
		100% 0%,
		100% calc(100% - 6.36132vw),
		calc(100% - 6.36132vw) 100%,
		0% 100%,
		0% calc(0% + 6.36132vw)
	);
	font-size: 4.07124681vw;
	padding: 5.59796vw 5.08905vw 9.1603vw;
}
.job_wrapper_inner .buttonApplication{
	width: calc(260vw /3.93);

}
.job_name{
	font-size: 6.10687vw;
	padding:0 3.05343vw;
}

article section.section_g{
	width:  100%;
	background-color:#f0f0f0;
	padding: 17.55725vw 0 14.75826vw;
	text-align: center;
	margin-bottom: 24.68193vw;
}
.chitose-g_logo{
	width: 51.14503vw;
	margin: 0 auto;
	margin-bottom: 3.81679vw;
}
.section_g a{	
	font-size: 4.07124vw;
	background-size: 7.63358vw;
	padding-right: 10.68702vw;
	margin-right: -10.68702vw;
}
	
	/*千歳商会*/
	.chitose-g .mainimage {
  		background-image: url("../img/works/main_works2_sp.png");
	}
	.chitose-g .chitose-bike_logo {
 		width: 51.14503vw;
  		margin-bottom: 7.63358vw;
	}
	.chitose-g .chitose-g_logo{
		width: 36.38676vw;
		margin-bottom: 4.07124vw;
	}
}