/*
* name: Grid System
* version: v1.0.0
* update: 使用max-device-width代替max-width
* date: 2014-06-30
*/
.row {
  width: 101.66666667%;
  transition: 0.2s width ease;
  *zoom: 1;
}
.row:before,
.row:after {
  display: table;
  clear: both;
  content: '';
}
.row > [class*="span-"] {
  float: left;
  margin-right: 1.66666667%;
  *margin-right: 1.55666667%;
  margin-bottom: 1.66666667%;
}
.row > .span-1 {
  width: 2.5%;
}
.row > .span-2 {
  width: 6.66666667%;
}
.row > .span-3 {
  width: 10.83333333%;
}
.row > .span-4 {
  width: 15%;
}
.row > .span-5 {
  width: 19.16666667%;
}
.row > .span-6 {
  width: 23.33333333%;
}
.row > .span-7 {
  width: 27.5%;
}
.row > .span-8 {
  width: 31.66666667%;
}
.row > .span-9 {
  width: 35.83333333%;
}
.row > .span-10 {
  width: 40%;
}
.row > .span-11 {
  width: 44.16666667%;
}
.row > .span-12 {
  width: 48.33333333%;
}
.row > .span-13 {
  width: 52.5%;
}
.row > .span-14 {
  width: 56.66666667%;
}
.row > .span-15 {
  width: 60.83333333%;
}
.row > .span-16 {
  width: 65%;
}
.row > .span-17 {
  width: 69.16666667%;
}
.row > .span-18 {
  width: 73.33333333%;
}
.row > .span-19 {
  width: 77.5%;
}
.row > .span-20 {
  width: 81.66666667%;
}
.row > .span-21 {
  width: 85.83333333%;
}
.row > .span-22 {
  width: 90%;
}
.row > .span-23 {
  width: 94.16666667%;
}
.row > .span-24 {
  width: 98.33333333%;
}
/*
* 无间距模式
*/
.full-row {
  width: 100%;
  transition: 0.2s width ease;
  *zoom: 1;
}
.full-row:before,
.full-row:after {
  display: table;
  clear: both;
  content: '';
}
.full-row > [class*='span'] {
  float: left;
}
.full-row > .span-1 {
  width: 4.16666667%;
  *width: 4.05666667%;
}
.full-row > .span-2 {
  width: 8.33333333%;
  *width: 8.22333333%;
}
.full-row > .span-3 {
  width: 12.5%;
  *width: 12.39%;
}
.full-row > .span-4 {
  width: 16.66666667%;
  *width: 16.55666667%;
}
.full-row > .span-5 {
  width: 20.83333333%;
  *width: 20.72333333%;
}
.full-row > .span-6 {
  width: 24.0%;
  *width: 24.0%;
}
.full-row > .span-7 {
  width: 29.16666667%;
  *width: 29.05666667%;
}
.full-row > .span-8 {
  width: 19.70%;
  *width: 25%;
}
.full-row > .span-9 {
  width: 37.5%;
  *width: 37.39%;
}
.full-row > .span-10 {
  width: 41.66666667%;
  *width: 41.55666667%;
}
.full-row > .span-11 {
  width: 45.83333333%;
  *width: 45.72333333%;
}
.full-row > .span-12 {
  width: 50%;
  *width: 49.89%;
}
.full-row > .span-13 {
  width: 54.16666667%;
  *width: 54.05666667%;
}
.full-row > .span-14 {
  width: 58.33333333%;
  *width: 58.22333333%;
}
.full-row > .span-15 {
  width: 62.5%;
  *width: 62.39%;
}
.full-row > .span-16 {
  width: 66.66666667%;
  *width: 66.55666667%;
}
.full-row > .span-17 {
  width: 70.83333333%;
  *width: 70.72333333%;
}
.full-row > .span-18 {
  width: 75%;
  *width: 74.89%;
}
.full-row > .span-19 {
  width: 79.16666667%;
  *width: 79.05666667%;
}
.full-row > .span-20 {
  width: 83.33333333%;
  *width: 83.22333333%;
}
.full-row > .span-21 {
  width: 87.5%;
  *width: 87.39%;
}
.full-row > .span-22 {
  width: 91.66666667%;
  *width: 91.55666667%;
}
.full-row > .span-23 {
  width: 95.83333333%;
  *width: 95.72333333%;
}
.full-row > .span-24 {
  width: 100%;
  *width: 99.89%;
}
/*
* 工具
*/
.row > .pull-right,
.full-row > .pull-right {
  float: right;
}
.row > .center {
  position: relative;
  left: -0.83333333%;
  display: block;
  float: none;
  clear: both;
  margin-right: auto;
  margin-left: auto;
}
.full-row > .center {
  display: block;
  float: none;
  clear: both;
  margin-right: auto;
  margin-left: auto;
}
.pull-left-1 {
  position: relative;
  left: -4.16666667%;
}
.pull-left-2 {
  position: relative;
  left: -8.33333333%;
}
.pull-left-3 {
  position: relative;
  left: -12.5%;
}
.pull-left-4 {
  position: relative;
  left: -16.66666667%;
}
.pull-left-5 {
  position: relative;
  left: -20.83333333%;
}
.pull-left-6 {
  position: relative;
  left: -25%;
}
.pull-left-7 {
  position: relative;
  left: -29.16666667%;
}
.pull-left-8 {
  position: relative;
  left: -33.33333333%;
}
.pull-left-9 {
  position: relative;
  left: -37.5%;
}
.pull-left-10 {
  position: relative;
  left: -41.66666667%;
}
.pull-left-11 {
  position: relative;
  left: -45.83333333%;
}
.pull-left-12 {
  position: relative;
  left: -50%;
}
.pull-left-13 {
  position: relative;
  left: -54.16666667%;
}
.pull-left-14 {
  position: relative;
  left: -58.33333333%;
}
.pull-left-15 {
  position: relative;
  left: -62.5%;
}
.pull-left-16 {
  position: relative;
  left: -66.66666667%;
}
.pull-left-17 {
  position: relative;
  left: -70.83333333%;
}
.pull-left-18 {
  position: relative;
  left: -75%;
}
.pull-left-19 {
  position: relative;
  left: -79.16666667%;
}
.pull-left-20 {
  position: relative;
  left: -83.33333333%;
}
.pull-left-21 {
  position: relative;
  left: -87.5%;
}
.pull-left-22 {
  position: relative;
  left: -91.66666667%;
}
.pull-left-23 {
  position: relative;
  left: -95.83333333%;
}
.pull-left-24 {
  position: relative;
  left: -100%;
}
.pull-right-1 {
  position: relative;
  left: 4.16666667%;
}
.pull-right-2 {
  position: relative;
  left: 8.33333333%;
}
.pull-right-3 {
  position: relative;
  left: 12.5%;
}
.pull-right-4 {
  position: relative;
  left: 16.66666667%;
}
.pull-right-5 {
  position: relative;
  left: 20.83333333%;
}
.pull-right-6 {
  position: relative;
  left: 25%;
}
.pull-right-7 {
  position: relative;
  left: 29.16666667%;
}
.pull-right-8 {
  position: relative;
  left: 33.33333333%;
}
.pull-right-9 {
  position: relative;
  left: 37.5%;
}
.pull-right-10 {
  position: relative;
  left: 41.66666667%;
}
.pull-right-11 {
  position: relative;
  left: 45.83333333%;
}
.pull-right-12 {
  position: relative;
  left: 50%;
}
.pull-right-13 {
  position: relative;
  left: 54.16666667%;
}
.pull-right-14 {
  position: relative;
  left: 58.33333333%;
}
.pull-right-15 {
  position: relative;
  left: 62.5%;
}
.pull-right-16 {
  position: relative;
  left: 66.66666667%;
}
.pull-right-17 {
  position: relative;
  left: 70.83333333%;
}
.pull-right-18 {
  position: relative;
  left: 75%;
}
.pull-right-19 {
  position: relative;
  left: 79.16666667%;
}
.pull-right-20 {
  position: relative;
  left: 83.33333333%;
}
.pull-right-21 {
  position: relative;
  left: 87.5%;
}
.pull-right-22 {
  position: relative;
  left: 91.66666667%;
}
.pull-right-23 {
  position: relative;
  left: 95.83333333%;
}
.pull-right-24 {
  position: relative;
  left: 100%;
}
@media only screen and (max-width: 1240px) {
  /*
* 中屏
*/
  .row > .midd-1 {
    width: 2.5%;
  }
  .row > .midd-2 {
    width: 6.66666667%;
  }
  .row > .midd-3 {
    width: 10.83333333%;
  }
  .row > .midd-4 {
    width: 15%;
  }
  .row > .midd-5 {
    width: 19.16666667%;
  }
  .row > .midd-6 {
    width: 23.33333333%;
  }
  .row > .midd-7 {
    width: 27.5%;
  }
  .row > .midd-8 {
    width: 31.66666667%;
  }
  .row > .midd-9 {
    width: 35.83333333%;
  }
  .row > .midd-10 {
    width: 40%;
  }
  .row > .midd-11 {
    width: 44.16666667%;
  }
  .row > .midd-12 {
    width: 48.33333333%;
  }
  .row > .midd-13 {
    width: 52.5%;
  }
  .row > .midd-14 {
    width: 56.66666667%;
  }
  .row > .midd-15 {
    width: 60.83333333%;
  }
  .row > .midd-16 {
    width: 65%;
  }
  .row > .midd-17 {
    width: 69.16666667%;
  }
  .row > .midd-18 {
    width: 73.33333333%;
  }
  .row > .midd-19 {
    width: 77.5%;
  }
  .row > .midd-20 {
    width: 81.66666667%;
  }
  .row > .midd-21 {
    width: 85.83333333%;
  }
  .row > .midd-22 {
    width: 90%;
  }
  .row > .midd-23 {
    width: 94.16666667%;
  }
  .row > .midd-24 {
    width: 98.33333333%;
  }
  /*
* 工具
*/
  .midd-hide {
    display: none;
  }
  .midd-center {
    position: relative;
    left: -0.83333333%;
    display: block;
    float: none;
    clear: both;
    margin-right: auto;
    margin-left: auto;
  }
  /*
* 无间距模式
*/
  .full-row > .midd-1 {
    width: 4.16666667%;
  }
  .full-row > .midd-2 {
    width: 8.33333333%;
  }
  .full-row > .midd-3 {
    width: 12.5%;
  }
  .full-row > .midd-4 {
    width: 16.66666667%;
  }
  .full-row > .midd-5 {
    width: 20.83333333%;
  }
  .full-row > .midd-6 {
    width: 25%;
  }
  .full-row > .midd-7 {
    width: 29.16666667%;
  }
  .full-row > .midd-8 {
    width: 33.33333333%;
  }
  .full-row > .midd-9 {
    width: 37.5%;
  }
  .full-row > .midd-10 {
    width: 41.66666667%;
  }
  .full-row > .midd-11 {
    width: 45.83333333%;
  }
  .full-row > .midd-12 {
    width: 50%;
  }
  .full-row > .midd-13 {
    width: 54.16666667%;
  }
  .full-row > .midd-14 {
    width: 58.33333333%;
  }
  .full-row > .midd-15 {
    width: 62.5%;
  }
  .full-row > .midd-16 {
    width: 66.66666667%;
  }
  .full-row > .midd-17 {
    width: 70.83333333%;
  }
  .full-row > .midd-18 {
    width: 75%;
  }
  .full-row > .midd-19 {
    width: 79.16666667%;
  }
  .full-row > .midd-20 {
    width: 83.33333333%;
  }
  .full-row > .midd-21 {
    width: 87.5%;
  }
  .full-row > .midd-22 {
    width: 91.66666667%;
  }
  .full-row > .midd-23 {
    width: 95.83333333%;
  }
  .full-row > .midd-24 {
    width: 100%;
  }
}
@media only screen and (max-width: 760px) {
  /*
* 小屏栅格
*/
  .row > .smal-1 {
    width: 2.5%;
  }
  .row > .smal-2 {
    width: 6.66666667%;
  }
  .row > .smal-3 {
    width: 10.83333333%;
  }
  .row > .smal-4 {
    width: 15%;
  }
  .row > .smal-5 {
    width: 19.16666667%;
  }
  .row > .smal-6 {
    width: 23.33333333%;
  }
  .row > .smal-7 {
    width: 27.5%;
  }
  .row > .smal-8 {
    width: 31.66666667%;
  }
  .row > .smal-9 {
    width: 35.83333333%;
  }
  .row > .smal-10 {
    width: 40%;
  }
  .row > .smal-11 {
    width: 44.16666667%;
  }
  .row > .smal-12 {
    width: 48.33333333%;
  }
  .row > .smal-13 {
    width: 52.5%;
  }
  .row > .smal-14 {
    width: 56.66666667%;
  }
  .row > .smal-15 {
    width: 60.83333333%;
  }
  .row > .smal-16 {
    width: 65%;
  }
  .row > .smal-17 {
    width: 69.16666667%;
  }
  .row > .smal-18 {
    width: 73.33333333%;
  }
  .row > .smal-19 {
    width: 77.5%;
  }
  .row > .smal-20 {
    width: 81.66666667%;
  }
  .row > .smal-21 {
    width: 85.83333333%;
  }
  .row > .smal-22 {
    width: 90%;
  }
  .row > .smal-23 {
    width: 94.16666667%;
  }
  .row > .smal-24 {
    width: 98.33333333%;
  }
  /*
* 工具
*/
  .smal-hide {
    display: none;
  }
  .smal-show {
    display: block;
  }
  .smal-center {
    position: relative;
    left: -0.83333333%;
    display: block;
    float: none;
    clear: both;
    margin-right: auto;
    margin-left: auto;
  }
  /*
* 清除位移
*/
  [class*='pull-left-'],
  [class*='pull-right-'] {
    right: auto;
    left: auto;
  }
  /*
* 无间距模式
*/
  .full-row > .smal-1 {
    width: 4.16666667%;
  }
  .full-row > .smal-2 {
    width: 8.33333333%;
  }
  .full-row > .smal-3 {
    width: 12.5%;
  }
  .full-row > .smal-4 {
    width: 16.66666667%;
  }
  .full-row > .smal-5 {
    width: 20.83333333%;
  }
  .full-row > .smal-6 {
    width: 25%;
  }
  .full-row > .smal-7 {
    width: 29.16666667%;
  }
  .full-row > .smal-8 {
    width: 33.33333333%;
  }
  .full-row > .smal-9 {
    width: 37.5%;
  }
  .full-row > .smal-10 {
    width: 41.66666667%;
  }
  .full-row > .smal-11 {
    width: 45.83333333%;
  }
  .full-row > .smal-12 {
    width: 50%;
  }
  .full-row > .smal-13 {
    width: 54.16666667%;
  }
  .full-row > .smal-14 {
    width: 58.33333333%;
  }
  .full-row > .smal-15 {
    width: 62.5%;
  }
  .full-row > .smal-16 {
    width: 66.66666667%;
  }
  .full-row > .smal-17 {
    width: 70.83333333%;
  }
  .full-row > .smal-18 {
    width: 75%;
  }
  .full-row > .smal-19 {
    width: 79.16666667%;
  }
  .full-row > .smal-20 {
    width: 83.33333333%;
  }
  .full-row > .smal-21 {
    width: 87.5%;
  }
  .full-row > .smal-22 {
    width: 91.66666667%;
  }
  .full-row > .smal-23 {
    width: 95.83333333%;
  }
  .full-row > .smal-24 {
    width: 100%;
  }
}