/*-----------------------
text
-----------------------*/
/*--size--*/
.u-fs60{
  font-size: 6rem!important;
}
.u-fs50{
  font-size: 5rem!important;
}
.u-fs40{
  font-size: 4rem!important;
}
.u-fs35{
  font-size: 3.5rem!important;
}
.u-fs29{
  font-size: 2.9rem!important;
}
.u-fs30{
  font-size: 3rem!important;
}
.u-fs24{
  font-size: 2.4rem!important;
}
.u-fs20{
  font-size: 2rem!important;
}
.u-fs18{
  font-size: 1.8rem!important;
}
.u-fs16{
  font-size: 1.6rem!important;
}
.u-fs14{
  font-size: 1.4rem!important;
}
.u-fs13{
  font-size: 1.3rem!important;
}

/*--weight--*/
.u-fw400{
  font-weight: 400!important;
}
.u-fw500{
  font-weight: 500!important;
}
.u-fw600{
  font-weight: 600!important;
}
.u-fw800{
  font-weight: 800!important;
}

/*-----------------------
align
-----------------------*/
.u-center{
  text-align: center!important;
}
.u-left{
  text-align: left!important;
}
.u-right{
  text-align: right!important;
}

/*-----------------------
line-height
-----------------------*/
.u-lh--normal{
  line-height: normal!important;
}
.u-lh--1{
  line-height: 1;
}

/*-----------------------
letter-spacing
-----------------------*/
.u-ls0{
  letter-spacing: 0!important;
}

/*-----------------------
width
-----------------------*/
.u-w100p{
  width: 100%!important;
}
.u-w85p{
  width: 85%!important;
}
.u-w80p{
  width: 80%!important;
}
.u-w70p{
  width: 70%!important;
}
.u-w50p{
  width: 50%!important;
}
.u-w40p{
  width: 40%!important;
}
.u-w30p{
  width: 30%!important;
}

/*-----------------------
カラム表示時のwidth
-----------------------*/
.u-w2col{
  max-width: 47%!important;
}
.u-w3col{
  max-width: 33%!important;
}
.u-w4col{
  max-width: 24%!important;
}

/*-----------------------
margin
-----------------------*/
.u-m-auto{
  margin:auto;
}
.u-mt10{
  margin-top: 1rem!important;
}
.u-mt20{
  margin-top: 2rem!important;
}
.u-mt30{
  margin-top: 3rem!important;
}
.u-mt40{
  margin-top: 4rem!important;
}
.u-mt60{
  margin-top: 6rem!important;
}
.u-mt80{
  margin-top: 8rem!important;
}
.u-mb5{
  margin-bottom: 0.5rem!important;
}
.u-mb10{
  margin-bottom: 1rem!important;
}
.u-mb20{
  margin-bottom: 2rem!important;
}
.u-mb40{
  margin-bottom: 4rem!important;
}
.u-mb60{
  margin-bottom: 6rem!important;
}
.u-mb80{
  margin-bottom: 8rem!important;
}
.u-mr10{
  margin-right: 1rem!important;
}
.u-mr20{
  margin-right: 2rem!important;
}
.u-mr40{
  margin-right: 4rem!important;
}
.u-mr15{
  margin-right: 1.5rem!important;
}
.u-ml15{
  margin-left: 1.5rem!important;
}
.u-ml20{
  margin-left: 2rem!important;
}
/*-----------------------
padding
-----------------------*/
.u-pt20{
  padding-top: 2rem!important;
}
.u-pt40{
  padding-top: 4rem!important;
}
.u-pb50{
  margin-bottom: 5rem!important;
}

/*-----------------------
flex
-----------------------*/
.u-flex{
  display: flex;
}

.u-flex-justify-between{
  justify-content: space-between!important;
}
.u-flex-justify-center{
  justify-content: center!important;
}
.u-flex-justify-start{
  justify-content: flex-start!important;
}
.u-flex-justify-end{
  justify-content: flex-end!important;
}
.u-flex-align-center{
  align-items : center!important;
}
.u-flex-align-base{
  align-items: baseline!important;
}
.u-flex-align-end{
  align-items: end!important;
}
.u-flex-wrap{
  flex-wrap: wrap!important;
}
.u-flex-nowrap{
  flex-wrap: nowrap!important;
}

/*-----------------------
grid
-----------------------*/
.u-grid {
  display: grid!important;
}
.u-grid-center {
  place-items: center!important;
}

/*-----------------------
position
-----------------------*/
.u-pos-relative{
  position: relative!important;
}
.u-pos-absolute{
  position: absolute!important;
}

/*-----------------------
display
-----------------------*/
.u-db{
  display: block!important;
}

/*-----------------------
レスポンシブ
-----------------------*/
.u-pc{
  display: block!important;
}
.u-sp{
  display: none!important;
}
@media (max-width: 992px) {
  .u-pc{
    display: none!important;
  }
  .u-sp{
    display: block!important;
  }
  .u-sp-left {
    text-align: left!important;
  }
  .u-sp-w100 {
    width: 100%!important;
  }
}
/*-----------------------
※や①②などを前に出した箇条書き
-----------------------*/
.u-list-indent {
  padding-left: 1em!important;
  text-indent: -1em!important;
}

/*-----------------------
薄い赤背景の注意書き
-----------------------*/
.u-note-box {
  background: rgba(240,68,87,0.1) !important;
  color: #F04457!important;
  padding: 2rem!important;
  margin: auto!important;
  width: 80%!important;
  border-radius: 4px!important;
}

.u-red {
  color: var(--important);
}