@charset "utf-8";
/* 새글 스킨 (latest) - 규격화 + 카드 균일 정렬 버전 */

.dd_pic_swiper {
}

/* ===== 카드(li) 자체를 동일 높이로 ===== */
.dd_pic_swiper .swiper-slide {
  height: auto;        /* swiper 기본값 덮어쓰기 */
  display: flex;
}

/* ===== 카드 내부를 세로 flex로 정렬 ===== */
.dd_pic_swiper a {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-bottom: 1.6rem;
  border-bottom: 1px solid var(--line-color);
  text-decoration: none;
  color: inherit;
}

/* ===== 1. 이미지 박스 규격화 (고정 비율) ===== */
.dd_pic_swiper .img_box {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;          /* 폭보다 높이가 살짝 큰 세로형 */
  margin-bottom: 1.6rem;
  overflow: hidden;
  border-radius: 1.6rem;
  background: #f5f5f5;
  flex-shrink: 0;               /* 이미지는 줄어들지 않도록 */
}

.dd_pic_swiper .img_box img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.4s ease;
}

.dd_pic_swiper a:hover .img_box img {
  transform: scale(1.05);
}

/* ===== 2. 제목: 한 줄 고정 ===== */
.dd_pic_swiper strong {
  display: block;
  font-size: 1.8rem;
  font-weight: 500;
  margin-bottom: 0.8rem;
  line-height: 1.4;

  /* 한 줄 처리 + 높이 고정 */
  height: 2.52rem;              /* font-size 1.8 × line-height 1.4 */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ===== 3. 설명: 2줄 고정 ===== */
.dd_pic_swiper p {
  font-size: 1.5rem;
  line-height: 1.5;
  margin-bottom: 0.8rem;
  opacity: 0.75;

  /* 정확히 2줄 높이 고정 */
  height: 4.5rem;               /* font-size 1.5 × line-height 1.5 × 2줄 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}

/* ===== 4. 날짜: 항상 카드 맨 아래 정렬 ===== */
.dd_pic_swiper small {
  color: var(--body-color);
  font-size: 1.4rem;
  opacity: 0.5;
  margin-top: auto;             /* 핵심! 남은 공간을 위로 밀어 하단 고정 */
  display: block;
}

/* ===== 반응형 보정 (모바일에서 높이 살짝 조정) ===== */
@media (max-width: 768px) {
  .dd_pic_swiper strong {
    font-size: 1.6rem;
    height: 2.24rem;
  }
  .dd_pic_swiper p {
    font-size: 1.4rem;
    height: 4.2rem;
  }
}