﻿/* グローバル */

.small_button {
  background-color: #9acd32;
  border-color: #9acd32;
  border-width: 2px;
  border-style: outset;
  color: white;
  font-size: 80%;
  padding: 0;
  margin: 0;
}

.main_search_button {
  background-color: green;
  border-color: green;
  border-width: 2px;
  border-style: outset;
  color: white;
  font-size: 120%;
  font-weight: bold;
  /* float: right; */
  padding: 0;
  margin: 0 0 0 10px;
}

.login_button {
  background-color: #9acd32;
  border-color: #9acd32;
  border-width: 2px;
  border-style: outset;
  color: white;
  font-size: 60%;

}

.login_button_en {
  background-color: #9acd32;
  border-color: #9acd32;
  border-width: 2px;
  border-style: outset;
  color: white;
  font-size: 100%;

}

.no_border_button {
  background-color: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  font-size: 80%;
  cursor: pointer;
}

.clear {
  clear: both;
}

.dragging_object {
  position: absolute;
  text-align: left;
}

.plane_text {
  color: #3c4c21;
  font-size: small;
  margin: 0;
}

.description_text {
  color: darkgreen;
  font-size: small;
  margin: 0;
}

body {
  background-color: white;
  text-align: center;
}

#page {
  text-align: center;
}

#contents {
  width: 99.5%;
  text-align: left;
  border: 0;
}

#contents .outline_margin {
  margin: 0 20px 10px 20px;
}

#contents .inline_margin {
  margin: 20px;
}

/* メイン画面の一番上のブロック：タイトル等 */
#index_header {
  margin: 0 0 20px 0;
}

#index_left {
  float: left;
  width: 60%;
  margin: 0 0 13px 0;
}

#index_right {
  float: right;
  width: 39%;
}

#award_badge {
  width:56px;
  height:67px;
  float:left;
  border: 0;
  margin: 0 10px 0 0;
  padding: 0;
}

#index_title {
  /* width:100%; */
  text-align:left;
  /* float:left; */
  font-size:30px;
  font-family: "Tahoma";
  color: olivedrab;
  margin: 5px 0 0 0;
}
#index_description {
  /* width:100%; */
  font-size:small;
  text-align:left;
  /* float:left; */
  color: darkolivegreen;
  margin: 0;
}

.top_title {
  text-align:left;
  font-size:30px;
  font-family: "Tahoma";
  color: olivedrab;
  margin: 5px 0 0 0;
}
.top_description {
  font-size:small;
  text-align:left;
  color: darkolivegreen;
  margin: 0 0 20px 0;
}

.top_beige {
  width:100%;
  background-color: beige;
  margin: 0 0 10px 0;
}

#login_area {
  width: 200px;
  float: left;
  font-family: "MS Gothic";
  margin: 5px;
  color: darkolivegreen;
  font-size: smaller;
}

.login_field {
  background-color: #b0cc7a;
  font-size: 60%;
  margin: 2px 0 0;
}

.login_field_en {
  background-color: #b0cc7a;
  font-size: 100%;
  margin: 2px 0 0;
  width:  70px;
}

.login_label_en {
  width: 50px;
}

div#link_for_help a:link,a:visited{
  color: olivegreen;
}

div#link_for_tips {
  font-size: small;
}

#whats_here {
  font-size: small;
  border-style: solid;
  border-width: 1px;
  border-color: olivegreen;
}

#webapi_info {
  font-size: small;
  border-style: solid;
  border-width: 1px;
  border-color: olivegreen;
}

/* メイン画面の上から２ブロック目：単純検索欄と閲覧履歴欄 */
#forms {
  width: 100%;
  border-bottom: 1px black solid;
  text-align: left;
  margin: 20px 0;
}

#left_form {
  width: 260px;
  float: left;
}

#right_form {
  /* width: 160px; */
  /* float: right; */
}

#google_graph {
  margin: 30px 0 0 0;
  width: 260px;
  height: 140px;
  float: left;
}

#whats_new {
  width:  300px;
  height: 160px;
  float: right;
  overflow: auto;
  border-style: solid;
  border-width: 1px;
  border-color: cornflowerblue;
  font-size: 80%;
  color: black;
}

#whats_new_title {
  font-size:120%;
  font-family: "Tahoma";
  color: royalblue;
  font-weight: bold;
}

#search_form {
  width: 95%;
  float: left;
  background-color: #FFDB99;
  border: solid 2px #FFC966;
  width: 90%;
}

#keyword {
  height: 24px;
  font-size: large;
  margin: 10px 0 6px 10px;
}

#graph_text {
  width: ;
  margin: 10px 5px 0 5px;
  padding: 0;
  float:right;
  text-align:left;
}

#jschart_graph {
  float: right;
  margin: 5px 0px 15px 0px;
  padding: 0 20px 0 0;
}

#search_histories {
/*
  width: 95%;
  height: 430px;
  float: left;
  margin: 10px 0;
  padding: 10px;
  border: 5px palegoldenrod ridge;
  background-color: palegoldenrod;
*/
  font-family: "monospace";
}

/*
#browse_histories {
  background-color: cornsilk;
  height: 280px;
  overflow: auto;
}
*/

/* 画面構成のうち、検索結果と閲覧履歴の部分 */
#search_results {
  width: 100%;
  margin: 0;
  background-color: white;
  color: darkolivegreen;
  font-family: "monospace";
}

#left_sub_search_results, #right_sub_search_results {
  width: 90%;
  margin: 10px 0 0 10px;
  background-color: white;
  color: darkolivegreen;
  font-family: "monospace";
}

/* 検索結果○件 */
#search_results_title {
  margin: 0 0 0 10px;
}

/* 検索結果一覧表の周辺(yui,title,table...)を囲むdiv */
.search_results {
  width: 100%;
  height: 240px;
  margin: 0 0 0 0;
  overflow: auto;
}

/* 検索結果欄内の table */
.search_results table {
  width: 95%;
  margin: 5px 0 0 5px;
  border: 1px darkolivegreen solid;
  border-collapse: collapse;
}

.search_results th {
  border: 1px darkolivegreen solid;
  border-collapse: collapse;
  cursor: pointer;
}

.search_results td {
  border: 1px darkolivegreen solid;
  border-collapse: collapse;
}



/* 検索結果一覧表 */
#search_results_sortable_table {
    width: 95%;
}

/* 検索結果一覧表のth */
#search_results_sortable_table th {
  font-size: smaller;
}


#histories_sortable_table {
  width: 95%;
  margin: 5px 0 0 5px;
  border: 1px darkolivegreen solid;
  border-collapse: collapse;
}

#histories_sortable_table th {
  border: 1px darkolivegreen solid;
  border-collapse: collapse;
  cursor: pointer;
  font-size: smaller;
}

#histories_sortable_table td {
  border: 1px darkolivegreen solid;
  border-collapse: collapse;
  margin: 0 0 0 5px;
  padding: 0 0 0 5px;
  font-size: smaller;
}

#histories_sortable_table span {
  margin: 0 0 0 5px;
  padding: 0 0 0 5px;
}

#search_help {
  margin:  0 0 0 15px;
}

#kikaku_button {
  font-size: x-small;
  padding: 0;
  margin: 0;
}

#history_clear_button {
  font-size: x-small;
  padding: 0;
  margin: 0;
}

#history_display_button {
  font-size: x-small;
  padding: 0;
  margin: 0;
}

.arrow_left {
  margin: 0;
  padding: 0;
  border: 0;
  background-color: transparent;
}

.arrow_right {
  margin: 0;
  padding: 0;
  border: 0;
  background-color: transparent;
}


/* class="search_result" をなぜか各行をくくるdivと、その内側のbuttonの両方に適用しないと、全体のoverflow: autoが適切に表示されない。（１文字横にあふれた状態で横スクロールが出現） */
/* 上記問題の理由としては、ブラウザの横スクロール機能のバグが想像される。overflow:visible を指定すると、ブラウザが認識する表示データのlengthが正しい値に調整されるのではないか。 */
.search_result {
  width: 85%;
  border: 0;
  background-color: transparent;
  cursor: pointer;
  text-align: left;
  vertical-align: middle;
  font-family: "MS Gothic";
  font-size: 12px;
  overflow: visible;
}

/* メイン画面の上から３ブロック目：左右のAPI詳細欄 */
#api {
  width: 100%;
  margin-top: 10px;
}

#left_api {
  border: 1px darkolivegreen solid;
  background-color: beige;
  width: 49%;
  float: left;
}

#right_api {
  border: 1px darkolivegreen solid;
  background-color: beige;
  width: 49%;
  float: right;
}

.api_memos {
  text-align: right;
}

.memo_link {
  font-size: 9pt;
  color: blue;
  text-decoration: underline;
  cursor: pointer;
}

.api_info {
  width: 100%;
  margin-top: 10px;
}

.api_info_table {
  width: 100%;
  border: 1px darkolivegreen solid;
  border-collapse: collapse;
  table-layout: fixed;
  word-wrap: break-word;      /* IE 5.5+ */
}

.api_info_table td {
  border: 1px darkolivegreen solid;
}

.api_thumbnail {
  width: 100%;
}

.api_title {
  width: 100%;
  height: 50px;
  font-size:1.2em;
}

.api_description {
  width: 100%;
  height: 60px;
  overflow: auto;
}

.api_introduction_links {
  width: 100%;
  height: 60px;
  overflow: auto;
}

.api_license {
  width: 100%;
  background-color: white;
}

.api_display_1_line {
  height: 20px;
  overflow: hidden;
  white-space: nowrap;
  word-break: keep-all;
  word-wrap: normal;
}

.translated_api_description {
}

#api_kuchikomi {
  margin: 10px 0 0 0;
}

.api_kuchikomi_list {
  width:100%;
  height:100px;
  background-color: white;
  overflow: auto;
  font-size: smaller;
}

/* ユーザ登録／更新フォーム */
.user_form_label {
  width: 120px;
  float: left;
  text-align: right;
}

.user_form_element {
  float: left;
  text-align: left;
}

#about_registration {
  margin-left: 20px;
}

#ragistration_error {
  color: crimson;
}

/* カテゴリ */
/*
.categories_table {
  width: 80%;
  font-size: 9pt;
  border-collapse: collapse;
  table-layout: fixed;
}

.categories_table .genre_header {
  width: 10%;
  text-align: center;
}

.categories_table .category_1_header {
  width: 10%;
  text-align: center;
}

.categories_table .category_2_header {
  width: 30%;
  text-align: center;
}

.categories_table .category_3_header {
  width: 30%;
  text-align: center;
}

.categories_table .sample_api_header {
  width: 20%;
  text-align: center;
}

.categories_table .category {
  border: 1px solid black;
} */

.categories_table {
  width: 100%;
  border: none;
  border-collapse: collapse;
  margin-top: 1px;
  margin-bottom: 1px;
}

#category_common_table {
  background-color: #CCFFFF;
}

#category_industrial_table {
  background-color: #CCFFFF;
}

#category_business_table {
  background-color: #CCFFCC;
}

#category_data_table {
  background-color: #FFCC99;
}

#category_functional_table {
  background-color: #FF99CC;
}


#ma4title {
  font-family:Arial;
  color:olive;
  font-size:20pt;
  margin: 0 0 15pt 0;
  font-weight:bold;
}

.ma4h1 {
  font-family:Arial;
  color:olive;
  font-size:16pt;
  margin: 10pt 0 10pt 0;
  font-weight:bold;
}

#ma4corp {
  font-family:Arial;
  width: 300pt;
  height: 400pt;
  overflow: auto;
  border: solid olive 1px; 
  margin: 0 0 0 30px;
}

/* for only IE6,IE5 */
/* 修正検討中！ログインしたユーザのIE6上でのsearch_resuftsがおかしい！ */


/* Hides from IE5-mac \*/
* html body {width: 970px;}
* html #search_results {  width: 400px; }
* html .search_results {  width: 400px; }
* html #api { width: 950px; }
* html #left_api { width: 420px; }
* html #right_api { width: 420px; }
* html #right_form { width: 420px; }
* html #browse_histories { width: 400px; }
* html #left_form { width: 400px; }

/* End hide from IE5-mac */