 

.board_category								{position:relative;text-align:center; margin-bottom:30px;}
.board_category li							{position:relative;display:inline-block; } 
.board_category li a						{position:relative;display:block;  color:#555; padding:0 30px 15px 30px;font-size:1.1em;border-radius:2px; font-weight:500;  transition:all 0.3s ease;}
.board_category a:after					{position:absolute;content:'';  left:50%;bottom:0; width:0; height:3px;  background:#2071f8; transition:all 0.3s ease;}
.board_category li a:hover, .board_category .on a		{ color:#2071f8;  }
.board_category li:hover a:after, 
.board_category .on a:after		{position:absolute;content:'';  left:0;bottom:0; width:100%; height:3px;  background:#2071f8; }
 


.board_list .content_wrap							{position:relative; display: grid; grid-template-columns:repeat(4, 1fr); gap:1.6em; transition:all 0.4s ease;} 
.board_list .content_wrap li							{position:relative; width:100%; overflow:hidden;transition:all 0.4s ease;} 
.board_list .content_wrap li figure				{position:relative; width:100%; aspect-ratio:2.4/3.2; border:1px solid #eaeaea; border-radius:0.7em; overflow:hidden; text-align:Center;}
.board_list .content_wrap li figure img		{width:100%; height:100%; object-fit:cover;transition:all 0.4s ease;}
.board_list .content_wrap li figure p			{position:absolute; left:0;bottom:0; width:46px; line-height:30px; border-radius:0 10px 0 0; color:#fff; background:red; font-size:0.7em;   z-index:1;}
.board_list .content_wrap li:hover figure img	{transform: scale(1.1);filter: brightness(0.6);}
 
.board_list .content_wrap li .txt					{padding:20px 5px 10px 5px; }
.board_list .content_wrap li .txt p				{font-size:1.05em; color:#222; font-weight:600;   line-height:1.4; overflow:hidden; text-overflow: ellipsis;-o-text-overflow: ellipsis; display:-webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;  }
.board_list .content_wrap li .txt span			{display: block; color:#888; font-size:0.95rem; margin-top:10px;}  
 
.board_list .content_wrap li .layer					{position:absolute;display:none; top:calc(50% - 25px); left:calc(50% - 25px); width:50px; height:50px; opacity:.6;background:#fff;  border-radius:50px ; z-index:2;}
.board_list .content_wrap li .layer:before		{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:28px; height:2px; background:#666; border-radius:5px ;}
.board_list .content_wrap li .layer:after			{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); height:28px; width:2px; background:#666;border-radius:5px ;}
.board_list .content_wrap li:hover .layer		{display:block;} 

   
.board_list .content_nolist							{padding:120px 0; text-align:center; border-top:1px solid #5e5e5e; border-bottom:1px solid #5e5e5e;} 
.bbs_btn_wrap												{position:relative;padding-top:40px; display: grid; grid-template-columns:1fr; gap:20px; } 
 
@media screen and (max-width:1024px) { 
	.board_list .content_wrap						{  grid-template-columns:repeat(3, 1fr); gap:1.4em; } 
	.board_list .content_wrap li .txt span		{ margin-top:6px;} 
}
@media screen and (max-width:768px) {  
	.board_list .content_wrap						{grid-template-columns:repeat(auto-fit, minmax(250px, 1fr)); } 
}
  
    

/*  게시글 뷰  ==================================================================================== */
.board_view													{ }
.board_view_top											{position:relative;display:flex; gap:2.4em; }
.board_view_top .img									{position:relative;width:35%;border:1px solid #e5e5e5; }
.board_view_top .img img							{width:100%;}
.board_view .tit_wrap									{flex:2;padding:10px 0  ;  border-top:0 solid #555;  } 
.board_view .tit_wrap .cate							{display:inline-block; padding:5px 10px; color:#fff; background:var(--color1); margin:0 0 10px 0;  border-radius:2px; }
.board_view .tit_wrap .tit								{font-size:1.6em;line-height:1.3;   color:#222; font-weight:700;padding:0 0 15px 0;  border-bottom:1px solid #ddd;}  
.board_view .tit_wrap .tit	 span					{color:var(--color1);}
.board_view .tit_wrap .data							{padding:20px 0 ; }
.board_view .tit_wrap .data dl						{position:relative; padding:6px 0;font-weight:300; font-size:0.95em;display:flex; gap:12px; } 
.board_view .tit_wrap .data dt					{position:relative; display:inline-block; min-width:100px;color:#555;  padding:0 15px;   } 
.board_view .tit_wrap .data dt:before		{position:absolute; content:''; left:3px; top:9px; width:3px; height:3px; background:#666; border-radius:50%;}
.board_view .tit_wrap .data dt:after			{position:absolute; content:'';  right:0; top:3px; width:1px; height:1em; background:#ddd;  }
.board_view .tit_wrap .data dd					{flex:2;}

.board_view .tit_wrap .info							{padding:35px 30px  ;background:#fff;color:#333; font-size:0.95em;border-bottom:1px solid #e9e9e9;border-top:1px dashed #e0e0e0; }
.board_view .tit_wrap .info .tel					{color:#f45c00;font-weight:500;letter-spacing:0;padding:10px 0 0 0; }
.board_view .tit_wrap .info .tel span			{display:inline-block;padding:0 20px 0 0; font-weight:500;}
.board_view .tit_wrap .info .tel i					{display:inline-block;text-align:center; font-size:0.8em;width:30px;height:30px;line-height:29px; margin-right:10px;border:1px solid #d5dae2;color:#afb7c3;border-radius:50px; }

.board_view .tit_wrap .btn_wrap								{position:relative;padding:45px   0 0 0;text-align:center;  display: flex; flex-flow:wrap;justify-content:center; gap:1%; }
.board_view .tit_wrap .btn_wrap span						{position:relative;display:inline-block; line-height:60px;font-size:1.1em;font-weight:500; width:32.5%;transition:all 0.3s ease;}
.board_view .tit_wrap .btn_wrap .btn01					{ border:1px solid #2071f8;background:#2071f8;color:#fff; }
.board_view .tit_wrap .btn_wrap .btn02					{ border:1px solid #666;background:#fff;  }
.board_view .tit_wrap .btn_wrap .btn01 a				{display:block; color:#fff;font-weight:500; }
.board_view .tit_wrap .btn_wrap .btn02 a				{display:block;color:#222;font-weight:500; }
.board_view .tit_wrap .btn_wrap span:hover			{border:1px solid #111;background:#222;  }
.board_view .tit_wrap .btn_wrap span:hover a			{ color:#fff  ;}


.board_view .name												{padding:20px 20px 20px 0; text-align:right;font-size:0.9rem;color:#999; }

.board_view .content_wrap									{overflow:hidden;padding:40px 10px; word-break:break-all; min-height:300px;  }
.board_view .content_wrap img							{max-width:100%; }
 
.board_view .video_wrap										{text-align:center;margin-bottom:40px;}
.board_view .video_wrap .youtube_iframes		{width:720px; height:480px; } 
 
.board_view .btn_wrap										{padding:40px 0 ; text-align:center; overflow:hidden; border-top:2px solid #333; }
.board_view .btn_wrap .bbs_btn02					{margin-right:3px;} 
.board_view .bwrite_cm										{padding-top:20px;}



@media screen and (max-width:1024px) {
    .board_view_top											{  gap:2em; }
    .board_view_top .img									{ width:38%;  }
	.board_view .tit_wrap .tit					            {font-size:1.5em;  }
    .board_view .tit_wrap .data							{padding:15px 0 ; }
	.board_view .tit_wrap .data dt					{ min-width:90px; } 
 } 
@media screen and (max-width:768px) {
	.board_view_top											{ flex-direction: column; gap:15px; }
	.board_view_top .img									{ width:100%; }
	.board_view .tit_wrap .tit					            {font-size:1.35em; padding:0 0 15px 0; border-bottom:0; }
	.board_view .tit_wrap .name						{font-size:0.85em;}
	.board_view .tit_wrap .data							{padding:0  ;  } 
	.board_view .tit_wrap .data dt					{ min-width:85px; } 
	.board_view .tit_wrap .btn_wrap				{ padding:30px   0; }
	.board_view .tit_wrap .btn_wrap span		{  line-height:50px; font-size:1em;}

	.board_view .content_wrap					{padding:30px 10px;}
	.board_view .btn_wrap						{padding:20px 0;}
}
@media screen and (max-width:800px) { 
	.board_view .tit_wrap .name					{ padding:5px 0 0 0; }
	.board_view .content_wrap						{padding:25px 0;}
}




/* 뷰페이지 버튼, 이전, 다음글	 ======================================*/  
.board_view .pn_wrap										{position:relative; display: flex; flex-direction: column; }
.board_view .pn_wrap li.next							{order:1;} 
.board_view .pn_wrap li.prev							{order:2;  }
.board_view .pn_wrap li									{position:relative; font-size:0.9em; border-top:1px solid #ddd;  } 
.board_view .pn_wrap li div,
.board_view .pn_wrap li a								{position:relative;display:block; color:#555;  display: grid; grid-template-columns:160px auto;  } 
.board_view .pn_wrap li span							{position:relative;display:inline-block;  padding:20px 0 20px 45px;  font-weight:500; color:#222;  transition:all 0.3s ease;}
.board_view .pn_wrap li p								{position:relative;display:inline-block; color:#777;  padding:20px 0;overflow:hidden; text-overflow:ellipsis; white-space:nowrap;  text-overflow:ellipsis; -o-text-overflow:ellipsis;  word-break:break-all;   }
.board_view .pn_wrap li.next::before			{content:''; position:absolute; top:32px; left:20px; border:solid #444; border-width:1px 1px 0 0;  padding:4px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg);} 
.board_view .pn_wrap li.prev::before				{content:''; position:absolute; top:27px; left:20px; border:solid #444; border-width:1px 1px 0 0;  padding:4px; transform: rotate(135deg); -webkit-transform: rotate(135deg);}
.board_view .pn_wrap li a p:hover					{text-decoration:underline; }

.board_view .file_wrap 									{position:relative; padding:20px 0  ;font-size:0.95em; overflow:hidden; border-bottom:1px solid #ddd; display: grid; grid-template-columns:160px auto;   transition:all 0.3s ease;} 
.board_view .file_wrap .tit								{  padding-left:20px; color:#222;}
.board_view .file_wrap .tit i								{font-size:0.95em; margin-right:10px; color:#444;} 
.board_view .file_wrap li									{position:relative;  font-size:0.9em;color:#888;padding:4px 0 4px 22px; line-height:1.3;  transition:all 0.3s ease;}
.board_view .file_wrap li i								{display:none; }
.board_view .file_wrap li::before					{content:''; position:absolute; left:0; top:6px; width:16px; height:16px; background:url('./img/icon_down.png') no-repeat 0 0;  }
 
@media screen and (max-width:800px) {  
	.board_view .pn_wrap li div,
	.board_view .pn_wrap li a							{ grid-template-columns:110px auto;  } 
	.board_view .pn_wrap li span						{padding:15px 0 15px 30px; }
	.board_view .pn_wrap li p							{ padding:15px 0; }
	.board_view .pn_wrap li.next::before		{  top:27px; left:10px; padding:3px;}
	.board_view .pn_wrap li.prev::before			{  top:23px; left:10px; padding:3px;} 
	.board_view .file_wrap 								{  padding:15px 0  ;font-size:0.9em; grid-template-columns:110px auto;   }
	.board_view .file_wrap .tit							{  padding-left:5px;}
}
@media screen and (max-width:600px) {   
	.board_view .pn_wrap li div,
	.board_view .pn_wrap li a 							{font-size:0.95em;   grid-template-columns:90px auto;}
	.board_view .pn_wrap li span						{ padding:12px 0 12px 28px;}
	.board_view .pn_wrap li p							{ padding:12px 0  ;  } 
	.board_view .pn_wrap li.next::before		{  top:23px; left:10px;  }
	.board_view .pn_wrap li.prev::before			{  top:19px; left:10px;  } 

	.board_view .file_wrap 								{  padding:12px 5px  ; grid-template-columns:1fr;   }
	.board_view .file_wrap .tit							{ display:none;}
}
/* 뷰페이지 버튼, 이전, 다음글	 ======================================*/  



/*  게시글 폼  ==================================================================================== */
.board_form													{margin:  auto;  border-top:1px solid #999;} 
.board_form .tit												{color:#444; font-weight:600; padding:19px 10px;line-height:1.1em;font-size:0.9em; text-align:center; background-color:#f5f5f5;   }
.board_form table											{border-collapse:collapse; width:100%; table-layout:fixed; }
.board_form .thsize										{width:15%;}
.board_form table tbody th							{padding:10px 20px;  border:1px solid #e5e5e5; color:#555;background:#fafafa;font-size:0.9em; text-align:center;  line-height:1.3; }
.board_form table tbody th:first-child			{border-left:0;}
.board_form table tbody th:last-child			{border-right:0;} 
.board_form table tbody th span					{display:block;font-size:0.85em;color:#ec0b0b;}
.board_form table tbody td							{  padding:12px ;  word-break:break-all;   border:1px solid #e5e5e5; font-size:0.9em; } 
.board_form table tbody td:first-child			{border-left:0;}
.board_form table tbody td:last-child			{border-right:0;} 

.board_form table tbody td .textarea_form		{font-size:0.9em;} 
.board_form .btn_wrap								{padding:40px 0; overflow:hidden; text-align:center; }
 
@media screen and (max-width:800px) {
.board_form .thsize										{width:80px;}
.board_form table tbody th							{padding:8px  ;font-size:0.85em; text-align:center;  } 
.board_form table tbody td							{padding:8px  ;font-size:0.9em;}
}

/*  게시글 폼  ==================================================================================== */

