@charset "shift-jis";
* { margin:0; padding:0;}
body { color:#333; background:#fff; font-family: Helvetica; margin: 0; padding: 0; -webkit-user-select: none; -webkit-text-size-adjust: none; }
img { border:0; }
a { color: #324f85; text-decoration:none; }
input[type="submit"] {font: 15px Helvetica; color: #555555; border: 1px solid #444444; display: inline-block; padding: 2px 12px; margin: 5px; -webkit-border-radius: 20px; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#CCCCCC))}
input[type="reset"] {font: 15px Helvetica; color: #555555; border: 1px solid #444444; display: inline-block; padding: 2px 12px; margin: 5px; -webkit-border-radius: 20px; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#CCCCCC))}
input,select {font-size: 15px; margin: 5px; color: #555555}
input[type="text"],input[type="password"] {font-size: 20px; margin: 5px; color: #555555}

ul + p, ul.data + p + p, ul.form + p + p { color:#4c566c; font: 14px Helvetica; text-align: center; text-shadow: white 0 1px 0; margin: 0 10px 17px 0; }

div#logo { display:block; width:100%; padding: 0; margin:0; text-align:center; }
div#header { display:block; width:100%; padding: 0; margin:0; min-height: 44px; text-align:center; -webkit-box-sizing: border-box; }


h1 {color: #fff; font: bold 15px/30px Helvetica; vertical-align:central; min-height:35px; background: -webkit-gradient(linear, 0% 0%, 0% 54%, from(#ADBBCC), to(#6D85A3), color-stop(.9,#7A90AB)); text-shadow: #2D3642 0 -1px 0; background-color:#06C;}

h4 {text-align: center; color:#fff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#EDEDED), color-stop(3%,#CCC), color-stop(51%,#959593), color-stop(51%,#848481), color-stop(100%,#666)); border-top: 1px solid #999; text-shadow: #666 0 1px 0; margin: 0; padding: 2px 10px; background-color:#06C;}

h4.news {text-align: center; color:#fff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#CBE1EF), color-stop(50%,#abd3ee), color-stop(51%,#89c3eb), color-stop(100%,#D4E3F7)); border-top: 1px solid #ccc; text-shadow: #666 0 1px 0; margin: 0; padding: 2px 10px;}

div#header a { color: #FFF; background: none; font: bold 12px/30px Helvetica; border-width: 0 5px; margin: 0; padding: 0 3px; width: auto; height: 30px; text-shadow: #2e3744 0 -1px 0; text-overflow: ellipsis; text-decoration: none; white-space: nowrap; position: absolute; overflow: hidden; top: 7px; right: 6px; -webkit-border-image: url(../images/toolButton.png) 0 5 0 5; }
div#header #backButton { left: 6px; right: auto; padding: 0; max-width: 55px; border-width: 0 8px 0 14px; -webkit-border-image: url(../images/backButton.png) 0 8 0 14; }


/***** section (base) ******/
div.data { background: #fff; border: 1px solid #B4B4B4; font: bold 15px Helvetica; text-align:center; padding: 10px; margin: 15px 10px 17px 0; -webkit-border-radius: 8px; }
div.data a { color: #324f85; text-decoration:none; }

/***** List (base) ******/
ul { color: black; background: #fff; border: 1px solid #B4B4B4; font: bold 14px Helvetica; padding: 0; margin: 5px 10px 5px 0; -webkit-border-radius: 8px; }
ul li { color: #666; border-top: 1px solid #B4B4B4; list-style-type: none; padding: 10px 10px 10px 10px; }
ul li p { font:14px Helvetica; font-weight:normal; color:#4c566c; margin:0; line-height:1.6; }

li:first-child { border-top: 0; -webkit-border-top-left-radius: 8px; -webkit-border-top-right-radius: 8px; }
li:last-child { -webkit-border-bottom-left-radius: 8px; -webkit-border-bottom-right-radius: 8px; }

/* universal arrows */
ul li.arrow { background-image: url(../images/chevron.png); background-position: right center; background-repeat: no-repeat; }

/* bg blue */
ul.news { background:#f7f9fa; }

/*  li 一覧を見る */
li.round a { display:block; background:#CFE8F5; border-top: 0; -webkit-border-radius: 6px; text-align:center; margin:1px 0;text-shadow: #aaa 0 1px 0; }

/* universal links on list */
ul li a, li.img a + a { color: #000; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; padding: 12px 10px 12px 10px; margin: -10px; -webkit-tap-highlight-color:rgba(0,0,0,0); }
ul li.img a + a { margin: -10px 10px -20px -5px; font-size: 15px; font-weight: bold; }
ul li.img a + a + a { font-size: 14px; font-weight: normal; margin-left: -10px; margin-bottom: -10px; margin-top: 0; }
ul li.img a + small + a { margin-left: -5px; }
ul li.img a + small + a + a { margin-left: -10px; margin-top: -20px; margin-bottom: -10px; font-size: 14px; font-weight: normal; }
ul li.img a + small + a + a + a { margin-left: 0px !important; margin-bottom: 0; }
ul li a + a { color: #000; font: 14px Helvetica; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; margin: 0; padding: 0; }
ul li a + a + a, ul li.img a + a + a + a, ul li.img a + small + a + a + a { color: #666; font: 13px Helvetica; margin: 0; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block; padding: 0; }

/* resize without labels */
ul li.arrow a { width: 95%; }

/* Normal lists  */
body#normal { margin: 0; padding: 0; background-color: #fff; }
body#normal ul { -webkit-border-radius: 0; margin: 0; border-left: 0; border-right: 0; border-top: 0; }
body#normal ul li { font-size: 16px; }
body#normal ul li small { font-size: 16px; line-height: 28px; }
body#normal li { -webkit-border-radius: 0; }
body#normal li em { font-weight: normal; font-style: normal; }
body#normal h4 + ul { border-top: 1px solid #989ea4; border-bottom: 1px solid #989ea4; }
body#normal div.data { margin-left:10px;}

/* option  */
ul.option { background: #eee; border: 1px solid #B4B4B4; padding: 0; margin: 15px 10px 17px 0; -webkit-border-radius: 8px; !important}
ul.option li a { color: #324f85; font:normal 13px Helvetica; list-style-type: none; padding: 10px; line-height:1.8; !important}
ul.option li p { font:13px Helvetica; font-weight:normal; color:#4c566c; margin:0; line-height:1.6; !important}

/***** FORMS *****/

/* fields list */
ul.form { }
ul.form li { padding: 7px 10px; }
ul.form li.center { text-align: center; }
ul.form li.error { border: 2px solid red; }
ul.form li.error + li.error { border-top: 0; }
ul.form li:hover { background: #fff; }
ul li input[type="text"], ul li input[type="password"], ul li textarea, ul li select { color: #777; background: #fff url(../.png); /* this is a hack due the default input shadow that iphones uses on textfields */ 
border: 0; font: normal 17px Helvetica; padding: 0; display: inline-block; margin-left: 0px; width: 100%; -webkit-appearance: textarea; }

ul li textarea { height: 120px; padding: 0; text-indent: -2px; }
ul li select { text-indent: 0px; background: transparent url(../images/chevron.png) no-repeat 103% 3px; -webkit-appearance:textfield; margin-left: -6px; width: 103%; }
ul li input[type="checkbox"], ul li input[type="radio"] { margin: 0; color: #324f85; padding: 10px 10px; }
ul li input[type="checkbox"]:after, ul li input[type="radio"]:after { content: attr(title); font: 17px Helvetica; display: block; width: 246px; margin: -12px 0 0 17px; }

/**** Info  ****/
ul.data li h4 { margin: 10px 0 5px 0; }
ul.data li p { text-align: left; font-size: 14px; line-height: 1.6; font-weight: normal; margin: 0; }
ul.data li p + p { margin-top: 5px; }
ul.data li { background: none; padding: 10px ; color: #222; }
ul.data li a { display: inline; color: #2E3744; text-decoration: underline; white-space:normal; !important}
		
ul li a img.ico, ul li img.ico { margin: 0 0 0 6px; }

/***** button bg *****/
.button { color: #fff; font: bold 20px/46px Helvetica; text-decoration: none; text-align: center; text-shadow: #000 0 1px 0; border-width: 0px 14px 0px 14px; display: block; margin: 3px 0; }
.green { -webkit-border-image: url(../images/greenButton.png) 0 14 0 14; color:#fff; }
.red { -webkit-border-image: url(../images/redButton.png) 0 14 0 14; color:#fff; }
.white { color: #000; text-shadow: #fff 0px 1px 0; -webkit-border-image: url(../images/whiteButton.png) 0 14 0 14; }
.black { -webkit-border-image: url(../images/grayButton.png) 0 14 0 14; color:#fff; }
.lime { -webkit-border-image: url(../images/chat_bubbles_lime_l.png) 10 10 13 19; }
.lemon { -webkit-border-image: url(../images/chat_bubbles_lemon_l.png) 10 10 13 19; background-color:#F9E128;}
.orange { -webkit-border-image: url(../images/chat_bubbles_orange_l.png) 10 10 13 19;  color:#fff;}
.aqua { -webkit-border-image: url(../images/chat_bubbles_aqua_l.png) 10 10 13 19;  color:#fff;}
.purple { -webkit-border-image: url(../images/chat_bubbles_purple_l.png) 10 10 13 19; }
.pink { -webkit-border-image: url(../images/chat_bubbles_pink_l.png) 10 10 13 19; color:#fff; background-color:#E68CBD;}
.graphite { -webkit-border-image: url(../images/chat_bubbles_graphite_l.png) 10 10 13 19; }
.clear { -webkit-border-image: url(../images/chat_bubbles_clear_l.png) 10 10 13 19; }

table.menu {border-collapse: collapse}
table.menu td {padding: 5px; height: 30px; border-collapse: collapse; border: 1px solid #EEEEEE;-webkit-tap-highlight-color:#BBB;}

/***** for mobile classses *****/
body.m {font-size: 20px; line-height: 1.3; font-family: Helvetica}
table.hf td {width: 50%}
table.qt td {width: 25%}
div.p {margin: 0 5px}
table.t {font-size: 20px; line-height: 1.1}
table.t td {padding: 5px}
table.h2 {color: #fff; font: bold 16px/30px Helvetica; background: -webkit-gradient(linear, 0% 0%, 0% 54%, from(#ADBBCC), to(#6D85A3), color-stop(.9,#7A90AB)); text-shadow: #2D3642 0 -1px 0}
table.h3 {color: #fff; font: bold 15px/26px Helvetica; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#EDEDED), color-stop(3%,#CCC), color-stop(51%,#959593), color-stop(51%,#848481), color-stop(100%,#666)); text-shadow: #666 0 1px 0}
a.abtn {font: 15px Helvetica; color: #555555; border: 1px solid #444444; display: inline-block; padding: 2px 12px; margin: 5px; -webkit-border-radius: 20px; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#CCCCCC))}
select.w150px {width: 150px;}
input[type="submit"].w70px {width: 70px;}
input[type="submit"].w150px {width: 150px;}
input[type="submit"].w200px {width: 200px;}
span.box-no {font-size:90%; display:inline-block; width:1em; text-align:center; border:1px solid #AAA; padding:2px; margin:0 2px;}
span.box-no-vote {font-size:90%; display:inline-block; width:1em; text-align:center; border:1px solid #AAA; padding:2px;}
td.vote-title {padding-top:7px !important;}

/***** for smart-phone live *****/
div.live {position:relative; height:0}
div.live a {position:absolute;right:10px;top:3px}

/* ＰＣサイトへのリンク */
ul#to-pc li {display:block;width:20em;margin:0.5em auto;padding:0.5em;border:solid 1px #b4b4b4;background:#eee;text-align:center;color:#000;font-size:1em !important;}
ul#to-pc li span {font-weight:normal;}
ul#to-pc li a {color:#06C;display:inline;}
/* 会員ランク */
ul.oppp { border-bottom:none; }
ul#login { padding:10px 10px 0; border-top:1px solid #CCC !important; border-bottom:1px solid #CCC !important; }
/*ul.data { border-top:1px solid #CCC !important; }*/
#login li { font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif; }
#login li.name {
  color:#444; font-weight:bold; font-size:16px; 
  margin:0 ; padding:3px 5px 1px;
  height:24px; line-height:24px;
}
#login li.welcome { font-size:12px; line-height:16px; padding:3px 5px; border-top:0; overflow:hidden;  }
#login span#pre_advance { float:left; display:inline-block; width:210px; }
#login span#advance {
  border:1px solid #E00; border-radius:4px; margin:0; padding: 2px;
  background:#F00; color:#FFF; font-weight:normal; font-size:10px; line-height:10px;
  display:inline-block;
}
#login li.welcome span#advance { float:right; }
#login li.link { font-size:12px; line-height:16px; padding:0 5px 3px; border-top:0; overflow:hidden; text-align:center; }
#login li.link a { font-weight:bold; font-family:inherit; font-size:16px; color:#06c; -webkit-tap-highlight-color:rgba(0,0,0,0.2); margin:0 -10px !important; padding:6px 10px !important; }
ul.data p.yen { padding-top:0; padding-bottom:0; }
div#rank {
  padding:5px 10px; border:0 !important;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffdd), to(#fffffc));
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}
#rank div#advance {
  display:inline-block;border:1px solid #E00; border-radius:4px; margin:0; padding: 4px;
  background:#F00; color:#FFF; font-weight:bold; font-size:14px; line-height:14px;
}
#rank ul, #rank li { border:none; font-weight:normal; color:#444; }
#rank ul.rank-inline    { height:30px; }
#rank ul.rank-inline li { float:left; margin-right:4px; }
#rank .ranking    { border-width:2px; border-radius:8px; margin: 2px 0 5px 0; }
#rank .ranking li {
  font-size:14px; line-height:24px;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}
#rank .now     { border-style:solid; padding:5px 10px 0; }
#rank .now  ul { background:transparent; }
#rank .now  li { padding:0; border:none; vertical-align:top; }
#rank .next    { border-style:dashed; padding:5px 10px; }
#rank .next ul { background:transparent; }
#rank .next li { padding:0; border:none; vertical-align:top; }
#rank .no-next    { border:none; }
#rank .no-next ul { background:transparent; }
#rank .no-next li {
  padding:0; border:none; vertical-align:top; font-size:14px; line-height:24px;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}
#rank .right   { text-align:right; font-size:14px; line-height:16px; }
#rank span.number {
  font-weight:bold; color:blue; font-size:16px;
  display:inline-block; vertical-align:top;
}
#rank span.sp { color:blue; }
#rank li.rank-name {
  font-weight:bold; font-size:16px; text-shadow: 0 1px 0 #666;
  display:inline-block; vertical-align:top;
}
#rank li.service-holder { display:inline-block; font-size:12px; line-height:12px; }
ul.rank-link { border-top:1px solid #B4B4B4 !important; }
ul.rank-link li.arrow a {
  color:#324F85; font-weight:normal; font-size:14px;
  -webkit-tap-highlight-color:#BBB; width:100%;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}
h4.rank {
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  text-align: center;
  color:#fff;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9d884), color-stop(50%,#bc9834), color-stop(50%,#b2892a), color-stop(100%,#efc44c));
  border-top: 1px solid #fff;
  border-bottom: 1px solid #ccc;
  text-shadow: #666 0 1px 0;
  margin: 0;
  padding: 2px 10px;
}
div.oppp { margin-bottom:0 !important; line-height:1.6 !important; }
div.oppp a.oppp { display:block; margin-top:6px; }
div.next { text-align:center; font: bold 15px Helvetica; line-height:23px; margin:10px 10px 0; }
div.mail { text-align:center; font: 12px Helvetica; color:#f00; line-height:12px; }
div.next img { vertical-align: -2px; }
div.next span.number { display:inline-block; margin:0 5px; }
div.link { font-size:12px; line-height:16px; padding:0 5px 8px; border-top:0; overflow:hidden; text-align:center; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif; }
div.link a { display:block; font-weight:bold; font-family:inherit; font-size:16px; color:#06c; -webkit-tap-highlight-color:rgba(0,0,0,0.2); margin:0 !important; padding:6px 0 !important; }

li.paragraph { height: 8px; padding: 0; }
li.other { padding: 5px 10px; }
li.other p { padding: 0 30px 0 5px; }
p.small { font-size: 12px; }

/* table 見出しがの文字がはみ出る @Android chrome */
table.t tr:first-child th span {line-height: 1.5em; }
