/* SFLP Auto Poster: 記事デザイン(Cocoon等のテーマと共存できるよう .sflp-article 配下のみ) */
.sflp-article { font-size: 1rem; line-height: 1.8; }
.sflp-article * { box-sizing: border-box; }

.sflp-article .sflp-pr {
	margin: 0 0 1.2em;
	padding: .5em .8em;
	font-size: .85em;
	color: #555;
	background: #f6f6f6;
	border-left: 4px solid #bbb;
}

.sflp-article .sflp-image { margin: 1.2em 0; text-align: center; }
.sflp-article .sflp-image img { display: inline-block; max-width: 100%; height: auto; }

.sflp-article .sflp-table-wrap { overflow-x: auto; margin: 1em 0; }
.sflp-article .sflp-table { width: 100%; border-collapse: collapse; }
.sflp-article .sflp-table th,
.sflp-article .sflp-table td {
	padding: .65em .8em;
	border: 1px solid #ddd;
	text-align: left;
	vertical-align: top;
	word-break: break-word;
}
.sflp-article .sflp-table th { width: 8em; background: #f5f7fa; font-weight: 600; white-space: nowrap; }

.sflp-article .sflp-list { margin: .8em 0 1.2em 1.2em; padding: 0; }
.sflp-article .sflp-list li { margin: .3em 0; }

.sflp-article .sflp-sample { position: relative; max-width: 644px; margin: 1em auto; aspect-ratio: 644 / 414; }
.sflp-article .sflp-sample iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.sflp-article .sflp-cta { margin: 1.8em 0; text-align: center; }
.sflp-article .sflp-btn {
	display: block;
	max-width: 480px;
	margin: 0 auto;
	padding: 1em 1.2em;
	font-weight: 700;
	line-height: 1.4;
	color: #fff !important;
	text-align: center;
	text-decoration: none !important;
	background: #d6336c;
	border-radius: 8px;
	box-shadow: 0 2px 0 rgba(0, 0, 0, .15);
}
.sflp-article .sflp-btn:hover,
.sflp-article .sflp-btn:focus { background: #b8285a; }

.sflp-article .sflp-credit { margin-top: 1.5em; font-size: .75em; text-align: right; color: #777; }
.sflp-article .sflp-credit a { color: inherit; }

@media (max-width: 600px) {
	.sflp-article .sflp-table th { width: 6.5em; white-space: normal; }
}

/* v2.2: モバイル向け・Cocoonとの競合を抑えるスコープ指定 */
.sflp-article.sflp-v22 { max-width: 860px; margin-inline: auto; line-height: 1.85; }
.sflp-article.sflp-v22 h2 { font-size: clamp(1.1rem, 2.7vw, 1.4rem); line-height: 1.5; margin: 2em 0 .85em; padding: .55em .8em; border-left: 4px solid #2274a5; border-bottom: 1px solid #dbe6ee; background: #f4f8fb; color: #18344a; }
.sflp-article.sflp-v22 .sflp-intro { margin: 1.1em 0 1.4em; }
.sflp-article.sflp-v22 .sflp-image { margin: 1.4em auto; }
.sflp-article.sflp-v22 .sflp-image img { max-height: 620px; object-fit: contain; border-radius: 6px; }
.sflp-article.sflp-v22 figcaption { font-size: .75em; color: #666; margin-top: .4em; }
.sflp-article.sflp-v22 .sflp-highlights { list-style: none; padding: .9em 1em; margin: 0 0 1.2em; background: #f5f8fb; border-radius: 8px; }
.sflp-article.sflp-v22 .sflp-highlights li { margin: .35em 0; overflow-wrap: anywhere; }
.sflp-article.sflp-v22 .sflp-highlights li::before { content: "✓ "; color: #2274a5; font-weight: bold; }
.sflp-article.sflp-v22 .sflp-table th { width: 9em; background: #f5f8fb; }
.sflp-article.sflp-v22 .sflp-table td { overflow-wrap: anywhere; }
.sflp-article.sflp-v22 .sflp-cta-note { display: block; font-size: .8em; color: #666; margin-top: .7em; }
@media(max-width:600px) {
 .sflp-article.sflp-v22 .sflp-table th { width: 6.8em; padding: .55em; white-space: normal; }
 .sflp-article.sflp-v22 .sflp-table td { padding: .55em; }
 .sflp-article.sflp-v22 h2 { margin-top: 1.5em; }
}