
#udon-slide {
	width: 100%;
	height: auto;
	position: relative; /* 基準となるコンテナ */
	width: 100%;
	max-width: 1200px;
	overflow: hidden;
	margin: 0 auto;
}

#fade-viewer {
 width: 960px;
 height: 420px;
 overflow: hidden;
 position: relative;
 margin: 0 auto;
 margin-bottom: 25px;
 margin-top: 20px; }
 
#fade-viewer img {
 top: 0;
 left: 0;
 width: 960px;
 height: 420px;
 position: absolute;
}

/* 追加　*/

.udon-wrap {
	width: 100%;
	height: 52%;
}


/* -------------- 雲　（まあるい笑顔お届けします。）--------------- */
.fixed-image_l {
	position: absolute; /* 親要素を基準にして配置 */
	top: 40px;             /* 上から0の位置 */
	left: -5px;            /* 左から0の位置 */
	z-index: 99;        /* スライド画像よりも前面に表示させる */
	width: 300px;       /* 必要に応じてサイズ調整 */
	margin: 220px;       /* 左上から少し離したい場合の余白 */
}

/* -------------- fujimen logo ----------------------------- */
.fixed-image_r {
	position: absolute; /* 親要素を基準にして配置 */
	bottom: -3px;             /* 上から0の位置 */
	right: 77px;            /* 左から0の位置 */
	z-index: 99;        /* スライド画像よりも前面に表示させる */
	width: 150px;       /* 必要に応じてサイズ調整 */
	margin: 220px;       /* 左上から少し離したい場合の余白 */
}



/* 画面サイズが768px以下（スマホ）の場合 */
@media (max-width: 768px) {
  .sp-hidden {
    display: none; /* 画像を非表示にする */
  }
}



/* -------------- ふわふわさせる -------------- */
.fluffy {
  animation: floatAnime 3s ease-in-out infinite alternate;
}

@keyframes floatAnime {
  0% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(-15px); /* 移動させる高さ（マイナスで上方向） */
  }
}
/* -------------- /ふわふわ -------------- */



/* -------------------------------------------- udon-slide 　PCとスマホで切替 -------------- */

/* PCで表示、スマホで非表示にする設定 */
.pc-only {
  display: block; /* PCでは表示 */
}
.sp-only {
  display: none;  /* PCでは非表示 */
}

/* スマホ（画面幅768px以下）での表示設定 */
@media screen and (max-width: 768px) {
  .pc-only {
    display: none;  /* スマホでは非表示 */
  }
  .sp-only {
    display: block; /* スマホでは表示 */
	width: 100%;
	height: auto;
  }
}
/* -------------------------------------------- /udon-slide 　PCとスマホで切替 -------------- */




