/* BASIC css start */
    /* [기본 PC 스타일] */
    .sd_real_wrapper {
        box-sizing: border-box;
        letter-spacing: -1px;
        border: 20px solid #E1E2E3;
        margin: 50px auto;
        padding: 40px 10px 20px 10px;
        max-width: 860px;
        width: 100%;
        font-family: 'Noto Sans KR', sans-serif;
        background-color: #fff;
        color: #7D3BAD;
    }

    .sd_real_header { text-align: center; margin-bottom: 40px; }
    .sd_real_title { font-size: 36px; color: #A32319; font-weight: 800; margin: 0 0 15px 0; }
    .sd_real_desc { font-size: 20px; font-weight: 400; color:#AD7710; margin: 0; }

    /* PC 헤더 */
    .sd_real_table_header {
        display: flex;
        padding: 10px;
        background-color: #f8f8f8;
        border-top: 2px solid #2e3449;
        border-bottom: 1px solid #ddd;
        font-weight: 700;
        font-size: 16px;
        color: #222;
        text-align: center;
    }
    .th_opt { width: 10%; } 
    .th_comp { width: 51%; text-align: center; padding-left: 20px; }
    .th_weight { width:13%;} 
    .th_price { width: 27%;}

    /* PC 리스트 */
    .sd_real_list { display: flex; flex-direction: column; width: 100%; }
    .sd_real_row {
        display: flex;
        align-items: center;
        padding: 15px 0;
        border-bottom: 1px solid #e5e5e5;
    }
    .sd_real_row:last-child { border-bottom: none; }

    .sd_real_code { width: 10%; font-size: 22px; font-weight: 500; color: #7D3BAD; text-align: center; }
    .sd_real_comp { width: 49%; text-align: left;  padding: 0 20px; font-size: 20px; line-height: 1.5; color: #333; font-weight: 500; }
    .sd_real_comp span { display: block; }
    
    .sd_real_price_group { width: 34%; display: flex; flex-direction: column; gap: 12px;  }
    
    /* PC 가격 행 스타일 */
    .sd_real_price_row { display: flex; align-items: center; justify-content: flex-end; }

    .w_600 { width: 60px; text-align: center; color: #7D3BAD; font-weight: 500; font-size: 18px; margin-right: 10px; }
    .w_500 { width: 60px; text-align: center; color: #d32f2f; font-weight: 500; font-size: 18px; margin-right: 10px; }

    .p_wrap { width: 220px; text-align: right; padding-right:15px;  }
    .p_origin { font-size: 18px; color: #787878; text-decoration: line-through; padding-right:15px; }
    .p_sale { font-size: 20px; font-weight: 500; color: #7D3BAD; }
    
    .row_500_wrap .p_sale { color: #d32f2f; }
    .row_500_bg { background-color: #FFF9F9; }    

    
	/* 특정 상품(P1, G2, G3, G5) 한 줄 처리용 스타일  (PC/모바일 공통)  */
    .sd_real_comp.oneline span {
        display: inline-block !important; /* 강제 줄바꿈 해제 */
        margin-right: 5px; /* 글자 사이 간격 */
    }

    /* PC: 한 줄 / 모바일: 두 줄 중앙 정렬 */
    .sd_real_footer {
        margin: 30px 15px 0px 15px; padding:7px; background-color: #f4f5f6;
        font-size: 16px; color: #0086BF; text-align: center; border-radius: 20px;
        line-height: 1.6;
    }
    
    /* PC에서는 나란히 배치 */
    .footer_title { font-weight: 500; margin-right: 5px; color: #2e3449; }
    .footer_desc { font-weight: 400; }


    /* ------------------------------------------------------------------
       [모바일 전용] 600g/500g 가로 배치 (One Line Layout)
       ------------------------------------------------------------------ */
    @media screen and (max-width: 600px) {
        .sd_real_wrapper {
            margin: 0;
            padding: 15px 5px; /* 좌우 여백 최소화 */
            border-width: 10px; 
        }
        .sd_real_title { font-size: 26px; margin: 15px 5px 15px; }
        .sd_real_desc { font-size: 17px; margin-bottom: 40px;}
        .sd_real_header { margin-bottom: 20px; }
        .sd_real_table_header { display: none; } /* 헤더 숨김 */

        .sd_real_row {
            flex-wrap: wrap; 
            padding: 15px 5px; 
            align-items: flex-start;
        }

        /* 1. 옵션코드  */
        .sd_real_code {
            width: 15%; 
            text-align: center;
            font-size: 17px;
 	    color: #7D3BAD; 
            padding-left: 0px;
            box-sizing: border-box;
        }

        /* 2. 상품명 */
        .sd_real_comp {
            width: 85%; 
            padding: 0;
            font-size: 16px;
            margin-bottom: 10px; 
        }

        /* 3. 가격 그룹 (가로 배치) */
        .sd_real_price_group {
            width: 100%;
            flex-direction: row; /* 가로 방향 변경! */
            justify-content: space-between;
            gap: 6px; /* 좌우 박스 사이 간격 */
        }

        /* 개별 가격 박스 (600g박스 / 500g박스) */
        .sd_real_price_row {
            width: 50%; /* 반반 차지 */
            display: flex;
            align-items: center; /* 수직 중앙 */
            justify-content: space-between; /* 양쪽 끝 정렬 */
            background-color: #f9f9f9; /* 구분용 연한 배경 */
            padding: 8px 10px;
            border-radius: 6px;
            box-sizing: border-box;
        }

        /* 중량 텍스트 (600g) */
        .w_600, .w_500 {
            width: auto; /* 고정너비 해제 */
            margin-right: 5px;
            font-size: 14px; /* 글자 크기 조정 */
            flex-shrink: 0; /* 줄어들지 않게 */
        }

/*  가격 텍스트 래퍼 (Flex 적용으로 가로 배치 강제) */
        .p_wrap {
            width: auto;
            text-align: right;
            display: flex; /* 가로 배치 */
            align-items: center; /* 세로 중앙 정렬 */
            gap: 0px; /* 정가와 할인가 사이 간격 */
        }

        /* 가격 폰트 사이즈 및 배치 수정 */
        .p_origin { 
            font-size: 14px; 
            margin-left:6px; 
            display: inline-block; /* 줄바꿈 방지 */
        }
        .p_sale { 
            font-size: 16px; 
            display: inline-block; /* 줄바꿈 방지 */
        }

	/* [푸터 모바일 스타일] 2줄로 분리 및 중앙 정렬 */
        .sd_real_footer {
            display: flex !important;
            flex-direction: column; /* 세로 배치 */
            align-items: center;
            justify-content: center;
            margin:0px 10px 0px 10px;
        }
        .footer_title { 
            margin-right: 0; 
            margin-bottom: 5px; 
            display: block; /* 줄바꿈 */
        }
 }
/* BASIC css end */