body {
        margin: 0;
        font-family: 'Noto Sans TC', sans-serif;
        background-color: #efe9d8;
    }
    
    img {
        width: 100%;
    }
    
    a {
        color: white;
        text-decoration: none;
    }
    /* ------------- content -------------- */
    
    .content {
        position: relative;
    }
    
    .content-text {
        width: 85%;
        font-size: 2rem;
        letter-spacing: 1px;
        line-height: 3rem;
        color: #444444;
        margin: 5vw auto;
    }
    .content-text.alert {
        font-size: 1.5rem;
        line-height: 2rem;
        color: #999;
    }
    
    .content-img {
        width: 65%;
        line-height: 0vw;
        color: white;
        margin: 5% auto;
        text-align: center;
    }
    
    .content-btn {
        width: 100%;
        text-align: center;
        position: fixed;
        bottom: 0;
        background-color: #efe9d8;
    }
    
    .content-btn img {
        width: 30%;
        margin: 5% 2%;
    }
    
    .content-space {
        height: 25vh;
    }
    
    #alert-hand {
        width: 55%;
        position: absolute;
        margin-left: -40%;
        margin-top: 40%;
    }
    /* ----------------------------------- */
    /* ------------ logo part ------------ */
    
    .logo {
        width: 100%;
        margin: auto;
        position: relative;
    }
    /* ----------------------------------- */
    
    @media(max-width: 767px) {
        .content-text {
            font-size: 1rem;
            line-height: 2rem;
        }
        .content-text.alert {
            font-size: 0.8rem;
            line-height: 1.5rem;
            color: #999;
        }
        .content-btn img {
        width: 40%;
    }
        .content-space {
            height: 15vh;
        }
    }