@charset "UTF-8";

/* ==========================================================
  南国酒家 追加カスタムCSS
  nangoku_custom.css

  既存CSSを直接変更せず、追加・上書き調整を行うためのCSS。
  原宿本店に限らず、各店舗の共通パーツで使用します。

  作成：2026年9月
   ========================================================== */


/* ==========================================================
  コース・プラン掲載ブロック
   ========================================================== */


/* タイトルエリア
---------------------------------------------------------- */
.nangoku-course-header {
  align-items: flex-end;
  border-bottom: 3px solid #840011;
  padding-bottom: 20px;
}


/* 見出し
  subtitle04 の既存下線・余白を調整
---------------------------------------------------------- */
.nangoku-course-heading {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}


/* コース・プランタイトル
---------------------------------------------------------- */
.nangoku-course-title {
  font-size: 18pt;
}


/* 開催期間
---------------------------------------------------------- */
.nangoku-course-date {
  font-size: 14pt;
}


/* ==========================================================
  スマートフォン表示
   ========================================================== */
@media only screen and (max-width: 690px) {


  /* ----------------------------------------------------------
    コースメニューボタン
    4つの導線を2カラムで表示
     ---------------------------------------------------------- */
  .nangoku-course-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .nangoku-course-nav a {
    width: calc(50% - 4px);
    box-sizing: border-box;
    padding: 10px 5px !important;
    font-size: 13px;
    line-height: 1.4;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
  }


  /* ----------------------------------------------------------
    コースタイトル・開催期間
     ---------------------------------------------------------- */
  .nangoku-course-title {
    font-size: 16px;
    line-height: 1.5;
  }

  .nangoku-course-date {
    font-size: 13px;
    line-height: 1.5;
  }


  /* ----------------------------------------------------------
    タイトル・予約ボタンエリア
     ---------------------------------------------------------- */

  /* タイトルを上に配置 */
  .nangoku-course .menuLl {
    width: 100%;
    order: 1;
  }

  /* 予約ボタンをタイトル下へ配置 */
  .nangoku-course-reserve {
    order: 2;
    width: 180px;
    margin: 16px auto 0;
  }

  .nangoku-course-reserve a {
    font-size: 13px;
    padding: 11px 24px;
    background-size: 17px auto, auto 12px;
  }


  /* タイトルエリア */
  .nangoku-course-header {
    padding-bottom: 16px;
  }

  .nangoku-course-heading {
    line-height: 1.5;
  }


  /* ----------------------------------------------------------
    記事画像
     ---------------------------------------------------------- */
  .nangoku-course-image {
    margin-top: 25px;
  }

}