﻿/* =========================================================
   [1] 로그인 폼 (#loginForm)
========================================================= */
#loginForm {
    font-family: '나눔고딕', NanumGothic, NG, '돋움', Dotum, Arial, Helvetica, sans-serif;
    max-width: 420px;
    margin: 30px auto 100px;
    border: 1px solid #ddd;
}
#loginForm .form-wrapper { background: #fff; padding: 13px 12px 16px 12px; }
#loginForm .form-heading {
    text-align: center;
    padding: 16px 0;
    font-size: 19px;
    font-weight: 600;
    margin: 0;
    background: #000;
    color: #fff;
}
#loginForm .form-signin { margin: 0 auto; }
#loginForm .form-signin table { border: 0; }
#loginForm .form-signin table td { border: 0; padding: 0; vertical-align: middle; }
#loginForm .form-signin table td input {
    position: relative;
    font-size: 14px;
    height: auto;
    padding: 8px 10px;
    margin: 6px 0;
}
#loginForm .form-signin table td input[type=password] { font-family: initial !important; }
#loginForm .form-signin table td.input { padding-right: 13px; }
#loginForm .form-signin table td.ico { width: 50px; }
#loginForm .form-signin table td.ico i { padding: 2px 0 0 17px; font-size: 21px; }

#loginForm .form-signin .auto-login { text-align: right; }
#loginForm .form-signin .auto-login-description { margin-top: 10px; padding: 0 24px; }
#loginForm .form-signin .submit-btn {
    margin: 12px auto 14px auto;
    padding: 11px 0;
    font-size: 15px;
    width: 370px;
    max-width: 100%;
}
#loginForm .form-signin .signin-buttom { font-size: 14px; text-align: center; }
#loginForm .form-signin .signin-buttom a { color: #333; vertical-align: middle; display: inline-block; margin: 2px 0; }
#loginForm .form-signin .signin-buttom span.bar { display: inline-block; margin: 0 9px; vertical-align: middle; }

/* =========================================================
   [2] 회원가입 폼 (#joinForm)
========================================================= */
#joinForm {
    background: #fff;
    padding: 12px 21px;
    margin: 0 auto;
    max-width: 1170px;
}
#joinForm h4 { margin: 12px 0; padding: 0 4px; }

/* 약관 공통 박스 */
#joinForm .form-terms {
    margin: 10px 0 20px 0 !important;
    border: 1px solid #ddd;
    padding: 21px 21px 15px 21px;
}
#joinForm .form-terms .terms-title { font-size: 16px; font-weight: 600; margin-bottom: 10px; }

/* 기존 가입 약관 스크롤 영역 */
#joinForm .form-terms .terms-content {
    margin: 12px 0;
    background: #eee;
    padding: 21px;
    max-height: 170px;
    overflow: auto;
}

/* 신규 상세 약관 스크롤 영역 (이용약관, 개인정보) */
#joinForm .form-terms .terms-content-detail {
    margin: 12px 0;
    height: 250px;
    overflow-y: scroll;
    border: 1px solid #ddd;
    padding: 20px;
    background: #fafafa;
    font-size: 14px; /* 가독성을 위한 폰트 사이즈 */
    color: #555;
    line-height: 1.8; /* 읽기 편한 행간 */
    letter-spacing: -0.5px; /* 깔끔한 자간 */
    word-break: keep-all;
}

/* 공통 체크박스 라벨 */
#joinForm .terms-check label { font-size: 15px; font-weight: 600; color: #333; cursor: pointer; }
#joinForm .terms-check input[type="checkbox"] { width: 16px; height: 16px; vertical-align: middle; margin-top: -2px; }

/* 우측 정렬 체크박스 (신규 약관용) */
#joinForm .form-terms .terms-check-right { margin-top: 10px; text-align: right; }
#joinForm .form-terms .terms-check-right label { font-weight: normal; }

/* 모두 동의 영역 */
#joinForm .terms-agree-all {
    margin: 20px 0 10px 0;
    padding: 18px 20px;
    border: 1px solid #ddd;
    background-color: #fcfcfc;
    font-size: 16px;
}
#joinForm .terms-agree-all label { margin-bottom: 0; cursor: pointer; font-weight: 600; color: #333; display: flex; align-items: center; }
#joinForm .terms-agree-all input[type="checkbox"] { width: 20px; height: 20px; margin: 0 10px 0 0; cursor: pointer; }

/* 자동가입 방지 (캡차) */
#joinForm .form-wrapper .form-CaptchaM { display: inline-flex; justify-content: center; align-items: center; width: 100%; padding: 15px; }
#joinForm .form-wrapper .form-CaptchaM .form-CaptchaL { padding: 5px; }
#joinForm .form-wrapper .form-CaptchaM .form-CaptchaL .replceCaptchaBT { text-decoration: none; color: inherit; }
#joinForm .form-wrapper .form-CaptchaM .form-CaptchaL .replceCaptchaBT h5 { margin: 0; padding: 10px; cursor: pointer; font-size: 15px; color: #000; font-weight: bold; }

/* =========================================================
   [3] 회원정보, 아이디/비번 찾기, 처리결과 등
========================================================= */
#memberInfoForm, #findForm, #deleteIDForm, #renewResult {
    background: #fff;
    padding: 12px 21px;
    margin: 0 auto;
    max-width: 1170px;
}
#memberInfoForm h4, #findForm h4 { margin: 12px 0; padding: 0 4px; }
#findForm .txt { font-size: 15px; padding-top: 5px; margin-bottom: 24px; }
#findForm button { height: 34px; }
#renewResult { margin: 12px auto; font-size: 14px; line-height: 160%; }

/* =========================================================
   [4] 회원 탈퇴 폼 (#deleteIDForm)
========================================================= */
#deleteIDForm .form-heading {
    text-align: center;
    padding: 16px 0;
    font-size: 19px;
    font-weight: 600;
    margin: 110px 0 0 0;
    background: #000;
    color: #fff;
}
#deleteIDForm .form-signin { margin: 0 auto; }
#deleteIDForm .form-signin table { border: 0; }
#deleteIDForm .form-signin table td { border: 0; padding: 0; vertical-align: middle; }
#deleteIDForm .form-signin table td input { position: relative; font-size: 14px; height: auto; padding: 8px 10px; margin: 6px 0; }
#deleteIDForm .form-signin table td input[type=password] { font-family: initial !important; }
#deleteIDForm .form-signin table td.input { padding-right: 13px; }
#deleteIDForm .form-signin table td.ico { width: 50px; }
#deleteIDForm .form-signin table td.ico i { padding: 2px 0 0 17px; font-size: 21px; }

#deleteIDForm .form-signin .auto-login { text-align: right; }
#deleteIDForm .form-signin .auto-login-description { margin-top: 10px; padding: 0 24px; }
#deleteIDForm .form-signin .submit-btn { margin: 12px auto 14px auto; padding: 11px 0; font-size: 15px; width: 370px; max-width: 100%; }
#deleteIDForm .form-signin .signin-buttom { text-align: center; }
#deleteIDForm .form-signin .signin-buttom a { color: #333; vertical-align: middle; display: inline-block; margin: 2px 0; }
#deleteIDForm .form-signin .signin-buttom span.bar { display: inline-block; margin: 0 9px; vertical-align: middle; }

/* =========================================================
   [5] 반응형 미디어 쿼리
========================================================= */
@media(max-width:991px) {
    #loginForm .form-heading { font-size: 16px; }
    #loginForm .form-signin table td.ico { display: none; }
    #loginForm .form-signin .submit-btn { font-size: 13px; }
}

/* =========================================================
   [6] 약관 및 정책 전문 보기 공통 스타일 (조회 페이지 전용)
========================================================= */
.policy-container {
    max-width: 900px;
    margin: 0 auto;
    padding: 10vw 2vw 2vw;
    font-family: 'Malgun Gothic', '맑은 고딕', sans-serif;
    color: #333;
}
.policy-title {
    font-size: 28px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 40px;
    border-bottom: 2px solid #222;
    padding-bottom: 15px;
}
.policy-section {
    background: #fafafa;
    padding: 40px;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
}
.policy-content {
    font-size: 15px;
    line-height: 1.8;
    letter-spacing: -0.5px;
    color: #444;
    word-break: keep-all;
}

/* 인라인 스타일 대체용 공통 클래스 */
.chapter-title {
    font-size: 1.1em;
    font-weight: bold;
    color: #222;
}
.highlight {
    color: #0054FF;
    font-weight: bold;
}
.cctv-info {
    padding-left: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
    background-color: #fff;
    padding: 10px;
}