@charset "utf-8";
/*
 * default.css - 대구개인택시조합 사이트 기본요소/공통 스타일시트
 *  - 리셋(margin/padding 초기화) + 폰트(Pretendard/Noto Sans) 설정
 *  - 폼 기본요소: input / select / textarea / button 공통 스타일
 *  - 색상 변수(:root --main-color 등) 및 PC/모바일 표시 토글(.pc/.mob)
 *  - 페이징, 공통 버튼(solid/line/gray 등), 게시판 공통(리스트/뷰/글쓰기/갤러리)
 *  - 유틸리티 클래스(마진/패딩/가로크기/정렬/배경색/글자색)
 *  - 로그인 박스 및 비밀번호 변경 모달
 *  - 데스크톱 기준, 모바일은 주로 @media(max-width:500px / 640px / 800px)에서 vw로 재정의
 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&family=Noto+Sans+KR:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');

@font-face {
	font-family: rixstraight-pro, sans-serif;
	font-style: normal;
	font-weight: 500;
}

/******************************  전체(리셋 + 기본 태그)  ******************************/
/* CSS 리셋 - 브라우저 기본 여백/테두리/폰트 초기화 */
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, sub, sup, var, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure,
header, hgroup, menu, nav, section, summary, time, mark, audio, video, textarea,button{margin:0;padding:0;border:0;font-size:100%;font-weight:normal;}
/* 기본 폰트(Pretendard 우선)와 기준 글자 크기 24px, 모바일 자동 확대 방지 */
body{width:100%;font-family:'Pretendard', Noto Sans KR, Nanum_BG, Nanum_BGB, NanumBarunGothicBold, 나눔고딕, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica;font-size:24px;-webkit-text-size-adjust: none;-ms-text-size-adjust: none;}
ul, li{list-style:none;}  /* 목록 점/번호 제거 */
p {margin:0;padding:0;}
a{margin:0;padding:0;font-size:100%;text-decoration:none;vertical-align:baseline;background:transparent;}
a, a:link, a:hover, a:active{color:inherit;text-decoration:none;}  /* 링크 색 상속, 밑줄 제거 */
img{vertical-align:middle;}
input{margin:0;padding:0;box-sizing:content-box;vertical-align:middle;font-family:'Pretendard', Noto Sans KR, Nanum_BG, Nanum_BGB, NanumBarunGothicBold, 나눔고딕, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica;}
textarea{border:1px solid #DEDEDE; font-family:'Pretendard', Noto Sans KR, Nanum_BG, Nanum_BGB, NanumBarunGothicBold, 나눔고딕, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica;}
table{border-collapse:collapse;border-spacing:0;}
input[type=button], input[type=submit], button{cursor:pointer;-webkit-appearance: none;}  /* 버튼류 커서 포인터 + 기본 외형 제거 */
strong, b{font-weight:bold;}

/* 입력칸 포커스 외곽선 제거 + IE의 지우기/비밀번호 표시 버튼 숨김 */
input[type=text], input[type=password]:focus{outline:none;}
input[type=text]::-ms-clear {  display: none; width : 0; height: 0; }
input[type=text]::-ms-reveal {  display: none; width : 0; height: 0; }

/* 텍스트성 입력칸 공통 - 폭 682px, 높이 60px, 둥근 모서리 + 회색 테두리 */
input[type=text], input[type=password], input[type=email], input[type=tel] {
	background: #fff;
	width : 682px;
	height: 60px;
   -webkit-appearance: none;
	border-radius: 8px;
	padding: 10px;
	border: 1px solid #E1E1E1;
	box-sizing: border-box;
	font-size : 18px;
}
/* select 도 입력칸과 동일한 라운드/테두리 */
select {
	background: #fff;
	border: 1px solid #E1E1E1;
	border-radius: 8px;
	padding: 0 12px;
	box-sizing: border-box;
	font-size: 16px;
	vertical-align: middle;
}
/* 여러 줄 입력(textarea) - 입력칸과 동일 폭, 높이 337px, 둥근 모서리 */
textarea{
	background: #fff;
	width : 682px;
	height: 337px;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	padding: 10px;
	border: 1px solid #E1E1E1;
	border-radius : 10px;
	box-sizing: border-box;
	margin-top : 20px;
	font-size : 18px;
}

/* 버튼 기본 - 폰트 통일 + 배경 제거(외형은 개별 버튼 클래스에서 지정) */
button {
	font-family:'Pretendard', Noto Sans KR, Nanum_BG, Nanum_BGB, NanumBarunGothicBold, 나눔고딕, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica;
	background: none;
}

/* === 모바일 폼요소 오버라이드: 폭 100% + 높이/폰트를 vw로 === */
@media screen and (max-width:500px) {
	body{font-size:3.6vw;}
	input[type=text], input[type=password], input[type=email], input[type=tel] {
		width : 100%;
		height: 8vw;
		padding: 1.6vw;
		margin-top : 0;
		margin-bottom : 0;
		font-size : 3vw;
	}
	/* select 도 입력칸과 동일한 높이로 통일 */
	select {
		height: 8vw;
		padding: 0 1.6vw;
		font-size: 3vw;
		box-sizing: border-box;
		vertical-align: middle;
	}
	textarea{
		width : 100%;
		height: 337px;
		font-size : 4vw;
	}
}

/******************************  색상 변수 설정  ******************************/
/* 전역 CSS 변수 - 메인(진녹색)/서브(노랑) 색상 + 호버 애니메이션 파라미터 */
:root {
  --main-color: #2B6044;        /* 메인 컬러: 진녹색(헤더/버튼/강조) */
  --sub-color: #FFC846;         /* 서브 컬러: 노랑 */
  --gray: #F6F6F6;              /* 연회색 배경 */
  --translate_distance: 15px;   /* lift_up 호버 시 위로 올라가는 거리 */
  --transition_duration: 0.25s; /* 전환 시간 */
  --transition_timing: cubic-bezier(.2,.8,.2,1);  /* 전환 가속 곡선 */
}

/******************************  PC, Mobile 표시 토글  ******************************/
/* .pc=PC 전용, .mob=모바일 전용 요소. 기본(PC)에서는 모바일 요소 숨김 */
.mob { display: none !important; }
.mob-in { display: none !important; }

/* 모바일에서는 PC 요소 숨기고 모바일 요소만 노출 */
@media screen and (max-width:500px) {
	.pc { display: none !important; }
	.mob { display: block !important; }
	.mob-in { display: inline-block !important; }
	/* 줄바꿈용 <br class="mob">는 block 대신 inline 으로(깔끔한 줄바꿈, 빈 줄 방지) */
	br.mob { display: inline !important; }
}

/* 데이터 없음(검색결과 없음 등) 안내 문구 - 가운데 정렬 */
 .no-data {
	width: 100%;
	padding: 100px 0 150px;
	font-size: 24px;
	text-align: center;
} 

/* 목록(li) 안에서 쓰이는 데이터 없음 변형 */
li.no-data {
	display: block !important;
	justify-content: center;
	width: 100% !important;
	padding: 40px 0 !important;
	font-size: 24px;
	text-align: center;
}

/* 모바일 데이터 없음 - 여백/폰트 vw로 */
@media screen and (max-width:500px) {
	.no-data {
		padding: 20vw 0 30vw;
		font-size: 6vw;
	}

	li.no-data {
		padding: 8vw 0 !important;
		font-size: 3.6vw;
	}
}

/******************************  애니메이션  ******************************/
/* lift_up - 호버 시 요소가 위로 살짝 떠오르는 효과(카드 등에 사용) */
.lift_up {
  transition: transform var(--transition_duration) var(--transition_timing);
  will-change: transform;
}

/* 호버/포커스 시 위로 이동(--translate_distance 만큼) */
.lift_up:hover,
.lift_up:focus {
  transform: translateY(calc(-1 * var(--translate_distance)));
}


/******************************  페이징(게시판 페이지 번호)  ******************************/
/* 페이지 번호 영역 - 가운데 정렬 */
.paging{
	width:100%;
	margin:45px 0 15px;
	text-align:center;
}

.paging ul{
	margin:0 auto;
}

/* 페이지 번호 한 칸 - 30px 정사각형 박스 */
.paging ul li{
	display:inline-block;
	width:30px;
	margin-right:7px;
	border:1px solid #ddd;
	font-size:18px;
	line-height:30px;
	text-align:center;
}

/* 번호 링크 - 칸 전체를 클릭 영역으로 */
.paging ul li a,.paging ul li a:hover, .paging ul li a:link, .paging ul li a:focus, .paging ul li a:active{
	 display:block;
	 color:inherit;
}

/* 호버/현재(over) 번호 - 메인 컬러 배경 강조 */
.paging ul li:hover, .paging ul li.over{
	background:var(--main-color);
	color: #fff;
	cursor:pointer;
}


/* 현재 페이지(now_page) - 메인 컬러 배경 고정 */
.paging ul li.now_page{
	background: var(--main-color);
	color: #fff;
}


/* 모바일 페이징 - 번호 칸/폰트 vw로 확대 */
@media screen and (max-width:500px) {
	.paging{
		margin:9vw 0 7vw;
	}

	.paging ul li{
		width:8.2vw;
		margin-right:1.9vw;
		font-size:4.3vw;
		line-height:8.2vw;
	}
}


/******************************  버튼(공통)  ******************************/
/* 버튼 정렬용 래퍼 - 가운데 정렬 */
.btn_area01{
	width:100%;
	margin:10px 0;
	text-align:center;
}

/* 버튼 래퍼 - 좌측(기본) 정렬 */
.btn_area02{
	width:100%;
	margin:10px 0;
}

/* 버튼 래퍼 - 우측 정렬 */
.btn_area03{
	width:100%;
	margin:10px 0;
	text-align:right;
}

/* 기본 버튼 3종 공통 크기(120x40) - 채움/회색/테두리 */
.solid_button, .gray_button, .line_button {
	width: 120px;
	height: 40px;
	font-size: 18px;
	border-radius: 0;
}

/* 채움 버튼 - 메인 컬러 배경 + 흰 글자(주요 액션) */
.solid_button {
	border: 1px solid var(--main-color);
	background: var(--main-color);
	color: #fff;
}

/* 테두리 버튼 - 흰 배경 + 회색 테두리(보조 액션) */
.line_button {
	border: 1px solid #DDDDDD;
	background: #fff;
	color: #000;
}

/* 회색 버튼 - 회색 배경(취소 등) */
.gray_button {
	border: 1px solid #E1E1E1;
	background: #E1E1E1;
	color: #000;
}

/* 작은 버튼(sbutton) 공통 - 패딩/폰트 축소 */
.solid_sbutton, .line_sbutton {
	margin-left: 10px;
	padding: 5px 15px;
	font-size: 14px;
}

/* 작은 채움 버튼 - 메인 컬러 */
.solid_sbutton {
	border: 1px solid var(--main-color);
	background: var(--main-color);
	color: #fff;
}

/* 작은 테두리 버튼 - 흰 배경 + 회색 글자 */
.line_sbutton {
	border: 1px solid #DDDDDD;
	background: #fff;
	color: #666666;
}

/* 진녹색 버튼 - 높이 45px(폼 옆 등록/확인 등) */
.darkgreen_btn {
	height: 45px;
	border: 0;
	padding: 0 20px;
	background: var(--main-color);
	font-size: 16px;
	color: #fff;
}

/* 진회색 버튼 - 높이 45px(취소/뒤로 등) */
.darkgray_btn {
	height: 45px;
	border: 0;
	padding: 0 20px;
	background: #333;
	font-size: 16px;
	color: #fff;
}

/* 게시판 뷰 내부 버튼 - 둥근 모서리 초록 버튼 */
.default_board_view button {
	padding: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	background: #499e5f;
	color: #fff;
	font-size: 14px;
}

/* === 모바일 버튼 오버라이드: 영역은 가운데 정렬, 버튼 크기 vw로 === */
@media screen and (max-width:500px) {
	.btn_area01, .btn_area01, .btn_area01{
		margin: 6.5vw 0 7vw;
	}

	.btn_area02{
		text-align:center;
	}

	.btn_area03{
		text-align:center;
	}

	.solid_button, .gray_button, .line_button {
		width: 37.4vw;
		height: 10vw;
		font-size: 3.6vw;
		border-radius: 0;
		margin-right: 0;
		margin-bottom: 0;
	}
}

/******************************  마진 / 패딩 (유틸리티 클래스)  ******************************/
/* mt/ml/mr/mb = margin top/left/right/bottom, pt/pl/pr/pb = padding. 숫자는 px값 */
.mt_10{margin-top:10px;}
.mt_20{margin-top:20px;}
.mt_30{margin-top:30px;}
.mt_40{margin-top:40px;}
.mt_50{margin-top:50px;}
.mt_60{margin-top:60px;}
.mt_70{margin-top:70px;}
.mt_80{margin-top:80px;}
.mt_90{margin-top:90px;}
.mt_100{margin-top:100px;}
.mt_150{margin-top:150px;}
.mt_200{margin-top:200px;}
.mt_250{margin-top:250px;}

.ml_10{margin-left:10px;}
.ml_20{margin-left:20px;}
.ml_30{margin-left:30px;}
.ml_40{margin-left:40px;}
.ml_50{margin-left:50px;}
.ml_60{margin-left:60px;}
.ml_70{margin-left:70px;}
.ml_80{margin-left:80px;}
.ml_90{margin-left:90px;}
.ml_100{margin-left:100px;}
.ml_150{margin-left:150px;}
.ml_200{margin-left:200px;}
.ml_250{margin-left:250px;}

.mr_10{margin-right:10px;}
.mr_20{margin-right:20px;}
.mr_30{margin-right:30px;}
.mr_40{margin-right:40px;}
.mr_50{margin-right:50px;}
.mr_60{margin-right:60px;}
.mr_70{margin-right:70px;}
.mr_80{margin-right:80px;}
.mr_90{margin-right:90px;}
.mr_100{margin-right:100px;}
.mr_150{margin-right:150px;}
.mr_200{margin-right:200px;}
.mr_250{margin-right:250px;}

.mb_10{margin-bottom:10px;}
.mb_20{margin-bottom:20px;}
.mb_30{margin-bottom:30px;}
.mb_40{margin-bottom:40px;}
.mb_50{margin-bottom:50px;}
.mb_60{margin-bottom:60px;}
.mb_70{margin-bottom:70px;}
.mb_80{margin-bottom:80px;}
.mb_90{margin-bottom:90px;}
.mb_100{margin-bottom:100px;}
.mb_150{margin-bottom:150px;}
.mb_200{margin-bottom:200px;}
.mb_250{margin-bottom:250px;}

.pt_10{padding-top:10px;}
.pt_20{padding-top:20px;}
.pt_30{padding-top:30px;}
.pt_40{padding-top:40px;}
.pt_50{padding-top:50px;}
.pt_60{padding-top:60px;}
.pt_70{padding-top:70px;}
.pt_80{padding-top:80px;}
.pt_90{padding-top:90px;}
.pt_100{padding-top:100px;}
.pt_150{padding-top:150px;}
.pt_200{padding-top:200px;}
.pt_250{padding-top:250px;}

.pl_10{padding-left:10px;}
.pl_20{padding-left:20px;}
.pl_30{padding-left:30px;}
.pl_40{padding-left:40px;}
.pl_50{padding-left:50px;}
.pl_60{padding-left:60px;}
.pl_70{padding-left:70px;}
.pl_80{padding-left:80px;}
.pl_90{padding-left:90px;}
.pl_100{padding-left:100px;}
.pl_150{padding-left:150px;}
.pl_200{padding-left:200px;}
.pl_250{padding-left:250px;}

.pr_10{padding-right:10px;}
.pr_20{padding-right:20px;}
.pr_30{padding-right:30px;}
.pr_40{padding-right:40px;}
.pr_50{padding-right:50px;}
.pr_60{padding-right:60px;}
.pr_70{padding-right:70px;}
.pr_80{padding-right:80px;}
.pr_90{padding-right:90px;}
.pr_100{padding-right:100px;}
.pr_150{padding-right:150px;}
.pr_200{padding-right:200px;}
.pr_250{padding-right:250px;}

.pb_10{padding-bottom:10px;}
.pb_20{padding-bottom:20px;}
.pb_30{padding-bottom:30px;}
.pb_40{padding-bottom:40px;}
.pb_50{padding-bottom:50px;}
.pb_60{padding-bottom:60px;}
.pb_70{padding-bottom:70px;}
.pb_80{padding-bottom:80px;}
.pb_90{padding-bottom:90px;}
.pb_100{padding-bottom:100px;}
.pb_150{padding-bottom:150px;}
.pb_200{padding-bottom:200px;}
.pb_250{padding-bottom:250px;}


/******************************  가로 사이즈 (유틸리티 클래스)  ******************************/
/* sizeNNN = 너비 NNN px, sizeNNper = 너비 NN %, textarea_set = 입력영역 폭/높이 지정 */
.size50{width:50px;}
.size80{width:80px;}
.size100{width:100px;}
.size150{width:150px;}
.size200{width:200px;}
.size300{width:300px;}
.size400{width:400px;}
.size500{width:500px;}
.size600{width:600px;}
.size700{width:700px;}
.size90per{width:90%;}
.size98per{width:98%;}
.size100per{width:100%;}
.textarea_set{width:98%;height:100px;}
.textarea_set2{width:98%;height:200px;padding: 5px;box-sizing:border-box;}

/******************************************
	폰트 정렬 (유틸리티: 좌/가운데/우)
*******************************************/
.ta-left{text-align:left;}
.ta-center{text-align:center;}
.ta-right{text-align:right;}

/******************************************
	가상 요소 (float 해제용 clearfix)
*******************************************/
.after_clear::after {display:block;clear:both;content:"";}

/******************************************
	배경색 (유틸리티 클래스)
*******************************************/
.bg-lightgray {background:#F6F6F6;}
.bg-lightblue {background:#E8EFFF;}
.bg-gray {background:#ECECEC;}
.bg-gray2 {background:#F0F0F0;}
.bg-beige {background:#F3EFE9;}

/******************************************
	폰트색 (유틸리티 클래스)
*******************************************/
.fc-white {color:#fff;}
.fc-main {color:var(--main-color);}   /* 메인 컬러 글자 */
.fc-blue {color:#4BA3E0;}
.fc-lightgray {color:#777;}
.fc-gold {color:#BFA14A;}
.fc-orange {color:#FF791F;}

.ff-one-mobile { font-family: "ONE_title"; }  /* 특정 폰트(ONE_title) 지정 */

/* === 게시판 공통: 상단 영역 (총 건수 표시 + 검색 폼) === */
.board_header_area {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-bottom: 15px;
}

/* 총 게시글 건수 텍스트 */
.board_header_area .total_count {
	font-size: 16px;
	color: #555;
}

/* 건수 숫자 강조(메인 컬러) */
.board_header_area .total_count strong {
	font-weight: bold;
	color: var(--main-color);
}

/* 검색 폼 영역 - 셀렉트/입력/버튼 가로 배치 */
.board_search_area {
	display: flex;
	gap: 5px;
}

/* 검색 분류 선택(select) */
.board_search_area select {
	width: 100px;
	height: 40px;
	font-size: 15px;
	border: 1px solid #ccc;
	background: transparent;
	padding: 0 5px;
}

/* 검색어 입력칸 */
.board_search_area input[type=text] {
	width: 200px;
	height: 40px;
	padding: 0 10px;
	font-size: 15px;
	border: 1px solid #ccc;
	background: transparent;
}

/* 검색 버튼 - 메인 컬러 */
.board_search_area button {
	width: 80px;
	height: 40px;
	border: 0;
	border-radius: 6px;
	background: var(--main-color);
	color: #fff;
	font-size: 15px;
	cursor: pointer;
}

/* === 게시판 리스트 테이블(목록) === */
.default_board_list {
	width: 100%;
	table-layout: fixed;
	border-top: 1px solid #d9d9d9;
	border-collapse: collapse;
}

/* 리스트 셀 공통 - 가운데 정렬, 하단 구분선 */
.default_board_list th,
.default_board_list td {
	padding: 20px 0;
	border-bottom: 1px solid #e1e1e1;
	text-align: center;
	font-size: 16px;
	color: #333;
}

/* 헤더 셀(제목 행) 굵게 */
.default_board_list th {
	font-weight: bold;
}

/* 본문 셀 - 길면 말줄임(...) 처리 */
.default_board_list td {
	white-space: nowrap;
	overflow: hidden;
	text-overflow : ellipsis;
}

/* 좌측 정렬 셀(제목 컬럼 등) */
.default_board_list th.ltext,
.default_board_list td.ltext {
	text-align: left;
	padding-left: 20px;
}

/* 리스트 링크 색상 */
.default_board_list td a {
	color: #333;
	text-decoration: none;
}

/* 제휴사업 리스트 변형 - 말줄임 해제(여러 줄 허용) */
.default_board_list.jehu_list td {
	white-space: normal;
}

/* 이미지 셀 - 최대 300px 제한 */
.default_board_list td.sizemax img {
	max-width: 300px;
}

/* 모바일 버전 리스트(640px 이하) - 검색폼 세로 전환, 셀 크기 축소 */
@media screen and (max-width: 640px) {
	.default_board_list td.sizemax img {
		max-width: 100%;
	}

	.board_header_area {
		flex-direction: column;
		align-items: flex-start;
		gap: 15px;
	}

	.board_search_area select {
		width: 30%;
		height: 35px;
		font-size: 14px;
	}

	.board_search_area input[type=text] {
		width: calc(70% - 70px);
		font-size: 14px;
		height: 35px;
	}

	.board_search_area button {
		width: 60px;
		height: 35px;
		font-size: 14px;
	}
}

/* 리스트 v2 변형 - PC에서는 모바일 전용 요소 숨김 */
.default_board_list.v2 .mob {
	display: none;
}

/* 리스트 v2 모바일 - PC 요소 숨기고 모바일 요소(제목 등) 표시 */
@media screen and (max-width: 640px) {
	.default_board_list.v2 .pc {
		display: none;
	}

	.default_board_list.v2 .mob {
		display: block;
		padding-bottom: 10px;
		font-size: 1.2em;
		font-weight: bold;
	}

	.default_board_list.v2 td .mob {
		padding-bottom: 20px;
		text-align: center;
	}
}

/* ---------------------------------------------------
   게시판 뷰 테이블 (글쓰기, 상세페이지) 수정
--------------------------------------------------- */
/* 게시판 뷰/글쓰기 테이블 - 좌/우/상단 테두리 + 흰 배경 */
.default_board_view {
	width: 100%;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
	table-layout: fixed;
	background-color: #fff;
}

/* 뷰 셀 공통 - 패딩/구분선 */
.default_board_view th,
.default_board_view td {
	padding: 15px 20px;
	border-bottom: 1px solid #ddd;
	font-size: 16px;
	vertical-align: middle;
}

/* 항목명 헤더 셀(좌측 라벨) - 회색 배경, 가운데 정렬 */
.default_board_view th {
	background-color: #f2f2f2;
	text-align: center;
	font-weight: bold;
	color: #333;
	border-right: 1px solid #ddd;
}

/* 값 셀 - 좌측 정렬 */
.default_board_view td {
	text-align: left;
}

/* 뷰 내부 인풋 스타일 재정의 - 셀 너비에 꽉 차는 입력칸 */
.default_board_view input.input_full {
	width: 100%;
	height: 40px;
	border: 1px solid #ddd;
	padding: 0 10px;
	box-sizing: border-box;
	font-size: 15px;
	background-color: #fff;
}

/* 첨부파일 삭제 버튼 등 - 작은 회색 버튼 */
.btn_file_del {
	padding: 5px 10px;
	border: 1px solid #ddd;
	background: #f9f9f9;
	color: #333;
	font-size: 13px;
	border-radius: 3px;
	margin-left: 10px;
}

/* 붉은색 텍스트 및 placeholder(필수 안내 등 강조) */
.placeholder_red {
	color: #ff0000 !important;
}
.placeholder_red::placeholder {
	color: #ff0000;
}

/* 글쓰기 버튼 영역 (가운데 정렬, 버튼 가로 배치) */
.btn_area_write {
	width: 100%;
	margin-top: 40px;
	text-align: center;
	display: flex;
	justify-content: center;
	gap: 15px;
}

/* 취소, 등록 버튼 - 흰 배경 + 둥근 테두리 */
.btn_write_cancel,
.btn_write_submit {
	width: 110px;
	height: 45px;
	background-color: #fff;
	color: #333;
	border: 1px solid #ddd;
	border-radius: 8px;
	font-size: 16px;
	cursor: pointer;
	transition: background-color 0.3s;
}

/* 취소/등록 버튼 호버 - 옅은 회색 */
.btn_write_cancel:hover,
.btn_write_submit:hover {
	background-color: #f5f5f5;
}

/* 모바일(640px 이하): 리스트/뷰 셀 폰트·패딩 축소, 뷰 이미지 폭 제한 */
@media screen and (max-width: 640px) {
	.default_board_list th,
	.default_board_list td,
	.default_board_view th,
	.default_board_view td {
		font-size: 14px;
		padding: 10px;
	}

	.default_board_view td img {
		max-width: 100%;
	}
}

/* === 모바일(≤500px) 게시판 목록: 디자인 시안의 카드형 리스트 ===
   - 검색폼(회색 박스)이 위, 총건수가 아래(우측 정렬 + 구분선)
   - 표 헤더/번호/조회수 숨김, 각 글을 제목 + (작성자 | 등록일) 카드로(줄무늬 배경) */
@media screen and (max-width: 500px) {
	/* 헤더 영역: 검색폼(위) → 총건수(아래) 순서 */
	.board_header_area {
		flex-direction: column-reverse;
		align-items: stretch;
		gap: 14px;
	}
	.board_header_area form { width: 100%; }

	/* 검색 영역: 회색 박스 안에 세로 전체폭 스택 */
	.board_search_area {
		flex-direction: column;
		gap: 10px;
		width: 100%;
		background: #f4f4f4;
		border-radius: 8px;
		padding: 14px;
		box-sizing: border-box;
	}
	.board_search_area select,
	.board_search_area input[type=text] {
		width: 100%;
		height: 46px;
		font-size: 15px;
		background: #fff;
		border: 1px solid #ddd;
		border-radius: 6px;
		box-sizing: border-box;
	}
	.board_search_area button {
		width: 100%;
		height: 48px;
		font-size: 16px;
		border-radius: 6px;
	}

	/* 총 건수: 우측 정렬 + 하단 구분선(목록 위 진한 라인) */
	.board_header_area .total_count {
		width: 100%;
		text-align: right;
		padding-bottom: 8px;
		border-bottom: 2px solid #333;
	}

	/* 목록 테이블 → 카드형 블록 전환 (구분선/상단여백 제거) */
	.default_board_list { border-top: 0; }
	.default_board_list.mt_30 { margin-top: 0; }
	.default_board_list colgroup,
	.default_board_list thead { display: none; }
	.default_board_list tbody,
	.default_board_list tr,
	.default_board_list td { display: block; width: 100%; }

	/* 각 글: 카드(상하 패딩 + 옅은 구분선) */
	.default_board_list tbody tr {
		padding: 13px 12px;
		border-bottom: 1px solid #ededed;
	}
	/* 줄무늬(짝수행 옅은 회색 배경) */
	.default_board_list tbody tr:nth-child(even) {
		background: #f7f7f7;
	}

	/* 셀 기본값 초기화(테이블 정렬/말줄임 해제) */
	.default_board_list tbody td {
		padding: 0;
		border: 0;
		text-align: left;
		white-space: normal;
		overflow: visible;
		font-size: 13px;
	}

	/* 번호(공지)·조회수 칸 숨김 */
	.default_board_list tbody td:nth-child(1),
	.default_board_list tbody td:nth-child(5) { display: none; }

	/* 제목: 한 줄 말줄임(...) */
	.default_board_list tbody td.ltext {
		padding: 0 0 7px 0;
		font-size: 15px;
		font-weight: 400;
		line-height: 1.4;
		color: #333;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.default_board_list tbody td.ltext a { color: #333; }

	/* 작성자 + 등록일: 한 줄 메타(회색) */
	.default_board_list tbody td:nth-child(3),
	.default_board_list tbody td:nth-child(4) {
		display: inline-block;
		width: auto;
		color: #999;
		font-size: 13px;
	}
	/* 작성자와 등록일 사이 구분선 */
	.default_board_list tbody td:nth-child(3)::after {
		content: "|";
		margin: 0 8px;
		color: #d5d5d5;
	}

	/* 데이터 없음 행은 가운데 정렬 유지 */
	.default_board_list tbody td[colspan] {
		display: block;
		text-align: center;
		padding: 30px 0;
		color: #888;
	}
}

/* 답변완료 뱃지 - 주황 배경 작은 라벨 */
.reply_badge {
	display: inline-block;
	margin-left: 10px;
	padding: 3px 8px;
	background-color: #f29c38;
	color: #fff;
	font-size: 13px;
	border-radius: 4px;
	vertical-align: middle;
}

/* 글쓰기 버튼 영역 (우측 정렬 - 리스트 하단용) */
.btn_right_area {
	width: 100%;
	margin-top: 20px;
	text-align: right;
}

/* 글쓰기 버튼 (흰 배경, 얇은 테두리 - 리스트 하단용) */
.btn_write_border {
	padding: 10px 30px;
	background-color: #fff;
	color: #333;
	border: 1px solid #e1e1e1;
	border-radius: 8px;
	font-size: 15px;
	cursor: pointer;
	transition: background-color 0.3s;
}

.btn_write_border:hover {
	background-color: #f9f9f9;
}

/* 글쓰기 버튼 영역 (우측 정렬) */
.btn_right_area {
	width: 100%;
	margin-top: 20px;
	text-align: right;
}

/* 리스트 페이지 글쓰기 버튼 (write.php 버튼과 동일한 스타일) - 흰 배경 둥근 버튼 */
.btn_write_list {
	width: 110px;
	height: 45px;
	background-color: #fff;
	color: #333;
	border: 1px solid #ddd;
	border-radius: 8px;
	font-size: 16px;
	cursor: pointer;
	transition: background-color 0.3s;
}

.btn_write_list:hover {
	background-color: #f5f5f5;
}

/* ---------------------------------------------------
   게시판 상세 보기 (view.php) 스타일
--------------------------------------------------- */
/* 상세보기 전체 래퍼 - 상단 굵은 구분선 */
.board_view_wrap {
	width: 100%;
	border-top: 2px solid #333;
	margin-top: 30px;
}

/* 상세 헤더 - 제목(좌) + 작성정보(우) 양끝 배치 */
.view_header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px 10px;
	border-bottom: 1px solid #eee;
}

/* 글 제목 */
.view_title {
	font-size: 22px;
	font-weight: 500;
	color: #111;
}

/* 작성자/날짜 등 정보(회색) */
.view_info {
	font-size: 16px;
	color: #999;
}

/* 정보 항목 사이 구분선 */
.view_info .line {
	margin: 0 15px;
	color: #ddd;
}

/* 본문 내용 - 넉넉한 상하 여백, 최소 높이 300px */
.view_content {
	padding: 50px 10px 100px;
	font-size: 16px;
	color: #333;
	line-height: 1.6;
	min-height: 300px;
}

/* 본문 이미지 - 폭 넘침 방지 */
.view_content img {
	max-width: 100%;
}

/* 답변 영역 - 회색 배경 박스(관리자 답변) */
.view_reply_area {
	background-color: #f2f2f2;
	padding: 30px;
	margin-bottom: 40px;
}

/* 답변 영역 안의 답변완료 뱃지(주황) */
.reply_badge {
	display: inline-block;
	background-color: #ff9800;
	color: #fff;
	padding: 5px 15px;
	font-size: 14px;
	border-radius: 3px;
}

/* 답변 본문 텍스트 */
.reply_text {
	font-size: 16px;
	color: #555;
	line-height: 1.6;
}

/* 첨부파일 영역 - 상하 구분선 박스 */
.view_file_area {
	border-top: 1px solid #eee;
	border-bottom: 1px solid #333;
	padding: 20px 10px;
}

/* 첨부파일 한 줄 - 파일명 + 다운로드 버튼 가로 배치 */
.view_file_area li {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 15px;
}

.view_file_area li:last-child {
	margin-bottom: 0;
}

/* 첨부파일 이름 */
.file_name {
	font-size: 16px;
	color: #333;
	margin-right: 20px;
	min-width: 150px;
}

/* 첨부파일 다운로드 버튼 - 회색 */
.btn_file_down {
	display: inline-block;
	background-color: #e5e5e5;
	color: #333;
	padding: 8px 25px;
	font-size: 14px;
	text-decoration: none;
	border-radius: 3px;
	transition: background-color 0.3s;
}

.btn_file_down:hover {
	background-color: #d5d5d5;
}

/* 상세 하단 버튼 영역(목록/수정/삭제) - 가운데 정렬 */
.btn_area_view {
	margin-top: 50px;
	text-align: center;
}

/* 목록/수정/삭제 버튼 공통 - 흰 배경 둥근 버튼 */
.btn_view_list,
.btn_view_edit,
.btn_view_del {
	display: inline-block;
	width: 120px;
	height: 50px;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 8px;
	font-size: 16px;
	color: #333;
	cursor: pointer;
	margin: 0 5px;
	transition: background-color 0.3s;
}

.btn_view_list:hover,
.btn_view_edit:hover,
.btn_view_del:hover {
	background-color: #f9f9f9;
}

/* 목록 제목 뒤 댓글 수 [n] - 붉은색 굵은 글씨 */
.cmt_cnt { margin-left: 6px; color: #e23b30; font-weight: bold; }

/* ===== 조합원게시판 댓글 영역 ===== */
.comment_area {
	max-width: 100%;
	margin: 40px auto 0;
	padding-top: 24px;
	border-top: 2px solid #333;
}
.comment_area .comment_count { font-size: 18px; color: #333; margin-bottom: 16px; }
.comment_area .comment_count strong { color: var(--main-color); }
.comment_area .comment_list { list-style: none; padding: 0; margin: 0; }
.comment_area .comment_item { padding: 16px 4px; border-bottom: 1px solid #eee; }
.comment_area .comment_head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.comment_area .comment_writer { font-weight: 700; color: #222; font-size: 16px; }
.comment_area .comment_date { color: #999; font-size: 14px; }
.comment_area .comment_del_btn { margin-left: auto; background: none; border: 1px solid #ddd; border-radius: 4px; padding: 4px 10px; font-size: 13px; color: #777; cursor: pointer; }
.comment_area .comment_body { color: #444; font-size: 16px; line-height: 1.6; word-break: break-all; }
.comment_area .comment_empty { color: #999; padding: 20px 4px; text-align: center; font-size: 14px; }
.comment_area .comment_form { display: flex; gap: 10px; margin-top: 20px; }
.comment_area .comment_form { align-items: stretch; }
.comment_area .comment_input { flex: 1; height: 60px; margin: 0; padding: 12px; border: 1px solid #ccc; border-radius: 6px; font-size: 15px; resize: vertical; box-sizing: border-box; }
.comment_area .comment_submit_btn { width: 110px; height: 60px; border: 0; border-radius: 6px; background: var(--main-color); color: #fff; font-size: 16px; cursor: pointer; box-sizing: border-box; }
.comment_area .comment_login_notice { margin-top: 20px; padding: 16px; background: #f7f7f7; border-radius: 6px; text-align: center; color: #888; }
@media screen and (max-width: 800px) {
	.comment_area .comment_form { flex-direction: column; }
	.comment_area .comment_submit_btn { width: 100%; height: 44px; }
}

/* 모바일(800px 이하): 하단 버튼 vw로 축소, 상세 헤더 세로 전환 */
@media screen and (max-width: 800px) {
	.btn_view_list,
	.btn_view_edit,
	.btn_view_del {
		display: inline-block;
		width: 24vw;
		height: 10vw;
		font-size: 3.6vw;
	}

	.view_header {
		flex-direction: column;
		align-items: flex-start;
		gap: 15px;
	}

	.view_info {
		width: 100%;
		text-align: right;
	}
}

/* ---------------------------------------------------
   갤러리 리스트 (영상 교육 자료 등) 스타일 추가
--------------------------------------------------- */
/* 갤러리 그리드 - PC 한 줄 4개(썸네일형 게시판) */
.gallery_list {
	display: grid;
	grid-template-columns: repeat(4, 1fr); /* 한 줄에 4개씩 */
	gap: 30px 20px;
	padding: 0;
	list-style: none;
	margin-top: 20px;
}

/* 갤러리 항목 */
.gallery_list li {
	width: 100%;
}

/* 갤러리 항목 링크(블록 전체 클릭) */
.gallery_list li a {
	display: block;
	text-decoration: none;
	color: #333;
}

/* 이미지 박스 (정사각형 비율 유지) - 넘침 숨김 */
.gallery_list .img_box {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1; /* 정사각형 비율 */
	overflow: hidden;
	background-color: #f8f8f8;
	border: 1px solid #eee;
}

/* 썸네일 이미지 - 박스 꽉 채움(cover) */
.gallery_list .img_box img {
	width: 100%;
	height: 100%;
	object-fit: cover; /* 이미지 꽉 차게 */
	transition: transform 0.3s ease;
}

/* 호버 시 썸네일 살짝 확대 */
.gallery_list li a:hover .img_box img {
	transform: scale(1.05); /* 마우스 호버 시 살짝 확대 */
}

/* 플레이 아이콘 (영상 게시판용 - 중앙 배치) */
.gallery_list .play_icon {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 50px;
	height: 50px;
	background: rgba(0, 0, 0, 0.5) url('/images/play_btn.png') no-repeat center; /* 아이콘 경로는 프로젝트에 맞게 수정 */
	background-size: 20px;
	border-radius: 50%;
	pointer-events: none;
}

/* 썸네일 아래 텍스트 박스 */
.gallery_list .txt_box {
	padding: 15px 5px;
}

/* 갤러리 제목 - 2줄까지 표시 후 말줄임 */
.gallery_list .gal_title {
	font-size: 16px;
	font-weight: 500;
	color: #333;
	line-height: 1.4;
	margin-bottom: 8px;
	/* 두 줄 이상 말줄임 처리 */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	height: 2.8em; 
}

/* 갤러리 날짜 */
.gallery_list .gal_date {
	font-size: 14px;
	color: #999;
}

/* 갤러리 데이터 없음 - 4칸 전체 폭 차지 */
.gallery_list .no-data {
	grid-column: span 4;
	text-align: center;
	padding: 100px 0;
	color: #777;
	border-bottom: 1px solid #eee;
}

/* ---------------------------------------------------
   모바일 반응형 (640px 이하)
--------------------------------------------------- */
/* 모바일 갤러리 - 한 줄 2개로 변경, 데이터없음도 2칸 차지 */
@media screen and (max-width: 640px) {
	.gallery_list {
		grid-template-columns: repeat(2, 1fr); /* 모바일은 한 줄에 2개씩 */
		gap: 20px 10px;
	}

	.gallery_list .gal_title {
		font-size: 14px;
	}

	.gallery_list .no-data {
		grid-column: span 2;
	}
}

/******************************************
	로그인
*******************************************/
.login_area {
}

/* 로그인 박스 - 가운데 정렬된 작은 카드 */
.login_box {
	padding: 40px;
	width: 300px;
	margin: 100px auto 200px;
	border: 1px solid #ddd;
}

/* 로그인 입력칸 - 세로로 쌓임 */
.login_box input {
	display: block;
	width: 100%;
	height: 40px;
	margin-bottom: 10px;
	padding: 0 10px;
	box-sizing: border-box;
}

.login_box input.login_text {}

/* 로그인 제출 버튼 - 검정 배경 */
.login_box input.login_submit {
	border: 0;
	background-color: #000;
	color: #fff;
}

/* 로그인 제목 */
.login_title {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 20px;
}


/* === 비밀번호 변경 모달 === */
/* 모달 오버레이 - 화면 전체 반투명 검정 배경(기본 숨김, 가운데 정렬) */
.pwd_modal_overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.6);
	z-index: 9999;
	display: none;
	align-items: center;
	justify-content: center;
}
/* 모달 본문 박스 - 흰 카드(450px) */
.pwd_modal_box {
	background: #fff;
	width: 450px;
	padding: 50px 40px;
	position: relative;
	box-sizing: border-box;
}
/* 모달 닫기(X) 버튼 - 우상단 */
.pwd_modal_close {
	position: absolute;
	top: 15px;
	right: 15px;
	background: none;
	border: none;
	font-size: 24px;
	cursor: pointer;
	color: #333;
}
/* 모달 제목 */
.pwd_modal_title {
	text-align: center;
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 30px;
}
/* 모달 입력칸(새 비밀번호 등) */
.pwd_modal_input {
	width: 100%;
	height: 50px;
	border: 1px solid #ddd;
	padding: 0 15px;
	box-sizing: border-box;
	margin-bottom: 20px;
	font-size: 16px;
}
/* 모달 확인 버튼 - 진녹색 */
.pwd_modal_btn {
	width: 100%;
	height: 50px;
	background: #386A4F; /* 요청하신 디자인의 다크 그린 색상 */
	color: #fff;
	border: none;
	font-size: 18px;
	font-weight: 500;
	cursor: pointer;
}


/******************************  모바일 반응형 수정 (max-width:500px)  ******************************/
/* 모바일 비밀번호 모달 - 박스/제목/입력/버튼을 vw로 재조정 */
@media screen and (max-width:500px) {

	/* 2. 모달 창 (비밀번호 변경 등) - 꽉 차지 않게 비율 조정 */
	.pwd_modal_box {
		width: 90vw; /* 좌우 여백 확보 */
		padding: 10vw 6vw;
		border-radius: 2vw;
	}
	.pwd_modal_title {
		font-size: 5.5vw;
		margin-bottom: 6vw;
	}
	.pwd_modal_close {
		top: 3vw;
		right: 3vw;
		font-size: 7vw;
	}
	.pwd_modal_input {
		height: 12vw;
		margin-bottom: 4vw;
		font-size: 4vw;
		padding: 0 4vw;
	}
	.pwd_modal_btn {
		height: 13vw;
		font-size: 4.5vw;
	}

}