.wow { animation-name: fadeInUp; animation-duration: 0.5s; -moz-animation-name: fadeInUp; -ms-animation-name: fadeInUp; -o-animation-name: fadeInUp; -webkit-animation-name: fadeInUp; -moz-animation-duration: 0.5s; -ms-animation-duration: 0.5s; -o-animation-duration: 0.5s; -webkit-animation-duration: 0.5s; }

/* product */
#product { position: relative; margin-top: -180px; padding-bottom: 90px; }
#product .pdetail { overflow: hidden; padding: 20px 35px; background: #fff; transition: linear 0.3s; }
#product .slick-slide:hover .pdetail { background: #eaeaea; }
#product .pdetail .ptitle { float: left; width: calc(100% - 50px); }
#product .pdetail .ptitle span { line-height: 110%; color: #2d2d2d; font-size: 13px; }
#product .pdetail .ptitle h2 { line-height: 110%; margin-top: 5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#product .pdetail .ptitle h2 a { color: #2d2d2d; font-size: 17px; }
#product .pdetail .ptitle .price { margin-top: 5px; height: 25px; }
#product .pdetail .ptitle .price p { display: inline-block; font-size: 16px; color: #777777; }
#product .pdetail .ptitle .price p b { font-size: 18px; color: #f00f0f; }
#product .pdetail .ptitle .price p.old { margin-right: 10px; text-decoration: line-through; color: #c4c1c1; }
#product .pdetail .pgo { float: right; }
#product .pdetail .pgo a { color: #ee9e01; display: block; width: 40px; height: 40px; border: 2px solid #e6e6e6; border-radius: 50%; text-align: center; line-height: 40px; font-size: 14px; transition: linear 0.5s; }
#product .slick-slide:hover .pdetail .pgo a { border: 2px solid #fdb220; transform: rotate(180deg); background: #fff; }
#product .photo { background: #fff; }
#product .photo a ,
#news .list .photo a ,
#ssbanner-wrap .bxslider div a { display: block; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; position: relative; }
#product .photo a img ,
#news .list .photo a img ,
#ssbanner-wrap .bxslider div img { width: 100%; }
#product .photo a:after { transition: linear 0.3s; position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.54); left: 0; top: 0; content: ''; display: block; opacity: 0; }
#product .slick-slide:hover .photo a:after { opacity: 1; }

/* about */
#about { background-repeat: no-repeat; background-image: url(/images/06/about-bg.jpg); background-size: cover; padding: 140px 0; background-attachment: fixed; }
#about >div { overflow: hidden; position: relative; }
#about .abimg { float: left; margin-top: 40px; position: relative; z-index: 5; }
#about .abimg h2 { background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; }
#about .abtxt { background: linear-gradient(to right, rgba(187,28,56,1) 50%, rgba(187,28,56,0.7) 100%); position: absolute; top: 0; z-index: 1; color: #fff; width: 80%; right: 0; text-align: right; }
#about .abtxt .abtxt-inside { display: inline-block; width: 55%; padding: 45px; }
#about .abtxt .abtxt-inside h2 ,
#about .abtxt .abtxt-inside p ,
#about .abtxt .abtxt-inside article { line-height: 180%; font-size: 25px; font-weight: normal; font-family: 'cwTeXHei', serif; }
#about .abtxt .abtxt-inside p.stxt { font-size: 20px; }
#about .abtxt .abtxt-inside article { margin-top: 25px; font-size: 16px; }
#about .abtxt .abtxt-inside span { display: block; width: 29px; height: 2px; background: #fff; margin: 50px 0 0; }
#about .abtxt .abtxt-inside p.more { margin-top: 40px; font-family: 'cwTeXHei', serif; }
#about .abtxt .abtxt-inside p.more a { color: #fff; font-size: 15px; }
#about .abtxt .abtxt-inside p.more a b { margin-left: 20px; }

/* news */
#news { position: relative; margin-bottom: 60px; }
#news:after { position: absolute; top: 0; left: 0; width: 100%; background: #eaf3f1; height: 50%; display: block; content: ''; z-index: -1; }
#news .workframe #section2 ,
#ssbanner-wrap #section6 { text-align: center; }
#news .workframe .entitle h2 ,
#ssbanner-wrap .entitle h2 { text-align: center; color: #7beeb2; padding: 120px 0 90px; font-size: 40px; font-family: 'Josefin Sans', sans-serif, "微軟正黑體", "蘋果儷中黑"; }
#news .list { margin: 15px; }
#news .list p { color: #58ca8e; margin: 20px 0 0; transition: all linear 0.3s; opacity: 1; }
#news .list h2 { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; line-height: 110%; margin-top: 5px; transition: all linear 0.3s; }
#news .slick-slide:hover .list p { transform: translateY(24px); opacity: 0; }
#news .slick-slide:hover .list h2 { transform: translateY(-24px); }
#news .list h2 a { color: #464646; font-size: 17px; }
#news .enmore { margin-top: 80px; text-align: center; }
#news .enmore h3 { text-align: center; }
#news .enmore h3 a { color: #464646; display: inline-block; background: #7beeb2; width: 360px; padding: 15px 35px; font-weight: normal; font-size: 14px; overflow: hidden; }
#news .enmore h3 a b { float: right; }
#news #section2 .entitle { width: 100%; }
#news .list .photo a { transition: all linear 0.3s; }
#news .slick-slide:hover .list .photo a { box-shadow: 0 0 7px rgba(0, 0, 0, 0.16); }

/* contBox */
#contBox { position: relative; padding: 5% 0 0 5%; }
#contBox:before { position: absolute; width: 500px; height: 500px; background: #e7f3ef; top: 0; left: 0; content: ""; }
#contBox #section7 > div { position: relative; width: 100%; background-position: 50%; background-repeat: no-repeat; background-size: cover; }
#contBox #section7 > div a#playYoutu { display: block; width: 100px; height: 100px; text-align: center; line-height: 100px; border-radius: 50%; background: rgba(0, 0, 0, 0.6); position: absolute; z-index: 5; color: #dcdcdc; font-size: 30px; left: calc(50% - 50px); top: calc(50% - 50px); transition:all linear 0.3s; }
#contBox #section7 > div a#playYoutu:hover { width: 110px; height: 110px; line-height: 110px; left: calc(50% - 55px); top: calc(50% - 55px); font-size: 34px; }
#contBox #section7 > div iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
#contBox .otherBox { overflow: hidden; position: relative; margin-right: 5%; top: -100px; }
#contBox .otherBox ul { float: left; width: 35%; }
#contBox .otherBox ul.custom { margin-top: 100px; }
#contBox .otherBox ul.custom li { padding: 40px 30px 0; }
#contBox .otherBox ul.custom li h2 { margin-bottom: 10px; font-size: 30px; color: #72dca6; line-height: 170%; }
#contBox .otherBox ul.custom li article { overflow: hidden; height: 120px; line-height: 170%; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient }
#contBox .otherBox ul#sPicture { width: 65%; -webkit-box-shadow: 0 0 9px #747474; -moz-box-shadow: 0 0 9px #747474; box-shadow: 0 0 9px #747474; }
#contBox .otherBox ul#sPicture li a { overflow: hidden; display: block; background-position: 50%; background-repeat: no-repeat; background-size: 100% auto; }

/* ssbanner-wrap */
#section4 > div , #section6 > div { width: 100%; }
#ssbanner-wrap .bxslider { overflow: hidden; }
#ssbanner-wrap .bxslider div { float: left; width: 20%; }
#ssbanner-wrap .bxslider div a p { position: absolute; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: #c31515; color: #fff; font-size: 15px; padding: 9px 25px; width: calc(50% - 50px); top: calc(50% - 17px); left: 25%; text-align: center; opacity: 0; transition: all linear 0.3s; }
#ssbanner-wrap .bxslider div a:hover p { opacity: 1; }

@media screen and (max-width:1680px) {
	#about .abimg { width: 50%; }
	#contBox .otherBox { top: -70px; }
	#contBox .otherBox ul.custom { margin-top: 70px; }
	#ssbanner-wrap .entitle h2 { padding: 70px 0 60px; }
}
@media screen and (max-width:1440px) {
	#product { margin-top: -120px; }
	#contBox .otherBox ul.custom li h2 { font-size: 25px; }
	#contBox .otherBox ul.custom li article { height: 90px; -webkit-line-clamp: 4; }
}
@media screen and (max-width:1280px) {
	#product { margin-top: -80px; }
	#about { background-attachment: inherit; }
	#about .abtxt .abtxt-inside { width: 50%; }
	#about .abtxt .abtxt-inside h2 { font-size: 15px; }
	#news .workframe .entitle h2 { font-size: 32px; }
	#contBox .otherBox ul.custom { width: 45%; }
	#contBox .otherBox ul#sPicture { width: 55%; }
	#contBox .otherBox ul#sPicture li a { background-size: cover; }
	#contBox .otherBox ul#sPicture li a img { width: 140%; max-width: inherit; }
}
@media screen and (max-width:1024px) {
	#contBox #section7 > div img { height: 380px; }
	#contBox .otherBox { top: -50px; }
	#contBox .otherBox ul.custom { margin-top: 50px; }
	#contBox .otherBox ul#sPicture li a img { width: 170%; }
}
@media screen and (max-width:980px) {
	#product { margin-top: -50px; }
	#about >div { overflow: visible; text-align: right; }
	#about .abimg { float: none; position: absolute; margin: 0; top: -40px; }
	#about .abtxt { position: inherit; float: none; display: inline-block; }
	#ssbanner-wrap .bxslider div { width: 50%; }
	#contBox { padding-left: 0; }
	#contBox:before , #contBox .otherBox ul#sPicture li a img { width: 100%; }
	#contBox .otherBox { margin-right: 0; }
	#contBox .otherBox ul.custom ,
	#contBox .otherBox ul#sPicture { float: none; width: 100%; }
	#contBox .otherBox ul#sPicture { margin-top: 55px; }
	#contBox .otherBox ul#sPicture li a img { height: 320px; }
}
@media screen and (max-width:768px) {
	#about .abimg { width: 40%; }
	#about .abtxt { width: 95% }
	#news .enmore h3 a { width: 160px; }
	#news .workframe .entitle h2 { font-size: 26px; padding: 90px 0 50px; }
}
@media screen and (max-width:640px) {
	#about .abimg { width: 100%; position: inherit; top: 0; }
	#about .abtxt { width: 100% }
	#about .abtxt .abtxt-inside { width: calc(100% - 90px); }
	#product .pdetail { padding: 10px 20px; }
}
@media screen and (max-width:480px) {
	#about { padding: 50px 0; }
	#about .abtxt .abtxt-inside { width: calc(100% - 50px); padding: 25px; }
	#news .list { margin: 0 5px; }
	#news .list h2 a ,
	#product .pdetail .ptitle h2 a { font-size: 15px; }
	#news .list p { font-size: 12px; }
	#ssbanner-wrap .bxslider div { width: 50%; }
	#news .workframe .entitle h2 { font-size: 24px; }
	#product .pdetail .ptitle span { font-size: 8pt; }
	#product .pdetail .ptitle h2 { margin-top: 0; }
	#product .pdetail .pgo a { width: 30px; height: 30px; line-height: 30px; border: 2px solid #fdb220; background: #fff; }
	#product .pdetail .pgo { margin-top: 5px; }
	#product .pdetail { background: #eaeaea; }
	#product { margin-top: -40px; }
	#news .list h2 { white-space: inherit; text-overflow: inherit; height: 2.6em; }
}