/* Joy shared shell, including previews of existing public subpages. */
body.layout-joy .mh-header__inner{max-width:1520px;gap:12px}
body.layout-joy .mh-logo{flex-shrink:0}
body.layout-joy .mh-nav__link{font-size:14px;padding-inline:11px}
body.layout-joy .mh-actions{gap:6px;flex-shrink:0}
body.layout-joy .mh-actions__link{font-size:13px;padding-inline:12px;background:transparent}
body.layout-joy .mh-cta{font-size:14px;padding-inline:20px}
body.layout-joy .mh-nav__link.jy-current{color:var(--jc-d, #007b55);background:var(--jc-s, #eaf9f2)}
body.layout-joy .mh-nav__sublink.jy-current{color:var(--jc-d, #007b55);background:var(--jc-s, #eaf9f2)}
body.layout-joy .mh-nav__group:focus-within .mh-nav__sub{opacity:1;visibility:visible;transform:translate(-50%,0)}
body.layout-joy :is(.jy-btn,.mh-cta,.jy-pill){transition:background .2s,color .2s,border-color .2s}
body.layout-joy .jy-btn:hover{transform:none}
body.layout-joy :is(section[id],.jy-panel[id]){scroll-margin-top:130px}
body.layout-joy .mh-footer__contact{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:12px 40px}
body.layout-joy .mh-footer__cs{grid-column:1;grid-row:1}
body.layout-joy .mh-footer__info{grid-column:1;grid-row:2}
body.layout-joy .mh-footer__hotline{grid-column:2;grid-row:1/3;justify-self:end;min-width:280px}
body.layout-joy .mh-footer__legal{padding-top:24px;border-top:1px solid #edf0ed}
body.layout-joy .jy-top{width:46px;height:46px;border-radius:50%;right:28px;bottom:112px;box-shadow:0 4px 18px #243e2e14;border:1px solid #dfe7e1}
body.layout-joy #rn-overlay{z-index:999}
@media(min-width:1025px) and (max-width:1250px){body.layout-joy .mh-nav__link{font-size:12px;padding-inline:7px}body.layout-joy .mh-logo img{height:25px}body.layout-joy .mh-actions__link{font-size:12px;padding-inline:8px}body.layout-joy .mh-cta{font-size:13px;padding-inline:12px}body.layout-joy .mh-header__inner{gap:6px}}
@media(max-width:1024px){
 body.layout-joy .mh-nav__link{font-size:16px;padding-inline:14px}
 body.layout-joy .mh-nav__group:focus-within .mh-nav__sub{transform:none}
 body.layout-joy .mh-nav__sub{min-width:0}
}
@media(max-width:600px){
 body.layout-joy .mh-logo img{height:25px}
 body.layout-joy .mh-header__inner{gap:8px}
 body.layout-joy .mh-cta{height:38px;font-size:13px;padding-inline:16px}
 body.layout-joy .mh-footer__contact{grid-template-columns:1fr;gap:12px}
 body.layout-joy .mh-footer__hotline{grid-column:1;grid-row:auto;justify-self:start;min-width:0;margin-top:16px}
 body.layout-joy .mh-footer__nav{gap:12px 20px}
 body.layout-joy .mh-footer__nav a{font-size:14px}
 body.layout-joy .mh-footer__info span + span::before{display:none}
 body.layout-joy .jy-top{right:18px;bottom:104px}
}
@media(prefers-reduced-motion:reduce){body.layout-joy .jy-marquee__track{animation:none}}

body.layout-joy a.ragchat__launcher--reserve{background:var(--jc-x, #00543e);color:#fff;border:1px solid var(--jc-x, #00543e);box-shadow:0 6px 20px #00332222}
body.layout-joy a.ragchat__launcher--reserve:hover{background:var(--jc-d2, #00714f);color:#fff}

@media(max-width:720px){body.layout-joy .jy-footer{padding-bottom:calc(112px + env(safe-area-inset-bottom))}body.layout-joy .ragchat{right:16px;bottom:calc(14px + env(safe-area-inset-bottom))}body.layout-joy a.ragchat__launcher--reserve{font-size:13px;padding:11px 16px}body.layout-joy :is(input,textarea,select,button,a){scroll-margin-bottom:100px}}

/* 2026-10-13 고객 요청: 모바일·태블릿 헤더에도 로그인·회원가입(로그인 후 마이페이지)을 상담 신청 바로 왼쪽에.
   PC 와 같은 .mh-actions__link 를 그대로 보여 주므로 링크가 중복되지 않는다. 로그아웃은 햄버거 메뉴에서. */
@media(max-width:1024px){
 body.layout-joy .mh-actions__link{display:inline-flex}
 body.layout-joy .mh-actions__logout{display:none}
 /* 닫힌 메뉴 서랍이 화면 오른쪽 밖에 있으면서 그림자(60px)가 화면 안 오른쪽 끝에 비쳐 햄버거 주변이 어둡게 잘린 듯 보였다 → 닫혀 있을 땐 그림자·표시를 끈다 */
 body.layout-joy .mh-nav{visibility:hidden;box-shadow:none;transition:transform .25s,visibility 0s linear .25s,box-shadow 0s linear .25s}
 body.layout-joy .mh-nav.is-open{visibility:visible;box-shadow:0 20px 60px rgba(0,0,0,.15);transition:transform .25s}
}
@media(max-width:768px){
 body.layout-joy .mh-header__inner{gap:6px}
 body.layout-joy .mh-actions{gap:2px}
 body.layout-joy .mh-actions__link{height:34px;padding:0 7px;border-radius:999px;font-size:13px;font-weight:600;letter-spacing:-.03em;white-space:nowrap;color:var(--ink)}
 body.layout-joy .mh-actions__join{border:1px solid #d6e2da;padding:0 9px;margin-right:2px}
 body.layout-joy .mh-cta{height:34px;font-size:13px;padding-inline:11px;letter-spacing:-.02em;margin-left:2px}
 body.layout-joy .mh-burger{width:34px;padding:0 6px}
 /* 회원(테넌트) 사이트명이 길면 버튼을 밀어내지 않고 말줄임 */
 body.layout-joy .mh-logo{flex-shrink:1;min-width:0;overflow:hidden}
 body.layout-joy .mh-logo__text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 body.layout-joy .mh-logo img{max-width:100%;object-fit:contain;object-position:left center}
 body.layout-joy .mh-actions{flex-shrink:0}
}
/* 로고 글자 크기는 colors.css(헤더에서 common.css 뒤에 로드)가 정하므로 html 을 붙여 우선순위를 높인다 */
@media(max-width:400px){
 html body.layout-joy .mh-logo--brand{gap:5px}
 html body.layout-joy .mh-logo__mark{width:26px;height:22px}
 html body.layout-joy .mh-logo__name{font-size:16px}
 html body.layout-joy .mh-logo img{height:22px}
 html body.layout-joy .mh-logo__text{font-size:16px}
}
@media(max-width:370px){
 html body.layout-joy .mh-header__inner{gap:4px}
 html body.layout-joy .mh-logo--brand{gap:4px}
 html body.layout-joy .mh-logo__mark{width:24px;height:20px}
 html body.layout-joy .mh-logo__name{font-size:15px}
 html body.layout-joy .mh-logo__text{font-size:15px}
 html body.layout-joy .mh-actions__link{padding:0 5px}
 html body.layout-joy .mh-actions__join{padding:0 7px}
 html body.layout-joy .mh-cta{padding-inline:9px}
 html body.layout-joy .mh-burger{width:32px;padding:0 5px}
}

/* 2026-10-13(18:50) 고객 요청: 휴대폰에서 로고 '지피알상조그룹'이 '지피알상조그'로 잘림 → 로고는 절대 줄이지 않고 버튼 묶음이 먼저 줄거나 두 줄로 접힌다.
   - 본사 로고(.mh-logo--brand)는 flex:0 0 auto(줄지 않음·잘리지 않음). 회원 사이트 텍스트 로고는 기존처럼 말줄임 유지.
   - 430px 이하: 로그인 + 회원가입 → '로그인/가입' 버튼 하나(/login_user.php?tab=login, 화면 안에 로그인·가입 탭). 로그인 후엔 마이페이지.
   - 공간이 더 모자라면(글자 크게 설정 등) 버튼 글자가 두 줄로 접히고, 가로로 넘치지 않는다. */
body.layout-joy .mh-actions .mh-actions__auth{display:none}
@media(max-width:1024px){
 html body.layout-joy .mh-logo--brand{flex:0 0 auto;min-width:auto;overflow:visible}
 html body.layout-joy .mh-logo--brand .mh-logo__name{white-space:nowrap;overflow:visible}
 body.layout-joy .mh-header__inner{min-width:0}
}
@media(max-width:430px){
 body.layout-joy .mh-actions .mh-actions__login,
 body.layout-joy .mh-actions .mh-actions__join{display:none}
 body.layout-joy .mh-actions .mh-actions__auth{display:inline-flex}
 body.layout-joy .mh-actions{flex:0 1 auto;min-width:0;margin-left:auto;gap:3px}
 body.layout-joy .mh-actions :is(.mh-actions__link,.mh-cta){flex:0 1 auto;min-width:0;height:auto;min-height:34px;padding-block:2px;white-space:normal;word-break:keep-all;overflow-wrap:normal;line-height:1.15;text-align:center;justify-content:center}
 body.layout-joy .mh-actions .mh-actions__auth{border:1px solid #d6e2da;padding-inline:8px;margin-right:0}
 body.layout-joy .mh-actions .mh-actions__mypage{padding-inline:6px}
 body.layout-joy .mh-actions .mh-cta{margin-left:0}
 body.layout-joy .mh-burger{flex:0 0 auto}
}
@media(max-width:370px){
 html body.layout-joy .mh-actions{gap:2px}
 html body.layout-joy .mh-actions :is(.mh-actions__link,.mh-cta){font-size:12px;letter-spacing:-.04em}
 html body.layout-joy .mh-actions .mh-actions__auth{padding-inline:6px}
 html body.layout-joy .mh-actions .mh-cta{padding-inline:8px}
 html body.layout-joy .mh-burger{width:30px;padding:0 4px}
}

/* 2026-10-13 관리자 접속 링크 — 눈에 띄지 않게 작게 */
body.layout-joy .mh-nav__admin{display:block;margin-top:14px;padding:6px 14px;font-size:12px;color:var(--ink-400,#9aa29d);text-decoration:none;opacity:.8}
body.layout-joy .mh-footer__admin{font-size:11px;color:inherit;opacity:.55;text-decoration:none}
body.layout-joy .mh-footer__admin:hover{opacity:.9;text-decoration:underline}