/* ⑯ 6無 정책 — 크림 배경 (시안 y 14735~15857, 높이 1122)
   PC: 1920 기준 비율(--u)로 줄어드는 세로 흐름. 티켓은 네 귀퉁이가 둥글게 파인 모양(크림색 원을 겹쳐 그림).
   1279px 이하(휴대폰·태블릿): 티켓이 한 줄에 하나씩. */
.s16 {
  --s16-bg: #faf5e2;
  --s16-green: #005633;
  --s16-gold: #dbc87b;
  --s16-line: #aac2aa;
  background: var(--s16-bg);
  color: #000;
  container-type: inline-size;
}
.s16-in { --u: min(1px, calc(100cqw / 1920)); padding: calc(105 * var(--u)) 0 calc(112 * var(--u)); text-align: center; }
.s16-logo { width: calc(158 * var(--u)); height: auto; margin: 0 auto; }
.s16-title { margin-top: calc(10 * var(--u)); letter-spacing: -0.06em; }
.s16-t1 { display: inline-block; font-size: calc(62 * var(--u)); line-height: calc(70 * var(--u)); }
.s16-t2 { display: inline-block; font-size: calc(80 * var(--u)); line-height: calc(86 * var(--u)); color: var(--s16-green); letter-spacing: -0.03em; }

/* 줄 제목: ──── 본사지원 혜택! ──── */
.s16-row {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: calc(86 * var(--u));
  width: calc(1440 * var(--u)); margin: calc(44 * var(--u)) auto 0;
  font-size: calc(28 * var(--u)); line-height: 1; font-weight: 900; letter-spacing: -0.05em;
}
.s16-row::before, .s16-row::after { content: ""; height: 1px; background: var(--s16-line); }
.s16-tickets + .s16-row { margin-top: calc(74 * var(--u)); }

/* 티켓 */
.s16-tickets { list-style: none; display: flex; justify-content: center; gap: calc(41 * var(--u)); margin: calc(32 * var(--u)) 0 0; padding: 0; }
.s16-ticket {
  --r: calc(19 * var(--u));
  --t: var(--s16-green);
  position: relative; flex: 0 0 auto;
  width: calc(409 * var(--u)); height: calc(202 * var(--u));
  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: calc(4 * var(--u));
  color: var(--c-white);
  background:
    radial-gradient(circle at 0 0, var(--s16-bg) var(--r), transparent calc(var(--r) + .5px)),
    radial-gradient(circle at 100% 0, var(--s16-bg) var(--r), transparent calc(var(--r) + .5px)),
    radial-gradient(circle at 0 100%, var(--s16-bg) var(--r), transparent calc(var(--r) + .5px)),
    radial-gradient(circle at 100% 100%, var(--s16-bg) var(--r), transparent calc(var(--r) + .5px)),
    var(--t);
}
.s16-tickets--black .s16-ticket { --t: #000; }
.s16-ticket::before, .s16-ticket::after { content: ""; position: absolute; top: calc(40 * var(--u)); bottom: calc(40 * var(--u)); width: 1px; background: rgba(255,255,255,.16); }
.s16-ticket::before { left: calc(68 * var(--u)); }
.s16-ticket::after { right: calc(70 * var(--u)); }
.s16-tickets--black .s16-ticket::before, .s16-tickets--black .s16-ticket::after { background: rgba(255,255,255,.2); }
.s16-k { font-size: calc(22 * var(--u)); line-height: calc(30 * var(--u)); font-weight: 500; letter-spacing: -0.05em; }
.s16-p { display: flex; align-items: center; justify-content: center; gap: calc(9 * var(--u)); height: calc(60 * var(--u)); }
.s16-p del { font-size: calc(23 * var(--u)); font-weight: 700; letter-spacing: -0.06em; text-decoration-thickness: calc(2 * var(--u)); color: rgba(255,255,255,.92); }
.s16-p strong { font-size: calc(56 * var(--u)); line-height: 1; letter-spacing: -0.06em; color: var(--s16-gold); }
.s16-sm { position: absolute; left: 0; right: 0; top: calc(150 * var(--u)); font-size: calc(15 * var(--u)); line-height: calc(20 * var(--u)); font-weight: 700; color: #8c8c8c; letter-spacing: -0.04em; }
.js .s16-ticket:nth-child(2).in { animation-delay: .12s; }
.js .s16-ticket:nth-child(3).in { animation-delay: .24s; }
/* 0원 반짝 */
.js .s16-ticket.in strong { animation: s16-zero 1.2s ease-out .5s both; }
@keyframes s16-zero { 0% { transform: scale(.6); opacity: .3; } 60% { transform: scale(1.12); opacity: 1; text-shadow: 0 0 calc(18 * var(--u)) rgba(255,226,140,.9); } 100% { transform: none; } }

/* ---------- 휴대폰 + 태블릿·작은 노트북(1279px 이하): 한 줄로 쌓기 ---------- */
@media (max-width: 1279px) {
  .s16-in { --u: 1px; padding: 56px 16px 64px; }
  .s16-logo { width: 120px; }
  .s16-t1 { font-size: clamp(28px, 8vw, 40px); line-height: 1.25; }
  .s16-t2 { font-size: clamp(36px, 10.4vw, 52px); line-height: 1.2; }
  .s16-row { width: 100%; gap: 14px; margin-top: 34px; font-size: 20px; }
  .s16-tickets + .s16-row { margin-top: 40px; }
  .s16-tickets { flex-direction: column; align-items: center; gap: 12px; margin-top: 18px; }
  .s16-ticket { --r: 14px; width: min(100%, 360px); height: 150px; }
  .s16-ticket::before, .s16-ticket::after { top: 28px; bottom: 28px; }
  .s16-ticket::before { left: 48px; }
  .s16-ticket::after { right: 48px; }
  .s16-k { font-size: 17px; line-height: 1.4; }
  .s16-p { height: 50px; gap: 8px; }
  .s16-p del { font-size: 17px; }
  .s16-p strong { font-size: 42px; }
  .s16-sm { top: auto; bottom: 10px; font-size: 14px; }
}
/* 769~1279px: 위 한 줄 배치 그대로, 줄 제목 선 길이에 상한을 두고 가운데로. 각주는 15px */
@media (min-width: 769px) and (max-width: 1279px) {
  .s16-row { width: min(100%, 480px); }
  .s16-sm { font-size: 15px; }
}
