/*
*{
	margin:0;
	padding:0;
}
*/
html{
	height: 100%;
}
body,h1,h2,h3,h4,h5,h6,table,tr,th,td{
	margin:0;
	padding:0;
	border: 0;
}

h1,h2,h3,h4,h5,h6{
	clear: both;
}

.right{
	text-align: right;
}

.left{
	text-align: left;
}

.center{
	text-align: center;
}
.clear{
	clear: both;
}

span.red_bold{
	color: #ff0000;
	font-weight: bold;
}
body{
	font-family: "arial";
	font-size: 12px;
	line-height: 145%;
	background: url("../img/background.gif") repeat-y center;
	height: 100%;
}
* html div#container{
	height:100%;
}

table {
	border-collapse:collapse;
	border-spacing:0pt;
}

form th{
	text-decoration: none;
	text-align: left;
}

img {
	border:0pt none;
}

#container{
	width: 960px;
	border-left: 1px solid #a9a9a9;
	border-right: 1px solid #a9a9a9;
	position: relative;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -30px;
}

#container h1{
	text-indent: -9999px;
}

#header{
	width: 100%;
	height: 100px;
	background-color: #87ceeb;
	background-image: url('../img/crime_r1.gif');
	background-repeat: no-repeat;
	background-position: 10px 10px;
}

#header #logo{
	position: absolute;
	top: 5px;
	left: 95px;
}

#header_menu{
	/*float: right;*/
	position: absolute;
	top: 0px;
	left: 850px;
	width: 100px;
}

#header_banner{
	/*float: right;*/
	position: absolute;
	top: 5px;
	left: 380px;
	width: 468px;
	height: 60px;
}
#google_search{
	/*float: right;*/
	position: absolute;
	top: 70px;
	left: 380px;
	width: 468px;
}

#header_menu ul, #menu li{
	list-style: none;
	margin: 0;
	padding: 0;
}

#header_menu li{
	display: inline;
}
#header_menu a, #header_menu a:link, #header_menu a:visited{
	border: 1px solid #ffffff;
	background-color: #336699;
	width: auto;
	height: 15px;
	padding: 5px 10px;
	margin: 5px;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	color: #FFFFFF;
	display: block;
}

#header_menu a:hover{
	color: #FFFFFF;
	background-color: #3399CC;
}


.push{
	clear: both;
	text-align:center;
	height: 30px;
}
/**
 * フッター
 */
#footer{
	clear: both;
	background-color: #87cefa;
	text-align: center;
	position: absolute;
	bottom: 0px;
	height: 30px;
	width: 100%;
}
/**
 * 画面全体を覆うレイヤ（普段は見えない）
 */
#wall{
	background-color: #000;
	filter:alpha(opacity=75); /*IE*/
	-moz-opacity: 0.75; /*FF*/
	opacity:0.75;
	width: 100%;
	height: 100%;
	min-height: 100%;
	position: fixed;
	top: 0;
	left: 0;
}
#soon{
	width: 210px;
	height: 60px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-left: -125px;
	margin-top: -50px;
	background-color: #fff;
	border: 3px solid #000;
	text-align: center;
	padding: 20px;
}
#content{
	width: 100%;
	height: auto;
	padding-bottom: 30px;
}

#menu{
	width: 100%;
	height: auto;
}
#menu ul, #menu li{
	list-style: none;
	margin: 0;
	padding: 0;
}

#menu li{
	display: inline;
}
#menu a, #menu a:link, #menu a:visited{
	border-bottom: 2px dotted #333333;
	background-color: #336699;
	width: auto;
	height: auto;
	padding: 5px 10px;
	text-decoration: none;
	color: #FFFFFF;
	display: block;
}

#menu form{
	border-bottom: 2px dotted #333333;
	background-color: #336699;
	width: auto;
	height: auto;
	padding: 5px 10px;
	margin: 0;
	text-decoration: none;
	color: #FFFFFF;
	display: block;
}

#menu a:hover{
	color: #FFFFFF;
	background-color: #3399CC;
}

#right_column{
	width: 200px;
	float: right;
	background-color: #336699;
}

#main{
	width: 740px;
	margin: 0;
	padding: 10px;
	border: 0;
	float: left;
}

#main h2{
	padding: 10px 0px;
}

#main .message{
	margin: 0 0 10px 0;
	padding: 2px 0 2px 20px;
	border: 3px solid #008000;
	background-color: #7cfc00;
	background-image: url('../img/tama_05.gif');
	background-position: 2px 2px;
	background-repeat: no-repeat;
}

#main .error_message{
	margin: 0 0 10px 0;
	padding: 2px 0 2px 20px;
	border: 3px solid #ff3366;
	background-color: #ffcccc;
	background-image: url('../img/tama_02.gif');
	background-position: 2px 2px;
	background-repeat: no-repeat;
}
fieldset{
	margin-bottom: 20px;
}
legend{
	font-size: 16px;
}
#new_course_list legend{
	color: #00cc99;
}
#new_runs_list legend{
	color: #ff6699;
}
#information legend{
	color: #ff6633;
}
#new_course_list ul,#new_runs_list ul, #information ul{
	list-style-type: none;
	margin: 0;
	padding: 0 0 0 20px;
}
#new_course_list li, #new_runs_list li, #information li{
	list-style-type: none;
	margin: 0;
	padding: 0;	
}
#information li{
	list-style-image: url("../img/list/cl_003.gif");
}
#new_course_list li{
	list-style-image: url("../img/list/cl_001.gif");
}
#new_runs_list li{
	list-style-image: url("../img/list/cl_005.gif");
}

.ranking th .left{
	color: #FF0000;
	border: 2px solid #000000;
}

/* 走行記録フォーム */
#run_add{
	width: 700px;
	height: auto;
}

#run_add th{
	width: 120px;
	vertical-align: top;
	text-align: left;
	text-decoration: none;
}

#run_add td{
	width: 580px;
}

/* ログインフォーム */
#form_login{}

#form_login th{
	text-decoration: none;
	text-align: left;
}

/* マイトップのベストタイム ここから*/
#best_time{
	float: left;
	margin-right: 10px;
}

#best_time table{
	width: 450px;
	height: auto;
	text-align: center;
	border: 1px solid #ffd700;
}

#best_time .hdr{
	background-color: #ffd700;
}

#best_time .odd{
	background-color: #f0e68c;
}
#best_time .even{
	background-color: #fafad2;
}
/* マイトップのベストタイム　ここまで */

/* コース走行回数 ここから */
#course_count{
	float: right;	
}

#course_count table{
	width: 280px;
	height: auto;
	text-align: center;
	border: 1px solid #ff6699;
}

#course_count .hdr{
	background-color: #ff6699;
}

#course_count .odd{
	background-color: #ff99ff;
}

#course_count .even{
	background-color: #ffccff;
}
/* コース走行回数 ここまで */

/* 走行記録 ここから */
#runs_list{
	padding-top: 20px;
	clear: both;
}

#runs_list table{
	width: 100%;
	height: auto;
	text-align: center;
	border: 1px solid #4682b4;
}

#runs_list .hdr{
	background-color: #4682b4;
}

#runs_list .odd{
	background-color: #bfdfef;
}

#runs_list .even{
	background-color: #f0f8ff;
}
/* 走行記録 ここまで */


/* 走行記録用フォーム ここから */
#form_run{}
#form_run table, #form_course table, #form_bicycle table,
#form_confirm_email table, #form_reissue_password table,
#form_profile table, #form_user table{
	width: 600px;
	height: auto;
	border: 1px solid #4682b4;
}

#form_run th, #form_course th, #form_bicycle th,
#form_confirm_email th, #form_reissue_password th,
#form_profile th, #form_user th{
	background-color: #4682b4;
	border-top: 1px dashed #ffffff;
	padding: 5px 5px;
	white-space: nowrap;
}
#form_run .top_row, #course_list .top_row, #form_course .top_row,
#bicycle_list .top_row, #form_bicycle .top_row, #form_confirm_email .top_row,
#form_reissue_password .top_row, #form_profile .top_row, #form_user.top_row{
	border: none;
}

#form_run td, #form_course td, #form_bicycle td,
#form_confirm_email td, #form_reissue_password td,
#form_profile td, #form_user td{
	background-color: #bfdfef;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;
}
/* 数字しか入力しないフォームで使用 */
.num{
	text-align: right;
}




/* コース一覧 */
#profile{}
#course_list{}
#bicycle_list{}
#course_list table, #bicycle_list table, #profile table{
	border: 1px solid #4682b4;
	width: 100%;
	margin-bottom: 20px;
}

#course_list th{
	background-color: #4682b4;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;
	white-space: nowrap;
}
#course_list td{
	text-align: center;
	background-color: #bfdfef;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;	
}

#bicycle_list th, #profile th{
	background-color: #4682b4;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;
	white-space: nowrap;
	width: 150px;	
}

#bicycle_list td, #profile td{
	background-color: #bfdfef;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;
}

/* 総合タイムランキング */
#total_ranking,
#year_count_ranking,
#year_time_ranking{
	margin-bottom: 20px;
}

#total_ranking table{
	width: 100%;
	height: auto;
	text-align: center;
	border: 1px solid #ffd700;
}

#total_ranking .hdr{
	background-color: #ffd700;
}

#total_ranking .odd{
	background-color: #f0e68c;
}
#total_ranking .even{
	background-color: #fafad2;
}

/* 年間タイムランキング */
#year_time_ranking table{
	width: 100%;
	height: auto;
	text-align: center;
	border: 1px solid #4682b4;
}

#year_time_ranking .hdr{
	background-color: #4682b4;
}

#year_time_ranking .odd{
	background-color: #bfdfef;
}

#year_time_ranking .even{
	background-color: #f0f8ff;
}

/* 年間走行数ランキング */
#year_count_ranking table{
	width: 100%;
	text-align: center;
	border: 1px solid #ff6699;
}

#year_count_ranking .hdr{
	background-color: #ff6699;
}

#year_count_ranking .odd{
	background-color: #ff99ff;
}

#year_count_ranking .even{
	background-color: #ffccff;
}


#course_detail table, #bicycle_detail table, #run_detail table{
	border: 1px solid #4682b4;
	width: 100%;
	margin-bottom: 20px;
}

#course_detail th, #bicycle_detail th, #run_detail th{
	background-color: #4682b4;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;
	width: 100px;
	white-space: nowrap;
}

#course_detail td, #bicycle_detail td, #run_detail td{
	text-align: left;
	background-color: #bfdfef;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;	
}
#course_detail .top_row, #bicycle_detail .top_row, #run_detail .top_row{
	border: none;
}

/* コース用メニュー */
#course_menu{
	width: 100%;
}
#course_menu ul, #course_menu li{
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#course_menu ul{
	margin: 0;
}
#course_menu li{
	float: left;
	text-align: center;
	vertical-align: middle;
	width: 20%;
	margin: 0px;
	margin-right: 5px;
}
#course_menu a, #course_menu a:link, #course_menu a:visited{
	text-decoration: none;
	display: block;
	background-color: #669999;
	border: 1px solid #669999;
	color: #ffffff;
	padding: 2px 0;
}

#course_menu a:hover{
	color: #ffffff;
	background-color: #6699ff;
}
/* 走行履歴一覧 */
#record_list table{
	width: 100%;
	height: auto;
	text-align: center;
	border: 1px solid #4682b4;
}

#record_list .hdr{
	background-color: #4682b4;
}

#record_list .odd{
	background-color: #bfdfef;
}

#record_list .even{
	background-color: #f0f8ff;
}

.add_btn{
	margin: 0 0 10px 0;
}

.map_mini{
	width: 320px;
	height: 240px;
	float: right;
}

.map_mini_loading{
	position: relative;
	top: 120px;
	left: 160px;
	margin-top: -50px;
	margin-left: -50px;
}

.map_big{
	width: 100%;
	height: 500px;
}

.map_big_loading{
	position: relative;
	top: 250px;
	left: 50%;
	margin-top: -50px;
	margin-left: -50px;
}

#course_summary_area{
	margin: 0 0 10px 0;
}

#course_summary{
	width: 400px;
	height: 140px;
	border: 1px solid #4682b4;
	margin-right: 10px;
	margin-bottom: 10px;
}
#course_summary th{
	vertical-align: middle;
	text-align: left;
	width: 80px;
	background-color: #4682b4;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;
}
#course_summary td{
	text-align: left;
	vertical-align: top;
	background-color: #bfdfef;
	border-top: 1px dotted #ffffff;
	padding: 5px 5px;	
}
#course_summary .start, #course_summary .goal{
	height: 20px;
}
#course_summary .description{
	height: 70px;
	overflow: hidden;
}


.number_1{
	font-size: 24px;
	height: 36px;
}
.number_2{
	font-size: 20px;
	height: 28px;
}
.number_3{
	font-size: 16px;
	height: 22px;
}
.operation{
	width: 160px;
	text-align: center;
}

.attention{
	border: 3px solid #ff3366;
	background-color: #ffcccc;
	padding: 2px 0 2px 20px;
	background-image: url('../img/tama_02b.gif');
	background-position: 2px 2px;
	background-repeat: no-repeat;
}
/**
 * ソーシャルブックマーク
 */
#bookmark{
	text-align: right;
}
/**
 * サイトの使い方
 */
#tutorial{
	
}

#weather_summary{
	border: 1px solid #000000;
	width: 180px;
	padding: 0;
	margin: 0;
	text-align: center;
}
#weather_summary th{
	border: 1px solid #000000;	
	padding: 2px 5px;
}
#weather_summary td{
	width: 50px;
	height: 41px;
	border: 1px solid #000000;
	padding: 5px;
}

#greeting{
	width: 580px;
}

#main #qr_code{
	text-align:center;
	width: 150px;
	height: 150px;
	position:absolute;;
	top: 120px;
	left: 580px;
}

#btn_area{
	width: 100%;
	text-align:center;
	padding-bottom: 10px;
}

