/*@charset "utf-8";*/

/* 全体 -------------------------------------------------------------- */
* {
    margin: 0;
    padding: 0;
    /* font-family: Arial, Helvetica, "メイリオ", Meiryo, sans-serif; */
    font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.4;
    color: #333333;
}

#container {
    min-width: 762px;   /* iPad mini3 の縦使いでちょうどいい感じ */
    max-width: 1280px;
    /* display: -webkit-box; */
    /* display: -moz-box; */
}

img {
    vertical-align: middle;
}

/* iframeタグ -------------------------------------------------------- */
iframe {
    border: none;
    overflow: hidden;
}

iframe.main {
    width: 100%;
}

iframe.control {
    height: 64px;
}

iframe#control_1 { width: 16%; }
iframe#control_2 { width: 25%; }
iframe#control_3 { width: 45%; }
iframe#control_4 { width: 12%; }

/*
iframe#control_1 { width: 116px; }
iframe#control_2 { width: 196px; }
iframe#control_3 { width: 340px; }
iframe#control_4 { width: 90%; white-space: nowrap; }
*/

/* bodyタグ ---------------------------------------------------------- */
body {
    /* margin: 2px; */
    padding: 4px;
    height: 100%;
}

body.year       { background-color: #E8E8FF; }
body.category   { background-color: #D8F8FF; }
body.word       { background-color: #D8FFC8; }
/* body.artistw    { background-color: #D8FFC8; } */
/* body.trackw     { background-color: #D8FFC8; } */

body.media      { background-color: #CCCCCC; }
body.artist     { background-color: #CCCCCC; }
body.individual { background-color: #EEEEEE; }
body.individual-disposed { background-color: #CCCCCC; }
body.individual-disclosed { background-color: #CC9999; }

body.recordedMode      { background-color: #EEEECC; }
body.storageSpace      { background-color: #EEEECC; }
body.produce            { background-color: #EEEECC; }
body.ldate            { background-color: #EEEECC; }
body.disclosed          { background-color: #CC9999; }

body.platform   { background-color: #D8F8FF; }

body.graph      { background-color: #EEEECC; }
body.award  { background-color: #EEEECC; }

body.vd_from_rv { background-color: #FFCCFF; }

/* a ----------------------------------------------------------------- */
a:link {
        color: #0000A7;
	text-decoration: none;
}
a:visited {
        color: #000097;
	text-decoration: none;
}
a:hover {
        color: #000066;
	text-decoration: none;
	background-color: #E7EEFF;
}
a:active {
        color: #FF3333;
	text-decoration: none;
	background-color: #E7EEFF;
}

/* strongタグ -------------------------------------------------------- */
strong {
    font-weight: bold;
}

/* hタグ ------------------------------------------------------------- */
h2 {
    font-size: 1.8em;
    font-weight: bold;
    margin: 4px 0;
    padding: 0 8px;
    /* background-color: #F7F7F7; */
    color: #666666;
}

h2.individual {  /* 個別表示用 */
    background-color:#F7F7F7;
    margin-left: 36px;
    width: 75%;
}

h3 {
    font-size: 1.4em;
    font-weight: bold;
    margin: 2px 24px;
    color: #333333;
}

h6 {
    font-size: 0.8em;
    /* margin: 2px 8px; */
    text-align: right;
    color: #333333;
}

/* テーブル ---------------------------------------------------------- */
table.main {  /* メインのリスト表示部 */
    margin-top: 6px;
    padding: 0;
    border-collapse: collapse;
    border: 2px solid #CCCCCC;
    width: 100%;
}

table.control {  /* アーティスト名 or 曲名 検索の制御用 */
    margin: 0;
    padding: 0;
    border-collapse: collapse;
    border: none;
    height: 48px;
}

tr {
    margin: 0;
    padding: 0;
}

tr.control {
    height: 24px;
    vertical-align: middle;
}

tr.levS { background-color: #FFCCFF; }
tr.levA { background-color: #FFFFCC; }
tr.levB { background-color: #FFFFFF; }
tr.levC { background-color: #FFFFFF; }
tr.levD { background-color: #FFFFFF; }
tr.levE { background-color: #FFFFFF; }
tr.levU { background-color: #E7E7E7; }
tr.levO { background-color: #E7E7E7; }
tr.levX { background-color: #D7D7D7;
          text-decoration: line-through;
}

tr.list { background-color: #FFFFFF; }
tr.list:nth-child(even) { background-color: #F7F7FF; } 

tr.sum  { background-color: #E7E7E7;
	  border-top: 2px solid #CCCCCC;
	}

th {
    vertical-align: top;
    font-weight: normal;
    text-align: left;
    color: #FFFFFF;
    background-color: #666666;
    border: 1px solid #CCCCCC;
}

td {
    border: 1px solid #CCCCCC;
    padding: 1px;
    border-collapse: collapse;
}

td.strike {
    background-color: #CCCCCC;
    border: 1px solid #CCCCCC;
    padding: 1px;
    border-collapse: collapse;
    text-decoration: line-through ;
    /* background-color: gray; */
}

td.control { /* 検索制御用 */
    border: none;
    padding: 0;
    display:table-cell;
    vertical-align: bottom;
    text-align: left;
}

td.controlC { /* 検索制御用 */
    border: none;
    padding: 0;
    display:table-cell;
    vertical-align: bottom;
    text-align: center;
}

td.controlLabel { 
    border: none;
    display:table-cell;
    vertical-align: bottom;
}

table.pageTitle {  /* ページタイトル */
    margin-top: 0;
    padding: 0;
    border-collapse: collapse;
    border: 0;
    width: 100%;
}

td.pageTitle {
    font-size: 1.8em;
    font-weight: bold;
    margin: 4px 0;
    padding: 0 8px;
    border: 0;
    /* background-color: #F7F7F7; */
    color: #666666;
}

td.lastMod {
    border: 0;
    font-size: 0.8em;
    /* margin: 2px 8px; */
    text-align: right;
    vertical-align: bottom;
    color: #333333;
}

table.formArea {
    width: 100%;
}

td.formArea1 {
    width: 1px;
}

td.formArea2 {
    width: 1px;
}




/* formタグ ---------------------------------------------------------- */
form {
    margin: 0px;
    padding: 0px;
    vertical-align: middle;
}

select {
    height: 100%;
    margin: 0px;
    padding: 0px;
    vertical-align: middle;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border:solid 1px #CCCCCC;
}

input.button {
    margin: 0px;
    padding: 0px;
    vertical-align: middle;
    border: none;
    color: #666666;
    font-size: 0.9em;
    text-align: right;
    text-valign: top;
}
input.button:active {
    border:darkcyan;
    border-width: 2px;
    -webkit-box-shadow:inset 0px 0px 8px #334c66;
    -moz-box-shadow:inset 0px 0px 2px #3a6da0;
    box-shadow:inset 0px 0px 2px #3a6da0;    
}


input.control {
    margin: 0px;
    padding: 0px;
    vertical-align: middle;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border:solid 1px #CCCCCC;
    width: 140px;
}
input.control::-webkit-input-placeholder {
    color: #DFDFDF;
    font-weight: normal;
}
input.control:-ms-input-placeholder {
    color: #DFDFDF;
    font-weight: normal;
}
input.control::-moz-placeholder {
    color: #DFDFDF;
    font-weight: normal;
}


input.control:focus {
    border:solid 1px #3333CC;
}

option.nintendo {
    background-color: #FFE7FF;
}
option.sce {
    background-color: #E7FFFF;
}
option.apple {
    background-color: #FFFFE7;
}
option.oldpf {
    background-color: #E7E7E7;
}


/* pre --------------------------------------------------------------- */
pre {
    color: #666666;
    margin-top: 2px;
    margin-left: 2px;
    margin-bottom: 2px;
    margin-right: 2px;
}

/* リスト ------------------------------------------------------------ */
dl.individual {
    margin-left: 24px;
}

dt.individual {  /* 個別表示用（項目見出しで使用） */
    font-size: 1.1em;
    color: #333333;
    margin-top: 4px;
    margin-left: 12px;
}

dd.individual {  /* 個別表示用 */
    background-color:#F7F7F7;
    margin-left: 36px;
    width: 75%;
}

dd.dischead {  /* 個別表示用（複数ディスクの見出しで使用） */
    background-color:#DDDDDD;
    margin-left: 36px;
    width: 75%;
}

dd.alert {  /* 個別表示用 （警告）*/
    background-color:#FF3333;
    margin-left: 36px;
    width: 75%;    
}

dl.award {
    margin-left: 24px;
}

dt.award {
    font-size: 1.2em;
    font-weight: bold;
    color: #333333;
    margin-top: 8px;
    margin-left: 12px;    
}

dd.award {
    background-color:#FFFFFF;
    margin-left: 36px;
    margin-bottom: 4px;
    width: 75%;
}

li.individual {
    font-size: 1.4em;
    font-weight: bold;
    color: #333333;
    margin-top: 8px;
    margin-left: 12px;       
}


/* jQueryツールチップ ------------------------------------------------- */
/*
div.tooltip-contents { 
    padding: 10px;
    border: 1px solid #009966;
}

div.tooltip-note { 
    padding: 1px;
    border: 10px solid #669900;
}

.ui-tooltip {
    border-radius: 3px;
    background: black;
}
*/

/* グラフ表示 --------------------------------------------------------- */
img.graph {
    min-width: 762px;
}

/* アイコン ----------------------------------------------------------- */
img.hf_icon {
    width: 20px;
    height: 20px;
}

img.award {
    vertical-align: middle;
}

/* トップページ ------------------------------------------------------- */
/* ページ幅 最小幅 762px、タイトル画像 640px */
div.normal {
    width: 762px;
    margin: 0 auto 0 auto;
}


div.maintitle {
    padding: 20px;
}

img.top_title {
    padding: 20px 0;
}

div.topmsg {
    max-width: 640px;
}

dl.top {
    margin-left: 24px;
}

dt.top {  /* トップページ用 */
    font-size: 18px;
    color: #333333;
    margin-top: 4px;
    margin-left: 12px;
}

dt.top a {
    font-size: 18px;
}

dd.top {  /* トップページ用 */
    background-color:#F7F7F7;
    margin-left: 36px;
    width: 584px;
    height: 36px;
}

dd.topmod {  /* トップページ用 */
    /* background-color:#F7F7F7; */
    background-color:#FFFFFF;
    margin-left: 420px;
    width: 200px;
    text-align: right;
}

/* gadgets ----------------------------------------------------------- */
div.gadgets {
    margin: 24px 48px;
}

img.gadgets-title {
    margin: 24px 36px;
}

table.gadgets {
    margin-left: 36px;
    margin-bottom: 48px;
    width: 80%;
}

td.gadgets-subtitle {
    border: none;
    background-color:#C7F7C7;
    font-size: 1.4em;
    font-weight: bold;
    margin-left: 48px;
    margin-top: 32px;
    width: 75%;
}

td.gadgets {
    border: none;
    /* background-color:#F7F7F7; */
    margin: 0 48px;
    padding-bottom: 32px;
    width: 75%;
}
p.gadgets:first-letter {
    font-weight: bold;
    color: #666699;
    font-size: 1.5em;
    line-height: 1.2;
    background-color:#fff7f7;
    margin-top: 10px;
    /* float: left; */
    /* padding: 1px; */
}

img.gadgets-photo {
    float: right;
    margin: 2px 0 8px 12px;
}

table.gadgets-spec {
    float: right;
    margin: 2px 0 8px 12px;
    max-width: 400px;
}

td.spec1 {
    
}

ul.history {
    margin-left: 36px;
}


/* ヘッダ、フッタ ----------------------------------------------------- */
iframe.hf {
    height: 36px;
    width: 100%;
}

body.hf {
    margin: 0;
    padding: 0 2px;
    /* background-color:#B7B7CC; */
    background-color: #f1a899;
    text-align: left;
}
body.hf_local {
    margin: 0;
    padding: 0 2px;
    background-color: #FF3333;
    text-align: left;
}

table.hf {
    width: 100%;
}
td.hf_left {
    border: none;
    float: left;
    text-align: left;
}
td.hf_right {
    border: none;
    float: right;
    text-align: right;
}
div.hf_main_title {
    font-size: 1.1em;
    font-weight: bold;
    color: #FFFFFF;
}
div.hf_sub_title {
    font-size: 0.7em;
    font-weight: bold;
    color: #666666;
}

div.hf_shortcuts {
    font-size: 0.7em;
    height: 36px;
    display: table-cell;
    vertical-align: bottom;
}

/* ページトップ ------------------------------------------------------- */
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 5.0em;
}
#page-top a {
    background: #666666;
    text-decoration: none;
    color: #FFFFFF;
    width: 100px;
    padding: 12px 2px;
    text-align: center;
    display: block;
    border-radius: 10px;
    opacity: 0.8;
    -moz-opacity:0.8;
}
#page-top a:hover {
    text-decoration: none;
    background: #999999;
    opacity: 0.6;
    -moz-opacity:0.6;
}

/*
hr {
	margin: 2px;
	color: #CCCCFF;
	background-color: #CCCCFF;
	top: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #CCCCFF;
	border-right-color: #CCCCFF;
	border-bottom-color: #CCCCFF;
	border-left-color: #CCCCFF;
}
.marurin {
	color: #009966;
}


.header {
	margin-left: 40%;
	border-bottom-color: #CCCCFF;
	border-bottom-style: solid;
	border-bottom-width: thin;
	margin-bottom: 8px;
	font-size: xx-small;
	color: #999999;
}

h5 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	font-weight: normal;
	border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-top-color: #CCCCFF;
	border-right-color: #CCCCFF;
	border-bottom-color: #CCCCFF;
	border-left-color: #CCCCFF;
	margin-top: 2px;
	margin-right: 40%;
	margin-bottom: 2px;
	margin-left: 2px;
}
ul {
	margin: 1px;
}
*/

/*
div.a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #666666;
	text-decoration: none;
	cursor: hand;
}

div.a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #6699FF;
	text-decoration: underline overline;
	cursor: hand;
}
img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
.footer {
	border-top-width: thin;
	border-top-style: solid;
	border-top-color: #CCCCFF;
	margin-top: 8px;
	margin-right: 20%;
	font-size: xx-small;
	color: #999999;
}
*/

/* 曲名表示ツールチップ */

/*
#track a {
  position:relative;
}

#track a:hover {
  background: #ffcccc;
  z-index: 2;
}

a.track-tooltip span {
  display:none;
  position: absolute;
  z-index: 1;
  top: 1.3em;
  left: 1.3em;
  padding:2px 3px;
  margin-left:8px;
  min-width: 24em;
}

a.track-tooltip:hover span{
  display:inline;
  position: absolute;
  z-index: 9999;
  position:absolute;
  border:1px solid #cccccc;
  background:#ffffff;
  color:#6c6c6c;
}
*/

/* コメント表示ツールチップ */
/*
#comment a {
  position:relative;
}

#comment a:hover {
  background: #ffcccc;
  z-index: 2;
}

a.comment-tooltip span {
  display:none;
  position: absolute;
  z-index: 1;
  top: 1.3em;
  right: 1.3em;
  padding:2px 3px;
  margin-left:8px;
  width: 24em;
}

a.comment-tooltip:hover span{
  display:inline;
  position: absolute;
  z-index: 9999;
  position:absolute;
  border:3px solid #66cc99;
  background:#ffffff;
  color:#6c6c6c;
}

*/