@charset "utf-8"; @import '../css/bootstrap.min.css'; @import '../css/font-awesome.css'; @import '../css/iconfont.css'; @import '../css/animate.min.css'; body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, select, th, td { padding: 0; margin: 0; color: #4e4e4e; font-size: 16px; font-family: "Arial" } h1, h2, h3, h4, h5, h6, button, input, select, textarea { font-size: 100% } address, cite, dfn, em, var { font-style: normal } small { font-size: 12px } span { display: inline-block } ul, ol { list-style-type: none; list-style-image: none } a { color: #4e4e4e; text-decoration: none; outline: none } a:hover { color: #0047b3; text-decoration: none } a:focus { text-decoration: none } sup { vertical-align: text-top } s { text-decoration: none } sub { vertical-align: text-bottom } legend { color: #000 } img { border: 0; vertical-align: middle;max-width:100%; } table { border-spacing: 0; border-collapse: collapse } div { zoom: 1 } body { max-width: 100%; margin: 0 auto } dt { font-weight: normal } .sep-container { width: 100%; max-width: 1400px; margin: 0 auto } .top-title { text-align: center; margin-bottom: 50px } .top-title.white .title { color: #fff } .top-title.white .title a { color: #fff } .top-title.white .title a:hover { color: #fff; transform: translateY(-5px) } .top-title.white .title::after { background: #fff } .top-title.white .title-des1 { color: #fff } .top-title.white .title-des { color: rgba(255,255,255,0.8) } .top-title.white .title-des p { color: rgba(255,255,255,0.8) } .top-title.white .title-des p a { color: rgba(255,255,255,0.8); text-decoration: underline } .top-title.white .title-des p a:hover { text-decoration: none !important } .top-title.pd-0 { padding: 0 } .top-title.text-left { text-align: left } .top-title.text-left .title { text-align: left } .top-title.text-left .title a { text-align: left } .top-title.text-left .title::after { margin-left: 0; margin-right: 0 } .top-title.text-left .title-des { text-align: left } .top-title.text-left .title-des p { text-align: left } .top-title.text-left1 .title-des { text-align: left } .top-title.text-left1 .title-des p { text-align: left } .top-title.title-after .title { margin-bottom: 35px } .top-title.title-after .title1 { position: relative; z-index: 2 } .top-title.top-title1 .title::after { z-index: 1 } .top-title .title { font-size: 44px; color: #333; line-height: 54px; position: relative } .top-title .title a { font-size: 44px; color: #333; line-height: 54px; transition: all .3s; display: block } .top-title .title a:hover { color: #0047b3 } .top-title .title-des { font-size: 16px; line-height: 30px; color: #333; margin-top: 16px } .top-title .title-des p { font-size: 16px; line-height: 30px; color: #333; margin-bottom: 0 } .top-title .top-subtitle { color: #000; line-height: 30px; font-size: 24px; margin-top: 6px } .sep-header { width: 100%; position: fixed; left: 0; top: 0; z-index: 99999 } .sep-header.onss { box-shadow: 0 0 10px #eee } .sep-header.onss .head-top { display: none } .sep-header.onss .sep-mainnav .sep-container .nav-list .nav-ul>li>a { padding: 22px 0 } .sep-header .head-top { position: relative; background: #2b2e33 } .sep-header .head-top .sep-container { display: flex; position: relative; padding: 8px 0; justify-content: space-between; align-items: center } .sep-header .head-top .head-top-left { display: flex; align-items: center } .sep-header .head-top .head-top-left .head-con { display: flex; align-items: center } .sep-header .head-top .head-top-left .head-con .icon { display: flex; align-items: center; justify-content: center; border-radius: 50% } .sep-header .head-top .head-top-left .head-con .icon i { color: rgba(255,255,255,0.9); font-size: 16px } .sep-header .head-top .head-top-left .head-con .con { color: rgba(255,255,255,0.9); font-size: 16px; margin-left: 6px } .sep-header .head-top .head-top-left .head-con .con span { font-size: 16px; color: rgba(255,255,255,0.9) } .sep-header .head-top .head-top-left .head-con .con span a { font-size: 16px; color: rgba(255,255,255,0.9) } .sep-header .head-top .head-top-left .head-con .con span a:hover { text-decoration: underline } .sep-header .head-top .head-top-left>i { width: 1px; height: 15px; background: transparent; margin: 0 28px } .sep-header .head-top .head-top-right { align-items: center; display: flex } .sep-header .head-top .head-top-right .language { display: flex; align-items: center; justify-content: flex-end; height: 100% } .sep-header .head-top .head-top-right .language:hover .sanjiao { transition: all .3s; transform: rotate(180deg) } .sep-header .head-top .head-top-right .language:hover .langu-dis { display: block } .sep-header .head-top .head-top-right .language .langu { color: #4d4d4d; display: flex; line-height: 21px; align-items: center } .sep-header .head-top .head-top-right .language .langu .con { font-size: 16px; margin: 0 10px; color: #fff } .sep-header .head-top .head-top-right .language .langu .icon i { color: #fff } .sep-header .head-top .head-top-right .language .langu i { color: #fff; line-height: 21px; font-size: 16px } .sep-header .head-top .head-top-right .language .langu .iconfont { font-size: 26px; vertical-align: middle; line-height: 24px } .sep-header .head-top .head-top-right .language .langu-dis { position: absolute; z-index: 999; display: none; top: 80% } .sep-header .head-top .head-top-right .language .langu-dis ul li { text-indent: 10px; padding: 10px 0; background: #fff; border-bottom: 1px solid #ccc; line-height: 20px;padding-right: 10px; } .sep-header .head-top .head-top-right .language .langu-dis ul li a { color: #0047b3 } .sep-header .head-top .head-top-right .language .langu-dis ul li a span{ font-size:14px;padding: 0 0 0 20px;} .sep-header .head-top .head-top-right .language .langu-dis ul li a:hover { color: #333; text-decoration: none } .sep-header .head-top .head-top-right .language .langu-dis ul li a img { width: 20px; margin-right: 10px } .sep-header .head-top .head-top-right .search { display: inline-flex; align-items: center } .sep-header .head-top .head-top-right .search a { margin: 0 12px } .sep-header .head-top .head-top-right .search i { color: rgba(255,255,255,0.5); font-size: 16px; margin-right: 6px; display: inline-block; transition: all .3s } .sep-header .head-top .head-top-right .search i:hover { color: #fff } .sep-header .head-top .head-top-right .search span { color: #fff } .sep-header .sep-mainnav { width: 100%; transition: all .3s; background: #fff; position: relative } .sep-header .sep-mainnav .sep-container { display: flex; justify-content: space-between; align-items: center; z-index: 10 } .sep-header .sep-mainnav .sep-container .nav-list { transition: all .3s; display: flex; align-items: center } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul { display: flex; justify-content: space-between } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li { z-index: 8; z-index: 10; margin: 0 10px } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li:hover::after { display: block } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li.ios { position: relative } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .ul { background: #fff; position: absolute; top: 100%; left: 0; z-index: 999; min-width: 240px; float: left; display: none; border-top: 0; padding: 22px 0; border-top: 1px solid #f5f5f5 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .ul.ons li { width: 50%; float: left } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .ul li { width: 100%; margin: 0; padding: 0; text-align: left; white-space: nowrap; position: relative } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .ul li a { font-weight: normal; font-size: 16px; padding: 10px 12px; padding-left: 32px; text-align: left; color: #000; position: relative; line-height: 32px } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .ul li a i { display: block; width: 3px; height: 18px; position: absolute; left: 0; top: 11px; background: #0047b3; opacity: 0 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .ul li a:hover { border: none; color: #0047b3 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul { width: 100%; left: 0; top: 100%; z-index: 199; border-top: 1px solid #f5f5f5; position: absolute; z-index: 1; background: #fff; display: none } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item { display: flex; justify-content: space-between; width: 100% } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left { width: 100%; display: flex; justify-content: space-between } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left.ons { max-height: 10000px; box-shadow: 0 0 10px rgba(0,0,0,0.2) } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs { width: 40%; position: relative; padding: 60px 0 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) { border-left: 1px solid rgba(255,255,255,0.3); padding-left: 50px; width: 100% } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) .ul-boxs { display: none } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) .ul-boxs.active { display: block } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) .ul-boxs .lists-a { font-size: 16px !important; color: #333 !important; position: relative; padding-left: 22px !important; transition: all .3s } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) .ul-boxs .lists-a::after { content: ''; display: block; width: 5px; height: 5px; background: #666; border-radius: 50%; position: absolute; left: 0; top: 18px; transition: all .3s; display: none } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) .ul-boxs .lists-a:hover { color: #0047b3 !important } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) .ul-boxs .lists-a:hover::after { background: #0047b3 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) .ul-boxs .lists-a i { right: auto !important; left: -10px !important; display: block !important } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(2) .ul-boxs .right-item-box .lists-a { font-size: 16px !important } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(1) { width: 388px !important; min-height: 373px; border-right: 1px solid #f5f5f5 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(1) .lists .ul-boxs .lists-a { font-family: "Poppins-SemiBold"; padding: 8px 40px; font-size: 18px; width: 388px; margin-bottom: 4px; color: #333 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(1) .lists .ul-boxs .lists-a:hover { color: #0047b3 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(1) .lists .ul-boxs .lists-a i { top: 10px; font-size: 18px; display: none } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(1) .lists .ul-boxs .lists-a.active { color: #0047b3 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs:nth-child(1) .lists .ul-boxs .lists-a.active i { display: block } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs .lists { display: block; width: 100%; overflow: hidden } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs .lists .ul-boxs .lists-a { font-size: 16px; color: #333; line-height: 32px; display: block; transition: all .3s; padding-left: 16px; position: relative; width: 100%; padding: 5px 0 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs .lists .ul-boxs .lists-a i { position: absolute; right: 30px; top: 10px; font-size: 20px } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs .lists .ul-boxs .lists-a:hover { color: #0047b3 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs .lists .ul-boxs .lists-a.active { color: #0047b3 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .lis-boxs .lists.active { height: auto } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .right-item.active>a { color: #0047b3 !important } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .right-item.active .right-item-box { display: block } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .right-item-box { position: absolute; left: 47%; top: 64px; width: 400px; border-left: 1px solid rgba(255,255,255,0.3); padding-left: 50px; z-index: 333; display: none; min-height: 210px } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .right-item-box .lists-a { padding: 0 !important; font-size: 16px !important } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .left .right-item-box .lists-a::after { top: 13px !important } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .right { width: 353px; text-align: center; border: 1px solid #e6e6e6; height: 100%; margin-top: 30px; margin-right: 60px; overflow: hidden } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .right img { width: 90%; transition: all .3s } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .right a { display: none } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .right a.active { display: block } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul .head-pro-ul-item .right a:hover img { transform: scale(1.1) } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li.nav-active>a { color: #0047b3 } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li.nav-active>a::after { transform: scale(1) } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li:hover>a::after { transform: scale(1) } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li>a { display: block; box-sizing: border-box; color: #333; font-size: 18px; padding: 38px 0; position: relative; z-index: 10; transition: all .3s; text-transform: uppercase } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li>a::after { content: ''; display: block; height: 3px; background: #0047b3; width: 100%; position: absolute; left: 0; bottom: 0; transition: all .3s; transform: scale(0) } .sep-header .sep-mainnav .sep-container .logo img { width: 90% } .sep-header .sep-mainnav .sep-container .search { font-size: 16px; cursor: pointer; display: flex; align-items: center; transition: all .3s; position: relative; z-index: 10; justify-content: center; color: #0047b3; margin-left: 50px } .sep-header .sep-mainnav .sep-container .search:hover { background: none; transform: scale(1.1) } .sep-header .sep-mainnav .sep-container .search i { font-size: 24px; display: inline-block; color: #0047b3 } .sep-header .sep-mainnav .sep-container .search i:hover { color: #0047b3 } .sep-header .sep-mainnav .sep-container .search .s2 { /* transform: rotate(45deg);*/ display: none } .sep-header .sep-mainnav .sep-container .search.ons .s2 { display: inline-block } .sep-header .sep-mainnav .sep-container .search.ons .s1 { display: none } .sep-header .sep-mainnav .sep-container .nav-right { display: flex; align-items: center } .sep-header .sep-mainnav .sep-container .nav-right .contact { display: inline-block; font-size: 16px; color: #0047b3; padding: 0 20px; line-height: 34px; border: 1px solid #0047b3; border-radius: 50px; transition: all .3s } .sep-header .sep-mainnav .sep-container .nav-right .contact:hover { background: #0047b3; color: #fff } .sep-header .sep-mainnav .sep-container .nav-right .nav-bar { margin-left: 40px; font-size: 30px; color: #4d4d4d; transition: all .3s } .sep-header .sep-mainnav .sep-container .nav-right .nav-bar:hover { color: #0047b3 } .sep-header .sep-mainnav.nav-padding .content .logo { padding: 6px 0 } .sep-header .sep-mainnav.nav-padding .content .logo a img { max-width: 200px } .sep-header .nav-fixed { box-shadow: 0 0 5px 0 #0047b3 } .sep-header .nav-fixed .content .nav-list .search { display: block } .sep-header .nav-fixed .content .nav-list .search:hover i { color: #0047b3 } .sep-header .trans1 { transition: all .3s } .sep-header .gtj-t-r-deg { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg) } .sep-header .trans { -webkit-transition: all .4s; -moz-transition: all .4s; -ms-transition: all .4s; -o-transition: all .4s; transition: all .4s } .sep-header .forms { width: 100%; z-index: 103; position: absolute; left: 0; top: 100%; height: 0; overflow: hidden; display: inline-block; vertical-align: top; background: #0047b3 } .sep-header .forms.ons { height: 94px; padding: 25px 0 } .sep-header .forms .forms-boxs { display: block; width: 100%; overflow: hidden } .sep-header .forms .forms-boxs .sep-container { max-width: 1200px; margin: auto } .sep-header .forms form { line-height: normal; position: relative; width: 100%; overflow: hidden; float: right } .sep-header .forms form input[type='text'] { box-shadow: none; width: 100%; color: #fff; line-height: 26px; outline: none; display: inline-block; border: none; font-size: 18px; padding-left: 14px; padding-right: 40px; background: none; border-radius: 0; transition: All .4s ease-in-out; -webkit-transition: All .4s ease-in-out; -moz-transition: All .4s ease-in-out; -o-transition: All .4s ease-in-out; border-bottom: 1px solid #fff } .sep-header .forms form input[type='text']::-webkit-input-placeholder { color:#fff } .sep-header .forms form button[type='submit'] { width: 38px; height: 100%; display: block; border: none; background: none; outline: none; position: absolute; top: 0; right: 0 } .sep-header .forms form button[type='submit'] i { font-size: 18px; color: #fff; border-color: #fff; transition: all .3s; display: block } .sep-header .forms form button[type='submit'] i:after { background: #fff } .sep-header .forms form button[type='submit'] i:hover { transform: scale(1.1) } .padding-100 { padding: 100px 0 } .main-padding { padding: 90px 0 } .head-cover { width: 100%; height: 140px } .inner-cover { height: 145px } @keyframes loading { 0% { bottom:40px } 50% { bottom:50px } 100% { bottom:40px } } .fly-icons { display: block; -webkit-animation: loading 1s linear infinite alternate; -moz-animation: loading 1s linear infinite alternate; -ms-animation: loading 1s linear infinite alternate; -o-animation: loading 1s linear infinite alternate; animation: loading 1s linear infinite alternate } .swiper-pc { position: relative; overflow: hidden } .swiper-pc .swiper-pagination { position: absolute; left: auto !important; right: 70px !important; width: 80px !important; height: 100% !important; top: 0; z-index: 333; display: flex; flex-direction: column; justify-content: center } .swiper-pc .swiper-pagination .swiper-pagination-bullet { width: 5px; height: 5px; background: #fff; border-radius: 50%; opacity: 1; margin: 15px 0 !important; position: relative } .swiper-pc .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after { content: ''; display: block; width: 17px; height: 17px; border: 1px solid #fff; border-radius: 50%; position: absolute; left: -6px; top: -6px } .swiper-pc .pc-page { position: absolute; left: 0; bottom: 50px; width: 100% } .swiper-pc .pc-page .sep-container { justify-content: flex-start } .swiper-pc .pc-page .swiper-num { font-size: 18px; color: #fff; position: relative; z-index: 3; margin-left: 100px } .swiper-pc .pc-page .swiper-num .active { color: #0047b3; font-size: 18px } .swiper-pc .pc-page .swiper-num i { margin: 0 6px; font-style: normal; margin-right: 0 } .swiper-pc .pc-page .swiper-num span { font-size: 18px } .swiper-pc .banner-scroll { color: #fff; font-size: 26px; position: absolute; left: 49%; bottom: 40px; width: 100%; text-align: center; cursor: pointer; height: auto; display: block; transition: all .3s; z-index: 3333; width: auto } .swiper-pc .banner-scroll p { color: rgba(255,255,255,0.9); font-size: 16px } .swiper-pc .banner-scroll:hover { color: #0047b3 } .swiper-pc .banner-scroll i { font-size: 32px; margin-left: 10px; vertical-align: middle; display: block; color: #fff } .swiper-pc .banner-scroll .icon1 { color: rgba(255,255,255,0.8); font-size: 16px } .text-upper { text-transform: uppercase } .sep-banner { width: 100%; overflow: hidden; position: relative } .sep-banner .back img { width: 100% } .sep-banner .banner-main { width: 100%; position: absolute; left: 0; top: 0; height: 100% } .sep-banner .banner-main .back { display: block; width: 100%; height: 100% } .sep-banner .sep-container { position: relative; height: 100%; display: flex; align-items: center } .sep-banner .sep-container .banner-div { position: relative; max-width: 900px } .sep-banner .sep-container .banner-title { font-size: 56px; color: #fff; line-height: 74px; transition: all .3s; display: block; width: 700px } .sep-banner .sep-container .banner-title:hover { transform: translateY(-10px) } .sep-banner .sep-container .banner-subtitle { font-size: 22px; color: #fff; line-height: 32px; margin-bottom: 30px } .sep-banner .sep-container .banner-subtitle::before { content: ''; display: inline-block; width: 64px; height: 2px; background: #fff; vertical-align: middle; margin-right: 10px } .sep-banner .sep-container .banner-des { font-size: 18px; color: rgba(255,255,255,0.9); line-height: 30px; margin-top: 30px } .sep-banner .sep-container .banner-des p { font-size: 18px; color: rgba(255,255,255,0.9); line-height: 30px } .sep-banner .sep-container .banner-des p a { font-size: 18px; color: rgba(255,255,255,0.9); line-height: 30px; text-decoration: underline } .sep-banner .sep-container .banner-des p a:hover { text-decoration: none } .sep-banner .sep-container .banner-more { display: inline-block; margin-top: 40px } .sep-banner .sep-container .banner-more span, .sep-banner .sep-container .banner-more a { font-size: 18px; display: inline-block; width: auto; padding: 0 30px; line-height: 46px; text-align: center; transition: all .3s; position: relative; background: #0047b3; color: #fff; border-radius: 50px; border: 1px solid transparent } .sep-banner .sep-container .banner-more span:hover, .sep-banner .sep-container .banner-more a:hover { background: #fff; color: #0047b3 } .sep-banner .sep-container .banner-more span i, .sep-banner .sep-container .banner-more a i { margin-left: 12px; vertical-align: middle; font-size: 22px } .sep-banner .swiper-slide1 .banner-main .banner-div { text-align: left } .sep-banner .swiper-slide1 .banner-main .banner-div .banner-title { color: #333; text-align: left } .sep-banner .swiper-slide1 .banner-main .banner-div .banner-des { font-size: 30px; line-height: 40px; text-align: left; color: #000; margin-top: 40px; max-width: 600px } .sep-banner .swiper-slide1 .banner-main .banner-div .banner-more { margin-top: 160px } .sep-banner .swiper-slide1 .banner-main .banner-div .banner-more span { color: #000 } .sep-banner .swiper-slide1 .banner-main .banner-div .banner-more span:hover { border-color: #000 } .flex { display: flex } .flex-wrap { flex-wrap: wrap } .padding-120 { padding: 120px 0 } .padding-110 { padding: 110px 0 } .bg-f7 { background: #f7f7f7 } .bg-f8 { background: #f8f8f8 } .top-title-pro { margin-bottom: 50px } .top-title-pro .title { font-size: 30px; line-height: 40px; color: #0047b3 } .top-title-pro .title::after { content: ''; display: inline-block; width: 60%; height: 1px; background: #0047b3; vertical-align: middle; margin-left: 20px } .top-title-pro .title a { font-size: 30px; line-height: 40px; color: #0047b3; display: inline-block; transition: all .3s } .top-title-pro .title a:hover { color: #333 } .top-title-pro .title-des { font-size: 16px; color: #666; line-height: 30px; margin-top: 4px } .mt-80 { margin-top: 80px } .pro-box { padding-bottom: 0 !important } .pro-box .pro-mb-swiper { display: none } .pro-box .pro-ul li { width: 33.33%; min-height: 450px; background: url(../images/home-pro-back.webp) no-repeat; background-size: cover; background-position: center; padding: 60px 50px 40px; display: flex; flex-direction: column; justify-content: space-between; flex-wrap: wrap } .pro-box .pro-ul li:nth-child(even) { background: url(../images/home-pro-back1.webp) no-repeat; background-size: cover; background-position: center } .pro-box .pro-ul li:nth-child(even) .thumb-title { color: #333 } .pro-box .pro-ul li:nth-child(even) .thumb-more { color: #0047b3 } .pro-box .pro-ul li:hover .thumb-info1 { opacity: 1; transform: scale(1) } .pro-box .pro-ul li a { display: inline-block; overflow: hidden } .pro-box .pro-ul li .thumb-info1 { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(11,78,179,0.9); padding: 60px 50px 40px; transition: all .3s; opacity: 0; transform: 0 } .pro-box .pro-ul li .thumb-info1 .thumb-title { color: #fff } .pro-box .pro-ul li .thumb-info1 .thumb-more { color: #fff } .pro-box .pro-ul li .thumb-info1 .thumb-a-box { margin-top: 10px } .pro-box .pro-ul li .thumb-info1 .thumb-a-box a { display: block; font-size: 16px; color: #fff; line-height: 36px; transition: all .3s; position: relative; padding-left: 20px } .pro-box .pro-ul li .thumb-info1 .thumb-a-box a::after { content: '\f178'; font-size: 12px; color: #fff; position: absolute; left: 0; top: 0; font-family: FontAwesome } .pro-box .pro-ul li .thumb-info1 .thumb-a-box a:hover { text-decoration: underline } .pro-box .pro-ul li .thumb-title { font-size: 28px; color: #fff; line-height: 38px; transition: all .3s; display: block } .pro-box .pro-ul li .thumb-title:hover { text-decoration: underline } .pro-box .pro-ul li .thumb-more { font-size: 18px; color: #fff; line-height: 28px; margin-top: 10px; transition: all .3s } .pro-box .pro-ul li .thumb-more:hover { transform: translateY(-5px) } .pro-box .pro-ul li .thumb-more i { margin-left: 10px } .pro-box .pro-ul li .thumb-info { position: relative } .pro-box .pro-ul li .thumb { margin-left: auto; margin-top: 20px } .pro-box .pro-ul li .thumb img{max-width:100%;} .hot-pro-box .hot-pro-swiper { position: relative } .hot-pro-box .hot-pro-swiper .pro-ul li { padding: 16px; background: #f7f7f7 } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb { display: block; background: #fff; padding: 20px; min-height: 330px; display: flex; align-items: center; justify-content: center; text-align: center; position: relative } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb img { width: 100%; transition: all .3s } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb:hover .more { opacity: 1 } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb .detail-span { position: absolute; width: 100%; padding: 10px; left: 0; top: 0; display: flex } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb .detail-span span { width: 60px; height: 26px; background: #0047b3; border-radius: 13px; font-size: 16px; color: #fff; text-align: center; line-height: 26px; margin-right: 10px } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb .detail-span span.new { background: #212121 } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb .more { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(11,78,179,0.9); display: flex; align-items: center; justify-content: center; transition: all .3s; opacity: 0 } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb .more i { width: 44px; height: 44px; border: 1px solid #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 22px; color: #fff } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-title { font-size: 18px; color: #333; line-height: 24px; margin-top: 20px; display: block; padding-right: 40px; transition: all .3s } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-title:hover { color: #0047b3 } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-more { margin-top: 16px; width: 44px; height: 44px; background: #fff; border: 1px solid #e6e6e6; border-radius: 50px; display: flex; align-items: center; justify-content: center; transition: all .3s } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-more:hover { } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-more:hover span { width: auto } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-more:hover i { margin-left: 8px } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-more span { width: 0; overflow: hidden } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-more i { font-size: 22px } .hot-pro-box .hot-pro-swiper .hot-page div { width: 44px; height: 44px; background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #999; font-size: 22px; position: absolute; top: 50%; margin-top: -22px; transition: all .3s } .hot-pro-box .hot-pro-swiper .hot-page div:hover { color: #fff; border-color: #0047b3; background: #0047b3 } .hot-pro-box .hot-pro-swiper .hot-page div.prev { left: -80px; transform: rotate(-180deg) } .hot-pro-box .hot-pro-swiper .hot-page div.next { right: -80px } .indu-box .indu-top { padding: 120px 0 10px; background: #f7f7f7 } .indu-box .indu-top .top-title .title { z-index: 0 } .indu-box .indu-top .top-title .title a { position: relative; z-index: 2 } .indu-box .indu-swiper { max-width: 1920px; margin: 0 auto } .indu-box .indu-swiper .indu-ul .indu-item { justify-content: flex-end; align-items: center } .indu-box .indu-swiper .indu-ul .indu-item .thumb { display: block; width: 50%; margin-left: 120px } .indu-box .indu-swiper .indu-ul .indu-item .thumb img { width: 100% } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info { width: 29% } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title { font-size: 32px; color: #0047b3; line-height: 42px; display: inline-block; transition: all .3s } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title::after { content: ''; display: block; width: 46px; height: 5px; background: #0047b3; margin-top: 10px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title:hover { color: #333 } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-des { font-size: 16px; color: #333; line-height: 30px; margin-top: 30px } .indu-box .indu-swiper .indu-swiper2 { border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; position: relative } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li { border-right: 1px solid #e6e6e6 } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li:last-child a .icon { font-size: 40px } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a { display: block; min-height: 200px; text-align: center; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a .icon { font-size: 50px; line-height: 60px; color: #1a1a1a } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a .icon-title { font-size: 24px; color: #1a1a1a; line-height: 32px; transition: all .3s } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li.swiper-slide-thumb-active a { background: #0047b3 } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li.swiper-slide-thumb-active a .icon { color: #fff } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li.swiper-slide-thumb-active a .icon-title { color: #fff } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li:hover a { background: #0047b3 } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li:hover a .icon { color: #fff } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li:hover a .icon-title { color: #fff } .indu-box .indu-swiper .indu-swiper2 .hot-page div { width: 34px; height: 34px; background: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 18px; color: #0047b3; position: absolute; top: 50%; margin-top: -17px; transition: all .3s; border: 1px solid #0047b3; z-index: 333 } .indu-box .indu-swiper .indu-swiper2 .hot-page div:hover { color: #fff; border-color: #0047b3; background: #0047b3 } .indu-box .indu-swiper .indu-swiper2 .hot-page div.prev { left: 20px; transform: rotate(-180deg) } .indu-box .indu-swiper .indu-swiper2 .hot-page div.next { right: 20px } .padding-80 { padding: 80px 0 } .xc-more { display: inline-block; padding: 0 38px; line-height: 48px; border: 1px solid #0047b3; text-align: center; font-size: 16px; color: #fff; transition: all .3s; margin-top: 30px; background: #0047b3; border-radius: 50px } .xc-more:hover { background: none; color: #0047b3 } .xc-more i { margin-left: 6px } .com-box { max-width: 1920px; margin: 0 auto; padding-bottom: 130px; position: relative } .com-box .thumb { text-align: left; display: block; position: absolute; bottom: 0; left: 0 } .com-box .thumb img { max-width: 100% } .com-box .top-subtitle { font-size: 20px; color: #0047b3; line-height: 30px; margin-top: 12px } .com-box .thumb-more { margin-top: 60px } .com-box .top-title { justify-content: space-between } .com-box .top-title .title-left { width: 30% } .com-box .top-title .title-left .top-subtitle { margin-bottom: 20px } .com-box .top-title .title-left .title::after { content: ''; display: block; width: 72px; height: 5px; background: #0047b3; margin-top: 26px } .com-box .top-title .title-right { width: 58% } .com-box .top-title .title-des { margin-top: 0 } .com-box .com-swiper { width: 100%; position: relative; margin-top: 80px; z-index: 333 } .com-box .com-swiper .com-item { border: 1px solid #e6e6e6; padding: 42px; background: #fff; transition: all .3s; height: auto } .com-box .com-swiper .com-item:nth-child(1) .num-icon { font-size: 50px } .com-box .com-swiper .com-item .num { font-size: 22px; color: #333; line-height: 32px; transition: all .3s; margin-top: 20px } .com-box .com-swiper .com-item .num-des { font-size: 16px; color: #4d4d4d; line-height: 30px; margin-top: 16px } .com-box .com-swiper .com-item .num-des p { font-size: 16px; color: #4d4d4d; line-height: 30px; margin-top: 16px; margin-bottom: 0; transition: all .3s } .com-box .com-swiper .com-item .num-icon { font-size: 40px; color: #0047b3; transition: all .3s; line-height: 40px } .com-box .com-swiper .app-page div { width: 42px; height: 42px; background: #f2f2f2; border-radius: 50%; font-size: 16px; color: #0047b3; display: flex; align-items: center; justify-content: center; transition: all .3s; cursor: pointer; color: #333; position: absolute; top: 50%; margin-top: -21px; z-index: 33 } .com-box .com-swiper .app-page div:hover { background: #0047b3; color: #fff } .com-box .com-swiper .app-page div.prev { transform: rotate(180deg); margin-bottom: -1px; left: -21px } .com-box .com-swiper .app-page div.next { right: -21px } .contact-box { background: url(../images/send.webp) no-repeat; background-size: cover; background-position: center } .contact-box .top-title { margin-bottom: 0 } .news-box .news-ul-box { border-bottom: 1px solid #e6e6e6 } .news-box .news-ul-box li { transition: all .3s } .news-box .news-ul-box li:hover { background: #f6f6f6 } .news-box .news-ul-box li .sep-container { border-top: 1px solid #e6e6e6; padding: 50px 0; justify-content: space-between } .news-box .news-ul-box li .sep-container .news-info { width: 58% } .news-box .news-ul-box li .sep-container .news-info .thumb-title { font-size: 20px; color: #333; line-height: 32px; transition: all .3s } .news-box .news-ul-box li .sep-container .news-info .thumb-title:hover { color: #0047b3 } .news-box .news-ul-box li .sep-container .news-info .thumb-des { font-size: 16px; color: #666; line-height: 26px; margin-top: 16px } .news-box .news-ul-box li .sep-container .news-info a.thumb-more { margin-top: 22px; color: #0047b3; display: inline-block } .news-box .news-ul-box li .sep-container .news-info a.thumb-more:hover span { width: auto; display: inline-block; margin-right: 8px; vertical-align: middle } .news-box .news-ul-box li .sep-container .news-info a.thumb-more span { width: 0; overflow: hidden; transition: all .3s; display: none; vertical-align: middle } .news-box .news-ul-box li .sep-container .news-info a.thumb-more i { font-size: 18px; vertical-align: middle } .news-box .news-ul-box li .sep-container .thumb { width: 19%; display: block; overflow: hidden } .news-box .news-ul-box li .sep-container .thumb img { width: 100%; transition: all .3s } .news-box .news-ul-box li .sep-container .thumb:hover img { transform: scale(1.1) } .news-box .news-ul-box li .sep-container .time-box { width: 10% } .news-box .news-ul-box li .sep-container .time-box .mon { font-size: 24px; color: #333; line-height: 36px } .news-box .news-ul-box li .sep-container .time-box .year { font-size: 16px; color: #4d4d4d; line-height: 20px } .news-box .news-ul-box li .sep-container .time-box .parent { width: 72px; height: 26px; background: #0047b3; line-height: 26px; border-radius: 13px; text-align: center; font-size: 16px; color: #fff; margin-top: 15px } .richtext a { color: #0047b3 } .richtext a:hover { text-decoration: underline } .swiper-mb { display: none } .main-padding { padding: 90px 0 } .foot-contact-ul .sep-container { border-top: 1px solid rgba(255,255,255,0.1) } .foot-contact-ul .sep-container ul { width: 100%; display: flex; align-items: center; padding: 60px 0; justify-content: space-between } .foot-contact-ul .sep-container ul li { display: flex; align-items: center } .foot-contact-ul .sep-container ul li:nth-child(1) { padding-left: 0 } .foot-contact-ul .sep-container ul li:last-child { border: none; margin-right: 0 } .foot-contact-ul .sep-container ul li .icon { width: 55px; height: 55px; background: #0047b3; border: 1px solid #0047b3; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 22px; color: #fff; transition: all .3s } .foot-contact-ul .sep-container ul li .icon:hover { color: #0047b3; background: #fff } .foot-contact-ul .sep-container ul li .icon-des { font-size: 16px; line-height: 28px; color: rgba(255,255,255,0.5); max-width: 353px; margin-left: 10px } .foot-contact-ul .sep-container ul li .icon-des p { color: rgba(255,255,255,0.5) } .foot-contact-ul .sep-container ul li .icon-des a { font-size: 16px; line-height: 28px; color: rgba(255,255,255,0.5) } .foot-contact-ul .sep-container ul li .icon-des a:hover { text-decoration: underline; color: #0047b3 } .foot-contact-ul .sep-container ul .title-li { display: none } .foot-contact-ul .sep-container ul .title-li a { font-size: 22px; color: #fff } .foot-contact-ul .sep-container ul .logo-li { display: block } .foot-contact-ul .sep-container ul .logo-li .fo-media { margin-top: 20px } .sep-footer { background: #1c1e21;width:100%;float:left; } .sep-footer>.sep-container { position: relative; padding: 90px 0 50px } .sep-footer>.sep-container .foot-top { display: flex; justify-content: space-between; position: relative } .sep-footer>.sep-container .foot-top .foot-ul { margin-right: 20px } .sep-footer>.sep-container .foot-top .foot-ul::before { display: none } .sep-footer>.sep-container .foot-top .foot-ul:last-child { max-width: 320px } .sep-footer>.sep-container .foot-top .foot-ul:last-child .foot-des { margin-top: 30px; font-size: 16px; color: rgba(255,255,255,0.8); line-height: 30px } .sep-footer>.sep-container .foot-top .foot-ul:last-child .foot-more { line-height: 42px; padding: 0 24px } .sep-footer>.sep-container .foot-top .foot-ul>li { margin-bottom: 38px } .sep-footer>.sep-container .foot-top .foot-ul>li.onss .li-list { display: block } .sep-footer>.sep-container .foot-top .foot-ul>li .list-title { font-size: 20px; color: #fff; line-height: 30px; position: relative; font-family: "Poppins-SemiBold"; display: block; text-transform: uppercase } .sep-footer>.sep-container .foot-top .foot-ul>li .list-title a { font-size: 20px; color: #fff; line-height: 30px; display: block; transition: all .3s; font-family: "Poppins-SemiBold"; text-transform: uppercase } .sep-footer>.sep-container .foot-top .foot-ul>li .list-title a:hover { color: #0047b3 } .sep-footer>.sep-container .foot-top .foot-ul>li .list-title i { display: none } .sep-footer>.sep-container .foot-top .foot-ul>li .list-title::after { content: ''; display: block; width: 18px; height: 3px; background: #0047b3; border-radius: 2px; margin-top: 12px; position: relative; z-index: 444 } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list { margin-top: 30px } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list li { display: block; padding-left: 16px; position: relative; transition: all .3s; padding-left: 0; margin-bottom: 4px; line-height: 24px } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list li .con .title { color: #ccc; line-height: 32px; font-size: 16px } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list li .con .des { color: #ccc; line-height: 32px; font-size: 16px } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list li a { color: rgba(255,255,255,0.5); line-height: 30px; font-size: 16px; display: block; transition: all .3s } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list li a:hover { color: #0047b3 } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list .pro-title { margin-bottom: 18px } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list .pro-title i { display: none } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list .pro-title a { font-size: 20px; line-height: 30px; color: #fff } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list .pro-title a:hover { color: #0047b3 } .sep-footer .fo-media a { font-size: 20px; margin: 0; display: inline-flex; border-radius: 50%; justify-content: center; align-items: center; color: rgba(255,255,255,0.4); transition: all .3s; margin-left: 15px } .sep-footer .fo-media a:hover { color: #fff } .sep-footer .copyRight { background: #0047b3 } .sep-footer .copyRight .main { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; padding: 19px 0 } .sep-footer .copyRight .main span { color: rgba(255,255,255,0.8); font-size: 16px } .sep-footer .copyRight .main span a { color: rgba(255,255,255,0.8); font-size: 16px } .sep-footer .copyRight .main span a:hover { color: #fff } .sep-footer .copyRight .main span i { font-style: initial; margin: 0 5px } .sep-footer .copyRight .main .site { margin-left: 40px } .mt-60 { margin-top: 40px !important } #onlineService { position: fixed; right: 0; display:none; z-index: 100998 } .offside { width: 50px } .offside li { width: 50px; height: 50px; position: relative; background: #b1b1b1; border-bottom: 1px solid #fff; text-align: center; transition: all .7s; -webkit-transition: all .7s } .offside .code { position: absolute; top: 0; right: 50px; display: none; margin: 0 } .offside a, .offside div { color: #fff; position: absolute; z-index: 11; display: block; top: 0; right: 0; bottom: 0; cursor: pointer; line-height: 50px; font-size: 24px } .offside p { float: left; line-height: 50px; font-size: 16px; font-weight: 700; padding: 0 0 0 10px; color: #fff; opacity: 0; position: absolute; white-space: nowrap } .offside .icon { font-size: 28px; height: 100%; line-height: 50px; text-align: center; display: block; color: #fff } .offside li:not(.li_3) a, .offside .li_3 a, .offside .li_3 div { width: 50px } .offside .back_top { display: none } .offside li { background: #0047b3 } .offside li:last-child { background: #b1b1b1 } .offside .erweima { width: 150px; height: auto; position: absolute; left: -150px; top: 0; display: none } .offside li:hover a, .offside li:hover div, .offside li:hover .icon { color: #fff } .offside li:hover p { opacity: 1 } .offside li:not(.li_3):hover { background: #333 } .offside li:not(.li_erweima):hover .erweima { display: block } .offside .tel { width: 230px; transform: translateX(-180px); -webkit-transform: translateX(-180px) } .offside .back_none { height: 0; border: 0 !important } .offside .li { transform: translateX(100%); -webkit-transform: translateX(100%) } .offside .unfold { width: 30px; transform: translateX(20px); -webkit-transform: translateX(20px) } .trans1 { transition: all .3s } .gtj-t-r-deg { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg) } .trans { -webkit-transition: all .4s; -moz-transition: all .4s; -ms-transition: all .4s; -o-transition: all .4s; transition: all .4s } .email-items { position: absolute; top: 0; left: -200px; width: 200px; height: 200px !important; transform: translateX(500px); transition: all .3s } .email-items.active { transform: translateX(0) } .email-items .email-item { position: static } .email-items .email-item a { width: 100% !important; font-size: 17px; background: #0047b3; height: auto !important; position: static } .email-items .email-item a:hover { color: #333 } .offside .unfold { width: 30px; transform: translateX(20px); -webkit-transform: translateX(20px) } .offside .unfold { width: 30px; transform: translateX(20px); -webkit-transform: translateX(20px) } .offside .unfold a { width: 100% !important } .offside .unfold i { transform: rotate(180deg) } .offside .li { transform: translateX(100%); -webkit-transform: translateX(100%); height: 0 } .offside .li { transform: translateX(100%); -webkit-transform: translateX(100%) } .sep-lx-header-mb { display: block; width: 100%; z-index: 200; border-top: 2px solid #0047b3 } .sep-lx-header-mb .rt { float: right } .sep-lx-header-mb .lf { float: left } .sep-lx-header-mb .sep-bjj-pro-list { display: flex; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; position: relative } .sep-lx-header-mb .sep-bjj-pro-list>li { flex: 1 } .sep-lx-header-mb .sep-bjj-pro-list>li:nth-child(1) a { background: #11a4a7 } .sep-lx-header-mb .sep-bjj-pro-list>li>a { display: block; background: #11b4b7; color: #fff; font-size: 16px; text-align: center; padding: 10px 0 } .sep-lx-header-mb .sep-bjj-pro-list>li>a i { padding-left: 5px } .sep-lx-header-mb .sep-bjj-pro-list>li>ul { position: absolute; top: 100%; left: 0; width: 100%; z-index: 100000; display: none } .sep-lx-header-mb .sep-bjj-pro-list>li>ul>li { display: block; background: #11a4a7; color: #fff; font-size: 16px; padding: 10px 30px; border-top: 1px solid #4ab3b5 } .sep-lx-header-mb .sep-bjj-pro-list>li>ul>li a { color: #fff } .sep-lx-header-mb .sep-bjj-pro-list>li>ul>li i { float: right; position: relative; top: 3px } .sep-lx-header-mb .box-wrap { padding: 20px 20px; width: 100%; z-index: 1000; display: flex; justify-content: space-between; align-items: center } .sep-lx-header-mb .box-wrap .logo { float: none; margin: 0 auto } .sep-lx-header-mb .box-wrap .logo img { width: 100px } .sep-lx-header-mb .box-wrap>ul { position: relative; top: 1px; display: flex } .sep-lx-header-mb .box-wrap>ul>li { margin-left: 8px; text-align: center; position: relative; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; background: #0047b3; border-radius: 50% } .sep-lx-header-mb .box-wrap>ul>li i { color: #333; font-size: 16px } .sep-lx-header-mb .box-wrap>ul>li a { display: block; padding-top: 6px } .sep-lx-header-mb .box-wrap>ul>li#menu i { color: #fff } .sep-lx-header-mb .box-wrap>ul>li#headerSearch { background: none; color: #333 } .sep-lx-header-mb .box-wrap>ul>li#logo { border: none; float: none; margin: 0 auto; position: absolute; left: 50%; width: auto; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%) } .sep-lx-header-mb .box-wrap>ul>li.active { border: 1px solid #1f2256; background: #1f2256 } .sep-lx-header-mb .box-wrap>ul>li.active i { color: #fff } .sep-lx-header-mb .box-wrap>ul>li#global { position: relative; background: none } .sep-lx-header-mb .box-wrap>ul>li#global i { font-style: inherit; color: #333; font-size: 16px } .sep-lx-header-mb .box-wrap>ul>li .multi-language { position: absolute; background: #0047b3; width: 157px; text-align: center; padding: 10px 20px; z-index: 100000; top: 40px; left: -67px; display: none; border: 1px solid #fff } .sep-lx-header-mb .box-wrap>ul>li .multi-language a span{ color:#fff;padding:0px} .sep-lx-header-mb .box-wrap>ul>li .multi-language li { padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px solid #fff } .sep-lx-header-mb .box-wrap>ul>li .multi-language li:last-child { border-bottom: none; margin-bottom: 0 } .sep-lx-header-mb .box-wrap>ul>li .multi-language li a { color: #fff; font-size: 14px } .sep-lx-header-mb .stock { color: #3a3a3a; font-size: 14px; background: #f4f4f4; text-align: center; padding: 8px 0 } .sep-lx-header-mb .stock .red { color: #da2337; position: relative; padding: 0 7px } .sep-lx-header-mb .stock .red:before { content: ""; display: block; width: 2px; height: 10px; background: #da2337; position: absolute; left: 0; top: 3px } .sep-lx-header-mb .stock .red:after { content: ""; display: block; width: 2px; height: 10px; background: #da2337; position: absolute; right: 0; top: 3px } .sep-lx-header-mb .stock .green { color: #13ba07 } .sep-lx-header-mb .stock span { padding: 0 5px; margin: 0 3px } .sep-shadow { background: rgba(0,0,0,0.5); position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 1000000; display: none } i.i-searchs { display: inline-block; width: 20px; height: 20px; border-radius: 100%; border: 3px solid #0047b3; position: relative } i.i-searchs:after { content: ''; display: block; width: 3px; height: 8px; background: #0047b3; position: absolute; left: 100%; top: 100%; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg) } i.i-closes { display: inline-block; width: 25px; height: 25px; position: relative; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg) } i.i-closes:before { content: ''; display: block; width: 17px; height: 3px; background: #0047b3; position: absolute; left: 4px; top: 11px } i.i-closes:after { content: ''; display: block; width: 3px; height: 17px; background: #0047b3; position: absolute; left: 11px; top: 4px } i.i-closes.ons { position: absolute; right: 31px; top: 24px; cursor: pointer } i.i-globals { display: inline-block; width: 22px; height: 22px; border-radius: 100%; border: 1px solid #000; position: relative } i.i-globals:after { content: ''; display: block; width: 10px; height: 20px; border: 1px solid #000; border-radius: 50%; position: absolute; left: 5px; top: 0 } i.i-globals:before { content: ''; display: block; width: 1px; height: 100%; position: absolute; left: 50%; top: 0; background: #000 } i.i-menus { display: inline-block; width: 18px; height: 2px; position: relative; background: #000 } i.i-menus:before { content: ''; display: block; width: 100%; height: 2px; background: #000; position: absolute; left: 0; top: -5px } i.i-menus:after { content: ''; display: block; width: 100%; height: 2px; background: #000; position: absolute; left: 0; top: 5px } .sep-search-box { position: fixed; width: 100%; background: #fff; top: 66px; z-index: 10000000; padding: 44px 31px; box-shadow: 0 0 12px rgba(0,0,0,0.5); display: none } .sep-search-box .fa-times { color: #000; font-size: 20px; position: absolute; right: 31px; top: 24px; cursor: pointer } .sep-search-box .hd { color: #282828; font-size: 18px; font-family: 'LATO-BOLD' } .sep-search-box form { margin-top: 10px; margin-bottom: 25px } .sep-search-box form .form-control { height: 47px; border-radius: 0 } .sep-search-box form .btn { background: #0047b3; color: #fff; display: table; margin: 0 auto; margin-top: 17px; padding: 10px 40px; font-size: 16px; width: 100% } .sep-search-box form .btn i { margin-right: 5px; border-color: #fff } .sep-search-box form .btn i:after { background: #fff } .sep-search-box .more { background: #0047b3; color: #fff; display: table; margin: 0 auto; margin-top: 17px; padding: 10px 40px; font-size: 16px; width: 100%; border: none } .sep-search-box .more i { padding-right: 5px } .sep-search-box ul li { margin-top: 8px } .sep-search-box ul li a { color: #8c8c8c; font-size: 14px; display: block } .logos { display: block; display: flex; align-items: center } .logos img { max-width: 100%; max-width: 77px } #search { color: #0047b3 } #search i { color: #0047b3 !important } .sep-menu-box { width: 100%; position: absolute; background: #fff; left: 0; top: 0; z-index: 10000000; max-width: 310px; box-shadow: 0 0 12px rgba(0,0,0,0.7); transition: All .4s ease-in-out; -webkit-transition: All .4s ease-in-out; -moz-transition: All .4s ease-in-out; -o-transition: All .4s ease-in-out; -webkit-transform: translateX(-105%); -moz-transform: translateX(-105%); -ms-transform: translateX(-105%); -o-transform: translateX(-105%); transform: translateX(-105%) } .sep-menu-box.active { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0) } .sep-menu-box .top { padding: 20px 30px; text-align: center; box-shadow: 0 0 12px rgba(145,145,145,0.7); position: relative; z-index: 10000; display: flex; justify-content: space-between; align-items: center; background: #fff } .sep-menu-box .top i { color: #0047b3; font-size: 22px; position: relative; top: 3px; cursor: pointer } .sep-menu-box .top img { width: 100px } .sep-menu-box .bottom { visibility: visible } .sep-menu-box .bottom.no { visibility: hidden } .sep-menu-box .bottom .menu-item { margin-bottom: 20px } .sep-menu-box .bottom .menu-item>li { border-bottom: 1px solid #ddd } .sep-menu-box .bottom .menu-item>li:last-child { border-bottom: none } .sep-menu-box .bottom .menu-item>li.active { background: #0047b3 } .sep-menu-box .bottom .menu-item>li.active .box { border-bottom: 1px solid #fff } .sep-menu-box .bottom .menu-item>li.active .box a { color: #fff } .sep-menu-box .bottom .menu-item>li.active .box i { color: #fff; transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); background: #fff } .sep-menu-box .bottom .menu-item>li.active .box i:after { border-top-color: #0047b3; border-right-color: #0047b3 } .sep-menu-box .bottom .menu-item>li .box { position: relative; padding: 22px 30px; border-bottom: 1px solid transparent } .sep-menu-box .bottom .menu-item>li .box a { color: #282828; font-size: 18px } .sep-menu-box .bottom .menu-item>li .box i { display: block; width: 24px; height: 24px; font-size: 20px; border-radius: 100%; background: #0047b3; color: #282828; position: absolute; right: 30px; top: 26px; cursor: pointer; transition: All .4s ease-in-out; -webkit-transition: All .4s ease-in-out; -moz-transition: All .4s ease-in-out; -o-transition: All .4s ease-in-out } .sep-menu-box .bottom .menu-item>li .box i:after { content: ''; display: block; width: 8px; height: 8px; border: 2px solid transparent; border-top-color: #fff; border-right-color: #fff; position: absolute; left: 50%; margin-left: -6px; top: 50%; margin-top: -4px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .sep-menu-box .bottom .menu-item>li>ul { padding: 5px 0; display: none } .sep-menu-box .bottom .menu-item>li>ul>li { padding: 4px 20px; position: relative } .sep-menu-box .bottom .menu-item>li>ul>li a { color: #fff; font-size: 14px } .sep-menu-box .bottom .menu-item>li>ul>li i { display: block; width: 24px; height: 24px; font-size: 20px; border-radius: 100%; background: #fff; color: #282828; position: absolute; right: 30px; top: 7px; cursor: pointer; transition: All .4s ease-in-out; -webkit-transition: All .4s ease-in-out; -moz-transition: All .4s ease-in-out; -o-transition: All .4s ease-in-out } .sep-menu-box .bottom .menu-item>li>ul>li i:after { content: ''; display: block; width: 8px; height: 8px; border: 2px solid transparent; border-top-color: #0047b3; border-right-color: #0047b3; position: absolute; left: 50%; margin-left: -6px; top: 50%; margin-top: -4px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .sep-menu-box .bottom .menu-item>li .ul2 { padding: 5px 0; display: none } .sep-menu-box .bottom .menu-item>li .ul2>li { padding: 4px 20px; position: relative } .sep-menu-box .bottom .menu-item>li .ul2>li a { color: #fff; font-size: 14px } .sep-menu-box .bottom .menu-item>li .ul2>li i { display: block; width: 24px; height: 24px; font-size: 20px; border-radius: 100%; background: #fff; color: #282828; position: absolute; right: 30px; top: 7px; cursor: pointer; transition: All .4s ease-in-out; -webkit-transition: All .4s ease-in-out; -moz-transition: All .4s ease-in-out; -o-transition: All .4s ease-in-out } .sep-menu-box .bottom .menu-item>li .ul2>li i:after { content: ''; display: block; width: 8px; height: 8px; border: 2px solid transparent; border-top-color: #0047b3; border-right-color: #0047b3; position: absolute; left: 50%; margin-left: -6px; top: 50%; margin-top: -4px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .sep-menu-box .bottom-toggle { position: absolute; width: 100%; z-index: 1000; top: 64px; background: #fff; transition: All .4s ease-in-out; -webkit-transition: All .4s ease-in-out; -moz-transition: All .4s ease-in-out; -o-transition: All .4s ease-in-out; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%) } .sep-menu-box .bottom-toggle.active { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0) } .sep-menu-box .bottom-toggle .toggle { display: none } .sep-menu-box .bottom-toggle .toggle>ul { background: #fff } .sep-menu-box .bottom-toggle .toggle>ul>li { padding: 0 0; border-bottom: 1px solid #ccc; position: relative; line-height: 60px } .sep-menu-box .bottom-toggle .toggle>ul>li:nth-child(1) span { width: 60; min-width: 60px; height: 59px; line-height: 60px; text-align: center; display: inline-block; border-right: 1px solid #ccc } .sep-menu-box .bottom-toggle .toggle>ul>li:nth-child(1) a { font-family: 'LATO-BOLD' } .sep-menu-box .bottom-toggle .toggle>ul>li>ul { display: none } .sep-menu-box .bottom-toggle .toggle>ul>li>ul>li { line-height: 40px } .sep-menu-box .bottom-toggle .toggle>ul>li>ul>li a { font-size: 14px } .sep-menu-box .bottom-toggle .toggle>ul>li a { color: #282828; font-size: 16px; padding-left: 30px } .sep-menu-box .bottom-toggle .toggle>ul>li a i { font-size: 20px; color: #282828; position: absolute; right: 30px; top: 21px; cursor: pointer } .sep-menu-box .contact { background: #0047b3; color: #fff; display: table; margin: 0 auto 20px; margin-top: 0; padding: 4px 40px; font-size: 22px; border: none; border-radius: 0 } .sep-menu-box .contact i { padding-right: 5px } .sep-menu-box .logo img { width: 59px } .gdw-mb-c { display: none } .sep-banner-mb { display: none } .sep-banner-mb img { width: 100% } .mb-bottom-wrap { padding-bottom: 24px; background: #131d26 } .mb-bottom-wrap ul.info { padding: 28px 37px } .mb-bottom-wrap ul.info li { margin-bottom: 4px; position: relative; padding-left: 36px; color: #fff; font-size: 14px } .mb-bottom-wrap ul.info li:last-child { margin-bottom: 0 } .mb-bottom-wrap ul.info li i { color: #fff } .mb-bottom-wrap ul.info li a { color: #fff } .mb-bottom-wrap ul.info li img { position: absolute; left: 0; top: 10px } .mb-bottom-wrap .bottom-menu>li:last-child { border-bottom: 1px solid #343e46 } .mb-bottom-wrap .bottom-menu>li>ul { padding: 5px 0; padding-left: 60px; border-top: 1px solid #343e46; display: none } .mb-bottom-wrap .bottom-menu>li>ul li { padding: 5px 0; list-style: disc; color: #fff } .mb-bottom-wrap .bottom-menu>li>ul li a { font-size: 14px; color: #fff } .mb-bottom-wrap .bottom-menu>li .box { padding: 13px 37px; border-top: 1px solid #343e46; position: relative } .mb-bottom-wrap .bottom-menu>li .box a { color: #fff; font-size: 14px } .mb-bottom-wrap .bottom-menu>li .box i { position: absolute; right: 37px; top: 17px; color: #fff; cursor: pointer; font-size: 14px } .mb-bottom-wrap .sep-share { display: table; margin: 0 auto; margin-top: 24px } .mb-bottom-wrap .sep-share li { width: 28px; height: 28px; line-height: 28px; text-align: center; margin-right: 6px; background: #1e2c39 } .mb-bottom-wrap .sep-share li:hover { background: #0047b3; border: 1px solid #0047b3 } .mb-bottom-wrap .sep-share li:hover a i { color: #fff } .mb-bottom-wrap .sep-share li a i { color: #fff; font-size: 14px } @media screen and (max-width:1700px) { .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title{margin-top:5%;}} @media screen and (min-width:813px) { .sep-banner-mb { display: none } .sep-search-box, .sep-shadow, .sep-lx-header-mb, .sep-menu-box { display: none !important } } @media screen and (max-width:813px) { .sep-banner-pc { display: none } .sep-banner-mb { display: block } } @media screen and (max-width:1410px) { .sep-container { max-width: 100%;padding-left:20px !important;padding-right:20px !important; }} @media screen and (max-width:1460px) { .sep-banner .sep-container .banner-title { font-size: 48px; line-height: 58px } .sep-banner .sep-container .banner-des { font-size: 16px; margin-top: 20px } .top-title .title { font-size: 40px; line-height: 52px } .top-title .title a { font-size: 40px; line-height: 52px } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-title { padding-right: 0 } .pro-box .pro-ul li .thumb { margin-top: -10px; text-align: right } .pro-box .pro-ul li .thumb img { width: 80% } .hot-pro-box .hot-pro-swiper { padding: 0 30px } .hot-pro-box .hot-pro-swiper .hot-page div.prev { left: -20px } .hot-pro-box .hot-pro-swiper .hot-page div.next { right: -20px } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb { min-height: 280px } .hot-pro-box .hot-pro-swiper .hot-page div { top: 40% } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info { width: 36% } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a .icon-title { font-size: 20px } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a .icon { font-size: 40px !important } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a { min-height: 160px } } @media screen and (max-width:1366px) { .swiper-pc .swiper-pagination { right: 36px !important } .pro-box .pro-ul li { padding: 40px } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li { margin: 0 10px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title { font-size: 28px } } @media screen and (max-width:1280px) { .pro-box .pro-ul li .thumb-title { font-size: 26px } .hot-pro-box .hot-pro-swiper .hot-page.hide { display: block !important } } @media screen and (max-width:1200px) { .sep-banner .sep-container .banner-title { font-size: 30px; line-height: 30px } .top-title .title { font-size: 38px; line-height: 44px } .top-title .title a { font-size: 38px; line-height: 44px } .pro-box .pro-ul li .thumb-title { font-size: 24px } .pro-box .pro-ul li .thumb-info1 { opacity: 0; display: none } .pro-box .pro-ul li:hover .thumb-info1 { opacity: 0; display: none; transform: scale(0) } } @media screen and (max-width:1024px) { .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li { margin: 0 5px } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul > li > a{ font-size:14px;} .sep-header .sep-mainnav .sep-container .logo img { width: 140px } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .head-pro-ul { display: none !important } .sep-header .sep-mainnav .sep-container .nav-list .nav-ul>li .ul { display: none !important } .swiper-pc .pc-page .icon { display: none } .swiper-pc .pc-page { height: auto; background: none; bottom: 16px; box-shadow: none } .foot-contact-ul .sep-container ul { flex-wrap: wrap } .foot-contact-ul .sep-container ul li { width: 100%; margin-bottom: 10px } .foot-contact-ul .sep-container ul li .icon { background: none; border: none } .sep-footer .copyRight .main span { width: 100%; margin: 10px 0 } .sep-footer .sep-container .foot-top { flex-wrap: wrap } .sep-footer .sep-container .foot-top .foot-ul { width: 100% !important } .sep-footer .sep-container .foot-top .foot-ul:last-child li { width: 100% !important } .sep-footer .sep-container .foot-top .foot-ul:last-child>li:nth-child(2) { padding-left: 0 } .sep-footer .sep-container .foot-top .foot-ul:last-child>li:nth-child(2)::after { display: none } .sep-footer .sep-container .foot-top .foot-ul:nth-child(3)>li:nth-child(1) { height: auto } .sep-footer .sep-container .foot-top .foot-ul>li { margin-bottom: 20px !important } .sep-footer .sep-container .foot-top .foot-ul>li.ons .list-title i::before { display: none } .sep-footer .sep-container .foot-top .foot-ul>li .li-list { display: none } .sep-footer .sep-container .foot-top .foot-ul { padding-top: 0 } .sep-footer .sep-container .foot-top .foot-ul:nth-child(4)>li:nth-child(2) { height: auto } .sep-footer .sep-container .foot-top .foot-ul:last-child .foot-contact { margin-top: 0 } .sep-footer .sep-container .foot-top .foot-ul:last-child .foot-contact .li-list { display: block } .sep-footer .sep-container .foot-top .foot-ul::after { display: none } .sep-footer .sep-container .foot-top .foot-ul>li .list-title { padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,0.2) } .sep-footer .sep-container .foot-top .foot-ul>li .list-title::before { content: ''; display: block; width: 30px; height: 3px; background: #333; border-radius: 1px; position: absolute; left: 0; bottom: -2px } .sep-footer .sep-container .foot-top .foot-ul>li { margin-bottom: 0 !important } .sep-footer .sep-container .foot-top .foot-ul>li .list-title { position: relative } .sep-footer .sep-container .foot-top .foot-ul>li .list-title i { display: block; width: 24px; height: 24px; position: absolute; right: 0; top: 24px; display: flex; align-items: center; justify-content: center } .sep-footer .sep-container .foot-top .foot-ul>li .list-title i::after { content: ''; display: block; width: 12px; height: 2px; background: #fff; position: absolute; left: 6px; top: 11px } .sep-footer .sep-container .foot-top .foot-ul>li .list-title i::before { content: ''; display: block; width: 2px; height: 12px; background: #fff; position: absolute; left: 11px; top: 6px } .sep-footer>.sep-container .foot-top .foot-ul { margin-right: 0 } .offside p { display: none } .offside .tel { width: 50%; transform: translateX(0) } .offside a, .offside div { line-height: 44px } #onlineService { left: 0; bottom: 0 } #onlineService .offside { width: 100%; display: flex } #onlineService .offside li { flex: 1; height: 50px; background: #000; border-radius: 0; border: 1px solid rgba(255,255,255,0.2) } #onlineService .offside li a { width: 100%; top: 4px } #onlineService .offside li a i { color: #fff; font-size: 20px; line-height: 40px } .foot-cover { height: 44px } .sep-footer .fo-media a { margin-left: 0; margin-right: 20px } .sep-footer>.sep-container .foot-top .foot-ul:last-child { max-width: 100%; margin-top: 30px; width: 100% } .sep-footer .copyRight { background: #0047b3; border-top: 1px solid rgba(255,255,255,0.2) } .sep-footer .sep-container .foot-top .foot-ul>li .li-list { padding-left: 10px; margin-top: 20px } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list li { padding-left: 20px; position: relative } .sep-footer>.sep-container .foot-top .foot-ul>li .li-list li::after { content: '\f105'; display: inline-block; color: #fff; font-family: FontAwesome; position: absolute; left: 0; top: 4px; font-size: 14px } .sep-footer .sep-container .foot-top .foot-ul>li .list-title::before { content: ''; display: block; width: 18px; height: 3px; background: #0047b3; position: absolute; left: 0; bottom: -1px } #onlineService .offside li.fold { display: none } .sep-footer>.sep-container::after { display: none } .sep-footer>.sep-container .foot-top .foot-ul>li .list-title::after { display: none } .sep-footer>.sep-container .foot-top .foot-ul.foot-ul-app li .li-list li { width: 100% } .sep-footer>.sep-container .foot-top .foot-ul.foot-ul-app li .li-list { display: none } .sep-footer .sep-container .foot-top .foot-ul:last-child>li:nth-child(2) { display: none } .foot-contact-ul .sep-container ul .title-li { display: block } .foot-contact-ul .sep-container .fo-media { display: block } .foot-contact-ul .sep-container { border: none } .foot-contact-ul .sep-container ul { padding: 30px 0; border-top: 1px solid rgba(255,255,255,0.2) } .sep-footer .copyRight .main .site { margin-left: 0 } .top-title .title-des { font-size: 16px; line-height: 32px } .top-title .title-des p { font-size: 16px; line-height: 32px } .foot-contact-ul .sep-container ul li .icon { width: auto; height: auto; margin-right: 10px } .pro-box .pro-ul li { min-height: 1px } .pro-box .pro-ul li .thumb-title { min-height: 76px } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb .more { display: none } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb:hover .more { opacity: 0; display: none } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb { min-height: 240px } .padding-110 { padding: 90px 0 } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info { width: 42% } .indu-box .indu-swiper .indu-ul .indu-item .thumb { margin-left: 36px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title { font-size: 24px; line-height: 32px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-des { max-height: 150px; overflow-y: auto; padding-right: 12px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-des::-webkit-scrollbar { width:3px; height:6px; background-color:rgba(255,255,255,0.2) } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-des::-webkit-scrollbar-track { border-radius:10px; background-color:transparent } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-des::-webkit-scrollbar-thumb { border-radius:10px; background-color:#eee } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a { min-height: 120px } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a .icon { font-size: 30px !important; line-height: 40px } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a .icon-title { font-size: 18px } .com-box .top-title .title-left { width: 35% } .com-box .com-swiper .com-item { padding: 22px } .com-box .com-swiper .com-item .num { font-size: 20px } .com-box .thumb { width: 60% } .padding-100 { padding: 70px 0 } .news-box .news-ul-box li .sep-container { padding: 30px 0 } .sep-footer>.sep-container { padding-top: 40px } .top-title.title-after .title::after { font-size: 50px; margin-top: -55px } .sep-banner .sep-container .banner-title { width: 90%;font-size: 20px; line-height: 25px; } } @media screen and (max-width:812px) { .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title { margin-top: 0; } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info{width:100%;padding:5%;} .indu-box .indu-swiper .indu-ul .indu-item .thumb{width:100%;margin-left:0px;} #onlineService{display:block;} .sep-header { display: none } .head-cover { display: none } .top-title .title { font-size: 28px; line-height: 32px } .top-title .title a { font-size: 28px; line-height: 32px } .swiper-mb.swiper-mb2 { display: none !important } .logos img { max-width: 75% } .sep-banner .sep-container .banner-more { margin-top: 20px } .pro-box .pro-ul { display: none } .pro-box .pro-mb-swiper { display: block; max-width: 92%; margin: 0 auto } .pro-box .pro-mb-swiper .pro-ul { display: flex } .pro-box .pro-mb-swiper .pro-ul li { width: auto } .pro-box .pro-mb-swiper .hot-page { display: flex; justify-content: center; margin-top: 30px } .pro-box .pro-mb-swiper .hot-page div { width: 44px; height: 44px; background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #999; font-size: 22px; margin: 0 10px; transition: all .3s } .pro-box .pro-mb-swiper .hot-page div:hover { color: #fff; border-color: #0047b3; background: #0047b3 } .pro-box .pro-mb-swiper .hot-page div.prev { transform: rotate(-180deg) } .pro-box .pro-ul li { padding: 40px 26px; height: auto } .pro-box .pro-ul li .thumb-title { min-height: 1px } .indu-box .indu-top { padding-top: 80px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-des { margin-top: 16px } .padding-110 { padding: 70px 0 } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-des { max-height: 90px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title { font-size: 20px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-title::after { width: 30px; height: 2px } .com-box .top-title .title-left { width: 100% } .com-box .top-title .title-right { width: 100%; margin-top: 30px } .com-box .com-swiper { margin-top: 50px } .news-box .news-ul-box li .sep-container .thumb { display: none } .news-box .news-ul-box li .sep-container .news-info { width: 80% } .news-box .news-ul-box li .sep-container .news-info .thumb-title { font-size: 18px } .news-box .news-ul-box li .sep-container .time-box { width: 15% } .news-box .news-ul-box li .sep-container .time-box .mon { font-size: 22px } .sep-banner .swiper-pc .sep-container .banner-more span, .sep-banner .swiper-pc .sep-container .banner-more a { display: inline-block;font-size: 14px; } } @media screen and (max-width:480px) { .sep-banner .sep-container .banner-title { font-size: 18px; line-height: 25px }.sep-banner .sep-container .banner-subtitle{margin-bottom: 0;} .top-title .title { font-size: 24px; line-height: 32px } .top-title .title a { font-size: 24px; line-height: 32px } .sep-banner .sep-container .banner-div { width: 90% } .sep-banner .sep-container .banner-more span, .sep-banner .sep-container .banner-more a { font-size: 16px; padding: 0 20px; line-height: 40px } .sep-banner .sep-container .banner-more span i, .sep-banner .sep-container .banner-more a i { font-size: 16px; margin-left: 6px } .sep-lx-header-mb .box-wrap { padding: 17px } .padding-110 { padding: 50px 0 } .top-title { margin-bottom: 40px } .pro-box .pro-mb-swiper { max-width: 100% } .pro-box .pro-ul li .thumb-title { font-size: 18px } .pro-box .pro-ul li .thumb-more { font-size: 16px } .pro-box .pro-ul li .thumb { margin-top: -50px } .pro-box .pro-ul li .thumb img { width: 60% } .pro-box .pro-ul li { padding-bottom: 10px } .hot-pro-box .hot-pro-swiper { padding: 0 } .hot-pro-box .hot-pro-swiper .hot-page { display: flex !important; margin-top: 20px } .hot-pro-box .hot-pro-swiper .hot-page div { position: static; margin: 0 10px; width: 40px; height: 40px; font-size: 18px } .hot-pro-box .hot-pro-swiper .hot-page.hide { display: flex !important } .hot-pro-box .hot-pro-swiper .pro-ul li { padding: 10px } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-title { font-size: 16px; line-height: 28px } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-more { display: none } .pro-box .pro-mb-swiper .hot-page div { width: 40px; height: 40px; font-size: 18px } .hot-pro-box .hot-pro-swiper .pro-ul li { height: auto; display: flex; flex-direction: column; justify-content: space-between } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb { min-height: 180px } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb img { width: 110% } .hot-pro-box .hot-pro-swiper .pro-ul li .thumb-title { flex: 1 } .hot-pro-box .hot-pro-swiper .hot-page { justify-content: center } .indu-box .indu-top { padding-top: 50px } .indu-box .indu-swiper .indu-ul { background: #f7f7f7; padding-bottom: 40px } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info .thumb-des { display: none } .indu-box .indu-swiper .indu-ul .indu-item .thumb-info { width: 92%; margin-top: 30px; display: none } .indu-box .indu-swiper .indu-ul .indu-item .thumb { width: 92%; margin: 0 auto } .indu-box .indu-swiper .indu-ul .indu-item { flex-direction: column-reverse } .indu-box .indu-swiper .indu-swiper2 .hot-page div.prev { left: 0 } .indu-box .indu-swiper .indu-swiper2 .hot-page div.next { right: 0 } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a .icon-title { font-size: 16px } .indu-box .indu-swiper .indu-swiper2 .indu-ul1 li a { min-height: 110px } .com-box .top-subtitle { font-size: 18px } .com-box .top-title .title-left .top-subtitle { margin-bottom: 5px; margin-top: 0 } .com-box .top-title .title-left .title::after { width: 60px; height: 4px; margin-top: 16px } .com-box .com-swiper .com-item { padding: 30px } .com-box .com-swiper .com-item .num-des p { margin-top: 10px } .com-box .thumb { width: 80% } .padding-100 { padding: 40px 0 } .xc-more { margin-top: 20px } .top-title.white .title-des { color: #fff } .news-box .news-ul-box li .sep-container .news-info .thumb-des { display: none } .news-box .news-ul-box li .sep-container .news-info .thumb-title { font-size: 16px; line-height: 30px; display: block } .news-box .news-ul-box li .sep-container .time-box { width: 27% } .news-box .news-ul-box li .sep-container .time-box .mon { font-size: 18px } .news-box .news-ul-box li .sep-container .news-info { width: 70% } .news-box .news-ul-box li .sep-container { padding: 24px 0 } .news-box .news-ul-box li .sep-container .news-info a.thumb-more span { width: auto; display: inline-block } .news-box .news-ul-box li .sep-container .news-info a.thumb-more { margin-top: 16px } .sep-footer .sep-container .foot-top .foot-ul>li .list-title { padding: 15px 0; font-size: 18px } .sep-footer .sep-container .foot-top .foot-ul>li .list-title a { font-size: 18px } .sep-footer .sep-container .foot-top .foot-ul>li .list-title i { top: 18px } .sep-footer>.sep-container { padding-top: 20px } .sep-footer .copyRight .main span { margin: 4px 0 } .sep-banner .sep-container .banner-title { width: 100% } .news-box .news-ul-box li .sep-container .news-info .thumb-title { line-height: 26px } .sep-menu-box .bottom .menu-item>li .box { padding: 16px 20px } .sep-menu-box .bottom .menu-item>li .box i { top: 16px; right: 20px } .sep-menu-box .bottom .menu-item>li>ul>li a { font-size: 16px !important } } @media screen and (max-width:320px) { .sep-banner .swiper-mb .sep-container .banner-more { display: none } }