@charset "UTF-8"; /* ======================================== 인증(auth) 컨텐츠 CSS ======================================== */ /* 브랜드 타이틀 */ .auth-brand-title {color: #2d8659;font-weight: 700;letter-spacing: 0.03125rem;text-shadow: 0 0.125rem 0.25rem rgba(45,134,89,0.3);} /* 브랜드 아이콘 */ .auth-brand-icon {color: #1f9d7a;filter: drop-shadow(0 0.125rem 0.1875rem rgba(31,157,122,0.3));} /* 메인 버튼 */ .btn-main {background-color: var(--copwok-header-color, #2d8659) !important;border-color: var(--copwok-header-color, #2d8659) !important;color: #ffffff !important;font-weight: 700 !important;letter-spacing: 0.03125rem;box-shadow: 0 0.375rem 1.25rem rgba(0,0,0,0.3), 0 0.1875rem 0.625rem rgba(0,0,0,0.2) !important;transition: all 0.3s cubic-bezier(0.4,0,0.2,1);} .btn-main:hover {background-color: #1f5f3f !important;border-color: #1f5f3f !important;color: #ffffff !important;box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.4), 0 0.25rem 0.75rem rgba(0,0,0,0.3) !important;transform: none;} .btn-main:active {transform: none;} .btn-main:focus {box-shadow: 0 0 0 0.2rem rgba(45,134,89,0.25);outline: 0;} /* Auth 주요 버튼 */ .auth-btn-primary {background-color: var(--copwok-header-color, #2d8659) !important;border-color: var(--copwok-header-color, #2d8659) !important;color: #ffffff !important;font-weight: 700 !important;letter-spacing: 0.03125rem;box-shadow: 0 0.375rem 1.25rem rgba(0,0,0,0.3), 0 0.1875rem 0.625rem rgba(0,0,0,0.2) !important;transition: all 0.3s cubic-bezier(0.4,0,0.2,1);} .auth-btn-primary:hover {background-color: #1f5f3f !important;border-color: #1f5f3f !important;color: #ffffff !important;box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.4), 0 0.25rem 0.75rem rgba(0,0,0,0.3) !important;transform: none;} .auth-btn-primary:active {transform: none;} .auth-btn-primary:focus {box-shadow: 0 0 0 0.2rem rgba(45,134,89,0.25);outline: 0;} /* 인증번호 6자리 입력 박스 (아이폰 스타일) */ .auth-code-container {display: flex !important;flex-direction: row !important;justify-content: center !important;align-items: center !important;gap: 0.75rem !important;list-style: none !important;padding: 0 !important;margin: 1.5rem auto 1rem !important;max-width: 26.25rem !important;} .auth-code-container li {flex: 0 0 auto !important;display: inline-block !important;} .auth-code-input {display: block !important;width: 3.25rem !important;height: 3.75rem !important;padding: 0 !important;font-size: 2rem !important;font-weight: 600 !important;text-align: center !important;color: #333 !important;border: 0.125rem solid #e0e0e0 !important;border-radius: 0.75rem !important;background-color: #ffffff !important;transition: all 0.2s ease !important;caret-color: #2d8659 !important;} .auth-code-input:focus {border-color: #2d8659 !important;background-color: #f0f8ff !important;box-shadow: 0 0 0 0.1875rem rgba(45,134,89,0.15) !important;outline: none !important;transform: none !important;} .auth-code-input.is-invalid {border-color: #dc3545 !important;background-color: #fff5f5 !important;} /* 모바일 대응 */ @media (max-width: 576px) { .auth-code-container {gap: 0.5rem !important;max-width: 100% !important;} .auth-code-input {width: 2.75rem !important;height: 3.25rem !important;font-size: 1.625rem !important;} } @media (max-width: 400px) { .auth-code-container {gap: 0.375rem !important;} .auth-code-input {width: 2.5rem !important;height: 3rem !important;font-size: 1.5rem !important;} } /* 비밀번호 토글 아이콘 */ .auth-password-toggle {right: 0.9375rem;top: 50%;transform: translateY(-50%);cursor: pointer;} /* 섹션 카드 헤더 */ .auth-section-header {background-color: #fafafa;padding: 0.75rem 1rem;border-bottom: 0.0625rem solid #e9ecef;} /* 섹션 아이콘 */ .auth-section-icon {color: #2d8659;} /* 약관 스크롤 박스 */ .auth-terms-box {height: 150px;overflow-y: auto;background-color: #f8f9fa;font-size: 0.875rem;} /* 파일 업로드 버튼 */ .auth-file-btn {cursor: pointer;} /* 이미지 미리보기 */ .auth-preview-img {max-height: 12.5rem;max-width: 100%;} /* 이미지 삭제 버튼 */ .auth-remove-img {top: -0.5rem;right: -0.5rem;width: 1.75rem;height: 1.75rem;padding: 0;line-height: 1;} /* 완료 체크 아이콘 */ .auth-success-icon {font-size: 5rem;color: #2d8659;} /* 완료 메시지 박스 */ .auth-success-alert {background-color: #f0f8f5;border-color: #2d8659;}