/* 今日どこいく？ 記事の本文の途中の関連記事（inc/hk-db-kr.php・2026-11-07）
   card＝aumo「あわせて読む」／rail＝るるぶ&more.「人気記事トップ10はコチラ！」／band＝SUUMOジャーナル「あわせて読みたい関連記事」
   寸法と色は3サイトを実際に開いて測った値（2026-11-07）。本文のリンクの青と下線・段落の余白に負けないよう .hkkr.hkkr で書く */
.k-ain .ai-body .hkkr.hkkr{margin:30px 0 36px;padding:0;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;font-size:14px;line-height:1.5;letter-spacing:0;color:#444;text-align:left;clear:both}
.k-ain .ai-body .hkkr.hkkr a{color:inherit;text-decoration:none;background:none;border:0;box-shadow:none}
.k-ain .ai-body .hkkr.hkkr a:focus-visible{outline:3px solid #1D4FA6;outline-offset:2px}
.k-ain .ai-body .hkkr.hkkr p{display:block;margin:0;padding:0;font-size:inherit;line-height:inherit;color:inherit;background:none;border:0}
.k-ain .ai-body .hkkr.hkkr img{display:block;margin:0;padding:0;max-width:none;border:0;box-shadow:none;object-fit:cover}

/* card（aumo型）：白地・枠1px #DDD・角丸8px・余白16px・写真72px角・ラベル12px太字・題14px（PCはラベル14px・題16px） */
.k-ain .ai-body .hkkr-card.hkkr .hkkr-card__a{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid #ddd;border-radius:8px;padding:16px;color:#444}
.k-ain .ai-body .hkkr-card.hkkr .hkkr-card__img{flex:none;width:72px;height:72px;border-radius:4px}
.k-ain .ai-body .hkkr-card.hkkr .hkkr-card__tx{display:flex;flex-direction:column;gap:6px;min-width:0}
.k-ain .ai-body .hkkr-card.hkkr .hkkr-card__lb{font-size:12px;line-height:16px;font-weight:700;color:#444}
.k-ain .ai-body .hkkr-card.hkkr .hkkr-card__t{font-size:14px;line-height:20px;font-weight:400;color:#444;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.k-ain .ai-body .hkkr-card.hkkr .hkkr-card__a:hover .hkkr-card__t{text-decoration:underline}

/* rail（るるぶ&more.型）：見出し18px・写真120px角・角丸8px・番号の丸32px #A9995A・題12px・カテゴリ11px #888。スマホは指で横に流す */
.k-ain .ai-body .hkkr-rail.hkkr{color:#000}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__logo{text-align:center;font-size:17px;line-height:21px;font-weight:900;color:#16232D;letter-spacing:.02em}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__logo span{color:#E8364F}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__h{text-align:center;font-size:18px;line-height:40px;font-weight:600;color:#000}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__row{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:12px -20px 0;padding:0 20px 6px;scroll-padding:0 20px}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__row::-webkit-scrollbar{display:none}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__a{flex:none;width:120px;display:flex;flex-direction:column;scroll-snap-align:start;color:#000}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__ph{position:relative;display:block;width:120px;height:120px}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__img{width:120px;height:120px;border-radius:8px}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__no{position:absolute;top:8px;left:8px;width:32px;height:32px;border-radius:40px;background:#A9995A;color:#fff;font-size:14px;line-height:20px;font-weight:700;display:flex;align-items:center;justify-content:center}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__t{margin-top:10px;font-size:12px;line-height:17px;font-weight:400;color:#000;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__c{font-size:11px;line-height:20px;color:#888}
.k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__a:hover .hkkr-rail__t{text-decoration:underline}

/* band（SUUMOジャーナル型）：帯 #323232・白の太字。スマホは端から端までの帯の下に写真112×70と題15px太字を3本（点線で区切る）。
   PC は帯18px・写真を上にした4列（題13px太字・日付11px） */
.k-ain .ai-body .hkkr-band.hkkr{color:#333}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__h{width:auto;max-width:none;margin:0 -20px;padding:10px 20px;background:#323232;color:#fff;font-size:12px;line-height:12px;font-weight:700}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__list{display:flex;flex-direction:column;margin:0 -10px}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__a{display:flex;gap:12px;align-items:flex-start;padding:14px 10px;color:#333}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__a + .hkkr-band__a{border-top:1px dotted #bbb}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__a:nth-child(n+4){display:none}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__img{flex:none;width:112px;height:70px}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__tx{display:block;min-width:0}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__t{display:block;font-size:15px;line-height:21px;font-weight:700;color:#333}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__d{display:none}
.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__a:hover .hkkr-band__t{text-decoration:underline}

/* 題は文節で折り返し、行末に1〜2字だけ残さない（対応していない端末ではふつうの折り返し） */
.k-ain .ai-body .hkkr.hkkr .hkkr-card__t,.k-ain .ai-body .hkkr.hkkr .hkkr-band__t,.k-ain .ai-body .hkkr.hkkr .hkkr-rail__t,.k-ain .ai-body .hkkr.hkkr .hkkr-rail__h{word-break:auto-phrase;text-wrap:pretty}

@media (min-width:700px){
  .k-ain .ai-body .hkkr-card.hkkr .hkkr-card__tx{gap:4px}
  .k-ain .ai-body .hkkr-card.hkkr .hkkr-card__lb{font-size:14px;line-height:20px}
  .k-ain .ai-body .hkkr-card.hkkr .hkkr-card__t{font-size:16px;line-height:28px}
  .k-ain .ai-body .hkkr-rail.hkkr .hkkr-rail__row{justify-content:center;margin:12px 0 0;padding:0 0 6px;overflow-x:visible}
  .k-ain .ai-body .hkkr-band.hkkr .hkkr-band__h{margin:0;padding:10px;font-size:18px;line-height:25px}
  .k-ain .ai-body .hkkr-band.hkkr .hkkr-band__list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:16px 0 0}
  .k-ain .ai-body .hkkr-band.hkkr .hkkr-band__a,.k-ain .ai-body .hkkr-band.hkkr .hkkr-band__a:nth-child(n+4){display:flex;flex-direction:column;gap:0;padding:0}
  .k-ain .ai-body .hkkr-band.hkkr .hkkr-band__a + .hkkr-band__a{border-top:0}
  .k-ain .ai-body .hkkr-band.hkkr .hkkr-band__img{width:100%;height:auto;aspect-ratio:170/105}
  .k-ain .ai-body .hkkr-band.hkkr .hkkr-band__tx{padding:10px 0 0}
  .k-ain .ai-body .hkkr-band.hkkr .hkkr-band__t{font-size:13px;line-height:20px}
  .k-ain .ai-body .hkkr-band.hkkr .hkkr-band__d{display:block;margin-top:4px;font-size:11px;line-height:14px;font-weight:700;color:#323232}
}
