.banner {overflow: hidden;position: relative;height: 900px;display: flex;align-items: center;justify-content: center;}
.banner .text {position: absolute;z-index: 4;display: flex;flex-flow: column;top: 50%;justify-content: center;text-align: center;color: #fff;line-height: 1.5em;align-items: center;}
.banner .text h2 {font-size: 58px;line-height: 1.5em;margin-bottom: .3em;}
.banner .text p {;font-size: 18px;margin-bottom: 2.5em;}
.banner a.more {width: 298px;height: 48px;border: 1px solid;display: flex;align-items: center;justify-content: center;font-size: 16px;color: #fff;position: relative;}
.banner a.more::after {content: '';position: absolute;left: 0;top: 0;width: 0;transition: all .3s;z-index: -1;background-color: #f60;height: 100%;}
.banner a.more:hover::after {width: 100%;}
.banner a.more:hover {border-color: #f60;}
.banner .swiper-wrapper {transition: all 1000ms cubic-bezier(1, -.5, 0, .5) 0s !important;}
/*about*/
.i-about {padding: 120px 0;line-height: 1.5;}
.i-about .text {width: 566px;}
.i-about h3 {color: #222;font-size: 40px;text-transform: uppercase;transform: scale(1, 1.8);font-family: 'arial';}
.i-about h4 {line-height: 2.6;font-size: 36px;font-weight: 400;color: #777;position: relative;margin-bottom: .5em;}
.i-about h4::after {content: '';position: absolute;top: 100%;left: 0;width: 3em;height: 2px;background-color: #999;margin-top: -.1em;}
.i-about p {color: #777;line-height: 28px;font-size: 14px;}
.i-about ul {display: flex;padding: 30px 0;font-size: 18px;color: #333;}
.i-about p {font-size: 16px;color: #777}
.i-about .number {font-size: 60px;font-weight: 700;color: #004A9A;margin-right: 10px;}
.i-about li {flex: 1 auto;text-align: center;}
.index-more {width: 298px;height: 48px;display: flex;align-items: center;justify-content: center;font-size: 16px;color: #fff;position: relative;}
.index-more::before {background-color: #005bad;content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;width: 100%;z-index: -2;}
.index-more::after {background-color: #f60;content: '';position: absolute;top: 0;left: 0;bottom: 0;width: 0%;z-index: -1;transition: all .3s;}
.index-more:hover::after {width: 100%;}
.i-about .img {flex: 1 auto;justify-content: flex-end;display: flex;}
/*product*/
.i-product {position: relative;padding-bottom: 100px;margin-bottom: 100px;line-height: 1.5;}
.i-product .bd {position: relative;z-index: 0;overflow: hidden;height: 41.563vw;}
.i-product .bd li {position: absolute;left: 0;top: 0;right: 0;z-index: 0;bottom: 0;opacity: 0;transition: all .3s;}
.i-product .bd li.on {opacity: 1;z-index: 1;}
.i-product .hd {display: flex;padding: 0 60px;box-shadow: 0 0 20px 0 rgba(0, 0, 0, .2);position: absolute;z-index: 4;bottom: 0;left: 50%;transform: translateX(-50%);background-color: #fff;border-radius: 2px;}
.i-product .hd li {width: 200px;height: 200px;display: flex;flex-flow: column;align-items: center;justify-content: center;position: relative;overflow: hidden;padding-top: 100px;cursor: pointer;transition: all .3s;margin: 0 10px;}
.i-product .hd li span, .i-product .hd li em {position: absolute;left: 0;right: 0;margin: 0 auto;top: 67px;display: flex;align-items: center;justify-content: center;overflow: hidden;width: 50px;height: 50px;}
.i-product .hd li img {position: absolute;top: 0;transition: all .5s;}
.i-product .hd li span img {opacity: 1;}
.i-product .hd li em img {opacity: 0;}
.i-product .hd li:hover span img {opacity: 0;}
.i-product .hd li:hover em img {opacity: 1;}
.i-product .hd li.on {box-shadow: 0 -4px 0 0 #005BAD inset;}
.i-product .hd li.on span img {opacity: 0;}
.i-product .hd li.on em img {opacity: 1;}
/*news*/
.i-news {}
.i-news .tit {display: flex;flex-flow: column;align-items: center;justify-content: center;margin-bottom: 70px;}
.i-news .tit h3 {font-size: 46px;margin-bottom: .8em;}
.i-news .tit p {font-size: 14px;color: #777;}
.list-news {display: flex;gap: 48px;margin-bottom: 120px;}
.list-news li {flex-shrink: 0;width: calc(33.33% - 32px);transition: all .3s;margin-top: 0;box-shadow: 0 0 1px 0 rgba(0, 0, 0, .1);background-color: #fff;color: #333;}
.list-news .img {display: flex;position: relative;overflow: hidden;align-items: center;justify-content: center;height: 220px;margin-bottom: 20px;}
.list-news img {transition: all .3s;}
.list-news .img:hover img {transform: scale(1.1);}
.list-news li:hover {margin-top: -10px;box-shadow: 0 0 20px 0 rgba(0, 0, 0, .2);background-color: #005BAD;color: #fff;}
.list-news .text {display: flex;flex-flow: column;overflow: hidden;padding: 10px 20px;line-height: 1.5;}
.list-news .text p {display: block;}
.list-news .text em {display: block;margin: 5px 0;font-size: 12px;opacity: .7;}
.list-news .text em+p {font-size: .9em;}
.i-link {height: 380px;background: url(../images/spbg.jpg) no-repeat center;-webkit-background-size: cover;background-size: cover;display: flex;align-items: center;justify-content: center;text-align: center;font-size: 38px;color: #fff;flex-flow: column;}
/*.i-link img {margin-top: 50px;}*/
.i-friend {line-height: 28px;padding: 26px 0;font-size: 12px;}
.c-red {color: #b22222}
.i-friend a{color: #666;padding: 0 .5em;margin:0 .3em;opacity: .8;}
.i-friend a:hover{opacity: 1;}


