/***** banner *****/
.banner                         { display: grid; grid-template-columns: 50% 50%; position: relative; align-items: start; padding-top: 190px;}
.banner::before                 { content: ""; display: block; position: absolute; top: 0; width: 100vw; height: 680px; background: #fed409; left: 50%; margin-left: -200px;}
.banner .texte                  { padding-top: 60px;}
.banner .photo                  { position: relative; left: -95px;}
.banner .titre_main             { font-size: 60px; line-height: 70px;}
.banner li                      { font-size: 20px; font-weight: 500;}

@media (max-width: 1000px) {
.banner                         { grid-template-columns: 1fr; padding-top: 100px;}
.banner .titre_main             { text-align: center;}
.banner .titre_main br          { display: none;}
.banner .photo                  { left: 0;}
.banner .photo img              { width: 120%; height: auto;}
.banner .ul_list                { text-align: center;}
.banner li                      { display: inline-block; vertical-align: top; background: none; padding: 0;}
.banner li:not(:first-child):before { content: "-"; margin-right: 5px;}
}
@media (max-width: 700px) {
.banner                         { padding-top: 110px;}
.banner .titre_main             { font-size: 25px; line-height: 35px; margin-bottom: 5px;}
.banner li                      { font-size: 15px; line-height: 25px; padding: 0;}
.banner .ul_list                { margin: 0 auto 20px; max-width: 300px;}
.banner::before                 { display: none;}
.banner .photo                  { position: relative;}
.banner .photo img              { position: relative; z-index: 1;}
.banner .photo::after           { content: ""; display: block; position: absolute; top: 20%; left: calc(50% - 105px); bottom: 14%; width: 100vw; background: #fed409;}
}
@media (max-width: 400px) {
.banner .titre_main             { font-size: 20px; line-height: 25px; margin: 10px 0 20px 0;}
.banner .ul_list                { display: none;}
}

/***** bloc texte *****/
.intro                          { margin: 40px 0 95px;}
.intro .bandeau                 { display: none;}
.intro h2                       { display: inline;}
.bloc_texte                     { margin: 100px 0 70px;}


@media (max-width: 1200px) {
.bloc_texte                     { margin: 70px 0;}
}
@media (max-width: 700px) {
.intro                          { margin: 30px 0 0;}
.intro .bandeau                 { display: grid; margin-bottom: 40px;}
.bloc_texte                     { margin: 45px 0 30px;}
}




/***** bloc photo *****/
.bloc_photo                     { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 50px; position: relative; padding-bottom: 145px;}
.bloc_photo::after              { content: ""; display: block; position: absolute; width: 100vw; top: 30%; bottom: 0; right: 50%; background: #fed409;}
.bloc_photo .item               { position: relative; z-index: 1;}
.bloc_photo .item .label        { background: #fff; position: absolute; right: 10px; top: 10px; font: 500 13px/40px "Barlow"; padding: 0 20px; color: #14239a;}
.bloc_photo .item img           { width: 100%; height: auto; display: block;}
.bloc_photo .link               { width: 100%; height: 70px; line-height: 70px; text-align: left; font-size: 18px;}
.bloc_photo .link::after        { content: url(../images/arrow_right.svg); display: block; position: absolute; right: 30px; top: 50%; transform: translateY(-50%);}
.bloc_photo .content            { background: #fff; padding: 30px; font-size: 15px;}

@media (max-width: 1366px) {
.bloc_photo                     { gap: 30px;}
}
@media (max-width: 1200px) {
.bloc_photo                     { padding-bottom: 80px;}
}
@media (max-width: 1000px) {
.bloc_photo                     { grid-template-columns: 1fr; padding-bottom: 0;}
.bloc_photo::after,
.bloc_photo .content            { display: none;}
.bloc_photo .item .label        { display: none;}
}
@media (max-width: 700px) {
.bloc_photo .link               { line-height: 60px; height: 60px; font-size: 15px; padding: 0 20px;}
.bloc_photo .link::after        { right: 20px;}
.bloc_photo                     { gap: 10px !important; margin-top: 30px;}
.bloc_photo .item img           { display: none;}
/*.bloc_photo .item               { position: static;}*/
.photos .item:nth-of-type(1) img { display: block; position: relative; top: 0; height: 300px; object-fit: cover; margin-bottom: 10px;}
}


/***** bandeau *****/
.bandeau                        { text-align: center; display: grid; justify-content: center; align-items: center; background: #14239a; height: 110px; font-size: 18px; font-weight: 500; margin-bottom: 120px;}
.bandeau br                     { display: none;}
.bandeau span                   { position: relative; padding: 0 75px 0 100px; background: url(../images/arrow_right.svg) right center no-repeat;}
.bandeau span i                 { display: grid; justify-content: center; align-items: center; position: absolute; left: 0; width: 70px; height: 70px; border-radius: 50%; background: #fff; top: 50%; margin-top: -35px;}

@media (min-width: 1201px) {
.bandeau:hover                  { background: #000;}
}
@media (max-width: 1200px) {
.bandeau                        { margin-bottom: 80px;}
}
@media (max-width: 700px) {
.bandeau                        { font-size: 15px; line-height: 22px; justify-content: initial; padding: 0 20px; height: 80px; color: #fff; margin-bottom: 50px;}
.bandeau span                   { position: static; display: block;}
.bandeau br                     { display: initial;}
.bandeau span i                 { width: 50px; height: 50px; margin-top: -25px; left: 20px;} 
.bandeau span i img             { transform: scale(0.8);}
}



/***** studio *****/
.studio                         { padding-bottom: 95px; background: linear-gradient(to bottom, #fff 0 190px, #fed409 190px); margin-bottom: 140px;}
.studio .bandeau                { margin-bottom: 0;}
.studio .bloc_photo             { gap: 30px; padding-bottom: 0;}
.studio .bloc_photo::after      { display: none;}
.studio .texte                  { text-align: center; font-size: 20px; font-weight: 500; margin: 70px 0 35px;}


@media (max-width: 1200px) {
.studio                         { padding-bottom: 80px; margin-bottom: 80px;}
}
@media (max-width: 1000px) {
.studio                         { background: none; padding-bottom: 0;}
}
@media (max-width: 700px) {
.studio                         { margin-bottom: 50px;}
.studio .bloc_photo .item:first-of-type img { display: block; position: relative; top: 0; height: 300px; object-fit: cover; margin-bottom: 10px;}
.studio .texte                  { font: 400 14px/26px "Barlow"; text-align: left; margin: 30px 0 20px;}
.studio .texte br               { display: none;}
}


/***** encadrement *****/
.bloc_grid                      { margin: 0 0 115px;}
.bloc_grid .link span           { display: none;}

@media (max-width: 1200px) {
.bloc_grid                      { margin-bottom: 80px;}
}
@media (max-width: 700px) {
.bloc_grid                      { gap: 0; margin-bottom: 50px;}
.bloc_grid .photo               { line-height: 0;}
.bloc_grid .titre_main,
.bloc_grid .sous_titre,
.bloc_grid p                    { display: none;}
.bloc_grid .link                { width: 100%; margin: 0; padding: 0 20px; background: url(../images/arrow_right.svg) right 20px center no-repeat #14239a; text-align: left; font-size: 0;}
.bloc_grid .link span           { font-size: 15px; display: block;}
}


/***** more content *****/
.morecontent                        { margin-top: 105px;}
.link-moins,.link-plus              { cursor:pointer; color: #000; border-bottom: 1px solid #000;}
.textMore                           { display: none; margin-top: 40px;}
.textMore p:not(:first-of-type)     { margin-top: 15px;}

@media (min-width: 1201px) {
.link-moins:hover,.link-plus:hover  { color: #fed409; border-color: #fed409;}
}

@media (max-width: 1200px) {
.morecontent                        { margin-top: 70px;}
}
@media (max-width: 700px) {
.morecontent                        { margin-top: -5px;}
}



/***** atout *****/
.atout                              { text-align: center; display: grid; grid-template-columns: repeat(4, 1fr);}
.atout .sous_titre                  { margin-bottom: 0;}

@media (min-width: 700px) {
.atout .stat                        { display: inline-block; vertical-align: top; padding: 10px; background: url(../images/shape_left.svg) left top / contain no-repeat, url(../images/shape_right.svg) right top / contain no-repeat; margin-bottom: 20px;}
.atout .stat span                   { min-width: 80px; line-height: 60px; font: 400 35px/60px "PT Serif"; letter-spacing: 0; color: #14239a; background: #fed409; display: inline-block; vertical-align: top; position: relative;}
}
@media (max-width: 1000px) {
.atout                              { grid-template-columns: 1fr 1fr; gap: 30px;}
}

@media (max-width: 700px) {
.atout                              { grid-template-columns: 1fr; gap: 10px; text-align: left; margin: 55px 0 0;}
.atout .stat                        { display: inline; font-weight: 500;}
.atout .item                        { padding-left: 35px; background: url(../images/list.svg) left 3px no-repeat;}
.atout .sous_titre                  { display: inline;}
.atout .sous_titre br               { display: none;}
}



/***** moving photos *****/
.moving_photos 								{ width: 100%; font-size: 0; line-height: 0; letter-spacing: 0; text-align: left; position: relative; margin: 105px 0 80px;}
.moving_photos .row							{ width: 9000px; display: inline-block; vertical-align: middle; position: relative; z-index: 5;}
.moving_photos .row .item 					{ display: inline-block; vertical-align: middle; animation: sliding 60s linear infinite;}
.moving_photos .row .item img 				{  max-height: 460px; display: inline-block; vertical-align: middle; position: relative; transition: all 400ms ease-in-out; margin-left: 30px;  object-fit: cover;}

@keyframes sliding {
0%											{ transform: translateX(0);}
100% 										{ transform: translateX(-100%);}
}

@media (max-width: 1200px){
.moving_photos                              { margin-top: 70px;}
}
@media (max-width: 1000px){
.moving_photos                              { margin: 80px 0;}
.moving_photos .row .item img 				{ margin-left: 40px;}
}
@media (max-width: 700px){
.moving_photos 								{ margin:40px 0;}
.moving_photos .row .item img 				{ margin-left: 10px; height: 290px; width: auto;}
.moving_photos .row .item img.img_vert		{ height: 500px;}
}