/**
 * 失業保険シミュレーター
 */

.uike {
	color: var(--gss-ink, #152b49);
}

body.gss-page-feature .uike {
	width: min(760px, calc(100% - 32px));
	margin: 0 auto 3rem;
	padding-top: 1.75rem;
}

.uike-head h1,
.uike-prose h1 {
	margin: 0.35rem 0 0.8rem;
	color: #0c2854;
	font-size: clamp(1.7rem, 3vw, 2.15rem);
	font-weight: 800;
	line-height: 1.35;
}

.uike-eyebrow {
	margin: 0;
	color: var(--gss-accent, #0878d1);
	font-size: 0.82rem;
	font-weight: 700;
}

.uike-head p {
	margin: 0 0 0.9rem;
	color: var(--gss-muted, #65758d);
}

.uike-head .gss-trust-badges {
	margin-bottom: 1.4rem;
}

.uike-form,
.uike-result,
.uike-block {
	margin: 0 0 1.5rem;
	padding: 1.15rem 1.15rem 1.25rem;
	background: #fff;
	border: 1px solid var(--gss-line, #dce6f0);
	border-radius: 14px;
}

.uike-field {
	margin: 0 0 1rem;
	padding: 0;
	border: 0;
}

.uike-field label,
.uike-field legend {
	display: block;
	margin: 0 0 0.35rem;
	font-weight: 700;
	color: #0c2854;
}

.uike-field p,
.uike-dl span,
.uike-result__s,
.uike-note {
	margin: 0.35rem 0 0;
	color: var(--gss-muted, #65758d);
	font-size: 0.86rem;
	font-weight: 400;
	line-height: 1.6;
}

.uike-wage {
	display: flex;
	align-items: center;
	gap: 0.45rem;
}

.uike-form input[type="text"],
.uike-form select {
	width: 100%;
	height: 48px;
	padding: 0 0.8rem;
	border: 1px solid #cbd9e8;
	border-radius: 8px;
	background: #fff;
	color: inherit;
	font: inherit;
}

.uike-wage input {
	max-width: 16rem;
}

.uike-reasons {
	display: grid;
	gap: 0.45rem;
}

.uike-reasons label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0.65rem 0.75rem;
	border: 1px solid #cbd9e8;
	border-radius: 8px;
	font-weight: 600;
}

.uike-form button {
	width: 100%;
	height: 50px;
	margin-top: 0.3rem;
	border: 0;
	border-radius: 8px;
	background: var(--gss-accent, #0878d1);
	color: #fff;
	font: inherit;
	font-weight: 800;
	cursor: pointer;
}

.uike-form button:hover {
	background: var(--gss-blue-dark, #0065b8);
}

.uike-error {
	margin: 0 0 1rem;
	padding: 0.8rem 1rem;
	border-radius: 8px;
	background: #fff4f2;
	color: #8a2b22;
}

.uike-result__cond {
	margin: 0 0 0.8rem;
	font-size: 0.88rem;
	font-weight: 700;
	color: #0c2854;
}

.uike-result__hero {
	display: grid;
	gap: 0.8rem;
}

@media (min-width: 680px) {
	.uike-result__hero {
		grid-template-columns: 1fr 1fr;
	}
}

.uike-result__hero > div {
	padding: 0.9rem 1rem;
	border-radius: 10px;
	background: var(--gss-accent-soft, #e9f4ff);
}

.uike-result__k {
	margin: 0;
	font-size: 0.82rem;
	font-weight: 700;
}

.uike-result__v {
	margin: 0.15rem 0 0;
	font-size: clamp(1.6rem, 3vw, 2rem);
	font-weight: 800;
	line-height: 1.2;
	color: #0c2854;
}

.uike-result__v--na {
	font-size: 1.25rem;
}

.uike-dl {
	display: grid;
	gap: 0.75rem;
	margin: 1rem 0 0;
}

.uike-dl div {
	padding-top: 0.75rem;
	border-top: 1px solid var(--gss-line, #dce6f0);
}

.uike-dl dt {
	font-size: 0.82rem;
	font-weight: 700;
	color: #607493;
}

.uike-dl dd {
	margin: 0.15rem 0 0;
	font-size: 1.15rem;
	font-weight: 800;
}

.uike-dl span {
	display: block;
}

.uike-note {
	margin-top: 0.9rem;
}

.uike-block h2,
body.gss-page-simple .post-content .uike-prose h2 {
	margin: 2rem 0 0.8rem;
	padding: 0 0 0 12px;
	border-left: 5px solid var(--gss-accent, #0878d1);
	color: #0c2854;
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.4;
}

.uike-block h2 {
	margin-top: 0;
	font-size: 1.05rem;
}

.uike-examples,
.uike-links,
.uike-prose ul {
	margin: 0.4rem 0 0;
	padding-left: 1.15rem;
}

.uike-examples li,
.uike-links li,
.uike-prose li {
	margin: 0.35rem 0;
}

.uike-prose {
	max-width: none;
}

.uike-prose p,
.uike-updated,
.uike-sources {
	margin: 0.85rem 0;
	line-height: 1.75;
}

.uike-prose .gss-table-scroll table {
	min-width: 54rem;
}

@media (max-width: 760px) {
	body.gss-page-feature .uike {
		width: min(760px, calc(100% - 24px));
		padding-top: 1rem;
	}
}

.uike-faq {
	margin: 0 0 2rem;
}

.uike-faq h2 {
	margin: 0 0 0.8rem;
	color: #0c2854;
	font-size: 1.25rem;
	font-weight: 800;
}

.uike-faq details {
	border-top: 1px solid var(--gss-line, #dce6f0);
}

.uike-faq details:last-child {
	border-bottom: 1px solid var(--gss-line, #dce6f0);
}

.uike-faq summary {
	padding: 0.85rem 0;
	color: #0c2854;
	font-weight: 700;
	cursor: pointer;
}

.uike-faq details p {
	margin: 0 0 0.9rem;
	color: var(--gss-ink, #152b49);
}
