/* =========================================================
   生活習慣病外来ページ専用 スタイルシート
   ターゲットデザイン（濃い青・クッキリフォント・最適余白・親干渉完全シャットアウト）
   ========================================================= */

:root {
	--color-primary:        #1d6fb8;
	--color-primary-dark:   #14507f;
	--color-primary-light:  #e7f1fa;
	--color-accent:         #f7b500;
	--color-success:        #06c755;
	--color-warning:        #e67e22;
	--color-danger:         #c0392b;
	--color-text:           #333333;
	--color-text-sub:       #666666;
	--color-border:         #d9e3ec;
	--color-bg-soft:        #f5f9fc;
	--color-white:          #ffffff;
	--shadow-card:          0 4px 14px rgba(29, 111, 184, 0.08);
	--shadow-card-hover:    0 8px 24px rgba(29, 111, 184, 0.15);
	--radius-md:            8px;
	--radius-lg:            12px;
	--font-jp:              "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "Noto Sans JP", sans-serif;
}

/* 修正点: 親テーマが持つmainタグの巨大な上部パディング（100px）を50pxへ強制クリア */
html body main,
html body #main,
html body .l-main,
html body [role="main"],
main {
	padding-top: 50px !important;
}

/* 全体コンテナのラップと親テーマの文字かすれ・フォント干渉リセット */
.p-markup .lifestyle-wrapper {
	box-sizing: border-box !important;
	max-width: 1000px !important;
	margin: 0 auto !important;
	padding: 0 0 0px 0 !important;
	font-family: var(--font-jp) !important;
	color: var(--color-text) !important;
	line-height: 1.8 !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
}

.p-markup .lifestyle-wrapper *, 
.p-markup .lifestyle-wrapper *::before, 
.p-markup .lifestyle-wrapper *::after {
	box-sizing: inherit !important;
}

/* 親テーマの過剰な上下余白を強制クリア */
.p-markup .l-section {
	margin: 0 !important;
	padding: 0 !important;
}

/* 文字のかすれ・薄さを100%解消 */
.p-markup .lifestyle-wrapper p, 
.p-markup .lifestyle-wrapper td, 
.p-markup .lifestyle-wrapper dd, 
.p-markup .lifestyle-wrapper div,
.p-markup .lifestyle-wrapper li {
	color: var(--color-text) !important;
  line-height: 1.85 !important;
	font-weight: 400 !important;
}

@media not all and (max-width: 768px) {
	html body #page.site div.l-inner,
	html body div.l-inner,
	.l-inner {
		max-width: 1200px !important;
		width: 100% !important;
	}
	
	html body div#page.site div.l-inner div.l-main,
	html body div.l-inner div.l-main,
	html body .l-main,
	html body .lmain,
	.l-col2 .l-main,
	.l-main,
	.lmain {
		width: 1000px !important;
		max-width: 1000px !important;
		padding-top: 0 !important;
    padding-bottom: 0px;
	}
}

/* ---------------------------------------------------------
   セクション大見出し（親テーマ .p-markup h2 の角丸やパディングを完全粉砕）
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper h2.section-title {
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	width: 100% !important;
	font-size: 1.6rem !important;
	font-weight: 700 !important;
	color: var(--color-primary-dark) !important;
	border-left: 5px solid var(--color-primary) !important;
	padding: 14px 0 14px 16px !important;
	margin: 50px 0 20px !important;
	text-align: left !important;
	background: linear-gradient(to right, var(--color-primary-light) 0%, transparent 60%) !important;
	line-height: 1.4 !important;
}

/* 小見出し */
.p-markup .lifestyle-wrapper h3.subsection-title {
	font-size: 1.15rem !important;
	font-weight: 700 !important;
	color: var(--color-primary-dark) !important;
	margin: 35px 0 16px !important;
	padding: 0 0 0 12px !important;
	border: none !important;
	border-left: 3px solid var(--color-primary) !important;
	background: transparent !important;
	text-align: left !important;
}

.p-mokuji {
	max-width: 1000px !important;
}

.p-mokuji ul {
	padding: 20px 5px 10px;
}

/* ---------------------------------------------------------
   1. 生活習慣病外来について（イントロ・アラート）
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper .intro-lead {
	display: flex !important;
	gap: 18px !important;
	align-items: flex-start !important;
	background: linear-gradient(135deg, var(--color-primary-light) 0%, #f5f9fc 100%) !important;
	border: none !important;
	border-left: 5px solid var(--color-primary) !important;
	border-radius: var(--radius-md) !important;
	padding: 22px 0px 22px 24px !important;
	margin: 24px 0 20px !important;
	box-shadow: var(--shadow-card) !important;
	text-align: left !important;
}
.p-markup .lifestyle-wrapper .intro-lead-icon {
	flex-shrink: 0 !important;
	width: 52px !important;
	height: 52px !important;
	border-radius: 50% !important;
	background: var(--color-primary) !important;
	color: var(--color-white) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.p-markup .lifestyle-wrapper .intro-lead-icon svg {
	fill: none !important;
	stroke: var(--color-white) !important;
	stroke-width: 2 !important;
}
.p-markup .lifestyle-wrapper .intro-lead-text {
	margin: 0 !important;
	font-size: 0.98rem !important;
	line-height: 1.85 !important;
	color: var(--color-text) !important;
}

/* 警鐘カード（リスク強調） */
.p-markup .lifestyle-wrapper .risk-alert {
	background: #fff8e6 !important;
	border: 1px solid #ffe7a0 !important;
	border-left: 5px solid var(--color-accent) !important;
	border-radius: var(--radius-md) !important;
	padding: 22px 0px 22px 24px !important;
	margin: 24px 0 !important;
	display: grid !important;
	grid-template-columns: auto 1fr !important;
	row-gap: 12px !important;    /* 上下のアイコン・タイトルと、下の文章との隙間 */
	column-gap: 16px !important; /* 左右のアイコンとタイトルとの隙間 */
	align-items: center !important;
}
.p-markup .lifestyle-wrapper .risk-alert .alert-icon {
	flex-shrink: 0 !important;
	width: 40px !important;
	height: 40px !important;
	border-radius: 50% !important;
	background: var(--color-accent) !important;
	color: var(--color-white) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.p-markup .lifestyle-wrapper .risk-alert .alert-icon svg {
	fill: none !important;
	stroke: var(--color-white) !important;
	stroke-width: 2 !important;
}
.p-markup .lifestyle-wrapper .risk-alert .alert-body { display: contents !important; }
.p-markup .lifestyle-wrapper .risk-alert .alert-title {
	grid-column: 2 !important;
	grid-row: 1 !important;
	margin: 0 !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	color: var(--color-primary-dark) !important;
}
.p-markup .lifestyle-wrapper .risk-alert .alert-text {
	grid-column: 1 / -1 !important; /* 1列目（左端）から右端までワイドに広げる */
	grid-row: 2 !important;        /* 2行目に強制配置 */
	font-size: 0.9rem !important;
	line-height: 1.7 !important;
	color: var(--color-text) !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: none !important;
}

/* 警鐘カード2（リスク強調） */
.p-markup .lifestyle-wrapper .risk-alert2 {
	border-left: 5px solid var(--color-primary) !important;
	border-radius: var(--radius-md) !important;
	padding: 22px 0px 22px 24px !important;
	margin: 24px 0 !important;
	display: grid !important;
	grid-template-columns: auto 1fr !important;
	row-gap: 12px !important;    /* 上下のアイコン・タイトルと、下の文章との隙間 */
	column-gap: 16px !important; /* 左右のアイコンとタイトルとの隙間 */
	align-items: center !important;
}
.p-markup .lifestyle-wrapper .risk-alert2 .alert-icon {
	flex-shrink: 0 !important;
	width: 40px !important;
	height: 40px !important;
	border-radius: 50% !important;
	background: var(--color-primary) !important;
	color: var(--color-white) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.p-markup .lifestyle-wrapper .risk-alert2 .alert-icon svg {
	fill: none !important;
	stroke: var(--color-white) !important;
	stroke-width: 2 !important;
}
.p-markup .lifestyle-wrapper .risk-alert2 .alert-body { display: contents !important; }
.p-markup .lifestyle-wrapper .risk-alert2 .alert-title {
	grid-column: 2 !important;
	grid-row: 1 !important;
	margin: 0 !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	color: var(--color-primary-dark) !important;
}
.p-markup .lifestyle-wrapper .risk-alert2 .alert-text {
	grid-column: 1 / -1 !important; /* 1列目（左端）から右端までワイドに広げる */
	grid-row: 2 !important;        /* 2行目に強制配置 */
	font-size: 0.9rem !important;
	line-height: 1.7 !important;
	color: var(--color-text) !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: none !important;
}

/* ---------------------------------------------------------
   2. 4つの習慣マトリクス（カードの高さ100%完全自動同期）
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper .habit-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
	gap: 16px !important;
	margin: 26px 0 !important;
	align-items: stretch !important; /* 横並びカードの元々の高さを統一 */
}
.p-markup .lifestyle-wrapper .habit-card {
	background: var(--color-white) !important;
	border: 1px solid var(--color-border) !important;
	border-top: 4px solid var(--color-primary) !important;
	border-radius: var(--radius-md) !important;
	padding: 22px 18px !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease !important;
	display: flex !important;
	flex-direction: column !important;
	height: 100% !important; /* buttonやdivに関わらずGrid内の最大高さに完全同期 */
	text-align: left !important;
}
.p-markup .lifestyle-wrapper .habit-card:hover {
	transform: translateY(-3px) !important;
	box-shadow: var(--shadow-card-hover) !important;
}
.p-markup .lifestyle-wrapper .habit-card.eat   { border-top-color: #e67e22 !important; }
.p-markup .lifestyle-wrapper .habit-card.move  { border-top-color: #06c755 !important; }
.p-markup .lifestyle-wrapper .habit-card.smoke { border-top-color: #6c3a9e !important; }
.p-markup .lifestyle-wrapper .habit-card.drink { border-top-color: #1d6fb8 !important; }

.p-markup .lifestyle-wrapper .habit-head {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	margin-bottom: 14px !important;
}
.p-markup .lifestyle-wrapper .habit-icon {
	width: 44px !important;
	height: 44px !important;
	border-radius: 50% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
}
.p-markup .lifestyle-wrapper .habit-card.eat   .habit-icon { background: #fff0e0 !important; color: #c5651a !important; }
.p-markup .lifestyle-wrapper .habit-card.move  .habit-icon { background: #e7f8ee !important; color: #2a9d52 !important; }
.p-markup .lifestyle-wrapper .habit-card.smoke .habit-icon { background: #efe7f9 !important; color: #6c3a9e !important; }
.p-markup .lifestyle-wrapper .habit-card.drink .habit-icon { background: var(--color-primary-light) !important; color: var(--color-primary-dark) !important; }

.p-markup .lifestyle-wrapper .habit-icon svg {
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2 !important;
}
.p-markup .lifestyle-wrapper .habit-title {
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	color: var(--color-primary-dark) !important;
	margin: 0 !important;
}
.p-markup .lifestyle-wrapper .habit-disease-list {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	font-size: 0.88rem !important;
	line-height: 1.7 !important;
	color: var(--color-text-sub) !important;
	flex-grow: 1 !important; /* 箇条書き部分を最大まで引き伸ばし底辺を固定 */
}
.p-markup .lifestyle-wrapper .habit-disease-list li {
	position: relative !important;
	padding-left: 14px !important;
	margin-bottom: 4px !important;
}
.p-markup .lifestyle-wrapper .habit-disease-list li::before {
	content: "•" !important;
	position: absolute !important;
	left: 0 !important;
	color: var(--color-primary) !important;
	font-weight: 700 !important;
}

/* ---------------------------------------------------------
   3. パッケージ選びナビ（アンカーカードリンク）
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper .nav-cards {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important; /* 横並び2列に美しく固定 */
	gap: 18px !important;
	width: 100% !important;
	max-width: none !important;
	margin: 26px 0 !important;
}

.p-markup .lifestyle-wrapper .nav-card {
	background: var(--color-white) !important;
	border: 2px solid var(--color-primary) !important;
	border-radius: var(--radius-lg) !important;
	padding: 24px 22px !important;
	text-align: center !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	height: 100% !important;
	max-width: none !important;
}
.p-markup .lifestyle-wrapper .nav-card:hover {
	transform: translateY(-3px) !important;
	box-shadow: var(--shadow-card-hover) !important;
}
.p-markup .lifestyle-wrapper .nav-card .nav-num {
	width: 32px !important;
	height: 32px !important;
	border-radius: 50% !important;
	background: var(--color-primary) !important;
	color: var(--color-white) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-weight: 700 !important;
	margin-bottom: 12px !important;
}
.p-markup .lifestyle-wrapper .nav-card .nav-link {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	color: var(--color-primary) !important;
	font-weight: 700 !important;
	font-size: 0.88rem !important;
}
.p-markup .lifestyle-wrapper .nav-card .nav-link .arrow { transition: transform 0.2s ease !important; display: inline-block !important; }
.p-markup .lifestyle-wrapper .nav-card:hover .nav-link .arrow { transform: translateY(3px) !important; }

/* ---------------------------------------------------------
   4. パッケージカード（病気から選ぶ・習慣から選ぶ共通）
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper .package-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
	gap: 20px !important;
	margin: 26px 0 !important;
	align-items: stretch !important;
}
.p-markup .lifestyle-wrapper .package-card {
	background: var(--color-white) !important;
	border: 1px solid var(--color-border) !important;
	border-radius: var(--radius-lg) !important;
	padding: 24px 22px !important;
	box-shadow: var(--shadow-card) !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease !important;
	display: flex !important;
	flex-direction: column !important;
	height: 100% !important;
}
.p-markup .lifestyle-wrapper .package-card:hover {
	transform: translateY(-3px) !important;
	box-shadow: var(--shadow-card-hover) !important;
}
.p-markup .lifestyle-wrapper .package-head {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	margin-bottom: 14px !important;
}
.p-markup .lifestyle-wrapper .package-icon {
	width: 48px !important;
	height: 48px !important;
	border-radius: 12px !important;
	background: var(--color-primary-light) !important;
	color: var(--color-primary) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
}
.p-markup .lifestyle-wrapper .package-icon svg {
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2 !important;
}
.p-markup .lifestyle-wrapper .package-card.habit-pkg .package-icon {
	background: #fff4d6 !important;
	color: var(--color-warning) !important;
}
.p-markup .lifestyle-wrapper .package-title {
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	color: var(--color-primary-dark) !important;
	margin: 0 !important;
}
.p-markup .lifestyle-wrapper .package-subtitle {
	font-size: 0.78rem !important;
	color: var(--color-danger) !important;
	font-weight: 700 !important;
	margin: 4px 0 14px 0 !important;
	background: #fdecea !important;
	padding: 6px 10px !important;
	border-radius: var(--radius-md) !important;
	display: inline-block !important;
	text-align: left !important;
}
.p-markup .lifestyle-wrapper .package-items {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 0 20px 0 !important;
	flex-grow: 1 !important;
}
.p-markup .lifestyle-wrapper .package-items li {
	padding: 10px 0 !important;
	border-bottom: 1px dashed var(--color-border) !important;
	font-size: 0.9rem !important;
	display: flex !important;
	align-items: flex-start !important;
	gap: 8px !important;
	line-height: 1.5 !important;
	background: transparent !important;
}
.p-markup .lifestyle-wrapper .package-items li:last-child { border-bottom: none !important; }
.p-markup .lifestyle-wrapper .package-items li::before {
	content: "✓" !important;
	color: var(--color-primary) !important;
	font-weight: 700 !important;
	flex-shrink: 0 !important;
}
.p-markup .lifestyle-wrapper .item-name { font-weight: 600 !important; color: var(--color-text) !important; }
.p-markup .lifestyle-wrapper .item-desc { color: var(--color-text-sub) !important; font-size: 0.82rem !important; margin-left: 4px !important; }

/* パッケージ価格行（底辺に完全に綺麗に整列） */
.p-markup .lifestyle-wrapper .package-price-row {
	display: flex !important;
	align-items: baseline !important;
	justify-content: space-between !important;
	padding-top: 16px !important;
	border: none !important;
	border-top: 2px solid var(--color-primary-light) !important;
	margin-top: auto !important;
}
.p-markup .lifestyle-wrapper .package-price-label {
	font-size: 0.85rem !important;
	color: var(--color-text-sub) !important;
	line-height: 1.4 !important;
	text-align: left !important;
}
.p-markup .lifestyle-wrapper .package-price {
	font-size: 1.5rem !important;
	font-weight: 700 !important;
	color: var(--color-accent) !important;
	letter-spacing: 0.5px !important;
}
.p-markup .lifestyle-wrapper .package-price small {
	font-size: 0.75rem !important;
	color: var(--color-text-sub) !important;
	font-weight: 400 !important;
	margin-left: 2px !important;
}

/* ---------------------------------------------------------
   5. バナー訴求・注意書き
   --------------------------------------------------------- */
/* 価格訴求バナー */
.p-markup .lifestyle-wrapper .price-promo {
	display: grid !important;
	grid-template-columns: auto 1fr !important;
	row-gap: 12px !important;    /* 上下のアイコン・タイトルと、下の文章との隙間 */
	column-gap: 16px !important; /* 左右のアイコンとタイトルとの隙間 */
	align-items: center !important;

	background: linear-gradient(135deg, #e7f8ee 0%, #f0faf4 100%) !important;
	border: 2px solid var(--color-success) !important;
	border-radius: var(--radius-lg) !important;
	padding: 22px 0px 22px 24px !important;
	margin: 24px 0 28px 0 !important;
	text-align: left !important;
}
.p-markup .lifestyle-wrapper .price-promo-icon {
	flex-shrink: 0 !important;
	width: 48px !important;
	height: 48px !important;
	border-radius: 50% !important;
	background: var(--color-success) !important;
	color: var(--color-white) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.p-markup .lifestyle-wrapper .price-promo-icon svg {
	fill: none !important;
	stroke: var(--color-white) !important;
	stroke-width: 2.5 !important;
}
.p-markup .lifestyle-wrapper .price-promo-body { display: contents !important; }
.p-markup .lifestyle-wrapper .price-promo-title {
	grid-column: 2 !important;
	grid-row: 1 !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	color: #07803b !important;
	margin: 0 !important;
}
.p-markup .lifestyle-wrapper .price-promo-text {
	grid-column: 1 / -1 !important; /* 1列目（左端）から右端までワイドに広げる */
	grid-row: 2 !important;        /* 2行目に強制配置 */
	font-size: 0.9rem !important;
	line-height: 1.6 !important;
	color: var(--color-text) !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: none !important;
}

/* 保険についての注意 */
.p-markup .lifestyle-wrapper .insurance-note {
	display: flex !important;
	align-items: flex-start !important;
	gap: 12px !important;
	background: #fdecea !important;
	border: 1px solid #f5c2bd !important;
	border-left: 4px solid var(--color-danger) !important;
	border-radius: var(--radius-md) !important;
	padding: 14px 18px !important;
	margin: 20px 0 28px 0 !important;
	font-size: 0.9rem !important;
	line-height: 1.65 !important;
	text-align: left !important;
}
.p-markup .lifestyle-wrapper .insurance-note .ins-icon {
	flex-shrink: 0 !important;
	width: 24px !important;
	height: 24px !important;
	border-radius: 50% !important;
	background: var(--color-danger) !important;
	color: var(--color-white) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.p-markup .lifestyle-wrapper .insurance-note .ins-text { margin: 0 !important; }
.p-markup .lifestyle-wrapper .insurance-note .ins-text strong { color: var(--color-danger) !important; font-weight: 700 !important; }

/* ---------------------------------------------------------
   6. 検査の流れ（タイムライン構造）
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper .flow-timeline {
	position: relative !important;
	margin: 35px 0 !important;
	padding-left: 38px !important;
	text-align: left !important;
}
.p-markup .lifestyle-wrapper .flow-timeline::before {
	content: "" !important;
	position: absolute !important;
	left: 16px !important;
	top: 12px !important;
	bottom: 12px !important;
	width: 2px !important;
	background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-light) 100%) !important;
}
.p-markup .lifestyle-wrapper .flow-step {
	position: relative !important;
	margin-bottom: 24px !important;
	background: var(--color-white) !important;
	border: 1px solid var(--color-border) !important;
	border-radius: var(--radius-md) !important;
	padding: 20px 22px !important;
	box-shadow: var(--shadow-card) !important;
	transition: transform 0.2s ease !important;
}
.p-markup .lifestyle-wrapper .flow-step:hover { transform: translateX(4px) !important; }
.p-markup .lifestyle-wrapper .flow-step:last-child { margin-bottom: 0 !important; }

.p-markup .lifestyle-wrapper .flow-step .step-num {
	position: absolute !important;
	left: -38px !important;
	top: 14px !important;
	width: 36px !important;
	height: 36px !important;
	border-radius: 50% !important;
	background: var(--color-primary) !important;
	color: var(--color-white) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-weight: 700 !important;
	box-shadow: 0 0 0 4px var(--color-white), 0 0 0 5px var(--color-primary) !important;
}
.p-markup .lifestyle-wrapper .flow-step.last .step-num {
	background: var(--color-success) !important;
	box-shadow: 0 0 0 4px var(--color-white), 0 0 0 5px var(--color-success) !important;
}
.p-markup .lifestyle-wrapper .flow-step .step-head {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	margin-bottom: 8px !important;
}
.p-markup .lifestyle-wrapper .flow-step .step-icon {
	width: 36px !important;
	height: 36px !important;
	border-radius: 8px !important;
	background: var(--color-primary-light) !important;
	color: var(--color-primary) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
}
.p-markup .lifestyle-wrapper .flow-step .step-icon svg {
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 2 !important;
}

.p-markup .lifestyle-wrapper .flow-step .step-title {
	font-size: 1.1rem !important;
	font-weight: 700 !important;
  border-bottom: none;
  padding: 5px 10px;
	color: var(--color-primary-dark) !important;
	margin: 0 !important;
}
.p-markup .lifestyle-wrapper .flow-step .step-desc {
	font-size: 0.92rem !important;
	line-height: 1.7 !important;
	color: var(--color-text-sub) !important;
	margin: 0 !important;
}

/* ---------------------------------------------------------
   7. 診療時間テーブル（ホバー・クリック・タップ時の色ブレを完全固定）
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper .hours-table-wrapper {
	overflow-x: auto !important;
	margin: 24px 0 !important;
	box-shadow: var(--shadow-card) !important;
	border-radius: var(--radius-lg) !important;
}
.p-markup .lifestyle-wrapper .hours-table {
	width: 100% !important;
	border-collapse: collapse !important;
	background: var(--color-white) !important;
	min-width: 640px !important;
	font-size: 0.95rem !important;
	table-layout: auto !important;
}
.p-markup .lifestyle-wrapper .hours-table thead th {
	background: var(--color-primary) !important;
	color: var(--color-white) !important;
	font-weight: 700 !important;
	padding: 18px 10px !important;
	text-align: center !important;
	border-right: 1px solid rgba(255,255,255,0.2) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
	font-size: 0.9rem !important;
  vertical-align: middle !important;
}
.p-markup .lifestyle-wrapper .hours-table thead th:last-child { border-right: none !important; }
.p-markup .lifestyle-wrapper .hours-table thead th.clinic-49 { background: var(--color-primary-dark) !important; }

/* 修正点: クリック・タップ・ホバー等によるセルの背景色ブレを100%遮断して固定化 */
.p-markup .lifestyle-wrapper .hours-table tbody td,
.p-markup .lifestyle-wrapper .hours-table tbody tr td,
.p-markup .lifestyle-wrapper .hours-table tbody tr:hover td,
.p-markup .lifestyle-wrapper .hours-table tbody tr:active td,
.p-markup .lifestyle-wrapper .hours-table tbody td:active,
.p-markup .lifestyle-wrapper .hours-table tbody tr[class*="active"] td {
	padding: 12px 10px !important;
	text-align: center !important;
	border-bottom: 1px solid var(--color-border) !important;
	border-right: 1px solid var(--color-border) !important;
	font-size: 0.95rem !important;
	background: var(--color-white) !important;
}
.p-markup .lifestyle-wrapper .hours-table tbody td:last-child { border-right: none !important; }
.p-markup .lifestyle-wrapper .hours-table tbody tr:last-child td { border-bottom: none !important; }

/* 縞模様(even行)の色の固定 */
.p-markup .lifestyle-wrapper .hours-table tbody tr:nth-child(even) td,
.p-markup .lifestyle-wrapper .hours-table tbody tr:nth-child(even):hover td,
.p-markup .lifestyle-wrapper .hours-table tbody tr:nth-child(even):active td { 
	background: var(--color-bg-soft) !important; 
}

/* 曜日列の固定 */
.p-markup .lifestyle-wrapper .hours-table .day-col,
.p-markup .lifestyle-wrapper .hours-table tbody tr:hover .day-col,
.p-markup .lifestyle-wrapper .hours-table tbody tr:active .day-col {
	background: var(--color-primary-light) !important;
	color: var(--color-primary-dark) !important;
	font-weight: 700 !important;
	width: 90px !important;
	white-space: nowrap !important;
}
.p-markup .lifestyle-wrapper .hours-table tbody tr:nth-child(even) .day-col,
.p-markup .lifestyle-wrapper .hours-table tbody tr:nth-child(even):hover .day-col { 
	background: #dce8f3 !important; 
}
.p-markup .lifestyle-wrapper .hours-table .day-col.sat { color: #1d6fb8 !important; }
.p-markup .lifestyle-wrapper .hours-table .day-col.sun { color: #c0392b !important; }
.p-markup .lifestyle-wrapper .hours-table .open  { color: var(--color-primary) !important; font-weight: 700 !important; }
.p-markup .lifestyle-wrapper .hours-table .close { color: #bbb !important; font-weight: 400 !important; }

/* ---------------------------------------------------------
   8. よくある質問 (FAQ)
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper .faq-list { margin: 24px 0 !important; text-align: left; }
.p-markup .lifestyle-wrapper .faq-item { border: 1px solid var(--color-border) !important; border-radius: var(--radius-md) !important; margin-bottom: 12px !important; overflow: hidden !important; background: var(--color-white) !important; transition: box-shadow 0.2s ease !important; }
.p-markup .lifestyle-wrapper .faq-item.open { box-shadow: var(--shadow-card) !important; border-color: var(--color-primary) !important; }
.p-markup .lifestyle-wrapper .faq-q { display: flex !important; align-items: center !important; gap: 14px !important; width: 100% !important; background: none !important; border: none !important; padding: 16px 18px !important; cursor: pointer !important; text-align: left !important; font-family: inherit !important; font-size: 0.98rem !important; font-weight: 600 !important; color: var(--color-text) !important; line-height: 1.55 !important; }
.p-markup .lifestyle-wrapper .faq-q .q-label { width: 28px !important; height: 28px !important; border-radius: 50% !important; background: var(--color-primary) !important; color: var(--color-white) !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; font-weight: 700 !important; font-size: 0.85rem !important; }
.p-markup .lifestyle-wrapper .faq-q .q-text { flex: 1 !important; }
.p-markup .lifestyle-wrapper .faq-q .q-toggle { flex-shrink: 0 !important; color: var(--color-primary) !important; transition: transform 0.25s ease !important; display: flex !important; }
.p-markup .lifestyle-wrapper .faq-item.open .q-toggle { transform: rotate(180deg) !important; }
.p-markup .lifestyle-wrapper .faq-a { display: flex !important; align-items: flex-start !important; gap: 14px !important; padding: 0 18px !important; font-size: 0.92rem !important; line-height: 1.75 !important; color: var(--color-text-sub) !important; max-height: 0 !important; overflow: hidden !important; transition: max-height 0.3s ease, padding 0.3s ease !important; }
.p-markup .lifestyle-wrapper .faq-item.open .faq-a { max-height: 500px !important; padding-bottom: 18px !important; }
.p-markup .lifestyle-wrapper .faq-a .a-label { width: 28px !important; height: 28px !important; border-radius: 50% !important; background: var(--color-accent) !important; color: var(--color-white) !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; font-weight: 700 !important; font-size: 0.85rem !important; margin-top: 1px !important; }
.p-markup .lifestyle-wrapper .faq-a .a-text { flex: 1 !important; }

/* ---------------------------------------------------------
   9. お問い合わせ（超強力詳細度ハックでテーマの黒塗りを完全粉砕）
   --------------------------------------------------------- */
.p-markup .lifestyle-wrapper .contact-cards {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
	gap: 20px !important;
	margin: 28px 0 40px 0 !important;
}
.p-markup .lifestyle-wrapper .contact-cards > p:empty, 
.p-markup .lifestyle-wrapper .contact-cards > p, 
.p-markup .lifestyle-wrapper .contact-cards > *:not(.contact-card) {
	display: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.p-markup .lifestyle-wrapper .contact-card {
	display: flex !important;
	align-items: center !important;
	gap: 0 !important; 
	padding: 22px 24px !important;
	background: var(--color-white) !important;
	border: 1px solid var(--color-border) !important;
	border-radius: var(--radius-lg) !important;
	text-decoration: none !important;
	color: var(--color-text) !important;
	box-shadow: var(--shadow-card) !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease !important;
	position: relative !important;
	overflow: hidden !important;
	text-align: left !important;
}
.p-markup .lifestyle-wrapper .contact-card::before { content: ""; position: absolute; top: 0; left: 0; width: 6px; height: 100%; }
.p-markup .lifestyle-wrapper .contact-card:hover { transform: translateY(-3px) !important; box-shadow: var(--shadow-card-hover) !important; }
.p-markup .lifestyle-wrapper .contact-card.line-card::before { background: var(--color-success) !important; }
.p-markup .lifestyle-wrapper .contact-card.line-card .contact-icon { background: var(--color-success) !important; color: var(--color-white) !important; }
.p-markup .lifestyle-wrapper .contact-card.line-card .contact-cta { color: var(--color-success) !important; }
.p-markup .lifestyle-wrapper .contact-card.tel-card::before { background: var(--color-primary) !important; }
.p-markup .lifestyle-wrapper .contact-card.tel-card .contact-icon { background: var(--color-primary) !important; color: var(--color-white) !important; }
.p-markup .lifestyle-wrapper .contact-card.tel-card .contact-cta { color: var(--color-primary) !important; }

.p-markup .lifestyle-wrapper .contact-card.line-card { padding-left: 24px !important; }
.p-markup .lifestyle-wrapper .contact-icon { 
	flex-shrink: 0 !important; 
	width: 60px !important; 
	height: 60px !important; 
	border-radius: 50% !important; 
	display: flex !important; 
	align-items: center !important; 
	justify-content: center !important;
	margin: 0 18px 0 0 !important; 
	padding: 0 !important;
}

.p-markup .lifestyle-wrapper .contact-body { 
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	flex: 1 !important; 
	min-width: 0 !important; 
}
.p-markup .lifestyle-wrapper .contact-label { 
	font-size: 0.82rem !important; 
	color: var(--color-text-sub) !important; 
	margin: 0 0 6px 0 !important; 
	letter-spacing: 0.5px !important; 
	line-height: 1.2 !important;
}
.p-markup .lifestyle-wrapper .contact-value { 
	font-size: 1.35rem !important; 
	font-weight: 700 !important; 
	color: var(--color-primary-dark) !important; 
	letter-spacing: 0.5px !important; 
	line-height: 1.4 !important; 
	word-break: break-all !important; 
	margin: 0 0 6px 0 !important; 
}
.p-markup .lifestyle-wrapper .contact-cta { 
	margin: 0 !important; 
	font-size: 0.85rem !important; 
	font-weight: 700 !important; 
	display: inline-flex !important; 
	align-items: center !important; 
	gap: 6px !important; 
	line-height: 1.2 !important;
}

/* 修正点: 親テーマの黒潰しパスを最高優先度の階層で根こそぎ純白化 */
html body div#page.site div.l-inner div.l-main.p-markup div.lifestyle-wrapper div.contact-cards a.contact-card.line-card div.contact-icon svg,
html body div#page.site div.l-inner div.l-main.p-markup div.lifestyle-wrapper div.contact-cards a.contact-card.line-card div.contact-icon svg path,
html body div#page.site div.l-inner div.l-main.p-markup div.lifestyle-wrapper div.contact-cards a.contact-card.line-card div.contact-icon svg * {
	fill: var(--color-white) !important;
	stroke: none !important;
	color: var(--color-white) !important;
}
html body div#page.site div.l-inner div.l-main.p-markup div.lifestyle-wrapper div.contact-cards a.contact-card.tel-card div.contact-icon svg,
html body div#page.site div.l-inner div.l-main.p-markup div.lifestyle-wrapper div.contact-cards a.contact-card.tel-card div.contact-icon svg path,
html body div#page.site div.l-inner div.l-main.p-markup div.lifestyle-wrapper div.contact-cards a.contact-card.tel-card div.contact-icon svg * {
	fill: none !important;
	stroke: var(--color-white) !important;
	stroke-width: 2 !important;
	color: var(--color-white) !important;
}

/* ---------------------------------------------------------
   10. モバイルレスポンス設定（パンくず2行改行対応含む）
   --------------------------------------------------------- */
@media (max-width: 768px) {
	/* 親テーマのul.pn-bが持つFlexbox命令を破壊し、確実な2行構成へ矯正 */
	.blue_container .ttl_blue02 ul.pn-b {
		display: block !important;       
		padding: 15px 20px !important;    
		margin: 0 !important;
		list-style: none !important;
		width: 100% !important;
		white-space: normal !important;
		height: auto !important;
	}
	.blue_container .ttl_blue02 ul.pn-b li:first-child {
		display: inline-block !important;
		width: auto !important;
		margin: 0 0 4px 0 !important;
	}
	.blue_container .ttl_blue02 ul.pn-b li:first-child a {
		font-size: 0.8rem !important;
		color: var(--color-text-sub) !important;
		display: inline !important;
	}
	.blue_container .ttl_blue02 ul.pn-b li:first-child a::after {
		content: " /" !important;
		color: #b8c5d1 !important;
		margin-left: 4px !important;
		display: inline-block !important;
	}
	.blue_container .ttl_blue02 ul.pn-b p,
	.blue_container .ttl_blue02 ul.pn-b br {
		display: none !important;
	}
	.blue_container .ttl_blue02 ul.pn-b li:last-child {
		display: block !important; 
		font-size: 0 !important; 
		color: transparent !important;
		line-height: 0 !important;
		height: 0 !important;
		margin: 2px 0 0 0 !important;
		padding: 0 !important;
		border: none !important;
		visibility: hidden !important;
	}
	.blue_container .ttl_blue02 ul.pn-b li:last-child::before {
		content: "生活習慣病外来" !important;
		font-size: 0.8rem !important; 
		color: var(--color-text-sub) !important; 
		font-weight: 700 !important;
		visibility: visible !important;
		display: block !important;
	}

	/* レスポンシブ各コンポーネント最適化 */
	.p-markup .lifestyle-wrapper { padding: 24px 14px !important; }
	.p-markup .lifestyle-wrapper h2.section-title { font-size: 1.3rem !important; margin: 35px 0 16px !important; }
	.p-markup .lifestyle-wrapper .intro-lead { padding: 18px !important; gap: 14px !important; }
	.p-markup .lifestyle-wrapper .intro-lead-icon { width: 44px !important; height: 44px !important; }
	.p-markup .lifestyle-wrapper .nav-cards { grid-template-columns: 1fr !important; gap: 14px !important; }
	.p-markup .lifestyle-wrapper .flow-timeline { padding-left: 32px !important; }
	.p-markup .lifestyle-wrapper .flow-timeline::before { left: 12px !important; }
	.p-markup .lifestyle-wrapper .flow-step .step-num { left: -32px !important; width: 30px !important; height: 30px !important; font-size: 0.95rem !important; }
	.p-markup .lifestyle-wrapper .hours-table { min-width: 560px !important; }
	.p-markup .lifestyle-wrapper .contact-card { padding: 18px !important; gap: 14px !important; }
	.p-markup .lifestyle-wrapper .contact-icon { width: 50px !important; height: 50px !important; }
	.p-markup .lifestyle-wrapper .contact-value { font-size: 1.05rem !important; }
	
	/* パッケージカードのスマホ引き伸ばし */
	.p-markup .lifestyle-wrapper .package-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important; gap: 16px !important; align-items: stretch !important; }
	.p-markup .lifestyle-wrapper .package-card { padding: 18px !important; height: 100% !important; }

  .p-markup .lifestyle-wrapper .flow-timeline .flow-step:nth-of-type(1) .step-title {
		font-size: 0 !important;
	}
	.p-markup .lifestyle-wrapper .flow-timeline .flow-step:nth-of-type(1) .step-title::before {
		content: "ご予約・\A お問い合わせ" !important;
		font-size: 1.1rem !important; /* 周りの見出しとサイズを同期 */
		font-weight: 700 !important;
		color: var(--color-primary-dark) !important;
		white-space: pre !important; /* 改行コード（\A）を有効化 */
		display: block !important;
		line-height: 1.4 !important;
	}

	/* タイムライン3番目：「採血・尿検査」をスマホのみ「・」の後で改行 */
	.p-markup .lifestyle-wrapper .flow-timeline .flow-step:nth-of-type(3) .step-title {
		font-size: 0 !important;
	}
	.p-markup .lifestyle-wrapper .flow-timeline .flow-step:nth-of-type(3) .step-title::before {
		content: "採血・\A 尿検査" !important;
		font-size: 1.1rem !important;
		font-weight: 700 !important;
		color: var(--color-primary-dark) !important;
		white-space: pre !important;
		display: block !important;
		line-height: 1.4 !important;
	}
}