锘緻charset "utf-8"; /* CSS reset */ body{font:12px/1.5 Arial, Helvetica, sans-serif} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre, form,fieldset,input,textarea,p,blockquote,th,td,a {padding: 0;margin: 0;} table {border-collapse: collapse; /*鍗曞厓鏍肩殑鍘嬬缉*/border-spacing: 0;margin: 0;padding: 0;} fieldset,img {border: 0;} address,caption,cite,code,dfn,em,var {font-weight: normal;font-style: normal;} ol,ul {list-style: none;} caption,th {text-align: left;} h1,h2,h3,h4,h5,h6 {font-weight: normal;font-size: 1rem;} q:before,q:after {content:'';} abbr,acronym { border: 0;} a{text-decoration: none;color: #333;outline:none!important;} i{font-style: normal;} .form-control{box-shadow: none!important;} button{box-shadow: none!important;} .fs14{font-size: 14px;} .tc{text-align: center;} .c01{color:#B5323F;} .c02{color: #B12433;} .bac01{background-color:#F2F2F2; } .btn{border-radius: 0;outline: none;font-size: 1.125rem;} .btn:focus{outline: none;box-shadow: none;} .btn-danger {padding: 0.5rem 2rem;color: #fff;background-color: #B12433;border-color: #B12433;} .btn-light{color:#B12433;background-color: #fff;border-color: #fff;} .btn-outline-danger {color: #B12433;border-color: #B12433;} .btn-outline-warning{color: #EF6B11;border-color: #EF6B11;} .nav-item{outline:none!important;} .sticky-top{z-index: 99;} .line-responsive{overflow-x: auto;} .line-responsive-content{min-width: 100%;} /*鍗曡鐪佺暐*/ .ell {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} /*澶氳鐪佺暐*/ .ells_2 {display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;} .ells_3 {display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;} /*閾炬帴涓嬪垝绾?/ .btm-line{position: relative;} .btm-line:after { position: absolute; bottom: -2px; left: 0; content: ""; height: 1px; background-color: inherit; width: 0; transition: width 0.5s; } /*鍥剧墖鏀惧ぇ*/ .img-scale{overflow:hidden;} .img-scale img{transition: all .5s;width:100%;} /*鏂囩珷鍥剧墖*/ .article img{ max-width:100%; height:auto!important; } .lh275 { line-height: 2.75rem; } /*椤堕儴鏍?/ .head { background-color: #fff; border-bottom: solid 1px #D9D9D9; } .topbar{ padding:15px 0; background-color: #F7F7F7; border-bottom: solid 1px #D9D9D9; } .topbar .logo img{ height: 40px; } .topbar .logo span{ font-weight: bolder; vertical-align: sub; } .topbar .share{ float: right; padding-top: 5px; } .topbar .share a{ display: inline-block; width: 30px; height: 30px; margin-right: 1rem; background-image: url(/imgs/icons-share-s.png); background-repeat: no-repeat; overflow: hidden; } .share .popover-body{ padding:.5rem; } .share-dy { background-position-x: 0; } .share-video{ background-position-x:-51px; } .share-wx{ background-position-x:-100px; } .share-zh { background-position-x: -150px; } .share-cart { background-position-x: -200px; } /*鑿滃崟*/ .menu{ position: relative; padding-top:0; padding-bottom: 0; } .menu>.container-fluid{ padding: 0; } .menu .nav-item{ margin-right: 2rem; padding-top: .5rem; padding-bottom: .5rem; } .menu .nav-item:first-child{ padding-left: 0; } .menu .nav-item-full{ position: initial; } .menu .navbar-nav .nav-link.active{ color: #AF1E2E; } .menu .nav-item-full .dropdown-menu{ width:100%; left: 0; transform: translateY(60px) translateX(0); } .menu .navbar-nav .nav-item .nav-link { position: relative; font-weight: bolder; color: #212529; font-size:1rem; } .menu .navbar-nav .nav-item:first-child .nav-link{ padding-left:0; } .menu .navbar-nav .nav-item:hover .nav-link{ color: #AF1E2E; } .menu .navbar-nav .nav-item:hover .nav-link::after{ content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: block; width: 52px; height: 3px; background-color: #AF1E2E; } .menu .navbar-nav .nav-item:hover .dropdown-menu { left: 50%; z-index: 999; transform: translateY(10px) translateX(-50%); opacity: 1; /*box-shadow: 0px 15px 10px 0px #ccc;*/ box-shadow: 0px 15px 30px 0px rgba(47, 55, 73, 0.1); height: auto; } .menu .navbar-nav .nav-item .dropdown-menu{ z-index: -1; left: 50%; display: block; opacity: 0; height: 0; border:none; padding: 0; background-color: #fff; overflow: hidden; transition: all .5s; transform: translateY(60px) translateX(-50%); border-radius: 0; /*background: linear-gradient(139deg, #F8F3F2 0%, #F8F3F2 0%, #FFFFFF 100%, #FFFFFF 100%) #F7F7F7;*/ } .menu .navbar-nav .nav-item.curr .nav-link { color: #AF1E2E; } /*.menu .navbar-nav .nav-item.curr .nav-link::after{ content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: block; width: 52px; height: 3px; background-color: #AF1E2E; }*/ .menu .nav-item .nav-products{ background:#fff; } .nav-products-l { float: left; width: 245px; height: 100%; min-height: 414px; padding: 1.125rem 0 .5rem 2rem; background: linear-gradient(139deg, #F8F3F2 0%, #F8F3F2 0%, #FFFFFF 100%, #FFFFFF 100%) #F7F7F7; } .nav-products-l li{ margin-top: .5rem; } .nav-products-c{ float: left; width:calc(100% - 575px); padding:2rem 3rem; } .nav-products-c>.row{ display:none; } .nav-products-c .col{ margin-bottom: 2rem; } .nav-products-c .col>p{ position: relative; font-weight: bolder; padding-bottom: 1rem; } .nav-products-c .col>p::after { content: ''; position: absolute; bottom: 0; display: block; width:152px; height: 1px; background-color: #E6E6E6; } .nav-products-c li{ margin-top: 1rem; line-height: 1; } .nav-products-c li a{ color: #666666; font-size: .875rem; } .nav-products-c li a.active,.nav-products-c li a:hover{ color:#AF1E2E; font-weight: bolder; } .nav-products-r{ position: relative; float: left; width: 330px; min-height: 350px; margin:2rem 0; padding:0 3rem 1rem 3rem; border-left: solid 1px #E6E6E6; text-align: center; } .nav-products-r img{ width:100%; height: 120px; object-fit: cover; } .nav-products-r>p{ margin-top: 1rem; color:#B5323F; } .nav-products-r>div{ margin-top: 1rem; font-size: 12px; line-height: 20px; } .nav-products-r p>a{ color:#AF1E2E; } .nav-products-r .btn{ position: absolute; bottom: .5rem; left: 50%; transform: translateX(-50%); } .menu .nav-item .dropdown-menu.nav-applications{ padding:0 8rem 0 2rem; } .nav-applications >.row{ margin:1rem 0; } .nav-applications .card { /*min-height: 10rem;*/ padding: 1rem; border: none; border-radius: 0; background: transparent; } .nav-applications .card-body{ position: relative; padding: 0 0 1.25rem 1.25rem; height: 100%; } .nav-applications .card:hover{ background-color: #F0ECEB; } .nav-applications .card img{ height: 7.5rem; min-width: 100%; object-fit: cover; } .nav-applications .card-title{ font-size: 1rem; font-weight: bolder; } .nav-applications .card-text{ margin-top: .25rem; line-height: 1.4; } .nav-applications .card-text a{ font-size: .875rem; color: #666666; } .nav-applications .card-text a:hover{ color: #B0212F; } .nav-applications .card-link{ position: absolute; bottom: 0; left: 1.25rem; font-size: .875rem; color:#B0212F; } .nav-applications .card-link .iconfont{ font-size: 12px; } .menu .navbar-nav .nav-item-simple .dropdown-menu{ padding:1rem 1.5rem 1rem 1rem; background: linear-gradient(139deg, #F8F3F2, #FFFFFF); } .menu .navbar-nav .nav-item-simple .dropdown-menu .arrow-l:hover::before{ left: 10px; top: 7px; } /*鍙充晶鎼滅储+閾炬帴*/ .menu .navbar-collapse>.nav-item .dropdown-menu{ margin-top: 0; } .menu .nav-search{ padding: 0; } .nav-search .icon-search{ font-size: 20px; vertical-align: middle; } .nav-search .show .icon-search::before{ content: '\eaf2'; } .nav-search .dropdown-menu{ left: 50px; transform: translateX(-100%); width:26.25rem; padding: 1.5rem 2rem; border-color:#E6E6E6; border-radius: 0; box-shadow: 0px 15px 30px 0px rgba(47, 55, 73, 0.1); } .nav-search .dropdown-menu .btn{ width: 100%; } .nav-search .nav-link:first-child{ position: relative; } .nav-search .nav-link:first-child::after{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); content: ''; display: block; width:1px; height: 20px; background-color: #ccc; } .nav-search .btn{ border-radius: 4px; font-weight: bolder; font-size:14px; } .nav-search a{ color: #666666; font-size: .875rem; } .nav-search>a{ line-height: 2.75rem; } .nav-link-cn img{ margin-right: .5rem; vertical-align: text-bottom; } .arrow-l{ position: relative; padding-left: 15px; font-family: "iconfont" !important; font-size: 12px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .arrow-l::before{ content: '\e662'; display: block; position: absolute; left: 0; top: 3px; font-weight: bold; opacity: 0; } .arrow-l a{ font-size: 1rem; font-family: 'Arial'; } .arrow-l.active a,.arrow-l:hover a{ color:#AE1D2C; background-color: transparent!important; } .arrow-l.active::before, .arrow-l:hover::before{ color:#AE1D2C; opacity: 1; } /*瀵艰埅娴嬭瘯*/ /*.menu .nav-item .dropdown-menu.nav-applications{ z-index: 999; transform: translateY(8px); opacity: 1; box-shadow: 0px 15px 30px 0px #2F3749; height: auto; }*/ /*鑷畾涔夎疆鎾璼wiper 搴曢儴鍒嗛〉 绫诲悕[swiper-bottom] 宸﹀彸缈婚〉 绫诲悕[swiper-page] */ .swiper-page .swiper-button-next, .swiper-page .swiper-button-prev { width: 2.5rem; height: 5.5rem; margin-top: calc(0px - 43px - 1rem); background: rgba(128, 128, 128, .4); color: #B12433; font-size: 12px; transition: background .5s; } .swiper-page .swiper-button-next{ right: 0; } .swiper-page .swiper-button-prev{ left: 0; } .swiper-page .iconfont{ font-size: 1.75rem; } .swiper-bottom{ padding-top: 2rem; padding-bottom: 4rem; } .swiper-bottom .swiper-pagination-bullet{ width:40px; height: 5px; border-radius: 0; color: #d9d9d9; } .swiper-bottom .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #B12433; } .swiper-bottom .swiper-button-next:after, .swiper-bottom .swiper-button-prev:after{ display: none; } /*footer*/ .footer{ background-color: #33373C; color:#fff; font-size: 14px; } .footer footer{ padding-top:3rem; padding-bottom:2.25rem; } .footer h6{ font-size: 1.125rem; text-transform: uppercase; } .footer h6+span{ display: inline-block; margin-top: .5rem; padding-bottom: 1.5rem; line-height: 10px; color: rgba(255, 255, 255, .2); font-size: 1.75rem; } .footer a{ color: #FFFFFF; } .footer .nav-item a{ font-size: 14px; line-height: 2.25rem; } .footer .btm-line::after{ background-color: #fff; } .footer input,.footer input:focus,.footer textarea,.footer textarea:focus{ color:#fff; border-color: rgba(255, 255, 255, .2); background-color: transparent; } .footer input,.footer textarea{ max-width: 235px; } .footer .col5 li{ min-height: 40px; margin-bottom: .625rem; padding-left: 50px; position: relative; } .footer .pt8{ padding-top: 8px; } .footer .iconfont{ position: absolute; left: 0; top: 0; display: inline-block; width: 39px; height: 39px; line-height: 39px; text-align: center; border:solid 1px rgba(255, 255, 255, .2); } .footer .btn{ width:120px; font-size: 14px; background-color: #5C5F63; border-color: #5C5F63; border-radius: 4px; color: #fff; border-color: #5C5F63; } /*椤佃剼閾炬帴copy绛?/ .botbar{ padding-top: 2.5rem; padding-bottom: 2.5rem; line-height: 30px; color: #fff; background-color: #26292D; } .botbar .share { padding-bottom: 1rem; color: rgba(255,255,255,.3); font-size: 1.125rem; border-bottom: solid 1px rgba(255,255,255,.1); } .botbar .share a{ margin-left:2rem; color:rgba(255,255,255,.7); font-size: .875rem; } .botbar .share a span { display: inline-block; width: 30px; height: 30px; margin-right: 1rem; background-image: url(/imgs/icons-share-s.png); background-repeat: no-repeat; vertical-align:middle; overflow: hidden; } /*.bshare{ padding-bottom: 1rem; color: rgba(255,255,255,.3); font-size: 1.125rem; border-bottom: solid 1px rgba(255,255,255,.1); } .bshare>span{ display: inline-block; margin-right: 2rem; vertical-align: top; } .bshare a{ display: inline-block; height: 30px; margin-left: 1.5rem; margin-right: 1.5rem; background-image: url(/imgs/icons-share.png); background-repeat: no-repeat; } .bshare-facebook{ width: 88px; background-position-x: 0; } .bshare-twitter{ width: 105px; background-position-x: -138px; } .bshare-youtube{ width: 68px; background-position-x: -290px; } .bshare-linked{ width: 91px; background-position-x: -407px; }*/ .botbar-links{ text-align: center; margin-top: 1.5rem; font-size: 14px; color: rgba(255,255,255,.5); } .botbar-links a{ margin-left: 5px; margin-right: 5px; /*font-weight: bolder;*/ color: rgba(255,255,255,.5); } .botbar-copy{ margin-top: .5rem; line-height: 1; text-align: center; font-size: 14px; color: rgba(255,255,255,.3); } .botbar-copy a{ color: rgba(255,255,255,.3); } /*闈㈠寘灞?/ .breadcrumb{ padding-top:.5rem; padding-bottom: .5rem; font-size: 14px; color:#B3B3B3; margin-bottom: 0; } .breadcrumb .iconfont{ margin-right: 5px; font-size: 12px; color: #ccc; } .breadcrumb-item + .breadcrumb-item::before,.breadcrumb .breadcrumb-item a,.breadcrumb-item.active{ color:#B3B3B3; } /*浜岀骇椤甸潰banner*/ .banner-sec{ height: 300px; } .banner-sec img{ object-fit: cover; height: 100%; max-width: 100%; } /*鍒嗛〉 page-new 2024*/ .page-new { margin-top: 1rem; margin-bottom: 1rem; } .page-new li a { display: block; margin-left: .2rem; margin-right: .2rem; padding: .5rem .75rem; line-height: 1; text-align: center; font-size: 1.125rem; color: #000000; border: solid 1px #CCCCCC; } .page-new .page.active a { border-color: #AA1222; background-color: #AA1222; } .page-new .page.active a{ color: #fff!important; } .page-new .pagination .disabled a { color: #ccc !important; cursor:not-allowed; } /*鍒嗛〉 page*/ .page .page-item{ margin-left: .2rem; margin-right: .2rem; } .page .page-item .page-link { width:2.5rem; height:2.5rem; padding:0; line-height: 2; text-align: center; font-size: 1.125rem; border-radius: 0!important; } .page .page-item .page-link{ color: #000000; border-color: #CCCCCC; box-shadow: none!important; cursor:pointer; } .page .page-item.active .page-link { color: #fff!important; border-color: #AA1222; background-color: #AA1222; } /*浜岀骇瀵艰埅锛屽仠鐣欏湪椤堕儴*/ .nav-sec{ background: #FFFFFF; box-shadow: 0px 15px 30px 0px #ddd; } .nav-sec .nav-link{ margin-left: 3rem; margin-right: 3rem; padding-top: 1rem; padding-bottom: 1rem; color: #000; font-size: 1.125rem; } .nav-sec .nav-link.active{ color: #AA1222; font-weight: bolder; } /*浜岀骇椤甸潰涓讳綋瀹藉害*/ .content-sec{ padding-left: 6rem; padding-right: 6rem; } /*鏂囩珷*/ .article{ line-height: 2rem; } .article img{ max-width: 100%; } /*璀﹀憡妗?/ .alert-wrap{ position: fixed; top: 50px; right: -1000px; z-index: 1100; transition: all .4s; max-width: 400px; text-align: right; } .alert-wrap.show{ right:20px; } .alert-wrap .alert{ display: inline-block; max-width: 100%; min-width: 200px; line-height: 1.5rem; text-align: left; } .alert-wrap .alert-dismissible .btn-close{ top: 1.125rem; right: 1rem; padding: 0; box-shadow: none!important; } /*琛ㄦ牸澶撮儴娣辫壊*/ .table-head-dark thead{ border-color: #000; } .table-head-dark thead th{ text-align:center; color: #fff; border-color: #000; background-color:#000000; box-shadow: none; } /*渚ц竟鏍?/ .sidebar{ z-index: 99; position: fixed; top: 45%; right: 0; transform: translateY(-100%); } .sidebar>.btn{ display: block; padding-top: .25rem; padding-bottom: .25rem; margin-top: 2px; border-color: #D9D9D9; background-color: #fff; } .sidebar>.btn>.iconfont{ font-size: 1.75rem; color: #B12433; } .sidebar>.btn.curr,.sidebar>.btn:hover{ border-color: #B12433; background-color: #B12433; } .sidebar>.btn.curr>.iconfont,.sidebar>.btn:hover>.iconfont{ color: #fff; } .sidebar .popover{ border-radius: 0; min-width: 280px; border:solid 3px #B12433; } .sidebar .popover-arrow{ opacity: 0; } .sidebar .skype{ position: absolute; top: -5px; right: 0; display: inline-block; color: #999999; font-size: 13px; cursor: pointer; } /*.sidebar .icon-skype::before{ margin-right: 4px; color:#B12433; font-size: 1.125rem; vertical-align: middle; } .sidebar .icon-skype:hover{ color:#B12433; }*/ .skype-big{ display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 2rem; text-align: center; background-color: rgba(255,255,255,.95); box-sizing:border-box; } .skype-big img{ max-width: 100%; } .skype-big p{ margin-top: .5rem; text-align: center; } .skype-big .iconfont{ position: absolute; top: .5rem; right: .5rem; font-size: 1.25rem; color: #B12433; cursor: pointer; } .qqlist a { display: block; padding: 1rem 0; border-bottom: solid 1px #F2F4F7; line-height: 22px; } .qqlist a img{ margin-right:.75rem; } .qqlist a span{ float:right; color:#666666; } .qqlist .iconfont { color:#E6E6E6; } .qqlist a:hover, .qqlist a:hover span, .qqlist a:hover .iconfont { color: #B12433; } .qqlist li:last-child a{ border-bottom:none; } .sidebar .popover-message { display: none; position: absolute; inset: 0px 0px auto auto; width: 276px; margin: 0px; transform: translate(-62px, 0); } .sidebar .popover-message.show{ display: block; } .popover-message .popover-body{ padding:0; } .popover-message .form-control{ font-size: .875rem; } .popover-message .btn{ width: 50%; border-radius: 4px; } .help{ position: relative; margin-top: .5rem; padding: 1.5rem; background-color: #B12433; } .help::before { position: absolute; top: 0; left: 1.5rem; display: block; content: ""; width: 0; height: 0; border-color: transparent; border-style: solid; right: 0; border-width: .5rem .5rem 0 .5rem; border-top-color: #fff; } .help-text{ font-size: 1rem; font-style: italic; color: rgba(255,255,255,.7); } .help-phone{ margin-top: .75rem; font-size: 1.25rem; font-weight: bolder; color: #fff; } .gotop{ display: none; position: fixed; bottom: 2rem; right: 0; z-index: 99; padding-top: 0.25rem; padding-bottom: 0.25rem; border-color: #D9D9D9; background-color: #fff; } .gotop .iconfont{ font-size: 1.5rem; color:#B12433; } /*鏈塰over*/ @media (any-hover:hover){ a:not(.btn):hover {color: #B5323F!important;} .btn-danger:hover{background-color: #a51625;} .btn-light:hover{color:#fff;background-color: #B12433;border-color: #B12433;} .btn-outline-danger:hover{background-color: #B12433;border-color: #B12433;} .btn-outline-warning:hover{color: #fff;border-color: #EF6B11;background-color: #EF6B11;} .btm-line:hover:after {width: 100%;} .btm-line:not(.btn):hover{color:inherit!important;} .img-scale:hover img{transform: scale(1.1);} .arrow-l:hover a{ color:#AE1D2C; background-color: transparent!important; } .arrow-l:hover::before{ color:#AE1D2C; opacity: 1; } .swiper-page .swiper-button-next:hover, .swiper-page .swiper-button-prev:hover{ background: rgba(128, 128, 128, .6); } .footer .btn:hover{ background-color: #B12433; border-color: #B12433; } .share a:hover { background-position-y: -40px; } .botbar .share a:hover { color: rgba(255,255,255,1) !important; } .botbar .share a:hover span { background-position-y: -40px; } .botbar-links a:hover{ color: rgba(255,255,255,1); } .breadcrumb-item a:hover{ color:#B12433; } .page .page-link:hover,.page .page-link:focus { background-color: #F7E8E9; } .gotop:hover{ border-color:#B12433; } .gotop:hover .iconfont { color: #fff; } }