@charset "utf-8";

/*
************************************************************************
* カルーセル基本スタイル
* @copyright Revolme Inc.
************************************************************************
*/

/* ################################################################################################ */
/* ## PC                         ################################################################## */
/* ################################################################################################ */
.carousel
{
	display:none;
}
.carousel .carousel-parent
{
	margin:0;
	padding:0;
	list-style:none;
}
.carousel .carousel-parent .carousel-item
{
	display:block;
	margin:0;
	padding:0;
	
	margin-left:0.5em;
	margin-right:0.5em;
}
.carousel .carousel-parent .carousel-item a
{
	display:block;
}
.carousel .carousel-parent .slick-track
{
	padding-bottom:0.5em;
}
.carousel-item
{
	width:calc(347px - 0.5em);
}
.carousel .slick-prev,
.carousel .slick-next
{
	z-index:100;
	
	overflow:hidden;
	position:absolute;

	top:50%;

	width:2.5em;
	height:2.5em;

	line-height:0;
	color:transparent;
	
	background-color:rgba(0,0,0,0.6);
	border-radius:100%;
	border:0px solid transparent;
	
	transition-duration:0.3s;
	transition-property:all;
	transition-timing-function:ease;
}
/*
.carousel .slick-prev
{
	left:0;
	transform:translate(-50%, -50%);
}
.carousel .slick-next
{
	right:0;
	transform:translate(50%, -50%);
}
*/
.carousel .slick-prev:before,
.carousel .slick-next:before
{
	content:"";
	display:block;
	
	position:absolute;
	top:50%;
	left:50%;
	
	
	width:1em;
	height:1em;
	
	background-colro:transparent;
	border:0px solid transparent;
}
.carousel .slick-prev:before
{
	border-bottom:1px solid #FFFFFF;
	border-left:1px solid #FFFFFF;
	transform:translate(-30%, -50%) rotate(45deg);
}
.carousel .slick-next:before
{
	border-top:1px solid #FFFFFF;
	border-right:1px solid #FFFFFF;
	transform:translate(-70%, -50%) rotate(45deg);
}



/* ################################################################################################ */
/* ## TAB                        ################################################################## */
/* ################################################################################################ */
@media screen and (max-width:1320px) {
	
}

/* ################################################################################################ */
/* ## スマホサイト用スタイル ###################################################################### */
/* ################################################################################################ */
@media screen and (max-width:640px) {
	.carousel-item
	{
		width:calc(50vw - 1em);
	}
	.carousel .slick-prev,
	.carousel .slick-next
	{
		width:2.0em;
		height:2.0em;
	}
	.carousel .slick-prev:before,
	.carousel .slick-next:before
	{
		width:0.8em;
		height:0.8em;
	}
}