@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;}

.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; }



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

#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; }


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

TOP CONTENTS Style

----------------------------------------------------------------------*/
/* common */
.top-contents {
    max-width: 670px;
	margin:auto;
}
.top-contents .top-ttl-h2 {
    font-size: 18px;
    text-align: center;
    padding: 15px 10px;
    margin-bottom: 10px;
    border-top: solid 1px #000;
	color: #2b2b2b;
    background: #fff;
}
.top-contents .more-btn a {
    margin: 0 auto;
}

/* top-slider */
#top-slider {
    padding-bottom: 50px;
    overflow: hidden;
}
#top-slider .swiper-container {
	overflow: visible;/* pagerが隠れてしまうため */
}
#top-slider .swiper-slide img {
	width: 100%;
}
#top-slider .swiper-button-next,
#top-slider .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 40px;
    height: 40px;
    margin-top: -20px;
	opacity: 0.6;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
}
#top-slider .swiper-button-next {
	background-image:url(../images/slider/next.png);
}
#top-slider .swiper-button-prev {
	background-image:url(../images/slider/prev.png);
}
#top-slider .swiper-button-next:after,
#top-slider .swiper-button-prev:after {
	display: none;
}
#top-slider .swiper-pagination {
    bottom: -25px;
}
#top-slider .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #b5b5b5;
    opacity: 1;
}
#top-slider .swiper-pagination-bullet-active {
    background: #e60011;
}


/* top-new-post */
#top-new-post {
	padding-top: 130px;
	margin-top: -130px;
    margin-bottom: 80px;
}
/*
front navは共通部分なので上部に記載
*/

/* top-news */
#top-news {
    margin-bottom: 40px;
}
#top-news .top-contents-in{
	background: #fff;
    padding: 20px 15px 40px;
}
.news-list {
    margin-bottom: 40px;
}
.news-list > li {
    padding: 10px 0;
    border-bottom: dotted 1px #bdbdbd;
}
.news-list > li a {
    display:block;
	position:  relative;
	padding-bottom: 20px;
}
.news-icon {
    display: inline-block;
    width: 90px;
    line-height: 25px;
    font-size: 11px;
    text-align: center;
    vertical-align: top;
    color: #fff;
    background: #828282;
    border-radius: 5px;
}
.news-icon.news-icon__anime {
	background: #61adec;
}
.news-icon.news-icon__movie {
	background: #9ccb47;
}
.news-icon.news-icon__important {
	background: #e60010;
}
.news-icon.news-icon__press-release {
	background: #a4a4a4;
}
.news-list .news-ttl {
    display: inline-block;
	width: calc(100% - 100px);
    line-height: 25px;
    font-size: 14px;
    color: #2e2e2e;
}
.news-list .news-date {
    display: block;
    font-size: 10px;
    color: #b8b8b8;
	text-align: right;
	position: absolute;
	right:0;
	bottom:0;
}


/* top-special */
.top-special .top-contents-in {
	background: #fff;
    padding: 20px 15px 40px;
}
.top-special .special-list {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 30px;
}
.top-special .special-list > li {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    width: 48.5%;
	margin: 0 0 15px 3%;
}
.top-special .special-list > li:nth-child(odd) {
    margin-left:0;
}
.top-special .special-list > li:nth-child(n+7) {
    display: none;
}
.special-list > li a {
    display: block;
}
.special-list > li img {
    display:block;
	width:100%;
	margin-bottom: 10px;
}
.special-list > li p {
    font-size: 14px;
	color:#2e2e2e;
}


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

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%;
}
#side-special ul li p {
	display: none !important;
}







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

Ranking Style

----------------------------------------------------------------------*/
#ranking .cmn-ttl {
	margin-bottom: 0;
}
#ranking ul {
	padding: 10px;
	background: #fff;
}
#ranking ul li {
	border-bottom: solid 1px #ddd
}
/* 6位から非表示 */
#ranking ul li:nth-child(n+6) {
    display: none !important;
}

#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;
}

#side li.widget_text {
  list-style: none !important;
}


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

Media Query

----------------------------------------------------------------------*/
@media screen and (max-width: 768px){

	#main { width: 100%; float: none; }
/*
	#front-nav-wrap { height: 60px; overflow-x: scroll; }
	#front-nav { width: 660px; }
*/
/*
     #front-nav {
		 margin: 0 0 20px;
	 }
*/
	.top-contents .more-btn a,
	.top-contents .more-btn2 a {
		max-width: calc(100% - 30px);
		font-weight: bold;
		background: #fff;
		border: solid 1px #e60012;
		color: #e60012;
	}
	.top-contents .top-ttl-h2 {
		font-size: 13px;
		font-weight: normal;
		margin-bottom: 0;
		border-top: none;
		color: #323232;
		background: #ddd;
	}

	.news-list > li a {
		padding-bottom: 0;
	}
	.news-list .news-date {
		display: inline;
		font-size: 11px;
		text-align: left;
		margin-left: 10px;
		position: relative;
		vertical-align: sub;
	}
	.news-list .news-ttl {
		display: block;
		width: 100%;
		margin-top: 10px;
		line-height: 1.7;
	}





	.card-list { margin: 0 10px 10px; /* height: auto !important; */ }
/*	.card { width: 100%; float: none; position: static !important; } */
	.card:nth-child(n+5) { display: none; }

	.fit-sidebar-fixed{
        position: inherit;
    }
	.fit-sidebar-blank {
		height: 0 !important;
	}
	#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; }

	/* youtube　レスポンシブ */
	.ytWrap {
		height:0;
		padding-top: 56.25%;
		margin:0 auto;
		position: relative;
	}
	.ytWrap iframe {
		width: 100%;
		height: 100%;
		position: absolute;
		left:0;
		top:0;
	}
	
}