/* サイトの中の記事の体裁（2026-10-29）。article_style.css（記事を1枚で出す時）と同じ見た目を、.ik-article の中だけに効かせ、
   余白・文字の大きさを tokens.css の変数に置き換えたもの。記事の見た目を変える時は両方を直す。 */
.ik-article { max-width: var(--container-narrow); margin: 0 auto; padding: 0 var(--s2) var(--s12); line-height: var(--lh-body); }
.ik-article .crumb { font-size: var(--fs-sm); color: var(--c-sub); margin: var(--s2) 0 0; }
.ik-article .crumb a { color: var(--c-sub); }
.ik-article h1 { font-size: var(--fs-2xl); line-height: var(--lh-tight); margin: var(--s1) 0; color: var(--c-main); }
.ik-article .by { font-size: var(--fs-sm); color: var(--c-sub); margin: 0 0 var(--s2); }
.ik-article h2 { font-size: var(--fs-lg); color: var(--c-main); border-left: var(--s1) solid var(--c-main); padding: calc(var(--s1) / 2) 0 calc(var(--s1) / 2) var(--s2);
  margin-top: var(--s6); background: var(--c-main-tint); }
.ik-article h3 { font-size: var(--fs-base); font-weight: 700; color: var(--c-main); margin: var(--s4) 0 var(--s1); border-bottom: 2px solid var(--c-main-tint); padding-bottom: calc(var(--s1) / 2); }
.ik-article figure { margin: var(--s2) 0 var(--s3); }
.ik-article figure img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius-lg); display: block; }
.ik-article figcaption { font-size: var(--fs-sm); color: var(--c-sub); margin-top: calc(var(--s1) / 2); }
.ik-article .how, .ik-article .toc { background: var(--c-main-tint); border-radius: var(--radius); padding: var(--s2) var(--s3); margin: var(--s3) 0; font-size: var(--fs-sm); }
.ik-article .how ul, .ik-article .toc ol { margin: calc(var(--s1) / 2) 0 0; padding-left: 1.3em; }
.ik-article .toc a { color: var(--c-main); }
.ik-article .sum { overflow-x: auto; }
.ik-article .sum table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); margin: var(--s2) 0; }
.ik-article .sum th, .ik-article .sum td, .ik-article .rooms th, .ik-article .rooms td { border: 1px solid var(--c-line); padding: var(--s1); text-align: left; vertical-align: top; }
.ik-article .sum thead th { background: var(--c-main); color: var(--c-on-main); font-weight: 700; }
.ik-article .sum tbody th a { color: var(--c-main); }
.ik-article .key { font-weight: 700; color: var(--c-main); margin: var(--s1) 0 var(--s2); }
.ik-article .info { font-size: var(--fs-sm); margin: var(--s2) 0 0; padding-top: var(--s1); border-top: 1px solid var(--c-line); }
.ik-article .info span { font-weight: 700; margin-right: .6em; }
.ik-article .miss { color: var(--c-sub); font-size: var(--fs-sm); margin: calc(var(--s1) / 2) 0 0; }
.ik-article .rooms { margin: var(--s1) 0 var(--s2); }
.ik-article .rooms table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.ik-article .rooms thead th { background: var(--c-main-tint); color: var(--c-main); }
.ik-article .rooms tbody th { width: 28%; font-weight: 700; }
.ik-article .cta { display: block; text-align: center; background: var(--c-accent); color: var(--c-on-accent); padding: var(--s2); border-radius: var(--radius);
  text-decoration: none; font-weight: 700; margin: var(--s2) 0 var(--s1); transition: filter var(--dur-fast) var(--ease); }
.ik-article .cta:hover { filter: brightness(.88); }
.ik-article .cta:focus-visible { outline: 3px solid var(--c-main); outline-offset: 2px; }
.ik-article .cta .sub { display: block; font-size: var(--fs-sm); font-weight: 400; margin-top: 2px; opacity: .9; }
.ik-article .purpose li { margin: var(--s1) 0; }
.ik-article .small { font-size: var(--fs-sm); color: var(--c-sub); }
.ik-article .src { font-size: var(--fs-sm); word-break: break-all; }
.ik-article .src a { color: var(--c-main); }
.ik-article .notice { font-size: var(--fs-sm); color: var(--c-sub); border-top: 1px solid var(--c-line); padding-top: var(--s1); margin-top: var(--s3); }
.ik-article .ig { margin: var(--s2) auto var(--s3); max-width: 420px; }
.ik-article .ig .instagram-media { margin: 0 !important; min-width: 0 !important; width: 100% !important; }
.ik-article .ig figcaption { font-size: var(--fs-sm); color: var(--c-sub); margin-top: calc(var(--s1) / 2); text-align: center; }
.ik-article .ig iframe { max-width: 100% !important; min-width: 0 !important; margin: 0 auto !important; }
.ik-article .ig { overflow: hidden; width: 100%; }
