/* ========== css/slick.css ========== */
/*==================================
		スライダーのためのcss
	===================================*/
	.slider {		/* 横幅94%で左右に余白を持たせて中央寄せ */
		width:94%;
		margin:0 auto;
		z-index:6;
	}

	.slider img {
		width:60vw;
		width:20vw;	/*● スライダー内の画像を20vw レスポンシブ化 */
		width:12vw;	/*● スライダー内の画像を20vw レスポンシブ化 */
		height:auto;
			box-shadow: 0px 1px 2px 1px #bbb;
			-webkit-box-shadow: 0px 1px 2px 1px #bbb;
			-moz-box-shadow: 0px 1px 2px 1px #bbb;
	}
	.slider .slick-slide {
		transform: scale(0.7);	/* 左右の画像のサイズを80%に*/
		transition: all .5s;		/* 拡大や透過のアニメーションを0.5秒で行う*/
		opacity: 1.0;				/* ●透過100%*/
	}

	.slider .slick-slide.slick-center{
		transform: scale(0.9);		/* ●中央の画像のサイズだけ等倍に*/
		opacity: 1;/*透過なし*/
	}

	@media only screen and (max-width: 992px) {

		.slider {		/* 横幅94%で左右に余白を持たせて中央寄せ */
			width:94%;
			width:100%;
			margin:0 auto;
			z-index:6;
		}
		.slider img {
			width:60vw;	/*● スライダー内の画像を60vw レスポンシブ化 */
			width:30vw;	/*● スライダー内の画像を60vw レスポンシブ化 */
			height:auto;
		}
	}

	@media only screen and (min-width: 768px) and (max-width: 992px) {

		.slider img {
			width:25vw;	/*● スライダー内の画像を25vw レスポンシブ化 */
			height:auto;
		}

	}



	/*矢印の設定*/
	/*戻る、次へ矢印の位置*/
	.slick-prev, 
	.slick-next {
		position: absolute;/*絶対配置にする*/
		top: 43%;
		cursor: pointer;/*マウスカーソルを指マークに*/
		outline: none;/*クリックをしたら出てくる枠線を消す*/
		border-top: 2px solid #666;/*矢印の色*/
		border-right: 2px solid #666;/*矢印の色*/
		border-top: 2px solid #AAA;/*★矢印の色*/
		border-right: 2px solid #AAA;/*★矢印の色*/
		height: 15px;
		width: 15px;
		height: 12px;		/* ★ */
		width: 12px;		/* ★ */
		z-index:6;
	}

	.slick-prev {/*戻る矢印の位置と形状*/
		left: -1.5%;
		left: -2%;	/* ★ */
		transform: rotate(-135deg);
	}

	.slick-next {/*次へ矢印の位置と形状*/
		right: -1.5%;
		right: -2%;	/* ★ */
		transform: rotate(45deg);
	}

	/*ドットナビゲーションの設定*/

	.slick-dots {
		text-align:center;
		margin:20px 0 0 0;
		margin:0 0 0 0;
	}
	.slick-dots li {
		display:none;	/* ★DOT marker erase */
		display:inline-block;
		margin:0 5px;
		margin-top:10px;
	}

	.slick-dots button {
		color: transparent;
		outline: none;
		width:8px;/*ドットボタンのサイズ*/
		height:8px;/*ドットボタンのサイズ*/
		display:block;
		border-radius:30%;
		border-color:none;
		border: 1px solid #BDC3C7;		/* Siver */ 
		background:#F5F5F5;/*ドットボタンの色*/
	}

	.slick-dots .slick-active button{
		background:#777;/*ドットボタンの現在地表示の色*/
	}

	@media only screen and (max-width: 992px) {

		.slick-prev {/*戻る矢印の位置と形状*/
			left: -5%;	/* ★ */
			transform: rotate(-135deg);
		}
		.slick-next {/*次へ矢印の位置と形状*/
			right: -5%;	/* ★ */
			transform: rotate(45deg);
		}

	}


