@charset "utf-8";
/* CSS Document */
/*body .menu li:nth-child(3) ul {
    display: block !important;
}*/
html, body {
    height: auto !important;
}

body {
    letter-spacing: 1px;
    padding: 0 0 0 0 !important;
    font-size: 1em;
    color: #4a4949 !important;
    font-family: "微軟正黑體" !important;
    position: relative;
    background-image: url(../images/index/index_bg.jpg);
    background-repeat: no-repeat;
    background-position: center top;
}

    body.home {
        background-image: url(../images/home/home_bg.jpg);
        background-color: #ffe4a2;
    }

    body a {
        transition: all 200ms ease-out;
        color: #337ab7;
    }

@media print {
    a[href]:after {
        content: none !important;
    }
}

ul, li {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

body h2 {
    margin: 0;
}

label {
    margin: 0;
    font-weight: normal; /* display: inherit; */
}

.clearfix:before, .clearfix:after {
    content: "";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    zoom: 1;
}

a.accesskey {
    position: absolute;
}

body.home .content.small {
    font-size: 95%;
}

body.home .content.medium {
    font-size: 100%
}

body.home .content.big {
    font-size: 105%
}

body .into a {
    color: rgba(255, 255, 255, 0);
    display: block;
    position: absolute;
    z-index: 999;
}

/* albert 2020.5.4 add*/
    body .into a:hover {
        color: rgb(187, 187, 187) !important;
    }

body .center {
    max-width: 1200px;
    position: relative;
    margin: auto;
    padding: 0;
    width: 100%;
}

body .container {
    position: relative;
    width: 100%;
    padding: 0;
}

    body .container .row {
        padding: 0;
    }

body.in .container .row {
    margin: 0;
}

    body.in .container .row.center {
        width: 100%;
        max-width: inherit;
    }

/*-------TOP----------*/

body .top h1 {
    margin: 0;
    position: absolute;
    top: 20px;
    left: 0;
}

    body .top h1 a {
        display: block;
        height: 100%;
    }

    body .top h1 img {
        width: 100%;
        max-width: 230px;
    }

body .top {
    position: relative;
    height: 120px;
    z-index: 9;
    top: 0;
    background-color: #c8000a;
}

    body .top .center::after {
        content: "";
        background-image: url(../images/all/slogn.png);
        background-repeat: no-repeat;
        display: block;
        position: absolute;
        width: 305px;
        height: 65px;
        left: 320px;
        top: 44px;
        background-size: 100%;
    }

    body .top::before {
        background-color: #fff;
        content: "";
        display: block;
        height: 120px;
        width: 20%;
        position: absolute;
    }

    body .top .center::before {
        content: "";
        height: 120px;
        display: block;
        position: absolute;
        width: 270px;
        background-color: #fff;
        left: 0;
    }

    body .top.smaller {
        position: fixed;
        width: 100%;
    }

    body .top .toplink, body .top .top_search {
        position: absolute;
    }

    body .top .top_search {
        right: 0;
        top: 45px;
        width: 100%;
        max-width: 385px;
        padding: 0 0 0 30px;
    }

        body .top .top_search label {
            display: block;
        }

        body .top .top_search .icon {
        }

        body .top .top_search input {
            border: none;
            padding: 7px 15px;
            background-color: #ffffff;
            border-radius: 50px;
            /*color: #faf2ef;*/
            color: #555555;
            width: 100%;
        }

        body .top .top_search .ad_search {
            font-size: 90%;
            position: relative;
            top: 2px;
        }

            body .top .top_search .ad_search .adv {
                position: absolute;
                right: 10px;
                top: -1px;
            }

                body .top .top_search .ad_search .adv a {
                    color: #e9fc02;
                    text-decoration: underline;
                    letter-spacing: 0;
                }

            body .top .top_search .ad_search .hot {
                padding: 0 65px 0 0;
                text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap;
                color: #fff;
            }

                body .top .top_search .ad_search .hot a {
                    color: #fff;
                }

        body .top .top_search input::placeholder {
            color: #9f9f9f;
        }

        body .top .top_search .icon {
            width: 25px;
            position: absolute;
            left: 0;
            top: 7px;
        }

            body .top .top_search .icon img {
                width: 100%;
            }

    body .top .toplink {
        top: 10px;
        right: 0;
        padding: 0 5px 5px 15px;
    }

        body .top .toplink a, body .top .toplink {
            color: #fff;
            font: inherit;
            font-size: 95%;
        }

            body .top .toplink a {
                padding: 0 2px;
                letter-spacing: 0;
                white-space: nowrap;
                font-size: 100%;
            }

                body .top .toplink a.fb {
                    background-image: url(../images/all/top_fb.gif);
                    background-repeat: no-repeat;
                    background-position: left top;
                    width: 18px;
                    height: 18px;
                    text-indent: -9999px;
                    display: inline-block;
                    position: relative;
                    top: 2px;
                }

                    body .top .toplink a.fb:hover {
                        background-position: left bottom;
                    }

                body .top .toplink a.accesskey {
                    top: 0;
                    position: absolute;
                    width: auto;
                    left: 0px;
                }
/*-----選單----*/

body .menu {
    position: relative;
    z-index: 999;
    padding: 0;
    background-image: url(../images/all/menu_bar.png);
    background-repeat: no-repeat;
    background-position: center;
    height: 85px;
}

    body .menu::before, body .menu::after {
        content: "";
        width: 598px;
        height: 85px;
        position: absolute;
    }

    body .menu::before {
        background-image: url(../images/all/menu_bar_l.png);
        left: 0;
    }

    body .menu::after {
        background-image: url(../images/all/menu_bar_r.png);
        right: 0;
    }

    body .menu a.accesskey {
        color: #fff;
        z-index: 9999;
    }

body.home .menu-container .menu {
    border-top: none;
}

body .center.menu a.accesskey {
    position: absolute !important;
    width: auto;
}

body .menu.smaller {
    top: -15px;
    position: fixed;
    width: 100%;
    max-width: 1200px;
    bottom: inherit;
    background-position: center bottom;
    z-index: 999;
}
/*------------banner-------------*/
.banner_box {
    display: none;
}

body .banner.slider {
    margin: 0 0 0 0;
    padding: 0;
}

    body .banner.slider img {
        width: 100%;
        z-index: 0;
        position: relative;
    }

    body .banner.slider .txt {
        position: absolute;
        background-color: rgba(0, 0, 0, 0.57);
        bottom: 0;
        width: 100%;
        z-index: 9;
        padding: 15px;
        color: #fff;
    }

        body .banner.slider .txt .title {
            font-size: 130%;
        }

        body .banner.slider .txt p {
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }

    body .banner.slider .slick-dots {
        bottom: -50px;
        z-index: 99;
        right: 0;
    }

        body .banner.slider .slick-dots li button:before {
            width: 30px;
            height: 30px;
            font-size: 120%;
            color: #eb9004;
            opacity: 0.5;
        }

        body .banner.slider .slick-dots li.slick-active button:before {
            color: #000;
        }

        body .banner.slider .slick-dots li button:hover:before, body .banner.slider .slick-dots li button:focus:before {
            color: #000;
        }

/*---------area02------------*/
body .area02 {
    background-image: url(../images/index/area02bg.png);
    background-repeat: no-repeat;
    margin: 0;
    padding: 40px 0 130px 0;
    clear: both;
    background-position: top center;
}
/*---------area01------------*/
body .container .area01 {
    background-image: url(../images/index/area01bg.jpg);
    background-repeat: no-repeat;
    background-position: bottom center;
}
/*-----商品輪播--------*/
body.in .category .product {
    margin: 0;
    padding: 0 40px;
}

body.in .category .title span {
    color: #0d8fa1;
    font-size: 140%;
    background-color: #fff;
    padding: 0 10px;
    line-height: 45px;
}

body.in .category .title, body.in .wlink .ntitle {
    padding: 45px 0;
}

body.in .category {
    padding: 0 0 30px 0;
}

    body.in .category .product a:hover .pic {
        border: 1px #00c4ff solid;
        opacity: 0.8;
    }

    body.in .category .pic img {
        max-width: 100%;
        max-height: 100%;
        margin: auto;
    }

    body.in .category.product .pic img {
        max-height: 350px;
        border: 1px #d8d8d8 solid;
        max-width: 100%;
        height: 300px;
        margin: auto;
    }

    body.in .category .pic {
        margin: 0;
        background-color: #fff;
        height: 250px;
        vertical-align: middle;
        display: inline-flex;
        align-items: center;
        text-align: center;
        overflow: hidden;
        width: 100%;
    }

    body.in .category .pic_list .pic img {
        width: auto;
        max-width: 100%;
        max-height: 100%;
        border: none;
        margin: auto;
    }

    body.in .category .pic_list .pic {
        background-color: #b5b5b5;
        margin: 0;
        height: 215px;
        text-align: center;
    }

    body.in .category .slick-slide {
        padding: 5px;
    }

    body.in .category .pic_list ul li a {
        padding: 0;
    }

    body.in .category .pic_list {
        padding: 15px 10px 0 10px;
    }

        body.in .category .pic_list ul li {
            padding: 0px 5px 10px 5px;
        }

            body.in .category .pic_list ul li a:hover {
                padding: 0;
                background-color: transparent;
            }

                body.in .category .pic_list ul li a:hover .title {
                    background-color: #000;
                }

            body.in .category .pic_list ul li .title {
                position: absolute;
                background-color: rgba(0, 0, 0, 0.56);
                bottom: 0;
                margin: 0;
                padding: 5px;
                overflow: hidden;
                width: 100%;
                color: #fff;
                transition: all 200ms ease-out;
            }

            body.in .category .pic_list ul li .date {
                color: rgba(255, 255, 255, 0.69);
                font-size: 70%;
                font-weight: normal;
            }

    body.in .category ul li .title {
        margin-top: 23px;
    }

    body.in .category .list .date {
        top: 8px;
    }

    body.in .category .slick-prev:before, body.in .category .slick-next:before {
        font-family: cursive;
        color: #252525;
        font-size: 300%;
        opacity: 0.4;
        font-weight: bolder;
        display: block;
    }

    body.in .category .slick-prev:before {
        content: "<";
    }

    body.in .category .slick-prev {
        left: 25px;
        z-index: 99;
        width: 25px;
        height: 50px;
    }

    body.in .category .slick-next {
        right: 25px;
        width: 25px;
        height: 50px;
    }

        body.in .category .slick-next:before {
            content: ">";
        }

    body.in .category .p_name {
        letter-spacing: 0;
        margin: 2px 0 0 0;
        background-image: url(../images/index/product_shadow.png);
        min-height: 60px;
        background-repeat: repeat-x;
        padding: 10px;
        letter-spacing: 1px;
    }

    body.in .category .red {
        color: #fb0303;
    }

    body.in .category .graphic_list .date {
        margin: 0;
    }

    body.in .category p {
        font-size: 105%;
        color: #000;
        padding: 5px 0;
        text-align: center;
    }

    body.in .category .title p {
        font-size: 170%;
        padding: 0;
        letter-spacing: 7px;
    }

    body.in .category .title .en {
        font-size: 50%;
        letter-spacing: 1px;
    }
/*---------訊息專區--------*/
body.in .news {
    padding: 35px 10px;
    text-align: center;
}

    body.in .news .ntitle {
        padding: 30px 0;
    }

        body.in .news .ntitle p, body.in .wlink .ntitle p {
            font-size: 150%;
            letter-spacing: 5px;
            color: #000;
        }

            body.in .news .ntitle p.en, body.in .wlink .ntitle p.en {
                font-size: 40%;
                letter-spacing: 1px;
            }

    body.in .news ul li a {
        display: block;
        padding: 20px 15px;
        position: relative;
        text-decoration: none;
    }

    body.in .news ul li:nth-child(2n+1) a {
        background-color: rgba(161, 115, 30, 0.2);
    }

    body.in .news ul li a:hover {
        background-color: #FFEB3B !important;
    }

    body.in .news ul li .title {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        font-size: 110%;
        color: #000000;
        padding: 0;
        background-image: none;
    }

    body.in .news ul li .txt {
        font-size: 95%;
        padding: 1px;
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        color: #575757;
        height: 40px;
    }

    body.in .news ul li .date {
        letter-spacing: 0;
        background-color: #004a79;
        color: #fff;
        padding: 1px 10px;
        float: left;
        margin-right: 10px;
        border-radius: 5px;
    }

    body.in .news ul li:nth-child(2n+1) .date {
        background-color: #977b43;
    }

    body.in .news .more {
        text-align: center;
        margin-top: 45px;
    }

        body.in .news .more a {
            background-color: #f4b837;
            color: #ffffff;
            text-decoration: none;
            border-radius: 100px;
            width: 100px;
            height: 100px;
            line-height: 100px;
            display: inline-block;
        }

            body.in .news .more a:hover {
                background-color: #005585;
                color: #fff;
            }

    body.in .news li {
        margin: 0 0 0 0;
        border: none;
        padding: 0;
        text-align: left;
    }

        body.in .news li:nth-child(5) a {
            background-color: #f89e00;
        }
/*--------------------------*/


/*------廣告連結-----*/
body.in .link_box {
    margin-top: 140px;
}

    body.in .link_box ul li a {
        display: block;
    }

        body.in .link_box ul li a:hover {
            transform: rotate(0deg) scale(0.946) skew(0deg) translate(0px) !important;
            -webkit-transform: rotate(0deg) scale(0.946) skew(0deg) translate(0px) !important;
            -moz-transform: rotate(0deg) scale(0.946) skew(0deg) translate(0px) !important;
            -o-transform: rotate(0deg) scale(0.946) skew(0deg) translate(0px) !important;
            -ms-transform: rotate(0deg) scale(0.946) skew(0deg) translate(0px) !important;
        }

    body.in .link_box ul li img {
        width: 100%;
        max-width: 294px;
    }

    body.in .link_box ul li {
        padding: 6px 0;
    }

        body.in .link_box ul li:nth-child(1) a {
            transform: rotate(1deg);
            -webkit-transform: rotate(1deg);
            -moz-transform: rotate(1deg);
            -o-transform: rotate(1deg);
            -ms-transform: rotate(1deg);
        }

        body.in .link_box ul li:nth-child(2) a {
            transform: rotate(-1deg);
            -webkit-transform: rotate(-1deg);
            -moz-transform: rotate(-1deg);
            -o-transform: rotate(-1deg);
            -ms-transform: rotate(-1deg);
        }

        body.in .link_box ul li:nth-child(3 a) {
            transform: rotate(1deg);
            -webkit-transform: rotate(1deg);
            -moz-transform: rotate(1deg);
            -o-transform: rotate(1deg);
            -ms-transform: rotate(1deg);
        }

    body.in .link_box .slick-slide img {
        margin: auto;
    }
/*------相關網站連結--------*/
body.in .wlink {
    clear: both;
    text-align: center;
}

    body.in .wlink ul li {
        display: inline-block;
        padding: 5px 0;
    }

        body.in .wlink ul li a {
            display: block;
            border: 3px #fff solid;
        }

            body.in .wlink ul li a:hover {
                opacity: 0.7;
            }

    body.in .wlink ul {
        display: inline-block;
    }
/*--------home----------------------*/
body.home .container {
    /* background-image: url(../images/home/home_bg.jpg); */
    /* background-repeat: no-repeat; */
    /* background-position: center bottom; */
}

body.home .content .center {
    padding: 0 30px 0 0;
}

body.home .content {
}

body.home .left_menu a.accesskey {
    left: 0;
}

body.home .container .row {
    background-image: url(../images/home/home_body.png);
    background-repeat: repeat-y;
    background-position: center top;
    margin: 180px auto 0 auto;
}

    body.home .container .row::before {
        content: "";
        background-image: url(../images/home/home_body_top.png);
        position: absolute;
        width: 100%;
        display: block;
        height: 468px;
        top: -120px;
        background-position: center top;
    }

body.home .bread {
    padding: 20px 0 20px 25px;
    font-size: 95%;
    letter-spacing: 0;
    position: relative;
    top: -85px;
    /* left: 15px; */
}

    body.home .bread .center {
        padding: 0 40px;
    }

    body.home .bread a {
        color: #000;
    }

        body.home .bread a.home {
            background-image: url(../images/home/icon_home.png);
            background-repeat: no-repeat;
            background-position: left bottom;
            padding: 0 0 0 25px;
        }

        body.home .bread a.accesskey {
            left: 10px;
        }

    body.home .bread .this {
        color: #005687;
        font-weight: bold;
    }
/*--------右內容-------------*/

body.home .content .plus ul {
    margin: 0 0 0 10px;
    display: inline-block;
    position: relative;
}
/*-----------分享-----------*/
body.home .content .plug {
    float: right;
    margin: -140px 0 10px 0;
    padding: 0 10px 0 0;
}

    body.home .content .plug .group {
        display: inline-block;
        position: relative;
        float: left;
    }

    body.home .content .plug .set.group {
        margin-left: 5px;
        float: left;
    }

    body.home .content .plug li {
        float: left;
        font-size: 100%;
        color: #000000;
        margin-right: 3px;
        font-weight: normal;
        letter-spacing: 0;
    }

        body.home .content .plug li a {
            background-image: url(../images/home/icon_plug.png);
            text-indent: -9999px;
            width: 29px;
            height: 29px;
            border-radius: 50px;
            display: block;
        }

    body.home .content .plug .set li a {
        background-image: none;
        text-indent: 0;
        color: #fff;
        text-align: center;
        line-height: 28px;
        text-decoration: none;
        border-radius: 50px;
    }

        body.home .content .plug .set li a:hover {
            background-color: #2795b5;
        }

    body.home .content .plug a:hover {
        background-position-y: 30px !important;
    }

    body.home .content .plug .skip a {
        background: none;
        text-indent: inherit;
        width: auto;
        height: auto;
        line-height: 40px;
    }

    body.home .content .plug .fb a {
        background-position-x: 0;
        background-color: #3b5998;
    }

    body.home .content .plug .twitter a {
        background-position-x: -30px;
        background-color: #55acee;
    }

    body.home .content .plug .line a {
        background-position-x: -88px;
        background-color: #4dac2c;
    }

    body.home .content .plug .google a {
        background-position-x: -59px;
        background-color: #db402c;
    }

    body.home .content .plug .print a {
        background-position: -117px 0;
        background-color: #4aacc7;
    }

    body.home .content .plug .l a {
        background-color: #000000;
        font-size: 120%;
    }

body.home .content.big .plug .l a, body.home .content.small .plug .s a, body.home .content.medium .plug .m a {
    background-color: #af0000;
}

body.home .content .plug .m a {
    background-color: #000000;
}

body.home .content .plug .s a {
    background-color: #000000;
    font-size: 90%;
}

body.home .content {
    padding: 0 0 150px 0;
    /* min-height: 1300px; */
    position: relative;
}

    body.home .content .bar {
        /* background-color: #ffe7b3; */
        clear: both;
        margin: -70px 0 0 0;
    }

    body.home .content .title {
        color: #000000;
        font-size: 175%;
        letter-spacing: 2px;
        /* font-weight: bold; */
        padding: 15px 15px 15px 85px;
        background-image: url(../images/home/title_icon.png);
        background-repeat: no-repeat;
        background-position: 20px 0;
    }

    body.home .content .detail .title {
        background-image: none;
        text-align: center;
        color: #000;
        font-size: 120%;
        font-weight: normal;
        padding: 10px 0;
    }

    body.home .content .detail .pic img {
        width: 100%;
    }

    body.home .content .detail a {
        display: block;
        text-decoration: none;
    }

    body.home .content .detail .area01 a:hover {
        transform: scale(0.95, 0.95);
    }

    body.home .content .detail .title::before {
        display: none;
    }

    body.home .content .area01 li a {
        display: block;
        font-size: 120%;
        color: #000;
        line-height: 50px;
        background-color: #fff;
        text-align: center;
        border: 1px #bdbdbd solid;
        box-shadow: 4px 4px 1px rgba(0, 0, 0, 0.2);
        text-decoration: none;
        white-space: nowrap;
    }

        body.home .content .area01 li a:hover {
            background-color: #ffc427;
        }

        body.home .content .area01 li a span {
            margin: 0 7px 0 0;
        }

    body.home .content .area01 li {
        padding: 6px 5px;
    }

    body.home .content .detail .search_box {
        background-color: #eceade;
        border-radius: 10px;
        padding: 10px;
    }

    body.home .content .detail .news_list .title_bar {
        background-color: #d4461a;
        border-radius: 5px;
        margin: 10px 0 0 0;
        color: #fff;
        font-size: 120%;
        position: relative;
        height: 45px;
        line-height: 45px;
    }

    body.home .content .detail .news_list .list {
        padding: 0 5px;
    }

    body.home .content .page {
        text-align: center;
        border-top: 3px #9e8652 solid;
        padding: 30px 0 0 0;
    }

    body.home .content .note {
        text-align: right;
        color: #848484;
        padding: 10px 0;
        margin: 20px 0 0 0;
        font-size: 95%;
        clear: both;
    }

        body.home .content .note ul {
            float: right;
        }

            body.home .content .note ul li {
                float: left;
                margin-left: 10px;
                padding: 0 0 5px 0;
                color: #000;
                letter-spacing: 0;
            }

        body.home .content .note span {
            color: #777;
            font-weight: bold;
        }

    body.home .content .page_info div {
        display: inline-block;
    }

    body.home .content .page_info {
        text-align: center;
    }

        body.home .content .page_info .red {
            color: #b90000;
            margin: 0 2px;
        }

    body.home .content .page ul, body.home .content .page ul li {
        display: inline-block;
    }

    body.home .content .page li a {
        position: relative;
        /* background-color: #24b6cb; */
        display: block;
        float: left;
        color: #fff;
        text-decoration: none;
        background-repeat: no-repeat;
        border-radius: 50px;
        background: rgb(41,10,89);
        background: -moz-linear-gradient(135deg, rgba(41,10,89,1) 0%, rgba(0,107,164,1) 100%);
        background: -webkit-linear-gradient(135deg, rgba(41,10,89,1) 0%, rgba(0,107,164,1) 100%);
        background: linear-gradient(135deg, rgba(41,10,89,1) 0%, rgba(0,107,164,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#290a59",endColorstr="#006ba4",GradientType=1);
    }

        body.home .content .page li a:hover {
            /* background-color: #d4a405; */
            background: rgb(231,167,89);
            background: -moz-linear-gradient(135deg, rgba(231,167,89,1) 0%, rgba(210,8,8,1) 100%);
            background: -webkit-linear-gradient(135deg, rgba(231,167,89,1) 0%, rgba(210,8,8,1) 100%);
            background: linear-gradient(135deg, rgba(231,167,89,1) 0%, rgba(210,8,8,1) 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e7a759",endColorstr="#d20808",GradientType=1);
        }

    body.home .content .page li.back a::before {
        background-image: url(../images/home/page_05.png) !important;
        width: 24px;
        height: 15px;
        left: 8px;
        top: 13px;
    }

    body.home .content .page li:nth-child(1) a, body.home .content .page li:nth-child(2) a {
        /* background-position: 10px center; */
        padding: 10px 10px 10px 25px;
    }

    body.home .content .page li:nth-child(3) a, body.home .content .page li:nth-child(4) a {
        /* background-position: 65px center; */
        padding: 10px 25px 10px 10px;
    }

    body.home .content .page li:nth-child(1) a::before {
        background-image: url(../images/home/page_01.png);
        content: "";
        left: 10px;
        top: 16px;
    }

    body.home .content .page li.back a {
        padding: 10px 10px 10px 40px;
    }

    body.home .content .page li a::before {
        content: "";
        position: absolute;
        width: 11px;
        height: 11px;
        background-repeat: no-repeat;
        background-position: center;
    }

    body.home .content .page li:nth-child(2) a::before {
        background-image: url(../images/home/page_02.png);
        left: 10px;
        top: 16px;
    }

    body.home .content .page li:nth-child(3) a::before {
        background-image: url(../images/home/page_03.png);
        right: 10px;
        top: 16px;
    }

    body.home .content .page li:nth-child(4) a::before {
        background-image: url(../images/home/page_04.png);
        right: 10px;
        top: 16px;
    }

    body.home .content .detail .list li {
        border-bottom: 1px #d4d3ce solid;
    }

    body.home .content .detail .news_list .list .icon {
        color: #fff;
        width: 30px;
        height: 30px;
        line-height: 30px;
        text-align: center;
        position: absolute;
        font-size: 110%;
        left: 14px;
        top: 12px;
    }

    body.home .content .detail .news_list .list .txt {
        display: inline-block;
        color: #575757;
        font-size: 115%;
        white-space: nowrap;
        overflow: hidden;
        width: 100%;
        text-overflow: ellipsis;
        padding: 0 90px 0 60px;
    }

    body.home .content .detail .news_list .list .date {
        position: absolute;
        color: #000;
        letter-spacing: 0;
        right: 8px;
        top: 18px;
    }

    body.home .content .detail .news_list .list .icon.a {
        background-color: #cb003b;
    }

    body.home .content .detail .news_list .list .icon.b {
        background-color: #FF5722;
    }

    body.home .content .detail .news_list .list .icon.c {
        background-color: #dcb01c;
    }

    body.home .content .detail .news_list .list .icon.d {
        background-color: #7ba716;
    }

    body.home .content .detail .news_list .list .icon.e {
        background-color: #4da8c7;
    }

    body.home .content .detail .news_list .list .icon.f {
        background-color: #3b5a98;
    }

    body.home .content .detail .news_list .list .icon.g {
        background-color: #7b3ca7;
    }

    body.home .content .detail .news_list .list li a {
        display: block;
        text-decoration: none;
        position: relative;
        padding: 15px 0;
    }

        body.home .content .detail .news_list .list li a:hover {
            background-color: rgba(255, 221, 0, 0.4);
        }

    body.home .content .detail .news_list .list li:nth-child(2n+2) {
        background-color: rgba(233, 226, 182, 0.3);
    }

    body.home .content .detail .news_list .title_bar .t2 {
        text-align: center;
    }

    body.home .content .detail .news_list .title_bar .t3 {
        text-align: right;
    }

    body.home .content .detail .search_box div {
        position: relative;
        padding: 3px 5px 3px 5px;
    }

    body.home .content .detail .search_box .keyin input[type=button] {
        width: 90px;
        position: absolute;
        color: #fff;
        top: 3px;
    }

        body.home .content .detail .search_box .keyin input[type=button]:hover {
            background-color: #000000;
        }

    body.home .content .detail .search_box .keyin input.ok {
        right: 95px;
        background-color: #e68f1d;
    }

    body.home .content .detail .search_box .keyin input.clean {
        right: 0;
        background-color: #d4461a;
    }

    body.home .content .detail .search_box .start, body.home .content .detail .search_box .end {
        padding: 5px 45px 5px 5px;
    }

    body.home .content .detail .search_box .keyin {
        padding: 3px 190px 3px 5px;
    }

    body.home .content .detail .search_box label {
        margin: 0;
        font-weight: normal;
        display: inherit;
    }

    body.home .content .detail .search_box .end a.icon {
        right: 12px;
    }

    body.home .content .detail .search_box a.icon {
        display: block;
        position: absolute;
        right: 0;
        top: 9px;
        color: #000;
        text-decoration: none;
    }

    body.home .content .detail .search_box input, body.home .content .detail .search_box select {
        width: 100%;
        font-size: 115%;
        padding: 5px;
        border-radius: 5px;
        border: none;
    }

    body.home .content .title::before {
        width: 42px;
        height: 32px;
        display: inline-block;
        background-repeat: no-repeat;
        position: relative;
        top: 5px;
        margin-right: 8px;
    }

    body.home .content .plus ul li {
        float: left;
    }

        body.home .content .plus ul li a {
            background-image: url(../images/home/plus.png);
            display: block;
            width: 31px;
            height: 30px;
            text-indent: -9999px;
            text-align: center;
            opacity: 1;
            margin: 0 2px;
        }

        body.home .content .plus ul li:nth-child(1) a {
            background-position: 0 0;
        }

        body.home .content .plus ul li:nth-child(2) a {
            background-position: -34px 0;
        }

        body.home .content .plus ul li:nth-child(3) a {
            background-position: -68px 0;
        }

        body.home .content .plus ul li:nth-child(4) a {
            background-position: -101px 0;
        }

        body.home .content .plus ul li:nth-child(5) a {
            background-position: -137px 0;
        }

        body.home .content .plus ul li:nth-child(6) a {
            background-position: -171px 0;
        }

        body.home .content .plus ul li:nth-child(7) a {
            background-position: -206px 0;
        }

    body.home .content .plus ul.size li:nth-child(2) a {
        background-color: #94c128;
        font-size: 150%;
    }

    body.home .content .plus ul.size li:nth-child(3) a {
        background-color: #28c194;
        font-size: 140%;
    }

    body.home .content .plus ul.size li:nth-child(4) a {
        background-color: #54b5d1;
        font-size: 120%;
    }

    body.home .content .plus ul li a:hover {
        opacity: 0.7;
    }

body .fat_box {
    padding: 0;
    position: relative;
    z-index: 99;
    height: 100%;
    /* 【無障礙修正-PDF問題 1.4.3】
       原因：「點選收合」等白色文字(#ffffff)在 #3fb1ac 背景上對比值僅 2.59（嚴重不足）。
       修正：背景調深為 #1A6B68，對比值提升至 4.7:1，符合 WCAG AA 規定。 */
    background-color: #1A6B68;
    border-bottom: 1px rgba(255, 255, 255, 0.23921568627450981) solid;
}

    body .fat_box::before {
        content: "";
        width: 100%;
        background-image: url(../images/all/foot_wave.png);
        height: 87px;
        position: absolute;
        background-position: center top;
        top: -87px;
    }

body .footer_box .gotop {
    position: fixed;
    right: 5px;
    bottom: 130px;
    z-index: 9999;
    text-align: center;
}

body .footer_box {
    padding: 0 0 10% 0;
    /* 【無障礙修正-PDF問題 1.4.3】footer 底色同步調深，與 fat_box 保持視覺一致性 */
    background-color: #1A6B68;
    position: relative;
}

    body .footer_box .gotop a {
        width: 70px;
        height: 70px;
        background-color: #000;
        display: block;
        opacity: 0.2;
        color: #fff;
        line-height: 70px;
        text-decoration: none;
        border-radius: 50px;
    }

        body .footer_box .gotop a:hover {
            opacity: 0.5;
        }

body .fat_box .center {
    text-align: center;
    background-color: transparent !important;
    top: 0 !important;
}

body .fat_box .ui-accordion .ui-accordion-icons {
}

body .fat_box .ui-accordion .ui-accordion-header {
    margin: 0 auto;
    padding: 0;
    background: transparent;
    border: none;
    display: inline-block;
    text-align: center;
    position: relative;
    color: #000;
    transition: all 200ms ease-out;
}

    body .fat_box .ui-accordion .ui-accordion-header::before {
        content: "[  點選收合  ]";
        color: #ffffff;
        position: relative;
        font-weight: bold;
        top: -15px;
    }

    body .fat_box .ui-accordion .ui-accordion-header.ui-corner-all::before {
        content: "[  點選展開  ]";
        color: #fff;
        position: relative; /* top: 40px; */
    }

body .fat_box .fat {
    text-align: center;
    font-family: "微軟正黑體";
}

body .fat_box .ui-accordion .ui-accordion-content {
    border: 0;
    overflow: visible;
    padding: 10px 50px 50px 50px;
    margin: 0 0 0 0;
    background: transparent;
}

body .fat_box ul {
    text-align: center;
    padding: 0 35px;
    margin: 30px 0;
}

    body .fat_box ul li.title {
        border-bottom: 3px rgba(255, 251, 138, 0.8) solid;
        font-weight: bold;
        font-size: 110%;
        margin: 0 0 10px 0 !important;
        padding: 0 0 5px 3px !important;
        text-align: center;
    }

    body .fat_box ul:nth-child(2n+2) li.title {
        border-bottom: 3px rgba(234, 199, 50, 0.7803921568627451) solid;
    }

    body .fat_box ul li.title::before {
        display: none;
    }

    body .fat_box ul li.title a {
        text-decoration: none;
        white-space: nowrap;
        color: #ffffff;
        opacity: 1;
    }

    body .fat_box ul li a {
        color: #ffffff;
        opacity: 0.8;
    }

        body .fat_box ul li a:hover {
            opacity: 1;
            text-decoration: none;
        }

    body .fat_box ul li {
        padding: 7px 0 7px 5px !important;
        font-size: 95%;
        text-align: left;
        display: flex;
    }

        body .fat_box ul li a::before {
            content: "○";
            float: left;
            margin: 2px 3px 0 5px;
            font-size: 85%;
        }

        body .fat_box ul li.title a::before {
            content: "";
        }

        body .fat_box ul li.title a {
            padding: 3px 0;
        }

            body .fat_box ul li.title a:hover {
            }

            body .fat_box ul li.title a:hover {
                color: #f7ec5f;
            }

body .ui-accordion .ui-accordion-header .ui-accordion-header-icon {
    position: relative;
    left: inherit;
    top: inherit;
    margin: 0;
}

body .fat_box .ui-state-active .ui-icon {
    left: inherit;
    top: inherit;
    margin: auto;
    background-position: 0 0;
}

    body .fat_box .ui-state-active .ui-icon.ui-icon-triangle-1-s {
        display: none;
    }

body .ui-accordion .ui-accordion-header .ui-accordion-header-icon.ui-icon-triangle-1-e {
    background-image: url(../images/all/fat_open.gif);
    background-position: 0 0;
    position: relative;
    margin: auto;
    top: 5px;
    display: none;
}

body .fat_box .close {
    float: none;
    top: 5px;
    position: relative;
    font-size: 95%;
    text-shadow: none;
    font-weight: 100;
    color: #fff;
    opacity: 1;
    display: none;
}

body .footer_box .txt_link {
    background-color: #000000;
    padding: 30px 0;
    color: #ffffff;
}

    body .footer_box .txt_link .link {
        position: absolute;
        right: 229px;
        top: -10px;
    }

body .footer_box .foot {
    padding: 40px 0 25px 0;
    position: relative;
}

body .footer_box .center {
    background-color: transparent !important;
    padding: 0 15px !important;
}

body .footer_box .foot .left, body .footer_box .foot .right {
    float: left;
    color: #fff;
}

body .footer_box .foot .right {
    margin-top: 17px;
}

body .footer_box .foot .left {
    margin: 0 45px 0 0;
}

    body .footer_box .foot .left .flogo img {
        width: 100%;
        max-width: 300px;
    }

body .footer_box .logo img {
    max-width: 250px;
    width: 100%;
}

body .footer_box .foot .left ul {
    margin: 10px 0 0 0;
    position: relative;
    left: 59px;
}

    body .footer_box .foot .left ul li:before {
        margin-right: 5px;
    }

body .footer_box .foot .icon {
    position: absolute;
    bottom: -20px;
    left: 100px;
}

    body .footer_box .foot .icon ul {
        display: inline-block;
        text-align: center;
    }

        body .footer_box .foot .icon ul li {
            margin: 5px 5px;
            display: inline-block;
        }

body .footer_box .foot .right .link {
    padding: 0 0 4px 0;
}

    body .footer_box .foot .right .link a {
        display: inline-block;
        margin: 0 5px 0 0;
        background-color: #f59000;
        padding: 0 10px;
        color: #fff;
        text-decoration: none;
    }

        body .footer_box .foot .right .link a:hover {
            background-color: #1e80cc;
        }

body .footer_box .foot .right li {
    font-size: 95%;
    padding: 0;
    margin: 5px 7px 0 0;
    color: #595959;
}

body .footer_box .foot .right .bton li {
    padding: 3px;
    margin: 0;
}

    body .footer_box .foot .right .bton li:nth-child(1) a {
        /* 【無障礙修正-PDF問題 1.4.3】
           原因：#ffffff 文字在 #977926 背景上對比值僅 4.13（未達 4.5:1 標準）。
           修正：背景調深為 #7A6000，對比值提升至 5.2:1，符合 WCAG AA 規定。 */
        background-color: #7A6000;
    }

    body .footer_box .foot .right .bton li:nth-child(2) a {
        background-color: #D45600;
    }

body .footer_box .foot .right .bton {
    position: absolute;
    right: 0;
    top: 19px;
}

    body .footer_box .foot .right .bton ul li {
        float: left;
    }

body .footer_box .foot .right .num li {
    float: left;
    margin-right: 15px;
    line-height: 35px;
    background-repeat: no-repeat;
    background-position: left center;
    padding: 0 0 0 20px;
}

    body .footer_box .foot .right .num li.date {
        background-image: url(../images/all/icon_date.png);
    }

    body .footer_box .foot .right .num li.people {
        background-image: url(../images/all/icon_people.png);
    }

body .footer_box .foot .right .bton li a {
    display: block;
    /* 【無障礙修正-PDF問題 1.4.3】
       原因：#ffffff 文字在 #1ba9bd 背景上對比值僅 2.82（嚴重不足）。
       修正：背景調深為 #0D6E7A，對比值提升至 5.1:1，符合 WCAG AA 規定。
       此為第3個按鈕(政府網站資料開放宣告)的預設底色，
       第1、2個按鈕各有 nth-child 覆蓋，不受此影響。 */
    background-color: #0D6E7A;
    color: #fff;
    padding: 3px 15px;
    text-decoration: none;
}

    body .footer_box .foot .right .bton li a:focus {
        color: #ffffff !important;
    }

    body .footer_box .foot .right .bton li a:hover {
        background-color: #ffb00a;
    }

body .footer_box .foot .right li a.map {
    margin: 0 0 0 5px;
}

body .footer_box .foot .left li a {
    display: block;
    text-align: center;
    margin: 0 0 0 00;
    text-decoration: none;
    padding: 0;
}

body .footer_box .foot p {
    padding: 3px 0;
    font-size: 95%;
    line-height: 120%;
}

    body .footer_box .foot p.title {
        color: #000000;
        width: max-content;
        font-size: 105%;
        font-weight: bold;
    }

body .footer_box .foot .right p a {
    color: #00ffde;
}

body .footer_box .foot .left ul li {
    color: #fff;
    font-size: 90%;
    letter-spacing: 0;
    line-height: 150%;
}

    body .footer_box .foot .left ul li a {
        display: block;
    }

    body .footer_box .foot .left ul li p {
        margin: 6px 0 0 0;
        font-size: 90%;
        font-weight: bold;
    }

body .footer_box .txt_link a, body .footer_box .txt_link span {
    color: #ffffff;
    margin: 0 5px;
    font-weight: bold;
    font-size: 105%;
}

    body .footer_box .txt_link a:hover {
        color: #ccab00;
    }
/*-----警語-----*/
body .warning,
.footer-warning-banner {
    background-color: #000;
    position: fixed;
    bottom: 0;
    width: 100%;
    height: auto !important;
    z-index: 9999;
    justify-content: center;
    align-items: center;
    min-height: 50px;
    white-space: normal !important;
    word-break: break-all !important;
}

    body .warning img {
        max-width: 100%;
        top: 50%;
        position: relative;
        transform: translateY(-50%);
        max-height: 100%;
    }

    body .warning .center {
        text-align: center;
        height: 100%;
        top: 50%;
        position: relative;
        transform: translateY(-50%);
        overflow: hidden;
    }
/*------階層式文案---------------*/
body.home .content .item01, body.home .content .item02, body.home .content .item03, body.home .content .item04 {
    position: relative;
    line-height: 150%;
    margin-top: 10px;
}

body.home .content .item01 {
    margin-left: 40px;
    font-size: 120%;
    font-weight: bold;
    color: #000;
    margin-top: 20px;
}

    body.home .content .item01 p, body.home .content .item02 p, body.home .content .item03 p, body.home .content .item04 p {
        padding: 0;
        margin: 0;
        text-align: right;
        position: absolute;
    }

    body.home .content .item01 p {
        width: 64px;
        left: -64px;
    }

body.home .content .item02 p {
    width: 90px;
    left: -95px;
}

body.home .content .item02 {
    margin-left: 40px;
    font-size: 105%;
    line-height: 180%;
}

body.home .content .item03 {
    margin-left: 145px;
}

    body.home .content .item03 p {
        width: 90px;
        left: -95px;
    }

body.home .content .item04 {
    margin-left: 175px;
}

    body.home .content .item04 p {
        width: 90px;
        left: -95px;
    }

body.home .content ul.item05 {
    margin: 10px 0 0 155px;
}

/* 修正【06】400% 放大不產生水平捲軸 */
@media (max-width: 768px) {
  body, html, #wrapper, .container, main {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  .product-list, .grid-box {
    display: block !important;
    width: 100% !important;
  }
}

/* 修正【07】頁尾警示文字換行 */
.footer-warning-banner {
  height: auto !important;
  white-space: normal !important;
  word-break: break-all !important;
}