/* 北海道大学情報処理１実習用サンプルスタイルシート メールフォーム用　*/
/* 各自、自分のページのデザインのために改造して使うこと！　　　　　　 */
/* このスタイルシートに関する質問などは→　今野 滋 sk@ec.hokudai.ac.jp */

body{					/* 本文全体に関するデザイン */
	background-color:white;		/* 背景色は白 */
	color:#348;			/* 文字色はパステル調の青 */
	margin:0px 1em;			/* 上下の余白(境界の外側)は0ポイント、左右の余白は１文字分 */
	background-image : url(./img/ninjin.gif);
	}
a{text-decoration: none;}		/* リンクのデザインで、下線などの飾りを消去 */
a:link  {color:#66f; }			/* 未訪問リンクのデザイン */
a:visited {color:#f69;}			/* 既訪問リンクのデザイン */
a:hover {				/* ポインターをかざしたときのリンクのデザイン */
	color:#0c0;
	background-color:#ffa;
	}
a:active {				/* クリックしている間のリンクのデザイン */
	color:#f93;
	background-color:white;
	margin:auto auto auto -0.2em;}
h1{	
	font-family: "ヒラギノ丸ゴ Pro w4", Osaka, "ＭＳ ゴシック", sans-serif;
	font-size:2em;
	background-color:#fed;
	text-align:center;
	width:80%;
	border:dashed 1px orange;
	margin:0.5em auto 0.5em 10%;
	padding:0.5em;
	color:#68f
	}

form { margin: 0; }					/* フォームの余白ゼロ */
input , textarea , select {				/* 文字入力欄デザイン */
	margin: 0;
	font-size: 100%;				/* 文字入力欄の文字サイズ普通 */
	vertical-align: middle;
	color:#348;
	max-width:90%;					/* ウインドウからはみ出さないように最大幅を設定 */
	background-color:#fbf9f1;
	}
textarea{
	background-image:url('./img/textarea.gif');
	}

p{					/* フレーズ基本型 */
	margin:0em;			/* 境界外側の余白ゼロ */
	padding:0.2em 0em;		/* 境界内側の余白：上下に0.2文字分、左右にゼロ */
	}

#footer{				/* ページ末尾表示用 */
	color:gray;
	text-align:right;
	}

div.w9{					/* 幅90%中央寄せ（MSIE の場合は中央に寄らない） */
	width:90%;
	margin-left:5%;
	margin-right:auto;
	text-align:left;
	}
.hr{					/* 横線。<div class="hr"></div>で横線。下線としても使える */
	clear:both;			/* float 設定を解除します */
	border-bottom:dotted 1px silver;
	}
.hidden{				/* 隠す。スタイルシートの機能をオフにすると、隠していたものが現れます。 */
	visibility:hidden;
	margin:0em;
	display:none;			/* 非表示display:none;と、見えなくするvisibility:hidden;は、どちらか一方だけでも効果があります */
	}

.dd3{margin:auto auto auto 3em;}		/* 　　　右に３文字分空かす */

.leftfloat{
	width:16%;
	float:left;
	text-align:right;
	}

.mc{margin-left:20%;}

/* ▼文字割付 */
.right{text-align:right;}			/* 　　　　　　　　右寄せ */
.center{
	margin-left:auto;
	margin-right:auto;
	text-align:center;			/* 　　　　中央寄せ　　　　 */
	}
.left{text-align:left;}				/* 左寄せ　　　　　　　　 */

/* ▼回り込み */
.fleft{float:left;}				/* 後続を右に回り込ませる */
.fright{float:right;}				/* 後続を左に回り込ませる */
.nofloat{clear:both;}				/* 回り込み解除 */

/* ▼文字サイズ */
.huge{font-size:2em;}
.large{font-size:1.3em;}
.small{font-size:0.8em;}
.tiny{font-size:0.5em;}

/* ▼文字飾り*/
.bold{font-weight:bold;}

/* ▼背景色 */
.bgcr{background-color:#fee;}		/* 赤 */
.bgcy{background-color:#ffe;}		/* 黄 */
.bgcg{background-color:#efe;}		/* 緑 */
.bgca{background-color:#eff;}		/* 水 */
.bgcb{background-color:#eef;}		/* 青 */
.bgcf{background-color:#fef;}		/* 紫 */
.bgcs{background-color:silver;}		/* シルバー */
.bgcm{background-color:white;}		/* 白 */
.bgmetal{background:url(./img/metal.jpg);}

/* ▼文字色 */
.white{color:white;}
.silver{color:silver;}
.gray{color:gray;}
.black{color:black;}
.red{color:red;}
.maroon{color:maroon;}
.yellow{color:yellow;}
.olive{color:olive;}
.lime{color:lime;}
.green{color:green;}
.aqua{color:aqua;}
.teal{color:teal;}
.blue{color:blue;}
.navy{color:navy;}
.fuchsia{color:fuchsia;}
.purple{color:purple;}

.gold{color:#aa0;}
.mikan{color:#f80;}
.midori{color:#0b0;}