/* Njob Support — page styles (design reference: design_handoff_njob_website) */
/* ---- 문의 채널 카드 ---- */
  .channel-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
  .ch{background:var(--surface); border-radius:22px; padding:28px 24px 26px;
    border:1px solid rgba(30,29,28,.05); display:flex; flex-direction:column; min-height:250px;
    transition:transform .18s var(--ease), border-color .18s;}
  .ch:hover{transform:translateY(-2px); border-color:var(--line-2);}
  .ch .n{font-size:12px; font-weight:800; color:var(--ink-mute);}
  .ch h3{margin-top:14px; font-size:21px; font-weight:800; letter-spacing:-0.035em;}
  .ch p{margin-top:10px; font-size:14px; line-height:1.65; color:var(--ink-2); word-break:keep-all;}
  .ch .val{margin-top:auto; padding-top:20px;}
  .ch .val b{font-size:17.5px; font-weight:800; letter-spacing:-0.03em;}
  .ch .val span{display:block; margin-top:5px; font-size:12.5px; color:var(--ink-mute); font-weight:600;}
  .ch.dark{background:var(--ink); border-color:transparent;}
  .ch.dark .n{color:var(--amber);}
  .ch.dark h3{color:#fff;}
  .ch.dark p{color:rgba(255,255,255,.72);}
  .ch.dark .val b{color:#fff;}
  .ch.dark .val span{color:rgba(255,255,255,.5);}

  /* ---- 빠른 답변 ---- */
  .faq{background:var(--bg-2);}
  .faq-grid{display:grid; grid-template-columns:330px 1fr; gap:64px; align-items:start;}
  .faq-side p{margin-top:20px; font-size:16px; line-height:1.75; color:var(--ink-2);
    word-break:keep-all; max-width:300px;}
  .faq-side .btn{margin-top:26px;}
  .qa{border-top:1px solid var(--line-2);}
  .qa:last-child{border-bottom:1px solid var(--line-2);}
  .qa summary{display:flex; align-items:flex-start; justify-content:space-between; gap:24px;
    padding:22px 4px; cursor:pointer; list-style:none;}
  .qa summary::-webkit-details-marker{display:none;}
  .qa summary .qt{font-size:17.5px; font-weight:700; letter-spacing:-0.03em; line-height:1.5;
    word-break:keep-all; display:grid; grid-template-columns:26px 1fr; gap:6px;}
  .qa summary .qt i{font-style:normal; font-weight:800; color:var(--amber-deep);}
  .qa summary .tg{flex:0 0 auto; width:26px; height:26px; border-radius:50%;
    border:1.5px solid var(--line-2); display:grid; place-items:center; font-size:13px;
    font-weight:800; color:var(--ink-2); transition:transform .22s var(--ease), background .18s, color .18s, border-color .18s;}
  .qa[open] summary .tg{transform:rotate(45deg); background:var(--amber); border-color:var(--amber); color:#fff;}
  .qa .ans{padding:0 50px 24px 30px; font-size:15.5px; line-height:1.8; color:var(--ink-2);
    word-break:keep-all;}
  .qa .ans b{color:var(--ink); font-weight:700;}

  /* ---- 공지 티저 ---- */
  .nt{display:grid; grid-template-columns:120px 1fr auto; gap:24px; align-items:center;
    padding:22px 6px; border-top:1px solid var(--line); transition:background .18s;}
  .nt:last-of-type{border-bottom:1px solid var(--line);}
  .nt:hover{background:var(--card);}
  .nt .c{font-size:12px; font-weight:800; color:var(--amber-deep);}
  .nt .c.gray{color:var(--ink-mute);}
  .nt .t{font-size:17px; font-weight:700; letter-spacing:-0.03em; word-break:keep-all;}
  .nt .t small{display:block; margin-top:5px; font-size:13px; font-weight:500; color:var(--ink-mute);}
  .nt .d{font-size:13px; color:var(--ink-mute); font-weight:600; white-space:nowrap;}

  /* ---- 사무소 ---- */
  .office-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
  .offc{background:var(--surface); border-radius:22px; padding:28px 24px;
    border:1px solid rgba(30,29,28,.05); display:flex; flex-direction:column;}
  .offc .nm{font-size:18px; font-weight:800; letter-spacing:-0.03em;}
  .offc .en{font-size:11.5px; font-weight:700; color:var(--ink-mute); margin-top:3px;}
  .offc p{margin-top:13px; font-size:14px; line-height:1.7; color:var(--ink-2); word-break:keep-all;}
  .offc .mt{margin-top:auto; padding-top:16px; font-size:13px; color:var(--ink-mute); font-weight:600;}
  .offc .mt a{border-bottom:1px solid var(--line-2);}
  .offc .mt a:hover{color:var(--amber-deep); border-color:var(--amber);}

  /* ---- 구글맵 ---- */
  .map-wrap{display:grid; grid-template-columns:1.75fr 1fr; gap:22px; align-items:start;}
  .map-frame{background:var(--panel); border:1px solid rgba(30,29,28,.06); border-radius:26px;
    padding:18px; display:flex; flex-direction:column; gap:14px;}
  .map-canvas{position:relative; border-radius:16px; overflow:hidden; background:var(--map-base);
    background-image:repeating-linear-gradient(115deg, rgba(30,29,28,.045) 0 1px, transparent 1px 11px);}
  .map-canvas iframe{position:relative; z-index:1; display:block; width:100%; height:446px; border:0;}
  .map-fb{position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:26px;}
  .map-fb .in{max-width:340px;}
  .map-fb b{display:block; font-size:15.5px; font-weight:800; letter-spacing:-0.03em;}
  .map-fb span{display:block; margin-top:8px; font-size:13px; line-height:1.65;
    color:var(--ink-mute); font-weight:600; word-break:keep-all;}
  .map-fb a{display:inline-flex; align-items:center; gap:7px; margin-top:16px; font-size:13.5px;
    font-weight:700; padding:11px 16px; border-radius:11px; background:var(--ink); color:#fff;}
  .map-fb a:hover{background:var(--amber);}
  .map-frame .foot{display:flex; justify-content:space-between; align-items:center;
    gap:16px; flex-wrap:wrap; padding:0 4px 2px;}
  .map-frame .foot .ad{font-size:13.5px; font-weight:700; color:var(--ink-2); word-break:keep-all;}
  .map-frame .foot .ad span{display:block; margin-top:3px; font-size:12.5px; font-weight:600; color:var(--ink-mute);}
  .map-frame .foot .acts{display:flex; gap:8px; flex-wrap:wrap;}
  .map-frame .foot a{display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:700;
    padding:10px 14px; border-radius:11px; border:1.5px solid var(--line-2); transition:border-color .16s, background .16s;}
  .map-frame .foot a:hover{border-color:var(--ink); background:var(--surface);}

  .map-side{display:flex; flex-direction:column; gap:12px;}
  .map-card{background:var(--surface); border-radius:22px; padding:26px 24px;
    border:1px solid rgba(30,29,28,.05);}
  .map-card .k{font-size:12px; font-weight:800; color:var(--amber-deep);}
  .map-card h3{margin-top:11px; font-size:22px; font-weight:800; letter-spacing:-0.035em; line-height:1.25;}
  .map-card dl{margin-top:18px;}
  .map-card .rw{display:grid; grid-template-columns:62px 1fr; gap:14px; padding:12px 0;
    border-top:1px solid var(--line); font-size:14px;}
  .map-card .rw:first-child{border-top:1px solid var(--ink);}
  .map-card dt{color:var(--ink-mute); font-weight:600;}
  .map-card dd{font-weight:700; line-height:1.6; word-break:keep-all;}
  .map-card dd a{border-bottom:1px solid var(--line-2);}
  .map-card dd a:hover{color:var(--amber-deep); border-color:var(--amber);}
  .map-note{background:var(--bg-2); border-radius:16px; padding:16px 18px; font-size:13px;
    line-height:1.7; color:var(--ink-2); font-weight:600; word-break:keep-all;}
  .map-note b{color:var(--ink); font-weight:800;}

  @media (max-width:1180px){ .map-wrap{grid-template-columns:1fr;} }
  @media (max-width:760px){
    .map-frame{padding:12px; border-radius:20px;}
    .map-canvas iframe{height:300px;}
    .map-fb{padding:18px;}
    .map-frame .foot .acts{width:100%;}
    .map-frame .foot a{flex:1 1 auto; justify-content:center;}
    .map-card{padding:22px 20px;}
  }

  @media (max-width:1180px){
    .channel-grid{grid-template-columns:repeat(2,1fr);}
    .faq-grid{grid-template-columns:1fr; gap:38px;}
    .faq-side p{max-width:100%;}
  }
  @media (max-width:1024px){ .office-grid{grid-template-columns:1fr;} }
  @media (max-width:760px){
    .channel-grid{grid-template-columns:1fr;}
    .ch{min-height:0; padding:24px 20px;}
    .nt{grid-template-columns:1fr; gap:8px;}
    .nt .d{white-space:normal;}
    .qa summary .qt{font-size:16px; grid-template-columns:22px 1fr;}
    .qa .ans{padding:0 12px 22px 26px; font-size:15px;}
  }