/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

/*font*/
body{font-size:1rem !important;}
.content-wrap{font-size:1.2rem;font-family: "Microsoft JhengHei" !important; }

body,
small,
.sub-menu-container .menu-item > .menu-link,
.wp-caption,
.fbox-center.fbox-italic p,
.skills li .progress-percent .counter,
.nav-tree ul ul a,
.font-body { font-family: "Microsoft JhengHei" !important; }

::selection {
	background: #128BC9 !important;
	color: #FFF;
	text-shadow: none;
}

html {
  scroll-behavior: smooth;
}

h1,
h2,
h3,
h4,
h5,
h6,
#logo a,
.menu-link,
.mega-menu-style-2 .mega-menu-title > .menu-link,
.top-search-form input,
.entry-link,
.entry.entry-date-section span,
.button.button-desc,
.fbox-content h3,
.tab-nav-lg li a,
.counter,
label,
.widget-filter-links li a,
.nav-tree li a,
.wedding-head,
.font-primary,#content { font-family: "Microsoft JhengHei" !important; }
.menu-link{font-size:1em !important;letter-spacing:-1px}

a{color:#662d91}
h2{color:#128BC9}



/*logo*/
#logo img {height: 25px !important;}
#logo a.retina-logo{height:20px}

#top-social li .ts-icon {
	font-size: 1.2rem;
}
#top-social li{padding:10px; border-left: 0px}
#top-social i,#top-social img{font-size:20px;padding-right:5px}
#top-social li a:hover {
	color: #666 !important;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}


/*toplinks*/
#emblem{width:40px}
.top-links-item{border-left: 0px}
.top-links-item i,.top-links-item img{font-size:20px !important ;padding-right:5px}
.top-links-item > a {
	font-size: 0.8rem;
	font-weight: normal;
	text-transform: uppercase;
	color: #666;
}
.top-links-sub-menu a{font-size: 0.8rem !important}
.top-links-sub-menu,
.top-links-section {
	position: absolute;
	visibility: hidden;
	pointer-events: none;
	opacity: 0;
	list-style: none;
	z-index: -1;
	line-height: 1.5;
	background: #FFF;
	border: 0;
	top: 100%;
	left: -1px;
	width: 140px;
	margin-top: 10px;
	border: 0px solid #EEE;
	border-top-color: #1ABC9C;
	box-shadow: 0px 13px 42px 11px rgba(0, 0, 0, 0.05);
	transition: opacity .25s ease, margin .2s ease;
}

    @media (max-width: 575px) {

        .top-links-container li:last-child{display: none}
    }  



/*site search form*/
.top-search-form {
	opacity: 0;
	z-index: -2;
	pointer-events: none;
	position: absolute;
	width: 300px !important;
    left:calc(100% - 300px);
	height: 100%;
	padding: 0;
	margin: 0;
	top: 0;
	right: 0 !important;
	-webkit-transition: opacity .3s ease-in-out;
	-o-transition: opacity .3s ease-in-out;
	transition: opacity .3s ease-in-out;
}

.top-search-open .top-search-form {
	opacity: 1;
	z-index: 10;
	pointer-events: auto;
}

.top-search-form input {
	box-shadow: none !important;
	border-radius: 0;
	outline: 0 !important;
	font-size: 24px;
	padding: 10px 80px 10px 0;
	height: 100%;
	background-color: transparent !important;
/*	color: #fff !important;*/
	font-weight: 700;
	margin-top: 0 !important;
	font-family: 'Poppins', sans-serif;
	letter-spacing: 2px;
}

@media (min-width: 992px) {
	.top-search-form input { font-size: 1.2em; }

	.full-header .top-search-form input,
	.container-fluid .top-search-form input {
		padding-left: 30px;
	}

	.transparent-header:not(.sticky-header):not(.full-header):not(.floating-header) .top-search-form input {
		border-bottom: 2px solid rgba(0,0,0,0.1);
	}
}

/*menu*/
.menu-item:hover > .menu-link,
.menu-item.current > .menu-link {color: #128BC9 !important;}
.sub-menu-container,.mega-menu-content {border-top: 2px solid #9743d6;}
.mega-menu-style-2 .mega-menu-title > .menu-link{color:#128BC9 !important}
.menu-link {
	font-size: 1.2rem !important;
    letter-spacing: 1px !important;
}


/*search icon 換行問題*/
@media (max-width: 1199px) and (min-width: 991.98px){
    #logo{padding-top:1em !important}
    .menu-container>.menu-item a{padding-left:0px;padding-right:20px;}
}

@media (max-width: 1399px) and (min-width: 1200px){
    .menu-container>.menu-item a{padding-left:0px;padding-right:15px;}
/*    #logo{padding-top:0.8em !important}*/
}

@media(min-width: 1400px){
    .menu-container>.menu-item a{padding-left:14px;padding-right:14px}
}
.menu-container>.menu-item a{ font-size: clamp(16px, 3.5vw, 20px) !important;}


/* Off Canvas Menu*/
@media (max-width: 991.98px){
/*
    .sub-menu-trigger{color:#fff}
    .menu-item .sub-menu-container .menu-link {color: #fff}
    .mega-menu-style-2 .mega-menu-title > .menu-link{color:#1ABC9C !important}
    .mega-menu-style-2 .sub-menu-container .menu-item > .menu-link {color: #fff !important;}
*/
    .mobile-menu-off-canvas .menu-container{
        height: 100%;
		height: calc(100vh);
		max-height: none !important;
        border-left:0px !important
    }
}

.mobile-menu-off-canvas .menu-container{z-index:10;}


/*go to top icon*/
.icon-angle-up:before {
    content: "\f077"; font-family: 'Font Awesome 6 Free'; font-weight: 900;
    font-size: 1rem;
}



/*select*/
.form-select {
  display: inline-block;
  width: 100%;
  height: calc(2.25rem + 2px);
  padding: 0.375rem 1.75rem 0.375rem 0.75rem;
  line-height: 1.5;
  color: #495057;
  vertical-align: middle;
  background: #fff url("../image/down-arrow.svg") no-repeat right 0.75rem center;
  background-size: 8px 10px;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.form-select option * {padding-top:10px}

/*button*/
.button{background-color:#128BC9}
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #662d91;
  --bs-btn-border-color: #662d91;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #532576;
  --bs-btn-hover-border-color: #532576;
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #471f66;
  --bs-btn-active-border-color: #471f66;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #471f66;
  --bs-btn-disabled-border-color: #471f66;
}


/*index recommend slider*/
#rslider{font-size:1.2rem;}
#rslider img{margin-bottom:1em !important}
#rslider a{display:inline-block;}
#rslider .owl-dots {position: relative;top: auto;}
#rslider .owl-dots button {	border: 1px solid #d1d1d1;}
#rslider .owl-dots .owl-dot.active,
#rslider .owl-dots .owl-dot:hover { background-color: #d1d1d1 !important; }
.owl-carousel{z-index: auto}

/*social icon*/
#social-button{bottom: 50px;background:#999;width:50px;height:230px;position:fixed;right:0px;bottom:100px;border-radius: 8px 0 0 8px; z-index:9999 !important;}


.social-button {
 position: fixed;
 bottom: 50px;
 right: 0px;
 height: 50px;
 width: 50px;
 cursor: pointer;
-webkit-transition: 0.33s ease;
 transition: 0.33s ease;	
 -webkit-backface-visibility: hidden;
 backface-visibility: hidden;
 color:#fff;
 opacity: 1;
 text-align:center;
 font-size:12px !important}
		
.social-button i{font-size:20px;padding:15px 15px;color:#fff;display: block;z-index: 2}
	
.social-button:hover {
 -webkit-transition: 0.35s cubic-bezier(0.3, 0.2, 0, 2.5);
 transition: 0.35s cubic-bezier(0.3, 0.2, 0, 2.5);
 color:#fff;
}

.social-button.fb .text, .social-button.youtube .text,.social-button.contact .text,.social-button.fix .text,.social-button.rec .text,.social-button.ig .text{
	position:absolute;opacity: 0 !important;top: 50%;left: 50%;transform: translate(-50%,-50%);}


.social-button:hover .text{opacity: 1 !important;color:#fff;}


	
/*?望???*/
/*.social-button.rec .text{bottom: 110px;font-size:0.7em !important}*/
.social-button:hover i{opacity: 0}
.social-button.rec{bottom: 70px;}
.social-button.fix{bottom: 110px;}

.social-button.youtube {bottom:150px;}
.social-button.ig {bottom:190px;font-size:1.4rem}
.social-button.fb {bottom:230px;}
.social-button.contact {bottom: 270px;}



/*footer*/
footer ul{list-style: none;line-height:1.7}
footer ul:nth-child(2) li{margin-right:1em}
footer i{margin-right:8px;width:20px;;text-align:center}
footer{background-color: #383838 !important;color: #EEE;}
footer a {color: #EEE !important;}


/*slidebar*/
.left-sidebar-menu{ box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;padding:2em}
.left-sidebar-menu ul{list-style:none;padding-left:0 !important}
.left-sidebar-menu li{line-height:2}
.left-sidebar-menu li a{display: block;}
.left-sidebar-menu li a:hover{padding-left:0.5em;transition: .5s}

/*page sub menu*/
#page-menu {
	position: relative;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
    
}

#page-menu-wrap {
	position: absolute;
	z-index: 199;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #fff;
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
    padding-top:30px;
}

#page-menu a{font-size:1em;text-shadow: none}

/*page title*/
#page-title{background:url(/image/bg.jpg) center center;background-size: cover}
#page-title h1,#page-title span{
	text-align: center;
    color:#fff;
    text-shadow: 3px 3px 5px rgba(14, 51, 29, 0.5);
     text-shadow: 0 0 10px rgba(0, 0, 0, 0.6)
}
#page-title .breadcrumb {
	position: relative !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	margin: 20px 0 0 !important;
	justify-content: center;
	transform: translateY(0);
}

/*breadcrumb*/
.breadcrumb,.breadcrumb a, .breadcrumb .active{ color: #000; }
.breadcrumb a:hover { color: #fff; }
.breadcrumb i { width: auto !important; }


/*tabs*/
.nav-pills .nav-link{border-radius:25px;border:1px solid #662d91;font-size:0.86em}
.nav-pills a,.nav-pills a:hover,.nav-pills a:visited{color:#662d91}
.nav-pills .nav-item .nav-link.active{background:#662d91}
.nav-pills .nav-item {margin-right:10px;margin-bottom:5px}

/*main content*/
#content ul:not(.boot-tabs),#content ol:not(.boot-tabs){padding-left:2em}
#content li{line-height:1.7}
#content table ul,#content table ol{margin-bottom:0}
a{color:#a963bf;}
.sp{color:#C71585 !important}



.card-header{background:#128BC9;color:#fff}
.card h5 {color:#128BC9;font-size: 1em}
.indent01{padding-left:2em;text-indent : -2em ;}
.indent02{margin-left:2em}
.list01 li{width:48%;float: left;padding-right:1em;}
.list02 li{width:45%;float: left;margin-right:2em}
.datepicker table tr th{border-radius:0px;border:0px !important}
.datepicker table tbody tr:last-child{border:0px;margin-bottom:0}
.datepicker table{margin-bottom:0 !important}
.datepicker .disabled{color:#d1d1d1 !important} 
label{font-size:1em;text-transform:none}
input[readonly]{background:rgba(0,0,0,.05)}
.policy{padding:0;font-size:0.8em;margin-bottom:0;}
dt{float:left;}
dd{margin-left:3em;padding:0 0 0.5em 2em}
button.accordion-button{font-size:1em}

/*doc typd img*/
a[href$=".odt"]:after{content:url(../image/odt_s.png);margin-left:5px}
a[href$=".pdf"]:after{content:url(../image/pdf_s.png);margin-left:5px}


.fbox-icon i,
.fbox-icon img {
	border-radius: 50%;
	background-color: #128BC9;
}


/*list news page*/
#related_link{padding:2em;background:#efefef;margin-top:2em;word-break: break-all;}
#related_link li{font-size:0.86em}
.news{padding:2em 0}
.news:not(:last-child){border-bottom:1px solid #ccc}
.news:hover{opacity: 0.8;transition: .5s}
.news h3{font-size:1.2em;margin-top:0.5em;margin-bottom:0.5em}
.news small{font-size:0.8em;color:#999;padding-bbttom:1em}
.news p{
font-size:1em;
margin-top:0em; 
word-wrap: break-word;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2; 
overflow: hidden;   
}
.news a{color:#555}


/*owl slider nav*/
.owl-carousel .owl-nav [class*=owl-]:hover {
	background-color: #128BC9 !important;
}


/*table*/
table{caption-side: top;margin-bottom:2em !important;border-bottom:2px;}
tbody,table,tr{background:#fff !important}

/*tr:nth-child(even){background:#f2f2f2 !important}
tr:nth-child(odd),.table-striped > tbody > tr:nth-of-type(odd) > * {background:#fff !important}*/
table tbody tr:last-child{border-bottom: 3px solid #ccc}
caption::before {content: "\f05a"; font-family: 'Font Awesome 6 Free'; font-weight: 900;margin-right:10px}
th{background:#128BC9 !important;color:#fff !important}


/*foo table*/
.footable-details{margin-top:1em}
.footable-details th{background:#128BC9 !important;color:#fff}
.footable{-webkit-transition: all 0.8s ease-out; transition: all 0.8s ease-out;}
 .footable th:empty {
      display: none !important;
    }
.footable td:empty {
      display: none !important;
    }
.fooicon {
	position: relative;
	top: 1px;
	display: inline-block;
	font-family: 'Font Awesome 6 Free' !important;
	font-style: normal;
	font-weight: 900;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
    padding-right:10px;
    color:#666;
    
}
.fooicon:before,
.fooicon:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
/*	padding-left:10px*/
}
.fooicon-loader:before {
	content: "\e030";
}
.fooicon-plus:before {
	content: "\f067";
}
.fooicon-minus:before {
	content: "\f068";
}
.fooicon-loader:before {
	content: "\f110";
}

.fooicon-sort:before {
	content: "\f0dc";
}
.fooicon-sort-asc:before {
	content: "\f160";
}
.fooicon-sort-desc:before {
	content: "\f161";
}



/*info 區塊*/
.info-text {
    background: #d1d1d1;
    border-radius: 2px;
    font-size: 1.2rem;
    line-height: 1.4;
    padding: 25px 30px;
    position: relative;
    box-shadow: 3px 3px 0 white;
    overflow: hidden;
    border-radius: 15px;
}

.info-text h3{ border-bottom:1px solid #333;padding-bottom:10px}

.info-text:after {
    content: 'i';
    width: 90px;
    height: 90px;
    position: absolute;
    right: -15px;
    bottom: -15px;
    font-family: Georgia;
    font-style: italic;
    border: 4px solid rgba(255, 255, 255, 0.5);
    color: rgba(255, 255, 255, 0.5);
    text-align: center;
    line-height: 82px;
    border-radius: 50%;
    font-weight: bold;
    font-size: 44px;
}



@media print {
    #top-bar,#top-search,#primary-menu-trigger,footer,#gototop,#social-button{display: none}
}

@media (min-width: 992px) {
        /*固定表頭*/
    .table-scroll {
	position: relative;
	max-width: 1400px;
	z-index:1;
	margin: auto;
	overflow-y:scroll;
	height: 700px;
    }

    .table-scroll table {
        width: 100%;
        margin: auto;
        border-collapse: separate;
        border-spacing: 0;
    }
    .table-wrap {
        position:relative;
    }
    .table-scroll th, .table-scroll td {

        vertical-align: top;
    }
    .table-scroll thead th {
        position: relative;
        z-index:1;
        position: -webkit-sticky;
        position:sticky;
        top:0;
    }
    /* safari and ios need the tfoot itself to be position:sticky also */
    .table-scroll tfoot,.table-scroll tfoot th, .table-scroll tfoot td {
        /*position:-webkit-sticky;
        position:sticky;*/
        bottom:0;  
        background:#f1f1f1;
    }     
}


/* events/Grid Filter: Style 2*/
.grid-filter.style-2 li{width: auto;}
.grid-filter.style-2{padding-left:0 !important}
.grid-filter.style-2 li a{
    border:1px solid #662d91;
    color:#662d91;
    font-size:1em;
    border-radius:25px
}
.grid-filter.style-2 li.activeFilter a {
	color: #FFF !important;
	margin: 0;
    background:#662d91;
}




/*文藝清華*/
.film{padding:20px;text-align:center}
.film a{border-bottom:0px !important;text-decoration: none}
.film img{width:80%;margin-bottom:15px;transition: .2s;}
.film img:hover{opacity:.8}