fafa} .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{ padding: 15px 0; border-bottom: dashed 1px #89898a;} .search_list li, .search_list li a{ color: #89898a} .search_list li a:hover{ color: #ba936b} .search_list li time{ float: right} .link_list{ padding-top: 3%} .link_list ul li{ float: left; width: 16.666%; padding: 1%;} .link_list ul li a{ display: block; border: solid 1px #eee; background-color: #fff; padding: 10px;} .link_list ul li .photo{ overflow: hidden} .link_list ul li span{ display: block; padding-bottom: 38%; background: no-repeat center center; background-size: contain} .link_list ul li h4{ padding: 10px 0; font-size: 16px; margin: 0; font-weight: normal} @media(max-width:1024px){ .link_list ul li{ width: 25%} } @media(max-width:640px){ .link_list ul li{ width: 50%} } .article_info .article{ padding: 3%; min-height: 200px;} /*ShaoLing*/ /* 视频弹窗 */ .video-play-wrap { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000; background-color: rgba(0, 0, 0, .5); display: none; width: 100%; height: 100%; } .video-play-wrap .inner { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 80%; height: 90%; } .video-play-wrap video { position: absolute; width: 100%; height: 100%; } .video-play-wrap .close-btn { background: rgba(30, 30, 30, .6); cursor: pointer; height: 44px; padding: 10px; transition: color .2s; vertical-align: top; width: 44px; position: absolute; right: 0; top: 0; color: #ccc; } .video-play-wrap .close-btn svg path { fill: transparent; stroke: currentColor; stroke-linejoin: round; stroke-width: 3; } .About_tit{ font-size: 30px; margin: 0; font-weight: normal; text-align: center;} .About_tit p{ margin: 0; font-size: 16px; color: #666;} .About_box1{ background: url(../images/About_bg1.jpg) repeat; padding: 3.5% 0 1.5%;} .About_box1 .fl{ width: 55%;} .About_box1 .About_tit{ text-align: left;} .About_box1 .fl .txt{ font-size: 16px; line-height: 36px; padding: 1% 0 0 0; color: #666; text-align: justify;} .About_box1 .fr{ width: 38%;} .About_box2{ padding: 3% 0 6%;} .About_box2 ul{ margin-top: 3%;} .About_box2 li{ width: 32.052%; margin-right: 1.9%; float: left; position: relative; overflow: hidden;} .About_box2 li:nth-child(3){ margin-right: 0;} .About_box2 li figure{ padding-top: 80%;} .About_box2 li .txt{ position: absolute; left: 0; bottom: 0; text-align: center; color: #fff; font-size: 16px; padding: 0 11%; transition: all 0.5s; z-index: 5; height: 60px;} .About_box2 li .txt h3{ font-size: 20px; margin-top: 0; font-weight: normal;} .About_box2 li .txt p{ opacity: 0;} .About_box2 li::before, .About_box2 li::after{ content: ''; position: absolute; left: 0; bottom: 0;} .About_box2 li::before{ width: 100%; height: 37%; 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%);} .About_box2 li:hover::after{ width: 100%; height: 100%; background-color: rgba(0,0,0,0.5);} .About_box2 li:hover ::before{ opacity: 0;} .About_box2 li:hover .txt{ transform: translateY(50%); bottom: 50%; height: auto; } .About_box2 li:hover .txt p{ opacity: 1;} .About_box3{ background-color: #f7f7f7; padding: 4% 0;} .About_box3 ul{ margin-top: 3%;} .About_box3 li{ float: left; width: 48.718%; margin-right: 2.56%; margin-bottom: 2%;} .About_box3 li:nth-child(2n){ margin-right: 0;} .About_box3 li:nth-child(2n+1){ clear: both;} .About_box3 li figure{ padding-top: 52.633%;} .About_box3 li .txt{ background-color: #fff; padding: 5% 6%; min-height: 286px; text-align: justify;} .About_box3 li h3{ margin: 0 0 2%; font-size: 20px;} .About_box3 li p{ margin: 0; font-size: 16px; line-height: 32px; color: #666666;} @media(max-width:1400px){ .About_box2 li .txt h3{ font-size: 18px;} .About_box2 li .txt{ padding: 0 5%; font-size: 14px; line-height: 28px;} } @media(max-width:1024px){ .About_tit{ font-size: 24px;} .About_tit p{ font-size: 14px;} .About_box1 .fl, .About_box1 .fr{ width: 100%; float: none;} .About_box1 .fr{ text-align: center; margin: 2% 0;} .About_box1 .fl .txt, .About_box3 li p{ font-size: 14px; line-height: 28px;} .About_box3 li h3{ font-size: 18px;} } @media(max-width:768px){ .About_box2 li, .About_box3 li{ width: 100%; margin-right: 0; margin-bottom: 2%;} .About_box3 li .txt{ min-height: auto;} } .video_list{ padding-top: 5%;} .honor_list li{ width: 33.33%; float: left; text-align: center;} .honor_list li a{ display: block; width: 100%; padding: 2% 2% 10%; border: 1px solid #ececec; margin-left: -1px; margin-bottom: -1px; transition: all 0.5s;} .honor_list li figure{ position: relative; padding-top: 80%;} .honor_list li img{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); max-height: 100%;} .honor_list li p{ margin: 0; font-size: 18px; color: #333;} .honor_list li a:hover{ box-shadow: 0 0 25px rgba(0,0,0,0.1); border-color: #fff;} @media(max-width:640px){ .honor_list li{ width: 50%;} .honor_list li p{ font-size: 16px;} } .video_list{ padding-top: 5%;} .video_list li{ width: 32.052%; margin-right: 1.9%; float: left; position: relative; overflow: hidden; cursor: pointer; margin-bottom: 2%;} .video_list li:nth-child(3n){ margin-right: 0;} .video_list li figure{ position: relative; padding-top: 64%;} .video_list li .video_bn, .video_list li figure::before{ position: absolute; left: 0; top: 0; width: 100%; height: 100%;} .video_list li figure::before{ content: ''; background: url(../images/play_icon.png) no-repeat center rgba(0,0,0,0.2); transition: 0.5s} .video_list li .video_bn{ z-index: 10;} .video_list li p{ margin: 0; background-color: #f7f7f7; padding: 5% 9%; font-size: 18px; color: #333333; line-height: 28px;} .video_list li time{ float: right; font-size: 14px; color: #999999; margin-left: 10px;} .video_list li:hover p{ color: #fff; background-color: #c8192a} .video_list li:hover figure::before{ background-color: transparent; opacity: 0.5} @media(max-width:1024px){ .video_list li p{ font-size: 16px;} .video_list li time{ font-size: 12px;} } @media(max-width:768px){ .video_list li{ width: 49%; margin-right: 2%;} .video_list li:nth-child(3n){ margin-right: 2%;} .video_list li:nth-child(2n){ margin-right: 0;} } @media(max-width:640px){ .video_list li{ width: 100%; margin-right: 0!important;} .video_list li p{ font-size: 14px;} } .Charity_list .list{ padding: 5% 0;} .Charity_list .list:nth-child(2n){ background-color: #f7f7f7;} .Charity_list .list .pic{ width: 63.5%;} .Charity_list .list .txt{ padding: 3% 2% 3% 6%;} .Charity_list .list .txt *{ margin: 0; font-weight: normal;} .Charity_list .list h3{ font-size: 24px; color: #333333; padding-bottom: 3%;} .Charity_list .list h4{ font-size: 16px; color: #666666;} @media(max-width:1000px){ .Charity_list .list h3{ font-size: 20px;} } @media(max-width:640px){ .Charity_list .ytable-cell{ display: block; width: 100%!important;} .Charity_list .list .txt{ padding: 3% 0;} .Charity_list .list h3{ font-size: 16px; padding-bottom: 0;} .Charity_list .list h4{ font-size: 12px;} } .brand_power{ padding: 5% 0 2.5%;} .brand_power .tit{ text-align: center; padding-bottom: 3%;} .brand_power .tit *{ font-weight: normal; margin: 0;} .brand_power .tit h3{ font-size: 30px; color: #333; padding-bottom: 10px;} .brand_power .tit h4{ font-size: 16px; line-height: 32px; color: #666;} .brand_power li{ margin-bottom: 2.5%;} .brand_power .pic{ width: 70.55%;} .brand_power .txt{ background-color: #f8f8f8; padding: 2% 0 2% 5%;} .brand_power .txt b{ font-size: 36px; color: #c8192a;} .brand_power .txt h2{ font-size: 24px; color: #333;} .brand_power .txt h2::after{ content: ''; display: block; width: 30px; height: 3px; backgrou