/* JavaScript が無効な場合、.js-disabled を表示 */
.js-disabled {
    display: block;
}

/* JavaScript が有効な場合、.js-disabled を隠す */
.js-enabled {
    display: block;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 40px;
    color: black;
    font-size: 20px;
    background-color: white;
    border-radius: 6px;
    position: relative; /* 矢印が親要素内で位置指定されるように */
}

/* セレクトボックス初期状態 */
select option:disabled {
    color: #D3D3D3;
}

/* 選択されたオプションの文字色 */
select option {
    color: black;
}

/* フォーカス時の文字色 */
select:focus {
    color: black;
}

select::-ms-expand {
    display: none;
}

/* 矢印アイコン */
.select-arrow {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    border-left: 10px solid transparent; /* 三角形の左辺 */
    border-right: 10px solid transparent; /* 三角形の右辺 */
    border-top: 16px solid #007BFF; /* 三角形の上辺の色（青色） */
}