/* 고객센터 공지사항 */
body.customer-notice { margin: 0; background: #fff; }
.customer-notice * { box-sizing: border-box; font-family: "Pretendard", sans-serif; }
.customer-notice [hidden] { display: none !important; }
#contaniner.customer-notice { 
    width: 100%; 
    padding:0 20px 180px; 
    padding-top: calc(290px - var(--site-promotion-offset, 0px));
    transition: padding-top 0.32s ease;
}
.customer-notice .notice-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.customer-notice .notice-heading { margin: 0 auto 56px; text-align: center; }
.customer-notice h1 { margin: 0; color: #252b36; font-weight: 600; letter-spacing: 0; }
.customer-notice .notice-heading__label { display: block; margin-bottom: 10px; color: #8991a8; font-size: 24px; font-weight: 600; line-height: 24px; letter-spacing: 0; }
.customer-notice .notice-heading__title { display: block; color: #252b36; font-size: 50px; font-weight: 600; line-height: 70px; letter-spacing: 0; word-break: keep-all; }
.customer-notice .notice-content { width: 100%; max-width: 700px; margin: 0 auto; }
.customer-notice .notice-search { margin: 0; }
.customer-notice .notice-search__filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.customer-notice .notice-control { display: block; width: 100%; min-width: 0; height: 44px; margin: 0; padding: 0 14px; border: 1px solid #d2daed; border-radius: 4px; background-color: #fff; color: #0f172a; font-size: 14px; font-weight: 400; line-height: normal; letter-spacing: 0; box-shadow: none; }
.customer-notice select.notice-control { appearance: none; padding-right: 36px; background: #fff url("../../../img/sub/customer/notice_select_arrow.svg") right 8px center / 28px 28px no-repeat; cursor: pointer; }
.customer-notice .notice-control::placeholder { color: #acbfdf; opacity: 1; }
.customer-notice .notice-control:focus { outline: 2px solid #7140ff;}
.customer-notice .notice-search__keyword { position: relative; margin-top: 8px; }
.customer-notice .notice-search__keyword input { padding-right: 58px; }
.customer-notice #notice_search_btn { position: absolute; top: 0; right: 0; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 4px; background: transparent; cursor: pointer; }
.customer-notice #notice_search_btn::before { content: ""; width: 24px; height: 24px; background: url("../../../img/sub/customer/notice_search.svg") center / contain no-repeat; }
.customer-notice .notice-tabs { display: flex; justify-content: center; gap: 10px; margin: 30px 0 40px; overflow-x: auto; padding: 0; list-style: none; }
.customer-notice .notice-tabs > .tab_li { display: flex; flex: 0 0 auto; margin: 0; padding: 0; list-style: none; }
.customer-notice .notice-tabs button { flex: 0 0 auto; min-height: 34px; margin: 0; padding: 6px 12px; border: 1px solid #d2daed; border-radius: 100px; background: #fff; color: #60718e; font-size: 14px; font-weight: 400; line-height: 20px; letter-spacing: 0; white-space: nowrap; cursor: pointer; }
.customer-notice .notice-tabs > .tab_li.on > button { border-color: #7140ff; background: #7140ff; color: #fff; font-weight: 600; }
.customer-notice button:focus-visible,
.customer-notice a[href]:focus-visible { outline: 2px solid #7140ff; outline-offset: 3px; }
.customer-notice .notice-list { margin: 0; padding: 2px 15px; border: 1px solid #eaeff4; border-radius: 12px; list-style: none; }
.customer-notice .notice-row { margin: 0; padding: 20px 0 16px; border-bottom: 1px solid #eaeff4; list-style: none; }
.customer-notice .notice-row:last-of-type,
.customer-notice .notice-row.is-last { border-bottom: 0; }
.customer-notice .notice-subject { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.customer-notice .notice-title { min-width: 0; color: #0f172a; font-size: 14px; font-weight: 500; line-height: 20px; letter-spacing: 0; text-decoration: none; overflow-wrap: anywhere; word-break: keep-all; }
.customer-notice .notice-title[href]:hover { text-decoration: underline; }
.customer-notice .notice-prefix { flex: 0 0 auto; color: #7a43ff; font-size: 14px; font-weight: 600; line-height: 20px; letter-spacing: 0; }
.customer-notice .notice-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 20px; margin-top: 14px; }
.customer-notice .notice-meta > span,
.customer-notice .notice-meta time { color: #8991a8; font-size: 13px; font-weight: 400; line-height: 18px; letter-spacing: 0; }
.customer-notice .notice-category { margin-right: auto; }
.customer-notice .notice-meta .notice-views { display: inline-flex; align-items: center; gap: 5px; color: #b7c5e8; white-space: nowrap; }
.customer-notice .notice-views::before { content: ""; width: 18px; height: 18px; flex: 0 0 auto; background: url("../../../img/sub/register/register_icon02.svg") center / contain no-repeat; }
.customer-notice .notice-meta time { white-space: nowrap; }
.customer-notice .notice-empty { padding: 64px 20px; border: 1px solid #eaeff4; border-radius: 12px; text-align: center; }
.customer-notice .notice-empty p { margin: 0; color: #60718e; font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; }
.customer-notice .notice-empty p + p { margin-top: 6px; }
.customer-notice .notice-status { margin: 0 0 16px; color: #60718e; font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; }
.customer-notice .notice-pagination { display: flex; justify-content: center; align-items: center; gap: 6px; margin-top: 50px; }
.customer-notice .notice-pagination button,
.customer-notice .notice-pagination > span { display: inline-grid; place-items: center; min-width: 28px; height: 28px; margin: 0; padding: 0 4px; border: 0; border-radius: 4px; background: transparent; color: #8aa5e7; font-size: 13px; font-weight: 400; line-height: 18px; letter-spacing: 0; opacity: 1; }
.customer-notice .notice-pagination button[aria-current="page"] { background: #d2daed; color: #0f172a; }
.customer-notice .notice-pagination .notice-pagination__prev,
.customer-notice .notice-pagination .notice-pagination__next { min-width: 18px; padding: 0; }
.customer-notice .notice-pagination__prev::before,
.customer-notice .notice-pagination__next::before { content: ""; width: 6px; height: 6px; border-top: 1px solid #a9bffc; border-right: 1px solid #a9bffc; transform: rotate(45deg); }
.customer-notice .notice-pagination__prev::before { transform: rotate(-135deg); }

@media screen and (max-width: 768px) {
    #contaniner.customer-notice { 
        padding: 0 20px 64px; 
        padding-top: calc(190px - var(--site-promotion-offset, 0px));
    }
    .customer-notice .notice-heading { margin-bottom: 42px; }
    .customer-notice .notice-heading__label { margin-bottom: 8px; font-size: 16px; line-height: 20px; }
    .customer-notice .notice-heading__title { font-size: 24px; line-height: 34px; }
    .customer-notice .notice-tabs { justify-content: start; gap: 8px; margin: 14px 0; }
    .customer-notice .notice-pagination { margin-top: 40px; }
}
