/* 
---------------------------------------------
footer
--------------------------------------------- 
*/
footer { background: rgba(154, 154, 154, 0.2); }
footer .bg { width: 100%; height: 317px; background: #0050D0; border-radius: 100px 100px 0px 0px; }
footer .bg .container { position: relative; height: 100%; }
footer .bg .container .box { position: absolute; }
footer .bg .container .box.infos { top: 61px; left: 0; }
footer .bg .container .box.contact { top: 50%; right: 0; display: flex; transform: translateY(-50%); }
footer .bg .container .box.copyright { bottom: 25px; left: 0; }
footer .bg .container .box.infos > .info { margin-bottom: 11px; }
footer .bg .container .box.infos > .info:last-child { margin-bottom: 0; }
footer .bg .container .box.infos > .info > img { width: 21.45px; height: 20.16px; margin-right: 35.55px; }
footer .bg .container .box.infos > .info > span { font-family: IBM Plex Sans KR; font-size: 15px; font-weight: 500; line-height: 22.5px; color: #FFFFFF; word-break: keep-all; }
footer .bg .container .box.contact > img { width: 110px; height: 110px; margin-right: 34px; content: url('/images/footer-img-contact.png'); }
footer .bg .container .box.contact > img:hover { content: url('/images/footer-img-contact-hover.png'); cursor: pointer; }
footer .bg .container .box.contact > span { font-family: GT Walsheim Trial; font-size: 54.4px; line-height: 58.4px; font-weight: 500; color: #FFFFFF; display: flex; align-items: center; }
footer .bg .container .box.copyright > span { font-family: IBM Plex Sans KR; font-size: 15px; font-weight: 400; line-height: 22.5px; color: #FFFFFF; }

/* 
---------------------------------------------
responsive
--------------------------------------------- 
*/
@media (max-width: 1299px) {
    footer .bg .container .box.contact { right: 4%; }
    footer .bg .container .box.contact > img { width: 100px; height: 100px; margin-right: 30px; }
    footer .bg .container .box.contact > span { font-size: 45px; }
}

@media (max-width: 1200px) {
    footer .bg .container .box.contact { right: 0%; }
    footer .bg .container .box.contact > img { width: 90px; height: 90px; margin-right: 25px; }
    footer .bg .container .box.contact > span { font-size: 40px; }
}

@media (max-width: 992px) {
    footer .bg .container .box.contact > img { width: 80px; height: 80px; margin-right: 19px; }
    footer .bg .container .box.contact > span { font-size: 31px; }
}

@media (max-width: 767px) {
    footer .bg { height: auto; padding: 6vw 0; }
    footer .bg .container .box { position: initial; }
    footer .bg .container .box.contact { transform: initial; margin: 3vw 0; }
    footer .bg .container .box.infos > .info { margin-bottom: 0.7vw; }
    footer .bg .container .box.infos > .info > span { font-size: 14px; }
    footer .bg .container .box.infos > .info:last-child { margin-bottom: 0; }
    footer .bg .container .box.infos > .info > img { margin-right: 4vw; }
    footer .bg .container .box.contact > img { width: 10vw; height: 10vw; }
    footer .bg .container .box.contact > span { font-size: 4vw; }
    footer .bg .container .box.copyright > span { font-size: 14px; }
}

@media (max-width: 575px) {
    footer .bg { border-radius: 30px 30px 0px 0px; padding: 7vw 0; }
    footer .bg .container { padding-left: 7vw; padding-right: 6vw; }
    footer .bg .container .box.infos > .info > img { margin-right: 1.5vw; width: 16.08px; height: 15.12px; }
    footer .bg .container .box.infos > .info > span { font-size: 3vw; letter-spacing: -0.4px; }
    footer .bg .container .box.contact { margin: 4vw 0; }
    footer .bg .container .box.contact > img { width: 13vw; height: 13vw; }
    footer .bg .container .box.contact > span { font-size: 4.4vw; line-height: normal; }
    footer .bg .container .box.copyright > span { font-size: 3vw; letter-spacing: -0.4px;
    }

}