@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css");

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body.law-page {
  --red:#ccac7a;
  --red-dark:#b89058;
  --navy:#0a1931;
  --navy-deep:#061123;
  --navy-soft:#12243d;
  --gold:#ccac7a;
  --gold-light:#ccac7a;
  --ink:#1d2430;
  --muted:#686868;
  --line:#e8e8e8;
  --soft:#f6f1e8;
  --paper:#fff;
  --dark:#101b2b;
  --radius:25px;
  --max:1320px;
  margin:0;
  overflow-x:hidden;
  background:#fff;
  color:var(--ink);
  font-family:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  word-break:keep-all;
}
a { color:inherit; text-decoration:none; }
button, input, select, textarea { font:inherit; }
button { cursor:pointer; }
.law-inner { width:min(var(--max), calc(100% - 52px)); margin:0 auto; }

.law-header {
  position:fixed;
  inset:0 0 auto;
  z-index:80;
  height:86px;
  display:grid;
  grid-template-columns:minmax(220px, 1fr) auto minmax(220px, 1fr);
  align-items:center;
  gap:28px;
  padding:0 max(26px, calc((100% - var(--max)) / 2));
  background:rgba(255,255,255,.98);
  color:#212121;
  border-bottom:1px solid #e7e7e7;
  box-shadow:none;
  backdrop-filter:blur(12px);
}
.law-logo {
  display:inline-flex;
  align-items:center;
  justify-self:start;
  gap:12px;
  font-size:25px;
  font-weight:750;
  line-height:1;
  white-space:nowrap;
}
.law-logo svg {
  display:block;
  width:36px;
  height:36px;
  flex:0 0 36px;
  color:var(--navy);
  transform:translateY(-1px);
}
.law-header nav {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:38px;
  font-size:16px;
  font-weight:650;
}
.law-header nav a {
  position:relative;
  color:#212121;
  transition:color .22s ease;
}
.law-header nav a:not(.law-nav-cta)::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-25px;
  height:2px;
  background:#212121;
  opacity:0;
  transform:scaleX(.45);
  transition:opacity .22s ease, transform .22s ease;
}
.law-header nav a:hover { color:rgba(33,33,33,.52); }
.law-header nav a:hover::after { opacity:1; transform:scaleX(1); }
.law-nav-cta {
  justify-self:end;
  padding:12px 18px;
  background:var(--navy);
  color:#fff !important;
  border-radius:25px;
  font-weight:650;
}
.law-nav-cta:hover { background:#fff; color:var(--navy) !important; outline:1px solid #d3d3d3; }

.law-hero {
  position:relative;
  min-height:920px;
  display:flex;
  align-items:center;
  padding:86px 0 0;
  overflow:hidden;
  background:var(--navy-deep);
}
.law-hero-bg {
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(10,25,49,.96) 0%, rgba(10,25,49,.82) 34%, rgba(10,25,49,.24) 58%, rgba(10,25,49,.08) 100%),
    url('/img/4_quote/헌율_메인배너.png') center right/cover no-repeat;
}
.law-hero-grid {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0, 760px);
  align-items:center;
  justify-content:space-between;
  gap:64px;
}
.law-title p {
  margin:0 0 16px;
  color:var(--red);
  font-size:14px;
  font-weight:750;
  letter-spacing:.08em;
}
.law-hero h1 {
  margin:0;
  font-size:clamp(46px, 5vw, 78px);
  line-height:1.12;
  letter-spacing:-.025em;
  color:#fff;
  font-weight:750;
}
.law-hero h1 span { color:var(--red); }
.law-lead {
  width:min(680px, 100%);
  margin:30px 0 0;
  color:rgba(255,255,255,.72);
  font-size:22px;
  font-weight:400;
  line-height:1.78;
}
.law-hero-actions {
  display:flex;
  gap:14px;
  margin-top:44px;
}
.law-hero-actions a {
  min-width:184px;
  padding:20px 26px;
  border:1px solid rgba(255,255,255,.38);
  background:rgba(255,255,255,.06);
  color:#fff;
  text-align:center;
  font-size:20px;
  font-weight:650;
  border-radius:25px;
  transition:background-color .22s ease, color .22s ease, border-color .22s ease;
}
.law-hero-actions a:first-child {
  background:#fff;
  border-color:rgba(255,255,255,.7);
  color:var(--gold);
}
.law-hero-actions a:hover {
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.65);
  color:#fff;
}
.law-hero-actions a:first-child:hover { background:var(--navy); border-color:rgba(255,255,255,.42); color:#fff; }
.law-section { padding:118px 0; }
.law-debt { background:#fff; }
.law-split {
  display:grid;
  grid-template-columns:minmax(0, .9fr) minmax(420px, 1.1fr);
  gap:72px;
  align-items:center;
}
.law-copy h2,
.law-office-copy h2,
.law-consult-copy h2,
.law-title h2 {
  margin:0;
  color:#111;
  font-size:clamp(36px, 3.8vw, 58px);
  font-weight:750;
  line-height:1.22;
  letter-spacing:-.025em;
}
.law-copy h2 {
  max-width:720px;
  font-size:clamp(30px, 2.8vw, 44px);
  line-height:1.28;
}
.law-pulse-title span {
  animation:lawTextPulse 2.15s ease-in-out infinite;
}
.law-pulse-title span:nth-of-type(2) {
  animation-delay:.14s;
}
@keyframes lawTextPulse {
  0%, 100% { color:#111; }
  50% { color:var(--gold); }
}
.law-copy p,
.law-office-copy p,
.law-consult-copy p {
  margin:28px 0 0;
  color:#5a5a5a;
  font-size:20px;
  font-weight:400;
  line-height:1.82;
}
.law-image-card {
  position:relative;
  min-height:500px;
  overflow:hidden;
  border-radius:25px;
  box-shadow:0 28px 72px rgba(0,0,0,.14);
}
.law-image-card img {
  display:block;
  width:100%;
  height:100%;
  min-height:500px;
  object-fit:cover;
}

.law-stat-band {
  padding:96px 0;
  background:
    linear-gradient(90deg, rgba(7,17,31,.82), rgba(16,27,43,.7)),
    url('/img/4_quote/헌율_사무실.png') center/cover no-repeat;
  color:#fff;
}
.law-stat-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:22px;
}
.law-stat-grid > div {
  padding:18px 8px;
  text-align:center;
}
.law-stat-grid strong {
  display:block;
  font-size:clamp(46px, 5vw, 76px);
  line-height:1;
  font-weight:750;
  color:var(--gold);
}
.law-stat-grid p {
  margin:18px 0 0;
  color:rgba(255,255,255,.86);
  font-size:18px;
  font-weight:500;
}

.law-service {
  background:
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.9)),
    url('/img/4_quote/헌율_법률상담.png') center/cover no-repeat;
}
.law-title {
  max-width:820px;
  margin:0 auto 54px;
  text-align:center;
}
.law-service-grid {
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:22px;
}
.law-service-grid article {
  position:relative;
  min-height:360px;
  padding:34px 28px 132px;
  overflow:hidden;
  background:rgba(255,255,255,.93);
  border:1px solid rgba(16,27,43,.08);
  border-radius:25px;
  transition:background-color .22s ease, color .22s ease;
}
.law-service-grid article::after {
  content:none;
}
.law-service-grid article:hover {
  background:#0a1931;
  color:#fff;
}
.law-service-grid span {
  position:relative;
  z-index:1;
  color:var(--red);
  font-size:18px;
  font-weight:700;
}
.law-service-grid h3 {
  position:relative;
  z-index:1;
  margin:26px 0 18px;
  font-size:30px;
  line-height:1.24;
  font-weight:700;
}
.law-service-grid p {
  margin:0;
  position:relative;
  z-index:1;
  color:#626262;
  font-size:17px;
  font-weight:400;
  line-height:1.76;
}
.law-service-grid article:hover p { color:rgba(255,255,255,.72); }
.law-service-icon {
  position:absolute;
  right:28px;
  bottom:28px;
  z-index:0;
  display:grid;
  place-items:center;
  width:86px;
  height:86px;
  background:#f1eadf;
  color:#bf9552;
  border-radius:25px;
  transition:background-color .22s ease, color .22s ease;
}
.law-service-icon svg {
  display:block;
  width:50px;
  height:50px;
}
.law-service-icon path {
  fill:none;
  stroke:currentColor;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.law-service-grid article:hover .law-service-icon {
  background:rgba(204,172,122,.16);
  color:var(--gold-light);
}

.law-office-band {
  position:relative;
  min-height:620px;
  display:flex;
  align-items:center;
  overflow:hidden;
  color:#fff;
}
.law-office-bg {
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(7,17,31,.92) 0%, rgba(7,17,31,.66) 48%, rgba(7,17,31,.18) 100%),
    url('/img/4_quote/헌율_사무실.png') center/cover no-repeat;
}
.law-office-copy {
  position:relative;
  z-index:1;
  width:min(620px, 100%);
}
.law-office-copy h2,
.law-office-copy p { color:#fff; }
.law-office-copy h2 span { color:var(--gold); }
.law-office-copy p { color:rgba(255,255,255,.78); }

.law-process { background:var(--soft); }
.law-process-grid {
  display:grid;
  grid-template-columns:minmax(280px, .68fr) minmax(0, 1.32fr);
  gap:42px;
  align-items:start;
}
.law-process-grid .law-title {
  margin:0;
  text-align:left;
}
.law-process-list {
  display:grid;
  gap:18px;
  margin:0;
  padding:0;
  list-style:none;
}
.law-process-list li {
  display:grid;
  grid-template-columns:50px minmax(104px, 148px) 1fr;
  align-items:center;
  gap:16px;
  min-height:112px;
  padding:28px 34px;
  background:#fff;
  border:1px solid rgba(16,27,43,.07);
  border-radius:25px;
  box-shadow:0 18px 48px rgba(0,0,0,.06);
}
.law-process-list b {
  color:var(--red);
  font-size:15px;
  font-weight:700;
}
.law-process-list strong {
  color:#111;
  font-size:24px;
  font-weight:700;
}
.law-process-list span {
  color:#626262;
  font-size:16px;
  font-weight:400;
  line-height:1.62;
}

.law-proof-section {
  padding:126px 0;
  background:#fff;
}
.law-title h2 span { color:var(--gold); }
.law-proof-grid {
  display:grid;
  grid-template-columns:1.18fr .91fr .91fr;
  gap:24px;
  align-items:stretch;
}
.law-proof-grid figure {
  position:relative;
  min-height:444px;
  margin:0;
  overflow:hidden;
  border-radius:25px;
  background:#111;
}
.law-proof-grid figure:first-child { min-height:580px; }
.law-proof-grid img {
  display:block;
  width:100%;
  height:100%;
  min-height:inherit;
  object-fit:cover;
  transition:transform .45s ease, opacity .45s ease;
}
.law-proof-grid figure:hover img {
  transform:scale(1.04);
  opacity:.88;
}
.law-proof-grid figcaption {
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:34px;
  color:#fff;
  background:linear-gradient(0deg, rgba(0,0,0,.74), rgba(0,0,0,0));
}
.law-proof-grid b {
  display:block;
  color:var(--gold-light);
  font-size:28px;
  font-weight:700;
}
.law-proof-grid span {
  display:block;
  margin-top:10px;
  color:rgba(255,255,255,.82);
  font-size:16px;
  font-weight:400;
  line-height:1.6;
}

.law-faq-section { background:var(--soft); }
.law-faq {
  max-width:980px;
  margin:0 auto;
  border-top:1px solid #dcdcdc;
}
.law-faq-item {
  border-bottom:1px solid #dcdcdc;
}
.law-faq button {
  width:100%;
  min-height:82px;
  padding:26px 6px;
  border:0;
  background:transparent;
  color:#111;
  text-align:left;
  font-size:22px;
  font-weight:650;
}
.law-faq button::after {
  content:"+";
  float:right;
  color:var(--gold);
  font-size:26px;
  font-weight:700;
}
.law-faq-item.open button::after { content:"-"; }
.law-faq p {
  max-height:0;
  opacity:0;
  overflow:hidden;
  margin:0;
  padding:0 6px;
  color:#666;
  font-size:18px;
  font-weight:400;
  line-height:1.78;
  transition:max-height .65s cubic-bezier(.19,1,.22,1), opacity .42s ease, padding .42s ease;
}
.law-faq-item.open p {
  max-height:220px;
  opacity:1;
  padding:0 6px 30px;
}

.law-consult {
  position:relative;
  padding-bottom:170px;
  background:
    linear-gradient(90deg, rgba(7,17,31,.96) 0%, rgba(7,17,31,.78) 52%, rgba(7,17,31,.54) 100%),
    url('/img/4_quote/헌율_법률상담.png') center/cover no-repeat;
  color:#fff;
}
.law-consult-grid {
  display:grid;
  grid-template-columns:minmax(330px, .78fr) minmax(0, 1.22fr);
  gap:66px;
  align-items:center;
}
.law-consult-copy h2,
.law-consult-copy p { color:#fff; }
.law-consult-copy p { color:rgba(255,255,255,.74); }
.law-form {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
  padding:42px;
  background:#fff;
  color:#111;
  border-radius:25px;
  box-shadow:0 28px 80px rgba(0,0,0,.28);
}
.law-form label {
  display:grid;
  gap:10px;
  color:#111;
  font-size:16px;
  font-weight:500;
}
.law-form .full { grid-column:1 / -1; }
.law-form input,
.law-form select,
.law-form textarea {
  width:100%;
  min-width:0;
  border:1px solid #ddd;
  background:#f8f8f8;
  color:#111;
  padding:18px;
  font-size:16px;
  font-weight:400;
  border-radius:25px;
  transition:border-color .22s ease, background-color .22s ease;
}
.law-form input:focus,
.law-form select:focus,
.law-form textarea:focus,
.law-bottom-form input:focus,
.law-bottom-form select:focus {
  outline:0;
  border-color:var(--red);
  background:#fff;
}
.law-bottom-form input:focus,
.law-bottom-form select:focus {
  background:rgba(255,255,255,.14);
}
.law-bottom-form input::placeholder { color:rgba(255,255,255,.54); }
.law-form input::placeholder,
.law-form textarea::placeholder {
  color:rgba(17,17,17,.42);
  font-weight:400;
}
.law-bottom-form input::placeholder {
  font-weight:400;
}
.law-form textarea { resize:vertical; }
.law-agree {
  display:flex !important;
  grid-template-columns:none !important;
  align-items:center;
  gap:10px;
  color:#666 !important;
  font-weight:400 !important;
}
.law-agree input,
.law-bottom-agree input {
  width:18px;
  height:18px;
  flex:0 0 18px;
  margin:0;
  accent-color:var(--red);
}
.law-form button {
  grid-column:1 / -1;
  min-height:62px;
  border:0;
  background:var(--navy);
  color:#fff;
  font-size:19px;
  font-weight:700;
  border-radius:25px;
  transition:background-color .22s ease;
}
.law-form button:hover { background:#fff; color:var(--navy); outline:1px solid #d3d3d3; }

.law-bottom-form {
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:90;
  display:grid;
  grid-template-columns:280px minmax(150px, 190px) minmax(130px, 180px) minmax(150px, 190px) minmax(128px, 160px) 150px;
  gap:10px;
  align-items:center;
  padding:14px max(22px, calc((100vw - var(--max)) / 2)) calc(14px + env(safe-area-inset-bottom));
  background:rgba(10,25,49,.92);
  border-top:1px solid rgba(198,163,106,.24);
  box-shadow:0 -14px 34px rgba(0,0,0,.18);
}
.law-bottom-form strong {
  color:var(--gold-light);
  font-size:16px;
  font-weight:700;
  white-space:nowrap;
}
.law-bottom-form input,
.law-bottom-form select {
  min-width:0;
  height:48px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  color:#fff;
  padding:0 14px;
  font-size:15px;
  font-weight:400;
  border-radius:25px;
}
.law-bottom-agree {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:rgba(255,255,255,.82);
  font-size:14px;
  font-weight:400;
  white-space:nowrap;
}
.law-bottom-form button {
  height:48px;
  border:0;
  background:var(--red);
  color:#07111f;
  font-size:16px;
  font-weight:700;
  border-radius:25px;
  transition:background-color .22s ease;
}
.law-bottom-form button:hover { background:var(--red-dark); }

.law-top-button {
  position:fixed;
  right:20px;
  bottom:calc(88px + env(safe-area-inset-bottom));
  z-index:91;
  display:grid;
  grid-template-rows:auto auto;
  place-items:center;
  align-content:center;
  gap:5px;
  width:58px;
  height:58px;
  border:1px solid var(--gold);
  background:var(--navy);
  color:var(--gold);
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  border-radius:0;
  transition:background-color .22s ease, color .22s ease;
}
.law-top-button::before {
  content:"";
  width:0;
  height:0;
  border-left:6px solid transparent;
  border-right:6px solid transparent;
  border-bottom:8px solid currentColor;
}
.law-top-button:hover {
  background:var(--navy-deep);
  color:var(--gold-light);
}

.law-footer {
  padding:58px 0 112px;
  background:var(--navy-deep);
  color:rgba(255,255,255,.58);
}
.law-footer strong {
  display:block;
  margin-bottom:14px;
  color:#fff;
  font-size:23px;
  font-weight:700;
}
.law-footer p {
  margin:0;
  font-size:14px;
  font-weight:400;
}

.reveal {
  opacity:0;
  transform:translateY(34px);
  transition:opacity 1.05s cubic-bezier(.19,1,.22,1), transform 1.05s cubic-bezier(.19,1,.22,1);
}
.reveal.on {
  opacity:1;
  transform:translateY(0);
}
.delay-1 { transition-delay:.1s; }
.delay-2 { transition-delay:.2s; }
.delay-3 { transition-delay:.3s; }

.law-nav-cta:hover,
.law-form button:hover {
  outline:0;
}
.law-proof-grid img,
.law-service-grid article,
.law-form button,
.law-bottom-form button,
.law-top-button {
  backface-visibility:hidden;
}
.law-proof-grid figure:hover img {
  transform:none;
  opacity:.9;
}

@media (max-width:1100px) {
  .law-header {
    grid-template-columns:1fr auto;
    height:auto;
    min-height:78px;
    gap:14px 24px;
    padding:14px 26px;
  }
  .law-header nav {
    order:3;
    grid-column:1 / -1;
    justify-content:center;
    gap:28px;
  }
  .law-header nav a:not(.law-nav-cta)::after { bottom:-14px; }
  .law-hero { padding-top:108px; }
  .law-hero-grid,
  .law-split,
  .law-process-grid,
  .law-consult-grid {
    grid-template-columns:1fr;
  }
  .law-service-grid,
  .law-stat-grid { grid-template-columns:repeat(2, 1fr); }
  .law-proof-grid { grid-template-columns:1fr 1fr; }
  .law-proof-grid figure:first-child { grid-column:1 / -1; }
  .law-process-grid .law-title,
  .law-consult-grid .law-title { text-align:center; margin:0 auto 42px; }
  .law-bottom-form {
    grid-template-columns:1fr 1fr 1fr;
  }
  .law-bottom-form strong { text-align:center; }
  .law-bottom-agree { justify-content:flex-start; }
}

@media (max-width:720px) {
  .law-inner { width:min(100% - 34px, var(--max)); }
  .law-header {
    padding:12px 17px;
  }
  .law-logo {
    gap:9px;
    font-size:20px;
  }
  .law-logo svg { width:31px; height:31px; flex-basis:31px; }
  .law-header nav {
    gap:13px;
    overflow:auto;
    justify-content:flex-start;
    padding-bottom:2px;
    font-size:14px;
    scrollbar-width:none;
  }
  .law-header nav::-webkit-scrollbar { display:none; }
  .law-nav-cta { padding:10px 14px; }
  .law-hero {
    min-height:auto;
    padding:168px 0 92px;
  }
  .law-hero-bg {
    background:
      linear-gradient(180deg, rgba(7,17,31,.92) 0%, rgba(7,17,31,.76) 48%, rgba(7,17,31,.58) 100%),
      url('/img/4_quote/헌율_메인배너.png') center/cover no-repeat;
  }
  .law-hero h1 {
    font-size:clamp(34px, 10vw, 46px);
  }
  .law-lead {
    margin-top:22px;
    font-size:17px;
    line-height:1.68;
  }
  .law-hero-actions {
    flex-direction:column;
    margin-top:32px;
  }
  .law-hero-actions a { width:100%; min-width:0; padding:17px 20px; }
  .law-stat-grid,
  .law-service-grid,
  .law-proof-grid { grid-template-columns:1fr; }
  .law-proof-grid figure:first-child { grid-column:auto; }
  .law-section { padding:82px 0; }
  .law-proof-section { padding:82px 0; }
  .law-copy h2,
  .law-office-copy h2,
  .law-consult-copy h2,
  .law-title h2 {
    font-size:clamp(28px, 8vw, 38px);
  }
  .law-copy p,
  .law-office-copy p,
  .law-consult-copy p {
    margin-top:20px;
    font-size:16px;
    line-height:1.7;
  }
  .law-split { gap:34px; }
  .law-image-card,
  .law-image-card img { min-height:320px; }
  .law-stat-band { padding:66px 0; }
  .law-stat-grid { gap:30px; }
  .law-stat-grid strong { font-size:50px; }
  .law-office-band { min-height:520px; }
  .law-proof-grid figure,
  .law-proof-grid figure:first-child { min-height:360px; }
  .law-proof-grid figcaption { padding:24px; }
  .law-process-list li {
    grid-template-columns:1fr;
    gap:8px;
    min-height:auto;
    padding:24px;
  }
  .law-faq button {
    min-height:70px;
    padding:22px 4px;
    font-size:18px;
  }
  .law-faq p { font-size:16px; }
  .law-consult { padding-bottom:220px; }
  .law-form {
    grid-template-columns:1fr;
    padding:24px;
    gap:14px;
  }
  .law-form input,
  .law-form select,
  .law-form textarea {
    padding:15px;
    font-size:15px;
  }
  .law-bottom-form {
    grid-template-columns:1fr 1fr;
    gap:9px;
    padding:12px 12px calc(12px + env(safe-area-inset-bottom));
  }
  .law-bottom-form strong,
  .law-bottom-agree,
  .law-bottom-form button {
    grid-column:1 / -1;
  }
  .law-bottom-form strong { text-align:center; }
  .law-bottom-agree {
    justify-content:center;
    font-size:13px;
  }
  .law-bottom-form input,
  .law-bottom-form select,
  .law-bottom-form button {
    height:46px;
    font-size:14px;
  }
  .law-top-button {
    right:14px;
    bottom:calc(292px + env(safe-area-inset-bottom));
    width:52px;
    height:52px;
    gap:4px;
    font-size:13px;
  }
  .law-footer { padding:42px 0 340px; }
}

@media (max-width:380px) {
  .law-inner { width:min(100% - 28px, var(--max)); }
  .law-logo { font-size:18px; }
  .law-logo svg { width:29px; height:29px; flex-basis:29px; }
  .law-header { grid-template-columns:1fr; }
  .law-header nav { font-size:12px; gap:10px; }
  .law-hero { padding-top:174px; }
  .law-bottom-form { padding-inline:10px; }
  .law-top-button {
    right:12px;
    bottom:calc(304px + env(safe-area-inset-bottom));
  }
  .law-footer { padding-bottom:360px; }
}
