.migrated-content {
	box-sizing: border-box;
	display: flow-root;
	line-height: 1.7;
	overflow-wrap: anywhere;
	padding: 18px 20px;
}

.migrated-content h2,
.migrated-content h3,
.migrated-content h4 {
	clear: both;
	font-family: var(--font-display);
	color: var(--plum-deep);
	margin-top: 1.5em;
}

.migrated-content img,
.faq-answer img {
	height: auto;
	max-width: 100%;
}

.migrated-content table,
.faq-answer table {
	border-collapse: collapse;
	display: block;
	max-width: 100%;
	overflow-x: auto;
}

.migrated-content td,
.migrated-content th,
.faq-answer td,
.faq-answer th {
	border: 1px solid #ccc;
	padding: 0.4em 0.6em;
}

.migrated-content .news-date {
	color: var(--ink-soft, #666);
	font-size: 0.9em;
	margin-top: -0.5em;
}

.faq-category-nav {
	box-sizing: border-box;
	line-height: 1.6;
	margin-bottom: 28px;
	padding: 16px 20px;
	background: var(--sheet);
	border: 1px solid var(--line);
	border-radius: var(--radius-m);
	box-shadow: 0 2px 14px -8px hsl(var(--shadow) / .5);
}

.faq-category-nav h2 {
	font-family: var(--font-display);
	color: var(--plum-deep);
	font-size: 1.15em;
	margin: 0 0 10px;
}

.faq-category-nav ul {
	columns: 2 220px;
	margin: 0;
	padding-left: 1.5em;
}

.faq-category-nav li {
	break-inside: avoid;
	margin: 0.25em 0;
}

.faq-category {
	margin: 0 0 32px;
	scroll-margin-top: 12px;
}

.faq-category > h2 {
	font-family: var(--font-display);
	border-bottom: 3px double var(--gold);
	color: var(--plum-deep);
	font-size: 1.3em;
	margin: 0 0 14px;
	padding: 0 4px 8px;
}

.faq-item {
	background: var(--sheet);
	border: 1px solid var(--line);
	border-radius: var(--radius-m);
	margin: 0 0 10px;
	scroll-margin-top: 12px;
	box-shadow: 0 1px 6px -4px hsl(var(--shadow) / .5);
	transition: box-shadow .15s ease;
}
.faq-item:has(.faq-question[aria-expanded="true"]) {
	box-shadow: 0 4px 18px -8px hsl(var(--shadow) / .55);
}

.faq-item h3 {
	font-size: 1em;
	margin: 0;
	padding: 0;
	border: none;
}

.faq-question {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: var(--radius-m);
	box-sizing: border-box;
	color: var(--ink);
	cursor: pointer;
	display: flex;
	font: inherit;
	font-weight: 700;
	gap: 0.45em;
	line-height: 1.5;
	padding: 14px 44px 14px 16px;
	position: relative;
	text-align: left;
	width: 100%;
}

.faq-question:hover,
.faq-question:focus {
	background: var(--line-soft);
	outline: 2px solid transparent;
}

.faq-question:focus-visible {
	outline: 2px solid var(--indigo);
	outline-offset: -2px;
}

.faq-question-label,
.faq-answer-label {
	color: var(--plum);
	font-family: var(--font-display);
	font-size: 1.15em;
	font-weight: bold;
}

.faq-toggle::before,
.faq-toggle::after {
	background: var(--gold);
	content: "";
	height: 2px;
	position: absolute;
	right: 18px;
	top: 50%;
	transform: translateY(-50%);
	transition: transform 0.2s ease;
	width: 14px;
}

.faq-toggle::after {
	transform: translateY(-50%) rotate(90deg);
}

.faq-question[aria-expanded="true"] .faq-toggle::after {
	transform: translateY(-50%) rotate(0deg);
}

.faq-answer {
	box-sizing: border-box;
	line-height: 1.7;
	overflow-wrap: anywhere;
	padding: 14px 18px 18px 46px;
	position: relative;
}

.faq-answer[hidden] {
	display: none;
}

.faq-answer-label {
	left: 16px;
	position: absolute;
	top: 14px;
}

.faq-answer > :first-child:not(.faq-answer-label) {
	margin-top: 0;
}

@media screen and (max-width: 640px) {
	.migrated-content,
	.faq-answer {
		padding-left: 12px;
		padding-right: 12px;
	}

	.faq-answer-label {
		position: static;
	}

	.faq-category-nav ul {
		columns: 1;
	}
}

/* 利用方法ページ内に限定し、他の案内ページの表示を維持する。 */
div.content .getting-started { font-size: 18px; line-height: 1.8; overflow-wrap: anywhere; }
div.content .getting-started h1 { font-size: 32px; }
div.content .getting-started h2 { font-size: 24px; line-height: 1.5; }
div.content .getting-started h3 { font-size: 21px; line-height: 1.6; }
.getting-started .guide-lead { margin-bottom: 32px; }
.getting-started .guide-section { margin-bottom: 36px; }
.getting-started .guide-route { padding: 16px; background: var(--line-soft); border-radius: var(--radius-m); }
.getting-started .guide-links { display: flex; flex-wrap: wrap; gap: 12px 32px; }
.getting-started .guide-note { font-size: 16px; color: #555; }
div.content .getting-started .guide-steps { margin: 0; padding: 0; list-style: none; }
div.content .getting-started .guide-step { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 1fr); align-items: center; gap: 24px; margin: 20px 0; padding: 24px; text-indent: 0; background: var(--sheet); border: 1px solid var(--line); border-radius: var(--radius-m); }
.getting-started .guide-step > img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: contain; }
div.content .getting-started .guide-step h3 { margin: 0; padding: 0; background: none; border: 0; }
.getting-started .guide-step-number { display: block; color: var(--plum-deep); font-size: 18px; font-weight: bold; }
div.content .getting-started .guide-cta { display: inline-block; box-sizing: border-box; max-width: 100%; padding: 12px 20px; background: var(--plum, #a63760); border-radius: var(--radius-m); color: #fff; font-weight: bold; text-decoration: none; }
div.content .getting-started .guide-cta:hover { background: var(--plum-deep, #702340); }
div.content .getting-started a:focus-visible { outline: 3px solid var(--plum-deep); outline-offset: 4px; }
@media (max-width: 768px) {
 div.content .getting-started .guide-step { grid-template-columns: minmax(0, 1fr); padding: 16px; gap: 16px; }
 .getting-started .guide-step > img { max-width: 280px; margin: 0 auto; }
}

.getting-started .guide-new-window { width: 1em; height: auto; margin-left: .25em; vertical-align: -.12em; }
.getting-started .guide-start { padding: 20px; background: var(--line-soft); border-radius: var(--radius-m); }
div.content .getting-started .guide-start h3 { margin-top: 0; }
