.main{ position: relative; width: 100%; height: 100%; font-size: 0; margin: 0 auto; line-height: 1.2; } .mDetail{ position: relative; width: 9.066rem; height: 2.293rem; margin: 0 auto; font-size: 0; } .mDetailInfo1{ position: absolute; left: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -ms-transform: translate(0,-50%); -o-transform: translate(0,-50%); width: 6.333rem; font-size: 0; } .mDetailInfo1 p{ font-size: 0.373rem; color: #333; width: 100%; } .mDetailInfo1 p:nth-child(2){ margin-top: 0.2rem; } .mDetailInfo1 p:nth-child(3){ margin-top: 0.266rem; font-size: 0.32rem; } .mDetailInfo2{ position: absolute; right: 0; top: 50%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -ms-transform: translate(0,-50%); -o-transform: translate(0,-50%); width: 2.733rem; font-size: 0; } .mDetailInfo2 p{ font-size: 0.373rem; color: #333; width: 100%; text-align: right; } .mDetailInfo2 p:nth-child(1){ visibility: hidden; } .mDetail2 .mDetailInfo2 p:nth-child(1){ visibility: visible; } .mDetailInfo2 p:nth-child(2){ margin-top: 0.2rem; } .mDetailInfo2 p:nth-child(3){ margin-top: 0.266rem; font-size: 0.32rem; color: #333; } .mDetail .mDetailInfo2 p:nth-child(3){ visibility: hidden; } .mDetail .mDetailInfo2 p:nth-child(3).show{ visibility: visible; } .mDetailBottom{ position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background-color: #F0F0F0; } .notBox{ position: absolute; left: 0; top: 1.466rem; width: 100%; height: 4rem; text-align: center; } .notImg{ position: relative; width: 2.666rem; height: 2.666rem; } .notText{ position: relative; width: 100%; text-align: center; font-size: 0.4rem; color: #808080; } .mDetail2{ position: relative; width: 9.066rem; height: 1.733rem; margin: 0 auto; font-size: 0; }