/* X-Small锛堣秴灏忥紝涓€鑸槸鎵嬫満锛 None <576px Small锛堝皬锛屽钩鏉挎垨鑰呰€佺瑪璁版湰锛 sm 鈮?76px Medium锛堜腑锛岀獎灞忕數鑴戯級 md 鈮?68px Large锛堝ぇ锛屽灞忕數鑴戯級 lg 鈮?92px Extra large锛堣秴澶э紝瀹藉睆鐢佃剳锛 xl 鈮?200px Extra extra large锛堢壒澶э紝楂樻竻鐢佃剳鎴栧箍鍛婅澶囷級 xxl 鈮?400px */ /* 锛堣秴灏忥紝涓€鑸槸鎵嬫満锛 <576px */ @media (max-width: 575.98px) { header { position: fixed; top: 0; left: 0; z-index: 999; background-color: #fff; } .logo { width: 250px; } .but_box, .zz { display: block; } .input, .dh { display: none; } .top { margin: 10px auto; } .zz { position: absolute; top: 65px; left: -180px; width: 180px; height: 847px; background-color: rgba(24, 33, 63, 0.8); } .nav { flex-direction: column; } .nav li ul { background-color: rgba(255, 255, 255, 0.8); } .nav li { line-height: initial !important; height: initial !important; margin-bottom: 10px; } .nav li:last-child { margin-bottom: auto; } .nav li a { padding: 15px 25px; font-size: 14px; color: #fff !important; line-height: initial; text-align: left; } .nav li i { display: block; font-size: 20px; line-height: 16px; color: #fff !important; position: absolute; top: 15px; right: 25px; } .nav_ul { padding: 20px 30px; } .nav .nav_ul a { font-size: 14px; color: #212529 !important; } .nav li:hover .nav_ul { display: none; } .nav_ul li a:hover { background-color: initial; } .nav li ul { position: initial; } .banner { margin-top: 65px; height: 180px; } .tips_title { background-position: 12px; padding-left: 40px; } .tips .swiper-slide a { font-size: 14px; } .tips .swiper-slide span { font-size: 12px; } .ten ul { padding: 20px 12px; font-size: 14px; } .footer { font-size: 14px; padding: 10px 0 20px 0; } .footer ul { padding: 0 12px; } .footer ul:nth-child(1) li { width: 25%; } .footer ul { border-left: none; } .footer ul:first-child { padding-bottom: 20px; border-bottom: 1px solid #999; } .ewm { flex-direction: column; } .ewm_box { display: flex; flex-direction: row; justify-content: center; } .ewm_box > img { margin-top: 12px; } .text.box { display: flex; margin-top: 20px; justify-content: center; align-items: center; } .text_box { margin-top: 12px; } .lxfs { font-size: 12px; } .ten li, .ewm p, .ten a, .footer li, .footer ul:nth-child(1) li a, .page_navs li a, .page_xw li a { font-weight: 300; } .page_top { line-height: 40px; font-size: 14px; } .page_navs h2, .page_xw h2 { font-size: 15px; line-height: 40px; font-weight: 300; } .page_navs li a, .page_xw li a { font-size: 14px; } .page_navs { display: none; } .page_xw li { line-height: 35px; height: 35px; } .article_item_title h1 { font-size: 18px; } .article_item { margin-top: 15px; } .article_item_title { font-weight: 300; font-size: 14px; } .page_xw { margin-bottom: 30px; } .page_qh { font-size: 14px; } .article li .fr h3 { font-size: 16px; } .article li { padding: 10px 0; } .product li { width: 44%; } .product li:nth-child(3n) { margin-right: 10px; } .two_r { margin: 30px 0; } .sever li { width: 110px; } .sever li img { width: 110px; height: 110px; } .title { font-size: 16px; } .two_bottom li a { font-size: 14px; } .two_tops li a { font-size: 14px; } .two { margin-top: 0; } .two_bottom { margin: 30px 0; } .product li div { width: 150px; height: 150px; } .ewm img:first-child { margin-right: 12px; } } /*锛堝皬锛屽钩鏉挎垨鑰呰€佺瑪璁版湰锛塻m 鈮?76px*/ @media (min-width: 576px) and (max-width: 767.98px) { header { position: fixed; top: 0; left: 0; z-index: 999; background-color: #fff; } .logo { width: 250px; } .but_box, .zz { display: block; } .input, .dh { display: none; } .top { margin: 10px auto; } .zz { position: absolute; top: 65px; left: -220px; width: 220px; height: 847px; background-color: rgba(24, 33, 63, 0.8); } .nav { flex-direction: column; } .nav li ul { background-color: rgba(255, 255, 255, 0.8); } .nav li { line-height: initial !important; height: initial !important; margin-bottom: 10px; } .nav li:last-child { margin-bottom: auto; } .nav li a { padding: 15px 25px; font-size: 16px; color: #fff !important; line-height: initial; text-align: left; } .nav li i { display: block; font-size: 20px; line-height: 16px; color: #fff !important; position: absolute; top: 15px; right: 25px; } .nav_ul { padding: 20px 30px; } .nav .nav_ul a { font-size: 14px; color: #212529 !important; } .nav li:hover .nav_ul { display: none; } .nav_ul li a:hover { background-color: initial; } .nav li ul { position: initial; } .banner { margin-top: 65px; height: 255px; } .ten ul { padding: 20px 12px; font-size: 14px; } .footer { font-size: 14px; padding: 10px 0 20px 0; } .footer ul { padding: 0 12px; } .footer ul:nth-child(1) li { width: 25%; } .footer ul { border-left: none; } .footer ul:first-child { padding-bottom: 20px; border-bottom: 1px solid #999; } .ewm > div { display: flex; align-items: center; } .page_xw li a { font-size: 14px; } .sm-box { display: flex; justify-content: space-between; margin-bottom: 30px; } .page_navs { width: 45%; } .page_xw { width: 50%; } .product li div { width: 150px; height: 150px; } } /* 锛堜腑锛岀獎灞忕數鑴戯級 md 鈮?68px*/ @media (min-width: 768px) and (max-width: 991.98px) { header { position: fixed; top: 0; left: 0; z-index: 999; background-color: #fff; } .logo { width: 300px; } .but_box, .zz { display: block; } .input, .dh { display: none; } .top { margin: 15px auto; } .zz { position: absolute; width: 300px; height: 847px; background-color: rgba(24, 33, 63, 0.8); } .nav { flex-direction: column; } .nav li ul { background-color: rgba(255, 255, 255, 0.8); } .nav li { line-height: initial !important; height: initial !important; margin-bottom: 10px; } .nav li:last-child { margin-bottom: auto; } .nav li a { padding: 15px 25px; font-size: 16px; color: #fff !important; line-height: initial; text-align: left; } .nav li i { display: block; font-size: 20px; line-height: 16px; color: #fff !important; position: absolute; top: 15px; right: 25px; } .nav_ul { padding: 20px 30px; } .nav .nav_ul a { font-size: 14px; color: #212529 !important; } .nav li:hover .nav_ul { display: none; } .nav_ul li a:hover { background-color: initial; } .nav li ul { position: initial; } .banner { margin-top: 84px; height: 330px; } .ten ul { padding: 20px 12px; } .footer ul { padding: 0 12px; border-left: none; } .footer ul:first-child { padding-bottom: 20px; border-bottom: 1px solid #999; } .ewm_box { display: flex; align-items: center; } .page_xw li a { font-size: 14px; } .sm-box { display: flex; justify-content: space-between; } .page_navs { width: 45%; } .page_xw { width: 50%; } .box2 { margin-bottom: 30px; } .two_r { margin-top: 30px; } } /* 锛堝ぇ锛屽灞忕數鑴戯級 lg 鈮?92px*/ @media (min-width: 992px) and (max-width: 1199.98px) { header { position: fixed; top: 0; left: 0; z-index: 999; background-color: #fff; } .logo { width: 300px; } .but_box, .zz { display: block; } .input, .dh { display: none; } .top { margin: 15px auto; } .zz { position: absolute; width: 300px; height: 847px; background-color: rgba(24, 33, 63, 0.8); } .nav { flex-direction: column; } .nav li ul { background-color: rgba(255, 255, 255, 0.8); } .nav li { line-height: initial !important; height: initial !important; margin-bottom: 10px; } .nav li:last-child { margin-bottom: auto; } .nav li a { padding: 15px 25px; font-size: 16px; color: #fff !important; line-height: initial; text-align: left; } .nav li i { display: block; font-size: 20px; line-height: 16px; color: #fff !important; position: absolute; top: 15px; right: 25px; } .nav_ul { padding: 20px 30px; } .nav .nav_ul a { font-size: 14px; color: #212529 !important; } .nav li:hover .nav_ul { display: none; } .nav_ul li a:hover { background-color: initial; } .nav li ul { position: initial; } .banner { margin-top: 84px; height: 420px; } .page_xw li a { font-size: 15px; } .ewm img:first-child { margin-right: 10px; } } /* 锛堣秴澶э紝瀹藉睆鐢佃剳锛 xl 鈮?200px*/ @media (min-width: 1200px) and (max-width: 1399.98px) { .nav li:hover .nav_ul { display: block !important; } .page_xw li a { font-size: 15px; } } /* 锛堢壒澶э紝楂樻竻鐢佃剳鎴栧箍鍛婅澶囷級 xxl 鈮?400px*/ @media (min-width: 1400px) { .nav li:hover .nav_ul { display: block !important; } }