#id_haikei {
	position: relative;
	display:block;
	max-width: 360px;
	height: 250px;
	overflow: hidden;
	border-radius: 12px;
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
	margin:-20px auto 0 auto;
}

/* 絵を配置するコンテナ */
.art-container {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-image:url('../images/header/881f498198ef6a20.webp');
	background-position:center center;
	background-repeat:no-repeat;
	background-size: 240% 150%;
	animation: slide 30s  ease-in-out 3 alternate forwards;
}
//@keyframes slide {
//  0%   { background-position:left center; }
//  100% { background-position:right center; }
//}
@keyframes slide {
  0%   { background-size: 240% 150%; }
  85%  { background-size: 100% 100%; }
  100% { background-size: 100% 100%; }
}

/* ************************************************************* */
/* 落ち葉を配置するコンテナ */
.leaves-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none; /* マウス操作を邪魔しない */
}

/* 落ち葉の基本スタイル */
.leaf {
	position: absolute;
	top: -10%;
	pointer-events: none;
	user-select: none;
	/* ひらひら舞い落ちる基本アニメーション */
	animation: fall linear infinite;
}

/* SVGのモミジの色付け用クラス */
.leaf-red { fill: #c0392b; opacity: 0.85; }
.leaf-orange { fill: #e67e22; opacity: 0.85; }
.leaf-gold { fill: #f39c12; opacity: 0.85; }

/* 落下と左右の揺れ（ひらひら感）を記述するキーフレーム */
@keyframes fall {
  0% {
    top: -10%;
    transform: translateX(0) rotate(0deg) rotateY(0deg);
  }
  25% {
    transform: translateX(25px) rotate(45deg) rotateY(180deg);
  }
  50% {
    transform: translateX(-20px) rotate(120deg) rotateY(360deg);
  }
  75% {
    transform: translateX(30px) rotate(220deg) rotateY(180deg);
  }
  100% {
    top: 110%;
    transform: translateX(-10px) rotate(360deg) rotateY(0deg);
  }
}