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

/*=======================================
1.全体
=======================================*/

#rss ul{
	list-style: none;
	box-sizing: border-box;
	
	padding:0px 10px;
}
#rss li{
		
}

@media screen and (min-width: 768px){
	#rss ul{
		/*フレックスボックスの設定*/
		display: -webkit-flex;
   		display: flex;
    	-webkit-flex-wrap: wrap;
    	flex-wrap: wrap;
		/*フレックスボックスの要素を中央寄せ*/
		justify-content: space-between;
		align-items: stretch;
		
		padding:0px;
	}
	#rss li{
		/*フレックスボックスの横幅*/
		width:48.5%;
	}
}

/*=======================================
2.個別記事エリア
=======================================*/

/*imgエリアとテキストエリアFlexBox*/

#rss li .mail-magazine-columns{
	/*フレックスボックスの設定*/
	display: -webkit-flex;
   	display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
	/*フレックスボックスの要素を中央寄せ*/
	justify-content: space-between;
	align-items: stretch;
	
	/*その他*/
	padding:20px 0px;
	border-top:dotted 1px black;
}
@media screen and (max-width: 768px){
	#rss li .mail-magazine-columns{
		padding:15px 0px;
	}
}
/*左側*/
#rss .mail-magazine-left-column{
	/*フレックスボックスの横幅*/
	width:30%;
	display: block;
}
/*右側*/
#rss .mail-magazine-right-column{
	/*フレックスボックスの横幅*/
	width:70%;
	display: block;
	
	/*その他*/
	padding: 5px 10px 5px 10px;
}


/*日付*/
.mail-magazine-pub-date{
	font-size: 0.8em;
	color:#888888;
	font-family:'Julius Sans One', sans-serif ;
}
@media screen and (max-width: 768px){
	.mail-magazine-pub-date{
		font-size: 1.2em;
	}
}

/*タイトル*/
.mail-magazine-title{
	padding-top:5px;
	font-size: 1.1em;
	line-height: 1.3;
}
@media screen and (max-width: 768px){
	.mail-magazine-title{
		font-size: 1.5em;
	}
}

/*ディスクリプション*/
.mail-magazine-desc{
	padding-top:8px;
	font-size: 0.8em;
	color:#666666;
}
@media screen and (max-width: 768px){
	.mail-magazine-desc{
		font-size: 1.1em;
		line-height: 1.2;
		
		display: -webkit-box;
    	-webkit-box-orient: vertical;
    	-webkit-line-clamp: 3;
    	overflow: hidden;
	}
}