@charset "utf-8";
/* ============================================================
   교회114 신청폼 리뉴얼 (chruchRequest.php 디자인 개선)
   기존 마크업 유지 + 스타일 오버라이드
   브랜드 색상: 청록 #389cbe
   ============================================================ */

:root {
    --teal:      #389cbe;
    --teal-dark: #2b7d99;
    --teal-light:#e8f4f8;
    --gray-100:  #f3f4f6;
    --gray-200:  #e8eaed;
    --gray-400:  #9ca3af;
    --gray-600:  #5f6368;
    --gray-800:  #202124;
    --red:       #e74c3c;
}

/* 컨테이너 */
.request_cont {
    max-width:760px !important;
    margin:24px auto 60px !important;
    padding:0 16px;
}

/* 섹션 제목 */
.request_cont > h1,
.request_cont form > h1 {
    color:var(--gray-800) !important;
    font-size:20px !important;
    font-weight:700 !important;
    padding:24px 4px 12px !important;
    margin-top:16px;
    border-bottom:2px solid var(--teal);
    display:flex !important;
    align-items:center;
    gap:8px;
}
.request_cont > h1::before,
.request_cont form > h1::before {
    content:'';
    width:4px; height:18px;
    background:var(--teal);
    border-radius:2px;
}

/* 상단 안내 타이틀 */
.sub_title h1 {
    font-size:26px !important;
    font-weight:700 !important;
    color:var(--gray-800) !important;
    border-bottom:none !important;
    padding:24px 0 8px !important;
}
.sub_title .info_txt {
    font-size:14px !important;
    color:var(--gray-600) !important;
    line-height:1.7 !important;
    background:var(--teal-light);
    border-radius:10px;
    padding:14px 18px !important;
    margin:12px 0;
}

/* 폼 리스트 → 카드형 */
.request_view {
    margin:16px 0 !important;
    border:1px solid var(--gray-200) !important;
    border-radius:12px;
    overflow:hidden;
    background:#fff;
}
.request_view dt {
    padding:16px 20px 8px !important;
    border-top:1px solid var(--gray-100) !important;
    color:var(--gray-800) !important;
    font-size:14px !important;
    font-weight:600 !important;
    background:#fafbfc;
}
.request_view dt:first-child { border-top:none !important; }
.request_view dd {
    padding:8px 20px 18px !important;
    font-size:14px !important;
    color:var(--gray-600) !important;
    background:#fff;
}

/* 인풋 공통 */
.request_view input[type=text],
.request_view input[type=tel],
.request_view input[type=number],
.request_view select {
    height:42px;
    border:1.5px solid var(--gray-200) !important;
    border-radius:8px !important;
    padding:0 12px !important;
    font-size:14px;
    color:var(--gray-800);
    background:#fff;
    transition:border-color .2s, box-shadow .2s;
    outline:none;
    box-sizing:border-box;
    font-family:inherit;
}
.request_view input[type=text]:focus,
.request_view input[type=tel]:focus,
.request_view input[type=number]:focus,
.request_view select:focus {
    border-color:var(--teal) !important;
    box-shadow:0 0 0 3px rgba(56,156,190,.12);
}
.request_view .group_nm,
.request_view .inputText { width:100% !important; max-width:420px; }
.request_view .inputPost { width:150px !important; }
.request_view .inputAddress { width:100% !important; max-width:420px; margin-bottom:6px !important; }
.request_view .homeUrl { width:100% !important; max-width:420px; }
.request_view .exText { padding-top:6px !important; color:var(--gray-400) !important; font-size:12px; }

/* 우편번호 검색 버튼 */
.btn_input {
    height:42px; padding:0 16px;
    background:var(--gray-800); color:#fff;
    border:none; border-radius:8px;
    font-size:13px; cursor:pointer;
    margin-left:6px;
    vertical-align:middle;
    font-family:inherit;
}
.btn_input:hover { background:#000; }

/* 라디오/체크박스 → 칩 스타일 */
.request_view .inputRadio {
    display:flex !important;
    flex-wrap:wrap;
    gap:8px;
}
.request_view .inputRadio label {
    float:none !important;
    width:auto !important;
    padding:8px 14px !important;
    border:1.5px solid var(--gray-200);
    border-radius:20px;
    font-size:13px;
    color:var(--gray-600);
    cursor:pointer;
    transition:all .2s;
    display:inline-flex;
    align-items:center;
    margin:0 !important;
    user-select:none;
}
.request_view .inputRadio label:hover {
    border-color:var(--teal);
    color:var(--teal);
}
.request_view .inputRadio input { display:none; }
.request_view .inputRadio label:has(input:checked) {
    background:var(--teal-light);
    border-color:var(--teal);
    color:var(--teal-dark);
    font-weight:500;
}
.request_view .inputRadio label span.FL { float:none !important; }

/* 개인정보 동의 */
#agree { padding:24px 0 0 !important; }
#agree h1 {
    font-size:16px !important;
    color:var(--gray-800) !important;
    font-weight:600 !important;
    padding:0 4px 12px !important;
}
.agree_doc {
    border:1px solid var(--gray-200);
    border-radius:12px;
    padding:20px;
    background:#fff;
}
.agree_doc h2 {
    font-size:14px; font-weight:600;
    color:var(--gray-800);
    margin-bottom:10px;
}
.agree_doc .box {
    background:var(--gray-100);
    border-radius:8px;
    padding:14px;
    font-size:13px;
    line-height:1.6;
    color:var(--gray-600);
    margin-bottom:14px;
}
.agree_list li { font-size:13px; line-height:1.7; color:var(--gray-600); }
.agree_list strong { color:var(--gray-800); }
.agree_check {
    margin-top:16px;
    display:flex; gap:20px;
    padding:14px 18px;
    background:var(--teal-light);
    border-radius:10px;
}
.agree_check label { font-size:14px; color:var(--gray-800); cursor:pointer; }

/* 제출 버튼 */
.btn_area { margin-top:24px; }
.btn_area .btnC { text-align:center; }
.btn_area .btnTy1 {
    display:inline-block;
    width:100%; max-width:400px;
    height:52px; line-height:52px;
    background:var(--teal) !important;
    color:#fff !important;
    border-radius:10px;
    font-size:16px; font-weight:600;
    text-decoration:none;
    transition:background .2s;
}
.btn_area .btnTy1:hover { background:var(--teal-dark) !important; color:#fff !important; }

/* 모바일 */
@media (max-width:768px) {
    .request_cont { padding:0 12px; }
    .request_view .inputRadio label { font-size:12px; padding:7px 12px !important; }
    .request_view .group_nm,
    .request_view .inputText,
    .request_view .inputAddress,
    .request_view .homeUrl { max-width:100%; }
    .sub_title h1 { font-size:22px !important; }
    .agree_check { flex-direction:row; }
}
