body{margin:0;border:0;width:100%;color:#274385;font-size:22px;line-height:170%;}
div, h1, h2, h3, h4, hr, p, form, label, input, textarea, img, span, strong{text-align:left;vertical-align:middle;margin:0px;padding:0px;word-wrap:normal;word-break:normal;border-width:0;font-family:"微軟正黑體", "蘋果儷中黑", "Lucida Grande", "Arial", "Arial Narrow";}
hr{noshade:noshade;}
th{font-weight:normal;}
ul{list-style:none;margin:0;padding:0;overflow:hidden;}
li{list-style:none;}
a ,
a:hover{text-decoration:none;cursor:pointer;outline:none;}
img{max-width:100%;}
br{font-family:Arial !important;}
form p input[type="text"],
form p input[type="password"],
form p textarea,
form p select{background-color:rgba(255,255,255,0.6);border:1px #858384 solid;}
form p input[type="text"]:focus ,
form p input[type="password"]:focus{border-color:#13a5e0;background:#13a5e0;color:#fff;}
input[type="text"], input[type="submit"], input[type="reset"], input[type="button"], button{-webkit-appearance:none;}
select, input[type="text"]{border-top-right-radius: 0;border-top-left-radius: 0;border-bottom-right-radius: 0;border-bottom-left-radius: 0;-webkit-appearance:none;font-size:16px;}
select {background-image:url(/images/35/selectbutton.png);background-repeat:no-repeat;background-position:95% 50%;}
#jumpDiv ,
#jumpIframe{position:relative;background:#fff;top:0;left:0;z-index:9999999999999999999999;}
section{width:960px;margin:0 auto;overflow:hidden;}
.nav-func,
.phoneWrap{display:none;}
#hair{background:#fff;padding:5px 0;}
#brain{background-image:url(/images/35/bottom-bg.jpg);background-repeat:no-repeat;background-position:50% 50%;background-size:cover;}
#hair #h1{float:left;}
#hair #webtool{float:right;font-size:14px;margin-top:13px;}
#hair #webtool a{color:#f3861d;font-weight:bold;}
#brain nav ul{text-align:center;}
#brain nav li{display:inline-block;float:left;width:137px;}
#brain nav li a{color:#675111;text-align:center;display:block;font-size:18px;padding:15px 0;transition:all linear 0.3s;display: block;
    font-size: 20px;
    font-weight: bold;}
#brain nav li:hover a{background:#ffeeb9;}
.wrapper{background-image:url(/images/);}
#content{background-image:url(/images/35/content-bg2.png);background-repeat:repeat-x;background-position:100% 100%;animation-name:bgm;animation-timing-function:linear;animation-duration:10s;animation-iteration-count:infinite;animation-play-state:running;animation-direction:alternate;}
@keyframes bgm{0%{background-position:0 100%;}
100%{background-position:100% 130%;}
}
#content section{background:#fff;}
#articleInfo15 {
    overflow: hidden;
    padding: 30px 0;
    background: url(/images/35/img-productBg.jpg) no-repeat fixed center top / cover;
}
#articleInfo15 .tit {
	position: relative;
	text-align: center;
	z-index: 2;
}
#articleInfo15 .tit h3 {
	text-align: center;
	font-size: 33px;
	margin-top: 45px;
	color: #ffffff;
}
#articleInfo15 .tit font {
	padding: 0 20px;
	background: #f3861d;
	display: inline-block;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	color: #ffffff;
}
#articleInfo15:hover .tit h3 ,
#articleInfo15:hover .tit font{
	letter-spacing: 5px;
}
#articleInfo15 ul {
	overflow: hidden;
	position: relative;
	margin: -10px 0 30px;
	padding: 50px 0 35px;
	z-index: 1;
	color: #565656;
	width: 960px;
    margin: 0 auto;
    overflow: hidden;
}
#articleInfo15 ul li {
	float: left;
	width: 33%;
	animation-name: fadeInUp;
	-webkit-animation-name: fadeInUp;
}
#articleInfo15 ul li .item {
	padding: 20px 20px;
	color: #fff;
}
#articleInfo15 ul li .item .circle {
	position: relative;
	margin: 0 auto 15px;
	width: 114px;
	height: 114px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	box-sizing: border-box;
	text-align: center;
	font-size: 75px;
	line-height: 114px;
}
#articleInfo15 ul li .item:hover .circle {
	animation: flipInX 1.5s both;
	-webkit-animation: flipInX 1.5s both;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;	
}
@keyframes flipInX{
	0%{ transform: perspective(400px) rotateX(90deg); animation-timing-function: ease-in; opacity:0; }
	40%{ transform: perspective(400px) rotateX(-20deg); animation-timing-function: ease-in; }
	60%{ transform: perspective(400px) rotateX(10deg); opacity: 1; }
	80%{ transform: perspective(400px) rotateX(-5deg); }
	to{ transform:perspective(400px); }
}
@-webkit-keyframes flipInX{
	0%{ -webkit-transform: perspective(400px) rotateX(90deg); -webkit-animation-timing-function: ease-in; opacity:0; }
	40%{ -webkit-transform: perspective(400px) rotateX(-20deg); -webkit-animation-timing-function: ease-in; }
	60%{ -webkit-transform: perspective(400px) rotateX(10deg); opacity: 1; }
	80%{ -webkit-transform: perspective(400px) rotateX(-5deg); }
	to{ -webkit-transform:perspective(400px); }
}
#articleInfo15 ul li .item .circle:before {
	position: absolute;
	width: 124px;
	height: 124px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	box-sizing: border-box;
	left: -6px;
	top: -6px;
	z-index: -1;
	content: "";
}
#articleInfo15 ul li .item p {
	text-align: center;
	font-size: 22px;
}
#articleInfo15 ul li .item article {
	text-align: center;
	font-size: 15px;
}
#articleInfo15 .imgBox p {
	margin: 0 1% 0 0;
	overflow: hidden;
	float: left;
	width: 49%;
	animation-name: fadeInLeft;
	-webkit-animation-name: fadeInUp;
}
#articleInfo15 .imgBox p:nth-child(2) {
	margin: 0 0 0 1%;
	animation-name: fadeInRight;
	-webkit-animation-name: fadeInRight;
}
#articleInfo15 .imgBox p:hover img {
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	transform: rotate(3deg);
}
#page-form{background:#f8f8f8;padding:15px 20px;}
#page-form form,
#page-form fieldset{margin:0;padding:0;border:0;}
#page-form p{overflow:hidden;color:#000;font-size:16px;margin:5px 0;}
#page-form label{float:left;width:100px;text-align:right;padding:5px 0;}
#page-form span{float:right;width:calc(100% - 110px);display:block;}
#page-form .ra span{width:auto;float:left;margin-left:10px;padding:5px 0;}
#page-form input[type="text"],
#page-form select{width:calc(100% - 22px);padding:5px 10px;}
#page-form input#Checknum{width:80px;margin-left:10px;}
#page-form select{width:calc(100% - 1px);}
#page-form p.send input{background:#d60c0c;color:#fff;text-align:center;width:100%;padding:5px 0;border-radius:7px;font-size:18px;letter-spacing:0.2em;outline:none;margin-top:15px;}
#page-form h2{text-align:center;color:#9c9c9c;font-size:14px;margin-bottom:10px;}
#page-form h2 img{margin-right:5px;vertical-align:bottom;}
#page-form h2 b{display:inline-block;font-size:24px;color:#353535;margin-right:10px;vertical-align:baseline;}
#bottom-icon{background-image:url(/images/35/bottom-bg2.jpg);background-repeat:no-repeat;background-position:50% 50%;background-size:cover;}
#bottom-icon li{float:left;width:25%;text-align:center;margin:10px 0;}
#footerall{padding:20px 0;}
#footerall .left{float:left;width:49%;text-align:right;}
#footer-cis{text-align:right;}
#community{display:inline-block;text-align:center;}
#community a{color:#626263;font-size:20px;display:inline-block;margin-left:10px;border-left:1px solid #626263;padding-left:10px;}
#community a:first-child{border-left:0;}
#footerall .right{float:right;width:49%;text-align:left;color:#155456;font-size:14px;}
#footerall .right li p{display:inline-block;line-height:100%;border-left:1px solid #155456;padding-left:5px;margin-right:15px;}
#footerall .right li p:first-child{border-left:0;}
#footerall .right li p a{color:#155456;}
#webcopy{background:#2f2f2f;text-align:center;color:#fff;font-size:12px;padding:5px 0;}
#webSeo{margin-top:20px;color:#999;font-size:12px;}
#webcopy a{color:#fff;}
#gotop{position:fixed;right:20px;bottom:30px;font-size:14px;color:#bbb;z-index:9;border:2px solid #d6d6d6;padding:5px 10px;}
#gotop:hover{background:#bbb;color:#fff;}
#suspension {
    position: fixed;
    top: 30%;
    z-index: 1000;
    width: auto;
    right: 1%;
}
#suspension a {
    display: block;
}
@media screen and (max-width: 780px) {
#articleInfo15 ul {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}
}

@media screen and (max-width: 640px) {
	#productWrap ul li {
		width: 48%;
	}
}

@media screen and (max-width:480px){
#suspension {
    width: 60px;
}
#articleInfo15 ul li {
    float: left;
    width: 50%;
    animation-name: fadeInUp;
    -webkit-animation-name: fadeInUp;
}
}
@media screen and (max-width: 320px) {
	#productWrap ul li ,
	#aboutWrap ul li:nth-child(2) ,
	#aboutWrap ul li:nth-child(3) {
		width: 100%;
	}
	#aboutWrap ul li:nth-child(2) ,
	#aboutWrap ul li:nth-child(3) {
		margin-left: 0;
		margin-right: 0;
	}
}



