@charset "UTF-8";
/*-slider--------------------*/
/*コンテナ要素のスタイル*/
* {box-sizing: border-box;appearance: none;}	
.swiper {
  position: relative;	
  display: flex;
  flex-flow: column nowrap;
  gap: 1%;
  height: 70%;
  width: 100%;

  }
  
  .swiper-container {
 
  overflow: hidden;
  height: 70%;
  width: 95%; 
  box-shadow:2px,5px,10px,1px,#000 ;

  }
  
  /*各スライドのスタイル*/
  .swiper-slide {
    flex-flow: column wrap;
    /*テキストの位置調整*/
     /*テキストの色と太さを指定*/
    color: #000;
    font-weight: normal;
    line-height:max(1rem, 1.2rem);
    font-size: max(0.7rem, 1rem); 
  }

  .swiper-slide p{width: 95%; height: 100%;
  overflow-y: auto;font-size: 0.8rem;line-height: 1.1rem;
}

.slider_cover{
 margin:  1vh auto 0 auto; 
position: relative;	
display: flex;
justify-content: center;
width:800px;height: 600px;
/*background-color: aqua;*/}




  
  /*各スライドの背景色の設定*/
  .slide{padding:10px;
    background-color:rgba(255,255,255) }
.white_back{
    background-color:rgba(0,0,0,0.5) }

  
  /* スライダーのスタイル */
  .slider_1,.slider_2,.slider_3,.slider_4,.slider_5,.slider_6
  {
    position: relative;
    width: 100%;
   height: 70%;
    flex-grow: 1;
  }
  /* サムネイルのスタイル */
  .swiper-thumbnail_1,.swiper-thumbnail_2,.swiper-thumbnail_3,.swiper-thumbnail_4,.swiper-thumbnail_5,.swiper-thumbnail_6
  {
  position: absolute;
  top:75%;	
  width: 100%;
  height: 20%;
  text-align: left;margin:5px;
   }
  
  .swiper-thumbnail_1 .swiper-wrapper,.swiper-thumbnail_2 .swiper-wrapper,.swiper-thumbnail_3 .swiper-wrapper,
  .swiper-thumbnail_4 .swiper-wrapper,.swiper-thumbnail_5 .swiper-wrapper,.swiper-thumbnail_6 .swiper-wrapper 
  {
    flex-direction: row;
  }
  
  /*アクティブなときのスタイル*/
  .swiper-thumbnail_1 .swiper-slide ,.swiper-thumbnail_2 .swiper-slide ,.swiper-thumbnail_3 .swiper-slide,
  .swiper-thumbnail_4 .swiper-slide ,.swiper-thumbnail_5 .swiper-slide ,.swiper-thumbnail_6 .swiper-slide
  {
    flex-flow: row nowrap;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.5s;
  }
  .swiper-thumbnail_1 .swiper-slide.swiper-slide-thumb-active ,.swiper-thumbnail_2 .swiper-slide.swiper-slide-thumb-active ,
  .swiper-thumbnail_3 .swiper-slide.swiper-slide-thumb-active ,.swiper-thumbnail_4 .swiper-slide.swiper-slide-thumb-active ,
  .swiper-thumbnail_5 .swiper-slide.swiper-slide-thumb-active ,.swiper-thumbnail_6 .swiper-slide.swiper-slide-thumb-active 
  {
    opacity: 1; 
     background-image:url(../images/common/b_6.png);
     background-color: #f4f3f2;
     background-size: cover;
     color: #000;
   }
  
  /*矢印ボタンの色を変更*/
  .swiper-button-next,
  .swiper-button-prev {
    color: #212121;
  }

@media screen and (max-width: 599px){/*599x以下に適用*/
 .swiper-slide p{width: 98%; height: 100%;font-size: 0.7rem;
line-height: 1rem;
  overflow-y: auto;
}

.slider_cover{
position: relative;	
width:95vw;height: 77.5vw;
/*background-color: rgb(255, 0, 200);*/}







}





