@charset "utf-8";

.memory .all {
    width: 100%;
    max-width: 100%;
}

/*⭣⭣⭣⭣相片區塊共同預設⭣⭣⭣⭣*/
.memory .photo_list {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    gap: calc(var(--block-margins-s) *0.8);
    flex-wrap: wrap;
    margin: var(--block-margins-m) auto;
    flex: 1 1 auto;
    align-items: stretch;
    /* 關鍵：所有卡片等高 */
    height: 100%;
}

.memory .photo_list_item {
    width: 32%;
    position: relative;
    align-items: stretch;
    padding: calc(var(--block-margins-ss) *0.6);
    box-shadow: 6px 6px 1px rgba(191, 191, 191, 0.5);
    display: flex;
    flex-direction: column;
    background-color: #fff;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

    .memory .photo_list_item::after {
        content: "";
        z-index: 5;
        width: 100%;
        height: 100%;
        position: absolute;
        pointer-events: none;
        /*讓滑鼠可以穿透到下面一層*/
        left: 0;
        top: 0;
        border: 1px solid var(--gray03);
    }

    .memory .photo_list_item::before {
        content: "";
        z-index: 6;
        width: 100%;
        height: 100%;
        position: absolute;
        pointer-events: none;
        left: 0;
        top: 0;
        border: 2px solid transparent;
        transition: all 0.2s ease-in-out;
    }

    .memory .photo_list_item .photo_box {
        width: 100%;
        /* min-height: 250px; */
        min-height: clamp(220px, 20vw, 250px);
        position: relative;
        padding-bottom: 0;
        overflow: hidden;
        aspect-ratio: 3/2;
        overflow: hidden;
    }

        .memory .photo_list_item .photo_box::after {
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            pointer-events: none;
            /*讓滑鼠可以穿透到下面一層*/
            left: 0;
            top: 0;
            border: clamp(7px, 1.1vw, 11px) solid #fff;
            /* border-bottom: 7px; */
        }

        .memory .photo_list_item .photo_box a {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 99.5%;
            height: 99.5%;
            overflow: hidden;
            margin: 0 auto;
            position: relative;
        }

        .memory .photo_list_item .photo_box img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transition: transform 0.3s ease;
            transform-origin: center bottom;
            object-position: center center; /* 預設居中 */
        }

            .memory .photo_list_item .photo_box img.vertical {
                object-position: center 15%;
            }

            .memory .photo_list_item .photo_box img.square {
                object-position: center top;
            }

.memory .text_box {
    width: 93%;
    text-align: left;
    margin: 0 auto;
    line-height: 1.5;
    z-index: 99;
    flex: 1 1 auto;
    align-items: stretch;
    padding-bottom: 2%;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-top: 0.5rem;
}

    .memory .text_box .pic_title {
        position: relative;
        width: 100%;
        z-index: 3;
        display: flex;
        justify-content: space-between;
        margin: -0.5rem auto calc(var(--block-margins-ss) *0.8) auto;
        align-items: flex-start;
        align-items: baseline;
        padding-bottom: 0.4rem;
        flex-wrap: wrap;
        cursor: pointer;
    }

        .memory .text_box .pic_title .pic_title_top {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;
            flex-wrap: wrap;
            gap: 0.2rem;
            margin-bottom: calc(var(--block-margins-ss)*0.3);
            cursor: pointer;
        }

    .memory .text_box .content_box {
        display: flex;
        flex-wrap: wrap;
        height: 100%;
        flex: 1 1 auto;
        align-items: stretch;
        position: relative;
        justify-content: space-between;
    }

        .memory .text_box .content_box .txt {
            width: 100%;
            cursor: pointer;
        }

            .memory .text_box .content_box .txt > div {
                flex: 1 1 auto;
                min-width: 0;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;
                overflow: hidden;
                line-height: 1.5;
                /* text-align: justify; */
                word-break: break-all;
                padding-right: .2em;
                cursor: pointer;
            }

/*跳窗頁的內文取消限制行數*/
.memory .pop_link .text_box .content_box .txt > div {
    display: block;
    /* 或用 unset 也行 */
    -webkit-line-clamp: unset;
    /* 解除行數限制 */
    -webkit-box-orient: unset;
    /* 保險起見也解除 */
    overflow: visible;
    /* 顯示全部文字 */
    white-space: normal;
    /* 允許多行換行 */
    max-height: none;
    /* 若有 max-height 也要取消 */
    /* 其餘原本的 line-height、text-align 之類可保留 */
}

.memory .text_box .content_box .more {
    font-size: calc(var(--normal-txt-size) * 0.9);
    width: fit-content;
    padding: 0.3rem;
    line-height: 1;
    height: fit-content;
    order: 3;
    transition: all 0.2s ease-in-out;
    color: var(--basic-gold);
    margin-top: auto;
    margin-left: auto;
}

.memory .text_box .content_box .hashtag {
    font-size: calc(var(--normal-txt-size) * 0.9);
    padding-top: calc(var(--block-margins-ss) * 0.7);
    width: fit-content;
    flex: 0 0 auto;
    margin-right: 0.5rem;
    min-width: 0;
    order: 2;
    gap: 0.2rem;
    display: flex;
    flex-wrap: wrap;
    margin-top: auto;
}

    .memory .text_box .content_box .hashtag a {
        display: block;
        width: fit-content;
    }

    .memory .text_box .content_box .hashtag span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 0.7px solid rgba(168, 123, 0, 0.2);
        padding: 0.1rem 0.6rem;
        min-height: 1.6em;
        /* 適合單行、也不怕字體高矮差太多 */
        border-radius: 5px;
        color: var(--basic-gold);
        transition: all 0.0.5s;
    }

/*投稿人*/
.memory .text_box .author {
    width: fit-content;
    font-size: var(--normal-txt-size);
    padding: 0;
    /* margin-top: -0.2rem; */
    border-radius: none;
    color: var(--gray02);
    font-weight: 500;
    /* margin-bottom: 0.1rem; */
    display: flex;
    align-items: center;
}

    .memory .text_box .author .name {
        display: contents;
    }

.memory .text_box .pic_title h3 {
    width: 100%;
    font-size: calc(var(--normal-txt-size) * 1.15);
    font-weight: 500;
    color: var(--basic-gold);
    line-height: 1.3;
    cursor: pointer;
    white-space: nowrap;
    /* 不換行 */
    overflow: hidden;
    /* 隱藏超出部分 */
    text-overflow: ellipsis;
    /* 顯示... */
}

/*跳窗頁的標題取消單行限制*/
.memory .pop_link .text_box .pic_title h3 {
    white-space: normal;
    /* 允許自動換行 */
    overflow: visible;
    /* 讓文字不被隱藏 */
    text-overflow: unset;
    /* 取消...顯示 */
}

.memory .text_box .pic_title::after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: var(--gray04);
    bottom: 0;
}

/*icon區塊*/
.memory .text_box .pic_title .icon_box {
    display: flex;
    align-items: center;
    margin-left: auto;
}

/* 隱藏真正的 checkbox */
.memory .photo_list_item .like {
    margin-left: 0.1rem;
    display: flex;
    justify-content: center;
}

    .memory .photo_list_item .like .like-label .like-toggle {
        display: none;
    }

    /* 心形外層：尺寸 + 位置 + 滑鼠手勢 */
    .memory .photo_list_item .like .like-label {
        width: 100%;
        height: auto;
        z-index: 3;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
        line-height: 1;
        margin: 0;
    }

        .memory .photo_list_item .like .like-label span {
            font-size: calc(var(--normal-txt-size) *0.9);
            padding-left: 0.1rem;
            line-height: initial;
            vertical-align: middle;
            /* transform: translateY(1.2px); */
            margin: 0 .2rem;
            cursor: default;
        }

        .memory .photo_list_item .like .like-label svg {
            width: var(--icon-btn-size-desktop);
            aspect-ratio: 1/1;
            display: block;
            /* → 讓 svg 依父層尺寸撐滿 */
            mask-image: url(../images/svg/heart.svg);
            mask-size: 100% 100%;
            background-color: #bbbbbb;
            transition: all .2s ease;
            /* transform: translateY(0.2rem); */
        }

        /* 當 checkbox 被選中，讓緊接在它後面的 label 裡的 svg 變紅 */
        .memory .photo_list_item .like .like-label .like-toggle:checked + svg {
            background-color: var(--red);
        }

/*link*/
.memory .photo_list_item .link {
    margin-left: 0.1rem;
    cursor: pointer;
}

    .memory .photo_list_item .link svg {
        width: var(--icon-btn-size-desktop);
        aspect-ratio: 1/1;
        display: block;
        /* → 讓 svg 依父層尺寸撐滿 */
        mask-image: url(../images/svg/link.svg);
        mask-size: 100% 100%;
        background-color: #bbbbbb;
        transition: all .2s ease;
        /* transform: translateY(0.2rem); */
    }



/*置頂區塊*/
.not_found {
    display: none;
}

.memory .top_list {
    width: 100%;
    margin-bottom: var(--block-margins-m);
    margin-top: var(--block-margins-s);
}

    .memory .top_list .list_all {
        width: 100%;
        padding-bottom: 1.2rem;
    }

    .memory .top_list .swiper-wrapper {
        width: 100%;
        box-sizing: border-box;
        display: flex;
        justify-content: left;
    }

.swiper {
    width: 100%;
}

.swiper-slide {
    width: auto;
    height: auto;
    flex: 0 0 auto;
    box-sizing: border-box;
    margin-bottom: var(--block-margins-ss);
}

.no-swipe {
    cursor: auto;
    user-select: text;
    /* ← 這樣文字才會一定可以被選取 */
}

.memory .top_list .swiper-pagination {
    bottom: calc(var(--block-margins-ss)*-1);
}

.memory .top_list .photo_list_item {
    padding: 0;
    cursor: pointer;
    transform: scale(.97);
    display: flex;
    flex-direction: column;
}

    .memory .top_list .photo_list_item .photo_box {
        min-height: clamp(220px, 30vw, 380px);
    }

        .memory .top_list .photo_list_item .photo_box::after {
            border: clamp(12px, 1.5vw, 18px) solid #fff;
        }

        .memory .top_list .photo_list_item .photo_box a {
            padding: clamp(12px, 1.2vw, 18px);
        }

.memory .top_list .text_box {
    text-align: left;
    transform: translateY(-8%);
    line-height: 1.5;
    padding-bottom: 0;
}

.memory .top_list .photo_list_item .photo_box .like .like-label {
    width: clamp(25px, 3vw, 30px);
}

.memory .top_list .text_box .pic_title {
    margin-top: calc(var(--block-margins-ss) *0.3);
}

    .memory .top_list .text_box .pic_title h3 {
        font-size: calc(var(--normal-txt-size) *1.35);
        font-weight: 500;
        margin-bottom: calc(var(--block-margins-ss) *0.4);
        cursor: pointer;
    }

    .memory .top_list .text_box .pic_title h3,
    .memory .top_list .text_box p {
        z-index: 999;
        /* cursor: text; */
    }

.memory .top_list .text_box .content_box .hashtag {
    padding-top: 0;
}

/* .memory .top_list .photo_list_item .like .like-label svg {
    transform: translateY(0.2rem);
} */

/*讓使用者依然可以正常選取文字*/
/* .memory .photo_list_item .text_box,
.memory .photo_list_item .text_box h3,
.memory .photo_list_item .text_box p,
.memory .photo_list_item .like-label span {
    user-select: text;
    -webkit-user-select: text;
    -webkit-touch-callout: default;
} */


/*跳窗*/
.memory main {
    position: relative;
}

    .memory main .popbg {
        position: fixed;
        z-index: 9998;
        inset: 0;
        /* 等同於 top:0;right:0;bottom:0;left:0 */
        background: rgba(0, 0, 0, 0.7);
        /* 半透明黑 */
        transition: opacity 0.2s;
        display: none;
    }

    .memory main .pop {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 9999;
        min-width: 500px;
        min-height: 250px;
        background-color: #fff;
        box-shadow: var(--box-shadow-pop);
        display: none;
    }



        .memory main .pop article {
            position: relative;
        }

        .memory main .pop .btn_x,
        .memory main .pop_link .btn_x {
            width: 1.7rem;
            height: 1.7rem;
            position: absolute;
            right: -0.2rem;
            top: -1.7em;
            cursor: pointer;
            transform-origin: 50% 50%;
            transition: transform 0.3s ease-in-out;
        }

            .memory main .pop .btn_x svg,
            .memory main .pop_link .btn_x svg {
                mask-image: url(../images/svg/close.svg);
                mask-size: 100% 100%;
                background-color: #fff;
            }

svg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.memory main article section h1 {
    font-size: calc(var(--normal-txt-size) *1.1);
}

.memory main article .article_content {
    padding-top: calc(var(--block-margins-ss)*0.5);
}

.memory main .pop h1 span {
    display: inline-block;
}

.memory main .pop p {
    color: var(--basic-gold);
    font-size: calc(var(--normal-txt-size) *1.1);
}

    .memory main .pop p span {
        font-size: calc(var(--normal-txt-size) *1.2);
        margin-left: 0.3rem;
        margin-right: 0.3rem;
    }

.memory main .pop .form-group {
    display: flex;
    gap: 0.5rem;
}

/*分享連結用跳窗*/
.memory main .pop_link {
    width: fit-content;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9998;
    display: none;
}

    .memory main .pop_link.dark::before {
        content: "";
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        position: fixed;
        z-index: 9997;
        inset: 0;
        background: rgba(0, 0, 0, 0.7);
        transition: opacity 0.2s;
        /* display: none; */
    }

/* .memory .pop_link .photo_list_item::before {
display: none;
} */
.memory .pop_link .photo_list_item::after {
    display: none;
}

.memory main .pop_link .photo_list_item {
    box-shadow: none;
    width: clamp(500px, 80vw, 800px);
    margin: 0 auto;
    cursor: default;
    max-height: 92vh;
    overflow-y: auto;
    padding: 2%;
}

    .memory main .pop_link .photo_list_item .text_box {
        width: 94%;
    }

    .memory main .pop_link .photo_list_item .photo_box {
        padding: 1%;
    }

/* .memory .pop_link .photo_list_item .photo_box { 
    min-height:clamp(300px,55vh,600px);
} */
.memory .pop_link .photo_list_item .photo_box {
    aspect-ratio: auto;
    height: fit-content;
    min-height: fit-content;
}

.memory .pop_link .photo_list_item::before {
    display: none;
}

.memory main .pop_link .photo_list_item .photo_box::after {
    border: clamp(10px, 3vw, 15px) solid #fff;
    /* border-bottom: 0; */
}

.memory main .pop_link .text_box .content_box {
    padding-bottom: 2rem;
}

    .memory main .pop_link .text_box .content_box .txt {
        flex: 1 1 auto;
        -webkit-line-clamp: unset;
        -webkit-box-orient: unset;
        overflow: visible;
        cursor: text;
        max-height: fit-content;
        font-size: var(--normal-txt-size);
    }

.memory main .pop_link .text_box .pic_title {
    padding-top: var(--block-margins-ss);
    padding-bottom: var(--block-margins-ss);
}

    .memory main .pop_link .text_box .pic_title h3 {
        font-size: calc(var(--normal-txt-size) *1.6);
    }

    .memory main .pop_link .text_box .pic_title h3,
    .memory main .pop_link .text_box .pic_title .pic_title_top {
        cursor: text;
    }

/*定義跳窗內文樣式*/

/* .memory main .pop_link .text_box .content_box .txt>div {
    padding-top: 0.5rem;
} */

.memory main .pop_link .text_box .content_box .txt > div p,
.memory main .pop_link .text_box .content_box .txt > div h5,
.memory main .pop_link .text_box .content_box .txt > div h4,
.memory main .pop_link .text_box .content_box .txt > div h3,
.memory main .pop_link .text_box .content_box .txt > div h2,
.memory main .pop_link .text_box .content_box .txt > div h1 {
    margin: var(--block-margins-ss) 0;
}

.memory main .pop_link .text_box .content_box .txt > div {
    font-size: calc(var(--normal-txt-size) *1);
    cursor: default;
}

    .memory main .pop_link .text_box .content_box .txt > div p,
    .memory main .pop_link .text_box .content_box .txt > div li {
        font-size: calc(var(--normal-txt-size) *1);
        line-height: 1.8;
        margin-top: var(--block-margins-ss);
        margin-bottom: var(--block-margins-ss);
    }

        .memory main .pop_link .text_box .content_box .txt > div p a {
            text-decoration: underline;
            color: var(--basic-gold);
        }

    .memory main .pop_link .text_box .content_box .txt > div .gold {
        color: var(--basic-gold);
    }

    .memory main .pop_link .text_box .content_box .txt > div .red {
        color: var(--red);
    }

    .memory main .pop_link .text_box .content_box .txt > div strong {
        font-weight: 600;
    }

    .memory main .pop_link .text_box .content_box .txt > div hr {
        height: 1px;
        background-color: var(--gray04);
        margin-top: var(--block-margins-s);
        margin-bottom: var(--block-margins-s);
    }

    .memory main .pop_link .text_box .content_box .txt > div .diamond {
        margin-left: -0.3rem;
    }

    .memory main .pop_link .text_box .content_box .txt > div ul,
    .memory main .pop_link .text_box .content_box .txt > div ol {
        padding-left: 0em;
        /* 縮排2em，可視覺需求調整 */
        margin-left: 0;
        /* 避免多重縮排，可依需求調整 */
        margin-bottom: 1em;
        /* 項目和下方內容留點間隔，可選 */
        margin-top: var(--block-margins-ss);
        margin-bottom: var(--block-margins-ss);
    }

    .memory main .pop_link .text_box .content_box .txt > div ol {
        list-style: decimal inside;
        /* 數字符號在內側 */
    }

    .memory main .pop_link .text_box .content_box .txt > div h5 {
        font-size: calc(var(--normal-txt-size) * 1.1);
        font-weight: 400;
    }

    .memory main .pop_link .text_box .content_box .txt > div h4 {
        font-size: calc(var(--normal-txt-size) * 1.2);
        font-weight: 500;
    }

    .memory main .pop_link .text_box .content_box .txt > div h3 {
        font-size: calc(var(--normal-txt-size) * 1.3);
        font-weight: 500;
    }

    .memory main .pop_link .text_box .content_box .txt > div h2 {
        font-size: calc(var(--normal-txt-size) * 1.4);
        font-weight: 600;
    }

    .memory main .pop_link .text_box .content_box .txt > div h1 {
        font-size: calc(var(--normal-txt-size) * 1.5);
        font-weight: 700;
    }

    .memory main .pop_link .text_box .content_box .txt > div .focus {
        color: var(--basic-gold);
    }

/*搜尋欄位*/
.memory main .search_box > .search_txt input {
    border: none;
}

/* 桌機版滑鼠效果 */
@media (hover: hover) {
    .memory .photo_list_item .photo_box a:hover img {
        transform: scale(1.05);
    }

    .memory .photo_list_item .photo_box a:hover {
        cursor: url('../images/magnifier.png') 10 10, auto;
        filter: none;
        /*移除page.css 中brightness的預設*/
    }

    .memory .photo_list_item .like:hover svg {
        background-color: var(--red);
    }

    .memory .photo_list_item .link:hover svg {
        background-color: var(--basic-gold);
    }

    .memory .text_box .content_box .hashtag a:hover span {
        color: var(--basic-gold);
        /* font-weight: 500; */
        border: 0.7px solid rgba(168, 123, 0, 0.3);
        background: rgba(168, 123, 0, 0.1);
    }

    .memory .photo_list_item:hover::before {
        border: 2px solid rgb(191, 169, 109);
    }

    .memory .pop_link .photo_list_item:hover::before {
        border: none;
    }

    .memory .photo_list_item:hover .text_box .content_box .more {
        /* border: 0.7px solid rgba(168, 123, 0, 0.5); */
        border-radius: 5px;
        background-color: rgb(191, 169, 109);
        color: #fff;
    }

    /* .memory .text_box .pic_title h3:hover, .memory .text_box .content_box .txt:hover{
        text-decoration: underline;
    }  */
    /* .memory main .pop .btn_x:hover {
        transform: rotate(90deg);
    } */
}

/*⭡⭡⭡⭡相片區塊共同預設⭡⭡⭡⭡*/


@media (max-width: 1300px) {
    .memory .top_list .text_box .content_box .txt {
        padding-bottom: 1.5%;
    }
}



@media (max-width: 1200px) {
    /* .memory .top_list .text_box {
        margin-top: 0.2rem;
    } */

    .memory .photo_list_item {
        width: 48.3%;
        margin-bottom: var(--block-margins-ss);
    }

        .memory .photo_list_item .photo_box,
        .memory .top_list .photo_list_item .photo_box {
            min-height: clamp(200px, 30vw, 350px);
        }
}

@media (max-width: 1000px) {
    .memory .photo_list {
        justify-content: space-between;
    }
}

@media screen and (max-width: 790px) and (min-width: 600px) {

    .memory .text_box .pic_title .icon_box {
        justify-content: flex-start;
        width: 100%;
    }

    .memory .text_box .author {
        width: 100%;
        flex-wrap: wrap;
        order: 2;
    }

    .memory .pop_link .text_box .pic_title .pic_title_top {
        flex-wrap: nowrap;
    }

    .memory .pop_link .text_box .author {
        flex-wrap: nowrap;
        order: 1;
    }

    .memory .pop_link .text_box .pic_title .icon_box {
        display: flex;
        order: 2;
        justify-content: flex-end;
        align-items: center;
        margin-left: auto;
    }

    .memory .top_list .text_box .author {
        width: fit-content !important;
    }

    .memory .top_list .text_box .pic_title .icon_box {
        justify-content: flex-end;
        order: 2;
        width: fit-content;
    }
}

@media (max-width: 380px) {

    .memory .text_box .pic_title .icon_box {
        justify-content: flex-start;
        width: 100%;
    }

    .memory .text_box .author {
        width: 100%;
        flex-wrap: wrap;
        order: 2;
    }

    .memory .text_box {
        width: 88%;
    }
}

@media (max-width: 767px) {
    .memory .top_list .photo_list_item .photo_box::after {
        border: clamp(1.1rem, 1.8vw, 1.6rem) solid #fff;
    }

    .memory .top_list .photo_list_item .photo_box a img {
        transform-origin: center;
    }

    .memory .photo_list_item .photo_box a img {
        width: 100%;
        height: 100%;
    }

    .memory .top_list .photo_list_item .photo_box {
        min-height: clamp(300px, 60vw, 450px);
    }

    .memory .photo_list_item .like .like-label svg {
        width: var(--icon-btn-size-mobile);
    }

    /*跳窗的相片區塊*/


    .memory main .pop_link .photo_list_item {
        width: 90vw
    }

        .memory main .pop_link .photo_list_item .text_box {
            width: 90%;
        }
}

@media (max-width: 750px) {

    /*置頂區塊圖片較大，標題和icon區塊保持橫排*/
    .memory .top_list .text_box .pic_title,
    .memory .pop_link .text_box .pic_title {
        flex-direction: row;
        gap: calc(var(--block-margins-ss)*0.5);
    }

        .memory .top_list .text_box .pic_title .icon_box,
        .memory .pop_link .text_box .pic_title .icon_box {
            /* order: 2; */
        }

    /* .memory .top_list .text_box .pic_title h3, .memory .pop_link .text_box .pic_title h3{
        width: 100%;
        order: 1;
    } */
}

@media screen and (max-width: 750px) and (min-width: 600px), screen and (max-width: 320px) {
    .memory .text_box .pic_title {
        flex-direction: column;
        gap: calc(var(--block-margins-ss)*0.3);
        /* gap: var(--block-margins-ss); */
    }

        .memory .text_box .pic_title .icon_box {
            order: 1;
        }

        .memory .text_box .pic_title h3 {
            width: 100%;
            order: 2;
        }

        .memory .text_box .pic_title .like {
            margin-left: 0;
        }
}



@media (max-width: 600px) {

    .memory .photo_list_item {
        width: 100%
    }

    .memory .photo_list_item {
        padding: 0
    }

    .memory .text_box {
        margin-top: 0.4rem;
        padding-bottom: 1.5rem;
    }

    .memory .top_list .text_box {
        margin-top: .4rem;
        padding-bottom: 0.6rem;
    }

    .memory .photo_list_item .photo_box::after,
    .memory .top_list .photo_list_item .photo_box::after {
        border: clamp(1rem, 1.6vw, 1.2rem) solid #fff;
    }

    .memory .top_list .text_box .pic_title h3 {
        font-size: calc(var(--normal-txt-size) *1.2);
    }

    .memory .photo_list_item .photo_box,
    .memory .top_list .photo_list_item .photo_box {
        min-height: clamp(200px, 60vw, 350px);
    }

    .memory .text_box {
        margin-top: 0;
    }
}

@media (max-width: 550px) {
    .memory main .pop {
        min-width: 90%;
        min-height: fit-content;
    }
}

@media (max-width: 400px) {

    .memory .photo_list_item .photo_box::after,
    .memory .top_list .photo_list_item .photo_box::after {
        border: clamp(0.7rem, 4vw, 1rem) solid #fff;
    }

    .memory main .pop_link .photo_list_item .text_box {
        width: 85%;
    }
}

@media (max-width: 320px) {

    /*置頂區塊和下方區塊同步改為標題區折行*/
    .memory .top_list .text_box .pic_title {
        flex-direction: column;
        gap: var(--block-margins-ss);
    }

        .memory .top_list .text_box .pic_title .icon_box {
            order: 1;
        }

        .memory .top_list .text_box .pic_title h3 {
            width: 100%;
            order: 2;
        }
}

@media (max-width: 300px) {
    .memory main .pop h1 span {
        display: inline;
        text-align: left;
    }
}