@import url(https://fonts.googleapis.com/css?family=Open+Sans);

@media screen {
	#accessibility,
	.reader { display: none; }
}

img{
	border: none;
}
body {
	
	background-color: #fff;
	background-image: url( );
	color: #666;
	font-family: 'Open Sans', sans-serif;
	font-size: 12px;
	margin:0px;
	padding:0px;
}
article{
	font-size: 13px;
}

a {
	color: #333;
	text-decoration: none;
}

a:hover {
	color: #000;
}
ol, ul {
	list-style: none;
	padding:0px;
	margin:0px;
}
#wrap {
	margin: 0 auto;
	min-width: 1024px;
}

.inner {
	margin: 0 auto;
	max-width: 1024px;
	padding: 0 0px;
}

.relative {
	position: relative;
}

.fright {
	float: right;
}

.fleft {
	float: left;
}
.right {
	text-align: right;
}

.left {
	text-align: left;
}

.center{
	text-align: center;
}

.clearfix{
	clear:both;
}

 
.bold{
	font-weight: bold;
}

.small{
	font-size:11px;
}
.color-mint{
	color: #01b5b6;
}
.color-black{
	color: #000000;
}
.color-orange{
	color: #ff6600;
}
.graybox{
	border:1px solid #e7e7e7;
	background-color:#f8f8f8;
	padding: 20px;
	margin: 60px 15px 15px 15px;
}


/* ------------------------------
Reset
------------------------------ */
form, fieldset, button { margin: 0px; padding: 0px; }
input.txt, input.file { margin: 0px; padding: 10px; width: 140px; height: 17px; line-height: 17px; font-size: 12px; border: solid 1px #ddd;vertical-align: middle; }
textarea.textarea { font-size: 12px; border: solid 1px #ddd; }
label input { vertical-align: middle; }

/* ------------------------------
table
------------------------------ */

table.table {margin:20px 0px;width:100%;border-spacing:0;border-bottom:1px solid #e2e2e2;border-right:1px solid #e2e2e2;text-align:center;}
table.table thead th{font-weight:bold;font-size: 20 px;background-color:#ededed;}
table.table th, table.table td{ font-size:13px;padding:10px 5px;border-top:1px solid #e2e2e2;border-left:1px solid #e2e2e2;}
table.table th, table.table thead td{background-color:#f7f7f7;font-weight:bold;color:#555555;}
table.table td{}
table.table .bgcolor{background-color:#f4f4f4;}
table.table .right{text-align:right;}
table.table .left{text-align:left;}

table {width:100%;border-spacing:0;border:none;margin:20px 0px;}
table th, td{ font-size:12px;padding:8px;border-top:0px solid #fff;border-left:0px solid #fff;font-size:16px;border:none;}
table .right{text-align:right;}
table .left{text-align:left;}
.table-border{border:5px solid #ddd;}

/* HEADER */
#wrap > header {
	background-color: #fff;
	height: 80px;
}
#wrap > header .inner{

}

#gate {clear:both;height:33px;text-align:right;font-size:11px;line-height:16px;}
#gate a{display:inline-block;background-color:#3c3a3b;color:#fff;padding:5px 20px 10px 20px;margin:0px;text-decoration:none;}
#gate a:link {color: #fff; }
#gate a:visited {color: #fff; }
#gate a:hover {color: #333;background-color:#fff;}
#gate a:active {color: #333;background-color:#fff;}
#gate a.current {color: #333;background-color:#fff;}
#gate a.first {border-left:1px solid #3c3a3b;border-bottom:1px solid #3c3a3b;border-right:1px solid #3c3a3b;padding:5px 20px 9px 20px;}


#wrap > header .util-menu a.home{
	border:none;
}

#navigation {
	text-align:center;
	background-color:#fff;
	border-bottom:1px solid #949494;
	
}
#navigation .inner{
	width: 1060px;
	padding: 0px 18px;
	height:50px;
	position: relative;
}

#menu-toggle {
	display: none;
	float: right;
}

/* HEADER > MENU */
#main-menu {
	position: absolute;
	left: 18px;
	top: 0px;
 	margin: 0;
	background-color:#333;
	height:50px;
	
	
}

#main-menu > li {
	display: inline-block;
	text-align: center;
	line-height: 49px;
	border-top:1px solid #333;
	border-bottom:1px solid #333;
}

#main-menu > li.parent {
	width: 205px;
	margin:0px;
 	vertical-align:middle;
 }

#main-menu > li.point {
	width: 195px;
	background-color: #01b5b6;
	background-image: url(../img/mainmenu_bg.gif);
	background-repeat: no-repeat;
	background-position: right top;
 }

#main-menu > li.parent > a {
}


#main-menu > li > a {
	color: #eee;
	font-size: 14px;
	line-height: 14px;
	text-decoration:none;
}

#main-menu > li:hover > a {
	color: #23dbdb;
}

/* HEADER > MENU > DROPDOWN */
#main-menu li {

 }

ul.sub-menu { /* level 2 */
	display: none;
	left: 0px;
	top: 50px;
	position: absolute;
	width: 150px;
	padding: 15px 40px 15px 15px;
	background-color: #333333;
	height: 650px;
	text-align: left;
	z-index: 9999;
}

ul.sub-menu ul.sub-menu { /* level 3+ */
	left: 195px;
	top: 0px;
	position: absolute;
}

ul.sub-menu > li > a {
	background-color: #333;
	border-top: none;
	color: #bbb;
	display: block;
	font-size: 12px;
	line-height: 15px;
	padding: 4px 12px;
}

ul.sub-menu > li{
	width:180px;
}

ul.sub-menu > li > a:hover {
	background-color: #2a2a2a; 
	color: #fff;
}

ul.sub-menu > li:first-child {
	
}

ul.sub-menu ul.sub-menu > li:first-child {
 
}

ul.sub-menu > li:last-child > a {
	border-radius: 0 0 2px 2px;
}

ul.sub-menu > li > a.parent {
	background-image: url(../img/arrow.png);
	background-size: 5px 9px;
	background-repeat: no-repeat;
	background-position: 95% center;
}

#main-menu li:hover > ul.sub-menu {
	display: block; /* show the submenu */
}
@media all and (max-width: 700px) {

 
}

 
 
/* section */
section {
	margin: 0 auto;
	width: 1054px;
	text-align:center;
}

/* visual */
#visual-curation{
	width: 100%;
	height: 120px;
	overflow: hidden;
	background: url(../img/visual-curation.jpg) no-repeat center top;
}
#visual-bookstore{
	width: 100%;
	height: 120px;
	overflow: hidden;
	background: url(../img/visual-bookstore.jpg) no-repeat center top;
}


#product .tabs{
	text-align:center;
	font-size: 14px;
	color: #666;
	padding:10px 0px 20px;
}

/* 탭 */
#product .tabs a{text-decoration: none; margin:0px 1px; padding: 2px 8px; line-height: 30px; display:inline-block;}
#product .tabs a:link { color: #333333; }
#product .tabs a:visited { color: #fff; }
#product .tabs a:hover { background-color: #333; color: #fff;}
#product .tabs a:active { background-color: #333; color: #fff;}
#product .tabs a.active{ background-color: #333; color: #fff;}
 
section > article#product {
	text-align: left;
}

section > article#product .list dl{
	text-align: left;
	vertical-align: top;
	margin:14px;
	padding:0px;
	width: 180px;
	display:inline-block;

}
section > article#product .list dl dt{
	padding:0px;
	margin:10px 0;
}
section > article#product .list dl dt img{
	width: 180px;
	height: 256px;
	overflow: hidden;
}
section > article#product .list dl dd{
	padding: 0px;
	margin: 0px;
}

section > article#product .list span{
	display:block;
}

section > article#product .list .seller{
	color:#999;
}

section > article#product .list .txt1{
	padding: 10px 0px;
}

section > article#product .list .txt2{
	color: #027879;
}

/* 리스트2 타입 */
section > article#product .list2 dl{
	width: 230px;
	vertical-align:top;
}
section > article#product .list2 dl dt{
	float:left;
	margin:0px;
	width: 70px;
}
section > article#product .list2 dl dd{
	float:left;
	width: 160px;
}
section > article#product .list2 dl dt img{
	width: 60px;
	height: 80px;
	overflow: hidden;
}
section > article#product .list2 .seller{
	font-size:11px;
}
section > article#product .list2 .title{
	height:50px;
}
 
section > article#banner{
	padding:40px 0px;
}

section > article > div.curation_cont,
section > article > a > div.curation_cont{
	margin: 30px auto;
	width: 720px;	
}
section > article > div.curation_cont{
	text-align: left;
}


.logo{
	margin:0px;
	padding:0px;
}

/* HEADER > search */
.search input{
  height: 42px;
  padding-left: 10px;
  border: none;
  overflow: hidden;
}
/* 버튼에 딩벳폰트 적용 */
.search input[type="submit"]{
	font-family: 'FontAwesome';
	font-size: 1.5em;
	background: none;
}

/* HEADER > nowpage */
#current-menu {
	margin: 20px; 	
	width: 1060px;
	margin:30px auto 0px;
}

 

h1{}
h2{
	font-weight:lighter;
	font-size:27px;
	color:#000;
	text-align:center;
	padding: 30px;
	background-image: url(../img/title_btm_bar.gif);
	background-repeat: no-repeat;
	background-position: center bottom;
}
h2 > span {
	display:block;
	color: #fff;
	font-size: 12px;
}

/* 버튼정의 */
.round-btn { border-radius: 20px; margin:20px 10px; padding: 10px 20px; background-color:#333; text-decoration: none; color: #fff; display: inline-block;}
.round-btn:link { text-decoration: none; color: #fff; }
.round-btn:visited { text-decoration: none; color: #fff; }
.round-btn:hover { color: #fff;}
.round-btn:active { color: #fff;}

/* 앱 다운 버튼 */
.appdown {margin: 40px auto; width: 400px;}
.appdown > p{ 
	color: #049394;
	text-align: left;
 }
.appdown > div{
	background-color: #01b5b6;
	color: #fff;
	padding: 20px 0px;
	border: 1px solid #333;
}
.appdown > div > span{
	display: inline-block;
	border:1px solid #fff;
	width: 110px;
	height: 40px;
	line-height: 40px;
	vertical-align: middle;
	margin:0px 6px;
	border-radius: 8px;

}
.appdown > div > span.txt{
	border: none;
	width: 110px;
	line-height: 22px;
	vertical-align: middle;
	margin:0px 6px 2px;
	text-align: left;
	font-weight: bold;
	font-size: 20px;
}
.appdown a{text-decoration: none;}
.appdown a:link { color: #fff; }
.appdown a:visited { color: #fff; }
.appdown a:hover { color: #fff;}
.appdown a:active { color: #fff;}
.appdown a.active{ color: #fff;}
 

/* footer */
#quick-menu{
	width: 100%;
	margin-top:30px;
	font-size: 13px;
	clear: both;
	background-color:#eee;
}
#quick-menu .inner{
	margin: 0 auto;
	width: 1024px;
	padding:20px;
	text-align: left;
}
#quick-menu .inner  span{
	display: inline-block;
	height: 40px;
	line-height: 40px; 
	vertical-align:middle;
	padding: 0px 5px 0px 0px;
}
#quick-menu a{
	border-radius: 8px;
	border: 1px solid #ccc;
	padding: 10px;
	background-color: #f6f6f6;
}
#quick-menu a{text-decoration: none;}
#quick-menu a:link { color: #888; }
#quick-menu a:visited { color: #888; }
#quick-menu a:hover { color: #01b5b6; background-color: #fff;}
#quick-menu a:active { color: #01b5b6; background-color: #fff;}
#quick-menu a.unable:link {color: #888;}
#quick-menu a.unable:hover {color: #888; background-color: #f6f6f6}
#quick-menu a.unable:visited {color: #888; background-color: #f6f6f6}

footer {
	background-color:#3c3c3c;
	clear: both;
}
footer .inner{
	margin: 0 auto;
	width: 1024px;
	padding:30px;
	color:#888;
}
footer  address{
	font-style: normal;
}
footer span {
	padding-right: 7px;
}

footer a{text-decoration: none;}
footer a:link { color: #888; }
footer a:visited { color: #888; }
footer a:hover { color: #eee;}
footer a:active { color: #eee;}
footer a.active{ color: #eee;}


/* ------------------------------
paging
------------------------------ */
.paging { width:100%; text-align:center; padding:40px 0px; font-size: 12px;}
.paging a{display:inline-block;  color:#353e44;  width:26px; height:25px; line-height:25px; vertical-align:middle; margin-right:2px; border:1px solid #c8c8c8;}
.paging a:hover{text-decoration:none;border:1px solid #027879; color: #027879;}
.paging a.current{border:1px solid #009293; color:#FFFFFF; background-color:#13cfd0;}
.paging .page_btn{border:1px solid #c8c8c8; width:60px; font-weight:normal;}
.paging .btn_first{}
.paging .btn_prev{margin-right:14px;}
.paging .btn_next{margin-left:14px;}
.paging .btn_end{}

/* ------------------------------
contents - product detail
------------------------------ */
#detail{text-align: center; font-size:14px; color:#333;float:left; width:1024px;margin:30px 0px 40px;padding:0px 20px;background: url(../img/detail_bg.gif) repeat-y 570px 0px;}
#detail del { color: #777;}
#detail .book-image{float:left;  text-align:center; margin:0; width:550px;overflow:hidden;}
#detail .book-image img{max-width:400px; min-height: 500px; background-color: #eee;}
#detail .book-info{width:400px;margin:20px auto;float:right;margin:0;}
#detail .book-info ol{}
#detail .book-info ol li{height:26px; line-height:26px; text-align: left; }
#detail .book-info ol li span{display: inline-block; width:100px; color:#777;}
#detail .book-info p.note{background-color:#f4f4f4; text-align:left; padding:20px;min-height:200px;}
 

#detail .book-image .tabs {margin: 20px 0px;}
#detail .book-image .tabs a {padding:5px; margin: 5px; border-radius: 20px; background-color:#333; text-decoration: none; color: #fff; display: inline-block;}
#detail .book-image .tabs a.active {background-color:#13cfd0;}

#detail .book-image .share {line-height: 18px;}
#detail .book-image .share img{ width:18px; height:18px; min-height:18px; max-width:18px; padding:0 6px; background-color: #fff; vertical-align:middle;}

/* ------------------------------
selectbox-category
------------------------------ */
#selectbox,
#selectbox-category {
	margin-top: 40px;
}
#selectbox > select,
#selectbox-category > select{
	border: none;
	height:40px;padding:0 25px 0 25px;border-right:1px solid #ccc;font-size:12px;color:#666;-webkit-border-radius:0;-webkit-appearance:none;

  -webkit-appearance: none;  /* 네이티브 외형 감추기 */
  -moz-appearance: none;
  appearance: none;
  background: url(../img/selectbox_arrow.gif) no-repeat 85% 50%;  /* 화살표 모양의 이미지 */ 

}
#selectbox{
	margin:0;
}
#selectbox > select{
border-left:1px solid #ccc;
margin:0px 15px 15px 15px;
height:20px;
}
#selectbox > select > option,
#selectbox-category > select > option{
	margin: 0px;
	padding: 6px;

}


/* IE 10, 11의 네이티브 화살표 숨기기 */
#selectbox > select::-ms-expand,
#selectbox-category > select::-ms-expand { 
  display: none;
}