:root {--item-gutter: 5px;}
.l-wrapper{position: relative;padding: 0;}

/* ============================================================
store
============================================================ */
.storeList{cursor: pointer;}
.storeList-inner{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	z-index: 0;
}

.storeList-inner::before{
	display: block;
	content: '';
	padding-top: 181%;
}

.storeList-inner > a{display: inline-block;width: 100%;}

.storeList-cont > *{
	transition: 0.3s;
}

.storeList{
	width: calc(100% / 2);
	max-width: calc(100% /2);
	flex-basis: calc(100% / 2);
	padding: 0 calc(var(--item-gutter) / 2);
	margin-bottom: var(--item-gutter);
}	

.storeList-img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.45;
	z-index: -1;
	transition: 0.3s;
}

.storeList-cont{
	text-align: center;
	padding: 1em;
}

.store-country{
	display: inline-block;
	padding-bottom: 5px;
	/* font-size: 2rem; */
	font-size: 1.5rem;
}

.storeList .store-country{
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
}

.storeList .store-country{
	transition: 0.3s;
	transform: translate(0,-50%);
}

.store-country span{position: relative;display: inline-block;padding-bottom: 10px;}

.store-country span::after{
	position: absolute;
	content: '';
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: linear-gradient(to left, rgba(208,171,117,0) 0%,rgba(208,171,117,1) 50%,rgba(208,171,117,0) 100%); 
}

.storeList .store-country span::after{
	transform: scaleX(0);
	transition: 0.3s;
	transition-delay: 0.3s;
}

.store-link {
	/* font-size: 0.7rem; */
	font-size: 0.65rem;
	font-family: var(--font-family-tit);
}

.storePopup-info {
	font-size: 0.95rem;
}

.store-info {
	font-size: 1.1rem;
}

.storeList .store-name,
.storeList .store-address,
.storeList .store-link{
	color:#d1a25d;
}

.store-name{
	margin-top: 1em;
}
.store-address{
	margin-top: 1em;
}
.storePopup-info .store-tel{
	margin-top: -0.5em;
}
.storePopup-info .store-mail{
	margin-top: -0.5em;
}
.store-link{
	margin-top: 1em;
	padding: 0.2em 1em 0em;
	border: 1px solid #e9b974;
}

/* .storeList:hover .store-img{opacity: 0.2;}
.storeList:hover .store-country{color:#d1a25d;position: static;transform: translate(0,0);}
.storeList:hover .store-country span::after{transform: scaleX(1);}
.storeList .store-info{
	opacity: 0;
	transform: translateY(30px);
}

.storeList:hover .store-info{
	opacity: 1;
	transform: translateY(0);
}


@media (max-width: 680px){
	.storeList:hover .store-country{
		font-size: 1.3rem;
	}
} */

.storeList-inner{pointer-events:none;}
.store-img,.store-country,.store-country span::after,.store-info{-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
.storeList.active .store-img{opacity: 0.2;}
.storeList.active .store-country{
	color:#d1a25d;
	position: static;
	-webkit-transform: translate(0,0);
	transform: translate(0,0);
}
.storeList.active .store-country span::after{-webkit-transform: scaleX(1);transform: scaleX(1);}
.storeList .store-info{
	display: block;
	opacity: 0;
	-webkit-transform: translateY(40px);
	transform: translateY(40px);
	

}

.storeList.active .store-info{
	opacity: 1;
	/* -webkit-transition: all 0.3s ease;
	transition: all 0.3s ease; */
	-webkit-transform: translateY(0);
	transform: translateY(0);
	/* -webkit-transition-delay: 0.2s;
	transition-delay: 0.2s; */
}

.storeList.active .storeList-inner{pointer-events:auto;}


@media (max-width: 680px){
	/* .storeList .store-country{font-size: 1.3rem;} */
	/* .storeList.active .store-country{
		font-size: 1.3rem;
	} */
}

.storePopup > div{background-color: var(--bg-color);}
.storePopup-cont{position: relative;padding: 60px 30px;text-align: center;}
.storePopup .store-country span{padding-bottom: 0.5em;}
.storePopup .store-name{font-size: 1.4rem;}
.storePopup .store-info{font-size: 1.125rem;}
.btn-back{position: absolute;top: 20px;left: 20px;}
.swiper-controls{
	position: absolute;
	bottom: 20px;
	right: 20px;
	z-index: 2;
}

@media (min-width: 992px){
	.storeList-wrap{margin: 0 calc(var(--item-gutter) / 2 * -1);}
	.storeList-inner{height: 100%;}
	.storeList-inner::before{display: none;}
	.storeList + .storeList{margin-top: 0;}
	.storeList{
		flex: 1;
	    height: calc(100vh - var(--header-h));
	    padding: 0 calc(var(--item-gutter) / 2);
	}

	.store-country{
	  font-size: 2.375rem;
	}

	/* .store-info{
		font-size: 1rem;
	} */

	.storePopup > div{
		min-height: calc(100vh - var(--header-h));
	}

	.storePopup-cont{
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		transform: translateX(100%);
		/*text-align: center;*/
	}

	.storePopup-img{
		display: flex;
		align-items: center;
		justify-content: center;
		transform: translateX(-100%);
	}

	.modal-inner,.modal-cont,.storePopup-img,.swiper,.swiper-slide{height: 100%;width: 100%;}
	.swiper-slide{position: relative;}
	.swiper-slide img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;-webkit-object-fit: cover;object-fit: cover;}

	.modal-cont > div{transition: 1s;}
	.storePopup .store-name{font-size: 1.6rem;}

	.js-modal-active .modal-cont > div{
		transform: translateX(0);
	}
} 

@media (max-width: 991px){

	.swiper-slide{
		position: relative;
		overflow: hidden;
	}

	

	.swiper-slide::before{
		display: block;
		content: '';
		padding-top: 70%;
	}

	.swiper-slide img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;-webkit-object-fit: cover;object-fit: cover;}
}


:lang(en) .storeList .store-name,
:lang(fr) .storeList .store-name {
	line-height: 1.9;
}




@media (max-width: 680px){
	.storePopup .store-name {
		font-size: 1.1rem;
	}
	.storePopup-info {
		font-size: 0.7rem;
	}
	.store-info {
		font-size: 0.9rem;
	}
	.store-link {
		font-size: 0.5rem;
		padding: 0.2em 1em 0em;
	}
	:lang(en) .storeList .store-country,
	:lang(fr) .storeList .store-country{font-size: 1.4rem;}
	:lang(en) .storeList .store-name{font-size: 0.9rem;}
	:lang(fr) .storeList .store-name{font-size: 0.7428rem;}
	/* :lang(en) .storeList .store-link,
	:lang(fr) .storeList .store-link{font-size: 0.7rem;} */
	:lang(en) .storeList .store-link{font-size: 0.6rem;}
	:lang(fr) .storeList .store-link{font-size: 0.5rem;}
}


