@charset "utf-8";
/* CSS Document */

.about_intro_wrap .about_intro_inner{
	align-items:center;
	justify-content:space-between;
	gap:clamp(50px,7vw,100px);
}

.about_intro_wrap .txtbox{
	min-width:350px;
	flex-shrink:0;
}

.about_intro_wrap .img_area{
	width:calc(58% - clamp(50px,7vw,100px) / 2);
	flex:1;
	min-width:0;
	position:relative;
	min-height:clamp(420px,42vw,560px);
}


.about_intro_wrap .txtbox h2{
	line-height:1.7;
	letter-spacing:.12em;
}



.about_intro_wrap .about_en{
	position:absolute;
	right:0;
	top:clamp(20px,4vw,50px);
	z-index:4;
	font-size:clamp(64px,8vw,110px);
	line-height:1;
	letter-spacing:.06em;
	transform:rotate(-8deg);
	color:#333;
	text-shadow:
		2px 2px 0 #fff;

}

.about_intro_wrap .imgbox{
	position:absolute;
	overflow:hidden;
	border-radius:8px;
}

.about_intro_wrap .imgbox img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}
.about_intro_wrap .img1{
	left:0;
	top:0;
	width:50%;
	max-width:420px;
	aspect-ratio:.82 / 1;
	z-index:2;
}

.about_intro_wrap .img2{
	right:0;
	top:clamp(80px,9vw,130px);
	width:50%;
	max-width:420px;
	aspect-ratio:.78 / 1;
	z-index:3;
}
@media screen and (max-width:1080px){
	.about_intro_wrap .about_intro_inner{
		gap:clamp(30px,5vw,56px);
	}

	.about_intro_wrap .txtbox{
		width:calc(40% - clamp(30px,5vw,56px) / 2);
		min-width:300px;
	}

	.about_intro_wrap .img_area{
		width:calc(60% - clamp(30px,5vw,56px) / 2);
		min-height:clamp(340px,42vw,430px);
	}

	.about_intro_wrap .about_en{
		right:0;
		top:clamp(10px,3vw,26px);
		font-size:clamp(54px,7vw,82px);
	}

	.about_intro_wrap .img1{
	
		min-width:150px;
	}

	.about_intro_wrap .img2{
	
		min-width:180px;
		top:clamp(80px,12vw,130px);
	}
}
@media screen and (max-width:900px){
	.about_intro_wrap .about_intro_inner{
		flex-direction:column;
		align-items:center;
		gap:clamp(50px,8vw,70px);
	}

	.about_intro_wrap .img_area{
		order:1;
		width:100%;
		max-width:680px;
		min-width:0;
		min-height:clamp(420px,72vw,560px);
		margin:0 auto;
	}

	.about_intro_wrap .txtbox{
		order:2;
		width:100%;
		max-width:520px;
		min-width:0;
		margin:0 auto;
		text-align:left;
	}

	.about_intro_wrap .about_en{
		right:4%;
		top:clamp(10px,3vw,28px);
		font-size:clamp(72px,14vw,110px);
	}

	.about_intro_wrap .img1{

		top:0;
		width:48%;
		aspect-ratio:.82 / 1;
        
	}

	.about_intro_wrap .img2{
		right:4%;
		top:clamp(110px,20vw,170px);
		width:48%;
		aspect-ratio:.78 / 1;
	}
}

@media screen and (max-width:576px){


	.about_intro_wrap .img_area{
		min-height:clamp(360px,94vw,430px);
	}

	.about_intro_wrap .about_en{
		right:2%;
		top:0;
		font-size:clamp(58px,18vw,84px);
	}

	.about_intro_wrap .img1{
		left:0;
		width:50%;
	}

	.about_intro_wrap .img2{
		right:0;
		top:auto;
        bottom: 0;
		width:50%;
        min-width: 180px;
	}

	.about_intro_wrap .txtbox{
		max-width:100%;
	}
}
.commitment_wrap .commitment_list{
	justify-content:center;
	align-items:stretch;
	gap:24px 12px;
	padding-top:20px;
}

.commitment_wrap .commitment_item{
	position:relative;
	width:calc(100% / 4 - 12px * 3 / 4);
	background:#fff;
	border-radius:8px;
	padding:clamp(14px,4vw,24px) clamp(16px,2vw,24px) clamp(14px,4vw,24px);
	text-align:center;
    min-width: 224px;
}

.commitment_wrap .commitment_item .num{
	position:absolute;
	left:50%;
	top:-16px;
	transform:translateX(-50%);
	z-index:2;
	line-height:1;
	letter-spacing:.12em;
	font-size:clamp(22px,3vw,30px);
}

.commitment_wrap .commitment_item .line{
	position:relative;
	width:80px;
	height:2px;
	background:#333;
	margin:0 auto 22px;
}

.commitment_wrap .commitment_item .line::before,
.commitment_wrap .commitment_item .line::after{
	content:"";
	position:absolute;
	top:50%;
	width:6px;
	height:6px;
	border-radius:50%;
	background:#333;
	transform:translateY(-50%);
}

.commitment_wrap .commitment_item .line::before{
	left:-2px;
}

.commitment_wrap .commitment_item .line::after{
	right:-2px;
}

.commitment_wrap .commitment_item h3{
	line-height:1.7;
	letter-spacing:.08em;
	margin-bottom:18px;
	font-weight:600;
}

.commitment_wrap .commitment_item .txt{
	text-align:left;
	line-height:2;
	letter-spacing:.06em;
}

@media screen and (max-width:1080px){
	.commitment_wrap .commitment_list{
		flex-wrap:wrap;
		gap:30px 12px;
	}

	.commitment_wrap .commitment_item{
		width:calc(50% - 6px);
        max-width: 300px;
	}
}

@media screen and (max-width:576px){
	.commitment_wrap .commitment_list{
		gap:30px;
	}

	.commitment_wrap .commitment_item{
		width:100%;
	}
}

/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
}
/* ---------- 1280px ~ ---------- */
@media screen and (max-width: 1280px){
}
/* ---------- 1080px ~ ---------- */
@media screen and (max-width: 1080px){
}
/* ---------- 768px ~ ---------- */
@media screen and (max-width: 768px){
}
/* ---------- 576px ~ ---------- */
@media screen and (max-width: 576px){
}
/* ---------- 350px ~ ---------- */
@media screen and (max-width: 350px){
}