@charset "utf-8";
/* ============================================================
   기획전 상세(board/event/read) 다크 리디자인 — v260813
   대상: /board/event/read?no=*
   * 공지사항 상세와 동일한 다크(블랙+시안) 톤
   * 기존 마크업/클래스/JS/페이징은 그대로, 스킨만 오버라이드
   * 본 파일은 event/read.jsp head 에서만 로드됨
   ============================================================ */

/* ---------- 전체 배경: 블랙 ---------- */
body { background:#000 !important; }
#wrap { background:#000 !important; }
.programCon.programCon_custom01 { background:#000 !important; }
.programCon.programCon_custom01 .inner { max-width:100%; box-sizing:border-box; }

/* ---------- Back 버튼: 알약형 그라디언트 ---------- */
.programCon_custom01 .prd_tab_wrapper { border-bottom:none !important; }
.programCon_custom01 .prd_tab_wrapper .prd_back_btn01 {
	display:inline-flex; align-items:center; gap:8px;
	padding:10px 26px;
	background:linear-gradient(90deg,#07223D,#0B1829) !important;
	border:none !important;
	outline:1px solid #25517C; outline-offset:-1px;
	border-radius:30px !important;
	color:#fff !important; font-size:14px; font-weight:700; line-height:1;
	transition:box-shadow .2s ease, outline-color .2s ease;
}
.programCon_custom01 .prd_tab_wrapper .prd_back_btn01:hover {
	outline-color:#00B8FC; box-shadow:0 0 14px rgba(13,170,252,.35);
}
/* [260813] Back 화살표 — 공지사항과 동일하게 순흰색 처리 (사용자 요청) */
.programCon_custom01 .prd_tab_wrapper .prd_back_btn01 img {
	filter: brightness(0) invert(1);
	width: 8px; height: auto;
}

/* ---------- 제목 히어로 박스 ---------- */
.programCon_custom01 .recruitment_detail_top_box {
	position:relative;
	background:radial-gradient(ellipse at 0% 0%, #0A2942 0%, rgba(10,41,67,.14) 72%) !important;
	border:1px solid #00B8FC !important;
	border-left:3px solid #00B8FC !important;
	border-radius:10px !important;
	padding:52px 40px !important;
	min-height:120px;
	box-sizing:border-box;
	display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;
	margin-bottom:30px;
	overflow:hidden;
}
.programCon_custom01 .recruitment_detail_top_box .recruitment_tit,
.programCon_custom01 .recruitment_detail_top_box .recruitment_tit .title_value {
	color:#fff !important;
}
.programCon_custom01 .recruitment_detail_top_box .recruitment_tit {
	margin:0; word-break:keep-all; line-height:1.25;
}
.programCon_custom01 .recruitment_detail_top_box .recruitment_tit .title_value {
	font-size:44px !important; font-weight:800 !important; letter-spacing:-.01em;
}
.programCon_custom01 .recruitment_detail_top_box .category_path { color:#8fbfe0 !important; }

/* 기간/상태 알약 — 시안 톤(날짜 #9FD2F5) */
.programCon_custom01 .event-period-info {
	background:rgba(8,22,40,.55) !important;
	border:1px solid rgba(13,170,252,.28) !important;
	margin-top:16px !important;
}
.programCon_custom01 .event-period-info .label { color:#9FD2F5 !important; }
.programCon_custom01 .event-period-info .value { color:#cfe7fb !important; }

/* ---------- 본문 카드 ---------- */
.programCon_custom01 .readEdit {
	background:radial-gradient(ellipse at 0% 0%, #101B27 0%, #0E141C 62%) !important;
	border:1px solid #16324B !important;
	border-radius:10px;
	padding:34px 34px;
	color:#d5dee6;
	overflow:hidden;
	box-sizing:border-box;
}
.programCon_custom01 .readEdit .content_value { color:#d5dee6; }
/* 본문 이미지 넘침 방지 */
.programCon_custom01 .readEdit img,
.programCon_custom01 .readEdit table { max-width:100% !important; height:auto; }
.programCon_custom01 .readEdit iframe { max-width:100%; }

/* 첨부파일 / 관련URL */
.programCon_custom01 .urlFile {
	margin-top:20px; padding-top:18px;
	border-top:1px solid rgba(255,255,255,.08);
}
.programCon_custom01 .urlFile p { color:#a9c6de; }
.programCon_custom01 .urlFile a { color:#00B8FC; }

/* 답변 영역 */
.programCon_custom01 .readAnswer {
	margin-top:20px; padding:22px 24px;
	background:#0E141C; border:1px solid #16324B; border-radius:10px;
}
.programCon_custom01 .readAnswer .answer_tit { color:#9FD2F5; font-weight:700; }
.programCon_custom01 .readAnswer .answer_txt { color:#d5dee6; }

/* ---------- 하단 주변 글 목록 ---------- */
/* 작성자('관리자') 컬럼 숨김 — 마크업 유지, 표시만 제거 */
.programCon_custom01 .read_page_list .noticeListFlexBox .date_box.order3 { display:none !important; }

.programCon_custom01 .read_page_list { margin-top:34px; }
.programCon_custom01 .read_page_list .recruitment_table01 {
	display:flex; flex-direction:column; gap:12px; border:none !important;
}
.programCon_custom01 .read_page_list .noticeListFlexBox {
	background:linear-gradient(90deg,#0B1B30 0%,#0A1220 60%) !important;
	border:1px solid #16324B !important; border-radius:8px;
	transition:border-color .2s ease, transform .2s ease;
}
.programCon_custom01 .read_page_list .noticeListFlexBox:hover {
	border-color:#00B8FC !important; transform:translateX(2px);
}
.programCon_custom01 .read_page_list .noticeListFlexBox .title_value { color:#fff; font-weight:600; }
.programCon_custom01 .read_page_list .noticeListFlexBox .date_box span { color:#8ea3b5; }
.programCon_custom01 .read_page_list .noticeListFlexBox.current {
	background:linear-gradient(90deg,#10263F 0%,#0A1220 60%) !important;
	border-color:rgba(13,170,252,.55) !important;
}
.programCon_custom01 .read_page_list .noticeListFlexBox.current .title_value { color:#00B8FC; }

/* ---------- 이전글/다음글(Type1) 버튼 ---------- */
.programCon_custom01 .ejun_daum_box { gap:12px; }
.programCon_custom01 .ejun_daum_box .pag_bt {
	background:linear-gradient(100deg,#0C1E31,#14314B) !important;
	border:1px solid #16324B !important; border-radius:8px;
	transition:border-color .2s ease;
}
.programCon_custom01 .ejun_daum_box .pag_bt:hover { border-color:#00B8FC !important; }
.programCon_custom01 .ejun_daum_box .pag_bt a,
.programCon_custom01 .ejun_daum_box .pag_txt,
.programCon_custom01 .ejun_daum_box .pag_yo span { color:#d5dee6 !important; }

/* ---------- 목록 버튼 ---------- */
/* [260813] 공지사항과 동일 스펙으로 통일 (328x52, r5) — 사용자 요청 */
.programCon_custom01 .mok_rok_btn { display:flex; justify-content:flex-end; margin-top:24px; }
.programCon_custom01 .mok_rok_btn .btn {
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	width:328px; max-width:100%; height:52px; padding:0 20px;
	background:linear-gradient(90deg,#07223D,#0B1829) !important;
	border:none !important; outline:1px solid #25517C; outline-offset:-1px;
	border-radius:5px !important;
	color:#fff !important; font-size:16px; font-weight:700; letter-spacing:.02em;
	white-space:nowrap; text-decoration:none; cursor:pointer;
	transition:box-shadow .25s ease, outline-color .25s ease, transform .2s ease;
}
.programCon_custom01 .mok_rok_btn .btn strong { font-weight:700; color:inherit; }
.programCon_custom01 .mok_rok_btn .btn:hover { outline-color:#00B8FC; box-shadow:0 0 14px rgba(13,170,252,.35); }
.programCon_custom01 .mok_rok_btn .btn:active { transform:scale(.98); }

/* ---------- 관련상품/추천상품 카드 다크 통일 ---------- */
/* JSP 내 인라인 <style>(단일 클래스)를 상위 스코프(.programCon_custom01)로 오버라이드.
   event 상세 페이지에만 적용되어 다른 페이지 상품카드에는 영향 없음. */
.programCon_custom01 .event_related_card {
	background:radial-gradient(ellipse at 0% 0%, #101B27 0%, #0E141C 62%) !important;
	border:1px solid #16324B !important;
	border-radius:10px !important;
	color:#e8ecf6 !important;
	transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease !important;
}
.programCon_custom01 .event_related_card:hover {
	border-color:#00B8FC !important;
	box-shadow:0 6px 18px rgba(0,0,0,.45), 0 0 12px rgba(13,170,252,.22) !important;
	transform:translateY(-3px) !important;
}
/* 썸네일 영역: 밝은 회색 배경 제거 → 다크 */
.programCon_custom01 .event_related_thumb {
	background:#0B121B !important;
}
/* NO IMAGE 플레이스홀더(밝은 회색 PNG)만 어둡게 blend — 실제 상품사진은 영향 없음 */
.programCon_custom01 .event_related_thumb img[src*="no_image"] {
	opacity:.16 !important;
}
/* 상품명: 밝게 */
.programCon_custom01 .event_related_name { color:#e8ecf6 !important; }
/* 정가: 취소선 회색 */
.programCon_custom01 .event_related_price_orig { color:#888 !important; }
/* 할인율/할인가: 강조 */
.programCon_custom01 .event_related_rate { color:#00B8FC !important; }
.programCon_custom01 .event_related_final { color:#ffffff !important; }

/* ---------- 반응형 ---------- */
@media (max-width:768px){
	.programCon_custom01 .recruitment_detail_top_box { padding:30px 18px !important; min-height:80px; }
	.programCon_custom01 .recruitment_detail_top_box .recruitment_tit .title_value { font-size:24px !important; }
	.programCon_custom01 .readEdit { padding:20px 16px; }
	.programCon_custom01 .mok_rok_btn .btn { padding:12px 40px; }
}


/* [260813] 서포터즈 상세 흰선 제거 (사용자 지적) — 타이틀 밑줄(흰색) + 댓글 위 구분선(#EEE) */
.programRead .recruitment_tit { border-bottom-color: #16324B !important; }
.read_rego.custom, .read_rego { border-top-color: #16324B !important; }

/* [260813] 서포터즈 상세 제목박스 — 줄 간격 축소 + 본문 폭 통일 (사용자 요청) */
.programCon_custom01 .recruitment_detail_top_box {
	padding-top: 28px !important;
	padding-bottom: 28px !important;
}
.programCon_custom01 .recruitment_tit { padding-bottom: 12px !important; }
.programCon_custom01 .blog_ment002 { margin: 0 !important; }
.programCon_custom01 .blog_icon_box02 { margin: 10px 0 !important; }
.programCon_custom01 .blog_hash_box:empty { display: none; }
.programCon_custom01 .recruitment_alt { margin-top: 8px !important; }
/* 본문(readEdit 1112px)을 제목박스(1152px)와 동일 폭으로 */
.programCon_custom01 .readEdit { width: 100% !important; max-width: none !important; margin: 0 !important; }