@charset "utf-8";
/*--------- sp ---------*/
main{
    background-image: url("../images/recruit/img_01.jpg");
    background-position: 70% top;
    background-size: auto 600px;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
.main_btn{
	max-width: 580px;
}
/*背景 sp*/
.bd_center{
	background-image: url("../images/recruit/png_01.png");
	background-size: 210% auto;
  overflow: hidden;
}
/*----- 会社を知る sp -----*/
.about{
	width: 90%;
	margin: 0 auto;
}
.about_img{
	padding-top: 20px;
}
.about_tx{
	padding-top: 20px;
}
/*----- 人を知る sp -----*/
.about_inner2{
	padding-top: 30px;
}
.about_img2{
	width: min(100%,600px);
	margin: 20px auto 0;
}
.about_img2 ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.about_img2 li {
	width: 30%;
	margin: 0 1% 3%;
	overflow: hidden;
	border-radius: 50%;
	aspect-ratio: 1 / 1;
}
.about_img2 li a:hover{
	opacity: 1;
}
.about_img2 li img{
	transition: .5s;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}
.about_img2 li:hover img{
	transform: scale(1.3);
	transition: .5s;
}
/*----- 採用を知る sp -----*/
.about_inner3{
	padding-top: 50px;
}
.about_img3{
	padding-top: 20px;
	width: min(70%,380px);
	margin: 0 auto;
}


@media (min-width:768px){
/*--------- tab ---------*/
	main{
		background-position: 20px top;
		background-size: 130% auto;		
	}
	/*背景 tab*/
	.bd_center{
		background-size: 130% auto;
	}
	/*----- 会社を知る tab -----*/
	.about_inner{
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-top: 50px;
	}
	.about_img{
		width: 45%;
		margin: 0;
		padding: 0;
	}

	.about_tx{
		width: 50%;
	}
	/*----- 人を知る tab -----*/
	.about_inner2{
		padding-top: 40px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
  .about_img2{
		width: min(50%,450px);
		margin: 0;
	}
  .about_img2 ul {
    justify-content: flex-start;
  }
  .about_img2 li {
    width: 31%;
	  margin: 2% 0 2% 2%;
  }

	/*----- 採用を知る tab -----*/
	.about_inner3{
		padding-top: 80px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.about_img3{
		padding-top: 0;
		width: min(30%,434px);
		margin: 0;
	}
	.about_tx3{
		width: 62%;
		order: 2;
	}
	
}

@media (min-width:1024px){
/*--------- pc ---------*/
	.main_btn{
		max-width: 620px;
	}

	/*----- 人を知る pc -----*/
	.about_inner2{
		padding-top: 90px;
		justify-content: flex-start;
	}
  .about_img2{
		width: min(60%,700px);
		padding-left: 0;
	}
  .about_img2 li {
    width: min(30%,200px);
    margin: 0 0 0 3%;
  }

	/*----- 採用を知る pc -----*/
	.about_inner3{
		padding-top: 9vw;
	}
	.about_img3{
		width: min(40%,434px);
	}
	.about_img3 img{
		margin-left: -30px;
	}
	.about_tx3{
		width: 54%;
	}

}

@media (min-width:1280px){
	main{
		background-position: left top;
		background-size: 110% auto;	
	}	
	/*背景 1280*/
	.bd_center{
		background-size: 100% auto;
	}
	.main_btn{
		max-width: 650px;
	}
	/*----- 会社を知る 1280 -----*/
	.about_inner{
		justify-content: flex-start;
		padding-top: 60px;
	}
	.about_img{
		width: 50%;
		padding-right: 5%;
	}
	.about_tx{
		width: 45%;
	}
  /*----- 人を知る 1280 -----*/
  .about_img2{
		width: 800px;
	}

	/*----- 採用を知る 1280 -----*/
	.about_inner3{
		padding-top: 100px;
		justify-content: flex-start;
	}
	.about_img3{
		width: min(40%,434px);
	}
	.about_img3 img{
		margin-left: -50px;
	}
	.about_tx3{
		width: 54%;
		margin-left: 2%;
	}

}

@media (min-width:1480px){
	/*----- 会社を知る 1480 -----*/
	.about_inner{
		padding-top: 70px;
	}
	
	/*----- 人を知る 1480 -----*/
	.about_inner2{
		padding-top: 120px;
	}
	
}
@media (min-width:1600px){

	
}