/* cart body */

.cart-list-wrapper .cart-block-custom {
    background: #F6FBFF;
    border-top: 2px solid #D8EEFF;
    border-bottom: 2px solid #D8EEFF;
    margin-right: -20px;
    margin-left: -20px;
    padding: 20px;
}

.product-page .cart-info {
    margin: 30px 0;
}


/* .product-page .cart-list {
    padding-bottom: 30px;
} */

.cart-block-custom .list-qty {
    zoom: 80%;
}

.cart-block-custom .cart-position-custom {
    padding-top: 30px;
    text-align: center;
}

.cart-block-custom .btn-number {
    border: none;
    color: var(--color-white);
    background-color: #3a62af26;
    display: flex;
    align-items: center;
}

.cart-block-custom .form-control {
    border: 1px transparent;
    background-color: #3a62af0d;
    border-radius: 0;
    padding: 15px;
    margin: 0 15px;
    width: 100px;
    text-align: center;
}


/****/

.progressC .list-thumb {
    margin-bottom: 10px;
}

.progressC-block .progressC,
.product-page .cart-body,
.cart-detail-custom,
.product-page .cart-info,
.cart-success,
.transfer-form,
.modal-content {
    position: relative;
    background-color: var(--color-white);
    border-radius: 15px;
    padding: 30px 20px;
    box-shadow: var(--box-shadow-100);
}

.transfer-form {
    padding: 20px 40px;
}

.modal-content {
    border: none;
    margin-bottom: 50px;
}

.modal-content .modal-body {
    text-align: center;
}

.product-page .cart-info {
    padding: 50px 60px;
}

.product-page .cart-info .list-wrapper {
    /* padding-top: 100px; */
    /* width: 50%; */
}

.product-page .cart-info .list-wrapper .list-title {
    display: flex;
    align-items: center;
}

.product-page .cart-info .list-wrapper .list-desc {
    padding-left: 40px;
    position: relative;
    margin-top: 15px;
}

.product-page .cart-info .list-wrapper .list-desc::before {
    content: 's';
    color: transparent;
    position: absolute;
    background-image: url(../../image/icon/icon-circle-true-cart-1.png);
    background-size: 100%;
    left: 0;
    width: 30px;
    background-position: center;
}

.product-page .cart-body {
    /* padding: 0 20px; */
    padding-top: 30px;
    padding-bottom: 0;
    overflow: hidden;
}

.cart-button-continue {
    padding-top: 30px;
    margin-top: 30px;
    border-top: 2px solid rgba(0, 0, 0, 0.511);
}

.progressC-bar {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 70%;
    height: 5px;
    background-color: #ddd;
    top: 44%;
    margin-top: -6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    background: #0292ce;
    background-color: var(--color-primary) !important;
}

.progressC-bar::before {
    content: '';
    width: 20px;
    height: 20px;
    background-color: var(--color-primary) !important;
    position: absolute;
    left: 14%;
    /* left: 15%; */
    top: 50%;
    margin-top: -10px;
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    border-radius: 50%;
    z-index: 1;
}

.progressC-bar:after {
    content: '';
    height: 100%;
    background-color: #F0F5F8;
    position: absolute;
    right: -1px;
    top: 0;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    /* -webkit-box-shadow: 0 3px 3px rgb(0 0 0 / 10%) inset;
    -moz-box-shadow: 0 3px 3px rgba(0, 0, 0, .1) inset;
    box-shadow: 0 3px 3px rgb(0 0 0 / 10%) inset; */
}

.progressC-block .progressC .list-wrapper {
    text-align: center;
}

.progressC .list-wrapper.step2::before,
.progressC .list-wrapper.step3::before {
    content: '';
    width: 20px;
    height: 20px;
    background-color: #F0F5F8;
    position: absolute;
    right: -5%;
    top: 38%;
    margin-top: -10px;
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    border-radius: 50%;
    z-index: 1;
}

.progressC .list-thumb .icon {
    display: block;
    margin: 0 auto;
    width: 76px;
    height: 76px;
}

.progressC .step1 .icon {
    background-image: url('../../image/asset/progress-1.svg');
}

.progressC .step2 .icon {
    background-image: url('../../image/asset/progress-2.svg');
}

.progressC .step3 .icon {
    background-image: url('../../image/asset/progress-3.svg');
}

.progressC .step4 .icon {
    background-image: url('../../image/asset/progress-4.svg');
}

.progressC-step1 .progressC-bar:after {
    /* left: 25%; */
    left: 16%;
}

.progressC-step2 .progressC-bar:after {
    left: 50%;
}

.progressC-step3 .progressC-bar:after {
    /* left: 75%; */
    left: 86%;
}

.progressC-step4 .progressC-bar:after {
    left: 95%;
    /* left: 100%; */
}

.progressC-step5 .progressC-bar:after {
    display: none;
}

.progressC-step2 .progressC-bar::before {
    left: 49%;
}

.progressC-step3 .progressC-bar::before {
    left: 85%;
}

.progressC-step4 .progressC-bar::before {
    left: 94%;
}

.progressC-step5 .progressC-bar::before {
    display: none;
}

.progressC-step2 .list-wrapper.step2::before,
.progressC-step3 .list-wrapper.step2::before,
.progressC-step3 .list-wrapper.step3::before,
.progressC-step4 .list-wrapper.step2::before,
.progressC-step4 .list-wrapper.step3::before,
.progressC-step5 .list-wrapper.step2::before,
.progressC-step5 .list-wrapper.step3::before {
    display: none;
}

.progressC-step1 .step1 .icon {
    background-image: url('../../image/asset/progress-1-active.svg');
}

.progressC-step1 .step1 .list-title {
    display: block;
}

.progressC-step2 .step1 .icon {
    background-image: url('../../image/asset/progress-1-active.svg');
}

.progressC-step2 .step2 .icon {
    background-image: url('../../image/asset/progress-2-active.svg');
}

.progressC-step2 .step1 .list-title,
.progressC-step2 .step2 .list-title {
    display: block;
}

.progressC-step3 .step1 .icon {
    background-image: url('../../image/asset/progress-1-active.svg');
}

.progressC-step3 .step2 .icon {
    background-image: url('../../image/asset/progress-2-active.svg');
}

.progressC-step3 .step3 .icon {
    background-image: url('../../image/asset/progress-3-active.svg');
}

.progressC-step3 .step1 .list-title,
.progressC-step3 .step2 .list-title,
.progressC-step3 .step3 .list-title {
    display: block;
}

.progressC-step4 .step1 .icon {
    background-image: url('../../image/asset/progress-1-active.svg');
}

.progressC-step4 .step2 .icon {
    background-image: url('../../image/asset/progress-2-active.svg');
}

.progressC-step4 .step3 .icon {
    background-image: url('../../image/asset/progress-3-active.svg');
}

.progressC-step4 .step1 .list-title,
.progressC-step4 .step2 .list-title,
.progressC-step4 .step3 .list-title {
    display: block;
}

.progressC-step5 .step1 .icon {
    background-image: url('../../image/asset/progress-1-active.svg');
}

.progressC-step5 .step2 .icon {
    background-image: url('../../image/asset/progress-2-active.svg');
}

.progressC-step5 .step3 .icon {
    background-image: url('../../image/asset/progress-3-active.svg');
}

.progressC-step5 .step4 .icon {
    background-image: url('../../image/asset/progress-4-active.svg');
}

.progressC-step5 .step1 .list-title,
.progressC-step5 .step2 .list-title,
.progressC-step5 .step3 .list-title,
.progressC-step5 .step4 .list-title {
    display: block;
}

.product-page .form-block {
    position: relative;
    background-color: var(--color-white);
    border-radius: 15px;
    /* padding: 20px 30px; */
    box-shadow: var(--box-shadow-100);
}

.product-page .cart-list-note,
.cart-list-note {
    width: 70%;
    margin: 0 auto;
    text-align: center;
    padding: 50px 0;
    display: flex;
}

.product-page .form-block .form-wrapper {
    padding: 50px 65px;
}

.product-page .form-block .form-wrapper .whead-title {
    padding-bottom: 50px;
}

.product-page .form-block .form-wrapper .form-group,
.transfer-form .form-group,
.transfer-form .select-control {
    margin-bottom: 3rem;
}

.transfer-form .form-group {
    margin-bottom: 2rem;
}

.product-page .form-block .form-wrapper .form-group .form-control,
.product-page .form-block .form-wrapper .form-group .select-control select,
.transfer-form .form-control,
.transfer-form .form-group .form-control,
.transfer-form .select-control select {
    border: none;
    background: #F3F8FE;
}

.product-page .form-block .form-wrapper .form-group .form-control:focus,
.transfer-form .form-group .form-control:focus {
    border: 1px solid #90D5D0;
    box-shadow: none;
}

.product-page .form-block .form-wrapper .form-group .control-label,
.transfer-form .control-label,
.transfer-form .form-group .control-label {
    font-weight: normal;
    padding-left: 5px;
}

.transfer-form .transfer-form-title {
    /* position: relative; */
    padding-left: 50px;
    padding-bottom: 60px;
    /* margin-bottom: 20px; */
    font-weight: var(--fw-bold);
}

.transfer-form .transfer-form-title::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 65px;
    overflow: hidden;
    width: 100%;
    height: 3px;
    background-color: #D8EEFF;
}

.transfer-form .upload-file {
    padding-bottom: 20px;
}

.transfer-form .form-btn {
    text-align: right;
    padding: 30px 0;
    /* padding-bottom: 20px; */
}

.transfer-form .form-btn::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 150px;
    width: 100%;
    height: 1px;
    background-color: #D8EEFF;
}

.transfer-form .control-group.-table {
    zoom: unset;
}

.transfer-form .control-group.-table>* span {
    position: absolute;
    width: 50px;
    padding: 10px;
}

.product-page .form-block .whead {
    position: relative;
    border-bottom: 1px solid #D8EEFF;
    padding: 20px 30px;
    display: flex;
    align-items: center;
}

@media (max-width:1440px) {
    .transfer-form .select-control select {
        padding: 6px 50px 6px 10px;
    }
}

@media (max-width:1199px) {
    .product-page .cart-info .list-wrapper {
        /* padding-top: 70px; */
    }
    .transfer-form {
        zoom: 95%;
    }
    .transfer-form .form-btn {
        padding: 20px 0;
    }
    .transfer-form .form-btn::before {
        bottom: 130px;
    }
    .transfer-form .upload-file {
        padding-bottom: 0;
    }
}

@media (max-width:1024px) {
    .transfer-form {
        zoom: 95%;
    }
}

@media (max-width:991px) {
    .product-page .form-block .form-wrapper .whead-title {
        padding-bottom: 30px;
    }
    .transfer-form .select-control select {
        padding: 6px 10px 5px 10px;
    }
    .transfer-form .select-control::after {
        top: 10px;
        right: 6px;
    }
    .transfer-form .transfer-form-title {
        padding-left: 0;
    }
    .product-page {
        padding-bottom: 30px;
    }
}

@media (max-width:767px) {
    .product-page .cart-body {
        width: 800px;
    }
    .product-page .cart-list-wrapper {
        overflow: auto;
    }
    .progressC {
        text-align: center;
    }
    .progressC-bar {
        width: 80%;
    }
    .progressC .row>div {
        width: 100%;
    }
    .progressC .list-wrapper {
        display: none;
    }
    .progressC-step1 .list-wrapper.step1 {
        display: inline-block;
    }
    .progressC-step2 .list-wrapper.step2 {
        display: inline-block;
    }
    .progressC-step3 .list-wrapper.step3 {
        display: inline-block;
    }
    .progressC-step4 .list-wrapper.step4 {
        display: inline-block;
    }
    .progressC-step5 .list-wrapper.step4 {
        display: inline-block;
    }
    .progressC .list-title {
        left: 0;
        right: 0;
    }
    .progressC-bar::before {
        left: 20%;
    }
    .progressC-step1 .progressC-bar:after {
        left: 24%;
    }
    .progressC-step2 .progressC-bar::before {
        display: none;
    }
    .progressC-step3 .progressC-bar:after {
        left: 80%;
    }
    .progressC-step3 .progressC-bar::before {
        left: 76%;
    }
    .product-page .form-block .form-wrapper {
        padding: 35px 40px;
    }
    .product-page .form-block .whead {
        padding: 20px 45px;
    }
    .product-page .cart-list-note,
    .cart-list-note {
        width: 85%;
        padding: 20px 0;
        line-height: 1.2;
    }
    .product-page .cart-info {
        padding: 30px 40px;
    }
    .transfer-form .form-group,
    .transfer-form .select-control {
        margin-bottom: 2rem;
    }
}

@media (max-width:575px) {
    .product-page .form-block .form-wrapper .form-group {
        margin-bottom: 1.5rem;
    }
    .product-page .form-block .whead img {
        width: 25px;
    }
    .product-page .form-block .whead {
        padding: 15px;
    }
    .product-page .form-block .form-wrapper {
        padding: 20px;
    }
    .product-page .cart-info .list-wrapper {
        margin: 15px 0;
    }
    .transfer-form .form-btn {
        display: flex;
        justify-content: center;
    }
    .transfer-form .form-btn .btn {
        margin: 0 10px;
    }
    .captcha-block {
        padding: 15px 0;
    }
    .transfer-form {
        padding: 20px 30px;
    }
    .transfer-form .control-group.-table>* span {
        display: none;
    }
    .transfer-form .form-btn {
        padding: 10px 0;
    }
    .transfer-form .form-btn::before {
        bottom: 108px;
    }
    .product-page .cart-list-note .icon,
    .cart-list-note .icon {
        display: none;
    }
}

@media (max-width:375px) {
    .product-page .cart-info {
        padding: 10px 20px;
    }
}

@media (max-width:320px) {
    .transfer-form {
        padding: 20px;
    }
    .transfer-form .form-btn {
        text-align: center;
        display: block;
        padding: 0;
    }
    .transfer-form .form-btn .btn {
        margin: 5px 0;
    }
    .transfer-form .form-btn::before {
        bottom: 159px;
    }
}