.hero_banner {
	position:relative;
	overflow:hidden;
	width:100vw;
	height:30vw;
	display: none;
}

.courbe-haut {
	position: absolute;
	top:0;
	left: -18px;
	z-index: 1;
	height: 30vw;
	width: 25vw;
	overflow: hidden;
	pointer-events: none;
	display: none;
}

.courbe-haut img {
	margin-top:-1vw;
	width:100%;
	height:100%;
}

.hero_banner .fond-hb {
	display:flex;
	width:120vw;
	object-fit:cover;
	height:30vw;
}

.hero_banner .fond1 { object-position:0px -130px; }

.hero_banner .porte-velo { height:30vw; }

.hero_banner .porte-velo__texte {
	position:relative;
	animation:revele-gauche ease-in 0.3s 1s forwards;
	transform:translateX(-53%);
	height:fit-content;
}

.hero_banner .porte-velo__texte img { position:absolute; }

.hero_banner img.pv-courbe {
	filter:opacity(.8) ;
	top:-2.3vw;
	left:0;
	width:190%;
}

.hero_banner .pv-titre {
	top:5.2vw;
	left:20.7vw;
	width:30.5vw;
}

.hero_banner .pv-txt {
	top:12.9vw;
	left:17.6vw;
	width:23.6vw;
}

.hero_banner .made-in-france {
	position:absolute;
	left:50%;
	transform:translateX(-50%);
	bottom:0px;
	width:10.4vw;
	height:27px;
}

.hero_banner .carousel__item {
	position:relative;
	height:30.5vw;
}

.hero_banner .hb__cta {
	position:absolute;
	font-size:14px;
	font-weight:300;
	bottom:2vw;
	right:3.2vw;
	height:38px;
	width:174px;
	color:white;
	border:1px solid white;
	background-color:transparent;
}

.hero_banner .caroussel1 .carousel .carousel__wrapper {
	height:100%;
	overflow:hidden;
	width:100vw;
}

.hero_banner .carousel2 { overflow:hidden; }

.hero_banner .carousel__container {
	transition:transform ease 0.8s;
	width:100%;
}

.hero_banner .carousel__container:after {
	content:'';
	clear:both;
	display:table;
}

.hero_banner .carousel__item {
	float:left;
	height:fit-content;
	width:100%;
}

/* arrows */

.hero_banner .carousel__next,.carousel__prev {
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	cursor:pointer;
	height:50px;
	width:35px;
	transition:all ease-out 0.1s;
	background-repeat:no-repeat;
}

.hero_banner .carousel__next {
	right:50px;
	background-image:url(/assets/images/icones/arrow-right.svg);
}

.hero_banner .carousel__prev {
	left:50px;
	background-image:url(/assets/images/icones/arrow-left.svg);
}

.hero_banner .carousel__next:hover,.carousel__prev:hover {
	transform:translateY(-50%) scale(1.02);
}

.hero_banner .carousel__next:active,.carousel__prev:active {
	filter:brightness(1.2);
}

.hero_banner .arrow.left { left:21px; }
.hero_banner .arrow.left:hover { left:19px; }

.hero_banner .arrow.right { right:21px; }
.hero_banner .arrow.right:hover { right:19px; }

/* indicator */

.hero_banner .carousel1 .indicators {
	position:absolute;
	bottom:20px;
	left:50%;
	transform:translate(-50%);
	list-style:none;
	display:flex;
	padding:0;
	margin:0;
	gap:20px;
}

.hero_banner .carousel1 .indicator {
	width:18px;
	height:18px;
	border-radius:50px;
	background:rgba(255,255,255,0.5);
	cursor:pointer;
}

.hero_banner .carousel1 .indicator.active {
	background:#f5f5e6;
}

@keyframes revele-gauche {
	0% { transform:translateX(-53%); }
	100% { transform:translateX(-15%); }
}

/*			HERO BANNER				*/

@media screen and (max-width:1300px) {
	.hero_banner { margin-top:0; }
}