.by { -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; }

.bd3 { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }

.scale-img:hover img { -webkit-transform: scale(1.04, 1.04); -moz-transform: scale(1.04, 1.04); -ms-transform: scale(1.04, 1.04); -o-transform: scale(1.04, 1.04); transform: scale(1.04, 1.04); }

.scale-img { overflow: hidden; }

.headerbg { height: 102px; background: #fff; }
@media screen and (max-width: 480px) { .headerbg { height: auto; } }
.header { height: 72px; padding: 15px 0; background: url("/_vivi/source/aHR0cHM6Ly9lZHAubmFua2FpLmVkdS5jbg/images/headbg.jpg") right center no-repeat; }
@media screen and (max-width: 480px) { .header { height: 60px; background: #fff; padding: 0; position: fixed; left: 0; top: 0; right: 0; z-index: 999; } }

.head-logo { width: 452px; height: 72px; float: left; }
.head-logo a,.head-logo img { display:block; width: 100%; height: 100%; }
@media screen and (max-width: 480px) { .head-logo { width: 264px; height: 42px; margin-top: 9px; } }

.ban { height: 540px; }
.ban .swiper-slide a { display: block; height: 540px; }
@media screen and (max-width: 480px) { .ban { height: auto; }
  .ban .swiper-slide a { height: auto; } }
.ban .swiper-pagination-bullet { width: 10px; height: 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; background: #fff; opacity: 1; margin-right: 5px; }
.ban .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 20px; height: 10px; background: #4f0031; opacity: 1; }
.ban .swiper-button-next, .ban .swiper-button-prev { width: 50px; height: 50px; position: absolute; top: 50%; margin-top: -25px; z-index: 10; cursor: pointer; overflow: hidden; }
@media screen and (max-width: 480px) { .ban .swiper-button-next, .ban .swiper-button-prev { display: none; } }
.ban .swiper-button-prev { left: 15px; background: url("/_vivi/source/aHR0cHM6Ly9lZHAubmFua2FpLmVkdS5jbg/images/slider-arrow.png") 0 0; }
.ban .swiper-button-next { right: 15px; background: url("/_vivi/source/aHR0cHM6Ly9lZHAubmFua2FpLmVkdS5jbg/images/slider-arrow.png") -50px 0; }

.new { width: 585px; }
@media screen and (max-width: 480px) { .new { width: 100%; } }
.new-menu { line-height: 32px; }
.new-menu h3 { color: #8a0257; font-size: 24px; }
.new-menu h3 span { font-size: 14px; color: #afafaf; text-transform: uppercase; margin-left: 8px; }
.new-menu h3 i { font-size: 28px; vertical-align: -3px; margin-right: 5px; }
.new-menu a { font-size: 13px; color: #aaabab; }
.new-menu a:hover { color: #8a0257; }
@media screen and (max-width: 480px) { .new-menu { line-height: 30px; margin-bottom: 4px; }
  .new-menu h3 { font-size: 16px; font-weight: bold; }
  .new-menu h3 i, .new-menu h3 span { display: none; } }

@media screen and (min-width: 480px) { .new-pic { width: 585px; height: 242px; overflow: hidden; margin-top: 10px; }
  .new-pic img { width: 585px; height: 242px; }
  .new-pic:hover img { -webkit-transform: scale(1.04, 1.04); -moz-transform: scale(1.04, 1.04); -ms-transform: scale(1.04, 1.04); -o-transform: scale(1.04, 1.04); transform: scale(1.04, 1.04); } }
@media screen and (max-width: 480px) { .new-pic { width: 100%; height: auto; }
  .new-pic img { width: 100%; height: auto; } }

.new-txt { margin-top: 8px; }
.new-txt ul li { font-size: 14px; line-height: 32px; }
.new-txt ul li span { color: #999; }
.new-txt ul li a { height: 32px; position: relative; padding-left: 14px; }
.new-txt ul li a i { width: 8px; height: 8px; position: absolute; left: 0; top: 50%; margin-top: -4px; background: #c2c2c2; }
.new-txt ul li img { margin-left: 5px; }
@media screen and (max-width: 480px) { .new-txt ul { margin-top: 5px; }
  .new-txt ul li span { display: none; } }

.ind2-Menu { font-size: 24px; line-height: 40px; padding-bottom: 10px; }
.ind2-Menu a { height: 40px; color: #333; margin-right: 40px; position: relative; display: inline-block; }
.ind2-Menu a span { width: 0; height: 5px; background: red; position: absolute; left: 50%; margin-left: 0; bottom: -10px; }
.ind2-Menu a:hover, .ind2-Menu a.ind2Tab-cur { color: #8a0257; }
.ind2-Menu a:hover span, .ind2-Menu a.ind2Tab-cur span { background: #8a0257; width: 32px; margin-left: -16px; background: #8a0257; }
.ind2-Menu a.pull-right { font-size: 13px; color: #aaabab; margin-right: 0; }
.ind2-Menu a.pull-right:hover { color: #8a0257; }
@media screen and (max-width: 480px) { .ind2-Menu { font-size: 16px; font-weight: bold; line-height: 36px; padding-top: 5px; }
  .ind2-Menu a { height: 36px; margin-right: 10px; }
  .ind2-Menu a span { height: 2px; bottom: 0; } }

.ind2-con ul { margin: -10px -15px 0; }
.ind2-con ul li { width: 33.3333333333%; float: left; margin-top: 24px; }
@media screen and (max-width: 480px) { .ind2-con ul { margin: -12px -6px 0; }
  .ind2-con ul li { width: 50%; margin-top: 12px; } }
.ind2Box { margin: 0 15px; }
.ind2Box h2, .ind2Box p { padding: 0 12px; }
.ind2Box h2 { font-size: 16px; line-height: 24px; margin-top: 16px; }
.ind2Box p { font-size: 14px; line-height: 20px; }
.ind2Box a { background: #fff; display: block; padding-bottom: 17px; }
.ind2Box a h2 { color: #333; font-weight: bold; }
.ind2Box a p { color: #999; }
.ind2Box a:hover h2 { color: #8a0257; }
.ind2Box a:hover .ind2Box-img img { -webkit-transform: scale(1.04, 1.04); -moz-transform: scale(1.04, 1.04); -ms-transform: scale(1.04, 1.04); -o-transform: scale(1.04, 1.04); transform: scale(1.04, 1.04); }
@media screen and (max-width: 480px) { .ind2Box { margin: 0 6px; }
  .ind2Box h2, .ind2Box p { padding: 0 6px; }
  .ind2Box h2 { font-size: 14px; margin-top: 4px; }
  .ind2Box a { padding-bottom: 7px; } }

.ind2Box-img { width: 380px; height: 236px; overflow: hidden; }
.ind2Box-img img { width: 380px; height: 236px; display: block; }
@media screen and (max-width: 480px) { .ind2Box-img { width: auto; height: auto; }
  .ind2Box-img img { width: 100%; height: 110px; } }

.newList ul { margin: -24px -15px 0; }
.newList ul li { width: 33.3333333333%; float: left; margin-top: 24px; }
@media screen and (max-width: 480px) { .newList ul { margin: -12px -3px 0; }
  .newList ul li { width: 50%; margin-top: 12px; } }
.newBox { margin: 0 15px; }
.newBox h2, .newBox p { padding: 0 15px; }
.newBox h2 { font-size: 15px; min-height: 44px; line-height: 22px; margin-top: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; -moz-box-orient: vertical; font-weight: bold; }
.newBox p { font-size: 14px; line-height: 28px; margin-top: 5px; }
.newBox a { background: #fff; display: block; padding-bottom: 10px; }
.newBox a h2 { color: #333; }
.newBox a p { color: #999; }
.newBox a:hover { box-shadow: 0 0 12px rgba(0, 0, 0, 0.15); }
.newBox a:hover h2 { color: #8a0257; }
.newBox a:hover .newBox-pic img { -webkit-transform: scale(1.04, 1.04); -moz-transform: scale(1.04, 1.04); -ms-transform: scale(1.04, 1.04); -o-transform: scale(1.04, 1.04); transform: scale(1.04, 1.04); }
@media screen and (max-width: 480px) { .newBox { margin: 0 6px; }
  .newBox h2, .newBox p { padding: 0 6px; }
  .newBox h2 { font-size: 14px; min-height: 36px; line-height: 18px; font-weight: normal; margin-top: 5px; }
  .newBox p { font-size: 13px; }
  .newBox a { padding-bottom: 5px; } }

.newBox-pic { width: 380px; height: 245px; overflow: hidden; }
.newBox-pic img { width: 380px; height: 245px; display: block; }
@media screen and (max-width: 480px) { .newBox-pic { width: auto; height: auto; }
  .newBox-pic img { width: 100%; height: 110px; } }

.news { background: #fff; padding: 15px 25px; }
@media screen and (max-width: 480px) { .news { padding: 10px 12px; margin: 0 -10px; } }
.news-title { text-align: center; padding: 30px 0 10px; }
.news-title h2 { font-size: 20px; line-height: 28px; color: #333; font-weight: bold; }
.news-title p { font-size: 13px; line-height: 18px; color: #999; margin-top: 5px; }
@media screen and (max-width: 480px) { .news-title { text-align: left; padding: 10px 0 10px; }
  .news-title h2 { font-size: 16px; line-height: 24px; } }

.news-artilce { font-size: 14px; line-height: 24px; padding: 20px 0 10px; min-height: 400px; }
@media screen and (max-width: 480px) { .news-artilce { padding: 10px 0 5px; min-height: auto; }
  .news-artilce img { width: 100%; height: auto; } }

.project-List { padding: 10px 20px 0; }
@media screen and (min-width: 480px) { .project-List > ul > li:nth-child(2n) { background: #f6f6f6; } }
@media screen and (max-width: 480px) { .project-List { padding: 5px 0 0; }
  .project-List > ul > li { border-bottom: 1px dotted #eee; } }
.projectLi { min-height: 42px; line-height: 42px; padding-left: 30px; padding-right: 450px; position: relative; }
.projectLi span { position: absolute; height: 42px; line-height: 42px; position: absolute; top: 0; color: #999; }
.projectLi span.projectLi-1 { width: 240px; text-align: left; left: 740px; }
.projectLi span.projectLi-2 { width: 100px; right: 15px; text-align: right; }
.projectLi a { color: #666; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; -moz-box-orient: vertical; }
.projectLi a i { width: 8px; height: 8px; position: absolute; top: 17px; left: 12px; background: #dbdbdb; }
.projectLi a:hover { color: #8a0257; }
.projectLi a:hover i { background: #8a0257; }
@media screen and (max-width: 480px) { .projectLi { min-height: 22px; line-height: 22px; padding: 12px 0 37px 15px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; -moz-box-orient: vertical; }
  .projectLi span { top: inherit; height: 22px; line-height: 22px; bottom: 10px; }
  .projectLi span.projectLi-1 { width: 60%; left: 15px; }
  .projectLi span.projectLi-2 { width: 40%; right: 0; text-align: left; }
  .projectLi a { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; -moz-box-orient: vertical; }
  .projectLi a i { left: 0; top: 18px; } }

.projects { padding: 20px; }
@media screen and (max-width: 480px) { .projects { padding: 10px 0; } }
.projects-title { font-size: 20px; line-height: 28px; color: #333; font-weight: bold; text-align: center; }
@media screen and (max-width: 480px) { .projects-title { font-size: 16px; line-height: 24px; text-align: left; } }

.projects1 { background: #f7f7f7; padding: 12px 15px; margin-top: 20px; }
.projects1 ul li { width: 33.3333333333%; float: left; font-size: 14px; line-height: 24px; }
.projects1 ul li span { font-weight: bold; color: #555; }
@media screen and (max-width: 480px) { .projects1 { padding: 6px 10px; margin-top: 10px; }
  .projects1 ul li { width: 100%; } }

.projects2M { font-size: 18px; line-height: 24px; color: #8a0257; font-weight: bold; margin: 20px 0 5px; }
.projects2M i { font-size: 20px; margin-right: 12px; vertical-align: -1px; }

.projects2C { font-size: 14px; line-height: 26px; color: #666; margin-left: 32px; margin-top: 10px; }
@media screen and (max-width: 480px) { .projects2C { margin-left: 0; } }

.sub-jw ul { margin: -24px -15px 0; }
.sub-jw ul li { width: 33.3333333333%; float: left; margin-top: 24px; }
@media screen and (max-width: 480px) { .sub-jw ul { margin: -12px -6px 0; }
  .sub-jw ul li { width: 50%; margin-top: 12px; } }

.sub-case ul { margin: -24px -15px 0; }
.sub-case ul li { width: 33.3333333333%; float: left; margin-top: 24px; }
@media screen and (max-width: 480px) { .sub-case ul { margin: -12px -6px 0; }
  .sub-case ul li { width: 50%; margin-top: 12px; } }
.caseBox { margin: 0 15px; }
.caseBox h2, .caseBox p { padding: 0 12px; }
.caseBox h2 { font-size: 16px; line-height: 24px; margin-top: 16px; }
.caseBox p { font-size: 14px; line-height: 20px; }
.caseBox a { background: #fff; display: block; padding-bottom: 17px; }
.caseBox a h2 { color: #333; font-weight: bold; }
.caseBox a p { color: #999; }
.caseBox a:hover h2 { color: #8a0257; }
.caseBox a:hover .caseBox-img img { -webkit-transform: scale(1.04, 1.04); -moz-transform: scale(1.04, 1.04); -ms-transform: scale(1.04, 1.04); -o-transform: scale(1.04, 1.04); transform: scale(1.04, 1.04); }
@media screen and (max-width: 480px) { .caseBox { margin: 0 6px; }
  .caseBox h2, .caseBox p { padding: 0 6px; }
  .caseBox h2 { font-size: 14px; margin-top: 4px; }
  .caseBox a { padding-bottom: 7px; } }

.caseBox-img { width: 380px; height: 236px; overflow: hidden; }
.caseBox-img img { width: 380px; height: 236px; display: block; }
@media screen and (max-width: 480px) { .caseBox-img { width: auto; height: auto; }
  .caseBox-img img { width: 100%; height: auto; } }

/*# sourceMappingURL=style.css.map */