/* about/premium page styles */

/* 「※」付きテキスト */
.p-premium-note {
	font-size: var(--font-size-xs);
	line-height: 1.7;
	letter-spacing: 0.08em;
	position: relative;
	padding-left: 1em;
	color: #595959;
}

.p-premium-note::before {
	content: '※';
	position: absolute;
	top: 0;
	left: 0;
}

/* セクションレイアウト */
.p-premium-wrapper {
	display: grid;
	gap: var(--space-lg);
}

.p-premium-wrapper:not(:last-child) {
	margin-bottom: var(--space-3xl);
}

/* h2 */
.p-premium-ttl {
	font-size: var(--font-size-4xl);
	font-weight: var(--font-weight-bold);
	line-height: 1.5;
	letter-spacing: 0.08em;
	display: flex;
	align-items: center;
	margin-bottom: var(--space-sm);
}

.p-premium-ttl::before {
	content: '';
	width: 14px;
	height: 40px;
	background-color: #389bf5;
	margin-right: 14px;
	transform: translateY(3px);
}

@media screen and (max-width: 896px) {
	.p-premium-wrapper {
		gap: var(--space-md);
	}

	.p-premium-ttl {
		font-size: var(--font-size-3xl);
		margin-bottom: var(--space-xs);
	}

	.p-premium-ttl::before {
		width: 8px;
		height: 28px;
		margin-right: var(--space-xs);
		transform: none;
	}

	.p-premium-desc {
		line-height: 1.8;
	}
}

/*-----------------------------------------
2026年度
-------------------------------------------*/
.p-premium-label-wrapper {
	display: flex;
	gap: var(--space-md);
}

.p-premium-label {
	background-color: #f7f8f6;
	padding: var(--space-xs) var(--space-sm);
	color: var(--color-primary);
	font-size: var(--font-size-3xl);
	font-weight: var(--font-weight-medium);
	line-height: 1.5;
	letter-spacing: 0.08em;
	border-radius: 15px;
}

.p-premium-label__note {
	font-size: var(-font-size-sm);
	line-height: 1.8;
	letter-spacing: 0.08em;
	color: #595959;
	position: relative;
	padding-left: 1em;
}

.p-premium-label__note::before {
	content: '※';
	position: absolute;
	top: 0;
	left: 0;
}

@media screen and (max-width: 896px) {
	.p-premium-label-wrapper {
		flex-direction: column;
		gap: var(--space-xs);
	}

	.p-premium-label {
		padding: 0 var(--space-sm);
		font-size: var(--font-size-md);
		line-height: 2;
		width: fit-content;
		border-radius: 10px;
	}

	.p-premium-label__note {
		font-size: var(--font-size-xs);
		line-height: 1.7;
	}
}

/*-----------------------------------------
表（年間の掛金とその用途）
-------------------------------------------*/
.p-premium-table-wrapper {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin-bottom: var(--space-xs);
}

.p-premium-table-first {
	border-collapse: collapse;
	width: 100%;
	font-weight: var(--font-weight-medium);
	font-size: var(--font-size-xl);
	letter-spacing: 0.08em;
	line-height: 2.2;
	white-space: nowrap;
}

.p-premium-table-first th {
	padding-inline: 36px;
	color: var(--color-text-secondary);
	text-align: center;
	border-right: 2px solid var(--color-bg);
	vertical-align: middle;
	background-color: var(--color-primary);
}

.p-premium-table-first th:nth-child(1) {
	border-radius: 15px 0 0 0;
}
.p-premium-table-first th:nth-child(3) {
	border-radius: 0 15px 0 0;
	border-right: none;
}

.p-premium-table-first td {
	padding: var(--space-sm) 36px;
	text-align: center;
	vertical-align: middle;
}

.p-premium-table-first td:nth-child(1) {
	background-color: #f7f8f6;
	border-bottom: 2px solid var(--color-bg-sub);
	width: 16.36%;
}

.p-premium-table-first td:nth-child(2) {
	border-bottom: 2px solid var(--color-bg-sub);
	border-right: 2px solid var(--color-bg-sub);
	color: var(--color-primary);
	width: 16.36%;
}

.p-premium-table-first td:nth-child(3) {
	border-bottom: 2px solid var(--color-bg-sub);
	border-right: 2px solid var(--color-bg-sub);
	font-size: var(--font-size-md);
	line-height: 2;
	font-weight: var(--font-weight-regular);
}

@media print, screen and (max-width: 896px) {
	.p-premium-table-first {
		font-size: var(--font-size-sm);
	}

	.p-premium-table-first th {
		padding-inline: var(--space-md);
	}

	.p-premium-table-first td {
		padding: var(--space-xs) var(--space-sm);
	}

	.p-premium-table-first td:nth-child(3) {
		font-size: var(--font-size-sm);
		line-height: 1.8;
	}
}

/*-----------------------------------------
表（2026年度）
-------------------------------------------*/
.p-premium-table-second {
	border-collapse: collapse;
	width: 100%;
	font-weight: var(--font-weight-medium);
	white-space: nowrap;
}

.p-premium-table-second th {
	padding-inline: 36px;
	color: var(--color-text-secondary);
	text-align: center;
	border-right: 2px solid var(--color-bg);
	line-height: 2.2;
	vertical-align: middle;
	font-size: var(--font-size-xl);
}

.p-premium-table-second th:nth-child(1) {
	background-color: var(--color-primary);
	border-radius: 15px 0 0 0;
}
.p-premium-table-second th:nth-child(2) {
	background: rgba(56, 155, 245, 0.7);
}
.p-premium-table-second th:nth-child(3) {
	background-color: var(--color-primary);
	border-radius: 0 15px 0 0;
	border-right: none;
}

.p-premium-table-second td {
	padding: var(--space-sm) var(--space-xl);
	text-align: center;
}

.p-premium-table-second td:nth-child(1) {
	background: rgba(217, 232, 245, 0.3);
	border-bottom: 2px solid var(--color-bg);
	width: 36.36%;
}

.p-premium-table-second td:nth-child(2) {
	border-bottom: 2px solid var(--color-bg-sub);
}

.p-premium-table-second td:nth-child(3) {
	background: rgba(217, 232, 245, 0.3);
	border-bottom: 2px solid var(--color-bg);
	color: var(--color-primary);
	width: 45.45%;
}

@media print, screen and (max-width: 896px) {
	.p-premium-table-second th {
		padding-inline: var(--space-md);
		font-size: var(--font-size-sm);
	}

	.p-premium-table-second td {
		padding: var(--space-xs) var(--space-sm);
	}
}
