@charset "utf-8"; /* css document */ /*通用样式*/ @font-face { font-family: shuzifont; src: ; } /*数字统一字体*/ @font-face { font-family: yingwen; src: ; } /*数字统一字体*/ .wp { width: 96%; margin: 0 auto; } .wp3 { width: 92%; margin: 0 auto; max-width: 1270px; } .iconfont { display: block; } body { padding-top: 100px; } /*头部*/ .top { height: 100px; top: 0; left: 0; display: block; z-index: 999; background: #fff; } .top .wp3 { height: 100%; } .top .logo { left: 0; top: 50%; transform: translatey(-50%); } .top .r_top { float: right; } .top .nav { float: right; } .top .r_top { padding-top: 5px; -webkit-box-align: center; -ms-flex-align: center; display: -webkit-box; margin-bottom: 16px; } .top .r_top .search { background: #f2f2f2; width: 243px; height: 32px; line-height: 32px; padding: 0 10px; position: relative; float: left; margin-right: 36px; } .top .r_top .search .search_text { background: #f2f2f2; width: 200px; } .top .r_top .search #search_btn { width: 32px; height: 32px; position: absolute; right: 0; top: 0; display: block; background: no-repeat; cursor: pointer; } .top .r_top .tel { float: left; color: #666; margin-right: 36px; } .top .r_top .language { display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: pointer; height: 42px; } .top .r_top .language span { float: left; margin-right: 4px; } .top .r_top .language img { float: left; } .top .r_top .language .ab { width: 140px; height: 80px; background: #fff; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1); top: 100%; left: 0; -webkit-box-align: center; -ms-flex-align: center; display: -webkit-box; z-index: 10; } .top .r_top .language .abbox { display: none; } .top .r_top .language:hover .abbox { display: block; } .top .r_top .language .ab ul {} .top .r_top .language .ab ul li { position: relative; } .top .r_top .language .ab ul li.on:before { content: ''; width: 3px; height: 100%; position: absolute; left: 0; top: 0; background: #2887df; } .top .r_top .language .ab ul li.on a { color: #2887df; } .top .r_top .language .ab ul li a { padding: 0 15px; height: 26px; line-height: 26px; } .top .r_bottom {} .top .r_bottom ul.ul_1 { float: left; } .top .r_bottom ul.ul_1>li { float: left; margin-right: 35px; position: relative; } .top .r_bottom ul.ul_1>li>a { padding: 0 6px; padding-bottom: 14px; display: block; } .top .r_bottom ul.ul_1>li:hover>a { border-bottom: 2px solid #2887df; color: #2887df; } .top .r_bottom .gouwuche { float: left; transform: translatey(-4px); } .top .r_bottom .gouwuche img { float: left; display: block; padding-right: 10px; } .top .r_bottom .gouwuche span { float: left; display: block; padding: 3px 8px; background: #ff7f27; color: #fff; } .top .r_bottom ul.ul_1>li>ul.ul_2 { width: 100%; position: fixed; top: 100px; left: 0; padding-top: calc(20px 1vw); background: #ebf0f5; display: none; } .top .r_bottom ul.ul_1>li:hover>ul.ul_2 { display: block; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li { width: calc(19%); display: inline-table; font-size: 16px; font-weight: 600; margin-bottom: calc(15px 0.8vw); } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>a { font-size: 14px; color: #444; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li:hover a { color: #2887df; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li img { width: 28px; float: left; margin-right: 10px; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3 { padding: 10px 0; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li>a { color: #444; font-weight: normal; font-size: 13px; padding-left: 10px; position: relative; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li:hover>a { color: #2887df; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li>a:before { content: '-'; display: block; float: left; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li>.ul_4>li>a { color: #444; font-weight: normal; font-size: 13px; padding-left: 10px; position: relative; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li>.ul_4>li>a:hover { color: #2887df; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li>.ul_4>li>a:before { content: '\b7 '; display: block; float: left; padding-left: 20px; } .swi_banner .swiper-pagination { bottom: 5%; } .swi_banner .swiper-pagination .swiper-pagination-bullet { width: 24px; height: 4px; background: #fff; border-radius: 0; opacity: 1; } .swi_banner .swiper-pagination .swiper-pagination-bullet-active { background: #2887df; } .swi_banner .swiper-button { width: calc(30px 1.5vw); height: calc(30px 1.5vw); background: #fff; border-radius: 50%; display: block; text-align: center; line-height: calc(30px 1.5vw); } .swi_banner .swiper-button:hover { background: #2887df; } .swi_banner .swiper-button:after { font-size: calc(14px 0.4vw); color: #999; } .swi_banner .swiper-button:hover:after { color: #fff; } .swi_banner .swiper-button-prev { left: 2.5%; } .swi_banner .swiper-button-next { right: 2.5%; } /*最新产品*/ .newproduct_box { padding: calc(1vw) 0; } .index_title { font-size: calc(1.3vw); font-weight: 600; display: block; text-align: center; color: #333; margin-bottom: calc(18px 1vw); } .newproduct_box .swi_product .swiper-slide { text-align: center; margin-bottom: calc(15px 1vw); } .newproduct_box .swi_product .swiper-slide .text {} .newproduct_box .swi_product .swiper-slide .text span { display: block; font-size: calc(0.8vw); margin-bottom: calc(18px 0.5vw); } .newproduct_box .swi_product .swiper-slide .text em { background: #fff; display: block; width: 147px; height: 30px; line-height: 30px; border-radius: 23px; color: #444; margin: 0 auto; } .newproduct_box .swi_product .swiper-slide .text em:hover { background: #2887df; color: #fff; } .newproduct_box .swi_product .swiper-pagination { bottom: 0%; } .newproduct_box .swi_product .swiper-pagination .swiper-pagination-bullet { width: 24px; height: 4px; background: #ddd; border-radius: 0; opacity: 1; } .newproduct_box .swi_product .swiper-pagination .swiper-pagination-bullet-active { background: #2887df; } .newproduct_box .swi_product .swiper-button { width: calc(20px 1.2vw); height: calc(20px 1.2vw); background: #fff; border-radius: 50%; display: block; text-align: center; line-height: calc(20px 1.2vw); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .newproduct_box .swi_product .swiper-button:hover { background: #2887df; } .newproduct_box .swi_product .swiper-button:after { font-size: calc(14px 0.2vw); color: #999; } .newproduct_box .swi_product .swiper-button:hover:after { color: #fff; } .newproduct_box .swi_product .swiper-button-prev { left: 2.5%; } .newproduct_box .swi_product .swiper-button-next { right: 2.5%; } /*产品中心*/ .index_product { padding-bottom: calc(20px 1.8vw); } .index_product ul li { width: calc(100% / 5 - 5px); float: left; margin-right: 6px; margin-bottom: calc(15px 0.1vw); position: relative; text-align: center; overflow: hidden; } .index_product ul li img { height: 100%; } .index_product ul li a { overflow: hidden; display: block; } .index_product ul li span { /*padding: calc(10px 0.5vw) calc(25px 1vw);*/ padding: calc(0.5vw) calc(1vw); background: #2887df; display: inline-block; color: #fff; margin: 0 auto; transform: translatey(-50%); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 90%; } .index_product ul li:nth-of-type(5n) { margin-right: 0px; } /*.index_product ul li:hover img { border: 2px solid #2887df; }*/ /*解决方案*/ .index_fangan { padding: calc(1vw) 0; background: #f4f4f4; } .index_fangan .tabs_1 { float: left; width: calc(100% / 7 * 6); } .index_fangan .tabs_1 ul li { width: calc(100% / 6); float: left; text-align: center; cursor: pointer; } .index_fangan .tabs_1 ul li.active { color: #2887df; } .index_fangan .tabs_1 ul li .img { height: 50px; } .index_fangan .tabs_1 ul li .img img { width: 40px; display: inline-block; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); } .index_fangan .tabs_1 ul li.active .img img { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); filter: grayscale(0%); } .index_fangan .more { width: calc(100% / 7); float: right; text-align: center; } .index_fangan .more .img { height: 50px; } .index_fangan .more .img img { display: inline-block; } .index_fangan .fangan { padding-top: calc(18px 1vw); } .index_fangan .fangan .left { width: 49%; height: 450px; background: #000; float: left; position: relative; } .index_fangan .fangan .left .swiper-slide { display: block; } .index_fangan .fangan .left .swi_fangan_2 { height: 450px; } .index_fangan .fangan .left .swi_fangan_2 .swiper-slide { height: 450px; } .index_fangan .fangan .left .vjs-tech { width: 100%; position: absolute; top: 50%; transform: translatey(-50%); left: 0; } .index_fangan .fangan .right { width: 49%; float: right; } .index_fangan .fangan .right ul { height: 390px; } .index_fangan .fangan .right ul li { background: #fff; padding: 30px 20px; margin-bottom: 10px; cursor: pointer; } .index_fangan .fangan .right ul li.active { background: #2887df; } .index_fangan .fangan .right ul li .img { width: 120px; /*height: 60px;*/ float: left; margin-right: 10px; } .index_fangan .fangan .right ul li .text { width: calc(70%); float: left; } .index_fangan .fangan .right ul li .text strong { display: block; margin-bottom: 5px; display: block; font-size: 18px; } .index_fangan .fangan .right ul li .text span { font-size: 13px; white-space: nowrap; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; overflow: hidden; display: block; } .index_fangan .fangan .right .more { width: 136px; height: 38px; line-height: 38px; text-align: center; color: #fff; background: #2887df; float: left; margin-top: 22px; } .index_fangan .fangan .right .more a { color: #fff; display: block; } .index_fangan .fangan .right ul li.active .img { /*opacity: 0;*/ } .index_fangan .fangan .right ul li.active .text strong { color: #fff; } .index_fangan .fangan .right ul li.active .text span { color: #fff; } /*新闻*/ .index_news { padding: calc(1vw) 0; } .index_news .news_tabs { border-bottom: 1px solid rgba(0, 0, 0, 0.1); position: relative; margin-bottom: calc(15px 1vw); } .index_news .news_tabs ul li { float: left; margin: 0 calc(15px 1.2vw); font-size: calc(16px 0.2vw); display: block; position: relative; padding-bottom: 10px; } .index_news .news_tabs ul li:after { content: ''; width: 0%; height: 3px; display: block; background: #2887df; position: absolute; bottom: 0; left: 0; } .index_news .news_tabs ul li.active:after { width: 100%; } .index_news .news_tabs ul li.active { color: #2887df; } .index_news .news_tabs .more { position: absolute; right: 0; top: 0; } .index_news .news_tabs .more a { font-size: 16px; } .index_news .news_tabs .more:after { content: ">"; } .index_news .news_slide { position: relative; } .index_news .news_slide .box { width: calc(100% / 3 - 10px); margin-right: 15px; float: left; } .index_news .news_slide .box:nth-of-type(3n) { margin-right: 0; } .index_news .news_slide .box .img { overflow: hidden; } .index_news .news_slide .box .img img { object-fit: cover; } .index_news .news_slide .box .text { padding: calc(10px 1vw) calc(15px 1.2vw); background: #f5f7fa; } .index_news .news_slide .box .text span { color: #666; display: block; margin-bottom: 7px; } .index_news .news_slide .box a:hover .text strong { color: #2887df; } .index_news .news_slide .box a:hover .img img { transform: scale(1.1); } .index_news .news_slide .box.left .text strong { font-size: calc(16px 0.1vw); font-weight: 400; white-space: nowrap; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; overflow: hidden; display: block; margin-bottom: calc(8px 0.3vw); } .index_news .news_slide .box.center .text strong { font-size: calc(16px 0.1vw); font-weight: 400; white-space: nowrap; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; overflow: hidden; display: block; margin-bottom: calc(8px 0.3vw); } .index_news .news_slide .box .text strong img { float: left; display: block; margin-right: 7px; } .index_news .news_slide .box .text .more { margin-bottom: calc(15px 1vw); } .index_news .news_slide .center ul { position: relative; float: inherit; width: 100%; height: 100%; display: block; } .index_news .news_slide .center ul li { position: absolute; height: 48%; width: 100%; overflow: hidden; } .index_news .news_slide .center ul li a { position: relative; display: block; width: 100%; height: 100%; } .index_news .news_slide .center ul li .img:before { width: 100%; height: 100%; display: block; content: ''; position: absolute; left: 0; top: 0; background: linear-gradient(15deg, #fff, transparent); z-index: 10; } .index_news .news_slide .center ul li .text { position: absolute; bottom: 0; left: 0; width: 100%; z-index: 20; background: rgba(0, 0, 0, 0); } .index_news .news_slide .center { position: absolute; height: 100%; left: calc(100% / 3 15px); top: 0; } .index_news .news_slide .center ul li:nth-of-type(2) { top: 52%; } .index_news .news_slide .right { position: absolute; height: 100%; right: 0; top: 0; width: calc(100% / 3 - 2.5%); } .index_news .news_slide .right ul { position: relative; float: inherit; width: 100%; height: 100%; display: block; } .index_news .news_slide .right ul li { position: absolute; height: calc(100% / 3); width: 100%; overflow: hidden; background: #f5f7fa; } .index_news .news_slide .right ul li .text strong { font-size: calc(16px 0.1vw); font-weight: 400; margin-bottom: calc(8px 0.3vw); word-break: break-all; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .index_news .news_slide .right ul li a { display: block; } .index_news .news_slide .right ul li:nth-of-type(2) { top: calc(100% / 3); } .index_news .news_slide .right ul li:nth-of-type(3) { top: inherit; bottom: 0; } /*底部*/ .footer { padding: calc(30px 3vw) 0 calc(15px 1.5vw); background: #ebf0f5; margin: 30px 0 0 0; } .footer .left { width: 269px; float: left; border-right: 1px solid rgba(0, 0, 0, 0.1); } .footer .left .tel { margin-bottom: 20px; } .footer .left .tel span { padding: 5px 15px; background: #2888df; border-radius: 5px; color: #fff; display: inline-block; font-size: 18px; margin-bottom: 10px; } .footer .left .tel span img { width: 26px; float: left; margin-right: 10px; } .footer .left .tel strong { display: block; font-size: 20px; } .footer .left .text { line-height: 32px; color: #666; } .footer .left .text img { width: 100px; margin-top: 10px; } .footer .footer_nav { width: calc(100% - 300px); float: left; padding-left: calc(20px 3vw); } .footer .footer_nav ul.ul_1 {} .footer .footer_nav ul.ul_1>li { width: calc(100% / 5); float: left; } .footer .footer_nav ul.ul_1>li>ul.ul_2>li { height: 28px; line-height: 28px; } .footer .footer_nav ul.ul_1>li>ul.ul_2>li a { display: block; color: #666; } .footer .footer_nav ul.ul_1>li>strong { margin-bottom: 20px; display: block; } .footer .footer_beian { padding-top: calc(20px 1vw); margin-top: calc(20px 1vw); border-top: 1px solid rgba(0, 0, 0, 0.1); color: #6f7479; } .footer a { color: #6f7479; } .pc-vis { display: block; } .phone-vis { display: none; } /* 服务浮窗 */ .service-container { position: fixed; right: 20px; bottom: 10%; display: flex; flex-direction: column; z-index: 999; } .service-container .service-wrapper { width: 48px; height: 110px; padding: 12px 0; text-align: center; margin: 4px 0; background: #fff; border-radius: 2px; box-shadow: 0 0 8px 0 rgb(40 40 40 / 20%); cursor: pointer; user-select: none; position: relative; } .service-container .service-wrapper:hover .morebox { display: block; } .service-container .service-wrapper .morebox { width: 204px; /*height: 153px;*/ position: absolute; left: -205px; bottom: 0; background: #fff; box-shadow: 0 0 3px rgb(0 0 0 / 25%); display: flex; flex-direction: column; display: none; } .service-container .service-wrapper .morebox>div { display: flex; flex-direction: row; } .service-container .service-wrapper .morebox img { margin: 24px; } .service-container .service-wrapper .morebox .txtbox { display: flex; align-items: flex-start; flex-direction: column; justify-content: center; } .service-container .service-wrapper .morebox .txtbox p { ont-size: 12px; color: #6f7479; } .service-container .service-wrapper .morebox .txtbox .title { font-weight: 700; color: #282828; font-size: 14px; margin: 0 0 10px 0; } .service-container .service-wrapper .morebox .txtbox:hover .title { color: #2887df; } .service-container .contact-wrapper:hover .morebox { display: block; } .service-container .contact-wrapper .morebox { width: 204px; /* height: 163px; */ position: absolute; left: -205px; bottom: 0; background: #fff; box-shadow: 0 0 3px rgb(0 0 0 / 25%); display: flex; flex-direction: column; display: none; padding: 20px 10px; } .service-container .contact-wrapper .morebox>div { display: flex; flex-direction: row; padding: 10px 0; } .service-container .contact-wrapper .morebox img { margin: 0 12px; } .service-container .contact-wrapper .morebox .txtbox { display: flex; align-items: flex-start; flex-direction: column; justify-content: center; } .service-container .contact-wrapper .morebox .txtbox p { font-size: 12px; color: #6f7479; } .service-container .contact-wrapper .morebox .txtbox .title { font-weight: 700; font-size: 14px; color: #282828; margin: 4px 0 16px 0; } .service-container .contact-wrapper .morebox .txtbox:hover .title { color: #2887df; } .service-container .service-wrapper span { writing-mode: vertical-lr; display: block; margin: 0 auto; } .service-container .contact-wrapper { width: 48px; height: 110px; padding: 12px 0; text-align: center; margin: 4px 0; background: #fff; border-radius: 2px; box-shadow: 0 0 8px 0 rgb(40 40 40 / 20%); cursor: pointer; user-select: none; position: relative; } .service-container .contact-wrapper span { writing-mode: vertical-lr; display: block; margin: 0 auto; } .service-container .backtotop { width: 48px; text-align: center; padding: 12px 0; margin: 4px 0; background: #fff; height: 50px; border-radius: 2px; box-shadow: 0 0 8px 0 rgb(40 40 40 / 20%); cursor: pointer; user-select: none; } @media screen and (max-width: 1024px) { .gouwuche { /*display: none;*/ margin-top: 10px; margin-left: 10px; } .top .r_bottom { position: fixed; top: 0; left: 0; z-index: 1000; width: 60%; height: 100%; background: #fff; padding-top: 30px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; transform: translate3d(-100%, 0, 0); } .top { height: 70px; } body { padding-top: 70px; } .top .r_top { padding-top: 15px; } .top .nav { margin-right: 20px; } .top .menu { width: 32px; height: 50px; float: right; padding-top: 26px; } .top .menu i { width: 100%; height: 2px; display: block; background: #333; border-radius: 1px; margin-bottom: 6px; } .top .r_bottom ul.ul_1>li { display: block; width: 100%; line-height: calc(40px 2vw); padding: 0 15px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .menu_back { width: 100%; height: 100%; display: block; background: rgba(0, 0, 0, 0.8); position: fixed; left: 0; top: 0; z-index: 999; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; opacity: 0; visibility: hidden; } .top .r_bottom ul.ul_1>li>ul.ul_2 { position: inherit; top: inherit; left: inherit; padding-top: 15px; padding-bottom: 20px; } .top .r_bottom ul.ul_1>li>a { padding-bottom: 0; font-size: 16px; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li { width: 100%; margin-bottom: 0; display: inherit; line-height: 32px; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3 { padding: 0; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>.ul_4>li { height: 32px; line-height: 32px; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>a { font-size: 14px; font-weight: 400; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li>ul.ul_4>li { height: 35px; line-height: 35px; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li>.ul_4>li>a { display: block; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li>ul.ul_4 { display: none; } .top .r_bottom ul.ul_1>li>ul.ul_2 { background: #fff; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li img { width: 18px; margin-top: 5px; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3>li:hover>ul.ul_4 { display: block; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li>ul.ul_3 { display: none; } .top .r_bottom ul.ul_1>li>ul.ul_2>.wp3>li:hover>ul.ul_3 { display: block; } .top .menu span i { width: 100%; height: 2px; display: block; background: #333; border-radius: 1px; margin-bottom: 6px; } .top .menu.menu2 i:nth-of-type(1) { transform: rotate(-45deg) translatey(10px); } .top .menu.menu2 i:nth-of-type(3) { transform: rotate(45deg) translatey(-10px); } .top .menu.menu2 i:nth-of-type(2) { transform: translatex(-40px); opacity: 0; filter: alpha(opacity=0); width: 0; } .top .caidan_oppen { transform: translate3d(0, 0, 0); } .footer .left { display: none; } .footer .footer_nav { display: none; } .footer { padding: 20px 0; } .footer .footer_beian { padding-top: 0; border: 0; } } @media screen and (max-width: 820px) { .top .r_top .search { display: none; } .index_product ul li { width: calc(100% / 3 - 5px); margin-right: 5px!important; } .index_product ul li:nth-of-type(3n) { margin-right: 0!important; } .index_product ul li:nth-of-type(10) { display: none; } .index_product ul li span { font-size: 16px; } .index_fangan .tabs_1 { width: 100%; } .index_fangan .more { display: none; } .index_news .news_slide .center { display: none; } .index_news .news_slide .right { display: none; } .index_news .news_slide .box { width: 100%; } .pc-vis { display: none; } .phone-vis { display: block; } } @media (max-width: 660px) { .service-container { display: none; } } @media screen and (max-width: 640px) { .index_fangan .tabs_1 ul li { width: calc(100% / 3); /*margin-bottom: 20px;*/ } .index_fangan .fangan .left { width: 100%; margin-bottom: 10px; } .index_fangan .fangan .right { width: 100%; } .index_fangan .fangan { padding-top: 0; } .index_fangan .fangan .left .swi_fangan_2 { height: 320px; } .index_fangan .fangan .left .swi_fangan_2 .swiper-slide { height: 320px; } .index_fangan .fangan .left { height: 320px; } .index_fangan .fangan .left .vjs-tech {} } @media screen and (max-width: 560px) { .top .r_top .search { display: none; } .top .r_top .tel { display: none; } .index_product ul li { margin-bottom: 0; } .index_news .news_tabs ul li { margin: 0 10px; } } @media screen and (max-width: 460px) { .index_product ul li { width: calc(100% / 2 - 5px); margin-right: 10px!important; } .index_product ul li:nth-of-type(3n) { margin-right: 10px!important; } .index_product ul li:nth-of-type(2n) { margin-right: 0!important; } .index_product ul li:nth-of-type(9) { display: none; } }