@charset "utf-8";

/* 새글 스킨  */
.latdate_code {position: relative;margin-bottom: 0px !important;background:none !important;border: 1px solid #ebebeb !important;
  border-radius: 0px;padding: 0px !important;margin-top:0px;background:#ffffff;}
.latdate_code .rank_best {
  display: inline-block;
  width: 14px;
  height: 14px;
  line-height: 14px;
  text-align: center;
  background-color: #b8181a !important;
  color: #fff;
  border-radius: 3px; 
  margin-right: 3px; /* 순위 번호와 제목 사이의 간격 */
}
.latdate_code .category_name {color: #007bff; font-weight: bold;margin-left: 5px; /* 간격 조절 */}
/* 타이틀 밑줄 */
.latdate_code_title_wp a {position: relative;text-decoration: none;
  display:block;line-height:15px !important;font-size: 16px !important;color:#ffffff
}

.latdate_code_title_wp a::after {
  content: '';
  position: absolute;
  bottom: -7px;
  left: 0;
  width: calc(100% + -165px); /* 텍스트보다 약간 더 길게  */
  height: 3px; /* 밑줄의 두께 설정 */
  background-color: #8d41ff;
  z-index: -1;
}

.latdate_code .latdate_code_title {display:block;line-height:15px !important;font-size: 16px !important;color:#253dbe}
.latdate_code .latdate_code_title a {position:relative;color:#ffffff;display:inline-block}

.latdate_code ul {padding:0px 0 !important; margin-bottom: 0px !important;}
.latdate_code li {display: flex; /*가운데 정렬 */align-items: center;position: relative;
  line-height: 5px !important;border-bottom: 1px solid #ebebeb !important;margin-bottom: 0px !important;}
.latdate_code li a {font-weight: bold;font-size: 14px !important;line-height: 30px !important;vertical-align: middle !important;}
.latdate_code li a:hover {color:#3a8afd}
.latdate_code li .fa-heart {color:#ff0000}
.latdate_code li .fa-lock {display:inline-block;line-height:14px;width:16px;font-size:0.833em;color:#4f818c;background:#cbe3e8;text-align:center;border-radius:2px;font-size:12px;border:1px solid #cbe3e8;vertical-align:middle}
.latdate_code li .new_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#ffd500;background:#ffbd41;text-align:center;border-radius:2px;margin-left:2px;font-weight:bold;vertical-align:middle}
.latdate_code li .new_icon {
  left: 0;
}
.latdate_code 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}
/* .latdate_code li .hot_icon {
  position: absolute;
  right: 0;
} */
.latdate_code li .fa-caret-right {color:#bbb}
.latdate_code 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}
.latdate_code 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}

.latdate_code .profile_img img{border-radius:50%}

.latdate_code .lt_info {position: absolute; /* 절대 위치 우측으로 */top: 50%; 
  right: 10px;transform: translateY(-50%);font-size: 12px;color: #666;}
  .latdate_code .lt_info .lt_nick {}
.latdate_code .lt_info .lt_date {color:#888}

/* pc일경우 가로 두개씩 */
.latdate_code .latest_list_grid {display: flex;flex-wrap: wrap; /* 줄 바꿈을 허용 */margin: 0px;
  padding: 10px 10px !important;width: 100%; list-style: none; /* ul스타일 제거 */background-color:#fff;
}
.latdate_code .basic_li {flex: 1 1 50%; box-sizing: border-box; /* 패딩테두리를 포함한 너비 계산 */text-align: center; }
@media screen and (max-width: 768px) { /* mobile에서는 한 개씩 */
  .latdate_code .basic_li {
    flex: 1 1 100%; 
  }
}


.latdate_code .empty_li {line-height:5px !important;color:#666;text-align:center;padding:0}
.latdate_code .empty_li:before {background:none;padding:0}

.latdate_code .lt_cmt {background:#e9eff5;color:#3a8afd;font-size:11px;height:16px;line-height:16px;padding:0 5px;border-radius:3px;vertical-align:middle}
.latdate_code .lt_more {position:absolute;top:11px;right:0;display:block;width:40px;line-height:25px;color:#3a8afd;border-radius:3px;text-align:center}
.latdate_code .lt_more:hover {color:#777}