/* =========================================================
   ④ ショートクルーズ3つの事例 専用CSS
   既存サイト共通CSSから隔離する。
   ========================================================= */

#short-cruise-examples{
  background:#fff;
  color:#111;
  padding:34px 0 20px !important;
  font-family:"Yu Gothic","Hiragino Kaku Gothic ProN","Meiryo",sans-serif !important;
  line-height:1.5 !important;
}
#short-cruise-examples, #short-cruise-examples *{box-sizing:border-box}

#short-cruise-examples .sc-wrap{
  width:min(1600px,calc(100% - 36px));
  margin:0 auto;
}

#short-cruise-examples .sc-header{text-align:center}

#short-cruise-examples .sc-title{
  margin:0 !important;
  color:#102D67 !important;
  font-family:"Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif !important;
  font-size:55px !important;
  font-weight:700 !important;
  line-height:1.18 !important;
  letter-spacing:.02em !important;
  text-align:center !important;
}

#short-cruise-examples .sc-ornament{
  display:flex;
  align-items:center;
  gap:18px;
  width:92%;
  margin:11px auto 9px;
  color:#C9A55E;
}
#short-cruise-examples .sc-ornament::before,
#short-cruise-examples .sc-ornament::after{
  content:"";
  height:1px;
  background:#C9A55E;
  flex:1;
}
#short-cruise-examples .sc-ornament span{
  font:700 20px/1 serif;
  white-space:nowrap;
}
#short-cruise-examples .sc-lead{
  margin:0 auto 15px !important;
  color:#102D67 !important;
  font-family:"Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif !important;
  font-size:25px !important;
  font-weight:700 !important;
  line-height:1.4 !important;
  text-align:center !important;
}

/* 3カード */
#short-cruise-examples .sc-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
#short-cruise-examples .sc-card{
  --c:#0E3A84;
  --pale:#F7FAFF;
  display:grid;
  grid-template-rows:
    69px 42px 166px 53px 35px 80px 28px 133px 93px;
  min-width:0;
  background:#fff;
  border:1px solid var(--c);
  border-radius:12px;
  overflow:hidden;
}
#short-cruise-examples .sc-card--blue{--c:#0E3A84;--pale:#F7FAFF}
#short-cruise-examples .sc-card--green{--c:#1F6C1F;--pale:#F8FDF5}
#short-cruise-examples .sc-card--pink{--c:#C43B67;--pale:#FFF8FB}

#short-cruise-examples .sc-card-head{
  display:grid;
  grid-template-columns:69px 1fr;
  align-items:center;
  padding:9px 20px 0;
}
#short-cruise-examples .sc-num{
  width:55px;
  height:55px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--c);
  color:#fff;
  font-size:28px;
  font-weight:700;
}
#short-cruise-examples .sc-card-head h3{
  margin:0 !important;
  color:var(--c) !important;
  font-family:"Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif !important;
  font-size:30px !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  text-align:left !important;
}

#short-cruise-examples .sc-badge{
  align-self:center;
  justify-self:center;
  min-width:232px;
  padding:4px 20px;
  border-radius:18px;
  background:var(--c);
  color:#fff;
  font-size:17px;
  font-weight:700;
  text-align:center;
}
#short-cruise-examples .sc-disney{
  position:absolute;
  margin:0;
  transform:translateY(102px);
  width:100%;
  color:#C43B67;
  font-family:Georgia,"Times New Roman",serif;
  font-size:20px;
  font-style:italic;
  font-weight:700;
  text-align:center;
  pointer-events:none;
}
#short-cruise-examples .sc-card{position:relative}

#short-cruise-examples .sc-ship{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
  background:#fff;
}
#short-cruise-examples .sc-route{
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--c);
  color:#fff;
  font-size:24px;
  font-weight:700;
  white-space:nowrap;
}
#short-cruise-examples .sc-price-note{
  margin:0 !important;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:17px !important;
  font-weight:700 !important;
  color:#102D67 !important;
}
#short-cruise-examples .sc-price{
  margin:0 !important;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--c) !important;
  font-family:"Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif !important;
  font-size:53px !important;
  font-weight:700 !important;
}
#short-cruise-examples .sc-small{
  margin:0 !important;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#102D67 !important;
  font-size:14px !important;
  font-weight:700 !important;
  text-align:center !important;
}
#short-cruise-examples .sc-points{
  list-style:none !important;
  margin:0 !important;
  padding:11px 29px 0 38px !important;
  font-size:19px !important;
  line-height:1.55 !important;
  color:#102D67 !important;
  font-weight:700 !important;
}
#short-cruise-examples .sc-points li{
  position:relative;
  margin:0 0 3px !important;
  padding-left:31px !important;
}
#short-cruise-examples .sc-points li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  width:24px;
  height:24px;
  border:1px solid var(--c);
  border-radius:50%;
  color:var(--c);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
}
#short-cruise-examples .sc-fit{
  margin:0 20px 15px;
  padding-top:9px;
  border-top:1px solid #DDD;
  color:var(--c);
  text-align:center;
}
#short-cruise-examples .sc-fit strong{
  display:block;
  font-size:18px;
}
#short-cruise-examples .sc-fit span{
  display:block;
  margin-top:4px;
  font-size:27px;
  font-weight:700;
}

/* 下段 */
#short-cruise-examples .sc-bottom-title{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  margin:15px 0 9px !important;
  color:#102D67 !important;
  font-family:"Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif !important;
  font-size:30px !important;
  font-weight:700 !important;
}
#short-cruise-examples .sc-bottom-title::before,
#short-cruise-examples .sc-bottom-title::after{
  content:"❦";
  color:#C9A55E;
  font-size:27px;
  font-weight:400;
}

#short-cruise-examples .sc-tips{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:13px;
}
#short-cruise-examples .sc-tip{
  display:grid;
  grid-template-columns:66px 1fr;
  grid-template-rows:53px 77px;
  align-items:center;
  min-height:138px;
  padding:11px 15px;
  border:1px solid #C9A55E;
  border-radius:10px;
  background:#fff;
}
#short-cruise-examples .sc-tip-num{
  width:44px;
  height:44px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#C9A55E;
  color:#fff;
  font-size:22px;
  font-weight:700;
}
#short-cruise-examples .sc-tip strong{
  font-family:"Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif;
  font-size:28px;
  color:#102D67;
}
#short-cruise-examples .sc-tip-icon{
  color:#102D67;
  font-size:31px;
  text-align:center;
}
#short-cruise-examples .sc-tip p{
  margin:0 !important;
  color:#102D67 !important;
  font-size:19px !important;
  line-height:1.4 !important;
  font-weight:700 !important;
}

#short-cruise-examples .sc-note{
  margin:13px 0 0 !important;
  color:#102D67 !important;
  font-size:15px !important;
  font-weight:700 !important;
  text-align:center !important;
}

@media(max-width:900px){
  #short-cruise-examples{padding:20px 0 14px !important}
  #short-cruise-examples .sc-wrap{width:calc(100% - 20px)}
  #short-cruise-examples .sc-title{font-size:34px !important}
  #short-cruise-examples .sc-lead{font-size:19px !important}
  #short-cruise-examples .sc-grid{
    grid-template-columns:repeat(3,440px);
    overflow-x:auto;
    padding-bottom:10px;
  }
  #short-cruise-examples .sc-tips{
    grid-template-columns:repeat(4,330px);
    overflow-x:auto;
    padding-bottom:10px;
  }
}

/* スマホ用に追加した要素は、PC版では非表示 */
#short-cruise-examples .sc-swipe-hint{ display:none; }

/* =========================================================
   スマートフォン専用（2026-08-28 最終UI調整）
   ・max-width:768px のみ。PC版（769px以上）は一切変更しない
   ・3事例を1画面1カードの横スワイプに（船カテゴリー／部屋選びと操作統一）
   ・行構成は固定のまま高さだけスマホ用に調整し、3枚の
     写真・船名・料金・向いている人の位置を完全に揃える
   ========================================================= */
@media(max-width:768px){

  /* セクション境界の余白（内部余白より広く） */
  #short-cruise-examples{ padding:28px 0 28px !important; }

  #short-cruise-examples .sc-title{
    font-size:23px !important;
    line-height:1.35 !important;
  }
  #short-cruise-examples .sc-ornament{ margin:12px auto 12px; }
  /* リード文はスマホでは非表示（PC版では従来どおり表示） */
  #short-cruise-examples .sc-lead{ display:none !important; }

  /* 1画面1カードの横スワイプ */
  #short-cruise-examples .sc-grid{
    grid-template-columns:repeat(3,100%);
    gap:14px;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    padding-bottom:10px;
  }
  #short-cruise-examples .sc-card{
    scroll-snap-align:start;
    grid-template-rows:
      56px    /* 番号＋船名 */
      34px    /* バッジ */
      128px   /* 船の写真 */
      46px    /* 発着・日数 */
      30px    /* 料金の注記 */
      56px    /* 料金 */
      26px    /* ※注記 */
      108px   /* ポイント3つ */
      70px;   /* 向いている人 */
  }
  /* 船名は中央揃え。番号は左端に重ねて配置する */
  #short-cruise-examples .sc-card-head{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:6px 58px 0;
  }
  #short-cruise-examples .sc-num{
    position:absolute;
    left:12px;
    top:50%;
    transform:translateY(-50%);
    width:42px;
    height:42px;
    font-size:21px;
  }
  #short-cruise-examples .sc-card-head h3{
    font-size:20px !important;
    line-height:1.25 !important;
    text-align:center !important;
  }
  /* バッジは小さくして船名のすぐ下へ */
  #short-cruise-examples .sc-badge{
    align-self:start;
    min-width:0;
    font-size:15px;
    padding:3px 14px;
  }
  #short-cruise-examples .sc-disney{ transform:translateY(90px); font-size:17px; }
  #short-cruise-examples .sc-route{ font-size:18px; }
  #short-cruise-examples .sc-price-note{ font-size:16px !important; }
  #short-cruise-examples .sc-price{ font-size:36px !important; }
  /* ※諸費用・チップ別 は小さくして右隅へ */
  #short-cruise-examples .sc-small{
    justify-content:flex-end !important;
    align-items:flex-start !important;
    font-size:13px !important;
    line-height:1.3 !important;
    padding:0 14px !important;
    text-align:right !important;
  }
  /* コメント3つは文字サイズはそのまま、余白だけ詰める */
  #short-cruise-examples .sc-points{
    padding:6px 14px 0 18px !important;
    font-size:18px !important;
    line-height:1.5 !important;
  }
  #short-cruise-examples .sc-points li{ margin:0 0 1px !important; padding-left:28px !important; }
  /* 向いている人も余白を詰める */
  #short-cruise-examples .sc-fit{ margin:0 16px 10px; padding-top:8px; }
  #short-cruise-examples .sc-fit strong{ font-size:16px; }
  #short-cruise-examples .sc-fit span{ font-size:22px; margin-top:4px; }

  /* スワイプ案内（本文より目立たせない補助情報） */
  #short-cruise-examples .sc-swipe-hint{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    margin:10px 0 0 !important;
    padding:9px 8px;
    border-radius:8px;
    background:#f6f9fc;
    color:#102D67;
    font-size:16px;
    line-height:1.5;
    font-weight:700;
    text-align:center;
  }

  /* 下段「初心者はここを見よう」：横スワイプをやめ、1項目=1行の縦並びに */
  #short-cruise-examples .sc-bottom-title{
    font-size:22px !important;
    line-height:1.4 !important;
    margin:20px 0 10px !important;
  }
  #short-cruise-examples .sc-tips{
    grid-template-columns:1fr;
    gap:8px;
    overflow-x:visible;
    padding-bottom:0;
  }
  #short-cruise-examples .sc-tip{
    grid-template-columns:36px 60px 24px 1fr;
    grid-template-rows:auto;
    align-items:center;
    column-gap:8px;
    min-height:54px;
    padding:8px 12px;
  }
  #short-cruise-examples .sc-tip-num{
    width:34px;
    height:34px;
    font-size:17px;
  }
  /* 見出しは3文字分の幅に均等割り付けし、説明文の左端を縦に揃える */
  #short-cruise-examples .sc-tip strong{
    width:100%;
    font-size:19px;
    line-height:1.2;
    text-align:justify;
    text-align-last:justify;
  }
  #short-cruise-examples .sc-tip-icon{ font-size:20px; }
  /* 説明文は小さめ・行間を詰めて、全体で1行分の高さに収める */
  #short-cruise-examples .sc-tip p{
    font-size:15px !important;
    line-height:1.2 !important;
  }

  /* 末尾の注記はスマホでは非表示（PC版では従来どおり表示） */
  #short-cruise-examples .sc-note{ display:none !important; }
}

/* =========================================================
   2026-09-05 追加：事例カードの船内紹介動画
   サムネイル→クリックでYouTubeを読み込む方式（表示速度を落とさない）
========================================================= */
#short-cruise-examples .sc-video{ margin-top:16px; }
#short-cruise-examples .sc-video__btn{
  display:block; position:relative; width:100%; padding:0; margin:0;
  border:0; background:#4a443c; border-radius:10px; overflow:hidden;
  text-decoration:none; -webkit-tap-highlight-color:transparent;
  aspect-ratio:16/9; cursor:pointer;
  box-shadow:0 2px 8px rgba(60,50,38,.14);
  transition:box-shadow .2s ease;
}
#short-cruise-examples .sc-video__btn img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .3s ease, opacity .2s ease;
}
#short-cruise-examples .sc-video__play{
  position:absolute; left:50%; top:50%; width:60px; height:42px;
  margin:-21px 0 0 -30px; border-radius:10px;
  background:rgba(40,34,28,.78);
  transition:background-color .2s ease;
}
#short-cruise-examples .sc-video__play::after{
  content:""; position:absolute; left:23px; top:12px;
  border-style:solid; border-width:9px 0 9px 15px;
  border-color:transparent transparent transparent #fff;
}
#short-cruise-examples .sc-video__btn:hover img{ transform:scale(1.03); opacity:.92; }
#short-cruise-examples .sc-video__btn:hover .sc-video__play{ background:#e8730f; }
#short-cruise-examples .sc-video__btn:focus-visible{ outline:3px solid #b08c4b; outline-offset:3px; }
#short-cruise-examples .sc-video__frame{
  display:block; width:100%; aspect-ratio:16/9; border:0; border-radius:10px;
}
#short-cruise-examples .sc-video__note{
  margin:8px 0 0; font-size:14px; line-height:1.5; color:#6f6154; text-align:center;
}
@media (max-width:768px){
  #short-cruise-examples .sc-video__note{ font-size:14px; }
  #short-cruise-examples .sc-video__play{ width:54px; height:38px; margin:-19px 0 0 -27px; }
  #short-cruise-examples .sc-video__play::after{ left:21px; top:11px; border-width:8px 0 8px 13px; }
}

/* ============================================================
   2026-09-05 追加：ショートクルーズ3事例の横スライドに気付いてもらう。
   ・カード幅を画面いっぱいから少し狭め、次のカードの端を見せる
   ・カードの上に「事例 n / 3」と左右ボタンを置く
   スマートフォン（768px以下）のみ。PC版は3列並びのため対象外。
   文言・色・カードの中身は変更していない。
   ============================================================ */
#short-cruise-examples .sc-nav{ display:none; }

@media(max-width:768px){
  #short-cruise-examples .sc-nav{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    margin:0 0 10px;
  }
  #short-cruise-examples .sc-nav__count{
    margin:0 !important;
    min-width:92px;
    font-size:17px;
    line-height:1.4;
    font-weight:700;
    color:#102D67;
    text-align:center;
  }
  #short-cruise-examples .sc-nav__count b{ font-size:20px; font-weight:700; }
  #short-cruise-examples .sc-nav__btn{
    flex:0 0 auto;
    width:44px; height:44px;
    padding:0;
    border:1px solid #c9d6e8;
    border-radius:50%;
    background:#f6f9fc;
    color:#102D67;
    font-size:26px;
    line-height:1;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    transition:background-color .2s ease, opacity .2s ease;
  }
  #short-cruise-examples .sc-nav__btn:disabled{ opacity:.3; cursor:default; }

  /* 2026-09-05 取り消し：カードを狭めて次のカードの端を見せる案は、
     船の写真（元画像 436×144px）の描画が368px→324pxに縮み、
     甲板や手すりがかすれて見えたため取りやめ。カード幅は従来どおり
     画面いっぱい（100%）に戻す。横スライドの手がかりは、上の
     「事例 n / 3」と左右ボタンで伝える。 */
}

/* ============================================================
   2026-09-06 更新：「おすすめ動画」セクション（#closing-video）。
   3事例の動画と見た目・仕組みをそろえる。クリックでYouTubeに差し替わる
   JavaScriptは既存のものをそのまま使うため、新しいJSは作っていない。
   ============================================================ */
#closing-video{
  background:#fff;
  color:#111;
  padding:30px 0 44px;
  font-family:"Yu Gothic","Hiragino Kaku Gothic ProN","Meiryo",sans-serif;
  line-height:1.5;
}
#closing-video, #closing-video *{ box-sizing:border-box; }
#closing-video .cv-wrap{ width:min(1280px,calc(100% - 36px)); margin:0 auto; }
#closing-video .cv-list{ display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:start; }
#closing-video .cv-src{ display:inline-block; }
#closing-video .cv-title{
  margin:0 0 18px;
  color:#102D67;
  font-family:"Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif;
  font-size:38px;
  font-weight:700;
  line-height:1.3;
  letter-spacing:.04em;
  text-align:center;
}
#closing-video .sc-video{ margin-top:0; }
#closing-video .sc-video__btn{
  display:block; position:relative; width:100%; padding:0; margin:0;
  border:0; background:#4a443c; border-radius:10px; overflow:hidden;
  text-decoration:none; -webkit-tap-highlight-color:transparent;
  aspect-ratio:16/9; cursor:pointer;
  box-shadow:0 2px 8px rgba(60,50,38,.14);
  transition:box-shadow .2s ease;
}
#closing-video .sc-video__btn img{ width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .3s ease, opacity .2s ease; }
#closing-video .sc-video__play{
  position:absolute; left:50%; top:50%; width:60px; height:42px;
  margin:-21px 0 0 -30px; border-radius:10px;
  background:rgba(40,34,28,.78);
  transition:background-color .2s ease;
}
#closing-video .sc-video__play::after{
  content:""; position:absolute; left:23px; top:12px;
  border-style:solid; border-width:9px 0 9px 15px;
  border-color:transparent transparent transparent #fff;
}
#closing-video .sc-video__btn:hover img{ transform:scale(1.03); opacity:.92; }
#closing-video .sc-video__btn:hover .sc-video__play{ background:#e8730f; }
#closing-video .sc-video__frame{
  display:block; width:100%; aspect-ratio:16/9; border:0; border-radius:10px;
}
#closing-video .sc-video__note{
  margin:12px 0 0; font-size:17px; line-height:1.6; color:#6f6154; text-align:center;
}

@media(max-width:768px){
  /* 画面下に固定されている「inCruisesを詳しく見る」の帯（高さ73px）に
     動画の説明文が隠れないよう、下に余白をとる */
  #closing-video{ padding:24px 0 calc(36px + 73px + env(safe-area-inset-bottom, 0px)); }
  #closing-video .cv-wrap{ width:calc(100% - 20px); }
  #closing-video .cv-list{ grid-template-columns:1fr; gap:24px; }
  #closing-video .cv-title{ font-size:22px; margin:0 0 12px; }
  #closing-video .sc-video__note{ font-size:14px; }
}

/* =========================================================
   2026-09-05 修正：3事例の船の位置がそろっていなかった。
   元画像3枚は縦横比がそれぞれ違う（436×144 / 448×144 / 410×118）ため、
   同じ枠に「contain」で収めると、上下中央に置かれた結果、船の喫水線が
   最大8px ばらついていた。横スワイプで船が上下に跳ねて見える原因。
   下端そろえ（object-position:center bottom）に変えて、3隻とも喫水線を
   枠の下端にそろえる。画像そのものは変更していない。
   スマートフォンのみ。PC版はこれまでどおり。
   ========================================================= */
@media(max-width:768px){
  /* 2026-09-06 修正：iPhone(iOS Safari)で船の画像が表示されなくなったため、
     同じ見た目のまま、確実に解釈される書き方に置き換える。
       ・object-position はキーワード(center bottom)ではなく百分率(50% 100%)で書く
       ・height は 100% ではなく、この行の実寸 128px を直接指定する
         （grid の行の高さに対する 100% を、iOS が 0 と解釈することがあるため）
     PC版・見た目には一切影響しない。 */
  #short-cruise-examples .sc-ship{
    height:128px !important;
    object-position:50% 100% !important;
  }
}

/* =========================================================
   2026-09-06 変更：3事例を横スワイプから「縦並び」へ。
   ・すぐ上の「初心者はここだけ確認」を折りたたんだことで、
     3事例がこの節のいちばん重要な中身になったため。
   ・縦に並べれば、下へスクロールするだけで3枚とも必ず目に入る。
     横スワイプに気付かない問題が原理的に起きなくなる。
   ・「事例 n / 3」と左右ボタン、スワイプ案内はCSSで非表示にする
     （HTMLからは削除していない。戻す場合はこのブロックを外すだけ）
   ・カード幅が画面いっぱいに戻るので、船の写真は元の大きさで表示される
   スマートフォンのみ。PC版（3列並び）はこれまでどおり。
   ========================================================= */
@media(max-width:768px){
  #short-cruise-examples .sc-grid{
    grid-template-columns:1fr;
    gap:26px;
    overflow-x:visible;
    overscroll-behavior-x:auto;
    scroll-snap-type:none;
    padding-bottom:0;
  }
  #short-cruise-examples .sc-card{ scroll-snap-align:none; }
  #short-cruise-examples .sc-nav{ display:none !important; }
  #short-cruise-examples .sc-swipe-hint{ display:none !important; }
}

/* --- 2026-09-06 追加：おすすめ動画セクションの見出し・リード・各動画の小見出し。
       今後動画が増えても並べられるよう、1本ずつに短い名前を付けている。 --- */
/* 見出しの下の飾り（他セクションと同じ意匠・同じ金色） */
#closing-video .cv-ornament{
  display:flex;
  align-items:center;
  gap:18px;
  width:min(560px,86%);
  margin:12px auto 14px;
  color:#C9A55E;
}
#closing-video .cv-ornament::before,
#closing-video .cv-ornament::after{
  content:"";
  height:1px;
  background:#C9A55E;
  flex:1;
}
#closing-video .cv-ornament span{
  font:700 20px/1 serif;
  letter-spacing:.06em;
}

#closing-video .cv-lead{
  margin:0 0 clamp(18px,1.5vw,26px);
  text-align:center;
  font-family:"Yu Gothic","Hiragino Kaku Gothic ProN","Meiryo",sans-serif;
  font-size:clamp(17px,1.15vw,20px);
  line-height:1.7;
  color:#5a4c3e;
}
#closing-video .cv-label{
  margin:0 0 8px;
  text-align:center;
  font-family:"Yu Mincho","Hiragino Mincho ProN","MS PMincho",serif;
  font-size:clamp(19px,1.3vw,23px);
  line-height:1.4;
  font-weight:700;
  letter-spacing:.03em;
  color:#102D67;
}
/* PCでは改行しない（1行に収まるため） */
#closing-video .cv-br{ display:none; }

@media(max-width:768px){
  #closing-video .cv-br{ display:inline; }
  #closing-video .cv-title{ font-size:22px; line-height:1.45; }
  #closing-video .cv-ornament{ width:88%; margin:10px auto 12px; }
  #closing-video .cv-ornament span{ font-size:17px; }
  #closing-video .cv-lead{ font-size:17px; margin-bottom:18px; }
  #closing-video .cv-label{ font-size:19px; margin-bottom:8px; }
}

/* =========================================================
   2026-09-06 追加：おすすめ動画の出典表示（ノマドエリ）と免責の一行。
   ・出典は各動画の説明文の末尾（.cv-src）に置く。既存の書式を引き継ぐ。
   ・免責は2本の下にまとめて1つだけ。注記サイズ（PC15px／スマホ14px）。
   ・引用元を明示するための表示であり、推薦関係がないことも併記する。
   ========================================================= */
#closing-video .cv-disclaimer{
  margin:18px 0 0;
  color:#6b6459;
  font-size:15px;
  line-height:1.7;
  text-align:center;
}
@media(max-width:768px){
  #closing-video .cv-disclaimer{
    margin:14px 0 0;
    font-size:14px;
    line-height:1.65;
    text-align:left;
    padding:0 2px;
  }
}

/* =========================================================================
   2026-09-10 追加：古いiPad（iPadOS 14以前）向けの控え。
   このサイトの動画枠は、縦横比を aspect-ratio という新しい書き方だけで
   16:9 にしている。iPadOS 15 より前のSafariはこれを理解できないため、
   ・サムネイルが 16:9 にならない
   ・タップして差し替わる YouTube の枠が、iframe の初期値（高さ150px）まで
     縮んで「画面が半分」に見える
   という不具合が出ていた。
   @supports not (…) は「その機能が使えないブラウザだけが読む」書き方なので、
   新しいブラウザはこのブロックを丸ごと無視する（見た目は1pxも変わらない）。
   ※ iframe（YouTubeの枠）は、この方法では高さを作れないため、
     index.html 側の script で高さを計算して当てている。
   控えは /root/bk_shortcruise_pre_video.css
   ========================================================================= */
@supports not (aspect-ratio: 16 / 9){
  #short-cruise-examples .sc-video__btn,
  #closing-video .sc-video__btn{ height:0; padding-top:56.25%; }
  #short-cruise-examples .sc-video__btn img,
  #closing-video .sc-video__btn img{ position:absolute; left:0; top:0; }
}