/* ==================================
   フッターの文字を白にする
================================== */
#dt_footer .dt-footer-slug h3,
#dt_footer .dt-footer-slug h3 * {
  color: #ffffff !important;
}


/* ==================================
   トップ画像
================================== */
body.home #custom-header {
  position: relative;
  display: block;
  overflow: hidden;
  isolation: isolate;
}

body.home #custom-header > img {
  display: block;
  width: 100%;
  height: auto;
}


/* ==================================
   画像に重ねる2行の文字
================================== */
body.home #custom-header::after {
  content: "徳島大学生限定\A お部屋探しはおまかせください。";
  white-space: pre;

  position: absolute;
  left: 13%; /* 左からの位置 */
  top: 45%; /* 上からの位置 */
  z-index: 1;

  color: #19578d; /* 文字色 */
  font-family: inherit;
  font-size: clamp(14px, 2.2vw, 42px);
  font-weight: 700;
  line-height: 1.8;
  letter-spacing: 0;
  text-align: left;
  pointer-events: none;

  opacity: 1;
  transform: translateY(-50%);
  animation: kentHeaderRise 1.2s ease-out 1.1s both;
}


/* 読み込み画面が終了するまで待機 */
body.home #dt_preloader:not(.loaded) ~ #custom-header::after {
  animation-play-state: paused;
}


/* ==================================
   下からふわっと浮かび上がる動き
================================== */
@keyframes kentHeaderRise {
  from {
    opacity: 0;
    transform: translateY(calc(-50% + 35px));
  }

  to {
    opacity: 1;
    transform: translateY(-50%);
  }
}


/* ==================================
   スマートフォン
================================== */
@media (max-width: 767px) {
  body.home #custom-header::after {
    left: 7%;
    font-size: clamp(12px, 3vw, 22px);
  }
}


/* 動きを減らす端末設定への対応 */
@media (prefers-reduced-motion: reduce) {
  body.home #custom-header::after {
    animation: none;
  }
}