@charset "utf-8";

/* 좌우 버튼을 양 끝 거터에 두고, 그 안쪽(slk_view)에서만 배너가 흐르는 반응형 스트립 */
/* 콘텐츠 라인(1560 + 좌우 20px)은 이 래퍼가 담당 - .site_link 는 풀폭(상단 경계선 전체 폭용) */
.slk_wrap{position:relative; display:flex; align-items:center; gap:6px; width:100%; max-width:1560px; margin:0 auto; padding:16px 20px; box-sizing:border-box;}
.slk_view{flex:1 1 auto; min-width:0; overflow:hidden; position:relative;}

/* 좌우 버튼 : 캡쳐 시안 - 흰 배경 + 연회색 테두리 사각 박스 + 진한 쉐브론, 상시 노출 */
.slk_btn{flex:0 0 56px; display:flex; align-items:center; justify-content:center; width:56px; height:56px; background:#fff; border:1px solid #c9c9c9; border-radius:6px; color:#222; text-decoration:none; box-sizing:border-box; transition:border-color 0.2s ease, color 0.2s ease, background 0.2s ease;}
.slk_btn:hover{border-color:#669900; color:#557f00; background:#f7fbee;}
.slk_btn svg{display:block;}
.slk_nobtn .slk_btn{visibility:hidden;}

.slk_view .jCarouselLiteCommon{position:relative; visibility:hidden; overflow:hidden; margin:0;}
/* JS 초기화 전: 목록이 세로로 쌓여 거대한 공백을 만들지 않도록 높이 고정 */
.slk_view .jCarouselLiteCommon:not(.slk_done){height:110px; max-height:110px;}
.slk_view .jCarouselLiteCommon:not(.slk_done) li{float:left; width:220px;}
/* 좌우 버튼은 초기화 완료 후에만 표시 */
.slk_wrap .slk_btn{opacity:0; pointer-events:none;}
.slk_wrap.slk_ready .slk_btn{opacity:1; pointer-events:auto; transition:opacity 0.25s ease, border-color 0.2s ease, color 0.2s ease, background 0.2s ease;}
.slk_wrap.slk_ready.slk_nobtn .slk_btn{visibility:hidden;}
.slk_view ul{margin:0; padding:0; list-style:none;}
.slk_view li{list-style:none; display:block;}

.slk_card{display:flex; align-items:center; justify-content:center; background:#fff; border:1px solid #e5e5e5; border-radius:6px; padding:12px 16px; box-sizing:border-box; transition:border-color 0.2s ease, box-shadow 0.2s ease;}
.slk_card:hover{border-color:#9dc23f; box-shadow:0 2px 8px rgba(0,0,0,0.06);}
.slk_card img{height:100%; width:auto; max-width:100%; object-fit:contain; display:block;}

.slk_view .noimage{background:url('../img/noimage.png') no-repeat center; background-size:contain; border:1px solid #eee; border-radius:6px;}

.slk_static ul{display:flex; flex-wrap:nowrap; justify-content:center;}

@media (max-width:560px){
	.slk_wrap{padding:12px 20px; gap:2px;}
	.slk_btn{flex-basis:40px; width:40px; height:40px;}
	.slk_btn svg{width:16px; height:16px;}
}
