@charset "utf-8";

.footer{
  background: #C3AAAE;
  padding: 2.5rem 5% 5rem;
  position:relative;
}

.footer::before{
  content:"";
  position:absolute;
  width:200%;
  height:100%;
  background: #C3AAAE;
  right:0;
  top:0;
  z-index:-1;
}

.footer .container{
  max-width:900px;
}

.footer-logo{
  max-width:370px;
  width:30%;
  margin:0 0 1rem;
}

.footer-ul{
  display:flex;
  flex-wrap:wrap;
  gap:2.5rem 5%;
}

.footer-item{
  width:20%;
}

.footer-item:nth-child(2){
  width: 45%;
}

.footer-item > a{
  color:#fff;
  font-weight:500;
  font-size:clamp(1rem, 0.955rem + 0.15vw, 1.125rem);
}

.footer-item > a:hover{
  color:#03436D;
  opacity:1;
}

.footer-sub{
  margin-top:1.5rem;
  display:flex;
  flex-wrap:wrap;
  gap:12px 1.5rem;
}

.footer-sub a{
  min-width:90px;
  color:#2E2E2E;
  font-size:14px;
}

.footer-sub a:last-child{
  width:100%;
}

.footer-bottom{
  margin-top:100px;
}

.footer-bottom-wrap{
  display:flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap:wrap;
  gap:1.5rem;
}

.footer-bottom-list{
  display:flex;
  gap:1.5rem;
}

.footer-bottom-item{
  display:flex;
  gap:1rem;
  align-items: center;
  font-size:14px;
}

.footer-bottom-item:last-child img{
  width:1.5rem;
}

.footer-bottom-item img{
  width:2rem;
}

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


@media screen and (max-width: 1023px) {
  .footer-wrap {
    flex-direction:column;
    align-items: center;
    gap:2rem;
  }
  .footer-right {
    width: 100%;
    gap: 2.5rem 1rem;
    padding:0;
  }
  .copyright{
    width:100%;
  }
}

@media (max-width: 767px) {
  .footer{
    padding: 0 0 1.25rem;
  }
  .footer-ul{
    flex-direction: column;
    gap: 2rem;
    width: fit-content;
    margin: 0 auto;
  }
  .footer-item,
  .footer-item:nth-child(2){
    width:100%;
  }
  .footer-sub{
    flex-direction: column;
    gap: 10px;
  }
  .footer-sub a{
    font-size:12px;
  }
  .footer-bottom {
    margin-top: 3.5rem;
  }
  .footer-logo {
    max-width: 310px;
    width: 100%;
    margin: 0 auto 1rem;
  }
  .footer-bottom-list {
    gap: 8px;
    flex-direction: column;
  }
  .copyright {
    margin-top: 2.5rem;
    font-size:10px;
    text-align:center;
  }
  .footer-bottom-wrap{
    flex-direction: column;
    align-items: center;
    gap: 0;
  }
  .footer-bottom-item img,
  .footer-bottom-item:last-child img{
    width: 20px;
  }
  .footer-bottom-item{
    font-size:12px;
  }
}
