@charset "UTF-8";

/*箱*/
	
html{
	background: #ffffff;	
	color: #ffffff;
	scroll-padding-top: 250px;
	}
	
*{
	color: #ffffff;
	}
	
/*各部屋詳細のデザイン*/
/* 親コンテナ */
.room__detail {
    display: flex;
    flex-direction: column; /* 上から下へ並べる */
    align-items: center;    /* 中央寄せ */
    width: 375px;
    margin: 0 auto;         /* 画面中央に配置 */
    padding: 0;
    overflow: hidden;       /* はみ出した文字などを隠す */
}

/* 情熱HOTELのテキスト画像部分 */
.room__detail_text {
    width: 100%;            /* 元の指定通り少し大きく */
    margin-left: 0;     /* 中央から少し左にずらす調整（(115-100)/2） */
    margin-top: 5px;
    opacity: 0.6;
    line-height: 0;         /* 画像下の余計な隙間を消す */
}

/* メイン画像部分 */
.room__detail_main {
    width: 100%;
    margin-top: -20px;      /* テキストと少し重ねたい場合はマイナスマージンを使う */
	margin-left: 5px; 
    line-height: 0;
}

/* スクロールアニメーション部分 */
.room_in__scroll-infinity_right {
    width: 100%;
    margin-top: 5px;       /* 写真との間隔を空ける */
}

/* 画像全般の設定（親の幅に合わせる） */
.room__detail img {
    width: 100%;
    height: auto;
    display: block;
}

/* 無限スクロールのリスト（横並びにする設定） */
.room__scroll-infinity__list {
    display: flex;          /* リストの中身を横に並べる */
    list-style: none;
    padding: 0;
    margin: 0;
}

.room__scroll-infinity__item {
    flex-shrink: 0;         /* 画像が潰れないようにする */
    width: 120px;           /* 任意のサイズ */
    margin-right: 10px;
}

.sarvice_icon{
	width: 90%;
	padding: 10px;
	margin: 10px;
}

/*設備アイコンの並び*/
.case_setubi{
	width: 100%;
	padding: 5px;
	margin: 10px 0 20px;
}

.case_setubi ul {
    display: flex;           /* 子要素を横並びにする */
    justify-content: center; /* 中央寄せ */
    gap: 10px;               /* 画像同士の隙間 */
    padding: 10;              /* リスト特有の余白を消す */
    margin: 10;               /* リスト特有の余白を消す */
    list-style: none;        /* リストの「・」を消す */
}

/* 各設備アイコンの枠 */
.case_setubi ul li {
    width: 48%;              /* 2つ並べるので、少し余裕を持たせて48%くらいにする */
    max-width: 400px;        /* PCで広がりすぎないように最大幅を指定（調整可） */
    box-sizing: border-box;
}

/* 設備アイコン画像 */
.case_setubi ul li a img {
    width: 100%;            /* 枠いっぱいに表示 */
    height: auto;
    vertical-align: top;    /* 画像下の隙間消し */
}



/*スライダーについて*/
.swiper-slide {
	width: 10%;
	margin-right: 55px;
	height: 50px;
}

.swiper-container {
	padding-bottom: 30px;
	
}

.swiper-container {
	width: 130px;
	align-items: center;
	justify-content: center;
	display: inline-block;
}

.swiper-slide {
	width: 10%;
	margin-right: 10px;
	height: 50px;
	border-radius: 10px;
	box-shadow: 0 2px 10px 0px #848484;
}


/* 部屋写真のフワフワアニメーション */
.room_fuwa_hayai{
  animation: floating-y 1.2s ease-in-out infinite alternate-reverse;
}
@keyframes floating-y {
  0% {
    transform: translateY(-6%);
  }
  100% {
    transform: translateY(6%);
  }
}

.room_fuwa_osoi{
  animation: floating-y 2.4s ease-in-out infinite alternate-reverse;
}
@keyframes floating-y {
  0% {
    transform: translateY(-6%);
  }
  100% {
    transform: translateY(6%);
  }
}

.room_fuwa_sorenari{
  animation: floating-y 1.7s ease-in-out infinite alternate-reverse;
}
@keyframes floating-y {
  0% {
    transform: translateY(-6%);
  }
  100% {
    transform: translateY(6%);
  }
}