/*!*********************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./node_modules/import-glob-loader/index.js!./web/src/scss/style.scss ***!
  \*********************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* ------------------------------
* foundation
------------------------------ */
/* ------------------------------
* color
------------------------------ */
/* ------------------------------
* font-family
------------------------------ */
/* ------------------------------
* font-weight
------------------------------ */
/* ------------------------------
* font-size
------------------------------ */
/* ------------------------------
* headerHeight
------------------------------ */
/* ------------------------------
* イージング
------------------------------ */
/* ------------------------------
* text-shadow
------------------------------ */
/* ------------------------------
* メディアクエリ
------------------------------ */
/* ------------------------------
* A Modern CSS Reset
------------------------------ */
*,
*::after,
*::before {
  box-sizing: border-box;
}

blockquote,
body,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
p {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  box-sizing: border-box;
}

ol,
ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

a {
  text-decoration: none;
  color: inherit;
}

button,
input,
select,
textarea {
  vertical-align: middle;
  -webkit-appearance: none;
  border-radius: 0;
  border: none;
  outline: none;
  box-sizing: border-box;
  font-family: initial;
}

table {
  border-spacing: 0;
}

picture {
  display: block;
}

img {
  max-width: 100%;
  display: block;
  object-fit: cover;
  font-family: 'object-fit: cover;';
}

iframe {
  max-width: 100%;
}

/* ------------------------------
* html
------------------------------ */
html {
  font-size: 62.5%;
  visibility: hidden;
}
@media screen and (min-width: 640px) {
  html {
    font-size: 62.5%;
  }
}
@media screen and (min-width: 768px) {
  html {
    font-size: 62.5%;
  }
}
@media screen and (min-width: 1024px) {
  html {
    font-size: 62.5%;
  }
}
@media screen and (min-width: 1280px) {
  html {
    font-size: 62.5%;
  }
}
@media screen and (min-width: 1536px) {
  html {
    font-size: 62.5%;
  }
}
html.wf-active {
  visibility: visible;
}

/* ------------------------------
* body
------------------------------ */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-x: hidden;
  background-color: #fff;
  color: #303030;
  font-family: source-han-sans-japanese, 'Yu Gothic', '游ゴシック', 'YuGothic', '游ゴシック体', 'Hiragino KakuGothic ProN', 'ヒラギノ角ゴシック ProN', 'Hiragino Sans', 'MS PGothic', 'ＭＳ Ｐゴシック', sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  font-feature-settings: 'palt';
}

.body__wrapper {
  overflow: hidden;
}

/* ------------------------------
* selection
------------------------------ */
/* ------------------------------
* layout
------------------------------ */
/* ------------------------------
* l-footer
------------------------------ */
.l-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 4rem;
  background-color: #262626;
}
@media screen and (min-width: 640px) {
  .l-footer {
    height: 10rem;
  }
}
.l-footer__copy {
  color: #fff;
  font-size: 1.3rem;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 640px) {
  .l-footer__copy {
    font-size: 1.4rem;
  }
}

/* ------------------------------
* l-header
------------------------------ */
.l-header {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 6rem;
  background-color: #fff;
}
@media screen and (min-width: 640px) {
  .l-header {
    height: 26rem;
  }
}
.l-header__logo {
  width: 7rem;
}
@media screen and (min-width: 640px) {
  .l-header__logo {
    width: 24.8rem;
  }
}
.l-header__logo img {
  width: 100%;
}

/* ------------------------------
* component
------------------------------ */
/* ------------------------------
* c-about
------------------------------ */
.c-about {
  margin: 5rem 0;
}
@media screen and (min-width: 640px) {
  .c-about {
    margin: 19rem 0 20rem;
  }
}

/* ------------------------------
* c-company
------------------------------ */
.c-company {
  margin: 5rem 0;
}
@media screen and (min-width: 640px) {
  .c-company {
    margin: 20rem 0 15.5rem;
  }
}

/* ------------------------------
* c-group
------------------------------ */
.c-group {
  margin: 5rem 0 5rem;
}
@media screen and (min-width: 640px) {
  .c-group {
    margin: 20rem 0 21rem;
  }
}
.c-group__list {
  display: flex;
  flex-wrap: wrap;
  gap: 4rem 0;
}
@media screen and (min-width: 640px) {
  .c-group__list {
    gap: 5rem 5%;
  }
}
.c-group__item {
  position: relative;
  width: 100%;
  overflow: hidden;
}
@media screen and (min-width: 640px) {
  .c-group__item {
    width: 30%;
    transition: opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
  .c-group__item:hover {
    opacity: 0.75;
  }
}
.c-group__item--blank {
  pointer-events: none;
}
@media screen and (min-width: 640px) {
  .c-group__item--blank {
    transition: none;
  }
  .c-group__item--blank:hover {
    opacity: 1;
  }
}
.c-group__thumb {
  position: relative;
  padding-bottom: 56.25%;
  border: 1px solid #c1c1c1;
  overflow: hidden;
  margin-bottom: 1rem;
}
@media screen and (min-width: 640px) {
  .c-group__thumb {
    margin-bottom: 2.2rem;
  }
}
.c-group__thumb img {
  position: absolute;
  width: 100%;
  height: 100%;
}
.c-group__title {
  color: #333;
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
  font-weight: 600;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 640px) {
  .c-group__title {
    font-size: 1.8rem;
    margin-bottom: 1rem;
  }
}
.c-group__url {
  color: #606060;
  font-weight: 300;
  font-size: 1.5rem;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 640px) {
  .c-group__url {
    font-size: 1.4rem;
  }
}
.c-group__url a::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  z-index: 1;
}

/* ------------------------------
* c-hero
------------------------------ */
.c-hero__pic {
  width: 100%;
}
@media screen and (min-width: 1536px) {
  .c-hero__pic {
    max-width: 160rem;
    margin: 0 auto;
  }
}
.c-hero__pic img {
  width: 100%;
}

/* ------------------------------
* c-lead
------------------------------ */
.c-lead {
  margin-bottom: 2.5rem;
  color: #333;
  font-size: 1.9rem;
  text-align: center;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 640px) {
  .c-lead {
    margin-bottom: 8rem;
    font-size: 2.8rem;
  }
}

/* ------------------------------
* c-table
------------------------------ */
.c-table__row {
  display: flex;
  flex-direction: column;
  gap: 0.8rem 0;
  border-top: 1px solid #eaeaea;
  padding-top: 1.9rem;
}
@media screen and (min-width: 640px) {
  .c-table__row {
    flex-direction: row;
    gap: 0 2rem;
  }
}
.c-table__row + .c-table__row {
  margin-top: 1.5rem;
}
.c-table__row:last-child {
  border-bottom: 1px solid #eaeaea;
  padding-bottom: 1.5rem;
}
.c-table__name {
  width: 100%;
  color: #333;
  font-weight: 500;
  font-size: 1.5rem;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 640px) {
  .c-table__name {
    width: 41.2rem;
    font-size: 1.4rem;
    padding-left: 11.8%;
  }
}
.c-table__data {
  width: 100%;
  color: #606060;
  font-size: 1.5rem;
  letter-spacing: 0.14em;
}
@media screen and (min-width: 640px) {
  .c-table__data {
    flex: 1;
    font-size: 1.4rem;
  }
}

/* ------------------------------
* c-text
------------------------------ */
.c-text {
  color: #333;
  font-size: 1.6rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 2.2;
}
@media screen and (min-width: 640px) {
  .c-text {
    font-size: 1.8rem;
  }
}
.c-text__center {
  text-align: center;
}
.c-text__mt {
  margin-top: 1.5rem;
}

/* ------------------------------
* utility
------------------------------ */
/* ------------------------------
* js-alert
------------------------------ */
.js-alert > * {
  pointer-events: none;
}

/* ------------------------------
* u-guide
------------------------------ */
@media screen and (min-width: 1024px) {
  .u-guide__flex {
    display: flex;
    align-items: flex-start;
    gap: 0 7%;
  }
}
.u-guide__outer {
  width: 90%;
  max-width: 130rem;
  margin-right: auto;
  margin-left: auto;
}
.u-guide__container {
  width: 90%;
  max-width: 120rem;
  margin-right: auto;
  margin-left: auto;
}
.u-guide__wrapper {
  width: 90%;
  max-width: 110rem;
  margin-right: auto;
  margin-left: auto;
}
.u-guide__outer .u-guide__wrapper,
.u-guide__container .u-guide__wrapper,
.u-guide__wrapper .u-guide__wrapper {
  width: 100%;
}
.u-guide__inner {
  width: 90%;
  max-width: 100rem;
  margin-right: auto;
  margin-left: auto;
}
.u-guide__outer .u-guide__inner,
.u-guide__container .u-guide__inner,
.u-guide__wrapper .u-guide__inner {
  width: 100%;
}

/* ------------------------------
* u-sp
------------------------------ */
.u-sp__block {
  display: block !important;
}
@media screen and (min-width: 768px) {
  .u-sp__block {
    display: none !important;
  }
}
.u-sp__none {
  display: none;
}
@media screen and (min-width: 768px) {
  .u-sp__none {
    display: block !important;
  }
}

/* ------------------------------
* u-tab
------------------------------ */
.u-tab__block {
  display: block !important;
}
@media screen and (min-width: 1024px) {
  .u-tab__block {
    display: none !important;
  }
}
.u-tab__none {
  display: none;
}
@media screen and (min-width: 1024px) {
  .u-tab__none {
    display: block !important;
  }
}

/* ------------------------------
* c-links
------------------------------ */
.c-links {
  margin: 5rem 0 5rem;
}

.c-links__pic {
  width: 100%;
  margin-bottom: 2rem;
  border: 1px solid #c1c1c1;
}

@media screen and (min-width: 640px) {
  .c-links {
    margin: 20rem 0 21rem;
  }

  .c-links__pic {
    max-width: 600px;
    margin: 0 auto 2rem;
    transition: opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }

  .c-links__pic:hover {
    opacity: 0.75;
  }
}