/* ==================================================
   ニッポン書物遺産 2026
   旧HTMLの id / class を変更せず、新JK上で見た目だけ整える版
   Bootstrap / common.css / personal.css 読み込み済み前提
================================================== */

/* ----------------------------------------
   コーナー全体
---------------------------------------- */
#heritage {
  --heritage-navy: #0e364e;
  --heritage-navy-dark: #08283b;
  --heritage-border: var(--jk-border-color, #d8d8d5);
  --heritage-muted: var(--jk-text-sub-color, #626262);
  --heritage-bg: #f7f7f5;

  color: var(--jk-text-color, #222);
  background: var(--heritage-bg);
}

#heritage .wrap {
  width: min(100% - 2rem, 1016px);
  margin-right: auto;
  margin-left: auto;
}

/* ----------------------------------------
   コーナーKV
---------------------------------------- */
#heritage #mainimg {
  height: auto;
  min-height: 10rem;
  margin: 0;
  background:
    linear-gradient(rgba(3, 26, 42, .12), rgba(3, 26, 42, .12)),
    url("/articles/blogheritage/images/heritage_bg.png") center / cover no-repeat;
}

#heritage #mainimg .wrap {
  display: flex;
  align-items: center;
  min-height: 10rem;
}

#heritage #mainimg h1 {
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: left;
}

#heritage #mainimg h1 a {
  display: inline-block;
}

#heritage #mainimg h1 img {
  display: block;
  width: min(100%, 800px);
  height: auto;
}

#heritage #leadTxt {
  position: relative;
  margin: -3.4rem 0 0;
  padding: 0 0 1.1rem;
  color: #fff;
  background: transparent;
  z-index: 2;
}

#heritage #leadTxt p {
  max-width: 52rem;
  margin: 0;
  font-size: .875rem;
  line-height: 1.75;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .7);
}

/* ----------------------------------------
   パンくず
---------------------------------------- */
#heritage #breadcrumb {
  width: min(100% - 2rem, 1016px);
  margin: 0 auto;
  padding: 1rem 0 0;
  font-size: .875rem;
}

#heritage #breadcrumb p {
  margin: 0;
}

/* ----------------------------------------
   旧2カラムを1カラム化
---------------------------------------- */
#heritage #contents,
#heritage #contents.twoColumnRightPane {
  width: min(100% - 2rem, 1016px);
  margin: 0 auto;
  padding: .5rem 0 3rem;
}

#heritage #main,
#heritage .twoColumnRightPane #main {
  float: none;
  width: auto;
  padding: 0;
  background: transparent;
  border: 0;
}

#heritage #rightPane {
  float: none;
  width: auto;
  overflow: visible;
}

/* 旧右カラムにあった入会案内は、新共通CVがあるので非表示 */
#heritage #rightPane .nyukaiAnnai {
  display: none;
}

/* ----------------------------------------
   書物タイトル
---------------------------------------- */
#heritage #contents-title-field {
  width: 100%;
  margin: 0 0 1.25rem;
}

#heritage #contents-title-field .contents-subtitle {
  width: auto;
  margin: 0 0 .45rem;
  padding: 0;
  color: var(--heritage-muted);
  font-size: .9375rem;
}

#heritage #contents-title-field h2.contents-title {
  width: auto;
  height: auto;
  margin: 0;
}

#heritage #contents-title-field h2.contents-title span.contentsname {
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(1.75rem, 4vw, 2.4rem);
  font-weight: 700;
  line-height: 1.4;
  text-align: left;
}

/* ----------------------------------------
   書物紹介：本文＋画像
---------------------------------------- */
#heritage #contents-main-field {
  display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 500px);
  gap: 1.5rem 2.5rem;
  width: 100%;
  margin: 0;
}

/* 古い改行調整タグはレイアウトに不要 */
#heritage #contents-main-field > br {
  display: none;
}

#heritage #contents-main-field .contents-main-text {
  grid-column: 1;
  grid-row: 1;
  width: auto;
  padding: 0;
  font-size: 1rem;
  line-height: 1.9;
}

#heritage #contents-main-field .contents-main-text p {
  margin: 0;
}

#heritage #contents-main-field .contents-main-data {
  margin: 1.25rem 0 0;
  color: var(--heritage-muted);
  font-size: .875rem;
  text-align: left;
}

#heritage #contents-main-field .contents-main-photo {
  grid-column: 2;
  grid-row: 1;
  display: block !important;
  width: 100%;
  height: auto !important;
  min-height: 0;
  text-align: center;
}

#heritage .viewer {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
  overflow: hidden;
}

#heritage .viewer ul {
  position: static;
  width: 100%;
  margin: 0;
  padding: 0;
}

#heritage .viewer ul li {
  position: static;
  display: none;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* まずは旧JSがなくても1枚目は必ず見せる */
#heritage .viewer ul li:first-child {
  display: block;
  opacity: 1 !important;
}

#heritage .viewer ul li img {
  display: block;
  width: 100%;
  height: auto;
  box-sizing: border-box;
border:solid 1px #999;
}

#heritage #contents-main-field .contents-writer {
  grid-column: 1 / -1;
  width: auto;
  height: auto;
  margin: -.5rem 0 0;
  font-size: .8125rem;
  text-align: right;
}

/* ----------------------------------------
   episode導線
---------------------------------------- */
#heritage #contents-link-field {
  width: 100%;
  margin: 1.5rem 0 3rem;
}

#heritage #contents-link-field ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .5rem;
  margin: 0;
  padding: 0;
}

#heritage #contents-link-field ul > a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  margin: 0;
  padding: .65rem 1rem;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  background: var(--heritage-navy);
  border: 2px solid var(--heritage-navy);
  border-radius: .25rem;
}

#heritage #contents-link-field ul > a:hover,
#heritage #contents-link-field ul > a:focus-visible {
  color: var(--heritage-navy);
  background: #fff;
}

#heritage #contents-link-field ul > a li {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* ----------------------------------------
   書物データ
---------------------------------------- */
#heritage #booksdata-field {
  position: relative;
  display: grid;
  grid-template-columns: 14rem minmax(0, 1fr);
  gap: 1.5rem 2rem;
  width: 100%;
  margin: 1rem 0 2rem;
  padding: 3.25rem 1.5rem 1.5rem;
  background: #fff;
  border: 1px solid #777;
  border-radius: .4rem;
}

/* 旧HTMLの調整用brを無視 */
#heritage #booksdata-field > br {
  display: none;
}

#heritage #booksdata-field .booksdata-title {
  position: absolute;
  top: 0;
  left: 0;
  padding: .45rem .75rem;
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  background: #333;
  border-radius: .35rem 0 .35rem 0;
}

#heritage #booksdata-field .booksdata-cover {
  width: auto;
  margin: 0;
  text-align: center;
}

#heritage #booksdata-field .booksdata-cover p {
  margin: 0 0 .75rem;
}

#heritage #booksdata-field .booksdata-cover img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto .75rem;
}

#heritage #booksdata-field .booksdata-cover a {
  font-size: .875rem;
}

#heritage #booksdata-field .booksdata-text {
  width: auto;
  margin: 0;
  padding: 0;
  font-size: .9375rem;
  line-height: 1.85;
}

#heritage #booksdata-field .booksdata-text p {
  margin: 0;
}

/* ----------------------------------------
   バックナンバー：旧右メニューを下部カード化
---------------------------------------- */
#heritage #rightPane .menuInner {
  width: auto;
  margin: 0;
}

#heritage #rightPane .backNumList {
  margin: 0;
}

#heritage #rightPane .menuTitle {
  height: auto;
  margin: 0 0 1rem;
  padding: 0;
  color: var(--jk-text-color, #222);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
  background: transparent;
  border-radius: 0;
}

#heritage #backnumber-field {
  width: 100%;
  margin: 0 0 1.5rem 0 ;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

#heritage #backnumber-field .backnumber-data {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  padding: 0;
  overflow: visible;
}

#heritage #backnumber-field .backnumber-data > br,
#heritage #backnumber-field .backnumber-data > hr {
  display: none;
}

#heritage #backnumber-field .backnumber-contents {
  display: grid;
  grid-template-columns: 4.375rem minmax(0, 1fr);
  gap: .5rem 1rem;
  align-content: start;
  margin: 0;
  padding: 1rem;
  overflow: visible;
  background: #fff;
  border: 1px solid var(--heritage-border);
  border-radius: .35rem;
}

#heritage #backnumber-field .backnumber-cover {
  grid-column: 1;
  grid-row: 1;
  float: none;
  width: auto;
  margin: 0;
}

#heritage #backnumber-field .backnumber-cover img {
  display: block;
  width: 4.375rem;
  height: 5.625rem;
  object-fit: contain;
  background: #fff;
  border: 1px solid #b8b8b8;
}

#heritage #backnumber-field .backnumber-list {
  grid-column: 2;
  grid-row: 1;
  float: none;
  width: auto;
  padding: 0;
  overflow: visible;
  font-size: .8125rem;
  line-height: 1.5;
}

#heritage #backnumber-field .backnumber-list > a:first-child {
  display: block;
  margin-bottom: .25rem;
  color: var(--heritage-navy);
  font-size: 1rem;
  line-height: 1.4;
  text-decoration: none;
}

#heritage #backnumber-field .backnumber-list > a:first-child:hover,
#heritage #backnumber-field .backnumber-list > a:first-child:focus-visible {
  text-decoration: underline;
}

#heritage #backnumber-field .backnumber-text {
  grid-column: 1 / -1;
  display: -webkit-box;
  width: auto;
  margin: 0;
  padding: 0;
  overflow: hidden;
  font-size: .8125rem;
  line-height: 1.6;
  text-align: left;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

#heritage #pageTopFiled {
  width: auto;
  margin: 1.5rem 0 0;
}

/* 旧フォントサイズclassは新画面では極端に小さくしない */
#heritage .fontLL { font-size: 1.5rem; }
#heritage .fontL  { font-size: 1.125rem; }
#heritage .fontM  { font-size: 1rem; }
#heritage .fontS  { font-size: .875rem; }

/* ----------------------------------------
   レスポンシブ
---------------------------------------- */
@media (max-width: 991.98px) {
  #heritage #contents-main-field {
    grid-template-columns: 1fr;
  }

  #heritage #contents-main-field .contents-main-text,
  #heritage #contents-main-field .contents-main-photo {
    grid-column: 1;
  }

  #heritage #contents-main-field .contents-main-text {
    grid-row: auto;
  }

  #heritage #contents-main-field .contents-main-photo {
    grid-row: auto;
  }

  #heritage #booksdata-field {
    grid-template-columns: 12rem minmax(0, 1fr);
  }

  #heritage #backnumber-field .backnumber-data {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  #heritage #mainimg,
  #heritage #mainimg .wrap {
    min-height: 8rem;
  }

  #heritage #leadTxt {
    margin-top: -2.7rem;
  }

  #heritage #leadTxt p {
    font-size: .75rem;
  }

  #heritage #contents,
  #heritage #contents.twoColumnRightPane {
    padding-top: 1rem;
    padding-bottom: 2.5rem;
  }

  #heritage #contents-link-field ul {
    grid-template-columns: 1fr;
  }

  #heritage #booksdata-field {
    grid-template-columns: 1fr;
    padding-right: 1rem;
    padding-left: 1rem;
  }

  #heritage #booksdata-field .booksdata-cover {
    max-width: 22rem;
    margin: 0 auto;
  }
}
@media (max-width: 799px) {
.heritageBreadcrumb {
    margin: 1rem 0 1.5rem;
    font-size: .75rem !important;
}
}

@media (max-width: 575.98px) {
  #heritage #leadTxt {
    display: none;
  }
  #heritage #backnumber-field .backnumber-data {
    grid-template-columns: 1fr;
  }
.heritageBreadcrumb {
    margin: 1rem 0 1.5rem;
    font-size: .55rem !important;
}
}
.heritageBreadcrumb {
  margin: 1rem 0 1.5rem;
  font-size: .875rem;
}
#heritage #mainimg {
color:#fff;
font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
font-weight:bold;
    min-height: 160px;
    background:
        url("/articles/blogheritage/images/heritage_bg.png")
        center center / cover no-repeat;
}
#mainimg {
  background: url("/articles/blogheritage/images/heritage_bg.png") center center / cover no-repeat;
  min-height: 210px;
  position: relative;
  overflow: hidden;
}

/* 左側だけ少し暗くして文字を読みやすくする */
#mainimg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0.42) 0%,
    rgba(0, 0, 0, 0.25) 35%,
    rgba(0, 0, 0, 0.08) 60%,
    rgba(0, 0, 0, 0) 100%
  );
  pointer-events: none;
}

#mainimg .wrap {
  position: relative;
  z-index: 1;
  min-height: 210px;
  display: flex;
  align-items: center;
}

.heritageKvCopy {
  max-width: 560px;
  padding: 1.5rem 0;
}

.heritageKvTitle {
  margin: 0 0 1rem auto;
  color: #fff;
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
 font-size: clamp(1.8rem, 3.4vw, 2.6rem);
  font-weight: 600;
  line-height: 1.2;
letter-spacing: .02em;
text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
}

.heritageKvLead {
  max-width: 42rem;
  margin: 1rem 0 0 0 ;
  color: #fff;
  font-size: .8rem;
  font-weight: normal;
  line-height: 1.7;text-shadow: 0 2px 8px rgba(0, 0, 0, 0.99);
}
@media (max-width: 767.98px) {
  #mainimg,
  #mainimg .wrap {
    min-height: 150px;
  }

  .heritageKvCopy {
    max-width: 100%;
    padding: 1rem 0;
  }

  .heritageKvTitle {
    margin-bottom: 0.6rem;
    font-size: 2rem;
  }

  .heritageKvLead {
    font-size: 0.82rem;
    line-height: 1.7;
  }
}

/* ==================================================
   記事ページ
   旧HTMLの id / class をなるべく維持して整える
================================================== */

#heritage #contents-title-field .contents-serial {
  display: inline-block;
  margin-left: .75rem;
  color: var(--heritage-muted);
  font-family: inherit;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
}

#heritage #mainfield {
  width: 100%;
  max-width: 58rem;
  margin: 0 auto;
  padding: 0;
  font-size: 1rem;
  line-height: 1.9;
}

#heritage #mainfield > br {
  display: none;
}

#heritage #mainfield > p {
  margin: 0 0 1.25rem;
  padding-left: 3em;
  text-indent: -3em;
  line-height: 1.9;
  text-align: left;
}

#heritage #mainfield > p strong {
  font-weight: 700;
  white-space: nowrap;
}

#heritage #mainfield div.intr {
    margin: 10px auto;
    padding: 0.5rem 1rem 1rem 0.8rem;
    color: #fff;
    background-color: #2c2620;
    text-align: justify;
    text-justify: inter-character;
    height: auto;
    display: inline-block;
    border-radius: 4px;
}

#heritage #mainfield h3 {
  clear: both;
  margin: 3rem 0 1.25rem;
  padding: .2rem 0 .6rem .85rem;
  color: var(--jk-text-color, #222);
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  font-weight: 700;
  line-height: 1.5;
  background: none;
  border-left: 4px solid var(--heritage-navy);
  border-bottom: 1px solid var(--heritage-border);
}

#heritage #mainfield blockquote,
#heritage #mainfield .interviewQuestion {
  margin: 1rem 0 1.5rem;
  padding: .9rem 1rem;
  color: var(--heritage-navy-dark);
  font-weight: 600;
  line-height: 1.7;
  background: #eef4f7;
  /*border-left: 4px solid var(--heritage-navy);*/
  clear: both;
}

#heritage #mainfield img {
  max-width: 100%;
  height: auto;
}

#heritage #mainfield img.img_h {
  float: right !important;
  width: auto;
  max-width: min(40%, 350px);
  height: auto !important;
  margin: .5rem 0 1.25rem 1.5rem !important;
  border: 1px solid #aaa !important;
}

#heritage #mainfield img.img {
  display: block;
  float: none !important;
  width: auto;
  max-width: 100%;
  height: auto !important;
  margin: 1.5rem auto !important;
  border: 1px solid #aaa !important;
}

#heritage #mainfield div.interview span a,
#heritage #mainfield span a,
#heritage #mainfield blockquote a {
    vertical-align: super;
    font-size: .75rem;
}

#heritage #mainfield ul li {
    text-indent: -2em;
    line-height: 150%;
    margin: 1rem;
    padding: .5rem 2rem;
    border-radius: 4px;
font-size:.875rem;
}

#heritage #mainfield .navi {
  clear: both;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .75rem;
  margin: 2.5rem 0 0;
}

#heritage #mainfield .navi .prev,
#heritage #mainfield .navi .next {
  float: none;
  width: auto !important;
  margin: 0;
  padding: 0;
  text-align: initial !important;
}

#heritage #mainfield .navi .prev:empty,
#heritage #mainfield .navi .next:empty {
  display: none;
}

#heritage #mainfield .navi a {
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  padding: .55rem 1rem;
  color: var(--heritage-navy);
  font-weight: 700;
  text-decoration: none;
  background: #fff;
  border: 1px solid var(--heritage-navy);
  border-radius: .25rem;
}

#heritage #mainfield .navi a:hover,
#heritage #mainfield .navi a:focus-visible {
  color: #fff;
  background: var(--heritage-navy);
}

#heritage #mainfield .img-float {
float: right !important;
margin-left:1rem;
}

#heritage .freespacefield {
  width: min(100%, 58rem);
  margin: 2.5rem auto;
  padding: 1.5rem;
  text-align: center;
  background: #f4f7f8;
  border: 1px solid var(--heritage-border);
  border-radius: .4rem;
}

#heritage .freespacefield > br {
  display: none;
}

#heritage .freespacefield img {
  display: block;
  max-width: 100%;
  width: auto;
  height: auto;
  margin: 1.5rem auto .6rem;
  border: 1px solid #aaa;
}

#heritage .freespacefield img:first-of-type {
  margin-top: 0;
}

#heritage .freespacefield p {
  width: min(100%, 40rem);
  margin: 0 auto 1.5rem;
  padding: 0;
  color: var(--heritage-muted);
  font-size: .875rem;
  line-height: 1.7;
  text-align: left;
}

.freespacefield2 {
background-color:#fff4f8;
/*background-image: url("/articles/blogheritage/images/hrtg_edo.jpg");*/
background-repeat: no-repeat;
background-position: center top;
border:double 3px #cc0000;
padding:10px;
margin:2rem;
text-align:center;
border-radius: .5rem;
}

.freespacefield2 p {
font-size:.875rem;
line-height:130%;
margin:0;
padding:0;
text-align:left;
color:#003333;
}

#heritage #profilefield {
  width: min(100%, 58rem);
  margin: 2.5rem auto 2.5rem;
  padding: 1.5rem;
  background: #fff;
  border-top: 2px solid var(--heritage-navy);
  border-bottom: 2px solid var(--heritage-navy);
}

#heritage #profilefield > br,
#heritage #profilefield > br[clear] {
  display: none;
}

#heritage #profilefield .profile {
    display: flow-root;
    width: 100%;
    margin: auto;
    padding: 0;
    font-weight: 700;
}

#heritage #profilefield .profile + .profile {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--heritage-border);
}

#heritage #profilefield .profile img {
  float: left !important;
  width: min(25%, 9rem) !important;
  height: auto !important;
  margin: 0 1.25rem .75rem 0 !important;
  border: 1px solid #aaa;
}

#heritage #profilefield .profile p {
  margin: .5rem 0 0;
  font-size: .9375rem;
  font-weight: 400;
  line-height: 1.8;
}

@media (max-width: 767.98px) {
  #heritage #contents-title-field .contents-serial {
    display: block;
    margin: .25rem 0 0;
    font-size: .9375rem;
  }

  #heritage #mainfield {
    max-width: 100%;
  }

  #heritage #mainfield > p {
    padding-left: 0;
    text-indent: 0;
  }

  #heritage #mainfield > p strong {
    display: inline-block;
    margin-right: .35em;
  }

  #heritage #mainfield h3 {
    margin-top: 2.25rem;
  }

  #heritage #mainfield img.img_h {
    display: block;
    float: none !important;
    width: auto;
    max-width: min(100%, 22rem);
    margin: 1.25rem auto !important;
  }

  #heritage #mainfield .navi {
    flex-direction: column;
  }

  #heritage #mainfield .navi .prev,
  #heritage #mainfield .navi .next,
  #heritage #mainfield .navi a {
    width: 100% !important;
  }

  #heritage #mainfield .navi a {
    justify-content: center;
  }

  #heritage .freespacefield,
  #heritage #profilefield {
    width: 100%;
    padding: 1rem;
  }
#heritage #profilefield .profile {
    margin: .5rem auto 1.5rem auto;
}

  #heritage #profilefield .profile img {
    width: 7rem !important;
  }
}

@media (max-width: 575.98px) {
  #heritage #profilefield .profile img {
    display: block;
    float: none !important;
    width: 7rem !important;
    margin: 0 auto 1rem !important;
  }
}
#heritage #contents-link-field ul > a.active,
#heritage #contents-link-field ul > a[aria-current="page"] {
  color: var(--heritage-navy);
  background: #fff;
  border-color: var(--heritage-navy);
}