@charset "UTF-8";

.slider{
	/* スライドショーの位置の起点 */
	position: relative;
	z-index: 1;
	height: 70vh;
}

/* スライダーアイテムの背景画像設定 */
.slider-item01{
	background: url(../images/main_img_bg05.jpg);
}
.slider-item02{
	background: url(../images/main_img_bg09.jpg);
}
.slider-item03{
	background: url(../images/main_img_bg08.jpg);
}

.slider-item{
	width: 100%;
	height: calc(100vh - 10rem);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

@media (max-width: 992px){
	.slider-item{
		width: 100%;
		height: calc(100vh - 15rem);
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}
}
@media (max-width: 576px){
	.slider-item{
		width: 100%;
		height: calc(100vh - 23rem);
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}
}

/* 矢印の設定 */
.slick-prev, .slick-next{
	position: absolute;
	z-index: 3;
	top: 50%;
	cursor: pointer;
	outline: none;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	height: 25px;
	width: 25px;
}
.slick-prev{
	left: 2.5%;
	transform: rotate(-135deg);
}
.slick-next{
	right: 2.5%;
	transform: rotate(45deg);
}

/* ドットナビゲーションの設定 */
.slick-dots{
	position: relative;
	z-index: 3;
	text-align: center;
	margin: -50px 0 0 0;
}
.slick-dots li{
	display: inline-block;
	margin: 0 5px;
}
.slick-dots button{
	padding: 6px;
	color: transparent;
	outline: none;
	width: 8px;
	height: 8px;
	display: block;
	border: 2px solid #fff;
	border-radius: 50%;
	background: #fff;
}
.slick-dots .slick-active button{
	background: #586DB2;
}

/*==================================================
特集エリアスライダーのためのcss
===================================*/
.special_slider {/*横幅94%で左右に余白を持たせて中央寄せ*/
	width:94%;
	margin:0 auto;
}
 
.special_slider img {
	width:100%;/*スライダー内の画像を横幅100%に*/
	height:auto;
	border: solid 1px #e5e5e5;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.special_slider .slick-slide {
	margin:0 10px;
}
 
 /*矢印の設定*/
 
/*戻る、次へ矢印の位置*/
.special_slick-prev, 
.special_slick-next {
	position: absolute;/*絶対配置にする*/
	top: 42%;
	cursor: pointer;/*マウスカーソルを指マークに*/
	outline: none;/*クリックをしたら出てくる枠線を消す*/
	border-top: 2px solid #fff;/*矢印の色*/
	border-right: 2px solid #fff;/*矢印の色*/
	height: 15px;
	width: 15px;
}
 
.special_slick-prev {/*戻る矢印の位置と形状*/
	left: -1.5%;
	transform: rotate(-135deg);
}
 
.special_slick-next {/*次へ矢印の位置と形状*/
	right: -1.5%;
	transform: rotate(45deg);
}
 
 /*ドットナビゲーションの設定*/
 
.special_slider .slick-dots {
	position: relative;
	z-index: 3;
	text-align: center;
	margin-top: 20px;
 }
 
.special_slider .slick-dots li {
	 display:inline-block;
	 margin:0 5px;
 }
 
.special_slider .slick-dots button {
	 color: transparent;
	 outline: none;
	 width:8px;/*ドットボタンのサイズ*/
	 height:8px;/*ドットボタンのサイズ*/
	 display:block;
	 border-radius:50%;
	 background:#ccc;/*ドットボタンの色*/
 }
 
.special_slider .slick-dots .slick-active button{
	 background:#333;/*ドットボタンの現在地表示の色*/
 }
 

/*==================================================
空席照会プランテーブルスライダーのためのcss
===================================*/
.going_date {/*横幅94%で左右に余白を持たせて中央寄せ*/
	/* width:94%;
	margin:0 auto; */
}

/* スライド部分の横幅調整 */
.going_date .slick-list .slick-track{
	width: 1932px !important;
}


/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

/* .going_date .slick-slide {
	margin:0 10px;
} */
 
 /*矢印の設定*/
 
/*戻る、次へ矢印の位置*/
.going_date-prev, 
.going_date-next {
	position: absolute;/*絶対配置にする*/
	top: 42%;
	cursor: pointer;/*マウスカーソルを指マークに*/
	outline: none;/*クリックをしたら出てくる枠線を消す*/
	border-top: 2px solid #666;/*矢印の色*/
	border-right: 2px solid #666;/*矢印の色*/
	height: 15px;
	width: 15px;
}
 
.going_date-prev {/*戻る矢印の位置と形状*/
	left: -1.5%;
	transform: rotate(-135deg);
}
 
.going_date-next {/*次へ矢印の位置と形状*/
	right: -1.5%;
	transform: rotate(45deg);
}