/***** banner *****/
.banner 							{ width:100%; height: 100%; position:relative; z-index:10; padding-top: 185px;}
.banner .slider 	                { max-height: 600px; max-width: 850px;}
.banner .slider img                 { margin-right: 20px; border-radius: 20px;}
.banner .slider:before              { content: ""; display: block; position: absolute; top: 50%; bottom: 0; left: -1000px; right: -1000px; background-color: #2a2a2a;}
.banner .slider:after               { content: ""; width: 1000px; height: 100%; background: #fdd329; position: absolute; top: 0; bottom: 0; right:calc(100% + 20px); border-radius: 20px;}
.banner .titre_main 				{ margin-bottom: 40px;}
.banner .slick-dots                 { position: absolute; left: 40px; bottom: 25px;}

@media (max-width:1200px) {
.banner .slider img                 { margin-right: 20px;}
.banner .slider:after               { right: calc(100% + 20px); }
}
@media (max-width:1000px) {
.banner .slider img                 { min-height: 65vw; object-fit: cover; margin-right: 15px;}
.banner .slider:after               { right: calc(100% + 15px); }
}
@media (max-width:600px) {
.banner                             { padding-top: 25px; margin-top: 80px;}
.banner .titre_main                 { margin-bottom: 20px;}
.banner .slider                     { margin: 0 -7.5vw;}
.banner .slider img                 { min-height: 85vw; object-fit: cover; margin-right: 0; border-radius: 0;}
.banner .slick-dots                 { left: 0; right: 0;}
.banner .slider:after               { display: none}
}





/***** intro *****/
.intro 									{ padding: 105px 0; background-color: #2a2a2a; color: #fff;}
.intro .since                           { text-align: center; background: url(../images/since.svg) center / contain no-repeat; width: 120px; height: 120px; display: grid; align-items: center; justify-content: center; font: 600 16px/28px "Source Sans 3";}
.intro .since strong                    { display: block; font-size: 26px;}
.intro .since span                      { padding-bottom: 10px;}
.intro .wrapper                         { display: grid; grid-template-columns: 115px auto; gap: 50px; align-items: center; padding-right: 255px;}
.intro .chapo 							{ max-width: 1000px; margin: 0 auto; padding-top: 5px; color: #fff;}

@media (max-width:1200px) {
.intro 									{ padding: 80px 0;}
}
@media (max-width:1000px) {
.intro 									{ padding: 45px 5vw 150px;}
.intro .wrapper                         { padding-right: 0;}
}
@media (max-width:600px) {
.intro .chapo							{ display: none;}
.intro                                  { padding: 50px 0;}
.intro .wrapper                         { grid-template-columns: auto; gap: 0; justify-content: center;}
}

.textMore                            { margin: 80px 0; display: none;}
.link-moins,
.link-plus                           { cursor: pointer;}
@media (max-width:600px) {
.textMore                            { margin: 50px 0;}
}

.services                            { position: relative; left: -15px;}
.services:after                      { content: ""; display: block; position: absolute; top: 0; bottom: 50%; left: -1000px; right: -1000px; background-color: #2a2a2a; z-index: -1;}
.services .slider                    { width: 1715px;}
.services .slick-list                { position: relative; z-index: 1; overflow: hidden;}
.services .item                      { background-color: #fff; border-radius: 20px; padding: 60px 40px 70px; box-shadow:0 10px 21px 0 rgba(0,0,0,0.1); margin: 0 15px 40px;}
.services .item p                    { margin-bottom: 25px;}
.services .item img                  { margin-bottom: 30px; }
.services .item .sous_titre          { font-size: 18px; line-height: 24px; margin-bottom: 5px;}
.services .nav_slider                { position: absolute; right: 0; top: -115px; width: 150px; height: 150px; border-radius: 50%; display: grid; grid-template-columns: 50px 50px; align-items: center; justify-content: center; background-color: #fdd329; z-index: 0;}
.services .slick-arrow               { display: grid; grid-template-columns: 50px 50px;}
.services .titre                     { margin-bottom: 35px;}
@media (max-width:1200px) {
.services .slider                    { width: 120vw; }
.services .item                      { border-radius: 15px; padding: 40px 50px; min-height: inherit}
}
@media (max-width:1000px) {
.services .grid                      { grid-template-columns: 1fr; grid-gap: 15px; }
}
@media (max-width:600px) {
.services                            { left: auto; padding: 0 0 50px;}
.services .slider                    { width: 100%; position: relative; z-index: 2;}
.services .nav_slider,
.services .link_arrow:before,
.services .item p                    { display: none;}
.services .item                      { position: relative; height: 80px; border-radius: 5px; padding: 0 15px; margin: 0 0 10px; display: grid; grid-template-columns: 65px 1fr; grid-gap: 15px; align-items: center;}
.services .item .sous_titre          { font-size: 15px; margin-bottom: 0; padding-right: 50px;}
.services .item .link_arrow          { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; justify-content: end; padding: 0 20px;}
.services .item .link_arrow img      { left: auto; height: auto;}
.services .titre                     { margin-bottom: 30px;}
.services .item img                  { height: 45px; display:block;margin:0 auto;}
.services:after                      { top: 0; bottom: 0;}
}

.prestation                          { margin: 60px 0 100px;}
@media (max-width:600px) {
.prestation                          { margin-bottom: 50px;}
}

/***** bandeau contact ****/
.bandeau                                { text-align: center; background: url(../images/bg_bandeau.webp) center / cover no-repeat; border-radius: 15px; padding: 85px 20px 100px;}
.bandeau .sous_titre                    { color: #fff; margin-bottom: 25px;}
.bandeau .link                          { margin: 0 2px;}
@media (max-width:600px) {
.bandeau                                { border-radius: 0; background: #282828; padding: 45px 0 50px; position: relative;}
.bandeau .sous_titre                    { text-transform: initial;}
.bandeau .link                          { width: 171px; display: block; margin: 10px auto 0;}
.bandeau:before                         { content: ""; display: block; position: absolute; top: 0; bottom: 0; left: -100px; right: -100px; background: #282828;}
}


.bloc_grid.custom .photo                { left: -5px;}
.bloc_grid.custom .photo img            { width: 58%; border: 5px solid #fff; display: inline-block; vertical-align: top;}
.bloc_grid.custom .photo>div:last-of-type   { text-align: right; margin-top: -200px;}
.bloc_grid.custom .photo:before         { display: none;}

@media (max-width:1000px) {
.bloc_grid.custom .photo                { max-width: 500px;}
}
@media (max-width:600px) {
.bloc_grid.custom .photo img            { width: 54%;}
.bloc_grid.custom .photo>div:last-of-type   { margin-top: -20%;}
}


/***** atouts *****/
.atout                                  { background: #fdd329; text-align: center; letter-spacing: 0.5px; margin-top: 165px;}
.atout_grid                             { display: grid; grid-template-columns: repeat(4, 1fr);}
.atout .item                            { padding: 90px 0 80px; position: relative;}
.atout .icon                            { display: grid; align-items: center; justify-content: center; background: #fff; width: 130px; height: 130px; margin: auto; position: absolute; top: -65px; left: 0; right: 0; border-radius: 50%; box-shadow: 0 0 40px 0 rgba(0,0,0,0.08);}
.atout strong                           { text-transform: uppercase; display: block; font-size: 18px;}
@media (max-width:760px) {
.atout                                  { text-align: left; padding: 50px 0; margin-top: 60px;}
.atout_grid                             { grid-template-columns: auto; gap: 10px;}
.atout .item                            { display: grid; align-items: center; gap: 30px; grid-template-columns: 100px auto; padding: 0;}
.atout .icon                            { position: static; margin: 0; width: 100px; height: 100px;}
.atout strong                           { font-size: 16px;}
.atout span                             { line-height: 26px;} 
.prestation .photo:before               { display: none;}
}
@media (max-width:600px) {
.atout .icon img                        { max-height: 50px; max-width: 54px;}
}