﻿.zxt_bani {
	width:488px;
	position:absolute;
	top:310px;
	left:268px;
}
.zxt_bon {
	color:#3e3e3e;
	line-height:120px;
	font-family:Microsoft JhengHei;
	color:#000;
	font-size:120px;
	font-weight:bold;
	margin-bottom:30px;
	opacity:0
}
.zxt_bom {
	margin-bottom:25px;
	opacity:0;
}
.zxt_bov {
	margin-bottom:75px;
	opacity:0;
}
.zxt_boc {
	opacity:0
}

.swiper-slide-active

.swiper-slide-active .zxt_bon {
	
	opacity:1;
	animation: zifadeInUp 2s ease 1s both;
	visibility:visible;
}
.swiper-slide-active .zxt_bom {
	animation: zifadeInUp 2s ease 1.2s both;
	visibility:visible;
}
.swiper-slide-active .zxt_bov {
	animation: zifadeInUp 2s ease 1.4s both;
	visibility:visible;
}
.swiper-slide-active .zxt_boc {
	animation: zifadeInUp 2s ease 1.6s both;
}	



.ani-slide .zxt_bon {
	
	opacity:1;
	animation: zifadeInUp 2s ease 1s both;
	visibility:visible;
}
.ani-slide .zxt_bom {
	animation: zifadeInUp 2s ease 1.2s both;
	visibility:visible;
}
.ani-slide .zxt_bov {
	animation: zifadeInUp 2s ease 1.4s both;
	visibility:visible;
}
.ani-slide .zxt_boc {
	animation: zifadeInUp 2s ease 1.6s both;
	visibility:visible;
}
.zxt_bkio {
	width:47%;
	float:right;
	position:relative;
	top:-50px;
	opacity:0;
}
.zxt_bkio img {
	float:right;
}

.swiper-slide-active


.zxt_fie {
	width:100%;
	height:100%;
	transform: scale3d(1, 1, 1);
	transition: all 16s ease;
}

.swiper-slide-active .zxt_bkio {
	animation:fadeInRight 2s ease 1.4s both;
	opacity:1;
	visibility:visible;
}
.swiper-slide-active .zxt_fie {
	transform: scale3d(1.15, 1.15, 1);
	visibility:visible;
}


.ani-slide .zxt_bkio {
	animation:fadeInRight 2s ease 1.4s both;
	opacity:1;
	visibility:visible;
}
.ani-slide .zxt_fie {
	transform: scale3d(1.15, 1.15, 1);
	visibility:visible;
}
.zxt_fik {
	height:auto;
	position:absolute;
	left:0;
	bottom:323px;
	padding-left:269px;
	
}
.zxt_fik h1 {
	color:#fff;
	font-size:48px;
	line-height:48px;
	font-family:Microsoft JhengHei;
	margin-bottom:25px;
	opacity:0;
}
.zxt_fik h1 span {
	color:#fff;
	font-family:Microsoft JhengHei;
	font-size:90px;
	font-weight:bold;
	margin-right:60px;
}
.zxt_fik p {
	color:#fff;
	line-height:28px;
	font-size:18px;
	font-family:Microsoft JhengHei;
	vertical-align:inherit;
	opacity:0;
	opacity:0;
	/* visibility:hidden; */
}


.swiper-slide-active .zxt_fik h1 {
	opacity:1;
	animation: zifadeInDown 1s ease 0.6s both;
visibility:visible;
}
.swiper-slide-active .zxt_fik p {
	opacity:1;
	animation: zifadeInDown 1s ease 0.8s both;
	visibility:visible;
}
.ani-slide .zxt_fik h1 {
	opacity:1;
	animation: zifadeInDown 1s ease 0.6s both;
visibility:visible;
}
.ani-slide .zxt_fik p {
	opacity:1;
	animation: zifadeInDown 1s ease 0.8s both;
	visibility:visible;
}
.zxt_fik1 {
	height:auto;
	position:absolute;
	left:0;
	top:492px;
	padding-left:347px;
}
.zxt_fik1 h1 {
	color:#fff;
	font-size:48px;
	line-height:48px;
	font-family:Microsoft JhengHei;
	margin-bottom:25px;
	opacity:0;
	/* visibility:hidden; */
	-webkit-animation-name: fadeOutUp;
	animation-name: fadeOutUp;
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
}
.zxt_fik1 h1 span {
	color:#fff;
	font-family:Microsoft JhengHei;
	font-size:90px;
	font-weight:bold;
	margin-right:60px;
}
.zxt_fik1 p {
	color:#fff;
	line-height:28px;
	font-size:18px;
	font-family:Microsoft JhengHei;
	-webkit-animation-name: fadeOutUp;
	animation-name: fadeOutUp;
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	opacity:0;
	
}

.swiper-slide-active .zxt_fik1 h1 {
	opacity:1;
	animation: zifadeInUp 1s ease 0.6s both;
	visibility:visible;
}
.swiper-slide-active .zxt_fik1 p {
	opacity:1;
	animation: zifadeInUp 1s ease 0.8s both;
	visibility:visible;
}

.ani-slide .zxt_fik1 h1 {
	opacity:1;
	animation: zifadeInUp 1s ease 0.6s both;
	visibility:visible;
}
.ani-slide .zxt_fik1 p {
	opacity:1;
	animation: zifadeInUp 1s ease 0.8s both;
	visibility:visible;
}
.zxt_frt {
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	padding:282px 0 0 173px;
}
.zxt_romn {
	width:100%;
	height:100%;
	position:relative;
}
.zxt_romn_l {
	position:absolute;
	width:46%;
	height:auto;
	position:relative;
}
.zxt_romn_lt {
	height:auto;
	position:relative;
	color:#fff;
	padding-bottom:60px;
}
.zxt_romn_lt h1 {
	font-family:Microsoft JhengHei;
	font-size:90px;
	font-weight:bold;
	color:#fff;
	line-height:95px;
	margin-bottom:20px;
	opacity:0;
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
.zxt_romn_lt p {
	font-family:Microsoft JhengHei;
	line-height:38px;
	color:#fff;
	font-size:36px;
	opacity:0;
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
.zxt_romn_lt:after {
	content:'';
	position:absolute;
	left:0;
	bottom:0;
	width:0px;
	height:1px;
	background:#fff;
	overflow:hidden;
}


.swiper-slide-active .zxt_romn_lt h1 {
	opacity:1;
	animation: zifadeInUp 1s ease 0.5s both;
	visibility:visible;
}
.swiper-slide-active .zxt_romn_lt p {
	opacity:1;
	animation: zifadeInUp 1s ease 0.7s both;
visibility:visible;
}
.swiper-slide-active .zxt_romn_lt:after {
	width:100%;
	transition:8s ease all;
	opacity:1;
	visibility:visible;
}



.ani-slide .zxt_romn_lt h1 {
	opacity:1;
	animation: zifadeInUp 1s ease 0.5s both;
	visibility:visible;
}
.ani-slide .zxt_romn_lt p {
	opacity:1;
	animation: zifadeInUp 1s ease 0.7s both;
visibility:visible;
}
.ani-slide .zxt_romn_lt:after {
	width:100%;
	transition:8s ease all;
	opacity:1;
	visibility:visible;
}
.zxt_romn_lb {
	width:0px;
	overflow:hidden;
	height:36px;
	color:#fff;
	font-size:18px;
	line-height:36px;
	opaciyt:0;
	transition: all 8s ease;
}

.swiper-slide-active  .zxt_romn_lb {
	opacity:1;
	width:100%;
	visibility:visible;
}
.ani-slide .zxt_romn_lb {
	opacity:1;
	width:100%;
	visibility:visible;
}
.zxt_romn_r {
	width:56%;
	height:auto;
	position:absolute;
	right:0;
	top:0;
}
.zxt_romn_rt {
	width:205px;
	height:auto;
	margin-left:68px;
	opacity:0;
}

.swiper-slide-active .zxt_romn_rt {
	opacity:1;
	-journal-animation-name: holeru;
	animation-name: journal;
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	visibility:visible;
}
.ani-slide .zxt_romn_rt {
	opacity:1;
	-journal-animation-name: holeru;
	animation-name: journal;
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	visibility:visible;
}
.zxt_romn_rc {
	position:absolute;
	left:97px;
	top:0;
	width:66%;
	height:auto;
	opacity:0;
}
.zxt_romn_rc img {
	display:block;
	margin:0 auto;
	max-width:100%;
	animation: whirl 50s linear infinite;
}

.swiper-slide-active .zxt_romn_rc {
	opacity:1;
	-webkit-animation-name:scaleBounce;
	animation-name:scaleBounce;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	visibility:visible;
}
.ani-slide .zxt_romn_rc {
	opacity:1;
	-webkit-animation-name:scaleBounce;
	animation-name:scaleBounce;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	visibility:visible;
}
.zxt_romn_rb {
	position:absolute;
	width:100%;
	height:auto;
	opacity:0;
}

.swiper-slide-active .zxt_romn_rb {
	opacity:1;
	-webkit-animation-name:scaleBounce;
	animation-name:scaleBounce;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	visibility:visible;
}
.ani-slide .zxt_romn_rb {
	opacity:1;
	-webkit-animation-name:scaleBounce;
	animation-name:scaleBounce;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	visibility:visible;
}
.zxd_bin {
	width:928px;
	height:auto;
	margin:0 auto;
	position:absolute;
	left:0;
	right:0;
	top:299px;
	margin:0 auto;
	background:rgba(255, 255, 255, 0.5);
	min-height:505px !important;
	padding-top:105px;
}
.zxd_bin_t {
	text-align:center;
	margin-bottom:30px;
	opacity:0;
	/* visibility:hidden; */
}
.zxd_bin_t img {
	display:block;
	margin:0 auto;
	max-width:100%;
}
.zxd_bin_c {
	text-align:center;
	margin-bottom:30px;
	opacity:0;
	/* visibility:hidden; */
	color:#404040;
	font-size:48px;
	font-family:Microsoft JhengHei;
}
.zxd_bin_b {
	text-align:center;
	margin-bottom:30px;
	opacity:0;
	/* visibility:hidden; */
	width:380px;
	margin:0 auto;
	color:#252931;
	font-size:18px;
	line-height:30px;
}



.swiper-slide-active .zxd_bin_t {
	animation: zifadeInDown 1s ease 1s both;
	opacity:1;
	visibility:visible;
}
.swiper-slide-active .zxd_bin_c {

	animation: zifadeInDown 1s ease 1.2s both;
	opacity:1;
	visibility:visible;
}
.swiper-slide-active .zxd_bin_b {
	animation: zifadeInDown 1s ease 1.4s both;
	opacity:1;
	visibility:visible;
}

.swiper-slide-active  .zxd_bin_t {
	animation: zifadeInDown 1s ease 1s both;
	opacity:1;
	visibility:visible;
}
.swiper-slide-active  .zxd_bin_c {

	animation: zifadeInDown 1s ease 1.2s both;
	opacity:1;
	visibility:visible;
}
.swiper-slide-active  .zxd_bin_b {
	animation: zifadeInDown 1s ease 1.4s both;
	opacity:1;
	visibility:visible;
}


.ani-slide .zxd_bin_t {
	animation: zifadeInDown 1s ease 1s both;
	opacity:1;
	visibility:visible;
}
.ani-slide .zxd_bin_c {

	animation: zifadeInDown 1s ease 1.2s both;
	opacity:1;
	visibility:visible;
}
.ani-slide .zxd_bin_b {
	animation: zifadeInDown 1s ease 1.4s both;
	opacity:1;
	visibility:visible;
}


@media(max-width:1680px){
.zxt_bani {
	width:488px;
	position:absolute;
	top:260px;
	left:268px;
}	
}

@media(max-width:1600px){
.zxt_bani {
	width:488px;
	position:absolute;
	top:210px;
	left:268px;
}	
.zxt_frt {
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	padding:192px 0 0 173px;
}
.zxd_bin {
	width:628px;
	height:auto;
	margin:0 auto;
	position:absolute;
	left:0;
	right:0;
	top:199px;
	margin:0 auto;
	background:rgba(255, 255, 255, 0.5);
	min-height:375px !important;
	padding-top:55px;
}
.zxd_bin_t img {
	display:block;
	margin:0 auto;
	max-width:60%;
}
}

@media(max-width:1440px){
.zxt_bani {
	width:488px;
	position:absolute;
	top:190px;
	left:168px;
}	
.zxt_frt {
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	padding:252px 0 0 173px;
}
.zxd_bin {
	width:628px;
	height:auto;
	margin:0 auto;
	position:absolute;
	left:0;
	right:0;
	top:269px;
	margin:0 auto;
	background:rgba(255, 255, 255, 0.5);
	min-height:375px !important;
	padding-top:55px;
}
.zxd_bin_t img {
	display:block;
	margin:0 auto;
	max-width:60%;
}
.zxt_bon {
	color:#3e3e3e;
	line-height:120px;
	font-family:Microsoft JhengHei;
	color:#000;
	font-size:80px;
	font-weight:bold;
	margin-bottom:30px;
	opacity:0
}
.zxt_bom img{ max-width:60%;}
.zxt_bov img{ max-width:60%;}
.zxt_boc img{ max-width:60%;}
.zxt_fik {
	height:auto;
	position:absolute;
	left:0;
	bottom:233px;
	padding-left:209px;
}
.zxt_fik1 {
	height:auto;
	position:absolute;
	left:0;
	top:392px;
	padding-left:209px;
}
.zxt_romn_rb img{ width:90%;}
}

@media(max-width:1366px){
.zxt_bani {
	width:488px;
	position:absolute;
	top:140px;
	left:168px;
}	
.zxt_frt {
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	padding:182px 0 0 163px;
}
.zxd_bin {
	width:628px;
	height:auto;
	margin:0 auto;
	position:absolute;
	left:0;
	right:0;
	top:169px;
	margin:0 auto;
	background:rgba(255, 255, 255, 0.5);
	min-height:375px !important;
	padding-top:55px;
}
.zxd_bin_t img {
	display:block;
	margin:0 auto;
	max-width:60%;
}
.zxt_bon {
	color:#3e3e3e;
	line-height:120px;
	font-family:Microsoft JhengHei;
	color:#000;
	font-size:80px;
	font-weight:bold;
	margin-bottom:30px;
	opacity:0
}
.zxt_bom img{ max-width:60%;}
.zxt_bov img{ max-width:60%;}
.zxt_boc img{ max-width:60%;}
.zxt_fik {
	height:auto;
	position:absolute;
	left:0;
	bottom:193px;
	padding-left:209px;
}
.zxt_fik1 {
	height:auto;
	position:absolute;
	left:0;
	top:342px;
	padding-left:209px;
}
.zxt_romn_rb img{ width:90%;}
.zxt_bov {
	margin-bottom:45px;
	opacity:0
}
}
@media(max-width:1280px){
	.zxt_fik h1 span {
	color:#fff;
	font-family:Microsoft JhengHei;
	font-size:60px;
	font-weight:bold;
	margin-right:60px;
}

.zxt_bani {
	width:488px;
	position:absolute;
	top:140px;
	left:140px;
}	
.zxt_frt {
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	padding:189px 0 0 123px;
}
.zxd_bin {
	width:628px;
	height:auto;
	margin:0 auto;
	position:absolute;
	left:0;
	right:0;
	top:199px;
	margin:0 auto;
	background:rgba(255, 255, 255, 0.5);
	min-height:375px !important;
	padding-top:55px;
}
.zxd_bin_t img {
	display:block;
	margin:0 auto;
	max-width:60%;
}
.zxt_bon {
	color:#3e3e3e;
	line-height:120px;
	font-family:Microsoft JhengHei;
	color:#000;
	font-size:80px;
	font-weight:bold;
	margin-bottom:30px;
	opacity:0
}
.zxt_bom img{ max-width:60%;}
.zxt_bov img{ max-width:60%;}
.zxt_boc img{ max-width:60%;}
.zxt_fik {
	height:auto;
	position:absolute;
	left:0;
	bottom:193px;
	padding-left:159px;
}
.zxt_fik1 {
	height:auto;
	position:absolute;
	left:0;
	top:342px;
	padding-left:159px;
}
.zxt_romn_rb img{ width:90%;}
.zxt_romn_lt h1 {
	font-family:Microsoft JhengHei;
	font-size:60px;
	font-weight:bold;
	color:#fff;
	line-height:75px;
	margin-bottom:20px;
	opacity:0;
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
.zxt_romn_lt p {
	font-family:Microsoft JhengHei;
	line-height:38px;
	color:#fff;
	font-size:30px;
	opacity:0;
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
.zxt_fik1 h1 span {
	color:#fff;
	font-family:Microsoft JhengHei;
	font-size:60px;
	font-weight:bold;
	margin-right:60px;
}
.zxt_bov {
	margin-bottom:45px;
	opacity:0
}
}

@media(max-width:414px){
.zxt_bkio {
	width:100%;
	float:right;
	position:relative;
	top:-20px;
	opacity:0;
}
.zxt_bani {
    width: 100%;
    position: absolute;
    top:410px;
    left: 0px;
	padding:0 30px;	}
	
	.zxt_bon {
    color: #3e3e3e;
    line-height:40px;
    font-family: Microsoft JhengHei;
    color: #000;
    font-size: 40px;
    font-weight: bold;
    margin-bottom:20px;
    opacity: 0;}
	.zxt_bov {
    margin-bottom:25px;
    opacity: 0;}
	.zxt_fik {
    height: auto;
    position: absolute;
    left: 0;
    bottom: 193px;padding:0 30px;
	}
	.zxt_fik h1 {
    color: #fff;
    font-size:20px;
    line-height: 24px;
    font-family: Microsoft JhengHei;
    margin-bottom: 25px;
    visibility: hidden;
}
.zxt_fik p {
    color: #fff;
    line-height: 24px;
    font-size: 16px;
    font-family: Microsoft JhengHei;
    vertical-align: inherit;
    visibility: hidden;
}
.zxt_fik1 {
    height: auto;
    position: absolute;
    left: 0;
    top: 342px;
    padding:0 30px;
}
.zxt_fik1 h1 span {
    color: #fff;
    font-family: Microsoft JhengHei;
    font-size: 40px;
    font-weight: bold;
    margin-right:20px;

}
.zxt_fik1 h1 {
    color: #fff;
    font-size: 20px;
    line-height: 24px;
    font-family: Microsoft JhengHei;
    margin-bottom: 25px;
    visibility: hidden;
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
}
.zxt_fik1 p {
    color: #fff;
    line-height: 24px;
    font-size: 16px;
    font-family: Microsoft JhengHei;
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    opacity: 0;
    visibility: hidden;
}
.zxd_bin {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 199px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.5);
    min-height: 375px !important;
    padding-top: 55px;
}
.zxt_frt {
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	padding:149px 30px 0 30px;
}
.zxt_romn_l {
	position:absolute;
	width:100%;
	height:auto;
	position:relative;
}


.zxd_bin_b {
	text-align:center;
	margin-bottom:30px;
	visibility:hidden;
	width:100%;
	padding:0 15px;
	margin:0 auto;
	color:#252931;
	font-size:18px;
	line-height:30px;
}
.zxd_bin_c {
	text-align:center;
	margin-bottom:30px;
	visibility:hidden;
	color:#404040;
	font-size:36px;
	font-family:Microsoft JhengHei;
}
.zxt_romn_lt {
	height:auto;
	position:relative;
	color:#fff;
	padding-bottom:30px;
}
.zxt_romn_r {
	width:100%;
	height:auto;
	position:absolute;
	right:0;
	top:340px;
}
.zxt_romn_rc {
	position:absolute;
	left:97px;
	top:0;
	width:46%;
	height:auto;
	opacity:0;
}
.zxt_romn_rt {
	width:105px;
	height:auto;
	margin-left:68px;
	opacity:0;
}
.zxt_romn_rb {
	position:absolute;
	width:70%;
	left:50px;
	height:auto;
	opacity:0;
}
	.zxt_fik h1 span {
	color:#fff;
	font-family:Microsoft JhengHei;
	font-size:40px;
	font-weight:bold;
	margin-right:60px;
}

}


@media(max-width:360px){
.zxt_bkio {
	width:100%;
	float:right;
	position:relative;
	top:-20px;
	opacity:0;
}
.zxt_bani {
    width: 100%;
    position: absolute;
    top:350px;
    left: 0px;
	padding:0 30px;	}

	.zxt_fik {
    height: auto;
    position: absolute;
    left: 0;
    bottom: 193px;padding:0 30px;
	}
	
	.zxt_fik1 {
    height: auto;
    position: absolute;
    left: 0;
    top: 303px;
    padding:0 30px;
}
.zxt_romn_lt h1 {
	font-family:Microsoft JhengHei;
	font-size:40px;
	font-weight:bold;
	color:#fff;
	line-height:55px;
	margin-bottom:20px;
	opacity:0;
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
.zxt_romn_lt {
	height:auto;
	position:relative;
	color:#fff;
	padding-bottom:10px;
}
.zxt_romn_r {
	width:100%;
	height:auto;
	position:absolute;
	right:0;
	top:280px;
}
	.zxt_romn_lt p {
	font-family:Microsoft JhengHei;
	line-height:38px;
	color:#fff;
	font-size:20px;
	opacity:0;
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
.zxt_romn_lb {
	width:0px;
	overflow:hidden;
	height:48px;
	color:#fff;
	font-size:12px;
	line-height:24px;
	opaciyt:0;
	transition: all 8s ease;
}
.zxd_bin {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 199px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.5);
    min-height: 305px !important;
    padding-top: 35px;
}
.zxd_bin_c {
	text-align:center;
	margin-bottom:30px;
	visibility:hidden;
	color:#404040;
	font-size:20px;
	font-family:Microsoft JhengHei;
}


.zxd_bin_b {
	text-align:center;
	margin-bottom:30px;
	visibility:hidden;
	width:100%;
	padding:0 15px;
	margin:0 auto;
	color:#252931;
	font-size:14px;
	line-height:30px;
}
.zxt_bom img{ max-width:50%;}
.zxt_bov img{ max-width:50%;}
.zxt_boc img{ max-width:50%;}
}