/***** top_page *****/
.top_page                          	{ position: relative; padding-top: 150px; background: #f6f1ea; padding-bottom: 100px; overflow: hidden;}
.top_page .content                 	{ width: 90vw; max-width: var(--maxWidthWrapper); margin: 0 auto; position: relative;}
.titre_main	 			               { font: 400 clamp(22px, 3vw, 35px)/130% "Outfit"; margin-bottom: 0; }
.top_page .chapo                    { margin-bottom: 0; font: 400 28px / 38px "Outfit";}
.top_page .page_content             { overflow: hidden;}
.top_page .sous_titre               { font: 400 20px / 38px "Outfit"; font-style: italic; color: var(--mainColor1);}

@media (max-width:1200px) { 
.top_page                           { padding-top: 100px; padding-bottom: 50px;}   
}

@media (max-width:1000px) { 
.top_page                           { padding-top: 120px;}   
.top_page .chapo                    { font: 400 20px / 30px "Outfit";}
.top_page .sous_titre               { font: 400 16px / 30px "Outfit";}
}

@media (max-width:800px) {  
.top_page                           { padding-top: 100px; padding-bottom: 30px;}     
.top_page .chapo                    { font: 400 14px / 20px "Outfit";}
}


/***** breadcrumb *****/
.breadcrumb							{ line-height: 0; position: relative; margin-top: 20px; margin-bottom: 30px;  display: inline-block;}
.breadcrumb a                       { color: #444444;}
.breadcrumb a.active                { color: #790008;}
.breadcrumb li 						{ display: inline-block; font-size: 12px; line-height: 20px; letter-spacing: 0.4px; margin-right: 30px; position: relative;}
.breadcrumb li:after				{ width: 1px; height: 10px; position: absolute; right: -15px; top: 5px; background: #444444; content: "";}
.breadcrumb li:last-child:after 	{ display: none;}
.breadcrumb li:last-child        	{ margin-right: 0;}
.breadcrumb li:last-child a       	{ color: #790008;}

@media (min-width:1201px) {
.breadcrumb li a:hover				{ color:#790008;}
}
@media (max-width:1000px) { 
.breadcrumb							{ display: none;}
}


.titre_main     { margin-bottom: 20px;}


/***** bloc grid *****/
.bloc-grid                              { width: 90vw; max-width: var(--maxWidthWrapper); margin: var(--marginTB); display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; grid-gap: 40px 80px; position: relative;}
.bloc-grid.full                         { width: 90vw; max-width: var(--maxWidthWrapperLarge); }
.bloc-grid.full .texte                  { padding-right: 100px; padding-left: 0;}
.bloc-grid.full .photo img              { width: 100%; height: auto; border-radius: var(--imgRadius);}
.bloc-grid.reverse .texte               { order: 1; padding-left: 100px; padding-right: 0;}
.bloc-grid.reverse .photo               { order: 2;}
.bloc-grid .texte :last-child           { margin-bottom: 0;}

.bloc-grid-info                         { width: 90vw; max-width: var(--maxWidthWrapperSmall); gap: 0 40px; margin: var(--marginTB); display: grid; grid-template-columns: repeat(2, 1fr);}
.bloc-grid-info .item                   { overflow: hidden; background: var(--bgColorLight); border-radius: var(--imgRadius);}
.bloc-grid-info .item img               { max-width: 100%; height: auto;}
.bloc-grid-info .item .sous_titre       { padding: 30px 30px 0 30px; font: 400 22px / 24px "Outfit";}
.bloc-grid-info .item p                 { padding: 10px 30px 30px 30px;}


.bloc-info                  { width: 90vw; max-width: var(--maxWidthWrapperSmall); margin: var(--marginTB); display: block;  background: var(--mainColor1); color: #ffffff; font: 400 22px / 30px "Outfit"; padding: 60px; text-align: center; border-radius: var(--imgRadius);}
.bloc-info :last-child      { margin-bottom: 0;}
.bloc-info p a              { color: #ffffff;}
.bloc-info p a:hover        { border-bottom-color: #ffffff;}

.bloc-texte                 { width: 90vw; max-width: var(--maxWidthWrapper); margin: var(--marginTB); display: block; } 
.bloc-texte.small           { width: 90vw; max-width: var(--maxWidthWrapperSmall); margin: var(--marginTB); display: block; } 

.bloc-texte ul.ul_check    { margin: 40px 0;}

.bloc-grid:before           { position: absolute; left: -100%; right: 60%; top: 10%; bottom: -10%; background: var(--bgColorLight); border-radius: 0 0 10px 0; visibility: visible; content: ""; z-index: -1; }
.bloc-grid.reverse:before   { right: -100%; left: 60%; border-radius: 0 0 0 10px;}


@media (max-width:1366px) {
.bloc-grid { align-items: start;}
}

@media (max-width:1200px) {
.bloc-grid                              { grid-gap: 40px 40px;}
.bloc-grid.full .texte,
.bloc-grid.reverse .texte               { padding-right: 0; padding-left: 0;}
.bloc-info                              { font: 400 18px / 26px "Outfit";}
}
@media (max-width:1000px) {
.bloc-grid                              { grid-template-columns:1fr; }   
.bloc-grid.reverse .texte               { order: 2;}
.bloc-grid.reverse .photo               { order: 1;} 
.bloc-grid.first .texte                 { order: 1;}
.bloc-grid.first .photo                 { order: 2;} 
.bloc-grid.full .photo img              { height: 50vw; object-fit: cover;}
}
@media (max-width:1000px) {
.bloc-grid-info                         { grid-template-columns: 1fr;}
.bloc-grid:before                       { content: none;}
.bloc-grid-info .item img               { height: 50vw; object-fit: cover;}
}
@media (max-width:800px) {
.bloc-info                              { padding: 40px;}
}

/***** blog  *****/
.blog                         { width: 90vw; max-width: var(--maxWidthWrapperLarge); margin: var(--marginTB); display: grid; grid-template-columns: repeat(3, 1fr); }
.blog .item                   { overflow: hidden; background: var(--bgColorLight); border-radius: var(--imgRadius);}
.blog .item .photo            { overflow: hidden; line-height: 0;}
.blog .item .photo img        { max-width: 100%; height: auto; object-fit: cover;  transition: all 300ms ease-in-out;}
.blog .item .photo .date      { position: absolute; top: 30px; left: 30px; background:  var(--bgColorLight); font-size: 12px; font-weight: 600; border-radius: 5px; padding: 15px; line-height:12px;}
.blog .item .sous_titre       { padding: 30px 30px 30px 30px; font: 400 18px / 24px "Outfit"; margin: 0;}


.bloc-texte.dynamique img     { border-radius: var(--imgRadius); margin: 60px auto; max-width: 100%; height: auto; display: block; }
.bloc-texte.dynamique h2, 		 
.bloc-texte.dynamique h3,			 
.bloc-texte.dynamique h4,
.bloc-texte.dynamique h5,
.bloc-texte.dynamique h6      { font: 400 clamp(22px, 3vw, 35px)/130% "Outfit"; letter-spacing: 0; position: relative;  display: block; margin-bottom: 40px;}

.bloc-texte.dynamique p       { margin-bottom: 40px;}

.bloc-texte.dynamique ul                       { margin-bottom: 40px; list-style-type: none;}
.bloc-texte.dynamique ul li                    { position: relative; padding-left: 35px; line-height: 25px; margin-bottom: 12px;}
.bloc-texte.dynamique ul li:before             { width: 23px; height: 23px; position: absolute; left: 0; top: 5px; background: url(../images/check.svg) 0 0 / contain no-repeat; content: "";}

@media (min-width:1201px) {
.blog .item:hover .photo img  { transform: scale(1.1);}   
}

@media (max-width:1200px) {
.blog                         { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width:800px) {
.blog                         { grid-template-columns: 1fr; }
.blog .item .photo img        { height: 50vw;} 
}

/***** hide  *****/
.hide                               { display: none; border-radius: var(--imgRadius); width: 90vw; max-width: var(--maxWidthWrapperSmall); margin: var(--marginTB); padding: 60px;}
.read_more 			   	            { cursor: pointer; color: var(--mainColor2);}
.read_more.link                     { color: #ffffff;}
.read_less                          { cursor: pointer; color: var(--mainColor2);}
.hide_readMore .anchor              { top: -120px; position: relative;}
.hide_readMore                      { margin-top: 25px; position: relative; background: var(--bgColorLight); padding: 50px; border-radius: var(--imgRadius);}
.hide_readMore a                    { color: var(--mainColor1);}
.hide_readMore :last-child          { margin-bottom: 0;}


.read_less.close            { position: absolute; top: -20px; right: -20px; width: 50px; height: 50px; background: #790008; cursor: pointer; z-index: 50; border-radius: 50%; opacity: 0;}
.read_less.close:before		{ width: 24px; height: 2px; background: #ffffff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(45deg); content: "";}
.read_less.close:after		{ width: 2px; height: 24px; background: #ffffff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(45deg); content: "";}

.fadeIn {
   opacity: 1;
   transition: opacity 2s ease-in-out;
   -moz-transition: opacity 2s ease-in-out;
   -webkit-transition: opacity 2s ease-in-out;
   }

@media (min-width:1201px) {
.read_more:hover                    { color: var(--mainColor1);}
.read_less:hover                    { color: var(--mainColor1);}
.read_more.link:hover               { color: #ffffff;}
}