.frame-layout-400 .etudesDeCasSwiper{
  overflow: visible;
}

.xlib-module-mask_etudes_de_cas{
  position: relative;
}

.etudeDeCas {
  max-width: 375px;
  background: #FFFFFF;
  padding: 15px;
  border-radius: 20px;
  box-shadow: var(--shadow);
  height: auto;
  position: relative;
}

.etudeDeCasCover{
  height: 45%;
}

.etudeDeCas img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 10px;
}

.etudeDeCas .etudeDeCasInfos{
  padding: var(--space-elements);
  height: 55%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.etudeDeCas .etudeDeCasInfos .tag{
  font-size: 70%;
  background: #fafafa;
  padding: 5px 15px;
  display: inline-block;
  border-radius: 320px;
  margin-top: -70px;
  position: absolute;
  font-weight: 600;
}

.etudeDeCas .etudeDeCasInfos h3{
  color: #000000;
}

.etudeDeCas-chiffres{
  display: flex;
  padding-bottom: var(--space-elements);
}

.etudeDeCas-chiffres dl{
  flex: 1;
}

.etudeDeCas-chiffres .chiffre dt{
  font-size: 10px;
  text-transform: uppercase;
  display: block;
}

.etudeDeCas-chiffres .chiffre dd{
  display: flex;
  margin-top: 5px;
  font-size: 25px;
  font-weight: bold;
  align-items: center;
}

.etudeDeCas-chiffres .chiffre dd::before {
	content: '';
	width: 24px;
	height: 24px;
	background-color: currentColor;
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
	transition: all .2s ease;
  display: block;
  margin-right: 10px;
}

.etudeDeCas-chiffres .chiffre-economie-annuelle{
  color: var(--vert);
}

.etudeDeCas-chiffres .chiffre-economie-annuelle dd::before {
	-webkit-mask-image: url('../Icons/save.svg');
	mask-image: url('../Icons/save.svg');
}

.etudeDeCas-chiffres .chiffre-roi{
  color: var(--violet);
}

.etudeDeCas-chiffres .chiffre-roi dd::before {
	-webkit-mask-image: url('../Icons/invest.svg');
	mask-image: url('../Icons/invest.svg');
}

.etudeDeCas .etudeDeCasInfos:after {
	content: '';
	width: 24px;
	height: 24px;
	background-color: currentColor;
	-webkit-mask-image: url('../Icons/fleche.svg');
	mask-image: url('../Icons/fleche.svg');
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
	transition: all .2s ease;
  display: block;
  position: absolute;
  bottom: 10px;
  right: 10px;

}

.etudesDeCasSwiper-navigation{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
}

@media only screen and (min-width: 600px) {
  .etudesDeCasSwiper-navigation{
    position: absolute;
    justify-content: flex-end;
    top: 0;
    right: 0;
    transform: translateY(-150%);
    gap: 5px;
    margin-top: 0;
  }
}

.etudesDeCasSwiper-next svg{
  transform: rotate(180deg);
}

.etudesDeCasSwiper-navigation svg{
  width: 48px;
  height: 48px;
  display: block;
  cursor: pointer;
  stroke: transparent !important;
}

.etudesDeCasSwiper-navigation svg:hover{
  opacity: .8;
}

.etudesDeCasSwiper-navigation svg path{
  fill: #FFFFFF;
  stroke: transparent !important;
}

.etudesDeCasSwiper-navigation svg .svg-button-background{
  fill: #333333;
  stroke: transparent;
}

.etudeDeCas-grille{
  display: flex;
  gap: var(--padding);
  flex-wrap: wrap;
}