@charset "utf-8";
body, .submit, select, input { margin:0px;	padding:0px; font-family: 微軟正黑體;}
div,/* CSS Document */ dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote {margin:0;	padding:0;}
/*table{border-collapse:collapse;border-spacing:0;}*/
fieldset, img {	border:0;}
address, caption, cite, code, dfn, em, strong, th, var {font-style:normal;	font-weight:normal;}
ol, ul {list-style:none;}
caption, th {text-align:left;}
q:before, q:after {content:'';}
a {text-decoration: none}
body { width:100%; margin:0; padding:0; background:url(images/bg.jpg) repeat;}
a[name^="a"]{position:relative; top:-60px;}

/*base*/
#append-btn, #append-list{display:none !important;}
.container{max-width:none;}
h2{clear:both; padding:20px 0; text-align:center;}
h3{clear:both;}

/*top*/
.scroll2top:link, .scroll2top:visited{background:url(images/top.png) no-repeat 0 0; height:75px; width:90px; bottom:0px;}
.scroll2top:hover{background:url(images/top.png) no-repeat 0 -80px;}

/*menu*/
.menu_x{ width:auto; max-width:950px; height:50px; background:#da3220; margin:0 auto; position:relative;}
ul.menu{ margin:0 auto; margin-left: 1px; height:50px;}
ul.menu li{float:left; border-right:1px solid #d75404; }
ul.menu li:last-child{border-right: none;}
ul.menu li a{text-shadow:0 0 10px #4b1900; display:block; font-size:20px; color:#FFFFFF; font-weight:bolder; text-align:center; display:block; min-width:157px; width:100%; line-height: 50px; height: 50px;  background:url(images/menu_li_bg.png) no-repeat center;}
ul.menu li a:hover{ color:#FFFFFF; text-decoration:none; background:url(images/menu_li_bg.png) no-repeat center #b41d0d;}
.nav0{ width:100%; height:50px; background:#da3220; margin:0 auto; position:absolute;}
.nav0.stuck{max-width:950px; position:fixed; z-index:996; top:0px; margin:0 auto;} 

/*content*/
.content{ background:#FFFFFF; display: block; max-width: 950px; margin: 0 auto; padding-bottom: 10px;}
.content img{ width:100%;}

/*sence*/
.sence{margin:15px; margin-bottom:10px; overflow: auto; background: url(images/content_bg.jpg) right -55px bottom -40px no-repeat; color: #272727;}
.sence img{max-width:300px; float:left;}
.sence .dep, .sence .dep0{ padding-left: 5px; border-left: 7px solid #818181; font-size: 1.2em; line-height: 1.7em;}
.sence .dep{margin-left: 310px;}
.sence .dep0{margin:5px 0;}
.sence p.t{ color: #da3220;  font-size:1.2em; font-weight:bolder;}
.sence p.narrative{ text-align:left; padding:0 5px;}
.caption h6{color:#da3220;}
.col-md-4{display:block; overflow: auto; margin: 15px 0;}
.col-md-4, .caption h6{font-size: 1.2em; line-height: 1.7em; text-align:center;}
.col-md-4 .caption{display:block; margin-top:5px;}
.hid{ margin-top:5px;}

/*title*/
.title{ margin:10px 0; clear: both;}
.title .h{margin:0; padding-left: 34px; border:2px solid #da3220; font-size:2em; font-weight:bolder; color:#da3220; background:url(images/h4_t.jpg) left no-repeat, url(images/h4_t_f.jpg) right no-repeat;}
.title span{color:#333333; font-weight:bolder; font-size:0.6em; margin:0 10px;}
.title p{ display:none;}


/*button*/
.btn{
margin:10px 10% 40px 10%; text-align:center; clear:both;
border: 2px solid #8b0000;
-moz-border-radius:5px;
-webkit-border-radius: 5px;
border-radius:5px;
text-shadow:0 0 10px #4b1900;
-moz-box-shadow:0 0 5px #000000;
-webkit-box-shadow:0 0 5px #000000;
box-shadow:0 0 5px #000000;}

.btn a{ color:#FFFFFF; font-size:1.6em; line-height: 2.8em; font-weight: bolder;  height:60px; display:block; 
background:url(images/btn_bg.png) center no-repeat,linear-gradient(top,#ff3e29,#bc2717);
background:url(images/btn_bg.png) center no-repeat,-moz-linear-gradient(top,#ff3e29,#bc2717);
background:url(images/btn_bg.png) center no-repeat,-webkit-linear-gradient(top,#ff3e29,#bc2717);}

.btn a:hover{text-decoration:none;
background:url(images/btn_bg.png) center no-repeat,linear-gradient(top,#bc2717,#ff3e29);
background:url(images/btn_bg.png) center no-repeat,-moz-linear-gradient(top,#bc2717,#ff3e29);
background:url(images/btn_bg.png) center no-repeat,-webkit-linear-gradient(top,#bc2717,#ff3e29);}


/* fixed bottom bar */
.container.navbar-fixed-bottom{border-top:1px solid #dedede; height:50px; padding:0 30px; z-index:600 !important; background:#ff0000; background:rgba(255,22,0,0.9);}
.btn-top{float:right; vertical-align:middle;}
.btn-top:link, .btn-top:visited{margin:3px 0 0 8px; width:72px; height:42px; text-align:center; font-weight:bold; color:#5d5d5d; border-radius:2px; background:#fff;
background: -webkit-linear-gradient(top, rgba(253,253,253,1) 0%, rgba(246,246,246,1) 38%, rgba(221,221,221,1) 100%);
background: linear-gradient(to bottom, rgba(253,253,253,1) 0%, rgba(246,246,246,1) 38%, rgba(221,221,221,1) 100%);
-webkit-box-shadow:inset 0 0 3px 2px rgba(255,255,255,.5); box-shadow:inset 0 0 3px 2px rgba(255,255,255,.5);}
.btn-top b{display:block; width:20px; height:12px; background:url(images/btn_top_arr.png) no-repeat center; margin:8px auto 0;}
.btn-push:link, .btn-push:visited{display:inline-block; vertical-align:middle; width:130px; height:40px; margin:5px 0 0; padding-left:45px; background:url(images/btn_push.png) no-repeat 0 -40px; color:#fff; line-height:40px; font-size:18px; font-weight:bold;}
.btn-push:hover{text-decoration:none;}
.btn-push.pressed{background-position:0 0; text-decoration:none;}
.drawer{position:fixed; padding-bottom:50px; width:100%; height:0; bottom:0; opacity:0; z-index:400; -webkit-transition:opacity 0.35s ease; transition:opacity 0.35s ease;}
.drawer.lifted{display:block; height:auto; opacity:1;}
.drawer a:link, .drawer a:visited{ font-family:"微軟正黑體"; padding:10px 0; text-align: center; font-size:16px; font-weight: bolder; display:block; background:#da3220 url(images/btn_bg_2.png) no-repeat center; color:#fff; border-top:1px solid #ffb8d6;}
.drawer a:hover, .drawer a:active{background-color:#ee4f3d; color:#fff;}


@media screen and (min-width: 1200px) {
.btn{ width:60%; margin-left:20%;}
.hid{ display:none;}
}
@media screen and (min-width: 992px)and (max-width:1199px){
ul.menu li a{min-width:155px;}
.nav0.stuck{max-width:940px;} 
.btn{ width:60%; margin-left:20%;}
.hid{ display:none;}

}
@media screen and (min-width: 768px)and (max-width: 991px){
ul.menu li a{min-width:119px;}
.nav0.stuck{max-width:720px;} 
.scroll2top:link, .scroll2top:visited{margin-left:805px;}
.col-md-4{ clear:both; padding: 0;}
.caption h6{ text-align: left; padding-left:11px;}
.col-md-4 .caption{margin-top:0; margin-left:310px;}
.sence p.narrative{border-left: 7px solid #818181;}
.hid{ display:none;}
}
@media screen and (max-width: 767px){
.menu_x{ display:none;}
h2{ margin:0 0 20px 0; background:#3f1e0d;  padding:0; }
h2 img{ max-width:480px;}
.title span{display:none;}
.title p{ background:#da3220; color:#FFFFFF; display:block;  font-size:1.1em;}
.sence { background:none;}
.sence img{max-width:480px; float:none;}
.sence .pic{text-align: center;}
.sence .dep, .sence .dep0{margin:0; padding:10px; border-left:none; display: inline-block;}
.sence p{ padding:5px 10px;}
.caption h6{ text-align: left; border-left: 7px solid #da3220; padding-left: 5px; margin-left:5px;}
.col-md-4{ clear:both; padding: 0;}
}
@media screen and (max-width: 480px){
.btn a{ overflow:hidden;}
.sence{ margin:0 ; margin-top: -10px; margin-bottom:10px;}
h2{ margin:0;  padding:0;}
h3{max-width:480px; overflow:hidden;}
h3 img{min-width:480px;}
}