/* 整個內容方塊 */
.index捷徑列8 {
}

    /* 內容方塊標題文字 (h2) */
    .index捷徑列8 .blockTitle {
    }

    .index捷徑列8 .shortcutList {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;
        align-items: flex-start;
    }

    .index捷徑列8 .eachShortcut {
        display: block;
        position: relative;
        border-radius: 10px;
        overflow: hidden;
        margin: 0.5rem;
    }

    .index捷徑列8 .child {
        width: 100%;
        height: 100%;
        background-position: center;
        background-size: cover;
        transition: all .5s;
    }

    .index捷徑列8 .eachShortcut:hover .child,
    .index捷徑列8 .eachShortcut:focus .child {
        transform: scale(1.2);
    }

    .index捷徑列8 .child::before {
        content: "";
        display: none;
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background-color: rgba(52, 73, 94, 0.2);
    }

    .index捷徑列8 .eachShortcut:hover .child:before,
    .index捷徑列8 .eachShortcut:focus .child:before {
        display: block;
    }

    .index捷徑列8 .heading {
        position: absolute;
        bottom: 10%;
        left: 10%;
        color: #ffffff;
        background: linear-gradient(135deg, rgba(206,220,231,1) 0%,rgba(89,106,114,1) 100%);
        text-shadow: 0 0 3px #808080;
        font-weight: 900;
        font-size: 1.2rem;
        padding: 0.2rem;
        transition: all .5s;
    }

    .index捷徑列8 .eachShortcut:hover .heading {
        background: linear-gradient(135deg, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%);
    }

@media (max-width: 480px) {
    .index捷徑列8 .eachShortcut {
        width: 40vw;
        height: 20vw;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    .index捷徑列8 .eachShortcut {
        width: 40vw;
        height: 20vw;
}
}

@media (min-width: 768px) and (max-width: 979px) {
    .index捷徑列8 .eachShortcut {
        width: 25vw;
        height: 12.5vw;
    }
}

@media (min-width: 980px) and (max-width:1199px) {
    .index捷徑列8 .eachShortcut {
        width: 25vw;
        height: 12.5vw;
    }
}

@media (min-width: 1200px) {
    .index捷徑列8 .eachShortcut {
        width: 16vw;
        height: 8vw;
    }
}