/* comm */
html { font-family:sans-serif; -webkit-text-size-adjust:100%; -webkit-tap-highlight-color:rgba(0,0,0,0) }
body { margin:0; background-color:#F4F4F4; color:#495057; text-align:left; }
* { font-family:'Nanum Gothic', 'Roboto', sans-serif; line-height:150%; }

a.Link1 { color:#E9FF20; cursor:pointer; text-decoration:none; }
a.Link1:hover { color:#FFFFFF; }

a.Link2 { color:#FFFFFF; cursor:pointer; text-decoration:none; }
a.Link2:hover { color:#D74B4B; }

a.Link3 { color:#FFFFFF; cursor:pointer; text-decoration:none; }
a.Link3:hover { color:#E9FF20; }


.input_txt { position:relative; float:left; padding:6px 0px 0px 10px; width:70px; font-size:11px; color:#000000; text-align:left; }



.input1 { position:relative; float:left; height:32px; text-align:start; padding:5px; border:1px solid #BABEC5; font-size:11px; color:#000000; transition-duration:0.25s; box-sizing:border-box; border-radius:3px; vertical-align:middle; }
.input1:hover { box-shadow:0 0 0 2px #DFE0E2; }
.input1:focus { border:1px solid #2EA21E; box-shadow:0 0 0 2px #DFE0E2; }


.input2 { position:relative; height:32px; text-align:start; padding:5px; border:1px solid #BABEC5; font-size:11px; color:#000000; transition-duration:0.25s; box-sizing:border-box; border-radius:3px; vertical-align:middle; }
.input2:hover { box-shadow:0 0 0 2px #DFE0E2; }
.input2:focus { border:1px solid #2EA21E; box-shadow:0 0 0 2px #DFE0E2; }


.input3 { position:relative; height:32px; text-align:left; padding:2px; border:1px solid transparent; font-size:11px; color:#000000; background-color:transparent; }


.select1 { position:relative; float:left; height:32px; text-align:start; padding:5px; border:1px solid #BABEC5; font-size:11px; color:#000000; transition-duration:0.25s; box-sizing:border-box; border-radius:3px; vertical-align:middle; }
.select1:hover { box-shadow:0 0 0 2px #DFE0E2; }
.select1:focus { border:1px solid #2EA21E; box-shadow:0 0 0 2px #DFE0E2; }


.select2 { position:relative; height:32px; text-align:start; padding:5px; border:1px solid #BABEC5; font-size:11px; color:#000000; transition-duration:0.25s; box-sizing:border-box; border-radius:3px; vertical-align:middle; }
.select2:hover { box-shadow:0 0 0 2px #DFE0E2; }
.select2:focus { border:1px solid #2EA21E; box-shadow:0 0 0 2px #DFE0E2; }



.btn1 { position:relative; float:left; height:30px; text-align:center; border:1px solid #404040; font-size:11px; color:#FFFFFF; background-color:#404040; cursor:pointer; transition-duration:0.25s; box-sizing:border-box; border-radius:3px; vertical-align:middle; }
.btn1:hover { box-shadow:0 0 0 2px #DFE0E2; background-color:#000000; }

.btn2 { position:relative; height:30px; text-align:center; border:1px solid #404040; font-size:11px; color:#FFFFFF; background-color:#404040; cursor:pointer; transition-duration:0.25s; box-sizing:border-box; border-radius:3px; vertical-align:middle; }
.btn2:hover { box-shadow:0 0 0 2px #DFE0E2; background-color:#000000; }


.btn3 { position:relative; float:left; height:30px; text-align:center; border:1px solid #cccccc; font-size:11px; color:#404040; background-color:#FFFFFF; cursor:pointer; transition-duration:0.25s; box-sizing:border-box; border-radius:3px; vertical-align:middle; }
.btn3:hover { box-shadow:0 0 0 2px #DFE0E2; background-color:#000000; }

.btn4 { position:relative; height:30px; text-align:center; border:1px solid #cccccc; font-size:11px; color:#404040; background-color:#FFFFFF; cursor:pointer; transition-duration:0.25s; box-sizing:border-box; border-radius:3px; vertical-align:middle; }
.btn4:hover { box-shadow:0 0 0 2px #DFE0E2; background-color:#000000; }

.space5 { position:relative; width:100%; height:5px; clear:both; }
.space10 { position:relative; width:100%; height:10px; clear:both; }
.space20 { position:relative; width:100%; height:20px; clear:both; }
.space30 { position:relative; width:100%; height:30px; clear:both; }
.space50 { position:relative; width:100%; height:50px; clear:both; }


td { font-size:11px; }


.relative { position:relative; top:0px; left:0px; text-align:left; }

#pagebox { position:relative; top:0px; left:0px; width:100%; }


.loading { display:none; z-index:100; position:fixed; top:50%; left:50%; width:50px; height:50px; margin-left:-25px; margin-top:-25px; background:url('/outdata/images/loading.gif') no-repeat; background-size:50px 50px; }


/* top 위 오른쪽 아래 왼쪽 */
.boxTop { z-index:15; position:fixed; top:0px; left:0px; right:0px; height:60px; background-color:#2B3D4C; }
.boxTopLogo { position:absolute; left:50%; width:160px; margin-left:-80px; text-align:center; padding:16px 0px 14px 0px; top:0px; font-size:20px; font-weight:800; cursor:pointer; }
.boxTopLogin { position:absolute; right:60px; padding:18px 0px 16px 0px; top:0px; font-size:18px; font-weight:800; cursor:pointer; }



/* login */
.boxLogin { position:absolute; top:15px; left:15px; right:15px; bottom:15px; }
.boxLoginTitle { position:relative; top:0px; left:5px; padding:10px; width:300px; border-bottom:1px dotted #cccccc; font-size:15px; font-weight:700; color:#000000; text-align:left; margin-bottom:10px; }


.im-menu { position:absolute; left:0px; padding:20px; top:0px; font-size:20px; }
.im-users { position:absolute; right:0px; padding:20px; top:0px; font-size:20px; }


/* menu */
.boxLeftMenu { z-index:10; position:fixed; top:60px; bottom:0px; left:0px; width:250px; background-color:#FFFFFF; overflow-x:hidden; overflow-y:scroll; border-right:1px solid #cccccc; box-shadow:0px 0px 10px #cccccc; }
.boxLeftMenu::-webkit-scrollbar { width:2px;  }
.boxLeftMenu::-webkit-scrollbar-thumb { height:100px; background-color:#444444; }


.boxLeftMenuTitle { position:relative; top:0px; left:10px; width:205px; background-color:#000000; color:#FFFFFF; padding:10px 10px 10px 15px; font-size:11px; text-align:left; margin-top:20px; }
.boxLeftMenuLink { position:relative; top:0px; left:10px; width:210px; background-color:#FFFFFF; color:#000000; padding:10px; font-size:11px; text-align:left; margin-top:10px; border-bottom:1px dotted #cccccc; cursor:pointer; }
.boxLeftMenuLink:hover { background-color:#FFFFC0; border-bottom:1px solid #000000; }



.boxRightLogin { display:none; z-index:20; background-color:#FFFFFF; overflow:hidden; border:1px solid #cccccc;
                 -moz-border-radius:5px; -webkit-border-radius:5px; -ms-border-radius:5px; -o-border-radius:5px; border-radius:5px; box-shadow:0px 0px 10px #cccccc; }

.boxLeftMenuTop { position:absolute; top:0px; left:0px; width:250px; height:60px; background-color:#263644; }
@media(max-width:575px) {
    .boxLeftMenu { display:none; }
    .boxTopLogin { display:none; }
    .boxRightLogin { position:fixed; top:70px; left:50%; margin-left:-180px; width:360px; height:220px; }
}
@media(min-width:576px) and (max-width:767px) {
    .boxLeftMenu { display:none; }
    .boxTopLogin { display:none; }
    .boxRightLogin { position:fixed; top:70px; right:10px; width:360px; height:220px; }
}
@media(min-width:768px) and (max-width:991px) {
    .boxLeftMenu { display:none; }
    .boxTopLogin { display:none; }
    .boxRightLogin { position:fixed; top:70px; right:10px; width:360px; height:220px; }
}
@media(min-width:992px) and (max-width:1199px) {
    .boxLeftMenu { display:none; }
    .boxTopLogin { display:block; }
    .boxRightLogin { position:fixed; top:70px; right:10px; width:360px; height:220px; }
}
@media(min-width:1200px) {
    .boxLeftMenu { display:none; }
    .boxTopLogin { display:block; }
    .boxRightLogin { position:fixed; top:70px; right:10px; width:360px; height:220px; }
}
.boxLeftMenuTitleBg { position:relative; left:0px; width:100%; height:40px; cursor:pointer; }



/* content */
.boxContainer { position:relative; top:0px; margin-top:70px; left:0px; width:100%; }
.boxContainerInner { position:relative; padding-right:15px; padding-left:15px; margin-top:20px; margin-left:auto; margin-right:auto; }
@media(max-width:575px) {
    .boxContainerInner { min-width:340px; max-width:545px; }
}
@media(min-width:576px) and (max-width:767px) {
    .boxContainerInner { min-width:546px; max-width:737px; }
}
@media(min-width:768px) and (max-width:991px) {
    .boxContainerInner { min-width:738px; max-width:961px; }
}
@media(min-width:992px) and (max-width:1199px) {
    .boxContainerInner { min-width:962px; max-width:1169px; }
}
@media(min-width:1200px) {
    .boxContainerInner { min-width:1170px; }
}


.LocationTxt { position:relative; top:0px; left:0px; width:100%; font-size:11px; text-align:left; padding:10px 0px 5px 0px; margin-bottom:20px; border-bottom:1px dotted #cccccc; color:#000000; }








/* footer */
.boxFooter { display:none; position:relative; top:0px; left:0px; width:100%; height:300px; background-color:#2B3D4C; }
@media(max-width:575px) {
    .boxFooter { min-width:340px; max-width:545px; }
}
@media(min-width:576px) and (max-width:767px) {
    .boxFooter { min-width:546px; max-width:737px; }
}
@media(min-width:768px) and (max-width:991px) {
    .boxFooter { min-width:738px; max-width:961px; }
}
@media(min-width:992px) and (max-width:1199px) {
    .boxFooter { min-width:962px; max-width:1169px; }
}
@media(min-width:1200px) {
    .boxFooter { min-width:1170px; }
}