@charset "UTF-8";
/* =========================================================
   KUMIKI LOWER（下層ページ共通）
   Breakpoints : PC >= 1025px / Tablet 744-1024px / SP <= 743px
   ========================================================= */

/* =========================================================
   Page header（ページメインタイトル）
   見出しは common.css の .c-heading / .c-heading__ja をそのまま使用
   （トップ .p-problem__body の見出しと同じサイズ・下線）
   中央揃えのみここで指定
   ========================================================= */
.p-lower { padding: 50px 0 90px; }
.p-lower__head { margin-bottom: 60px; text-align: center; }
.p-lower__head .c-heading__ja::after { margin-inline: auto; }

/* 1025〜1200px：トップの .p-problem と同じく見出しを少し小さく */
@media (min-width: 1025px) and (max-width: 1200px) {
  .p-lower__head .c-heading__ja { font-size: 32px; }
}
@media (max-width: 1024px) {
  .p-lower { padding: 56px 0 72px; }
  .p-lower__head { margin-bottom: 48px; }
}
@media (max-width: 743px) {
  .p-lower { padding: 32px 0 45px; }
  .p-lower__head { margin-bottom: 28px; }
}

/* 旧サイトのコンテンツをそのまま入れるページ（料金など）
   旧コンテンツ側の h2 に上余白があり、最後は背景色付きのエリアで終わるため上下を詰める */
.p-lower--old { padding-bottom: 0; }
.p-lower--old .p-lower__head { margin-bottom: 0; }

/* =========================================================
   Definition table（特定商取引法表記など：項目／内容の2列表）
   ========================================================= */
.p-table {
  width: 100%;
  max-width: 900px;
  margin-inline: auto;
  border-collapse: collapse;
  border: 1px solid var(--c-line);
  font-size: 15px;
  line-height: 1.8;
}
.p-table th,
.p-table td {
  padding: 23px 32px;
  border-bottom: 1px solid var(--c-line);
  text-align: left;
  vertical-align: middle;
}
.p-table th {
  width: 30%;
  background: var(--c-bg-gray);
  border-right: 1px solid var(--c-line);
  font-weight: 500;
}
.p-table td { background: #fff; }
.p-table a { transition: color .3s; }
.p-table a:hover { color: var(--c-blue); text-decoration: underline; }

@media (max-width: 1024px) {
  .p-table th, .p-table td { padding: 20px 24px; }
}
/* SP：項目（グレー）→ 内容 の縦積み */
@media (max-width: 743px) {
  .p-table { font-size: 14px; line-height: 1.75; }
  .p-table tbody, .p-table tr, .p-table th, .p-table td { display: block; width: 100%; }
  .p-table th { padding: 10px 16px; border-right: none; font-weight: 700; }
  .p-table td { padding: 14px 16px 16px; }
}
