/* Workstrust TOP：Chatwork 依頼の反映案（2026-10-02）。比較用ページからだけ読み込む。 */

/* ---------- 日本一やさしいシリーズ：4冊を色で見分ける ---------- */
body.wt-top-warm .wt1002-books .wt1002-book, .wt1002-books .wt1002-book { position: relative; border-top: 6px solid var(--wt1002-c) !important; }
.wt1002-books .wt1002-book .wt1002-tag { background: var(--wt1002-c) !important; color: #fff !important; padding: 3px 12px; border-radius: 6px; font-weight: 800; letter-spacing: .04em; }
.wt1002-books .wt1002-book .wtfi__art { background: var(--wt1002-soft); border-radius: 16px; }
.wt1002-books .wt1002-book .wtfi__btn { background: var(--wt1002-c) !important; border-color: var(--wt1002-c) !important; color: #fff !important; }
.wt1002-book--pm    { --wt1002-c: #d23a3a; --wt1002-soft: #fdeceb; }
.wt1002-book--i27001 { --wt1002-c: #1d5fae; --wt1002-soft: #e7f0fb; }
.wt1002-book--i27017 { --wt1002-c: #0f8577; --wt1002-soft: #e3f4f1; }
.wt1002-book--i27701 { --wt1002-c: #b86e0b; --wt1002-soft: #fbf0df; }
.wt1002-book--pm .wtfi__art img { filter: hue-rotate(155deg) saturate(1.1); }
.wt1002-book--i27001 .wtfi__art img { filter: none; }
.wt1002-book--i27017 .wtfi__art img { filter: hue-rotate(328deg) saturate(1.1); }
.wt1002-book--i27701 .wtfi__art img { filter: hue-rotate(190deg) saturate(1.2); }
.wt1002-training { padding-top: 0 !important; }


/* ---------- 参考価格：現行の見た目でも金額を主役に（温かみ案と同じ組み方） ---------- */
body.wt-top-1002 { --w-paper: #ffffff; --w-line: #d7e3ef; --w-shadow: 0 10px 28px rgba(16, 52, 96, .10); --w-accent: #c8102e; --w-accent-soft: #fdecee; --w-ink: #12305a; }
body.wt-top-1002 .wt-top-prices {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto !important;
	grid-template-areas: "label label label" "pm isms link" !important;
	align-items: stretch;
	gap: 12px 14px !important;
	margin-top: 26px !important;
	padding: 18px !important;
	background: var(--w-paper) !important;
	border: 1px solid var(--w-line) !important;
	border-radius: 20px !important;
	box-shadow: var(--w-shadow) !important;
}
body.wt-top-1002 .wt-top-prices > small {
	grid-area: label !important;
	justify-self: start;
	width: auto !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	margin: 0 !important;
	padding: 6px 14px !important;
	border-radius: 8px;
	background: var(--w-accent-soft) !important;
	color: #8a4a1f !important;
	font-size: 15px !important;
	font-weight: 800 !important;
	line-height: 1.5;
	text-align: center;
}
body.wt-top-1002 .wt-top-prices > p:nth-of-type(1) { grid-area: pm !important; }
body.wt-top-1002 .wt-top-prices > p:nth-of-type(2) { grid-area: isms !important; }
body.wt-top-1002 .wt-top-prices > p {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 18px;
	margin: 0 !important;
	padding: 14px 20px !important;
	background: #fff !important;
	border: 2px solid #f0e1d8 !important;
	border-radius: 14px !important;
	box-shadow: none !important;
}
body.wt-top-1002 .wt-top-prices > p > strong {
	flex: 0 0 100%;
	color: var(--w-ink) !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	line-height: 1.3;
}
body.wt-top-1002 .wt-warm-price {
	display: inline-flex !important;
	align-items: baseline;
	gap: 4px;
	color: var(--w-accent) !important;
	white-space: nowrap;
}
body.wt-top-1002 .wt-warm-price em {
	align-self: center;
	margin-right: 4px;
	padding: 3px 9px;
	border-radius: 7px;
	background: var(--w-accent-soft);
	color: #8a4a1f;
	font-size: 14px;
	font-style: normal;
	font-weight: 800;
	line-height: 1.4;
}
body.wt-top-1002 .wt-warm-price b {
	color: var(--w-accent);
	font-size: clamp(34px, 3vw, 44px);
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.01em;
	font-feature-settings: "palt";
}
body.wt-top-1002 .wt-warm-price i {
	color: var(--w-accent);
	font-size: 16px;
	font-style: normal;
	font-weight: 800;
}
body.wt-top-1002 .wt-top-prices > a {
	grid-area: link !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	padding: 12px 16px !important;
	border-radius: 12px;
	background: var(--w-ink) !important;
	color: #fff !important;
	font-size: 15px !important;
	font-weight: 800 !important;
	text-decoration: none !important;
	line-height: 1.5;
	transition: background-color 0.3s ease, transform 0.3s ease;
}
body.wt-top-1002 .wt-top-prices > a:hover,
body.wt-top-1002 .wt-top-prices > a:focus-visible { background: #2a4675 !important; }
body.wt-top-1002 .wt-top-prices > a span { color: #fff !important; }

/* ---------- 教育サービス：Pトレ（赤）と iトレ（青）を並べて色で見分ける（2026-10-02） ---------- */
body.wt-top-warm .wt1002-training .wt1002-edu, .wt1002-training .wt1002-edu { border-top: 6px solid var(--wt1002-c) !important; }
.wt1002-edu--pm   { --wt1002-c: #d23a3a; --wt1002-soft: #fdeceb; }
.wt1002-edu--isms { --wt1002-c: #1d5fae; --wt1002-soft: #e7f0fb; }
.wt1002-training .wt1002-edu .wtfi__tag { color: var(--wt1002-c) !important; }
.wt1002-training .wt1002-edu .wtfi__art { background: var(--wt1002-soft); border-radius: 16px; }
.wt1002-training .wt1002-edu .wtfi__btn { background: var(--wt1002-c) !important; border-color: var(--wt1002-c) !important; color: #fff !important; }
.wt1002-edu--isms .wtfi__art img { filter: hue-rotate(10deg) saturate(1.1); }