.schCondition .modal-dialog {
    max-width: 520px
}

.schCondition .modal-content {
    border-radius: 16px
}

.schCondition .modal-header {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    border-bottom: none;
    background-color: var(--grey-050);
    padding: 16px 24px
}

@media(min-width: 768px) {
    .schCondition .modal-header {
        padding:16px 32px
    }
}

.schCondition .modal-header .btn-close {
    padding: 4px;
    margin: 0;
    color: var(--grey-600)
}

.schCondition .modal-title {
    font-size: 20px;
    color: var(--grey-700);
    font-weight: 500
}

.schCondition .modal-body {
    padding: 24px 24px 32px 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 24px
}

@media(min-width: 768px) {
    .schCondition .modal-body {
        padding:24px 32px 32px 32px
    }
}

.schCondition .modal-body .text-blue {
    color: var(--blue-500)
}

.schCondition .modal-body ul.text-blue {
    margin-top: -12px
}

.schCondition .modal-body .btn-groups {
    gap: 12px
}

.schCondition .modal-body button {
    border-radius: 8px;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 500
}

.schCondition .modal-body .btn-primary {
    background: var(--blue-500)
}

.schCondition .modal-body .btn-primary:hover {
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.08)), to(rgba(0, 0, 0, 0.08))),var(--blue-500);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.08) 100%),var(--blue-500)
}

.schCondition .modal-body .btn-primary:active {
    background: var(--blue-500)
}

.schCondition .modal-body .btn-secondary {
    border: var(--blue-500) solid 1px;
    color: var(--blue-500);
    background: var(--grey-000)
}

.schCondition .modal-body .btn-secondary:hover {
    background: var(--blue-000)
}

.schCondition .modal-body .btn-secondary:active {
    background: var(--blue-150)
}

.schCondition .condFlForm {
    gap: 24px
}

.schCondition .condFlForm .form-label-title {
    font-size: 14px;
    margin-bottom: 4px;
    color: var(--grey-600)
}

.schCondition .condFlForm .form-label-title span {
    color: var(--grey-400)
}

.schCondition .input-radios {
    gap: 8px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media(min-width: 376px) {
    .schCondition .input-radios {
        -ms-flex-wrap:nowrap;
        flex-wrap: nowrap
    }
}

.schCondition .btn-radio-label {
    border-radius: 8px;
    border: var(--grey-200) solid 1px;
    background: var(--grey-000);
    padding: 4px 14px;
    height: 36px
}

@media(min-width: 576px) {
    .schCondition .btn-radio-label {
        padding:7px 16px;
        height: 40px
    }
}

.schCondition .btn-check:checked+.btn-radio-label {
    border: var(--blue-500) solid 1px;
    background: var(--blue-000);
    color: var(--blue-500)
}

.schCondition input[type=text] {
    width: 100%;
    border-radius: 8px;
    border: var(--grey-200) solid 1px;
    background: var(--grey-000);
    padding: 7px 48px 7px 12px;
    outline: none;
    color: var(--grey-800);
    font-size: 15px;
    height: 40px
}

.schCondition svg.position-absolute {
    right: 12px;
    top: 7px
}

.schCondition .form-check-input {
    width: 20px;
    height: 20px;
    margin: 0
}

.schCondition .form-check-input:checked {
    background-color: var(--blue-500);
    border-color: var(--blue-500)
}

.schCondition .input-checkbox {
    gap: 8px
}

.schCondition .input-checkbox p {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.schCondition .input-checkbox a {
    color: var(--blue-500);
    width: 100%;
    margin-top: 4px
}

@media(min-width: 376px) {
    .schCondition .input-checkbox a {
        width:auto;
        margin-left: 8px;
        margin-top: 0
    }
}

.schCondition .input-checkbox a:hover {
    text-decoration: underline
}

.schCondition .modal-body-pair {
    gap: 12px
}

.schCondition .modal-body-pair .accordion {
    gap: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.schCondition .accordion-item {
    border: none
}

.schCondition .accordion-header label {
    border-radius: 8px;
    border: var(--grey-100) solid 1px;
    padding: 8px;
    cursor: pointer
}

.schCondition .accordion-header label svg {
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.schCondition .accordion-header label[aria-expanded=true] {
    border-radius: 8px 8px 0 0
}

.schCondition .accordion-header label[aria-expanded=true] svg {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.schCondition .accordion-body {
    border-radius: 0 0 8px 8px;
    border: var(--grey-100) solid 1px;
    border-top: none;
    padding: 8px 16px 8px 40px;
    font-size: 14px;
    color: var(--grey-700);
    background: var(--grey-050);
    width: 100%
}

.schCondition .form-radio-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    margin: 4px;
    border: var(--grey-200) solid 1px;
    border-radius: 50%
}

.schCondition .form-radio-input:checked {
    border: var(--blue-500) solid 1px
}

.schCondition .form-radio-input:checked[type=radio] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%232066EC'/%3e%3c/svg%3e");
    background-repeat: no-repeat
}

.schCondition .form-radio-input+p {
    color: var(--grey-600);
    margin-left: 8px
}

.schCondition .form-radio-input+p span {
    font-size: 14px;
    color: var(--blue-400);
    margin-top: 4px
}
