/* Good Points
-------------------------------------------*/

.point_lists ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 3rem 2rem;
  padding-top: 3rem;
}
.point_lists ul li{
  width: calc((100% - 4rem) / 3);
  height: auto;
  text-align: justify;
}
.point_lists ul li .list_head{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
  padding-bottom: .5rem;
  text-align: left;
  line-height: 1.5;
  font-weight: bold;
  color: var(--blue);
  border-bottom: 1px solid #ddd;
}
.point_lists ul li .list_head .icon{
  aspect-ratio: 1 / 1;/* 正方形を維持 */
  flex-shrink: 0;/* 潰れ防止 */
  width: clamp(50px, 10vw, 74px);
}
.point_lists ul li .list_head .icon img{
  width: 100%;
  height: auto;
}
.point_lists ul li .text{
  padding-top: 1rem;
  font-size: clamp(12px,1.846vw,14px);
}
.good_points .galleries{
  padding-bottom: calc(var(--sec-margin)*2);
  margin-top: -5rem;
}
#benefits{
  padding-top: calc(var(--sec-margin)*1.5);
  background-color: #dbf5ee;
  text-align: justify;
}
#co_policy{
  padding: 2rem 0 5rem;
}
.list_benefit h3{
  padding: 1rem 0;
  margin-bottom: 2rem;
  border-bottom: 2px solid #fff;
  font-size: clamp(17px,2.615vw,27px);
}
.list_benefit h4{
  color: var(--green);
  padding-bottom: .25rem;
  font-size: clamp(14px,2.154vw,19px);
}
.list_benefit ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 1.5rem;
}
.list_benefit ul li{
  width: calc((100% - 1.5rem) / 2);
  border-radius: 20px;
  padding: 1.5rem 2.5rem;
  background-color: #fff;
}
.list_benefit ul li p{
  font-size: clamp(12px,1.846vw,15px);
}
#co_benefit ul li{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  column-gap: 1rem;
  padding: 1.5rem 2rem;
}
#co_benefit ul li .icon{
  width: 80px;
}
#co_benefit ul li .icon{
  aspect-ratio: 1 / 1;/* 正方形を維持 */
  flex-shrink: 0;/* 潰れ防止 */
  width: clamp(60px, 14vw, 80px);
}
#co_benefit ul li .icon img{
  width: 100%;
  height: auto;
}

@media screen and (max-width: 650px){
  
  .point_lists ul{
    gap: 2rem 1.2rem;
    padding-top: 1.5rem;
  }
  .point_lists ul li{
    width: calc((100% - 1.2rem) / 2);
  }
  .point_lists ul li .list_head{
    gap: .5rem;
  }
  .point_lists ul li .list_head br{
    display: none;
  }
  .good_points .galleries{
    margin-top: -2rem;
  }
  #benefits{
    padding-bottom: calc(var(--sec-margin)*1.5);
  }
  #co_policy{
    padding: 1rem 0 3rem;
  }
  .list_benefit h3{
    padding: 0 0 .5rem;
    margin-bottom: 1.5rem;
  }
  .list_benefit ul{
    gap: 1rem;
  }
  .list_benefit ul li,
  #co_benefit ul li{
    width: 100%;
    border-radius: 10px;
    padding: .75rem 1.25rem;
  }
}