/* ========================================
　▼ タイトルの文言をヘッダーにする ▼
=========================================*/

/* タイトルの（プレビュー）の文字を非表示 */
h3, b, .form-top-right {
    display: none;
}

/* タイトル説明(ヘッダー文字) */
.form-top .form-top-left p {
    color: #fff;
    font-size: 3rem;
    margin: 10px auto;
    font-weight: bold;
    letter-spacing: 0.03em;
    text-align: center;
    padding: 0.25em;
    font-family: serif;
    animation-name: fadeUpAnime;
    animation-duration: 1.5s;
    animation-fill-mode: forwards;
    opacity: 0;
}

@keyframes fadeUpAnime {
  from {
      opacity: 0;
      transform: translateY(100px);
  }
  to {
      opacity: 1;
      transform: translateY(0);
  }
}

/* ヘッダー背景色 */
.form-top {
    background: linear-gradient(#051b32, #2a4260);
    border-radius: 0;
}


/* PC・スマホ共通背景 */
body, .form-bottom, .form-top {
  background: #FFF4E6;
}

/* タイトル文字 */
.form-top .form-top-left p {
  color: #4B3A2A;
  font-size: 3rem;
  text-align: center;
  font-weight: bold;
  font-family: serif;
}

/* 全体の文字色 */
body, .help-block,
.has-success .checkbox,
.has-error .checkbox,
.has-success .radio,
.has-error .radio {
  color: #4B3A2A;
}

/* 中見出し */
.description-md-title {
  background: linear-gradient(45deg, #C8A165, #D6BA9E, #C8A165);
  color: #4B3A2A;
  font-weight: bold;
}

/* 項目名・小見出し下線 */
.control-label::after, .description-title::after {
  background: linear-gradient(45deg, #C8A165, #D6BA9E, #C8A165);
}

/* 送信ボタン */
#submit-button {
  background: linear-gradient(45deg, #C8A165, #D6BA9E, #C8A165) !important;
  font-weight: bold;
  width: 95%;
  margin: 0 auto 30px;
  border: none;
}