@charset "utf-8";
:root{
  --size-btn-slidearrow: 40px;
}

@media (600px <= width) {
  :root{
    --size-btn-slidearrow: clamp(2.75rem, 7.33vw, 3.438rem);
  }
}

@media (1024px < width) {
  :root{
    --size-btn-slidearrow: 50px;
  }
}

.eventnews_container{
  margin: 0 auto;
}

.tablists_eventnews, .eventnews_container .result_contents, .eventnews_container .btn_container_right{
  padding: 0 calc(var(--space-side) + var(--space-inner-side));
}

.slider_calendar{
  margin: 0 auto min(10.666vw, 80px);
}

.slider_calendar .splide__track{
  width: calc(100% - ((var(--size-btn-slidearrow) + 20px) * 2));
  margin: 0 auto;
}

.slider_calendar li{
  width: clamp(3.188rem, 1.973rem + 4.86vw, 4.25rem);
  aspect-ratio: 1 / 1;
  background-color: #F8F8F7;
  font-family: var(--font-en);
  color: var(--color-primary);
  text-align: center;
  letter-spacing: .06em;
}

.slider_calendar a{
  padding: 10px;
  display: grid;
  place-content: center;
  width: 100%;
  height: 100%;
}

.slider_calendar time{
  font-size: clamp(1rem, -0.5rem + 4vw, 1.375rem);
  display: block;
}

.slider_calendar span{
  font-size: .688rem;
}

.slider_calendar .text_red{
  background-color: #FDEAE6;
  color: var(--color-red);
}

.slider_calendar .text_blue{
  background-color: #E5F5FD;
  color: #065CA6;
}

.slider_calendar .slide_arrow{
  width: var(--size-btn-slidearrow);
  height: var(--size-btn-slidearrow);
  background-color: rgb(128 120 120 / 100%);
  border-radius: 0;
  transition: opacity var(--hover-animation);
  opacity: 100%;
}

.slider_calendar .slide_arrow svg{
  fill: none;
  stroke: #fff;
  width: 52%;
  height: 52%;
}

.slider_calendar .slide_arrow_prev{
  left: 10px;
}

.slider_calendar .slide_arrow_next{
  right: 10px;
}

.tablists_eventnews{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-flow: column;
  max-width: 795px;
  justify-content: center;
  margin: min(8vw, 60px) auto clamp(4.375rem, 3.119rem + 5.03vw, 5rem);
  text-align: center;
  transition: color var(--hover-animation);
}

.tablists_eventnews li:nth-of-type(2){
  border-right: 1px solid var(--color-border);
  border-left: 1px solid var(--color-border);
}

.text_tab_event{
  color: #A8A3A3;
  font-size: clamp(1.125rem, 0.393rem + 1.14vw, 1.25rem);
  font-weight: var(--font-semibold);
  transition: color var(--hover-animation);
  position: relative;
}

.text_tab_event::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 100%;
  height: 4px;
  background-color: var(--color-accent);
  transition: transform var(--hover-animation);
  transform: scale(0, 1);
  transform-origin: center top;
}

.tablists_eventnews .is-active .text_tab_event{
  color: var(--color-base);
}

.tablists_eventnews .is-active .text_tab_event::after{
  transform: scale(1, 1);
}

.tablists_eventnews li:not(.is-active) .text_tab_event{
  cursor: pointer;
}

.tablists_eventnews li:not(.is-active) .text_tab_event:hover{
  color: #8D8686;
}

@media (1024px < width) {
  .calendar_contents, .tablists_eventnews, .eventnews_container .result_contents, .eventnews_container .btn_container_right{
    padding: 0 calc(var(--space-side) + var(--space-inner-side));
  }

  .slider_calendar{
    max-width: 960px;
  }

  .slider_calendar .splide__track{
    max-width: 748px;
  }

  .slider_calendar .slide_arrow_prev{
    left: 0;
  }
  
  .slider_calendar .slide_arrow_next{
    right: 0;
  }

  .slider_calendar li{
    max-width: 93px;
  }

  .slider_calendar time{
    font-size: clamp(1.375rem, 0.958rem + 0.89vw, 1.625rem);
  }

  .tablists_eventnews{
    margin: 0 auto 80px;
  }

  .eventnews_container .article_lists{
    display: block;
  }

  .eventnews_pickup_lists, .eventnews_normal_lists{
    display: grid;
    justify-content: space-between;
    gap: 0 20px;
  }

  .eventnews_pickup_lists{
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    margin: -60px 0 74px;
  }

  .eventnews_normal_lists{
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    margin: -60px 0 0;
  }
}