@charset "utf-8";
/*  ===== 基本覆寫 ===== */
*{font-family:Verdana,微軟正黑體, Microsoft JhengHei, Arial, Helvetica, sans-serif;}
html,body{height:100%; margin:0; padding:0;}
body{overflow-x: hidden;}
/*  ===== 系統layout ===== */
.WrapperBody{}
.WrapperBody .menuwrapper{background:#e6e6e6; width:100%; z-index:99;} /* 為避免動 畫z-index 蓋住選單,需調高選單的 z-index */

#block1 .newblockline{border-bottom:1px dashed #999999; padding-bottom:5px;}
#block2{background:#182f5a;}

#block3{background:#e6e6e6;}
.WrapperBody .backTop{position:fixed; bottom:2%; right:-100px;opacity:0.7;}
.WrapperBody .backTop a{color:#fff; padding:10px 20px 10px 20px;background:#000;-webkit-border-radius:10px 0 0 10px;-moz-border-radius:10px 0 0 10px;border-radius:10px 0 0 10px; height:20px; text-decoration:none; font-size:16px;}

.WrapperFooter{}
.WrapperFooter .pagefooterblock{ padding:10px 0;background:#182f5a;}
.WrapperFooter .pagefooterblock ul{margin:0 0 0 -40px;}
.WrapperFooter .pagefooterblock li{list-style:none; float:left; width:120px;}
.WrapperFooter .pagefooterblock .clearfloat{clear:both; padding-bottom:10px;}
.linkbtn a{padding:10px 30px; text-decoration:none; margin:5px 0;}
.font-copy{color:#b4cbd3}
.font-copy a{color:#ffffff; text-decoration:none;}
.font-copy a:hover{ color:#FFEE75;text-decoration:underline;}

.padding20TB{padding-top:20px; padding-bottom:20px;}
.padding30TB{padding-top:30px; padding-bottom:30px;}

.mediablock{padding:0 5px;}
.mediablock2{padding:0 5px 10px; }
.mediablock .linkbg{background:#EFEFEF; padding:5px; border-radius:5px;}
.mediablock2 .linkbg{background:#EFEFEF; padding:5px; border-radius:5px;}
.jpimg img{width:105px; height:148px;}

/* 內頁 */
#pageheader{background:url(../images/pageheader.jpg) no-repeat top center; height:150px; width:100%;}
#CCFmap{width:100%; height:400px;}

.stripeMeCustom table{border-collapse:collapse; border:1px solid #9ac0d1;}
.stripeMeCustom table tr td{padding:8px 5px; border-collapse:collapse; border:1px solid #c1dce8; background-color:#f8fcfe;}
.stripeMeCustom th{color:#203f51; padding:10px 5px; border-collapse:collapse; border:1px solid #9ac0d1; background:#cbe2ef;}
.stripeMeCustom th a{color:#0078bc; text-decoration:none;}
.stripeMeCustom th a:hover{color:#009bf2;text-decoration:underline;}
.stripeMeCustom tr.alt td{background-color:#edf6fb;}
.stripeMeCustom tr td:first-child{border-left-color:#9ac0d1;}
.stripeMeCustom tr th:first-child{border-left-color:#9ac0d1;}
.stripeMeCustom tr td:last-child{border-right-color:#9ac0d1;}
.stripeMeCustom tr th:last-child{border-right-color:#9ac0d1;}
.stripeMeCustom tr:last-child td{border-bottom-color:#9ac0d1;}
.stripeMeCustom tr.spe td{background-color:#FEFBC2;}

/*  ===== 系統使用套件 ===== */
/* 預載畫面 */
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#e6e6e6; /* change if the mask should have another color then white */
	z-index:999; /* makes sure it stays on top */
}

#status {
	text-align:center;
	position:absolute;
	width:100%;
	top:42%;/* 位置依使用圖示大小而微調 */
}
#loadingword{color:#999999;}

/* loading icon */
.sk-three-bounce {
  margin: 10px auto;
  width: 80px;
  text-align: center; }
  .sk-three-bounce .sk-child {
    width: 20px;
    height: 20px;
    background-color: #333;
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-three-bounce 1.4s ease-in-out 0s infinite both;
            animation: sk-three-bounce 1.4s ease-in-out 0s infinite both; }
  .sk-three-bounce .sk-bounce1 {
    -webkit-animation-delay: -0.32s;
            animation-delay: -0.32s; }
  .sk-three-bounce .sk-bounce2 {
    -webkit-animation-delay: -0.16s;
            animation-delay: -0.16s; }

@-webkit-keyframes sk-three-bounce {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0); }
  40% {
    -webkit-transform: scale(1);
            transform: scale(1); } }

@keyframes sk-three-bounce {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0); }
  40% {
    -webkit-transform: scale(1);
            transform: scale(1); } }

/* hover特效 */
.hvr-shutter-out-vertical {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  background: #e1e1e1;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-shutter-out-vertical:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #2098d1;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-shutter-out-vertical:hover, .hvr-shutter-out-vertical:focus, .hvr-shutter-out-vertical:active {
  color: white;
}
.hvr-shutter-out-vertical:hover:before, .hvr-shutter-out-vertical:focus:before, .hvr-shutter-out-vertical:active:before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}

/* 側邊欄 */
.sidebar-wrapper {
  position: relative;
  height: 100%;
  overflow: auto;
  background-color: #fff;
}
#toggle-sidebar{width:40x; height:40px; padding:5px; cursor:pointer; float:right}
	
/*  ===== 套件覆寫用CSS ===== */

/* 覆寫bootstrap初始設定 */
.container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 0px;
  padding-right: 0px;
}
/* 小於768px以下的螢幕 */
@media (max-width: 767px) {
	.no-gutter > [class*='col-'] {
    padding-right:0px;
    padding-left:0px;
	}
	/*(#3745)[人文志業] 手機板網站Footer無法連結*/
	.col-md-4{
	display:inline-block;
	}
}
/* 介於991~768px的螢幕 */
@media (min-width: 768px) {
	.no-gutter > [class*='col-'] {
    padding-right:0px;
    padding-left:0px;
	}
	.container {
    width:100%;
  	}
	
}
/* 介於1199~992px的螢幕 */
@media (min-width: 992px) { 
	.no-gutter > [class*='col-'] {
    padding-right:0px;
    padding-left:0px;
	}
	.container {
    width: 970px;
  	}
	
}
/* 大於1200px的螢幕 內容最大到970px,故需覆寫bootstrap container原始設定 */
@media (min-width: 1200px) {
    .no-gutter > [class*='col-'] {
    padding-right:0px;
    padding-left:0px;
	}
	.container {
    width: 970px;
  	}
	
}
/* 覆寫flider-pro圖檔位置 */
.sp-grab{cursor:url(images/sliderpro/openhand.cur),move}.sp-grabbing{cursor:url(images/sliderpro/closedhand.cur),move}

/* Animate.css補充樣式:輔助GSAP先行隱藏動畫元件(注意no-js時要將此屬性設為可見) */
.GSAPimgIni{visibility:hidden;}