@charset "UTF-8";

/* =============================================================================

Minor CSS

・優先度の低い単一パーツクラス「.m-×××」
アイコンなど、レイアウトやグローバル系より優先度を低く設定

上記はここに記述する

============================================================================= */

/* Mask Image Icon .m-i-
::before .m-i-bf
::after .m-i-af
----------------------------------------------------------------------------- */
/* Mask Image Icon Base */
[class*="m-i-"]:not([class*="m-i-bf"],[class*="m-i-af"]),
[class*="m-i-bf"]::before,
[class*="m-i-af"]::after {
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:100%;
  mask-size:100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  height:auto;
  background-color:var(--base-color);
}
[class*="m-i-bf"]::before,
[class*="m-i-af"]::after {
  content:"";
  display:block;
}

/* Arrow */
.m-i-arrow-A,
.m-i-bf-arrow-A::before,
.m-i-af-arrow-A::after {
  -webkit-mask-image:url(/assets/svg/arrow_a.svg);
  mask-image:url(/assets/svg/arrow_a.svg);
  width:1.2rem;
  aspect-ratio: 1/1;
}

/* Arrow */
.m-i-arrow-B,
.m-i-bf-arrow-B::before,
.m-i-af-arrow-B::after {
  -webkit-mask-image:url(/assets/svg/arrow_b.svg);
  mask-image:url(/assets/svg/arrow_b.svg);
  width:9.2rem;
  aspect-ratio: 92/65;
  @media (width <= 640px) {
    width:4.0rem;
  }
}

/* Arrow */
.m-i-arrow-C,
.m-i-bf-arrow-C::before,
.m-i-af-arrow-C::after {
  -webkit-mask-image:url(/assets/svg/arrow_c.svg);
  mask-image:url(/assets/svg/arrow_c.svg);
  width:2.0rem;
  aspect-ratio: 1/1;
}

/* Arrow */
.m-i-arrow-D,
.m-i-bf-arrow-D::before,
.m-i-af-arrow-D::after {
  -webkit-mask-image:url(/assets/svg/arrow_d.svg);
  mask-image:url(/assets/svg/arrow_d.svg);
  width:2.5rem;
  aspect-ratio: 25/29;
  @media (width <= 640px) {
    width:1.4rem;
  }
}

/* Arrow */
.m-i-arrow-E,
.m-i-bf-arrow-E::before,
.m-i-af-arrow-E::after {
  -webkit-mask-image:url(/assets/svg/arrow_e.svg);
  mask-image:url(/assets/svg/arrow_e.svg);
  width:1.6rem;
  aspect-ratio: 1/1;
  @media (width <= 640px) {
    width:1.4rem;
  }
}

/* Facebook Link Icon */
.m-i-fb,
.m-i-bf-fb::before,
.m-i-af-fb::after {
  -webkit-mask-image:url(/assets/svg/ico_fb.svg);
  mask-image:url(/assets/svg/ico_fb.svg);
  width:1.3rem;
  aspect-ratio: 1/1;
  @media (width <= 640px) {
  }
}

/* Instagram Link Icon */
.m-i-insta,
.m-i-bf-insta::before,
.m-i-af-insta::after {
  -webkit-mask-image:url(/assets/svg/ico_insta.svg);
  mask-image:url(/assets/svg/ico_insta.svg);
  width:1.3rem;
  aspect-ratio: 1/1;
  @media (width <= 640px) {
  }
}

/* External Link Icon */
.m-i-external-A,
.m-i-bf-external-A::before,
.m-i-af-external-A::after {
  -webkit-mask-image:url(/assets/svg/external_a.svg);
  mask-image:url(/assets/svg/external_a.svg);
  width:1.1rem;
  aspect-ratio: 1/1;
  @media (width <= 640px) {
  }
}
.m-i-external-B,
.m-i-bf-external-B::before,
.m-i-af-external-B::after {
  -webkit-mask-image:url(/assets/svg/external_b.svg);
  mask-image:url(/assets/svg/external_b.svg);
  width:2.0rem;
  aspect-ratio: 20/14;
  @media (width <= 640px) {
  }
}

/* Logo */
.m-i-corporate_logo,
.m-i-bf-corporate_logo::before,
.m-i-af-corporate_logo::after {
  -webkit-mask-image:url(/assets/svg/corporate_logo.svg);
  mask-image:url(/assets/svg/corporate_logo.svg);
  width:11.6rem;
  aspect-ratio: 116/53;
  @media (width <= 640px) {
    width:9.4rem;
  }
}
.m-i-recruit_logo,
.m-i-bf-recruit_logo::before,
.m-i-af-recruit_logo::after {
  -webkit-mask-image:url(/assets/svg/recruit_logo.svg);
  mask-image:url(/assets/svg/recruit_logo.svg);
  width:10.8rem;
  aspect-ratio: 108/54;
  @media (width <= 640px) {
    width:8.0rem;
  }
}

/* object-fit .m-of-
----------------------------------------------------------------------------- */
/* :where([class*="m-of-"]:not([class*="m-of-pc-"],[class*="m-of-sm-"])) {} */
[class*="m-of-"]:not([class*="m-of-pc-"],[class*="m-of-sp-"]) {
  overflow:hidden;
}
[class*="m-of-"]:not([class*="m-of-pc-"],[class*="m-of-sp-"]) :where(img,video) {
  width:100%;
  height:100%;
}
.m-of-cover :where(img,video) {
  object-fit:cover;
}
.m-of-contain :where(img,video) {
  object-fit:contain;
}
:where(.m-of-cover,.m-of-contain).-full {
  position:relative;
}
:where(.m-of-cover,.m-of-contain).-full :where(img,video) {
  position:absolute;
  top:0;
  left:0;
}
:where(.m-of-cover,.m-of-contain).-top :where(img,video) {
  object-position:center top;
}
:where(.m-of-cover,.m-of-contain).-bottom :where(img,video) {
  object-position:center bottom;
}
@media (width > 640px) {
  [class*="m-of-pc-"] {
    overflow:hidden;
  }
  [class*="m-of-pc-"] :where(img,video) {
    width:100%;
    height:100%;
  }
  .m-of-pc-cover :where(img,video) {
    object-fit:cover;
  }
  .m-of-sm-contain :where(img,video) {
    object-fit:contain;
  }
}
@media (width <= 640px) {
  [class*="m-of-sp-"] {
    overflow:hidden;
  }
  [class*="m-of-sp-"] :where(img,video) {
    width:100%;
    height:100%;
  }
  .m-of-sp-cover :where(img,video) {
    object-fit:cover;
  }
  .m-of-sp-contain :where(img,video) {
    object-fit:contain;
  }
}


/* hover opacity
----------------------------------------------------------------------------- */
@media(hover:hover) {
  .m-hover-brightness {
    transition:filter var(--duration-hover-A);
  }
  .m-hover-brightness:hover {
    filter:brightness(1.2);
  }
  .m-hover-opacity {
    transition:opacity var(--duration-hover-A);
  }
  @media (width > 640px) {
    .m-hover-opacity:not(.js-accordion-button.is-sp:not([href])):hover {
      opacity:.6;
    }
  }
  @media (width <= 640px) {
    .m-hover-opacity:not(.js-accordion-button.is-pc:not([href])):hover {
      opacity:.6;
    }
  }
}