@CHARSET "UTF-8";

/* basic setting */
html {position: relative;min-height: 100%;}
body {margin-bottom: 60px;}
.footer {position: absolute;bottom: 0;width: 100%;height: 60px;background-color: #f5f5f5;}
.container {width: auto;min-width: 900px;padding: 0 15px;}
.container .text-muted {margin: 20px 0;}
#contents {padding: 10px 20px 70px 20px;}

img{border:none;vertical-align:bottom}
html, body, div, h1, h3, img, span, thead, tbody { margin:0; padding:0; font-size:12px; }
body{ overflow-x:auto; background:#ffffcc; padding-top: 50px; }
h2 { padding-bottom:10px; font-size:18px; font-weight: bold;}
h3 { padding-bottom:10px; font-size:15px; font-weight: bold;}
a{text-decoration:none;color:#444}
ol,ul,li{list-style:none}
fieldset{border:none}
legend,caption,hr{display:none;visibility:hidden}
table,td,th{border-collapse:collapse; text-align:center; }
textarea {resize: none; wrap:hard;}

/* 부트스트랩 CSS 보정 */
.table>thead>tr>th,.table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>td,.table>tbody>tr>td,.table>tfoot>tr>td{vertical-align:middle;}
. { border:1px solid #e1e1e1; }
. { border:1px solid #e1e1e1; }
.dropdown-menu>li>a { font-size:13px; }
.input-sm {padding-top:3px;}


/* 기본 css 스타일 */
.table-wrapper { padding:20px; }
.small {font-size:11px; color:gray; }
.orange { color:orange; }
.red { color:red; }
.blue { color:blue; }
.white { color:white; }
.fltR{float:right !important;}
.fltL{float:left !important;}
.center{text-align:center !important;}
.vcenter { vertical-align: middle; }
.left{text-align:left !important;}
.right{text-align:right !important;}
.clear{clear:both}
.bold{font-weight:bold;font-size:13px;}
.title{font-weight:bold;font-size:15px;color:#000}
.blind{display:none;}
.dInline {display:inline;}
.dInlineBlock {display:inline-block;}
.dBlock {display:block;}
.nOverflow{overflow:hidden;}
.nCutStr{overflow:hidden;text-overflow:ellipsis;width:100%;}
.lineHlittle { line-height:20px; }
.lineH{line-height:30px;}
.lineH:after{content:"";display:block;clear:both;}
.marginAuto { margin:0px auto; }
.marginAll { margin:6px; }
.marginT { margin-top:10px; }
.marginT-sm { margin-top:6px; }
.marginB-sm { margin-bottom:10px; }
.marginL { margin-left:6px; }
.marginR { margin-right:6px; }
.marginLR { margin-left:6px; margin-right:6px; }
.marginB { margin-bottom:30px; }
.paddingT { padding-top:10px; }
.paddingB { padding-bottom:10px; }
.paddingL { padding-left:10px; }
.paddingR { padding-right:10px; }
.paddingA { padding:10px; }
.width50 { width:50px; }
.width80 { width:80px; }
.width100 { width:100px; }
.width120 { width:120px; }
.width150 { width:150px; }
.width200 { width:200px; }
.width250 { width:250px; }
.width300 { width:300px; }
.width400 { width:400px; }
.width500 { width:500px; }
.width600 { width:600px; }
.widthHalf { width:50%; }
.width90p { width:90%; }
.widthFull { width:100%; }
.borderR { border-right:1px solid #e1e1e1; }
.warn { color:#f9534f; margin-left: 5px; }
.info { color:#39b3d7; margin-left: 5px; }
.thBgcolor { color:#000; background-color:#c9c9c9; font-family:dotum; font-weight:normal; }
.bgColor1 { background-color:#dddddd; }
.bgColor2 { background-color:#bbbbbb; }
.bgColor3 { background-color:#ffff00; }
.tdTitle { background-color:#fafafa; }

.wordBreak { -ms-word-break: break-all; word-break: break-all;
  word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto;
}

.r_level_1 {background-color: #ffff00D0;}
.r_level_2 {background-color: #f39800D0;}
.r_level_3 {background-color: #ff0000D0;}
.r_level_4 {background-color: #0000ffD0;}
.r_level_9 {background-color: #808080D0;}


/* clearfix */
.clearfix:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
.clearfix{display:inline-block}
html[xmlns] .clearfix{display:block}
* html .clearfix{height:1%}

/* 관리자 헤더 및 푸터 */
#wrapper{min-height:720px;overflow:hidden;}
#header *, #header *:after, #header *.before {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}


/* dimmed_layer */
#dimmed_layer {width:100%; height:100%; background:#000; opacity:0.7; position:fixed; z-index:10000;}
#loading_image {position:absolute; top:50%; left:50%; margin:-64px 0 0 -64px; width:128px; height:128px; background: url("images/loading-light.gif") no-repeat; z-index:10001;}

/* 에러 메세지 */
#error_alert { position:absolute; max-height:40%; z-index: 20000;}
#error_alert ul { float: left; overflow: auto; list-style-type: none; }
#error_alert ul ul { float: right; }

#loading{
    border:1px dashed #999;
    padding:15px;
    position: fixed;
    top:50%;
    left:50%;
    background-color:#FFF;
    filter: alpha(opacity=85);
    -moz-opacity:0.85;
    opacity:0.85;
}

#loading .loadingMsg{
    text-align:center;
    padding-top:100px;
    width:100px;
    background-image:url("../images/loading.gif");
    background-position: center top;
    background-repeat: no-repeat;
}

.blink {
  animation: blinker 1s linear 5;
}
@keyframes blinker {
  50% {
    opacity: 0;
  }
}

.popupDetail {
    z-index:20000;
    background: #ffffff;
    position:fixed;
    top:10%;
    left:10%;
    border:5px solid #E0E0E0;
    width:900px;
    height:400px;
}
.upload_button {
    padding: 10px 20px;
    border-radius: 5px;
    display: inline-block;
    position: relative;
    width: 180px;
}

.top {vertical-align: top !important;}
.status-circle {border-radius: 40%;}

/* navbar  for sandbox */
.sandbox .navbar { background:#2B606B;}
.sandbox .navbar-inverse .navbar-nav>li>a { color: #9DB8CC;}
.sandbox .navbar-inverse .navbar-nav>li>a:hover  {color: #9DD3EB;}
.sandbox .navbar-inverse .navbar-nav>.active>a {color: #9DD3EB;}
.sandbox .navbar-brand {color: #9DB8CC;}
.sandbox a.navbar-brand:hover {color: #9DD3EB;}

.new_tag {background-color:purple;color:#fff;}
.modify_tag {background-color:olive;color:#fff;}
.volume_tag {background-color:navy;color:#fff;}
.episode_tag {background-color:green;color:#fff;}
.material_tag {background-color:orange;color:#fff;}
.comic_tag {background-color:indianred;color:#fff;}
.smartoon_tag {background-color:mediumvioletred;color:#fff;}
.novel_tag {background-color:blue;color:#fff;}
.remain_days {background-color:red;color:#fff;}

.coin { background-color: #FFCC00;color: #fff; display: inline-block; width: 16px; height: 16px; border-radius: 50%; text-align:center; line-height: 16px; font-size:8px;}