@charset "UTF-8";
/* ═══════════════════════════════════════════════
 * ARGO 회원 스킨 — 통합 스타일 (레이아웃 argo.layout.css 와 같은 색 톤)
 * 로그인 · 회원가입 · 계정찾기 · 정보수정 · 비밀번호 · 탈퇴
 * 서비스 본체와 같은 하늘(#17223b)·초록(#2f6fed) 팔레트를 씁니다.
 * ═══════════════════════════════════════════════ */

:root{
    /* ARGO 공용 색 (레이아웃 argo.layout.css 와 같은 톤) */
    --g-primary:#2f6fed;          /* 아르고 포인트색 */
    --g-primary-dark:#2560d8;
    --g-primary-soft:#eef3ff;
    --g-accent:#17223b;           /* 좌측메뉴와 같은 진한 남색 */
    --g-accent-dark:#0f1930;
    --g-accent-soft:#f4f6fa;
    --g-bg:#f5f6fa;
    --g-card:#fff;
    --g-text:#1f2937;
    --g-muted:#8b93a7;
    --g-line:#e5e8ef;
    --g-danger:#c53a3a;
    --g-warn:#a35d00;
}




.gm *{box-sizing:border-box;}
.gm{font-family:'Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;color:var(--g-text);
    -webkit-text-size-adjust:100%;}
.gm button, .gm a[class*="gm-btn"], .gm label{
    touch-action:manipulation;-webkit-tap-highlight-color:transparent;}

/* ═══ 인증 페이지 (로그인 / 가입 / 계정찾기) ═══
 * 로고가 하늘색·초록 두 가지를 쓰므로 배경은 거의 흰색으로 비워둔다.
 * 색을 깔면 로고가 묻힌다. 아주 옅은 물빛만 남겨 깊이감을 준다. */
.gm-auth{min-height:100dvh;display:flex;align-items:center;justify-content:center;
    padding:32px 20px;position:relative;overflow:hidden;
    background:linear-gradient(170deg,#fbfdfe 0%,#f2f8fb 55%,#eef7f1 100%);}

.gm-auth::before,.gm-auth::after{content:'';position:absolute;border-radius:50%;
    filter:blur(80px);opacity:.32;pointer-events:none;}
.gm-auth::before{width:400px;height:400px;background:#17223b;top:-160px;left:-150px;}
.gm-auth::after{width:440px;height:440px;background:#2f6fed;bottom:-200px;right:-160px;}

.gm-card{position:relative;z-index:1;width:100%;max-width:400px;background:var(--g-card);
    border-radius:22px;padding:38px 30px 30px;
    box-shadow:0 20px 50px rgba(78,154,51,.13),0 2px 8px rgba(0,0,0,.04);
    animation:gmUp .5s cubic-bezier(.22,1,.36,1) both;}
@keyframes gmUp{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}

/* ═══ 로고 ═══ */
.gm-logo-img{display:block;height:42px;width:auto;max-width:82%;margin:0 auto;}
.gm-sub{text-align:center;font-size:14px;color:var(--g-muted);margin:20px 0 26px;line-height:1.6;}

/* ═══ 폼 ═══ */
.gm-form{display:flex;flex-direction:column;gap:11px;}
.gm-field{display:flex;flex-direction:column;gap:6px;}
.gm-label{font-size:13px;font-weight:700;color:#3b4a40;}
.gm-label .req{color:var(--g-danger);}

.gm-input{width:100%;padding:14px 16px !important;border:1px solid var(--g-line) !important;border-radius:12px !important;
    font-size:15px !important;font-family:inherit !important;background:#fbfcfe !important;color:var(--g-text) !important;
    outline:none !important;transition:border-color .15s,box-shadow .15s,background .15s !important;}
.gm-input::placeholder{color:#a3b0a7;}
.gm-input:focus{border-color:var(--g-primary);background:#fff;
    box-shadow:0 0 0 3px rgba(104,189,70,.13);}
.gm-input:disabled,.gm-input.disabled{background:#f1f3f1;color:var(--g-muted);cursor:not-allowed;}
textarea.gm-input{resize:vertical;line-height:1.6;min-height:90px;}
select.gm-input{appearance:none;
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237b8a7f' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 14px center;background-size:18px;padding-right:42px;}
.gm-hint{font-size:12px;color:var(--g-muted);line-height:1.5;margin:0;}

/* 옵션 줄 (로그인 유지 / 비밀번호 찾기) */
.gm-options{display:flex;align-items:center;justify-content:space-between;margin:3px 0 4px;}
.gm-check{display:flex;align-items:center;gap:8px;font-size:13px;color:#4b5567;cursor:pointer;}
.gm-check input{position:absolute;opacity:0;width:0;height:0;}
.gm-check .box{width:19px;height:19px;border:1.5px solid var(--g-line);border-radius:6px;
    background:#fff;display:inline-flex;align-items:center;justify-content:center;transition:.15s;}
.gm-check .box::after{content:'';width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;
    transform:rotate(45deg) scale(0);transition:transform .15s;margin-top:-2px;}
.gm-check input:checked + .box{background:var(--g-primary);border-color:var(--g-primary);}
.gm-check input:checked + .box::after{transform:rotate(45deg) scale(1);}

/* ═══ 버튼 ═══ */
.gm-btn{display:inline-flex;align-items:center;justify-content:center;
    width:100%;padding:15px;border:none;border-radius:12px;
    font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;
    text-decoration:none;transition:background .15s,transform .06s;}
.gm-btn:active{transform:scale(.985);}
.gm-btn.primary{background:#92342b;color:#fff;
    }
.gm-btn.primary:hover{background:var(--g-primary-dark);}
.gm-btn.primary:disabled{background:#a8c9b6;box-shadow:none;cursor:not-allowed;}
.gm-btn.ghost{background:#eef3f2;color:#4b5567;}
.gm-btn.danger{background:#fef2f2;color:var(--g-danger);}
.gm-btn.sm{width:auto;padding:12px 20px;font-size:14px;}

.gm-actions{display:flex;gap:10px;margin-top:20px;}

/* ═══ 하단 링크 ═══ */
.gm-alt{text-align:center;font-size:13px;color:var(--g-muted);margin-top:24px;
    padding-top:20px;border-top:1px solid #eef1f6;}
.gm-link{color:#92342b;font-weight:700;text-decoration:none;}
.gm-link:hover{text-decoration:underline;}
.gm-alt .gm-link{margin-left:6px;}
.gm-alt.split{display:flex;justify-content:center;gap:22px;}

/* ═══ 알림 ═══ */
.gm-alert{display:flex;gap:9px;align-items:flex-start;padding:12px 14px;border-radius:11px;
    font-size:13px;line-height:1.6;margin-bottom:16px;}
.gm-alert.error{background:#fef2f2;color:#b42318;}
.gm-alert.info,.gm-alert{background:#fff7ec;color:var(--g-warn);}
.gm-alert.success{background:var(--g-primary-soft);color:var(--g-primary-dark);}

/* ═══════════════════════════════════════════════
 * 내부 페이지 (정보수정 · 비밀번호 · 탈퇴 · 계정관리)
 * ═══════════════════════════════════════════════ */
.gm-page{max-width:560px;margin:0 auto;min-height:100dvh;background:var(--g-bg);padding-bottom:40px;}

/* 헤더는 흰 배경 — 색을 깔면 로고가 묻힌다 */
.gm-head{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:8px;
    padding:13px 14px;background:#fff;color:var(--g-text);border-bottom:1px solid var(--g-line);}
.gm-head .back{color:#4b5567;text-decoration:none;font-size:26px;line-height:1;width:32px;
    display:inline-flex;align-items:center;}
.gm-head h2{flex:1;margin:0;font-size:16px;font-weight:700;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gm-head .spacer{width:32px;}

.gm-panel{background:#fff;border-radius:16px;margin:16px;padding:22px 20px;
    box-shadow:0 1px 3px rgba(0,0,0,.05);}
.gm-panel-desc{font-size:14px;color:var(--g-muted);line-height:1.65;margin:0 0 20px;}
.gm-panel h3{margin:0 0 4px;font-size:17px;font-weight:800;}

/* 프로필 사진 */
.gm-photo{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:24px;}
.gm-photo-wrap{position:relative;width:96px;height:96px;}
.gm-photo-wrap img{width:96px;height:96px;border-radius:50%;object-fit:cover;
    background:var(--g-primary-soft);border:3px solid #fff;box-shadow:0 3px 12px rgba(0,0,0,.1);}
.gm-photo-cam{position:absolute;right:-2px;bottom:-2px;width:32px;height:32px;border-radius:50%;
    background:var(--g-primary);color:#fff;display:flex;align-items:center;justify-content:center;
    font-size:14px;cursor:pointer;border:2px solid #fff;}
.gm-photo-label{font-size:13px;color:var(--g-primary);font-weight:700;cursor:pointer;}

/* 정보 목록 */
.gm-list{list-style:none;padding:0;margin:0;}
.gm-list li{display:flex;justify-content:space-between;gap:14px;align-items:center;
    padding:14px 0;border-bottom:1px solid #eef1f6;font-size:14px;}
.gm-list li:last-child{border-bottom:none;}
.gm-list .k{color:var(--g-muted);flex:0 0 auto;}
.gm-list .v{font-weight:700;text-align:right;word-break:break-all;}

/* 이동 링크 목록 */
.gm-nav{background:#fff;border-radius:16px;margin:0 16px 16px;overflow:hidden;
    box-shadow:0 1px 3px rgba(0,0,0,.05);}
.gm-nav a{display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:17px 20px;border-bottom:1px solid #eef1f6;text-decoration:none;color:var(--g-text);
    font-size:15px;}
.gm-nav a:last-child{border-bottom:none;}
.gm-nav a:active{background:#f7f9fc;}
.gm-nav a .arrow{color:#c3cfc7;font-size:18px;}
.gm-nav a.danger{color:var(--g-danger);}

/* XE 가 만들어내는 입력 태그를 감싸는 영역 */
.gm-dynamic input[type="text"],
.gm-dynamic input[type="email"],
.gm-dynamic input[type="tel"],
.gm-dynamic input[type="number"],
.gm-dynamic input[type="date"],
.gm-dynamic input[type="password"],
.gm-dynamic select,
.gm-dynamic textarea{
    width:100%;padding:14px 16px;border:1px solid var(--g-line);border-radius:12px;
    font-size:15px;font-family:inherit;background:#fbfcfe;color:var(--g-text);outline:none;}
.gm-dynamic input:focus,.gm-dynamic select:focus,.gm-dynamic textarea:focus{
    border-color:var(--g-primary);background:#fff;box-shadow:0 0 0 3px rgba(104,189,70,.13);}
.gm-dynamic label{display:inline-flex;align-items:center;gap:6px;font-size:14px;margin-right:14px;}
.gm-dynamic ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px;}

/* ═══ 안내 문구 페이지 (로그아웃 · 인증메일 등) ═══ */
.gm-msg{text-align:center;padding:10px 0 4px;}
.gm-msg .ico{font-size:46px;margin-bottom:12px;}
.gm-msg h3{margin:0 0 8px;font-size:19px;font-weight:800;}
.gm-msg p{margin:0 0 22px;font-size:14px;color:var(--g-muted);line-height:1.7;}

@media (max-width:400px){
    .gm-card{padding:30px 22px 24px;border-radius:18px;}
    .gm-logo-img{height:36px;}
}

/* ===== ARGO 로고 (레이아웃 헤더와 같은 톤) ===== */
.gm-logo{
    text-align:center;font-size:34px;font-weight:800;letter-spacing:-.03em;
    color:#111827;margin-bottom:6px;line-height:1.1;
}
.gm-logo em{color:var(--g-primary);font-style:normal;}