@charset "utf-8";

.seizen_wrap {
	width: 100%;
	margin: var(--cont-margin50) auto 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 450px), 1fr));
	gap: var(--cont-margin40);
	padding: var(--cont-margin30);
	background: #fff;
	border-radius: 16px;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
	overflow: hidden;
}

@media (max-width: 767.98px) {
	.seizen_wrap {
		display: flex;
		flex-direction: column-reverse;
		padding: 0;
		gap: 0;
		p {
			padding: var(--cont-margin20) var(--cont-margin30) var(--cont-margin30);
		}
	}
}

.onayami_list {
	position: relative;
	z-index: 1;
	width: min(90%,960px);
	margin: auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--cont-margin30);
	margin-top: var(--cont-margin50);
	li {
		font-size: 1.2rem;
		color: #fff;
		display: flex;
		align-items: center;
		line-height: 1.0;
	}
	li::before {
		content: "";
		display: block;
		width: fit-content;
		height: 1em;
		aspect-ratio: 173/150;
		background: url(../img/svg/icn_check_wh.svg) no-repeat center center / contain;
		margin-right: .5rem;
	}
}
@media (max-width: 1023.98px) {
	.onayami_list {
		width: fit-content;
		display: flex;
		flex-direction: column;
	}
}

/*
3つの理由
*/

.flow_wrap {
	margin-top: var(--cont-margin30);
	background: #fff;
	padding: var(--cont-margin30);
	border-radius: 16px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--cont-margin30);
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}
#flow .container > div:nth-of-type(2) {
	margin-top: var(--cont-margin50);
}

.flow_box dt {
	font-size: var(--font-l);
	color: var(--base-color01);
	padding-bottom: var(--cont-margin10);
	border-bottom: 1px solid var(--base-color01);
	margin-bottom: var(--cont-margin20);
	display: flex;
	align-items: center;
	span {
		background: var(--base-color01);
		padding: 5px 10px;
		border-radius: 16px;
		line-height: 1.0;
		font-size: .85rem;
		color: #fff;
		margin-right: var(--cont-margin10);
	}
}


@media (max-width: 767.98px) {
	.flow_wrap {
		grid-template-columns: 1fr;
		padding: 0;
		gap: 0;
		overflow: hidden;
	}
	.flow_box {
		order:2;
		padding: var(--cont-margin20) var(--cont-margin30) var(--cont-margin30);
	}
	.flow_img { order:1; }
}

