/***** banner : fullscreen *****/
.banner_fullscreen                          	{ position: relative; border-radius: 0 0 70px 70px; overflow: hidden; margin: var(--marginTB); margin-top: 0;}
.banner_fullscreen .img img                		{ height: 85vh; max-height: 1200px; min-height: 600px; object-fit: cover; width: 100%; display: block; background: #444; filter: brightness(0.7);}
.banner_fullscreen .titre_main             		{ color: #fff; margin: 0 0 5px 0; letter-spacing: 1.5px;}
.banner_fullscreen .sous_titre             		{ color: #fff; margin: 0;}
.banner_fullscreen .link      		       		{ margin: 15px 0 0 0;}
.banner_fullscreen .content                 	{ position: absolute; left: 0; top: 0; height: 100%; width: 100%; display: grid; justify-content: center; align-items: center; text-align: center;}
.banner_fullscreen .cta                   		{ position: absolute; bottom: 0; right: 50%; transform: translateX(50%); background: var(--bgColorDark); color: #fff; width: auto; border-radius: 60px 60px 0 0; padding: 12px 80px 0 22px;}
.banner_fullscreen .cta span              		{ color: #fff;}
.banner_fullscreen .cta:after            		{ content: ""; position: absolute; width: 60px; height: 60px; border-radius: 0 0 0 40px; background: transparent; bottom: 0; right: -60px; box-shadow: -20px 20px var(--bgColorDark); transition: none;}
.banner_fullscreen .cta:before            		{ content: ""; position: absolute; width: 60px; height: 60px; border-radius: 0 0 40px 0; background: transparent; bottom: 0; left: -60px; box-shadow: 20px 20px var(--bgColorDark); transition: none;}
.banner_fullscreen .button_cta                  	{ display: grid; align-items: center; text-align: left; position: relative; padding-left: 100px; font-size: 20px; line-height: 30px; font-weight: 700; color: #000; height: 90px;}
.banner_fullscreen .button_cta:before          		{ position: absolute; width: 75px; height: 75px; background: url("../images/tel_cta.svg") 50% no-repeat var(--mainColor1); background-size:  left: 10px; top: 10px; border-radius: 50%; content: "";}
.banner_fullscreen .button_cta i  	        		{ font-style: normal; display: inline-block; padding-right: 45px; position: relative; height: auto; transition: all 300ms ease-in-out;}
.banner_fullscreen .button_cta i:after        		{ position: absolute; width: 26px; height: 14px; right: -20px; top: -12px; background: url(../images/arrow_link.svg) right center no-repeat; content: "";}


@media (min-width:1201px) {
.banner_fullscreen .button:hover:before 		{ background-color: #fff; background-image: url(../images/tel_cta_orange.svg);}
.banner_fullscreen .button:hover i:after        { right: -40px;}
}
@media (max-width:1200px) {
.banner_fullscreen                          	{ border-radius: 0 0 60px 60px; }
.banner_fullscreen .img img                		{ height: 80vh;}
.banner_fullscreen .cta                   		{ border-radius: 50px 50px 0 0; padding: 8px 60px 0 10px;}
.banner_fullscreen .button_cta                  { height: 70px; padding-left: 85px;}
.banner_fullscreen .button_cta:before          	{ top: 6px; left: 12px; width: 60px; height: 60px; background-size: 35px auto;}
}
@media (max-width:1000px) {

}
@media (max-width:700px) {
.banner_fullscreen                          	{ border-radius: 0 0 20px 20px;}
.banner_fullscreen .img img                     { height: 70vh; min-height: 350px; max-height: 650px;}
    
.banner_fullscreen .cta                   		{ display: block; width: max-content; border-radius: 20px 20px 0 0;}
.banner_fullscreen .cta:after            		{ display: none;}
.banner_fullscreen .cta:before            		{ display: none;}
.banner_fullscreen .button_cta          		{ height: 50px; font-size: 16px;}
.banner_fullscreen .button_cta:before          	{ width: 40px; height: 40px; background-size: 25px auto;}
}



/***** quote : simple *****/
.quote_simple 											{ position: relative; text-align: center; margin: var(--marginTB);}
.quote_simple:before									{ position: absolute; width: 94vw; max-width: calc(47vw + 720px); left: auto; right: 3vw; top: 0; bottom: 0; background: #eee; border-radius: 50px; visibility: hidden; transition: none; content: "";}
.quote_simple svg										{ width: 60px; height: auto; display: block; margin: 0 auto 15px auto;}
.quote_simple p               							{ margin-bottom: 15px;}
.quote_simple .link										{ margin-top: 10px;}
.quote_simple .sous_titre								{ font-size: 40px; letter-spacing: 1.5px; font-weight: 400; color: #fff; text-transform: inherit;}
.quote_simple :last-child								{ margin-bottom: 0;}

@media (max-width:1200px) { 
.quote_simple .sous_titre								{ font-size: 30px; line-height: 40px;}
}
@media (max-width:1000px) { 
.quote_simple .sous_titre								{ font-size: 25px; line-height: 35px;}
}
@media (max-width:700px) { 
.quote_simple .sous_titre								{ font-size: 20px; line-height: 30px;}
.quote_simple svg										{ width: 40px; margin-bottom: 10px;}
.quote_simple p               							{ margin-bottom: 10px;}
}





/**** how it works ****/
.differences                                    { padding: 100px 0; background-color: #fff; }
.differences .txt_simple                        { margin: 40px 0 0; }
.differences.how 								{ position: relative;}
.differences.how .sous_titre 					{ text-align: center;}
.differences.how .shape 						{ width: 100%; height: auto; display: block;}
.differences.how .etapes 						{ display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap: 10px; text-align: center; margin-bottom: 20px;}
.differences.how .etapes img					{ display: block; margin: 0 auto; width: 100%; max-width: 180px; height: auto;}
.differences.how .etapes a 						{ display: block; font-size: 16px; letter-spacing: 0.8px; font-weight: 500; color: #000; border: 2px solid transparent; position: relative;}
.differences.how .etapes a .bad:after           { content: ""; width: 27px; height: 27px; background: url("../images/icon_none_1.svg") 50% / cover no-repeat; position: absolute; right: 40px; bottom: 80px;}
.differences.how .etapes a .good:after 		    { content: ""; width: 27px; height: 27px; background: url("../images/icon_check_1.svg") 50% / cover no-repeat; position: absolute; right: 40px; bottom: 80px;}

.differences.how .etapes a:after				{ width: 2px; height: 0; background: var(--mainColor1); position: absolute; left: 50%; bottom: -30px; margin-left: -1px; content: "";}
.differences.how .etapes a.active:after 		{ height: 30px;}
.differences.how .etapes a.active          		{ color: var(--mainColor1);}
.differences.how .etapes a span					{ display: block; font-weight: 500; font-size: 60px; line-height: 60px; color: var(--mainColor1); margin-bottom: 10px; letter-spacing: 0;}

.differences .show_hide_how                      { position: relative; margin: 50px 0 0 0;}
.differences .show_hide_how .item                { margin-bottom: 0; color: #000;}
.differences .show_hide_how .titre               { display: none;}
.differences .show_hide_how .hide                { max-width: 1150px; margin: 0 auto; padding: 0; display: none;}
.differences .show_hide_how img                  { display: none;}

@media (min-width:1201px) {
.differences.how .etapes a:hover          		 { color: var(--mainColor1);}
}
@media (max-width: 1200px){
.differences.how .titre_main 					 { top: 60px;}
.differences.how .etapes 					 	 { margin-top: -23px;}
.differences.how .etapes a 						 { font-size: 16px;}
.differences.how .etapes a span					 { font-size: 50px; line-height: 50px;}
}
@media (max-width: 1000px){
.differences                                    { padding: 80px 0;}
.differences.how .titre_main 					 { top: 30px;}
.differences.how .etapes 						 { display: none;}

.differences .show_hide_how                      { margin: 60px 0 0 0;}
.differences .show_hide_how .item                { margin: 0; border-bottom: 1px solid #ccc;}
.differences .show_hide_how .titre               { position: relative; display: block; padding: 0 0 15px 0; background: none; margin-top: 0;}
.differences .show_hide_how .item img            { display: block; width: 100px; height: auto}
.differences .show_hide_how .titre span          { display: block; font-weight: 600; font-size: 40px; line-height: 40px; margin-bottom: 5px; color: #1b3e6d;}
.differences .show_hide_how .titre.active 		 { background: none;}
.differences .show_hide_how .titre.active:after  { transform: rotate(180deg);}
.differences .show_hide_how .hide                { padding: 10px 0 35px 0; display: block}
}
@media (max-width: 700px){
.differences                                    { padding: 60px 0;}
.differences.how .titre_main 					 { position: static; margin-bottom: -10px;}

.differences .show_hide_how                      { margin: 40px 0 0 0;}
.differences .show_hide_how .titre span          { font-size: 35px; line-height: 35px;}
.differences .show_hide_how .hide                { padding: 5px 0 25px 0;}
}




.assets_v2 									{ position: relative; padding: 60px 0;}
.assets_v2 .container						{ display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 20px; align-items: center; position: relative;}
.assets_v2 .item img 						{ display: block; width: 100%; height: auto; border-radius: 15px;}
.assets_v2 .item ul 						{ margin: 0;}

.assets_v2.reverse:before 					{ left: 50%; right: 20px;}
.assets_v2.reverse .item:first-child  		{ grid-area: 1 / 3;}
.assets_v2.reverse .item ul  				{ padding-left: 60px;}

@media (max-width: 1200px){
.assets_v2.reverse .item ul  				{ padding-left: 30px;}
}

@media (max-width: 1000px){
.assets_v2 .container						{ grid-template-columns: 1fr 1fr; }
.assets_v2.reverse .item:first-child  		{ grid-area: span 2;}
}

@media (max-width: 700px){
.assets_v2 .container						{ grid-template-columns: 1fr; }
.assets_v2.reverse .item ul  				{ padding-left: 0; padding-bottom: 30px;}
}



.arrondis:before                             { content: ""; display: block; background: var(--bgColorDark); height: 50px; width: 100%; position: relative; top: -100px; left: 0; border-radius: 0 0 70px 70px; z-index: 20; }
.arrondis:after                              { content: ""; display: block; background: var(--bgColorDark); height: 50px; width: 100%; position: relative; bottom: -100px; left: 0; border-radius: 70px 70px 0 0 ; z-index: 20; }

@media (max-width: 700px){
.arrondis:before                             { top: -60px; }
.arrondis:after                              { top: 60px; }
}




.services                                    { margin-bottom: 120px;} 
.services .img :first-of-type                { margin-top: -60px;} 
.services .img .flottant                     { max-width: 150px; position: absolute; bottom: 0; left: 25%; transform: translateX(-50%); z-index: 10;} 
.services .img .flottant img                 { display: block; width: 100%; height: auto;} 
.services .ul_list li                        { color: #fff; } 

@media (max-width: 1000px){
.services                                    { margin-top: 120px; margin-bottom: 90px;} 
}

@media (max-width: 600px){
.services                                    { margin-top: 100px; margin-bottom: 40px;} 
}



.about .macaron                              { text-align: center; display: grid; align-items: center; justify-content: center; width: 140px; height: 140px; border-radius: 50%; background-color: var(--mainColor1); position: absolute; top: -50px; left: 50px; z-index: 10; align-content: center; justify-items: center;}
.about .macaron i                            { font-style: normal; font-size: 14px; line-height: 18px; text-transform: uppercase; font-weight: 700; }
.about .macaron span                         { color: #fff; font-size: 45px; line-height: 45px;}

@media (max-width: 700px){
.about .macaron                              { width: 120px; height: 120px; top: -50px; left: 30px; z-index: 50; }
.about .macaron i                            { font-size: 12px; }
.about .macaron span                         { font-size: 35px; line-height: 35px;}
}