ï»?banner { width: 100%; } #banner img { width: 100%; } #content1, #content2, #content3, #content4, #content5 { width: 100%; overflow: hidden; } .content1 { padding: 0; text-align: center; } .content1 h5 { line-height: 2; } .cutureBox { margin-top: 10px; } #content2, .content { width: 100%; overflow: hidden; } .content2 img, .content3 img { width: 100%; } .enterprise { width: 100%; overflow: hidden; top: 8%; } .enterprise h3 { padding: 0 2%; } .hThree { text-align: center; } .achievement { margin-top: 10px; } .bannerImg, .pcBg, .team, .ipBg { display: none; } .m_team { margin: 0 auto; margin-top: 10px; } .m_team p { line-height: 1.8; font-size: 13px; letter-spacing: -1.3px; text-align: center; } .cutureBox { text-align: center; line-height: 1.8; font-size: 13px; } #content4 { padding: 0 10%; } .content4 { background: #fff; width: 100%; max-width: 1440px; margin: 0 auto; padding: 0; } .achievement { text-align: center; line-height: 1.8; margin: 20px auto; } .honorBox { margin-top: 50px; width: 100%; overflow: hidden; } .honorBox li { margin-top: 20px; overflow: hidden; border: 1px solid #e0e0e0; padding: 8px; } .honorImg { width: 40%; } .honorImg img { width: 100%; } .honorWord { width: 60%; padding-left: 14px; } .honorWord p { line-height: 1.5; font-size: 14px; margin-top: 10px; } .honorWord h4 { font-weight: 900; } .factory{ width: 100%; } #aboutFactory { width: 100%; padding: 0 10%; } .aboutFactory { width: 100%; overflow: hidden; margin: 20px auto; } .aboutFactory li { float: left; width: 33%; text-align: center; } .aboutFactory li p { line-height: 1.5; } .aboutFactory li h4 { line-height: 1.5; font-weight: 900; } .RDteam{ width: 100%; overflow: hidden; background: #efefef; padding: 40px 10%; } .content6 { width: 100%; overflow: hidden; padding: 40px 10%; } .RDteam h3, .content6 h3 { margin: 30px auto; text-align: center; } .RDteam p, .content6 p { width: 100%; max-width: 600px; margin: 0 auto; text-align: center; line-height: 1.5; } .content6 p { max-width: 500px; } .exhibitionImg { display: block; margin: 20px auto 30px; } .exhibitionImg img { width: 100%; max-width: 1440px; } #content7 { width: 100%; overflow: hidden; } .m_location { background: url(../Images/m_location.jpg) no-repeat center center; background-size: cover; } .location { background: url(../Images/location.jpg) no-repeat center center; background-size: cover; } .locationBg { background: url(../Images/locationbg.jpg) no-repeat center center; background-size: cover; } #content7 img { width: 100%; } .location { width: 100%; } .content7 { padding: 30px 5%; width: 100%; overflow: hidden; } .telAboutUs { margin-top: 14px; } .telAboutUs p { line-height: 1.5; } .telAboutUs h4 { color: #ea5529; } .addressAboutUs { margin-top: 20px; } .addressAboutUs p { line-height: 1.5; } @media(min-width:360px){ .m_team { margin-top: 20px; } .m_team p { line-height: 1.8; font-size: 14px; letter-spacing: -0.5px; } .enterprise { top: 9%; } .cutureBox { font-size: 14px; margin-top: 20px; } .content7 { padding-top: 40px; } .addressAboutUs p { margin-top: 6px; } } @media(min-width:420px){ .enterprise{ top: 9%; } .m_team p, .cutureBox { line-height: 1.8; font-size: 15px; letter-spacing: 0px; } .aboutFactory li p, .RDteam p, .content6 p { font-size: 16px; line-height: 1.8; } .content7 { padding: 70px 10%; } .addressAboutUs { margin-top: 50px; } } @media (min-width:540px){ .bannerImg, .ipBg { display: block; } .m_bannerImg, .mBg { display: none; } .honorWord p { font-size: 15px; line-height: 1.8; } .honorBox li { padding: 14px; } } @media (min-width:640px){ .m_team, .cutureBox { margin-top: 28px; } .m_team p, .cutureBox p { font-size: 16px; } .honorImg { width: 30%; } .honorWord { width: 70%; } .honorWord p { line-height: 2; } .achievement { width: 65%; } } @media (min-width:768px){ .team { width: 70%; display: block; margin: 26px auto 0; font-size: 16px; text-align: center; line-height: 1.8; } .m_team { display: none; } .enterprise { top: 7%; } .cutureBox { font-size: 16px; line-height: 2; } .honorBox li { padding: 20px; } .honorWord { padding-left: 30px; } .honorWord h4 { margin-top: 40px; } .content4 { } .exhibitionImg { margin: 40px auto 30px; } } @media (min-width:880px){ .enterprise { top: 9%; } .team { margin-top: 30px; line-height: 2; width: 60%; } .honorWord h4 { margin-top: 70px; } .achievement { width: 55%; max-width: 600px; font-size: 16px; } .team table{ width:100%; } } @media (min-width:960px){ .team { width: 100%; } .honorBox li { width: 49%; float: left; padding: 10px; } .honorBox li:nth-child(1) { margin-right: 1%; } .honorBox li:nth-child(2) { margin-left: 1%; } .honorImg { width: 45%; } .honorWord { width: 55%; padding-left: 14px; } .honorWord p { line-height: 1.5; font-size: 14px; margin-top: 10px; } .honorWord h4 { margin-top: 0px; } .nav .compareLine { display: none; } } @media (min-width:1080px){ .mBg, .ipBg { display: none; } .pcBg { display: block; } .honorBox li { padding: 20px; } .honorWord p { font-size: 15px; line-height: 1.5; } .telBox { float: left; width: 350px; } .addressAboutUs { float: left; width: 500px; margin-top: 0; } } @media (min-width:1120px){ .honorWord p { font-size: 16px; } } @media (min-width:1280px){ .honorWord { padding-left: 30px; } .honorWord p { font-size: 16px; line-height: 1.8; } .honorWord h4 { margin-top: 20px; } .achievement { width: 50%; } .telBox{ float: left; width: 450px; } } @media (min-width:1440px){ .honorWord h4 { margin-top: 50px; } .honorImg { width: 35%; } .honorWord { width: 65%; padding-left: 14px; } } #ulBox { width: 100%; margin-top: 40px; overflow: hidden; } .ulBox { width: 90%; margin: 0 auto; height: 190px; overflow: hidden; } .honorImgbox { width: 1600px; height: 190px; left: 0px; top: 0px; } .honorImgbox li { width: 140px; margin: 0 10px; float: left; } .honorImgbox li:nth-child(1){ margin-left: 0; } .imgBox { width: 130px;height: 162px ; } .imgBox:hover { box-shadow: 3px 3px 6px #f1f1f1, -3px 3px 6px #f1f1f1; -moz-box-shadow:3px 3px 6px #f1f1f1, -3px 3px 6px #f1f1f1; -webkit-box-shadow:3px 3px 6px #f1f1f1, -3px 3px 6px #f1f1f1; } .honorImgbox li img { width: 100%; } .honorImgbox li p { text-align: center; } .backImg { width: 30px; height: 30px; left: 0; top: calc(50% - 15px); z-index: 10; } .backImg img, .moreImg img { width: 100%; } .moreImg { width: 30px; height: 30px; right: 0; top: calc(50% - 15px); z-index: 10; } .shouImg { margin: 20px auto 40px;; } .shouImg img { width: 100%; } .m_map { display: none; } .overdomeBg { top: 150px; z-index: -1; display: none; } @media (min-width:1080px){ .overdomeBg { display: block; width: 100%; } .shouImg { display: none; } .m_map { display: block; width: 80%; max-width:1440px; overflow: hidden; margin:30px auto 60px; position: relative; } .mapLogin img { width: 100%; } .yin { position: absolute; width: 347px; left:-5px; top: -40px; z-index: 3; display: none; } .mp { position: absolute; top: 33px; left: 4px; cursor: pointer; z-index: 99; } .canvaPic { width: 89px; height: 29px; position: absolute; top: 20px; left: 12px; z-index: 20; } .canvaPic img { width: 100%; } .info { position: absolute; left: 86px; top: 0; width: 220px; overflow: hidden; background: #fff; border: 1px solid #ccc; -moz-box-shadow:1px 1px 3px #ccc; -webkit-box-shadow:1px 1px 3px #ccc; box-shadow:1px 1px 3px #ccc; } .info h3 { border-left: 4px solid #ea5529; margin-top: 10px; margin-left: 18px; padding-left: 6px; height: 20px; line-height: 20px; font-size: 16px; font-weight: 900; } .info h3 img { width: 38px; line-height: 20px; margin-left: 6px; } .info p { margin-left: 20px; font-size: 14px; margin-right: 10px; line-height: 1.5; margin-bottom: 10px; } .info .officeImg { width: 180px; margin: 10px 18px; } .mp1 { position: absolute; cursor: pointer; width: 1.2%; height: 4.5%; left: 59.8%; top: 46.3%; } .canvaPic1 { width: 138px; height: 29px; position: absolute; top: 12px; left: 8px; z-index: 20; } .info1 { position: absolute; left: 133px; top: -5px; } .mp1:hover .yin1 { display: block; } .mp2 { left:64.1%; top:61%; width: 1.3%; height: 4.6%; } .canvaPic2 { width: 89px; height: 21px; position: absolute; top: 20px; left: 12px; z-index: 20; } .mp3 { left: 58.6%; top:81.4%; width: 1.2%; height: 5.2%; } .canvaPic3 { width: 138px; height: 29px; position: absolute; top: -55px; left: 12px; z-index: 20; } .info3 { position: absolute; left: 133px; top: -75px; } .mp4 { left:63.1%; top:47%; width: 1%; height: 3%; } .canvaPic4 { width: 90px; height: 21px; position: absolute; top: 20px; left: 12px; z-index: 20; } .info4 { position: absolute; left: 196px; top: 0; } .mp5 { left: 56.3%; top: 67.2%; width: 1.6%; height: 4.6%; } .canvaPic5 { width: 200px; height: 29px; position: absolute; top: 14px; left: 12px; z-index: 20; } .info5 { position: absolute; left: 196px; top: -4px; } .mp6 { left: 63.2%; top: 71.6%; width: 1.4%; height: 4.7%; } .mp8 { left: 65.6%; top: 63%; width: 1.2%; height: 3.8%; z-index: 101; } .canvaPic8 { width: 98px; height: 23px; position: absolute; top: 18px; left: 8px; z-index: 20; } .info8 { position: absolute; left: 93px; top: 2px; } .mp7 { left: 57.8%; top: 81.6%; width: 0.8%; height: 2.8%; } .canvaPic7 { width: 148px; height: 29px; position: absolute; top: -64px; left: 8px; z-index: 20; } .info7 { position: absolute; left: 144px; top: -84px; } .mp9 { left: 49.6%; top:64.2%; width: 1.56%; height: 6.5%; } .canvaPic9 { width: 180px; height: 21px; position: absolute; top: 20px; left: 15px; z-index: 20; } .info9 { position: absolute; left: 182px; top: 0; } .mp10 { left:64.4%; top:28.4%; width: 1.56%; height: 6.4%; } .canvaPic10 { width: 89px; height: 21px; position: absolute; top: 20px; left: 14px; z-index: 20; } .info10 { position: absolute; left: 92px; top: 2px; } .mp11 { left:51.84%; top:52.6%; width: 1.56%; height: 4.6%; z-index: 101; } .canvaPic11 { width: 170px; height: 21px; position: absolute; top: 21px; left: 11px; z-index: 20; } .info11 { position: absolute; left: 166px; top: 0; } .mp12 { left:59.2%; top:51%; width: 1.1%; height: 3.2%; z-index: 102; } .canvaPic12 { width: 89px; height: 21px; position: absolute; top: 20px; left: 12px; z-index: 20; } .mp13 { left: 61.5%; top: 50.2%; width: 1.1%; height: 3.4%; } .canvaPic13 { width: 110px; height: 29px; position: absolute; top: 14px; left: 11px; z-index: 20; } .info13 { position: absolute; left: 110px; top: 0; } .mp14 { left: 60.5%; top: 52.8%; width: 0.96%; height: 2.8%; } .canvaPic14 { width: 89px; height: 22px; position: absolute; top: 20px; left: 12px; z-index: 20; } .mp15{ left: 63.26%; top: 44%; width: 1.1%; height: 2.8%; } .canvaPic15 { width: 108px; height: 21px; position: absolute; top: 15px; left: 12px; z-index: 20; } .info15 { position: absolute; left: 105px; top: -2px; } .mp16 { left: 57.0%; top: 51.6%; width: 1.56%; height: 4.6%; } .canvaPic16 { width: 120px; height: 29px; position: absolute; top: 15px; left: 11px; z-index: 20; } .info16 { position: absolute; left: 115px; top: -6px; } .mp17 { left:57.3%; top: 44%; width: 1.0%; height: 3.6%; } .canvaPic17 { width: 110px; height: 25px; position: absolute; top: 22px; left: 14px; z-index: 20; } .info17 { position: absolute; left: 115px; top: 3px; } .mp18 { left: 59.6%; top: 42.9%; width: 0.9%; height: 3%; z-index: 101; } .canvaPic18 { width: 100px; height: 25px; position: absolute; top: 18px; left: 8px; z-index: 50; } .info18 { position: absolute; left: 95px; top: 5px; } .mp19 { left:55%; top:44%; width: 1.56%; height: 4.6%; } .canvaPic19 { width: 140px; height: 29px; position: absolute; top: 11px; left: 14px; z-index: 20; } .info19 { position: absolute; left: 142px; top: -6px; } .mp20 { left:63%; top:56.6%; width: 1%; height: 2.8%; } .canvaPic20 { width: 100px; height: 25px; position: absolute; top: 17px; left: 11px; z-index: 20; } .info20 { position: absolute; left: 100px; top: 0; } .mp21 { left: 63.6%; top: 53%; width: 1.2%; height: 3.8%; } .canvaPic21 { width: 69px; height: 21px; position: absolute; top: 25px; left: 11px; z-index: 20; } .info21 { position: absolute; left: 70px; top: 6px; } .mp22 { left: 60.5%; top: 58.9%; width: 1.1%; height: 3.2%; } .canvaPic22 { width: 69px; height: 17px; position: absolute; top: 25px; left: 11px; z-index: 20; } .info22 { position: absolute; left: 70px; top: -12px; } .mp23 { left: 60.9%; top: 44.7%; width: 1%; height: 2.8%; } .canvaPic23 { width: 69px; height: 16px; position: absolute; top: 24px; left: 8px; z-index: 20; } .info23 { position: absolute; left: 70px; top: 6px; } .mp24 { left: 58.8%; top: 39.5%; width: 1.1%; height: 3.5%; } .canvaPic24 { width: 69px; height: 17px; position: absolute; top: 25px; left: 10px; z-index: 20; } .info24 { position: absolute; left: 70px; top: 6px; } .mp25 { left: 58.6%; top: 44.7%; width: 1%; height: 3.2%; } .canvaPic25 { width: 69px; height: 16px; position: absolute; top: 25px; left: 10px; z-index: 20; } .info25 { position: absolute; left: 70px; top: 6px; } .mp26 { left: 64.3%; top: 67.7%; width: 1.0%; height: 3.0%; } .canvaPic26 { width: 69px; height: 19px; position: absolute; top: 25px; left: 10px; z-index: 20; } .info26 { position: absolute; left: 70px; top: 6px; } .mp27 { left: 62%; top: 46.26%; width: 0.98%; height: 3%; } .canvaPic27 { width: 69px; height: 17px; position: absolute; top: 25px; left: 10px; z-index: 20; } .info27 { position: absolute; left: 70px; top: 6px; } .mp28 { left: 62.9%; top: 63.4%; width: 1.1%; height: 3.0%; } .canvaPic28 { width: 69px; height: 17px; position: absolute; top: 25px; left: 10px; z-index: 20; } .info28 { position: absolute; left: 70px; top: 6px; } .mp29 { left: 63.2%; top: 59.4%; width: 1%; height: 3%; } .canvaPic29 { width: 69px; height: 17px; position: absolute; top: 25px; left: 10px; z-index: 20; } .info29 { position: absolute; left: 70px; top: 6px; } .mp30 { left: 61.9%; top: 57%; width: 1.2%; height: 4%; } .mp31 { left: 57.6%; top: 84.2%; width: 0.6%; height: 2%; } .mp32 { left: 56.8%; top: 83.2%; width: 0.7%; height: 2.3%; } .mp33 { left: 62.4%; top: 76.7%; width: 1%; height: 2.8%; } .mp34 { left: 61.4%; top: 79.6%; width: 1%; height: 2.8%; } .mp35 { left: 60.3%; top: 40.4%; width: 0.9%; height: 2.8%; } } @media (min-width:1280px){ .info { width: 250px; } .info .officeImg { width: 210px; margin: 10px 18px; } } #toggle { width: 100%; overflow: hidden; margin-bottom: 80px; background: url(../Images/cbg.jpg) no-repeat; background-size: cover; } .toggle { width: 90%; overflow: hidden; margin: 80px auto; -webkit-box-shadow: 0px 0px 8px rgba(99, 127, 136, .2); -moz-box-shadow: 0px 0px 8px rgba(99, 127, 136, .2); box-shadow: 0px 0px 8px rgba(99, 127, 136, .2); } .provinceBox { width: 23.26%; height: 700px; padding: 35px 0; float: left; background: #fff; } .provinceBox li { height: 45px; line-height: 45px; padding-left: 22px; cursor: pointer; } .provinceBox li:nth-child(1) { width: 102%; background: #ea5529; color: #fff; -webkit-box-shadow: 0px 3px 8px rgba(99, 127, 136, .2); -moz-box-shadow: 0px 3px 8px rgba(99, 127, 136, .2); box-shadow: 0px 3px 8px rgba(99, 127, 136, .2); } .provinceBox li span { float: left; } .provinceBox li img { display: none; } .textBox { width: 72.57%; height: 700px; background: rgba(239, 239, 239, 0.8); float: right; } .textBox li{ position: absolute; width: 90%; max-width: 840px; top: 40px; left: 20px; line-height: 1.8; display: none; } .textBox li p:nth-child(2) { color: #333; font-size: 14px; font-weight: 200; } .textBox li:nth-child(1) { display: block; font-size: 14px; font-weight: 600; color: #000; } .addressBox{ margin-bottom: 20px; margin-right: 20px; border-bottom: 1px solid #a8a8a8; } .addressBox p:nth-child(1) { font-size: 14px; font-weight: 600; } .contactBg { bottom: 0; right: 20px; width: 80%; max-width: 440px; } .note { width: 70%; max-width: 600px; line-height: 1.8; margin: 20px auto; } .overseaImg { width: 100%; margin: 30px auto 50px; } @media (min-width:540px) { .toggle { width: 80%; max-width: 1400px; } .addressBox p:nth-child(1) { font-weight: 600; } .textBox li { left: 30px; } .provinceBox li { font-size: 16px; } } @media (min-width:768px) { .addressBox { margin-bottom: 30px; } .addressBox p:nth-child(1), .textBox li p:nth-child(2) { font-size: 16px; } } @media (min-width:960px) { .toggle { margin: 130px auto; } .note { text-align: center; font-size: 16px; } .addressBox p:nth-child(1) { font-size: 18px; font-weight: 600; } .provinceBox li { font-size: 18px; padding-left: 50px; } .textBox li p:nth-child(2) { font-size: 16px; } .textBox li:nth-child(1) { font-size: 18px; } .textBox li { width: 80%; margin-left: 50px; } .contactBg { right: 10%; } .provinceBox li img { float: right; width: 11px; margin-top: 14px; margin-right:20px; display: block; } .provinceBox li:nth-child(1) img { display: block; } .overseaImg { width: 80%; max-width: 1440px; } }