@charset "UTF-8";

.h3_ttl {
	font-size: 60px;
	font-weight: 700;
	color: #D71318;
	line-height: 0.8;
}

.h3_ttl .h3_tiny {
	font-size: 18px;
	font-weight: 700;
	color: #313131;
}

@media (max-width: 840px) {
	.h3_ttl {
		font-size: 44px;
	}

	.h3_ttl .h3_tiny {
		font-size: 16px;
		font-weight: 700;
		color: #313131;
	}
}
.company-inner{
	width: 90%;
	max-width: 1200px;
	margin: 0 auto 120px;
	padding: 80px 50px 62px;
	background-color: #FFFFFF;
}
@media (max-width: 640px) {
	.company-inner{
		width: 90%;
		margin: 0 auto 80px;
		padding: 50px 30px 50px;
		background-color: #FFFFFF;
	}
	
}
@media (max-width: 400px) {
	.company-inner{
		width: 90%;
		margin: 0 auto 50px;
		padding: 30px 15px 30px;
		background-color: #FFFFFF;
	}
	
}



/*-----------------------------------

	recruit_block

-----------------------------------*/


#mainvisual_block{
	background: url(../img/company/main-img.jpg) no-repeat top center / cover;
}

.outline-text {
	max-width: 1112.1px;
	aspect-ratio: 1112.1 / 153.11;
	background-image: url(../img/company/outline-txt.svg);
}




/*-----------------------------------

	representative_block

-----------------------------------*/
#representative{
	margin: 0 auto;
	padding: 120px 0 80px;
}
/*.representative-wrap{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	gap: 60px;
}
.representative-img{
	max-width: 460px;
	aspect-ratio: 460 / 295;
}
.representative-img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}*/
.representative-txt{
	flex: 1;
	/*max-width: 580px;
	min-width: 250px;*/
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 2;
}
.representative-txt p{
	width: 100%;
}
.representative-txt p.name{
	margin-top: 30px;
    text-align: right;
}

@media (max-width: 840px) {
	#representative{
		padding: 70px 0;
	}
	/*.representative-wrap{
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
	}*/
	.representative-txt{
		width: 100%;
	}
}
@media (max-width: 640px) {
	#representative{
		padding: 40px 0;
	}
	/*.representative-img{
		aspect-ratio: auto;
		height: 250px;
		overflow: hidden;
	}
	.representative-wrap{
		gap: 30px;
	}*/
	.representative-txt{
		font-size: 15px;
	}

	.representative-txt p.name{
		margin-top: 25px;
	}
}
/*@media (max-width: 400px) {
	.representative-img{
		height: 200px;
	}
	.representative-wrap{
		gap: 20px;
	}
}*/

/*-----------------------------------

	company-profile_block

-----------------------------------*/
#company-profile{
	border-top: 2px solid #C8C8C8;
	position: relative;
	padding: 20px 0 120px;
}
#company-profile::before{
	content: "";
	width: 30px;
	height: 2px;
	background-color: #D71318;
	position: absolute;
	top: -2px;
	left: 0;
}
#company-profile h4{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 50px;
	font-weight: 700;
	line-height: 1.4;
	margin-bottom: 60px;
}
.info-table { 
	width: 100%; 
	border-collapse: collapse; 
	table-layout: fixed;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	line-height: 1.5;
	font-weight: 400;
	border-top: 1px solid #C8C8C8;
	box-sizing: border-box;
} 
.info-table th, .info-table td { 
	border-bottom: 1px solid #C8C8C8;
	padding: 33px 0 33px 30px;
	vertical-align: top; 
} 
.info-table th { 
	width: 192px;	
	background: #F3F3F3; 
	text-align: left; 
	font-weight: 700;
} 
.info-table td { 
	background: #FFFFFF; 
}
.inner-table { 
	width: 100%; 
	border-collapse: collapse; 
}
.inner-table tr:nth-child(1) td{
	padding-bottom: 20px;
}
.inner-table th{
	width: fit-cntent;
	margin-right: 30px;
}
.inner-table td {
	border: none;
	padding: 0;
}
.table-wrap{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	gap: 70px;
}
a.pdf-link{
	color: #D71318;
	width: fit-content;
	text-decoration: underline;
	padding-right: 30px;
	position: relative;
}
a.pdf-link::after{
	content: "";
	width: 20px;
	height: 22px;
	background: url(../img/company/pdf-icon.svg) no-repeat center center / contain;
	position: absolute;
	top: 0;
	right: 0;

}


@media (max-width: 840px) {
	#company-profile{
		padding: 20px 0 100px;
	}
	.info-table th { 
		width: 130px;	
		background: #F3F3F3; 
		text-align: left; 
		font-weight: 700;
	} 
	.table-wrap{
		gap: 30px;
	}
}
@media (max-width: 640px) {
	#company-profile{
		padding: 20px 0 80px;
	}
	#company-profile h4{
		font-size: 30px;
		margin-bottom: 30px;
	}
	.info-table{
		font-size: 14px;
	}
	.info-table, .info-table tr, .info-table th, .info-table td { 
		display: block; 
		width: 100%;
		box-sizing: border-box;
	}
	.info-table td { 
		border: none; 
	} 
	.info-table tr { 
		border-bottom: 1px solid #C8C8C8; 
	}
	.info-table th, .info-table td { 
		padding: 15px 20px;

	}
	.info-table th { 
		border: none; 
	} 
	.inner-table tr:nth-child(2) td{
		padding-bottom: 20px;
	}
	.inner-table tr:nth-child(2) td:last-of-type{
		padding-bottom: 0;
	}
	.inner-table td,  .inner-table tr{
		border: none;
		padding: 0;
	}
	
}
@media (max-width: 400px) {
	.table-wrap{
		gap: 20px;
	}
}

/*-----------------------------------

	history_block

-----------------------------------*/
#history{
	border-top: 2px solid #C8C8C8;
	position: relative;
	padding-top: 20px;
	box-sizing: border-box;
}
#history::before{
	content: "";
	width: 30px;
	height: 2px;
	background-color: #D71318;
	position: absolute;
	top: -2px;
	left: 0;
}
#history h4{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 50px;
	font-weight: 700;
	line-height: 1.4;
	margin-bottom: 60px;
}
.timeline {
  list-style: none;
}
.timeline ul{
	width: 60%;
	position: relative;
}
/* 縦線 */
.timeline ul::before {
  content: "";
  position: absolute;
  top: 38px;
  bottom: 155px;
  left: 75px;
  width: 2px;
	height: calc(100% - 38px);
  background: #D71318;
  z-index: 1;
}
.timeline ul li p{
	padding: 0 0 20px 40px;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
}
.c1966, .c1967, .c1968, .c1969, .c1970, .c2003, .c2011, .c2016, .c2026{
	padding: 28px 0 0;
	position: relative;
	padding-left: 75px;
	overflow: hidden;
}
.c1966::after, .c1967::after, .c1968::after, .c1969::after, .c1970::after, .c2003::after, .c2011::after{
	content: "";
	width: 100%;
	height: 1px;
	background-image: repeating-linear-gradient(90deg, #c8c8c8, #c8c8c8 2px, transparent 2px, transparent 4px);
  	background-position: left bottom;
  	background-repeat: repeat-x;
  	background-size: 100% 1px;
	position: absolute;
	bottom: 0;
	left: 75px;
	right: 0;
}
.c1966 p, .c1967 p, .c1968 p, .c1969 p, .c1970 p, .c2003 p, .c2011 p, .c2016 p, .c2026 p{
	position: relative;
}
.c1966 p::before, .c1967 p::before, .c1968 p::before, .c1969 p::before, .c1970 p::before, .c2003 p::before, .c2011 p::before, .c2016 p::before, .c2026 p::before{
	content: "";
	width: 11px;
	height: 11px;
	background-color: #D71318;
	border-radius: 50%;
	position: absolute;
	top: 3px;
	left: -5px;
	z-index: 2;
}
.c1966::before{
	content: "1966";
}
.c1967::before{
	content: "1967";
}
.c1968::before{
	content: "1968";
}
.c1969::before{
	content: "1969";
}
.c1970::before{
	content: "1970";
}
.c2003::before{
	content: "2003";
}
.c2011::before{
	content: "2011";
}
.c2016::before{
	content: "2016";
}
.c2026::before{
	content: "2026";
}
.c1966::before, .c1967::before, .c1968::before, .c1969::before, .c1970::before, .c2003::before, .c2011::before, .c2016::before, .c2026::before{
	font-family: "Outfit", sans-serif;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.3;
	color: #D71318;
	position: absolute;
	top: 26px;
	left: 0;
}
.c1966, .c1967, .c1970, .c2016, .c2026{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	gap: 40px;
}
.history-img{
	width: 40%;
	
	height: 480px;
	/*background-color: #E9E9E9;*/
}
@media (max-width: 840px) {
	.timeline ul{
		width: 100%;
	}
	.history-img{
		max-width: 440px;
		width: 100%;
		margin: 20px auto 0;
	}
	.c1966, .c1967, .c1970, .c2016, .c2026{
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-justify-content: flex-start;
		justify-content: flex-start;
		-webkit-align-items: flex-start;
		align-items: flex-start;
		gap: 0;
	}
}

@media (max-width: 640px) {
	#history h4{
		font-size: 30px;
		margin-bottom: 20px;
	}
	.timeline ul li p{
		padding: 0 0 20px 30px;
		font-size: 15px;
	}
	.timeline ul::before {
	  top: 38px;
	  bottom: 200px;
	  left: 60px;
	  width: 2px;
	  background: #D71318;
	  z-index: 1;
	}
	.c1966::after, .c1967::after, .c1968::after, .c1969::after, .c1970::after, .c2003::after, .c2011::after{
		left: 60px;
	}
	.c1966, .c1967, .c1968, .c1969, .c1970, .c2003, .c2011, .c2016, .c2026{
		padding-left: 60px;
	}
	.c1966::before, .c1967::before, .c1968::before, .c1969::before, .c1970::before, .c2003::before, .c2011::before, .c2016::before, .c2026::before{
		top: 28px;
		left: 0;
	}
	.c1966 p::before, .c1967 p::before, .c1968 p::before, .c1969 p::before, .c1970 p::before, .c2003 p::before, .c2011 p::before, .c2016 p::before, .c2026 p::before{
		top: 6px;
	}
}







/*-----------------------------------

	message_block

-----------------------------------*/
#message{
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 118px 0 93px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
	align-items: center;
	gap: 40px;
}
.low-title-box03{
	display: -webkit-flex;
	display: flex;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
	align-items: center;
	gap: 20px;
	margin-bottom: 0;
}
.low-title-box03 .low-sub-title03{
	font-size: 14px;
	font-weight: 700;
	font-family: "Outfit";
	color: #D71318;
}
.low-title-box03 h4{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 50px;
	font-weight: 700;
	line-height: 1.4;
}
.low-title-box03 h4 span{
	font-size: 56px;
	font-weight: 700;
	font-family: "Outfit";
	line-height: 1.3;
	letter-spacing: 0.06em;
	color: #E53B3F;
	margin-right: 13px;
}
.message-txt{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 2.5;
	letter-spacing: 0.05em;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
	align-items: center;
	gap: 40px;
	text-align: center;
}
.message-txt p span{
	color: #D71318;
}
@media (max-width: 840px) {
	#message{
		padding: 80px 0;
	}
}
@media (max-width: 640px) {
	#message{
		padding: 50px 0;
		gap: 30px;
	}
	.low-title-box03{
		gap: 5px;
	}
	.low-title-box03 .low-sub-title03{
		font-size: 12px;
	}
	.low-title-box03 h4{
		font-size: 30px;
	}
	.low-title-box03 h4 span{
		font-size: 36px;
		margin-right: 5px;
	}
	.message-txt{
		gap: 20px;
		font-size: 15px;
		line-height: 2;
	}
}
@media (max-width: 400px) {
	.sp400{
		display: none;
	}
}


/*-----------------------------------

	transportation_block

-----------------------------------*/
#transportation{
	padding-bottom: 120px;
}

.low-title-box02{
	display: -webkit-flex;
	display: flex;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
	align-items: center;
	gap: 9px;
	margin-bottom: 60px;
}
.low-title-box02 .low-sub-title02{
	font-size: 14px;
	font-weight: 700;
	font-family: "Outfit";
	color: #D71318;
}
.low-title-box02 h4{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 50px;
	font-weight: 700;
	line-height: 1.4;
}


@media (max-width: 640px) {
	#transportation{
		padding-bottom: 80px;
	}
	.low-title-box02{
		gap: 5px;
		margin-bottom: 40px;
	}
	.low-title-box02 .low-sub-title02{
		font-size: 12px;
	}
	.low-title-box02 h4{
		font-size: 30px;
	}
}
@media (max-width: 400px) {
	#transportation{
		padding-bottom: 50px;
	}
}

/*-----------------------------------

	recruitment-requirements_block

-----------------------------------*/
#recruitment-requirements{
	border-top: 2px solid #C8C8C8;
	position: relative;
	padding-top: 20px;
}
#recruitment-requirements::before{
	content: "";
	width: 30px;
	height: 2px;
	background-color: #D71318;
	position: absolute;
	top: 0;
	left: 0;
}
#recruitment-requirements h4{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 50px;
	font-weight: 700;
	line-height: 1.4;
	margin-bottom: 60px;
}
.info-table { 
	width: 100%; 
	border-collapse: collapse; 
	table-layout: fixed;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	line-height: 1.5;
	font-weight: 400;
	border-top: 1px solid #C8C8C8;
	box-sizing: border-box;
} 
.info-table th, .info-table td { 
	border-bottom: 1px solid #C8C8C8;
	padding: 33px 0 33px 30px;
	vertical-align: top; 
} 
.info-table th { 
	width: 192px;	
	background: #F3F3F3; 
	text-align: left; 
	font-weight: 700;
} 
.info-table td { 
	background: #FFFFFF; 
}
.inner-table { 
	width: 100%; 
	border-collapse: collapse; 
}
.inner-table tr:nth-child(1) td{
	padding-bottom: 20px;
}
.inner-table th{
	width: fit-cntent;
	margin-right: 30px;
}
.inner-table td {
	border: none;
	padding: 0;
}
.btn-wrapper {
	margin-top: 60px;
	width: 100%;
    display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
}
a.entry-btn{
	width: 360px;
	height: 70px;
    position: relative;
    display: inline-block;
    background-color: #D71318;
    color: #FFFFFF;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 18px;
	line-height: 1.4;
	font-weight: 700;
    text-decoration: none;
    overflow: hidden;
    transition: color 0.3s ease;
    border: 1px solid #D71318;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
}
a.entry-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    z-index: 0;
}
.entry-btn span {
    position: relative;
    z-index: 1;
}
.entry-btn:hover::before {
    transform: translateX(0);
}

.entry-btn:hover {
    color: red;
}

@media (max-width: 840px) { 
	.info-table th { 
		width: 130px;	
		background: #F3F3F3; 
		text-align: left; 
		font-weight: 700;
}	 
}
@media (max-width: 640px) {
	#recruitment-requirements h4{
		font-size: 30px;
		margin-bottom: 30px;
	}
	.info-table{
		font-size: 14px;
	}
	.info-table, .info-table tr, .info-table th, .info-table td { 
		display: block; 
		width: 100%;
		box-sizing: border-box;
	}
	.info-table td { 
		border: none; 
	} 
	.info-table tr { 
		border-bottom: 1px solid #C8C8C8; 
	}
	.info-table th, .info-table td { 
		padding: 15px 20px;

	}
	.info-table th { 
		border: none; 
	} 
	.inner-table tr:nth-child(2) td{
		padding-bottom: 20px;
	}
	.inner-table tr:nth-child(2) td:last-of-type{
		padding-bottom: 0;
	}
	.inner-table td,  .inner-table tr{
		border: none;
		padding: 0;
	}
	.btn-wrapper {
		margin-top: 50px;
		width: 100%;
	}
	a.entry-btn{
		width: 300px;
		height: 70px;
		font-size: 15px;
	}
}

/*-----------------------------------

	about_block

-----------------------------------*/
#about_block {
	padding: 120px 0;
	overflow: hidden;
	position: relative;
	background-color: #F6F1F1;
}
.grid-container{
	width: 100%;
	display: grid; 
	grid-template-columns: 5% 20% 44% 23% 4%;
	grid-template-rows: 200px auto;
	row-gap: 120px;
	column-gap: 1%;
}
.about01-box{
	grid-column: 2 / 3;
	grid-row: 1 / 2;	
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-align-items: flex-start;
	align-items: flex-start;
}
.about01{	
	position: relative;
	left: -30px;
	z-index: 10;
	max-width: 292px;
	aspect-ratio: 292 / 194 ;
}
.about01 img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.about01::after{
	content: "";
	width: 100%;
	height: 100%;
	background-color: #F9EBEB;
	position: absolute;
	left: 106px;
	top: -80px;
	z-index: -1;
}
.about02-box{
	grid-column: 4 / 5;
	grid-row: 1 / 2;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-align-items: flex-start;
	align-items: flex-start;
}
.about02{
	position: relative;
	max-width: 346px;
	z-index: 10;
	aspect-ratio: 346 / 231 ;
}
.about02::after{
	content: "";
	width: 100%;
	height: 100%;
	background-color: #F9EBEB;
	position: absolute;
	right: 142px;
	top: -52px;
	z-index: -1;
}
.about02 img{
	width: 100%;
	height: 100%;	
	object-fit: cover;
}
.about03-box{
	grid-column: 2 / 3;
	grid-row: 2 / 3;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
	align-items: center;
}
.about03{
	position: relative;
	max-width: 310px;
	aspect-ratio: 310 / 245 ;
	z-index: 10;
}
.about03::after{
	content: "";
	width: 100%;
	height: 100%;
	background-color: #F9EBEB;
	position: absolute;
	right: 100px;
	top: 60px;
	z-index: -1;
}
.about03 img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.about04-box{
	grid-column: 4 / 5;
	grid-row: 2 / 3;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
	align-items: center;
}
.about04{
	position: relative;
	top: 27px;
	max-width: 317px;
	aspect-ratio: 317 / 212 ;
	z-index: 10;
}
.about04::after{
	content: "";
	width: 100%;
	height: 100%;
	background-color: #F9EBEB;
	position: absolute;
	right: 131px;
	top: -77px;
	z-index: -1;
}
.about04 img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.about-title-box{
	grid-column: 3 / 4;
	grid-row: 1 / 2;
	width: 100%;
	text-align: center;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-align-items: center;
	align-items: center;
	position: relative;
	top: 30px;
	z-index: 10;
}
.about-title{
	width: fit-content;
}
.about-title .outline{
	font-family: "Outfit", sans-serif;
	font-size: 80px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.3;
	color: #D71318;
	text-align: center;
}
.about-title .outline span{
	font-family: "Outfit", sans-serif;
	font-size: 80px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.3;
	color: transparent; 
	-webkit-text-stroke: 2px #D71318;
}
.about-txt-box{
	width: 100%;
	grid-column: 3 / 4;
	grid-row: 2 / 3;	
	text-align: center;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	position: relative;
	top: -50px;
	z-index: 10;
}
.about-txt{
	max-width: 600px;
}
@media (max-width: 960px) {
	#about_block {
		padding: 80px 0 120px;
	}
	.grid-container{
		width: 100%;
		display: grid; 
		grid-template-columns: 50% 46%;
		grid-template-rows:  auto auto 250px 250px;
		row-gap: 40px;
		column-gap: 4%;
	}
	.about01-box{
		grid-column: 1 / 2;
		grid-row: 3 / 4;	
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
	}
	.about01{	
		left: 0;
	}
	.about01::after{
		position: absolute;
		left: -50px;
		top: -50px;
		z-index: -1;
	}
	.about02-box{
		grid-column: 2 / 3;
		grid-row: 3 / 4;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
	}
	.about02::after{
		position: absolute;
		right: -100px;
		top: -50px;
		z-index: -3;
	}
	.about03-box{
		grid-column: 1 / 2;
		grid-row: 4 / 5;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: flex-start;
		justify-content: flex-start;
		-webkit-align-items: center;
		align-items: center;
	}
	.about03{
		top: 0;
	}
	.about03::after{
		content: "";
		width: 100%;
		height: 100%;
		background-color: #F9EBEB;
		position: absolute;
		right: 100px;
		top: 60px;
		z-index: -1;
	}
	.about04-box{
		grid-column: 2 / 3;
		grid-row: 4 / 5;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: flex-start;
		justify-content: flex-start;
		-webkit-align-items: center;
		align-items: center;
	}
	.about04{
		top: 0;
	}
	.about04::after{
		position: absolute;
		right: -50px;
		top: 50px;
		z-index: -1;
	}
	.about04 img{
		object-fit: cover;
	}
	.about-title-box{
		grid-column: 1 / 3;
		grid-row: 1 / 2;
		width: 100%;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: flex-end;
		justify-content: flex-end;
		-webkit-align-items: center;
		align-items: center;
		position: relative;
		top: 0;
		z-index: 10;
	}
	.about-txt-box{
		width: 100%;
		grid-column: 1 / 3;
		grid-row: 2 / 3;
		text-align: center;
		position: relative;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
		top: 0;
		z-index: 10;
	}
	.about-text{
		width: 90%;
	}
}
@media (max-width: 640px) {
	#about_block {
		padding: 50px 0;
	}
	.grid-container{
		row-gap: 20px;
	}
	.about-title .outline{
		font-family: "Outfit", sans-serif;
		font-size: 50px;
	}
	.about-title .outline span{
		font-family: "Outfit", sans-serif;
		font-size: 50px;
	}
	.about-text-box{
		padding: 0 50px;
	}
}
@media (max-width: 540px) {
	.grid-container{
		row-gap: 20px;
		grid-template-rows: auto auto 200px 200px;
	}
}
@media (max-width: 400px) {
	.grid-container{
		row-gap: 20px;
		grid-template-rows: auto auto 150px 150px;
	}
	#about_block {
		padding: 30px 0 40px;
	}
	.about01, .about02, .about03, .about04{
		aspect-ratio: auto;
		width: 100%;
		height: 150px;
	}
	
}

/*-----------------------------------

	our-strengths_block

-----------------------------------*/
#our-strengths{
	width: 100%;
	height: auto;
	padding-bottom: 85px;
	border-bottom: 1px solid #C8C8C8;
}
.low-title-box{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	gap: 20px;
	margin-bottom: 60px;
}
.low-title-box .low-sub-title{
	font-size: 14px;
	font-weight: 700;
	font-family: "Outfit";
	color: #D71318;
}
.low-title-box h4{
	font-family: "Noto Sans JP", sans-serif;
	font-size: 50px;
	font-weight: 700;
	line-height: 1.4;
}

/* --- PC：3カラム --- */ 
.cards { 
	display: grid; 
	grid-template-columns: repeat(3, 1fr); 
	gap: 31px; 
	max-width: 1200px; 
	margin: 0 auto; 
}
.card{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
	align-items: center;
	gap: 30px;
}
.card img { 
	width: 100%;
	height: 231px;
	object-fit: cover;
	display: block;
} 
.card-txt-wrap{
	flex: 1;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
}
.card-txt-wrap h5 { 
	color: #313131;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.4;
	padding: 0 0 20px 22px;
	position: relative;
} 
.card-txt-wrap h5::before{
	content: "";
	width: 2px;
	height: 100%;
	background-color: #D71318;
	position: absolute;
	top: 0;
	left: 0;
}
.card-txt {
	color: #313131;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 2;
	padding-left: 22px;
	position: relative;
	flex: 1;
} 
.card-txt::before{
	content: "";
	width: 2px;
	height: 100%;
	background-color: #C8C8C8;
	position: absolute;
	top: 0;
	left: 0;
}
/* --- タブレット：2カラム --- */
@media (max-width: 1024px) { 
	.cards { 
		grid-template-columns: repeat(2, 1fr); 
		column-gap: 32px;
		row-gap: 50px;
	}
	
}
/* --- スマホ：1カラム --- */
@media (max-width: 640px) {
	#our-strengths{
		padding-bottom: 50px;
	}
	.low-title-box{
		gap: 5px;
		margin-bottom: 40px;
	}
	.low-title-box .low-sub-title{
		font-size: 12px;
	}
	.low-title-box h4{
		font-size: 30px;
	}
	.cards { 
		grid-template-columns: 1fr; 
		row-gap: 40px;
	} 
	.card{
		gap: 20px;
	}
	.card-txt-wrap h5 { 
		font-size: 18px;
		padding: 0 0 10px 12px;
		position: relative;
	} 
	.card-txt-wrap h5::before{
		content: "";
		width: 2px;
		height: 100%;
	}
	.card-txt {
		color: #313131;
		font-family: "Noto Sans JP", sans-serif;
		font-size: 15px;
		font-weight: 400;
		line-height: 2;
		padding-left: 12px;
		position: relative;
		flex: 1;
	} 
	.card-txt::before{
		content: "";
		width: 2px;
		height: 100%;
	}
	
}
@media screen and (max-width: 400px) {
	.card img { 
		height: 200px;
		object-fit: cover;
		display: block;
	}	 
}

/*-----------------------------------

	attempt_block

-----------------------------------*/
#attempt{
	width: 100%;
	height: auto;
	padding: 120px 0 0;
}
#attempt .explanation{
	color: #313131;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 2;
	margin-bottom: 60px;
}
.wrap{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: center;
	align-items: center;
	gap: 60px;
}
.reverse-wrap{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	gap: 60px;
}
.normal-wrap{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	gap: 60px;
}
.wrap-txt{
	flex: 1;
	min-width: 200px;
	color: #313131;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 2;
}
.wrap-txt h5{
	color: #313131;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 28px;
	font-weight: 700;
	line-height: 1.4;
	margin-bottom: 32px;
	padding-left: 50px;
}
.wrap-txt h5.num01{	
	position: relative;
}
.wrap-txt h5.num02{
	position: relative;
}
.wrap-txt h5.num03{
	position: relative;
}
.wrap-txt h5.num04{
	position: relative;
}
.wrap-txt h5.num01::before{
	content: "01";
	font-family: "Outfit", sans-serif;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.3;
	color: #FFFFFF;
	background-color: #D71318;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.wrap-txt h5.num02::before{
	content: "02";
	font-family: "Outfit", sans-serif;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.3;
	color: #FFFFFF;
	background-color: #D71318;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.wrap-txt h5.num03::before{
	content: "03";
	font-family: "Outfit", sans-serif;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.3;
	color: #FFFFFF;
	background-color: #D71318;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.wrap-txt h5.num04::before{
	content: "04";
	font-family: "Outfit", sans-serif;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.3;
	color: #FFFFFF;
	background-color: #D71318;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.wrap-img{
	width: 60%;
	max-width: 460px;
	aspect-ratio: 460 / 295;
	overflow: hidden;
}
.wrap-img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.section-conclusion{
	text-align: center;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 2;
	margin-top: 50px;
}

@media (max-width: 1000px) {
	.reverse-wrap, .normal-wrap{
		gap: 40px;
	}
}
@media (max-width: 840px){
	.reverse-wrap, .normal-wrap{
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-justify-content: flex-start;
		justify-content: flex-start;
		-webkit-align-items: center;
		align-items: center;
	}
	.wrap-img{
		width: 80%;
		max-width: 460px;
		aspect-ratio: auto;
		height: 250px;
	}
}
@media (max-width: 640px){
	#attempt{
		padding: 50px 0 0;
	}
	.wrap{
		gap: 40px;
	}
	.wrap-txt{
		font-size: 15px;
		line-height: 2;
	}
	.wrap-txt h5{
		font-size: 18px;
		line-height: 1.4;
		margin-bottom: 20px;
		padding-left: 42px;
	}
	.wrap-txt h5.num01::before{	
		width: 32px;
		height: 32px;
	}
	.wrap-txt h5.num02::before{
		width: 32px;
		height: 32px;
	}
	.wrap-txt h5.num03::before{
		width: 32px;
		height: 32px;
	}
	.wrap-txt h5.num04::before{
		width: 32px;
		height: 32px;
	}
	.reverse-wrap, .normal-wrap{
		gap: 20px;
	}
	.section-conclusion{
		font-size: 14px;
	}
}
@media (max-width: 400px){
	.wrap-img{
		width: 100%;
		max-width: 460px;
		height: 200px;
	}
}

/*-----------------------------------

	cta_block

-----------------------------------*/
#cta_block .cta_wrap {
	display: flex;
	width: 100%;

}

#cta_block .left_box,
#cta_block .right_box {
	position: relative;
	width: 50%;
	height: 350px;
	overflow: hidden;
	/* ★これが重要！これがないと画像が隣の枠に被ります */
}

#cta_block a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	text-decoration: none;
	position: relative;
	z-index: 1;
}


#cta_block .left_box::before {
	content: "";
	/* linear-gradient を先頭に追加（rgbaの最後の0.3が30%の意味です） */
	background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(../img/index/cta_img_01.jpg);

	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
	z-index: -1;
}

#cta_block .right_box::before {
	content: "";
	/* こちらも同様にグラデーションを重ねます */
	background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(../img/index/cta_img_02.jpg);

	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
	z-index: -1;
}


#cta_block .arrow {
	position: absolute;
	right: 23px;
	bottom: 23px;
}


#cta_block h4 {
	color: #fff;
	font-size: 44px;
	font-weight: bold;
	letter-spacing: 0.1em;
	margin: 0;
}

#cta_block p {
	color: #fff;
	font-size: 18px;
	margin-top: 10px;
	font-weight: 700;
}


#cta_block a::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	width: 60px;
	height: 60px;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
}




#cta_block .left_box:hover::before,
#cta_block .right_box:hover::before {
	transform: scale(1.15);
}

@media (max-width: 840px) {

	#cta_block .left_box,
	#cta_block .right_box {
		height: 250px;
	}

	#cta_block a::after {
		width: 40px;
		height: 40px;
	}

	/* 矢印の位置やサイズ調整 */
	#cta_block .arrow {
		right: 15px;
		bottom: 15px;
		width: 10px;
		/* 必要であれば */
	}
}

@media (max-width: 640px) {
	#cta_block .cta_wrap {
		flex-direction: column;
	}

	#cta_block .left_box,
	#cta_block .right_box {
		width: 100%;
		height: 200px;
	}

	#cta_block h4 {
		font-size: 32px;
		letter-spacing: 0.05em;
	}

	#cta_block p {
		font-size: 14px;
	}

}