#section1 {position:relative;}
#icon { width:100%; position:absolute; bottom:0; overflow:hidden; padding:0px 0 0px 0; font-size:18px; }
#icon ul {padding:0; width:1200px; margin:20px auto 0 auto; background:#fff; overflow:hidden; border-bottom:0px  solid #dfdfdf;
border-radius:50px 50px 0 0; box-shadow: -0px 0px 15px rgb(0,0,0,0.2);} 
#icon ul li {float:left;  width:25%; list-style-type:none; margin:25px 0; border-left:1px solid #ccc; }
#icon ul li:first-child {border-left:0;}
#icon ul li a{display:block; height:120px; text-align: center; padding-top:80px; box-sizing:border-box; font-weight:500; }
#icon ul li a:hover{background-position:center 15%; transition: all 0.2s;}
#icon ul li a {background-position:center 22%; background-repeat:no-repeat;  transition: all 0.2s;}
#icon ul li.ico1 a{ background-image:url("../img/ico1.png");}
#icon ul li.ico2 a{ background-image:url("../img/ico2.png"); }
#icon ul li.ico3 a{ background-image:url("../img/ico3.png");}
#icon ul li.ico4 a{ background-image:url("../img/ico4.png");}

/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1023px) {
#icon { width:100%; position:relative;  font-size:15px; }
#icon ul {padding:0; width:100%; margin:0px auto 0 auto; border-radius:0px 0px 0 0; box-shadow: none;} 
#icon ul li {float:left;  width:25%; list-style-type:none; margin:0; border-bottom:1px solid #ccc; }
#icon ul li a{display:block; height:100px; text-align: center; padding-top:60px;}
@media (max-width: 768px) {
}
@media (max-width: 640px) {
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {
}