body {
    background-image: url(/img/background/detail-hero.svg);
    background-repeat: no-repeat;
  }

/*HERO*/
.hero-curso-shougakko h1 {
    font-size: 4.6rem;
    font-weight: 600;
    line-height: 146%;
    margin-top: 8.8rem;
}

.hero-curso-shougakko p {
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 155%;
    max-width: 591px;
    margin-top: 1.8rem;
}

.divider-section-white {
    height: 58px;
    width: auto;
    background-color: var(--color-white);
    border-radius: 20px;
    z-index: 20;
    position: relative;
}

/*JORNADAS DO SHOUGAKKO*/
.bg-jornada {
    background-image: url(../img/details/fundo\ colorido\ pag\ curso.svg);
    background-size: cover;
    padding: 11.9rem 0 10.8rem ;
    margin-top: -4.2rem;
    border-radius: 20px;
}

.jornadas-curso-shougakko img {
    position: absolute;
    top: 15%;
    left: 20%;
}

.jornadas-curso-shougakko h2 {
    color: var(--color-white);
    font-weight: 700;
    margin-bottom: 5.2rem;
}

.cards-jornada-curso {
    height: auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.cards-jornada-curso .dois-tracos-01, 
.cards-jornada-curso .dois-tracos-02,
.cards-jornada-curso .dois-tracos-03,
.cards-jornada-curso .dois-tracos-04 {
    display: none;
}

.card-jornada {
    max-width: 424px;
    /*height: 195px;*/
    padding: 30px 27px;
    border-radius: 20px;
    background-color: var(--color-white);
    position: relative;
    z-index: 3;
}

.card-jornada-title {
    display: flex;
}

.card-jornada-title h3 {
    font-size: 20px;
    font-weight: 600;
    line-height: 140%;
    margin-left: 16.5px;
}

.card-jornada p {
    font-size: 1.8rem;
    margin-top: 2.3rem;
}

#card-2 {
    right: -150%;
    margin-top: 3rem;    
}


#card-4 {
    right: -150%;
    margin-top: 2rem;    
}

#card-5 {
    margin-top: 2rem;    
}

/*COMO FUNCIONA A JORNADA*/
.numbers-slider {
    display: none;
}

.como-funciona-curso-shougakko{
    margin-top: 16rem;
}

.text-como-funciona {
    display: flex;
    justify-content: space-between;
}

.text-como-funciona p {
    max-width: 794px;
}

.numbers-como-funciona {
    margin-top: 6.4rem;
    display: flex;
    justify-content: space-between;
}


.percent-nummber {
    width: 28.7rem;
    height: 28.7rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

#percent-1 {
    border: solid 1px #329FBA;
}

#percent-2 {
    border: solid 3px #329FBA;
}

#percent-3 {
    border: solid 6px #329FBA;
}

#percent-4 {
    border: solid 8px #329FBA;
}

.number-and-simbol {
    display: flex;
    align-items: flex-end;
}

.number-and-simbol h3 {
    font-size: 8rem;
    font-weight: 600;
    font-weight: 600;
    line-height: 8rem;
}

.number-and-simbol span {
    font-size: 4rem;
    font-weight: 600;
    line-height: 4.7rem;
}

.percent-nummber p{
    margin-top: 24px;
    color: var(--color-primary-darker);
    font-size: 2.2rem;
    font-weight: 600;
    line-height: 2.6rem;
    text-align: center;
}

.percent-nummber h4 {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 3.8rem;
    color: var(--color-primary-darker);
}


/*CTA AGENDE SUA CONSULTORIA*/
.consultoria-curso-shougakko {
    width: 100%;
	height: auto;
	border-radius: 14px;
	background-color: #e8ae29;
    display: flex;
	align-items: flex-end;
    margin-top: 7rem;
}

.menina-cta-mobile {
    display: none;
}

.consultoria-curso-shougakko .images-box-cursos {
	height: 100%;
}

.consultoria-curso-shougakko .images-box-cursos img {
    margin-top: -59px;
    margin-right: 7.1rem;
	height: 100%;
}

@media only screen 
and (max-device-width: 600px)
 { .consultoria-curso-shougakko .images-box-cursos img {
    margin-top: -59px;
    margin-right: 7.1rem;
	/*height: 318px;*/
} }

.agende-text-and-button {
    max-width: 574px;
	margin: auto 0;
	background-color: none;
	margin-top: 64px;
	margin-bottom: 72px;
}

.agende-text-and-button h2 {
    font-size: 6rem;
    font-weight: 700;
    line-height: 115%;
    margin-bottom: 2.9rem;
    color: var(--color-white);
}

/*CARDS CHECKPOINT*/
#slide-numero {
    display: none;
}

.checkpoint-curso-shougakko {
    margin-top: 7rem;
    display: flex;
    justify-content: space-between;
}

.card-checkpoint {
    max-width: 613px;
    /*background-color: #F1F6F9;*/
    border-radius: 20px;
    padding-left: 4.8rem;
    display: flex;
    align-items: flex-start;
}

.card-checkpoint:first-child {
	/*padding-left: 0;*/
	padding: 30px 15px 0 30px;
}

.card-checkpoint h4 {
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 229%;
    letter-spacing: 2px;
    color: var(--color-secondary);
}

.card-checkpoint h3 {
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 100%;
    margin-bottom: 1.6rem;
}

.card-checkpoint img {
    margin-left: 4.8rem;
	width:218px;

}

.check-img-mobile {
    display: none;
}

/*BENEFÍCIOS*/

.beneficios-curso-shougakko {
    margin-top: 16rem;
}

.cards-cursos-beneficios {
    margin-top: 4.2rem;
    min-height: 452px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between;
}

.card-beneficio {
    width: 296px;
    height: 212px;
    padding: 3rem 3rem 3rem 3rem;
    border-radius: 20px;
    border: 2px solid #DC1D5420;
}

.icon-texto-beneficio {
    display: flex;
}

.icon-texto-beneficio h3 {
    margin-left: 12px;
    font-size: 2.4rem;
    font-weight: 600;
}

.card-beneficio p {
    margin-top: 2.4rem;
    color: #78818D;
}

/*TEXTO EXPLICATIVO*/

.texto-explicativo-curso-shougakko {
    margin-top: 13rem;
    margin-bottom: 10rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.texto-explicativo {
    max-width: 586px;
}

.texto-explicativo h2 {
    line-height: 155%;
    margin-bottom: 3.1rem;
}

.texto-explicativo-curso-shougakko img {
    width: 594px;
}

@media (max-width: 740px) {

    
  
    h2 {
        font-size: 24px;
    }
  
    p {
        font-size: 14px;
    }

    /*HERO*/
    .hero-curso-shougakko h1 {
        margin-top: 50px;
        font-size: 32px;
    }

    .hero-curso-shougakko P {
        font-size: 16px;
    }

    /*COMO FUNCIONA*/

    .bg-jornada {
        background-image: url(../img/background/fundo-curso-mobile2.svg);
    }

    .jornadas-curso-shougakko h2 {
        margin: 0;
        font-weight: 600;
        line-height: 36px;
    }

    .jornadas-curso-shougakko img {
        display: none;
    }

    .cards-jornada-curso {
        display: flex;
        flex-direction: column;
    }

    .cards-jornada-curso .dois-tracos-01, 
    .cards-jornada-curso .dois-tracos-02,
    .cards-jornada-curso .dois-tracos-03,
    .cards-jornada-curso .dois-tracos-04 {
        display: none;
        /* z-index: 3;
        position: absolute;
        margin-left: 100px; */
    }
	/*
    .cards-jornada-curso .dois-tracos-01 {
        margin-top: 140px;
    }
    .cards-jornada-curso .dois-tracos-02 {
        margin-top: 395px;
    }
    .cards-jornada-curso .dois-tracos-03 {
        margin-top: 652px;
    }
    .cards-jornada-curso .dois-tracos-04 {
        margin-top: 910px;
    } */

    .card-jornada {
        margin-top: 62px;
    }

    #card-2, #card-3, #card-4, #card-5 {
        margin-top: 62px;
        right: 0%;
    }

    /*CARDS COMO FUNCIONA*/
    .como-funciona-curso-shougakko {
        margin-top: 110px;
    }

    .text-como-funciona {
        display: flex;
        flex-direction: column;
    }

    .text-como-funciona p {
        margin-top: 14px;
        margin-bottom: 40px;
        font-size: 16px;
    }

    .numbers-como-funciona {
        display: none;
    }

    .numbers-slider {
        display: block;
    }

    .percent-nummber {
        margin-bottom: 50px;
        margin-right: 0px !important;
        margin-left: 20px;
    }
    
	/*
    .swiper-horizontal>.swiper-pagination-bullets, 
    .swiper-pagination-bullets.swiper-pagination-horizontal, 
    .swiper-pagination-custom, .swiper-pagination-fraction {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }

    .mySwiper2 .swiper-pagination-bullets {
        color: var(--color-gray-80);
    }

    .mySwiper2 .swiper-pagination-bullet-active {
        background-color: var(--color-gray-80);
        width: 27px!important;
        height: 8px;
        border-radius: 8px;
        transition: all .3s;
     } */
	

    /*CTA AGENDE SUA CONSULTORIA*/

    .consultoria-curso-shougakko {
         flex-direction: column;
    }

    .menina-cta-mobile {
        display: block;
    }
    .menina-cta-descktop {
        display: none;
    }

    .agende-text-and-button h2 {
    font-size: 36px;
    /*line-height: 46px;*/
    max-width: 80%;
    }

    .agende-text-and-button {
        margin: 30px 0 60px 30px;
    }

    /*CHECKPOINT*/
    .checkpoint-curso-shougakko {
        display: flex;
        flex-direction: column;
    }

    .card-checkpoint {
        display: flex;
        padding: 30px 30px 0 30px;
        flex-direction: column;
        margin-bottom: 30px;
    }

    .card-checkpoint img {
        margin: 0;
    } 

    .card-checkpoint p {
        font-size: 16px;
    }

    .check-img-descktop {
        display: none;
    }

    .check-img-mobile {
        display: block;
    }

    .check-img-mobile {
        margin: 32px 32px 0 32px !important;
    }

    /*BENEFICIOS*/

    #slide-numero {
        display: block;
    }

    .beneficios-curso-shougakko {
        margin-top: 120PX;
    }

    .beneficios-curso-shougakko h2 {
        margin-bottom: 30px;
    }

    .cards-cursos-beneficios {
        display: none;
    }

    .card-beneficio {
        margin-left: 18px;
        width: 90%;
        margin-bottom: 20px;
    }

    .card-beneficio p {
        font-size: 18px;
    }
    

    /*SLIDER*/
	/*
    .slider-details {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 230px;
        height: 50px;
        float: right;
        margin-right: 10px;
    }

    .swiper-pagination {
        z-index: 5;
        background-color: #F4F4F5;
        width: 132px !important;
        border-radius: 40px;
        margin-left: 50px;
        display: flex;
        flex-direction: row;
    }

    .slider-details .swiper-pagination-bullet {
        height: 36px;
        width: 36px;
        border-radius: 29px;
        background-color: #F4F4F5;
        color: var(--color-gray-60);
        opacity: unset;
        font-family: 'Montserrat', sans-serif;
        font-size: 14px;
        font-weight: 400;
        line-height: 21px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        left: 0%;
    }


    .slider-details .swiper-pagination-bullet-active {
        background-color: var(--color-secondary);
        color: white;
    }

    .slider-details .swiper-button-next, .swiper-button-prev {
        height: 36px !important;
        width: 36px !important;
        background-color: #F4F4F5;
        font-size: 10px;
        border-radius: 36px;
        color: var(--color-secondary);
    }

    .slider-details .swiper-button-prev::after, .swiper-button-next:after {
        font-size: 10px;
        font-weight: 700;
    } */
    


    /*TEXTO EXPLICATIVO*/
    .texto-explicativo-curso-shougakko {
        display: flex;
        flex-direction: column;
        margin-top: 120px;
    }

    .texto-explicativo-curso-shougakko img {
        margin-top: 50px;
        max-width: 110%;
    }

    .texto-explicativo p {
        font-size: 16px;
    }


}



/*DEPOIMENTOS*/
.depoimentos {
    margin-top: 7rem;
    padding: 7rem 0 5.6rem 0;
    background-color: var(--color-primary-darker);
}

.depoimentos h2 {
    /*max-width: 564px;*/
    margin-left: 4rem;
    color: var(--color-white);
}

.slider-details {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    /* width: 230px; */
	width: 12%;
    height: 0;
    margin-top: 24px;
    margin-bottom: 11.7rem;
    float: right;
}

.swiper-button-next:after,
.swiper-rtl
.swiper-button-prev:after {
    content: 'next';
    font-size: 10px;
}

.swiper-button-prev:after,
.swiper-rtl
.swiper-button-next:after {
    content: 'prev';
    font-size: 10px;
}

.swiper-button-next, .swiper-button-prev {
    position: absolute;
    width: 32px;
    height: 32px;
    background-color: var(--color-white);
    color: var(--color-secondary);
    font-weight: bold;
    border-radius: 50%;
    top: auto;
	background-image: none !important;
}

.swiper-button-next.swiper-button-disabled, 
.swiper-button-prev.swiper-button-disabled {
    opacity: 1;
    color: var(--color-gray-30);
    cursor: auto;
    pointer-events: none;
}


.swiper-horizontal>.swiper-pagination-bullets, 
.swiper-pagination-bullets.swiper-pagination-horizontal, 
.swiper-pagination-custom, .swiper-pagination-fraction {
    position: relative;
    float: right;
    width: auto;
    height: 32px;
    display: flex;
    align-items: center;
    border-radius: 16px;
    background-color: var(--color-white);
    top: 50%;
}

.swiper-horizontal>.swiper-pagination-bullets
.swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets
.swiper-pagination-bullet{
    margin: 0;
}

  .mySwiper .swiper-pagination-bullet {
    font-family: 'Montserrat', sans-serif; 
    width: 32px;
    height: 32px;
    font-size: 15px;
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-black);
    background-color: var(--color-white);
    transition: all .4s linear;
    opacity: 1;
  }

  .mySwiper .swiper-pagination-bullet-active {
    width: 36px;
    height: 36px;
    color: var(--color-white);
    background: var(--color-secondary);
    transition: all .4s linear;
  }

  /* MENU DO FOOTER ESTAVA AQUI */
   /* MENU DO FOOTER ESTAVA AQUI */
 
  .differentials-slider {
      display: none;
  }

  #dep-principal {
    display: block;
    }
    #dep-mobile {
        display: none;
    }

  @media (max-width: 950px) {
    #dep-principal {
        display: none;
    }

    #dep-mobile {
        display: block;
    }
	  
	.slider-details {
		width: 52%;
	}

    .card-depoimentos {
        max-width: 100%;
        margin-top: 24px;
        margin-bottom: 30px;
    }

  }

  
