﻿@charset "utf-8";
.section{
  display: block;
  width: auto;
  height: auto;
  overflow: hidden;
  margin:auto;
  background-repeat: no-repeat;
  background-size: cover;
}
.tb{
  max-width: 86%;
  margin: auto;
  margin-top: 80px;
  margin-bottom: 80px;
}
@media (max-width:767px){
  .tb{
    max-width: unset;
    padding: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
.thead{
  text-align: center;
  line-height: 1.5;
}
.title{
  font-size: 2.8rem;
}
.miaoshu{
  font-size: 1.2rem;
  font-family: Arial, Helvetica, sans-serif;
}
@media (max-width:480px){
  .title{font-size: 2rem;}
}
.product_list{
  display: grid;
  grid-template-columns: calc(20% - 80px/5)  calc(20% - 80px/5) calc(20% - 80px/5) calc(20% - 80px/5) calc(20% - 80px/5);
  row-gap:20px;
  column-gap: 20px;
  width: auto;
  height: auto;
  margin-top: 60px;
}
@media (max-width:767px){
  .product_list{
    grid-template-columns: calc(50% - 10px/2)  calc(50% - 10px/2);
    row-gap:10px;
    column-gap: 10px;
  }
}
a.product_tb{
  display: block;
  width: auto;
  height: auto;
  overflow: hidden;
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;
}
.product_pic{
  display: block;
  width: auto;
  height: auto;
  overflow: hidden;
  padding-bottom: 100%;
  position: relative;
}
.product_name{
  margin-top: 10px;
}
.news_list{
  display: grid;
  grid-template-columns: calc(50% - 20px/2)  calc(50% - 20px/2);
  row-gap:20px;
  column-gap: 20px;
  width: auto;
  height: auto;
  margin-top: 60px;
}
@media (max-width:767px){
  .news_list{
    grid-template-columns: auto;
  }
}
.news_tb{
  display: block;
  width: auto;
  height: auto;
  overflow: hidden;
  border: 1px solid #ddd;
  padding: 20px;
}
a.news_name{
  font-size:1.4rem;
  white-space: nowrap;
}
.news_date{
  display: flex;
  display: -webkit-flex;
  column-gap: 10px;
  white-space:nowrap;
  width: auto;
  height: auto;
  align-items: center;
}
.news_miaoshu{
  display: -moz-box;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  width: auto;
  height: auto;
  overflow: hidden;
}
.apply_list{
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  width:auto;
  height: auto;
  overflow: hidden;
  margin: auto;
  margin-top:60px;
}
@media (max-width:767px){
  .apply_list{
    grid-template-columns:50% 50%;
  }
}
@media (max-width:480px){
  .apply_list{
    grid-template-columns:auto;
  }
}
.apply_item{
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  align-items: center;
  width:auto;
  height: auto;
  overflow: hidden;
  position: relative;
}
.apply_modal{
  background-color: rgba(0,0,0,0.6);
  display: block;
  width: auto;
  height: auto;
  position: absolute;
  left: 0px;
  right: 0px;
  top:0px;
  bottom: 0px;
  margin: auto;
  
}
.apply_tb{
  display: block;
  width: auto;
  height: auto;
  position: absolute;
  left: 0px;
  right: 0px;
  top:0px;
  bottom: 0px;
  margin: auto;
  padding: 10%;
  text-align: center;
}
.apply_pic{
  display: block;
  width: 100%;
  height: auto;
  margin: auto;
  overflow: hidden;
  filter: blur(2px);
  
  transition: all 0.4s;
}
.apply_item:hover>.apply_pic{
  filter: blur(0px);
}
.apply_item:hover>.apply_modal{
  background-color: rgba(0,0,0,0);
}
a.apply_name{
  font-size: 2rem;
  color: #fff;
}
.apply_miaoshu{
  font-size: 1rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  width:auto;
  height:auto;
  overflow: hidden;
  color: #fff;
}
.case_list{
  display: block;
  width: auto;
  height: auto;
  overflow: hidden;
  margin: auto;
  margin-top:60px;
}
.case_tb{
  display: inline-block;
  vertical-align: top;
  width:25%;
  margin-right:20px; 
  height: auto;
  overflow: hidden;
  text-align: center;
}
@media (max-width:480px){
  .case_tb{
    width:33.3%;
  }
}
.case_pic{
  display: block;
  width: auto;
  height: auto;
  overflow: hidden;
  background-size: cover;
  padding-bottom: 75%;
}
.about_content{
  display: block;
  width: auto;
  height: auto;
  overflow: hidden;
  margin-top: 60px;
}
.brand_list{
	display: grid;
  grid-template-columns: calc(20% - 80px/5) calc(20% - 80px/5) calc(20% - 80px/5) calc(20% - 80px/5) calc(20% - 80px/5);
  row-gap:20px;
  column-gap:20px;
  margin: auto;
  margin-top: 60px;
}
@media (max-width:767px){
  .brand_list{
    grid-template-columns: calc(25% - 30px/4) calc(25% - 30px/4) calc(25% - 30px/4) calc(25% - 30px/4);
    row-gap:10px;
    column-gap:10px;
  }
}
@media (max-width:480px){
  .brand_list{
    grid-template-columns: calc(33.3% - 20px/3) calc(33.3% - 20px/3) calc(33.3% - 20px/3) ;
    row-gap:10px;
    column-gap:10px;
  }
}
.brand_tb{
  width: auto;
  height: auto;
  background-color: #fff;
  overflow: hidden;
  
}
.brand_pic{
  position: relative;
  width: auto;
  height: auto;
  padding-bottom: 50%;
  border: 1px solid #ddd;
  display: block;
}