/* goods 영역: 원본 상세 페이지 인라인 CSS 포팅(박스 옵션, 카테고리 탭, 후기 페이지네이션, 스켈레톤, 상품 상세 모달) */

.order_count{
    font-size: 1.4rem;
}

/* ---------- 후기 페이지네이션 ---------- */
.review_pagination{
    width: 100%;
    height: 5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 5rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.review_pagination .page_button,
.page_left_button,
.page_right_button{
    width:3rem;
    height:3rem;
    color:#969696;
    display:flex;
    border:1px solid transparent;
    align-items: center;
    justify-content: center;
    font-size:1.4rem;
    margin-right:1rem;
    cursor:pointer;
}
.page_right_button{
    margin:0;
}
.review_pagination .page_button.active{
    border:1px solid #232323;
    color:#232323;
}
.review_pagination .page_button:hover,
.page_left_button:hover,
.page_right_button:hover{
    border: 1px solid #232323;
    color:#232323;
}
.page_left_button.disabled,
.page_right_button.disabled{
    color:#D9D9D9;
    cursor:default;
    pointer-events:none;
}
.page_left_button.disabled:hover,
.page_right_button.disabled:hover{
    border:1px solid transparent;
    color:#D9D9D9;
}
.item_rank_copy_target,
.ground_b_copy_target,
.ground_normal_copy_target{
    display:none;
}

/* ---------- 스켈레톤 / 빈 후기 ---------- */
@keyframes skeleton {
    from{ background-color: #F7F7F7; }
    to{ background-color: #EBEBEB; }
}
.product_comment_list .comment_empty_state {
    width: 100%;
    min-height: 30rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 6rem 2rem;
    margin-top: 2rem;
    box-sizing: border-box;
    border: 1px solid #EBEBEB;
    border-radius: 1.2rem;
    background-color: #FBFBFB;
}
.comment_empty_icon {
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    background-color: #FFFFFF;
    border: 1px solid #EBEBEB;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 2.4rem;
}
.comment_empty_icon svg {
    width: 4rem;
    height: 4rem;
}
.comment_empty_title {
    font-size: 1.8rem;
    color: #232323;
    margin-bottom: 1.2rem;
    letter-spacing: -0.02em;
}
.comment_empty_desc {
    font-size: 1.4rem;
    color: #969696;
    line-height: 1.7;
}
@media (max-width: 768px){
    .product_comment_list .comment_empty_state { min-height: 28rem; padding: 5rem 2rem; }
    .comment_empty_icon { width: 7rem; height: 7rem; margin-bottom: 2rem; }
    .comment_empty_icon svg { width: 3.4rem; height: 3.4rem; }
    .comment_empty_title { font-size: 1.6rem; }
    .comment_empty_desc { font-size: 1.3rem; }
}

/* ---------- 상품 보상 변경(카테고리 탭) ---------- */
.hashbox_complicated{
    width:100%;
    border:1px solid #EBEBEB;
    margin-bottom:2rem;
    padding-left:2rem;
    padding-right:2rem;
    padding-top:1.5rem;
    padding-bottom:1.5rem;
}
@media all and (min-width:0px) and (max-width:1260px){
    .hashbox_complicated .complicated_name{ font-size:1.5rem; margin-bottom:1rem; }
    .hashbox_complicated .complicated_list{ display:flex; flex-flow:wrap; justify-content: flex-start; }
    .hashbox_complicated .complicated_list .complicated{
        width:18%;
        min-width:8rem;
        margin-right:1rem;
        margin-top:0.5rem;
        margin-bottom:0.5rem;
        height:4rem;
        display:flex;
        align-items: center;
        justify-content: center;
        border:1px solid #EBEBEB;
        border-radius:5px;
        cursor:pointer;
        font-size:1.3rem;
    }
    .hashbox_complicated .transparency_explain{ font-size:1.2rem; margin-top:1rem; }
}
@media all and (min-width:1260px){
    .hashbox_complicated .complicated_name{ font-size:1.6rem; margin-bottom:1rem; }
    .hashbox_complicated .complicated_list{ display:flex; flex-flow:wrap; }
    .hashbox_complicated .complicated_list .complicated{
        width:18%;
        margin-right:1rem;
        height:4rem;
        display:flex;
        align-items: center;
        justify-content: center;
        border:1px solid #EBEBEB;
        border-radius:5px;
        cursor:pointer;
        font-size: 1.4rem;
    }
    .hashbox_complicated .transparency_explain{ font-size:1.3rem; margin-top:1rem; line-height:1.8; }
}
.hashbox_complicated .complicated_list .complicated.active{
    color:white;
    background:rgb(35,35,35);
}
.hashbox_complicated .transparency_explain .red{
    color:#BF1A20;
}
.hashbox_complicated .transparency_explain .explain_size_up{
    margin-top:0.6rem;
}

/* ---------- 일반 박스 / 10+1 박스 ---------- */
.hashbox_boxoption_area{
    width:100%;
    margin-top:2rem;
    border:1px solid #EBEBEB;
    margin-bottom:1rem;
    padding-left:2rem;
    padding-right:2rem;
    padding-top:1.5rem;
    padding-bottom:1.5rem;
}
@media all and (min-width:0px) and (max-width:1260px){
    .hashbox_boxoption_area .hashbox_boxoption_list{
        font-size:1.5rem;
        margin-bottom:0rem;
        display:flex;
        flex-flow:wrap;
        justify-content: flex-start;
    }
    .hashbox_boxoption_area .hashbox_boxoption_list .box_option{
        width:18%;
        min-width:8rem;
        margin-right:1rem;
        margin-top:0.5rem;
        margin-bottom:0.5rem;
        height:4rem;
        display:flex;
        align-items: center;
        justify-content: center;
        border:1px solid #EBEBEB;
        border-radius:5px;
        cursor:pointer;
        position: relative;
        font-size: 1.4rem;
    }
}
@media all and (min-width:1260px){
    .hashbox_boxoption_area .hashbox_boxoption_list{ display:flex; flex-flow:wrap; }
    .hashbox_boxoption_area .hashbox_boxoption_list .box_option{
        width:18%;
        margin-right:1rem;
        height:4rem;
        display:flex;
        align-items: center;
        justify-content: center;
        border:1px solid #EBEBEB;
        border-radius:5px;
        cursor:pointer;
        position: relative;
        font-size: 1.4rem;
    }
}
.hashbox_boxoption_area .hashbox_boxoption_list .box_option.new::after{
    position: absolute;
    width: 3rem;
    height: 1.5rem;
    top: -0.5rem;
    right: -0.5rem;
    background: url('/img/new.svg') no-repeat center / contain;
    content: '';
}
.hashbox_boxoption_area .hashbox_boxoption_list .active{
    color:white;
    background:rgb(35,35,35);
}

/* ---------- 구매 버튼 상태 ---------- */
.product_main .product_main_second .buy_ui .cart_in.disabled,
.product_main .product_main_second .buy_ui .buy.disabled,
.product_main .product_main_second .buy_ui .iron_box_free.disabled{
    opacity: .55;
    pointer-events: none;
}
.product_main .product_main_second .buy_ui .iron_box_free{
    width: 100%;
}
.product_main .product_main_second .sub_info .fairness_link{
    color: #8A3DDC;
    text-decoration: underline;
}

/* ---------- 스크롤 옵저버 ---------- */
.observe_target{
    top: 300rem;
    position: absolute;
    width: 100%;
    height: 100rem;
    pointer-events: none;
}

/* ---------- 당첨 상품 카드 배지 ---------- */
.product_detail_info .product_list .product_list__container .product_list__wrapper{
    position: relative;
}
.product_detail_info .product_list .product_list__container .product_list__wrapper .rank_badge{
    position: absolute;
    top: 1rem;
    left: 1rem;
    min-width: 2.6rem;
    height: 2.2rem;
    padding: 0 .7rem;
    border-radius: 1.1rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
    background: #232323;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: .02em;
}
.product_detail_info .product_list .product_list__container.ground_x .product_list__wrapper .rank_badge{ background:#FFD100; color:#232323; }
.product_detail_info .product_list .product_list__container.ground_a .product_list__wrapper .rank_badge{ background:#8A3DDC; }
.product_detail_info .product_list .product_list__container.ground_b .product_list__wrapper .rank_badge{ background:#FF4D4F; }
.product_detail_info .product_list .product_list__container.ground_c .product_list__wrapper .rank_badge{ background:#00A6E9; }
.product_detail_info .product_list .product_list__container.ground_d .product_list__wrapper .rank_badge{ background:#2DB400; }
.product_detail_info .product_list .product_list__container.ground_e .product_list__wrapper .rank_badge{ background:#969696; }
.product_detail_info .product_list .product_list__container .product_list__wrapper .new_badge{
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 3.2rem;
    height: auto;
}
.product_detail_info .product_list .product_list__container .product_list__wrapper .probability_text{
    font-size: 1.1rem;
    color: #969696;
    margin-top: .4rem;
}
.product_detail_info .product_list .product_list__container .product_list__empty{
    grid-column: 1 / -1;
    font-size: 1.3rem;
    color: #969696;
    text-align: center;
    padding: 2rem 0;
}

/* ---------- 상품 상세 모달 ---------- */
.goods_detail_modal{
    position:   fixed;
    z-index:    10002;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba(0,0,0,.75);
    flex-flow:column;
    justify-content: center;
    align-items: center;
    overflow-y:auto;
    display:none;
}
.goods_detail_modal .goods_loading_spinner{
    width:100%;
    height:100%;
    display:flex;
    align-items: center;
    justify-content: center;
}
.goods_detail_modal .goods_detail_modal_close{
    width:8rem;
    height:8rem;
    border-radius:50%;
    background:black;
    color:white;
    display:flex;
    align-items: center;
    justify-content: center;
    font-size:4rem;
    cursor:pointer;
    box-shadow:5px 5px 10px rgb(0,0,0,0.5);
    margin:auto;
    margin-bottom:3rem;
    margin-top:5rem;
}
.goods_detail_modal .goods_detail{
    width:92%;
    max-width:80rem;
    min-height:50rem;
    background:white;
    border:1px solid rgb(230,230,230);
    border-radius:5px;
    box-shadow:5px 5px 10px rgb(0,0,0,0.5);
    margin:auto;
    margin-top:5rem;
    margin-bottom:10rem;
    padding-top:3rem;
    padding-bottom:3rem;
}
.goods_detail_modal .goods_detail .goods_main_image{
    width:87%;
    max-width:40rem;
    margin:auto;
}
.goods_detail_modal .goods_detail .goods_main_image img{
    width:100%;
}
.goods_detail_modal .goods_detail .goods_title{
    width:86.95%;
    min-height:5rem;
    margin:auto;
    font-size:1.8rem;
    display:flex;
    align-items: center;
    border-bottom:1px solid #EBEBEB;
    padding-left:1%;
    padding-right:1%;
}
.goods_detail_modal .goods_detail .goods_spec{
    width:86.95%;
    margin:auto;
    border-bottom:1px solid #EBEBEB;
    padding-top:1rem;
    padding-bottom:1rem;
}
.goods_detail_modal .goods_detail .goods_spec .price_data{
    width:100%;
    border-bottom:1px solid #EBEBEB;
    padding-bottom:1rem;
    margin-bottom:1rem;
}
.goods_detail_modal .goods_detail .goods_spec .spec_line{
    width:100%;
    display:flex;
    min-height:2.5rem;
    padding-left:1%;
    padding-right:1%;
}
.goods_detail_modal .goods_detail .goods_spec .spec_line .spec_name{
    width:20%;
    min-width: 6.5rem;
    font-size:1.4rem;
}
.goods_detail_modal .goods_detail .goods_spec .spec_line .spec_data{
    width: 80%;
}
.goods_detail_modal .goods_detail .goods_spec .spec_line .spec_data.original_price{
    font-size:1.6rem;
    color:rgb(204,0,0);
    text-decoration: line-through;
}
.goods_detail_modal .goods_detail .goods_spec .spec_line .spec_data.box_price{
    font-size:1.6rem;
}
.goods_detail_modal .goods_detail .goods_spec .spec_line.normal{
    font-size:1.4rem;
}
.goods_detail_modal .goods_detail_image{
    width:86.95%;
    margin:auto;
    margin-top:2rem;
}
.goods_detail_modal .goods_detail_image img{
    width:100%;
}
@media all and (min-width:0px) and (max-width:1260px){
    .goods_detail_modal .goods_detail .goods_spec .spec_line .spec_name{
        margin-right: 0.5rem;
    }
}

/* ---------- 로딩 스피너(부트스트랩 대체) ---------- */
.spinner-border{
    display: inline-block;
    width: 3rem;
    height: 3rem;
    border: .3rem solid rgba(255,255,255,.35);
    border-right-color: #fff;
    border-radius: 50%;
    animation: rndbox-spin .75s linear infinite;
}
@keyframes rndbox-spin{ to{ transform: rotate(360deg); } }