@charset 'UTF-8';
/* Slider */
.slick-loading .slick-list
{
	background: #fff url('../images/sec/products/ajax-loader.gif') center center no-repeat;
}

/* Icons */
@font-face
{
	font-family: 'slick';
	font-weight: normal;
	font-style: normal;

	src: url('./fonts/slick.eot');
	src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg');
}

/*******************************************************************/
/* PC */
/*******************************************************************/
@media screen and (min-width: 769px) {
/*<start>==========================================================*/

/* Arrows */
.slick-prev, .slick-next {
	display: block;
	border: solid 1px #333;
	box-sizing: border-box;
	text-indent: -9999px;
	width: 60px;
	height: 60px;
	outline: none;
	position: absolute;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all 0.3s ease;
	top: 88px;
}
.slick-prev:hover, .slick-next:hover {
	cursor: pointer;
}

.slick-prev {
	background: #FFF url(../images/sec/products/slide_arrow_left.png) no-repeat center center;
	background-size: 36% auto;
	right: 132px;
}
.slick-prev:hover {
	background: #333 url(../images/sec/products/slide_arrow_left_hover.png) no-repeat center center;
}


.slick-next {
	background: #FFF url(../images/sec/products/slide_arrow_right.png) no-repeat center center;
	background-size: 36% auto;
	right: 60px;
}
.slick-next:hover {
	background: #333 url(../images/sec/products/slide_arrow_right_hover.png) no-repeat center center;
}


/*<end>============================================================*/
}

/*******************************************************************/
/* SP */
/*******************************************************************/
@media screen and (max-width: 768px) {
/*<start>==========================================================*/

/* Arrows */
.slick-prev, .slick-next {
	display: block;
	border: solid 1px #333;
	box-sizing: border-box;
	text-indent: -9999px;
	width: 40px;
	height: 40px;
	outline: none;
	position: absolute;
	top: 50px;
}
.slick-prev:hover, .slick-next:hover {
	cursor: pointer;
}

.slick-prev {
	background: #FFF url(../images/sec/products/slide_arrow_left.png) no-repeat center center;
	background-size: 36% auto;
	right: 67px;
}

.slick-next {
	background: #FFF url(../images/sec/products/slide_arrow_right.png) no-repeat center center;
	background-size: 36% auto;
	right: 15px;
}


/*<end>============================================================*/
}