@charset "utf-8"; /* CSS Document */ :root{ --theme-color:#f08200; } a:active, a:hover { color: var(--theme-color); text-decoration: none; } a:hover, a:focus { color: var(--theme-color); text-decoration: underline; } .container { width: 100%; max-width: 100%; } .fa_ani * { transition: all 0.5s; -moz-transition: all 0.5s; /* Firefox 4 */ -webkit-transition: all 0.5s; /* Safari 鍜 Chrome */ -o-transition: all 0.5s; /* Opera */ } .fa_ani *:before { transition: all 0.5s; -moz-transition: all 0.5s; /* Firefox 4 */ -webkit-transition: all 0.5s; /* Safari 鍜 Chrome */ -o-transition: all 0.5s; /* Opera */ } .fa_ani *:after { transition: all 0.5s; -moz-transition: all 0.5s; /* Firefox 4 */ -webkit-transition: all 0.5s; /* Safari 鍜 Chrome */ -o-transition: all 0.5s; /* Opera */ } a { cursor: pointer; } body, html { overflow-x: hidden !important; } a:focus, a:active, a:hover, a:visited { outline: none !important; text-decoration: none; } i { font-style: normal; } /* .w_grid-000 > div > .p_gridbox { overflow: visible; } .w_grid-000 > div > .p_gridbox:before, .w_grid-000 > div > .p_gridbox:after { clear: both; display: table; content: " "; min-height: 0px; } */ .fa_clearfix:before, .fa_clearfix:after { display: table; clear: both; content: ""; } .fa_imgbig { overflow: hidden; width: 100%; } .fa_imgbig:hover img { transform: scale(1.2); -ms-transform: scale(1.2); /* IE 9 */ -webkit-transform: scale(1.2); /* Safari 鍜 Chrome */ -o-transform: scale(1.2); /* Opera */ -moz-transform: scale(1.2); /* Firefox */ } .fa_flexline { display: -webkit-box; /* 鑰佺増鏈娉旡 Safari, iOS, Android browser, older WebKit browsers. */ display: -moz-box; /* 鑰佺増鏈娉旡 Firefox (buggy) */ display: -ms-flexbox; /* 娣峰悎鐗堟湰璇硶: IE 10 */ display: -webkit-flex; /* 鏂扮増鏈娉旡 Chrome 21+ */ display: flex; /* 鏂扮増鏈娉旡 Opera 12.1, Firefox 22+ */ -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; -moz-flex-wrap: nowrap; flex-wrap: nowrap; } .fa_flexwrap { display: -webkit-box; /* 鑰佺増鏈娉旡 Safari, iOS, Android browser, older WebKit browsers. */ display: -moz-box; /* 鑰佺増鏈娉旡 Firefox (buggy) */ display: -ms-flexbox; /* 娣峰悎鐗堟湰璇硶: IE 10 */ display: -webkit-flex; /* 鏂扮増鏈娉旡 Chrome 21+ */ display: flex; /* 鏂扮増鏈娉旡 Opera 12.1, Firefox 22+ */ -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; -moz-flex-wrap: wrap; flex-wrap: wrap; } .fa_flex_between { -webkit-box-pack: justify; -moz-justify-content: space-between; -webkit-justify-content: space-between; justify-content: space-between; } .fa_flex_Xend { -webkit-box-pack: end; -moz-justify-content: flex-end; -webkit-justify-content: flex-end; justify-content: end; } .fa_flex_Xcenter { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } .fa_flex_Yend { -webkit-align-items: flex-end; align-items: flex-end; } .fa_flex_Ycenter { -webkit-box-align: center; -moz-align-items: center; -webkit-align-items: center; align-items: center; } .fa_centerY { position: relative; top: 50%; /*鍋忕Щ*/ transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); } .fa_textoverflow { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; opacity: 1; text-transform: uppercase; } .fa_Img { position: relative; width: 100%; overflow: hidden; } .fa_Img img { position: absolute; width: auto; max-width: 100%; max-height: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: all 0.5s; height: auto; } .container { width: 100%; margin: 0; padding: 0; } .p_NewsDetail img { max-wight: 100%; } /*鍐呴〉瀵艰埅*/ .p_problemCategory { /* display: none; */ } .fa_PageNav { font-size: 0; text-align: left; } .fa_PageNav a { position: relative; font-size: 16px; height: 80px; line-height: 80px; padding: 0px 30px; color: #222; display: inline-block; transition: 0.3s ease 0s; } .fa_PageNav a:hover, .fa_PageNav a.fa_navon { color: var(--theme-color); opacity: 1; } .fa_PageNav a:last-child { margin-right: 0; } .fa_PageNav a:first-child:after { display: none; } .fa_PageNav a:before { position: absolute; left: 50%; width: 0%; height: 3px; background: var(--theme-color); bottom: 0; content: ""; transform: translateX(-50%); transition: all 0.5s; display: block; } .fa_PageNav a:hover:before { width: 80%; } .fa_PageNav a.fa_navon:before { width: 80%; } /*鍏宠仈浜у搧*/ .fa_Related>a { display: block; width: calc((100% - 60px)/4); float: left; padding: 20px; margin-right: 20px; } .fa_Related>a:last-child { margin-right: 0; } .fa_Related>a img { width: 100%; } .fa_Related>a p { margin-top: 20px; font-size: 18px; text-align: center; color: #333; } /**/ .fa_AbList { margin: 80px 0 30px; } .fa_AbList h3 { font-size: 24px; color: #333; font-weight: 300; margin-bottom: 30px; } .fa_AbList .fa_Abli { display: block; width: calc((100% - 60px) / 4); margin-right: 20px; margin-bottom: 20px; background: #fafafa; } .fa_AbList .fa_Abli .fa_ABli_img { overflow: hidden; width: 100%; } .fa_AbList .fa_Abli .fa_ABli_img img { width: 100%; transition: all 0.5s; } .fa_AbList .fa_Abli:nth-child(4n) { margin-right: 0; } .fa_AbList .fa_Abli:hover img { transform: translate(-50%, -50%) scale(1.2); -ms-transform: scale(1.2); /* IE 9 */ -webkit-transform: translate(-50%, -50%) scale(1.2); /* Safari 鍜 Chrome */ -o-transform: translate(-50%, -50%) scale(1.2); /* Opera */ -moz-transform: translate(-50%, -50%) scale(1.2); /* Firefox */ } .fa_AbList .fa_Abli .fa_ABli_tit { padding: 20px 15px; color: #333; width: 100%; text-align: center; text-transform: capitalize; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .fa_PageCate .fa_CateTit h3 { font-size: 30px; font-weight: bold; margin-bottom: 10px; color: var(--theme-color); text-align: center; } .fa_PageCate .fa_CateTit article { font-size: 16px; line-height: 2; margin: auto; max-width: 800px; color: #666; width: 80%; text-align: center; } .fa_PageCate { margin-bottom: 30px; } .fa_l4 { display: block; width: calc((100% - 60px) / 4); margin-right: 20px; margin-bottom: 20px; } .fa_l4:nth-child(4n) { margin-right: 0; } .fa_l3 { display: block; width: calc((100% - 60px) / 4); margin-right: 20px; margin-bottom: 20px; } @media screen and (min-width:769px) { .fa_l3:nth-child(4n) { margin-right: 0; } .fa_pchide { display: none!important; } .fa_100vh { height: 100vh; } } .fa_More a { display: inline-block; padding: 10px 30px; background: #000000; transition: all 0.5s; min-width: 120px; text-align: center; } .fa_More a:hover { background: var(--theme-color); } .fa_More a span { display: inline-block; padding-left: 50px; transition: all 0.5s; position: relative; line-height: 10px; } .fa_More a:hover span { padding-left: 25px; } .fa_More a span i { font-size: 12px; vertical-align: middle; opacity: 1; transform: scaleX(2); color: #fff; } .fa_More a span:before { position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: #fff; content: ""; display: block; height: 1px; width: auto; right: 4px; opacity: 1; } .fa_More2 { text-align: center; } .fa_More2 a { display: inline-block; min-width: 260px; height: 60px; text-align: center; transition: all 0.5s; position: relative; overflow: hidden; line-height: 60px; } .fa_More2 a span { position: relative; z-index: 10; transition: all 0.5s; display: block; } .fa_More2 a span:before { content: "GO鈬?; position: absolute; transform: translate(-50%, 50%); left: 50%; top: 50%; display: block; width: 100%; color: #fff; font-size: 18px; } .fa_More2 a:hover span { transform: translateY(-100%); } .fa_More2 a:before { background: rgba(255, 255, 255, 0.8); display: block; width: 100%; height: 100%; position: absolute; content: ""; border-radius: 10px; transition: all 0.5s; left: 50%; transform: translateX(-50%); } .fa_More2 a:hover:before { width: 60%; background: rgba(1, 78, 146, 0.9); } .fa_More2 a:hover { color: #fff; } .fa_More2 a:after { position: absolute; width: 100%; transform: translate(100%, -50%); display: block; left: 0; background: var(--theme-color); opacity: 0.5; transition: all 0.5s; height: 3px; content: ""; top: 50%; } .fa_More2 a:hover:after { transform: translate(-100%, -50%); background: #fff; } .fa_More3 { text-align: center; } .fa_More3 a { display: inline-block; width: 40px; height: 40px; line-height: 42px; color: #000; font-size: 28px; text-align: center; position: relative; } .fa_More3 a i { transition: all 0.5s; } .fa_More3 a:hover i { transform: scale(1.1); } .fa_More3 .fa_svg { position: absolute; top: 0; left: 0; } .fa_More3 .fa_svg .fa_cir { fill: none; stroke: #333; stroke-width: 1; stroke-dasharray: 30, 0; transition: all 1s; } .fa_More3 a:hover .fa_svg .fa_cir { stroke-width: 1; stroke-dasharray: 0, 30; stroke-dashoffset: 20; } @media screen and (max-width:768px) { .fa_mf26 { font-size: 26px!important; } .fa_mf24 { font-size: 24px!important; } .fa_mf22 { font-size: 22px!important; } .fa_mf20 { font-size: 20px!important; } .fa_mf18 { font-size: 18px!important; } .fa_mf16 { font-size: 16px!important; } .fa_mf14 { font-size: 14px!important; } .fa_mohide { display: none!important; } .fa_More a { padding: 5px 10px; } .fa_More a i { right: 10px; } .fa_More a, .fa_More2 a { height: auto; line-height: 30px; } .fa_l3, .fa_l2 { display: block; width: calc((100% - 20px) / 2); margin: 5px; } .fa_PageCate .fa_CateTit h3 { font-size: 18px; } .fa_Related>a, .fa_AbList .fa_Abli { width: calc((100% - 20px)/2); } .fa_Related>a:nth-child(2n), .fa_AbList .fa_Abli:nth-child(2n) { margin-right: 0; } .p_btn-hide { background: #333; } .p_btn-hide .p_c-fff { background: #333; } .fa_PageNav { display: none; } .p_problemCategory { display: block; } .p_problemCategory .btn-primary { width: 100%; border: none; border-radius: 0; text-align: left; background: #333; padding: 10px 20px; margin: 0; color: #fff; } input::-webkit-input-placeholder { font-size: 14px; line-height: 1.42857143; } input::-moz-placeholder { font-size: 14px; line-height: 1.42857143; } input:-ms-input-placeholder { font-size: 14px; line-height: 1.42857143; } input:-moz-placeholder { font-size: 14px; line-height: 1.42857143; } } #easy_zoom { transition: all 0s; -moz-transition: all 0s; /* Firefox 4 */ -webkit-transition: all 0s; /* Safari 鍜 Chrome */ -o-transition: all 0s; } #easy_zoom * { transition: all 0s; -moz-transition: all 0s; /* Firefox 4 */ -webkit-transition: all 0s; /* Safari 鍜 Chrome */ -o-transition: all 0s; /* Opera */ } .p_ProductDetail img, .p_NewsDetail img, .p_contentBox img { max-width: 100%; height: auto !important; } .p_content .reset_style { line-height: 2; } .btn-primary:active:hover, .btn-primary.active:hover, .open>.dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open>.dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open>.dropdown-toggle.btn-primary.focus .p_pagebox .next, .p_pagebox .pre { background-color: var(--theme-color); } /*鍔犺浇鍔ㄦ晥 topshow锛堜粠涓婂線涓嬶級fa_LeftShow 锛堜粠宸﹀線鍙筹級 */ .delighter { overflow: hidden; position: relative; } .fa_TopShow.delighter:before { width: 100%; position: absolute; height: 100%; top: 0; left: 0; transform: translateY(0%); display: block; background: #fff; z-index: 10; content: ""; transition: 1s cubic-bezier(0.68, 0.54, 0.14, 0.96) 0.5s; } .fa_TopShow.started.delighter:before { transform: translateY(100%); } .fa_LeftShow.delighter:before { width: 100%; position: absolute; height: 100%; top: 0; left: 0; transform: translateX(0%); display: block; background: #fff; z-index: 10; content: ""; transition: 1s cubic-bezier(0.68, 0.54, 0.14, 0.96) 0.5s; } .fa_LeftShow.started.delighter:before { transform: translateX(100%); } .fa_RightShow.delighter:before { width: 100%; position: absolute; height: 100%; top: 0; left: 0; transform: translateX(0%); display: block; background: #fff; z-index: 10; content: ""; transition: 1s cubic-bezier(0.68, 0.54, 0.14, 0.96) 0.5s; } .fa_RightShow.started.delighter:before { transform: translateX(-100%); } .fa_BottomShow.delighter:before { width: 100%; position: absolute; height: 100%; top: 0; left: 0; transform: translateX(0%); display: block; background: #fff; z-index: 10; content: ""; transition: 1s cubic-bezier(0.68, 0.54, 0.14, 0.96) 0.5s; } .fa_BottomShow.started.delighter:before { transform: translateY(-100%); } /*鍐呴〉banner鍔ㄧ敾*/ @-webkit-keyframes fa_scale_b { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); } 100% { -webkit-transform: scale(2); -moz-transform: scale(2); -ms-transform: scale(2); -o-transform: scale(2); transform: scale(2); } } @-moz-keyframes fa_scale_b { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); } 100% { -webkit-transform: scale(2); -moz-transform: scale(2); -ms-transform: scale(2); -o-transform: scale(2); transform: scale(2); } } @-o-keyframes fa_scale_b { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); } 100% { -webkit-transform: scale(2); -moz-transform: scale(2); -ms-transform: scale(2); -o-transform: scale(2); transform: scale(2); } } @-webkit-keyframes fa_scale_a { 0% { -webkit-transform: translateX(-50%) scale(1); -moz-transform: translateX(-50%) scale(1); -ms-transform: translateX(-50%) scale(1); -o-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 50% { -webkit-transform: translateX(-50%) scale(1.5); -moz-transform: translateX(-50%) scale(1.5); -ms-transform: translateX(-50%) scale(1.5); -o-transform: translateX(-50%) scale(1.5); transform: translateX(-50%) scale(1.5); } 100% { -webkit-transform: translateX(-50%) scale(2); -moz-transform: translateX(-50%) scale(2); -ms-transform: translateX(-50%) scale(2); -o-transform: translateX(-50%) scale(2); transform: translateX(-50%) scale(2); } } @-moz-keyframes fa_scale_a { 0% { -webkit-transform: translateX(-50%) scale(1); -moz-transform: translateX(-50%) scale(1); -ms-transform: translateX(-50%) scale(1); -o-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 50% { -webkit-transform: translateX(-50%) scale(1.5); -moz-transform: translateX(-50%) scale(1.5); -ms-transform: translateX(-50%) scale(1.5); -o-transform: translateX(-50%) scale(1.5); transform: translateX(-50%) scale(1.5); } 100% { -webkit-transform: translateX(-50%) scale(2); -moz-transform: translateX(-50%) scale(2); -ms-transform: translateX(-50%) scale(2); -o-transform: translateX(-50%) scale(2); transform: translateX(-50%) scale(2); } } @-o-keyframes fa_scale_a { 0% { -webkit-transform: translateX(-50%) scale(1); -moz-transform: translateX(-50%) scale(1); -ms-transform: translateX(-50%) scale(1); -o-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 50% { -webkit-transform: translateX(-50%) scale(1.5); -moz-transform: translateX(-50%) scale(1.5); -ms-transform: translateX(-50%) scale(1.5); -o-transform: translateX(-50%) scale(1.5); transform: translateX(-50%) scale(1.5); } 100% { -webkit-transform: translateX(-50%) scale(2); -moz-transform: translateX(-50%) scale(2); -ms-transform: translateX(-50%) scale(2); -o-transform: translateX(-50%) scale(2); transform: translateX(-50%) scale(2); } } @-ms-keyframes fa_scale_a { 0% { -webkit-transform: translateX(-50%) scale(1); -moz-transform: translateX(-50%) scale(1); -ms-transform: translateX(-50%) scale(1); -o-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); } 50% { -webkit-transform: translateX(-50%) scale(1.5); -moz-transform: translateX(-50%) scale(1.5); -ms-transform: translateX(-50%) scale(1.5); -o-transform: translateX(-50%) scale(1.5); transform: translateX(-50%) scale(1.5); } 100% { -webkit-transform: translateX(-50%) scale(2); -moz-transform: translateX(-50%) scale(2); -ms-transform: translateX(-50%) scale(2); -o-transform: translateX(-50%) scale(2); transform: translateX(-50%) scale(2); } } /*swiper*/ .fa_SwpBtn>div { position: absolute; transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.5s; top: 50%; z-index: 20; cursor: pointer; color: #fff; font-size: 1.5vw; width: 2.5vw; height: 2.5vw; line-height: 2.5vw; border-radius: 50%; text-align: center; border: #fff dotted 1px; } .fa_SwpBtn>div:hover { opacity: 1; } .fa_SwpBtn .fa_SwpBtn_l { left: 2vw; } .fa_SwpBtn .fa_SwpBtn_r { right: 2vw; } .fa_pagination { position: absolute; bottom: 5%; width: 100%; left: 0; right: 0; text-align: center; z-index: 99; } .fa_pagination span { width: 8px; height: 8px; background: rgba(255, 255, 255, 0.5); display: inline-block; border-radius: 500px; margin: 0 5px; transition: all 0.5s; cursor: pointer; } .fa_pagination span.swiper-pagination-bullet-active { background: rgba(255, 255, 255, 0.5); width: 50px; } .fa_Imgmax img { max-width: 100%!important; max-height: 100%!important; min-width: 0%!important; min-height: 0%!important; width: auto!important; height: auto!important; } .fa_Imgmin img { min-width: 100%!important; min-height: 100%!important; max-width: 130%!important; max-height: 130%!important; width: auto!important; height: auto!important; } @keyframes anim_load1 { 0% { transform: translate3d(-100%, 0%, 0); } 50% { transform: translate3d(0, 0%, 0); } 100% { transform: translate3d(100%, 0%, 0); } } ::-webkit-scrollbar { width: 4px; height: 30px; } /*鎸囨粴鍔ㄦ潯鏁翠綋閮ㄥ垎锛屽畠鐨勫睘鎬ф湁width,height,background绛?/ ::-webkit-scrollbar-track { background-color: #eee; } /*鎸囧灞傝建閬撻儴鍒嗭紝褰撲笉闇€瑕佹椂鍙互鐢╠isplay:none灏嗗叾闅愯棌锛屼篃鍙互娣诲姞浣犳兂瑕佺殑棰滆壊*/ ::-webkit-scrollbar-thumb { background-color: #c2c2c2; border-radius: 500px; height: 150px } /*鎸囨粴鍔ㄦ潯閲岄潰鍙互鎷栧姩鐨勯儴鍒嗭紝涔熷氨鏄粦鍧?/ .p_page .pageNum.active,.p_page .pageNum:hover,.p_page .next:hover,.p_page .pre:hover,.p_pagebox .next,.p_pagebox .pre { background-color:var(--theme-color)!important; color: #fff!important; border-color:var(--theme-color); border-radius: 0px; } .p_page .next,.p_page .pre,.p_page .pageNum{ border-radius: 0px; line-height: 30px; background-color: #f1f1f1!important; color: #444!important; display: inline-block; min-width: 30px; text-align: center; } .p_page .next,.p_page .pre{ padding-right: 20px; padding-left: 20px; } .p_page .next .iconfont,.p_page .pre .iconfont{display:none;} .p_page .next .i_next,.p_page .pre .i_pre{display:block;} @media only screen and (max-width: 768px) { .p_pagebox { max-width: 280px; margin-bottom:20px; } .p_pagebox .pre .font { display: table-cell; vertical-align: middle; bottom: 0; font-size: 14px; } .p_pagebox .num { display: table-cell; vertical-align: middle; font-size: 14px; text-align: center; width: 100%; height:45px; } .p_pagebox .next .font{ font-size: 14px; } .p_pagebox .pre .iconfont, .p_pagebox .next .iconfont{ color: #ffffff; font-size: 15px; line-height: 23px; } .p_pagebox .num .iconfont:before { content: "\e69c"; font-size: 14px; } .p_pagebox .next .iconfont:before { content: "\e6af"; font-size: 14px; } .p_pagebox .next,.p_pagebox .pre{ padding: 0 5px; width: 30%; } .p_pagebox .num .iconfont { width: auto; height: auto; position: absolute; right: 15px; top: 14px; font-size: 14px; } .p_pagebox .NumBox { width: 40%; } .p_pagebox .ItemBox .jump { display: none; } .p_pagebox .ItemBox{ bottom:0; } }