*, *:after, *:before {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    /*transition: .5s ease-in-out;*/
    /* добавим плавность переходов для всех элементов страницы*/
}
    ul {
    list-style: none;
}

a {
    text-decoration: none;
    outline: none;
    color: currentColor;
}

img {
    display: block;
    width: 100%;
}

body {
    font-family: 'Alegreya Sans', sans-serif;
    line-height: 1.3;

    background-color: #FFFFFF;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='100%25' gradientTransform='rotate(231,960,455)'%3E%3Cstop offset='0' stop-color='%23FFFFFF'/%3E%3Cstop offset='1' stop-color='%23A9D8EF'/%3E%3C/linearGradient%3E%3Cpattern patternUnits='userSpaceOnUse' id='b' width='548' height='456.7' x='0' y='0' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='100%25' height='100%25'/%3E%3Crect x='0' y='0' fill='url(%23b)' width='100%25' height='100%25'/%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;    

}

:root {
    --dark:#0C3444;
    --white:#ffffff;
    --blue:#228FBD;
    --harmony:#bd5022;
    --border:#E6E7EB;
    --light:#828699;
}
.color-title {
    background: linear-gradient(81.61deg, rgba(34, 143, 189, 0.5) -8.33%, rgba(125, 200, 232, 0.5) 90.18%), linear-gradient(41.22deg, #228FBD -9.25%, #7dc8e8 129.9%), #228FBD;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

@media (min-width: 1140px) {

    body {

        background-color: #FFFFFF;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='100%25' gradientTransform='rotate(231,960,455)'%3E%3Cstop offset='0' stop-color='%23FFFFFF'/%3E%3Cstop offset='1' stop-color='%23A9D8EF'/%3E%3C/linearGradient%3E%3Cpattern patternUnits='userSpaceOnUse' id='b' width='548' height='456.7' x='0' y='0' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='100%25' height='100%25'/%3E%3Crect x='0' y='0' fill='url(%23b)' width='100%25' height='100%25'/%3E%3C/svg%3E");
        background-attachment: fixed;
        background-size: cover;        

        /* background-color: #EDF2F6;
        overflow-x: hidden;
        background-image: url(../images/back.png);
        background-size: 100%;
        background-repeat: no-repeat; */
    }
    body::-webkit-scrollbar {
        display: none;
    }

    .header {
        width: 100%;
        align-items: center;
        height: fit-content;
        margin : auto;
        position: fixed;
        top:0;
        left: 0;
        z-index: 100;
        display: flex;
        justify-content: space-between;
        padding: 1.5% 12.5%;
        padding-bottom: 0;
        background-color: #EDF2F6;
    }
    .logo {
        align-items: center;
        margin: auto 0;
        width: 13.282vw;
    }

    .wrapper {
        display: flex;
        width: fit-content;
    }
    .button-main {
        padding: 0.42vw 1.04vw;
        border: 2px solid var(--blue);  
        border-radius: 150px;
        color: var(--blue);
        text-align: center;
        align-items: center;
        margin-right: 1.04vw;
        cursor: pointer;
        
    }
    .button-header {
        padding: 0.42vw 1.04vw; 
        border-radius: 150px;
        background-color: var(--blue);
        color: var(--white);
        text-align: center;
        align-items: center;
        cursor: pointer;
        
    }
    .button-main p,
    .button-header p {
        line-height: 1.0;
        font-weight: 700;
        font-size: 1.15vw;
        margin: auto;
        margin-top: 0.15vw; 
    }


    .pre-banner {
        background-image: url(../images/pre/back.png);
        background-size: 100%;
        background-repeat: no-repeat;
        height: 47vw; 
        display: flex;
        padding: 0 12.5%;
        align-items: center;
        justify-content: space-between;
    }
    .pre-text {
        width: 70%;
    }
    .pre-text h1 {
        font-size: 4.48vw;
        text-transform: uppercase;
        margin-bottom: 0.83vw;
    }

    .pre-text h2 {
        font-size: 1.88vw;
        margin-bottom: 1.2vw;
        color: var(--dark);
    }

    .pre-button {
        margin-top: 3.13vw;
        padding: 0.67vw 1.45vw;
        width: fit-content;
        border-radius: 150px;
        background-color: var(--blue);
        color: var(--white);
        cursor: pointer;
    }
    .pre-button p {
        font-size: 1.2vw;
        font-weight: 700;
        width: 100%;
    }

    .pre-image {
        width: 50%;
        margin-left: -12%;
        margin-top: 10%;
    }
    .pre-image img {
        width: 100%;
    }

    .block {
        padding: 7.19vw 12.5%;
        display: flex;
        width: 100%;
        height: 47vw; 
    }

    .two {
        padding: 5.1vw 12.5% !important;
        display: grid;
        grid-template-columns: repeat(4,1fr);
        grid-template-rows: repeat(2,0.4fr);
        grid-gap: 1.04vw;
    }
    .two-text {
        grid-column: span 2;
        height: fit-content;
    }
    .two-text h1 {
        font-size: 3.75vw;

        background: linear-gradient(81.61deg, rgba(34, 143, 189, 0.5) -8.33%, rgba(125, 200, 232, 0.5) 90.18%), linear-gradient(41.22deg, #228FBD -9.25%, #7dc8e8 129.9%), #228FBD;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;

        line-height: 1.2;
    }
    .two-card {
        padding: 0.52vw 1.56vw 1.04vw 1.56vw;
        background-color: var(--white);
        border-radius: 30px;
    }

    .two-card h2 {
        font-size: 1.35vw;
        color: var(--dark);
        margin-bottom: 0.68vw;
    }
    .two-card p {
        font-size: 0.89vw;
        color: var(--dark);
        font-weight: 500;
    }

    .two-icon {
        width: 5.21vw;
        height: 5.21vw;
        margin-bottom: 0.68vw;
    }
    .three {
        justify-content: space-between;
        padding: 5.47vw 12.5% !important;
    }
    .three-image {
        width: 50%;
    }
    .three-row {
        width: 40%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .three-card {
        padding: 1.04vw 2.08vw;
        background-color: var(--white);
        border-radius: 30px;
        text-align: center;
        height: 10.94vw;
    }
    .three-card h2 {
        font-size: 3.75vw;

        background: linear-gradient(81.61deg, rgba(34, 143, 189, 0.5) -8.33%, rgba(125, 200, 232, 0.5) 90.18%), linear-gradient(41.22deg, #228FBD -9.25%, #7dc8e8 129.9%), #228FBD;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    .three-card p {
        font-size: 1.35vw;
        font-weight: 700;
        color: var(--dark);
    }

    .four {
        flex-direction: column;
        justify-content: space-between;
    }
    .four h2 {
        font-size: 3.75vw;

    }
    .four-row {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        grid-gap: 1.04vw;       
    }
    .four-card {
        border-radius: 30px;
        background-color: var(--white);
        display: flex;
        padding: 1.04vw;
        align-items: center;
    }
    .four-text {
        color: var(--dark);
        width: 85%;
    }
    .four-text h3 {
        font-size: 1.35vw;
        font-weight: 700;
        margin-bottom: 0.52vw;
        color: var(--dark) !important;
    }
    .four-text p {
        font-size: 0.89vw;
        color: var(--dark);
    }
    .four-icon {
        width: 5.21vw;
        height: 5.21vw;
        margin-right: 1.04vw;
    }

    .five {
        overflow: hidden;
        padding: 4.84vw 0% 4.84vw 12.5% !important;
        align-items: center;
    }
    .five-text {
        width: 55%;
    }
    .five-text h2 {
        font-size: 3.75vw;
        font-weight: 700;
        text-transform: uppercase;
        width: 85%;
        margin-bottom: 1.56vw;

    }
    .five-text p {
        font-size: 1.88vw;
        font-weight: 700;
        color: var(--dark);
    }

    .five-button {
        margin-top: 3.13vw;
        padding: 0.67vw 1.56vw;
        width: fit-content;
        border-radius: 150px;
        background-color: var(--blue);
        color: var(--white);
        cursor: pointer;
    }
    .five-button p {
        font-size: 1.2vw;
        font-weight: 700;
        width: 100%;
        color: var(--white);
    }

    .five-image {
        width: 45%;
        
    }
    .five-image img{
        width: 100%;
        
    }

    
    .provider-row {
        padding: 2vw 12.5%;
        display: grid;
        grid-template-columns: repeat(10,1fr);
        grid-gap: 0.31vw;
        width: 100%;
    }
    .provider-card {
        padding: 0.31vw 0.57vw;
        filter:grayscale();
        cursor: pointer;
    }
    .provider-card:hover {
        padding: 0.31vw 0.57vw;
        filter:initial;
        cursor: pointer;
    }

}

@media (max-width: 1140px) {
    body {
        background-color: #FFFFFF;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='100%25' gradientTransform='rotate(231,960,455)'%3E%3Cstop offset='0' stop-color='%23FFFFFF'/%3E%3Cstop offset='1' stop-color='%23A9D8EF'/%3E%3C/linearGradient%3E%3Cpattern patternUnits='userSpaceOnUse' id='b' width='548' height='456.7' x='0' y='0' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='100%25' height='100%25'/%3E%3Crect x='0' y='0' fill='url(%23b)' width='100%25' height='100%25'/%3E%3C/svg%3E");
        background-attachment: fixed;
        background-size: cover;
    }

    .header {
        display: flex;
        width: 100%;
        align-items: center;
        height: 16.7vw;
        margin : auto;
        position: fixed;
        top:0;
        left: 0;
        background-color:var(--white);
        z-index: 100;
        padding: 0vw 5.56vw;
    }

    .logo {
        width: 36.67vw;
        height: 16.7vw;
    }
        
    .logo a img {
        width: 36.67vw;
        height: 16.7vw; 
    }
    .wrapper {
        display: flex;
        width: 100%;
    }
    .button-main {
        width: 80%;
        padding: 0.56vw 3.89vw;
        text-align: center;
        align-items: center;
        border: 1px solid var(--blue);  
        border-radius: 150px;
        color: var(--blue);
        margin-right: 1.11vw;
        margin-left: 1.11vw;
    }

    .button-header {
        width: fit-content;
        padding: 2.78vw;
        align-items: center;
        text-align: center;
        white-space: nowrap;
        border-radius: 150px;
        background-color: var(--blue);
        color: var(--white);
    }
    .button-main p,
    .button-header p {
        
        font-weight: 700;
        font-size: 3.4vw;
        margin: auto;
    }

    .pre-banner {
        width: 100%;
        display: flex;
        flex-direction: column;
        padding-top: 16.7vw;
    }

    .pre-image {
        order: 1;
        width: 100%;
        background-image: url(../images/pre/back-m.png);
        background-size: 100%;
        background-repeat: no-repeat;
    }
    .pre-image img {
        width: 80%;
    }
    .pre-text {
        order: 2;
        padding: 2vw 5.56vw;
    }
    .pre-text h1 {
        font-size: 10vw;
        text-transform: uppercase;
        margin-bottom: 2.22vw;
    }
    .pre-text h2 {
        font-size: 5vw;
        margin-bottom: 2.22vw;
    }
    .pre-button {
        margin-top: 8.33vw;
        padding-top: 2.78vw;
        padding-bottom: 2.78vw;
        width: auto;
        border-radius: 150px;
        background-color: var(--blue);
        color: var(--white);
        cursor: pointer;
        text-align: center;
    }
    .pre-button p {
        font-size: 4.4vw;
        width: 100%;
        font-weight: 700;
    }

    .block {
        padding: 5.66vw 5.56vw;
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 183.33vw;
        overflow-x: hidden;
    }

    .two {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        grid-gap: 2.78vw;

    }
    .two-text {
        grid-column: span 2;
        height: fit-content;
    }
    .two-text h1 {
        font-size: 7.22vw;
        margin-bottom: 2.22vw;
        width: 100%;
    }
    .two-card {
        padding: 2.78vw;
        background-color: var(--white);
        border-radius: 10px;
    }

    .two-card h2 {
        font-size: 4.44vw;
        color: var(--dark);
        margin-bottom: 0.68vw;
    }
    .two-card p {
        font-size: 2.78vw;
        color: var(--dark);
        font-weight: 500;
    }

    .two-icon {
        width: 12.78vw;
        height: 12.78vw;
        margin-bottom: 0.56vw;
    }

    .three {
        height: auto !important;
    }
    .three-image {
        width: 100%;
    }
    .three-row {
        display: flex;
        flex-direction: column;
        gap: 4.44vw;
        width: 100%;
    }

    .three-card {
        padding: 2.78vw 5.56vw;
        background-color: var(--white);
        border-radius: 10px;
        text-align: center;
        height: 31.67vw;
    }

    .three-card h2 {
        font-size: 10vw;
        font-weight: 700;
    }
    .three-card p {
        font-size: 4.44vw;
        font-weight: 700;
    }


    .four {
        height: auto !important;
    }
    .four h2 {
        font-size: 7.22vw;
        margin-bottom: 2.22vw;
        width: 100%;
    }
    .four-row {
        display: flex;
        flex-direction: column;
        gap: 2.78vw;
    }
    .four-card {
        display: flex;
        background-color: var(--white);
        border-radius: 10px;
        padding: 2.78vw;
        gap: 2.78vw;
        align-items: center;
    }
    .four-text {
        flex-direction: column;
    }

    .four-card h1 {
        font-size: 4.44vw;
        color: var(--dark);
        margin-bottom: 0.68vw;
    }
    .four-card p {
        font-size: 2.78vw;
        color: var(--dark);
        font-weight: 500;
    }

    .four-icon {
        width: 12.78vw;
        height: 12.78vw;
    }


    .five {
        padding: 5.56vw 0 !important;
    }
    .five-image {
        order: 1;
        width: 100%;
    }
    .five-text {
        order: 2;
        padding: 5.56vw 5.56vw;
    }

    .five-text h2 {
        font-size: 7.22vw;
        margin-bottom: 2.22vw;
        width: 100%;
    }
    .five-text p {
        font-size: 3.89vw;
        margin-bottom: 2.22vw;
        font-weight: 700;
    }

    .five-button {
        margin-top: 8.33vw;
        padding-top: 2.78vw;
        padding-bottom: 2.78vw;
        width: auto;
        border-radius: 150px;
        background-color: var(--blue);
        color: var(--white);
        cursor: pointer;
        text-align: center;
    }
    .five-button p {
        font-size: 4.4vw;
        width: 100%;
        font-weight: 700;
        margin: auto;
    }

    .provider-row {
        padding: 2vw 5.56vw;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        grid-gap: 3.33vw;
        width: 100%;
    }
    .provider-card {
        padding: 0.31vw 0.57vw;
        filter:grayscale();
        cursor: pointer;
        transition-duration: 3s;
    }
    .provider-card:active {
        padding: 0.31vw 0.57vw;
        filter:initial;
        cursor: pointer;
        transition-duration: 0.1s;
    }


}