/*
    *ver_2.0.0
    - solution_client 단독 사용 css 분리
*/

:root {
    --fullwidth-layout-padding: 200px;
}

/*fonts*/
.agro_L {
    font-family: SBAggro !important;
    font-weight: 300 !important;
}

.agro_M {
    font-family: SBAggro !important;
    font-weight: 500 !important;
}

.agro_b {
    font-family: SBAggro !important;
    font-weight: 700 !important;
}

.logo-contents-layout:not(.main, .rolling-banner-conatainer) {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding-left: var(--s-20);
    padding-right: var(--s-20);
    padding-top: var(--s-20);
    padding-bottom: var(--s-20);
    gap: 0.5rem;
    font-size: 16px;
}

.logo-contents-layout figure {
    margin: 0;
    /* margin-left: 0.45rem;
	        margin-right: 0.45rem;
	        margin-bottom: 0.5rem;*/
    padding-bottom: 2.75em;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    position: relative;
    box-shadow: 0px 0px var(--s-20) rgba(0, 0, 0, 0.03);
    border-radius: var(--s-20);
    width: 100%;
}

.logo-contents-layout figure img {
    width: 100%;
    height: 108px;
    padding-left: 1em;
    padding-right: 1em;
    object-fit: contain;
    /* background-color: #000000; */
    border: 0.75rem solid transparent;
}

.logo-contents-layout figure figcaption {
    width: 100%;
    height: 2.5em;
    /* font-size: 1.25em; */
    font-size: clamp(0.75em, 4.4vw, 1em);
    font-weight: 500;
    text-align: center;
    align-content: center;
    padding-left: 1em;
    padding-right: 1em;
    position: absolute;
    bottom: 0.25em;
    left: 0;
}

.logo-contents-layout figure[data-background-type="black"] img {
    background-color: #000000;
    border: 12px solid #ffffff;
    border-radius: 16px;
}

.logo-contents-layout figure[data-logo-type="text"] img {
    width: 100%;
    height: auto;
    opacity: 0;
}

.logo-contents-layout figure[data-logo-type="text"] figcaption {
    font-size: clamp(0.75rem, 4.4vw, 1.25rem);
    font-weight: 700;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-left: 0.5em;
    padding-right: 0.5em;
    /* word-break: keep-all; */
}

@media screen and (max-width: 768px) {
    .logo-contents-layout:not(.main, .rolling-banner-conatainer) {
        grid-template-columns: repeat(auto-fill, minmax(31.5%, auto));
        padding-left: 12px;
        padding-right: 12px;
    }

    .logo-contents-layout figure {
        margin: 0;
        padding-bottom: 1.75em;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

        .logo-contents-layout figure img {
            height: 84px;
            padding-left: 0.5em;
            padding-right: 0.5em;
            border: 0.5rem solid transparent;
        }

        .logo-contents-layout figure figcaption {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 1.75em;
            font-size: 1em;
            padding-left: 0.25em;
            padding-right: 0.25em;
            bottom: 0;
        }
}
@media screen and (max-width: 540px) {
    .logo-contents-layout figure {
        margin: 0;
        padding-bottom: 1.75em;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

        .logo-contents-layout figure img {
            height: 72px;
            padding-left: 0.25em;
            padding-right: 0.25em;
            border: 0.25rem solid transparent;
        }

        .logo-contents-layout figure figcaption {
            height: 2.5em;
            font-size: 0.875em;
            padding-left: 0.25em;
            padding-right: 0.25em;
            bottom: 0;
        }
}