/* 전체 영역 */
.aving-news {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, "Noto Sans KR", sans-serif;
  color: #111;
  max-width: 700px; /* PC 최대 폭 */
  width: 100%;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}

/* 리스트: 세로 배열 */
.aving-news .news-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* 카드 스타일 */
.aving-news .news-item {
  border: 1px solid #e9eef3;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: box-shadow .25s ease, transform .25s ease;
}
.aving-news .news-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,0.15);
}

/* 링크 전체 클릭화 */
.aving-news .news-link {
  display: flex;
  gap: 16px;
  padding: 16px;
  text-decoration: none;
  color: inherit;
  align-items: flex-start;
  transition: color .25s ease;
}

/* 썸네일: 80x80 고정 */
.aving-news .thumb {
  width: 80px;
  height: 80px;
  object-fit: cover;
  flex: 0 0 80px;
  border-radius: 8px;
  background: #f4f6f8;
}

/* 텍스트 영역 */
.aving-news .meta {
  flex: 1;
  min-width: 0;
  text-align: left !important;
}
.aving-news .title {
  font-size: 1.05rem;
  line-height: 1.4;
  margin: 0 0 6px 0;
  text-align: left !important;
  color: #1f2937; /* 기본 진회색 */
  transition: color .25s ease;
}
.aving-news .excerpt {
  font-size: .93rem;
  line-height: 1.55;
  margin: 0;
  color: #475569;
  text-align: left !important;
  transition: color .25s ease;
}

/* hover 시 텍스트 색상 변경 */
.aving-news .news-item:hover .title {
  color: #2563eb; /* 파란색 계열 */
}
.aving-news .news-item:hover .excerpt {
  color: #334155; /* 약간 진한 slate 톤 */
}

/* 말줄임 처리 */
.aving-news .title,
.aving-news .excerpt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.aving-news .title { -webkit-line-clamp: 2; max-height: 2.8em; }
.aving-news .excerpt { -webkit-line-clamp: 2; max-height: 3.1em; }

/* 포커스 스타일 */
.aving-news .news-link:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(59,130,246,.35);
  border-radius: 10px;
}

/* 모바일 반응형 */
@media (max-width: 540px) {
  .aving-news .news-link {
    flex-direction: column;
    align-items: flex-start;
  }
  .aving-news .thumb {
    width: 100%;
    height: auto;
    max-height: 200px;
  }
}