.modujang-v2-mypage,
/* 배경 fixed 는 모바일에서 재합성 부담만 크고, 안쪽 스크롤 영역을 쓰는 화면이라 효과도 없음 */
.modujang-v2-support { min-width: 0; min-height: 100dvh; padding-bottom: 96px; color: #222; background: #8eddf8 url('/assets/img/bg_joinend.jpg') center top / cover no-repeat; }
.modujang-v2-mypage > .header-home,
.modujang-v2-support > .header-home { display: none; }
.mypage-v2-title { display: flex; justify-content: center; margin-bottom: 18px; }
.mypage-v2-title img { width: min(70vw,270px); height: auto; object-fit: contain; }
.mypage-v2-title.small img { width: min(66vw,250px); }

.modujang-v2-mypage .page__mypage,
.modujang-v2-mypage .page__outer,
.modujang-v2-support .page__outer { width: min(calc(100% - clamp(20px,6.16vw,36px)),540px); min-height: calc(100dvh - 156px); margin: -4px auto 16px; padding: clamp(16px,4vw,24px); border: 1px solid #216ce0; border-radius: 24px; background: rgba(244,248,252,.96); box-shadow: inset 0 0 0 5px #fff; }
.modujang-v2-mypage .page__outer .page__inner,
.modujang-v2-support .page__outer .page__inner { width: 100%; max-width: none; margin: 0; padding: 0; }
.modujang-v2-mypage .profile,
.modujang-v2-mypage .profile__center { display: flex; flex-direction: column; align-items: center; padding: 4px 0 18px; }
.modujang-v2-mypage .profile img,
.modujang-v2-mypage .profile__center > form label > img { width: 90px; height: 90px; border: 3px solid #fff; border-radius: 50%; object-fit: cover; box-shadow: 0 4px 14px rgba(22,84,166,.18); }
.modujang-v2-mypage .profile b,
.modujang-v2-mypage .profile__center > b { margin-top: 9px; font-size: 17px; }
.modujang-v2-mypage .profile__center > p { color: #697386; font-size: 12px; }
.modujang-v2-mypage .mypage-point { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin-bottom: 14px; }
.modujang-v2-mypage .mypage-point-item { padding: 15px 10px; border: 1px solid #b8d5f0; border-radius: 16px; background: #fff; text-align: center; cursor: pointer; }
.modujang-v2-mypage .mypage-point-item b { color: #0672ff; font-size: 18px; }
.modujang-v2-mypage .mypage-point-item p { margin-top: 3px; color: #697386; font-size: 12px; }
.modujang-v2-mypage .mypage-list { overflow: hidden; border: 1px solid #bed3e6; border-radius: 16px; background: #fff; }
.modujang-v2-mypage .mypage-list a { display: flex; align-items: center; justify-content: space-between; min-height: 47px; padding: 0 16px; border-bottom: 1px solid #e5eaf0; color: #222; font-size: 14px; font-weight: 600; }
.modujang-v2-mypage .mypage-list a:last-child { border-bottom: 0; }
.modujang-v2-mypage .mypage-list img { width: 8px; }
.modujang-v2-mypage .mypage-btns { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin-top: 14px; }
.modujang-v2-mypage .mypage-btns button,
.modujang-v2-mypage .btn-qna { width: 100%; height: 44px; border-radius: 12px; }
.modujang-v2-mypage .btn-qna { margin-top: 8px; }
.modujang-v2-mypage .logout_btn { margin-top: 16px; text-align: center; }
.modujang-v2-mypage .btn-logout { border: 0; background: transparent; color: #697386; font-size: 13px; text-decoration: underline; }

/* 마이페이지 메인: 퍼블리싱 44_내정보-메인 구조 */
.modujang-v2-mypage .mypage-flow-page .mypage-flow__profile {
    width: min(100%,287px);
    margin: 0 auto 12px;
}
.modujang-v2-mypage .mypage-flow-page .mypage-flow__progress-card {
    display: block;
    width: min(100%,287px);
    margin: 0 auto;
    color: inherit;
    cursor: pointer;
}
/* 진행 중 시즌이 없을 때: 진행률 대신 안내를 오렌지 카드 가운데에 표시. */
.modujang-v2-mypage .mypage-flow-page .mypage-flow__progress-card--empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.modujang-v2-mypage .mypage-flow-page .mypage-flow__progress-card--empty p {
    margin: 0;
}
.modujang-v2-mypage .mypage-flow-page .mypage-flow__summary-card {
    color: #fff;
    cursor: pointer;
}
.modujang-v2-mypage .mypage-flow-page .mypage-flow__summary-card strong {
    font-size: 16px;
    line-height: 1.15;
}
.modujang-v2-mypage .mypage-flow-page .mypage-flow__menu-item {
    color: #222;
}
.modujang-v2-mypage .mypage-flow-page .mypage-flow__menu-item span {
    font-size: 14px;
}

.modujang-v2-mypage .setting-form { display: flex; flex-direction: column; gap: 14px; }
.modujang-v2-mypage .input-group label { display: block; margin-bottom: 7px; font-size: 14px; font-weight: 700; }
.modujang-v2-mypage .input-group input { width: 100%; height: 50px; padding: 0 15px; border: 1px solid #d8dee7; border-radius: 14px; background: #fff; }
.modujang-v2-mypage .setting-box { overflow: hidden; border: 1px solid #bed3e6; border-radius: 16px; background: #fff; }
.modujang-v2-mypage .setting-item { display: flex; align-items: center; justify-content: space-between; min-height: 54px; padding: 0 16px; border-bottom: 1px solid #e5eaf0; font-size: 14px; }
.modujang-v2-mypage .setting-item:last-child { border-bottom: 0; }
.modujang-v2-mypage .switch { position: relative; width: 44px; height: 24px; }
.modujang-v2-mypage .switch input { opacity: 0; }
.modujang-v2-mypage .switch .slider { position: absolute; inset: 0; border-radius: 99px; background: #c7cdd5; }
.modujang-v2-mypage .switch .slider::before { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: .2s; }
.modujang-v2-mypage .switch input:checked + .slider { background: #0672ff; }
.modujang-v2-mypage .switch input:checked + .slider::before { transform: translateX(20px); }

/* 회원정보 설정: 퍼블리싱 45번 화면 */
.modujang-v2-mypage .page__mypage.myadit-v2-page {
    width: min(calc(100% - 40px),540px);
    margin: 8px auto 16px;
    padding: 6px clamp(24px,6.5vw,28px) 24px;
    color: #222;
    box-shadow:
        inset 0 0 0 5px #fff,
        inset 0 0 0 6px rgba(33,108,224,.72);
}
.modujang-v2-mypage .myadit-v2-page .mypage-v2-title { margin-bottom: 38px; }
.modujang-v2-mypage .myadit-v2-profile {
    padding: 0 0 20px;
}
.modujang-v2-mypage .myadit-v2-profile #profileImgForm {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.modujang-v2-mypage .myadit-v2-profile #profileImgForm > label {
    display: block;
    cursor: pointer;
}
.modujang-v2-mypage .myadit-v2-profile #profileImgForm > label > img {
    display: block;
    width: 74px;
    height: 74px;
    border: 0;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: none;
}
.modujang-v2-mypage .myadit-v2-profile #profileImgForm > label > img.no_imgage {
    object-fit: contain;
}
.modujang-v2-mypage .myadit-v2-profile #profileImgForm svg { display: none; }
.modujang-v2-mypage .profile-edit-btn {
    min-width: 80px;
    height: 30px;
    margin-top: 12px;
    padding: 0 11px;
    border: 1px solid #e5c9a4;
    border-radius: 8px;
    background: #fffdf8;
    color: #6f6250;
    font-family: var(--font-pretendard);
    font-size: 12px;
    font-weight: 600;
    line-height: 28px;
    cursor: pointer;
}
.modujang-v2-mypage .myadit-v2-page .setting-form {
    gap: 26px;
    margin-top: 0;
}
.modujang-v2-mypage .myadit-v2-page .input-group { margin-bottom: 0; }
.modujang-v2-mypage .myadit-v2-page .input-group label,
.modujang-v2-mypage .myadit-v2-page .alarm-setting-group > h2 {
    color: #222;
    font-size: 15px;
    font-weight: 700;
}
.modujang-v2-mypage .myadit-v2-page .input-group label { margin-bottom: 13px; }
.modujang-v2-mypage .myadit-v2-page .input-group input {
    height: 54px;
    padding: 0 20px;
    border-color: #eee;
    border-radius: 16px;
    background: #fff;
    color: #a9a9a9;
    font-size: 15px;
    font-weight: 500;
    opacity: 1;
    -webkit-text-fill-color: #a9a9a9;
}
.modujang-v2-mypage .myadit-v2-page .input-group input::placeholder {
    color: #a9a9a9 !important;
    opacity: 1;
}
.modujang-v2-mypage .alarm-setting-group > h2 {
    margin: 0 0 6px;
    line-height: 1.2;
}
.modujang-v2-mypage .myadit-v2-page .setting-box {
    margin-top: 0;
    padding: 7px 0;
    border-color: #d7e1eb;
    border-radius: 16px;
    background: #fff;
}
.modujang-v2-mypage .myadit-v2-page .setting-item {
    min-height: 54px;
    padding: 0 20px;
    border-bottom: 0;
}
.modujang-v2-mypage .myadit-v2-page .setting-item > span {
    color: #222;
    font-size: 15px;
    font-weight: 600;
}
.modujang-v2-mypage .myadit-v2-page .switch {
    width: 48px;
    height: 28px;
    flex: 0 0 48px;
}
.modujang-v2-mypage .myadit-v2-page .switch .slider { background: #bfbfbf; }
.modujang-v2-mypage .myadit-v2-page .switch .slider::before {
    top: 3px;
    left: 3px;
    width: 22px;
    height: 22px;
}
.modujang-v2-mypage .myadit-v2-page .switch input:checked + .slider { background: #1654a6; }
.modujang-v2-mypage .myadit-v2-page .switch input:checked + .slider::before {
    transform: translateX(20px);
}

.modujang-v2-mypage .head__tab.other,
.modujang-v2-support .head__tab.other { display: grid; grid-template-columns: repeat(2,1fr); gap: 7px; margin-bottom: 16px; padding: 0; }
.modujang-v2-support .head__tab.other { grid-template-columns: repeat(3,1fr); }
.modujang-v2-mypage .head__tab.other button,
.modujang-v2-support .head__tab.other button { width: 100%; min-width: 0; height: 40px; padding: 0 4px; border: 1px solid #d5b476; border-radius: 10px; background: #fff8ee; color: #67573f; font-size: clamp(11px,3vw,14px); font-weight: 700; }
.modujang-v2-mypage .head__tab.other .btn-common01,
.modujang-v2-support .head__tab.other .btn-common01 { border-color: #2479e6; background: #1976ed; color: #fff; }
.modujang-v2-mypage .search-wrap { position: relative; height: 50px; border: 1px solid #cbd0d7; border-radius: 15px; background: #fff; overflow: hidden; }
.modujang-v2-mypage .search-wrap input { width: 100%; height: 100%; padding: 0 48px 0 15px; border: 0; }
.modujang-v2-mypage .search-wrap button { position: absolute; right: 5px; top: 5px; width: 40px; height: 40px; border: 0; background: transparent; }
.modujang-v2-mypage .search-wrap img { width: 20px; }
.modujang-v2-mypage .top__items { display: flex; align-items: center; justify-content: space-between; margin: 12px 0; }
.modujang-v2-mypage .top__items p { font-size: 14px; font-weight: 600; }
.modujang-v2-mypage .top__items b { color: #0672ff; }
.modujang-v2-mypage .btn-sorting { display: flex; align-items: center; gap: 5px; border: 0; background: transparent; font-size: 12px; }
.modujang-v2-mypage .btn-sorting img { width: 12px; }
.modujang-v2-mypage .personbox-wrap { height: auto !important; min-height: 330px; }
.modujang-v2-mypage .personbox { display: flex; align-items: center; gap: 11px; margin-bottom: 10px !important; padding: 14px; border: 1px solid #b8d5f0; border-radius: 16px; background: #fff; }
.modujang-v2-mypage .personbox > img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.modujang-v2-mypage .personbox-text { min-width: 0; flex: 1; }
.modujang-v2-mypage .personbox-text h3 { font-size: 14px; }
.modujang-v2-mypage .personbox-text p { margin-top: 3px; color: #697386; font-size: 11px; }
.modujang-v2-mypage .personbox-btn { display: flex; align-items: center; gap: 5px; }
.modujang-v2-mypage .personbox-btn a,
.modujang-v2-mypage .personbox-btn button { display: flex; align-items: center; justify-content: center; width: auto; min-width: 54px; height: 32px; padding: 0 8px; border-radius: 9px; font-size: 11px; }

/* 친구 더보기(⋯) 메뉴 — 삭제 진입점 */
.modujang-v2-mypage .friend-more { position: relative; }
/* ⋯ 버튼은 선물하기와 달리 작은 정사각형이라 min-width 규칙을 덮어씀. */
.modujang-v2-mypage .friend-more .friend-more-btn { min-width: 32px; width: 32px; height: 32px; padding: 0; border: 1px solid #d3e2f2; border-radius: 9px; background: #fff; color: #697386; font-size: 15px; line-height: 1; }
.modujang-v2-mypage .friend-more .friend-more-btn:hover { background: #f1f7fc; }
/* 카드·리스트·스크롤 영역이 모두 overflow 를 잘라서, 드롭다운은 fixed 로 띄우고 좌표는 JS 가 잡음. */
.modujang-v2-mypage .friend-more-menu { display: none; position: fixed; z-index: 1000; min-width: 88px; padding: 4px; border: 1px solid #d3e2f2; border-radius: 10px; background: #fff; box-shadow: 0 8px 20px rgba(52, 109, 8, 0.12); }
.modujang-v2-mypage .friend-more-menu.is-open { display: block; }
.modujang-v2-mypage .friend-more-menu .friend-more-del { display: flex; align-items: center; justify-content: center; width: 100%; min-width: 0; height: 34px; padding: 0 10px; border: 0; border-radius: 7px; background: #fff; color: #e5484d; font-size: 13px; font-weight: 600; }
.modujang-v2-mypage .friend-more-menu .friend-more-del:hover { background: #fdecec; }
.modujang-v2-mypage .no-data { display: flex; align-items: center; justify-content: center; min-height: 330px; color: #697386; }
.modujang-v2-mypage .foot_btn,
.modujang-v2-support .foot_btn { position: static; width: 100%; margin-top: 16px; padding: 0; }
.modujang-v2-mypage .foot_btn > *,
.modujang-v2-support .foot_btn > * { display: flex; align-items: center; justify-content: center; width: 100%; height: 48px; border-radius: 12px; }

/* 친구 관리: 디자인 기준 화면 전용 셸 */
.modujang-v2-mypage.friend-v2-page {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    padding-bottom: 0;
    overflow: hidden;
    background-size: auto 124dvh;
}
.friend-v2-page .modujang-v2-scroll-region {
    margin-bottom: 0;
    padding-bottom: clamp(82px, 22.82vw, 98px);
}
.friend-v2-main {
    width: min(calc(100% - clamp(36px, 10.26vw, 54px)), 540px);
    margin: clamp(12px, 3.08vw, 18px) auto 0;
}
.modujang-v2-mypage.friend-v2-page .head__tab.other.friend-v2-tabs {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 0;
}
.modujang-v2-mypage.friend-v2-page .head__tab.other.friend-v2-tabs button {
    position: relative;
    width: 100%;
    min-width: 0;
    height: clamp(42px, 10.77vw, 52px);
    padding: 2px 4px 0;
    border: 1px solid #f5e6c6;
    border-right: 0;
    border-bottom: 2px solid var(--brown-500);
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    color: var(--brown-600);
    font-family: "Maplestory", sans-serif;
    font-size: clamp(12px, 3.59vw, 16px);
    font-weight: 700;
    line-height: 1;
}
.modujang-v2-mypage.friend-v2-page .head__tab.other.friend-v2-tabs button:first-child {
    border-radius: clamp(13px, 4.1vw, 20px) 0 0 clamp(13px, 4.1vw, 20px);
}
.modujang-v2-mypage.friend-v2-page .head__tab.other.friend-v2-tabs button:nth-child(2) {
    border-right: 1px solid #f5e6c6;
    border-radius: 0 clamp(13px, 4.1vw, 20px) clamp(13px, 4.1vw, 20px) 0;
}
.modujang-v2-mypage.friend-v2-page .head__tab.other.friend-v2-tabs .btn-common01 {
    border-bottom-color: var(--brown-900);
    background: #fff;
    color: var(--brown-900);
}
.modujang-v2-mypage.friend-v2-page .head__tab.other.friend-v2-tabs .friend-v2-tab-badge {
    position: absolute;
    top: clamp(4px, 1.28vw, 7px);
    right: clamp(6px, 2.05vw, 10px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: clamp(15px, 4.36vw, 19px);
    height: clamp(15px, 4.36vw, 19px);
    padding: 0 clamp(3px, 1.03vw, 5px);
    border-radius: 999px;
    background: #ff3b30;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .18);
    color: #fff;
    font-family: "Maplestory", sans-serif;
    font-size: clamp(9px, 2.56vw, 11px);
    font-weight: 700;
    line-height: 1;
}
.modujang-v2-mypage.friend-v2-page .head__tab.other.friend-v2-tabs .friend-v2-tab-badge[hidden] {
    display: none;
}
.friend-v2-tab-leaf {
    position: absolute;
    bottom: clamp(-12px, -2.56vw, -8px);
    z-index: 3;
    width: clamp(27px, 8.46vw, 40px);
    pointer-events: none;
}
.friend-v2-tab-leaf-left { left: clamp(-12px, -2.56vw, -8px); }
.friend-v2-tab-leaf-right { right: clamp(-12px, -2.56vw, -8px); }
.friend-v2-card {
    position: relative;
    z-index: 1;
    height: calc(
        100dvh
        - var(--v2-header-height)
        - clamp(12px, 3.08vw, 18px)
        - clamp(42px, 10.77vw, 52px)
        - clamp(12px, 3.08vw, 18px)
        - clamp(82px, 22.82vw, 98px)
    );
    min-height: 500px;
    /* 탭과 카드가 3~5px 로 붙어 있어 탭의 아래 둥근 모서리와 잎사귀가 카드에 가려졌다.
       소식 화면(탭 → 카드 12~18px)과 같은 간격을 둔다 (QA #16) */
    margin-top: clamp(12px, 3.08vw, 18px);
    padding: clamp(5px, 1.54vw, 8px);
    border-radius: clamp(22px, 6.15vw, 30px);
    background: #fff;
}
.friend-v2-card-inner {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    padding: clamp(18px, 5.13vw, 24px) clamp(17px, 5.13vw, 24px) clamp(18px, 5.64vw, 26px);
    border: 0; /* 이중선 제거 (QA #65 재요청) */
    border-radius: clamp(20px, 5.64vw, 28px);
    background: var(--blue-100);
}
.modujang-v2-mypage.friend-v2-page .search-wrap {
    flex: 0 0 auto;
    height: clamp(50px, 13.08vw, 56px);
    border: 1px solid #e4e9ef;
    border-radius: clamp(14px, 4.1vw, 19px);
    background: #fff;
    box-shadow: 0 2px 8px rgba(45, 92, 121, .03);
}
.modujang-v2-mypage.friend-v2-page .search-wrap input {
    padding: 0 clamp(48px, 13.33vw, 60px) 0 clamp(16px, 5.13vw, 24px);
    color: var(--gray-900);
    font-size: clamp(14px, 4.1vw, 17px);
    font-weight: 500;
}
.modujang-v2-mypage.friend-v2-page .search-wrap input::placeholder {
    color: #a1a6ad;
    font-size: inherit;
    font-weight: 500;
}
.modujang-v2-mypage.friend-v2-page .search-wrap button {
    top: 50%;
    right: clamp(6px, 2.05vw, 10px);
    width: clamp(38px, 10.26vw, 46px);
    height: clamp(38px, 10.26vw, 46px);
    transform: translateY(-50%);
}
.modujang-v2-mypage.friend-v2-page .search-wrap img {
    width: clamp(18px, 5.13vw, 23px);
    opacity: .72;
}
.modujang-v2-mypage.friend-v2-page .top__items {
    flex: 0 0 auto;
    margin: clamp(12px, 3.08vw, 16px) 0 0;
}
.modujang-v2-mypage.friend-v2-page .top__items p,
.modujang-v2-mypage.friend-v2-page .top__items p span {
    color: #30343a;
    font-size: clamp(14px, 3.85vw, 17px);
    font-weight: 700;
}
.modujang-v2-mypage.friend-v2-page .top__items b {
    color: var(--blue-700);
    font-size: inherit;
}
.modujang-v2-mypage.friend-v2-page .btn-sorting {
    gap: clamp(4px, 1.28vw, 6px);
    padding-right: 0;
    color: #777;
}
.modujang-v2-mypage.friend-v2-page .btn-sorting span {
    color: #777;
    font-size: clamp(12px, 3.33vw, 14px);
    font-weight: 600;
}
.modujang-v2-mypage.friend-v2-page .btn-sorting img {
    width: auto;
    height: clamp(6px, 1.79vw, 8px);
}
.modujang-v2-mypage.friend-v2-page .personbox-wrap {
    flex: 1 1 auto;
    height: auto !important;
    min-height: 0;
    margin-top: clamp(10px, 2.56vw, 13px);
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: none;
}
.modujang-v2-mypage.friend-v2-page .personbox-wrap::-webkit-scrollbar { display: none; }
.modujang-v2-mypage.friend-v2-page .no-data {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #333;
    text-align: center;
    transform: translateY(-4px);
}
.friend-v2-empty-image {
    width: clamp(82px, 23.33vw, 100px);
    height: auto;
    margin-bottom: clamp(18px, 5.13vw, 23px);
}
.modujang-v2-mypage.friend-v2-page .no-data .friend-v2-empty-title {
    color: #333;
    font-size: clamp(16px, 4.62vw, 19px);
    font-weight: 800;
    line-height: 1.35;
}
.modujang-v2-mypage.friend-v2-page .no-data .friend-v2-empty-copy {
    margin-top: clamp(7px, 2.56vw, 11px);
    color: #7b7f86;
    font-size: clamp(13px, 3.85vw, 16px);
    font-weight: 500;
    line-height: 1.45;
}
.modujang-v2-mypage.friend-v2-page .personbox {
    padding: clamp(12px, 3.59vw, 16px);
    border-color: #c9dceb;
}
.modujang-v2-mypage.friend-v2-page .foot_btn {
    flex: 0 0 auto;
    width: 100%;
    margin-top: clamp(12px, 3.59vw, 16px);
    padding: 0;
}
.modujang-v2-mypage.friend-v2-page .foot_btn > * {
    height: clamp(46px, 11.54vw, 50px);
    border-radius: clamp(13px, 4.1vw, 18px);
    font-size: clamp(17px, 4.62vw, 20px);
}

.modujang-v2-mypage .dim-layer .dimBg,
.modujang-v2-support .dim-layer .dimBg { background: rgba(0,0,0,.66); }
.modujang-v2-mypage .dim-layer .pop-layer,
.modujang-v2-support .dim-layer .pop-layer { width: min(calc(100% - 40px),360px); border: 0; border-radius: 20px; background: #f1f7fa; overflow: hidden; }
.modujang-v2-mypage .dim-layer .pop_title,
.modujang-v2-support .dim-layer .pop_title { min-height: 50px; border: 0; background: #e7f4fb; }
.modujang-v2-mypage .dim-layer .pop-conts,
.modujang-v2-mypage .dim-layer .pop_in,
.modujang-v2-support .dim-layer .pop-conts,
.modujang-v2-support .dim-layer .pop_in { padding: 18px; }
.modujang-v2-mypage .dim-layer input.textfield01 { width: 100%; height: 50px; border: 1px solid #d8dee7; border-radius: 14px; }

/* 친구 추가 팝업은 inc_pop.php에서 페이지 래퍼 바깥에 렌더링된다. */
.friend_add_pop {
    padding: 16px;
}
.friend_add_pop .dimBg {
    background: rgba(8, 29, 48, .64);
    backdrop-filter: blur(2px);
}
.friend_add_pop .pop-layer {
    width: min(calc(100% - 32px), 360px);
    max-width: none;
    max-height: calc(100dvh - 32px);
    border: 1px solid #b9d8f1;
    border-radius: 22px;
    background: #f5faff;
    box-shadow: 0 18px 50px rgba(8, 46, 82, .28);
    overflow: hidden;
}
.friend_add_pop .pop-container {
    width: 100%;
    padding: 0;
    background: transparent;
}
.friend_add_pop .pop_title {
    display: flex;
    position: relative;
    align-items: center;
    min-height: 58px;
    padding: 0 58px 0 20px;
    border-bottom: 1px solid #cfe4f5;
    background: #e7f4ff;
}
.friend_add_pop .pop_title h2 {
    margin: 0;
    color: #173c5c;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
    text-align: left;
}
.friend_add_pop .pop_title .btn_close {
    position: absolute;
    top: 11px;
    right: 13px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: transparent;
}
.friend_add_pop .pop_title .btn_close img {
    width: 17px;
    height: 17px;
    object-fit: contain;
}
.friend_add_pop .pop-conts {
    max-height: calc(100dvh - 92px);
    padding: 22px 20px 20px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.friend_add_pop .pop_memo {
    padding: 0;
    text-align: left;
}
.friend_add_pop .pop_memo h5 {
    margin: 0;
    color: #223f57;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
}
.friend_add_pop .search_wrap {
    display: flex;
    position: relative;
    align-items: center;
    width: 100%;
    height: 52px;
    margin-top: 12px;
    border: 1px solid #bed6e9;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 3px 10px rgba(42, 93, 136, .06);
    overflow: hidden;
}
.friend_add_pop .search_wrap input.textfield01 {
    width: 100%;
    height: 100%;
    padding: 0 50px 0 15px;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: transparent;
    color: #1f3446;
    font-size: 15px;
}
.friend_add_pop .search_wrap input.textfield01::placeholder {
    color: #9aa8b4;
}
.friend_add_pop .search_wrap:focus-within {
    border-color: #1680ed;
    box-shadow: 0 0 0 3px rgba(22, 128, 237, .12);
}
/* 돋보기가 입력칸 위쪽에 붙어 있었다. 세로 가운데로 맞춘다 (QA #33) */
.friend_add_pop .search_wrap .btn-search {
    display: flex;
    position: absolute;
    top: 50%;
    right: 3px;
    transform: translateY(-50%);
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 0;
    background: transparent;
}
.friend_add_pop .search_wrap .btn-search img {
    width: 22px;
    height: 22px;
    object-fit: contain;
}
/* Vue mount 전에는 템플릿({{ }})이 노출되지 않도록 v-cloak 이 우선한다. */
.friend_add_pop #friend_add_list[v-cloak],
.friend_add_pop #friend_add_list.is-hidden {
    display: none !important;
}
.friend_add_pop #friend_add_list {
    display: block !important;
    width: 100%;
    max-height: min(38dvh, 300px);
    margin-top: 14px;
    padding: 0;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
}
.friend_add_pop #friend_add_list li {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 66px;
    margin-bottom: 8px;
    padding: 9px 10px;
    border: 1px solid #d8e8f4;
    border-radius: 14px;
    background: #fff;
    box-sizing: border-box;
}
.friend_add_pop #friend_add_list li:last-child {
    margin-bottom: 0;
}
.friend_add_pop #friend_add_list li.no-data2 {
    justify-content: center;
    min-height: 90px;
    padding: 24px 0;
    border: 0;
    background: transparent;
    color: #718393;
    text-align: center;
}
.friend_add_pop #friend_add_list li.no-data2 p {
    margin: 0;
    font-size: 14px;
}
.friend_add_pop #friend_add_list .thum {
    flex: 0 0 48px !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    border: 1px solid #d5e6f3;
    border-radius: 50%;
    background: #fff;
    box-sizing: border-box;
    overflow: hidden;
}
.friend_add_pop #friend_add_list .thum img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    object-fit: cover;
}
.friend_add_pop #friend_add_list .txt {
    min-width: 0;
    flex: 1;
}
.friend_add_pop #friend_add_list .txt p {
    margin: 0;
    overflow: hidden;
    color: #20394e;
    font-size: 14px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.friend_add_pop #friend_add_list .flex_btn {
    flex: 0 0 auto;
}
.friend_add_pop #friend_add_list .list_top_btn {
    min-width: 62px;
    height: 36px;
    padding: 0 12px;
    border: 1px solid #0f6dd5;
    border-radius: 11px;
    background: #147bf0;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    box-shadow: none;
}
.friend_add_pop #friend_add_list .list_top_btn[value="신청중"] {
    border-color: #c5d5e2;
    background: #e8f0f6;
    color: #657788;
}
.friend_add_pop .pop_btn {
    margin-top: 16px;
    padding: 0;
    border: 0;
}
.friend_add_pop .pop_btn .btn_close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 46px;
    padding: 0;
    border: 1px solid #b8d1e6;
    border-radius: 13px;
    background: #fff;
    color: #315a7b;
    font-size: 15px;
    font-weight: 700;
    box-shadow: none;
}

@media (max-height: 590px) {
    .friend_add_pop .pop_title {
        min-height: 52px;
    }
    .friend_add_pop .pop_title .btn_close {
        top: 8px;
    }
    .friend_add_pop .pop-conts {
        max-height: calc(100dvh - 84px);
        padding-top: 16px;
        padding-bottom: 16px;
    }
    .friend_add_pop #friend_add_list {
        max-height: 24dvh;
    }
}

/* 수락/거절 확인 팝업 (친구 페이지) */
.friend-confirm-open {
    overflow: hidden;
}
.modujang-v2-mypage .confirm_pop .dimBg {
    background: rgba(8, 29, 48, .72);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}
.modujang-v2-mypage .confirm_pop .pop-layer {
    width: min(calc(100% - 44px), 330px);
    border: 1px solid #b9d8f1;
    border-radius: 22px;
    background: #f5faff;
    box-shadow: 0 18px 50px rgba(8, 46, 82, .28);
    overflow: hidden;
}
.modujang-v2-mypage .confirm_pop .pop-container {
    width: 100%;
    padding: 0;
    background: transparent;
}
.modujang-v2-mypage .confirm_pop .pop_title {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 52px;
    border-bottom: 1px solid #cfe4f5;
    background: #e7f4ff;
}
.modujang-v2-mypage .confirm_pop .pop_title h2 {
    margin: 0;
    color: #173c5c;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
}
.modujang-v2-mypage .confirm_pop .pop_title .btn_close {
    position: absolute;
    top: 50%;
    right: 12px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    transform: translateY(-50%);
}
.modujang-v2-mypage .confirm_pop .pop_title .btn_close img {
    width: 15px;
    height: 15px;
    object-fit: contain;
}
.modujang-v2-mypage .confirm_pop .pop-conts {
    padding: 22px 20px 20px;
}
.modujang-v2-mypage .confirm_pop .friend-confirm-icon {
    display: grid;
    width: 58px;
    height: 58px;
    margin: 0 auto 14px;
    place-items: center;
    border: 1px solid #c8e0f4;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 5px 14px rgba(26, 91, 145, .12);
}
.modujang-v2-mypage .confirm_pop .friend-confirm-icon img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}
.modujang-v2-mypage .confirm_pop .pop_memo {
    padding: 0;
    text-align: center;
}
.modujang-v2-mypage .confirm_pop .pop_memo .confirm-message {
    margin: 0;
    color: #223f57;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
}
.modujang-v2-mypage .confirm_pop .confirm-description {
    margin: 6px 0 0;
    color: #71869a;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
}
.modujang-v2-mypage .confirm_pop .pop_btn.pop_btn2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 22px;
    padding: 0;
    border: 0;
}
.modujang-v2-mypage .confirm_pop .pop_btn.pop_btn2 > * {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 46px;
    min-width: 0;
    padding: 0;
    border-radius: 13px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
    cursor: pointer;
}
.modujang-v2-mypage .confirm_pop .pop_btn.pop_btn2 .btn_close {
    border: 1px solid #b8d1e6;
    background: #fff;
    color: #315a7b;
}
.modujang-v2-mypage .confirm_pop .pop_btn.pop_btn2 .confirm_ok_btn {
    border: 0;
    background: var(--blue-600, #0672ff);
    color: #fff;
    -webkit-appearance: none;
    appearance: none;
}

/* 닉네임 변경 / 비밀번호 변경: 하단에서 올라오는 시트 팝업 */
.nick_change_pop,
.pass_change_pop { align-items: flex-end; }
.nick_change_pop .pop-layer,
.pass_change_pop .pop-layer {
    top: auto;
    bottom: 0;
    left: 50%;
    width: min(100%, 767px);
    max-width: none;
    padding: 18px 20px calc(24px + env(safe-area-inset-bottom));
    border-radius: 16px 16px 0 0;
    background: #f4f8fc;
    transform: translate(-50%, 0);
    animation: v2SheetSlideUp .3s cubic-bezier(.22, .61, .36, 1);
}
@keyframes v2SheetSlideUp {
    from { transform: translate(-50%, 100%); }
    to { transform: translate(-50%, 0); }
}
.nick_change_pop .pop-container,
.pass_change_pop .pop-container { padding: 0; background: transparent; }
.nick_change_pop .pop_title,
.pass_change_pop .pop_title {
    display: block;
    position: relative;
    min-height: 0;
    margin-bottom: 25px;
    padding: 0;
    background: transparent;
    text-align: center;
}
.nick_change_pop .pop_title h2,
.pass_change_pop .pop_title h2 { color: #222; font-size: 18px; font-weight: 600; }
.nick_change_pop .pop_title .btn_close,
.pass_change_pop .pop_title .btn_close {
    position: absolute;
    top: -2px;
    right: 0;
    width: 30px;
    height: 30px;
}
.nick_change_pop .pop_title .btn_close img,
.pass_change_pop .pop_title .btn_close img { width: 24px; height: 24px; }
.nick_change_pop .pop-conts,
.pass_change_pop .pop-conts,
.pass_change_pop .pop_memo { padding: 0; text-align: left; }
.nick_change_pop input.textfield01,
.pass_change_pop input.textfield01 {
    width: 100%;
    height: 50px;
    padding: 0 16px;
    border: 1px solid #e8edf3;
    border-radius: 14px;
    background: #fff;
    font-size: 16px;
}
.nick_change_pop .info_text,
.nick_change_pop .join_error,
.pass_change_pop .join_error { margin-top: 8px; font-size: 12px; line-height: 1.5; }
.nick_change_pop .btn-common01,
.nick_change_pop input.common_btn,
.pass_change_pop .btn-common01 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 50px;
    margin-top: 16px;
    border-radius: 14px;
}
.pass_change_pop .emt30 { display: none; }

.modujang-v2-support .faq-list,
.modujang-v2-support .contact-list,
.modujang-v2-support .contact-card,
/* 타이틀 이미지가 없는 약관형 페이지(개인정보처리방침)의 글자 제목. 이용약관의 타이틀 이미지 자리와 맞춘다 */
.support-v2-terms-title { margin: 0 0 14px; text-align: center; font-family: "Maplestory", sans-serif; font-weight: 700; font-size: 20px; line-height: 1.3; color: #1d3f63; }
.support-v2-terms-body { overflow: hidden; border: 1px solid #bfd4e7; border-radius: 16px; background: #fff; }
.modujang-v2-support .faq-item { border-bottom: 1px solid #e4e9ef; }
.modujang-v2-support .faq-item:last-child { border-bottom: 0; }
.modujang-v2-support .faq-q { display: flex; align-items: center; justify-content: space-between; min-height: 54px; padding: 0 16px; cursor: pointer; }
.modujang-v2-support .faq-q span { font-size: 14px; font-weight: 600; }
.modujang-v2-support .faq-q b { margin-right: 7px; color: #0672ff; }
.modujang-v2-support .faq-arrow { width: 12px; }
.modujang-v2-support .faq-a { padding: 14px 16px; background: #f1f7fa; color: #59616c; font-size: 13px; line-height: 1.65; }
.modujang-v2-support .alarm__msg { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; padding: 11px 13px; border-radius: 13px; background: #e8f5fc; color: #3d596d; font-size: 12px; }
.modujang-v2-support .alarm__msg img { width: 24px; }
.modujang-v2-support .contact-list { display: flex; flex-direction: column; }
.modujang-v2-support .contact-card { display: flex; width: 100%; margin: 0; padding: 16px; border-width: 0 0 1px; border-radius: 0; color: #222; }
.modujang-v2-support .contact-card:last-child { border-bottom: 0; }
.modujang-v2-support .contact-card-info { min-width: 0; flex: 1; }
/* 문의 상세 오른쪽의 삭제·수정 버튼 묶음. 제목이 길면 이 묶음이 줄어들며 잘렸다 (QA #46).
   줄어들지 않게 고정하고 두 버튼을 가로로 나란히 둔다 */
.modujang-v2-support .contact-card-head > div:last-child { flex: 0 0 auto; }
.modujang-v2-support .contact-card-head .r { display: flex; align-items: center; gap: 6px; }
.modujang-v2-support .contact-card-head .r button { flex: 0 0 auto; width: 32px; height: 32px; padding: 0; border: 0; background: transparent; }
.modujang-v2-support .contact-card-head .r button img { width: 22px; height: 22px; object-fit: contain; }
.modujang-v2-support .contact-card h4 { font-size: 14px; line-height: 1.45; }
.modujang-v2-support .contact-card-meta { display: flex; gap: 7px; margin-top: 6px; color: #7d8590; font-size: 11px; }
.modujang-v2-support .contact-card-meta .ok { color: #16834a; }
.modujang-v2-support .contact-card-arrow img { width: 8px; }
.modujang-v2-support .contact-card-body { margin-top: 15px; padding-top: 15px; border-top: 1px solid #e4e9ef; font-size: 13px; line-height: 1.7; }
.modujang-v2-support .inquiry-v2-page .support-flow__notice {
    margin-bottom: 0;
    padding: 16px 20px;
    border: 1px solid #c2daf8;
    border-radius: 16px;
    background: #f1f7fa;
    box-shadow: 1px -2px 1px rgba(255,255,255,.1) inset, 1px 2px 1px rgba(255,255,255,.4) inset, -1px -1px 1px #c2daf8 inset;
}
.modujang-v2-support .inquiry-v2-page .support-flow__notice p {
    color: #0672ff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}
.modujang-v2-support .inquiry-v2-page .support-flow__inquiry-list {
    display: flex;
    margin-top: 14px;
    flex-direction: column;
    gap: 12px;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
}
.modujang-v2-support .inquiry-v2-page .support-flow__inquiry-card {
    display: block;
    position: relative;
    width: 100%;
    padding: 16px 42px 16px 20px;
    border: 1px solid #eee;
    border-radius: 16px;
    background: #fff;
    color: #222;
}
.modujang-v2-support .inquiry-v2-page .support-flow__inquiry-card::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 20px;
    width: 8px;
    height: 14px;
    background: url('/assets/img/icon-arrow-right2.png') center / 6px auto no-repeat;
    transform: translateY(-50%);
}
.modujang-v2-support .inquiry-v2-page .support-flow__inquiry-card strong {
    display: block;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
}
.modujang-v2-support .inquiry-v2-page .support-flow__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
}
.modujang-v2-support .inquiry-v2-page .support-flow__meta span {
    color: #767676;
    font-size: 12px;
    font-weight: 500;
}
.modujang-v2-support .inquiry-v2-page .support-flow__meta span + span {
    position: relative;
    padding-left: 8px;
}
.modujang-v2-support .inquiry-v2-page .support-flow__meta span + span::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 10px;
    background: #a9a9a9;
    transform: translateY(-50%);
}
.modujang-v2-support .inquiry-v2-page .support-flow__meta .ok { color: #16834a; }
.modujang-v2-support .inquiry-v2-page .support-flow__inquiry-list.is-empty { margin-top: 0; }
.modujang-v2-support .inquiry-v2-page .inquiry-v2-empty {
    min-height: 390px;
    flex-direction: column;
    border: 0;
    background: transparent;
    text-align: center;
}
.modujang-v2-support .inquiry-v2-page .inquiry-v2-empty img {
    width: 82px;
    height: 82px;
    margin-bottom: 14px;
    object-fit: contain;
}
.modujang-v2-support .inquiry-v2-page .inquiry-v2-empty strong {
    display: block;
    font-size: 16px;
    font-weight: 600;
}
.modujang-v2-support .inquiry-v2-page .inquiry-v2-empty p {
    margin-top: 7px;
    color: #767676;
    font-size: 13px;
    font-weight: 500;
}
.modujang-v2-support .inquiry-v2-page .foot_btn .support-flow__write-btn {
    height: 50px;
    margin-top: 0;
    font-size: 16px;
    font-weight: 700;
}
.modujang-v2-support .notice-v2-page .support-flow__notice-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.modujang-v2-support .notice-v2-page .support-flow__notice-card {
    display: block;
    position: relative;
    min-height: 72px;
    padding: 16px 42px 16px 20px;
    overflow: hidden;
    border: 1px solid #eee;
    border-radius: 16px;
    background: #fff;
    box-shadow: none;
}
.modujang-v2-support .notice-v2-page .support-flow__notice-card::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 20px;
    width: 8px;
    height: 14px;
    background: url('/assets/img/icon-arrow-right2.png') center / 8px auto no-repeat;
    transform: translateY(-50%);
}
.modujang-v2-support .notice-v2-page .support-flow__notice-card strong {
    display: block;
    color: #222;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
}
.modujang-v2-support .notice-v2-page .support-flow__notice-card span {
    display: block;
    margin-top: 4px;
    color: #767676;
    font-size: 12px;
    font-weight: 500;
}
.modujang-v2-support .notice-v2-page .support-flow__notice-list.is-empty {
    min-height: 480px;
    justify-content: center;
}
.modujang-v2-support .notice-v2-page .notice-v2-empty {
    flex-direction: column;
    text-align: center;
}
.modujang-v2-support .notice-v2-page .notice-v2-empty img {
    width: 82px;
    height: 82px;
    margin-bottom: 14px;
    object-fit: contain;
}
.modujang-v2-support .notice-v2-page .notice-v2-empty strong {
    font-size: 16px;
    font-weight: 600;
}
.modujang-v2-support .cscenter-v2-page .support-flow__faq-item {
    box-shadow: none;
}
.modujang-v2-support .cscenter-v2-page .support-flow__faq-answer {
    min-width: 0;
    flex: 1;
    color: #222;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
}
.modujang-v2-support .cscenter-v2-page .support-flow__faq-answer p {
    margin: 0;
    line-height: 1.5;
}
.modujang-v2-support .cscenter-v2-page .cscenter-v2-faq.is-empty {
    min-height: 480px;
    justify-content: center;
}
.modujang-v2-support .cscenter-v2-page .cscenter-v2-empty {
    flex-direction: column;
    text-align: center;
}
.modujang-v2-support .cscenter-v2-page .cscenter-v2-empty img {
    width: 82px;
    height: 82px;
    margin-bottom: 14px;
    object-fit: contain;
}
.modujang-v2-support .cscenter-v2-page .cscenter-v2-empty strong {
    font-size: 16px;
    font-weight: 600;
}
.modujang-v2-support .custom-select-trigger,
.modujang-v2-support input.textfield01,
.modujang-v2-support .upload-wrap { width: 100%; height: 52px; padding: 0 15px; border: 1px solid #d8dee7; border-radius: 14px; background: #fff; }
.modujang-v2-support .custom-select-wrap { position: relative; }
.modujang-v2-support .custom-options { z-index: 8; overflow: hidden; border: 1px solid #d8dee7; border-radius: 13px; background: #fff; }
.modujang-v2-support .custom-options li { padding: 11px 15px; }
.modujang-v2-support .textarea-wrap { border: 1px solid #d8dee7; border-radius: 14px; background: #fff; overflow: hidden; }
.modujang-v2-support .textarea-wrap textarea { width: 100%; min-height: 190px; padding: 15px; border: 0; resize: vertical; }
.modujang-v2-support .upload-wrap { display: flex; align-items: center; justify-content: space-between; }
.modujang-v2-support .upload-wrap img { width: 20px; }
.modujang-v2-support .manual_upload { position: absolute; opacity: 0; }
.modujang-v2-support .support-v2-terms-body { padding: 20px; font-size: 13px; line-height: 1.75; }
.modujang-v2-support .support-v2-terms-body h1,
.modujang-v2-support .support-v2-terms-body h2,
.modujang-v2-support .support-v2-terms-body h3 { margin: 16px 0 7px; font-size: 15px; }

@media(max-width:359px){
  .modujang-v2-mypage .page__mypage,.modujang-v2-mypage .page__outer,.modujang-v2-support .page__outer{padding:13px}
  .modujang-v2-mypage .personbox{padding:10px;gap:8px}.modujang-v2-mypage .personbox>img{width:40px;height:40px}.modujang-v2-mypage .personbox-btn{flex-direction:column}
}
/* 문의 상세: 카드(.contact-card)가 flex 컨테이너라 이 래퍼가 내용 폭(367px)만큼 커져 카드(353px) 밖으로 넘쳤다.
   카드 폭 안에 가두고, 제목은 flex:1 로 줄어들게 해 오른쪽 버튼이 잘리지 않게 한다 (QA #46) */
.modujang-v2-support .contact-card-detail { flex: 1 1 auto; min-width: 0; width: 100%; }
/* 내정보 메뉴 '친구관리' 옆 친구요청 수 배지 (QA #34). 보관함 탭 배지(.storage-tab-badge)와 같은 모양.
   style.css 의 `.mypage-flow__menu-item b`(쿠폰·포인트 큰 숫자, 24px) 가 이 배지에도 걸려 원 안에 숫자가 넘쳤다.
   그 규칙보다 구체적으로(b.mypage-friend-badge) 써서 이긴다 */
.modujang-v2-mypage .mypage-flow__menu-item { position: relative; }
.mypage-flow__menu-item b.mypage-friend-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    margin-left: 6px;
    padding: 0 5px;
    border: 1px solid #fff;
    border-radius: 999px;
    background: #ff3b30;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    color: #fff;
    font-family: var(--font-pretendard);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    vertical-align: middle;
    transform: translateY(-1px);
}
.mypage-flow__menu-item b.mypage-friend-badge[hidden] { display: none; }
/* 자주묻는질문 '확률 안내' 표 (QA #77). 답변 본문(DB)에 .faq-prob 마크업으로 들어간다 */
.faq-prob { margin: 10px 0 4px; padding: 16px 12px 12px; border-radius: 16px; background: linear-gradient(180deg, #eaf6ff 0%, #f6fbff 100%); border: 1px solid #cfe4f5; }
.faq-prob__head { text-align: center; margin-bottom: 10px; }
.faq-prob__head img { width: 40px; height: 40px; object-fit: contain; display: block; margin: 0 auto 4px; }
.faq-prob__head strong { display: block; color: #173c5c; font-size: 18px; font-weight: 800; }
.faq-prob__head span { display: block; color: #5f7a93; font-size: 12px; margin-top: 2px; }
.faq-prob__legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 12px; margin: 8px 0 10px; color: #26384b; font-size: 12px; font-weight: 700; }
.faq-prob__legend i { display: inline-block; width: 12px; height: 12px; margin-right: 5px; border-radius: 3px; vertical-align: -1px; }
.faq-prob .c1 { background: #c9955a; } .faq-prob .c2 { background: #9aa3ab; } .faq-prob .c3 { background: #e2b53a; }
.faq-prob__scroll { overflow-x: auto; border-radius: 12px; background: #fff; }
.faq-prob table { width: 100%; min-width: 300px; border-collapse: collapse; font-size: 12.5px; }
.faq-prob thead th { padding: 10px 6px; color: #fff; font-weight: 800; text-align: center; background: #5b6672; }
.faq-prob thead th:first-child { text-align: left; padding-left: 12px; }
.faq-prob tbody th { padding: 9px 6px 9px 12px; text-align: left; color: #26384b; font-weight: 700; white-space: nowrap; }
.faq-prob tbody td { padding: 9px 6px; text-align: center; color: #26384b; white-space: nowrap; }
.faq-prob tbody tr { border-top: 1px solid #edf2f7; }
.faq-prob tbody tr:nth-child(even) { background: #f6f9fc; }
.faq-prob td.hi { color: #1a6cff; font-weight: 700; }
.faq-prob td.na { color: #b8c2cc; }
.faq-prob__note { margin: 12px 2px 0; padding: 10px 12px; border: 1px dashed #e0b96a; border-radius: 10px; background: #fff8e6; color: #6b4a12; font-size: 12px; line-height: 1.55; }
/* 답변 칸이 'A.' 들여쓰기와 카드 여백 때문에 240px 남짓이라 표가 넘쳤다.
   표 블록만 카드 폭(약 300px) 전체로 펼치고 글자를 줄여 가로 스크롤 없이 들어가게 한다 */
.support-flow__faq-answer .faq-prob { margin-left: -38px; margin-right: -20px; width: calc(100% + 58px); padding: 14px 8px 10px; border-radius: 0; border-left: 0; border-right: 0; }
.faq-prob table { min-width: 0; font-size: 11px; table-layout: fixed; }
.faq-prob thead th, .faq-prob tbody td { padding: 8px 2px; white-space: nowrap; }
.faq-prob thead th:first-child, .faq-prob tbody th { padding-left: 8px; width: 38%; white-space: normal; font-size: 11px; line-height: 1.3; }
.faq-prob__legend { font-size: 11px; gap: 4px 8px; }
/* 답변 영역의 전역 글자 크기 규칙(td/th)이 더 세서 표 숫자가 커졌다. 우선순위를 높여 고정 */
.support-flow__faq-answer .faq-prob table th,
.support-flow__faq-answer .faq-prob table td { font-size: 11px !important; line-height: 1.3 !important; letter-spacing: -.2px; }
.support-flow__faq-answer .faq-prob thead th { font-size: 11.5px !important; }
.support-flow__faq-answer .faq-prob tbody th { width: 36%; }
/* 약관형 본문(이용약관·개인정보처리방침)의 목록·표. 문구 렌더러(md_light_to_html)가 만드는 ul/li/table 을 본문 글자 크기에 맞춘다 (QA #113 #114) */
.modujang-v2-support .support-v2-terms-body ul { margin: 6px 0 10px; padding-left: 18px; list-style: disc; }
.modujang-v2-support .support-v2-terms-body li { font-size: 13px; line-height: 1.75; }
.modujang-v2-support .support-v2-terms-body blockquote { margin: 6px 0; padding: 8px 12px; border-left: 3px solid #bfd4e7; background: #f4f8fc; }
.modujang-v2-support .support-v2-terms-body .md-table { width: 100%; margin: 8px 0 12px; border-collapse: collapse; font-size: 12px; line-height: 1.5; }
.modujang-v2-support .support-v2-terms-body .md-table th,
.modujang-v2-support .support-v2-terms-body .md-table td { padding: 7px 8px; border: 1px solid #d5e3f0; text-align: left; vertical-align: top; word-break: keep-all; }
.modujang-v2-support .support-v2-terms-body .md-table th { background: #eef4fa; font-weight: 700; white-space: nowrap; }