/*! Writen  by SCSS */
@media screen and (max-width: 750px) {
  .vpc750 {
    display: none; } }
@media not screen, screen and (min-width: 751px) {
  .vsp750 {
    display: none; } }
@media screen and (max-width: 750px) {
  .vpc750 {
    display: none; } }

.vsp750 {
  display: none; }
  @media screen and (max-width: 750px) {
    .vsp750 {
      display: block; } }

.inner_main {
  margin-bottom: 0; }

.bg_wrap {
  background-image: url("../img/equipment/04/bg.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: #67747c;
  font-feature-settings: "palt"; }

.bg_item01 {
  position: relative; }
  .bg_item01 .bg_ico01 {
    position: absolute;
    width: calc(217%/16);
    left: calc(30%/16);
    top: calc(15%/2.56);
    animation: fluffy2 1.2s ease-in-out infinite alternate; }
  .bg_item01 .bg_ico02 {
    position: absolute;
    width: calc(270%/16);
    right: calc(125%/16);
    top: calc(22%/2.56);
    animation: fluffy2 1.2s ease-in-out infinite alternate; }

.bg_item02 {
  position: relative; }
  @media screen and (max-width: 750px) {
    .bg_item02 {
      width: calc(100% - 40px);
      margin: 0 auto; } }
  .bg_item02 .bg_ico03 {
    position: absolute;
    width: calc(339%/16);
    left: 0;
    top: calc(-360%/5.2);
    animation: fluffy2 1.2s ease-in-out infinite alternate; }
  .bg_item02 .bg_ico04 {
    position: absolute;
    width: calc(94%/16);
    right: calc(24%/16);
    top: calc(360%/5.2);
    animation: fluffy2 1.2s ease-in-out infinite alternate; }

.bg_item03 {
  position: relative; }
  @media screen and (max-width: 750px) {
    .bg_item03 {
      width: calc(100% - 40px);
      margin: 0 auto; } }
  .bg_item03 .bg_ico05 {
    position: absolute;
    width: calc(162%/16);
    left: calc(70%/16);
    bottom: calc(-70%/4.16);
    animation: fluffy2 1.2s ease-in-out infinite alternate; }

.bg_item04 {
  position: relative; }
  @media screen and (max-width: 750px) {
    .bg_item04 {
      width: calc(100% - 40px);
      margin: 0 auto; } }
  .bg_item04 .bg_ico06 {
    position: absolute;
    width: calc(303%/16);
    right: 0;
    bottom: calc(-110%/4.16);
    animation: fluffy2 1.2s ease-in-out infinite alternate; }

.bg_item05 {
  position: relative; }
  .bg_item05 .bg_ico07 {
    position: absolute;
    width: calc(227%/16);
    left: 0;
    bottom: calc(220%/13.9);
    animation: fluffy2 1.2s ease-in-out infinite alternate; }

@keyframes fluffy2 {
  0% {
    transform: translate(0, 0px); }
  10% {
    transform: translate(0, 0px); }
  100% {
    transform: translate(0, -25px); } }
.sec_read {
  font-size: clamp(19px, 2.65vw, 34px);
  letter-spacing: 0.06em;
  line-height: 1.3; }
  @media screen and (max-width: 750px) {
    .sec_read {
      font-size: clamp(18px, 6vw, 36px); } }

.sec_copy {
  font-size: clamp(13px, 2.26vw, 29px);
  letter-spacing: 0.05em;
  line-height: 1.72; }
  @media screen and (max-width: 750px) {
    .sec_copy {
      font-size: clamp(12px, 4.16vw, 25px);
      letter-spacing: 0; } }

.txt_box {
  margin-bottom: clamp(40px, 5%, 60px); }
  .txt_box .sec_read {
    margin-bottom: 0.8em; }

.sp_bgs01 {
  position: relative;
  z-index: 5; }
  .sp_bgs01 .img101_ico_sp {
    width: calc(783%/7.5);
    position: absolute;
    inset: 0;
    margin: auto;
    animation: fluffy2 1.2s ease-in-out infinite alternate; }

.sp_bgs02 {
  position: relative;
  padding-top: clamp(50px, 7.5%, 90px); }
  .sp_bgs02 .bg_ico08 {
    width: calc(192%/7.5);
    position: absolute;
    top: calc(-210%/6.32);
    left: -20px;
    margin: auto;
    animation: fluffy2 1.2s ease-in-out infinite alternate; }
  .sp_bgs02 .bg_ico09 {
    width: calc(93%/7.5);
    position: absolute;
    bottom: calc(170%/6.32);
    right: calc(-10%/7.5);
    margin: auto;
    animation: fluffy2 1.2s ease-in-out infinite alternate; }
  .sp_bgs02 .txt_box01 {
    position: relative; }

.sec01 {
  margin-bottom: clamp(100px, 13.34%, 160px); }
  .sec01 .ttl {
    color: #67747c;
    text-align: center;
    font-size: 68px;
    letter-spacing: 0.08em;
    line-height: 0.8;
    padding-top: clamp(50px, 6.67%, 80px);
    padding-bottom: clamp(50px, 6.67%, 80px); }
    @media screen and (max-width: 750px) {
      .sec01 .ttl {
        position: relative;
        z-index: 3;
        font-size: clamp(20px, 9vw, 54px); } }
    .sec01 .ttl span {
      margin-top: 10px;
      line-height: 1;
      display: block;
      font-size: 32px;
      letter-spacing: 0.15em; }
      @media screen and (max-width: 750px) {
        .sec01 .ttl span {
          font-size: clamp(12px, 4.16vw, 25px); } }
  .sec01 .img101 .cap {
    max-width: 1280px;
    left: 0;
    margin: auto;
    width: 100%; }
    @media screen and (max-width: 750px) {
      .sec01 .img101 .cap {
        bottom: -2em; } }
  .sec01 .item01 {
    max-width: 1120px;
    margin: calc(-100%/11.2) auto 0;
    align-items: center;
    display: flex;
    justify-content: center;
    margin-bottom: clamp(40px, 5.84%, 70px);
    position: relative; }
    @media screen and (max-width: 750px) {
      .sec01 .item01 {
        flex-direction: column;
        margin: 0 auto;
        margin-bottom: clamp(40px, 5.84%, 70px); } }
    .sec01 .item01 .img102_2 {
      position: absolute;
      inset: 0;
      top: 15px;
      margin: auto;
      animation: fluffy2 1.2s ease-in-out infinite alternate; }
    .sec01 .item01 .img102 {
      width: calc(573%/11.2);
      margin-right: calc(30%/11.2); }
      @media screen and (max-width: 750px) {
        .sec01 .item01 .img102 {
          width: calc(635%/7.1);
          margin: 0 auto;
          position: relative; } }
      .sec01 .item01 .img102 img {
        width: 100%;
        animation: fluffy 1.2s ease-in-out infinite alternate; }
    .sec01 .item01 .txts {
      width: calc(540%/11.2);
      font-size: clamp(13px, 2.58vw, 29px);
      line-height: 1.8;
      letter-spacing: 0.07em; }
      @media screen and (max-width: 1300px) {
        .sec01 .item01 .txts {
          padding-top: 1em;
          letter-spacing: -0.03em; } }
      @media screen and (max-width: 750px) {
        .sec01 .item01 .txts {
          margin-top: -5%;
          width: 100%;
          text-align: center;
          position: relative;
          font-size: clamp(13px, 4.16vw, 25px); } }
@keyframes fluffy {
  0% {
    transform: translate(0, 0px); }
  100% {
    transform: translate(0, -25px); } }
    @media screen and (max-width: 767px) {
      @keyframes fluffy {
        0% {
          transform: translate(0, 0px); }
        100% {
          transform: translate(0, -15px); } } }
  @media screen and (max-width: 750px) {
    .sec01 .txt_box01 .img103 {
      max-width: 590px;
      margin: 0 auto;
      margin-bottom: clamp(50px, 6.67%, 80px); } }

.sec02 {
  margin-bottom: clamp(100px, 13.34%, 160px); }

.sec03 {
  margin-bottom: clamp(100px, 13.34%, 160px); }
  @media screen and (max-width: 750px) {
    .sec03 .sec_copy1 {
      margin-bottom: clamp(30px, 4.17%, 50px); } }
  .sec03 .gainenzu {
    max-width: 1027px;
    margin: 0 auto; }
    .sec03 .gainenzu .cap {
      font-size: 14px;
      right: 15px;
      bottom: 5%; }
      @media screen and (max-width: 750px) {
        .sec03 .gainenzu .cap {
          right: 0;
          bottom: 0;
          font-size: 12px; } }
      @media screen and (max-width: 480px) {
        .sec03 .gainenzu .cap {
          font-size: 10px;
          bottom: -1em; } }
  .sec03 .sankau {
    padding: 0;
    margin: 70px auto 20px;
    width: 0;
    height: 0;
    border-left: 49px solid transparent;
    border-right: 49px solid transparent;
    border-top: 39px solid #66747b; }
    @media screen and (max-width: 750px) {
      .sec03 .sankau {
        margin-top: clamp(40px, 5%, 60px);
        margin-bottom: clamp(50px, 7.5%, 90px); } }

.sec04 {
  padding-bottom: clamp(80px, 11.67%, 140px); }
  .sec04 .inner {
    display: flex;
    flex-direction: column;
    grid-gap: 66px 0; }
  .sec04 .items02 {
    display: flex;
    align-items: stretch;
    max-width: 1014px;
    margin: 0 auto;
    position: relative; }
    @media screen and (max-width: 750px) {
      .sec04 .items02 {
        max-width: 612px;
        flex-direction: column; } }
    .sec04 .items02::before {
      content: "";
      position: absolute;
      inset: 0;
      margin: auto;
      z-index: 2;
      pointer-events: none;
      border: 1px solid; }
    .sec04 .items02 .ttl_cnt {
      position: relative;
      width: calc(222%/10.14);
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      display: flex;
      justify-content: center;
      align-items: center;
      color: #fff;
      font-size: clamp(23px, 4.09vw, 43px);
      line-height: 1; }
      @media screen and (max-width: 750px) {
        .sec04 .items02 .ttl_cnt {
          width: 100%;
          padding: 1em 0.5em; } }
      .sec04 .items02 .ttl_cnt .cap {
        font-size: 10px;
        position: absolute;
        left: 5px;
        bottom: 5px; }
    .sec04 .items02 .txt_cnt {
      width: calc(792%/10.14);
      background: #fff;
      padding: 20px;
      display: flex;
      flex-direction: column;
      grid-gap: 20px 0; }
      @media screen and (max-width: 750px) {
        .sec04 .items02 .txt_cnt {
          padding: 10px;
          width: 100%; } }
      .sec04 .items02 .txt_cnt .ttl_wrap {
        font-size: clamp(16px, 2.38vw, 25px);
        display: flex;
        align-items: stretch;
        line-height: 1.4;
        margin-bottom: 0.3em; }
        @media screen and (max-width: 750px) {
          .sec04 .items02 .txt_cnt .ttl_wrap {
            font-size: clamp(16px, 3.83vw, 23px); } }
        @media screen and (max-width: 480px) {
          .sec04 .items02 .txt_cnt .ttl_wrap {
            font-size: 15px; } }
        .sec04 .items02 .txt_cnt .ttl_wrap .nm {
          display: flex;
          justify-content: center;
          align-items: center;
          font-size: clamp(20px, 3.04vw, 32px);
          line-height: 1;
          padding-right: 0.3em;
          margin-right: 0.2em;
          position: relative; }
          @media screen and (max-width: 750px) {
            .sec04 .items02 .txt_cnt .ttl_wrap .nm {
              font-size: clamp(20px, 5.33vw, 32px);
              padding-right: 0.5em;
              margin-right: 0.4em; } }
          @media screen and (max-width: 480px) {
            .sec04 .items02 .txt_cnt .ttl_wrap .nm {
              font-size: 16px; } }
          .sec04 .items02 .txt_cnt .ttl_wrap .nm::before {
            content: "";
            width: 1px;
            position: absolute;
            top: 0;
            bottom: 0;
            right: 0;
            z-index: 1;
            background: #ccc; }
      .sec04 .items02 .txt_cnt .txt {
        font-size: clamp(13px, 1.8vw, 19px);
        letter-spacing: 0.08em; }
        @media screen and (max-width: 750px) {
          .sec04 .items02 .txt_cnt .txt {
            font-size: clamp(13px, 3.16vw, 19px); } }
        @media screen and (max-width: 480px) {
          .sec04 .items02 .txt_cnt .txt {
            font-size: 13px; } }
  .sec04 .item01::before {
    border-color: #d19a5f; }
  .sec04 .item01 .ttl_cnt {
    background-image: url("../img/equipment/04/img401.jpg"); }
    @media screen and (max-width: 750px) {
      .sec04 .item01 .ttl_cnt {
        background-image: url("../img/equipment/04/img401_sp.jpg"); } }
  .sec04 .item01 .txt_cnt .ttl_wrap {
    color: #d19a5f; }
    .sec04 .item01 .txt_cnt .ttl_wrap .nm::before {
      background: #d19a5f; }
  .sec04 .item02::before {
    border-color: #8fad6f; }
  .sec04 .item02 .ttl_cnt {
    background-image: url("../img/equipment/04/img402.jpg"); }
    @media screen and (max-width: 750px) {
      .sec04 .item02 .ttl_cnt {
        background-image: url("../img/equipment/04/img402_sp.jpg"); } }
  .sec04 .item02 .txt_cnt .ttl_wrap {
    color: #8fad6f; }
    .sec04 .item02 .txt_cnt .ttl_wrap .nm::before {
      background: #8fad6f; }
  .sec04 .item03::before {
    border-color: #5b77a2; }
  .sec04 .item03 .ttl_cnt {
    background-image: url("../img/equipment/04/img403.jpg"); }
    @media screen and (max-width: 750px) {
      .sec04 .item03 .ttl_cnt {
        background-image: url("../img/equipment/04/img403_sp.jpg"); } }
  .sec04 .item03 .txt_cnt .ttl_wrap {
    color: #5b77a2; }
    .sec04 .item03 .txt_cnt .ttl_wrap .nm::before {
      background: #5b77a2; }
  .sec04 .item03 .txt_cnt .flex {
    display: flex;
    justify-content: space-between; }
    .sec04 .item03 .txt_cnt .flex .txts {
      width: calc(475%/7.52); }
      @media screen and (max-width: 750px) {
        .sec04 .item03 .txt_cnt .flex .txts {
          width: calc(300%/5.72); } }
    .sec04 .item03 .txt_cnt .flex .imgs {
      width: calc(246%/7.52); }
      @media screen and (max-width: 750px) {
        .sec04 .item03 .txt_cnt .flex .imgs {
          width: calc(254%/5.72);
          position: relative; }
          .sec04 .item03 .txt_cnt .flex .imgs .cap_r {
            position: absolute;
            left: -6em;
            bottom: 0;
            line-height: 1; } }
      @media screen and (max-width: 480px) {
        .sec04 .item03 .txt_cnt .flex .imgs .cap_r {
          position: static;
          line-height: 1.4;
          margin-top: 5px; } }
  .sec04 .item04 {
    display: flex;
    justify-content: space-between;
    max-width: 1014px;
    width: 100%;
    margin: 0 auto; }
    @media screen and (max-width: 750px) {
      .sec04 .item04 {
        flex-direction: column;
        max-width: 612px;
        grid-gap: 20px 0; } }
    .sec04 .item04 .img_cnt {
      width: calc(464%/10.14); }
      @media screen and (max-width: 750px) {
        .sec04 .item04 .img_cnt {
          width: 100%; } }
    .sec04 .item04 .txt_cnt {
      width: calc(506%/10.14); }
      @media screen and (max-width: 750px) {
        .sec04 .item04 .txt_cnt {
          width: 100%; } }
      .sec04 .item04 .txt_cnt .txt1 {
        font-size: clamp(20px, 3.23vw, 34px);
        letter-spacing: 0.04em; }
        @media screen and (max-width: 750px) {
          .sec04 .item04 .txt_cnt .txt1 {
            font-size: clamp(18px, 5vw, 30px);
            text-align: center; } }
      .sec04 .item04 .txt_cnt .txt2 {
        font-size: clamp(16px, 2.57vw, 27px);
        letter-spacing: 0.04em; }
        @media screen and (max-width: 750px) {
          .sec04 .item04 .txt_cnt .txt2 {
            font-size: clamp(16px, 3.16vw, 19px); } }

/*# sourceMappingURL=equ04.css.map */