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

/*slickスライダー*/

.full-width-box {
    width: 100vw;
    height: 80vh;  /* 画面いっぱいの高さ */
    background: #FFF; /* 背景色（自由に変更） */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  position:  relative;
}

.slick-slider div{
   
  top: 0;
  width: 100%;
   

  }

.slick-slider{
    position: relative;
  height: 80vh;
  width: 100vw;
}

.slick-slider img {
      position: relative;
  width: 100%;
  height:80vh;
  object-fit: cover; /* 画像を画面いっぱいにフィット */

}


/*スライダーテキストエリア*/
.top-box{
  position: absolute;
  width: 100vw;
  height: 80vh;
  text-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
  top: 0;
}
  
.top-box div{


}

.left-text-box{

  
width: 50vw;
  background-color: hsla(0,1%,23%,0.29);
height: 80vh;
}

.left-text-box .set{
  color: #FFFFFF!important;
  padding-left: 5%;
  padding-right: 5%;
  text-align: left;
  max-width: 600px;
  padding-top: 158px;
}

.left-text-box h1{
color: #FFFFFF!important;

        font-size: clamp(22px, 7vw, 50px);
  }
.left-text-box h2{
color: #FFFFFF!important;
  font-size: clamp(18px, 4vw,25px);
  font-weight: 400  }

.left-text-box p{
color: #FFFFFF!important;
  font-size: 22px;
    font-size: clamp(16px, 3vw,22px);
  }

.left-text-box p a{
color: #FFFFFF!important;
  text-decoration: none;
  
  }
.left-text-box p a:hover{
color: #FFFFFF!important;
  text-decoration:underline;
  
  }



.left-text-box{

  
width: 50vw;
  background-color: hsla(0,1%,23%,0.29);
height: 80vh;
}