.main_btn 	{ margin:4px;background-color:#fff;  border: 1px solid #d9d9d9; font-size:11pt; color:#444; width:84px; height:84px;border-radius:10px;word-break: keep-all;cursor: pointer; }
@font-face 	{ font-family: 'Noto Serif'; src: url('https://fonts.googleapis.com/css2?family=Noto+Serif&display=swap&wght=600'); }
.counter 		{ font-size: 23pt; font-family: 'Noto Serif', serif; font-weight: 600; }
.counter_text 	{ font-size:8.5pt; color:#999; font-weight: 300; } 

.bugo_make_box {
  width: 270px;
  height: 50px;
  background-color: #fdfdfd;
  border-radius: 10px; /* 모서리의 둥근 정도 */
  border: 1px solid #ddd; /* 1px 두께의 단색 테두리, 색상은 #ddd */
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1); /* 그림자 효과 */
  font-size:17px;
  cursor: pointer;
  /* --- 텍스트 중앙 정렬을 위한 코드 추가 --- */
  display: flex;
  justify-content: center;
  align-items: center;

}


.divide_line {
  width: 50px;          /* 가로 길이 100px */
  border: 0;             /* 브라우저 기본 테두리 제거 */
  border-top: 2px solid #eee; /* 위쪽 테두리를 선으로 사용 */
  margin: 20px auto;     /* 위아래 여백 및 좌우 중앙 정렬 */
}



/* [1] 버튼들을 가로로 배치할 컨테이너 (총 너비 270px 고정) */
.btn-row {
    width: 270px;
    display: flex;             /* 가로 배치 핵심 */
    justify-content: space-between; /* 양쪽 끝으로 벌림 */
    gap: 8px;                 /* 버튼 사이 간격 10px */
    margin: 0 auto;            /* 중앙 정렬 */
}

/* [2] 절반 크기 버튼 스타일 (기존 디자인 상속) */
.half_box {
    /* 너비 계산: (270px - 10px간격) / 2 = 130px */
    width: 130px;              
    height: 43px;
    background-color: #fdfdfd;
    border-radius: 10px;       /* 둥근 모서리 유지 */
    border: 1px solid #ddd;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    
    font-size: 14px;           /* 칸이 좁아지니 글씨 살짝 줄임 */
    color: #666;
    font-weight: 500;
    cursor: pointer;
    
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;                  /* 아이콘과 글자 사이 간격 */
    transition: 0.2s;          /* 눌렀을 때 부드럽게 */
}

/* (선택) 눌렀을 때 효과 */
.half_box:active {
    background-color: #f0f0f0;
    transform: scale(0.98);
}



/* [수정됨] 레이어 팝업 스타일 */
    .find-overlay { 
        /* ▼▼▼ 여기가 핵심입니다 (무조건 none이어야 함) ▼▼▼ */
        display: none;  
        
        position: fixed; top: 0; left: 0; width: 100%; height: 100%; 
        background: rgba(0,0,0,0.6); z-index: 9999; 
        
        /* 아래 속성들은 JS가 display:flex로 바꿨을 때 작동합니다 */
        align-items: center; 
        justify-content: center; 
        backdrop-filter: blur(3px);
    }

    .find-box { 
        background: #fff; 
        box-sizing: border-box; /* 패딩 포함 크기 계산 */
        width: 90%;             /* 모바일 좌우 여백 확보 */
        max-width: 320px; 
        margin: 0 auto;         
        border-radius: 12px; 
        padding: 40px 27px; 
        text-align: center; 
        position: relative; 
        box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    }

    .find-input { 
        box-sizing: border-box; /* 입력창도 패딩 포함 */
        width: 100%; 
        padding: 14px; 
        border: 1px solid #ddd; 
        border-radius: 10px; 
        margin-top: 5px; margin-bottom: 15px; 
        font-size: 15px; outline: none;
        background: #f9f9f9;
    }

    /* placeholder(안내 문구) 색상 변경 */
    .find-input::placeholder {
        color: #aaaaaa; /* 원하는 회색 톤으로 조절 (기본보다 연하게: #bbb, #ccc) */
        opacity: 1;     /* 파이어폭스 등 일부 브라우저 투명도 이슈 해결 */
    }
    .find-input:focus { border-color: #2C3E50; background: #fff; }

/* 상주 본인 인증 팝업 전용 스타일 (인라인 스타일 분리) */
.sj-auth-close-wrap {
    position: absolute; 
    top: 15px; 
    right: 20px;
}

.sj-auth-close-icon {
    font-size: 24px; 
    cursor: pointer; 
    color: #bbb;
}

.sj-auth-title {
    margin: 0 0 25px 0; 
    color: #2C3E50; 
    font-size: 18px; 
    font-weight: 500;
}

.sj-auth-btn {
    width: 100%; 
    padding: 16px; 
    background: #2C3E50; 
    color: #fff; 
    border: none; 
    border-radius: 10px; 
    font-weight: 600; 
    font-size: 16px; 
    cursor: pointer; 
    margin-top: 10px;
}