body {

    font-size: 0.18rem;

    font-family: Arial, 'microsoft yahei', Helvetica, sans-serif;

    min-width: 320px;

    width: 100%;

    margin: 0px auto;

    padding: 0px;

    height: auto;

    /*box-shadow:0px 0px 20px #5D5C61;*/

    position: relative;

    height: 100%;

}



div,

dl,

dt,

dd,

ul,

ol,

li,

h1,

h2,

h3,

h4,

h5,

h6,

pre,

form,

fieldset,

input,

textarea,

p,

blockquote,

th,

td,

font {

    padding: 0px;

    margin: 0px;

}



* {

    margin: 0px;

    padding: 0px;

}



fieldset,

img {

    border: 0px none;

    vertical-align: bottom;

}



h1,

h2,

h3,

h4,

h5,

h6 {

    font-weight: normal;

    font-size: 100%;

}



ol,

ul,

li,

dl,

dt,

dd {

    list-style: outside none none;

}



input,

button,

textarea,

checkbox,

select,

radio,

form {

    vertical-align: middle;

    font-size: 100%;

}



a {

    color: #333;

    text-decoration: none;

}



a:link,

a:visited {

    text-decoration: none;

}



a:hover {

    text-decoration: none;

}

.container {

    min-width: 320px;

    width: 100%;

    margin: 0px auto;

    background: #fff;

}/* 头部 */



.toper {

    width: 100%;

    height: auto;

    background: #fff;

    position: relative;

    z-index: 0;

}

.toper h4 {

    width: 100%;

    height: 0.95rem;

    text-align: center;

    font-size: 0.35rem;

    line-height: 0.95rem;

    color: #fff;

}

/*banner*/

.toper .xbsindex {

    width: 6.1rem;

    margin: 0 auto;

    position: relative;

    overflow: hidden;

    z-index: 1;

    border-radius: 0.1rem;

    overflow: hidden;

}

.toper .xbsindex img {

    width: 100%;

}.toper .tel {

    width: auto;

    padding: 0 0.15rem;

    height: 0.85rem;

    line-height: 0.85rem;

    border-bottom: solid 1px #c6c6c6;

    display: flex;

    justify-content: space-between;

}

.toper .tel p {

    padding-left: 0.56rem;

    font-size: 0.24rem;

    position: relative;

}

.toper .tel p::before {

    content: '';

    width: 0.35rem;

    height: 0.35rem;

    background: url(../images/tel01.png);

    position: absolute;

    top: 0.25rem;

    left: 0;

    background-size: 0.35rem 0.35rem;

    animation: msClock 1.2s linear infinite;

}

@keyframes msClock {

    0%,

    70%,

    100% {

        transform: rotate(0) scale(1);

    }    10%,

    30% {

        transform: rotate(-15deg) scale(1);

    }    20%,

    40% {

        transform: rotate(15deg) scale(1);

    }



}

.toper .tel a {

    width: 1.3rem;

    height: 0.45rem;

    line-height: 0.45rem;

    background: #666;

    font-size: 0.22rem;

    color: #fff;

    text-align: center;

    border-radius: 0.05rem;

    margin-top: 0.2rem;

    position: relative;

}/*icon_nav*/



.icon_nav {

    width: auto;

    padding: 0.4rem 0.25rem 0.25rem 0.25rem;

    display: flex;

    justify-content: space-between;

    flex-wrap: wrap;

    background: #fff;

    border-bottom: solid 0.1rem #f2f2f2;

}



.icon_nav li a {

    display: block;

    width: 100%;

    height: 0.42rem;

    font-size: 0.24rem;

    color: #fff;

}/* 产品 */



.pro_center {

    width: auto;

    padding: 0.4rem 0.15rem 0 0.15rem;

    background: #fff;

    border-bottom: solid 0.1rem #f2f2f2;

}

.pro_center .bt {

    height: 0.75rem;

    display: flex;

    justify-content: space-between;

    position: relative;

}

.pro_center .bt::after {

    content: '';

    width: 0.4rem;

    height: 0.04rem;

    background: #000;

    position: absolute;

    bottom: 0;

    left: 0;

}

.pro_center .bt .name {

    font-size: 0.3rem;

    line-height: 0.3rem;

    color: #000;

}

.pro_center .bt p {

    font-size: 0.22rem;

    line-height: 0.18rem;

    color: #c2c2c2;

    font-family: Arial;

    text-transform: Uppercase;

    margin-top: 0.15rem;

}

.pro_center .bt .more {

    font-size: 0.22rem;

    line-height: 0.75rem;

    color: #707070;

    font-family: Arial;

    text-transform: Uppercase;

    background: url(../images/pro_jt_01.png) right center no-repeat;

    padding-right: 0.3rem;

    background-size: 0.22rem 0.1rem;

}

.pro_center .chanpin {

    margin-top: 0.5rem;

}

.chanpin .porducts-b1 {

    width: auto;

    height: 0.46rem;

    display: flex;

    justify-content: space-between;

    position: relative;

}

.chanpin .porducts-b1::before {

    content: '';

    width: 160%;

    height: 1px;

    background: #d4d4d4;

    position: absolute;

    top: 0.38rem;

    left: 0;

}

.chanpin .product-tabs .swiper-slide {

    width: auto;

    height: 0.46rem;

    position: relative;

    margin-right: 0.3rem;

}

.chanpin .product-tabs .swiper-slide a {

    display: block;

    width: auto;

    height: 0.46rem;

    line-height: 1.2;

    text-align: center;

    font-size: 0.25rem;

    color: #444;

    position: relative;

}



.product-content .swiper-slide .incplb {

    margin-top: 0.4rem;

    display: flex;

    justify-content: space-between;

    flex-wrap: wrap;

}

.product-content .swiper-slide .incplb .incp_1 {

    width: 47%;

    height: 3.35rem;

    overflow: hidden;

    margin-bottom: 0.3rem;

}

.incp_1pic {

    width: 100%;

    height: 2.9rem;

}

.incp_1pic img {

    width: 100%;

    height: 2.4rem;

    vertical-align: top;

    display: block;

    object-fit: contain;

}

.incp_1tite {

    height: 0.45rem;

    line-height: 0.45rem;

    font-size: 0.24rem;

    color: #888;

    overflow: hidden;

}

.incp_1tite a {

    display: block;

    width: auto;

    padding-right: 0.5rem;

    color: #888;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    background: url(../images/pro_jt_02.png) right center no-repeat;

    background-size: 0.32rem 0.32rem;

}

/* 案例 */



.case_center {

    width: auto;

    padding: 0.4rem 0.15rem 0 0.15rem;

    background: #fff;

}

.case_center .bt {

    height: 0.75rem;

    display: flex;

    justify-content: space-between;

    position: relative;

}

.case_center .bt::after {

    content: '';

    width: 0.4rem;

    height: 0.04rem;

    background: #000;

    position: absolute;

    bottom: 0;

    left: 0;

}

.case_center .bt .name {

    font-size: 0.3rem;

    line-height: 0.3rem;

    color: #000;

}

.case_center .bt p {

    font-size: 0.22rem;

    line-height: 0.18rem;

    color: #c2c2c2;

    font-family: Arial;

    text-transform: Uppercase;

    margin-top: 0.15rem;

}

.case_center .bt .more {

    font-size: 0.22rem;

    line-height: 0.75rem;

    color: #707070;

    font-family: Arial;

    text-transform: Uppercase;

    background: url(../images/pro_jt_01.png) right center no-repeat;

    padding-right: 0.3rem;

    background-size: 0.22rem 0.1rem;

}

.case_02 {

    width: 100%;

    margin-top: 0.4rem;

    overflow: hidden;

    padding: 0.1rem 0 0.8rem 0 !important;

}

.case_02 .swiper-slide {

    width: 3.45rem;

    -moz-box-shadow: 0px 0px 5px #e9e9e9;

    -webkit-box-shadow: 0px 0px 5px #e9e9e9;

    box-shadow: 0px 0px 5px #e9e9e9;

}

.case_02 .swiper-slide a {

    width: 100%;

    display: block;

}

.case_02 .swiper-slide img {

    width: 100%;

    height: 2.6rem;

    vertical-align: top;

    object-fit: contain;

}

.case_02 .swiper-slide h4 {

    width: auto;

    height: 0.5rem;

    line-height: 0.5rem;

    padding: 0 0.45rem 0 0.1rem;

    font-size: 0.24rem;

    color: #444;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    background: url(../images/case_jt.png) 2.25rem center no-repeat;

    background-size: 0.13rem 0.24rem;

}

.case_02 .swiper-slide p {

    width: auto;

    line-height: 0.2rem;

    margin-bottom: 0.15rem;

    padding: 0 0.1rem;

    font-size: 0.22rem;

    color: #888;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.case_02 .swiper-pagination-bullet {

    width: 0.12rem;

    height: 0.12rem;

    border-radius: 50%;

    background: #a8a8a8;

    opacity: 1;

}/* 电话 */.ad_tel p {

    padding-left: 1rem;

    font-size: 0.24rem;

    position: relative;

    color: #fff;

}

.ad_tel p::before {

    content: '';

    width: 0.44rem;

    height: 0.44rem;

    background: url(../images/tel02.png);

    position: absolute;

    top: 0.13rem;

    left: 0.4rem;

    background-size: 0.44rem 0.44rem;

    animation: msClock 1.2s linear infinite;

}

.ad_tel p span {

    font-weight: bold;

    font-size: 0.3rem;

}

.ad_tel a {

    width: 1.4rem;

    height: 0.7rem;

    line-height: 0.7rem;

    background: #333;

    font-size: 0.22rem;

    color: #fff;

    text-align: center;

    border-radius: 0.35rem

}

/*ys */



.ys {

    width: auto;

    overflow: hidden;

    border-bottom: solid 0.1rem #f2f2f2;

}

.ys .bt {

    text-align: center;

    height: 1rem;

    position: relative;

    margin-bottom: 0.4rem;

}.ys .bt h3 {

    font-size: 0.32rem;

    line-height: 0.32rem;

    color: #000;

}

.ys .bt p {

    font-size: 0.22rem;

    line-height: 0.22rem;

    color: #c2c2c2;

    margin-top: 0.1rem;

    font-family: Arial;

    text-transform: Uppercase;

}

.ys .case_01 .swiper-slide {

    width: auto;

    height: auto;

    margin-top: 0.4rem;

    padding-bottom: 0.4rem;

    cursor: pointer;

    position: relative;

    transform: scale(0.9);

    margin-top: -0.2rem;

}

.ys .case_01 .swiper-slide.swiper-slide-active {

    display: block;

    transform: scale(1);

    margin-top: 0rem;

}

.ys .case_01 .swiper-slide img {

    width: 100%;

    height: 3.3rem;

    object-fit: cover;

}

.ys .case_01 .swiper-slide .show {

    width: 100%;

    height: auto;

    border-radius: 0.1rem;

    margin-top: 0.6rem;

    padding: 0.3rem 0.4rem;

    margin-left: -0.4rem;

    -moz-box-shadow: 0px 0px 7px #e9e9e9;

    -webkit-box-shadow: 0px 0px 7px #e9e9e9;

    box-shadow: 0px 0px 7px #e9e9e9;

    display: none;

}

.ys .case_01 .swiper-slide.swiper-slide-active .show {

    display: block;

}

.ys .case_01 .swiper-slide .show h4 {

    height: 0.5rem;

    font-size: 0.3rem;

    line-height: 0.3rem;

    color: #333;

    background: url(../images/ys_line.png) bottom left repeat-x

}

.ys .case_01 .swiper-slide .show p {

    font-size: 0.24rem;

    line-height: 0.35rem;

    color: #888;

    margin-top: 0.25rem;

}

.ys .case_01 .swiper-pagination {

    bottom: none;

    height: 0.2rem;

    top: 3.5rem !important;

}

.ys .case_01 .swiper-pagination-bullet {

    width: 0.12rem;

    height: 0.12rem;

    border-radius: 50%;

    background: #a8a8a8;

    opacity: 1;

}/* 关于我们 */



.about_center {

    width: auto;

    padding: 0.4rem 0.15rem;

    background: #fff;

    border-bottom: solid 0.1rem #f2f2f2;

}

.about_center .bt {

    height: 0.75rem;

    display: flex;

    justify-content: space-between;

    position: relative;

}

.about_center .bt::after {

    content: '';

    width: 0.4rem;

    height: 0.04rem;

    background: #000;

    position: absolute;

    bottom: 0;

    left: 0;

}

.about_center .bt .name {

    font-size: 0.3rem;

    line-height: 0.3rem;

    color: #000;

}

.about_center .bt p {

    font-size: 0.22rem;

    line-height: 0.18rem;

    color: #c2c2c2;

    font-family: Arial;

    text-transform: Uppercase;

    margin-top: 0.15rem;

}

.about_center .bt .more {

    font-size: 0.22rem;

    line-height: 0.75rem;

    color: #707070;

    font-family: Arial;

    text-transform: Uppercase;

    background: url(../images/pro_jt_01.png) right center no-repeat;

    padding-right: 0.3rem;

    background-size: 0.22rem 0.1rem;

}

.about_center .center {

    width: auto;

    position: relative;

    margin-top: 0.35rem;

}

.about_center .center img {

    display: block;

    width: 100%;

    /* height: 3.55rem; */

    border-radius: 0.1rem;

    overflow: hidden;

}



.about_center .center iframe {

    width: 100% !important;

    height: auto !important;

}

.about_center .center .txt {

    width: auto;

    height: 2.6rem;

    padding: 0 0.25rem;

    border-radius: 0.15rem;

    position: relative;

    margin: 0 0.15rem;

    bottom: 0;

    background: #fff;

    -moz-box-shadow: 0px 0px 7px #e9e9e9;

    -webkit-box-shadow: 0px 0px 7px #e9e9e9;

    box-shadow: 0px 0px 7px #e9e9e9;

    overflow: hidden;

}

.about_center .center .txt p {

    font-size: 0.24rem;

    line-height: 0.4rem;

    color: #666;

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 5;

    overflow: hidden;

    margin-top: 0.2rem;

}

/*news*/



.news {

    width: auto;

    padding: 0.4rem 0.15rem;

    background: #fff;

    border-bottom: solid 0.1rem #f2f2f2;

}

.news .bt {

    height: 0.75rem;

    display: flex;

    justify-content: space-between;

    position: relative;

}

.news .bt::after {

    content: '';

    width: 0.4rem;

    height: 0.04rem;

    background: #000;

    position: absolute;

    bottom: 0;

    left: 0;

}

.news .bt .name {

    font-size: 0.3rem;

    line-height: 0.3rem;

    color: #000;

}

.news .bt p {

    font-size: 0.22rem;

    line-height: 0.18rem;

    color: #c2c2c2;

    font-family: Arial;

    text-transform: Uppercase;

    margin-top: 0.15rem;

}

.news .bt .more {

    font-size: 0.22rem;

    line-height: 0.75rem;

    color: #707070;

    font-family: Arial;

    text-transform: Uppercase;

    background: url(../images/pro_jt_01.png) right center no-repeat;

    padding-right: 0.3rem;

    background-size: 0.22rem 0.1rem;

}

.news .yinying {

    height: auto;

    margin-top: 0.4rem;

}

.news .tabs {

    width: auto;

    height: 0.4rem;

    line-height: 0.4rem;

    margin-bottom: 0.4rem;

    display: flex;

    justify-content: space-between;

}

.news .tabs a {

    width: 1.55rem;

    font-size: 0.24rem;

    padding-left: 0.15rem;

    color: #fff;

    border-radius: 0.06rem;

    display: inline-block;

}



.news .top {

    width: auto;

    height: 2rem;

    display: flex;

    justify-content: space-between;

}

.news .top a {

    display: block;

    width: 47%;

    height: 2rem;

    border-radius: 0.1rem;

    overflow: hidden;

    position: relative;

}

.news .top a img {

    display: block;

    width: 100%;

    height: 2rem;

    vertical-align: top;

    object-fit: cover;

}

.news .top a p {

    width: 90%;

    padding: 0 5%;

    height: 0.45rem;

    line-height: 0.45rem;

    font-size: 0.24rem;

    text-align: center;

    color: #fff;

    background: rgba(0, 0, 0, 0.6);

    position: absolute;

    left: 0;

    bottom: 0;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.news .bottom {

    width: auto;

    height: auto;

}

.news .bottom a {

    display: block;

    width: auto;

    height: 1.4rem;

    padding: 0 0.1rem;

    border-bottom: solid 1px #d6d6d6;

    margin-top: 0.4rem;

}

.news .bottom a h4 {

    font-size: 0.26rem;

    line-height: 0.3rem;

    color: #444;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

}

.news .bottom a span {

    display: block;

    padding-left: 0.35rem;

    height: 0.25rem;

    line-height: 0.25rem;

    background: url(../images/date.png) left center no-repeat;

    background-size: 0.22rem 0.22rem;

    margin-top: 0.18rem;

}

.news .bottom a p {

    font-size: 0.22rem;

    line-height: 0.24rem;

    color: #888;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    margin-top: 0.2rem;

}

/* 底部 */



.footer {

    width: auto;

    padding: 0.4rem 0.15rem 1.6rem 0.15rem;

    height: auto;

    background: #fff;

    position: relative;

}

.footer h4 {

    font-size: 0.28rem;

    line-height: 0.3rem;

    color: #000;

    margin-bottom: 0.4rem;

}

.footer p {

    width: 4.5rem;

    font-size: 0.24rem;

    line-height: 0.25rem;

    color: #666;

    margin-bottom: 0.15rem;

    line-height: 1.2;

}

.footer p a {

    color: #666;

}

.footer p img {

    vertical-align: middle;

}

.footer .ewm {

    width: 1.2rem;

    height: 1.2rem;

    position: absolute;

    right: 0.2rem;

    top: 1rem;

}

.footer .ewm img {

    display: block;

    width: 1.2rem;

    height: 1.2rem;

    vertical-align: top;

}



.webChatHm {

    position: absolute;

    top: 100%;

}

.webChatBox {

    width: 96%;

    border-radius: 10px;

    background: #fff;

    position: fixed;

    z-index: 999999999999999;

    left: 2%;

    top: 30%;

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);

    display: none;



}

.webChatBox .webChatBoxCenter {

    position: relative;



}

.webChatBox .webChatBoxCenter .webClose {

    width: 0.5rem;

    height: 0.5rem;

    background: url(../images/webChatclose.png) no-repeat center;

    position: absolute;

    top: -0.4rem;

    right: 0.2rem;

    background-size: 50%;



}

.webChatBox .webChatBoxCenter img {

    width: 10%;

    display: block;

    margin: 10% auto 0;



}

.webChatBox .webChatBoxCenter h4 {

    font-weight: bold;

    color: #000;

    text-align: center;

    font-size: 0.3rem;

    padding-top: 0.2rem;

}

.webChatBox .webChatBoxCenter p {

    font-size: 0.24rem;

    text-align: center;

    margin-top: 0.1rem;



}

.webChatBox .webChatBoxCenter span {

    padding: 5px 20px;

    background: #1aad19;

    font-size: 0.24rem;

    line-height: 0.5rem;

    border-radius: 20px;

    color: #fff;

    display: block;

    margin: 0 auto;

    width: 30%;

    text-align: center;

    margin: 6% auto 6%;



}

/*

display:flex;justify-content: space-between;flex-wrap:wrap;  

overflow:hidden;text-overflow:ellipsis;white-space:nowrap;

-webkit-transition:all .5s;transition:all .5s;

transition: all 1s;

outline: 1px dashed #fff;outline-offset: -5px;

transform:rotate(360deg);

text-transform: Uppercase;

*/



.ft_nav {

    position: fixed;

    bottom: 0;

    width: 100%;

    height: 70px;

    margin: 0 auto;

    background: rgba(6, 106, 170, 1);

    display: flex;

    justify-content: space-between;

    z-index: 99;

    -moz-box-shadow: 0px -5px 10px #d6d6d6;

    -webkit-box-shadow: 0px -5px 10px #d6d6d6;

    box-shadow: 0px -5px 10px #d6d6d6;



}.ft_nav a {

    width: 25%;

    display: block;

    text-align: center;

    position: relative;



}

.ft_nav a::before {

    content: '';

    width: 1px;

    height: 0rem;

    background: #fff;

    position: absolute;

    top: 0;

    left: 50%;

    -webkit-transition: all .5s;

    transition: all .5s;



}

.ft_nav a.on::before {

    content: '';

    width: 1px;

    height: 8px;

    background: #fff;

    position: absolute;

    top: 0;

    left: 50%;

    -webkit-transition: all .5s;

    transition: all .5s;



}

.ft_nav a i {

    display: block;

    width: 29px;

    height: 26px;

    margin: 12px auto 5px;



}

.ft_nav a:nth-of-type(1) i {

    background: url(../images/ft_nav_01.png) center center no-repeat;

    background-size: 76%;



}

.ft_nav a:nth-of-type(2) i {

    background: url(../images/ft_nav_02.png) center center no-repeat;

    background-size: 76%;



}

.ft_nav a:nth-of-type(3) i {

    background: url(../images/ft_nav_03.png) center center no-repeat;

    background-size: 76%;



}

.ft_nav a:nth-of-type(4) i {

    background: url(../images/webchat.png) center center no-repeat;

    background-size: 76%;



}

.ft_nav a p {

    font-size: 14px;

    color: #fff;

    line-height: 1;



}

.webChatHm {

    position: absolute;

    top: -100%;

}

.webChatBox {

    width: 96%;

    border-radius: 10px;

    background: #fff;

    position: fixed;

    z-index: 999999999999999;

    left: 2%;

    top: 30%;

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);

    display: none;



}

.webChatBox .webChatBoxCenter {

    position: relative;



}

.webChatBox .webChatBoxCenter .webClose {

    width: 20px;

    height: 20px;

    background: url(../images/webChatclose.png) no-repeat center;

    position: absolute;

    top: -20px;

    right: 20px;

    background-size: 100%;



}

.webChatBox .webChatBoxCenter img {

    width: 10%;

    display: block;

    margin: 10% auto 0;



}

.webChatBox .webChatBoxCenter h4 {

    font-weight: bold;

    color: #000;

    text-align: center;

    font-size: 18px;

    padding-top: 20px;



}

.webChatBox .webChatBoxCenter p {

    font-size: 12px;

    text-align: center;

    margin-top: 0.1rem;



}

.webChatBox .webChatBoxCenter span {

    padding: 5px 20px;

    background: #1aad19;

    font-size: 12px;

    line-height: 24px;

    border-radius: 20px;

    color: #fff;

    display: block;

    margin: 0 auto;

    width: 30%;

    text-align: center;

    margin: 6% auto 6%;



}

.tobar {

    position: fixed;

    bottom: 0;

    left: 0;

    width: 100%;

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);

    height: 64px;

    background-color: #fff;

    z-index: 999;



}

.tobar ul>li {

    float: left;

    width: 25%;



}

.tobar ul>li a i {

    display: block;

    width: 24px;

    height: 24px;

    margin: 0 auto;

    margin-top: 10px;



}

.tobar ul>li a i img {

    width: 24px;

    height: 24px;

    display: block;



}

.tobar ul>li a i.IcoOn {

    display: none;



}

.tobar ul>li a p {

    color: #666;

    font-size: 14px;

    margin-top: 5px;

    text-align: center;



}

.tobar ul>li.active a i {

    display: none;



}

.tobar ul>li.active a i.IcoOn {

    display: block;



}

.tobar ul>li.active a p {

    color: #333;



}.footer ul li p img {

    margin-top: 5px;



}

.contactBox ul li p>img {

    width: 100%;

    height: 100%;

    object-fit: cover;



}.ft_nav a {

    width: 25%;

    display: block;

    text-align: center;

    position: relative;



}

.ft_nav a::before {

    content: '';

    width: 1px;

    height: 0rem;

    background: #fff;

    position: absolute;

    top: 0;

    left: 50%;

    -webkit-transition: all .5s;

    transition: all .5s;



}

.ft_nav a.on::before {

    content: '';

    width: 1px;

    height: 0.15rem;

    background: #fff;

    position: absolute;

    top: 0;

    left: 50%;

    -webkit-transition: all .5s;

    transition: all .5s;



}

.ft_nav a i {

    display: block;

    width: 0.5rem;

    height: 0.45rem;

    margin: 0.2rem auto;



}

.ft_nav a:nth-of-type(1) i {

    background: url(../images/ft_nav_01.png) center center no-repeat;

    background-size: 0.46rem 0.43rem;



}

.ft_nav a:nth-of-type(2) i {

    background: url(../images/ft_nav_02.png) center center no-repeat;

    background-size: 0.43rem 0.43rem;



}

.ft_nav a:nth-of-type(3) i {

    background: url(../images/ft_nav_03.png) center center no-repeat;

    background-size: 0.43rem 0.43rem;



}

.ft_nav a:nth-of-type(4) i {

    background: url(../images/webchat.png) center center no-repeat;

    background-size: 0.44rem auto;



}

.ft_nav a p {

    font-size: 0.22rem;

    color: #fff;

    line-height: 0.24rem;



}