@charset "UTF-8";

/*----------------------------------------------------------------------

ClearFix Style

----------------------------------------------------------------------*/
#matome-header:after, .matome-article a:after, .matome-article .info:after {
    content: "";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}


/*----------------------------------------------------------------------

Header Style

----------------------------------------------------------------------*/
#header { margin: 0 0 20px;}


/*----------------------------------------------------------------------

Contents Style

----------------------------------------------------------------------*/
#main {
	width: 680px;
	margin-bottom: 50px;
	float: left;
}

#post { background: #fff;}

#contents { padding: 0;}


.fit-sidebar-fixed{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    position: fixed;
}
.fit-sidebar-blank{
    z-index: 0;
    background-color: transparent;
    visibility: hidden;
}


/*----------------
front-nav
-------------------*/
#front-nav {
    list-style: none;
    border-left: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
    margin: 0 5px 20px;
    overflow: hidden;
}
#front-nav.video {
    padding: 0 !important;
}

#front-nav li {
    width: 25%;
    height: 40px;
	background: #fff;
    float: left;
    box-sizing: border-box;
    border-right: solid 1px #ddd;
    border-top: solid 1px #ddd;
}
#front-nav li a {
    display: block;
    font-size: 13px;
    line-height: 40px;
    text-align: center;
    background: #fff;
}
#front-nav li a.active {
    font-weight: bold;
    background: #e60012;
    color: #fff;
}

#front-nav.news li a.active      { background: #FF8777; }
#front-nav.interview li a.active { background: #FFBF27; }
#front-nav.report li a.active    { background: #7ED304; }
#front-nav.video li a.active     { background: #49BBBF; }
#front-nav.special li a.active   { background: #7983C2; }
#front-nav.benefits li a.active  { background: #ED915F; }
#front-nav.goods li a.active     { background: #B379C2; }


/*----------------------------------------------------------------------

Slider Style

----------------------------------------------------------------------*/
#slider { box-sizing: border-box; margin: 0 0 20px; padding: 0 10px;}
#slider a { display: block; position: relative;}
#slider a:before {
    border: solid 5px #fff;
    content: "";
    display: block;
    position: absolute;
    top:0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 99999;
    opacity: 0;
    filter: alpha(opacity=0);
    -ms-filter: "alpha(opacity=0)";
    zoom:1;
    -webkit-transition: all .2s cubic-bezier(.55,0,.1,1);
    transition: all .2s cubic-bezier(.55,0,.1,1);
}
#slider a:hover:before {
    opacity: .5;
    filter: alpha(opacity=50);
    -ms-filter: "alpha(opacity=50)";
}
#slider .sp-arrows { margin-top: -35px;}
#slider .sp-next-arrow, #slider .sp-previous-arrow {
    opacity: .2;
    filter: alpha(opacity=20);
    -ms-filter: "alpha(opacity=20)";
    zoom: 1;
    width: 30px;
    height: 30px;
    padding: 20px;
}
#slider .sp-next-arrow { right: 0;}
#slider .sp-previous-arrow { left: 0;}
#slider .sp-next-arrow:before, #slider .sp-previous-arrow:before,
#slider .sp-next-arrow:after, #slider .sp-previous-arrow:after {
    top: 20px;
    left: 0;
    right: 0;
    width: 30px;
    height: 30px;
    -webkit-transform: skew( 0deg, 0deg);
    -ms-transform: skew( 0deg, 0deg);
    transform: skew( 0deg, 0deg);
    margin: 0 auto;
}
#slider .sp-next-arrow:before, #slider .sp-previous-arrow:before {
    background-color: #000;
    border-radius: 50%;
}
#slider .sp-next-arrow:after, #slider .sp-previous-arrow:after {
    background-color: transparent;
    color: #fff;
    font-family: iconfont;
    font-size: 30px;
}
#slider .sp-next-arrow:after { content: '\e60c';}
#slider .sp-previous-arrow:after { content: '\e607';}


/*----------------------------------------------------------------------

#post-content post info Style

----------------------------------------------------------------------*/
#post-info {
	overflow: hidden;
}
#post-info p {
	float :left;
}
#post-info .here {
	font-size: 10px;
	color: #fff;
	background: #e60012;
	padding: 3px 5px;
	margin-left: 5px;
	position: static;
	border: none;
	float:left;
	border-radius: 0;
}
#post-info .here:before {
	display: none;
}
#post-info .cat {
	font-size: 10px;
	border: solid 1px #ccc;
	padding: 2px 5px;
	float:left;
}
#post-info .cat.news      { border: solid 1px #FF8777; color: #FF8777; }
#post-info .cat.interview { border: solid 1px #FFBF27; color: #FFBF27; }
#post-info .cat.report    { border: solid 1px #7ED304; color: #7ED304; }
#post-info .cat.video     { border: solid 1px #49BBBF; color: #49BBBF; }
#post-info .cat.special   { border: solid 1px #7983C2; color: #7983C2; }
#post-info .cat.benefits  { border: solid 1px #ED915F; color: #ED915F; }
#post-info .cat.goods     { border: solid 1px #B379C2; color: #B379C2; }

#post-info .time {
	font-size: 10px;
    float: right;
	color: #999;
}


/*----------------------------------------------------------------------

Card Style

----------------------------------------------------------------------*/
#card-list-wrap .card-list-inner {
    display:none;
}
#card-list-wrap .card-list-inner.active {
    display: block;
}
#card-list-wrap .card-list {
	width: auto!important;
}

.card { padding: 0 5px; }

.card .article-contents { padding:0; }
.card .img {
	height: auto;
    clear: both;
    overflow: hidden;
    position: relative;
	margin: 0;
	text-align:center;
}
.card .img img {
	max-width: 100%;
    width: auto;
    height: auto;
}
.card .post-info {
	padding: 10px;
}
.card .post-info .p-header {
	overflow: hidden;
	margin-bottom:5px;
}
.card .post-info .p-header .here {
	font-size: 10px;
	color: #fff;
	background: #e60012;
/*	padding: 3px 5px; */
width: 50px;
	margin-right: 5px;
	position: static;
	border: none;
	float:left;
	border-radius: 0;
}
.card .post-info .p-header .cat {
	font-size: 10px;
	padding: 2px 5px;
	border: solid 1px #ccc;
	float:left;
}
.card .post-info .p-header .cat.news      { border: solid 1px #FF8777; color: #FF8777; }
.card .post-info .p-header .cat.interview { border: solid 1px #FFBF27; color: #FFBF27; }
.card .post-info .p-header .cat.report    { border: solid 1px #7ED304; color: #7ED304; }
.card .post-info .p-header .cat.video     { border: solid 1px #49BBBF; color: #49BBBF; }
.card .post-info .p-header .cat.special   { border: solid 1px #7983C2; color: #7983C2; }
.card .post-info .p-header .cat.benefits  { border: solid 1px #ED915F; color: #ED915F; }
.card .post-info .p-header .cat.goods     { border: solid 1px #B379C2; color: #B379C2; }

.card .post-info .p-header .time {
	font-size: 10px;
    float: right;
	color: #999;
}

/*----------------------------------------------------------------------
Media Query
----------------------------------------------------------------------*/
@media screen and (max-width: 768px){
    .card .post-info .p-header .time {
       display: block;
       float: none;
       clear: both;
       padding-top: 5px;
    }
}




.card .post-info .p-body h2 {
	font-size: 14px;
	font-weight: normal;
	margin:0;
}

/* card border */
#frontPage-news .article      { background-color: #FF8777; }
#frontPage-interview .article { background-color: #FFBF27; }
#frontPage-report .article    { background-color: #7ED304; }
#frontPage-video .article     { background-color: #49BBBF; }
#frontPage-special .article   { background-color: #7983C2; }
#frontPage-benefits .article  { background-color: #ED915F; }
#frontPage-goods .article     { background-color: #B379C2; }

#frontPage-news .article a      { border: solid 1px #FF8777; border-top: solid 2px #FF8777; }
#frontPage-interview .article a { border: solid 1px #FFBF27; border-top: solid 2px #FFBF27; }
#frontPage-report .article a    { border: solid 1px #7ED304; border-top: solid 2px #7ED304; }
#frontPage-video .article a     { border: solid 1px #49BBBF; border-top: solid 2px #49BBBF; }
#frontPage-special .article a   { border: solid 1px #7983C2; border-top: solid 2px #7983C2; }
#frontPage-benefits .article a  { border: solid 1px #ED915F; border-top: solid 2px #ED915F; }
#frontPage-goods .article a     { border: solid 1px #B379C2; border-top: solid 2px #B379C2; }


/*----------------------------------------------------------------------

sitelist Style

----------------------------------------------------------------------*/
.sitelist .sitelist-h2 {
	font-size: 20px;
	text-align:center;
	line-height: 60px;
	border-top: solid 1px #000;
	background: #fff;
}
.sitelist .sitelist-h3 {
    font-size: 16px;
	font-weight: normal;
	text-align:center;
	padding: 20px 0;
	line-height: 1;
}
.sitelist #s-c-recommend {
    overflow: hidden;	
	border-bottom: solid 1px #ddd;
}
#s-c-recommend .recommend-article {
	width: 48.5%;
	background: #fff;
	box-sizing: border-box;
	overflow: hidden;
	margin-bottom: 10px;
}
#s-c-recommend .recommend-article:nth-child(odd) {
	float: left;
	clear:both;
}
#s-c-recommend .recommend-article:nth-child(even) {
	float: right;
}
#s-c-recommend .recommend-article:last-child {
	margib-bottom: 20px;
}
#s-c-recommend .recommend-article table {
    width: 100%;
	border-collapse: collapse;
}
	
#s-c-recommend .recommend-article table th {
    width: 34%;
	box-sizing:border-box;
	padding: 15px;
}
#s-c-recommend .recommend-article table th img {
	width: 100%;
	max-width: 80px;
}
#s-c-recommend .recommend-article table td {
	width: 66%;
	box-sizing:border-box;
	padding: 0 10px 0 0;
	vertical-align: middle;
}
#s-c-recommend .recommend-article table td h2 {
	font-size: 14px;
	font-weight: normal;
	line-height:1.5;
}
#s-c-recommend .recommend-article table td p {
	font-size: 12px;
}

#s-c-product {
	overflow: hidden;
}
#s-c-product a {
	width: 100%;
    max-width: 320px;
	line-height: 40px;
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
    text-align: center;
    display: block;
}
#s-c-product .p-btn-anime {
    background-color: #5dacef;
	float: left;
}
#s-c-product .p-btn-movie {
    background-color: #9bcd3b;
	float: right;
}



/*----------------------------------------------------------------------

Ad Style

----------------------------------------------------------------------*/
#ad { margin: 0 10px 20px;}




/*----------------------------------------------------------------------

Tag Cloud Style

----------------------------------------------------------------------*/
#tag-cloud {
    background-image: url('../images/g-bg.gif');
    border: solid 1px #dedede;
    margin: 0 10px 20px;
    padding: 10px 5px 5px;
}
#tag-cloud h2 { font-size: 18px; text-align: center;}
#tag-cloud h2:after {
    border-bottom: solid 1px #333;
    content: "";
    display: block;
    width: 65px;
    margin: 5px auto 10px;
}
#tags { background-color: #fff; padding: 10px;}
#tags a { line-height: 1.4;}





/*----------------------------------------------------------------------

Special Style

----------------------------------------------------------------------*/
#side-special .cmn-ttl {
	 color: #fff;
	 background: #e60012;
	 margin-bottom: 20px;
}
#side-special ul li {
	margin-bottom: 10px;
	list-style: none;
}
#side-special ul li:last-child {
	margin-bottom: 20px;
}
#side-special ul li a {
    display:block;
}
#side-special ul li img {
    width: 100%;
}


/*----------------------------------------------------------------------

Video Style

----------------------------------------------------------------------*/
#side-video .thumb {
    margin-bottom:10px;
}
#side-video .time {
    display: block;
    font-size: 10px;
    color: #999999;
    margin-bottom: 5px;
}
#side-video h2 {
    font-size: 14px;
    font-weight: normal;
    margin-bottom: 10px;
}


/*----------------------------------------------------------------------

Schedule Style

----------------------------------------------------------------------*/
#side-schedule .cmn-ttl {
	margin-bottom: 0;
}
#side-schedule .cmn-ttl .subttl {
   font-size: 11px;
    background: #fff;
    margin-left: 10px;
    padding: 7px;
    vertical-align: middle;
}
#side-schedule .schedule-box {
	padding-top: 20px;
	border-bottom: solid 1px #ddd;
}
#side-schedule .schedule-box:last-child {
	border-bottom: none;
}
#side-schedule ul li {
	list-style: none;
	margin-bottom: 15px;
}
#side-schedule ul li table {
    width: 100%;
}
#side-schedule ul li table th {
    width: 90px;
}
#side-schedule ul li table th img {
    width: 100%;
}
#side-schedule ul li table td {
    padding: 2px 0 0 15px;
	vertical-align: top;
}
#side-schedule ul li table td .onair-type {
	font-size: 10px;
	margin-bottom:5px;
}
#side-schedule ul li table td .onair-type.onair_anime { color: #5dacef; }
#side-schedule ul li table td .onair-type.onair_movie { color: #9bcd3b; }

#side-schedule ul li table td .onair-type span {
	font-size: 10px;
	margin-right: 5px;
	padding: 0 3px;
	vertical-align:middle;
}
#side-schedule ul li table td .onair-type.onair_anime span { color: #5dacef; border: solid 1px #5dacef; }
#side-schedule ul li table td .onair-type.onair_movie span { color: #9bcd3b; border: solid 1px #9bcd3b; }

#side-schedule ul li table td .onair-ttl {
	font-size: 14px;
	font-weight: normal;
	margin-bottom:10px;
}
#side-schedule ul li table td .onair-subttl {
	font-size: 12px;
	font-weight:bold;
}
#side-schedule ul li table td .onair-detail {
	font-size: 12px;
	margin-bottom: 10px;
}


/*----------------------------------------------------------------------

Matome Style

----------------------------------------------------------------------*/
#side-matome .matome-article {
	display: table;
	margin-bottom: 10px;
}
#side-matome .matome-article .icon {
    display: table-cell;
	width: 30%;
	max-width: 150px;
    margin: 0;
}
#side-matome .matome-article .info {
    display: table-cell;
    width: 70%;
    vertical-align: top;
    box-sizing: border-box;
    padding: 0 0 0 10px;
}
#side-matome .matome-article .info h2 {
    font-size: 12px;
	font-weight: normal;
    color: #333333;
    margin-bottom: 5px;
}
#side-matome .matome-article .info .time {
    display: block;
    font-size: 10px;
    color: #999999;
}



/*----------------------------------------------------------------------

Ranking Style

----------------------------------------------------------------------*/
#ranking .cmn-ttl {
	margin-bottom: 0;
}
#ranking ul {
	padding: 10px;
	background: #fff;
}
#ranking ul li {
	border-bottom: solid 1px #ddd
}
#ranking ul li a {
    font-size: 12px;
    display: table;
    padding: 10px 0;
}
#ranking ul li div {
    text-align: center;
    vertical-align: top;
    display: table-cell;
    padding: 0 10px 0 0;
}
#ranking ul li div .number {
    font-size: 16px;
    font-style: italic;
    font-family: "Times New Roman";
    background-color: #333333;
    color: #fff;
    display: inline-block;
    line-height: 30px;
    width: 30px;
	border-radius: 3px;
}
#ranking ul li:nth-child(-n + 3) .number {
	background-color: #e60012;
}
#ranking ul li p {
    display: table-cell;
}

#ranking #rankingsk {
    font-size: 12px;
	color: #999999;
    text-align: center;
    padding: 10px 0;
}


/*----------------------------------------------------------------------

side-cmn

----------------------------------------------------------------------*/
.side-cmn ul li {
    margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: solid 1px #ddd;
}
.side-cmn ul li:last-child {
    margin-bottom: 0;
 	border-bottom: none;
}
.side-cmn .thumb {
    margin-bottom:10px;
}
.side-cmn .time {
    display: block;
    font-size: 10px;
    color: #999999;
    margin-bottom: 5px;
}
.side-cmn h2 {
    font-size: 14px;
    font-weight: normal;
}



/*----------------------------------------------------------------------

Media Query

----------------------------------------------------------------------*/
@media screen and (max-width: 768px){
	.fit-sidebar-fixed{
        position: inherit;
    }
	.fit-sidebar-blank {
		height: 0 !important;
	}

	
	#main { width: 100%; float: none; }
/*
	#front-nav-wrap { height: 60px; overflow-x: scroll; }
	#front-nav { width: 660px; }
*/
	
	.card-list { margin: 0 10px 10px; /* height: auto !important; */ }
/*	.card { width: 100%; float: none; position: static !important; } */
	.card:nth-child(n+5) { display: none; }

	#side { width: 100%; float: none; }
    .side-box .cmn-ttl { font-size: 14px;line-height: 50px; }
	
	#side-special ul li:nth-child(n+3) { display:none; }
}