/* =========================================================
   V2 상품상세 — 구매 혜택 배지 (2026-07-29)
   대표이미지 ↔ 브랜드명 사이. 고정 4항목 / 전 해상도 2×2 그리드.
   스크롤·슬라이더·캐러셀 없음. hover·클릭 동작 없음.

   좌우 여백은 .v2-summary 등 본문 블록과 동일한
   clamp(15px, 4vw, 22px) (item-structure.css) 을 그대로 사용해
   브랜드명·상품명과 좌우 라인을 정확히 맞춘다.
   ========================================================= */

.v2-buy-benefits{
    box-sizing:border-box;
    width:100%;
    margin:16px 0 0;
    padding-left:clamp(15px, 4vw, 22px);
    padding-right:clamp(15px, 4vw, 22px);
}

.v2-buy-benefits-box{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    column-gap:16px;
    row-gap:16px;

    box-sizing:border-box;
    margin:0;
    padding:13px;

    border:1px solid #ececec;
    border-radius:12px;
    background:#fff;

    list-style:none;
}

.v2-buy-benefit{
    display:flex;
    align-items:center;
    gap:6px;
    min-width:0;

    color:#2b2b2f;
    font-size:13px;
    font-weight:600;
    line-height:1.35;
    letter-spacing:-.2px;
}

.v2-buy-benefit-ico{
    flex:0 0 auto;
    font-size:14px;
    line-height:1;
    /* 이모지 폰트 우선 지정 — 본문 폰트 대체로 인한 흑백/두부 표시 방지 */
    font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
    font-weight:400;
}

.v2-buy-benefit-txt{
    min-width:0;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

/* 초소형 단말(≤360px): 규격 하한(padding 12px / 간격 14px)으로만 축소해
   글자 크기·2×2 배치는 유지하면서 가로 넘침을 막는다. */
@media (max-width:360px){
    .v2-buy-benefits-box{
        padding:12px;
        column-gap:14px;
        row-gap:14px;
    }
}

/* 태블릿 이상: 본문 폭이 넓어지는 만큼 글자·여백만 규격 상한으로. 배치는 동일한 2×2. */
@media (min-width:620px){
    .v2-buy-benefits{
        margin-bottom:20px;
    }

    .v2-buy-benefits-box{
        padding:14px;
        column-gap:18px;
        row-gap:18px;
    }

    .v2-buy-benefit{
        font-size:14px;
    }

    .v2-buy-benefit-ico{
        font-size:15px;
    }
}

/* PC(.v2-summary 상단 padding 8px)에서 아래 여백 총합을 태블릿과 맞춘다. */
@media (min-width:900px){
    .v2-buy-benefits{
        margin-bottom:12px;
    }
}
