@import url('//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css');

#footer{
    width:100%;
    background-color: #fff;
    /* padding: 30px 0px 20px; */
    padding: 4.5rem 0;
    border-top:1px solid #e1e1e1;
    font-size: 18px;
    bottom:0;
    transition:transform 0.5s;
    z-index:99;
}
#footer .f-btn-{
    position:absolute;
    right:10%;
    width:40px;
    height:40px;
    background:#fff;
    font-size:40px;
    top:0;
    transform:translateY(-100%);
    border:1px solid #e1e1e1;
    display:none;
    cursor: pointer;
}
#footer.foot_main.transition-up .f-btn-{
    display:flex;
    align-items: center;
    justify-content: center;
}
#footer.foot_main.transition-up{
    position:fixed;
    bottom:0;
    transform:translateY(0%);
}
#footer.bottom-::before{
    position:absolute;
    z-index:2;
    width:100vw;
    height:100vh;
    left:50%;
    bottom:0%;
    transform:translateX(-50%);
    content:'';
}
.foo-inner{
    width:1200px;
    display: flex;
    flex-direction: column;
    margin:0 auto;
}

.ft_icon{
    font-size:47px;
    color:#888;
}

.foo-info{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.foo-info p{
    font-size:18px;
    margin:0;
}

.foo_copy{
    margin-top:45px; text-align: center;
}

.foo-info ul{
    margin:14px 0 0;
    max-height: 150px;
}

.f-tab{
    overflow-y: auto;
}

.foo-info ul li{
    font-size:18px;
    color:#000000;
}
.foo-info ul li a{
    color:inherit;
}
.foo-tp{
    width:100%;
    padding-bottom: 25px;
    border-bottom: 1px solid #ddd;
    display: flex;align-items: center;
    justify-content: space-between;
}
.foo-tp>ul{
    display: flex;align-items: center;
}
.foo-tp>ul li:not(:first-child){
    margin-left:20px;
}
.foo-tp>ul li{
    font-size: 18px;
    font-weight: 500;
}
.family-tab{
    border-bottom:1px solid #666;
    padding:10px 20px;
    display: flex;align-items: center;
    justify-content: space-between;
    width:360px;height: 45px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    position: relative;
}
.f-tab{
    position: absolute;
    top:100%;
    left:0;
    background-color: #fff;
    width:100%;
    border:1px solid #666;
    display: none;
}
.f-tab li{
    width:100%;height: 45px;
    padding:10px 20px;
    font-size: 14px;
}
.f-tab li:hover{
    background-color: #fbfbfb;
}
.foo-btm{
    padding-top:25px;
    display: flex;align-items: flex-start;
    justify-content: space-between;
}
.foo-lt li{
    font-size: 14px;
    color:#666;
    margin-top:5px;
}
.foo-lt li:last-child{
    margin-top:20px;
}
.foo-rt .phone{
    display: flex;
}
.foo-rt .phone li{
    text-align: right;
    font-size: 18px;
    color:#666
}
.foo-rt .phone li:last-child{
    margin-left:20px;
}
.foo-rt .sns{
    display: flex;justify-content: flex-end;
    align-items: center;
    margin-top:20px;
}
.foo-rt .sns li a{
    font-size: 45px;
    color:#666;
}
.foo-rt .sns li:not(:last-child){
    margin-right:20px;
}
@media screen and (max-width:1400px) {
    .foo-inner{
        width:1200px;
    }
    .foo-inner .logo{
        width:15%;
    }
    .foo-inner .logo img{
        width:100%;
    }
}
@media screen and (max-width:1240px) {
    .family-tab{
        width:250px;
    }
}
@media screen and (max-width:1000px) {
    .foo-inner{
        flex-flow: row wrap;
    }
    .foo-inner .logo{
        width:100%;
    }
    .foo-info{
        width:100%;
    }
    .foo-inner .logo img{
        width:auto;
    }
    .foo-tp>ul li{
        font-size: 14px;
    }
    .foo-tp>ul{
        width:100%;
        margin-top:20px;
    }
    .foo-tp{
        flex-flow: row wrap;
    }
    .family-tab{
        font-size: 14px;
        margin-top:15px;
    }
    .foo-btm{
        flex-flow: row wrap-reverse;
    }
}
@media screen and (max-width:700px) {
    .foo-inner{
        width:90%;
    }

    .foo_copy{
        font-size: 11px;
        width: 100%;
    }

    .foo-btm{
        flex-flow: row wrap-reverse;
    }
    .foo-lt{
        width:100%;
    }
    .foo-rt{
        width:100%;
        text-align: left;
    }
    .foo-rt .sns{
        justify-content: flex-start;
    }
    .foo-rt .phone li{
        font-size: 16px;
    }
}



.cn-footer {padding: 80px 0; border-top: 1px solid #E8EDF2; background: #fff; color: #333;}
.cn-footer, .cn-footer * {box-sizing: border-box;}
.cn-footer a {color: inherit; text-decoration: none;}
.cn-footer__inner {width: min(1160px, calc(100% - 48px)); margin-inline: auto;}
.cn-footer__logo {display: block; width: 180px; height: 48px; overflow: hidden; background: url("/rent/img/renew/foot_logo.png") no-repeat center left / contain;}
.cn-footer__logo:has(img) {background: transparent;}
.cn-footer__logo img {display: block; width: 100%; height: 100%; object-fit: contain; object-position: left center;}
.cn-footer__main {display: grid; grid-template-columns: minmax(0, 1fr) 340px; align-items: start; gap: 48px; margin-top: 40px;}
.cn-footer__company {min-width: 0;}
.cn-footer__company-name {margin: 0 0 6px; font-size: 17px; font-weight: 600; line-height: 1.6;}
.cn-footer__address {display: flex; flex-direction: column; align-items: flex-start; gap: 5px; margin: 0; color: #666; font-size: 16px; font-style: normal; line-height: 1.7; letter-spacing: -0.025em; word-break: keep-all; overflow-wrap: anywhere;}
.cn-footer__address a:hover {color: #54C3F1;}
.cn-footer__policies {display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 18px;}
.cn-footer__policies a {color: #777; font-size: 15px; line-height: 1.5;}
.cn-footer__policies strong {color: #444; font-weight: 700;}
.cn-footer__policies a:hover {color: #54C3F1;}
.cn-footer__side {min-width: 0;}
.cn-footer__family {position: relative;}
.cn-footer__family-toggle {display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 52px; padding: 12px 16px; border: 1px solid #DCE4EA; border-radius: 10px; background: #fff; color: #444; font-size: 15px; font-weight: 600; line-height: 1.5; list-style: none; cursor: pointer; transition: border-color 0.2s, background 0.2s;}
.cn-footer__family-toggle::-webkit-details-marker {display: none;}
.cn-footer__family-toggle::marker {content: "";}
.cn-footer__family-toggle i {flex-shrink: 0; color: #777; font-size: 13px; transition: transform 0.2s;}
.cn-footer__family[open] .cn-footer__family-toggle {border-color: #54C3F1; background: #EFFAFF; color: #54C3F1;}
.cn-footer__family[open] .cn-footer__family-toggle i {transform: rotate(180deg); color: #54C3F1;}
.cn-footer__family-menu {position: absolute; right: 0; bottom: calc(100% + 10px); left: 0; z-index: 50; max-height: min(340px, 55vh); max-height: min(340px, 55dvh); overflow-y: auto; overscroll-behavior: contain; padding: 8px; border: 1px solid #E0E9EF; border-radius: 14px; background: #fff; box-shadow: 0 10px 32px rgba(20, 40, 60, 0.14); scrollbar-width: thin; scrollbar-color: #BFDCEC #F5F8FB;}
.cn-footer__family-list {margin: 0; padding: 0; list-style: none;}
.cn-footer__family-list li {margin: 0; padding: 0; list-style: none;}
.cn-footer__family-list a {display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 44px; padding: 11px 12px; border-radius: 8px; color: #555; font-size: 15px; line-height: 1.5; transition: background 0.2s, color 0.2s;}
.cn-footer__family-list a:hover {background: #EFFAFF; color: #54C3F1;}
.cn-footer__family-list a i {flex-shrink: 0; color: #99A9B5; font-size: 13px;}
.cn-footer__family-disabled {display: block; padding: 11px 12px; color: #AAA; font-size: 14px; line-height: 1.5;}
.cn-footer__sns {display: flex; align-items: center; gap: 16px; margin-top: 22px;}
.cn-footer__sns a {display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: #54C3F1; color: #fff; transition: background 0.2s, color 0.2s, transform 0.2s;}
.cn-footer__sns i {font-size: 24px;}
.cn-footer__sns a:hover {transform: translateY(-3px);}
.cn-footer__copyright {margin: 48px 0 0; padding-top: 28px; border-top: 1px solid #EEF1F4; color: #999; font-size: 13px; line-height: 1.7; text-align: center; overflow-wrap: anywhere;}
.cn-footer a:focus-visible, .cn-footer__family-toggle:focus-visible {outline: 2px solid #54C3F1; outline-offset: 4px;}
.cn-footer__sr-only {position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;}

@media (max-width: 1024px) {
    .cn-footer__main {grid-template-columns: minmax(0, 1fr) 300px; gap: 32px;}
    .cn-footer__address {font-size: 15px;}
}

@media (max-width: 767px) {
    .cn-footer__main {grid-template-columns: minmax(0, 1fr); gap: 32px; margin-top: 28px;}
    .cn-footer__side {width: 100%; max-width: 400px;}
    .cn-footer__sns {gap: 12px; margin-top: 20px;}
    .cn-footer__copyright {margin-top: 36px; text-align: left;}
}

@media (max-width: 600px) {
    .cn-footer__inner {width: calc(100% - 40px);}
    .cn-footer__logo {width: 160px; height: 44px;}
    .cn-footer__company-name {font-size: 16px;}
    .cn-footer__address {font-size: 14px;}
    .cn-footer__policies {gap: 12px 16px;}
    .cn-footer__policies a {font-size: 14px;}
    .cn-footer__side {max-width: none;}
    .cn-footer__family-toggle {font-size: 14px;}
    .cn-footer__copyright {font-size: 12px;}
}

@media (prefers-reduced-motion: reduce) {
    .cn-footer__family-toggle, .cn-footer__family-toggle i, .cn-footer__family-list a, .cn-footer__sns a {transition: none;}
}

/* 이웃간 차량공유 (ngb_index) */

/* 푸터 글자 크기 */
.footer .footer-top > div a, .footer .footer-policy {font-size: 13px; line-height: 1.6;}
.footer .footer-policy {font-family: inherit;}
.footer .footer-info p {margin: 0 0 6px; font-size: 13px; line-height: 1.8; word-break: keep-all;}
.footer .footer-info strong {font-size: 14px; font-weight: 700;}
.footer .footer-info span {font-size: inherit;}
.footer .footer-bottom p, .footer .footer-bottom > span {font-size: 12px; line-height: 1.6;}

/* 모바일 */
@media (max-width: 600px) {
  .footer .footer-top > div a, .footer .footer-policy {font-size: 12px;}
  .footer .footer-info p {font-size: 12px;}
  .footer .footer-info strong {font-size: 13px;}
  .footer .footer-bottom p, .footer .footer-bottom > span {font-size: 11px;}
}

/* 푸터 사업자정보 */
.cn-footer__company {min-width: 0;}
.cn-footer__company .cn-footer__business-info {display: grid; gap: 8px; margin: 0; color: #7b8e99; font-size: 13px; font-style: normal; font-weight: 400; line-height: 1.4;}
.cn-footer__company .cn-footer__info-row {display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 20px;}
.cn-footer__company .cn-footer__info-row > strong {margin-right: 10px; color: #456474; font-size: 16px; font-weight: 700;}
.cn-footer__company .cn-footer__info-row > span, .cn-footer__company .cn-footer__info-row > a {min-width: 0; color: inherit; font-size: 16px; overflow-wrap: anywhere;}
.cn-footer__company .cn-footer__info-row > a {text-decoration: none;}
.cn-footer__company .cn-footer__info-row > a:hover {color: #54C3F1; text-decoration: underline;}

/* 모바일 */
@media (max-width: 767px) {
  .cn-footer__company .cn-footer__business-info {gap: 10px; font-size: 12px;}
  .cn-footer__company .cn-footer__info-row {gap: 4px 14px;}
  .cn-footer__company .cn-footer__info-row > strong {margin-right: 0; font-size: 13px;}
}

@media (max-width: 480px) {
  .cn-footer__company .cn-footer__info-row {flex-direction: column; align-items: flex-start; gap: 2px;}
}