@CHARSET "utf-8";

* {
	margin:0px;
	padding:0px;
}

img
{
	border: none;
}

body { background-color: white; color:black; }

#BodyHeader
{
	width:100%;
	border-bottom: 1px solid #c0c0ff;
}

#BodyHeader div.desc
{
	float:left;
	text-align:left;
	font-size: 10px;
	color: #a0a0a0;
	margin: 2px;
	padding:3px;
}
#BodyHeader div.rmenu
{
	text-align: right;
	margin: 2px;
	font-size: 14px;
}

#BodyFooter
{
	margin-top: 12px;
	border-top: 1px solid #c0c0ff;
	text-align: left;
}

#BodyFooter div.line
{
	padding: 4px;
	font-size: 14px;
}

#BodyContents
{
	margin: 0px;
	padding: 0px;
}
#HeaderLogo
{
	background-color:#6699ff;
	margin:0px;
	padding-top: 4px;
	padding-left: 0px;
	padding-bottom: 4px;
	text-align: center;
}

#TopMenu
{
	font-size: 14px;
	color: #4444cc;
	padding:6px;
	background-color: #f0f0ff;
}
#TopMenu a { text-decoration: none; }
#TopMenu a:hover { background-color: #c0c0ff; }

#FootMenu
{
	font-size: 14px;
	color: #4444cc;
	padding:6px;
	background-color: #f0f0ff;
}

#TopAd
{
	margin: 0px;
}

.clearboth
{
	clear:both;
	float:none;
}

#ItemPanel
{
	font-size:16px;
}

#ItemPanel a:link
{
	text-decoration: none;
}
#ItemPanel a:visited
{
	text-decoration: none;
}
.ItemCellMenuOut {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	border-top: 1px dashed silver;
	border-left: 1px dashed silver;
	width:320px;
}
.ItemCellMenu {
	float: left;
	padding:9px; margin:0px;
	border-right: 1px dashed silver;
	border-bottom: 1px dashed silver;
	font-size: 10px;
	width:60px;
	text-align: center;
}

.ItemCell
{
	padding: 9px;
	margin-bottom: 14px;
	border-bottom: 1px solid #c0c0ff;
	float:left;
	width:300px;
}

.ItemCellIcon
{
	padding: 12px;
	margin-top: 14px;
	margin-left: 14px;
	margin-right: 14px;
	margin-bottom: 14px;

	border: 1px solid #f0f0f0;
  border-radius: 8px;
	float:left;
	width: 272px;
}

.ItemCellTitle
{
	padding: 9px;
	margin-bottom: 14px;
	border-bottom: 1px solid #c0c0ff;
	background-color: #f0f0ff;
  font-weight: bold;
  font-size: 1.1em;
}
.ItemDescript {
	font-size: 0.8em;
	color: #555555;
}

#main_form, #main_form2
{
	padding-bottom: 4px;
	padding-top: 4px;
	padding-right: 16px;
	padding-left: 16px;
	text-align: center;
	line-height: 36px;
	border: 1px solid #C0C0C0;
	background-color: #F0FFFF;
}

#main_form input, #main_form2 input {
	width: 183px;
	font-size: 18px;
	border:1px solid gray;
	padding: 8px;
	margin: 4px;
}
#main_form select, #main_form2 select {
	width: 200px;
	font-size: 18px;
	border: 1px solid gray;
	padding: 8px;
	margin: 4px;
}

#main_form .descMessage, #main_form .descMessage
{
	font-size: 14px;
	color: #808080;
	line-height: 20px;
}

#main_form ul {
	margin-left: 8px;
}

.sub_info
{
	padding-left: 32px;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	font-size:12px;
	color: #606080;
	line-height: 20px;
}

#sub_info .unitBase
{
	padding-top: 12px;
	padding-left: 12px;
}

#sub_info
{
	padding-left: 32px;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	font-size:12px;
	color: #606080;
	line-height: 20px;
}

#sub_info .descMessage
{
	font-size: 15px;
	color: #808080;
}

#main_form input[type="radio"] {
	width: 1em;
}

#quiz_buttons input[type="button"] {
	width: 130px;
	font-size: 14px;
	padding: 4px;
}

.star {
    color:orange;
    font-size: 0.5em;
}

/* TOP list design  */
.group-title {
  clear:both;font-size:12px;
  padding:8px;
  color:blue;background-color:#f0f0ff;
}
.ItemCellIcon2 {
	padding: 9px;
	margin-left: 16px;
	margin-bottom: 8px;
	border-bottom: 1px solid #c0c0ff;
}

#PopPanel {

}
#PopPanel .descript {
	font-size: 0.8em;
	padding: 6px;
	margin: 8px;
	background-color: #ffffee;
	color:gray;
}

/* for unit_convert */
input#a_txt {
	font-size:1.3em;
}
select#a_sel, select#b_sel {
	font-size:1.3em;
}

input#b_txt {
	font-size:1.3em;
	background-color: #fffff0;
}
input.ref_txt {
	background-color: #fffff0;
}
input#convert_btn {
	width:200px;
	padding-left:8px;
	padding-right:8px;
	padding-top:12px;
	padding-bottom:12px;
	background-color: #e0e0e0;
	border-radius: 1;
	-webkit-appearance: none;
}


@media screen and (min-width: 960px) {
	/* 表示領域が960px以上の場合に適用するスタイル */
}