.message.cookie {
    position: fixed;
    color: #FFF;
    background: rgba(0, 0, 0, 0.87);
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 24px 0;
    z-index: 1999;
    font-weight: 300;
}

    .message.cookie img{
        height: 56px;
    }

    .message.cookie a {
        text-decoration: underline;
    }

    .message.cookie .container {
        width: 100%;
        position: relative;
        max-width: 1200px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        margin-right: auto;
        margin-left: auto;
    }

    .message.cookie .content h5 {
        font-size: 20px;
        width: 100%;
        height: inherit;
        text-align: left;
        color: #fff;
        border-radius: 5px;
        background-color: rgba(0,0,0,0);
        display: block;
        font-weight: inherit;
    }

    .message.cookie .content p a {
        color: inherit;
    }

    .message.cookie .close {
        opacity: inherit;
        font-weight: inherit;
        text-shadow: inherit;
    }

    .message.cookie .btn:hover {
        top: inherit;
    }

    .message.cookie .btn {
        letter-spacing: inherit;
    }

@media (min-width: 576px) {
    .message.cookie .container {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .message.cookie .container {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .message.cookie .container {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .message.cookie .container {
        max-width: 1140px;
    }
}

.message.cookie button, p, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, * {
    font-family: "Helvetica","Noto Sans TC", "Arial","LiHei Pro","黑體-繁","微軟正黑體", sans-serif
}

    .message.cookie .btn {
        font-size: 18px;
        padding: 0 28px;
        display: inline-block;
        height: 48px;
        line-height: 48px;
        margin-top: 10px;
        margin-bottom: 10px;
        min-width: 320px;
        max-width: 100%;
        text-align: center;
        text-decoration: none;
        border: 2px solid transparent;
        white-space: nowrap;
        border-radius: 5px;
        cursor: pointer;
        box-sizing: border-box;
    }

    .message.cookie .btn.is-block {
        width: 100%;
        max-width: 320px;
    }

    .message.cookie .btn:hover, .btn:focus {
        opacity: 1 !important;
    }

    .message.cookie .btn.btn-outline-reverse {
        color: #FFF;
        background: none;
        box-shadow: none;
        border: 2px solid white;
        line-height: 44px;
    }

        .message.cookie .btn.btn-outline-reverse:hover, .btn.btn-outline-reverse:focus {
            text-decoration: none;
            border: 1px solid #00A94F;
            color: #00A94F;
            line-height: 44px;
            background: #FFFFFF;
            border: 2px solid #E1E4E9;
            box-shadow: inset 0 -4px 0 0 #E1E4E9;
            border-radius: 5px;
        }

    .message.cookie .container {
        display: flex;
    }

    .message.cookie .content {
        flex: 1;
        padding: 0 72px 0 32px;
    }

        .message.cookie .content h5 {
            margin: 0 0 5px;
        }

        .message.cookie .content p {
            font-size: 14px;
            line-height: 1.3;
            margin-bottom: 0;
        }

    .message.cookie .action .btn {
        min-width: 240px;
    }

    .message.cookie h5 {
        font-size: 18px;
        line-height: 28px;
    }

@media screen and (max-width: 767px) {
    .message.cookie .container {
        flex-direction: column;
    }

    .message.cookie .container .image {
        display: none;
    }

    .message.cookie .container .content {
        padding: 0;
    }

    .message.cookie .container .action > .btn {
        display: block;
        min-width: 100%;
        margin: 16px 0 0;
    }
}