@charset "utf-8";
/* CSS Document */
/*----------------------------------------------------------------------*/
/* KeyVisual */
#KeyVisual { box-sizing:border-box; clear:both; position:relative; z-index:998; overflow:hidden; -moz-box-shadow:0px 5px 8px rgba(0,0,0,.2); -webkit-box-shadow:0px 5px 8px rgba(0,0,0,.2); box-shadow:0px 5px 8px rgba(0,0,0,.2); }
#KeyVisual .bx-viewport { z-index:9998; position:relative; zoom:1; }
#KeyVisual .bx-wrapper { position: relative; margin: auto; padding:0; *zoom:1; }
#KeyVisual .bx-wrapper img { width:100%; }
	/* 修改Key visual圖片載入時Slider高度過高問題 */
	#KeyVisual .bxSlider_list { position:relative; background: url(../images/cover_desktop.png) no-repeat top center; width:auto; height:1000px; }
	/* 不顯示子項目 */
	ul.bxSlider_list li { /*float:left;*/ list-style:none; position:relative; display:none;  width:auto; height:1000px; }
	/* 顯示第一筆項目 */  
	ul.bxSlider_list li:first-child { display:block; width:auto; height:1000px; }
	/* 當JS執行時顯示全部 */
	div.bx-viewport ul.bxSlider_list li { display:block; }
#KeyVisual .bxSlider_list li { width:100%; }
#KeyVisual .bxSlider_list li img { width:100%; height:auto; }
#KeyVisual .bxSlider_list li a { display:block; width:100%; height:100%; }

/* DIRECTION CONTROLS (NEXT / PREV) */
#KeyVisual .bx-wrapper .bx-controls-direction a { 
	display: inline-block; position:absolute; top:50%; text-indent:10000px; z-index:9999; background-color:rgba(255,255,255,0.7); background-repeat:no-repeat;
	-webkit-box-shadow:0 0 6px rgba(0,0,0,0.2);
	-moz-box-shadow:0 0 6px rgba(0,0,0,0.2);
	box-shadow:0 0 6px rgba(0,0,0,0.2);
	}
#KeyVisual .bx-wrapper .bx-controls-direction a:hover { 
	background-color:rgba(255,255,255,0.8);
	-webkit-box-shadow:0 0 8px rgba(0,0,0,0.5);
	-moz-box-shadow:0 0 8px rgba(0,0,0,0.5);
	box-shadow:0 0 8px rgba(0,0,0,0.5);
	}
#KeyVisual .bx-wrapper .bx-prev { background-image:url("../images/icon_banner_slider.png"); }
#KeyVisual .bx-wrapper .bx-next { background-image:url("../images/icon_banner_slider.png"); }
#KeyVisual .bx-wrapper .bx-controls-direction a.disabled { display: none; }

/* PAGER */
#KeyVisual .bx-wrapper .bx-pager { position:absolute; bottom:20px; width:100%; z-index:9999; text-align:center; }
#KeyVisual .bx-wrapper .bx-pager .bx-pager-item,
#KeyVisual .bx-wrapper .bx-controls-auto .bx-controls-auto-item { display: inline-block; }
#KeyVisual .bx-wrapper .bx-pager.bx-default-pager a { 
	text-indent:-10000px; display:block; width:10px; height:10px; margin:0 5px; background:#ffffff; 
	-webkit-box-shadow:0 0 5px rgba(0,0,0,0.4);
	-moz-box-shadow:0 0 5px rgba(0,0,0,0.4);
	box-shadow:0 0 5px rgba(0,0,0,0.4);
	}
#KeyVisual .bx-wrapper .bx-pager.bx-default-pager a:hover,
#KeyVisual .bx-wrapper .bx-pager.bx-default-pager a.active { background:#ef646a; }

/* LOADER */
.bx-wrapper .bx-loading { min-height:50px; background:url(../images/bx_loader.gif) center center no-repeat #fff; height:100%; width:100%; position:absolute; top:0; left:0; z-index:2000; }

/*----------------------------------------------------------------------*/
#Center .inner:after { content:""; clear:both; display:block; }
#Center .bg1 { /*background:#ffeced url(../images/bg1.jpg) no-repeat bottom center;*/ padding:50px 0; display: none; visibility: hidden; }
#Center .bg2 { /*background:#ef646a; color:#fff;*/ display: none; visibility: hidden; }
#Center .bg3 { /*background:#efefef url(../images/bg3.jpg) no-repeat bottom center;*/ padding:50px 0; display: none; visibility: hidden; }

.more { text-align:center; }
.more a { font-size:0.875em; color:#777; text-decoration:none; display:block; }
.more a:hover { color:#ef646a; }
.more a:before { content:""; width:11px; height:11px; display:inline-block; background:url(../images/icon_search_s.png) no-repeat left top; margin-right:5px; }
.more a:hover:before { background-position:left bottom; }
.more a, .more a:before { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; transition:all 0.3s ease; }
.bg1 .indexTitleBox { padding:10px 6px 10px 25px; overflow:hidden; }
.bg1 .more { float:right; border-left:1px solid #ddd; }
.bg1 .more a { height:35px; line-height:35px; padding:0 16px; }

/*----------------------------------------------------------------------*/
/* 當期展覽 */
#CurrentExhibitions { position:relative; }
#CurrentExhibitions .indexTitleBox { background:#fff; border:1px solid #ddd; color:#555; margin-bottom:-1px; }
#CurrentExhibitions .indexTitleBox h2 { background:url(../images/icon_current.png) no-repeat 8px center; padding-left:35px; float:left; }

#CurrentExhibitions .picTextBox .item { background:#fff; border:1px solid #ddd; }
#CurrentExhibitions .imgBox .img { padding-bottom:70%; background-size:cover; background-position:center center; }
#CurrentExhibitions .textBox { color:#666; }
#CurrentExhibitions .textBox .title a { font-size:1.375em; color:#ef646a; text-decoration:none; }
#CurrentExhibitions .textBox .title a:hover { text-decoration:underline; }
#CurrentExhibitions .textBox .date, #CurrentExhibitions .textBox .time, #CurrentExhibitions .textBox .dep { font-size:0.875em; line-height:1.571425em; }
#CurrentExhibitions .textBox .tt { background:#f48489; color:#fff; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; margin-right:8px; padding:3px 10px; }
#CurrentExhibitions .textBox > div { margin-bottom:15px; }
#CurrentExhibitions .textBox .dep { color:#999; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:5; }

#CurrentExhibitions .slick-arrow { display:block; text-indent:-9999px; z-index:99; position:absolute; top:50%; width:30px; height:30px; margin-top:-15px; border:none; opacity:.6; background:url("../images/icon_slider.png") no-repeat; cursor:pointer; padding:0; }
#CurrentExhibitions .slick-arrow:hover { opacity:1; }
#CurrentExhibitions .slick-arrow:focus, #CurrentExhibitions .slick-slide:focus { outline:none; }
#CurrentExhibitions .slick-prev { left:0; background-position:0 0; }
#CurrentExhibitions .slick-next { right:0; background-position:-30px 0; }
#CurrentExhibitions .slick-slide { margin:0px; display:block; box-sizing:border-box; overflow:hidden; }
#CurrentExhibitions .slick-slide, #CurrentExhibitions .slick-arrow {
	-webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;
}
#CurrentExhibitions .slick-slide:hover { opacity:1; }
#CurrentExhibitions .slick-slide.slick-current { opacity:1; }

/*----------------------------------------------------------------------*/
/* 最新消息 */
#News, #Info { background:#fff; border:1px solid #ddd; box-sizing:border-box; }
#News .indexTitleBox { border-bottom:1px solid #ddd; }
#News .indexTitleBox h2 { color:#333; font-size:1.25em; background:url(../images/icon_news.png) no-repeat left center; padding-left:30px; float:left; }

#News .list { padding:20px 25px; }
#News .item { padding:8px 0; font-size:0.875em; }
#News .item:after { content:""; clear:both; display:block; }
#News .item > span { float:left; display:block; line-height:25px; color:#666; }
#News .item a { color:#666; text-decoration:none; line-height:25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }
#News .item a:hover { color:#ef646a; }
#News .item .tag { background:#aeb7e2; color:#fff; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; padding:0 10px; }
#News .item .date { margin:0 8px; }

/*----------------------------------------------------------------------*/
/* 當天訊息 */
#Info { color:#777; text-align:center; position:relative; display: none; visibility: hidden;}
#Info .col_left > div { position:relative; margin-bottom:10px; }
#Info .col_left > div:first-child { padding-left:135px; }
#Info .col_left > div:nth-child(2) { background:#aeb7e2; color:#fff; line-height:40px; }
#Info .col_left .t1 { color:#ddd; font-size:2.375em; font-weight:bold; font-family:Arial; position:absolute; top:2px; left:0; }
#Info .col_left .t2 { color:#7c8bd5; font-size:1.25em; border:2px solid #7c8bd5; display:block; line-height:36px; }
#Info .col_left .time, #Info .col_left .dash { font-size:1.5625em; }
#Info .col_left .time { margin-right:2px; }
#Info .col_left .dash { padding:0 10px; }
#Info .col_right a { color:#444; font-size:1.25em; text-decoration:none; width:48%; padding:10px 0 20px; float:left; background:#f5f5f5; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }
#Info .col_right a:hover { color:#7c8ad0; -moz-box-shadow:2px 2px 8px rgba(0,0,0,.2); -webkit-box-shadow:2px 2px 8px rgba(0,0,0,.2); box-shadow:2px 2px 8px rgba(0,0,0,.2); }
#Info .col_right a:first-child { margin-right:4%; }
#Info .col_right a:before { content:""; background-repeat:no-repeat; background-position:center; width:100%; display:block; height:70px; }
#Info .col_right a.visit:before { background-image:url(../images/icon_visit.png); }
#Info .col_right a.map:before { background-image:url(../images/icon_map.png); }

/*----------------------------------------------------------------------*/
/* 線上報名 */
#Event { position:relative; }
#Event:after { content:""; clear:both; display:block; }

#Event .list { padding:3px 0; }
#Event .item { position:relative; box-sizing:border-box; }
#Event .imgBox .img { padding-bottom:84.62%; background-size:cover; background-position:center center; }
#Event .textBox { line-height:1.375em; }
#Event .textBox > div { margin-top:8px; }
#Event .textBox > div:first-child { margin-top:0px; }
#Event .title a { font-size:1em; color:#fff; text-decoration:none; }
#Event .title a:hover { text-decoration:underline; }
#Event .tag { display:inline-block; font-size:0.75em; background:#faf4bd; color:#e64b51; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; padding:0 10px; }
#Event .date, #Event .dep { font-size:0.875em; }
#Event .dep { color:#ffdadb; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; }

/*----------------------------------------------------------------------*/
/* 常設展 */
#LongExhibitions .indexTitleBox { border-bottom:1px solid #999; padding:5px 0; margin-bottom:25px; }
#LongExhibitions .indexTitleBox h2 { background:url(../images/icon_current.png) no-repeat 8px center; padding-left:35px; font-size:1.25em; }

#LongExhibitions { width:100%; }
#LongExhibitions .list { overflow:hidden; padding:5px 0; width:100%; }
#LongExhibitions .item { background:#fff; border:1px solid #e5e3e1; width:31.333%; float:left; box-sizing:border-box; margin:0 1% 25px; }
#LongExhibitions .item:hover { border:1px solid #fff; -moz-box-shadow:3px 4px 6px rgba(0,0,0,.1); -webkit-box-shadow:3px 4px 6px rgba(0,0,0,.1); box-shadow:3px 4px 6px rgba(0,0,0,.1); }
#LongExhibitions .imgBox { width:100%; overflow:hidden; }
#LongExhibitions .imgBox .img { padding-bottom:70%; background-size:cover; background-position:center center; }
#LongExhibitions .imgBox:hover .img { transform:scale(1.1); }
#LongExhibitions .textBox { line-height:1.375em; padding:20px; }
#LongExhibitions .title { position:relative; padding-left:12px; }
#LongExhibitions .title a { color:#7382cb; font-size:1.125em; text-decoration:none; line-height:1.333333em; }
#LongExhibitions .title a:before { content:""; display:block; width:4px; height:20px; background:#919dd8; position:absolute; left:0; top:1px; }
#LongExhibitions .title a:hover:before { background:#444; }
#LongExhibitions .title a:hover { color:#444; }
#LongExhibitions .dep { font-size:0.875em; color:#888; margin-top:10px; }
#LongExhibitions .more { margin-top:15px; }
#LongExhibitions .more a { display:inline-block; font-size:1.125em; background:#fff; border:1px solid #e5e3e1; padding:15px 43px; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; }
#LongExhibitions .more a:hover { background:#919dd8; color:#fff; }
#LongExhibitions .more a:before { background:url(../images/icon_search.png) no-repeat left -9px; width:18px; height:18px; vertical-align:top; margin-right:6px; }
#LongExhibitions .more a:hover:before { background-position:left -44px; }

#LongExhibitions .item, #LongExhibitions .title a { -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; }
#LongExhibitions .imgBox .img { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

/*----------------------------------------------------------------------*/
/* 快速連結 */
#QuickLink { overflow:hidden; }
#QuickLink .item { position:relative; float:left; line-height:1.375em; text-align:center; background-size:cover; background-position:center; }
#QuickLink a { text-decoration:none; background:rgba(96,58,23,.3); display:block; position:absolute; left:0; top:0; width:100%; height:100%; }
#QuickLink a:hover { background:rgba(96,58,23,.7); }
#QuickLink a .textBox { display:table; width:100%; height:100%; }
#QuickLink a .textBox > div { display:table-cell; vertical-align:middle; }
#QuickLink a .title { color:#fff; border:2px solid #fff; padding:0 18px; display:inline-block; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; }
#QuickLink a .dep { color:#efefef; font-size:0.875em; text-align:left; height:0px; visibility:hidden; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:5; }
#QuickLink a:hover .dep { height:auto; visibility:visible; padding-top:15px; }

#QuickLink a { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }