|
@@ -1,8 +1,9 @@
|
|
|
@charset "utf-8";
|
|
|
+li{list-style:none}
|
|
|
/**
|
|
|
* PC端
|
|
|
*/
|
|
|
-li{list-style:none;}
|
|
|
+@media screen and (min-width:768px){
|
|
|
.instrumentBox{width:100%;margin:16px 0;background:#FFF;box-sizing:border-box;padding:15px}
|
|
|
.instrumentBox .imageBox{float:left;width:452px;height:300px;background:#F3F7FE;}
|
|
|
.instrumentBox img{width:100%;height:100%;display:block}
|
|
@@ -29,21 +30,34 @@ li{list-style:none;}
|
|
|
.detailInfo .tabCon img{max-width:100%;}
|
|
|
.detailInfo .tabCon table{width:100%;text-align:left}
|
|
|
|
|
|
-.pageFloor .title{height:24px;line-height:24px;padding-left:10px;border-left:4px solid #E15616;margin:32px 0 16px 0;font-size:24px;color:#4A4F58;font-weight:bolder}
|
|
|
-.pageFloor .content{width:1202px}
|
|
|
-.pageFloor .content li{float:left;width:284px;height:334px;margin:0 16px 16px 0;background:#FFF}
|
|
|
-.pageFloor .content li img{display:block;width:284px;height:284px}
|
|
|
-.pageFloor .content li span{display:block;height:50px;line-height:50px;padding:0 10px;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#93979F;font-size:16px}
|
|
|
-.pageFloor .content li:hover{box-shadow:0 2px 6px #dedede;transition:all 0.5s;-webkit-transition:all 0.5s}
|
|
|
-.pageFloor .content li:hover span{color:#E15616}
|
|
|
|
|
|
-.contactBox{width:100%;background:#FFF;margin-bottom:-29px;padding-bottom:15px}
|
|
|
-.contactBox .tit{position:relative;width:1184px;margin:0 auto;height:80px}
|
|
|
-.contactBox .tit:before{content:'';position:absolute;left:0;top:39px;width:100%;border-top:1px solid #FFE6DC}
|
|
|
-.contactBox .tit span{width:188px;height:80px;line-height:80px;background:#FFF;position:absolute;top:0;left:50%;margin-left:-94px;font-weight:bold;font-size:28px;color:#2D3036;text-align:center}
|
|
|
-.contactBox .cont{width:1184px;margin:0 auto;text-align:center;line-height:48px}
|
|
|
-.contactBox .cont span{display:inline-block;padding-left:84px;height:96px;text-align:left;font-size:24px;color:#2D3036;position:relative}
|
|
|
-.contactBox .cont .call{margin-right:160px}
|
|
|
-.contactBox .cont span:before{width:70px;height:70px;position:absolute;left:0;top:10px}
|
|
|
-.contactBox .cont .call:before{background-position:-82px -370px}
|
|
|
-.contactBox .cont .phone:before{background-position:0 -370px}
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+* 移动端
|
|
|
+*/
|
|
|
+@media screen and (max-width:768px){
|
|
|
+.instrumentBox{width:100%;background:#FFF;padding-bottom:2.7vw;margin-bottom: 2.7vw;}
|
|
|
+.instrumentBox .imageBox{width:100%;height:66.6vw;}
|
|
|
+.instrumentBox img{width:100%;height:100%;display:block}
|
|
|
+.instrumentBox .infoBox{width:93.4vw;margin:2.7vw auto 0;color:#93979F;background:#F3F7FE;box-sizing:border-box;padding:2.7vw;font-size:3.4vw;border-radius:2px;position:relative;}
|
|
|
+.instrumentBox .infoBox hr{border:none;border-top:1px dashed #BEC2C9;margin:1vw 0}
|
|
|
+.instrumentBox .infoBox .row{position:relative;padding:1.3vw 0 1.3vw 16vw;line-height:4.7vw}
|
|
|
+.instrumentBox .infoBox .row .l{display:inline-block;min-width:14.2vw;height:7.4vw;text-align:justify;vertical-align:top;margin-left:-16vw;}
|
|
|
+.instrumentBox .infoBox .row .l:after{content:'';display:inline-block;width:100%}
|
|
|
+.instrumentBox .infoBox .row>i{font-style:normal;}
|
|
|
+.instrumentBox .infoBox .row em{font-style:normal;color:#4A4F58}
|
|
|
+.instrumentBox .infoBox .tit{color:#E15616;padding:1.3vw 0;line-height:4.7vw;}
|
|
|
+.instrumentBox .infoBox .share,.instrumentBox .infoBox .buy{display:none;}
|
|
|
+
|
|
|
+.detailInfo{background:#FFF;margin-bottom:2.6vw;}
|
|
|
+.detailInfo .tabTit{padding:1.5vw 3.3vw;}
|
|
|
+.detailInfo .tabTit span{display:inline-block;height:7.5vw;line-height:7.5vw;border-bottom:2px solid transparent;color:#93979F;font-size:3.4vw;margin-left:8vw;}
|
|
|
+.detailInfo .tabTit span.on{color:#E15621;border-color:#E15621}
|
|
|
+.detailInfo .tabTit span:first-child{margin-left:0;}
|
|
|
+.detailInfo .tabCon{padding:1.2vw 3.3vw 3.3vw;text-align:center;font-size:3.4vw;}
|
|
|
+.detailInfo .tabCon img{max-width:100%;height:auto!important;}
|
|
|
+.detailInfo .tabCon table{width:100%;text-align:left}
|
|
|
+
|
|
|
+}
|
|
|
+
|