@charset "utf-8";

.xns_gnuboard_latest_gallery_list_style1,
.xns_gnuboard_latest_gallery_list_style1 div,
.xns_gnuboard_latest_gallery_list_style1 span,
.xns_gnuboard_latest_gallery_list_style1 a,
.xns_gnuboard_latest_gallery_list_style1 table,
.xns_gnuboard_latest_gallery_list_style1 tr,
.xns_gnuboard_latest_gallery_list_style1 th,
.xns_gnuboard_latest_gallery_list_style1 td{
  padding:0; margin:0; line-height:normal;
  -webkit-box-sizing:border-box;
     -moz-box-sizing:border-box;
          box-sizing:border-box;
}
.xns_gnuboard_latest_gallery_list_style1 ul,
.xns_gnuboard_latest_gallery_list_style1 li{
  padding:0; margin:0; list-style:none; line-height:normal;
  -webkit-box-sizing:border-box;
     -moz-box-sizing:border-box;
          box-sizing:border-box;
}

.xns_gnuboard_latest_gallery_list_style1{ position:relative; overflow:hidden; width:100%;  max-width: 1200px;
  margin: 0 auto; }

/* 리스트 */
.xns_gnuboard_latest_gallery_list_style1 .gallery_list{ position:relative; overflow:hidden; width:100%; }
.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul{
  position:relative;
  padding:10px;
  overflow:hidden; /* float clear */
}

/* PC 기본: 4열 */
.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li{
  position:relative;
  width:25%;
  float:left;
  display:block;
}

/* 카드 */
.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area{
  position:relative;
  margin:0 5px 10px 5px;
  overflow:hidden;
  border-radius:15px;
}

/* 링크 공통 */
.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a{
  position:relative;
  overflow:hidden;
  display:block;
  text-decoration:none;
}

/* 썸네일 비율 고정 */
.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.thumbnail_link > div{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  overflow:hidden;
}
.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.thumbnail_link img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* 내용 */
.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.content_link{
  height:auto;
  min-height:74px;
  padding:20px 15px 15px 15px;
  background:#1A1E21;
}

.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.content_link .gallery_title{
  position:relative;
  width:100%;
  padding-right:80px;
  overflow:hidden;
  font-size:13px;
  color:#bbb;
  font-weight:bold;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.content_link .date{
  font-size:12px;
  color:#999;
  display:inline-block;
  margin-top:6px;
}

/* 상세보기(PC에서만 보이게) */
.xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.content_link .btn_detail{
  position:absolute;
  top:22px;
  right:15px;
  padding:0 10px;
  overflow:hidden;
  border-radius:15px;
  line-height:30px;
  font-size:13px;
  color:#000;
  font-weight:bold;
  background:#ffef00;
  display:inline-block;
}

/* ===============================
   반응형
=============================== */

/* 태블릿: 3열 */
@media (max-width: 991.98px){
  .xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li{ width:33.3333%; }
}

/* ✅ 모바일: 2열 "절대" 고정 (깨짐 방지 버전) */
@media (max-width: 768px){

  .xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul{
    padding:0px;
  }

  .xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li{
    width:50% !important;
    float:left !important;
    display:block !important;
    padding:0 6px 12px 6px;
  }

  .xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area{
    margin:0 !important;
    border-radius:14px;
  }

  .xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.content_link{
    padding:14px 12px 12px 12px;
    min-height:66px;
  }

  .xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.content_link .gallery_title{
    font-size:13px;
    padding-right:0;
    white-space:normal;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

  .xns_gnuboard_latest_gallery_list_style1 .gallery_list > ul li .content_area > a.content_link .btn_detail{
    display:none !important;
  }
}

/* =========================================================
   ✅ 여기부터 "게시판 제목 + +" 갤러리에도 동일 적용
   (네가 붙인 list_style1 대신 gallery_list_style1로 수정)
========================================================= */
.xns_gnuboard_latest_gallery_list_style1 .title_center{
  position:relative !important;
  height:33px !important;
  padding-bottom:0px !important;
  overflow:hidden !important;
  border-bottom:2px solid #8b8d90 !important;
  text-align:left !important;
  font-weight:600 !important;
  margin-bottom:8px; /* 보기 좋게 살짝 띄움(원하면 0으로) */
} 

.xns_gnuboard_latest_gallery_list_style1 .title_center .btn_more{
  position:absolute !important;
  bottom:3px !important;
  right:0px !important;
  font-size:13px !important;
  display:inline-block !important;
  color:#333 !important;
  text-decoration:none !important;
}

.xns_gnuboard_latest_gallery_list_style1 .title_center span{
  position:relative !important;
  line-height:30px !important;
  font-size:20px !important;
  white-space:nowrap !important;
  display:inline-block !important;
  color:#333 !important;
}
/* ===============================
   상단 타이틀 영역
=============================== */
.title_center {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.title_center .title_link {
  font-size: 20px;
  font-weight: 700;
  color: #111;
  text-decoration: none;
  line-height: 1.2;
}

.title_center .title_link:hover {
  text-decoration: underline;
}

.title_center .btn_more {
  font-size: 13px;
  color: #666;
  text-decoration: none;
  padding: 4px 8px;
  border-radius: 4px;
  background: #f5f5f5;
}

.title_center .btn_more:hover {
  background: #e9e9e9;
  color: #000;
}
