@charset'utf-8';
/*
 * StyleSheet(default) for Mobile
 */

/* ===== 初期化 ===== */
*{
	margin		: 0;
	padding		: 0;
	font-style	: normal;
	font-weight	: normal;
/*	font-size	: 100%;*/
}

/* ----- Body ----- */
body{
	-webkit-text-size-adjust : none;
	margin		: 0;
	padding		: 0;
	font-family	: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	font-size	: 95%;
    line-height	: 1.5;
}

/* ----- P ----- */
p{
	margin	: 0;
	padding	: 0;
}

/* ----- 順リスト ----- */
/* 順序付きのリスト
     reversed属性
       リストの並び順を降順（大きい順）にする
     start属性
       リストの開始番号を整数で指定
*/
ol{
	font-family	:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
/*
	text-align	: left;
	display		: inline-block;
*/
}

/* 順不同のリスト */
ul{
	font-family	:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
/*
	line-height	: 150%;
	text-align	: left;
	display		: inline-block;
*/
}

/* リストの項目を記述
     value属性
       リスト項目の順序を整数で指定
       （親要素がol要素の場合にのみ有効となる属性、初期値なし）
*/
li{
}

/* ----- 説明リスト ----- */
/* 説明リスト */
dl{
	margin	: 0;
	padding	: 0;
	font-family	:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

/* 説明される言葉を表す */
dt{
}

/* 説明や定義を記述する */
dd{
	margin	: 0;
	padding	: 0;
}

/* -----  ----- */
h1, h2, h3, h4, h5, h6{
	margin		: 0;
	padding		: 0;
	font-family	: 'Segoe UI Light','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	font-weight	: normal;
}
h1{
	font-size	: 200%;
}
h2{
	font-size	: 150%;
}
h3{
	font-size	: 115%;
}
h4{
	font-size	: 88%;
}
h5{
	font-size	: 67%;
}
h6{
	font-size	: 51%;
}

/* ----- strong ----- */
strong {
	font-weight	: bold;
}

/* ----- Anchor(リンク) ----- */
a:link{
	color			: black;
	text-decoration	: none	/* 下線を消す */
}
/* 既に見たリンク */
a:visited{
	color			: black;
	text-decoration	: none	/* 下線を消す */
}
/* クリック時のリンク */
a:active{
	color	: black;
}
/* カーソルが上にある時のリンク */
a:hover{
	color			: black;
	text-decoration	: none	/* 下線を消す */
}

/* ----- img ----- */
img {
	border	: none;
}

/* ----- Form ----- */
textarea{
	font-family	: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}
input, select{
	font-family	:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

/* 幅を制御する
-------------------------------------------------- */
.width-keeper{
	/* 中央寄せ */
	margin-left	: auto;
	margin-right: auto;
	
	/* 最大幅をつけて PC でも見やすくする（無くても良い） */
	/*max-width	: 640px;*/
/* DEBUG
*/
max-width: 320px;
min-width: 320px;
}

/* 回り込みを制御する（clearfix）
-------------------------------------------------- */
.clearfix:after {
  content	: ".";  /* 新しい要素を作る */
  display	: block;  /* ブロックレベル要素に */
  clear		: both;
  height	: 0;
  visibility: hidden;
}
.clearfix {
  min-height	: 1px;
}
* html .clearfix {
  height	: 1px;
  /*¥*//*/
  height	: auto;
  overflow	: hidden;
  /**/
}


/* ===== ヘッダー ===== */
#header{
	/* ここでヘッダーの背景の設定や高さ設定を行う */
	/* background や height */
	margin-top		: 5px;
	color			: #FFF;
	background-color: #333;
	height			: 100px;
}
	#header .container{
		/* ヘッダーの中身の余白や背景などを設定 */
		/* ex. margin padding background border */
	}
		/* -----  ----- */
		#header .container .frame_main{
			margin		: 0;
			padding		: 0;
			width		: 100%;
			box-sizing	: border-box;
			float		: left;	/* 指定した要素を左に寄せ、後に続く内容をその右側に回り込ませる。右にする場合、right */
		}
		#header .container .frame_sidebar{
			display		: none;
		}
		
		/* -----  ----- */
		#header .container #site_title{
			margin		: 0;
			padding		: 0;
			font-family	: 'Segoe UI Light','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
			font-weight	: normal;
			font-size	: 255%;
			line-height	: 130%;
		}
		
		#header .container #header_title{
			margin		: 0;
			padding		: 0;
			font-family	: 'Segoe UI Light','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
			font-weight	: normal;
			font-size	: 220%;
		}
		
		/* ----- Ad:text ----- */
		#header .container .frame_block_textAd{
			display		: none;
		}
			#header .container .frame_block_anchor a{
				color	: #FFF;
			}


/* ===== 中央、メインコンテンツ ===== */
#contents{
	margin-top	: 5px;
}
	#contents .container{
		/* メインコンテンツの余白や背景などを設定 */
		/* ex. margin padding background border */
		margin	: 0 15px;
		padding	: 10px;
	}
		/* -----  ----- */
		#contents .container .frame_main{
			margin		: 0;
			padding		: 0;
			width		: 100%;
			box-sizing	: border-box;
			float		: left;	/* 指定した要素を左に寄せ、後に続く内容をその右側に回り込ませる。右にする場合、right */
		}
		
		/* ----- 右(right):サイドバー ----- */
		#contents .container .frame_sidebar{
			display		: none;
		}
		
		/* -----  ----- */
		#contents .container .frame_block_full{
			margin		: 0;
			padding		: 0;
			width		: 50%;
			box-sizing	: border-box;
		}
		#contents .container .frame_block_half{
			margin		: 0;
			padding		: 0;
			width		: 50%;
			box-sizing	: border-box;
			float		: left;	/* 指定した要素を左に寄せ、後に続く内容をその右側に回り込ませる。右にする場合、right */
		}
		/* Ad:banner */
		#contents .container .frame_block_bannerAd{
			display		: none;
		}
			#contents .container .frame_block_anchor a{
				color	: #FFF;
			}
		
		/* -----  ----- */
		#contents .container .block_item{
			margin			: 5px 5px 10px 5px;	/* [上][右][下][左] */;
			padding			: 0;
			border-radius	: 6px;
			height			: 150px;
		}
			#contents .container .block_item .item_title{
				margin		: 0;
				padding		: 5px 5px 5px 5px;	/* [上][右][下][左] */;
				font-family	: 'Segoe UI Light','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
				font-weight	: normal;
				font-size	: 145%;
				line-height	: 100%;
			}
			#contents .container .block_item img{
				display		: none;
			}
			#contents .container .block_item .description{
				display	: none;
			}
				#contents .container .block_item .description img{
					display	: none;
				}
		
		/* -----  ----- */
		#contents .container .block_item_bg_green{
			color			: #FFF;
			background-color: #9C0; /*green;*/
		}
		#contents .container .block_item_bg_red{
			color			: #FFF;
			background-color: #FF4500; /*red;*/
		}
		#contents .container .block_item_bg_blue{
			color			: #FFF;
			background-color: #00BFFF; /*blue;*/
		}
		#contents .container .block_item_bg_orange{
			color			: #FFF;
			background-color: #FFA500; /*orange;*/
		}
		
		/* ----- ----- */
		#contents .container .frame_mouseover{
			margin	: 0;
			padding	: 0;
		}
			#contents .container .frame_mouseover a{
				color			: black;
				text-decoration	: none;
				display			: block;
			}
			#contents .container .frame_mouseover a:hover{
				background-color: red;
			}
		#contents .container .mouseover_item{
			margin	: 0px 0px 0px 0px;	/* [上][右][下][左] */;
			padding	: 0;
			height	: 70px;
		}
			#contents .container .mouseover_item_title{
				margin		: 0;
				padding		: 0px 0px 0px 0px;	/* [上][右][下][左] */;
				font-family	: 'Segoe UI Light','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
				font-weight	: normal;
				font-size	: 160%;
			}
			#contents .container .mouseover_item_description{
				margin	: 0;
				padding	: 0px 0px 0px 1em;	/* [上][右][下][左] */
			}
				#contents .container .mouseover_item_description img{
					margin	: 0px 0px 0px 5px;	/* [上][右][下][左] */;
					padding	: 0;
					float	: left;	/* 指定した要素を左に寄せ、後に続く内容をその右側に回り込ませる。右にする場合、right */
				}
		
		/* ----- 頭注、脚注 ----- */
		#contents .container p.headnote{
			margin		: 0px 0px 5px 0px;	/* [上][右][下][左] */
			padding		: 0;
			font-size	: 100%;
		}
		#contents .container p.footnote{
			margin		: 0px 0px 5px 0px;	/* [上][右][下][左] */
			padding		: 0;
			font-size	: 70%;
		}
	
	/* ----- webmaster ----- */
	#webmaster img {
		margin	: 0px 0px 0px 0px;	/* [上][右][下][左] */;
		padding	: 0;
		height	: 60px;
		float	: left;	/* 指定した要素を左に寄せ、後に続く内容をその右側に回り込ませる。右にする場合、right */
	}
	/*  */
	img#yoidora {
		margin-right	: 10px;
		width			: 80px;
		height			: 120px;
		float			: left;
	}


/* ===== フッター ===== */
#footer{
	margin-top		: 5px;
	color			: #FFF;
	background-color: #333;
	height			: 60px;
}
	#footer .container{
		/* ヘッダーの中身の余白や背景などを設定 */
		/* ex. margin padding background border */
	}
		/* -----  ----- */
		#footer .container #footer_title{
			margin		: 0;
			padding		: 5px 0px 0px 0px;	/* [上][右][下][左] */
			font-size	: 85%;
			line-height	: 110%;
			text-align	: center;
		}
		
		/* コピーライト */
		#footer .container #copyright{
			margin		: 0;
			padding		: 0px 0px 0px 0px;	/* [上][右][下][左] */
			font-size	: 80%;
			text-align	: center;
		}


/* ===== 外部提供ブログパーツ/プラグイン ===== */
/* ----- 季節代わりコメント ----- */
#SeasonalComment {
	display	: none;
}

/* ----- なかのひと ----- */
#nakanohito {
	margin	: 15px 0px 0px 0px;	/* [上][右][下][左] */
/*	float	: right;*/
}
#nakanohito img {
	width	: 48px;
	height	: 48px;
}

/* ----- iTune Store ----- */
#iTS {
	margin	: 5px 0px 5px 0px;	/* [上][右][下][左] */
	padding	: 0;
}

/* ----- J-WAVEブログパーツ ----- */
#JWAVE {
	margin	: 5px 0px 5px 10px;	/* [上][右][下][左] */
	padding	: 0;
}


/* ===== パーツ ===== */
/* ----- SNS List ----- */
#sns_list a{
	font-size	: 85%;
	float		: left;
}
#sns_list img{
	margin			: 0px 2px 0px 7px;	/* [上][右][下][左] */
	padding			: 0;
	height			: 34px;
	vertical-align	: middle;
}
#sns_list img.twitter{
	margin			: 10px 2px 10px 7px;	/* [上][右][下][左] */
	padding			: 0;
	height			: 17px;
	vertical-align	: middle;
}

/* ----- counterp ----- */
#counterp {
	font-size	: 75%;
	text-align	: right;
/*	float		: right;*/	/* 指定した要素を右に寄せ、後に続く内容をその左側に回り込ませる。左にする場合、left */
}

/* ------ getRssJS_ CGI ------ */
div#rss_filed {
	display	: none;
}
div#rss_dcdate {
	text-align	: left; 
	font-size	: 85%;
}
div#rss_title {
	margin		: 0;
	padding		: 0;
	font-size	: 85%;
/*
	border-top:1px solid #828282;
	border-bottom:1px solid #828282;
	background-color:#EEFFCC;
*/
}
div#rss_title a {
	font-weight	: bold;
}
div#rss_description {
	margin		: 0;
	padding		: 0;
	font-size	: 85%;
	line-height	: 130%;
	/*border-bottom:1px solid #afafff;*/
}
div#rss_category {
	text-align	: left; 
	font-size	: 75%;
}


/*--------------------
/* 画像を美しく表示するヒント
■ 画像は PC 上で想定する２倍のサイズで作成する
　Retina や HD 解像度でもきれいに表示したいからです。
　自動で拡大縮小されるため、低解像度向けを作成する必要はありません。

■ background-image を設定したときは、
background-size:contain; または background-size:cover;
を設定する。
参考 : http://www.htmq.com/css3/background-size.shtml

※ 追記 2012-2/2
Android 2.1 では
-webkit-background-size:auto 160px;
のように高さだけでも指定してやらないと反応しませんでした。
幅は auto で OK です。

■ img に指定するサイズは、画像のサイズじゃなくても良い。
例 : 幅高さ 128 px でも 64px の大きさで表示させる。 Retina ではとてもきれいに表示される。
幅だけ指定しておけば、アスペクト比は維持される。
<img alt="" src="http://blog.fenrir-inc.com/wp/wp-content/uploads/2012/02/default_128.png" width="64">
-------------------------------------------------- */

/*--------------------
//・marginは領域（外）間のスペース、パディングは領域内のスペース
//    値を1つ指定した場合：[上下左右]
//    値を2つ指定した場合：[上下][左右]
//    値を3つ指定した場合：[上][左右][下]
//    値を4つ指定した場合：[上][右][下][左]
//
//・IE6のバグ回避
//    左フロートしているボックスに対して左マージンを指定すると、指定値の倍のマージンが空く
//    左フロートの前に、さらに左フロートがある場合は、後の左フロートに左マージンを指定しても倍にはならない
//    右フロートの場合も同様で、先に右フロートしたボックスの右マージンが指定値の倍になる
//    よって、できるだけfloat:left を指定したボックスには margin-left を指定しない（0にする）
//    float:right を指定したボックスには margin-right を指定しない（0にする）ようにする
//    このバグは float を指定したボックスに display:inline を指定することでも回避できるよう
--------------------*/