@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0;padding:0}
fieldset,img {border:0 none;vertical-align:top;}
dl,ul,ol,li {list-style:none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}
input,select,textarea,button {vertical-align:middle}
button {border:0 none;background-color:transparent;cursor:pointer}
body {background:#fff}
body,th,td,input,select,textarea,button {font-size:14px;line-height:1.5;font-family:'NanumSquare',Malgun Gothic,"맑은 고딕",AppleGothic,Dotum,"돋움",sans-serif;color:#fff} /* color값은 디자인가이드에 맞게사용 */
input[type="text"], input[type="password"] {font-family: Malgun Gothic,"맑은 고딕",AppleGothic,Dotum,"돋움",sans-serif;}
a {color:#333;text-decoration:none}
a:active, a:hover {text-decoration:none;}
address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal}

#wrap {
    width: 100%;
    height: 100vh;
    background: url('bg.png') center no-repeat;
    background-size: cover;
}
.container {
    position: relative;
    width: 1200px;
    height: calc(100vh - 100px);
    margin: 0 auto;
    padding-top: 100px;
    text-align: center;
}
.logo-top h3 {
    margin-top: 24px;
    font-size: 24px;
    font-weight: 300;
    color: #fff;
}
.logo-top h3:after {
    content: '';
    display: block;
    width: 60px;
    height: 1px;
    background: #fff;
    margin: 40px auto 127px;
}
.logo-list li {
    display: inline-block;
    padding: 0 60px;
    vertical-align: middle;
}
.logo-list li img {
    transition: 0.3s;
}
.logo-list li:hover img {
    transform: scale(1.2);
}
.footer {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 30px 0;
    border-top: 1px solid #fff;
}
.footer .left-info {
    float: left;
    text-align: left;
}
.footer .left-info h1 {
    font-size: 18px;
}
.footer .left-info p {
    font-size: 13px;
    line-height: 1.733;
}
.footer .left-info p img {
    padding-right: 4px;
    vertical-align: middle;
}
.footer .right-info {
    float: right;
    padding: 10px;
    border: 1px solid #fff;
}
.footer .right-info h2 {
    font-size: 16px;
    font-weight: 300;
}
.footer .right-info p {
    font-size: 14px;
}

@media (max-width: 1300px) {
    .container {
        width: 90%;
    }
    .logo-list li {
        padding: 0 10px;
    }
    .logo-list li img {
        width: 90%;
    }
    .footer .left-info p {
        font-size: 12px;
    }
}
@media (max-width:767px) {
    #wrap {
        height: auto;
    }
    .container {
        height: auto;
        padding-top: 50px;
    }
    .logo-top img {
        width: 50%;
    }
    .logo-top h3 {
        font-size: 20px;
    }
    .logo-top h3:after {
        margin: 20px auto 50px;
    }
    .logo-list li {
        padding: 20px 0;
    }
    .logo-list li img {
        width: 50%;
    }
    .footer {
        position: static;
        margin-top: 40px;
    }
    .footer .left-info, .footer .right-info {
        float: none;
    }
    .footer .right-info {
        margin-top: 20px;
    }
}