/* ########################################################################################################### */
/* reset all */
html,body,body div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,a,article,aside,figure,footer,header,hgroup,menu,nav,section,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}article,aside,figure,footer,header,hgroup,nav,section{display:block;outline:0}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help}table{border-collapse:collapse;border-spacing:0;font-size:inherit;font:100%}th{font-weight:bold;vertical-align:bottom}td{font-weight:normal;vertical-align:middle}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:10px 0;padding:0}input,select{vertical-align:middle;-webkit-font-smoothing:antialiased}pre{white-space:pre;white-space:pre-wrap;white-space:pre-line;word-wrap:break-word}input[type="radio"]{vertical-align:text-bottom}input[type="checkbox"]{vertical-align:bottom}input:focus,textarea:focus{outline:0}input,button,textarea,select{font:inherit}a:hover,a:active{outline:0}small{font-size:85%}strong,th{font-weight:bold}td,td img{vertical-align:top}sub,sup{font-size:75%;line-height:0;position:relative}sup{top:-0.5em}sub{bottom:-0.25em}pre,code,kbd,samp{font-family:monospace,sans-serif}.clickable,label,input[type="button"],input[type="submit"],button{cursor:pointer}body,select,input,textarea{color:gray;-webkit-font-smoothing:antialiased}button,input,select,textarea{margin:0;resize:none}button{width:auto;overflow:visible}ins{background:#fcd700;color:#000;text-decoration:none}mark{background:#fcd700;color:#000;font-style:italic;font-weight:bold}*,*::before,*::after{-moz-box-sizing:border-box;box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}object{display:none}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}
/* ########################################################################################################### */
/* vars */
:root {
    --azul: #003a5d;
    --azul-escuro: #003A5D;
    --azul-claro: #00B2E3;
    --azul-medio: #00B2E3;
    --branco: #ffffff;
    --cinza: #E5E5E5;
    --cinza-medio: #A5A5A5;
    --cinza-escuro: #5A5A5A;
}

/* ########################################################################################################### */
/* common */

@font-face {
    font-family: 'kanit';
    src: url('/fontes/Kanit-Regular.woff2') format('woff2'),
        url('/fontes/Kanit-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'kanit-bold';
    src: url('/fontes/Kanit-Bold.woff2') format('woff2'),
        url('/fontes/Kanit-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'kanit-black';
    src: url('/fontes/Kanit-Black.woff2') format('woff2'),
        url('/fontes/Kanit-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'kanit-light';
    src: url('/fontes/Kanit-Light.woff2') format('woff2'),
        url('/fontes/Kanit-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
/*------------------------------------------------------------------------------------------------------------*/
html {
    scroll-behavior: smooth;
}
body {
    font-family: "kanit", sans-serif;
    background: var(--branco);
}

.container {
    width: 100%;
    max-width: 1310px;
    margin: auto;
    padding: 0 15px;
}

.transition {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.img_responsive {
    width: 100%;
    height: auto;
}

.hideme {
    display: none !important;
}

.dropshadow_light {
    -webkit-box-shadow: 4px 4px 4px -2px rgba(40,40,40,0.1);
    -moz-box-shadow: 4px 4px 4px -2px rgba(40,40,40,0.1);
    box-shadow: 4px 4px 4px -2px rgba(40,40,40,0.1);
}
/* ### */
.preload-blur {
    filter: blur(5px);
    transition: filter 0.5s ease;
}
.preload-ok {
    filter: none !important;
}
/* ### */
.line_gray {
    width: 100%;
    height: 1px;
    background-color: var(--cinza);
}
/* ### */
.slider-container img {
    border-radius: 24px;
    filter:grayscale(1);
    background: var(--branco);
    padding: 10px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.slider-container img:hover {
    filter:grayscale(0.5);
}
/* ### */
/*------------------------------------------------------------------------------------------------------------*/
#barra_azul {
    width: 100%;
    height: 50px;
    background: var(--azul);
}

#barra_azul .group_buttons {
    display: flex;
    flex-direction: row;
    justify-content: end;
    align-items: center;
    gap: 25px;
    padding-top: 10px;
}
#barra_azul .group_buttons a {
    color: var(--branco);
    text-decoration: none;
}
#barra_azul .group_buttons a:hover {
    color: var(--azul-claro);
    text-decoration: underline;
}
/*------------------------------------------------------------------------------------------------------------*/
.logo_topo {
    position: absolute;
    left: 5%;
    padding-top: 20px;
    width: 320px;
    height: 116px;

}

/*------------------------------------------------------------------------------------------------------------*/
#hero .banner_topo {
    display: block;
    width: 100%;
    height: auto;
    background-image: url('/imagens/banner_mainbg.webp');
    background-size: cover;
    background-position: center;
    margin: auto;
    padding:150px 0;
}

#hero .banner_topo .group_banner {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    max-width: 980px;
    height: 100%;
    margin:auto;
    padding: 0 15px;
    justify-content: space-between;
}


#hero .banner_topo .text {
    font-size: 24px;
    color: var(--branco);
    text-align: center;
}

#hero .banner_topo .text span {
    color: var(--azul-claro);
}

/* ### */

#hero .bt-converse {
    display: block;
    width: 100%;
    max-width: 375px;
    height: 56px;
    padding: 16px;
    margin: auto;
    font-size: 25px;
    line-height: 85%;
    color: var(--azul);
    text-decoration: none;
    background: var(--branco);
    border: 1px solid var(--azul-escuro);
    border-radius: 24px;
    white-space: wrap;
    text-align: center;
    margin-top: 30px;
  }

#hero .bt-converse:hover {
    color: var(--cinza);
    background: var(--azul);
}

/* ### */


/*------------------------------------------------------------------------------------------------------------*/
#solucoes {
    width: 100%;
    padding: 50px 0;
    background: var(--cinza);
}


#solucoes .group_main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;

    height: 100%;
    margin:auto;
    padding: 0 15px;
    justify-content: space-between;
}

#solucoes .group_main2 {
    display: flex;
    flex-direction: row;
    align-items: start;
    width: 100%;
    height: 100%;
    margin:auto;
    padding: 0 15px;
    justify-content: space-between;
}

#solucoes .group_botoes {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    margin:auto;
    padding: 0 15px;
    justify-content: center;
    gap:15px;
    flex-wrap: wrap;
}

#solucoes .group_botoes .bt_solucoes {
    width: auto;
    height: 50px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 16px 8px 8px;
    gap:8px;
    /*background: var(--cinza);*/
    background: var(--azul-claro);
    border-radius:8px;
    /*border: 1px solid var(--cinza-medio);*/
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0.015em;
    /*color: var(--azul-claro);*/
    color: var(--azul-escuro);
    text-decoration: none;
}
#solucoes .group_botoes .bt_solucoes:hover {
    fill: var(--branco);
    background: var(--azul-escuro);
    color: var(--azul-claro);
    /*background: var(--azul);
    border: 1px solid var(--azul);*/
}
#solucoes .group_botoes .bt_solucoes:hover svg {
    fill: var(--branco);
}

#solucoes .group_botoes svg {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    fill: var(--azul-claro);
}


/*###*/
#solucoes .group_botoes .bt_active  {
    fill: var(--branco);
    background: var(--azul);
    color: var(--azul-claro);
    border: 1px solid var(--azul);
}

#solucoes .group_botoes .bt_active svg {
    fill: var(--branco);
}
/*###*/

#solucoes .box_info {
    width: 100%;
    max-width: 1620px;
    height: auto;
    background: var(--branco);
    padding: 20px;
    margin:30px auto;
    border-radius: 32px;
}

.adjust_info_img {
    min-width: 40%;
    margin: 40px;
    padding-top: 65px;
    max-width: 620px;
}

/*###*/
#info_titulo {
    font-family: 'kanit-bold';
    font-size: 50px;
    color: var(--azul);
    padding-bottom: 25px;
}

#info_texto {
    font-size: 18px;
    color: var(--cinza-medio);
    text-align: justify;
}

#info_texto span {
    font-family: 'kanit-bold';
    color: var(--cinza-escuro);
}

.group_texto ul {
    margin:15px 0;
    list-style-type: circle;

}

.group_texto ul li {
    margin:5px 0 5px 25px;

}

.group_texto .bold_center {
    font-family: 'kanit-bold';
    text-align: center !important;
    color: var(--cinza-escuro);
}

.group_texto .converse {
    color: var(--azul-claro);
    font-family: 'kanit-bold';
    text-decoration: none;

}
.group_texto .converse:hover {
    text-decoration: underline;
}
/*###*/

/*------------------------------------------------------------------------------------------------------------*/
#play_parceira .banner_topo {
    display: block;
    width: 100%;
    height: auto;
    background-image: url('/imagens/bg_play_parceira.webp');
    background-size: cover;
    background-position: center;
    margin: auto;
    padding:50px 0;
}

#play_parceira .banner_topo .group_banner {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    max-width: 980px;
    height: 100%;
    margin:auto;
    padding: 0 15px;
    justify-content: space-between;
}


#play_parceira .banner_topo .text {
    font-size: 26px;
    color: var(--azul);
    text-align: center;
}

#play_parceira .banner_topo .text span {
    font-family: 'kanit-bold';
}
/*------------------------------------------------------------------------------------------------------------*/

#clientes_parceiros {
    width: 100%;
    background: var(--azul);
    height: auto;
    padding: 50px 0;
}

#clientes_parceiros .group_banner {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    max-width: 980px;
    height: 100%;
    margin:auto;
    padding:0 15px;
    justify-content: center;
}


#clientes_parceiros .group_banner .titulo {
    font-size: 56px;
    color: var(--azul-claro);
    text-align: center;
}

#clientes_parceiros .group_banner .subtitulo {
    color:var(--branco);
    font-size: 21px;
}
#clientes_parceiros .adjust_slider {
    max-width: 980px;
    margin: auto;
    padding: 50px 0;
}
.slider-container > div {
    border-radius:12px;
}
/*------------------------------------------------------------------------------------------------------------*/

footer {
    background: var(--branco);
    padding-top: 70px;
}

footer .main_group {
    display: flex;
    flex-direction: row;
    width: 100%;
    flex-wrap: wrap;
}

footer .main_group .group1 {
    display: flex;
    flex-direction: column;
    flex:2;
}

footer .main_group .group2 {
    display: flex;
    flex-direction: column;
    flex:1;
}

footer .main_group .titulo_link {
    font-family: 'kanit-bold';
    font-size: 24px;
    color: var(--azul-claro);
    text-decoration: none;
    padding-bottom: 12px;
}

footer .main_group .titulo_link:hover {
    text-decoration: underline;
}



footer .main_group .subtitulo_link {
    font-family: 'kanit';
    font-size: 18px;
    color: var(--cinza-escuro);
    text-decoration: none;
    padding-bottom: 15px;
}

footer .main_group .subtitulo_link:hover {
    text-decoration: underline;
}

footer .main_group .disabled {
    text-decoration: none !important;
    cursor:default;
}

footer .main_group .disabled:hover {
    text-decoration: none !important;
}





footer .main_group .group3 {
    display: flex;
    flex-direction: column;
    flex:1;
}



footer .logo_rodape {
    width: 320px;
    height: 116px;
    margin-bottom: 100px;
}

footer .main_group .titulo {
    font-size: 18px;
    color: var(--cinza-escuro);
    font-family: 'kanit-bold';
    padding-bottom: 15px;
}

footer .main_group .subtitulo {
    font-size: 18px;
    color: var(--cinza-escuro);
    font-family: 'kanit';
}

footer .main_group .space {
    margin-top: 30px;
}

footer .group_rs {
    display: flex;
    flex-direction: row;
    width: 100%;
}

footer .group_rs .text {
    font-family: 'kanit-bold';
    font-size: 20px;
    padding-right: 20px;
    color: var(--azul-claro)
}

footer .bt_maps {
    width: 100%;
    max-width: 310px;
    height: 70px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 16px 8px 8px;
    gap:8px;
    background: var(--azul-claro);
    border-radius:50px;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0.015em;
    color: var(--branco);
    text-decoration: none;
    font-family: 'kanit-bold';
    font-size: 20px;
    margin: 30px 0;
}

footer .bt_maps:hover {
    background: var(--azul);
}

footer .ft_icon_redes {
    padding: 5px;
    width: 32px;
    height: 32px;
}

  footer #maps {
        width: 25px;
        height: 31px;
        min-width: 25px;
        min-height: 31px;
        fill: var(--branco);
  }

footer .faixa_azul {
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--azul);
    color: var(--branco);
    font-size: 14px;
    margin-top:70px;
}
footer .faixa_azul span {
    font-family: 'kanit-bold';
}

footer .newsplay {
    width: 100%;
    max-width: 520px;
    height: 70px;
    display: block;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 16px 16px 8px 8px;
    gap:8px;
    background: var(--azul-claro);
    border-radius:24px;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0.015em;
    color: var(--branco);
    text-decoration: none;
    font-family: 'kanit-bold';
    font-size: 23px;
    margin: 30px 0;
    text-align: center;
}

footer .newsplay:hover {
    background: var(--azul);
}

footer .newsplay span {
    color: var(--azul);
}

footer .newsplay:hover span {
    color: var(--azul-claro);
}

footer .newsplay .lowtext {
    font-family: 'kanit';
    font-size: 16px;
    padding-top:5px;
}
/*------------------------------------------------------------------------------------------------------------*/
.group_ms_main {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    justify-content: center;
    align-items: center;
    max-width: 720px;
    margin: auto;
}
.icon_ms {
    width: 70px;
    height: 70px;
}
.ms_center {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 26px;
    width: 100px;
    height: 100px;
}
/*------------------------------------------------------------------------------------------------------------*/
.group_topo_form {
    width: 100%;
    background: var(--cinza);
    max-height: 210px;
    padding:20px 0;
    
}
.logo_topo2 {
width: 320px;
height: 116px;
}

.group_form_master {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-top: 50px;
}

.thumb_contato {
    max-width: 500px;
    width: 100%;
    margin: 50px 50px 0 0;
}


.group_form {
    display: flex;
    flex:1;
    padding: 50px;
    width: 100%;
}

input, textarea {
    background: #eaebed;
    font-size: 16px;
}

.group_aceitar {
    display: flex;
    flex-direction: row;
    
}
/*------------------------------------------------------------------------------------------------------------*/
.group_form_converse {
    display: flex;
    flex-direction: column;
    max-width: 650px;
    width: 100%;
    height: auto;
}
.group_form_converse .titulo {
    font-family: 'kanit-bold';
    font-size: 50px;
    color: var(--azul);
    padding-bottom: 25px;
    line-height: 110%;
}
.group_form_converse .text {
    color: var(--cinza-escuro);
    font-size: 18px;
    text-align: justify;
    padding-bottom: 25px;
    line-height: 120%;
    font-family: 'kanit-light';
}

.group_form_converse .text span {
    font-family: 'kanit-bold';
    color: var(--azul-claro);
}


.minigroup_form_converse {
    display: grid;
    grid-gap: 25px;
    grid-template-columns: repeat(auto-fit, minmax(285px, 1fr));
}

.minigroup_form_converse .item_group {
    position: relative;
    height: auto;
}
.minigroup_form_converse .item_group .icone_form {
    width: 40px;
    height: 40px;
    margin: 10px 10px 10px 0;
}

.minigroup_form_converse .item_group .titulo {
    font-family: 'kanit-bold';
    font-size: 18px;
    color: var(--azul-claro);
    padding-bottom: 5px;
    line-height: 110%;
}
.minigroup_form_converse .item_group .text {
    color: var(--cinza-escuro);
    font-size: 18px;
    text-align: left;
    padding-bottom: 0;
    line-height: 115%;
    font-family: 'kanit-light';
}
/*------------------------------------------------------------------------------------------------------------*/
.txt_privacy {
    padding-top: 20px;
    font-family: 'kanit-light';
    font-size: 12px;
}

.txt_privacy a {
    text-decoration: none;
    color: var(--azul-claro);
}
.txt_privacy a:hover {
    text-decoration: underline;
}
/*------------------------------------------------------------------------------------------------------------*/

@media only screen and (max-width: 1200px) {

    #solucoes .group_main2 {
        flex-direction: column;
        align-items: center;
    }

    .adjust_info_img {
        min-width: unset;
        margin: 40px;
        max-width: 600px;
      }

      .group_form_master {
        flex-direction: column;
        align-items: center;
    }

    .group_form {
        padding:50px 0 0 0;
        max-width: 650px;
    }

}

@media only screen and (max-width: 968px) {



}




@media only screen and (max-width: 860px) {

    footer .main_group {
        flex-direction: column;
    }

    footer .group_rs {
        padding-bottom: 50px;
    }


}






@media only screen and (max-width: 768px) {

    #image_info {
        display: none;
    }
}
@media only screen and (max-width: 578px) {

    #solucoes {
        padding: 10px 0;
    }

    .logo_topo {
        left: calc(50% - 320px/2);
    }

    #hero .banner_topo .text {
        font-size: 18px;        
    }

    #solucoes .group_botoes .bt_solucoes {
        width: 100%;
    }

    #info_titulo {
        font-size: 34px;
    }

    #info_texto {
        font-size: 18px;        
    }

    #play_parceira .banner_topo .text {
        font-size: 18px;        
    }

    #clientes_parceiros .group_banner .titulo {
        font-size: 28px;
        text-align: center;    
    }

#clientes_parceiros .group_banner .subtitulo {
        font-size: 22px;
        text-align: center;  
    }



}

@media only screen and (max-width: 420px) {

    #hero .bt-converse {

        font-size: 20px;
        line-height: 110%;

    }

}


@media only screen and (max-width: 340px) {

    #hero .bt-converse {

        font-size: 18px;
        line-height: 120%;

    }

}


@media only screen and (max-width: 304px) {

    #hero .bt-converse {

        font-size: 14px;
        line-height: 150%;

    }

}