﻿/* 整個內容方塊 */
.index最新相冊5 {
    --aspect-ratio: 1 / 1;
    --border-color: var(--color-darkPurple01);
    --font-color: #FFFFFF;
    --title-align: left;

    /* --For simpleBar Start-- */
    --content-height-without-heading: auto;
    --whole-block-height: auto;
    /* --For simpleBar End-- */

    height: var(--whole-block-height);
}

    /* 內容方塊標題文字 (h2) */
    .index最新相冊5 .blockTitle {
        text-align: var(--r-index-block-title-align, --title-align);
    }

        .index最新相冊5 .blockTitle h2 {
        }

        /* 內容方塊標題超連結 */
        .index最新相冊5 .blockTitle a {
        }

    /* 活動容器，每個活動都放在裡面 */
    .index最新相冊5 .loopElementList {
        height: var(--content-height-without-heading);
    }

        /* 活動容器，每個活動都放在裡面 */
        .index最新相冊5 .elementContainer {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: space-between;
            align-items: stretch;
            padding: var(--r-container-padding, 1em);
        }

    .index最新相冊5 .eachActivity {
        flex-basis: 30%;
        margin: 0 0 3em 0;
    }

    .index最新相冊5 .innerShell {
        position: relative;
    }

    .index最新相冊5 .eachActivity .themePic {
        border-radius: 50% 50%;
        border: solid 5px var(--border-color);
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        width: 100%;
        aspect-ratio: var(--aspect-ratio);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;

        /* 2024-11-02 */
        transition: all .5s;
    }

    .index最新相冊5 .eachActivity:has(.absoluteCoverLinks:hover) .themePic {
        transform: scale(0.98);
        box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    }

    .index最新相冊5 .eachActivity .heading {
        padding: 0;
        background-color: var(--border-color);
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px;
        width: 80%;
        margin: -1em auto 0 auto;
        border: solid 1em var(--border-color);
        color: var(--font-color);
    }

    .index最新相冊5 .showMoreLoopElements {
    }

@media (max-width: 480px) {
    .index最新相冊5 .eachActivity {
        flex-basis: 100%;
    }

        .index最新相冊5 .eachActivity .heading {
            width: 96%;
        }
    /* 只顯示頭 5 個活動 
    .index最新相冊5 .eachActivity {
        display: none;
    }

        .index最新相冊5 .eachActivity:nth-child(-n+5) {
            display: block;
        }*/
}

@media (min-width: 481px) and (max-width: 767px) {

    .index最新相冊5 .eachActivity {
        flex-basis: 46%;
    }

        .index最新相冊5 .eachActivity .heading {
            width: 96%;
        }

    /* 只顯示頭 4 個活動 
    .index最新相冊5 .eachActivity {
        display: none;
    }

        .index最新相冊5 .eachActivity:nth-child(-n+4) {
            display: block;
        }*/
}

@media (min-width: 768px) and (max-width: 979px) {
    .index最新相冊5 .eachActivity {
        flex-basis: 48%;
    }

        .index最新相冊5 .eachActivity .heading {
            width: 96%;
        }

    /* 只顯示頭 6 個活動 
    .index最新相冊5 .eachActivity {
        display: none;
    }

        .index最新相冊5 .eachActivity:nth-child(-n+6) {
            display: block;
        }*/
}

@media (min-width: 980px) and (max-width:1199px) {
    /* 只顯示頭 6 個活動 
    .index最新相冊5 .eachActivity {
        display: none;
    }

        .index最新相冊5 .eachActivity:nth-child(-n+6) {
            display: block;
        }*/
}

@media (min-width: 1200px) and (max-width:1919px) {
    /* 只顯示頭 6 個活動*/ 
    .index最新相冊5 .eachActivity {
        display: none;
    }

    .index最新相冊5 .eachActivity:nth-child(-n+5) {
        display: block;
    }
  
   .index最新相冊5 .eachActivity {
      flex-basis: calc((100% / 5) - 10px);
      margin: 0;
   }
}

@media (min-width: 1920px) {
  .index最新相冊5 .eachActivity {
      flex-basis: calc((100% / 6) - 10px);
      margin: 0;
  }
}

/* Glide Settings Start ===================================================*/
.index最新相冊5 .glide__slide {
    border: none 0;
    padding: 0;
    border-radius: 0;
}

/* Glide Settings End ===================================================*/
