r: none; background: none} .product_case_box .search_box .search .btn{ position: absolute; right: 0; top: 0; height: 100%; width: 32px; display: block; background: url(../images/search_icon2.png) no-repeat center center;} .product_case_sort#ProSort{ margin-top: -100px; padding: 3%; box-shadow: 0 10px 40px rgba(0,0,0,0.15)} .product_case_sort#ProSort dl{border-bottom: dashed 1px #e2e2e2;} .product_case_sort#ProSort dl.search_box{ border-bottom: none;padding-top:20px;} .product_case_sort#ProSort dl.search_box a{ padding:0 10px;} .product_case_sort#ProSort ul li a{border: solid 1px #fff} .product_case_sort#ProSort dl.search_box ul li a{border-color: #d4d4d4; } .product_case_sort#ProSort dl.search_box ul li a:hover{border-color: #c8192a; } .product_case_sort#CaseSort{ padding-top: 2%} .product_case_sort#CaseSort dl:not(.search_box){ padding-top: 10px; padding-bottom: 10px;} .product_case_sort#CaseSort dl:not(.search_box) dt{ padding: 2px 0; top: 15px; background-color: #c8192a; color: #fff; width: 90px; text-align: center} .product_case_sort#CaseSort dl:not(.search_box) dt:before{ content: ''; right: -16px; top: 8px; position: absolute; border: solid 8px transparent; border-left-color: #c8192a} .product_case_sort#CaseSort dl.search_box{border-top:solid 1px #e2e2e2; margin-top: 2%; padding-top: 32px;} .product_case_sort#CaseSort dl.search_box ul{ width: 50%} .product_case_sort#CaseSort dl.search_box .search{ width: 45%;} .product_case_sort#CaseSort a.on:after{ content: ''; display: block; width: 100%; height: 1px; background-color: #c8192a; position: absolute;} .filter{border:1px solid #ddd; color: #c8192a!important; display: none;position: fixed;z-index: 199;right: 0;bottom: 70px;padding: 5px 20px;padding-left: 50px;background: #fff url(../images/icon.svg) no-repeat 10px center;background-size: 30px auto;} .filter b{ display: block;font-size: 14px;line-height: 1.2;width: 30px;} .filter.close{background: transparent;padding: 0;width: 25px;height: 25px;top: 10px;right: 2%;border-color:transparent;} .filter.close::before,.filter.close::after{content:"";display: block;position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;background: #333;transform: rotate(45deg);-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);} .filter.close::before{width: 100%;height: 2px;} .filter.close::after{height: 100%;width: 2px;} .filter.close b,.filter.close span{display: none;} @media(min-width:960px){ .product_case_box .search_box ul{width: 50%;} .product_case_box .search_box ul li{padding-right: 20px; float: left; padding-top: 4px; padding-bottom: 4px;} .product_case_sort .search_box dd{position: relative; padding-left: 130px; height: 40px; overflow: hidden ; transition: all .3s;} .product_case_box .search_box .search{float: right; width: 45%;max-width:400px;} } @media(max-width:960px){ .product_case_sort#ProSort dl.search_box dt{display:none;} .product_case_sort{font-size: 15px; } .product_case_sort dl{ padding-top: 10px; padding-bottom: 10px;} .product_case_sort dd{ padding-left: 80px;} .product_case_sort ul{ padding-left: 45px} .product_case_box .search_box .search{ margin-top: 3%} .product_case_box .search_box .search, .product_case_box .search_box ul, .product_case_box .search_box ul, .product_case_box .search_box .search{ width: 45%; } .product_case_sort#ProSort{display:none;position: fixed;z-index: 100;width: 100vw;height: 100vh;top: 0;left: 0;margin: 0;padding-top: 30px;overflow: auto;} .product_case_sort#CaseSort{z-index: 5; width: 100%;top: 0;padding: 2% 2% 2%; border-bottom: 1px solid #eee;} .product_case_sort#CaseSort{display: flex;} .product_case_sort#CaseSort dl{width: auto; flex:1;} .filter{display: none;} .product_case_sort .more{display: none !important;} /* .filter{display: block;} */ .product_case_sort#CaseSort dl:not(.search_box) dt{ text-align: center; width: auto; position: static;background-color: #fff ; color: #333; cursor: pointer;} .product_case_sort dd{width: 100vw; position: absolute; left: -4%; height: auto; padding-left: 0; background-color: #fff; z-index: 5;} .product_case_sort .all{position: static; display: block; padding-left: 4%;} .product_case_sort#CaseSort dl:not(.search_box){padding: 0;} .product_case_sort#CaseSort dl:not(.search_box) dt:before{display: none;} .product_case_sort ul{padding-left: 0;} /* .search_box{display: none;} */ .product_case_sort ul li{width: 50%; float: left; line-height: 50px; border-bottom: 1px solid #eee; padding-left: 4%;} .product_case_sort dl{position: static;} .product_case_sort#CaseSort a.on:after{left: 0;} .product_case_sort ul li a{margin: 0;} .product_case_sort#CaseSort dl:not(.search_box) dt span{position: relative;} .product_case_sort#CaseSort dl:not(.search_box) dt span::after{content: ''; width: 0; height: 0; border: 5px solid transparent; border-top-color: #c8192a ; position: absolute; right: -20px; top: 8px; margin: auto; transition: all .3s; transform-origin: center 3px;} .product_case_sort#CaseSort dl.on dt span::after{transform: rotateZ(180deg);} .product_case_sort dd{display: none;} .product_case_box .search_box{padding: 20px 0;} .product_case_box .search_box dd{padding-left: 80px;} .product_case_box .search_box dt{position: absolute; } .product_case_box .search_box ul li{float: left;} /* .product_case_box .search_box .search{display: none;} */ } @media(max-width:768px){ .menu_location .auto-inner{width: 100%;} .wapmenu{padding-left: 4%;} .menu_location .menu ul{position: static; width: 100%; display: block;} .product_case_box .search_box dt{display: none;} .product_case_box .search_box ul{display: none;} .product_case_box .search_box .search{width: 100%; float: none;} .product_case_box .search_box dd{padding-left: 0;} } @media(max-width:640px){ .product_case_sort dt{ position: relative} .product_case_sort dl.search_box dt{display:none;} .product_case_sort dd{ padding-left: 0; min-height: 0;} .product_case_sort dd.dd_hide{height: 0!important} /* .product_case_sort .all, .product_case_sort dd ul{ display: none} */ .product_case_sort .show .all, .product_case_sort .show ul{ display: block} /* .product_case_sort .more{ display: block!important} */ .product_case_sort .search_box dd{ height: auto} .product_case_sort#CaseSort dl:not(.search_box) dt{ top:0} .product_case_sort#CaseSort dl.search_box{ padding-top: 10px} .product_case_box .search_box dt{display: none;} .product_case_box .search_box dd{padding-left: 0;} } .product_list{ padding-top: 5%;} .product_list li{ float: left; width: 23.59%; margin-left: 1.88%; margin-bottom: 1.88%} .product_list li:nth-child(4n+1){ clear: both; margin-left: 0} .product_list li a{ display: block; position: relative} .product_list li .pic{ position: relative; width: 100%; top: 0; padding-bottom: 100%; background: no-repeat center center; background-size: cover; transition: 0.3s} .product_list li .pic .isimg {width: 100%;height: 100%;position: absolute;left: 0;top: 0;} .product_list li .pic_pro:before{ content: ''; display: block; position: absolute; width:14.674%; height:14.674%; right: 0; background: url(/static/default/images/pro_icon.png) no-repeat; background-size: contain} .product_list li .pic_room{ position: absolute; opacity: 0;} .product_list li .info{box-sizing: border-box; position: absolute; bottom: 0; width: 100%; padding:3.126% 5%; background-color: rgba(255,255,255,0.6);} .product_list li h3{ padding: 0; margin: 0; font-size: 18px; font-weight: normal} .product_list li p{ padding-top:8px; margin: 0; opacity: 0.8} .product_list li.show .pic_room, .product_list li:hover .pic_room{ opacity: 1} .product_list li.show .info, .product_list li:hover .info{ color: #fff; background: #c8192a} @media(max-width:960px){ .product_list li{ width: 49%; margin-left: 2%} .product_list li:nth-child(2n+1){ clear: both; margin-left: 0} .product_list li h3{font-size: 16px;} } @media(max-width:640px){ .product_list li h3{font-size: 14px;} } .menu_location .category{ color: #c8192a; font-size: 24px; float: left; padding-bottom: 20px; border-bottom: solid 2px #c8192a} .product_details .tips{ padding-top: 1%; padding-bottom: 0.5%} .product_details .photo_info{ background-color: #fafafa} .product_details .photo{ float: left; width:44.872%; padding-bottom: 10px} .product_details .photo img{ width: 100%;position:absolute;opacity:0;left:0;top:0;} .product_details .photo .num{ height:10px; position: relative;} .product_details .photo .num span{ position: absolute; top: -30px; line-height: 30px; padding: 0 2%; z-index: 5;} .product_details .photo .slider-for .item .pic {padding-top: 100%;background: no-repeat center center;position:relative;} .product_details .photo .slider-for .item .pic span {position: absolute;left: 0;bottom: 0;background-color: rgba(0,0,0,0.5);padding: 1%;opacity: 0;transition: 0.5s 0.3s ease;color: #fff} .product_details .photo .slider-for .item.slick-active .pic span {opacity: 1;} .product_details .photo .slider-nav{ padding: 0 12%} .product_details .photo .slider-nav .item{ padding: 20px 2px;} .product_details .photo .slider-nav .item a{ cursor: pointer;width: 90%; margin: auto; display: block; padding-bottom: 80%; background: no-repeat center center; background-size:cover;position: relative} .product_details .photo .slider-nav .item a span {font-size: 14px;position: absolute;left: 0; top: 50%; -webkit-transform: translateY(-50%);transform: translateY(-50%);width: 100%;text-align: center; padding: 0 5px;} .product_details .photo .slider-nav .slick-current a{ position: relative; box-shadow: 0 0 0 2px #c8192a} .product_details .photo .slider-nav .slick-current a:before{ content: ''; position: absolute; left: 50%; margin-left: -12px; top: -24px; border: solid 12px transparent; border-bottom-color:#c8192a } .product_details .photo .slider-nav .slick-arrow{cursor: pointer; width: 7%; height: 80%; border: solid 1px #eeeeee; background: no-repeat center center; background-size:auto} .product_details .photo .slider-nav .slick-prev{ left: 3%; background-image: url(../images/pro_info_prev.png)} .product_details .photo .slider-nav .slick-next{ right: 3%; background-image: url(../images/pro_info_next.png)} .product_details .info{ float: right; width: 55.128%; font-size: 16px; padding:4% 5%} .product_details .info .name{ font-size: 28px; padding: 1%; margin: 0; font-weight: normal} .product_details .info .txt{ padding-bottom: 4%; margin-bottom: 4%; border-bottom: solid 1px #e1e1e1} .product_details .info ul li{ position: relative; padding-left: 100px; padding-bottom: 30px; min-height: 58px;} .product_details .info ul li .text {margin: 0;display: none;} .product_details .info ul li b{ position: absolute; left: 0; font-weight: normal; color: #999999} .product_details .info ul.ul_txt1 li{ width: 50%; float: left; padding-right: 5%} .product_details .info ul.ul_txt1 li:nth-child(2n+1){ clear: both} .product_details .info ul.ul_txt2 span{ display:block; float: left; width: 50px; text-align: center} .product_details .info ul.ul_txt2 span img{ width: 44px; height: 44px; border: solid 1px #000} .product_details .info ul.ul_txt2 span i{ display: block; font-size: 12px; font-style: normal} .product_details .info .other{border-top: solid 1px #e1e1e1; padding-top: 4%} .product_details .info .other .ewm{ position: relative;float: left;border: solid 1px #e1e1e1; padding: 10px; display: table} .product_details .info .other .ewm:before{ content: ''; display: block; position: absolute; left: 130px; top: 0; width: 1px; height: 100%; background: #e1e1e1} .product_details .info .other .ewm img{ width: 110px;} .product_details .info .other .ewm b{ font-weight: normal; color: #808080; padding-left: 20px; width: 160px; display: inline-block; font-size: 14px;} .product_details .info .other .ewm span, .product_details .info .other .ewm b{ display: table-cell; vertical-align: middle} .product_details .info .other .btn{ float: right} .product_details .info .other .btn a{ display: inline-block;line-height: 55px; color: #fff; background: #c8192a url(../images/pro_info_icon.png) no-repeat 38px; padding-left: 60px; padding-right: 40px;} .product_details .pic_list{ padding: 5px 0;text-align:center;} .pro_sub_title{ font-size: 36px; color: #000000; text-align: center; padding: 1.5% 0; margin: 0} .product_other{ padding: 2% 40px 6% 40px;} .product_other .list{ margin-left: -10px; margin-right: -10px;} .product_other .item{ padding: 0 10px;} .product_other .item a{ display: block; position: relative} .product_other .item .pic{ padding-bottom: 67.064%; background: no-repeat center center; background-size: cover;border: 1px solid #ccc} .product_other .item .info{ width: 100%; bottom: 0;} .product_other .item h3{ padding: 2% 4%; margin: 0; font-size: 18px; font-weight: normal} .product_other .slick-arrow{ cursor: pointer;width: 50px; height: 50px; border: solid 1px #6b6b6b; background: no-repeat center center; background-size:auto; opacity: 0.5} .product_other .slick-prev{ left: -5%; background-image: url(../images/pro_info_prev.png)} .product_other .slick-next{ right: -5%; background-image: url(../images/pro_info_next.png)} @media(max-width:1200px){ .product_details .info .other .btn a{ padding-left: 40px; padding-right: 20px; background-position: 15px} } @media(max-width:1024px){ .product_details .info{ padding: 2%; font-size: 14px} .product_details .info .other .ewm b{ width: 102px} .product_details .info ul li{ padding-bottom: 10px; min-height: 38px; padding-left: 75px;} .product_details .info ul.ul_txt1 li{ float: none; width: 100%} .product_details .info .name{ font-size: 20px} .pro_sub_title{ font-size: 24px} } @media(max-width:768px){ .product_details .photo, .product_details .info{ float: none; width: 100%} .product_details .photo{ padding-bottom: 0} .product_details .info .other .ewm{ padding: 5px} .product_details .info .other .ewm img{ width: 150px} .product_details .info .other .ewm:before{ left: 100px} .product_details .info .name{ font-size: 18px; font-weight: bold} .product_details .pic_list{ padding: 2px 0} .pro_sub_title{ font-size: 22px} .product_other .item h3{font-size: 16px;} .menu_location .category{ font-size: 18px; padding-bottom: 10px;} .product_other{ padding-left:20px; padding-right: 20px;} .product_other .item .pic {padding-bottom: 100%} .product_other .slick-arrow{ width: 40px; height: 80px;top:40%;border: none;opacity: 1;background-size:cover} .product_other .slick-arrow.slick-prev {background-image: url(../images/slick_jt_prev.png)} .product_other .slick-arrow.slick-next {background-image: url(../images/slick_jt_next.png)} .product_details .info .other .ewm{display: block;} .product_details .info .other .ewm span, .product_details .info .other .ewm b{display: block;} .product_details .info .other .ewm:before{left: 0; width: 100%; height: 1px; top: 160px;} .product_details .info .other .ewm b{padding-top: 10px;width: 100%;padding-left: 0} .product_details .info .other .ewm img{display: block; margin: auto;} } .photo_list{ padding-top: 3%;} .photo_list li{ float: left; width:30.77%; margin-left:3.845%; margin-bottom: 1.88%} .photo_list li a{ display: block; position: relative} .photo_list li .pic{position: relative; overflow: hidden} .photo_list li .pic span{ display: block; width: 100%; top: 0; padding-bottom: 68.336%; background: no-repeat center center; background-size: cover;} .photo_list li .info{position:absolute; bottom:0; width:100%; padding:1% 3%; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.8))); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.8) 100%); } .photo_list li h3{ color:#fff; padding:10px 0; margin: 0; font-size: 20px; font-weight: normal} @media(min-width:768px){ .photo_list li:nth-child(3n+1){ clear: both; margin-left: 0} } @media(max-width:768px){ .photo_list li{ width: 49%; margin-left: 2%} .photo_list li:nth-child(2n+1){ clear: both; margin-left: 0} .photo_list li h3{font-size: 15px; padding: 0} } .search_list{ padding-top: 3%} .search_list li{ paddi