@charset "utf-8";


.btn {
    color: white;
    font-size: 1.125rem;
    font-weight: bold;
    /*ie-default*/
    background: #2CAAA2;
    background: var(--mainColor);
    border: 1px #2CAAA2 solid;
    border: 1px var(--mainColor) solid;
    min-height: 40px;
    min-height: var(--inputHeight);
    border-radius: 8px;
    border-radius: var(--borderR);
    padding: 5px 12px;
    padding: var(--btnHPadding) var(--btnWPadding);
}

    .btn:hover, .btn:focus, .btn-success:not(:disabled):not(.disabled):active {
        color: white;
        /*ie-default*/
        border-color: #00C9AC;
        border-color: var(--mainChromaColor);
        background: #00C9AC;
        background: var(--mainChromaColor);
    }

.btn-primary {
    /*ie-default*/
    background: #2CAAA2;
    background: var(--mainColor);
}


.btn-cancel {
    background: white;
    /*ie-default*/
    color: #f45145;
    color: var(--btn-cancel);
    border-color: #f45145;
    border-color: var(--btn-cancel);
}

.btn-link.btn:hover {
    background: white;
    /*ie-default*/
    color: #00C9AC;
    color: var(--mainChromaColor);
}

.btn-import {
    /*ie-default*/
    background: #8D59BF;
    background: var(--btn-import);
    border-color: #8D59BF;
    border-color: var(--btn-import);
}


.btn-secondary {
    /*ie-default*/
    background: #4153da;
    background: var(--btn-secondary);
    border-color: #4153da;
    border-color: var(--btn-secondary);
}


.btn-tertiary {
    /*ie-default*/
    background: #a14482;
    background: var(--btn-tertiary);
    border-color: #a14482;
    border-color: var(--btn-tertiary);
}


.k-upload-button {
    padding: 8px 20px;
    color: white;
    line-height: 36px;
    /*ie-default*/
    background: #2CAAA2;
    background: var(--mainColor);
    border: 1px solid #2CAAA2;
    border: 1px solid var(--mainColor);
    min-height: 40px;
    min-height: var(--inputHeight);
}

.btn-other {
    background: white;
    /*ie-default*/
    background: #2CAAA2;
    background: var(--mainColor);
    border: 1px solid #2CAAA2;
    border: 1px solid var(--mainColor);
}


.btn-back {
    /*ie-default*/
    background: #3888ca;
    background: var(--btn-back);
    border-color: #3888ca;
    border-color: var(--btn-back);
}

.btn-success {
    /*ie-default*/
    background: #2CAAA2;
    background: var(--mainColor);
    border-color: #2CAAA2;
    border-color: var(--mainColor);
}


.btn-query {
    /*ie-default*/
    background: #2CAAA2;
    background: var(--mainColor);
    border-color: #2CAAA2;
    border-color: var(--mainColor);
}


.btn-add {
    /*ie-default*/
    background: #3aa56e;
    background: var(--btn-add);
    border-color: #3aa56e;
    border-color: var(--btn-add);
}



.btn-delete {
    /*ie-default*/
    background: #f45145;
    background: var(--btn-cancel);
    border-color: #f45145;
    border-color: var(--btn-cancel);
}


.btn-warning {
    /*ie-default*/
    background: #f45145;
    background: var(--btn-cancel);
    border-color: #f45145;
    border-color: var(--btn-cancel);
}



.btn-danger {
    /*ie-default*/
    background: #f45145;
    background: var(--btn-cancel);
    border-color: #f45145;
    border-color: var(--btn-cancel);
}


.btn-download {
    /*ie-default*/
    background: #3a419b;
    background: var(--btn-download);
    border-color: #3a419b;
    border-color: var(--btn-download);
}


/* 20190719 Fit */
.btn-edit {
    /*ie-default*/
    background: #4153da;
    background: var(--btn-secondary);
    border-color: #4153da;
    border-color: var(--btn-secondary);
}


.btn-exit {
    background-color: white;
    /*ie-default*/
    border-color: #2CAAA2;
    border-color: var(--mainColor);
    color: #2CAAA2;
    color: var(--mainColor);
}



.btn-clear {
    /*ie-default*/
    background: #f45145;
    background: var(--btn-cancel);
    border-color: #f45145;
    border-color: var(--btn-cancel);
}

.btn-return {
    background: white;
    /*ie-default*/
    border-color: #3888ca;
    border-color: var(--btn-back);
    color: #3888ca;
    color: var(--btn-back);
}


/* 2020 */
.btn-export {
    /*ie-default*/
    background: #3a419b;
    background: var(--btn-download);
    border-color: #3a419b;
    border-color: var(--btn-download);
}


.btn-save {
    /*ie-default*/
    background: #2CAAA2;
    background: var(--btn-save);
    border-color: #2CAAA2;
    border-color: var(--btn-save);
}

.btn-print {
    /*ie-default*/
    background: #b1466f;
    background: var(--btn-print);
    border-color: #b1466f;
    border-color: var(--btn-print);
}



.btn-detail {
    /*ie-default*/
    background: #2CAAA2;
    background: var(--mainColor);
    border-color: #2CAAA2;
    border-color: var(--mainColor);
}



.btn-link {
    font-size: 1.125rem;
    font-weight: bold;
    padding: 8px;
    background: white;
    border: none;
    /*ie-default*/
    color: #2CAAA2;
    color: var(--mainColor);
}



    .btn-link:hover, .btn-link:focus, .btn-link:active, .btn-link:active:hover {
        border: none;
        background: none !important;
        /*ie-default*/
        color: #00C9AC !important;
        color: var(--mainChromaColor) !important;
    }

.btn-search {
    min-width: 60px;
    font-size: 1.25rem;
}

.btn-play {
    /*ie-default*/
    background: #f48b45;
    background: var(--importantColor);
    border-color: #f48b45;
    border-color: var(--importantColor);
}


.btn-add .k-i-add,
.btn-edit .k-i-edit,
.btn-delete .k-i-close,
.k-header .btn-add .k-i-add,
.k-i-check, .k-i-cancel {
    display: none;
}

/*disable按鈕*/
.k-button.k-state-disabled,
.k-button.k-state-disabled:hover,
.k-button[disabled] {
    /*ie-default*/
    background: #bfbfbf;
    background: var(--disableBg);
    color: #333333;
    color: var(--disableText);
}

.outlineBtn {
    border-color: var(--mainColor);
    background: white;
    /*ie-default*/
    color: #2CAAA2;
    color: var(--mainColor);
}

.btn:hover, .btn:focus, .btn:active:hover, .k-button:active, .btn.outlineBtn:hover {
    box-shadow: none;
    color: white;
    /*ie-default*/
    background: #00C9AC;
    background: var(--mainChromaColor);
    border-color: #00C9AC;
    border-color: var(--mainChromaColor);
}

.outlineBtn:hover {
    /*ie-default*/
    border-color: #00C9AC;
    border-color: var(--mainChromaColor);
}


/*50%並排btn*/
.buttonGroup .rwd50Btn {
    width: calc(50% - 11px);
}


.btn-on {
    color: white;
    /*ie-default*/
    background: #00C9AC;
    background: var(--mainChromaColor);
    border-color: #00C9AC;
    border-color: var(--mainChromaColor);
}


.btn-off {
    background: white;
    /*ie-default*/
    color: #2CAAA2;
    color: var(--mainColor);
    border-color: #2CAAA2;
    border-color: var(--mainColor);
}