.RelationList {
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 22em) {
    .RelationList {
        column-count: 2;
        gap: 2rem;
    }
}

@media (min-width: 44em) {
    .RelationList {
        column-count: 3;
    }
}

@media (min-width: 66em) {
    .RelationList {
        column-count: 4;
    }
}

@media (min-width: 88em) {
    .RelationList {
        column-count: 5;
    }
}

@media (min-width: 98em) {
    .RelationList {
        column-count: 6;
    }
}

.RelationList__item {
    break-inside: avoid-column;
    margin-bottom: 1rem;
}

.RelationList__heading,
.RelationList__link::before {
    color: var(--clr1-normal);
}

.RelationList__heading {
    margin-bottom: .5rem;
    font-size: var(--txtSize-3);
}

.RelationList__link {
    position: relative;
    display: block;
    padding: .2em 0 .2em 1.4em;
    font-size: var(--txtSize-6);
    line-height: var(--lnHeight-sm);
    text-decoration: none;
    color: inherit;
}

.RelationList__link[href^="http"]::before {
    content: '\3e';
    position: absolute;
    transform: translateX(-1.4em);
    transition: transform var(--transition-time) ease-in-out;
}

.RelationList__link[href^="http"]:hover:before {
    transform: translateX(-1em);
}

/**
 * PublicRelationListFilter
 * Search form
 */

.PublicRelationListFilter label[for='search'] {
    position: absolute;
    left: -999em;
}

.PublicRelationListFilter form {
    display: flex;
    margin-bottom: 1em
}

.PublicRelationListFilter div.field.first {
    flex: 1;
    position: relative;
}

@media (min-width: 460px) {
    .PublicRelationListFilter div.field.first input,
    .PublicRelationListFilter button.submit {
        margin: 0 !important;
        padding-inline: 4rem;
        font-size: var(--txtSize-5);
    }

    .PublicRelationListFilter div.field.first::before {
        content: '\4c';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 1em;
        height: 1em;
        margin: auto;
        font-family: var(--fam-icon);
        font-size: 1.3em;
        line-height: 1em;
        color: var(--clr1-normal);
    }
}

.PublicRelationListFilter div.field.first input {
    width: calc(100% - 1rem);
}

.PublicRelationListFilter button.submit::after {
    content: '\00a0\3e';
    font-family: var(--fam-icon);
    font-style: normal;
    font-weight: normal;
    transition: transform var(--transition-time) ease-in-out;
}