﻿@charset "utf-8";
/* CSS Document */
.box{position: relative;max-width: 7.5rem;margin: 0 auto;   overflow: hidden;}
.divBox{width:7.02rem; margin: 0 auto;}
.iconfont{font-size: 0.24rem;}

.index-head{ width: 100%; overflow: hidden;  background-image: linear-gradient(to left, #0b67e1 , #3d8af0); height:6.1rem;  }
.search-box{ overflow: hidden; margin-top: 0.24rem; }
.menu{ float: left; width: 0.52rem; color: #fff; text-align: center; margin-top: 0.05rem; }
.menu i{ width: 100%; display: block; float: left; height: 0.04rem; background: #fff; margin-top: 0.05rem; }
.menu i:first-child{ margin-top: 0; }
.sousuo{ width: 5.86rem; float: right; height: 0.6rem; background: #fff; border-radius: 0.2rem; line-height: 0.6rem;  }
.sousuo a{ display: block; color: #999; }
.sousuo a:before{ content: "\e875"; display: block; float: left; font-size: 0.3rem; margin-right: 0.06rem; margin-left: 0.1rem; }

.banner{overflow: hidden; margin-top: 0.3rem; border-radius: 0.2rem; }
.banner .swiper-container {
width: 100%;
margin-left: auto;
margin-right: auto;
overflow: hidden;
}
.banner .swiper-slide {
text-align: center;
background: #fff;
width: 100%;
overflow: hidden;
border-radius: 0.2rem;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.banner .swiper-slide a{ display: block; }
.banner .swiper-slide img{ width: 100%; display: block; }
.banner .swiper-pagination{bottom:0.16rem!important;}
.banner .swiper-pagination-bullet{ background: none; border-radius:50%; width: 0.16rem; height:0.16rem;opacity: 1 !important; box-sizing: border-box; background: #fff; margin-left: 0.06rem!important; margin-right: 0.06rem!important;  }
.banner .swiper-pagination-bullet-active{background: #f5ba2c; }
nav{ width: 50%; height: 100%; position: fixed; left: -50%; z-index: 9999; background:#333; top:0; overflow: hidden; transition: 0.5s; }
nav.active{left: 0;}
nav li{ width: 100%; float: left; }
nav li a{ display: block; overflow: hidden; width: 100%;  height: 1rem;line-height: 1rem; color: #fff; font-size: 0.28rem; border-bottom: 1px #444 solid; }
nav li a:after{content: "\e600"; display: block; float: right; font-size: 0.24rem; margin-right: 0.3rem;}
nav li a:before{ display: block; float: left; margin-left: 0.3rem; margin-right: 0.1rem; font-size: 0.34rem; }
nav li a.shouye-icon:before{content: "\e6c4";}
nav li a.baojia-icon:before{content: "\e644";}
nav li a.anli-icon:before{content: "\e663";}
nav li a.cahnpin-icon:before{content: "\e601";}
nav li a.chaxun-icon:before{content: "\e658";}
nav li a.luru-icon:before{content: "\e64c";}
nav li a.zixun-icon:before{content: "\e616";}
nav li a.guanyu-icon:before{content: "\e655";}

.blackbg{ width: 100%; height: 100%; position:  fixed;z-index: 999; left: 0; top:0; background: rgba(0,0,0,.5); display: none; }
.blackbg em{ display: block; position:  absolute; right: 0.24rem; top:0.24rem; width: 0.8rem; height: 0.8rem;  color: #fff; text-align: center; cursor: pointer;  line-height: 0.8rem; font-size: 0.42rem; border-radius: 50%; border:1px #fff solid; }
.blackbg em:before{content: "\e603";}
.hotproduct{ overflow: hidden; margin-top: 0.2rem; }
.hotproduct em{ display: block; float: left; color: #fff; width: 1.3rem; line-height: 0.6rem; }
.i-nav {position:relative;height: 0.6rem;width:calc(100% - 1.3rem); overflow: hidden; float: left;}
.i-nav .scroller {position:absolute;}
.i-nav .scroller li {height: 0.6rem;float: left;line-height: 0.6rem;}
.i-nav .scroller li a{color:#fff;display:block;margin:0rem 0.1rem; position: relative;}

.index-body{ width: 100%; overflow: hidden;  background: #f5f5f5; border-radius: 0.3rem 0.3rem 0 0; position: relative; margin-top: -0.36rem; padding-bottom: 0.3rem; }

.caidan{ overflow: hidden; background: #fff; border-radius: 0.2rem; margin-top: 0.3rem; padding: 0.3rem 0 0.3rem 0; }
.caidan li{ width: 25%; float: left; text-align: center; }
.caidan li a{ display: block; }
.caidan li a:before{content: ""; display: block; width: 0.9rem;height: 0.9rem;background-image: linear-gradient(to top right, #3d8af0 , #0b67e1);margin: 0 auto; border-radius: 50%;line-height: 0.9rem; color: #fff; margin-bottom: 0.02rem; font-size: 0.42rem;}
.caidan li a.caidan-baojia:before{content: "\e644";}
.caidan li a.caidan-anli:before{content: "\e663";}
.caidan li a.caidan-chanpin:before{content: "\e601";}
.caidan li a.caidan-chaxun:before{content: "\e658";}

.index-title{ overflow: hidden; margin-top: 0.3rem; }
.index-title em{ float: left; font-size: 0.28rem; color: #000; }
.index-title a{ float: right; color: #999; }
.index-title a:after{content: "\e600";}

.index-case{ overflow: hidden;background: #fff; border-radius: 0.2rem; margin-top: 0.3rem; padding-bottom: 0.3rem; padding-left: 0.3rem; padding-right: 0.3rem; box-sizing: border-box; }


.change{background: none;border:0px;padding: 0px; width: 1.2rem; margin: 0 auto; display: block; text-align: center; color: #2277e8; margin-top: 0.3rem;}
.change:before{content: "\e65b"; display: inline-block; margin-right: 0.04rem;}

.index-news{ overflow: hidden; }
.index-news ul{overflow: hidden;}
.index-news li{ width: 100%; float: left; background: #fff; border-radius: 0.2rem; margin-top: 0.3rem; }
.index-news li a{ display: block;  overflow: hidden;padding: 0.3rem; box-sizing:border-box;}
.index-news li span{ display: block; width: calc(100% - 2rem); float: left; height: 1.4rem; position: relative; }
.index-news li span h1{font-size: 0.28rem; text-align: justify;}
.index-news li span h2{color: #999; position:  absolute; left: 0; bottom:0;}

.index-news li em{ display: block; float: right; width: 1.8rem; overflow: hidden; height: 1.4rem; border-radius: 0.1rem; }
.index-news li em img{ width: 100%; height: 100%; display: block; }

footer{ width: 7.5rem; position: fixed; left: 50%; margin-left: -3.75rem; bottom:0; z-index: 99; background: #fff; height: 1.1rem; box-shadow: 0px -0.06rem 0.06rem rgba(0,0,0,.1); overflow: hidden;}
footer li{ width: 33.33333%; height: 1.1rem; float: left; text-align: center; overflow: hidden;  }
footer li a{ width: 100%; display: block; overflow: hidden; color: #666; height: 100%; }
footer li a:before{content: ""; display: block; margin-top: 0.14rem; margin-bottom: 0.04rem; font-size: 0.38rem;}
footer li:nth-child(1) a:before{content: "\e6c4";}
footer li:nth-child(2) a:before{content: "\e663";}
footer li:nth-child(3) a:before{content: "\e604";}
footer li.on a{ color:#ff590e; }
.zhanwei{ height: 1.1rem; }

.sou-box{ width: 100%;height: 0.62rem;  overflow: hidden; position:relative; line-height: 0.62rem; margin-top: 0.2rem; }
.sou-box a{ width: 0.62rem; height:100%; display: block;text-align: center;  font-size: 0.28rem;  color: #666; float: left;}
.sou-box a:before{ content: "\e609"; }
.sou-box button{ background: none;border:none;padding: 0px;  width: 1rem; height:0.62rem; display: block;text-align: center; color: #999;float: right; }
.sou-box input{ width: calc(100% - 1.76rem); display: block;background: none;border:none;padding: 0px; line-height: 0.62rem; background: #ededed; float: left; box-sizing: border-box; padding-left: 0.2rem; padding-right: 0.2rem;border-radius: 0.08rem;}

.newsbox{ width: 100%; overflow: hidden;  }
.newsbox ul{width: 100%; overflow: hidden;}
.newsbox li{ width: 100%; float: left; border-bottom: 1px #ddd solid; overflow: hidden; background: #fff; }
.newsbox li a{ display: block; overflow: hidden;box-sizing: border-box;padding: 0.24rem;}
.newsbox li em{ width: 2rem;  height: 1.6rem; display: block; float:right; border-radius: 0.1rem; overflow:hidden;  }
.newsbox li em img{ display: block; width: 100%; height: 100%; }
.newsbox li span{ display: block; width: calc(100% - 2.4rem); float: left; position: relative; height: 1.6rem; }
.newsbox li span h1{ text-align: justify; font-size: 0.28rem; }
.newsbox li span h2{ position:  absolute; left: 0; bottom:0; color: #999; }
.newsbox li span h2 i{ margin-right: 0.2rem; }

.page{ text-align: center; color: #999;  margin-top: 0.24rem; margin-bottom: 0.3rem; }

.biaotibox{ margin-top: 0.24rem; }
.biaotibox h1{font-size: 0.32rem; font-weight: bold;text-align: justify;}
.biaotibox h2{ margin-top: 0.1rem; color: #999; }

.neirong{ overflow: hidden; text-align: justify; margin-top: 0.3rem; margin-bottom: 0.3rem; line-height: 1.6; }
.neirong img{max-width: 100%!important; height: auto!important;}
.biaoqian{ margin-top: 0.3rem; color: #999; margin-bottom: 0.3rem; }


.case ul{  width: 6.42rem; overflow: hidden; margin: 0 auto; }
.case li{ width: 1.94rem; float: left; margin-right: 0.3rem; margin-top: 0.3rem; }
.case li:nth-child(3n){ margin-right: 0px; }
.case li em{ display: block; width: 100%; height: 1.6rem; overflow: hidden; border-radius: 0.12rem; position: relative;  }
.case li em b{font-weight:normal; position:  absolute; left:0.1rem; top:0.1rem; color: #ffa302; font-size: 0.3rem;}
.case li em b:before{content: "\e602";}
.case li em img{display: block; width: 100%; height: 100%;}
.case li i{ display: block; text-align: justify; margin-top: 0.1rem; height: 0.66rem;}

.casefull{ width:100%; position: fixed; z-index: 9999; top:0;  left: -100%; top:50%; transform: translateY(-50%); }
.casefull.active{ left: 0;}
.casefull .swiper-container {
  width: 80%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}
.casefull .swiper-slide {
	width: 100%;
  text-align: left;
  overflow: hidden;


  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.casefull .swiper-button-prev {
	width: 0.4rem;
	height: 0.6rem;
	text-align: center;
	line-height: 0.6rem;
  background: none;
  color: #fff;
  left: 0rem;
  top:50%;
}
.casefull .swiper-button-prev:before{ content: "\e609"; }


.casefull .swiper-button-next {
	width: 0.4rem;
	height: 0.6rem;
	text-align: center;
	line-height: 0.6rem;
   background: none;
   color: #fff;
   right: 0rem;
   top:50%;
}
.casefull .swiper-button-next:before{ content: "\e609"; transform:rotate(180deg); display: block;}

.casefull .swiper-slide span{ display: block; width: 100%; position: relative; }
.casefull .swiper-slide span img{ display: block; width: 100%; }
.casefull .swiper-slide span em{ display: block; width: 100%; background: #fff;box-sizing: border-box; overflow: hidden;padding: 0.2rem; font-size: 0.28rem;line-height: 1.6;}
.casefull .swiper-slide span  i{ display: block; width: 0.5rem; height: 0.5rem; float: right; text-align: center; border-radius:50%; line-height: 0.5rem; color: #000; background:rgba(255,255,255,.6);position:  absolute; right: 0.2rem;  top:0.2rem;}
.casefull .swiper-slide span  i:before{ content: "\e603"; }

.blackbg1{ width: 100%; height: 100%; position:  fixed;z-index: 999; left: 0; top:0; background: rgba(0,0,0,.7); display: none; }

.leibie{ overflow: hidden; padding-bottom: 0.3rem; }
.leibie ul li{ width: 100%; float: left; overflow: hidden; margin-top: 0.24rem; }
.leibie ul li span{ width: 100%; display: block; height: 1rem; line-height: 0.96rem; border:1px #ddd solid;box-sizing: border-box; border-radius: 0.12rem;padding-left: 0.2rem; font-size: 0.36rem; font-weight: bold;background: #f5f5f5;  }
.leibie ul li.show span{ background: #2377e8; color: #fff; border:1px #2377e8 solid;}
.leibie ul li span:after{content: "\e774"; display: block; float: right; margin-right: 0.2rem; font-size: 0.28rem; font-weight: normal;}
.leibie ul li.show span:after{content: "\e605";}
.leibie ul li ol{ width: 100%; overflow: hidden; padding-bottom: 0.2rem;display: none; }
.leibie ul li ol li{width: 2.14rem;  float: left; margin-right: 0.3rem; margin-top: 0.3rem;}
.leibie ul li ol li:nth-child(3n){margin-right: 0;}
.leibie ul li ol li em{ display: block; width: 100%; height: 2.14rem; border-radius: 0.2rem; overflow:hidden; }
.leibie ul li ol li em img{display: block; width: 100%; height: 100%;}
.leibie ul li ol li i{display: block; text-align: justify; margin-top: 0.1rem; height: 0.66rem;}

.biaotibox2{ margin-top: 0.24rem;font-size: 0.32rem; font-weight: bold;text-align: justify; border-bottom: 1px #eee solid; padding-bottom: 0.2rem; }
.xiangguan{ overflow: hidden; margin-top: 0.3rem; margin-bottom: 0.3rem; }
.xiangguan p{ font-size: 0.28rem; font-weight: bold; }
.xiangguan ul{  width: 100%; overflow: hidden; }
.xiangguan li{ width:2.14rem; float: left; margin-right: 0.3rem; margin-top: 0.3rem; }
.xiangguan li:nth-child(3n){ margin-right: 0px; }
.xiangguan li em{ display: block; width: 100%; height: 2.14rem; overflow: hidden; border-radius: 0.12rem; position: relative;  }
.xiangguan li em img{display: block; width: 100%; height: 100%;}
.xiangguan li i{ display: block; text-align: justify; margin-top: 0.1rem; height: 0.66rem;}

.chaxunbiaoti{ font-size: 0.52rem; margin-top: 0.24rem;}
.zhibaotx{ overflow: hidden; margin-top: 0.3rem; padding-left: 0.6rem; box-sizing: border-box; }
.zhibao-title{ width: 100%; overflow: hidden; color: #c90916; font-size: 0.32rem; }
.zhibao-neirong{ width: 100%; overflow: hidden; color: #888; line-height: 1.6; text-align: justify; margin-top: 0.1rem; }
.bao{ background: url(../images/bao.png) no-repeat left top; background-size: 0.4rem;}
.mian{ background: url(../images/mian.png) no-repeat left top; background-size: 0.4rem;}
.zhibaoinput{ margin-top: 0.4rem; margin-bottom: 0.3rem; }
.zhibaoinput input{display: block; background: none; padding:0px; border:none; background: #eee; width: 100%; height: 1rem;box-sizing: border-box;padding: 0 0.2rem 0 0.2rem; border-radius: 1rem;}
.zhibaoinput button{display: block; background: none; padding:0px; border:none; width: 2.6rem; height: 1rem; margin: 0 auto; background: #c90916; color: #fff;border-radius: 1rem; margin-top: 0.3rem; font-size: 0.32rem;}

.mynav{ overflow: hidden; }
.mynav li{ width: 100%; float:left; margin-top: 0.3rem; }
.mynav li a{ display: block; width: 100%; height: 1rem; background: #eee; border-radius: 0.2rem; line-height: 1rem; font-size: 0.32rem; }
.mynav li a:before{ display: block; float: left;  margin-right: 0.2rem; margin-left: 0.2rem; }
.mynav li a.icon-luru:before{content: "\e6ad";}
.mynav li a.icon-wei:before{content: "\e858";}
.mynav li a.icon-xiugai:before{content: "\e651";}
.mynav li a.icon-xx:before{content: "\e625";}

.loginbox{ overflow: hidden; margin-top: 0.24rem; }
.loginbox em{ display: block; text-align: center; font-size: 0.32rem; font-weight: bold; }
.loginbox input{display: block; background: none; padding:0px; border:none; background: #eee; width: 100%; height: 1rem;box-sizing: border-box;padding: 0 0.2rem 0 0.2rem; border-radius: 0.12rem; margin-top: 0.2rem;}
.loginbox button{display: block; background: none; padding:0px; border:none; background: #c90916; color: #fff;border-radius: 0.12rem; width: 100%; height: 1rem;margin-top: 0.3rem; font-size: 0.32rem;}

.mytitle{ overflow: hidden; font-size: 0.36rem; margin-top: 0.24rem; font-weight: bold; }
.weiluru{ overflow: hidden; margin-bottom: 0.3rem; margin-top: 0.1rem; }
.weiluru li{ width: 100%; float: left; box-sizing: border-box; background: #eee; margin-top: 0.2rem; height: 0.8rem;line-height: 0.8rem; color: #666; font-size: 0.28rem; border-radius: 0.1rem;padding: 0 0.2rem 0 0.2rem; }

.lurubox{ overflow: hidden; margin-bottom: 1.5rem; }
.lurutitle{ margin-top: 0.2rem; font-size: 0.28rem; color: #000; }

.luruneirong{ width: 100%; overflow: hidden; margin-top: 0.2rem; position: relative; }
.luruneirong input[type="text"]{ display: block;  padding:0px; border:none;background: #f5f5f5; border:1px #ddd solid;box-sizing: border-box; width: 100%; height: 0.72rem; border-radius: 0.12rem;padding: 0 0.2rem 0 0.2rem; }
.xuanze:after{content: ""; width: 0.3rem; height: 0.3rem; background: url(../images/icon-select.png) no-repeat;  display: block; background-size: 100%; position:  absolute; right:0.16rem; top:50%; transform: translateY(-50%);  }






/*选择地区弹层*/

.express-area-box {
	bottom: -100%;
	z-index: 15;
	background-color: #fff;
	position: fixed;
    left: 0px;
    width: 100%;
}

.express-area-box header {
	position: relative;
    border-bottom: 1px solid #e2e2e2;
}

.express-area-box header h3 {
	text-align: center;
	height: 1rem;
	line-height: 1rem;
	font-size: 0.28rem;
}

.express-area-box header .back,
.express-area-box header .close {
	position: absolute;
	top: 0;
	height: 1rem;
	line-height: 1rem;
	color: #1267b7;
	font-size: 0.28rem;
}

.express-area-box header .back {
	display: none;
	left: 0.24rem;
}

.express-area-box header .close {
	right: 0.24rem;
}

.express-area-box article {
	height:5rem;
	overflow-y: scroll;
}

.area-list li {
	text-align: justify;
    padding: 0 0.24rem;
    line-height: 2.6;
    font-size: 0.28rem;
}



/*遮罩层*/

.mask {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 12;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .5);
}






/* 下拉选择 */
.display-none {
	display: none;
}

.select-moob {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
}

.select-moob-cover {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1;
}

.select-moob-container {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height:4rem;
	background-color: #FFFFFF;
	z-index: 2;
	animation: aclstop .3s 1 forwards;
	-webkit-animation: aclstop .3s 1 forwards;
	-webkit-overflow-scrolling: touch
}

@-webkit-keyframes aclstop {
	from {
		opacity: 0;
		transform: translateY(100px);
		-moz-transform: translateY(100px);
		-ms-transform: translateY(100px);
		-webkit-transform: translateY(100px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-webkit-transform: translateY(0);
	}
}

@keyframes aclstop {
	from {
		opacity: 0;
		transform: translateY(100px);
		-moz-transform: translateY(100px);
		-ms-transform: translateY(100px);
		-webkit-transform: translateY(100px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-webkit-transform: translateY(0);
	}
}

.select-moob-title {
	height: 1rem;
	background-color: #f5f5f5;
	padding: 0 0.24rem;
}

.select-moob-title>div {
	font-size: 0.24rem;
	color: #212121;
	line-height:1rem;
	cursor: pointer;
}

.select-moob-title .cancel {
	float: left;
}

.select-moob-title .determine {
	float: right;
}

.select-moob-content {

	overflow: auto;
}

.select-moob-content .sw-select {
	height:2.4rem;
	position: relative;
}

.select-moob-content .sw-select:before {
	content: '';
	position: absolute;
	top: 33%;
	left: 0;
	right: 0;
	height: 0.8rem;
	box-sizing: border-box;
	border-top: 1px solid #F1F1F1;
	border-bottom: 1px solid #F1F1F1;
}

.select-moob-content .swiper-slide {
	text-align: center;
	line-height: 0.8rem;
	opacity: .5;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.select-moob-content .swiper-slide-active {
	opacity: 1;
	font-size: 0.28rem;
}


.luruneirong em{ display: block; width: 33.33333%; float: left; line-height:0.32rem; overflow: hidden; margin-bottom: 0.2rem; }
.luruneirong em input[type="checkbox"] + label::before {
    content: "";
    display: block;
    width: 0.32rem;
    height: 0.32rem;
    border: 1px solid #ff590e;
    box-sizing: border-box;
    border-radius: 0.06rem;
    float: left;
    margin-right:0.1rem;

}
.luruneirong em input[type="checkbox"]:checked + label::before {
    background-color: #ff590e;
    background-clip: content-box;
    border: 1px solid #ff590e;
    color: #fff;
}

.luruneirong em input[type="checkbox"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
}
.luruneirong em label{ position: relative;  display: block; float: left; }



.lurutitle b{font-weight: normal; font-size: 0.24rem; color: #999;}



.lurutijiao{display: block; background: none; padding:0px; border:none; background: #c90916; width: 100%; height: 1rem;  color: #fff; margin-top: 0.4rem; font-size: 0.36rem; border-radius: 0.1rem;}

.luruneirong h1{ color: #999; }
.luruneirong i{ display: block; width: 33.333333%; float: left; color: #999; line-height: 2; }
.luruneirong h2{ width: 100%; }
.luruneirong h2 img{ display: block; width: 100%; }


section {width: 100%; margin-top: 0.2rem;}
section p{ text-align: center; margin-top: 0.1rem; }
.icon {
  width: 0.6rem;
  height: 0.6rem;
  background: #fff;
  fill: currentColor;
  overflow: hidden;
  border-radius: 50%;
}
.item {
  float: left;
  position: relative;

}
.addImg {
  width:2.34rem;
  height:2.34rem;
  border-radius: 0;
}
.upload_input {
  display: none;
}
.preview {
  position: absolute;
  width:2.34rem;
  height:2.34rem;
  left: 0;
  top: 0;
}
.click {
  position: absolute;
  width:2.34rem;
  height:2.34rem;
  left: 0;
  top: 0;
  z-index: 1;
  cursor: pointer;
}
.delete {
  position: absolute;
  right: 0.1rem;
  top: 0.1rem;
  cursor: pointer;
  display: none;
  z-index: 9;
}
.preview img {
  width: 100%;
  height: 100%;
}