@charset "utf-8";

/* 갤러리 목록 */

.board_catalog > li{ position: relative; margin-bottom: 10px;}
.board_catalog > li .chk_box{position: absolute; top: 10px; left: 10px;}
.board_catalog > li .in_w{border:1px solid #999; padding:25px; transition: .3s; border-radius: 10px;}
.board_catalog > li .in_w:hover{border-color:var(--mainColor); background-color: #f7f7f7;}
.board_catalog > li .in_w .cata_img{width:300px; line-height: 1;}
.board_catalog > li .in_w .cata_tit{font-size:1.5em; font-weight: 500; width:calc(100% - 550px); padding: 0 50px;}
.board_catalog > li .in_w .cata_down{ display: inline-block; padding:17px 30px; background-color: #ddd; color:#222; border-radius: 50px; line-height: 1; transition: .3s; font-size: 1.068em; margin-left: auto;}
.board_catalog > li .in_w .cata_down:hover{background-color:var(--mainColor); color:#fff;}
.board_catalog > li .in_w .cata_down .xi{vertical-align: bottom; font-size: 1.068em;}
 



/*======================================================================
  카탈로그 목록 - 홈페이지 톤앤매너 적용 (2026-09-18 추가분)
  - 위쪽 기존 스타일은 수정하지 않고 아래에 분리해서 작성
======================================================================*/

.board_catalog > li{margin-bottom:20px;}
.board_catalog > li:last-child{margin-bottom:0;}
.board_catalog > li .chk_box{top:20px; left:20px; z-index:2;}
.board_catalog > li .in_w{padding:30px; border:1px solid #e5e5e5; border-radius:var(--item_r); background:#fff; box-shadow:0 10px 24px rgba(0,0,0,.04); transition:border-color .3s, transform .3s;}
.board_catalog > li .in_w:hover{border-color:var(--mainColor);}
.board_catalog > li .in_w .cata_img{overflow:hidden; width:260px; border:1px solid #ededed; border-radius:calc(var(--item_r) * .6); background:#f7f7f8;}
.board_catalog > li .in_w .cata_img img{display:block; transition:transform .4s;}
.board_catalog > li .in_w .cata_img .no_image{height:170px; color:#bbb; font-size:1em;}
.board_catalog > li .in_w .cata_img .no_image .xi{display:block; margin-bottom:6px; font-size:2em;}
.board_catalog > li .in_w .cata_tit{flex:1; width:auto; padding:0 50px; font-size:1.5em; font-weight:700; color:#111; line-height:1.4; word-break:keep-all;}
.board_catalog > li .in_w .cata_tit:before{content:'Catalog'; display:block; margin-bottom:12px; font-size:.667em; font-weight:700; letter-spacing:.5px; color:var(--mainColor);}
.board_catalog > li .in_w .cata_down{display:inline-flex; align-items:center; gap:10px; flex:0 0 auto; height:60px; padding:0 34px; border:1px solid var(--mainColor); border-radius:50px; background:var(--mainColor); color:#fff; font-size:1.063em; font-weight:700; line-height:1; transition:.3s;}
.board_catalog > li .in_w .cata_down:hover{border-color:#111; background:#111; color:#fff;}
.board_catalog > li .in_w .cata_down .xi{vertical-align:middle; font-size:1.125em;}
.board_catalog > li .in_w .cata_down.is_empty{border-color:#ddd; background:#f5f5f5; color:#999; cursor:default;}


/*======================================================================
  반응형 (2026-10-06 추가)
======================================================================*/
@media screen and (max-width:1300px){
    .board_catalog > li .in_w{padding:26px;}
    .board_catalog > li .in_w .cata_img{width:220px;}
    .board_catalog > li .in_w .cata_tit{padding:0 34px; font-size:1.375em;}
    .board_catalog > li .in_w .cata_down{height:56px; padding:0 28px; font-size:1em;}
}
@media screen and (max-width:1024px){
    .board_catalog > li{margin-bottom:16px;}
    .board_catalog > li .in_w{padding:22px;}
    .board_catalog > li .in_w .cata_img{width:170px;}
    .board_catalog > li .in_w .cata_img .no_image{height:120px;}
    .board_catalog > li .in_w .cata_tit{padding:0 24px; font-size:1.25em;}
    .board_catalog > li .in_w .cata_tit:before{margin-bottom:8px;}
    .board_catalog > li .in_w .cata_down{height:52px; padding:0 22px; gap:8px;}
}
@media screen and (max-width:768px){
    /*썸네일 + 제목 한 줄, 버튼은 아래 전체폭*/
    .board_catalog > li .chk_box{top:14px; left:14px;}
    .board_catalog > li .in_w{padding:18px; align-items:flex-start;}
    .board_catalog > li .in_w .cata_img{width:110px;}
    .board_catalog > li .in_w .cata_img .no_image{height:86px; font-size:.875em;}
    .board_catalog > li .in_w .cata_img .no_image .xi{font-size:1.5em;}
    .board_catalog > li .in_w .cata_tit{padding:0 0 0 18px; font-size:1.125em;}
    .board_catalog > li .in_w .cata_down{flex:1 1 100%; justify-content:center; height:50px; margin-top:18px; padding:0 18px;}
}
@media screen and (max-width:500px){
    /*세로 1단*/
    .board_catalog > li .in_w{padding:16px;}
    .board_catalog > li .in_w .cata_img{width:100%;}
    .board_catalog > li .in_w .cata_img .no_image{height:150px;}
    .board_catalog > li .in_w .cata_tit{flex:1 1 100%; padding:16px 0 0; font-size:1.063em;}
    .board_catalog > li .in_w .cata_down{margin-top:14px; font-size:1em;}
}
