@charset "UTF-8";

input[name="tab_input"] {
  display: none;
}
.newsArchive_main_head_tab {
  display: flex;
  column-gap: 12px;
}
.newsArchive_main_head_tab_item label {
  display: block;
  background-color: rgba(255, 255, 255, 0.16);
  padding: 0 12px;
  font-size: 14px;
  font-weight: 300;
  line-height: 35px;
  cursor: pointer;
}
#tab1:checked ~ .newsArchive_main_head_tab #tab1_label,
#tab2:checked ~ .newsArchive_main_head_tab #tab2_label,
#tab3:checked ~ .newsArchive_main_head_tab #tab3_label,
#tab4:checked ~ .newsArchive_main_head_tab #tab4_label {
  background-color: rgba(255, 255, 255, 1);
  color: #000;
  font-weight: 400;
}
.newsArchive_main_body_panel {
  overflow: hidden;
  height: 0;
  opacity: 0;
}
#tab1:checked ~ .newsArchive_main_body #panel1,
#tab2:checked ~ .newsArchive_main_body #panel2,
#tab3:checked ~ .newsArchive_main_body #panel3,
#tab4:checked ~ .newsArchive_main_body #panel4 {
  overflow: visible;
  height: auto;
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}
.newsArchive_main_body {
  margin-top: 40px;
}

@media (max-width: 1439px) {
  .newsArchive_main_head_tab {
    column-gap: calc(12 / var(--view-size) * 100vw);
  }
  .newsArchive_main_head_tab_item label {
    padding: 0 calc(12 / var(--view-size) * 100vw);
    font-size: calc(14 / var(--view-size) * 100vw);
    line-height: calc(35 / var(--view-size) * 100vw);
  }
  .newsArchive_main_body {
    margin-top: calc(40 / var(--view-size) * 100vw);
  }
  .newsArchive_main_pagination {
    margin-top: calc(40 / var(--view-size) * 100vw);
  }
  .newsArchive_main_pagination_items {
    column-gap: calc(12 / var(--view-size) * 100vw);
  }
  .newsArchive_main_pagination_link {
    width: calc(51 / var(--view-size) * 100vw);
    font-size: calc(12 / var(--view-size) * 100vw);
    line-height: calc(47 / var(--view-size) * 100vw);
    border-radius: calc(1000 / var(--view-size) * 100vw);
  }
  .newsArchive_main_pagination_link.--prev,
  .newsArchive_main_pagination_link.--next {
    width: calc(57 / var(--view-size) * 100vw);
    height: calc(47 / var(--view-size) * 100vw);
    background-size: calc(12 / var(--view-size) * 100vw)
      calc(11 / var(--view-size) * 100vw);
  }
}

@media (max-width: 768px) {
  .newsArchive_main_head_tab {
    column-gap: calc(10 / var(--view-size) * 100vw);
  }
  .newsArchive_main_head_tab_item label {
    font-size: calc(12 / var(--view-size) * 100vw);
    line-height: calc(31 / var(--view-size) * 100vw);
  }
}