@charset "UTF-8";
/* ============================================
   施術親カテゴリ(diagnosis_cat)専用スタイル v2
   既存トーン: メイン #41b5b1 / アクセント #cec232 / 罫線 #ddd
   ※FAQは既存 .faq_area/.qaList マークアップを流用するため専用CSSなし
   ============================================ */

/* ---- 医師監修ブロック ---- */
.dg-supervisor {
	display: flex;
	align-items: center;
	gap: 20px;
	border: thin solid #41b5b1;
	border-radius: 8px;
	background-color: #f0f8f8;
	padding: 20px 24px;
}

@media (min-width: 769px) {
	.dg-supervisor {
		margin-top: 40px;
	}
}

@media (min-width: 0) and (max-width: 768px) {
	.dg-supervisor {
		margin-top: 8vw;
		padding: 4.2vw;
		gap: 3.7vw;
	}
}

.dg-supervisor__photo {
	flex-shrink: 0;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	overflow: hidden;
}

@media (min-width: 0) and (max-width: 768px) {
	.dg-supervisor__photo {
		width: 18.6vw;
		height: 18.6vw;
	}
}

.dg-supervisor__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.dg-supervisor__label {
	color: #41b5b1;
	font-weight: bold;
}

@media (min-width: 769px) {
	.dg-supervisor__label {
		font-size: 1.3rem;
	}
}

@media (min-width: 0) and (max-width: 768px) {
	.dg-supervisor__label {
		font-size: 3.2vw;
	}
}

.dg-supervisor__name {
	font-weight: bold;
	line-height: 1.5;
}

@media (min-width: 769px) {
	.dg-supervisor__name {
		font-size: 1.8rem;
	}
}

@media (min-width: 0) and (max-width: 768px) {
	.dg-supervisor__name {
		font-size: 4.26667vw;
	}
}

.dg-supervisor__title,
.dg-supervisor__date {
	color: #666;
	line-height: 1.6;
}

@media (min-width: 769px) {

	.dg-supervisor__title,
	.dg-supervisor__date {
		font-size: 1.3rem;
	}
}

@media (min-width: 0) and (max-width: 768px) {

	.dg-supervisor__title,
	.dg-supervisor__date {
		font-size: 3.2vw;
	}
}

/* ---- 導入セクション（リード直下） ---- */
@media (min-width: 769px) {
	.categoryArea .customPostArea.dg-lead {
		margin-top: 60px;
	}

	.categoryArea .customPostArea.dg-lead h2:first-child {
		margin-top: 0;
	}
}

@media (min-width: 0) and (max-width: 768px) {
	.categoryArea .customPostArea.dg-lead {
		margin-top: 10vw;
	}
}

/* ---- 子ページカードのアイキャッチ ---- */
.categoryArea .catList .catItem .dg-catThumb {
	display: block;
	margin-bottom: 16px;
	overflow: hidden;
}

.categoryArea .catList .catItem .dg-catThumb img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform 0.5s ease-in-out;
}

.categoryArea .catList .catItem .dg-catThumb:hover img {
	transform: scale(1.04);
}

/* ---- 特徴カードグリッド（[dg_features]/[dg_feature]） ---- */
.dg-features {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 32px 3%;
	margin-top: 56px;
}

.dg-features .item {
	border: 1px solid #eee;
	background: #fff;
}

.dg-features .item img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.dg-features .body {
	padding: 20px 24px 26px;
}

.dg-features .num {
	font-family: "Cormorant Infant", Georgia, serif;
	color: #cec232;
	font-size: 2.6rem;
	line-height: 1;
}

.dg-features h3 {
	font-size: 1.8rem;
	color: #3c4748;
	margin: 8px 0 10px;
	font-weight: 600;
	line-height: 1.5;
}

.dg-features h3 span {
	color: #41b5b1;
}

.dg-features .body>p:not(.num) {
	font-size: 1.35rem;
	line-height: 1.9;
	color: #555;
	margin: 0;
}

@media (min-width:0) and (max-width:768px) {
	.dg-features {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}

/* ---- お悩み別カード（[dg_solves]/[dg_solve]） ---- */
.dg-solve {
	margin-top: 48px;
}

.dg-solve .item {
	display: flex;
	gap: 28px;
	border: 1px solid #eee;
	background: #fff;
	margin-bottom: 20px;
	align-items: stretch;
}

.dg-solve .item img {
	width: 240px;
	min-width: 240px;
	object-fit: cover;
}

.dg-solve .body {
	padding: 22px 26px;
	flex: 1;
}

.dg-solve h3 {
	font-size: 1.8rem;
	color: #3c4748;
	font-weight: 600;
	margin: 0 0 8px;
	line-height: 1.5;
}

.dg-solve h3::before {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	background: #41b5b1;
	margin-right: 10px;
}

.dg-solve .body>p {
	font-size: 1.35rem;
	line-height: 1.9;
	color: #555;
	margin: 0;
}

.dg-solve .chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 14px;
}

.dg-solve .chips a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border: 1px solid #41b5b1;
	color: #41b5b1;
	padding: 7px 16px;
	font-size: 1.3rem;
	font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Noto Sans JP", sans-serif;
	font-weight: bold;
	transition: 0.3s;
}

.dg-solve .chips a::after {
	content: "›";
}

.dg-solve .chips a:hover {
	background: #41b5b1;
	color: #fff;
}

@media (min-width:0) and (max-width:768px) {
	.dg-solve .item {
		flex-direction: column;
		gap: 0;
	}

	.dg-solve .item img {
		width: 100%;
		min-width: 0;
		aspect-ratio: 16 / 7;
	}
}

/* ---- 症例カード（[dg_cases]／自動表示 共通） ---- */
.dg-caseItems {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 3%;
	margin-top: 48px;
}

.dg-caseItems .caseItem {
	width: 31.3%;
	border: 1px solid #eee;
	background: #fff;
}

.dg-caseItems .caseItem a {
	display: block;
}

.dg-caseItems .imgArea {
	position: relative;
	overflow: hidden;
	background: #f0f8f8;
}

.dg-caseItems .imgArea img {
	width: 100%;
	height: 100%;
}

.dg-caseItems .infoArea {
	padding: 16px;
}

.dg-caseItems .head {
	font-size: 1.5rem;
	line-height: 1.6;
	font-weight: 600;
	color: #3c4748;
	margin: 0;
}

.dg-caseItems .info {
	display: flex;
	font-size: 1.25rem;
	margin-top: 10px;
	border-top: 1px dashed #ddd;
	padding-top: 10px;
}

.dg-caseItems .info dt {
	color: #41b5b1;
	flex-shrink: 0;
}

.dg-caseItems .risk {
	font-size: 1.2rem;
	line-height: 1.7;
	color: #666;
	margin-top: 8px;
	font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Noto Sans JP", sans-serif;
}

@media (min-width:0) and (max-width:768px) {
	.dg-caseItems .caseItem {
		width: 100%;
		margin-bottom: 16px;
	}
}

/* ==== v2.9 修正: 表のはみ出し・余白・レスポンシブ ==== */

/* 比較表: 親ページのdg_lead/dg_body内のtableをコンテナ幅に収める */
.dg-lead table,
.dg-body table {
	width: 100% !important;
	max-width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	margin: 40px 0 16px;
	font-size: 1.35rem;
}

.dg-lead table th,
.dg-body table th,
.dg-lead table td,
.dg-body table td {
	padding: 16px 12px;
	vertical-align: top;
	word-break: break-word;
	white-space: normal;
	border-bottom: thin solid #ddd;
}

.dg-lead table tr:first-child th,
.dg-body table tr:first-child th {
	background: #41b5b1;
	color: #fff;
	text-align: center;
	line-height: 1.4;
}

.dg-lead table tr.bg,
.dg-body table tr.bg {
	background: #efefef;
}

.dg-lead table th,
.dg-body table th {
	color: #41b5b1;
	text-align: left;
}

.dg-lead table tr:first-child th {
	color: #fff;
}

@media (min-width:0) and (max-width:768px) {

	.dg-lead table,
	.dg-body table {
		font-size: 1.15rem;
	}

	.dg-lead table th,
	.dg-body table th,
	.dg-lead table td,
	.dg-body table td {
		padding: 10px 6px;
	}
}

/* セクション余白: h2間隔をサンプルHTMLと同等に */
.dg-lead h2,
.dg-body h2 {
	margin-top: 90px;
	padding-bottom: 15px;
	font-size: 2.6rem;
	font-weight: normal;
	letter-spacing: .06em;
	position: relative;
}

.dg-lead h2::before,
.dg-body h2::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: #ddd;
}

.dg-lead h2::after,
.dg-body h2::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100px;
	height: 1px;
	background: #cec232;
}

.dg-lead h2:first-child {
	margin-top: 40px;
}

.dg-lead p,
.dg-body p {
	margin-top: 16px;
	line-height: 2;
}

.dg-lead h3,
.dg-body h3 {
	font-size: 1.9rem;
	color: #41b5b1;
	margin: 44px 0 12px;
	font-weight: 600;
}

@media (min-width:0) and (max-width:768px) {

	.dg-lead h2,
	.dg-body h2 {
		font-size: 6.4vw;
		margin-top: 60px;
	}
}

/* 症例カード: 実画像(横長B/A合成)に合わせ固定比率を撤廃 */
.dg-caseItems .imgArea {
	aspect-ratio: auto;
	background: #f0f8f8;
}

.dg-caseItems .imgArea img {
	width: 100%;
	height: auto;
	object-fit: unset;
	display: block;
}

/* 監修ブロック: 資格行の余白 */
#superviser2.dg-supervisor .doctor .career {
	font-size: 1.35rem;
	color: #555;
	margin-top: 4px;
	line-height: 1.9;
}

#superviser2.dg-supervisor .doctor .doctor_link_more {
	margin-top: 12px;
	font-size: 1.35rem;
}

#superviser2.dg-supervisor .doctor .doctor_link_more a {
	color: #41b5b1;
	border-bottom: 1px solid #41b5b1;
}

@media (min-width:0) and (max-width:768px) {
	#superviser2.dg-supervisor {
		flex-direction: column;
		padding: 20px;
	}

	#superviser2.dg-supervisor .photo .ph,
	#superviser2.dg-supervisor .photo img {
		width: 160px;
		height: 192px;
		margin: 0 auto;
	}
}

/* ==== v3.0 修正: 共通CSSのflex化との干渉を打ち消す ==== */

/* 【表】共通CSSが .categoryArea .customPostArea table tr を display:flex にしているため、
   dg-lead / dg-body 内の表のみ通常のテーブル表示に戻す（legacyの既存表には影響させない） */
.categoryArea .customPostArea.dg-lead table,
.categoryArea .customPostArea.dg-body table,
.categoryArea .subArea .customPostArea.dg-lead table,
.categoryArea .subArea .customPostArea.dg-body table {
	display: table !important;
	width: 100% !important;
	max-width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}

.categoryArea .customPostArea.dg-lead table tr,
.categoryArea .customPostArea.dg-body table tr,
.categoryArea .subArea .customPostArea.dg-lead table tr,
.categoryArea .subArea .customPostArea.dg-body table tr {
	display: table-row !important;
	min-height: 0 !important;
	padding: 0 !important;
	border-bottom: thin solid #ddd;
	flex-direction: unset !important;
	align-items: unset !important;
	justify-content: unset !important;
}

.categoryArea .customPostArea.dg-lead table th,
.categoryArea .customPostArea.dg-lead table td,
.categoryArea .customPostArea.dg-body table th,
.categoryArea .customPostArea.dg-body table td,
.categoryArea .subArea .customPostArea.dg-lead table th,
.categoryArea .subArea .customPostArea.dg-lead table td,
.categoryArea .subArea .customPostArea.dg-body table th,
.categoryArea .subArea .customPostArea.dg-body table td {
	display: table-cell !important;
	vertical-align: top;
	padding: 16px 12px !important;
	word-break: break-word;
	border-bottom: none;
}

/* ヘッダー行の配色は共通CSS(teal)をそのまま利用。角ずれ防止のみ */
.categoryArea .customPostArea.dg-lead table tr:first-child th,
.categoryArea .customPostArea.dg-body table tr:first-child th {
	text-align: center;
	color: #fff;
}

/* 【特徴/悩み/チェック/プライバシー枠】共通CSSの
   .categoryArea .subArea .customPostArea>div { display:flex; align-items:center; margin:20px 0 }
   より詳細度を上げて、本来のレイアウトを強制 */
.categoryArea .subArea .customPostArea>div.dg-features {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr);
	gap: 32px 3%;
	align-items: stretch !important;
	justify-content: normal !important;
	margin: 56px 0 0 !important;
}

.categoryArea .subArea .customPostArea>div.dg-solve {
	display: block !important;
	margin: 48px 0 0 !important;
}

.categoryArea .subArea .customPostArea>div.dg-check {
	display: block !important;
	margin: 40px 0 0 !important;
}

.categoryArea .subArea .customPostArea>div.dg-privacy {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	align-items: stretch !important;
	margin: 48px 0 0 !important;
}

@media (min-width:0) and (max-width:768px) {
	.categoryArea .subArea .customPostArea>div.dg-features {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.categoryArea .subArea .customPostArea>div.dg-privacy {
		grid-template-columns: 1fr;
	}
}

/* ==== v3.1 修正 ==== */

/* 【SP: 比較表を横スクロールに】縦潰れ防止。tbodyをテーブル本体にして枠内スクロール */
@media (min-width:0) and (max-width:768px) {

	.categoryArea .customPostArea.dg-lead table,
	.categoryArea .customPostArea.dg-body table,
	.categoryArea .subArea .customPostArea.dg-lead table,
	.categoryArea .subArea .customPostArea.dg-body table {
		display: block !important;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		table-layout: auto !important;
	}

	.categoryArea .customPostArea.dg-lead table tbody,
	.categoryArea .customPostArea.dg-body table tbody,
	.categoryArea .subArea .customPostArea.dg-lead table tbody,
	.categoryArea .subArea .customPostArea.dg-body table tbody {
		display: table;
		width: auto;
		min-width: 100%;
	}

	.categoryArea .customPostArea.dg-lead table th,
	.categoryArea .customPostArea.dg-body table th,
	.categoryArea .subArea .customPostArea.dg-lead table th,
	.categoryArea .subArea .customPostArea.dg-body table th {
		min-width: 7.5em;
	}

	.categoryArea .customPostArea.dg-lead table td,
	.categoryArea .customPostArea.dg-body table td,
	.categoryArea .subArea .customPostArea.dg-lead table td,
	.categoryArea .subArea .customPostArea.dg-body table td {
		min-width: 10em;
	}
}

/* 【症例カード: 画像まわりの余白】共通CSSの.imgArea(width:100%;margin:auto)の影響で
   写真がカード上端に密着するため、カード内に均等な余白を設ける */
.dg-caseItems .caseItem .imgArea {
	width: auto !important;
	padding: 14px 14px 0;
	margin: 0 !important;
	background: #fff;
}

.dg-caseItems .caseItem .imgArea img {
	width: 100% !important;
	height: auto !important;
	margin: 0 auto;
	display: block;
}

/* 【症例のVIEW MORE中央寄せ】共通CSSの .customPostArea>div{display:flex;justify-content:space-between}
   が単独子要素を左に寄せるため、中央揃えを強制 */
.categoryArea .customPostArea.dg-cases>.viewMoreWrap,
.categoryArea .subArea .customPostArea.dg-cases>.viewMoreWrap,
.customPostArea.dg-cases>.viewMoreWrap {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	width: 100% !important;
	margin: 36px 0 0 !important;
}

/* ==== v3.2: SBC型構成の部品（メニュー型リスト・悩みチェック・流れ） ==== */

/* メニュー型施術リスト（新レイアウト時のcatList置き換え） */
.dg-menuList {
	list-style: none;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 4%;
	margin: 40px 0 0;
	padding: 0;
}

.dg-menuList li {
	border-bottom: 1px solid #e5e5e5;
}

.dg-menuList a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 22px 6px;
	transition: 0.3s;
}

.dg-menuList a:hover {
	background: #f4fafa;
}

.dg-menuList .name {
	font-size: 1.7rem;
	letter-spacing: 0.05em;
	color: #3c4748;
}

.dg-menuList .cap {
	display: block;
	font-size: 1.25rem;
	color: #888;
	margin-top: 4px;
	line-height: 1.7;
	font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Noto Sans JP", sans-serif;
}

.dg-menuList .arrow {
	color: #cec232;
	font-size: 2.6rem;
	flex-shrink: 0;
	font-family: "Cormorant Infant", serif;
	line-height: 1;
	transition: 0.3s;
}

.dg-menuList a:hover .arrow {
	transform: translateX(3px);
}

@media (min-width:0) and (max-width:768px) {
	.dg-menuList {
		grid-template-columns: 1fr;
	}
}

/* こんなお悩みチェックリスト（[dg_worries]） */
.dg-check {
	margin-top: 40px;
	background: #f9f9f5;
	border: 1px solid #f1efe6;
	padding: 32px 36px;
}

.dg-check ul {
	list-style: none;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px 32px;
	margin: 0;
	padding: 0;
}

.dg-check li {
	position: relative;
	font-size: 1.45rem;
	line-height: 1.8;
}

.dg-check li::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 2px;
	width: 22px;
	height: 22px;
	background: #41b5b1;
	color: #fff;
	font-size: 1.3rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (min-width:0) and (max-width:768px) {
	.dg-check {
		padding: 24px 20px;
	}

	.dg-check ul {
		grid-template-columns: 1fr;
	}
}

/* 施術の流れ（[dg_flow]） */
.dg-flow {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	margin-top: 48px;
}

.dg-flow .step {
	border: 1px solid #eee;
	background: #fff;
	padding: 20px 0;
	text-align: center;
}

.dg-flow .num {
	font-family: "Cormorant Infant", Georgia, serif;
	color: #cec232;
	font-size: 1.5rem;
	letter-spacing: 0.1em;
	margin: 0;
}

.dg-flow h3 {
	font-size: 1.5rem;
	font-weight: 600;
	color: #3c4748;
	margin: 6px 12px 8px;
	line-height: 1.5;
}

.dg-flow .step>p:not(.num) {
	font-size: 1.2rem;
	color: #666;
	line-height: 1.8;
	margin: 0 16px;
	text-align: left;
}

@media (min-width:0) and (max-width:768px) {
	.dg-flow {
		grid-template-columns: 1fr 1fr;
		gap: 12px;
	}
}

/* 共通CSSの .customPostArea>div flex化から新部品を保護 */
.categoryArea .subArea .customPostArea>div.dg-flow {
	display: grid !important;
	align-items: stretch !important;
	margin: 48px 0 0 !important;
}

/* v5.5: .dg-tabs も同様に保護。flexアイテム化すると中の .dg-tabNav が
   中身の幅までしか広がらず、タブの右端が本文・施術リストと揃わなくなる */
.categoryArea .subArea .customPostArea>div.dg-tabs {
	display: block !important;
}

/* ==== v3.4: タブ式メニュー（[dg_menu_tabs]）・料金テキスト廃止 ==== */
.dg-tabNav {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 40px;
}

.dg-tabBtn {
	appearance: none;
	border: 1px solid #41b5b1;
	background: #fff;
	color: #41b5b1;
	font-size: 1.35rem;
	font-weight: bold;
	font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Noto Sans JP", sans-serif;
	padding: 10px 18px;
	cursor: pointer;
	transition: 0.25s;
	letter-spacing: 0.05em;
}

.dg-tabBtn:hover {
	background: #eefafa;
}

.dg-tabBtn.is-active {
	background: #41b5b1;
	color: #fff;
}

/* JS有効時のみパネルを切替表示（無効時は全表示のまま＝クローラ/非JSも全リンク到達可能） */
.dg-tabs.is-js .dg-tabPanel {
	display: none;
}

.dg-tabs.is-js .dg-tabPanel.is-active {
	display: grid;
}

.dg-tabs .dg-tabPanel {
	margin-top: 24px;
}

@media (min-width:0) and (max-width:768px) {
	.dg-tabBtn {
		flex: 1 1 calc(33.3% - 8px);
		padding: 10px 6px;
		font-size: 1.2rem;
	}

	.dg-tabs.is-js .dg-tabPanel.is-active {
		display: grid;
		grid-template-columns: 1fr;
	}
}

/* ==== v3.5: タブ統合（選び方の説明文をタブ内へ） ==== */
.dg-tabs .dg-tabPanel {
	display: block;
}

.dg-tabs.is-js .dg-tabPanel {
	display: none;
}

.dg-tabs.is-js .dg-tabPanel.is-active {
	display: block;
}

.dg-tabDesc {
	margin: 24px 0 0;
	padding: 18px 22px;
	background: #f9f9f5;
	border-left: 3px solid #cec232;
	font-size: 1.4rem;
	line-height: 2;
	color: #3c4748;
}

.dg-tabPanel .dg-menuList {
	margin-top: 16px;
}

/* ==== v3.6: 動画セクション（[dg_movie]） ==== */
.dg-movie {
	max-width: 800px;
	margin: 40px auto 0;
}

.dg-movieWrap {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	background: #000;
}

.dg-movieWrap iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.dg-movieCap {
	margin-top: 12px;
	font-size: 1.3rem;
	color: #666;
	text-align: center;
	font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Noto Sans JP", sans-serif;
}

/* ==== v3.7: 施術の流れをタイムライン型に（PC/SPとも縦1列） ==== */
.dg-flow,
.categoryArea .subArea .customPostArea>div.dg-flow {
	display: block !important;
	max-width: 760px;
	margin: 48px auto 0 !important;
	grid-template-columns: none;
}

.dg-flow .step {
	position: relative;
	border: none;
	background: transparent;
	padding: 0 0 44px 76px;
	text-align: left;
	min-height: 56px;
}

/* 縦の接続ライン（最後のステップでは非表示） */
.dg-flow .step::before {
	content: "";
	position: absolute;
	left: 26px;
	top: 54px;
	bottom: 0;
	width: 2px;
	background: #cdebea;
}

.dg-flow .step:last-child {
	padding-bottom: 0;
}

.dg-flow .step:last-child::before {
	display: none;
}

/* 番号ノード */
.dg-flow .node {
	position: absolute;
	left: 0;
	top: 0;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: #41b5b1;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Cormorant Infant", Georgia, serif;
	font-size: 2rem;
	letter-spacing: 0.05em;
	box-shadow: 0 0 0 4px #f0f8f8;
}

.dg-flow .num {
	font-family: "Cormorant Infant", Georgia, serif;
	color: #cec232;
	font-size: 1.4rem;
	letter-spacing: 0.1em;
	margin: 0;
}

.dg-flow h3 {
	font-size: 1.9rem;
	font-weight: 600;
	color: #3c4748;
	margin: 4px 0 8px;
	line-height: 1.5;
}

.dg-flow .body>p:not(.num) {
	font-size: 1.35rem;
	color: #666;
	line-height: 1.9;
	margin: 0;
	text-align: left;
}

@media (min-width:0) and (max-width:768px) {
	.dg-flow .step {
		padding: 0 0 36px 60px;
	}

	.dg-flow .step::before {
		left: 21px;
		top: 48px;
	}

	.dg-flow .node {
		width: 44px;
		height: 44px;
		font-size: 1.7rem;
	}

	.dg-flow h3 {
		font-size: 1.6rem;
	}
}

/* ==== v3.8: 選ばれる理由を市松（交互）レイアウトに（SBC REASON型・個数可変） ==== */
.dg-features,
.categoryArea .subArea .customPostArea>div.dg-features {
	display: block !important;
	grid-template-columns: none;
	margin: 56px 0 0 !important;
}

.dg-features .item {
	position: relative;
	display: flex;
	align-items: center;
	gap: 5%;
	border: none;
	background: transparent;
	margin-bottom: 72px;
}

.dg-features .item:last-child {
	margin-bottom: 0;
}

/* 偶数番目は画像とテキストを反転（市松） */
.dg-features .item:nth-child(even) {
	flex-direction: row-reverse;
}

.dg-features .item img {
	width: 44%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	flex-shrink: 0;
}

.dg-features .body {
	flex: 1;
	padding: 0;
	position: relative;
	z-index: 1;
}

/* 大きなゴースト番号（SBCの01/02相当・金色の淡色） */
.dg-features .num {
	position: absolute;
	top: -0.55em;
	right: 0;
	font-family: "Cormorant Infant", Georgia, serif;
	font-size: 8rem;
	line-height: 1;
	color: rgba(206, 194, 50, 0.22);
	z-index: 0;
	pointer-events: none;
}

.dg-features .item:nth-child(even) .num {
	right: auto;
	left: 0;
}

.dg-features h3 {
	position: relative;
	display: inline-block;
	font-size: 2rem;
	font-weight: 600;
	color: #3c4748;
	line-height: 1.6;
	margin: 0 0 14px;
	padding-bottom: 10px;
}

.dg-features h3::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 64px;
	height: 2px;
	background: #cec232;
}

.dg-features h3 span {
	color: #41b5b1;
}

.dg-features .body>p:not(.num) {
	font-size: 1.4rem;
	line-height: 2;
	color: #555;
	margin: 0;
}

@media (min-width:0) and (max-width:768px) {

	.dg-features .item,
	.dg-features .item:nth-child(even) {
		flex-direction: column;
		gap: 16px;
		margin-bottom: 52px;
	}

	.dg-features .item img {
		width: 100%;
		aspect-ratio: 4 / 3;
	}

	.dg-features .num {
		font-size: 5.5rem;
		top: auto;
		bottom: 100%;
		right: 8px;
	}

	.dg-features .item:nth-child(even) .num {
		left: auto;
		right: 8px;
	}

	.dg-features h3 {
		font-size: 1.7rem;
	}
}

/* ==== v3.9: 症例カードの全文表示・カウンセリングCTA ==== */
.dg-caseItems .infoArea .info {
	display: block;
	margin-top: 8px;
	font-size: 1.25rem;
	line-height: 1.8;
}

.dg-caseItems .infoArea .info dt {
	font-weight: 600;
	color: #3c4748;
	display: inline;
}

.dg-caseItems .infoArea .info dd {
	display: inline;
	margin: 0;
	color: #555;
}

.dg-caseItems .infoArea .risk {
	margin-top: 8px;
	font-size: 1.2rem;
	line-height: 1.8;
	color: #777;
}

/* CTA（[dg_cta]） */
.dg-cta {
	margin: 72px auto 0;
}

.dg-ctaBand {
	display: inline-block;
	background: #3c5e5e;
	color: #fff;
	font-size: 1.9rem;
	letter-spacing: 0.08em;
	padding: 14px 36px;
	margin: 0 auto;
}

.dg-ctaImg {
	margin-top: -8px;
}

.dg-ctaImg img {
	width: 100%;
	display: block;
}

.dg-ctaText {
	margin-top: 24px;
	font-size: 1.5rem;
	line-height: 2.1;
	color: #3c4748;
}

.dg-ctaBtnWrap {
	margin-top: 28px;
}

.dg-ctaBtn {
	display: inline-flex;
	background: #41b5b1;
	color: #fff !important;
	font-size: 1.6rem;
	letter-spacing: 0.08em;
	padding: 18px 48px;
	border-radius: 999px;
	transition: 0.3s;
	box-shadow: 0 4px 14px rgba(65, 181, 177, 0.35);
}

.dg-ctaBtn:hover {
	transform: translateY(-2px);
}

@media (min-width:0) and (max-width:768px) {
	.dg-ctaBand {
		font-size: 1.45rem;
		padding: 12px 18px;
	}

	.dg-ctaBtn {
		font-size: 1.4rem;
		padding: 15px 30px;
		width: 90%;
		justify-content: center;
	}
}

/* ==== v4.0: CTAをマイアミ独自デザインに（フルワイド淡色背景＋金ボタン#cec232） ==== */
.dg-cta {
	/* コンテナを突き抜けるフルワイド背景 */
	width: 100vw;
	max-width: 100vw;
	margin: 88px 0 0 calc(50% - 50vw);
	background: linear-gradient(180deg, #f2faf9 0%, #eaf5f3 100%);
	padding: 64px 24px 72px;
	text-align: center;
}

.dg-ctaInner {
	max-width: 860px;
	margin: 0 auto;
}

/* 帯ボックスをやめ、明朝見出し＋金アクセントに */
.dg-ctaTitle,
.dg-ctaBand {
	display: block;
	background: none;
	color: #3c4748;
	font-size: 2.3rem;
	letter-spacing: 0.1em;
	line-height: 1.7;
	padding: 0 0 22px;
	margin: 0;
	position: relative;
}

.dg-ctaTitle::after {
	bottom: 0;
	transform: translateX(-50%);
	width: 64px;
	background: #cec232;
}

.dg-ctaTitle .gold {
	color: #b3a325;
}

.dg-ctaImg {
	margin-top: 32px;
}

.dg-ctaImg img {
	width: 100%;
	max-height: 400px;
	object-fit: cover;
	display: block;
}

.dg-ctaText {
	margin-top: 28px;
	font-size: 1.5rem;
	line-height: 2.2;
	color: #3c4748;
}

/* ボタン: #cec232ベース（鼻フルページのボタン系統の色味） */
.dg-ctaBtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: linear-gradient(180deg, #d9ce54 0%, #cec232 55%, #bfb322 100%);
	color: #fff !important;
	font-size: 1.6rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	padding: 19px 56px;
	border-radius: 12px;
	transition: 0.3s;
	box-shadow: 0 5px 16px rgba(179, 163, 37, 0.35);
}

.dg-ctaBtn:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(179, 163, 37, 0.45);
}

@media (min-width:0) and (max-width:768px) {
	.dg-cta {
		padding: 44px 18px 52px;
		margin-top: 64px;
	}

	.dg-ctaTitle,
	.dg-ctaBand {
		font-size: 1.65rem;
	}

	.dg-ctaBtn {
		width: 100%;
		font-size: 1.45rem;
		padding: 16px 20px;
	}
}

/* ==== v4.1: CTA微調整（四角基調・吹き出し見出し） ==== */
/* 見出し: 四角い吹き出しボックス（下向き三角つき） */
.dg-ctaTitle,
.dg-ctaBand {
	display: inline-block;
	background: #fff;
	border: 1px solid #e2e8e6;
	padding: 16px 40px;
	margin-bottom: 14px;
}

.dg-ctaTitle::after {
	content: "";
	position: absolute;
	bottom: -9px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	background: none;
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
	border-top: 9px solid #fff;
}

/* 吹き出しの枠線ぶんの三角（白三角の下に薄グレー三角を重ねる） */
.dg-ctaTitle::before {
	content: "";
	position: absolute;
	bottom: -10.5px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #e2e8e6;
}

/* ボタン: 角丸を抑えて四角基調に */
.dg-ctaBtn {
	border-radius: 3px;
}

@media (min-width:0) and (max-width:768px) {

	.dg-ctaTitle,
	.dg-ctaBand {
		padding: 13px 18px;
	}
}

/* ==== v4.3 修正 ==== */

/* 【CTAの横スクロール解消】width:100vwはスクロールバー幅を含みはみ出すため、
   左右ネガティブマージン方式のフルブリードに変更（中央ズレも同時に解消） */
.dg-cta,
.categoryArea .subArea .customPostArea>div.dg-cta {
	display: block !important;
	width: auto !important;
	max-width: none !important;
	margin: 88px calc(50% - 50vw) 0 !important;
}

@media (min-width:0) and (max-width:768px) {

	.dg-cta,
	.categoryArea .subArea .customPostArea>div.dg-cta {
		margin-top: 64px !important;
	}
}

/* 【選ばれる理由: 画像未入稿時の専用デザイン】
   市松レイアウトは画像前提のため、imgが無いitemは左金罫線のカード型で表示
   （img属性に画像URLを入れると自動で市松＝画像交互レイアウトになる） */
.dg-features .item:not(:has(img)) {
	display: block;
	background: #fbfbf7;
	border-left: 3px solid #cec232;
	padding: 26px 32px 28px;
	margin-bottom: 28px;
}

.dg-features .item:not(:has(img)) .num {
	position: static;
	display: block;
	font-size: 2rem;
	color: #cec232;
	margin-bottom: 6px;
	text-align: left;
	pointer-events: auto;
}

.dg-features .item:not(:has(img)) h3 {
	font-size: 1.8rem;
	padding-bottom: 8px;
}

.dg-features .item:not(:has(img)) .body {
	position: static;
}

/* 【症例カードのデザイン強化】簡素すぎる白カードを、枠・料金強調・リスク囲みで整える */
.dg-caseItems {
	gap: 28px 3%;
}

.dg-caseItems .caseItem {
	border: 1px solid #e2e5e4;
	background: #fff;
	transition: 0.3s;
}

.dg-caseItems .caseItem:hover {
	box-shadow: 0 6px 18px rgba(60, 94, 94, 0.12);
	transform: translateY(-2px);
}

.dg-caseItems .caseItem .imgArea {
	padding: 14px 14px 0;
}

.dg-caseItems .infoArea {
	padding: 16px 20px 22px;
}

.dg-caseItems .infoArea .head {
	font-size: 1.6rem;
	font-weight: 600;
	color: #3c4748;
	line-height: 1.6;
	padding-bottom: 10px;
	margin-bottom: 12px;
	position: relative;
}

.dg-caseItems .infoArea .head::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 44px;
	height: 2px;
	background: #cec232;
}

.dg-caseItems .infoArea .info {
	margin-top: 6px;
	font-size: 1.3rem;
}

.dg-caseItems .infoArea .info dt {
	color: #3c4748;
}

.dg-caseItems .infoArea .info dd {
	color: #41b5b1;
	font-weight: 600;
}

.dg-caseItems .infoArea .risk {
	margin-top: 14px;
	background: #f7f7f3;
	font-size: 1.15rem;
	line-height: 1.8;
	color: #777;
	text-align: left;
}

/* ==== v4.4 修正 ==== */

/* 【h2下線と直後の文章の間隔】タブメニュー等でpが下線に密着するのを解消 */
.categoryArea .customPostArea.dg-lead h2+p,
.categoryArea .customPostArea.dg-body h2+p,
.categoryArea .subArea .customPostArea.dg-lead h2+p,
.categoryArea .subArea .customPostArea.dg-body h2+p {
	margin-top: 26px !important;
}

/* 【表】交互背景を廃止して全行白・境界線のみ、ヘッダー文字を拡大 */
.categoryArea .customPostArea.dg-lead table tr.bg,
.categoryArea .customPostArea.dg-body table tr.bg,
.categoryArea .subArea .customPostArea.dg-lead table tr.bg,
.categoryArea .subArea .customPostArea.dg-body table tr.bg {
	background: #fff !important;
}

.categoryArea .customPostArea.dg-lead table tr:first-child th,
.categoryArea .customPostArea.dg-body table tr:first-child th,
.categoryArea .subArea .customPostArea.dg-lead table tr:first-child th,
.categoryArea .subArea .customPostArea.dg-body table tr:first-child th {
	font-size: 1.45rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	padding-top: 14px;
	padding-bottom: 14px;
}

/* 【症例カード】リスク囲みの背景色を廃止 → 上罫線の区切りのみに */
.dg-caseItems .infoArea .risk {
	background: none;
	padding: 12px 0 0;
	margin-top: 12px;
	border-top: 1px solid #ececec;
}

/* 【CTA吹き出し】白→メインカラー緑ベタに。文字は白、アクセントは淡金 */
.dg-ctaTitle,
.dg-ctaBand {
	background: #41b5b1;
	border: none;
	color: #fff;
}

.dg-ctaTitle::before {
	display: none;
}

.dg-ctaTitle::after {
	border-top-color: #41b5b1;
	bottom: -9px;
}

/* ==== v4.5 修正 ==== */
/* 監修枠: 角丸を廃止して四角に */
#superviser2,
#superviser2.dg-supervisor,
#superviser2 .photo img,
#superviser2 .photo .ph {
	border-radius: 0 !important;
}

/* 症例カードの枠線を濃く */
.dg-caseItems .caseItem {
	border-color: #b9c6c4;
}

/* CTA吹き出し: 文字を全部白・太字に */
.dg-ctaTitle,
.dg-ctaBand {
	font-weight: 600;
}

.dg-ctaTitle .gold {
	color: #fff;
}

/* ==== v4.8: [dg_banner]でdg_body内に移動したバナーの中央寄せ・余白 ====
   共通CSSのバナー指定はページ上部（container直下）前提のため、
   customPostArea内に置かれた場合の表示をここで明示する */
.dg-body .diagnosis_cat_banner-section,
.categoryArea .subArea .customPostArea.dg-body .diagnosis_cat_banner-section {
	display: block !important;
	max-width: 800px;
	margin: 72px auto 0 !important;
	text-align: center;
}

.dg-body .diagnosis_cat_banner-section img,
.categoryArea .subArea .customPostArea.dg-body .diagnosis_cat_banner-section img {
	display: block !important;
	margin: 0 auto !important;
	max-width: 100% !important;
	height: auto;
}

.dg-body .diagnosis_cat_banner-text-section,
.categoryArea .subArea .customPostArea.dg-body .diagnosis_cat_banner-text-section {
	display: block !important;
	max-width: 760px;
	margin: 24px auto 0 !important;
	text-align: center;
	font-size: 1.4rem;
	line-height: 2;
}

.dg-body .diagnosis_cat_banner-button-section,
.categoryArea .subArea .customPostArea.dg-body .diagnosis_cat_banner-button-section {
	display: block !important;
	margin: 24px auto 0 !important;
	text-align: center;
}

.dg-body .diagnosis_cat_banner-button-section a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

@media (min-width:0) and (max-width:768px) {

	.dg-body .diagnosis_cat_banner-section,
	.categoryArea .subArea .customPostArea.dg-body .diagnosis_cat_banner-section {
		margin-top: 52px !important;
	}
}

/* ==== v5.0: CTAボタンをコンタクトエリア「カウンセリング予約」と同テイストに ====
   マスタード単色ベタ・角なし・影なし・白太字ゴシック（サイト既存ボタンとの統一） */
.dg-ctaBtn {
	background: #c3ba4a;
	border-radius: 0;
	box-shadow: none;
	text-shadow: none;
	font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Noto Sans CJK JP", "Noto Sans JP", sans-serif;
	font-weight: bold;
	font-size: 1.5rem;
	letter-spacing: 0.08em;
	padding: 22px 70px;
	transition: 0.3s;
}

.dg-ctaBtn:hover {
	opacity: 0.8;
	transform: none;
	box-shadow: none;
}

@media (min-width:0) and (max-width:768px) {
	.dg-ctaBtn {
		padding: 18px 20px;
		width: 90%;
	}
}

/* ==== v5.1 修正 ==== */

/* 【こんなお悩み】子ページ「こんな方におすすめ」と同型に再設計:
   淡teal帯フルワイド・左に明朝teal見出し・右に金丸ビュレット2列 */
.dg-check,
.categoryArea .subArea .customPostArea>div.dg-check {
	display: flex !important;
	align-items: center;
	gap: 6%;
	background: #edf5f5;
	border: none;
	margin: 48px calc(50% - 50vw) 0 !important;
	padding: 56px 8%;
	width: auto !important;
}

.dg-checkTtl {
	flex: 0 0 24%;
	font-size: 2rem;
	color: #41b5b1;
	letter-spacing: 0.12em;
	line-height: 1.9;
	margin: 0;
}

.dg-check ul {
	flex: 1;
	grid-template-columns: 1fr 1fr;
	gap: 20px 40px;
}

.dg-check li {
	padding-left: 22px;
	font-size: 1.4rem;
	line-height: 1.9;
}

.dg-check li::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #b9ae3c;
	top: 0.65em;
	font-size: 0;
}

@media (min-width:0) and (max-width:768px) {

	.dg-check,
	.categoryArea .subArea .customPostArea>div.dg-check {
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
		padding: 36px 24px;
	}

	.dg-checkTtl {
		flex: none;
		font-size: 1.7rem;
	}

	.dg-check ul {
		grid-template-columns: 1fr;
		gap: 14px;
	}
}

/* 【バナーボタン】CTAボタンと同テイスト（マスタード単色・角なし・影なし・白太字ゴシック） */
.dg-body .diagnosis_cat_banner-button-section a {
	background: #c3ba4a !important;
	background-image: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	text-shadow: none !important;
	color: #fff !important;
	font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Noto Sans CJK JP", "Noto Sans JP", sans-serif;
	font-weight: bold;
	letter-spacing: 0.08em;
	padding: 20px 56px;
	transition: 0.3s;
}

.dg-body .diagnosis_cat_banner-button-section a:hover {
	opacity: 0.8;
}

/* 【選ばれる理由の番号】共通CSSのp指定に負けて縮小していたのを修正（PC=ゴースト8rem復元） */
.dg-features .num,
.categoryArea .subArea .customPostArea .dg-features .num {
	font-size: 8rem !important;
	line-height: 1 !important;
	color: rgba(206, 194, 50, 0.22) !important;
	margin: 0 !important;
}

/* SP: 画像に重ならないよう、見出し上の静的表示に変更 */
@media (min-width:0) and (max-width:768px) {

	.dg-features .item .num,
	.dg-features .item:nth-child(even) .num,
	.categoryArea .subArea .customPostArea .dg-features .num {
		position: static !important;
		font-size: 2.4rem !important;
		color: #cec232 !important;
		text-align: left;
		margin: 4px 0 2px !important;
	}
}

/* ==== v5.2 修正 ==== */

/* 【選ばれる理由の番号/PC】見出しとの重なりを解消: 重ね表示をやめ見出しの上に配置 */
@media (min-width: 769px) {

	.dg-features .num,
	.dg-features .item:nth-child(even) .num,
	.categoryArea .subArea .customPostArea .dg-features .num {
		position: static !important;
		display: block;
		font-size: 5.5rem !important;
		line-height: 1 !important;
		color: rgba(206, 194, 50, 0.45) !important;
		text-align: left;
		margin: 0 0 10px !important;
	}
}

/* 【SPタブの縦幅統一】1行/2行ラベルで高さが揃うようmin-height+中央寄せ */
@media (min-width:0) and (max-width:768px) {
	.dg-tabNav {
		align-items: stretch;
	}

	.dg-tabBtn {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 56px;
		line-height: 1.5;
		padding: 6px 6px;
	}
}

/* ==== v5.4 / v5.5 修正 ==== */

/* 【バナー】既定位置（監修医ブロック直後）の余白。
   v5.4では全親に適用していたが、v5.5で .is-renewed（リライト済み親）限定に変更。
   未リライト親はバナーが治療一覧の上＝改修前の位置に戻ったため、この余白は当てない */
.diagnosis_cat_banner-section.is-renewed {
	margin-top: 48px;
}

@media (min-width:0) and (max-width:768px) {
	.diagnosis_cat_banner-section.is-renewed {
		margin-top: 32px;
	}
}

/* 【バナーボタン】CTAと同テイスト（マスタード単色・角なし・影なし・白太字ゴシック）。
   v5.4では無スコープで全親に当たっていたため、v5.5で .is-renewed 限定に変更。
   dg_body内に[dg_banner]で置いた場合は上の .dg-body 指定が担当する。
   未リライト親（婦人科形成・バスト・鼻）は従来のボタンデザインのまま */
.diagnosis_cat_banner-button-section.is-renewed a {
	/* v5.5: [dg_banner]位置（.dg-body側）と矢印SVGの配置を揃えるため inline-flex を明示 */
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #c3ba4a !important;
	background-image: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	text-shadow: none !important;
	color: #fff !important;
	font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Noto Sans CJK JP", "Noto Sans JP", sans-serif;
	font-weight: bold;
	letter-spacing: 0.08em;
	padding: 20px 56px;
	transition: 0.3s;
}

.diagnosis_cat_banner-button-section.is-renewed a:hover {
	opacity: 0.8;
}

/* 【FAQ一覧ボタン】子ページと同じ .listLinkBtn/.innBtn（common.css）を流用。PC側の上余白のみ補完 */
.customPostArea .listLinkBtn {
	margin-top: 40px;
}

.customPostArea .listLinkBtn .innBtn {
	max-width: 720px;
	padding: 18px 48px 18px 24px;
	font-size: 1.4rem;
	letter-spacing: 0.08em;
}


/* 【PCタブの幅統一】ラベル長でボタン幅がばらつき、最終行に1つだけ孤立するのを防ぐ。
   列数は [dg_menu_tabs] がタブ数から算出し、インラインの --dg-tabcols で渡す（既定3列）。
   SPは 893行〜/1852行〜 の3列指定が担当するため、769px以上にのみ適用（SPの表示は変更なし） */
@media (min-width:769px) {
	.dg-tabNav {
		display: grid;
		grid-template-columns: repeat(var(--dg-tabcols, 3), minmax(0, 1fr));
		align-items: stretch;
	}

	.dg-tabBtn {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 48px;
		line-height: 1.5;
		text-align: center;
	}
}


/* 【症例カードの件数対応】3件並びが基本のため、2件以下だと右に1枚分の空白が残り
   「読み込み失敗」に見える。件数に応じてカードを広げ、余白そのものをなくす。
   :has() 非対応ブラウザでは無視され、従来の左寄せ表示のままとなる（劣化しない） */
@media (min-width:769px) {

	/* 2件のとき: 2カラムに広げる */
	.dg-caseItems:has(.caseItem:nth-child(2):last-child) .caseItem {
		width: 48.5%;
	}

	/* 1件のとき: 幅は2カラム相当のまま中央に置く */
	.dg-caseItems:has(.caseItem:only-child) {
		justify-content: center;
	}

	.dg-caseItems:has(.caseItem:only-child) .caseItem {
		width: 48.5%;
	}
}


/* 【CTAの余白】画像とテキストの間が詰まって見えるため広げる。
   .customPostArea 内の p に対する共通CSSの指定が勝ってしまうため、詳細度を上げて上書きする */
.categoryArea .subArea .customPostArea .dg-cta .dg-ctaText {
	margin-top: 40px !important;
	margin-bottom: 0 !important;
}

.categoryArea .subArea .customPostArea .dg-cta .dg-ctaBtnWrap {
	margin-top: 36px !important;
}

@media (min-width:0) and (max-width:768px) {

	.categoryArea .subArea .customPostArea .dg-cta .dg-ctaText {
		margin-top: 32px !important;
	}

	.categoryArea .subArea .customPostArea .dg-cta .dg-ctaBtnWrap {
		margin-top: 32px !important;
	}
}

/* 選ばれる理由・施術の流れの本文: リード文・「鼻整形とは」と同じサイズに揃える
   （共通CSSの .categoryArea .customPostArea p = PC 1.6rem / SP 4.26667vw に合わせる） */
.dg-features .body>p:not(.num),
.dg-flow .body>p:not(.num) {
	font-size: 1.6rem;
	line-height: 2;
}

@media (min-width:0) and (max-width:768px) {

	.dg-features .body>p:not(.num),
	.dg-flow .body>p:not(.num) {
		font-size: 4.26667vw;
	}
}

/* 【見出し】共通CSSの .categoryArea .subArea .customPostArea h3 (1.6rem/width:100%) に
   負けて本文と同じ大きさになるため、詳細度を上げて本来の指定を復元する */
.categoryArea .subArea .customPostArea .dg-features h3 {
	font-size: 2rem;
	width: auto;
	margin: 0 0 14px;
}

.categoryArea .subArea .customPostArea .dg-flow h3 {
	font-size: 2rem;
	width: auto;
	margin: 4px 0 8px;
}

@media (min-width:0) and (max-width:768px) {

	.categoryArea .subArea .customPostArea .dg-features h3,
	.categoryArea .subArea .customPostArea .dg-flow h3 {
		font-size: 1.8rem;
	}
}

/* ==== 料金表（class="col-3" の3列表）の調整 ====
   PC: 料金列が余って施術内容が折り返すため列幅を明示する。
       table-layout:fixed では先頭行の幅が全列を決めるので、ヘッダーセルにのみ指定すれば足りる
   SP: 横スクロールは維持したまま、1列目と2列目に読める幅を確保する
       （table-layout:auto のため幅は % ではなく min-width で指定） */
:is(.dg-lead, .dg-body) table.col-3 tr:first-child th:nth-child(1) {
	width: 24%;
}

:is(.dg-lead, .dg-body) table.col-3 tr:first-child th:nth-child(2) {
	width: 58%;
}

:is(.dg-lead, .dg-body) table.col-3 tr:first-child th:nth-child(3) {
	width: 18%;
}

/* 表内の文字は本文(1.6rem)より一段小さくし、ヘッダーとセルを同じ大きさに揃える
   （ヘッダーは v4.4 で 1.45rem 指定があるため、同じ詳細度で後勝ちさせる） */
.categoryArea :is(.customPostArea.dg-lead, .customPostArea.dg-body) table :is(th, td),
.categoryArea .customPostArea.dg-lead table tr:first-child th,
.categoryArea .customPostArea.dg-body table tr:first-child th,
.categoryArea .subArea .customPostArea.dg-lead table tr:first-child th,
.categoryArea .subArea .customPostArea.dg-body table tr:first-child th {
	font-size: 1.5rem;
}

@media (min-width:0) and (max-width:768px) {

	.categoryArea :is(.customPostArea.dg-lead, .customPostArea.dg-body) table.col-3 :is(th, td):nth-child(1) {
		min-width: 11em;
	}

	.categoryArea :is(.customPostArea.dg-lead, .customPostArea.dg-body) table.col-3 :is(th, td):nth-child(2) {
		min-width: 20em;
	}

	.categoryArea :is(.customPostArea.dg-lead, .customPostArea.dg-body) table.col-3 :is(th, td):nth-child(3) {
		min-width: 7em;
		white-space: nowrap;
	}

	/* ヘッダー: 共通CSSの 4.8vw に負けるため、SP用にも明示して本文と揃える */
	.categoryArea .customPostArea.dg-lead table tr:first-child th,
	.categoryArea .customPostArea.dg-body table tr:first-child th,
	.categoryArea .subArea .customPostArea.dg-lead table tr:first-child th,
	.categoryArea .subArea .customPostArea.dg-body table tr:first-child th {
		font-size: 4.26667vw;
	}
}


/* 【選ばれる理由の画像/SP】カードの左右パディングで画像が内側に押し込まれ、
   本文より狭く見えるため、画像入りカードのみパディングを外して幅を揃える */
@media (min-width:0) and (max-width:768px) {

	.dg-features .item:has(img) {
		padding-left: 0;
		padding-right: 0;
	}
}