/* Qianglong Mo (SukeBeta) 2015 */

@import "base";

/*======================================================================
      Index
  ======================================================================*/
/* common title */
.row-title {
  .more {
    margin: 7px 22px 0 0;
    padding: 0 24px 0 0;
    .fs18;
    .c_light;
    text-decoration: none;
    background: url("../images/more-arrow.png") no-repeat right center;
  }

  .more:hover {
    color: #2694bb;
    background: url("../images/more-arrow-active.png") no-repeat right center;
  }

  .tt {
    .fs30;
    .fb;
    .c_heavy;
  }
}

/* hot project */
.hot-project {
  margin: 43px 0 0 0;
}

.hot-project-bd {
  overflow: hidden;
}

/* chuangke activity */
.chuangke-activity {
  margin-top: 75px;
  min-height: 782px;
  padding: 24px 0 0 0;
  border-top: 1px solid #d9d9de;
  border-bottom: 1px solid #d9d9de;
  background: #fff;
}

.chuangke-activity-bd {
  position: relative;
  margin-top: 27px;

  .item {
    position: absolute;
    width: 610px;
    height: 389px;

    img {
      display: block;
      width: 100%;
    }
  }

  .item.active{
    width: 610px;
    height: 389px;
    z-index: 2;
    opacity: 1;

    .txt {
      opacity: 1;
    }
  }

  .item:hover {
    box-shadow: 0 0 10px #333;
  }

  .txt {
    opacity: 0;
    padding: 30px 35px;
    color: #fff;
    background: rgba(29, 146, 205, .8);
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;

    dt {
      font-size: 32px;
      margin-bottom: 10px;
    }

    dd {
      .fs18;
      line-height: 34px;
    }
  }

  .item01 {
    top: 10px;
    left: 293px;
  }

  .item02 {
    top: 200px;
    left: 0;
    width: 313px;
    height: 180px;
  }

  .item03 {
    top: 200px;
    left: 890px;
    width: 313px;
    height: 180px;
  }

  .item03.active {
    left: 600px;
  }

  .item04 {
    top: 399px;
    left: 293px;
    width: 386px;
    height: 246px;
  }

  .item04.active {
    top: 310px;
    left: 280px;
  }

  .item05 {
    top: 399px;
    left: 679px;
    width: 314px;
    height: 180px;
  }

  .item05.active {
    top: 310px;
    left: 650px;
  }
}

/* chuangke point */
.indexTwoColumn {
  padding: 43px 0 73px 0;
}

.chuangke-point {
  width: 480px;
}

.chuangke-point-bd {
  margin-top: 42px;

  li {
    padding: 13px 0 28px 0;
    background: url("../images/chuangke-point-line.png") repeat-x 0 bottom;

    small {
      display: block;
      line-height: 33px;
      .c_light;
    }
    a {
      font-size: 18px;
      .c_normal;
    }
    a:hover {
      color: #2694bb;
    }
  }
}

/* recommend components */
.recommend-components {
  width: 570px;
  margin-right: 48px;
}

.recommend-components-bd {
  position: relative;
  margin-top: 43px;
  background: url("../images/recommend-components-split.png") no-repeat center 2px;

  .itemWrap {
    overflow: hidden;
    width: 570px;

    ul {
      width: 1000%;
    }

    li {
      display: none;
      width: 570px;
      height: 330px;

      .transition(.2s);
    }

    li.active {
      display: block;
    }
  }

  .item {
    width: 260px;
  }

  .thumb {
    display: block;
    border: 1px solid #d9d9de;

    img {
      vertical-align: top;
    }
  }

  dl {
    margin-top: 3px;
  }

  dt {
    padding: 16px 0;

    a {
      .fs18;
      .fb;
      .c_normal;
    }

    a:hover {
      color: #2694bb;
    }
  }

  dd {
    .fs14;
    line-height: 22px;
    .c_normal;
  }

  .count {
    .fs12;
    .c_light;
    margin-top: 18px;
  }

  .prev {
    position: absolute;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: normal;
    color: #fff;
    font-family: 'Open Sans', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', STHeiti, 'WenQuanYi Micro Hei', SimSun, sans-serif;
    background: #1aa9eb;
    border-radius: 24px;
    top: 82px;
    left: -46px;
    cursor: pointer;
    .enableSelect;
  }

  .next {
    position: absolute;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: normal;
    color: #fff;
    font-family: 'Open Sans', Arial, 'Hiragino Sans GB', 'Microsoft YaHei', STHeiti, 'WenQuanYi Micro Hei', SimSun, sans-serif;
    background: #1aa9eb;
    border-radius: 24px;
    top: 82px;
    right: -46px;
    cursor: pointer;
    .enableSelect;
  }

  .enable {
    background: gray;
  }
}

/*======================================================================
      Responsive
  ======================================================================*/

@media screen and (max-width: 1215px){

}