@charset "UTF-8";
/*--- 共通・ユーティリティ ---*/
.visible-w1000 {
  display: none;
}
@media screen and (max-width: 1000px) {
  .visible-w1000 {
    display: block;
  }
}

.hidden-w650 {
  display: block;
}
@media screen and (max-width: 650px) {
  .hidden-w650 {
    display: none;
  }
}

.fadein {
  opacity: 0;
  transition: all 0.8s ease-in-out;
}
.fadein.scroll-pt_fadein {
  opacity: 1;
}

/*--- TOP MOVIE / Entry ---*/
.ent {
  position: fixed;
  z-index: 5;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
}
.ent.none {
  display: none;
}

.entry-btn, .entry-btn2, .entry-btn3 {
  position: fixed;
  bottom: 30px;
  cursor: pointer;
  z-index: 100002;
  border: 1px solid #fff;
  font-size: 18px;
  padding: 0.2em 0em;
  text-align: center;
  color: #fff;
  font-weight: bold;
  background-color: #000;
}

.entry-btn {
  right: 20px;
  width: 4.5em;
}

.entry-btn2 {
  display: none;
  right: 120px;
  width: 7em;
}

.entry-btn3 {
  right: 120px;
  width: 7em;
}

.ent-video {
  position: fixed;
  right: 0;
  bottom: 0;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 100%;
  opacity: 1;
  height: auto;
  background-color: #000;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 100000;
  transition: all 1s;
}
.ent-video.fade {
  opacity: 0;
}

/*--- 背景 ---*/
#bg_top {
  background: url("../img/top/bg01.svg") no-repeat center top/100%;
}
@media screen and (max-width: 1400px) {
  #bg_top {
    background-size: 1500px auto;
  }
}
@media screen and (max-width: 768px) {
  #bg_top {
    background-size: 146% auto;
    background-position: 70% top;
  }
}
@media screen and (max-width: 420px) {
  #bg_top {
    background-size: 165% auto;
    background-position: 85% top;
  }
}
@media screen and (max-width: 340px) {
  #bg_top {
    background-size: 170% auto;
  }
}

/*--- メインビジュアル ---*/
@media screen and (max-width: 768px) {
  #top_mv {
    padding-top: 8vw;
  }
}
@media screen and (max-width: 420px) {
  #top_mv {
    padding-top: 5vw;
  }
}
#top_mv .box_h2, #top_mv .box_txt {
  position: relative;
}
#top_mv h1 {
  font-size: 91px;
  font-weight: bold;
  letter-spacing: 0.2em;
  margin-top: 10.9vw;
  margin-bottom: 7.8vw;
}
#top_mv h1.txt_slide {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  opacity: 0;
}
#top_mv h1.delay {
  animation-delay: -6.5s;
}
@media screen and (max-width: 1750px) {
  #top_mv h1 {
    margin-top: 5vw;
  }
}
@media screen and (max-width: 1400px) {
  #top_mv h1 {
    margin-top: 70px;
    margin-bottom: 110px;
  }
}
@media screen and (max-width: 1000px) {
  #top_mv h1 {
    font-size: 10.5vw;
  }
}
@media screen and (max-width: 768px) {
  #top_mv h1 {
    margin-top: 13vw;
    margin-bottom: 7.8vw;
  }
}
@media screen and (max-width: 520px) {
  #top_mv h1 {
    margin-top: 10vw;
  }
}
#top_mv .bg_msg {
  float: left;
  display: inline-block;
  width: 124px;
  height: 20px;
  background-color: #000;
  transform: skewX(40deg);
  margin: 0 0 3.4vw 8px;
}
@media screen and (max-width: 1400px) {
  #top_mv .bg_msg {
    margin-bottom: 48px;
  }
}
@media screen and (max-width: 768px) {
  #top_mv .bg_msg {
    margin-bottom: 5.7vw;
  }
}
#top_mv .bg_msg p {
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.1em;
  line-height: 1em;
  text-align: center;
  transform: skewX(-40deg);
  margin-top: 0.2vw;
}
@media screen and (max-width: 1400px) {
  #top_mv .bg_msg p {
    margin-top: 3px;
  }
}
#top_mv .copy_lead {
  font-size: 23px;
  font-weight: bold;
  text-align: left;
  margin-bottom: 2.5vw;
}
@media screen and (max-width: 1400px) {
  #top_mv .copy_lead {
    margin-bottom: 35px;
  }
}
@media screen and (max-width: 768px) {
  #top_mv .copy_lead {
    font-size: 20px;
    margin-bottom: 2.5vw;
  }
}
@media screen and (max-width: 590px) {
  #top_mv .copy_lead {
    line-height: 1.4em;
  }
}
#top_mv .txt_intro {
  line-height: 1.9em;
}
@media screen and (max-width: 768px) {
  #top_mv .txt_intro {
    width: 100%;
    font-size: 14px;
    line-height: 1.5em;
  }
}
@media screen and (max-width: 520px) {
  #top_mv .txt_intro {
    font-size: 12px;
  }
}
#top_mv .btn_more {
  display: inline-block;
  max-width: 305px;
  width: 100%;
  margin-top: 3.2vw;
}
@media screen and (max-width: 768px) {
  #top_mv .btn_more {
    padding-top: 1.2vw;
    padding-bottom: 1.2vw;
  }
}
#top_mv .btn_more p a {
  width: 100%;
  display: block;
  color: #000;
  letter-spacing: 0.08em;
  text-align: center;
  background-color: #fff;
  padding: 10px 0;
  background-image: url(../img/top/btn_arrow_black.svg);
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 8px auto;
}
@media screen and (max-width: 768px) {
  #top_mv .btn_more p a {
    font-size: 14px;
  }
}

/*--- コンテンツ共通 ---*/
#top_contents {
  overflow: hidden;
}
#top_contents .txt_title {
  font-size: 22px;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  #top_contents .txt_title {
    font-size: 18px;
  }
}
@media screen and (max-width: 420px) {
  #top_contents .txt_title {
    font-size: 14px;
  }
}
#top_contents h2 {
  font-size: 50px;
  font-weight: 300;
  letter-spacing: 0.13em;
  line-height: 1em;
  margin-top: 0.35vw;
  margin-bottom: 2.5vw;
}
#top_contents h2 a {
  color: #fff;
}
@media screen and (max-width: 1400px) {
  #top_contents h2 {
    margin-top: 5px;
    margin-bottom: 35px;
  }
}
@media screen and (max-width: 1000px) {
  #top_contents h2 {
    font-size: 5vw;
  }
}
@media screen and (max-width: 768px) {
  #top_contents h2 {
    margin-top: 0.35vw;
    margin-bottom: 2.5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_contents h2 {
    font-size: 18px;
    font-weight: bold;
  }
}
#top_contents .txt_desc {
  letter-spacing: 0.05em;
  margin-bottom: 3.2vw;
}
@media screen and (max-width: 1400px) {
  #top_contents .txt_desc {
    margin-bottom: 45px;
  }
}
@media screen and (max-width: 768px) {
  #top_contents .txt_desc {
    font-size: 14px;
    margin-bottom: 3.2vw;
  }
}
@media screen and (max-width: 520px) {
  #top_contents .txt_desc {
    font-size: 12px;
  }
}
#top_contents .txt_desc + a {
  display: inline-block;
  max-width: 305px;
  width: 100%;
}
#top_contents .btn_more {
  background-color: #fff;
  padding: 10px 0;
}
#top_contents .btn_more p {
  color: #000;
  letter-spacing: 0.08em;
  text-align: center;
}

/*--- カスタムAI開発 ---*/
#top_service {
  position: relative;
  color: #0082b5;
  text-align: left;
  padding-top: 23vw;
  padding-bottom: 10.4vw;
}
@media screen and (max-width: 2000px) {
  #top_service {
    padding-top: 15vw;
  }
}
@media screen and (max-width: 1650px) {
  #top_service {
    padding-top: 20vw;
  }
}
@media screen and (max-width: 768px) {
  #top_service {
    padding-top: 46vw;
    padding-bottom: 50vw;
  }
}
@media screen and (max-width: 420px) {
  #top_service {
    padding-top: 46vw;
    padding-bottom: 60vw;
  }
}
#top_service h2 a {
  color: #0082b5;
}
#top_service .txt_title,
#top_service h2 a,
#top_service .txt_desc,
#top_service #core_area h3 {
  text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8), 0px 0px 5px rgba(255, 255, 255, 0.8);
}
#top_service .content {
  position: relative;
  z-index: 4;
}
#top_service .bg_service {
  position: absolute;
  top: 0;
  left: -800px;
  opacity: 0;
  transition: all 0.5s ease-in-out;
  width: 150%;
  z-index: -5;
}
@media screen and (max-width: 768px) {
  #top_service .bg_service {
    width: 350%;
  }
}
@media screen and (max-width: 420px) {
  #top_service .bg_service {
    width: 443%;
  }
}
#top_service .bg_service.scroll-pt_left {
  left: 0;
  opacity: 1;
}
#top_service .img_01 {
  max-width: 601px;
  width: 100%;
  margin: 0 auto 2.5vw -68px;
}
@media screen and (max-width: 1400px) {
  #top_service .img_01 {
    margin-bottom: 35px;
  }
}
@media screen and (max-width: 1190px) {
  #top_service .img_01 {
    margin-left: 0px;
  }
}
@media screen and (max-width: 768px) {
  #top_service .img_01 {
    max-width: 430px;
  }
}
#top_service .btn_more {
  display: inline-block;
  max-width: 305px;
  width: 100%;
  padding: 0;
}
#top_service .btn_more a {
  width: 100%;
  display: block;
  background-color: #000;
  padding: 10px 0;
  color: #fff;
  letter-spacing: 0.08em;
  text-align: center;
  background-image: url(../img/top/btn_arrow_white.svg);
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 8px auto;
}
@media screen and (max-width: 768px) {
  #top_service .btn_more a {
    padding-top: 1.2vw;
    padding-bottom: 1.2vw;
  }
}
#top_service #core_area {
  max-width: 503px;
  width: 100%;
  margin-left: 0;
  margin-right: auto;
  margin-top: 70px;
}
#top_service #core_area h3 {
  position: relative;
  font-size: 26px;
  font-weight: normal;
  color: #1b7cab;
}
@media screen and (max-width: 768px) {
  #top_service #core_area h3 {
    font-size: 4vw;
  }
}
#top_service #core_area h3::before {
  content: "";
  width: 370px;
  height: 1px;
  background-color: #1b7cab;
  position: absolute;
  top: 24px;
  right: 0;
  box-shadow: 0px 0px 3px rgba(255, 255, 255, 0.8), 0px 0px 3px rgba(255, 255, 255, 0.8), 0px 0px 3px rgba(255, 255, 255, 0.8), 0px 0px 3px rgba(255, 255, 255, 0.8), 0px 0px 3px rgba(255, 255, 255, 0.8);
}
@media screen and (max-width: 768px) {
  #top_service #core_area h3::before {
    width: calc(100% - 5em);
    top: 4vw;
  }
}
#top_service #core_area .link_box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 20px;
}
#top_service #core_area .link_box .link_block {
  width: 46.8%;
}
#top_service #core_area .link_box .link_block a {
  display: block;
}
#top_service #core_area .link_box .link_block a.no_link {
  pointer-events: none;
}
#top_service #core_area .link_box .link_block:nth-child(n+3) {
  margin-top: 30px;
}
#top_service #core_area .link_box .link_block .l_txt01 {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.8em;
  margin-top: 0.8em;
  color: #000;
}
@media screen and (max-width: 768px) {
  #top_service #core_area .link_box .link_block .l_txt01 {
    font-size: 2.5vw;
  }
}
#top_service #core_area .link_box .link_block .more {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.8em;
  margin-top: 1em;
  color: #000;
  text-align: right;
  padding-right: 27px;
}
@media screen and (max-width: 768px) {
  #top_service #core_area .link_box .link_block .more {
    font-size: 2.4vw;
    padding-right: 4.5vw;
  }
}
#top_service #core_area .link_box .link_block .more.cs {
  padding-left: 0;
}
@media screen and (max-width: 768px) {
  #top_service #core_area .link_box .link_block .more.cs {
    padding-left: 0;
  }
}
#top_service #core_area .link_box .link_block .arrow {
  width: 100%;
  margin-top: -6px;
}
@media screen and (max-width: 768px) {
  #top_service #core_area .link_box .link_block .arrow {
    margin-top: -1vw;
  }
}

#top_methods {
  position: relative;
  padding-bottom: 190px;
}
#top_methods .bg_methods {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 100%;
  z-index: -3;
}
@media screen and (max-width: 768px) {
  #top_methods .bg_methods {
    width: 135%;
    top: 40%;
  }
}
#top_methods .txt_title {
  color: #fff;
  text-align: right;
}
#top_methods h2 {
  text-align: right;
}
#top_methods h2 a {
  color: #fff;
}
#top_methods .txt_desc {
  color: #fff;
  text-align: right;
}
#top_methods .btn_more {
  max-width: 535px;
  width: 100%;
  margin-left: auto;
  margin-right: 0;
  margin-top: 40px;
  padding: 0;
  background-color: transparent;
}
@media screen and (max-width: 768px) {
  #top_methods .btn_more {
    width: 80%;
    margin-top: 4vw;
  }
}

#top_case {
  padding-top: 13.7vw;
}
@media screen and (max-width: 768px) {
  #top_case {
    padding-top: 23vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case {
    padding-top: 0;
  }
}
#top_case .txt_title {
  text-align: left;
  color: #1b7cab;
}
#top_case h2 {
  text-align: left;
}
#top_case h2 a {
  color: #1b7cab;
}
#top_case .txt_desc {
  text-align: left;
  color: #1b7cab;
}
#top_case .btn_more {
  display: inline-block;
  max-width: 305px;
  width: 100%;
  padding: 0;
}
@media screen and (max-width: 420px) {
  #top_case .btn_more {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
}
#top_case .btn_more a {
  width: 100%;
  display: block;
  background-color: #000;
  padding: 10px 0;
  color: #fff;
  letter-spacing: 0.08em;
  text-align: center;
  background-image: url(../img/top/btn_arrow_white.svg);
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 8px auto;
}
@media screen and (max-width: 768px) {
  #top_case .btn_more a {
    padding-top: 1.2vw;
    padding-bottom: 1.2vw;
  }
}
#top_case {
  /* スライダー */
}
#top_case .case_box.case_slider {
  display: block;
  max-width: 1300px;
  width: 92%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50px;
  position: relative;
}
@media screen and (max-width: 768px) {
  #top_case .case_box.case_slider {
    margin-top: 10vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_box.case_slider {
    margin-top: 15vw;
    width: 80% !important;
  }
}
#top_case .case_box.case_slider .slick-list {
  margin: 0 -10px;
}
#top_case .case_box.case_slider .slick-slide {
  margin: 0 30px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_box.case_slider .slick-slide {
    margin: 0 3vw;
  }
}
#top_case .case_box.case_slider .case_block {
  width: 100%;
  margin-bottom: 0;
}
#top_case .case_box.case_slider .slick-prev,
#top_case .case_box.case_slider .slick-next {
  z-index: 1;
  width: 20px;
  height: 60px;
  background: transparent;
  border: none;
  padding: 0;
}
@media screen and (max-width: 1000px) {
  #top_case .case_box.case_slider .slick-prev,
  #top_case .case_box.case_slider .slick-next {
    width: 2vw;
    height: 6vw;
  }
}
#top_case .case_box.case_slider .slick-prev::before,
#top_case .case_box.case_slider .slick-next::before {
  display: none;
}
#top_case .case_box.case_slider .slick-prev {
  left: -40px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_box.case_slider .slick-prev {
    left: -3.8vw;
  }
}
#top_case .case_box.case_slider .slick-next {
  right: -40px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_box.case_slider .slick-next {
    right: -3.8vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_box.case_slider {
    width: 83.3vw;
  }
  #top_case .case_box.case_slider .slick-prev {
    left: -5vw;
  }
  #top_case .case_box.case_slider .slick-next {
    right: -5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_box.case_slider .slick-prev {
    left: -7vw;
  }
  #top_case .case_box.case_slider .slick-next {
    right: -7vw;
  }
}
#top_case .case_block {
  overflow: hidden;
  margin-bottom: 48px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block {
    margin-bottom: 4.8vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block {
    margin-bottom: 6.5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block {
    margin-bottom: 16vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
#top_case .case_block .usecase_box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .usecase_box {
    margin-bottom: 1vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .usecase_box {
    margin-bottom: 1.5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .usecase_box {
    margin-bottom: 2.5vw;
  }
}
#top_case .case_block .usecase_box .usecase_name {
  width: 70px;
  font-size: 16px;
  border-radius: 3px;
  background-color: #000;
  color: #fff;
  text-align: center;
  padding: 0.2em 0 0.3em;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .usecase_box .usecase_name {
    width: 7vw;
    font-size: 1.6vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .usecase_box .usecase_name {
    width: 7.5vw;
    font-size: 2vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .usecase_box .usecase_name {
    width: 12.5vw;
    font-size: 3vw;
  }
}
#top_case .case_block .usecase_box .usecase_value {
  width: calc(100% - 80px);
  font-size: 18px;
  line-height: 1.9em;
  text-align: left;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .usecase_box .usecase_value {
    width: calc(100% - 8vw);
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .usecase_box .usecase_value {
    width: calc(100% - 9.5vw);
    font-size: 2vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .usecase_box .usecase_value {
    width: calc(100% - 14.5vw);
    font-size: 3vw;
  }
}
#top_case .case_block .usecase_box .usecase_value span {
  font-size: 18px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .usecase_box .usecase_value span {
    font-size: 1.8vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .usecase_box .usecase_value span {
    font-size: 2vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .usecase_box .usecase_value span {
    font-size: 3vw;
  }
}
#top_case .case_block .exa_img p img {
  width: 100%;
  height: 190px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 8px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .exa_img p img {
    height: 19vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .exa_img p img {
    height: 20vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .exa_img p img {
    height: 50vw;
  }
}
#top_case .case_block .tax_box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 15px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .tax_box {
    margin-top: 1.5vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .tax_box {
    margin-top: 2.5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .tax_box {
    margin-top: 4.5vw;
    display: block;
  }
}
#top_case .case_block .tax_box .technology_box {
  width: 70%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 420px) {
  #top_case .case_block .tax_box .technology_box {
    width: 100%;
  }
}
#top_case .case_block .tax_box .technology_box .technology_name {
  width: 30px;
  font-size: 12px;
  line-height: 1.5em;
  padding: 0.2em 0 0.3em;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .tax_box .technology_box .technology_name {
    width: 3vw;
    font-size: 1.2vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .tax_box .technology_box .technology_name {
    width: 4.5vw;
    font-size: 1.5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .tax_box .technology_box .technology_name {
    width: 8.5vw;
    font-size: 3vw;
  }
}
#top_case .case_block .tax_box .technology_box .technology_value {
  width: calc(100% - 30px);
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .tax_box .technology_box .technology_value {
    width: calc(100% - 3vw);
    gap: 0.5vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .tax_box .technology_box .technology_value {
    width: calc(100% - 4.5vw);
    gap: 1vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .tax_box .technology_box .technology_value {
    width: calc(100% - 8.5vw);
    gap: 1.5vw;
  }
}
#top_case .case_block .tax_box .technology_box .technology_value span {
  font-size: 12px;
  line-height: 1.5em;
  background-color: #e1e7e7;
  color: #231815;
  padding: 0.2em 1em 0.3em;
  border-radius: 3px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .tax_box .technology_box .technology_value span {
    font-size: 1.2vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .tax_box .technology_box .technology_value span {
    font-size: 1.5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .tax_box .technology_box .technology_value span {
    font-size: 3vw;
  }
}
#top_case .case_block .tax_box .industry_box {
  width: 30%;
}
@media screen and (max-width: 420px) {
  #top_case .case_block .tax_box .industry_box {
    width: 100%;
    padding-top: 1.5vw;
  }
}
#top_case .case_block .tax_box .industry_box p {
  font-size: 14px;
  line-height: 1.5em;
  text-align: right;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .tax_box .industry_box p {
    font-size: 1.4vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .tax_box .industry_box p {
    font-size: 1.5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .tax_box .industry_box p {
    font-size: 3vw;
  }
}
#top_case .case_block .title {
  font-size: 18px;
  font-weight: bold;
  margin-top: 20px;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .title {
    font-size: 1.8vw;
    margin-top: 2vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .title {
    font-size: 4vw;
    margin-top: 2.6vw;
  }
}
#top_case .case_block .title a {
  font-weight: bold;
}
#top_case .case_block .client {
  font-size: 14px;
  font-weight: bold;
  margin-top: 10px;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .client {
    font-size: 1.4vw;
    margin-top: 1vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .client {
    font-size: 1.5vw;
    margin-top: 1.3vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .client {
    font-size: 3.5vw;
    margin-top: 1.3vw;
  }
}
#top_case .case_block .link {
  text-align: right;
}
#top_case .case_block .link a {
  display: block;
  width: 100%;
  font-size: 13px;
  line-height: 1.4em;
  padding-top: 1em;
  padding-right: 1.8em;
  padding-bottom: 0.9em;
  background-image: url("../img/case/link_arrow.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right bottom;
}
@media screen and (max-width: 1000px) {
  #top_case .case_block .link a {
    font-size: 1.3vw;
  }
}
@media screen and (max-width: 768px) {
  #top_case .case_block .link a {
    font-size: 1.5vw;
  }
}
@media screen and (max-width: 420px) {
  #top_case .case_block .link a {
    font-size: 3vw;
  }
}

#top_ai_product {
  padding-top: 17.9vw;
  padding-bottom: 19.3vw;
}
@media screen and (max-width: 768px) {
  #top_ai_product {
    padding-top: 23vw;
    padding-bottom: 23vw;
  }
}
#top_ai_product .content {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #top_ai_product .content {
    display: block;
  }
}
#top_ai_product .content .link01 {
  width: 60.5%;
  order: 1;
}
@media screen and (max-width: 1020px) {
  #top_ai_product .content .link01 {
    width: 50%;
  }
}
@media screen and (max-width: 768px) {
  #top_ai_product .content .link01 {
    width: 80%;
    margin-left: auto;
    margin-right: 0;
  }
}
@media screen and (max-width: 420px) {
  #top_ai_product .content .link01 {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
#top_ai_product .content .txt_box {
  width: 34%;
  order: 2;
  transform: translateY(5%);
}
@media screen and (max-width: 1020px) {
  #top_ai_product .content .txt_box {
    width: 45%;
  }
}
@media screen and (max-width: 768px) {
  #top_ai_product .content .txt_box {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 9vw;
  }
}
#top_ai_product .content .txt_box .txt_title {
  text-align: left;
  color: #7abf56;
}
@media screen and (max-width: 768px) {
  #top_ai_product .content .txt_box .txt_title {
    text-align: right;
  }
}
#top_ai_product .content .txt_box h2 {
  text-align: left;
}
@media screen and (max-width: 768px) {
  #top_ai_product .content .txt_box h2 {
    text-align: right;
  }
}
#top_ai_product .content .txt_box h2 a {
  color: #7abf56;
}
#top_ai_product .content .txt_box .txt_desc {
  text-align: left;
  color: #7abf56;
}
@media screen and (max-width: 768px) {
  #top_ai_product .content .txt_box .txt_desc {
    text-align: right;
  }
}

/*--- アクティビティ ---*/
#top_act {
  position: relative;
  color: #1b7cab;
  padding-bottom: 8.2vw;
}
@media screen and (max-width: 1400px) {
  #top_act {
    padding-bottom: 115px;
  }
}
@media screen and (max-width: 768px) {
  #top_act {
    padding-bottom: 13vw;
  }
}
@media screen and (max-width: 420px) {
  #top_act {
    padding-bottom: 11.4vw;
  }
}
#top_act .bg_act {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}
@media screen and (max-width: 420px) {
  #top_act .bg_act {
    width: 250%;
  }
}
#top_act .content {
  max-width: 790px;
}
@media screen and (max-width: 420px) {
  #top_act .content {
    width: 80%;
  }
}
#top_act h2 a {
  color: #1b7cab;
}
#top_act .box_title {
  text-align: center;
}
#top_act .block_content {
  display: flex;
  justify-content: space-between;
  margin-bottom: 4.2vw;
}
@media screen and (max-width: 1400px) {
  #top_act .block_content {
    margin-bottom: 60px;
  }
}
@media screen and (max-width: 420px) {
  #top_act .block_content {
    display: block;
  }
}
#top_act .txt_desc {
  margin-bottom: 3.5vw;
}
@media screen and (max-width: 1400px) {
  #top_act .txt_desc {
    margin-bottom: 50px;
  }
}
#top_act .box_desc {
  width: 31%;
  color: #000;
  text-align: left;
  position: relative;
}
@media screen and (max-width: 420px) {
  #top_act .box_desc {
    width: 100%;
  }
  #top_act .box_desc + .box_desc {
    margin-top: 8vw;
  }
}
#top_act .box_desc.new::before {
  content: "";
  width: 20.5%;
  height: 20.5%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  background: url("../img/activity/icon_new.png") no-repeat left top/contain;
}
#top_act .box_desc .wrap_img {
  margin-bottom: 1.4vw;
}
@media screen and (max-width: 1400px) {
  #top_act .box_desc .wrap_img {
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 768px) {
  #top_act .box_desc .wrap_img {
    margin-bottom: 1.4vw;
  }
}
#top_act .box_desc .wrap_img img {
  border-radius: 10px;
}
#top_act .box_desc .block01 {
  margin-top: 15px;
  margin-bottom: 10px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 420px) {
  #top_act .box_desc .block01 {
    margin-top: 4vw;
    margin-bottom: 3vw;
  }
}
#top_act .box_desc .block01 .date {
  font-size: 15px;
  font-weight: bold;
  margin-right: 0.5em;
}
@media screen and (max-width: 420px) {
  #top_act .box_desc .block01 .date {
    font-size: 4vw;
  }
}
#top_act .box_desc .block01 .category {
  font-size: 13px;
  width: 146px;
  text-align: center;
  color: #fff;
}
@media screen and (max-width: 420px) {
  #top_act .box_desc .block01 .category {
    font-size: 3.5vw;
    width: 40vw;
  }
}
#top_act .box_desc .block01 .category a {
  display: block;
  color: #fff;
  height: 100%;
}
#top_act .box_desc .block01 .category.info a {
  background-color: #000;
}
#top_act .box_desc .block01 .category.column.no-link, #top_act .box_desc .block01 .category.column a {
  background-color: #666;
}
#top_act .box_desc .block01 .category.column.design a {
  background-color: #7cc953;
}
#top_act .box_desc .block01 .category.column.engineer a {
  background-color: #0082b5;
}
#top_act .box_desc h3 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 1.2vw;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 1400px) {
  #top_act .box_desc h3 {
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 768px) {
  #top_act .box_desc h3 {
    font-size: 16px;
    margin-bottom: 1.2vw;
  }
}
#top_act .box_desc .txt {
  font-size: 12px;
  letter-spacing: 0;
  text-align: justify;
}
#top_act .box_desc .block02 {
  margin-top: 15px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 420px) {
  #top_act .box_desc .block02 {
    margin-top: 4vw;
  }
}
#top_act .box_desc .block02 .link a, #top_act .box_desc .block02 .pdf a {
  font-size: 13px;
  line-height: 1.4em;
  padding-left: 1.8em;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left center;
  color: #231815;
}
@media screen and (max-width: 420px) {
  #top_act .box_desc .block02 .link a, #top_act .box_desc .block02 .pdf a {
    font-size: 3.5vw;
  }
}
#top_act .box_desc .block02 .link a {
  background-image: url("../img/activity/icon_continue.png");
  margin-left: auto;
}
#top_act .box_desc .block02 .pdf {
  margin-left: 1em;
}
#top_act .box_desc .block02 .pdf a {
  background-image: url("../img/activity/icon_pdf.png");
  padding-left: 1.5em;
}
#top_act .block_content + a {
  display: block;
  max-width: 305px;
  width: 100%;
  margin: 0 auto;
}
#top_act .btn_more {
  background-color: #000;
  background-image: url(../img/top/btn_arrow_white.svg);
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 8px auto;
}
#top_act .btn_more p {
  color: #fff;
}

/*--- 企業情報 ---*/
#top_company {
  color: #fff;
  text-align: center;
  background-color: #0082b5;
  padding: 95px 0 115px;
}
@media screen and (max-width: 768px) {
  #top_company {
    padding-top: 11.4vw;
    padding-bottom: 11.4vw;
  }
}
#top_company .block_content {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
#top_company .block_content > a {
  display: inline-block;
  width: 20%;
  margin: 0 1% 2%;
}
@media screen and (max-width: 768px) {
  #top_company .block_content > a {
    width: 30%;
  }
}
@media screen and (max-width: 420px) {
  #top_company .block_content > a {
    width: 46%;
    margin: 0 1.5% 3%;
  }
}
#top_company .block_content > a > div {
  height: 155px;
  line-height: 155px;
  background-color: #fff;
}
@media screen and (max-width: 1000px) {
  #top_company .block_content > a > div {
    width: 18.5vw;
    height: 18.5vw;
    line-height: 18.5vw;
    margin: 0 auto;
  }
}
@media screen and (max-width: 768px) {
  #top_company .block_content > a > div {
    width: 26vw;
    height: 26vw;
    line-height: 26vw;
  }
}
@media screen and (max-width: 420px) {
  #top_company .block_content > a > div {
    width: 100%;
  }
}
#top_company .block_content h3 {
  display: inline-block;
  vertical-align: middle;
  color: #0082b5;
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  #top_company .block_content h3 {
    font-size: 14px;
  }
}

/*--- SVGアニメーション ---*/
#svg_animate {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 6;
}
#svg_animate.bgn {
  background: none;
}
#svg_animate.none {
  display: none;
}
#svg_animate .logo_content {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 20;
}
#svg_animate .logo_content #SVGanimation {
  position: relative;
  top: -5vh;
  width: 100%;
  max-width: 300px;
  margin: 0 auto;
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
}
#svg_animate .logo_content #SVGanimation.close {
  opacity: 0;
}
@media screen and (max-width: 420px) {
  #svg_animate .logo_content #SVGanimation {
    top: -2vh;
    width: 70%;
    max-width: none;
  }
}
#svg_animate .left_bg, #svg_animate .right_bg {
  display: block;
  width: 100vw;
  height: 100vh;
  position: fixed;
  z-index: 10;
  transition: all 1.5s ease-in-out;
}
#svg_animate .left_bg p, #svg_animate .right_bg p {
  box-sizing: content-box;
  display: block;
}
#svg_animate .left_bg {
  bottom: 0;
  left: 0;
}
#svg_animate .left_bg p {
  border-top: 50vh solid transparent;
  border-right: 50vw solid transparent;
  border-bottom: 50vh solid #FFF;
  border-left: 50vw solid #FFF;
}
#svg_animate .left_bg.move {
  bottom: -100vh;
  left: -100vw;
}
#svg_animate .right_bg {
  top: 0;
  right: 0;
}
#svg_animate .right_bg p {
  border-top: 50vh solid #FFF;
  border-right: 50vw solid #FFF;
  border-bottom: 50vh solid transparent;
  border-left: 50vw solid transparent;
}
#svg_animate .right_bg.move {
  top: -100vh;
  right: -100vw;
}

/*--- アニメーション ---*/
@keyframes fadeOutText {
  0%, 35% {
    opacity: 1;
  }
  40%, 95% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fade {
  animation: fadeOutText 13s ease-in-out infinite;
}

/*--- モーダルウィンドウ ---*/
.modal_window {
  display: none;
}

.fancybox-content {
  max-width: 700px;
  width: 100%;
  background-image: url("../img/company/members/bg_01.png"), url("../img/company/members/bg_02.png");
  background-size: 18.5%;
  background-position: left top, right bottom;
  background-repeat: no-repeat;
  background-color: #fff;
  padding: 70px 55px 85px;
}
.fancybox-content .date {
  font-size: 14px;
  text-align: center;
  margin-bottom: 12px;
}
.fancybox-content .date .category {
  padding: 0.2em 1em;
  background-color: #000;
  color: #fff;
  font-size: 12px;
  display: inline-block;
  margin-left: 2em;
}
@media screen and (max-width: 420px) {
  .fancybox-content .date .category {
    margin-left: 0em;
    margin-top: 1em;
  }
}
.fancybox-content h3 {
  font-size: 16px;
  text-align: center;
  margin-bottom: 35px;
}
.fancybox-content .txt_desc {
  font-size: 14px;
  text-align: justify;
}
.fancybox-content a {
  color: #0082b5;
  text-decoration: underline;
}/*# sourceMappingURL=style_top.css.map */