.flex-layout.map_content {
    --background-color: var(--cbw-white-100);
    background-color: var(--background-color);
    margin-block: 0;
    padding-block: var(--global-row-spacing, 0px);
    /* padding-block: max(3rem, calc(3 * var(--su))); */
}

.flex-layout.map_content .map-col {
    aspect-ratio: 1;
    background-color: var(--cbw-sky);
}

.flex-layout.map_content .map-col img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.flex-layout.map_content .logo-swiper-grid {
    position: relative;
    margin-top: max(2.5rem, calc(5 * var(--su)));
}

.flex-layout.map_content .logo-swiper-grid::before {
    content: '';
    background: linear-gradient(90deg, #FFF 0%, var(--background-color) 17.31%, rgba(255, 255, 255, 0.00) 100%);
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 30%;
    z-index: 2;
    transform: translate(-50%, 0%);
    transition: background-color 0.3s ease;
}

.flex-layout.map_content .logo-swiper-grid::after {
    content: '';
    background: linear-gradient(90deg, #FFF 0%, var(--background-color) 17.31%, rgba(255, 255, 255, 0.00) 100%);
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 30%;
    z-index: 2;
    transform: translate(50%, 0%) rotate(180deg);
    transition: background-color 0.3s ease;
}

.flex-layout.map_content .logo-swiper-grid .logo-item {
	display: flex; align-items: center;
}

.flex-layout.map_content .logo-swiper-grid .swiper-wrapper {
	-webkit-transition-timing-function: linear !important;
	-o-transition-timing-function: linear !important;
	transition-timing-function: linear !important;
}

.flex-layout.map_content .logo-swiper-grid .swiper-slide {
    max-width: max(2.5rem, calc(4.5 * var(--su)));
}

.flex-layout.map_content .logo-swiper-grid .swiper-slide img {
	display: block;
	width: auto; object-fit: contain;
    aspect-ratio: 1;
    height: 100%;
    width: 100%;
	transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
}

.flex-layout.map_content .logo-swiper-grid .swiper-slide:hover img {
	/* filter: grayscale(1) brightness(0) invert(1); */
}

@media screen and (max-width: 992px) {

}

@media screen and (max-width: 767px) {

}
