/* CSS Document */

* {margin:0;padding:0;font-size:16px;color:#000000;}
html,body {}

body{background:url(images/webview_back.png);}


/* iphoneクリック背景修正 */
a {
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}

/* 基本共通 */
div#content {width:100%;position:relative;}
.seri {
	position:fixed;
	z-index:2;
	width: 120px;
	height: 175px;
	right:0px;
	bottom: 5px;
}


div#left_align_box {
	margin: 10px;
	width: 70%; /*IE9未満とかプレフィックス使ってもだめなブラウザやOS対応*/
	widht: -webkit-calc(100% - 155px);/*Chrome19~25対応*/
	width: -moz-calc(100% - 155px);/*Firefox4~15対応*/
	width: calc(100% - 155px);

}



div#left_align_box h1 {
	display:block;
	position: relative;
	margin: 25px 0 10px;
	height: 38px;
	width: 100%;
	border-radius: 8px;
	background: #3083F0;
	color:#fff;
	font-size: 18px;
	box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.4),0px 0px 2px 2px rgba(251,159,187,0.4) inset; ;
}


div#left_align_box h1 span {
	height: 100%;
	padding-left:40px;
	padding-top: 9px;
	display: block;
	text-align: left;
	color:#fff;
}


div#left_align_box h2 {
	display:block;
	position: relative;
	padding: 3px 15px;
	width: 100%;
	box-sizing:border-box;
	background: #3083F0;
	color: #fff;
	border-radius: 15px;
	margin-top: 30px;	
}

/* アンカーをh2より少し上に */
div#left_align_box h2>a[name] {
	position:absolute;
	z-index:3;
	top: -20px;
	left:0;
}



/* 小項目リンクメニュ */
ul#menu {
	display: block;
	margin: 10px 0;
	list-style:none;
	width: 100%;
}

ul#menu li {
	display: inline-block;
	width: 165px;
	border: 1px solid #3083F0;
	border-radius: 15px;
	padding: 5px;
	margin: 5px;
	text-align: center;
	font-size: 14px;
}

ul#menu li a {
	text-decoration:none;
	color: #3083F0;
	display:block;
	width: 100%;
	text-align: center;
}

ul.long li {
	width: 220px !important;
}


/* ヘルプ一覧 */

.help_titleList>h2 {
	margin: 20px 0 !important;

}
.help_titleList>h2 a {
	color:#fff;	
}


/* ヘルプ詳細 */


#gotoList {
	width: 110px;
	position:fixed;
	z-index: 5;
	right: 14px;
	bottom: 200px;
}

#gotoList a {	
	text-align: center;
	padding: 4px 6px;
	border-radius:8px;
	background: #2197cf;
	font-size: 16px;
	color:#fff;
	text-decoration:none;
}


#gotoList a:before {
  content: "";
  position:absolute;
  bottom: -12px;
  left: 50%;
  margin-left: -10px;
  width: 0;
  height: 0;
  border-top: 10px solid #2197cf;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
}




.help-mark {
	background:url(../images/question_mark.png) 5px 4px no-repeat;	
}

div#left_align_box .help_body {
	width:90% ;
	margin: 10px 0 10px 20px;
	line-height :150%;
}

/* スカウト関係 */
.scout-mark {
	background:url(../images/ball_mark.png) 5px 4px no-repeat;	
}


table#rarity_rasio {
	width: 280px;
	margin: 25px 0 25px;
	border: 3px double #980e42; 
}

table#rarity_rasio th,
table#rarity_rasio td {
	padding: 2px 12px;
	border-bottom: 1px dotted #980e42;	
}

table#rarity_rasio tr:last-child th,
table#rarity_rasio tr:last-child td {
	border-bottom: none;
}

table#rarity_rasio td {
	text-align:right;	
}

table#rarity_rasio th {
	text-align:left;
}


ul#notice_list {
	margin-left: 20px;
	margin-top: 25px;
	list-style:disc;
	padding-left: 10px;	
}

ul#scout_players {
	list-style:none;
	margin-left: 0px;
	margin-top:25px;
	display:block;
	width: 100%;	
}

ul#scout_players li {
	display: inline-block;
	width: 140px;
	margin: 2px;
	background: #ffb7d2;
	padding: 3px 8px;	
}

ul#scout_players li.rarity_title_span {
	display:block;
	width:100%;
	background:none;
	padding: 13px 8px 1px 8px;
	font-weight:bold;
}

.goto_top {
	width: 100%;
	box-sizing:border-box;
	border-bottom: 1px dashed #593737;
	text-align: right;
}

.goto_top a {
	text-decoration:none;
}


/* 規約関係 */
div.lawBlock p {
	margin: 10px 0;	
}

ul.law {
	margin: 10px 0;
	padding: 4px;
	list-style:decimal !important;
	margin-left: 20px;
}

ul.law>li {
	padding-left:8px;
	margin-bottom: 10px;
	line-height:130%;
}

ul.lv2 {
	padding: 4px;

	margin-left: 30px;		
}


ul.lv2>li {
	list-style-type:none;
    list-style-position:outside;
	counter-increment: cnt;
	position: relative;
	margin-bottom: 10px;
	line-height:130%;
}

ul.lv2>li:before {
      display:block;
	  position:absolute;
	  left: -30px;
	  top:0;
	  z-index:2;
      content: "(" counter(cnt) ")";	
}


/* ランキング */

div.ranking_reward {
	width: 95%;
	margin: 40px auto;
}

div.ranking_rule {
	width: 95%;
	margin: 50px auto 30px;
}


h2.ranking_h2 {
	font-size: 18px;

	position: relative;
	text-indent:80px;
}

h2.ranking_h2 img {
	position:absolute;
	bottom:0;
	left:0;
	z-index:2;
	display: inline-block;
}

.winpoint_color {
	color:#1879b6 !important;
}

.popular_color {
	color:#c84184 !important;
}


.winpoint_box {
	width: 100%;
	
	border: 1px solid #26678a;
	border-radius: 10px;
	background : #cef5ff;
	box-shadow : 1px 3px 0 2px #26678a;	
}

.popular_box {
	width: 100%;
	
	border: 1px solid #c84184;
	border-radius: 15px;
	background : #ffe9fd;
	box-shadow : 1px 3px 0 2px #c84184;		
	
}



table.ranking_reward_table {
	width: 97%;
	margin: 10px auto;	
}

table.ranking_reward_table th {
	width: 27%;
	text-align: center;
	vertical-align:middle;
	padding: 4px 5px;
	font-size: 14px;
}

table.ranking_reward_table td {
	width: 73%;
	text-align:left;
	vertical-align:middle;
	border-bottom:1px dashed #26678a;
	padding: 4px 2px;
	font-size: 14px;
}

.winpoint_box table.ranking_reward_table th,
.winpoint_box table.ranking_reward_table td {
	border-bottom:1px dashed #26678a;
}

.popular_box table.ranking_reward_table th,
.popular_box table.ranking_reward_table td {
	border-bottom:1px dashed #c84184;
}

table.ranking_reward_table tr:last-child th,
table.ranking_reward_table tr:last-child td {
	border-bottom:none;
}


div.ranking_box {
	position:relative;
	width: 100%;
	border-radius: 15px;
	padding: 5px 0;	
}

.winpoint_rule_box {
	background: url(../images/back_winpoint.jpg) bottom repeat-x #a3edff;
}

.popular_rule_box {
	background: url(../images/back_popular.jpg) bottom repeat-x #ffddfc;
}

.rule_symbol {
	position: absolute;
	z-index:2;
	bottom: 15px;
	left: 10px;	
}

ul.rule_list {
	position: relative;
	list-style:disc;
	margin-left: 200px;
	padding: 25px 0 5px;
	
}

ul.rule_list li {
	margin: 4px;
	font-size: 14px;	
}

h2.ranking_rule2 {
	width: 100%;
	text-indent: 170px;
	font-size: 18px;
}

.rule_reward {
	display:block;
	margin-left: 170px;
	margin-bottom: 15px;
	padding: 4px 15px;
	width: 58%;
	border-radius:25px;	
	color: #fff;
	text-align: center;
	font-size: 14px;
}

.winpoint_back {
	background: #1879b6;	
}

.popular_back {
	background: #e27fd9;	
}

h2#ranking_notice {
	display:block;
	font-size: 18px;
	text-indent:30px;
	width: 100%;
	border-bottom: 2px solid #3f2b25;	
}

ul#bottom_notice_list {
	padding: 10px 10px 10px 30px;
	list-style:disc;
}

.half{
	display:block;   
	float: left;    
	width: 50%;
}