@charset "utf-8";

@media screen and (max-width: 767px){
	.page_inner figure{
		width: 200px;
	}
}


.content{
	margin-bottom: 6rem;
}

.main{
	width: var(--wid-1024);
	margin: auto;
	margin-bottom: 8rem;

	.text{
		font-size: 2.4rem;
		font-weight: 700;
	}
}

.case{
	width: var(--wid-1024);
	margin: auto;
	margin-bottom: 5rem;
}
.content .case:nth-last-child(1){
	margin-bottom: 0;
}
.sub{
	display: flex;
	gap: 3rem;
	margin-top: 4rem;

	h2{
		color: var(--main-color);
		font-size: 3.6rem;
		font-weight: 700;
	}

	h3{
    font-weight: bold;
		display: flex;
		align-items: center;
		gap: 1rem;
		white-space: nowrap;
		&::after{
			content: "";
			width: 100%;
			height: 1px;
			background: var(--main-color)
		}
	}
}

.sub_text,.sub_text--tt{
	display: flex;
	flex-direction: column;
	gap: 2rem;
	max-width: 502px;
	width: 100%;
}

.sub_text li{
	list-style: disc;
	margin-left: 1.2em;
}

.case figure{
	position: relative;
	top: -4rem;
	left: -2rem;
}

.sub_text--tt{
	margin-bottom: 3rem;
}

@media screen and (max-width: 767px){
	.sub{
		flex-direction: column-reverse;
		margin-top: 2rem;
		&.rev{
			flex-direction: column;
		}

		h2{
			font-size: 2.8rem;
		}
	}
	.sub_text{
		gap: 1rem;
	}
	.case{
		margin-bottom: 3rem;
	}
	.case figure{
		left: 0;
		top: 0;
	}

	.maphilighted{
		width: auto !important;
	}

	.main{
		margin-bottom: 0;
		.text{
			font-size: 1.8rem;
			padding: 2rem 0;
		}
	}
}