@charset "utf-8";
/* ==========================================================================
   헬스랜드 — 스파 디자인 시스템
   그누보드 기본 테마(default.css / mobile.css) 위에 덮어쓰는 레이어.
   원본 CSS 는 건드리지 않는다(롤백은 이 파일 링크만 빼면 됨).
   ========================================================================== */

:root{
  /* 네이비 + 골드. 변수명은 유지하고 값만 바꿔 전 페이지에 한 번에 반영한다 */
  --hl-cream:#F6F8FB;          /* 페이지 바탕 */
  --hl-cream-2:#EDF1F7;
  --hl-surface:#FFFFFF;
  --hl-forest:#1B2C47;         /* 주색 = 딥 네이비 */
  --hl-forest-2:#27406A;
  --hl-forest-3:#375A8E;
  --hl-sage:#8AA2C4;           /* 보조 = 스틸 블루 */
  --hl-sage-soft:#E6ECF6;
  --hl-sand:#E8E2D4;
  --hl-gold:#B08D4C;
  --hl-gold-soft:#DCC79A;
  --hl-ink:#151E2E;
  --hl-body:#41506A;
  --hl-muted:#77849B;
  --hl-line:#E1E7F0;
  --hl-radius:14px;
  --hl-radius-sm:10px;
  --hl-shadow:0 1px 2px rgba(21,30,46,.05), 0 10px 28px -14px rgba(21,30,46,.18);
  --hl-shadow-lg:0 2px 6px rgba(21,30,46,.07), 0 28px 56px -22px rgba(21,30,46,.30);
  --hl-serif:"Noto Serif KR","Nanum Myeongjo",Georgia,"Apple SD Gothic Neo",serif;
  --hl-sans:"Pretendard","Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",system-ui,sans-serif;
}

/* ── 기본 ───────────────────────────────────────────────── */
html{background:#F3F6FA; overflow-x:clip;}
body{overflow-x:clip; position:relative;}
body{
  background:
    radial-gradient(1250px 640px at 12% -14%, rgba(39,64,106,.085), transparent 62%),
    radial-gradient(980px 520px at 92% 2%, rgba(176,141,76,.075), transparent 58%),
    radial-gradient(700px 700px at 76% 92%, rgba(138,162,196,.10), transparent 60%),
    linear-gradient(180deg,#F8FAFD 0%,#F1F4FA 46%,#EDF1F8 100%) !important;
  background-attachment:fixed !important;
  color:var(--hl-body) !important;
  font-family:var(--hl-sans) !important;
  font-size:16px !important;
  line-height:1.75 !important;
  letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--hl-forest-2); text-decoration:none;}
a:hover,a:focus{color:var(--hl-forest); text-decoration:underline; text-underline-offset:3px;}
h1,h2,h3,h4{font-family:var(--hl-serif); color:var(--hl-ink); letter-spacing:-.02em; font-weight:700;}
img{max-width:100%;}
::selection{background:var(--hl-sage-soft); color:var(--hl-forest);}
body:before{
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}
#hd,#wrapper,#ft{position:relative; z-index:1;}

/* ── 상단 유틸바 ─────────────────────────────────────────── */
#hd{background:transparent !important; border:0 !important;}
#tnb{
  background:#121D31 !important;
  border:0 !important;
  height:auto !important;
  font-size:.8rem;
}
#tnb .inner{
  max-width:1200px; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between; min-height:40px;
}
#tnb:after{display:none !important;}
#hd_define{float:none !important; margin:0 !important;}
#hd_define li{float:none !important; border:0 !important; padding:0 !important;}
#hd_define li a{
  color:rgba(255,255,255,.82) !important; font-size:.78rem; letter-spacing:.01em;
  font-weight:400 !important; background:none !important; padding:0 !important;
}
#hd_define li.active a{color:#fff !important;}
#hd_qnb{float:none !important; margin:0 !important; display:flex; align-items:center; gap:0;}
#hd_qnb li{float:none !important; border:0 !important; padding:0 !important; position:relative;}
#hd_qnb li+li:before{
  content:''; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:1px; height:11px; background:rgba(255,255,255,.22);
}
#hd_qnb li a{
  color:rgba(255,255,255,.82) !important; font-size:.78rem; padding:0 14px !important;
  background:none !important; display:inline-block; line-height:40px;
}
#hd_qnb li a:hover{color:#fff !important; text-decoration:none;}
#hd_qnb .visit{color:var(--hl-gold-soft) !important;}
#hd_qnb .visit-num{
  background:none !important; color:var(--hl-gold-soft) !important;
  border:1px solid rgba(217,199,155,.42); border-radius:999px;
  padding:.15rem .6rem !important; margin-left:.35rem; font-weight:600; font-size:.76rem;
  letter-spacing:.02em;
}

/* ── 로고 / 검색 ─────────────────────────────────────────── */
#hd_wrapper{
  max-width:1200px !important; margin:0 auto !important; padding:34px 24px 30px !important;
  height:auto !important; position:relative;
  display:flex; align-items:center; gap:32px;
}
#hd_wrapper:after{display:none !important;}
#logo{position:static !important; margin:0 !important; padding:0 !important;}
#logo a span:first-child{
  font-family:var(--hl-serif) !important; font-size:1.9rem !important; font-weight:700 !important;
  color:var(--hl-forest) !important; letter-spacing:.06em !important;
}
#logo a span:last-child{
  color:var(--hl-muted) !important; font-size:.72rem !important; letter-spacing:.12em;
  text-transform:uppercase; margin-top:.25rem;
}
.hd_sch_wr{position:static !important; flex:0 1 460px; max-width:460px; margin:0 0 0 auto !important;}
#hd_sch{border:0 !important; background:none !important;}
#hd_sch legend{display:none !important;}
#hd_sch form{position:relative; display:block;}
#sch_stx{
  width:100% !important; height:46px !important; box-sizing:border-box;
  border:1px solid var(--hl-line) !important; background:var(--hl-surface) !important;
  border-radius:999px !important; padding:0 48px 0 20px !important;
  font-size:.88rem !important; color:var(--hl-ink) !important;
  transition:border-color .2s, box-shadow .2s;
}
#sch_stx::placeholder{color:#A9A69D;}
#sch_stx:focus{
  outline:none; border-color:var(--hl-sage) !important;
  box-shadow:0 0 0 4px rgba(143,169,154,.16) !important;
}
#sch_submit{
  position:absolute !important; right:5px !important; top:5px !important;
  width:36px !important; height:36px !important; border:0 !important; border-radius:50% !important;
  background:var(--hl-forest) !important; color:#fff !important; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
#sch_submit:hover{background:var(--hl-forest-2) !important;}
.hd_sch_wr .popular{display:none !important;}

.hd_login{
  position:static !important; margin:0 0 0 auto !important; padding:0 !important;
  display:flex; align-items:center; gap:18px; list-style:none;
}
.hd_login li{float:none !important; border:0 !important; padding:0 !important;}
.hd_login li a{
  font-size:.86rem !important; color:var(--hl-body) !important; font-weight:500 !important;
  background:none !important; padding:0 !important;
}
.hd_login li:last-child a,
.hd_login li a[href^="tel"]{
  color:var(--hl-forest) !important; font-weight:700 !important;
  font-size:1.02rem !important; letter-spacing:.01em; font-family:var(--hl-serif);
}
.hd_login li a:hover{color:var(--hl-forest) !important;}

/* ── 전역 메뉴 ───────────────────────────────────────────── */
#gnb{
  background:linear-gradient(180deg,#22375A 0%,#1A2B47 100%) !important;
  border:0 !important; height:auto !important;
  box-shadow:0 12px 28px -20px rgba(21,30,46,.7) !important;
}
#gnb:after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(220,199,154,.42),transparent);
}
.gnb_wrap{max-width:1200px !important; margin:0 auto !important; padding:0 24px !important; position:relative;}
#gnb_1dul{float:none !important; display:flex; align-items:center; gap:4px; height:auto !important;}
.gnb_1dli{
  float:none !important; background:none !important; border:0 !important; height:auto !important;
}
.gnb_1da{
  display:block !important; padding:17px 18px !important;
  font-size:.95rem !important; font-weight:600 !important; color:rgba(255,255,255,.84) !important;
  letter-spacing:-.005em; position:relative; background:none !important;
}
.gnb_1da:after{
  content:''; position:absolute; left:18px; right:18px; bottom:11px; height:1.5px;
  background:var(--hl-gold-soft); transform:scaleX(0); transform-origin:center;
  transition:transform .28s cubic-bezier(.4,0,.2,1);
}
.gnb_1dli:hover .gnb_1da,.gnb_1da:hover{color:#fff !important; text-decoration:none !important;}
.gnb_1dli:hover .gnb_1da:after{transform:scaleX(1);}
.gnb_1dli .bg{display:none !important;}
/* 드롭다운: 바깥 wrapper 는 투명 브릿지(상위메뉴↔카드 사이 틈을 없애 hover 유지),
   실제 카드는 안쪽 .gnb_2dul_box 에 그린다. 틈이 있으면 mouseleave 로 닫혀 버린다. */
.gnb_2dul{
  background:none !important; border:0 !important; box-shadow:none !important;
  top:100% !important; margin-top:0 !important; padding:12px 0 0 !important; min-width:200px;
}
.gnb_2dul .gnb_2dul_box{
  background:var(--hl-surface) !important; border:1px solid var(--hl-line) !important; border-top:1px solid var(--hl-line) !important;
  border-radius:var(--hl-radius-sm) !important; box-shadow:var(--hl-shadow-lg) !important;
  padding:8px !important; margin:0 !important;
}
.gnb_2dli{background:none !important; border:0 !important;}
.gnb_2da{
  display:block !important; padding:9px 14px !important; border-radius:8px;
  color:var(--hl-body) !important; font-size:.89rem !important; background:none !important;
}
.gnb_2da:hover{background:var(--hl-sage-soft) !important; color:var(--hl-forest) !important; text-decoration:none !important;}
.gnb_mnal{order:99 !important; margin-left:auto !important;}
.gnb_menu_btn{
  background:rgba(255,255,255,.12) !important; color:#fff !important;
  border:1px solid rgba(255,255,255,.18) !important;
  width:44px; height:44px; border-radius:var(--hl-radius-sm); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.gnb_menu_btn:hover{background:var(--hl-gold-soft) !important; color:#1B2C47 !important; border-color:var(--hl-gold-soft) !important;}
#gnb_all{border-radius:var(--hl-radius) !important; box-shadow:var(--hl-shadow-lg) !important;}

/* ── 레이아웃 ────────────────────────────────────────────── */
#wrapper{max-width:1200px !important; margin:0 auto !important; padding:0 24px !important; background:none !important;}
#container_wr{background:none !important; border:0 !important; box-shadow:none !important; max-width:none !important;}
#container{
  background:none !important; border:0 !important; box-shadow:none !important;
  padding:38px 0 60px !important; min-height:auto !important; width:auto !important;
}
#container_title{
  font-family:var(--hl-serif) !important; font-size:1.7rem !important; color:var(--hl-ink) !important;
  border:0 !important; padding:0 0 .6rem !important; margin:0 0 1.4rem !important;
  font-weight:700 !important; letter-spacing:-.02em;
}
#container_title:after{
  content:''; display:block; width:44px; height:2px; background:var(--hl-gold); margin-top:1rem;
}
hr{display:none;}

/* 사이드 */
#aside{
  width:280px !important; padding:38px 0 0 !important; margin-left:32px !important;
  background:none !important;
}
#aside > div{
  border:1px solid var(--hl-line) !important; border-radius:var(--hl-radius) !important;
  background:var(--hl-surface) !important; box-shadow:var(--hl-shadow);
  padding:1.5rem 1.4rem !important; margin-bottom:1rem !important;
}
#aside > div:first-child{
  background:linear-gradient(160deg,var(--hl-forest) 0%,var(--hl-forest-2) 100%) !important;
  border-color:var(--hl-forest) !important;
}
#aside > div:first-child p:first-child{
  color:rgba(255,255,255,.72) !important; font-size:.76rem !important;
  letter-spacing:.12em; text-transform:uppercase; font-weight:600 !important;
}
#aside > div:first-child p:nth-child(2) a{
  color:#fff !important; font-family:var(--hl-serif); font-size:1.45rem !important;
  letter-spacing:.01em;
}
#aside > div:first-child p:last-child{color:rgba(255,255,255,.62) !important;}
#aside > div:last-child p:first-child{
  font-family:var(--hl-serif); color:var(--hl-ink) !important; font-size:1rem !important;
}
#aside ul li a{color:var(--hl-body) !important; font-size:.9rem;}
#aside ul li a:hover{color:var(--hl-forest) !important;}

/* ── 본문 아티클(콘텐츠 페이지) ──────────────────────────── */
.hl-article{
  max-width:44rem !important; margin:0 auto !important;
  font-size:1.04rem !important; line-height:1.9 !important; color:var(--hl-body) !important;
}
.hl-article p{margin:0 0 1.15rem;}
.hl-article h2{
  font-size:1.32rem !important; margin:2.6rem 0 1rem !important;
  padding-bottom:.6rem; border-bottom:1px solid var(--hl-line); position:relative;
}
.hl-article h2:before{
  content:''; position:absolute; left:0; bottom:-1px; width:38px; height:2px; background:var(--hl-gold);
}
.hl-article h3{font-size:1.1rem !important; margin:1.9rem 0 .7rem !important;}
.hl-article ul{margin:0 0 1.3rem; padding-left:0; list-style:none;}
.hl-article ul li{position:relative; padding-left:1.15rem; margin-bottom:.5rem;}
.hl-article ul li:before{
  content:''; position:absolute; left:.1rem; top:.75em;
  width:5px; height:5px; border-radius:50%; background:var(--hl-sage);
}
.hl-article strong,.hl-article b{color:var(--hl-ink); font-weight:700;}
.hl-article a{border-bottom:1px solid var(--hl-gold-soft); text-decoration:none;}
.hl-article a:hover{border-bottom-color:var(--hl-forest); text-decoration:none;}

/* ── 푸터 ────────────────────────────────────────────────── */
#ft{
  background:var(--hl-forest) !important; border:0 !important; margin-top:60px !important;
  color:rgba(255,255,255,.66) !important; padding:0 !important;
}
#ft_wr{
  max-width:1200px !important; margin:0 auto !important; padding:46px 24px 40px !important;
  border:0 !important;
}
#ft_wr:after{display:none !important;}
#ft_link{padding:0 0 1.4rem !important; margin-bottom:1.4rem; border-bottom:1px solid rgba(255,255,255,.12);}
#ft_link a{
  color:rgba(255,255,255,.8) !important; font-size:.86rem; margin-right:1.4rem;
  border:0 !important; padding:0 !important;
}
#ft_link a:hover{color:#fff !important;}
#ft_company h2{
  color:rgba(255,255,255,.5) !important; font-size:.74rem !important;
  letter-spacing:.14em; text-transform:uppercase; margin-bottom:.9rem !important;
  font-family:var(--hl-sans) !important; font-weight:600 !important;
}
#ft .ft_info{color:rgba(255,255,255,.62) !important; font-size:.87rem; line-height:1.95;}
#ft .ft_info a{color:var(--hl-gold-soft) !important;}
#ft .ft_info span{color:rgba(255,255,255,.42) !important;}
#ft_copy{color:rgba(255,255,255,.36) !important; font-size:.8rem; border:0 !important;}
#top_btn{
  background:var(--hl-forest) !important; border:0 !important; color:#fff !important;
  border-radius:50% !important; box-shadow:var(--hl-shadow-lg);
}

/* ── 폼/버튼 공통 ────────────────────────────────────────── */
.btn_submit,.btn_confirm .btn_submit,input[type="submit"].btn_submit{
  background:var(--hl-forest) !important; border:0 !important; border-radius:var(--hl-radius-sm) !important;
  font-family:var(--hl-sans) !important; font-weight:600 !important;
}
.btn_submit:hover{background:var(--hl-forest-2) !important;}
.frm_input,textarea,select{
  border:1px solid var(--hl-line) !important; border-radius:8px !important;
  background:var(--hl-surface) !important;
}
.frm_input:focus,textarea:focus,select:focus{
  border-color:var(--hl-sage) !important; box-shadow:0 0 0 3px rgba(143,169,154,.15) !important; outline:none;
}

/* ── 게시판 톤 정리 ──────────────────────────────────────── */
#bo_list .td_subject a,#bo_v_title{font-family:var(--hl-serif);}
.tbl_head01 thead th{
  background:var(--hl-cream-2) !important; color:var(--hl-forest) !important;
  border-color:var(--hl-line) !important; font-weight:600 !important;
}
.tbl_head01 td{border-color:var(--hl-line) !important;}

/* ── 반응형 ──────────────────────────────────────────────── */
@media (max-width:1024px){
  #hd_wrapper{flex-wrap:wrap; gap:18px; padding:24px 20px !important;}
  .hd_sch_wr{order:3; flex-basis:100%; max-width:none;}
  .hd_login{margin-left:auto !important;}
  #wrapper{padding:0 20px !important;}
  #aside{display:none !important;}
  #container{width:auto !important; float:none !important;}
}
@media (max-width:768px){
  body{font-size:15px !important;}
  #tnb .inner{padding:0 16px; min-height:36px;}
  #hd_define{display:none;}
  #hd_qnb{margin-left:auto;}
  #hd_wrapper{padding:20px 16px !important;}
  #logo a span:first-child{font-size:1.6rem !important;}
  .hd_login li:not(:last-child){display:none;}
  .gnb_wrap{padding:0 16px !important;}
  /* 모바일: 가로 스크롤 메뉴 대신 햄버거 + '메뉴' 라벨만 노출 → 탭하면 전체메뉴 오버레이 */
  #gnb_1dul{display:flex; align-items:center; min-height:52px;}
  .gnb_1dli:not(.gnb_mnal){display:none !important;}
  .gnb_mnal{order:0 !important; margin:0 auto 0 0 !important;}
  .gnb_menu_btn{width:auto !important; min-width:44px; height:42px !important; padding:0 16px !important; gap:.5rem;}
  .gnb_menu_btn:after{content:'전체 메뉴'; font-size:.9rem; font-weight:600; color:#fff; font-family:var(--hl-sans);}
  /* 전체메뉴 오버레이 — 세로 리스트로 정리 */
  #gnb_all{position:fixed !important; top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
           width:100% !important; max-width:none !important; height:100% !important; margin:0 !important;
           border-radius:0 !important; overflow-y:auto !important; z-index:1200 !important; padding:0 !important;}
  #gnb_all h2{font-family:var(--hl-serif) !important; font-size:1.15rem !important; padding:1.3rem 1.2rem !important;
              margin:0 !important; border-bottom:1px solid var(--hl-line) !important; color:var(--hl-ink) !important;}
  #gnb_all .gnb_al_ul{display:block !important; padding:0 !important; margin:0 !important;}
  #gnb_all .gnb_al_li{display:block !important; width:100% !important; float:none !important; border:0 !important;
                      border-bottom:1px solid var(--hl-line) !important; min-height:0 !important; height:auto !important; padding:0 !important;}
  #gnb_all .gnb_al_a{display:block !important; padding:1.05rem 1.2rem !important; font-family:var(--hl-serif) !important;
                     font-size:1.05rem !important; font-weight:600 !important; color:var(--hl-ink) !important;}
  #gnb_all .gnb_al_li ul{padding:0 0 .6rem !important; margin:0 !important; display:flex !important; flex-wrap:wrap !important; gap:.4rem !important; padding-left:1.2rem !important; padding-right:1.2rem !important;}
  #gnb_all .gnb_al_li ul li{border:0 !important; width:auto !important;}
  #gnb_all .gnb_al_li ul li a{display:inline-block !important; padding:.4rem .8rem !important; background:var(--hl-cream-2) !important;
                              border-radius:999px !important; font-size:.85rem !important; color:var(--hl-body) !important;}
  #gnb_all .gnb_close_btn{position:absolute !important; top:1.05rem !important; right:1rem !important; z-index:2 !important;
                          background:none !important; border:0 !important; font-size:1.4rem !important; color:var(--hl-muted) !important;}
  #wrapper{padding:0 16px !important;}
  #container{padding:26px 0 44px !important;}
  #container_title{font-size:1.4rem !important;}
  .hl-article{font-size:1rem !important;}
  #ft_wr{padding:34px 16px 30px !important;}
}


/* ── 모바일 테마 헤더 ────────────────────────────────────── */
#hd .hl-mlogo{display:inline-block; text-decoration:none; line-height:1.15; padding:2px 0;}
.hl-mlogo-ko{
  display:block; font-family:var(--hl-serif); font-size:1.32rem; font-weight:700;
  color:var(--hl-forest); letter-spacing:.05em;
}
.hl-mlogo-en{
  display:block; font-size:.58rem; color:var(--hl-muted);
  letter-spacing:.16em; text-transform:uppercase; margin-top:1px;
}
body #hd_wrapper{background:var(--hl-cream) !important; border-bottom:1px solid var(--hl-line) !important; position:relative;}
/* 그누보드 모바일 테마는 햄버거를 좌상단에 absolute 로 깔아 둔다 → 로고를 그만큼 밀어 겹침을 막는다 */
#hd_wrapper #logo{text-align:left !important; padding:12px 56px 12px 58px !important; height:auto !important;}
#gnb_open{color:var(--hl-forest) !important; z-index:5; top:14px !important; left:12px !important; font-size:1.5em !important;}
#hd_sch_open,#hd_wrapper .hd_opener{color:var(--hl-forest) !important;}
/* 모바일 기본 테마의 파란 계열 UI 를 스파 톤으로 */
#mm_sch_btn,#hd_sch_open,.mbskin_btn,#gnb_open{color:var(--hl-forest) !important;}
#hd_pop,#gnb .gnb_ul{background:var(--hl-surface) !important;}
#tnb_arrow,#hd_define li a{color:rgba(255,255,255,.85) !important;}
#container_title{font-family:var(--hl-serif) !important;}
.ts_wr,#font_resize{display:none !important;}
