@charset "utf-8";

/* 予約システム移行のお知らせ（トップ・/room/）撤去時はこのファイルごと削除 */

/* 文字サイズはサイト既定のスケール（base.css の .txt◯◯ 相当）に合わせた可変指定にする。
   固定pxだと本文だけが画面幅に応じて拡大し、広い画面でタイトルが相対的に小さくなるため。 */
.migration-notice{
  background:#fff;
  border:1px solid #584C9D;          /* 枠線はサイト既定のアクセント色（contact.css の ul.address と同じ） */
  padding:32px 40px;
  box-sizing:border-box;
  font-size:clamp(1rem, 0.9375vw, 3.6rem);    /* .txt18 相当。サイト既定の本文より少し小さく */
}
.migration-notice__title{
  text-align:center;
  font-size:clamp(1.6rem, 1.5625vw, 6rem);    /* .txt30 相当 */
  font-weight:bold;
  margin:0 0 20px;
}
.migration-notice__lead{ font-weight:bold; margin:18px 0 4px; }
/* トップの#seachArea内では検索見出し用の h2 スタイル（幅18%・アイコン背景）を打ち消す */
#seachArea .migration-notice__title{ width:100%; padding-top:0; background:none; }
.migration-notice p{ margin:0 0 8px; line-height:1.9; }
.migration-notice a{ text-decoration:underline; }
/* /room/ は枠で囲うため、ボックス自体をサイト既定のコンテンツ幅（.area02 と同じ75vw）にする */
#room .migration-notice{ width:75vw; margin:5.2083vw auto 0; }   /* 上余白はサイトのセクション間隔(.area02と同じ5.2083vw)。下は.firstAreaのpaddingが効くため0 */
/* トップ: お知らせを入れて#seachAreaが縦に伸びたため、見出し「空室検索」を上揃えにする
   （お知らせ撤去時はこのファイルごと削除するので、元の中央揃えに戻る） */
#seachArea{ align-items:flex-start; }
/* トップ: プラン一覧ボタンと枠線が接して見えないよう間隔をあける */
#seachArea .migration-notice{ margin-top:2vw; }
@media screen and (max-width:767px){
  /* SPは枠が画面端に接しないよう、サイト既定のSP幅（左右5vwの余白）に合わせる */
  .migration-notice{ width:90vw; margin:8vw auto;
                     padding:24px 16px; font-size:1.3rem; }
  .migration-notice__title{ font-size:1.6rem; }
  #room .migration-notice{ width:90vw; margin-bottom:0; }   /* 下は.firstAreaのpaddingが効く */
}