:root {
    --hh-customer-ink: #161a18;
    --hh-customer-muted: #626a65;
    --hh-customer-green: #20584c;
    --hh-customer-soft: #f4f7f5;
    --hh-customer-line: #dfe5e1;
    --hh-customer-coral: #f5684d;
}

.hh-customer-page,
.hh-customer-page * { box-sizing: border-box; }
.hh-customer-page { min-height: 70vh; background: #fff; color: var(--hh-customer-ink); }
.hh-customer-page a { color: inherit; text-decoration: none; }
.hh-customer-page .hh-shell { width: min(1320px, calc(100% - 48px)); margin-inline: auto; }

.hh-customer-hero { padding: 82px 0 38px; }
.hh-customer-hero__inner { display: flex; align-items: flex-end; justify-content: space-between; gap: 48px; }
.hh-customer-hero__eyebrow,
.hh-customer-content__eyebrow { margin: 0 0 13px; color: var(--hh-customer-green); font-size: 11px; font-weight: 700; letter-spacing: .18em; }
.hh-customer-hero h1 { margin: 0; font-size: clamp(42px, 4.2vw, 64px); font-weight: 640; line-height: 1.08; letter-spacing: -.055em; }
.hh-customer-hero__lead { width: min(440px, 42%); margin: 0 0 5px; color: var(--hh-customer-muted); font-size: 16px; font-weight: 450; line-height: 1.72; word-break: keep-all; }

.hh-customer-menu { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 0 94px; overflow: hidden; border: 1px solid var(--hh-customer-line); border-radius: 18px; background: #fff; }
.hh-customer-menu a { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 128px; padding: 25px 54px 25px 27px; transition: background .2s ease, color .2s ease; }
.hh-customer-menu a + a { border-left: 1px solid var(--hh-customer-line); }
.hh-customer-menu a:hover { background: var(--hh-customer-soft); }
.hh-customer-menu a.is-active { background: var(--hh-customer-green); color: #fff; }
.hh-customer-menu span { font-size: 17px; font-weight: 620; letter-spacing: -.025em; }
.hh-customer-menu small { margin-top: 8px; color: #747c77; font-size: 12px; font-weight: 430; line-height: 1.45; }
.hh-customer-menu a.is-active small { color: rgba(255,255,255,.68); }
.hh-customer-menu svg { position: absolute; top: 50%; right: 25px; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; transform: translateY(-50%); opacity: .52; }

.hh-customer-content { padding: 0 0 130px; }
.hh-customer-content__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 31px; padding-bottom: 24px; border-bottom: 1px solid var(--hh-customer-line); }
.hh-customer-content__eyebrow { margin-bottom: 9px; }
.hh-customer-content__head h2 { margin: 0; font-size: 32px; font-weight: 640; line-height: 1.2; letter-spacing: -.045em; }
.hh-customer-content__head > p { margin: 0 0 3px; color: var(--hh-customer-muted); font-size: 14px; font-weight: 430; line-height: 1.6; }
.hh-customer-board { max-width: 1080px; margin: 0 auto; }

.hh-customer-board .bo_li_top { display: flex; align-items: center; flex-direction: row-reverse; justify-content: space-between; gap: 24px; margin: 0 0 20px; }
.hh-customer-board .bo_li_top .board_search { display: flex; justify-content: flex-start; width: auto; margin: 0; }
.hh-customer-board .board_search select,
.hh-customer-board .board_search input[type="text"],
.hh-customer-board .board_search input[type="submit"] { height: 44px; border: 1px solid var(--hh-customer-line); background: #fff; color: var(--hh-customer-ink); font-family: inherit; font-size: 14px; line-height: 42px; box-shadow: none; }
.hh-customer-board .board_search select { min-width: 94px; padding: 0 34px 0 14px; border-radius: 10px 0 0 10px; }
.hh-customer-board .board_search input[type="text"] { width: 250px; margin-left: -1px; padding: 0 14px; }
.hh-customer-board .board_search input[type="submit"] { min-width: 74px; margin-left: -1px; padding: 0 17px; border-color: var(--hh-customer-ink); border-radius: 0 10px 10px 0; background: var(--hh-customer-ink); color: #fff; cursor: pointer; }
.hh-customer-board .board_btn { width: auto; padding: 0; }
.hh-customer-board .board_btn .total { padding: 0; color: #7a817d; font-size: 12px; letter-spacing: .02em; }
.hh-customer-board .board_list { border-top: 1px solid var(--hh-customer-ink); border-bottom: 1px solid var(--hh-customer-line); }
.hh-customer-board .board_list > table { width: 100%; border-spacing: 0; }
.hh-customer-board .board_list > table th,
.hh-customer-board .board_list > table td { padding: 22px 14px; border-bottom: 1px solid #e8ebe9; background: #fff; color: #626964; font-size: 14px; line-height: 1.55; text-align: center; }
.hh-customer-board .board_list > table thead th { background: #fafbfa; color: #525954; font-size: 12px; font-weight: 600; }
.hh-customer-board .board_list > table .bo_tit { text-align: left; }
.hh-customer-board .board_list > table .bo_tit > a { display: block; padding: 0 15px; color: var(--hh-customer-ink); font-size: 16px; font-weight: 520; letter-spacing: -.018em; }
.hh-customer-board .board_list > table .bo_tit > a:hover { color: var(--hh-customer-green); }
.hh-customer-board .board_list .notice_icon { display: inline-flex; align-items: center; justify-content: center; min-width: 45px; height: 25px; padding: 0 9px; border-radius: 999px; background: var(--hh-customer-green); color: #fff; font-size: 11px; font-weight: 620; }
.hh-customer-board .board_list .noPost td { height: 210px; color: #8a918d; }

.hh-customer-board .depth-three { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 26px; }
.hh-customer-board .depth-three a { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0 18px; border: 1px solid var(--hh-customer-line); border-radius: 999px; background: #fff; color: #5f6762; font-size: 13px; font-weight: 520; }
.hh-customer-board .depth-three a.active { border-color: var(--hh-customer-green); background: var(--hh-customer-green); color: #fff; }
.hh-customer-board .faqArea { border-top: 1px solid var(--hh-customer-ink); }
.hh-customer-board .faqArea > li { border-bottom: 1px solid var(--hh-customer-line); }
.hh-customer-board .faqArea > li .q { position: relative; display: block; padding: 26px 70px 26px 60px; color: var(--hh-customer-ink); font-size: 16px; font-weight: 540; line-height: 1.55; }
.hh-customer-board .faqArea > li .q::before { content: "Q"; position: absolute; top: 23px; left: 14px; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--hh-customer-soft); color: var(--hh-customer-green); font-size: 12px; font-weight: 700; }
.hh-customer-board .faqArea > li .q::after { content: "+"; position: absolute; top: 50%; right: 20px; color: #6f7772; font-size: 22px; font-weight: 300; transform: translateY(-52%); }
.hh-customer-board .faqArea > li.active .q { background: #fbfcfb; }
.hh-customer-board .faqArea > li.active .q::after { content: "−"; }
.hh-customer-board .faqArea > li .a { position: relative; display: none; padding: 28px 60px 34px; border-top: 1px solid #edf0ee; background: var(--hh-customer-soft); color: #48504b; font-size: 15px; font-weight: 430; line-height: 1.75; }
.hh-customer-board .faqArea > li .a::before { content: "A"; position: absolute; top: 25px; left: 14px; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 1px solid #cbd8d3; border-radius: 50%; background: #fff; color: var(--hh-customer-green); font-size: 12px; font-weight: 700; }
.hh-customer-board .faqArea > li.noPost { display: flex; align-items: center; justify-content: center; min-height: 220px; color: #858c87; font-size: 14px; }

.hh-customer-board .board_view { border-top: 1px solid var(--hh-customer-ink); }
.hh-customer-board .board_view table { width: 100%; border-spacing: 0; }
.hh-customer-board .board_view th { padding: 30px 26px 25px; border-bottom: 1px solid var(--hh-customer-line); background: #fff; text-align: left; }
.hh-customer-board .board_view .view_title { color: var(--hh-customer-ink); font-size: 25px; font-weight: 620; line-height: 1.4; letter-spacing: -.035em; }
.hh-customer-board .board_view .view_info { margin-top: 14px; }
.hh-customer-board .board_view .view_txt { display: flex; gap: 18px; }
.hh-customer-board .board_view .view_txt .txt { color: #858c87; font-size: 12px; }
.hh-customer-board .board_view .view_txt .txt strong { color: #69716c; font-weight: 560; }
.hh-customer-board .board_view .view_cont { min-height: 320px; padding: 38px 26px 70px; border-bottom: 1px solid var(--hh-customer-line); color: #303632; font-size: 15px; line-height: 1.8; vertical-align: top; }
.hh-customer-board .pageNavigation { margin: 0; border-bottom: 1px solid var(--hh-customer-line); }
.hh-customer-board .pageNavigation > dl { min-height: 58px; border-top: 1px solid var(--hh-customer-line); font-size: 13px; }
.hh-customer-board .pageNavigation > dl > dt { width: 95px; height: 58px; color: #68706b; }
.hh-customer-board .pageNavigation > dl > dd { padding: 0 25px; }
.hh-customer-board .board_btn.end { display: flex; justify-content: flex-end; width: 100%; padding: 24px 0 0; }
.hh-customer-board .board_btn .click { min-width: 110px; padding: 13px 22px; border: 1px solid var(--hh-customer-ink); border-radius: 9px; background: var(--hh-customer-ink); color: #fff; font-size: 14px; font-weight: 560; }

.hh-customer-help { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 42px; }
.hh-customer-help > div,
.hh-customer-help > a { position: relative; min-height: 128px; padding: 24px 25px; border: 1px solid var(--hh-customer-line); border-radius: 16px; background: #fff; }
.hh-customer-help small { display: block; color: var(--hh-customer-green); font-size: 10px; font-weight: 700; letter-spacing: .13em; }
.hh-customer-help strong { display: block; margin-top: 10px; color: var(--hh-customer-ink); font-size: 17px; font-weight: 620; }
.hh-customer-help p { margin: 7px 0 0; color: #777e79; font-size: 12px; line-height: 1.5; }
.hh-customer-help b { position: absolute; top: 24px; right: 24px; color: var(--hh-customer-coral); font-size: 12px; font-weight: 650; }
.hh-customer-board--inquiry { max-width: 920px; }
.hh-customer-board--inquiry #bo_w { padding: 0; }
.hh-customer-board--inquiry .board_write { overflow: visible; border: 0; }
.hh-customer-board--inquiry .board_write > table { width: 100%; margin: 0; border-spacing: 0; table-layout: fixed; }
.hh-customer-board--inquiry .board_write > table th,
.hh-customer-board--inquiry .board_write > table td { height: auto; padding: 0 0 24px; border: 0; background: #fff; color: var(--hh-customer-ink); font-size: 14px; text-align: left; vertical-align: top; }
.hh-customer-board--inquiry .board_write > table th { width: 145px; padding-top: 14px; font-weight: 560; }
.hh-customer-board--inquiry .board_write input[type="text"],
.hh-customer-board--inquiry .board_write input[type="password"],
.hh-customer-board--inquiry .board_write input[type="file"],
.hh-customer-board--inquiry .board_write textarea { width: 100%; max-width: none; height: 50px; padding: 0 15px; border: 1px solid #d9dfdb; border-radius: 10px; background: #fff; color: var(--hh-customer-ink); font-family: inherit; font-size: 14px; line-height: 48px; box-shadow: none; }
.hh-customer-board--inquiry .board_write textarea { height: 230px; padding: 15px; line-height: 1.7; resize: vertical; }
.hh-customer-board--inquiry .board_write input[type="file"] { padding: 12px 14px; line-height: normal; }
.hh-customer-board--inquiry .board_btn.write { display: flex; justify-content: flex-end; margin: 2px 0 0; padding: 0; }
.hh-customer-board--inquiry .board_btn.write .board_user { margin: 0; }
.hh-customer-board--inquiry .board_btn.write .board_user > li { margin: 0 !important; }
.hh-customer-board--inquiry .board_btn.write .click.big { min-width: 190px; padding: 16px 24px; border-color: var(--hh-customer-green); background: var(--hh-customer-green); border-radius: 10px; font-size: 15px; font-weight: 600; }
.hh-customer-login-card { display: flex; align-items: center; justify-content: space-between; gap: 36px; padding: 34px 36px; border: 1px solid var(--hh-customer-line); border-radius: 18px; background: var(--hh-customer-soft); }
.hh-customer-login-card small { display: block; color: var(--hh-customer-green); font-size: 10px; font-weight: 700; letter-spacing: .14em; }
.hh-customer-login-card strong { display: block; margin-top: 10px; color: var(--hh-customer-ink); font-size: 20px; font-weight: 620; letter-spacing: -.025em; }
.hh-customer-login-card p { margin: 8px 0 0; color: #6b736e; font-size: 13px; line-height: 1.6; }
.hh-customer-login-card a { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; min-width: 180px; min-height: 50px; padding: 0 22px; border-radius: 10px; background: var(--hh-customer-green); color: #fff; font-size: 14px; font-weight: 600; }

.hh-customer-page .paging_all,
.hh-customer-page .pg_wrap { margin-top: 28px; text-align: center; }

@media (max-width: 900px) {
    .hh-customer-hero { padding-top: 66px; }
    .hh-customer-hero__inner { align-items: flex-start; flex-direction: column; gap: 22px; }
    .hh-customer-hero__lead { width: min(540px, 100%); }
    .hh-customer-menu { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hh-customer-menu a:nth-child(3) { border-left: 0; border-top: 1px solid var(--hh-customer-line); }
    .hh-customer-menu a:nth-child(4) { border-top: 1px solid var(--hh-customer-line); }
}

@media (max-width: 680px) {
    .hh-customer-page { padding-bottom: 76px; }
    .hh-customer-page .hh-shell { width: min(100% - 36px, 1320px); }
    .hh-customer-hero { padding: 47px 0 28px; }
    .hh-customer-hero__eyebrow,
    .hh-customer-content__eyebrow { margin-bottom: 9px; font-size: 9px; }
    .hh-customer-hero h1 { font-size: 36px; line-height: 1.12; }
    .hh-customer-hero__lead { font-size: 14px; line-height: 1.65; }
    .hh-customer-menu { margin-bottom: 66px; border-radius: 15px; }
    .hh-customer-menu a { min-height: 93px; padding: 19px 38px 18px 18px; }
    .hh-customer-menu span { font-size: 15px; }
    .hh-customer-menu small { display: none; }
    .hh-customer-menu svg { right: 15px; width: 15px; height: 15px; }
    .hh-customer-content { padding-bottom: 88px; }
    .hh-customer-content__head { align-items: flex-start; flex-direction: column; gap: 10px; margin-bottom: 22px; padding-bottom: 18px; }
    .hh-customer-content__head h2 { font-size: 26px; }
    .hh-customer-content__head > p { font-size: 13px; }
    .hh-customer-board .bo_li_top { align-items: stretch; flex-direction: column; gap: 14px; }
    .hh-customer-board .bo_li_top .board_search { width: 100%; }
    .hh-customer-board .board_search select { min-width: 82px; }
    .hh-customer-board .board_search input[type="text"] { min-width: 0; width: 100%; }
    .hh-customer-board .board_search input[type="submit"] { min-width: 64px; }
    .hh-customer-board .board_btn .total { display: none; }
    .hh-customer-board .board_list { overflow: visible; }
    .hh-customer-board .board_list > table,
    .hh-customer-board .board_list > table tbody { display: block; }
    .hh-customer-board .board_list > table thead { display: none; }
    .hh-customer-board .board_list > table tr { position: relative; display: block; padding: 21px 0 20px; border-bottom: 1px solid var(--hh-customer-line); }
    .hh-customer-board .board_list > table td { display: block; padding: 0; border: 0; text-align: left; }
    .hh-customer-board .board_list > table .td_num2 { margin-bottom: 8px; }
    .hh-customer-board .board_list > table .td_num2:not(:has(.notice_icon)) { display: none; }
    .hh-customer-board .board_list > table .bo_tit > a { padding: 0; font-size: 15px; line-height: 1.55; }
    .hh-customer-board .board_list > table .btm { margin-top: 8px; color: #8a918d; font-size: 11px; }
    .hh-customer-board .depth-three { flex-wrap: nowrap; margin-right: -18px; margin-left: -18px; padding: 0 18px 5px; overflow-x: auto; scrollbar-width: none; }
    .hh-customer-board .depth-three::-webkit-scrollbar { display: none; }
    .hh-customer-board .depth-three a { flex: 0 0 auto; }
    .hh-customer-board .faqArea > li .q { padding: 22px 44px; font-size: 14px; }
    .hh-customer-board .faqArea > li .q::before { top: 20px; left: 4px; width: 27px; height: 27px; }
    .hh-customer-board .faqArea > li .q::after { right: 8px; }
    .hh-customer-board .faqArea > li .a { padding: 23px 15px 27px 44px; font-size: 13px; }
    .hh-customer-board .faqArea > li .a::before { top: 21px; left: 4px; width: 27px; height: 27px; }
    .hh-customer-board .board_view th { padding: 23px 5px 20px; }
    .hh-customer-board .board_view .view_title { font-size: 21px; }
    .hh-customer-board .board_view .view_cont { min-height: 250px; padding: 28px 5px 55px; font-size: 14px; }
    .hh-customer-board .pageNavigation > dl > dt { width: 72px; }
    .hh-customer-board .pageNavigation > dl > dd { padding: 0 12px; }
    .hh-customer-help { grid-template-columns: 1fr; gap: 9px; margin-bottom: 32px; }
    .hh-customer-help > div,
    .hh-customer-help > a { min-height: 104px; padding: 20px; border-radius: 13px; }
    .hh-customer-help b { top: 20px; right: 20px; }
    .hh-customer-board--inquiry .board_write > table,
    .hh-customer-board--inquiry .board_write > table tbody,
    .hh-customer-board--inquiry .board_write > table tr,
    .hh-customer-board--inquiry .board_write > table th,
    .hh-customer-board--inquiry .board_write > table td { display: block; width: 100%; }
    .hh-customer-board--inquiry .board_write > table th { padding: 0 0 9px; font-size: 13px; }
    .hh-customer-board--inquiry .board_write > table td { padding-bottom: 20px; }
    .hh-customer-board--inquiry .board_write input[type="text"],
    .hh-customer-board--inquiry .board_write input[type="file"] { height: 47px; font-size: 13px; line-height: 45px; }
    .hh-customer-board--inquiry .board_write textarea { height: 210px; font-size: 13px; }
    .hh-customer-board--inquiry .board_btn.write,
    .hh-customer-board--inquiry .board_btn.write .board_user,
    .hh-customer-board--inquiry .board_btn.write .board_user > li { width: 100%; }
    .hh-customer-board--inquiry .board_btn.write .click.big { width: 100%; }
    .hh-customer-login-card { align-items: stretch; flex-direction: column; gap: 22px; padding: 26px 22px; border-radius: 15px; }
    .hh-customer-login-card strong { font-size: 18px; }
    .hh-customer-login-card a { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .hh-customer-page * { scroll-behavior: auto !important; transition: none !important; }
}