.post-header {
  margin-bottom: var(--size-36);
}

.post-header__meta {
  display: flex;
  align-items: center;
  gap: var(--size-36);
}

.post-date {
  font-size: var(--size-14);
}

.post-categories {
  display: flex;
  align-items: center;
  gap: var(--size-14);
}

.post-categories__category {
  font-size: var(--size-12);
  font-weight: var(--font-weight-bold);
  padding: 0 var(--size-32);
  background: var(--color-bg-light-gray2);
}

.post-header__title {
  font-size: var(--size-32);
  font-weight: var(--font-weight-bold);
  padding: var(--size-20) 0;
  border-bottom: 1px solid var(--color-text-black);
}

.link-container {
  display: flex;
  justify-content: center;
  margin-top: var(--size-80);
}

.work-prev-link {
  padding: var(--size-8);
}

/* CustomFieldTemplate Table - Format1 実績紹介 */

.cft-f1 {
  border-spacing: 0;
  border-collapse: collapse;
}

.cft-f1__head {
  padding: var(--size-10) 0;
  width: var(--size-220);
  height: 100%;
  font-size: var(--size-16);
  font-weight: var(--font-weight-bold);
  background: var(--color-bg-light-gray2);
  border: 1px solid var(--color-bg-light-gray1);
}

.cft-f1__value {
  padding: var(--size-10) var(--size-24);
  border: 1px solid var(--color-bg-light-gray1);
}

/* 施工実績ページ */

.works-title {
  font-size: var(--size-32);
  font-weight: var(--font-weight-bold);
  margin-top: var(--size-80);
}

/* 施工実績ギャラリー */
.works-images {
  margin-bottom: var(--size-40);
}

.works-images__main {
  margin-bottom: var(--size-16);
  border-radius: 4px;
  overflow: hidden;
}

.works-images__main-img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
  aspect-ratio: 16/9;
}

/* サムネイル外側コンテナ（新規追加） */
.works-images__thumbs-container {
  margin-top: 10px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* 中央寄せされた外側コンテナ */
.works-images__thumbs-container.centered-thumbs {
  justify-content: center;
}

/* 中央寄せされた外側コンテナの内部Swiper */
.works-images__thumbs-container.centered-thumbs .works-images__thumbs {
  width: auto !important;
  margin: 0 auto;
}

/* サムネイルのSwiperコンテナ */
.works-images__thumbs {
  height: 94px; /* 80px + 上下のパディング分14px */
  padding: 7px var(--size-16);
  overflow: visible;
  position: relative;
}

/* サムネイルのSwiperラッパー */
.works-images__thumbs .swiper-wrapper {
  display: flex;
  transition: transform 0.3s ease;
}

/* サムネイルの各スライド */
.works-images__thumbs .swiper-slide {
  width: 80px;
  height: 80px;
  opacity: 0.6;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  box-sizing: border-box;
  margin: 0 5px;
  overflow: visible; /* ボーダーが見えるようにする */
  position: relative; /* ボーダーの正確な配置のため */
}

.works-images__thumbs .swiper-slide:hover {
  opacity: 0.8;
}

.works-images__thumbs .swiper-slide-thumb-active {
  opacity: 1;
  border: 2px solid var(--color-main-blue);
  transform: scale(1.05);
  z-index: 1; /* 他のサムネイルより前面に */
}

.works-images__thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 2px; /* 内側の画像にも角丸を追加 */
}

.works-table {
  width: 100%;
  border-collapse: collapse;
}

.works-table td {
  padding: 1rem;
  border: 1px solid var(--color-bg-light-gray1);
}

.works-table td:first-child {
  width: 200px;
  background-color: var(--color-bg-light-gray2);
  font-weight: bold;
}

@media (max-width: 768px) {
  .post-header {
    margin-top: var(--size-100);
  }

  .works-table td:first-child {
    padding: var(--size-8) var(--size-16);
    width: var(--size-120);
  }

  .works-table td:last-child {
    padding: var(--size-8) var(--size-16);
  }

  .cft-f1__head {
    width: var(--size-120);
  }

  .works-images__main {
    margin-bottom: var(--size-10);
  }

  /* モバイル用のサムネイル外側コンテナ */
  .works-images__thumbs-container {
    margin-top: 10px;
  }

  /* モバイル用のサムネイルSwiperコンテナ */
  .works-images__thumbs {
    height: 74px; /* 60px + 上下のパディング分14px */
    padding: 7px var(--size-8);
  }

  /* モバイル用のサムネイルスライド */
  .works-images__thumbs .swiper-slide {
    width: 60px;
    height: 60px;
    margin: 0 4px;
  }

  .works-title {
    font-size: var(--size-24);
    margin-top: var(--size-40);
  }
}