h3 {
  font-size: clamp(26px, 3vw, 100cqw);
  margin-bottom: 1em;
  font-weight: 400;
}

h2 {
  max-width: 22em;
}

.title-32 {
  font-size: clamp(26px, 2.222vw, 100cqw);
}

.filterbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  border-radius: 1000px;
  border: 1px solid #000;
  padding: clamp(4px, 0.277777vw, 100cqw);
}
.filterbox a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-decoration: none;
}

.btn__filter {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: clamp(14px, 1vw, 100cqw) clamp(26px, 2.222vw, 100cqw);
  color: #000;
  -webkit-transition: background 0.3s ease-in-out, color 0.3s ease-in-out;
  transition: background 0.3s ease-in-out, color 0.3s ease-in-out;
}

.btn__filter.active {
  background: #85B9E0;
  color: #fff;
}

.flexbox:has(.art-item) .art-item {
  grid-template-columns: repeat(2, 1fr);
}
.flexbox:has(.art-item) .art-item .image {
  width: 100%;
  aspect-ratio: 2;
}
.flexbox:has(.art-item) .art-item .image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.flexbox:has(.art-item) .art-item .text-box {
  padding-left: clamp(46px, 6vw, 100cqw);
}
.flexbox:has(.art-item) .art-item:nth-of-type(even) .image {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.flexbox:has(.art-item) .art-item:nth-of-type(even) .text-box {
  padding-left: 0;
  padding-right: clamp(46px, 6vw, 100cqw);
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}

.art-item p {
  font-size: clamp(18px, 1.5277777vw, 100cqw);
}

#announcement .title-box {
  gap: clamp(20px, 2vw, 100cqw);
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

#announcement-slider {
  width: 100%;
  overflow: hidden;
  margin-top: clamp(26px, 3vw, 100cqw);
}
#announcement-slider .image {
  width: 100%;
  aspect-ratio: 1.58;
}
#announcement-slider .image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#announcement-slider .announcement-title {
  font-size: clamp(18px, 1.5277777vw, 100cqw);
  font-weight: 700;
  margin-top: clamp(18px, 1.5277777vw, 100cqw);
}
#announcement-slider .btn__ghost_tag {
  font-size: clamp(14px, 1vw, 100cqw);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-top: clamp(18px, 1.5277777vw, 100cqw);
}

@media screen and (max-width: 767px) {
  .filterbox {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding: 0;
    border: none;
  }

  .flexbox:has(.art-item) .art-item {
    grid-template-columns: 1fr;
    gap: clamp(26px, 3vw, 100cqw);
  }
  .flexbox:has(.art-item) .art-item .image {
    width: 100%;
    aspect-ratio: 2;
  }
  .flexbox:has(.art-item) .art-item .image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .flexbox:has(.art-item) .art-item .text-box {
    padding-left: 0;
  }
  .flexbox:has(.art-item) .art-item:nth-of-type(even) .image {
    -webkit-box-ordinal-group: unset;
        -ms-flex-order: unset;
            order: unset;
  }
  .flexbox:has(.art-item) .art-item:nth-of-type(even) .text-box {
    padding-right: 0;
    -webkit-box-ordinal-group: unset;
        -ms-flex-order: unset;
            order: unset;
  }
}
/*# sourceMappingURL=art.css.map */