/***** fonts et reset *****/
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap');

body, ul, li, ol, form, h1, h2, h3, h4, h5, h6, div, span, p { padding:0; margin:0; border:0; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; text-size-adjust: none;}
article, aside, dialog ,figcaption, figure, footer, header, hgroup, main, nav, section { display: block;}  
input, textarea						{ -webkit-appearance: none; -ms-appearance: none; appearance: none; -moz-appearance: none; -o-appearance: none; border-radius: 0;}
*          							{ outline: none;}
strong, b							{ font-weight: 600; font-size: 15px;}
ul									{ list-style-type: none;}
body								{ font: 400 14px/28px "Open Sans"; letter-spacing: 0.4px; color: #000; background: #fff; position: relative;}
body.active_overflow				{ height: 100vh; overflow: hidden;}
a									{ text-decoration: none; color: #000; position: relative;}
img									{ border: none;}
main 								{ position: relative; z-index: 10;}
#wrapper 							{ min-width: 320px; overflow: hidden; position: relative;}
#wrapper:after						{ width: 90vw; max-width: 1800px; height: 600px; background: #156e63; position: absolute; left: 50%; transform: translateX(-50%); top: 0; margin-left: 15%; content: "";}
#wrapper *							{ box-sizing: border-box;}
#footer 							{ position: relative; z-index: 15;}

@media (max-width:1200px) {
#wrapper:after						{ display: none;}
}
@media (max-width:700px) {
body								{ font-size: 13px; line-height: 26px;}
strong, b							{ font-size: 14px;}
}


/***** scollbar *****/
::-webkit-scrollbar 				{ width: 6px; height: 6px; background-color: #fff;}
::-webkit-scrollbar-thumb			{ background-color: #ffb941;}


/***** transition *****/
@media (min-width:1201px) {
.link, .slick-arrow, :before, :after, a, a span, .logo, .header, .sub { transition: all 300ms ease-in-out;}
}


/***** class *****/
.wrapper 							{ width: 90vw; max-width: 1200px; margin: 0 auto; position: relative;}
.wrapper_large						{ max-width: 1600px;}
.clear								{ clear: both; display: block;}
.anchor								{ position: absolute; left: 0; top: -140px;}
.titre_main	 						{ font: 800 50px/58px "Open Sans"; text-transform: uppercase; letter-spacing: 0.8px; color: #156e63; position: relative; margin-bottom: 15px;}
.titre_main span					{ font: 500 20px/30px "Open Sans"; text-transform: none; letter-spacing: 0.6px; color: #000; display: block; padding-top: 5px;}
span.titre					        { font: 500 20px/30px "Open Sans"; text-transform: none; letter-spacing: 0.6px; color: #000; display: block; }

.sous_titre 						{ font: 500 20px/30px "Open Sans"; position: relative; color: #156e63; margin-bottom: 15px;}
.chapo		 						{ font: 400 14px/28px "Open Sans"; margin-bottom: 15px;}
.chapo span	 						{ display: block; margin-top: 15px;}

.link 								{ font: 700 12px/56px "Open Sans"; letter-spacing: 1px; height: 56px; text-transform: uppercase; display: inline-block; color: #fff; padding: 0 30px; border-radius: 5px; background: linear-gradient(to top, #156e63 0% 50%, #11584f 50% 100%); background-size: 100% 200%; background-position: 0 100%; cursor: pointer;}


.link_plus							{ font: 700 12px/50px "Open Sans"; letter-spacing: 1px; height: 50px; text-transform: uppercase; display: inline-block; color: #156e63; padding: 0 0 0 65px;}
.link_plus:after					{ width: 50px; height: 50px; border-radius: 5px; background: url("../images/plus_white.svg") 50% no-repeat #ffb941; position: absolute; left: 0; top: 0; content: "";}


.link.green 						{ background-image: linear-gradient(to top, #239e98 0% 50%, #7bb528 50% 100%);}
.bloc_short 						{ max-width: 800px; margin: 0 auto; position: relative;}
.read_more							{ display: inline-block; color: #ae312e; cursor: pointer; transition: color 300ms ease-in-out;}
.hide 								{ display: none;}

@media (min-width:1201px) {
.link:hover 						{ background-position: 0 0; color: #fff;}
.link_plus:hover:after				{ background-color: #156e63;}

}
@media (max-width:2000px) {
.wrapper_large						{ max-width: 1600px;}
}
@media (max-width:1200px) {
.wrapper 							{ min-width: inherit;}
.titre_main	 						{ font-size: 40px; line-height: 48px;}
.sous_titre 						{ font-size: 20px; line-height: 28px;}
.link 								{ line-height: 55px; height: 55px;}
}
@media (max-width:1000px) {
.wrapper 							{ max-width: 750px;}
.titre_main	 						{ font-size: 30px; line-height: 38px;}
span.titre					        { font-size: 18px; line-height: 28px;}
}
@media (max-width:700px) {
.wrapper 							{ width: 88vw;}
.titre_main	 						{ font-size: 20px; line-height: 26px; font-weight: 700; margin-bottom: 10px;}
span.titre					{ font-size: 15px; line-height: 22px; padding-top: 4px; letter-spacing: 0.4px;}
.sous_titre 						{ font-size: 16px; line-height: 24px; margin-bottom: 10px;}
.chapo		 						{ font-size: 12px; line-height: 24px; margin-bottom: 10px;}
.chapo span	 						{ margin-top: 10px;}
.link 								{ line-height: 50px; height: 50px; padding: 0 20px; background: url("../images/arrow_link.svg") right+20px center no-repeat #156e63;}
.link_plus							{ line-height: 50px; height: 50px; color: #fff; padding: 0 20px; border-radius: 5px; background: url("../images/arrow_link.svg") right+20px center no-repeat #156e63; width: 100%;}
.link_plus:after					{ display: none;}
}



/***** header et menu *****/
.header 							{ width: 100%; font-size: 0; line-height: 0; letter-spacing: 0; position: fixed; left: 0; top: 0; z-index: 100; text-align: right; background: #fff;}
.header:before						{ width: 90vw; max-width: 1800px; height: 100%; background: #156e63; position: absolute; left: 50%; transform: translateX(-50%); top: 0; margin-left: 15%; content: "";}

.header .logo						{ width: 165px; position: absolute; left: 0; top: 20px; z-index: 140; transition: all 300ms ease-in-out;}
.header .logo img					{ width: 100%; height: auto; display: block;}
.header .tel 						{ font-size: 12px; font-weight: 600; line-height: 50px; height: 50px; color: #fff; padding-left: 30px; letter-spacing: 0.6px; background: url("../images/tel.svg") 0 50% no-repeat; position: absolute; right: 0; top: 0;}

.header .header_nav 				{ display: inline-block; position: relative; padding: 60px 0 30px 0; transition: all 300ms ease-in-out;}
.header .menu>li					{ position: relative; display: inline-block; vertical-align: top; margin-left: 40px;}
.header .menu>li:first-child 		{ margin-left: 0;}
.header .menu>li>a					{ font-size: 12px; line-height: 50px; font-weight: 700; height: 50px; letter-spacing: 1.8px; text-transform: uppercase; color: #fff; display: block;}
.header .menu>li.active>a			{ color: #ffb941;}
.header .menu>li .link 				{ height: 50px; line-height: 50px; color: #156e63; letter-spacing: 1.6px; background-image: linear-gradient(to top, #fff 0% 50%, #ffb941 50% 100%);}
.header .menu>li.active .link		{ color: #156e63;}

.header .sub						{ width: 240px; margin-left: -120px; text-align: center; position: absolute; top: 54px; left: 50%; display: block; visibility: hidden; opacity: 0; padding: 20px 0; background: #104946; border-radius: 8px;}
.header .sub li						{ width: 100%; margin: 0;}
.header .sub li a					{ width: 100%; font-size: 15px; letter-spacing: 0.6px; line-height: 38px; height: 40px; font-weight: 400; text-transform: none; color: #fff;}
.header .sub li.active a			{ color: #46b6b1;}

.no_sticky .header 					{ position: absolute;}

@media (max-width:1400px) {
.header .menu>li					{ margin-left: 30px;}
}
@media (min-width:1201px) {
.menu_mobile 						{ display: none;}
.header .menu>li:hover 				{ z-index: 999;}		
.header .menu>li:hover>a 			{ color: #ffb941;}
.header .menu>li:hover .link 		{ color: #fff;}
.header .menu>li .sub a:hover 		{ color: #46b6b1;}
.header .menu>li:hover .sub			{ opacity: 1; visibility: visible; z-index: 999;}
.header .sub:after 					{ width: 10px; height: 10px; position: absolute; left: 50%; top: -4px; margin: 0 0 0 -5px; transform: rotate(45deg); background: #104946; content: "";}
.header .sub:before 				{ width: 100%; height: 10px; position: absolute; left: 0; top: -10px; content: "";}

.sticky:not(.scrolling_top) .header .logo				{ width: 120px; top: 13px;}
.sticky:not(.scrolling_top) .header .header_nav 		{ padding: 25px 0;}
.sticky:not(.scrolling_top) .header .tel 				{ visibility: hidden; opacity: 0;}
}
@media (max-width:1400px) {
.sticky:not(.scrolling_top) .header .devis 				{ padding-top: 8px; line-height: 19px;}
}
@media (max-width:1200px) {
.menu_mobile						{ width: 70px; height: 100px; display: inline-block; vertical-align: middle; cursor: pointer; position: relative; z-index: 250; margin: 0 -20px; transition: height 300ms ease-in-out;}
.menu_mobile div					{ width: 30px; height: 2px; background: #156e63; position: absolute; right: 50%; top: 50%; margin: -1px -15px 0 0;}
.menu_mobile div:before				{ width: 100%; height: 2px; background: #156e63; position: absolute; right: 0; top: 7px; content: "";}
.menu_mobile div:after				{ width: 100%; height: 2px; background: #156e63; position: absolute; right: 0; top: -7px; content: "";}
.menu_mobile.active div				{ height: 0;}
.menu_mobile.active div:before		{ top: 0; transform: rotate(45deg);}
.menu_mobile.active div:after		{ top: 0; transform: rotate(-45deg);}

.header 							{ padding: 0;}
.header:before						{ display: none;}
.header ::-webkit-scrollbar			{ display: none;}
.header .logo						{ width: 120px; top: 15px; z-index: 250;}
.header .tel 						{ display: inline-block; vertical-align: middle; padding: 0 30px 0 60px; border-radius: 5px; background-color: #156e63; background-position: 25px 50%; position: relative; right: auto; top: auto; margin-right: 40px; z-index: 240;}

.header .header_nav 				{ width: 100%; position: fixed; right: -100%; top: 0; bottom: 0; overflow-y: scroll; z-index: 200; background: #11584f; border-top: 100px solid #fff; padding: 60px 0 80px 0; transition: all 300ms ease-in-out 200ms;}
.header .menu  						{ display: block; width: auto; text-align: left; margin: 0 15vw; position: relative; z-index: 100; opacity: 0; transition: all 300ms ease-in-out 0ms;}
.header .menu>li 					{ width: 100%; display: block; margin: 0; border-top: 1px solid #347169;}
.header .menu>li:first-child 		{ border: none;}
.header .menu>li:last-child 		{ border: none;}
.header .menu>li>a					{ font-size: 14px; font-weight: 600; transition: none;}
.header .menu>li .link 				{ text-align: center; font-weight: 700; margin-top: 20px;}
.header .menu>li>i					{ width: 75%; height: 50px; display: block; margin-top: -50px; position: relative; z-index: 25; float: right;}
.header .menu>li>i:after			{ width: 50px; height: 100%; background: url("../images/arrow_down.svg") 50% no-repeat; background-size: 18px auto; float: right; content: "";}
.header .menu>li>i.active:after 	{ transform: rotate(180deg);}

.header .menu li .sub 				{ width: 100%; position: relative; left: auto; top: auto; margin: 5px 0 25px 0; border-radius: 8px; visibility: visible; opacity: 1; display: none; z-index: 150;}
.header .menu li .sub li  			{ width: 100%;}
.header .menu li .sub li a			{ width: 100%; line-height: 40px; height: 40px;}

.header.active .header_nav 			{ right: 0; transition-delay: 150ms;}
.header.active .menu 				{ opacity: 1; transition-delay: 600ms;}
}
@media (max-width:1000px) {
.header .menu  						{  margin: 0 10vw;}
}
@media (max-width:700px) {
.menu_mobile						{ height: 80px;}
.header 							{ padding: 0;}
.header .logo						{ width: 100px; top: 10px;}
.header .tel 						{ width: 50px; font-size: 0; padding: 0; background-position: 50%; margin-right: 6vw;}
.header .header_nav 				{ border-width: 80px; padding: 6vw 0 8vw 0;}
.header .menu  						{ margin: 0 8vw;}
.header .menu>li>a					{ font-size: 12px; height: 44px; line-height: 44px;}
.header .menu>li .link 				{ margin-top: 15px; background: #fff;}

.header .menu>li>i					{ height: 44px; margin-top: -44px;}
.header .menu>li>i:after			{ width: 40px; background-size: 16px auto;}
.header .menu li .sub 				{ border-radius: 5px;}
.header .menu li .sub li a			{ font-size: 13px;}
}


/***** attente *****/
@media (max-width:1200px) {
.attente.header .tel 				{ margin: 25px 0;}
}
@media (max-width:700px) {
.attente.header .tel 				{ margin: 15px 0;}
}



/***** CTA *****/
.cta 								{ position: relative; display: grid; grid-template-columns: 1fr 1fr; background: #ffb941; border-radius: 5px; overflow: hidden; text-align: center;}
.cta .titre							{ color: #fff; background: #156e63; font-size: 18px; line-height: 20px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.6px; padding: 50px; position: relative; z-index: 5;}
.cta .titre:before					{ width: 14px; height: 14px; background: #156e63; transform: rotate(-45deg); position: absolute; right: -7px; top: 50%; margin-top: -7px; content: "";}
.cta .titre span					{ color: #ffb941;}
.cta .row     						{ position: relative; overflow: hidden; padding: 30px;}
.cta .row:before					{ width: 700px; height: 700px; background: url("../images/shape.svg") center / contain no-repeat; position: absolute; right: 0; top: -80%; opacity: 0.2; content: "";}
.cta .row .link   					{ background: #fff; text-align: left; color: #156e63; padding: 0 30px 0 65px;}
.cta .row .tel   					{ display: inline-block; vertical-align: middle;}
.cta .row .tel a 					{ background: url("../images/tel.svg") 30px 50% no-repeat #fff;}
.cta .row .form   					{ display: inline-block; vertical-align: middle; margin-left: 10px;}
.cta .row .form a					{ background: url("../images/email.svg") 30px 50% no-repeat #fff;}

@media (min-width: 1201px){
.cta .row .link:hover 				{ color: #ffb941;}
}
@media (max-width: 1200px){
.cta 								{ grid-template-columns: auto 1fr;}
}
@media (max-width: 1000px){
.cta 								{ grid-template-columns: 1fr;}
.cta .titre							{ padding: 30px;}
.cta .titre:before					{ right: 50%; margin: 0 7px 0 0; top: auto; bottom: -7px;}
}
@media (max-width: 700px){
.cta 								{ border-radius: 0; text-align: left; margin: 0 -6vw; padding: 40px 6vw;}
.cta .titre							{ color: #fff; font-size: 16px; letter-spacing: 1.4px; font-weight: 700; text-transform: uppercase; padding: 0; background: none; margin: -5px 0 15px 0;}
.cta .titre:before					{ display: none;}
.cta .titre span					{ color: #fff;}
.cta .row     						{ padding: 0;}
.cta .row:before					{ display: none;}
.cta .row .link   					{ display: block; text-align: center; padding: 0 20px;}
.cta .row .tel   					{ display: block;}
.cta .row .tel a 					{ background-image: none;}
.cta .row .form   					{ display: block; margin: 10px 0 0 0;}
.cta .row .form a 					{ background-image: none;}
}



/***** ul list *****/
.ul_list									{ margin: 0 0 20px 0;}
.ul_list li									{ padding: 0 0 0 35px; position: relative; margin-top: 10px; background: url("../images/check.svg") 0 1px no-repeat;}
.ul_list li>span							{ display: block; margin-top: 10px;}


@media (min-width:1201px) {
.ul_list li a:hover 						{ color: #156e63; border-color: #156e63;}
}



/***** show hide *****/
.show_hide                        			{ position: relative; margin: 25px 0; border-top: 1px solid #8ab7b1;}
.show_hide .item                    		{ border-bottom: 1px solid #8ab7b1; padding: 18px 0;}
.show_hide .titre                 			{ position: relative; cursor: pointer; padding: 10px 30px 10px 0; font: 500 16px/20px "Open Sans"; letter-spacing: 1px; color: #fff; margin: 0; transition: all 300ms ease-in-out;}
.show_hide .titre:after          			{ width: 20px; height: 100%; background: url("../images/arrow_down.svg") center no-repeat; position: absolute; right: 0; top: 0; transition: none; content: "";}
.show_hide .titre.active:after   			{ transform: rotate(-180deg);}
.show_hide .item:first-child .hide 			{ display: block;}
.show_hide .hide                  			{ margin: 0; padding: 10px 0; color: #fff; display: none;}
.show_hide .hide p 							{ margin-bottom: 10px;}
.show_hide .hide p a						{ color: #222; border-bottom: 1px solid #ccc; padding-bottom: 1px;}
.show_hide .hide li a						{ color: #222; border-bottom: 1px solid #ccc; padding-bottom: 1px;}
.show_hide .hide :last-child 	 			{ margin-bottom: 0;}

@media (min-width: 1201px){
.show_hide .hide p a:hover     				{ color: #239e98; border-color: #239e98;}
}
@media (max-width: 1200px){
.show_hide .titre                 			{ font-size: 15px;}
}
@media (max-width: 700px){
.show_hide                        			{ margin: 15px 0; border: none;}
.show_hide .item                    		{ border: none; padding: 0; margin: 10px 0;}
.show_hide .titre                 			{ padding: 15px 40px 15px 20px; font-size: 13px; line-height: 20px; letter-spacing: 0.6px; background-color: #156e63; border-radius: 5px;}
.show_hide .titre:after          			{ right: 20px; background-size: 18px auto; width: 18px;}
.show_hide .item:first-child .hide 			{ display: none;}
.show_hide .hide                  			{ color: #000; padding: 20px 10px 10px 10px;}
}



/***** show hide - no bg *****/
.show_hide.no_bg                        	{ border-top: 1px solid #ddd;}
.show_hide.no_bg .item                    	{ border-bottom: 1px solid #ddd;}
.show_hide.no_bg .titre                 	{ color: #000;}
.show_hide.no_bg .item:first-child .hide 	{ display: none;}
.show_hide.no_bg .hide                  	{ color: #000;}
.show_hide.no_bg .hide p a					{ color: #000; border-bottom: 1px solid #ccc;}

@media (min-width: 1201px){
.show_hide.no_bg .hide p a:hover     		{ color: #156e63; border-color: #156e63;}
}
@media (max-width: 1200px){
.show_hide.no_bg .titre                 	{ font-size: 15px;}
}
@media (max-width: 700px){
.show_hide.no_bg                        	{ margin: 15px 0; border-top: 1px solid #ddd;}
.show_hide.no_bg .item                    	{ border: none; padding: 0; margin: 0; border-bottom: 1px solid #ccc;}
.show_hide.no_bg .titre                 	{ padding: 15px 40px 15px 0; font-size: 13px; line-height: 20px; letter-spacing: 0.6px; background: none; border-radius: 0;}
.show_hide.no_bg .titre:after          		{ right: 0;}
.show_hide.no_bg .item:first-child .hide 	{ display: none;}
.show_hide.no_bg .hide                  	{ color: #000; padding: 10px 10px 25px 10px;}
}




/***** footer *****/
.footer										{ position: relative; background: #156e63; color: #fff; font-size: 0; padding-top: 100px; z-index: 5;}
.footer .bloc_footer 						{ display: inline-block; vertical-align: top; position: relative;}
.footer .bloc_footer p						{ font-size: 14px; margin-top: 10px;}
.footer .bloc_footer p.titre_main			{ font-size: 24px; line-height: 30px; color: #fff; margin: 0 0 20px 0;}
.footer .bloc_footer p.map					{ background: url("../images/map.svg") 2px 50% no-repeat; padding-left: 35px;}
.footer .bloc_footer a.tel					{ font-size: 14px; background: url("../images/tel.svg") 1px 50% no-repeat; padding-left: 35px; color: #fff;}
.footer .bloc_footer a.email				{ font-size: 14px; background: url("../images/email.svg") 0 50% no-repeat; padding-left: 35px; color: #fff;}

.footer ul.bloc_footer     					{ margin: 0 0 0 100px;}
.footer ul.bloc_footer li   				{ margin-bottom: 5px;}
.footer ul.bloc_footer li:last-child  		{ margin-bottom: 0;}
.footer ul.bloc_footer li b   				{ font-size: 20px; font-weight: 500; letter-spacing: 1.2px; display: block; padding: 5px 0 10px 0;}
.footer ul.bloc_footer li a 				{ color: #fff; font-size: 14px; line-height: 30px; padding: 5px 0 5px 20px; letter-spacing: 0.8px; background: url("../images/list.svg") 0 55% no-repeat;}

.footer	.logos								{ position: absolute; right: 80px; top: 0; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 10px; width: 260px;}
.footer	.logos img							{ width: 100%; height: auto; display: block; border-radius: 5px; padding: 10px; background: #fff;}

.footer	.rs									{ position: absolute; right: 0; top: 0; font-size: 0; line-height: 0; letter-spacing: 0;}
.footer	.rs a								{ width: 50px; height: 50px; border-radius: 5px; display: inline-block; vertical-align: top; margin-right: 10px;}
.footer	.rs .facebook						{ background: url("../images/facebook.svg") 50% no-repeat #11584f;}
.footer	.rs .scroll 						{ background: url("../images/scrolltop.svg") 50% 48% no-repeat #11584f; margin: 0;}

.footer_bottom   							{ padding: 20px 0; line-height: 0; margin-top: 80px;}
.footer_bottom li 							{ display: inline-block; font-size: 12px; line-height: 20px; margin-right: 30px; letter-spacing: 1px; position: relative;}
.footer_bottom li:after						{ width: 1px; height: 9px; content: ""; position: absolute; right: -15px; top: 5px; background: #fff;}
.footer_bottom li:last-child:after 			{ display: none;}
.footer_bottom li a							{ color: #fff;}

.toponweb									{ display: block; z-index: 85; position: absolute; right: 0; bottom: 0; transition: bottom 300ms ease-in-out;}
.toponweb span								{ width: auto; height: 60px; display: block; padding: 20px; background: linear-gradient(to left, #11584f 0% 50%, #156e63 50% 100%); background-size: 200% 100%; background-position: 100% 0;}
.toponweb img								{ width: 76px; height: auto; display: block; margin: 0 auto; transition: all 300ms ease-in-out;}
.toponweb.show								{ bottom: 0;}

@media (min-width:1201px) {
.footer .bloc_footer a:hover,  
.footer_bottom li a:hover 	 				{ color: #ffb941;}
.footer	.rs a:hover  						{ background-color: #fff;}
.toponweb:hover span						{ background-position: 0 0;}
}
@media (max-width:1200px) {
.footer										{ padding-top: 80px;}
.footer ul.bloc_footer     					{ margin-left: 80px;}
.footer ul.bloc_footer li b 				{ font-size: 18px;}
.footer_bottom   							{ margin-top: 60px;}
}
@media (max-width:1000px) {
.footer										{ padding-top: 60px;}
.footer div.bloc_footer     				{ display: block;}
.footer ul.bloc_footer     					{ margin: 40px 60px 0 0;}
}
@media (max-width:700px) {
.footer										{ padding-top: 40px;}
.footer .bloc_footer p						{ font-size: 12px; line-height: 22px;}
.footer ul.bloc_footer     					{ display: none;}
.footer	.logos								{ position: static; width: 220px; margin-top: 30px;}
.footer	.rs a								{ width: 46px; height: 46px; border-radius: 5px;}
.footer_bottom 	 							{ text-align: left; margin-top: 30px; padding: 0 0 20px 0;}
.footer_bottom li 							{ display: block; margin: 0; font-size: 11px; line-height: 26px;}
.footer_bottom li:after						{ display: none;}
}