﻿body.font-ss article #newscontent {
    font-size: 1rem !important;
}

body.font-s article #newscontent {
    font-size: 1.1rem !important;
}

body.font-m article #newscontent {
    font-size: 1.2rem !important;
}

body.font-l article #newscontent {
    font-size: 1.3rem !important;
}

body.font-ll article #newscontent {
    font-size: 1.4rem !important;
}

body.font-lll article #newscontent {
    font-size: 1.5rem !important;
}
.news-list.video-list ul li a .img:after {
    content: "▶";
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.6);
    font-family: monospace;
    border-radius: 100%;
    color: #fff;
    font-size: 1.8rem;
    font-weight: bold;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.6);
    padding-left: 4px;
    padding-bottom: 4px;
    width: 50px;
    height: 50px;
    z-index: 2;
    opacity: 0.9;
}

@media (min-width: 992px) {
    .news-list.video-list ul li a .img:after {
        transform: translate(-50%, -50%) scale(1);
    }
}

#st-1 .st-btn {
    border-radius: 100% !important;
    padding: 0 !important;
    height: auto !important;
    width: 40px !important;
    height: 40px !important;
    position: relative !important;
    overflow: hidden !important;
}

    #st-1 .st-btn:hover {
        top: 0 !important;
    }

    #st-1 .st-btn > img {
        width: 34px !important;
        height: 34px !important;
        top: 50% !important;
        left: 50% !important;
        margin: 0 !important;
        transform: translate(-50%, -50%);
        position: absolute !important;
    }

    #st-1 .st-btn[data-network='facebook'] {
        background-color: #1878f3 !important;
    }

        #st-1 .st-btn[data-network='facebook'] > img {
            width: 46px !important;
            height: 46px !important;
            max-width: none !important;
            top: calc(50% + 4.6px) !important;
        }

    #st-1 .st-btn[data-network='twitter'] {
        background-color: #1da1f2 !important;
    }

    #st-1 .st-btn[data-network='line'] {
        background-color: #00c300 !important;
        color: #00c300 !important;
        fill: #00c300 !important;
    }

        #st-1 .st-btn[data-network='line']:before {
            font-family: 'Font Awesome 5 Free', "Font Awesome 5 Brands";
            content: "\f3c0";
            color: #00c300;
            font-weight: normal;
            font-size: 2.8rem;
            position: absolute;
            left: 50%;
            top: calc(50% + 2px);
            transform: translate(-50%, -50%);
            z-index: 3;
        }

        #st-1 .st-btn[data-network='line']:after {
            content: "";
            display: block;
            width: 30px;
            height: 30px;
            background: #fff;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            z-index: 2;
        }

        #st-1 .st-btn[data-network='line'] > img {
            display: none;
            width: 50px !important;
            height: 50px !important;
        }

    #st-1 .st-btn[data-network='whatsapp'] {
        background-color: #00e677 !important;
    }

        #st-1 .st-btn[data-network='whatsapp'] > img {
            width: 30px !important;
            height: 30px !important;
        }

    #st-1 .st-btn[data-network='email'] {
        background-color: #63717f !important;
    }

        #st-1 .st-btn[data-network='email'] > img {
            width: 30px !important;
            height: 30px !important;
        }

    #st-1 .st-btn[data-network='link'] {
        background-color: #0040e9 !important;
    }
.share-inline {
    display: flex;
    align-items: center;
    justify-content: center;
}
.sharethis-inline-share-buttons {
    display: inline-block !important;
    width: 240px !important;
}

ul.toolbar {
    /*background: rgba(255,255,255,0.95);*/
    border-radius: 0 !important;
    position: static;
    bottom: calc(0px + env(safe-area-inset-bottom));
    left: 0;
    top: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0 0;
    width: 100%;
    margin-bottom: 15px;
    opacity: 1;
    transform: translateY(0);
    transition: 0.3s all;
}

    ul.toolbar li a {
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        font-family: sans-serif;
        color: #0040e9;
        transform: translate(0, 0);
        font-size: 2.2rem;
        margin: 0 5px;
    }

        ul.toolbar li a.font-size {
            font-weight: bold;
        }

            ul.toolbar li a.font-size:before {
                content: attr(date-font);
                display: flex;
                width: 40px;
                height: 30px;
                justify-content: center;
                align-items: center;
                font-size: 18px;
            }

        ul.toolbar li a:hover {
            box-shadow: 0px 0px 0px #0040e9;
        }

    ul.toolbar.show {
        opacity: 1;
        transform: translateY(-60px);
    }

    ul.toolbar + ul.tag {
        margin: 32px 0;
        padding: 32px 0;
        border-top: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
    }
/* Safari 9.0+ */
@media (min-width: 576px) {
    ul.toolbar {
        border-radius: 4px;
        background: transparent;
        margin: 0;
        margin-bottom: 15px;
        position: relative;
        top: auto;
        bottom: auto;
        transition: 0.3s all;
        opacity: 1;
    }
}

ul.share-bar {
    display: inline-flex;
    flex-wrap: wrap;
    width: auto !important;
    margin: 0;
}

    ul.share-bar li a {
        color: #fff;
        background: #000;
        border-radius: 100%;
        color: #fff;
        font-size: 1.5rem;
        overflow: hidden;
    }

        ul.share-bar li a.facebook {
            background: transparent;
            color: #1878f3;
            font-size: 2.6rem;
        }

        ul.share-bar li a.twitter {
            background: #1da1f2;
        }

        ul.share-bar li a.linkedin {
            background: #2867b2;
        }

        ul.share-bar li a.line {
            background: #00c300;
            color: #00c300;
            font-size: 2.6rem;
            position: relative;
        }

            ul.share-bar li a.line:after {
                content: "";
                display: block;
                width: 34px;
                height: 34px;
                background: #fff;
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                z-index: 2;
            }

            ul.share-bar li a.line i {
                z-index: 3;
            }

        ul.share-bar li a.whatsapp {
            background: #00e677;
        }

        ul.share-bar li a.email {
            background: #63717f;
        }

        ul.share-bar li a.link {
            background: #0040e9;
        }

            ul.share-bar li a.link:hover {
                background: #ec264b;
            }

            ul.share-bar li a.link i:before {
                top: 0;
                left: 0;
                transform: translate(-50%, -50%);
            }

@media (min-width: 576px) {
    .news-list.video-list > ul > li > a:hover .img img {
        transform: scale(1.2);
    }
}

body.font-m article #newscontent {
    font-size: 1.2rem !important;
}
.video-content .desc {
    margin-bottom: 20px;
}

.article-plugin {
    margin-top: 32px;
    margin-bottom: 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
}

    .article-plugin .social-plugins {
        display: flex;
        height: 60px;
        margin-right: 10px;
        align-items: center;
    }

        .article-plugin .social-plugins div {
            margin-right: 4px;
        }

    .article-plugin ul.toolbar {
        width: auto;
        display: inline-flex;
        margin: 0;
    }

        .article-plugin ul.toolbar li a {
            border-bottom: 0;
            color: #289eff;
            padding: 0;
        }

            .article-plugin ul.toolbar li a:hover {
                color: #fff;
            }

@media (min-width: 768px) {
    .article-plugin {
        flex-direction: row;
    }
}
.article-plugin .social-plugins {
    display: flex;
    height: 60px;
    margin-right: 10px;
    align-items: center;
}

    .article-plugin .social-plugins div {
        margin-right: 4px;
    }

ul.toolbar > li > a.font-size {
    background: rgba(61,168,255,0.151);
    border-radius: 100%;
}

    ul.toolbar > li > a.font-size:hover {
        background: #0040e9;
        color: #fff !important;
        box-shadow: 0px 0px 0px #0040e9;
    }

/*---------------------
Tag標籤
---------------------*/
ul.tag {
    width:100%;
    border-radius: 4px;
    padding: 0;
    margin: 20px 0;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

    ul.tag li {
        margin-top: 10px;
        margin-right: 6px;
    }

        ul.tag li a {
            color: #289eff;
            background: rgba(61,168,255,0.151);
            cursor: pointer;
            border-radius: 4px;
            padding: 0;
            position: relative;
            overflow: hidden;
            padding: 2px 10px;
            display: block;
        }

            ul.tag li a:before {
                content: "#";
                margin-right: 2px;
            }

            ul.tag li a:after {
                content: "";
                display: block;
                width: 0;
                height: 2px;
                position: absolute;
                bottom: 0px;
                left: 50%;
                transform: translateX(-50%);
                transition: 0.3s all;
                z-index: -1;
                background: #ec264b;
            }

            ul.tag li a:hover {
                z-index: 2;
            }

                ul.tag li a:hover:after {
                    width: 100%;
                }
.yt-video {
    width: 100%;
    aspect-ratio: 16 / 9;
}