body {

    /* ヘッダーの高さに合わせて調整 */
    padding-top: 70px; /* BootstrapのデフォルトのNavbarの高さは約56px */ 
}

/*
select：HTMLのセレクトボックス（プルダウンを対象とする）
[name="birth_year"]：name属性が「birth_year」だけのものに限定してスタイルを適用
appearance: auto !important;：ブラウザが提供する「標準のUI部品」（例：矢印）を表示するかどうかを制御するプロパティ
    auto：標準の見た目を使う（＝矢印を表示する）
-webkit-appearance：Chrome、SafariなどWebKit系ブラウザ向け
-moz-appearance：Firefox向け
    ブラウザ毎の互換性を確保するための記述
*/

select[name="birth_year"] {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
}


/* 「誕生月」のセレクトボックスの「下矢印」を表示 */
select[name="birth_month"] {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
}


/* 「誕生日」のセレクトボックスの「下矢印」を表示 */
select[name="birth_day"] {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
}


/* .alert-success要素の透明度（opacity）を滑らかに変化させる */
.alert-success {
  opacity: 1;
  transition: opacity 3s ease;
}


/* セレクトボックスに下矢印を表示 */
.select-box {
    appearance: auto !important; /* ブラウザ標準の下矢印を表示 */
    -webkit-appearance: auto !important;
    -moz-appearance: auto !important;

    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}