﻿@charset "UTF-8";
/*!
 * Cookie Bar component (https://github.com/kovarp/jquery.cookieBar)
 * Version 1.2.0
 *
 * Copyright 2018 Pavel Kovář - Frontend developer [www.pavelkovar.cz]
 * Licensed under MIT (https://github.com/kovarp/jquery.cookieBar/blob/master/LICENSE)
 */
/* Settings */
/* Cookie Bar styles */
.cookie-bar__inner {
    padding: 30px;
    margin: auto;
    background: linear-gradient(180deg, rgb(231, 231, 231), rgb(212, 221, 230));
    text-align: center;
    font-family: 微軟正黑體;
    color: #2D2D2D;
}

@media (min-width: 62rem) {
    .cookie-bar__inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: block;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
}

.cookie-bar__buttons {
    display: block;
    padding: 0px 30px;
    border-radius: 20px;
    margin-top: 20px;
}

@media (min-width: 62rem) {
    .cookie-bar__buttons {
        /* display: inline; */
        margin-top: 0;
    }
}

.cookie-bar__btn {
    display: block;
    border: none;
    border-radius: 22px;
    text-decoration: none;
    background-color: #454A4F;
    background-size: 100% 200%;
    background-image: linear-gradient(to bottom, transparent 50%, #8C5E58 50%);
    color: white;
    margin: auto;
    padding: 12px 37px;
    margin-top: 20px;
    box-shadow: 0px 4px 16px 8px #454A4F 33;
    transition: background-position 0.3s cubic-bezier(0.19, 1, 0.22, 1) 0.1s, color 0.5s ease-out 0s, background-color 0.5s ease-out;
    cursor: pointer;
}

    .cookie-bar__btn:hover {
        background-color: #8C5E58;
        background-position: -100% 100%;
    }

    .cookie-bar__btn:active {
        background-color: #8C5E58;
    }

.cookie-bar__link {
    margin: 0 .5rem;
}

.cookie-bar a {
    /* display: inline-block; */
    font-weight: 500;
    color: #ff3b3b;
    position: relative;
    text-decoration: none;
    font-weight: bold;
}

    .cookie-bar a:hover {
        text-decoration: none;
    }

/* Privacy popup */
.cookie-bar-privacy-popup {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

    .cookie-bar-privacy-popup.cookie-bar-privacy-popup--hidden {
        display: none;
    }

.cookie-bar-privacy-popup__dialog {
    background-color: white;
    width: 100%;
    max-width: 50rem;
    max-height: 90vh;
    overflow: auto;
    padding: 2rem 1.5rem 1.5rem;
    position: relative;
}

.cookie-bar-privacy-popup__dialog__close {
    position: absolute;
    top: 0;
    right: 0;
    background-color: black;
    color: white;
    display: block;
    width: 2rem;
    height: 2rem;
    border: none;
    cursor: pointer;
}

    .cookie-bar-privacy-popup__dialog__close:before, .cookie-bar-privacy-popup__dialog__close:after {
        content: '';
        display: block;
        width: 1rem;
        height: .25rem;
        background-color: white;
        position: absolute;
        top: 50%;
        left: 25%;
        -webkit-transform-origin: center center;
        -ms-transform-origin: center center;
        transform-origin: center center;
        margin-top: -.125rem;
    }

    .cookie-bar-privacy-popup__dialog__close:before {
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .cookie-bar-privacy-popup__dialog__close:after {
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

.cookie-bar-privacy-popup__dialog p:last-child {
    margin-bottom: 0;
}

/* Cookie Bar layouts */
.cookie-bar--bottom-left,
.cookie-bar--bottom-right,
.cookie-bar--bottom {
    z-index: 999;
    position: fixed;
}

.cookie-bar--bottom {
    right: 0;
    bottom: 0;
    left: 0;
}

.cookie-bar--bottom-left {
    left: 0.9375rem;
}

.cookie-bar--bottom-right {
    right: 0.9375rem;
}

.cookie-bar--bottom-right,
.cookie-bar--bottom-left {
    bottom: 0.9375rem;
}

@media (min-width: 48rem) {
    .cookie-bar--bottom-right,
    .cookie-bar--bottom-left {
        width: 22.5rem;
    }

    .cookie-bar--bottom-right .cookie-bar__inner,
    .cookie-bar--bottom-left .cookie-bar__inner,
    .cookie-bar--bottom-right .cookie-bar__buttons,
    .cookie-bar--bottom-left .cookie-bar__buttons {
        display: block;
    }

    .cookie-bar--bottom-right .cookie-bar__buttons,
    .cookie-bar--bottom-left .cookie-bar__buttons {
        margin-top: .375rem;
    }
}

@media (max-width: 62rem) {
    .cookie-bar__btn {
        margin-top: 0px;
    }
}

.cookie-bar--bottom-right .cookie-bar__inner,
.cookie-bar--bottom-left .cookie-bar__inner {
    line-height: 1.3;
}
