/* BASIC css start */
#cartWrap .wish-opt { color: #FFA500; }
#cartWrap .tit-space { margin-top:100px }
/* 회원 등급 표시 */

/* 배송 메세지 */
#cartWrap .delivery { margin-top:30px; font-size:12px; color:#2e2e2e; text-align: center }
/* 주문 컨트롤 버튼 */
#cartWrap .btn-order-ctrl { margin:40px 0 50px; text-align: center }
#cartWrap .btn-order-ctrl a { width:178px; height:58px; font-size:16px; line-height:58px }

#cartWrap .cart-ft2 { margin-top:20px; text-align: center; }
#nhn_btn { display: inline; }
#payco_order_btn { display: inline; }
#kakaopay_order_btn { display:inline; vertical-align:top; }
.__checkout_img_comm {visibility: unset !important;}

.tb-normal { font-weight:normal }
.realtime-btn-up {display:inline-block; width:26px; height:26px; text-indent:-9999em; vertical-align:top; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/common/sp_qty.gif) 0 0 no-repeat; background-position:0 0;}
.realtime-btn-dw {display:inline-block; width:26px; height:26px; text-indent:-9999em; vertical-align:top; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/common/sp_qty.gif) 0 0 no-repeat; background-position:0 -26px;}

#cartWrap .txt-spin { line-height:21px }

.cart-free-wrap { text-align:center; }
.cart-free-wrap .btn-list-open { position:relative; display:inline-block; width:250px; height:58px; line-height:58px; color:#000; font-size:14px; text-align:center; border:1px solid #000 }
.cart-free-wrap .btn-list-open span { position:absolute; top:27px; right:30px; display:inline-block; width:12px; height:6px; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/common/sp_cart_free.gif) 0 0 no-repeat }
.cart-free-wrap .btn-list-open span.open { background-position:0 -6px }
.cart-free-wrap p { padding:5px 0 20px; font-size:12px }
.cart-free-wrap p span { font-weight:bold }
.cart-free-wrap .btn-more { display:inline-block; width:94%; height:30px; line-height:30px; margin-top:10px; border:1px solid #383838; background:#fff; color:#383838; font-size: 1em; text-align:center; }
.cart-free-wrap .btn-more span { display:inline-block; margin-left:5px; width:12px; height:6px; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/common/sp_cart_free.gif) 0 -6px no-repeat; vertical-align:middle; }
.cart-free-wrap .list-wrap { overflow-x:hidden; overflow-y:auto; height:450px; padding:15px 14px 30px; margin-top:20px; border:1px solid #b7b7b7; display: none; }
.cart-free-wrap .list-wrap ul { display: table; table-layout: fixed; width:100%; margin: 0; padding: 0; *zoom:1 }
.cart-free-wrap .list-wrap ul:after { clear: both; content: ""; display: block; }
.cart-free-wrap .list-wrap ul li { word-wrap: break-word; word-break: keep-all; display: inline-block; vertical-align: top; width:24%; list-style: none; }
.cart-free-wrap .list-wrap ul li dl { margin:15px 15px 10px; }
.cart-free-wrap .list-wrap ul li dl dt { margin-bottom:13px; }
.cart-free-wrap .list-wrap ul li dl dt img { width:100%; height:auto; border:0; }
.cart-free-wrap .list-wrap ul li dl dd {}
.cart-free-wrap .list-wrap ul li dl dd strong { color:#f40000; }
.cart-free-wrap .list-wrap ul li dl dd a { display:inline-block; padding:5px 8px 3px; margin-top:8px; border:1px solid #999; color:#666; font-weight:bold; background:#fff; }

/* 하이브리드 옵션 */
.opt_dd img { vertical-align:top; }
.opt_dd .basket-option-detail { display:inline-block; vertical-align:top; }
.opt_dd .basket-option-detail .basket-option-dlist li { margin-bottom:7px; word-break:break-all; word-wrap:break-word; }
.opt_dd .basket-option-detail .basket-option-dlist li img { width:23px; height:23px; margin-right:8px; vertical-align:middle; }

/* IE7 Hack */
.cart-free-wrap .list-wrap ul li { *float:left }


/* 정기배송 탭 */
#cartWrap .cart-tab:after { clear: both; content: ""; display: block; }
#cartWrap .cart-tab { height:68px; margin:50px 0 0 3px; border-bottom:2px solid #000; }
#cartWrap .cart-tab li { float:left; width:50%; height:67px; margin-left:-6px; *margin-left:-7px; border:1px solid #d5d5d5; border-bottom:none; background:#f9f9f9; }
#cartWrap .cart-tab li:first-child { margin-left:0; }
#cartWrap .cart-tab li a { display:block; line-height:70px; font-weight:bold; color:#898989; font-size:18px; text-align:center; text-decoration:none; background:none; }
#cartWrap .cart-tab li.now { position:relative; z-index:1; height:68px; border:2px solid #000; border-bottom:none; background:#fff; }
#cartWrap .cart-tab li.now a { line-height:68px; color:#000; }


.MS_tb_delivery { z-index:10 }

/* 샵페이 바로구매 */
#productDetail #shoppay_btn { padding-top: 10px; } /* PC (공통) 상세페이지 전용 */
#cartWrap #shoppay_btn { display: inline; } /* PC (공통) 장바구니 전용 */
.shopdetail #shoppay_btn { padding-top:10px; } /* MO (4.0) 상세페이지 전용 */
#basket #shoppay_btn { margin-top:20px; } /* MO (4.0) 장바구니 전용 */
.shopdetail #shoppay_btn { text-align:center; } /* MO (파워팩) 상세페이지 전용 */
.basket #shoppay_btn { text-align:center; } /* MO (파워팩) 장바구니 전용 */

.shoppay_storebtn_bx,
.shoppay_storebtn_bx *,
.shoppay_button_box,
.shoppay_button_box * { display: inline-block !important; overflow: hidden; !important; float: none !important; position: static !important; top: auto !important; left: auto !important; margin: 0 !important; padding: 0 !important; border: 0 none !important; font-size: 11px !important; line-height:16px !important; font-family: '돋움',Dotum,Helvetica,sans-serif !important; text-align: left !important; text-decoration: none !important;  vertical-align: top !important; background: none !important; border-radius: 0 !important; }
.shoppay_button_box { width: auto !important; height: 100% !important; zoom: 1 !important; padding: 0 !important; border-top: 2px solid #2b2f3a !important; background-color: #fff !important; }
.shoppay_button { position: relative !important; margin: 0 !important; padding: 5px 0 5px 88px !important; zoom:1 !important; }
.shoppay_button .shoppay_blind { overflow: hidden !important; position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; clip: rect(0 0 0 0) !important; }
.shoppay_text { display: block !important; *display: inline !important; position: absolute !important; top: 10px !important; left: 0 !important; width: 82px !important; height: 26px !important; margin: 0 !important; padding: 0 !important; background: url('/images/common/shoppay_sp_text.png') no-repeat !important; }
.shoppay_btn_list { *zoom: 1 !important; display: table !important; width: 100% !important; margin:0 !important; padding: 0 !important; table-layout: fixed !important; list-style: none !important; }
.shoppay_btn_list tbody { display: table-row-group !important; }
.shoppay_btn_list tr { display: table-row !important; }
.shoppay_btn_list .shoppay_btn_item { *width: 120px !important; }
.shoppay_btn_item { display: table-cell !important; height: 37px !important; margin: 0 !important; padding: 0 !important; text-align: left !important; }
.shoppay_btn_link { display: block !important; height: 35px !important; margin: 0 !important; padding: 0 !important; border: 1px solid #bfc4c7 !important; background-color: #fcfcfc !important; background-repeat: no-repeat !important; background-repeat: no-repeat !important; text-align: center !important; text-decoration: none !important; }
.shoppay_btn_item:first-child .shoppay_btn_link { margin: 0 !important; }
.shoppay_text { background-size: 82px auto !important; }
.shoppay_btn_link.shoppay_btn_pay { background-size: 133px auto !important; }
.shoppay_btn_link.shoppay_btn_pay { background-image: url('/images/common/shoppay_sp_payment.png') !important; background-position: 50% 0 !important; background-repeat: no-repeat !important; border-radius: 2px !important; }
.shoppay_btn_link.btn_blue { border-color: #025eea !important; background-color: #025eea !important; }
.shoppay_event { position: relative !important; width: 100% !important; margin: 0 !important; padding: 3px 0 0 0 !important; border: 0 none !important; border-top: 1px solid #e5e9ea !important; letter-spacing: -0.5px !important; }
.shoppay_event_tex t {display: block !important; *display: inline !important; overflow: hidden !important; *width: 100% !important; margin: 0 !important; padding: 5px 0 !important; letter-spacing: 0 !important; white-space: nowrap !important; *zoom: 1 !important; text-overflow: ellipsis !important; word-wrap: normal !important; }
.shoppay_event_text { padding: 0 !important; }
.shoppay_event_text .event_title { display: inline !important; margin: 0 5px 0 0 !important; padding: 0 !important; font-weight: normal !important; color: #015ce8 !important; vertical-align: middle !important; }
.shoppay_event .shoppay_event_text .event_link { display: inline !important; margin: 0 !important; padding: 0 !important; font-weight: normal !important; color: #727272 !important; text-decoration: none !important; vertical-align: middle !important; }
.shoppay_event .shoppay_event_text .event_link span { display: inline-block !important; margin: -1px 0 1px !important; vertical-align: middle !important; }
.shoppay_type_A_1 { width: 277px !important; height: 70px !important; }
.shoppay_type_A_2 { width: 296px !important; height: 84px !important; }
.shoppay_type_A_2 .shoppay_button { padding: 5px 0 5px 86px !important; }
.shoppay_type_A_2 .shoppay_text { top: 14px !important; }
.shoppay_type_A_2 .shoppay_btn_link { height: 45px !important; }
.shoppay_type_A_2 .shoppay_btn_link.shoppay_btn_pay { background-position: 50% -40px !important; }
.shoppay_type_A_3 { width: 338px !important; height: 84px !important; }
.shoppay_type_A_3 .shoppay_button { padding: 6px 0 6px 102px !important; }
.shoppay_type_A_3 .shoppay_text { top: 13px !important; height: 31px !important; background-position: 0 -31px !important; }
.shoppay_type_A_3 .shoppay_btn_link { height: 45px !important; }
.shoppay_type_A_3 .shoppay_btn_link.shoppay_btn_pay { background-position: 50% -40px !important; }


/* 장바구니 지정상품 */ 
/* --- 1. 전체 레이아웃 (반응형 자동 정렬) --- */
.item_list_wrap {
    display: grid;
    /* 카드가 최소 200px을 유지하며 화면 너비에 맞춰 열 개수를 자동으로 조절합니다 */
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 40px 20px; /* 상하 간격 40px, 좌우 간격 20px */
    margin-top: 100px;
}

/* --- 2. 개별 상품 카드 --- */
.item_list {
    position: relative;
    background: #fff;
    border-radius: 12px;
    padding-bottom: 10px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.item_list dl {
    position: relative;
}

/* 마우스 올렸을 때 카드가 살짝 위로 떠오르는 효과 */
.item_list:hover {
    transform: translateY(-8px);
    /* box-shadow: 0 12px 24px rgba(0,0,0,0.08); */ /* 부드러운 그림자 */
    z-index: 10;
}

/* --- 3. 썸네일(상품 이미지) 영역 --- */
.item_list .thumb {
    width: 100%;
    aspect-ratio: 1 / 1; /* 완벽한 정사각형 비율 유지 */
    overflow: hidden;
    border-radius: 12px;
    background-color: #f9f9f9; /* 이미지가 로딩 전이거나 누끼컷일 때 예쁜 배경색 */
    margin-bottom: 16px;
}
.item_list .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover; 
    transition: transform 0.4s ease; /* 부드러운 줌인 효과 준비 */
}
.item_list:hover .thumb img {
    transform: scale(1.05); /* 마우스 올리면 이미지 살짝 확대 */
}

/* --- 4. 텍스트 정보 영역 --- */
.item_list dd:not(.hoverView) {
    padding: 0 8px; /* 텍스트 양옆 여백 */
}

/* 쿠폰 제외 등 아이콘 */
.item_list ul li:first-child img {
    height: 18px;
    margin-bottom: 8px;
    vertical-align: middle;
}

/* 상품명 */
.item_list .prd_name {
    font-size: 16px;
    color: #222;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 44px; /* 16px * 1.4 * 2줄 = 약 44px */
}

/* 소비자가 (취소선 있는 가격) */
.item_list .prd_price_consumer {
    font-size: 13px;
    color: #888;
    margin-bottom: 4px;
}
.item_list .prd_price_consumer strike {
    color: #bbb;
}
/* 할인율 포인트 색상 */
.item_list .prd_price_consumer .discount {
    color: #FB1016; /* 눈에 띄는 예쁜 레드 */
    font-weight: bold;
    margin-left: 4px;
}

/* 실제 판매가 */
.item_list .prd_price_sell {
    font-size: 18px;
    color: #111;
    font-weight: 700;
    letter-spacing: -0.5px;
}

/* --- 5. 마우스 호버 시 나타나는 오버레이 버튼 영역 --- */
.item_list .hoverView {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    aspect-ratio: 1 / 1; /* 썸네일 크기와 완벽하게 일치시킴 */
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.4); /* 반투명한 검정색 덮개 */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 12px; /* 버튼 사이 간격 */
    
    /* 기본적으로는 숨겨둠 */
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}
.item_list:hover .hoverView {
    /* 마우스 올리면 부드럽게 나타남 */
    opacity: 1;
    visibility: visible;
}

/* 오버레이 내부 버튼 공통 스타일 */
.item_list .hoverView a {
    display: block;
    width: 140px;
    padding: 12px 0;
    text-align: center;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
}

/* 장바구니 버튼 */
.item_list .hoverView .btn-view {
    background-color: #fff;
    color: #111;
}
.item_list .hoverView .btn-view:hover {
    background-color: #FB1016; /* 호버 시 강렬한 레드 포인트 */
    color: #fff;
}

/* 상세보기 버튼 */
.item_list .hoverView .btn-detail {
    border: 1px solid rgba(255, 255, 255, 0.8);
    color: #fff;
    background-color: transparent;
}
.item_list .hoverView .btn-detail:hover {
    background-color: #fff;
    color: #111;
}

.page-body {}
/* BASIC css end */