.image-section {
  margin: 40px 5% 0;
}

.image-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 20px 5% 0;
}

.image-grid img {
  width: 100%;
  display: block;
}

/* スマホ */
@media (max-width: 768px) {
  .image-grid {
    grid-template-columns: 1fr;
  }

  .image-grid img {
    width: 100%;
  }
}


.heading-solid-box {
  padding: 10px 15px;
  color: #333333;
  background: #ffffff;
  border: 1px solid #333333;
  box-shadow: 4px 4px 0 #333333;

  line-height: 1.4;
  word-break: break-word;
}

@media (max-width: 768px) {
  .heading-solid-box {
    font-size: clamp(12px, 3.5vw, 16px);
  }
}


.news {
    width: 100%;
    margin: 0;
    padding: 0;
    background: #fff;
    position: relative;
    overflow: hidden;
}

/* =========================================================
   INNER
   ========================================================= */

.inner {
    width: 90%;
    max-width: 1400px;

    margin: 0 auto;

    position: relative;
    z-index: 1;
}

/* NEWS本体だけ右寄せ */

.news_content {
    margin-left: auto;

    width: 100%;
    max-width: 960px;
}

.takatech_news_inner {
    position: relative;
    overflow: hidden;
}

/* =========================================================
   PC LAYOUT
   ========================================================= */

@media screen and (min-width: 1001px) {

    .news_layout {
        display: flex;
        justify-content: flex-end;
    }

    .news_list {
        border-top: 2px solid #111;
        border-left: 1px solid rgba(0,0,0,0.08);
        border-right: 1px solid rgba(0,0,0,0.08);
    }
}

/* =========================================================
   FILTER
   ========================================================= */

.news_filters {
    margin-bottom: 26px;
    padding-bottom: 14px;

    border-bottom: 1px solid #ddd;

    position: relative;
}

.news_filters::before {
    content: "";

    position: absolute;

    top: -8px;
    left: 0;

    width: 90px;
    height: 2px;

    background: #004da1;

    transform: skewX(-20deg);
}

.category_buttons {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.category_buttons button {
    background: transparent;

    border: 1px solid #ccc;

    padding: 7px 16px;

    cursor: pointer;

    font-size: 12px;
    font-weight: 600;
    font-family: inherit;

    color: #555;

    transition: 0.2s ease;
}

.category_buttons button:hover {
    border-color: #004da1;
    color: #004da1;
}

button.active {
    background: #004da1 !important;
    color: #fff !important;
    border-color: #004da1 !important;
}

/* =========================================================
   LIST
   ========================================================= */

.news_list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.news_list_item {
    position: relative;
    border-bottom: 1px solid #e5e5e5;
}

/* 左アクセント */

.news_list_item::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 2px;
    height: 100%;

    background: linear-gradient(
        180deg,
        #004da1,
        transparent
    );

    opacity: 0.35;
}

/* =========================================================
   LINK
   ========================================================= */

.news_list_item a {
    display: flex;
    align-items: center;

    padding: 8px 12px;

    color: #004da1;
    text-decoration: none;

    transition: background 0.2s ease;
}

.news_list_item a:hover {
    background: #f7f9fc;
}

/* =========================================================
   DATE
   ========================================================= */

.news_list_date {
    display: flex;
    align-items: center;

    width: 210px;

    flex-shrink: 0;
}

.news_list_date time {
    font-family: "Inter", "Noto Sans JP", sans-serif;

    font-size: 13px;
    font-weight: 500;

    color: #777;

    margin-right: 12px;

    letter-spacing: 0.05em;

    font-variant-numeric: tabular-nums;
}

/* =========================================================
   CATEGORY
   ========================================================= */

.news_item {
    font-size: 10px;
    font-weight: 700;

    padding: 4px 10px;

    color: #fff;

    min-width: 68px;

    text-align: center;

    letter-spacing: 0.08em;
    text-transform: uppercase;

    font-family: "Inter", "Noto Sans JP", sans-serif;
}

.cat-news  { background: #004da1; }
.cat-event { background: #e60012; }
.cat-info  { background: #555; }

/* =========================================================
   TITLE
   ========================================================= */

.news_list_item p:not(.news_item) {
    flex-grow: 1;

    margin: 0 14px;

    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    color: #004da1;

    text-decoration: underline;
    text-underline-offset: 0.14em;
}

.news_list_item a:hover p:not(.news_item) {
    text-decoration: none;
}

/* =========================================================
   PDF ICON
   ========================================================= */

.news_list_item a[href$=".pdf"]::before {
    content: "PDF";

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 22px;

    margin-left: 10px;

    background: #e60012;
    color: #fff;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: 0.1em;

    flex-shrink: 0;

    order: 3;
}

/* =========================================================
   ARROW REMOVE
   ========================================================= */

.arrow {
    display: none !important;
}

/* =========================================================
   MORE BUTTON
   ========================================================= */

.news_more {
    margin-top: 34px;

    display: flex;
    justify-content: center;
}

.news_more a {
    position: relative;

    font-size: 13px;
    font-weight: 500;

    color: #111;

    text-decoration: none;

    letter-spacing: 0.05em;
}

.news_more a::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -2px;

    width: 100%;
    height: 1px;

    background: #111;

    transform: scaleX(0.5);
    transform-origin: left;

    transition: transform 0.25s ease;
}

.news_more a:hover::after {
    transform: scaleX(1);
}

/* =========================================================
   MOBILE
   ========================================================= */
@media screen and (max-width: 1000px) {

    /* ===============================
       配置
       =============================== */

.news_list_item a {
    padding: 14px 12px;
    }

    /* ===============================
       フィルター
       =============================== */

    .news_filters {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .category_buttons,
    .year_buttons {
        flex-direction: column;
        width: 100%;
        gap: 8px;
    }

    .category_buttons button,
    .year_buttons button {
        width: 100%;
        text-align: center;
        padding: 12px;
    }

    /* ===============================
       レイアウト
       =============================== */

    .news_list_item a {
        display: grid;
        grid-template-columns: 1fr 42px;
        grid-template-rows: auto auto;
        column-gap: 10px;
        row-gap: 6px;

        padding: 14px 10px;
        align-items: center;
    }

    /* ===============================
       PDF（これだけ使う）
       =============================== */

    .news_list_item a[href$=".pdf"]::after {
        content: "PDF";

        grid-column: 2;
        grid-row: 1;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 42px;
        height: 22px;

        background: #e60012;
        color: #fff;

        font-size: 9px;
        font-weight: 700;
        letter-spacing: 0.1em;

        pointer-events: none;
    }

    /* ★完全に重要：旧PDFを絶対消す */
    .news_list_item a[href$=".pdf"]::before {
        content: none !important;
        display: none !important;
    }

    /* PDFなしは何もしない（枠も作らない） */
    .news_list_item a:not([href$=".pdf"])::after {
        content: "";
        grid-column: 2;
        grid-row: 1;
        width: 42px;
        height: 22px;
        opacity: 0;
    }

    /* ===============================
       タイトル
       =============================== */

    .news_list_item p:not(.news_item) {
        grid-column: 1 / -1;
        grid-row: 2;

        margin: 0;

        white-space: normal;
        overflow: hidden;
        text-overflow: ellipsis;

        word-break: break-word;
        line-height: 1.5;
    }
}