﻿@font-face {
    font-family: huaKangFang;
    src: url(../font/huaKangFang.TTF);
}

.subMenuWeb {
    width: 325px !important;
}


a {
    text-decoration: none;
}

/*-----------------公共設置 start-----------------*/
:root {
    --primary: #f20352;
    --secondary: #111c68;
    --dark: #2f2c2c;
    --light: #fff;
    --third: #ebf6ff;

    --backImage: url(../../../images/2023/backImg.jpg);

    
}
.fw-big-bolder{font-size: 30px;}
.fw-bolder{font-size: 25px;}
table thead tr th{ font-size: 23px;}
/*-----------------公共設置 end-----------------*/

body {
    overflow: hidden !important;
    color: black;
    position: relative;
    background-size: 100%;
    background-repeat: repeat;
    background-position: center center;
    background-image: var(--backImage);
    background-attachment: fixed;
	padding-right:0 !important ; /*這句話很重要解決了彈窗多出padding-right的17px*/
}

/*-----------------公共按鈕設置 start-----------------*/
.buttonStyle {
    background-color: var(--secondary);
    color: var(--light) !important;
    width: 200px;
    height: 50px;
    font-size: 20px;
    line-height: 35px;
    text-align: center;
}

.buttonStyle:hover {
    background-color: var(--secondary);
    color: var(--primary) !important;
    width: 200px;
    height: 50px;
    font-size: 20px;
    line-height: 35px;
    text-align: center;
}

.buttonStyle:active {
    background-color: var(--secondary) !important;
    color: var(--primary) !important;
    width: 200px;
    height: 50px;
    font-size: 20px;
    line-height: 35px;
    text-align: center;
}

/*-----------------公共按鈕設置 end-----------------*/

/*-----------------公共使用樣式 start-----------------*/
.card-title {
    margin-bottom: 0.5rem;
}

table thead tr {
    border-bottom: 3px var(--secondary) solid;
}

/*-----------------公共使用樣式 end-----------------*/

/*-----------------header樣式設定 start-----------------*/
.top-address p a,.top-address p a i{
    font-size: 18px;
 }
 .top-address p{line-height: 50px;}

 .top-right-menu ul li{float: right;}

 .headImg1{ width: 50px;height: 50px;}

 /*header裡面更多的設定 start*/
.dropbtn {
    background-color: #f20352;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 250px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 2;
    left: 0;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    float: left;
    font-size: 18px;
    width: 100%;
    text-align: left;
}

.dropdown-content a i {
    font-size: 20px;
    color: #f20352;
    margin-right: 8px;
}

.dropdown-content a:hover {
    background-color: #d1d0d0;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #b1053e;
}

/*header裡面更多的設定 end*/
 /*-----------------header樣式設定 end-----------------*/

/*-----------------網頁端控制導航條的nav的設定 start-----------------*/
.talim_menu ul {
    text-align: right;
    list-style: none;
}

.talim_menu>ul>li {
    display: inline-block;
    position: relative;
}

.talim_menu>ul>li>a {
    color: #111c68;
    display: block;
    margin: 23px 9px;
    -webkit-transition: .2s;
    transition: .2s;
    position: relative;
    font-size: 20px;
    font-weight: 600;
    text-transform: capitalize;
    font-family: 'Poppins', sans-serif;
    text-decoration: none;
}

.talim_menu ul .sub-menu li a:hover, .talim_menu ul .sub-menu li.current-menu-item a, .talim_menu>ul>li.current-menu-item>a, .talim_menu>ul>li>a:hover, .talim_nav_area.prefix .talim_menu>ul>li.current-menu-item>a, .talim_nav_area.prefix .talim_menu>ul>li>a:hover, .hbg2 .talim_menu>ul>li.current-menu-item>a, .hbg2 .talim_menu>ul>li>a:hover, .heading_style_2 .talim_menu>ul>li.current-menu-item>a, .heading_style_2 .talim_menu>ul>li>a:hover, .heading_style_3 .talim_menu>ul>li.current-menu-item>a, .heading_style_3 .talim_menu>ul>li>a:hover, .heading_style_4 .talim_menu>ul>li.current-menu-item>a, .heading_style_4 .talim_menu>ul>li>a:hover {
    color: var(--primary);
}

.talim_menu>ul>li>a:before, .talim_menu>ul>li.current>a:before {
    background: #ffb600 none repeat scroll 0% 0;
    bottom: -7px;
    content: "";
    height: 2px;
    left: 0;
    margin: auto;
    opacity: 0;
    position: absolute;
    right: 0;
    transition: all 0.5s ease 0s;
    width: 15%;
    display: none;
}

.talim_menu ul li:last-child a {
    margin-right: 15px !important;
}

.talim_menu>ul>li.current>a, .talim_menu>ul>li:hover>a, .creative_header_menu>ul>li:hover>a {
    color: var(--primary);
    background-color: transparent;
}

.talim_menu>ul>li:hover>a:before, .talim_menu>ul>li.current>a:before {
    opacity: 1;
}

/*控制下拉導航條字體樣式*/
.constar_nav_area.prefix .talim_menu>ul>li>a {
    /* font-weight:500; */
    color: white;
}

.talim_nav_area.prefix .talim_menu>ul>li.current>a {
    color: var(--primary);
}

.talim_menu ul .sub-menu {
    position: absolute;
    left: 0;
    top: 130%;
    width: 240px;
    text-align: left;
    background: var(--primary);
    margin: 0;
    padding: 15px 8px 8px 25px;
    z-index: 9999;
    box-shadow: 0 0 30px rgb(0 0 0 / 9%);
    transition: .2s;
    opacity: 0;
    visibility: hidden;
}

.talim_menu ul li:hover>.sub-menu {
    transition: .5s;
    opacity: 1;
    visibility: visible;
    top: 100%;
    z-index: 9999;
}

.talim_menu ul .sub-menu li {
    position: relative;
    transition: .5s;
}

.talim_menu ul .sub-menu li a {
    display: block;
    margin: 0;
    margin-bottom: 6px;
    letter-spacing: normal;
    font-size: 19px;
    font-weight: 500;
    transition: .5s;
    color: #fff;
    visibility: inherit !important;
    padding: 4px 0px;
    font-family: 'Noto sans', sans-serif;
}

.talim_menu ul .sub-menu li:hover>a, .talim_menu ul .sub-menu .sub-menu li:hover>a, .talim_menu ul .sub-menu .sub-menu .sub-menu li:hover>a, .talim_menu ul .sub-menu .sub-menu .sub-menu .sub-menu li:hover>a {
    color: var(--primary);
}

/*我新增的移動上去的時候變色*/
.talim_menu ul .sub-menu li:hover>a {
    background-color: var(--primary);
    color: var(--light);
    /* color: var(--secondary); */
    cursor: pointer !important;
}

.talim_menu ul .sub-menu li:before {
    left: -18px;
}

.talim_menu ul .sub-menu li:hover:before {
    opacity: 1;

}

.talim_menu ul .sub-menu .sub-menu .sub-menu .sub-menu li:hover>a, .talim_menu ul .sub-menu .sub-menu .sub-menu li:hover>a, .talim_menu ul .sub-menu .sub-menu li:hover>a, .talim_menu ul .sub-menu li:hover:before, .talim_menu ul .sub-menu li:hover>a {
    /* color: #fff; */
    padding-left: 14px;
    transition: .5s;
}

/* sub menu 2 */
.talim_menu ul .sub-menu .sub-menu {
    left: 100%;
    top: 130%;
    opacity: 0;
    visibility: hidden;
}

.talim_menu ul .sub-menu li:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    top: 0%;
}

/* sub menu 3 */
.talim_menu ul .sub-menu .sub-menu li {
    position: relative;
}

.talim_menu ul .sub-menu .sub-menu .sub-menu {
    right: 100%;
    left: auto;
    top: 130%;
    opacity: 0;
    visibility: hidden;
}

.talim_menu ul .sub-menu .sub-menu li:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    top: 0%;
}

/* sub menu 4 */
.talim_menu ul .sub-menu .sub-menu .sub-menu li {
    position: relative;
}

.talim_menu ul .sub-menu .sub-menu .sub-menu li:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    top: 0%;
}


.talim_menu.main-search-menu>.em-header-quearys, .em-quearys-top.msin-menu-search {
    display: inline-block;
}

.em-top-quearys-area {
    position: relative;
}

.talim_menu div.em-header-quearys {
    text-align: center;
}

.talim_menu ul .sub-menu li>a::before {
    width: 15px;
    margin-left: -14px;
    width: 0px;
    margin-left: 0;
    position: relative;
    transform: translateY(-6px);
    height: 1px;
    display: inline-block;
    background: #fff;
    content: "";
    margin-right: 4px;
}

.talim_menu ul .sub-menu li:hover>a::before {
    width: 15px;
    margin-left: -14px;
}



/*-----------------網頁端控制導航條的nav的設定 end-----------------*/

/*-----------------手機端導航欄nav設定 start-----------------*/
/*新增控制手機端nav字體大小*/
.mobile-menu nav ul li a {
    font-size: 16px !important;
}


/*控制手機的navlogo大小*/
.mobile_menu_logo a img {
    width: 60%;
    height: auto;
}

/*-----------------手機端導航欄nav設定-----------------end*/




/*-----------------輪播圖slider設定-----------------start*/

.witr_ds_content_inner h2 {
    /* font-family: huaKangFang; */
    color: rgb(223, 221, 221);
    /* text-shadow:-1px 0 white,0 1px white,1px 0 white,0 -1px white; */
}

 /*加上背景色透明顯得更高級*/
.witr_ds_content::before {
    background-color: rgba(0, 0, 0, 0.2);
}
/* .carousel-inner div img::before {
    background-color: rgba(0, 0, 0, 0.808) !important;
} */

/*播視頻的控件要去掉*/
.noControl::-webkit-media-controls{ display:none !important;}


/*-----------------輪播圖slider設定-----------------end*/

/*-----------------brand品牌設定-----------------start*/
.brand-area {
    /* width: 70%; */
    height: auto;
    margin: 0 auto;
}

.gray-bg {
    /* background: #ebf6ff; */
    /* background-image: url("../image/contact-bg.jpg"); */
    background-position: center right;
    background-repeat: no-repeat;
    background-size: cover;
}

.pt-70 {
    padding-top: 70px;
}

.pb-70 {
    padding-bottom: 70px;
}

.brand-carousel.owl-carousel .owl-item img {
    width: auto;
    display: inline-block;
}

.brand-carousel.owl-carousel.owl-drag .owl-item {
    text-align: center;
}

.brand-item {
    display: table;
    width: 100%;
    position: relative;
    height: 50px;
}

.brand-item-inner {
    display: table-cell;
    vertical-align: middle;
}

.brand-item-inner a {
    margin: 0 2%;
    display: block;
}

.brand-item-inner a img {
    border-radius: 10px;
}

/*-----------------brand品牌設定-----------------end*/


/*-----------------otherInfor品牌設定-----------------start*/
.otherInfor-area {
    /* width: 70%; */
    height: auto;
    margin: 0 auto;

}

.pt-70 {
    padding-top: 70px;
}

.pb-70 {
    padding-bottom: 70px;
}

.otherInfor-carousel.owl-carousel .owl-item img {
    width: auto;
    display: inline-block;
}

.otherInfor-carousel.owl-carousel.owl-drag .owl-item {
    text-align: center;
}

.otherInfor-item {
    display: table;
    width: 100%;
    position: relative;
    height: 50px;
}

.otherInfor-item-inner {
    display: table-cell;
    vertical-align: middle;
}

.otherInfor-item-inner a {
    margin: 0 2%;
    display: block;
}

.otherInfor-item-inner a img {
    border-radius: 10px;
}

/*-----------------otherInfor品牌設定-----------------end*/

/*-----------------myclass作業設定-----------------start*/


.myclass-area {
    padding-top: 150px;
    padding-bottom: 150px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    background-image: url(../../../images/myclass/img/school.jpg?v=20250820);
    margin-bottom: 2%;
}


.myclass-blog-area:before {
    /* position: absolute; */
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    content: "";
    background-color: rgba(0, 0, 0, 0.2);

}

.myclass-inner h2 {
    font-size: 36px;
}

.myclass-inner ul, .myclass-inner ul span a, .myclass-inner li, .myclass-inner li a {
    color: #ffffff;
}

.myclass-inner li {
    display: inline-block;
    margin: 0;
    color: #fff;
}

.myclass-inner li:nth-last-child(-n+1) {
    color: #fff;
}

.myclass-inner li a {
    color: #fff;
}

.myclass-inner li a:hover {
    color: #f20352;
}

.brpt h2 {
    font-size: 40px;
    color: #fff;
    margin-bottom: 10px;
}

.lcase {
    text-transform: lowercase;
}

.ucase {
    text-transform: uppercase;
}

.ccase {
    text-transform: capitalize;
}



table.myclass {
    border-collapse: unset;

}

table.myclass th {
    text-align: center;
    color: rgb(43, 41, 41);
}

.myclass tr td a {
    color: blue;
}

table.myclass td:hover {
    background-color: #FFFF99;
}


.tab-content>.tab-pane {
    display: none;
}

.tab-content>.active {
    display: block;
}

/*-----------------myclass作業設定-----------------end*/


/*-----------------constru建設中頁面設定-----------------start*/
.constru {
    padding-top: 150px;
    padding-bottom: 150px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    background-image: url(../../../images/2023/construct.jpg);
}

.constru .container .row h1 {
    /* line-height: 300px; */
    font-size: 50px;
    color: white
}

/*-----------------constru建設中頁面設定-----------------end*/

/*-----------------notice頁面設定-----------------start*/
.card>.card-header+.list-group,
.card>.list-group+.card-footer {
    border-top: 0;
}

.card-header {
    padding: 0.5rem 1rem;
    margin-bottom: 0;
    background-color: #203664;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    color: #ffffff;
    font-size: 1.5rem;
}

.card-header:first-child {
    border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}

.card-header-tabs {
    margin-right: -0.5rem;
    margin-bottom: -0.5rem;
    margin-left: -0.5rem;
    border-bottom: 0;
}

.card-header-pills {
    margin-right: -0.5rem;
    margin-left: -0.5rem;
}

.notice .align-middle {
    text-align: right;
}



.reader_link {
    float: right;
    line-height: 25px;
    vertical-align: bottom;
    /* font-size: initial; */
    font-size: 25px;
    margin-top: 10px;
    margin-right: 10px;
}

.reader_link img {
    width: 40px;
    height: auto;
}

.notice {
    margin-top: 50px;
}

.list-unstyled {
    padding-left: 10%;
    list-style: none;
}

/*-----------------notice頁面設定-----------------end*/

/*-----------------intro-title-area標題設定-----------------start*/
.intro-title-area {
    padding-top: 150px;
    padding-bottom: 150px;
    background-position: center center;
    position: relative;
    background-image: url(../../../images/2023/intro/ssy2.jpg);
    /* margin-bottom: 2%; */
}

/*-----------------intro-title-area標題設定-----------------end*/

/*-----------------public-area公共標題設定-----------------start*/

.public-area {
    padding-top: 150px;
    padding-bottom: 190px;
    background-size: cover;
    background-repeat: no-repeat;
    /* background-position: center center; */
     background-position: 50% 85%;
    position: relative;
    background-image: url(../../../images/myclass/img/school.jpg?v=20250819);
}
.public-area .brpt h2 {
    font-size: 40px;
    color: #fff;
    margin-bottom: 10px;
    /* text-shadow: #fc0 1px 0 10px; */
     text-shadow: #fc0 1px 0 10px;
}
.public-inner h2 {
    font-size: 36px;
}

.public-inner ul, .public-inner ul span a, .public-inner li, .public-inner li a {
    color: #ffffff;
    font-weight: bold;
    text-shadow: #fc0 1px 0 10px;
}

.public-inner li {
    display: inline-block;
    margin: 0;
    color: #fff;
}

.public-inner li:nth-last-child(-n+1) {
    color: #fff;
}

.public-inner li a {
    color: #fff;
}

.public-inner li a:hover {
    color: #f20352;
}



.lcase {
    text-transform: lowercase;
}

.ucase {
    text-transform: uppercase;
}

.ccase {
    text-transform: capitalize;
}

.title-underline {
    width: 100%;
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: #cccccc;
    padding-bottom: 10px;
    font-size: 45px;
}

.title-underline a{
    font-size: 45px;}

/*-----------------public-area公共標題設定-----------------end*/

/*-----------------public公共左側導航欄標設定-----------------start*/
.sidemenu li {
    margin: 5% 0;
    font-size: 1.3rem;
    /* border: 1px yellow solid; */

}

.sidemenu li.active a {
    margin-left: -12px !important;

}

.sidemenu li.active a::before {
    /* content: url("../../../images/2023/sidemenu-logo.png") ; */
    content: "> ";
}


.sidemenu li a:hover,
.sidemenu li.active a {
    color: red;
}

/*-----------------public公共左側導航欄標設定-----------------end*/

/*-----------------middleMenu公共中間導航欄標設定-----------------start*/
.middleMenu button {
    font-size: 25px;
    border: 1px solid var(--secondary);
}

.middleMenu button a {
    color: var(--secondary);
    width: 100%;
    height: 100%;
    display: block;
}

.middleMenu button:hover {
    border: 1px solid var(--secondary);
}

.middleMenu button.active {
    background-color: var(--secondary);
    border: none;
}

.middleMenu button.active a {
    color: white;
}

.middleMenu button.active:active {
    background-color: var(--secondary);
}

.dropdown button {
    width: 100%;
    font-size: 20px;
}

.dropdown ul {
    width: 100%;
    font-size: 18px;
}

/*-----------------middleMenu公共中間導航欄標設定-----------------end*/
/*-----------------public公共中間主體設定-----------------start*/
.card-body {
    flex: 1 1 auto;
    padding: 1rem 1rem;
}

.card-body .row article section p a {
    color: var(--secondary);
}

.card-body .row article section p a:hover {
    color: var(--primary);
}

.public-middle {
   padding-top: 2%;
}

.packet-middle {
    padding-top: 2%;
 }
.robot-area {
    padding: 2% 0;
 }
/*-----------------public公共中間主體設定-----------------end*/

/*--------------- 學校歷史history timeline ------------------------*/
.timeline {
    --timelineMainColor: #4557bb;
}

.timeline {
    --uiTimelineMainColor: var(--timelineMainColor, #222);
    --uiTimelineSecondaryColor: var(--timelineSecondaryColor, #fff);

    position: relative;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.timeline:before {
    content: "";
    width: 4px;
    height: 100%;
    background-color: var(--uiTimelineMainColor);

    position: absolute;
    top: 0;
}

.timeline__group {
    position: relative;
}

.timeline__group:not(:first-of-type) {
    margin-top: 4rem;
}

.timeline__year {
    padding: .5rem 1.5rem;
    color: var(--uiTimelineSecondaryColor);
    background-color: var(--uiTimelineMainColor);

    position: absolute;
    left: 0;
    top: 0;
}

.timeline__box {
    position: relative;
}

.timeline__box:not(:last-of-type) {
    margin-bottom: 10px;
}

.timeline__box:before {
    content: "";
    width: 100%;
    height: 2px;
    background-color: var(--uiTimelineMainColor);

    position: absolute;
    left: 0;
    z-index: -1;
}

.timeline__post {
    padding: 1.5rem 2rem;
    border-radius: 2px;
    border-left: 3px solid var(--uiTimelineMainColor);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 1px 2px 0 rgba(0, 0, 0, .24);
    background-color: var(--uiTimelineSecondaryColor);
}

.timeline__post:hover {
    /* color: darkgreen; */
    color: var(--primary);
    background-color: #fcfed0;
}

.timeline p {
    margin: 0;
}

@media screen and (min-width: 641px) {

    .timeline:before {
        left: 30px;
    }

    .timeline__group {
        padding-top: 0;
    }

    .timeline__box {
        padding-left: 100px;
    }

    .timeline__box:before {
        top: 50%;
        transform: translateY(-50%);
    }

    .timeline__date {
        top: 50%;
        margin-top: -27px;
    }
}

@media screen and (max-width: 640px) {

    .timeline:before {
        left: 0;
    }

    .timeline__group {
        padding-top: 40px;
    }

    .timeline__box {
        padding-left: 20px;
        /*padding-top: 70px;*/
        /*mobile*/
        padding-top: 0px;
    }

    .timeline__box:before {
        top: 90px;
    }

    .timeline__date {
        top: 0;
    }
}

/*--------------- 學校歷史history timeline ------------------------*/
/*--------------- 最新設施 -----------------------start-*/
.featurette div h2 {
    font-size: 35px;
}

.featurette div p {
    font-size: 20px;
}

/*--------------- 最新設施 -----------------------end-*/


/*--------------- 教職員簡介行政人員 -----------------------start-*/
.single-comment-item {
    margin-top: 2%;
    margin-bottom: 2%;
}

.comment-person {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 25px;
}

.person-img img {
    height: 200px;
    width: 220px;
    border-radius: 50%;
}

.person-img {
    padding-right: 20px;
}

.person-details h1 {
    margin-bottom: 8px;
    color: #006600;
    font-size: 30px;
    line-height: 20px;
    font-weight: 600;
}

.person-details p {
    margin: 15% 0 0 3%;
    color: #ff6600;
    font-size: 20px;
    line-height: 14px;
}

.person-details p span {
    font-weight: 500;
    border-left: 1px solid #f27329;
    border-width: 0.5px;
    padding-left: 3px;
}

.main-comment {
    background: #fff0e3;
    padding: 20px 24px;
    margin-bottom: 20px;
}

.main-comment p {
    margin-bottom: 0;
    font-size: 23px;
    line-height: 35px;
    letter-spacing: 2px;
}

/*--------------- 教職員簡介行政人員 -----------------------end-*/


/*--------------- 校務計劃和報告 -----------------------start-*/
.align-middle ul li a {
    color: var(--secondary)
}

.align-middle ul li a:hover {
    color: var(--primary)
}

/*--------------- 校務計劃和報告 -----------------------end-*/

/*--------------- 公共部分 -----------------------start-*/
.align-middle ul li {
    list-style-type: square;
    margin-left: 11%;
}

.align-middle ol li {
    list-style-type: decimal;
    /* margin-left: 11%; */
}

.align-middle ol li ol li{
    list-style-type: lower-alpha;
       /* margin-left: 11%; */
   
}

/*--------------- 公共部分 -----------------------start-*/

/*--------------- table style 主要用在科目 ------------------------start*/



div.blueTable {
    /* border: 1px solid #1C6EA4; */
    background-color: #EEEEEE;
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}


.divTableCell,
.divTableHead {
    display: table-cell;
}

.divTable.blueTable .divTableCell {
    padding: 15px 30px;
    background: rgba(255, 255, 0, 0.377);
   
    
    /* float: left; */
}

.divTable.blueTable .divTableHead {
    padding: 15px 30px;
    background: rgba(242, 3, 83, 0.205); 
    color: var(--secondary);
    /* background-color: var(--secondary);
    color: white; */
    display: table-cell;
   
    font-size: 25px;
    letter-spacing: 2px;

}

.divTable.blueTable .divTableRow:nth-child(even) {
    background: #FFFFFF;
}


.divTable.blueTable .divTableHeading .divTableHead {
    font-weight: bold;
    /* color: #FFFFFF; */
    border-left: 2px solid #D0E4F5;
    padding-left: 10px;
}

.divTable.blueTable .divTableHeading .divTableHead:first-child {
    border-left: none;
}
/* .divTable.blueTable .divTableRow .divTableCell:nth-child(even) a{
    color:var(--secondary); 
}
.divTable.blueTable .divTableRow .divTableCell:nth-child(even) a:hover{
    color:var(--primary); 
} */
.divTable.blueTable .divTableRow .divTableCell a,.divTable.blueTable .divTableRow .divTableCell p{
    color:#e42e92;
    font-size: 23px;
    font-weight: bold;
 }

 .divTable.blueTable .divTableRow .divTableCell a:hover{
    color:#fa0053;
 }
/* DivTable.com */
.divTable {
    display: table;
}

.divTableRow {
    display: table-row;
}

.divTableHeading {
    display: table-header-group;
}



.divTableFoot {
    display: table-footer-group;
}

.divTableBody {
    display: table-row-group;
}


.divTableCell ul li
{
    list-style:disc ;
}
.divTableCell ol li   /*數字排序*/
{
    list-style:decimal ;
}


/*--------------- table style 主要用在科目------------------------end*/

/*--------------- iframe youtube ------------------------start*/


.responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

/*--------------- iframe youtube ------------------------end*/

/*--------------- indexSlider 輪播圖------------------------start*/
.indexSlider_inner{
    position: absolute;
      top: 40%;
      left: 10%;
      transform: translateY(-50%);
      text-align: left;
  }
  .indexSlider_inner h2, .indexSlider_inner h3 {
      font-size: 80px;
      color:rgba(255, 255, 255, 0.877)
 }
  .indexSlider_inner h2{
      line-height: 0.7em;
 }
  .indexSlider_inner p {
      font-weight: 400;
      width: 40%;
      margin: 5px auto 15px 0;
      padding: 0 0 0;
      font-size: 18px;
 }

/*左右輪播圖標*/
 .carousel-control-prev {

    /*移上去下面的元素進行更換圖片*/
    &:hover {
        img {
            content: url('../../../images/2023/index/slider/slideLeft2.png')
        }
    }
}

.carousel-control-next {
    &:hover {
        img {
            content: url('../../../images/2023/index/slider/slideRight2.png')
        }
    }
}

.carousel-control-prev img {
    width: 60px;
    height: auto;
}

.carousel-control-next img {
    width: 60px;
    height: auto;
}
 /*--------------- indexSlider 輪播圖------------------------end*/

/*---------------  學校宣傳影片設定------------------------start*/
 .porttitle_inner h3 a:hover{color:var(--primary)}
 /*---------------  學校宣傳影片設定------------------------end*/

/*---------------  主頁學校校内活動設定------------------------start*/
 
.activity_area .witr_section_title_inner p {
    width: 40%;
    padding: 5px 0 0 0;
}
.activity_area {
    padding: 90px 0 76px;

    /* background-color: pink; */
}
.activity_area .prot_content_inner {
    top: 50%;
}
.activity_area .picon a {
    background:transparent;
    font-size:25px;
}
/*---------------  主頁學校校内活動設定------------------------end*/


/*---------------  主頁學校校内活動設定------------------------start*/

.activity-area {
    padding-top: 10px;
    padding-bottom: 130px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    /* background-image: url(../../../images/2023/activity/6606228.jpg); */
    background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.2)),url('../../../images/2023/activity/6606228.jpg');/*給background加黑色遮罩問題已解決*/
}


.activity-area .title h2 {
    font-size: 60px;
    color: #ffc2cd;
    text-shadow: -1px 1px #e80d2c, 1px 1px #e80d2c, 1px -1px #e80d2c, -1px -1px #e80d2c;
    margin-top: -10px;
    font-weight: bold;
}





.activity-area .brpt h2 {
    font-size: 50px;
    margin-top: 15%;   
    color: #ffc2cd;
    text-shadow: -1px 1px #e80d2c, 1px 1px #e80d2c, 1px -1px #e80d2c, -1px -1px #e80d2c;
    font-weight: bold;
}


.activity-inner ul li {
    font-size: 25px;
    display: inline-block;
    font-weight: bold;
    color: #ffc2cd;
    text-shadow: -1px 1px #e80d2c, 1px 1px #e80d2c, 1px -1px #e80d2c, -1px -1px #e80d2c;
    font-weight: bold;
}
.activity-inner ul li a{
    color:blue;
    text-shadow: -1px 1px rgb(58, 124, 247), 1px 1px rgb(58, 124, 247), 1px -1px rgb(58, 124, 247), -1px -1px rgb(58, 124, 247);
}
.activity-area .previous h2 {
    font-size: 30px;
     color: #ffc2cd; 
    text-shadow: -1px 1px #e80d2c,1px 1px #e80d2c,1px -1px #e80d2c,-1px -1px #e80d2c;  
    /* border: 1px solid green;   */
float: left;
position: absolute;
}

.activity-area .next h2 {
    font-size: 30px; 
     color: #ffc2cd;
    margin-top: 5%;
    text-shadow: -1px 1px #e80d2c,1px 1px #e80d2c,1px -1px #e80d2c,-1px -1px #e80d2c;  
    border: 1px solid green; 
float: left;
position: absolute;
}


/*---------------  主頁學校校内活動設定------------------------end*/


/*---------------  修改滾動條 不想要的話整個部分去掉即可------------------------start*/
/* 整个滚动条 */
.modal-body::-webkit-scrollbar{
    width:5px;
    height:5px;
  }

  /* 滚动条有滑块的轨道部分 */
  .modal-body::-webkit-scrollbar-track-piece{
    background-color: transparent;
    border-radius: 5px;
  }

  /* 滚动条滑块(竖向:vertical 横向:horizontal) */
  .modal-body::-webkit-scrollbar-thumb{
    cursor: pointer;
    background-color:#f20352;
    border-radius: 10px;
  }


  /* 滚动条滑块hover */
  .modal-body::-webkit-scrollbar-thumb:hover {
    background-color: #ce0246;
  }
  .modal-body::-webkit-scrollbar-thumb:active {
    background-color: #af043d;
  }

  /* 同时有垂直和水平滚动条时交汇的部分 */
  .modal-body::-webkit-scrollbar-corner{
    display: block;    /* 修复交汇时出现的白块 */
  }
  /*---------------  修改滾動條 不想要的話整個部分去掉即可------------------------end*/

/*--------------- 校友訪問------------------------start*/

.oldStudent-head {
    /* padding-top: 200px; */
    padding: 18% 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    position: relative;
    background-image: url(../../../images/2023/oldStudent/xingyou.jpg);
}
.oldStudent-head .brpt h2 {
    font-size: 40px;
    color: #fff;
    margin-bottom: 10px;
}

.witr_sb_thumb {
    overflow: hidden;
    position: relative;
}
.witr_sb_thumb::before {
    position: absolute;
    content: '';
     background: #20366559; 
    /* background: #206529d4; */
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    transform: scale(0);
    transition: .5s;
    z-index: 1;
}
.witr_sb_thumb img {
     width: 100%; 
    transition: .5s;
}


  .witr_top_category {
    position: absolute;
    left: 45%;
    top: 35%;
    z-index: 999;
    transform: scale(0);
    transition: .5s;
}
.busi_singleBlog:hover .witr_top_category {
    transform: scale(1);
   
}
.busi_singleBlog{
    margin: 10px 0;
}
.witr_top_category ul li a {
    color: #fff;
    /* background: #0eb582; */
    padding: 3px 10px;
    border-radius: 5px;
    margin: 0 10px 10px 0;
    display: inline-block;
    font-size:50px;
    color:var(--primary)
}
/*---------------  校友訪問 ------------------------end*/
/*---------------  國家安全壁報設計比賽--------------- start */

.bihua-head {
    padding-top: 10px;
    padding-bottom: 130px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    /* background-image: url(../../../images/2023/activity/6606228.jpg); */
    background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.2)),url('../../../images/2023/activity/6606228.jpg');/*給background加黑色遮罩問題已解決*/
}


.bihua-head .title h2 {
    font-size: 60px;
    color: #ffc2cd;
    text-shadow: -1px 1px #e80d2c, 1px 1px #e80d2c, 1px -1px #e80d2c, -1px -1px #e80d2c;
    margin-top: -10px;
    font-weight: bold;
}





.bihua-head .brpt h2 {
    font-size: 50px;
    margin-top: 15%;   
    color: white;
    text-shadow: -2px 2px #e80d2c, 2px 2px #e80d2c, 2px -2px #e80d2c, -2px -2px #e80d2c;
    font-weight: bold;

}


.bihua-inner ul li {
    font-size: 40px;
    display: inline-block;
    font-weight: bold;
    color: white;
    text-shadow: -2px 2px #e80d2c, 2px 2px #e80d2c, 2px -2px #e80d2c, -2px -2px #e80d2c;
    font-weight: bold;
    font-style: italic;
    background-color: rgba(255, 255, 255, 0.801);
}
.bihua-inner ul li a{
    color:blue;
    text-shadow: -1px 1px rgb(58, 124, 247), 1px 1px rgb(58, 124, 247), 1px -1px rgb(58, 124, 247), -1px -1px rgb(58, 124, 247);
}


.busi_singleBlog:hover .bihua-thumb img,
        .busi_singleBlog:hover .bihua-thumb::before {

            transform: scale(1.2);
        }

        .busi_singleBlog:hover .activityLinks h4 {
            color: var(--primary)
        }

        .activityLinks h4 {
            text-align: center;
            line-height: 50px;
        }

        .bihua-thumb {
            overflow: hidden;
            position: relative;
        }

        .bihua-thumb::before {
            position: absolute;
            content: '';

            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            transform: scale(0);
            transition: .5s;
            z-index: 1;
        }

        .bihua-thumb img {
            width: 100%;
            transition: .5s;
        }
/*---------------  國家安全壁報設計比賽 ------------------------end*/
/*---------------  校內活動和課餘活動頁面和學校視頻合集頁面--------------- start */
.filter_menu li{font-size: 20px !important;height: 50px;background-color: #fff1c7;color:#7c6623}
.dateStyle span{ color:var(--primary);font-weight: bold;font-size: 20px;  text-shadow: -1px 1px white, 1px 1px white, 1px -1px white, -1px -1px white;} 
.dateStyle2 span{ color:var(--primary);font-weight: bold;font-size: 80px;  text-shadow: -1px 1px white, 1px 1px white, 1px -1px white, -1px -1px white;} 
.activityTitle {
    left: 50%;
    position: absolute;
    top: 60%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 100%;
    z-index: 10;
    -webkit-transition: all .3s ease-in-out .3s;
    transition: all .3s ease-in-out .3s;
    opacity: 0;

}
.activityTitle h2{color: var(--primary);text-shadow: -1px 1px white, 1px 1px  white, 1px -1px  white, -1px -1px  white;font-size: 25px;}

.single_protfolio:hover .activityTitle {
    top: 50%;
    opacity: 1;
}
.category-item-activity{font-size: 16px;color: rgb(247, 247, 84) !important;}

.pIntroduce{text-align: center;margin-top:2%; color:var(--primary);font-weight: bold;font-size: 25px;  text-shadow: -1px 1px white, 1px 1px white, 1px -1px white, -1px -1px white;}


/*---------------  校內活動和課餘活動頁面和學校視頻合集頁面--------------- end */


/*-----------------QR-Code處理-----------------start*/
.dropdown-QRcode {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 150px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 2;
    right: -100%;
    bottom:-340%;
   
    text-align: center;
}



.dropdown-QRcode a:hover {
    background-color: #d1d0d0;
}

.dropdown:hover .dropdown-QRcode {
    display: block;
}
/*-----------------QR-Code處理-----------------end*/

/*-----------------重大事件改为灰色网页-----------------start*/
/* html {
    filter: grayscale(95%);
    -webkit-filter: grayscale(95%);
    -moz-filter: grayscale(95%);
    -ms-filter: grayscale(95%);
    -o-filter: grayscale(95%);
} */