#container {
    background-color: #111111;
    /* ✅ 원하는 배경색 */
    color: #fff;
    /* 텍스트 가시성 */
    padding: 1px;
    border: 1px solid #2c2c2c;
    border-radius: 5px;
}

/*style="background: white; height: 300px; margin-top: 25px"*/
#container-inner {
    background-color: #111111;
    border-radius: 5px;
}

.menu_horizontal {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

#mixture_rune {
    cursor: pointer;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    background-color: #a40c0c;
    border-radius: 5px 0 0 0;
    margin-right: 1px;
    /*font-size: 14px;*/
    height: 40px;
}

#mixture_rune:hover {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    background-color: #770606;
    border-radius: 5px 0 0 0;
    margin-right: 1px;
    /*font-size: 14px;*/
    height: 40px;
}

#init_rune {
    cursor: pointer;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    background-color: #a40c0c;
    border-radius: 0 5px 0 0;
    margin-left: 1px;
    /*font-size: 14px;*/
    height: 40px;
}

#init_rune:hover {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    background-color: #770606;
    border-radius: 0 5px 0 0;
    margin-left: 1px;
    /*font-size: 14px;*/
    height: 40px;
}


.rune-inner-border2 {
    background-color: #FF9800;
    text-align: left;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #FF9800;
    /*font-size: 9px;*/
    margin-left: 2px;
    width: 40px;
    height: 40px;
    margin-top: 2px;
}

.rune-inner-image {
    width: 25px;
    height: 25px;
    padding-left: 5px;
}

.select-button-group {
    display: flex;
    flex-direction: row; /* 위아래 버튼 정렬 */
    align-items: flex-end;
    margin-left: auto;
}

.rune-background {
    background-color: #111111;
    transition: background-color 0.3s;
}
.rune-background.has-rune {
    background-color: #1B501D;
}

.rune-background:hover {
    background-color: red;
}


#el-background, #eld-background, #tir-background, #nef-background, #eth-background, #ith-background, #tal-background,
#ral-background, #ort-background, #thul-background, #amn-background, #sol-background, #shael-background, #dol-background,
#hel-background, #io-background, #lum-background, #ko-background, #fal-background, #lem-background, #pul-background, #um-background,
#mal-background, #ist-background, #gul-background, #vex-background, #ohm-background, #lo-background, #sur-background, #ber-background,
#jah-background, #cham-background, #zod-background {
    cursor: pointer;
    text-align: left;
    display: flex;
    justify-content: left;
    align-items: center;
    border: 1px solid #FF9800;
    /*font-size: 9px;*/
    width: 100%;
    height: 40px;
    /*font-size: 14px;*/
    margin-top: 2px;
}

/*룬을 background를 hover 했을때 마지막 색상 변경*/
#el-background:hover, #eld-background:hover, #tir-background:hover, #nef-background:hover, #eth-background:hover, #ith-background:hover, #tal-background:hover,
#ral-background:hover, #ort-background:hover, #thul-background:hover, #amn-background:hover, #sol-background:hover, #shael-background:hover, #dol-background:hover,
#hel-background:hover, #io-background:hover, #lum-background:hover, #ko-background:hover, #fal-background:hover, #lem-background:hover, #pul-background:hover, #um-background:hover,
#mal-background:hover, #ist-background:hover, #gul-background:hover, #vex-background:hover, #ohm-background:hover, #lo-background:hover, #sur-background:hover, #ber-background:hover,
#jah-background:hover, #cham-background:hover, #zod-background:hover {
    background: #a40c0c;
}


/* 버튼 텍스트 공통 스타일 */
.el-button, .eld-button, .tir-button, .nef-button, .eth-button, .ith-button, .tal-button,
.ral-button, .ort-button, .thul-button, .amn-button, .sol-button, .shael-button,
.dol-button, .hel-button, .io-button, .lum-button, .ko-button, .fal-button,
.lem-button, .pul-button, .um-button, .mal-button, .ist-button, .gul-button,
.vex-button, .ohm-button, .lo-button, .sur-button, .ber-button, .jah-button,
.cham-button, .zod-button {
    padding-left: 5px;
    color: #FF9800;

}

/* 업 버튼 스타일 */
#el-button-up, #eld-button-up, #tir-button-up, #nef-button-up, #eth-button-up, #ith-button-up,
#tal-button-up, #ral-button-up, #ort-button-up, #thul-button-up, #amn-button-up,
#sol-button-up, #shael-button-up, #dol-button-up, #hel-button-up, #io-button-up,
#lum-button-up, #ko-button-up, #fal-button-up, #lem-button-up, #pul-button-up,
#um-button-up, #mal-button-up, #ist-button-up, #gul-button-up, #vex-button-up,
#ohm-button-up, #lo-button-up, #sur-button-up, #ber-button-up, #jah-button-up,
#cham-button-up, #zod-button-up {
    width: 35px;
    height: 25px;
    padding-right: 10px;
}

/* 다운 버튼 스타일 */
#el-button-down, #eld-button-down, #tir-button-down, #nef-button-down, #eth-button-down, #ith-button-down,
#tal-button-down, #ral-button-down, #ort-button-down, #thul-button-down, #amn-button-down,
#sol-button-down, #shael-button-down, #dol-button-down, #hel-button-down, #io-button-down,
#lum-button-down, #ko-button-down, #fal-button-down, #lem-button-down, #pul-button-down,
#um-button-down, #mal-button-down, #ist-button-down, #gul-button-down, #vex-button-down,
#ohm-button-down, #lo-button-down, #sur-button-down, #ber-button-down, #jah-button-down,
#cham-button-down, #zod-button-down {
    width: 35px;
    height: 25px;
    padding-right: 10px;
}

#el-count, #eld-count, #tir-count, #nef-count, #eth-count, #ith-count, #tal-count,
#ral-count, #ort-count, #thul-count, #amn-count, #sol-count, #shael-count,
#dol-count, #hel-count, #io-count, #lum-count, #ko-count, #fal-count,
#lem-count, #pul-count, #um-count, #mal-count, #ist-count, #gul-count,
#vex-count, #ohm-count, #lo-count, #sur-count, #ber-count, #jah-count,
#cham-count, #zod-count {
    color: #ffffff;
    /*font-size: 12px;*/
}