/* 접근성 유틸 */
.sound_only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* 리스트 컨테이너 */
.lat_list_one{position:relative;background:#fff}
.lat_list_one ul{padding-bottom:14px;margin:0;}
.lat_list_one li{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:12px;
  padding-bottom: 12px;
}
.lat_list_one li:last-child{border-bottom:none}

/* ========== 1) 첫 번째 게시물: 큰 레이아웃 ========== */
.lat_item--first{
  display:flex !important;
  justify-content:space-between;
  align-items:flex-end !important;
  gap:12px;
  border-bottom:1px solid var(--gray1,#eee) !important;
}
.lat_item--first .lat_title--first{
  display:block;
  font-size:20px;
  font-weight:700;
  color:#111;
  text-decoration:none;
  margin-bottom:6px;
  overflow:hidden;
  text-overflow:ellipsis;
}
/* 첫 글 요약 */
.lat_item--first .lat_excerpt{
  margin:12px 0 0 0;
  color:#555;
  font-size:15px;
  font-weight:400;
  line-height:1.6;
  min-height:48px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.lat_title--2lines{
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  line-height:1.4;
}

/* ========== 스킨 내부 더보기 숨김(공용 버튼 사용) ========== */
.one_more{display:none !important;}
.plus-icon{display:none !important;}

/* ========== 2) 나머지 게시물: 한 줄 고정 ========== */
/* 공통: 첫 글 제외 아이템 */
.lat_list_one li:not(.lat_item--first){
  display:grid;
  align-items:center;
  /* 기본은 배지 없음 가정 = 2열(제목 | 날짜) */
  grid-template-columns: minmax(0,1fr) auto;
  column-gap:8px;         /* 좌우 컬럼 간격만, 왼쪽엔 gap 없음 */
  row-gap:12px;
  padding: 10px 0;
}

/* 배지가 실제로 있을 때만 3열로 전환 (배지 | 제목 | 날짜) */
.lat_list_one li:not(.lat_item--first):has(.lat_badge){
  grid-template-columns:auto minmax(0,1fr) auto;
}

/* 제목 한 줄 고정 (… 없이) + 끝부분 깔끔하게 보정 */
.lat_list_one li:not(.lat_item--first) .lat_title{
  position:relative;
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:clip;       /* … 안 씀 */
  word-break:keep-all;      /* 한글/영문 섞여도 단어 경계 유지 */
  padding-right:14px;       /* 마지막 글자 여유 */
	color: #000;
}

/* 작은 해상도에서 끝단 페이드(지원 브라우저) */
@media (max-width:1280px){
  .lat_list_one li:not(.lat_item--first) .lat_title{
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 16px),rgba(0,0,0,0));
            mask-image:linear-gradient(90deg,#000 calc(100% - 16px),rgba(0,0,0,0));
  }
  .lat_item--first .lat_excerpt {min-height: auto;}
}
/* 마스크 미지원 fallback: 배경에 맞춘 그라데이션 오버레이 */
@media (max-width:1280px){
  .lat_list_one li:not(.lat_item--first) .lat_title::after{
    content:"";
    position:absolute; inset:0 0 0 auto; width:16px;
    pointer-events:none;
    background:linear-gradient(90deg,rgba(255,255,255,0), #fff 70%); /* 배경색이 다르면 #fff 변경 */
  }
}

/* 배지가 있을 때는 제목 위치를 가운데 칼럼으로 */
.lat_list_one li:not(.lat_item--first):has(.lat_badge) .lat_title{ grid-column:2 / 3; }

/* 날짜는 항상 마지막 칼럼 */
.lat_list_one li:not(.lat_item--first) .lt_date{
  grid-column:-2 / -1;    /* 마지막 칼럼 */
  white-space:nowrap;
  color:#6F6F6F;
  min-width:10ch;         /* 'YYYY-MM-DD' 폭 */
  text-align:right;
}

/* 배지 스타일(있을 때만 보임) */
.lat_list_one li:not(.lat_item--first) .lat_badge{
  display:inline-block;
  white-space:nowrap;
  background:#D9E4F8;
  padding:4px 10px;
  font-size:13px;
}

/* 배지를 숨길 경우(원하면) */
.lat_list_one li:not(.lat_item--first) .lat_badge.is-hidden{ display:none !important; }

/* 댓글수 붙을 때 줄바꿈 방지 */
.lat_list_one li:not(.lat_item--first) .lat_title .lt_cmt{
  white-space:nowrap; display:inline-block; vertical-align:baseline;
}

/* hover */
.lat_list_one li:not(.lat_item--first) .lat_title:hover{
  text-decoration:underline;
  font-weight:600;
}

/* ========== 반응형 ========== */
/* PC: 첫 항목 레이아웃 보정 */
@media (min-width:1025px){
  .lat_item--first .one_more{flex:0 0 48px;}
}

/* 태블릿/모바일 */
@media (max-width:1024px){
  .lat_item--first{position:relative;}
  .lat_item--first .lat_first_body{flex-basis:100%;max-width:none;}
  .lat_list_one li{gap:8px;border-bottom:1px solid var(--gray1);}
  .lat_item--first{padding:0 0 14px !important;}
  .lat_list_one{margin-bottom:20px;}

  .lat_list_one li:not(.lat_item--first) .lat_badge{font-size:14px;padding:4px;}
  /* 모바일에서도 항상 1줄 유지 */
  .lat_list_one li:not(.lat_item--first) .lat_title{
    font-size:16px;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:clip !important;
    padding-right:14px;
  }
  .lat_list_one li:not(.lat_item--first) .lt_date{font-size:14px;white-space:nowrap;}
}

/* 모바일에서 배지 시각적 숨김(선택) */
@media (max-width:960px){
  .lat_badge{
    position:absolute !important;width:1px !important;height:1px !important;
    padding:0 !important;margin:-1px !important;overflow:hidden !important;
    clip:rect(0 0 0 0) !important;clip-path:inset(50%) !important;border:0 !important;
    white-space:nowrap !important;
  }
}

/* 중간 해상도에서도 1줄 강제(덮어쓰기 방지) */
@media (min-width:1025px) and (max-width:1360px){
  .lat_list_one li:not(.lat_item--first){grid-template-columns:auto minmax(0,1fr) auto !important;}
  .lat_list_one li:not(.lat_item--first) .lat_title{
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:clip !important;
    padding-right:14px;
  }
}