﻿@charset "utf-8"; 
/*prodetail*/
.preview-container{width:550px;position:relative}
.preview-container #media{height:550px!important;width:100%;display:none;border:1px solid #dfdfdf}
.preview-container .small-box{width:100%;height:550px;border:1px solid #dfdfdf;position:relative}
.preview-container .small-box img{width:100%;height:100%;object-fit:contain}
.preview-container .small-box .hover{position:absolute;width:180px;height:180px;background-color:rgba(204,204,204,.6);border:1px solid #eee;display:none;cursor:move;z-index:9}
.preview-container .small-box .vPlay{position:absolute;right:0;bottom:0;z-index:9;width:40px;height:40px;text-align:center;line-height:40px;background:rgba(0,0,0,.4);cursor:pointer;color:#fff;display:none;font-size:24px}
.preview-container .thumbnail-box{margin-top:20px;position:relative;padding:0 30px}
.preview-container .thumbnail-box .item{height:100px;display:flex;align-items:center;justify-content:center;border-radius:3px;border:1px solid #dcdcdc;cursor:pointer;overflow:hidden}
.preview-container .thumbnail-box .item img{width:100%;height:100%;object-fit:contain}
.preview-container .thumbnail-box .item.item-cur{border-color:var(--color)}
.preview-container .thumbnail-box .item .imgalt{display:none}
.preview-container .thumbnail-box .prodetails-button-next,.preview-container .thumbnail-box .prodetails-button-prev{display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;width:30px;height:30px;transition:all .2s linear}
.preview-container .thumbnail-box .prodetails-button-next{left:auto;right:0}
.preview-container .big-box{display:none;border:1px solid #dfdfdf;border-left:none;width:420px;height:400px;position:absolute;left:100%;top:0;overflow:hidden;z-index:999;background:#fff}
@media (max-width:1366px){.preview-container{width:480px}
.preview-container .small-box{height:480px}
.preview-container .thumbnail-box .item{height:90px}
.preview-container #media{height:480px}}
@media (max-width:1366px){.preview-container{width:400px}
.preview-container .small-box{height:400px}
.preview-container .thumbnail-box .item{height:80px}
.preview-container #media{height:400px}}
@media (max-width:1024px){.preview-container{width:100%}
.preview-container .small-box{display:none}
.preview-container .thumbnail-box{padding:0;margin:0;border:1px solid #e5e5e5;overflow:hidden}
.preview-container .thumbnail-box .item{height:calc(100vw - 30px);border:none}
.preview-container #media{border:none;height:calc(100vw - 30px)!important;min-height:240px;max-width:100%}
.preview-container .thumbnail-box .item .imgalt{position:absolute;left:50%;transform:translateX(-50%);z-index:99;bottom:8px;background:rgba(0,0,0,.2);color:#fff;width:95%;padding:0 6px;line-height:35px;text-align:center;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;border-radius:30px;font-size:14px;padding-right:40px;text-transform:capitalize}
.preview-container .thumbnail-box .prodetails-button-next,.preview-container .thumbnail-box .prodetails-button-prev{display:none}}
/*prodetail*/
.prodetails-content .prodetails-des{display:flex;margin:0;background:#e6e6e6}
.prodetails-content .prodetails-des span:nth-child(1){font-weight:var(--fontbold6);display:inline-block;background-color:var(--color);color:#fff;margin:0;padding:5px 30px 5px 20px;font-size:20px;position:relative;width:auto;height:auto}
.prodetails-content .prodetails-des span:nth-child(1):before{content:'';display:block;width:12px;height:102%;background-color:#fff;position:absolute;right:-6px;top:0;transform:skewX(-18deg)}
.prodetails-content .prodetails-des span:nth-child(2){flex:1;padding:0 10px;text-transform:capitalize;font-weight:400;display:flex;align-items:center;justify-content:flex-end;font-size:12px;background:#e6e6e6;width:auto;height:auto;}
@media (max-width:768px){.prodetails-content .prodetails-des span:nth-child(1){font-size:18px;}}
@media (min-width:1700px){.pro-d-main .pro-img-active-maxhight img{max-height:250px;object-fit:contain}}
@media (min-width:1468px){.prodetails-info .pagelink{margin-top:63px}}
@media (min-width:1585px){.prodetails-info .pagelink{margin-top:115px}}


.home-mainproduct .homepro-list .swiper-slide .info {width:60%;flex:inherit;}
.home-mainproduct .homepro-list .swiper-slide {height:auto;}
@media (max-width:1600px) and (min-width:769px){.home-mainproduct #homemainproduct{height:580px}}
@media (max-width:1366px) and (min-width:769px){.home-mainproduct #homemainproduct{height:510px}
.home-mainproduct .homepro-list .swiper-slide .info .title{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-bottom:10px;}
.home-mainproduct .homepro-list .swiper-slide .info .text{margin-bottom:10px}
.home-mainproduct .homepro-list .swiper-slide .info{padding:10px 20px}}
@media (max-width:1024px) and (min-width:769px){.home-mainproduct #homemainproduct{height:420px}
.home-mainproduct .homepro-list .swiper-slide .info .title{margin-bottom:5px;line-height:1.3;}
.home-mainproduct .homepro-list .swiper-slide .info .text{margin-bottom:6px;font-size:14px;}
.home-mainproduct .homepro-list .swiper-slide .info .home-more{height:38px;font-size:13px;min-width:120px;}
.home-mainproduct .homepro-list .swiper-slide .info{padding:10px 20px}}
@media (max-width:768px){.home-mainproduct #homemainproduct{height:auto}}
@media (max-width:560px){.home-mainproduct .homepro-list .swiper-slide .info .title{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-bottom:10px;}}
.home-case .homecase-list .swiper-slide .content .text{text-transform:capitalize}
