@charset "utf-8";
/* CSS Document */
.keyVisual{
	background-image: url("../img/keyvisual.jpg");
}
#sec_about{
	padding: 100px 0 98px;
	margin-bottom: 100px;
}

.underBox li{
	max-width: 465px;
	width: 49%;
	height: 260px;
	position: relative;
	background: rgba(35,24,21,1);
}
.underBox li a{
	display: flex;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	color: #fff;
	font-size: 1.8rem;
	width: 100%;
	height: 100%;
}
	.underBox li a h3{
		position: absolute;
		font-weight: 400;
	}
		.underBox li a h3 .txt{
			display: block;
			margin-top: 10px;
		}

	.underBox li a > img{
		opacity: 0.5;
		transition: 0.3s;
		object-fit: cover;
		width: 100%;
		height: 100%;
	}
	.underBox li a:hover > img{
		opacity: 0.8;
	}

@media screen and (max-width: 767px){
	.keyVisual{
		background-image: url("../img/keyvisual_sp.jpg");
	}
	#sec_about{
		padding: 60px 0 0;
		margin-bottom: 0;
	}

}
@media screen and (max-width: 600px){
	.underBox{
		display: block;
	}
	.underBox li{
		width: 100%;
		height: inherit;
		margin: 0 auto;
	}
	.underBox li + li{
		margin-top: 20px;
	}
}