@import "http://font-style: em;googleapis.com/css?family=Open+Sans)";

* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box}
.fw-icons p,.fw-icons01 p,.fw-icons02 p,.fw-icons03 p,.fw-icons04 p,.fw-icons05 p{width:100px;margin:12px auto 0 auto;font-size:14px;line-height:26px;font-family:"微软雅黑"}
.pull-right {float: right}
.pull-left {float: left}
header {padding: 30px 20px;background: rgba(64,82,100,0.92);color: #ffffff;margin-bottom: 20px}
.btn-download {background: rgba(24,42,60,0.92);color: rgba(124,142,160,0.92);padding: 20px 50px;display: inline-block;-webkit-border-radius: 5px;-moz-border-radius: 5px;-o-border-radius: 5px;-ms-border-radius: 5px;border-radius: 5px}
.btn-download:hover {background: rgba(94,112,130,0.92)}
.wrapper {max-width: 1000px;margin: 0 auto}
.wrapper:before, .wrapper:after {content: '';display: table;clear: both}
@keyframes anima {
from {margin-top:-50px;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=($opacity * 100))";filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity:0;opacity:0}
to {margin: auto;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=($opacity * 100))";filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity: 1}
}
@-webkit-keyframes anima {from {margin-left:-20px;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=($opacity * 100))";filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity:0;opacity:0}
to {margin-left: 10px;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=($opacity * 100))";filter: alpha(opacity=100);-moz-opacity: 1;-khtml-opacity: 1;opacity: 1}}
@media screen and (max-width: 560px) {.wrapper {padding: 20px}}
.pic {width: 140px;height: 140px;position: relative;display: inline-block;-webkit-animation: anima 2s;-moz-animation: anima 2s;-o-animation: anima 2s;-ms-animation: anima 2s;animation: anima 2s;
-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;-o-backface-visibility: hidden;-ms-backface-visibility: hidden;backface-visibility: hidden}
.pic-3d {-webkit-perspective: 500;-moz-perspective: 500;-o-perspective: 500;-ms-perspective: 500;perspective: 500;-webkit-transform-style: preserve-3d;-moz-transform-style: preserve-3d;
-o-transform-style: preserve-3d;-ms-transform-style: preserve-3d;transform-style: preserve-3d}
.pic-caption {cursor: default;position: absolute;width:144px;height:144px;-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;background: rgba(44,62,80,0.92);padding:10px 0;
text-align:justify;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=($opacity * 100))";filter: alpha(opacity=0);-moz-opacity: 0;-khtml-opacity: 0;opacity: 0}
.pic-image {-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-o-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1)}
.pic:hover .pic-image {-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transform: scale(1)}
a, a:hover, .pic .pic-image, .pic-caption, .pic:hover .pic-caption, .pic:hover img {-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;-ms-transition: all 0.5s ease;transition: all 0.5s ease}
.pic:hover .bottom-to-top, .pic:hover .top-to-bottom, .pic:hover .left-to-right, .pic:hover .right-to-left, .pic:hover .rotate-in, .pic:hover .rotate-out, .pic:hover .open-up, .pic:hover .open-down, .pic:hover .open-left, .pic:hover .open-right, .pic:hover .come-left, .pic:hover .come-right {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=($opacity * 100))";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
-webkit-user-select: none;
-moz-user-select: none;
-o-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-moz-touch-callout: none;
-o-touch-callout: none;
-ms-touch-callout: none;
touch-callout: none;
-webkit-tap-highlight-color: transparent;
-moz-tap-highlight-color: transparent;
-o-tap-highlight-color: transparent;
-ms-tap-highlight-color: transparent;
tap-highlight-color: transparent}
.bottom-to-top {top: 50%;left: 0}
.pic:hover .bottom-to-top {top: 0;left: 0}
.top-to-bottom {bottom: 50%;left: 0}
.pic:hover .top-to-bottom {left: 0;bottom: 0}
.left-to-right {top: 0;right: 50%}
.pic:hover .left-to-right {right: 0;top: 0}
.right-to-left {top: 0;left: 50%}
.pic:hover .right-to-left {left: 0;top: 0}
.rotate-in {-webkit-transform: rotate(90deg) scale(0.1);-moz-transform: rotate(90deg) scale(0.1);-o-transform: rotate(90deg) scale(0.1);-ms-transform: rotate(90deg) scale(0.1);
transform: rotate(90deg) scale(0.1);top: 0;left: 0}
.pic:hover .rotate-in {-webkit-transform: rotate(360deg) scale(1);-moz-transform: rotate(360deg) scale(1);-o-transform: rotate(360deg) scale(1);-ms-transform: rotate(360deg) scale(1);transform: rotate(360deg) scale(1)}
.rotate-out {-webkit-transform: rotate(90deg) scale(3);-moz-transform: rotate(90deg) scale(3);-o-transform: rotate(90deg) scale(3);-ms-transform: rotate(90deg) scale(3);transform: rotate(90deg) scale(3);top: 0;left: 0}
.pic:hover .rotate-out {-webkit-transform: rotate(360deg) scale(1);-moz-transform: rotate(360deg) scale(1);-o-transform: rotate(360deg) scale(1);-ms-transform: rotate(360deg) scale(1);transform: rotate(360deg) scale(1)}
.open-down {-webkit-transform: rotateX(-180deg);-moz-transform: rotateX(-180deg);-o-transform: rotateX(-180deg);-ms-transform: rotateX(-180deg);transform: rotateX(-180deg);top: 0;left: 0}
.pic:hover .open-down {-webkit-transform: rotateX(0);-moz-transform: rotateX(0);-o-transform: rotateX(0);-ms-transform: rotateX(0);transform: rotateX(0)}
.open-up {-webkit-transform: rotateX(180deg);-moz-transform: rotateX(180deg);-o-transform: rotateX(180deg);-ms-transform: rotateX(180deg);transform: rotateX(180deg);top: 0;left: 0}
.pic:hover .open-up {-webkit-transform: rotateX(0);-moz-transform: rotateX(0);-o-transform: rotateX(0);-ms-transform: rotateX(0);transform: rotateX(0)}
.open-left {-webkit-transform: rotateY(180deg);-moz-transform: rotateY(180deg);-o-transform: rotateY(180deg);-ms-transform: rotateY(180deg);transform: rotateY(180deg);left: 0;top: 0}
.pic:hover .open-left {-webkit-transform: rotateY(0deg);-moz-transform: rotateY(0deg);-o-transform: rotateY(0deg);-ms-transform: rotateY(0deg);transform: rotateY(0deg)}
.open-right {-webkit-transform: rotateY(-180deg);-moz-transform: rotateY(-180deg);-o-transform: rotateY(-180deg);-ms-transform: rotateY(-180deg);transform: rotateY(-180deg);left: 0;top: 0}
.pic:hover .open-right {-webkit-transform: rotateY(0deg);-moz-transform: rotateY(0deg);-o-transform: rotateY(0deg);-ms-transform: rotateY(0deg);transform: rotateY(0deg)}
.come-left {-webkit-transform: rotateY(90deg) rotateX(90deg);-moz-transform: rotateY(90deg) rotateX(90deg);-o-transform: rotateY(90deg) rotateX(90deg);-ms-transform: rotateY(90deg) rotateX(90deg);transform: rotateY(90deg) rotateX(90deg);left: 0;top: 0}
.pic:hover .come-left {-webkit-transform: rotateY(0) rotateX(0);-moz-transform: rotateY(0) rotateX(0);-o-transform: rotateY(0) rotateX(0);-ms-transform: rotateY(0) rotateX(0);transform: rotateY(0) rotateX(0)}
.come-right {-webkit-transform: rotateY(-90deg) rotateX(-90deg);-moz-transform: rotateY(-90deg) rotateX(-90deg);-o-transform: rotateY(-90deg) rotateX(-90deg);-ms-transform: rotateY(-90deg) rotateX(-90deg);transform: rotateY(-90deg) rotateX(-90deg);left: 0;top: 0}
.pic:hover .come-right {-webkit-transform: rotateY(0) rotateX(0);-moz-transform: rotateY(0) rotateX(0);-o-transform: rotateY(0) rotateX(0);-ms-transform: rotateY(0) rotateX(0);transform: rotateY(0) rotateX(0)}
@media screen and (max-width: 560px) {
.pic {max-width: 400px;max-height: 300px;display: block;-webkit-animation: none;-moz-animation: none;-o-animation: none;-ms-animation: none;animation: none;margin: 10px auto}}
