/****************************************

Helperクラス

*****************************************/
/* =============================================
Width
============================================= */
.hp_w80{
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 960px) {
  .hp_w80{
    width: 90%;
  }
}
@media screen and (max-width: 560px) {

}

/* =============================================
Margin
============================================= */
.hp_mgt_50{
  margin-top: 50px;
}
.hp_mga{
  margin: auto;
}
.hp_mgr{
  margin-right: .5rem;
}
.hp_mgl{
  margin-left: .5rem;
}
.hp_mgl_a{
  margin-left: auto;
}
.hp_txt_c{
  text-align: center;
}
.hp_flex_rv{
  flex-direction: row-reverse;
}
.hp_bd_b{
  border-bottom: 1px solid #707070;
}
.hp_fc_b{
  color: #12229B;
}
.hp_fs_s{
  font-size: 1.2rem;
}
.hp_br_sp{
  display: none;
}

@media screen and (max-width: 960px) {

}
@media screen and (max-width: 560px) {
  .hp_br_sp{
    display: block;
  }

}
/* =============================================
Padding
============================================= */
.hp_pdt_80{
  padding-top: 80px;
}
.hp_pdb_80{
  padding-bottom: 80px;
}
@media screen and (max-width: 960px) {
}
@media screen and (max-width: 560px) {
  .hp_pdt_130{
    padding-top: 50px;
  }
  .hp_pdb_80{
    padding-bottom: 50px;
  }
}

/* =============================================
改行調整
============================================= */
.hp_inline_block{
  display: inline-block;
}