@charset "utf-8";
/* CSS Document */


/***************スマホのスタイル***************/
/*headerset用領域*/
.headerset_area_sptop {
	height: 60px;
}

/*.header_sub_sptop {
	display: block;
	background:#14b7ec;
	text-align: center;
	height: 30px;
}*/


.header_sub_sptop {
	display: none;
}

/*.header_sub_sptop p {
	color:#fff ;
	/*color:#402210 ;
	line-height: 30px;
}*/

/*メイン*/

h1 {
	color: #4e4e44;
	font-size: 1.6em;
	font-weight: bold;
	margin-bottom: 5px;
}

.headerset_area_pc {
	display: none;
}

.sub_recommend {
	display: none;
}

.category_mark {
	display: none;
}

/*
.hc_article .ttl {
	/*width: 100%;
	background-color: #d7bf9a;
	border-bottom: 2px solid #14b7ec;
	padding-left: 10px;
	line-height: 2em;
}*/

.hc_article h2 {
	line-height: 2em;
}

.curator {
	width: 100%;
	border: 1px solid #d6d6d6;
	border-left: 2px solid #14b7ec;
	font-size: 0.85em;
	line-height: 2em;
	padding-left: 5px;
}
*/


/*ランキング表示*/


.adSense_pc {
	display: block;
	text-align: center;
}


/*メインビジュアル変更*/

.feature_first {
position: relative;
-ms-word-break: break-all;
word-break: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;

}


.feature_first a {
	display:block;
color: inherit;
text-decoration: none;
-webkit-transition: .1s color;
transition: .1s color;
}





.feature_first_ttl {
position: absolute;
bottom: 15px;
left: 0;
right: 0;
z-index: 100;
padding:10px 10px 10px 15px;
font-size: 1.4em;
color: #402210;
line-height:1.2;
background: rgba(255,255,255,.7);
/*background: -webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.7)),color-stop(30%,rgba(0,0,0,.7)),to(rgba(0,0,0,0)));
background: -webkit-linear-gradient(bottom,rgba(0,0,0,.7)0%,rgba(0,0,0,.7)30%,rgba(0,0,0,0)100%);
background: linear-gradient(bottom,rgba(0,0,0,.7)0%,rgba(0,0,0,.7)30%,rgba(0,0,0,0)100%);*/
pointer-events: none;
/*text-shadow: 0 2px 2px rgba(0,0,0,.75);*/
-ms-word-break: break-all;
word-break: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
letter-spacing: -0.02em;
}

	.newsList li {
		display: block;
	}
	
	.newsList li:first-child {
		border-top: none;
	}
	
	.newsList li{
		float: left;
		width: 49%;
		margin-right: 2%;
	}
	
	.newsList li:nth-child(2n) {
		margin-right: 0;
	}



	.news_img {
		float: none;
		width: 100%;
		margin-right: 0%!important;
		margin-left: 0%;
	}
	
	.news_text {
		width: 100%;
	}
	
	.news_ttl {
		margin-top: 10px;
	}

	/*302,404*/
	p.main_message{
		font-size:1.5em;
		text-align:center;
		font-weight:bold;
		padding:20px 0;
	}	
	
	p.message{
		padding-bottom:20px;
	}	

/***************タブレットのスタイル***************/
@media screen and (min-width:768px){
	.headerset_area_sptop, .header_sub_sptop {
		display: none;
	}
	
	.headerset_area_pc {
		display: block;
		height: 60px;
	}
	
	/*メイン*/

	
	h1 {
		line-height: 1.1em;
		margin-top: 10px;
	}
	
	
	/*newsList*/
	
		.curator_name, .curator_time {
		font-size: 0.85em;
		margin-top: 10px;
		display: inline-block;
	}
	
	.newsList li {
		display: block;
	}
	
	.newsList li:first-child {
		border-top: none;
	}
	
	.newsList li{
		float: left;
		width: 32%;
		margin-right: 2%;
	}
	
	.newsList li:nth-child(3n) {
		margin-right: 0;
	}
	
/*
	.newsList li:nth-child(2n) {
		float: right;
		width: 48.5%;
		margin-left:1.5%;
	}
*/

	.news_img {
		float: none;
		width: 100%;
		margin-right: 0%!important;
		margin-left: 0%!important;
	}
	
	.news_text {
		width: 100%;
	}
	
	.news_ttl {
		font-size: 1.05em!important;
		margin-top: 10px;
	}

	.recommendList ul, .rankingList ul {
		width: 95%;
		margin: 0 auto;
	}
	
	.recommendList li, .rankingList li {
		padding: 20px 0;
	}
	
	
	.recommend_img {
width: 39%;
margin-right: 5%;
margin-left: 0px;
	}
	
	.ranking_img {
		position:relative;
		width: 39%;
		margin-right: 5%;
		margin-left: 0px;
	}
	
	.ranking_img .rank_box {
			position: absolute;
			top: -3px;
			left: 0px;
			margin: 0px;
			width: auto;
			}
			
	.ranking_img .rank_box #rank_numarea {
	height: auto;
	padding: 2px 11px;
	font-size: 0.8em;
	color: #FFF;
	font-weight:normal;
}
			
	.ranking_img .rank_box .img_rank_num1 {background-color: #e8b536;}
		.ranking_img .rank_box .img_rank_num2 {background-color: #969595;}
			.ranking_img .rank_box .img_rank_num3 {background-color: #a58753;}
				.ranking_img .rank_box .img_rank_num4 {background-color: #14b7ec;}
					.ranking_img .rank_box .img_rank_num5 {background-color: #14b7ec;}
	
	.recommend_text, .ranking_text {
		width: 55%;
	}
	
	.recommend_ttl, .ranking_ttl {
		width: 92%;
		font-size: 1.25em!important;
		height: inherit;
		line-height: 1.3em;
		/*margin-top: 5px;*/
	}
	
	/* subColumn */
	
	.adSense_pc {
	display: block;
	text-align: center;
}


.feature_first_ttl {
position: absolute;
bottom: 25px;
left: 0;
right: 0;
z-index: 100;
padding:13px 13px 13px 20px;
font-size: 2.0em;
color: #402210;
line-height:1.2;
background: rgba(255,255,255,.7);
/*background: -webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.7)),color-stop(30%,rgba(0,0,0,.7)),to(rgba(0,0,0,0)));
background: -webkit-linear-gradient(bottom,rgba(0,0,0,.7)0%,rgba(0,0,0,.7)30%,rgba(0,0,0,0)100%);
background: linear-gradient(bottom,rgba(0,0,0,.7)0%,rgba(0,0,0,.7)30%,rgba(0,0,0,0)100%);*/
pointer-events: none;
/*text-shadow: 0 2px 2px rgba(0,0,0,.75);*/
-ms-word-break: break-all;
word-break: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

	
}

/***************PCのスタイル***************/
@media screen and (min-width:1024px){
	/*main*/

    .top_mark, .top_curator {
		display: none;
	}
	
	h1 {
		margin-top: 35px;
	}
	
	.sptab_news {
		display: none;
	}
	
			.curator_name, .curator_time {
		font-size: 0.66em;
		margin-top: 0px;

	}
	
		.news_img {
		margin-right: 0%!important;
		margin-left: 0%!important;
	}
	
		.news_ttl {
		font-size: 1.05em!important;
		margin-top: 10px;
		height: inherit;
	}
	
	
	.newsList li {
		width: 49%;
		margin-right: 0;
	}
	
	.newsList li:nth-child(odd) {
		margin-right: 2%;
	}
	
	.recommendList {
		margin-top: 30px;
	}
	
	.recommendList ul {
		width: 100%;
	}
	
	.recommendList li {
		padding: 10px 0;
	}
	
	
	.recommend_img {
		width: 37%;
		margin-right: 3%;
		margin-left: 2%;
	}

	.recommend_text {
		width: 55%;
		
	}
	
	.recommend_ttl {
		font-size: 0.85em!important;
		line-height: 1.3em;
		width: 100%;
		margin-bottom: 5px;
		height: inherit;
		/*margin-top: 5px;*/
		
	}
	
	.sub_recommend {
		display: block;
	}
	
	.adSense_pc {
	display: none;
	text-align:center;
	}
	
	
	/*ランキング表示*/
	
	.rankingList {
		margin-top: 30px;
	}
	
	.rankingList ul {
		width: 100%;
	}
	
	.rankingList li {
		padding: 10px 0;
	}
	
	
	.ranking_img {
		position:relative;
		width: 37%;
		margin-right: 3%;
		margin-left: 2%;
	}
	
		.ranking_img .rank_box {
			position: absolute;
			top: -4px;
			left: 0px;
			margin: 0px;
			width: auto;
			}
			
	.ranking_img .rank_box #rank_numarea {
	height: auto;
	padding: 1px 9px;
	font-size: 0.8em;
	color: #FFF;
	font-weight:normal;
			}
			
	.ranking_img .rank_box .img_rank_num1 {background-color: #e8b536;}
		.ranking_img .rank_box .img_rank_num2 {background-color: #969595;}
			.ranking_img .rank_box .img_rank_num3 {background-color: #a58753;}
				.ranking_img .rank_box .img_rank_num4 {background-color: #14b7ec;}
					.ranking_img .rank_box .img_rank_num5 {background-color: #14b7ec;}

	.ranking_text {
		width: 55%;
	}
	
	.ranking_ttl {
		font-size: 0.85em!important;
		line-height: 1.3em;
		width: 100%;
		margin-bottom: 5px;
		height: inherit;
		/*margin-top: 5px;*/
		
	}
	
	
	.feature_first_ttl {
position: absolute;
bottom: 25px;
left: 0;
right: 0;
z-index: 100;
padding: 20px 25px 20px;
font-size: 1.8em;
color: #402210;
line-height:1.2;
background: rgba(255,255,255,.7);
/*background: -webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.7)),color-stop(30%,rgba(0,0,0,.7)),to(rgba(0,0,0,0)));
background: -webkit-linear-gradient(bottom,rgba(0,0,0,.7)0%,rgba(0,0,0,.7)30%,rgba(0,0,0,0)100%);
background: linear-gradient(bottom,rgba(0,0,0,.7)0%,rgba(0,0,0,.7)30%,rgba(0,0,0,0)100%);*/
pointer-events: none;
/*text-shadow: 0 2px 2px rgba(0,0,0,.75);*/
-ms-word-break: break-all;
word-break: break-word;
word-wrap: break-word;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

	/*302,404*/
	p.main_message{
		font-size:1.5em;
		text-align:center;
		font-weight:bold;
		padding:20px 0;
	}	
	
}