/*圖片輪播*/
#carousel_picture img.w-100 {
    width: 100%!important;
    height: 100%!important;
}

#carousel_picture .carousel-indicators {
    margin-bottom: -2.5rem;
}
#carousel_picture .carousel-indicators button {
    margin: 0 0.25rem;
    width: 10px;
    height: 10px;
    background-color: rgba(215, 215, 215, 1);
    border-radius: 100%;
}
#carousel_picture .carousel-indicators button.active {
    background-color: rgba(0, 0, 0, 1);
}

#carousel_picture .carousel-control-next, 
#carousel_picture .carousel-control-prev {
    width: auto;
}
    #carousel_picture .carousel-control-next .carousel-control-next-icon {
        width: 4rem;
        height: 4rem;
        background: url(../Images/arrow_right.svg);
        background-size: cover;
    }
    #carousel_picture .carousel-control-prev .carousel-control-prev-icon {    
        width: 4rem;
        height: 4rem;
        background: url(../Images/arrow_left.svg);
        background-size: cover;
    }

#carousel_picture .carousel-control-next {
    right: -5rem;
}
#carousel_picture .carousel-control-prev {
    left: -5rem;
}

    #carousel_picture .carousel-control-next:focus,
    #carousel_picture .carousel-control-prev:focus {
        border-color: none;
        outline: 0;
        box-shadow: none;
    }
        #carousel_picture .carousel-control-next:focus span,
        #carousel_picture .carousel-control-prev:focus span {
            border: 2px solid #ccc;
            border-radius: 100%;
        }


/*相關連結*/
#carousel_link .carousel-inner img {
    width: 100%;
    height: auto;
}

#carousel_link .carousel-inner {
    margin: auto;
    width: 80%;
}

    #carousel_link .carousel-inner .carousel-item {
        margin: 0.25rem;
        padding: 0.5rem;
        width: calc((100% / 4) - 0.5rem);
        height: 12vh;
        border: 1px solid rgba(215, 215, 215, 1);
    }
        #carousel_link .carousel-inner .carousel-item a {
            display: flex;
            align-items: center;
            width: 100%;
            height: calc(12vh - 1rem);
        }

#carousel_link .carousel-control-next,
#carousel_link .carousel-control-prev {
    width: 10%;
    transform: translate3d(0, 0, 0);
}
    #carousel_link .carousel-control-next .carousel-control-next-icon {
        width: 2.5rem;
        height: 2.5rem;
        background: url(../Images/arrow_right_circle.svg);
        background-size: contain;
    }
    #carousel_link .carousel-control-prev .carousel-control-prev-icon {
        width: 2.5rem;
        height: 2.5rem;
        background: url(../Images/arrow_left_circle.svg);
        background-size: contain;
    }


#carousel_link .carousel-inner .active,
#carousel_link .carousel-inner .active + .carousel-item,
#carousel_link .carousel-inner .active + .carousel-item + .carousel-item,
#carousel_link .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item  {
    display: block;
}
#carousel_link .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
#carousel_link .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
#carousel_link .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item,
#carousel_link .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
    transition: none;
}

#carousel_link .carousel-inner .carousel-item.active + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
    display: block;
    position: absolute;
    top: 0;
    right: -25%;
    visibility: visible;
    z-index: -1;
}


@media only screen and (max-width: 992px) {
    #carousel_picture .carousel-control-next {
        right: -2.5rem;
    }
    #carousel_picture .carousel-control-prev {
        left: -2.5rem;
    }
}


@media only screen and (max-width: 768px) {
    #carousel_picture .carousel-control-next {
        right: -1.5rem;
    }
    #carousel_picture .carousel-control-prev {
        left: -1.5rem;
    }

    #carousel_link .carousel-inner .carousel-item  {
        width: calc((100% / 3) - 0.5rem);
    }
    
    #carousel_link .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item  {
        display: none;
    }

    #carousel_link .carousel-inner .carousel-item.active + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
        right: -33.3333%;
    }
}


@media only screen and (max-width: 576px) {
    #carousel_picture .carousel-control-next {
        right: -1rem;
    }
    #carousel_picture .carousel-control-prev {
        left: -1rem;
    }

    #carousel_link .carousel-inner .carousel-item  {
        width: calc((100% / 2) - 0.5rem);
    }
    
    #carousel_link .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item  {
        display: none;
    }
    #carousel_link .carousel-inner .carousel-item.active + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
        right: -50%;
    }
}