/* Latest Main Visual Skin Style - Title Fix */ .latest-main-visual-skin { width: 100%; box-sizing: border-box; position: relative; overflow: hidden; background: #fff; padding: 15px; display: flex; flex-direction: column; } .latest-main-visual-skin .bbs_main_wrap_tit { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 2px solid #333; flex-shrink: 0; } .latest-main-visual-skin .bbs_main_wrap_tit_l { min-width: 0; } .latest-main-visual-skin .bbs_main_wrap_tit_l h2 { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .latest-main-visual-skin .bbs_main_wrap_tit_r { flex-shrink: 0; margin-left: 15px; } .latest-main-visual-skin .more_btn { position: relative; /* ๐Ÿ’ก [ํ•ต์‹ฌ ์ˆ˜์ •] absolute ์†์„ฑ ๋ฎ์–ด์“ฐ๊ธฐ */ background: none; border: 1px solid #ddd; padding: 5px 10px; font-size: 12px; color: #666; cursor: pointer; border-radius: 3px; } .latest-main-visual-skin .cb { display: none; } /* --- ์ดํ•˜ ๊ธฐ์กด ์Šคํƒ€์ผ ์œ ์ง€ --- */ .visual-grid { display: grid; grid-template-columns: repeat(var(--pc-columns, 4), 1fr); gap: 15px; list-style: none; padding: 0; margin: 0; width: 100%; } .visual-item { position: relative; overflow: hidden; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); transition: transform 0.3s; background: #fff; display: flex; flex-direction: column; height: 100%; } .visual-item:hover { transform: translateY(-5px); box-shadow: 0 5px 15px rgba(0,0,0,0.1); } .visual-item a { display: flex; flex-direction: column; text-decoration: none; color: inherit; width: 100%; height: 100%; } .latest-main-visual-skin.image-only .visual-image { width: 100%; height: 100%; padding-top: 75%; position: relative; } .latest-main-visual-skin.image-only .visual-image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .latest-main-visual-skin.image-only .visual-text { display: none; } .latest-main-visual-skin.has-content .visual-image { width: 100%; height: 150px; position: relative; flex-shrink: 0; } .latest-main-visual-skin.has-content .visual-image img { width: 100%; height: 100%; object-fit: cover; } .latest-main-visual-skin.has-content .visual-text { padding: 15px; flex-grow: 1; display: flex; flex-direction: column; justify-content: center; background: #fff; border-top: 1px solid #f0f0f0; } .visual-text .subject { display: block; font-size: 16px; font-weight: 600; color: #333; margin-bottom: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .visual-text .content { font-size: 13px; color: #666; line-height: 1.5; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-height: 3em; } .empty_li { grid-column: 1 / -1; text-align: center; padding: 50px 0; color: #999; } @media (max-width: 1024px) { .visual-grid { grid-template-columns: repeat(var(--mo-columns, 2), 1fr); gap: 10px; } .latest-main-visual-skin.has-content .visual-image { height: 120px; } .visual-text { padding: 10px; } .visual-text .subject { font-size: 14px; } }