@charset "utf-8";

article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
	display:block;
}
/* リセットCSS */
*{
    /* padding と border の幅を要素の幅と高さに含める */
    box-sizing: border-box;
}

/* 英語フォントを日本語フォントに（...→… など）するお膳立て */
/* 「:lang=ja」 にすると関係ないspan要素もすべて日本語フォントになってしまうため */
span.ja{
	font-family: 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
}

BODY{
	margin: 5% 8% 2%;
	color: #333; /* 茶色がかった灰色：#5F5648 */
	background-color: #FFF;
	line-height: 1.8;
	font-size: 88%; /* 88%でブラウザ16px指定で14px相当 */
	font-family: 'Lucida Grande', 'Segoe UI', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
	}
::selection{ /* テキスト選択時 */
	background: #333; /* #e9745a 紅扇貝色 */
	color: #FFF;
}

A { text-decoration: none; overflow: hidden; outline: none; }
A:link { color: #d54b44; } /*  #d54b44 榴花红 */
A:visited { color: #973444; } /* #973444 玫瑰紅 */
A:active { color: #F5A31F; }
A:hover{ color: #F5A31F; transition: .1s } /* #F5A31F 鵝黄 */

/* ---Color Palette---
 [fristBlue] L: Blue, V: Indigo, A: Orange, H: SkyBlue
 [firstPink] L: #CD5C5C IndianRed, V: #8B0000 DarkRed, A: #ffd700 Gold, H: #ffa07a LightSalmon
 [Pink] L: #E45252 Flamingo, V: #b20008 FreeSpeechRed, A: #ffd700 Gold, H: #ffa07a LightSalmon TexSel: #e35050 Flamingo
 [Orange] L: #e67e22, V: #bf360c, A,H: #fdc44f
 [Flat Red] L: #e74c3c Alizarin, V: #c0392b Pomegranate, A,H: #f39c12 Orange
 [Chinese Blue] L: #3A89B0 毛月色, V: #17507d 海蓝, A,H: #b5c1cf 银蓝
 [Chinese Pink] L: #d54b44 榴花红, V: #973444 玫瑰紅, A,H: #F5A31F 鵝黄 TexSel: #e9745a 紅扇貝色
*/

IMG{ margin: 0.15em 0; }
A:link img, A:visited img, A:active img, A:hover img { border: 0; }
A img{ opacity: 1; transition: .2s; }
A:hover img{ opacity: 0.8; }

/* 別窓アイコン */
.blank:after{content:url(../top/blank.gif);width:10px;height:10px;}

/* ページ構成 */
#headnav{ text-align: left; margin-bottom: 3em; }
#footnav{ text-align: right; margin-top: 3em; }
#main{ margin-bottom: 3%; } /* 中身（外ボックス） */
#contents{ margin-bottom: 4em; } /* 中身（内ボックス） */
#title{ text-align: center; margin-bottom: 2em; } /* ページタイトル */
#analyzer{ text-align: right; }

/* 各メニューページ用 */
.block{ margin-bottom: 5em; } /* 節 */
.block2{ margin-bottom: 2em; } /* 節（改行少）*/
.summary{ margin-left: 1em; margin-bottom: 2em; } /* あらすじなど */
.section{ margin-left: 1em; } /* 小節のタイトル */
.box{ margin-bottom: 2em; margin-left: 1em; } /* 小節 */

UL, LI{ margin: 0; }

/* フォント */
.font1{ font-size: 86%; } /* 12px */
.font2{ font-size: 100%; } /* 14px */
.font3{ font-size: 114%; } /* 16px */
.font4{ font-size: 128%; } /* 18px */
.font7{ font-size: 171%; }
.bold{ font-weight: bold; }
.underline{ text-decoration:underline; }
.strike{ text-decoration: line-through; }

/* 位置指定 */
.left{ text-align: left; }
.center{ text-align: center; }
.right{ text-align: right; }

/* テーブル枠を細線化 */
.table {
	border-collapse: collapse; /* 枠線の表示方法 */
	border: 1px #808080 solid; /* テーブル全体の枠線（太さ・色・スタイル）*/
	} /* 枠幅は個別に指定すること */
.table TD,TH {
	border: 1px #808080 solid; /* セルの枠線（太さ・色・スタイル）*/
	padding: 5px; /* セル内の余白 */
	}

/* テーブルのセンタリング */
.ctable{ text-align:center; margin: 4em 0em; }
.ctable .table{ margin-left:auto; margin-right:auto; text-align: left; }

/* 区切り線 */
HR{
	border-width: 1px 0 0;
	border-style: solid;
	border-color: #666;
	height: 1px;
	width: 100%;
	}

/* リスト */
UL{ list-style: none; padding: 0; }
LI{ margin-left: 1em; }
/* 定義リスト */
DL{ margin-bottom: 1em; }
DT{ font-weight: normal; }
DD{ margin-left: 1em; }

/* 上下センタリング */
.ub_centering{
	display: table-cell;
	vertical-align: middle;
	margin: 0;
	padding: 0;
}

/* アイコンフォント */
@font-face {
	font-family: 'H&S iconfont';
	src:url('../font/hs_iconfont/hs_iconfont.eot');
	src:url('../font/hs_iconfont/hs_iconfont.eot?#iefix') format('embedded-opentype'),
		url('../font/hs_iconfont/hs_iconfont.ttf') format('truetype'),
		url('../font/hs_iconfont/hs_iconfont.woff') format('woff'),
		url('../font/hs_iconfont/hs_iconfont.svg#hs_iconfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* 引用 */
blockquote{
	background-color: #eee;
	margin: 1.5em;
	padding: 1em 2em;
	position: relative;
	z-index: 1;
}
blockquote p{
	position: relative;
	z-index: 3;
}
blockquote:before{
	content: "“"; 
	font-size: 400%;
	font-family: 'H&S iconfont', sans-serif;
	line-height: 1;
	font-weight: normal;
	color: #ddd;
	position: absolute;
	 left: 5px;
	 top: 5px;
	z-index: 2;
  }
blockquote:after{
	content: "”";
	font-size: 400%;
	font-family: 'H&S iconfont', sans-serif;
	line-height: 1;
	color: #ddd;
	position: absolute;
	 right: 5px;
	 bottom: 5px;
	z-index: 2;
	}