/***** banner *****/
.banner            						{ padding-top: 120px; position: relative; margin-bottom: 80px;}
.banner:before 							{ width: 1600px; height: 1600px; border-radius: 50%; background: #fff; position: absolute; left: 60%; bottom: 30%; content: "";}
.banner .bloc_grid           			{ margin: 0;}
.banner .bloc_grid .texte      			{ padding: 0;}
.banner .bloc_grid .texte ul.ul_list    { margin-bottom: 15px;}
.banner .bloc_grid .texte ul.ul_list li { padding: 0 0 0 40px; background: url("../images/check_blue.svg") 0 5px no-repeat; position: relative; margin-top: 10px;}

.banner .tel   							{ margin-top: 25px;}
.banner .tel a 							{ display: grid; grid-template-columns: 185px auto; align-items: center; border-radius: 5px; overflow: hidden; background: #fff; max-width: 465px;}
.banner .tel a .link 					{ height: 80px; line-height: 80px; background-image: linear-gradient(to top, #8bd5bf 0% 50%, #5a7192 50% 100%); border-radius: 0; padding: 0 0 0 60px; position: relative;}
.banner .tel a .link:after				{ width: 14px; height: 100%; background: url("../images/tel.svg") 50% no-repeat; position: absolute; left: 30px; top: 0; content: "";}
.banner .tel a i 						{ font-size: 16px; line-height: 22px; color: #5a7192; font-style: normal;display: block; padding: 0 30px; min-width: 280px;}

@media (min-width:1201px) {
.banner .tel a:hover .link 				{ background-position: 0 0;}
}
@media (max-width:1200px) {
.banner            						{ padding-top: 110px;}
.banner .bloc_grid .texte>ul,
.banner .bloc_grid .texte>p             { display: none;}
}

@media (max-width:1000px) {
    .banner:before                      { width: 120vw; height: 120vw; bottom: inherit; top: -50vw; left: 50%; transform: translate(-50%, 0);}
}

@media (max-width:600px) {
.banner           						{ padding-top: 100px; text-align: center; margin-bottom: 40px;}
.banner .chapo, 							 
.banner ul 								{ display: none;}
.banner .tel   							{ margin-top: 15px;}
.banner .tel a 							{ display: block; border-radius: 0; background: none;}
.banner .tel a .link 					{ width: 180px; height: 60px; line-height: 60px; display: block; margin: 0 auto 20px auto; text-align: left; border-radius: 5px;}
.banner .tel a .link:after				{ left: 28px;}
.banner .tel a i 						{ font-size: 15px; line-height: 20px;}
}


/***** horaires *****/
.horaires							{ position: relative; z-index: 10; display: block; width: 320px; background: #ffffff; border-radius: 10px; vertical-align: top; margin-top: 30px;}
.horaires>p						    { padding: 20px 50px 20px 30px; cursor: pointer; position: relative; font-size: 1.4rem; line-height: 30px;}
.horaires>p:after				    { width: 70px; height: 50px; border-radius: 50%; position: absolute; right: 0; top: 10px; background: url(../images/scrollbottom.svg) 50% 52% no-repeat; content:"";}
.horaires>p.active:after			{ transform: rotate(-180deg)}
.horaires b							{ font-size: 18px; font-weight: 400; letter-spacing: 0.4px; display:block; padding-bottom: 2px;}
.horaires ul						{ width: 100%; background: #57524c; text-align: left; line-height: 30px; padding: 20px; font-size: 1.3rem; position: absolute; left: 0; top: 90%; color: #ffffff; display: none; z-index: 10; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
.horaires li						{ display: grid; grid-template-columns: 80px 1fr; align-items: center; padding-left: 20px;}
.horaires li span                   { text-align: right; padding-right: 30px;}

@media (max-width:1000px) {
    .horaires                       { width: 100%;}
    .horaires>p						{ padding: 15px 40px 15px 15px; }
}

@media (max-width:600px) {
    .horaires                       { text-align: left;}
}

/***** services *****/
.services  								{ margin: 0; padding-top: 80px; position: relative;/* z-index: 10;*/}
.services .slider 						{ width: 100vw; position: relative; max-height: 550px;}
.services .slick-list 					{ overflow: visible;}
.services .item 						{ width: 380px; background: #fff; border-radius: 20px; padding: 50px 50px 120px 50px; margin-right: 30px; position: relative; box-shadow: 0px 10px 20px 0px rgba(236, 232, 228, 1); transition: transform 300ms ease-in-out;}

.services .item img 					{ width: auto; height: 102px;}
.services .item.contact                 { display: none;}
.services .titre_main 					{ font-size: 2.5rem; line-height: 30px; margin: 20px 0 20px 0;}
.services .link_arrow 					{ position: absolute; left: 50px; right: 50px; bottom: 50px;}
.services .nav_slider 					{ position: absolute; right: -15px; top: 0; z-index: 10;}

@media (min-width:1201px) {
.services .item:hover   				{ transform: translateY(-15px);}
}
@media (max-width:1200px) {
.services .item 						{ width: 360px; background: #fff; border-radius: 15px; padding: 40px 40px 110px 40px; margin-right: 20px; box-shadow: none;}
.services .link_arrow 					{ left: 40px; right: 40px; bottom: 40px;}
}
@media (max-width:1000px) {
.services  								{ margin: 20px 0 0 0;}
}
@media (max-width:600px) {
.services  								{ margin: 40px 0 0 0; padding: 0;}
.services .slider 						{ width: 100%; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 4vw; max-height: none;}
.services .item 						{ width: 100%; border-radius: 8px; margin: 0; padding: 20px; text-align: center;}
.services .item.contact                 { display: flex; background: #306187; align-items: center; justify-content: center;}
.services .item.contact a               { color: #ffffff; position: relative; font-size: 15px; margin-top: 20px;}
.services .item.contact a:before        { content: ''; position: absolute;  left: 50%;  top: -20px;  transform: translate(-50%, 0); width: 15px; height: 14px; background-image: url("data:image/svg+xml;utf8,<svg  xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='15px' height='14px'><path fill-rule='evenodd'  fill='rgb(255,255,255)' d='M3.352,5.835 C4.433,7.970 6.182,9.694 8.291,10.774 L9.937,9.128 C10.143,8.922 10.452,8.871 10.709,8.947 C11.558,9.230 12.458,9.385 13.384,9.385 C13.796,9.385 14.130,9.719 14.130,10.132 L14.130,12.755 C14.130,13.167 13.796,13.501 13.384,13.501 C6.336,13.501 0.625,7.791 0.625,0.742 C0.625,0.331 0.960,-0.004 1.371,-0.004 L3.995,-0.004 C4.407,-0.004 4.741,0.331 4.741,0.742 C4.741,1.668 4.896,2.569 5.178,3.418 C5.256,3.674 5.204,3.983 4.999,4.189 L3.352,5.835 Z'/></svg>");}
.services .item img 					{ width: auto; height: 60px;}
.services .item p 						{ display: none;}
.services .titre_main 					{ font-size: 15px; line-height: 22px; margin: 5px 0 0 0;}
.services .link_arrow 					{ left: 0; right: 0; bottom: 0; top: 0; height: auto; z-index: 20;}
.services .link_arrow:before,
.services .link_arrow:after 			{ display: none;}
.intro-services .sous_titre             { text-align: center; width: 250px; margin: 0 auto;}
.intro-services p                       { display: none;}
}


/***** rdv *****/
.rdv 									{ text-align: center; max-width: 760px; margin: 120px auto 0 auto; position: relative;}
.rdv .tag								{ margin-bottom: 25px;}
.rdv:before                             { width: 1200px; height: 1200px; border-radius: 50%; background: #fff; position: absolute; right: 110%; top: 50%; transform: translateY(-50%); content: ""; z-index: -1;}

@media (min-width:1201px) {
.rdv a:hover   				            { color:#57524c;}
}
@media (max-width:1200px) {
.rdv 									{ margin: 100px auto 0 auto;}
.rdv:before 							{ display: none;}
}
@media (max-width:1000px) {
.rdv 									{ margin: 80px auto 0 auto;}
}
@media (max-width:600px) {
.rdv 									{ display: none;}
}


/***** bloc map *****/
.bloc_map                          { margin: var(--marginBloc); display: grid; grid-template-columns:repeat(2,1fr); position: relative; grid-gap: 0; border-radius: 20px; height: 480px;}
.bloc_map .map                     { font-size: 0; line-height: 0; }
.bloc_map .map img                 { height: 480px; width: 100%; object-fit: cover; object-position: 50% 50%; border-top-right-radius: 20px; border-bottom-right-radius: 20px;}

.bloc_map .texte                   { padding-left: 80px; padding-top: 80px; padding-right: 80px; background: #ffffff; box-shadow: 0px 10px 20px 0px rgba(236, 232, 228, 1); border-top-left-radius: 20px; border-bottom-left-radius: 20px;}
.bloc_map .texte .sous_titre       { font-size: 3rem; line-height: 2;}
.bloc_map .texte p                 { margin-bottom: 10px;}
.bloc_map .texte p em              { font-size: 12px; font-style: italic;}
.bloc_map .texte a                 { position: relative;}
.bloc_map .texte a.link_arrow      { color: var(--colorBodyLinkHover); margin-top: 30px; }
.bloc_map .texte a.link_arrow:before { left: 110px; top: -5px;}
.bloc_map .texte a.link_arrow:after  { left: 130px; top: -5px;}
.bloc_map .texte a.adresse,
.bloc_map .texte a.tel,
.bloc_map .texte a.mail            { padding-left: 30px; color: #051d40; display: block; margin-bottom: 5px; color: #57524c;}
.bloc_map .texte a.adresse:before  { content: ''; position: absolute;  left: 0;  top: 50%;  transform: translate(0, -50%); width: 15px; height: 18px; background-image: url("data:image/svg+xml;utf8,<svg  xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='15px' height='18px'><path fill-rule='evenodd'  fill='rgb(48, 97, 135)' d='M7.033,0.094 C3.155,0.094 -0.000,3.222 -0.000,7.068 C-0.000,8.073 0.207,9.033 0.616,9.922 C1.941,12.796 4.245,15.277 5.486,16.612 C5.719,16.861 5.911,17.071 6.044,17.220 C6.288,17.508 6.647,17.674 7.033,17.674 C7.410,17.674 7.768,17.510 8.016,17.226 C8.153,17.069 8.346,16.860 8.590,16.599 C9.824,15.269 12.121,12.795 13.447,9.922 C13.857,9.030 14.065,8.070 14.065,7.068 C14.063,3.222 10.908,0.094 7.033,0.094 ZM7.033,10.645 C5.089,10.645 3.515,9.068 3.515,7.124 C3.515,5.180 5.089,3.604 7.033,3.604 C8.976,3.604 10.551,5.180 10.551,7.124 C10.551,9.068 8.976,10.645 7.033,10.645 Z'/></svg>");}
.bloc_map .texte a.tel:before     { content: ''; position: absolute;  left: 0;  top: 50%;  transform: translate(0, -50%); width: 15px; height: 14px; background-image: url("data:image/svg+xml;utf8,<svg  xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='15px' height='14px'><path fill-rule='evenodd'  fill='rgb(48, 97, 135)' d='M3.352,5.835 C4.433,7.970 6.182,9.694 8.291,10.774 L9.937,9.128 C10.143,8.922 10.452,8.871 10.709,8.947 C11.558,9.230 12.458,9.385 13.384,9.385 C13.796,9.385 14.130,9.719 14.130,10.132 L14.130,12.755 C14.130,13.167 13.796,13.501 13.384,13.501 C6.336,13.501 0.625,7.791 0.625,0.742 C0.625,0.331 0.960,-0.004 1.371,-0.004 L3.995,-0.004 C4.407,-0.004 4.741,0.331 4.741,0.742 C4.741,1.668 4.896,2.569 5.178,3.418 C5.256,3.674 5.204,3.983 4.999,4.189 L3.352,5.835 Z'/></svg>");}
.bloc_map .texte a.mail:before    { content: ''; position: absolute;  left: 0;  top: 50%;  transform: translate(0, -50%); width: 16px; height: 12px; background-image: url("data:image/svg+xml;utf8,<svg  xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='16px' height='12px'><path fill-rule='evenodd'  fill='rgb(48, 97, 135)' d='M14.716,12.000 L1.290,12.000 C0.583,12.000 0.010,11.467 0.010,10.811 L0.010,3.298 L6.673,7.259 C7.084,7.479 7.546,7.587 8.007,7.587 C8.469,7.587 8.930,7.479 9.342,7.259 L15.996,3.302 L15.996,10.811 C15.996,11.467 15.423,12.000 14.716,12.000 ZM8.007,6.265 C7.790,6.265 7.572,6.214 7.378,6.110 L0.010,1.775 L0.010,1.179 C0.010,0.522 0.583,-0.010 1.290,-0.010 L14.716,-0.010 C15.423,-0.010 15.996,0.522 15.996,1.179 L15.996,1.780 L8.636,6.110 C8.442,6.214 8.224,6.265 8.007,6.265 Z'/></svg>");}

@media (min-width:1201px) {
    .bloc_map .texte a.link_arrow:hover:after  { left: 140px;}
}

@media (max-width:1200px) {
    .bloc_map                                  { grid-template-columns:55% 45%; }
}

@media (max-width:1000px) {
    .bloc_map                                  { grid-template-columns:1fr; height: auto;}
    .bloc_map .texte			               { grid-area: 2; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; border-top-left-radius: 0; border-top-right-radius: 0; background: #306187; text-align: center; padding: 20px 0; }
    .bloc_map .texte h4,
    .bloc_map .texte p                         { display: none;}
    .bloc_map .texte a.link_arrow              { color: #ffffff; margin-top: 0; height: inherit;}
    .bloc_map .texte a.link_arrow:after,     
    .bloc_map .texte a.link_arrow:before       { content: none;}
    .bloc_map .photo        	               { grid-area: 1; border-radius: 0;}
    .bloc_map .map img                         { border-radius: 0;}
}
@media (max-width:1000px) {
    .bloc_map                                  { grid-template-columns:1fr; height: auto;}
    .bloc_map .texte			               { grid-area: 2; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; border-top-left-radius: 0; border-top-right-radius: 0; background: #306187; text-align: center; padding: 20px 0; }
    .bloc_map .texte h4,
    .bloc_map .texte p                         { display: none;}
    .bloc_map .texte a.link_arrow              { color: #ffffff; margin-top: 0; height: inherit;}
    .bloc_map .texte a.link_arrow:after,     
    .bloc_map .texte a.link_arrow:before       { content: none;}
    .bloc_map .photo        	               { grid-area: 1; border-radius: 0;}
    .bloc_map .map img                         { border-radius: 15px 15px 0 0;}
}
@media (max-width: 600px) {
  .bloc_map .texte { border-radius: 0 0 8px 8px; }
   .bloc_map .map img                         { border-radius: 8px 8px 0 0;}
}

/***** about *****/
.about 									{ margin: 120px auto; align-items: start;}
.about .texte							{ padding-top: 60px;}
.about .texte .tag						{ margin-bottom: 25px;}
.about .texte .link_arrow  				{ margin-top: 25px;}

@media (max-width:1200px) {
.about 									{ margin: 100px auto;}
.zone:before 							{ display: none;}
.about .texte							{ padding-top: 0;}
}
@media (max-width:1000px) {
.about 									{ margin: 80px auto;}
}
@media (max-width:600px) {
.about 									{ margin: 50px auto;}
.about .texte .tag						{ margin-bottom: 20px;}
.about .texte .link_arrow  				{ margin-top: 20px;}
}


/***** liens *****/
.services p a,
.about p a 								{ color: #444444; border-bottom: 1px solid #aaa; padding-bottom: 2px;}
.services p a 							{ border-color: #ccc;}

@media (min-width:1201px) {
.services p a:hover,
.about p a:hover 						{ color: #5a7192; border-bottom: 1px solid #5a7192;}
}


