.visual-container {
  position: relative;
  width: 100%;
  /* heightはJSで設定するため不要 */
  overflow: hidden;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  transition: height 0.3s ease; /* サイズ変更を滑らかに */
}
.arc-down {
  position: absolute;
  bottom: -180px;
  left: 0;
  width: 100%;
  height: 200px;
  background-color: #f5f5f5;
  /* 左上と右上の角に丸みをつけ、垂直方向の半径を調整 */
  clip-path: ellipse(150% 100% at 50% 100%);
  z-index: 1000;
}

.top-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto; /* 高さは自動計算 */
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
}
  /* activeクラスがついている時だけ表示 */
  .top-img.active {
    opacity: 1;
  }


footer{
  width: 100%;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  text-align: center;
}
  footer img{
    width: 30%;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  footer .section h4{
    padding-bottom: 5px;
  }