@charset "UTF-8";

.refinemodal-accessory  {
    background: rgba(0, 0, 0, 0.5);
}

.refinemodal-inner-accessory-wrap    {
    background: #fff;
    bottom: 95px;
    border-radius: 1rem;
    top: 2.5rem;
    max-width: 40rem !important;
    height: calc(100% - 5rem) !important;
}

.refinemodal-inner-accessory    {
    padding-top: 40px;
    margin: 0 3rem;
}
.refinemodal-inner-accessory .exclamation-mark   {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #FF0033;
    color: #fff;
    margin-right: 5px;
}
.refinemodal-inner-accessory .exclamation-mark-gray   {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #323232;
    color: #fff;
    margin-right: 5px;
}
.refinemodal-inner-accessory .img-qr {
    margin: 0 auto;
}
.refinemodal-inner-accessory .triangle-down {
    width: 0;
    height: 0;
    border-left: 2rem solid transparent;
    border-right: 2rem solid transparent;
    border-top: 1rem solid #F4F5F8;
    margin: 0 auto;
}
.modal-close-accessory   {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: #eceff2;
    right: 5px;
    top: 5px;
}
.modal-close span {
    width: 1.5rem;
    height: 3px;
    background: #323232;
}
.modal-close span:nth-child(1) {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
}
.modal-close span:nth-child(2) {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
}