/* ==========================================================================
*
* Custom CSS Stylesheet. This is where you should add your own styles!
*
** ========================================================================== */

/* Simple style overrides or custom adds */

body {
	font-size: 1rem;
    position: relative;
}

#main-content a {border-bottom: 1px dotted}

#content-link a,#main-content .nav a,#main-content .news a{border-bottom: 0px}

#main-content{font-size:1.2rem}
#main-content table th{background:#589eb5/*:#8e79ab#589eb5#3088a4#998bab#8e79ab#684C78*/;color:#fff; }
#main-content table th,#main-content table td{border-top:0px}
#main-content table a:hover{color:#3a1c43}
#main-content table tbody tr:last-child{border-bottom: 3px solid #ccc}
#main-content table thead th{border-bottom:0px}
.was-validated .form-control:invalid, .form-control.is-invalid, .was-validated
.custom-select:invalid,
.custom-select.is-invalid {
  background:  rgba(220, 53, 69, 0.25);
    
    
}
.col-form-label{font-weight: bold;}

.team-member .mmb-title {font-size:1.2em;font-weight:bold}
.team-member .mmb-position {color:#2a83ed; margin-bottom:20px; font-size:1em; padding:0 15px;}
.team-member .mmb-desc {font-size:0.8em}

/*常問問題*/
.acc-group>div a{border-bottom: 0px !important}

.datepicker{font-size:0.86em}
.policy{padding:0;line-height: 1em;font-size:0.8em}
.indent01{padding-left:2em;text-indent : -2em ;}
.indent02{margin-left:2em}

.btn{font-size:0.8em}
dt{float:left;}
dd{margin-left:3em;padding:0 0 0.5em 2em}


caption::before {content: "\f05a"; font-family: 'Font Awesome 5 Free'; font-weight: 900;}
.content h2{border-bottom:0px solid #6BB3B3;font-weight:bold;margin:0.8em 0;color:#6BB3B3;padding-left:0px;margin-top:1em}
.content h2:before{content:"\f0c8";font-family: 'Font Awesome 5 Free'; font-weight: 900;width:1em;height:1em;padding:0 0.5em 0.8em 0}


.content h3{font-weight:bold;margin-top:1.5em}
.content h3::before{content:"\f0a9";font-family: 'Font Awesome 5 Free'; font-weight: 900;padding:0 0.5em 0.8em 0;font-size:0.8em}

.card h3{margin-top:auto;padding-left:0}
.card h3::before{content:"";padding:0}

#content-link{background:#eeeeee; padding: 20px 25px; border-radius: 3px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.15);z-index:2}
#content-link a.active{color:#fff}

#content-link .nav-pills .nav-link.active{color:#ccc; background-color:;}
.breadcrumbs2 {margin-bottom:1em}


#main-content table ul{margin-bottom:0}

.subheader-maintitle{color:/*#F2B64E*/;font-weight: bold}




.card{padding:0}
.card-header{font-weight:bold;background:#00b1cd;color:#fff}

.card-title{font-weight: bold;color:#6BB3B3!important;}

.card-title a{
display: block;
color:#6BB3B3 ;
border-bottom:0px !important;
}

.card-title a.collapsed{
    color:#535353
  
}

.card-title a:before {
  content: "\f068";
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

.card-title a.collapsed:before{
  content: "\f067";
}

.sp{color:mediumvioletred;}

.list01 li{width:50%;float: left}
.list02 li{width:45%;float: left;margin-right:2em}


/*doc typd img*/

a[href$=".odt"]:after{content:url(../image/odt_s.png);}
a[href$=".pdf"]:after{content:url(../image/pdf_s.png);}



.custom-control-label::before,.custom-control-label::after {top:0.4rem}



/*logo陰影*/
#logo img{-webkit-filter: drop-shadow(2px 2px 0px rgba(0, 0, 0, 1));
    filter: drop-shadow(2px 2px 0px rgba(0, 0, 0, 1))}

/*分群*/
.chaser .topnav--lang,.chaser .topnav--user {display: none;}
.topnav--user .user .pPanel{position: absolute; left: auto; width:auto; min-width: 120px; height:0; opacity:0; visibility: hidden; margin-left: -11px; right: 0;}
.topnav--user .user .pPanel .inner{margin:4px; list-style:none; background: #f9f9f9; padding: 10px 0; margin-top:5px; position:relative; box-shadow: 0 0 5px rgba(0,0,0, 0.4); border-radius:2px;}
.topnav--user .user:hover .pPanel{opacity:1; height:auto; visibility: visible; z-index: 11;}
.topnav--user .user .pPanel .inner .topuser-item.active,
.topnav--user .user .pPanel .inner .topuser-item:hover
 {background: rgba(80, 80, 80, 0.1);}
.topnav.topnav--user ul.inner {padding-left: 0; padding-right: 0;}
.topnav.topnav--user .user .pPanel {left: 0; min-width: 110px;}
.topnav.topnav--user .topuser-item {margin: 1px 0; position: relative; text-transform: uppercase;}
.topnav.topnav--user .topuser-item a {display: inline-block; width: 100%; padding-right: 15px !important; padding: 6px 15px !important; font-size: 1rem; color: inherit;}
.topnav.topnav--user .topuser-item .topuser-flag {float: left; width: 23px; margin-right:9px;}
.topnav.topnav--user .topuser-item.active::before {content: "\f00c"; font-family: 'Font Awesome 5 Free'; font-weight: 900; position: absolute; right: 10px; top: calc(50% - 12px); font-size: 14px;}



.site-header-main-wrapper{margin-top:-10px}



/*選單*/
.main-nav ul ul.sub-menu{border-radius:7px;padding:0}
.main-nav ul ul.sub-menu li a {min-width: 205px; border-bottom-width: 0px;font-size: 1rem; color: #757575; position: relative; text-transform: uppercase;}

.main-menu li a{font-weight:bold !important} 
.main-nav .hg_mega_container {border-radius:7px}
.main-nav .hg_mega_container li a {font-size: 1em;}
.main-nav .hg_mega_container li a {color: rgba(0,0,0,.7);}
.main-nav .hg_mega_container li>a.zn_mega_title{font-size:1.2em;}	

	
/*選單黑底漸層*/

	.site-header .kl-header-bg {
	
	position: absolute; top: 0; left: 0; width: 100%; height:170%; opacity: .8; pointer-events: none;
	background: -moz-linear-gradient(top,  rgba(0,0,0,1)0%,rgba(0,0,0,.6)10%,transparent 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,1)), color-stop(100%,transparent)); 
	background: -webkit-linear-gradient(top,  rgba(0,0,0,1) 0%,transparent 100%); 
	background: -o-linear-gradient(top,  rgba(0,0,0,1) 0%,transparent 100%); 
	background: -ms-linear-gradient(top,  rgba(0,0,0,1) 0%,transparent 100%); 
	background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,transparent 100%) !important; 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=0 );
		
		}


/*手機版選單*/
#zn-res-menu{width:80%;}
#zn-res-menu .zn_res_has_submenu>span::before{display:block}
#zn-res-menu,#zn-res-menu li ul{background: #a963bf;}
.zn_res_has_submenu>.zn_res_submenu_trigger{text-align:right !important;padding-right:28px}
.zn_res_has_submenu>.zn_res_submenu_trigger:hover{padding-right:56px}
.main-nav > ul > li.menu-item-has-children > a:after{display:none}
#zn-res-menu li>a,#zn-res-menu li {font-size: 1em;;color:#fff;}

#zn-res-menu li>a {border-left:0px;border-bottom: 1px solid rgba(255,255,255,.2);}
#zn-res-menu li:hover {background:rgba(255,255,255,.2);}
#zn-res-menu .zn-close-menu-button,#zn-res-menu .zn-close-menu-button span{border:0px}
#zn-res-menu .zn_res_has_submenu>span,
#zn-res-menu .zn_res_menu_go_back>span { border-left: 0px;}
#zn-res-menu .zn_res_menu_go_back>a {width: 100%;}
.zn-res-menuwrapper {display: block;}
.zn-res-trigger {margin-right:0px}


/*chaser menu*/
.chaser {height:43px}
.chaser ul, .chaser li {list-style: none;}
.chaser {box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);}
.chaser .main-menu li a {color: #757575; font-size: 1em;}
.chaser .main-menu>li>a {color: rgba(255,255,255,.9); font-size: 1em;}
.chaser .main-menu li ul {background:rgba(245, 245, 245, 0.98);border-radius:0 0 7px 7px !important}
.chaser .main-menu .hg_mega_container{border-radius:0 0 7px 7px;box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);}
.chaser .main-menu li li:hover > a:not(:only-child) + .sub-menu {left: 100%; top: -4px;}
.chaser .main-menu li:hover > a,
.chaser .main-menu li a:hover {color:#a963bf; background:none;}
.chaser .main-menu .hg_mega_container ul {min-width:190px;}/*影響非megatitle hover底線寬度*/
.chaser .main-menu .hg_mega_container  li ul{padding:0}
.chaser .main-menu  li:active a.zn_mega_title{color:#a963bf}
.chaser .main-menu .hg_mega_container li.active > a.zn_mega_title {color: #a963bf;}

/*非megatitle hover效果*/
.chaser .main-menu .hg_mega_container li a:not(.zn_mega_title):after{
	    content:''; display:block; position:absolute; width:0; height:2px;
	    padding:inherit 0px!important;
		left:0px !important;	
		overflow:hidden}
.chaser .main-menu .hg_mega_container li a:not(.zn_mega_title):hover:after{
	    width:100%; 
		background-color:#a963bf; bottom:0; -webkit-transition: width .15s cubic-bezier(0.680, 0, 0.265, 1); 
		transition: width .15s cubic-bezier(0.680, 0, 0.265, 1);
}


/*首頁查詢框*/

.search_box{
	padding: 40px 30px; color: #fff;position: relative;clear: both;
	background: linear-gradient(175deg,  #a963bf 0%, #370A45 100%);
	border-radius:6px
}
.search_box .ac-btn {margin: 0; display: inline;}
.search_box .ac-btn:last-child {margin-left: 15px;}

.elm-searchbox select{ height:50px; float:left;border:0; vertical-align: middle; outline:none; margin:0; top:0; }

#index{border-radius: 4px; box-shadow: 0px; position: relative;}
#index select {padding-left:0.5em;width:120px;}
#index select option{color:#333;}
#index select {border:1px solid rgba(255,255,255,0); border-right:0; background:rgba(255,255,255,.2);font-size: 1.2em;
	
	-webkit-appearance:none!important;
	-moz-appearance:none !important;
	-ms-appearance:none !important;
	appearance:none !important; 
	color:#fff; border-radius:4px 0 0 4px}

#index span ::-ms-expand {display:none;}/*取消IE預設的選單*/
#index span:after{
    content:"";
    position:absolute;
    z-index:2;
    left:100px;
    top:50%;
    margin-top:-3px;
    height:0;
    width:0;
    border-top:6px solid #fff;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
    pointer-events:none;}/*選單箭頭*/

#index .elm-searchbox__submit {width:50px !important;border:0px;background:rgba(255,255,255,.2);border-radius:0 5px 5px 0}
#index .elm-searchbox__submit:after { content:'  '; position: absolute; width: 0px; height:86%; top:7%; left:0; 
	background-color: rgba(255,255,255,0.7) }
#index .elm-searchbox__input{width:calc(100% - 170px) !important;border-radius:0px;border:0px;font-size:1.2em;background:rgba(255,255,255,.2)}
#index .elm-searchbox__input-text {padding-left:100px;font-size:1em;border:0px;}
#index .elm-searchbox__input:focus { padding-left: 20px; }

#index #info{width:35px !important;height:35px;margin:7px 0 0 10px;border:0px;background:rgba(255,255,255,.2);border-radius:50%;color:#fff;font-size:15px;padding-top:10px;text-align:center;}



.search_box .ac-buttons a{padding:5px 0.8em;display:block;font-size:0.9em;color:#fff;border:1px solid rgba(255,255,255,.5);border-radius:4px;margin:0 0em;font-weight:normal;text-align:center;line-height:1.3em;background:rgba(255,255,255,0)}
.search_box .ac-buttons a:hover{/*color:#F2B64E*/;box-shadow: 0 10px 2px -6px rgba(0,0,0,0.1); }
.search_box .ac-buttons a:hover {transform:translateY(-5px);color:rgba(255,255,255,.9) !important;transition: .2s ease-in-out;}

.search_box .ac-buttons a {float: left}
.search_box .ac-buttons a:nth-child(1) {width:8em;}
.search_box .ac-buttons a:nth-child(2) {width:8em}
.search_box .ac-buttons a:nth-child(3) {width:4em;}
.search_box .ac-buttons a:nth-child(4) {width:4em;}
.search_box .ac-buttons a:last-child {width:5em;}



/*首頁最新消息*/


/* Latest Posts Default 
.latest_posts.default-style .hoverBorder {margin-bottom: 10px;}
.latest_posts.default-style .hoverBorder h6 {position: absolute; left: -10px; bottom: 16px; color: #fff; padding: 11px 14px; background: #a963bf; font-size: 0.9rem; font-weight: 500; line-height: 1; margin: 0; border-radius: 2px;z-index:1}
.latest_posts.default-style .hoverBorder:hover h6 {left: 15px; background: #fff; color: #a963bf;}
.latest_posts.default-style a + em {font-size: 0.9rem; color:#7d7d7d;}
.latest_posts.default-style .post {margin-bottom: 30px;}
.latest_posts.default-style .post .m_title {font-style: italic; font-size: 1.2rem; line-height: 1.4; margin-top: 10px;}
.latest_posts.default-style .post em {display: block;}
.latest_posts.default-style img {box-shadow: 0 1px 1px rgba(0,0,0,.22);}


.latest_posts.default-style .hoverBorder h6 {z-index:1}
.latest_posts.default-style .post .m_title {font-style: normal; font-size: 1.2rem; line-height: 1.6; margin-top: 10px;}
.theHoverBorder,.hoverBorder:after {box-shadow:none }
.theHoverBorder:hover,.hoverBorder:hover:after { box-shadow:none}
.latest_posts.default-style h2 a{display: }
*/

.news{margin-bottom:2em}
.news a{color:gray}
.news a:hover{color:#a963bf}
.news .wrap{margin-bottom:10px;display:inline-block;position:relative;-webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out;}
.news .wrap:hover img { border-radius:2px; opacity:0.8; }
.news span{position: absolute; left: -10px;bottom: 16px; color: #fff; padding: 11px 14px; background: #a963bf; font-size: 0.9rem; font-weight: 500; line-height: 1; margin: 0; border-radius: 2px;z-index:1;-webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out;}
.news .wrap:hover span {left: 15px; background: #fff; color: #a963bf;}
.news em{color:#7d7d7d;font-size:0.8em;line-height:1em;}
.news h2{font-weight:bold;color:#333;border:none;padding:0}
#index_news h2{font-size:1.2em;font-weight: normal}
.news img{width: 100% !important;}

.news p{font-size:0.8em;
width:100%;
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}/*文字溢出chorme設定*/

.news p {
    position:relative;
    line-height:1.7em;
    /* 高度为需要显示的行数*行高，比如这里我们显示两行，则为3 */
    height:3.4em;
    overflow:hidden;
}/*文字溢出非chorme設定*/
.news p::after {
    content:"...";
    position:absolute;
    bottom:0;
    right:0;
    padding:0 0.5em;
	background:#fbfbfb;
}/*文字溢出非chorme設定*/






.btn-fullcolor:hover,.btn-fullcolor.btn-skewed:hover:before,.cart-container .buttons .button.wc-forward:hover {background-color: /*#a41a1b*/#F2B64E}
a.btn{border-bottom: 0px !important;}


/*展覽活動*/

#banner .kl-slideshow-safepadding {padding-top:50px }
#banner .hg_simple_slider_container {height:auto}
#banner .hg_simple_slider-itemimg {height:100%}

/*
#banner .kl-flex--classic .hg_simple_carousel-nav {position: absolute;width:100%;right:0;top:45%}
#banner .hgSlickNav-arr.hgSlickNav-prev {position:absolute;left:-40px;}
#banner .hgSlickNav-arr.hgSlickNav-next {position:absolute;right:-40px}




#banner .hg_simple_carousel{z-index: 2;}

*/

/*新到館藏*/
#books .kl-slideshow-safepadding {padding-top:50px }
/*
#books .kl-flex--classic .hg_simple_carousel-nav {position: absolute;width:100%;right:0;top:45%;}
#books .hgSlickNav-arr.hgSlickNav-prev {position:absolute;left:0;}
#books .hgSlickNav-arr.hgSlickNav-next {position:absolute;right:0}
#books .hg_simple_carousel{width:80%;margin:0 auto;z-index: 2}

#books .hg_simple_carousel li{padding:1em} 


*/
#books .hg_simple_slider_container {height:auto}
#books .hg_simple_slider-itemimg {height:250px;width: auto}





/*特藏輪播*/
.sc_carousel-item {float: left; text-align: center; margin: 0; padding: 0 20px 0 0;}

.sc_carousel-item a{
	position: relative;
	display: block; padding: 0; margin: 0; line-height: 0;
    opacity: 1;
	background:rgba(255,255,255,.7);
	border-radius:5px	
}

.sc_carousel-item a h4{font-size: 1rem; line-height: 1.4; color: #666; padding: 15px 10px; margin: 0;font-weight:bold}
.sc_carousel-item img {
  display: block;
  width: 100%;
  height: auto;
  border-radius:5px 5px 0 0;
}
.sc_carousel-item .overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: rgba(58,28,67,0.95);
}
.sc_carousel-item a:hover .overlay {
  opacity: 1;
  border-radius:5px;
}

.text {
  color: white;
  font-size: 1em;
  position: absolute;
  top: 50%;
  left: 50%;
  line-height:1.5em;
  width:80%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
	
}


/*footer*/
#footer{background:#3a1c43;border-top: 0px;padding-bottom:50px}
#footer .social-icons{float:left;margin:0;padding:0}
#footer .social-icons li:first-child {margin-left:-10px;}
#footer ul, #footer li {list-style: none; margin: 0; padding: 0;}



/*每頁標題*/
.page-subheader {min-height:200px; background-color: #370A45;}
.page-subheader .ph-content-wrap {width: 100%; padding-top:100px;height: 200px; min-height: 270px;}
.subheader-titles {text-align:center; margin-top: -7px;}




.content h1{color:#F2B64E;font-weight:bold}
.content h1:after{content: '';width:100%;height:5px;margin-top:0.5em;background:/*#e2e2e2*/ #F2B64E;display: block;margin-bottom:1em}

.link{background:#efefef;padding:1em;margin-top:1em;word-wrap: break-word;word-break: break-all;}
.link ul{font-size:0.9em;padding-left:1.5em}
.link li a{border-bottom: 0px}
/*
.content ul,.content li {list-style: unset !important; margin-left:2em}
.content ol {margin-left:2em}
*/



.content .sidebar ul, .content .sidebar li, .breadcrumbs li{list-style:none !important;margin-left:0;}
.sidebar .widget .widgettitle {color: #050505; line-height: 1.4; margin: 10px 0 15px; padding-bottom: 20px; position: relative; font-size: 1em;font-weight:bold }
.eBlog.itemView .itemBody {width:100% }

.eBlog .post_details:before {height: 0px;margin-top:-1em}




/*最新消息*/
.eBlog.itemView .itemBody p.text_over{
width:100%;
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}/*文字溢出chorme設定*/

.eBlog.itemView img{padding:1em 0;text-align:center;display: block}


.eBlog.itemView .itemBody p.text_over {
    position:relative;
    line-height:1.7em;
    /* 高度为需要显示的行数*行高，比如这里我们显示两行，则为3 */
    height:5.1em;
    overflow:hidden;
}/*文字溢出非chorme設定*/
.eBlog.itemView .itemBody p.text_over:after {
    content:"...";
    position:absolute;
    bottom:0;
    right:0;
    padding:0 0.5em;
	background:#fbfbfb;
}/*文字溢出非chorme設定*/


/* FIRST LEVEL */


/* ==========================================================================
** Responsive styles custom rules
* These rules are ready to be used for either overrides
* or just your own custom rules.
========================================================================== */


/** Higher screens+ **/
@media only screen and (min-width : 1921px){

}


/** Desktop+ **/
@media (min-width: 1200px) {
	.hg_mega_container {width: 1140px !important;position:absolute;left:8% !important}/*設定選單位置*/
	.main-menu >li>a{font-size:1.3rem !important;font-family:"SimSun" !important}/*第一層選單大小字形*/
	.container {max-width: 1400px;}/*框架寬度原1140px*/
	.chaser .main-menu .hg_mega_container {width: 1370px !important;}/*width: 1110px*/
    #content p{font-size:1em}
    
    
	
	
    /*固定表頭用scroll*/
    .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;
    }


    
    
}


/** Laptop **/
@media (max-width: 1200px) {

}


/** Laptop+ **/
@media (min-width: 991px) {
    
    .portfolio-item-content.pinned {top: 43px !important;}

}


/** Laptop **/
@media (min-width: 992px) and (max-width: 1199px) {

}


/** Large Tablets **/
@media (max-width: 992px) {

        .portfolio-item-content.pinned {top: 0px !important;}
   

}


/** Tablets (landscape mode)  **/
@media (min-width: 768px) and (max-width: 991px) {
	

	.search_box .ac-buttons a{margin-top:1em}


}


/** Tablets+  **/
@media (min-width: 768px) {

}


/** Tablets (portrait mode)  **/
@media (min-width : 481px) and (max-width : 768px) {
	

}


/** Smartphone landscape mode / Mini Tablet **/
@media (max-width: 767px) {
	
	.site-header-main-center{margin-right:0;padding-right:0}
	.kl-header-bg{display: }/*none*/
	.search_box.ac-buttons a{display: inline-block}
	.search_box .ac-buttons a{float: left;margin:10px 10px 0 0}
	.content h1{font-size:1.5em}
	#logo img{width:90%}
	.list02 li{clear:left;width: 100%}

    
	/*
	.page-subheader {min-height:150px;}
    .page-subheader .ph-content-wrap {width: 100%; height: 150px; min-height: 150px;}*/

}


/** Smartphone landscape mode / Mini Tablet **/
@media (max-width: 600px) {

}


/** Smartphone portrait mode **/
@media (max-width: 480px) {
	#main-content{font-size:1em}
	#logo img{width:90%}
    .search_box .ac-buttons a:nth-child(1),.search_box .ac-buttons a:nth-child(2){width:46% !important;}

}


/** Normal phone portrait mode+ **/
@media (min-width: 320px) {
	.search_box.ac-buttons a{float: left;margin:10px 10px 0 0}
	
	

	
}



.footable-details th{background:#ccc;color:#3a1c43}
.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 5 Free' !important;
	
	font-style: normal;
	font-weight: 900;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
    padding-right:10px;
    color:#ccc;
    
}
.fooicon:before,
.fooicon:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.fooicon-loader:before {
	content: "\e030";
}
.fooicon-plus:before {
	content: "\f067";
}
.fooicon-minus:before {
	content: "\f068";
}
.fooicon-loader:before {
	content: "\f110";
}


.hover-box a{background-color:#a963bf !important; color:#fff;background:transparent !important}


.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}


.modal h2{border-bottom:0px solid #6BB3B3;font-weight:bold;margin:0.8em 0;color:#6BB3B3;padding-left:0px;margin-top:1em}
.modal h2:before{content:"\f0c8";font-family: 'Font Awesome 5 Free'; font-weight: 900;width:1em;height:1em;padding:0 0.5em 0.8em 0}
.modal h3{font-weight:bold;margin-top:1.5em}
.modal h3::before{content:"\f0a9";font-family: 'Font Awesome 5 Free'; font-weight: 900;padding:0 0.5em 0.8em 0;font-size:0.8em}
.modal{margin:5em auto !important}
.modal{width:100%;max-width:1200px !important}



/* Call to action button in demo */
.buybtn-panel { position: fixed; z-index: 999; top: 300px; left: 0; padding: 10px; background: rgba(0,0,0,0.7); 
	transition: .3s, transform .3s;width:270px;height:336px;border-radius: 0 5px 5px 0;padding-right:30px

}

.buybtn-panel a:nth-child(2){margin-top:10px}

.buybtn-close {position: absolute; top:10px;left:calc(270px - 15px); cursor: pointer; display: block;width: 40px; right: 0; font-size: 16px; 
	color: rgba(255,255,255,.69);writing-mode:vertical-rl;height:150px;padding: 0;padding-top:30px;color:#fff !important;font-weight: bold}

.buybtn-close:before {position: absolute; top: -10px;left:0px;content: "\f0d9";font-family: 'Font Awesome 5 Free'; font-style: normal; font-weight: 900;color:#fff;height: 40px; width: 40px;font-size:24px;text-algin:center}
.buybtn-close:hover { color: rgba(255,255,255,.9)}

.buybtn-cta { background: #0ca919; border-radius: 2px; padding: 10px 20px; color: #fff; font-weight: 600; font-size: 12px; width: 160px; 
	display: inline-block; text-align: center}
.buybtn-cta span { opacity: .5; display: inline-block; border-left: 1px solid #fff; width: 1px; margin: 0 7px; height: 20px; vertical-align: middle;}
.buybtn-cta:hover,
.buybtn-cta:focus {background: #179f07;color: #fff;}
.buybtn-panel.is-hidden { left: -240px;-webkit-transition: left .3s ease-out; transition: left .3s ease-out;height:170px;width:270px
 }

.buybtn-panel.is-hidden img{opacity: 0}
.buybtn-panel.is-hidden .buybtn-close:before { content: "\f0da"; font-family: 'Font Awesome 5 Free'; font-style: normal; font-weight: 900;font-size:24px}


/*身分別icon*/
.kl-iconbox--sh-circle span.kl-iconbox__icon {display: inline-block; border-radius: 50%; vertical-align: middle; position: relative; z-index: 1; background-color: #e74c3c; color: #fff; font-size: 35px;width:80px;height:80px; justify-content:center}
.kl-iconbox__inner{min-height:350px}
.kl-iconbox h3::before{display:none }
.kl-iconbox--sh-circle span.kl-iconbox__icon {background-color: transparent/*#e74c3c*/;transition:all .15s ease-out;;box-shadow:inset 0 0 0 2px;color:#a963bf }
.kl-iconbox__title {color: #535353}
.kl-iconbox--sh-circle:hover span.kl-iconbox__icon{color:#fff;box-shadow:inset 0 0 0 40px #a963bf}
.kl-iconbox--sh-circle:hover span.kl-iconbox__icon:after {-webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); opacity: 1; ;background-color: rgba(0, 0, 0, 0.07);}
.kl-iconbox__icon-wrapper{margin-bottom:0px}