@charset "utf-8";

.footer{
    padding: 2rem 0 1.5rem;
    position: relative;
  	background-image: linear-gradient(270deg, #cee575, #2fc080 40%, #00a33e);
}

.footer-wrap{
    width: 90%;
    max-width: 1400px;
    margin: 3rem auto 1rem;
    position: relative;
    display: flex;
    justify-content: space-between;
    gap: 5rem;
    overflow: hidden;
}

.footer-logo img{
  width:  320px;
  height: auto;
}

.footer-desc{
   display: flex;
   flex-direction: column;
   gap: 2rem;
   font-size: 16px;
   font-weight: 600;
   color: #FFF;
}

.footer__menu-wrap{
   display: flex;
   gap: 2rem;
   margin-top: 2rem;
}

.footer__menu{
   display: flex;
   flex-direction: column;
   gap: 1rem;
  margin-bottom: 2rem;
}

.footer__menu-has{
  	position: relative;
    color: #FFF;
    font-weight: 600;
  	margin: 0 0 1rem 0;
  	width: fit-content;
  	height: fit-content;
  	font-size: 20px;
    padding: 0rem 0 0 2rem;
}
.footer__menu-has p{
  	position: relative;
    color: #FFF;
    font-weight: 600;
}

.footer__menu-has:before{
    content: "";
  	position: absolute;
    left: 0;
    top: .25rem;
  	width: 20px;
  	height: 20px;
    background: url("https://withwinsandx.jp/system_panel/uploads/images/20260207205944331248.png");
    background-size: cover;
}

.footer__menu-child p{
  	position: relative;
    color: #FFF;
  	width: fit-content;
  	height: fit-content;
  	font-size: 1rem;
  margin-left: 2rem;
}

.footer__menu a:hover{
  opacity: .6;
  color: #FFF;
}

.footer-btn img{
  width: 190px;
  height: auto;
  cursor: pointer;
}

@media (max-width: 1400px) {
  .footer-wrap{
      gap: 3rem;
    flex-wrap: wrap;
  }
  .footer__menu-has{
      font-size: 18px;
      padding: 0rem 0 0 1.5rem;
  }
  .footer__menu-has:before{
      width: 18px;
      height: 18px;
  }
  .footer__menu-child p{
      font-size: 14px;
  }
}


@media (max-width: 960px) {
  .footer{
    padding: 1rem 0;
    position: relative;
    font-size: 14px;
  	background-color: #D1DFCC;
  }
  .footer-wrap{
    width: 90%;
    margin: 2rem auto 1rem;
  }
  .footer-logo{
    width:  280px;
  }
  .footer_link{
     display: flex;
     gap: 1.5rem;
     font-size: 14px;
  }
  .footer__menu-wrap{
     gap: 1rem;
    flex-wrap: wrap;
  }
}

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