#demo1 {
    background: var(--secondary-color);
    border: none;
    color: var(--white-color);
    font-size: var(--p-font-size);
    font-weight: var(--font-weight-normal);
    transition: all 0.3s;
    margin-bottom: 0;
}

    #demo1:hover {
        background: var(--primary-color);
        border-color: transparent;
    }

#loadingIMG { /*   這是整個會蓋住畫面的底色色塊  */
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0%;
    top: 0%;
    background-color: #fff;
    z-index: 9999;
    opacity: 0.9;
}

#loader {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 1;
    width: 120px;
    height: 120px;
    margin: -76px 0 0 -76px;
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #0040e0;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

@@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


.custom-btn {
    background: var(--custom-btn-bg-color);
}

/* 页面header响应式高度样式 */
main header.d-flex {
    min-height: 300px;
    /* margin-top: 70px; */
}

@media screen and (min-width: 768px) {
    main header.d-flex {
        min-height: 400px;
        /* padding-top: 180px !important;
        padding-bottom: 180px !important; */
    }
}

@media screen and (min-width: 991px) {
    main header.d-flex {
        min-height: 500px;
        /* padding-top: 200px !important;
        padding-bottom: 200px !important; */
    }
}

@media screen and (min-width: 1200px) {
    main header.d-flex {
        min-height: 550px;
        /* padding-top: 230px !important;
        padding-bottom: 230px !important; */
    }
}

@media screen and (min-width: 1400px) {
    main header.d-flex {
        min-height: 600px;
        /* padding-top: 260px !important;
        padding-bottom: 260px !important; */
    }
}
