@media screen and (min-width: 768px) { .main .about .cover img { display: block; width: 470px; height: 480px; } .main .about .info { width: 660px; padding-top: 65px; } .main .about .info .name { font-size: 50px; color: #5ba9ad; font-weight: bold; } .main .about .info .subname { font-size: 30px; margin-top: 15px; } .main .about .info .line { width: 36px; height: 7px; background: #5ba9ad; margin: 20px 0 30px; } .main .about .info .description { text-align: justify; word-break: break-all; font-weight: lighter; line-height: 36px; } .main .about .info .description p { margin-top: 24px; font-size: 20px; } .main .about-device .content img { display: block; width: 100%; } .main .therapy .content .section { background: #eeeeee; padding: 24px 24px 24px 56px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; margin-top: 20px; } .main .therapy .content .section:first-child { margin-top: 0; } .main .therapy .content .section .info { margin-right: 24px; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; -ms-flex-negative: 0; flex-shrink: 0; text-align: justify; word-break: break-all; } .main .therapy .content .section .info .cover img { display: block; width: 560px; } .main .therapy .content .section .info .title { font-size: 36px; color: #5ba9ad; font-weight: bold; } .main .therapy .content .section .info .subtitle { font-size: 16px; color: #434343; font-weight: lighter; text-transform: uppercase; margin-top: 4px; } .main .therapy .content .section .info .desc { font-size: 27px; color: #434343; line-height: 38px; margin-top: 50px; } .main .therapy .content .section .info .row { margin-top: 68px; } .main .therapy .content .section .info .row .label { font-size: 29px; color: #434343; font-weight: bold; } .main .therapy .content .section .info .row .text { font-size: 25px; line-height: 38px; color: #434343; margin-top: 10px; } .main .therapy .content .section .info .row .item { font-size: 22px; color: #434343; font-weight: lighter; margin-top: 32px; line-height: 1.5; } .main .therapy .content .section.therapy-2 .row { margin-top: 130px; } .main .therapy .content .section.therapy-3 .row { margin-top: 80px; } .main .therapy .content .section.therapy-3 .row .item { line-height: 38px; } .main .therapy .content .section.therapy-3 .desc { line-height: 42px; } .main .therapy .content .section.therapy-4 .row { margin-top: 50px; } .main .therapy .content .section.therapy-4 .row .label { margin-bottom: 16px; } .main .therapy .content .section.therapy-4 .row .item { margin-top: 12px; } .main .device .content { position: relative; } .main .device .content .swiper-container { width: 1100px; margin: 0 auto; } .main .device .content .swiper-container img { display: block; width: 100%; } .main .device .content .swiper-prev, .main .device .content .swiper-next { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 48px; height: 72px; background-color: rgba(55, 55, 55, 0.6) !important; z-index: 5; cursor: pointer; background: url(/img/icon-arrow-left.png) no-repeat center; } .main .device .content .swiper-next { left: unset; right: 0; background: url(/img/icon-arrow-right.png) no-repeat center; } } @media screen and (max-width: 768px) { .main .about .content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .main .about .content .cover { margin-top: 0.4rem; } .main .about .content .cover img { display: block; width: 5.46rem; height: 5.57rem; } .main .about .content .info { width: 6.5rem; margin: 0 auto; } .main .about .content .info .name { font-size: 0.34rem; color: #5ba9ad; text-align: center; font-weight: bold; } .main .about .content .info .subname { font-size: 0.26rem; margin-top: 0.16rem; text-align: center; } .main .about .content .info .line { width: 0.4rem; height: 0.06rem; background: #5ba9ad; margin: 0.32rem auto; } .main .about .content .info .description { text-align: justify; word-break: break-all; color: #333333; text-align: center; } .main .about .content .info .description p { font-size: 0.26rem; line-height: 0.48rem; } .main .about-device { width: 6.86rem; margin: 0 auto; } .main .about-device .content img { display: block; width: 100%; } .main .therapy .content .section { width: 6.86rem; margin: 0 auto; background: #eeeeee; padding: 0.4rem; margin-top: 0.32rem; -webkit-box-sizing: border-box; box-sizing: border-box; } .main .therapy .content .section:first-child { margin-top: 0; } .main .therapy .content .section .cover img { display: block; width: 100%; } .main .therapy .content .section .info { text-align: center; word-break: break-all; } .main .therapy .content .section .info .title { font-size: 0.3rem; color: #5ba9ad; font-weight: bold; margin-top: 0.4rem; } .main .therapy .content .section .info .subtitle { font-size: 0.24rem; color: #333; margin-top: 0.16rem; } .main .therapy .content .section .info .desc { font-size: 0.26rem; color: #333; line-height: 0.48rem; margin-top: 0.32rem; } .main .therapy .content .section .info .row { margin-top: 0.4rem; } .main .therapy .content .section .info .row .label { font-size: 0.26rem; color: #434343; font-weight: bold; } .main .therapy .content .section .info .row .text { font-size: 0.26rem; line-height: 0.48rem; color: #434343; } .main .therapy .content .section .info .row .item { font-size: 0.26rem; color: #333; margin-top: 0.16rem; line-height: 1.5; } .main .therapy .content .section.therapy-2 .row { margin-top: 0.32rem; } .main .therapy .content .section.therapy-3 .row { margin-top: 0.4rem; } .main .therapy .content .section.therapy-4 .row { margin-top: 0.48rem; } .main .device .scroll-box img { width: 1.77rem; height: 2.27rem; margin-right: 0.24rem; } .main .device .scroll-box img:first-child { margin-left: 0.32rem; } .main .device .scroll-box img:last-child { margin-right: 0.32rem; } }