body { margin: 0 auto; background-color: #ffffff; font-family: "pingfang sc", helvetica, arial, "hiragino sans gb", "microsoft yahei"; } li { list-style: none; } a { text-decoration: none; } .fl { float: left; } .fr { float: right; } .wrapper { width: 1100px; text-align: left; margin: 0 auto; } .main { margin-top: -44px; } .main .m_hot .category { position: relative; height: 129px; z-index: 10; background: url(/uploads/image/tmimages/whithtop.png); background-size: 100% 129px; } .main .m_hot .category img { width: 100%; height: 129px; } .main .m_hot .category p { position: absolute; height: 42px; line-height: 42px; margin-top: 15px; left: 50%; margin-left: -60px; font-family: pingfangsc-medium; font-size: 30px; color: #202020; letter-spacing: 0; } .main .m_hot .category .m-top { position: absolute; height: 42px; line-height: 42px; top: 64px; left: 50%; text-align: center; margin-left: -93px; font-family: pingfangsc-medium; font-size: 30px; color: #d93d3d; letter-spacing: 0; } .main .m_hot .category span:last-child { font-family: pingfangsc-medium; font-size: 30px; color: #000000; letter-spacing: 0; line-height: 42px; } .tuoo { height: 300px; background: #ffffff; } .tuoo .t-tu { width: 1100px; height: 270px; margin: 0 auto; background: #ffffff; border: 1px solid #d8d8d8; box-sizing: border-box; } .tuoo .t-tu .t-l { margin-top: 91px; margin-left: 5px; width: 13px; height: 95px; } .tuoo .t-tu .t-r { margin-top: 91px; margin-right: 5px; width: 13px; height: 95px; } .tuoo .t-tu ul { margin-top: 39px; margin-left: 36px; } .tuoo .t-tu ul li { float: left; margin-right: 26px; width: 22%; height: 190px; line-height: 187px; text-align: center; } .tuoo .t-tu ul li img { width: auto; height: auto; max-width: 100%; max-height: 100%; vertical-align: middle; } .nav { height: 500px; position: relative; background: url(/uploads/image/tmimages/mossf.png); } .nav .n-bo .n-img { width: 100%; height: 64px; } .nav .n-bo .n-img img { width: auto; max-width: 100%; height: 64px; } .nav .n-bo .n-timg { position: absolute; top: 8px; left: 50%; margin-left: -20px; } .nav .n-bo .n-timg img { width: 40px; height: 40px; } .nav .n-bo .n-nav { width: 1100px; margin: 0 auto; height: 436px; } .nav .n-bo .n-nav .n-text { width: 522px; } .nav .n-bo .n-nav .n-text h2 { display: block; float: right; margin-top: 69px; margin-right: 20px; height: 42px; line-height: 42px; font-family: pingfangsc-semibold; font-size: 30px; color: #ffffff; } .nav .n-bo .n-nav .n-text p { display: block; font-family: pingfangsc-regular; font-size: 14px; color: #ffffff; padding-top: 33px; width: 522px; height: 160px; line-height: 20px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 8; overflow: hidden; } .nav .n-bo .n-nav .n-text a { display: block; text-align: center; color: #fff; width: 160px; height: 44px; line-height: 44px; float: right; margin-top: 30px; margin-right: 15px; font-size: 16px; border: 1px solid #ffffff; box-sizing: border-box; } .nav .n-bo .n-nav .n-oneimg { width: 462px; height: 286px; line-height: 283px; text-align: center; margin-top: 77px; } .nav .n-bo .n-nav .n-oneimg img { width: auto; height: auto; max-width: 100%; max-height: 100%; vertical-align: middle; } .supply { height: 560px; } .supply .supply-nav { width: 1100px; height: 560px; margin: 0 auto; } .supply .supply-nav .supply-text { margin-top: 48px; width: 18%; } .supply .supply-nav .supply-text ul li { width: 100%; height: 44px; line-height: 44px; text-align: center; font-family: pingfangsc-regular; font-size: 16px; background: #e7e7e7; margin-bottom: 1px; } .supply .supply-nav .supply-text ul li a { color: #aaaaaa; display: block; width: 90%; margin: 0 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .supply .supply-nav .supply-text ul li a:hover { color: #000000; } .supply .supply-nav .supply-text ul li:first-child { height: 60px; background: #5ddac6; } .supply .supply-nav .supply-text ul li:first-child span { display: block; padding-top: 7px; font-family: pingfangsc-regular; font-size: 20px; color: #ffffff; } .supply .supply-nav .supply-text ul li:first-child .key { width: 100%; height: 2px; background: #ffffff; } .supply .supply-nav .supply-img { margin-top: 48px; margin-left: 3%; width: 79%; } .supply .supply-nav .supply-img ul li { float: left; margin-left: 6%; width: 27%; height: 240px; margin-bottom: 10px; } .supply .supply-nav .supply-img ul li .li-img { width: 234px; height: 190px; line-height: 187px; text-align: center; } .supply .supply-nav .supply-img ul li .li-img img { width: auto; height: auto; max-width: 100%; max-height: 100%; vertical-align: middle; } .supply .supply-nav .supply-img ul li p { display: block; margin-top: 10px; width: 234px; height: 40px; line-height: 20px; font-family: pingfangsc-regular; font-size: 14px; color: #515151; letter-spacing: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .more { height: 64px; background: #e7e7e7; position: relative; } .more .m-nav img { width: 100%; height: 64px; } .more .m-nav .m-one { position: absolute; top: 8px; left: 50%; width: 40px; height: 40px; line-height: 37px; text-align: center; margin-left: -20px; } .more .m-nav .m-one img { width: auto; height: auto; max-width: 100%; max-height: 100%; vertical-align: middle; } .new { height: 497px; background: #e7e7e7; } .new .new-nav { width: 1100px; margin: 0 auto; } .new .new-nav .new-text { width: 1100px; text-align: center; padding-top: 14px; } .new .new-nav .new-text h2 { height: 42px; line-height: 42px; display: block; font-family: pingfangsc-medium; font-size: 30px; color: #202020; letter-spacing: 0; } .new .new-nav .new-text span { height: 42px; line-height: 42px; padding-top: 1px; font-family: pingfangsc-medium; font-size: 30px; color: #d93d3d; letter-spacing: 0; } .new .new-nav .new-text span:nth-child(3) { font-family: pingfangsc-medium; font-size: 30px; color: #000000; letter-spacing: 0; line-height: 42px; } .new .new-nav .mew-ul { height: 240px; padding-top: 41px; } .new .new-nav .mew-ul ul li { float: left; width: 49%; height: 100px; margin-top: 20px; margin-right: 1%; background: #ffffff; border: 1px solid #979797; border-radius: 4px; box-sizing: border-box; } .new .new-nav .mew-ul ul li h4 { width: 90%; margin-top: 19px; margin-left: 30px; font-family: pingfangsc-regular; font-size: 16px; color: #606060; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .new .new-nav .mew-ul ul li h4:hover { color: #5ddac6; } .new .new-nav .mew-ul ul li p { width: 90%; height: 34px; line-height: 17px; margin-top: 6px; margin-left: 30px; font-family: pingfangsc-regular; font-size: 12px; color: #a3a3a3; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .new .new-nav .mew-ul ul li p:hover { color: #5ddac6; } .new .new-nav .gengduo { position: absolute; left: 50%; margin-left: -54px; margin-top: 33px; background: #ffffff; width: 108px; height: 33px; line-height: 33px; text-align: center; } .new .new-nav .gengduo span { font-family: pingfangsc-regular; font-size: 14px; color: #969696; letter-spacing: 0; }