@charset "utf-8";

/* html, body
---------------------------------------------------------------------------------------------------------- */
html, body {
	font-family: "メイリオ", "Meiryo", verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
	color:#333;
	background-color:#cdedf5;
	moz-text-size-adjust:none;
	-ms-text-size-adjust:100%;
	-webkit-text-size-adjust:100%;
	text-size-adjust:100%;
}

body {min-width:1050px;}

/* リンク
---------------------------------------------------------------------------------------------------------- */
a:link {color:#333; text-decoration:none;}
a:visited {color:#333; text-decoration:none;}
a:hover {color:#09f; text-decoration:none;}
a:active {color:#333; text-decoration:none;}
a:focus {color:#333; text-decoration:none;}
a img {border:none;}

/* 共通クラス
---------------------------------------------------------------------------------------------------------- */
.clear-both {clear:both;}

.clearFix:after{
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
	content:".";
}

.tt_out {
	height:1px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	margin:20px auto 0 auto;
}

.fc_red    { color: #FF0000; font-weight: bold;}
.fc_orange { color: #ff9900; font-weight: bold;}
.fc_pink   { color: #ff99cc; font-weight: bold;}
.fc_blue   { color: #0000f0; font-weight: bold;}
.fc_dp-blue{ color: #000080; font-weight: bold;}

/* ページ毎設定
---------------------------------------------------------------------------------------------------------- */
/* body > ページ毎の背景設定 (ページタイトル(h2)&logo背景ぼかし, キャラクター画像, メイン背景(下層は共通), g-nav背景(下層は共通) */
#bg-top {background:url(../images/top/bg_main.jpg) no-repeat center top, url(../images/g-nav/bg_box.png) repeat-x left 40px}
#bg-information {background:url(../images/information/bg_h2.png) no-repeat center top, url(../images/information/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center top, url(../images/g-nav/bg_box.png) repeat-x left 40px}
#bg-informationhg {background:url(../images/information/bg_h2.png) no-repeat center top, url(../images/information/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center 40px}
#bg-character {background:url(../images/character/bg_h2.png) no-repeat center top, url(../images/character/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center top, url(../images/g-nav/bg_box.png) repeat-x left 40px}
#bg-characterhg {background:url(../images/character/bg_h2.png) no-repeat center top, url(../images/character/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center 40px}
#bg-guide {background:url(../images/guide/bg_cara.png) no-repeat center top, url(../images/page-common2/bg_main.jpg) no-repeat center 40px}
#bg-shop {background:url(../images/shop/bg_h2.png) no-repeat center top, url(../images/shop/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center top, url(../images/g-nav/bg_box.png) repeat-x left 40px}
#bg-support {background:url(../images/support/bg_h2.png) no-repeat center top, url(../images/support/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center top, url(../images/g-nav/bg_box.png) repeat-x left 40px}
#bg-faq {background:url(../images/faq/bg_cara.png) no-repeat center top, url(../images/page-common2/bg_main.jpg) no-repeat center 40px}
#bg-news {background:url(../images/news/bg_h2.png) no-repeat center top, url(../images/news/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center top, url(../images/g-nav/bg_box.png) repeat-x left 40px}
#bg-newshg {background:url(../images/news/bg_h2.png) no-repeat center top, url(../images/news/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center 40px}
#bg-regulations {background:url(../images/regulations/bg_h2.png) no-repeat center top, url(../images/regulations/bg_cara.png) no-repeat center top, url(../images/page-common/bg_main.jpg) no-repeat center top, url(../images/g-nav/bg_box.png) repeat-x left 40px}
#bg-play {background:url(../images/guide/bg_cara.png) no-repeat center top, url(../images/page-common2/bg_main.jpg) no-repeat center 40px}

/* グローバルナビ部分 > ページ毎背景 */
#header-top {background:url(../images/g-nav/bg_top.png) no-repeat center top; margin:0 0 130px 0;}
#header-page {background:url(../images/g-nav/bg_page.png) no-repeat center top; margin:0 0 0 0;}


/* header
---------------------------------------------------------------------------------------------------------- */
/* ヘッダーロゴ */
#hd_logo {
	float:left;
	width:300px;
	height:270px;
	background:url(../images/logo.png) no-repeat;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
}

#hd_logo a{
	float:left;
	width:300px;
	height:270px;
}

#hd_logo:hover{
	filter: alpha(opacity=85);
	-ms-filter:"alpha(opacity=85)";
	-moz-opacity:0.85;
	-khtml-opacity:0.85;
	opacity:0.85;
}

#header_box {
	overflow:hidden;
	width:1000px;
	margin:0 auto;
}

/* グローバルナビ */
.g-nav {
	list-style-type:none;
	float:right;
}

.g-nav li{
	float:left;
}

.g-nav a:hover {
	filter: alpha(opacity=70);
	-ms-filter:"alpha(opacity=70)";
	-moz-opacity:0.7;
	-khtml-opacity:0.7;
	opacity:0.7;
}

/* パンくずリスト
---------------------------------------------------------------------------------------------------------- */
/* 下層ページ用パンくずリスト */
#pankuz {
	float:right;
	margin:10px 61px;
	height:18px;
	font-size:85%;
}

#pankuz li{
	float:left;
	margin:0 7px 0 0;
	color:#555;
}

#pankuz li a{
	color:#069;
}

#pankuz li:nth-child(odd){
	line-height:15px;
	font-weight:bold;
}


/* ページャー (wordpressの投稿)
---------------------------------------------------------------------------------------------------------- */
/* キャラクター */
#wp_pager_box {
	width:700px;
	margin:0 auto;
	overflow:hidden;
}

#wp_pager_box ul{
	font-size:93%;
	font-weight:bold;
	text-align:center;
	margin:10px 0;
}

#wp_pager_box li {
	display:inline-block;
	height:35px;
	line-height:35px;
	margin:0 -2px;
	padding:0 6px;
	background:url(../images/page-common/bg_pager_border.gif), url(../images/page-common/bg_pager_border.gif);
	background-repeat:repeat-x, repeat-x;
	background-position:left top, left bottom;
	background-color:#fff;
}

#wp_pager_box li a{
	display:inline-block;
	height:35px;
	line-height:35px;
	margin:0 -2px;
	padding:0 6px;
	background:url(../images/page-common/bg_pager_border.gif), url(../images/page-common/bg_pager_border.gif);
	background-repeat:repeat-x, repeat-x;
	background-position:left top, left bottom;
	background-color:#fff;
	color:#069;
}

#wp_pager_box li:first-child{
	padding:0 6px 0 20px;
}
#wp_pager_box li:last-child{
	padding:0 20px 0 6px;
}

/* NEWS */
#wp_pager_box2 {
	width:700px;
	margin:0 auto;
	overflow:hidden;
}

#wp_pager_box2 ul{
	font-size:93%;
	font-weight:bold;
	text-align:center;
	margin:0 0 30px 0;
}

#wp_pager_box2 li {
	display:inline-block;
	height:35px;
	line-height:35px;
	margin:0 -2px;
	padding:0 6px;
	background:url(../images/page-common/bg_pager_border.gif), url(../images/page-common/bg_pager_border.gif);
	background-repeat:repeat-x, repeat-x;
	background-position:left top, left bottom;
	background-color:#fff;
}

#wp_pager_box2 li a{
	display:inline-block;
	height:35px;
	line-height:35px;
	margin:0 -2px;
	padding:0 6px;
	background:url(../images/page-common/bg_pager_border.gif), url(../images/page-common/bg_pager_border.gif);
	background-repeat:repeat-x, repeat-x;
	background-position:left top, left bottom;
	background-color:#fff;
	color:#069;
}

#wp_pager_box2 li:first-child{
	padding:0 6px 0 20px;
}
#wp_pager_box2 li:last-child{
	padding:0 20px 0 6px;
}

/* ゲームスタート ボタン
---------------------------------------------------------------------------------------------------------- */
/* 3カラム TOPページ用 */
#gm-st {
	width:1080px;
	height:250px;
/*
	height:300px;
*/
	margin:-90px auto 0 auto;
}

#gm-st div.btn-game-start{
	margin-left: 55px;
}
#gm-st btn.play{
	width:203px;
	height:207px;
	display: none;
/*
	display: inline-block;
*/
	background:url(../images/bt_gm-st.png);
	background-size: contain;
}
#gm-st btn.play:hover{
	background:url(../images/bt_gm-st_over.png);
	background-size: contain;
}
#gm-st btn.client{
	width:160px;
	height:160px;
	display: inline-block;
	background:url(../images/exe/bt_gm-st_client.png);
	background-size: contain;
}
#gm-st btn.client:hover{
	background:url(../images/exe/bt_gm-st_client_on.png);
	background-size: contain;
}
#gm-st btn.browser{
	width:160px;
	height:160px;
	display: inline-block;
	background:url(../images/exe/bt_gm-st_browser.png);
	background-size: contain;
}
#gm-st btn.browser:hover{
	background:url(../images/exe/bt_gm-st_browser_on.png);
	background-size: contain;
}

#gm-st div.btn-game-download{
	margin-left:50px;
}
#gm-st btn.download{
	width:210px;
	height:71px;
	display: inline-block;
	background:url(../images/exe/clientdl.png);
	background-size: contain;
}
#gm-st btn.download:hover{
	background:url(../images/exe/clientdl_on.png);
	background-size: contain;
}


/* 2カラム 下層ページ用 */
#gm-st-page {
	position:relative;
	width:205px;
	height:190px;
	margin:70px 0 -150px 47px;
	z-index:999;
}

#gm-st-page div.btn-game-start{
}
#gm-st-page btn.play{
	width:203px;
	height:207px;
	display: inline-block;
	background:url(../images/bt_gm-st.png);
	background-size: contain;
}
#gm-st-page btn.play:hover{
	background:url(../images/bt_gm-st_over.png);
	background-size: contain;
}
#gm-st-page btn.client{
	display: none;
}
#gm-st-page btn.browser{
	display: none;
}
#gm-st-page div.btn-game-download{
	display: none;
}

/*<!-- ▼事前登録期間終了後削除 -->*/

/* 事前登録 ボタン 
---------------------------------------------------------------------------------------------------------- */
/* 3カラム TOPページ用 */
/*#gm-st {
	width:1016px;
	height:240px;
	margin:-108px auto -7px auto;
}

#gm-st h2{
	width:240px;
	height:220px;
	background:url(../images/btn_login.png);
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
}

#gm-st a{
	float:left;
	width:220px;
	height:240px;
}

#gm-st h2:hover{
	width:240px;
	height:220px;
	background:url(../images/btn_login.png) 0 220px;
}


#gm-st-page {
	position:relative;
	width:240px;
	height:220px;
	margin:59px 0 -177px 24px;
	z-index:999;
}

#gm-st-page h2{
	width:240px;
	height:220px;
	background:url(../images/btn_login.png);
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
}

#gm-st-page a{
	float:left;
	width:240px;
	height:220px;
}

#gm-st-page h2:hover{
	width:240px;
	height:220px;
	background:url(../images/btn_login.png) 0 220px;
}
*/
/*<!-- ▲事前登録期間終了後削除 -->*/

/* content-BOX
---------------------------------------------------------------------------------------------------------- */
/* コンテンツBOX (3カラム用) */
#content {
	position:relative;
	width:1010px;
	overflow:hidden;
	margin:0 auto 20px auto;
}

/* left-box (3カラム用) */
#content-left {
	float:left;
	width:238px;
}

/* center-BOX (3カラム用)*/
#content-main {
	float:left;
	width:500px;
	margin:0 0 0 20px;
}

/* right-BOX (3カラム用)*/
#content-right {
	float:right;
	width:232px;
}

/* コンテンツBOX (2カラム用) */
#content-page {
	position:relative;
	width:1050px;
	overflow:hidden;
	margin:-85px auto 30px auto;
}

/* left-box (2カラム用) */
#content-left-page {
	float:left;
	width:238px;
	margin:0 0 0 25px;
}
/* right-BOX (2カラム用) */
#content-main-page {
	float:right;
	width:787px;
	margin:10px 0 9px 0;
	background:url(../images/page-common/bg_center.png);
	background-repeat:repeat-y;
	background-position:center center;
}

#content-main-page-bg {
	position:relative;
	float:right;
	width:787px;
	background: url(../images/page-common/bg_top.png), url(../images/page-common/bg_bottom.png);
	background-repeat: no-repeat, no-repeat;
	background-position: center top, center bottom;
}

#kazari-top {
	position:absolute;
	left:20px;
	top:-2px;
}

#kazari-bottom {
	position:absolute;
	left:20px;
	bottom:-1px;
}

/* コンテンツBOX (ハンゲーム情報Box用) */
#content-hg-newsbox {
	position:relative;
	width:400px;
	overflow:hidden;
	margin:0;
}

/* center-BOX (ハンゲーム情報Box用)*/
/*#content-hg-newsbox-main {
	float:left;
	width:500px;
	margin:0 0 0 20px;
}*/

/* content-sidebar [left]
---------------------------------------------------------------------------------------------------------- */
/* 3カラム TOPページ用 */
#content-left {
	background:url(../images/side-left/bg_top.png),url(../images/side-left/bg_bottom.png);
	background-repeat:no-repeat, no-repeat;
	background-position:center top, center bottom;
}

#content-left ul {
	list-style:none;
	width:230px;
	overflow:hidden;
	margin:13px auto;
	background:url(../images/side-left/bg_center.png) repeat-y -4px;
}

#content-left li {
	margin:0 0 10px 0;
}

#content-left li:nth-child(1) {
	margin:0 0 6px 0;
}

#content-left li:nth-child(2) {
	margin:0 0 7px 0;
}

#content-left li:last-child {
	margin:0 0 3px 0;
}

#content-left li img{
	display:block;
	margin:0 auto;
	vertical-align:bottom;
}

/* 2カラム 下層ページ用 */
#sidebar-page {
	list-style:none;
	width:230px;
	overflow:hidden;
	margin:158px auto 0 auto;
	background:url(../images/side-left/bg_center.png) repeat-y -4px;
}

#sidebar-page li {
	margin:0 0 10px 0;
}

#sidebar-page li:nth-child(1) {
	margin:0 0 6px 0;
}

#sidebar-page li:nth-child(2) {
	margin:0 0 7px 0;
}

#sidebar-page li img{
	display:block;
	margin:0 auto;
	vertical-align:bottom;
}

#content-left-page {
	background:url(../images/side-left/bg_top.png);
	background-repeat:no-repeat;
	background-position:center top;
}

#content-left-page h2 {
	padding:0;
	width:190px;
	height:54px;
	margin:20px auto 0 auto;
}

/* ナビゲーション リスト */
#content-left-page-nav {
	list-style:none;
	width:190px;
	overflow:hidden;
	background:url(../images/side-left/bg_nav_bottom.jpg),url(../images/side-left/bg_nav_main.jpg);
	background-repeat:no-repeat, repeat-y;
	background-position:center bottom,center top;
	margin:0 auto 15px auto;
	padding:15px 0 0 0;
	font-size:93%;
}

#content-left-page-nav li {
	width:162px;
	margin:0 auto;
}

#content-left-page-nav li a{
	display:block;
	background:url(../images/side-left/icon_arrow.png), url(../images/side-left/icon-page-nav-line.png);
	background-repeat:no-repeat, no-repeat;
	background-position:3px, center top;
	background-size:11px 10px, 162px 2px;
	padding:13px 1em 12px 23px;
	line-height:1.4;
	font-weight:bold;
}

#content-left-page-nav li a:hover{
	display:block;
	background-color:#85d3f3;
	color:#06639c;
	background:url(../images/side-left/icon_arrow_over.png), url(../images/side-left/icon-page-nav-line.png);
	background-repeat:no-repeat, no-repeat;
	background-position:3px, center top;
	background-size:11px 10px, 162px 2px;
	background-color:#85d3f3;
}

#content-left-page-nav li:last-child {
	display:block;
	background:url(../images/side-left/icon-page-nav-line.png) no-repeat center bottom;
	background-size:162px 2px;
	margin:0 auto 52px auto;
	padding:0 0 2px 0;
}

/* ナビゲーション カレント */
.content-left-page-nav_current {
	background-color:#85d3f3 !important;
}

.content-left-page-nav_current a{
	color:#06639c;
	background:url(../images/side-left/icon_arrow_over.png), url(../images/side-left/icon-page-nav-line.png) !important;
	background-repeat:no-repeat, no-repeat !important;
	background-position:3px, center top !important;
	background-size:11px 10px, 162px 2px !important;
	background-color:#85d3f3;
}

#content-left-page-bg {
	overflow:hidden;
	width:238px;
	margin:30px 0;
	background:url(../images/side-left/bg_center.png) repeat-y;
	padding-bottom: 32768px;
	margin-bottom: -32768px;
}

#side-bottom {
	position:absolute;
	bottom:-1px;
	left:25px;
}

/* content-sidebar [right]
---------------------------------------------------------------------------------------------------------- */
#content-right ul {
	list-style:none;
}

#content-right li {
	margin:0 0 10px 0;
}

/* TW タイムライン */
#content-right #tw-timeline {
	width:220px;
	background-color:rgba( 204, 255, 204, 0.2 );
	padding:0 10px;
}

/* SNS シェアボタン */
#content-right #share {
	position:relative;
	width:232px;
	height:60px;
	background:url(../images/side-right/bg_sns.png);
}

#content-right #share #bt_fb {
	position:absolute;
	top:16px;
	right:67px;
}

#content-right #share #bt_tw {
	position:absolute;
	top:16px;
	right:25px;
}

#content-right a:hover img{
	filter: alpha(opacity=85);
	-ms-filter:"alpha(opacity=85)";
	-moz-opacity:0.85;
	-khtml-opacity:0.85;
	opacity:0.85;
}

/* footer > 規約リスト＆動作環境マップ
---------------------------------------------------------------------------------------------------------- */
#footer-list {
	clear:both;
/*
	height:227px;
*/
	background-color:#0a1c24;
	margin:0 auto;
	filter: alpha(opacity=88);
	-ms-filter:"alpha(opacity=88)";
	-moz-opacity:0.88;
	-khtml-opacity:0.88;
	opacity:0.88;
}

#footer-list_box {
	position:relative;
	width:1000px;
	margin:0 auto;
}

/* 規約リスト */
#footer-list_box ul{
	list-style:none;
	text-align:center;
	padding:20px 0 0 0;
}

#footer-list_box li{
	display:inline;
}

#footer-list_box li a{
	border-right:1px solid #fff;
	padding:1px 35px;
	color:#fff;
}

#footer-list_box  li:last-child a{
	border-right:none;
}

#footer-list_box li a:hover{
	color:#09F;
}

/* 動作環境マップ */
#operating-map {
	width:878px;
	height:151px;
	background:url(../images/footer/bn_operating-map.jpg) no-repeat;
	margin:18px auto 0 auto;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
	-webkit-box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
	-moz-box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
}

#operating-browser {
	position: relative;
	width:878px;
	height:151px;
	background:url(../images/exe/operating-environment_browser.jpg) no-repeat;
	margin:18px auto 0 auto;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
	-webkit-box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
	-moz-box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
}
#operating-client {
	position: relative;
	width:878px;
	height:221px;
	background:url(../images/exe/operating-environment_client.jpg) no-repeat;
	margin:18px auto 0 auto;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
	-webkit-box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
	-moz-box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
}
#operating-environment {
	position: relative;
	width:878px;
	height:221px;
	background:url(../images/exe/operating-environment.jpg) no-repeat;
	margin:18px auto 0 auto;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
	-webkit-box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
	-moz-box-shadow:rgba(59, 119, 143, 0.398438) 0px 0px 6px 2px;
}

#adobe-link a{
	position:absolute;
	bottom:21px;
	right:190px;
	display:block;
	width:30px;
	height:13px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
}
#adobe-link a:hover{
	background-color:#06F;
	filter:alpha(opacity=30);
	-ms-filter:"alpha(opacity=30)";
	-moz-opacity:0.3;
	-khtml-opacity:0.3;
	opacity:0.3;
}

#vc-link a{
	position:absolute;
	bottom:40px;
	right:245px;
	display:block;
	width:30px;
	height:13px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
}
#vc-link a:hover{
	background-color:#06F;
	filter:alpha(opacity=30);
	-ms-filter:"alpha(opacity=30)";
	-moz-opacity:0.3;
	-khtml-opacity:0.3;
	opacity:0.3;
}

#netfw-link a{
	position:absolute;
	bottom:20px;
	right:245px;
	display:block;
	width:30px;
	height:13px;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
}
#netfw-link a:hover{
	background-color:#06F;
	filter:alpha(opacity=30);
	-ms-filter:"alpha(opacity=30)";
	-moz-opacity:0.3;
	-khtml-opacity:0.3;
	opacity:0.3;
}

/* footer > コピーライト
---------------------------------------------------------------------------------------------------------- */
#footer {
	clear:both;
	height:100px;
	/*background-color:#0c1a1e;*/
	background-color:#000;
	margin:0 auto;
}

#footer_box {
	width:1200px;
	margin:0 auto;
}

#footer_box a{
	color:#ccc;
	font-style:normal;
	font-weight:100;
	font-size:85%;
}

#footer_box ul li{
	float:left;
	list-style:none;
}

#footer_box li {
	margin:0 30px 0 0;
}

#footer_box address{
	float:right;
	text-align:right;
	margin:8px 0 0 0;
	line-height:1.5;
}