/* --------------------------------------------------------------------------
  色
-------------------------------------------------------------------------- */

/* -----------------------------
  カラーーテキスト
----------------------------- */

.u-color-orange {
  color: var(--color-orange) !important;
}
.u-color-attention {
  color: var(--color-btn-02) !important;
}
.u-color-grey{
  color: var(--color-gray) !important;
}
.u-color-black {
  color: var(--color-black) !important;
}
.u-color-blue{
  color: var(--color-blue) !important;
}
.u-color-blue-02{
  color: var(--color-blue-02) !important;
}

/* -----------------------------
  カラーー背景
----------------------------- */

.u-bg-table-head-01 {
  background-color: var(--color-bg-table);
}

/* --------------------------------------------------------------------------
  テキスト
-------------------------------------------------------------------------- */

/* -----------------------------
  テキスト
----------------------------- */
.u-text--xxs {
  font-size: calc(var(--text-size-xxs) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--xs {
  font-size: calc(var(--text-size-xs) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--s {
  font-size: calc(var(--text-size-s) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--m {
  font-size: calc(var(--text-size-m) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--l {
  font-size: calc(var(--text-size-l) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--xl {
  font-size: calc(var(--text-size-xl) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--xxl {
  font-size: calc(var(--text-size-xxl) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--xxxl {
  font-size: calc(var(--text-size-xxxl) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--xxxxl {
  font-size: calc(var(--text-size-xxxxl) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}
.u-text--xxxxxl {
  font-size: calc(var(--text-size-xxxxxl) / var(--font-size) * 1rem) !important;
  line-height: 1.7;
}

/* -----------------------------
  テキストー下線
----------------------------- */
.u-text-underline {
  text-decoration: underline;
}

/* -----------------------------
  テキストー改行
----------------------------- */
.u-text-br::before {
  content: "\A";
  white-space: pre;
}

/* -----------------------------
  テキストー通常
----------------------------- */
.u-text-normal {
  font-weight: 400 !important;
}
.u-text-medium {
  font-weight: 500 !important;
}

/* -----------------------------
  テキストー強調
----------------------------- */
.u-text-bold {
  font-weight: 700 !important;
}

/* -----------------------------
  テキストー左寄せ、中央寄せ、右寄せなど
----------------------------- */
.u-text-align-left {
  text-align: left !important;
}
.u-text-align-center {
  text-align: center !important;
}
.u-text-align-right {
  text-align: right !important;
}
.u-text-align-justify {
  text-align: justify !important;
  text-justify: inter-ideograph !important;
}
.u-text-align-combine {
  text-combine-upright: all;
  -webkit-text-combine: horizontal;
  -ms-text-combine-horizontal: all;
}
.u-text-indent {
  text-indent: -1em;
  padding-left: 1em;
}

/* -----------------------------
  テキストーリンク
----------------------------- */
.u-text-link {
  text-decoration: underline;
}
@media all and (min-width: 820px), print {
  .u-text-link:hover {
    text-decoration: none;
  }
}

.u-text-link-02 {
  text-decoration: underline;
  color: var(--color-blue);
}
@media all and (min-width: 820px), print {
  .u-text-link-02:hover {
    text-decoration: none;
  }
}


/* -----------------------------
  テキストー外部リンク
----------------------------- */
.u-text-blank-link {
  text-decoration: underline;
  color: var(--color-blue);
}
.u-text-blank-link:after {
  content: "";
  background-image: url(/site_norlevo/img/common/ico_blank_blue.svg);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  display: inline-block;
  max-width: calc(14 / var(--font-size) * 1rem);
  width: 100%;
  height: calc(14 / var(--font-size) * 1rem);
  position: relative;
  top: calc(2 / var(--font-size) * 1rem);
  margin-left: calc(6 / var(--font-size) * 1rem);
}
@media all and (min-width: 820px), print {
  .u-text-blank-link {
    text-decoration: underline;
    color: var(--color-blue);
  }
  .u-text-blank-link:after {
    content: "";
    background-image: url(/site_norlevo/img/common/ico_blank_blue.svg);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    display: inline-block;
    max-width: calc(14 / var(--font-size) * 1rem);
    width: 100%;
    height: calc(14 / var(--font-size) * 1rem);
    position: relative;
    top: calc(2 / var(--font-size) * 1rem);
    margin-left: calc(6 / var(--font-size) * 1rem);
  }
  .u-text-blank-link:hover {
    text-decoration: none;
  }
}

/* -----------------------------
  テキストーPDFリンク
----------------------------- */
.u-text-pdf-link {
  text-decoration: underline;
  color: var(--color-blue-02);
}
.u-text-pdf-link:before {
  content: "";
  background-color: var(--color-blue-02);
  mask-image: url(/site_norlevo/img/common/ico_pdf_sp.svg);
  mask-size: contain;
  mask-position: center center;
  mask-repeat: no-repeat;
  display: inline-block;
  max-width: calc(14 / var(--font-size) * 1rem);
  width: 100%;
  height: calc(18 / var(--font-size) * 1rem);
  position: relative;
  top: calc(4 / var(--font-size) * 1rem);
  margin-right: calc(6 / var(--font-size) * 1rem);
}
@media all and (min-width: 820px), print {
  .u-text-pdf-link {
    text-decoration: underline;
    color: var(--color-blue-02);
  }
  .u-text-pdf-link:before {
    content: "";
    background-color: var(--color-blue-02);
    mask-image: url(/site_norlevo/img/common/ico_pdf_sp.svg);
    mask-size: contain;
    mask-position: center center;
    mask-repeat: no-repeat;
    display: inline-block;
    max-width: calc(14 / var(--font-size) * 1rem);
    width: 100%;
    height: calc(18 / var(--font-size) * 1rem);
    position: relative;
    top: calc(4 / var(--font-size) * 1rem);
    margin-right: calc(6 / var(--font-size) * 1rem);
  }
  .u-text-pdf-link:hover {
    text-decoration: none;
  }
}

/* --------------------------------------------------------------------------
  マージン
-------------------------------------------------------------------------- */
.u-mb-0_25 {
  margin-bottom: calc(5 / var(--font-size) * 0.875rem) !important;
}
.u-mb-0_5 {
  margin-bottom: calc(10 / var(--font-size) * 0.875rem) !important;
}
.u-mb-1 {
  margin-bottom: calc(20 / var(--font-size) * 0.875rem) !important;
}
.u-mb-1_5 {
  margin-bottom: calc(25 / var(--font-size) * 0.875rem) !important;
}
.u-mb-2 {
  margin-bottom: calc(30 / var(--font-size) * 0.875rem) !important;
}
.u-mb-2_5 {
  margin-bottom: calc(35 / var(--font-size) * 0.875rem) !important;
}
.u-mb-3 {
  margin-bottom: calc(40 / var(--font-size) * 0.875rem) !important;
}
.u-mb-3_5 {
  margin-bottom: calc(45 / var(--font-size) * 0.875rem) !important;
}

.u-ml-0 {
  margin-left: calc(0 / var(--font-size) * 1rem) !important;
}
.u-ml-0_5 {
  margin-left: calc(10 / var(--font-size) * 1rem) !important;
}
.u-ml-1 {
  margin-left: calc(20 / var(--font-size) * 1rem) !important;
}
.u-ml-1_5 {
  margin-left: calc(25 / var(--font-size) * 1rem) !important;
}
.u-ml-2 {
  margin-left: calc(30 / var(--font-size) * 1rem) !important;
}
.u-ml-2_5 {
  margin-left: calc(35 / var(--font-size) * 1rem) !important;
}
.u-ml-3 {
  margin-left: calc(40 / var(--font-size) * 1rem) !important;
}
.u-ml-3_5 {
  margin-left: calc(45 / var(--font-size) * 1rem) !important;
}

/* --------------------------------------------------------------------------
  DISPLAY
-------------------------------------------------------------------------- */
.u-hide-component {
  display: none !important;
}

/* -----------------------------
  DISPLAYー非表示ーPC、タブレットで非表示
----------------------------- */
@media all and (min-width: 820px), print {
  .u-hide-tab-pc {
    display: none !important;
  }
}

/* -----------------------------
  DISPLAYー非表示ーSPで非表示
----------------------------- */
@media all and (max-width: 819px) {
  .u-hide-sp {
    display: none !important;
  }
}