/*
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
城ケ崎荘 (ユゲとチャップル用)
本文は vdl-penletter、ナビや共通部分は丸ゴ系システムフォント
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/

:root {
  --penletter: "vdl-penletter","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  --systemfont: "Hiragino Sans","Yu Gothic Medium","Yu Gothic","Meiryo",sans-serif;
}

/* ============================================================================
   全ページ共通：ナビ・メニュー・フッター → 丸ゴ系
   ========================================================================== */
:root {
  --nav-rounded: 
    "Hiragino Maru Gothic ProN", "ヒラギノ丸ゴ ProN",
    "Hiragino Maru Gothic Pro",  "ヒラギノ丸ゴ Pro",
    "M PLUS Rounded 1c", "Rounded Mplus 1c",
    "Meiryo", "メイリオ",
    "MS PGothic", "ＭＳ Ｐゴシック",
    sans-serif;
}

header,
#menubar,
nav, nav *,
#footermenu,
footer {
  font-family: var(--nav-rounded) !important;
  font-weight: 400;              /* 丸ゴは400で */
  letter-spacing: -0.02em;       /* 少し詰める */
  font-optical-sizing: none;     /* 可変フォントの自動調整を切る */
}

#menubar { font-size: 16px; } /* 必要に応じて調整 */
#menubar li a { letter-spacing: -0.0125em; }

/* ============================================================================
   yandc.html 専用：本文エリアを vdl-penletter で調整
   ========================================================================== */
body.yandc #contents {
  font-family: var(--penletter);
  font-weight: 500;
  font-size: 1.09em;       /* 大きさ */
  letter-spacing: -0.03em; /* 文字間を詰める */
  line-height: 1.8;        /* 行間 */
}

body.yandc h2 {
  font-weight: 500;
  font-size: 1.8em;       /* 大きさ */
  letter-spacing: -0.1em; /* 文字間を詰める */
  line-height: 1.8;        /* 読みやすい行間 */
}

/* PC (821px以上) */
.yandc .list-grid2 .list .text p {
  font-size: 18px;
  letter-spacing: -0.15em;
  line-height: 1.7;
}

/* iPad Air (820px以下) */
@media (max-width: 820px) {
  .yandc .list-grid2 .list .text p {
    font-size: 14px;
    letter-spacing: -0.05em;
  }
}

/* iPad mini・スマホ (768px以下で1列表示) */
@media (max-width: 768px) {
  .yandc .list-grid2 .list .text p {
    font-size: 19px;
    letter-spacing: -0.05em;
    white-space: nowrap;   /* ← 改行させない */
    overflow: hidden;      /* ← はみ出しを防止（必要なら） */
    text-overflow: ellipsis; /* ← 長すぎる場合は「…」に */
  }
}


/* セクション全体を中央配置 */
.room-episodes{
  margin: 0 auto;
  padding: 0 16px;
  text-align: center;
}

/* タイトルテーブル：幅100％でノーマルフォント */
.room-episodes .ta1{
  width: 100%;               /* ページ幅いっぱい */
  margin: 0 auto 0.75rem;
  border-collapse: collapse;
}
.room-episodes .ta1 caption{
  font-size: 1.4rem;
  font-weight: 400;          /* ノーマルウェイト */
  color: #004b36;
  line-height: 1.6;
}

/* 説明文：全幅表示・左揃え */
.room-episodes .lead{
  margin: 0.5rem auto 1.25rem;
  text-align: center;          /* テキスト左揃え */
  line-height: 1.9;
}

/* 画像リンク：中央寄せ＋最大800px */
.room-episodes .cta{
  display: inline-block;
  width: 100%;
  max-width: 800px;
}
.room-episodes .cta img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px 0 10px 0;
}


/* ===== ユゲとチャップル：行間を全体的にタイトに ===== */

/* 本文ベース（今: 1.8 → タイトに） */
body.yandc #contents{
  line-height: 1.58;     /* ← 全体の既定行間を詰める */
}

/* 段落＆リスト（本文よりさらに少し詰めたい時） */
body.yandc #contents p,
body.yandc #contents li,
body.yandc #contents .lr5,
body.yandc #contents .font_yandc {
  line-height: 1.55;
  margin-block: 0.45em 0.65em;  /* 段落間の余白も気持ちタイトに */
}

/* リード文（見栄えを少しだけ広めにして可読性キープ） */
.room-episodes .lead{
  line-height: 1.65;     /* 以前よりは詰めつつ、読みやすさ確保 */
  margin-block: 0.5rem 1rem;
}

/* 見出し（字間を詰めているので行間はしっかりタイトに） */
body.yandc h2{
  line-height: 1.24;     /* 1.8 → 1.24 に圧縮 */
  margin-bottom: 0.4em;  /* 余白も控えめに */
}

/* スマホでのバナー下コピー等（現在 nowrap 指定あり） */
@media (max-width: 768px){
  .yandc .list-grid2 .list .text p{
    line-height: 1.35;   /* 1行想定だが2行化した際の見栄え調整 */
    /* すでに text-overflow: ellipsis 指定あり */
  }
}

/* 文字詰めが強い見出しが潰れやすい場合の保険（必要なら） */
/* body.yandc h2 { letter-spacing: -0.06em; }  現状 -0.1em → 少し弱める */


/* ===== ユゲとチャップル：文字間（字間）をさらに少し詰める ===== */

/* 本文（全体） */
body.yandc #contents {
  letter-spacing: -0.04em;   /* もともと -0.03em → ほんの少し追い詰め */
}

/* 説明文系（lr5クラスなど細かい詰め） */
body.yandc #contents p,
body.yandc #contents li,
body.yandc #contents .lr5,
body.yandc #contents .font_yandc {
  letter-spacing: -0.05em;  /* 行間タイトに合わせて気持ち詰め */
}

/* サブ見出し（例: h2） → デザイン性重視なら強めに詰めてOK */
body.yandc h2 {
  letter-spacing: -0.12em;   /* -0.10 → -0.12（適度に詰め&引き締め） */
}

/* スマホでの長文は詰めすぎないほうが読みやすいので調整 */
@media (max-width: 640px) {
  body.yandc #contents,
  body.yandc #contents p,
  body.yandc h2 {
    letter-spacing: -0.03em;  /* ← 若干余裕を戻して可読性担保 */
  }
}

/* 特定エリアだけ強めに詰めたいとき用の簡易クラス */
.ls-tight { letter-spacing: -0.06em !important; }
.ls-normal{ letter-spacing: 0em !important; }

