@charset "utf-8";
/* CSS Document */
.clean {
  clear: both;
}
.fx-roll-body {position: absolute; height:240px}

.design-roll {height:240px;position: relative;}
#boxa {overflow:hidden;}
/*产品滚动*/
#wrapper {
  overflow: hidden;
  width: 1920px;
  height: 385px;
  position: relative;
}
#wrapper ul {
  position: absolute;
  left: 0;
  top: 0;
}
#wrapper li {
  float: left;
  list-style: none;
  border: 1px solid #ccc;
  text-align: center;
  margin-left: 10px
}
#wrapper li:hover {
  background-color: #c8a064;
  color: #FFFFFF !important;
  border: 1px solid #c8a064;
}
#wrapper li a:hover  {
 
  color: #FFFFFF !important;
 
}
#wrapper h3:hover {
  color: #fff;
}
#wrapper li img {
  width: 300px;
  height: 300px;
 
  /* height: 225px; border-radius: 9px;*/
  display: block;
  margin: 0 auto;
  border-bottom: 1px solid #ccc;
}
input[type=button] {
  margin-top: 20px;
  width: 35px;
  height: 25px;
  line-height: 25px;
}
/*产品分类*/
.fen {overflow: hidden;}
.fen li {
  float: left;
  display: block;
  max-height: 446px;
  background-color: #FF696C;
  margin-bottom: 10px;
      overflow: hidden;
}

.fen_a {
  width: 68%;
  margin-right: 1%
}
.fen_b {
  width: 31%;
}
.fen_c {
  width: 31%;
  margin-right: 1%
}
.fen_d {
  width: 68%;
}
.fen_e {
  width: 31%;
  margin-right: 1%
}
.fen_f {
  width: 33.5%;
  margin-right: 1%
}
.fen_g {
  width: 33.5%;
}
/*公司介绍*/
.aboutus {
  background: url(/skin/images/aboutbg.jpg);
}
.abouttext {
  background: url(/skin/images/abouttext.jpg) no-repeat;
	padding: 50px;
}
.aboutleft {
  float: left;
  width: 50%
}
.aboutright {
  float: right;
  width: 50%;
padding-top: 75px;
}
.aboutleft h2 {
  margin-top: 110px;
  padding-left: 170px;
  font-size: 32px;
  color: #2a427e;
}
.abtext { padding:10px 50px 0 80px; font-size:17px}
 .fx-service {
    padding: 20px 0 0 36px;
    height: 30px;
    line-height: 30px;
    font-size: 16px;
}
.fx-service .fx-sTitle {
    float: left;
    margin-right: 8px;
    font-weight: bold;
    color: #ff7e00;
}
 .fx-service .fx-name {
    float: left;
    margin-right: 32px;
    color: #666;
    font-size: 15px;
}
 .fx-tips {
    width: 1290px;
    margin: 70px auto 0;
    height: 210px;
}
 .fx-tips li {
    float: left;
    position: relative;
    top: 0;
    width: 180px;
    height: 188px;
    overflow: hidden;
    margin-right: 42px;
    padding-top: 22px;
    border-radius: 10px;
    background: #f0f0f0;
    text-align: center;
    cursor: pointer;
}
.ui-cs3 {
    -webkit-transition: all ease .3s;
    -moz-transition: all ease .3s;
    -ms-transition: all ease .3s;
    -o-transition: all ease .3s;
    transition: all ease .3s;
}
.fx-tips li .fx-pic {
    width: 130px;
    height: 100px;
    padding-top: 10px;
    margin: 0 auto;
    background: url(https://img.alicdn.com/imgextra/i1/351004206/O1CN01aSh0vS1gwObDP8bys_!!351004206.png) no-repeat center top;
}
.fx-tips li .fx-pic .fx-img {
    height: 60px;
    text-align: center;
    overflow: hidden;
}
.fx-tips li .fx-pic .fx-img img {
    height: 100%;
}
 .fx-tips li .fx-pic .fx-t {
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    font-size: 18px;
    font-weight: bold;
    color: #1c3575;
}
.fx-tips li .fx-d {
    margin-top: 12px;
    height: 60px;
    line-height: 10px;
    overflow: hidden;
    padding: 0 16px;
    font-size: 12px;
    color: #666;
}
.ui-n5 {
    margin-right: 0 !important;
}
.fx-zhiliang { width:1400px;}

.whyc {background: url(/skin/images/ys-pic1.jpg) no-repeat;padding-bottom:0 !important;}
.whya {background-color: #FFFFFF;width: 300px;padding: 30px}
.whya li {margin-bottom: 12px;font-size: 16px;}
.whya li span {font-size: 12px;}
.why_a {font-weight: 600;font-size: 36px !important; color: #044697}
.whya strong {font-size: 22px; color: #044697}
.why_wen ul li:nth-child(1) {width: 18%;font-weight: 600;}
.why_wen ul li:nth-child(2) {width: 18%;font-weight: 600;}
.why_wen ul li:nth-child(3) {width: 31%;margin-right: 1%}
.why_wen ul li:nth-child(4) {width: 31%}
.why_wen ul li {float: left;height: 120px;width: 25%; padding-top: 30px;}
.why_wen ul li span {font-size: 36px;font-weight: 600; color: #044697}
.why_wen ul li img {float: left;margin-right: 10px;}
.why_wen ul li strong { font-size: 18px;}
.why_wen ul li strong span {font-size: 30px;color: #044697}
.whywen {padding: 0 !important;margin: 0 !important;background: #F1F1F1}

.design-roll li{position:relative;float:left;height:240px;overflow:hidden;text-align:center;margin-right:10px;cursor:pointer}
 .design-roll li .fx-img{display:block;height:100%;background:#f7f7f7}
 .design-roll li .fx-img img{height:100%}
 .design-roll li .fx-mag{position:absolute;left:0;width:100%;height:40px;background:#000;opacity:.4;filter:alpha(opacity=40)}
 .design-roll li .fx-title{position:absolute;left:0;width:100%;height:40px;line-height:40px;overflow:hidden;font-size:17px;color:#fff;}


.gybj{height:35.8rem; background: url(http://wk.colorfulcat.cn/skin/images/gybj.jpg) no-repeat;background-size: cover; overflow: hidden;}
.gy{padding:3rem 13% 0;}
.gy h2{text-align: center;height: 10rem;}
.gy h2 span{display: block; height:3rem; line-height: 3rem; font-size: 2rem; color:#212121; font-weight: normal;}
.gy h2 em{display: block; height:2rem; line-height: 2rem; font-size: 1rem; color:#000000;font-weight: normal;letter-spacing: 1px;}

.gy ul li{float:left;width:13.1%;margin:0 0.7%; transition: .5s;position: relative; overflow: hidden;}
.gy ul li .default{width: 100%; transition: .5s;position: relative;}
.gy ul li .default img{width:100%;display: block;}
.gy ul li .default span{left:0;top:0;width:100%; position: absolute; height:5rem; line-height: 5rem; text-align: center;font-size: 1rem; color:#FFFFFF;}


.gy ul li.cur{width:40.1%;top:-3.6rem;position: relative;}
.gy ul li.cur .default{opacity:0;}

.gy ul li dl{width:0; overflow: hidden;position: absolute; left:0;top:0;}
.gy ul li dl dt{width:100%; line-height: 0;}
.gy ul li dl dt img{display:block;width: 100%;}

.gy ul li dl dd{height:5.41666666rem; background:#DA251C;padding:0.8rem 8% 0 1.5rem; box-sizing: border-box;position:absolute;left:0;bottom:0; }
.gy ul li dl dd h4{height:1.8rem; line-height: 1.8rem;font-size: 1rem; color:#FFFFFF; font-weight: bold;margin-bottom: 3px;}
.gy ul li dl dd p{line-height: 1rem;height:2rem;font-size: 0.8rem; color:#FFFFFF;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
.gy ul li.cur dl{width:100%;}




/**/
.ysbj{height:1120px;}
.ys{padding-top:69px;}
.ys h2{text-align: center; margin-bottom: 29px;}
.ys h2 span{display: block; height:68px; line-height: 68px;font-size: 48px; color:#212121; font-weight: normal;}
.ys h2 em{display: block; height:42px; line-height: 42px; font-size: 22px; color:#000000; font-weight: normal;letter-spacing: 1px;}
.ys .ys-qh{height:912px; position: relative;}
.ys .ys-qh .ys-box,.ys .ys-qh .ys-box .con{width:100% !important;}
.ys .ys-qh .ys-desc i{display: block;height:750px;}
.ys .ys-qh .ys-desc .ys-pic1{background:url(http://wk.colorfulcat.cn/skin/images/ys-pic1.jpg) no-repeat center top;}
.ys .ys-qh .ys-desc .ys-pic2{background:url(http://wk.colorfulcat.cn/skin/images/ys-pic2.jpg) no-repeat center top;}
.ys .ys-qh .ys-desc .ys-pic3{background:url(http://wk.colorfulcat.cn/skin/images/ys-pic3.jpg) no-repeat center top;}
.ys .ys-qh .ys-desc .ys-pic4{background:url(http://wk.colorfulcat.cn/skin/images/ys-pic4.jpg) no-repeat center top;}
.ys .ys-qh .ys-desc dl{width:1200px; height:162px; margin:0 auto;padding-top:32px; box-sizing: border-box;}
.ys .ys-qh .ys-desc dl dt{float:left;width:353px;}
.ys .ys-qh .ys-desc dl dt span{display: block; height:52px; line-height: 52px; font-size: 36px; color:#DA251C; font-weight: bold;}
.ys .ys-qh .ys-desc dl dt em{display: block; height:40px; line-height: 40px;font-size: 24px; color:#1A1A1A;}
.ys .ys-qh .ys-desc dl dd{float:left;width:846px;margin-top: 20px;padding:4px 0 0 60px;border-left:1px solid #d4d2d0;height:68px; box-sizing: border-box;}
.ys .ys-qh .ys-desc dl dd p{height:27px; line-height: 27px;font-size: 15px; color:rgba(25,25,31,0.9);}
.ys .ys-hd{height:230px; position: absolute;left:0;bottom:162px;width:100%;}
.ys .ys-hd ul li{float:left; width:292px; height:122px;background:rgba(26,26,26,0.8); margin-left: 10px;padding-top:35px; box-sizing: border-box;margin-top: 108px; transition: .5s; overflow: hidden;}
.ys .ys-hd ul li:first-child{margin-left: 0;}
.ys .ys-hd ul li span{display: block; height:39px; line-height: 39px;font-size: 24px; color:#FFFFFF; font-weight: bold;margin-left: 94px;}
.ys .ys-hd ul li p{display: block; height:21px; line-height: 21px;font-size: 9px; color:#FFFFFF; text-transform: uppercase; margin:0 0 28px 94px;}
.ys .ys-hd ul li i{display: block; width:272px; height:110px; margin:0 auto;}
.ys .ys-hd ul li i img{width: 272px; height:110px;}
.ys .ys-hd ul li.cur{height:230px; background:#DA251C;padding-top:26px;margin-top: 0;}
.ys .ys-hd ul li.cur span{display: inline-block; padding-left:37px; margin-left: 79px;}
.ys .ys-hd ul li.cur .ys-ico1{background:url(http://wk.colorfulcat.cn/skin/images/ys-ico1.png) no-repeat left;}
.ys .ys-hd ul li.cur .ys-ico2{background:url(http://wk.colorfulcat.cn/skin/images/ys-ico2.png) no-repeat left;}
.ys .ys-hd ul li.cur .ys-ico3{background:url(http://wk.colorfulcat.cn/skin/images/ys-ico3.png) no-repeat left;}
.ys .ys-hd ul li.cur .ys-ico4{background:url(http://wk.colorfulcat.cn/skin/images/ys-ico4.png) no-repeat left;}
.ys .ys-hd ul li.cur p{margin-bottom: 22px; margin-left: 79px;}
/**/


/*时间轴*/
.timeline {
  list-style: none;
  position: relative;
  max-width: 1200px;
  padding: 20px;
  margin: 0 auto;
  overflow: hidden; }
  .timeline:after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -2px;
    background-color: rgba(0, 0, 0, 0.2);
    height: 100%;
    width: 4px;
    border-radius: 2px;
    display: block; }
  .timeline .timeline-row {
    padding-left: 50%;
    position: relative;
    z-index: 10; }
    .timeline .timeline-row .timeline-time {
      position: absolute;
      right: 50%;
      top: 31px;
      text-align: right;
      margin-right: 40px;
      font-size: 16px;
      line-height: 1.3;
      font-weight: 600; }
      .timeline .timeline-row .timeline-time small {
        display: block;
        color: white;
        text-transform: uppercase;
        opacity: 0.75;
        font-size: 11px;
        font-weight: 400; }
    .timeline .timeline-row .timeline-icon {
      position: absolute;
      top: 30px;
      left: 50%;
      margin-left: -20px;
      width: 25px;
      height: 25px;
      border-radius: 50%;
      background-color: white;
      text-align: center;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
      overflow: hidden;
      padding: 3px;
      color: white;
      font-size: 14px;
      z-index: 100; }
      .timeline .timeline-row .timeline-icon > div {
        border-radius: 50%;
        line-height: 34px;
        font-size: 16px; }
    .timeline .timeline-row .timeline-content {
      margin-left: 40px;
      position: relative;
      background-color: white;
      color: #333333; }
      .timeline .timeline-row .timeline-content:after {
        content: "";
        position: absolute;
        top: 48px;
        left: -41px;
        height: 4px;
        width: 40px;
        background-color: rgba(0, 0, 0, 0.2);
        z-index: -1; }
      .timeline .timeline-row .timeline-content .panel-body {
        padding: 15px 15px 2px;
        position: relative;
        z-index: 10; }
      .timeline .timeline-row .timeline-content h2 {
        font-size: 22px;
        margin-bottom: 12px;
        margin-top: 0;
        line-height: 1.2; }
      .timeline .timeline-row .timeline-content p {
        margin-bottom: 15px; }
      .timeline .timeline-row .timeline-content img {
        margin-bottom: 15px; }
      .timeline .timeline-row .timeline-content blockquote {
        border-color: #eeeeee; }
        .timeline .timeline-row .timeline-content blockquote footer, .timeline .timeline-row .timeline-content blockquote small, .timeline .timeline-row .timeline-content blockquote .small, .timeline .timeline-row .timeline-content blockquote.blockquote-reverse footer, .timeline .timeline-row .timeline-content blockquote.blockquote-reverse small, .timeline .timeline-row .timeline-content blockquote.blockquote-reverse .small {
          color: #999999; }
      .timeline .timeline-row .timeline-content .video-container {
        position: relative;
        padding-bottom: 56.25%;
        padding-top: 30px;
        height: 0;
        margin-bottom: 15px;
        overflow: hidden; }
        .timeline .timeline-row .timeline-content .video-container iframe, .timeline .timeline-row .timeline-content .video-container object, .timeline .timeline-row .timeline-content .video-container embed {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%; }
    .timeline .timeline-row:nth-child(odd) {
      padding-left: 0;
      padding-right: 50%; }
      .timeline .timeline-row:nth-child(odd) .timeline-time {
        right: auto;
        left: 50%;
        text-align: left;
        margin-right: 0;
        margin-left: 40px; }
      .timeline .timeline-row:nth-child(odd) .timeline-content {
        margin-right: 40px;
        margin-left: 0; }
        .timeline .timeline-row:nth-child(odd) .timeline-content:after {
          left: auto;
          right: -41px; }
  .timeline.animated .timeline-row .timeline-content {
    opacity: 0;
    left: 20px;
    -webkit-transition: all 0.8s;
    -moz-transition: all 0.8s;
    transition: all 0.8s; }
  .timeline.animated .timeline-row:nth-child(odd) .timeline-content {
    left: -20px; }
  .timeline.animated .timeline-row.active .timeline-content {
    opacity: 1;
    left: 0; }
  .timeline.animated .timeline-row.active:nth-child(odd) .timeline-content {
    left: 0; }

@media (max-width: 1200px) {
  .timeline {
    padding: 15px 10px; }
    .timeline:after {
      left: 28px; }
    .timeline .timeline-row {
      padding-left: 0;
      margin-bottom: 16px; }
      .timeline .timeline-row .timeline-time {
        position: relative;
        right: auto;
        top: 0;
        text-align: left;
        margin: 0 0 6px 56px; }
        .timeline .timeline-row .timeline-time strong {
          display: inline-block;
          margin-right: 10px; }
      .timeline .timeline-row .timeline-icon {
        top: 52px;
        left: -2px;
        margin-left: 0; }
      .timeline .timeline-row .timeline-content {
        margin-left: 56px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
        position: relative; }
        .timeline .timeline-row .timeline-content:after {
          right: auto !important;
          left: -20px !important;
          top: 32px; }
      .timeline .timeline-row:nth-child(odd) {
        padding-right: 0; }
        .timeline .timeline-row:nth-child(odd) .timeline-time {
          position: relative;
          right: auto;
          left: auto;
          top: 0;
          text-align: left;
          margin: 0 0 6px 56px; }
        .timeline .timeline-row:nth-child(odd) .timeline-content {
          margin-right: 0;
          margin-left: 55px; }
    .timeline.animated .timeline-row:nth-child(odd) .timeline-content {
      left: 20px; }
    .timeline.animated .timeline-row.active:nth-child(odd) .timeline-content {
      left: 0; } }

.in-news-menu li.active a {
    border-color: #c8a064;
    color: #fff;
    /*background-color: #c8a064;*/
	background: url(/skin/images/timeb.png) no-repeat;
}
.in-news-menu li a {
    display: block;
    border: none !important;;
    color: #fff;
    font-size: 16px;
    line-height: 48px;
    padding: 0 25px;
	background: url(/skin/images/timea.png) no-repeat;
}

/*新闻*/
.newstext li { float: left; width:50%;height: 233px; overflow: hidden}
.newsbg a { margin-top: 90px; color: #ccc;padding: 30px; max-width: 390px;}
.newsbg a:hover { color: #fff;padding-left: 50px}
