img {
	border: 0;
}

.wrap {
	height:100%;
	background:#2c6aa5;
	position: relative;
	overflow: hidden;
}

@media(max-width:1200px){
	.wrap{display:none;}
}

.wrapper {
	height: 100%;
	position: relative;
	overflow: hidden;
}


.product_list {
	position: relative;
	height: 100%;
}

.product_box {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: -9999px;
}

.bg_box {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	background-position: center center;
	background-repeat: no-repeat;
}

.bg_main {
	/*width: 1920px;
	height: 100%;
	position: absolute;
	top: 185px;
	left: 50%;
	margin-left: -960px;*/
}
.bg_box{
	width:100%;
	height:100%;
	position:relative;
}
.bg_box img {
	left:50%;
	top:50%;
	max-width:none;
	text-align:center;
	position: absolute;
	margin: 0 auto;
}

/*@media (max-width:1280) and (max-height:1024px){
	.bg_box img { 
		left:0;
	 	top:0;
		 background:#f30;
	 }
}*/

/*@media(max-width:1400px) and (max-height:1050px) {
	.bg_box img {
		left:60.2%;
	}
}*/

/*@media(max-width:1370px) and (max-height:768px) {
	.bg_box img {
		left:50%;
	}
}

@media(max-width:1280px) and (max-height:1000px){
	.bg_box img {
		left:64.1% !important;
		outline:solid 1px #ff00;
	}
}

@media(max-width:1280px) and (max-height:860px){
	.bg_box img{
		left:57% !important;
		left:59.6% !important;
		outline:solid 1px #000;
		
	}
}

@media(max-width:1280px) and(max-height:800px){
	.bg_box img{
		left:50% !important;
		outline:solid 1px #f30;
	}
}*/




/*@media(max-width:1281px) and (max-height:720px) {
	.bg_box img {
		left:50%;
	}
}*/



.product_box .content {
	width: 1200px;
	height: 100%;
	position: absolute;
	top:0px;
	left: 50%;
	margin-left:-600px;
	z-index: 5;
	transform-origin: center center;
	-webkit-transform-origin: center center;
}

.product_list .show {
	left: 0;
}

.product_list .show .main_box {
	left: 0;
}

.product_box h2 {
	/*left:0;
	position: absolute;*/
}

.btn_product {
	/*transition:all 1s linear;*/
}

.btn_product-2 {
	/*transition:all 1.5s linear;*/
}
.product_box.show h2 {
	animation: tt_effect .4s .3s linear both;
	-webkit-animation: tt_effect .4s .3s linear both;
}

.product_box.show .btn_product {
	animation: tt_effect .4s 1s linear both;
	-webkit-animation: tt_effect .4s 3s linear both;
}


.btn_product-2:hover img {
	text-decoration: none;
	transform: scale(1.04);
	-webkit-transform: scale(1.04);
}
.btn_product-2 img{transition:all 0.7s linear;}
.product_box.show h2 {
	animation: tt_effect .6s .3s linear both;
	-webkit-animation: tt_effect .6s .3s linear both;
}

.product_box.show .btn_product {
	animation: opacity .5s 1s linear both;
	-webkit-animation: opacity .5s 1s linear both;
}

.product_box.show .btn_product-2 {
	animation: opacity .5s 2s linear both;
	-webkit-animation: opacity .5s 2s linear both;
}

.product_btns{
	z-index: 9;
	position: relative;
}
.product_btns:before {
	content: "";
	left: 0;
	width:100%;
	height: 44px;
	bottom: 130px;
	position: absolute;
	background: url(https://static.digiwin.com/tw/static/images/bg-6.png) no-repeat top center;
}


.product_btns:after {
	/*content: "";
	width:20%;
	height: 44px;
	right: 0%;
	bottom: 130px;
	position: absolute;
	background-color: #000;
	background: rgba(0,0,0,0.75);*/
}

/*@media(max-width:1600px) {
	.product_btns .btns_area:before {
		width: 37.8%;
	}

	.product_btns .btns_area:after {
		right: -20.3%;
	}
}*/

/*@media(max-width:1366px) {
	.product_btns .btns_area:before {
		width: 32.2%;
	}

	.product_btns .btns_area:after {
		right: -25.9%;
	}
}

@media(max-width:1280px) {
	.product_btns .btns_area:before {
		left: -22.5%;
	}

	.product_btns .btns_area:after {
		right: -28.4%;
	}
}*/


.product_btns .btns_box {
	position: absolute;
	width: 100%;
	bottom:125px;
	text-align: center;
}


.product_btns .btns_box a {
	display: inline-block;
	+display: inline;
	+zoom: 1;
	text-align: center;
	position: relative;
	z-index: 1;
	vertical-align: top;
}


.big_view .product_btns .btns_box {
	height: 44px;
}

.big_view .product_btns .btns_box a {
	width:10px;
	height:10px;
	margin:0 3px;
	background:rgba(255,255,255,0.8);
	position: relative;
}

#wz{
	margin: 0 5px 0 0;
	color: #fff;
	height: 44px;
	font-size: 16px;
	line-height: 44px;
	background: url(https://static.digiwin.com/tw/static/images/bg-7.png) repeat;
	text-align: left;
	text-indent: 20px;
	width: 341px;
	bottom: 0;
	z-index: 9;
	position:absolute;
}

.big_view .product_btns .btns_box a span {
	position: absolute;
	top: -90px;
	left: 0px;
	opacity: 0;
	display: none\9;
    transition: all 0.3s ease-in;
}

.big_view .product_btns .btns_box .pic{
	width: 341px;
	height: 137px;
	position: relative;
}

.big_view .product_btns .btns_box a:hover span,.big_view .product_btns .btns_box a.cur{
	 background:#008aff;
}

.big_view .product_btns .btns_box .btn_xav {
	margin: 0 0 0 15px;
}

@keyframes pulse {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.1);
	}

	100% {
		transform: scale(1);
	}
}

@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scale(1);
	}

	50% {
		-webkit-transform: scale(1.1);
	}

	100% {
		-webkit-transform: scale(1);
	}
}

@keyframes swing {
	20%,40%,60%,80%,100% {
		transform-origin: top center;
	}

	20% {
		transform: rotate(15deg);
	}

	40% {
		transform: rotate(-10deg);
	}

	60% {
		transform: rotate(5deg);
	}

	80% {
		transform: rotate(-5deg);
	}

	100% {
		transform: rotate(0deg);
	}
}

@-webkit-keyframes swing {
	20%,40%,60%,80%,100% {
		-webkit-transform-origin: top center;
	}

	20% {
		-webkit-transform: rotate(15deg);
	}

	40% {
		-webkit-transform: rotate(-10deg);
	}

	60% {
		-webkit-transform: rotate(5deg);
	}

	80% {
		-webkit-transform: rotate(-5deg);
	}

	100% {
		-webkit-transform: rotate(0deg);
	}
}

@keyframes flash {
	0%,66.66% {
		opacity: 0;
	}

	33.33%,100% {
		opacity: 1;
	}
}

@-webkit-keyframes flash {
	0%,66.66% {
		opacity: 0;
	}

	33.33%,100% {
		opacity: 1;
	}
}

@keyframes tada {
	0% {
		transform: scale(1);
	}

	10%,20% {
		transform: scale(0.9) rotate(-3deg);
	}

	30%,50%,70%,90% {
		transform: scale(1.1) rotate(3deg);
	}

	40%,60%,80% {
		transform: scale(1.1) rotate(-3deg);
	}

	100% {
		transform: scale(1) rotate(0);
	}
}

@-webkit-keyframes tada {
	0% {
		-webkit-transform: scale(1);
	}

	10%,20% {
		-webkit-transform: scale(0.9) rotate(-3deg);
	}

	30%,50%,70%,90% {
		-webkit-transform: scale(1.1) rotate(3deg);
	}

	40%,60%,80% {
		-webkit-transform: scale(1.1) rotate(-3deg);
	}

	100% {
		-webkit-transform: scale(1) rotate(0);
	}
}

@keyframes rotateX {
	0% {
		transform: perspective(400px) rotateX(90deg);
	}

	40% {
		transform: perspective(400px) rotateX(-30deg);
	}

	70% {
		transform: perspective(400px) rotateX(30deg);
	}

	100% {
		transform: perspective(400px) rotateX(0deg);
	}
}

@-webkit-keyframes rotateX {
	0% {
		-webkit-transform: perspective(400px) rotateX(90deg);
	}

	40% {
		-webkit-transform: perspective(400px) rotateX(-30deg);
	}

	70% {
		-webkit-transform: perspective(400px) rotateX(30deg);
	}

	100% {
		-webkit-transform: perspective(400px) rotateX(0deg);
	}
}

@keyframes rotateY {
	0% {
		transform: perspective(400px) rotateY(90deg);
	}

	40% {
		transform: perspective(400px) rotateY(-20deg);
	}

	70% {
		transform: perspective(400px) rotateY(20deg);
	}

	100% {
		transform: perspective(400px) rotateY(0deg);
	}
}

@-webkit-keyframes rotateY {
	0% {
		-webkit-transform: perspective(400px) rotateY(90deg);
	}

	40% {
		-webkit-transform: perspective(400px) rotateY(-20deg);
	}

	70% {
		-webkit-transform: perspective(400px) rotateY(20deg);
	}

	100% {
		-webkit-transform: perspective(400px) rotateY(0deg);
	}
}

@keyframes bounce {
	0%,20%,50%,80%,100% {
		transform: translateY(0);
	}

	40% {
		transform: translateY(-20px);
	}

	60% {
		transform: translateY(-10px);
	}
}

@-webkit-keyframes bounce {
	0%,20%,50%,80%,100% {
		-webkit-transform: translateY(0);
	}

	40% {
		-webkit-transform: translateY(-20px);
	}

	60% {
		-webkit-transform: translateY(-10px);
	}
}

@keyframes bounceInDown {
	0% {
		opacity: 0;
		transform: translateY(-40px);
	}

	100% {
		opacity: 1;
		transform: translateY(0px);
	}
	/*80%{transform:translateY(-10px);}
	100%{transform:translateY(0);}*/
}

@-webkit-keyframes bounceInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-40px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0px);
	}
	/*80%{-webkit-transform:translateY(-10px);}
	100%{-webkit-transform:translateY(0);}*/
}

@keyframes opacity {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-webkit-keyframes opacity {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes tt_effect {
	0% {
		transform: translateY(-20px);
		opacity: 0;
	}
	

	100% {
		transform: translateY(0);
		opacity: 1;
	}
}

@-webkit-keyframes tt_effect {
	0% {
		-webkit-transform: translateY(-20px);
		opacity: 0;
	}

	100% {
		-webkit-transform: translateY(0);
		opacity: 1;
	}
}