@charset "utf-8";
/* CSS Document */
/*----------------------------------------------------------------------*/
#KeyVisual { box-sizing:border-box; clear:both; position:relative; z-index:998; overflow:hidden; }
#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; }
	/* 不顯示子項目 */
	ul.bxSlider_list li { float:left; list-style:none; position:relative; display:none; }
	/* 顯示第一筆項目 */  
	ul.bxSlider_list li:first-child { display:block; }
	/* 當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%; }

@media screen and (max-width: 639px) {
#KeyVisual .bxSlider_list li img.landscape { display:none; }
}
@media screen and (min-width: 640px) {
#KeyVisual .bxSlider_list li img.portrait { display:none; }
}
#KeyVisual .bxSlider_list li a[href="javascript:;"] { cursor:default; }

/* 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:999; }

/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-controls-direction a.disabled { display:none; }
.bx-wrapper .bx-controls-direction a { 
	display:block; position:absolute; font-size: 0; z-index:9999;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
.bx-wrapper .bx-controls-direction a { background-color: rgba(255,255,255,.5); top:50%; border-radius: 50%; box-shadow: 0 4px 20px rgba(0,0,0,.2); }
.bx-wrapper .bx-controls-direction a:hover,
.bx-wrapper .bx-controls-direction a:focus { background-color: #e82d34; }
.bx-wrapper .bx-controls-direction .bx-prev { left:20px; }
.bx-wrapper .bx-controls-direction .bx-next { right:20px; }
.bx-wrapper .bx-controls-direction a { width:40px; height:40px; margin-top:-20px; }

.bx-wrapper .bx-controls-direction a::after { 
	content:''; position:absolute; top:50%; width:10px; height:10px; 
	border-top:1px solid #000; border-right:1px solid #000;	margin-top: -5px;
    -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease;
}
.bx-wrapper .bx-controls-direction a:hover::after,
.bx-wrapper .bx-controls-direction a:focus:after {
    border-color: #fff;
}
.bx-wrapper .bx-controls-direction .bx-prev::after { -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); transform: rotate(-135deg); left: 42%; }
.bx-wrapper .bx-controls-direction .bx-next::after { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); right: 42%; }

/* PAGER */
.bx-wrapper .bx-pager { position:absolute; bottom:20px; width:100%; z-index:9999; text-align:center; }
.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item { display:inline-block; }
.bx-wrapper .bx-pager.bx-default-pager a { 
	text-indent:-10000px; display:block; width:10px; height:10px; margin:0 0.78125vw; background:#ffffff; opacity:0.45; 
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	border-radius:50%;
	}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a:focus,
.bx-wrapper .bx-pager.bx-default-pager a.active { background:#e82d34; opacity:1; }

/* 首頁輪播 */
.index_slider_wrap { box-sizing:border-box; clear:both; position:relative; z-index:998; }
.index_slider_wrap .bx-viewport { z-index:9998; position:relative; zoom:1; }
.index_slider_wrap .bx-wrapper { position: relative; margin: auto; padding:0; *zoom:1; }

.index_slider_wrap .bx-wrapper .bx-controls-direction a { box-shadow: 0 2px 10px rgba(0,0,0,.2); }
.index_slider_wrap .bx-wrapper .bx-controls-direction .bx-prev { left:5px; }
.index_slider_wrap .bx-wrapper .bx-controls-direction .bx-next { right:5px; }

.index_slider_wrap .bx-wrapper .bx-pager { position: relative; bottom: 0; margin-top: 20px; }
.index_slider_wrap .bx-wrapper .bx-pager.bx-default-pager a { background-color: #ccc; }

.index_cont_st1 .bx-viewport .index_slider .picTextBox { margin: 15px; }

/* 以下已刪除 */
#KeyVisual .info { position:absolute; z-index:88; }
#KeyVisual .inner > div { width:220px; margin-bottom:10px; box-shadow:0px 0px 8px rgba(0,0,0,.5); }
#KeyVisual .box1 { position:relative; height:220px; width:220px; }
#KeyVisual .box1 img { width:100%; opacity:.8; }
#KeyVisual .box1 a { color:#fff; }
#KeyVisual .box1 .mark { position:absolute; left:0; top:0; height:100%; background:rgba(0,0,0,.5); width:100%; }
#KeyVisual .box1 .mark .top { padding:14px 15px 14px 38px; position:relative; font-size:.9375em; }
#KeyVisual .box1 .mark .top:before {
	content:""; width:1px; height:50px; background:rgba(255,255,255,.6); display:block; position:absolute; left:30px; top:5px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}
#KeyVisual .box1 .mark .top span { display:block; line-height:1.4em; }
#KeyVisual .box1 .mark .top span:first-child { margin-left:17px; text-shadow:0px 0px 1px rgba(0,0,0,.75); }
#KeyVisual .box1 .mark .top .en { font-family:Arial; font-size:.75em; opacity:.6; }
#KeyVisual .box1 .mark .bottom { position:absolute; bottom:0; left:0; padding:15px; text-shadow:0px 0px 1px rgba(0,0,0,.75); line-height:1.4em; }
#KeyVisual .box1 .mark, #KeyVisual .box1 img { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }
#KeyVisual .box1 a:hover .mark { opacity:0; }
#KeyVisual .box1 a:hover img { opacity:1; }

#KeyVisual .box2 { background:#e82d34 url(../images/icon_big_time.png) no-repeat 15px center; color:#fff; padding:22px 15px 22px 75px; box-sizing:border-box; }
#KeyVisual .box2 span { display:block; line-height:1.3em; }
#KeyVisual .box2 .t1 { letter-spacing:8px; font-size:1.25em; padding-bottom:2px; }
#KeyVisual .box2 .t2 { font-size:.825em; }
#KeyVisual .box2 .t3 { font-size:1.5em; font-family:Arial; }
#KeyVisual .box2.close { background-color:#1c268a; }

/*----------------------------------------------------------------------*/
#Center { background:#f6f6f6; }
#Center .inner { box-sizing:border-box; }
#Center .bg2 { background:#ebebeb url(../images/bg2.jpg) no-repeat bottom center; }

/*----------------------------------------------------------------------*/
/* 共用樣式一 */

/* 標題 */
.index_cont_st1 .indexTitleBox { text-align:center; position:relative; max-width:760px; margin:0 auto; padding:15px 0; }
.index_cont_st1 .indexTitleBox h2 { font-size:1.5em; letter-spacing:2px; padding-left:2px; }
.index_cont_st1 .indexTitleBox:before { content:""; background:#c5c5c5; height:1px; position:absolute; top:50%; z-index:1; }
.index_cont_st1 .indexTitleBox:after { content:""; background:#f6f6f6; display:block; width:180px; height:1px; position:absolute; top:50%; left:50%; margin-left:-90px; z-index:1; }
.index_cont_st1 .indexTitleBox .title { position:relative; z-index:2; background:#e82d34; color:#fff; display:inline-block; width:150px; height:150px; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; box-sizing:border-box; padding-top:40px; box-shadow:0px 0px 10px rgba(0,0,0,.2); }
.index_cont_st1 .indexTitleBox .title:after { content:""; display:block; width:0; height:0; border:5px solid #fff; border-color:#fff transparent transparent; display:inline-block; margin-top:15px; }
.index_cont_st1 .indexTitleBox .en { font-family:Arial; font-size:0.75em; display:block; }

/* animate */
.index_cont_st1 .indexTitleBox .title {
	visibility:hidden; opacity:0;
	transform:scale(0.5); -ms-transform:scale(0.5); -moz-transform:scale(0.5); -webkit-transform:scale(0.5); -o-transform:scale(0.5);
}
.index_cont_st1.show .indexTitleBox .title {
	visibility:visible; opacity:1;
	transform:scale(1); -ms-transform:scale(1); -moz-transform:scale(1); -webkit-transform:scale(1); -o-transform:scale(1);
}
.index_cont_st1 .indexTitleBox:before { width:0%; left:50%; }
.index_cont_st1.show .indexTitleBox:before { width:100%; left:0; }
.index_cont_st1 .indexTitleBox .title, .index_cont_st1 .indexTitleBox:before, .index_cont_st1 .picTextBox { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

.index_cont_st1.blue .picTextBox { opacity:0; }
.index_cont_st1.blue.show .picTextBox { opacity:1; }
.index_cont_st1.red .index_slider_wrap { opacity:0; }
.index_cont_st1.red.show .index_slider_wrap { opacity:1; }

/* 內容 */
.index_cont_st1 { padding:15px 0; }
.index_cont_st1 .picTextBox { background:#fff; box-shadow:0px 0px 15px rgba(0,0,0,.1); margin-bottom:35px; }
.index_cont_st1 .picTextBox:last-child { margin-bottom:0; }
.index_cont_st1 .imgBox .img { height:0; padding-bottom:100%; background-size:cover; background-position:center center; }
.index_cont_st1 .textBox { line-height:1.25em; padding:35px 15px 15px; }
.index_cont_st1 .textBox .date { font-size:0.75em; color:#989898 }
.index_cont_st1 .textBox .title h3 { font-size:1.75em; line-height:1.25em; }
.index_cont_st1 .textBox .title h3 a { color:#e82d34; text-decoration:none; }
.index_cont_st1 .textBox .title h3 a:hover { text-decoration:underline; }
.index_cont_st1 .textBox .dep { line-height:2.25em; color:#5d5d5d; margin-bottom:20px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; }
.index_cont_st1 .textBox .more a { display:inline-block; padding:0 28px; font-size:0.875em; letter-spacing:2px; height:40px; line-height:40px; background:#e82d34; color:#fff; text-decoration:none; box-shadow:4px 4px 0px #ccc; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; }
.index_cont_st1 .textBox .more a:after {
	content:''; display:inline-block; vertical-align:middle; margin:-2px 5px 0 8px; width:7px; height:7px; border-top:1px solid #fff; border-left:1px solid #fff;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    transform: rotate(135deg);
}
.index_cont_st1 .textBox .more a:hover { box-shadow:none; margin:4px 0px 0px 4px; }

/* 常設展 */
.index_cont_st1.blue .indexTitleBox .title { background:#1378ac; }
.index_cont_st1.blue .picTextBox .textBox .title a { color:#1378ac; }
.index_cont_st1.blue .picTextBox .textBox .more a { background:#1378ac; }

/*----------------------------------------------------------------------*/
/* 共用樣式二 */

/* 標題 */
.index_cont_st2 .indexTitleBox { position:relative; }
.index_cont_st2 .indexTitleBox h2 { font-size:1.875em; border-bottom:1px solid #a4a4a4; color:#000; }
.index_cont_st2 .indexTitleBox:before { content:""; display:block; width:70px; height:5px; background:#ff9c00; }
.index_cont_st2 .indexTitleBox ul { position:absolute; right:0; }
.index_cont_st2 .indexTitleBox ul li { float:left; }
.index_cont_st2 .indexTitleBox ul li:first-child { border-right:1px solid #a4a4a4; }
.index_cont_st2 .indexTitleBox ul li a { text-decoration:none; color:#000; font-size:.875em; display:block; }

/* 內容 */
.index_cont_st2 { padding:40px 0 10px 0; }
.index_cont_st2 .list:after { content:""; clear:both; display:block; }
.index_cont_st2 .list .item { float:left; box-sizing:border-box; line-height:1.4em; }
.index_cont_st2 .list .tag { background:#ff9c00; color:#fff; font-size:0.8125em; display:inline-block; padding:0 12px; }
.index_cont_st2 .list .title { padding:10px 0; border-bottom:1px solid #ddd; }
.index_cont_st2 .list .title a { text-decoration:none; color:#000; line-height:1.5em; display:block; height:3em; overflow:hidden; font-size:1.125em; }
.index_cont_st2 .list .date { color:#707070; font-size:0.8125em; margin-top:10px; }

/* hover */
.index_cont_st2 .indexTitleBox ul li a:hover { color:#e82d34; }
.index_cont_st2 .list .title a:hover { color:#e82d34; }

/* 線上報名 */
#Event.index_cont_st2 .indexTitleBox:before { background:#e82d34; }
#Event.index_cont_st2 .list .tag { background:#e82d34; }