@charset "utf-8";

/* 当方見聞録用 追加スタイル */

/* 見出し: 左右に余白を追加 */
.content-memoirs-header {
  padding-left: 10px;
  padding-right: 10px;
}

@media screen and (max-width: 640px) {
  /* ボックス内余白を縮小 */
  .content-memoirs-inner {
    padding: 10px;
  }

  /* 掲載号ラベル: absolute解除(padding縮小によるタイトルとの重なり防止) */
  .content-memoirs-date {
    position: static;
    width: fit-content;
    margin-left: auto;
    margin-bottom: 10px;
  }

  /* レイアウト用テーブルを解除して縦積みに */
  .content-memoirs-text table {
    display: block;
    float: none;
    width: 100% !important; /* main.css の width:auto!important を読み込み順で上書き */
    margin: 0 0 15px;
  }
  .content-memoirs-text tbody,
  .content-memoirs-text tr {
    display: block;
  }
  .content-memoirs-text td {
    display: block;
    width: auto !important;
    padding: 0 !important; /* cellpadding属性・.pl20等のユーティリティを無効化 */
  }

  /* 画像: float解除して幅100%表示 */
  .content-memoirs-text img {
    float: none;
    display: block;
    width: 100%;
    height: auto;
    margin: 0 0 10px;
  }

  /* キャプション下に余白 */
  .content-memoirs-text .caption {
    margin-bottom: 15px;
  }
}

/* 章カード一覧(一覧ページ・下層ページの全章メニュー共通): グリッド化して高さを揃える */
.layout-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 0; /* カード用margin前提の -10px を解除 */
}
.layout-two::after {
  content: none; /* inline-block用clearfixが空のグリッドアイテムになるのを防止 */
}
.layout-two .layout-item {
  width: auto; /* main.css の width:50% を解除(セル幅いっぱいに) */
}
.layout-two .layout-item > div,
.layout-two .layout-item:nth-child(2n-1) > div {
  margin: 0; /* カード間余白は gap に置き換え */
}
.memoirs-box {
  height: 100%;
  box-sizing: border-box; /* height:100% に padding/border を含め、セルからのはみ出しを防止 */
}

@media screen and (max-width: 640px) {
  .layout-two {
    row-gap: 5px;
  }
}