/* =============================================
   コラム共通スタイル
   ============================================= */

/* ----- 一覧ページ ----- */
.p-column-archive {
  padding: 40px 0 60px;
}
.p-column-archive__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}
.p-column-archive__title {
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 24px;
  color: #333;
}

/* カテゴリナビ */
.p-column-archive__cat-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-bottom: 32px;
}
.p-column-archive__cat-link {
  display: inline-block;
  padding: 6px 16px;
  border: 1px solid #ccc;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  color: #666;
  transition: all 0.2s;
}
.p-column-archive__cat-link:hover,
.p-column-archive__cat-link.is-active {
  background: #014DA7;
  border-color: #014DA7;
  color: #fff;
}

/* 記事カード（一覧・関連記事共通） */
.p-column-archive__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.p-column-related__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.p-column-card {
  display: block;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: box-shadow 0.2s, transform 0.2s;
}
.p-column-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}
.p-column-card__thumb {
  aspect-ratio: 3 / 2;
  overflow: hidden;
}
.p-column-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.p-column-card__body {
  padding: 12px 16px 16px;
}
.p-column-card__cat {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: #014DA7;
  background: #EBF4FF;
  padding: 2px 8px;
  border-radius: 3px;
  margin-bottom: 6px;
}
.p-column-card__title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  color: #333;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.p-column-card__date {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  color: #999;
  margin-top: 8px;
}

/* ページネーション */
.p-column-archive__pagination,
.p-column-archive .nav-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 40px;
}
.p-column-archive .page-numbers {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 4px;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #666;
  border: 1px solid #ddd;
  transition: all 0.2s;
}
.p-column-archive .page-numbers:hover {
  background: #EBF4FF;
  border-color: #014DA7;
  color: #014DA7;
}
.p-column-archive .page-numbers.current {
  background: #014DA7;
  border-color: #014DA7;
  color: #fff;
}

/* 記事なし */
.p-column-archive__empty {
  text-align: center;
  color: #999;
  font-size: 15px;
  padding: 60px 0;
}

/* ----- 記事詳細ページ ----- */
.p-column-single {
  padding: 40px 0 60px;
}
.p-column-single__inner {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 20px;
}
.p-column-single__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.p-column-single__cat {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: #014DA7;
  background: #EBF4FF;
  padding: 3px 10px;
  border-radius: 3px;
  text-decoration: none;
}
.p-column-single__cat:hover {
  background: #014DA7;
  color: #fff;
}
.p-column-single__date {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  color: #999;
}
.p-column-single__title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  color: #333;
  margin-bottom: 24px;
}
.p-column-single__thumbnail {
  margin-bottom: 32px;
  border-radius: 8px;
  overflow: hidden;
}
.p-column-single__thumbnail img {
  width: 100%;
  height: auto;
  display: block;
}

/* ----- 記事本文（装飾タグ含む） ----- */
.p-column-single__body {
  font-family: 'Noto Sans JP', sans-serif;
  color: #333;
}
.p-column-single__body p {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.8;
  margin-bottom: 15px;
}
.p-column-single__body h2 {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  margin: 40px 0 16px;
  padding: 12px 16px;
  background: #EBF4FF;
  border-radius: 6px;
}
.p-column-single__body h3 {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  padding-left: 12px;
  margin: 32px 0 12px;
  border-left: 4px solid #014DA7;
}
.p-column-single__body h4 {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  margin: 24px 0 8px;
}
.p-column-single__body strong {
  font-weight: 700;
}
.p-column-single__body a {
  color: #014DA7;
  text-decoration: underline;
}
.p-column-single__body img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
}

/* ul / ol */
.p-column-single__body ul {
  margin: 20px 0;
  padding: 0;
  list-style: none;
}
.p-column-single__body ul li {
  position: relative;
  padding-left: 20px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.8;
  margin-bottom: 4px;
}
.p-column-single__body ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  width: 8px;
  height: 8px;
  background: #014DA7;
  border-radius: 1px;
}
.p-column-single__body ol {
  margin: 20px 0;
  padding: 0;
  list-style: none;
  counter-reset: ol-counter;
}
.p-column-single__body ol li {
  position: relative;
  padding-left: 28px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.8;
  margin-bottom: 4px;
  counter-increment: ol-counter;
}
.p-column-single__body ol li::before {
  content: counter(ol-counter);
  position: absolute;
  left: 0;
  top: 2px;
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #014DA7;
  width: 20px;
  text-align: center;
  line-height: 1.8;
}

/* table */
.p-column-single__body table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #CFCFCF;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.21;
  margin: 24px 0;
}
.p-column-single__body table th,
.p-column-single__body table td {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  box-sizing: border-box;
  vertical-align: middle;
}
.p-column-single__body table th {
  background: #EBF4FF;
  font-weight: 700;
  text-align: left;
  padding: 11px 12px;
  border-right: 1px solid #CFCFCF;
  border-bottom: 1px dashed #CFCFCF;
}
.p-column-single__body table td {
  background: #fff;
  padding: 11px 16px;
  font-weight: 500;
  border-bottom: 1px dashed #CFCFCF;
  border-right: 1px dashed #CFCFCF;
}
.p-column-single__body table td:last-child {
  border-right: none;
}
.p-column-single__body table tr:last-child th,
.p-column-single__body table tr:last-child td {
  border-bottom: none;
}
.p-column-single__body .scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* marker */
.p-column-single__body .marker {
  display: inline;
  box-decoration-break: clone;
  background: linear-gradient(transparent 60%, #FCFF4E 60%);
}

/* ----- 装飾タグ（スプシ仕様） ----- */

/* ピンクボックス */
.p-column-single__body .pink-box {
  background: #FFF0F0;
  padding: 20px;
  border-radius: 8px;
  margin: 20px 0;
}

/* 黄色ボックス */
.p-column-single__body .yellow-box {
  background: #FFFDE7;
  padding: 20px;
  border-radius: 8px;
  margin: 20px 0;
}

/* グレーボックス */
.p-column-single__body .gray-box {
  background: #F5F5F5;
  padding: 20px;
  border-radius: 8px;
  margin: 20px 0;
}

/* 点線ボックス */
.p-column-single__body .dotted-box {
  border: 2px dashed #ccc;
  padding: 20px;
  border-radius: 8px;
  margin: 20px 0;
}

/* チェックリストボックス */
.p-column-single__body .point-box3 {
  background: #F8F9FA;
  border: 1px solid #E0E0E0;
  border-radius: 8px;
  padding: 20px;
  margin: 20px 0;
}
.p-column-single__body .list_check {
  list-style: none;
  padding: 0;
  margin: 0;
}
.p-column-single__body .list_check li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 8px;
  font-size: 15px;
  line-height: 1.6;
}
.p-column-single__body .list_check li::before {
  content: '\f00c';
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 2px;
  color: #014DA7;
  font-size: 14px;
  background: none;
  width: auto;
  height: auto;
  border-radius: 0;
}

/* リスト囲み枠 */
.p-column-single__body .list-block {
  border: 1px solid #E0E0E0;
  border-radius: 8px;
  padding: 20px;
  margin: 20px 0;
}

/* アコーディオン */
.p-column-single__body .ac-item {
  border: 1px solid #E0E0E0;
  border-radius: 8px;
  margin: 16px 0;
  overflow: hidden;
}
.p-column-single__body .ac-item .ac-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  background: #F8F9FA;
}
.p-column-single__body .ac-item .ac-title::after {
  content: '\f078';
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
  font-size: 12px;
  color: #666;
  transition: transform 0.3s;
}
.p-column-single__body .ac-item.is-open .ac-title::after {
  transform: rotate(180deg);
}
.p-column-single__body .ac-item .ac-content {
  display: none;
  padding: 0 20px 20px;
}
.p-column-single__body .ac-item.is-open .ac-content {
  display: block;
}

/* 定義リスト */
.p-column-single__body dl {
  margin: 20px 0;
}
.p-column-single__body dt {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 4px;
  color: #014DA7;
}
.p-column-single__body dd {
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 16px;
  padding-left: 0;
}

/* ボタン（青） */
.p-column-single__body .btn-blue,
.p-column-single__body .btn-yellow {
  margin: 20px auto 0;
  text-align: center;
}
.p-column-single__body .btn-blue a,
.p-column-single__body .btn-yellow a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  max-width: 282px;
  margin: 0 auto;
  height: 58px;
  border-radius: 8px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
  text-decoration: none;
}
.p-column-single__body .btn-blue a::after,
.p-column-single__body .btn-yellow a::after {
  content: '';
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 10px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='10' viewBox='0 0 6 10' fill='none'%3E%3Cpath d='M1 1l4 4-4 4' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;
}
.p-column-single__body .btn-blue a {
  background: #014DA7;
  border: 2px solid #014DA7;
}
.p-column-single__body .btn-yellow a {
  background: #F5A623;
  border: 2px solid #F5A623;
}

/* ボタン（オレンジ/ピンク） */
.p-column-single__body .btn-orange a,
.p-column-single__body .btn-pink a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  max-width: 282px;
  margin: 0 auto;
  height: 58px;
  border-radius: 8px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
  text-decoration: none;
  background: #B5272D;
  border: 2px solid #B5272D;
}
.p-column-single__body .btn-orange a::after,
.p-column-single__body .btn-pink a::after {
  content: '';
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 10px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='10' viewBox='0 0 6 10' fill='none'%3E%3Cpath d='M1 1l4 4-4 4' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;
}

/* 横並びボタン */
.p-column-single__body .btns-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  margin: 20px 0 0;
}
.p-column-single__body .btns-area .btn-blue,
.p-column-single__body .btns-area .btn-yellow,
.p-column-single__body .btns-area .btn-orange,
.p-column-single__body .btns-area .btn-pink {
  margin: 0;
}

/* ----- 関連記事 ----- */
.p-column-related {
  background: #F8F9FA;
  padding: 40px 0;
}
.p-column-related__inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
}
.p-column-related__title {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 24px;
  color: #333;
}

/* ----- トップページ コラム出力 ----- */
.p-column-top {
  padding: 40px 0;
}
.p-column-top__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}
.p-column-top__title {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 24px;
  color: #333;
}
.p-column-top__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.p-column-top__more {
  display: block;
  text-align: center;
  margin-top: 24px;
  color: #014DA7;
  font-size: 14px;
  font-weight: 600;
}
.p-column-top__more:hover {
  text-decoration: underline;
}

/* ----- レスポンシブ ----- */
@media (max-width: 768px) {
  .p-column-archive__inner,
  .p-column-top__inner {
    padding: 0 16px;
  }
  .p-column-archive__list,
  .p-column-related__list,
  .p-column-top__list {
    gap: 16px;
  }
  .p-column-archive__title {
    font-size: 20px;
  }
  .p-column-single__title {
    font-size: 20px;
  }
  .p-column-single__body h2 {
    font-size: 18px;
    margin: 32px 0 12px;
  }
  .p-column-single__body h3 {
    font-size: 16px;
  }
}