/*--------- ラインナップ ---------*/

.failed{
	margin-top:20px;
	margin-bottom:20px;
}

/*#recommend.for960{
	display:none;
}*/

body{
	 overflow-y: scroll;
}

body .contents-bg{
	padding-bottom:140px;
}

main{
	width:1100px;
	margin:0 auto;
	padding-top:100px;
	text-align:center;
	overflow:hidden;
}

main p.sub{
	border-bottom: 3px dotted #333;
	padding: 10px 0;
	margin-bottom: 50px;
}

h2{
	margin-top:64px;
}

a{
	color:#3E3A39;
	transition:0.3s;
}

a:hover{
	opacity:.8;
	transition:0.3s;
}

.container{
	text-align:left;
}



.lineup img{
	vertical-align:bottom;
}

.item{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}

#magazine{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
}

#magazine #main_block{
	width:69%;
	/*background-color:rgba(0,0,0,.15);*/
	overflow:hidden;
}

#magazine #sub_block{
	width:29%;
	background-color:rgba(255,255,255,.15);
}

#magazine #sub_block{
	position:relative;
}

#magazine #sub_block #stickyblock{
	/*position:sticky;*/
	top:130px;
	padding-top:20px;
	padding-bottom:20px;
}





.article #main{
	margin-bottom:40px;
	overflow:hidden;
}

section#main ul{
	display:flex;
	justify-content:space-around;
	flex-wrap:wrap;
}

section#main ul li{
	max-width:240px;
	margin-bottom:30px;
}

section#main ul li p{
	text-align:left;
	font-size:12px;
	/*width:100%;*/
}

section#main ul li h3{
	text-align:left;
	/*font-weight:normal;*/
	/*border-bottom:solid 1px #000;*/
	max-height:45px;
	overflow:hidden;
	width:100%;
	margin-top:5px;
	font-size:15px;
}

section#main ul li h3 a{
	text-decoration:none;
}

li.rec_article{
	display:flex;
	justify-content: space-around;
	border-bottom:dashed 1px #000;
	position:relative;
	align-items:center;
	margin-right:10px;
	margin-left:10px;
}

li.rec_article:first-child{
	border-top:dashed 1px #000;
}

li.rec_article a{
	position:absolute;
	top:0;
	left:0;
	/*width:100%;*/
	height:100%;
	text-decoration:none;
}

li.rec_article .thumbnail{
	width:120px;
	height:100px;
	display:flex;
	align-items:center;
}

li.rec_article .content{
	width:180px;
	padding-left:10px;
}

li.rec_article .content p,
li.rec_article .content h3{
	font-size:12px;
	text-align:left;
}

li.rec_article .thumnail{
	max-width:140px;
	padding-top:10px;
	/*padding-bottom:10px;*/
	margin-bottom:10px;
	max-height:120px;
	overflow: hidden;
}

section#side_banner{
	margin-left:10px;
	margin-right:10px;
}

section#side_banner li{
	margin-bottom:5px;
}

section#side_banner li:last-child{
	margin-bottom:0px;
}

ul#cat_list{
	display:flex;
	margin:0 auto;
	flex-wrap:wrap;
	margin: 10px;
    margin-top: 5px;
}

ul#cat_list a{
	text-decoration:none;
}

ul#cat_list li{
	padding-right:10px;
	padding-left:10px;
	padding-top:5px;
	padding-bottom:5px;
	color:#3E3A39;
	border:solid 1px #3E3A39;
	width:93px;
	margin:3px;
	font-size:14px;
	text-align:center;
	transition:0.3s;
}

ul#cat_list li:hover{
	transition:0.3s;
	opacity:.8;
}

section#main ul li .art_thumb{
	width:240px;
	max-height:180px;
	overflow:hidden;
}

.main_pager{
	width:300px;
	margin:0 auto;
}

.main_pager ul#pager_list{
	display:flex;
	justify-content:center;
}

.main_pager ul#pager_list li{
	padding:5px;
	margin:5px;
	border:solid 1px #3E3A39;
	transition:0.3s;
}

.main_pager ul#pager_list li:hover{
	transition:0.3s;
	opacity:.8;
}

.main_pager ul#pager_list li{
	position:relative;
}

.main_pager ul#pager_list li a{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.main_pager ul#pager_list li.locked_pager{
	background-color:#3E3A39;
	color:gray;
}

.main_pager ul#pager_list li.now_pager{
	background-color:#3E3A39;
	color:gray;
}

#magazine.article #recommend{
	text-align:center;
}

#magazine.article #side_category{
	text-align:center;
}


li.rec_article{
	transition:0.3s;
	padding-left:0px;
	padding-right:0px;
}

li.rec_article li:hover{
	opacity:.3;
	transition:0.3s;
}

li.rec_article li.locked_pager:hover{
	opacity:1;
	transition:0;
}

.container{
	min-height:200px;
}

p.category{
    border: solid 1px #3E3A39;
    /* padding: 2px; */
    /* font-size: 10px; */
    font-size:12px;
    padding-left: 5px;
    padding-right: 5px;
    /* margin-left: 20px; */
    margin-right: 5px;
    color:#fff;
    background-color:#3E3A39;
}

/*============ARTICLE=============*/

#magazine.article li.rec_article .content h3{
	font-size:12px;
}

#magazine.article #main img{
	max-width:100%;
	height:auto;
}

#magazine.article #main_block p.article_date{
	text-align:left;
	padding-top:2px;
	/*margin-top:10px;*/
}

#magazine.article #main_block h3{
	text-align:left;
	margin-top:5px;
	font-size:15px;
}

#magazine.article h3 a{
	text-decoration:none;
}

#magazine.article{
	text-align:left;
}

#recommend .art_text{
height:50px;
}

	#magazine.article #main_block #main p{
		line-height:28px;
	}
	
	#magazine.article #main_block #main h2{
		border-bottom:solid 1px #806f68;
		text-align:left;
		font-weight:normal;
		position:relative;
		margin-left:15px;
		padding-left:27px;
		margin-bottom:5px;
		width:100%;
		min-height:37px;
	}
	 #magazine.article #main_block #main h2 {
margin-left:15px !important;
padding-left:25px !important;
  } /* IE11 */
	
	#magazine.article #main_block #main h2:before{
		content:url(../images/midashi1.png);
		position:absolute;
		/*top:-4px;*/
		bottom:0;
		left:-15px;
	}
	
	#magazine.article #main_block #main h3{
		font-size:20px;
		margin-top:10px;
		margin-bottom:5px;
	}
	
	#magazine.article #main_block #main .main_text h3{
			min-height:32px;
	}

.container .art_thumb{
	max-height:140px;
	overflow:hidden;
}

.main_text{
	overflow:hidden;
}

.main_text h3{
	width:100%;
	background-color:#4b423d;
	/*padding:5px;*/
	padding-left:10px;
	color:#fff;
	font-weight:normal;
	position:relative;
	padding-top:2px;
	padding-left:15px;
	padding-right:5px;
}

.main_text h3:before{
	content:url(../images/midashi2.png);
	position:absolute;
	top:10%;
	left:5px;
	height:80%;
	background-color:#806f68;
}

.art_explain{
	max-width:240px;
}

#recommend .bx-wrapper{
	overflow:inherit;
}

#recommend .bx-wrapper .bx-pager{
	padding-top:0px;
}

#recommend .bx-wrapper .bx-controls-direction a{
	width:30px;
	top:37%;
}

.mainvisual{
	padding-top:20px;
	padding-bottom:20px;
}

.art_date{
	font-size:12px;
}

h3.rec_title{
	margin-bottom:5px;
}

.sub a{
	text-decoration:none;
}

@media screen and (max-width:960px) {

	main{
		padding-left:15px;
		padding-right:15px;
	}
	
	section#main ul li{
		    max-width: 48%;
	}
	
.container .art_thumb{max-height:120px;}



}

@media screen and (max-width:660px){
.container .art_thumb{		max-height:90px;}
}

@media screen and (max-width:660px){
	.container .art_thumb{		max-height:150px;}
}

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

#recommend.forpc{
	display:none;
}

#recommend.for960{
	display:block;
}

	main{
		padding-left:15px;
		padding-right:15px;
	}
	
	section#main ul li{
		    max-width: 48%;
	}
}
*/

@media screen and (max-width:480px) {

.art_thumb img{
min-height:inherit;
}

	main{
		padding-left:10px;
		padding-right:10px;
	}

p.category{
	font-size:12px;
}

#recommend.forpc{
	display:none;
}
.failed{
	padding-left:10px;
	padding-right:10px;
}

#recommend .bx-wrapper .bx-controls-direction a{
	    right: -23px;
}
/*
#recommend.for960{
	display:none;
}*/


#recommend .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto{
	bottom:-20px;
}

#recommend .bx-wrapper{
	margin-bottom:50px;
}

#recommend .art_explain{
max-width:100%;
}

#recommend #magazine ul.forsp,
#recommend #magazine.article h3 a{
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

section#main ul li h3{
	font-size:17px;
	max-height:inherit;
}

.bx-viewport{
	/*min-height:380px;*/
}

#recommend .bx-wrapper .bx-controls-direction a{
	top:42%;
	width:80px;
}


main p.sub{
	margin-right:5px;
	margin-left:5px;
	margin-bottom:10px;
}

.item{
	flex-wrap:wrap;
}

#magazine #sub_block #stickyblock{
	padding-right:10px;
	padding-left:10px;
}

.kage, .kage.kmargin{
	width:100%;
}

	h2{
/*	    padding-left: 40px;
		padding-right: 40px;*/
		border:none;
    width: 230px;
    margin: 0 auto;
	}
	#contents.contents-bg{
		padding-bottom:20px;
	}

	.kage,
	.kage.kmargin{
		margin-bottom:20px;
	}

	.lineup{
    padding-top: 90px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 30px;
	}
	
	.lineup p{
		padding:10px 0;
		margin-bottom:10px;
	}
	

	section#main ul{
		margin:10px;
		margin-left:0px;
		margin-right:0px;
	}
	
	section#main ul li{
		width:100%;
		max-width:100%;
		display:flex;
		margin-bottom:10px;
	}
	
	section#main ul li.forpc{
		display:none;
	}
	
	section#main ul li .art_explain{
		display:flex;
		flex-wrap:wrap;
		align-items:center;
		padding-left:10px;
		width:60%;
	}
	
	section#main ul li .art_thumb{
		width:40%;
		height:auto;
		max-height:120px;
	}
	

	
	section#recommend ul li.art_explain h3{
		font-size:15px;
	}
	
	
	
	#magazine #main_block{
		width:100%;
		overflow:inherit;
	}
	
	#magazine #sub_block{
		width:100%;
		margin-bottom:20px;
	}
	ul#cat_list{
/*		justify-content:center;*/
		margin:4px;
	}
	
	ul#cat_list li{
		width:98%;
		justify-content: space-around;
	}
	
	
ul#cat_list a{
	width:33%;
}
	
	ul li.content{
		padding-left:10px;
	}
	
	li.rec_article .thumbnail{
		width:120px;
	}
	
	li.rec_article .content{
		margin-left:10px;
	}

li.rec_article .thumnail{
	width:40%;
}
li.rec_article .content{
	width:60%;
}

#magazine #main{
	padding-left:5px;
	padding-right:5px;
}

	
section#main ul li.forpc.rec_article{
	display:none;
}

#recommend{
	padding-left:10px;
	padding-right:10px;
}

#recommend .art_text{
	height:50px;}


section#side_banner{
	margin-left:0px;
	margin-right:0px;
}

#side_banner li{
	text-align:center;
}

.mainvisual{
	padding-top:20px;
	padding-bottom:20px;
}

.container .art_thumb{
	/*max-height:inherit;*/
	overflow:hidden;
	max-height:180px;
}


.art_explain h3{
	white-space:inherit;
	text-overflow:inherit;
	overflow:inherit;
}


#recommend .art_explain h3{
    /*white-space: nowrap;*/
    /*text-overflow: ellipsis;*/
    overflow: hidden;
}

#magazine.article #main_block #main .main_text h2{
	font-size:20px;
	margin-top:5px;
	padding-right:15px !important;
}

#magazine.article #main_block #main .main_text h3{
	padding-top:0px;
	display:flex;
	align-items:center;
	font-size:18px;
	/*white-space: nowrap;*/
    text-overflow: ellipsis;
    overflow: hidden;
}

li.rec_article{
margin-left:0px;
margin-right:0px;
}

.main_art{
	position:relative;
}

.main_art a.forsp{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.main_art{
	transition:.3s;
}

.main_art:hover{
	opacity:.8;
	transition:.3s;
}

.main_art .art_thumb img{
	max-width:180px;
	min-width:inherit;
}

.main_art .art_thumb{
	    max-width: 140px;
	/*padding-top: 10px;*/
	/* padding-bottom: 10px; */
	/*margin-bottom: 10px;*/
	max-height: 120px;
	overflow: hidden;
}





}