@charset "utf-8";

/* reset css */
html,body{margin:0;padding:0;height:100%}
body{font:13px/20px "맑은 고딕", Malgun Gothic, "돋움", Dotum, "굴림", Gulim, Arial, sans-serif;color:#777;overflow-y:scroll;}
dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,tbody,tfoot,thead,th,td,select{margin:0;padding:0}
table{border-spacing:0;border-collapse:collapse}
ol,ul,li{list-style:none}
h1, h2, h3, h4, h5, h6 {font-weight:normal;font-size:100%}
hr, legend, .hidden{position:absolute; top:0; left:0; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0; }
.hide{text-indent:-9999px;overflow:hidden;width:0;height:0;font-size:0;line-height:0}
caption{visibility:hidden;overflow:hidden;width:0;height:0;font-size:0;line-height:0}
abbr,acronym,img,fieldset{border:0 none}
button{padding:0;margin:0;border:0;cursor:pointer;vertical-align:top;background-color:#fff;font:13px/20px "나눔고딕", NanumGothic,Malgun Gothic, "돋움", Dotum, "굴림", Gulim, Arial, sans-serif}
label{cursor:pointer}
em,address{font-style:normal}
a {text-decoration:none;color:#777}
a:link,a:visited{color:#3c3c3c;text-decoration:none}
a:hover,a:active,a:focus{text-decoration:none} /* 현재 마우스 오버 밑줄 빼놓음 text-decoration:underline */
table{border-spacing:0;border-collapse:collapse;width:100%;table-layout:fixed}
.skip_nav{position:relative;}
.skip_nav a{display:block; height:1px; width:1px; margin-bottom:-1px; overflow:hidden; font-size:0;color:transparent; color:#fff; font-weight:700; white-space:nowrap;}
.skip_nav a:focus,.skip_nav a:active{height:auto; width:100%; padding:5px; margin-bottom:10px; position:absolute; left:0; top:0;font-size:20px; background:#2466a6;z-index:10}

/* style */
.search_form{text-align:center;padding-top:0px}
.search_form select{vertical-align:top;padding:2px 3px 3px;width:80px}
.search_form input[type=text] {vertical-align:top;border:1px solid #d1d1d1;padding:2px 4px 3px;width:180px;height:19px}

/* button style */
.button::-moz-focus-inner {border:0; padding:0;margin:-1px}
button.button::-moz-focus-inner {margin:0}
.button{width: auto;display: inline-block;cursor: pointer;line-height: 100%;border: none;border-radius: 3px;
	background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(100, 100, 100, 0.4));
    background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(100, 100, 100, 0.4));
    background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(100, 100, 100, 0.4));
    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(100, 100, 100, 0.4));
    background-image: linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(100, 100, 100, 0.4));
	background-repeat: repeat-x;transition: color 0.2s ease, background-color 0.2s ease, border 0.2s ease, opacity 0.2s ease-in-out;padding:6px 16px;font-size:13px;text-align:center;
	font-family:"맑은 고딕",Malgun Gothic, "돋움", Dotum, "굴림", Gulim, Arial, sans-serif;
	text-shadow: -1px -1px rgba(0, 0, 0, 0.2);
}
.button:hover, .button:focus{text-decoration:none}
.button.mini{padding:2px 4px;font-size:11px}
.button.small{padding:6px 10px;font-size:11px}
.button.medium{padding:6px 10px;font-size:12px}
.button.large{padding:8px 20px;font-size:15px;font-weight:700}
.button.large_square{padding:8px 10px;font-size:15px;font-weight:700}
.button.large_p0{padding:0;font-size:15px;font-weight:700}
.button,button,input[type=button],input[type=submit]{vertical-align:top}
.button.black{background-color: #444;color: #fff;border:1px solid transparent;
	background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(100, 100, 100, 0.1));
    background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(100, 100, 100, 0.1));
    background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(100, 100, 100, 0.1));
    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(100, 100, 100, 0.1));
    background-image: linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(100, 100, 100, 0.1));
}
.button.black:hover{background-color: #222}
.button.white{font-weight:700;background-color: #fff;color: #333;border:1px solid #ccc;text-shadow: 1px 1px rgba(255, 255, 255, 0.2);
	background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(100, 100, 100, 0.1));
    background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(100, 100, 100, 0.1));
    background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(100, 100, 100, 0.1));
    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(100, 100, 100, 0.2));
    background-image: linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(100, 100, 100, 0.2));
}
.button.white:hover{background-color: #eee;border:1px solid #bbb}
.button.recomm_title{float:left; border:0 none; border-radius:2px 0 0 2px; background-color:#85a4e7; color:#ffffff;}
.button.recomm_cnt{float:left;background:none;}
.button.large_p0:hover .button.recomm_title{background-color: #507bd7}
.button.blue{background-color: #428bca;color: #fff;border:1px solid #428bca}
.button.blue:hover{background-color: #317ab9}
.button.green{background-color: #5cb85c;color: #fff;border:1px solid #5cb85c}
.button.green:hover{background-color: #4ba74b}
.button.sky{background-color: #5bc0de;color: #fff;border:1px solid #5bc0de}
.button.sky:hover{background-color: #4ab0cd}
.button.orange{background-color: #ed9c28;color: #fff;border:1px solid #ed9c28}
.button.orange:hover{background-color: #dc8b17}
.button.red{background-color: #d9534f;color: #fff;border:1px solid #d9534f}
.button.red:hover{background-color: #c8423e}
.button.gray{background-color: #a3a3a3;color: #fff;border:1px solid #939393}
.button.gray:hover{background-color: #929292}
.button.long{padding-left:0px;padding-right:0;width:78px}
.button.login{padding:19px 20px;font-size:15px;font-weight:700;*padding:18px 0;*width:75px}

/* 도서일괄구매 리스트 */
.list-table {border-top: 2px solid #676767}
.list-table dt {border-bottom: 2px solid #ddd;padding:10px 0;color:#3c3c3c;font-weight:bold;background-color:#efefef;}
.list-table dd {border-bottom: 1px solid #ddd;padding:10px 10px 20px 10px;}

/* 테이블 */
.table {border-top: 2px solid #676767}
.table thead th {border-bottom: 2px solid #ddd;padding:10px 0;color:#3c3c3c}
.table tbody td {border-bottom: 1px solid #ddd;padding:8px}
.table.type-view tbody th{padding:8px 0 8px 8px;background-color:#f8f8f8;font-weight:700;text-align:left;color:#3c3c3c;border-bottom:1px solid #d1d1d1}
.table.type-view tbody td{padding:8px 0 8px 8px ;color:#3c3c3c;border-bottom:1px solid #d1d1d1}
.table.type-list thead th{padding:8px 0; background-color:#f8f8f8;border-bottom:1px solid #d1d1d1}
.table.type-list tbody td{padding:8px 0;border-bottom:1px solid #d1d1d1}
.table.type-list tbody td{padding:8px 0;border-bottom:1px solid #d1d1d1}
.table.striped tbody tr:nth-child(odd) td, .type_list tbody tr:nth-child(odd) th{background-color: #f9f9f9;}


/* 테이블 리스트  홀짝 색 */
.type_list tbody tr:nth-child(odd) td, .type_list tbody tr:nth-child(odd) th{background-color: #f9f9f9;}
.tb_list tbody tr:nth-child(odd) td, .tb_list tbody tr:nth-child(odd) th{background-color: #f9f9f9;}

/* 테이블 리스트 오버 */
.type_list tbody tr:hover td, .type_list tbody tr:hover th{background-color:#f5f5f5}
.tb_list tbody tr:hover td, .tb_list tbody tr:hover th{background-color:#f5f5f5}

.tb_list tbody tr.tb_section { background-color:#eeeeee; }
.tb_list tbody tr.tb_section td { background-color:#eeeeee; font-weight:bold; font-size:1.1em; line-height:1.1em; padding:11px 17px; }
.tb_list tbody tr.tb_section:hover { background-color:#eeeeee; }
.tb_list tbody tr.tb_section:hover td { background-color:#eeeeee; }

/* 라벨 */
/* .label{font-family:"돋움", Dotum, Arial, sans-serif;font-size:12px;padding:0 4px;font-weight:normal;vertical-align:1px;display:inline-block;height:16px;line-height:18px} */
.label{font-size:12px;padding:0 4px;font-weight:normal;vertical-align:1px;display:inline-block;height:20px;line-height:20px;letter-spacing:-1px;}
.label.red{background-color:#d9534f;color:#fff}
.label.blue{background-color:#428bca;color:#fff}
.label.gray{background-color:#999;color:#fff}
.label.green{background-color:#5cb85c;color:#fff}
.label.sky{background-color:#5bc0de;color:#fff}
.label.brown{background-color:#7b462f;color:#fff}
.label.purple{background-color:#7e79db;color:#fff}
.label.small{font-size:11px}
.label.large{font-size:13px}
.label.w30{width:30px;}

input[type=text]{font:13px/20px "맑은 고딕",Malgun Gothic, "돋움", Dotum, "굴림", Gulim, Arial, sans-serif;height:17px;padding:2px 4px 3px;
  background-color: #ffffff !important;
  border: 1px solid #cccccc !important;
  /*border-radius: 4px !important;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) !important;*/
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s !important;}
input[type=number]{font:13px/20px "맑은 고딕",Malgun Gothic, "돋움", Dotum, "굴림", Gulim, Arial, sans-serif;height:17px;padding:2px 4px 3px; text-align:center;
  background-color: #ffffff !important;
  border: 1px solid #cccccc !important;
  /*border-radius: 4px !important;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) !important;*/
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s !important;}
input[type=password]{font:13px/20px "맑은 고딕",Malgun Gothic, "돋움", Dotum, "굴림", Gulim, Arial, sans-serif;height:17px;
  background-color: #ffffff !important;
  border: 1px solid #cccccc !important;
  /*border-radius: 4px !important;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) !important;*/
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s !important;}
select{font:13px/20px "맑은 고딕",Malgun Gothic, "돋움", Dotum, "굴림", Gulim, Arial, sans-serif;vertical-align:top;padding:2px 3px 3px;
  background-color: #ffffff !important;
  border: 1px solid #cccccc !important;
  /*border-radius: 4px !important;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) !important;*/
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s !important;}


/* table button */
.board.btn{overflow:hidden;margin-top:10px;text-align:center}
.board.btn .left{float:left;margin-right:4px}
.board.btn .right{float:right;margin-left:4px}

.tb_insert + .agree{text-align:center; margin:30px 0 0; letter-spacing:-0.7pt;}
.tb_insert + .agree .checkbox{vertical-align:middle;}

.mt10{margin-top:10px}
.mt5{margin-top:5px}
.mt15{margin-top:15px}
.mt20{margin-top:20px}
.mt30{margin-top:30px !important}
.mb15{margin-bottom:15px;}
.w555{width:555px}
.nodata{text-align:center}
.h50{height:50px}
.p10{padding:10px;}
.pl20{padding-left:20px}
.bold{font-weight:bold}
.font12{font-size:12px;}
.font16{font-size:16px;}

/* GRID */
.container, .row, .box, .col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

.debug { border:1px solid red; }
.inline { display:inline; }
.container { width:1000px; margin:0 auto; }
.row { margin-right:-10px; margin-left:-10px; }

.clearfix:before,
.clearfix:after,
.box:before,
.box:after,
.container:before,
.container:after,
.row:before,
.row:after {
  display: table;
  content: " ";
}
.clearfix:after,
.box:after,
.container:after,
.row:after {
  clear: both;
}

.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 { position:relative; padding-left:10px; padding-right:10px; float:left; }
.col1 { width:8.33333333%; }
.col2 { width:16.66666667%; }
.col3 { width:25%; }
.col4 { width:33.33333333%; }
.col5 { width:41.66666667%; }
.col6 { width:50%; }
.col7 { width:58.33333333%; }
.col8 { width:66.66666667%; }
.col9 { width:75%; }
.col10 { width:83.33333333%; }
.col11 { width:91.66666667%; }
.col12 { width:100%; }

.box { border: 1px solid #e5e5e5; width:100%; padding:10px; }
.box .title { margin:-10px -10px 10px -10px; padding:10px; font-weight:bold; background-color:#efefef; border-bottom: 1px solid #e5e5e5; }
.box .footer { margin:10px -10px -10px -10px; padding:10px; font-weight:bold; background-color:#efefef; border-top: 1px solid #e5e5e5; }

.inline > li { display: inline-block; float:left; padding-right: 10px; padding-left: 10px; }

.text-left { text-align:left; }
.text-right { text-align:right; }
.text-center { text-align:center; }
.text-justify { text-align:justify; }
.text-nowrap { white-space:nowrap; }

.join_required:after {font-weight:bold; color:#ff0000; content:" *";}