:root {
  --key-blue: #0077b1;
  --key-grn:#008f72;
  --key-pink:#ee3b5d;
  --key-navy: #00195f;
  --bg-light: #f6f8fa;
  --bg-light-blue:#d9edf5;
}

@media (max-width: 768px) {
  body {
    font-size: var(--root-font-size);
  }
}

.search-lead{display:flex; justify-content: center; width:100%; text-align: center; font-size:var(--m-text); color:var(--key-navy); font-weight:600; margin-bottom:30px;}
.section-lead{display:flex; justify-content: center; width:100%; text-align: center; font-size:var(--m-text); color:var(--key-navy); font-weight:600; margin-bottom:30px;}

.search-lead .key-blue {
  color: var(--key-blue);
  font-weight: 700;
}

.search__form {
  scroll-margin-top: var(--scroll-margin);
}

.search__tags {
  width:100%;
  max-width:1180px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin:0 auto 24px;
  margin-bottom: 24px;
}

.tag {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 8px 16px;
  border-radius: 50px;
  border: 2px solid #333;
  background: #fff;
  color: #333;
  cursor: pointer;
  /*font-size:15px;*/
  font-size:var(--s-text);
  font-weight:600;
  width:calc((100% - 8px * 7) / 8);
  /*min-width:130px;*/
  text-decoration: none;
}

.tag.is-active {
  background: var(--key-blue);
  border-color: var(--key-blue);
  color: #fff;
}

/* タグボタン幅拡張（ミュージシャン等、タグ数が少なくテキストが長い場合に使用） */
.tag--wide { width: auto; min-width: 150px; }

:where(.news .search__tags) .tag {
  text-align: center;
  width: calc((100% - 8px * 5) / 6);
}

.search__controls {
  display:flex;
  width:100%;
  max-width: 1180px;
  margin: auto;
  gap: 20px;
  align-items: center;
}

.search__controls select{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

.search__controls .search__input{width:calc((100% - 20px * 2) / 3); background-color:var(--bg-light02);}
.search__controls .select-wrap{width:calc((100% - 20px * 2) / 3); }
.search__controls .select-wrap select{width:100%; height:48px; padding:10px; border:solid 1px var(--key-blue); border-radius:4px; background-color:var(--bg-light02); text-align:center; font-size:16px; position:relative;}
.search__controls .select-wrap{
  position:relative;
}

.search__controls select{
  appearance:none;
  padding-right:35px;
}

.search__controls .select-wrap::after{
  content:"";
  width:20px;
  height:auto;
  aspect-ratio: 20 / 18;
  background:url("../images/common/icon-sort.png") no-repeat center/contain;
  position:absolute;
  top:50%;
  right:10px;
  transform:translateY(-50%);
  pointer-events:none;
}

.search__controls .search__input{position:relative;}
.search__controls .search__input:after{content:""; width:18px; height:auto; aspect-ratio:1; background-image:url(../images/common/search.png); background-repeat:no-repeat; background-size:contain; display:block; position:absolute; top:50%; translate: 0 -50%; right:10px;}
.search__controls .search__input input[type="text"]{width:100%; height:48px; padding:0 36px 0 10px; border:solid 1px var(--key-blue); background-color:var(--bg-light02); border-radius:4px; font-size:var(--text); position:relative;}
.search__controls .search__input input[type="text"]::placeholder{color:#555;}

.search__controls button#openFilter{width:calc((100% - 20px * 2) / 3); height:48px; padding:10px; border:solid 1px var(--key-blue); border-radius:4px; text-align:center; font-size:var(--text); transition:all .4s; position:relative; background-color:var(--bg-light02)}
.search__controls button#openFilter:after{content:""; width:27px; height:auto; aspect-ratio: 27 / 22; background:url(../images/common/icon-filter.png) no-repeat; background-size:contain; display:block; position:absolute; top:50%; translate: 0 -50%;  right:18px;}
.search__controls button#openFilter:hover{color:#fff; background:var(--key-blue);}

/* key-blue テキストカラー */
.key-blue { color: var(--key-blue); }

@media (max-width: 1080px) {
  .tag {width:calc((100% - 8px * 3) / 4);}
  :where(.news .search__tags) .tag { width: calc((100% - 8px * 2) / 3); }
  .tag--wide { width: auto; min-width: 150px; }
  .search__controls{flex-wrap:wrap;}
  .search__controls .search__input{width:calc((100% - 20px * 1) / 2);height:42px;}
  .search__controls .select-wrap{width:calc((100% - 20px * 1) / 2); height:42px; }
  .search__controls button#openFilter{width:calc((100% - 20px * 1) / 2); height:42px;}
}

@media (max-width: 768px) {
  .search-lead {
    font-size: var(--s-text);
    line-height: 1.5;
    margin-top: -.25em;
    margin-bottom: var(--space-y-md);
    font-feature-settings: "palt";
  }

  .section-lead {
    font-size: var(--lead);
    line-height: var(--line-height-lead);
    margin-bottom: var(--space-y-md);
  }

  .search__tags {
    --tag-min-width: 10em;
    margin-bottom: var(--space-y-md);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--tag-min-width), 100%), 1fr));
    gap: 8px 4px;
    width: 100%;

    :where(html:lang(ja)) & {
      --tag-min-width-ja: 11em;
      --tag-min-width: var(--tag-min-width-ja);
      font-size: clamp(9px, calc(10 / 375 * 100vw), 12px);
    }

    :where(html:lang(en)) & {
      --tag-min-width-en: 12em;
      --tag-min-width: var(--tag-min-width-en);
      font-size: clamp(10px, calc(11 / 375 * 100vw), 12px);
    }

  }
  
  .search__tags--dancer {
    grid-template-columns: repeat(3, 1fr);
  }

  .search__tags--model {
    grid-template-columns: repeat(4, 1fr);
  }

  .search__tags--musician {
    --tag-min-width-ja:12em;
  }

  .search__tags--narrator {
    --tag-min-width-ja:14em;
  }

  .search__tags--news {
    --tag-min-width-ja:14em;
  }
  
  .tag {
    --border-width: 1px;
    border-width: var(--border-width);
    border-radius: 2em;
    padding: 4px calc(1em - calc(var(--border-width) * 2));
    width:calc((100% - 8px * 2) / 3);
    line-height: var(--line-height-label);
  }
  
  :where(.search__tags) .tag {
    width: auto;
    min-width: 0;
    min-height: var(--btn-min-height-sm);
    font-size: inherit;
  }

  :where(html:lang(ja)) .tag {
    line-break: strict;
    overflow-wrap: anywhere;
    word-break: normal;
    text-wrap: pretty;
  }

  :where(html:lang(ja)) .tag.is-budoux-applied,
  :where(html:lang(ja)) .tag .is-budoux-applied {
    br {
      display: none;
    }
  }

  /* スマホ二段表示タグ（キッズ等、タグ数が2つでSPで縦並びにしたい場合） */
  .tag--sp-block { width: 100%; }
  
  :where(.news .search__tags) .tag { width: auto;}

  .search__controls {
    display: grid;
    /* 縦に2段 */
    grid-template-columns: repeat(2, 1fr);
    gap: 4px;

    .search__input {
      grid-column: 1 / -1;
      width: 100%;
    }
  }

  .search__controls .search__input{width:100%; height:auto;}
  .search__controls .select-wrap{width:100%; height:auto;}
  .search__controls button#openFilter{width:100%; height:auto;}

  .search__controls .search__input input[type="text"],
  .search__controls .select-wrap select,
  .search__controls button#openFilter {
    height: auto;
    text-align: left;
    min-height: var(--form-control-height);
    padding-block: var(--form-control-padding-y);
    padding-left: var(--form-control-padding-x);
    font-size: var(--form-control-font-size-notfocused);
  }

  .search__controls .search__input input[type="text"]:focus {
    font-size: var(--form-control-font-size);
  }

  /* アイコンにemを効かせるため */
  .search__controls .search__input,
  .search__controls .select-wrap {
    font-size: var(--form-control-font-size);
  }

  /* アイコン用の右余白 */
  .search__controls .search__input input[type="text"],
  .search__controls .select-wrap select,
  .search__controls button#openFilter {
    padding-right: var(--pr-form-control-icon);
  }

  /* アイコン */
  .search__controls .search__input:after, 
  .search__controls .select-wrap::after,
  .search__controls button#openFilter:after {
    width: var(--form-control-icon-width);
    right: var(--form-control-padding-x);
  }
}

@media (max-width: 576px) {

  .search__tags {
    gap: 4px 3px;
  }

}

@media (max-width: 375px) {

  .section-lead--sp-sm {
    font-size: min(calc(15 / 375 * 100vw), 15px);
  }

}

@media (max-width: 374.98px) {

  .section-lead--sp-sm {
    font-size: 13px;
  }

}

.search__caption{ margin: 30px 0 -15px auto; padding-left: 1.25em; font-size:var(--text); font-weight: 500; position:relative;}
.search__caption:before{content:""; width:auto; height:1.1em; aspect-ratio: 10 / 14; display:block; position:absolute; background:url(../images/common/favorite_icon_on.svg) no-repeat; background-size: contain; left:0; top: 50%; translate: 0 calc(-50% + .05em); }

.search-more{width:50%; border-radius:0 0 20px 20px; padding:15px 30px 30px; min-width:min(500px, 100%); display:flex; justify-content: center; flex-direction: column;}
.search-more .btn__block{margin-top:20px;}
.search-more .result__num{color:var(--key-blue); font-weight:700; display:flex; justify-content: center; font-size:var(--m-font); gap:10px; align-items: end;}
.search-more .result__num span{font-size:var(--s-font);}

/* ローディングスピナー */
.loading-spinner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 80px 0;
}
.loading-spinner__icon {
  display: block;
  width: 48px;
  height: 48px;
  border: 4px solid rgba(0, 0, 0, 0.12);
  border-top-color: var(--key-blue, #2563eb);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

.models-list{display:flex; flex-wrap:wrap; gap:16px;margin: 0 auto;}
.models-list .model-card{width:calc((100% - 16px * 5) / 6); position: relative; transition: .25s ease;}
.model-card__img-wrap {
  position: relative;
}
.model-card__img {
  position: relative;
  overflow: hidden;
  aspect-ratio: 2 / 3;
  border-radius: 8px;
}
.model-card__img .number{position:absolute; left:10px; bottom:8px; font-size:var(--ss-text); color:#fff;}
.model-card__img.featured:before{content:"PICKUP"; display:block; width:fit-content; background:rgba(0,0,0,0.6); color:#fff; font-size:var(--ss-text); padding:5px 10px; position:absolute; top:0; left:0;}
/* .model-card__img.featured:lang(en)::before { content: "PICKUP";} */

.model-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.model-card p{
  font-size:var(--m-text); font-weight:500;
}
.model-card a {
  color: #222;
  text-decoration: none;
}
.model-card a:hover {
  color: #888;
}

.model-name {
  margin-top: 8px;
  font-size: var(--s-text);
  text-align: center;
}

@media (max-width: 1080px) {
  .models-list .model-card{width:calc((100% - 16px * 3) / 4); position: relative; transition: .25s ease;}
}

@media (max-width: 768px) {

  .search-more {
    /*上の要素のsection_inのpadding-bottomがあって余白が空きすぎるので削除*/
    padding-top: 0;
  }
  /* ②モデルカード：SP は1行3枚 */
  .models-list {
    --gap-x: var(--card-sm-gap);
    gap: var(--gap-x);
  }
  .models-list .model-card {
    width: calc((100% - var(--gap-x) * 2) / 3);
  }

  .model-card .model-card__name {
    font-size: var(--card-sm-text);
    line-height: var(--line-height-label);
    margin: var(--space-y-sm) 0;
  }

  .model-card__img {
    container-type: inline-size;
  }

  /* Pick Up
  修正するときは、`.narrator-card__img.featured:before`も
  */
  .model-card__img.featured:before{
    font-size: 10px;
    font-size: var(--pickup-font-size);
    line-height: 1;
    letter-spacing: 0.05em;
    padding: var(--pickup-padding);
  }

  :where(.section-in--search) .search__caption { 
    display: none;
    padding-block: 0;
    margin-top: var(--space-y-md);
  }

}


/* お気に入りボタン */
.fav-btn {
  position: absolute;
  bottom: 8px;
  right: 8px;
  width: 36px;
  height: 36px;
  border: none;
  background: rgba(255,255,255,.75);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: .2s;
  z-index: 1;
}

.fav-btn.is-active {
  background: var(--key-grn);
  animation: pop .25s ease;
}

@keyframes pop {
  0% { transform: scale(0.8); }
  70% { transform: scale(1.2); }
  100% { transform: scale(1); }
}

/* SVG共通 */
.bookmark-icon {
  width: 22px;
  height: auto;
  aspect-ratio: 1;
  fill: none;
  stroke: var(--key-grn);
  stroke-width: 2;
  transition: 0.2s;
}

/* 登録済：白塗りつぶし */
.fav-btn.is-active .bookmark-icon {
  fill: #fff;
  stroke: #fff;
}

/* お気に入りトースト通知 */
.fav-toast-overlay {
  position: fixed;
  inset: 0;
  z-index: 9998;
  cursor: pointer;
  display: none;
}
.fav-toast-overlay.is-visible { display: block; }

.fav-toast {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.92);
  width: 450px;
  max-width: calc(100vw - 40px);
  height: 120px;
  background: #FAF7EC;
  border: 1px solid var(--key-grn);
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0,0,0,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--m-text);
  color: #222;
  font-weight: 500;
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}
.fav-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}


/*-----絞り込み検索モーダル----*/

.filter-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 1000;
}

.filter-modal.is-open {
  display: block;
}

.filter-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.5);
}

.filter-modal__content {
  position: relative;
  width: 800px;
  max-width: 90%;
  background: #fff;
  margin: 10% auto;
  padding: 30px;
  border-radius: 20px;
}

.filter-modal__close {
  position: absolute;
  top: 10px;
  right: 10px;
  background: none;
  border: none;
  font-size: 40px;
  cursor: pointer;
}

#filter-modal h2{text-align: center; font-size:var(--h4); margin-bottom:20px; font-weight:700;}

#filter-modal .filter-list{background:var(--bg-light-blue); padding:16px; font-size:var(--m-text); margin-bottom:25px;}
#filter-modal .filter-list p{font-size:14px;}
#filter-modal .filter-list ul{display:flex; flex-wrap: wrap;}
#filter-modal .filter-list ul li{padding:2px 20px 2px 0; position:relative; font-weight:700; font-size:var(--m-text);}
#filter-modal .filter-list ul li:after{content:"|"; position: absolute; display: block; top:0; right:10px;}

.modal {
  display: none;
}

.modal.is-open {
  display: block;
}

.modal__overlay{
  position: fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:1000;
}

.modal__container{
  background:#fff;
  max-width:900px;
  width:90%;
  max-height:90vh;
  overflow:auto;
  padding:40px;
  position:relative;
  border-radius: 20px;
}

.modal__close{
  position: absolute;
  top: 10px;
  right: 10px;
  background: none;
  border: none;
  font-size: 40px;
  cursor: pointer;
}

.filter-group{display:flex; gap:20px; padding:0 10px 12px 10px;}
.filter-group-row{display:flex; gap:0; align-items:flex-start;}
.filter-group-row .filter-group{flex:1;}
.filter-label{font-weight:bold; text-wrap: wrap; width:8em;}
.filter-group .item-list{display:flex; flex-wrap: wrap; gap:20px; row-gap: 0; font-size:var(--s-text); width:calc(100% - 8em - 20px)}
.filter-group .item-list label{width:fit-content}
.filter-group .item-list select{padding:10px; border:solid 1px var(--key-blue); border-radius: 6px; width:140px;}

.modal-caption{font-size:var(--ss-text); padding:20px 0;}

.filter-actions{display:flex; align-items: center; justify-content: center; gap: 10px;}
.filter-actions button{width:400px; margin:0 auto; height:48px; border:solid 2px var(--key-blue); color:var(--key-blue); font-size:var(--text); padding:15px 30px; line-height:1; border-radius:24px; background:#fff; font-weight:700;}


/* ラベル全体 */
.custom-check {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  margin-bottom: 10px;
  position: relative;
}

/* ネイティブ非表示 */
.custom-check input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* 見た目ボックス */
.check-box {
  width: 20px;
  height: 20px;
  border: 2px solid var(--key-blue);
  border-radius: 4px;
  transition: .2s ease;
  position: relative;
  flex: 0 0 auto;
}

/* チェックON */
.custom-check input:checked + .check-box {
  background: var(--key-blue);
  border-color: var(--key-blue);
}

/* チェックアイコン */
.custom-check input:checked + .check-box::after {
  content: "";
  position: absolute;
  left: 5px;
  top: -2px;
  width: 6px;
  height: 12px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

.section-intro{display:flex; width:1000px; max-width:90%; margin:40px auto;}



.contents-link{display:flex; gap:40px; row-gap:15px; justify-content: center; align-items: center; flex-wrap:wrap;}
.contents-link a{width:fit-content; padding:10px 40px 10px 0; font-size:var(--h4); color:#333; text-decoration:none; font-weight:700; position:relative;}
.contents-link a:after{content:""; display:block; position:absolute; width:30px; height:30px; background:url(../images/common/circle-arrow-blue.png) no-repeat; background-size:30px 30px; right:0; top:calc(50% - 14px);}

@media (max-width: 768px) {
  .section-intro{
    max-width: 100%;
    margin: var(--space-y-large-element) auto;
  }
  .fav-btn {
    padding: 0;
  }
  .bookmark-icon {
    width: 56%;
  }
  .fav-btn.is-active .bookmark-icon {
    stroke-width: 0;
  }
  .custom-check {
    align-items: flex-start;
    margin-bottom: 8px;
  }
  :where(html:lang(ja)) .custom-check {
    line-break: strict;
    overflow-wrap: anywhere;
    word-break: normal;
    text-wrap: pretty;
  }
  .filter-actions {
    gap: var(--space-x-xs);
  }
  .filter-actions button {
    font-size: var(--form-label-font-size);
    padding: var(--form-control-padding-y) var(--form-control-padding-x);
    height: auto;
    min-height: var(--form-control-height);
  }
  /* モーダル：SP は画面いっぱい */
  .modal__close {
    top: 0;
  }
  .modal__container {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    border-radius: 0;
    padding: 36px var(--space-x-page) 24px;
  }
  #filter-modal h2 {
    margin-bottom: var(--space-y-md);
  }
  /* フィルター行：SP は上下積み・幅いっぱい */
  .filter-group-row {
    width: 100%;
    flex-direction: column;
  }
  .filter-group {
    width: 100%;
    flex-direction: column;
    padding: 0 var(--space-x-sm) var(--space-y-xl);
    gap: 10px;
  }
  .filter-group:where(:has( + .filter-group)),
  .filter-group:where(:has( + .filter-group-row)) {
    padding-bottom: var(--space-y-md);
    border-bottom: 1px solid var(--hr-color);
    margin-bottom: var(--space-y-md);
  }
  /* 最初が.filter-labelだとline-heightにより余白を広くなるので縮める */
  .filter-group:where(:has( + .filter-group > .filter-label:first-child)),
  .filter-group:where(:has( + .filter-group-row > .filter-group > .filter-label:first-child)) {
    margin-bottom: calc(var(--space-y-md) - var(--space-y-xs));
  }
  .filter-label {
    width: 100%;
    font-size: var(--form-label-font-size-lg);
  }
  /* from-control */
  .filter-group .item-list {
    width: 100%;
    --gap-x: 12px;
    column-gap: var(--gap-x);
  }
  .item-list--col3.item-list--languages .item-list__col {
    display: contents;
  }
  .filter-group .item-list--checkbox {
    --gap-x: 24px;
    --gap-y: 12px;
    column-gap: var(--gap-x);
    row-gap: var(--gap-y);
  }
  .filter-group .item-list--checkbox .custom-check {
    margin-bottom: 0;
  }
  .filter-group .item-list select {
    padding: var(--form-control-padding-y) var(--form-control-padding-x);
    width: fit-content;
    min-width: var(--form-control-width-sm);
    min-height: var(--form-control-height);
    border-radius: 4px;
  }
  /* from-specific */
  .filter-group .item-list--period {
    --gap-x: 8px;
    column-gap: var(--gap-x);
    align-items: center;
  }
  .modal-caption {
    padding-top: 0;
  }
  /* 
  モーダルの最後のボタンをstickyにするにあたって、ボタンのコンテナーに余白を持たせるので、モーダル下の余白は削除する。（max-md:pb-0）
  ボタンのコンテナーに余白を持たせたので、その上の要素の`..modal-caption`の下の余白も削除する。（padding-bottom: 0;）
  */
  :where(.modal__container.max-sm\:pb-0) .modal-caption:has( + .filter-actions) {
    padding-bottom: 0;
  }
  :where(.modal__container.max-sm\:pb-0) .filter-actions {
    padding-block: var(--space-y-md);
    background: rgba(255,255,255,.85);
    position: sticky;
    left: 0;
    bottom: 0;
  }
}
/* from-layout */
@media (max-width: 768px) {
  .filter-group .item-list--grid1 {
    display:grid;
    grid-template-columns:repeat(1, 1fr);
  }
  .filter-group .item-list--grid1 > * {
    width: auto;
  }
  .filter-group .item-list--grid2 {
    display:grid;
    grid-template-columns:repeat(2, 1fr);
  }
  .filter-group .item-list--grid2 > * {
    width: auto;
  }
  .filter-group .item-list--grid3 {
    display:grid;
    grid-template-columns:repeat(3, 1fr);
  }
  .filter-group .item-list--grid3 > * {
    width: auto;
  }
  .filter-group .item-list--snap-grid {
    display:grid;
    grid-template-columns:repeat(6, 1fr);
    gap:0;
  }
  .filter-group .item-list--snap-grid > * {
    width: auto;
    grid-column: span 2;
  }
}
@media (min-width: 576.02px) and (max-width: 768px) {
  .filter-group .sm\:item-list--grid2 {
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    /* grid-template-columns: repeat(2, minmax(max-content, 1fr)); */
  }
  .filter-group .sm\:item-list--grid2 > * {
    width: auto;
  }
  .filter-group .sm\:item-list--grid3 {
    display:grid;
    grid-template-columns:repeat(3, 1fr);
  }
  .filter-group .sm\:item-list--grid3 > * {
    width: auto;
  }
  .filter-group .sm\:item-list--flex-auto {
    display:flex;
    flex-wrap: wrap;
  }
  .filter-group .sm\:item-list--flex-auto > * {
    width: auto;
  }
}
@media (max-width: 576px) {

  .filter-group .max-xs\:item-list--grid2 {
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    /* grid-template-columns: repeat(2, minmax(max-content, 1fr)); */
  }
  .filter-group .max-xs\:item-list--grid2 > * {
    width: auto;
  }
  .filter-group .max-xs\:item-list--grid3 {
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    /* grid-template-columns: repeat(2, minmax(max-content, 1fr)); */
  }
  .filter-group .max-xs\:item-list--grid3 > * {
    width: auto;
  }

}