﻿.wrap_main{
  position: relative;
background: #F5F5F5 url(/Sites/Uploaded/Image/2021/03/096375089472468852186273007.jpg)no-repeat;
}
.wrap_main .linkmap{
  background: transparent;
  position: absolute;
  top: 10px;
  left: 50%;
  margin:0;
  transform:translateX(-50%);
  font-size: 14px;
  color: #FFFFFF;
  padding-left: 0;
}
.wrap_main .linkmap a{
  color: #FFFFFF;
}
.wrap_main .linkmap span{
  color: #FFFFFF;
}
.banner {
  display: block;
}
ul.xx_ul li {
 width: 277px;
 height: 214px;
 background: #fff;
 box-shadow: 2px 3px 16px 6px hsl(0deg 7% 92% / 65%), 4px 6px 13px 0px rgb(199 199 199 / 29%);
 float: left;
 margin-right: 30px;
 margin-bottom: 30px;
}

ul.xx_ul li a {
 width: 100%;
 height: 100%;
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
}

ul.xx_ul li a h2 {
 font-size: 22px;
 font-weight: 500;
 color: #337353;
 margin-top: 20px;
}

ul.xx_ul li:nth-child(4n) {
 margin-right: 0;
}
ul.xx_ul li a:hover img {
 animation: tada 1s;
 -o-animation: tada 1s;
 -webkit-animation: tada 1s;
 -moz-animation: tada 1s;
}

ul.xx_ul li a:hover h2 {
 font-weight: bold;
}
@media only screen and (max-width: 768px){

   ul.xx_ul li {
 width: 48%;
 margin-right: 15px;
 margin-bottom: 15px;
 }
 
 ul.xx_ul li:nth-child(2n) {
 margin-right: 0;
 }
  
}
@media only screen and (max-width: 425px){

   ul.xx_ul li{width: 100%;}
}
@media only screen and (max-width: 320px){

 
  
} 