:root{
  --bg0:#070b14; --bg1:#0b1220;
  --card:rgba(255,255,255,.04);
  --line:rgba(255,255,255,.12);
  --text:#eef2ff;
  --muted:rgba(238,242,255,.72);
  --muted2:rgba(238,242,255,.55);
  --brand:#42c7f1; --brand2:#7fee0e; --brand3:#fb8239;
  --danger:#C53428;
  --shadow: 0 20px 50px rgba(0,0,0,.35);
  --shadow2: 0 10px 26px rgba(0,0,0,.25);
  /* 홈(index.html)과 동일한 폭으로 통일 */
  --radius:22px; --radius2:16px; --max: 1440px;
  --ease: cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}

/* Korean typography: avoid awkward mid-word wrapping */
body, p, li, a, span, div, h1, h2, h3, h4, h5, h6, td, th {
  word-break: keep-all;
  line-break: strict;
}
body{
  font-family:"Noto Sans KR", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(66,199,241,.16), transparent 55%),
    radial-gradient(860px 520px at 80% 10%, rgba(127,238,14,.12), transparent 55%),
    radial-gradient(820px 560px at 70% 75%, rgba(251,130,57,.10), transparent 60%),
    linear-gradient(180deg, var(--bg1), var(--bg0));
  min-height:100vh;
}
a{color:inherit;text-decoration:none}

/* Link-style buttons (blue + underline) */
.k-link{color:var(--brand);text-decoration:underline;font-weight:800}
.k-link:hover{opacity:.85}
.wrap{max-width:var(--max);margin:0 auto;padding:0 18px}
.fullbleed{width:100vw;margin-left:calc(50% - 50vw);}
.fullbleed>.wrap{max-width:var(--max);margin:0 auto;padding:0 18px}
.card{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  border-radius:22px;
  box-shadow:var(--shadow2);
  overflow:hidden;
}
.card .hd{padding:18px 18px;border-bottom:1px solid rgba(255,255,255,.10)}
.card .bd{padding:18px 18px}
.h1{font-size:28px;margin:0 0 6px 0;font-weight:1000}
.p{margin:0;color:var(--muted);line-height:1.55}
.row{display:grid;gap:12px}
.field label{display:block;font-size:12px;color:var(--muted2);margin:0 0 6px 2px;font-weight:900}
.field input, .field select, .field textarea{
  width:100%; padding:12px 12px;
  border-radius:14px; border:1px solid rgba(255,255,255,.14);
  background:rgba(10,14,24,.45); color:var(--text);
  outline:none; font-weight:800;
}
.field textarea{min-height:110px;resize:vertical}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 16px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.04); color:var(--text);
  cursor:pointer; transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
  font-weight:1000;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-1px); background:rgba(255,255,255,.06)}
.btn.primary{
  border-color:rgba(66,199,241,.40);
  background:linear-gradient(135deg, rgba(66,199,241,.18), rgba(127,238,14,.08));
}
.btn.danger{
  border-color:rgba(197,52,40,.60);
  background:linear-gradient(135deg, rgba(197,52,40,.45), rgba(251,130,57,.18));
}
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 0;
}
.brand{
  display:flex;align-items:center;gap:10px;
}
.logo{
  width:36px;height:36px;border-radius:10px;
  background: url(ci/header_logo.png) center/contain no-repeat;
  border:0;
  box-shadow:var(--shadow2);
}
.brand .name{font-weight:1000}
.brand .tag{font-size:12px;color:var(--muted2);margin-top:2px}
.navlinks{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.notice{
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.03);
  padding:12px 12px;
  border-radius:16px;
  color:var(--muted);
  line-height:1.5;
}
.notice.ok{border-color:rgba(127,238,14,.35)}
.notice.bad{border-color:rgba(197,52,40,.55)}
.table{
  width:100%;border-collapse:collapse;font-size:14px;
}
.table th,.table td{padding:10px 10px;border-bottom:1px solid rgba(255,255,255,.10);vertical-align:top}
.table th{color:var(--muted2);text-align:left;font-weight:900}
.small{font-size:12px;color:var(--muted2)}


/* ===== merged from index.html for consistent landing styles ===== */

    :root{
      --bg0:#070b14; --bg1:#0b1220;
      --card:rgba(255,255,255,.04);
      --line:rgba(255,255,255,.12);
      --text:#eef2ff;
      --muted:rgba(238,242,255,.72);
      --muted2:rgba(238,242,255,.55);
      --brand:#42c7f1; --brand2:#7fee0e; --brand3:#fb8239;
      --danger:#C53428;
      --shadow: 0 20px 50px rgba(0,0,0,.35);
      --shadow2: 0 10px 26px rgba(0,0,0,.25);
      --radius:22px; --radius2:16px; --max: 1440px;
      --ease: cubic-bezier(.2,.8,.2,1);
    }
    *{box-sizing:border-box}
    html,body{margin:0;padding:0}
    body{
      font-family:"Noto Sans KR", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      color:var(--text);
      background:
        radial-gradient(900px 520px at 15% 0%, rgba(66,199,241,.16), transparent 55%),
        radial-gradient(860px 520px at 80% 10%, rgba(127,238,14,.12), transparent 55%),
        radial-gradient(820px 560px at 70% 75%, rgba(251,130,57,.10), transparent 60%),
        linear-gradient(180deg, var(--bg1), var(--bg0));
      overflow-x:hidden;
      min-height:100vh;
    }
    a{color:inherit;text-decoration:none}
    .wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
    .muted{color:var(--muted)}
    .muted2{color:var(--muted2)}
    .k1{color:var(--brand)} .k2{color:var(--brand2)} .k3{color:var(--brand3)}

    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:10px;
      padding:13px 16px;border-radius:999px;border:1px solid var(--line);
      background:rgba(255,255,255,.04); color:var(--text);
      cursor:pointer; transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
      font-weight:900;
      white-space:nowrap;
    }
    .btn:hover{transform:translateY(-1px); background:rgba(255,255,255,.06)}
    .btn.primary{
      border-color:rgba(66,199,241,.40);
      background:linear-gradient(135deg, rgba(66,199,241,.18), rgba(127,238,14,.08));
    }
    .btn.ghost{
      background:transparent;
      border-color:rgba(255,255,255,.18);
    }
    .pill{
      display:inline-flex;align-items:center;gap:8px;
      padding:10px 12px;border:1px solid var(--line);
      border-radius:999px;background:rgba(255,255,255,.03);
      color:var(--muted);font-size:13px;font-weight:900;
    }

    header{
      position:sticky;top:0;z-index:60;
      background:rgba(7,11,20,.72);
      backdrop-filter: blur(12px);
      border-bottom:1px solid rgba(255,255,255,.08);
    }
    .header-row{
      display:flex;align-items:center;justify-content:space-between;
      padding:14px 0;gap:12px;
    }
    .brand{
      display:flex;align-items:center;gap:10px;min-width:180px;
    }
    .logo{
      width:38px;height:38px;border-radius:14px;
      background:
        radial-gradient(circle at 25% 25%, rgba(66,199,241,.95), rgba(66,199,241,.10) 55%, transparent 70%),
        linear-gradient(135deg, rgba(127,238,14,.18), rgba(251,130,57,.10));
      border:1px solid rgba(255,255,255,.14);
      box-shadow:var(--shadow2);
    }
    .brand .text{display:flex;flex-direction:column;line-height:1.05}
    .brand .name{font-weight:1000;letter-spacing:.2px}
    .brand .tag{font-size:12px;color:var(--muted2);margin-top:2px}
    nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:18px}
    nav a{color:var(--muted);font-weight:1000;font-size:14px}
    nav a:hover{color:var(--text)}
    .header-actions{display:flex;align-items:center;gap:10px}
    .hamburger{display:none}

    /* Mobile menu */
    #back_cover{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:80}
    #back_cover.show{display:block}
    #sideMenu{
      position:fixed;top:0;right:-360px;width:340px;height:100%;
      background:rgba(11,18,32,.96);
      border-left:1px solid rgba(255,255,255,.10);
      box-shadow:var(--shadow);
      z-index:90;transition:right .28s var(--ease);
    }
    #sideMenu.open{right:0}
    .side-head{display:flex;align-items:center;justify-content:space-between;padding:16px 16px;border-bottom:1px solid rgba(255,255,255,.10)}
    .side-nav{padding:10px 16px}
    .side-nav a{
      display:flex;align-items:center;justify-content:space-between;
      padding:14px 12px;border-radius:14px;margin:6px 0;
      border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03);
      color:var(--muted); font-weight:1000;
    }
    .side-nav a:hover{background:rgba(255,255,255,.05);color:var(--text)}
    .side-foot{padding:16px;border-top:1px solid rgba(255,255,255,.10); color:var(--muted2); font-weight:900; font-size:13px; line-height:1.7}

    /* Hero (단일 컬럼, 꽉 채움) */
    .hero{padding:26px 0 34px}
    .hero-shell{
      position:relative; overflow:hidden;
      border-radius:var(--radius);
      border:1px solid rgba(255,255,255,.12);
      background:
        radial-gradient(900px 520px at 30% 10%, rgba(66,199,241,.14), transparent 60%),
        radial-gradient(760px 520px at 70% 20%, rgba(127,238,14,.12), transparent 55%),
        radial-gradient(860px 560px at 20% 90%, rgba(251,130,57,.08), transparent 60%),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
      box-shadow:var(--shadow);
      padding:32px;
      min-height: min(72vh, 640px);
      display:flex;
      align-items:center;
    }
    .hero-inner{max-width:920px}
    .hero-h1{
      margin:12px 0 0; font-size:52px; line-height:1.1;
      letter-spacing:-.8px; font-weight:1000;
    }
    .hero-sub{
      margin:14px 0 0; color:var(--muted);
      font-size:16px; line-height:1.85; max-width:78ch;
      font-weight:700;
    }
    .hero-ctas{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}

    .hero-grid{
      display:grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap:12px;
      margin-top:20px;
    }
    .mini-card{
      border-radius:18px;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(255,255,255,.03);
      padding:16px;
    }
    .mini-card b{display:block;font-weight:1000}
    .mini-card p{margin:8px 0 0;color:var(--muted);line-height:1.75;font-weight:700;font-size:14px}
    .mini-card .tagline{margin-top:10px;color:var(--muted2);font-weight:900;font-size:12px;line-height:1.6}

    /* Footer: 중복 네비게이션 삭제(링크형 메뉴 없음) */
    footer{
      padding:34px 0 44px;
      border-top:1px solid rgba(255,255,255,.10);
      background:rgba(255,255,255,.02);
    }
    .foot{
      display:grid;grid-template-columns:1.2fr .8fr;gap:12px;align-items:start
    }
    .foot-info{color:var(--muted);line-height:1.9;font-weight:700;font-size:14px}
    .legal{
      display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;
      color:var(--muted2);font-weight:900;font-size:13px
    }
    .legal a:hover{color:var(--text)}
    .foot-box{padding:16px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03)}
    .foot-box .t1{color:rgba(238,242,255,.60);font-weight:1000;font-size:12px;letter-spacing:1.8px}
    .foot-box .t2{margin-top:10px;font-weight:900;font-size:12px;line-height:1.9;color:rgba(238,242,255,.86)}
    .contact-lines .row{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
    .contact-lines .label{min-width:64px;color:rgba(238,242,255,.55);font-weight:1000;letter-spacing:.6px}
    .contact-lines .val{font-weight:900;letter-spacing:-0.01em}

    /* Footer CONTACT 강조 */
    .foot-contact .t1{
      color: var(--brand);
      font-size: 19px; /* 12px -> 1.5배 이상 */
    }
    .foot-contact .t2{
      font-size: 18px; /* 12px -> 1.5배 */
    }
    .foot-contact .contact-lines .label{
      font-size: 16px;
    }
    .foot-contact .contact-lines .val{
      font-size: 18px;
    }

    /* Floating quick */
    #overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:120}
    #quick{
      position:fixed;right:-560px;bottom:90px;z-index:130;
      width:min(520px, calc(100vw - 24px));
      border-radius:22px;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(11,18,32,.96);
      box-shadow:var(--shadow);
      transition:right .28s var(--ease);
      overflow:hidden;
    }
    #quick.on{right:12px}
    .quick-head{
      padding:14px 16px;
      border-bottom:1px solid rgba(255,255,255,.10);
      display:flex;align-items:center;justify-content:space-between;gap:10px
    }
    .quick-head b{font-weight:1000}
    .quick-body{padding:14px 16px}
    .mini-form{display:grid;gap:10px;margin-top:12px}
    .mini-form input, .mini-form select, .mini-form textarea{
      width:100%; padding:12px 12px;
      border-radius:14px; border:1px solid rgba(255,255,255,.14);
      background:rgba(10,14,24,.45); color:var(--text);
      outline:none; font-weight:800;
    }
    .mini-form textarea{min-height:90px;resize:vertical}
    .mini-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    .mini-form .agree{display:flex;gap:8px;align-items:center;color:var(--muted2);font-size:12px;font-weight:900}
    .mini-form button{width:100%}

    #quickBtn{
      position:fixed;right:12px;bottom:12px;z-index:140;
      width:74px;height:74px;border-radius:24px;border:0;
      background:linear-gradient(135deg, rgba(197,52,40,.92), rgba(251,130,57,.55));
      box-shadow:var(--shadow);
      color:#fff;font-weight:1000;cursor:pointer;
    }
    #quickBtn i{font-size:18px}
    #quickBtn span{display:block;margin-top:2px;font-size:12px;letter-spacing:.2px}

    @media (max-width: 980px){
      nav{display:none}
      .hamburger{display:inline-flex}
      .hero-h1{font-size:40px}
      .hero-shell{padding:22px; min-height:auto}
      .hero-grid{grid-template-columns:1fr}
      .mini-form .row2{grid-template-columns:1fr}
      .foot{grid-template-columns:1fr}
    }
  

header nav a.authlink{ text-decoration: underline; text-underline-offset: 6px; }

.pagination{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.pagination .page{padding:8px 12px;border:1px solid rgba(255,255,255,.14);border-radius:14px;color:var(--text);background:rgba(255,255,255,.03)}
.pagination .page:hover{background:rgba(255,255,255,.06)}
.pagination .current{background:rgba(66,199,241,.20);border-color:rgba(66,199,241,.35)}

/* Admin sub navigation */
.admin-tabs{
  display:flex; gap:10px; flex-wrap:wrap; align-items:center;
  padding:10px; border:1px solid rgba(255,255,255,.12); border-radius:18px;
  background:rgba(255,255,255,.03);
}
.admin-tabs .tab{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px; border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);
  font-weight:900; font-size:13px; color:rgba(238,242,255,.82);
}
.admin-tabs .tab:hover{transform:translateY(-1px)}
.admin-tabs .tab.on{
  border-color:rgba(66,199,241,.55);
  box-shadow:0 0 0 3px rgba(66,199,241,.10) inset;
  color:var(--text);
}
.inq-actions{display:flex;gap:8px;flex-wrap:wrap}
.btn.danger{background:rgba(197,52,40,.14);border-color:rgba(197,52,40,.35);color:#ffb4ad}
b.danger{color:#ff8b80}


.btn.success{border-color:#2e7d32;color:#2e7d32;background:rgba(46,125,50,0.10);} .btn.success:hover{background:rgba(46,125,50,0.18);} 

/* Lists used in Company page */
.list{margin:0; padding-left:18px; color:rgba(238,242,255,.86)}
.list li{margin:8px 0; line-height:1.55}


/* ===== Home updates: hero slider + quick links + logo image ===== */
.logo{background-image:url('ci/header_logo.png');background-size:contain;background-position:center;background-repeat:no-repeat;background-color:transparent;}
@media (min-width:900px){.logo{background-image:url('ci/header_logo.png');}}
.hero-shell{position:relative;overflow:hidden;}

.hero-nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;z-index:2;padding:0 14px;pointer-events:none}
.hero-nav-btn{pointer-events:auto;width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.25);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease)}
.hero-nav-btn:hover{transform:translateY(-1px);background:rgba(0,0,0,.35);border-color:rgba(255,255,255,.30)}
.hero-nav-btn:active{transform:translateY(0)}
@media (max-width: 720px){
  .hero-nav{padding:0 8px}
  .hero-nav-btn{width:40px;height:40px}
}

.hero-slider{position:absolute;inset:0;display:flex;will-change:transform;transition:transform 1.2s ease-in-out;z-index:0;}
.hero-slide{flex:0 0 100%;}
.hero-slide img{width:100%;height:100%;object-fit:cover;display:block;}
.hero-overlay{position:absolute;inset:0;z-index:0;background:linear-gradient(90deg, rgba(10,14,20,.88) 0%, rgba(10,14,20,.70) 45%, rgba(10,14,20,.38) 75%, rgba(10,14,20,.18) 100%);}
.hero-inner{position:relative;z-index:1;}
.hero-sub{word-break:keep-all;}

.home-links{margin-top:16px;}
.home-links .hero-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;}
.link-card{display:flex;gap:12px;align-items:flex-start;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);padding:16px;text-decoration:none;}
.link-card:hover{transform:translateY(-1px);box-shadow:0 14px 40px rgba(0,0,0,.24)}
.link-card .ic{width:36px;height:36px;border-radius:14px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);flex:0 0 auto;}
.link-card b{display:block;font-weight:1000;}
.link-card p{margin:6px 0 0;color:var(--muted);line-height:1.65;font-weight:700;font-size:13px;word-break:keep-all}
@media (max-width:1100px){.home-links .hero-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){.home-links .hero-grid{grid-template-columns:1fr;}}


/* services: self-check link */
.k-flex{display:flex;align-items:center;gap:10px;justify-content:space-between}
.k-flex .k-link{color:var(--brand);text-decoration:underline;font-weight:800}
.k-flex .k-link:hover{opacity:.85}

/* Footer contact emphasis */
.foot-box{font-size:1.5em}
.foot-box .t1{color:var(--brand);font-weight:1000;letter-spacing:.06em}

/* FAQ layout */
.faq{display:grid;grid-template-columns:1fr;gap:14px;margin-top:18px}
@media (min-width: 900px){.faq{grid-template-columns:1fr 1fr;gap:16px}}
.faq details{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:16px;padding:10px 12px}
.faq summary{cursor:pointer;font-weight:800;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq .faq-answer{margin-top:10px}
.faq .faq-answer table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.faq .faq-answer td{padding:12px;color:var(--muted);line-height:1.55}


/* policy pages */

.h1{font-size:28px;font-weight:800;letter-spacing:-0.02em;margin:8px 0 14px}
.h2{font-size:18px;font-weight:800;margin:18px 0 8px}
.h3{font-size:16px;font-weight:800;margin:16px 0 6px}
.policy-card{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);border-radius:16px;padding:18px}
.policy-text p{line-height:1.75;margin:8px 0;color:rgba(255,255,255,.92)}
.policy-text ul{margin:8px 0 8px 18px}
.policy-text li{margin:6px 0;line-height:1.65;color:rgba(255,255,255,.92)}
.policy-text a{color:#4aa3ff;text-decoration:underline;text-underline-offset:3px}

/* privacy consent box (forms) */
.policy-scroll{max-height:220px; overflow:auto; padding:12px; border:1px solid rgba(255,255,255,.14); background:rgba(0,0,0,.18); border-radius:12px}
.policy-scroll pre{margin:0; white-space:pre-wrap; word-break:break-word; line-height:1.6; font-family:inherit; color:rgba(255,255,255,.92)}
.checkline{display:flex; gap:10px; align-items:center; justify-content:center; margin:14px auto 6px; width:fit-content; cursor:pointer}
.checkline input{margin-top:3px}

.policy-text{ text-align:left; }

/* policy pages (terms/privacy) */
.policy-card{ text-align:left !important; }
.policy-pre{
  margin:0;
  padding:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  border-radius:14px;
  white-space:pre-wrap;
  word-break:keep-all;
  line-height:1.75;
  text-align:left !important;
  color:rgba(255,255,255,.92);
  font-family:inherit;
}


/* v8 form typography & consent alignment (strong override) */
.policy-scroll pre{font-size:16px !important; line-height:1.7 !important;}
/* form text scale up to match policy body */
form.row, form.row .field, form.row label, form.row input, form.row textarea, form.row .small, form.row .help{
  font-size:16px !important;
}
form.row .field label{font-weight:700 !important;}
/* consent: text left, checkbox on the right, centered as a unit */
.checkline{
  display:inline-flex !important;
  flex-direction:row-reverse !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  margin:14px auto 8px !important;
  width:fit-content !important;
}
.checkline span{
  font-size:16px !important;
  line-height:1.4 !important;
}
.checkline input[type="checkbox"]{
  width:18px !important;
  height:18px !important;
  margin:0 !important;
  accent-color:#4aa3ff;
}