@charset "UTF-8";
.technology {
  position: relative;
  /*技術紹介ページ背景*/
}
.technology .contents {
  position: relative;
  padding: 144px 0 160px;
}
@media screen and (max-width: 767px) {
  .technology .contents {
    padding: 64px 0 80px;
  }
}
.technology .ttl {
  width: 50%;
  background: none;
  background-size: cover;
  position: relative;
}
@media screen and (max-width: 767px) {
  .technology .ttl {
    width: 100%;
    background: none;
    background-size: cover;
  }
}
.technology .ttl .inner {
  width: 291px;
  margin: auto 300px auto auto;
}
@media screen and (max-width: 767px) {
  .technology .ttl .inner {
    width: 100%;
    padding: 0 5%;
  }
}
.technology.top {
  /*イントロ*/
}
.technology.top .intro {
  margin-bottom: 71px;
}
@media screen and (max-width: 767px) {
  .technology.top .intro {
    margin-bottom: 60px;
  }
}
.technology.top .intro h2 {
  font-size: 2.875rem;
  color: #fff;
  font-weight: 400;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .technology.top .intro h2 {
    font-size: 2.25rem;
    text-align: left;
  }
}
.technology.top .technology-process-section {
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-section {
    overflow-x: scroll;
  }
}
.technology.top .technology-process-contents {
  position: relative;
  margin: 0 auto;
  width: 1100px;
  height: 871px;
  background: url(/technology/img/top/map_bg.png) no-repeat top;
  background-size: 100% auto;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents {
    width: 1100px;
    height: 662px;
    background: url(/technology/img/top/map_bg_sp.png) no-repeat top;
    background-size: 100% auto;
  }
}
.technology.top .technology-process-contents::after {
  position: absolute;
  top: 236px;
  right: 70px;
  content: "";
  display: inline-block;
  background: url(/technology/img/top/map_arrow_r.png) no-repeat top left;
  background-size: cover;
  width: 239px;
  height: 510px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents::after {
    top: 178px;
    background: url(/technology/img/top/map_arrow_r_sp.png) no-repeat top left;
    background-size: cover;
    width: 239px;
    height: 410px;
  }
}
.technology.top .technology-process-contents a {
  position: absolute;
}
.technology.top .technology-process-contents a.page-in-link {
  display: block;
}
.technology.top .technology-process-contents a.page-in-link.n01 {
  top: 215px;
  left: 80px;
  width: 122px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-in-link.n01 {
    top: 155px;
    left: 50px;
    width: 112px;
  }
}
.technology.top .technology-process-contents a.page-in-link.n02 {
  top: 302px;
  left: 80px;
  width: 175px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-in-link.n02 {
    top: 216px;
    left: 50px;
    width: 160px;
  }
}
.technology.top .technology-process-contents a.page-in-link.n03 {
  top: 470px;
  left: 80px;
  width: 122px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-in-link.n03 {
    top: 360px;
    left: 50px;
    width: 112px;
  }
}
.technology.top .technology-process-contents a.page-in-link.n04 {
  top: 630px;
  left: 80px;
  width: 140px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-in-link.n04 {
    top: 494px;
    left: 50px;
    width: 128px;
  }
}
.technology.top .technology-process-contents a.page-in-link.n05 {
  top: 730px;
  left: 80px;
  width: 122px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-in-link.n05 {
    top: 562px;
    left: 50px;
    width: 112px;
  }
}
.technology.top .technology-process-contents a.page-auto-link.n01 {
  top: 194px;
  left: 270px;
  width: 161px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-auto-link.n01 {
    top: 146px;
    left: 238px;
  }
}
.technology.top .technology-process-contents a.page-auto-link.n02 {
  top: 294px;
  left: 432px;
  width: 150px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-auto-link.n02 {
    top: 216px;
    left: 400px;
  }
}
.technology.top .technology-process-contents a.page-auto-link.n03 {
  top: 394px;
  left: 583px;
  width: 150px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-auto-link.n03 {
    top: 296px;
    left: 551px;
  }
}
.technology.top .technology-process-contents a.page-auto-link.n04 {
  top: 466px;
  left: 511px;
  width: 150px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-auto-link.n04 {
    top: 358px;
    left: 478px;
  }
}
.technology.top .technology-process-contents a.page-auto-link.n05 {
  top: 538px;
  left: 511px;
  width: 150px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-auto-link.n05 {
    top: 420px;
    left: 478px;
  }
}
.technology.top .technology-process-contents a.page-auto-link.n06 {
  top: 613px;
  left: 432px;
  width: 301px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-auto-link.n06 {
    top: 485px;
    left: 400px;
  }
}
.technology.top .technology-process-contents a.page-auto-link.n07 {
  top: 713px;
  left: 432px;
  width: 301px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology-process-contents a.page-auto-link.n07 {
    top: 555px;
    left: 400px;
  }
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item .inner {
    padding: 0;
  }
}
.technology.top .technology_item-list li.listbox {
  position: relative;
  padding: 40px 40px 54px;
  background: linear-gradient(330deg, rgba(1, 49, 47, 0.45) 0%, rgba(0, 0, 0, 0.45) 100%);
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list li.listbox {
    padding: 30px 7% 40px;
  }
}
.technology.top .technology_item-list li.listbox:not(:last-of-type) {
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list li.listbox:not(:last-of-type) {
    margin-bottom: 30px;
  }
}
.technology.top .technology_item-list .process_list-img {
  margin-bottom: 48px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .process_list-img {
    margin-bottom: 30px;
  }
}
.technology.top .technology_item-list h3 {
  display: flex;
  align-items: center;
  margin-bottom: 1.5em;
  font-size: 1.5rem;
  color: #fff;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list h3 {
    margin-bottom: 1em;
    font-size: 1.25rem;
  }
}
.technology.top .technology_item-list .item-number {
  font-size: 5rem;
  color: #9AD2CF;
  font-family: "Heebo", sans-serif;
  vertical-align: middle;
  padding-right: 15px;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .item-number {
    font-size: 4rem;
    top: -45px;
    left: 7%;
  }
}
.technology.top .technology_item-list .technology_item-flex {
  display: flex;
  flex-wrap: wrap;
}
.technology.top .technology_item-list .technology_item-flex .img-item {
  width: 500px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .img-item {
    margin-bottom: 25px;
    width: 100%;
  }
}
.technology.top .technology_item-list .technology_item-flex .img-item span {
  display: block;
}
.technology.top .technology_item-list .technology_item-flex .img-item span + span {
  margin-top: 24px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .img-item span + span {
    margin-top: 14px;
  }
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .img-item.n04 {
    margin-bottom: 14px;
  }
}
.technology.top .technology_item-list .technology_item-flex .txt-item {
  width: 472px;
  margin-left: 48px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .txt-item {
    width: 100%;
    margin-left: 0;
  }
}
.technology.top .technology_item-list .technology_item-flex .txt-item .txt-img {
  margin-bottom: 64px;
  width: 430px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .txt-item .txt-img {
    margin-bottom: 25px;
    width: 100%;
  }
}
.technology.top .technology_item-list .technology_item-flex .txt-item .txt {
  color: #fff;
}
.technology.top .technology_item-list .technology_item-flex .txt-item .txt h4 {
  margin-bottom: 0.4em;
  font-size: 1.375rem;
  color: #8DCCC9;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .txt-item .txt h4 {
    font-size: 1.125rem;
  }
}
.technology.top .technology_item-list .technology_item-flex .txt-item .txt h5 {
  margin-bottom: 0.5em;
  font-size: 1.125rem;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .txt-item .txt h5 {
    font-size: 1rem;
  }
}
.technology.top .technology_item-list .technology_item-flex .txt-item .txt + .txt {
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .txt-item .txt + .txt {
    margin-top: 20px;
  }
}
.technology.top .technology_item-list .technology_item-flex .txt-item .txt a.more-btn {
  margin: 24px 0 0 auto;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex .txt-item .txt a.more-btn {
    margin: 24px auto 0;
  }
}
.technology.top .technology_item-list .technology_item-flex + .technology_item-flex {
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list .technology_item-flex + .technology_item-flex {
    margin-top: 50px;
  }
}
.technology.top .technology_item-list.col1 .img-item + .img-item {
  margin-left: 32px;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list.col1 .img-item + .img-item {
    margin-left: 0px;
  }
}
.technology.top .technology_item-list.col1 .txt-item {
  margin-left: 0;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .technology.top .technology_item-list.col1 .technology_item-flex + .technology_item-flex {
    margin-top: 0px;
  }
}
.technology.bg_style {
  position: relative;
  background: linear-gradient(0deg, rgb(14, 144, 138) 0%, rgb(10, 117, 149) 100%);
}
.technology.bg_style::before {
  display: inline-block;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url(/products/img/top/bg_tp_left.png), url(/products/img/top/bg_tp_right.png), url(/products/img/common/bg_common_left.png), url(/products/img/common/bg_common_right.png), url(/products/img/common/bg_common_left.png), url(/products/img/common/bg_common_right.png);
  background-size: 590px 353px, 689px 1072px, 824px 1416px, 864px 1279px, 824px 1416px, 864px 1279px;
  background-repeat: no-repeat;
  background-position: top 0 left 0, top 0 right 0, top 1340px left 0, top 3000px right 0, top 4160px left 0, bottom -320px right 0;
  mix-blend-mode: color-dodge;
  position: absolute;
}
@media screen and (max-width: 767px) {
  .technology.bg_style::before {
    background-image: url(/products/img/top/bg_tp_sp.png), url(/products/img/common/bg_common_left_sp.png), url(/products/img/common/bg_common_right_sp.png), url(/products/img/common/bg_common_left2_sp.png), url(/products/img/common/bg_common_right2_sp.png), url(/products/img/common/bg_common_left_sp.png), url(/products/img/common/bg_common_right_sp.png);
    background-size: 100% 54vh, 251px 424px, 240px 446px, 186px 384px, 195px 384px, 251px 424px, 240px 446px;
    background-repeat: no-repeat;
    background-position: top left, top 790px left 0, top 1350px right 0, top 2030px left 0, top 2720px right 0, top 3460px left 0, bottom 1250px right 0;
  }
}/*# sourceMappingURL=technology_common.css.map */