@charset "UTF-8";

@font-face {
	font-family: "LINE Seed JP";
	src: url("../../fonts/LINESeedJP_OTF_Th.woff2") format("woff2"),
	url("../../fonts/LINESeedJP_OTF_Th.woff") format("woff");
	font-weight: 100;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "LINE Seed JP";
	src: url("../../fonts/LINESeedJP_OTF_Rg.woff2") format("woff2"),
	url("../../fonts/LINESeedJP_OTF_Rg.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "LINE Seed JP";
	src: url("../../fonts/LINESeedJP_OTF_Bd.woff2") format("woff2"),
	url("../../fonts/LINESeedJP_OTF_Bd.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "LINE Seed JP";
	src: url("../../fonts/LINESeedJP_OTF_Eb.woff2") format("woff2"),
	url("../../fonts/LINESeedJP_OTF_Eb.woff") format("woff");
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

:root {
	--c-navy: #003c8c;
	--c-blue-deep: #2A60A7;
	--c-teal: #5ad1d6;
	--c-teal-dark: #2fb6bd;
	--c-teal-info: #17b2b9;
	--c-mint: #eaf5f6;
	--c-orange: #ff6b45;
	--c-yellow: #FEE348;
	--c-line: #06c755;
	--c-text: #333333;
	--c-text-sub: #5a6a6a;
	--c-text-note: #8a9a9a;
	--c-gray-pharmacy: #6c7a86;
	--c-border: #bcd1d1;
	--radius-l: 24px;
	--radius-xl: 32px;
	--container: 1224px;
	--font-heading: "LINE Seed JP", "Hiragino Maru Gothic ProN", "Meiryo", sans-serif;
	--font-body: "LINE Seed JP", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
}

body {
	margin: 0;
}

/* ------------------------------------------------------------
   Reset (最低限)
   ------------------------------------------------------------ */
.hyp-page * {
	box-sizing: border-box;
}
.hyp-page {
	font-family: var(--font-body);
	color: var(--c-text);
	line-height: 1.8;
	-webkit-font-smoothing: antialiased;
	background: #fff;
}
@media (min-width: 768px) {
	.hyp-page {
		min-width: 1280px;
	}
}
@media (max-width: 768px) {
	.hyp-page {
		--t: calc((100vw - 375px) / (768px - 375px));
		--fluid-14-16: clamp(14px, calc(14px + var(--t) * 2px), 16px);
		--fluid-15-20: clamp(15px, calc(15px + var(--t) * 5px), 20px);
		--fluid-15-22: clamp(15px, calc(15px + var(--t) * 7px), 22px);
		--fluid-16-22: clamp(16px, calc(16px + var(--t) * 6px), 22px);
		--fluid-22-32: clamp(22px, calc(22px + var(--t) * 10px), 32px);
		--fluid-26-40: clamp(26px, calc(26px + var(--t) * 14px), 40px);
	}
}
.hyp-page img {
	display: block;
}
.hyp-page ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.hyp-page a {
	color: inherit;
	text-decoration: none;
}
.hyp-page b, .hyp-page strong {
	font-weight: 700;
}
.hyp-page small {
	font-size: 0.75em;
}

.hyp-page .u-sp-only {
	display: none;
}
@media (max-width: 768px) {
	.hyp-page .u-sp-only {
		display: inline;
	}
}

.hyp-page .hyp-section {
	position: relative;
}

.hyp-page .rx-days.hyp-section {
	.rx-panel__title {
		margin: 0 0 24px;
	}
}

.hyp-page .hyp-inner {
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 20px;
}

.hyp-page .hero__main {
	width: 100%;
	max-width: 659px;
}

/* ------------------------------------------------------------
   共通パーツ
   ------------------------------------------------------------ */
.hyp-page .tag-badge {
	display: inline-flex;
	align-items: center;
	background: var(--c-blue-deep);
	color: #ffffff;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	letter-spacing: 0.05em;
	padding: 20px 40px;
	border-radius: 40px;
	position: relative;
}

.hyp-page .tag-badge::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -10px;
	transform: translateX(-50%);
	width: 40px;
	height: 11px;
	background: url("data:image/svg+xml,%3Csvg width='40' height='11' viewBox='0 0 40 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M35.8857 1.66752C37.4521 0.305241 39.3815 0.0565262 40 0H0C0.618487 0.0565262 2.5479 0.305241 4.11429 1.66752C4.72605 2.19887 5.10924 2.75283 5.35798 3.21634C5.43866 3.40853 5.52605 3.60637 5.62689 3.79291C5.62689 3.80421 5.64034 3.82117 5.64034 3.83248C5.64034 3.83248 5.64034 3.83248 5.64034 3.82682C7.80504 8.01542 13.4118 11 20 11C26.5815 11 32.1882 8.01542 34.3529 3.83248C34.3529 3.83248 34.3529 3.82682 34.3529 3.82117C34.4605 3.61202 34.5613 3.39723 34.6487 3.18243C34.8975 2.72456 35.2807 2.18191 35.879 1.66752H35.8857Z' fill='%232A60A7'/%3E%3C/svg%3E") no-repeat center / contain;
}

.hyp-page .hyp-sec-heading.features__title, .hyp-page .hyp-sec-heading.rx-days__title, .hyp-page .hyp-sec-heading.drugs__title, .hyp-page .hyp-sec-heading.pricing__title {
	font-weight: 700;
	color: var(--c-navy);
	font-size: 40px;
	line-height: 1.4;
	letter-spacing: 0.05em;
}

.hyp-page .hyp-sec-heading.drugs__title {
	margin: 0 0 32px;
}

.hyp-page .hyp-sec-heading.pricing__title {
	margin: 0 0 32px;
}

.hyp-page .sec-lead.pricing__lead {
	margin: 0 0 72px;
}

.hyp-page .hyp-sec-heading.features__title .comma-tight {
	letter-spacing: -0.4em;
}
.hyp-page .sec-lead.drugs__lead, .hyp-page .sec-lead.pricing__lead {
	font-weight: 400;
	font-size: 18px;
	line-height: 32.4px;
	letter-spacing: 0.05em;
	color: var(--c-text);
}
.hyp-page .sec-lead.drugs__lead {
	margin: 0 0 64px;
}
.hyp-page .hyp-sec-heading.cost-compare__title {
	text-align: center;
	color: var(--c-text);
	font-weight: 700;
	font-size: 32px;
	line-height: 1;
	letter-spacing: 0.05em;
}
.hyp-page .hyp-sec-heading {
	text-align: center;
	font-family: var(--font-heading);
	font-weight: 800;
	color: var(--c-navy);
	font-size: 38px;
	letter-spacing: 0.02em;
	margin: 20px 0 0;
}
.hyp-page .sec-lead {
	text-align: center;
	color: var(--c-text-sub);
	font-size: 15px;
	line-height: 1.9;
	margin-top: 18px;
}
.hyp-page .sec-dot {
	width: 34px;
	height: 10px;
	background: linear-gradient(to right, #5BD0D5 0%, #47BAD5 77%, #32A4D5 100%);
	border-radius: 10px;
	margin: 18px auto 0;
}

.hyp-page .hyp-btn-line {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: var(--c-line);
	color: #fff;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 20px;
	padding: 16px 20px;
	border-radius: 50px;
	box-shadow: 0 6px 16px rgba(6, 199, 85, 0.35);
	border: none;
	cursor: pointer;
	width: 100%;
	max-width: 480px;
}
.hyp-page .hero__cta-copy .hyp-btn-line {
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.1em;
	gap: 0;
}
.hyp-page .hero__cta-copy .hyp-btn-line img {
	margin-right: 16px;
}
.hyp-page .hero__cta-copy .hyp-btn-line .hyp-dot {
	margin-left: 40px;
}
.hyp-page .hyp-btn-line img {
	width: 47px;
	height: 44px;
}
.hyp-page .hyp-btn-line .hyp-dot {
	position: relative;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #fff;
	margin-left: 4px;
}
/* header-btn c-btn__01 c-btn__01--green（css/styles.css）と同じ、
   ホバー時に丸が広がって矢印が現れるアニメーションを流用。
   .hyp-dot自体のサイズ・位置は変えず、.hyp-dotの中心を起点に
   ::afterを重ねて拡大させることで、既存の点の位置からそのまま
   丸+矢印が広がるように見せる（.hyp-dot自体のwidth/heightは
   変更しないので、テキストとのレイアウトには影響しない）。 */
.hyp-page .hyp-btn-line .hyp-dot::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 32px;
	height: 32px;
	background-color: transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 11'%3E%3Cpath d='M10.4.34A1.072 1.072 0 009.64 0c-.14 0-.28.03-.42.08a1.055 1.055 0 00-.58.6c-.05.14-.08.28-.08.43 0 .15.03.29.09.42s.14.26.24.36l2.46 2.52H1.07c-.28 0-.56.12-.76.32-.2.21-.31.49-.31.78s.11.57.31.78c.2.21.47.32.76.32h10.27L8.88 9.13c-.2.21-.3.49-.3.77 0 .29.12.56.31.77.2.2.47.32.75.32s.55-.11.75-.31l4.29-4.4c.2-.21.31-.49.31-.78s-.11-.57-.31-.78L10.4.34z' fill='%2305c756'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 0;
	border-radius: 50%;
	transform: translate(-50%, -50%) scale(0.2);
	transition: background-color 0.3s ease, background-size 0.3s ease, transform 0.3s ease;
}
@media (any-hover: hover) {
	.hyp-page .hyp-btn-line:hover .hyp-dot::after {
		background-color: #fff;
		background-size: 12px 9px;
		transform: translate(-50%, -50%) scale(1);
	}
}

.hyp-page .highlight-mark {
	background: url("data:image/svg+xml,%3Csvg width='328' height='10' viewBox='0 0 328 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='328' height='10' rx='5' fill='%23FCE89D'/%3E%3C/svg%3E") no-repeat left bottom / 100% 10px;
	font-weight: 700;
}

/* ==============================================================
   1. HERO
   ============================================================== */
.hyp-page .hero {
	padding: 184px 0 0;
	background-color: #ffffff;
	position: relative;
	margin-bottom: 56px;
}
.hyp-page .hero::before {
	content: "";
	position: absolute;
	z-index: 0;
	top: 0;
	right: 0;
	width: 67%;
	height: 100%;
	background: url("../img/hypertension_lp/img-hero-bg.png") no-repeat right top / contain;
}
.hyp-page .hero::after {
	content: "";
	position: absolute;
	z-index: 0;
	bottom: -231px;
	left: 0;
	width: 28%;
	height: 100%;
	background: url("../img/hypertension_lp/img-hero-bg2.png") no-repeat left bottom / contain;
}
.hyp-page .hero__inner {
	max-width: var(--container);
	margin: 0 auto;
	display: flex;
	gap: 53px;
	align-items: end;
	position: relative;
	z-index: 1;
}
.hyp-page .hero__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--c-blue-deep);
	color: #fff;
	font-family: var(--font-heading);
	font-weight: 700;
	line-height: 1.3;
	padding: 12px 32px;
	border-radius: 50px;
	margin-bottom: 26px;
	position: relative;
	width: 100%;
	max-width: 643px;
}
.hyp-page .hero__badge b {
	color: #fff;
	margin: 0 2px;
}
.hyp-page .hero__badge .fs20 {
	font-size: 20px;
}
.hyp-page .hero__badge .fs24 {
	font-size: 24px;
}
.hyp-page .hero__badge .fs28 {
	font-size: 28px;
}
.hyp-page .hero__badge .fs32 {
	font-size: 32px;
}
.hyp-page .hero__badge .ls7 {
	letter-spacing: 0.07em;
}
.hyp-page .hero__badge .ls6 {
	letter-spacing: 0.06em;
}
.hyp-page .hero__badge .ls8 {
	letter-spacing: 0.08em;
}
.hyp-page .hero__badge .ls5 {
	letter-spacing: 0.05em;
}
.hyp-page .hero__badge .lsm1 {
	letter-spacing: -0.01em;
}
.hyp-page .hero__badge::after {
	content: "";
	position: absolute;
	left: 79%;
	transform: translateX(-50%);
	bottom: -14px;
	width: 55px;
	height: 15px;
	background: url("../img/hypertension_lp/fukidasi.png") no-repeat center / contain;
}
.hyp-page .hero__title {
	font-family: var(--font-heading);
	font-weight: 700;
	color: var(--c-navy);
	font-size: 56px;
	line-height: 1.3;
	margin-bottom: 28px;
	letter-spacing: 0.05em;
}
.hyp-page .hero__panel {
	background: var(--c-mint);
	border-radius: var(--radius-l);
	padding: 26px 32px 26px;
	margin-bottom: 26px;
}
.hyp-page .hero__panel-title {
	display: flex;
	align-items: center;
	gap: 12px;
	font-weight: 700;
	font-size: 22px;
	line-height: 22px;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0 0 18px;
}
.hyp-page .hero__panel-title::before {
	content: "";
	width: 18px;
	height: 10px;
	background: var(--c-teal);
	border-radius: 10px;
	display: inline-block;
}
.hyp-page table.avail-table {
	width: 100%;
	border-collapse: separate;
	table-layout: fixed;
	overflow: hidden;
}
.hyp-page table.avail-table th, .hyp-page table.avail-table td {
	text-align: center;
	padding: 10px 2px;
	font-size: 14px;
}
.hyp-page table.avail-table thead th {
	background: var(--c-teal);
	color: #fff;
	font-weight: 700;
	font-size: 15px;
	line-height: 1;
	letter-spacing: 0.05em;
}
.hyp-page table.avail-table thead th:first-child {
	border-radius: 6px 0 0 0;
}
.hyp-page table.avail-table thead th:last-child {
	border-radius: 0 6px 0 0;
}
.hyp-page table.avail-table tbody td {
	font-size: 18px;
	font-weight: 700;
	color: var(--c-teal-info);
	background: #fff;
}
.hyp-page table.avail-table tbody td:first-child {
	border-radius: 0 0 0 6px;
}
.hyp-page table.avail-table tbody td:last-child {
	border-radius: 0 0 6px 0;
}
.hyp-page table.avail-table tbody td.off {
	color: var(--c-teal-info);
}
.hyp-page .avail-legend {
	display: flex;
	gap: 18px;
	justify-content: end;
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text-sub);
	margin: 12px 0 0;
}
.hyp-page .avail-legend span {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.hyp-page .avail-legend .mark {
	font-style: normal;
	font-weight: 700;
	font-size: 20px;
	color: var(--c-teal-info);
	line-height: 1;
}

.hyp-page .hero__cta-row {
	display: flex;
	align-items: center;
	gap: 20px;
}
.hyp-page .hero__cta-row .owl {
	width: 100%;
	max-width: 150px;
	flex-shrink: 0;
}
.hyp-page .hero__cta-copy {
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
	align-items: center;
}
.hyp-page .hero__cta-copy .catch {
	font-weight: 700;
	color: var(--c-text);
	font-size: 20px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	text-align: center;
}

.hyp-page .hero__visual {
	position: relative;
	height: 560px;
	width: 100%;
	max-width: 512px;
}

.hyp-page .hero__doctor {
	position: absolute;
	right: 20px;
	bottom: 0;
	width: 100%;
	max-width: 400px;
	height: auto;
	object-fit: contain;
	z-index: 2;
}
.hyp-page .badge-circles {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 10px;
	display: flex;
	justify-content: space-between;
	gap: 16px;
	z-index: 3;
}
.hyp-page .badge-circle {
	position: relative;
	width: 160px;
	height: 160px;
	background: var(--c-yellow);
	border-radius: 50%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-weight: 700;
	font-size: 22px;
	line-height: 1.3;
	letter-spacing: 0.05em;
	color: var(--c-text);
	box-shadow: 0 10px 20px rgba(0,0,0,0.08);
}
.hyp-page .badge-circle .ico {
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
}
.hyp-page .badge-circle .label-mt {
	display: block;
	margin-top: 10px;
}
.hyp-page .badge-circle .fs18 {
	font-size: 18px;
}
.hyp-page .badge-circle .fs22 {
	font-size: 22px;
}

/* ==============================================================
   SP (max-width: 768px) - 1. HERO
   ============================================================== */
@media (max-width: 768px) {
	.hyp-page .hero {
		padding-top: clamp(96px, calc(36px + var(--t) * 20px), 56px);
		padding-right: 0;
		padding-bottom: clamp(0px, calc(40px + var(--t) * -40px), 80px);
		padding-left: 0;
		margin-bottom: clamp(0px, calc(var(--t) * 56px), 56px);
	}
	.hyp-page .hero::before {
		width: clamp(67%, calc(100% + var(--t) * -33%), 100%);
		height: 180px;
	}
	.hyp-page .hero::after {
		width: clamp(28%, calc(55% + var(--t) * -27%), 55%);
		height: 160px;
		bottom: clamp(-231px, calc(-75px + var(--t) * -191px), -40px);
	}
	.hyp-page .hero__inner {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		position: relative;
		gap: 0;
		padding-left: clamp(0px, calc(18.75px + var(--t) * -18.75px), 18.75px);
		padding-right: clamp(0px, calc(18.75px + var(--t) * -18.75px), 18.75px);
	}
	.hyp-page .hero__main, .hyp-page .hero__visual {
		display: contents;
	}

	/* ---- バッジ「最大3ヵ月分」 ---- */
.hyp-page .hero__badge {
		order: 1;
		width: 100%;
		max-width: none;
		padding-top: clamp(7px, calc(7px + var(--t) * 5px), 12px);
		padding-right: clamp(20px, calc(20px + var(--t) * 12px), 32px);
		padding-bottom: clamp(8px, calc(8px + var(--t) * 4px), 12px);
		padding-left: clamp(20px, calc(20px + var(--t) * 12px), 32px);
		border-radius: clamp(50px, calc(66px + var(--t) * -16px), 66px);
		margin-bottom: clamp(20px, calc(20px + var(--t) * 6px), 26px);
	}
	.hyp-page .hero__badge .fs20 {
		font-size: clamp(12px, calc(12px + var(--t) * 8px), 20px);
	}
	.hyp-page .hero__badge .fs24 {
		font-size: clamp(14px, calc(14px + var(--t) * 10px), 24px);
	}
	.hyp-page .hero__badge .fs28 {
		font-size: clamp(16px, calc(16px + var(--t) * 12px), 28px);
	}
	.hyp-page .hero__badge .fs32 {
		font-size: clamp(19px, calc(19px + var(--t) * 13px), 32px);
	}
	.hyp-page .hero__badge::after {
		left: clamp(26%, calc(26% + var(--t) * 53%), 79%);
		transform: translateX(-50%);
		bottom: clamp(-14px, calc(-7.48px + var(--t) * -6.52px), -7.48px);
		width: clamp(27px, calc(27px + var(--t) * 28px), 55px);
		height: clamp(7.479px, calc(7.479px + var(--t) * 7.521px), 15px);
	}

	/* ---- タイトル ---- */
.hyp-page .hero__title {
		order: 2;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-left: clamp(0px, calc(8px + var(--t) * -8px), 8px);
		font-size: clamp(42px, calc(42px + var(--t) * 14px), 56px);
		line-height: 1.3;
		letter-spacing: 0.05em;
		margin-bottom: clamp(20px, calc(20px + var(--t) * 8px), 28px);
	}
	.hyp-page .hero__title-l1 {
		display: flex;
		align-items: baseline;
		gap: 4px;
	}
	.hyp-page .hero__title-no {
		font-size: clamp(30px, calc(30px + var(--t) * 26px), 56px);
	}
	.hyp-page .hero__title-l2, .hyp-page .hero__title-l3 {
		font-size: clamp(35px, calc(35px + var(--t) * 21px), 56px);
		line-height: clamp(1.2, calc(1.2 + var(--t) * 0.1), 1.3);
		letter-spacing: 0.05em;
	}

	/* ---- 医師＋スマホ画像 ---- */
.hyp-page .hero__visual {
		height: auto;
		max-width: none;
	}
	.hyp-page .hero__doctor {
		order: initial;
		position: absolute;
		top: clamp(62px, calc(62px + var(--t) * 20px), 82px);
		right: clamp(-5.75px, calc(-5.75px + var(--t) * 5.75px), 0px);
		z-index: 1;
		width: clamp(173px, calc(173px + var(--t) * 227px), 400px);
		height: clamp(267px, calc(267px + var(--t) * 349px), 616px);
		max-width: none;
		object-fit: cover;
		object-position: top;
		margin: 0;
	}

	/* ---- 3つの丸バッジ ---- */
.hyp-page .badge-circles {
		order: 4;
		position: relative;
		z-index: 2;
		width: 100%;
		gap: clamp(4px, calc(4px + var(--t) * 12px), 16px);
		margin-bottom: 24px;
	}
	.hyp-page .badge-circle {
		flex-shrink: 0;
		width: clamp(110px, calc(110px + var(--t) * 50px), 160px);
		height: clamp(110px, calc(110px + var(--t) * 50px), 160px);
		font-size: var(--fluid-15-22);
	}
	.hyp-page .badge-circle .ico {
		top: clamp(13px, calc(13px + var(--t) * 7px), 20px);
		width: var(--fluid-16-22);
		height: var(--fluid-16-22);
	}
	.hyp-page .badge-circle .label-mt {
		margin-top: clamp(6px, calc(6px + var(--t) * 4px), 10px);
	}
	.hyp-page .badge-circle .fs18 {
		font-size: clamp(12px, calc(12px + var(--t) * 6px), 18px);
	}
	.hyp-page .badge-circle .fs22 {
		font-size: var(--fluid-15-22);
	}

	/* ---- リアルタイム診察空き状況パネル ---- */
.hyp-page .hero__panel {
		order: 5;
		width: 100%;
		padding-top: clamp(24px, calc(24px + var(--t) * 2px), 26px);
		padding-right: clamp(16px, calc(16px + var(--t) * 16px), 32px);
		padding-bottom: clamp(24px, calc(24px + var(--t) * 2px), 26px);
		padding-left: clamp(16px, calc(16px + var(--t) * 16px), 32px);
		border-radius: clamp(20px, calc(20px + var(--t) * 4px), 24px);
		margin-bottom: clamp(0px, calc(var(--t) * 26px), 26px);
	}
	.hyp-page .hero__panel-title {
		gap: clamp(8px, calc(8px + var(--t) * 4px), 12px);
		font-size: var(--fluid-16-22);
		line-height: 22px;
		margin-bottom: clamp(16px, calc(16px + var(--t) * 2px), 18px);
		padding-left: clamp(0px, calc(12px + var(--t) * -12px), 12px);
	}
	.hyp-page .hero__panel-title::before {
		width: clamp(13px, calc(13px + var(--t) * 5px), 18px);
		height: clamp(8px, calc(8px + var(--t) * 2px), 10px);
	}
	.hyp-page table.avail-table th, .hyp-page table.avail-table td {
		padding-top: clamp(8px, calc(8px + var(--t) * 2px), 10px);
		padding-bottom: clamp(8px, calc(8px + var(--t) * 2px), 10px);
	}
	.hyp-page table.avail-table thead th {
		font-size: clamp(12px, calc(12px + var(--t) * 3px), 15px);
		gap: 4px;
	}
	.hyp-page table.avail-table tbody td {
		font-size: clamp(15px, calc(15px + var(--t) * 3px), 18px);
	}
	.hyp-page .avail-legend {
		gap: clamp(12px, calc(12px + var(--t) * 6px), 18px);
		font-size: clamp(13px, calc(13px + var(--t) * 2px), 15px);
		padding-left: clamp(0px, calc(8px + var(--t) * -8px), 8px);
		padding-right: clamp(0px, calc(8px + var(--t) * -8px), 8px);
	}
	.hyp-page .avail-legend .mark {
		font-size: var(--fluid-15-20);
	}

	/* ---- CTA（ふくろう＋キャッチ＋LINEボタン） ---- */
.hyp-page .hero__cta-row {
		order: 6;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: flex-end;
		width: 100%;
		row-gap: 0;
		column-gap: clamp(12px, calc(12px + var(--t) * 8px), 20px);
		margin-top: clamp(0px, calc(12px + var(--t) * -12px), 12px);
	}
	.hyp-page .hero__cta-row .owl {
		width: clamp(66px, calc(66px + var(--t) * 84px), 150px);
		height: clamp(51px, calc(51px + var(--t) * 115.5px), 166.5px);
		max-width: none;
		flex-shrink: 0;
		object-fit: cover;
		object-position: top;
	}
	.hyp-page .hero__cta-copy {
		display: contents;
	}
	.hyp-page .hero__cta-copy .catch {
		font-size: var(--fluid-15-20);
		padding-bottom: clamp(10px, calc(12px + var(--t) * -2px), 12px);
	}
	.hyp-page .hero__cta-copy .hyp-btn-line {
		order: 3;
		flex-basis: 100%;
		width: 100%;
		max-width: none;
		height: 60px;
		font-size: clamp(16px, calc(16px + var(--t) * 8px), 24px);
		letter-spacing: 0.1em;
		padding-top: clamp(12px, calc(12px + var(--t) * 4px), 16px);
		padding-right: clamp(20px, calc(32px + var(--t) * -12px), 32px);
		padding-bottom: clamp(12px, calc(12px + var(--t) * 4px), 16px);
		padding-left: clamp(20px, calc(32px + var(--t) * -12px), 32px);
		gap: 0;
	}
	.hyp-page .hero__cta-copy .hyp-btn-line img {
		width: clamp(34px, calc(34px + var(--t) * 13px), 47px);
		height: clamp(32px, calc(32px + var(--t) * 12px), 44px);
		margin-right: clamp(12px, calc(12px + var(--t) * 4px), 16px);
	}
	.hyp-page .hero__cta-copy .hyp-btn-line .hyp-dot {
		width: clamp(6px, calc(6px + var(--t) * 2px), 8px);
		height: clamp(6px, calc(6px + var(--t) * 2px), 8px);
		margin-left: 40px;
	}
}

/* ==============================================================
   2. 継続率 STATS（濃紺バナー）
   ============================================================== */
.hyp-page .stats {
	background: var(--c-blue-deep);
	border-radius: 88px;
	padding: 96px 90px;
	margin-bottom: 51px;
}
.hyp-page .stats::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -31px;
	transform: translateX(-50%);
	width: 120px;
	height: 33px;
	background: url("data:image/svg+xml,%3Csvg width='120' height='33' viewBox='0 0 120 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M107.657 5.00257C112.356 0.915725 118.145 0.169579 120 0H0C1.85546 0.169579 7.6437 0.915725 12.3429 5.00257C14.1782 6.59661 15.3277 8.25848 16.0739 9.64902C16.316 10.2256 16.5782 10.8191 16.8807 11.3787C16.8807 11.4126 16.921 11.4635 16.921 11.4974C16.921 11.4974 16.921 11.4974 16.921 11.4805C23.4151 24.0462 40.2353 33 60 33C79.7445 33 96.5647 24.0463 103.059 11.4974C103.059 11.4974 103.059 11.4805 103.059 11.4635C103.382 10.8361 103.684 10.1917 103.946 9.54728C104.692 8.17369 105.842 6.54574 107.637 5.00257H107.657Z' fill='%232A60A7'/%3E%3C/svg%3E") no-repeat center / contain;
	pointer-events: none;
}
.hyp-page .stats__tag {
	display: block;
	width: fit-content;
	margin: 0 auto 22px;
	background: #fff;
	color: var(--c-navy);
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	letter-spacing: 0.05em;
	padding: 20px 40px;
	border-radius: 40px;
	position: relative;
}
.hyp-page .stats__tag::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -10px;
	transform: translateX(-50%);
	width: 40px;
	height: 11px;
	background: url("data:image/svg+xml,%3Csvg width='40' height='11' viewBox='0 0 40 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M35.8857 1.66752C37.4521 0.305241 39.3815 0.0565262 40 0H0C0.618487 0.0565262 2.5479 0.305241 4.11429 1.66752C4.72605 2.19887 5.10924 2.75283 5.35798 3.21634C5.43866 3.40853 5.52605 3.60637 5.62689 3.79291C5.62689 3.80421 5.64034 3.82117 5.64034 3.83248C5.64034 3.83248 5.64034 3.83248 5.64034 3.82682C7.80504 8.01542 13.4118 11 20 11C26.5815 11 32.1882 8.01542 34.3529 3.83248C34.3529 3.83248 34.3529 3.82682 34.3529 3.82117C34.4605 3.61202 34.5613 3.39723 34.6487 3.18243C34.8975 2.72456 35.2807 2.18191 35.879 1.66752H35.8857Z' fill='white'/%3E%3C/svg%3E") no-repeat center / contain;
}
.hyp-page .stats__title {
	text-align: center;
	color: #fff;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 40px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	margin-bottom: 64px;
}
.hyp-page .stats__cards, .hyp-page .price-boxes__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}
.hyp-page .stat-card {
	background: #fff;
	border-radius: var(--radius-l);
	padding: 48px 40px 0;
}
.hyp-page .stat-card h3 {
	text-align: center;
	font-size: 32px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0 0 24px;
}

.hyp-page .stat-card .sec-dot {
	width: 100%;
	max-width: 18px;
}

.hyp-page .stat-card .sec-dot.left {
	margin: 8px auto 32px;
}

.hyp-page .stat-card .sec-dot.right {
	margin: 8px auto 9px;
}


.hyp-page .stat-chart {
	width: 100%;
	height: auto;
}

.hyp-page img.stat-chart {
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
}

.hyp-page .quote-bubble {
	margin-top: 20px;
	display: flex;
	align-items: start;
	justify-content: center;
}
.hyp-page .quote-bubble .bubble {
	background: var(--c-yellow);
	border-radius: 20px 20px 0 20px;
	padding: 16px 18px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.05em;
	color: var(--c-text);
	position: relative;
	flex: 1;
	margin-top: 10px;
	text-align: center;
}

.hyp-page .quote-bubble.male {
	margin-top: 40px;
}

.hyp-page .quote-bubble.female {
	margin-top: 28px;
}

.hyp-page .quote-bubble .bubble.left {
	max-width: 363px;
}

.hyp-page .quote-bubble .bubble.right {
	max-width: 316px;
}

.hyp-page .quote-bubble .bubble::after {
	content: "";
	position: absolute;
	right: -10px;
	bottom: 0px;
	width: 16px;
	height: 21px;
	background: url("data:image/svg+xml,%3Csvg width='16' height='21' viewBox='0 0 16 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 21H14.5561C15.9555 21 16.5325 19.2123 15.4001 18.401L5.98691 11.6451C2.22886 8.94564 0 4.60923 0 0V21Z' fill='%23FEE348'/%3E%3C/svg%3E") no-repeat center / contain;
}
.hyp-page .quote-bubble .avatar {
	width: 100%;
	max-width: 97px;
	height: auto;
	overflow: hidden;
	flex-shrink: 0;
	object-fit: cover;
}

/* ==============================================================
   SP (max-width: 768px) - 2. 継続率 STATS
   ============================================================== */
@media (max-width: 768px) {
	.hyp-page .hyp-inner {
		padding-left: clamp(0px, calc(var(--t) * 20px), 20px);
		padding-right: clamp(0px, calc(var(--t) * 20px), 20px);
	}
	.hyp-page .stats {
		border-radius: clamp(40px, calc(40px + var(--t) * 48px), 88px);
		padding-top: clamp(72px, calc(72px + var(--t) * 24px), 96px);
		padding-right: clamp(19px, calc(19px + var(--t) * 71px), 90px);
		padding-bottom: clamp(72px, calc(72px + var(--t) * 24px), 96px);
		padding-left: clamp(19px, calc(19px + var(--t) * 71px), 90px);
		margin-bottom: clamp(18px, calc(18px + var(--t) * 33px), 51px);
	}
	.hyp-page .stats::after {
		bottom: clamp(-33px, calc(-17px + var(--t) * -16px), -17px);
		width: clamp(65px, calc(65px + var(--t) * 55px), 120px);
		height: clamp(18px, calc(18px + var(--t) * 15px), 33px);
	}
	.hyp-page .stats__tag {
		font-size: clamp(18px, calc(18px + var(--t) * 4px), 22px);
		padding-top: clamp(17px, calc(17px + var(--t) * 3px), 20px);
		padding-right: clamp(32px, calc(32px + var(--t) * 8px), 40px);
		padding-bottom: clamp(17px, calc(17px + var(--t) * 3px), 20px);
		padding-left: clamp(32px, calc(32px + var(--t) * 8px), 40px);
	}

	.hyp-page .stats__title {
		font-size: var(--fluid-26-40);
		margin-bottom: clamp(40px, calc(40px + var(--t) * 24px), 64px);
	}

	.hyp-page .stats__cards {
		grid-template-columns: 1fr;
	}

	.hyp-page .stat-card {
		padding-top: 48px;
		padding-right: clamp(16px, calc(16px + var(--t) * 24px), 40px);
		padding-bottom: 0;
		padding-left: clamp(16px, calc(16px + var(--t) * 24px), 40px);
	}

	.hyp-page .stat-card h3 {
		font-size: clamp(20px, calc(20px + var(--t) * 12px), 32px);
		margin-bottom: clamp(16px, calc(16px + var(--t) * 8px), 24px);
	}

	.hyp-page .quote-bubble {
		align-items: end;
	}

	.hyp-page .quote-bubble.male {
		margin-top: clamp(32px, calc(32px + var(--t) * 8px), 40px);
	}

	.hyp-page .quote-bubble .avatar {
		max-width: clamp(70px, calc(70px + var(--t) * 27px), 97px);
	}

	.hyp-page .quote-bubble .bubble {
		font-size: var(--fluid-14-16);
		padding-right: clamp(16px, calc(16px + var(--t) * 2px), 18px);
		padding-left: clamp(16px, calc(16px + var(--t) * 2px), 18px);
		margin-top: clamp(0px, calc(var(--t) * 10px), 10px);
		margin-bottom: clamp(0px, calc(24px + var(--t) * -24px), 24px);
	}
}

/* ==============================================================
   3. ヤックルなら（写真コラージュ + 通院フィーチャー）
   ============================================================== */
.hyp-page .lifestyle {
	padding: 0 0 0;
}
.hyp-page .lifestyle__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 70px;
	justify-content: center;
}

.hyp-page .lifestyle__photos {
	display: flex;
	justify-content:
	center;
}

.hyp-page .lifestyle__photos img {
	width: 100%;
	max-width: 385px;
	height: auto;
}

.hyp-page .lifestyle__center {
	text-align: center;
	position: relative;
	bottom: -53px;
}

.hyp-page .lifestyle__center .tagline {
	color: var(--c-teal-info);
	font-weight: 700;
	font-size: 22px;
	line-height: 1.3;
	letter-spacing: 0.05em;
	margin: 0 0 10px;
}
.hyp-page .lifestyle__center h2 {
	font-family: var(--font-heading);
	font-weight: 700;
	color: var(--c-navy);
	font-size: 34px;
	line-height: 1.5;
	letter-spacing: 0.05em;
	margin: 0 0 44px 0;
}
.hyp-page .lifestyle__center .owl {
	width: 100%;
	max-width: 184px;
	margin: 18px auto 0;
	position: relative;
	bottom: 0;
}
.hyp-page img.owl--sp, .hyp-page .lifestyle__tiles {
	display: none;
}

/* ==============================================================
   SP (max-width: 768px) - 3. ヤックルなら
   ============================================================== */
@media (max-width: 768px) {
	.hyp-page .lifestyle__inner {
		flex-direction: column;
		align-items: center;
		position: relative;
		gap: 0;
		padding-top: max(48px, 12.8vw);
		padding-bottom: max(150px, 40vw);
	}
	.hyp-page .lifestyle__photos {
		display: none;
	}
	.hyp-page .lifestyle__center {
		bottom: 0;
	}
	.hyp-page .lifestyle__center .tagline {
		font-size: var(--fluid-16-22);
	}
	.hyp-page .lifestyle__center h2 {
		font-size: clamp(20px, calc(20px + var(--t) * 14px), 34px);
		margin-bottom: clamp(16px, calc(16px + var(--t) * 28px), 44px);
	}
	.hyp-page .lifestyle__center .owl {
		display: none;
	}
	.hyp-page .lifestyle__center .owl--sp {
		display: block;
		width: max(100px, 26.6667vw);
		height: max(82.938px, 22.1168vw);
		max-width: none;
		margin: 0 auto max(24px, 6.4vw);
	}

	.hyp-page .lifestyle__tiles {
		display: block;
	}
	.hyp-page .lifestyle__tiles-left, .hyp-page .lifestyle__tiles-right {
		display: contents;
	}
	.hyp-page .lifestyle__tile {
		position: absolute;
		border-radius: 16px;
		object-fit: cover;
	}
	.hyp-page .lifestyle__tile--1 {
		left: 0;
		top: max(205px, 54.6667vw);
		width: max(104px, 27.7333vw);
		height: max(104px, 27.7333vw);
		border-radius: 0 16px 16px 0;
		object-position: 78% 55%;
	}
	.hyp-page .lifestyle__tile--2 {
		left: max(46px, 12.2667vw);
		top: max(296px, 78.9333vw);
		width: max(115px, 30.6667vw);
		height: max(115px, 30.6667vw);
		object-position: 40% 30%;
	}
	.hyp-page .lifestyle__tile--3 {
		right: max(45px, 12vw);
		bottom: max(16.79px, 4.4773vw);
		width: max(120px, 32vw);
		height: max(120px, 32vw);
		object-position: 50% 40%;
	}
	.hyp-page .lifestyle__tile--4 {
		right: 0;
		top: max(179.15px, 47.7733vw);
		width: max(99px, 26.4vw);
		height: max(99px, 26.4vw);
		border-radius: 16px 0 0 16px;
		object-position: 42% 25%;
	}
}

/* ==============================================================
   4. 通院が続かない、をなくしました（mint 特徴セクション）
   ============================================================== */
.hyp-page .features {
	background: var(--c-mint);
	border-radius: 56px 56px 0 0;
	margin-top: 52px;
	padding: 70px 0 80px;
}

.hyp-page .features .hyp-inner {
	max-width: 1040px;
	padding: 0;
}

.hyp-page .features__head {
	text-align: center;
	margin-bottom: 64px;
}
.hyp-page .feature-row {
	display: flex;
	justify-content: start;
	gap: 48px;
	align-items: center;
	margin-bottom: 24px;
}

.hyp-page .feature-row.rev {
	justify-content: end;
}

.hyp-page .feature-row:last-child {
	margin-bottom: 72px;
}
.hyp-page .feature-row.rev {
	grid-template-columns: 1fr 380px;
}
.hyp-page .feature-row.rev .feature-row__media {
	order: 2;
}
.hyp-page .feature-row.rev .feature-row__body {
	order: 1;
}
.hyp-page .feature-row__media nt{
	width: 100%;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 412px;
}
.hyp-page .feature-row__media img {
	width: 100%;
	height: auto;
	object-fit: contain;
}

.hyp-page .feature-row__body {
	max-width: 560px;
}

.hyp-page .feature-row__media img.img-90days {
	max-width: 385px;
}

.hyp-page .feature-row__media img.img-doctor {
	max-width: 399px;
}

.hyp-page .feature-row__media img.img-post {
	max-width: 412px;
}

.hyp-page .feature-row__media img.img-hours {
	max-width: 422px;
}

.hyp-page .feature-row__tag {
	text-align: left;
	color: var(--c-teal-info);
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 0.05em;
	margin: 0 0 16px;
}
.hyp-page .feature-row__title {
	text-align: left;
	font-family: var(--font-heading);
	font-weight: 700;
	color: var(--c-text);
	font-size: 32px;
	line-height: 32px;
	letter-spacing: 0.05em;
	margin: 0 0 32px;
}
.hyp-page .feature-row__desc {
	text-align: left;
	color: var(--c-text);
	font-weight: 500;
	font-size: 16px;
	line-height: 1.8;
	letter-spacing: 0.05em;
}

.hyp-page .feature-row__desc span {
	display: block;
	margin-top: 16px;
}

.hyp-page .family-card {
	background: #fff;
	border-radius: var(--radius-xl);
	padding: 64px 64px 70px;
	margin-top: 50px;
	max-width: 1200px;
	margin: 0 auto;
}

.hyp-page .family-card h3 {
	text-align: center;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 32px;
	line-height: 32px;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0 0 24px;
}
.hyp-page .family-card .sec-dot {
	margin-top: 14px;
	max-width: 18px;
}
.hyp-page .family-cols {
	display: grid;
	grid-template-columns: repeat(3,1fr);
	gap: 30px;
	margin-top: 40px;
}
.hyp-page .family-cols figure {
	margin: 0;
}
.hyp-page .family-cols__photo {
	width: 100%;
	height: auto;
	border-radius: 16px;
}
.hyp-page .family-cols figcaption {
	text-align: center;
	margin-top: 18px;
}
.hyp-page .family-cols .cap-small {
	text-align: center;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0 0 14px;
}
.hyp-page .family-cols .cap-main {
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-teal-info);
	text-align: center;
	margin: 0 0 20px;
}
.hyp-page .family-cols p {
	text-align: left;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.8;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 14px 0 0;
}

/* ==============================================================
   SP (max-width: 768px) - 4. 通院が続かない、をなくしました
   ============================================================== */
@media (max-width: 768px) {
	/* ---- 共通パーツ（他セクションのtag-badgeにも影響する） ---- */
.hyp-page .tag-badge {
		font-size: var(--fluid-16-22);
		padding-top: var(--fluid-15-20);
		padding-right: clamp(32px, calc(32px + var(--t) * 8px), 40px);
		padding-bottom: var(--fluid-15-20);
		padding-left: clamp(32px, calc(32px + var(--t) * 8px), 40px);
	}
	.hyp-page .tag-badge::after {
		width: clamp(29px, calc(29px + var(--t) * 11px), 40px);
		height: clamp(8px, calc(8px + var(--t) * 3px), 11px);
		bottom: -7px;
	}
	.hyp-page .hyp-sec-heading.features__title {
		font-size: var(--fluid-26-40);
	}

	/* ---- セクション全体 ---- */
.hyp-page .features {
		padding-top: clamp(48px, calc(48px + var(--t) * 22px), 70px);
		padding-right: clamp(0px, calc(18.75px + var(--t) * -18.75px), 18.75px);
		padding-bottom: clamp(48px, calc(48px + var(--t) * 32px), 80px);
		padding-left: clamp(0px, calc(18.75px + var(--t) * -18.75px), 18.75px);
		border-radius: clamp(32px, calc(32px + var(--t) * 24px), 56px) clamp(32px, calc(32px + var(--t) * 24px), 56px) 0 0;
		margin-top: clamp(24px, calc(24px + var(--t) * 28px), 52px);
	}
	.hyp-page .features__head {
		margin-bottom: clamp(48px, calc(48px + var(--t) * 16px), 64px);
	}

	/* ---- feature-row（4件とも同一構成。PC版のleft/right交互配置は解除） ---- */
.hyp-page .feature-row, .hyp-page .feature-row.rev {
		flex-direction: column;
		align-items: center;
		gap: 0;
		margin-bottom: clamp(24px, calc(56px + var(--t) * -32px), 56px);
	}
	.hyp-page .feature-row.rev .feature-row__media, .hyp-page .feature-row.rev .feature-row__body {
		order: 0;
	}
	.hyp-page .feature-row__media {
		max-width: none;
		width: max(230px, 61.3333vw);
	}
	.hyp-page .feature-row__media img {
		width: 100%;
		height: 100%;
		aspect-ratio: 1 / 1;
		object-fit: cover;
		border-radius: 24px;
	}
	.hyp-page .feature-row__media img.img-90days, .hyp-page .feature-row__media img.img-doctor, .hyp-page .feature-row__media img.img-post, .hyp-page .feature-row__media img.img-hours {
		max-width: none;
	}
	.hyp-page .feature-row__body {
		max-width: none;
		width: 100%;
		margin-top: max(40px, 10.6667vw);
	}
	.hyp-page .feature-row__tag {
		text-align: center;
		font-size: clamp(14px, calc(14px + var(--t) * 4px), 18px);
		margin-bottom: clamp(8px, calc(8px + var(--t) * 8px), 16px);
	}
	.hyp-page .feature-row__title {
		text-align: center;
		font-size: var(--fluid-22-32);
		line-height: 1.3;
		margin-bottom: clamp(16px, calc(16px + var(--t) * 16px), 32px);
	}
	.hyp-page .feature-row__desc {
		font-size: var(--fluid-14-16);
	}

	/* ---- family-card（ご家族同時受診で さらに便利！） ---- */
.hyp-page .family-card {
		max-width: none;
		margin-top: clamp(50px, calc(72px + var(--t) * -22px), 72px);
		padding-top: clamp(48px, calc(48px + var(--t) * 16px), 64px);
		padding-right: clamp(16px, calc(16px + var(--t) * 48px), 64px);
		padding-bottom: clamp(48px, calc(48px + var(--t) * 22px), 70px);
		padding-left: clamp(16px, calc(16px + var(--t) * 48px), 64px);
		border-radius: clamp(24px, calc(24px + var(--t) * 8px), 32px);
	}
	.hyp-page .family-card h3 {
		font-size: var(--fluid-22-32);
		line-height: 1.3;
		margin-bottom: clamp(16px, calc(16px + var(--t) * 8px), 24px);
	}
	.hyp-page .family-cols {
		grid-template-columns: 1fr;
		gap: clamp(30px, calc(40px + var(--t) * -10px), 40px);
	}
	.hyp-page .family-cols figcaption {
		margin-top: clamp(18px, calc(32px + var(--t) * -14px), 32px);
	}
	.hyp-page .family-cols .cap-small {
		font-size: clamp(15px, calc(15px + var(--t) * 4px), 18px);
		margin-bottom: clamp(12px, calc(12px + var(--t) * 2px), 14px);
	}
	.hyp-page .family-cols .cap-main {
		font-size: clamp(18px, calc(18px + var(--t) * 6px), 22px);
		margin-bottom: clamp(16px, calc(16px + var(--t) * 4px), 20px);
	}
	.hyp-page .family-cols p {
		font-size: var(--fluid-14-16);
	}
}

/* ==============================================================
   5. 処方日数タブ
   ============================================================== */
.hyp-page .rx-days {
	padding: 96px 20px 0;
	text-align: center;
}
.hyp-page .rx-tabs {
	max-width: 1200px;
	margin: 50px auto 0;
}
.hyp-page .rx-tabs__nav {
	display: flex;
	gap: 8px;
}
.hyp-page .rx-tab-btn {
	flex: 1;
	padding: 22px 0;
	text-align: center;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 22px;
	line-height: 32px;
	letter-spacing: 0.05em;
	color: #fff;
	background: #8f9aa3;
	border: none;
	cursor: pointer;
	border-radius: 48px 48px 0 0;
}
.hyp-page .rx-tab-btn.hyp-is-active {
	background: var(--c-teal);
}
.hyp-page .rx-tabs__panels {
	background: var(--c-mint);
	border-radius: 0 0 24px 24px;
	padding: 80px;
}
.hyp-page .rx-panel {
	display: none;
}
.hyp-page .rx-panel.hyp-is-active {
	display: block;
}
.hyp-page .rx-panel__tag {
	color: var(--c-teal-info);
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 0.05em;
	margin: 0 0 16px;
}
.hyp-page .rx-panel__title {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 32px;
	line-height: 32px;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 6px 0 0;
}
.hyp-page .rx-panel__title + .sec-dot {
	margin-top: 12px;
	max-width: 18px;
}

.hyp-page .rx-list {
	text-align: left;
	margin-top: 36px;
}
.hyp-page .rx-item {
	--rx-ico-w: 80px;
	display: flex;
	gap: 32px;
	margin-bottom: 48px;
	position: relative;
}
.hyp-page .rx-item::after {
	content: "";
	position: absolute;
	left: calc(var(--rx-ico-w) / 2);
	transform: translateX(-50%);
	top: 44px;
	bottom: -48px;
	width: 6px;
	background: url("data:image/svg+xml,%3Csvg width='6' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='3' cy='3' r='3' fill='%23FEE348'/%3E%3C/svg%3E") repeat-y;
	background-size: 6px 12px;
}
.hyp-page .rx-item:last-child::after {
	bottom: 0;
}
.hyp-page .rx-item .ico {
	flex-shrink: 0;
	display: flex;
	align-items: start;
	justify-content: center;
}
.hyp-page .rx-item .ico img {
	width: 100%;
	max-width: var(--rx-ico-w);
	height: auto;
	position: relative;
	z-index: 1;
}
.hyp-page .rx-item .tx .tag {
	display: block;
	color: var(--c-navy);
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 0.05em;
	margin-bottom: 12px;
}
.hyp-page .rx-item .tx h4 {
	font-weight: 700;
	font-size: 24px;
	line-height: 32px;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0 0 16px;
}
.hyp-page .rx-item .tx p {
	font-weight: 400;
	font-size: 16px;
	line-height: 1.8;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0;
}

.hyp-page .rx-note-box {
	background: #fff;
	border-radius: 16px;
	padding: 29px 32px 24px;
	text-align: left;
}
.hyp-page .rx-note-box .ttl {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 6px;
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-navy);
}
.hyp-page .rx-note-box .ttl::before {
	content:"";
	width:9px;
	height:9px;
	border-radius:50%;
	background: var(--c-teal);
	display:inline-block;
}
.hyp-page .rx-note-box p {
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0;
}
/* ==============================================================
   6. 通院コスト比較
   ============================================================== */
.hyp-page .cost-compare {
	padding: 72px 0 0;
	text-align: center;
}
.hyp-page .cost-table-wrap {
	max-width: 1040px;
	margin: 40px auto 0;
	padding: 0 20px;
	position: relative;
}
.hyp-page .cost-flag {
	position: absolute;
	top: -34px;
	right: 60px;
	color: var(--c-orange);
	font-weight: 700;
	font-size: 14px;
}
.hyp-page .cost-scrollbar {
	display: none;
}
.hyp-page .cost-table {
	display: grid;
	grid-template-columns: minmax(0, 280px) repeat(3, 1fr);
	grid-template-rows: repeat(5, auto);
	column-gap: 16px;
	row-gap: 4px;
}
.hyp-page .cost-table__frame {
	grid-column: 4;
	grid-row: 1 / 6;
	margin: -8px -10px;
	background: #fff;
	border: 3px solid var(--c-orange);
	border-radius: 24px;
	z-index: 0;
}
.hyp-page .cost-table__cell {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f4f7f7;
	text-align: center;
	font-size: 16px;
	font-weight: 700;
	padding: 16px 8px;
	border-radius: 10px;
}

.hyp-page .cost-table__col-label {
	grid-column: 1;
	background: var(--c-blue-deep);
	color: #fff;
	justify-content: flex-start;
	text-align: left;
	padding: 18px 24px;
	border-radius: 16px;
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
	letter-spacing: 0.05em;
}

.hyp-page .cost-table__col-label.cost-table__row-head {
	background: transparent;
}

.hyp-page .cost-table__cell.cost-table__col-label.cost-table__row-medical {
	padding: 33.5px 14px;
}

.hyp-page .cost-table__note {
	font-weight: 700;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: #fff;
}
.hyp-page .cost-table__num {
	font-weight: 700;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: #fff;
}
.hyp-page .cost-table__unit {
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: #fff;
}
.hyp-page .cost-table__col-m1 {
	grid-column: 2;
	margin-left: -8px;
}
.hyp-page .cost-table__col-m2 {
	grid-column: 3;
	margin-left: -8px;
}

.hyp-page .cost-table__col-m1:not(.cost-table__row-head), .hyp-page .cost-table__col-m2:not(.cost-table__row-head) {
	justify-content: center;
	text-align: left;
	font-weight: 400;
	font-size: 16px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text);
}

.hyp-page .cost-table__col-m3 {
	grid-column: 4;
	background: #ffece6;
	color: var(--c-orange);
	font-size: 18px;
	border-radius: 16px;
	line-height: 1;
	letter-spacing: 0.05em;
	padding: 16px 8px;
}
.hyp-page .cost-table__row-head {
	grid-row: 1;
}
.hyp-page .cost-table__row-visits {
	grid-row: 2;
}
.hyp-page .cost-table__row-time {
	grid-row: 3;
}
.hyp-page .cost-table__row-transport {
	grid-row: 4;
}
.hyp-page .cost-table__row-medical {
	grid-row: 5;
}
.hyp-page .cost-table__row-head.cost-table__col-m1, .hyp-page .cost-table__row-head.cost-table__col-m2 {
	background: var(--c-blue-deep);
	color:#fff;
	font-family: var(--font-heading);
	font-size: 20px;
	padding: 16px 0;
	border-radius: 16px;
}

.hyp-page .cost-table__row-head.cost-table__col-m3 {
	background: var(--c-orange);
	color: #fff;
	font-family: var(--font-heading);
	font-size: 20px;
	padding: 16px 0;
	border-radius: 16px;
}
.hyp-page .cost-foot {
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	letter-spacing: 0.05em;
	color: var(--c-text);
	text-align: right;
	margin-top: 18px;
	margin-bottom: 0;
}

/* ==============================================================
   7. 薬グリッド + 対応疾患
   ============================================================== */
.hyp-page .drugs {
	background: var(--c-mint);
	border-radius: 88px;
	margin: 90px 20px 0;
	margin-left:auto;
	margin-right:auto;
	padding: 70px 0 96px;
	text-align: center;
}

.hyp-page .drugs .sec-dot {
	margin: 0 auto 40px;
	max-width: 18px;
}

.hyp-page .drug-marquee {
	margin-top: 44px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 60px, #000 calc(100% - 60px), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 60px, #000 calc(100% - 60px), transparent);
}
.hyp-page .drug-track {
	display: flex;
	gap: 16px;
	width: max-content;
}
.hyp-page .drug-track--top {
	animation: drug-marquee-left 200s linear infinite;
}
.hyp-page .drug-track--bottom {
	animation: drug-marquee-right 200s linear infinite;
}
.hyp-page .drug-marquee:hover .drug-track {
	animation-play-state: paused;
}
.hyp-page .drug-track img {
	width: 100%;
	max-width: 160px;
	height: 160px;
	object-fit: contain;
	background: #fff;
	border-radius: 16px;
	flex: 0 0 auto;
}
@keyframes drug-marquee-left {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}
@keyframes drug-marquee-right {
	from {
		transform: translateX(-50%);
	}
	to {
		transform: translateX(0);
	}
}
.hyp-page .disease-card {
	background: #fff;
	border-radius: var(--radius-xl);
	max-width: 1200px;
	margin: 80px auto 0;
	padding: 64px 64px 72px;
}
.hyp-page .disease-card h3 {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 32px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0 0 24px;
}
.hyp-page .disease-tags {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-top: 34px;
}
.hyp-page .disease-tags li.disease-tags__break {
	flex-basis: 100%;
	width: 0;
	height: 0;
	margin: 0;
	padding: 0;
	border: none;
}
.hyp-page .disease-tags li a {
	border: 3px solid var(--c-border);
	color: var(--c-text);
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 0.05em;
	padding: 14px 30px;
	border-radius: 40px;
	display: flex;
	align-items: center;
	gap: 10px;
}
/* CTAボタン（.hyp-btn-line .hyp-dot）と同じ、ホバーで丸が広がり矢印が現れる
   アニメーションを疾患タグ用に流用。ボタンの緑ではなく、タグの丸の色（ティール）
   を基調にし、円が広がった際は矢印を白にして視認性を確保している。
   丸自体は.hyp-btn-lineと同様、::afterではなく実要素(.hyp-dot)にして
   その中にさらに::afterで拡大用の円を重ねる。 */
.hyp-page .disease-tags li a .hyp-dot {
	position: relative;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--c-teal-dark);
	flex: 0 0 6px;
}
.hyp-page .disease-tags li a .hyp-dot::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 24px;
	height: 24px;
	background-color: transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 11'%3E%3Cpath d='M10.4.34A1.072 1.072 0 009.64 0c-.14 0-.28.03-.42.08a1.055 1.055 0 00-.58.6c-.05.14-.08.28-.08.43 0 .15.03.29.09.42s.14.26.24.36l2.46 2.52H1.07c-.28 0-.56.12-.76.32-.2.21-.31.49-.31.78s.11.57.31.78c.2.21.47.32.76.32h10.27L8.88 9.13c-.2.21-.3.49-.3.77 0 .29.12.56.31.77.2.2.47.32.75.32s.55-.11.75-.31l4.29-4.4c.2-.21.31-.49.31-.78s-.11-.57-.31-.78L10.4.34z' fill='%23ffffff'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 0;
	border-radius: 50%;
	transform: translate(-50%, -50%) scale(0.2);
	transition: background-color 0.3s ease, background-size 0.3s ease, transform 0.3s ease;
}
@media (any-hover: hover) {
	.hyp-page .disease-tags li a:hover .hyp-dot::after {
		background-color: var(--c-teal-dark);
		background-size: 9px 7px;
		transform: translate(-50%, -50%) scale(1);
	}
}

/* ==============================================================
   8. 料金
   ============================================================== */
.hyp-page .pricing {
	padding: 90px 0 20px;
	text-align: center;
}
.hyp-page .price-boxes {
	max-width: 1200px;
	margin: 44px auto 0;
	padding: 0;
}
.hyp-page .price-boxes__head {
	display:flex;
	justify-content:center;
	align-items:center;
	gap: 14px;
	margin-bottom: 24px;
}
.hyp-page .price-boxes__head .owl {
	width: 60px;
}
.hyp-page .price-boxes__head .price-boxes__title {
	font-weight: 700;
	font-size: 32px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0;
}
.hyp-page .price-boxes__dot {
	margin-bottom: 70px;
	max-width: 18px;
}
.hyp-page .price-box {
	border-radius: var(--radius-l);
	padding: 72px 64px 52px;
	position: relative;
}
.hyp-page .price-box.home {
	background: var(--c-mint);
}
.hyp-page .price-box.pharmacy {
	background: #f2f4f5;
}
.hyp-page .price-box__badge {
	position: absolute;
	top: -66px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 49px;
	width: 100%;
}
.hyp-page .price-box .ribbon {
	position: relative;
	background: var(--c-blue-deep);
	color: #fff;
	font-weight: 700;
	font-size: 18px;
	line-height: 1.6;
	letter-spacing: 0.05em;
	padding: 20px 32px;
	border-radius: 20px 20px 0 20px;
}
.hyp-page .price-box .ribbon__hl {
	color: var(--c-yellow);
}
.hyp-page .price-box .ribbon::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: -16px;
	width: 16px;
	height: 21px;
	background: url("data:image/svg+xml,%3Csvg width='16' height='21' viewBox='0 0 16 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 21H14.5561C15.9555 21 16.5325 19.2123 15.4001 18.401L5.98691 11.6451C2.22886 8.94564 0 4.60923 0 0V21Z' fill='%232A60A7'/%3E%3C/svg%3E") no-repeat center / contain;
	transform: scaleX(1);
}
.hyp-page .price-box__owl {
	width: 100%;
	max-width: 112px;
}
.hyp-page .price-box h4 {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	font-size: 22px;
	font-weight: 800;
	margin: 10px 0 4px;
}
.hyp-page .price-box.home h4, .hyp-page .price-box.pharmacy h4 {
	font-weight: 700;
	font-size: 32px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0 0 16px;
}

.hyp-page .price-box__icon {
	width: 40px;
	height: 40px;
}
.hyp-page .price-box .cap {
	font-size: 13px;
	color: var(--c-teal-dark);
	font-weight: 700;
	margin: 0 0 40px;
}
.hyp-page .price-box.home .cap, .hyp-page .price-box.pharmacy .cap {
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-teal-info);
}
.hyp-page .price-box .row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	margin-bottom: 16px;
}
.hyp-page .price-box .pill {
	background: var(--c-blue-deep);
	color:#fff;
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	letter-spacing: 0.1em;
	padding: 16px 32px;
	border-radius: 100px;
	width: 100%;
	max-width: 113px;
	text-align:center;
}
.hyp-page .price-box .pill--pharmacy {
	background: var(--c-gray-pharmacy);
}
.hyp-page .price-box .amount {
	font-size: 22px;
	font-weight: 800;
}
.hyp-page .price-box .amount__num {
	font-weight: 700;
	font-size: 26px;
	line-height: 1.6;
	letter-spacing: 0.05em;
	color: var(--c-text);
}
.hyp-page .price-box .amount__unit {
	font-weight: 700;
	font-size: 20px;
	line-height: 1.6;
	letter-spacing: 0.05em;
	color: var(--c-text);
}
.hyp-page .price-box .amount .plus {
	font-weight: 700;
	font-size: 18px;
	line-height: 1.6;
	letter-spacing: 0.05em;
	color: var(--c-teal-info);
}
.hyp-page .price-box .amount .plus__mark {
	font-weight: 700;
	font-size: 22px;
	line-height: 1.6;
	letter-spacing: 0.05em;
	color: var(--c-teal-info);
	padding: 0 2px;
}

.hyp-page .plus__mark.highlight-mark{
	background: url("data:image/svg+xml,%3Csvg width='328' height='10' viewBox='0 0 328 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='328' height='25' rx='5' fill='%23FCE89D'/%3E%3C/svg%3E") no-repeat left bottom / 100% 20px;
}

.hyp-page .price-box .foot {
	font-size: 12px;
	color: var(--c-text-note);
	margin-top: 16px;
}
.hyp-page .price-box.home .foot, .hyp-page .price-box.pharmacy .foot {
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 47px 0 0;
}

.hyp-page .pay-note {
	max-width: var(--container);
	margin: 32px auto 0;
	padding: 18px 26px;
	border: 3px solid var(--c-border);
	border-radius: 14px;
	display: flex;
	align-items: center;
	gap: 40px;
	font-size: 14px;
	text-align: left;
}
.hyp-page .pay-note b {
	flex-shrink:0;
	display:flex;
	align-items:center;
	gap:8px;
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-navy);
}
.hyp-page .pay-note b::before {
	content:"";
	width:8px;
	height:8px;
	border-radius:50%;
	background: var(--c-teal);
	display:inline-block;
}
.hyp-page .pay-note span {
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	letter-spacing: 0.05em;
	color: var(--c-text);
}

.hyp-page .pill-price-table {
	max-width: 1040px;
	margin: 80px auto 0;
	padding: 0;
}
.hyp-page .pill-price-table h3 {
	text-align: center;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 32px;
	line-height: 1.5;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin: 0 0 24px;
}

.hyp-page .pill-price-table .sec-dot {
	max-width: 18px;
}

.hyp-page .ppt-scrollbar {
	display: none;
}

.hyp-page table.ppt {
	width: 100%;
	border-collapse: collapse;
	margin-top: 44px;
}
.hyp-page table.ppt thead th {
	background: transparent;
	color: #fff;
	font-weight: 700;
	padding: 0;
	font-size: 15px;
}
.hyp-page table.ppt thead th.ppt-corner {
	background: transparent;
}
.hyp-page .ppt-th-inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0;
	background: var(--c-blue-deep);
	border-radius: 16px;
	padding: 24px 0;
	margin-right: 8px;
}
.hyp-page table.ppt thead th.pharmacy-h .ppt-th-inner {
	background: #758696;
	margin-right: 0;
	margin-left: 8px;
}
.hyp-page table.ppt thead th img.ppt-th-icon {
	width: 26px;
	height: auto;
	flex-shrink: 0;
	margin-right: 6px;
}
.hyp-page .ppt-th-main {
	font-weight: 700;
	font-size: 24px;
	line-height: 32px;
	letter-spacing: 0.05em;
	color: var(--c-yellow);
}
.hyp-page .ppt-th-sub {
	font-weight: 700;
	font-size: 22px;
	line-height: 32px;
	letter-spacing: 0.05em;
}
.hyp-page .pill-price-table__foot {
	margin-top: 14px;
}
.hyp-page table.ppt td, .hyp-page table.ppt th {
	text-align: center;
	padding: 0;
}
.hyp-page table.ppt .drug-name-cell {
	text-align: center;
	max-width: 161px;
}
.hyp-page table.ppt .drug-name-cell__name {
	display: block;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text);
}
.hyp-page table.ppt .drug-name-cell__dose {
	display: block;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: var(--c-text);
	margin-top: 4px;
}
.hyp-page table.ppt .drug-name-cell img {
	width: 100%;
	max-width: 96px;
	margin-top: 8px;
	border-radius: 8px;
	margin: 20px auto 0;
}

.hyp-page table.ppt .price-cell {
	padding: 0 8px 4px 0;
}

.hyp-page table.ppt .price-cell.pharmacy {
	padding: 0 0 0 0;
}

.hyp-page table.ppt .price-cell.home.row-first {
	padding-top: 16px;
	padding-bottom: 4px;
}
.hyp-page table.ppt .price-cell.pharmacy.row-first {
	padding-top: 16px;
}
.hyp-page table.ppt .price-cell.home.row-group-start {
	padding-top: 16px;
}
.hyp-page table.ppt .price-cell.pharmacy.row-group-start {
	padding-top: 16px;
}

.hyp-page .price-card {
	display: flex;
	align-items: stretch;
	border-radius: 16px;
	overflow: hidden;
	gap: 4px;
}
.hyp-page .price-card__days {
	flex: 0 0 auto;
	min-width: 90px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2px;
	padding: 0 18px;
	color: #fff;
	text-align: center;
	border-radius: 16px;
	width: 100%;
	max-width: 120px;
}
.hyp-page .price-card__days-num {
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.1em;
}
.hyp-page .price-card__days-unit {
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.05em;
}
.hyp-page .price-card__days.home {
	background: var(--c-blue-deep);
}
.hyp-page .price-card__days.home.hl {
	background: #FF6332;
}
.hyp-page .price-card__days.pharmacy {
	background: #758696;
}

.hyp-page .price-card__detail {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 14px;
	padding: 20px 24px;
	border-radius: 16px;
}
.hyp-page .price-card__detail.home {
	background: var(--c-mint);
}
.hyp-page .price-card__detail.home.hl {
	background: #FFEFEA;
}
.hyp-page .price-card__detail.pharmacy {
	background: #F2F5F5;
}
.hyp-page .price-card__row {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 16px;
}
.hyp-page .price-card__label {
	font-size: 16px;
	font-weight: 500;
	color: var(--c-text-sub);
	line-height: 1;
	letter-spacing: 0.05em;
}
.hyp-page .price-card__amount {
	font-size: 16px;
	font-weight: 500;
	color: var(--c-text);
	line-height: 1;
	letter-spacing: 0.05em;
}
.hyp-page .price-card__detail.home.hl .price-card__label {
	color: #FF6332;
}
.hyp-page .price-card__detail.home.hl .price-card__amount {
	color: #FF6332;
	font-weight: 700;
}

/* ==============================================================
   9. STEPフロー
   ============================================================== */
.hyp-page .flow {
	background: var(--c-mint);
	border-radius: 88px;
	margin: 90px 20px 0;
	margin-left:auto;
	margin-right:auto;
	padding: 96px 20px;
	text-align:center;
}

.hyp-page .flow .hyp-sec-heading {
	font-size: 40px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.05em;
	margin: 0 0 64px;
}

.hyp-page .flow-steps {
	width: 100%;
	max-width: 1040px;
	margin: 50px auto 0;
	padding: 0;
}
.hyp-page .flow-step {
	background: #fff;
	border-radius: var(--radius-l);
	padding: 60px 56px;
	display: flex;
	align-items: start;
	gap: 32px;
	text-align: left;
	position: relative;
	margin-bottom: 40px;
}
.hyp-page .flow-step .owl {
	width: 100%;
	max-width: 120px;
	flex-shrink: 0;
}
.hyp-page .flow-step__body {
	flex: 1;
}
.hyp-page .flow-step__label {
	color: var(--c-navy);
	font-weight: 700;
	font-family: var(--font-heading);
	font-size: 18px;
	display:flex;
	align-items:center;
	line-height: 1;
	letter-spacing: 0.08em;
	gap: 8px;
	margin: 0 0 12px;
}
.hyp-page .flow-step__label::before {
	content:"";
	width:8px;
	height:8px;
	border-radius:50%;
	background:var(--c-teal-dark);
}
.hyp-page .flow-step__title {
	color: var(--c-text);
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 24px;
	line-height: 1;
	letter-spacing: 0.05em;
	margin: 0 0 24px;
}
.hyp-page .flow-step__desc {
	font-size: 16px;
	color: var(--c-text);
	letter-spacing: 0.05em;
	line-height: 1.8;
	margin: 0 0 16px;
}
.hyp-page .flow-step__btn {
	margin-top: 16px;
}
.hyp-page .flow-step__visual {
	width: 100%;
	max-width: 248px;
	flex-shrink: 0;
	margin-left: 20px;
}

.hyp-page .flow-step__visual img {
	border-radius: 16px;
	max-width: 248px;
	width: 100%;
}

.hyp-page .flow-step:not(:last-child)::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -36px;
	transform: translateX(-50%);
	width: 6px;
	height: 31px;
	background: url("data:image/svg+xml,%3Csvg width='6' height='516' viewBox='0 0 6 516' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 3V513' stroke='%23003C8C' stroke-width='6' stroke-miterlimit='3.8637' stroke-linecap='round' stroke-dasharray='0.1 12'/%3E%3C/svg%3E") no-repeat top center / 6px 516px;
}
.hyp-page .flow-step-pair .flow-step::after {
	content: none;
}
.hyp-page .flow-step.flow-step--branch::after {
	width: 546px;
	height: 95px;
	bottom: -102px;
	background: url("data:image/svg+xml,%3Csvg width='546' height='564' viewBox='0 0 546 564' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M273 3V513' stroke='%23003C8C' stroke-width='6' stroke-miterlimit='3.8637' stroke-linecap='round' stroke-dasharray='0.1 12'/%3E%3Cpath d='M543 561L543 523H3V561' stroke='%23003C8C' stroke-width='6' stroke-miterlimit='3.8637' stroke-linecap='round' stroke-linejoin='round' stroke-dasharray='0.1 12'/%3E%3C/svg%3E") no-repeat bottom center / 546px 564px;
}

.hyp-page .flow-step-pair {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin-top: 96px;
}

.hyp-page .flow-step-pair .flow-step {
	flex-direction: column;
	text-align: center;
	padding: 40px 48px;
	gap: 0;
}

.hyp-page .flow-step-pair .flow-step .owl {
	width: 100%;
	max-width: 120px;
	margin: 0 auto 16px;
}

.hyp-page .flow-step-pair .flow-step .owl.owl_drugstore{
	width: 100%;
	max-width: 160px;
	margin: 0 auto 16px;
}

.hyp-page .flow-step-pair .flow-step__label {
	justify-content: center;
	margin-bottom: 12px;
}

.hyp-page .flow-step-pair .flow-step__desc {
	text-align: center;
	margin-bottom: 0;
}

.hyp-page .flow-step-pair .flow-tags {
	display:flex;
	gap:10px;
	justify-content:center;
	margin: 0 0 32px;
	flex-wrap:wrap;
}
.hyp-page .flow-tag {
	background: var(--c-blue-deep);
	color:#fff;
	font-size: 14px;
	font-weight:700;
	letter-spacing: 0.05em;
	line-height: 1;
	padding: 12px 16px;
	border-radius: 20px;
}
.hyp-page .text-accent {
	color: var(--c-teal-dark);
}
.hyp-page .hyp-btn-line--flow {
	width: 100%;
	max-width: 246px;
	font-size: 16px;
	padding: 12px 22px;
}

/* ==============================================================
   10. FAQ
   ============================================================== */
.hyp-page .hyp-faq {
	padding: 90px 0 0;
}
.hyp-page .hyp-faq h2 {
	text-align: center;
	font-weight: 700;
	font-size: 40px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	color: var(--c-navy);
}
.hyp-page .hyp-faq-list {
	max-width: 1040px;
	margin: 46px auto 0;
	padding: 0;
}
.hyp-page .faq-item {
	position: relative;
	margin-bottom: 20px;
}
.hyp-page .hyp-faq-list {
	position: relative;
}

.hyp-page .faq-q {
	display: flex;
	align-items: center;
	gap: 16px;
	color: #fff;
	border-radius: 20px;
	cursor: pointer;
	font-weight: 700;
	font-size: 16px;
	position: relative;
	z-index: 1;
}
.hyp-page .faq-q .avatar {
	width: 100%;
	max-width: 78px;
	border-radius: 50%;
	border: 4px solid #fff;
	object-fit: cover;
	flex-shrink: 0;
	margin: 0;
}
.hyp-page .accordion-header {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	background: var(--c-blue-deep);
	padding: 24px 24px 24px 32px;
	border-radius: 20px 20px 20px 0;
	position: relative;
	margin-right: 102px;
}
.hyp-page .accordion-header::after {
	content: "";
	position: absolute;
	left: -16px;
	bottom: 0;
	width: 16px;
	height: 21px;
	background: url("data:image/svg+xml,%3Csvg width='16' height='21' viewBox='0 0 16 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 21H1.44388C0.0445318 21 -0.532519 19.2123 0.599944 18.401L10.0131 11.6451C13.7711 8.94564 16 4.60923 16 0V21Z' fill='%232A60A7'/%3E%3C/svg%3E") no-repeat center / contain;
}
.hyp-page .faq-q .qtext {
	flex: 1;
	display: flex;
	align-items: flex-start;
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.05em;
}
.hyp-page .faq-q .qtext b {
	flex-shrink: 0;
	color: #ffffff;
	margin-right: 6px;
	font-size: 20px;
}
.hyp-page .faq-q .qtext span, .hyp-page .faq-a p span {
	flex: 1;
	min-width: 0;
}
.hyp-page .faq-q .plus {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	background: url("../img/hypertension_lp/icon-plus.png") no-repeat center / 17px auto;
}
.hyp-page .faq-item.hyp-is-open .faq-q .plus {
	background-image: url("../img/hypertension_lp/icon-minus.png");
}
.hyp-page .faq-a {
	display: flex;
	align-items: end;
	gap: 20px;
	border-radius: 20px;
	margin-top: 0;
	height: 0;
	overflow: hidden;
	opacity: 0;
	font-size: 14px;
	color: var(--c-text-sub);
	position: relative;
	z-index: 1;
	/* align-items:endで中身を下寄せしているため、閉じるときは中身が
	   下端に張り付いたまま上から欠けていく形になり、高さだけの
	   アニメーションだと不自然に見える。opacityも一緒にフェードさせて
	   欠けていく感じをやわらげる。閉じる方が違和感が出やすいので
	   opacityは少し速め(0.25s)にして、閉じ終わる前に見えなくする。 */
	transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1), margin-top 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
}
.hyp-page .faq-item.hyp-is-open .faq-a {
	margin-top: 16px;
	opacity: 1;
	/* height はJS側(hypertension.js)で開閉のたびに実測してインラインで指定する */
}
.hyp-page .faq-a p {
	display: flex;
	align-items: flex-start;
	margin: 0 0 0 102px;
	flex: 1;
	background: var(--c-mint);
	padding: 24px 40px 24px 32px;
	border-radius: 20px 20px 0 20px;
	position: relative;
	font-size: 16px;
	line-height: 1.7;
	letter-spacing: 0.05em;
	gap: 8px;
}
.hyp-page .faq-a p::after {
	content: "";
	position: absolute;
	left: 100%;
	bottom: 0;
	width: 16px;
	height: 21px;
	background: url("data:image/svg+xml,%3Csvg width='16' height='21' viewBox='0 0 16 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 21H14.5561C15.9555 21 16.5325 19.2123 15.4001 18.401L5.98691 11.6451C2.22886 8.94564 0 4.60923 0 0V21Z' fill='%23EAF5F6'/%3E%3C/svg%3E") no-repeat center / contain;
}
.hyp-page .faq-a b {
	flex-shrink: 0;
	color: var(--c-teal-info);
	margin-right: 6px;
	font-size: 20px;
}
.hyp-page .faq-a .owl {
	width: 82px;
	flex-shrink: 0;
	margin-left: auto;
}

/* ==============================================================
   11. 注意事項
   ============================================================== */
.hyp-page .notice {
	background: var(--c-mint);
	border-radius: 88px 88px 0 0;
	margin-top: 120px;
	padding: 96px 0 88px;
}
.hyp-page .notice__inner {
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 20px;
	text-align: center;
	position: relative;
}
.hyp-page .notice h2 {
	font-weight: 700;
	font-size: 40px;
	line-height: 1.4;
	letter-spacing: 0.05em;
	color: var(--c-navy);
	margin: 0;
}

.hyp-page .notice-box {
	background: #fff;
	border-radius: var(--radius-l);
	max-width: 674px;
	margin: 40px auto 0;
	padding: 56px 72px 56px 56px;
	text-align: left;
	position: relative;
}

.hyp-page .notice-box li {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 16px;
}
.hyp-page .notice-box li:last-child {
	margin-bottom: 0;
}
.hyp-page .notice-box li .ex {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 2px solid var(--c-navy);
	color: var(--c-navy);
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:13px;
	font-weight:700;
	flex-shrink:0;
	margin-top:2px;
}
.hyp-page .notice-doctor {
	position: absolute;
    right: 165px;
    bottom: -100px;
    width: 100%;
    max-width: 200px;
}

/* ==============================================================
   12. 最終CTA
   ============================================================== */
.hyp-page .final-cta {
	background: var(--c-blue-deep);
	padding: 28px 0;
	margin-top: 0;
	position: relative;
	overflow:hidden;
}
.hyp-page .final-cta__inner {
	max-width: 1200px;
	margin: 0 auto;
	display:grid;
	grid-template-columns: 637px 443px;
	gap: 56px;
	align-items:center;
	position:relative;
	z-index:1;
}
.hyp-page .final-cta__maintxt {
	max-width: 637px;
	padding-left: 79px;
}
.hyp-page .final-cta h2 {
	color: #FFFFFF;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 34px;
	line-height: 1;
	letter-spacing: 0.05em;
	margin: 0 0 32px;
}
.hyp-page .final-cta p {
	color: #FFFFFF;
	font-weight: 400;
	font-size: 18px;
	line-height: 32.4px;
	letter-spacing: 0.05em;
	text-align: left;
	margin: 0 0 40px;
}
.hyp-page .final-cta__qr {
	width: 100%;
	max-width: 443px;
}
.hyp-page .final-cta .owl-deco {
	position: absolute;
    left: -56px;
    bottom: -62px;
    width: 100%;
    max-width: 156px;
    z-index: 0;
}

.hyp-page .final-cta .hyp-btn-line {
	max-width: 330px;
}


/* ==============================================================
   SP (max-width: 768px) - 5. 何日分もらえますか？
   + 6. 高血圧治療の通院コストの比較
   ============================================================== */
@media (max-width: 768px) {
	/* ----------------------------------------------------------
	   5. 処方日数タブ
	   ---------------------------------------------------------- */
.hyp-page .rx-days {
		padding: 72px 0 0;
		text-align: center;
	}

	.hyp-page .rx-days .tag-badge {
		width: 177px;
		height: 50px;
		justify-content: center;
		padding: 0;
		font-size: 16px;
		line-height: 1;
		border-radius: 25px;
	}
	.hyp-page .rx-days .tag-badge::after {
		width: 29px;
		height: 8px;
		bottom: -6px;
	}

	.hyp-page .hyp-sec-heading.rx-days__title {
		font-size: 26px;
		line-height: 1.4;
		letter-spacing: 0.05em;
		margin: 17px 18.75px 0;
	}

	.hyp-page .rx-days > .sec-lead {
		font-size: 15px;
		line-height: 1.6;
		letter-spacing: 0.05em;
		color: var(--c-text);
		margin: 16px 18.75px 0;
	}

	.hyp-page .rx-tabs {
		width: calc(100% - 37.5px);
		max-width: none;
		margin: 47px auto 0;
	}
	.hyp-page .rx-tabs__nav {
		gap: 4px;
	}
	.hyp-page .rx-tab-btn {
		height: 46px;
		padding: 0;
		font-size: 16px;
		line-height: 46px;
		letter-spacing: 0.05em;
		border-radius: 16px 16px 0 0;
		background: #758696;
	}
	.hyp-page .rx-tab-btn.hyp-is-active {
		background: var(--c-teal);
	}

	.hyp-page .rx-tabs__panels {
		padding: 40px 16px 16px;
		border-radius: 0 0 40px 40px;
	}
	.hyp-page .rx-panel__tag {
		font-size: 15px;
		line-height: 1;
		letter-spacing: 0.05em;
		margin: 0 0 8px;
	}
	.hyp-page .rx-panel__title, .hyp-page .disease-card h3, .hyp-page .pill-price-table h3 {
		font-size: 20px;
		line-height: 1.5;
		letter-spacing: 0.05em;
		margin: 0;
	}
	.hyp-page .rx-panel__title + .sec-dot {
		width: 18px;
		height: 10px;
		margin-top: 15px;
	}

	.hyp-page .rx-list {
		margin-top: 24px;
	}
	.hyp-page .rx-item {
		--rx-ico-w: 50px;
		gap: 14px;
		margin-bottom: 19px;
		align-items: flex-start;
	}
	.hyp-page .rx-item:nth-child(2) {
		margin-bottom: 19px;
	}
	.hyp-page .rx-item:last-child {
		margin-bottom: 0;
	}
	.hyp-page .rx-item::after {
		left: 25px;
		top: 50px;
		bottom: -19px;
		width: 5px;
		background: url("data:image/svg+xml,%3Csvg width='5' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='2.5' cy='2.5' r='2.5' fill='%23FEE348'/%3E%3C/svg%3E") repeat-y;
		background-size: 5px 12px;
	}
	.hyp-page .rx-item:last-child::after {
		bottom: 0;
	}
	.hyp-page .rx-item .ico {
		width: 50px;
	}
	.hyp-page .rx-item .ico img {
		width: 50px;
		max-width: 50px;
	}
	.hyp-page .rx-item .tx {
		min-width: 0;
		padding-top: 10px;
	}
	.hyp-page .rx-item .tx .tag {
		font-size: 14px;
		line-height: 20px;
		letter-spacing: 0.05em;
		margin-bottom: 6px;
	}
	.hyp-page .rx-item .tx h4 {
		font-size: 18px;
		line-height: 1.5;
		letter-spacing: 0.05em;
		margin: 0 0 8px;
	}
	.hyp-page .rx-item .tx p {
		font-size: 13px;
	}

	.hyp-page .rx-note-box {
		margin-top: 32px;
		padding: 23px;
		border-radius: 24px;
	}
	.hyp-page .rx-note-box .ttl {
		width: 230px;
		align-items: flex-start;
		gap: 11px;
		font-size: 15px;
		line-height: 23px;
		letter-spacing: 0.05em;
		margin: 0 0 10px;
	}
	.hyp-page .rx-note-box .ttl::before {
		flex: 0 0 auto;
		width: 9px;
		height: 9px;
		margin-top: 6px;
	}
	.hyp-page .rx-note-box p {
		font-size: 13px;
	}

	/* ----------------------------------------------------------
	   6. 通院コスト比較
	   ---------------------------------------------------------- */
.hyp-page .cost-compare {
		padding: 63px 0 0;
		text-align: center;
	}
	.hyp-page .hyp-sec-heading.cost-compare__title {
		width: 260px;
		margin: 0 auto;
		font-size: 22px;
		line-height: 30px;
		letter-spacing: 0.05em;
	}
	.hyp-page .cost-compare > .sec-dot {
		width: 18px;
		height: 10px;
		margin-top: 17px;
	}

	.hyp-page .cost-table-wrap {
		width: calc(100% - 16px);
		max-width: none;
		margin: 16px 0 0 16px;
		padding: 0;
		text-align: left;
	}
	.hyp-page .cost-flag {
		display: block;
		top: 0;
		right: auto;
		width: max-content;
		white-space: nowrap;
		font-size: 14px;
	}

	.hyp-page .cost-table {
		width: 100%;
		min-width: 0;
		display: grid;
		grid-template-columns: 139px 120px 120px 185px;
		grid-template-rows: 44px 60px 60px 60px 85px;
		column-gap: 4px;
		row-gap: 4px;
		padding: 37px 32px 35px 2.75px;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.hyp-page .cost-table::-webkit-scrollbar {
		display: none;
	}

	.hyp-page .cost-scrollbar {
		display: block;
		width: 95%;
		max-width: 100%;
		height: 5px;
		margin: 12px 0 0 2.75px;
		background: #e8ebeb;
		border-radius: 999px;
		overflow: hidden;
	}
	.hyp-page .cost-scrollbar__thumb {
		width: 100px;
		height: 100%;
		background: var(--c-teal);
		border-radius: 999px;
		transform: translateX(0);
	}

	.hyp-page .cost-table__frame {
		grid-column: 4;
		grid-row: 1 / 6;
		margin: -4px -4px -4px 0;
		border-radius: 16px;
	}
	.hyp-page .cost-table__cell {
		background: #f2f5f5;
		padding: 0 8px;
		border-radius: 12px;
		font-size: 16px;
		line-height: 1.5;
	}
	.hyp-page .cost-table__col-label {
		display: block;
		background: var(--c-blue-deep);
		color: #fff;
		padding: 12px 14px;
		border-radius: 12px;
		font-size: 14px;
		line-height: 1.4;
		letter-spacing: 0.05em;
		white-space: normal;
	}
	.hyp-page .cost-table__col-label.cost-table__row-head {
		background: transparent;
	}
	.hyp-page .cost-table__cell.cost-table__col-label {
		display: flex;
		align-items: center;
		padding-top: 0;
		padding-bottom: 0;
	}
	.hyp-page .cost-table__cell.cost-table__col-label.cost-table__row-transport, .hyp-page .cost-table__cell.cost-table__col-label.cost-table__row-medical {
		padding-right: 4px;
		white-space: nowrap;
	}
	.hyp-page .cost-table__cell.cost-table__col-label.cost-table__row-time {
		display: block;
		padding-top: 9px;
		padding-bottom: 9px;
	}
	.hyp-page .cost-table__note {
		font-size: 11px;
		line-height: inherit;
	}

	.hyp-page .cost-table__col-m1, .hyp-page .cost-table__col-m2 {
		margin-left: 0;
	}
	.hyp-page .cost-table__col-m1:not(.cost-table__row-head), .hyp-page .cost-table__col-m2:not(.cost-table__row-head) {
		justify-content: center;
		text-align: center;
		font-size: 14px;
		line-height: 1;
	}
	.hyp-page .cost-table__num {
		font-size: 16px;
	}
	.hyp-page .cost-table__unit {
		font-size: 14px;
	}
	.hyp-page .cost-table__col-m3 .cost-table__num {
		font-size: 17px;
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.05em;
	}
	.hyp-page .cost-table__col-m3 .cost-table__unit {
		font-size: 13px;
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.05em;
	}
	.hyp-page .cost-table__row-head.cost-table__col-m1, .hyp-page .cost-table__row-head.cost-table__col-m2, .hyp-page .cost-table__row-head.cost-table__col-m3 {
		padding: 0 8px;
		border-radius: 12px;
		font-size: 14px;
		line-height: 1;
		letter-spacing: 0.05em;
	}
	.hyp-page .cost-table__col-m3 {
		margin-left: 4px;
		padding: 0 8px;
		border-radius: 12px;
		font-size: 16px;
	}

	.hyp-page .cost-foot {
		width: auto;
		margin: 24px 0 0 0;
		font-size: 12px;
		line-height: 1.7;
		letter-spacing: 0.05em;
		text-align: left;
		white-space: normal;
	}
}


/* ==============================================================
   SP (max-width: 768px) - 7. いつも飲んでいる、お薬があります。
   ============================================================== */
@media (max-width: 768px) {
	.hyp-page .drugs {
		border-radius: 40px;
		padding: 72px 0 72px;
	}

	.hyp-page .hyp-sec-heading.drugs__title {
		font-size: 26px;
		line-height: 1.4;
		letter-spacing: 0.05em;
		margin: 0 0 16px;
	}

	.hyp-page .sec-lead.drugs__lead {
		font-size: 15px;
		line-height: 1.6;
		letter-spacing: 0.05em;
		color: var(--c-text);
		margin: 0 0 48px;
	}

	.hyp-page .drug-marquee {
		margin: 0;
		gap: 10px;
		overflow: hidden;
		-webkit-mask-image: none;
		mask-image: none;
	}
	.hyp-page .drug-track {
		gap: 10px;
	}
	.hyp-page .drug-track--top {
		margin-left: -16.5px;
	}
	.hyp-page .drug-track--bottom {
		margin-left: 1.5px;
	}
	.hyp-page .drug-track img {
		width: 90px;
		max-width: none;
		height: 90px;
		border-radius: 16px;
		flex: 0 0 90px;
	}

	.hyp-page .disease-card {
		width: calc(100% - 37.5px);
		max-width: none;
		border-radius: 40px;
		margin: 72px auto 0;
		padding: 48px 17.5px 49.5px;
	}
	.hyp-page .disease-card .sec-dot {
		width: 18px;
		height: 10px;
		margin: 16px auto 32px;
	}
	.hyp-page .disease-tags {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
		margin: 0;
	}
	.hyp-page .disease-tags li a {
		width: 100%;
		border: 3px solid var(--c-border);
		border-radius: 100px;
		padding: 12px 20px;
		font-size: 13px;
		line-height: 18px;
		letter-spacing: 0.05em;
		justify-content: space-between;
		gap: 0;
		white-space: nowrap;
		margin: 0;
	}

	.hyp-page .disease-tags li:nth-child(4) a {
		font-size: 11px;
	}
	.hyp-page .disease-tags li.disease-tags__break {
		display: none;
	}
	/* .hyp-dotのサイズ(6px)はPC/SP共通のためSP独自の上書きは不要 */
}

/* ==============================================================
   SP (max-width: 768px) - 8. オンライン診療の料金について
   ============================================================== */
@media (max-width: 768px) {
	.hyp-page .pricing {
		background: #fff;
		border-radius: 88px 88px 0 0;
		padding: 72px 0;
		text-align: center;
		overflow: hidden;
	}

	.hyp-page .hyp-sec-heading.pricing__title {
		margin: 0 auto 16px;
		font-size: 26px;
		line-height: 1.4;
		letter-spacing: 0.05em;
	}

	.hyp-page .sec-lead.pricing__lead {
		margin: 0 auto;
		font-size: 15px;
		line-height: 1.6;
		letter-spacing: 0.05em;
		color: var(--c-text);
	}

	.hyp-page .price-boxes {
		width: 100%;
		max-width: none;
		margin: 65px auto 0;
		padding: 0;
	}
	.hyp-page .price-boxes__head {
		margin: 0;
		gap: 0;
	}
	.hyp-page .price-boxes__head .price-boxes__title {
		font-size: 20px;
		line-height: 28px;
		letter-spacing: 0.05em;
	}
	.hyp-page .price-boxes__dot {
		width: 18px;
		height: 10px;
		margin: 17px auto 48px;
	}

	.hyp-page .price-boxes__grid {
		width: calc(100% - 37.5px);
		margin: 0 auto;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}
	.hyp-page .price-box {
		height: 429px;
		border-radius: 20px;
		padding: 40px 12px 24px;
	}

	.hyp-page .price-box__badge {
		top: -34px;
		left: 10px;
		transform: none;
		width: auto;
		justify-content: flex-start;
		gap: 12px;
	}
	.hyp-page .price-box .ribbon {
		width: 82px;
		min-height: 58px;
		padding: 7px 9px 8px;
		border-radius: 12px 12px 0 12px;
		font-size: 12px;
		line-height: 17px;
		letter-spacing: 0.05em;
		text-align: left;
	}
	.hyp-page .price-box .ribbon::after {
		right: -10px;
		width: 10px;
		height: 14px;
	}
	.hyp-page .price-box__owl {
		width: 62px;
		max-width: 62px;
	}

	.hyp-page .price-box h4, .hyp-page .price-box.home h4, .hyp-page .price-box.pharmacy h4 {
		flex-direction: column;
		gap: 10px;
		margin: 0 0 4px;
		font-size: 16px;
		line-height: 1.4;
		letter-spacing: 0.05em;
		white-space: nowrap;
	}
	.hyp-page .price-box__icon {
		width: 26px;
		height: 26px;
	}
	.hyp-page .price-box .cap, .hyp-page .price-box.home .cap, .hyp-page .price-box.pharmacy .cap {
		margin: 0 0 24px;
		font-size: 12px;
		line-height: 1.4;
		letter-spacing: 0.05em;
		white-space: nowrap;
	}

	.hyp-page .price-box .row {
		flex-direction: column;
		gap: 4px;
		margin: 0 0 16px;
	}
	.hyp-page .price-box .row:nth-of-type(2) {
		margin-bottom: 16px;
	}
	.hyp-page .price-box .pill, .hyp-page .price-box .pill--pharmacy {
		width: 100%;
		max-width: 84px;
		padding: 8px 24px;
		font-size: 16px;
		line-height: 1;
		letter-spacing: 0.1em;
	}
	.hyp-page .price-box .amount {
		font-size: 18px;
		line-height: 1.6;
		white-space: nowrap;
	}
	.hyp-page .price-box .amount__num {
		font-size: 22px;
		line-height: 1.6;
		letter-spacing: 0.05em;
	}
	.hyp-page .price-box .amount__unit {
		font-size: 16px;
		line-height: 1.6;
		letter-spacing: 0.05em;
	}
	.hyp-page .price-box .amount .plus {
		font-size: 17px;
		line-height: 1.6;
		letter-spacing: 0.05em;
	}
	.hyp-page .price-box .amount .plus__mark {
		font-size: 14px;
		line-height: 1.6;
		letter-spacing: 0.05em;
	}
	.hyp-page .plus__mark.highlight-mark {
		background-size: 100% 8px;
	}

	.hyp-page .price-box.home .foot, .hyp-page .price-box.pharmacy .foot {
		margin: 24px 0 0;
		font-size: 12px;
		font-weight: 500;
		line-height: 1.7;
		letter-spacing: 0.05em;
		text-align: left;
	}
	.hyp-page .price-box.pharmacy .foot {
		margin-top: 29px;
	}

	.hyp-page .pay-note {
		width: calc(100% - 40.5px);
		max-width: none;
		height: auto;
		margin: 24px auto 0;
		padding: 28px 24px 24px;
		border-width: 3px;
		border-radius: 16px;
		display: block;
		font-size: inherit;
	}
	.hyp-page .pay-note b {
		gap: 10px;
		margin: 0 0 8px;
		font-size: 15px;
		line-height: 1;
		letter-spacing: 0.05em;
	}
	.hyp-page .pay-note b::before {
		width: 10px;
		height: 10px;
		flex: 0 0 10px;
	}
	.hyp-page .pay-note span {
		display: block;
		font-size: 14px;
		line-height: 1.7;
		letter-spacing: 0.05em;
	}

	.hyp-page .pill-price-table {
		width: 100%;
		max-width: none;
		margin: 72px auto 0;
		padding: 0;
		position: relative;
	}
	.hyp-page .pill-price-table .sec-dot {
		width: 18px;
		height: 10px;
		margin: 16px auto 0;
	}

	.hyp-page .ppt-scroll {
		width: 100%;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.hyp-page .ppt-scroll::-webkit-scrollbar {
		display: none;
	}

	.hyp-page .ppt-scrollbar {
		display: block;
		width: calc(100% - 37.5px);
		height: 6px;
		margin: 32px 18.75px 0;
		background: var(--c-mint);
		border-radius: 10px;
		overflow: hidden;
	}
	.hyp-page .ppt-scrollbar__thumb {
		width: 40%;
		height: 100%;
		background: var(--c-teal);
		border-radius: 10px;
		transform: translateX(0);
	}

	.hyp-page table.ppt {
		width: 570px;
		min-width: 570px;
		margin: 32px 0 0 18.75px;
		border-collapse: collapse;
		table-layout: fixed;
	}
	.hyp-page table.ppt thead th {
		height: 52px;
	}
	.hyp-page table.ppt thead th.ppt-corner {
		width: 116px;
		min-width: 116px;
	}
	.hyp-page table.ppt thead th.house-h {
		width: 231px;
		min-width: 231px;
	}
	.hyp-page table.ppt thead th.pharmacy-h {
		width: 223px;
		min-width: 223px;
	}
	.hyp-page .ppt-th-inner {
		width: 223px;
		height: 52px;
		padding: 0;
		margin: 0 8px 0 0;
		border-radius: 12px;
		gap: 6px;
	}
	.hyp-page table.ppt thead th.pharmacy-h .ppt-th-inner {
		margin: 0;
	}
	.hyp-page table.ppt thead th img.ppt-th-icon {
		width: 22px;
		margin: 0;
	}
	.hyp-page .ppt-th-main {
		font-size: 18px;
		line-height: 24px;
		letter-spacing: 0.05em;
	}
	.hyp-page .ppt-th-sub {
		font-size: 16px;
		line-height: 24px;
		letter-spacing: 0.05em;
	}

	.hyp-page table.ppt .drug-name-cell {
		width: 116px;
		min-width: 116px;
		max-width: 116px;
		vertical-align: top;
		padding-top: 14px;
		overflow: visible;
	}
	.hyp-page table.ppt .drug-name-cell__name {
		font-size: 14px;
		line-height: 18px;
		letter-spacing: 0.03em;
	}
	.hyp-page table.ppt .drug-name-cell__dose {
		font-size: 13px;
		line-height: 18px;
		letter-spacing: 0.03em;
		margin-top: 0;
	}
	.hyp-page table.ppt .drug-name-cell img {
		width: 70px;
		max-width: 70px;
		height: auto;
		border-radius: 0;
		margin: 14px auto 0;
	}

	.hyp-page table.ppt .price-cell, .hyp-page table.ppt .price-cell.home, .hyp-page table.ppt .price-cell.pharmacy {
		width: 223px;
		min-width: 223px;
		padding: 0 0 4px;
	}
	.hyp-page table.ppt .price-cell.home {
		width: 231px;
		min-width: 231px;
		padding-right: 8px;
	}
	.hyp-page table.ppt .price-cell.home.row-first, .hyp-page table.ppt .price-cell.pharmacy.row-first {
		padding-top: 8px;
		padding-bottom: 4px;
	}
	.hyp-page table.ppt .price-cell.home.row-group-start, .hyp-page table.ppt .price-cell.pharmacy.row-group-start {
		padding-top: 4px;
	}

	.hyp-page .price-card {
		width: 223px;
		height: 72px;
		gap: 4px;
		border-radius: 12px;
		overflow: visible;
	}
	.hyp-page .price-card__days {
		flex: 0 0 72px;
		width: 72px;
		min-width: 72px;
		max-width: 72px;
		height: 72px;
		padding: 0;
		border-radius: 12px;
		gap: 1px;
	}
	.hyp-page .price-card__days-num {
		font-size: 18px;
		line-height: 1;
		letter-spacing: 0.05em;
	}
	.hyp-page .price-card__days-unit {
		font-size: 15px;
		line-height: 1;
		letter-spacing: 0;
	}
	.hyp-page .price-card__detail {
		flex: 0 0 147px;
		width: 147px;
		height: 72px;
		padding: 0 10px;
		border-radius: 12px;
		gap: 6px;
	}
	.hyp-page .price-card__row {
		justify-content: center;
		gap: 10px;
	}
	.hyp-page .price-card__label, .hyp-page .price-card__amount {
		font-size: 13px;
		line-height: 18px;
		letter-spacing: 0.02em;
		white-space: nowrap;
	}
	.hyp-page .price-card__detail.home.hl .price-card__amount {
		font-size: 13px;
	}

	.hyp-page .pill-price-table__foot, .hyp-page .cost-foot.pill-price-table__foot {
		width: 100%;
		max-width: 337.5px;
		margin: 24px 18.75px 0;
		font-size: 12px;
		line-height: 20px;
		letter-spacing: 0;
		text-align: left;
		position: relative;
	}

	.hyp-page .pill-price-table__foot::before, .hyp-page .pill-price-table__foot::after {
		content: "";
		position: absolute;
		top: -31px;
		left: -2.75px;
		height: 5px;
		border-radius: 999px;
	}
}

/* ==============================================================
   SP (max-width: 768px) - 9. オンライン診療利用からお薬が届くまで
   ============================================================== */
@media (max-width: 768px) {
	.hyp-page .flow {
		border-radius: 40px;
		padding: 72px 18.75px 72px;
		text-align: center;
		margin-top: 0;
	}

	.hyp-page .flow .hyp-sec-heading {
		width: 100%;
		margin: 0 0 48px;
		font-size: 26px;
		line-height: 36px;
		letter-spacing: 0.05em;
		color: var(--c-navy);
	}

	.hyp-page .flow-steps {
		width: 100%;
		max-width: none;
		margin: 0;
		padding: 0;
	}

	.hyp-page .flow-step {
		width: 100%;
		max-width: none;
		box-sizing: border-box;
		border-radius: 20px;
		padding: 0;
		gap: 0;
		margin: 0 0 32px;
		text-align: left;
		align-items: initial;
	}

	.hyp-page .flow-step__body {
		min-width: 0;
	}

	.hyp-page .flow-step__label {
		margin: 0;
		gap: 10px;
		font-size: 16px;
		line-height: 20px;
		letter-spacing: 0.08em;
	}
	.hyp-page .flow-step__label::before {
		width: 10px;
		height: 10px;
		flex: 0 0 10px;
	}

	.hyp-page .flow-step__title {
		margin: 0;
		font-size: 20px;
		line-height: 28px;
		letter-spacing: 0.05em;
	}

	.hyp-page .flow-step__desc {
		margin: 0;
		font-size: 14px;
		line-height: 1.7;
		letter-spacing: 0.05em;
	}

	/* STEP 1 --------------------------------------------------- */
.hyp-page .flow-steps > .flow-step:nth-child(1) {
		height: auto;
		padding: 32px 24px 24px;
		display: grid;
		grid-template-columns: 81px minmax(0, 1fr);
		grid-template-rows: 80px 24px 185px 24px 72px 16px 60px;
		column-gap: 24px;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .flow-step__body {
		display: contents;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) > .owl {
		grid-column: 1;
		grid-row: 1;
		width: 100%;
		max-width: 81px;
		height: auto;
		align-self: center;
		justify-self: start;
		margin: 0;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .flow-step__label {
		grid-column: 2;
		grid-row: 1;
		align-self: start;
		margin-top: 1px;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .flow-step__title {
		grid-column: 2;
		grid-row: 1;
		align-self: start;
		margin-top: 31px;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .flow-step__visual {
		grid-column: 1 / -1;
		grid-row: 3;
		width: 100%;
		max-width: 184px;
		margin: 0 auto;
		align-self: center;
		justify-self: center;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .flow-step__visual img {
		display: block;
		width: 184px;
		max-width: 184px;
		height: auto;
		border-radius: 0;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .flow-step__desc {
		grid-column: 1 / -1;
		grid-row: 5;
		align-self: start;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .flow-step__btn {
		grid-column: 1 / -1;
		grid-row: 7;
		width: 100%;
		margin: 0;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .hyp-btn-line--flow {
		position: relative;
		width: 100%;
		max-width: none;
		height: 60px;
		padding: 0 30px;
		border-radius: 30px;
		box-shadow: none;
		font-size: 16px;
		line-height: 1;
		letter-spacing: 0.05em;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(1) .hyp-btn-line--flow .hyp-dot {
		position: absolute;
		right: 42px;
		width: 7px;
		height: 7px;
		margin: 0;
	}

	/* STEP 2 / STEP 3 ---------------------------------------- */
.hyp-page .flow-steps > .flow-step:nth-child(2), .hyp-page .flow-steps > .flow-step:nth-child(3) {
		padding: 24px;
		display: grid;
		grid-template-columns: 96px minmax(0, 1fr);
		column-gap: 24px;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(2) {
		height: auto;
		grid-template-rows: 70px 16px 72px;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(3) {
		height: auto;
		grid-template-rows: 85px 12px 72px;
		margin-bottom: 0;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(2) .flow-step__body, .hyp-page .flow-steps > .flow-step:nth-child(3) .flow-step__body {
		display: contents;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(2) > .owl, .hyp-page .flow-steps > .flow-step:nth-child(3) > .owl {
		grid-column: 1;
		grid-row: 1;
		width: 87px;
		max-width: 87px;
		height: auto;
		align-self: center;
		justify-self: start;
		margin: 0;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(3) > .owl {
		width: 86px;
		max-width: 86px;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(2) .flow-step__label, .hyp-page .flow-steps > .flow-step:nth-child(3) .flow-step__label {
		grid-column: 2;
		grid-row: 1;
		align-self: start;
		margin-bottom: 10px;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(2) .flow-step__title, .hyp-page .flow-steps > .flow-step:nth-child(3) .flow-step__title {
		grid-column: 2;
		grid-row: 1;
		align-self: start;
		margin-top: 32px;
	}
	.hyp-page .flow-steps > .flow-step:nth-child(2) .flow-step__desc, .hyp-page .flow-steps > .flow-step:nth-child(3) .flow-step__desc {
		grid-column: 1 / -1;
		grid-row: 3;
		align-self: start;
	}

	.hyp-page .flow-step:not(:last-child)::after {
		left: 50%;
		bottom: -28px;
		width: 5px;
		height: 24px;
		transform: translateX(-50%);
		background: url("data:image/svg+xml,%3Csvg width='5' height='24' viewBox='0 0 5 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.5 2.5V21.5' stroke='%23003C8C' stroke-width='5' stroke-linecap='round' stroke-dasharray='0.1 12'/%3E%3C/svg%3E") no-repeat center / 5px 24px;
	}

	/* STEP 3 → STEP 4 分岐線 */
.hyp-page .flow-step.flow-step--branch::after {
		left: 50%;
		bottom: -80px;
		width: 177px;
		height: 80px;
		transform: translateX(-50%);
		background: url("data:image/svg+xml,%3Csvg width='177' height='80' viewBox='0 0 177 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M88.5 2.5V44' stroke='%23003C8C' stroke-width='5' stroke-linecap='round' stroke-dasharray='0.1 12'/%3E%3Cpath d='M2.5 44H174.5' stroke='%23003C8C' stroke-width='5' stroke-linecap='round' stroke-dasharray='0.1 12'/%3E%3Cpath d='M2.5 44V77.5' stroke='%23003C8C' stroke-width='5' stroke-linecap='round' stroke-dasharray='0.1 12'/%3E%3Cpath d='M174.5 44V77.5' stroke='%23003C8C' stroke-width='5' stroke-linecap='round' stroke-dasharray='0.1 12'/%3E%3C/svg%3E") no-repeat center / 177px 80px;
	}

	/* STEP 4 --------------------------------------------------- */
.hyp-page .flow-step-pair {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
		width: 100%;
		margin: 80px 0 0;
	}
	.hyp-page .flow-step-pair .flow-step {
		height: 390px;
		margin: 0;
		padding: 24px 12px;
		border-radius: 20px;
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 0;
	}
	.hyp-page .flow-step-pair .flow-step::after {
		content: none;
	}
	.hyp-page .flow-step-pair .flow-step__label {
		justify-content: center;
		font-size: 14px;
		line-height: 20px;
		letter-spacing: 0.08em;
		margin: 0 0 10px;
	}
	.hyp-page .flow-step-pair .flow-step__label::before {
		width: 9px;
		height: 9px;
		flex: 0 0 9px;
	}
	.hyp-page .flow-step-pair .flow-step__title {
		width: 100%;
		min-height: 46px;
		font-size: 16px;
		line-height: 23px;
		letter-spacing: 0.05em;
		margin: 0 0 18px;
	}
	.hyp-page .flow-step-pair .flow-tags {
		width: 100%;
		display: flex;
		flex-direction: column;
		gap: 6px;
		margin: 0 0 24px;
		flex-wrap: nowrap;
	}
	.hyp-page .flow-step-pair .flow-tag {
		width: 100%;
		height: 32px;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 5px;
		border-radius: 16px;
		font-size: 12px;
		line-height: 1;
		letter-spacing: 0.05em;
		white-space: nowrap;
	}
	.hyp-page .flow-step-pair .flow-step .owl {
		width: 91px;
		max-width: 91px;
		height: auto;
		margin: 0 auto 20px;
	}
	.hyp-page .flow-step-pair .flow-step .owl.owl_drugstore {
		width: 115px;
		max-width: 115px;
		height: auto;
		margin: 0 auto 20px;
	}
	.hyp-page .flow-step-pair .flow-step__desc {
		width: 100%;
		margin: 0;
		font-size: 14px;
		line-height: 1.6;
		letter-spacing: 0.05em;
		text-align: left;
	}
}

/* ==============================================================
   SP (max-width: 768px) - 10. よくあるご質問 / 11. 注意事項
   ============================================================== */
@media (max-width: 768px) {
	/* 10. FAQ --------------------------------------------------- */
.hyp-page .hyp-faq {
		box-sizing: border-box;
		height: auto;
		min-height: 0;
		padding: 72px 0 72px;
		background: #fff;
	}
	.hyp-page .hyp-faq h2, .hyp-page .hyp-faq .hyp-sec-heading {
		width: 100%;
		height: 44px;
		margin: 0;
		font-size: 32px;
		line-height: 44px;
		letter-spacing: 0.05em;
		text-align: center;
		color: var(--c-navy);
	}
	.hyp-page .hyp-faq-list {
		width: 100%;
		max-width: none;
		margin: 40px 0 0;
		padding: 0;
	}
	.hyp-page .faq-item {
		width: 100%;
		margin: 0 0 24px;
		position: relative;
	}
	.hyp-page .faq-item:last-child {
		margin-bottom: 0;
	}

	.hyp-page .faq-q {
		position: relative;
		display: block;
		width: 100%;
		min-height: 0;
		border-radius: 0;
		font-size: 16px;
	}
	.hyp-page .faq-q .avatar {
		position: absolute;
		left: 18.75px;
		bottom: 0;
		z-index: 2;
		width: 58px;
		height: 58px;
		max-width: 58px;
		margin: 0;
		border: 0;
		border-radius: 50%;
		object-fit: cover;
	}
	.hyp-page .accordion-header {
		box-sizing: border-box;
		width: calc(100% - 107.5px);
		margin: 0 18.75px 0 88.75px;
		padding: 16px 15px 16px 16px;
		border-radius: 16px 16px 16px 0;
		gap: 8px;
		background: var(--c-blue-deep);
	}
	.hyp-page .accordion-header::after {
		left: -11px;
		bottom: 0;
		width: 11px;
		height: 16px;
		background: url("data:image/svg+xml,%3Csvg width='11' height='16' viewBox='0 0 11 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 16H1.04C0.18 16 -0.17 14.9 0.52 14.4L6.95 9.78C9.52 7.93 11 4.97 11 1.82V16Z' fill='%232A60A7'/%3E%3C/svg%3E") no-repeat center / 11px 16px;
	}
	.hyp-page .faq-q .qtext {
		font-size: 16px;
		font-weight: 700;
		line-height: 24px;
		letter-spacing: 0.05em;
	}
	.hyp-page .faq-q .qtext b {
		font-size: 18px;
		line-height: 24px;
		margin-right: 5px;
	}
	.hyp-page .faq-q .plus {
		width: 20px;
		height: 20px;
		background-size: 17px auto;
	}
	.hyp-page .faq-item.hyp-is-open .faq-q .plus {
		background-size: 17px auto;
	}

	.hyp-page .faq-item:nth-child(1) .accordion-header, .hyp-page .faq-item:nth-child(2) .accordion-header, .hyp-page .faq-item:nth-child(6) .accordion-header {
		height: auto;
		min-height: 88px;
	}
	.hyp-page .faq-item:nth-child(3) .accordion-header, .hyp-page .faq-item:nth-child(4) .accordion-header, .hyp-page .faq-item:nth-child(5) .accordion-header {
		height: auto;
		min-height: 112px;
	}

	.hyp-page .faq-a {
		position: relative;
		display: block;
		width: 100%;
		height: 0;
		overflow: hidden;
		margin-top: 0;
		opacity: 0;
		border-radius: 0;
		font-size: 15px;
		gap: 0;
		align-items: initial;
		transition: height 0.4s cubic-bezier(0.4, 0, 0.2, 1), margin-top 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
	}
	.hyp-page .faq-item.hyp-is-open .faq-a {
		margin-top: 16px;
		opacity: 1;
		/* height はJS側(hypertension.js)で開閉のたびに実測してインラインで指定する */
	}
	.hyp-page .faq-a p {
		box-sizing: border-box;
		width: calc(100% - 107.5px);
		height: auto;
		min-height: 137px;
		margin: 0 18.75px 0 88.75px;
		padding: 20px 16px;
		border-radius: 16px 16px 16px 0;
		gap: 7px;
		font-size: 14px;
		line-height: 24px;
		letter-spacing: 0.03em;
		background: var(--c-mint);
	}
	.hyp-page .faq-a p::after {
		left: -11px;
		bottom: 0;
		width: 11px;
		height: 16px;
		background: url("data:image/svg+xml,%3Csvg width='11' height='16' viewBox='0 0 11 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 16H1.04C0.18 16 -0.17 14.9 0.52 14.4L6.95 9.78C9.52 7.93 11 4.97 11 1.82V16Z' fill='%23EAF5F6'/%3E%3C/svg%3E") no-repeat center / 11px 16px;
	}
	.hyp-page .faq-a b {
		font-size: 18px;
		line-height: 24px;
		margin-right: 0;
	}
	.hyp-page .faq-a .owl {
		position: absolute;
		left: 18.75px;
		bottom: 0;
		width: 58px;
		height: 58px;
		margin: 0;
	}

	/* 11. 注意事項 --------------------------------------------- */
.hyp-page .notice {
		box-sizing: border-box;
		height: 472px;
		margin-top: 0;
		padding: 72px 0 56px;
		border-radius: 40px 40px 0 0;
		background: var(--c-mint);
		overflow: hidden;
	}
	.hyp-page .notice__inner {
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		height: 344px;
		margin: 0;
		padding: 0 18.75px;
		position: relative;
	}
	.hyp-page .notice h2, .hyp-page .notice .hyp-sec-heading {
		width: 100%;
		height: 72px;
		margin: 0;
		font-size: 26px;
		line-height: 36px;
		letter-spacing: 0.05em;
		color: var(--c-navy);
		text-align: center;
	}
	.hyp-page .notice-box {
		box-sizing: border-box;
		width: 100%;
		height: 240px;
		max-width: none;
		margin: 32px auto 0;
		padding: 35px 25px 29px;
		border-radius: 20px;
		background: #fff;
		position: relative;
		z-index: 1;
	}
	.hyp-page .notice-box ul {
		margin: 0;
		padding: 0;
	}
	.hyp-page .notice-box li {
		min-height: 48px;
		margin: 0 0 16px;
		gap: 10px;
		font-size: 15px;
		font-weight: 700;
		line-height: 24px;
		letter-spacing: 0.03em;
		align-items: flex-start;
	}
	.hyp-page .notice-box li:last-child {
		margin-bottom: 0;
	}
	.hyp-page .notice-box li .ex {
		box-sizing: border-box;
		width: 22px;
		height: 22px;
		flex: 0 0 22px;
		margin-top: 0;
		border: 2px solid var(--c-navy);
		font-size: 12px;
		line-height: 1;
		color: var(--c-navy);
	}
	.hyp-page .notice-doctor {
		position: absolute;
		right: 31px;
		bottom: -59.4px;
		z-index: 2;
		width: 100px;
		height: 100px;
		max-width: 100px;
		margin: 0;
		object-fit: fill;
	}
}

/* ==============================================================
   SP (max-width: 768px) - 12. 最終CTA
   ============================================================== */
@media (max-width: 768px) {
	.hyp-page .final-cta {
		box-sizing: border-box;
		width: 100%;
		margin: 0;
		padding: 0 20px;
		background: var(--c-blue-deep);
		overflow: hidden;
	}
	.hyp-page .final-cta__inner {
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		margin: 0;
		padding: 56px 0 64px;
		display: block;
		position: relative;
	}
	.hyp-page .final-cta__maintxt {
		box-sizing: border-box;
		width: 100%;
		max-width: none;
		height: 100%;
		padding: 0;
		position: static;
		text-align: center;
	}
	.hyp-page .final-cta h2 {
		box-sizing: border-box;
		width: 100%;
		margin: 0 0 24px;
		color: #fff;
		font-family: var(--font-heading);
		font-size: 26px;
		font-weight: 700;
		line-height: 1.5;
		letter-spacing: 0.05em;
		text-align: center;
	}
	.hyp-page .final-cta p {
		box-sizing: border-box;
		width: 100%;
		margin: 0 0 32;
		color: #fff;
		font-size: 15px;
		font-weight: 500;
		line-height: 1.8;
		letter-spacing: 0.05em;
		text-align: left;
	}
	.hyp-page .final-cta .hyp-btn-line {
		box-sizing: border-box;
		margin: 0 auto;
		max-width: 305px;
		height: 60px;
		padding: 0 20px;
		border-radius: 30px;
		background: #05C756;
		box-shadow: none;
		font-size: 16px;
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.05em;
		gap: 0;
	}
	.hyp-page .final-cta .hyp-btn-line .hyp-dot {
		position: static;
		width: 8px;
		height: 8px;
		margin: 0 0 0 36px;
		flex: 0 0 8px;
	}
	.hyp-page .final-cta .owl-deco {
		position: absolute;
		left: 0;
		bottom: -26px;
		z-index: 2;
		width: 95px;
		height: auto;
		max-width: none;
		margin: 0;
	}
	.hyp-page .final-cta__qr {
		display: none !important;
	}
}