@charset "utf-8";

/* 2024 renewal */
@media screen and (min-width:1001px){
  .footer-top .footer-top-con.link .link-list .link-site .link-site-list li:hover{
    background: #222;
  }
}
.footer-top .footer-top-con .address-title{
  color: #fff;
  font-size: 1.6rem;
  font-weight: 700;
}
body[class*="sub"] #foot_layout{
  padding: 7rem 10rem;
}

#foot_layout{
  padding: 7rem 0;
  background: #222;
  display: flex;
  flex-direction: column;
  gap: 2.2rem;
  position: relative;
  z-index: 25;
  color: #fff;
  width: 100%;
  z-index: 1;

}
#foot_layout > div{
  width: 172rem;
  margin: 0 auto;
  justify-content: space-between;
}
.footer-top{
  display: flex;
  color: #fff;
}
.footer-top .footer-top-con{
  position: relative;
  margin-right: 2.4rem;
  display: flex;
  flex-direction: column;
  padding-top: 2.4rem;
  padding-bottom: 2.4rem;
  border-top:1px solid #949494;
  border-bottom: 1px solid #949494;
  font-size: 1.6rem;
  line-height: 1.15;
  font-weight: 700;
  min-width: 30rem;
}
.footer-top .footer-top-con:nth-child(n+2){
  margin-left: 2.4rem;
}
.footer-top .footer-top-con:nth-child(n+2)::before{
  display: block;
  position: absolute;
  top: 0;
  left: -2.4rem;
  width: 1px;
  height: 100%;
  background-color: #949494;
  content: '';
}
.footer-top .footer-top-con:last-of-type{
  margin-right: 0;
}
.footer-top .footer-top-con .address{
  color: #949494;
  display: flex;
  gap: .6rem;
}
.footer-top .footer-top-con .address em{
  min-width: 3.6rem;
}
.footer-top .footer-top-con .address.location{
  padding-top: 1rem;
}

.footer-top .footer-top-con.link .link-list{
  display: flex;
  gap: 7rem;
}
.footer-top .footer-top-con.link .link-list .link-item{
  display: flex;
  flex-direction: column;
}
.footer-top .footer-top-con.link .link-list .link-item a{
  padding-bottom: 1.2rem;
  font-size: 1.6rem;
  line-height: 1.12;
  font-weight: 700;
  color: #fff;
}
.footer-top .footer-top-con.link .link-list .link-item a.point-green{
  color: #12D0BE;
}

.footer-top .footer-top-con.link .link-list .link-site{
  display: flex;
  flex-direction: column;
  gap: 1.6rem;
}
.footer-top .footer-top-con.link .link-list .link-site .link-site-wrap button{
  background-color: #555;
  display: flex;
  padding: 0 1.6rem;
  width: 24.8rem;
  height: 4.8rem;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  font-size: 1.5rem;
  font-weight: 700;
}
.footer-top .footer-top-con.link .link-list .link-site .link-site-wrap button i{
  font-size: 1.8rem;
  line-height: 1.8rem;
  font-weight: 400;
  transform: rotate(0deg);
}
.footer-top .footer-top-con.link .link-list .link-site .link-site-wrap button.active i{
  transform: rotate(-180deg);
}
.footer-top .footer-top-con.link .link-list .link-site .link-site-wrap{
  position: relative;
}
.footer-top .footer-top-con.link .link-list .link-site .link-site-list{
 display: none; 
 position: absolute;
 background: #555;
 width: 100%;
 bottom: 0;
 transform: translateY(-4.8rem);
}
.footer-top .footer-top-con.link .link-list .link-site .link-site-list li{
  display: flex;
  transition: background .2s linear;
}
.footer-top .footer-top-con.link .link-list .link-site .link-site-list li a{
  padding: 1.5rem 1.6rem;
  color: #fff;
}


.footer-top .footer-top-con.link .link-list .link-site .link-site-mark{
  align-self:  flex-end;
  display: inline-flex;
}

.footer-top .footer-top-con.link .link-list .link-site .link-site-mark a span{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 7.9rem;
}

.footer-bottom{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  color: #949494;
  font-size: 1.6rem;
  font-weight: 700;
}
.footer-bottom .footer-logo{
  width: 28rem;
}
@media (max-width: 1920px) {
  #foot_layout > div{
    width: 162rem;
  }
  .footer-top .footer-top-con.link .link-list{
    gap: 4rem;
  }
  body[class*="sub"] #foot_layout > div{
    width: 100%;
  }
}
@media (max-width: 1820px) {
  body[class*="sub"] #foot_layout{
    padding: 7rem 2rem;
  }
  #foot_layout{
    padding:7rem 2rem;
  }
  #foot_layout > div{
    width: 100%;
    flex-wrap: wrap;
    row-gap: 5rem;
  }
  .footer-top .footer-top-con{
    width: calc((100% - 9.6rem) / 3);
    min-width: auto;
  }
  .footer-top .footer-top-con:nth-child(3){
    margin-right: 0;
  }
  .footer-top .footer-top-con:last-of-type{
    width: 100%;
    margin-left: 0;
    padding-top: 0;
    border-top-width: 0;
  }
  .footer-top .footer-top-con:last-of-type::before{
    display: none;
  }
  .footer-top .footer-top-con.link .link-list{
    padding-top: 2.4rem;
  }
  .footer-top .footer-top-con.link .link-list .link-site:last-of-type{
    flex-grow: 1;
    align-items: flex-end;
  }
  .footer-top .footer-top-con.link .link-list{
    flex-wrap: wrap;
  }
}
@media (max-width: 1600px) {
  #foot_layout > div{
    padding: 0 2rem;  
  }
}
@media (max-width: 1400px) {
  #footer > div{
    max-width: 100%;
    padding: 0 2rem;
  }
}

@media (max-width: 1001px) {
  #foot_layout{
    padding: 7rem 0;
  }
}
@media (max-width: 640px) {
  #foot_layout > div{
    flex-direction: column;
    row-gap: 3rem;
    margin: 0;
  }
  .footer-top .footer-top-con:nth-child(n+1){
    margin-left: 0;
    margin-right: 0;
  }
  .footer-top .footer-top-con:nth-child(n+2){
    border-top-width: 0;
    padding-top: 0;
  }
  .footer-top .footer-top-con:nth-child(n+2)::before{
    display: none;
  }
  .footer-top .footer-top-con{
    width: 100%;
  }
  .footer-top .footer-top-con.link .link-list{
    flex-direction: column;
    gap: 1.5rem;
    padding-top: 0;
  }
  .footer-top .footer-top-con.link .link-list .link-item{
  	flex-direction:row;
  	gap:1.5rem;
  }
  .footer-bottom{
    align-items: flex-start;
  }
  
}

@media (max-width: 480px) {
.footer-top .footer-top-con.link .link-list .link-item{
	flex-wrap: wrap;
}
  .footer-top .footer-top-con.link .link-list .link-item:first-of-type a:last-of-type{
    width:100%;
  }
  .footer-top .footer-top-con.link .link-list .link-site:last-of-type{
    width: 100%;
  }
  .footer-top .footer-top-con.link .link-list .link-site .link-site-wrap{
    width: 100%;
  }
  .footer-top .footer-top-con.link .link-list .link-site .link-site-wrap button{
    width: 100%;
  }
}