@charset "utf-8"; /*常用字号、行高、文字颜色*/ .font-s16 { font-size: 16px; } .font-s18 { font-size: 18px; } .font-s20 { font-size: 20px; } .font-s24 { font-size: 24px; } .line-h32 { line-height: 32px; } .color-black { color: #2e3136; } .color-gray { color: #81868e; } .color-white { color: #fff; } /*flex常用*/ .flex { display: flex; flex-wrap: wrap; justify-content: space-between; } .flex-1 { flex: 1; } /*text常用*/ .text-left { text-align: left; } .text-center { text-align: center; } /*hover阴影*/ .hover { -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } .hover-shadow-middle:hover { box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .hover-shadow-bottom:hover { box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); } .hover-shadow-big:hover { box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); } /*Swiper*/ .swiper-pagination-bullet, .swiper-button-prev, .swiper-button-next { outline: none !important; } .nopos { position: static !important; } .swiper-pagination.w10 .swiper-pagination-bullet { width: 10px; height: 10px; background-color: #aaaaaa; opacity: 1; } .swiper-pagination.w10 .swiper-pagination-bullet-active { background: #ff7800; } .swiper-pagination.ps { position: static; line-height: 1; } /*index banner*/ .banner { position: relative; height: 100%; } .banner .swiper-slide { overflow: hidden; } .banner .swiper-slide a { display: block; /*height: 0; padding-bottom: 39.84375%;*/ } .banner .swiper-button-next, .banner .swiper-button-prev { left: 50%; bottom: 0; top: auto; width: 68px; height: 68px; cursor: pointer; margin-top: 0; opacity: .9; /*background: url(../images/btn-prev.png) no-repeat center #8c8c8c; */ -webkit-transition: .4s; -o-transition: .4s; transition: .4s; } .banner .swiper-button-next { right: auto; margin-left: 720px; background-color: #1d3268; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .banner .swiper-button-prev { margin-left: 652px; } .banner .swiper-button-next:hover, .banner .swiper-button-prev:hover { opacity: 1; } .banner .swiper-pagination { bottom: 30px !important; } .banner .swiper-pagination .swiper-pagination-bullet { margin: 0 7px; width: 18px; height: 18px; border-radius: 50%; background-color: #ffffff; border: solid 2px #313131; opacity: 1 !important; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; position: relative; } .banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #d1251c; border-color: #d1251c; } @media (max-width: 1280px) { .banner .swiper-pagination { bottom: 20px !important; } } @media (max-width: 768px) { .banner .swiper-pagination { bottom: 10px !important; } .banner .swiper-pagination .swiper-pagination-bullet { width: 8px; height: 8px; margin: 0 5px; } .banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 8px; } .banner .swiper-slide img { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } } /*内页banner*/ .page-banner { position: relative; overflow: hidden; } .page-banner .pb-pic { overflow: hidden; height: 0; padding-bottom: 27.8645%; background: #f6f6f6; } .page-banner .pb-pic img { width: 100%; -webkit-animation: SlickIn 1s; animation: SlickIn 1s; } @-webkit-keyframes SlickIn { 0% { -webkit-transform: scale(1.1, 1.1) } 100% { -webkit-transform: scale(1, 1) } } @-webkit-keyframes SlickOut { 0% { -webkit-transform: scale(1, 1) } 100% { -webkit-transform: scale(.9, .9) } } @keyframes SlickIn { 0% { transform: scale(1.1, 1.1) } 100% { transform: scale(1, 1) } } @keyframes SlickOut { 0% { transform: scale(1, 1) } 100% { transform: scale(.9, .9) } } .page-banner .pb-tit { position: absolute; top: 50%; left: 50%; z-index: 2; margin-left: -700px; margin-top: -96px; width: 527px; height: 192px; background-color: #cd241b; color: #fff; display: flex; align-items: center; padding-left: 32px; font-size: 38px; line-height: 1.3; font-weight: bold; color: #ffffff; } .page-banner .pb-tit span { font-size: 22px; } @media (max-width: 1800px) { .page-banner .pb-tit { margin-left: -600px; } } @media (max-width: 1280px) { .page-banner .pb-tit { margin-left: -500px; } } @media (max-width: 1024px) { .page-banner .pb-tit { margin-left: 0; left: 4%; } } @media (max-width: 768px) { .page-banner .pb-pic { height: auto; padding-bottom: 0; height: 150px; } .page-banner .pb-tit { margin-top: -25px; } } @media (max-width: 640px) { .page-banner .pb-pic img { -webkit-animation: none; animation: none; width: auto; height: 100%; max-width: none; transform: scale(1.3); } } /*大标题*/ .com-title { padding-top: 85px; padding-bottom: 50px; text-align: center; } .com-title.tab { padding-bottom: 42px; } .com-title.text-l { text-align: left; } .com-title .tit { font-size: 36px; color: #333; line-height: 1; } .com-title.white .tit, .com-title.white .subtit { color: #fff; } .com-title.min .tit { font-size: 28px; } .com-title .subtit { font-size: 18px; color: #7e7e7e; line-height: 1; margin-top: 20px; } .com-title .en { margin-top: 12px; font-size: 14px; color: #D5D5D5; line-height: 1; text-transform: uppercase; } .com-title.white .en { color: rgba(255, 255, 255, .3); } .com-title .des { margin-top: 18px; font-size: 16px; color: #333; line-height: 1.2; } /*分页*/ .com-page { padding-top: 70px; padding-bottom: 70px; } /*分页*/ .pagination { text-align: center } .a1_page { display: none !important; } .pagination a, .pagination span { padding: 0 16px; display: inline-block; margin: 0 5px; min-width: 40px; line-height: 40px; font-size: 16px; -webkit-transition: .2s; -moz-transition: .2s; transition: .2s; color: #454545; background: #d6d6d6; } .pagination .page-item { padding: 0 20px; } .pagination .cur_page, .pagination .page-num-current, .pagination a:hover { color: #fff !important; background: #cf271e !important; } .pagination .prev_disabled:hover, .pagination .next_disabled:hover { color: #576077 !important; } .pagination a.prev:before, .pagination a.prev_disabled:before { content: "上一页"; } .pagination a.next:before, .pagination a.next_disabled:before { content: "下一页"; } /*数字滚动*/ .num-scroll-two { font-size: 0; text-align: center; height: 100%; flex-wrap: nowrap; } .num-scroll-two li { position: relative; display: inline-block; color: #fff; text-align: left; } .num-scroll-two li~li { margin-left: 100px; } .num-scroll-two li .num-cont { color: #1b202e; font-size: 72px; line-height: 1; position: relative; font-weight: bold; display: inline-block; vertical-align: bottom; } .num-scroll-two li .num-cont .num { display: inline-block; line-height: 1; color: #333; font-size: 72px; font-family: DIN-Medium; position: relative; top: 2px; } .num-scroll-two li .num-cont b { font-size: 50px; } .num-scroll-two li .num-cont i { font-style: normal; font-weight: 400; position: absolute; right: -38px; top: 10px; font-size: 14px; color: #333; } .num-scroll-two li .num-tit { font-size: 16px; color: #595757; margin-top: 35px; } @media (max-width: 1280px) { .num-scroll-two li .num-cont .num { font-size: 40px; } } @media (max-width: 768px) { .num-scroll-two { flex-wrap: wrap; } .num-scroll-two li .num-cont { display: block; } .num-scroll-two li .num-cont i { right: -20px; } .num-scroll-two li .num-cont .num { font-size: 34px; } } .com-pic-cont { position: relative; } .com-pic-cont .pic { width: 50%; } .com-pic-cont .pic.long { width: 63.85%; } .com-pic-cont .cont { position: absolute; left: 0; top: 0; width: 50%; height: 100%; overflow: hidden; background-color: #f7f7f7; padding-left: 97px; } .com-pic-cont .cont.center { width: 36.15%; padding-left: 0; } .com-pic-cont .cont h4 { font-size: 24px; color: #333333; line-height: 30px; } .com-pic-cont .cont .en { font-size: 16px; color: #333333; line-height: 27px; margin-top: 20px; } .com-pic-cont .cont.center .en { font-size: 14px; margin-top: 14px; line-height: 1; } /*通用分类*/ .com-cate li { position: relative; float: left; margin-left: 85px; } .com-cate li a { display: inline-block; color: #333333; } .com-cate li.on a, .com-cate li:hover a { color: #e32f18; } .com-cate li:before { border-bottom: 5px solid #e32f18; } .com-cate li:hover:before, .com-cate li.on:before { margin-left: -16px; width: 32px; } .page-btn { display: inline-block; width: 250px; line-height: 46px; text-align: center; background: #41AB03; color: #fff !important; border-radius: 5px; font-size: 24px; } /* kefu */ /* 在线客服样式 */ .sz-kefu { position: fixed; width: 50px; right: 0; top: 50%; z-index: 100; margin-top: -100px; } .sz-kefu ul li { width: 50px; height: 50px; float: left; position: relative; margin-bottom: 1px; font-size: 12px; line-height: 50px; } .sz-kefu ul li .sidebox { position: absolute; width: 50px; height: 50px; top: 0; right: 0; transition: all 0.3s; color: #fff; background: #cf271e; overflow: hidden; opacity: .8; } .sz-kefu ul li.kf2 .sidebox { /* background:#7fbb57; */ overflow: visible; } .sz-kefu ul li .sidebox:hover { opacity: 1; } .sz-kefu ul li .sidetop { width: 50px; height: 50px; line-height: 50px; display: inline-block; background: #222; transition: all 0.3s; opacity: .8; } .sz-kefu ul li .sidetop:hover { opacity: 1; } .sz-kefu ul li img { float: left; } .sz-kefu ul li .sidebox3 { font-size: 16px; } .sz-kefu ul li .kImg { padding: 13px; } .sz-kefu .kf_wx { position: absolute; top: 0; left: -140px; width: 110px; display: ; background: #fff; border: 1px solid #dadada; padding: 14px; line-height: 20px; color: #333; text-align: center; display: none; box-sizing: content-box; } .sz-kefu .kf_wx img { display: block; width: 110px; height: 110px; margin-bottom: 5px; float: none; } .sz-kefu .qq { height: 0; position: relative; z-index: 2; } .sz-kefu .qq .sidebox { border: 1px solid #cf271e; height: auto; border-radius: 5px 0 0 5px; width: 140px; background: #fff; opacity: 1; bottom: -50px; top: auto; text-align: center; padding-bottom: 5px; right: -150px; } .sz-kefu .qq h5 { height: 35px; line-height: 35px; background: #cf271e; font-weight: normal; color: #fff; font-size: 14px; padding: 0 10px; text-align: left; margin-bottom: 10px; } .sz-kefu .qq h5 i { float: right; cursor: pointer; transition: all 0.3s; position: relative; z-index: 5; } .sz-kefu .qq h5 i:hover { transform: rotate(90deg); } .sz-kefu .qq a { display: block; height: 32px; line-height: 30px; border-radius: 18px; border: 1px solid #cf271e; margin: 5px 15px } .sz-kefu .qq a:hover { color: #cf271e; } .m-show { display: none; } /*视屏播放弹窗样式*/ .video_shadow { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(0, 0, 0, .5); z-index: 1000; display: none; } .playnow { position: absolute; left: 50%; top: 50%; margin-left: -410px; margin-top: -286px; width: 820px; height: 550px; background-color: transparent; z-index: 1000; } .video_control { width: 820px; height: 500px; box-shadow: 0px 0px 20px 3px rgba(0, 0, 0, .5); } .video_control video { width: 100%; height: 100%; object-fit: fill; } .closevideo { position: absolute; right: -30px; top: -24px; font-size: 35px; color: #fff; cursor: pointer; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } .closevideo:hover { right: -35px; } /*返回顶部*/ #to-top { display: inline-block; width: 46px; height: 46px; background: url(../images/scrolltop.png) no-repeat center; text-align: center; text-decoration: none; z-index: 8; right: 20px; opacity: 0.7; -webkit-transition: .3s; -o-transition: .3s; transition: .3s; } #to-top:hover { opacity: 1; } /*移动端咨询*/ .menu-footer { display: none; width: 100%; height: 45px; line-height: 45px; text-align: center; background: rgba(0,0,0,0.7); font-size: 0; position: fixed; left: 0; bottom: 0; z-index: 99999; } .menu-footer a { position: relative; float: left; width: 50%; color: #fff; font-size: 14px; } .menu-footer img { width: 14px; margin-top: -2px; margin-right: 5px; } .menu-footer a ~ a:before { content: ""; position: absolute; left: 0; top: 50%; margin-top: -5px; height: 10px; border-left: 1px solid #a0a0a0; opacity: 0.5; } @media screen and (max-width: 760px) { #to-top { visibility: hidden; } .menu-footer { display: block; } .sz-kefu { display: none; } } /*---网站地图---*/ .sitemap-frame .site-box { border-bottom: 2px #666 solid; } .sitemap-frame .site-box .left { padding: 10px 20px; color: #fff; background: #555; } .sitemap-frame .site-box .left a { color: #fff; display: inline-block; } .sitemap-frame .site-box .right { color: #888; font-size: 13px; line-height: 35px; padding-left: 20px; } .sitemap-frame .site-box .right a { display: inline-block; color: #888; font-size: 13px; } .sitemap-frame .site-box .right a:hover { color: #1179a8 } .sitemap-frame .list { width: 100%; float: left; margin: 40px 0; display: table; } .sitemap-frame .list li { display: table-cell; text-align: center; } .sitemap-frame .list hr { width: 3px; height: 100%; border: none; background: #000; } .sitemap-frame .list h4 {} .sitemap-frame .list h4 a { display: block; color: #fff; font-size: 15px; padding: 10px 10px 10px 10px; border-bottom: 1px #ddd dotted; margin: 0 5px; background: #999; border-radius: 7px; } .sitemap-frame .list a:before { padding-right: 5px; } .sitemap-frame .list .box { padding: 20px 0 10px 0; clear: both; border-left: 1px #ddd solid; margin: 0 5px; } .sitemap-frame .list .box a { position: relative; display: block; color: #666; font-size: 13px; background: #ededed; padding: 10px 5px; margin: 0 0 20px 5px; border-radius: 5px; -webkit-transition: .1s; -o-transition: .1s; transition: .1s; } .sitemap-frame .list .box a:after { content: ""; position: absolute; left: -12px; top: 20px; width: 12px; height: 5px; display: block; background: #CACACA; /* border-radius: 50%; */ } .sitemap-frame .list a:hover { color: #fff; background: #1179a8 } .sitemap-frame .list a:hover:after {} @media (max-width: 1000px) { .playnow { left: 5%; top: 30%; margin-left: 0; margin-top: 0; width: 90%; height: auto; } .video_control { width: 100%; height: auto; box-shadow: none; } .closevideo { position: absolute; right: 0; top: -50px; font-size: 30px; color: #fff; cursor: pointer; } } @media (max-width: 768px) { .num-scroll-two li { width: 33%; margin-bottom: 15px; } .num-scroll-two li .num { font-size: 30px; } .num-scroll-two li .num-tit { font-size: 12px; margin-top: 0; } .num-scroll-two li:nth-child(4):before { display: none; } } /* WAP主导航 */ .wapNav { overflow-y: auto; height: 100%; opacity: 0; visibility: hidden; transform: translateX(-100%); transition: all 0.5s; background: #fff; width: 100%; position: fixed; left: 0; top: 60px; z-index: 40; padding: 0; } .wapNav.nav_on { opacity: 1; transform: translateX(0); visibility: visible; } .wapNav li { position: relative; } .wapNav li a { display: block; padding-left: 4%; color: #666; height: 45px; line-height: 45px; border-top: 1px solid #eee; position: relative; font-size: 16px; } .wapNav li i { font-family: "iconfont"; color: #ddd; font-size: 12px; font-style: normal; padding: 0 20px; position: absolute; right: 0; top: 0px; line-height: 50px; } .wapNav li.cur>a, .wapNav .cur>a:hover { background: #cf271e; color: #fff; } .wapNav li :hover i, .wapNav .cur i { color: #666; } .wapNav .navSub { display: none; background: #fff; } .wapNav .navSub li a { height: 40px; line-height: 40px; padding-left: 40px; font-size: 14px; } .wapNav .navSub ul { background: #050505; } .wapNav .navSub ul li a { height: 34px; line-height: 34px; padding-left: 60px; } .wapNav .menu { overflow: hidden; font-size: 0; border-top: 1px solid #eee; border-bottom: 1px solid #eee; } .wapNav .menu a { float: left; width: 50%; text-align: center; line-height: 45px; color: #fff; color: #454545; font-size: 16px; } .wapNav .menu a~a { border-left: 1px solid #eee; } .wapNav .menu a i { margin-right: 8px; position: relative; font-style: normal; color: #454545; font-size: 16px; } .wapNav .menu a:first-child i { font-size: 18px; } .wSearch { background: #f1f1f1; font-size: 14px; overflow: hidden; padding: 20px 4%; } .wSearch form { margin: 0 auto; background: #fff; height: 40px; overflow: hidden; padding-right: 60px; } .wSearch .sear_text { width: 100%; float: left; height: 40px; line-height: 40px; color: #666; padding-left: 10px; } .wSearch .sear_btn { float: left; width: 60px; height: 40px; line-height: 40px; cursor: pointer; text-align: center; background: #333; color: #fff; font-size: 14px; transition: all 0.3s; margin-right: -60px; } .wSearch .sear_btn:hover { background: #014099; } .sitemap-wrap { padding-top: 50px; padding-bottom: 80px; } /* 导航按钮 */ .navTrigger { width: 28px; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); overflow: hidden; white-space: nowrap; color: transparent; z-index: 20; cursor: pointer; display: none; margin-left: 40px; float: right; } .navTrigger span { display: block; height: 2px; background: #cf271e; margin-bottom: 6px; transition: all 0.3s; -webkit-transform-origin: 0% 50%; -moz-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; transform-origin: 0% 50%; -webkit-transition: .4s; -o-transition: .4s; transition: .4s; } .navTrigger span:nth-child(3) { margin-bottom: 0; } .navTrigger-on span:nth-child(1) { transform: translateY(0) rotate(45deg); } .navTrigger-on span:nth-child(2) { opacity: 0; } .navTrigger-on span:nth-child(3) { transform: translateY(0) rotate(-45deg) } @media (max-width: 1020px) { .navTrigger { display: block; } } /*百度分享*/ .bdshare-button-style0-32 { display: inline-block; vertical-align: middle; margin-top: -2px; } .bdshare-button-style0-32 a { filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(100%); }