/* footer */
#footer {background: #fff; overflow: hidden; border-top: 1px solid #ddd;}
#footer .content-inner {padding: 45px 0; display: flex; justify-content: space-between;}
#footer .link-area {border-bottom: 1px solid rgba(214, 215, 221, .25); margin-bottom: 25px; padding-bottom: 25px;}
#footer .sns-area {display: flex; align-items: center;}
#footer .sns-area .link-sns {display: block;}
#footer .sns-area .side-bar {display: inline-block; width: 1px; height: 25px; background: rgba(158, 189, 129, .43); vertical-align: middle; margin: 0 15px;}
#footer .sns-area .link-sns i[class^="ico-"] {width: 30px; height: 30px; background-position: center; vertical-align: middle;}
#footer .link-sns .ico-naverstore {background-image: url("../img/ico_naverstore.png");}
#footer .link-sns .ico-instagram {background-image: url("../img/ico_instagram.png");}
#footer .link-sns .ico-youtube { background-image: url("../img/ico_youtube.png");}

#footer .group-info {margin: 25px 0 35px;}
#footer .group-info .info-area {display: flex; flex-wrap: wrap; max-width: 700px; margin-bottom: 7px;}
#footer .info-area p {font-size: 12px; font-weight: 300; color: #8a9293; line-height: 1.83;}
#footer .info-area p + p:not(:nth-child(5))::before {content: ''; display: inline-block; width: 1px; height: 12px; background: #8a9293; margin: 0 6px; vertical-align: -1px;}
#footer .copyright {font-size: 12px; font-weight: 300; color: rgba(138, 146, 147, 0.5);}
#footer .copyright a::before {content: ''; display: inline-block; width: 1px; height: 12px; background: rgba(138, 146, 147, 0.5); vertical-align: -2px; margin: 0 7px 0 4px;}

.ft-btn {width: 155px; padding: 8px 0; display: flex; justify-content: center; align-items: center; background: #2f4820; font-size: 10px; font-weight: 300; color: #fff !important; transition: .3s;}
.ft-btn:hover {background: #486b33;}

#footer .shortcut-area {display: flex;}
#footer .shortcut-box + .shortcut-box {margin-left: 30px;}
#footer .shortcut-box .title {display: block; margin-bottom: 20px; font-size: 17px; font-weight: 500; color: #15320c;}
#footer .shortcut-box .link-shortcut {position: relative; display: block; width: 140px; padding: 8px 12px; background: #525659; z-index: 1;}
#footer .shortcut-box .link-shortcut::before {content: ''; position: absolute; right: 0; top: 0; width: 0; height: 100%; background: #1d1f21; transition: .4s; z-index: -1;}
#footer .shortcut-box .link-shortcut:hover::before {left: 0; width: 100%;}
#footer .shortcut-box .link-shortcut span {display: flex; align-items: center; justify-content: space-between; font-size: 10px; font-weight: 300; color: #fff;}
#footer .shortcut-box .link-shortcut span::after {content: ''; display: inline-block; width: 5px; height: 8px; background: url("../img/shortcut_arrow.png") no-repeat center; float: right;}

#top-btn {position: fixed; right: 20px; bottom: 20px; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; border: 1px solid #333; color: #333; font-size: 15px; background: rgba(255, 255, 255, .5); z-index: 9; transition: .3s; pointer-events: none; opacity: 0;}
#top-btn:hover {border-color: #2e481f; background: #2e481f; color: #fff;}
.scrolled #top-btn {opacity: 1; pointer-events: auto;}