/* ==========================================================================
   customize.css
   --------------------------------------------------------------------------
   このファイルはSCSSを触らずにサイトのデザインを上書きするためのファイルです。
   style.css の後に読み込まれるため、ここに書いたスタイルが優先されます。

   【基本的な使い方】
   1. 変更したい要素のクラス名を開発者ツール（F12）で確認する
   2. 該当するセクションにCSSを追記する
   3. ファイルを保存するとすぐにサイトに反映される（ビルド不要）

   【注意】
   - !important は既存スタイルを上書きできない場合の最終手段として使う
   - 変更内容にはコメントを残しておくと後で分かりやすい
   ========================================================================== */


/* ==========================================================================
   1. サイト全体の共通設定
   ========================================================================== */

/* ここにサイト全体に影響するスタイルを追記する */
/* 例: フォントサイズ、行間、文字色など */


/* ==========================================================================
   2. ヘッダー
   ========================================================================== */

/* スマホ表示でJSのクラス付与を待たずに最初からヘッダーを表示する */
@media screen and (max-width: 1171px) {
  .l-header {
    transform: translateY(0) !important;
  }
}

/* ここにヘッダーのスタイル上書きを追記する */


/* ==========================================================================
   3. フッター
   ========================================================================== */

/* ここにフッターのスタイル上書きを追記する */


/* ==========================================================================
   4. トップページ
   ========================================================================== */

/* ここにトップページのスタイル上書きを追記する */


/* ==========================================================================
   5. イベント一覧・詳細
   ========================================================================== */

/* ここにイベントページのスタイル上書きを追記する */


/* ==========================================================================
   6. テナント（ショップ・レストラン）一覧・詳細
   ========================================================================== */

/* ここにテナントページのスタイル上書きを追記する */


/* ==========================================================================
   7. アクセスページ
   ========================================================================== */

/* 満空情報ブロックをアクセスページ内に表示する */
.p-access__parking-status-block {
    display: block !important;
    margin-bottom: 30px;
}

.p-access__parking-status-block .l-header__parking-info {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.p-access__parking-status-block .l-header__parking-item {
    flex: 1;
    min-width: 140px;
}


/* ==========================================================================
   8. その他のページ
   ========================================================================== */

/* ここにその他のページのスタイル上書きを追記する */


/* ==========================================================================
   9. スマホ専用の上書き（画面幅 767px 以下）
   ========================================================================== */

@media screen and (max-width: 767px) {
  /* ここにスマホ専用のスタイル上書きを追記する */
}


/* ==========================================================================
   10. タブレット専用の上書き（画面幅 768px 〜 1171px）
   ========================================================================== */

@media screen and (min-width: 768px) and (max-width: 1171px) {
  /* ここにタブレット専用のスタイル上書きを追記する */
}
