/***** class *****/
.anchor         { top: -120px; position: relative;}

/***** top_page *****/
.top_page                           { position: relative; padding: 50px 0 80px;  margin: 150px auto 0;}
.top_page_blue                      { background: #2a686a;}
.top_page.with-image                { padding: 50px 0 210px;}
.with-image .content                { width: calc(100% - 460px); max-width: 720px; }
.top_page .wrapper                  { width: 100%; position: initial;}
.top_page .titre_main               { font-size: 35px; line-height: 45px; color: #fff; margin-bottom: 15px; }
.top_page .chapo                    { font-size: 15px; color: #fff;}
.top_page .content_image            { position: absolute; right: 0; bottom: 0; height: 100%; width: 410px; z-index: 10}
.top_page .content_image:after      { content: ""; background-color: #fff; position: absolute; width: 10000px; height: 110px; bottom: 0; left: -5000px; }
.top_page .content_image::before    { content: ""; background-color: #30787a; position: absolute; width: 380px; height: 380px; bottom: 30px; border-radius: 50%; right: 0; z-index: -2;}
.top_page .image                    { position: absolute; height: 100%; width: 100%; bottom: 0; left: 0; display: grid; align-items: end;}
.top_page .image::after             { content: url(../images/pattern.svg); position: absolute; bottom: 45px; left: -40px; z-index: 1;}
.top_page .content_image img        { position: relative; max-width: 100%; margin: 0 auto; display: block; z-index: 2;}
.sous_titre                         { font: 700 25px/35px "playfair display"; color: #de807c; margin-bottom: 20px;}
@media (max-width:1200px) { 
.top_page                           { margin-top: 100px;}
}
@media (max-width:1000px) { 
.top_page                           { margin-top: 100px; padding: 40px 0 50px;}
.top_page.with-image                { margin-top: 100px; padding: 40px 0 50px;}
.top_page .titre_main               { font-size: 25px; line-height: 35px}

.top_page .content_image            { display: none;}
.top_page .content                  { width: 100%; max-width: 100%;}
}
@media (max-width:600px) { 
.top_page                           { padding:30px 0;}
.top_page.with-image                { padding: 30px 0;}
.top_page .chapo                    { font-size: 14px; line-height: 28px;}
.sous_titre                         { font-size: 20px; line-height: 30px;}
}

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

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

/***** page content *****/
.page_content 					    { position: relative;}
.page_content p:not(:last-of-type)  { margin-bottom: 15px;}
.page_content .ul_list a, 
.page_content p a				    { border-bottom: 1px solid transparent; color: #de807c;}
.page_content .ul_list			    { margin-bottom: 15px; padding: 5px 0 0 0;}
.page_content .ul_list li			{ padding: 2px 0 2px 35px; position: relative; background: url(../images/list.svg) no-repeat left top 6px; padding-left: 30px;}
@media (min-width:1201px) {
.page_content .ul_list a:hover,
.page_content p a:hover			    { border-color: #de807c;}
}
@media (max-width:1000px) {
.page_content 					    { padding-bottom: 0;}
}
@media (max-width:600px) {
.page_content p						{ margin-bottom: 10px;}
.page_content .ul_list				{ margin-bottom: 10px;}
}


/***** bloc texte *****/
.bloc_texte							{ margin: 80px auto; position: relative;}
.bloc_texte :last-child				{ margin-bottom: 0;}
.bloc_texte.info                    { padding: 30px; border-radius: 10px; background: #f6ecd5;}

@media (max-width:1200px) { 
.bloc_texte							{ margin: 60px auto;}
}
@media (max-width:1000px) { 
.bloc_texte							{ margin: 50px auto;}
}
@media (max-width:600px) { 
.bloc_texte							{ margin: 30px 0;}
}


/***** atouts *****/
.atouts                             { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px; margin-bottom: 90px;}
.atouts .item                       { padding: 40px; background-color:#f6ecd5; border-radius: 10px;}
.atouts .icone                      { width: 100px; height: 100px; display: grid; align-items: center; justify-content: center; background-color:#fff ; border-radius: 50%; margin-bottom: 15px;}
.atouts .sous_titre                 { font-size: 20px; line-height: 35px; margin-bottom: 10px; color: #000000;}

.besoin                             { display: grid; grid-template-columns: 300px 1fr; gap: 0 80px; margin: 90px 0;}
.besoin .photo                      { position: relative; display: grid; align-items: end;}
.besoin .photo::after               { content: ""; position: absolute; background-color: #2a686a; width: 100%; height: 320px; border-radius: 150px 150px 30px 30px; bottom: 0; left: 0; z-index: -1;}
.group_link                         { margin-top: 20px;}
.group_link .link                   { min-width: 175px; margin-right: 5px;}
.besoin .texte                      { margin-top: 60px;}

@media (max-width:1200px) {
.atouts                             { gap: 20px;}
.atouts .item                       { padding: 30px;}
.besoin                             { gap: 40px;}
}
@media (max-width:1000px) {
.atouts                             { grid-template-columns: 1fr 1fr; gap: 10px; margin: 40px 0;}
.atouts .item                       { padding: 30px;}
.atouts .item:first-child           { grid-area: 1/3/2/1;}
.besoin .photo                      { display: none;}
.besoin                             { grid-template-columns: 1fr; margin: 40px 0;}
.besoin .texte                      { margin: 0;}
}
@media (max-width:600px) {
.atouts                             { grid-template-columns: 1fr; gap: 10px;}
.atouts .item                       { padding: 20px;}
.atouts .item:first-child           { grid-area:auto;}
.atouts .icone                      { width: 70px; height: 70px; margin-bottom: 5px;}
.atouts .icone img                  { transform: scale(0.8);}
.group_link .link                   {display: block; width: 100%; margin: 0 0 5px;}
.group_link .link:last-of-type      { margin: 0;}
}