/* _content/CheerProfileNet/Components/Layout/CustomLayout.razor.rz.scp.css */
.page[b-d7xkrpme7z] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-d7xkrpme7z] {
    flex: 1;
}

.sidebar[b-d7xkrpme7z] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-d7xkrpme7z] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-d7xkrpme7z]  a, .top-row[b-d7xkrpme7z]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

        .top-row[b-d7xkrpme7z]  a:hover, .top-row[b-d7xkrpme7z]  .btn-link:hover {
            text-decoration: underline;
        }

        .top-row[b-d7xkrpme7z]  a:first-child {
            overflow: hidden;
            text-overflow: ellipsis;
        }

@media (max-width: 640.98px) {
    .top-row[b-d7xkrpme7z] {
        justify-content: space-between;
    }

        .top-row[b-d7xkrpme7z]  a, .top-row[b-d7xkrpme7z]  .btn-link {
            margin-left: 0;
        }
}

@media (min-width: 641px) {
    .page[b-d7xkrpme7z] {
        flex-direction: row;
    }

    .sidebar[b-d7xkrpme7z] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-d7xkrpme7z] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

        .top-row.auth[b-d7xkrpme7z]  a:first-child {
            flex: 1;
            text-align: right;
            width: 0;
        }

    .top-row[b-d7xkrpme7z], article[b-d7xkrpme7z] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-d7xkrpme7z] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-d7xkrpme7z] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/CheerProfileNet/Components/Layout/CustomTopNavMenu.razor.rz.scp.css */
.navmenu[b-nf3rqgpaz3] {
    backdrop-filter: blur(4px);
    background-color: #cccccc99;
    padding: 8px 16px;
}

.cheerlogo[b-nf3rqgpaz3] {
    width: 50px;
    height: 50px;
    background-color: #fafafa;
    border-radius: 4px;
    margin-right: .5rem;
    border: solid 1px silver;
}

.cheertitle[b-nf3rqgpaz3] {
    border-radius: 8px;
    font-weight: bolder;
    font-size: large;
    color: navy;
    padding: 4px 16px;
    text-decoration: none;
}

.pcnav-links[b-nf3rqgpaz3] {
    display: inline-flex;
}

    .pcnav-links li[b-nf3rqgpaz3] {
        list-style: none;
    }

        .pcnav-links li a[b-nf3rqgpaz3] {
            color: #000;
            text-decoration: none;
            font-size: 18px;
            font-weight: 500;
            padding: 9px 15px;
            border-radius: 5px;
            transition: all 0.3s ease;
        }

            .pcnav-links li a:hover[b-nf3rqgpaz3] {
                background: #3A3B3C;
                color: #f2f2f2;
            }

.phonemenu[b-nf3rqgpaz3] {
    background: none;
    max-height: 0;
    overflow: hidden;
    max-width: 0;
    transition: .5s;
}

    .phonemenu li[b-nf3rqgpaz3] {
        text-align: center;
        list-style: none;
        margin-top: 1.5rem;
    }

        .phonemenu li a[b-nf3rqgpaz3] {
            color: #000;
            text-decoration: none;
            font-size: 18px;
            font-weight: 500;
            padding: 9px 15px;
            border-radius: 5px;
            transition: all 0.3s ease;
        }

            .phonemenu li a:hover[b-nf3rqgpaz3] {
                background: #3A3B3C;
                color: #f2f2f2;
            }

.burgerswitch:checked ~ .phonemenu[b-nf3rqgpaz3] {
    max-height: 500px;
    max-width: 100vw;
}
/* _content/CheerProfileNet/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-c0fgu0onz1] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-c0fgu0onz1] {
    flex: 1;
}

.sidebar[b-c0fgu0onz1] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-c0fgu0onz1] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-c0fgu0onz1]  a, .top-row[b-c0fgu0onz1]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-c0fgu0onz1]  a:hover, .top-row[b-c0fgu0onz1]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-c0fgu0onz1]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-c0fgu0onz1] {
        justify-content: space-between;
    }

    .top-row[b-c0fgu0onz1]  a, .top-row[b-c0fgu0onz1]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-c0fgu0onz1] {
        flex-direction: row;
    }

    .sidebar[b-c0fgu0onz1] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-c0fgu0onz1] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-c0fgu0onz1]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-c0fgu0onz1], article[b-c0fgu0onz1] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-c0fgu0onz1] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-c0fgu0onz1] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/CheerProfileNet/Components/Layout/TopNavMenu.razor.rz.scp.css */
.navmenu[b-3hghg5ir03] {
    backdrop-filter: blur(4px);
    background-color: #cccccc99;
    padding: 8px 16px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}

.cheerlogo[b-3hghg5ir03] {
    width: 50px;
    height: 50px;
    background-color: #fafafa;
    border-radius: 4px;
    margin-right: .5rem;
    border: solid 1px silver;
}

.cheertitle[b-3hghg5ir03] {
    border-radius: 8px;
    font-weight: bolder;
    font-size: large;
    color:navy;
    padding:4px 16px;
    text-decoration:none;
}

.pcnav-links[b-3hghg5ir03] {
    display: inline-flex;
}

    .pcnav-links li[b-3hghg5ir03] {
        list-style: none;
    }

        .pcnav-links li a[b-3hghg5ir03] {
            color: #000;
            text-decoration: none;
            font-size: 18px;
            font-weight: 500;
            padding: 9px 15px;
            border-radius: 5px;
            transition: all 0.3s ease;
        }

            .pcnav-links li a:hover[b-3hghg5ir03] {
                background: #3A3B3C;
                color: #f2f2f2;
            }

.phonemenu[b-3hghg5ir03] {
    background: none;
    max-height: 0;
    overflow: hidden;
    transition: .5s;
}

    .phonemenu li[b-3hghg5ir03] {
        text-align: center;
        list-style: none;
        margin-top: 1.5rem;
    }

        .phonemenu li a[b-3hghg5ir03] {
            color: #000;
            text-decoration: none;
            font-size: 18px;
            font-weight: 500;
            padding: 9px 15px;
            border-radius: 5px;
            transition: all 0.3s ease;
        }

            .phonemenu li a:hover[b-3hghg5ir03] {
                background: #3A3B3C;
                color: #f2f2f2;
            }

.burgerswitch:checked ~ .phonemenu[b-3hghg5ir03] {
    max-height: 500px;
    /*max-width: 100vw;*/
}

/* _content/CheerProfileNet/Components/Pages/CheerPage/CheerAsset.razor.rz.scp.css */
.desc-container[b-r8m2484nhl] {
    display: flex;
    flex-direction: column; /* Stack items vertically */
    justify-content: center; /* Center horizontally */
    /*align-items: center;*/ /* Center vertically */
    max-width: 1400px; /* Optional: Set a maximum width for the container */
    margin: 0 auto; /* Center the container horizontally within its parent */
    padding-top: 120px;
}

.desc-header[b-r8m2484nhl], .desc-content[b-r8m2484nhl], .desc-ask[b-r8m2484nhl], .fun-list[b-r8m2484nhl], .desc-end[b-r8m2484nhl] {
    width: 100%; /* Make all child elements fill the container */
    text-align: center; /* Center text within each child element */
}

/* Header */
.desc-header[b-r8m2484nhl] {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    text-align: center;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 2px;
    background: linear-gradient(90deg, #1e3c72, #2a5298);
    color: white;
    padding: 10px;
    border-radius: 5px;
}

/* Description Text */
.desc-content[b-r8m2484nhl] {
    font-size: 20px;
    color: #555;
    line-height: 1.6;
    margin: 15px 0;
    text-align: start;
    padding: 0 1em;
}

/* Question section */
.desc-ask[b-r8m2484nhl] {
    font-size: 24px;
    color: #2a5298;
    font-weight: 800;
    margin-bottom: 10px;
    text-align: center;
}

/* List styling */
.fun-list[b-r8m2484nhl] {
    list-style-type: none;
    padding: 0;
    margin: 20px 0;
    text-align: left;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

    .fun-list li[b-r8m2484nhl] {
        font-size: 18px;
        list-style-type: none;
        margin-bottom: 8px;
    }

        .fun-list li b[b-r8m2484nhl] {
            color: #1e3c72;
            font-weight: bold;
        }


/* Space between sections */
div[style="height: 100px;"][b-r8m2484nhl] {
    background-color: #f4f7fb;
}

/* Footer section */
.desc-end[b-r8m2484nhl] {
    font-size: 18px;
    color: #444;
    font-weight: 500;
    text-align: center;
    padding: 10px;
    margin-top: 30px;
    background: #e9f0fb;
    border-radius: 5px;
}
/* _content/CheerProfileNet/Components/Pages/CheerPage/CheerAttendance.razor.rz.scp.css */
.desc-container[b-cco3sip05o] {
    display: flex;
    flex-direction: column; /* Stack items vertically */
    justify-content: center; /* Center horizontally */
    /*align-items: center;*/ /* Center vertically */
    max-width: 1400px; /* Optional: Set a maximum width for the container */
    margin: 0 auto; /* Center the container horizontally within its parent */
    padding-top: 120px;
}

.desc-header[b-cco3sip05o], .desc-content[b-cco3sip05o], .desc-ask[b-cco3sip05o], .fun-list[b-cco3sip05o], .desc-end[b-cco3sip05o] {
    width: 100%; /* Make all child elements fill the container */
    text-align: center; /* Center text within each child element */
}

/* Header */
.desc-header[b-cco3sip05o] {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    text-align: center;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 2px;
    background: linear-gradient(90deg, #1e3c72, #2a5298);
    color: white;
    padding: 10px;
    border-radius: 5px;
}

/* Description Text */
.desc-content[b-cco3sip05o] {
    font-size: 20px;
    color: #555;
    line-height: 1.6;
    margin: 15px 0;
    text-align: start;
    padding: 0 1em;
}

/* Question section */
.desc-ask[b-cco3sip05o] {
    font-size: 24px;
    color: #2a5298;
    font-weight: 800;
    margin-bottom: 10px;
    text-align: center;
}

/* List styling */
.fun-list[b-cco3sip05o] {
    list-style-type: none;
    padding: 0;
    margin: 20px 0;
    text-align: left;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

    .fun-list li[b-cco3sip05o] {
        font-size: 18px;
        list-style-type: none;
        margin-bottom: 8px;
    }

        .fun-list li b[b-cco3sip05o] {
            color: #1e3c72;
            font-weight: bold;
        }


/* Space between sections */
div[style="height: 100px;"][b-cco3sip05o] {
    background-color: #f4f7fb;
}

/* Footer section */
.desc-end[b-cco3sip05o] {
    font-size: 18px;
    color: #444;
    font-weight: 500;
    text-align: center;
    padding: 10px;
    margin-top: 30px;
    background: #e9f0fb;
    border-radius: 5px;
}
/* _content/CheerProfileNet/Components/Pages/CheerPage/CheerBook.razor.rz.scp.css */
.desc-container[b-azll41fl89] {
    display: flex;
    flex-direction: column; /* Stack items vertically */
    justify-content: center; /* Center horizontally */
    /*align-items: center;*/ /* Center vertically */
    max-width: 1400px; /* Optional: Set a maximum width for the container */
    margin: 0 auto; /* Center the container horizontally within its parent */
    padding-top: 120px;
}

.desc-header[b-azll41fl89], .desc-content[b-azll41fl89], .desc-ask[b-azll41fl89], .fun-list[b-azll41fl89], .desc-end[b-azll41fl89] {
    width: 100%; /* Make all child elements fill the container */
    text-align: center; /* Center text within each child element */
}

/* Header */
.desc-header[b-azll41fl89] {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    text-align: center;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 2px;
    background: linear-gradient(90deg, #1e3c72, #2a5298);
    color: white;
    padding: 10px;
    border-radius: 5px;
}

/* Description Text */
.desc-content[b-azll41fl89] {
    font-size: 20px;
    color: #555;
    line-height: 1.6;
    margin: 15px 0;
    text-align: start;
    padding: 0 1em;
}

/* Question section */
.desc-ask[b-azll41fl89] {
    font-size: 24px;
    color: #2a5298;
    font-weight: 800;
    margin-bottom: 10px;
    text-align: center;
}

/* List styling */
.fun-list[b-azll41fl89] {
    list-style-type: none;
    padding: 0;
    margin: 20px 0;
    text-align: left;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

    .fun-list li[b-azll41fl89] {
        font-size: 18px;
        list-style-type: none;
        margin-bottom: 8px;
    }

        .fun-list li b[b-azll41fl89] {
            color: #1e3c72;
            font-weight: bold;
        }


/* Space between sections */
div[style="height: 100px;"][b-azll41fl89] {
    background-color: #f4f7fb;
}

/* Footer section */
.desc-end[b-azll41fl89] {
    font-size: 18px;
    color: #444;
    font-weight: 500;
    text-align: center;
    padding: 10px;
    margin-top: 30px;
    background: #e9f0fb;
    border-radius: 5px;
}
/* _content/CheerProfileNet/Components/Pages/CheerPage/CheerHome.razor.rz.scp.css */

@keyframes fadein-b-io8z37rnlq {
    0% {
        opacity: .2;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}


.fadeinanimation[b-io8z37rnlq] {
    animation: fadein-b-io8z37rnlq ease 1s;
    display: block;
}

.cheer-container[b-io8z37rnlq] {
}

/* 🎨 Hero-Section */
.hero-section[b-io8z37rnlq] {
    height: 100vh;
    cursor: default;
    width: 100%;
    display: flex;
    justify-content: center;
    animation: fadein-b-io8z37rnlq ease 2s;
}

.hero-content[b-io8z37rnlq] {
    display: grid;
    grid-template-columns: 2fr 3fr;
    gap: 5em;
    height: 100vh;
    width: 100%;
    max-width: 1600px;
}

.hero-title[b-io8z37rnlq] {
    height: 70vh;
    display: flex;
    align-items: end;
    justify-content: end;
    font-family: 'cwTeXYen', Arial, sans-serif;
}

    .hero-title span[b-io8z37rnlq] {
        font-size: 80px;
        text-shadow: -15px 5px 10px rgba(0, 0, 0, 0.3);
        color: #777;
        text-transform: uppercase;
        letter-spacing: 0px;
    }


.hero-text[b-io8z37rnlq] {
    height: 70vh;
    display: flex;
    align-items: end;
    justify-content: center;
}

    .hero-text h4[b-io8z37rnlq] {
        margin: 15px 0;
        font-size: 28px;
        font-weight: 500;
        color: #333;
        line-height: 1.6;
        transition: color 0.3s ease-in-out;
    }

/* 🎨 Hero-Section  End*/


/* 🎨 Demo 區域*/
.demo-section[b-io8z37rnlq] {
    background-color: #eaeaea;
    cursor: default;
    width: 100%;
    display: flex;
    justify-content: center;
}

.demo-content[b-io8z37rnlq] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5em;
    max-height: 100%;
    width: 100%;
    padding: 8rem 0;
}

.demo-content-left[b-io8z37rnlq] {
    display: flex;
    align-items: end;
    justify-content: end;
    font-family: 'cwTeXYen', Arial, sans-serif;
}

    .demo-content-left h4[b-io8z37rnlq] {
        font-size: 30px;
        margin-bottom: .5em;
    }

.demo-content-right[b-io8z37rnlq] {
    width: 100%;
    max-width: 100%;
    display: flex;
    justify-content: start;
    align-items: end;
}


.phone[b-io8z37rnlq] {
    width: 380px;
    height: 650px;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: black;
    box-shadow: 10px 10px 14px gray;
}

    .phone .phonecontent[b-io8z37rnlq] {
        width: 350px;
        height: 620px;
        border-radius: 20px;
        background-color: #eaeaea;
        overflow: hidden;
    }

        .phone .phonecontent .statusbar[b-io8z37rnlq] {
            height: 20px;
            border-radius: 15px 15px 0px 0px;
            background-color: white;
        }

.phonecontent a[b-io8z37rnlq] {
    text-decoration: none;
    color: black;
}

.phonecard[b-io8z37rnlq] {
    height: 110px;
    border-radius: 5px;
    border: solid 1px;
    border-color: silver;
    margin-top: 6px;
    box-shadow: 3px 3px 6px silver;
    position: relative;
}

    .phonecard:hover[b-io8z37rnlq] {
        transform: scale(1.03);
        transition: all 0.25s ease;
    }

    .phonecard .cardtop[b-io8z37rnlq] {
        height: 84px;
        padding: 4px;
    }

        .phonecard .cardtop .cardtopcontainer[b-io8z37rnlq] {
            display: flex;
            justify-content: space-between;
        }

.cardbanner[b-io8z37rnlq] {
    font-size: 22px;
    border: 1px solid silver;
    border-radius: 4px;
    padding: 0 4px;
}

.phonecard .cardtop .cardimgcontainer[b-io8z37rnlq] {
    display: flex;
    align-items: center;
    margin-top: 4px;
    margin-right: 2px;
}

    .phonecard .cardtop .cardimgcontainer .cardimg[b-io8z37rnlq] {
        width: 60px;
        height: 60px;
        object-fit: cover;
        background-color: whitesmoke;
        border-radius: 3px;
    }

.phonecard .cardfooter[b-io8z37rnlq] {
    height: 26px;
    display: flex;
    justify-content: space-between;
    padding: 0px 16px 0px 16px;
}

/* 🎨 Demo 區域 End*/

/* 🎨 Intro-Section*/

.intro-section[b-io8z37rnlq] {
    padding: 4em 0;
}

.intro-section-title[b-io8z37rnlq] {
    text-align: center;
    font-size: 42px;
    margin-bottom: 1em;
    font-family: 'cwTeXYen', Arial, sans-serif;
}

.intro-section-container[b-io8z37rnlq] {
    display: flex;
    justify-content: center;
}

.intro-section-content[b-io8z37rnlq] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2em;
    width: 100%;
    max-width: 1600px;
}

.intro-section-content-col .card[b-io8z37rnlq] {
    margin-bottom: 2em;
}


/* 🎨 Intro-Section End*/



/* 🎯 RWD 響應式設計 */
@media (max-width: 768px) {
    .hero-content[b-io8z37rnlq] {
        grid-template-columns: 1fr;
        height: 100vh;
        align-items: center;
        padding: 1em;
        text-align: start;
    }

    .hero-title[b-io8z37rnlq] {
        display: none;
    }

    .hero-text[b-io8z37rnlq] {
        width: 100%;
        height: auto;
        transform: none;
    }

        .hero-text h4[b-io8z37rnlq] {
            font-size: 24px;
            line-height: 1.4;
            margin-bottom: 1.5em;
        }

    .demo-content[b-io8z37rnlq] {
        display: grid;
        grid-template-columns: 1fr;
        gap: 5em;
        max-height: 100%;
        width: 100%;
        padding: 6rem 0;
        line-height: 1.6;
    }

    .demo-content-left[b-io8z37rnlq] {
        padding: 0 1em;
    }

    .demo-content-right[b-io8z37rnlq] {

    }

    .intro-section-content[b-io8z37rnlq] {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1em;
        width: 100%;
        max-width: 1600px;
        padding: 0 1em;
    }
}


/* _content/CheerProfileNet/Components/Pages/CheerPage/CheerLayout.razor.rz.scp.css */
.profile-nav-container[b-eil2c2pq91] {
    position: relative;
    width: 100%;
    height: auto; /* Let the height adjust based on content */
    cursor: default;
}

/* _content/CheerProfileNet/Components/Pages/CheerPage/CheerNavMenu.razor.rz.scp.css */
/* nav-menu �򥻼˦� */
.nav-menu[b-88b8qbq6ng] {
    background-color: #cccccc99; /* �]�m�b�z�����I���C�� */
    backdrop-filter: blur(4px); /* �I���ҽk�B�z */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 12px 0px; /* �W�[�W�U��Z */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3); /* ��[�j�P�����v�ĪG */
    z-index: 500; /* ���ɯ���B�b�̤W�� */
    /*transition: transform 0.3s ease, box-shadow 0.3s ease;*/
    font-family: "Noto Sans TC", sans-serif;
    justify-content: center;
    display: flex;
}

    /* ��ɯ�����î� */
    .nav-menu.hide[b-88b8qbq6ng] {
        transform: translateY(-100%); /* �V�W�ư����� */
    }

    /* ��ɯ���X�{�� */
    .nav-menu.show[b-88b8qbq6ng] {
        transform: translateY(0); /* �q�W��ƤJ */
        animation: navfadein-b-88b8qbq6ng ease 1s;
    }

    /* container - �]�mflex���� */
    .nav-menu .navcontainer[b-88b8qbq6ng] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 90%;
        max-width: 1600px;
    }

    /* Logo�M���D���� */
    .nav-menu .logo-link[b-88b8qbq6ng] {
        display: flex;
        align-items: center;
        text-decoration: none;
        gap: 0em;
    }

    .nav-menu .logo[b-88b8qbq6ng] {
        width: 55px;
        height: 55px;
        background-color: rgba(255,255,255,1);
        padding: 5px;
        border-radius: 5px;
        margin-right: 10px;
    }

    .nav-menu .site-title[b-88b8qbq6ng] {
        border-radius: 8px;
        font-weight: bolder;
        color: navy;
        padding: 4px 16px;
        text-decoration: none;
        font-size: 24px;
    }

    /* �q������� - �a�k */
    .nav-menu .pc-nav-links[b-88b8qbq6ng] {
        display: flex;
        list-style: none;
        gap: 20px; /* �W�[��涡�Z */
        margin: 0;
        padding: 0;
        margin-left: auto; /* �a�k��� */
    }

        .nav-menu .pc-nav-links .nav-item[b-88b8qbq6ng] {
            position: relative;
        }

        .nav-menu .pc-nav-links a[b-88b8qbq6ng] {
            text-decoration: none;
            color: #222;
            padding: 10px 15px;
            font-size: 22px;
            transition: color 0.3s, background-color 0.3s;
            border-radius: 5px;
        }

            .nav-menu .pc-nav-links a:hover[b-88b8qbq6ng] {
                color: #f2f2f2; /* ��L���զ� */
                background-color: #555; /* �ź��t */
            }

    /* �U�Կ�� */
    .nav-menu .dropdown-toggle[b-88b8qbq6ng] {
        background: none;
        border: none;
        color: #fff;
        cursor: pointer;
    }

    .nav-menu .dropdown-menu[b-88b8qbq6ng] {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        background-color: #333; /* ��s�U�Կ��I����A�P�D��t�@�P */
        list-style: none;
        padding: 10px 0px;
        width: 180px;
        z-index: 300;
        border-radius: 5px;
        box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    }

        .nav-menu .dropdown-menu a[b-88b8qbq6ng] {
            display: block;
            padding: 10px 20px;
            color: #fff; /* �զ��r */
            text-decoration: none;
        }

            .nav-menu .dropdown-menu a:hover[b-88b8qbq6ng] {
                background-color: #666; /* ��`���ź��t�A�A�Xhover�ĪG */
            }

    .nav-menu .dropdown:hover .dropdown-menu[b-88b8qbq6ng] {
        display: block;
    }

    /* �������� */
    .nav-menu .burger-icon[b-88b8qbq6ng] {
        display: none; /* �w�]�q�������� */
        width: 30px;
        height: 30px;
        background: url('images/burger.png') no-repeat center;
        background-size: contain;
        cursor: pointer;
    }

/* ��������}���˦� */
.burger-switch[b-88b8qbq6ng] {
    display: none;
}

/* ��������}�� */
.nav-menu .burger-label[b-88b8qbq6ng] {
    display: none;
    cursor: pointer;
}



.burger-switch:checked ~ .phone-nav-menu[b-88b8qbq6ng] {
    max-height: 80vh;
    padding: 20px 0;
}


.phone-nav-menu[b-88b8qbq6ng] {
    display: block;
    list-style: none;
    background-color: #666; /* �ź��t */
    position: absolute;
    top: 80px;
    left: 0;
    width: 100%;
    z-index: 500;
    border-radius: 5px;
    max-height: 0;
    transition: .5s ease-in-out;
    overflow: hidden;
}






.phone-nav-menu .nav-item[b-88b8qbq6ng] {
    text-align: center;
    opacity: 0;
    transition: 1s;
    margin-bottom: 1em;
}

.burger-switch:checked ~ .phone-nav-menu .nav-item[b-88b8qbq6ng] {
    opacity: 1;
}

.phone-nav-menu .nav-item .main-link[b-88b8qbq6ng] {
    font-size: 1.5em;
    text-decoration: none;
    color: white;
    margin-top: 1em;
}

.phone-nav-menu .nav-item .nav-item-main[b-88b8qbq6ng] {
    font-size: 1em;
    color: whitesmoke;
    text-align: start;
    border-bottom: 1px solid white;
    margin: 10px 20vw 10px 20vw;
}

.phone-nav-menu .nav-item .sub-links[b-88b8qbq6ng] {
}

.phone-nav-menu .nav-item .nav-link[b-88b8qbq6ng] {
    font-size: 1.5em;
    text-decoration: none;
    color: white;
}





/* ��������}�� - �}�Ү���� */
@media (max-width: 768px) {
    .nav-menu .pc-nav-links[b-88b8qbq6ng] {
        display: none; /* �q����������� */
    }

    .nav-menu .burger-icon[b-88b8qbq6ng] {
        display: block; /* ��ܺ~�����ϥ� */
        margin-left: auto;
    }
}


@keyframes navfadein-b-88b8qbq6ng {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* _content/CheerProfileNet/Components/Pages/CheerPage/CheerReservation.razor.rz.scp.css */
.desc-container[b-uvzrbbjbxc] {
    display: flex;
    flex-direction: column; /* Stack items vertically */
    justify-content: center; /* Center horizontally */
    /*align-items: center;*/ /* Center vertically */
    max-width: 1400px; /* Optional: Set a maximum width for the container */
    margin: 0 auto; /* Center the container horizontally within its parent */
    padding-top: 120px;
}

.desc-header[b-uvzrbbjbxc], .desc-content[b-uvzrbbjbxc], .desc-ask[b-uvzrbbjbxc], .fun-list[b-uvzrbbjbxc], .desc-end[b-uvzrbbjbxc] {
    width: 100%; /* Make all child elements fill the container */
    text-align: center; /* Center text within each child element */
}

/* Header */
.desc-header[b-uvzrbbjbxc] {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    text-align: center;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 2px;
    background: linear-gradient(90deg, #1e3c72, #2a5298);
    color: white;
    padding: 10px;
    border-radius: 5px;
}

/* Description Text */
.desc-content[b-uvzrbbjbxc] {
    font-size: 20px;
    color: #555;
    line-height: 1.6;
    margin: 15px 0;
    text-align: start;
    padding: 0 1em;
}

/* Question section */
.desc-ask[b-uvzrbbjbxc] {
    font-size: 24px;
    color: #2a5298;
    font-weight: 800;
    margin-bottom: 10px;
    text-align: center;
}

/* List styling */
.fun-list[b-uvzrbbjbxc] {
    list-style-type: none;
    padding: 0;
    margin: 20px 0;
    text-align: left;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

    .fun-list li[b-uvzrbbjbxc] {
        font-size: 18px;
        list-style-type: none;
        margin-bottom: 8px;
    }

        .fun-list li b[b-uvzrbbjbxc] {
            color: #1e3c72;
            font-weight: bold;
        }


/* Space between sections */
div[style="height: 100px;"][b-uvzrbbjbxc] {
    background-color: #f4f7fb;
}

/* Footer section */
.desc-end[b-uvzrbbjbxc] {
    font-size: 18px;
    color: #444;
    font-weight: 500;
    text-align: center;
    padding: 10px;
    margin-top: 30px;
    background: #e9f0fb;
    border-radius: 5px;
}
/* _content/CheerProfileNet/Components/Pages/CheerPage/InstructionPage.razor.rz.scp.css */
.instruction-container[b-nvs6p6728d] {
    margin-top: 120px;
}
/* _content/CheerProfileNet/Components/Pages/CheerPage/PrivacyPage.razor.rz.scp.css */



.pagecontainer[b-im20mic9gi] {
    font-family: Arial, sans-serif;
    display:flex;
    justify-content:center;
}

.pagecontent[b-im20mic9gi] {
    background-color: #f4f4f4;
    line-height: 1.6;
    margin: 20px;
    padding: 20px;
}

    .pagecontent h1[b-im20mic9gi], h2[b-im20mic9gi], h3[b-im20mic9gi] {
        color: #333;
    }

    .pagecontent p[b-im20mic9gi] {
        color: #555;
    }

    .pagecontent ul[b-im20mic9gi] {
        margin: 10px 0;
        padding-left: 20px;
    }

/* _content/CheerProfileNet/Components/Pages/CheerPage/SystemStructurePage.razor.rz.scp.css */
.roletitle[b-dls8u1pr7n] {
    text-align: center;
    margin-bottom: 2rem;
    font-weight: bolder;
    background-color:#ccc;
    border-radius:6px;
    padding:4px 0;
}

.roledesc[b-dls8u1pr7n] {
    line-height: 32px;
    text-shadow: 3px 3px 8px #aaa;
}

.struc-container[b-dls8u1pr7n] {
    margin-top: 120px;
}


/* _content/CheerProfileNet/Components/Pages/CookieAuthPage/FormPage.razor.rz.scp.css */
.google-login-btn[b-ab4vasxxxf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    background: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
    color: #444;
    text-decoration: none;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: background 0.3s;
}

    .google-login-btn:hover[b-ab4vasxxxf] {
        background: #f7f7f7;
    }

.google-logo[b-ab4vasxxxf] {
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.google-text[b-ab4vasxxxf] {
    font-weight: 500;
}
/* _content/CheerProfileNet/Components/Pages/FormPage/FreshmanFormComponent.razor.rz.scp.css */
/* 根容器樣式 */
.page-container[b-oqwozfpxyd] {
    display: grid;
    gap: 10px;
}

/* 左側區塊 */
.left-section[b-oqwozfpxyd] {
    background-color: #f5f5f5;
    padding: 10px;
    height: 100vh;
    overflow-y: auto;
    display: flex;
    flex-direction:column;
}

/* 右側區塊 */
.right-section[b-oqwozfpxyd] {
    background-color: #fff;
    padding: 10px;
    border-radius: 8px;
    height: 100vh;
    overflow-y: auto;
}

/* 元素間距 */
.d-flex[b-oqwozfpxyd] {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* 超連結樣式 */
.left-section a[b-oqwozfpxyd] {
    color: #007bff;
    text-decoration: none;
}

    .left-section a:hover[b-oqwozfpxyd] {
        text-decoration: underline;
    }

/* RWD 設定 */
@media (min-width: 768px) {
    .page-container[b-oqwozfpxyd] {
        grid-template-columns: 400px 1fr;
    }

    .left-section[b-oqwozfpxyd] {
        grid-column: 1;

    }

    .right-section[b-oqwozfpxyd] {
        grid-column: 2;
    }
}

@media (max-width: 767px) {
    .page-container[b-oqwozfpxyd] {
        grid-template-columns: 1fr;
    }

    .left-section[b-oqwozfpxyd],
    .right-section[b-oqwozfpxyd] {
        grid-column: 1;
        height: auto;
        overflow-y: auto;
    }
}




/* Basic Form Container */
.form-container[b-oqwozfpxyd] {
    max-width: 1200px;
    margin: 20px auto;
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Grouped Form Sections */
details[b-oqwozfpxyd] {
    margin-bottom: 15px;
}

/* Group Summary */
summary[b-oqwozfpxyd] {
    font-size: 1.2em;
    font-weight: bold;
    cursor: pointer;
    color: #007bff;
    padding: 10px;
    background-color: #f1f1f1;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

    summary:hover[b-oqwozfpxyd] {
        background-color: #e2e2e2;
    }

/* Form Fields */
.form-group[b-oqwozfpxyd] {
    margin-bottom: 15px;
    margin-top: 15px;
    margin-left: 15px;
}

details .details-content[b-oqwozfpxyd] {
    max-height: 0;
    overflow: auto;
    transition: max-height 0.8s ease;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

details[open] .details-content[b-oqwozfpxyd] {
    max-height: 1500px; /* 要設夠大，足以容納所有內容 */
}

.disabled-section[b-oqwozfpxyd] {
    opacity: 0.5;
    pointer-events: none;
}

/* Responsive Styles */
@media (max-width: 768px) {
    .form-container[b-oqwozfpxyd] {
        padding: 15px;
    }

    .form-label[b-oqwozfpxyd] {
        font-size: 0.9em;
    }

    .form-control[b-oqwozfpxyd] {
        font-size: 0.9em;
    }

    summary[b-oqwozfpxyd] {
        font-size: 1em;
    }

    details .details-content[b-oqwozfpxyd] {
        display: grid;
        grid-template-columns: 1fr;
    }
}

.required[b-oqwozfpxyd]::before {
    content: "*";
    color: red; /* 想整個 label 變紅，把這行搬到 .required 本身 */
    margin: 0 2px;
    font-weight: 700; /* 可有可無，看風格 */
}

.noselect[b-oqwozfpxyd] {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

/* _content/CheerProfileNet/Components/Pages/FormPage/FreshmanFormPage.razor.rz.scp.css */
/* _content/CheerProfileNet/Components/Pages/FormPage/SchoolFormComponent.razor.rz.scp.css */

.page-wrapper[b-8gnvbh5473] {
    min-height: 100vh; /* 滿版高度 */
    display: flex;
    flex-direction: column;
}

.main-content[b-8gnvbh5473] {
    flex: 1;
}
/* Grouped Form Sections */
details[b-8gnvbh5473] {
    margin-bottom: 15px;
}

/* Group Summary */
summary[b-8gnvbh5473] {
    font-size: 1.2em;
    font-weight: bold;
    cursor: pointer;
    color: #007bff;
    padding: 10px;
    background-color: #f1f1f1;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

    summary:hover[b-8gnvbh5473] {
        background-color: #e2e2e2;
    }


.footer[b-8gnvbh5473] {
    margin-top: 3em;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    padding: 16px 24px;
    background-color: #f8f9fa;
    border-top: 1px solid #ccc;
    font-size: 14px;
    color: #333;
    
}

.footer-left[b-8gnvbh5473] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.footer-title[b-8gnvbh5473] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: bold;
    font-size: 16px;
}

    .footer-title img[b-8gnvbh5473] {
        background-color: white; /* 底色 */
        padding: 2px; /* 圖片內距 */
        border-radius: 6px; /* 圓角 */
        box-shadow: 0 0 3px rgba(0,0,0,0.1); /* 微陰影，讓它更突出 */
    }

.footer-subtext[b-8gnvbh5473] {
    font-size: 13px;
    color: #666;
}

.footer-right[b-8gnvbh5473] {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

    .footer-right a[b-8gnvbh5473] {
        color: #007BFF;
        text-decoration: none;
    }

        .footer-right a:hover[b-8gnvbh5473] {
            text-decoration: underline;
        }

@media (max-width: 768px) {
    .footer[b-8gnvbh5473] {
        flex-direction: column;
        gap: 8px;
        padding: 16px 0px;
    }
}
/* _content/CheerProfileNet/Components/Pages/FormPage/TeacherFormComponent.razor.rz.scp.css */
/* _content/CheerProfileNet/Components/Pages/FormPage/TeacherFormPage.razor.rz.scp.css */
body[b-m7na7f58ie] {
}
/* _content/CheerProfileNet/Components/Pages/Home.razor.rz.scp.css */
.section1-container[b-md9m7jsr9n] {
    height:100vh;
}



.testtitle[b-md9m7jsr9n] {
    color: red;
}

.secondareaheight[b-md9m7jsr9n] {
    height: 90vh;
}

.firstareatextcontent[b-md9m7jsr9n] {
    height: 60vh;
}

.vh85[b-md9m7jsr9n] {
    height: 85vh;
}


.firstrigntarea[b-md9m7jsr9n] {
    display: flex;
    justify-content: center;
    text-shadow: 3px 3px 8px #aaa;
    align-items: end;
}

.fontshadows[b-md9m7jsr9n] {
    text-shadow: -15px 5px 10px #999;
    color: #777;
    letter-spacing: -0.05em;
    user-select: none;
    font-size: 70px;
    transition: all 0.5s ease-out;
}

    .fontshadows:hover[b-md9m7jsr9n] {
        text-shadow: -16px 6px 15px #ced0d3;
    }

.secondleftarea[b-md9m7jsr9n] {
    height: calc((90vh - ((90vh - 650px)/2)));
    text-shadow: 3px 3px 8px #888;
}

.secondrightarea[b-md9m7jsr9n] {
    height: calc((90vh - ((90vh - 650px)/2)));
}

@media screen and (max-width: 767px) {
    .secondareaheight[b-md9m7jsr9n] {
        height: auto;
    }

    .firstareatextcontent[b-md9m7jsr9n]{
        height:75vh;
    }

    .firstrigntarea[b-md9m7jsr9n] {
        align-items: center;
    }

    .secondleftarea[b-md9m7jsr9n] {
        height: auto;
        padding: 6rem 0;
    }

    .secondrightarea[b-md9m7jsr9n] {
        height: 650px;
        padding-bottom: 3rem;
    }
}

.scrollfadein[b-md9m7jsr9n] {
    
}

.fadeinanimation[b-md9m7jsr9n] {
    animation: fadein-b-md9m7jsr9n ease 2s;
    display:block;
}

.fadeincontainer[b-md9m7jsr9n] {
    animation: fadein-b-md9m7jsr9n ease 2s;
}

@keyframes fadein-b-md9m7jsr9n {
    0% {
        opacity: 0;
        transform: translateY(100px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}


.phone[b-md9m7jsr9n] {
    width: 380px;
    height: 650px;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: black;
    box-shadow: 10px 10px 14px gray;
}

    .phone .phonecontent[b-md9m7jsr9n] {
        width: 350px;
        height: 620px;
        border-radius: 20px;
        background-color: #eaeaea;
        overflow: hidden;
    }

        .phone .phonecontent .statusbar[b-md9m7jsr9n] {
            height: 20px;
            border-radius: 15px 15px 0px 0px;
            background-color: white;
        }

.phonecontent a[b-md9m7jsr9n] {
    text-decoration: none;
    color: black;
}

.phonecard[b-md9m7jsr9n] {
    height: 110px;
    border-radius: 5px;
    border: solid 1px;
    border-color: silver;
    margin-top: 6px;
    box-shadow: 3px 3px 6px silver;
    position: relative;
}

    .phonecard:hover[b-md9m7jsr9n] {
        transform: scale(1.03);
        transition: all 0.25s ease;
    }

    .phonecard .cardtop[b-md9m7jsr9n] {
        height: 84px;
        padding: 4px;
    }

        .phonecard .cardtop .cardtopcontainer[b-md9m7jsr9n] {
            display: flex;
            justify-content: space-between;
        }


.cardbanner[b-md9m7jsr9n] {
    font-size: 22px;
    border: 1px solid silver;
    border-radius: 4px;
    padding: 0 4px;
}

        .phonecard .cardtop .cardimgcontainer[b-md9m7jsr9n] {
            display: flex;
            align-items: center;
            margin-top: 4px;
            margin-right: 2px;
        }

            .phonecard .cardtop .cardimgcontainer .cardimg[b-md9m7jsr9n] {
                width: 60px;
                height: 60px;
                object-fit: cover;
                background-color: whitesmoke;
                border-radius: 3px;
            }

    .phonecard .cardfooter[b-md9m7jsr9n] {
        height: 26px;
        display: flex;
        justify-content: space-between;
        padding: 0px 16px 0px 16px;
    }

/* _content/CheerProfileNet/Components/Pages/HRMSMatch/HRMS_SchoolHiringComponent.razor.rz.scp.css */
.page-container[b-rblinsyx3c] {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    flex-wrap: wrap;
}

.left-container[b-rblinsyx3c] {
    width: 400px;
    border-right: 1px solid #ddd;
    padding-right: 1rem;
    height: 100vh;
    overflow-y: auto;
    padding: 1em;
}

.right-container[b-rblinsyx3c] {
    flex: 1;
    padding: 1rem;
    height: 100vh;
    overflow: auto;
}

.schoollist-header[b-rblinsyx3c] {
    border-bottom: 1px solid #ccc;
    padding: .5em 0 .2em 0;
    margin-bottom: .5em;
    text-align: center;
    cursor: default;
    user-select: none;
}

.toggle-icon[b-rblinsyx3c] {
    display: none;
}

    @media (max-width: 768px) {
        .page-container[b-rblinsyx3c] {
            flex-direction: column;
            gap: 0;
        }

        .left-container[b-rblinsyx3c] {
            width: 100%;
            height: auto;
            max-height: none;
            border-right: none;
            margin-bottom: 0px;
            padding-bottom: 0px;
        }

        .right-container[b-rblinsyx3c] {
            width: 100%;
            height: auto;
        }

        .schoollist-header[b-rblinsyx3c] {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .toggle-icon[b-rblinsyx3c] {
            display: block;
        }

        .mobile-accordion[b-rblinsyx3c] {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease, padding 0.3s ease;
            padding: 0 1em;
        }

            .mobile-accordion.active[b-rblinsyx3c] {
                max-height: 10000px; /* 足夠撐開內容即可，不必精準 */
                padding: 1em;
                overflow: auto;
            }
    }


.tf-form-view[b-rblinsyx3c] {
    padding: 1rem;
    border: 1px solid #ccc;
    border-radius: 8px;
    background-color: #fff;
}

.tf-row[b-rblinsyx3c] {
    margin-bottom: 0.75rem;
    display: flex;
    flex-wrap: wrap;
}

    .tf-row span:first-child[b-rblinsyx3c] {
        font-weight: bold;
        margin-right: 0.5rem;
    }


.tab-button[b-rblinsyx3c] {
    display: block;
    width: 100%;
    margin-bottom: 0.5rem;
    padding: 0.6rem 1rem;
    border: 1px solid #0d6efd;
    border-radius: 6px;
    background-color: white;
    color: #0d6efd;
    text-align: center;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

    .tab-button:hover[b-rblinsyx3c] {
        background-color: #e6f0ff;
    }

    .tab-button.active[b-rblinsyx3c] {
        background-color: #0d6efd;
        color: white;
        font-weight: bold;
    }
/* _content/CheerProfileNet/Components/Pages/HRMSMatch/HRMS_TeacherApplyComponent.razor.rz.scp.css */
.page-container[b-gz5b41v5y5] {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}

.left-container[b-gz5b41v5y5] {
    width: 400px;
    height: 100vh;
    overflow-y: auto;
    border-right: 1px solid #ccc;
    padding: 1em;
    box-sizing: border-box;
}

.right-container[b-gz5b41v5y5] {
    flex: 1;
    min-width: 300px;
    height: 100vh;
    overflow-y: auto;
    padding: 1em;
    box-sizing: border-box;
}

/* --- 通用樣式 --- */
.group-section[b-gz5b41v5y5] {
    margin-bottom: 16px;
    padding: 8px 0;
    border-bottom: 1px dashed #ccc;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;
    box-sizing: border-box;
}

.item-row[b-gz5b41v5y5] {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    gap: 8px;
    /* margin-bottom 移除，避免 grid 排版錯誤 */
}

.item-name[b-gz5b41v5y5] {
    font-weight: 600;
    min-width: 120px;
    color: #333;
}

.schoollist-header[b-gz5b41v5y5] {
    border-bottom: 1px solid #ccc;
    padding: .5em 0 .2em 0;
    margin-bottom: .5em;
    text-align: center;
    cursor: default;
    user-select: none;
}

.toggle-icon[b-gz5b41v5y5] {
    display: none;
}

.pc-school-header[b-gz5b41v5y5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1em;
    border-bottom: 1px solid #bbb;
    padding-bottom: 0.5em;
}


.d-pc[b-gz5b41v5y5] {
    display: block;
}

.d-phone[b-gz5b41v5y5] {
    display: none;
}

/* --- RWD 手機模式 --- */
@media (max-width: 768px) {
    .page-container[b-gz5b41v5y5] {
        flex-direction: column;
        gap: 0;
    }

    .left-container[b-gz5b41v5y5] {
        width: 100%;
        height: auto;
        max-height: none;
        border-right: none;
        margin-bottom: 0px;
        padding-bottom: 0px;
    }

    .right-container[b-gz5b41v5y5] {
        width: 100%;
        height: auto;
    }

    .schoollist-header[b-gz5b41v5y5] {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .toggle-icon[b-gz5b41v5y5] {
        display: block;
    }

    .item-row[b-gz5b41v5y5] {
        flex-direction: column;
        align-items: flex-start;
    }

    .item-name[b-gz5b41v5y5] {
        min-width: auto;
    }

    img.img-fluid[b-gz5b41v5y5] {
        width: 100% !important;
        margin-right: 0;
    }

    .group-section[b-gz5b41v5y5] {
        grid-template-columns: 1fr;
    }

    .mobile-accordion[b-gz5b41v5y5] {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease, padding 0.3s ease;
        padding: 0 1em;
    }

        .mobile-accordion.active[b-gz5b41v5y5] {
            max-height: 10000px; /* 足夠撐開內容即可，不必精準 */
            padding: 1em;
            overflow: auto;
        }

    .d-pc[b-gz5b41v5y5] {
        display: none;
    }

    .d-phone[b-gz5b41v5y5] {
        display: block;
    }

    .pc-school-header[b-gz5b41v5y5] {
        display: none;
    }
}




.tab-button[b-gz5b41v5y5] {
    display: block;
    width: 100%;
    margin-bottom: 0.5rem;
    padding: 0.6rem 1rem;
    border: 1px solid #0d6efd;
    border-radius: 6px;
    background-color: white;
    color: #0d6efd;
    text-align: center;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

    .tab-button:hover[b-gz5b41v5y5] {
        background-color: #e6f0ff;
    }

    .tab-button.active[b-gz5b41v5y5] {
        background-color: #0d6efd;
        color: white;
        font-weight: bold;
    }

.photo-grid[b-gz5b41v5y5] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: flex-start;
}

.photo-grid-item[b-gz5b41v5y5] {
    flex: 1 1 calc(33.333% - 16px);
    max-width: calc(33.333% - 16px);
    aspect-ratio: 4 / 3; /* 或 1 / 1 視需求 */
    overflow: hidden;
    border-radius: 8px;
}

    .photo-grid-item img[b-gz5b41v5y5] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

@media (max-width: 768px) {
    .photo-grid-item[b-gz5b41v5y5] {
        flex: 1 1 100%;
        max-width: 100%;
    }
}


/* _content/CheerProfileNet/Components/Pages/MatchSystemDemo/MSIntroPage.razor.rz.scp.css */
/* RWD layout */
.container[b-jhoog2aer5] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

.title[b-jhoog2aer5] {
    text-align: center;
    font-size: 2.5rem;
    margin-bottom: 20px;
}

.section[b-jhoog2aer5] {
    margin-bottom: 30px;
}

.section-title[b-jhoog2aer5] {
    font-size: 1.5rem;
    margin-bottom: 10px;
    font-weight: bold;
}

.section h3[b-jhoog2aer5] {
    font-size: 20px;
}

ul[b-jhoog2aer5] {
    list-style-type: disc;
    margin-left: 20px;
}

.tech-table[b-jhoog2aer5],
.risk-table[b-jhoog2aer5] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

    .tech-table th[b-jhoog2aer5],
    .risk-table th[b-jhoog2aer5] {
        background-color: #f4f4f4;
        text-align: left;
        padding: 10px;
    }

    .tech-table td[b-jhoog2aer5],
    .risk-table td[b-jhoog2aer5] {
        border: 1px solid #ddd;
        padding: 10px;
    }

@media (max-width: 768px) {
    .container[b-jhoog2aer5] {
        padding: 10px;
    }

    .title[b-jhoog2aer5] {
        font-size: 2rem;
    }

    .section-title[b-jhoog2aer5] {
        font-size: 1.25rem;
    }

    ul[b-jhoog2aer5] {
        margin-left: 10px;
    }

    .tech-table[b-jhoog2aer5],
    .risk-table[b-jhoog2aer5] {
        font-size: 0.875rem;
    }
}

.text-gray[b-jhoog2aer5] {
    color: #aaa;
}
/* _content/CheerProfileNet/Components/Pages/MatchSystemDemo/MSUserKeyinPage.razor.rz.scp.css */
h4[b-btf1jgxe35] {
    background-color: #ddd;
    padding: 4px 0;
}

.form-label[b-btf1jgxe35] {
    color: navy;
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Board.razor.rz.scp.css */
/* 公佈欄整體容器 */
.boards-container[b-7z7qzyu3rz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem; /* 公告卡片之間的間距 */
    height: 100vh;
    position: relative;
}

.boards-container-bg[b-7z7qzyu3rz] {
    position: absolute;
    z-index: -1;
    background: linear-gradient(to top, white 0%, rgba(255,255,255, 0.6) 10%, transparent 30%), url(images/profiledemo/blackboard.jpg) no-repeat center center;
    background-size: 130% auto; /* 放大1.3倍 */
    background-position: center top 10%; /* 聚焦於圖片的上方 */
    width: 100%;
    height: 100%;
    /*filter: grayscale(70%) brightness(1.4) opacity(0.9);*/
}



/*/* 標題區域 */
.header-section[b-7z7qzyu3rz] {
    text-align: center;
    position: absolute;
    top: 6vh;
    transform: translateY(-50%)
}

.header-text[b-7z7qzyu3rz] {
    font-size: 3rem;
    font-weight: bold;
    color: #222;
    border-bottom: 2px solid #007bff; /* 藍色底線 */
    display: inline-block;
    padding-bottom: 0.5rem;
}

.card-section[b-7z7qzyu3rz] {
    width: 60%; /* 卡片寬度，根據需求可調整 */
    gap: 2vh;
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 17vh;
}


/* 公告卡片樣式 */
.board-card[b-7z7qzyu3rz] {
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 卡片陰影 */
    overflow: hidden;
    display: flex;
    flex-direction: row;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .board-card:hover[b-7z7qzyu3rz] {
        transform: translateY(-5px); /* 卡片懸停效果 */
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
    }

/* 卡片內容區域 */
.card-body[b-7z7qzyu3rz] {
    display: flex;
    padding: 1.5rem;
    gap: 1rem;
    align-items: flex-start;
}

/* 日期區域 */
.date-section[b-7z7qzyu3rz] {
    text-align: center;
    margin-right: 1rem;
}

.date-main[b-7z7qzyu3rz] {
    font-size: 1.8rem;
    font-weight: bold;
    color: #007bff; /* 日期主色 */
}

.date-year[b-7z7qzyu3rz] {
    font-size: 1rem;
    color: #555; /* 次要日期顏色 */
}

/* 公告內容區域 */
.content-section[b-7z7qzyu3rz] {
    flex: 1;
}

.card-title[b-7z7qzyu3rz] {
    font-size: 1.25rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 0.5rem;
}

.card-text[b-7z7qzyu3rz] {
    font-size: 1rem;
    color: #666;
    margin-bottom: 1rem;
}

.btn-primary[b-7z7qzyu3rz] {
    background-color: #007bff;
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 5px;
    color: white;
    text-decoration: none;
    font-size: 0.9rem;
    transition: background-color 0.3s ease;
}

    .btn-primary:hover[b-7z7qzyu3rz] {
        background-color: #0056b3;
    }


/* 手機版選單開關 - 開啟時顯示 */
@media (max-width: 768px) {
    .boards-container-bg[b-7z7qzyu3rz] {
        position: absolute;
        z-index: -1;
        background: url(images/bgtype1.jpg);
        backdrop-filter: blur(2px);
        width: 100%;
        height: 100%;
        /*filter: grayscale(70%) brightness(1.4) opacity(0.9);*/
    }


    .boards-container[b-7z7qzyu3rz] {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 2rem; /* 公告卡片之間的間距 */
        position: relative;
        height: auto;
    }


    /*/* 標題區域 */
    .header-section[b-7z7qzyu3rz] {
        text-align: center;
        position: relative;
        margin-top: 1rem;
    }

    .header-text[b-7z7qzyu3rz] {
        font-size: 2.5em;
    }

    .card-section[b-7z7qzyu3rz] {
        width: 100%; /* 卡片寬度，根據需求可調整 */
        padding: 1em 1em;
        gap: 1em;
        display: flex;
        flex-direction: column;
        position: relative;
        top: 0;
    }

    .card-body[b-7z7qzyu3rz] {
        display: block;
        padding: 1rem;
        gap: 1rem;
        align-items: flex-start;
    }

    .date-section[b-7z7qzyu3rz] {
        display: flex;
        flex-direction: row-reverse;
        justify-content: start;
        gap: 1px;
    }

    .date-main[b-7z7qzyu3rz] {
        font-size: 1.5rem;
        font-weight: bold;
        color: #007bff; /* 日期主色 */
        letter-spacing: 1px;
    }

    .date-year[b-7z7qzyu3rz] {
        font-size: 1.5rem;
        font-weight: bold;
        color: #007bff; /* 日期主色 */
        letter-spacing: 1px;
    }

        .date-year[b-7z7qzyu3rz]:after {
            content: '/';
        }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Corner.razor.rz.scp.css */
/* 角落探索頁面 */
.exploration-corners-container[b-xti85vepym] {
    max-width: 1100px;
    margin: 40px auto;
    padding: 20px;
    background-color: #f4f7fc;
    border-radius: 8px;
    margin-top: 120px;
}

.header h1[b-xti85vepym] {
    font-size: 2.5rem;
    color: #333;
}

.header .subtitle[b-xti85vepym] {
    font-size: 1.2rem;
    color: #666;
}

.corners-list[b-xti85vepym] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.corner-item[b-xti85vepym] {
    width: 100%;
    max-width: 320px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.corner-image[b-xti85vepym] {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-bottom: 2px solid #eee;
}

.corner-details[b-xti85vepym] {
    padding: 15px;
}

    .corner-details h3[b-xti85vepym] {
        font-size: 1.5rem;
        color: #333;
    }

    .corner-details p[b-xti85vepym] {
        font-size: 1.1rem;
        color: #666;
        margin-top: 10px;
    }

.read-more[b-xti85vepym] {
    text-decoration: none;
    color: #007BFF;
    font-weight: bold;
    margin-top: 15px;
    display: inline-block;
}

@media (max-width: 768px) {
    .corners-list[b-xti85vepym] {
        flex-direction: column;
        align-items: center;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Course.razor.rz.scp.css */
/* 課程頁面 */
.courses-container[b-w9rljn4ey3] {
    max-width: 1100px;
    margin: 40px auto;
    padding: 20px;
    background-color: #f4f7fc;
    border-radius: 8px;
    margin-top:120px;
}

.courses-header h1[b-w9rljn4ey3] {
    font-size: 2.5rem;
    color: #333;
}

.courses-header .subtitle[b-w9rljn4ey3] {
    font-size: 1.2rem;
    color: #666;
}

.courses-list[b-w9rljn4ey3] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.course-item[b-w9rljn4ey3] {
    width: 100%;
    max-width: 320px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.course-image[b-w9rljn4ey3] {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-bottom: 2px solid #eee;
}

.course-details[b-w9rljn4ey3] {
    padding: 15px;
}

    .course-details h3[b-w9rljn4ey3] {
        font-size: 1.5rem;
        color: #333;
    }

    .course-details .age-group[b-w9rljn4ey3] {
        font-size: 1.1rem;
        color: #4CAF50;
    }

    .course-details p[b-w9rljn4ey3] {
        font-size: 1.1rem;
        color: #666;
        margin-top: 10px;
    }

.read-more[b-w9rljn4ey3] {
    text-decoration: none;
    color: #007BFF;
    font-weight: bold;
    margin-top: 15px;
    display: inline-block;
}

@media (max-width: 768px) {
    .courses-list[b-w9rljn4ey3] {
        flex-direction: column;
        align-items: center;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_EduPolicy.razor.rz.scp.css */
/* 外層區域，含背景圖 */
.card-section[b-w105uedcqn] {
    position: relative;
    width: 100%;
    min-height: 100vh; /* 確保區域高度為整個視窗高度 */
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'cwTeXYen', sans-serif;
}

/* 背景圖樣式 */
.card-section-bg[b-w105uedcqn] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-size: cover; /* 背景圖覆蓋整個區域 */
    z-index: -1; /* 將背景置於內容後方 */
    background: linear-gradient( to bottom, white 0%, /* 左上角完全白色 */
    white 0%, /* 漸變結束前 1/3 完全白色 */
    rgba(255, 255, 255, 0) 50%, /* 1/3 後開始透明 */
    transparent 50% /* 從這點完全透明 */
    ), url('images/profiledemo/hero-bg5.jpg') no-repeat center center;
    background-size: cover;
    /*filter: grayscale(100%) contrast(40%) brightness(140%) sepia(0%);*/
}

/* 內容容器 */
.card-section-content[b-w105uedcqn] {
    position: absolute;
    top: 5%;
    text-align: center;
    padding: 2rem;
    border-radius: 15px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    width: 90vw;
    background-color: rgba(255,255,255,0.5);
}

.header-content[b-w105uedcqn] {
    margin-bottom: 2em;
}
/* 標題樣式 */
.card-title[b-w105uedcqn] {
    font-family: 'cwTeXYen', Arial, sans-serif; /* 自訂字體 */
    font-size: 3rem; /* 大字體尺寸 */
    font-weight: bold; /* 粗體字 */
    letter-spacing: 1px; /* 增加字母間距 */
    text-transform: uppercase; /* 轉換為大寫字母 */
    color: #343a40;
    border-bottom: 2px solid #007bff;
    display: inline-block;
    padding-bottom: 0.1rem;
    margin-bottom: 0.5em;
}

.card-subtitle[b-w105uedcqn] {
    font-family: 'cwTeXYen', Arial, sans-serif; /* 自訂字體 */
    font-size: 2rem;
    letter-spacing: -2px; /* 增加字母間距 */
    text-align: start;
    padding: 0 1em;
}

/* 卡片容器 */
.card-items[b-w105uedcqn] {
    display: grid;
    /*grid-auto-flow: column;*/
    grid-template-columns: repeat(4, 1fr);
    gap: 2em; /* 卡片間距 */
}

/* 卡片樣式 */
.card-item[b-w105uedcqn] {
    background-color: #ffffff;
    border-radius: 15px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
    padding-bottom: 0em;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden;
    width: 100%; /* 確保卡片佔滿 grid 單元格 */
    background-color: rgba(255,255,255,0.9);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
}

    /* 卡片懸停效果 */
    .card-item:hover[b-w105uedcqn] {
        transform: scale(1.05); /* 放大效果 */
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    }

/* 卡片圖片 */
.card-item-img[b-w105uedcqn] {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 10px;
    margin-bottom: 1rem;
    transition: transform 0.3s ease;
}

    /* 圖片懸停效果 */
    .card-item-img:hover[b-w105uedcqn] {
        transform: scale(1.1); /* 放大圖片 */
    }

/* 卡片標題 */
.card-item-title[b-w105uedcqn] {
    font-size: 1.8rem;
    font-weight: bold;
    color: #388e3c; /* 綠色標題 */
    margin-bottom: 1rem;
}

/* 卡片描述 */
.card-item-description[b-w105uedcqn] {
    font-size: 1.45rem;
    /*color: #2c6b2f;*/
    line-height: 1.2;
    text-align: start;
    letter-spacing: 1px;
}

@media (max-width: 768px) {
    .card-section[b-w105uedcqn] {
        height: auto;
        padding: 1em 0;
    }

    .card-section-bg[b-w105uedcqn] {
        height: auto;
    }

    .card-section-content[b-w105uedcqn] {
        position: relative;
        top: 0;
        transform: translateY(0);
        padding: 2em 0em;
        box-shadow: none;
    }

    .card-items[b-w105uedcqn] {
        grid-template-columns: repeat(1, 1fr); /* 每列顯示最小250px寬度的卡片，並根據容器寬度自動排列 */
    }

    .card-title[b-w105uedcqn] {
        font-size: 2.5em;
    }

    .card-subtitle[b-w105uedcqn] {
        font-size: 1.5em;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Gallery.razor.rz.scp.css */

/* 基本容器樣式 */
.gallery-container[b-lommm53qoy] {
    width: 100%;
    margin: 0 auto;
    padding: 10px;
    position: relative;
    height: 100vh;
}

.gallery-bg[b-lommm53qoy] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: url('images/hero-bg5.jpg') no-repeat center center; /* 確保背景置中 */
    background-size: cover; /* 背景圖覆蓋整個區域 */
    z-index: -1; /* 將背景置於內容後方 */
    background: linear-gradient( to bottom, white 0%, /* 左上角完全白色 */
    white 70%, /* 漸變結束前 1/3 完全白色 */
    rgba(255, 255, 255, 0) 100%, /* 1/3 後開始透明 */
    transparent 66% /* 從這點完全透明 */
    ), url('images/hero-bg5.jpg') no-repeat center center;
    background-size: cover;
    filter: grayscale(100%) contrast(40%) brightness(140%) sepia(0%);
}

/* 定義網格佈局 */
.gallery-grid[b-lommm53qoy] {
    display: grid;
    grid-template-columns: repeat(6, 27vh);
    grid-template-rows: repeat(3, 27vh);
    gap: 5px;
    justify-content: center;
}

.gallery-item[b-lommm53qoy] {
    position: relative;
    overflow: hidden;
    border-radius: 8px; /* 圓角效果 */
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* 添加過渡效果 */
}

    /* 懸停效果：放大與陰影 */
    .gallery-item:hover[b-lommm53qoy] {
        transform: scale(1.3); /* 放大效果 */
        box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.3); /* 添加陰影 */
        z-index: 1;
    }

    /* 圖片樣式 */
    .gallery-item img[b-lommm53qoy] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 0.5s ease; /* 圖片過渡效果 */
    }

.gallery-logo[b-lommm53qoy] {
    position: relative;
    overflow: hidden;
    border-radius: 8px; /* 圓角效果 */
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* 添加過渡效果 */
}

    /* 圖片樣式 */
    .gallery-logo img[b-lommm53qoy] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 0.5s ease; /* 圖片過渡效果 */
        background-color: white;
    }



/* 大圖樣式佔據 2x2 的區域 */
.large-item[b-lommm53qoy] {
    grid-column: span 2;
    grid-row: span 2;
}

    /* 大圖的懸停效果 */
    .large-item:hover[b-lommm53qoy] {
        transform: scale(1.3);
        box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.35);
        z-index: 1;
    }


/* 校園生活區塊樣式 */
.gallery-center[b-lommm53qoy] {
    background: rgba(123, 0, 120, 0.4); /* 半透明黑色背景，提升文字可讀性 */
    font-size: 3rem; /* 字體大小 */
    margin: 0;
    padding: 20px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center; /* 垂直置中 */
    justify-content: center; /* 水平置中 */
    text-align: center;
    border-radius: 8px; /* 圓角效果 */
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.2); /* 陰影效果 */
    position: relative;
    overflow: hidden;
    cursor: default;
    font-family: 'cwTeXYen', Arial, sans-serif;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); /* 文字陰影，讓文字更加突出 */
    color: #fff; /* 白色文字，保證對比度 */
}

.gallery-phone-title[b-lommm53qoy] {
    display: none;
}
/* 響應式設計：手機設備樣式 */
@media (max-width: 768px) {
    .gallery-phone-title[b-lommm53qoy] {
        display: block;
        font-family: 'cwTeXYen', Arial, sans-serif; /* 自訂字體 */
        font-size: 3rem; /* 大字體尺寸 */
        font-weight: bold; /* 粗體字 */
        letter-spacing: 1px; /* 增加字母間距 */
        text-transform: uppercase; /* 轉換為大寫字母 */
        color: #343a40;
        border-bottom: 2px solid #007bff;
        display: inline-block;
        padding-bottom: 0.1rem;
        margin-bottom: 0.5em;
    }

    .gallery-bg[b-lommm53qoy] {
        position: absolute;
        z-index: -1;
        background: url(images/bgtype1.jpg);
        backdrop-filter: blur(2px);
        width: 100%;
        height: 100%;
    }

    .gallery-grid[b-lommm53qoy] {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
        gap: 10px;
        position: relative;
        height: auto;
    }

    .gallery-item[b-lommm53qoy],
    .large-item[b-lommm53qoy] {
        grid-column: span 1; /* 每個項目佔滿整行 */
        grid-row: span 1;
        height: 48vw; /* 統一高度 */
    }

    .gallery-center[b-lommm53qoy] {
        font-size: 2rem; /* 手機上縮小字體大小 */
        padding: 10px;
        order: -12;
        display: none;
    }

    .gallery-container[b-lommm53qoy] {
        margin: 2em 0;
        position: relative;
        height: auto;
    }

    .gallery-logo[b-lommm53qoy] {
        display: none;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_HeroSection.razor.rz.scp.css */

/* Hero 區域容器 */
.hero-container[b-kmh84f6mxu] {
    position: relative;
    width: 100%;
    height: 100vh; /* 全屏高度 */
    overflow: hidden; /* 防止內容溢出 */
}

.carousel-img[b-kmh84f6mxu] {
    height: 100%; /* Take up the full height of the parent */
    width: 100%; /* Take up the full width of the parent */
    background-size: cover; /* Scale the image to cover the entire div */
    background-repeat: no-repeat; /* Prevent the image from repeating */
    position: absolute; /* Ensure the div acts like the image, filling the carousel-item */
    top: 0;
    left: 0;
    z-index: -1; /* Send it to the background behind content */
    animation: scale-animation-b-kmh84f6mxu 10s infinite; /* Apply the scale animation */
}

.carousel-img1[b-kmh84f6mxu] {
    background-image: url('https://picsum.photos/1200/900?random=1');
    filter: sepia(5%) brightness(120%) saturate(120%);
    background-position: 0px -300px;
}

.carousel-img2[b-kmh84f6mxu] {
    background-image: url('https://picsum.photos/1200/900?random=2'); /* Set the background image */
}

.carousel-img3[b-kmh84f6mxu] {
    background-image: url('https://picsum.photos/1200/900?random=3'); /* Set the background image */
    filter: sepia(5%) brightness(120%) saturate(180%);
    background-position: 0px -340px;
}

/* 定義 scale 動畫效果 */
@keyframes scale-animation-b-kmh84f6mxu {
    0% {
        transform: scale(1); /* 初始大小 */
    }

    100% {
        transform: scale(1.2); /* 回到原始大小 */
    }
}

.carousel-caption[b-kmh84f6mxu] {
    position: absolute;
    bottom: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(50%);
    text-align: center;
    background-color: rgba(0, 0, 0, 0.5); /* 半透明背景讓文字更清晰 */
    padding: 1.2em 2em; /* 增加內邊距 */
    border-radius: 10px; /* 圓角樣式 */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); /* 添加陰影效果 */
    width: 60em;
}

    .carousel-caption h5[b-kmh84f6mxu] {
        font-size: 3em;
        font-weight: bold;
        color: #fff;
        margin-bottom: 0.2em;
        font-family: 'cwTeXYen', Arial, sans-serif; /* 使用可愛的字體 */
        text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); /* 字體陰影 */
        letter-spacing: 2px;
    }

    .carousel-caption p[b-kmh84f6mxu] {
        font-size: 2em;
        color: #ddd;
        font-family: 'cwTeXYen', Arial, sans-serif;
        text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
        margin: 0;
        letter-spacing: 1px;
    }

.phone-hero-container[b-kmh84f6mxu] {
    height: 100vh; /* 全屏高度 */
    width: 100%;
    position: relative;
}

.phone-hero-container-img[b-kmh84f6mxu] {
    background: url('https://picsum.photos/1200/900?random=1');
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    background-position: 35% 0%; /* 水平偏右 25%，垂直居中 */
}

.phone-hero-content[b-kmh84f6mxu] {
    position: absolute;
    top: 15vh;
    left: 2em;
    background: rgba(0, 0, 0, 0.4); /* 半透明黑色背景，提升文字可讀性 */
    grid-template-columns: repeat(2, auto); /* 兩列顯示，列寬自動調整 */
    display: grid; /* 使用 grid 布局 */
    padding: 2em 1em; /* 增加內邊距，根據需要調整 */
    color: white;
    border-radius: 8px; /* 圓角邊框 */
    gap: 1em;
}

    .phone-hero-content h2[b-kmh84f6mxu] {
        font-size: 2.2em;
        text-align: left;
        writing-mode: vertical-rl; /* 使文字直行 (從右到左) */
        white-space: nowrap; /* 防止文本換行 */
        margin: 0; /* 防止外邊距影響排版 */
        padding: 0;
    }

    .phone-hero-content p[b-kmh84f6mxu] {
        font-size: 1.6em;
        line-height: 1em;
        writing-mode: vertical-rl; /* 使文字直行 (從右到左) */
        white-space: nowrap; /* 防止文本換行 */
        margin: 0; /* 防止外邊距影響排版 */
        padding-top: 2em;
    }
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_History.razor.rz.scp.css */
/* 基本樣式 */
.school-history[b-cpmoakkjy4] {
    max-width: 1400px;
    margin: 120px auto 40px; /* 加入 margin-top: 120px */
    padding: 30px;
    background: #f9f9f9;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    text-align: center;
}

/* 標題 */
.history-header h1[b-cpmoakkjy4] {
    font-size: 2.8rem;
    color: #4CAF50;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.subtitle[b-cpmoakkjy4] {
    font-size: 1.4rem;
    color: #666;
    margin-bottom: 30px;
}

/* 內容段落 */
.history-content p[b-cpmoakkjy4] {
    font-size: 1.2rem;
    line-height: 1.6;
    color: #333;
    margin-bottom: 20px;
    text-align: justify;
}

/* 時間軸容器 */
.history-timeline[b-cpmoakkjy4] {
    margin-top: 50px;
    padding-left: 20px;
    border-left: 4px solid #4CAF50;
    position: relative;
    max-width: 1400px;
    margin: 0 auto;
}

/* 時間軸項目 */
.timeline-item[b-cpmoakkjy4] {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
    position: relative;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

    .timeline-item:hover[b-cpmoakkjy4] {
        transform: translateX(10px);
        opacity: 0.8;
    }

.timeline-year[b-cpmoakkjy4] {
    font-size: 1.6rem;
    font-weight: bold;
    color: #fff;
    background: #4CAF50;
    padding: 10px 20px;
    border-radius: 50%;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
    margin-right: 20px;
    min-width: 50px;
    text-align: center;
}

.timeline-content[b-cpmoakkjy4] {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    text-align: left;
    max-width: 850px;
    transition: background-color 0.3s ease;
}

    .timeline-content:hover[b-cpmoakkjy4] {
        background-color: #f1f1f1;
    }

    .timeline-content h3[b-cpmoakkjy4] {
        font-size: 1.6rem;
        color: #333;
        margin-bottom: 8px;
        font-weight: 600;
    }

    .timeline-content p[b-cpmoakkjy4] {
        font-size: 1.1rem;
        color: #666;
        line-height: 1.6;
    }

/* 居中排列 */
div[style="display:flex; justify-content:center;"][b-cpmoakkjy4] {
    display: flex;
    justify-content: center;
    padding-top: 20px;
}

/* 文字與圖片過渡效果 */
.timeline-item .timeline-content[b-cpmoakkjy4] {
    opacity: 0;
    animation: fadeIn-b-cpmoakkjy4 0.5s ease-in-out forwards;
}

@keyframes fadeIn-b-cpmoakkjy4 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* 響應式樣式 */

/* 當螢幕寬度小於 768px (手機和平板) 時 */
@media (max-width: 768px) {
    .school-history[b-cpmoakkjy4] {
        padding: 20px;
        margin: 80px auto;
    }

    .history-header h1[b-cpmoakkjy4] {
        font-size: 2rem;
    }

    .subtitle[b-cpmoakkjy4] {
        font-size: 1.2rem;
    }

    .history-content p[b-cpmoakkjy4] {
        font-size: 1rem;
    }

    .timeline-year[b-cpmoakkjy4] {
        font-size: 1.4rem;
        padding: 8px 16px;
        margin-right: 15px;
    }

    .timeline-item[b-cpmoakkjy4] {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 20px;
    }

    .timeline-content[b-cpmoakkjy4] {
        max-width: 100%;
        margin-top: 10px;
    }

        .timeline-content h3[b-cpmoakkjy4] {
            font-size: 1.4rem;
        }

        .timeline-content p[b-cpmoakkjy4] {
            font-size: 1rem;
        }
}

/* 當螢幕寬度介於 769px 到 1024px (平板橫向和小型桌面) 時 */
@media (min-width: 769px) and (max-width: 1024px) {
    .school-history[b-cpmoakkjy4] {
        padding: 25px;
    }

    .history-header h1[b-cpmoakkjy4] {
        font-size: 2.4rem;
    }

    .subtitle[b-cpmoakkjy4] {
        font-size: 1.3rem;
    }

    .history-content p[b-cpmoakkjy4] {
        font-size: 1.1rem;
    }

    .timeline-year[b-cpmoakkjy4] {
        font-size: 1.5rem;
        padding: 9px 18px;
        margin-right: 18px;
    }

    .timeline-item[b-cpmoakkjy4] {
        flex-direction: row;
        margin-bottom: 25px;
    }

    .timeline-content[b-cpmoakkjy4] {
        max-width: 90%;
        margin-top: 15px;
    }

        .timeline-content h3[b-cpmoakkjy4] {
            font-size: 1.5rem;
        }

        .timeline-content p[b-cpmoakkjy4] {
            font-size: 1.1rem;
        }
}

/* 當螢幕寬度大於 1024px (桌面電腦) */
@media (min-width: 1025px) {
    .school-history[b-cpmoakkjy4] {
        padding: 30px;
    }

    .history-header h1[b-cpmoakkjy4] {
        font-size: 2.8rem;
    }

    .subtitle[b-cpmoakkjy4] {
        font-size: 1.4rem;
    }

    .timeline-year[b-cpmoakkjy4] {
        font-size: 1.6rem;
    }

    .timeline-item[b-cpmoakkjy4] {
        flex-direction: row;
        margin-bottom: 30px;
    }

    .timeline-content[b-cpmoakkjy4] {
        max-width: 650px;
    }

        .timeline-content h3[b-cpmoakkjy4] {
            font-size: 1.6rem;
        }

        .timeline-content p[b-cpmoakkjy4] {
            font-size: 1.1rem;
        }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Home.razor.rz.scp.css */
body[b-l2gc35jg1f] {
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Layout.razor.rz.scp.css */
.profile-nav-container[b-gi85i8fqzp] {
    position: relative;
    width: 100%;
    height: auto; /* Let the height adjust based on content */
    min-height: 100vh;
    cursor: default;
}

.background-img[b-gi85i8fqzp] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('images/profiledemo/bgtype1.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    filter: blur(1px);
    z-index: -1;
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Menu.razor.rz.scp.css */
.menu-container[b-wjoryw3k3q] {
    max-width: 1400px;
    margin: 0px auto;
    font-family: 'Arial', sans-serif;
    padding-top: 120px;
    padding-bottom: 40px;
}

/* 桌機版表格 */
.menu-table table[b-wjoryw3k3q] {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
    font-size: 1.2em;
}

.menu-table th[b-wjoryw3k3q], .menu-table td[b-wjoryw3k3q] {
    padding: 12px;
    text-align: center;
    border-bottom: 1px solid #ddd;
}

.menu-table th[b-wjoryw3k3q] {
    background: #007bff;
    color: white;
    font-weight: bold;
}

.menu-table tr:hover[b-wjoryw3k3q] {
    background: #f8f9fa;
}

/* 手機版卡片 */
.menu-cards[b-wjoryw3k3q] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px;
}

.menu-card[b-wjoryw3k3q] {
    background: white;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 15px;
    transition: transform 0.2s;
}

    .menu-card:hover[b-wjoryw3k3q] {
        transform: scale(1.02);
    }

.menu-card-header[b-wjoryw3k3q] {
    font-size: 1.4rem;
    font-weight: bold;
    color: #007bff;
    margin-bottom: 10px;
}

.menu-card-body div[b-wjoryw3k3q] {
    font-size: 1.2rem;
    margin-bottom: 5px;
}

/* 響應式設計 */
@media (max-width: 768px) {
    .menu-table[b-wjoryw3k3q] {
        display: none; /* 隱藏桌機版表格 */
    }

    .menu-cards[b-wjoryw3k3q] {
        display: flex;
    }
}

@media (min-width: 769px) {
    .menu-cards[b-wjoryw3k3q] {
        display: none; /* 隱藏手機版卡片 */
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Nav.razor.rz.scp.css */
/* nav-menu 基本樣式 */
.nav-menu[b-aetqy19ohs] {
    background-color: #F5E9D6; /* 設置半透明的背景顏色 */
    backdrop-filter: blur(4px); /* 背景模糊處理 */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 12px 0px; /* 增加上下邊距 */
    box-shadow: 0px 6px 15px rgba(193, 177, 163, 0.5); /* 更加強烈的陰影效果 */
    z-index: 500; /* 讓導航條浮在最上方 */
    /*transition: transform 0.3s ease, box-shadow 0.3s ease;*/
    font-family: "Noto Sans TC", sans-serif;
    justify-content: center;
    display: flex;
}

    /* 當導航條隱藏時 */
    .nav-menu.hide[b-aetqy19ohs] {
        transform: translateY(-100%); /* 向上滑動隱藏 */
    }

    /* 當導航條出現時 */
    .nav-menu.show[b-aetqy19ohs] {
        transform: translateY(0); /* 從上方滑入 */
        animation: navfadein-b-aetqy19ohs ease 1s;
    }

    /* container - 設置flex布局 */
    .nav-menu .navcontainer[b-aetqy19ohs] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 90%;
        max-width: 1600px;
    }

    /* Logo和標題部分 */
    .nav-menu .logo-link[b-aetqy19ohs] {
        display: flex;
        align-items: center;
        text-decoration: none;
        gap: 1em;
    }

    .nav-menu .logo[b-aetqy19ohs] {
        width: 55px;
        height: 55px;
        background-color: rgba(255,255,255,1);
        padding: 5px;
        border-radius: 5px;
        margin-right: 10px;
    }

    .nav-menu .site-title[b-aetqy19ohs] {
        font-size: 2.5em;
        color: #5A4F43;
        font-weight: 600;
        font-family: 'cwTeXYen', Arial, sans-serif;
        /* Letterpress Effect */
        text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2), /* Soft shadow for depth */
        -2px -2px 2px rgba(255, 255, 255, 1); /* Highlight for embossing */
        letter-spacing: 0.1em; /* Slightly space out the letters */
    }

    /* 電腦版選單 - 靠右 */
    .nav-menu .pc-nav-links[b-aetqy19ohs] {
        display: flex;
        list-style: none;
        gap: 20px; /* 增加選單間距 */
        margin: 0;
        padding: 0;
        margin-left: auto; /* 靠右對齊 */
    }

        .nav-menu .pc-nav-links .nav-item[b-aetqy19ohs] {
            position: relative;
        }

        .nav-menu .pc-nav-links a[b-aetqy19ohs] {
            text-decoration: none;
            color: #222;
            padding: 10px 15px;
            font-size: 22px;
            transition: color 0.3s, background-color 0.3s;
            border-radius: 5px;
        }

            .nav-menu .pc-nav-links a:hover[b-aetqy19ohs] {
                color: #f2f2f2; /* 更淺的白色 */
                background-color: #555; /* 藍綠色系 */
            }

    /* 下拉選單 */
    .nav-menu .dropdown-toggle[b-aetqy19ohs] {
        background: none;
        border: none;
        color: #fff;
        cursor: pointer;
    }

    .nav-menu .dropdown-menu[b-aetqy19ohs] {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        background-color: #333; /* 更新下拉選單背景色，與主色系一致 */
        list-style: none;
        padding: 10px 0px;
        width: 180px;
        z-index: 300;
        border-radius: 5px;
        box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    }

        .nav-menu .dropdown-menu a[b-aetqy19ohs] {
            display: block;
            padding: 10px 20px;
            color: #fff; /* 白色文字 */
            text-decoration: none;
        }

            .nav-menu .dropdown-menu a:hover[b-aetqy19ohs] {
                background-color: #666; /* 更深的藍綠色系，適合hover效果 */
            }

    .nav-menu .dropdown:hover .dropdown-menu[b-aetqy19ohs] {
        display: block;
    }

    /* 手機版選單 */
    .nav-menu .burger-icon[b-aetqy19ohs] {
        display: none; /* 預設電腦版隱藏 */
        width: 30px;
        height: 30px;
        background: url('images/burger.png') no-repeat center;
        background-size: contain;
        cursor: pointer;
    }

/* 手機版選單開關樣式 */
.burger-switch[b-aetqy19ohs] {
    display: none;
}

/* 手機版選單開關 */
.nav-menu .burger-label[b-aetqy19ohs] {
    display: none;
    cursor: pointer;
}



.burger-switch:checked ~ .phone-nav-menu[b-aetqy19ohs] {
    max-height: 80vh;
    padding: 20px 0;
}


.phone-nav-menu[b-aetqy19ohs] {
    display: block;
    list-style: none;
    background-color: #666; /* 藍綠色系 */
    position: absolute;
    top: 80px;
    left: 0;
    width: 100%;
    z-index: 500;
    border-radius: 5px;
    max-height: 0;
    transition: .5s ease-in-out;
    overflow: hidden;
}






    .phone-nav-menu .nav-item[b-aetqy19ohs] {
        text-align: center;
        opacity: 0;
        transition: 1s;
        margin-bottom: 1em;
    }

.burger-switch:checked ~ .phone-nav-menu .nav-item[b-aetqy19ohs] {
    opacity: 1;
}

.phone-nav-menu .nav-item .main-link[b-aetqy19ohs] {
    font-size: 1.5em;
    text-decoration: none;
    color: white;
    margin-top: 1em;
}

.phone-nav-menu .nav-item .nav-item-main[b-aetqy19ohs] {
    font-size: 1em;
    color: whitesmoke;
    text-align: start;
    border-bottom: 1px solid white;
    margin: 10px 20vw 10px 20vw;
}

.phone-nav-menu .nav-item .sub-links[b-aetqy19ohs] {
}

.phone-nav-menu .nav-item .nav-link[b-aetqy19ohs] {
    font-size: 1.5em;
    text-decoration: none;
    color: white;
}





/* 手機版選單開關 - 開啟時顯示 */
@media (max-width: 768px) {
    .nav-menu .pc-nav-links[b-aetqy19ohs] {
        display: none; /* 電腦版選單隱藏 */
    }

    .nav-menu .burger-icon[b-aetqy19ohs] {
        display: block; /* 顯示漢堡選單圖示 */
        margin-left: auto;
    }
}

@keyframes navfadein-b-aetqy19ohs {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_News.razor.rz.scp.css */
/* 基本樣式 */
.news-container[b-3m19zoredb] {
    max-width: 1200px;
    margin: 120px auto 40px;
    padding: 20px;
    background-color: #fafafa;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.news-header[b-3m19zoredb] {
    text-align: center;
    margin-bottom: 40px;
}

    .news-header h1[b-3m19zoredb] {
        font-size: 2.8rem;
        color: #4CAF50;
        margin-bottom: 10px;
        text-transform: uppercase;
    }

.subtitle[b-3m19zoredb] {
    font-size: 1.4rem;
    color: #666;
}

.news-list[b-3m19zoredb] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.news-item[b-3m19zoredb] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

    .news-item:hover[b-3m19zoredb] {
        transform: translateY(-10px);
    }

.news-image[b-3m19zoredb] {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 15px;
}

.news-details h3[b-3m19zoredb] {
    font-size: 1.6rem;
    color: #333;
    font-weight: 600;
    margin-bottom: 10px;
}

.news-details .date[b-3m19zoredb] {
    font-size: 1.2rem;
    color: #4CAF50;
    margin-bottom: 10px;
}

.news-details p[b-3m19zoredb] {
    font-size: 1rem;
    color: #666;
    line-height: 1.6;
}

.read-more[b-3m19zoredb] {
    display: inline-block;
    font-size: 1rem;
    color: #4CAF50;
    margin-top: 10px;
    text-decoration: none;
}

    .read-more:hover[b-3m19zoredb] {
        text-decoration: underline;
    }

/* 響應式設計 */

/* 手機與平板 (最大寬度768px) */
@media (max-width: 768px) {
    .news-list[b-3m19zoredb] {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .news-container[b-3m19zoredb] {
        padding: 15px;
    }

    .news-header h1[b-3m19zoredb] {
        font-size: 2.4rem;
    }

    .news-item[b-3m19zoredb] {
        padding: 15px;
    }

    .news-details h3[b-3m19zoredb] {
        font-size: 1.4rem;
    }

    .news-details .date[b-3m19zoredb] {
        font-size: 1rem;
    }

    .news-details p[b-3m19zoredb] {
        font-size: 0.9rem;
    }
}

/* 中型平板和小型桌面 (769px 到 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .news-list[b-3m19zoredb] {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }

    .news-container[b-3m19zoredb] {
        padding: 20px;
    }

    .news-header h1[b-3m19zoredb] {
        font-size: 2.6rem;
    }

    .news-item[b-3m19zoredb] {
        padding: 18px;
    }

    .news-details h3[b-3m19zoredb] {
        font-size: 1.5rem;
    }

    .news-details .date[b-3m19zoredb] {
        font-size: 1.1rem;
    }
}

/* 大型桌面螢幕 (1025px以上) */
@media (min-width: 1025px) {
    .news-list[b-3m19zoredb] {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }

    .news-container[b-3m19zoredb] {
        padding: 25px;
    }

    .news-header h1[b-3m19zoredb] {
        font-size: 2.8rem;
    }

    .news-item[b-3m19zoredb] {
        padding: 20px;
    }

    .news-details h3[b-3m19zoredb] {
        font-size: 1.6rem;
    }

    .news-details .date[b-3m19zoredb] {
        font-size: 1.2rem;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_News_Content.razor.rz.scp.css */
/* 詳細頁面樣式 */
.news-detail-container[b-9ohh0xilqz] {
    max-width: 800px;
    margin: 40px auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    margin-top: 120px;
}

.news-header h1[b-9ohh0xilqz] {
    font-size: 2.2rem;
    color: #333;
}

.news-header .date[b-9ohh0xilqz] {
    font-size: 1.2rem;
    color: #4CAF50;
}

.news-content[b-9ohh0xilqz] {
    margin-top: 20px;
}

    .news-content img[b-9ohh0xilqz] {
        width: 100%;
        height: 300px;
        object-fit: cover;
        border-radius: 8px;
    }

    .news-content p[b-9ohh0xilqz] {
        font-size: 1.1rem;
        color: #666;
        line-height: 1.6;
    }
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Principal.razor.rz.scp.css */
/* 園長介紹頁面 */
.principal-intro-container[b-ecf6x6u5me] {
    max-width: 1200px;
    margin: 120px auto;
    padding: 20px;
    background-color: #ffffff;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
}

.header[b-ecf6x6u5me] {
    text-align: center;
    margin-bottom: 30px;
}

    .header h1[b-ecf6x6u5me] {
        font-size: 2.8rem;
        color: #3b4d5c;
        font-weight: bold;
        letter-spacing: 1px;
    }

    .header .subtitle[b-ecf6x6u5me] {
        font-size: 1.2rem;
        color: #7a8c9e;
        font-style: italic;
    }

.principal-content[b-ecf6x6u5me] {
    display: flex;
    flex-direction: row;
    gap: 40px;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.principal-image[b-ecf6x6u5me] {
    flex: 1;
    max-width: 350px;
    height: 350px;
    overflow: hidden;
    border-radius: 12px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

    .principal-image img[b-ecf6x6u5me] {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.3s ease;
    }

        .principal-image img:hover[b-ecf6x6u5me] {
            transform: scale(1.1);
        }

.principal-details[b-ecf6x6u5me] {
    flex: 2;
    max-width: 800px;
    padding: 20px;
    background-color: #f9fafc;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

    .principal-details h2[b-ecf6x6u5me] {
        font-size: 2.2rem;
        color: #2e3b47;
        font-weight: bold;
        margin-bottom: 20px;
    }

    .principal-details .bio[b-ecf6x6u5me] {
        font-size: 1.1rem;
        color: #616e7b;
        line-height: 1.6;
        margin-bottom: 20px;
    }

    .principal-details p[b-ecf6x6u5me] {
        font-size: 1.1rem;
        color: #616e7b;
        line-height: 1.6;
        margin-bottom: 15px;
    }

@media (max-width: 1024px) {
    .principal-content[b-ecf6x6u5me] {
        flex-direction: column;
        align-items: center;
    }

    .principal-image[b-ecf6x6u5me] {
        max-width: 300px;
        height: 300px;
    }

    .principal-details h2[b-ecf6x6u5me] {
        font-size: 2rem;
    }

    .principal-details[b-ecf6x6u5me] {
        padding: 20px;
    }
}

@media (max-width: 768px) {
    .header h1[b-ecf6x6u5me] {
        font-size: 2.4rem;
    }

    .principal-image img[b-ecf6x6u5me] {
        height: 250px;
    }

    .principal-details[b-ecf6x6u5me] {
        padding: 20px;
        max-width: 100%;
    }

        .principal-details h2[b-ecf6x6u5me] {
            font-size: 1.8rem;
        }

        .principal-details p[b-ecf6x6u5me] {
            font-size: 1rem;
        }
}

@media (max-width: 480px) {
    .header h1[b-ecf6x6u5me] {
        font-size: 2rem;
    }

    .principal-details h2[b-ecf6x6u5me] {
        font-size: 1.6rem;
    }

    .principal-details .bio[b-ecf6x6u5me] {
        font-size: 1rem;
    }

    .principal-details p[b-ecf6x6u5me] {
        font-size: 1rem;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Schedule.razor.rz.scp.css */

/* 📌 行事曆外容器 */
.calendar-container[b-kks5gmnhtb] {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 1em;
    padding-top: 120px;
    padding-bottom: 3em;
}

/* 📅 大尺寸: 表格樣式 */
.calendar-table[b-kks5gmnhtb] {
    width: 100%;
    border-collapse: collapse;
    display: table;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    font-size: 1.2em;
}

    .calendar-table th[b-kks5gmnhtb] {
        background: #007bff;
        color: white;
        font-weight: bold;
        padding: 12px;
        text-align: left;

    }

    .calendar-table td[b-kks5gmnhtb] {
        border-bottom: 1px solid #ddd;
        padding: 12px;
        color: #444;
    }

    .calendar-table tbody tr:hover[b-kks5gmnhtb] {
        background: rgba(79, 172, 254, 0.2);
        transition: background 0.3s ease-in-out;
    }

/* 📌 小尺寸: 卡片樣式 */
.calendar-cards[b-kks5gmnhtb] {
    display: none;
    flex-direction: column;
    gap: 12px;
}

.calendar-card[b-kks5gmnhtb] {
    /*background: linear-gradient(135deg, #4facfe, #00f2fe);*/
    background-color: white;
    padding: 16px;
    border-radius: 10px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: white;
    transition: transform 0.2s ease-in-out, box-shadow 0.3s ease-in-out;
}

    .calendar-card:hover[b-kks5gmnhtb] {
        transform: scale(1.03);
        box-shadow: 0 5px 12px rgba(0, 0, 0, 0.3);
    }

.calendar-card-header[b-kks5gmnhtb] {
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    font-size: 16px;
}

.calendar-card-date[b-kks5gmnhtb] {
    color: #007bff;
    font-size: 20px;
}

.calendar-card-type[b-kks5gmnhtb] {
    /*background: rgba(255, 255, 255, 0.3);*/
    background-color: gray;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 16px;
}

.calendar-card-title[b-kks5gmnhtb] {
    font-size: 22px;
    font-weight: bold;
    color: #333;
}

.calendar-card-dsc[b-kks5gmnhtb] {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.9);
}

/* 🎯 RWD: 768px 以下（手機模式） */
@media (max-width: 768px) {
    .calendar-table[b-kks5gmnhtb] {
        display: none;
    }

    .calendar-cards[b-kks5gmnhtb] {
        display: flex;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemo1_Teachers.razor.rz.scp.css */
/* 基本樣式 */
.staff-container[b-t2gd3qcsa4] {
    max-width: 1200px;
    margin: 120px auto 40px;
    padding: 20px;
    background-color: #fafafa;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.staff-header[b-t2gd3qcsa4] {
    text-align: center;
    margin-bottom: 40px;
}

    .staff-header h1[b-t2gd3qcsa4] {
        font-size: 2.8rem;
        color: #4CAF50;
        margin-bottom: 10px;
        text-transform: uppercase;
    }

.subtitle[b-t2gd3qcsa4] {
    font-size: 1.4rem;
    color: #666;
}

.staff-list[b-t2gd3qcsa4] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.staff-item[b-t2gd3qcsa4] {
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

    .staff-item:hover[b-t2gd3qcsa4] {
        transform: translateY(-10px);
    }

.staff-image[b-t2gd3qcsa4] {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 20px;
}

.staff-details h3[b-t2gd3qcsa4] {
    font-size: 1.6rem;
    color: #333;
    font-weight: 600;
    margin-bottom: 10px;
}

.staff-details .position[b-t2gd3qcsa4] {
    font-size: 1.2rem;
    color: #4CAF50;
    margin-bottom: 10px;
}

.staff-details p[b-t2gd3qcsa4] {
    font-size: 1rem;
    color: #666;
    line-height: 1.6;
}

/* 響應式設計 */

/* 手機與平板 (最大寬度768px) */
@media (max-width: 768px) {
    .staff-list[b-t2gd3qcsa4] {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .staff-container[b-t2gd3qcsa4] {
        padding: 15px;
    }

    .staff-header h1[b-t2gd3qcsa4] {
        font-size: 2.4rem;
    }

    .staff-item[b-t2gd3qcsa4] {
        padding: 15px;
    }

    .staff-details h3[b-t2gd3qcsa4] {
        font-size: 1.4rem;
    }

    .staff-details .position[b-t2gd3qcsa4] {
        font-size: 1rem;
    }

    .staff-details p[b-t2gd3qcsa4] {
        font-size: 0.9rem;
    }
}

/* 中型平板和小型桌面 (769px 到 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .staff-list[b-t2gd3qcsa4] {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }

    .staff-container[b-t2gd3qcsa4] {
        padding: 20px;
    }

    .staff-header h1[b-t2gd3qcsa4] {
        font-size: 2.6rem;
    }

    .staff-item[b-t2gd3qcsa4] {
        padding: 18px;
    }

    .staff-details h3[b-t2gd3qcsa4] {
        font-size: 1.5rem;
    }

    .staff-details .position[b-t2gd3qcsa4] {
        font-size: 1.1rem;
    }
}

/* 大型桌面螢幕 (1025px以上) */
@media (min-width: 1025px) {
    .staff-list[b-t2gd3qcsa4] {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }

    .staff-container[b-t2gd3qcsa4] {
        padding: 25px;
    }

    .staff-header h1[b-t2gd3qcsa4] {
        font-size: 2.8rem;
    }

    .staff-item[b-t2gd3qcsa4] {
        padding: 20px;
    }

    .staff-details h3[b-t2gd3qcsa4] {
        font-size: 1.6rem;
    }

    .staff-details .position[b-t2gd3qcsa4] {
        font-size: 1.2rem;
    }
}
/* _content/CheerProfileNet/Components/Pages/ProfileDemo/ProfileDemoIntro.razor.rz.scp.css */


.integration-container[b-28uo701gmm] {
    max-width: 1600px;
    margin: 2em auto;
    padding: 40px;
    font-family: 'Arial', sans-serif;
    background: linear-gradient(135deg, #ffffff, #f8f9fa);
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out;
    margin-top: 120px;
}

    .integration-container:hover[b-28uo701gmm] {
        transform: scale(1.02);
    }

    /* 標題 */
    .integration-container .title[b-28uo701gmm] {
        font-size: 2.8rem;
        font-weight: bold;
        margin-bottom: 30px;
        color: #333;
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 2px;
        text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
    }

    /* 介紹文字 */
    .integration-container .description[b-28uo701gmm] {
        font-size: 1.6rem;
        line-height: 1.8;
        margin-bottom: 1.5em;
        text-align: justify;
        color: #444;
        padding: 0 20px;
    }

        .integration-container .description strong[b-28uo701gmm] {
            color: #e74c3c;
            font-weight: bold;
            background: linear-gradient(to right, #e74c3c, #ff6f61);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

    /* 功能列表 */
    .integration-container .features[b-28uo701gmm] {
        list-style-type: none;
        padding-left: 0;
        margin: 16px 0;
    }

        .integration-container .features li[b-28uo701gmm] {
            margin-bottom: 12px;
            font-size: 1.4rem;
            background: #fff;
            padding: 12px;
            border-radius: 10px;
            box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.1);
            display: flex;
            align-items: center;
            transition: transform 0.2s;
        }

            .integration-container .features li:hover[b-28uo701gmm] {
                transform: translateX(8px);
                background: #eef5ff;
            }

        .integration-container .features strong[b-28uo701gmm] {
            color: #007bff;
            margin-right: 8px;
        }

        /* 圖示 */
        .integration-container .features li[b-28uo701gmm]::before {
            content: "✔";
            font-size: 1.5rem;
            color: #28a745;
            font-weight: bold;
            margin-right: 10px;
        }

    /* 高亮文字 */
    .integration-container .highlight[b-28uo701gmm] {
        font-weight: bold;
        text-align: center;
        margin-top: 40px;
        font-size: 1.6rem;
        color: #555;
        padding: 10px;
        border-radius: 10px;
        background: linear-gradient(135deg, #f8f9fa, #e9ecef);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        transition: background 0.3s ease-in-out;
    }

        .integration-container .highlight:hover[b-28uo701gmm] {
            background: linear-gradient(135deg, #e9ecef, #dee2e6);
            color: #333;
        }

/* 響應式設計 */
@media (max-width: 768px) {
    .integration-container[b-28uo701gmm] {
        padding: 20px;
        margin-top: 50px;
    }

        .integration-container .title[b-28uo701gmm] {
            font-size: 2.2rem;
        }

        .integration-container .description[b-28uo701gmm] {
            font-size: 1.4rem;
        }

        .integration-container .features li[b-28uo701gmm] {
            font-size: 1.2rem;
            padding: 10px;
        }

        .integration-container .highlight[b-28uo701gmm] {
            font-size: 1.4rem;
        }
}






/* 整體頁面容器 */
.home-container[b-28uo701gmm] {
    max-width: 1600px;
    margin: 2em auto;
    padding: 20px;
    font-family: 'Arial', sans-serif;
    margin-top: 60px;
}

/* 標題樣式 */
.home-title[b-28uo701gmm] {
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 30px;
    color: #333;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 2px;
}

/* 設計卡片容器 */
.home-card-container[b-28uo701gmm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    margin-bottom: 60px;
}

/* 每一個設計卡片 */
.home-card[b-28uo701gmm] {
    /*background-color: #ffffff;*/
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    padding: 25px;
    display: flex;
    flex-direction: column;
    /*justify-content: space-between;*/
    height: 100%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-decoration: none;
}

    .home-card:hover[b-28uo701gmm] {
        transform: translateY(-5px);
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
    }

/* 卡片內的文字鏈接 */
.home-btnlink[b-28uo701gmm] {
    font-size: 1.5rem;
    font-weight: bold;
    color: #007bff;
    text-decoration: none;
    margin-bottom: 15px;
    transition: color 0.3s ease;
}

    .home-btnlink:hover[b-28uo701gmm] {
        color: #0056b3;
    }

.hightlight[b-28uo701gmm] {
    background-color: rgba(255,0,0,0.1);
}

/* 卡片描述 */
.home-card-content[b-28uo701gmm] {
    font-size: 1.1rem;
    color: #555;
    line-height: 1.6;
    text-align: justify;
}

/* 設計彈性介紹 */
.design-content[b-28uo701gmm] {
    margin-top: 40px;
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

/* 左側內容部分 */
.design-content-left[b-28uo701gmm] {
    flex: 1;
}

/* 右側 Demo 部分 */
.design-content-right[b-28uo701gmm] {
    flex: 1;
}

/* 設計特點列表 */
.design-features[b-28uo701gmm] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.design-feature[b-28uo701gmm] {
    margin-bottom: 25px;
    padding-left: 15px;
    border-left: 4px solid #007bff;
}

    .design-feature:last-child[b-28uo701gmm] {
        margin-bottom: 0;
    }

/* 每個特點的標題 */
.feature-title[b-28uo701gmm] {
    font-size: 1.6rem;
    font-weight: bold;
    color: #007bff;
    position: relative;
}



/* 每個特點的描述 */
.feature-description[b-28uo701gmm] {
    font-size: 1.2rem;
    color: #555;
    line-height: 1.6;
}

.conent-badge[b-28uo701gmm] {
    color: #e74c3c;
    font-weight: bold;
}
/* 內容區塊清單 */
.content-block-list[b-28uo701gmm] {
    list-style: none;
    padding-left: 20px;
}

    .content-block-list li[b-28uo701gmm] {
        font-size: 1.1rem;
        color: #000;
        margin-bottom: 5px;
    }

/* 設計示範區 */
.design-content-view[b-28uo701gmm] {
    margin-top: 50px;
    display: flex;
    justify-content: center;
}

.design-demo[b-28uo701gmm] {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 850px;
    background-color: #f9f9f9;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .design-demo:hover[b-28uo701gmm] {
        transform: translateY(-5px);
        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    }

/* 導覽列 */
.design-demo-nav[b-28uo701gmm] {
    background: linear-gradient(135deg, #0056b3, #007bff);
    padding: 18px;
    margin-bottom: 20px;
    border-radius: 8px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1.4rem;
}

/* 主視覺區 */
.design-demo-hero[b-28uo701gmm] {
    background: linear-gradient(135deg, #e74c3c, #f39c12);
    padding: 3em 1em;
    margin-bottom: 20px;
    border-radius: 8px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    font-size: 1.4rem;
}

/* 內容區塊 */
.design-demo-content[b-28uo701gmm] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
    margin-bottom: 20px;
    background: linear-gradient(135deg, #2d6a4f, #4caf50);
    padding: 20px;
    border-radius: 8px;
}

/* 內容區塊標題 */
.design-demo-content-header[b-28uo701gmm] {
    font-size: 1.4rem;
    font-weight: bold;
    color: #FFF;
    margin-bottom: 15px;
    position: relative;
    text-align: center;
}


/* 內容區塊內容 */
.design-demo-content-section[b-28uo701gmm] {
    background-color: #f9f9f9; /* 淡色背景 */
    padding: 20px;
    margin-bottom: 15px;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    font-size: 1.2rem;
    color: #555;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

    .design-demo-content-section:hover[b-28uo701gmm] {
        background-color: #f1f1f1;
        transform: translateY(-3px);
    }

/* 頁腳區域 */
.design-demo-footer[b-28uo701gmm] {
    background: linear-gradient(135deg, #34495e, #7f8c8d);
    color: #fff;
    padding: 15px;
    border-radius: 8px;
    text-align: center;
    font-weight: bold;
    font-size: 1.4rem;
    letter-spacing: 1px;
}


/* 響應式設計 */
@media (max-width: 768px) {
    /* 設計卡片的排版 */
    .home-card-container[b-28uo701gmm] {
        grid-template-columns: 1fr;
    }

    /* 設計彈性介紹左右拆分調整為上下 */
    .design-content[b-28uo701gmm] {
        flex-direction: column;
    }

    .design-content-left[b-28uo701gmm], .design-content-right[b-28uo701gmm] {
        max-width: 100%;
        min-width: 100%;
    }

    /* 設計示範區 */
    .design-demo[b-28uo701gmm] {
        padding: 20px;
    }

    .design-demo-nav[b-28uo701gmm], .design-demo-hero[b-28uo701gmm], .design-demo-footer[b-28uo701gmm] {
        font-size: 1rem;
    }

    .design-demo-content-header[b-28uo701gmm] {
        font-size: 1.2rem;
    }

    .design-demo-content-section[b-28uo701gmm] {
        font-size: 1rem;
    }

    .feature-title[b-28uo701gmm] {
        font-size: 1.4rem;
    }

    .feature-description[b-28uo701gmm] {
        font-size: 1.2rem;
    }

    .content-block-list li[b-28uo701gmm] {
        font-size: 1.1em;
    }
}
/* _content/CheerProfileNet/Components/Pages/TempPage/BoardHistory.razor.rz.scp.css */
/* 頁面容器 */
.page-container[b-9lnnc3u91e] {
    max-width: 800px;
    margin: 0px auto;
    font-family: Arial, sans-serif;
    color: #000;
}

/* 學生區塊 */
.student-board[b-9lnnc3u91e] {
    margin-bottom: 15px;
}

.student-header[b-9lnnc3u91e] {
    font-size: 18px;
    font-weight: bold;
    /*padding: 8px;*/
    /*border-radius: 5px;*/
    text-align:center;
    padding-top: 8px;
}

/* 留言板塊 */
.board-card[b-9lnnc3u91e] {
    border: 1px solid #ccc;
    margin: 8px 0;
    padding: 8px;
    border-radius: 5px;
    background: #fff;
}

.board0-area[b-9lnnc3u91e] {
    padding: 8px;
    border-bottom: 1px solid #ddd;
}

.board0-header[b-9lnnc3u91e] {
    font-weight: bold;
    margin-bottom: 5px;
}

.board0-content[b-9lnnc3u91e] {
    font-size: 14px;
    color: #444;
}

/* 子留言區域 */
.subboard-area[b-9lnnc3u91e] {
    margin-top: 8px;
    padding-left: 10px;
    border-left: 2px solid #ccc;
}

.subboard-content[b-9lnnc3u91e] {
    padding: 5px;
    margin-bottom: 5px;
    /*background: #f2f2f2;*/
    border-radius: 5px;
    /*white-space: pre-wrap;*/
}

.subboard-header[b-9lnnc3u91e] {
    font-weight: bold;
    font-size: 14px;
    color: #000;
}

.subbaord-content[b-9lnnc3u91e] {
    font-size: 13px;
    color: #444;
}
/* _content/CheerProfileNet/Components/Pages/TempPage/LeaveHistoy.razor.rz.scp.css */
/* 頁面容器 */
.page-container[b-yok93y0tu5] {
    max-width: 800px;
    margin: 0px auto;
    font-family: Arial, sans-serif;
    color: #000;
}

/* 學生區塊 */
.student-board[b-yok93y0tu5] {
    margin-bottom: 15px;
}

.student-header[b-yok93y0tu5] {
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    padding-top: 8px;
}

.leave-list[b-yok93y0tu5] {

}

.leave-content[b-yok93y0tu5] {
    border: 1px solid #ccc;
    margin: 8px 0;
    padding: 8px;
    border-radius: 5px;
    background: #fff;
    display: flex;
    gap: 10px;
    justify-content: space-between;
}

.content-left[b-yok93y0tu5] {
    flex-grow: 1;
}

.content-right[b-yok93y0tu5] {

    flex-shrink: 0;
    align-self: end;
}
/* _content/CheerProfileNet/Components/Pages/TempPage/MedicineHistory.razor.rz.scp.css */
/* Page container */
.page-container[b-3gui8g6p1l] {
    margin: 20px;
    padding: 10px;
    font-family: Arial, sans-serif;
}

/* Date section */
.date-section[b-3gui8g6p1l] {
    margin-bottom: 20px;
}

/* Date header */
.date-header[b-3gui8g6p1l] {
    font-size: 16px;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    gap: 1.5em;
}

/* Medicine card */
.med-card[b-3gui8g6p1l] {
    background-color: #fff;
    margin-bottom: 15px;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

/* Medicine card header */
.med-card-header[b-3gui8g6p1l] {
    display: flex;
    gap: 1em;
    font-weight:bold;
    font-size: 16px;
}

/* Medicine card body */
.med-card-body[b-3gui8g6p1l] {
    padding: 0 8px;
}

/* Medicine item */
.med-item[b-3gui8g6p1l] {
    display: flex;
    gap: 1em;
    padding: 5px 0;
}

/* Medicine description */
.med-desc[b-3gui8g6p1l] {
    font-size: 14px;
}

/* Medicine remark */
.med-remark[b-3gui8g6p1l] {
    font-size: 14px;
    color: #333;
}

.med-nofeed[b-3gui8g6p1l] {
    color: red;
}
/* _content/CheerProfileNet/Components/Pages/TempPage/StudentRecordHistory.razor.rz.scp.css */
.page-container[b-it961f8wla] {
    padding: 20px;
    background-color: #ffffff;
}

.record-card[b-it961f8wla] {
    background-color: #fff;
    margin-bottom: 15px;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.record-header[b-it961f8wla] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0px;
}

.record-date[b-it961f8wla] {
    font-weight: bold;
    color: #333;
}

.student-name[b-it961f8wla] {
    font-size: 1rem;
    font-weight: bold;
}

.record-detail[b-it961f8wla] {
    display: flex;
    align-items: flex-start; /* 顶部对齐 */
    width: 100%; /* 确保占满父容器宽度 */
    white-space: nowrap; /* 防止标签换行 */
}

    .record-detail .label[b-it961f8wla] {
        flex-shrink: 0; /* 防止标签缩小 */
        margin-right: 10px; /* 标签和内容之间的间距 */
        font-weight: bold;
    }

    .record-detail .content[b-it961f8wla] {
        flex-grow: 1; /* 内容会填满剩余空间 */
        text-align: left; /* 确保内容对齐 */
        white-space: normal; /* 确保内容可以换行 */
        overflow: visible; /* 确保内容不被裁剪 */
        padding-top: 0;
    }



.messages-section[b-it961f8wla] {
    margin-top: 15px;
}

.messages-header[b-it961f8wla] {
    font-weight: bold;
    color: #333;
    margin-bottom: 8px;
}

.messages-list[b-it961f8wla] {
    padding-left: 20px;
}

.message-item[b-it961f8wla] {
    margin-bottom: 0px;
    font-size: 0.95rem;
    color: #444;
}

.sender[b-it961f8wla] {
    font-weight: bold;
    margin-right: 5px;
}

.message-time[b-it961f8wla] {
    font-size: 0.85rem;
    color: #777;
}