img {
  width: 100%;
  height: auto;
}
.pc {
  display: none;
}
.sp-only {
  pointer-events: auto;
}
.fancybox-title-over {
  display: none !important;
}
/* TOP */
.top-head {
  position: relative;
  .mv-wrap {
    width: 100%;
    aspect-ratio: 400 / 120;
    img {
      width: 100%;
    }
  }
  .top-page-title {
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    position: absolute;
    bottom: 16px;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
  }
}
.about-enechita {
  padding-top: 60px;
  padding-bottom: 80px;
  .l-inner {
    max-width: 1000px;
  }
}
.about-enechita-menu {
  display: flex;
  flex-direction: column;
  gap: 20px;
  .about-enechita-menu-item {
    a {
      /* ───────── 共通スタイル ───────── */
      position: relative;
      display: block;
      width: 100%;
      aspect-ratio: 360 / 140;
      color: #fff;
      font-size: 20px;
      font-weight: 600;
      text-align: center;
      align-content: center;
      border-top: 4px solid #ff5a00;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      /* 初期：黒 30 % のオーバーレイを前面に重ねる */
      background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3));
      transition: background-image 0.3s ease-out, font-size 0.3s ease-out;

      /* ───────── 画像別のバリエーション ───────── */
      &.topmessage {
        background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
          url("../img/about-enechita/top/topmessage-bk.jpg");

        &:hover {
          background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
            url("../img/about-enechita/top/topmessage-bk.jpg");
        }
      }

      &.company {
        background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
          url("../img/about-enechita/top/company-bk.jpg");

        &:hover {
          background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
            url("../img/about-enechita/top/company-bk.jpg");
        }
      }

      &.history {
        background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
          url("../img/about-enechita/top/history-bk.jpg");

        &:hover {
          background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
            url("../img/about-enechita/top/history-bk.jpg");
        }
      }

      &.jinzai {
        background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
          url("../img/about-enechita/top/jinzai-bk.jpg");

        &:hover {
          background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
            url("../img/about-enechita/top/jinzai-bk.jpg");
        }
      }

      &.number {
        background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
          url("../img/about-enechita/top/number-bk.jpg");

        &:hover {
          background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
            url("../img/about-enechita/top/number-bk.jpg");
        }
      }

      &.goal {
        background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
          url("../img/about-enechita/top/goal-bk.jpg");

        &:hover {
          background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
            url("../img/about-enechita/top/goal-bk.jpg");
        }
      }

      /* ───────── 共通ホバー効果（文字を 10 % 拡大）───────── */
      &:hover {
        font-size: 22px;
      }
    }
  }
}

/* 下層ページ共通 */
.about-enechita-inner {
  padding-bottom: 100px;
}
.page-head {
  margin-bottom: 40px;
}
.page-title {
  height: 60px;
  background: linear-gradient(#ff5a00 0%, #ffa700 100%);
  color: #fff;
  padding: 0 20px;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.1em;
  align-content: center;
}
.about-ttl {
  font-size: 24px;
  font-weight: 600;
  color: #ff5a00;
  border-bottom: 1px solid #ff5a00;
  padding-bottom: 10px;
  margin-bottom: 28px;
  line-height: 1.5;
}
.about-subttl {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.5;
  padding-left: 16px;
  padding-top: 4px;
  padding-bottom: 4px;
  border-left: 6px solid #ff5a00;
  margin-bottom: 28px;
}
.main-contents {
  padding: 0 0 100px;
}

/* サイドバー */
.sidebar {
  width: 88.88889%;
  margin-left: auto;
  margin-right: auto;
  .sidebar-ttl {
    font-size: 20px;
    font-weight: 600;
    color: #000;
    padding-bottom: 15px;
    border-bottom: 3px solid #fc6e25;
    padding-left: 12px;
  }
  .about-sidebar {
    .about-sidebar-item {
      height: 54px;
      border-bottom: 1px solid #cccccc;

      a {
        display: block;
        line-height: 54px;
        color: #000;
        font-size: 16px;
        padding-left: 32px;
        position: relative;
        &.active {
          color: #ff5a00;
        }
        &:hover {
          color: #ff5a00;
          opacity: 1;
        }
        &::before {
          content: "";
          width: 16px;
          height: 16px;
          background: #fe7814;
          border-radius: 50%;
          position: absolute;
          left: 10px;
          top: 0;
          bottom: 0;
          margin: auto 0;
        }
      }
    }
  }
}
/* トップメッセージ */
.message-section {
  padding: 0 0 30px;
  .txt-wrap {
    margin-bottom: 40px;
    p {
      font-size: 16px;
      line-height: 1.7;
      &:not(:last-child) {
        margin-bottom: 30px;
      }
    }
  }
  .img-wrap {
    text-align: center;
    img {
      width: 280px;
    }
    p {
      text-align: center;
      margin-top: 16px;
      font-size: 16px;
    }
  }
}
.logo-section {
  padding: 30px 0;
  .logo {
    margin-bottom: 28px;
    img {
      width: 100%;
    }
  }
  .desc {
    p {
      font-size: 16px;
      line-height: 1.7;
      padding-left: 60px;
      position: relative;
      &.orange {
        color: #000;
        margin-bottom: 28px;
        &::before {
          content: "";
          width: 40px;
          height: 40px;
          background: #ff5a00;
          border-radius: 50%;
          position: absolute;
          left: 0;
          top: 0;
          bottom: 0;
          margin: auto 0;
        }
      }
      &.green {
        color: #000;
        &::before {
          content: "";
          width: 40px;
          height: 40px;
          background: #33ad33;
          border-radius: 50%;
          position: absolute;
          left: 0;
          top: 0;
          bottom: 0;
          margin: auto 0;
        }
      }
    }
  }
}
.vision-section {
  padding: 30px 0 0;
  img {
    width: 100%;
  }
  .popup {
    margin-top: 14px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    svg {
      margin-right: 4px;
    }
    span {
      font-size: 16px;
    }
  }
}

/* 会社概要 */
.gaiyou-section {
  padding-bottom: 30px;
  .gaiyou-contents {
    position: relative;
    .map {
      position: absolute;
      top: 0;
      right: 0;
      width: 38.88888%;
      height: auto;
    }
    table {
      tr {
        display: flex;
        flex-direction: column;
        &:nth-child(1) {
          th {
            border-top: 1px solid #a2a2a2;
          }
        }
        th {
          padding: 20px 10px 6px;
          text-align: left;
          color: #ff5a00;
          font-size: 16px;
          font-weight: 600;
          line-height: 1;
          font-size: 16px;
          &.top {
            border-top: 1px solid #a2a2a2;
          }
        }
        td {
          padding: 2px 10px 16px;
          border-bottom: 1px solid #a2a2a2;
          line-height: 1.375;
          font-size: 16px;
          &.address {
            padding-right: 44%;
            border-bottom: none;
          }
          p {
            font-size: 16px;
            line-height: 1.7;
          }
          .business-list {
            margin-top: 24px;
            .business-item {
              &:not(:last-child) {
                margin-bottom: 24px;
              }
              .business-ttl {
                font-size: 16px;
                font-weight: 600;
                line-height: 1.7;
                padding-left: 24px;
                position: relative;
                &::before {
                  content: "";
                  width: 14px;
                  height: 14px;
                  background: #fe7814;
                  position: absolute;
                  left: 0;
                  top: 0;
                  bottom: 0;
                  margin: auto 0;
                  border-radius: 50%;
                }
              }
            }
          }
        }
      }
    }
  }
}
.map-section {
  padding-top: 30px;
  .google-map {
    margin-bottom: 20px;
    iframe {
      width: 100%;
      aspect-ratio: 360 / 200;
      height: auto;
    }
  }
}

/* 会社の歩み */
.history-section {
  .history-head {
    margin-bottom: 40px;
    .txt {
      font-size: 16px;
      line-height: 1.7;
    }
  }
  .history-contents {
    position: relative;
    &::before {
      content: "";
      position: absolute;
      left: 86px;
      top: 60px;
      width: 4px;
      height: calc(100% - 60px);
      background: #ededed;
      z-index: -1;
    }
    .history-block {
      display: flex;
      align-items: center;
      justify-content: space-between;
      &:not(:last-child) {
        margin-bottom: 12px;
      }
      .history-year {
        flex: 0 0 80px;
        min-width: 0;
        .year {
          font-size: 28px;
          font-weight: 600;
          font-family: "Oswald", sans-serif;
        }
      }
      .history-circle {
        flex: 0 0 54px;
        min-width: 0;
      }
      .history-detail {
        flex: 1;
        min-width: 0;
        background: #fff4c4;
        padding: 12px 20px;
        position: relative;
        &::after {
          content: "";
          width: 0;
          height: 0;
          border-style: solid;
          border-top: 8px solid transparent;
          border-bottom: 8px solid transparent;
          border-right: 18px solid #fff4c4;
          border-left: 0;
          position: absolute;
          left: -18px;
          top: 0;
          bottom: 0;
          margin: auto 0;
        }
        img {
          width: 100px;
          margin-bottom: 10px;
        }
        .txt {
          font-size: 16px;
          line-height: 1.7;
          &:not(:last-child) {
            margin-bottom: 10px;
          }
        }
      }
    }
    .history-comment {
      margin-bottom: 12px;
      border: 2px solid #fe7814;
      padding: 12px 20px;
      background: #fff;
      display: flex;
      align-items: center;
      .txt {
        font-size: 16px;
        color: #fe7814;
        line-height: 1.2;
        font-weight: 600;
      }
      img {
        width: 60px;
        margin-right: 10px;
      }
    }
  }
}

/* 人材戦略 */
.jinzai-section {
  .jinzai-head {
    margin-bottom: 48px;
    p {
      font-size: 16px;
      line-height: 1.7;
    }
  }
  .jinzai-contents {
    .jinzai-list {
      .jinzai-item {
        &:not(:last-child) {
          margin-bottom: 28px;
        }
        .jinzai-item-ttl {
          display: flex;
          align-items: center;
          margin-bottom: 10px;
          img {
            width: 48px;
            height: 48px;
            margin-right: 12px;
          }
          span {
            font-size: 18px;
            color: #ff5a00;
            font-weight: 600;
          }
        }
        .txt {
          font-size: 16px;
          line-height: 1.7;
        }
        .kensyu-list {
          .kensyu-item {
            display: flex;
            padding-bottom: 18px;
            border-bottom: 1px solid #ccc;
            &:nth-child(1) {
              padding-top: 10px;
            }
            &:not(:first-child) {
              padding-top: 18px;
            }
            img {
              width: 44.444444%;
              height: 44.444444%;
              margin-right: 20px;
            }
            .kensyu-item-text-wrap {
              .kensyu-ttl {
                font-size: 16px;
                font-weight: 600;
                line-height: 1.7;
                margin-bottom: 6px;
              }
              .kensyyu-txt {
                font-size: 14px;
                line-height: 1.6;
              }
            }
          }
        }
        .jinzai-item-contents {
          img {
            margin-bottom: 20px;
          }
          .jinzai-item-text-wrap {
            .txt {
              font-size: 16px;
              line-height: 1.7;
            }
            .shisei-list {
              margin-top: 20px;
              .shise-item {
                .txt {
                  font-size: 16px;
                  font-weight: 600;
                  line-height: 1.7;
                  text-indent: -1.4em;
                  padding-left: 1.4em;
                }
              }
            }
          }
          .welfare-list {
            .welfare-item {
              &:not(:last-child) {
                margin-bottom: 20px;
              }
              .welfare-item-ttl {
                font-size: 16px;
                font-weight: 600;
                line-height: 1.7;
                padding-left: 22px;
                position: relative;
                &::before {
                  content: "";
                  background: #fe7814;
                  width: 14px;
                  height: 14px;
                  position: absolute;
                  top: 0;
                  bottom: 0;
                  left: 0;
                  margin: auto 0;
                  border-radius: 50%;
                }
              }
              .welfare-txt {
                font-size: 16px;
                line-height: 1.7;
                padding-left: 22px;
              }
            }
          }
        }
      }
    }
  }
}
/* 日本一の会社へ */
.goal-shisei-section {
  padding-bottom: 30px;
  .txt {
    font-size: 16px;
    line-height: 1.7;
    span {
      font-weight: 600;
      box-shadow: inset 0 -6px 0 #ffff00;
    }
  }
}
.goal-toJapan-section {
  padding-top: 30px;
  .txt {
    font-size: 16px;
    line-height: 1.7;
  }
  .img-wrap {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    img {
      width: 100%;
    }
  }
}

@media screen and (min-width: 768px) {
  .sp {
    display: none;
  }
  .pc {
    display: block;
  }
  .sp-only {
    pointer-events: none;
  }
  /* TOP */
  .top-head {
    .mv-wrap {
      aspect-ratio: 1366 / 280;
    }
    .top-page-title {
      font-size: 40px;
      bottom: 36px;
    }
  }
  .about-enechita {
    padding-top: 80px;
    padding-bottom: 100px;
  }
  .about-enechita-menu {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0;
    justify-content: space-between;
    margin-top: -56px;
    .about-enechita-menu-item {
      width: calc((100% - 8%) / 2);
      margin-top: 56px;
    }
  }

  /* 下層共通 */
  .main-contents {
    padding-top: 52px;
  }
  .page-head {
    margin-bottom: 60px;
  }
  .page-title {
    height: 62px;
    font-size: 32px;
    padding-left: 40px;
  }
  .about-ttl {
    margin-bottom: 40px;
  }
  .about-subttl {
    line-height: 1.7;
    padding-left: 20px;
    padding-top: 3px;
    padding-bottom: 3px;
    margin-bottom: 24px;
  }

  /* トップメッセージ */
  .message-section {
    padding-bottom: 40px;
  }
  .message-contents {
    display: flex;
    justify-content: space-between;
    .txt-wrap {
      width: 63%;
      margin-bottom: 0;
    }
    .img-wrap {
      width: 30.4347826%;
      img {
        width: 100%;
      }
    }
  }
  .logo-section {
    padding: 40px 0;
  }
  .logo-contents {
    display: flex;
    justify-content: space-between;
    .logo {
      width: 36.9565217%;
      margin-bottom: 0;
    }
    .desc {
      width: 56.63%;
    }
  }
  .vision-section {
    padding: 40px 0 0;
    .popup {
      display: none;
    }
  }

  /* 会社概要 */
  .page-id-7390 .page-head {
    margin-bottom: 40px;
  }
  .gaiyou-section {
    padding-bottom: 40px;
    .gaiyou-contents {
      .map {
        right: 20px;
        width: 22.3%;
      }
      table {
        tr {
          &:nth-child(1) {
            td {
              border-top: 1px solid #d9d9d9;
            }
          }
          display: table-row;
          th {
            width: 26%;
            display: table-cell;
            border-bottom: 1px solid #a2a2a2;
            line-height: 1;
            padding: 28px 20px;
          }
          td {
            width: 74%;
            display: table-cell;
            border-bottom: 1px solid #d9d9d9;
            padding: 0 20px 22px;
            line-height: 1.7;
            &.address {
              border-bottom: 1px solid #d9d9d9;
              padding-right: 0;
            }
          }
        }
      }
    }
  }
  .map-section {
    padding-top: 40px;
    .google-map {
      margin-bottom: 24px;
      iframe {
        aspect-ratio: 920 / 400;
      }
    }
  }

  /* 会社の歩み */
  .history-section {
    .history-head {
      margin-bottom: 60px;
    }
    .history-contents {
      max-width: 740px;
      margin: 0 auto;
      &::before {
        top: 50px;
        height: calc(100% - 50px);
      }
      .history-block {
        .history-detail {
          display: flex;
          align-items: center;
          img {
            margin-bottom: 0;
            margin-right: 20px;
          }
          .txt {
            &:not(:last-child) {
              margin-bottom: 0;
            }
          }
        }
      }
      .history-comment {
        display: inline-flex;
      }
    }
  }

  /* 人材戦略 */
  .jinzai-section {
    .about-ttl {
      margin-bottom: 24px;
    }
    .jinzai-contents {
      .jinzai-list {
        .jinzai-item {
          &:not(:last-child) {
            margin-bottom: 36px;
          }
          .txt {
            padding-left: 62px;
          }
          .kensyu-list {
            padding-left: 62px;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            gap: 38px 0;
            .kensyu-item {
              width: 30.23%;
              flex-direction: column;
              padding-bottom: 0;
              border-bottom: none;
              &:nth-child(1) {
                padding-top: 0;
              }
              &:not(:first-child) {
                padding-top: 0;
              }
              img {
                width: 100%;
                height: auto;
                margin-right: 0;
                margin-bottom: 16px;
              }
              .kensyu-item-text-wrap {
                .kensyu-ttl {
                  margin-bottom: 0;
                  text-align: center;
                  margin-bottom: 6px;
                }
              }
            }
          }
          .jinzai-item-contents {
            padding-left: 62px;
            display: flex;
            align-items: center;
            img {
              width: 46.5%;
              height: 46.5%;
              margin-right: 4.65%;
              margin-bottom: 0;
            }
            .jinzai-item-text-wrap {
              .txt {
                padding-left: 0;
              }
              .shisei-list {
                .shise-item {
                  .txt {
                    text-indent: -1.4em;
                    padding-left: 1.4em;
                  }
                }
              }
            }
          }
        }
      }
    }
  }

  /* 数字で見るエネチタ */
  .number-section .px_numbers__grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas:
      "item1 item1"
      "item2 item3"
      "item4 item5"
      "item6 item7"
      "item8 item8"
      "item9 item10"
      "item11 item12"
      "item13 item14"
      "item15 .";
  }

  /* 日本一の会社へ */
  .goal-toJapan-section {
    .img-wrap {
      margin-top: 60px;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 40px 0;
      justify-content: space-between;
      img {
        width: 47.82%;
        height: 47.82%;
        &.mynavi {
          width: 282px;
        }
      }
    }
  }
}
@media screen and (max-width: 399px) {
  /* 会社の歩み */
  .history-section .history-contents {
    &::before {
      left: 74px;
      height: calc(100% - 50px);
    }
    .history-block {
      .history-year {
        flex: 0 0 68px;
      }
      .history-circle {
        flex: 0 0 44px;
      }
      .history-detail {
        padding: 12px;
      }
    }
  }
}
@media screen and (min-width: 768px) and (max-width: 999px) {
  .page-head {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: 88.28125%;
  }
}
@media screen and (min-width: 768px) and (max-width: 910px) {
  .gaiyou-section {
    .gaiyou-contents {
      table {
        tr {
          td {
            &.address {
              padding-right: 28%;
            }
          }
        }
      }
    }
  }
}

@media screen and (min-width: 1000px) {
  .bread {
    .l-inner {
      width: 100%;
      max-width: 1226px;
      padding: 0 20px;
    }
  }
  .about-enechita-inner {
    display: flex;
    justify-content: space-between;
    max-width: 1226px;
    margin: 0 auto;
    padding: 0 20px;
    align-items: flex-start;
    .main-contents {
      width: 75%;
      .l-inner {
        width: 100%;
      }
    }
    .sidebar {
      width: 20%;
      position: sticky;
      top: 210px;
      margin: 0;
      .sidebar-ttl {
        font-size: 22px;
        font-weight: 400;
        padding-left: 0;
        padding-bottom: 10px;
        margin-bottom: 25px;
      }
      .about-sidebar {
        .about-sidebar-item {
          border-bottom: none;
          height: auto;
          &:not(:last-child) {
            margin-bottom: 24px;
          }
          a {
            line-height: 1;
            padding-left: 25px;
            &::before {
              width: 14px;
              height: 14px;
              left: 0;
            }
          }
        }
      }
    }
  }

  /* 会社概要 */
  .gaiyou-section {
    .gaiyou-contents {
      table {
        tr {
          td {
            &.address {
              padding-right: 24%;
            }
          }
        }
      }
    }
  }
}
