
/* 섹션 바깥 여백 없음: 피그마(1920x1080) 기준으로 타이틀 위 120px 등
   모든 여백이 배경사진 안쪽에 포함된 풀블리드 디자인 (오버뷰(Full)과 동일) */
.product.detail .overview.product_overview_list .banner_list {
    display: grid;
    grid-template-columns: 100%;
}
.product.detail .overview.product_overview_list .bg,
.product.detail .overview.product_overview_list .bg-mo,
.product.detail .overview.product_overview_list .inner_wrap {
    min-width: 0;
    max-width: 100%;
}
.product.detail .overview.product_overview_list .bg,
.product.detail .overview.product_overview_list .bg-mo {
    grid-area: 1 / 1;
    height: 100%;
}
.product.detail .overview.product_overview_list .bg img,
.product.detail .overview.product_overview_list .bg-mo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-user-drag: none;
    user-select: none;
    pointer-events: none;
}
.product.detail .overview.product_overview_list .bg-mo {
    display: none;
}
.product.detail .overview.product_overview_list .inner_wrap {
    grid-area: 1 / 1;
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12rem 0 15rem;
    pointer-events: none;
}
.product.detail .overview.product_overview_list .title_area,
.product.detail .overview.product_overview_list .list_area {
    pointer-events: auto;
}

/* 타이틀/설명 : 오버뷰(Boxed) hgroup과 동일 크기, 중앙 정렬 */
.product.detail .overview.product_overview_list .title_area {
    width: 120rem;
    max-width: 100%;
    margin-bottom: 6rem; 
    text-align: center;
}
.product.detail .overview.product_overview_list .title_area h4 {
    line-height: 1.25;
    font-size: 3.6rem;
    font-weight: 700;
    color: var(--title-color, #fff);
}
.product.detail .overview.product_overview_list .title_area .txt {
    margin-top: 2.4rem;
    line-height: 1.6;
    font-size: 1.8rem;
    color: var(--title-color, #fff);
}

/* 리스트 : 타이틀 아래 남는 공간에서 세로 가운데(등록 개수와 무관), 내부 텍스트는 좌측 정렬 */
.product.detail .overview.product_overview_list .list_area {
    display: flex;
    flex-direction: column;
    gap: 6rem;
    margin-top: auto;
    margin-bottom: auto;
    width: 54rem;
    text-align: left;
}
/* 리스트 위치: 본문 폭(120rem) 좌측/우측 끝에 정렬 */
.product.detail .overview.product_overview_list.left .list_area {
    align-self: flex-start;
    margin-left: calc(50% - 60rem);
}
.product.detail .overview.product_overview_list.right .list_area {
    align-self: flex-end;
    margin-right: calc(50% - 60rem);
}
/* 항목 : 카드슬라이드(아이폰) 카드 타이틀/불릿과 동일 크기 */
.product.detail .overview.product_overview_list .list_area li .title {
    display: block;
    line-height: 1.25;
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--list-color, #fff);
}
.product.detail .overview.product_overview_list .list_area li .desc {
    margin-top: 1.6rem;
    line-height: 1.6;
    font-size: 1.8rem;
    color: var(--list-color, #fff);
}

@media (max-width: 1919px) {
    .product.detail .overview.product_overview_list .inner_wrap {
        padding: calc(100vw * (120 / 1919)) 0 calc(100vw * (150 / 1919));
    }
    .product.detail .overview.product_overview_list .title_area {
        width: calc(100vw * (1200 / 1919));
        margin-bottom: calc(100vw * (60 / 1919));
    }

    .product.detail .overview.product_overview_list .title_area h4 {
        font-size: calc(100vw * (36 / 1919));
    }
    .product.detail .overview.product_overview_list .title_area .txt {
        margin-top: calc(100vw * (24 / 1919));
        font-size: calc(100vw * (18 / 1919));
    }
    .product.detail .overview.product_overview_list .list_area {
        gap: calc(100vw * (60 / 1919));
        width: calc(100vw * (540 / 1919));
    }
    .product.detail .overview.product_overview_list.left .list_area {
        margin-left: calc(50% - calc(100vw * (600 / 1919)));
    }
    .product.detail .overview.product_overview_list.right .list_area {
        margin-right: calc(50% - calc(100vw * (600 / 1919)));
    }
    .product.detail .overview.product_overview_list .list_area li .title {
        font-size: calc(100vw * (24 / 1919));
    }
    .product.detail .overview.product_overview_list .list_area li .desc {
        margin-top: calc(100vw * (16 / 1919));
        font-size: calc(100vw * (18 / 1919));
    }
}
/* 태블릿: 오버뷰(Full)·카드슬라이드와 동일한 /1180 폰트 규칙.
   글자가 사진 비율보다 커지는 만큼 배너가 늘어나고 배경이 cover로 채움 */
@media (max-width: 1180px) {
    /* 다른 섹션들과 동일한 상하 여백 */
    .product.detail .overview.product_overview_list .inner_wrap {
        padding: calc(100vw * (160 / 1180)) 0;
    }
    .product.detail .overview.product_overview_list .title_area {
        width: calc(100vw * (1080 / 1180));
        margin-bottom: calc(100vw * (60 / 1180));
    }
    .product.detail .overview.product_overview_list .title_area h4 {
        font-size: calc(100vw * (36 / 1180));
    }
    .product.detail .overview.product_overview_list .title_area .txt {
        margin-top: calc(100vw * (24 / 1180));
        font-size: calc(100vw * (18 / 1180));
    }
    .product.detail .overview.product_overview_list .list_area {
        gap: calc(100vw * (50 / 1180));
        width: calc(100vw * (500 / 1180));
    }
    .product.detail .overview.product_overview_list.left .list_area {
        margin-left: calc(100vw * (50 / 1180));
    }
    .product.detail .overview.product_overview_list.right .list_area {
        margin-right: calc(100vw * (50 / 1180));
    }
    .product.detail .overview.product_overview_list .list_area li .title {
        font-size: calc(100vw * (24 / 1180));
    }
    .product.detail .overview.product_overview_list .list_area li .desc {
        margin-top: calc(100vw * (16 / 1180));
        font-size: calc(100vw * (18 / 1180));
    }
}

@media (max-width: 767px) {
    .product.detail .overview.product_overview_list .banner_list {
        display: flex;
        flex-direction: column;
    }
    .product.detail .overview.product_overview_list .bg {
        display: none;
    }
    .product.detail .overview.product_overview_list .bg-mo {
        display: block;
        height: auto;
    }
    .product.detail .overview.product_overview_list .bg-mo img {
        height: auto;
        object-fit: unset;
    }
    .product.detail .overview.product_overview_list .inner_wrap {
        order: -1;
        background: var(--text-bg, #000);
        padding: calc(100vw * (160 / 767)) calc(100vw * (40 / 767));
    }
    .product.detail .overview.product_overview_list .title_area {
        width: 100%;
        margin-bottom: calc(100vw * (60 / 767));
    }
    /* 모바일 폰트: 오버뷰(Full) hgroup과 동일 (52/32) */
    .product.detail .overview.product_overview_list .title_area h4 {
        font-size: calc(100vw * (52 / 767));
    }
    .product.detail .overview.product_overview_list .title_area .txt {
        margin-top: calc(100vw * (24 / 767));
        font-size: calc(100vw * (32 / 767));
    }
    /* 모바일: 좌/우 구분 없이 좌측 배치 */
    .product.detail .overview.product_overview_list.left .list_area,
    .product.detail .overview.product_overview_list.right .list_area {
        align-self: flex-start;
        margin-left: 0;
        margin-right: 0;
        gap: calc(100vw * (50 / 767));
        width: calc(100vw * (590 / 767));
    }
    .product.detail .overview.product_overview_list .list_area li .title {
        font-size: calc(100vw * (36 / 767));
    }
    .product.detail .overview.product_overview_list .list_area li .desc {
        margin-top: calc(100vw * (24 / 767));
        font-size: calc(100vw * (28 / 767));
    }
}
