.ce-abbinder {

    flex-wrap: wrap;

    @media screen and (min-width: 768px) {
        display: flex;
        gap: 1rem;
        flex-wrap: nowrap;
    }

    .ce-abbinder_item {
        position: relative;

        img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
        }

        .textbox {
            background-color: white;
            padding: 5% 5% 0 5%;
            bottom: 0;
            position: relative;
            display: flex;
            flex-direction: column;
            gap: 0.5rem;

            @media screen and (min-width: 768px) {
                min-width: 50%;
                position: absolute;
            }

            @media screen and (min-width: 1200px) {
                min-width: 30%;
            }

            @media screen and (min-width: 1400px) {
                min-width: unset;
            }

            &.left {
                left: 0;
                border-top-right-radius: 1rem;
            }

            &.right {
                right: 0;
                border-top-left-radius: 1rem;
            }

            p {
                font-size: 1.2rem;
                line-height: 1.3;
            }

            .btn {
                width: fit-content;
            }
        }
    }

    &.one {
        .textbox {
            max-width: calc(((100% - 900px) / 2) + 45px);
            min-width: 70%;

            @media screen and (min-width: 768px) {
                min-width: 50%;
            }

            @media screen and (min-width: 1200px) {
                min-width: 30%;
            }

            @media screen and (min-width: 1400px) {
                min-width: unset;
            }
        }
    }

    &.more {

        &[data-itemcount="2"] {

            .ce-abbinder_item {
                flex: 1 1 100%;

                @media screen and (min-width: 768px) {
                    flex: 1 1 48%;
                }
            }
        }

        &[data-itemcount="3"] {
            .ce-abbinder_item {
                flex: 1 1 100%;

                @media screen and (min-width: 768px) {
                    flex: 1 1 31%;
                }
            }
        }

        .textbox {}
    }
}