@charset "utf-8";
/* CSS Document */ 
/* 全局公用的css样式 */
/*---------------------------------约束样式----------------------------------------*/
*{margin:0; padding:0; word-wrap:break-word}
* img{border:0}
* hr{border:1px dashed #d2d2d2}
.swiper-next,
.swiper-prev{outline:none; cursor:pointer}
body,h1,h2,h3,h4,h5,h6,td,th,tr{color:#333333; font-weight:normal; font-size:12px; font-family:"Microsoft YaHei"}
body{overflow-x:hidden}
h1,h2,h3,h4,h5,h6{display:inline}
a{text-decoration:none; outline:none; color:#333333; cursor:pointer}
a:active{star:expression(this.onFocus=this.blur())}
a:focus{outline:none}
textarea{resize:none}
a:hover{color:#d02c30; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent}
em{font-style:normal}
img{max-width:100%}
.ul li,
.ul{list-style:none}
.clear{width:100%; clear:both; height:1px; overflow:hidden}
.fl{float:left}
.fr{float:right}
input,textarea,select{outline:none; font-family:"Microsoft YaHei"}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill{-webkit-box-shadow:0 0 0px 1000px white inset; -moz-box-shadow:0 0 0px 1000px white inset; box-shadow:0 0 0px 1000px white inset}
input:-internal-autofill-previewed,
input:-internal-autofill-selected{-webkit-text-fill-color:#333; transition:background-color 5000s ease-out 0.5s}
input:-webkit-autofill{
    -webkit-animation:autofill-fix 1s infinite !important; 
    /*选择历史记录的文字颜色*/
    -webkit-text-fill-color:#333;
    -webkit-transition:background-color 50000s ease-in-out 0s !important;
    transition:background-color 50000s ease-in-out 0s !important;
    background-color:transparent !important;
    background-image:none !important;
    /*选择历史记录的背景颜色 */
    -webkit-box-shadow:0 0 0 1000px white inset !important
}
@-webkit-keyframes autofill{
    to{color:#333; background:#fff}
}

input:-webkit-autofill{animation-name:autofill !important; animation-fill-mode:both !important}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{background-clip:content-box !important}
.layout{}
.shadow{-webkit-box-shadow:rgba(0,0,0,0.15) 0 0 15px; -moz-box-shadow:rgba(0,0,0,0.15) 0 0 15px; box-shadow:rgba(0,0,0,0.15) 0 0 15px}
.fl-clr{zoom:1}
.fl-clr:after{display:block; clear:both; height:0; content:"\0020"}
.pc{}
.web{display:none !important}
.opacityli li,
.opacity,
.opacitybox .box{opacity:0}
.titleL1{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.titleL2{overflow:hidden; text-overflow:ellipsis; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2}
.titleL3{overflow:hidden; text-overflow:ellipsis; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3}

.scale img,
.headbar_nav,
.main-nav-list li .down:after{-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease}
.scale:hover img{-webkit-transform:scale(1.1); -moz-transform:scale(1.1); -ms-transform:scale(1.1); -o-transform:scale(1.1); transform:scale(1.1)}
.top50{top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -moz-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%)}
body.hidden{overflow:hidden}
html,body{min-width:320px; max-width:750px; margin:0 auto; height:100%}
.bj_f0eff5{background:#f0eff5}

/* 初始化font-size*/
@media screen and (min-width:750px){
    html{font-size:1px}
}
@media screen and (min-width:650px){
    html{font-size:0.866667px}
}
@media screen and (min-width:601px) and (max-width:639px){
    html{font-size:0.8px}
}
@media screen and (min-width:551px) and (max-width:600px){
    html{font-size:0.733333px}
}
@media screen and (min-width:501px) and (max-width:550px){
    html{font-size:0.666667px}
}
@media screen and (min-width:451px) and (max-width:500px){
    html{font-size:0.6px}
}
@media screen and (min-width:414px) and (max-width:450px){
    html{font-size:0.546667px}
}
@media screen and (min-width:375px) and (max-width:413px){
    html{font-size:0.552px}
}
@media screen and (min-width:360px) and (max-width:374px){
    html{font-size:0.5px}
}
@media screen and (min-width:320px) and (max-width:359px){
    html{font-size:0.426667px}
}
html,
body{max-width:750px; min-width:320px; margin:0 auto}
.layout{padding:0.25rem}
/*底部样式*/
.footer{background:#383635; color:#fff; font-size:0.22rem; line-height:0.4rem; padding:0.45rem 0.25rem}
.footer .code-list{overflow:hidden; margin-left:-0.7rem}
.footer .code-list li{float:left; width:33.3%}
.footer .code-list li .box{margin-left:0.7rem; text-align:center}
.footer .code-list li .box img{width:100%}
.footer .code-list li .box  p{padding-top:5px}
.footer .text{padding-top:0.45rem}
.footer .text .t1{font-size:0.26rem}
.footer .text .t2{font-size:0.36rem; font-weight:bold}
.footer .text .t3{font-size:0.26rem; padding-top:5px}
.footer .text .txt{opacity:0.6; padding-top:0.3rem}
.footer .Outer{margin-top:0.45rem; margin-left:-0.3rem; overflow:hidden}
.footer .Outer img{width:0.64rem; height:0.64rem; margin-left:0.3rem; float:left}

/*导航*/
.headbar_bpx{height:0.88rem}
.headbar_layout{position:fixed; width:100%; left:0; top:0; background:#fff; height:0.88rem; overflow:hidden; z-index:99;
-webkit-box-shadow:rgba(26,31,36,0.25) 0 2px 10px; -moz-box-shadow:rgba(26,31,36,0.25) 0 2px 10px; box-shadow:rgba(26,31,36,0.25) 0 2px 10px}
.headbar_layout .logo{position:absolute; height:0.63rem; left:0.25rem; top:50%; margin-top:-0.31rem}

.headbar_ioc{float:right; height:0.88rem; /*padding-right:0.25rem; padding-top:0.26rem*/}
.headbar_ioc .ioc{float:left; width:0.7rem; height:0.88rem; background-size:60% !important}
.headbar_ioc .ioc1{background:url(../images/ioc1.png) no-repeat center center}
.headbar_ioc .ioc2{background:url(../images/ioc2.png) no-repeat center center}
.headbar_ioc .ioc3{background:url(../images/ioc3.png) no-repeat center center}
.headbar_ioc .ioc4{background:url(../images/ioc4.png) no-repeat center center}

.headbar_nav{position:fixed; right:-100%; top:0; bottom:0; width:85%; background:#fff; overflow:auto; z-index:101; opacity:0}
.headbar_nav .close{position:absolute; right:0.25rem; top:10px; width:0.4rem; height:0.4rem; background:url(../images/close.png) no-repeat; background-size:100%}
.headbar_bpx .mask{position:fixed; width:100%; left:0; top:0; height:100%; z-index:100; background:rgba(0,0,0,0.5); display:none}
.headbar_nav.open{right:0; opacity:1}

.main-nav-list{padding:30px 0.25rem 0.25rem 0.25rem}
.main-nav-list li{}
.main-nav-list li .a{display:block; position:relative; height:0.89rem; font-size:0.28rem; line-height:0.89rem; padding:0 5px; border-bottom:1px solid #eee}
.main-nav-list li .a a{display:block; height:0.89rem}
.main-nav-list li .down:after{content:""; position:absolute; width:0.25rem; height:0.16rem; right:0.25rem; top:50%; margin-top:-0.08rem; background:url(../images/down.png) no-repeat; background-size:100%}
.main-nav-list li .down.on:after{transform:rotate(180deg);
-ms-transform:rotate(180deg);   /* IE 9 */
-moz-transform:rotate(180deg);  /* Firefox */
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
-o-transform:rotate(180deg)}
.main-nav-list li .drop-down{display:none}
.main-nav-list li .drop-down p a{display:block; height:0.89rem; line-height:0.89rem; font-size:0.28rem; padding:0 0.25rem; border-bottom:1px solid #eee}
.main-nav-list li.hover .a,
.main-nav-list li.hover .a a{color:#d02c30}

.code-pop{padding: 20px 20px 29px 20px;background:#fff;border-radius:10px;overflow:hidden;width:200px;height:200px;position:fixed;z-index:101;left:50%;margin-left:-115px;top:50%;margin-top:-115px;display:none}
.code-pop img{width:100%; height:200px}

.right-bar{position:fixed; bottom:0.35rem; z-index:99; right:0.34rem; width:0.96rem}
.right-bar .ioc{display:block; width:100%; margin-bottom:0.24rem}
.right-bar .ioc img{width:100%}
.right-bar-product{position:absolute; bottom:2.7rem; right:-0.34rem; width:1.4rem; padding:0.15rem; background:rgba(255,255,255,0.75);-webkit-box-shadow:rgba(92,92,92,0.38) 0 0 12px; -moz-box-shadow:rgba(92,92,92,0.38) 0 0 12px; box-shadow:rgba(92,92,92,0.38) 0 0 12px; border-radius:10px 0 0 10px; overflow:hidden; text-align:center; display:none}
.right-bar-product .title{font-size:0.28rem; line-height:0.4rem}
.right-bar-product .ul{overflow:hidden}
.right-bar-product li{padding-bottom:0.2rem}
.right-bar-product img{width:100%}
.right-bar-product .bnt{height:0.35rem; line-height:0.35rem; font-size:0.26rem; color:#666}
.right-bar-product .bnt span{position:relative; padding-right:0.35rem}
.right-bar-product .bnt span:after{content:""; position:absolute; right:0; top:50%; margin-top:-0.06rem; width:0.18rem; height:0.12rem; background:url(../images/up.png) no-repeat; background-size:100%}


/*大图轮播*/
.banner-box{overflow:hidden; position:relative}
.banner-box img{width:100%}
.banner-box .swiper-pagination-bullet{width:8px; height:8px; background:#fff; opacity:1; border-radius:50px;outline:none}
.banner-box .swiper-pagination-bullet-active{width:28px; background:#f1221d}

/*公共样式*/
.anchor{position:relative; top:-1.3rem}
.title-h1{text-align:center; line-height:0.4rem; margin-bottom:0.35rem}
.title-h1 .h1{color:#d02c30; font-size:0.36rem; font-weight:bold}
.title-h1 .h1:after{content:""; display:block; width:0.5rem; height:5px; margin:0.15rem auto; border-radius:20px; background:#d02c30}
.title-h1 .txt{color:#666; font-size:0.28rem}


/*首页*/
.index-1{padding:0.3rem 0}
.product-list li{padding-bottom:0.25rem}
.product-list li img{width:100%; border-radius:10px}

.index-2{padding:0 0 0.3rem 0}
.service-list li{padding-bottom:0.2rem}
.service-list li *{overflow:hidden}
.service-list li .box{display:block; position:relative; background:#efefef; border-radius:10px; padding:0.25rem 0.2rem 0.25rem 2.1rem; min-height:1.4rem;
/*-webkit-box-shadow:rgba(26,31,36,0.25) 0 2px 10px; -moz-box-shadow:rgba(26,31,36,0.25) 0 2px 10px; box-shadow:rgba(26,31,36,0.25) 0 2px 10px*/}
.service-list li .box .img{position:absolute; left:0.2rem; width:1.6rem; height:1.6rem; border-radius:50%; top:50%; margin-top:-0.8rem}
.service-list li .box .title{font-size:0.29rem;line-height:0.4rem;text-align:left;white-space:nowrap;text-overflow:ellipsis; color:#333; margin-top:0.1rem}
.service-list li .box .txt{font-size:0.26rem; color:#666; line-height:0.35rem; height:0.7rem; margin-top:0.05rem; text-align:left; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2}
.service-list.s4 li .box{padding:0.2rem 0.2rem 0.2rem 2.1rem}
.service-list.s4 li .box .txt{-webkit-line-clamp:3; height:auto; /*padding-bottom:0.02rem*/  line-height:0.34rem}
.service-list.s4 li .box .title{margin:0}
.service-video{position:relative}
.service-video.ma{margin:0.4rem 0}
.service-video .box{display:block; overflow:hidden; position:relative}
.service-video .box:before{content:""; position:absolute; left:50%; margin-left:-0.32rem; top:50%; margin-top:-0.32rem; width:0.64rem; height:0.64rem; background:url(../images/play.png) no-repeat; background-size:100%; z-index:3}
.service-video .box:after{content:""; position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,0.5); z-index:2}
.service-video img{width:100%; float:left}
.service-video video,
.video-js{width:100% !important; height:3.9rem !important}
.video-js .vjs-big-play-button{ width:48px; height:48px; border-radius:50%; border:0; top:50%; left:50%; transform:translate(-50%, -50%);}
.customer-img{overflow:hidden}
.service-video .VideoBtn{position:absolute; width:100%; height:100%; left:0; top:0; z-index:99}


.index-3{padding:0.3rem 0}
.share-list{margin-left:-0.2rem;margin-top:0.2rem}
.share-list li{float:left; width:50%; padding-bottom:0.15rem}
.share-list li *{overflow:hidden}
.share-list li .box{display:block; margin-left:0.2rem; text-align:center; position:relative; overflow:hidden}
.share-list li .box:before{content:""; position:absolute; left:0; top:0; width:100%; height:100%; z-index:2}
.share-list li .box img{width:100%; border-radius:5px}
.share-list li .box .title{font-size:0.28rem; line-height:0.7rem; height:0.7rem}


.index-4{padding:0.15rem 0 0.3rem 0}
.customer-img img{width:100%}

.index-5{padding:0.3rem 0}
.news-list{}
.news-list li{padding-bottom:0.2rem}
.news-list li *{overflow:hidden}
.news-list li .box{display:block; position:relative; background:#fff; border-radius:10px; padding:0.3rem 0.25rem 0.3rem 2.7rem; border:1px solid #eee;/*-webkit-box-shadow:rgba(26,31,36,0.25) 0 2px 10px; -moz-box-shadow:rgba(26,31,36,0.25) 0 2px 10px; box-shadow:rgba(26,31,36,0.25) 0 2px 10px;*/ min-height:1.36rem}
.news-list li .box .img{position:absolute; left:0.3rem; width:2.2rem; height:1.36rem; top:50%; margin-top:-0.68rem}
.news-list li .box .title{font-size:0.29rem; line-height:0.5rem; max-height:1rem; text-align:left; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1}
.news-list li .box .txt{font-size:0.26rem; color:#666; line-height:0.35rem; height:0.7rem; margin-top:0.05rem; text-align:left; text-overflow:ellipsis; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2}


/*明星产品详情页*/
.product_img{overflow:hidden; margin-bottom:0.4rem}
.product_img *{overflow:hidden}
.product_img .img{height:3.95rem}
.product_img .img img{width:100%; float:left;height:3.95rem; object-fit:cover}
.product_img .img video{width:100%; height:3.95rem; object-fit:cover}
.product_img .ul{padding-top:10px; margin-left:-0.2rem}
.product_img .ul li{float:left; width:25%}
.product_img .ul li span{display:block; border:1px solid #d9d9d9; margin-left:0.2rem}
.product_img .ul li img{width:100%}
.product_img .ul .hover span{border-color:#d7000f}
.product_show img{width:100%}


.swiper-product{overflow:hidden; margin-bottom:0.4rem}
.swiper-product .swiper-slide img,
.swiper-product .swiper-slide video{width:100%; height:3.95rem; object-fit:cover}
.swiper-product .swiper-pagination1{padding-top:10px; margin-left:-0.2rem}
.swiper-product .swiper-pagination1 .li{float:left; width:25%; height:auto; opacity:1 !important; background:#fff !important; border-radius:0 !important; outline:none}
.swiper-product .swiper-pagination1 .li span{display:block; border:1px solid #d9d9d9; margin-left:0.2rem; overflow:hidden}
.swiper-product .swiper-pagination1 .li img{width:100%; float:left}
.swiper-product .swiper-pagination1 .swiper-pagination-bullet-active span{border-color:#d7000f}



.product-h1{position:relative}
.product-h1:after{content:""; position:absolute; width:100%; left:0; bottom:0; height:0.32rem; background:#e6e6e6 url(../images/product-h1-b.jpg) no-repeat right 0}
.product-h1 .title{font-size:0.3rem; color:#fff; display:inline-block; background:#d02c30; text-align:center; line-height:0.5rem; height:0.5rem; min-width:1.4rem; padding:0 0.2rem; position:relative; z-index:2}
.product-h1 .title:after{content:""; position:absolute; width:0.3rem; height:0.5rem; right:-0.3rem; top:0; background:url(../images/product-h1.png) no-repeat; background-size:100%}

.product-text{padding:0.4rem 0; font-size:0.28rem !important; line-height:0.4rem}

.product-details-list{padding:0.4rem 0; margin-left:-0.45rem}
.product-details-list li{width:50%; float:left}
.product-details-list li a{display:block; margin-left:0.45rem}
.product-details-list li img{width:100%; float:left; border-radius:6px}

.pt40{padding-top:0.4rem}
.media-show{border:1px solid #e6e6e6; padding:0.25rem 0.2rem 0.1rem 0.2rem; text-align:center; margin:0.4rem 0}
.media-show .swiper{overflow:hidden}
.media-show .title{font-size:0.3rem; line-height:0.4rem; padding-bottom:0.25rem}
.media-show img{width:100%}


/*其他详情页*/
.details-title{text-align:center; padding:0.3rem 0; border-bottom:1px solid #eee}
.details-title .h1{font-size:0.34rem; line-height:0.55rem}
.details-title .time{font-size:0.24rem; color:#999; line-height:0.4rem}

.details-pages{text-align:center; padding-bottom:0.2rem}
.details-pages .a{display:inline-block; width:25%; height:0.6rem; line-height:0.6rem; text-align:center; font-size:0.28rem; border:1px solid #666; border-radius:100px; margin:0 3%}
.details-pages .return{position:relative; width:15%}
.details-pages .return .icon{position:absolute; width:.44rem; height:0.3rem; left:50%; margin-left:-0.22rem; top:50%; margin-top:-0.15rem; background:url(../images/return.png) no-repeat; background-size:100%}

.product-2 .product-list{padding-top:0.4rem}
.product-details-list{padding:0.4rem 0 0 0; margin:0}
.product-details-list li{width:100%; padding-bottom:0.25rem}
.product-details-list li a{margin:0}

/*ghost 20230216*/
.gwarning{font-size: 0.3rem; font-weight: bold; text-align: center; position: relative; top: -3px;}