@charset "shift_jis";

form {
	width:100%;}
	form div{
		padding: 10px 10px;}
	.text, textarea, .dropdown {
		border:1px solid #777777;
		padding: 5px;
		color: #999999;
		background: #FFFFFF;
	
/* Webkit */
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#EEEEEE),
		to(#FFFFFF)
		);
	
/* Firefox */
	background: -moz-linear-gradient(
		top,
		#EEEEEE,
		#fff
		);
	
/* IE */
	filter:progid:DXImageTransform.Microsoft.gradient
        (startColorstr=#FFEEEEEE,endColorstr=#FFFFFFFF);
	zoom: 1;
}

.text, textarea, .dropdown {
	border:1px solid #777777;
	padding: 5px;
	color: #999999;
	background: #FFFFFF;
	border-radius: 5px;
	
	/* Webkit */
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#EEEEEE),
		to(#FFFFFF)
		);
	-webkit-border-radius: 5px;
	
	/* Firefox */
	background: -moz-linear-gradient(
		top,
		#EEEEEE,
		#FFFFFF
		);
	-moz-border-radius: 5px;
	
	/* IE */
	filter:progid:DXImageTransform.Microsoft.gradient
        (startColorstr=#FFEEEEEE,endColorstr=#FFFFFFFF);
	zoom: 1;
}

.text, textarea, .dropdown {
	border:1px solid #777777;
	padding: 5px;
	color: #999999;
	background: #FFFFFF;
	border-radius: 5px;
	
	/* Webkit */
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#EEEEEE),
		to(#FFFFFF)
		);
	
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 1px 1px 1px #FFFFFF;
	
	/* Firefox */
	background: -moz-linear-gradient(
		top,
		#EEEEEE,
		#FFFFFF
		);
	
	-moz-border-radius: 5px;
	-moz-box-shadow: 1px 1px 1px #FFFFFF;
	
	/* IE */
	filter:progid:DXImageTransform.Microsoft.gradient
        (startColorstr=#FFEEEEEE,endColorstr=#FFFFFFFF);
	zoom: 1;
}

.submit {
	border:1px solid #777777;
	padding: 4px 10px;
	color: #FFFFFF;
	cursor: pointer;
	background: #428EC9;
	border-radius: 5px;
	
/* Webkit */
	background: -webkit-gradient(
		linear,
		left top,
		left bottom,
		from(#99C9E5),
		to(#428EC9)
		);
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 1px 1px 1px #FFFFFF;
		
/* Firefox */
	background: -moz-linear-gradient(
		top,
		#99C9E5,
		#428EC9
		);
	-moz-border-radius: 5px;
	-moz-box-shadow: 1px 1px 1px #FFFFFF;
	
/* IE */
	filter:progid:DXImageTransform.Microsoft.gradient
        (startColorstr=#FF99C9E5,endColorstr=#FF428EC9);
	zoom: 1;
}

.checkbox,.radio {
	z-index: -1;
	position: absolute;
	}
	.CheckBoxLabelClass {
		background: url("../image/sp/checkbox.png") no-repeat top left;
		margin-right:20px;
		padding-left:22px;
}
	
	.radiolabel {
		background: url("../image/sp/radio.png") no-repeat top left;
		margin-right:20px;
		padding-left:22px;
}
.LabelSelected,.RadioSelected {
	background-position: bottom left;
}

/*
<form>
    <div>
        <label>名前</label><br />
        <input type="text" class="text" size="35" value="" />
    </div>
	        
    <div>
        <label>メールアドレス</label><br />
        <input type="text" class="text" size="35" value="" />
    </div>
			
    <div>
        <label>セレクトメニュー</label><br />
        <select class="dropdown">
            <option>選択してください</option>
            <option>嬉しい</option>
            <option>楽しい</option>
            <option>大好き</option>
        </select>
    </div>

    <div>
        <label>コメント</label><br />
	<textarea cols="35" rows="7" name="comments" id="comments"></textarea>
    </div>

    <!-- チェックボックス -->
    <div>
        <input id="CheckBox1" type="checkbox" class="checkbox"/>
        <label id="Label1" for="CheckBox1" class="CheckBoxLabelClass">Checkbox 1</label>
    
        <input id="CheckBox2" type="checkbox" class="checkbox"/>
        <label id="Label2" for="CheckBox2" class="CheckBoxLabelClass">Checkbox 2</label>	
    </div>
    
    <!-- ラジオボタン -->			
    <div>
        <input id="Radio1" type="radio" class="radio" name="group1" >
        <label id="Label1" for="Radio1" class="radiolabel">Radio 1</label>
        <input id="Radio2" type="radio" class="radio" name="group1"/>
                
        <label id="Label2" for="Radio2" class="radiolabel">Radio 2</label>	
        <input id="Radio3" type="radio" class="radio" name="group1"/>
        <label id="Label3" for="Radio3" class="radiolabel">Radio 3</label>
    </div>

    <div>
        <input type="submit" class="submit" value="送信する" />
    </div>

</form>
*/