/* 오산헤리티지자이 — 원본 자이 CSS 위에 더한 것만. 원본 CSS 는 고치지 않습니다.
   색은 원본에서 가져옴: 남색 #283444 · 파랑 #006899 · 베이지 #decbad */
:root { --osx-navy: #283444; --osx-blue: #006899; --osx-beige: #decbad; }

/* 떠 있는 버튼 — 전화 · 문자 · 관심고객등록 (카카오톡 없음) */
.osx-dock { position: fixed; right: 20px; bottom: 90px; z-index: 900; display: flex; flex-direction: column; gap: 6px; }
.osx-dock__b { display: flex; flex-direction: column; justify-content: center; width: 132px; min-height: 58px; padding: 8px 12px;
  background: var(--osx-navy); color: #fff !important; text-decoration: none; border-radius: 4px; box-shadow: 0 6px 18px rgba(0,0,0,.18);
  font-family: 'notokr-regular', sans-serif; line-height: 1.35; transition: transform .2s, background .2s; }
.osx-dock__b:hover { transform: translateX(-4px); }
.osx-dock__b b { font-family: 'notokr-medium', sans-serif; font-weight: normal; font-size: 15px; }
.osx-dock__b span { font-size: 13px; opacity: .85; }
.osx-dock__b--sms { background: var(--osx-blue); }
.osx-dock__b--reg { background: #fff; color: var(--osx-navy) !important; border: 1px solid var(--osx-navy); }
@media (max-width: 1024px) {
  .osx-dock { left: 0; right: 0; bottom: 0; flex-direction: row; gap: 0; }
  .osx-dock__b { flex: 1; width: auto; min-height: 56px; border-radius: 0; align-items: center; text-align: center; box-shadow: none; }
  .osx-dock__b:hover { transform: none; }
  .osx-dock__b b { font-size: 14px; }
  .osx-dock__b span { font-size: 11px; }
  .osx-dock__b--reg { border: 0; border-top: 1px solid var(--osx-navy); }
  body { padding-bottom: 56px; }
  .btn_top { bottom: 70px !important; }
}

/* 그림만 있던 서브 페이지 위의 짧은 글 (검색용) */
.osx-intro { max-width: 1100px; margin: 0 auto 2.5rem; text-align: center; }
.osx-intro__t { font-family: 'notokr-medium', sans-serif; font-size: 1.25rem; color: var(--osx-navy); margin-bottom: .6rem; }
.osx-intro__p { font-size: 1rem; line-height: 1.75; color: #555; word-break: keep-all; }
.osx-intro__p a { color: var(--osx-blue); }

/* 새 페이지 */
.osx-page { max-width: 1100px; margin: 0 auto; }
.osx-h3 { font-family: 'notokr-medium', sans-serif; font-size: 1.3rem; color: var(--osx-navy); margin: 2.5rem 0 1rem; padding-left: 12px; border-left: 4px solid var(--osx-blue); }
.osx-tbl { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.osx-t { width: 100%; min-width: 0; border-collapse: collapse; border-top: 2px solid var(--osx-navy); }
.osx-t caption { caption-side: bottom; position: static; width: auto; height: auto; visibility: visible; font-size: .85rem; line-height: 1.6; color: #666; text-align: left; padding-top: .6rem; }
.osx-t th, .osx-t td { padding: .9rem .8rem; border-bottom: 1px solid #ddd; font-size: .95rem; line-height: 1.5; text-align: center; word-break: keep-all; }
.osx-t thead th { background: #f4f4f4; font-family: 'notokr-medium', sans-serif; color: #333; }
.osx-t tbody th { background: #fafafa; font-family: 'notokr-medium', sans-serif; color: var(--osx-navy); white-space: nowrap; }
.osx-t td { color: #444; }
.osx-note { margin-top: 1rem; font-size: .9rem; line-height: 1.7; color: #666; }
.osx-link { display: inline-block; margin-left: .5rem; color: var(--osx-blue) !important; text-decoration: underline; }
.osx-cta { margin: 2.5rem 0 1rem; text-align: center; }
.osx-btn { display: inline-block; min-width: 200px; margin: 4px; padding: 14px 24px; font-family: 'notokr-medium', sans-serif; font-size: 1rem; text-align: center; text-decoration: none; border: 1px solid var(--osx-navy); border-radius: 2px; }
.osx-btn--fill { background: var(--osx-navy); color: #fff !important; }
.osx-btn--line { background: #fff; color: var(--osx-navy) !important; }
.osx-faq__it { border-bottom: 1px solid #ddd; }
.osx-faq__it summary { cursor: pointer; padding: 1rem .5rem; font-family: 'notokr-medium', sans-serif; color: #333; }
.osx-faq__it p { padding: 0 .5rem 1.2rem; line-height: 1.75; color: #555; }

/* 관심고객등록 */
.osx-form { max-width: 760px; margin: 0 auto; }
.osx-form__row { display: flex; gap: 16px; }
.osx-form__row > * { flex: 1; }
.osx-field { margin-bottom: 16px; }
.osx-field label { display: block; margin-bottom: 6px; font-family: 'notokr-medium', sans-serif; color: #333; }
.osx-field em { color: #c0392b; font-style: normal; }
.osx-field input, .osx-field select, .osx-field textarea { width: 100%; box-sizing: border-box; padding: 12px; border: 1px solid #bbb; font-size: 1rem; background: #fff; }
.osx-agree { margin: 8px 0 20px; padding: 16px; background: #f6f6f6; font-size: .9rem; line-height: 1.7; color: #555; }
.osx-agree a { color: var(--osx-blue); }
.osx-check { display: block; margin-top: 8px; color: #333; }
.osx-form .osx-btn { width: 100%; cursor: pointer; }
.osx-form__msg { min-height: 1.5em; margin-top: 12px; text-align: center; }
.osx-form__msg.is-ok { color: var(--osx-blue); }
.osx-form__msg.is-bad { color: #c0392b; }
@media (max-width: 640px) { .osx-form__row { display: block; } }

/* 소식 */
.osx-news { border-top: 2px solid var(--osx-navy); }
.osx-news__it a { display: block; padding: 1.3rem .5rem; border-bottom: 1px solid #ddd; text-decoration: none; }
.osx-news__it time { display: block; font-size: .85rem; color: #888; }
.osx-news__it b { display: block; margin: .3rem 0; font-family: 'notokr-medium', sans-serif; font-weight: normal; font-size: 1.1rem; color: var(--osx-navy); }
.osx-news__it span { color: #666; line-height: 1.6; }
.osx-post { max-width: 860px; margin: 0 auto; }
.osx-post__date { color: #888; font-size: .9rem; }
.osx-post__t { font-family: 'notokr-medium', sans-serif; font-size: 1.6rem; line-height: 1.4; color: var(--osx-navy); margin: .5rem 0 1.5rem; word-break: keep-all; }
.osx-post__body p { margin-bottom: 1rem; line-height: 1.85; color: #444; word-break: keep-all; }
.osx-post__body h3 { margin: 1.8rem 0 .7rem; font-family: 'notokr-medium', sans-serif; font-size: 1.15rem; color: var(--osx-navy); }
.osx-post__note { margin-top: 2rem; font-size: .85rem; color: #777; }
.osx-post__nav { margin-top: 2rem; text-align: center; }
.osx-privacy { max-width: 860px; margin: 0 auto; }

/* 푸터 — 광고원 표시 (흐린 잔글씨, 대비 4.5 이상) */
.osx-made a { color: #b9bec6 !important; font-size: 12px; text-decoration: none; }
#footer .footer_bottom .info a { color: inherit; }

/* ═══ 밝게 (2026-10-21 사장님 「전체를 밝게, 흰 바탕으로」) ═══
   원본 구도·움직임은 그대로 두고, 어두운 바탕만 흰색·아주 연한 색으로 바꿉니다. 글씨 대비는 4.5 이상. */
/* 머리글 */
.header_cms, body[data-page="main"] .header_cms.open,
body[data-device="tablet"] .header_cms.mopen, body[data-device="mobile"] .header_cms.mopen { background: #fff !important; border-bottom: 1px solid #e3e3e3; }
body[data-page="main"] .header_cms { background: rgba(255,255,255,.92) !important; }
.header_cms .header_top h2 a, .header_cms #gnb .depth1>li>a, .header_cms .header_bottom .tel a,
.header_cms .header_bottom .btn_reg.gnb_b_view a { color: #222 !important; }
.header_cms #gnb .depth1>li.on>a, .header_cms #gnb .depth1>li>a:focus, .header_cms #gnb .depth1>li:hover>a { background: #006899; color: #fff !important; }
.header_cms #gnb .depth2 { background: rgba(255,255,255,.96); border-bottom: 1px solid #e3e3e3; }
.header_cms #gnb .depth2>li>a, .header_cms #gnb .depth2>li>a.on { color: #333; }
.header_cms #gnb .depth2>li>a.on::before { background: #006899; }
.header_cms .header_bottom .tel a strong { color: #006899; }
.header_cms .header_bottom .tel, .header_cms .header_bottom .btn_reg.gnb_b_view { border-left-color: #e3e3e3; }
.header_cms .header_top .btn_mgnb button i { background: #283444 !important; }
#mgnb { background: #fff; }
#mgnb .depth1>li>a, #mgnb .depth1>li>a>span::after { color: #222; border-bottom-color: #e3e3e3; }
#mgnb .depth2 { background: #f4f6f8; }
#mgnb .depth2>li>a { color: #444; }
#mgnb .depth2>li>a::before { background: #999; }
/* 첫 화면 */
body[data-page="main"] #container { background: #f7f7f5; }
.main_quick, .main_quick ul li i { background: #f3f3f1; }
.main_quick ul li button, .main_quick ul li a { background: #f3f3f1; color: #333; }
.main_banner ul li:first-child { background: #f3f0ea; }
.main_banner ul li:first-child p { color: #5a4526; }
.mobile_area .open_area ul li:nth-child(1) { background: #eaf6f4; color: #0b6458; }
.mobile_area .open_area ul li:nth-child(2) { background: #fff2ea; color: #9a3f12; }
.mobile_area .open_area ul li a { color: inherit; }
.mobile_area .video_area { background: #eaf3f8; }
.mobile_area .location_area { background: #e9eef4; }
.mobile_area .tb_box dl, .mobile_area .tb_box dl a { color: #1d3c55; }
/* 푸터 */
#footer { background: #f4f4f4; border-top: 1px solid #e3e3e3; }
.footer_top { border-bottom-color: #e3e3e3; }
.footer_top .construction_area li, .footer_top .link_area li a { color: #333; }
.footer_top .link_area li a font { color: #006899; font-weight: bold; }
.footer_top .construction_area li dl dt::before, .footer_top .link_area li::before { color: #aaa; }
.footer_top .btn_footer { background: #e6e6e6; }
.footer_top .btn_footer::after { color: #333; }
.footer_bottom .info li, .footer_bottom p { color: #555; }
.footer_bottom .info li dl dd a { color: #006899; }
.osx-made a { color: #6b7076 !important; }
.mobile_area .tb_box dl dd, .mobile_area .tb_box dl dd a, .mobile_area .tb_box dl dd.more a { color: #1d3c55 !important; border-color: #1d3c55 !important; }
.footer_top .link_area li a { background: #fff !important; border: 1px solid #ddd; color: #333 !important; }

/* ═══ 첫 화면 아래 요약 섹션 (2026-10-21 「메인이 첫 화면만 보이고 끝난다」) ═══ */
body[data-page="main"] { overflow-y: auto !important; }
.osx-main { position: relative; z-index: 1; background: #fff; color: #333; }
.osx-sec { padding: 110px 0; }
.osx-sec:nth-child(even) { background: #f7f7f5; }
.osx-sec__in { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.osx-eng { font-family: 'notokr-medium', sans-serif; font-size: .9rem; letter-spacing: .25em; color: #006899; margin-bottom: .6rem; }
.osx-sec__t { font-family: 'notokr-medium', sans-serif; font-size: 2.1rem; line-height: 1.35; color: #222; margin-bottom: 1rem; word-break: keep-all; }
.osx-sec__lead { font-size: 1.05rem; line-height: 1.75; color: #555; margin-bottom: 1.6rem; word-break: keep-all; }
.osx-more { margin-top: 2rem; }
.osx-more a { display: inline-block; margin: 0 8px 8px 0; padding: 12px 26px; border: 1px solid #283444; color: #283444; font-family: 'notokr-medium', sans-serif; text-decoration: none; transition: background .25s, color .25s; }
.osx-more a:hover { background: #283444; color: #fff; }
.osx-split { display: flex; align-items: center; gap: 60px; }
.osx-split--rev { flex-direction: row-reverse; }
.osx-split__img { flex: 1.1; overflow: hidden; }
.osx-split__img img { display: block; width: 100%; height: 460px; object-fit: cover; transition: transform 1.2s ease; }
.osx-split__img:hover img { transform: scale(1.04); }
.osx-split__txt { flex: 1; }
.osx-facts > div { display: flex; padding: 14px 0; border-bottom: 1px solid #e3e3e3; }
.osx-facts dt { flex: 0 0 90px; font-family: 'notokr-medium', sans-serif; color: #006899; }
.osx-facts dd { color: #333; line-height: 1.6; }
.osx-facts dd small { display: block; color: #666; font-size: .9rem; }
.osx-prem { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 2rem; }
.osx-prem li { padding: 30px 28px; background: #fff; border: 1px solid #e3e3e3; border-top: 3px solid #283444; }
.osx-prem b { display: block; font-family: 'notokr-medium', sans-serif; color: #006899; margin-bottom: .8rem; }
.osx-prem strong { display: block; font-family: 'notokr-medium', sans-serif; font-weight: normal; font-size: 1.2rem; color: #222; margin-bottom: .5rem; }
.osx-prem span { color: #555; line-height: 1.7; word-break: keep-all; }
.osx-dots li { position: relative; padding: 6px 0 6px 16px; color: #444; line-height: 1.6; }
.osx-dots li::before { content: ""; position: absolute; left: 0; top: 16px; width: 6px; height: 6px; background: #006899; }
.osx-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 2rem; }
.osx-card { display: block; background: #fff; border: 1px solid #e3e3e3; text-decoration: none; transition: box-shadow .3s, transform .3s; }
.osx-card:hover { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(0,0,0,.08); }
.osx-card__img { display: block; overflow: hidden; height: 210px; background: #f3f3f3; }
.osx-card__img img { width: 100%; height: 100%; object-fit: cover; }
.osx-card__body { display: block; padding: 22px; }
.osx-card__body em { display: block; font-style: normal; font-size: .8rem; letter-spacing: .2em; color: #006899; }
.osx-card__body b { display: block; margin: .4rem 0; font-family: 'notokr-medium', sans-serif; font-weight: normal; font-size: 1.2rem; color: #222; }
.osx-card__body span { display: block; color: #555; line-height: 1.6; min-height: 3.2em; }
.osx-card__body i { display: inline-block; margin-top: .8rem; font-style: normal; font-size: .9rem; color: #283444; border-bottom: 1px solid #283444; }
.osx-two { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.osx-box { padding: 44px; background: #fff; border: 1px solid #e3e3e3; }
.osx-price li { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid #e9e9e9; }
.osx-price span { color: #555; }
.osx-price b { font-family: 'notokr-medium', sans-serif; font-weight: normal; color: #222; text-align: right; }
.osx-big a { font-family: 'notokr-medium', sans-serif; font-size: 2.2rem; color: #006899; text-decoration: none; }
/* 나타나는 효과 — 원본 첫 화면과 어울리게 천천히 위로 */
.osx-js [data-reveal] { opacity: 0; transform: translateY(36px); transition: opacity .9s ease, transform .9s ease; }
.osx-js [data-reveal].is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .osx-js [data-reveal] { opacity: 1; transform: none; transition: none; } }
@media (max-width: 1024px) {
  .osx-sec { padding: 64px 0; }
  .osx-sec__t { font-size: 1.6rem; }
  .osx-split, .osx-split--rev { flex-direction: column; gap: 28px; }
  .osx-split__img, .osx-split__txt { width: 100%; }
  .osx-split__img img { height: 280px; }
  .osx-prem { grid-template-columns: 1fr 1fr; }
  .osx-cards { grid-template-columns: 1fr 1fr; }
  .osx-two { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .osx-sec__in { padding: 0 18px; }
  .osx-prem, .osx-cards { grid-template-columns: 1fr; }
  .osx-box { padding: 28px 22px; }
  .osx-price li { flex-direction: column; gap: 2px; }
  .osx-price b { text-align: left; }
}
/* E-모델하우스 (2026-10-21 사장님 「모바일 플로팅 버튼에 넣어줘」) */
.osx-dock__b--vr { background: #f3f0ea; color: #4a3a1f !important; border: 1px solid #c9b48f; }
@media (max-width: 1024px) {
  .osx-dock__b--vr { border: 0; border-top: 1px solid #c9b48f; }
  .osx-dock__b { padding: 6px 4px; }
  .osx-dock__b b { font-size: 13px; letter-spacing: -.5px; }
  .osx-dock__b span { font-size: 10.5px; letter-spacing: -.5px; }
}