:root{
    --blue-100: #bee2dd;
    --blue-200: #b9d7f1;
    --blue-250: #cfe9e6;
    --blue-300: #7faaba;
    --blue-500: #65babb;
    --blue-700: #1d62ce;
    --blue:#004097;

    --green-100: #d0e396;
    --green-300: #6fc3b0;
    --green-400: #47b454;
    --green-500: #38ad3e;
    --green-600: #3fa351;
    

    --yellow-050: #fef8e7;
    --yellow-100: #f5eace;
    --yellow-200: #f6ebc7;
    --yellow-300: #fff095;
    --yellow-400: #ffe572;
    --yellow-500: #f6de74;
    --yellow-600: #f1d824;

    --orange-500: #ff5d1b;
    --orange-700: #af4422;

    --red-400: #c63838;
    --red-500: #ee1e35; 
    --red-600: #e81e35;
    --red-700: #cf121b;
    --red-800: #ad2424;

    --brown-200: #865624;
    --brown-300: #885931;
    --brown-500: #551d11;

    --pink-100: #fadff1;
    --pink-300: #f0bdca;
    --pink-500: #e776aa;
    --pink-700: #e8546d;
    --pink-800: #e61d55;

    --gray-350: #dbdcdc;
    --gray-400: #b5b5b6;
    --gray-800: #828282;
    --gray-900: #595757;

    --font-xs:0.75rem;
    --font-sm:0.875rem;
    --font-base:1rem;
    --font-md: 1.125rem;
    --font-lg: 1.25rem;
    --font-llg: 1.375rem;
    --font-xl: 1.5rem;
    --font-2xl: 1.75rem;
    --font-3xl: 2rem;
    --font-35xl: 2.5rem;
    --font-4xl: 3rem;
}

.red-600{
    color:var(--red-600);
}

.red-400{
    color:var(--red-400);
}

.red-800{
    color:var(--red-800);
}

.orange-500{
    color:var(--orange-500) !important;
}

.pink-700{
    color:var(--pink-700);
}

.gray-900{
    color:var(--gray-900);
}

.btn-red-600{
    background:var(--red-600);
}

.w-90{
    width:90%;
}

p{
    font-size:var(--font-base);
}

section[id] {
    scroll-margin-top: 30px; 
}

/* 廣告 */
#AD2026{    
    position:relative;  
    background:var(--blue-200);
}

.FooterPresent2024{
    background:var(--gray-350);
}

/* Navbar2026 */
#navbar2026{
    position:relative;
    background: var(--green-300);
    display:flex;
    justify-content:center;
    padding-bottom: 0.5rem;
    overflow:hidden;
    z-index:9;
}

#navbar2026 ul{
    position:relative;
    display:flex;
    flex-wrap:wrap;
    justify-content: center;
    width:70%;
    margin:1rem 0 .8rem 0;
    padding: 0;
    z-index:5;
}

#navbar2026 ul li{
    font-family:"Noto Sans TC", sans-serif;
    list-style:none;
    text-align:center;
    width:calc(100% / 6);
}

#navbar2026 ul li a{
    position:relative;
    font-size:1.125rem;
    font-weight:600;
    color:var(--white);
    text-decoration: none;
    padding:0;
    z-index:9;
}

#navbar2026 ul li a:hover{
    background: var(--white);
    color:var(--black);
    border-radius:5rem;
    padding: .3rem 1rem .5rem 1rem;
}

#navbar2026 .bg{
    opacity: 60%;
    top:0;
    left:0;
    z-index:-1;
}

/* 活動辦法 */
#ActionWrap2026{
    position:relative;
    background:var(--pink-300);
    padding: 4rem 0 0 0;
    overflow:hidden;
    z-index:1;

    .title-wrap{
        position:relative;
        z-index:3;

        .titleAction{
            img{
                display:block;
                width:52%;
                margin:0 auto;
            }

            h2{
                font-size:var(--font-3xl);
                margin-bottom: 5rem;
            }

            .title{
                width:50%;
                
                &:before, &:after{
                    position:absolute;
                    content:"";
                    background:var(--pink-700);
                    width:350px;
                    height:1px;
                    margin:auto;
                    top:0;
                    bottom:0;
                    z-index:3;
                }

                &:before{
                    left:0;
                }

                &:after{
                    right:0;
                }
            }

            h3{
                background:var(--pink-700);
                font-size:var(--font-2xl);
                border-radius:2rem;
                width:fit-content;
                padding:.5rem 2rem;  
                z-index:5;             
            }

            .bg-title{
                top:3rem;
                left:-9rem;

                img{
                    width:35%;
                }
            }
        }

        .con{
            width:fit-content;

            .con-wrap{ 
                width:100%;

                h3{
                    color:var(--pink-700);
                    font-size: var(--font-xl);
                    width:fit-content;
                    text-align:center;
                    padding:1.5rem 2rem;
                }

                .txt-time{
                    width:fit-content;
                    
                    .title{
                        h3{
                            display:block;
                            margin-left:auto;
                            margin-right:auto;
                        }

                        .bg{
                            width:90%;
                            top:0;
                            left:0;
                            right:0;
                            margin:auto;
                            z-index:-1;
                        
                        }
                    }

                    .con{
                        margin-left: 2rem;

                        p{
                            font-size:var(--font-2xl);

                            &:first-child{
                                font-size:var(--font-md);
                            }
                        }
                    }
                    
                }

                .txt-con{
                    width:fit-content;
                    margin-left: 3rem;

                    .title{
                        .bg{
                            width:53%;
                            top:0;
                            left:0;
                            margin:auto;
                            z-index:-1;
                        
                        }
                    }

                    h2{
                        font-size:var(--font-2xl);width:fit-content;
                        font-weight:900;
                        letter-spacing: .2rem;
                    }

                    .action{

                        ul{
                            width:fit-content;
                            padding-inline-start: 0;

                            li{
                                font-size:var(--font-md);
                                color:var(--black);
                                list-style:none;
                                line-height:2.4rem;

                                span{
                                    background:var(--pink-700);
                                    font-size:var(--font-sm);
                                    color:var(--white);
                                    border-radius:50%;
                                    margin: 0 .3rem;
                                    padding: .2rem .2rem;

                                    &:last-child{
                                        background:transparent;
                                        font-size:var(--font-md);
                                        color:var(--pink-700);
                                        margin-left:.1rem;
                                    }
                                }
                            }
                        }                        
                    }
                }

            }
        }  
        
        .action-group{
            width:65%;
            margin-left: auto;
            margin-right:auto;

            .photo{
                width:20%;

                &:first-child{
                    margin-top: -9rem;
                }

                &:last-child{
                    margin-top: -9rem;
                }
            }
        }

        P{
            font-size:var(--font-sm);
        }
    } 

    .bg-action{
        img{
            position:absolute;

            &:first-child{
                opacity: 60%;
                top:0;
                left:0;
                z-index:1;
            }
        }
    }
}

/* 預約試讀填寫 */
#Reservation2026{
    background: var(--blue-200);
    margin-top: -0.2rem;
    padding:4rem 0 0 0;
    overflow:hidden;
    z-index:1;

    .ReservationWrap{
        position:relative;
        z-index:3;        

        .con{
            display:block;
            width:900px;
            margin:0 auto;
            padding:0 5rem 0 3rem;

            .title{

                h3{
                    background:var(--pink-700);
                    color:var(--white);
                    width:fit-content;
                    border-radius:2rem;
                    padding:.5rem 2rem;
                }
            }
        }
    }

    .ReservationWrap .ReservationWrap-group{
        display:block;
        width:60%;
        margin:0 auto;
    }

    .ReservationWrap .Reservation-bg{
        background: var(--white);
        border-radius:5rem;
        padding:1.2rem;
    }

    .ReservationWrap .Reservation-bg .bgWhite {
        background: var(--white);
        border:10px solid var(--pink-500);
        border-radius:4.5rem;
        padding:3rem 1rem;
    }

    .bg{

        img{
            position:absolute;

            &:first-child{
                opacity: 60%;
                top: 0;
                left:0;
                z-index:-1;
            }

            &:nth-child(2){
                width:12%;
                top:0;
                left:23%;
                z-index:3; 
            }

            &:last-child{
                width:10%;
                top:3rem;
                right:26%;
                z-index:3;
            }
        }
    }

    img.bg-down{
        z-index:5;
    }
    
}

#Reservation2026 .ReservationWrap .title p{
    font-size:1.25rem;
    color:var(--pink-700);
    margin-bottom:.5rem;
}

#Reservation2026 .ReservationWrap .title p.note{
    font-size:1rem;
    color:var(--black);
    padding-bottom: .6rem;
}

#Reservation2026 .ReservationWrap .form-group{
    font-family:'Roboto', 'Noto Sans TC', Verdana, Arial, Helvetica, sans-serif;
    font-size:1.125rem;
    font-weight:500;
    display:flex;
    flex-wrap:wrap;
    justify-content: center;
    align-items:center;
    color:var(--black);
    padding:.8rem 0;
}

#Reservation2026 .ReservationWrap .form-control{
    background:var(--gray-200);
    font-size:1.2rem;
    font-weight:400;
    color:var(--black);
    border:1px solid var(--gray-200);
}

#Reservation2026 .ReservationWrap .form-group input:focus, 
#Reservation2026 .ReservationWrap .form-group select:focus{
    background:var(--white);
    border:0;
    box-shadow:3px 3px 3px var(--gray-300);
}

#Reservation2026 .ReservationWrap .form-group select{
    background:var(--gray-200);
    border-radius:.375rem;
    border:0;
    color:var(--black);
    line-height:1.5;
    padding:.375rem .75rem;
}

#Reservation2026 .ReservationWrap .form-group select option{
    background:var(--white);
}

#Reservation2026 .ReservationWrap .form-group button{
    background:var(--pink-700);
    font-size:1.125rem;
    color:var(--white);
    border-radius:2rem;
    border:0;
    padding:.2rem 1rem;
}

#Reservation2026 .ReservationWrap .form-group span.text,
#Reservation2026 .ReservationWrap p.warn,
#Reservation2026 .ReservationWrap p.warn a{
    font-size:.9rem;
}

#Reservation2026 .ReservationWrap p.warn a{
    color: var(--blue-700);
    text-decoration: none;
}

#Reservation2026 .ReservationWrap p.warn a:hover{
    color: var(--pink-700);
}

#Reservation2026 .bottom{
    position:relative;
    z-index:9;
}

.button-group .btn{
    font-family:'Roboto', 'Noto Sans TC', Verdana, Arial, Helvetica, sans-serif;
    font-size:1.25rem;
    font-weight:500;
    background:var(--pink-700);
    border-radius:10rem;
    color:var(--white);
    letter-spacing: .2rem;
    padding:.375rem 3.5rem;
}

.button-group .btn:hover{
    background:var(--pink-700);
    color:var(--white);
    border:1px var(--pink-700);;
}

/* 選擇分校 */
#show_branch{    
    width:100%;
}

#show_branch table{
    font-weight:400;
    border:1px solid var(--gray-300);
    margin-top: 1rem;
}

#show_branch table thead tr{
    background:var(--orange-500);
    font-weight:500;
    vertical-align: middle;
    color:var(--white);
}

#show_branch table thead tr th:first-child{
    width:15%;
}

/* 隱私權說明 */
#Reservation2026 .ReservationWrap .modal p{
    font-size:1.2rem; 
    font-weight:400;
}

/* 課程內容 */
#CourseWrap2026{
    position:relative;
    background: var(--green-100);
    z-index:10;

    .title{
        width:65%;
        margin-top: 10.5rem;
        z-index:5;

        &:before, &:after{
            position:absolute;
            content:"";
            background:var(--pink-700);
            width:380px;
            height:1px;
            margin:auto;
            top:0;
            bottom: 0;
            z-index:3;
        }

        &:before{
            left:0;
        }

        &:after{
            right:0;
        }

        h3{
            background:var(--pink-700);
            color:var(--white);
            width:fit-content;
            border-radius:2rem;
            padding:.5rem 2rem;
        }
    }

    h3{
        &.titleClass{
            text-align:left;
            width:65%;
            z-index:5;
        }
    }

    .con-img{
        position:relative;
        display:flex;
        flex-wrap:wrap;
        justify-content: center;
        width:70%;
        overflow:hidden;
        margin:0 auto;
        padding-bottom: 6rem;
        z-index:9;

        img{
            & + img{
                margin-top: 4rem;
            }
        }
    }

    .bg-course{

        img{
            position:absolute;
            z-index:3;

            &:first-child{
                opacity: 60%;
                top:0;
                left:0;
            }

            &:nth-child(2){
                width:25%;
                top:-5rem;
                left:-5rem;
            }

            &:nth-child(3){
                width:32%;
                display:block;
                margin:auto;
                top:0;
                left:36rem;
            }

            &:nth-child(4){
                width:23%;
                top:-6rem;
                right:0;
            }

            &:nth-child(5){
                bottom: 0;
                left:0;
                z-index:1;
            }
        }
    }

}

/* 注意事項 */
#NoticeWrap2026{
    position:relative;
    background: var(--blue-100);
    padding:3rem 0 5rem 0;
    overflow:hidden;
    z-index:10;

    .title{
        position:relative;
        width:65%;
        margin-top: 3rem;
        margin-bottom: 3rem;
        z-index:5;

        &:before{
            left:0;            
        }

        &:after{
            right:0;
        }

        &:before, &:after{
            position:absolute;
            content:"";
            background:var(--pink-700);
            width:380px;
            height:1px;
            margin:auto;
            top:0;
            bottom:0;
            z-index:3;
        }

        h3{
            background:var(--pink-700);
            width:fit-content;
            border-radius:2rem;
            padding:.5rem 2rem;
        }
    }
    
    .bg-notice{
        display:block;
        z-index:10;

        img{
            position:absolute;

            &:first-child{
                opacity: 60%;
                top:0;
                left:0;
                z-index:1;
            }

            &:nth-child(2){
                width:9%;
                top:7rem;
                left:35rem;
                z-index:11;
            }

            &:nth-child(3){
                display:block;
                width:7%;
                text-align:center;
                margin:auto;
                top:-1rem;
                left:0;
                right:0;
                z-index:9;
            }

            &:nth-child(4){
                width:8.5%;
                top:5rem;
                right:34.5rem;
                z-index:9;
            }
        }
    } 
}

#NoticeWrap2026 .con-group{
    display:block;
    width:50%;
    z-index:9;
    margin:0 auto;
}

#NoticeWrap2026 .con-table{
   border:2px solid var(--pink-700);
   border-radius:0; 
   margin-bottom: 1rem;
}

#NoticeWrap2026 .con-table table{
    border-radius:0; 
    border:0;    
    margin-bottom: 0;
}

#NoticeWrap2026 .con-table table tr td{
    background:var(--whitle);
    font-size:var(--font-base);
    padding:.3rem 0;
}

#NoticeWrap2026 .con-table table thead{
    background:var(--pink-700);
    font-weight:600;
    color:var(--white);
}

#NoticeWrap2026 .con-table table tbody tr + td{
    border:0;
    border-top:1px solid var(--pink-700);
}

#NoticeWrap2026 .con-table table tbody tr:last-child td{
    border-bottom:0;
}

#NoticeWrap2026 .con-table table td + td{
    
    border-left:1px solid var(--pink-700);
}

#NoticeWrap2026 .con-table table tbody td{
    background:var(--white);
    color:var(--pink-700);
}

#NoticeWrap2026 .con-group ol li{
    font-size:var(--font-base);
    color:var(--pink-700);
    line-height:2rem;
}

/* 預約試讀 */
.iconReserve2025{
    position:relative;
    z-index:99;
}

.iconReserve2025 .icon-wrap{
    position:fixed;
    flex-direction:column;
    top:40%;
    right:1rem;
}

.iconReserve2025 .icon-wrap a{
    width:100%;
}

.iconReserve2025 .icon-wrap a img{
    position:relative;
    display:block;
    transform: rotate(0);
    width:10vw;
    margin:0 auto;
    z-index:20;
}


.iconReserve2025 .icon-wrap p{
    position:absolute;
    display:flex;
    justify-content: center;
    align-items:center;
    font-family:'Roboto', 'AwkwardBlack', Verdana, Arial, Helvetica, sans-serif;
    font-size:1.2rem;
    color:var(--black);
    line-height:1.6rem;
    top:.3rem;
    left:3.2rem;
    z-index:11;
}

.iconReserve2025 .icon-wrap a{
    display:block;
    color:var(--white);
    text-decoration: none;
    transition-timing-function: ease-in-out;
    margin:0 auto;
}

.iconReserve2025 .icon-wrap a:hover img{
    transform: rotate(-10deg);
    margin:0 auto;
}

.iconReserve2025 .icon-wrap a:hover p{
    color:var(--red-700);
    text-shadow: 3px 3px 3px var(--gray-300);
}

/* 中獎公告 */
#WinnerWrap2026{
    position:relative;
    background: var(--blue-200);
    padding:3rem 0 3rem 0;
    z-index:9;
}

#WinnerWrap2026 .title{
    position:relative;

    img{
        display:block;
        width:11%;
        margin:0 auto;
    }

    h3{
        background:var(--pink-700);
        color:var(--white);
        width:fit-content;
        border-radius:2rem;
        padding:.5rem 2rem;
    }
    
}

#WinnerWrap2026 .title p{
    position:relative;
    background:var(--blue-200);
    color:var(--white);
    font-size:var(--font-3xl);
    text-align:center;
    width:fit-content;
}

#WinnerWrap2026 .subtitle p{
    color:var(--black);
    font-size:1.8rem;
    font-weight:900; 
    width:100%;
    text-align:center;
    margin-top:5rem;
}

#WinnerWrap2026 .con-img img:last-child{
    margin-top: -4.5%;
}

#WinnerWrap2026 .con-group{
    display:block;
    width:85%;
    z-index:9;
    margin:0 auto;    
}

#WinnerWrap2026 .bg-winning{
    top:0;
    left:0;
    z-index:-1;
}

#WinnerWrap2026 .con-table{
   border:2px solid var(--);
   margin-bottom: 1rem;
}

#WinnerWrap2026 .con-table table{
    background:var(--white);
    font-size:1.1rem;
    border:0;    
    margin-bottom: 0;
}

#WinnerWrap2026 .con-table table tr td{
    font-family: Arial, "Noto Sans TC", sans-serif;
    font-weight:400;
    padding:.5rem 0;
}

#WinnerWrap2026 .con-table table thead{
    background:var(--pink-700);
    color:var(--white);
}

#WinnerWrap2026 .con-table table thead td{
    font-weight:700;
}

#WinnerWrap2026 .con-table table tbody td.bg{
    background:var(--pink-300);
}


#WinnerWrap2026 .con-table table tbody tr + tr{
    border:0;
    border-top:1px solid var(--pink-300);
}

#WinnerWrap2026 .con-table table tbody tr:last-child td{
    border-bottom:0;
}

#WinnerWrap2026 .con-table table td + td{
    border-left:1px solid var(--pink-300);
}

#WinnerWrap2026 .con-table table tbody td{
    border:1px solid var(--pink-300);
    color:var(--black);
}

#WinnerWrap2026 .hide-row, #WinnerWrap2026 .hide-row2, #WinnerWrap2026 .hide-row3, #WinnerWrap2026 .hide-row4,
#WinnerWrap2026 .hide-row5, #WinnerWrap2026 .hide-row6, #WinnerWrap2026 .hide-row7, #WinnerWrap2026 .hide-row8, #WinnerWrap2026 .hide-row9, #WinnerWrap2026 .hide-row10,
#WinnerWrap2026 .hide-row11, #WinnerWrap2026 .hide-row12, #WinnerWrap2026 .hide-row13, #WinnerWrap2026 .hide-row14, #WinnerWrap2026 .hide-row15, #WinnerWrap2026 .hide-row16, #WinnerWrap2026 .hide-row17, #WinnerWrap2026 .hide-row18, #WinnerWrap2026 .hide-row19,#WinnerWrap2026 .hide-row20, #WinnerWrap2026 .hide-row21, #WinnerWrap2026 .hide-row22,
#WinnerWrap2026 .hide-row23, #WinnerWrap2026 .hide-row24, #WinnerWrap2026 .hide-row25,
#WinnerWrap2026 .hide-row26, #WinnerWrap2026 .hide-row27, #WinnerWrap2026 .hide-row28, #WinnerWrap2026 .hide-row29, #WinnerWrap2026 .hide-row30, #WinnerWrap2026 .hide-row31,
#WinnerWrap2026 .hide-row32, #WinnerWrap2026 .hide-row33, #WinnerWrap2026 .hide-row34, #WinnerWrap2026 .hide-row35{
    display:none;
}

#WinnerWrap2026 .show-more-row{
    text-align:center;
}

#WinnerWrap2026 .show-more-row button{
    position:relative;
    background:var(--pink-300);
    font-weight:700;
    color:var(--white);
    border:3px solid var(--pink-300);
    padding:.5rem 1rem;
}

#WinnerWrap2026 .show-more-row button:before{
    position:absolute;
    content:"+";
    font-size:2rem;
    font-weight:900;
    color:var(--pink-500);
    top:-15%;
    left:54%;
    z-index:1;
}

#WinnerWrap2026 .show-more-row button:after{
    position:absolute;
    content:"";
    background:var(--white);
    display:block;
    width:2rem;
    height:2rem;
    border-radius:50%;
    margin:0 auto;
    top:10%;
    left:53.7%;
    z-index:0;
}

/* modal */
.modal-backdrop{
    /* opacity: .3 !important;
    z-index:5 !important; */
}

.modal-backdrop.show{
    opacity: .5 !important;
    z-index:10 !important;
}

.modal{
    z-index:99999 !important;
}

.modal.show .modal-dialog{
    transform: none;
}

/* footer */
footer{
    position:relative;
    background:var(--pink-700);
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    padding:1.2rem 0 1rem 0;
    z-index:30;
}

footer .FooterWrap{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    text-align:center;
    width:80%;
    z-index:30;
}

footer .FooterWrap p{
    font-size:var(--font-md);
    font-weight:500;
    color:var(--white);
    width:fit-content;
    text-align:center;
    margin-bottom: 0;
}

@media screen and (min-width:1920px){
    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{
            .titleAction{
                h2{
                    font-size:var(--font-35xl);
                }

                .bg-title{
                    left:-5rem;

                    img{
                        width:45%;
                    }
                }
            }
        }
    }

    /* 課程內容 */
    #CourseWrap2026{
        .title{
            margin-top: 14rem;

            &:before, &:after{
                width:480px;
            }
        }

        .bg-course{
            img{
                &:nth-child(3){
                    left:43rem;
                }
            }
        }
        
    }

    /* 預約試讀填寫 */
    #Reservation2026{
        .bg{
            img{
                &:last-child{
                    width:10%;
                    top:.3rem;
                    right:30%;
                }
            }
            
        }
    }

    /* 活動注意事項 */
    #NoticeWrap2026{

        .title{
            margin-top: 5rem;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    top:7.5rem;
                    left:43rem;
                }

                &:nth-child(3){
                    top:-.3rem;
                }

                &:nth-child(4){
                    right:44.5rem;
                }
            }
        }
    }
}

@media screen and (min-width:1800px) and (max-width:1919px){
    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{
            .titleAction{
                h2{
                    font-size:var(--font-3xl);
                }

                img{
                    width:45%;
                }

                .bg-title{
                    left:-5rem;

                    img{
                        width:45%;
                    }
                }
            }
        }
    }

    /* 課程內容 */
    #CourseWrap2026{
        .title{
            margin-top: 13rem;

            &:before, &:after{
                width:480px;
            }
        }

        .bg-course{
            img{
                &:nth-child(3){
                    left:41rem;
                }
            }
        }
        
    }

    /* 預約試讀填寫 */
    #Reservation2026{
        .bg{
            img{
                &:last-child{
                    width:10%;
                    top:.3rem;
                    right:30%;
                }
            }
            
        }
    }

    /* 活動注意事項 */
    #NoticeWrap2026{

        .title{
            margin-top: 5rem;

            &:before, &:after{
                width:400px;
            }
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    top:8.5rem;
                    left:41rem;
                }

                &:nth-child(3){
                    top:-.3rem;
                }

                &:nth-child(4){
                    right:41.5rem;
                }
            }
        }
    }
}

@media screen and (min-width:1600px) and (max-width:1799px){

}

@media screen and (min-width:1400px) and (max-width:1599px){
    /* Navbar2026 */
    #navbar2026 ul{
        width:70%;
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:80%;

            .titleAction{
                .title{
                    width:70%;

                    &:before, &:after{
                        width:280px;
                    }
                }

                .bg-title{
                    top:3rem;
                    left:-20rem
                }

                img{
                    width:73%;
                }
            }

            .con{
                .con-wrap{
                    .txt-con{
                        margin-left: 3rem;
                    }
                }
            }

            .action-group{
                width:90%;
            }
        }
    }

    /* 預約試讀填寫 */
    #Reservation2026{
        padding:5rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:70%;
            }
        } 

        .bg{
            img{
                &:last-child{
                    width:10%;
                    top:.3rem;
                    right:29%;
                }
            }
            
        }
    }

    /* 課程內容 */
    #CourseWrap2026{
        .title{
            width:70%;
            margin-top: 10.5rem;

            &:before, &:after{
                width:330px;
            }
        }

        .bg-course{
            img{
                &:nth-child(3){
                    left:31rem;
                }
            }
        }

        h3{
            &.titleClass{
                width:70%;
            }
        }
    }

    /* 活動注意事項 */
    #NoticeWrap2026{

        .title{
            margin-top: 5rem;

            &:before, &:after{
                width:300px;
            }
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    top:10rem;
                    left:30rem;
                }

                &:nth-child(3){
                    top:2em;
                }

                &:nth-child(4){
                    width:9%;
                    top:7.5rem;
                    right:29rem;
                }
            }
        }
    }

    /* 課程內容 */
    #CourseWrap2026 {
        .title{
            h2{  
                font-size:var(--font-xl);   
            }
        }

        .con-img{
            width:75%;
        }        
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:60%;
        }

        .bg{
            img{
                &:nth-child(2){
                    right:0;
                }
            }
        }
    }
}

@media screen and (min-width:1200px) and (max-width:1399px){
    /* navbar */
    #navbar2026 ul{
        width:80%;
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:80%;

            .titleAction{
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-2xl);
                }

                .title{
                    width:75%;

                    &:before, &:after{
                        width:250px;
                    }

                    .bg{
                        width:82%;
                    }
                }

                .bg-title{
                    top:3rem;
                    left:-21rem;

                    img{
                        width:32%;
                    }
                }
            }
                        

            .con{
                width:70%;

                .con-wrap{
                    .txt-time{
                        width:33%;

                        .title{
                            .bg{
                                width:80%;
                            }
                        }
                    }

                    .txt-con{
                        width:65%;
                        margin-left: 2rem;
                    }
                }                
            }
            
            .action-group{
                width:100%;
            }
        }
    }

    /* 預約試讀填寫 */
    #Reservation2026{
        padding:5rem 0 0 0;
        
        .ReservationWrap{
            .ReservationWrap-group{
                width:75%;
            }
        }

       .bg{
            img{
                &:last-child{
                    width:10%;
                    top:.3rem;
                    right:29%;
                }
            }
            
        }
    }

    /* 課程內容 */
    #CourseWrap2026{

        .title{          
            width:70%;
            margin-top: 9rem;

            &:before, &:after{
                width:300px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        .bg-course{
            img{
                &:nth-child(3){
                    left:28rem;
                }
            }
        }

        h3{
            &.titleClass{
                width:70%;
            }
        }

        .con-img{
            width:75%;
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{

        .title{
            width:70%;
            
            &:before, &:after{
                width:280px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:70%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    top:9rem;
                    left:23rem;
                }

                &:nth-child(3){
                    top:1rem;
                }

                &:nth-child(4){
                    width:10.5%;
                    top:4.5rem;
                    right:23rem;
                }
            }
        }
    }    

    /* 預約試讀按鈕 */
    .iconReserve2025{
        .icon-wrap{
            a{
                img{
                    width:13vw;
                }
            }
        }
    }
}

@media screen and (min-width:1024px) and (max-width:1199px){
    /* navbar */
    #navbar2026 ul{
        width:85%;
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:85%;

            .titleAction{
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-xl);
                }

                .title{
                    width:90%;

                    &:before, &:after{
                        width:280px;
                    }

                    .bg{
                        width:82%;
                    }
                }                

                .bg-title{
                    top:-2rem;
                    left:-20rem;

                    img{
                        width:25%;
                    }
                }
            }

            .con{
                width:90%;

                .con-wrap{
                    .txt-time{
                        width:33%;

                        .title{
                            .bg{
                                width:65%;
                            }
                        }

                        .con{
                            margin-left: 4rem;
                        }
                    }

                    .txt-con{
                        width:55%;
                        margin-left: 2rem;

                        .title{
                            .bg{
                                width:50%;
                            }
                        }
                    }
                }                
            }
            
            .action-group{
                width:100%;

                .photo{
                    img{
                        &:first-child{
                            margin-top: 5rem;
                        }
                    }
                }
            }
        }
}

    /* 預約試讀填寫 */
    #Reservation2026{
        padding:5rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:75%;

                .title{
                    h2{
                        font-size:var(--font-xl);
                    }
                }
                
                .con{
                    width:100%;
                }
            }
        }

        .bg{
            img{
                &:nth-child(2){
                    width:15%;
                    left:20%;
                }

                &:last-child{
                    width:12%;
                    top:1.5rem;
                    right:26%;
                }
            }
            
        }
    }

    /* 課程內容 */
    #CourseWrap2026{
        .title{          
            width:80%;
            margin-top: 8rem;

            &:before, &:after{
                width:300px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        .con-img{
            width:80%;
        }

        .bg-course{
            img{
                &:nth-child(2){
                    width:28%;
                }

                &:nth-child(3){
                    width:35%;
                    left:22rem;
                }

                &:nth-child(4){
                    width:25%;
                }
            }
        }

        h3{
            &.titleClass{
                width:80%;
            }
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            width:80%;
            
            &:before, &:after{
                width:280px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:80%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    width:11%;
                    top:9rem;
                    left:19rem;
                }

                &:nth-child(3){
                    width:10%;
                    top:-.2rem;
                }

                &:nth-child(4){
                    width:11.5%;
                    top:4rem;
                    right:19rem;
                }
            }
        }
        
    }

    /* 中獎名單 */
    #WinnerWrap2026{
        .show-more-row{
            button{
                &:before{
                    left:55%;
                }

                &:after{
                    left:54.5%;
                }
            }
        }
    }

    footer{
        .FooterWrap{
            .bg img{

                &:first-child{
                    top:-5.5rem;
                    left:2rem;
                    z-index:1;
                }

                &:last-child(){
                    width:18%;
                    bottom:0;
                    right:0;
                    z-index:5;
                }
            }
        }
    }

    /* 預約試讀按鈕 */
    .iconReserve2025{
        .icon-wrap{
            a{
                img{
                    width:13vw;
                }
            }
        }
    }
}

@media screen and (min-width:992px) and (max-width:1023px){
    /* navbar */
    #navbar2026 ul{
        width:90%;
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:85%;

            .titleAction{
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-xl);
                }

                .title{
                    width:90%;

                    &:before, &:after{
                        width:280px;
                    }

                    .bg{
                        width:82%;
                    }
                }                

                .bg-title{
                    top:-2rem;
                    left:-20rem;

                    img{
                        width:25%;
                    }
                }
            }

            .con{
                width:90%;

                .con-wrap{
                    .txt-time{
                        width:33%;

                        .title{
                            .bg{
                                width:65%;
                            }
                        }

                        .con{
                            margin-left: 4rem;
                        }
                    }

                    .txt-con{
                        width:55%;
                        margin-left: 2rem;

                        .title{
                            .bg{
                                width:50%;
                            }
                        }
                    }
                }                
            }
            
            .action-group{
                width:100%;

                .photo{
                    img{
                        &:first-child{
                            margin-top: 5rem;
                        }
                    }
                }
            }
        }
}

    /* 預約試讀填寫 */
    #Reservation2026{
        padding:5rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:75%;

                .title{
                    h2{
                        font-size:var(--font-xl);
                    }
                }
                
                .con{
                    width:100%;
                }
            }
        }

        .bg{
            img{
                &:nth-child(2){
                    width:15%;
                    left:20%;
                }

                &:last-child{
                    width:12%;
                    top:1.5rem;
                    right:26%;
                }
            }
            
        }
    }

    /* 課程內容 */
    #CourseWrap2026{
        .title{          
            width:80%;
            margin-top: 8rem;

            &:before, &:after{
                width:300px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        .con-img{
            width:75%;
        }

        .bg-course{
            img{
                &:nth-child(2){
                    width:28%;
                }

                &:nth-child(3){
                    width:35%;
                    left:21rem;
                }

                &:nth-child(4){
                    width:25%;
                }
            }
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            width:80%;
            
            &:before, &:after{
                width:250px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:80%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    width:11%;
                    top:9rem;
                    left:19rem;
                }

                &:nth-child(3){
                    width:10%;
                    top:-.2rem;
                }

                &:nth-child(4){
                    width:12%;
                    top:4rem;
                    right:17rem;
                }
            }
        }
        
    }

    /* 中獎名單 */
    #WinnerWrap2026{
        .show-more-row{
            button{
                &:before{
                    left:55%;
                }

                &:after{
                    left:54.5%;
                }
            }
        }
    }

    footer{
        .FooterWrap{
            .bg img{

                &:first-child{
                    top:-5.5rem;
                    left:2rem;
                    z-index:1;
                }

                &:last-child(){
                    width:18%;
                    bottom:0;
                    right:0;
                    z-index:5;
                }
            }
        }
    }

    /* 預約試讀按鈕 */
    .iconReserve2025{
        .icon-wrap{
            a{
                img{
                    width:13vw;
                }
            }
        }
    }
}

@media screen and (min-width:768px) and (max-width:991px){
    /* navbar */
    #navbar2026 ul{
        width:90%;

        li{
            width:30%;

            a{
                line-height:2.8rem;
            }
        }
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:90%;

            .titleAction{
                
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-xl);
                }

                .title{
                    width:100%;

                    &:before, &:after{
                        width:240px;
                    }

                    .bg{
                        width:82%;
                    }
                }                

                .bg-title{
                    top:-3rem;
                    left:-20rem;

                    img{
                        width:15%;
                    }
                }
            }

            .con{
                width:90%;

                .con-wrap{
                    flex-wrap:wrap;

                    .txt-time{
                        width:100%;
                        margin-bottom: 2rem;

                        .title{
                            text-align:left;

                            h3{
                                margin-left:0;
                            }

                            .bg{
                                width:25%;
                                left:0;
                                right:auto;
                                margin:auto;
                            }
                        }

                        .con{
                            margin-left: 1rem;
                        }
                    }

                    .txt-con{
                        width:100%;
                        margin-left: 0;

                        .title{
                            .bg{
                                width:35%;
                            }
                        }
                    }
                }                
            }
            
            .action-group{
                width:100%;

                .photo{
                    width:85%;
                    margin:auto;

                    &:first-child, &:last-child{
                        margin-top:0;
                    }
                }
            }
        }
    }

    /* 預約試讀填寫 */
    #Reservation2026{
        padding:5rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:85%;

                .title{
                    h2{
                        font-size:var(--font-xl);
                    }
                }
                
                .con{
                    width:100%;
                    padding:0 2rem 0 2rem;
                }
            }
        }

        .bg{
            img{
                &:nth-child(2){
                    width:16%;
                    top:1rem;
                    left:18%;
                }

                &:last-child{
                    width:14%;
                    top:2.5rem;
                    right:22%;
                }
            }
            
        }
    }

    /* 課程內容 */
    #CourseWrap2026{

        img.bg-course01{
            margin-top: -1rem;
        }

        .title{          
            width:90%;
            margin-top: 8rem;

            &:before, &:after{
                width:240px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        .con-img{
            width:85%;
        }

        .bg-course{
            img{
                &:nth-child(2){
                    width:34%;
                    top:-4rem;
                }

                &:nth-child(3){
                    width:39%;
                    left:16rem;
                }

                &:nth-child(4){
                    width:29%;
                    top:-4rem;
                }
            }
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            width:90%;
            
            &:before, &:after{
                width:220px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:90%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    width:11%;
                    top:10rem;
                    left:13rem;
                }

                &:nth-child(3){
                    width:11%;
                    top:.8rem;
                }

                &:nth-child(4){
                    width:14%;
                    top:4rem;
                    right:12rem;
                }
            }
        }
        
    }

    /* 中獎名單 */
    #WinnerWrap2026{
        .show-more-row{
            button{
                &:before{
                    left:55%;
                }

                &:after{
                    left:54.5%;
                }
            }
        }
    }

    footer{
        .FooterWrap{
            .bg img{

                &:first-child{
                    top:-5.5rem;
                    left:2rem;
                    z-index:1;
                }

                &:last-child(){
                    width:18%;
                    bottom:0;
                    right:0;
                    z-index:5;
                }
            }
        }
    }

    /* 預約試讀按鈕 */
    .iconReserve2025{
        .icon-wrap{
            a{
                img{
                    width:13vw;
                }
            }
        }
    }
}

@media screen and (min-width:648px) and (max-width:767px){   
    /* navbar */
    #navbar2026 ul{
        width:90%;

        li{
            width:30%;

            a{
                font-size:var(--font-base);
                line-height:2.6rem;
            }
        }
    }

    /* 活動辦法 */   
    #ActionWrap2026{
        .title-wrap{  
            width:90%;

            .titleAction{
                
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-lg);
                }

                .title{
                    width:100%;

                    &:before, &:after{
                        width:180px;
                    }

                    .bg{
                        width:82%;
                    }
                }                

                .bg-title{
                    top:-3rem;
                    left:-20rem;

                    img{
                        width:15%;
                    }
                }
            }

            .con{
                width:90%;

                .con-wrap{
                    flex-wrap:wrap;

                    .txt-time{
                        width:100%;
                        margin-bottom: 2rem;

                        .title{
                            text-align:left;

                            h3{
                                margin-left:0;
                            }

                            .bg{
                                width:33%;
                                left:0;
                                right:auto;
                                margin:auto;
                            }
                        }

                        .con{
                            margin-left: 1rem;
                        }
                    }

                    .txt-con{
                        width:100%;
                        margin-left: 0;

                        .title{
                            .bg{
                                width:42%;
                            }
                        }
                    }
                }                
            }
            
            .action-group{
                width:100%;

                .photo{
                    width:100%;
                    margin:auto;

                    &:first-child, &:last-child{
                        margin-top:0;
                    }
                }
            }
        }
    }

    /* 預約試讀填寫 */
    #Reservation2026{
        padding:5rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:90%;

                .title{
                    h2{
                        font-size:var(--font-xl);
                    }
                }
                
                .con{
                    width:100%;
                    padding:0 1rem;
                }
            }
        }

        .bg{
            img{
                &:nth-child(2){
                    width:18%;
                    top:2rem;
                    left:14%;
                }

                &:last-child{
                    width:17%;
                    top:3.5rem;
                    right:16%;
                }
            }
            
        }
    }

    /* 課程內容 */
    #CourseWrap2026{

        img.bg-course01{
            margin-top: -1rem;
        }

        .title{          
            width:90%;
            margin-top: 6rem;

            &:before, &:after{
                width:190px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        .con-img{
            width:90%;
        }

        .bg-course{
            img{
                &:nth-child(2){
                    width:34%;
                }

                &:nth-child(3){
                    width:39%;
                    left:14rem;
                }

                &:nth-child(4){
                    width:29%;
                    right:-2rem;
                }
            }
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            width:90%;
            margin-top: 2rem;
            
            &:before, &:after{
                width:160px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:90%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    width:12%;
                    top:9rem;
                    left:13rem;
                }

                &:nth-child(3){
                    width:11%;
                    top:.8rem;
                }

                &:nth-child(4){
                    width:14%;
                    top:3rem;
                    right:9rem;
                }
            }
        }
        
    }

    /* footer */
    footer{
        .FooterWrap{
            p{
                font-size:var(--font-base);
            }

           .bg img{

                &:first-child{
                    top:-4.5rem;
                    left:2rem;
                    z-index:1;
                }

                &:last-child(){
                    width:18%;
                    bottom:0;
                    right:0;
                    z-index:5;
                }
            }
        }
    }

    /* 預約試讀 */
    .iconReserve2025 .icon-wrap{
        right:1rem;
    }

    .iconReserve2025 .icon-wrap a img{
        width:16vw;
    }

    /* 中獎名單 */
     #WinnerWrap2026{
        .show-more-row{
            button{
                &:before{
                    left:58.2%;
                }

                &:after{
                    left:57.5%;
                }
            }
        }
    }
}

@media screen and (min-width:576px) and (max-width:647px){
    /* navbar */
    #navbar2026 ul{
        width:90%;

        li{
            width:30%;

            a{
                font-size:var(--font-base);
                line-height:2.6rem;
            }
        }
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:90%;

            .titleAction{
                
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-lg);
                }

                .title{
                    width:100%;

                    &:before, &:after{
                        width:150px;
                    }

                    .bg{
                        width:82%;
                    }
                }                

                .bg-title{
                    top:-3rem;
                    left:-20rem;

                    img{
                        width:15%;
                    }
                }
            }

            .con{
                width:90%;

                .con-wrap{
                    flex-wrap:wrap;

                    .txt-time{
                        width:100%;
                        margin-bottom: 2rem;

                        .title{
                            text-align:left;

                            h3{
                                margin-left:0;
                            }

                            .bg{
                                width:35%;
                                left:0;
                                right:auto;
                                margin:auto;
                            }
                        }

                        .con{
                            margin-left: 1rem;
                        }
                    }

                    .txt-con{
                        width:100%;
                        margin-left: 0;

                        .title{
                            .bg{
                                width:47%;
                            }
                        }
                    }
                }                
            }
            
            .action-group{
                width:100%;

                .photo{
                    width:85%;
                    margin:auto;

                    &:first-child, &:last-child{
                        margin-top:0;
                    }
                }
            }
        }
    }  

    /* 預約試讀填寫 */
    #Reservation2026{
        padding:5rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:90%;

                .title{
                    h2{
                        font-size:var(--font-xl);
                    }
                }
                
                .con{
                    width:100%;
                    padding:0 1rem;
                }
            }
        }

        .bg{
            img{
                &:nth-child(2){
                    width:18%;
                    top:2rem;
                    left:14%;
                }

                &:last-child{
                    width:17%;
                    top:3.5rem;
                    right:16%;
                }
            }
            
        }
    }

    .button-group .btn{
        font-size:var(--font-base);
    }

    /* 課程內容 */
    #CourseWrap2026{

        img.bg-course01{
            margin-top: -1rem;
        }

        .title{          
            width:90%;
            margin-top: 5rem;

            &:before, &:after{
                width:160px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        h3{
            &.titleClass{
                width:85%;
            }
        }

        .con-img{
            width:90%;

            img{ 
                & + img{
                    margin-top: 2rem;
                }
            }
        }

        .bg-course{
            img{
                &:nth-child(2){
                    width:34%;
                }

                &:nth-child(3){
                    width:39%;
                    left:12rem;
                }

                &:nth-child(4){
                    width:29%;
                }
            }
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            width:90%;
            margin-top: 2rem;
            
            &:before, &:after{
                width:130px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:90%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    width:13%;
                    top:9rem;
                    left:13rem;
                }

                &:nth-child(3){
                    width:12%;
                    top:.8rem;
                }

                &:nth-child(4){
                    width:15%;
                    top:3rem;
                    right:7rem;
                }
            }
        }
        
    }
    
    /* footer */
    footer{
        .FooterWrap{
            p{
                font-size:var(--font-sm);
            }

            .bg img{

                &:first-child{ 
                    width:24%;
                    top:-4.5rem;
                    left:2rem;
                    z-index:1;
                }

                &:last-child(){
                    width:18%;
                    bottom:0;
                    right:0;
                    z-index:5;
                }
            }
        }
    }

    /* 預約試讀 */
    .iconReserve2025 .icon-wrap{
        right:1rem;
    }

    .iconReserve2025 .icon-wrap a img{
        width:18vw;
    }
    
    /* 中獎名單 */
    #WinnerWrap2026{
        .show-more-row{
            button{
                &:before{
                    left:58.2%;
                }

                &:after{
                    left:57.5%;
                }
            }
        }
    }
}

@media screen and (min-width:425px) and (max-width:575px){
    /* navbar */
    #navbar2026 ul{
        width:100%;

        li{
            width:32%;

            a{
                font-size:var(--font-base);
                line-height:2.3rem;
            }
        }
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:90%;

            .titleAction{
                
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-lg);
                }

                .title{
                    width:100%;

                    &:before, &:after{
                        width:90px;
                    }

                    .bg{
                        width:82%;
                    }
                }                

                .bg-title{
                    top:-3rem;
                    left:-20rem;

                    img{
                        width:10%;
                    }
                }
            }

            .con{
                width:90%;

                .con-wrap{
                    flex-wrap:wrap;

                    .txt-time{
                        width:100%;
                        margin-bottom: 2rem;

                        .title{
                            text-align:left;

                            h3{
                                margin-left:0;
                            }

                            .bg{
                                width:45%;
                                left:0;
                                right:auto;
                                margin:auto;
                            }
                        }

                        .con{
                            margin-left: 1rem;
                        }
                    }

                    .txt-con{
                        width:100%;
                        margin-left: 0;

                        .title{
                            .bg{
                                width:59%;
                            }
                        }
                    }
                }                
            }
            
            .action-group{
                width:100%;

                .photo{
                    width:85%;
                    margin:auto;

                    &:first-child, &:last-child{
                        margin-top:0;
                    }
                }
            }
        }
    }   

    /* 預約試讀填寫 */
    #Reservation2026{
        margin-top:-.5rem;
        padding:4rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:90%;

                .title{
                    h2{
                        font-size:var(--font-xl);
                    }
                }
                
                .con{
                    width:100%;
                    padding:0 1rem;
                }
            }

            .Reservation-bg{
                border-radius:3rem;

                .bgWhite{
                    border-radius:2.5rem;
                }
            }
        }

        .bg{
            img{
                &:nth-child(2){
                    width:21%;
                    top:2rem;
                    left:14%;
                }

                &:last-child{
                    width:20%;
                    top:.5rem;
                    right:16%;
                }
            }
            
        }
    }
    
    #Reservation2026 .ReservationWrap .form-control, #Reservation2026 .ReservationWrap .form-group, #Reservation2026 .ReservationWrap .form-group button{
        font-size:var(--font-base);
    }

    /* 課程內容 */
    #CourseWrap2026{

        img.bg-course01{
            margin-top: -1rem;
        }

        .title{          
            width:90%;
            margin-top: 4rem;

            &:before, &:after{
                width:90px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        h3{
            &.titleClass{
                width:85%;
            }
        }

        .con-img{
            width:90%;

            img{ 
                & + img{
                    margin-top: 2rem;
                }
            }
        }

        .bg-course{
            img{
                &:nth-child(2){
                    width:34%;
                    top:-3rem;
                    left:-2rem;
                }

                &:nth-child(3){
                    width:39%;
                    left:9rem; 
                }

                &:nth-child(4){
                    width:29%;
                    top:-2rem;
                }
            }
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            width:90%;
            margin-top: 1rem;
            
            &:before, &:after{
                width:70px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:90%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    width:16%;
                    top:8.5rem;
                    left:14rem;
                }

                &:nth-child(3){
                    width:14%;
                    top:.5rem;
                }

                &:nth-child(4){
                    width:16%;
                    top:3rem;
                    right:3rem;
                }
            }
        }
        
    }

    /* footer */
    footer{
        .FooterWrap{
            p{
                font-size:var(--font-xs);
            }

            .bg img{

                &:first-child{ 
                    width:24%;
                    top:-3.3rem;
                    left:2rem;
                    z-index:1;
                }

                &:last-child(){
                    width:18%;
                    bottom:0;
                    right:0;
                    z-index:5;
                }
            }
        }
    }

    /* 預約試讀 */
    .iconReserve2025 .icon-wrap{
        right:.5rem;
    }

    .iconReserve2025 .icon-wrap a img{
        width:20vw;
    }

    /* 中獎名單 */
    #WinnerWrap2026{
        .show-more-row{
            button{
                &:before{
                    left:61.5%;
                }

                &:after{
                    left:60.5%;
                }
            }
        }
    }
}

@media screen and (min-width:375px) and (max-width:424px){
    /* navbar */
    #navbar2026 ul{
        width:100%;

        li{
            width:45%;

            a{
                font-size:var(--font-base);
                line-height:2.3rem;
            }
        }
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:90%;

            .titleAction{
                
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-lg);
                }

                .title{
                    width:100%;

                    &:before, &:after{
                        width:70px;
                    }

                    .bg{
                        width:82%;
                    }
                }                

                .bg-title{
                    top:-3rem;
                    left:-18rem;

                    img{
                        width:10%;
                    }
                }
            }

            .con{
                width:90%;

                .con-wrap{
                    flex-wrap:wrap;

                    .txt-time{
                        width:100%;
                        margin-bottom: 2rem;

                        .title{
                            text-align:left;

                            h3{
                                margin-left:0;
                            }

                            .bg{
                                width:52%;
                                left:0;
                                right:auto;
                                margin:auto;
                            }
                        }

                        .con{
                            margin-left: 1rem;
                        }
                    }

                    .txt-con{
                        width:100%;
                        margin-left: 0;

                        .title{
                            .bg{
                                width:69%;
                            }
                        }
                    }
                }                
            }
            
            .action-group{
                width:100%;

                .photo{
                    width:85%;
                    margin:auto;

                    &:first-child, &:last-child{
                        margin-top:0;
                    }
                }
            }
        }
    }

    /* 預約試讀填寫 */
    #Reservation2026{
        margin-top:-.5rem;
        padding:4rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:90%;

                .title{
                    h2{
                        font-size:var(--font-xl);
                    }
                }
                
                .con{
                    width:100%;
                    padding:0 1rem;
                }
            }

            .Reservation-bg{
                border-radius:3rem;

                .bgWhite{
                    border-radius:2.5rem;
                }
            }
        }

        .bg{
            img{
                &:nth-child(2){
                    width:21%;
                    top:2rem;
                    left:14%;
                }

                &:last-child{
                    width:20%;
                    top:.5rem;
                    right:16%;
                }
            }
            
        }
    }

    #Reservation2026 .ReservationWrap .form-control, #Reservation2026 .ReservationWrap .form-group, #Reservation2026 .ReservationWrap .form-group button{
        font-size:var(--font-base);
    }

    /* 課程內容 */
    #CourseWrap2026{

        img.bg-course01{
            margin-top: -1rem;
        }

        .title{          
            width:90%;
            margin-top: 3rem;

            &:before, &:after{
                width:75px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        h3{
            &.titleClass{
                width:85%;
            }
        }

        .con-img{
            width:90%;

            img{ 
                & + img{
                    margin-top: 2rem;
                }
            }
        }

        .bg-course{
            img{
                &:nth-child(2){
                    width:34%;
                    top:-3rem;
                    left:-2rem;
                }

                &:nth-child(3){
                    width:39%;
                    left:8rem;
                }

                &:nth-child(4){
                    width:29%;
                    top:-2rem;
                }
            }
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            width:90%;
            margin-top: 1rem;
            
            &:before, &:after{
                width:60px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:90%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    width:18%;
                    top:8.5rem;
                    left:13rem;
                }

                &:nth-child(3){
                    width:16%;
                    top:.5rem;
                }

                &:nth-child(4){
                    width:18%;
                    top:3rem;
                    right:1rem;
                }
            }
        }
        
    }

    /* footer */
    footer{
        .FooterWrap{
            p{
                font-size:var(--font-xs);
            }

            .bg img{

                &:first-child{ 
                    width:24%;
                    top:-3rem;
                    left:2rem;
                    z-index:1;
                }

                &:last-child(){
                    width:18%;
                    bottom:0;
                    right:0;
                    z-index:5;
                }
            }
        }
    }

    /* 預約試讀 */
    .iconReserve2025 .icon-wrap{
        right:.5rem;
    }

    .iconReserve2025 .icon-wrap a img{
        width:20vw;
    }

    /* 中獎名單 */
    #WinnerWrap2026{
        .show-more-row{
            button{
                &:before{
                    left:62.5%;
                }

                &:after{
                    left:61.5%;
                }
            }
        }
    }
}

@media screen and (min-width:200px) and (max-width:374px){
    /* navbar */
    #navbar2026 ul{
        width:100%;

        li{
            width:45%;

            a{
                font-size:var(--font-base);
                line-height:2.3rem;
            }
        }
    }

    /* 活動辦法 */
    #ActionWrap2026{
        .title-wrap{  
            width:90%;

            .titleAction{
                
                img{
                    width:70%;
                }

                h2{
                    font-size:var(--font-lg);
                }

                .title{
                    width:100%;

                    &:before, &:after{
                        width:70px;
                    }

                    .bg{
                        width:82%;
                    }
                }                

                .bg-title{
                    top:-3rem;
                    left:-18rem;

                    img{
                        width:10%;
                    }
                }
            }

            .con{
                width:90%;

                .con-wrap{
                    flex-wrap:wrap;

                    .txt-time{
                        width:100%;
                        margin-bottom: 2rem;

                        .title{
                            text-align:left;

                            h3{
                                margin-left:0;
                            }

                            .bg{
                                width:52%;
                                left:0;
                                right:auto;
                                margin:auto;
                            }
                        }

                        .con{
                            margin-left: 1rem;
                        }
                    }

                    .txt-con{
                        width:100%;
                        margin-left: 0;

                        .title{
                            .bg{
                                width:69%;
                            }
                        }
                    }
                }                
            }
            
            .action-group{
                width:100%;

                .photo{
                    width:85%;
                    margin:auto;

                    &:first-child, &:last-child{
                        margin-top:0;
                    }
                }
            }
        }
    }

    /* 預約試讀填寫 */
    #Reservation2026{
        margin-top:-.5rem;
        padding:4rem 0 0 0;

        .ReservationWrap{
            .ReservationWrap-group{
                width:90%;

                .title{
                    h2{
                        font-size:var(--font-xl);
                    }
                }
                
                .con{
                    width:100%;
                    padding:0 1rem;
                }
            }

            .Reservation-bg{
                border-radius:3rem;

                .bgWhite{
                    border-radius:2.5rem;
                }
            }
        }

        .bg{
            img{
                &:nth-child(2){
                    width:21%;
                    top:2rem;
                    left:14%;
                }

                &:last-child{
                    width:20%;
                    top:.5rem;
                    right:16%;
                }
            }
            
        }
    }


    #Reservation2026 .ReservationWrap .form-control, #Reservation2026 .ReservationWrap .form-group, #Reservation2026 .ReservationWrap .form-group button{
        font-size:var(--font-base);
    }

    /* 課程內容 */
    #CourseWrap2026{

        img.bg-course01{
            margin-top: -1rem;
        }

        .title{          
            width:90%;
            margin-top: 3rem;

            &:before, &:after{
                width:75px;
            }

            h2{  
                font-size:var(--font-xl);   
            }
        }

        h3{
            &.titleClass{
                width:85%;
            }
        }

        .con-img{
            width:90%;

            img{ 
                & + img{
                    margin-top: 2rem;
                }
            }
        }

        .bg-course{
            img{
                &:nth-child(2){
                    width:34%;
                    top:-3rem;
                    left:-2rem;
                }

                &:nth-child(3){
                    width:39%;
                    left:6rem;
                }

                &:nth-child(4){
                    width:29%;
                    top:-2rem;
                }
            }
        }
    }

    /* 注意事項 */
    #NoticeWrap2026{
        .title{
            width:90%;
            margin-top: 1rem;
            
            &:before, &:after{
                width:60px;
            }

            h2{
                font-size:var(--font-xl);
            }
        }

        .con-group{
            width:90%;
        }

        .bg-notice{
            img{
                &:nth-child(2){
                    width:18%;
                    top:8.5rem;
                    left:13rem;
                }

                &:nth-child(3){
                    width:16%;
                    top:.5rem;
                }

                &:nth-child(4){
                    width:18%;
                    top:3rem;
                    right:1rem;
                }
            }
        }
        
    }

    /* footer */
    footer{

        .FooterWrap{
            padding:0 1rem;

            p{
                font-size:var(--font-xs);
            }

            .bg img{

                &:first-child{ 
                    width:24%;
                    top:-2.5rem;
                    left:2rem;
                    z-index:1;
                }

                &:last-child(){
                    width:18%;
                    bottom:0;
                    right:0;
                    z-index:5;
                }
            }
        }
    }

    /* 預約試讀 */
    .iconReserve2025 .icon-wrap{
        right:.3rem;
    }

    .iconReserve2025 .icon-wrap a img{
        width:20vw;
    }

    /* 中獎名單 */
    #WinnerWrap2026{
        .show-more-row{
            button{
                &:before{
                    left:64.5%;
                }

                &:after{
                    left:63.5%;
                }
            }
        }
    }

}