.selectbox { position: relative; font-size: 1.2rem; display: inline-block; }
.selectbox .select-label { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; display: inline-block; vertical-align: middle; width: 100%; line-height: 28px; padding: 0 25px 0 10px; color: #4C4C4C; background-color: #fff; border: 1px solid var(--line-color); border-radius: 3px; cursor: pointer; }
.selectbox .select-label:after { content: "";  position: absolute; top: 48%; right: 10px; width: 0; height: 0; margin-top: -1px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 6px solid #ccc; transition: border-top .25s ease; }
.selectbox .select-label:hover:after { border-top: 6px solid #aaa; }
.selectbox.on { z-index: 2; }
.selectbox.on .select-layer { display: block; }
.selectbox .select-layer { display: none; position: absolute; top: 100%; left:0; z-index: 1; width: 100%; padding-top: 3px; }
.selectbox .select-layer .select { padding: 5px 0; border: 1px solid var(--line-color); background:#fff; width: 100%; max-height: 250px; overflow-y: auto; }
.selectbox .select-layer .select .option { padding: 3px 10px; font-size: 1.1rem; cursor: pointer; width: 100%; word-break: break-all; }
.selectbox .select-layer .select .option:hover { background:#f2f2f2; }