@charset "utf-8";

.footer{
  padding: 4rem 0 20px;
  position:relative;
  background:#FEF5E4;
  margin-top:7.5rem;
}

.footer-top{
  background:#FEF5E4;
  padding: 8px 10% 8px;
  border-bottom: 1px solid #E4E4E4;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.footer .container{
  margin-top: 2rem;
}

.footer-top-left{
  display: flex;
  align-items: center;
  gap:12px;
}

.footer-top-left > p{
  font-size:12px;
}

.footer-top-left .tel-btn{
  margin:0;
}

.footer-top-right{
  display: flex;
  align-items: center;
  gap:1.5rem;
}

.footer-top-right .yellow-btn{
  min-width:178px;
  margin:0 !important;
}

.footer-top-right .yellow-btn::before{
  display:none;
}

.page-top{
  width:36px;
}

.footer-logo{
  width:160px;
  margin:2rem auto;
  display: block;
}

.copyright{
  text-align: center;
  font-size: 12px;
}

.footer-list{
  display: flex;
  justify-content: center;
  gap: 1rem;
  font-size:14px;
  font-weight: bold;
}

.footer-top {
  position: fixed;
  left: 0;
  bottom: -120px;
  width: 100%;
  transition: bottom 0.4s ease;
  z-index: 999;
}

.footer-top.is-show {
  bottom: 0;
}

/* ←ここが重要 */
.footer-top.is-stop {
  position: absolute;
  top: 0; /* JSで上書きする */
  bottom: auto;
}

.footer-top .tel-btn.big{
  font-size: clamp(1.5rem, 1.174rem + 1.09vw, 2.125rem);
}

@media (max-width: 1279px) {
}

@media (max-width: 1024px) {
  .footer-list{
    flex-wrap: wrap;
    max-width: 500px;
    margin: 0 auto;
    gap:2rem;
  }
  .footer-top{
    padding: 8px 2rem 8px;
  }
  .footer-top-right{
    gap:1rem;
  }
}

@media (max-width: 767px) {
  .footer{
    padding: 3rem 0 20px;
    margin-top: 5rem;
  }
  .footer-top-left > p{
    display:none;
  }
  .page-top{
    display:none;
  }
  .footer-top-right .yellow-btn{
    min-width: 150px;
    margin: 0 !important;
    font-size: 12px;
    padding: 10px;
  }
  .tel-btn img {
    width: 14px;
  }
  .footer-top .tel-btn.big{
    font-size: 22px;
  }
  .footer-top {
    padding: 8px 1rem 8px;
  }
  .footer-logo {
    width: 120px;
    margin: 2rem auto 1.5rem;
  }
  .footer .container{
    width:100%;
    margin: 0;
  }
  .footer-list{
    gap:0;
    justify-content: space-between;
    border-top: 1px solid #E4E4E4;
  }
  .footer-list a{
    width: 50%;
    padding: 16px;
    text-align: center;
    border-bottom: 1px solid #E4E4E4;
    border-right: 1px solid #E4E4E4;
    letter-spacing: 1px;
  }
}