@charset "utf-8";

/*========================================================================
*
*    [file]      global.css
*    [version]   1.0
*    [copyright] ASCII MEDIA WORKS
*    [structure] 01. RESET       リセット
*                02. HEADER      グローバルヘッダー
*                03. FOOTER      グローバルフッター
*                04. UTILITY     汎用CSS
*
*    [notes]     サイト共通のグローバルヘッダー
*                後の組込みを配慮する為個別にリセットを当てる
*
*========================================================================*/

/*-----------------------------------------------------------------------
01. RESET
-----------------------------------------------------------------------*/
#g-header p, #g-footer-primary p, #g-footer-secondary p,
#g-header dl, #g-footer-primary dl, #g-footer-secondary dl,
#g-header dt, #g-footer-primary dt, #g-footer-secondary dt,
#g-header dd, #g-footer-primary dd, #g-footer-secondary dd,
#g-header ul, #g-footer-social ul, #g-footer-primary ul, #g-footer-secondary ul,
#g-header ol, #g-footer-primary ol, #g-footer-secondary ol,
#g-header li, #g-footer-social li, #g-footer-primary li, #g-footer-secondary li,
#g-header div, #g-footer-primary div, #g-footer-secondary div,
#g-header a, #g-footer-social a, #g-footer-primary a, #g-footer-secondary a,
#g-header img, #g-footer-social img, #g-footer-primary img, #g-footer-secondary img,
#g-header form, #g-footer-primary form, #g-footer-secondary form {
font-size: 12px;
line-height: 1;
font-family:'Hiragino Kaku Gothic ProN', Meiryo,'ＭＳ Ｐゴシック', sans-serif;
margin:0;
padding:0;
border: 0;
}
#g-header ul, #g-footer-social ul, #g-footer-primary ul, #g-footer-secondary ul,
#g-header ol, #g-footer-primary ol, #g-footer-secondary ol {
list-style-type:none;
list-style-position:outside;
}

#g-header a:link, #g-footer-primary a:link, #g-footer-secondary a:link {
text-decoration: none;
color: #ffffff;
}

#g-header a:hover, #g-footer-primary a:hover, #g-footer-secondary a:hover {
text-decoration: underline;
}

#g-header .container,
#g-footer-primary .container,
#g-footer-secondary .container {
width: 1000px;
margin: auto;
position: relative;
}

/*-----------------------------------------------------------------------
02. HEADER
-----------------------------------------------------------------------*/
#g-header {
background: #4c4948;
height: 25px;
}

#g-header .container #site-logo,
#g-header .container .tag-line,
#g-header .container #g-nav,
#g-header .container #g-nav li {
float: left;
}

#g-header .container #g-nav,
#g-header .container #g-nav a {
height: 25px;
}

#g-header .container #site-logo {
padding: 3px 0 0;
}

#g-header .container #g-nav {
margin: 0 0 0 20px;
}

#g-header .container #g-nav a {
background: url(../img/header/g-nav.png) no-repeat left top;
}

#g-header .container .tag-line {
color: #ffffff;
font-size: 8px;
margin: 0 0 0 8px;
padding: 10px 0 0;
}

/* css sprite */
#g-header .container #g-nav .nav-novel {
background-position: 0 0;
width: 59px;
}

#g-header .container #g-nav .nav-bunko {
background-position: -59px 0;
width: 59px;
}

#g-header .container #g-nav .nav-award {
background-position: -118px 0;
width: 108px;
}

#g-header .container #g-nav .nav-comic {
background-position: -226px 0;
width: 74px;
}

#g-header .container #g-nav .nav-novel:hover {
background-position: 0 -25px;
}

#g-header .container #g-nav .nav-bunko:hover {
background-position: -59px -25px;
}

#g-header .container #g-nav .nav-award:hover {
background-position: -118px -25px;
}

#g-header .container #g-nav .nav-comic:hover {
background-position: -226px -25px;
}


#g-header .container .utility-nav {
position: absolute;
top: 5px;
right: -15px;
width: 190px;
}

#g-header .container .utility-nav li {
font-size: 10px;
float: left;
margin: 0 10px 0 0;
padding: 1px 0 0 0;
}

#g-header .container .utility-nav li a {
font-size: 10px;
color: #ffffff;
padding: 0 0 0 13px;
line-height: 16px;
/*20131022*/
margin: -4px 0 0 0;
/*20131022*/
}

#g-header .container .utility-nav .ico-member {
background: url(../img/header/ico-member.gif) no-repeat left top;
}

#g-header .container .utility-nav .ico-help {
background: url(../img/header/ico-help.gif) no-repeat left top;
}

#g-header .container .utility-nav .ico-login {
background: url(../img/header/ico-login.gif) no-repeat left top;
}

/*-----------------------------------------------------------------------
03. FOOTER 【GLOBAL】
-----------------------------------------------------------------------*/
#g-footer-social{
background: #ffffff;
padding: 5px 0;
height: 20px;
text-align: right;
}
#g-footer-social .container{
width: 1000px;
margin: 0 auto;
}
#g-footer-social ul{
width: 365px;
float:right;
}
#g-footer-social li{
float:left;
/*20131022*/
line-height: 0;
/*20131022*/
}
#g-footer-social .twitter{
width: 75px;
}
#g-footer-social .facebook{
width: 110px;
overflow: hidden; /* バグの為追加 2014.02.20 */
}
#g-footer-social .googleplus{
width: 75px;
}

#g-footer-social .mixi{
width: 60px;
}
#g-footer-social .line{
width: 20px;
text-align:right;
}

#g-footer-primary,
#g-footer-secondary,
#g-footer-primary a,
#g-footer-secondary a {
color: #ffffff;
}

#g-footer-primary a,
#g-footer-secondary a {
font-size: 11px;
}

#g-footer-primary .container,
#g-footer-secondary .container {
overflow: hidden;
}

#g-footer-primary {
background: #595757;
padding: 10px 0;
text-align: left;　　/*20131010AMW_ishida*/
}

#g-footer-primary .container .col:first-child {
border-left: none;
margin-left: -12px;
}

#g-footer-primary .container .col {
border-left: 1px solid #FFF;
width: 176px;
float: left;
margin: 0 0 -100px 0;
padding: 0 10px 100px 15px;
}

#g-footer-primary .container h4 {
line-height: 1.4;
margin: 0 0 10px;
}

#g-footer-primary .container h4 a{
font-size: 12px;
font-weight: bold;
}

#g-footer-primary .container h4 span {
font-size: 9px;
/*20131022*/
margin: 0 0 2px 0;
/*20131022*/
font-weight: normal;
color: #dcdddd;
display: block;
}

#g-footer-primary .container .col ul {
margin: 0;
}

#g-footer-primary .container .col ul.last {
margin: 0;
}

#g-footer-primary .container .col li {
margin: 0 0 5px;
color:#999999;
font-weight:bold;
}
#g-footer-primary .container .col li span{
color:#ffffff;
}
#g-footer-primary .container .col li a{
font-weight:normal;
}
#g-footer-primary .container .col li ul{
margin: 5px 0 5px 0;
}
#g-footer-primary .container .col li li{
background: none;
margin: 0 0 5px;
padding: 0 0 0 5px;
}

#g-footer-primary.small {
}

#g-footer-primary .container .novel h4{
background: url(../img/footer-primary/novel.png) no-repeat left center;
padding: 0 0 0px 26px;
}
#g-footer-primary .container .bunko h4{
background: url(../img/footer-primary/bunko.png) no-repeat left center;
padding: 0 0 0px 26px;
}
#g-footer-primary .container .award h4{
background: url(../img/footer-primary/award.png) no-repeat left center;
padding: 0 0 0px 26px;
}
#g-footer-primary .container .comic h4{
background: url(../img/footer-primary/comic.png) no-repeat left center;
padding: 0 0 0px 26px;
}

#g-footer-secondary {
background: #4C4948;
padding: 8px 0 8px 0;
}

/*20131022*/
+html #g-footer-secondary {
padding: 6px 0 4px 0;
}
/*20131022*/

#g-footer-secondary .container .foot-nav {
width: 600px;
margin: 0 0 0 -16px;
float: left;
}

#g-footer-secondary .container .foot-nav li {
border-left: 1px solid #FFF;
float: left;
margin: 0 0 0 8px;
padding: 1px 0 1px 8px;
line-height: 12px;
}
/*20131022
+html #g-footer-secondary .container .foot-nav li {
line-height: 1.2;
}
/*20131022*/

#g-footer-secondary .container #copy {
font-size: 10px;
float: right;
padding: 2px 0 0 0;
}

/*-----------------------------------------------------------------------
04. UTILITY
-----------------------------------------------------------------------*/
.cf:before, .cf:after { 
content: "";
display: table;
}

.cf:after { clear: both; }
.cf { zoom: 1; }

.css-sprite {
display: block;
text-indent: -9999px;
}

/*-----------------------------------------------------------------------
blogRanking
-----------------------------------------------------------------------*/
.blogRanking {}
.blogRanking .title01 {
	background-color: #fff;
	border-bottom: 1px #d9d9d9 solid;
}
.blogRanking .title01 p {
	width: 154px;
	padding: 11px 0 4px;
	margin: 0 auto;
}
.blogRanking .rankList {
	margin-bottom: 11px;
}
.blogRanking .rankList .rankSet {
	background-color: #fff;
	border-bottom: 1px #d9d9d9 solid;
	overflow: hidden;
	padding: 11px 5px 5px 8px;
}
.blogRanking .rankList .rankSet .setL {
	float: left;
	overflow: hidden;
	width: 212px;
}
.blogRanking .rankList .rankSet .setL img.icon {
	float: left;
	width: 41px;
}
.blogRanking .rankList .rankSet .setL .text {
	float: right;
	width: 166px;
}
.blogRanking .rankList .rankSet .setL .text p.blogTitle {
	line-height: 18px;
}
.blogRanking .rankList .rankSet .setL .text p.blogTitle a {
	color: #ffa9c6;
	font-weight: bold;
}
.blogRanking .rankList .rankSet .setL .text p.name a {
	color: #333333;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
}
.blogRanking .rankList .rankSet .setL .text .btnArea {
	overflow: hidden;
	float: right;
	width: 86px;
}
.blogRanking .rankList .rankSet .setL .text .btnArea p.num{
	background: url(../../htmltext/img/num_bg.gif) no-repeat left center;
	float: left;
	font-size: 8px;
	text-align: center;
	width: 40px;
	height: 16px;
	line-height:17px;
	padding-right: 6px;
	margin-right: 2px;
}

.blogRanking .rankList .rankSet .setL .text .btnArea p.btn{
	float: right;
	height: 14px;
}
.blogRanking .rankList .rankSet .setL .text .btnArea p.btn a {
	display: block;
}
.blogRanking .rankList .rankSet img.photo {
	float: right;
	width: 60px;
}
.blogRanking .rankList p.more {
	text-align: right;
	padding-right: 9px;
	margin-top: 6px;
}
.blogRanking .rankList p.more a {
	background: url(../../htmltext/img/more_arrow.png) no-repeat right center;
	color: #333333;
	font-size: 12px;
	text-decoration: none;
	padding-right: 26px;
}
.blogRanking .pickup {}
.blogRanking .pickup .title02{
	border-left: 5px #e51372 solid;
	font-size: 12px;
	font-weight: bold;
	line-height: 14px;
	padding-left: 3px;
	margin: 0 0 3px 15px;
}
.blogRanking .pickup .pickupSet {
	background-color: #fde9ed;
	border-bottom: 1px #fff solid;
	overflow: hidden;
	padding: 5px 5px 5px 15px;
}
.blogRanking .pickup .pickupSet p {
	float: left;
	line-height: 18px;
	width: 200px;
	padding-top: 3px;
}
.blogRanking .pickup .pickupSet p a {
	color: #333333;
	font-size: 12px;
}
.blogRanking .pickup .pickupSet img {
	float: right;
	width: 50px;
}

/*-----------------------------------------------------------------------
blogRanking -> common
-----------------------------------------------------------------------*/
.cn.blogRanking {
margin: 0px 0px 30px 0px;
padding: 0;
width: 300px;
}
.cn.blogRanking h3{
margin: 0px 0px 0px 0px;
padding: 0;
}
.cn.blogRanking ol{
margin: 0;
padding: 25px 20px 25px 20px;
background: #fff;
}
.cn.blogRanking ol > li{
margin:  0px 0px 10px 0px;
padding: 0px 0px 10px 0px;
border-bottom: 1px solid #eeeeee;
}
.cn.blogRanking ol > li:last-child{
margin:  0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
border-bottom: none;
}
.cn.blogRanking ol li dl dt{
width: 100px;
height: 100px;
float:left;
}
.cn.blogRanking ol li dl dt p{
width: 100%;
height: 100%;
background-repeat:no-repeat;
background-size: cover;
}

#userRanking.cn.blogRanking ol li dl dt p{
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
}
.cn.blogRanking ol li dl dd{
width: 140px;
float:right;
}
.cn.blogRanking ol li dl dd .no{
margin: 0px 0px 4px 0px;
}
.cn.blogRanking ol li dl dd h4{
margin: 0px 0px 4px 0px;
font-size: 12px;
font-weight:bold;
line-height: 1.4;
}
.cn.blogRanking ol li dl dd p.summary{
margin: 0px 0px 0px 0px;
font-size: 12px;
font-weight:normal;
line-height: 1.4;
}
.cn.blogRanking .more{
font-size: 12px;
text-align:right;
margin: 10px 0px 10px 0px;
}
/*-----------------------------------------------------------------------
blogRanking -> article
-----------------------------------------------------------------------*/
#articleRanking.cn.blogRanking {
margin: 30px 0px 30px 0px;
padding: 0;
width: 300px;
}
#articleRanking.cn.blogRanking ol li dl dd p.summary{
margin: 0px 0px 0px 0px;
font-size: 12px;
font-weight:normal;
line-height: 1.4;
}
#articleRanking.cn.blogRanking .more{
font-size: 12px;
text-align:right;
margin: 4px 0px 0px 0px;
}
/*-----------------------------------------------------------------------
blogRanking -> user
-----------------------------------------------------------------------*/
#userRanking.cn.blogRanking ol li dl dd p.summary{
margin: 0px 0px 0px 0px;
font-size: 12px;
font-weight:normal;
line-height: 1.4;
}
#userRanking.cn.blogRanking .more{
font-size: 12px;
text-align:right;
margin: 4px 0px 0px 0px;
}
#userRanking.cn.blogRanking ol li dl dt img{
width: 100%;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
}