/* 탭 */
.tab-wrap{margin-bottom: 15px;}

.tab-cnt {display: flex; padding: 8px; background: #ececec; border-radius: 30px; width: fit-content; position: relative; list-style: none; z-index: 1;}
.tab-item{width:auto;border-radius: 25px; text-align: center;}
.tab-item em{font-weight: 600;}
.tab-item > a { position: relative; display: inline-block; padding: 8px 20px; text-decoration: none; color: #333; transition: color 0.4s; z-index: 2;}

.nav-blind {position: absolute; top: 8px; left: 0; height: calc(100% - 16px); background: #333; border-radius: 25px; transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); z-index: -1;}

.tab-item.active > a em {color: #fff;}


/*썸네일형*/
.board-wrap{padding:15px 0;}
.board-list{display: grid; grid-template-columns: repeat(auto-fill, 32%);justify-content: space-between;grid-gap: 15px;}
.board-list>li{position: relative; display: flex; flex-direction: column; align-items: normal; width: 100%;}
.board-tag{width:fit-content; color: #333; border:1px solid #333; min-height: 2.4rem; padding: 4px 6px; border-radius: 0.5rem; line-height: 1.5;font-size:13px;}
.thumb{display:block;height:250px;}
.thumb>img{object-fit: contain; width: 100%; height: 100%;}
.product{display:flex;flex-direction: column;gap:5px;}
.product_name{font-size:18px;margin-top: 10px;}
.product_code{font-size:14px;}
.btn-product{width: 100%; display: block; text-align: center; border:1px solid #333; border-radius: 20px; background-color: #333; padding: 8px 10px; font-size: 16px; color: #fff; margin-top: 10px;}
.btn-product:hover{background-color:#fff;}

/* 보도 */
.article-title{width:100%;overflow: hidden;}
.article-info{display:flex;color:#0087ff;}
.article-info>span{color:#000;margin-left:5px;}
.article-info>span::before{content:'|';font-size:14px;color:#ddd;margin-right:5px;}
.article-tit{font-size: 2rem; color: #000; font-weight: 500; display: block; line-height: 1.4em; height: 2.8em; overflow: hidden;white-space: normal; word-wrap: break-word; word-break: break-all; text-overflow: ellipsis;}

.article-thum{position: relative; height: 0; padding-bottom: 63%; overflow: hidden; margin-bottom: 15px;}
.article-thum>img{position: absolute;left: 0;top: 0;width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; -webkit-transition: transform 0.5s ease;}
.article-box:hover .article-thum>img{transform: scale(1.2);}

/*고객사*/
.client-list {display: flex;flex-wrap: wrap;gap: 20px;justify-content: center;padding: 50px 0;}
.client-list .client-item {width: calc(100% / 6 - 20px);aspect-ratio: 3 / 2;display: flex;align-items: center;justify-content: center;background: #f9f9f9;border: 1px solid #eee;padding: 15px;height:80px;}
.client-list .client-item img {max-width: 100%;max-height: 100%;}

/* 모바일 대응 */
@media (max-width: 1024px) {
  .client-list .client-item { width: calc(100% / 4 - 20px); } /* 한 줄에 4개 */
}
@media (max-width: 768px) {
  .client-list .client-item { width: calc(100% / 2 - 20px); } /* 한 줄에 2개 */
}

/* 탭 */
.tab-cnt{
  flex-wrap: wrap;
}

/* 썸네일 */
.thumb{
  height: auto;
  aspect-ratio: 4 / 3;
}
.thumb > img{
  object-fit: cover;
}

/* ---- Tablet (<= 1024px) ---- */
@media (max-width: 1024px){
  .tab-item{ width: 32%; min-width: 160px; }
}

/* ---- Mobile (<= 768px) ---- */
@media (max-width: 768px){
  .tab-cnt{
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 10px;
    padding-bottom: 6px;
  }
  .tab-item{
    flex: 0 0 auto;
    width: 200px;
    height: auto;
  }
  .tab-item > a{ padding: 14px; }

  /* 카드: 2열 정도 유지 */
  .board-list{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-gap: 12px;
  }
  .board-list>li{ padding: 16px; }

  .product_name{ font-size: 16px; }
  .product_code{ font-size: 13px; }
  .btn-product{ font-size: 14px; padding: 10px; }
}

/* ---- Small Mobile (<= 480px) ---- */
@media (max-width: 480px){
  .board-list{
    grid-template-columns: 1fr;
  }

  .tab-item{ width: 180px; }
}