.proListMain .bigItem { text-align: center; *margin-bottom:40px;} .proListMain .bigItem.colWhite {color: #1c1c1c;} .proListMain .bigItem.twoPro .greenBtn{ display:none; } .proListMain .bigItem.twoPro .col{ padding-top: 105px; } .proListMain .bigItem.colWhite .col { background: #fff;} .proListMain .bigItem.colBlueGray { color: #000;} .proListMain .bigItem.colBlueGray .col { background: -webkit-linear-gradient(#e8eff6, #f2f6fd); background: linear-gradient(#e8eff6, #f2f6fd); background: #edf4ff\9; } .proListMain .bigItem .col { padding: 53px 0 52px; /*background: -webkit-linear-gradient(#bec6cd, #dcdee2);*/ /*background: linear-gradient(#bec6cd, #dcdee2);*/ /*background: #bec6cd\9;*/ } .proListMain .bigItem .num { display: inline-block;margin:0 auto; margin-bottom: 30px; font-size: 16px; padding-bottom: 6px; border-bottom: 2px solid #000; *width:85px; } .proListMain .bigItem .num.whiteNum { border-bottom: 2px solid #fff; } .proListMain .colWhite .num.whiteNum { border-bottom: 2px solid #000; } .proListMain .bigItem h2 { font-size: 32px; margin-bottom: 22px; } .proListMain .bigItem .secondTitle { display: inline-block; font-size: 14px; margin-bottom: 50px; } .proListMain .bigItem .greenBtn { color: #fff; width: 145px; height: 46px; background: url("../images/icon-greenBtn.png") center no-repeat; background-size: 100%; font-size: 14px; letter-spacing: 2px; line-height: 46px; position: relative; margin: 0 auto; cursor:pointer; } .proListMain .bigItem .greenBtn.active .icon-inside { background: url("../../img/icon/icon-inside.png") center no-repeat; background-size: 100%; } .proListMain .bigItem .greenBtn .icon-inside { display: inline-block; width: 10px; height: 14px; background: url("../images/icon-out.png") center no-repeat; background-size: 100%; position: absolute; right: 12px; top: 16px; } .proListMain .bigItem>div{ margin:0 20px;} .proListMain .bigItem .greenBtn .hideBtn{ display:none;} .proListMain .bigItem .active .hideBtn{ display: block;} .proListMain .bigItem .active .moreBtn{ display:none;} .listItem,.listBox{ overflow:hidden; width:100%; } .listBox{display:none;} .screenWrap { padding: 36px 70px 5px 112px; background: #fff; margin-bottom: 40px; position:relative; } .screenWrap .secreenContent .seItem { margin-bottom: 34px; padding-left: 133px; overflow: hidden; } .screenWrap .secreenContent .seItem .selectTitle { float: left; margin-left: -133px; text-align: center; color: #000; font-size: 13px; padding-top: 25px; width: 100px; } .screenWrap .secreenContent .seItem .selectTitle.seOne { background: url(../images/product/c1.png) center top no-repeat; background-size: 26px; } .screenWrap .secreenContent .seItem .selectTitle.seTwo { background: url(../images/product/c2.png) center top no-repeat; background-size: 26px; } .screenWrap .secreenContent .seItem .selectTitle.seThree { background: url(../images/product/c3.png) center top no-repeat; background-size: 26px; } .screenWrap .secreenContent .seItem .selectTitle.seFour { background: url(../images/product/c4.png) center top no-repeat; background-size: 26px; } .screenWrap .secreenContent .seItem .selectTitle.seFive { background: url(../images/product/c5.png) center top no-repeat; background-size: 26px; } .screenWrap .secreenContent .seItem .selectTitle.seSix { background: url(../images/product/c6.png) center top no-repeat; background-size: 26px; } .screenWrap .secreenContent .seItem .selectTitle.seSeven { background: url(../images/product/c7.png) center top no-repeat; background-size: 26px; } .screenWrap .secreenContent .seItem .selectTitle.seEight { background: url(../images/product/c8.png) center top no-repeat; background-size: 26px; } .screenWrap .secreenContent ul { float: left; } .screenWrap .secreenContent ul li { float: left; margin-right: 20px; line-height: 53px; } .screenWrap .secreenContent ul li a{ text-decoration:none; color:#888;} .screenWrap .secreenContent ul li.active a { color: #21b3ba; } .screenWrap .secreenContent ul li a i { display: inline-block; width: 15px; height: 15px; margin-right: 1px; border-radius: 50%; position: relative; top: 3px; } .screenWrap .secreenContent ul li a i.c-golden{ background: #FBF4EB; } .screenWrap .secreenContent ul li a i.c-silver{ background: #F2F2F2; } .screenWrap .secreenContent ul li a i.c-yellow{ background: #ffe240; } .screenWrap .secreenContent ul li a i.c-green{ background: #EBF6EF; } .screenWrap .secreenContent ul li a i.c-red{ background: #FAE6E8; } .screenWrap .secreenContent ul li a i.c-black { background: #535353; } .screenWrap .secreenContent ul li a i.c-white { background: #FFF; border:1px solid #dedede; } .screenWrap .secreenContent ul li a i.c-blue { background: #b5d9f4; } .screenWrap .secreenContent ul li a i.c-gray { background: #E8ECEF; } .seItem{ position:relative;} .jdBox{ position:absolute; left:202px; top:0px; background:url(../../img/product/icon_11.png) no-repeat left top; width:411px; height:6px;} .jdBox span{ float:left; display:block; height:6px; background:url(../../img/product/icon_11_on.png) no-repeat left top;} .jdBox span.n1{ width:6px;} .jdBox span.n2{width: 73px;} .jdBox span.n3{width: 143px;} .jdBox span.n4{width: 207px;} .jdBox span.n5{width: 263px;} .jdBox span.n6{width: 352px;} .jdBox span.n7 { width: 411px; } .clearBtn{ position:absolute; right:60px; top:40px; background:url(../../img/product/icon_10.png) no-repeat left center; text-indent:24px; cursor:pointer; z-index:9;} .proNum{position:absolute; right:60px; bottom:55px;} .shumaWrap .clearBtn{ top:30px; } .shumaWrap .proNum{ bottom:30px;} .shumaWrap { padding: 36px 78px 36px 112px; background: #fff; position: relative; margin-bottom: 40px; } .shumaWrap .shumaLeft { float: left; } .shumaWrap .shumaLeft .shumaTitle { font-size: 14px; line-height: 14px; text-align: center; color: #000; padding-top: 31px; background: url("../../img/icon/icon-gongneng.png") center top no-repeat; background-size: 23px; margin-right: 92px; float: left; } .shumaWrap .shumaLeft ul { float: left; } .shumaWrap .shumaLeft ul li { float: left; margin-right: 38px; } .shumaWrap .shumaLeft ul li a { color: #888; font-size: 12px; line-height: 46px; display: inline-block; text-decoration:none; } .shumaWrap .shumaLeft ul li.active a { color: #4cf348; } .shumaWrap .shumaLeft ul li i { display: inline-block; width: 28px; height: 28px; margin-right: 0px; position: relative; top: 8px; } .shumaWrap .shumaLeft ul li .icon-yuedu { background: url(../../img/icon/icon-yuedu.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-yuedu { background: url(../../img/icon/icon-yuedu_on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-tongdeng { background: url(../../img/icon/icon-tongdeng.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-tongdeng { background: url(../../img/icon/icon-tongdeng_on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-diexing { background: url(../../img/icon/icin-diexing.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-diexing { background: url(../../img/icon/icin-diexing_on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-shedeng { background: url(../../img/icon/icon-shedeng.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-shedeng { background: url(../../img/icon/icon-shedeng_on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-dengdai { background: url(../../img/icon/icon-dengdai.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-dengdai { background: url(../../img/icon/icon-dengdai_on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-qiupao { background: url(../../img/icon/icon-qiupao.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-qiupao { background: url(../../img/icon/icon-qiupao_on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-chechong { background: url(../../img/icon/icon-chechong.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-chechong { background: url(../../img/icon/icon-chechong-on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-shujuxian { background: url(../../img/icon/icon-shujuxian.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-shujuxian { background: url(../../img/icon/icon-shujuxian-on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-dianyuan { background: url(../../img/icon/icon-dianyuan.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-dianyuan { background: url(../../img/icon/icon-dianyuan-on.png) center no-repeat; } .shumaWrap .shumaLeft ul li .icon-usb { background: url(../../img/icon/icon-usb.png) center no-repeat; } .shumaWrap .shumaLeft ul li.active .icon-usb { background: url(../../img/icon/icon-usb-on.png) center no-repeat; } .shumaWrap .shumaRight { position: absolute; top: 25px; right: 78px; color: #000; text-align: right; } .shumaWrap .shumaRight .shumaClear { font-size: 12px; line-height: 12px; margin-bottom: 32px; } .shumaWrap .shumaRight .shumaClear i { display: inline-block; margin-right: 10px; width: 16px; height: 18px; background: url(../../img/product/icon_10.png) center no-repeat; background-size: 100%; } .listItem{ *margin-bottom:40px;} .main{ background:#fafafa;} body{ background:#fafafa;} /*led动态kv banner开始*/ .kvbanner{ height: 500px; margin-bottom: 40px; overflow:hidden; } .kvbanner .swiper-container{ width: 100%; height: 100%; } .kvbanner .swiper-active-switch{ background: #fff!important; border: 1px solid #fff; } .kvbanner .swiper-pagination-switch{ background: #94928c; border: 1px solid #94928c; } .kvbanner .videoplay{ width: 100%; height: 100%; overflow: hidden; position: relative; } .kvbanner .videoplay video{ width:100%; height:100%; } .kvbanner .videoplay .kvbox .list{ width:50px; height:50px; cursor: pointer; z-index: 99; } .kvbanner .videoplay .kvbox .list1{ position: absolute; left: 176px; top: 134px; } .kvbanner .videoplay .kvbox .list2{ position: absolute; left:568px; top: 134px; } .kvbanner .videoplay .kvbox .list3{ position: absolute; left:1000px; top: 134px; } .kvbanner .videoplay .kvbox .list4{ position: absolute; left: 176px; top: 394px; } .kvbanner .videoplay .kvbox .list5{ position: absolute; left:568px; top: 394px; } .kvbanner .videoplay .kvbox .list6{ position: absolute; left:1000px; top: 394px; } .kvbanner .videoplay .kvmask{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index:-99; display:none; } .kvbanner .videoplay .kvmask .kvplay{ width: 100%; height: 100%; position: relative; } .kvbanner .videoplay .kvmask.active{ z-index:99; display: block; } .kvbanner .videoplay .kvmask .kvplay .closebtn{ width: 60px; height: 60px; background: url(../../img/hero/accessories_25_close.png) no-repeat center center; background-size: 100% auto; position: absolute; top:20px; left: 50%; margin-left: -30px; z-index:9999; cursor: pointer; } .kvbanner .videoplay .kvmask .kvplay video{ position: absolute; cursor: pointer; }