@charset "UTF-8";
.u-features-overflow {
  overflow: hidden;
}

.lity {
  background: rgba(0, 0, 0, 0.4) !important;
}

.p-features_link {
  position: relative;
  z-index: 1;
}

.p-features__menu {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px 0px;
  width: 100%;
  margin-bottom: 60px;
  z-index: 1;
  position: relative;
}

@media screen and (max-width: 767px) {
  .p-features__menu {
    justify-content: space-between;
    gap: 10px 0px;
    margin-bottom: 5%;
  }
}
.p-features__menu::before {
  content: "";
  display: block;
  width: 240px;
  order: 1;
}

.p-features__menu::after {
  content: "";
  display: block;
  width: 240px;
}

.p-features__menu li {
  width: 240px;
  /* 4カラム以上になったとき */
  /* width: 320px; */
  /* 3カラム以下になったとき */
  height: 48px;
}

@media screen and (max-width: 767px) {
  .p-features__menu li {
    width: 49%;
  }
}
.p-features__menu li a {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  /* color: #fff; */
  font-size: 1.6rem;
  /* background-color: #843184; */
  position: relative;
  transition: all 0.5s;
}

@media screen and (max-width: 767px) {
  .p-features__menu li a {
    font-size: 1.25rem;
    width: auto;
    padding: 0 30px;
    line-height: 1.2;
    text-align: center;
  }
}
.p-features__menu li.nav01 a span::before {
  content: "クレーン選定";
}

@media screen and (max-width: 767px) {
  .p-features__menu li.nav02 a span::before {
    content: "クレーン配置・\a揚重検討";
    white-space: pre;
  }
}
@media screen and (min-width: 768px) {
  .p-features__menu li.nav02 a span::before {
    content: "クレーン配置・揚重検討";
  }
}
.p-features__menu li.nav03 a span::before {
  content: "施工ステップ図";
}

.p-features__menu li.nav04 a span::before {
  content: "外部連携・出力";
}

.p-features__menu li a::after {
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  top: 50%;
  right: 10px;
  margin: auto;
  border: 2px solid #000;
  border-width: 2px 2px 0 0;
  transform: translateY(-50%) rotate(135deg);
}

@media screen and (max-width: 767px) {
  .p-features__menu li a::after {
    width: 5px;
    height: 5px;
    right: 10px;
  }
}
.p-features__menu li a span::after {
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  top: 50%;
  right: 10px;
  margin: auto;
  border: 2px solid #fff;
  border-width: 2px 2px 0 0;
  transform: translateY(-50%) rotate(135deg);
  transition: 0.8s;
  opacity: 0;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .p-features__menu li a span::before {
    font-size: 1.25rem;
  }
  .p-features__menu li a span::after {
    width: 5px;
    height: 5px;
    right: 10px;
  }
}
.p-features__menu li a:hover span::after {
  opacity: 1;
}

.p-features-wrap {
  position: relative;
}

.p-features {
  margin-top: 100px;
  padding: 0;
}

@media screen and (max-width: 767px) {
  .p-features {
    margin-top: 15%;
  }
}
.p-features__list-wrap {
  margin: 0;
  padding: 0 54px;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
  .p-features__list-wrap .p-features__list:nth-child(3n+1) {
    margin-left: 0;
  }
  .p-features__list-wrap .p-features__list:nth-child(-n+3) {
    margin-top: 0;
  }
}
.p-features__list-wrap .p-features__list {
  width: 31%;
  margin: 30px 0 0 3.5%;
}
.p-features__list-wrap .p-features__list .p-features__list-img {
  width: 100%;
}
.p-features__list-wrap .p-features__list .p-features__list-img-box {
  position: relative;
  overflow: hidden;
  border: 1px solid #ccc;
}
.p-features__list-wrap .p-features__list .p-features__list-img-box .p-features__list-img {
  transition: 0.3s;
}
.p-features__list-wrap .p-features__list .p-features__list-img-box:after {
  transition: 0.2s;
  opacity: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: url(../img/movie/icon_play.svg);
}
.p-features__list-wrap .p-features__list .p-features__list-img-box.p-features__img_navisworks:after {
  content: url(../img/movie/icon_play-white.svg);
}
.p-features__list-wrap .p-features__list .p-features__list-name-box {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin: 15px 0 10px;
}
.p-features__list-wrap .p-features__list .p-features__list-name-box .left-box {
  width: 77%;
}
.p-features__list-wrap .p-features__list .p-features__list-name-box .right-box {
  width: 23%;
  margin-top: 3px;
}
.p-features__list-wrap .p-features__list .p-features__list-name {
  font-size: 2rem;
  color: #000;
  font-weight: 700;
}
.p-features__list-wrap .p-features__list .p-features__list-time {
  background-color: #dbdbdb;
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  font-weight: 300;
  font-size: 1.4rem;
  padding: 2px 0;
}
.p-features__list-wrap .p-features__list .p-features__list-txt {
  text-align: justify;
}
@media screen and (min-width: 768px) {
  .p-features__list-wrap .p-features__list:hover .p-features__list-img-box .p-features__list-img {
    transform: scale(1.2);
  }
}

@media screen and (max-width: 767px) {
  .p-features__list-wrap {
    margin: 0;
    padding: 0;
    display: block;
  }
  .p-features__list-wrap .p-features__list {
    width: 100%;
    margin: 30px 0 0 0;
  }
  .p-features__list-wrap .p-features__list a {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    border: 1px solid #00adb0;
    background: #fff;
  }
  .p-features__list-wrap .p-features__list .p-features__list-img-box {
    width: 40%;
    overflow: hidden;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
  }
  .p-features__list-wrap .p-features__list .p-features__list-img-box .p-features__list-img {
    display: none;
  }
  .p-features__list-wrap .p-features__list .p-features__list-img-box:after {
    opacity: 1;
    content: url(../img/movie/icon_play-dark.svg);
  }
  .p-features__list-wrap .p-features__list .p-features__img-kensaku {
    background-image: url(../img/features/img_kensaku.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_haichi-ido {
    background-image: url(../img/features/img_haichi-ido.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img-custom {
    background-image: url(../img/features/img_custom.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img-spec {
    background-image: url(../img/features/img_spec.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_tsurini {
    background-image: url(../img/features/img_tsurini.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_heimen-sosa {
    background-image: url(../img/features/img_heimen-sosa.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_danmen-hani {
    background-image: url(../img/features/img_danmen-hani.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_secchi {
    background-image: url(../img/features/img_secchi.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_hani {
    background-image: url(../img/features/img_hani.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_shizai {
    background-image: url(../img/features/img_shizai.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_alert {
    background-image: url(../img/features/img_alert.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_keiro {
    background-image: url(../img/features/img_keiro.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_check {
    background-image: url(../img/features/img_check.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_tawami {
    background-image: url(../img/features/img_tawami.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_nini {
    background-image: url(../img/features/img_nini.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img-step {
    background-image: url(../img/features/img_step.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_navisworks {
    background-image: url(../img/features/img_navisworks.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__list-img-box.p-features__img_navisworks:after {
    opacity: 1;
    content: url(../img/movie/icon_play-white_samll.svg);
  }
  .p-features__list-wrap .p-features__list .p-features__img_pdf {
    background-image: url(../img/features/img_pdf.jpg);
  }
  .p-features__list-wrap .p-features__list .p-features__list-inner {
    width: 60%;
    padding: 2.5%;
  }
  .p-features__list-wrap .p-features__list .p-features__list-name-box {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 0 0 2.5%;
  }
  .p-features__list-wrap .p-features__list .p-features__list-name {
    font-size: 1.5rem;
  }
  .p-features__list-wrap .p-features__list .p-features__list-time {
    font-size: 1.1rem;
  }
  .p-features__list-wrap .p-features__list .p-features__list-txt {
    text-align: justify;
    font-size: 1.4em;
  }
}
.p-features-movie__box {
  position: relative;
  z-index: 0;
}

@media screen and (max-width: 767px) {
  .p-features-movie {
    margin-top: 15%;
  }
  .p-features-movie__box {
    margin: 0 auto 20%;
  }
  .p-features-movie__container {
    margin: 0 auto 0;
  }
}
.p-top-feature__bg--gray1 {
  top: 110px;
  left: -378px;
  opacity: 0.4;
}

@media screen and (max-width: 767px) {
  .p-top-feature__bg--gray1,
  .p-top-feature__bg--gray2,
  .p-top-feature__bg--black,
  .p-top-feature__bg--purple,
  .p-top-feature__bg--green {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .lity-youtube .lity-container {
    width: 90%;
  }
}/*# sourceMappingURL=features2601.css.map */