@charset "UTF-8";
/*  子テーマ：「advanced.css」	*/



/*◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
◆◆◆◆◆　　　　　　　　　　　　◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
◆◆◆◆◆　　　▼テスト開始　　　◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
◆◆◆◆◆　　　　　　　　　　　　◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆*/




/*◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
◆◆◆◆◆　　　　　　　　　　　　◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
◆◆◆◆◆　　　▲テスト終了　　　◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
◆◆◆◆◆　　　　　　　　　　　　◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆*/





	

/*★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆
★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆

	■新たに追加したクラス

★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆	
★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆*/




/*◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆
 
		注釈（e.g. ※１）のアニメーション				

◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆*/

.C_anime-annotation{
/*	text-decoration: none;	/*	傍線の非表示（元々傍線を付けていないから不要）	*/
	transition: 1s;		/*			*/
}


.C_anime-annotation:hover{

/*---------------------------------------------

	次の構成になっている。
	・上部の白い影：第１と２パラメータ
	・下部の焦げ茶色の影：第３パラメータ
	・ぼんやりした暗いオレンジ色（基準の色）：第４と５パラメータ
	
	なお、文字サイズ１．６ｒｅｍと余り大きくないので、ぼんやりした影を余り広げないようにするために、
	第４パラメータの最後の値を[「1rem」から「0.8rem」に下げた。
	
	また、この設定は「小松市不動産Navi」の注釈アニメーションを参考にしている。
	ただ、当ブログ上では「rem」指定のサイズが小さく表示されるため、「px」指定に変えた。

---------------------------------------------*/
	text-shadow: 0 -1px #fff,0 -2px #fff, 0 1px 1px #2a1100, 0 0 12px #9c3e00, 0 0 3px #9c3e00;	/*			*/



	 font-size: 24px;		/*		文字の拡大			*/

/*	color: #fff !important;			/*	反映されず　※１などは、別途オレンジ色を指定しているのでは？	*/
	transition: 0.5s;		/*			*/

}

/*	◆◆◆END（注釈のアニメーション）◆◆◆◆◆◆◆◆◆	*/




/*----------------------------------------------------

	【コンテナブロック内の左右から見たセンターに設置】

	「コンテナブロック」は、「包含（ほうがん）ブロック」とも言い、
	対象要素が表示できる親要素のボックス（領域）のこと。
	
	当クラスは、ブロックレベル要素（e.g. tableタグ）のプロパティとして指定すれば、
	その親要素のコンテナブロックの領域内で、そのブロックレベル要素が親要素の領域幅未満であれば自身のセンタリングになる。
	一方、「al-c」クラス（test-align:center）は、ブロック要素のプロパティとして指定しなければならなく、、
	その中のインライン要素（テキストやimg要素）のセンタリングになる。
	
	【使用例】
	〇Googleマップの表示領域をセンタリングするために「div」要素に指定
	
	〇テーブルをセンタリングするために「tablte」要素のプロパティとして指定
	具体的な使用例としては、複数の写真を横に並べる時に、「table」要素のプロパティとして指定
	なお、写真１つのセンタリングは、tableタグを使う必要がなく、単にimg要素（インラインレベル）の
	センタリングなので、親のブロックレベルのプロパティとして、「al-c」クラスを指定すれば事足りる。

	

------------------------------------------------------*/
.C_container-block-center {
	margin-left:auto; 
	margin-right:auto;
}



/*------------------------------------------------------------------------------------

	【タイトル付きの装飾ボックス】
		
		⇒　賢威８ＷＰマニュアルの［7-O］を参照

--------------------------------------------------------------------------------------*/


/*--- ▼共通部分	------------------------------------------*/

/*カラーボックス（共通部分）*/
.C_box_style_dark_blue,
.C_box_style_dark_brown {
	margin-bottom: 30px;
	padding: 6px;
	background-size: 4px 4px;
	background-repeat: repeat;
	font-size: 1.4rem;
}

.C_box_style_dark_blue .box_inner,
.C_box_style_dark_brown .box_inner { padding: 15px; }

.C_box_style_dark_blue .box_style_title,
.C_box_style_dark_brown .box_style_title {
	margin: -8px 0 5px -27px;
	color: #fff;
	line-height: 1.4;
}
/*--- ▲共通部分	-------------------------------------------*/


/*--- ▼ダークブルー部分（主に「蒼天の舞」用）	---------------*/

/*カラーボックス（ダークブルー）*/
.C_box_style_dark_blue{
	background-image: linear-gradient(
		-45deg,
		#fff 25%,
		#2a5179 25%, #2a5179 50%,				/*	「#2a5179」（ダークブルー）		*/
		#fff 50%, #fff 75%,
		#2a5179 75%, #2a5179
	);
}

.C_box_style_dark_blue .box_inner{ background-color: #f8fdff; }			/*	装飾ボックスの背景色：「#f8fdff」（限りなく白に近い薄青）	*/
.C_box_style_dark_blue .box_style_title span{ background-color: #2a5179;}

/*--- ▲ダークブルー部分（主に「蒼天の舞」用）	---------------*/


/*--- ▼ダークブラウン部分（主に「黄昏への道」用）	-----------*/

/*カラーボックス（ダークブルー）*/
.C_box_style_dark_brown{
	background-image: linear-gradient(
		-45deg,
		#fff 25%,
		#5a3f30 25%, #5a3f30 50%,				/*	「#5a3f30」（ダークブルー）		*/
		#fff 50%, #fff 75%,
		#5a3f30 75%, #5a3f30
	);
}

.C_box_style_dark_brown .box_inner{ background-color: #faf6f5; }			/*	装飾ボックスの背景色：「faf6f5」（限りなく白に近い薄茶）なお、「#FFF8F9」はテストで使ったもう１つの候補で、もう少し赤みがかっている。	*/
.C_box_style_dark_brown .box_style_title span{ background-color: #5a3f30;}

/*--- ▲ダークブラウン部分（主に「黄昏への道」用）	-----------*/





/*------------------------------------------------------------
	▼ツールチップ用の赤下線
-------------------------------------------------------------*/

/*--- 赤下線、フォントサイズ１４ｐｘと辞書のカーソル   ---*/
.C_text-deco-underline {


	text-decoration: underline;	
		/*..................................................
		【参考まで】
			下線の色は文字の色になり変更できないとのこと（プロレイアウト大原則P.76より）		
			ただ、現状は当クラスを指定しているspanタグに別途赤色のクラスを指定している。		
			これにより、文字の色とは違う赤下線が実現できている。						
			但し、リンクテキストの場合、IE,Edge,Firefoxに於いては赤下線になっているものの、		
			Chrome,Opera,Safari於いては文字の茶下線になっている。	
	
			完全に下線を赤色にするには、下記のようにボーダーボトムを使って可能であるが、
			文字と下線の間に隙間ができるので採用せず。	
			border-bottom:solid 1px red;	
			なお、インライン要素にpadding-bottomが有効なので、0pxを指定してみたが文字と下線の隙間は詰まらなかった。
		....................................................*/

	cursor: url(https://www.air-park.net/souten/wp-content/themes/keni8-child/images/cursor/dictionary.png),help;	/*	用語解説用のツールチップ用テキストなので、カーソルを辞書のカーソルを表示。辞書カーソルが表示できたい時は、ヘルプ（？＋矢印）カーソル（ＩＥ用）を表示。なお、リンクも含んでいる時は、ポインターのカーソルが優先して表示されてしまう。	*/
}



/*--- 文字の色を記事本文の色に （ツールチップ時、アンダーバーのための赤色指定から元の記事本文文字色に戻すため）  ---*/
.C_body-color {
	color: #505050;
}


/*--- 文字の色を注釈色に（注釈内でツールチップを使う時に、アンダーバーのための赤色指定から元の注釈文字色に戻すため） ---*/
.C_comment-color {
	color: #808080;
}


/*---▲ツールチップ用の赤下線---------------------------------*/





/*----------------------------------------------------

	【テキストの色】

------------------------------------------------------*/

/*---	【「黄昏への道」用】表のタイトル上の番号記号として使用（e.g. 記事「地価の動向（2020年版）」の「表-石-1」の暗い青色として	---*/
.C_dark-blue {
	color: #3a71a5;
}



/*---	【「蒼天の舞」用】表のタイトル上の番号記号として使用（e.g. 記事「地価の動向（2020年版）」の「表-石-1」の焦げ茶色として	---*/
.C_dark-brown {
	color: #5a3f30;
}

/*---	注釈の文字色に合わせた色	---*/
.C_gray {
	color: #808080;		/*	ちなみに親テーマに設定されている「gray」クラスは「#999」で灰色が薄過ぎで文字色に向かなく、また記事本文の文字色は「#505050」	*/
}



/*----------------------------------------------------

	【テキスト装飾を無効】

	■使用箇所
	文章中に「※１」を指定して、「a」要素で注釈本文へリンクする指定をした場合に自動的にアンダーバーが表示されてしまう。
	そのため、アンダーバーを削除するために「a」要素のクラスで指定している。
	なお、「※１」に対し注釈本文へのリンクを採用したのは、2020年10月以降の投稿からである。

	↓

	■注意と疑問点
	なぜか、このクラスを指定してもリンクのアンダーバーが消えない。
	ＨＴＭＬソースのa要素に「 style="text-decoration:: none;"」を直接指定したところ消えたので、こちらを採用。
	よって、現在「C_non-underbar 」を使用しておらず！！！


------------------------------------------------------*/

C_non-underbar {
	text-decoration: none !important;
}








/*----------------------------------------------------

	【テキスト装飾用】

------------------------------------------------------*/

/*---	文字右下に影、太文字（文字の色とサイズは別途指定要）	---*/
.C_text-shadow-right-down {
	text-shadow: 4px 4px 4px #888;"
	font-weight: bold;
}



/*---	白色文字の周囲を薄いオレンジ色の影、太文字（文字サイズは別途指定要）	---*/
.C_text-shadow-all-orange {
	text-shadow: 1px 1px 2px black, 0 0 1rem #9c3e00, 0 0 0.2rem #9c3e00;
	color: white;
	font-weight: bold;
}



/*---	白色文字の周囲を薄暗い青色の影、太文字（文字サイズは別途指定要）	---*/
.C_text-shadow-all-blue {
	text-shadow: 1px 1px 2px black, 0 0 1rem #264b71, 0 0 0.2rem #264b71,
									0 0 1rem #264b71, 0 0 0.2rem #264b71;	/*	薄暗い青色（通常指定を輪郭を除いて２重に指定）	*/	color: white;
	font-weight: bold;
	font-size: 1rem;
}

/*----------------------------------------------------

	【注釈用】

------------------------------------------------------*/

/*	注釈用のオレンジ太字（e.g. 上付きテキスト（「sup」要素）「※１」部分に対して指定）		*/
.C_comment-orange-bold {
	font-weight: bold; 
	color: #ff6600;
}

/*	オレンジ文字（e.g. 本文サイズ「※１」部分に対して指定　⇒　太文字でない）		*/
.C_orange {
	color: #ff6600;
}

/*	注釈のタイトル無し（注釈全体に対して指定）		*/
.C_comment-non-title {
	margin-left:2rem;
	line-height:1.5;
	font-size:14px; 
	color: #808080;		/*	ちなみに記事本文の文字色は「#505050」であり、親テーマに設定されている「gray」クラスは「#999」で灰色が薄過ぎで文字色に向かない。	*/
}

/*	注釈のタイトル有り（注釈全体に対して指定）	なお、「※タイトル」は、別途「<span class="b">で囲んで太文字要	*/
.C_comment-add-title {
	margin-left:2rem;
	line-height:1.5;
	font-size:14px; 
	color: #808080;		/*	ちなみに記事本文の文字色は「#505050」であり、親テーマに設定されている「gray」クラスは「#999」で灰色が薄過ぎで文字色に向かない。	*/
}



/*----------------------------------------------------

	■回り込み
	
	【参考まで】
	・親テーマの「left」と「right」クラスは、
	画面サイズ７６８ｐｘ未満で回り込み解除される。
	・しかし、当ブログはサイドメニューがあるので、
	記事本文が表示される横幅はもっと狭いので
	９２０ｐｘ未満で回り込み解除する。

------------------------------------------------------*/

/*--- 回り込み	※９２０ｐｘ未満で回り込み解除 ---*/
.C_left{
	float: left;
	margin: 0 1em 1em 0;
}

.C_right{
	float: right;
	margin: 0 0 1em 1em;
}





/*==========================================================
  
  ★☆★Googleマップ（ＲＷＤ）★☆★
  
===========================================================*/

/*------------------------------------
	縦×横 ＝ ７０％×９０％
--------------------------------------*/
.C_canvas_wrapper-70x90per
{
	max-width: 70% ;			/*		*/
	padding-bottom: 90% ;		/*		*/
	position: relative ;
	top: 0 ;
	left: 0 ;
	height: 0 ;
	overflow: hidden ;
}

.C_canvas_wrapper-70x90per > div
{
	position: absolute ;
	top: 0 ;
	left: 0 ;
	width: 100% ;
	height: 100% 
}

/*------------------------------------
	縦×横 ＝ ８０％×８０％
--------------------------------------*/
.C_canvas_wrapper-80x80per
{
	max-width: 80% ;			/*		*/
	padding-bottom: 80% ;		/*		*/
	position: relative ;
	top: 0 ;
	left: 0 ;
	height: 0 ;
	overflow: hidden ;
}

.C_canvas_wrapper-80x80per > div
{
	position: absolute ;
	top: 0 ;
	left: 0 ;
	width: 100% ;
	height: 100% 
}


/*------------------------------------
	縦×横 ＝ ９０％×７０％
--------------------------------------*/
.C_canvas_wrapper-90x70per
{
	max-width: 90% ;			/*		*/
	padding-bottom: 70% ;		/*		*/
	position: relative ;
	top: 0 ;
	left: 0 ;
	height: 0 ;
	overflow: hidden ;
}

.C_canvas_wrapper-90x70per > div
{
	position: absolute ;
	top: 0 ;
	left: 0 ;
	width: 100% ;
	height: 100% 
}

/*------------------------------------
	縦×横 ＝ １００％×６０％
--------------------------------------*/
.C_canvas_wrapper-100x60per
{
	max-width: 100% ;			/*		*/
	padding-bottom: 60% ;		/*		*/
	position: relative ;
	top: 0 ;
	left: 0 ;
	height: 0 ;
	overflow: hidden ;
}

.C_canvas_wrapper-100x60per > div
{
	position: absolute ;
	top: 0 ;
	left: 0 ;
	width: 100% ;
	height: 100% 
}

/*======= ▲END　★☆★Googleマップ（ＲＷＤ）★☆★ ======================================*/













	
/*=======================================================================
	
	★☆★ボタンの装飾★☆★
	
	■開閉ボタンに使用
	
========================================================================*/

.C_button-decoration {	
	border-radius: 8px 8px 8px 8px;				/*  ■角丸対応■　	*/

	background-color: #aaa; 	

	font-weight: bold;
	color: #1a334c;		/*		*/
	border: solid 1px #888;	/*	ボタンの背景が薄い灰色なので、枠線で目立つようにした	*/
	
	/*
	HTML5 & CSS3 P148⇒グラデーション、P154⇒グラデーションの色を増やす、P182⇒背景色を半透明（主要ブラウザのみに設定。一世代前のWebKit系ブラウザは確認していないので、未設定
		*/
	background: -webkit-gradient(linear, left top, left bottom, from(#bebebe), color-stop(50%, #8b8b8b), color-stop(50%, #7a7a7a), to(#9c9c9c));			/*   HTML5 & CSS3  P.155 → 一世代前のWebKit系ブラウザにグラデーション対応 　	*/
	background: -webkit-linear-gradient(rgba(190,190,190,0.8) 0%, rgba(139,139,139,0.9) 50%, rgba(122,122,122,0.95) 51%, rgba(156,156,156,0.75) 100%);		/*   HTML5 & CSS3  P.154→最新のWebKit系ブラウザによる枠の背景にグラデーション（ベンダープレフィックス-webkit-：P.17) 	*/
	background: -moz-linear-gradient(rgba(190,190,190,0.8) 0%, rgba(139,139,139,0.9) 50%, rgba(122,122,122,0.95) 51%, rgba(156,156,156,0.75) 100%);		/*   HTML5 & CSS3  P.154→主要ブラウザにもグラデーション対応	*/
	background: -o-linear-gradient(rgba(190,190,190,0.8) 0%, rgba(139,139,139,0.9) 50%, rgba(122,122,122,0.95) 51%, rgba(156,156,156,0.75) 100%);
	background: -ms-linear-gradient(rgba(190,190,190,0.8) 0%, rgba(139,139,139,0.9) 50%, rgba(122,122,122,0.95) 51%, rgba(156,156,156,0.75) 100%);

	background: linear-gradient(to bottom, rgba(190,190,190,0.8) 0%, rgba(139,139,139,0.9) 50%, rgba(122,122,122,0.95) 51%, rgba(156,156,156,0.75) 100%);
	/*	★注意★　CSSは上から読まれていき、詳細度が同じなら下にあるプロパティが優先されるので、必ずベンダープレフィックスが付かないプロパティを最後に書くこと！！！	*/

/*	width: 200px;		/* ボタンのサイズは、文字列の幅に合わすため削除	*/

}

.C_button-decoration {	
	font-size: 17px;		/* 	*/
	padding: 10px;

}

.C_button-decoration {		/*	*/

		/*   HTML5 & CSS3  P.206　リンクにアニメーションを設定する（時間の経過と共に少しづつ色が変わる）	*/
	/* マウスカーソルを要素から外した時		HTML5 & CSS3 P.206とそのページの手書き参照	*/
	-webkit-transition: 2s;
	-moz-transition: 2s;
	-o-transition: 2s;
	-ms-transition: 2s;
	background-color: rgba(255,102,0,0)			/*   HTML5 & CSS3  P.206の「MEMO」→　ＩＥ１０対応	*/

}		



.C_button-decoration:hover {	
	background-color: rgba(89,172,255,1);		/*   HTML5 & CSS3  P.182　背景色のＲＧＢ指定と半透明無し指定（こちらの水色背景が、黒の背景の下にくるようなので、黒を半透明にし、水色を半透明無しにした）	*/
/* マウスカーソルを要素に重ねた時		HTML5 & CSS3 P.206とそのページの手書き参照	*/
	-webkit-transition: 1s;
	-moz-transition: 1s;
	-o-transition: 1s;
	-ms-transition: 1s;

	border-radius: 8px 8px 8px 8px;					/*   各タブリストの左右の上端を角丸	*/


	cursor: pointer;			/*   カーソルをリンクを示す手のマークに	*/


}		/* =======end======== */


	
/*=======================================================================
	
	★☆★独自の装飾テーブル用★☆★
	
	■装飾内容
	・角丸
	・影付き
	・「head」の全「th」セルの背景色を灰色に
	・「body」の各１列目の「th」セルの背景を白色に⇒賢威８で薄灰色にしているため、白色に代える
	・全「th」セルの文字を太文字に

	■対象テーブルの構造
	・「thead」と「tbody」で構成されたテーブル
	・１行目が「head」で、その全てのセルは「th」タグである。
	・「tbody」の各行の先頭セルは「th」タグで、２列目以降は「td」タグである。

	■表示確認済のテーブル
	・モバイル時に、スライドするテーブル（「賢威８」の「table-scroll」クラスを設定したテーブル）
	
==========================================================================*/




/*---------------------------------------------
	■背景白用の影　＆　開閉ボタンの影■
----------------------------------------------*/
.C_outside-shadow {
	box-shadow: 6px 10px 8px #bbb;		/*   HTML5 & CSS3  P.156 コンテンツ全体の枠のまわりに影のぼかしを設定　	*/
}




/*-----------------------------------------------
 
		角丸実現のための設定		

------------------------------------------------*/
table.C_table-style2{
	border-collapse: separate;		/*   ■角丸対応■　表の枠線の表示形式		separater⇒角丸で表示するために、borderを有効にさせるため。参考：collapse（表の外枠と各セルの枠を重ねて表示）では、「border-radius」プロパティが無効	*/
	border-spacing: 0;				/*   ■角丸対応■　セルとセルの間隔			*/
	border:  1px solid #aaa !important;		/*   ■角丸対応■テーブルの外枠のボーダー指定			*/
	border-radius: 5px;				/*  ■角丸対応■　テーブルの外枠の４隅を角丸に	*/
}

table.C_table-style2 th,
table.C_table-style2 td{
	border-top: 1px solid #aaa !important;		/*   ■角丸対応■テーブルの内枠のボーダー指定（各セルのトップを指定）			*/
	border-left: 1px solid #aaa !important;	/*   ■角丸対応■テーブルの内枠のボーダー指定（各セルの左を指定）			*/
}




/*--------------
	tableの外枠の上辺と左辺が２重になっていいるので、内枠を消す			
----------------*/
table.C_rd-hd2 thead tr:first-child th{
	/*	「thead」要素の中で、「tr」要素を子に持つ全ての親要素（今回は「thead」要素１つ）を基準にして、最初の子の「tr」要素（今回は１つのみ）に対し、その中に存在する全ての「th」要素 */	
	border-top: none !important;			/* 	テーブルの上辺を消す	*/
}

table.C_rd-hd2 th:first-child {		/*	「th」の直前に「thead」等を付けていないので、「thead」、「tbody」の両者が対象になる！ ⇒「thead」と「tbody」要素それぞれに対し、「th」要素を子に持つ全ての親要素「tr」を基準にして、子の最初の「th」要素	*/
	border-left: none !important; 							/* 	テーブルの左辺を消す	*/
}



/*-------	
	tableの外枠の角丸が、セルの背景指定より隠れるのを避けるために、対象内枠（セル）の角丸指定			
		もしかしたら、背景にグラデーションを入れた場合のみ、対象内枠（セル）が必要なのかも？
------*/


table.C_rd-hd2 thead th:first-child {		/* 	テーブルのヘッダーの最初のthセル	*/
	border-radius: 5px 0 0 0 ;							/*  該当セルの左上を角丸に	*/
}

table.C_rd-hd2 thead th:last-child {		/* 	テーブルのヘッダーの最後のthセル	*/
	border-radius: 0 5px 0 0 ;							/*  該当セルの右上を角丸に	*/
}



table.C_rd-hd2 tbody tr:last-child td:last-child{ 			/* テーブル右下のセル		*/
	border-radius: 0 0 5px 0 ;									/* セルの右下の角		*/
}

table.C_rd-hd2 tbody tr:last-child th:first-child{ 			/* テーブル左下のセル		*/
	border-radius: 0 0 0 5px ;									/* セルの左下の角丸		*/
}





/*-----------------------------------------------
 
	【全「th」セルの文字を太文字に】
	（１行目と１列目の全セル）		

------------------------------------------------*/
table.C_table-style2 th{
	font-weight: bold ;	
}


/*---------------------------------------------------------
	
	【一括で表の行の背景色を交互に変える】
	
	■ボディの行のみ対象（「tbody」のみ対象で、「thead」、「tfoot」は対象外）
	■背景色変更対象行の内、特定のセルのみ色を変更したい場合は、
	そのセル（「th」や「td」）に対し別途背景色を指定すればＯＫ。
	■背景色変更対象行の内、特定の行のみ色を変更したい場合は、
	変えたいセル全てに対し、別途背景色を指定するしかなかった。
	（対象行（「tr」）に対し、別途背景色を指定しても反映されなかった。）
	
	【注意点】
	「小松市不動産Navi」でも同様にテーブルの行の背景を飛び飛び変えているが、
	「tr:nth-child(even)」の後に「th」や「td」を記述しなくても、両要素背景が反映されている。
	しかし、ＷＰで同様に「th」や「td」を記述しなかったら、なぜか「td」にしか反映されない。
	そこで、下記のように「th」や「td」を指定したところ、両要素に背景が反映された。
	

------------------------------------------------------------*/

/*-----------------------------
	■薄オレンジ色（正確には薄肌色）
	・主に、「黄昏への道」のテーブル用
-----------------------------*/
/*---「tbody」に対する偶数行（ヘッドとフットは対象外）---*/
table.C_bg-color-even-orange tbody tr:nth-child(even) th,
table.C_bg-color-even-orange tbody tr:nth-child(even) td {
	background-color: rgba(126,30,0,0.04) !important;
}

/*---「tbody」に対する奇数行（ヘッドとフットは対象外）---*/
table.C_bg-color-odd-orange tbody tr:nth-child(odd) th,
table.C_bg-color-odd-orange tbody tr:nth-child(odd) td {
	background-color: rgba(126,30,0,0.04) !important;
}



/*-----------------------------
	■薄青色（正確には薄水色）
	・主に、「蒼天の舞」のテーブル用
-----------------------------*/
/*---「tbody」に対する偶数行（ヘッドとフットは対象外）---*/
table.C_bg-color-even-blue tbody tr:nth-child(even) th,
table.C_bg-color-even-blue tbody tr:nth-child(even) td{
	background-color: rgba(86,170,255,0.06) !important;
}

/*---「tbody」に対する奇数行（ヘッドとフットは対象外）---*/
table.C_bg-color-odd-blue tbody tr:nth-child(odd) th,
table.C_bg-color-odd-blue tbody tr:nth-child(odd) td {
	background-color: rgba(86,170,255,0.06) !important;
}




/*---------------------------------------------------------
 
	【背景色を薄色に】
		
	テーブルに複数行が並ぶと見にくくなるので
	１行おきに背景色を変えるためのクラス	
	
	⇒　従来の設定方法で、新しい投稿のテーブルでは
	「C_bg-color-even-orange」（偶数行をオレンジ背景）、「C_bg-color-odd-orange」（奇数行をオレンジ背景）
	「C_bg-color-even-blue」（偶数行を青背景）、「C_bg-color-odd-blue」（奇数行を青背景）を使用
	
	■指定位置
	各セル（「ｔｈ」、「ｔｄ」要素に指定。
	（対象行の「tr」要素の指定したら、「ｔｈ」要素のセルは反映しなかったのでＮＧ）

----------------------------------------------------------*/
.C_bg-color-half-clear-orange5 {

	background-color: rgba(126,30,0,0.04) !important; /*　薄肌色　⇒　「黄昏への道」のテーブル用	*/
}


.C_bg-color-half-clear-blue {

	background-color: rgba(86,170,255,0.06) !important; /*　薄ブルー　「蒼天の舞」のテーブル用	*/
}



/*##################################################

	【賢威８の独自の設定を解除するための設定】

#####################################################*/


/*-----------------------------------------
	
	【「thead」の対応】

	�@灰色背景色の設定
	・賢威８テンプレート上でテーブルを作成すると「thead」の「ｔｈ」セルは特定の背景色（焦げ茶色）になり、
	また、文字が白色になるので、
	文字を通常の文章と同じ濃い灰色に変え、、
	「background-color」を灰色に変更している。
	
	�A各セルの右と底のボーダー消去
	賢威８では「thead」の「ｔｈ」セルの右と底に焦げ茶色のボーダーを指定しているようで、
	右と底のボーダーを消去。
	
	
------------------------------------------*/

table.C_table-style2 thead th{
	color: #505050;								/*   �@の対応		*/
	background-color: #e0e0e0 !important;		/*   �@の対応		*/


	border-bottom-style: none !important;		/*   �Aの対応		*/
	border-right-style: none !important;		/*   �Aの対応		*/


}



/*-----------------------------------------
	
	【「tbody」の対応】

	・賢威８テンプレート上でテーブルを作成すると「tbody」の「ｔｈ」セルは特定の背景色（薄灰色）になるので、
	「background-color」を灰色に変更している。
	
	■注意
	・テーブルの１行ごとに「bg-color-half-clear-orange5」クラスを使って背景色を薄肌色にするので、
	こちらのソースに「 !important」を付けないこと。付けてしまうと薄肌色指定が無効になる。
	
------------------------------------------*/

table.C_table-style2 tbody th{
	background-color:  #fff ; /*　	*/
}



/*======= ▲END　★☆★独自の装飾テーブル用★☆★ ======================================*/




	
/*=======================================================================

	★☆★リスト関係★☆★


========================================================================*/


/*----------------------------------------------------

	
	■対象要素
	「ul-li」、「ol-li」、「dl-dt/dd」
		※リスト関係要素を使う時は、必ず当クラスを指定すること！
	
	■指定位置
	親側要素（ul,ol,dl）のプロパティとして指定
	
	
	■追加理由
	・親テーマの「none」だと、
		親側要素（ul,ol,dl）の上下に必要以上の余白ができるために「margin: 0」に変更
		子側要素(li）の下に必要以上の余白ができるために、「margin: 0」を追加
		※　子側要素の「dt」、「dd」には、新たにmarginを指定しなくても必要以上の
			余白ができないので、特に指定しておらず。
	
	参考：親テーマの「none」クラスは、上下のマージンが付く
			.none{
				margin: 1em 0; padding: 0;
			}

			.none li{
				list-style-type: none;
			}
		

------------------------------------------------------*/
.C_none{
	margin: 0; padding: 0;
}

.C_none li{
	list-style-type: none;
	margin:0;
}



/*----------------------------------------------------

	
	■対象要素
	「ul-li」、「ol-li」
	
	
	■指定位置
	入れ子の親側要素（ul,ol）のプロパティとして指定
	
	
	■追加理由
	・リスト関係の入れ子の文章は、1文字分の桁を下げるレイアウトにしたいため。
	・「ul-li」、「ol-li」の中で入れ子の「ul-li」、「ol-li」は外側のリストと同じ桁になる。
	・そのため、入れ子側の「ul」「ol」要素に当クラスを指定して、１桁分を下げる。
	
	
	■備考
	・「dl-dt/dd」のデフォルトでは、「dd」は「dt」から１文字分の桁が下がる。
		よって、「dl-dt/dd」の入れ子として「ul-li」又は「ol-li」を使う場合は、当クラスを指定する必要なし。
	・一方、「ul-li」又は「ol-li」の入れ子として「dl-dt/dd」を使う場合は、当クラスを指定する必要あり。
	・本文と注釈文では、文字幅が違うため「px」でなく「1rem」を使用
	・上記の「C_none」クラス（margin-lert:0)と一緒に指定することになり
		競合してしまうため、当クラスに「!important」を指定している。
	

------------------------------------------------------*/


.C_m1rem-l{
	margin-left: 1rem !important;
}









/*======END ★☆★リスト関係★☆★=================================================*/





/*◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆

	★☆★リスタグのマーク★☆★
	
	・「span」タグで囲んだ文章の先頭にマークを付けるためのクラス
	・なお、「p」タグのようにブロックレベルで囲むと、マークはpadding上に表示されるので、
		文章が改行した時もpaddingのサイズ分の字下げが発生してしまうので注意！
	
◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆*/
	
/*=======================================================================

	■本文用


========================================================================*/

/*----------------------------------------------------

	茶色四角のマーク	

------------------------------------------------------*/

/*---茶色マーク	（本文のリスト用）---*/

.C_mark-body-a-1 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/brown-20x20.gif)  no-repeat;
	background-size: 12px 12px;
	background-position:  0px 4px;	/*	左上端を基準に、横と縦の相対位置	*/
}

.C_mark-body-a-2 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/brown-20x20.gif)  no-repeat;
	background-size: 10px 10px;
	background-position:  1px 5px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-a-3 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/brown-20x20.gif)  no-repeat;
	background-size: 8px 8px;
	background-position:  2px 6px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-a-4 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/brown-20x20.gif)  no-repeat;
	background-size: 6px 6px;
	background-position:  3px 7px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-a-5 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/brown-20x20.gif)  no-repeat;
	background-size: 4px 4px;
	background-position:  4px 8px;	/*	左上端を基準に、横と縦の相対位置	*/
}


/*----------------------------------------------------

	青色四角のマーク	

------------------------------------------------------*/


.C_mark-body-b-1 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/dark-blue-20x20.gif)  no-repeat;
	background-size: 12px 12px;
	background-position:  0px 4px;	/*	左上端を基準に、横と縦の相対位置	*/
}

.C_mark-body-b-2 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/dark-blue-20x20.gif)  no-repeat;
	background-size: 10px 10px;
	background-position:  1px 5px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-b-3 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/dark-blue-20x20.gif)  no-repeat;
	background-size: 8px 8px;
	background-position:  2px 6px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-b-4 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/dark-blue-20x20.gif)  no-repeat;
	background-size: 6px 6px;
	background-position:  3px 7px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-b-5 {
	padding-left: 16px;		/*	茶色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/dark-blue-20x20.gif)  no-repeat;
	background-size: 4px 4px;
	background-position:  4px 8px;	/*	左上端を基準に、横と縦の相対位置	*/
}



/*----------------------------------------------------

	黒色四角のマーク	

------------------------------------------------------*/

.C_mark-body-c-1 {
	padding-left: 16px;		/*	黒色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/black-20x20.gif)  no-repeat;
	background-size: 12px 12px;
	background-position:  0px 4px;	/*	左上端を基準に、横と縦の相対位置	*/
}

.C_mark-body-c-2 {
	padding-left: 16px;		/*	黒色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/black-20x20.gif)  no-repeat;
	background-size: 10px 10px;
	background-position:  1px 5px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-c-3 {
	padding-left: 16px;		/*	黒色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/black-20x20.gif)  no-repeat;
	background-size: 8px 8px;
	background-position:  2px 6px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-c-4 {
	padding-left: 16px;		/*	黒色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/black-20x20.gif)  no-repeat;
	background-size: 6px 6px;
	background-position:  3px 7px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-body-c-5 {
	padding-left: 16px;		/*	黒色四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/black-20x20.gif)  no-repeat;
	background-size: 4px 4px;
	background-position:  4px 8px;	/*	左上端を基準に、横と縦の相対位置	*/
}




	
/*=======================================================================

	■注釈用


========================================================================*/

/*----------------------------------------------------

	黄土色四角のマーク	

------------------------------------------------------*/

.C_mark-notes-1 {
	padding-left: 16px;		/*	黄土四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/ocher-20x20.gif)  no-repeat;
	background-size: 10px 10px;
	background-position:  1px 3px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-notes-2 {
	padding-left: 16px;		/*	黄土四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/ocher-20x20.gif)  no-repeat;
	background-size: 8px 8px;
	background-position:  2px 4px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-notes-3 {
	padding-left: 16px;		/*	黄土四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/ocher-20x20.gif)  no-repeat;
	background-size: 6px 6px;
	background-position:  3px 5px;	/*	左上端を基準に、横と縦の相対位置	*/
}


.C_mark-notes-4 {
	padding-left: 16px;		/*	黄土四角の画像　＋　全角空白１個分	*/
	background: url(./images/icon/square/ocher-20x20.gif)  no-repeat;
	background-size: 4px 4px;
	background-position:  4px 6px;	/*	左上端を基準に、横と縦の相対位置	*/
}


/*----------------------------------------------------

	■数字のマーク	


	段落の最初文章orタイトルの先頭に使用

	・インラインレベルの要素で使うこと。ブロックレベルの要素で使うと文字との高さが合わない。
	
	・また、「p」タグのようにブロックレベルで囲むと、マークはpadding上に表示されるので、
		文章が改行した時もpaddingのサイズ分の字下げが発生してしまうので注意！

	・なお、「padding-lest」に「1rem」を使うと、画像の領域の幅が１文字より狭くなり、
	それに続く文字との間隔が狭くなったが、「1em」だと１文字分の幅が確保されたので「1em」にした。
	
------------------------------------------------------*/

/*---茶色の「０」〜「９」---*/


.C_brown0 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown0.gif) no-repeat;   /*		*/

}

.C_brown1 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown1.gif) left 3px no-repeat;   /*		*/

}

.C_brown2 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown2.gif) left 3px no-repeat;   /*		*/

}

.C_brown3 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown3.gif) left 3px no-repeat;   /*		*/

}

.C_brown4 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown4.gif) left 3px no-repeat;   /*		*/

}

.C_brown5 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown5.gif) left 3px no-repeat;   /*		*/

}

.C_brown6 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown6.gif) left 3px no-repeat;   /*		*/

}

.C_brown7 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown7.gif) left 3px no-repeat;   /*		*/

}

.C_brown8 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown8.gif) left 3px no-repeat;   /*		*/

}

.C_brown9 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/brown9.gif) left 3px no-repeat;   /*		*/

}



/*---青色の「０」〜「９」---*/

.C_blue0 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue0.gif) left 3px no-repeat;   /*	*/

}


.C_blue1 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue1.gif) left 3px no-repeat;   /*		*/

}

.C_blue2 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue2.gif) left 3px no-repeat;   /*		*/

}

.C_blue3 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue3.gif) left 3px no-repeat;   /*		*/

}

.C_blue4 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue4.gif) left 3px no-repeat;   /*		*/

}

.C_blue5 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue5.gif) left 3px no-repeat;   /*		*/

}

.C_blue6 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue6.gif) left 3px no-repeat;   /*		*/

}

.C_blue7 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue7.gif) left 3px no-repeat;   /*		*/

}

.C_blue8 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue8.gif) left 3px no-repeat;   /*		*/

}

.C_blue9 {
	padding-left: 1em;			/*	数字イメージの領域分を確保	*/
	background: url(./images/icon/number/blue9.gif) left 3px no-repeat;   /*		*/

}








/*◆◆◆　　END ★☆★リスタグのマーク★☆★　　◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆*/


















/*★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆

	■メディアクエリ
	
	・デバイスの横幅によるＣＳＳの切り分け
	
	【参考】賢威８の親テーマ「base.css」では、次の順序で記述されていたが、
	ベースを４８０ｐｘ未満とし、デバイスの横幅が
	ある一定以上のものに異なる設定する形である。
		・指定なし
		・４８０ｐｘ以上
		・７６８ｐｘ以上
		・９２０ｐｘ以上
		・１２００ｐｘ以上
	※各メディアクエリで同じＣＳＳがあれば、ＣＳＳは後の記述が適用される。
	よって、「min-width」(以上)を使っているのだろう。
	※参考までに、親テーマ「advanced.css」では、７６８ｐｘ以上のみがある。

	
	しかし、ベースを最も横幅の小さいものにするとに慣れていないため、
	この子テーマ内では画面の横幅が十分大きいＰＣ表示をベースにし、
	デバイスの横幅がある一定以下のものに異なる設定する形である。
	※各メディアクエリで同じＣＳＳがあれば、ＣＳＳは後の記述が適用される。
	
★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆*/

/*========================================================

	１２００ｐｘ未満
	
	【注意】賢威８WP版で次の指定をしても反映しなかかった？
		@media (width < 1200px){

========================================================*/
@media (max-width : 1199px){




}	/*====== END 「１２００ｐｘ未満」	======*/



/*========================================================

	９２０ｐｘ未満
	
	【注意】賢威８WP版で次の指定をしても反映しなかかった？
		@media (width < 920px){

========================================================*/
@media (max-width : 919px){

/*----------------------------------------------------
	回り込み解除及び画像のセンタリング
------------------------------------------------------*/
.C_left{
	float:none;		/*　回り込み解除	*/
/*	display: block;	*/

	text-align: center;		/*　画像をセンタリング	*/
/*	margin: 0 0 1em 0;		/*	*/
}

.C_right{
	float:none;		/*　回り込み解除	*/
/*	display: block;	*/
	text-align: center;		/*　画像をセンタリング	*/
/*	margin: 0 0 1em 0;		/*	*/
}









}	/*====== END 「９２０ｐｘ未満」	======*/


/*========================================================

	７６８ｐｘ未満
	

========================================================*/
@media (max-width : 767px){

/*	スクロールバー表示テーブルに於いてスマートフォン時のコメントの文字色を指定			*/
.table-scroll::before{
/*	content: "※横スクロールできます。" !important;		/*	文面も変更しようとしたが、文字化けしたので（IEだけでなくChromeでも発生）、コメントアウト		*/
	color: #7F5944;		/*	焦げ茶色：当初「黄昏への道」の見出し色に合わせて「#5a3f30」にしたが茶色が目立たなっかので、もう少し明るみを帯びた色に変えた	*/
}





}	/*====== END 「７６８ｐｘ未満」	======*/


/*========================================================

	４８０ｐｘ未満
	
	【注意】賢威８WP版で次の指定をしても反映しなかかった？
		@media (width < 480px){

========================================================*/
@media (max-width : 479px){

/*-------------------------	
	賢威のデフォルトに於いて、
	一覧ページ（トップ、カテゴリー、アーカイブ、検索）の
	アイキャッチ画像が左に寄るので中央に変更した。

	【注意】
	　画像のズームアップ関係で、次のようにimg要素をブロックレベルにしていので、
		text-alignのセンタリングができない。

		.entry_thumb img {
		  display: block;
		  transition-duration: 1s; 	 
		 }

	　そのため、当初は次のようにセンタリングしようとしたが、
	　センタリングできなかった。
	
		div.entry figure.entry_thumb {
			text-align: center !important;
		}

	なお、採用した記述で画像がセンタリングしたことから、次のことが言える。
	画像の親要素figureがブロックレベルでありながら横幅一杯に広がっていなく、
	おそらくfigure要素の横幅は画像サイズしかないと思われる。
	そのため、ブロックレベルのfigure要素をセンタリングする採用記述で
	figure要素が中央に移動し、その子要素の画像も中央に移動したと思われる。
	
	
--------------------------*/
div.entry figure.entry_thumb {
	margin: 0 auto !important;
}







}	/*====== END 「４８０ｐｘ未満」	======*/


/*★☆★　　END メディアクエリ　　☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆*/