@charset "utf-8";

 :root{
     --logo:#0069b3;
     --logotext:#3e3a39;
     --color:#377746;
     --color:#2e7978;
     --color:#9648a4;
     --color:#1f87a9;
     --color:#ffa400;

     --menu1_fontsize: 1.115rem;
     --menu2_fontsize: 0.9rem;
     --all_fontsize: 1rem;
 }
/* CSS Document */

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

body{font-family:'Noto Sans TC','微軟正黑體',sans-serif;font-size:16px;line-height:1.5;color:#333;background: url(../images/all/allbackground.jpg);position: relative;}
a{color:#000;text-decoration:none}
a:hover{color:#777;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.boxlist__layer:hover {background: #e0f3ff;}
*{ backface-visibility: hidden; -wetkit-backface-visibility: hidden;}

/*---------------------- 基礎設定 ----------------------*/
/*反白設定
::selection { background: #666; color: #FFF; }
::-moz-selection { background: #666; color: #FFF; }
*/
.aleart_line{border-color: #d40023;}
.red{color: #d40023;}

/* 回頂端 */
#goTop{border:1px solid #CCC;color:#aaa;background:#FFF;text-align:center;position:fixed;bottom:20px;right:20px;width:50px;height:50px;line-height:50px;cursor:pointer;display:none;font-family:Verdana,Geneva,sans-serif;-moz-border-radius:100%;-webkit-border-radius:100%;border-radius:100%;-webkit-box-shadow:#EEE 0 0 5px;-moz-box-shadow:#EEE 0 0 5px;box-shadow:#EEE 0 0 5px}
#goTop:hover{background:#999;color:#FFF}

/*按鈕*/
.btnWrap {margin: 1rem 0 2rem;position: relative;display: flex;align-items: flex-end;justify-content: center;}
@media screen and (max-width: 640px) {
#goTop{width:100%;left:0;right:0;bottom:0;border-radius:0;border:0;border-top:1px solid #eee}
}

.btnStyle{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);position:relative;cursor:pointer;min-width:150px;padding:.75rem 1rem;text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;border-radius:3rem;border:solid 1px #666;font-size:.9rem;text-align:center}
.btnStyle:hover{background:#004ea2;color:#fff;border-color:transparent;letter-spacing:.75em}
.btnStyle::before{content:"";position:absolute;border:#004ea2 solid 0;top:0;right:0;bottom:0;left:0;-webkit-animation-duration:1s;animation-duration:1s;border-radius:3rem}
.btnStyle:hover::before{border:#004ea2 solid .5rem;-webkit-animation-name:hvr-ripple-out;animation-name:hvr-ripple-out}
@-webkit-keyframes hvr-ripple-out {
100%{top:-12px;right:-12px;bottom:-12px;left:-12px;opacity:0}
}
@keyframes hvr-ripple-out {
100%{top:-12px;right:-12px;bottom:-12px;left:-12px;opacity:0}
}

/*About_關於TIPA 主持人*/
.news-other{width:100%;position: relative;display:flex;flex-direction:row;align-items:center;align-content:center;}
.news-prev {
    position: absolute;
    left: 0;
}

.news-next {
    position: absolute;
    right: 0;
}
.news-prev a,.news-next a{display:flex;align-content:center;align-items:center}
span.news-more{width:50px;height:50px;line-height:48px;text-align:center;box-shadow:0 0 10px #ececec;border-radius:60px;margin-left:auto;background:#fff}
.news-title p{margin:0}
.news-prev:hover .news-more,.news-next:hover .news-more{background:#0069b3}
.news-prev:hover .news-more i,.news-next:hover .news-more i{color:#fff}
.news-title.mr-3 {text-align: right;}

.btn-style1:before, .btn-style1:after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;border: 1px solid #fb6e6e;transition: transform 0.3s, opacity 0.3s;}
.btn-style1 {position: relative;display: inline-block;padding: 10px 20px;letter-spacing: 1px;/* font-weight: 500; */text-shadow: 0 0 1px rgb(255 255 255 / 30%);z-index: 2;color: #fb6e6e;}
.btn-style1:hover:before {opacity: 0;transform: translateY(5px) translateX(-5px);}
.btn-style1:after {opacity: 0;border-color: #0069b3;background: #0069b3;transform: translateY(-7px) translateX(6px);z-index: -1;}
.btn-style1:hover:after {opacity: 1;transform: translateY(0px) translateX(0px);}
.btn-style1:hover {color: #f8f9fa;}
.btn-style2 {color: #ffc165;}
.btn-style2:before{border: 1px solid #ffc165;}
.btn-style3 {color: #b769c5;}
.btn-style3:before{border: 1px solid #b769c5;}



/*RWD編輯器表格(X捲軸)*/
.table-container td,.table-container th{min-width:100px;padding:10px;border:1px solid #ccc;white-space:inherit;font-family: Arial, Helvetica, sans-serif;font-size: .9rem;text-decoration: none;letter-spacing: .01em;color: #666666;}
.table-container td a:hover, .table-container th a:hover{text-decoration: underline}
.table-container p{margin-bottom:0}
.table-container p+p{margin-top:1rem}
@media screen and (max-width: 768px) {
.table-container{width:100%;overflow-y:auto;_overflow:auto;margin:0 0 1em}
}

/*---------------------- 頁面開始 ----------------------*/


/*--全頁佈局--*/
.wrapper {padding: 3em 0;}
.wrapper_page {padding: 5px 0;}
.container-fluid{max-width: 1680px;}
.container{max-width: 1320px;padding-right: 0;padding-left: 0;}


/*--首頁--*/

.banner{position: relative;}
.banner .item{position:relative}
.banner .item h4{margin:0;position:absolute;left:50%;bottom:50px;transform:translateX(-50%);color:#fff}
.banner .owl-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%)}
.index-pd{padding:50px 0}
.index-pd h2{text-align:center;margin-bottom:1.8em}
.index-pd .item{text-align:center}
footer{/* border-top: 1px solid#ccc; */background: #0069b3;/* color: #343a40; *//* padding: 2rem 0; */text-align:center;position: relative;margin-top: 3rem;}
footer ul{margin-bottom:10px;padding-left:0;list-style:none}
footer ul li{display:inline-block;padding:0 20px}
footer p {margin:5px 0;color: #fff;font-size: 1rem;}
footer a{color: #ffffff;}
footer a:hover{color: #ffa400;text-decoration:none;}
.footer__area {display: flex;padding: 1rem 0;}
.footer__logo {text-align: left;}
.footer__link {text-align: left;/* padding: 0 50px; *//* border-left: 1px solid #dddddd; */font-weight: 300;}
.footer__arealink a {position: relative;/* padding-right: 25px; */color: #ffffff;font-size: 1rem;/* font-weight: 500; */}
.link-after:after {content: "";background: #e2e2e2;padding: .1px;margin: 10px;}
.footer__arealink {position: relative;padding-bottom: 10px;/* margin-bottom: 1.5rem; */display: flex;align-items: center;justify-content: center;background: #004475;padding: 1rem;flex-wrap: wrap;}
.footer__contact {display: flex;flex-direction: column;font-size: 0.9rem;}
.telLink {display: flex;flex-direction: row;}
.footer_tel {margin-right: 20px;}
footer span{font-weight: 400;/* color: #ffffff; */}
.copyright {padding: 3rem 0 1rem 0;font-size: 0.9rem;color: #fff;}
/*--電子報 聯絡表單--*/
label {color: #2f2f2f;font-size: 1rem;font-weight: 400;margin-bottom: 5px;}
input#newsletter {padding: 7px;width: 100%;border-radius: 0;}
form {display: flex;align-items: center;/* width: 100%; */justify-content: flex-start;}
.from__contact {display: flex;align-items: center;/* width: 100%; */justify-content: flex-start;flex-wrap: wrap;}
.from__call {display: flex;align-items: center;}
.form-control {border-radius: 0;}
.form-group {padding: 0 5px;margin: 8px 0;}

/*--電子報btn按鈕--*/
form#form2 {display: flex;justify-content: center;flex-direction: row;flex-wrap: nowrap;margin: 0;}
.footer__form-group {width: 60%;display: block;padding: 0;}
.footer__form-group input {padding: 10px;border: 0;border: none;outline: none;width: 100%;}
.ft_form {display: block;position: relative;margin: 0 15px;}
.btn-all-01 {text-align: center;/* margin: 1rem 0; */width: 40%;padding: 0;}
.btn-all-01 .btn-01 {padding: 9px;/* border: 1px solid #ffffff; *//* color: #1b6aa5 !important; */display: inline-block;text-decoration: none;position: relative;cursor: pointer;background: #0069b3;display: block;}
.btn-all-01 .btn-01:hover {color: #fff !important;}
.btn-01 .btn-inner {/* padding: 0 12px; */position: relative;z-index: 1;font-size: 1.115rem;font-weight: 300;}
.btn-01 .btnbg-x {position: absolute;left: -1px;width: 0;top: -1px;bottom: -1px;transition: all 0.5s;}
.btn-all-01 .btn-02:hover .btnbg-x {width: calc(100% + 2px);background: #fd7e14;}



/*--hrader--*/
.navbar{padding: 0;display: flex;flex-direction: column;align-items: center;align-content: space-between;}
.bg-dark{background-color: #ffffff !important;}
.fixed-top{position:relative;transition: all 1s ease-out;background: url(../images/all/header_pic.jpg) no-repeat;background-size: cover;background-position: left;}

.navbar--fixed {position: fixed;top: 0;right: 0;left: 0;box-shadow: 0 0px 5px #737373;}
.navbar-dark .navbar__menu1 .nav-link{color:#282828;padding: .5rem 0px;position: relative;transition: color 0.5s;transition-timing-function: cubic-bezier(0.2,1,0.3,1);display: block;}
.dropdown-toggle::after {display: none;}
.navbar-dark .navbar__menu1 .nav-item:focus .nav-link, .navbar-dark .navbar__menu1 .nav-item:hover .nav-link{color: #004475 !important;}
.navbar-expand-lg .navbar-nav .dropdown-menu {top: 90px;box-shadow: 1px 2px 2px #818182;border: 0;border-radius: 0;background: rgb(255 255 255 / 90%);padding: 0px;}
.navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-item {padding: 15px 80px 15px 20px;margin: 0;}
.dropdown-item:focus, .dropdown-item:hover {color: #fff;background-color: #0069b3;}
.navmenu1__wrapper {width: 100%;display: flex;align-items: center;flex-direction: row;}
.navbar-brand{position: relative;width: 40%;}
.navbar-brand__logo, .navbar-brand__logochange{margin: 0;}
.bg-dark .navbar-brand__logochange {display: none;}
.bg-dark.navbar--fixed .navbar-brand__logochange {display: block;}

.nav-item {font-size: 1.115rem;padding: 25px 15px;}
.navbar__menu1 .nav-item {/* width:120px; */text-align: center;transition: all .5s ease-out;position: relative;}
.navbar__menu1 .nav-item:hover {background: #f0f9ff;}
.navbar__menu1 .nav-item:before {content: '';position: absolute;z-index: 3;bottom: 0;left: 0;width: 100%;height: 2px;transform: scale3d(0,1,1);transform-origin: 0% 50%;transition: transform 0.5s;transition-timing-function: cubic-bezier(0.2,1,0.3,1);background: #0069b3;}
.navbar__menu1 .nav-item .nav-link {color: #000000 !important;font-weight: 300;letter-spacing: 2px;}
.nav-item:hover:before {transform: scale3d(1,1,1);}
.nav-item:hover .dropdown-menu {display: block !important;left: inherit;right: 0;}

.navbar__item--style2 {font-size: 1rem;padding: 5px 0;color: #0069b3;}
.item__language_pc {display: flex;flex-direction: row;}
.item__language_md {display: none !important;}
.item__language-tw, .item__language-en {/* border: 1px solid #0069b3; *//* margin: 0 3px; */width: 50px;text-align: center;/* background: #818182; */}
.item__language-tw.active, .item__language-en.active {background: #17a2b8;}
.navbar-collapse--style2 {width: 100%;}
.nav__menu2--bg {background: #004475;width: 100%;}
ul.navbar-nav.ml-auto.navbar__menu2 {justify-content: flex-end;display: flex;flex-direction: row;align-items: center;}
.navbar__menu2 .nav-link {color: #fff !important;padding: 0.5rem 0 !important;}
.navbar-dark .navbar__menu2 .nav-item:focus .nav-link, .navbar-dark .navbar__menu2 .nav-item:hover .nav-link {color: #ffa400 !important;}
/*--主選單下拉 外連項目--*/
.menu__url {background: #f5f8fd;border-bottom: 1px solid #cfe2ff;}

/*-主選單下拉下拉-*/
.menu_item {position: relative;}
.down__teacher {display: none;position: absolute;width: 100%;right: -100%;top: 0%;box-shadow: 1px 2px 2px #818182;border: 0;border-radius: 0;background: rgb(255 255 255 / 90%);}
.down__teacher .dropdown-item:hover {background-color: #3f95d3;}
.dropdown-menu .menu_item:hover .down__teacher {display: block;}

/*--搜尋 search--*/
.search {position: relative;margin: 0 10px;border-radius: 50px;width: 220px;background: rgb(255 255 255);overflow: hidden;height: 35px;display: flex;align-items: center;flex-wrap: nowrap;}
input#search {background: transparent;border: 0;padding: 0 10px;border: none;outline: none;}
button.search-btn {background: transparent;border: none;outline: none;color: #777;position: absolute;right: 5px;}

/*--搜尋頁面--*/
h3.result__title {font-size: 1.15rem;font-weight: 400;color: #0069b3;margin: 0;padding: 10px;background: #eaf3ff;}



/*banner*/
.banner__bg {background: #e9ecef;}
.slick-dots {bottom: 25px !important;}

.slick-dotted.slick-slider{margin:0 !important;margin-bottom: 5px !important;}
.banner__text {position: absolute;text-align: right;right: 0;top: 70%;padding: 0 6vw;color: #fff;text-shadow: 0 1px 10px #343a40;max-width: 1280px;transform: translateY(-50%);margin: auto;}
.banner__text-title {font-weight: 700;font-size: 3.5rem;}
.banner__text-word {font-size: 2rem;font-weight: 600;}

/*麵包屑*/
.breadCrumbs-block{/* margin-top: 15px; */padding: 15px 0;/* background: #ddd; */}
.breadCrumbs-block .breadCrumbs{/* float: right; */list-style:  none;margin:  0;padding:  0;}
.breadCrumbs-block .breadCrumbs .item{display: inline-block;padding: 0 7px 0 0;font-size: 14px;}
.breadCrumbs-block .breadCrumbs .item:after{content: '/';display: inline-block;color:#999}
.breadCrumbs-block .breadCrumbs .item a{display: inline-block;padding: 0 7px 0 0;color:#999;}
.breadCrumbs-block .breadCrumbs .item.active:after{display:none}
.breadCrumbs-block .breadCrumbs .item.active a{padding-right:0;color: #0069b3;}


/*--首頁、內頁共用標題--*/
.pagetitle h3, .indexBox2 h3, .indexBox3 h3, .indexBox4 h3 {color: #0f0f0f;}
.titleh3__style1 {color: #0069b3;/* text-shadow: 1px 1px 10px #ffffff; */font-size: 1.5rem;z-index: 1;/* margin: 0; */}
.area__down .titleh3__style1 {color: #0069b3;}
.title__area-style1 .titleh3__style1 {color: #fff;font-size: 1.115rem;}
.title__area-style1 .titleh3__style2 {color: #fff;}
.titleh3__style2 {font-size: 1.25rem;color: #0069b3;font-weight: 600;font-style: italic;/* width: 100%; */z-index: 1;}
.titleh3__style3 {font-size: 1.2rem;text-align: center;margin: 0;text-shadow: 1px 1px 5px #383838;}
.area__down .titleh3__style3 {font-size: 1rem;font-weight: 400;}
.titleh3__style2{font-family: 'Noto Serif TC', serif;}
.titleh3__style4{color: #44403f;font-size: 1.15rem;/* text-align: center; */margin: 0;letter-spacing: 1px;font-weight: 400;}
.area__link--style1 .linkStyle1:hover {
    background: #78927e;
    color: #fff;
}
.area__link--style1 a:hover .titleh3__style4 {color: #ffffff;/* text-shadow: 1px 1px 3px #818182; */}

/*--首頁--*/
.index__news {display: flex;border: 1px solid #ccc;background: #ffffff;/* width: 100%; */margin-right: 15px;align-content: center;justify-content: center;align-items: center;}
.pagetitle {position: relative;}
.title__area{width: 18%;/* padding-left: 0; */}
.index__activity, .index__monthly, .index__case {display: flex;flex-direction: column;/* margin: 0; */border: 1px solid #ccc;width: calc(100% / 3 - 10px);justify-content: space-between;align-content: space-between;background: #fff;overflow: hidden;border-radius: 10px 10px 0 0;}

.index__case {
    margin: 0;
}

.index__activity, .index__monthly {
    margin: 0 15px 0 0;
}

.index__activity:hover, .index__monthly:hover, .index__case:hover {box-shadow: 0px 5px 10px #ccc;}
.indexBox2, .indexBox3, .indexBox4 {background: #fff;position: relative;display: block;}

.indexBox2:before, .indexBox3:before, .indexBox4:before {content: "";position: absolute;display: block;background: #0069b3a6;top: 0;height: 90px;width: 100%;z-index: 1;}
.indexBox2:before {background: rgb(229 173 91 / 60%);}

.indexBox2:after, .indexBox3:after, .indexBox4:after {content: "";position: absolute;display: block;background: url(../images/index/icon02_1.svg) no-repeat;top: 30%;right: 20%;width: 270px;height: 270px;opacity: 0.1;z-index: 0;}
.indexBox3:after {background: url(../images/index/icon03_1.svg) no-repeat;}
.indexBox4:after {background: url(../images/index/icon04_1.svg) no-repeat;}
.indexBox3:before {background: rgb(221 97 97 / 60%);}
.indexBox4:before {background: rgb(166 99 178 / 60%);}
.pagetitle.pagetitle--style2 {width: 100%;padding: 0;display: flex;flex-wrap: wrap;flex-direction: column;align-content: flex-start;align-items: flex-start;}
.indexBox2 .pagetitle--style2{background: url(../images/index/pic01.jpg) no-repeat;background-size: 100%;background-position: center;/* background: #ffc107; */position: relative;}
.indexBox3 .pagetitle--style2{background: url(../images/index/pic02.jpg) no-repeat;background-size: 100%;background-position: center;}
.indexBox4 .pagetitle--style2{background: url(../images/index/pic03.jpg) no-repeat;background-size: 100%;background-position: center;}
.pagetitle.pagetitle--style2 i {margin-right: 10px;font-size: 1.5rem;color: #0069b3;}
.list-style {border-bottom: 1px solid #ddd;}

.pagetitle--style2, .pagetitle--style3, .pagetitle--style3{
    padding: 10px 25px !important;
}

/*--link--*/
.index__area--style2 {display: flex;flex-direction: row;align-content: center;margin: 5px auto;justify-content: center;}

.area__link--style1 {width: 15%;position: relative;margin: 0 10px;}
.area__link--style1 .linkStyle1 {border: 2px solid #78927e;border-radius: 45px;/* height: 254px; */padding: 15px 0;/* margin: 1rem 0px; */width: 100%;text-align: center;position: relative;display: flex;justify-content: center;align-items: center;/* transition: all 1s ease-out; *//* transform: scale(1, 1); */}

.linkStyle1 figure {margin: 0 10px 0 0;padding: 15px;border-radius: 50%;background: #fff2b1;display: block;position: relative;}
.area__link--style1 a:hover figure {background: #ffffff;box-shadow: 1px 1px 5px #b8b8b8;}
.linkStyle1 img {width: 35px;/* margin-right: 10px; */}

/*--列表 menu--*/
.listMenu {background: #eee;}
.listMenu ul {list-style: none;padding: 10px 0;margin: 0 0 10px;display: flex;justify-content: center;align-items: center;}
.list__menu__li {/* width: 100%; */text-align: center;padding: 5px 30px;}
.list__menu__li:hover, .list__menu__li.active {background: #0069b3;color: #fff !important;}
.list__menu__li:hover a, .list__menu__li.active a {color: #fff;}

/*--page點閱率--*/
.view p {/* margin: 0 10px 0 0; */margin: 0;}
.view {position: absolute;display: flex;right: 50px;/* color: #383d41; */font-size: 0.8rem;background: rgb(239 239 239 / 60%);padding: 6px;justify-content: space-around;align-items: center;color: #606060;font-weight: 300;}
.detail--word .view {left: 0;position: relative;}

/*--index點閱率--*/
.box__view--style1 {display: flex;flex-direction: row;align-items: center;padding: 5px 10px !important;right: 0 !important;background: transparent !important;}
.box__view--style2 {position: relative !important;right: 0 !important;}
.boxlist__time {margin-left: 5px;position: relative;width: 30%;}


/*--news box1--*/
.indexBox1 {width: 75%;}
.boxList--style1 {padding: 0;margin: 0 5px;list-style: none;border-left: 1px solid #ccc;}

.boxlist__link, .boxlist__link2, .boxlist__link3, .boxlist__link4, .boxlist__link5{position: relative;display: flex;align-items: center;padding: 10px 20px;width: 100%;/* justify-content: space-between; */}
.indexBox2 .boxlist__link2, .indexBox3 .boxlist__link3, .indexBox4 .boxlist__link4 {justify-content: space-between;}
.boxlist__layer-date {margin-right: 10px;}
.boxlist__layer .boxlist__link, .boxlist__layer .boxlist__link2, .boxlist__layer .boxlist__link3, .boxlist__layer .boxlist__link4, .boxlist__layer .boxlist__link5 {padding: 0.5rem;}
.boxlist__layer-date, .boxlist__layer-date2, .boxlist__layer-date3, .boxlist__layer-date4, .boxlist__layer-date5 {background: #4c97cc;color: #fff;padding: 5px 10px;/* margin-right: 10px; */position: relative;font-size: 0.75rem;text-align: center;display: block;}
.pageBox .boxlist__layer-date, .pageBox .boxlist__layer-date2, .pageBox .boxlist__layer-date3, .pageBox .boxlist__layer-date4, .boxlist__layer-date5 {margin-right: 10px;}
.pageBox .boxlist__layer:hover .boxlist__layer-date, .pageBox .boxlist__layer:hover .boxlist__layer-date2, .pageBox .boxlist__layer:hover .boxlist__layer-date3, .pageBox .boxlist__layer:hover .boxlist__layer-date4 {background: #ffa400;}
.boxlist__layer-text, .boxlist__layer-text2, .boxlist__layer-text3, .boxlist__layer-text4  {margin: 0;color: #3e3a39;font-weight: 400;font-size: 14px;max-height: 55px;max-width: 70%;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.boxlist__layer-text {-webkit-line-clamp: 1;}
.boxlist__link:hover .boxlist__layer-date, .boxlist__link2:hover .boxlist__layer-date2, .boxlist__link3:hover .boxlist__layer-date3, .boxlist__link4:hover .boxlist__layer-date4,  .boxlist__link5:hover .boxlist__layer-date5 {background: #ffa400;}
.boxlist__layer:hover .boxlist__link .boxlist__layer-text, .boxlist__layer:hover .boxlist__link2 .boxlist__layer-text, .boxlist__layer:hover .boxlist__link3 .boxlist__layer-text, .boxlist__layer:hover .boxlist__link4 .boxlist__layer-text, .boxlist__layer:hover .boxlist__link5 .boxlist__layer-text {color: #0069b3;}



/*--activity box2--*/
.boxList--style2, .boxList--style3, .boxList--style4{padding: 0;}
.indexBox2 .boxList--style2, .indexBox3 .boxList--style3,.indexBox4 .boxList--style4 {margin: 0;list-style: none;position: relative;z-index: 1;}
.boxlist__layer-date2 {background: #ffc165;}

.boxlist__link2:hover .boxlist__layer-text2 {color: #0069b3;}

/*--Case study box3--*/
.boxlist__layer-date3 {background: #fb6e6e;}
.boxlist__link3:hover .boxlist__layer-text3 {color: #0069b3;}

/*--Case study box4--*/
.boxlist__layer-date4 {background: #b769c5;}

.boxlist__link4:hover .boxlist__layer-text4 {color: #0069b3;}

/*--Case study box5--*/
.boxlist__layer-date5 {background: #7520a0;}
.boxlist__link5:hover .boxlist__layer-text5 {color: #0069b3;}

/*--首頁輪播圖--*/
.area_2 {max-height: 390px;}
.indexPhoto {width: calc(100% - 65%);}
.indexPhoto figure {margin: 0;/* background: #ddd; */overflow: hidden;max-height: 385px;display: flex;justify-content: center;align-items: center;}
.indexPhoto figure img {width: -webkit-fill-available;}
.indexPhoto .slick-dotted.slick-slider {margin-bottom: 0 !important;}
/*--首頁-聯絡我們contact--*/
.index__contact {background: url(../images/index/bg01.jpg) no-repeat;padding: 7rem 0;}

/*--首頁-活動報名系統、下載區塊、FAQ--*/
.area-style1, .area-style2 ,.area-style3 {padding: 1rem;margin-bottom: 0;position: relative;height: 120px;color: #ffffff;}
.index__area {display: flex;width: calc(50% - 15px);margin-right: 15px;/* flex-wrap: wrap; */flex-direction: column;}
.link-style1, .link-style2, .link-style3, .link-style4 {background: #25b0c6;position: relative;display: inline-block;padding: 1.7rem;font-weight: 500;color: #fff;width: 100%;display: flex;justify-content: space-between;flex-wrap: wrap;flex-direction: row;align-items: center;width: 100%;}
.link-style1:hover, .link-style2:hover, .link-style3:hover, .link-style4:hover {background: #0069b3;color: #fff;}
.link-style1 i, .link-style2 i {font-size: 2rem;margin-right: 10px;}
.link-style2 {background: #3780ab;/* background: url(../images/index/pic02.jpg); */}
.link-style3 {background: #295096;/* background: url(../images/index/pic02.jpg); */}
.link-style4 {background: #003594;/* background: url(../images/index/pic02.jpg); */}
.link-style5 {background: #747474;/* background: url(../images/index/pic02.jpg); */}
.link-style5 {position: relative;display: inline-block;padding: 10px 20px;font-weight: 500;color: #fff;margin-right: 10px;}
.link-style5 p{margin:0;}

.area__link {display: flex;position: relative;margin-bottom: 5px;justify-content: space-between;}
.area__link--style2 {display: flex;flex-direction: row;flex-wrap: nowrap;position: relative;height: 40%;}
.down {display: flex;/* flex-direction: column; */}
.area__down {padding: 15px;background: #c7e3ff;}
.title__area-style1{color: #fff;}
.more {position: relative;border: 1px solid #fff;border-radius: 50%;padding: 5px 10px;margin-left: 10px;display: block;right: 0;z-index: 3;}

.more i {margin: 0;font-size: 1.115rem;}
.link-style1:hover .more i, .link-style2:hover .more i {color: #ffffff;} 
.link-style1:before, .link-style2:before, .link-style3:before, .link-style4:before {content: "";position: absolute;left: 0;bottom: 0;z-index: 2;width: 0;height: 5px;transition: all .5s;}
.link-style1:hover:before, .link-style2:hover:before, .link-style3:hover:before, .link-style4:hover:before {background: linear-gradient(to right, rgb(19 104 171) 40%, #fff 100%);width: 100%;}

/*--最新消息--*/
.listBox {margin: 1rem 0;padding: 0;}
.listBox .boxList--style1 {border: 0;margin: 0;padding: 0;}
.listBox .boxlist__layer {border-bottom: 1px solid#ddd;padding: .5rem 0;position: relative;}
.more-btn {width: 0;height: 0;border-style: solid;border-width: 0 0 15px 15px;position: absolute;right: 0;bottom: 0px;border-color: transparent transparent #0069b3 transparent;transition: all .5s ease-out;}
.more-btn i {display: none;margin-top: 17px;margin-left: -21px;color: #ffffff;font-size: 1.15rem;}
.boxlist__layer a:hover .more-btn i {display: block;}
.boxlist__layer a:hover .more-btn {border-width: 0 0 45px 45px;border-color: transparent transparent #ffa400 transparent;}

/*--最新消息_電子報版型按鈕--*/
.edm_link .a_link a{display: block;color: #fff;background: #17a2b8;box-shadow: 2px 2px 0px #ddd;border-radius: 8px;padding: 8px;margin: 8px 5px;}
.edm_link .a_link:nth-child(5n-4) a{background: #f2b966;}
.edm_link .a_link:nth-child(5n-3) a{background: #f28787;}
.edm_link .a_link:nth-child(5n-2) a{background: #ad72b7;}
.edm_link .a_link:nth-child(5n-1) a{background: #78927e;}
.edm_link {display: flex;justify-content: center;}
.a_link {text-align: center;width: calc(100% / 5);}
.a_link p{}

/*--置頂消息--*/
.layerTop__text {color: #ad0000;}
.layerTop__date {background: #ad0000;}

/*--文章分享--*/
.share {display: flex;align-items: center;align-content: center;/* width: 50%; *//* float: right; */justify-content: flex-end;}
.fb_iframe_widget{margin-bottom:5px;margin-right:5px}

/*--頁碼--*/
.pagenumber {padding: 3rem 0 0;}

.pagination > li > a { border:none; border-bottom:3px solid #ddd; margin:0 5px; color:#999; transition: all 0.3s ease 0s; }
.pagination > li > a:hover { border-bottom:3px solid #aaa; background:#f5f5f5; }
.pagination > li.active > a, .pagination > li.active > a:hover {border-bottom: 3px solid #0069b3;background:none;color: #0069b3;}
.pagination>li:first-child>a, .pagination>li:first-child>span { border-top-left-radius: 0;  border-bottom-left-radius: 0; }
.pagination>li:last-child>a, .pagination>li:last-child>span { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }

/*--關於TIPA--*/
.page__bottom {border-bottom: 1px solid #ddd;margin: 0 0 1rem;}



/*--6圖文 1影片--*/
.page-content table { max-width:100%; }
.imgg { max-width:100%; display:block; margin:1em 0; }
.imgg2 { max-width:100%; display:block; }
.tx01 { clear: both; margin-bottom:2em;}
.tx02 { clear: both; overflow:hidden; margin-bottom: 2em;}
.tx01 img {margin-bottom: 1em; }
.img-left,.img-left1 { float: left; padding-bottom: 1em; padding-right: 2em;max-width:50%;}
.img-right,.img-right1 { float: right; padding-bottom: 1em; padding-left: 2em;max-width:50%;}
.img_center{width: 33.3%; }
.img-left img, .img-right img { max-width:100%; }
.img-left1 img, .img-right1 img { max-width:100%; }
.img_center img {  float: left;  padding: 1em;  width: 100%;   text-align: center;}

@media (max-width: 768px) { 
.page-content iframe { height:400px; }
}

@media (max-width: 640px) { 
.page-content iframe { height:320px; }
.img-left, .img-right, .img-left1, .img-right1 { float:inherit; padding-right: 0; padding-left: 0;}
.img-left, .img-right, .img_center,.img-left1, .img-right1 { display:block; width:100%; max-width:inherit; }
}

@media (max-width: 480px) { 
.img-left,.img-left1,.img-right,.img-right1 { float:inherit; padding: 0 0 1em 0;}
.page-content iframe { height:250px; }
}

/*--列表底層標題--*/
.detail--word{position: relative;border-bottom:1px solid #ddd;/* padding-bottom: 1rem; */margin: 1rem 0;display: flex;flex-wrap: wrap;flex-direction: row;}
.detail--title {position: relative;font-size: 2rem;font-weight: bold;color: #0069b3;padding: 1rem 0;margin: 0;left: 1rem;width: 100%;}
/* .detail--title2 {color: #2e7978;}
.detail--title3 {color: #9648a4;}
.detail--title4 {color: #1f87a9;}
.detail--title5 {color: #7520a0;} */

.detail--title:before {content: "";position: absolute;top: 50%;width: 5px;height: 3rem;background: #dee7f0;transform: translateY(-50%);left: -1rem;}
.detail--titlep {margin: 0;}


/*--btn--*/
.btn-style .btnback {position: relative;padding: 10px 20px;margin: 20px;border: 1px solid #265b89;background: #fff;color: #265b89;}
i.bi.bi-arrow-right {margin-left: 10px;}
.btn-style {position: relative;padding: 2em 0;text-align: center;clear: both;}
.btn-style .btnback:hover {color: #fff;background: #265b89;}
.link-style3 p {margin: 0;}
.z-btn10 > span {position: absolute;top: -120%;left: 50%;transform: translate(-50%, -50%);color: #fff;z-index: 9;opacity: 0;}
.z-btn10:hover {color: #555;}
.z-btn10:hover > span {top: 50%;opacity: 1;}
.z-btn10:before {content: "";width: 100%;height: 0%;position: absolute;top: 0%;left: 0%;background: #ffa400;transition: .3s;z-index: 0;/* opacity: 0; */}
.z-btn10:hover:before {height: 100%;}

/* style 5  */
.hover-infobox .mosaic-block {margin: 1.5rem 0 1.5rem;}
.hover-infobox .mosaic-block:nth-child(3n+1) { clear: both; }
.hover-infobox .mosaic-img {/* height: 300px; */display: -webkit-flex;-webkit-align-items: center;display: flex;align-items: center;justify-content: center;}
.hover-infobox .mosaic-img img { max-width: 100%; max-height: 100%; display: block; }
.hover-infobox .mosaic-block > .mosaic-box{  position: relative;   overflow: hidden;}   
.hover-infobox .mosaic-overlay {z-index:5;position:absolute;width:100%;height:100%;background-color: rgb(0 0 0 / 50%);display: block;top: 75%;height: 100%;transition: top .3s ease-out;/* display: flex; *//* justify-content: center; */}
.hover-infobox .mosaic-block:hover .mosaic-overlay, .hover-infobox .mosaic-block:hover .mosaic-overlay .details p{ top: 0;	}
.hover-infobox .details{padding: 8px 8px 16px 8px;display: flex;justify-content: center;flex-direction: column;}
.hover-infobox .details img { float: right;  width: 30px; }
.hover-infobox .details h4 {font-size: 1.15rem;font-weight: 400;color: #fff;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;margin: .5em 0;text-shadow: 0 1px 3px #515151;padding: 0.6rem 0;}
.details__text {margin: 10px 0;color: #fff;font-size: 0.9rem;font-weight: 300;}



/*--常見問題-圖文類別--*/
.faqBox__row {display: flex;align-content: center;align-items: center;flex-direction: row;flex-wrap: wrap;}
.faq__title {text-align: center;padding: 10px 0;font-size: 1.15rem;font-weight: 400;letter-spacing: 1px;color: #0069b3;}
.faq-overlay {position: relative;padding: 10px 5px;background: #ffffff;/* border-bottom: 4px solid #ffa400; */display: block;}
.faq-block:hover .faq-overlay {background: #0069b3;/* border-bottom: 4px solid #17a2b8; */}
.faq-overlay:before{content: "";position: absolute;left: 0;bottom: 0;z-index: 2;width: 0;height: 5px;transition: all 1s;}
.faq-block:hover .faq-overlay:before {background: linear-gradient(to right, rgb(19 104 171) 40%, #fff 100%);width: 100%;}

.faq-block:hover .faq__title {color: #fff;}
.faq-block {/* margin: 10px 0; */padding: 12px;display: block;overflow: hidden;}
.faq-img {overflow: hidden;width: 100%;}
.faq-img img {transition: all 1s ease-out;transform: scale(1, 1);}
.faq-block:hover .faq-img img {transform: scale(1.2, 1.2);}

/*--常見問題-標題列表--*/
.title__btn-back {position: absolute;display: inline-block;right: 0;bottom: 0;text-align: right;margin: 10px 0;}
.title__btn-back a {font-weight: 300;font-size: 14px;}
.news__list {display: grid;grid-template-columns: repeat(2, 1fr);grid-column-gap: 10px;grid-row-gap: 10px;width: 100%;margin: 1rem 0;}
.list__url {position:relative;display: flex;flex-direction: row;border: 1px solid #ddd;/* border-radius: 4px; */padding: 15px 20px;background: #fff;align-items: flex-start;border-top: solid 4px #004475;}
.list__url:hover {box-shadow: 0 1px 10px #ccc;}
.list__url::before{content:'';position: absolute;right: 0;top: -4px;z-index: 1;display:block;width:0;height: 4px;background: #ffa400;}
.list__url:hover::before{width: 100%;left: 0;}
.list__pic {margin: 0;overflow: hidden;width: 120px;margin-right: 10px;}
.list__pic img {transform: scale(1, 1);transition: all 1s ease-out;}
.list__url:hover .list__pic img {transform: scale(1.2, 1.2);}
.list__word{/* margin: 10px 20px; */width: calc(100% - 120px);}
.list__word:only-child{width:100%}
.list__url .mjTitle {font-size: 1.25rem;color: #265b89;/* padding: 0 0 .5rem; *//* margin: 0 0 .5rem; *//* border-bottom: 1px solid #ddd; */font-weight: 400;}
.list__url time,.list__url .infoTxt{margin:0;}
.list__url time {color: #999;font-size: .9rem;}
.list__url .infoTxt {color: #2e2e2e;max-height: 50px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;font-weight: 300;}
/*--常見問題-底層--*/


/*--網站地圖sitemap--*/
.index-sitemap-list .sitemap-all {list-style:none;padding: 0px 0px 30px;margin: 15px 20px 40px;clear:both;overflow:hidden;margin-bottom:1em;border-bottom: 1px solid #ddd;}
.index-sitemap-list .sitemap-all li { float:left; width:20%; text-align:center; }
.index-sitemap-list .sitemap-all li a { display:block; padding:0.5em 0; margin:0 0.3em; background:#F5F5F5; border-radius:5px; text-decoration:none; }
.index-sitemap-list .sitemap-all li a:hover {background: #0069b3;color: #fff;}
.index-sitemap-list .sitemap-all li.tt { display:block; width:100%; margin:0 auto; font-size:20pt; font-weight:bold; text-align:center; }
.index-sitemap-list .sitemap-all li.tt a {background:none;color: #073984;text-decoration:none;font-weight: 400;}
.index-sitemap-list .sitemap-wrap {display:table;width:100%;margin:0 auto;margin-top: 50px;}
.index-sitemap-list .sitemap {list-style:none;padding:0;margin: 0;display:table-cell;vertical-align:top;width:20%;padding-bottom:2%;}
.index-sitemap-list .sitemap li { padding:0.2em 0; margin:0 1em; }
.index-sitemap-list .sitemap ul { padding-left:.5em; }
.index-sitemap-list .sitemap .tt { font-size:20px; color:#733483; margin-bottom:5px; padding-bottom:5px; border-bottom:1px solid #733483; }
.index-sitemap-list .sitemap .tt a { color:#733483; }
.index-sitemap-list .sitemap .fa { margin:0 5px 0 0; }
.index-sitemap-list .sitemap a { color:#333;  }
.index-sitemap-list .sitemap a:hover { color: #d4000f;}

/*相關連結*/
.link-box .faq-img {
    border-radius: 15px;
}
.pageLinkBox{display: flex;flex-wrap: wrap;margin: 2rem 0;}

/*相簿功能*/

.photo-block {position: relative;overflow: hidden;padding: 0;width: calc(100% / 3 - 10px);margin: 5px;max-height: 280px;}
.photo-block figure {margin: 0;}
.photo-row {display: flex;flex-wrap: wrap;flex-direction: row;align-items: center;}

.photo-title, .about-title {position: absolute;z-index: 1;bottom: 0;text-align: center;width: 100%;height: 100%;color: #fff;background: rgb(0 0 0 / 30%);display: flex;flex-direction: column;justify-content: center;align-items: center;}
.photo-block a:hover .photo-title {background: rgb(97 46 22 / 60%);}
.photo-block a:hover .photo-txt {opacity: 1;transform: translate3d(0,0,0);}
.photo-block a:hover .photo-txt:after {content: "";display: block;border-bottom: 1px solid #fff;padding: 5px;}
.photo-txt {position: relative;opacity: 0;transition: opacity 0.35s, transform 0.35s;}
.photo-img {overflow: hidden;width: 100%;}
.photo-img img {transition: all 1s ease-out;transform: scale(1, 1);}
.photo-block a:hover .photo-img img {transform: scale(1.2, 1.2);}

.photo-list {width: calc(100% / 4 - 10px);max-height: 220px;}

/*about*/
.about-block a:hover .about-title {background: rgb(255 93 0 / 60%);}
.about-block:nth-child(2n+1) a:hover .about-title {background: rgb(255 164 0 / 60%);}
/*下載專區*/
.faq-block:hover .down-overlay {background: #ac65b9;}
.faq-block:hover .down-overlay:before {background: linear-gradient(to right, #ac65b9 40%, #fff 100%);}
.down-overlay .faq__title {color: #ac65b9;}

/*-----教材-----*/

.textbook__area table {width: 100%;}
.textbook__area {margin: 3rem 2rem;}
.textbook__area tr {background: #fff;}
.textbook__area tr:hover {background: #fff7df;}
.textbook__area th, .textbook__area td {border: 1px solid #ddd;padding: 10px;}
.textbook__area td {padding: 15px 10px;}

.textbook__area th {background: #0069b3;color: #fff;font-size: 1.25rem;font-weight: 400;}
.textbook__inner {padding: 2rem 1rem;letter-spacing: 2px;line-height: 30px;}
.textbook__inner p {margin: 0;}

@media (max-width: 640px) { 
.hover-infobox .mosaic-img { height: 230px; }
}
@media (max-width: 480px) { 
.hover-infobox .mosaic-block{ float:inherit; width:100%; }
.hover-infobox .mosaic-img { height: auto; min-height: 200px; }
.hover-infobox .mosaic-overlay {  top: 84%; }
.hover-infobox .details h4 {margin:0;padding: 0;}
}


@media (max-width: 1600px) { }
@media (max-width: 1440px) { }
@media (max-width: 1280px) { }

@media (max-width: 991px) {
    /*全域*/
    .wrapper_page-all {padding: 0 1rem;}

    /*nav*/
    .navbar-nav {width: 100%;}
    .navbar__menu1 .nav-item {width: 100%;padding: 0;}
    .navbar-dark .navbar-toggler {color: #ddd;background: #0069b3;}
    .navmenu1__wrapper {display: flex;justify-content: space-around;width: 100%;margin: 10px 0 0;flex-direction: row;flex-wrap: wrap;}
    .navbar-brand {width: 60%;}
    .down__teacher {position: relative;right: 0;}
    
    /*banner*/
    .banner__text-title {font-size: 1.25rem;margin: 0;}
    .banner__text-word {font-weight: 400;font-size: 1rem;}
    .slick-dots {bottom: 0 !important;}

    /*--hrader--*/
    .fixed-top {background-size: auto;background-position: center;}

    /*--首頁--*/
    .pagetitle.pagetitle--style2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;}
    /*area_1*/
    .index__area--style2 {display: flex;flex-direction: row;flex-wrap: wrap;/* justify-content: center; */margin: 0;}
    .area__link--style1 {width: calc(100% / 2 - 5px);text-align: center;margin: 2px;}

.area__link--style1.item05 {
    display: none;
}
    .area__link--style1 a {/* border-right: 0; *//* border: 2px solid #78927e; */border-radius: 0;/* width: calc(100% - 5px); */height: 50px;margin: 5px 0;}
     h3.titleh3__style4 {font-size: 1rem;}
     
    /*area_2*/
    .area_2 {display: flex;position: relative;flex-wrap: nowrap;align-content: center;align-items: center;flex-direction: column;max-height: initial;}
    .index__area {margin: 0;/* position: relative; */display: flex;flex-direction: row;flex-wrap: wrap;width: 100%;}

    .index__news {display: flex;flex-direction: column;width: 100%;margin: 10px 0;}
    .title__area {width: 100%;padding: 30px 0 0;text-align: center;}
    .indexPhoto {width: 100%;}
    .indexBox1 {width: 100%;}
    .boxList--style1 {border: 0;padding: 0 1rem;margin: 1rem 0;}
    
    .link-style1, .link-style2, .link-style3, .link-style4 {display: flex;flex-direction: column;width: 100%;}
    .more {display: none;}


    /*area_3*/
    .area_3 {display: flex;flex-direction: column;align-content: center;align-items: center;}
    .index__activity, .index__monthly, .index__case {width: 100%;margin: 0;margin: .3rem 0;}

    /*--內頁最新消息--*/
    .wrapper {padding: 0 10px;}
    .detail--title {font-size: 1.25rem;}
    .pagetitle {text-align: center;}
    .boxlist__layer-text, .boxlist__layer-text2, .boxlist__layer-text3, .boxlist__layer-text4 {max-width: 68%;-webkit-line-clamp: 2;margin-left: 5px;}
    .view {right: 35px;}
    
    /*--列表--*/
    .list__menu__li {width: 100%;}
    .listMenu ul {display: flex;flex-direction: column;flex-wrap: wrap;}
    .link-style5 {padding: 10px;}
    .down {display: flex;flex-wrap: wrap;}
    .area__link {display: flex;flex-wrap: wrap;}
    .edm_link {display: flex;flex-wrap: wrap;}
    .a_link {width: 100%;}
    .edm_link .a_link a {margin: 5px 0;}
    /*--影音專區--*/
    .hover-infobox .mosaic-block:nth-child(3n+1) { clear: inherit; }
    .hover-infobox .mosaic-block:nth-child(2n+1) { clear: both; }
    .hover-infobox .mosaic-img { height: 280px; }
 
    /*相簿*/
    .photo-row {display: flex;flex-direction: column;align-content: center;align-items: center;justify-content: center;}
    .photo-block {width: 100%;}

    /*--footer--*/
    .footer__arealink {display: flex;flex-wrap: wrap;flex-direction: column;align-content: center;padding: 0;align-items: center;}
    footer .link-after:after {background: 0;padding: 0;margin: 0;}
    .footer__arealink a {padding: 5px;width: 100%;}
    .footer__form-group {display: flex;flex-direction: row;width: 55%;}
  
    .footer__area {padding: 1rem;margin-bottom: 50px;flex-direction: column;}
    .copyright {text-align: center;}
}

@media (max-width: 760px) {
    .item__language_pc {display: none !important;}
    .item__language_md {display: flex !important;align-items: center;justify-content: center;}
    /*內頁最新消息*/
    li.boxlist__layer {border-bottom: 1px solid #ddd;padding: 8px 0;}
    .boxlist__layer-date, .boxlist__layer-date2, .boxlist__layer-date3, .boxlist__layer-date4 {margin: 0;}
    .boxlist__layer .boxlist__link, .boxlist__layer .boxlist__link2, .boxlist__layer .boxlist__link3, .boxlist__layer .boxlist__link4 {padding: 0;display: flex;flex-direction: column;align-content: flex-start;align-items: flex-start;}

    /*內頁最新消息*/
    .view {right: 25px;bottom: 0;display: flex;flex-direction: row;align-content: center;background: transparent;}

    @media (max-width: 768px) { 
        .hover-infobox .mosaic-block{ float:left; width:50%; }
        }

    /*footer*/
    form {width: 100%;padding: 10px;}

}


p.search__inc {
    margin-bottom: 10px;
    padding: 5px 20px;
    display: inline-block;
    background: #fff2ca;
}