@charset "utf-8";
/* style */

html, body { min-width:100%; height:100%; position:relative;}
body {
	color:#555; font-size:14px; word-wrap: break-word; word-break: break-all;
	font-family:'Microsoft JhengHei', sans-serif;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;}

/*---------- font and link*/
a,p { color:#555; /*-webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;*/}
a.blue,f-blue { color:#378bd6;}
a.ora,.f-ora { color:#ff7109;}
a.gre,.f-gre { color:#00b555;}
a.gray,.f-gray { color:#777;}
a.blue:hover,a.ora:hover,a.gre:hover,a.gray:hover { text-decoration:underline;}
.f-bold { font-weight:bold;}
.t-blue { color:#378bd6;}
.t-gray { color:#999;}
.t-red { color:#fe4647;}
.t-orange { color:#F60;}
.f-yellow{color:#fffa34;}
.t-center { text-align:center;}
.t-right { text-align:right;}

/*---------- title*/
h3.title { font-size:20px; font-weight:bold; line-height:30px; color:#000; /*text-shadow:2px 2px 2px #ddd*/}
h3.title.line { border-bottom:1px solid #e6e8ed; padding-bottom: 10px;}
h3.title.mb { margin:10px 0 20px 0;}

.cate-title { font-size:20px; font-weight:bold; line-height:30px; color:#000; margin:40px 0 20px 0; text-align:center; vertical-align:middle;}
.cate-title img { margin:0 8px;}
.theme-title { font-size:20px; line-height:25px; color:#378bd6; font-style:italic; text-align:center;}

/*---------- margin*/
.m-t-m { margin-top:20px;}
.m-t-s { margin-top:10px;}
.m-b-m { margin-bottom:20px;}
.m-b-s { margin-bottom:10px;}
.m-l-m { margin-left:20px;}
.m-l-s { margin-left:10px;}
.m-r-m { margin-right:20px;}
.m-r-s { margin-right:10px;}

/*---------- input*/
input,button,select,textarea{outline:none;}
.content input[type=text]{border-radius:5px; background-color:#fff; border:1px solid #CCC; height:36px; line-height:36px; box-sizing:border-box; padding:0 10px;}
input[type=submit]{ border-radius:5px;width: 125px; border-radius: 3px;}

/*---------- banner area*/
.banner-bg { clear:both; width:100%; /*background:url(../images/bg-default.jpg) center;*/ height:440px;}
.banner-bg .wrap { overflow:hidden; height:440px;}
/*category*/
.category{
	background:#fff; float:left; width:285px; height:415px; padding-top:5px;
	-webkit-box-shadow: 0 15px 36px -20px rgba(0,0,0,0.3); -moz-box-shadow: 0 15px 36px -20px rgba(0,0,0,0.3); box-shadow: 0 15px 36px -20px rgba(0,0,0,0.3);}
.category h3,.category h3 a{ color:#378bd6; line-height:20px; margin-bottom:5px; font-size:15px; font-weight:bold;}
.category a { font-size: 14px; display:inline-block; width:33.333333%; line-height:24px;}
.category a:hover { color:#378bd6;}
.category div { border-bottom:1px solid #eee; padding:12px 0; margin:0 30px;}
.category div:last-child { border-bottom:none;}
/*banner*/
.banner { float:right; width:745px; height:420px;}
#banner { width:745px; height:420px;}
#banner .swiper-pagination-bullet{ box-shadow: 0 0 3px 1px rgba(0,0,0,0.3); background:#fff;}
#banner .swiper-pagination-bullet-active{background:#378bd6;}

/*---------- #10055 新增首頁蓋版廣告 */
.idxAD-header { position:relative;}
.idx-ad-pc2,.idx-ad-m1 {}
.idx-ad { width:1050px; margin:0 auto; text-align:center; position:relative; }
.idx-ad-pc1 {}
.idx-ad-pc1 div { display:inline-block;}
.idx-ad-pc2 {}
.idx-ad-pc2 div { display:inline-block;}
.idx-ad .upa,.idx-ad .opena{ position:absolute; display:block; right:15px; top:0; width:82px; text-align:center; font-size:13px; color:#fff; line-height:30px; background:rgba(0,0,0,.4); cursor:pointer;}
/*.idx-ad .closea { position:absolute; display:block; left:10px; top:15px; width:20px; height:30px; font-size:24x; color:#fff; text-shadow:0px 0px 8px rgba(0,0,0,.3); cursor:pointer;}*/
.idx-ad div,.idx-ad iframe { max-width:100%!important; width:100% !important;}

/*---------- content setting*/
.wrap { width:1050px; margin:0 auto;}
.content { padding:30px 0; background:#f2f5f9;}
.contentwrap { margin:15px auto; clear:both; overflow:hidden;}
.contentwrap:last-child { margin:20px auto 0 auto;}
.wbox { background:#fff;}
.bdbox{background:#fff; -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset; border-radius:3px;}
.bd { -webkit-box-shadow: 0 -1px 0 1px #e6e8ed inset; -moz-box-shadow: 0 -1px 0 1px #e6e8ed inset; box-shadow: 0 -1px 0 1px #e6e8ed inset;}
.col7 { width:690px;}
.col3 { width:320px;}
.left { float:left;}
.right { float:right;}
.claer { clear:both;}
/*---------- tab setting*/
.fortabs {}
.fortabs div.title,.defaulttabs div.title,.linktabs div.title { position:relative; height:40px; border-bottom:1px solid #e6e8ed; margin-bottom:10px;}
.fortabs h3.title,.defaulttabs h3.title,.linktabs h3.title { position:absolute; left:0; top:0;}
.fortabs .title .t-s,.linktabs .title .t-s { font-size:14px; margin-left:8px;}
ul.tabs { position:absolute; right:0; top:0; z-index:1; height: 40px; text-align:right;}
ul.tabs li { display:inline-block; height: 39px; line-height: 39px; position: relative;	margin-bottom: -1px; text-align:center;}
ul.tabs li a { display:inline-block; padding: 0 15px; font-size:16px;}
ul.tabs li span { display:none;}
ul.tabs li a:hover { color:#378bd6;}
ul.tabs li.active a { color:#378bd6;}
ul.tabs li.active a:hover {}
ul.tabs li.active span { display:block; width:30px; height:3px; margin:0 auto; border-radius:3px; background:#378bd6;}
ul.tabs.small li a { display:inline-block; padding: 0 10px; font-size:16px;}
/* 輕之文庫 */
ul.tabs li a.ca4 { color:#F60;}
ul.tabs li a.ca4:hover,ul.tabs li a.ca4:active{ color:#F60;}
ul.tabs li.active a.ca4 span { display:block; width:30px; height:3px; margin:0 auto; border-radius:3px; background:#F60;}
div.tab_container { clear:both; width: 100%; border-top: none;}
div.tab_container .tab_content {}

/*---------- book setting*/
.box-wrap { overflow:hidden;}
.box { padding:12px; background:#fff; -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset; border-radius:3px;}
.box img,.list-box img { max-width:100%!important; height: auto!important; _width:expression(this.width > 100 ? "100%" : this.width)!important;}
.box:last-child { margin-right:0;}
.cover-b{ width:180px; height:254px; border:1px solid #eee; opacity:1; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
.cover-m{ width:122px; height:172px; border:1px solid #eee; opacity:1; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
.cover-s{ width:75px; height:106px; border:1px solid #eee; opacity:1; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
.cover-b:hover,.cover-m:hover,.cover-s:hover { opacity:0.8;}
.cate { display:inline-block; min-width:55px; padding:3px 5px; font-size:12px; background:#fff; color:#aaa; border:1px solid #eee; text-align:center;}
.box .desc { font-size:13px; color:#777; line-height:18px; margin-top:10px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.box .desc{ position:relative; line-height:1.4em; height:2.8em;}
.box .desc::after { content:"...";}
.box a.bname { margin:3px 0;}
.box a.cname:hover { text-decoration:underline;color:#000;}
a.bname,span.bname,.bname { display:block; color:#000; font-size:16px; line-height:28px; font-weight:bold; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
a.author { display:block; color:#378bd6; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
a.bname:hover,a.author:hover { text-decoration:underline;}

/*---------- author setting*/
img.user-m { width:150px; height:150px;} 
img.user-L { width:180px; height:180px;}

/*---------- editor push*/
.threecate {width: 100%; height:auto;}
.threecate .swiper-slide {  height:auto;}
.threecate .swiper-pagination { display:none;}
.threecate .box .cover-b{ margin-bottom:10px; text-align:center;}


/*---------- hot books*/
.hotbook {width: 100%; height:auto;}
.hotbook .swiper-wrapper { padding:10px 0 30px 0;}
/*cover left*/
.hotbook .box { overflow:hidden;}
.hotbook .box .left{ display:block; width:40%;}
.hotbook .box .right{ width:55%;}
.hotbook .box .desc { overflow:hidden; min-height:70px; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical;}
.hotbook .box .desc{ position:relative; line-height:1.4em;  height: 5.6em}
.hotbook .box .desc::after { content:"...";}

ul.tabs.title2 { position:static; height: 50px; text-align:left; border-bottom:1px solid #e6e8ed;}
ul.tabs.title2 li { display:inline-block; height: 49px; line-height: 49px; position: relative;	margin-bottom: -1px;}
ul.tabs.title2 li a { display:inline-block; padding:0; padding-right:20px; font-size:20px; font-weight:bold; color:#b1b1b1;}
ul.tabs.title2 li span { display:none;}
ul.tabs.title2 li a:hover { color:#999;}
ul.tabs.title2 li.active a { color:#000;}
ul.tabs.title2 li.active a:hover {}
ul.tabs.title2 li.active span { display:block; width:60px; height:3px; margin:0 auto; border-radius:3px; background:#378bd6;}

/*---------- tags*/
.tags a { display:inline-block; font-size:15px; background:#fff; font-weight:bold; border:1px solid #e6e8ed; border-radius:3px; padding:6px 12px; margin:0 8px 6px 0; -webkit-transition:0.2s; -moz-transition:0.2s; transition:0.2s;}
.tags a:last-child { margin:0 0 0 0;}
.tags .t1 { color:#f15f17;}
.tags .t2 { color:#336ad9;}
.tags .t3 { color:#0ecb8f;}
.tags .t4 { color:#999;}
.tags .t1:hover { color:#fff; background:#f15f17;}
.tags .t2:hover { color:#fff; background:#336ad9;}
.tags .t3:hover { color:#fff; background:#0ecb8f;}
.tags .t4:hover { color:#fff; background:#999;}
/*for cates*/
.tags.cates1,.tags.cates2,.tags.cates3 { padding:0 0 0 10px;}
.tags.cates1 a { color:#ff3252; margin:0 5px 5px 0; }
.tags.cates1 a:hover { background:#ff3252; color:#fff;}
.tags.cates2 a { color:#4859d6; margin:0 5px 5px 0;}
.tags.cates2 a:hover { background:#4859d6; color:#fff;}
.tags.cates3 a { color:#3bac6a; margin:0 5px 5px 0;}
.tags.cates3 a:hover { background:#3bac6a; color:#fff;}
.tags.cates4 a { color:#ff9c28; margin:0 5px 5px 0;}
.tags.cates4 a:hover { background:#ff9c28; color:#fff;}

/*---------- popo star*/
.postar { -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset; border-radius:3px; overflow:hidden;}
.postar .left{ position:relative;}
.postar .left img { width:150px; height:150px; /*border-radius:3px 0 0 3px;*/}
.postar .right{ width:calc(92% - 150px); padding:15px 4%; line-height:22px;}
.postar .arrow { position:absolute; top:65px; right:0; width:0; height:0; border-style:solid; border-width: 10px 15px 10px 0; border-color: transparent #fff transparent transparent;}
.postar .desc { color:#777; font-size:15px; margin:10px 0; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.postar .desc{ position:relative; line-height:1.4em;  height:2.8em}
.postar .desc::after { content:"...";}

i.pstar { display:inline-block; width:35px; height:25px; background:url(../images/icon-postar.png) no-repeat center bottom; background-size:21px 23px;}

/*---------- trend*/
.tlist { overflow:hidden; clear:both; width:calc(100%-20px); border-left:3px solid #93c7f6; border-bottom:1px solid #e6e8ed; padding:8px; background:#fff; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; position:relative;}
.tlist:hover { background:#f6f6f6; border-left:10px solid #93c7f6;}
.tlist div{ display:block; float:left;}
.tlist:last-child { margin-bottom:0;}
.tlist .cl { width:15%; color:#999; line-height:20px; text-align:center; padding-top:10px;}
.tlist .nc { width:63%; padding:0 1%;}
.tlist .wd { width:20%; text-align:right;}
.tlist .wd a { line-height:30px;}
.tlist .bname { font-size:15px; line-height: 28px;}
.tlist .f-gray { font-size:13px;}
.tlist a.gray { display:block; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
.tlist-btn { display:block; text-align:center; background:#f7f7f7; font-size:13px; line-height:40px; border-bottom:1px solid #e6e8ed; border-left:1px solid #e6e8ed; border-right:1px solid #e6e8ed;}
.tlist-btn:hover { background:#fff; color:#378bd6;}
.tlist .nl{width:42%; line-height:28px;}
.tlist .al{width:35%; line-height:28px;}
.tlist .dl{width:21%; line-height:28px; font-size:12px; white-space:nowrap; text-align:right;}

/*書籤*/
.bookmark_green{ position:absolute; border-left:15px solid #1ab99c; border-right:15px solid #f2f5f9; border-top:15px solid #1ab99c; border-bottom:15px solid #f2f5f9; bottom:0; right:0;}
.bookmark_blue{ position:absolute; border-left:15px solid #37a5e5; border-right:15px solid #f2f5f9; border-top:15px solid #37a5e5; border-bottom:15px solid #f2f5f9; bottom:0; right:0;}
.tlist .bookmark_green{ bottom:inherit; top:0; right:0; border-left:15px solid #1ab99c; border-right:15px solid #f2f5f9; border-top:15px solid #f2f5f9; border-bottom:15px solid #1ab99c;}
.tlist .bookmark_blue{ bottom:inherit; top:0; right:0; border-left:15px solid #37a5e5; border-right:15px solid #f2f5f9; border-top:15px solid #f2f5f9; border-bottom:15px solid #37a5e5;}
.clist .bookmark_green{z-index:10; bottom:inherit; right:inherit; top:0; left:0; border-left:15px solid #f2f5f9; border-right:15px solid #1ab99c; border-top:15px solid #f2f5f9; border-bottom:15px solid #1ab99c;}
.clist .bookmark_blue{ z-index:10; bottom:inherit; right:inherit; top:0; left:0; border-left:15px solid #f2f5f9; border-right:15px solid #37a5e5; border-top:15px solid #f2f5f9; border-bottom:15px solid #37a5e5;}
[class^=bookmark]+.nl+.al{ width:calc(35% - 30px);}
[class^=bookmark]+.c1{width:calc(15% - 30px);}
.bookmark_content{ display:none; position:absolute; width:300px; left:30px; top:-15px; padding:10px; line-height:1.35; border-radius:5px; font-size:13px; color:#fff; background-color:rgba(0,0,0,0.9);}
.bookmark_content:before{ content:''; display:block; position:absolute; top:12px; left:-10px; border-right:10px solid rgba(0,0,0,0.9);border-top:6px solid transparent;border-bottom:6px solid transparent;}
.booksdetail .join-area h3 {color: #555; font-size: 14px; line-height:1;}
[class^=bookmark]:hover{ z-index:15;}
[class^=bookmark]:hover .bookmark_content{ display:block;}

/*---------- essay*/
.elist { overflow:hidden; clear:both; width:calc(100% - 20px); border-left:3px solid #ffe8ab; border-bottom:1px solid #e6e8ed; padding:8px; background:#fff; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
.elist div{ display:block; float:left;}
.elist:hover { background:#f6f6f6; border-left:10px solid #ffe8ab;}
.elist:last-child { margin-bottom:0;}
.elist .bn { width:69%; padding-right:1%;}
.elist .au { width:30%; text-align:right;}
.elist .bn a{ font-weight:bold; font-size:15px; line-height:20px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.elist-btn { display:block; text-align:center; background:#f7f7f7; font-size:13px; line-height:40px; border-bottom:1px solid #e6e8ed; border-left:1px solid #e6e8ed; border-right:1px solid #e6e8ed;}
.elist-btn:hover { background:#fff; color:#378bd6;}

/*章節購買頁*/
.blist{ background-color:#fff; font-size:15px; border-bottom: 1px solid #e6e8ed; position:relative; padding:0 10px;}
.blist.bhead{ background-color:#EEE; padding:5px 0;}
.blist>div,.clist>a{ display:inline-block; vertical-align:middle;}
.blist .b1{ width:7%; line-height:55px; text-align:center;}
.blist .b2{width:42%; line-height:55px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.blist .b3{width:15%; line-height:55px; text-align:center;}
.blist .b4{ position:absolute; padding:8px 0; width:28%; right:2%; top:8px; text-align:right; color:#2983D3;}
.blist .b3 .date{ font-size:13px;}
.blist .b4 .money{ color:#f342b8;}
.blist .b2_1{ width:18%; box-sizing:border-box; padding-left:18px;}
.blist .b2_2{ width:80%; text-align:right;}
.blist .b1_1{width:100%; box-sizing:border-box; padding:10px 2% 10px 0; text-align:right;}
.blist .cancel{ display:inline-block; border-radius: 3px; background: #eee; color:#f342b8;  border: 1px solid; padding: 8px 0; text-align:center; margin-right:10px; width:125px;box-sizing: border-box;}
.blist .submit{ display:inline-block; border-radius: 3px; background: #eee; color:#2983D3;  border: 1px solid; text-align:center; width:125px; vertical-align:top; box-sizing: border-box; height:34px; cursor:pointer;}
.transaction-info{ margin:50px 0;}
.transaction-info ol li{ list-style:decimal; margin-left:24px;}
.transaction-info .b_price{ text-align:center; margin-bottom:15px; font-size:1.1em;}
.transaction-info fieldset{ color:#758592; border:1px solid ; padding:10px;}
.transaction-info legend{ text-align:center; font-weight:bold; marging:0 5px; background-color:#f2f5f9;}
.transaction-total{ line-height:1.5;font-size:12px; text-align:left; background-color:rgba(0,0,0,0.8); padding:10px; color:#fff;}
.transaction-total .money{ color:#f342b8; margin-left:5px; font-size:16px; font-weight:bold;}
.checkItem + div{ position:absolute; opacity:0; top:0px; left:7%; z-index:99; width:200px;}


/*---------- imgshow*/
.imgshow { overflow:hidden;}
.imgshow .box{ float:left; width:calc(30% - 30px);}
.imgshow .list-box { float:right; width:68%;}
.imgshow .list { overflow:hidden; clear:both; padding:12px 12px 12px 12px; border-top:1px solid #e6e8ed;}
.imgshow .list:first-child { padding:0 12px 12px 12px; border-top:none}

.imgshow .list .left { display:block; width:20%;}
.imgshow .list .right { float:right; width:78%;}
.imgshow .list .cate{ display:inline-block; line-height:18px; text-align:center; min-width:55px; margin-right:8px; font-weight:normal;}
.imgshow .list .author { margin:8px 0;}
.imgshow .list .desc { display:inline-block; font-size:13px; color:#777; line-height:18px; margin-top:10px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.imgshow .list .desc{ position:relative; line-height:1.4em;  height:2.8em}
.imgshow .list .desc::after { content:"...";}

/*---------- message*/
.message {}
.message .list { overflow:hidden; clear:both; padding:0 15px 15px 0;}
.message .list .left { display:block; width:75px;}
.message .list .right { float:right; width:calc(100% - 90px);}
.message .msg-box { background:#fff; -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset; position:relative; width:90%; padding:10px 5%; height:55px;}
.message .msg-box .arrow { position:absolute; width:26px; height:11px; right:0; bottom:-10px; background:url(../images/icon-msgarrow.png) no-repeat center; background-size:26px 11px}
.message .author:after { content:'：';}
.message .msg { font-size:13px; line-height:18px; margin-top:5px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow:hidden;}
.message .f-gray { font-size:12px; text-align:right; padding-right:25px; margin-top:5px;}
.message .swiper-pagination{bottom:0 !important;}
.message a.list { display:block; /*font-size:14px; line-height:20px;*/}
.message .desc { display:inline-block; font-size:13px; color:#777; line-height:18px; margin-top:10px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

/*---------- comment*/
.comment {}
.comment .list { overflow:hidden; clear:both; padding:15px 0; position:relative;border-bottom:1px solid #DFE4EB;}
.comment .list .left {width:calc(100% - 75px);}
.comment .list .right { float:right;  display:block; width:60px; position:absolute; bottom:27px; right:0;}
.comment .list .right img{ width:100%;}
.comment .msg-box { background:#fff; -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset; position:relative; width:90%; padding:10px 5%; height:55px;}
.comment .response .msg-box { background:#fffbe5; -webkit-box-shadow: 0 0 0 1px #fcee9e inset; -moz-box-shadow: 0 0 0 1px #fcee9e inset; box-shadow: 0 0 0 1px #fcee9e inset; position:relative; width:90%; padding:10px 5% 15px 5%; height:inherit;}
.response{ margin:-10px 0 20px 0;}
.comment .msg-box .arrow { position:absolute; width:26px; height:11px; right:0; bottom:-10px; background:url(../images/icon-msgarrow.png) no-repeat center; background-size:26px 11px}
.comment .response .msg-box .arrow{ position:absolute; width:26px; height:11px; left:0; bottom:-10px; background:url(../images/icon-msgarrow2.png) no-repeat center; background-size:26px 11px}
.comment .msg-head{ height:24px; line-height:24px;}
.comment .bname{ display:inline-block; width:49%; text-align:right; font-size: 14px; color: inherit;font-weight: normal; line-height: 24px; vertical-align:top;overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.comment .bname:before{ content:'@';}
.comment .author {display:inline-block; width:49%; font-weight:bold;}
.comment .author:after{ content:'回覆'; margin-left:5px;}
.comment .member {display:inline-block; width:49%;  overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.comment .msg { font-size:13px; line-height:18px; margin-top:5px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.comment .f-gray { font-size:12px; text-align:right; padding-right:25px; margin-top:5px;}
.comment .blue:hover{ text-decoration:none;}


/*---------- for AD*/
.ad-area { margin:5px auto 10px auto;}
.ad div{ margin:0 auto;}
.ad.w300 { margin:0 auto 30px auto;}
.ad.w3002 { margin-top:30px;}
.ad.w3002 div:first-child { margin-bottom:40px;}
.ad.w3003 { margin-bottom:30px;}

/*各館專題*/
.theme-book-wrap { overflow:hidden; text-align:center;}
.theme-book-wrap a { display:inline-block; margin-right:12px;}
.theme-book-wrap a:last-child { margin-right:0;}
.theme-book-wrap a img { width:158px; height:223px;}
.theme-txt { margin:20px 0; line-height:22px;}

/*---------- go top*/
#gotop{ display:block; width:52px; height:50px; border:1px solid #378bd6; position:fixed; bottom:20px; right:20px; z-index:99;
-webkit-border-radius:25px;-moz-border-radius:25px; border-radius:25px;
background:url(../images/icon-gotop-h.png) no-repeat center #fff; background-size:25px 25px; opacity:0.3; -webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s;}
#gotop:hover { opacity:1;}

/*---------- stickies*/
#stickies { width:1050px; position:absolute; top:180px; left:50%; margin-left:-525px; z-index:10;}
#stickies .notice_stickie { border:solid 2px #399C07; background-color:#D7FFAF; }
#stickies .error_stickie, #stickies .warning_stickie, #stickies .notice_stickie, #stickies .debug_stickie { margin-bottom:10px;padding:10px; }
#stickies .stickies_close_area { margin:0; padding:0 10px 4px 0; float:right; font-size:12px;}

/*---------- gift*/
.gifts .tlist{ line-height:1.5; color:#000;}
.gifts a{ color:#378bd6;}
.gifts .member{ margin-right:5px;}
.gifts .gift{ margin-left:5px;}
.g_comment{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding-right:10px; width:100%;}

/*---------- breadcrumbs*/
.breadcrumbs{width:100%; max-width: 1050px; margin:20px auto; box-sizing:border-box;}
.breadcrumbs a{margin-right:2px;}
.breadcrumbs a:after{ content:'>'; margin-left:2px;}
.breadcrumbs .crumbh1{ display:inline-block; font-weight:bold; color:#378bd6;}
.breadcrumbs a:hover{ opacity:0.7;}

/*---------- cates*/
/*catetitle*/
.cate-toptitle { width:100%; text-align:center; padding:20px 0 30px 0;}
.cate-toptitle.love { background:url(../images/cate1-bg.jpg) center center;}
.cate-toptitle.dream { background:url(../images/cate2-bg.jpg) center center;}
.cate-toptitle.all { background:url(../images/cate3-bg.jpg) center center;}
.cate-toptitle.light { background:url(../images/cate4-bg.jpg) center center;}
.cate-toptitle h1.title{ color:#fff; padding:20px 0; font-size:35px;}
.cate-toptitle.love h1.title { text-shadow:0 0 10px #c3596b;}
.cate-toptitle.light h1.title { text-shadow:0 0 10px #bb8e04;}
.cate-toptitle .breadcrumbs{ margin:0; padding:0; text-align:left;}
.cate-toptitle .crumbh1 { color:#000;}

/*hotbook*/
.hottabs {}
.hottabs .box { float:left; width:29.333333%; margin:0 1%; padding:10px 1%;}
.hottabs .box:nth-child(3) { padding:0 1%;}
.hottabs ul.tabs { height: 40px; text-align:center; margin-bottom:15px;}
.hottabs ul.tabs li { display:inline-block; height: 39px; line-height: 39px;}
.hottabs ul.tabs li a { display:inline-block; padding: 0 20px; font-size:16px;}
.hottabs ul.tabs li a:hover { color:#378bd6;}
.hottabs ul.tabs li.active { border:1px solid #e6e8ed; border-bottom:1px solid #f2f5f9;}
.hottabs ul.tabs li.active a { color:#378bd6;}

/*book list*/
.booklist { overflow:hidden; clear:both; width:100%; border-bottom:1px solid #e6e8ed; padding:8px 0;}
.booklist div{ display:block; float:left;}
.booklist:last-child { border-bottom:0;}
.booklist .bn { width:69%; padding-right:1%;}
.booklist .au { width:30%; text-align:right;}
.booklist .bname { font-size:14px; line-height:16px; }

/*terasure*/
.tr-marquee-box { border-left:3px solid #93c7f6; padding:12px; background:#fff; -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset;}
.tr-marquee { border-bottom:1px solid #e6e8ed; height:45px; position: relative;  z-index: 1; overflow: hidden; border:none;}
.tr-marquee ul {position: absolute;width:100%;}
.tr-marquee ul li{overflow: hidden;text-decoration: none;line-height:22px; height:45px;}
.tr-marquee ul li span.break { display:block; width:100%; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden;}

/*book rank*/
.bookrank { margin:10px 0;}
.bookrank .rbox { overflow:hidden; clear:both; position:relative; margin:10px 0;}
.bookrank .rbox .num{ width:24px; height:24px; position:absolute; left:0; top:0; z-index:1; color:#fff; font-size:12px; text-indent:3px;}
.bookrank .rbox .num.n1{ background:url(../images/icon-rank1.png) no-repeat center; background-size:24px 24px;}
.bookrank .rbox .num.n2{ background:url(../images/icon-rank2.png) no-repeat center; background-size:24px 24px;}
.bookrank .rbox .num.n3{ background:url(../images/icon-rank3.png) no-repeat center; background-size:24px 24px;}
.bookrank .rbox .left{ display:block; width:30%;}
.bookrank .rbox .right{ width:68%;}
.bookrank .rbox .desc { margin-top:10px;}
.bookrank .rbox .desc { font-size:13px; color:#777; line-height:18px; margin-top:10px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.bookrank .rbox .desc{ position:relative; line-height:1.4em; height:2.8em;}
.bookrank .rbox .desc::after { content:"...";}
.bookrank .list { border-top:1px solid #e6e8ed; padding:8px 0; overflow:hidden; clear:both;}
.bookrank .list div { float:left;}
.bookrank .list .ra { width:10%; font-weight:bold; color:#378bd6;}
.bookrank .list .bn { width:70%;}
.bookrank .list .bn a{ font-weight:bold; font-size:15px; line-height:20px; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
.bookrank .list .au { width:18%; margin-left:2%;}
.rankmore-btn { background:#e4eaf2; color:#adadad; display:block; clear:both; width:100%; text-align:center; padding:10px 0;}
.rankmore-btn:hover { background:#fff;}

/*---------- booklistUI*/
.list-bookUI {}
.list-bookUI .box { display:block; padding: 0; margin-bottom:20px;}
.list-bookUI .box:hover { background:#f8f8f8;}
.list-bookUI .box .left{ display:inline-block; width:19%; padding:10px 1.5%; height: 170px;position:relative; vertical-align:top; float:none; }
.list-bookUI .box .right{ display:inline-block; width:75%; padding: 10px 1% 10px 1%; vertical-align:top; float:none;}
.list-bookUI .box .author { margin-bottom: 15px; }
.list-bookUI .box .desc { margin-top: 15px; overflow:hidden; min-height:70px; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical;}
.list-bookUI .box .desc{ position:relative; line-height:1.4em;  height: 5.6em}
.list-bookUI .box .desc::after { content:"...";}
.list-bookUI .tag-area { border:1px solid #e6e8ed; background:#f8f9fb; padding: 10px; clear: both;}
.list-bookUI .tag-area a:before { content: '#'; }
.list-bookUI .tag-area a { display: inline-block; margin-right: 10px; }
.list-bookUI .tag-area a:hover { text-decoration: underline; }
.list-bookUI .tag-area .ico { margin-right: 10px; }
.list-bookUI .ico-f{ background:url(../images/icon-finish.png) no-repeat center; width: 17px; height: 24px; background-size: 17px 24px; position: absolute; left:10px; top:10px;}
.list-bookUI .ico-j{ background:url(../images/icon-award.png) no-repeat center; width: 28px; height: 37px; background-size: 28px 37px; position: absolute; left:0; bottom:-5px; cursor:pointer;}
.list-bookUI .join-area { position:relative; }
.list-bookUI .join-area .tip { display: none; position: absolute; left: 0; top: 0; border-radius: 5px; border: 1px solid #9dcee9; width: 300px; padding: 10px; z-index:10; background: #e0f4ff;}
.join-area .tip ul { padding-left:20px;}
.join-area .tip ul li { list-style:disc;}
.list-bookUI .detail .t-gray{ display: inline-block; width:80px; font-size:14px; }
.list-bookUI .detail { font-size: 14px; margin:5px 0; }
/*.ico-j:hover + .tip{ display:block!important;}*/
/*短文用*/
.list-bookUI.notelist .box{ height:160px; margin-bottom:10px;}
.list-bookUI.notelist .box .left{ height:100px; position:static;}
.list-bookUI.notelist .box .desc { font-size:13px; color:#777; line-height:18px; margin-top:10px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.list-bookUI.notelist .box .desc{ position:relative; line-height:1.4em; height:2.8em;}
/*活動用*/
.list-bookUI.actlist .box{ height:115px; margin-bottom:10px;}
.list-bookUI.actlist .box .user-m { width:90px; height:90px;}
.list-bookUI.actlist .box .left{ width:110px; padding:10px 0; height:90px; position:static; text-align:center; vertical-align:middle;}
.list-bookUI.actlist .box .right{ display:inline-block; width:calc(100% - 140px); padding: 10px 10px 10px 0;}
.list-bookUI.actlist .box .bname { line-height:22px;}
.list-bookUI.actlist .box .desc { font-size:13px; color:#777; margin-top:0; min-height:1px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; position:relative; line-height:1.4em; height:2.8em;}


/*最近更新書籍*/
.simplelist { padding:0; margin-top:10px;}
.simplelist .bname{ font-size:14px; border-bottom:1px solid #ddd; padding:3px 10px; color:#666;}
.simplelist .bname:last-child { border-bottom:none;}

/*---------- page number*/
.pagenum { clear:both; text-align:center; margin:30px 0;}
.pagenum span,.pagenum a{ display:inline-block; margin:3px; padding:5px 10px; border:1px solid #f2f5f9; border:1px solid #ddd;}
.pagenum a:hover { background:#fff;}
.pagenum .current { background:#fff; color:#378bd6; font-weight:bold;}
.pagenum .disabled { opacity:0.5;}

/*---------- 作家專區*/
.aname{ font-size:18px; color:#378bd6; font-weight:bold; line-height:24px;}
.aname:hover { text-decoration:underline;}
.a-title { text-align:center; font-size:24px; font-weight:bold; padding:10px 0; line-height:30px;}
.a-title span { background:#cedaeb; width:50px; height:4px; display:block; margin:10px auto; border-radius:10px;}
.author-hot-wrap { margin:0 40px; position:relative;}
.author-hot { width:100%; padding-top:100px; padding-bottom:50px; margin-top:20px;}
.author-hot .abox { /*float:left; width:32.333333%;*/ height:230px; position:relative;}
.author-hot .abox:nth-child(2) { margin: 0 1.5%; }
.author-hot .abox:last-child { margin-right:none;}
.author-hot .photo{ text-align:center; position:absolute; top:-100px; width:100%; height:230px; padding-top:8px;}
.author-hot .photo .imgs{ display:block; margin:0 auto;}
.author-hot .photo .imgs img { border-radius:50%; box-shadow:0 0 5px 0 rgba(0,0,0,.2);}
.author-hot .photo .aname{ display:block; text-align:center; margin:10px auto;}
.author-hot .info { overflow:hidden; width:calc( 100% - 30px) !important; height:100px; position:absolute; bottom:10px; left:0; padding:15px;}
.author-hot .info .left{ width:31%; height:150px; position:relative;}
.author-hot .info .left .new { position:absolute; top:5px; left:-10px; width:35px; text-align:center; line-height:20px; color:#fff; font-size:12px; background:#378bd6;}
.author-hot .info .right{ width:68%;}
.author-hot .info .desc { margin-top:10px; font-size:13px; line-height:18px; margin-top:10px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;}
.author-hot .info .desc{ position:relative; line-height:1.4em; height:5.6em;}
/*swiper arrow*/
.author-hot-wrap .swiper-button-next { background-image:url(../images/icon-swiper-next.png); right:-40px; background-size:19px 50px;}
.author-hot-wrap .swiper-button-prev { background-image:url(../images/icon-swiper-prev.png); left:-40px; background-size:19px 50px;}

/*pub author*/
.author-pub {width: 100%; height:auto;}
.author-pub .swiper-wrapper { padding:10px 0 30px 0;}
.author-pub .box { overflow:hidden;}
.author-pub .box .left{ display:block; width:40%;}
.author-pub .box .right{ width:55%;}
.author-pub .box .desc { overflow:hidden; min-height:70px; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical;}
.author-pub .box .desc{ position:relative; line-height:1.4em;  height: 5.6em}
.author-pub .box .desc::after { content:"...";}
.author-pub .box .btns { clear:both; width:100%; padding:10px 0; text-align:center;}
.author-pub .box .bname { font-size:14px; line-height:15px;}
/*author tab*/
.author-tab { position:relative; width:100%; height:40px; border-bottom:1px solid #e6e8ed; margin-bottom:10px;}
.author-tab h3.title { position:absolute; left:0; top:0; height:40px;}
.author-tab .pag { position:absolute; right:0; top:10px; z-index:1; width:120px; height: 40px;}
.author-tab .pag .swiper-pagination { right:0;}
.author-tab .pag .swiper-pagination-bullet { margin-right:5px;}
/*new author*/
.author-new .box { overflow:hidden;}
.author-new .box .left{ position:relative;}
.author-new .box .right{ width:calc(92% - 150px); padding:15px 4%; line-height:22px;}
.author-new .box .desc { color:#777; font-size:15px; margin:10px 0; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;}
.author-new .box .desc{ position:relative; line-height:1.4em;  height:5.6em}
.author-new .box .desc::after { content:"...";}
.author-new .author-pub .box .bname { font-size:14px; line-height:15px;}
/*精選作家*/
.author-choice { padding-top: 10px; text-align:center;}
.author-choice .abox { display:inline-block; vertical-align:top; width: 190px; margin:0 8px 15px 8px; height: 290px; text-align: center; position: relative; padding-top:10px; }
.author-choice a.aname { display: block; margin-top: 8px; padding:0 5px; font-size: 16px; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
.author-choice .info { position: absolute; bottom:1px; left:1px; width:calc( 98% - 2px ); padding: 8px 1%; border-top:1px solid #e6e8ed; background:#f8f9fb;}
.author-choice .abox:hover { box-shadow: 0 0 0 1px #378bd6; }
/*看更多*/
.boxhidden { display: none !important; }
.readmore-area{ clear:both; padding:20px 0; text-align:center;}
.bigmore-btn { cursor: pointer; display:block; width:220px; font-size: 16px; text-align:center; padding:15px 0; margin: 10px auto; background:#e4eaf2; border: 1px solid #d6d9e2;}
.bigmore-btn:hover { background:#fff;}

/*----------排行榜*/
.rank-wrap { overflow:hidden;}
.rank-wrap .rank-box { width:320px; float:left; margin:0 40px 30px 0;}
.rank-wrap .rank-box:nth-child(even) { margin:0 0 30px 0;}

.rank-menu{ margin-bottom:20px;}
/*.rank-menu li{ float:left; margin:5px 0; color:#ccc; }
.rank-menu a{ color:#666; margin:0 5px;}
.rank-menu a:hover{color:#31a5df;}
.rank-menu a.current{ color:#31a5df; text-decoration:underline;}*/

.rank-menu .rank-name{ position:relative; display:inline-block; margin:0 8px 8px 0; background:#e4eaf2;}
.rank-menu .rank-name:hover { background:#fff;}
.rank-menu .rank-btn{ display: block; padding:10px 25px; font-size:16px;}
.rank-menu .rank-btn:hover { background:#FFF; color:#31a5df; }
.rank-menu .rank-ul { display:none; width:150px; background:#fff; position: absolute; left:0; top:36px; z-index:3;}
.rank-menu .rank-ul li { width:100%; background:#fff;}
.rank-menu .rank-ul a { display:block; color:#666; border:none; margin-right:0; padding:3px 20px; line-height:25px; font-size:14px;}
.rank-menu .rank-ul a:hover { background:#e4eaf2; color:#31a5df;}

/*----------table setting*/
table { width:100%; border-collapse: collapse; }
.table-rwd { background: #fff; border:1px solid #ddd; table-layout:fixed; word-break:break-all;}
.rwd-table th,.rwd-table td{display:table-cell;}
.table-rwd a.bname,.table-rwd a.author { overflow:visible; white-space:normal; text-overflow:clip;}
.table-rwd th {color: #000; font-weight: bold; text-align:left; font-size:14px; padding: 1em 0.5em;}
.table-rwd td { padding:0.8em 0.5em;}
.table-rwd tr { border-bottom:1px solid #ddd;}
.table-rwd tr:hover { background:#f8f8f8;}
.table-rwd td,.table-rwd td a { font-size:14px; line-height:18px;}
.table-rwd td a:hover { text-decoration:underline;}
.table-rwd td:before {　display: none;}
.table-rwd .t-center { text-align:center !important;}
table .w5{ width:5%;}
table .w10{ width:10%;}
table .w15{ width:15%;}
table .w20{ width:20%;}
table .w25{ width:25%;}
table .w30{ width:30%;}
table .w35{ width:35%;}
table .w40{ width:40%;}

/*----------標籤頁*/
.cates-tags { padding:20x 0; margin-bottom:20px;}
.tags-select{ display:none;}
.tags-select:checked + span{ font-weight:bold; background:#ffeec8; border:1px solid #f8c27c; color:#ff863d;}
.tags-select + span{ cursor:pointer; display:inline-block; padding:8px 15px; border-radius:2px; background:#fff; border:1px solid #ddd; margin:0 8px 8px 0;}


/*---------- btn2*/
[class^=btn-]{ display:inline-block; width:auto !important; padding:10px 20px; font-size:15px; border-radius:3px; margin:0 8px 5px 0; cursor:pointer;line-height: 15px;
    vertical-align: top;}
/*[class^=btn-]:last-child { margin:0 0 0 0;}*/
.btn-blue { background:#378bd6; color:#fff; border:1px solid #247bc9;}
.btn-blue:hover { background:#247bc9;}
.btn-white { background:#fff; border:1px solid #ddd;}
.btn-white:hover { background:#eee;}
.btn-gray { background:#e4eaf2; border: 1px solid #d6d9e2;}
.btn-gray:hover { background: #fff; }
.btn-bgray{background-color:#7f97ae; color:#fff;}
.btn-blue:hover{background-color:#1066C4;}

.btn-more { display:block; clear:both; width:200px; font-size:13px; text-align:center; margin:10px auto 0 auto; line-height:40px; background:#e8edf0; padding:0;}
.btn-more:hover { background:#fff; color:#378bd6;}
.btn-comment{display: block;width: 200px!important;font-size: 13px;text-align: center;margin: 0px auto 20px auto!important;line-height: 40px; background: #4b5360; color:#fff; padding:0;}
.btn-comment:hover{ background-color:#fff; color:#2983D3;}
.b-center { width:200px !important; margin:10px auto 0 auto !importants;}



/*---------- btn*/
[class^=BTN_]{ display:block; height:38px; line-height:38px; text-align:center; font-size:15px;-webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
.BTN_blue{ background-color:#2983D3; color:#fff;}
.BTN_pink{  background-color:#F073BA; color:#fff;}
.BTN_orange{ background-color:#FF8827; color:#fff;}
.BTN_brown{ background-color:#A32E00; color:#fff;}
.BTN_blue:hover{background-color:#1066C4;}
.BTN_pink:hover{ background-color:#DD4A93}
.BTN_orange:hover{ background-color:#EF4518;}
.BTN_brown:hover{ background-color:#752714;}
.BTN_bgray{background-color:#7f97ae; color:#fff;}
.BTN_bgray:hover{background-color:#52697f;}
.BTN_gray { background:#e3e3e3; color:#bbb; text-shadow:0 0 1px #d8d8d8;}
.BTN_done {background:#e4eaf2; border: 1px solid #d6d9e2; box-sizing:border-box;}




/*---------- share*/
.share a{ display:inline-block; background-image:url(../images/share.png); vertical-align:middle; text-indent:-9999px; margin:0 2px;}
.btn_fb{ width:19px; height:20px; background-position:0 0;}
.btn_plurk{ width:19px; height:20px; background-position:-30px 0;}
.btn_twitter{ width:19px; height:20px; background-position:-60px 0;}
.btn_gplus{ width:19px; height:20px; background-position:-90px 0;}
.btn_wb{ width:19px; height:20px; background-position:-120px 0;}
.btn_fb:hover{background-position:0 -30px;}
.btn_plurk:hover{ background-position:-30px -30px;}
.btn_twitter:hover{background-position:-60px -30px;}
.btn_gplus:hover{ background-position:-90px -30px;}
.btn_wb:hover{ background-position:-120px -30px;}


/****************書本頁****************/
.money:after{ content:''; display:inline-block; width:14px; height:14px; background:url(../images/coin.png) no-repeat; margin:0 3px;}
/*投票*/
.vote{ margin:15px 0;}
.voting{ display:inline-block; vertical-align: middle;}
.star{ background:url(../images/share.png) 0px -62px; display:block; width:18px; height:18px; line-height:32px;float:left;margin-right:3px;}
.fullStar{ background-position:-30px -62px;}
.stars{ overflow: hidden;}
.lighton{background-position:-30px -62px;}
.pearl{ display:inline-block; vertical-align: middle; margin:0 15px; font-size:22px; color:#dce2e7 ;line-height:32px; }
.spear{ display:inline-block; vertical-align: middle; line-height:30px; font-size:22px;color:#dce2e7;}
.pearl:before{content:''; display:inline-block; width:30px; height:32px; vertical-align: middle; background:url(../images/share.png) 0px -94px no-repeat;}
/*.pearl:hover{ background-position:-62px -94px; color:#a7bfe1;}*/
.spear:before{ content:''; display:inline-block; width:35px; height:30px; vertical-align: middle; background:url(../images/share.png) 0px -146px no-repeat;}
/*.spear:hover{ background-position:-75px -146px; color:#a7bfe1;}*/
/*訊息*/
.msg-offsell{ background-color:#000; color:#fff; line-height:36px; padding:0 16px;}
.msg-buyyet{ background-color:#80175f; color:#fff; line-height:36px; padding:0 16px; text-align:center;}
.msg-onsale{ background-color:#f22cb3;color:#fff; line-height:36px; padding:0 16px;}
.msg-onsale .discount{ color:#fff074; margin:0 5px; font-weight: bold;}
.msg-onsale .money{ color:#fff074; margin:0 5px; font-weight: bold;}
.msg-onsale .percent{ margin-right:30px; }
.msg-onsale .date{font-size:13px;}
.msg-bookmarks{display:block; background-color:#0dbdfe; color:#fff; line-height:36px; padding:0 16px;}
.msg-bookmarks:before{ content:'最後閱讀：';}
.msg-bookmarks:hover{ text-decoration:underline;}
.BC{width: 180px; height: 254px; position:relative; margin: 0 auto 20px auto;}
.icon-Rrated:after{ content:''; display:block; position:absolute; top:5px; left:5px; z-index:10; width: 35px; height:35px; background:url(../images/icon_18.png) no-repeat;}

.booksdetail{ box-sizing:border-box; padding:20px 15px 15px 15px; position:relative;-webkit-box-shadow: 0 15px 15px -20px rgba(0,0,0,0.3); -moz-box-shadow: 0 15px 15px -20px rgba(0,0,0,0.3); box-shadow: 0 15px 15px -20px rgba(0,0,0,0.3); margin-bottom:20px;}
.booksdetail:after{ content:''; display:block; clear:both;}
.booksdetail .share{ position:absolute; right:10px; top:10px;}
.booksdetail .right{ width:calc( 100% - 200px);}
.booksdetail h3{ margin-bottom:8px; color:#378bd6;}
.booksdetail dt{ float:left; width:100px; margin-bottom:10px; color:#000;}
.booksdetail dd{ margin-bottom:10px;}
.b_statu{ color:#ff7d09;}
.b_statu .current_statu{ color:#555; margin-left:3px;}
.b_author a{ font-size:16px; font-weight:bold;}
.b_price .money{ color:#f342b8; font-size:16px; font-weight:bold;}
.b_discount .money{ color:#f342b8; font-size:16px; font-weight:bold;}
.book_data{ width:32%; display:inline-block;font-size:12px; vertical-align:top;}
.book_data tr{border-bottom: 2px solid #fff;}
.book_data th{ text-align:left; background-color:#999; color:#fff; padding:0 5px; box-sizing:border-box; width:60px;}
.book_data td{ color:#999; padding:0 5px;}
.BTN-box{ margin:10px 0 20px 0;}
.BTN-box a{ margin:0 10px 10px 0;}
.BTN-box [class^=BTN_]{ display:inline-block; width:125px; border-radius:5px; }
.booksdetail .ico-j{ background:url(../images/icon-award.png) no-repeat center; width: 28px; height: 37px; background-size: 28px 37px; cursor:pointer; position: absolute; left: 2px; bottom: -11px;}
.booksdetail .join-area { position:relative; text-align:left;}
.booksdetail .join-area .tip { display: none;  position: absolute; left:0; top:0; border-radius: 5px; border: 1px solid #9dcee9; width: 300px; padding: 10px; z-index:2; background: #e0f4ff;color: #555; font-size: 14px; line-height:1; text-align:left;}
.booksdetail .join-area h3 {color: #555; font-size: 14px; line-height:1;}
.booksdetail .detail .t-gray{ display: inline-block; width:80px; }
.booksdetail .detail { font-size: 14px; margin:5px 0; }
/*內容簡介*/
.book_intro{ /*border-top:1px solid #DFE4EB;*/ padding:20px; line-height:1.35; background:#fff; -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset; border-radius:3px;}
.book_intro .tags{ margin:20px 0 10px 0;}
.book_intro .tags a:hover{ background-color:#555; color:#fff;}
/*最新章回*/
.newes_chapter{ margin-bottom:30px; background:#fff; -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset; border-radius: 3px;}
.newes_chapter .wbox{overflow:hidden; padding:10px; position:relative; background:none;}
.newes_chapter h4{ margin:5px 0 10px 0; font-size:16px; color: #378bd6; width: calc(100% - 150px);}
.newes_chapter .date{ position:absolute; right:15px;top:15px; font-size:13px;}
.newes_chapter .bname{ color:#378bd6;}
.chapter_img{ width:115px; height:115px; overflow:hidden; margin:0 15px 10px 10px;}
.chapter_img img{width:100%;}
.newes_chapter .right{ width:530px;}
.newes_chapter .msg{ font-size:16px; font-weight:bold; color:#000; text-align:center; line-height:36px;}
.newes_chapter .BTN_blue{ border-radius:3px; background:#f7f7f7; color:#2983D3; border:1px solid #ddd;}
.newes_chapter .BTN_pink{ border-radius:3px; background:#f7f7f7; color:#F073BA; border:1px solid #ddd;}
.newes_chapter .BTN_blue:hover,.newes_chapter .BTN_pink:hover { background:#fff;}

/*其他作品*/
.other_works .box-list{ text-align:center;}
.other_works .box{width:158px; display:inline-block; box-sizing:border-box; margin:0 9px 10px 0; text-align:left;}
.other_works .cover-b{ margin-bottom:10px;}
.other_works .btn-more{ clear:both;}
.box-list{ overflow:hidden;}
/*我要回應*/
.comments-box{ padding: 20px 0; /*border-top:1px solid #DFE4EB;*/ overflow: hidden;}
.comments-list{ margin-bottom:20px;}
.comments-list.reader{ float:left; width:100%;}
.comments-list.author{ float:right; width:70%;}
.comments-list .func{ clear:both; width:100%; margin:5px 0; color:#999;}
.comments-list .func .date{ font-size:13px;}
.reader>.left{ max-width:90px;}
.reader>.left img{ width:100%; margin:0 10px 10px 0;}
.reader>.right{width:calc(100% - 120px); position:relative;}
.author>.right{width:100%; padding-right:10px; box-sizing:border-box;}
.reader .msg{padding: 12px;background: #fff;-webkit-box-shadow: 0 0 0 1px #e6e8ed inset;-moz-box-shadow: 0 0 0 1px #e6e8ed inset;box-shadow: 0 0 0 1px #e6e8ed inset;border-radius: 3px; width:100%; min-height: 90px; box-sizing: border-box; position:relative; overflow:hidden; line-height:22px;}
.reader>.right:before{ content:''; display: block; position: absolute; top:0px; left:-9px; background: url(../images/msg_l.png) no-repeat; width:10px; height: 18px; z-index:1;}
.author .msg{padding: 12px; box-sizing:border-box; background: #fffbe5; -webkit-box-shadow: 0 0 0 1px #feeb80 inset;-moz-box-shadow: 0 0 0 1px #feeb80 inset;box-shadow: 0 0 0 1px #feeb80 inset;border-radius: 3px;position:relative; line-height:22px;}
.author .msg:before{ content:''; display: block; position: absolute; top:0px; right:-9px; background: url(../images/msg_r.png) no-repeat; width:10px; height: 18px;}
.form-line{ margin-bottom:10px;}
.msg-icon{ float:left; margin:0 10px 10px 0;}
.msg-text{ float:left; width:calc(100% - 35px);}
.msg h4{ color:#000; margin-bottom:8px;}

/*關注此書的讀者也關注*/
.fallow-books .box{overflow:hidden; margin-bottom:10px;}
.fallow-books .box .left{ display:block; width:40%;}
.fallow-books .box .right{ width:55%;}
/*誰來我家*/
.avatar-img{ overflow:hidden; margin-bottom:30px;}
.avatar {display:block; float:left; width:50px; height:50px; overflow:hidden; margin:7px;}
.avatar img{width:100%;}

/****************章回頁****************/
.ohterworks .tlist .cl { padding-top:0; line-height:28px; min-width:80px;}
.toggle{ cursor:pointer;}
.toggle .book_intro{ display:none;}
.clist{ background-color:#fff; font-size:15px; border-bottom: 1px solid #e6e8ed; position:relative; padding:0 10px; color:#555;}
.clist>div,.clist>a{ display:inline-block; vertical-align:middle;}
.clist .c1{width:15%; line-height:55px;text-align:center;}
.clist .c2{width:30%; line-height:55px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
/* 免登閱讀 */
.clist.nologin .c1 { position:relative;}
.clist.nologin .c1:after { position:absolute; right:5px; top:0; content:"•"; font-size:20px; font-weight:bold; color:#2983D3;}

.clist .c3{width:24%; line-height:55px; text-align:center;}
.clist .c4{ position:absolute; padding:8px 0; width:23%; right:2%; top:8px; text-align:center; }
.c4:before{ content:''; display:inline-block; height:20px;vertical-align:middle;}
.c4_text{ display:inline-block; vertical-align:middle; width:95%; color:#fff;}
.clist .cname{ color:#000; font-weight:bold; }
.clist .c3 .date{font-size:13px;}
.btn-mutibuy{ display: block; width:150px !important;font-size: 13px;text-align: center; margin:20px auto;line-height: 40px; background:#fff; border:1px solid #2983D3; color:#2983D3; padding:0;}
.btn-mutibuy:hover{ background-color:#fff; color:#247bc9;}

.slidedown:after{content:''; display:block; border-top:1px solid #DFE4EB; margin:20px 0; width:100%; height:20px; background:url(../images/slide-d.png) no-repeat center bottom;}

.clist .BTN_blue{ border-radius:3px; background:#fff; border:1px solid #2983D3;}
.clist .BTN_pink{ border-radius:3px; background:#fff; border:1px solid #ff3376;}
.clist .BTN_blue:hover { background:#e7f2fc;}
.clist .BTN_pink:hover { background:#fde1ea;}
.clist .BTN_blue .c4_text { color:#2983D3;}
.clist .BTN_pink .c4_text { color:#ff3376;}
.clist .f-yellow{ color:#ff3376;}

/****************找書看****************/
.FindB h3.title.mb{ margin:0 0 20px 0;}
.findbook{ position: relative; padding: 25px; margin-bottom: 50px;}
.findbook:after{ content:''; position: absolute; width:19px; height: 19px; background: url(../images/findbook.png) no-repeat; bottom:-18px; left:0; z-index: 2;}
.find-item{ clear:both;line-height:24px; overflow:hidden; margin-bottom: 20px;}
.find-item .label{ display: inline-block; vertical-align: top; text-align: center; color:#999; width:90px;}
.label.l39{ line-height:39px;}
.find-item .fortabs{ display: inline-block; width:calc(100% - 110px);}
.find-item .forradio{ display: inline-block; width:calc(100% - 110px); }
.find-item ul.tabs{ position:inherit; text-align: left; height: inherit;}
.find-item ul.tabs li.active{ background-color:#fffddd; border-top-left-radius:2px; border-top-right-radius:2px;}
.find-item ul.tabs li a{ font-size:15px; line-height:24px;}
.find-item .tab_container{ background-color:#fffddd; border-radius:2px; margin-top: -1px;}
.find-item .pane{ padding: 5px 5px 5px 12px;}
.find-item .radio{ display:inline-block; margin:0 5px 5px 0; padding:2px 5px;}
.find-item .radio:hover{ background-color:#F6F6F6; border-radius:2px;}
.find-item .pane .radio:hover{ background-color:inherit;}
.find-item .radio.checked{ color:#378bd6;}
.table{ /*display:table;*/ width: 100%;}
.table .row{ /*display:table-row;*/ width:100%; border-bottom:1px solid #e6e8ed;}
.table .rhead{border-bottom: 2px solid #d8d8d8;}
.table .row>div{ /*display:table-cell;*/ display:inline-block; margin-right:-3px; vertical-align: middle; padding: 5px; /*border-bottom:1px solid #e6e8ed;*/}
.table .rhead>div{ /*border-bottom: 2px solid #d8d8d8;*/ line-height: 30px; height: 30px; color: #999;}
.table .t1{width:6%;}
.table .t2{width:18%;}
.table .t3{width:17%;}
.table .t4{width:9%;}
.table .t5{width:12%;}
.table .t6{width:6%;}
.table .t7{width:17%;}
.table .t8{width:6%;}

.table .tags a{ font-size: 13px; padding: 2px 9px; margin: 0 4px 4px 0;}
.table .tcate{ color:#999;}
.table .num{ white-space: nowrap;}
.table .date{white-space: nowrap; font-size: 13px;}
.table .statu-b{ display: inline-block;background: #378bd6; padding: 3px 10px; color:#fff; width: initial;}
.table .statu-g{ display: inline-block;background: #797979; padding: 3px 10px; color:#fff; width: initial;}

/****************搜尋頁****************/
.search-result{ color:#999; height:45px; line-height: 45px; vertical-align: baseline; border-bottom: 2px solid #d8d8d8; }
.keyword{ font-size:1.1em; color: #378bd6; font-weight: bold;}
.keyword:before{content:'"'; color: #999;}
.keyword:after{content:'"'; color: #999;}
.search-author{ }
.search-author .box{ overflow:hidden; position:relative; margin-bottom: 20px;}
.search-author .left{ width:25%; box-sizing:border-box;}
.search-author .left img{ width:100%;}
.search-author .right{ width:73%; box-sizing:border-box;}
.search-author .box .author{ font-weight: bold; color:#378bd6; font-size:18px;line-height: 1.5;}

.search-none{ text-align:center; font-size:20px; font-weight:bold; color:#999; margin-bottom:25px;}

.search-book{ }
.search-book .box{ overflow:hidden; position:relative; margin-bottom: 20px;}
.search-book .left{ width:25%; box-sizing:border-box;}
.search-book .left img{ width:100%;}
.search-book .right{ width:73%; box-sizing:border-box;}
.search-book dt{ float:left; width:100px; margin-bottom:10px; color:#000;}
.search-book dd{ margin-bottom:10px; padding-left: 100px;}
.search-book .box .bname{ color:#378bd6; font-size:18px; line-height: 1.5;}
.search-book .box .author{ font-weight: bold; color:#000; font-size:16px; margin-bottom: 20px;line-height: 1.5;}


/*****************活動專區****************/
.act-filter { clear: both; margin: 10px 0; }
.act-filter a{ display: inline-block; padding: 8px 10px; font-size: 14px; color: #999; }
.act-filter a:hover { color: #378bd6; }
.act-filter a.active { border:1px solid #378bd6; color: #378bd6; border-radius: 3px;}
/*editor-tailks*/
.edit-table {}
.edit-table .field{ display: block; overflow: hidden; clear: both; border-bottom: 1px solid #ddd; padding: 8px; }
.edit-table .field:hover { background:#f8f8f8;}
.edit-table .field:last-child { border-bottom: none; }
.edit-table .tag,.edit-table .ptitle,.edit-table .ptime { float: left; margin-right: 1%; }
.edit-table .tag { width: 13%; text-align: center;}
.edit-table .ptitle { width:60%; padding: 6px 0;}
.edit-table .ptime { width: 23%; padding: 6px 0; text-align:right;}
.edit-table .tag span,.act-tag { display: inline-block; border-radius: 3px; font-size: 13px; width:65px; padding: 6px 0; color: #fff; vertical-align: middle; text-align: center;}
.edit-table .tag span.e1,.act-tag.e1{ background:#ffb422; }
.edit-table .tag span.e2,.act-tag.e2{ background:#ff6d71; }
.edit-table .tag span.e3,.act-tag.e3{ background:#0a9c67; }
.edit-table .tag span.e4,.act-tag.e4{ background:#3da7f1; }
.edit-table .tag span.e5,.act-tag.e5{ background:#ba7ce9; }
.edit-table .tag span.e6,.act-tag.e6{ background:#14a2d0; }
.edit-table .tag span.e7,.act-tag.e7{ background:#ff9600; }
/*活動專區內文*/
.msg-wrap{ padding: 20px; }
.msg-title{ border-bottom: 1px solid #e4eaf2; padding-bottom: 10px;}
.msg-title h1 { font-size: 26px; line-height: 32px; display: inline-block; vertical-align: middle; margin-left:8px; }
.msg-title .func{ overflow: hidden; clear: both; margin-top: 10px;}
.msg-title .ptime { float: left; line-height: 40px; }
.msg-title .msg-share { float: right; text-align: right;}
.msg-title .msg-share li{ display: inline-block; margin-right: 3px; }
.msg-title .msg-share li:last-child { margin-right: 0; }
.msg-title .msg-share li a{ display: block; width:30px; height: 30px; border-radius: 50%; border: 1px solid #e4eaf2;}
.msg-title .msg-share li a:hover { opacity: 0.7; }
.msg-title .msg-share li.fb a{ background:url(../images/icon-share-fb.png) no-repeat center; background-size: 16px 16px;}
.msg-title .msg-share li.pl a{ background:url(../images/icon-share-pl.png) no-repeat center; background-size: 16px 16px;}
.msg-title .msg-share li.tw a{ background:url(../images/icon-share-tw.png) no-repeat center; background-size: 16px 16px;}
.msg-title .msg-share li.go a{ background:url(../images/icon-share-go.png) no-repeat center; background-size: 16px 16px;}
.msg-content{ padding-top: 20px; line-height:normal; }
.msg-content a { color:#378bd6;}
.msg-content a:hover { text-decoration:underline;}

/*活動專區我要回應*/
.comments-box.foract { padding: 10px 0 40px 0; border-top:none; overflow: hidden;}
.comments-box.foract .comments-list{ margin-bottom:20px;}
.comments-box.foract .comments-list .func{ clear:both; width:100%; margin:5px 0; color:#999;}
.comments-box.foract .comments-list .func .date{ font-size:13px;}
.comments-box.foract .reader>.left{ max-width:150px;}
.comments-box.foract .reader>.left img{ width:100%; margin:0 10px 10px 0;}
.comments-box.foract .left {  }
.comments-box.foract .right { width:calc( 100% - 170px); }
.comments-box.foract .reader .msg{ width:100%; min-height:120px; font-size:15px; line-height:22px;}
.comments-box.foract .func .date { float:right; text-align:right;}
.comments-box.foract .member.blue { font-size:16px;}
.comments-box input[type="text"]{ width:96%; margin:0; padding:8px 2%;}
.comments-box textarea{ width:96%; margin:0; padding:8px 2%; border:1px solid #ccc; border-radius:5px;}
.comments-box fieldset { width:100%; margin:0; padding:0; min-width:100%; border:none;}
.comments-box.foract .comments-list.author {width:90%; margin-top:-10px; margin-bottom:30px;}
.comments-box.foract .comments-list.author .msg{ font-size:15px; line-height:22px;}


/*Infinite Scroll*/
#infscr-loading { text-align: center; color: #000;}
#infscr-loading img { display:none;}
#infscr-loading div { position:fixed; top:0; right:0; bottom:0; left:0; z-index: 100;}
#infscr-loading div span {
	display:block;
	width:100%;
	height:80px;
	line-height:80px;
	vertical-align: middle;}
#infscr-loading .loadMsg { display:block; bottom:100px;
	width:50%; left:25%;background: url(../images/load.gif) no-repeat center;}
#infscr-loading .doneMsg {display:block;
	top:45%;
	bottom:45%;
	width:50%; left:25%;
	height:80px;
	line-height:80px;
	background: none #3391da;
	color: #fff;
}

a#next:visited {}
a#next:hover {}
a#next:active {}

/* popupUI */
.popupUI { /*display:none;*/ visibility: hidden; opacity: 0; transition: visibility 0s, opacity 0.3s linear;
 	background-color:rgba(0,0,0,0.6); position:fixed; top:0; bottom:0; left:0; right:0; width:100%; z-index:9999;}
.popupUI:target{ /*display:block;*/ visibility: visible; opacity: 1;}
.popupUI .wrap-box {
	width:95%;
	max-width:480px;
	-webkit-box-shadow:0px 10px 10px rgba(0, 0, 0, 0.3);
	-moz-box-shadow:0px 10px 10px rgba(0, 0, 0, 0.3);
	box-shadow:0px 10px 10px rgba(0, 0, 0, 0.3);
	-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
	position:absolute; top:50%; left:50%;
	transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%);
	max-height: 90%; overflow: auto;
}
.popupUI .head {
padding:15px;
color:#fff;
font-size:15px;
font-weight:bold;
background:#8896dc;
text-align:center;
-webkit-border-radius:5px 5px 0 0; -moz-border-radius:5px 5px 0 0; border-radius:5px 5px 0 0;
}
.popupUI h3{ font-size:16px; margin:10px 0; color:#000;}
.popupUI .wrap-inner { padding:10px 20px; overflow:hidden; background:#fff; }
.popupUI .text { margin-bottom:10px;}
.popupUI .info { padding:5px 0; height:25px; }
.popupUI .info span {}
.popupUI .formlist { padding:0; }
.popupUI dl {clear:both; margin-bottom:15px;}
.popupUI dt { float:left;}
.popupUI dd { padding-left:60px;}
.popupUI .formlist label.disboc { margin:0 8px 8px 0; line-height:1.5;}
.popupUI .formlist label.disboc:last-child { margin-bottom:0px; }
.popupUI .formlist label.block{ display:block; margin:0px;}
.popupUI .formlist label.disboc+textarea{ box-sizing:border-box; width:100%;  border: 1px solid #CCC;}

.popupUI .toolbar { background-color:#f2f2f2; padding:10px; -webkit-border-radius:0 0 5px 5px; -moz-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px; }
.popupUI .toolbar .inner { text-align:right;}
.popupUI .toolbar .txt { line-height:normal; padding-bottom:10px; font-size:12px;}

.popupUI ul.tabs { background:#f2f2f2; padding:10px 0 0 10px; text-align:left; position:relative;height: inherit;}
.popupUI ul.tabs li.active a { background-color:#fff;}
.popupUI ul.tabs li a { font-weight:bold; }

.popupUI [class^=btn-]{ vertical-align:top;}


/*申請成為作家*/
.rule-box {font-size:15px; line-height: 1.5; padding:0 15px 10px 40px; height:300px; overflow:auto; background:#fff; box-sizing:border-box; margin-bottom:50px;}

.rule-box dt{ position:relative; margin: 20px 0 10px 0; color: #000; font-size: 18px; font-weight: bold;}
.rule-box dt:before{ content:'>'; display: block; position: absolute; font-size: 13px; font-weight: bold; line-height: 20px; width:20px; height: 20px; background-color:#ffd266 ; border-radius: 20px; color:#fff; left: -28px; top:3px; text-align: center;}

.rule-box ul{ margin-bottom:20px;}
.rule-box li{ margin-bottom:10px; word-wrap:break-word;}
.rule-box dd>ul>li{ margin-left: 16px; list-style: decimal outside;}
ul li.disc{list-style: disc; margin-left: 24px;}
ul li.circle{list-style: circle; margin-left: 24px;}
.rule-box ol li{ margin-left: 16px; list-style: decimal outside;}
.rule-box a{color:#419ef1;}
.rule-box table th, .rule-box table td {
    padding: 5px;
    border-bottom: 1px solid #DFE4EB;
}
.form{ display:block; padding:0 10px;}
.form dt{  float:left; width:160px; margin-bottom:15px; color:#989ca1;}
.form dd{ float:left; width:calc( 100% - 170px); margin-bottom:15px;}
.form select{ border-radius: 5px; background-color: #fff; border: 1px solid #CCC; height: 36px;  line-height: 36px;  box-sizing: border-box;  padding: 0 10px; margin:0 5px 10px 0;}
input[name=address]{width:300px;}
.form .func{ margin:20px 0 0 160px ;}
.form input + span {  display:none; font-size:13px; color:#fff; background:rgba(0,0,0,0.5); padding:5px; margin-left:15px; position:relative;}
.form input + span:before{ content:''; display:block; position:absolute; top:8px; left:-6px; border-right:6px solid rgba(0,0,0,0.5); border-top:5px solid transparent; border-bottom:5px solid transparent; }
.form input:focus + span { display:inline-block;}
.error{display: none;}			
.error_show{color:#f09;}

#simple_captcha .simple_captcha_field input.error{ display:block;}/*留言失敗時*/


/*寶物終止公告*/
.ts-bg { background:url(../images/ts-bg.jpg) no-repeat top center; width:100%; height:1970px;}
.ts-banner { position:fixed; width:772px; height:500px; top:50%; left:50%; transform: translate(-50%, -50%); z-index:999;}
.ts-banner .ts-pc { display:block;}
.ts-banner .ts-mobile { display:none;}
.ts-banner a { background:#ffe34e; color:#e95a4f; display:block; text-align:center; width:150px; margin:10px auto; font-size:20px; padding:15px 0; border-radius:10px;font-weight:bold;}
.ts-banner a:hover { background:#e95a4f; color:#ffe34e;}

/*中繼頁*/
.notice-box { width:720px; margin:30px auto;}
.notice-box .inner{ padding:30px 50px 10px 50px; line-height:22px;}
.notice-box b { display:block;}
.notice-box .func { padding:0 20px 20px 50px;}

/*錯誤頁*/
.wrap-ErrorPage{ text-align:center;}


/*18禁*/
.wrap-Rrated{ width:80%; max-width:400px; margin:50px auto; border:5px solid #d6deea; padding:20px 50px; box-sizing:border-box;}
.wrap-Rrated h3{ font-size:48px; color:#000; text-align:center; margin-bottom:40px; position:relative;}
.wrap-Rrated h3 span{ position:relative; display:inline-block; vertical-align:middle;}
.wrap-Rrated h3 span:before{ content:'18禁'; display:block; width:80px; height:80px; line-height:80px; font-size:28px; background:linear-gradient(#8d0102,#bf8383 49%,#8d0102 50%,#c60001 85%); color:#fff; margin-right:8px; border:1px solid #c60001;}
.wrap-Rrated h3 span:after{ content:''; display:block; position:absolute; bottom:-16px; left:0px; width:82px; height:15px; background:linear-gradient(rgba(198,0,1,0.3), rgba(198,0,1,0));}
.wrap-Rrated p{ font-size:1.1em;}
.R-no{ display:inline-block; box-sizing:border-box; width:45%; background-color:#cc0000; color:#fff; padding-bottom:5px; margin-right:2%;}
.R-yes{ display:inline-block; box-sizing:border-box; width:45%;background-color:#099; color:#fff; padding-bottom:5px;}
.R-no span{ display:block; font-size:12px; background:#cc0000; padding:5px 0; background-color:#da1515; margin-bottom:5px; color:#edc6c6;}
.R-yes span{ display:block; font-size:12px; background:#099; padding:5px 0;background-color:#12a8a8; margin-bottom:5px; color:#c2e5e5;}

/********** 輕之文庫 **********/
/*重點作者*/
.cates4-author { -webkit-box-shadow: 0 0 0 1px #e6e8ed inset; -moz-box-shadow: 0 0 0 1px #e6e8ed inset; box-shadow: 0 0 0 1px #e6e8ed inset; border-radius:3px; width:calc( 95% - 3px ); padding:10px 2.5%; overflow:hidden; border-left:3px solid #93c7f6;}
.cates4-author .imgs { display:inline-block; vertical-align:middle;}
.cates4-author .txt { display:inline-block; vertical-align:middle; width:calc(92% - 150px); margin-right:20px; padding:0; line-height:22px;}
.cates4-author .desc { color:#777; font-size:15px; margin:10px 0; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.cates4-author .desc{ position:relative; line-height:1.4em;  height:2.8em}
.cates4-author .desc::after { content:"...";}
.ausay { color:#333; padding:0 20px 20px 20px; line-height:22px; font-size:15px;}
.ausay i { color:#93c7f6; font-family:"Times New Roman", Times, serif; font-size:30px; display:inline-block; vertical-align:middle;}
/*對話雲*/
.dialogue-wrap { margin-bottom:20px;}
.dialogue{ text-align:center; padding:30px 10px; -webkit-box-shadow: 0 0 0 1px #abc0cf inset; -moz-box-shadow: 0 0 0 1px #abc0cf inset; box-shadow: 0 0 0 1px #abc0cf inset; border-radius:3px;}
.dialogue-wrap .cate-title { position:relative; text-align:center; margin:0 0 20px 0;}
.dialogue-wrap .cate-title span{ position:relative; top:35px; display:inline-block; background:#f2f5f9;}
.dialogue div { display:inline-block; vertical-align:middle; text-align:left; margin:10px 6px;}
.dialogue a { display:inline-block; position: relative; background: #7fbef7; border-radius:5px; padding:10px; color:#fff; font-size:15px;}
.dialogue a:after {
	content: ''; position: absolute; bottom: 0; right: 70%; width: 0; height: 0; border: 10px solid transparent;
	border-top-color: #7fbef7; border-bottom: 0; border-left: 0; margin-right: -5px; margin-bottom: -10px;}
.dialogue .recommed a:after {
	content: ''; position: absolute; bottom: 0; left: 70%; width: 0; height: 0; border: 10px solid transparent;
	border-top-color: #7fbef7; border-bottom: 0; border-right: 0; margin-left: -5px; margin-bottom: -10px;}
.dialogue .recommed  { width:50%;}	
.dialogue .recommed a { background:#ff8f22; font-size:18px; line-height:25px;}
.dialogue .recommed a:after { border-top-color: #ff8f22;}
.dialogue a:hover { opacity:0.7;}
.dialogue div:nth-child(1) { width:50%;}
.dialogue div:nth-child(2) { width:30%;}
.dialogue div:nth-child(3) { width:40%;}
.dialogue div:nth-child(4) { width:50%;}
.dialogue div:nth-child(5) { width:30%;}
.dialogue div:nth-child(6) { width:30%;}
/*.dialogue{ display: -ms-grid;display: grid;
	-ms-grid-columns: 1fr 1fr 1fr 1fr;
	grid-template-columns: repeat(4, 1fr);
	-ms-grid-rows: auto auto auto;  
	grid-template-rows: repeat(3, auto);
	counter-reset: divs;
	margin: 0;
	grid-gap: 5px;
	padding: 5px;
	min-height: 50px;
	box-sizing: border-box;
	}
.dialogue div:nth-child(1) { -ms-grid-column-span: 3; grid-column: span 3;}
.dialogue div:nth-child(2) { -ms-grid-row-span: 2; grid-row: span 2;}
.dialogue div:nth-child(3) { -ms-grid-row: 3; grid-row: 3;}
.dialogue div:nth-child(4) { -ms-grid-column-span: 3; -ms-grid-row-span: 1; grid-column: span 3; grid-row: span 2;}
.dialogue div:nth-child(5) { -ms-grid-column-span: 3; grid-column: span 3; }
.dialogue div:nth-child(6) { -ms-grid-row-span: 2; grid-row: span 2;}
.dialogue div { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.dialogue a { display:inline-block; position: relative; background: #7fbef7; border-radius:5px; padding:10px; margin:5px; color:#fff; font-size:15px;}
.dialogue a:after {
	content: ''; position: absolute; bottom: 0; left: 70%; width: 0; height: 0; border: 10px solid transparent;
	border-top-color: #7fbef7; border-bottom: 0; border-right: 0; margin-left: -5px; margin-bottom: -10px;}
.dialogue a.recommed { background:#ff8f22; font-size:18px; line-height:25px;}
.dialogue a.recommed:after { border-top-color: #ff8f22;}
.dialogue a:hover { opacity:0.7;}*/

/*熱門收藏*/
.hotbook.forcate4 { overflow:hidden;}
/*.hotbook.forcate4 .col7 .box { display:inline-block; width:calc( 50% - 30px); margin-bottom:5px;}
.hotbook.forcate4 .col7 .box:nth-child(even) { margin-left:5px;}*/
.hotbook.forcate4 .box .left{ width:100px;}
.hotbook.forcate4 .box .right{ width:calc( 100% - 100px );}
.hotbook.forcate4 .col3 { float:left; width:31.333333%; margin:0 1%;}
.hotbook.forcate4 .box .desc { height:auto; min-height:inherit; -webkit-line-clamp: 2;}
.hotbook.forcate4 .booklist { padding:11px 0;}
/*熱門作品列表的標籤*/
.tlist.forcate4 .cl { text-align:left !important; padding-top:1px;}
.tlist.forcate4 .cl span:before { content: '#'; color:#ccc;}
.tlist.forcate4 .cl span { display: inline-block; margin-right: 5px; font-size:13px; color:#666;}
.tlist.forcate4 .wd { padding-top:5px;}

/*---------- responsive ----------*/

@media screen and (min-width: 1050px) {
	.threecate .swiper-slide { width:200px;}
}

@media screen and (max-width: 1024px) {

	/*footer*/
	footer .foot a img { max-width:100%!important; height: auto!important; _width:expression(this.width > 100 ? "100%" : this.width)!important;}
	.ad-area .left,.ad-area .right { float:none; width:100%; margin:10px auto;}
	
	.wrap { width:100%;}
	.foot { width:96%; padding:0 2%;}
	.content { padding:40px 2%; width:96%;}
	.col7 { width:65%;}
	.col3 { width:33%;}

	/*category*/
	.category{ float:none; display:none;}
	/*banner*/
	.banner-bg { height:auto;}
	.banner-bg .wrap { height:auto;}
	.banner { float:none; margin:20px auto;}
	
	.threecate {padding-bottom:30px;}
	.threecate .swiper-pagination { display:block; bottom:0 !important;}
	
	#stickies { width:100%;left:0; margin:0;}
	 
	 img.user-m,img.user-L,.msg-content img { max-width:100%!important; height: auto!important; _width:expression(this.width > 100 ? "100%" : this.width)!important;}
	 
	 /*各館專題*/
	 .theme-book-wrap a { display:inline-block; margin-right:0; margin:0 6px 10px 6px;}
	 
	 /*排行榜*/
	.rank-wrap .rank-box { width:48%; margin:0 2% 30px 0;}
	.rank-wrap .rank-box:nth-child(even) { margin:0 0 30px 0;}

	/*回應*/
	.reader>.left,.comments-box.foract .left { width:80px;}
	.reader>.right,.comments-box.foract .right{ width:calc( 100% - 95px); line-height:20px;}
	.comments-box.foract .author { margin-top:0; margin-bottom:20px;}
	.comments-box.foract .author .msg{ line-height:20px;}

	/*找書看*/
	.table{ display:block; width: 100%;}
	.table .row{ display:block;border-bottom:1px solid #e6e8ed; padding: 5px 10px; border-left:3px solid #7f97ae; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s;}
	.table .row:hover{ border-left:10px solid #7f97ae;background:#f6f6f6;}
	.table .row>div{ display:block; width:100%; vertical-align: middle; padding: 5px; border-bottom: none; text-align: left;}
	.table .rhead{ display:none;}
	.table .rhead>div{ border-bottom: none;}
	.row>div>div,.row>div>a{ display:inline-block; vertical-align:middle; width:calc(100% - 90px);}
	.row>div:before,.row>a:before{ color:#999; display:inline-block; width:80px;}
	.table .t1:before{content:'類別';}
	.table .t2:before{content:'書名';}
	.table .t3{ display:none!important;}
	/*.table .t3:before{content:'最新章回';}*/
	.table .t4:before{content:'作者';}
	.table .t5:before{content:'更新時間';}
	.table .t6:before{content:'狀態';}
	.table .t7:before{content:'作品標籤';}
	.table .t8:before{content:'統計';}
	
	/*作家專區*/
	.author-hot .info .left{ width:85px; }
	.author-hot .info .right{ width:calc(100% - 90px);}
	
	/* #10055 新增首頁蓋版廣告 */
	.idx-ad { width:100%;}

}

@media screen and (max-width: 800px) {
	
	/*banner*/
	.banner { width:96%; height:auto; padding:0 2%;}
	#banner { width:100%; height:auto;}
	#banner img { max-width:100%!important; height: auto!important; _width:expression(this.width > 100 ? "100%" : this.width)!important;}
	
	.left.col7 { float:none; width:100%;}
	.right.col3 { float:none; width:100%;}
	
	/*---------- footer*/
	footer .foot { padding:30px 0 60px 0;}
	footer .foot a{ width:300px; float:none; overflow:hidden; clear:both; margin:0 auto 10px auto;}
	footer .foot .left { width:30%;}
	footer .foot .right { width:68%;}
	
	/*章回列表頁*/
	.chapter .share{ top:10px; right:10px;}

	/*短文用*/
	/*.list-bookUI.notelist .box{ height:200px; margin-bottom:10px;}*/
	
}

@media screen and (max-width: 768px) {
		
	.banner { margin-top:45px;}
	.banner-bg { padding-top:60px;}
	.content { padding:80px 4% 20px 4%; width:92%;}
	
	/*stickies*/
	#stickies { top:61px; font-size:13px;}
	#stickies .stickies_close_area { margin:0; padding:0 5px 4px 10px; float:right; font-size:12px; }

	/*作家專區*/
	.author-hot .abox { height:220px;}
	/*.author-hot .info .right{ width:50%;}
	.author-hot .cover-s { width:60px; height:85px;}*/
	.author-hot .photo{ top:-80px; height:180px;}
	.author-hot .photo .imgs img { width:120px; height:120px;}
	.author-pub .box .btns a{ padding:8px 8px;}
	
	/*活動訊息*/
	.edit-table .tag { width: 19%;}
	.edit-table .ptitle { width:49%;}
	.edit-table .ptime { width: 29%; }
	
	
	.comments-box{ padding:30px 0 0 0;}
	
	/*申請成為作家*/
	input[name=address]{width:100%;}
	.form input + span { margin-left:0px;}
	.form input + span:before{ display:none;}

	.form input:focus + span {  display:block; width:165px;}
	
	/* #10055 新增首頁蓋版廣告 */
	/*.idx-ad { position:relative; top:60px; left:0;}*/
	.idx-ad-pc1,.idx-ad-pc2{ }
	.idx-ad.idx-ad-m1 { width:320px; height:420px; position:fixed; top:50%; left:50%; margin-top:-210px; margin-left:-160px; z-index:999;}
	.idx-ad-m1 div{}
}

@media screen and (min-width:691px){
	.booksdetail h3{ width:calc(100% - 120px);}

	}

@media screen and (max-width: 690px) {
	
	.m_none{ display:none!important;}
		
	/*AD*/
	.w690 { display:none;}
	
	/*breadcrumbs*/
	.breadcrumbs{padding:10px 0 0 0;}

	/*書本頁*/
	.booksdetail{ padding:40px 10px 10px 10px;}
	.booksdetail .right{width:100%;}
	.booksdetail .left{ float:inherit;}
	.booksdetail .cover-b{ margin-bottom:10px;}
	.booksdetail .join-area .tip{ width:200px;}
	
	/*章回頁*/
	.clist .c1{ display:block; width:64%; line-height:24px;text-align:left;}
	.clist .c2{ display:block; width:64%; line-height:24px;}
	.clist .c3{ display:block; width:64%; line-height:24px; text-align:left;}
	.clist .c4{ width:30%; z-index:2; top:12px;}
	.c4:before{ /*height:73px;*/}
	[class^=bookmark]+.c1{width:calc(64% - 30px); padding-left:30px;}
	[class^=bookmark]+.c1+.c2{width:calc(64% - 30px); padding-left:30px;}
	[class^=bookmark]+.c1+.c2+.c3{width:calc(64% - 30px); padding-left:30px;}
	.bookmark_content{ width:200px;}
	
	/*章節購買頁*/
	.blist .b1{ display:block; float:left; width:8%; line-height:24px;}
	.blist .b2{ display:block; width:58%; line-height:24px;}
	.blist .b3{ display:block; width:58%; line-height:24px; text-align:left; clear:both; margin-left:8%;}
	.blist .b3 .date{ font-size:12px;}
	.blist .b4{ width:30%; z-index:2; top:12px;}
	
	/*其他作品*/
	.other_works .box{margin:0 5px 10px 0;}
	
	/*各館的標籤*/
	.fortabs div.title.break,.linktabs div.title.break { position:relative; height:80px; border-bottom:1px solid #e6e8ed; margin-bottom:10px;}
	.fortabs div.title.break h3.title,.linktabs div.title.break h3.title { position:absolute; left:0; top:0;}
	.break ul.tabs { position:absolute; right:0; top:auto; bottom:0; z-index:1; height: 40px; text-align:right; width:100%;}
	/*ul.tabs li { display:inline-block; height: 39px; line-height: 39px; position: relative;	margin-bottom: -1px; text-align:center;}*/

	/*各館的熱門選書*/
	.hottabs {}
	.hottabs .box,.hotbook.forcate4 .col7 .box { float:none; width:96%; margin:10px 0; padding:10px 2%;}
	.hottabs .box:nth-child(3) { width:96%; padding:10px 2%;}
	.hottabs ul.tabs { height:auto; margin-bottom:15px;}
	
	/*寶物終止公告*/
	.ts-banner { width:100%; height:500px; top:15%; left:0; transform:none; text-align:center;}
	.ts-banner .ts-pc{ display:none;}
	.ts-banner .ts-mobile{ display:block; margin:0 auto; max-width:100%!important; height: auto!important; _width:expression(this.width > 100 ? "100%" : this.width)!important;}
	
	/*中繼頁*/
	.notice-box { width:90%; margin:20px auto;}
	
	/* 輕之文庫 */
	.hotbook.forcate4 .col3 { float:none; width:100%;}
	.hotbook.forcate4 .col3 .box { margin-bottom:8px;}
}

@media screen and (max-device-width: 690px){
		label:last-child .transaction-total{ opacity:1; position:fixed; top:inherit; left:inherit; right:0; bottom:60px;}
	}

@media screen and (max-width: 600px) {
	
	/*排行榜*/
	.rank-wrap .rank-box { float:none; width:100%; margin:0 0 30px 0;}
	.rank-wrap .rank-box:nth-child(even) { margin:0 0 30px 0;}
	.rank-wrap .rbox .left{ width:20%;}
	.rank-wrap .rbox .right{ width:78%;}

}
@media screen and (max-width: 480px) {
	
	h3.title.mb { margin:40px 0 20px 0;}

	.box { padding:10px; }
	a.bname { font-size:15px; line-height:20px; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
	a.author { font-size:13px;}
	
	ul.tabs li a { padding: 0 10px; font-size:14px;}
	ul.tabs.title2 { margin-top:20px;}
	ul.tabs.small { width:100%;}
	ul.tabs.small li a { padding: 0 5px; font-size:13px;}
	.hotbook .box .desc { min-height:35px; -webkit-line-clamp:2;}
	
	.tags a { font-size:14px; padding:8px 10px; margin:0 8px 5px 0;}

	/*---------- trend*/
	.tlist { height:auto; padding:5px 8px; overflow:hidden; clear:both;}
	.tlist .cl { float:none; width:100%; text-align:left; padding-top:0;}
	.tlist .nc { float:left; width:72%; padding:0 2% 0 0; line-height:16px; font-size:13px;}
	.tlist .wd { float:right; width:25%; text-align:right;}
	.tlist .wd a { line-height:30px;}
	.tlist .nl{  width:100%; line-height:1.35;}
	.tlist .al{  width:100%; line-height:1.35;}
	.tlist .dl{  width:100%; text-align:left; line-height:1.35;}
	.tlist .bname { line-height:1.35;}
	.tlist .f-gray { font-size:12px;}
	
	/*----------po star*/
	.postar .title a { display:block;}
	.postar .left{ width:40%;}
	.postar .left img { max-width:100%!important; height: auto!important; _width:expression(this.width > 100 ? "100%" : this.width)!important;}
	.postar .right{ width:52%; padding:10px 4%;}
	.postar .desc { font-size:13px; line-height:18px; margin:5px 0;}
	.postar .arrow { display:none;}

	/*---------- essay*/
	.elist { height:auto; padding:10px 8px;}
	.elist .bn { width:60%; padding-right:1%;}
	.elist .au { width:39%;}
	.elist .bn a{ font-weight:bold; font-size:14px; line-height:20px;}
	
	/*---------- imgshow*/
	.imgshow .box{ width:calc(45% - 30px);}
	.imgshow .list-box { width:55%;}
	.imgshow .list { padding:8px;}
	.imgshow .list:first-child { padding:0 8px 8px 8px; border-top:none;}

	.imgshow .list .left { width:33%;}
	.imgshow .list .right { width:60%;}
	.imgshow .list .bookn { display:block; overflow:hidden; white-space: nowrap; text-overflow: ellipsis;}
	.imgshow .list .desc { display:none;}
	
	/*---------- footer*/
	.logo-area { position:relative; width:100%; height:130px; left:0; top:-30px; margin-left:0;}
	.logo-area .logo {  position:static; margin-left:0; margin:0 auto;}
	.social { position:static; width:100%; height:auto; margin:10px auto 0 auto; text-align:center;}
	.social a{ display:inline-block; float:none;}
	.foot-nav  { clear:both;}
	.foot-nav li { width:120px;}
	.foot-nav li a { display:block; padding:5px 0;}
	.foot-nav li:after { content:'';}
	
	#gotop{ width:30px; height:30px; bottom:10px; right:10px; -webkit-border-radius:15px;-moz-border-radius:15px; border-radius:15px;background:url(../images/icon-gotop-h.png) no-repeat center #fff; background-size:20px 20px; z-index:9996;}
	
	/*各館*/
	.cate-toptitle { margin-top:20px; padding:10px 0 10px 0;}
	.cate-toptitle .breadcrumbs{ display:none;}
	
	/*---------- table*/
	.table-rwd {min-width: 100%;}
	.table-rwd tr { display:block; padding:10px 0;}
	.table-rwd tr.title {display:none;}
	.table-rwd tr:hover { background:none;}
	.table-rwd td { display:block;}
	.table-rwd td:before { content: attr(data-th) "： "; font-weight: bold; display: inline-block; font-size:14px; line-height:18px; margin-right:5px; color: #000; font-weight: bold;}
	.table-rwd td.m_hide { display:none;}
	.table-rwd td {text-align: left; margin:3px 10px; padding:0.3em;}
	.table-rwd a { display:inline-block !important; vertical-align:middle;}
	.table-rwd .t-center { text-align:left !important;}
	
	.list-bookUI .box .desc { margin-top: 10px; min-height:1px;}
	.list-bookUI .box .left{ width:28%;}
	.list-bookUI .box .right{ width:62%; padding: 8px 2% 20px 2%;}
	.list-bookUI .detail { font-size:14px; }
	
	.join-area .tip { width:250px;}
	
	/*活動訊息*/
	.edit-table .tag { width: 24%;}
	.edit-table .ptitle { width:74%; font-size:15px; font-weight:bold; line-height:20px; padding:0;}
	.edit-table .ptime { display:block; width:100%; text-align:right; }

	/*書本頁*/
	.book_data{ width:49%; }
	.BTN-box [class^=BTN_]{width:47%;}
	.BTN-box a{margin:0 3% 10px 0;}
	.BTN-box a:nth-child(2n){margin:0 0 10px 0;}
	
	/*章節購買頁*/
	.blist .b2_1{ font-size:12px; padding-left: 12px;}
	.blist .b1_1{text-align:center;}
	.blist .cancel{ width:45%;}
	.blist .submit{ width:45%;}
	
	/*comment*/
	.comment.right{ clear: both;float: inherit; width:100%;}
	
	/*排行榜*/
	.rank-wrap .rbox .left{ width:25%;}
	.rank-wrap .rbox .right{ width:73%;}
	.rank-box.m_hide { display:none;}
	.rank-menu .rank-btn:hover { background:#e4eaf2; color:#555;}
	.rank-menu .rank-btn.ac { background:#FFF; color:#31a5df; }
	
	/*找書看*/
	.findbook{ padding:15px;}
	.find-item .label {text-align: left; width:65px;}
	.find-item .fortabs{width:calc(100% - 75px);}
	.find-item .forradio{ width:calc(100% - 75px); }
	
	/*作家專區*/
	.author-hot-wrap { margin:0 30px;}
	.author-hot-wrap .swiper-button-next { right:-30px; background-size:19px 50px;}
	.author-hot-wrap .swiper-button-prev { left:-30px; background-size:19px 50px;}
	.author-hot .abox { float:none; width:100%; margin-bottom: 120px;}
	.author-hot .abox:nth-child(2) { margin: 0; margin-bottom: 120px;}
	.author-hot .abox:last-child { margin-bottom: 0; }
	/*.author-hot .info .right{ width:60%;}*/
	.author-hot .cover-s{ width:75px; height:106px; }
	.author-choice .abox { width:140px; margin:0 5px 15px 5px; height: 250px;}
	.author-choice img.user-m { width:120px; height:120px;} 
	
	/*18禁*/
	.wrap-Rrated{padding:20px;}
	.wrap-Rrated h3{ font-size:42px; line-height: 1.8;}
	.wrap-Rrated h3 span{ display:block;}
	.wrap-Rrated h3 span:before{ width:60px; height:60px; line-height:60px; font-size:24px; margin:0 auto;}
	.wrap-Rrated h3 span:after{ bottom:-17px; width:62px; height:15px; left: 50%; margin-left: -31px;}
	
	/*----------輕之文庫*/
	/*對話雲*/
	.dialogue div { text-align:center;}
	.dialogue div:nth-child(1),	.dialogue div:nth-child(2),.dialogue div:nth-child(3),.dialogue div:nth-child(4),.dialogue div:nth-child(5),.dialogue div:nth-child(6) { width:90%;}
	/*列表*/
	.tlist.forcate4 .cl { display:none;}
}

@media screen and (min-width: 480px) {
	.tags-select + span:hover{ background:#ffeec8;}
}

@media screen and (max-width: 320px) {
	
	/*書本頁*/
	.msg-onsale{ text-align:center;}
	.msg-onsale .percent{ margin:0; width:100%;}
	.msg-onsale .date{ width:100%;}
	
	/*排行榜*/
	.rank-wrap .rbox .left{ width:30%;}
	.rank-wrap .rbox .right{ width:68%;}
	
}

