@charset "utf-8";

.greeting{
  background:#fff;
  padding:2.5rem 5%;
  border-radius:20px;
  width:90%;
}

.greeting:not(:last-child){
  margin-bottom:2rem;
}

.greeting.second .greeting-img3{
  width:32%;
}

.greeting.second .greeting-img4,
.greeting.third  .greeting-img4{
  width: 32%;
  top: 2%;
}

.greeting.third .greeting-img3{
  width:22%;
}


.greeting-text > div{
  text-align:left;
}

.greeting-text > div > p:last-child{
  font-size:1rem;
  line-height:2;
  font-weight:400;
}

.greeting-img{
  aspect-ratio: 519 / 653;
  display: flex;
  align-items: center;
}

.greeting-img img:first-child{
  width:75%;
  object-fit: cover;
  border-radius: 20px;
}

.greeting-img3{
  position:absolute;
  width:25%;
  right:0;
  bottom:0;
}

.greeting-img4{
  position:absolute;
  width:100%;
  left:0;
  top:-5%;
}

.greeting-list{
  margin:2.5rem 0 2rem;
  border-top:1px solid #EF7946;
  padding-top:1rem;
  display:flex;
  justify-content: space-between;
}

.greeting-list-item{
  width:18%;
  position:relative;
}

.greeting-list-item::before{
  content:"";
  position:absolute;
  background:#EF7946;
  width:1.5rem;
  height:1.5rem;
  border-radius:999vh;
  left:0;
  top:-28px;
}

.greeting-list-item >p{
  line-height:1.5;
  font-size:14px;
}

.greeting-list-item >p:first-child{
  color:#EF7946;
  font-size:clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  margin-bottom:0.5rem;
  font-weight:500;
}

.keireki h3{
  color:#EF7946;
  font-size:clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  margin-bottom:8px;
}

.keireki div{
  display:none;
  // display:flex;
  gap:20px;
  margin-top:2rem;
}

.keireki div img{
  aspect-ratio:345/260;
  object-fit:cover;
  width:calc((100% - 40px)/3);
}

@media screen and (max-width: 1023px) {
  .greeting-wrap{
    gap: 0rem;
  }
  .greeting-list{
    flex-wrap: wrap;
    gap: 4rem 0;
  }
  .greeting-list-item {
    width: 50%;
  }

  .greeting-list-item:nth-child(n + 3)::after{
    content:"";
    position:absolute;
    width:100%;
    height:1px;
    background:#EF7946;
    left:0;
    top: -1rem;
  }

}

@media screen and (max-width: 767px) {
  .greeting-wrap{
    margin:0;
  }
  .greeting-list-item::before{
    width: 1rem;
    height: 1rem;
    top: -24px;
  }
  .greeting-text h3{
    font-size:20px;
  }
}

.greeting-list,
.keireki{
  display:none;
}