@import '../normalize.css';
@import '../index.css';
.sec-nav-title {
  font-size: .33rem;
}
.menu-main{
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
  display: -moz-box; /* Firefox 17- */
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
  display: -moz-flex; /* Firefox 18+ */
  display: -ms-flexbox; /* IE 10 */
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */   
}
.sec1-menu{            
  display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
  display: -moz-box; /* Firefox 17- */
  display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
  display: -moz-flex; /* Firefox 18+ */
  display: -ms-flexbox; /* IE 10 */
  display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */   
}
.sec-menu {
  margin: .3rem 0 .4rem;
}
.sec-menu .menu-item {
  padding: 0 .1rem;
  position: relative;
  display: inline-block;
}
*,:after,:before {
 -webkit-box-sizing:border-box;
 box-sizing:border-box;
}
.menu-main .sec-menu a:before {
 display:block;
 content:attr(title);
 height:1px;
 color:transparent;
 overflow:hidden;
 visibility:hidden;
 margin-top:-1px;
 font-weight:600
}
.menu-main div:not(:last-child):after {
 display:inline-block;
 content:'/';
 margin-left:.25em;
 margin-right:.3333em
}
.sec-menu:first-of-type a {
  padding-left: 0;
}

.img-list {
  width: 100%;
  display: grid;
  grid-template-columns: 30% 30% 30%;
  justify-content: space-between;
  align-content: flex-start;
}
.list-item {
  display: block;
  width: 100%;
  margin-bottom: 42px;
  cursor: pointer;
}
.list-item .img-item-box {
  width: 100%;
  height: auto;
  /* max-height: 375px; */
  overflow: hidden;
}
.list-item .img-item-box img {
  height: auto
}
.list-item .img-item-box video {
  width: 100%;
  height: 100%;
}
.list-item .img-item-box img:hover {
  opacity: .5;
}
.list-item .text-item-box {
  font-size: 16px;
}
.list-item .text-first-title {
  font-weight: bold;
  margin: 15px 0 12px;
}
.list-item .text-sec-title {
  font-weight: lighter;
}
.container {
  background: #e6e4dc;
  padding-bottom: 67px;
}
.product-description {
  width: 100%;
}
.product-des-content {
  width: 65%;
  font-size: 18px;
  color: #333;
  font-weight: normal;
  line-height: 1.5;
}
.product-des-part {
  margin-bottom: 40px;
}

/*lijie*/
.projects__grid {
 display:-webkit-box;
 display:-webkit-flex;
 display:-ms-flexbox;
 display:flex;
 -webkit-box-orient:horizontal;
 -webkit-box-direction:normal;
 -webkit-flex-direction:row;
 -ms-flex-direction:row;
 flex-direction:row;
 -webkit-flex-wrap:wrap;
 -ms-flex-wrap:wrap;
 flex-wrap:wrap;
 overflow:normal;
 padding:0;
 margin:0 -10px
}
.project__single {
 width:100%;
 padding:20px 10px 0;
 -webkit-box-flex:0;
 -webkit-flex:0 0 auto;
 -ms-flex:0 0 auto;
 flex:0 0 auto
}
.project__single-link {
 display:block
}
.project__single-link:hover .project__single-img-wrap {
 opacity:.6;
 background-color:#E8E8E8
}
.project__single-link:hover .project__single-details {
 opacity:.5
}
.project__single-img-wrap{
  width: 100%;

}
.project__single-img-wrap img{
  width: 100%;
  
}
.project__single-details {
 font-weight:300;
 margin-top:20px;
 /*font-size: .3rem;*/
 -webkit-transition:opacity 200ms;
 -o-transition:opacity 200ms;
 transition:opacity 200ms
}
.project__single-title {
 line-height:1.4em;
 margin: 10px 0px;
}
.projects__title {
 margin-bottom:20px
}
@media (min-width:540px) {
 .project__single {
  width:50%
 }
}
@media (min-width:980px) {
.projects__grid {
  margin:-20px;
  margin-top:-45px;
 }
.project__single {
  padding:50px 25px 0;
  width:33.33%
 }
 .project__single-title {
  font-size: 23px;
 }
  .project__single-location{
  font-size: 18px;
  }
}
/*@media (max-width:539px) {
 .project__single-title:after {
  content:',';
  margin-right:.3333em
 }
 .project__single-location,
 .project__single-title {
  display:inline-block
 }
}*/
/*lijie*/
@media only screen and (max-width: 980px) {
  .sec-menu {
  font-size: .31rem;
  }
  .sec-menu .menu-item {
    font-size: .31rem;
  }
    .img-list {
    display: block;
  }
  .list-item {
    width: 100%;
    margin-bottom: .42rem;
  }
  .list-item .text-first-title {
    margin: .15rem 0 .12rem;
  }
  .list-item .text-item-box {
    font-size: .18rem;
  }
  .container {
    padding-bottom: .8rem;
  }
  .product-des-part {
    margin-bottom: .4rem;
  }
  .product-des-content {
    width: 100%;
    font-size: .28rem;
  }
}
@media only screen and (min-width: 980px) {
  .sec-menu {
    margin: 30px 0 40px;
    font-size: 24px;
  }
  .sec-menu .menu-item {
    padding: 0 3px;
    font-size: 24px;
    color: #333;
  }
  .sec-nav-title {
    font-size: 32px;
  }
}