@charset "utf-8";

@import url("reset.css");

@import url("loading.css");

@import url("fontawesome_all.css");

@import url("fakeLoader.min.css");

@import url("animate.css");

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC&display=swap');





/* ----------------------------------------------------------------------------------------------------------------*/

/* ---------------------------------->>> Main <<<------------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; letter-spacing:1px; }

html { height:100% }

body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; -webkit-text-size-adjust:none; font-size:12px; overflow-y:scroll; overflow-x:hidden; }

body, td, th,select,input {font-size: 12px;font-family: /*Arial,*/ "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif;color:#333333;}



/*簡易設定*/

.iframe_ch { display:none }

.middle { vertical-align:middle; }

.center { text-align:center; }

.w100{ width:100%; }



#tip_box { position: fixed; line-height:22px; background-image:url(../../images/bg.png); color: #FFF; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-left:10px; }



/*fix safari*/

input, select, textarea{ -ms-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; -webkit-box-sizing:content-box;}

input[type='text'],input[type='password'],input[type='button'],input[type='submit']{  -webkit-appearance: none; }



/*分頁*/

.pager{ width:100%; overflow:hidden; margin:50px auto 50px auto; text-align:center; }



/*編輯器*/

/* .editor{position:relative;padding: 20px 0 20px 20px;font-size:16px;line-height:30px;min-height: 500px;} */

.editor{position:relative;padding: 30px 0 30px 0;font-size:16px;line-height: 28px;overflow-x: auto;}

.decorate1{ border-left:1px solid #e1e1e1; }

.decorate1 .dot{position:absolute;top:0;left: -4px;width:10px;height:10px;background: #e0bfa5;}



/*連結*/

a{color: #28231c;text-decoration:none;}

a:hover{ color:#3e567c; }



.editor a{color: #f39850 !important;text-decoration:underline !important;}

.editor table th,.editor table td{ font-size:14px; }



/*表格*/

#css-table {display:table;width:100%;}

.css-tr {display: table-row;}

.css-td {display: table-cell;text-align:left;vertical-align:middle;padding: 0px 10px;box-sizing:border-box;letter-spacing:1px;font-size: 13px;word-break: break-all;color:#121212;}



/*全營幕遮罩*/ 

.bg-overlay { display:block; position:fixed; left:0; top:0; background:rgba(0, 0, 0, 0.7); opacity:0; visibility:hidden; width:100%; height:100%; z-index:9999; transition: all 0.2s linear; }

.bg-overlay.visible { opacity:1; visibility:visible }



/*layout*/

/*

.layout-flex{ display:flex; margin:40px auto !important; }

.layout-left{flex: 1;padding-right:50px;font-weight:bold;}

.layout-right{flex:3;margin-bottom: 70px;}

.layout-right .web-caption .left .title{ color:#48351e; }

*/

/*左右欄的頁面*/

.container .wrap .layout-left{width: 25%;float:left;box-sizing: border-box;padding: 0 30px 0 10px;margin: 0 0 50px 0;}

.container .wrap .layout-right{width: 75%;float:left;box-sizing: border-box;padding: 1px 10px;}

.container .wrap .layout-all{ width:100%; }

.container .wrap .layout-right .end{margin-bottom: 50px;}



.container .wrap .layout-flex{ display:flex; }

.container .wrap .layout-news{ flex:2; }

.container .wrap .layout-quicklink{ flex:1; }



@media screen and (max-width : 900px) {

	.container .wrap .layout-flex{ display:block; }

}



/*左邊選單（CATEGORY 樣式）*/

.layout-left .caption{

    font-size:20px;

    /* font-weight:bold; */

    text-align:center;

    background: #42597e;

    color:#ffffff;

    letter-spacing:2px;

    padding:18px 10px;

    margin:0 0 0 0;

}

.layout-left > ul{

    list-style:none;

    margin:0;

    background:#ffffff;

    padding: 0px 0 15px 0;

    border-radius:0;

}



.layout-left > ul > li{

    width:100%;

    font-size:16px;

    border-bottom: 2px solid #e7ddcc;

    padding: 10px 5px;

}

.layout-left > ul > li:last-child{

    border-bottom:0;

}

.layout-left > ul > li > a{

    position:relative;

    color:#000000;

    font-weight:bold;

    text-decoration:none;

    display:block;

    letter-spacing:2px;

    padding:10px 30px 6px 0;

}

/* 取消原本左側小圖示 */

.layout-left > ul > li > a:before{

    content:none;

}

.layout-left > ul > li > a:after{

    font-family:"Font Awesome 5 Free";

    font-weight:900;

    content:"\f105";

    position:absolute;

    font-size: 20px;

    right:0;

    top:50%;

    transform:translateY(-50%);

    color:#3f587f;

}

.layout-left > ul > li > a:hover,

.layout-left > ul > li > a.on{

    color:#3f587f;

}



/* 子選單（申請表單／相關連結） */

.layout-left > ul > li ul{

    display:block;

    list-style:none;

    margin:4px 0 0 0;

    padding:0 0 4px 0;

}

.layout-left > ul > li ul li{

    width:100%;

    padding: 10px 0 10px 0;

    font-size:15px;

}

.layout-left > ul > li ul li a{

    position:relative;

    color: #707070;

    text-decoration:none;

    display:block;

    padding:0 0 0 24px;

    line-height:20px;

}

.layout-left > ul > li ul li a:before{

    font-family:"Font Awesome 5 Free";

    font-weight:900;

    content:"\f105";

    position:absolute;

    left:0;

    top:50%;

    transform:translateY(-50%);

    color:#c1a263;

    font-size:10px;

}

.layout-left > ul > li ul li a:hover{

    color:#c1a263;

}

.layout-left > ul > li ul li.third{

    padding-left:20px;

}





/*內頁banner*/

#banner-box{

    width:100%;

    margin:0 auto;

    overflow:hidden;

}

/* #banner-inner{position:relative;height: 295px;background: url(../../images/banner-inner.jpg) top no-repeat;background-size: cover;} */

#banner-inner .overlay{

    display:flex;

    align-items:center;

    justify-content:center;

    width:100%;

    height:300px;

}

.banner-title-box{

    width:100%;

    max-width:1200px;

    padding:0 20px;

    margin:0 auto;

    text-align:left;

}

.banner-title-en{

    font-size:26px;

    letter-spacing:4px;

    color:#61749b;

    font-weight:600;
    line-height: 1.6;

}

.banner-title-line{

    width:130px;

    height:3px;

    background:#c1a263;

    margin:14px 0 20px 0;

}

.banner-title-tw{

    font-size:32px;

    color:#c1a263;

    letter-spacing:4px;

}



/*麵包屑*/

#sitemap{width:100%;margin: 0 0 25px 0;padding:0 10px;box-sizing: border-box;letter-spacing:1px;color: #737373;text-align: left;}

#sitemap .wrap{width:100%;max-width:1200px;overflow:hidden;margin: 0 auto;padding: 20px 0px;color: #696969;font-size: 13px;}

#sitemap .wrap i{ padding-right:5px; }

#sitemap .wrap a{color: #696969;text-decoration:none;}

#sitemap .wrap a{ text-decoration:underline; }





/*網站按鈕(一)*/

.btn-1{

	position:relative;

	display:inline-block;

	color: #c1a263 !important;

	font-size: 16px !important;

	/* font-style: italic; */

	letter-spacing: 3px;

	/* background: #ffffff; */

	border: 1px solid #c1a263;

	width:auto !important;

	padding: 12px 60px 12px 20px;

	margin: 0 0 0 0;

	cursor:pointer;

	/* border-radius: 30px; */

	text-align:left !important;

	text-decoration: none;

	/* border-radius: 30px; */

	/* box-shadow: 2px 2px 5px #ebebeb; */

}

.btn-1:before{/* content:url(../../images/more-dot.png); */position:absolute;left:10px;top: 17px;}

.btn-1:after{position:absolute;width: 50px;top: 30%;right: -20px;transition: all 0.5s ease;font-family: "Font Awesome 5 Free";font-weight: 900;content: "\f054";}

.btn-1:hover:after{ right:-25px;}





/*按鈕*/

.btn-2{

	position:relative;

	display:inline-block;

	color: #ffffff!important;

	font-size: 16px !important;

	background: #c1a263;

	width:auto !important;

	padding: 10px 40px 10px 40px;

	margin:0 0 0 0;

	cursor:pointer;

	text-align:left !important;

	outline:0;

	border: 0;

	/*-webkit-border-bottom-right-radius: 15px;*/

}

.btn-2:hover{background: #cb7e42;}



/*首頁大標題（預設置左，上方金色線、中文字金色、英文黑色）*/

.b-title{

    position:relative;

    min-width: 150px;

    width:fit-content;

    font-weight:normal;

    text-align:left;

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    justify-content:flex-start;

    color:#413c3c;

    font-size:16px;

    padding: 10px 0 0 0;

    /* margin-top: 45px; */

    border-top:3px solid #c1a263;

}

.b-title span{

    display:block;

}

/* 中文標題：有 class 時優先，否則抓第一個 span */

.b-title .title-tw,

.b-title span:first-child{

    color: #c1a263;

    font-size:32px;

    margin-top:15px;

    margin-bottom: 9px;

    letter-spacing: 5px;

}

/* 英文標題：有 class 時優先，否則抓第二個 span */

.b-title .title-en,

.b-title span:nth-child(2){

    color:#000000;

    font-size: 18px;

    margin-top:5px;

    letter-spacing: 0px;

}

/* 舊的線條與動畫取消 */

.b-title .line{display:none;}

.b-title:before{content:none;}



/* 最新消息 - 左側按鈕樣式覆寫 */

.news-left .btn-1{

    color:#c1a263 !important;

    border:1px solid #c1a263;

    border-radius:0;

}





/*內頁大標題（左側金色直條＋全寬下劃線）*/

.b-innertitle{

    position:relative;

    width:100%;

    color: #3e567c;

    font-size: 28px;

    letter-spacing:1px;

    padding: 5px 0 25px 28px;

    border-bottom: 4px solid #eae1cf;

    margin-bottom: 15px;

    box-sizing:border-box;

    line-height: 1.2;

}

.b-innertitle:before{

    content:"";

    position:absolute;

    left:0;

    top: 0px;

    height: 35px;          /* 直條高度略短，與底線保留空隙 */

    width:8px;

    background: #c1a263;

}

/* 舊的 line 元素不再使用 */

.b-innertitle .line{

    display:none;

}



/*圖片延遲載入*/

img.lazy {

	display: block;

	/* optional way, set loading as background */

	background-image: url('../../images/ajax-loading.gif');

	background-repeat: no-repeat;

	background-position: 50% 50%;

}



/*活動圖片裁切*/

.album-cut {/* height: 210px; */overflow:hidden;/*border:1px solid #ccc;*//* line-height: 210px; *//* background: #ebebeb; */}

.album-cut img{vertical-align:middle;}

.album-cut2 {height:250px;overflow:hidden;/*border:1px solid #ccc;*/line-height: 250px;background: #ebebeb;}

.album-cut2 img{ vertical-align:middle;}

.album-cut3 {/* height:172px; */overflow:hidden;/*border:1px solid #ccc;*//* line-height: 172px; */background: #ffffff;}

.album-cut3 img{ vertical-align:middle;}



/* 系所簡介 hero 區塊 */

#about-hero{

    min-height:480px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    text-align:center;

    color:#ffffff;

    padding:60px 20px;

}

.about-hero-title{

    margin-bottom:30px;

}

.about-hero-line{

    width:130px;

    height:3px;

    background:#c1a263;

    margin:0 auto 25px auto;

}

.about-hero-tw{

    font-size:40px;

    letter-spacing:6px;

    margin-bottom:10px;

    color: #c1a263;

}

.about-hero-en{

    font-size: 18px;

}

.about-hero-main{

    font-size:32px;

    /* font-weight:bold; */

    margin:25px 0 10px 0;

}

.about-hero-sub{

    font-size: 16px;

    margin-bottom: 40px;

}

.about-hero-text{

    max-width:900px;

    font-size:16px;

    line-height:1.8;

    margin: 0 auto 100px auto;

    text-align: left;

}

.about-hero-btn-inner{

    color:#ffffff !important;

    border:1px solid #ffffff;

    background:transparent;

    /* border-radius:30px; */

    padding: 10px 50px 10px 20px;

}

.about-hero-btn-inner:hover{

    background:rgba(255,255,255,0.1);

}

@media screen and (max-width:768px){

    #about-hero{

        padding:40px 15px;

    }

    .about-hero-tw{

        font-size:32px;

    }

    .about-hero-main{

        font-size:26px;

    }

}





/* 中心目標區塊 */

.objectives-bg{

    background: #eeefee url(../../images/objective.png) center 50px no-repeat;

    background-size: 70%;

    padding: 80px 0 100px 0;

}

.objectives-inner{

    text-align:center;

    padding: 30px 20px;

}

.objectives-inner .b-title{

    margin:0 auto 50px auto;

    align-items:center;

    text-align:center;

}

.objectives-grid{

    display:flex;

    flex-wrap:wrap;

    justify-content:center;

    gap:30px 40px;

    max-width:1200px;

    margin:0 auto;

}

.objective-item{

    flex:0 0 250px;

    background:#ffffff;

    padding: 30px 12px 30px 12px;

    box-shadow:0 0 10px rgba(0,0,0,0.05);

    text-align:center;

}

.objective-img img{

    max-width:160px;

    width:100%;

    height:auto;

}

.objective-title-tw{

    margin-top: 25px;
    font-size: 22px;
    color: #264a76;
    line-height: 1.2;
    letter-spacing: 1px;
    min-height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;

}

.objective-title-en{

    margin-top:5px;

    font-size:15px;

    color: #3e567c;

}

.objective-text{

    margin-top:25px;

    font-size:15px;

    line-height: 1.5;

    color: #191919;

}

@media screen and (max-width:1024px){

    .objectives-grid{

        gap: 24px 10px;

    }

    .objective-item{

        flex:0 0 48%;

    }

}

@media screen and (max-width: 480px){

    .objectives-grid{

        /* gap:20px; */

    }

    .objective-item{

        flex: 0 0 100%;

        max-width: 320px;

        margin:0 auto;

    }

}



/* 推動項目區塊 */

.key-section-bg{

    background:#ffffff url(../../images/key-bg.png) center right no-repeat;

    background-size:cover;

    padding: 40px 20px 40px 20px !important;

}

.key-layout{

    display:flex;

    align-items:flex-start;

    gap:40px;

}

.key-left{

    flex:1.3;

}

.key-right{

    flex:1;

    display:flex;

    justify-content:flex-end;

    align-items:center;

}

.key-right-img{

    max-width:100%;

    height:auto;

    /* box-shadow:0 0 10px rgba(0,0,0,0.08); */

}

.key-left .b-title{

    margin-bottom:40px;

}

.key-list{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.key-item{

    margin-bottom:6px;

}

.key-item-title{

    font-size:18px;

    color:#264a76;

    font-weight:bold;

    letter-spacing:2px;

}

.key-item-line{

    width:80px;

    height:2px;

    background:#cccccc;

}

.key-item-text{

    font-size:15px;

    line-height:1.8;

    color:#333333;

}



.key-item-body{

    display:flex;

    align-items:flex-start;

    margin-top: 10px;

}

.key-item-body .key-item-line{

    flex:0 0 80px;

    margin-top: 15px;

    margin-right:15px;

}

.key-item-body .key-item-text{

    flex:1;

    text-align:left;

}

@media screen and (max-width:1024px){

    .key-layout{

        flex-direction:column;

        gap: 0;

    }

    .key-right{

        justify-content:center;

        margin-top:20px;

    }

}

@media screen and (max-width : 1200px) {

	.container .wrap .layout-left{ width:30%; }

	.container .wrap .layout-right{ width:70%; }	

}



@media screen and (max-width : 900px) {

	.container .wrap .layout-left{ display:none; }

	.container .wrap .layout-right{ width:100%; }

    .b-innertitle{font-size: 20px;line-height: 1.6;}



}





/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Common <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



#wrapper{ width:100%; overflow:hidden; }



.container{ position:relative; width:100%; overflow: hidden;}

.container.bg-gray{ background:#f9f9f9; }



.container.row-color:nth-child(even) {/*background: #ffffff;*/}

.container.row-color:nth-child(odd) {/*background: #f4f5ef;*/}



.container .wrap{position: relative;max-width: 1200px;overflow: hidden;margin: 0px auto;}

/*回上頁*/

.gotop{ position:fixed; bottom:100px; right:20px; z-index:99; }



/*footer*/

#site_footer {

    background: #24344d;

    background-size:cover;

}



.footer_container {

    width: 100%;

    max-width: 1200px;

    margin: 0 auto;

    display: flex;

    align-items: center; /* 垂直對齊 */

    justify-content: space-between; /* 左右內容對齊 */

    box-sizing: border-box;

    padding: 40px 0 40px 0;

}



/* 左側區塊樣式 */

.footer_left {

    width: 50%;

    display: flex;

    justify-content: center; /* 右對齊左側內容 */

    align-items: center; /* 垂直對齊 */

}



.footer_logo {

    max-width: 100%;

    height: auto;

    padding: 0 30px; /* 確保左右邊距一致 */

}



/* 右側區塊樣式 */

.footer_right {

    width: 50%;

    display: flex;

    flex-direction: column;

    /* align-items: flex-start; */ /* 左對齊右側內容 */

    color: #6c757d;

    line-height: 1.6;

    letter-spacing: 1px;

    font-size: 15px;

    margin: 0; /* 移除多餘的 margin */

    padding: 10px 0 0 0;

}



.footer_right .footer_right_content{/* border-left:1px solid #ffffff; */padding-left: 30px;}



.footer_right .contact-items {

    display: flex;

    align-items: flex-start;

    color: #ffffff;

    /* font-weight: bold; */

}



.footer_right .contact-items:not(:last-child) {

    padding-bottom: 10px;

}



.footer_right .contact-items .items-title {

    flex: 1;

    min-width: 100px;

}



.footer_right .contact-items .items-title i {

    color: #ffffff;

    padding: 0 8px 0 0;

}



.footer_right .contact-items .items-content {

    flex: 6;

    color: #ffffff;

    text-align: left;

}



#site_footer .designed_by {

	width:100%;

	/* max-width:1200px; */

	margin: 20px auto 0px auto;

	padding: 20px 0 20px 0;

	/* margin-top: 50px; */

	align-self: flex-end; /* 右對齊 */

	color: #879ab2;

	text-align: center;

	font-size: 12px;

	letter-spacing: 1px;

	background: #2b3d59;

}



#site_footer .designed_by a {

    color: #879ab2;

    text-decoration: none;

}



#site_footer .designed_by a:hover {

    text-decoration: underline;

}



/* 響應式設計 */

@media (max-width: 768px) {

    .footer_container {

        flex-direction: column;

        align-items: center;

        text-align: center;

    }



    .footer_left, .footer_right {

        width: 100%;

        text-align: center;

        justify-content: center;

        align-items: center;

    }



    .footer_right {

        align-items: center;

    }



    #site_footer .designed_by {

        align-self: center;

        text-align: center;

        line-height: 1.5;

        padding: 20px 20px;

    }



    .footer_right_content {

        padding: 30px 30px 10px 30px;

    }

	

	.footer_container{ padding:20px 0 20px 0; }

	.footer_right .footer_right_content{border-left:none;padding-left: 30px;}



}



/*表格樣式*/

#table-1 {

  font-family: Arial, Helvetica, sans-serif;

  border-collapse: collapse;

  width: 100%;

}



#table-1 td, #table-1 th {

  border: 1px solid #ddd;

  padding: 5px;

  text-align: center;

}



#table-1 tr:nth-child(even){background-color: #f2f1f1;}



#table-1 tr:hover {background-color: #ddd;}



#table-1 th {

  padding-top: 5px;

  padding-bottom: 5px;

  text-align: center;

  background-color: #90c31f;

  color: white;

}



@media screen and (max-width : 1200px) {

	.container{padding: 10px 20px;}

	#footer-nav ul{ display:flex; flex-wrap:wrap; align-items:center; justify-content: center; }

}



@media screen and (max-width : 768px) {

	.container{padding: 10px 0px;}

}



@media screen and (max-width : 550px) {

	.logo-b{/* width:80%; *//* max-height: 65px; */}	

}





/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Index <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



/*影片&公告*/

        .bullet-container {

            display: flex;

            justify-content: space-between;

            flex-wrap: wrap;

            margin: 20px auto;

            max-width: 100%;

        }



        /* 左邊 YouTube 區塊 */

		.video-section{

			width: 55%; /* 讓左右區域有一樣的寬度 */

		}

		.video-section .b-title{

    height: auto;

    margin: 30px 0vw 30px 0vw;

    display: block;

    text-align: left;

}

		.video-section .b-title span{

    text-align: left;

}

		.video-section .b-title .line{}

        .video-section-wrap {

			width: 100%;

			position: relative;

			padding-bottom: 76.25%; /* 16:9比例，確保高度保持一致 */

			height: 0;

			overflow: hidden;

			background: #000;

			margin-bottom: 20px;

			border-radius: 30px; /* 圓角效果 */

			}

        .video-section iframe {

            position: absolute;

            top: 0;

            left: 0;

            width: 100%;

            height: 100%;

			max-height:520px;

            border-radius: 30px; /* 影片區域的圓角效果 */

        }



        /* 右邊 bxSlider 區塊 */

        .carousel-section {

            width: 42%; /* 讓左右區域有一樣的寬度 */

            margin-bottom: 20px;

            /* margin-top: -10px; */

            border-radius: 30px; /* 圓角效果 */

        }

		.carousel-section .b-title{

    height: auto;

    margin: 30px 0vw 10px 0vw;

    display: block;

    text-align: left;

   }

		.carousel-section .b-title span{text-align: left;}

		.carousel-section .line{}		



		.bxslider-bullet ul{ list-style:none; }

		.bxslider-bullet li { width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; height:520px; }

		.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active{ background:#879ab2; }



        .bxslider-bullet img {

            width: 100%;

            height: auto;

            border-radius: 30px; /* 圓角效果 */

        }



        /* RWD 支援 */

		@media (max-width: 1200px) {

			

            .video-section-wrap {

				border-radius:0;

				padding-bottom: 75.25%; /* 16:9比例，確保高度保持一致 */

				}

            .carousel-section {

                border-radius: 0px;

            }	

			.bxslider-bullet img{ border-radius:0; }				

			.bxslider-bullet li { height:auto; }	

		}

        @media (max-width: 768px) {

			.video-section{

				width: 100%; /* 讓左右區域有一樣的寬度 */

			}			

            .video-section-wrap {

                width: 100%;

                min-height: 300px;

				border-radius:0;

            }

            .carousel-section {

				width:100%;

                border-radius: 30px;

            }				

            .bullet-container {

                flex-direction: column;

                align-items: center;

                width: 96%;

            }



        }





/*即時新聞*/

#index-report{width:100%;overflow: hidden;display:flex;justify-content: space-between;flex-wrap:wrap;}

#index-report .items{

    border: 1px solid #bcbcbc;

    flex: 0 32%;

    padding: 10px;

    margin: 10px 5px;

	transition: transform 0.1s ease-in-out, box-shadow 0.1s;

}

#index-report .items img{ width: 100%; }

#index-report .items:hover{ transform: translateY(-0.5rem); }



#index-report .items div{ width:100%; overflow:hidden; }

#index-report .items div.title{color:#000000;font-weight:bold;font-size: 16px;padding: 15px 0 0 0;}

#index-report .items div.title a{ /*color:#000000; text-decoration:none;*/ }

#index-report .items div.title:before{content:url(../../images/news-icon-1.png);vertical-align:middle;padding-right: 5px;}

#index-report img.lazy{ /*max-height:300px;*/ }



@media screen and (max-width : 900px) {

	#index-report .items{flex: 1 48%;}

}



@media screen and (max-width : 480px) {

	#index-report .items{flex: 0 100%;}

   

}



/*最新消息*/

.news-bg{

    background:url(../../images/news-bg.png) bottom center no-repeat;

}

.news-caption{

    width:100%;

    height:120px;

    background:url(../../images/news-caption.png) center center no-repeat;

    background-repeat:no-repeat;

    background-size:90% auto; /* 背景圖寬度 90%，高度自動 */

    margin: 20px auto 10px auto; /* 上方留一點空間，左右置中 */

}

#index-news{margin: 0px 0;padding: 10px 10px 30px 10px;}



.news-layout{

    display:flex;

    align-items:stretch;

    gap:40px;

}

.news-left{

    flex: 0 0 25%;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

}

.news-more-btn{

    margin-top:40px;

}

.news-more-btn-mobile{

    display:none;

}

.news-right{

    flex:1;

}



/* 原分類樣式暫時保留，未使用 */

#index-news .news-types{display:none;}



/* 三欄列表 */

#index-news .news-frame{

    width:100%;

    overflow:hidden;

    border-top:none !important;  /* 避免出現多餘的水平線 */

}

#index-news .news-list{

    display:flex;

    align-items:stretch;

    width:100%;

    padding: 20px 0;

    border-bottom: 1px solid #e0e0e0;

}

#index-news .news-list:last-child{ border-bottom:0; }



.news-list .date-col{

    flex: 0 0 10%;

    min-width: 80px;

    min-height: 80px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    align-self:flex-start;

    font-family: 'Noto Sans TC', sans-serif;

    background: #e1e7ec;

    /* border-radius:8px; */

}

.news-list .date-col .month{

    font-size:16px;

    letter-spacing:2px;

}

.news-list .date-col .day{

    font-size:28px;

    /* font-weight:bold; */

    margin-top:5px;

    color: #314058;

}



.news-list .content-col{

    flex:1;

    padding:0 25px;

    text-align:left;

}

.news-list .content-col .title{

    font-size:18px;

    color: #314058;

    font-weight: bold;

    margin-bottom:8px;

}

.news-list .content-col .excerpt{

    font-size:15px;

    color: #808080;

    line-height:1.6;

}



.news-list .more-col{

    flex: 0 0 12%;

    min-width:90px;

    display:flex;

    flex-direction:column;

    align-items:flex-end;

    justify-content:flex-end;

    font-size:14px;

    color:#143874;

    padding-bottom: 10px;

}

.news-list .more-col a{color: #314058;text-decoration:none;}

.news-list .more-col a:hover{ text-decoration:underline; }



.news-list .more-link{

    position:relative;

    padding-right:22px;

}

.news-list .more-link:after{

    content:"\f054";

    font-family:"Font Awesome 5 Free";

    font-weight:900;

    position:absolute;

    right:0;

    top:50%;

    transform:translateY(-50%);

}



@media screen and (max-width : 900px) {

    /* 手機版最新消息背景滿版 */

    .news-bg{

        background-position:center top;

        background-size:cover;

    }

    /* 整體版面縮窄，改為上下排列 */

    .news-layout{

        flex-direction:column;

        gap:20px;

    }

    .news-left,

    .news-right{

        flex:1;

    }



    /* 最新消息標題在手機上略縮小、行距變窄 */

    .news-left .b-title{

        margin-top:10px;

        padding-top:4px;

        margin-bottom:8px;

        border-top-width:2px;

    }

    .news-more-btn{

        display:none;

    }

    .news-more-btn-mobile{

        display:block;

        margin-top:16px;

        text-align:center;   /* 手機版更多消息外觀與桌機一致 */

    }

    .news-left .b-title .title-tw{

        font-size:26px;

        margin-top:10px;

        margin-bottom:6px;

    }

    .news-left .b-title .title-en{

        font-size:16px;

    }



    /* 列表改為直向，減少上下間距與字級 */

    #index-news .news-list{

        flex-direction:column;

        padding:14px 0;

    }

    .news-list .date-col{

        flex-direction:row;

        justify-content:flex-start;

        align-items:center;

        min-width:70px;

        min-height:60px;

        margin-bottom: 20px;

        padding:6px 10px;

    }

    .news-list .content-col{

        padding:0 0 6px 0;

    }

    .news-list .content-col .title{

        font-size:16px;

        margin-bottom: 10px;

        line-height: 1.6;

    }

    .news-list .content-col .excerpt{

        font-size:15px;

        line-height:1.6;

    }

    .news-list .date-col .day{

        margin-top:0;  /* 手機版月/日水平排列時垂直置中 */

        padding-left: 10px;

    }

    .news-list .more-col{

        justify-content:flex-start;

        align-items: end;

        margin-top:4px;

        padding-bottom:0;

        font-size:13px;

    }



   

}





/*活動剪影*/

#index-album{width:100%;overflow: hidden;display:flex;/* justify-content: space-between; */flex-wrap:wrap;padding: 30px 0; padding-top:10px;}

#index-album .items{

    /* border-top: 5px solid #90c31f; */

    /* box-shadow: 1px 1px 5px #cccccc; */

    /* flex: 1 22.5%; */

    margin: 10px 10px;

    transition: transform 0.1s ease-in-out, box-shadow 0.1s;

}



#index-album .items-index{width: 31%; height: 300px;overflow: hidden;}

#index-album .items-content{ width: 31%; }

#index-album.inner-album .items-content{width: 46% !important;}



#index-album .items img{width: 100%;/* border-top-left-radius: 25px; */ /* 左上角圓角 *//* border-top-right-radius: 25px; */ /* 右上角圓角 */}

#index-album .items:hover{ /*transform: translateY(-0.5rem);*/ }



#index-album .items div{width:100%;overflow:hidden;}

#index-album .items div.title{color:#000000;/* font-weight:bold; */text-align: center;font-size: 16px;padding: 15px 0 15px 0;background: #ffffff;border-bottom-left-radius: 25px; /* 左下角圓角 */border-bottom-right-radius: 25px; /* 右下角圓角 */}

#index-album .items div.title a{/*color:#000000; text-decoration:none;*/font-weight: bold;/* text-shadow: 2px 2px 2px #cccccc; */}

#index-album .items div.title:before{/* content:url(../../images/album-icon-1.png); */vertical-align:middle;padding-right: 5px;}

#index-album img.lazy{ /*max-height:330px;*/ }



@media screen and (max-width : 710px) {

	#index-album .items{flex: 0 45%;}

}



@media screen and (max-width : 480px) {

	#index-album .items{flex: 0 100%;}

}



@media screen and (max-width : 1036px) {

	#index-album .items-index{width: 31%;}

}



@media screen and (max-width : 838px) {

	#index-album .items-index{width: 30%;}

}



@media screen and (max-width : 1201px) {

	#index-album .items-content{ width: 30.5%; }

}



@media screen and (max-width : 1074px) {

	#index-album .items-content{ width: 30%; }

}



@media screen and (max-width : 923px) {

	#index-album .items-content{ width: 29.5%; }

}



/* inner-album (content.php 相片區塊) */

#index-album.inner-album {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 24px;

    padding: 20px 10px;

    overflow: visible;

}

#index-album.inner-album .items-content {

    width: 100% !important;

    margin: 0 !important;

    background: #fff;

    transition: transform 0.25s ease, box-shadow 0.25s ease;

    box-shadow: 1px 1px 10px #ebebeb;

}

#index-album.inner-album .items-content:hover {

    transform: translateY(-6px);

    box-shadow: 0 16px 36px rgba(44, 62, 107, 0.15);

}

#index-album.inner-album .album-cut {

    width: 100%;

    height: 240px;

    overflow: hidden;

    /* border-radius: 6px; */

}

#index-album.inner-album .album-cut img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    /* border-radius: 6px; */

    vertical-align: middle;

    transition: transform 0.5s ease;

}

#index-album.inner-album .items-content:hover .album-cut img {

    transform: scale(1.07);

}

#index-album.inner-album .items div.title {

    text-align: center;

    font-size: 16px;

    color: #2c3e6b;

    padding: 20px 12px 14px;

    background: #fff;

    border-radius: 0;

    line-height: 1.6;

    font-weight: normal;

}

#index-album.inner-album .items div.title::before {

    content: '';

    display: block;

    width: 28px;

    height: 2px;

    background: #2c3e6b;

    margin: 0 auto 16px;

}

#index-album.inner-album .items div.title a {

    color: #191919;

    font-size: 18px;

    text-decoration: none;

    font-weight: normal;

}

#index-album.inner-album .items div.title a:hover {

    color: #4a6fa5;

}

@media screen and (max-width: 710px) {

    #index-album.inner-album { grid-template-columns: repeat(2, 1fr); }

}

@media screen and (max-width: 480px) {

    #index-album.inner-album { grid-template-columns: 1fr; }

}





/*系所介紹*/

#index-about{width:100%;overflow:hidden;padding: 0 0 30px 0;}

.about-bg{ background:url(../../images/about-bg.png) bottom center no-repeat; background-size:cover; }

#index-about .about-wrap{display:flex; max-width:1300px; margin:0 auto; flex-direction: row; flex-wrap: wrap;}

#index-about .about-wrap .b-title{ text-align:left; }

#index-about .about-wrap .b-title h5{ padding:20px 0px 20px 0px; }

#index-about .about-wrap .slogan{

    color: #81a237;

    font-size: 18px;

    font-style: italic;

    line-height: 22px;

    letter-spacing: 2px;

}

#index-about .right{flex:1;padding: 0 50px 0 50px;    

    display: flex;

    flex: 1;

    padding: 0 50px 0 50px;

    flex-direction: column;

    justify-content: space-around;}

#index-about .right .service-area{position:relative;display: flex;justify-content: space-between;margin:20px 0;padding:30px 0;border-top:1px solid #d4d4d4;border-bottom:1px solid #d4d4d4;}

#index-about .right .service-area .caption{position:absolute;background: #ffffff;padding: 5px 10px;top: -13px;left:0;text-transform:uppercase;color:#334e5f;font-size:16px;letter-spacing:2px;}

#index-about .right .service-area span{ width:102px; border:8px solid #698ba1; color:#fefefe; font-size:18px; margin:5px 0; padding: 30px 23px; letter-spacing: 2px; display:inline-block;

    

	background: linear-gradient(274deg, rgba(50, 77, 94, 1)51%, rgba(74, 105, 124, 0.9)100%);

	background: -moz-linear-gradient(274deg, rgba(50, 77, 94, 1)51%, rgba(74, 105, 124, 0.9)100%);

	background: -webkit-linear-gradient(274deg, rgba(50, 77, 94, 1)51%, rgba(74, 105, 124, 0.9)100%);

	background: -o-linear-gradient(274deg, rgba(50, 77, 94, 1)51%, rgba(74, 105, 124, 0.9)100%);

	

	border-radius:50%;

    -moz-border-radius:50%;

    -webkit-border-radius:50%;

}

#index-about .pager{ text-align:right; }

#index-about .pager .btn-1{ padding:10px 70px 10px 45px; }

#index-about .pager .btn-1:after{top: 20%;}





#index-about .left{ 

    display: flex;

   

    flex: 1;

    text-align: center;

    align-items: flex-start;

    justify-content: center;

    border-radius: 20px;

}

#index-about .left img{ border-radius: 20px; }



@media screen and (max-width : 900px) {

	#index-about .about-wrap{ display:block; }

	#index-about .right{flex:1;padding: 0 20px 0 20px;}

}



@media screen and (max-width :1230px) {

    #index-about .about-wrap{  flex-direction: column; }

    #index-about .about-wrap .left img{margin-bottom: 30px;}

}



 #index-about .about-wrap .right img{max-width:  550px !important;}



/*相關連結*/

.links-container{text-align:center;width:100%;margin: 5vw 0;/* vertical-align: top; */}

.links-container a{margin: 10px 8px;max-width:280px;width:100%;text-align:left;display:inline-block;vertical-align: top;}

.links-container a img{width:100%;box-shadow: 2px 2px 8px rgba(15%,15%,40%,0.1);}



/*相關連結-輪播*/

.links-bg{ background:#e8ecf0; }

#index-links{ padding-bottom:80px; }

#index-links .b-title{ color:#3e567c; }

#index-links .b-title span{ color:#413c3c; }

#index-links .b-title .line{ background:#3e567c; }

#index-pdt .pdt-carousel{display: flex;position: relative;margin-bottom: 20px;}

#index-pdt .owl-left{/*position: absolute;*/left: 20px;top: 40%;cursor:pointer;display:flex;align-items:center;justify-content: center;width: 10%;float:left;}

#index-pdt .owl-center{width: 80%;float:left;padding: 0 0vw;margin: 0 auto;}

#index-pdt .owl-right{/*position: absolute;*/right: 20px;top: 40%;cursor:pointer;display:flex;align-items:center;justify-content: center;width: 10%;text-align: right;float:left;}

#index-pdt .contain{position: relative;text-align:center;font-size:22px;}

#index-pdt .contain a{position: absolute;bottom: -10%;width: 80%;display: inline-block;padding: 25px 0 25px 0;margin: 20px 0;left: 0;right: 0;margin-left: auto;margin-right: auto;t-decoration: none;font-size: 16px;border-radius: 50px;/* font-weight: bold; */background: #3e567c;color: #ffffff;}

#index-pdt .contain span{

    color: #747474;

    font-size: 16px;

    font-weight: bold;

    word-break: break-all;

    padding: 0 25px;

    display: inline-block;

}

#index-pdt .contain a:hover{ /*text-decoration:underline;*/ }

#index-pdt .item{margin: 0 auto;/* padding: 10px 1vw; */margin: 10px 10px;max-width: 100%;max-height: 100%;height: 300px;overflow:hidden;display:flex;align-items:center;justify-content: center;/* -webkit-box-shadow: 0px 0px 10px #cccccc; *//* background:#ffffff; */}

#index-pdt .item img{max-width: 100%;max-height: 100%;cursor:pointer;border-radius: 30px;}

#index-pdt .pager{ text-align: right; max-width: 1370px; }



@media screen and (max-width: 1400px) {

	#index-pdt .pager{text-align: center;margin: 10px auto 10px auto;}

	#index-pdt .pager .btn1{ margin:0 0 0 0; }	

	#index-pdt .pager .btn1:after{ position:inherit; }

}



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Content <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/





/*最新消息*/

#inner-news{margin: 0px 0;padding: 30px 0 0 0px;text-align:center;}

#inner-news .news-list{width:100%;overflow:hidden;margin: 0 0 10px 0;text-align: left;padding: 0px 0px 10px 0;}

#inner-news .news-list{display:flex;flex-wrap:wrap;border-bottom: 1px dashed #c9c9c9;}

#inner-news .news-list .title{flex: 6;color: #28231c;font-size: 16px;line-height:22px;font-family: 'Noto Sans TC', sans-serif;display: flex;align-items:center;}

#inner-news .news-list .title a{ color:#28231c; line-height: 1.6; }

#inner-news .news-list .title a:hover{ text-decoration:underline; }

#inner-news .news-list .date{flex: 1;min-width: 170px;padding: 0 0px;font-size: 14px;display: flex;align-items: center;/* justify-content: center; */font-weight: bold;color: #3e567c;}

#inner-news .news-list .date span{position: relative;letter-spacing: 2px;padding: 0 15px 0 30px;}

/* #inner-news .news-list .date span:before{position: absolute;left: 5px;top: -30px;content:"‧";font-size:60px;color: #90c31f;} */

#inner-news .news-list .date span:before{position: absolute;top: -2px;left: 13px;content:url(../../images/dot-1.png);}

#inner-news .news-list .more{flex:1;padding:0 20px;min-width:150px;color: #143874;font-size: 14px;display: flex;align-items: flex-end;justify-content: center;}

#inner-news .news-list .more a{ color:#143874; }





@media screen and (max-width : 900px) {

	#inner-news .news-list .date{ justify-content: start; min-width: auto;}

	#inner-news .news-list .date span{ border:0; }

	#inner-news .news-list .title{flex:100%;padding: 10px 25px;}
    .container .wrap .layout-right{padding-left:  25px;padding-right: 25px;}

}



/*影音花絮*/

#inner-video{width:100%;overflow:hidden;margin: 30px auto 0 auto;}

#inner-video .video_area{width: 47.5%;margin: 20px 1%;display: inline-block;vertical-align: top;line-height: 25px;box-shadow: 1px 1px 5px #ebebeb;transition: transform 0.25s ease, box-shadow 0.25s ease;}

#inner-video .video_area:hover{transform: translateY(-6px);box-shadow: 0 16px 36px rgba(44, 62, 107, 0.15);}

#inner-video .video_area .title{color:#000000;/* font-weight:bold; */font-size: 16px;padding: 15px 0 15px 0;text-align: center;}

#inner-video .video_area .title a{ /*color:#000000; text-decoration:none;*/ }

#inner-video .video_area .title:before{/* content: url(../../images/dot-1.png); */vertical-align: 5%;padding-right: 5px;}



#inner-video .video-container {

	position: relative;

	padding-bottom: 56.25%;

	padding-top: 30px;

	height: 0;

	overflow: hidden;

	/* border-radius: 20px; */

}

#inner-video .video-container iframe, .video-container object, .video-container embed {

	position: absolute;

	top: 0;left: 0;

	width: 100%;

	height: 100%;

}



@media screen and (max-width : 768px) {

	#inner-video .video_area{width:100%;margin: 10px 0;}	

}





/*圖片連結*/

#inner-imglink{width:100%;overflow:hidden;margin: 30px auto 0 auto;}

#inner-imglink .imglink_area{width: 30.5%;margin: 20px 1%;display: inline-block;vertical-align: top;line-height: 25px;box-shadow: 1px 1px 5px #ebebeb;transition: transform 0.25s ease, box-shadow 0.25s ease;}

#inner-imglink .imglink_area:hover{transform: translateY(-6px);box-shadow: 0 16px 36px rgba(44, 62, 107, 0.15);}

#inner-imglink .imglink_area .imglink-container{width:100%;}

#inner-imglink .imglink_area .imglink-container img{width:100%;display:block;}

#inner-imglink .imglink_area .title{color:#000000;font-size: 16px;padding: 15px 0 15px 0;text-align: center;}

#inner-imglink .imglink_area .title a{color:#000000;text-decoration:none;}

#inner-imglink .imglink_area .title a:hover{text-decoration:underline;}



@media screen and (max-width : 710px) {

	#inner-imglink .imglink_area{width: 47.5%;}

}

@media screen and (max-width : 480px) {

	#inner-imglink .imglink_area{width: 100%; margin: 10px 0;}

}



/*圖片輪播*/

#inner-carousel{width: 100%;overflow: hidden;margin:30px 0 30px 0;}





/*下載與連結*/

#inner-download{margin: 0px 0;padding: 0px 0 0 0px;}

#inner-download .download-list{width:100%;overflow:hidden;display:flex;align-items:stretch;border-bottom: 1px solid #dde1e7;margin: 0px 0 15px 0;padding: 0;}

#inner-download .download-list .download-no{min-width:62px;width:62px;background:#e8ebef;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:bold;color:#2c3e6b;letter-spacing:2px;padding: 20px 8px;margin: 10px 0 10px 0;flex-shrink:0;}

#inner-download .download-list .download-icon{width:50px;display:flex;align-items:center;justify-content:center;font-size: 25px;color:#2c3e6b;padding:0 8px;flex-shrink:0;}

#inner-download .download-list .download-icon .icon-link{font-size: 18px;}

#inner-download .download-list .download-title{flex:1;display:flex;align-items:center;font-size:16px;color:#2c3e6b;padding:20px 10px 20px 4px;font-family:'Noto Sans TC',sans-serif;min-width:0;}

#inner-download .download-list .download-title a{color:#191919;text-decoration:none;word-break:break-word;}

#inner-download .download-list .download-title a:hover{text-decoration:underline;}

#inner-download .download-list .download-more{min-width:70px;display:flex;align-items:center;justify-content:flex-end;padding:20px 16px;flex-shrink:0;}

#inner-download .download-list .download-more a{color:#24344d;text-decoration:none;border-bottom:1px solid #24344d;padding-bottom:2px;white-space:nowrap;font-size:14px;}

#inner-download .download-list .download-more a::after{content:" \25BA";font-size:10px;}

#inner-download .download-list .download-more a:hover{color:#4a6fa5;border-bottom-color:#4a6fa5;}



@media screen and (max-width: 768px) {

	#inner-download .download-list .download-no{min-width:50px;width:50px;font-size:14px;letter-spacing:1px;padding:16px 6px;}

	#inner-download .download-list .download-icon{width:38px;font-size: 22px;}

	#inner-download .download-list .download-title{font-size:15px;padding:16px 8px 16px 4px;}

	#inner-download .download-list .download-more{min-width:60px;padding:16px 10px;}

}

@media screen and (max-width: 480px) {

	#inner-download .download-list .download-no{min-width:40px;width:40px;font-size:13px;letter-spacing:0;padding:14px 4px;}

	#inner-download .download-list .download-icon{width:32px;font-size:15px;}

	#inner-download .download-list .download-title{font-size:14px;padding:14px 6px 14px 2px;}

	#inner-download .download-list .download-more{min-width:50px;padding:14px 8px;}

	#inner-download .download-list .download-more a{font-size:12px;}

}



/*成員執掌*/

#inner-member{width:100%;overflow:hidden;margin: 30px auto 0 auto;}

#inner-member .member-list{display: flex;flex-wrap: wrap;align-items: stretch;margin: 20px 1%;vertical-align: top;line-height: 25px;/* border: 1px solid #bcbcbc; */padding: 20px 20px;box-shadow: 0 0px 6px rgb(0 0 0 / 15%);border-radius: 20px;}

#inner-member .member-list .caption{width:100%;overflow:hidden;font-size: 18px;font-weight: bold;border-bottom: 2px solid #879ab2;padding: 0 0 10px 0;margin: 0 0 20px 0;}

#inner-member .member-list .caption span{

    font-size: 12px;

    color: #b6b6b6;

    padding: 0 15px;

}

#inner-member .member-list .title-area{flex: 1;padding: 0 20px;text-align: center;}

#inner-member .member-list .title-area img{/* border: 1px solid #cccccc; */width:100%;max-width:175px;border-radius: 20px;}



#inner-member .member-list .info-area{

    flex: 3;

}

#inner-member .member-list .info-area .info{

    display: flex;

    align-items: stretch;

    /* justify-content: center; */

    border-bottom: 1px solid #c8c6b3;

}

#inner-member .member-list .info-area .info:last-child{ border:0; }

#inner-member .member-list .info-area .info .left{

    /* background: #f4f5ef; */

    min-width: 90px;

    flex: 1;

    color: #3e567c;

    font-size: 16px;

    padding: 5px 10px;

    display: flex;

    align-items:center;

    justify-content: center;

    text-wrap: nowrap;

}

#inner-member .member-list .info-area .info .left i{ width:26px;}

#inner-member .member-list .info-area .info .right{

    flex: 3;

    font-size: 16px;

    padding: 5px 10px;

    word-break:break-all;

    display: flex;

    align-items:center;

    /* justify-content: center; */

}



@media screen and (max-width : 1200px){

	#inner-member .member-list{ width:98%; }

}



@media screen and (max-width : 480px){

	#inner-member .member-list{ display:block; }

	#inner-teacher .member-list{width: 98%;}

	#inner-teacher .member-list .title-area{display:block;text-align: center;}

}





/*中心成員*/

#inner-teacher{width:100%;overflow:hidden;margin: 30px auto 0 auto;}

#inner-teacher .teacher-list{width: 30.5%;margin: 20px 1%;display: inline-block;vertical-align: top;line-height: 25px;/* border: 1px solid #bcbcbc; */padding: 20px 0px;/* box-shadow: 0 0px 6px rgb(0 0 0 / 25%); */}

#inner-teacher .teacher-list .title-area{text-align: center;/* display: flex; */align-items:center;justify-content: center;}

#inner-teacher .teacher-list .title-area .left{

    flex: 1;

}

#inner-teacher .teacher-list .title-area .left img{

	width:100%;

	/*border: 1px solid #cccccc;*/

	/* max-width: 220px; */

	width: 220px;

	height: 220px;

	object-fit: cover;

	object-position: top;

	border-radius: 50%;

	border-radius: 140px;

	border: 1px solid #ebebeb;

}

#inner-teacher .teacher-list .title-area .right{

    flex: 1;

    color: #010101;

    font-size: 20px;

    padding: 20px 0 10px 0;

}

#inner-teacher .teacher-list .title-area .right span{

    font-size: 16px;

}

#inner-teacher .teacher-list .title-area .right p{

    font-size: 14px;

    color: #2a2a2a;

    display: block;

    max-width: 130px;

    text-align: center;

    padding: 5px 10px;

    margin: 15px auto 10px auto;

    /* min-height: 36px; */

    background: #f9ede4;

}

#inner-teacher .teacher-list .info-area{

    /* border-top: 2px solid #90c31f; */

    margin-top: 5px;

}

#inner-teacher .teacher-list .info-area .info{

    display: flex;

    align-items: stretch;

    /* justify-content: center; */

    /* border-bottom: 1px solid #c8c6b3; */

}

#inner-teacher .teacher-list .info-area .info:last-child{ border:0; }

#inner-teacher .teacher-list .info-area .info .left{

    /* background: #f4f5ef; */

    color: #3e567c;

    min-width: 60px;

    flex: 1;

    font-size: 14px;

    padding: 0px 5px;

    display: flex;

    align-items:center;

    /* justify-content: center; */

}

#inner-teacher .teacher-list .info-area .info .left i{ width:26px; }

#inner-teacher .teacher-list .info-area .info .right{

    flex: 3;

    font-size: 14px;

    padding: 5px 0px;

    word-break:break-all;

}



@media screen and (max-width : 1200px){



	#inner-teacher .teacher-list{width: 46.5%;}

}





@media screen and (max-width : 480px){





	#inner-teacher .teacher-list{width: 98%;}

	#inner-teacher .teacher-list .title-area{display:block;text-align: center;}

}



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Sitemap <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



#sitemap-area{ max-width:1200px; width:100%; overflow:hidden; margin:30px auto; }

#sitemap-area .sitemap-list{display: inline-block;vertical-align: top;width: 22.5%;margin: 0 1% 40px 1%;min-height:300px;overflow:hidden;}

#sitemap-area .title{width:100%;padding: 10px 0px;color: #3d3d3d;font-size:20px;font-family: 'Noto Sans TC', sans-serif;font-weight: bold;border-bottom: 5px solid #879ab2;display: flex;align-items:center;/* justify-content: center; */}

#sitemap-area .title span{

    font-size: 36px;

    font-weight: normal;

    color: #ffffff;

    background: #879ab2;

    padding: 7px 10px 15px 18px;

    margin: 0 20px 0 0;

    border-radius: 50px;

}

#sitemap-area .list{position: relative;clear:both;border-bottom: 1px dashed #cccccc;color: #879ab2;font-size:16px;letter-spacing:1px;margin:0 20px;padding: 17px 10px;}

#sitemap-area .list.type-2{

    padding-left: 30px;

}

#sitemap-area .list.type-1:before{ content:"●"; }

#sitemap-area .list.type-2:before{content:"○";left: 30px !important;}

#sitemap-area .list.type-1:before , #sitemap-area .list.type-2:before{position: absolute;left: 8px;top: 20px;padding-right: 5px;font-size:12px;}

#sitemap-area .list a{display: inline-block;line-height: 20px;color: #3d3d3d;font-weight: bold;text-decoration:none;padding-left: 20px;}

#sitemap-area .list a:hover{ color:#3e567c; }

#sitemap-area .list:first-child{ border:0; }

#sitemap-area .list.sub{border:0;padding: 15px 35px;}

#sitemap-area .list.sub:before{font-family: "Font Awesome 5 Free";font-weight: 900;content: "\f1ce";padding-right: 10px; font-size:14px; }





@media screen and (max-width : 1023px) {	

	#sitemap-area .sitemap-list{ width:47%; }

	

}

@media screen and (max-width : 720px) {

 	#sitemap-area .sitemap-list{ width:98%; }

}





/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> News <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/





/*檔案與連結*/

.download-list{width:100%;overflow:hidden;padding: 15px 20px 15px 20px;box-sizing:border-box;margin:5px 0;border-bottom: 1px dotted #e0e0e0;}

.download-list .down-left{float:left;font-size: 18px;max-width: 30px;width: 10%;color: #c1a263;}

.download-list .down-left img{ vertical-align:-15%; width:20px; }

.download-list .down-right{float:left;width: 90%;}

.download-list .down-right a{color: #000000;font-size:15px;text-decoration:none;}

.download-list .down-right a:hover{ color:#90c31f; }



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Contact <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



/*聯絡我們*/

#index-contact{width:100%;max-width: 1300px;margin: 0 auto;min-height:190px;padding: 30px 0px;overflow:hidden;/* background:url(../../images/contact-bg.png) no-repeat top center; */}

#index-contact .contact-form{/*display:flex;*/}

#index-contact .contact-form > .left{flex:1;padding: 0 15px;}

#index-contact .contact-form > .right{flex:1;padding: 0 15px;}



#contact_info{ position:relative; max-width:1200px; overflow:hidden; }

#contact_info .contact_info_left{float:left;width: 50%;margin: 20px 0 30px 0;}

#contact_info .contact_info_right{/* float:left; *//* max-width:400px; *//* width: 50%; */font-size:15px;padding: 10px 0 0 10px;box-sizing: border-box;letter-spacing:1px;color:#4f4f4f;line-height:30px;}



#contact_info .slogan{ background:url(../../images/about_line.png) top center no-repeat; padding:90px 0 0 0; position:absolute; top:0; right:0; }

.contact_info_btitle{ width:100%; border-bottom:1px solid #6d6b64; }

.contact_info_area{width:100%;overflow:hidden;line-height:25px;padding: 5px 0;/* border-bottom:1px dashed #a7a7a4; */}

.contact_info_title{float:left;width:15%;color: #d7935b;/* background:#c6e0a8; */text-align:center;margin:0 5% 0 0;padding:0 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;text-wrap: nowrap;}

.contact_info_content{ float:left; width:70%; }



/*聯絡我們表單*/

.contact-form .input-item{width:100%;display: flex;align-items:center;justify-content: center;background:#ffffff;margin: 25px 0;padding: 0px 10px 0px 10px;border:1px solid #cecece;transition: all 0.5s ease;line-height: 25px;}

.contact-form .input-item:hover{border:1px solid #ebdfc7; border-left:5px solid #ebdfc7;}

.contact-form .input-item .left{flex:1.5;color: #000000;font-size: 16px;letter-spacing: 1px;}

.contact-form .input-item .left span{ color:#cb333e; width:13px; display:inline-block; }

.contact-form .input-item .right{flex: 3.5;padding: 0 0px;border-left: 1px solid #d5d5d5;}

.contact-form .input-item .right input{width:100%;font-size:16px;border:0;padding: 10px 10px 10px 10px;background:transparent;outline: 0;}

.contact-form .input-item .right select{width:90%;font-size:16px;border:0;padding: 10px 10px 10px 10px;background:transparent;outline: 0;}

.contact-form .input-item .right textarea{width:100%;padding:10px;font-size:16px;height: 175px;border:0;background:transparent;resize:none;outline: 0;}

.contact-form .input-item .right .rand-img{position:absolute;right: 10px;top: 8px;cursor:pointer;}

.contact-form .pager .btn-1:before{ left:10px; }

.contact-form .pager{ text-align:right; }



#contact-info{ background:url(../../images/contact-bg.png) no-repeat; }

#contact-info .wrap{min-height:600px;display:flex; justify-content: space-between; flex-wrap:wrap; }

#contact-info .left{width:40%; padding:10px; }

#contact-info .left .css-table{ padding:10px; }

#contact-info .left .css-td:first-child{width: 20px; color:#71c6b2; }

#contact-info .left .css-td:nth-child(2){ width:40px; }

#contact-info .left .css-td{width:30px;padding: 15px 0;font-size: 16px;border-bottom: 1px dotted #cccccc;}

#contact-info .right{width:50%; padding:10px; }

#contact-info .right .map{width:100%;color:#385170;font-size:16px;display: flex;justify-content: flex-end;}

#contact-info .right .map .iframe{width:100%;/* max-width:500px; */height:400px;border:0;}





@media screen and (max-width : 1200px) {

	#contact-info .left{ flex:1; width:auto; }

	#contact-info .right{ flex:1; width:auto; }	

}

@media screen and (max-width : 1024px) {

	#contact-info .wrap{ display:block; }

	#index-contact .contact-form{padding-top: 0px;}

	.contact-form .input-item .left{ flex:2; }

}

@media screen and (max-width : 768px) {

	#index-contact { min-height: 180px; }

	#index-contact .contact-form{ display:block; }

	.contact-form .input-item .right{ flex:3; }

	.contact-form .input-item .left{ flex:1; }



	#contact_info .contact_info_left { float: none; width: 100%; }

    #contact_info .contact_info_right { padding: 0px; width: 100%; }

	

}

@media screen and (max-width : 480px) {

	#contact-info .left .css-td:nth-child(2){ display:none; }

	.contact-form .input-item .right{ flex:1.5; }	

}





/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Mobile Menu <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/





body { transition: background-color .2s; }

#wrapper { transition: margin-left .2s; }

.sidenav { display:flex; flex-direction: column; height: 100%;overflow:hidden;width: 0;position: fixed;z-index: 9999;top: 0;right: 0;background-color: rgba(255, 255, 255, 1);overflow-x: hidden;transition: 0.2s;/*padding-top: 60px;*/box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}

.sidenav .closebtn {font-size: 25px;position: absolute;top: 25px;right: 10px;color: #3e567c;}

.sidenav .head {width:100%;position: relative;overflow:hidden;/* text-align: center; */padding: 15px 0 15px 5px;border-top: 3px solid #3e567c;border-bottom: 1px solid #ebebeb;background: #ffffff;}

.sidenav .head img{max-width: 120px;}



.sidenav .menu-top{ }

.sidenav .menu-bottom{width: 100%;height: 100%;background: #ebebeb;padding: 20px 0 10px 0;display: flex;align-items: flex-end;justify-content: center;}

.sidenav .menu-bottom .search{padding:10px 20px;}

.sidenav .menu-bottom .search .items{

    margin: 20px 0;

    display:flex;

}

.sidenav .menu-bottom .search .items .lefter{

	flex: 1;

	width: 80px;

	font-size: 16px;

	color: #3c3c3c;

	display: flex;

	align-items:center;

	justify-content: center;

}

.sidenav .menu-bottom .search .items .lefter i{color: #0557A1;padding-right:8px;}

.sidenav .menu-bottom .search .items .righter{flex: 1;padding: 0 0 0 10px;}

.sidenav .menu-bottom .search .items .righter .search-items{ display:flex;}

.sidenav .menu-bottom .search .items .righter .search-items .input{flex: 1;}

.sidenav .menu-bottom .search .items .righter .search-items .input input[type="text"]{border:0;outline: 0;max-width: 100px;padding: 15px;-webkit-border-top-left-radius: 20px;-webkit-border-bottom-left-radius: 20px;-moz-border-radius-topleft: 20px;-moz-border-radius-bottomleft: 20px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;}

.sidenav .menu-bottom .search .items .righter .search-items .button{flex:1;background: #0557A1;color: #ffffff;padding: 15px 20px;-webkit-border-top-right-radius: 20px;-webkit-border-bottom-right-radius: 20px;-moz-border-radius-topright: 20px;-moz-border-radius-bottomright: 20px;border-top-right-radius: 20px;border-bottom-right-radius: 20px;}



.sidenav .menu-bottom .community{padding: 10px 5px;text-align: center;}

.sidenav .menu-bottom .copyright a{color: #939797;text-decoration:none;}

.sidenav .menu-bottom .copyright a:hover{ text-decoration:underline; }





@media screen and (max-height: 450px) {

 .sidenav {padding-top: 15px;}

 .sidenav a {font-size: 18px;}

}

/*選單 - 選項*/

#ajax-sidenav > div {position:relative;width: 100%;/*border-left: 5px solid #3e567c;*/border-bottom: 1px solid #ffffff;color: #000000;padding: 15px 25px;line-height:20px;box-sizing:border-box;cursor: pointer;cursor: hand;font-size: 14px;}

#ajax-sidenav > div:before {/*content:url(../../images/header-icon.png);vertical-align:0; padding-right:10px;color: #000000;*/}



#ajax-sidenav > div i {position:absolute;right: 15px;top: 17px;}

#ajax-sidenav > div.title { background: #b19bb5; color: #ffffff; }

#ajax-sidenav > div:hover { /*color:#57708e;*/ }

/* 勿套用到雙語標題 span，否則中英文會被拉到右上角重疊 */
#ajax-sidenav > div span:not(.menu-title-zh):not(.menu-title-en) { position:absolute; right:0; top: 0; display:block; padding: 15px 20px; border-left: 1px solid #ebebeb;/* border-right: 1px solid #ebebeb; */ }

#ajax-sidenav > div.nav {background:#ECECEC;border-bottom: 1px solid #CDCDCD;color: #3e567c;}

#ajax-sidenav > div.nav:before { content:""; padding-right:0px; }

#ajax-sidenav > div img { vertical-align:middle; padding-right:8px; }

/* 手機側選單：中文＋英文（title_en） */
#ajax-sidenav a.menu-link-bilingual .menu-title-zh,
#ajax-sidenav a.menu-link-bilingual .menu-title-en { position: static; left: auto; right: auto; top: auto; padding: 0; border: 0; }

#ajax-sidenav > div.jq-submenu:not(.srh):not(.nav) { display: flex; align-items: center; flex-wrap: nowrap; background: #e8e9ec; }
#ajax-sidenav > div.jq-submenu:not(.srh):not(.nav) > a.menu-link-bilingual { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 auto; min-width: 0; line-height: 1.35; padding-right: 36px; box-sizing: border-box; text-decoration: none; }
#ajax-sidenav .menu-title-zh { color: #000000; font-weight: normal; }
#ajax-sidenav .menu-title-en { display: block; font-size: 11px; color: #8494ae; font-weight: normal; letter-spacing: 0.5px; margin-top: 3px; line-height: 1.2; }

.submenu-nav .jq-submenu { display: flex; align-items: center; flex-wrap: nowrap; }
.submenu-nav .jq-submenu > a.menu-link-bilingual {display: flex;flex-direction: column;align-items: flex-start;flex: 1 1 auto;min-width: 0;line-height: 1.35;/* padding-right: 36px; */box-sizing: border-box;text-decoration: none;}
.submenu-nav .menu-title-zh { color: #000000; font-weight: normal; }
.submenu-nav .menu-title-en { font-size: 11px; color: #8494ae; font-weight: normal; letter-spacing: 0.5px; margin-top: 2px; line-height: 1.2; }

#ajax-sidenav > div.jq-submenu > i { top: 50%; transform: translateY(-50%); margin-top: 0;}
#ajax-sidenav > div.jq-submenu.nav > i { transform: translateY(0); }
#ajax-sidenav > div.jq-submenu:not(.nav) > i {width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 100%; }

.submenu-nav div i { top: 50% !important; transform: translateY(-50%); margin-top: 0 !important; }

.submenu-nav { width: 100%; overflow:hidden; display:none; background-color: #FFFFFF; }

.submenu-nav div {position:relative;font-size: 14px;background: #ffffff;line-height: 20px;border-bottom: 1px solid #ebebeb!important;padding: 18px 30px 18px 55px !important;cursor:pointer;}

.submenu-nav div:before{position: absolute;left: 30px;top: 20px;font-family: "Font Awesome 5 Free";font-weight: 900;content: "\f111";color: #e2e2e2;padding-right: 8px;}

.submenu-nav div a{font-size: 14px;color: #000000 !important;}

.submenu-nav div i{position:absolute;top:20px;right: 16px;color: #000000;}

.submenu-nav.layer3 div{padding: 18px 10px 18px 80px !important;}

.submenu-nav.layer3 div:before{position: absolute;left: 55px;top: 20px;font-family: "Font Awesome 5 Free";font-weight: 100;content: "\f111";color: #e2e2e2;padding-right: 8px;}





.submenu2{background:#ebebeb !important;border-left: 5px solid #9B7354;}

.submenu3{background:#f5f5f5 !important;border-left: 5px solid #9B7354;}



.copyright{text-align: center;color: #939797;line-height: 18px;padding: 20px 10px;}



@media screen and (max-height: 450px) {

 .sidenav { padding-top: 15px;}



 .sidenav a { font-size: 18px;}

}



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Menu Search <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



.jq-submenu.srh{position:relative;padding:0 !important;}

.jq-submenu.srh .srh-btn{position:absolute;right: 30px;top: 20px;}

.jq-submenu.srh input[type="text"]{

	/* max-width:218px; */

	background: #F2f2f2;



	-webkit-appearance: none;

	border-radius: 0;

	width: 100%;

	height: 50px;

	border:0;

	font-size: 14px;

	padding: 0 50px 0 25px;



	box-sizing: border-box;

	letter-spacing:1px;



	color:#333;

	outline:0;

}



.jq-submenu.nav{ border-left:0 !important; }

.jq-submenu.nav i{ position:initial !important; padding-right:8px; }



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Bxslider <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



ul.bxslider { margin:0; padding:0; }

#home_banner {display: inline-block;width: 100%;overflow: hidden;position: relative;background:#f3f8fb;}





#home_banner ul{ list-style:none; }

#home_banner li { width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center;}
#home_banner li img { height: 100%; object-fit: cover; } 
#home_banner .bxslider { opacity: 0; }

#home_banner .bx-wrapper .bx-pager.bx-default-pager a:hover, #home_banner .bx-wrapper .bx-pager.bx-default-pager a.active {background: #879ab2;/* border: 1px solid #ffffff; */}

#home_banner .bx-wrapper .bx-pager.bx-default-pager a {background-color: white;/* border: 1px solid #2d2727; */width: 13px;height: 13px;margin: 0 5px;border-radius: 50%;box-shadow:2px 2px 8px rgba(15%,15%,40%,0.1);}

#home_banner .bx-wrapper .bx-pager { bottom: 32px; opacity: 1; }

#home_banner .bx-wrapper .bx-controls-direction{ opacity: 0; }

#home_banner .word { font-size: 15px; position: absolute; margin-left: -187px; margin-top: -116px; left: 50%; top: 50%; color: #673D3A; letter-spacing: 25px; opacity: 0.2; }

#home_banner .word b { font-weight: bold; }

#home_banner .down { position: absolute; right: 30px; bottom: 32px; width: 34px; height: 28px; z-index: 99; cursor: pointer; opacity: 0; }

#home_banner .down img { display: block; }

#home_banner .bx-prev{ left:5%; }

#home_banner .bx-next{ right:5%; }

#home_banner .bx-next:hover , #home_banner .bx-prev:hover{ opacity:.8; }



/* line 84, scss/_header.scss */

.headerTitleContainer {

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  z-index: 2;

  display: flex;

    justify-content: center;

    align-items: center;

    height: 100%;

  /*

  @media only screen and (max-width: 640px), screen and (max-height: 900px) {     

  	.headline {

  		margin: 13rem auto 0 auto;

  	}

  }

  @media only screen and (min-width: 641px) and (max-width: 768px) {

  	.headline {

  		margin: 10rem auto 0 auto;

  	}

  }

  */

}

/* line 90, scss/_header.scss */

.headerTitleContainer .headline {

  text-align: center;

  /*margin: 15rem auto 0 auto;*/

  margin: 0 auto;

  width: 100%;

  max-width: 600px;

  color: #ffffff;

  /* background: #ebebeb; */

  /* border-bottom: 1px solid #ffffff; */

  background-color: rgba(33, 33, 33, 0.6);

  padding: 10px 20px 10px 20px;

}



.headerTitleContainer a{ 

  text-decoration:none;

}



.headerTitleContainer .headline h2{

    padding: 0px 0 0px 0;

    margin: 20px 0;

    font-size: 65px;

    letter-spacing: 10px;

    /*font-family: "標楷體", "KaiTi", sans-serif;*/

    font-weight: normal;

    text-shadow: 1px 1px 1px #9a9a9a;

    font-weight: bold;

}

.headerTitleContainer .headline p{

    letter-spacing: 2px;

    font-size: 24px;

    color: #F4D885;

    /*font-family: "標楷體", "KaiTi", sans-serif;*/

    /* font-weight: bold; */

}







/* line 96, scss/_header.scss */

.headerTitleContainer .button, .headerTitleContainer .headerButton {

  display: none;

}





@media screen and (max-width : 1024px) {

	

	#home_banner .bx-controls-direction

	{

		display:none;	

	}

	

	#home_banner .bx-wrapper .bx-pager.bx-default-pager a {

		 width: 15px;

		 height: 15px;

	}

	#home_banner, #home_banner li {

		/*max-height: 275px;

		height: 275px;

		margin-top: 75px;*/

	}

}



@media only screen and (max-width: 1024px) {

  /* line 104, scss/_header.scss */

  .headerTitleContainer .headline {

   /* margin: 7rem auto 0 auto;*/

   margin: 0 auto;

  }

  .headerTitleContainer .headline p{ font-size:19px; padding:1px 0; letter-spacing: 2px;}  

  .headerTitleContainer .headline h2{ letter-spacing: 3px;font-size: 22px;color: #F4D885; }



}

@media only screen and (min-width: 641px) and (max-width: 768px) {

  /* line 110, scss/_header.scss */

  .headerTitleContainer .headline {

    /*margin: 7rem auto 0 auto;*/

    margin: 0 auto;

  }

}



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Effect <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/







/*scroll progress bar*/

.KW_progressContainer {

  left:0;

  width: 100%;

  height: 0.6em;

  margin-bottom: 0px;

  position: fixed;

  top: 0px;

  overflow: hidden;

  background-color: #81a237;

  content: "";

  display: table;

  table-layout: fixed;

  z-index:999;

}



.KW_progressBar {

  width: 0%;

  float: left;

  height: 100%;

  z-index:99;

  max-width: 100%;

  background-color: #9cd420;

  -webkit-transition: width .6s ease;

  -o-transition: width .6s ease;

  transition: width .6s ease;

}



/*圖片放大*/

.zoom-in img {



	width: 100%;	

}





.zoom-in:hover img {

	transform: scale(1.1);

	transition: all 0.5s ease;

}





/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Common Animation <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



@keyframes widthGroup-1 {

    0% { width: 0; }

    60% { width: 70px; }	

    100%   { width: 60px; }

}





.scaleZoom {

	-webkit-animation: scaleZoom 2s ease both;

	animation: scaleZoom 2s ease both;

}

@-webkit-keyframes scaleZoom {

	from { opacity: 0; -webkit-transform: scale(1.2); }

}

@keyframes scaleZoom {

	from { opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2); }

}



.scaleZoom-2 {

	-webkit-animation: scaleZoom-2 2s ease both;

	animation: scaleZoom-2 2s ease both;

}

@-webkit-keyframes scaleZoom-2 {

	from { opacity: 0; -webkit-transform: scale(1.05); }

}

@keyframes scaleZoom-2 {

	from { opacity: 0; -webkit-transform: scale(1.05); transform: scale(1.05); }

}



/*------image mask--------*/

.photo-mask{opacity:0;position:absolute;left:0;bottom:0;color:#ffffff;width:100%;height:100%;background-color: rgba(155, 155, 155, 0.9);letter-spacing:3px;text-align:center;padding: 4vw;box-sizing:border-box;line-height:22px;-webkit-transition:.2s;-ms-transition:.2s;-moz-transition:.2s;}



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

.photo-mask-content span{color:#8dbb00 !important;font-weight:normal !important;font-size: 18px !important;}

.photo-mask .line{border:1px solid #FFFFFF;}

.gallery{ position:relative; }

.gallery .photo-mask{ opacity:0; cursor:pointer; }

.gallery:hover .photo-mask{ opacity:1; }

.gallery:hover .title{ opacity:0; }	

	



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Location <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



.Loadaction_Box { position:relative; height: 100%; width: 0%; position: fixed; overflow:auto; top: 0; left: 0; overflow:auto; background-color:rgba(0, 0, 0, 0.5); z-index:100000000 }

.Loadaction {width: 220px;height: 60px;top: 42%;position: absolute;margin-left: auto;margin-right: auto;padding-top: 10px;left: 0;right: 0;background-color:rgba(0, 0, 0, 0.5);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}

.Actionupload_Text {font-size:13px;color:#FFFFFF;height: 25px;}



/* ----------------------------------------------------------------------------------------------------------------*/

/* ---------------------------------->>> pagelink <<<--------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/





.pageselect{border:1px solid #CCCCCC;padding: 4px 5px;font-size:12px;}

.pageselect:hover{ background:#ebebeb; }

a.pagelink_no{color:#333333;text-decoration:none;border: 1px solid #cccccc;padding: 7px 5px;display: inline-block;margin: 5px 0;}

a.pagelink_no:hover{ background:#ebebeb; }

a.pagelink{color:#333333;text-decoration:none;border: 1px solid #CCCCCC;padding: 5px 10px;}

a.pagelink:hover{ background:#ebebeb; }

a.pagelink_ch{color:#333333;padding: 5px 10px;border: 1px solid #cccccc;background: #ebebeb;text-decoration:none;}



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Content <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



/*師資介紹*/

.member_list{width:100%;overflow:hidden;margin: 50px 0 20px 0;}

.member_list_left{width: 30%;margin: 0 4% 0 0;float:left;}

.member_list_left img{width:100%;margin-right: 5%;border:2px solid #eaeaea;max-width: 275px;border-radius: 35px;}

.member_list_center{width: 43%;margin: 0 5% 0 0;float:left;}

.member_list_center2{width: 65%;margin: 0 0 0 0;float:left;}

.member_list_right{ width:30%; float:left; padding:0 0; box-sizing:border-box; }

.member_title{color: #413c3c;font-size:20px;border-bottom: 5px solid #879ab2;padding: 40px 0 15px 0;}

.member_title:before{ /*content:url(../../images/teacher_title.png); vertical-align:middle; padding:0 10px 0 0;*/ }

.more_area{width:95%; text-align:right;}



.member{width:100%; overflow:hidden; margin:0 auto; line-height:40px; color:#2D2D2D; font-size:15px; letter-spacing:1px;}

.member_name{font-size:20px;color: #010101;/* font-weight:bold; */margin: 0 0 5px 0;/* border-bottom: 1px dashed #a7a7a4; */}

.member_name a{color: #000000;text-decoration: inherit;}

.member_name span{/* display:block; */margin: 0 20px;color: #009090;font-size: 16px;text-shadow:none;}

.member_info_area{width:100%;overflow:hidden;line-height:25px;padding: 7px 0 7px 0;border-bottom:1px dashed #a7a7a4;}

.member_info_title{float:left;width: 22%;/* height: 35px; */line-height: 35px;color: #3e567c;/* font-weight: bold; */}

.member_info_title i{ padding:0 10px 0 0; }

.member_info_content{float:left;width: 78%; line-height: 2;}

.member_info_content a{ color:#000000; text-decoration:underline; }

.member_info_content a:hover{ color:#90c31f; }

.member_info_content .form-input {border: 1px solid #b9b7b7;background: #f9f9f9;border-radius: 4px;width: 100%;height: 35px;padding: 5px 10px;box-sizing: border-box;color: #646464; outline: none;}



/*教師留校時間*/





.table-1 { border-collapse:collapse; }

.table-1 th,.table-1 td{ text-align:center;  border:1px solid #cccccc; }



@media screen and (max-width : 768px){

	.member_list_left{ float:none; text-align:center; margin:0 auto; width:60%; }

	.member_list_center, .member_list_center2{ width:100%; float:left }

	.member_list_right{ float:none; width:100%; }	

	.more_area{width:100%; text-align:center;}

	.member_info_title{ float:none; width:100%; }	

}



.form-input input[type="text"],input[type="password"]{border: 1px solid #b9b7b7;background: #f9f9f9;border-radius: 4px;margin:5px 0;width:100%;height:35px;padding:5px 10px;box-sizing:border-box;color: #000;outline: none;font-size: 14px;}

.form-input select{max-width:130px;width:100%;height:35px;border:1px solid #696868;padding:0 7px;outline:0;letter-spacing:1px;font-size:15px;font-family:"微軟正黑體";border: 1px solid #b9b7b7;background: #f9f9f9;border-radius: 4px;}

.form-input textarea {border: 1px solid #b9b7b7;background: #f9f9f9;border-radius: 4px;margin:5px 0;width:100%;height:100px;padding:5px 10px;box-sizing:border-box;color: #000;outline: none;font-size: 14px;}



/*活動花絮*/

.activity-square{ float:left; display: inline-block;width: 45%;margin:2%;vertical-align: top;}

.activity-square img{ width:100%; }

.activity-square .title{width:100%;overflow:hidden;padding: 10px 0;display: flex;}

.activity-square .title .left{width: 25%;float:left;line-height: 20px;border-right:1px solid #b9b9b9;padding: 0 10px;box-sizing:border-box;}

.activity-square .title .left table td{ color:#143874; text-align:center; height:20px; letter-spacing:1px; }

.activity-square .title .right{width: 75%;float:left;font-size:18px;line-height: 22px;color:#282828;font-weight:bold;letter-spacing:1px;padding: 0 0 0 15px;box-sizing:border-box;display: flex;align-items:center;/* justify-content: center; */}

.activity-square .title .right a{ color:#282828; text-decoration:none; }

.activity-square .content{ cursor:hand; cursor:pointer; width:100%;position: relative;overflow:hidden;min-height: 30px;color: #5c5c5c;font-size: 15px;line-height: 24px;letter-spacing: 1px;}

.activity-square .content a{position:absolute;display:inline-block;right: 0px;bottom: 0px;color:#d67e01;font-size:12px;text-decoration:none;}

.activity-square .content a:before{ content:url(../../images/news-icon1.png); letter-spacing:2px; padding-right:5px; }



.main-box{width:100%;overflow: hidden;/* border:1px solid #e6e5e5; *//* box-shadow: 1px 1px 5px #EBEBEB; */color:#0e0e0e;font-size:16px;margin: 7px 0;letter-spacing: 1px;box-sizing:border-box;align-items: center;/* justify-content: center; */}

.main-box .main-title{ width:100%; background:#143874; color:30px; color:#ffffff; font-size:30px; padding:15px 30px; box-sizing:border-box; }

.main-box .main-content{padding:30px;background: #ffffff;}

.main-box .main-content .end-line{width:100%;height:1px;margin: 0 0 20px 0;border-bottom:1px dotted #919191;}

.main-box .main-content .subtitle{font-size:20px;font-weight:bold;letter-spacing:1px;padding: 0 0 15px 0;color:#143874;}

.main-box .main-content .subtitle img{vertical-align: -30%;padding-right:7px;width:25px;}

.news-content{font-size: 16px;padding: 15px 0 25px 0;overflow:hidden;clear:both;letter-spacing:1px;line-height:30px;/* border-bottom:1px solid #d3d3d3; */}



@media screen and (max-width : 550px) {

	.news-square, .activity-square{ width:96%; margin:2%; }	

	.img-demo, .img-demo2 { height:auto; line-height:inherit; }

}



/* 教師 */

.teacher-table {

	min-height: 200px;

	margin: 30px 0;

}



.teacher-table table{

	line-height: 60px;

}



.teacher-table table .title{

	font-size: 16px;

	width: 150px;

}



#privacy_policy_hint {

	position: fixed;

	top: 40%;

	background: #000;

	width: 500px;

	color: #fff;

	font-size: 20px;

	line-height: 34px;

	padding: 15px 10px;

	max-width: 100%;

}

#privacy_policy_hint .link {

	color: #90c31f;

	text-decoration: underline;

}

#privacy_policy_hint .btn_area {

	text-align: center;

	margin: 15px 0 0 0;

}

#privacy_policy_hint .btn {

	background: #90c31f;

	color: #fff;

	font-size: 20px;

	padding: 10px 15px;

	border-radius: 5px;

	cursor: pointer;



}

.max-h-527{max-height: 527px !important;}

.radius-20{border-radius: 20px !important;}

table.table-list {  border-spacing: 0px;

    border-collapse: separate;}



table.table-list tr td{

    padding: 10px 0;

    border-bottom: 1px solid #ccc;

    font-weight: bold;

}





#index-album .items div{

    max-height: 248px;

}



.table-teacher .line{border-bottom:2px #879ab2 solid;}

.table-teacher				        {border:2px #879ab2 solid;}

.table-teacher	td,

.table-teacher th			        {padding:6px 10px; color:#000; font-size:13px;}

.table-teacher th			        {text-align:center;background:#ddebe6;}

.table-teacher td.lasttd	        {}

.table-teacher thead               {border-bottom:1px #999 solid;}

.table-teacher thead th,

.table-teacher thead td	        {color:#000;  text-align:center; font-weight: bold;}

.table-teacher thead th	        {text-align:left;}

.table-teacher tbody th,

.table-teacher tbody td	        {}

.table-teacher tbody th	        {text-align:left;}

.table-teacher tbody tr.even th,

.table-teacher tbody tr.even td	{background:#f8f8f8;}





@media screen and (max-width : 768px) {

    #home_banner .bx-default-pager{ display:none; }

}









/*博士*/



/* === 表單基礎 === */

.form_area { margin-bottom: 50px; }

.form_area.form-input input[type="text"] { border: 0; background: unset; border-radius: 4px; font-size: 16px; margin: 0; }



.form_area.form-input input[type="text"],.form_area.form-input input[type="password"],.form_area.form-input textarea{ border: 0;background: unset; border-radius: 4px;font-size:16px;margin:0;}

.form_area .input_area { position: relative; border:1px solid #ced4da; border-radius: 5px; margin-bottom:10px; padding:5px 10px 0px 10px;font-size:16px; min-height: 90px;}







/* === input_area：文字輸入欄位 === */

.input_area {

    position: relative;

    border: 1px solid #ced4da;

    border-radius: 5px;

    margin-bottom: 10px;

    font-size: 16px;

    height: 60px;

}



.form_area.form-input label, .input_area fieldset legend {

    position: absolute;

    left: 10px;

    font-size: 14px;

    font-weight: 600;

    z-index: 1;

    padding: 10px;

    pointer-events: none;

    line-height: 1.3;

}



.input_area label .tip {

    pointer-events: auto;

}



.input_area input[type="text"],.input_area input[type="password"] {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    padding-top: 35px;

    padding-left: 20px;

    box-sizing: border-box;

}



.input_area.input_area--textarea {

    height: unset;

    min-height: 60px;

    padding-bottom: 8px;

}



.input_area.input_area--textarea textarea {

    position: relative;

    width: 100%;

    padding: 0 10px;

    box-sizing: border-box;

    resize: vertical;

    border: none;

    background: transparent;

    outline: none;

    font-size: 16px;

    color: #000;

    margin-top:40px;

    

}



.input_area:focus-within {

    border-color: #000;

    box-shadow: 0 0 0 1px rgb(0, 0, 0);

}



.input_area.required > label:first-of-type::before,

.input_area.required fieldset legend::before {

    content: "* ";

    color: red;

}



.input_area.required label.container-form::before {

    content: none;

}



/* === fieldset / radio === */

.input_area fieldset {

    border: none;

    margin: 0;

    padding: 0;

}



.input_area:has(fieldset) {

    height: auto;

    padding: 10px 0;

}



.input_area fieldset legend {

    position: static;

    margin-bottom: 8px;

    padding: 10px 10px 0;

    color: #333;

}



.input_area fieldset .container-form {

    position: static;

    display: inline-flex;

    align-items: center;

    gap: 4px;

    margin-right: 16px;

    cursor: pointer;

    pointer-events: auto;

}



.input_area fieldset .container-form span.en_css2 {

    display: inline;

    margin: 0;

    font-size: 11px;

    color: #888;

}



/* === select_area：下拉選單專用區塊 === */

.select_area {

    margin-top: 20px;

    margin-bottom: 20px;

}



.form_area.form-input .select_area > label {

    position: static;

    display: block;

    font-size: 15px;

    pointer-events: auto;

    padding: 0 0 10px 2px;

    color: #333;

}



.select_area.required > label::before {

    content: "* ";

    color: red;

}



.select_area-inputs {

    display: flex;

    font-size: 16px;

    align-items: center;

    gap: 10px;

}



.select_area-inputs select {

    flex: 1;

    padding: 6px 8px;

    border: 1px solid #ced4da;

    border-radius: 4px;

    font-size: 15px;

}



/* === captcha-row：驗證碼列 === */

.captcha-row {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 20px;

}



.max-w-290 { width: 290px; max-width: 290px; flex-shrink: 0; }



/* === terms：條款與送出 === */

.form_area .terms { text-align: center; font-size: 16px; }

.form_area .terms div { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 0; line-height: 20px; }

.form_area .terms div a { color: #9e2138; }

.form_area .terms div a:hover { text-decoration: underline; }

.form_area.form-input .terms label { position: static; pointer-events: auto; font-size: inherit; padding: 0; }



/* === 共用 === */

.en { margin-left: 3px; font-size: 13px; letter-spacing: 0px; }

.info-content{font-size:16px;padding:10px 0 25px 0;line-height: 1.7;}





.close-status{margin-top:30px;margin-bottom:60px;width: 100%;

    flex-direction: column;

background: #f2f2f2;

min-height: 110px;

display: flex;

align-items: center;

justify-content: center;}

.close-status h3{

    margin: 10px auto;

}



.input_area.disabled{

    border: 1px solid #f1f1f1;

    background: #fbfbfb;

}

.input_area .text{

    margin: 45px 10px 10px 10px;

    line-height: 1.2;

    font-size:15px

}

.input_area fieldset .text{

    margin: 10px 10px;

}



.subtitle{

    font-size: 18px;

    font-weight: bold;

    color: #3e567c;

    line-height: 2.5;

}



.ckbox-open{

    display: flex;

    align-items: center;

    justify-content: flex-start;

    margin-top: 8px;

    /* margin-left: 160px; */

    position: absolute;

    right: 20px;

    float: right;

    

    flex-direction: row;

    z-index: 1;

    pointer-events: auto;

    font-size:14px;

    top:6px;

}

.form_area.form-input .ckbox-open label,

.ckbox-open label,

label:has(input[type="checkbox"]) {

    position: static;

    pointer-events: auto;

    cursor: pointer;

    z-index: auto;

    padding: 0;

    font-size: inherit;

}

label:has(input[type="checkbox"]) input[type="checkbox"] {

    pointer-events: auto;

}

.ckbox-open input[type="checkbox"] {

    position: relative;

    z-index: 1;

    cursor: pointer;

}



.file_list{

    margin-top:55px;

    margin-left:10px;

}

#add_table1 td,#add_table2 td{padding:10px;}



.work-exp-row{

    border-bottom: 1px dashed #ced4da;

    padding: 10px 10px 0;

    margin-bottom: 15px;

    padding-bottom: 15px;

}

.btn-2.black{background:#333;}

.work_select{height:35px;border:1px solid #b9b7b7;border-radius:4px;padding:0 5px;}



.file_list a{

    color: #3e567c;

    text-decoration: underline;

}

.file_list a > i{

    color: #3e567c;

    text-decoration: none;

    margin-left:10px;

}

.work-exp-row:last-child {

    border: 0;

}



table.searchForm {

    margin:0px 0 30px 0;

   

}

table.searchForm  td,table.zebra td{

    font-size:16px;

    line-height: 2.6;

    padding:0px 0px;

}



table.zebra th{

    font-size:15px;

    line-height: 2.6;

    padding:0px 0px;

    text-align: center;

    text-shadow: 0 1px 0 rgba(255, 255, 255, .5);

    border-bottom: 1px solid #ccc;

    background-color: #eee;

}



/* ----------------------------------------------------------------------------------------------------------------*/

/* ------------------------------>>> Table <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/



.zebra td, 

.zebra th {

  padding: 10px;

  font-size: 16px;

  /*border-bottom: 1px solid #f2f2f2;*/

}

/*使用:nth-child(even)给表格的奇数行添加背景和阴影效果*/

.zebra .alternate,

.zebra tr:nth-child(even) {

  background: #f5f5f5;

  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;

}

.zebra th {

  text-align: center;

  font-size: 16px;

  text-shadow: 0 1px 0 rgba(255,255,255,.5);

  border-bottom: 1px solid #ccc;

  background-color: #eee;

  background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#eee));

  background-image: -webkit-linear-gradient(top, #f5f5f5, #eee);

  background-image: -moz-linear-gradient(top, #f5f5f5, #eee);

  background-image: -ms-linear-gradient(top, #f5f5f5, #eee);

  background-image: -o-linear-gradient(top, #f5f5f5, #eee);

  background-image: linear-gradient(top, #f5f5f5, #eee);

  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#f5f5f5, endColorstr=#eeeeee);

  -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#f5f5f5, endColorstr=#eeeeee)";

}

/*使用 :first-child设置表格表头第一个单元格左上角为圆角*/

.zebra th:first-child {

  border-radius: 6px 0 0 0;

}

/*使用 :last-child设置表格表头最后一个单元格右上角为圆角*/

.zebra th:last-child {

  border-radius: 0 6px 0 0;

}



.zebra a{color: #2258c5;}



@media screen and (max-width : 768px) {

	.visible-no-m{ display:none !important;  }

}

@media screen and (max-width : 480px) {



	.visible-no-s{ display:none; }

}

.text-ellipsis-2 {

    display: -webkit-box !important;

    -webkit-line-clamp: 2; /* 顯示 2 行 */

    -webkit-box-orient: vertical;

    overflow: hidden;

    text-overflow: ellipsis;

    word-wrap: break-word;

    word-break: break-word;

  }

  @media (max-width:768px){
    .btn-bar .btn-2{display:inline;width:100% !important;margin-bottom:0px;}
}