/*font*/
html, body{min-width:320px;}
body{font-family:"Apple SD Gothic Neo", Roboto, Helvetica, arial, "Malgun Gothic","나눔고딕", "Nanum Gothic", Dotum, "돋움", "Open Sans", sans-serif}
ul{margin:0;padding:0;padding-left:0}
li{position:relative}
/*box*/
.wrapper-content{padding:0px 0px 40px 0px}
@media (max-width:767px) {
  .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7,
  .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9{padding-right:10px;padding-left:10px !important;}
  .m-l-visible{margin-left:15px}
  .m-t-visible{margin-top:5px}
}
/*title*/
h1,h2,h3,h4,h5,h6{font-family: Roboto, 나눔고딕;font-weight:600;}
h2 {font-size:20px;}

img{width:100%;height:auto;}
label{color:#000}
select{cursor:pointer}
select:hover{background:#f9f9f9}
.form-control{border:1px solid #dadada;}
.form-control.color-control{border: 1px solid #DA2929}
.form-control:focus, .single-line:focus{border-color: #463c3c !important;}
.control-label{font-size:14px;color:#676a6c}
.cursor-p{cursor:pointer}
.link-toTop{position:fixed;width:45px;height:45px;z-index:100;right:0; bottom:25px;background:#fff;border:1px solid #a8a8a8;font-size:20px;text-align:center;color:#a6a6a6;padding:8px;border-radius:4px;opacity:.7}

/*navigator*/
/*개편 후 지우기*/
.minimalize-styl-2{background:#514a4a !important;color:#fff !important;border:1px solid #514a4a !important;}
.minimalize-styl-2:hover,.minimalize-styl-2:hover:focus{color:#fff !important}
.page-heading {border-top:0;padding:0px 10px 15px 10px;}
@media (min-width:768px) {
  .page-heading h2{font-size:20px;margin-top:15px;margin-bottom:5px}
  .breadcrumb li{font-size:12px}
}
@media (max-width:479px) {
  .page-heading{padding:0px 10px 10px 10px;}
  .page-heading h2{font-size:16px;margin-top:10px;}
  .breadcrumb{display:none}
}
/*//개편 후 지우기*/



.tabs-container{ margin-top: 20px}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus{
  outline: none;
}

/* 출간예약 리스트 */
#ReservationList{
  padding: 20px;
  box-sizing: border-box;
  border: 0 none;
  padding-top: 0
}
#ReservationList .area_box{
  border-radius: 8px;
  border: 1px solid #DFDFDF;
  background: #F5F5F5;
  padding: 24px;
  box-sizing: border-box;
}
#ReservationList .area_box .top_con .tit_box p{
  display: inline-block;
  vertical-align: middle;
  font-weight: 600;
  font-size: 15px;
  margin: 0;
  padding: 0
}
#ReservationList .area_box .top_con .tit_box .tit{
  color: #000
}
#ReservationList .area_box .top_con .tit_box .num{
  color: #ED5565
}
#ReservationList .area_box .top_con .tit_box .button{
  margin-left: 6px
}
#ReservationList .area_box .top_con .tit_box .button button{
  padding: 0;
  margin: 0;
  cursor: pointer;
  width: 24px;
  height: 24px;
  background: #fff;
  border-radius: 4px ;
  border: 1px solid #C1C4C6;
  color: #333;
}
#ReservationList .area_box .top_con .tit_box .button button.on{
  transform: rotate(180deg);
}
#ReservationList .area_box .top_con .desc{
  color: #ED5565;
  font-size: 13px;
  line-height: 18px;
  margin-top: 10px;
  word-break: keep-all;
}
#ReservationList .area_box .top_con .desc span{
  text-decoration-line: underline;
  font-weight: bold;
}
#ReservationList .area_box .bottom_con .list{
  margin-top: 16px
}
#ReservationList .area_box .bottom_con .list li{
  font-size: 0
}
#ReservationList .area_box .bottom_con .list li:not(:last-of-type) {
  margin-bottom: 10px;
}
#ReservationList .area_box .bottom_con .list span{
  display: inline-block;
  font-size: 14px;
  vertical-align: middle;
  margin-right: 12px
}
#ReservationList .area_box .bottom_con .list span:last-child{
  margin-right: 0
}
#ReservationList .area_box .bottom_con .list .stit{
  color: #333;
  font-weight: bold;
}
#ReservationList .area_box .bottom_con .list .date{
  color: #666;
}
#ReservationList .area_box .bottom_con .list .date::before{
  display: inline-block;
  content: '';
  width: 1px;
  height: 12px;
  background: #E0E0E0;
  vertical-align: middle;
  margin-right: 12px;
}
#ReservationList .area_box .bottom_con .list .button button{
  border-radius: 2px;
  border: 1px solid #C1C4C6;
  background: #FFF;
  padding: 8px;
  color: #463C3C;
  margin: 0;
  cursor: pointer;
  line-height: 1;
  box-sizing: border-box;
}
#ReservationList .area_box .bottom_con .list .button button.default{
  cursor: default;
  background: #ddd;
  color: #888
}
/*ibox*/
.ibox-content{padding:15px;font-size:14px;}
.ibox-tools{position: absolute; right: 25px; top: 9px}
.ibox-tools a.btn-default{color:#463c3c}
.ibox-tools a.btn-default:hover,.ibox-tools a.btn-default:focus{color:#463c3c}
@media (max-width:479px) {
  .ibox-content{padding:5px}
  .m-l-hidden{margin-left:0px !important}
}
.contact-box{margin-bottom:10px}
/*well*/
.well{background-color:#f7f7f7;border:1px solid #e7eaec;}
/*switch*/
.switchery{height:25px}
.switchery > small{width:25px;height:25px}
/*modal*/
.bp-modal{background:rgba(0,0,0,.45)}
.bp-modal .modal-header{padding:10px;height:42px;width:100%}
.bp-modal .modal-header .close{margin-top:-4px;filter:alpha(opacity=70);opacity:.7}
.bp-modal .modal-header .close:hover{filter:alpha(opacity=100);opacity:1}
.bp-modal .modal-header .bi-close{font-size:22px}
.bp-modal .modal-dialog{min-width:320px;position:relative}
.bp-modal .modal-title{font-size:15px;color:#000}
.bp-modal .modal-body{background:#f7f7f7;padding:25px 10px}
.bp-modal.bp-notice .modal-body{padding:0}
.bp-modal .md-title{color:#000;font-size:16px;font-weight:700}
.bp-modal .modal-footer{padding:0;height:50px;width:100%}
.bp-modal .modal-footer .btn{height:100%;border:none;border-radius:0;font-size:16px}
.bp-modal .btn-one .btn{width:100%}.bp-modal .btn-two .btn{width:50%}
.bp-modal .btn-two .btn:first-child{float:left;border:1px solid #ddd}
.bp-modal .btn-two .btn+.btn{margin-left:0}
.bp-modal .btn-two-one .btn{border-top:1px solid #ddd}
.bp-modal .btn-two-one .btn:first-child{float:left;width:60%;border-right:1px solid #ddd}
.bp-modal .btn-two-one .btn+.btn{margin-left:0;width:40%}
.bp-modal .ibox-content{padding:15px}
.bp-modal .ibox-content input{color:#333}
.bp-modal input,.bp-modal select{font-size:16px;padding:6px 0;color:#000;border-width:0 0 1px;border-color:#ddd;height:35px;line-height:35px}
.bp-modal .modal-sm .modal-footer .btn{font-size:16px}
.md-transparent .modal-body,.md-transparent .modal-content{background-color:transparent;box-shadow:none;border:0;padding:0}
@media (max-width:767px){.bp-modal .modal-body{padding:25px 0}}
@media (min-width:768px){.bp-modal .modal-sm{width:480px}.m-r-hidden{margin-right:15px}}
/*notice modal*/
.md-notice .txt-notice{font-size:15px;white-space:pre-line;padding:20px;height:450px;overflow-y:scroll;}
.md-notice .btn-notice .btn{border-radius:30px;padding:10px 30px;font-size:15px}
@media (min-width:768px){.md-notice .btn-notice .btn{width:45%}.md-notice .btn-notice .btn+.btn{margin-left:5%}}
@media (max-width:767px){.md-notice .btn-notice .btn+.btn{margin-left:2%}}


/* 대량등록 리스트 디자인 */
#up_list_result{
  margin: 32px 0
}
#up_list_result table{
  margin: 0
}
#label_upload_check{
  display: block;
  text-align: center;
  color: #222;
  font-size: 15px;
  line-height: 1
}
#label_upload_check span{
  color: #C62125;
  display: inline-block;
  margin-left: 5px;
}
#up_list thead tr th button{
  margin: 0 auto;
  display: block;
}
#up_list thead tr th{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#up_list_result tbody,
#up_list tbody{
  background: #fff;
}
#up_list_result tr td,
#up_list tbody tr td{
  vertical-align: middle;
}
#up_list tbody tr td div{
  max-height: 44px;
  text-overflow: ellipsis;
  overflow: hidden;
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical
}
#up_list table{
  max-height: 458px;
}
#up_list table.max_height{
  max-height: 300px;
}
/*** 일괄출간 새로운 모달 디자인 ***/
.new_modal{
  text-align: center;
  padding: 0 !important;
}
.new_modal :focus-visible {
  outline: 0
}
.new_modal .modal-header{
  padding: 14px 0;
  min-height: auto;
  border-bottom: 0 none;
  height: auto
}
.new_modal .modal-header .modal-title{
  font-size: 16px;
  color: #222;
  line-height: 24px;
}
.new_modal .modal-dialog{
  border-radius: 0;
  max-width: 422px;
  width: calc(100% - 20px);
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}
.new_modal .modal-content{
  border-radius: 0;
  border: 0 none;
  box-shadow: 0 none;
}
.new_modal .modal-body{
  background: #f5f5f5;
  padding: 32px
}
.new_modal .title{
  font-size: 0;
  color: #222;
  line-height: inherit;
  margin: 0 ;
  padding: 0;
  margin-bottom: 16px
}
.new_modal .title span{
  font-size: 14px;
}
.new_modal .title .checkbox{
  padding: 0;
  margin: 0;
  display: inline-block;
  padding-left: 13px;
  vertical-align: top;
}
.new_modal .title .checkbox label{
  padding: 0;
}
.new_modal .title .checkbox label span{
  display: inline-block;
  vertical-align: middle;
  font-size: 13px;
}
.new_modal .checkbox input[type="checkbox"]{
  opacity: 0;
  z-index: 1;
}
.new_modal .checkbox label::before{
  top: 0;
  border: 0 none;
  background: url(/_statics/factoryplus/images/checkbox_w.svg) no-repeat center;
  border-radius: 0;
  vertical-align: middle;
  position: static;
  margin: 0;
  padding: 0;
  margin-right: 6px;
  outline-offset: inherit;
}
.new_modal .checkbox input[type="checkbox"]:checked + label::after{
  content: '';
  background: url(/_statics/factoryplus/images/checkbox_red.svg) no-repeat center;
  width: 20px;
  left: 0;
  bottom: 0;
  margin: 0;
  line-height: 1;
  height: 20px;
  top: auto
}
.new_modal .btn-two .btn:first-child{
  border: 0 none;
  background: #DBDBDB;
  padding: 12px 10px;
  font-size: 14px;
  color: #333
}
.new_modal .btn-two .btn:last-child{
  border: 0 none;
  background: #C62125;
  padding: 12px 10px;
  font-size: 14px;
  color: #fff
}
.new_modal .time_box{
  background: #fff;
  border: 1px solid #E0E0E0;
  border-radius: 8px;
  padding: 4px 8px;
  position: relative;
}
.new_modal .time_box input{
  background: none;
  border: 0 none;
  width: 100%;
  font-size: 14px;
  color: #333;
  height: 24px;
  line-height: inherit;
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  cursor: pointer;
}
.new_modal .time_box button{
  position: absolute;
  right: 8px;
  top: 4px;
  padding: 0;
  margin: 0;
  background: none;
  border: 0 none
}
.new_modal .time_box button img{
  width: 16px
}
.new_modal .modal-footer{
  border-top: 0
}
@media screen and (min-width: 768px) {
  .new_modal::before {
    display: inline-block;
    vertical-align: middle;
    content: "";
    height: 100%;
  }
}
@media screen and (max-width: 600px) {

  #ReservationList .area_box .bottom_con .list .stit{
    display: block;
    margin: 0;
    margin-bottom: 4px;
  }
  #ReservationList .area_box .bottom_con .list .date::before{
    display: none;
  }
  #ReservationList .area_box .bottom_con .list li:not(:last-of-type){
    margin-bottom: 20px
  }
}
@media screen and (max-width: 368px) {

  .select_box .right{
    float: none;
    margin-top: 12px
  }

}
/* 출간예약 모달 */
.new_modal :focus{
  outline: 0;
  outline-offset: 0;
  box-shadow: none;
}
#reserve_open_pub{
  font-size: 14px;
  line-height: inherit;
  color: #222
}
.select_box .input_text{
  border-radius: 8px;
  border: 1px solid #E0E0E0;
  min-width: 98px;
  max-width: 358px;
  padding: 9px 8px;
  font-size: 14px;
  min-height: 32px;
  margin-right: 4px;
  background: #fff;
  text-align: left;
  line-height: 14px;
  display: inline-block;
  box-sizing: border-box;
  vertical-align: middle;
}
.select_box .left{
  float: left;
  margin-right: 12px
}
.select_box .right{
  float: left;
}
#reserve_open_pub .left .input_text{
  background: #ECECEC;
  text-align: center;
  min-width: 74px;
  cursor: default;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.new_modal .date_box{
  margin-top: 32px
}
.new_modal .list_box{
  margin-top: 16px;
}
.new_modal .list_box .s_title{
  color: #999;
  font-size: 12px;
  line-height: 13px;
}
.new_modal .list_box .s_title .num{
  color: #C62125;
  font-weight: bold
}
.new_modal .list_box .list{
  margin-top: 8px;
  border-radius: 10px;
  border: 1px solid #E0E0E0;
  overflow: hidden;
}
.new_modal .list_box .list .header_list{
  font-size: 0;
  background: #fff;
}
.new_modal .list_box .list .header_list span,
.new_modal .list_box .list .body_list span{
  display: inline-block;;
  padding: 8px 12px;
  font-size: 12px;
  color: #AEAEAE;
  text-align: center;
  vertical-align: top;
}
.new_modal .list_box .list .body_list span{
  display: table-cell;
  vertical-align: middle;
}
.new_modal .list_box .list .header_list span:first-child,
.new_modal .list_box .list .body_list span:first-child{
  width: 80px;
}
.new_modal .list_box .list .header_list span:last-child,
.new_modal .list_box .list .body_list span:last-child{
  width: calc(100% - 80px)
}
.new_modal .list_box .list .body_list{
  background: #fff;
  font-size: 0;
  max-height: 140px;
  overflow-y: auto;
}
.new_modal .list_box .list .body_list .th_left{
  background: #ECECEC;
  font-weight: 600;
  text-align: center;
  color:#333

}
.new_modal .list_box .list .body_list>li{
  border-top: 1px solid #E0E0E0
}
.new_modal .list_box .list .body_list span:last-child{
  padding: 8px 12px;
  color: #666;
  text-align: left;
}
.sm_modal .modal-dialog{
  max-width: 280px;
  min-width: 280px;
}
.sm_modal .modal-content{
  padding: 20px;
  box-sizing: border-box;
  border-radius: 4px;
}
.sm_modal .modal-body{
  background: #fff;
  padding: 0;
  text-align: center;
}
.sm_modal .modal-body .desc{
  line-height: 21px;
  word-break: keep-all;
  color: #333
}
.sm_modal .sm_btn{
  text-align: center;
  margin-top: 16px
}
.sm_modal .sm_btn button{
  line-height: 1;
  width: auto;
  margin: 0;
  padding: 10px 20px;
  border-radius: 4px;
  background: #C62125;
}
.sm_modal .sm_btn button span{
  display: block;
  width: 60px;
  font-size: 15px;
  line-height: 1;
  color: #fff
}

/* 공모전 중단신청 모달 */
#md-requestStop {
  text-align: center;
}
#md-requestStop #book_stop_form {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}
#md-requestStop .modal-dialog{
  max-width: 422px;
}

#md-requestStop .modal-content{
  border-radius: 0 ;
}
#md-requestStop .modal-header{
  padding: 14px 0;
  position: relative;
  border: 0 none;
  border-bottom: 1px solid #f0f0f0;
  height: 52px
}
#md-requestStop .modal-header .modal-title{
  color: #222;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}
#md-requestStop .modal-header .close{
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 15px;
  opacity: 1;
}
#md-requestStop .modal-body{
  padding: 20px;
  text-align: left;
  background: #fff;
}
#md-requestStop .modal-body .control-label{
  color: #C62125 !important;
  font-weight: 600;
  line-height: 20px;
  font-size: 14px
}
#md-requestStop .modal-body textarea.form-control{
  padding: 16px;
  border-radius: 8px;
  border: 1px solid #E9E9E9;
  background: #FFF;
  line-height: 1.6;
  min-height: 112px;
  box-sizing: border-box;
  font-size: 13px
}
#md-requestStop .bp-notice{
  margin-top: 20px;
}
#md-requestStop .bp-notice label{
  font-size: 13px;
  font-weight: bold;
  line-height: 20px;
  color:#555;
  margin: 0
}
#md-requestStop .bp-notice ul li{
  font-size: 13px;
  line-height: 20px;
  letter-spacing: -0.5px;
  color:#555;
  padding-left: 8px;
}
#md-requestStop .bp-notice ul li:before{
  content: '·';
  top: 0;
}
#md-requestStop .modal-footer{
   border: 0 none;
  height: auto;
  text-align: center;
  padding: 4px 35px 35px;
  font-size: 0;
}
#md-requestStop .modal-footer button{
  line-height: 42px;
  width: 128px;
  margin: 0;
  padding: 0;
  border-radius: 9px;
  opacity: 1;
  float: none !important;
  width: 49%
}
#md-requestStop .modal-footer button:last-child{
  margin-left: 2%
}
#md-requestStop .btn-default.disabled,
#md-requestStop .btn-default.disabled:hover,
#md-requestStop .btn-default.disabled:focus,
#md-requestStop .btn-default.disabled:active,
#md-requestStop .btn-default.disabled.active,
#md-requestStop .btn-default[disabled],
#md-requestStop .btn-default[disabled]:hover,
#md-requestStop .btn-default[disabled]:focus,
#md-requestStop .btn-default[disabled]:active,
#md-requestStop .btn-default.active[disabled],
#md-requestStop fieldset[disabled] .btn-default,
#md-requestStop fieldset[disabled] .btn-default:hover,
#md-requestStop fieldset[disabled] .btn-default:focus,
#md-requestStop fieldset[disabled] .btn-default:active,
#md-requestStop fieldset[disabled] .btn-default.active{
  background: #ECECEC;
  border: 0 none;
  color: #C0C0C0
}
#md-requestStop .btn-default:active,
#md-requestStop .btn-default:active:focus,
#md-requestStop .btn-default:focus,
#md-requestStop .btn-default:hover,
#md-requestStop .btn-default{
  background:#C62125 ;
  color: #fff;
  border: 0 none
}

@media screen and (min-width: 768px) {
  #md-requestStop::before {
    display: inline-block;
    vertical-align: middle;
    content: "";
    height: 100%;
  }
}

/* cover down modal*/
.md-coverDown .close{position:absolute;top:0;right:0;color:#fff;opacity:1;padding:15px;text-shadow:1px 1px 2px rgba(51,51,51,.8)}
.md-coverDown .cover{height:auto}.md-coverDown figure{position:relative;max-width:450px;margin:0 auto}
.md-coverDown figcaption{background:#cacaca;padding:15px;color:#000;margin-top:5px}
.md-coverDown .btn-download{font-size:18px;letter-spacing:-1.5px;width:100%;color:#ccc;background:#221e1e;padding:15px}
.md-coverDown .btn-download:hover{text-decoration:underline}
/*button*/
.btn{border-radius:2px}
.btn-default{background:#fff;color:#463c3c;border:1px solid #c1c4c6;font-weight:600}
.btn-default.active{background:#514a4a}
.btn-default:active,.btn-default:active:focus,.btn-default:focus,.btn-default:hover{background:#fafafa;color:#463c3c;border:1px solid #b7b7b7}
.btn-default.disabled,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-info.disabled,.btn-info.disabled:focus,.btn-info.disabled:hover{background:#d6d6d6;color:#666;border:1px solid #aaa}
.btn-info{background:#514a4a;color:#fff;border:1px solid #514a4a}
.btn-info:focus,.btn-info:hover{background:#463c3c;color:#fff;border:1px solid #463c3c}
.btn-primary,.btn-primary:focus,.btn-primary:hover{background:#1ab394;color:#fff;border:1px solid #1ab394}
.btn-warning{background:#c62125;color:#fff;border:1px solid #c62125}
.btn-warning:active,.btn-warning:active:focus,.btn-warning:focus,.btn-warning:hover{background:#be2326;color:#fff;border:1px solid #be2326}
.btn-cancel{background:#dbdbdb;color:#333;border:1px solid #d4d4d4}
.btn-cancel:focus,.btn-cancel:hover{background:#d1d1d1;color:#333;border:1px solid #c4c4c4}
.btn-white{background:#fff;color:#333}.btn-white:focus,.btn-white:hover{background:#eee;color:#333}
.btn-transparent{background:0 0}
.btn-danger.btn-outline{background:#fff;color:#e45453;border:1px solid #c1c4c6;font-weight:600}
.btn-danger.btn-outline:active,.btn-danger.btn-outline:active:focus,.btn-danger.btn-outline:focus,.btn-danger.btn-outline:hover{background:#efefef;color:#e45453;border:1px solid #b7b7b7}
.btn-success.btn-outline{background:#fff;color:#2288CD;border:1px solid #c1c4c6;font-weight:600}
.btn-success.btn-outline:active,.btn-success.btn-outline:active:focus,.btn-success.btn-outline:focus,.btn-success.btn-outline:hover{background:#efefef;color:#2288CD;border:1px solid #b7b7b7}

/*button size*/
.btn-sm{padding:0 10px; height: 34px; line-height: 34px}
.btn-lg{font-size:17px}
/*footer button*/
.con-footer .btn{padding:12px;width:170px;}
.con-footer .btn-default{padding:13px 12px}
@media (max-width:991px) {.con-footer .btn{width:140px;font-size:15px;}}
 /*tab custom*/
.tabs-container .nav-tabs>li>a{color:#909090;padding:10px 40px;font-size:16px;text-align:center;background:#e6e6e6;border-top:3px solid #d2d2d2}
.tabs-container .nav-tabs>li:hover a{background:#eaeaea;color:#8d8d8d;border-top:3px solid #d2d2d2}
.tabs-container .nav-tabs>li.active>a,.tabs-container .nav-tabs>li.active>a:focus,.tabs-container .nav-tabs>li.active>a:hover{color:#ed5565;border-top:3px solid #ed5565}
@media all and (max-width:767px){
  .tabs-container .nav-tabs.two>li{width:50%}
  .tabs-container .nav-tabs.three>li{width:33%}
  .tabs-container .nav-tabs.four>li{width:25%}
}
@media (max-width:479px){
  .tabs-container .nav-tabs.four>li{width:50%}
}
@media (min-width:351px) and (max-width:767px){.tabs-container .nav-tabs>li>a{font-size:14px;padding:10px 2px}}
@media all and (max-width:350px){.tabs-container .nav-tabs>li>a{font-size:13px;padding:8px 0}}
.tabs-container .tab-pane .panel-body{margin-bottom:15px}
/*border*/
.b-all{border:1px solid #e7eaec}
.b-all-dot{border:1px dotted #ddd}
.b-t{border-top:1px solid #e7eaec}
.b-t-dot{border-top:1px dotted #ddd}
.b-r{border-right:1px solid #e7eaec}
.b-r-dot{border-right:1px dotted #ddd}
.b-b{border-bottom:1px solid #e7eaec}
.b-b3{border-bottom:3px solid #e7eaec}
.b-b-dash{border-bottom:1px dashed #ddd}
.b-l{border-left:1px solid #e7eaec}
.bp-line-height{line-height:1.5}
/*noinfo*/
.noinfo{padding:80px 0;text-align:center;font-size:14px;line-height:1.5;cursor:initial}
.noinfo-lg{padding:150px 0;text-align:center;font-size:17px;line-height:1.7}
.noinfo-lg a{padding:10px 40px}
.noinfo .bi-bookpal,.noinfo-lg .bi-bookpal{font-size:50px;color:#d1d1d1}
/*color*/
.text-red{color:#c62125}
.text-danger{color:#ed5565 !important}
.text-primary{color:#463c3c}
.text-brown{color:#8d7458}
/*checkbox*/
.checkbox-success input[type="checkbox"]:checked + label::before, .checkbox-success input[type="radio"]:checked + label::before{
  background-color: #1ab394;border-color: #1ab394;}
.checkbox-info input[type="checkbox"]:checked + label::before, .checkbox-success input[type="radio"]:checked + label::before{
  background-color: #463c3c;border-color: #463c3c;}
/*radio custom*/
.bp-radio{float:left;margin-right:-1px;text-align:center}
.bp-radio input[type=radio]{display:none;}
.bp-radio input[type=radio]+label{width:100%;cursor:pointer;padding:8px 0px;font-weight:normal;background:#fff;color:#888;border:1px solid #dadada;transition:all .15s ease-out;}
.bp-radio input[type=radio]:checked+label{background:#5f6f7a;color:#fff;}
/* table */
.table-bordered>thead>tr>th,.table-bordered>thead>tr>td,table .td-head{background:#f8f8f8}
.table>thead>tr>th,.table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>td,.table>tbody>tr>td,.table>tfoot>tr>td{color:#333;font-size:14px;}
.table-hover>tbody>tr:hover{background:#f9f9f9}
/*icomoon*/
.bi-writer-a,.bi-writer-b,.bi-writer-c,.bi-writer-d,.bi-writer-e{font-size:20px;vertical-align:sub;}
.bi-writer-a{color:#ea5e58}
.bi-writer-b{color:#915fa7}
.bi-writer-c{color:#5c8cc9}
.bi-writer-d{color:#f8a01a}
.bi-writer-e{color:#5aa650}
.bi-arrow-r{font-size:10px}
.bi-crown{color:#ffd216}
.bi-mnpoly,.bi-serials,.bi-free-txt,.bi-fest{background:#202020;color:#fff;opacity:.9;filter:alpha(opacity=90);font-size:20px;position:absolute;bottom:0px;right:0}
.a-more .bi-arrow-d{font-size:12px;}
.bi-adult{color:#fff;background:#a9a9a9;border-radius:50%;border:1px solid #606060;font-size:16px;display:inline-block;height:18px;width:18px;vertical-align:text-bottom;}
/*mark*/
.mark{font-size:13px;}
.mark-conclude{padding:1px 3px;background:#476cc2;color:#fff;}
.mark-event{cursor:pointer;padding:1px 8px;background:#1ab394;color:#ffffff;}
.mark-blind{padding:1px 5px;background:#6c6c6c;color:#fff;}
.mark-stop{padding:1px 5px;background: #df4140;color:#fff;}
.mark-adult{padding:1px 3px;background:#ed5565;color:#fff;}
.mark-mnpoly{padding:1px 5px;background:#202020;color:#fff}
.mark-info{background:#b6b6b6;color:#fff}
.mark-free{background:#32a3b0;color:#fff}
.mark-new{width:13px;height:13px;line-height:13px;margin-left:2px;display:inline-block;font-size:12px;color:#fff;text-align:center;font-weight:normal;}
.mark-tip{font-size:17px;font-weight:normal;vertical-align:text-bottom;color:#a7a7a7}
/*common*/
/*float menu*/
.float-nav{position:fixed;bottom:5%;right:5%;width:60px;height:60px;z-index:102;}
.float-nav .btn-toggle{color:#fff;border-radius:50%;background:#3f7fb7;border:0;box-shadow: 2px 2px 8px #777;-moz-box-shadow: 2px 2px 8px #777;-webkit-box-shadow: 2px 2px 8px #777;-o-box-shadow: 2px 2px 8px #777;-ms-box-shadow: 2px 2px 8px #777;width:100%;height:100%;font-size:25px;padding:12px}
.float-nav .btn-toggle.on{background:transparent;box-shadow:none}
.main-nav{position:fixed;bottom:5%;right:5%;display:none;opacity:0;-webkit-transition: opacity 1s ease-out;z-index:101;}
.main-nav.on {display:block;opacity:1;-webkit-transition:opacity 1s ease-out;}
.main-nav .ul-mymenu{background:#3f7fb7;box-shadow:2px 2px 8px #777;border-radius:3px 3px 33.5px 3px;margin-bottom:0;width:100%;transition: all 250ms;}
.main-nav .ul-mymenu li a{display: block;padding:18px 80px 18px 18px;color:#fff;font-size:14px;}
.main-nav .ul-mymenu li:last-child a{border-bottom-right-radius:30px;}
.main-nav .ul-mymenu li:hover a{text-decoration:underline;background:#3878b0;}
/*list*/
.con-list .writer .bi,.title{font-size:18px}
.con-cover{width:100px;position:relative;cursor:zoom-in;border:1px solid #dbdbdb}
.con-cover:hover{opacity:.9}
.title{font-weight:600;color:#473d3d;word-wrap:break-word;}
.con-list .con-cover{float:left;margin-right:10px}
.con-list .con-info{display:inline-block; line-height:1.4; width: calc(100% - 110px);}
.con-list .con-info:hover{opacity:.9}
.con-chaplist .con-chap .title{ display: block;}
.con-chaplist .con-chap .title,
.con-list .title,
.con-list .writer{overflow:hidden;white-space:nowrap;word-wrap:normal;text-overflow:ellipsis}
.con-list .writer{font-size:14px;color:#666}
.con-list .info{font-size:14px;color:#888}
.con-list .info .genre{margin: 0; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.con-list .info label{cursor: pointer; font-weight: 400; width: 100%; overflow: hidden;text-overflow: ellipsis;white-space: nowrap; display: block; margin-bottom: 0; font-size: 13px; line-height: 1.5; color: #888}
.con-list .info label::before{display: inline-block; vertical-align: middle; content: '·'; margin-right: 5px}
.con-list .con-link{width:100%;text-align:center;background:#f7f7f7; display: flex}
.con-list .con-link a{padding:10px;color:#473d3d;font-size:15px;border-color:#d6d6d6; float: left; display: block; width: 100%;}
.con-list .con-link a:last-child{border-right: 0}
.con-list .con-link a:hover{background:#efefef;font-weight:700}
.con-list .con-cover .bi-clock{cursor:pointer;position:absolute;top:-5px;left:-5px;font-size:15px;background:#32a3b0;border-radius:50%;padding:4px;color:#fff}
.con-list .mark{float:right;margin-top:-15px}
.con-list .mark:first-child{margin-right:-15px}
.keyword span{padding:3px 5px;margin-right:5px;background:#f0f0f0;margin-bottom:5px;display:inline-block; border-radius: 3px}
.label_txt{
  position: absolute;
  right: 15px;
  top: 15px;
  background: #ddd;
  padding: 4px 8px;
  font-size: 12px;
  border-radius: 2px;
  font-weight: 600;
  line-height:1;
}
#date_timepicker_open_reserve{background: #FFF}
/*notice*/
.bp-notice{font-size:14px;display:table}
.bp-notice label{font-size:15px;}
.bp-notice ul li, .bp-notice dl dd{color:#000;margin-top:5px;padding-left:12px;letter-spacing:-1px;position:relative; word-break: keep-all}
.bp-notice ul li:before,.bp-notice dl dd:before{content:'-';font-size:15px;position:absolute;left:0;top:-3px;}
.bp-notice dl dt{margin-top:20px;color:#000}
@media (max-width:479px) {
  .con-list .con-cover{width:85px;height:126px}
  .bi-mnpoly, .bi-serials{font-size:18px}
  .con-list .title{font-size:17px}
  .con-list .writer .bi{font-size:17px}
  .con-list .writer,.con-list .info{font-size:13px;}
}
/*sub*/
.login-wrap,.login-wrap .bg,.login-wrap .bg li{width:100%;height:100%}
.login-wrap{position:relative}
.login-wrap .bg1{background:url(../images/login/bg1.jpg) no-repeat}
.login-wrap .bg2{background:url(../images/login/bg2.jpg) no-repeat}
.login-wrap .bg3{background:url(../images/login/bg3.jpg) no-repeat}
.login-wrap .bg4{background:url(../images/login/gong_bg_211208.jpg) no-repeat}
.login-wrap .bg li{background-size:cover;background-position:center;position:absolute;top:0;left:0}
.login-wrap .login_logo{width:120px;height:30px;position:absolute;top:2%;left:35px;margin:0;z-index:2}
.login-wrap .login-content{width:350px;position:absolute;left:50%;top:50%; transform: translate(-50% , -50%)}
.login-wrap .login-content h2{padding:0 5px}
.login-wrap .ibox-content{border-color:#bbb;padding:36px 20px;border-radius:5px;-webkit-box-shadow:6px 8px 15px -8px #575757;-moz-box-shadow:6px 8px 15px -8px #575757;-ms-box-shadow:6px 8px 15px -8px #575757;box-shadow:6px 8px 15px -8px #575757}
.login-wrap .form-group{position:relative}
.login-wrap .form-control{height:45px;border:0;padding:6px 0;border-bottom:1px solid #ddd; margin: 0}
.login-wrap .form-control+label{position:absolute;top:15px;left:0;z-index:1;width:100%;color:#888;font-weight:400;pointer-events:none;transition:all .2s cubic-bezier(.08,.23,1,1)}
.login-wrap .form-control.has-value,.login-wrap .form-control:focus{border-bottom:2px solid #c62125!important}
.login-wrap .form-control.has-value+label,.login-wrap .form-control:focus+label{top:-10px;font-size:12px;color:#c62125}
.login-wrap .btn{padding:10px}
.login-wrap .login-link a{color:#463c3c;font-size:13px;letter-spacing:-.5px}
.login-wrap .login-link a:hover{text-decoration:underline}
.login-wrap .tlt-line{position:relative;padding:30px 0}
.login-wrap .tlt-line:before{content:'';position:absolute;left:0;top:50%;width:100%;border-top:1px solid #ddd}
.login-wrap .tlt-line span{background:#fff;width:40px;top:50%;position:absolute;left:50%;margin-left:-20px;margin-top:-9px;font-size:13px}
.login-wrap .txt-copyright{font-size:11px}
.login-social ul{list-style:none}
.login-social ul:hover li{opacity:.8}
.login-social ul li{width:45px;height:45px;border-radius:50%;float:left;text-align:center;display:table}
.login-social ul li:hover{opacity:1;transition:all .3s}
.login-social ul li a{font-size:22px;color:#fff;vertical-align:middle;display:table-cell}
.login-social ul li+li{margin-left:15px}
.login-social li.naver{background:#1ec800}
.login-social li.facebook{background:#3b5998}
.login-social li.google{background:#e75c3c}
.login-social li.payco{background:#e6302c}
.textLengthWrap{ text-align: right; margin-top: 3px }
@media all and (min-width:0px) and (max-width:414px){.login-wrap .login_logo{width:95px;height:24px;top:2%;left:20px}}
@media all and (min-width:0px) and (max-width:374px){.login-wrap .login-content{width:300px;}

.md-comment .ul-message{height:450px;overflow-y:auto}
.md-comment .ul-message li{border-bottom:1px solid #ddd;padding:15px 0}
.md-comment .message-avatar{float:left;width:50px;height:50px;border-radius:50%;overflow:hidden;margin-right:10px}
.md-comment .message-content{color:#333;display:inline-block;width:75%;}
.md-comment .con-comment{text-align:right}
/* .md-comment .message-content .a-report{font-size:12px;color:#666}
.md-comment .message-content .a-report:before{content:'·';color:#000;font-size:13px;margin:0 2px} */

/*투고*/
.req-free .ajax-file-upload{float:none;cursor:pointer!important;color:#473d3d;background:#fff;border:1px solid #c1c4c6;height:30px;box-shadow:0 1px 1px 0 rgba(209,209,209,.55);-webkit-box-shadow:0 1px 1px 0 rgba(209,209,209,.55);font-size:13px;width:90px;text-align:center}
.req-free .ajax-file-upload:hover{background:#efefef;box-shadow:none}
.req-free .ajax-upload-dragdrop{color:#514a4a}
.req-free .form-group{margin-bottom:20px}
.req-free .con-request{padding:30px 15px 40px;background:#f9f9f9}
.req-free .con-request .con-file{height:120px}
.req-free{padding-bottom:30px}
.req-free .tabs-container .panel-body{padding:20px 15px}
.req-free .bp-notice .req-tlt,.req-free .ibox-title h5,.req-free .req-tlt{font-size:17px}
.req-free .bp-notice ul label{margin-bottom:0;width:100%}
.req-free .bp-notice .ul-profit{background:#fff8e4;padding:10px;border-radius:5px}
.req-free .bp-notice .ul-profit label{font-size:16px}
.req-free .bp-notice .ul-notice{background:#f1f1f1;padding:10px;border-radius:5px}
.req-free .bp-notice .ul-mail label{padding-top:15px}
@media all and (max-width:767px){
  .req-free .form-group{margin-bottom:5%}
  .req-free .tab-content{padding-right:0;padding-left:0}
  .req-free .bp-notice{margin:0 10px;padding:20px!important}
  .bp-notice .req-tlt,.req-free .ibox-title h5,.req-free .req-tlt{font-size:16px}
  .req-free .con-zoomImg{margin:0px 10px 15px 10px;text-align:center;line-height:2;}}
@media (min-width:768px) and (max-width:1199px){.req-free .bp-notice{margin:0 15px}.req-free .con-zoomImg{margin:0px 15px 15px 15px;text-align:center}}
@media (min-width:1200px){.req-free .bp-notice{margin-top:45px}.req-free .con-zoomImg{margin-top:45px}}
.ul-reqlist{border-top:2px solid #e7eaec;border-bottom:3px solid #e7eaec}
.ul-reqlist li{padding:20px 5px;border-top:1px solid #e7eaec}
.ul-reqlist li:hover{background:#f9f9f9}
.ul-reqlist .noinfo:hover{background:0 0}
.ul-reqlist .con-num{width:5%;float:left;font-size:15px;vertical-align:middle;font-weight:700;color:#a9a9a9;text-align:center;margin-right:15px}
.ul-reqlist .con-info{width:70%;float:left}
.ul-reqlist .title{font-size:16px}
.ul-reqlist .writer{font-size:13px;margin-left:4px;color:#888;font-weight:400;vertical-align:middle}
.ul-reqlist .info{font-size:13px;margin-top:3px}
.ul-reqlist .info span+span:before{content:'|';font-size:12px;color:#ddd;margin:0 4px 0 1px}
.ul-reqlist .txt{color:#333;margin-bottom:5px}
.ul-reqlist .con-btn .btn{box-shadow:0 1px 1px 0 rgba(209,209,209,.55);-webkit-box-shadow:0 1px 1px 0 rgba(209,209,209,.55);-ms-box-shadow:0 1px 1px 0 rgba(209,209,209,.55);-moz-box-shadow:0 1px 1px 0 rgba(209,209,209,.55);-o-box-shadow:0 1px 1px 0 rgba(209,209,209,.55)}
@media (max-width:479px){.ul-reqlist li{padding:15px 5px}.ul-reqlist .con-info{width:100%;margin-bottom:10px}.ul-reqlist .con-btn,.ul-reqlist .con-btn .btn{font-size:13px}}
.ul-reqlist.reqfile li{cursor:pointer}
.ul-reqlist.reqfile li:hover .title{text-decoration:underline}
.md-reason .tlt{font-size:20px;line-height:1}
.md-reason .tlt small{color:#333;font-size:14px}
.md-reason .req-memo{padding-top:20px;font-size:16px}
.md-reason .content{font-size:14px;color:#333}
.md-reason .req-info{border-top:3px solid #e7eaec;border-bottom:3px solid #e7eaec}
.md-reason .req-info tr{font-size:14px}.md-reason .req-info td{padding:15px 5px;word-break:break-word;}
.md-reason .req-info td:first-child{width:25%;min-width:85px;font-weight:700}
.md-zoomImg .con-img,.md-zoomImg .modal-dialog{width:100%;max-width:700px}
.md-reason .txt-reason p{white-space:pre-line;color:#333;font-size:14px;line-height:1.5;margin-top:20px;border-top:1px solid #ddd;padding-top:15px}
.md-zoomImg .con-img{overflow:scroll;position:relative;margin:0 auto}
/* .md-zoomImg .con-img img{width:700px;overflow-x:scroll;-webkit-overflow-scrolling:touch} */
.md-zoomImg button.close{position:absolute;opacity:1;color:#fff;top:20px;right:-30px}
@media (min-width:501px) and (max-width:767px){.md-zoomImg button.close{bottom:-20px;right:auto;top:auto}}
@media all and (max-width:500px){.md-zoomImg button.close{bottom:-20px;right:auto;top:auto}}


/*account*/
.wrap-account .a-sum{font-size:16px;}


/*ruleWriter*/
#ruleWriter .wr-info{ line-height: 1.8; font-size: 15px; border: 1px dashed #aeaeaf; position: relative;}
#ruleWriter .wr-info .form-group{ display: inline-block; margin-bottom:0;}
#ruleWriter .wr-info .form-control{ border: 0 none; padding: 0; font-size: 15px; line-height: 13px; height: 23px; background: #fffdb5; color: #9c2121; font-weight: 600;}
#ruleWriter .wr-info strong{ background: #d2fff5; font-weight: 600;}
#ruleWriter .vertical-timeline-content{font-size:14px;}
#ruleWriter .vertical-date{font-weight: 600; line-height: 1.8}
#ruleWriter .vertical-date small{font-size:13px; font-weight: normal;}
#ruleWriter .wr-info .text-danger{ font-weight: 600}
#ruleWriter a.link{color: #337ab7; font-size: 16px; padding: 10px; border: 1px solid; background: #d0f0ff; border-radius: 3px;box-shadow: 1px 2px 5px 0px #d1d1d1; display: block; margin-bottom: 20px; text-align: center;}
#ruleWriter .rulew-tab li{ width:50%; overflow: hidden;}
#ruleWriter .rulew-tab a{ border-color: #dddddd #dddddd rgba(0, 0, 0, 0); border-bottom: transparent; border-image: none; border-style: solid; border-width: 1px; border-radius: 0; background: #c7c7c7; margin-right:0; color:#fff; text-align: center;}
#ruleWriter .vertical-timeline-icon{ padding-top:6px; font-weight: 600}
#ruleWriter .nav>li.active{background: transparent}
#ruleWriter .rulew-tab li.active a{background: #fff; color:#333;}
#ruleWriter .ibox-content{border:1px solid #eee; min-height: 150px; font-size:13px}
.nav-pills.nav-wizard>li { position: relative; overflow: visible; border-right: 15px solid transparent; border-left: 15px solid transparent; width:33.3%}
#ruleWriter #wrTab2 .genres ul, .alert-info li{ font-size: 13px; line-height: 1.6;}
.genres ul{ padding: 16px; background: #f9f9f9;}
#wrTab2 .genres ul li:before, .alert-info li:before{ content: "•"; padding-right: 8px;}
#ruleWriter #wrTab2 .label{ font-size:12px;}
#ruleWriter #wrTab2 .alert-warning{ color:#676a6c}
#ruleWriter #wrTab2 .alert-warning .contact-box{ border-color:#f9e6c6}
.nav-pills.nav-wizard>li+li { margin-left: 0;}
.nav-pills.nav-wizard>li:first-child { border-left: 0;}
.nav-pills.nav-wizard>li:first-child a { border-radius: 5px 0 0 5px;}
.nav-pills.nav-wizard>li:last-child { border-right: 0;}
.nav-pills.nav-wizard>li:last-child a { border-radius: 0 5px 5px 0;}
.nav-pills.nav-wizard>li a { border-radius: 0; background-color: #eee; text-align: center; padding:18px 10px; color:#716e6e; font-size:15px;}
.nav-pills.nav-wizard>li .nav-arrow { position: absolute; top: 0px; right: -20px; width: 0px; height: 0px; border-style: solid; border-width: 29px 0 28px 20px; border-color: transparent transparent transparent #eee; z-index: 150;}
.nav-pills.nav-wizard>li .nav-wedge { position: absolute; top: 0px; left: -20px; width: 0px; height: 0px; border-style: solid; border-width: 29px 0 28px 20px; border-color: #eee #eee #eee transparent; z-index: 150;}
.nav-pills.nav-wizard>li:hover .nav-arrow { border-color: transparent transparent transparent #aaa;}
.nav-pills.nav-wizard>li:hover .nav-wedge { border-color: #aaa #aaa #aaa transparent;}
.nav-pills.nav-wizard>li:hover a { background-color: #aaa; color: #fff;}
.nav-pills.nav-wizard>li.active .nav-arrow { border-color: transparent transparent transparent #4b6a84;}
.nav-pills.nav-wizard>li.active .nav-wedge { border-color: #4b6a84 #4b6a84 #4b6a84 transparent;}
.nav-pills.nav-wizard>li.active a { background-color: #4b6a84; color:#fff;}
#ruleWriter .genres .text-info{color:#065ca9; font-weight:600 }
#ruleWriter .modal-body{height:700px;overflow-y: scroll;}
@media (max-width:570px){
  #ruleWriter .contact-box{padding:15px;}
  /*연재관*/
  #ruleWriter .nav-wizard{display: none}
  #wrTab2 .tab-content>.tab-pane{display: block; opacity: 1}
  #wrTab2 .tab-content .ibox-content{border: 0 none;margin-bottom: 20px;border-top: 1px dotted #ddd; padding: 20px 0;}
  /*작가등급*/
  #ruleWriter .vertical-timeline-content{margin-left:0}
  #ruleWriter .vertical-timeline-block{padding-top:50px}
  #ruleWriter .vertical-timeline-content::before{display: none;}
  #ruleWriter #vertical-timeline{margin:0} #ruleWriter .vertical-container{width:100%;}
  /*내무버튼*/
  #ruleWriter .link-oneclick{width:100%; display: block;}
  #ruleWriter .modal-body{height:400px;}
  #ruleWriter .nav-tabs>li>a{padding:10px;}
  #ruleWriter .wr-realtext{display: none;}
  #ruleWriter .wr-info{text-align: center; background: #d0f0ff; transition: all .1s ease-out}
  #ruleWriter a.link{float:none; border:0 none; box-shadow: none; font-weight: 600; text-decoration: underline;}
}

/*리메이크*/
.md-remake .modal-body .close{position: absolute; right: 2%; top: 2%; opacity: 1; text-shadow: none; z-index: 1;}
.remake-img .all-img{display: none}
.md-remake .remake-date{position: absolute; right:0; bottom:5%; width:50%}
@media(max-width:990px){
  .remake-img ul.clearfix{display: none}
  .remake-img .all-img{display: block;}
  .md-remake .remake-date{position: relative; right:0; bottom:0; width:100%;}
}
