@charset "utf-8";

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
症例写真 一覧
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- ページヘッダー
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.page-header-img {
	object-position: 45% center;
}

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- カテゴリ
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.case-category {
	padding-bottom: initial;
}

.case-category-ul {
	display: flex;
	gap: 10px;
	flex-flow: wrap;
}

.case-category-li a {
	display: block;
	padding: 0.3em 1.4em;
	border: 1px solid var(--color_text);
	border-radius: 100vw;
}

.case-category-li._current a,
.case-category-li a:hover {
	background: var(--color_text);
	color: #fff;
}

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- メイン
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.case-post-li {
	margin-bottom: 60px;
}

.case-post-li .content {
	display: grid;
	row-gap: 30px;
}

.case-beforeafter-ul {
	display: block;
}

.case-about .heading_large,
.case-risk .heading_large {
	font-size: 16px;
}

.case-post-li .button {
	margin-inline: auto;
}

@media (min-width: 768px) {
.case-post-li .content {
	grid-template-columns: 48% 47%;
	justify-content: space-between;
}

.service-price-table tbody {
	grid-template-columns: minmax(auto, 420px);
}

.case-post-li .button {
	min-width: 400px;
}

.post-page-ul {
	justify-content: center;
}
}