.f-copy { text-align: center; font-size: 18px; line-height: 41px; height: 41px; color: #fff; font-weight: 700; background: url(../img/dzhwk/sys/f-bg.png) no-repeat center; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain } .f-copy { text-align: center; font-size: .937vw; line-height: 2.135vw; height: 2.135vw; color: #fff; font-weight: 700; background: url(../img/dzhwk/sys/f-bg.png) no-repeat center; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain } .row-opt { padding: 62px 65px 0 } .m-contopt { width: 1304px; height: 736px; background-image: url(../img/dzhwk/sys/a5.png); background-position: center; background-repeat: no-repeat; background-size: cover; margin: 0 auto } .ul-listopt2 { padding: 60px 0 0 90px } .ul-listopt2 li { margin-bottom: 45px } .ul-listopt2 li:last-child { margin-bottom: 26px } .ul-listopt2 .pic { position: relative; width: 63px; float: left } .ul-listopt2 .img { width: 63px; height: 63px; display: block } .ul-listopt2 .img1 { animation: animtran 8s linear infinite; -webkit-animation: animtran 8s linear infinite } @keyframes animtran { from { transform: rotateZ(0) } to { transform: rotateZ(360deg) } } .ul-listopt2 .img2 { position: absolute; left: 0; right: 0; top: 0; bottom: 0 } .ul-listopt2 .txt { overflow: hidden; padding-left: 10px; position: relative } .ul-listopt2 .txt .line { display: block; position: absolute; left: 0; right: 0; height: 20px; top: 30px } .ul-listopt2 .tit { font-size: 18px; font-weight: 400; color: #0cf; margin-bottom: 10px } .ul-listopt2 .desc { font-size: 18px; font-weight: 400; color: #fff } .m-opt-vx { width: 1275px; height: 109px; display: flex; align-items: center; justify-content: center; margin: 0 auto; background-image: url(../img/dzhwk/sys/a7.png); background-position: center; background-repeat: no-repeat; background-size: cover } .m-opt-vx img { display: block } .m-opt-vx .logo-sys { margin-right: 126px } .m-opt-vx .logo-sys img { width: 213px; height: 60px } .m-opt-vx .vx img { width: 78px; height: 76px } @media only screen and (min-width: 1199px) and (max-width: 1920px) { .row-opt { padding: 3.229vw 3.385vw 0 } .m-contopt { width: 67.91vw; height: 38.33vw; background-image: url(../img/dzhwk/sys/a5.png); background-position: center; background-repeat: no-repeat; background-size: cover; margin: 0 auto } .ul-listopt2 { padding: 3.125vw 0 0 4.687vw } .ul-listopt2 li { margin-bottom: 2.343vw } .ul-listopt2 li:last-child { margin-bottom: 1.354vw } .ul-listopt2 .pic { position: relative; width: 3.281vw; float: left } .ul-listopt2 .img { width: 3.281vw; height: 3.281vw; display: block } .ul-listopt2 .img1 { animation: animtran 8s linear infinite; -webkit-animation: animtran 8s linear infinite } @keyframes animtran { from { transform: rotateZ(0) } to { transform: rotateZ(360deg) } } .ul-listopt2 .img2 { position: absolute; left: 0; right: 0; top: 0; bottom: 0 } .ul-listopt2 .txt { overflow: hidden; padding-left: .52vw; position: relative } .ul-listopt2 .txt .line { display: block; position: absolute; left: 0; right: 0; height: 1.041vw; top: 1.562vw } .ul-listopt2 .tit { font-size: .937vw; font-weight: 400; color: #0cf; margin-bottom: .52vw } .ul-listopt2 .desc { font-size: .937vw; font-weight: 400; color: #fff } .m-opt-vx { width: 66.4vw; height: 5.677vw; display: flex; align-items: center; justify-content: center; margin: 0 auto; background-image: url(../img/dzhwk/sys/a7.png); background-position: center; background-repeat: no-repeat; background-size: cover } .m-opt-vx img { display: block } .m-opt-vx .logo-sys { margin-right: 6.562vw } .m-opt-vx .logo-sys img { width: 11.09vw; height: 3.125vw } .m-opt-vx .vx img { width: 4.062vw; height: 3.958vw } }