@import '../iconfont/iconfont.css';
.wrap { width: 88%; max-width: 1600px; margin-left: auto; margin-right: auto }
.ver>* { display: inline-block; vertical-align: middle }
.hv-scale { overflow: hidden }
.hv-scale img { -webkit-transition: .5s; -o-transition: .5s; -moz-transition: .5s; transition: .5s }
.hv-scale:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1) }
.tran3 { transition: .3s }
.table-cell { display: table; width: 100% }
.table-cell>* { display: table-cell; vertical-align: middle }
.row-pv0 { margin-left: 0; margin-right: 0 }
.row-pv0>* { padding-left: 0; padding-right: 0 }
.mv0 { margin-left: 0!important; margin-right: 0!important }
.pv0 { padding-left: 0!important; padding-right: 0!important }
.pt0 { padding-top: 0px !important }
.pb0 { padding-bottom: 0px !important }
.mb0 { margin-bottom: 0 !important }
.mt0 { margin-top: 0!important }
.bg-gray { background: #f5f5f7 }
.c-base { color: #F08300 }
.bg-base { background: #F08300 }
.hv:hover { color: #F08300 }
.hv-f:hover { color: #fff }
body { font-family: "Helvetica Neue", '微软雅黑', '思源黑体', Helvetica, Arial, sans-serif; overflow-x: hidden }
.w1400 { margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px }
.swiper-container { --swiper-theme-color:#F08300
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled { opacity: .6s !important }
.medium { font-family: medium }
footer { color: #fff; background: #000; overflow: hidden }
footer a { color: #bbb }
footer a:hover { color: #fff }
footer .content { padding:.7rem 0 1.1rem
}
footer .ftconcat { line-height: 1.5; max-width: 30% }
footer .ftconcat h4 { font-size: 16px; margin-bottom: 6px }
footer .ftconcat .tel { font-size: 30px; font-family: medium; color: #fff }
footer .ftconcat .site { color: #999; line-height: 2; }
footer .ft_join { margin-top: 10px; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
footer .ft_join .icon { color: #999; margin-right: 10px; position: relative }
footer .ft_join .icon:hover .iconfont { background: #F08300; color: #fff }
footer .ft_join .icon:hover .popup { display: block }
footer .ft_join .popup { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); padding: 4px; margin-top: 14px; background: #fff; width: 140px; display: none }
footer .ft_join .popup:after { width: 0; height: 0; border: 10px solid transparent; border-bottom-color: #fff; position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; top: -14px; content: '' }
footer .ft_join .popup img { width: 100% }
footer .ft_join .iconfont { font-size: 22px; cursor: pointer; border-radius: 3px; padding: 5px }
@media (min-width:993px) {
footer .content { display: -webkit-flex; display: flex; display: -webkit-box; display: box }
footer .ftnavs { width: 44%; border-right: 1px solid #313131; margin-right:.76rem;
min-width: 400px }
footer .ftnavs ul { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
footer .ftnavs li { width: 33.3% }
footer .ftwechat { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1 }
footer .ftwechat .inner { float: right; text-align: center }
footer .ftwechat .inner .tit { margin-top: 16px }
footer .ftwechat img { max-width: 10vw }
}
footer .navitem h4 { font-size: 16px; position: relative; margin-bottom: 12px }
footer .navitem .icon-jia { float: right; transition: .3s; display: none; margin-right: 10px }
footer .navitem .info a { display: block; line-height: 30px }
footer .ft-bottom {
padding:24px 0 .84rem; width: 88%; max-width: 1600px; margin-left: auto; margin-right: auto; color: #999; border-top: 1px solid #313131 }
footer .ft-bottom .copyright>*>* { display: inline-block; vertical-align: middle }
footer .ft-bottom .copyright .beian { margin-left: 5px; color: #999 }
footer .ft-bottom .copyright .beian:hover { color: #fff }
footer .ft-bottom .copyright .skill { color: #666; margin-left: 10px }
footer .ft-bottom .copyright .skill:hover { color: #fff }
@media (min-width:993px) {
footer .ft-bottom { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
}
@media (max-width:992px) {
footer .ft-bottom { text-align: center }
footer .ft-bottom .ftlogo { margin-top:.2rem
}
}
@media (max-width:640px) {
footer .ft-bottom .copyright { font-size: 12px; line-height: 1.8 }
footer .ft-bottom .copyright a { display: inline-block }
}
@media (max-width:992px) {
footer .navitem { float: none; width: 100% }
footer .navitem .icon-jia { display: block }
footer .navitem h4 { position: relative; border-bottom: 1px solid rgba(255,255,255,0.3); height: 46px; line-height: 46px; margin: 0 }
footer .navitem .info { display: none; font-size: 15px; padding: 10px 30px; line-height: 2 }
footer .navitem .info a { color: rgba(255,255,255,0.8) }
footer .navitem.active .iconfont { transform: rotate(135deg) }
footer .content { padding: 40px 0 }
footer .ftconcat { text-align: center; max-width: none; padding:.8rem 0
}
footer .ft_join { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center; margin-top: 16px }
footer .ftwechat { text-align: center }
footer .ftwechat .tit { margin-top: 10px }
}
@media (max-width:992px) {
footer .navitem h4 { font-weight: normal }
footer .telbox { text-align: center; margin-bottom:.5rem
}
footer .telbox .logo { display: none }
}
@media (max-width:768px) {
footer .ft-link { font-size: 12px }
footer .ft-link a { margin-right: 6px }
footer .navitem h4 { font-size: 16px }
}
.menu_btn { width: 50px; height: 60px; z-index: 101; cursor: pointer; position: absolute; right: 0; transform-origin: center center; top: 50%; transform: translateY(-50%) scale(.8); -webkit-transform: translateY(-50%) scale(.8); -moz-transform: translateY(-50%) scale(.8); -ms-transform: translateY(-50%) scale(.8); -o-transform: translateY(-50%) scale(.8) }
.menu_btn i { position: absolute; width: 26px; height: 2px; background: #fff; left: 12px; display: block; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out }
.menu_btn i:nth-of-type(1) { top: 20px }
.menu_btn i:nth-of-type(2) { top: 30px }
.menu_btn i:nth-of-type(3) { top: 40px; width: 14px }
.menu_btn.active i:nth-of-type(1) { -webkit-transform: rotate(225deg) translate(-7px, -7px); -moz-transform: rotate(225deg) translate(-7px, -7px); -ms-transform: rotate(225deg) translate(-7px, -7px); -o-transform: rotate(225deg) translate(-7px, -7px); transform: rotate(225deg) translate(-7px, -7px) }
.menu_btn.active i:nth-of-type(3) { opacity: 0 }
.menu_btn.active i:nth-of-type(2) { -webkit-transform: rotate(-225deg) translate(0, 0); -moz-transform: rotate(-225deg) translate(0, 0); -ms-transform: rotate(-225deg) translate(0, 0); -o-transform: rotate(-225deg) translate(0, 0); transform: rotate(-225deg) translate(0, 0) }
.menu_btn:hover i:nth-of-type(3) { width: 28px }
.header { height: 90px; background-color: rgba(0,0,0,0.5); transition: .3s; width: 100%; z-index: 9999; position: fixed; left: 0; right: 0; top: 0 }
.header .hdinner { width: 88%; max-width: 1600px; margin-left: auto; margin-right: auto; overflow: visible; position: relative; z-index: 999 }
@media (max-width:640px) {
.header .hdinner { width: 96%; left: 2% }
}
.header .logo { height: 90px; width: 240px; background: url('../images/logo.png') no-repeat 0 center }
@media (max-width:992px) {
.header { height: 80px }
.header .logo { height: 80px }
.header .pc-menus .tit { font-size: 14px }
}
@media (max-width:768px) {
.header { height: 50px }
.header .logo { height: 50px; background-size: auto 60px }
}
@media (max-width:480px) {
.header .menu_btn { right: 0 }
.header .logo { background-size: 60% }
}
.pc-menus { height: 90px; max-width: 600px; min-width: 536px; width: 43vw }
.pc-menus li { text-align: center; float: left; transition: .3s; position: relative }
.pc-menus .tit {
padding:0 .35rem; white-space: nowrap; text-align: center; cursor: pointer; font-size: 15px; display: block; color: #fff; transition: .3s; line-height: 90px; height: 90px; position: relative }
.pc-menus .tit>.iconfont { font-size: 12px; margin-left: 5px }
.pc-menus .tit::after { content: ''; display: block; position: absolute; width: 0; left: 50%; bottom: 0; height: 2px; background: #F08300; transform: translateX(-50%); transition: .3s }
.pc-menus .tit.active::after,
.pc-menus li:hover .tit::after { width: 180px }
.pc-menus .tit-home.active::after,
.pc-menus li:hover .tit-home::after { width: 100% }
.pc-menus .dropinfo { height: 0px; background: rgba(0,0,0,0.5); font-size: 14px; position: absolute; width: 180px; left: 50%; opacity: 0; transform: translateX(-50%); top: 100%; overflow: hidden; transition: all ease-in .2s }
.pc-menus .dropinfo a { display: block; line-height: 0px; color: #fff; transition: .3s }
.pc-menus .dropinfo a:hover { background: #F08300 }
.pc-menus li:hover .dropinfo { height: auto; opacity: 1; box-shadow: 0 10px 5px rgba(0,0,0,0.1) }
.pc-menus li:hover .dropinfo a { line-height: 58px }
.header-shadow { box-shadow: 0 0 15px rgba(0,0,0,0.15) }
@media (max-width:480px) {
.header-shadow { box-shadow: 0 0 1px rgba(0,0,0,0.1) }
}
main { overflow: hidden }
.m-menus { width: 100%; height: 100vh; position: fixed; top: 50px; right: -100%; background: #fff; overflow: hidden; line-height: 40px; font-size: 15px; z-index: 999; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease }
@media (min-width:768px) {
.m-menus { top: 80px }
}
.m-menus .inner { height: calc((100vh - 50px )); overflow-y: auto; border-top: 1px solid #e3e3e3; padding-bottom: 30px }
.m-menus .hd-tel { text-align: center; display: block; margin: 50px 0 0 }
.m-menus .hd-tel .iconfont { font-size: 30px; margin-right: 10px; color: #000 }
.m-menus a { color: #333 }
.m-menus.active { right: 0 }
.m-menus ul { overflow-y: auto; border-bottom: 1px solid #e3e3e3 }
.m-menus .item:not(:first-child) { border-top: 1px solid #e3e3e3 }
.m-menus .item { cursor: pointer; transition: .3s; -webkit-transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; position: relative }
.m-menus .item .iconfont { position: absolute; right: 8%; top: 50%; transform: translateY(-50%); font-size: 15px; color: #999; font-weight: bold; transition: .3s }
.m-menus .item>a,
.m-menus h5 { display: block; padding: 0 8%; line-height: 54px; color: #333; position: relative; font-size: 16px }
.m-menus .xs-dropinfo { display: none; background: rgba(0,0,0,0.05); padding: 15px 50px; font-size: 14px }
.m-menus .xs-dropinfo a { color: #666; display: block; line-height: 40px }
.m-menus .trans { -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease }
.m-menus .open h5 { background: #F08300; color: #fff; border-top: 0 }
.m-menus .open h5 .iconfont { color: #fff }
.m-menus .open h5 .iconfont::before { content: "\e625" }
.m-menus .open h5>a,
.m-menus .open h5 p { font-weight: bold }
.m-menus .xs-dropinfo dl.br { border-right: 1px solid #ccc }
.m-menus .hd-tel { font-size: 26px; font-family: medium; color: #666 }
.basemore { border-radius: 2em; background: linear-gradient(to right, #F08300, #9D5600); width: 120px; height: 40px; line-height: 40px; text-align: center; color: #fff; display: inline-block; letter-spacing: 2px; box-sizing: content-box }
.basemore:hover { color: #fff; background: #FFA22F }
@media (max-width:768px) {
.basemore { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
.ibanner-box { background-color: #ccc; min-height: 100px }
.index-banner { position: relative; width: 100% !important; height: 8.9rem }
.index-banner .swiper-pagination { bottom:.6rem
}
.index-banner .swiper-pagination-bullet { background: rgba(255,255,255,0.3); opacity: 1; transition: .3s; margin: 0 8px; width: 4px; height: 12px; border-radius: 3px; display: inline-block }
.index-banner .swiper-pagination-bullet-active { background: #fff; height: 22px }
.index-banner .swiper-video { width: 100%; height: 100% }
.index-banner .swiper-video video { object-fit: cover }
.index-banner .swiper-video div[class^=time],
.index-banner .swiper-video div[class^=control] { display: none!important }
.index-banner .swiper-slide { background-position: center; background-size: cover; background-repeat: no-repeat }
.index-banner .content { position: absolute; left: 50%; top: 60%; transform: translateX(-50%) translateY(-50%); bottom: 0; width: 88%; max-width: 1600px }
.index-banner .textbox { color: #fff; width: 100% }
.index-banner .textbox h5 { font-size: 60px; margin-bottom: 10px; color: #fff }
.index-banner .textbox .en { font-size: 24px; color: rgba(255,255,255,0.6); text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,0.6); display: inline-block; padding-bottom:.25rem;
margin-bottom:.25rem
}
.index-banner .textbox .desc { font-size: 16px; color: #fff; margin-bottom:.55rem
}
.index-banner .textbox a.more { border-radius: 2em; background: linear-gradient(to right, #F08300, #9D5600); width: 120px; height: 40px; line-height: 40px; text-align: center; color: #fff; display: inline-block; letter-spacing: 2px; box-sizing: content-box }
.index-banner .textbox a.more:hover { color: #fff; background: #000 }
@media (max-width:768px) {
.index-banner .textbox a.more { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
@media (max-width:1440px) {
.index-banner { max-height: 70vh }
.index-banner .swiper-pagination { bottom:.3rem
}
}
@media (max-width:1200px) {
.index-banner .textbox .en { font-size:.26rem
}
.index-banner .textbox .entit,
.index-banner .textbox h5 { font-size:.66rem
}
}
@media (max-width:768px) {
.index-banner { height: auto }
.index-banner .swiper-pagination { bottom:.1rem
}
.index-banner .xsimg { width: 100% }
}
@media (max-width:640px) {
.index-banner { height: 400px }
.index-banner .content { top: 50% }
.index-banner .swiper-slide { overflow: hidden }
.index-banner .swiper-slide img { height: 100%; max-width: none; position: relative; left: 50%; transform: translateX(-50%) }
.index-banner .textbox {
padding:.3rem .1rem; text-align: center; line-height: 34px }
.index-banner .textbox .en { font-size: 16px }
.index-banner .textbox h5 { font-size: 32px }
.index-banner .textbox .desc { font-size: 12px }
}
@media (max-width:480px) {
.index-banner .swiper-pagination-bullet-active { height: 18px }
.index-banner .textbox { padding-top: 30px }
.index-banner .textbox .en { font-size: 14px; padding-bottom: 0rem; margin-bottom: 0rem }
.index-banner .textbox h5 { font-size: 30px }
.index-banner .textbox .desc { margin-bottom:.3rem
}
}
.ihd h2 { font-size: 36px; margin-bottom: 5px }
.ihd .en { font-size: 16px; color: #bbb; position: relative }
.ihd .en::after { content: ''; display: block; margin-top: 20px; width: 34px; height: 4px; background: #F08300 }
@media (max-width:1200px) {
.ihd h2 { font-size: 30px }
.ihd .en { font-size: 14px }
.ihd .en::after { margin-top: 15px }
}
@media (max-width:992px) {
.ihd h2 { font-size: 30px }
.ihd .en { font-size: 14px }
.ihd .en::after { margin-top: 10px }
}
@media (max-width:640px) {
.ihd h2 { font-size: 24px }
.ihd .en { font-size: 12px }
.ihd .en::after { margin-top: 10px; height: 2px }
}
@media (max-width:480px) {
.ihd h2 { margin-bottom: 0 }
}
.banner { position: relative; text-align: center; overflow: hidden; background-repeat: no-repeat; background-position: center; background-size: cover; height: 5.0rem }
.banner .content { width: 88%; max-width: 1600px; margin-left: auto; margin-right: auto; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 5; color: #fff; text-align: center }
.banner .en {
font-size:.72rem; font-weight: normal; margin-bottom:.1rem
}
.banner h3 {
font-size:.3rem; position: relative; padding-bottom:.24rem
}
.banner h3::after { width: 44px; height: 1px; background: #fff; position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; bottom: 0; content: '' }
.banner .img { width: 100%; visibility: hidden; max-width: none }
.banner .en { margin-top: 50px }
@media (max-width:992px) {
.banner { height: 5rem }
}
@media (max-width:640px) {
.banner .en { font-size:.5rem
}
}
@media (max-width:480px) {
.banner { height: 260px }
.banner .img { height: 260px }
}
.hd-search { color: #fff }
.hd-search .searchbtn { width: 30px; height: 30px; line-height: 30px; text-align: center; border-radius: 50%; background: linear-gradient(to right, #F08300, #9D5600); cursor: pointer }
.hd-search .searchbtn .iconfont { font-size: 16px }
.hd-search .searchbtn:hover { background: #FFA22F }
@media (min-width:993px) {
.hd-search .searchbtn { margin-top: 30px }
}
@media (max-width:992px) {
.hd-search .searchbtn { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; right: 70px }
}
.hd-search-box { position: fixed; left: 0; right: 0; background: #fff; padding: 20px 5%; display: none }
.hd-search-box .inner { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: end; box-pack: end; -webkit-justify-content: end; justify-content: end }
.hd-search-box form { border: 1px solid #F08300; max-width: 500px; display: block; position: relative; border-radius: 3px; width: 80%; min-width: 500px }
.hd-search-box .key { width: 90%; height: 40px; line-height: 40px; text-indent: 20px }
.hd-search-box .submit { position: absolute; right: 0; top: 50%; transform: translateY(-50%); border-left: 1px solid #F08300; text-align: center; width: 50px; font-size: 20px; line-height: 40px; height: 40px }
.hd-search-box .submit .iconfont { font-size: 20px }
.hd-search-box .submit:hover { background: #F08300; color: #fff }
.hd-search-box .close { float: right; height: 40px; line-height: 42px; width: 60px; text-align: center; font-size: 20px }
.hd-search-box .close:hover { color: #F08300 }
@media (min-width:993px) {
.hd-search-box { top: 90px }
}
@media (max-width:992px) {
.hd-search-box { top: 80px }
}
@media (max-width:768px) {
.hd-search-box { top: 50px }
.hd-search-box .inner { float: none; width: 100% }
.hd-search-box form { min-width: auto; width: 90% }
.hd-search-box .close { position: relative }
}
@media (max-width:480px) {
.hd-search-box { bottom: 0; height: auto }
}
.pagination { text-align: center; margin-top:.5rem;
display: block }
.pagination a { margin: 0 5px }
@media (max-width:480px) {
.pagination a { margin: 0 2px }
.pagination a>* { padding: 5px 12px }
}
.pagination a,
.pagination span { float: none; display: inline-block; cursor: pointer; color: #333; border-radius: 0!important; border: 0; background: #fdfdfd; padding: 10px 15px }
.pagination span,
.pagination a:hover,
.pagination span:hover,
.pagination a:focus,
.pagination span:focus { background: #F08300; color: #fff; border: 0 }
.basenav { position: relative; background: #fff; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
@media (min-width:769px) {
.basenav::before { content: ''; display: block; position: absolute; left: 0; background: linear-gradient(to right, #F08300, #9D5600); height: 100%; width: calc(50vw - 800px + 2.26rem); z-index: 1 }
}
@media (min-width:769px) and (max-width:1800px) {
.basenav::before { width: calc(6vw + 2.26rem) }
}
.basenav .inner { z-index: 55; position: relative; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; width: 88vw; margin-left: auto; margin-right: auto; max-width: 1600px; height: 0.8rem; box-sizing: content-box }
.basenav .inner h4 { height: 0.8rem; color: #fff; line-height: 0.8rem; font-size:.24rem;
width: 2.26rem; text-align: left }
.basenav .item { display: block; padding:0 .6rem;
height: 0.8rem; transition: .3s; white-space: nowrap; line-height: 1.5; min-width: 1.68rem; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-box-orient: vertical; box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-box-pack: center; box-pack: center; -webkit-box-align: center; box-align: center; -webkit-align-items: center; align-items: center }
.basenav .item .icon { display: block; margin:0 auto .1rem;
width:.5rem;
height:.5rem;
position: relative; overflow: hidden }
.basenav .item .icon i {
width:.5rem;
height:.5rem; display: block; background-size: contain; background-repeat: no-repeat; background-position: center; position: relative }
.basenav .item:hover em i,
.basenav .item.active em i { width: 1rem; left: -0.5rem; border-right:.5rem solid transparent;
-webkit-filter:drop-shadow(.5rem 0 0 #F08300);
filter:drop-shadow(.5rem 0 0 #F08300)
}
.basenav .item:hover,
.basenav .item.active { color: #F08300; }
.basenav .item.active { font-weight:bold; }
.basenav .item { padding:0 .5rem
}
.basenav .item:hover { color: #F08300 }
@media (max-width:992px) {
.basenav .item { padding: 0 }
}
@media (max-width:768px) {
.basenav { border-bottom: 1px solid #e5e5e5 }
.basenav .inner { padding:.1rem 0
}
.basenav .inner h4 { display: none }
.basenav .inner .item { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; color: #666; max-width: none; font-size: 12px }
.basenav .inner .item span {
padding:0 .1rem; display: block }
}
@media (max-width:480px) {
.basenav .inner { width: 100vw }
}
.basenav2 { background: #fff; box-shadow: 0 5px 5px rgba(0,0,0,0.02) }
.basenav2 .inner { margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
.basenav2 .item { width: 18%; max-width: 2.8rem; height: 0.8rem; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-box-orient: vertical; box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-box-pack: center; box-pack: center; -webkit-box-align: center; box-align: center; -webkit-align-items: center; align-items: center }
.basenav2 .item .icon { display: block; margin:0 auto .1rem;
width:.5rem;
height:.5rem;
position: relative; overflow: hidden }
.basenav2 .item .icon i {
width:.5rem;
height:.5rem; display: block; background-size: contain; background-repeat: no-repeat; background-position: center; position: relative }
.basenav2 .item:hover,
.basenav2 .active { background: linear-gradient(to right, #F08300, #9D5600); color: #fff }
.basenav2 .item:hover em i,
.basenav2 .active em i { width: 1rem!important; left: -0.5rem; border-right:.5rem solid transparent;
-webkit-filter:drop-shadow(.5rem 0 0 #fff);
filter:drop-shadow(.5rem 0 0 #fff)
}
@media (max-width:992px) {
.basenav2 .item { width: 20% }
}
@media (max-width:480px) {
.basenav2 .inner { width: 100% }
}
.basenav2._solutions .inner { -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center }
.basenav2._solutions .item { width: 25%; max-width: 2.5rem }
@media (max-width:360px) {
.basenav2._solutions .item { font-size: 13px }
}
.good-list { margin-left: -0.1rem; margin-right: -0.1rem; display: flex; flex-wrap: wrap }
.good-list>* { padding-left:.1rem;
padding-right:.1rem
}
.good-list li {
margin-bottom:.2rem; text-align: center }
.good-list li .inner { background: #fff; padding:.2rem;
transition: .3s }
@media (min-width:992px) {
.good-list li:hover .inner {
box-shadow:0 0 .2rem rgba(0,0,0,0.1); transform: translateY(-5px) }
}
.good-list li .info { padding:.2rem 0 }
.good-list li .sku { font-size: 20px; font-family: medium }
.good-list li .tit { color: #999; font-size: 16px; margin:.1rem 0 .2rem; overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
@media (max-width:640px) {
.good-list li .tit { font-size: 14px }
}
@media (max-width:480px) {
.good-list li .tit { font-size: 12px }
}
.good-list li .more { width: 120px; height: 40px; line-height: 40px; text-align: center; border-radius: 2em; margin-top:.2rem; border: 1px solid #F08300; color: #F08300; display: inline-block; font-size: 16px; transition: .3s; box-sizing: content-box }
@media (min-width:993px) {
.good-list li .more:hover { background: linear-gradient(to right, #F08300, #9D5600); color: #fff }
}
@media (max-width:992px) {
.good-list li .more { width: 90px; height: 28px; line-height: 28px; text-align: center; font-size: 12px }
}
.good-list-box { padding:.8rem 0 1.6rem
}
.news-list-box { margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px; padding-top: 1rem; padding-bottom: 1.3rem }
.news-list-box .hd { padding-bottom:.6rem
}
@media (min-width:993px) {
.news-list-box .hd { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
}
@media (max-width:992px) {
.news-list-box .hd { text-align: center }
.news-list-box .hd nav { margin-top:.4rem
}
}
@media (max-width:640px) {
.news-list-box .hd { padding-bottom:.4rem
}
}
.news-list-box nav a { border-radius: 2em; width: 120px; height: 40px; line-height: 40px; text-align: center; display: inline-block; border: 1px solid #F08300; color: #F08300; letter-spacing: 2px; transition: .3s; box-sizing: content-box; margin-left:.24rem
}
.news-list-box nav a:hover { background: linear-gradient(to right, #F08300, #9D5600); color: #fff }
@media (max-width:768px) {
.news-list-box nav a { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
.news-list-box nav a:hover { border-radius: 2em; background: linear-gradient(to right, #F08300, #9D5600); width: 120px; height: 40px; line-height: 40px; text-align: center; color: #fff; display: inline-block; letter-spacing: 2px; box-sizing: content-box }
.news-list-box nav a:hover:hover { color: #fff; background: #000 }
@media (max-width:768px) {
.news-list-box nav a:hover { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
.news-list-box nav .active { border-radius: 2em; background: linear-gradient(to right, #F08300, #9D5600); width: 120px; height: 40px; line-height: 40px; text-align: center; color: #fff; display: inline-block; letter-spacing: 2px; box-sizing: content-box }
.news-list-box nav .active:hover { color: #fff; background: #000 }
@media (max-width:768px) {
.news-list-box nav .active { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
@media (max-width:768px) {
.news-list-box .nav a { width: 90px; height: 30px; line-height: 30px; text-align: center }
}
@media (min-width:641px) {
.news-list { margin-left: -0.22rem; margin-right: -0.22rem }
.news-list>* { padding-left:.22rem;
padding-right:.22rem
}
}
.news-list li { margin-bottom:.6rem
}
.news-list .inner { position: relative; padding-top:.28rem;
border-top: 1px solid #e6e6e6 }
.news-list .inner::before { content: ''; display: block; position: absolute; top: -1px; left: 0; width: 0px; height: 1px; background: #F08300; transition: .3s }
.news-list .img { display: block; overflow: hidden; margin-bottom:.24rem;
position: relative }
.news-list .img img { -webkit-transition: .5s; -o-transition: .5s; -moz-transition: .5s; transition: .5s }
.news-list .img:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1) }
.news-list .tit { font-size: 16px; display: block; overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
.news-list .desc {
margin:.12rem 0; line-height: 24px; height: 48px; display: -webkit-box; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; word-wrap: break-word; white-space: normal !important; -webkit-line-clamp: 2; color: #666 }
@media (max-width:480px) {
.news-list .desc { line-height: 20px; height: 40px; margin:.14rem 0 .2rem
}
}
.news-list .date { color: #F08300; text-transform: uppercase }
.news-list li:hover .inner::before { width: 100% }
.news-list li:hover .tit { color: #F08300 }
.basetit { font-size: 36px }
@media (max-width:1360px) {
.basetit { font-size: 30px }
}
@media (max-width:992px) {
.basetit { font-size: 28px }
}
@media (max-width:640px) {
.basetit { font-size: 26px }
}
@media (max-width:480px) {
.basetit { font-size: 22px }
}
.igood-box { margin-bottom: 10px }
.igood-box .tit { font-size:.3rem
}
.igood-box .desc {
font-size:.2rem; margin: 15px 0 10px; color: #666 }
@media (max-width:992px) {
.igood-box .tit { font-size: 26px }
.igood-box .desc { font-size: 16px }
}
@media (max-width:480px) {
.igood-box .tit { font-size: 22px }
.igood-box .desc { font-size: 14px }
}
.igood-lgbox { position: relative; overflow: hidden; cursor: pointer; background-repeat: no-repeat; height: 5.8rem; background-position: center bottom; background-color: #d6dde7; background-size: auto 100% }
.igood-lgbox .content { width: 88%; max-width: 1600px; margin-left: auto; margin-right: auto; text-align: center; padding-top:.7rem
}
@media (max-width:1200px) {
.igood-lgbox .content {
padding:.8rem 0 .2rem; min-height: 1.2rem }
}
@media (max-width:992px) {
.igood-lgbox { background-size: auto 90%; background-color: #d8dfe7 }
}
@media (max-width:768px) {
.igood-lgbox { background-image: url('../images/ban_lg_a3.jpg') !important; background-size: auto 100% !important }
}
@media (max-width:480px) {
.igood-lgbox { background-image: url('../images/ban_lg_a2.jpg') !important; height: 6rem; background-size: 100% !important }
}
@media (max-width:360px) {
.igood-lgbox { height: 5.4rem }
}
.igood-xslist .item { width: 100%!important }
@media (max-width:640px) {
}
.igood-xsbox { margin-top: 10px; text-align: center; background: #e3e4e8 }
.igood-xsbox .igood-xsbox-inner { max-width: 1920px; background: #fff; margin-left: auto; margin-right: auto; padding: 0 2px }
.igood-xsbox .item { width: 50%; border: 2px solid #fff; border-top: 0; border-bottom: 0 }
.igood-xsbox .inner { background: #e3e4e8; overflow: hidden; margin: 0 5px; cursor: pointer }
.igood-xsbox .inner:hover img { transform: scale(1.2) }
.igood-xsbox .img { display: block; max-width: 60%; margin: 0 auto; overflow: visible!important }
.igood-xsbox .img img { transform: scale(1.1); transition: .3s }
.igood-xsbox .content { width: 88%; max-width: 1600px; margin-left: auto; margin-right: auto; margin-top:.7rem;
margin-bottom:.3rem;
position: relative; z-index: 55 }
@media (max-width:992px) {
.igood-xsbox .item .content { margin-top:.6rem
}
.igood-xsbox .item .desc { min-height: 46px }
}
@media (max-width:768px) {
.igood-xsbox .item { margin-top: 5px }
.igood-xsbox .item .img { max-width: 80% }
.igood-xsbox .item .content { margin-top:.7rem
}
.igood-xsbox .item .content .desc { font-size: 16px }
.igood-xsbox .item .content .desc { min-height: auto }
}
.icase-box { background: url('../images/icase_bg.jpg') no-repeat center center; background-size: cover; padding: 1.4rem 0 1rem; color: #fff; text-align: center }
.icase-box .desc { height: 3rem; margin:.4rem auto .5rem;
max-width: 8.7rem; line-height: 2; text-align: left; }
@media (max-width:1200px) {
.icase-box .desc { height: auto; padding-bottom: 1.6rem }
}
@media (max-width:640px) {
.icase-box .desc { padding-bottom: 1rem; line-height: 1.8 }
}
.icase-box nav { border-bottom: 2px solid #F08300 }
.icase-box nav .item { transition: .3s; position: relative; width: 25%; padding:.24rem .2rem;
color: #fff; font-size: 16px; background: rgba(255,255,255,0.2) }
.icase-box nav .item:nth-child(1)::before,
.icase-box nav .item:nth-child(2)::before,
.icase-box nav .item:nth-child(3)::before { content: ''; display: block; width: 1px; height: 76px; background: rgba(255,255,255,0.2); position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; right: 0 }
.icase-box nav .tit { line-height: 20px }
.icase-box nav .icon { display: block; margin:0 auto .1rem;
width:.5rem;
height:.5rem
}
.icase-box nav .item:Hover { background: #F08300 }
@media (min-width:640px) {
.icase-box nav { display: table; width: 100% }
.icase-box nav a { display: table-cell }
}
@media (max-width:1200px) {
.icase-box nav .item { font-size: 14px }
}
@media (max-width:639px) {
.icase-box nav { overflow: hidden; border-bottom: 0 }
.icase-box nav .item { width: 48%; float: left; margin: 1% }
.icase-box nav .item::before { display: none!important }
.icase-box nav .item .icon { width: 40px; height: 40px }
.icase-box nav .item .tit { min-height: 40px; display: block }
}
.inews-box { padding:.8rem 0 .4rem
}
@media (min-width:992px) {
.inews-box { display: -webkit-flex; display: flex; display: -webkit-box; display: box }
.inews-box .basetit { width: 20% }
.inews-box .news-list { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1 }
}
@media (max-width:991px) {
.inews-box .basetit {
margin-bottom:.6rem; text-align: center }
}
.ilogos-box { text-align: center; background: #f5f5f7; padding: 1rem 0 1.5rem }
.ilogos-box .basetit { margin-bottom:.6rem
}
.ilogos-box .logos { position: relative }
.ilogos-box .logos li { width: 23%; margin: 1%; float: left; transition: .3s; text-align: center }
.ilogos-box .logos li:hover { transform: translateY(-5px) }
.ilogos-box .logos img { width: 100%; }
.ilogos-box .logos li span { display: block; width: 100%; margin-top: 10px; font-size: 22px; color: #1d5bbb; }
@media (max-width:992px) {
.ilogos-box .logos li { width: 48% }
.ilogos-box .logos li span { font-size: 16px; }
}
@media (max-width:640px) {
.ilogos-box .logos { width: 92vw; position: relative; left: 50%; transform: translateX(-50%) }
}
.ilogos-box .btns { padding-top:.4rem
}
.ilogos-box .btns .btn_bg { border-radius: 2em; background: linear-gradient(to right, #F08300, #9D5600); width: 120px; height: 40px; line-height: 40px; text-align: center; color: #fff; display: inline-block; letter-spacing: 2px; box-sizing: content-box }
.ilogos-box .btns .btn_bg:hover { color: #fff; background: #000 }
@media (max-width:768px) {
.ilogos-box .btns .btn_bg { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
.ilogos-box .btns .btn_bg:hover { background: #0960a9 }
.ilogos-box .btns .btn_bor { border-radius: 2em; width: 120px; height: 40px; line-height: 40px; text-align: center; display: inline-block; border: 1px solid #F08300; color: #F08300; letter-spacing: 2px; transition: .3s; box-sizing: content-box; margin-left:.4rem
}
.ilogos-box .btns .btn_bor:hover { background: linear-gradient(to right, #F08300, #9D5600); color: #fff }
@media (max-width:768px) {
.ilogos-box .btns .btn_bor { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
.download-list { margin-bottom:.9rem
}
.download-list li { border-bottom: 1px solid #e6e6e6; padding:.3rem 0; cursor: pointer; position: relative }
.download-list li::after { content: ''; display: block; position: absolute; width: 0; height: 1px; background: #F08300; transition: .3s; bottom: -1px; left: 0 }
.download-list li .icon {
width:.28rem;
height:.28rem; background-image: url('../images/ic_pdf.jpg'); background-repeat: no-repeat; background-size: contain; background-position: center center; margin-right:.26rem;
display: inline-block }
.download-list li .tit { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; font-size:.2rem;
display: block; margin-right:.5rem;
overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
.download-list li .down {
font-size:.16rem; color: #666; padding-right:.24rem
}
.download-list li a { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
@media (max-width:1200px) {
.download-list li { height: 60px }
.download-list li .tit { font-size: 16px }
.download-list li .down { font-size: 14px }
}
@media (max-width:640px) {
.download-list li .icon { margin-right:.1rem
}
.download-list li .down { padding-right: 0; font-size: 12px }
}
@media (max-width:480px) {
.download-list li .tit { font-size: 14px }
}
@media (min-width:992px) {
.download-list li:hover::after { width: 100% }
.download-list li:hover .down,
.download-list li:hover .tit { color: #F08300 }
}
.articlebox { width: 88%; max-width: 1600px; margin-left: auto; margin-right: auto; max-width: 926px; background: #fff; padding:.4rem;
margin: 1.6rem auto 1.1rem }
.articlebox h1 { font-size: 30px; font-weight: bold; line-height: 40px; position: relative }
.articlebox h1::before { content: ''; display: block; width: 4px; height: 30px; background: #F08300; position: absolute; left: -0.4rem; top: 5px }
.articlebox .data { font-size: 16px; color: #999; margin-top:.2rem;
font-family: medium; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; margin-bottom:.2rem
}
.articlebox article { padding-bottom: 1.4rem; padding-top:.6rem;
font-size: 16px; color: #666; line-height: 2; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5 }
.articlebox article p { margin-bottom: 15px }
.articlebox article img { display: block; margin: 0 auto 15px }
@media (max-width:768px) {
.articlebox h1 { font-size: 28px; line-height: 32px }
.articlebox h1::before { content: ''; display: block; position: absolute; top: 4px; height: 28px }
}
@media (max-width:640px) {
.articlebox h1 { font-size: 22px }
.articlebox .date { font-size: 14px }
.articlebox article { line-height: 1.76; text-indent: 2em }
.articlebox article>* { margin-bottom:.3rem
}
}
@media (max-width:480px) {
.articlebox { width: 100%; margin-top: 70px }
.articlebox h1 { font-weight: normal }
.articlebox .data { margin-top:.3rem
}
.articlebox article { font-size: 15px }
}
.article-pnext { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; padding:.4rem 0
}
.article-pnext a { display: block }
.article-pnext .btn_bor { border-radius: 2em; width: 120px; height: 40px; line-height: 40px; text-align: center; display: inline-block; border: 1px solid #F08300; color: #F08300; letter-spacing: 2px; transition: .3s; box-sizing: content-box }
.article-pnext .btn_bor:hover { background: linear-gradient(to right, #F08300, #9D5600); color: #fff }
@media (max-width:768px) {
.article-pnext .btn_bor { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
.article-pnext .return { font-size: 16px; color: #666 }
.article-pnext .return:hover { color: #F08300 }
.article-pnext .return .iconfont { display: block; margin: 0 auto; text-align: center }
@media (max-width:480px) {
.article-pnext .return { font-size: 14px }
}
.good-content { padding: 2.6rem 0 1rem; background: #f5f5f7 }
.good-content .wrap { max-width: 1400px }
.good-content h2 { font-size: 36px; margin-bottom:.3rem;
font-weight: bold; font-family: medium }
.good-content .info { font-size: 16px; color: #666; line-height: 24/16; min-height: 1.2rem }
.good-content .zxbox { margin-top:.5rem
}
.good-content .zxbox .tip { color: #666; margin-top:.2rem
}
@media (max-width:992px) {
.good-content .zxbox { text-align: center; margin-top: 1rem }
}
@media (max-width:1200px) {
.good-content .swiperbox { margin-right: 10% }
}
@media (max-width:992px) {
.good-content .content { padding-left: 0; margin-top:.4rem
}
.good-content h2 { border-bottom: 0; margin-bottom:.1rem;
text-align: center }
}
@media (max-width:768px) {
.good-content .swiperbox { max-width: 100% }
}
@media (max-width:480px) {
.good-content { padding-bottom: 1rem; padding-top: 1.5rem }
.good-content h2 { font-size: 22px }
}
.swiperImgs img { width: 100% }
.swiperdots {
margin-top:.2rem;
padding:.2rem; border: 1px solid #e5e5e5 }
.swiperdots .swiper-slide { position: relative; cursor: pointer }
.swiperdots .swiper-slide::after { content: ''; display: block; position: absolute; width: 100%; height: 100%; border: 2px solid transparent; left: 0; top: 0; transition: .3s }
.swiperdots .swiper-slide-thumb-active::after { border-color: #F08300 }
.good-detail { padding-bottom: 1.5rem }
.good-detail .wrap { max-width: 1400px }
.good-detail .nav { border-bottom: 1px solid #e5e5e5 }
.good-detail .nav .wrap { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
.good-detail .nav .item { font-size: 20px; color: #666; line-height: 66px; display: block; padding:0 .3rem;
margin-right:.3rem;
position: relative }
.good-detail .nav .item:hover { color: #F08300 }
.good-detail .nav .active { color: #F08300 }
.good-detail .nav .active::after { content: ''; display: block; position: absolute; width: 100%; bottom: -1px; height: 3px; background: #F08300; left: 0 }
@media (max-width:640px) {
.good-detail .nav .item { font-size: 18px; line-height: 50px; padding:0 .2rem
}
.good-detail .nav .s2 { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
.good-detail .nav .s2 .item { padding: 0; margin: 0 }
}
.good-detail .content .introduce { padding-top:.8rem
}
.good-detail .content .introduce dt {
font-size:.3rem;
padding-left:.24rem; line-height: 1; font-weight: normal; margin-bottom:.4rem;
position: relative }
.good-detail .content .introduce dt::before { content: ''; display: block; position: absolute; width: 3px; height: 90%; top: 5%; left: 0; background: #F08300 }
.good-detail .content .introduce dd {
padding-left:.24rem; color: #666; line-height: 30/16; font-size: 16px }
@media (max-width:1200px) {
.good-detail .content .introduce dt { font-size: 24px }
}
@media (max-width:992px) {
.good-detail .content .introduce dd { font-size: 14px }
}
@media (max-width:640px) {
.good-detail .content .introduce dt { font-size: 17px; margin-bottom:.2rem
}
}
.caes-banner { position: relative; background-repeat: no-repeat; background-size: cover; background-position: center; height: 7.1rem; color: #666 }
.caes-banner .bg { display: none }
.caes-banner h2 { font-size:.36rem;
margin-bottom:.24rem
}
.caes-banner .desc { font-size: 16px; line-height: 1.6; margin-bottom:.6rem
}
@media (min-width:768px) {
.caes-banner .wrap { position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 5; max-width: 1400px; width: 88%; margin-left: auto; margin-right: auto }
.caes-banner .content { max-width: 610px; width: 50% }
.caes-banner .tip { left: 0; width: 100%; position: absolute; bottom:.4rem
}
.caes-banner .tip .inner { max-width: 1400px; display: block; width: 88%; margin-left: auto; margin-right: auto }
}
.caes-banner .btns { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
.caes-banner .btns .basemore { margin-right: 24px }
@media (max-width:768px) {
.caes-banner { height: auto; background: #dddddd; padding-bottom:.3rem
}
.caes-banner .bg { display: block; width: 100% }
.caes-banner .content { padding:.5rem 0
}
.caes-banner .tip { margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px }
}
.basetitle { text-align: center; font-size: 30px; position: relative }
.basetitle::after { content: ''; display: block; width: 40px; height: 4px; background: #F08300; margin:.2rem auto 0
}
@media (max-width:1200px) {
.basetitle { font-size: 26px }
}
@media (max-width:640px) {
.basetitle { font-size: 24px }
}
.c-framework {
padding:.9rem 0 1.1rem; margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px }
.c-framework .bd {
padding-top:.5rem; text-align: center }
.c-framework .bd .img { display: block; margin: 0 auto }
.c-trait { background: #f5f5f7; padding:.8rem 0 1.1rem
}
.c-trait .bd {
padding-top:.8rem; text-align: center; margin-left: -0.18rem; margin-right: -0.18rem }
.c-trait .bd>* { padding-left:.18rem;
padding-right:.18rem
}
.c-trait .bd .ic { width: 60px; height: 60px; background-repeat: no-repeat; background-size: contain; background-position: center; display: block; margin: 0 auto }
.c-trait .bd .ic1 { background-image: url('../images/ic_case_1.png') }
.c-trait .bd .ic2 { background-image: url('../images/ic_case_2.png') }
.c-trait .bd .ic3 { background-image: url('../images/ic_case_3.png') }
.c-trait .bd h4 { font-size: 20px; margin:.2rem 0 .1rem
}
.c-trait .bd .desc { font-size: 16px; line-height: 24px; color: #666; min-height: 96px }
.c-trait .bd .inner { background: #fff; padding:.44rem 6% .2rem
}
@media (max-width:1200px) {
.c-trait .bd .desc { font-size: 14px; line-height: 22px }
}
@media (max-width:992px) {
.c-trait .bd li { margin-bottom:.2rem
}
.c-trait .bd li .desc { font-size: 16px; min-height: auto; padding-bottom:.4rem
}
}
.c-scenario { padding:.8rem 0 .9rem
}
.c-effect { background: #f5f5f7; padding:.8rem 0 0
}
.c-effect .bd {
margin-top:.7rem; margin-left: -0.43rem; margin-right: -0.43rem }
.c-effect .bd>* { padding-left:.43rem;
padding-right:.43rem
}
.c-effect li { text-align: center; padding-bottom: 1rem }
.c-effect li div[class^=time],
.c-effect li div[class^=control] { display: none!important }
.c-effect li .imgbox { display: block; position: relative; border-radius:.2rem;
cursor: pointer; overflow: hidden }
.c-effect li .imgbox img { -webkit-transition: .5s; -o-transition: .5s; -moz-transition: .5s; transition: .5s }
.c-effect li .imgbox:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1) }
.c-effect li .video { width: 100%; height: 100%; position: absolute!important; left: 0; top: 0; z-index: 5 }
.c-effect li .iconfont { position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 5; color: #fff; font-size:.5rem;
z-index: 1 }
.c-effect li .tit { font-size: 24px; margin-top:.3rem
}
@media (max-width:640px) {
.c-effect li .iconfont { font-size:.7rem
}
.c-effect li .tit { font-size: 20px }
}
.c-goods { width: 88%; max-width: 1600px; margin-left: auto; margin-right: auto; padding:.8rem 0 .8rem
}
.c-goods .bd { margin-top:.5rem
}
.c-goods li { text-align: center; margin-bottom:.2rem;
transition: .3s; padding-top:.12rem;
padding-bottom:.2rem
}
@media (min-width:992px) {
.c-goods li:hover { transform: translateY(-5px); box-shadow: 0 0 10px rgba(0,0,0,0.05) }
.c-goods li:hover .title { color: #F08300 }
}
.c-goods li .info { padding-top:.16rem
}
.c-goods li .img { display: block; overflow: hidden }
.c-goods li .img img { -webkit-transition: .5s; -o-transition: .5s; -moz-transition: .5s; transition: .5s }
.c-goods li .img:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1) }
.c-goods li .title { font-size: 20px; display: block; margin-bottom:.1rem;
font-family: medium }
.c-goods li .desc { font-size: 16px; color: #999; margin-bottom: 0!important }
.swiper-scenario {
padding-bottom:.54rem;
margin-top:.6rem; margin-left: auto; margin-right: auto }
.swiper-scenario .swiper-pagination { bottom: 0 }
.swiper-scenario .swiper-pagination .swiper-pagination-bullet {
width:.38rem; height: 2px; background-color: #cccccc; opacity: 1; border-radius: 0; cursor: pointer }
.swiper-scenario .swiper-pagination .swiper-pagination-bullet-active { background: #F08300 }
.swiper-scenario li { width:calc((33.33% - .4rem));
margin:0 .2rem
}
.swiper-scenario li .slide-inner { position: relative; overflow: hidden }
.swiper-scenario li .img { background-repeat: no-repeat; background-size: cover; background-position: center; display: block; transition: .3s }
.swiper-scenario li .img ._bg { width: 100%; display: block; visibility: hidden }
.swiper-scenario li .tit { position: absolute; left: 0; right: 0; bottom: 0; height: 48px; line-height: 48px; background: rgba(0,0,0,0.6); color: #fff; text-align: center; font-size: 16px; transition: .3s }
.swiper-scenario.col1 li { width: 100%; margin: 0 }
.swiper-scenario.col1 li .slide-inner { max-width: 650px; margin-left: auto; margin-right: auto }
.swiper-scenario.col2 li { width: 50%; margin: 0 }
.swiper-scenario.col2 li:nth-child(1) { padding-right:.43rem
}
.swiper-scenario.col2 li:nth-child(2) { padding-left:.43rem
}
@media (min-width:992px) {
.swiper-scenario li:hover .img { transform: scale(1.1) }
.swiper-scenario li:hover .tit { transform: translateY(105%) }
}
@media (max-width:1590px) {
.swiper-scenario li { width:calc((33.33% - .2rem));
margin:0 .1rem
}
}
@media (max-width:992px) {
.swiper-scenario li { width:calc((50% - .2rem))
}
}
@media (max-width:480px) {
.swiper-scenario li { width: 100% !important; margin: 0 !important; padding: 0!important }
}
.map-box {
margin-top:.9rem; margin-bottom: 1rem; margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px; background-color: #ccc; position: relative }
.map-box .map { height: 5.6rem }
.map-box h3 { font-size: 30px; margin-bottom: 10px }
.map-box .inner {
padding:.5rem .4rem; background: #F08300; color: #fff }
@media (min-width:992px) {
.map-box .inner .content { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
}
.map-box .info { line-height: 1.6 }
@media (min-width:992px) {
.map-box .address { position: absolute; bottom: -0.5rem; left: 50%; width: 50vw; background: #F08300 }
.map-box .content { max-width: 685px }
}
@media (max-width:992px) {
.map-box { width: 100%; margin-top: 0 }
}
@media (max-width:768px) {
.map-box { text-align: center }
.map-box .info {
margin-bottom:.5rem;
padding-top:.1rem; display: inline-block; text-align: left }
}
@media (max-width:480px) {
.map-box h3 { font-size: 22px }
}
.center-box { margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px; margin-bottom: 1.2rem }
.yxcenter-box { padding-bottom: 1.2rem; margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px }
.yxcenter-box h2 { font-size:.36rem;
margin-bottom:.5rem
}
.yxcenter-box .bd { margin-left: -0.1rem; margin-right: -0.1rem }
.yxcenter-box .bd>* { padding-left:.1rem;
padding-right:.1rem
}
.yxcenter-box li { margin-bottom:.4rem
}
@media (min-width:993px) {
.yxcenter-box li:nth-child(3n+1) { clear: left }
}
@media (min-width:768px) and (max-width:992px) {
.yxcenter-box li:nth-child(2n+1) { clear: left }
}
.yxcenter-box .inner { border: 1px solid #e6e6e6; padding:.38rem
}
.yxcenter-box .inner h3 { font-size: 18px; margin-bottom:.14rem
}
.yxcenter-box .inner .info { line-height: 1.6; color: #666 }
.yxcenter-box .inner:hover { background: #F08300; color: #fff }
.yxcenter-box .inner:hover .info { color: #fff }
@media (max-width:480px) {
.yxcenter-box li { margin-bottom: 15px }
}
.abouthd { font-size:.36rem;
margin-bottom:.4rem
}
.pz-box { background: #f5f5f7; padding: 1rem 0 1.2rem }
.pz-box .row { margin-left: -0.165rem; margin-right: -0.165rem }
.pz-box .row>* { padding-left:.165rem;
padding-right:.165rem
}
.pz-box .imgbox { background: #e1e1e1; padding:.25rem;
height: 386px; position: relative }
.pz-box .imgbox img { position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 5 }
.pz-box .imgbox li { display: none }
.pz-box .imgbox li.active { display: block }
.pz-box .navbox { height: 390px; overflow-y: auto }
.pz-box .navbox::-webkit-scrollbar {
width:4px;
height:4px
}
.pz-box .navbox::-webkit-scrollbar-thumb {
border-radius:5px;
background:#F08300
}
.pz-box .navbox::-webkit-scrollbar-track {
border-radius:5px;
background:#c8c8c8
}
.pz-box .navbox li { width: 48%; background: #fff; margin-right: 2%; float: left; margin-bottom: 20px; border: 1px solid #e3e3e3; height: 48px; line-height: 48px; padding-left:.24rem;
font-size: 16px; color: #666; transition: .3s; cursor: pointer; overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
.pz-box .navbox li.active,
.pz-box .navbox li:hover { background: #F08300; color: #fff; border-color: #F08300 }
@media (max-width:992px) {
.pz-box .navbox { margin-top:.4rem
}
}
@media (max-width:768px) {
.pz-box .navbox li { width: 100%; float: none!important }
}
@media (max-width:640px) {
.pz-box .navbox { height: 370px; width: 92vw; padding-right: 4vw }
.pz-box .navbox li { margin-bottom: 5px }
}
.introduce-box { padding: 1.5rem 0; position: relative }
.introduce-box::before,
.introduce-box::after { content: ''; display: block; position: absolute; max-width: 40%; z-index: -1 }
.introduce-box::before { width: 6.88rem; height: 1.84rem; background-image: url('../images/elte2.jpg'); background-repeat: no-repeat; background-size: contain; background-position: center center; background-position: top right; right: 0; top: 0 }
.introduce-box::after { width: 7.6rem; height: 2.1rem; background-image: url('../images/elte.jpg'); background-repeat: no-repeat; background-size: contain; background-position: center center; background-position: left bottom; left: 0; bottom: 0 }
.introduce-box .info { font-size: 16px; line-height: 1.9; color: #666 }
@media (max-width:992px) {
.introduce-box .content { margin-bottom:.5rem
}
.introduce-box .img { display: block; margin: 0 auto }
}
@media (max-width:640px) {
.introduce-box { padding: 1rem 0 1.3rem }
.introduce-box::before,
.introduce-box::after { max-width: 60% }
}
.company-box { margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px; margin-bottom: 1rem }
.company-box .inner { position: relative }
@media (min-width:992px) {
.company-box .inner .data,
.company-box .inner .map { width: 49% }
.company-box .inner .map { position: absolute; right: 0; top: 50%; transform: translateY(-50%); max-height: none; z-index: -1 }
}
.company-box .data { position: relative; background: #F08300; color: #fff; padding:.5rem 0 0 35px
}
.company-box .data::before { content: ''; display: block; position: absolute; width: 100vw; height: 100%; top: 0; right: 0; background: #F08300 }
.company-box .data em { display: inline-block }
.company-box .data li { float: left; width: 50%; margin-bottom:.5rem;
position: relative }
.company-box .data li::before { content: ''; display: block; position: absolute; width: 16px; height: 4px; background: #fff; left: -35px; top: 10px }
.company-box .data .tit { font-size: 16px }
.company-box .data .val { font-size: 48px; font-family: medium }
@media (max-width:992px) {
.company-box .data .val { font-size: 34px }
}
@media (max-width:640px) {
.company-box { width: 100% }
.company-box .data { margin-left: 0; margin-bottom:.5rem
}
.company-box .data li { margin-bottom:.6rem
}
.company-box .data li::before { width: 5px; left: -10px }
.company-box .data .desc { font-size: 12px }
.company-box .map { display: block; margin: 0 auto; max-width: 88% }
}
.fz-box {
padding:.9rem 0 1.2rem; text-align: center }
.fz-box .ihd { margin-bottom:.9rem
}
.fz-box .ihd .en:after { margin-left: auto; margin-right: auto }
.fz-box .hisotry { position: relative }
.fz-box .hisotry::after { content: ''; display: block; position: absolute; width: 100%; height: 1px; background-color: #f5f5f5; top: 80px }
.fz-box .hisotry .inner { width: 96%; max-width: 1460px; margin-left: auto; margin-right: auto; position: relative }
.fz-box .swiper-button-next,
.fz-box .swiper-button-prev { color: #fff; border-radius: 50%; bottom: auto; top: 85px; width: 36px; height: 36px; background: #dcdcdc }
.fz-box .swiper-button-next::after,
.fz-box .swiper-button-prev::after { font-size: 14px }
.fz-box .swiper-button-next:hover,
.fz-box .swiper-button-prev:hover { background: #F08300 }
@media (max-width:480px) {
.fz-box .swiper-button-next,
.fz-box .swiper-button-prev { width: 28px; height: 28px }
}
.fz-box .swiper-button-next { right: 0px }
.fz-box .swiper-button-prev { left: 0px }
.historySwiper {
padding-bottom:.5rem; padding-top: 20px }
.historySwiper li { width: 14.28571429%; cursor: pointer }
.historySwiper li .year { font-size: 24px; font-family: medium; color: #666; transition: .3s; line-height: 30px; height: 30px; position: relative; top: 10px }
.historySwiper li .year:hover { color: #F08300 }
.historySwiper li .year::after { content: ''; display: block; width: 8px; height: 8px; background: #dcdcdc; border-radius: 50%; position: absolute; left: 50%; transform: translateX(-50%); bottom: -29px; border: 4px solid #fff; box-sizing: content-box; z-index: 5; transition: .3s }
.historySwiper .active .year { color: #F08300 }
.historySwiper .active .year::after { background: #fff; border: 2px solid #F08300 }
@media (max-width:1200px) {
.historySwiper li { width: 20% }
}
@media (max-width:992px) {
.historySwiper { padding-bottom: 1.5rem }
.historySwiper li .info { font-size: 14px }
}
@media (max-width:768px) {
.historySwiper { width: 100% }
}
@media (max-width:640px) {
.historySwiper li { width: 25%; padding:0 .3rem
}
.historySwiper li .year { font-size: 20px; padding-top: 15px }
}
.fz-infobox { margin-left: auto; margin-right: auto; width: 88%; max-width: 1400px; margin-bottom:.9rem;
text-align: left }
@media (min-width:768px) {
.fz-infobox .leftbox { text-align: left; width: 50% }
.fz-infobox .img { position: absolute; right: 0; top:.24rem;
width: 46%; bottom: 0; background-repeat: no-repeat; background-size: cover; background-position: center }
.fz-infobox .img img { visibility: hidden }
}
.fz-infobox .item { position: relative; display: none }
.fz-infobox .item.active { display: block }
.fz-infobox .year { font-size: 1.4rem; font-family: medium; line-height: 1; color: #F08300; background-image: -webkit-linear-gradient(left, #0764ce, #1690e1); background-image: linear-gradient(left, #0764ce, #1690e1); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: inline-block; text-shadow: 5px 5px .08em rgba(10,120,216,0.3) }
.fz-infobox .info { font-size: 16px; color: #666; line-height: 26px; margin-top:.6rem;
height: 240px; overflow-y: auto; padding-right:.5rem
}
.fz-infobox .info::-webkit-scrollbar {
width:4px;
height:4px
}
.fz-infobox .info::-webkit-scrollbar-thumb {
border-radius:5px;
background:#F08300
}
.fz-infobox .info::-webkit-scrollbar-track {
border-radius:5px;
background:#c8c8c8
}
.fz-infobox .info p { position: relative; padding-left:.25rem;
margin-bottom: 10px }
.fz-infobox .info p::before { width: 8px; height: 8px; background-color: #000; border-radius: 50%; left: 0; top: 9px; content: ''; display: block; position: absolute }
@media (max-width:992px) {
.fz-infobox .year { font-size: 70px }
.fz-infobox .info { font-size: 14px; line-height: 24px; margin-top:.4rem
}
.fz-infobox .info p { margin-bottom: 5px }
.fz-infobox .info p::before { width: 4px; height: 4px }
}
@media (max-width:768px) {
.fz-infobox .img { margin-top:.5rem
}
}
.fz-box { position: relative }
@media (max-width:768px) {
.fz-box { padding-bottom: 0 }
.fz-box .bd { position: relative; padding-top: 150px }
.fz-box .hisotry { position: absolute; top: 0; left: 0; right: 0 }
.fz-box .fz-infobox .year { display: none }
}
.sub-menus { width: 50px; border-radius: 50px; position: fixed; right: 0; top: 30%; z-index: 999 }
@media (max-width:640px) {
.sub-menus { display: none }
}
.sub-menus .item { height: 50px; cursor: pointer; position: relative; transition: .3s; background: #F08300; margin-bottom: 2px; border-radius: 4px 0 0 4px }
.sub-menus .item:hover { background: #FFA22F }
.sub-menus .telbox .tel { height: 50px; line-height: 50px; background: #F08300; font-family: medium; width: 182px; text-align: center; position: absolute; left: 52px; top: 0; color: #fff; font-size: 24px }
.sub-menus .telbox:hover { transform: translateX(-184px) }
.sub-menus .ic { width: 100%; height: 50px; display: inline-block; overflow: hidden; position: relative; z-index: 55; background-size: 800px }
.sub-menus .ic1 { background: url('../images/ic_sub1.png') no-repeat center }
.sub-menus .ic2 { background: url('../images/ic_sub2.png') no-repeat center }
.sub-menus .ic3 { background: url('../images/ic_sub3.png') no-repeat center }
.sub-menus .ic4 { background: url('../images/ic_sub4.png') no-repeat center }
.sub-menus .pop { position: absolute; right: 0; top: 50%; opacity: 0; filter: alpha(opacity=0); transform: translate(43px, -50%) scale(0); transition: .3s }
.sub-menus .pop .inner { position: relative }
.sub-menus .pop .inner::after { content: ''; display: block; position: absolute; right: -20px; width: 0; height: 0; border: 10px solid transparent; border-left: 10px solid #F08300; top: 50%; margin-top: -5px }
.sub-menus .pop .info { background: #fff; padding: 26px 0; font-size: 16px }
.sub-menus .pop .code-wrap { border: 10px solid #F08300; border-radius: 6px }
.sub-menus .pop .code { width: 150px; max-width: none; height: 150px }
.sub-menus .item:hover .pop { display: block; transform: translate(-75px, -50%) scale(1); opacity: 1; filter: alpha(opacity=100) }
.pop-sub-form { width: 90vw!important; max-width: 600px }
.sub-form {
padding:.5rem; display: none }
.sub-form form { display: block }
.sub-form ul { padding-bottom:.22rem
}
.sub-form .item {
margin-bottom:.2rem; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; min-height: 48px; position: relative }
.sub-form .item .info { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1 }
.sub-form .item .input { height: 46px; line-height: 46px; border: 1px solid #f6f6f6; background-color: #f6f6f6; padding:.16rem;
border-radius: 4px; font-size: 16px; display: block; width: 100% }
.sub-form .item .input:focus { background: #fff; border-color: #F08300 }
.sub-form .item label { display: block; width: 54px; font-size: 16px; font-weight: normal }
.sub-form .item .area { height: 158px; line-height: 1.8; padding:.16rem
}
.sub-form .item .err { color: #f00; position: absolute; top: 5px; right: 5px; font-size: 12px; opacity: .9 }
.sub-form .submit { border-radius: 2em; background: linear-gradient(to right, #F08300, #9D5600); width: 120px; height: 40px; line-height: 40px; text-align: center; color: #fff; display: inline-block; letter-spacing: 2px; box-sizing: content-box; display: block; margin: 0 auto }
.sub-form .submit:hover { color: #fff; background: #000 }
@media (max-width:768px) {
.sub-form .submit { width: 90px; height: 32px; line-height: 32px; text-align: center; letter-spacing: 0 }
}
@media (max-width:640px) {
.sub-form { padding:.4rem .3rem
}
.sub-form .item label { font-size: 14px; width: 40px }
.sub-form .item .input { font-size: 14px }
}
.cover-box { position: relative; display: block; overflow: hidden }
.cover-box .coverimg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1; transition: transform .6s ease 0s }
.cover-box ._bg { width: 100%; visibility: hidden; display: block }
@media (min-width:992px) {
.cover-box:hover .cover-tip { opacity: 1; filter: alpha(opacity=1) }
.cover-box:hover .coverimg { transform: scale(1.05, 1.05) }
}
.cover-tip { width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: 0; filter: alpha(opacity=0); transition: all .4s ease 0s; z-index: 3 }
.cover-tip .bgbox { display: block; width: 100%; height: 100%; background-color: #000; opacity: .6; filter: alpha(opacity=60) }
.cover-tip .stit { font-size: 16px; line-height: 30px; width: 100%; text-align: center; position: absolute; left: 0; top: 50%; margin-top: -15px; color: #fff }
.cover-tip .stit { font-size: 16px; line-height: 30px; width: 100%; text-align: center; position: absolute; left: 0; top: 50%; margin-top: -15px; color: #fff }
.cover-tip .line { display: inline-block; width: 100px; height: 1px; background-color: #f2f2f2; position: absolute; left: 50%; margin-left: -50px; transition: all .6s ease 0s }
.cover-tip .linet { top: 0 }
.cover-tip .lineb { bottom: 0 }
.cover-tip:hover .line { width: 6px; margin-left: -3px; opacity: .6; filter: alpha(opacity=60) }
.BMap_cpyCtrl,
.anchorBL { display: none }
#map label,
#map img { max-width: none; max-height: none }
.swiperProduct { padding-bottom:.3rem;
margin-top:.3rem
}
.swiperProduct li { padding-bottom:.3rem
}
.swiperProduct li .desc {
padding-left:.3rem;
padding-right:.3rem; overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
@media (min-width:1500px) {
.swiperProduct li { width:calc(25% - .2rem);
margin:0 .1rem
}
}
@media (max-width:1590px) {
.swiperProduct li { width:calc(33.33% - .2rem);
margin:0 .1rem
}
}
@media (max-width:768px) {
.swiperProduct li { width:calc((50% - .3rem));
margin:0 .15rem
}
}
@media (max-width:480px) {
}
.iswiperGood .swiper-button-prev { left: 70px }
.iswiperGood .swiper-button-next { right: 70px }
.solutions-list li { background: #fff; margin-bottom:.36rem
}
@media (min-width:640px) {
.solutions-list li { display: flex; align-items: stretch }
.solutions-list li .img { max-width: 440px; width: 38% }
.solutions-list li .info { flex: 1 }
}
.solutions-list li .info {
padding:.4rem .8rem; display: flex; justify-content: center; flex-direction: column }
@media (max-width:1200px) {
.solutions-list li .info { padding:.3rem .4rem
}
}
.solutions-list li:hover { box-shadow: 0 0 10px rgba(0,0,0,0.1) }
.solutions-list li:hover .tit { color: #086cd3 }
.solutions-list .tit { display: block; font-size:.3rem;
margin-bottom:.2rem
}
@media (max-width:1200px) {
.solutions-list .tit { font-size: 22px }
}
.solutions-list .desc { font-size: 16px; color: #666; line-height: 30px; height: 90px; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 3; margin-bottom:.6rem
}
@media (max-width:1200px) {
.solutions-list .desc { margin-bottom:.3rem
}
}
@media (max-width:768px) {
.solutions-list .desc { line-height: 26px; height: 78px }
}
.solutions-list .more { border-radius: 2em; color: #fff; background: #086cd3; background: linear-gradient(90deg, #086cd3, #158ee1); font-size: 16px; display: block; height: 40px; line-height: 40px; width: 120px; text-align: center }
.solutions-list .more:hover { background: #086cd3 }
@media (max-width:768px) {
.solutions-list .more { width: 110px; height: 36px; line-height: 36px; text-align: center }
}
