@charset "utf-8";
/* CSS Document */
/*【default】*/
/*---超連結---*/
a{
	color: #13193e;
}
/*---清除浮動---*/
.cf{
	zoom:1;
}
.cf:before,.cf:after{
	content:'';
	display:table;
}
.cf:after{
	clear:both;
}
input,button,select,textarea{outline:none}
*:focus { outline: none; }
/*---取消選取---*/
.unSelected {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
/*---img---*/
.imgBlock{
	display: block;
	margin: 0 auto;
}
#content .imgBlock{
	display: block;
	margin: 0 auto;
}
/*---動畫---*/
.animated {
	animation-duration: 0.8s;
	animation-fill-mode: both;
}
.animated2{
	animation-duration: 1s;
	animation-fill-mode: both;
}
/*zoomIn*/
.zoomIn {
	animation-name: zoomIn;
}
@keyframes zoomIn {
	from {
		opacity: 0;
		transform: scale3d(.3, .3, .3);

    }
    50% {
    		opacity: 1;

    }
}
/*flipInX*/
@keyframes fadeIn {
  from {
	opacity: 0;
  }
  to {
	opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}
/*slideInUp*/
.slideInUp {
	animation-name: slideInUp;
}
@keyframes slideInUp {
	from {
		transform: translate3d(0, 100%, 0);
		visibility: visible;

    }
	to {
		transform: translate3d(0, 0, 0);

    }
}
/*flipInX*/
.flipInX {
	backface-visibility: visible !important;
	animation-name: flipInX;
}
@keyframes flipInX {
	from {
		transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
		animation-timing-function: ease-in;
		opacity: 0;

    }
	40% {
		transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
		animation-timing-function: ease-in;

    }
	60% {
		transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
		opacity: 1;

    }
	80% {
		transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

    }
	to {
		transform: perspective(400px);
		opacity: 1;

    }
}
/*fadeIn*/
@keyframes fadeIn {
  from {
	opacity: 0;
  }
  to {
	opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}
/*---btn---*/
.btn{
	position: relative;
	display: inline-block;
	margin: 0 auto;
    padding: 0;
	border: none;
	height: 35px;
	overflow: hidden;
}
.btn a{
	display: block;
}
.btn p{
	height: 100%;
	padding: 0 10px;
	line-height: 33px;
    text-align: center;
	font-size: 14px;
    letter-spacing: 1px;
	transform: translateY(0);
	transition: all 0.05s ease;
    border: 1px solid #353538;
	background-color: #565656;
	color: #fff;
}
.btn p.mask{
    background-color: #fff;
	color: #353538;
}
.btn.btn-danger p {
    border-color: #dc3545;
	background-color: #dc3545;
	color: #fff;
}
.btn.btn-danger p.mask {
	background-color: #c82333;
	color: #fff;
}
.btn:hover p{
	transform: translateY(-35px);
}
/*熒幕尺寸【小於】1025時頁面顯示---平板*/
@media (max-width:1024px) {
    /*---btn---*/
    .btn p.mask{
    	display: none;
    }
    .btn:hover p{
    	transform: none;
    }
}