@charset "utf-8";

/* login */
#logWrap {position:absolute;background:url('../img/common/bg_login.png') no-repeat;width:100vw;background-size:cover;height:100vh;}
#logWrap .logInner {position:absolute;}
#logWrap h1 {text-align:center;font-family:'NanumSquare';font-weight:600;margin-bottom:35px;color:#fff;}
#logWrap .logBox {background:#161d2b;border-radius:10px;overflow:hidden;padding-bottom:10px;}
#logWrap .logBox h2 {padding:20px 30px;background:url('../img/common/bg_tit_log.png') 100% 15% no-repeat #161d2b;background-size:90%;font-family:'NanumSquare';font-size:20px;font-weight:600;color:#fff;}
#logWrap .logBg .txt_dsc {font-size:14px;line-height:22px;border-bottom:1px dashed #ddd;padding-bottom:20px;margin-bottom:20px;}
#logWrap .logBg .logCheck {margin-left:90px;}
#logWrap .logBg .logInput {width:100%;margin:5px 0 15px;}
#logWrap .logBg .logInput:after {display:block;content:'';clear:both;}
#logWrap .logBg .logInput dt, #logWrap .logBg .logInput dd {float:left;margin:5px 0;font-size:14px;height:36px;}
#logWrap .logBg .logInput dt {width:90px;line-height:36px;font-weight:bold;}

#logWrap .logBg .logInput dd input {width:100%;height:30px;}
#logWrap .logBg .logBtn {background:#00edaf;border-radius:4px;padding:10px 0;border:none;font-family:'NanumSquare';font-size:17px;font-weight:600;color:#fff;cursor:pointer;}
#logWrap .logInfo {background:#f1f1f1;padding:15px 30px;text-align:center;}
#logWrap .logInfo ul {width:100%;}
#logWrap .logInfo ul:after {display:block;content:'';clear:both;}
#logWrap .logInfo ul li {float:left;color:#777;font-size:13px;}
#logWrap .logInfo ul li:first-child {margin-left:0;padding-left:0;background:none;}
#logWrap .logInfo ul li strong {margin-right:5px;}

@media all and (max-width:478px) {
    /*#logWrap {height:125vh;}*/
    #logWrap h1 {font-size:30px;line-height:30px;}
    #logWrap .logInner {padding:15% 10px 0;/*position:absolute;top:50%;margin-top:-395px;*/}
    #logWrap .logBg {padding:177px 30px 30px 30px;background:url('../img/common/bg_log_monitor.png') 50% 7% no-repeat #fff;background-size:50%;}
    #logWrap .logBox {width:100%;}
    #logWrap .logBg .txt_dsc {text-align:center;}
    #logWrap .logBg .logBtn {width:100%;}
    #logWrap .logBg .logInput dt {width:20%;}
    #logWrap .logBg .logInput dd {width:72%;padding-left:7%;display:inline-block;}
}

/*아이패드*/
@media all and (min-width:479px) and (max-width:768px) {
    #logWrap {min-width:700px;}
    #logWrap h1 {font-size:38px;line-height:38px;}
    #logWrap .logInner {width:700px;position:absolute;left:50%;top:50%;margin:-274px 0 0 -350px;}
    #logWrap .logBg {padding:60px 30px 60px 290px;background:url('../img/common/bg_log_monitor.png') 1% 50% no-repeat #fff;}
    #logWrap .logBox {width:700px;}
    #logWrap .logBg .logBtn {width:280px;margin-left:90px;}
    #logWrap .logBg .logInput dt {width:90px;}
    #logWrap .logBg .logInput dd {width:280px;}
    #logWrap .logInfo ul li {margin-left:15px;background:url('../img/common/footer_bg.gif') 0 50% no-repeat;padding-left:15px;}
}

/*아이패드프로*/
@media all and (min-width:769px) and (max-width:1024px) {
    #logWrap {min-width:800px;}
    #logWrap h1 {font-size:38px;line-height:38px;}
    #logWrap .logInner {width:800px;position:absolute;left:50%;top:50%;margin:-274px 0 0 -400px;}
    #logWrap .logBg {padding:60px 30px 60px 400px;background:url('../img/common/bg_log_monitor.png') 10% 50% no-repeat #fff;}
    #logWrap .logBox {width:800px;}
    #logWrap .logBg .logBtn {width:280px;margin-left:90px;}
    #logWrap .logBg .logInput dt {width:90px;}
    #logWrap .logBg .logInput dd {width:280px;}
    #logWrap .logInfo ul li {margin-left:15px;background:url('../img/common/footer_bg.gif') 0 50% no-repeat;padding-left:15px;}
}

@media (min-width:1024px) and (max-width:1200px) {
    #logWrap {min-width:800px;}
    #logWrap h1 {font-size:38px;line-height:38px;}
    #logWrap .logInner {width:800px;position:absolute;left:50%;top:50%;margin:-274px 0 0 -400px;}
    #logWrap .logBg {padding:60px 30px 60px 400px;background:url('../img/common/bg_log_monitor.png') 10% 50% no-repeat #fff;}
    #logWrap .logBox {width:800px;}
    #logWrap .logBg .logBtn {width:280px;margin-left:90px;}
    #logWrap .logBg .logInput dt {width:90px;}
    #logWrap .logBg .logInput dd {width:280px;}
    #logWrap .logInfo ul li {margin-left:15px;background:url('../img/common/footer_bg.gif') 0 50% no-repeat;padding-left:15px;}
}

/* PC */
@media all and (min-width:1200px) {

    #logWrap {min-width:800px;}
    #logWrap h1 {font-size:38px;line-height:38px;}
    #logWrap .logInner {width:800px;position:absolute;left:50%;top:50%;margin:-274px 0 0 -400px;}
    #logWrap .logBg {padding:60px 30px 60px 400px;background:url('../img/common/bg_log_monitor.png') 10% 50% no-repeat #fff;}
    #logWrap .logBox {width:800px;}
    #logWrap .logBg .logBtn {width:280px;margin-left:90px;}
    #logWrap .logBg .logInput dt {width:90px;}
    #logWrap .logBg .logInput dd {width:280px;}
    #logWrap .logInfo ul li {margin-left:15px;background:url('../img/common/footer_bg.gif') 0 50% no-repeat;padding-left:15px;}

}