/* 【重要】サイトの背景色を半透明にする調整
    既存の背景色（白やグレー）を少し透過させて、裏の花びらを見えるようにします。
    透過度（0.9）はお好みで調整してください（0が透明、1が不透明）。
  */
  #header,
  #top-company,
  #top-blog,
  footer .tw\:bg-\[\#FAFAFA\] {
    background-color: rgba(255, 255, 255, 0.9) !important; /* 白背景を90%不透明に */
  }
  /* グレー背景のセクション用 */
  #top-company,
  #top-blog,
  footer .tw\:bg-\[\#FAFAFA\] {
     background-color: rgba(250, 250, 250, 0.9) !important; /* #FAFAFAを90%不透明に */
  }

  /* 花びらを配置するコンテナ（bodyの最背面） */
  #flora-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1; /* コンテンツより後ろに配置 */
    pointer-events: none;
  }

  /* 花びらの基本スタイル */
  .flora-petal {
    position: absolute; /* コンテナ内で絶対配置 */
    top: -20px;
    /* z-indexはコンテナで指定するので削除 */
    pointer-events: none;
    background: linear-gradient(120deg, #ffc0cb, #fce7f3);
    border-radius: 150% 0 150% 0;
    opacity: 0.8;
    animation-name: flora-fall;
    animation-timing-function: linear;
    animation-fill-mode: forwards;
  }

  /* 舞い落ちるアニメーション（前回と同じ） */
  @keyframes flora-fall {
    0% { opacity: 0; transform: translateY(0) translateX(0) rotate(0deg); }
    10% { opacity: 0.9; }
    90% { opacity: 0.9; }
    100% { opacity: 0; transform: translateY(100vh) translateX(100px) rotate(360deg); }
  }