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

/* Icons */
@font-face {
	font-family : "slick";
	src         : url('/fonts/slick.eot?1505156894');
	src         : url('/fonts/slick.eot?&1505156894#iefix') format("embedded-opentype"), url('/fonts/slick.woff?1505156894') format("woff"), url('/fonts/slick.ttf?1505156894') format("truetype"), url('/fonts/slick.svg?1505156894#slick') format("svg");
	font-weight : normal;
	font-style  : normal;
}

/* Arrows */
.slick-prev,
.slick-next {
	position          : absolute;
	display           : block;
	height            : 20px;
	width             : 20px;
	line-height       : 0px;
	font-size         : 0px;
	cursor            : pointer;
	background        : transparent;
	color             : transparent;
	top               : 47%;
	-webkit-transform : translate(0, -50%);
	-ms-transform     : translate(0, -50%);
	transform         : translate(0, -50%);
	padding           : 0;
	border            : none;
	outline           : none;
}

@media screen and (max-width : 767px) {
	.slick-prev,
	.slick-next {
		top : 37%;

	}
}

.slick-prev:hover, .slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
	outline : none;
	color   : transparent;
}

.slick-prev:hover:before, .slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
	opacity : 1;
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
	opacity : 0.25;
}

.slick-prev:before,
.slick-next:before {
	font-family             : "slick";
	font-size               : 20px;
	line-height             : 1;
	color                   : white;
	opacity                 : 0.75;
	-webkit-font-smoothing  : antialiased;
	-moz-osx-font-smoothing : grayscale;
}

.slick-prev, .slick-next {
	width   : 30px;
	height  : 45px;
	z-index : 1;
}

@media screen and (max-width : 767px) {
	.slick-prev, .slick-next {
		display : none !important;
	}
}

.slick-prev {
	left       : 20px;
	background : url("../img/pc/common/arrow_pre.png") no-repeat;
}

@media screen and (max-width : 767px) {
	.slick-prev {
		left    : 10px;
		z-index : 100;
	}
}

[dir="rtl"] .slick-prev {
	left  : auto;
	right : -25px;
}

.slick-prev:before {
	content : "";
}

[dir="rtl"] .slick-prev:before {
	content : "→";
}

.slick-next {
	right      : 20px;
	background : url("../img/pc/common/arrow_next.png") no-repeat;
}

@media screen and (max-width : 767px) {
	.slick-next {
		right   : 10px;
		z-index : 100;
	}
}

[dir="rtl"] .slick-next {
	left  : -25px;
	right : auto;
}

.slick-next:before {
	content : "";
}

[dir="rtl"] .slick-next:before {
	content : "←";
}

/* Dots */
.slick-dotted.slick-slider {
	margin-bottom : 0;
}

.slick-dots {
    position: absolute;
    list-style: none;
    display: inline-block !important; /*中身の要素に応じた横幅にする*/
    top: -15px;
    left: 50%;/*左から50%ずらす*/
    transform: translateX(-50%);/*要素の50%分戻す（これで中央配置）*/
	white-space: nowrap;
}

@media screen and (max-width : 767px) {
	.slick-dots {
		display    : block;
		padding    : 0;
		text-align : center;
		top        : -20px;
		
	}
}

.slick-dots li {
	position      : relative;
	display       : inline-block;
	height        : 5px;
	width         : 87px;
	margin        : 0 5px 0 5px;
	padding       : 0;
	cursor        : pointer;
	background    : #b5b5b6;
	opacity: 0.5;
	
}

@media screen and (max-width : 767px) {
	.slick-dots li {
		margin     : 0 5px 0 5px;
		background : #eee;
		height        : 10px;
		width         : 10px;
	}
}

.slick-dots li button {
	border      : 0;
	background  : transparent;
	display     : block;
	height      : 20px;
	width       : 20px;
	outline     : none;
	line-height : 0px;
	font-size   : 0px;
	color       : transparent;
	padding     : 5px;
	cursor      : pointer;
	
}

.slick-dots li button:hover, .slick-dots li button:focus {
	outline : none;
}

.slick-dots li button:hover:before, .slick-dots li button:focus:before {
	opacity : 1;
}

.slick-dots li button:before {
	position                : absolute;
	top                     : 0;
	left                    : 0;
	width                   : 20px;
	height                  : 20px;
	font-family             : "slick";
	font-size               : 6px;
	line-height             : 20px;
	text-align              : center;
	color                   : black;
	opacity                 : 0.25;
	-webkit-font-smoothing  : antialiased;
	-moz-osx-font-smoothing : grayscale;
}

.slick-dots li.slick-active {
	background : #1AB7CD;
	opacity    : 1;
}

@media screen and (max-width : 767px) {
	.slick-dots li.slick-active {
		background : #1bb8ce;
	}

}
