/***************************************************************************************************


	☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★
	
		『マス・メロディー』のスタイルシート
	
	☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★


	【説明】
	◆コンテナの横幅：1200px
	◆ベータブロックを0pxまで縮小させた２カラムの形式


	【最終更新日】2015年11月20日


***************************************************************************************************/



/***************************************************************************************************

		メインフレームのスタイル定義

***************************************************************************************************/

body {
	margin: 0px;
	padding: 0px;
	text-align: center;

	background-color: #9ef0fe;
	background-image:url("../material/base/body_bg1.jpg");
	background-repeat: repeat-x;
	background-attachment: fixed;
	font-family: "メイリオ", "Meiryo", arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}


/**********　ここでブロックを初期化　**********/
div {
	margin: 0px;
	padding: 0px;
	text-align: left;
}


div#container {
	/*border: solid #FF0000 1px;*/
	margin: 0 auto;
	width: 1200px;


	/* サイドの背景の定義 */
	background-image:url("../material/base/container_bg1.gif");
	background-repeat: repeat-y;
	background-position: top left;
	background-color: #FFFFFF;
}


div#top_block1 {
	width: 1200px;
	height: 20px;
	margin: 0 auto;

	background-image:url("../material/base/top_block1_bg1.gif");
	background-position: center top;
	background-repeat: no-repeat;
}

div#top_block2 {
	/*border: solid black 1px;*/
	width: 1200px;
	height: 150px;
	margin: 0 auto;

	background-image:url("../material/base/top_block2_bg1.gif");
	background-position: center top;
	background-repeat: no-repeat;
}

div#top_block3 {
	/*border: solid black 1px;*/
	width: 1200px;
	height: 30px;
	margin: 0 auto;

	background-image:url("../material/base/top_block3_bg1.gif");
	background-position: center top;
	background-repeat: no-repeat;
}



div#tray1 {
	/*border: solid #00FF00 1px;*/

	width: 1200px;
	background-image:url("../material/base/tray_bg1.gif");
	background-repeat: no-repeat;
	background-position: top left;
}


div#wrapper1 {
	/* サイドの背景の定義 */
	/*border: solid #FF00FF 1px;*/
	width: 950px;
	float: right;

	background-image:url("../material/base/wrapper_bg1.gif");
	background-repeat: repeat-y;
	background-position: top left;
}


div#alpha_block1 {
	width: 950px;

	float: left;
	/*display: inline;*/
	background-color: #FFFFFF;
}


div#beta_block1 {
	/*border: solid #0000FF 1px;*/
	/*　widthもdisplayも記述しない　*/
	float: right;
}


div#gamma_block1 {
	width: 250px;
	float: left;
/*
	background-image:url("../material/base/gamma_block1_bg1.gif");
	background-repeat: no-repeat;
	background-position: top left;
*/
}

div#tray1_bottom1 {
	clear: both; /*　←必須！これが無いとtrayが包含するブロックとして機能しない　*/

}


div#bottom_block1 {
	width: 1200px;
	height: 100px;
	margin-left: auto;
	margin-right: auto;

	clear: both;

	background-image:url("../material/base/bottom_block1_bg1.gif");
	background-repeat: no-repeat;
}



/***************************************************************************************************

		メインコンテンツのスタイル定義

***************************************************************************************************/

/*　▼▼▼▼▼　見出しのスタイル定義　▼▼▼▼▼　*/

h1.main_text {
	border: double #0000DD 5px;
	margin-top: 50px;
	margin-bottom: 10px;
	margin-left: 70px;
	margin-right: 70px;
	padding: 10px 20px;
	font-size: 120%;
	line-height: 1.5;
	color: #3333AA;
	font-weight: normal;
}

h2.main_text {
	margin-top: 15px;
	margin-bottom: 10px;
	margin-left: 90px;
	margin-right: 90px;
	padding: 5px;
	border-left: none;
	border-bottom: dotted #3377CC 2px;
	border-top: none;
	border-right: none;
	font-size: 110%;
	color: #000077;
	text-align: left;
	line-height: 1.5;
	font-weight: normal;
}

h3.main_text {
	border-left: solid #0000AA 10px;
	margin-top: 10px;
	margin-bottom: 0px;
	margin-left: 110px;
	margin-right: 110px;
	padding: 5px 10px;
	font-size: 100%;
	background-color: #F1F5D4;
	color: #000077;
	text-align: left;
	line-height: 1.3;
	font-weight: normal;
}

.main_img {
	text-align: center;
	margin: 0px;
	padding: 0px;
}
/*　▲▲▲▲▲　見出しのスタイル定義　▲▲▲▲▲　*/



/*　▼▼▼▼▼　基本タグのスタイル定義　▼▼▼▼▼　*/
p {
	/*border: solid blue 1px;*/
	margin-left: 130px;
	margin-right: 130px;
	padding: 0px;
	font-size: 100%;
	line-height: 2.0;
	text-indent: 0em;
}

img {
	border: 0px;
	margin: 0 auto;
	padding: 0px;
	display: block;
}

strong {
	color: #0000CC;
	font-weight: normal;
}

b {
	color: #FF0055;
	font-weight: normal;
}

em {
	color: #007700;
	font-weight: normal;
}

hr {
	margin-left: 50px;
	margin-right: 50px;
}

/**********　リスト　**********/
ol {
	margin-left: 120px;
	margin-right: 100px;
	font-size: 90%;
	line-height: 1.5;
}

ul {
	margin-left: 120px;
	margin-right: 100px;
	font-size: 90%;
	line-height: 1.5;
}

li {
	margin: 10px;
	padding: 0px;
}

/**********　テーブル　**********/
table {
	margin: 10px auto;
	border: solid #000077 2px;
	border-collapse: collapse;
	font-size: 90%;
	line-height: 1.5;
}

th {
	border: solid #000077 1px;
	padding: 5px 20px;
	background-color: #EEFFEE;
	background-image:url("../material/parts/check_bg_blue.gif");
	text-align: center;
	color: #000077;
}

td {
	border: solid #000077 1px;
	padding: 5px 20px;
	color: #000000;
	text-align: left;
}

/**********　アンカーテキスト　**********/
a:link {
	color: #000077;
	text-decoration: none;
}

a:visited {
	color: #000077;
	text-decoration: none;
}

a:hover {
	color: #3333AA;
	text-decoration: underline;
}

/**********　引用　**********/
blockquote {
	border: solid #0077AA 2px;
	width: 600px;
	margin: 30px auto;
	background-color: #E0FAFF;
}

.quote {
	margin-left: 30px;
	margin-right: 30px;
	text-indent: 0em;
	font-size: 85%;
}

/**********　整形済みテキスト　**********/
pre {
	overflow: scroll;
	width: 600px;
	margin: 30px auto;
	padding: 15px;
	background-color: #EAEDE5;
	font-size: 15px;
}

code {
	margin: 10px;
}

/**********　用語の定義　**********/
dl {
	/*border: solid blue 1px;*/
	margin: 20px 150px;
}

dt {
	/*border: solid red 1px;*/
	margin-top: 10px;
	margin-bottom: 10px;
	font-weight: bold;
	color: #000077;
}

dd {
	/*border: solid green 1px;*/
	margin-top: 10px;
	margin-bottom: 30px;
	font-size: 80%;
	line-height: 1.7;
}
/*　▲▲▲▲▲　基本タグのスタイル定義　▲▲▲▲▲　*/





/*　▼▼▼▼▼　その他表現のための汎用クラス定義　▼▼▼▼▼　*/
.layout {
	margin: 0 auto;
	padding: 0px;
	border: none;
	background-color: transparent;
}

span.u {
	text-decoration: underline;
}

span.my {
	background-color: yellow;
}

img.float_left {
	display: inline;
	float: left;
	margin: 0px 20px 20px 0px;
}

img.float_right {
	display: inline;
	float: right;
	margin: 0px 0px 20px 20px;
}

p.plist {
	/*border: solid red 1px;*/
	padding-left: 30px;
	text-indent: 0em;
	background-image:url('../material/parts/plist.gif');
	background-repeat: no-repeat;
	background-position: top left;
}

/* margin-topのスペース */
.mtspace {
	margin-top: 70px;
}

/*　▲▲▲▲▲　その他表現のための汎用クラス定義　▲▲▲▲▲　*/


/***************************************************************************************************

	トップメニューのスタイル定義

***************************************************************************************************/

ul.top_menu {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	text-align: left;
}

li.top_menu {
	margin: 0px;
	padding: 0px;
	float: left;
}

img.top_menu {
	margin: 0px;
	padding: 0px;
}




/***************************************************************************************************

	メインコンテンツ・ボトム・ボタン（Main_Contents_Bottom_Button）のスタイル定義

***************************************************************************************************/

table.main_bottom_btn {
	margin: 100px auto;
	padding: 0px;
	border: none
}

td.main_bottom_btn {
	margin: 0px;
	padding: 0px;
	border: none;
}



/***************************************************************************************************

	メインコンテンツ・ボトム（Main_Contents_Bottom）のスタイル定義

***************************************************************************************************/

h2.main_bottom {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 20px;
	margin-right: 20px;
	padding: 0px;
	font-size: 80%;
	line-height: 1.1;
	color: #FF8800;
}

h3.main_bottom {
	/*border: solid red 1px;*/
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 20px;
	margin-right: 0px;
	padding: 0px;
	font-size: 80%;
	line-height: 1.1;
	color: #FF8833;
	float: left;
	display: inline; /*　←IE6 floatでmarginが倍になるバグ対策用　*/
}

p.main_bottom {
	margin-top: 0px;
	margin-bottom: 5px;
	margin-left: 20px;
	margin-right: 20px;
	padding: 0px;
	font-size: 80%;
	line-height: 1.1;
	color: #FF9922;
	text-indent: 0em;
}

hr.main_bottom {
	margin-top: 100px;
	margin-left: 20px;
	margin-right: 20px;
	clear: both;
}




/***************************************************************************************************

		サイドメニュー（Side_Menu）のスタイル定義

***************************************************************************************************/

h1.side_menu {
	border: double white 5px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 3px;
	font-size: 15px;
	text-align: center;
	color: #0000AA;
}

h2.side_menu {
	border: double white 3px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 3px;
	font-size: 15px;
	text-align: center;
	color: #0000AA;
}


ul.side_menu {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	text-align: center;
}

li.side_menu {
	border: solid white 1px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 3px;
	font-size: 15px;
}

a.side_menu:link {
	color: #000077;
	text-decoration: none;
}

a.side_menu:visited {
	color: #000077;
	text-decoration: none;
}

a.side_menu:hover {
	color: #3333AA;
	text-decoration: underline;
}


img.side_menu {
	display: inline; /*　←　IE6のバグ対策。blockにすると改行が入ってしまうバグ*/
}


/***************************************************************************************************

		サイド・メニュー・ボトム（Side_Menu_Bottom）のスタイル定義

***************************************************************************************************/

hr.side_menu_bottom {
	margin-left: 10px;
	margin-right: 10px;
	padding: 0px;
}

h2.side_menu_bottom {
	width: 180px;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 0px;
	color: #FF6600;
	font-size: 11px;
	line-height: 1.2;
	font-family: Verdana, 'ＭＳ Ｐゴシック', sans-serif;/*　←IE8でutf-8にすると微妙に文字が大きくなる場合の対処　*/
}

h3.side_menu_bottom {
	width: 180px;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 0px;
	color: #FF6600;
	font-size: 11px;
	line-height: 1.2;
	font-family: Verdana, 'ＭＳ Ｐゴシック', sans-serif;/*　←IE8でutf-8にすると微妙に文字が大きくなる場合の対処　*/
}

p.side_menu_bottom {
	width: 180px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 0px;
	text-align: left;
	text-indent: 0em;
	color: #FF6600;
	font-size: 11px;
	line-height: 1.2;
	font-family: Verdana, 'ＭＳ Ｐゴシック', sans-serif;/*　←IE8でutf-8にすると微妙に文字が大きくなる場合の対処　*/
}

a.side_menu_bottom:link {
	text-align: left;
	color: #FF6600;
	text-decoration: none;
}

a.side_menu_bottom:visited {
	text-align: left;
	color: #FF6600;
	text-decoration: none;
}
a.side_menu_bottom:hover {
	text-align: left;
	color: #FF6600;
	text-decoration: none;
}

/***************************************************************************************************

	サイドメニュー下のW3C Validationのスタイル定義

***************************************************************************************************/

hr.w3c_validation {
	margin-left: 10px;
	margin-right: 10px;
	padding: 0px;
}

p.w3c_validation {
	margin: 3px;
	padding: 0px;
	text-align: center;
}

a.w3c_validation {

}

img.w3c_validation {
	display: block;
	margin: 0 auto;
}


/***************************************************************************************************

	インデックス【１】（Index1）のスタイル定義

***************************************************************************************************/

div.index1 {
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 130px;
	margin-right: 130px;
	border-top: solid #CCCCCC 1px;
	border-left: solid #CCCCCC 1px;
	border-bottom: solid #BBBBBB 2px;
	border-right: solid #BBBBBB 2px;
	/*background-image:url("../material/parts//p_index_bg1.gif");*/
	background-repeat: repeat-y;
}

p.index1 {
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 30px;
	margin-right: 30px;
	font-size: 16px;
	font-weight: normal;
	line-height: 1.5;
	text-indent: 0em;
}

p.index1_comment {
	margin-top: 0px;
	margin-bottom: 10px;
	margin-left: 50px;
	margin-right: 30px;
	font-size: 12px;
	font-weight: normal;
	line-height: 1.5;
	text-indent: 0em;
}

a.index1:link {
	color: #0000AA;
}

a.index1:visited {
	color: #0000AA;
}

a.index1:hover {
	color: #0000FF;
}


/***************************************************************************************************

	問題のスタイル定義

***************************************************************************************************/

div.q {
	margin: 30px auto;
	width: 750px;
}

.level1 {
	border:double #00CCFF 5px;
	color: #0077CC;
}
.level2 {
	border:double #0000FF 5px;
	color: #0000AA;
}
.level3 {
	border:double #AA00FF 5px;
	color: #7700CC;
}
.level4 {
	border:double #FF00AA 5px;
	color: #AA0055;
}

h1.q {
	margin-left: 30px;
	margin-right: 30px;
	font-size: 110%;
	text-decoration: underline;
	font-weight: normal;
}

p.q {
	margin-left: 35px;
	margin-right: 35px;
	color: #000000;
}

/*　問題の出典など　*/
.source {
	text-align: right;
}

p.btn_ans {
	text-align: center;
}



/***************************************************************************************************

	Ｎｏｔｅ１のスタイル定義

***************************************************************************************************/

div.note1 {
	margin: 20px auto;
	width: 700px;
	border: ridge #FFFF77 3px;
	background-image:url("../material/parts/check_bg_yellow.gif");
}

p.note1 {
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 30px;
	margin-right: 30px;
	text-indent: 0em;
	font-size: 100%;
}

/***************************************************************************************************

	「鉄則」ブロック

***************************************************************************************************/

div.tessoku {
	margin: 20px auto;
	width: 700px;
	border: ridge #FF3377 3px;
	background-image:url("../material/parts/check_bg_pink.gif");
}

p.tessoku {
	color: #FF0055;
	margin-left: 35px;
	margin-right: 35px;
}

