@charset "euc-kr";

/* ============================= */
/* FOOT BUTTON SECTION */
/* ============================= */

.foot_btn{
padding-top: clamp(40px,2.5vw,70px);
 padding-bottom: clamp(40px,2.5vw,70px);
  background:#fffde3;
  text-align:center;
}


/* ============================= */
/* BUTTON WRAP */
/* ============================= */

.f_btn_con{
  width:clamp(1000px,2.5vw,1400px);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;

  /* 🔥 con_align을 grid 안에서 가운데 */
  justify-items:center;
    margin-bottom: 70px;
}

/* 🔥 아이콘+텍스트 그룹을 중앙 정렬 */
.con_align{
  display:flex;
  justify-content:center;
}

/* ============================= */
/* BUTTON COMMON */
/* ============================= */

.f_btn_con a{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:24px;
    width: clamp(300px,2.5vw,400px);
  height:260px;
  padding:clamp(20px,2.5vw,40px) clamp(20px,2.5vw,40px);
  border-radius:36px;
  text-decoration:none;
  transition:.25s ease;
  box-sizing:border-box;
}

.f_btn_con a:hover{
  transform:translateY(-6px);
}

/* ============================= */
/* ICON */
/* ============================= */

.cta-btn__icon{
  display:flex;
  align-items:center;
  justify-content:center;
}

.cta-btn__icon img{
  width:80px;
  height:80px;
  object-fit:contain;
}

/* ============================= */
/* TEXT */
/* ============================= */

.cta-btn__l{
  font-family:'paperozi';
  font-weight:600;
  font-size:clamp(22px,2vw,30px);
  text-align:center;
  line-height:1.3;
}

.cta-btn__l strong{
  display:block;
  font-size:clamp(28px,2.2vw,40px);
  font-weight:700;
  margin-top:8px;
}

/* ============================= */
/* COLOR */
/* ============================= */

.btn--call{
  background:#8a6300;
  color:#ffffff;
}

.btn--kakao{
  background:#f5cf24;
  color:#1f1f1f;
}

.btn--quick{
  background:#15589e;
  color:#ffffff;
}

.btn--call img,
.btn--quick img{
  filter:brightness(0) invert(1);
}

.time>img{
    display: inline-block;
    text-align: center;
    width: clamp(1000px,2.5vw,1400px);
}

/* ============================= */
/* RESPONSIVE */
/* ============================= */

@media (max-width:1024px){

  .f_btn_con{
   width: 70%;
  }

  .f_btn_con a{
      gap:clamp(5px,2.5vw,10px);
    border-radius:28px;
    width: clamp(220px,2.5vw,600px);
  height:clamp(220px,2.5vw,260px);
  padding:clamp(10px,2.5vw,30px) clamp(10px,2.5vw,30px);
  }

  .cta-btn__icon img{
    width:60px;
    height:60px;
  }
    
    .time>img{
        display: inline-block;
        text-align: center;
        width: 80%;
    }
}

/* 🔽 모바일 */

/* 🔽 모바일 */
@media (max-width:768px){

  .foot_btn{
    padding-top:20px;
    padding-bottom:20px;
  }

  .f_btn_con{
    width:90%;
    grid-template-columns:1fr;
    gap:10px;
    justify-items:center;
    margin-bottom:clamp(20px,2.5vw,50px);
  }

  .con_align{
    display:flex;
    justify-content:center;
    width:100%;
  }

 .f_btn_con a{
  width:80%;
  flex-direction:row;
  justify-content:flex-start;   /* 🔥 왼쪽 정렬 */
  align-items:center;
  height:clamp(60px,2.5vw,80px);
  border-radius:clamp(5px,2.5vw,20px);
  gap:20px;
  padding:0 48px 0 24px;
  position:relative;
}

  /* 🔥 화살표 추가 */
  .f_btn_con a::after{
    content:"";
    position:absolute;
    right:20px;
    top:50%;
    width:8px;
    height:8px;
    border-right:2px solid currentColor;
    border-top:2px solid currentColor;
    transform:translateY(-50%) rotate(45deg);
  }

  .cta-btn__icon img{
    width:40px;
    height:40px;
  }

  .cta-btn__l{
    font-size:16px;
    text-align:left;
  }

  .cta-btn__l strong{
    font-size:17px;
  }

}