.banners
{
	width: 100%;
	height: 100%;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
	background-color: rgba(200,200,200,0.5);
}

.banners:hover .click_left
{
	display: block;
}

.banners:hover .click_right
{
	display: block;
}

.click_left
{
	width: 3vw;
	position: absolute;
	z-index: 10;
	left: 2vw;
	display: none;
}

.click_right
{
	width: 3vw;
	position: absolute;
	z-index: 10;
	right: 2vw;
	display: none;
}

.click_left img,.click_right img
{
	width: 100%;
	height: 100%;
}

.number
{
	width: 100%;
	height: 1vw;
	line-height: 1vw;
	position: absolute;
	z-index: 10;
	text-align: right;
	bottom: 0.6vw;
}

.numbers
{
	display: inline-block;
}

.numbers span
{
	color: white;
	font-size: 0.7vw;
	display: block;
	float: left;
	width: 1vw;
	height: 1vw;
	line-height: 1vw;
	text-align: center;
	border-radius: 100vw;
	margin: 0 0.2vw;
	/* padding: 0.1vw; */
	border: 0.1vw solid white;
}

.numbers span:hover
{
	cursor: pointer;
}

.banner_img
{
	width: 228px;
    height: 205px;
}

.banner_img img
{
	width: 100%;
	height: 100%;
	position: absolute;
	break-inside: 1;
}

.dtlbox .bimg {

  width: 100%;
  
  height: 235px !important;

  border: solid 1px #f5f5f5;

  box-sizing: border-box;

  background: url(../images/loadings.gif) no-repeat center;
  
  margin:0 auto;

}



.dtlbox .bimg img {

  width: 100%;

  height: auto;

}



.dtlbox .simg {



  width: 25%;

  position: relative;

  padding: 0 1px 0;

}



.dtlbox .simg .simgmove {

  overflow: hidden;

}



.dtlbox .simg ul {

  display: block;

}



.dtlbox .simg ul li {
display:none;

  width: 100%;

  cursor: pointer;

  border-bottom: 10px solid #fff;

  position: relative;

  box-sizing: border-box;

}

.dtlbox .simg ul li p {

  position: absolute;

  width: 100%;

  bottom: 4%;

  color: #100000;

  font-size: 16px;

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

  width: 100%;

  text-align: center;

  z-index: 3;

}

.dtlbox .simg ul li .mask {

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 4;

  background: url(../images/mask.png) repeat;

}

.dtlbox .simg ul li b {

  display: block;

  position: absolute;

  top: 50%;

  left: 50%;

  margin-top: -30px;

  margin-left: -30px;

  width: 60px;

  height: 60px;

  background: url(../images/syvi.png) no-repeat center;

  background-size: cover;

  z-index: 5;

}



.dtlbox .simg ul .cur .mask {

  background: none;

}



.dtlbox .simg ul li img {

  display: block;

  width: 100%;

  height: auto;

}



.dtlbox .upBtn {

  display: block;

  width: 30px;

  height: 17px;

  background: url(../images/prevarr.png) no-repeat top center;

  position: absolute;

  top: 10px;

  margin-left: -15px;

  left: 50%;

  z-index: 6;

}

.dtlbox .upBtn:hover {

  background: url(../images/prevarrcur.png) no-repeat bottom center;

}



.dtlbox .downBtn {

  display: block;

  width: 30px;

  height: 17px;

  background: url(../images/nextarr.png) no-repeat bottom center;

  position: absolute;

  bottom: 10px;

  margin-left: -15px;

  left: 50%;

  z-index: 6;

}

.dtlbox .downBtn:hover {

  background: url(../images/nextarrcur.png) no-repeat bottom center;

}
.dtltx {

  padding: 50px 0 0;

}



.dtltx h2 {

  font-size: 24px;

  color: #333;

  padding-bottom: 14px;

  border-bottom: solid 1px #e9e9e9;

  margin-bottom: 16px;

}



.dtltx p {

  line-height: 30px;

  color: #999;

}



.dtltx p strong {

  color: #333;

}



.vclist {

  padding-top:3.5%;

  padding-bottom: 5%;

  padding-right: 5%;

}

.vclist .tit h2 {

  font-size: 36px;

  line-height: 1;

}

.vclist .years .slides {

  /*padding-bottom: 3%;*/

}

.vclist .years .slides li {

  /*width: 33.333%;*/

  /*padding-right: 5%;*/

}

.vclist .years .slides li .storetx h2 {

  font-size: 18px;

  color: #333;

  margin-bottom: 0;

}

.vclist .years .slides li .storetx .tx {

  font-size: 12px;

  color: #999;

}

.vclist .years .slides li a {

  display: block;

  position: relative;

}

.vclist .years .slides li a .mask {

  display: block;

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 4;

  background: url(../images/mask.png) repeat;

}

.vclist .years .slides li a b {

  display: block;

  position: absolute;

  top: 50%;

  left: 50%;

  margin-top: -30px;

  margin-left: -30px;

  width: 60px;

  height: 60px;

  background: url(../images/syvi.png) no-repeat center;

  background-size: cover;

  z-index: 5;

}



.yvli .slides .yv:hover .mask {

  opacity: 0.5;

  transition: all 0.5s ease 0s;

}

.yvli .slides .yv video{

  width: 100%;

}

.myvli{

	display: none;

}

.mvideo{

  display: none;

}

.mvideo ul li{

  width: 100%;

}

.mvideo ul li .mvimg{

  display: block;

  width: 100%;

  position: relative;

}

.mvideo ul li video{

  width: 100%;

}

.mvideo ul li .mvimg img{

  width: 100%;

  height:100%;

}

.mvideo ul li .mvimg .mvmask{

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 4;

  background: url(../images/mask.png) repeat;

}

.mvideo ul li .mvimg b{

  display: block;

  position: absolute;

  top: 50%;

  left: 50%;

  margin-top: -30px;

  margin-left: -30px;

  width: 60px;

  height: 60px;

  background: url(../images/syvi.png) no-repeat center;

  background-size: cover;

  z-index: 5;

}

.mvideo ul li .mvtx{

  padding-top:5%;

}

.mvideo ul li .mvtx h2{

  font-size: 18px;

  color: #333;

  line-height: 28px;

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

  width: 100%;

}

.mvideo ul li .mvtx .tx{

  font-size: 12px;

  line-height: 24px;

  color: #666;

  margin-bottom: 5%;

}

video {

  background-color: #000;

  display: block;

}



.sybg {

  background-color: #f5f5f5;

}



.pgbtn {

  display: inline-block;

  *zoom: 1;

  width: 23px;

  height: 23px;

}

.pgbtn.pgprev {

  background: url(../images/flex-prev.png) no-repeat center;

  background-size: 10px 23px;

}

.pgbtn.pgnext {

  background: url(../images/flex-next.png) no-repeat center;

  background-size: 10px 23px;

}



.close:hover {

  transform: rotateZ(90deg);

  transition: transform 0.3s ease 0s;

}



.lastli {

  padding-right: 0;

}



.loadingBg {

  position: fixed;

  width: 100%;

  height: 200%;

  background-color: #fff;

  top: 0;

  left: 0;

  z-index: 0;

}

.loadingBg::after {

  content: "";

  display: block;

  width: 100%;

  height: 50%;

  position: absolute;

  bottom: 0;

  left: 0;

  background-color: #f5f5f5;

}



.loadingBg .loadinglg {

  width: 107px;

  height: 18px;

  background-color: transparent;

  overflow: hidden;

  position: absolute;

  top: 25%;

  left: 50%;

  margin-top: -9px;

  margin-left: -53px;

}



.loadingBg .loadinglg .ldbg {

  width: 107px;

  height: 18px;

  position: relative;

  background: url(../images/lgldgray.png) left no-repeat;

  background-size: 107px 18px;

  z-index: 2;

}



.loadingBg .loadinglg .ldlogo {

  width: 107px;

  height: 18px;

  position: absolute;

  left: 0;

  bottom: 0;

  background: url(../images/lgldred.png) left no-repeat;

  background-size: 107px 18px;

  z-index: 3;

  animation: wave 3s infinite linear;

}



@-webkit-keyframes wave {

  0% {

    width: 0;

  }

  100% {

    width: 107px;

  }

}

.waiter {

  display: none;

  text-align: center;

  width: 100%;

  height: 48px;

  background: url(../images/waiter.gif) center no-repeat;

}