@charset "UTF-8";
/*=======================================
ABOUT
=========================================*/

.p-services .w-link {
    display: flex;
    justify-content: center;
    margin: 149px auto 89px;
}

.p-services .w-link li:not(:last-child) {
    margin-right: 2.19vw;
}

.p-services .w-link li a {
    display: block;
    width: 28.13vw;
    text-align: center;
    padding: 22px 0;
    border-radius: 20px;
    font-size: 18px;
    text-decoration: none;
    position: relative;
}

.p-services .w-link li a::before {
    content: '';
    background: url(../img/services/sita_yazirusi.svg) no-repeat;
    background-size: cover;
    width: 17px;
    height: 9px;
    position: absolute;
    top: 50%;
    right: 36%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.p-services .w-link li:nth-child(1) a {
    background-color: #F2DED7;
}

.p-services .w-link li:nth-child(2) a {
    background-color: #EAF3D5;
}

.p-services .page_wrap .process-wrap {
    /* margin-top: 60px; */
    margin-top: 75px;
}

.p-services .page_wrap .process-wrap.pw_b {
  padding-bottom: 80px;
  margin-top: 62px;
}


  
  .p-services .page_wrap .process-wrap .p-block {
    display: flex;
    background-color: #fff;
    border-radius: 20px;
    padding: 0 40px;
    align-items: center;
    margin-bottom: 80px;
    position: relative;
  }

  .p-services .page_wrap .process-wrap .p-block:last-child {
    margin-bottom: 0;
  }

  .p-services .page_wrap .process-wrap .p-block.ten-sen::before {
    content: '';
    background: url(../img/services/ten-sen.svg) no-repeat;
    background-size: cover;
    width: 5px;
    height: 164px;
    position: absolute;
    bottom: -13rem;
    left: 4rem;
    z-index: 10;
  }
  
  .p-services .page_wrap .process-wrap .p-block .pho {
    width: 50%;
    display: flex;
    justify-content: end;
    position: relative;
  }
  
  .p-services .page_wrap .process-wrap .p-block .tex p.nu {
    color: #BE8E7C;
    padding-bottom: 20px;
    font-size: 20px;
  }
  
  .p-services .page_wrap .process-wrap .p-block .tex {
    width: 48%;
    padding-right: 2%;
  }
  
  .p-services .page_wrap .process-wrap .p-block .tex strong {
    display: block;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 500;
  }
  
  .p-services .page_wrap .process-wrap .p-block img {
    height: max(15.125vw, 300px);
    object-fit: cover;
    border-radius: 20px;
    position: relative;
    bottom: -40px;
    right: 0;
  }

  .p-services .page_wrap .process-wrap .p-block_blue {
    display: flex;
    background-color: #38B2BF;
    color: #fff;
    border-radius: 20px;
    padding: 15px 40px;
    align-items: center;
    /* height: 323px; */
    margin-bottom: 107px;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .tex {
    width: 46%;
    padding-right: 4%;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .pho-b {
    width: 50%;
    display: flex;
    justify-content: end;
    position: relative;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .pho-b li:first-child {
    position: relative;
    top: 23px;
    right: 1.04vw;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .pho-b li img {
    border-radius: 20px;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .tex strong {
    display: inline-block;
    border-bottom: 1px solid #fff;
    margin-bottom: 17px;
    font-size: 20px;
    font-weight: 500;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .tex p {
    margin-bottom: 17px;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .tex ul li {
    position: relative;
    padding-left: 12px;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .tex ul li::before {
    content: '';
    background-color: #fff;
    width: 7px;
    height: 7px;
    border-radius: 7px;
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
  }

  .p-services .page_wrap .process-wrap .p-block_blue img {
    height: max(11.125vw, 220px);
    object-fit: cover;
  }

  .p-services .men {
    justify-content: center;
    display: flex;
  }

  .p-services .men li {
    background-color: #AFCC6A;
    color: #fff;
    text-align: center;
    padding: 8px 30px;
    border-radius: 30px;
    margin: 0 10px;
    font-size: 18px;
    margin-top: 30px;
  }

  .p-services .p-block.pb .pb_ul {
    display: flex;
  }

  .p-services .p-block.pb .pb_ul li:nth-child(1) {
    margin-right: 1.04vw;
  }

  .p-services .p-block.pb .pb_ul li:nth-child(1) img {
    height: max(15.5vw, 300px);
  }

  .p-services .p-block.pb .pb_ul li:nth-child(2) img {
    height: max(9.5vw, 200px);
  }

  .p-services .page_wrap .process-wrap .p-block.pb p.nu {
    color: #AFCC6A;
  }

  .page-p .page_wrap h2 {
    margin-bottom: 60px;
  }

  @media screen and (min-width: 1201px) and (max-width: 1400px) {
    .p-services .page_wrap .process-wrap .p-block {
      margin-bottom: 8vw;
    }

    .p-services .page_wrap .process-wrap .p-block.ten-sen::before {
      background-size: contain;
      height: 18vh;
      bottom: -12rem;
    }
  }

  @media screen and (min-width: 768px) and (max-width: 1200px) {
    .p-services .w-link li a {
      width: 43vw;
    }

    .p-services .w-link li a::before {
      right: 9%;
    }

    /* .p-services .page_wrap .process-wrap .p-block_blue {
      justify-content: center;
      padding: 15px 20px;
    } */

  }
 
/* ----------------------------- スマホ（～767px） */


@media screen and (max-width: 767px) {
  .p-services .w-link li a {
    font-size: 15px;
  }

  .p-services .w-link {
    margin: 75px 0 45px;
  }

  .p-services .w-link li a {
    width: 43vw;
    padding: 11px 0;
  }

  .p-services .w-link li a::before {
    width: 11px;
    height: 6px;
    right: 7%;
  }

  .p-services .page_wrap .process-wrap .p-block {
    padding: 10px 15px;
    box-sizing: border-box;
    border-radius: 10px;
    margin-bottom: 40px;
    display: block;
  }

  .p-services .page_wrap .process-wrap .p-block .tex,
  .p-services .page_wrap .process-wrap .p-block .pho {
    width: 100%;
  }

  .p-services .page_wrap .process-wrap .p-block img {
    height: max(41.125vw, 150px);
    border-radius: 10px;
    bottom: -20px;
    right: -9px;
  }

  .p-services .page_wrap .process-wrap .p-block .tex p.nu {
    padding-bottom: 10px;
    font-size: 16px;
  }

  .p-services .page_wrap .process-wrap .p-block .tex strong {
    margin-bottom: 10px;
    font-size: 17px;
  }

  .p-services .page_wrap .process-wrap .p-block.ten-sen::before {
    width: 4px;
    height: 50px;
    bottom: -4.7rem;
    left: 2rem;
  }

  .p-services .page_wrap .process-wrap .p-block_blue {
    border-radius: 10px;
    /* padding: 10px 15px; */
    padding: 20px;
    height: auto;
    display: block;
    margin-bottom: 53px;
  }
  .p-services .page_wrap .process-wrap .p-block_blue .tex {
    width: 100%;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .pho-b {
    right: 0;
    top: 0;
    width: 100%;
    margin-top: 23px;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .pho-b li:not(:last-child) {
    margin-right: 10px;
  }

  .p-services .men {
    flex-wrap: wrap;
    margin-top: 20px;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .pho-b li img {
    border-radius: 7px;
    height: max(11.125vw, 138px);
  }

  .p-services .page_wrap .process-wrap .p-block_blue .pho-b li {
    margin-bottom: 10px;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .pho-b li:first-child {
    top: 0;
    right: 0;
  }

  .p-services .page_wrap .process-wrap .p-block_blue .tex strong {
    margin-bottom: 13px;
    font-size: 17px;
  }


  .p-services .men li {
    width: 44%;
    margin: 0 0 10px 0;
  }

  .p-services .men li:nth-child(even) {
    margin-left: 10px;
  }

  .p-services .p-block.pb .pb_ul li img {
    bottom: 0;
    right: 0;
  }

  .p-services .p-block.pb .pb_ul li:nth-child(1) img {
    height: max(15.5vw, 200px);
  }

  .p-services .p-block.pb .pb_ul li:nth-child(2) img {
    height: max(9.5vw, 160px);
  }

  .p-services .p-block.pb .pb_ul {
    margin-top: 10px;
  }
}