/*************************************************
          ===== FROM-.CSS =====
  Created 2021-08-06
  Updated 2021-08-06
  v0.0.1
*************************************************/

/*
グリッドレイアウト
*/
.container {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

.container.grid-xl {
  max-width: 1296px;
}

.container.grid-lg {
  max-width: 976px;
}

.container.grid-md {
  max-width: 856px;
}

.container.grid-sm {
  max-width: 616px;
}

.container.grid-xs {
  max-width: 496px;
}


/*
グリッド行
*/
.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.row.col-gap {
  padding-left: .4rem;
  padding-right: .4rem;
}

[class~="col-"],
.col {
  -ms-flex: 1;
  flex: 1;
  max-width: 100%;
}

.col-gap {
  padding: .4rem;
}

[class~="col-"].col-30,[class~="col-"].col-29,[class~="col-"].col-28,[class~="col-"].col-27,[class~="col-"].col-26,[class~="col-"].col-25,[class~="col-"].col-24,[class~="col-"].col-23,[class~="col-"].col-22,[class~="col-"].col-21,[class~="col-"].col-20,[class~="col-"].col-19,[class~="col-"].col-18,[class~="col-"].col-17,[class~="col-"].col-16,[class~="col-"].col-15,[class~="col-"].col-14,[class~="col-"].col-13,[class~="col-"].col-12,[class~="col-"].col-11,[class~="col-"].col-10,[class~="col-"].col-9,[class~="col-"].col-8,[class~="col-"].col-7,[class~="col-"].col-6,[class~="col-"].col-5,[class~="col-"].col-4,[class~="col-"].col-3,[class~="col-"].col-2,[class~="col-"].col-1,[class~="col-"].col-auto,
.col.col-30,.col.col-29,.col.col-28,.col.col-27,.col.col-26,.col.col-25,.col.col-24,.col.col-23,.col.col-22,.col.col-21,.col.col-20,.col.col-19,.col.col-18,.col.col-17,.col.col-16,.col.col-15,.col.col-14,.col.col-13,.col.col-12,.col.col-11,.col.col-10,.col.col-9,.col.col-8,.col.col-7,.col.col-6,.col.col-5,.col.col-4,.col.col-3,.col.col-2,.col.col-1,.col.col-auto {
  -ms-flex: none;
  flex: none;
}

/*
グリッド列
*/
.col-30 { width: 100%; }
.col-29 { width: 96.6666666666667%; }
.col-28 { width: 93.3333333333333%; }
.col-27 { width: 90%; }
.col-26 { width: 86.6666666666667%; }
.col-25 { width: 83.3333333333333%; }
.col-24 { width: 80%; }
.col-23 { width: 76.6666666666667%; }
.col-22 { width: 73.3333333333333%; }
.col-21 { width: 70%; }
.col-20 { width: 66.6666666666667%; }
.col-19 { width: 63.3333333333333%; }
.col-18 { width: 60%; }
.col-17 { width: 56.6666666666667%; }
.col-16 { width: 53.3333333333333%; }
.col-15 { width: 50%; }
.col-14 { width: 46.6666666666667%; }
.col-13 { width: 43.3333333333333%; }
.col-12 { width: 40%; }
.col-11 { width: 36.6666666666667%; }
.col-10 { width: 33.3333333333333%; }
.col-9 { width: 30%; }
.col-8 { width: 26.6666666666667%; }
.col-7 { width: 23.3333333333333%; }
.col-6 { width: 20%; }
.col-5 { width: 16.6666666666667%; }
.col-4 { width: 13.3333333333333%; }
.col-3 { width: 10%; }
.col-2 { width: 6.66666666666666%; }
.col-1 { width: 3.33333333333333%; }
.col-auto {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  max-width: none;
  width: auto;
}
.col-mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.col-ml-auto {
  margin-left: auto;
}
.col-mr-auto {
  margin-right: auto;
}

/*
グリッド列オフセット
*/
.col-offset-30 { margin-left: 96.6666666666667%; }
.col-offset-29 { margin-left: 93.3333333333333%; }
.col-offset-28 { margin-left: 90%; }
.col-offset-27 { margin-left: 86.6666666666667%; }
.col-offset-26 { margin-left: 83.3333333333333%; }
.col-offset-25 { margin-left: 80%; }
.col-offset-24 { margin-left: 76.6666666666667%; }
.col-offset-23 { margin-left: 73.3333333333333%; }
.col-offset-22 { margin-left: 70%; }
.col-offset-21 { margin-left: 66.6666666666667%; }
.col-offset-20 { margin-left: 63.3333333333333%; }
.col-offset-19 { margin-left: 60%; }
.col-offset-18 { margin-left: 56.6666666666667%; }
.col-offset-17 { margin-left: 53.3333333333333%; }
.col-offset-16 { margin-left: 50%; }
.col-offset-15 { margin-left: 46.6666666666667%; }
.col-offset-14 { margin-left: 43.3333333333333%; }
.col-offset-13 { margin-left: 40%; }
.col-offset-12 { margin-left: 36.6666666666667%; }
.col-offset-11 { margin-left: 33.3333333333333%; }
.col-offset-10 { margin-left: 30%; }
.col-offset-9 { margin-left: 26.6666666666667%; }
.col-offset-8 { margin-left: 23.3333333333333%; }
.col-offset-7 { margin-left: 20%; }
.col-offset-6 { margin-left: 16.6666666666667%; }
.col-offset-5 { margin-left: 13.3333333333333%; }
.col-offset-4 { margin-left: 10%; }
.col-offset-3 { margin-left: 6.66666666666666%; }
.col-offset-2 { margin-left: 3.33333333333333%; }
.col-offset-1 { margin-left: 0%; }

/*
メディアクエリ
最大1280PX
*/
@media (max-width: 1280px) {
  .col-xl-30,.col-xl-29,.col-xl-28,.col-xl-27,.col-xl-26,.col-xl-25,.col-xl-24,.col-xl-23,.col-xl-22,.col-xl-21,.col-xl-20,.col-xl-19,.col-xl-18,.col-xl-17,.col-xl-16,.col-xl-15,.col-xl-14,.col-xl-13,.col-xl-12,.col-xl-11,.col-xl-10,.col-xl-9,.col-xl-8,.col-xl-7,.col-xl-6,.col-xl-5,.col-xl-4,.col-xl-3,.col-xl-2,.col-xl-1,.col-xl-auto {
    -ms-flex: none;
    flex: none;
  }
  .col-xl-30 { width: 100%; }
  .col-xl-29 { width: 96.6666666666667%; }
  .col-xl-28 { width: 93.3333333333333%; }
  .col-xl-27 { width: 90%; }
  .col-xl-26 { width: 86.6666666666667%; }
  .col-xl-25 { width: 83.3333333333333%; }
  .col-xl-24 { width: 80%; }
  .col-xl-23 { width: 76.6666666666667%; }
  .col-xl-22 { width: 73.3333333333333%; }
  .col-xl-21 { width: 70%; }
  .col-xl-20 { width: 66.6666666666667%; }
  .col-xl-19 { width: 63.3333333333333%; }
  .col-xl-18 { width: 60%; }
  .col-xl-17 { width: 56.6666666666667%; }
  .col-xl-16 { width: 53.3333333333333%; }
  .col-xl-15 { width: 50%; }
  .col-xl-14 { width: 46.6666666666667%; }
  .col-xl-13 { width: 43.3333333333333%; }
  .col-xl-12 { width: 40%; }
  .col-xl-11 { width: 36.6666666666667%; }
  .col-xl-10 { width: 33.3333333333333%; }
  .col-xl-9 { width: 30%; }
  .col-xl-8 { width: 26.6666666666667%; }
  .col-xl-7 { width: 23.3333333333333%; }
  .col-xl-6 { width: 20%; }
  .col-xl-5 { width: 16.6666666666667%; }
  .col-xl-4 { width: 13.3333333333333%; }
  .col-xl-3 { width: 10%; }
  .col-xl-2 { width: 6.66666666666666%; }
  .col-xl-1 { width: 3.33333333333333%; }
  .col-xl-auto { width: auto; }

  .col-xl-offset-30 { margin-left: 96.6666666666667%; }
  .col-xl-offset-29 { margin-left: 93.3333333333333%; }
  .col-xl-offset-28 { margin-left: 90%; }
  .col-xl-offset-27 { margin-left: 86.6666666666667%; }
  .col-xl-offset-26 { margin-left: 83.3333333333333%; }
  .col-xl-offset-25 { margin-left: 80%; }
  .col-xl-offset-24 { margin-left: 76.6666666666667%; }
  .col-xl-offset-23 { margin-left: 73.3333333333333%; }
  .col-xl-offset-22 { margin-left: 70%; }
  .col-xl-offset-21 { margin-left: 66.6666666666667%; }
  .col-xl-offset-20 { margin-left: 63.3333333333333%; }
  .col-xl-offset-19 { margin-left: 60%; }
  .col-xl-offset-18 { margin-left: 56.6666666666667%; }
  .col-xl-offset-17 { margin-left: 53.3333333333333%; }
  .col-xl-offset-16 { margin-left: 50%; }
  .col-xl-offset-15 { margin-left: 46.6666666666667%; }
  .col-xl-offset-14 { margin-left: 43.3333333333333%; }
  .col-xl-offset-13 { margin-left: 40%; }
  .col-xl-offset-12 { margin-left: 36.6666666666667%; }
  .col-xl-offset-11 { margin-left: 33.3333333333333%; }
  .col-xl-offset-10 { margin-left: 30%; }
  .col-xl-offset-9 { margin-left: 26.6666666666667%; }
  .col-xl-offset-8 { margin-left: 23.3333333333333%; }
  .col-xl-offset-7 { margin-left: 20%; }
  .col-xl-offset-6 { margin-left: 16.6666666666667%; }
  .col-xl-offset-5 { margin-left: 13.3333333333333%; }
  .col-xl-offset-4 { margin-left: 10%; }
  .col-xl-offset-3 { margin-left: 6.66666666666666%; }
  .col-xl-offset-2 { margin-left: 3.33333333333333%; }
  .col-xl-offset-1 { margin-left: 0%; }
    
  .hide-xl { display: none !important; }
  .show-xl { display: block !important; }
}


/*
メディアクエリ
最大960PX
*/

@media (max-width: 960px) {
  .col-lg-30,.col-lg-29,.col-lg-28,.col-lg-27,.col-lg-26,.col-lg-25,.col-lg-24,.col-lg-23,.col-lg-22,.col-lg-21,.col-lg-20,.col-lg-19,.col-lg-18,.col-lg-17,.col-lg-16,.col-lg-15,.col-lg-14,.col-lg-13,.col-lg-12,.col-lg-11,.col-lg-10,.col-lg-9,.col-lg-8,.col-lg-7,.col-lg-6,.col-lg-5,.col-lg-4,.col-lg-3,.col-lg-2,.col-lg-1,.col-lg-auto {
    -ms-flex: none;
    flex: none;
  }
  .col-lg-30 { width: 100%; }
  .col-lg-29 { width: 96.6666666666667%; }
  .col-lg-28 { width: 93.3333333333333%; }
  .col-lg-27 { width: 90%; }
  .col-lg-26 { width: 86.6666666666667%; }
  .col-lg-25 { width: 83.3333333333333%; }
  .col-lg-24 { width: 80%; }
  .col-lg-23 { width: 76.6666666666667%; }
  .col-lg-22 { width: 73.3333333333333%; }
  .col-lg-21 { width: 70%; }
  .col-lg-20 { width: 66.6666666666667%; }
  .col-lg-19 { width: 63.3333333333333%; }
  .col-lg-18 { width: 60%; }
  .col-lg-17 { width: 56.6666666666667%; }
  .col-lg-16 { width: 53.3333333333333%; }
  .col-lg-15 { width: 50%; }
  .col-lg-14 { width: 46.6666666666667%; }
  .col-lg-13 { width: 43.3333333333333%; }
  .col-lg-12 { width: 40%; }
  .col-lg-11 { width: 36.6666666666667%; }
  .col-lg-10 { width: 33.3333333333333%; }
  .col-lg-9 { width: 30%; }
  .col-lg-8 { width: 26.6666666666667%; }
  .col-lg-7 { width: 23.3333333333333%; }
  .col-lg-6 { width: 20%; }
  .col-lg-5 { width: 16.6666666666667%; }
  .col-lg-4 { width: 13.3333333333333%; }
  .col-lg-3 { width: 10%; }
  .col-lg-2 { width: 6.66666666666666%; }
  .col-lg-1 { width: 3.33333333333333%; }
  .col-lg-auto { width: auto; }

  .col-lg-offset-30 { margin-left: 96.6666666666667%; }
  .col-lg-offset-29 { margin-left: 93.3333333333333%; }
  .col-lg-offset-28 { margin-left: 90%; }
  .col-lg-offset-27 { margin-left: 86.6666666666667%; }
  .col-lg-offset-26 { margin-left: 83.3333333333333%; }
  .col-lg-offset-25 { margin-left: 80%; }
  .col-lg-offset-24 { margin-left: 76.6666666666667%; }
  .col-lg-offset-23 { margin-left: 73.3333333333333%; }
  .col-lg-offset-22 { margin-left: 70%; }
  .col-lg-offset-21 { margin-left: 66.6666666666667%; }
  .col-lg-offset-20 { margin-left: 63.3333333333333%; }
  .col-lg-offset-19 { margin-left: 60%; }
  .col-lg-offset-18 { margin-left: 56.6666666666667%; }
  .col-lg-offset-17 { margin-left: 53.3333333333333%; }
  .col-lg-offset-16 { margin-left: 50%; }
  .col-lg-offset-15 { margin-left: 46.6666666666667%; }
  .col-lg-offset-14 { margin-left: 43.3333333333333%; }
  .col-lg-offset-13 { margin-left: 40%; }
  .col-lg-offset-12 { margin-left: 36.6666666666667%; }
  .col-lg-offset-11 { margin-left: 33.3333333333333%; }
  .col-lg-offset-10 { margin-left: 30%; }
  .col-lg-offset-9 { margin-left: 26.6666666666667%; }
  .col-lg-offset-8 { margin-left: 23.3333333333333%; }
  .col-lg-offset-7 { margin-left: 20%; }
  .col-lg-offset-6 { margin-left: 16.6666666666667%; }
  .col-lg-offset-5 { margin-left: 13.3333333333333%; }
  .col-lg-offset-4 { margin-left: 10%; }
  .col-lg-offset-3 { margin-left: 6.66666666666666%; }
  .col-lg-offset-2 { margin-left: 3.33333333333333%; }
  .col-lg-offset-1 { margin-left: 0%; }
  .hide-lg { display: none !important; }
  .show-lg { display: block !important; }
}


/*
メディアクエリ
最大840PX
*/
@media (max-width: 840px) {
  .col-md-30,.col-md-29,.col-md-28,.col-md-27,.col-md-26,.col-md-25,.col-md-24,.col-md-23,.col-md-22,.col-md-21,.col-md-20,.col-md-19,.col-md-18,.col-md-17,.col-md-16,.col-md-15,.col-md-14,.col-md-13,.col-md-12,.col-md-11,.col-md-10,.col-md-9,.col-md-8,.col-md-7,.col-md-6,.col-md-5,.col-md-4,.col-md-3,.col-md-2,.col-md-1,.col-md-auto {
    -ms-flex: none;
    flex: none;
  }
  .col-md-30 { width: 100%; }
  .col-md-29 { width: 96.6666666666667%; }
  .col-md-28 { width: 93.3333333333333%; }
  .col-md-27 { width: 90%; }
  .col-md-26 { width: 86.6666666666667%; }
  .col-md-25 { width: 83.3333333333333%; }
  .col-md-24 { width: 80%; }
  .col-md-23 { width: 76.6666666666667%; }
  .col-md-22 { width: 73.3333333333333%; }
  .col-md-21 { width: 70%; }
  .col-md-20 { width: 66.6666666666667%; }
  .col-md-19 { width: 63.3333333333333%; }
  .col-md-18 { width: 60%; }
  .col-md-17 { width: 56.6666666666667%; }
  .col-md-16 { width: 53.3333333333333%; }
  .col-md-15 { width: 50%; }
  .col-md-14 { width: 46.6666666666667%; }
  .col-md-13 { width: 43.3333333333333%; }
  .col-md-12 { width: 40%; }
  .col-md-11 { width: 36.6666666666667%; }
  .col-md-10 { width: 33.3333333333333%; }
  .col-md-9 { width: 30%; }
  .col-md-8 { width: 26.6666666666667%; }
  .col-md-7 { width: 23.3333333333333%; }
  .col-md-6 { width: 20%; }
  .col-md-5 { width: 16.6666666666667%; }
  .col-md-4 { width: 13.3333333333333%; }
  .col-md-3 { width: 10%; }
  .col-md-2 { width: 6.66666666666666%; }
  .col-md-1 { width: 3.33333333333333%; }
  .col-md-auto { width: auto; }
  
  .col-md-offset-30 { margin-left: 96.6666666666667%; }
  .col-md-offset-29 { margin-left: 93.3333333333333%; }
  .col-md-offset-28 { margin-left: 90%; }
  .col-md-offset-27 { margin-left: 86.6666666666667%; }
  .col-md-offset-26 { margin-left: 83.3333333333333%; }
  .col-md-offset-25 { margin-left: 80%; }
  .col-md-offset-24 { margin-left: 76.6666666666667%; }
  .col-md-offset-23 { margin-left: 73.3333333333333%; }
  .col-md-offset-22 { margin-left: 70%; }
  .col-md-offset-21 { margin-left: 66.6666666666667%; }
  .col-md-offset-20 { margin-left: 63.3333333333333%; }
  .col-md-offset-19 { margin-left: 60%; }
  .col-md-offset-18 { margin-left: 56.6666666666667%; }
  .col-md-offset-17 { margin-left: 53.3333333333333%; }
  .col-md-offset-16 { margin-left: 50%; }
  .col-md-offset-15 { margin-left: 46.6666666666667%; }
  .col-md-offset-14 { margin-left: 43.3333333333333%; }
  .col-md-offset-13 { margin-left: 40%; }
  .col-md-offset-12 { margin-left: 36.6666666666667%; }
  .col-md-offset-11 { margin-left: 33.3333333333333%; }
  .col-md-offset-10 { margin-left: 30%; }
  .col-md-offset-9 { margin-left: 26.6666666666667%; }
  .col-md-offset-8 { margin-left: 23.3333333333333%; }
  .col-md-offset-7 { margin-left: 20%; }
  .col-md-offset-6 { margin-left: 16.6666666666667%; }
  .col-md-offset-5 { margin-left: 13.3333333333333%; }
  .col-md-offset-4 { margin-left: 10%; }
  .col-md-offset-3 { margin-left: 6.66666666666666%; }
  .col-md-offset-2 { margin-left: 3.33333333333333%; }
  .col-md-offset-1 { margin-left: 0%; }  
  .hide-md { display: none !important; }
  .show-md { display: block !important; }
}


/*
メディアクエリ
最大600PX
*/
@media (max-width: 600px) {
  .col-sm-30,.col-sm-29,.col-sm-28,.col-sm-27,.col-sm-26,.col-sm-25,.col-sm-24,.col-sm-23,.col-sm-22,.col-sm-21,.col-sm-20,.col-sm-19,.col-sm-18,.col-sm-17,.col-sm-16,.col-sm-15,.col-sm-14,.col-sm-13,.col-sm-12,.col-sm-11,.col-sm-10,.col-sm-9,.col-sm-8,.col-sm-7,.col-sm-6,.col-sm-5,.col-sm-4,.col-sm-3,.col-sm-2,.col-sm-1,.col-sm-auto {
    -ms-flex: none;
    flex: none;
  }
  .col-sm-30 { width: 100%; }
  .col-sm-29 { width: 96.6666666666667%; }
  .col-sm-28 { width: 93.3333333333333%; }
  .col-sm-27 { width: 90%; }
  .col-sm-26 { width: 86.6666666666667%; }
  .col-sm-25 { width: 83.3333333333333%; }
  .col-sm-24 { width: 80%; }
  .col-sm-23 { width: 76.6666666666667%; }
  .col-sm-22 { width: 73.3333333333333%; }
  .col-sm-21 { width: 70%; }
  .col-sm-20 { width: 66.6666666666667%; }
  .col-sm-19 { width: 63.3333333333333%; }
  .col-sm-18 { width: 60%; }
  .col-sm-17 { width: 56.6666666666667%; }
  .col-sm-16 { width: 53.3333333333333%; }
  .col-sm-15 { width: 50%; }
  .col-sm-14 { width: 46.6666666666667%; }
  .col-sm-13 { width: 43.3333333333333%; }
  .col-sm-12 { width: 40%; }
  .col-sm-11 { width: 36.6666666666667%; }
  .col-sm-10 { width: 33.3333333333333%; }
  .col-sm-9 { width: 30%; }
  .col-sm-8 { width: 26.6666666666667%; }
  .col-sm-7 { width: 23.3333333333333%; }
  .col-sm-6 { width: 20%; }
  .col-sm-5 { width: 16.6666666666667%; }
  .col-sm-4 { width: 13.3333333333333%; }
  .col-sm-3 { width: 10%; }
  .col-sm-2 { width: 6.66666666666666%; }
  .col-sm-1 { width: 3.33333333333333%; }
  .col-sm-auto { width: auto; }

  .col-sm-offset-30 { margin-left: 96.6666666666667%; }
  .col-sm-offset-29 { margin-left: 93.3333333333333%; }
  .col-sm-offset-28 { margin-left: 90%; }
  .col-sm-offset-27 { margin-left: 86.6666666666667%; }
  .col-sm-offset-26 { margin-left: 83.3333333333333%; }
  .col-sm-offset-25 { margin-left: 80%; }
  .col-sm-offset-24 { margin-left: 76.6666666666667%; }
  .col-sm-offset-23 { margin-left: 73.3333333333333%; }
  .col-sm-offset-22 { margin-left: 70%; }
  .col-sm-offset-21 { margin-left: 66.6666666666667%; }
  .col-sm-offset-20 { margin-left: 63.3333333333333%; }
  .col-sm-offset-19 { margin-left: 60%; }
  .col-sm-offset-18 { margin-left: 56.6666666666667%; }
  .col-sm-offset-17 { margin-left: 53.3333333333333%; }
  .col-sm-offset-16 { margin-left: 50%; }
  .col-sm-offset-15 { margin-left: 46.6666666666667%; }
  .col-sm-offset-14 { margin-left: 43.3333333333333%; }
  .col-sm-offset-13 { margin-left: 40%; }
  .col-sm-offset-12 { margin-left: 36.6666666666667%; }
  .col-sm-offset-11 { margin-left: 33.3333333333333%; }
  .col-sm-offset-10 { margin-left: 30%; }
  .col-sm-offset-9 { margin-left: 26.6666666666667%; }
  .col-sm-offset-8 { margin-left: 23.3333333333333%; }
  .col-sm-offset-7 { margin-left: 20%; }
  .col-sm-offset-6 { margin-left: 16.6666666666667%; }
  .col-sm-offset-5 { margin-left: 13.3333333333333%; }
  .col-sm-offset-4 { margin-left: 10%; }
  .col-sm-offset-3 { margin-left: 6.66666666666666%; }
  .col-sm-offset-2 { margin-left: 3.33333333333333%; }
  .col-sm-offset-1 { margin-left: 0%; }  
  .hide-sm { display: none !important; }
  .show-sm { display: block !important; }
}


/*
メディアクエリ
最大480PX  
*/
@media (max-width: 480px) {
  .col-xs-30,.col-xs-29,.col-xs-28,.col-xs-27,.col-xs-26,.col-xs-25,.col-xs-24,.col-xs-23,.col-xs-22,.col-xs-21,.col-xs-20,.col-xs-19,.col-xs-18,.col-xs-17,.col-xs-16,.col-xs-15,.col-xs-14,.col-xs-13,.col-xs-12,.col-xs-11,.col-xs-10,.col-xs-9,.col-xs-8,.col-xs-7,.col-xs-6,.col-xs-5,.col-xs-4,.col-xs-3,.col-xs-2,.col-xs-1,.col-xs-auto {
    -ms-flex: none;
    flex: none;
  }
  .col-xs-30 { width: 100%; }
  .col-xs-29 { width: 96.6666666666667%; }
  .col-xs-28 { width: 93.3333333333333%; }
  .col-xs-27 { width: 90%; }
  .col-xs-26 { width: 86.6666666666667%; }
  .col-xs-25 { width: 83.3333333333333%; }
  .col-xs-24 { width: 80%; }
  .col-xs-23 { width: 76.6666666666667%; }
  .col-xs-22 { width: 73.3333333333333%; }
  .col-xs-21 { width: 70%; }
  .col-xs-20 { width: 66.6666666666667%; }
  .col-xs-19 { width: 63.3333333333333%; }
  .col-xs-18 { width: 60%; }
  .col-xs-17 { width: 56.6666666666667%; }
  .col-xs-16 { width: 53.3333333333333%; }
  .col-xs-15 { width: 50%; }
  .col-xs-14 { width: 46.6666666666667%; }
  .col-xs-13 { width: 43.3333333333333%; }
  .col-xs-12 { width: 40%; }
  .col-xs-11 { width: 36.6666666666667%; }
  .col-xs-10 { width: 33.3333333333333%; }
  .col-xs-9 { width: 30%; }
  .col-xs-8 { width: 26.6666666666667%; }
  .col-xs-7 { width: 23.3333333333333%; }
  .col-xs-6 { width: 20%; }
  .col-xs-5 { width: 16.6666666666667%; }
  .col-xs-4 { width: 13.3333333333333%; }
  .col-xs-3 { width: 10%; }
  .col-xs-2 { width: 6.66666666666666%; }
  .col-xs-1 { width: 3.33333333333333%; }
  .col-xs-auto { width: auto; }

  .col-xs-offset-30 { margin-left: 96.6666666666667%; }
  .col-xs-offset-29 { margin-left: 93.3333333333333%; }
  .col-xs-offset-28 { margin-left: 90%; }
  .col-xs-offset-27 { margin-left: 86.6666666666667%; }
  .col-xs-offset-26 { margin-left: 83.3333333333333%; }
  .col-xs-offset-25 { margin-left: 80%; }
  .col-xs-offset-24 { margin-left: 76.6666666666667%; }
  .col-xs-offset-23 { margin-left: 73.3333333333333%; }
  .col-xs-offset-22 { margin-left: 70%; }
  .col-xs-offset-21 { margin-left: 66.6666666666667%; }
  .col-xs-offset-20 { margin-left: 63.3333333333333%; }
  .col-xs-offset-19 { margin-left: 60%; }
  .col-xs-offset-18 { margin-left: 56.6666666666667%; }
  .col-xs-offset-17 { margin-left: 53.3333333333333%; }
  .col-xs-offset-16 { margin-left: 50%; }
  .col-xs-offset-15 { margin-left: 46.6666666666667%; }
  .col-xs-offset-14 { margin-left: 43.3333333333333%; }
  .col-xs-offset-13 { margin-left: 40%; }
  .col-xs-offset-12 { margin-left: 36.6666666666667%; }
  .col-xs-offset-11 { margin-left: 33.3333333333333%; }
  .col-xs-offset-10 { margin-left: 30%; }
  .col-xs-offset-9 { margin-left: 26.6666666666667%; }
  .col-xs-offset-8 { margin-left: 23.3333333333333%; }
  .col-xs-offset-7 { margin-left: 20%; }
  .col-xs-offset-6 { margin-left: 16.6666666666667%; }
  .col-xs-offset-5 { margin-left: 13.3333333333333%; }
  .col-xs-offset-4 { margin-left: 10%; }
  .col-xs-offset-3 { margin-left: 6.66666666666666%; }
  .col-xs-offset-2 { margin-left: 3.33333333333333%; }
  .col-xs-offset-1 { margin-left: 0%; }
  .hide-xs { display: none !important; }
  .show-xs { display: block !important; }
}





















/*
配置位置
*/

.pos-relative {
  position: relative !important;
}

.pos-absolute {
  position: absolute !important;
}

.pos-fixed {
  position: fixed !important;
}

.pos-sticky {
  position: -webkit-sticky !important;
  position: sticky !important;
}

/*

*/
.p-0 {
  padding: 0 !important;
}

.pb-0 {
  padding-bottom: 0 !important;
}

.pl-0 {
  padding-left: 0 !important;
}

.pr-0 {
  padding-right: 0 !important;
}

.pt-0 {
  padding-top: 0 !important;
}

.px-0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.py-0 {
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}

.p-1 {
  padding: .2rem !important;
}

.pb-1 {
  padding-bottom: .2rem !important;
}

.pl-1 {
  padding-left: .2rem !important;
}

.pr-1 {
  padding-right: .2rem !important;
}

.pt-1 {
  padding-top: .2rem !important;
}

.px-1 {
  padding-left: .2rem !important;
  padding-right: .2rem !important;
}

.py-1 {
  padding-bottom: .2rem !important;
  padding-top: .2rem !important;
}

.p-2 {
  padding: .4rem !important;
}

.pb-2 {
  padding-bottom: .4rem !important;
}

.pl-2 {
  padding-left: .4rem !important;
}

.pr-2 {
  padding-right: .4rem !important;
}

.pt-2 {
  padding-top: .4rem !important;
}

.px-2 {
  padding-left: .4rem !important;
  padding-right: .4rem !important;
}

.py-2 {
  padding-bottom: .4rem !important;
  padding-top: .4rem !important;
}



/*
前後位置
*/

.z-idx-0 {
  z-index: 0;
}

.z-idx-1 {
  z-index: 1;
}

.z-idx-2 {
  z-index: 2;
}


/*
マージン
*/

.m-0 {
  margin: 0 !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.ml-0 {
  margin-left: 0 !important;
}

.mr-0 {
  margin-right: 0 !important;
}

.mx-0 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.my-0 {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}

.m-1 {
  margin: .2rem !important;
}

.mb-1 {
  margin-bottom: .2rem !important;
}

.ml-1 {
  margin-left: .2rem !important;
}

.mr-1 {
  margin-right: .2rem !important;
}

.mt-1 {
  margin-top: .2rem !important;
}

.mx-1 {
  margin-left: .2rem !important;
  margin-right: .2rem !important;
}

.my-1 {
  margin-bottom: .2rem !important;
  margin-top: .2rem !important;
}

.m-2 {
  margin: .4rem !important;
}

.mb-2 {
  margin-bottom: .4rem !important;
}

.ml-2 {
  margin-left: .4rem !important;
}

.mr-2 {
  margin-right: .4rem !important;
}

.mt-2 {
  margin-top: .4rem !important;
}

.mx-2 {
  margin-left: .4rem !important;
  margin-right: .4rem !important;
}

.my-2 {
  margin-bottom: .4rem !important;
  margin-top: .4rem !important;
}

/*
リセット
*/

html, body, section {
  margin: 0 !important;
  padding: 0 im !important;
}

* {
  box-sizing: border-box;
}


