@charset "UTF-8";
/* CSS Document */

/* ::::::::::::::::::::::::::::::::: COMMON ::::::::::::::::::::::::::::::::: */
body {
  font-family: "Poppins", sans-serif !important;
  font-weight: 200;
}



/* =======================================================
.en-index
======================================================= */

/* mainHeader ============================= */
@media screen and (max-width: 1334px) {
  header.mainHeader div.menuList {
    padding-bottom: 40px;
  }
}

header.mainHeader div.right {
  font-weight: 300;
}



/* topKV ============================= */
#wrapper section.topKV {
  background-image: url(/products/softrobotics/img/en-top/kv.jpg);
}

#wrapper section.topKV div.titleWrap p.lead {
  font-size: 40px;
  line-height: 1;
}
@media screen and (max-width: 979px) {
  #wrapper section.topKV div.titleWrap p.lead {
      font-size: 17px;
      text-align: center;
  }
}

#wrapper section.topKV .bnrGDA {
  left: auto;
  right: 90px;
  bottom: 90px;
}
@media screen and (max-width: 979px) {
  #wrapper section.topKV .bnrGDA {
    left: auto;
    right: 30px;
    bottom: 57px;
  }
}

@media screen and (max-width: 979px) {
  #wrapper section.topKV p.scroll {
    bottom: 60px;
  }
}


/* topSection ============================= */
#wrapper section.topSection {
  padding: 0;
}


/* secEnContents ============================= */
.secEnContents {
  position: relative;
  padding: 110px 0 0;
}
@media screen and (max-width: 979px) {
  .secEnContents {
    padding-top: 95px;
  }
  #sec-about.secEnContents {
    padding-top: 70px;
  }
}

.secEnContents img {
  width: 100%;
  height: auto;
}

/* secEnContents_kv --------------- */
.secEnContents_kv {
  position: absolute;
  right: 0;
  top: 110px;
  width: 59.1%;
  border-radius: 30px;
  overflow: hidden;
}
.secEnContents_kv.reverse {
  right: auto;
  left: 0;
}
@media screen and (max-width: 979px) {
  .secEnContents_kv {
    position: relative;
    right: auto;
    top: 0;
    width: 100%;
    border-radius: 20px;
  }
  .secEnContents_kv.reverse {
    left: auto;
  }
}

/* secEnContents_inner --------------- */
.secEnContents_inner:has(h2) {
  min-height: 33.8vw;
  display: flex;
  flex-direction: column;
}
.secEnContents_kv.reverse + .secEnContents_inner:has(h2) {
  margin-left: 52.8%;
}
#sec-technology .secEnContents_kv.reverse + .secEnContents_inner:has(h2) {
  justify-content: flex-end;
}
#sec-solution .secEnContents_kv.reverse + .secEnContents_inner:has(h2) {
  justify-content: center;
  min-height: 28.6vw;
}
.secEnContents_inner:not(:has(h2)) {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 80px;
}
.secEnContents_inner.around:not(:has(h2)) {
  display: block;
  text-align: center;
}
#sec-technology .secEnContents_inner.around:not(:has(h2)) {
  margin-top: 200px;
}
.secEnContents_inner.case:not(:has(h2)) {
  align-items: center;
  margin-top: 50px;
}
@media screen and (max-width: 979px) {
  .secEnContents_inner:has(h2),
  .secEnContents_kv.reverse + .secEnContents_inner:has(h2),
  #sec-solution .secEnContents_kv.reverse + .secEnContents_inner:has(h2),
  .secEnContents_inner:not(:has(h2)),
  #sec-technology .secEnContents_inner.around:not(:has(h2)),
  .secEnContents_inner.case:not(:has(h2)) {
    min-height: auto;
    display: block;
    margin: 45px 0 0;
  }
  .secEnContents_inner:not(:has(h2)) {
    margin-top: 35px;
  }
}

/* secEnContents_title */ 
.secEnContents_title {
  position: relative;
  margin-bottom: 55px;
  font-size: 70px;
  line-height: 1;
  z-index: 1;
}
@media screen and (max-width: 979px) {
  .secEnContents_title {
    margin-bottom: 35px;
    font-size: 50px;
  }
}
@media screen and (max-width: 374px) {
  .secEnContents_title {
    font-size: 13.33vw;
  }
}

/* colText */ 
.secEnContents .colText {
  position: relative;
  width: 47.2%;
  z-index: 1;
}
.secEnContents_kv.reverse + .secEnContents_inner:has(h2) .colText {
  width: 100%;
}
@media screen and (max-width: 979px) {
  .secEnContents .colText {
    width: 100%;
    margin-top: 40px;
  }
  .secEnContents_inner:has(h2) .colText {
    margin-top: 35px;
  }
  .secEnContents_inner.case .colText {
    margin-top: 26px;
  }
}

/* colText_title */ 
.secEnContents .colText_title {
  font-size: 30px;
  font-weight: 200;
}
@media screen and (max-width: 979px) {
  .secEnContents .colText_title {
    margin-bottom: 25px;
    font-size: 25px;
    line-height: 1.2;
  }
  #sec-product.secEnContents .secEnContents_inner + .colText_title {
    margin-top: 40px;
  }
}

#wrapper .secEnContents p {
  position: relative;
  font-size: 16px;
  line-height: 1.75;
  z-index: 1;
  text-align: justify;
}
@media screen and (max-width: 979px) {
  #wrapper .secEnContents p {
    font-size: 14px;
  }
}

/* colText_img */ 
.secEnContents .colText_img {
  margin: 110px auto 0;
  border-radius: 30px;
  overflow: hidden;
}
.secEnContents .colText_img.w-250 {
  width: 250px;
}
#sec-solution.secEnContents .colText_img.w-250 {
  display: inline-block;
  width: 19.5vw;
  max-width: 250px;
  margin: 0 3.125vw;
  vertical-align: middle;
}
.secEnContents .colText_img.w-350 {
  display: inline-block;
  width: 27.34vw;
  max-width: 350px;
  margin: 0 3.125vw;
}
#sec-technology.secEnContents .colText_img.w-350 {
  vertical-align: top;
  transform: translateY(-50%);
}
@media screen and (max-width: 979px) {
  .secEnContents .colText_img {
    margin: 35px 0 0 !important;
    border-radius: 20px;
    width: 100% !important;
  }
  .secEnContents_inner > .colText_img:first-of-type {
    margin-top: -10px !important;
  }
  #sec-product.secEnContents > .colText_img:first-of-type {
    margin: 0 0 45px !important;
  }
  .secEnContents .colText_img.w-350 {
    width: 100%;
    max-width: none;
  }
  #sec-technology.secEnContents .colText_img.w-350 {
    transform: translateY(0);
  }
}

/* fadeInUp */
@media screen and (min-width: 980px) {
  .fadeInUp {
    opacity: 0;
    transform: translateY(25%);
    backface-visibility: hidden;
  }
  #sec-technology.secEnContents .w-350.fadeInUp {
    transform: translateY(-25%);
  }
  .fadeInUp.is-animate {
    opacity : 1;
    transform: translateY(0);
    transition: transform 1.2s ease 0.2s;
  }
  #sec-technology.secEnContents .w-350.fadeInUp.is-animate {
    transform: translateY(-50%);
  }
}

/* colVideo */ 
.colVideo {
  position: relative;
  width: 47.2%;
  aspect-ratio: 16/9;
  border-radius: 30px;
  overflow: hidden;
  flex-shrink: 0;
}
#sec-technology.secEnContents .colText_img.w-350 + .colVideo,
#sec-solution.secEnContents .colText_img.w-250 + .colVideo {
  display: inline-block;
  margin: 0 3.125vw;
}
#sec-solution.secEnContents .colText_img.w-250 + .colVideo {
  vertical-align: middle;
}
@media screen and (max-width: 979px) {
  .colVideo {
    width: 100%;
    margin: 35px 0 0 !important;
    border-radius: 20px;
  }
  #sec-solution .secEnContents_inner.around > .colVideo {
    margin-top: 0px !important;
  }
}

.colVideo iframe,
.colVideo video {
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  border: none;
  cursor: pointer;
}

/* case_title */ 
.secEnContents .case_title {
  font-size: 26px;
  font-weight: 300;
}

/* movie */ 
 .ytmovie {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  border: none;
}

.thumb {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  cursor: pointer;
}


/* techWrap --------------- */
#wrapper section.topSection div.techWrap {
  padding-bottom: 160px;
}
@media screen and (max-width: 979px) {
  #wrapper section.topSection div.techWrap {
    padding-bottom: 100px;
  }
}


/* contactWrap ============================= */
#wrapper section.topSection div.contactWrap {
  height: auto;
}
#wrapper section.topSection div.contactWrap::before {
  width: 73.4%;
  height: 425px;
  left: auto;
  top: 0;
  transform: none;
  border-radius: 70px 0 0 0;
  z-index: -1;
}
@media screen and (max-width: 979px) {
  #wrapper section.topSection div.contactWrap {
    height: auto;
  }
  #wrapper section.topSection div.contactWrap::before {
    height: 240px;
    margin: 0;
    border-radius: 20px 0 0 0;
  }
}

/* img --------------- */
#wrapper section.topSection div.contactWrap p.img {
  padding: 0;
  top: 0;
  width: 332px;
  transform: translateY(-90px);
}
#wrapper section.topSection div.contactWrap p.img img {
  width: 100%;
}
@media screen and (max-width: 979px) {
  #wrapper section.topSection div.contactWrap p.img {
    width: 113px;
    height: auto;
    transform: translateY(-45px);
  }
}

/* inner --------------- */
#wrapper section.topSection div.contactWrap div.inner {
  margin-left: 26.6%;
  padding: 65px 400px 0 65px;
}
@media screen and (max-width: 979px) {
  #wrapper section.topSection div.contactWrap div.inner {
    margin: 0;
    padding: 25px 8.5% 0;
    width: 100%;
    justify-content: center;
  }
}

/* contactBtn */
#wrapper section.topSection div.contactWrap h2 {
  display: inline-block;
  padding: 0 0 40px;
  font-size: 70px;
  line-height: 1;
}
@media screen and (max-width: 979px) {
  #wrapper section.topSection div.contactWrap h2 {
    padding-bottom: 10px;
    font-size: 50px;
  }
}
@media screen and (max-width: 374px) {
  #wrapper section.topSection div.contactWrap h2 {
    font-size: 40px;
  }
}

/* contactText */ 
#wrapper p.contactText {
  font-size: 16px;
  line-height: 1.78;
}
@media screen and (max-width: 979px) {
  #wrapper p.contactText {
    font-size: 12px;
  }
}

/* c-contact__form */
.c-contact__form.site-top {
  width: 86%;
  max-width: 1400px;
  margin-top: 60px;
}
@media screen and (max-width: 979px) {
  .c-contact__form.site-top {
    margin-top: 25px;
  }
}


/* snsWrap ============================= */
#wrapper section.topSection div.snsWrap {
  padding: 60px 0 45px;
}

#wrapper section.topSection div.snsWrap ul {
  margin-top: 15px;
}
@media screen and (max-width: 979px) {
  #wrapper section.topSection div.snsWrap ul {
    margin-top: 10px;
  }
}

#wrapper section.topSection div.snsWrap ul li {
  margin: 0 15px;
}

#wrapper section.topSection div.snsWrap ul li a {
  background: #000;
  padding: 0;
}

@media screen and (max-width: 979px) {
  #wrapper section.topSection div.snsWrap ul li a img {
    width: 60px;
    height: 60px;
  }
}



/* secEnContents_inner technology ============================= */

.secEnContents_inner.technology {
  flex-wrap: wrap;
  margin-top: 120px;
}
.secEnContents_inner.technology .colText_title {
  width: 100%;
  flex-shrink: 0;
}
.secEnContents_inner.technology .colText_img {
  margin-top:60px;
}

.txt-technology {
  margin-top: 60px;
  width: 100%;
}

.list-technology {
  margin-top: 40px;
  display: flex;
  justify-content: space-between;
}
.list-technology > li {
  border-radius: 30px;
  overflow: hidden;
  background-color: #000;
  width: calc((100% - 60px) / 3);
}
.list-technology > li dl {
  padding: 30px;
}
.list-technology > li dt {
  font-size: 18px;
  font-weight: 500;
}
.list-technology > li dd {
  margin-top: 10px;
  font-size: 16px;
}

.secEnContents_inner.technology .colVideo {
  width: 100%;
  margin-top: 60px;
}