@charset "UTF-8";
/*
index
-----------------------------------------------------*/
/*
i-functions
-----------------------------------------------------*/
/*
i-setting
-----------------------------------------------------*/
/*
i-mixin
-----------------------------------------------------*/
/* ------------------------- 使い方 ----------------------------------------------------------

    @include sizing(width, wide, 365px, sp, 276px);
    ==> width: clamp(276px, 7.46vw + 248px, 365px);
    （ビューポートがwide(1568px)のとき365px, sp(375px)のとき276pxになる自動補完値を上限下限をつけて設定）

    @include sizing(width, wide, 365px, sp, 276px, noClamp);
    ==> width: calc(7.46vw + 248px);
    （ビューポートがwide(1568px)のとき365px, sp(375px)のとき276pxになる自動補完値を設定）

    @include sizingRem(font-size, wide, 14px, sp, 12px);
    ==> font-size: clamp(0.75rem, 0.17vw + 0.70625rem, 0.875rem;
    （ビューポートがwide(1568px)のとき14px, sp(375px)のとき12pxになる自動補完値をremに変換して設定）
　　
    ※使いたいsassファイル上で@useしてください。
    ※scssファイル上での読みやすさ重視のため、mixinの引数に単位[px]が必要な仕様にしてあります。

// ---------------------------------------------------------------------------------------- */
/*
animate
-----------------------------------------------------*/
/* Initial state for sections that will be animated */
.section-animate {
  opacity: 1;
  -webkit-transform: scale(0.95);
          transform: scale(0.95);
  -webkit-transition: opacity 0.8s ease, -webkit-transform 0.8s ease;
  transition: opacity 0.8s ease, -webkit-transform 0.8s ease;
  transition: opacity 0.8s ease, transform 0.8s ease;
  transition: opacity 0.8s ease, transform 0.8s ease, -webkit-transform 0.8s ease;
}

/* State after animation is triggered */
.section-animate.animate {
  opacity: 1;
  -webkit-transform: scale(1);
          transform: scale(1);
}

/* ページタイトルアニメーション用のスタイル */
.animated-path {
  opacity: 0;
  -webkit-transform: translateY(30px);
          transform: translateY(30px);
  -webkit-transition: none;
  transition: none;
}

.st0 {
  fill: #005aaa;
}

/*会社概要*/
#animated-svg-container.company {
  width: 80%;
  max-width: 489px;
}

@media screen and (max-width: 960px) {
  #animated-svg-container.company {
    width: 100%;
    max-width: 223px;
  }
}
/*cases*/
#animated-svg-container.cases {
  width: 80%;
  max-width: 424px;
}

@media screen and (max-width: 960px) {
  #animated-svg-container.cases {
    width: 100%;
    max-width: 196px;
  }
}
/*knowledge*/
#animated-svg-container.knowledge {
  width: 80%;
  max-width: 489px;
}

@media screen and (max-width: 960px) {
  #animated-svg-container.knowledge {
    width: 100%;
    max-width: 223px;
  }
}
/*採用情報*/
#animated-svg-container.recruit {
  width: 80%;
  max-width: 370px;
}

@media screen and (max-width: 960px) {
  #animated-svg-container.recruit {
    width: 100%;
    max-width: 171px;
  }
}
/*お問い合わせ*/
#animated-svg-container.contact {
  width: 80%;
  max-width: 409px;
}

@media screen and (max-width: 960px) {
  #animated-svg-container.contact {
    width: 100%;
    max-width: 187px;
  }
}
/*プライバシーポリシー*/
#animated-svg-container.privacy-policy {
  width: 80%;
  max-width: 706px;
}

@media screen and (max-width: 960px) {
  #animated-svg-container.privacy-policy {
    width: 100%;
    max-width: 315px;
  }
}
/*404*/
#animated-svg-container.notfound {
  width: 80%;
  max-width: 530px;
}

@media screen and (max-width: 960px) {
  #animated-svg-container.notfound {
    width: 100%;
    max-width: 246px;
  }
}
/*# sourceMappingURL=animate.css.map */