/* 余白系 */
.u-mb-5{
  margin-bottom:5px;
}
.u-mb-10{
  margin-bottom:10px;
}
.u-mb-20{
  margin-bottom:20px;
}
.u-mb-30{
  margin-bottom:30px;
}
.u-mb-50{
  margin-bottom:50px;
}
.u-mt-5{
  margin-top:5px;
}
.u-mt-10{
  margin-top:10px;
}
.u-mt-20{
  margin-top:20px;
}
.u-mt-30{
  margin-top:30px;
}
.u-mt-50{
  margin-top:50px;
}
/* display系 */
.u-inlineBlock{
  display: inline-block !important;
}
/* 中央寄せ系 */
.u-center{
  margin: 0 auto;
}
.u-center-block{
  display: block;
  margin: 0 auto;
}
/* flex系 */
.u-flex{
  display: flex;
  align-items: center;
  column-gap:5px;
}
.u-flex-wrap{
  display: flex;
  flex-wrap: wrap;
  column-gap:10px
}
.u-flex-between-wrap{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
/* 画像系 */
.u-img-border{
  border:1px solid #ccc;padding:5px;
}
.u-img-max{
  max-width: 740px;
  height: auto;
}
/* テキスト系 */
.u-txt-right{
  text-align: right;
}
.u-txt-center{
  text-align: center;
}
.u-font-bold{
  font-weight: bold;
}
.u-color-red{
  color: #CC0000;
}
.u-deco-none{
  text-decoration: none;
}
.u-nowrap{
  white-space: nowrap;
}
.u-valign-middle{
  vertical-align: middle !important;
}

/* wbrを有効にするスタイル */
.u-auto-phrase{
  word-break: keep-all;
  overflow-wrap: anywhere;
}

/* 表示・非表示 */
.u-sp-display{
  display: none!important;
}
@media (max-width: 768px) {
  br.u-sp-nobr{
    display: none;
  }
  .u-sp-nobr br{
    display: none;
  }
  .u-sp-display{
    display: block!important;
  }
  .u-flex-sp-block{
    flex-wrap: wrap;
    row-gap:5px;

  }
  .u-flex-sp-block-item{
    width: 100%!important;
  }
}
/* スマホ対応 */
.u-sp-none{
  @media (max-width: 768px) {
    display: none;
  }
}
/* ボタンホバー */
.u-btn-hover:hover{
  opacity: 0.8;
}