@charset "utf-8";
body {
  background-color: #f5f5f5;
}
.seat {
  background-color: #fff;
}
.banner {
  margin-bottom: 0;
}
.area {
  max-width: 1200px;
  min-width: 960px;
  padding: 0 15px;
  margin: 0 auto;
  overflow: hidden;
}
h2 {
  font-size: 24px;
  color: #0a63bf;
  padding: 6px 0 6px 16px;
  background: url("../images/h2line.png") no-repeat 0 center;
  margin-bottom: 40px;
}
.explain {
  width: 100%;
  padding: 60px 0;
  overflow: hidden;
}
.explain ul {
  width: 100%;
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
  overflow: hidden
}
.explain ul li {
  width: 32%;
  overflow: hidden
}
.explain dl {
  width: 100%;
  height: 218px;
  position: relative;
  font-size: 12px;
  line-height: 150%;
  box-shadow: 0 1px 0 0 rgba(0, 0, 0, .2);
  border-radius: 2px;
  overflow: hidden
}
.explain dt {
  padding-bottom: 15px
}
.explain dt a {
  display: block;
  width: 100%;
  height: 218px;
  position: relative;
  margin: 0 auto
}
.explain dt a img {
  max-width: 100%;
  max-height: 218px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0 auto
}
.explain dd a {
  display: block;
  width: 100%;
  height: 168px;
  padding: 20px 20px;
  color: #fff;
  position: absolute;
  left: 0;
  bottom: -168px;
  background-color: rgba(0, 0, 0, .6);
  -webkit-transition: all .9s;
  -moz-transition: all .9s;
  -o-transition: all .9s;
  transition: all .9s
}
.explain dd a h5 {
  font-size: 16px;
  padding: 20px 0 10px;
}
.explain dd a p {
  font-size: 12px;
  line-height: 150%;
}
.explain dl:hover dd a {
  bottom: 0
}
.explain dd a span {
  display: block;
  max-height: 48px;
  overflow: hidden
}
.advantage {
  width: 100%;
  overflow: hidden;
}
.advantage ul {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.advantage ul li {
  width: 48%;
  min-height: 240px;
  padding: 20px 0;
  margin-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  color: #333;
}
.advantage ul li span {
  width: 72px;
  height: 72px;
}
.advantage ul li h5 {
  font-size: 18px;
  padding: 20px 0 10px;
}
.advantage ul li p {
  font-size: 14px;
  line-height: 180%;
  text-indent: 2em;
  padding: 0 80px;
}
.magic {
  width: 100%;
  padding: 30px 0;
  margin: 20px 0 60px;
  background-color: #0a63bf;
  color: #fff;
  overflow: hidden;
}
.magic h5 {
  font-size: 18px;
  padding: 10px 0;
}
.magic p {
  font-size: 14px;
  line-height: 180%;
}
.service {
  width: 100%;
  overflow: hidden;
}
.service ul {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.service ul li{
  width: 48%;
  min-height: 500px;
  padding: 0 0 40px;
  margin-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  /*justify-content: space-between;*/
  color: #333;
}
.service ul li a.serimg{
	width: 100%;
	overflow: hidden;
}
.service ul li a.serimg img{
	width: 100%;
	transition:all 0.6s;
}
.service ul li a.serimg:hover img{
	transform:scale(1.5);
}
.service ul li a.sertxt{
	padding: 10px 20px 0 20px;
	color: #333;
}
.service ul li a.sertxt h5{
	font-size: 18px;
	padding: 10px 0;
}
.service ul li a.sertxt p{
	font-size: 14px;
	line-height: 180%;
}