@charset "utf-8";

.pro4-about-box {
    background: url('../images/pro2-about-bg.png') center center no-repeat;
    background-size: 100%;
    height: 100vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 57px;
    padding-left: 20px;
    padding-right: 20px;
}




@media screen and (max-height: 1050px) and (min-width:768px) {
    .pro-po-im {
        padding: 66px 45px 36px;
       
    }
    .po-im-title {
        margin-top: -74px;
        margin-bottom: 24px;
        
    }
    .pro1-po-im1,
    .pro1-po-im2 {
        background-size: 95% 96%;
    }
    .po-im-title {
        margin-bottom: 19px;
    }
    .pro-about-text {
        margin-bottom: 30px;
    }
    .pro-about-text figure {
        width: 50%;
    }
    .pro-about-text p {
        width: 49%;
    }
}

@media screen and (max-height: 820px) and (min-width:768px){
    .pro-box h3 {
        margin-bottom: 15px;
    }
    .pro-about-text {
          margin-bottom: 20px;
      }
      .pro-po-im {
          padding: 62px 45px 32px;
      }
}

@media screen and (max-width: 768px) {
.pro-about-text figure,
  .pro-about-text p,
  .pro-po-im {
    width: 100%;
  }
  
}


@media screen and (max-height: 1180px) and (max-width:820px) {
    .pro-about-text p {
        width: 49%;   
    }
    .pro-about-text figure {
        width: 51%;
    }
}


@media screen and (max-height: 660px) and (max-width: 1366px) {
  .pro-box {
    max-width: 1200px;
  }
  .pro-box h3 {
    margin-bottom: 20px;
  }
  .pro-about-text figure {
    width: 36%;
  }
  .pro-about-text p {
    width: 64%;
  }
  .pro-about-text {
    margin-bottom: 20px;
  }
  .po-im-title {
    margin-bottom: 13px;
    margin-top: -71px;
  }
  .pro-po-im {
    padding-bottom: 32px;
  }
  .pro-box .more-text a {
    margin-top: 0;
  }
  
}


@media screen and (max-width: 768px) {
    .pro-about-text p {
        width: 100%;   
    }
    .pro-about-text figure {
        width: 100%;
    }

  
  .pro4-about-box {
    background: url('../images/pro2-about-bg-sp.png') center center no-repeat;
    background-size: 100vw;
  }


}



@media screen and (max-width: 320px){
  .pro-about-text {
    margin-bottom: 50px;
  }
  .pro-po-im {
    padding-top: 65px;
    padding-bottom: 60px;
  }
}