﻿
/* CSS Document */
 
* { margin: 0px; padding: 0px; /*-webkit-tap-highlight-color: transparent;*/ -webkit-appearance: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

img { border: none; }

a { text-decoration: none; color: #504f4f; transition: color .3s, background .5s, opacity .5s; -moz-transition: color .3s, background .5s, opacity .5s;  /* Firefox 4 */ -webkit-transition: color .3s, background .5s, opacity .5s;   /* Safari and Chrome */ -o-transition: color .3s, background .5s, opacity .5s;  /* Opera */ }

body { font-size: 14px; color: #565352; font-family: Arial, "Microsoft Yahei"; overflow-x: hidden; background: #f0f0f0; }

li { list-style: none; }

table { border-collapse: collapse; }

input,
textarea { font-family: Arial, "Microsoft Yahei"; font-size: 14px; outline: none; transition: color .3s, background .5s, opacity .5s, border .5s, box-shadow .5s, width .5s, hright .5s; -moz-transition: color .3s, background .5s, opacity .5s, border .5s, box-shadow .5s, width .5s, hright .5s;  /* Firefox 4 */ -webkit-transition: color .3s, background .5s, opacity .5s, border .5s, box-shadow .5s, width .5s, hright .5s;   /* Safari and Chrome */ -o-transition: color .3s, background .5s, opacity .5s, border .5s, box-shadow .5s, width .5s, hright .5s;  /* Opera */ }

.fg { clear: both; }

/* loading */
#loading { display: none;position: fixed; left: 0; top: 0; width: 100%; height: 100%; color: white; background: #fff; font-size: 1em; text-align: center; overflow: hidden; z-index: 999900000000; }

.spinner { margin: -15px auto; width: 30px; height: 30px; position: relative; top: 50%; }

.container1 > div,
.container2 > div,
.container3 > div { width: 5px; height: 5px; background-color: #ee4433; border-radius: 100%; position: absolute; -webkit-animation: bouncedelay 1.2s infinite ease-in-out; animation: bouncedelay 1.2s infinite ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.spinner .spinner-container { position: absolute; width: 100%; height: 100%; }

.container2 { -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); }

.container3 { -webkit-transform: rotateZ(90deg); transform: rotateZ(90deg); }

.circle1 { top: 0; left: 0; }

.circle2 { top: 0; right: 0; }

.circle3 { right: 0; bottom: 0; }

.circle4 { left: 0; bottom: 0; }

.container2 .circle1 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }

.container3 .circle1 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; }

.container1 .circle2 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }

.container2 .circle2 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }

.container3 .circle2 { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; }

.container1 .circle3 { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; }

.container2 .circle3 { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; }

.container3 .circle3 { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; }

.container1 .circle4 { -webkit-animation-delay: -0.3s; animation-delay: -0.3s; }

.container2 .circle4 { -webkit-animation-delay: -0.2s; animation-delay: -0.2s; }

.container3 .circle4 { -webkit-animation-delay: -0.1s; animation-delay: -0.1s; }
 @-webkit-keyframes bouncedelay {
 0%, 80%, 100% {
-webkit-transform: scale(0.0)
}
 40% {
-webkit-transform: scale(1.0)
}
}
 @keyframes bouncedelay {
 0%, 80%, 100% {
 transform: scale(0.0);
 -webkit-transform: scale(0.0);
}
40% {
 transform: scale(1.0);
 -webkit-transform: scale(1.0);
}
}
/*导航*/
@-webkit-keyframes badbounce {
 0%, 100% {
 -webkit-transform: translateY(0px);
}
 10% {
 -webkit-transform: translateY(6px);
}
 30% {
 -webkit-transform: translateY(-4px);
}
 70% {
 -webkit-transform: translateY(3px);
}
 90% {
 -webkit-transform: translateY(-2px);
}
}
@-moz-keyframes badbounce {
 0%, 100% {
 -moz-transform: translateY(0px);
}
 10% {
 -moz-transform: translateY(6px);
}
 30% {
 -moz-transform: translateY(-4px);
}
 70% {
 -moz-transform: translateY(3px);
}
 90% {
 -moz-transform: translateY(-2px);
}
}
@keyframes badbounce {
 0%, 100% {
 -webkit-transform: translateY(0px);
 -moz-transform: translateY(0px);
 -ms-transform: translateY(0px);
 -o-transform: translateY(0px);
 transform: translateY(0px);
}
 10% {
 -webkit-transform: translateY(6px);
 -moz-transform: translateY(6px);
 -ms-transform: translateY(6px);
 -o-transform: translateY(6px);
 transform: translateY(6px);
}
 30% {
 -webkit-transform: translateY(-4px);
 -moz-transform: translateY(-4px);
 -ms-transform: translateY(-4px);
 -o-transform: translateY(-4px);
 transform: translateY(-4px);
}
 70% {
 -webkit-transform: translateY(3px);
 -moz-transform: translateY(3px);
 -ms-transform: translateY(3px);
 -o-transform: translateY(3px);
 transform: translateY(3px);
}
 90% {
 -webkit-transform: translateY(-2px);
 -moz-transform: translateY(-2px);
 -ms-transform: translateY(-2px);
 -o-transform: translateY(-2px);
 transform: translateY(-2px);
}
}

.ss_animate { -webkit-animation: badbounce 1s linear; -moz-animation: badbounce 1s linear; animation: badbounce 1s linear; }

#ss_menu { bottom: 50px; width: 40px; height: 40px; color: #fff; position: fixed; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; right: 20px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); z-index: 100000000000; }

#ss_menu > .menu { display: block; position: absolute; border-radius: 50%; width: 40px; height: 40px; text-align: center; box-shadow: 3 3px 10px rgba(0, 0, 0, 0.23), 3 3px 10px rgba(0, 0, 0, 0.16); color: #fff; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; }

#ss_menu > .menu .share { width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; }

#ss_menu > .menu .share .circle { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; position: absolute; width: 20px; height: 3px; background: #fff; top: 50%; margin-top: -1.5px; left: 10px; opacity: 1; }

#ss_menu > .menu .share .circle:after { left: 20.78461px; top: 12.0px; }

#ss_menu > .menu .share .circle:before { left: 20.78461px; top: -12.0px; }

#ss_menu > .menu .share .bar { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; width: 20px; height: 3px; background: #fff; position: absolute; top: 50%; margin-top: -8px; left: 50%; margin-left: -10px; -webkit-transform-origin: 0% 50%; -moz-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; transform-origin: 0% 50%; }

#ss_menu > .menu .share .bar:before { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; content: ''; width: 20px; height: 3px; margin-top: 14px; background: #fff; position: absolute; left: 0px; -webkit-transform-origin: 0% 50%; -moz-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; transform-origin: 0% 50%; }

#ss_menu > .menu .share.close .circle { opacity: 0; }

#ss_menu > .menu .share.close .bar { top: 50%; margin-top: -1.5px; left: 50%; margin-left: -10px; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(405deg); -moz-transform: rotate(405deg); -ms-transform: rotate(405deg); -o-transform: rotate(405deg); transform: rotate(405deg); }

#ss_menu > .menu .share.close .bar:before { -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(-450deg); -moz-transform: rotate(-450deg); -ms-transform: rotate(-450deg); -o-transform: rotate(-450deg); transform: rotate(-450deg); margin: 0px; }

#ss_menu > .menu.ss_active { background: #00796B; -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); -o-transform: scale(0.9); transform: scale(0.9); }

#ss_menu > div { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: absolute; width: 60px; height: 60px; font-size: 16px; text-align: center; background: #ee4433; border-radius: 50%; display: table; transition: top .5s, left .5s, opacity .5s; -moz-transition: top .5s, left .5s, opacity .5s; -webkit-transition: top .5s, left .5s, opacity .5s; -o-transition: top .5s, left .5s, opacity .5s; box-shadow:-0px -0px 10px rgba(0,0,0,.175);}

#ss_menu > div a { width: 60px; height: 60px; color: #fff; display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; -webkit-box-align: center; display: -moz-box; -moz-box-orient: horizontal; -moz-box-pack: center; -moz-box-align: center; display: -o-box; -o-box-orient: horizontal; -o-box-pack: center; -o-box-align: center; display: -ms-box; -ms-box-orient: horizontal; -ms-box-pack: center; -ms-box-align: center; display: box; box-orient: horizontal; box-pack: center; box-align: center; text-align: center; }

#ss_menu > div i { display: table-cell; vertical-align: middle; }

#ss_menu > div:hover { cursor: pointer; }

#ss_menu div:nth-child(1) { top: 0px; left: -160px; }

#ss_menu div:nth-child(2) { top: -80.0px; left: -138.56406px; }

#ss_menu div:nth-child(3) { top: -138.56406px; left: -80.0px; }

#ss_menu div:nth-child(4) { top: -160px; left: 0.0px; }

#ss_menu div:nth-child(5) { top: -80px; left: -80px; }

#ss_menu.ss_active div:nth-child(5) { top: -60px; left: -60px; }
/*导航 end*/


/*footer*/
.footer-nav{ line-height:44px; height:44px; text-align:center; background:#807f7f; margin-top:19px;}
.footer-nav a{ display:block; width:20%; height:44px; color:#fff; float:left;}
footer{ padding:10px 3%; font-size:14px; background:#fff;}
footer span{ margin:0 5px;}
footer .href{ text-align:center; padding:0 0 8px;}
footer .href a.on{ color:#000;}
footer .view{ font-size:12px; text-align:center; line-height:20px;}
/*footer end*/