.md-OEM-1.md33872 { padding-top: 1rem; padding-bottom: 1rem; position: relative; } .md-OEM-1.md33872 .layout { margin-left: auto; margin-right: auto; width: 16rem; max-width: 92%; } .md-OEM-1.md33872 .box { position: relative; } .md-OEM-1.md33872 .text1 { width: 7.6rem; } .md-OEM-1.md33872 .intro { line-height: 1.2; margin-top: 0.3rem; } .md-OEM-1.md33872 .imgs { width: 7.8rem; } .md-OEM-1.md33872 .img { padding-top: calc( 680 / 780 * 100%); } .md-OEM-1.md33872 .text2 { width: 8.6rem; background-color: var(--theme); position: relative; margin-top: 0.6rem; position: relative; z-index: 2; } .md-OEM-1.md33872 .text2::before { content: ""; position: absolute; left: 100%; top: 0; width: 0; height: 0; border-top: solid 0.4rem var(--theme); border-right: solid 0.5rem transparent; } .md-OEM-1.md33872 .tlist { padding: 0.5rem; } .md-OEM-1.md33872 .tlist .ti { width: 40%; margin: 0.3rem 0; display: flex; align-items: center; } .md-OEM-1.md33872 .tlist i { width: 1em; height: 1em; flex-shrink: 0; background-image: url(/static/home/images/o1.png); background-repeat: no-repeat; background-size: contain; margin-right: 0.5em; } @media screen and (min-width: 901px) { .md-OEM-1.md33872 .imgs { position: absolute; right: 0; top: 0; } } @media screen and (max-width: 900px) { .md-OEM-1.md33872 .text1 { width: 100%; } .md-OEM-1.md33872 .text2 { width: 90%; } .md-OEM-1.md33872 .imgs { width: 100%; margin-top: 0.5rem; } .md-OEM-1.md33872 .tlist .ti { width: 100%; } } .md-OEM-2.md33873 { background-size: 100% 4.2rem; background-repeat: no-repeat; background-position: top; padding-top: 0.88rem; padding-bottom: 0.4rem; position: relative; } .md-OEM-2.md33873 .layout { margin-left: auto; margin-right: auto; width: 16rem; max-width: 92%; } .md-OEM-2.md33873 .h2 { line-height: 1; } .md-OEM-2.md33873 .desc { line-height: 1.2; margin-top: 0.1rem; } .md-OEM-2.md33873 .swiper { width: calc(100% + 0.2rem); margin-top: 0.2rem; } .md-OEM-2.md33873 .swiper-container { padding: 0.1rem; } .md-OEM-2.md33873 .sw { background-color: #fff; box-shadow: 2px 2px 0.1rem 0px rgba(0, 0, 0, 0.1); padding: 0.4rem; height: auto; display: flex; flex-direction: column; align-items: center; } .md-OEM-2.md33873 .icon { display: inline-flex; width: 100%; height: auto; } .md-OEM-2.md33873 .icon img { /* height: 0.82rem; */ width: 100%; height: auto; } .md-OEM-2.md33873 .title { margin-top: 0.52rem; } .md-OEM-2.md33873 .intro { line-height: 1.75em; margin-top: 0.1rem; text-align: center; } .md-OEM-3.md33874 { padding-top: 0.5rem; padding-bottom: 0.9rem; position: relative; } .md-OEM-3.md33874 .layout { margin-left: auto; margin-right: auto; width: 16rem; max-width: 92%; } .md-OEM-3.md33874 .h2 { line-height: 1; } .md-OEM-3.md33874 .desc { line-height: 1.2; margin-top: 0.1rem; } .md-OEM-3.md33874 .swiper { margin-top: 0.3rem; position: relative; } .md-OEM-3.md33874 .img { padding-top: calc( 293 / 520 * 100%); } .md-OEM-3.md33874 .text { margin-top: 0.24rem; }