/* 首頁CSS /Home/Index */

/* Banner */
.section-banner {
    position: relative;
    height: 500px;
}

.slick-dots {
    padding-left: 0;
    list-style: none;
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;
}

    .slick-dots li {
        display: inline-block;
    }

        .slick-dots li + li {
            margin-left: 15px;
        }

        .slick-dots li button {
            font-size: 0px;
            line-height: 0;
            width: 12px;
            height: 12px;
            border: 0;
            border-radius: 100%;
            outline: none;
            background-color: #ffffff;
            opacity: 0.8;
        }

            .slick-dots li button:hover,
            .slick-dots li button:focus {
                opacity: 1;
            }

        .slick-dots li.slick-active button {
            background-color: #065806;
            opacity: 1;
        }

/* Search */
.section-search {
    margin-top: -214px;
    padding-bottom: 30px;
}

    .section-search .search-bar {
        background-color: rgba(255,255,255,0.7);
        border-radius: 8px;
    }

    .section-search .nav-pills .nav-link {
        color: #fff;
        background-color: #3E3A39;
        border: 0;
        font-size: 15px;
        padding: 5px 10px;
    }

        .section-search .nav-pills .nav-link.active, .section-search .nav-pills .show > .nav-link {
            position: relative;
            background-color: #008800;
        }

            .section-search .nav-pills .nav-link.active:before, .section-search .nav-pills .show > .nav-link:before {
                content: '';
                display: block;
                position: absolute;
                top: 100%;
                left: calc(50% - 8px);
                width: 0;
                height: 0;
                border-style: solid;
                border-width: 8px 8px 0 8px;
                border-color: #008800 transparent transparent transparent;
            }

    .section-search .more {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-left: 0px;
    }

    .section-search .keyword {
        height: 22px;
    }

/* Section */
.section-links {
    padding: 5vh 0 calc(5vh - 30px);
}

    .section-links .link {
        margin-bottom: 30px;
    }

        .section-links .link h4 {
            margin-top: 0;
            margin-bottom: 5px;
        }

        .section-links .link p {
            color: #999999;
            font-size: 14px;
        }

/* 熱門 */
.section-slider {
    padding: 5vh 0;
}

    .section-slider .nav-pills .nav-link {
        color: #fff;
        background-color: #3E3A39;
    }

        .section-slider .nav-pills .nav-link:hover,
        .section-slider .nav-pills .nav-link.active,
        .section-slider .nav-pills .show > .nav-link {
            background-color: #008800;
        }

    .section-slider.hot {
        background-color: #f2f2f2;
    }

    .section-slider .slick-slider {
        margin: 0 -15px;
    }

    .section-slider .slick-arrow {
        color: #ccc;
        font-size: 24px;
        position: absolute;
        top: calc(50% - 23px);
        right: 100%;
    }

        .section-slider .slick-arrow.slick-next {
            left: 100%;
        }

    .section-slider .slick-slider .slick-slide {
        margin: 0 10px 10px;
    }

    .section-slider .card .card-body {
        font-size: 14px;
        padding: 10px;
    }

    .section-slider .card .no {
        color: #004400;
    }

    .section-slider .card h6 {
        font-size: 13px;
        color: #666666;
    }

    .section-slider .card ul {
        padding-left: 0;
        list-style: none;
        margin-bottom: 0;
    }

        .section-slider .card ul > li {
            display: inline-block;
        }

            .section-slider .card ul > li + li:before {
                content: '/';
                display: inline-block;
                margin-right: 0.5em;
                margin-left: 0.25em;
                font-size: 0.9em;
                color: #cccccc;
            }

    .section-slider .total-pin {
        color: #8B0000;
    }

@media (min-width: 576px) {

    .section-search {
        margin-top: -177px;
    }
}

@media (min-width: 768px) {
    .section-banner {
        height: 550px;
    }

    .section-auction .nav-pills .nav-link {
        font-size: 16px;
    }

    .section-auction .slick-slider {
        margin: 0 17px;
    }
}

@media (min-width: 992px) {
}

@media (min-width: 1200px) {
}