@charset "utf-8";
/* CSS Document */
/*【default】*/
/*---超連結---*/
a{
	color: #71685f;
}
/*---清除浮動---*/
.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;
	width: 70px;
	height: 35px;
	margin: 0 auto;
	background-color: #54483f;
	overflow: hidden;
}
.btn a{
	display: block;
	width: 100%;
	height: 100%;
	color: #565656;
}
.btn h5{
	width: 100%;
	height: 100%;
	color: #fff;
	line-height: 35px;
	transform: translateY(0);
	transition: all 0.05s ease;
    text-align: center;
}
.btn h5.mask{
	width: 100%;
	height: 100%;
	color: #ffe72e;
	transform: translateY(0);
	transition: transform 0.1s ease;
}
.btn:hover h5{
	transform: translateY(-35px);
}
.btn:hover h5.mask{
	transform: translateY(-35px);
}
/*---文章設定(應急html編輯器)---*/
.articleDetail{
	max-width: 90%;
	margin: 0 auto;
    letter-spacing: 2px;
}
.articleP p{
	line-height: 1.8em;
	margin-bottom: 20px;
}
.articleDetail ul li p{
	margin-bottom: 10px;
}
/*熒幕尺寸【小於】1025時頁面顯示---平板*/
@media (max-width:1024px) {
    .articleDetail{
        font-size: 13px;
    }
    /*---btn---*/
    .btn h5.mask{
    	display: none;
    }
    .btn:hover h5{
    	transform: none;
    }
}