a {
    color: #999999;
}
a:hover {
    color: #0d1232;
}
ul,
li {
    list-style: none;
}
#app {
    background-color: #f2f2f2;
    width: 100%;
    min-width: 1255px;
}
#app * {
    position: relative;
}
#app .header,
#app .footer {
    width: 100%;
    min-width: 1255px;
}
#app .header {
    padding: 40px 4.5% 20px;
}
#app .header .list-group {
    display: inline-block;
    width: 100%;
    min-width: 880px;
    color: #595959;
    font-size: 20px;
}
#app .header .list-group .list-name {
    margin: 28px 10px 0;
    float: right;
    cursor: pointer;
}
#app .header .list-group .active {
    color: #1a1f4d;
    font-weight: bold;
    border-bottom: 1px solid #1a1f4d;
}
#app .header li {
    display: inline-block;
    height: 100%;
}
#app .header li img {
    height: 100%;
}
#app .header .list-name:hover {
    color: #1a1f4d;
    font-weight: bold;
}
#app .footer {
    padding: 40px 8% 10px;
    background-color: #1a1f4d;
    color: #757682;
    font-size: 14px;
}
#app .footer div {
    padding: 4px 0;
}
#app .footer li {
    display: inline-block;
    height: 100%;
}
#app .footer .list-group {
    display: inline-block;
    width: 100%;
    min-width: 880px;
    margin-bottom: 14px;
}
#app .footer .list-group .list-name {
    margin: 0 10px 0 0;
    float: left;
    cursor: pointer;
}
#app .footer .list-group .active {
    color: #f2f2f2;
    font-weight: bold;
    border-bottom: 1px solid #f2f2f2;
}
#app .footer .list-name:hover {
    color: #f2f2f2;
    font-weight: bold;
}
#app #content .content-banner {
    width: 100%;
}
#app #content .content-banner img {
    width: 100%;
}
#app #content .utils-content {
    max-width: 1255px;
    min-width: 1255px;
    top: -28px;
    margin: 0 auto;
}
#app #content .utils-content .product-center,
#app #content .utils-content .contact-us {
    background-color: #FFFFFF;
    padding: 28px;
}
#app #content .utils-content .product-center {
    margin-bottom: 18px;
}
#app #content .utils-content .product-center .left-panel,
#app #content .utils-content .product-center .right-panel {
    float: left;
}
#app #content .utils-content .product-center .left-panel {
    width: 30%;
}
#app #content .utils-content .product-center .left-panel .product-list {
    padding-left: 60px;
    margin-top: -22.400000000000002px;
    line-height: 27px;
}
#app #content .utils-content .product-center .left-panel .product-list .list-title {
    color: #1a1f4d;
    font-weight: 600;
    font-size: 22px;
    margin-top: 18px;
}
#app #content .utils-content .product-center .left-panel .product-list .product-name {
    background-color: #1a1f4d;
    color: #FFFFFF;
    font-weight: lighter;
    font-size: 18px;
    line-height: 32px;
    width: 60%;
    cursor: pointer;
}
#app #content .utils-content .product-center .left-panel .product-list .product-name .iconfont {
    font-size: 18px;
    padding: 0 6px;
}
#app #content .utils-content .product-center .left-panel .product-list li {
    margin: 6px 0 0;
}
#app #content .utils-content .product-center .right-panel {
    overflow: auto;
    width: 70%;
    height: 820px;
}
#app #content .utils-content .product-center .right-panel .product-item {
    width: 50%;
    float: left;
}
#app #content .utils-content .product-center .right-panel .product-item .detail {
    left: 24px;
    top: 118px;
    width: 170px;
    height: 36px;
    line-height: 36px;
    color: #ffffff;
    background-color: #1a1f4d;
    font-size: 16px;
    text-align: center;
    position: absolute;
    cursor: pointer;
}
#app #content .utils-content .product-center .right-panel .product-item .detail:hover {
    background-color: #0d1232;
}
#app #content .utils-content .product-center .right-panel .product-item .product-shortcut {
    width: 100%;
    height: 100%;
    padding: 0 4px 0 0;
}
#app #content .utils-content .product-center .pop-out {
    position: absolute;
    left: 30%;
    top: 28px;
    right: 28px;
    bottom: 28px;
    z-index: 5;
    background-color: #dfdfdf;
    display: none;
}
/* 清除浮动高度塌陷 */
#app #content .utils-content .product-center .right-panel:after,
#app #content .utils-content .product-center .right-panel:before {
    content: " ";
    display: table;
}
#app #content .utils-content .product-center .right-panel:after {
    clear: both;
}
/* 清除浮动高度塌陷 */
#app #content .utils-content .product-center:after,
#app #content .utils-content .product-center:before,
#app #content .utils-content .sub-panel:after,
#app #content .utils-content .sub-panel:before {
    content: " ";
    display: table;
}
#app #content .utils-content .product-center:after,
#app #content .utils-content .sub-panel:after {
    clear: both;
}
#app #content .utils-content .sub-panel .left-panel {
    float: left;
}
#app #content .utils-content .sub-panel .left-panel .content-list {
    padding-left: 60px;
    margin-top: -22.400000000000002px;
    line-height: 27px;
}
#app #content .utils-content .sub-panel .left-panel .content-list .list-title {
    color: #1a1f4d;
    font-weight: 600;
    font-size: 22px;
    margin-top: 18px;
    cursor: pointer;
}
#app #content .utils-content .sub-panel .right-panel {
    float: left;
}
#app #content .utils-content .contact-us {
    width: 35%;
}
#app #content .utils-content .contact-us .info-list {
    padding-left: 48px;
    margin-top: -22.400000000000002px;
    font-size: 18px;
    color: #1a1f4d;
    font-weight: 600;
}
#app #content .utils-content .contact-us .info-list li {
    padding: 6px 0 0;
    font-weight: 600;
    line-height: 30px;
}
#app #content .utils-content .news-center,
#app #content .utils-content .contact-us {
    height: 560px;
}
#app #content .utils-content .news-center {
    width: 65%;
    float: left;
    padding-left: 18px;
    padding-top: 0;
}
#app #content .utils-content .news-center .wrapper {
    background-color: #ffffff;
    padding: 28px;
    height: 100%;
}
#app #content .utils-content .news-center .wrapper .news-list {
    padding-top: 30px;
    height: 400px;
    overflow: auto;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item:after,
#app #content .utils-content .news-center .wrapper .news-list .news-item:before {
    content: " ";
    display: table;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item:after {
    clear: both;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item {
    width: 100%;
    padding-top: 12px;
    padding-bottom: 18px;
    border-bottom: 1px solid #959595;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item .news-info {
    width: 60%;
    float: left;
    padding-right: 18px;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item .news-info .news-title {
    font-size: 14px;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item .news-info .news-content {
    padding-top: 16px;
    font-size: 12px;
    width: 80%;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item .detail {
    left: 0;
    bottom: 33px;
    width: 139px;
    height: 29px;
    line-height: 29px;
    color: #ffffff;
    background-color: #1a1f4d;
    font-size: 16px;
    text-align: center;
    position: absolute;
    cursor: pointer;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item .detail:hover {
    background-color: #0d1232;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item .news-image {
    width: 40%;
    float: left;
}
#app #content .utils-content .news-center .wrapper .news-list .news-item .news-image img {
    width: 100%;
}
/* 弹出窗口 */
#app .pop-out-viewer {
    padding: 10px;
    background-color: #dfdfdf;
}
#app .pop-out-viewer .close-button {
    position: absolute;
    right: 10px;
    top: 10px;
    height: 40px;
    width: 40px;
    z-index: 10;
    cursor: pointer;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAA2CAYAAACMRWrdAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGN0UxOTEyQzVCNDJFOTExQTA4QUYzOUU0QkYwRTY3QyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpBOURDMzgyNDk1NzkxMUU5QTIyQ0Y1ODY0Rjc0NENFMCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpBOURDMzgyMzk1NzkxMUU5QTIyQ0Y1ODY0Rjc0NENFMCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkMzRUI4MzkwMDk4MkU5MTE5QjA3QzM0RjNDNTk0ODU0IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkY3RTE5MTJDNUI0MkU5MTFBMDhBRjM5RTRCRjBFNjdDIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+rS5TUgAAAhdJREFUeNrs2r1KA0EQwPHLEBJLH0BsrDRpRRtBBCF1uthrIJUPYKsQq2Cl5gFs8wQatFAQ0hkrSx/AQlCLxJlkDoIoubvdmd09HPjb+MH+yF6Oi1uo1+sRTgE74NawhSis+cCG2AXWxcZFRl1hy9gh9sg/GNLQC7GOtbEdrEGwfWwJ28a+ojCHXog7NlyTCfBLEzsKGDU7X2xpEqyC3Uf5GbJUCFbGPnMEI0sZopxOEtgKb1dfpsJrMoLR93vYjSe4Cq+lN2/t82Ajvh2UPMDFqBKvaWS6FR+wmmPcLKrGazK+xlzjUqPSwFzhMqHSwrRxmVFZYFo4I1RWmDTOGGUCk8JZQZnCbOOsoWzAbOGsomzBTHHWUTZhWXEiKNuwtDgxlAQsKa4qiZKCzcNV+QMXMZQk7C+cCkoa9hNHH4/daqA0YDGuhS1yLWmUFoy2Xwd75zoajzyggIqvqV1O5XkOlFDxNaX2PAeKKNWHVVBGqeHAAUoFB45Q4jhwiBLFgWOUGA48QIngwBOUdRx4hLKKA89Q1nDgIcoKDjxFGePAY5QRLims7Qj1G+40yS8UE/7hvWj6D+1B5G4IR8eJXmzC3hyj4hlIvHkENf+wEGGTs0c5Mk3OhhHsCdvMEWwDGxKMjpse8z0i9CHDCXZOMDpD+4r1sa1At2WZ195nS5fuY2OsEU0POp9hqwHi6H3imXffJZm+BRgAORW6orDaeiUAAAAASUVORK5CYII=");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
}
#app .pop-out-viewer .product-image {
    width: 100%;
}
#app .pop-out-viewer .product-image img {
    width: 100%;
}
#app .pop-out-viewer .product-description {
    padding: 0 24px;
    color: #525252;
    height: 340px;
    overflow: auto;
}
#app .pop-out-viewer .product-description .sub-title {
    font-size: 20px;
    font-weight: 600;
    padding: 10px 0;
    border-bottom: 1px solid #525252;
}
#app .pop-out-viewer .product-description .description {
    font-size: 16px;
    padding: 6px 0;
    line-height: 1.5;
}
.about-us {
    width: 65%;
    float: left;
    background-color: #f2f2f2;
    padding-left: 18px;
    padding-top: 0;
}
.about-us .wrapper {
    background-color: #FFFFFF;
    font-size: 18px;
    padding: 28px;
    overflow-y: scroll;
}
.about-us .wrapper p {
    text-indent: 36px;
    line-height: 36px;
    letter-spacing: 2.16px;
    color: #525252;
}
.about-us .wrapper .important {
    color: #000000;
    font-size: 22.05px;
    letter-spacing: 2.16px;
    font-weight: bold;
    padding: 22.05px 0 36px;
}
