/*分页*/ .pagination { display: inline-block; padding-left: 0; margin: 20px 0; border-radius: 4px; } .pagination>li { display: inline; } .pagination>li>a, .pagination>li>span { position: relative; float: left; padding: 6px 12px; margin-left: -1px; line-height: 1.42857143; color: #337ab7; text-decoration: none; background-color: #fff; border: 1px solid #ddd; } .pagination>li:first-child>a, .pagination>li:first-child>span { margin-left: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .pagination>li:last-child>a, .pagination>li:last-child>span { border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus { z-index: 2; color: #23527c; background-color: #eee; border-color: #ddd; } .pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus { z-index: 3; color: #fff; cursor: default; background-color: #337ab7; border-color: #337ab7; } .pagination>.disabled>span, .pagination>.disabled>span:hover, .pagination>.disabled>span:focus, .pagination>.disabled>a, .pagination>.disabled>a:hover, .pagination>.disabled>a:focus { color: #777; cursor: not-allowed; background-color: #fff; border-color: #ddd; } /*分页结束*/ .nodata { text-align: center; font-size: 16px; line-height: 200px } /* 重置 */ .page { background: none; width: 1200px; margin: 0 auto; } h1, h2, h3, h4, h5, h6, p { margin: 0; padding: 0; } ul, li { list-style: none; margin: 0; padding: 0; } a { color: #000; } a:hover, a.active { color: #d70010; } main { background: #f2f2f2; overflow: hidden; } em, i { font-style: inherit; } .holder { width: 885px; margin: 0 auto; } /* */ #head .page { display: flex; justify-content: space-between; } #head .left { width: 200px; } #head .left .logo { margin: 15px 0 25px; height: 70px; } #head .left .logo img { max-width: 100%; max-height: 100%; } #head .left .product { position: relative; } #head .left .product>ul { position: absolute; width: 100%; background: rgba(0, 0, 0, .55); z-index: 10; padding-top: 23px; display: none; } #head .left .product:hover>ul { display: block; } #head .left .product>ul>li { padding: 5px 15px; height: 52px; overflow: hidden; } #head .left .product h2 { height: 34px; line-height: 34px; width: 200px; background-color: #d70010; color: #fff; font-size: 20px; font-weight: 700; padding-left: 18px; } #head .left .product ul li h3 { font-size: 16px; line-height: 20px; padding-top: 2px; font-weight: bold; display: flex; justify-content: space-between; align-items: center; } #head .left .product ul li .navitem>a { font-size: 12px; color: #a9a9a9; } #head .left .product ul h3 a { color: #fff; } #head .left .product ul li .navlist { background: #fff; position: absolute; width: 1000px; min-height: 500px; top: 0; left: 100%; display: none; } #head .left .product ul li:hover .navlist { display: block; padding: 0 50px; } #head .left .product ul li:hover .navlist .proclo { display: flex; } #head .left .product ul li .navlist ul { display: flex; flex-wrap: wrap; } #head .left .product ul li .navlist h4 { border-left: 1px solid #000; padding: 0 15px; font-size: 12px; font-weight: bold; line-height: 15px; min-width: max-content; height: max-content; margin-bottom: 15px; } #head .left .product ul li .navlist ul li { border-left: 1px solid #000; font-size: 12px; line-height: 15px; padding: 0 15px; margin-bottom: 15px; font-weight: bold; } #head .left .product ul li .navlist ul li a { color: #848484; } #head .right { width: 920px; } #head .top { display: flex; align-items: center; justify-content: space-between; height: 70px; margin: 15px 0 25px; } #head .top .search { display: flex; align-items: center; position: relative; } #head .top .search .searchpro { position: absolute; bottom: 100%; background: #d70010; color: #fff; padding: 3px; border-radius: 10px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; padding: 2px 10px; font-size: 12px; } #head .top .search input { border: 2px solid #d70010; width: 450px; height: 40px; padding-left: 15px; } #head .top .search .dis-m { background: #d70010; color: #fff; border: none; height: 40px; width: 130px; } #head .top .search .dis-m img { width: 35px; margin-right: 5px; } #head .top .tel { background: url(/uploads/image/putimage/icon1.jpg) no-repeat left; padding-left: 45px; } #head .top .tel { font-family: 微软雅黑; color: #333; display: flex; flex-direction: column; } #head .top .tel span { font-size: 26px; color: #d70010; font-family: arial; font-weight: bold; line-height: 20px; } #head .bottom { height: 55px; line-height: 55px; } #head .bottom .nav { display: flex; justify-content: space-between; } #head .bottom .nav li a { font-size: 16px; } /* 猜你喜欢 */ .part1 { margin-bottom: 20px; } .title { width: max-content; margin: 0 auto; font-weight: 700; font-size: 20px; display: flex; align-items: center; padding: 25px 0; } .title img { margin-right: 5px; } .title::after { content: ''; width: 95px; height: 1px; background-color: #000; display: inline-block; margin: 0 10px; } .title::before { content: ''; width: 95px; height: 1px; background-color: #000; display: inline-block; margin: 0 10px; } .part1body { background: #fff; position: relative; } .part1body .left, .part1body .right { position: absolute; top: 45%; } .part1body .left { left: -70px; } .part1body .right { right: -70px; } .part1main { overflow: hidden; padding: 20px 0; position: relative; height: 310px; } .part1main ul { display: flex; width: max-content; position: absolute; } .part1item { width: 200.175px; background: #fff; border-right: 1px solid #b9b9b9; text-align: center; } .part1item img { width: 100%; } .part1item .content h5 { height: 32px; } .part1item .content span { color: #d70010; font-size: 17px; } /* */ .part2 { margin-bottom: 10px; } .part2 .top { background: #eeced0; border-top: 2px solid #d70010; border-bottom: 2px solid #d70010; height: 45px; margin-bottom: 5px; } .part2 .top ul { height: 100%; display: flex; } .part2 .top ul h3 { background: #d70010; width: 235px; font-size: 20px; font-weight: bold; } .part2 .top ul h3 a { color: #fff; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .part2 .top ul li { margin-left: 25px; display: flex; align-items: center; justify-content: center; } .part2 .bottom { display: flex; } .part2 .bottom>img { width: 235px; height: max-content; } .part2 .bottom>ul { width: 965px; display: flex; flex-wrap: wrap; } .part2 .bottom>ul>li { width: 24.48%; margin-left: 5px; background: #fff; height: max-content; margin-bottom: 5px; } .part2 .bottom>ul>li img { width: 100%; height: 235px; border-bottom: 1px solid #f2f2f2; } .part2 .bottom>ul>li .content { padding: 10px 40px; display: flex; flex-direction: column; align-items: center; } .part2 .bottom>ul>li .content h4 { font-size: 14px; color: #333; text-align: center; height: 32px; overflow: hidden; } .part2 .bottom>ul>li .content span { text-align: center; font-weight: 400; font-size: 20px; color: grey; height: 31px; } .part2 .bottom>ul>li .content span i { color: #d7000f; font-weight: 500; } .part2 .bottom>ul>li .content span em { font-size: 15px; color: #d7000f; } /* */ .part3 .page { position: relative; } .part3 h1 { color: #c9c9c9; text-align: center; height: 80px; display: flex; align-items: center; justify-content: center; } .part3 .page::after, .part3 .page::before { content: ''; width: 45%; height: 2px; background: #c9c9c9; display: block; position: absolute; top: 49%; } .part3 .page::after { left: 0; } .part3 .page::before { right: 0; } /* */ .foot_img { padding: 25px 0; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #c9c9c9; } .foot_nav { display: flex; align-items: center; justify-content: space-between; font-size: 16px; color: #000; padding: 15px 0; } .foot_text { text-align: center; color: #636363; font-style: 14px; margin-bottom: 20px; } .met-search .page{ display: flex; flex-wrap: wrap; } .searchlist{ width: 19.5%; background: #fff; margin-right: 0.62%; margin-bottom: 10px; } .searchlist:nth-child(5n){ margin-right: 0; } .searchlist img{ width: 100%; height: 235px; border-bottom: 1px solid #f2f2f2; } .searchlist .content{ padding: 10px 40px; display: flex; flex-direction: column; align-items: center; } .searchlist .content h4{ font-size: 14px; color: #333; text-align: center; height: 32px; overflow: hidden; } .searchlist .content span{ text-align: center; font-weight: 400; font-size: 20px; color: grey; } .searchlist .content span i{ color: #d7000f; font-weight: 500; } .searchlist .content span em{ font-size: 15px; color: #d7000f; } .met-column-nav ul.shownav{ background: #fff; position: absolute; top: 0; left: 100%; width: 100%; padding: 5px 0; display: none; } .met-column-nav ul.shownav li a{ font-size: 14px; } .met-column-nav ul.shownav li{ width: 100%; padding: 0; text-align: center; } .dropdown-item:hover .shownav{ display: block; } /* .parapro{ display: flex; align-items: center; margin: 5px 0; } .parapro span{ width: 30%; font-size: 14px; display: block; } .parapro select{ width: 70%; height: 30px; } .parapro select option{ font-size: 15px; } */ .product-para{ display: flex; flex-wrap: wrap; } .parapro{ display: flex !important; flex-direction: column; width: 180px !important; } .parapro h5{ font-size: 16px; height: 40px; display: flex; align-items: center; justify-content: center; font-weight: bold; } .parapro span{ font-size: 14px; display: flex; align-items: center; justify-content: center; height: 30px; } .col-lg-7, .col-lg-5{ width: 100%; }