---
---
@import "support";

$topradii: 10px 10px 0px 0px;

.tag-list1 {
  margin-top: $spacing-unit;
  img {
    width: 100%;
    overflow: hidden;
    background-color: $banner-color;
    border-radius: $topradii;
  }
  div {
    overflow: hidden;
    hyphens: auto;
    overflow-wrap: break-word;
  }
}
.tagbox1 {
    font-size: 140%;
    padding: 10px 10px 1px;
    img {
        height: 125px;
        object-fit: none;
        border-radius: $topradii;
    }
}
.tag-list1 .children1 {
    display: flex;
    padding-bottom: 10px;
    place-content: space-between;
    @include media-query($on-palm) {
        font-size: 95%;
    }
    @include media-query(319px) {
        font-size: 85%;
    }
}
.tag-list2 {
    padding: 5px 3px 0px;
    width: 32.5%;
    img {
        height: 125px;
        object-fit: cover;
    }
    background-color: $grey-color-light;
    border-radius: 10px;
    height: fit-content;
    div {
        border-radius: 10px;
    }
}
.tagbox2 {
    font-size: 120%;
    text-align: center;
}
.tagbox3 {
    font-size: 115%;
    margin: 3px;
}
.tagbox4 {
    font-size: 107%;
}
.tag-list4 {
    font-size: 105%;
    margin: 10px 7px 18px 3px;
}
div.tag-list4:last-child {
    margin-bottom: 5px;
}
.tag-list3 {
    border: 1px solid black;
    margin: 10px 3px 14px 4px;
}
div.tag-list3:last-child {
    margin-bottom: 6px;
}
.children3 {
    margin-left: 7px;
    @include media-query(400px) {
        margin-left: 1px;
    }
}
.tag-list4:has(img) {
    background-color: darken($grey-color-light, 10%);
}
.tag-list4:has(.children4) .tagbox4 {
    padding: 2px 4px $spacing-unit 4px;
}
.tag-list4:not(:has(.children4)) .tagbox4 {
    padding: 2px 4px;
}
.tag-list5:has(.children5) {
    border: 1px solid gray;
}
.tag-list5 {
    margin-bottom: 7px;
}
.children4 {
    margin-left: 12px;
    margin-right: 4px;
    @include media-query(400px) {
        margin-left: 4px;
    }
}
.tag-list6:has(img) {
    background-color: darken($grey-color-light, 17%);
}
.tag-list6 {
    font-size: 95%;
    margin: 7px 3px 6px 4px;
}
.tag-list6:has(.children6) .tagbox6 {
    padding: 2px 4px $spacing-unit 4px;
}
.tag-list6:not(:has(.children6)) .tagbox6 {
    padding: 2px 4px;
}
.children6 {
    margin-left: 12px;
    margin-right: 4px;
    @include media-query(400px) {
        margin-left: 4px;
    }
}
