@charset "utf-8";

/* 새글 스킨 기본 레이아웃 */
.pic_poster { position: relative; margin-bottom: 20px; }
.pic_poster .lat_title { display: block; line-height: 45px; font-size: 1.2em; color: #253dbe; }
.pic_poster .lat_title a { color: #000; display: inline-block; position: relative; }
.pic_poster .lt_more { position: absolute; top: 11px; right: 0; display: block; width: 40px; line-height: 25px; color: #3a8afd; border-radius: 3px; text-align: center; }
.pic_poster .lt_more:hover { color: #777; }
.pic_poster ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; list-style: none; padding: 0; margin: 0; }
.pic_poster ul:after { display: block; visibility: hidden; clear: both; content: ""; }

/* 게시물 카드 박스 (기본 사이즈 고정) */
.pic_poster li { width: 100%; text-align: center; border: 1px solid #f0f0f0; border-radius: 6px; overflow: hidden; background: #fff; box-sizing: border-box; }
.pic_poster li .lt_img { display: flex; flex-direction: column; text-decoration: none; color: inherit; height: 100%; }

/* 이미지 프레임: 기본 크기 완벽 고정 창문 역할 */
.pic_poster li .img_wrap { display: block; width: 100%; aspect-ratio: 1 / 1.2; background-color: #fcfcfc; overflow: hidden; position: relative; transform: translateZ(0); }
.pic_poster li .img_wrap img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; margin: 0 auto; transition: transform 0.4s ease; backface-visibility: hidden; will-change: transform; }

/* 마우스 Hover 시: 프레임은 고정된 채 내부 이미지만 부드럽게 확대 */
.pic_poster li:hover .img_wrap img { transform: scale(1.04); }

/* 텍스트 영역 */
.pic_poster li .lt_tit { display: block; padding: 20px 15px; font-size: 23px; font-weight: 500; word-break: keep-all; transition: color 0.2s ease; }
.pic_poster li:hover .lt_tit { color: #008080; }

/* 아이콘 스타일 */
.pic_poster li .fa-heart { color: #ff0000; }
.pic_poster li .fa-lock { display: inline-block; line-height: 14px; width: 16px; font-size: 12px; color: #4f818c; background: #cbe3e8; text-align: center; border-radius: 2px; border: 1px solid #cbe3e8; vertical-align: middle; }
.pic_poster li .new_icon { display: inline-block; width: 16px; line-height: 16px; font-size: 0.833em; color: #23db79; background: #b9ffda; text-align: center; border-radius: 2px; margin-left: 2px; font-weight: bold; vertical-align: middle; }
.pic_poster li .hot_icon { display: inline-block; width: 16px; line-height: 16px; font-size: 0.833em; color: #ff0000; background: #ffb9b9; text-align: center; border-radius: 2px; vertical-align: middle; }
.pic_poster li .fa-caret-right { color: #bbb; }
.pic_poster li .fa-download { display: inline-block; width: 16px; line-height: 16px; font-size: 0.833em; color: #daae37; background: #ffefb9; text-align: center; border-radius: 2px; vertical-align: middle; }
.pic_poster li .fa-link { display: inline-block; width: 16px; line-height: 16px; font-size: 0.833em; color: #b451fd; background: #edd3fd; text-align: center; border-radius: 2px; vertical-align: middle; }
.pic_poster .profile_img img { border-radius: 50%; }

/* 기타 공통 */
.lt_info { padding: 10px 0; }
.lt_info .lt_nick { }
.lt_info .lt_date { color: #888; }
.pic_poster .empty_li { line-height: 145px; color: #666; text-align: center; padding: 0; grid-column: 1 / -1; }
.pic_poster .empty_li:before { background: none; padding: 0; }
.pic_poster .lt_cmt { background: #e9eff5; color: #3a8afd; font-size: 11px; height: 16px; line-height: 16px; padding: 0 5px; border-radius: 3px; vertical-align: middle; }

/* 반응형 미디어 쿼리 */
@media all and (max-width : 1024px) { 
	.pic_poster ul { grid-template-columns: repeat(2, 1fr); gap: 20px; } 
	.pic_poster li .lt_tit { font-size: 16px; } 
}

@media all and (max-width : 768px) { 
}

@media all and (max-width : 480px) { 
	.pic_poster ul { grid-template-columns: repeat(1, 1fr); gap: 15px; } 
}