/* =========================================================
   特定技能外国人紹介サービス LP（ecl.css の上に重ねる）
   ========================================================= */

/* ---------- 共通部品 ---------- */
.ecl-btn--gold { background: var(--ecl-gold); color: var(--ecl-white); border: 1px solid var(--ecl-gold); }
.ecl-btn--gold:hover { background: var(--ecl-gold-dark); border-color: var(--ecl-gold-dark); }
.ssw-btn-lg { min-height: 58px; padding: 0 24px; font-size: 15px; font-weight: 700; gap: 10px; }
.ssw-btn-sub { min-width: 0; min-height: 58px; padding: 0 22px; }
.ssw-btn-xl { min-height: 68px; padding: 0 48px; font-size: 17px; font-weight: 700; min-width: 380px; }
.ssw-note { margin-top: 24px !important; font-size: 12px; line-height: 1.8; color: var(--ecl-muted); }
.ssw-lead { margin-bottom: 56px; }

/* ---------- 01 FV ---------- */
.ssw-fv__sub { line-height: 1.75; }
.ssw-fv__btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.ssw-fv .ecl-fv__inner { min-height: clamp(560px, calc(100vh - var(--ecl-header-h) - 120px), 720px); }
.ssw-fv .ecl-photo--fv img { object-position: 55% 40%; }
.ssw-keywords {
	position: relative;
	display: grid; grid-template-columns: repeat(3, 1fr);
	margin: 8px 0 72px !important;
	border: 1px solid var(--ecl-line); border-radius: 10px; background: var(--ecl-white);
}
.ssw-keywords li {
	display: flex; align-items: center; justify-content: center; gap: 14px;
	padding: 24px 16px;
	font-size: 17px; font-weight: 700; color: var(--ecl-navy); letter-spacing: .08em;
}
.ssw-keywords li + li { border-left: 1px solid var(--ecl-line); }
.ssw-keywords__icon { width: 34px; height: 34px; color: var(--ecl-gold); flex-shrink: 0; }
.ssw-keywords__icon svg { width: 100%; height: 100%; }

/* ---------- 02 CHALLENGES ---------- */
.ssw-challenges__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ssw-challenge {
	position: relative;
	display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
	background: var(--ecl-white); border-radius: 10px; padding: 32px 30px 30px;
}
.ssw-challenge__icon { width: 40px; height: 40px; color: var(--ecl-gold); }
.ssw-challenge__icon svg { width: 100%; height: 100%; }
.ssw-challenge__num { position: absolute; top: 26px; right: 28px; font-family: var(--ecl-en); font-weight: 300; font-size: 15px; color: var(--ecl-gold); letter-spacing: .1em; }
.ssw-challenge__text { font-size: 16px; font-weight: 700; color: var(--ecl-navy); line-height: 1.75; letter-spacing: .04em; }
.ssw-challenges__answer {
	margin-top: 56px; text-align: center;
	padding: 44px 32px; border-radius: 10px; background: var(--ecl-navy); color: var(--ecl-white);
	position: relative;
}
.ssw-challenges__answer::before {
	content: ""; position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
	border: 14px solid transparent; border-bottom-color: var(--ecl-navy); border-top: 0;
}
.ssw-challenges__answer-title { font-size: clamp(20px, 2.2vw, 26px); font-weight: 700; letter-spacing: .06em; line-height: 1.6; margin-bottom: 14px !important; word-break: keep-all; overflow-wrap: anywhere; }
.ssw-challenges__answer-text { font-size: 15px; line-height: 1.95; opacity: .92; max-width: 760px; margin: 0 auto !important; }

/* ---------- 03 ABOUT SSW ---------- */
.ssw-about__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; align-items: center; }
.ssw-points { display: grid; gap: 16px; }
.ssw-point {
	display: flex; gap: 24px; align-items: flex-start;
	padding: 28px 30px; border: 1px solid var(--ecl-line); border-left: 3px solid var(--ecl-gold); border-radius: 0 10px 10px 0; background: var(--ecl-white);
}
.ssw-point__num { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; font-family: var(--ecl-en); font-weight: 300; font-size: 12px; letter-spacing: .18em; color: var(--ecl-gold); line-height: 1.2; min-width: 56px; }
.ssw-point__num strong { font-weight: 200; font-size: 34px; letter-spacing: .02em; }
.ssw-point__title { font-size: 18px; font-weight: 700; color: var(--ecl-navy); line-height: 1.6; margin-bottom: 6px !important; }
.ssw-point__text { font-size: 15px; line-height: 1.9; }

/* ---------- 04 OUR SERVICE ---------- */
.ssw-service__list { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.ssw-svc { background: var(--ecl-white); border-radius: 10px; padding: 40px 40px 36px; transition: transform .35s ease, box-shadow .35s ease, opacity .8s ease; }
.ssw-svc.is-in:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(20,44,75,.08); }
.ssw-svc__head { display: flex; align-items: center; gap: 20px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid var(--ecl-line); }
.ssw-svc__icon { flex-shrink: 0; width: 64px; height: 64px; border-radius: 50%; background: var(--ecl-navy); color: var(--ecl-gold); display: flex; align-items: center; justify-content: center; }
.ssw-svc__icon svg { width: 32px; height: 32px; }
.ssw-svc__en { font-family: var(--ecl-en); font-weight: 300; font-size: 13px; letter-spacing: .24em; color: var(--ecl-gold); line-height: 1.4; margin-bottom: 4px !important; }
.ssw-svc__title { font-size: 21px; font-weight: 700; color: var(--ecl-navy); letter-spacing: .05em; line-height: 1.5; }
.ssw-svc__text { font-size: 15px; line-height: 1.95; }
.ssw-svc__text p + p { margin-top: .8em; }

/* ---------- 05 REGISTERED SUPPORT（紺背景） ---------- */
.ssw-support { background: var(--ecl-navy); color: var(--ecl-white); }
.ssw-support .ecl-head__title { color: var(--ecl-white); }
.ssw-support__top { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; }
.ssw-support__top .ecl-head { margin-bottom: 0; }
.ssw-support__badge { flex-shrink: 0; text-align: center; padding: 22px 36px; border: 1px solid var(--ecl-gold); border-radius: 10px; }
.ssw-support__badge-label { font-size: 13px; letter-spacing: .12em; color: var(--ecl-gold); margin-bottom: 4px !important; }
.ssw-support__badge-no { font-family: var(--ecl-en), var(--ecl-ja); font-size: clamp(28px, 3vw, 38px); font-weight: 400; letter-spacing: .06em; line-height: 1.3; white-space: nowrap; }
.ssw-support__text { margin: 36px 0 48px; font-size: 15px; line-height: 1.95; opacity: .92; max-width: 820px; }
.ssw-support__text p + p { margin-top: .6em; }
.ssw-support__list { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.ssw-sup {
	position: relative;
	display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px;
	padding: 30px 14px 26px; border-radius: 10px;
	background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12);
}
.ssw-sup__num { position: absolute; top: 12px; left: 14px; font-family: var(--ecl-en); font-weight: 300; font-size: 13px; color: var(--ecl-gold); letter-spacing: .08em; }
.ssw-sup__icon { width: 40px; height: 40px; color: var(--ecl-gold); }
.ssw-sup__icon svg { width: 100%; height: 100%; }
.ssw-sup__text { font-size: 15px; font-weight: 500; line-height: 1.6; letter-spacing: .03em; word-break: keep-all; overflow-wrap: anywhere; }
.ssw-sup__text small { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; opacity: .8; letter-spacing: 0; }
.ssw-support__note { margin-top: 24px !important; font-size: 12px; opacity: .75; }

/* ---------- 06 FLOW ---------- */
.ssw-flow__list { position: relative; display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.ssw-flow__list::before { content: ""; position: absolute; top: 31px; left: calc(100% / 12); right: calc(100% / 12); height: 2px; background: var(--ecl-navy); }
.ssw-step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; }
.ssw-step__num {
	position: relative; z-index: 1;
	width: 64px; height: 64px; border-radius: 50%;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	background: var(--ecl-white); border: 2px solid var(--ecl-navy); color: var(--ecl-gold);
	font-family: var(--ecl-en); font-weight: 400; font-size: 20px; line-height: 1;
	margin-bottom: 20px;
}
.ssw-step__num small { font-size: 9px; letter-spacing: .14em; margin-bottom: 3px; color: var(--ecl-navy); }
.ssw-step__title { font-size: 16px; font-weight: 700; color: var(--ecl-navy); line-height: 1.6; margin-bottom: 10px !important; word-break: keep-all; overflow-wrap: anywhere; }
.ssw-step__text { font-size: 14px; line-height: 1.85; text-align: left; }
.ssw-step__note { margin-top: 8px !important; font-size: 12px; line-height: 1.7; color: var(--ecl-muted); text-align: left; }

/* ---------- 07 FUTURE（全幅・写真＋紺オーバーレイ） ---------- */
.ssw-future { position: relative; width: 100%; overflow: hidden; background: var(--ecl-navy); color: var(--ecl-white); padding: 120px 0; }
.ssw-future__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.ssw-future::after { content: ""; position: absolute; inset: 0; background: rgba(20, 44, 75, .82); }
.ssw-future__inner { position: relative; z-index: 1; text-align: center; }
.ssw-future .ecl-head__en::after { content: ""; width: 32px; height: 1px; background: var(--ecl-gold); }
.ssw-future__title { font-size: clamp(26px, 3vw, 38px); font-weight: 700; line-height: 1.55; letter-spacing: .06em; margin-bottom: 32px !important; color: var(--ecl-white); }
.ssw-future__text { max-width: 900px; margin: 0 auto; font-size: 16px; line-height: 2.05; }
.ssw-future__text p + p { margin-top: 1em; }
.ssw-future__vision {
	display: inline-block; margin-top: 48px !important; padding: 18px 8px 0;
	border-top: 1px solid var(--ecl-gold);
	font-size: clamp(20px, 2.4vw, 30px); font-weight: 700; letter-spacing: .1em; line-height: 1.6; color: var(--ecl-white);
	word-break: keep-all; overflow-wrap: anywhere;
}

/* ---------- 08 FAQ ---------- */
.ssw-faq__list { border-top: 1px solid var(--ecl-line); }
.ssw-qa { border-bottom: 1px solid var(--ecl-line); }
.ssw-qa__q {
	list-style: none; cursor: pointer;
	display: flex; align-items: center; gap: 18px;
	padding: 26px 8px; font-size: 16px; font-weight: 700; color: var(--ecl-navy); line-height: 1.7;
	transition: background-color .2s ease;
}
.ssw-qa__q::-webkit-details-marker { display: none; }
.ssw-qa__q:hover { background: var(--ecl-gray); }
.ssw-qa__mark { flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--ecl-navy); color: var(--ecl-white); font-family: var(--ecl-en); font-weight: 400; font-size: 15px; letter-spacing: 0; }
.ssw-qa__mark--a { background: var(--ecl-gold); }
.ssw-qa__qtext { flex: 1; }
.ssw-qa__toggle { position: relative; flex-shrink: 0; width: 20px; height: 20px; }
.ssw-qa__toggle::before, .ssw-qa__toggle::after { content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 2px; margin-top: -1px; background: var(--ecl-gold); transition: transform .3s ease; }
.ssw-qa__toggle::after { transform: rotate(90deg); }
.ssw-qa[open] .ssw-qa__toggle::after { transform: rotate(0deg); }
.ssw-qa__a { display: flex; gap: 18px; align-items: flex-start; padding: 0 8px 28px; }
.ssw-qa__a p { font-size: 15px; line-height: 1.95; padding-top: 6px; }

/* ---------- 09 COMPANY & LICENSE ---------- */
.ssw-company__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 32px; align-items: stretch; }
.ssw-company__info { background: var(--ecl-white); border-radius: 10px; padding: 36px 40px; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; }
.ssw-company__info dl > div { display: grid; grid-template-columns: 130px 1fr; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--ecl-line); }
.ssw-company__info dt { font-size: 14px; font-weight: 500; color: var(--ecl-navy); }
.ssw-company__info dd { font-size: 15px; }
.ssw-company__info .ecl-btn--outline { align-self: flex-start; }
.ssw-company__licenses { display: grid; grid-template-columns: 1fr; gap: 12px; }
.ssw-company__licenses .ecl-license__card { flex-direction: row; justify-content: space-between; text-align: left; padding: 26px 32px; border-top: 0; border-left: 3px solid var(--ecl-gold); }
.ssw-company__licenses .ecl-license__name { margin: 0 !important; }

/* ---------- 10 CTA（全幅・紺＋薄い写真） ---------- */
.ssw-cta { position: relative; width: 100%; overflow: hidden; background: var(--ecl-navy); color: var(--ecl-white); padding: 112px 0; text-align: center; }
.ssw-cta__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .14; filter: grayscale(30%); }
.ssw-cta__inner { position: relative; z-index: 1; }
.ssw-cta .ecl-head__en::after { content: ""; width: 32px; height: 1px; background: var(--ecl-gold); }
.ssw-cta__title { font-size: clamp(26px, 3.2vw, 42px); font-weight: 700; line-height: 1.55; letter-spacing: .06em; color: var(--ecl-white); margin-bottom: 24px !important; }
.ssw-cta__text { font-size: 15px; line-height: 2; opacity: .92; margin-bottom: 40px !important; }
.ssw-cta__sub { margin-top: 18px !important; font-size: 13px; opacity: .8; }
.ssw-cta .ecl-btn--gold:hover { background: var(--ecl-white); color: var(--ecl-navy); border-color: var(--ecl-white); }

/* =========================================================
   TABLET
   ========================================================= */
@media (max-width: 1024px) {
	.ssw-challenges__list { grid-template-columns: 1fr 1fr; }
	.ssw-about__grid { grid-template-columns: 1fr; gap: 40px; }
	.ssw-support__list { grid-template-columns: repeat(3, 1fr); }
	.ssw-support__top { flex-direction: column; align-items: flex-start; }
	.ssw-flow__list { grid-template-columns: repeat(3, 1fr); row-gap: 40px; }
	.ssw-flow__list::before { display: none; }
	.ssw-company__grid { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
	.ssw-service__list { grid-template-columns: 1fr; }
}

/* =========================================================
   SP
   ========================================================= */
@media (max-width: 767px) {
	.ssw-fv__btns { flex-direction: column; gap: 10px; margin-top: 24px; }
	.ssw-fv__btns .ecl-btn { width: 100%; min-height: 56px; padding: 0 16px; font-size: 15px; }
	.ssw-keywords { grid-template-columns: 1fr; margin: 0 0 56px !important; }
	.ssw-keywords li { justify-content: flex-start; padding: 16px 20px; font-size: 15px; }
	.ssw-keywords li + li { border-left: 0; border-top: 1px solid var(--ecl-line); }
	.ssw-keywords__icon { width: 28px; height: 28px; }

	.ssw-challenges__list { grid-template-columns: 1fr; gap: 12px; }
	.ssw-challenge { flex-direction: row; align-items: center; gap: 16px; padding: 20px 44px 20px 20px; }
	.ssw-challenge__icon { width: 34px; height: 34px; flex-shrink: 0; }
	.ssw-challenge__num { top: 50%; right: 16px; transform: translateY(-50%); font-size: 13px; }
	.ssw-challenge__text { font-size: 15px; }
	.ssw-challenges__answer { margin-top: 40px; padding: 32px 20px; text-align: left; }
	.ssw-challenges__answer-title { font-size: 19px; }

	.ssw-point { padding: 20px 18px; gap: 16px; }
	.ssw-point__num { min-width: 46px; }
	.ssw-point__num strong { font-size: 28px; }
	.ssw-point__title { font-size: 16px; }

	.ssw-lead { margin-bottom: 32px; }
	.ssw-service__list { grid-template-columns: 1fr; gap: 16px; }
	.ssw-svc { padding: 28px 22px 26px; }
	.ssw-svc__icon { width: 52px; height: 52px; }
	.ssw-svc__icon svg { width: 26px; height: 26px; }
	.ssw-svc__title { font-size: 18px; }

	.ssw-support .ecl-head__title { font-size: clamp(17px, 4.8vw, 24px); }
	.ssw-support__badge { width: 100%; padding: 18px 16px; }
	.ssw-support__text { margin: 28px 0 32px; }
	.ssw-support__list { grid-template-columns: 1fr 1fr; gap: 10px; }
	.ssw-sup { padding: 26px 10px 20px; gap: 10px; }
	.ssw-sup__icon { width: 34px; height: 34px; }
	.ssw-sup__text { font-size: 14px; }

	.ssw-flow__list { grid-template-columns: 1fr; row-gap: 0; }
	.ssw-flow__list::before { display: block; top: 0; bottom: 0; left: 27px; right: auto; width: 2px; height: auto; }
	.ssw-step { flex-direction: row; align-items: flex-start; text-align: left; gap: 18px; padding-bottom: 28px; }
	.ssw-step:last-child { padding-bottom: 0; }
	.ssw-step__num { flex-shrink: 0; width: 56px; height: 56px; margin: 0; font-size: 18px; }
	.ssw-step__body { padding-top: 6px; }
	.ssw-step__title { margin-bottom: 6px !important; }

	.ssw-future { padding: 80px 0; }
	.ssw-future__inner { text-align: left; }
	.ssw-future__text { font-size: 15px; }
	.ssw-future__title { font-size: clamp(19px, 5.2vw, 24px); letter-spacing: .03em; }
	.ssw-future__vision { margin-top: 36px !important; font-size: 19px; padding: 16px 0 0; }

	.ssw-qa__q { gap: 12px; padding: 20px 4px; font-size: 15px; }
	.ssw-qa__mark { width: 34px; height: 34px; font-size: 13px; }
	.ssw-qa__a { gap: 12px; padding: 0 4px 22px; }
	.ssw-qa__a p { font-size: 14px; padding-top: 5px; }

	.ssw-company__info { padding: 24px 20px; }
	.ssw-company__info dl > div { grid-template-columns: 1fr; gap: 2px; }
	.ssw-company__info .ecl-btn--outline { align-self: stretch; }
	.ssw-company__licenses .ecl-license__card { flex-direction: column; align-items: flex-start; padding: 18px 20px; border-left: 3px solid var(--ecl-gold); }
	.ssw-company__licenses .ecl-license__no { width: auto; margin-top: 4px; }

	.ssw-cta { padding: 80px 0; }
	.ssw-cta__inner { text-align: left; }
	.ssw-cta__title { font-size: clamp(19px, 5.4vw, 24px); letter-spacing: .03em; }
	.ssw-cta__text { font-size: 14px; margin-bottom: 28px !important; }
	.ssw-btn-xl { min-width: 0; width: 100%; min-height: 60px; padding: 0 16px; font-size: 15px; }
}
