@charset "UTF-8";
/* CSS Document */


/* スライダーリセット、slick.jsが読み込まれるで非表示にすることで一瞬縦に崩れるのを防ぐ */
slide{
	opacity: 0;
    transition: opacity .3s linear;}


.sl_box{
    position: relative;
    height: 500px;
    max-width: 800px;
		margin:0 auto 20px;
}
.exe_titlebox {
	position:absolute;
	background-color: #333;
	background-color: rgba(66,191,197,0.8);
	color: #FFF;
    width: 150px;
    height: 150px;
    text-align: center;
	letter-spacing: 0.1em;
	padding: 10px auto;
	right: 1px;
	bottom: 0px;
    z-index: 30;
    display: flex;
  justify-content: center;
  align-items: center;
}    
    .slider-container{
        position: relative;
        width:100%;
	}
    
    
/* imgリセット */
.imgauto{
  width: 100%;
  height: 100%;
  margin: auto;
  max-height: 500px;
  max-width: 100%;
  object-fit:cover;
       }

    
	.slick-slide{
		padding:2px;
	}
    
    #thumbs img{
height:140px;
		max-width: 200px;
          object-fit: cover;

    }

	#thumbs .slick-current img{
		border:3px solid rgba(66,191,197,0.8);
	}

	.slick-prev,.slick-next{z-index:2;}
	.slick-prev{left:20px;}
	.slick-next{right:20px;}


.slick-prev:before, .slick-next:before {
    color: #3FC8CC;
      font-size:30px;

}

@media screen and (max-width:640px){
    .sl_box{
    position: relative;
max-height: 350px;
	margin:0 auto 20px;
}
.exe_titlebox {
	position:absolute;
	color: #FFF;
    font-size: 0.8rem;
    width: 120px;
    height: 120px;
	bottom: 0px;
    display: flex;
}    
	
.imgauto{
  width: 100%;
    height: 100%;
  margin: auto;
  max-height: 350px;
  max-width: 100%;
  object-fit:fill;
       }

}