@charset "UTF-8";

:root {
	--colorBk: #000;
	--colorWh: #fff;
	--colorNv: #343399;
}

#list {
	padding: 110px 0 120px;
	ul {
		display: flex;
		justify-content: space-between;
		li {
			width: calc(calc(100% - 40px) / 3) ;
			text-align: center;
			background: #f5f5f5;
			border-radius: 5px;
			padding: 220px 50px 80px;
			position: relative;
			&::before {
				content: "";
				width: 88px;
				aspect-ratio: 88 / 120;
				background-repeat: no-repeat;
				background-position: left top;
				position: absolute;
				top: 80px;
				left: calc(50% - 44px);
			}
			&.tel::before {
				background-image: url(../images/contact/s_tel.svg);
			}
			&.form::before {
				background-image: url(../images/contact/s_form.svg);
			}
			&.recruit::before {
				background-image: url(../images/contact/s_recruit.svg);
			}
			.subtit {
				color: #636363;
			}
		}
	}
}
#form {
	padding: 0 0 120px;
	.bl1 {
		width: 805px;
		margin: 0 auto;
		dl {
			margin-bottom: 15px;
			dt {
				font-weight: 700;
				margin-bottom: 5px;
			}
			dd {
				margin-bottom: 30px;
			}
		}
	}
}

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

	#list {
		padding: 13vw 0;
		ul {
			display: block;
			li {
				width: 100%;
				margin-bottom: 5vw;
				padding: 5vw 10vw 5vw 30vw;
				position: relative;
				&::before {
					width: 15vw;
					position: absolute;
					top: calc(50%);
					left: 10vw;
					transform: translateY(-50%);
				}
			}
		}
	}
	#form {
		padding: 0 0 13vw;
		.midashiJa {
			font-size: 2rem;
		}
		.bl1 {
			width: 100%;
		}
	}

}