ul.baraja-container {
	width: 3rem;
	height: 4.26rem; margin: 0 auto;
	position: relative; z-index: 1;
	padding: 0;
	list-style-type: none;
}

ul.baraja-container li {
	width: 100%;
	height: 100%;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	cursor: pointer;
	pointer-events: auto;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
}

.no-js ul.baraja-container {
	width: auto;
	height: auto;
	text-align: center;
}

.no-js ul.baraja-container li {
	position: relative;
	display: block;
	width: 3rem;
	height: 4.26rem
}

ul.baraja-container li .img{position: relative;
	box-shadow: 0 .08rem .32rem rgba(0, 0, 0, .1);
	-webkit-box-shadow: 0 .08rem .32rem rgba(0, 0, 0, .1);
	-moz-box-shadow: 0 .08rem .32rem rgba(0, 0, 0, .1);
}
ul.baraja-container li .img a{display: block; width: 1.62rem; height: .43rem; line-height: .43rem; text-align: center; font-size: .14rem; position: absolute; left: 50%; margin-left: -.81rem; text-transform: uppercase; color: #ffcf98; letter-spacing: .04rem; bottom: .6rem; background: rgba(30, 30, 30, .5);
	border-radius: .5rem;
	-webkit-border-radius: .5rem;
	-moz-border-radius: .5rem;
}
ul.baraja-container li .img:before{content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; background: url("../../image/img300.png") center no-repeat; background-size: 100% 100%}
ul.baraja-container li:hover .img:before{opacity: 1}

@media screen and ( max-width:800px ){
	ul.baraja-container {
		width: 1.8rem;
		height: 2.8rem;
	}
	.no-js ul.baraja-container li {
		width: 1.8rem;
		height: 2.8rem;
	}
}