/*컨텐츠 기본사이즈*/
.wrap {
    margin-top: 130px;
}
@media(max-width:768px) {
    .wrap {
        margin-top: 100px;
    }
}


.step{
    border: none;
}



.open_obj{
    padding: 1rem;
}


.op_div label img{
    width: 40px;
}



/*유심유형*/
.op_div:nth-of-type(2){
    margin-top: 12rem;
}


/*유심 구매 개수 버튼*/
.buyusim{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.counter_wrap{
    width: 150px;
    height: auto;
    display: flex;
    align-items: center;
}

.minus_btn{
    width: 50px;
    height: 50px;
    background: #C4E7FE;
    border-radius: 15px 0 0 15px;
    color: var(--main-color);
    font-size: 1.25rem;
    font-weight: 800;
}

.count_num{
    width: 50px;
    height: 50px;
    background: var(--bg-color);
    font-size: 1.25rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
}

.plus_btn{
    width: 50px;
    height: 50px;
    background: #C4E7FE;
    border-radius: 0 15px 15px 0;
    color: var(--main-color);
    font-size: 1.13rem;
    font-weight: 800;
}


.total{
    display: block;
    text-align: right;
}

.total_price{
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--sub2-color);
}

.sub{
    color: #949CA2;
    font-size: 0.87rem;
    margin-top: 0.2rem;
}


/*유심 차이점*/
.usim_diff{
    display: flex;
    align-items: center;
    column-gap: 0.3rem;
    color: #949CA2;
    padding: 2rem 0.93rem;
}

.usim_diff img{
    width: 20px;
    cursor: pointer;
}

.guide_text{
   position: absolute;
    display: none;
    background: var(--sub2-color);
    color: #fff;
    padding: 12px;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.4;
    word-break: keep-all;
    z-index: 9999;
    max-width: 500px;
    --arrow-left: 50%;
    margin-right:1rem;
}

.guide_text .arrow_svg {
    position: absolute;
    top: -10px;
    left: var(--arrow-left);
    transform: translateX(-50%);
}

.next_btn{
    margin-top: 3rem;
}





/*모달창*/
.modal_wrap h2{
        color: var(--sub2-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin: 1.5rem 0;
}

.modal_wrap p{
    color: #7d8185;
    line-height: 140%;
}

.modal_wrap span{
    color: var(--sub2-color);
}



/*KT바로배송 모달*/
.deliver_modal .modal_wrap p{
    margin: 2.5rem 0;
}


/*직접구매 모달*/
.direct_modal .modal_wrap{
    max-width: 600px;
}
.direct_modal .modal_wrap>p:first-of-type{
    margin: 1.5rem 0;
    color: var(--sub2-color);
}
.direct_modal .modal_wrap>p:last-of-type{
    margin: 3rem 0 1rem 0;
    word-break: keep-all;
}


.store_wrap{
    display: flex;
    justify-content: space-between;
    column-gap: 1rem;
}

.store_wrap button{
    background-color: var(--bg2-color);
    padding: 1rem 0;
    border-radius: 15px;
}

.store_wrap .open_obj {
    width: 100%;
    background: var(--bg2-color);
    border-radius: 15px;
    column-gap: 1rem;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.store_wrap .open_obj input[type="radio"]:checked + span{
    outline: none;
}

.store_wrap .open_obj:hover,
.store_wrap .open_obj.selected{
    background: #fff;
    box-shadow: 0px 0px 5px 4px rgba(0, 169, 234, 0.15);
}

.store_wrap input[type="radio"] + span.logo{
    background: #fff;
    border-radius: 50%;
    width: 100%;
    height: 100%;
    max-width: 80px;
    max-height: 80px;
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;   /* 세로 배치 */
    align-items: center;      /* 가로 가운데 */
    justify-content: center;  /* 세로 가운데 (필요 시) */
    aspect-ratio: 1/1; /* ✅ 정사각형 유지 */
}

.store_wrap  input[type="radio"] + span.logo img{
    max-width: 70px;
    width: 100%;
}

/*버튼 배경 색 변경*/
.store_wrap .emart:hover input[type="radio"] + span.logo ,.store_wrap .emart input[type="radio"]:checked + span.logo{
    background: #FFF4DB;
}
.store_wrap .gs:hover input[type="radio"] + span.logo , .store_wrap .gs input[type="radio"]:checked + span.logo{
    background: #D5F6FF;
}

.store_wrap .cu:hover input[type="radio"] + span.logo ,.store_wrap .cu input[type="radio"]:checked + span.logo{
    background: #F2FFC9;
}
.store_wrap .open_obj span:nth-of-type(2){
    font-size: 1.13rem;
    margin-bottom: 0.3rem;
    word-break: keep-all;
}
.open_obj span:last-child{
    word-break: keep-all;
}

@media (max-width:580px) {
    .store_wrap .open_obj span:nth-of-type(2) {
    font-size: 1rem;
}
    .open_obj span:last-child {
        font-size: .93rem;
}
}