.p-work {
  padding-block-start:calc(160/ 16 * 1rem) ;
  padding-block-end: calc(60/ 16 * 1rem);
  
}

#con04 .ttl-box{
  @media screen and (max-width: 768px) {
    padding-block-start:60px ;
  }
  
}

.p-work__title-group {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.p-work__title-group::before {
  content: "";
  top:13%;
  left: calc(50% - 183px);
  transform: translate(-50%, -50%);
  position: absolute;
  background: url("../../images/renewal/work-title.svg") no-repeat center center /
    contain;
  display: block;
  inline-size: 161px;
  block-size: 176px;
  @media screen and (max-width: 768px) {
    inline-size: 97px;
    block-size: 103px;
      left: calc(50% - 116px);
      top: 9%;

  }
}

.p-work__title-wrapper {
  display: grid;
  gap: 15px;
}

.p-work__title {
  font-size: calc(42 / 16 * 1rem);
  font-weight: 700;
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  line-height: 1;
  @media screen and (max-width: 768px) {
    font-size: 26px;
  }
}

.p-work__title-en {
  text-transform: uppercase;
  font-size: calc(16 / 16 * 1rem);
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1;
  text-align: center;
  @media screen and (max-width: 768px) {
    font-size: 14px;
  }
}

.p-works__cards {
  margin-block-start: 35px;
  @media screen and (max-width: 768px) {
   margin-block-start:41px;
  }
}

.p-work__btn{
  margin-inline: auto;
  margin-block-start:40px;
  
}

.c-works-cards{
   display: grid;
  column-gap: 20px;
  display: grid;
  column-gap: 20px;
  row-gap: 30px;
  grid-template-columns: repeat(4, 1fr);
  justify-content: center;
  @media screen and (max-width: 768px) {
     grid-template-columns: repeat(2, 1fr);
    justify-content: center;
    gap: 16px;
  }
}

.c-work-card {
  max-inline-size: 260px;
  inline-size: 100%;
  display: grid;
  grid-row:span 3;
  grid-template-rows: subgrid;
  gap: 0;
  @media screen and (max-width: 768px) {
    max-inline-size: 450px;
  }
}

.c-works-card__img {
  inline-size: 100%;
  img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
    aspect-ratio: 260/180;
  }
}



.c-works-card__title {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  font-size: calc(16 / 16 * 1rem);
  font-weight: 500;
  line-height: calc(24 / 16);
    background-color: #f6cc00;

  padding: calc(6 / 16 * 1rem) calc(20 / 16 * 1rem);
  @media screen and (max-width: 768px) {
    font-size: 14px;
    padding: 10px;
  }
}

.c-works-card__location {
  background-color: #F8F8F8;
    padding-block:19px;
      padding-inline:27px;
      font-size: 14px;
      @media screen and (max-width: 768px) {
        font-size: 14px;
          padding-block:calc(16/ 16 * 1rem);
          padding-inline:calc(22/ 16 * 1rem);
          padding: 10px;
          
        
      }
    
  
}