@charset "utf-8";
/* 이미지 페이지 게시판 스킨 (theme/sample38/skin/board/img_page) */

/* 페이지 이미지 : 가로 최대 730px · 가운데 정렬 (작은 이미지는 원본 크기), 화면이 좁으면 맞춰 줄어듦 */
#img_page {max-width:1200px; margin:0 auto; padding:60px 0 120px} /* 좌우 여백은 부모 요소에 있음 */
#img_page .ip_imgs img {display:block; width:auto; max-width:min(100%, 730px); height:auto; margin:0 auto}
#img_page .ip_files {display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:30px}
#img_page .ip_files a {padding:10px 16px; border:1px solid #ddd; border-radius:4px; font-size:14px; color:#333}
#img_page .ip_empty {padding:100px 0; font-size:15px; color:#999; text-align:center}

/* 버튼 */
.ip_btn {display:inline-block; padding:9px 16px; border:1px solid #ddd; border-radius:4px; background-color:#fff; font-family:inherit; font-size:13px; line-height:1.4; color:#333; text-align:center; vertical-align:middle; box-sizing:border-box; cursor:pointer} /* line-height 직접 : a 와 button 크기 같게 */
.ip_btn:hover {background-color:#f5f5f5}
.ip_btn_dark {border-color:#222; background-color:#222; color:#fff}
.ip_btn_dark:hover {background-color:#000}

/* 관리 바 (글쓰기 권한자만) */
#img_page .ip_admin {margin-bottom:30px; padding:16px 20px; border:1px dashed #ccc; border-radius:6px; background-color:#fafafa}
#img_page .ip_admin_txt {margin:0; font-size:14px; color:#555}
#img_page .ip_admin_txt b {color:#111}
#img_page .ip_admin_btn {display:flex; flex-wrap:wrap; gap:6px; margin-top:12px}
#img_page .ip_badge {display:inline-block; margin-left:6px; padding:2px 8px; border-radius:3px; background-color:#173f8a; font-size:12px; color:#fff}
#img_page .ip_badge_gray {background-color:#999}
#img_page .ip_history {display:none; margin-top:16px}
#img_page .ip_history table {width:100%; border-collapse:collapse; border-top:2px solid #222; background-color:#fff; font-size:13px; text-align:center}
#img_page .ip_history th {padding:10px 6px; border-bottom:1px solid #ddd; font-weight:600}
#img_page .ip_history td {padding:10px 6px; border-bottom:1px solid #eee; color:#555}
#img_page .ip_history tr.on td {background-color:#f2f5fb}
#img_page .ip_history .ip_tl {text-align:left}
#img_page .ip_history td a {margin:0 3px; color:#333; text-decoration:underline; text-underline-offset:.2em}
#img_page .ip_history td a.ip_show_link {font-weight:700; color:#173f8a} /* [표시] : 이 글을 바로 표시 */
#img_page .ip_empty_row {padding:30px 0}
#img_page .ip_help {margin:10px 0 0; font-size:12px; color:#777}

/* 등록 / 수정 */
#img_page_write {max-width:800px; margin:0 auto; padding:60px 0 120px} /* 좌우 여백은 부모 요소에 있음 */
#img_page_write .ip_guide {margin:0 0 24px; padding:14px 18px; border-radius:6px; background-color:#f5f7fa; font-size:13px; color:#555}
#img_page_write .ip_row {display:flex; align-items:flex-start; gap:16px; padding:12px 0; border-bottom:1px solid #eee}
#img_page_write .ip_row > label, #img_page_write .ip_label {flex-shrink:0; width:90px; padding-top:10px; font-size:14px; font-weight:600; color:#111}
#img_page_write .ip_row .frm_input {flex:1; width:100%; padding:10px 12px; border:1px solid #ddd; border-radius:4px; font-size:14px; box-sizing:border-box}
#img_page_write .ip_check {flex:1; padding-top:10px}
#img_page_write .ip_check label {display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:600; color:#111; cursor:pointer}
#img_page_write .ip_check p {margin:6px 0 0; font-size:12px; color:#777}
#img_page_write .ip_file_box {flex:1; display:flex; flex-direction:column; gap:6px; padding-top:6px}
#img_page_write .ip_file_now {margin:0; font-size:12px; color:#777}
#img_page_write .ip_file_now span {display:block; margin-top:2px; color:#999}
#img_page_write .ip_write_btn {display:flex; justify-content:center; gap:8px; margin-top:30px}

@media screen and (max-width:768px) {
	#img_page {padding:24px 0 50px} /* 모바일 좌우 여백은 부모 요소에 있음 */
	#img_page .ip_admin {margin-bottom:20px}
	#img_page .ip_history {overflow-x:auto}
	#img_page .ip_history table {min-width:520px}
	#img_page_write {padding:24px 0 50px}
	#img_page_write .ip_row {flex-direction:column; gap:6px}
	#img_page_write .ip_row > label, #img_page_write .ip_label {width:auto; padding-top:0}
}
