@charset "UTF-8";
:root {
  --space: 8px;
}


@media screen and (min-width: 769px), print {
  .u-none--pc {
    display: none !important;
  }
}

@media screen and (max-width: 768px) {
  .u-none--sp {
    display: none !important;
  }
}

.u-bold{
  font-weight: bold;
}

.u-nowrap {
  white-space: nowrap;
}


.u-flex{
  display: flex;
}


/* 幅 */
.u-w10p{
  width: 10%;
}
.u-w20p{
  width: 20%;
}
.u-w30p{
  width: 30%;
}
.u-w40p{
  width: 40%;
}
.u-w50p{
  width: 50%;
}
.u-w60p{
  width: 60%;
}
.u-w70p{
  width: 70%;
}
.u-w80p{
  width: 80%;
}
.u-w90p{
  width: 90%;
}




/* margin */
.u-m-1  { margin:        calc(var(--space) * 1); }
.u-m-2  { margin:        calc(var(--space) * 2); }
.u-m-3  { margin:        calc(var(--space) * 3); }
.u-m-4  { margin:        calc(var(--space) * 4); }
.u-m-5  { margin:        calc(var(--space) * 5); }
.u-m-6  { margin:        calc(var(--space) * 6); }

.u-mt-1 { margin-top:    calc(var(--space) * 1); }
.u-mt-2 { margin-top:    calc(var(--space) * 2); }
.u-mt-3 { margin-top:    calc(var(--space) * 3); }
.u-mt-4 { margin-top:    calc(var(--space) * 4); }
.u-mt-5 { margin-top:    calc(var(--space) * 5); }
.u-mt-6 { margin-top:    calc(var(--space) * 6); }

.u-mr-1 { margin-right:  calc(var(--space) * 1); }
.u-mr-2 { margin-right:  calc(var(--space) * 2); }
.u-mr-3 { margin-right:  calc(var(--space) * 3); }
.u-mr-4 { margin-right:  calc(var(--space) * 4); }
.u-mr-5 { margin-right:  calc(var(--space) * 5); }
.u-mr-6 { margin-right:  calc(var(--space) * 6); }

.u-mb-1 { margin-bottom: calc(var(--space) * 1); }
.u-mb-2 { margin-bottom: calc(var(--space) * 2); }
.u-mb-3 { margin-bottom: calc(var(--space) * 3); }
.u-mb-4 { margin-bottom: calc(var(--space) * 4); }
.u-mb-5 { margin-bottom: calc(var(--space) * 5); }
.u-mb-6 { margin-bottom: calc(var(--space) * 6); }

.u-ml-1 { margin-left:   calc(var(--space) * 1); }
.u-ml-2 { margin-left:   calc(var(--space) * 2); }
.u-ml-3 { margin-left:   calc(var(--space) * 3); }
.u-ml-4 { margin-left:   calc(var(--space) * 4); }
.u-ml-5 { margin-left:   calc(var(--space) * 5); }
.u-ml-6 { margin-left:   calc(var(--space) * 6); }

.u-mx-1 { margin-left:   calc(var(--space) * 1); margin-right:  calc(var(--space) * 1); }
.u-mx-2 { margin-left:   calc(var(--space) * 2); margin-right:  calc(var(--space) * 2); }
.u-mx-3 { margin-left:   calc(var(--space) * 3); margin-right:  calc(var(--space) * 3); }
.u-mx-4 { margin-left:   calc(var(--space) * 4); margin-right:  calc(var(--space) * 4); }
.u-mx-5 { margin-left:   calc(var(--space) * 5); margin-right:  calc(var(--space) * 5); }
.u-mx-6 { margin-left:   calc(var(--space) * 6); margin-right:  calc(var(--space) * 6); }

.u-my-1 { margin-top:    calc(var(--space) * 1); margin-bottom: calc(var(--space) * 1); }
.u-my-2 { margin-top:    calc(var(--space) * 2); margin-bottom: calc(var(--space) * 2); }
.u-my-3 { margin-top:    calc(var(--space) * 3); margin-bottom: calc(var(--space) * 3); }
.u-my-4 { margin-top:    calc(var(--space) * 4); margin-bottom: calc(var(--space) * 4); }
.u-my-5 { margin-top:    calc(var(--space) * 5); margin-bottom: calc(var(--space) * 5); }
.u-my-6 { margin-top:    calc(var(--space) * 6); margin-bottom: calc(var(--space) * 6); }

/* padding */
.u-p-1  { padding:        calc(var(--space) * 1); }
.u-p-2  { padding:        calc(var(--space) * 2); }
.u-p-3  { padding:        calc(var(--space) * 3); }
.u-p-4  { padding:        calc(var(--space) * 4); }
.u-p-5  { padding:        calc(var(--space) * 5); }
.u-p-6  { padding:        calc(var(--space) * 6); }

.u-pt-1 { padding-top:    calc(var(--space) * 1); }
.u-pt-2 { padding-top:    calc(var(--space) * 2); }
.u-pt-3 { padding-top:    calc(var(--space) * 3); }
.u-pt-4 { padding-top:    calc(var(--space) * 4); }
.u-pt-5 { padding-top:    calc(var(--space) * 5); }
.u-pt-6 { padding-top:    calc(var(--space) * 6); }

.u-pr-1 { padding-right:  calc(var(--space) * 1); }
.u-pr-2 { padding-right:  calc(var(--space) * 2); }
.u-pr-3 { padding-right:  calc(var(--space) * 3); }
.u-pr-4 { padding-right:  calc(var(--space) * 4); }
.u-pr-5 { padding-right:  calc(var(--space) * 5); }
.u-pr-6 { padding-right:  calc(var(--space) * 6); }

.u-pb-1 { padding-bottom: calc(var(--space) * 1); }
.u-pb-2 { padding-bottom: calc(var(--space) * 2); }
.u-pb-3 { padding-bottom: calc(var(--space) * 3); }
.u-pb-4 { padding-bottom: calc(var(--space) * 4); }
.u-pb-5 { padding-bottom: calc(var(--space) * 5); }
.u-pb-6 { padding-bottom: calc(var(--space) * 6); }

.u-pl-1 { padding-left:   calc(var(--space) * 1); }
.u-pl-2 { padding-left:   calc(var(--space) * 2); }
.u-pl-3 { padding-left:   calc(var(--space) * 3); }
.u-pl-4 { padding-left:   calc(var(--space) * 4); }
.u-pl-5 { padding-left:   calc(var(--space) * 5); }
.u-pl-6 { padding-left:   calc(var(--space) * 6); }

.u-px-1 { padding-left:   calc(var(--space) * 1); padding-right:  calc(var(--space) * 1); }
.u-px-2 { padding-left:   calc(var(--space) * 2); padding-right:  calc(var(--space) * 2); }
.u-px-3 { padding-left:   calc(var(--space) * 3); padding-right:  calc(var(--space) * 3); }
.u-px-4 { padding-left:   calc(var(--space) * 4); padding-right:  calc(var(--space) * 4); }
.u-px-5 { padding-left:   calc(var(--space) * 5); padding-right:  calc(var(--space) * 5); }
.u-px-6 { padding-left:   calc(var(--space) * 6); padding-right:  calc(var(--space) * 6); }

.u-py-1 { padding-top:    calc(var(--space) * 1); padding-bottom: calc(var(--space) * 1); }
.u-py-2 { padding-top:    calc(var(--space) * 2); padding-bottom: calc(var(--space) * 2); }
.u-py-3 { padding-top:    calc(var(--space) * 3); padding-bottom: calc(var(--space) * 3); }
.u-py-4 { padding-top:    calc(var(--space) * 4); padding-bottom: calc(var(--space) * 4); }
.u-py-5 { padding-top:    calc(var(--space) * 5); padding-bottom: calc(var(--space) * 5); }
.u-py-6 { padding-top:    calc(var(--space) * 6); padding-bottom: calc(var(--space) * 6); }

/* gap */
.u-gap-1 { gap: calc(var(--space) * 1); }
.u-gap-2 { gap: calc(var(--space) * 2); }
.u-gap-3 { gap: calc(var(--space) * 3); }
.u-gap-4 { gap: calc(var(--space) * 4); }
.u-gap-5 { gap: calc(var(--space) * 5); }
.u-gap-6 { gap: calc(var(--space) * 6); }