﻿@charset 'utf-8';

@media only screen and (min-width:641px) {

/* TOP
---------------------------------------------------------------------------------------------------------- */
/* キービジュアル */
#kv-top {
	width:100%;
	max-width:2560px;
	height:690px;
	background:url(../img/top/bg_release.png) no-repeat center bottom, url(../img/top/bg_pt-black.png) repeat-x center bottom, url(../img/common/key-visual.jpg) no-repeat center center;
	font-size:0;
	margin:0 auto;
}

/* キービジュアル（BOX） */
#kv-top_box {
	position:relative;
	width:1280px;
	height:690px;
	margin:0 auto;
}

/* logo */
#kv-top_box #logo a {
	position:absolute;
	bottom:20px;
	left:-5px;
	width:512px;
	height:200px;
	background:url(../img/common/logo.png) no-repeat center center;
}

#kv-top_box a:hover {opacity:0.7;}

/* リリース（BOX） */
#release-sp_wrapper {display:none;}
#release-pc {position:absolute; right:0; bottom:0; width:660px; height:193px;}

/* 好評配信中!! */
#release-pc h2 {position:absolute; left:235px; top:0px;}

#release-pc p img {width:200px; height:auto; -webkit-backface-visibility:hidden; backface-visibility:hidden;}

/* App Store（ボタン） */
#release-ios a {position:absolute; right:240px; bottom:49px; cursor:pointer;}

/* Google Play（ボタン） */
#release-and a {position:absolute; right:22px; bottom:49px; cursor:pointer;}

/* Register（ボタン） */
#release-register a {position:absolute; right:22px; bottom:35px; cursor:pointer;}
#release-register a img {width:404px; height:auto; -webkit-backface-visibility:hidden; backface-visibility:hidden;}

/* バナーエリア（wrapper） */
#bnr-top {
	position:relative;
	z-index:1;
	width:100%;
	max-width:2560px;
	height:185px;
	background:url(../img/top/bg_bnr-wrapper.png) repeat-x;
	margin:0 auto -6px auto;
}

/* バナーリスト（BOX） */
#bnr-top ul {width:1280px; height:176px; text-align:center; padding:24px 0 0 0; margin:0 auto;}

/* バナーリスト */
#bnr-top li {display:inline-block; width:335px; margin:0 31px;}
#bnr-top li img {width:335px; height:auto; -webkit-backface-visibility:hidden; backface-visibility:hidden;}

/* top-2column_box */
.top-2column_box {position:relative; width:464px; height:356px; background:url(../img/top/bg_2column.png) no-repeat;}

/* news-top */
#news-top {float:left; margin:98px 0 136px 20px; padding:30px 20px 20px 20px;}
#news-top h2 {position:absolute; top:-46px; left:-20px; width:260px; height:82px; font-size:0; background:url(../img/top/h2_ttl-news.png) no-repeat;}
#news-top p {font-size:0; transition-duration:0.3s;}
#news-top p:hover {opacity:0.7;}
.news-ar-top {overflow-y:scroll; height:305px;}

/* ニュース一覧へ */
.top-news-btn-sp {display:none;}
.top-news-btn {position:absolute; bottom:-105px; left:0; right:0; margin:auto; display:block; width:404px; height:68px; background:url(../img/top/bt_news.png) no-repeat;}

/* tw-top */
#tw-top {float:right; margin:98px 20px 136px 0; padding:28px 20px 10px 20px;}
#tw-top h2 {position:absolute; top:-46px; left:-20px; width:280px; height:82px; font-size:0; background:url(../img/top/h2_ttl-twitter.png) no-repeat;}
#tw-top p {font-size:0; transition-duration:0.3s;}
#tw-top p:hover {opacity:0.7;}
.twitter-timeline {width:100% !important;}

/* twフォローボタン */
#top-tw-btn-sp {display:none;}
#top-tw-btn a {position:absolute; bottom:-105px; left:0; right:0; margin:auto; display:block; width:404px; height:68px; background:url(../img/top/bt_twitter.png) no-repeat;}

/* movie-top */
#movie-top {clear:both; position:relative; width:1020px; height:740px; background:url(../img/top/bg_movie.png) no-repeat; margin:0 0 0 -8px;}
#movie-top h2 {position:absolute; top:30px; left:6px; width:246px; height:82px; font-size:0; background:url(../img/top/h2_ttl-pv.png) no-repeat;}

/* PVタイトル（PV第一弾公開中） */
#movie-top p {
	position:absolute;
	top:121px;
	left:0;
	right:0;
	margin:auto;
	width:860px;
	height:60px;
	font-size:0;
	background:url(../img/top/ttl-pv.png) no-repeat center center, url(../img/top/bg_ttl-pv.png) no-repeat center;
	background-size:30%, 520px 60px;
}

/* PV動画（iframe） */
#movie-top iframe {position:absolute; top:170px; left:0; right:0; margin:auto;}


/* screenshot-top */
#screenshot-top {clear:both; position:relative; width:1020px; height:740px; background:url(../img/top/bg_movie.png) no-repeat; margin:0 0 0 -8px;}
#screenshot-top h2 {position:absolute; top:30px; left:6px; width:300px; height:82px; font-size:0; background:url(../img/top/h2_ttl-system.png) no-repeat;}

/* SSタイトル */
#screenshot-top p {
	position:absolute;
	top:121px;
	left:0;
	right:0;
	margin:auto;
	width:860px;
	height:60px;
	font-size:0;
	background: url(../img/top/bg_ttl-ss.png) no-repeat center;
	background-size:30%, 520px 60px;
}

/* SS(SLIDER) */
#screenshot-top #screenshot-box {position:absolute; width:760px; top:168px; left:0; right:0; margin:auto;}

/* screenshot-top */
#character-top {clear:both; position:relative; width:1020px; height:740px; background:url(../img/top/bg_movie.png) no-repeat; margin:0 0 0 -8px;}
#character-top h2 {position:absolute; top:30px; left:6px; width:246px; height:82px; font-size:0; background:url(../img/top/h2_ttl-character.png) no-repeat;}

/* SSタイトル */
#character-top p {
	position:absolute;
	top:121px;
	left:0;
	right:0;
	margin:auto;
	width:860px;
	height:60px;
	font-size:0;
	background: url(../img/top/bg_ttl-ss.png) no-repeat center;
	background-size:30%, 520px 60px;
}

/* SS(SLIDER) */
#character-top #character-box {position:absolute; width:760px; top:168px; left:0; right:0; margin:auto;}

/* spec-top（BOX） */
#spec-top-sp {display:none;}
#spec-top {
	clear:both;
	position:relative;
	width:966px;
	background:url(../img/top/bg_spec.png) no-repeat;
	margin:64px 0 0 19px;
	padding:60px 0 35px 6px;
	border:2px solid #454545;
	border-bottom:4px solid #454545;
	border-radius:6px;
}

#spec-top h2 {position:absolute; top:-46px; left:-20px; width:246px; height:82px; font-size:0; background:url(../img/top/h2_ttl-spec.png) no-repeat bottom;}

/* アプリアイコン */
#icon_app img {float:left; border-radius:12px; width:80px; height:auto; margin:2px 25px 0;}

/* スペックリスト */
#spec-top table {width:820px; font-size:16px; line-stacking:-1px; line-height:1.8;}
#spec-top table th:nth-child(1){width:100px;}
#spec-top table th {text-align:left; font-weight:normal;}
.spec td:nth-child(2),
.spec td:nth-child(5){width:30px;}
.spec td:nth-child(3){width:300px;}

/* 対応機種の詳細はこちら（ボタン） */
#popup-bt-spec a {display:block; width:404px; height:68px; font-size:0; background:url(../img/top/bt_spec.png) no-repeat; margin:35px auto 10px;}
#popup-bt-spec a:hover {opacity:0.7;}

/* コンテンツBOX（ポップアップ） */
.popup-spec_box {
	position:relative;
	width:945px;
	background:#fff;
	border:3px solid #454545;
	margin:30px auto;
}

/* カテゴリ,アイコン,日付,タイトル（BOX） */
.news-common {border-bottom:1px dashed #aaa;}

/* カテゴリ,アイコン,日付（BOX） */
.news-common dt {padding:5px 0; height:54px; padding:22px 0 0 0; line-height:1;}

/* カテゴリー（アイコン） */
.news_cat-icon {float:left; display:inline-block; width:97px; height:21px; font-size:11px; line-height:21px; text-align:center; color:#fff;}

/* お知らせ */
.notice {background:url(../img/common/icon_notice.png) no-repeat center; background-size:100%;}

/* イベント */
.event {background:url(../img/common/icon_event.png) no-repeat center; background-size:100%;}

/* アップデート */
.update {background:url(../img/common/icon_update.png) no-repeat center; background-size:100%;}

/* メンテナンス */
.maintenance {background:url(../img/common/icon_maintenance.png) no-repeat center; background-size:100%;}


/* 日付 */
.news_date {float:left; font-size:17px; margin:3px 0 0 16px; font-weight:bold;}

/* NEWアイコン */
.news-common dt img {display:inline; margin:-14px 0 0 16px; width:40px; height:auto;}


/* 0.0 - 事前登録（../register）
---------------------------------------------------------------------------------------------------------- */
/* キービジュアル */
#kv {
	width:100%;
	height:685px;
	background:url(../img/common/key-visual-pre.jpg) no-repeat center center;
	font-size:0;
	margin:0 auto;
}

/* キービジュアル（BOX） */
#kv_box {
	position:relative;
	width:1280px;
	height:690px;
	margin:0 auto;
}

/* logo */
#kv_box p a {
	position:absolute;
	bottom:20px;
	left:7px;
	width:512px;
	height:200px;
	background:url(../img/common/logo.png) no-repeat center center;
}
#kv_box p a:hover {opacity:0.7;}

/* 事前登録30万人突破記念〜 */
#campaign {
	width:100%;
	max-width:2560px;
	height:150px;
	background:url(../img/register/campaign.png), url(../img/register/bg_campaign.png);
	background-repeat:no-repeat, repeat-x;
	background-position:center top, left top;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	margin:0 auto;
}

/* 特典（wrapper） */
#bonus {
	overflow:hidden;
	width:100%;
	max-width:2560px;
	background:url(../img/register/bg_bonus-lp.png);
	background-repeat:repeat-x;
	background-position:left top;
	margin:0 auto;
}
#bonus h2, #bonus_txt {overflow:hidden; text-indent:100%; white-space:nowrap;}

/* 全員にビーストストーンと「黄金の甲斐先生像」をプレゼント!! */
#bonus_txt {width:998px; height:390px; background:url(../img/register/bonus_txt.jpg) no-repeat; margin:28px auto 25px;}

/* プレゼント注意テキスト（上記特典はゲーム内の〜） */
#bonus_note {width:945px; margin:0 auto 66px; padding:14px 16px; background:rgba(255,255,255,0.7); font-size:14px; border:1px solid #ccc; line-height:1.9; letter-spacing:-1px;}

/* 報酬一覧 */
#bonus ul {width:965px; margin:0 auto 90px auto; font-size:0;}
#bonus li {position:relative;}
#bonus li:nth-child(1) {width:965px; height:260px; background:url(../img/register/bonus_01.png) no-repeat;}
#bonus li:nth-child(3) {width:965px; height:260px; background:url(../img/register/bonus_02.png) no-repeat;}
#bonus li:nth-child(5) {width:965px; height:260px; background:url(../img/register/bonus_03.png) no-repeat;}
#bonus li:nth-child(7) {width:965px; height:260px; background:url(../img/register/bonus_04.png) no-repeat;}
#bonus li:nth-child(9) {width:965px; height:260px; background:url(../img/register/bonus_05.png) no-repeat;}
#bonus li:nth-child(11) {width:965px; height:260px; background:url(../img/register/bonus_06.png) no-repeat;}
#bonus li:nth-child(13) {width:965px; height:260px; background:url(../img/register/bonus_07.png) no-repeat;}
#bonus li:nth-child(15) {width:965px; height:260px; background:url(../img/register/bonus_08.png) no-repeat;}
#bonus li:nth-child(17) {width:965px; height:260px; background:url(../img/register/bonus_09.png) no-repeat; margin:0 auto 190px;}
#bonus li:nth-child(even) {width:965px; height:58px; background:url(../img/register/icon_arrow.png) no-repeat center center; background-size:80px; margin:12px 0 -12px 0;}
#bonus li:nth-child(odd) p {position:absolute; top:-41px; right:-76px; display:block; width:208px; height:182px; opacity: 0.8; background:url(../img/register/bt_stamp.png) no-repeat center center; background-size:182px 182px;}


/* 0.1 - 登録完了（../pre-register/complete）
---------------------------------------------------------------------------------------------------------- */
#register-ing-wrapper {
	clear:both;
	position:relative; 
	width:1280px;
	height:350px; 
	padding-top:130px;
	margin:0 auto;
}

#register-ing {
	width:965px;
	font-size:0;
	background:rgba(255,255,255,0.7);
	border:2px solid #454545;
	border-bottom:4px solid #454545;
	border-radius:6px;
	margin:0 auto;
	padding-left:50px;
}

/* 今すぐ事前登録!! */
#register-ing h2 img {width:50%; height:auto; margin:-6.2% auto 16px}

/* ボタン */
#register-ing ul {overflow:hidden; padding:0 0 25px;}
#register-ing li a img {float:left; width:260px; height:104px; -webkit-backface-visibility:hidden; backface-visibility:hidden; cursor:pointer; margin:0 1.5%}

/* movie-top */
#movie-top {clear:both; position:relative; width:1020px; height:740px; background:url(../img/top/bg_movie.png) no-repeat; margin:0 0 0 -8px;}


/* 登録完了（wrapper） */
#register-complete-wrapper {width:100%; background:rgba(0,0,0,0.8); margin:90px 0 80px 0; padding:20px;}

/* 登録完了 */
#register-complete {text-align:center; font-size:20px; color:#fff; line-height:1.8; padding:70px 0; border:2px solid #cc006e; letter-spacing:2px;}
#register-complete h1 {margin:0 0 46px 0; font-size:28px;}

/* TOPへ戻る */
#register-complete-back {text-indent:100%; white-space:nowrap; overflow:hidden;}
#register-complete-back a {display:block; width:290px; height:70px; background:url(../img/register/bt_top-back.png) no-repeat center center; background-size:100%; margin:0 auto 170px auto;}
#register-complete-back a:hover {opacity:0.7;}


}

.twitter-link{
	color: #ff008a !important;
	border-bottom: solid 1px #ff008a;
}
.twitter-link:hover{
	color: #FFF !important;
	border-bottom: solid 1px #FFF;
}