
:root{
  --green:#183a2a;--green2:#28563f;--green3:#64856e;
  --cream:#f4f1e9;--paper:#fbfaf7;--white:#fff;
  --text:#20241f;--muted:#717771;--line:#e4e7e2;
  --title:'Nanum Myeongjo',serif;--body:'Noto Sans KR',sans-serif;
  --max:1240px;--pad:clamp(16px,3vw,40px)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--text);font-family:var(--body);letter-spacing:-.015em}
a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}
.container{width:min(var(--max),calc(100% - var(--pad)*2));margin:0 auto}
.header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.header-top{height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--green3);font-family:var(--title);color:var(--green)}
.brand-name{font-family:var(--title);font-size:19px;font-weight:700;color:var(--green)}
.brand-eng{display:block;margin-top:2px;font-size:9px;letter-spacing:.12em;color:var(--green3)}
.header-actions{display:flex;gap:8px}.header-btn{min-height:40px;padding:0 15px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:13px;font-weight:600}.header-btn.primary{background:var(--green);border-color:var(--green);color:#fff}
.nav{height:50px;display:flex;align-items:center;gap:clamp(4px,1vw,16px);overflow-x:auto;scrollbar-width:none;border-top:1px solid var(--line)}
.nav::-webkit-scrollbar{display:none}.nav a{flex:0 0 auto;padding:15px 7px;font-size:13px;color:#747c75}.nav a.active{color:var(--green);font-weight:700}
.page-head{padding:66px 0 42px;background:var(--paper);border-bottom:1px solid var(--line)}
.eyebrow{font-size:11px;letter-spacing:.13em;color:var(--green3);font-weight:700}
.page-head h1{margin:12px 0 10px;font-family:var(--title);font-size:clamp(36px,5vw,62px);line-height:1.25;letter-spacing:-.045em;color:var(--green)}
.page-head p{margin:0;font-size:14px;line-height:1.85;color:var(--muted)}
.featured{padding:66px 0 78px}.featured-meta{display:flex;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:2px solid var(--green)}.featured-label{font-size:12px;font-weight:700;color:var(--green)}.featured-status{font-size:11px;color:var(--green3)}
.featured-article{max-width:900px;margin:48px auto 0}.featured-article h2{margin:0 0 24px;font-family:var(--title);font-size:clamp(28px,3.5vw,44px);line-height:1.45;letter-spacing:-.035em;color:#14271c}.featured-article .lead{margin:0 0 32px;font-size:18px;line-height:1.95;color:#4f5750;font-weight:500}.featured-image{width:100%;aspect-ratio:16/8;margin:32px 0;display:grid;place-items:center;background:linear-gradient(145deg,#e4ece6,#cbd9cf);color:#61796a;font-size:12px;border-radius:10px;overflow:hidden}.featured-image img{width:100%;height:100%;object-fit:cover}.article-body{font-size:15px;line-height:2.05;color:#555c56}.article-body p{margin:0 0 22px}.article-body h3{margin:40px 0 14px;font-family:var(--title);font-size:23px;color:var(--green)}
.blog-section{padding:70px 0 88px;background:var(--paper)}.blog-top{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-bottom:20px;border-bottom:2px solid #394d40}.blog-top h2{margin:0;font-family:var(--title);font-size:32px;color:var(--green)}.blog-top p{margin:6px 0 0;font-size:12px;color:var(--muted)}
.blog-item{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:40px;align-items:center;min-height:250px;padding:20px 0;border-bottom:1px solid var(--line)}.blog-category{display:inline-block;margin-bottom:14px;padding:6px 9px;border-radius:999px;background:#e8efe9;color:var(--green2);font-size:10px;font-weight:700}.blog-item h3{margin:0;font-size:clamp(20px,2vw,28px);line-height:1.5;letter-spacing:-.03em;color:#17231b}.blog-summary{max-width:760px;margin:14px 0 0;font-size:13px;line-height:1.8;color:var(--muted)}.blog-thumb{width:250px;aspect-ratio:1/1;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#e7ece8,#d1ddd4);color:#657a6c;font-size:11px}.blog-thumb img{width:100%;height:100%;object-fit:cover}
.cta{padding:68px 0;background:var(--green)}.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px}.cta h2{margin:0;font-family:var(--title);font-size:30px;color:#fff}.cta p{margin:8px 0 0;color:rgba(255,255,255,.65);font-size:13px}.cta a{padding:14px 20px;border-radius:8px;background:#fff;color:var(--green);font-weight:700;font-size:13px}
footer{padding:36px 0;background:#132018;color:rgba(255,255,255,.55);font-size:11px;line-height:1.8}
.hidden-page{padding:120px 20px;text-align:center}.hidden-page h1{font-family:var(--title);color:var(--green)}

.admin-wrap{max-width:1180px;margin:0 auto;padding:30px 20px 70px}.admin-title{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:22px}.admin-title h1{margin:0;color:var(--green);font-size:24px}.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:16px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field label{display:block;font-size:11px;color:var(--muted);margin-bottom:6px}.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px;background:#fff}.field textarea{min-height:100px;resize:vertical}.wide{grid-column:1/-1}.admin-btn{border:0;border-radius:8px;padding:10px 14px;font-weight:700;cursor:pointer}.admin-btn.primary{background:var(--green);color:#fff}.admin-btn.ghost{background:#fff;border:1px solid var(--line);color:var(--green)}.page-row{display:grid;grid-template-columns:55px 1fr 160px 110px 180px;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.page-row input[type=number]{width:55px}.badge{display:inline-block;padding:5px 8px;border-radius:999px;font-size:10px;background:#e8efe9;color:var(--green2)}.badge.off{background:#f0f0ef;color:#777}.actions{display:flex;gap:6px;justify-content:flex-end}
.notice{font-size:12px;color:var(--muted);line-height:1.7}

@media(max-width:900px){
  .blog-item{grid-template-columns:1fr 190px;gap:24px}.blog-thumb{width:190px}
  .page-row{grid-template-columns:45px 1fr 110px 90px}.page-row .actions{grid-column:1/-1;justify-content:flex-start}
}
@media(max-width:640px){
  :root{--pad:14px}.header-top{height:64px}.brand-eng{display:none}.header-actions .header-btn:first-child{display:none}.nav{height:46px}.page-head{padding:44px 0 32px}.featured{padding:46px 0 58px}.featured-article{margin-top:32px}.featured-article .lead{font-size:16px}.article-body{font-size:14px;line-height:1.95}.blog-section{padding:54px 0 72px}.blog-top{align-items:flex-start;flex-direction:column}.blog-item{grid-template-columns:1fr;gap:14px;padding:28px 0}.blog-thumb{width:100%;aspect-ratio:16/9;order:-1}.cta-inner{align-items:flex-start;flex-direction:column}.form-grid{grid-template-columns:1fr}.wide{grid-column:auto}.page-row{grid-template-columns:42px 1fr}.page-row>*:nth-child(n+3){grid-column:2}.page-row .actions{grid-column:1/-1}
}

.cms-loading{padding:100px 20px;text-align:center;color:#788178}.cms-error{padding:100px 20px;text-align:center;color:#7a4b4b}

.cms-imported-body img{
  display:block;
  max-width:100%;
  height:auto;
  margin:24px auto;
  border-radius:8px;
}
.cms-imported-body p{
  margin:0 0 20px;
}
.cms-imported-body div{
  max-width:100%;
}
.cms-imported-body figure{
  margin:26px 0;
}
.cms-imported-body blockquote{
  margin:28px 0;
  padding:18px 22px;
  border-left:3px solid #64856e;
  background:#f4f1e9;
}

/* v3.6.5 imported/article readability */
.article-body,
.cms-imported-body{
  font-size:18px;
  line-height:2.0;
  color:#39443d;
  letter-spacing:-0.015em;
}
.article-body p,
.cms-imported-body p{
  margin:0 0 1.25em;
}
.article-body h2,
.cms-imported-body h2{
  font-size:1.55em;
  line-height:1.55;
  margin:2.2em 0 .8em;
  color:#183a2a;
}
.article-body h3,
.cms-imported-body h3{
  font-size:1.3em;
  line-height:1.55;
  margin:1.8em 0 .7em;
  color:#20382b;
}
.article-body strong,
.cms-imported-body strong{
  font-weight:700;
}
@media(max-width:700px){
  .article-body,
  .cms-imported-body{
    font-size:16.5px;
    line-height:1.95;
  }
}

/* v3.10 responsive image focal position */
[data-jsh-positioned="1"]{
  background-position:var(--jsh-desktop-position,50% 50%) !important;
  object-position:var(--jsh-desktop-position,50% 50%) !important;
}
@media(max-width:700px){
  [data-jsh-positioned="1"]{
    background-position:var(--jsh-mobile-position,50% 50%) !important;
    object-position:var(--jsh-mobile-position,50% 50%) !important;
  }
}

/* v3.10.4 responsive detail/article content */
#detailRoot,
#articleRoot{
  overflow-x:hidden;
}

#detailRoot .detail-shell,
#articleRoot .article-shell,
#detailRoot .featured-article,
#articleRoot .featured-article{
  width:min(100%, 980px);
  margin-left:auto;
  margin-right:auto;
}

#detailRoot img,
#articleRoot img,
.article-body img,
.cms-imported-body img,
.featured-article img{
  display:block;
  max-width:100%;
  width:auto;
  height:auto;
  margin:24px auto;
  object-fit:contain;
  border-radius:10px;
}

#detailRoot figure,
#articleRoot figure,
.article-body figure,
.cms-imported-body figure{
  max-width:100%;
  margin:28px auto;
}

#detailRoot iframe,
#articleRoot iframe,
#detailRoot video,
#articleRoot video{
  max-width:100%;
}

#detailRoot table,
#articleRoot table{
  display:block;
  width:100%;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

@media(max-width:700px){
  #detailRoot,
  #articleRoot{
    padding-left:16px;
    padding-right:16px;
  }

  #detailRoot .detail-shell,
  #articleRoot .article-shell,
  #detailRoot .featured-article,
  #articleRoot .featured-article{
    width:100%;
  }

  #detailRoot img,
  #articleRoot img,
  .article-body img,
  .cms-imported-body img,
  .featured-article img{
    max-width:92vw;
    max-height:68vh;
    width:auto !important;
    height:auto !important;
    margin:18px auto !important;
    object-fit:contain !important;
    border-radius:8px;
  }

  #detailRoot .hero-image,
  #articleRoot .hero-image,
  #detailRoot .cover-image,
  #articleRoot .cover-image{
    max-width:100%;
    max-height:52vh;
  }

  #detailRoot .article-body,
  #articleRoot .article-body,
  .cms-imported-body{
    font-size:16.5px;
    line-height:1.9;
    word-break:keep-all;
    overflow-wrap:anywhere;
  }

  #detailRoot h1,
  #articleRoot h1{
    font-size:clamp(27px,8vw,38px);
    line-height:1.35;
  }

  #detailRoot h2,
  #articleRoot h2{
    font-size:clamp(22px,6vw,30px);
    line-height:1.45;
  }

  #detailRoot h3,
  #articleRoot h3{
    font-size:clamp(19px,5.2vw,25px);
    line-height:1.5;
  }
}

.jsh-brand-logo{
  display:block;
  width:auto;
  height:42px;
  max-width:220px;
  object-fit:contain;
}
@media(max-width:700px){
  .jsh-brand-logo{
    height:34px;
    max-width:170px;
  }
}

/* v3.11.1 strict header logo sizing */
.header .brand{
  min-width:0;
  max-width:280px;
  overflow:hidden;
  flex:0 1 auto;
}
.header .brand .jsh-brand-logo{
  display:block !important;
  width:auto !important;
  height:var(--jsh-logo-desktop-height,42px) !important;
  max-width:240px !important;
  max-height:80px !important;
  object-fit:contain !important;
  flex:0 0 auto;
}
.header .brand .jsh-brand-text-hidden{
  display:none !important;
}
@media(max-width:700px){
  .header .brand{
    max-width:200px;
  }
  .header .brand .jsh-brand-logo{
    height:var(--jsh-logo-mobile-height,34px) !important;
    max-width:170px !important;
    max-height:64px !important;
  }
}

/* v3.11.3 대표글 중복 제거 */
.featured-article-clean > h2{
  margin-bottom:30px;
}
.featured-article-clean .article-body > :first-child{
  margin-top:0;
}
@media(max-width:700px){
  .featured-article-clean > h2{
    margin-bottom:20px;
  }
}


/* v3.11.4 PC 메인페이지 글/이미지 비율 균형 조정 */
@media(min-width:901px){
  /* 메인 히어로: 텍스트가 과도하게 작거나 이미지가 과도하게 커 보이지 않도록 */
  #hero .hero-copy{
    width:min(47%,620px);
    max-width:620px;
  }
  #hero .hero-copy h1{
    font-size:clamp(44px,4.2vw,66px);
    line-height:1.18;
    max-width:11.5em;
  }
  #hero .hero-copy p{
    font-size:16px;
    line-height:1.85;
    max-width:620px;
  }

  /* 주요 진료 카드: 이미지 높이를 줄이고 텍스트 비중 확대 */
  #clinics .clinic-grid{
    gap:22px;
  }
  #clinics .clinic-card{
    min-height:0;
  }
  #clinics .clinic-image{
    aspect-ratio:16/10;
    min-height:0;
  }
  #clinics .clinic-copy{
    padding:22px 22px 24px;
  }
  #clinics .clinic-copy h3{
    font-size:23px;
    line-height:1.4;
  }
  #clinics .clinic-copy p{
    font-size:14px;
    line-height:1.8;
  }

  /* 의료진 소개: 사진과 글을 거의 1:1 비율로 */
  #doctor .doctor-layout{
    grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
    gap:clamp(44px,5vw,78px);
    align-items:center;
  }
  #doctor .doctor-photo{
    width:100%;
    max-width:560px;
    margin:0 auto;
    aspect-ratio:4/3;
  }
  #doctor .doctor-copy{
    max-width:560px;
  }
  #doctor .doctor-copy h2{
    font-size:clamp(34px,3.3vw,48px);
  }
  #doctor .doctor-copy p{
    font-size:16px;
    line-height:1.9;
  }

  /* 건강정보: 썸네일 크기보다 제목/요약이 더 잘 읽히도록 */
  #health .post-card,
  [data-section="health-content"] .post-card{
    grid-template-columns:210px minmax(0,1fr);
    gap:24px;
    align-items:center;
  }
  #health .post-card img,
  [data-section="health-content"] .post-card img{
    width:210px;
    height:138px;
    object-fit:cover;
    border-radius:10px;
  }
  #health .post-card h3,
  [data-section="health-content"] .post-card h3{
    font-size:21px;
    line-height:1.45;
  }
  #health .post-card p,
  [data-section="health-content"] .post-card p{
    font-size:14px;
    line-height:1.75;
  }

  /* 섹션 헤딩 자체도 PC에서는 조금 더 존재감 있게 */
  .section-title{
    font-size:clamp(36px,3.4vw,48px);
  }
  .section-desc{
    font-size:15px;
    line-height:1.85;
  }
}

/* 넓은 모니터에서 이미지가 과도하게 커지는 현상 제한 */
@media(min-width:1280px){
  #hero{
    min-height:690px;
  }
  #hero .hero-slide{
    min-height:690px;
  }
  #clinics .clinic-image{
    max-height:320px;
  }
}

/* v3.11.6 상세페이지 모든 글을 대표글과 동일한 본문 형식으로 */
.unified-detail-posts{
  padding-top:24px;
}
.unified-detail-posts .blog-top{
  margin-bottom:34px;
}
.unified-post-list{
  display:flex;
  flex-direction:column;
  gap:0;
}
.unified-post{
  width:min(100%,980px);
  margin:0 auto;
  padding:54px 0 64px;
  border-top:1px solid var(--line,#e4e7e2);
}
.unified-post:first-child{
  border-top:0;
  padding-top:18px;
}
.unified-post-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  color:#718078;
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
}
.unified-post > h2{
  margin:0 0 30px;
  font-family:var(--title,'Nanum Myeongjo',serif);
  font-size:clamp(30px,3vw,42px);
  line-height:1.42;
  color:var(--green,#183a2a);
  letter-spacing:-.035em;
}
.unified-post .article-body{
  font-size:18px;
  line-height:1.95;
}
.unified-post .article-body img{
  max-width:100%;
  width:auto;
  height:auto;
  margin:24px auto;
  object-fit:contain;
}
@media(max-width:700px){
  .unified-detail-posts .blog-top{
    margin-bottom:20px;
  }
  .unified-post{
    padding:34px 0 44px;
  }
  .unified-post:first-child{
    padding-top:8px;
  }
  .unified-post > h2{
    margin-bottom:20px;
    font-size:clamp(25px,7vw,32px);
    line-height:1.45;
  }
  .unified-post .article-body{
    font-size:16.5px;
    line-height:1.9;
  }
}

/* v3.12.1 static bundled header logo — no Supabase swap/flash */
.header .brand{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  overflow:visible;
  max-width:none;
}
.header .static-brand-logo{
  display:block;
  width:auto;
  height:42px;
  max-width:280px;
  object-fit:contain;
}
@media(max-width:700px){
  .header .static-brand-logo{
    height:34px;
    max-width:220px;
  }
}

/* v3.12.3 AI vector brand asset */
.header .brand{
  display:flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  width:auto !important;
  max-width:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.header .brand-picture{
  display:block !important;
  line-height:0 !important;
  background:transparent !important;
}
.header .static-brand-logo{
  display:block !important;
  width:auto !important;
  height:44px !important;
  max-width:310px !important;
  max-height:58px !important;
  object-fit:contain !important;
  object-position:left center !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  filter:none !important;
}
@media(max-width:700px){
  .header .static-brand-logo{
    height:36px !important;
    max-width:235px !important;
    max-height:46px !important;
  }
}

/* v3.12.4 clinic-card brand-image safety */
#clinics .clinic-image{
  background-color:#d7e2da;
}
#clinics .clinic-image[style*="background-image: none"],
#clinics .clinic-image[style*="background-image:none"]{
  background-image:linear-gradient(145deg,#e5ede7,#cbd9cf) !important;
}
