@charset "UTF-8";
/* ===================================================================
CSS information

 File Name  : util.css
 Style Info : 案件に依存せず汎用的に使うClassを定義
=================================================================== */
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.inline {
  display:inline;
}
.inline_block {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
.block {
  display:block;
}
.flex {
  display: flex;
}
/* 横逆順 */
.fx_r_reverse {
  flex-direction: row-reverse;
}
/* 縦逆順 */
.fx_c_reverse {
  flex-direction: column-reverse;
}
/*アイテム折返し*/
.fx_wrap {
  flex-wrap: wrap;
}
/* 等間隔に配置 */
.fx_between {
  justify-content: space-between;
}
/* センターに配置 */
.fx_center {
  justify-content: center;
}
/* 右側に配置 */
.fx_end {
  justify-content: flex-end;
}
/*上下中央寄せ*/
.fx_all_center {
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/*グリッド*/
.grid {
  display: grid;
}
.gap5 { gap: clamp(10px, 0.5vw, 5px); }
.gap10 { gap: clamp(10px, 0.8vw, 10px); }
.gap15 { gap: clamp(10px, 1.2vw, 15px); }
.gap20 { gap: clamp(10px, 1.6vw, 20px); }
.gap25 { gap: clamp(10px, 2vw, 25px); }
.gap30 { gap: clamp(10px, 2.4vw, 30px); }
.gap35 { gap: clamp(10px, 2.8vw, 35px); }
.gap40 { gap: clamp(10px, 3.2vw, 40px); }
.gap45 { gap: clamp(10px, 3.6vw, 45px); }
.gap50 { gap: clamp(10px, 4vw, 50px); }
.gap55 { gap: clamp(10px, 4.4vw, 55px); }
.gap60 { gap: clamp(10px, 4.8vw, 60px); }

.grid2 { grid-template-columns: repeat(2, 1fr); }
.grid3 { grid-template-columns: repeat(3, 1fr); }
.grid4 { grid-template-columns: repeat(4, 1fr); }
.grid5 { grid-template-columns: repeat(5, 1fr); }
.grid6 { grid-template-columns: repeat(6, 1fr); }
.grid7 { grid-template-columns: repeat(7, 1fr); }
.grid8 { grid-template-columns: repeat(8, 1fr); }
.grid9 { grid-template-columns: repeat(9, 1fr); }
.grid10 { grid-template-columns: repeat(10, 1fr); }

.table_cell {
  display: table-cell;
  vertical-align: middle;
}
.fr {
  float: right;
}
.fl {
  float: left;
}
.tC {
  text-align: center;
}
.tR {
  text-align: right;
}
.pc_none {
  display:none;
}
.clearfix:after {
  content: ""; 
  display: block; 
  clear: both;
}
.alpha:hover {
  opacity: 0.7;
}
.no_alpha {
  opacity: 1!important;
}

@media screen and (max-width: 750px) {
  .pc_none {
    display:block;
  }
  .sp_none {
    display:none;
  }
  .fl,.fr {
    box-sizing:border-box;
    width:100%!important;
    float:none!important;
  }
  .sp_block {
    display: block;
  }
}

.nolink {
  pointer-events: none;
}
.pc_nolink {
  pointer-events: none;
}
  @media screen and (max-width: 750px) {
    .pc_nolink {
      pointer-events: painted;
    }
  }

.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }
.mb30 { margin-bottom: 30px; }
.mb35 { margin-bottom: 35px; }
.mb40 { margin-bottom: 40px; }
.mb45 { margin-bottom: 45px; }
.mb50 { margin-bottom: 50px; }
.mb55 { margin-bottom: 55px; }
.mb60 { margin-bottom: 60px; }
.mb65 { margin-bottom: 65px; }
.mb70 { margin-bottom: 70px; }
.mb75 { margin-bottom: 75px; }
.mb80 { margin-bottom: 80px; }

.mt5 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt25 { margin-top: 25px; }
.mt30 { margin-top: 30px; }
.mt35 { margin-top: 35px; }
.mt40 { margin-top: 40px; }
.mt45 { margin-top: 45px; }
.mt50 { margin-top: 50px; }
.mt55 { margin-top: 55px; }
.mt60 { margin-top: 60px; }
.mt65 { margin-top: 65px; }
.mt70 { margin-top: 70px; }
.mt75 { margin-top: 75px; }
.mt80 { margin-top: 80px; }

@media screen and (max-width: 999px) {
  .mb5 { margin-bottom: 1.33vw; }
  .mb10 { margin-bottom: 2.66vw; }
  .mb15 { margin-bottom: 3.33vw; }
  .mb20 { margin-bottom: 4vw; }
  .mb25 { margin-bottom: 5vw; }
  .mb30 { margin-bottom: 5.33vw; }
  .mb35 { margin-bottom: 6.66vw; }
  .mb40 { margin-bottom: 6.66vw; }
  .mb45 { margin-bottom: 8vw; }
  .mb50 { margin-bottom: 8vw; }
  .mb55 { margin-bottom: 9.33vw; }
  .mb60 { margin-bottom: 9.33vw; }
  .mb65 { margin-bottom: 10.66vw; }
  .mb70 { margin-bottom: 10.66vw; }
  .mb75 { margin-bottom: 10.66vw; }
  .mb80 { margin-bottom: 10.66vw; }

  .mt5 { margin-top: 1.33vw; }
  .mt10 { margin-top: 2.66vw; }
  .mt15 { margin-top: 3.33vw; }
  .mt20 { margin-top: 4vw; }
  .mt25 { margin-top: 5vw; }
  .mt30 { margin-top: 5.33vw; }
  .mt35 { margin-top: 6.66vw; }
  .mt40 { margin-top: 6.66vw; }
  .mt45 { margin-top: 8vw; }
  .mt50 { margin-top: 8vw; }
  .mt55 { margin-top: 9.33vw; }
  .mt60 { margin-top: 9.33vw; }
  .mt65 { margin-top: 10.66vw; }
  .mt70 { margin-top: 10.66vw; }
  .mt75 { margin-top: 10.66vw; }
  .mt80 { margin-top: 10.66vw; }
}

