@charset "UTF-8";


.col-2{width:calc((100% - 20px)/2);}
.col-3{width:calc((100% - 20px)/3);}
.col-4{width:calc((100% - 20px)/4);}
.col-5{width:calc((100% - 20px)/5);}
.col-6{width:calc((100% - 20px)/6);}


/*.row{
  display: flex;
  flex-wrap: wrap;
  box-sizing: border-box;
  margin:1% auto;
}*/


.justify-content-start{justify-content: start;} /* アイテムを先頭に寄せる */
.justify-content-end{justify-content: end; } /* アイテムを末尾に寄せる */
.justify-content-center{justify-content: center; } /* アイテムを中央に寄せる */
.justify-content-between{justify-content: space-between;}/*両端に合せて均等配置*/
.justify-content-around{justify-content: space-around;} /* 各アイテムを均等に配置し各アイテムの両側に半分の大きさの間隔を置く */
.justify-content-evenly{justify-content: space-evenly;} /* 各アイテムを均等に配置し各アイテムの周りに同じ大きさの間隔を置く */
.justify-content-stretch{justify-content: stretch;} /* 各アイテムを均等に配置しサイズが 'auto' であるアイテムは、コンテナーに合わせて引き伸ばす */

.align-self-center{align-self: center;}


/*クロス軸の垂直方向に揃えて配置します。*/
.align-items-start{align-items: flex-start;}
.align-items-end{align-items: flex-end;}	
.align-items-center{align-items: center;}	
.align-items-baseline{align-items:baseline;}		
.align-items-stretch{align-items: stretch;}	



.align-self-end{align-self: flex-end;}
.align-self-auto{align-self:auto;}/*（初期値）: 親要素の align-items の値に従う*/
.align-self-start{align-self:flex-start;}/*親要素の左端に配置*/
.align-self-flex-end{align-self:flex-end;}/*親要素の右端に配置*/
.align-self-center{align-self:center;}/*親要素の中央に配置*/
.align-self-baseline{align-self:baseline;}/* flexアイテムのベースライン（テキストの下端）に配置*/
.align-self-stretch{align-self:stretch;}/*親要素の横幅に合わせてflexアイテムを伸縮*/


.align-content-start{align-content:flex-start;}/*flexアイテムの上揃え*/
.align-content-end{align-content:flex-end;;}/*flexアイテムの下揃え*/
.align-content-center{align-content:center;}/* flexアイテムの上下中央揃え*/
.align-content-start{align-content:space-between;}/* 上下の両端揃え*/
.align-content-around{align-content:space-around;}/* flexアイテムの上下に均等な余白をとる*/
.align-content-evenly{align-content:space-evenly;}/*均等な余白をとる*/

.flex-shrink{flex-shrink:0;}
.flex-shrink1{flex-shrink:1;}
.flex-shrink2{flex-shrink:2;}
.flex-shrink3{flex-shrink:3;}

.flex-grow1{
  flex-grow: 1;
}


.order0 {order: 0;}
.order01 {order: 1;}
.order02 {order: 2;}
.order03 {order: 3;}
.order04 {order: 4;}
.order05 {order: 5;}
.order06 {order: 6;}
.order-1 {order: -1;}


 

.f-direction-column{
  display: flex;
  flex-direction: column;
}

/*
@media (min-width: 576px){
.row{flex-direction: row;/}
}*/



@media screen and (min-width: 768px),print {

  .row{
    display: flex;
    flex-wrap: wrap;/*折り返して複数行にする*/
    box-sizing: border-box;
    margin:1% auto;
  }
  .col-md-2{
    width:calc((100% - 20px)/2);
    box-sizing: border-box;
  }

  .col-md-3{width:calc((100% - 20px)/3);}
  .col-md-4{width:calc((100% - 20px)/4);}
  .col-md-5{width:calc((100% - 20px)/5);}
  .col-md-6{width:calc((100% - 20px)/6);}
  }

  @media screen and (min-width: 992px),print {
.col-lg-2{ width:calc((100% - 20px)/2);}
.col-lg-3{width:calc((100% - 20px)/3);}
.col-lg-4{width:calc((100% - 20px)/4);}
.col-lg-5{width:calc((100% - 20px)/5);}
.col-lg-6{width:calc((100% - 20px)/6);}
 }





/****************************************************
                      カ ー ド
*****************************************************/


.card-list-3,.card-list-4{
display: flex;
flex-direction: column;
list-style: none;
margin: 0;
margin-left: -20px;
padding: 0;
}

.card-item-3,.card-item-4{margin: 2rem 0 0 0;
padding:1rem;
align-items:stretch;
box-sizing: border-box;
}

@media (min-width: 768px){
  .card-list-3,.card-list-4{
    flex-direction: row;
    flex-wrap: wrap;
    }

.card-item-3,.card-item-4{
width:calc((100% - 40px) / 2);
margin-left: 20px;
}



}

@media (min-width: 992px){
.card-item-3{
width:calc((100% - 60px) / 3);
margin-left: 20px;
}




.card-item-4{
  width:calc((100% - 80px) / 4);
  margin-left: 20px;
  }
  

/*カードアイテムの最終を左寄せにする*/
/*.card-list-3::after{
  content:"";
  display: block;
  width:calc((100% - 20px)/3);
  }
  .card-list-4::before,
  .card-list-4::after{
    content:"";
    display: block;
    width:calc((100% - 20px)/4);
    }
    .card-list-4::before{
    order:1;
      }
  */

}


/**********************************************
                   グリッド     
***********************************************/

.grid{
  display: grid;
}


/**********************************************
                   フレックス    
***********************************************/

.d-flex {display: flex;}
.d-none{display: none;}
.d-block{display: block;}

@media (min-width: 576px){
.d-sm-flex{ display: flex;}
.d-sm-none{display: none;}
.d-sm-block{display: block;}
}
@media (min-width: 768px){
.d-md-flex{ display: flex;}
.d-md-none{display: none;}
.d-md-block{display: block;}
}
@media (min-width: 992px){
.d-lg-flex{ display: flex ;}
.d-lg-none{display: none;}
.d-lg-block{display: block;}
}

@media (min-width: 1200px){
.d-xl-flex{ display: flex;}
.d-xl-none{display: none;}
.d-xl-block{display: block;}
}
@media (min-width: 1400px){
.d-xxl-flex{ display: flex;}
.d-xxl-none{display: none;}
.d-xxl-block{display: block;}
}



.flex-wrap{
  flex-wrap: wrap;
}

.flex-column{flex-direction: column;}



/**********************************************
                   ポジション    
***********************************************/


.position-fixed{position: fixed;}




.infomation-body {
  width: 95%;
  margin: 0 auto;
  padding: 10px;
  background-color: #fff;
  border-radius: 20px;
}

@media (min-width: 768px){
  .infomation div {
    margin: 0 auto;
    padding: 10px;
  }
    }


.infomation img{
  width: 90%;
  box-shadow: 2px 3px 10px 0px rgba(0, 0, 0, 0.4);
}

.infomation li a{
  border-radius: 3px;


}

.infomation li a:hover{
  filter: opacity(90%);
  transform: 1;

}



@media screen and (min-width: 640px) {
  .inner h2 {
    padding: 8% 0 2% 0;
    width: 50%;
}
}



/**********************************************
                   行  
***********************************************/


.m-auto{margin:0 auto;}
.text-start{text-align: left;} 
.text-center{text-align: center;} 
.text-end{text-align: right;} 


@media (min-width: 576px){
.text-sm-start{text-align: left;} 
.text-sm-center{text-align: center;} 
.text-sm-end{text-align: right;} 
}
@media (min-width: 768px){
  .text-md-start{text-align: left;} 
  .text-md-center{text-align: center;} 
  .text-md-end{text-align: right;} 
}
@media (min-width: 992px){
  .text-lg-start{text-align: left;} 
  .text-lg-center{text-align: center;} 
  .text-lg-end{text-align: right;} 
}

@media (min-width: 1200px){
  .text-xl-start{text-align: left;}
  .text-xl-center{text-align: center;}
  .text-xl-end{text-align: right;}

}
@media (min-width: 1400px){
  .text-xxl-start{text-align: left;}
  .text-xxl-center{text-align: center;}
  .text-xxl-end{text-align: right;}

}



/**********************************************
                   スペース  
***********************************************/

.mt-5{margin-top:3rem;}
.mt-4{margin-top:2rem;}
.mt-3{margin-top:1rem;}
.mt-2{margin-top:0.5rem;}
.mt-1{margin-top:0.25rem;}

.mb-5{margin-bottom:3rem;}
.mb-4{margin-bottom:2rem;}
.mb-3{margin-bottom:1rem;}
.mb-2{margin-bottom:0.5rem;}
.mb-1{margin-bottom:0.25rem;}

.mr-5{margin-right:3rem;}
.mr-4{margin-right:2rem;}
.mr-3{margin-right:1rem;}
.mr-2{margin-right:0.5rem;}
.mr-1{margin-right:0.25rem;}

.ml-5{margin-left:3rem;}
.ml-4{margin-left:2rem;}
.ml-3{margin-left:1rem;}
.ml-2{margin-left:0.5rem;}
.ml-1{margin-left:0.25rem;}

.my-5{margin:3rem 0;}
.my-4{margin:2rem 0;}
.my-3{margin:1rem 0;}
.my-2{margin:0.5rem 0;}
.my-1{margin:0.25rem 0;}

.mx-5{margin:0 3rem;}
.mx-4{margin:0 2rem;}
.mx-3{margin:0 1rem;}
.mx-2{margin:0 0.5rem;}
.mx-1{margin:0 0.25rem;}


.pt-5{padding-top:3rem;}
.pt-4{padding-top:2rem;}
.pt-3{padding-top:1rem;}
.pt-2{padding-top:0.5rem;}
.pt-1{padding-top:0.25rem;}

.pb-5{padding-bottom:3rem;}
.pb-4{padding-bottom:2rem;}
.pb-3{padding-bottom:1rem;}
.pb-2{padding-bottom:0.5rem;}
.pb-1{padding-bottom:0.25rem;}

.pr-5{padding-right:3rem;}
.pr-4{padding-right:2rem;}
.pr-3{padding-right:1rem;}
.pr-2{padding-right:0.5rem;}
.pr-1{padding-right:0.25rem;}

.pl-5{padding-left:3rem;}
.pl-4{padding-left:2rem;}
.pl-3{padding-left:1rem;}
.pl-2{padding-left:0.5rem;}
.pl-1{padding-left:0.25rem;}

.py-5{padding-top:3rem;padding-bottom:3rem;}
.py-4{padding-top:2rem;padding-bottom:2rem;}
.py-3{padding-top:1rem;padding-bottom:1rem;}
.py-2{padding-top:0.5rem;padding-bottom:.0.5rem;}
.py-1{padding-top:0.25rem;padding-bottom:0.25rem;}

.px-5{padding-left:3rem; padding-right:3rem;}
.px-4{padding-left:2rem; padding-right:2rem;}
.px-3{padding-left:1rem; padding-right:1rem;}
.px-2{padding-left:0.5rem; padding-right:0.5rem;}
.px-1{padding-left:0.25rem; padding-right:0.25rem;}

.p-5{padding:3rem;}
.p-4{padding:2rem;}
.p-3{padding:1rem;}
.p-2{padding:0.5rem;}
.p-1{padding:0.25rem;}

.gap-0{  gap:0rem;}
.gap-1{  gap:0.25rem;}
.gap-2{  gap:0.5rem;}
.gap-3{  gap:1rem;}
.gap-4{  gap:1.5rem;}
.gap-5{  gap:2rem;}


@media screen and (min-width: 768px),print {
  .gap-md-0{  gap:0rem;}
  .gap-md-1{  gap:0.25rem;}
  .gap-md-2{  gap:0.5rem;}
  .gap-md-3{  gap:1rem;}
  .gap-md-4{  gap:1.5rem;}
  .gap-md-5{  gap:2rem;}
}

  @media screen and (min-width: 992px),print {
.gap-lg-0{  gap:0rem;}
.gap-lg-1{  gap:0.25rem;}
.gap-lg-2{  gap:0.5rem;}
.gap-lg-3{  gap:1rem;}
.gap-lg-4{  gap:1.5rem;}
.gap-lg-5{  gap:2rem;}
    

 }



/**********************************************
                   カ ラ ー      
***********************************************/


.bg-gray{ background: #eee;}


.text-Red{color:#ff382e;}
.text-Pink{color:#ff2e58;}
.text-DeepPink{color:#ff1493;}
.text-Hotpink {color:#ff69b4;}
.text-Violet {color:#ee82ee;}
.text-blueviolet {color:#8a2be2 ;}
.text-Purp{color:#b33de6;}
.text-DeepPurple{color:#801fff;}
.text-darkviolet{color:#9400d3;}
.text-plum{color:#dda0dd;}
.text-orchid{color:#da70d6;}
.text-Indigo{color:#3e5ed0;}
.text-Blue{color:#007bff;}
.text-LightBlue{color:#009efa;}
.text-Cyan{color:#20c4d9;}
.text-Teal{color:#2abba8;}
.text-Green{color:#4ad962;}
.text-LightGreen{color:#79de2b;}
.text-Lime{color:#bee22c;}
.text-Yellow{color:#f7e226;}
.text-Amber{color:#f6b213;}
.text-Orange{color:#ff9500;}
.text-DeepOrange{color:#ff4f1a;}
.text-Brown{color:#b07663;}
.text-Grey{color:#9e9e9e;}
.text-LightGrey{color:#efefef;}
.text-BlueGrey{color:#6e96aa;}
.text-black{color:#000000;}
.text-white{color:#ffffff;}

.bg-Red{background-color:#ff382e;}
.bg-Pink{background-color:#ff2e58;}
.bg-DeepPink{background-color:#ff1493;}
.bg-Hotpink {background-color:#ff69b4;}
.bg-Violet {background-color:#ee82ee;}
.bg-blueviolet {background-color:#8a2be2 ;}
.bg-plum{background-color:#dda0dd;}
.bg-orchid{background-color:#da70d6;}
.bg-Purp{background-color:#b33de6;}
.bg-darkviolet{background-color:#9400d3;}
.bg-DeepPurple{background-color:#801fff;}
.bg-Indigo{background-color:#3e5ed0;}
.bg-Blue{background-color:#007bff;}
.bg-LightBlue{background-color:#009efa;}
.bg-Cyan{background-color:#20c4d9;}
.bg-Teal{background-color:#2abba8;}
.bg-Green{background-color:#4ad962;}
.bg-LightGreen{background-color:#79de2b;}
.bg-Lime{background-color:#bee22c;}
.bg-Yellow{background-color:#f7e226;}
.bg-Amber{background-color:#f6b213;}
.bg-Orange{background-color:#ff9500;}
.bg-DeepOrange{background-color:#ff4f1a;}
.bg-Brown{background-color:#b07663;}
.bg-Grey{background-color:#9e9e9e;}
.bg-LightGrey{background-color:#efefef;}
.bg-BlueGrey{background-color:#6e96aa;}
.bg-Black{background-color:#000000;}
.bg-White{background-color:#ffffff;}



/**********************************************
                  width      
***********************************************/

.w-10{width:10%;}
.w-20{width:20%;}
.w-30{width:30%;}
.w-40{width:40%;}
.w-50{width:50%;}
.w-60{width:60%;}
.w-70{width:70%;}
.w-71{width:71%;}
.w-72{width:72%;}
.w-73{width:73%;}
.w-74{width:74%;}
.w-75{width:75%;}
.w-76{width:76%;}
.w-77{width:77%;}
.w-78{width:78%;}
.w-79{width:79%;}
.w-80{width:80%;}
.w-90{width:90%;}
.w-100{width:100%;}
.w-105{width:105%;}

.vw-100{width:100vw;}
.vw-50{width:50vw;}

/**********************************************
                  height     
***********************************************/

.h-10{height:10%;}
.h-20{height:20%;}
.h-30{height:30%;}
.h-40{height:40%;}
.h-50{height:50%;}
.h-60{height:60%;}
.h-70{height:70%;}
.h-80{height:80%;}
.h-90{height:90%;}
.h-100{height:100%;}

.vh-100{height:100vh;}
.vh-90{height:90vh;}
.vh-80{height:80vh;}
.vh-70{height:70vh;}
.vh-60{height:60vh;}
.vh-50{height:50vh;}
.vh-40{height:40vh;}
.vh-30{height:30vh;}
.vh-20{height:20vh;}
.vh-10{height:10vh;}



/**********************************************
                   ライン      
***********************************************/


.text-decoration-underline {border-bottom:1px solid #efefef; }
.text-decoration-underline-d {border-bottom:1px dotted #efefef; }

/**********************************************
                   見出しライン      
***********************************************/


.heading-line {border-top:1px solid #efefef;
  border-bottom:1px solid #efefef;
padding: 1rem; 
margin: 2.5rem 0; }








/**********************************************
                   テーブル      
***********************************************/

.table{
    padding: .5rem;
    border-bottom-width: 1px;
    border-collapse: collapse;

  }

  .table-bordered {
 
    border-style: solid;

  }


  .table-bordered td{
    border-color: #dee2e6;
    border-color: inherit;
    border-style: solid;

  }

  td, th { border: 1px #dee2e6 solid;
    padding:.7rem; }


/**********************************************
                   リスト      
***********************************************/


  .list-unstyled {
    padding-left: 0;
    list-style: none;
  }

ul.list-group{
  margin: 0;
  padding: 0;
}
  .list-group-item:first-child {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
  }
  .list-group-item {
    position: relative;
    display: block;
    padding: .5rem 1rem;
    color: #212529;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.125);
  }

  .list-style-bottom-solid{
  border-bottom:1px solid #fff;

  }

.list-style-top-solid{
    border-top:1px solid #fff;
    }





/**********************************************
                   モーダル    
**********************************************/
/* 開くボタン */
.button-open {
  display: block;
  padding: 1em;
  color: #eaeaea;
  border-radius: 20rem;
  cursor: pointer;
}



/* モーダルウィンドウ */
.modal-window {
  display: none;
  position: fixed;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 5px;
  z-index: 11007;
  padding:1rem;
  background: #000000;
  text-align: center;
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 90%;
}

.modal-window::-webkit-scrollbar {
  background: #333;
  width: 7px;
}
.modal-window::-webkit-scrollbar-thumb {
  background-color: #666;
  height:20px;
}
.modal-window::-webkit-scrollbar-thumb:hover {
  background-color:#999;
}


/* 閉じるボタン */
.button-close {
 margin: .5rem;
  width: 200px;
  padding: .5em;
  background-color: #f5ee12;
  color: #000;
  border-radius: 10rem;
  cursor: pointer;
}
/* オーバーレイ */
.overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 11006;
}
/*************************************
　　　　　　　　　　モーダル
***************************************/