:root
{
    --case1-color: #387aff;
    --case2-color: #f5009b;
}

html, body
{
    font-family: 'Noto Sans KR', sans-serif;
}
/* input number 타입 옆에 화살표 제거 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button
{
    -webkit-appearance: none;
    margin: 0;
}

/* 게임 화면 CSS */
.accordion-button:not(.collapsed)
{
    color: black;
}
.accordion-button::after
{
    z-index: 1;
}
.accordion-header, .accordion-button
{
    height: 30px;
    text-align: center;
}
.accordion-body, .modal-footer
{
    padding: 0.5rem;
}
.container, .container-fluid
{
    background-color: #f8f8f8;
    border: 1px solid rgba(39,41,43,0.1);
}
.case1
{
    color: var(--case1-color);
}
.case2
{
    color: var(--case2-color);
}
.btn-case1
{
    background-color: val(--case1-color);
}
.btn-case2
{
    background-color: val(--case2-color);
}
.timer
{
    height: 100%;
    position: absolute;
    background-color: #7cd57c;
    left: 0;
    top: 0;
    transition-property: background-color;
    transition-duration: 500ms;
}
.coin
{
    position: relative;
    top: -2px;
}
.percent
{
    font-size: 1.5rem;
    font-weight: bold;
}
#gamelist *
{
    word-break: break-all;
}
.game-title-accordian
{
    font-weight: 500;
    font-size: 1rem;
}
.game-title
{
    font-weight: 600;
    font-size: 1.25rem;
}
.game-case-title
{
    font-weight: 600;
    font-size: 1rem;
}
.game-default
{
    font-size: 0.75rem;
}
.game-case-input
{
    margin: 0%;
    margin-left: 1%;
    margin-right: 1%;
    height: 100%;
    width: 47%;
}
.game-case-input-area
{
    width: 100%;
    height: 30px;
    padding: 0%;
    margin: 0%;
    opacity: 100%;
    transition-property: height, opacity;
    transition-duration: 250ms;
}
.game-case-input-area[bSelected='true']
{
    height: 0px;
    opacity: 0%;
}
.game-case-submit-area
{
    height: 0px;
    opacity: 0%;
    margin: 0px;
    transition-property: height, opacity;
    transition-duration: 250ms;
    transition-delay: 275ms;
}
.game-case-submit-area[bShow='true']
{
    opacity: 100%;
    height: 30px;
}

/* 권한 부여 버튼 */
.btn-light, .btn-light:focus, .btn-light:active:focus
{
    color: white;
    background-color: #9147ff;
    border-color: #f9fafb;
    transition: none;
    box-shadow: none;
}
.btn-light:hover, .btn-light:disabled
{
    color: white;
    background-color: #772ce8;
}