.w1350{padding: 0 12%;margin:0 auto}


@keyframes scroll {
  0% { opacity: 0; }
  10% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); opacity: 1; }
  100% { -webkit-transform: translateY(5px); -moz-transform: translateY(5px); -o-transform: translateY(0); transform: translateY(5px); opacity: 0;}
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -50%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInDown {
  animation-name: fadeInDown;
}

#s_fangan{overflow:hidden;height: 7.8125rem;position: absolute;z-index: 97;width: 100%; bottom:4rem}
#s_fangan .content01{ background:#fff;}
#s_fangan .tt{width: 17.8125rem;float:left;background:linear-gradient(to left,rgb(4, 74, 192) 0,rgb(0, 176, 251));color:#fff;height: 7.8125rem;font-size: 1.25rem;text-align:center;line-height: 7.8125rem; position:relative}
#s_fangan .tt:before{content:"";position:absolute;top:0;right:0;border-top:#fff 7.8125rem solid;border-left: transparent 3.75rem solid;border-right:transparent 0 solid;}
#s_fangan .tt span{ display:block; font-size:13px; margin-top:5px;}
#s_fangan ul{display:block;width: calc(100% - 17.8125rem);float:right;}
#s_fangan ul li{width:25%;height: 7.8125rem;float:left;position:relative;text-align:  center;}
#s_fangan ul li a{ display:block}
#s_fangan ul li+li:after{content:"";width:1px;display:block;background:#ececec;position:absolute;left:0;top:15px;bottom: 15px;}
#s_fangan ul li span{display: inline-block;height: 7.8125rem;width: 50px;}
#s_fangan ul li.li_1 span{ background:url(../images/s_fangan_ico1.png) center no-repeat;}
#s_fangan ul li.li_2 span{ background:url(../images/s_fangan_ico2.png) center no-repeat;}
#s_fangan ul li.li_3 span{ background:url(../images/s_fangan_ico3.png) center no-repeat;}
#s_fangan ul li.li_4 span{ background:url(../images/s_fangan_ico4.png) center no-repeat;}

#s_fangan ul li h5{font-size: 1.125rem;color:#424446;display:  inline-block;line-height: 7.8125rem;margin-left: 10px;vertical-align: top;}
#s_fangan ul li p{ font-size:12px; color:#898a8b;}
#s_fangan ul li:hover span{ -webkit-animation: jello 1s; -moz-animation: jello 1s; animation: jello 1s;}
@-webkit-keyframes jello {

    from, 11.1%, to { -webkit-transform: none; transform: none }
    22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg) }
    33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg) }
    44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg) }

    55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg) }



    66.6% { -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg) }
    77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg) }
    88.8% { -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg) }
}

@-moz-keyframes jello {
    from, 11.1%, to { -moz-transform: none; transform: none }
    22.2% { -moz-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg) }
    33.3% { -moz-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg) }
    44.4% { -moz-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg) }
    55.5% { -moz-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg) }
    66.6% { -moz-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg) }
    77.7% { -moz-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg) }
    88.8% { -moz-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg) }
}

@keyframes jello {
    from, 11.1%, to { -webkit-transform: none; -moz-transform: none; transform: none }
    22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); -moz-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg) }
    33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); -moz-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg) }
    44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); -moz-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg) }
    55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); -moz-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg) }
    66.6% { -webkit-transform: skewX(-.78125deg) skewY(-.78125deg); -moz-transform: skewX(-.78125deg) skewY(-.78125deg); transform: skewX(-.78125deg) skewY(-.78125deg) }
    77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); -moz-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg) }
    88.8% { -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg); -moz-transform: skewX(-.1953125deg) skewY(-.1953125deg); transform: skewX(-.1953125deg) skewY(-.1953125deg) }
}
@media (max-width: 1380px){.w1350 {
  padding: 0 15px;
}
#s_fangan ul li h5{ font-size:16px;}

}
@media (max-width: 1000px){
#s_fangan{ position:inherit;padding-top:5%;padding-bottom:5%;height:auto;}}

@media(max-width: 768px){
	
	 #s_fangan{position:relative;bottom: 0;padding: 2rem 0;height: auto;}
  
  #s_fangan .tt{width:100%;height: 40px;line-height: 40px;background: #fff;color: #333;font-size: 18px;font-weight: bold;}
  #s_fangan .tt:before{border-top:#fff 7.8125rem solid;display: none;}
  #s_fangan ul{width:100%;padding: 0.5rem 0;}
  #s_fangan ul li{ height:auto}
  #s_fangan ul li span{height:50px;transform: scale(0.7);margin-top: -1rem;margin-bottom: -0.5rem;}
  #s_fangan ul li h5{line-height:30px;margin: 0; font-size:14px;}
	}