@charset "UTF-8";
/* DBSとは */

.p-dbs-section + .p-dbs-section { margin-top: 100px; }

/* ---------- DBS（脳深部刺激療法）とは ---------- */
.p-dbs-intro {
	display: grid;
	grid-template-columns: 499px 295px;
	grid-template-areas: "text fig";
	column-gap: 26px;
	align-items: start;
	margin-top: 22px;
}
.p-dbs-intro__figure { grid-area: fig; }
.p-dbs-intro__figure img { width: 295px; height: 330px; }
.p-dbs-intro__text { grid-area: text; margin-top: 0; }
.p-dbs-intro__more { margin-top: 41px; }

.p-dbs-box { padding: 22px 36px; }
.p-dbs-gap { margin-top: 22px; }

/* ---------- DBSの効果 ---------- */
.p-dbs-effect {
	display: grid;
	grid-template-columns: 521px 1fr;
	grid-template-areas:
		"text fig"
		"box  fig";
	grid-template-rows: auto 1fr;
	column-gap: 39px;
	margin-top: -15px;
}
.p-dbs-effect__text { grid-area: text; margin-top: 20px; }
.p-dbs-effect__figure { grid-area: fig; }
.p-dbs-effect__figure img { width: 248px; height: auto; }
.p-dbs-effect__caption {
	margin: 5px 0 0 6px;
	font-size: 10px;
	line-height: 15px;
	white-space: nowrap;
	color: var(--navy);
}
.p-dbs-effect__box.c-box {
	grid-area: box;
	align-self: start;
	width: 495px;
	margin-top: 40px;
	padding: 20px 27px 19px 13px;
}

/* ---------- 小見出しブロック ---------- */
.p-dbs-h3--hint { margin-bottom: 30px; font-size: 29px; }

/* ラベル（飲み薬／DBS、改善が期待できる症状／改善しにくい症状） */
.p-dbs-label.c-label {
	display: block;
	min-width: 0;
	min-height: 37px;
	padding: 3px 10px;
	font-weight: 500;
	font-size: 20px;
	line-height: 30px;
}

/* 薬とDBSの違い */
.p-dbs-compare { display: grid; gap: 22px; margin-top: 39px; }
.p-dbs-compare__item {
	padding: 25px 45px 40px 47px;
	border-radius: 10px;
	background: var(--gray-bg);
}
.p-dbs-compare__item .p-dbs-label { width: 321px; margin-left: -9px; }
.p-dbs-compare__text { margin-top: 31px; }

.p-dbs-box--3line { margin-top: 22px; padding: 28px 36px; }
.p-dbs-box--hint { margin-top: 33px; padding-left: 38px; }
.p-dbs-hint-last { margin-top: 33px; }

/* 改善が期待できる症状／改善しにくい症状 */
.p-dbs-symptoms {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: auto auto auto;
	column-gap: 27px;
	margin-top: 31px;
}
.p-dbs-symptoms__item {
	display: grid;
	grid-row: span 3;
	grid-template-rows: subgrid;
	align-content: start;
	padding: 30px 17px 44px;
	border-radius: 10px;
	background: var(--gray-bg);
	color: var(--navy);
}
.p-dbs-symptoms__label.c-label {
	justify-self: center;
	width: 100%;
	max-width: 332px;
	min-height: 40px;
	margin-bottom: 26px;
	padding-top: 4px;
}
.p-dbs-symptoms__list {
	font-weight: 700;
	font-size: 20px;
	line-height: 28px;
}
.p-dbs-symptoms__list li { position: relative; padding-left: 1em; }
.p-dbs-symptoms__list li::before { content: "・"; position: absolute; left: 0; }
.p-dbs-symptoms__text { margin-top: 14px; }

@media (max-width: 959px) {
	.p-dbs-section + .p-dbs-section { margin-top: 50px; }
	.l-lower__inner .p-dbs-sub { margin-top: 30px; }

	.p-dbs-intro {
		grid-template-columns: 1fr;
		grid-template-areas:
			"fig"
			"text";
		margin-top: 32px;
	}
	.p-dbs-intro__figure { justify-self: center; }
	.p-dbs-intro__text { margin-top: 32px; }
	.p-dbs-intro__more { margin-top: 30px; }

	.p-dbs-box { padding: 17px 15px; }
	.p-dbs-gap { margin-top: 30px; }

	.p-dbs-effect {
		grid-template-columns: 1fr;
		grid-template-areas:
			"text"
			"fig"
			"box";
		grid-template-rows: auto;
		margin-top: 15px;
	}
	.p-dbs-effect__text { margin-top: 0; }
	.p-dbs-effect__figure img { width: 100%; max-width: 361px; }
	.p-dbs-effect__box.c-box { width: auto; margin-top: 25px; padding: 16px 15px; }

	.p-dbs-h3--hint { margin-bottom: 16px; font-size: 24px; }
	.p-dbs-h3--sp-sm.c-h3 { margin-bottom: 15px; font-size: 20px; line-height: 1.2; }
	.p-dbs-h3--sp-sm + .c-text { margin-top: 15px; }

	.p-dbs-label.c-label { width: 291px; max-width: 100%; margin-inline: auto; }

	.p-dbs-compare { gap: 20px; margin-top: 29px; }
	.p-dbs-compare__item { padding: 28px 16px 24px; }
	.p-dbs-compare__item .p-dbs-label { width: 291px; margin-left: auto; }
	.p-dbs-compare__text { margin-top: 20px; }

	.p-dbs-box--3line { margin-top: 25px; padding: 16px 15px; }
	.p-dbs-box--3line + .p-dbs-gap { margin-top: 25px; }
	.p-dbs-box--hint { padding: 14px 15px 14px 16px; }
	.p-dbs-hint-last { margin-top: 25px; }

	.p-dbs-symptoms { grid-template-columns: 1fr; grid-template-rows: none; row-gap: 20px; margin-top: 30px; }
	.p-dbs-symptoms__item { display: block; grid-row: auto; padding: 28px 16px 20px; }
	.p-dbs-symptoms__label.c-label { max-width: 291px; min-height: 37px; margin: 0 auto 20px; padding-top: 3px; }
	.p-dbs-symptoms__list { font-size: 16px; line-height: 30px; }
	.p-dbs-symptoms__text { margin-top: 30px; }
}
