/* 해결한의원 — static site styles.
   Generated from the original template's style-hover attributes. */
.hv1:hover{background:#EEF3EF !important;color:#0E7A55 !important}
.hv2:hover{background:#0A5C41 !important;transform:translateY(-2px) !important;box-shadow:0 10px 24px rgba(14,122,85,.32) !important}
.hv3:hover{transform:translateY(-3px) !important;box-shadow:0 14px 30px rgba(180,208,0,.3) !important}
.hv4:hover{background:rgba(255,255,255,.12) !important;border-color:#fff !important}
.hv5:hover{color:#B4D000 !important}
.hv6:hover{background:rgba(255,255,255,.06) !important;border-color:#B4D000 !important}
.hv7:hover{transform:scale(1.02) !important}
.hv8:hover{background:#0A5C41 !important;transform:translateY(-2px) !important}
.hv9:hover{transform:translateY(-2px) !important}
.hv10:hover{background:#F2F5F1 !important}
.hv11:hover{transform:translateY(-3px) scale(1.05) !important}
.hv12:hover{transform:translateY(-3px) !important}
.hv13:hover{background:#F7F8F5 !important}
.hv14:hover{transform:scale(1.06) !important}
.hv15:hover{transform:translateY(-4px) !important}
.hv16:hover{transform:translateY(-4px) !important;box-shadow:0 12px 28px rgba(10,42,32,.08) !important}
.hv17:hover{box-shadow:0 14px 32px rgba(10,42,32,.09) !important}
.hv18:hover{box-shadow:0 16px 36px rgba(10,42,32,.1) !important;border-color:#B4D000 !important}
.hv19:hover{border-color:#B4D000 !important}

[hidden]{display:none !important}

/* ---------- dropdown navigation ---------- */
.hg-dd{position:relative}
.hg-caret{font-size:9px;margin-left:5px;opacity:.55;display:inline-block;transition:transform .2s ease}
.hg-dd-menu{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(6px);min-width:200px;background:#fff;border:1px solid #E7EAE4;border-radius:16px;box-shadow:0 18px 44px rgba(10,42,32,.16);padding:8px;opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:80}
.hg-dd.open .hg-dd-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.hg-dd.open .hg-caret{transform:rotate(180deg)}
@media (hover:hover){
  .hg-dd:hover .hg-dd-menu,.hg-dd:focus-within .hg-dd-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
  .hg-dd:hover .hg-caret{transform:rotate(180deg)}
}
.hg-dd-menu a{display:block;padding:11px 16px;border-radius:10px;font-size:14px;font-weight:600;color:#3C4A43;white-space:nowrap;text-align:left}
.hg-dd-menu a:hover{background:#EEF3EF;color:#0E7A55}
.hg-dd:last-of-type .hg-dd-menu{left:auto;right:0;transform:translateY(6px)}
.hg-dd:last-of-type.open .hg-dd-menu{transform:translateY(0)}
@media (hover:hover){.hg-dd:last-of-type:hover .hg-dd-menu,.hg-dd:last-of-type:focus-within .hg-dd-menu{transform:translateY(0)}}

/* anchored sections land below the sticky header */
[id]{scroll-margin-top:100px}

/* Reveal-on-scroll fallback: if JavaScript is unavailable, show everything. */
.no-js [data-reveal]{opacity:1 !important;transform:none !important}
@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important}
  html{scroll-behavior:auto}
}
@media (max-width: 860px){
  header nav{gap:2px}
  header nav a{padding:8px 10px;font-size:14px}
}

/* ---------- responsive layout ----------
   All pages share the same inline desktop layouts. These rules keep the
   existing visual language while allowing every section to reflow with the
   viewport instead of preserving desktop-width columns on a phone. */
html,body{max-width:100%;overflow-x:clip}
img,svg,video,iframe{max-width:100%}

@media (max-width: 760px){
  /* Header: keep the complete navigation available without forcing a
     desktop-width row beyond the viewport. */
  header>div{
    height:auto !important;
    min-height:0 !important;
    padding-top:12px !important;
    padding-bottom:12px !important;
    align-items:flex-start !important;
    flex-wrap:wrap !important;
    gap:10px !important;
  }
  header nav{
    width:100%;
    order:2;
    flex-wrap:nowrap !important;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    padding:2px 0 8px;
    scrollbar-width:none;
  }
  header nav::-webkit-scrollbar{display:none}
  header nav>*{flex:0 0 auto}
  header nav .hv1,header nav .hv2{
    padding:8px 10px !important;
    font-size:13px !important;
    white-space:nowrap;
  }
  header nav .hv2{margin-left:4px !important;padding:9px 14px !important}
  /* Dropdown lists are accessed by a second tap on mobile; keeping the
     horizontal tab bar unclipped is more reliable on narrow screens. */
  header nav .hg-dd-menu{display:none !important}

  /* Prevent wide desktop grids and side-by-side image/text cards from
     overflowing. The same cards retain their spacing, animation and order. */
  main [style*="grid-template-columns"],
  footer [style*="grid-template-columns"]{
    grid-template-columns:minmax(0,1fr) !important;
    gap:24px !important;
  }
  main [style*="display:flex"][style*="justify-content:space-between"],
  footer [style*="display:flex"][style*="justify-content:space-between"]{
    flex-wrap:wrap;
  }
  main section[style*="padding:"],
  footer [style*="padding:"]{padding-left:20px !important;padding-right:20px !important}
  main [style*="padding:48px"],
  main [style*="padding:56px"],
  main [style*="padding:52px"]{padding:30px 24px !important}

  h1[style]{font-size:clamp(31px,9vw,42px) !important;line-height:1.28 !important}
  h2[style]{font-size:clamp(24px,7vw,32px) !important;line-height:1.4 !important}
  h3[style]{font-size:clamp(19px,5.5vw,24px) !important;line-height:1.45 !important}
  p[style]{word-break:keep-all}

  main img[style*="height:250px"]{height:220px !important}
  main img[style*="height:320px"]{height:240px !important}
  #hg-top{width:48px !important;height:48px !important}
}

@media (max-width: 420px){
  header>div{padding-left:16px !important;padding-right:16px !important}
  main section[style*="padding:"],
  footer [style*="padding:"]{padding-left:16px !important;padding-right:16px !important}
  main [style*="padding:30px"],
  main [style*="padding:32px"],
  main [style*="padding:34px"]{padding:24px 20px !important}
}

/* ---------- site-wide slide menu ---------- */
.hg-menu-toggle{width:44px;height:44px;flex:0 0 44px;border:1px solid #DDE5DF;border-radius:50%;background:#fff;color:#0A2A20;display:grid;place-content:center;gap:4px;cursor:pointer;transition:background .2s ease,transform .2s ease,border-color .2s ease}
.hg-menu-toggle:hover{background:#EEF3EF;border-color:#0E7A55;transform:translateY(-1px)}
.hg-menu-toggle span{display:block;width:19px;height:2px;border-radius:2px;background:currentColor}
.hg-menu-backdrop{position:fixed;inset:0;z-index:100;background:rgba(5,28,20,.48);opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
.hg-menu-drawer{position:fixed;right:0;top:0;z-index:101;width:min(470px,42vw);height:100dvh;overflow-y:auto;background:#F7F8F5;box-shadow:-24px 0 64px rgba(7,35,25,.24);transform:translateX(104%);transition:transform .34s cubic-bezier(.22,.61,.36,1);padding:30px 34px 48px}
.hg-menu-drawer.is-open{transform:translateX(0)}
.hg-menu-backdrop.is-open{opacity:1;visibility:visible}
.hg-menu-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:26px;border-bottom:1px solid #DEE6E0}
.hg-menu-brand{display:flex;align-items:center;gap:10px;color:#15201C;font-size:18px;font-weight:800}
.hg-menu-brand img{width:32px;height:32px;object-fit:contain}
.hg-menu-close{width:40px;height:40px;border:0;border-radius:50%;background:#EAF0EC;color:#0A2A20;font-size:28px;line-height:1;cursor:pointer}
.hg-menu-list{display:grid;gap:8px;padding-top:24px}
.hg-menu-group{padding:13px 0;border-bottom:1px solid #E0E7E2}
.hg-menu-parent{display:block;color:#102D22;font-size:18px;font-weight:750;letter-spacing:-.4px;padding:5px 0}
.hg-menu-children{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;margin-top:12px}
.hg-menu-children a{color:#5B6D63;font-size:14px;line-height:1.45;padding:5px 0}
.hg-menu-group.hg-menu-cta{display:flex;align-items:center;justify-content:center;margin-top:28px;min-height:52px;border:0;border-radius:14px;background:#0E7A55}
.hg-menu-group.hg-menu-cta .hg-menu-parent{width:100%;padding:16px 18px;text-align:center;color:#fff!important;font-size:16px!important;font-weight:800!important}
body.hg-menu-open{overflow:hidden}
@media (max-width:980px){
  header nav.hg-desktop-nav{display:none!important}
  header>div.hg-header-inner{height:70px!important;padding-top:0!important;padding-bottom:0!important;align-items:center!important;flex-wrap:nowrap!important}
  .hg-menu-toggle{margin-left:auto}
}
@media (max-width:760px){
  .hg-menu-drawer{width:100%;padding:24px 22px 40px}
  .hg-menu-children{grid-template-columns:1fr}
  .hg-menu-parent{font-size:19px}
}
