main {    
    /* height: 100vh; */
    background-image: url(../img/login_bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background: url(../img/login_bg.png) no-repeat center/cover;
    margin: auto;
    padding: auto;
}
#ofb-login-container {    
    display: flex;
    align-items: center;
    justify-content: center;
    padding:100px 20px;
}
#ofb-login-content {
    min-width:340px;
    max-width:768px;        
    width:100%;
    margin:auto;
    padding:0px 10px;
    background-color: #ffffff77;
    border-radius: 7px;
}
#ofb-login-content > * {
    display:block;        
}
#ofb-login-content > ui {
    height: 48px;    
    margin: 10px;
}
#ofb-login-content > div {    
    margin:30px 0px;
    width:100%;
    height:100%;
    display: flex;
    align-items: center;
    justify-content: center;          
}
.login-content-btn {
    position: relative;
    width:100%;
    height:100%;
    border-radius: 10px;
    border-width: 0px;
    text-align: left;
    padding:0px;
}
.login-content-btn:active {
    opacity: 0.7;
    filter: alpha(opacity=90);    
}
.login-content-btn > * {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.login-content-btn > img {    
    left:12px;
    width:34px;
    height:auto;
    text-overflow:ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.login-content-btn > .vertical-line {
    left: 60px;
    height: 50%;
}
.login-content-btn > strong {
    left: 76px;
}
.login-content-btn > .test {
    left: 76px;
    text-overflow:ellipsis;
    overflow: hidden;
    white-space: nowrap;
    /* overflow: hidden;white-space: nowrap; */
}
.login-content-btn > .rang {
    right: 16px;
}
.kakao-btn {
    background-color: #ffea34;
    color:#000000;
}
.kakao-btn > .vertical-line {
    border-left: 1px solid #000;
}
.naver-btn {
    background-color: #05dd42;
    color:#ffffff;
}
.naver-btn > .vertical-line {
    border-left: 1px solid #fff;
}
.google-btn {
    background-color: #ffffff;
    color:#000000;
}
.google-btn > .vertical-line {
    border-left: 1px solid #000;
}
.facebook-btn {
    background-color: #1859bb;
    color:#ffffff;
}
.facebook-btn > .vertical-line {
    border-left: 1px solid #fff;
}
#ofb-goback-btn {
    width:70px;
    height:70px;
    background-image: url(../img/goback.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;    
    cursor:pointer;
}
#ofb-goback-btn:hover, #ofb-goback-btn:focus {  
    background-image: url(../img/goback_hover.png);
}