/* footer */
#footer {
  position: relative;
  padding: max(calc(40px * var(--base-ratio)), calc(calc(40 / var(--base-size)) * var(--base-percent))) 0;
  min-height: max(calc(150px * var(--base-ratio)), calc(calc(150 / var(--base-size)) * var(--base-percent)));
  border-top: 1px solid #ddd;
  z-index: 10;
}


#footer .page-top {
	position: absolute;
	top: 0;
	right: 0;
	width: 30px;
	height: 30px;
	border: 1px solid #eee;
	border-radius: 50%;
	background: #fff url(./images/ico_package.png) no-repeat -100px -200px;
	text-indent: -999em;
}
#footer .page-top:focus,
#footer .page-top:hover {
	background-color: #757575;
	background-position-x: -150px;
}


#footer .logo {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: max(calc(223px * var(--base-ratio)), calc(calc(223 / var(--base-size)) * var(--base-percent)));
  height: max(calc(60px * var(--base-ratio)), calc(calc(60 / var(--base-size)) * var(--base-percent)));
}
#footer .logo img {
  width: 100%;
  max-width: inherit;
}

#footer .sitemap_wrap li {
  margin-top: max(calc(8px * var(--base-ratio)), calc(calc(8 / var(--base-size)) * var(--base-percent)));
}
#footer .sitemap_wrap li:first-child {
  margin-top: 0;
}
#footer .sitemap_wrap a {
  display: block;
  font-size: max(calc(14px * var(--base-ratio)), calc(calc(14 / var(--base-size)) * var(--base-percent)));
  line-height: 1.2857142857;
  letter-spacing: -0.02em;
  font-weight: 500;
  color: #666;
}
@media (min-width: 1025px) and (pointer: fine) {
  #footer .sitemap_wrap a:hover {
    color: #1c1c1c;
  }
}

#footer .link_wrap {
  position: absolute;
  right: 0;
  top: 0;
}
#footer .link_wrap .sns_wrap {
  position: absolute;
  right: 0;
  top: 0;
}
#footer .link_wrap .sns_wrap ul {
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: normal;
}
#footer .link_wrap .sns_wrap ul li {
  padding: 0 max(calc(8px * var(--base-ratio)), calc(calc(8 / var(--base-size)) * var(--base-percent)));
}
#footer .link_wrap .sns_wrap ul li a {
  display: block;
  width: max(calc(20px * var(--base-ratio)), calc(calc(20 / var(--base-size)) * var(--base-percent)));
  height: max(calc(20px * var(--base-ratio)), calc(calc(20 / var(--base-size)) * var(--base-percent)));
  transition: all 0.4s ease;
}

#footer .link_wrap .sns_wrap ul li.instagram a {
  background: url("../svg/footer_ico_instagram.svg") center no-repeat;
  background-size: 100%;
}
#footer .link_wrap .sns_wrap ul li.facebook a {
  background: url("../svg/footer_ico_facebook.svg") center no-repeat;
  background-size: 100%;
}
#footer .link_wrap .sns_wrap ul li.youtube a {
  background: url("../svg/footer_ico_youtube.svg") center no-repeat;
  background-size: 100%;
}
@media (min-width: 1025px) and (pointer: fine) {
  #footer .link_wrap .sns_wrap ul li.instagram a:hover {
    background: url("../svg/footer_ico_instagram_on.svg") center no-repeat;
    background-size: 100%;
  }
  #footer .link_wrap .sns_wrap ul li.facebook a:hover {
    background: url("../svg/footer_ico_facebook_on.svg") center no-repeat;
    background-size: 100%;
  }
  #footer .link_wrap .sns_wrap ul li.youtube a:hover {
    background: url("../svg/footer_ico_youtube_on.svg") center no-repeat;
    background-size: 100%;
  }
}

#footer .link_wrap .copy_wrap {
  padding-top: max(calc(28px * var(--base-ratio)), calc(calc(28 / var(--base-size)) * var(--base-percent)));
}
#footer .link_wrap .copy_wrap p {
  font-size: max(calc(14px * var(--base-ratio)), calc(calc(14 / var(--base-size)) * var(--base-percent)));
  line-height: 1.2857142857;
  letter-spacing: -0.02em;
  font-weight: 500;
  color: #666;
}

/* 반응형 */
@media (max-width: 1024px) {
  #footer {
    min-height: inherit;
  }
  #footer .logo {
    position: static;
    left: 0;
    top: 0;
    transform: translate(0, 0);
    margin: 0 auto;
    width: max(calc(90px * var(--base-ratio)), calc(calc(90 / var(--base-size)) * var(--base-percent)));
    height: max(calc(24px * var(--base-ratio)), calc(calc(24 / var(--base-size)) * var(--base-percent)));
  }
  #footer .sitemap_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: normal;
    margin: max(calc(16px * var(--base-ratio)), calc(calc(16 / var(--base-size)) * var(--base-percent))) auto max(calc(8px * var(--base-ratio)), calc(calc(8 / var(--base-size)) * var(--base-percent)));
    text-align: center;
  }
  #footer .sitemap_wrap li {
    margin-top: 0;
    margin-left: max(calc(12px * var(--base-ratio)), calc(calc(12 / var(--base-size)) * var(--base-percent)));
  }
  #footer .sitemap_wrap li:first-child {
    margin-left: 0;
  }
  #footer .sitemap_wrap a {
    display: block;
    font-size: max(calc(12px * var(--base-ratio)), calc(calc(12 / var(--base-size)) * var(--base-percent)));
    line-height: 1.3333333333;
    letter-spacing: -0.02em;
  }
  #footer .link_wrap {
    position: static;
    text-align: center;
  }
  #footer .link_wrap .copy_wrap {
    padding-top: 0;
  }
  #footer .link_wrap .copy_wrap p {
    font-size: max(calc(12px * var(--base-ratio)), calc(calc(12 / var(--base-size)) * var(--base-percent)));
    line-height: 1.3333333333;
    letter-spacing: -0.02em;
  }
  #footer .link_wrap .sns_wrap {
    position: static;
    padding-top: max(calc(8px * var(--base-ratio)), calc(calc(8 / var(--base-size)) * var(--base-percent)));
  }
  #footer .link_wrap .sns_wrap ul {
    justify-content: center;
  }
}

@media (max-width: 767px) {
  #footer .logo {
    width: max(calc(148px * var(--base-ratio)), calc(calc(148 / var(--base-size)) * var(--base-percent)));
    height: max(calc(40px * var(--base-ratio)), calc(calc(40 / var(--base-size)) * var(--base-percent)));
  }
}
