.od-big-box h1{ font-size: 2rem; font-weight: 700; color: #333333; letter-spacing: 0.06375rem; text-align: center; } .od-big-box h5{ font-size: 20px; font-weight: 400; text-align: center; color: #999999; letter-spacing: 0.64px; width: 60%; margin: 0 auto; padding: 1.875rem 0 3.125rem 0; } .od-big-box img{ width: 100%; } .od-top-picture{ padding-top: 42px; padding-bottom: 70px; } .od-top-picture ul{ display: flex; justify-content: space-between; margin-bottom: 14px; } .od-top-picture ul li{ position: relative; } .od-top-picture ul li p{ position: absolute; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0,0,0,0.4); display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 400; color: #ffffff; letter-spacing: 1.2px; } .od-laboratory{ padding-bottom: 100px; } .od-laboratory ul{ display: flex; justify-content: space-between; align-items: center; padding-top: 70px; } .od-laboratory ul li{ flex: 1; font-size: 20px; font-weight: 400; color: #666666; line-height: 40px; } .od-laboratory ul li:first-child{ padding-right: 130px; } .od-laboratory ul li p{ font-size: 16px; font-weight: 400; text-align: center; color: #999999; padding-top: 26px; } .od-testing-center{ background: #f2f2f2; padding: 100px 0; box-sizing: border-box; } .od-testing-center ul{ display: flex; justify-content: space-between; align-items: center; } .od-testing-center ul .pictrue{ padding-right: 115px; } .od-testing-center ul h4{ font-size: 24px; font-weight: 700; color: #333333; line-height: 28px; margin-bottom: 54px; } .od-testing-center ul p{ font-size: 20px; font-weight: 400; color: #666666; line-height: 40px; letter-spacing: 2.8px; } .od-testing-center ul p span{ display: inline-block; width: 15px; height: 15px; background: #009c1e; margin-right: 22px; } .od-me-servece{ padding-top: 42px; padding-bottom: 70px; } .od-me-servece .odms-content{ } .odms-content ul{ display: flex; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 14px; } .odms-content ul li{ width: 32.33%; margin: 15px 0.5%; position: relative; } .odms-content ul li p{ position: absolute; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0,0,0,0.4); display: flex; align-items: center; justify-content: center; flex-direction: column; font-size: 24px; font-weight: 400; color: #ffffff; letter-spacing: 1.2px; } .odms-content ul li p span{ display: block; } .odms-content ul li p .text1{ margin-bottom: 16px; } .odms-content ul li p .text2{ font-size: 20px; font-weight: 400; text-align: center; color: #ffffff; letter-spacing: 0.5px; } .oems-technological-process{ background: #F2F2F2; padding: 80px 0 100px 0; } .oemstp-content>ul{ display: flex; justify-content: space-between;; align-items: center; padding-top: 70px; } .oems-technological-process .oemstp-item{ width: 246px; height: 246px; background: #ffffff; border-radius: 20px; display: flex; justify-content: center; align-items: center; flex-direction: column; } .oems-technological-process .pictrue{ width: 90px; margin-bottom: 20px; text-align: center; } .oemstp-item li{ font-size: 24px; font-weight: 700; color: #666666; } .oemstp-content .spcing{ width: 70px; display: flex; align-items: center; margin: 0 19px; } .oemstp-content .spcing .triangle{ width: 0; height: 0; border-top: 10px solid transparent; border-left: 20px solid #999999; border-bottom: 10px solid transparent; } .oemstp-content .spcing .line{ width: 100%; border-bottom: 3px dashed #999999; margin-right: 4px; } .oems-report{ padding: 84px 0 100px 0; background-image: url(../image/oilDetection/15.jpg); background-repeat: no-repeat; background-size: 100% 100%; padding: 70px 0 100px 0; } .oems-report img{ margin-top: 60px; } /* 鎵嬫満绔樉绀 */ /* 灞忓箷灏忎簬 767px 鏃剁殑鏍峰紡 */ @media only screen and (max-width: 1200px) { .oemstp-item li{ font-size: 20px; } .oems-technological-process .oemstp-item{ width: 160px; height: 160px; } } @media only screen and (max-width: 1000px) { .oemstp-content>ul, .od-top-picture ul, .od-laboratory ul, .od-testing-center ul, .odms-content ul{ flex-direction: column; } .od-testing-center ul .pictrue{ padding: 0; } .od-laboratory ul li:first-child{ padding: 0; } .od-testing-center ul h4{ text-align: center; margin: 20px 0; } .oemstp-content>ul>li{ width: 100%; } .oems-technological-process .oemstp-item{ width: 100%; padding: 40px 0; } .odms-content ul li{ width: 100%; } .oemstp-content .spcing{ transform: rotate(90deg); height: 90px; margin: 0 auto; } }