@charset "utf-8";
/*
Template: jstork
Theme Name: stork_custom
Theme URI:http://open-cage.com/stork/

/*-------------------------------------------*/
/*  ビジュアルエディタ用CSSの有効化
/*-------------------------------------------*/



/* フォント変更 */
body {
font-family: 'メイリオ', Meiryo,'ヒラギノ角ゴ StdN','Hiragino Kaku Gothic StdN','ヒラギノ角ゴシック','Hiragino Sans','Yu Gothic UI','Arial Black','Arial',sans-serif;
}

リンク記事枠
========================================================================== */
/*---relation---*/
.entry-content .margin-clear {
 margin: 0;
}
 
.entry-content .relation-head {
 display: inline-block;
 padding: 5px 10px 2px;
 margin-bottom: 0;
 font-size: 18px;
 font-weight: bold;
 background-color: #ea4747;
 color: #fff;
 border-radius: 4px 4px 0 0;
}
 
.entry-content .relation-link {
 display: block;
 height: auto;
 /*color: #1464b3;*/
 text-decoration: underline;
 border: solid 2px #ea4747;
 background-color: rgba(255,254,242,0.5);
 border-radius: 0 4px 4px 4px;
 padding: 20px;
 margin: 0 auto 20px;
 font-size: 18px;
}
 
.entry-content .relation-link:before {
 content: "\f0a9";
 padding-right: 10px;
 display: inline-block;
 font: normal normal normal 14px/1 FontAwesome;
 font-size: inherit;
 text-rendering: auto;
 -webkit-font-smoothing: antialiased;
 animation: horizontal 3s ease infinite;
 -webkit-animation: horizontal 3s ease infinite;
}
 
.entry-content .relation-link-id {
 display: block;
 height: auto;
 text-decoration: underline;
 border: solid 2px #ea4747;
 background-color: rgba(255,254,242,0.5);
 border-radius: 0 4px 4px 4px;
 padding: 20px;
 margin: 0 auto 20px;
 font-size: 18px;
}
 
.entry-content .relation-link-id-link:before {
 line-height: 1 !important;
 content: "\f0a9";
 padding-right: 10px;
 display: inline-block;
 font: normal normal normal 14px/1 FontAwesome;
 font-size: inherit;
 text-rendering: auto;
 -webkit-font-smoothing: antialiased;
 animation: horizontal 3s ease infinite;
 -webkit-animation: horizontal 3s ease infinite;
}
 
/** 2017/4/8追記 */
/**======= 色の指定はこちら ========*/
/** color=green */
.entry-content .relation-green .relation-head {
	background-color: #44cc55;
}
.entry-content .relation-green .relation-link {
	border: solid 2px #44cc55;
}
.entry-content .relation-green .relation-link-id {
	border: solid 2px #44cc55;
}
 
/** color=yellow */
.entry-content .relation-yellow .relation-head {
	background-color: #f9c31f;
}
.entry-content .relation-yellow .relation-link {
	border: solid 2px #f9c31f;
}
.entry-content .relation-yellow .relation-link-id {
	border: solid 2px #f9c31f;
}
 
/** color=black */
.entry-content .relation-black .relation-head {
	background-color: #666;
}
.entry-content .relation-black .relation-link {
	border: solid 2px #666;
}
.entry-content .relation-black .relation-link-id {
	border: solid 2px #666;
}
 
/** color=pink */
.entry-content .relation-pink .relation-head {
	background-color: #ff498a;
}
.entry-content .relation-pink .relation-link {
	border: solid 2px #ff498a;
}
.entry-content .relation-pink .relation-link-id {
	border: solid 2px #ff498a;
}
 


<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome-animation/0.0.8/font-awesome-animation.min.css' type='text/css' media='all' />


<p class="relation-head">あわせて読みたい</p>
<p class="margin-clear"><a class="relation-link">home</a></p>