@charset "UTF-8";
/* ===================================================================
CSS information

file name : reserves_dt4.css
author     : abilive
style info : 宿泊予約システム　デザインカスタマイズ　2019/08/02版
=================================================================== */
/* ====================================
	予約システム　共通
	#ypro_wrapper
==================================== */
/* 書体設定 */
#ypro_wrapper {
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Meiryo,sans-serif;
}

/* -----------------------------------------------------------
	ログインバー
	.ypro_login_button
----------------------------------------------------------- */
#ypro_wrapper .ypro_login_button .inner.bg_login {
  background: #4c7291;
}
#ypro_wrapper .ypro_login_button .inner.bg_logout {
  background: #111;
}
#ypro_wrapper .ypro_login_button .inner p.btn_login {
  background: #014c18;
}
#ypro_wrapper .ypro_login_button .inner p.btn_login:hover {
  background-color: #013310;
}
#ypro_wrapper .ypro_login_button .inner p.btn_logout:hover {
  background: #414141;
}

/* ====================================
	プラン一覧、部屋一覧、プラン詳細、カテゴリ一覧等

==================================== */
/* -----------------------------------------------------------
	「おすすめ順、料金が安い順、料金が高い順」ボタン
	.ypro_sort_button
----------------------------------------------------------- */
#ypro_wrapper .ypro_sort_button p {
  background-color: #f5f5f5;
}
#ypro_wrapper .ypro_sort_button p.active {
  color: #fff;
  background-color: #414141;
}
#ypro_wrapper .ypro_sort_button p a:hover {
  color: #fff;
  background-color: #414141;
}

/* -----------------------------------------------------------
	プラン名、見出し等
	.ypro_st　.ypro_list
----------------------------------------------------------- */
/* 共通 */
#ypro_wrapper .ypro_st {
  color: #fff;
  background: #014c18;
  border: 1px solid #014c18;
}

/* 「空室検索」見出し */
#ypro_wrapper .ypro_search_box .ypro_st {
  border: 1px solid #014c18;
  background: #014c18;
}

/* 「プラン一覧から選ぶ」見出し */
#ypro_wrapper .ypro_list.ypro_package_list .ypro_st {
  background: #014c18;
}

/* 「部屋一覧から選ぶ」見出し */
#ypro_wrapper .ypro_list.ypro_room_list .ypro_st {
  background: #b1b1b1;
}

/* -----------------------------------------------------------
	料金カレンダー部分
	.box_calendar
----------------------------------------------------------- */
/* 「前の期間」「後の期間」ボタン */
#ypro_wrapper .box_calendar .ypro_tbl_cal thead .cal_btn p a {
  background-color: #014c18;
}
#ypro_wrapper .box_calendar .ypro_tbl_cal thead .cal_btn p a:hover {
  background-color: #016b22;
}

/* -----------------------------------------------------------
	プラン詳細ページ　1ヶ月空室カレンダー
	.ypro_package_detail
----------------------------------------------------------- */
/* ====================================
	予約フォーム

==================================== */
/* -----------------------------------------------------------
	ステップナビゲーション（内容入力・内容確認・予約完了）
	.ypro_step_navi
----------------------------------------------------------- */
/* -----------------------------------------------------------
	予約フォーム　サブ画面（完了画面、エラー画面、ログイン画面等）
	.ypro_form_sub
----------------------------------------------------------- */
/* サブ画面の見出し */
#ypro_wrapper .ypro_st_form_sub {
  color: #fff;
  background: #014c18;
}

/* サブ画面の囲い枠 */
#ypro_wrapper .ypro_form_sub {
  width: 75%;
  border: 2px solid #014c18;
}