@media only screen and (max-width:1399px) {
    .banner article h1 {
        font-size: 42px;
        margin-bottom: 12px;
    }
    .crd-form {
        padding: 20px 30px;
    }
    .crd-form .top-ttle h4 {
        font-size: 22px;
    }
    .crd-form select, .crd-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]) {
        padding: 8px 10px;
    }
    .crd-form [type="submit"] {
        padding: 11px 12px;
        font-size: 15px;
    }
    .crd-form .row {
        --bs-gutter-y: 17px;
    }
    .banner article p {
        font-size: 16px;
    }
    .banner article .bnk-rating h4 {
        font-size: 32px;
        margin-bottom: 2px;
    }
    .banner article .bnk-rating p {
        font-size: 13px;
    }
    .section-title h3 {
        font-size: 38px;
        margin-bottom: 8px;
    }
    .section-title p {
        font-size: 13px;
    }
    .contract-sec .item-cdx h5 {
        font-size: 18px;
    }
    .contract-sec .item-cdx img {
        height: 66px;
    }
    .how-wrk-sec .item-circle {
        width: 200px;
        height: 200px;
        margin: 0 auto 34px;
        padding: 35px;
    }
    .how-wrk-sec .item-circle span {
        width: 36px;
        height: 36px;
    }
    .how-wrk-sec .item-circle .contd {
        padding: 32px;
    }
    .how-wrk-sec .item-circle::before {
        width: 174px;
        height: 10px;
    }
    .how-wrk-sec .cds-brs p {
        font-size: 14px;
    }
    .how-wrk-sec .cds-brs {
        max-width: 256px;
    }
    .how-wrk-sec .cds-brs h4 {
        font-size: 18px;
    }
    .problem-sec .roofing-cdr .ttx h5 {
        font-size: 22px;
    }
    .problem-sec .btrm-liare .lg-linkup {
        font-size: 14px;
    }
    .review-sec .revw-crd .autr .dpl {
        width: 44px;
        height: 44px;
        font-size: 22px;
    }
    footer .ttx p {
        font-size: 12px;
    }
    .contract-sec .rvd-cr {
        font-size: 16px;
    }
    .section-title h4 {
        font-size: 16px;
        margin-bottom: 8px;
    }
}
@media only screen and (max-width:1199px){
    .banner article h1 {
        font-size: 34px;
        margin-bottom: 10px;
    }
    .banner article p {
        font-size: 14px;
    }
    .banner article .tab-brd {
        font-size: 13px;
    }
    .banner article .bnk-rating h4 {
        font-size: 28px;
        margin-bottom: 2px;
    }
    .banner article .bnk-rating p {
        font-size: 12px;
    }  
    .banner article .bnk-rating {
        max-width: 330px;
    } 
    .banner article .bnk-rating h4 img {
        flex-shrink: 0;
        margin-left: 5px;
        width: 24px;
        position: relative;
        top: -2px;
    }
    .contract-sec .rvd-cr {
        font-size: 13px;
    }
    .contract-sec .rvd-cr img {
        margin-right: 8px;
    }
    .how-wrk-sec .item-circle span {
        width: 34px;
        height: 34px;
        font-size: 15px;
    }
    .how-wrk-sec .item-circle {
        width: 160px;
        height: 160px;
        margin: 0px auto 30px;
        padding: 26px;
    }
    .how-wrk-sec .item-circle .contd {
        padding: 25px;
    }
    .how-wrk-sec .item-circle::before {
        width: 80px;
        left: calc(100% - 2px);
    }
    .section-title h3 {
        font-size: 30px;
    }
    .contract-sec .item-cdx h5 {
        font-size: 16px;
    }
    .problem-sec .roofing-cdr .ttx h5 {
        font-size: 18px;
    }
    .problem-sec .roofing-cdr .ttx p {
        font-size: 14px;
        line-height: 1.6;
        font-weight: 400;
    }
    .problem-sec .roofing-cdr .ttx {
        max-width: 100%;
        width: 100%;
        position: static;
        transform: unset;
        padding: 20px 10px;
    }
    .problem-sec .roofing-cdr .ttx h5{
        color: #1C1C1C;
    }
    .problem-sec .roofing-cdr .ttx p{
        color: #5E5E5E;
        opacity: 1;
    }
    .problem-sec .roofing-cdr{
        max-height: initial;
        border: 1px solid #D3D3D3;
    }
    .problem-sec .roofing-cdr .bgrud-sp-ij {
        height: 225px;
        position: static;
        object-fit: cover;
    }
    .problem-sec .roofing-cdr::after,
    .problem-sec .roofing-cdr::before{
        display: none;
    }
    .section-title {
        margin-bottom: 30px;
    }
    .how-wrk-sec .section-title {
        margin-bottom: 60px;
    }
    .section-title h4 {
        font-size: 14px;
    }
    .quote-form-bnx .crd-form-btom-pragh {
        font-size: 16px;
    }
}
@media only screen and (max-width:991px){
    .banner .crd-form {
        margin-right: auto;
    }
    .banner article .bnk-rating h4 img {
        width: 20px;
    }
    .banner article .bnk-rating [class*="col"]:last-child {
        padding-left: 28px;
    }
    .quote-form-bnx, .banner {
        padding: 40px 0;
    }
    .banner article h1 {
        font-size: 30px;
        margin-bottom: 10px;
        line-height: 1.4;
    }
    .banner article {
        text-align: center;
    }
    .banner article .tab-brd {
        font-size: 13px;
        margin: 0 auto 16px;
    }
    .banner article .bnk-rating h4 {
        font-size: 20px;
        margin-bottom: 0px;
    }
    .banner article .bnk-rating {
        max-width: 270px;
        text-align: left;
        margin: 20px auto 0;
    }
    .banner article .bnk-rating p {
        font-size: 10px;
    }
    .header .mail-head {
        font-size: 14px;
    }
    .header .mail-head img {
        width: 18px;
        margin-right: 8px;
    }
    .header .logo-main {
        max-width: 120px;
    }
    .header {
        padding: 10px 0;
    }
    .crd-form {
        padding: 18px 20px;
    }
    .section-title h3 {
        font-size: 24px;
    }
    .section-title p {
        font-size: 12px;
    }   
    .contract-sec .item-cdx h5 {
        font-size: 14px;
    }
    .contract-sec .item-cdx h5 br{
        display: none;
    }
    .contract-sec .item-cdx {
        padding: 20px 10px;
        height: 100%;
    }
    .contract-sec .rvd-cr {
        font-size: 10px;
        padding: 0 5px;
    }
    .review-sec, .problem-sec, .problem-sec, .how-wrk-sec, .contract-sec {
        padding: 50px 0;
    }
    .section-title h4 {
        font-size: 12px;
        margin-bottom: 6px;
    }
    .how-wrk-sec .cds-brs h4 {
        font-size: 16px;
        margin-bottom: 5px;
    }
    .how-wrk-sec .cds-brs p {
        font-size: 12px;
    }
    .how-wrk-sec .item-circle span {
        width: 30px;
        height: 30px;
        font-size: 14px;
        top: -15px;
    }
    .how-wrk-sec .cds-brs h4 {
        font-size: 14px;
    }
    .how-wrk-sec .item-circle {
        margin: 0px auto 24px;
    }
    .review-sec .revw-crd .post-ttx {
        font-size: 14px;
    }
    .review-sec .rating-box {
        margin-bottom: 8px;
    }
    .review-sec .revw-crd .autr h5 {
        font-size: 14px;
    }
    .review-sec .revw-crd .autr p {
        font-size: 12px;
    }
    .review-sec .revw-crd .autr .dpl {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }
    .review-sec .owl-carousel .owl-nav button {
        width: 35px;
        height: 35px;
    }
    .review-sec .owl-carousel .owl-nav button img {
        width: 12px;
        top: -1px;
    }
    footer .frt-conts h4 {
        font-size: 18px;
    }
    footer .ttx h4 {
        font-size: 16px;
    }
    footer .ftr-btm {
        padding: 10px 0;
    }
    .review-sec{
        padding: 20px 0 50px;
    }
    .quote-form-bnx .crd-form{
        margin: 0 auto;
    }
    .quote-form-bnx .crd-form-btom-pragh {
        max-width: 100%;
    }
}
@media only screen and (max-width:767px){
    footer .frt-conts ul li a {
        font-size: 14px;
    }
    footer .frt-conts ul li a .icn {
        width: 26px;
        height: 26px;
        border-width: 1px;
        margin-right: 8px;
    }
    .contract-sec .rar-hr-brd [class*="col"]:nth-child(3) .rvd-cr{
        border-left: none;
    }
    .contract-sec .rar-hr-brd [class*="col"]:nth-child(1) .rvd-cr,
    .contract-sec .rar-hr-brd [class*="col"]:nth-child(3) .rvd-cr{
        justify-content: flex-start;
    }
    .contract-sec .rar-hr-brd {
        margin-top: 20px;
        --bs-gutter-x: 0;
    }
    .review-sec, .problem-sec, .problem-sec, .how-wrk-sec, .contract-sec {
        padding: 34px 0;
    }
    .how-wrk-sec .item-circle::before{
        display: none;
    }
    .how-wrk-sec .cds-brs {
        max-width: 100%;
    }
    .section-title h3 br,
    .how-wrk-sec .cds-brs h4 br{
        display: none;
    }
    footer .frt-conts {
        margin-left: 0;
    }
    footer .ftr-btm {
        flex-direction: column-reverse;
    }
    footer .ftr-btm .ftr-pgs-lnk{
        margin-bottom: 10px;
    }
    footer .ftr-btm .ftr-pgs-lnk a, footer .ftr-btm p {
        font-size: 12px;
        text-align: center;
        line-height: 1.4;
    }
    footer .ftr-btm .ftr-pgs-lnk a+a {
        margin-left: 14px;
    }
    .quote-form-bnx .crd-form-btom-pragh {
        line-height: 120%;
    }
}
@media only screen and (max-width:575px){
    .header .mail-head {
        font-size: 0 !important;
        background-color: #15803d;
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        border-radius: 50%;
    }
    .header .mail-head img {
        width: 18px;
        margin-right: 0;
        position: relative;
        left: 6px;
        filter: brightness(0) invert(1);
    }
    .problem-sec .row [class*="col"] {
        flex-grow: 1;
        max-width: 100%;
    }
    .banner article h1 {
        font-size: 20px;
    }
    .crd-form .top-ttle h4 {
        font-size: 20px;
    }
    .section-title h3 {
        font-size: 20px;
    }
    .section-title {
        margin-bottom: 26px;
    }
    .how-wrk-sec .section-title {
        margin-bottom: 40px;
    }
    .contract-sec .item-cdx img {
        height: 60px;
    }
}
@media only screen and (max-width:340px){
    .header .mail-head {
        font-size: 12px;
    }
}