@charset "UTF-8";
/*loginForm*/

header {
	border-bottom: 3px solid #192f60; 
}

/*まず、フォーム全体の囲み罫や背景などを指定*/
form#loginForm {
	width: 50%;
	padding: 10px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 15px;
	/* border: 1px solid #ccc; */
	/* background: #F0F8F1; */
	/*↓背景グラデーションの指定*/
	/* background: -moz-linear-gradient(top, #FBFCFC, #F0F8F1); */
	/* background: -webkit-linear-gradient(top, #FBFCFC, #F0F8F1);*/
	/* background: linear-gradient(#FBFCFC, #F0F8F1);*/
}

form#loginForm div {
	font-size: 0.8em;
	color: red;
}

div#errorMSG {
	font-size: 1em;
}

/*リスト要素<ul>を初期化*/
form#loginForm ul{
	padding: 0;
	margin: 0
}
/*<li>も初期化し、ボーダーなどを指定*/
form#loginForm ul li, form#form1 ul li{
	list-style: none;
	margin: 0px;
	padding: 10px;
	border-top: 2px solid #FFF;
	/* font-size: 12px; */
}
/*最初の<li>にはボーダーをつけない（:first-child疑似クラスによる指定）*/
form#loginForm ul li: first-child {
	border-top: none;
}

/* span要素をブロック化しフロートでフォーム部品と横に並べる*/
form#loginForm ul li span{
	/* width: 17em; */
	width: 25%; 
	margin: 0px;
	display:block;
	float: left;
	font-size: 90%;
/* floatでなく、CSS3 の「display: inline-block」を使う手もアリ 
	display: inline-block;*/
}

/*「:after」で <li>の末尾でフロートをクリア*/
form#loginForm ul li:after{
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
	clear: both;     /*←フロートをクリア*/
}

/* テキスト入力部品の見た目を統一する */
form#loginForm ul li label .txtfiled, form#loginForm select {
	box-sizing:border-box;
	width: 60%; 
	padding: 3px 5px;
	margin: 0px;
	border: solid 1px #ccc;
	font-size: 90%;
	/*テキストエリア内にシャドウをつける。最初にbackground初期化が必要*/
    background: #fff;
	-webkit-box-shadow: 2px 3px 5px -2px #ddd inset;
	-moz-box-shadow: 2px 3px 5px -2px #ddd inset;
	box-shadow: 2px 3px 5px -2px #ddd inset;
	/*角丸にする*/
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
}

/*チェックボックス、ラジオボタンのブロックの指定*/
form#loginForm ul li p {
	margin: 5px 0 0 40px;
}
/*チェックボックス、ラジオボタンの label要素を横に並べる*/
form#loginForm ul li p label {
	margin-right: 2em;
	display: block;
	float: left;
}
/*input要素とテキストがくっつかないように右にマージンを少し*/
form#loginForm ul li p label input {
	margin-right: 0.5em;
}
/*チェックボックス、ラジオボタンの label要素にロールオーバー時の変化を指定する*/
form#loginForm ul li p label:hover {
	background: #FFF;
	color: #096;
	font-weight: bold;
}
/*チェックボックスの<label>の横幅を統一する（<p>にクラス名.checkをつけて）*/
form#loginForm ul li p.check label {
	width: 9em;
}

form#loginForm p {
	text-align: center;
}

/*送信・リセットボタンの体裁を指定（[type="○○"]で属性の値でセレクト）*/
form#loginForm ul li input[type="submit"] ,
form#loginForm ul li input[type="reset"] {
	cursor: pointer;     /*←これでカーソルを指先型に変化させる*/
	font-size: large;
	font-weight: bold;
	width: 30%;
	padding: 5px 0;
	margin-right: 0.5em;
	border-style: none;
	color: #fff;
	background: #90E733;
/*↓背景グラデーションの指定です*/
	background: -moz-linear-gradient(top, #90E733, #428000 50%, #90E733);
	background: -webkit-linear-gradient(top, #90E733, #428000 50%, #90E733);
	background: linear-gradient(#90E733, #428000 50%, #90E733);
/*↓以下、ボックスの角丸、シャドウ、テキストシャドウの指定*/
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 2px 2px 3px 1px #666;
	-webkit-box-shadow: 2px 2px 3px 1px #666;
	box-shadow: 2px 2px 3px 1px #666;
	text-shadow: 1px 1px 2px #000; 
}

form#loginForm ul li input[type="submit"]:hover ,
form#loginForm ul li input[type="reset"]:hover {
/*↓ここではロールオーバー時の透明度を変更。もちろんグラデーションを指定してもOK*/
	opacity: 0.8;
	font-size: large;
}

.halfsize {
	ime-mode: disabled;
}