@charset 'utf-8';

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

/**
 * 【PC】新テニスの王子様 ライジングビート【公式サイト】
 *
 * 【layout】
 * 1.0 - TOP
 * 　　|- キービジュアル
 *  　　|- キービジュアル（BOX）
 *   　　|- logo
 *   　　|- 2017年配信開始予定
 * 　　|- 事前登録概要【SP用】
 *   　　|- バナー（事前登録）
 *   　　|- 2017年内配信開始予定
 * 　　|- top-2column_box（NEWS, Twitter-timeline）
 *  　　|- NEWS
 *  　　|- Twitter-timeline
 * 　　|- movie-top
 *  　　|- PVタイトル（PV第一弾公開中！）
 *  　　|- movie-topPV動画（iframe）
 * 　　|- spec-top（BOX）
 *  　　|- スペックリスト
 *
 * 2.0 - NEWS（common）
 * 　　|- h1タイトル
 * 　　|- left-column_wrapper
 *  　　|- left-column
 * 　　|- right-column
 *  　　|- カテゴリーリスト
 * 　　|- カテゴリ,アイコン,日付,タイトル（BOX）
 *  　　|- カテゴリ,アイコン,日付（BOX）
 *   　　|- カテゴリー（アイコン）
 *    　　|- お知らせ
 *    　　|- イベント
 *    　　|- アップデート
 *  　　|- 日付
 *  　　|- NEWアイコン
 *
 * 2.1 - NEWS（一覧）
 * 　　|- 記事一覧（wrapper）
 *  　　|- 記事一覧（BOX）
 *  　　|- タイトル
 *  　　|- ページャー
 *   　　|- 最初,最後
 *   　　|- 次,前
 *   　　|- ナンバー,カレント
 *
 * 2.2 - NEWS（詳細）
 * 　　|- 記事詳細（wrapper）
 *  　　|- 記事詳細（BOX）
 *  　　|- タイトル
 *  　　|- コンテンツ
 *  　　|- エディター用のクラス
 *  　　|- ページャー（BOX）
 *   　　|- 前の記事
 *   　　|- 記事一覧へ戻る
 *   　　|- 次の記事
 *
 * 3.0 - SYSTEM
 * 　　|- 
 * 　　|- 
 *
 * 4.0 - CHARACTER
 * 　　|- h1タイトル
 * 　　|- タブリスト
 * 　　|- キャラクター（wrapper）
 *  　　|- 学校名
 *   　　|- Coming Soon（6/29〜Fixまで）
 *   　　|- NEWアイコン（6/29〜Fixまで）
 *  　　|- キャラクター（詳細 - wrapper）
 *  　　|- キャラクター（詳細）
 *  　　|- キャラクター画像
 *  　　|- キャラクター概要
 *  　　|- プロフィールテキスト（BOX）
 *   　　|- プロフィールテキスト
 *
 * 5.0 - MUSIC
 * 　　|- h1タイトル
 *  　　|- 今後も収録曲続々公開予定！！
 * 　　|- タブリスト
 *  　　|- NEWアイコン
 * 　　|- comingsoon_music-box
 *  　　|- comingsoon（ユニット）
 *  　　|- comingsoon（デュエット）
 * 　　|- ミュージック用ラッパー
 *  　　|- ミュージックコンテンツ
 *   　　|- ミュージック（BOX）
 *    　　|- 画像
 *    　　|- タイトル
 *    　　|- キャラクター名
 *    　　|- NEWアイコン
 * 　　|- コンテンツBOX（ポップアップ）
 *  　　|- コンテンツ
 *   　　|- 画像
 *   　　|- コンテンツ（概要テキスト）
 *    　　|- カテゴリー名
 *    　　|- ソングタイトル（BOX）
 *     　　|- アイコン
 *     　　|- タイトル
 *     　　|- キャラクター名
 *    　　|- ソングタデータ（BOX）
 *     　　|- アイコン
 *     　　|- 項目
 *     　　|- テキスト
 * 　　|- ポップアップ開始
 * 　　|- ポップアップ表示
 * 　　|- ポップアップ終了
 * 　　|- 閉じるボタン
 *
 * 6.0 - MOVIE
 * 　　|- h1タイトル
 * 　　|- 動画リスト
 *  　　|- サムネイル画像
 *  　　|- 動画タイトル（第●●弾）
 *
 * 0.0 - 事前登録（../pre-register）
 * 　　|- キービジュアル
 *  　　|- キービジュアル（BOX）
 *   　　|- logo
 * 　　|- 事前登録キャンペーン開催中！
 * 　　|- 事前登録フォーム（wrapper）
 *  　　|- 事前登録フォーム（box）
 *   　　|- メールアドレスで登録（input[type='email']）
 *    　　|- メールアドレスで登録（ボタン）
 *    　　|- Twitterで登録（ボタン）
 *    　　|- Twitterで登録（注釈）
 * 　　|- 特典（wrapper）
 *  　　|- 事前登録でゲーム内特典が貰える
 *  　　|- 全員にビーストストーンをプレゼント!!
 *  　　|- 報酬一覧
 * 　　|- 事前登録する（wrapper）
 *  　　|- 事前登録する（ボタン）
 *  　　|- 注意事項のテキスト文言
 *  　　|- バリデーション（error）
 *
 * 0.1 - 登録登録（../pre-register/complete）
 * 　　|- 登録完了（wrapper）
 *  　　|- 登録完了
 *  　　|- TOPへ戻る
 *
 * ------------------------------------------------------------------------------------------------------- */


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

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

/* logo */
#kv-top_box #logo a {
	position:absolute;
	bottom:8px;
	left:72px;
	width:520px;
	height:200px;
	background:url(../img/top/logo.png) no-repeat center center;
}

/* バナー（事前登録） */
#kv-top_box #bnr_pre-register a {
	position:absolute;
	bottom:9px;
	right:30px;
	width:570px;
	height:141px;
	background:url(../img/top/bnr_pre-register.jpg) no-repeat;
	background-size:100%;
}

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

/* 事前登録概要 */
#release-schedule-sp {display:none;}

/* 2017年内配信開始予定 */
#release-schedule {width:100%; max-width:2560px; height:100px; background:url(../img/top/bg_release.png) repeat-x center center; margin:0 auto;}
#release-schedule h2 {height:100px; background:url(../img/top/h2_ttl-release.png) no-repeat center center; font-size:0;}

/* 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:246px; 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:246px; 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:208px; left:0; right:0; margin:auto;}

/* spec-top（BOX） */
#spec-top {clear:both; position:relative; width:966px; height:208px; background:url(../img/top/bg_spec.png) no-repeat; margin:64px 0 0 19px;}
#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;}

/* スペックリスト */
#spec-top dl {font-size:21px; letter-spacing:-1px; line-height:1.8; padding:48px 0 0 0;}
#spec-list_left {float:left; margin:0 0 0 56px; width:510px;}
#spec-list_left dt {float:left;}
#spec-list_right {float:right; margin:0 10px 0 0; width:390px;}
#spec-list_right dt {float:left;}


/* 2.0 - NEWS（common）
---------------------------------------------------------------------------------------------------------- */
/* h1タイトル */
#h1_news {background:url(../img/news/h1_ttl.png) no-repeat left;}

/* left-column_wrapper */
#left-column_wrapper {float:left;}

/* left-column */
#left-column {position:relative; width:680px; min-height:201px; padding:8px 18px 6px 18px; background:url(../img/news/bg_content-mid.png); margin:14px 0 20px 0;}

#left-column::before {
	content: '';
	background:url(../img/news/bg_content-top.png) no-repeat center top;
	position:absolute;
	top:-14px;
	left:0;
	width:680px;
	height:14px;
}

#left-column::after {
	content: '';
	background:url(../img/news/bg_content-btm.png) no-repeat center bottom;
	position:absolute;
	bottom:-20px;
	left:0;
	width:680px;
	height:20px;
}

/* right-column */
#right-column {float:right; position:relative; width:274px; background:url(../img/news/bg_cat-mid.png); margin:52px 0 8px 0; padding:0 15px;}

#right-column::before {
	content: '';
	background:url(../img/news/bg_cat-top.png) no-repeat center top;
	position:absolute;
	top:-52px;
	left:0;
	width:274px;
	height:52px;
}

#right-column::after {
	content: '';
	background:url(../img/news/bg_cat-btm.png) no-repeat center bottom;
	position:absolute;
	bottom:-8px;
	left:0;
	width:274px;
	height:8px;
}

/* カテゴリーリスト */
#right-column ul {position:relative; padding:0 0 110px 0; font-size:16px; font-weight:bold;}
#right-column li {border-bottom:1px dashed #aaa; background:url(../img/news/icon_arrow.png) no-repeat left 23px; background-size:14px 20px; transition-duration:0.3s;}
#right-column li a {display:block; padding:20px 0 8px 26px;}
#right-column li:hover {background:url(../img/news/icon_arrow_over.png) no-repeat left 23px; background-size:14px 20px;}

#right-column ul::before {
	content: '';
	background:url(../img/news/icon_ball.png) no-repeat;
	background-size:contain;
	position:absolute;
	bottom:-11px;
	right:-20px;
	width:43px;
	height:28px;
	z-index:999;
}

#right-column ul::after {
	content: '';
	background:url(../img/news/icon_racket.png) no-repeat;
	background-size:contain;
	position:absolute;
	bottom:-18px;
	left:-29px;
	width:76px;
	height:93px;
	z-index:999;
}

/* カテゴリ,アイコン,日付,タイトル（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;}

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

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

/* アップデート */
.update {background:url(../img/news/icon_update.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;}


/* 2.1 - NEWS（一覧）
---------------------------------------------------------------------------------------------------------- */
/* 記事一覧（wrapper） */
#news-ar {padding:0 0 30px 0;}

#news-ar dl {background:url(../img/news/icon_arrow.png) no-repeat; background-size:14px 20px; background-position:right 3px top 61px;}
#news-ar dl:hover {background:url(../img/news/icon_arrow_over.png) no-repeat; background-size:14px 20px; background-position:right 3px top 61px;}

/* タイトル */
.news-ar_ttl {font-size:15px; padding:6px 40px 12px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

/* ページャー */
#pagenavi_pc {width:680px; margin:46px 0 0 0;}
.wp-pagenavi {text-align:center;}

/* 最初,最後 */
.wp-pagenavi .first {display:inline-block; width:34px; height:38px; background:url(../img/news/icon_pre-top.png) no-repeat;}
.wp-pagenavi .last {display:inline-block; width:34px; height:38px; background:url(../img/news/icon_next-top.png) no-repeat;}
.wp-pagenavi .first:hover {display:inline-block; width:34px; height:38px; background:url(../img/news/icon_pre-top_over.png) no-repeat;}
.wp-pagenavi .last:hover {display:inline-block; width:34px; height:38px; background:url(../img/news/icon_next-top_over.png) no-repeat;}

/* 次,前 */
.wp-pagenavi .previouspostslink {display:inline-block; width:34px; height:38px; background:url(../img/news/icon_pre.png) no-repeat;}
.wp-pagenavi .nextpostslink {display:inline-block; width:34px; height:38px; background:url(../img/news/icon_next.png) no-repeat;}
.wp-pagenavi .previouspostslink:hover {display:inline-block; width:34px; height:38px; background:url(../img/news/icon_pre_over.png) no-repeat;}
.wp-pagenavi .nextpostslink:hover {display:inline-block; width:34px; height:38px; background:url(../img/news/icon_next_over.png) no-repeat;}

.wp-pagenavi .first,
.wp-pagenavi .last,
.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {font-size:0; vertical-align:top;}

/* ナンバー,カレント */
.wp-pagenavi a {display:inline-block; width:54px; height:38px; background:url(../img/news/icon_num.png) no-repeat; margin:0 10px; line-height:36px; color:#fff; font-size:16px; font-weight:bold;}
.wp-pagenavi .current {display:inline-block; width:54px; height:38px; background:url(../img/news/icon_num-current.png) no-repeat; margin:0 10px; line-height:36px; color:#fff; font-size:16px; font-weight:bold;}
.wp-pagenavi a:hover {display:inline-block; width:54px; height:38px; background:url(../img/news/icon_num-current.png) no-repeat;}


/* 2.2 - NEWS（詳細）
---------------------------------------------------------------------------------------------------------- */
/* 記事詳細（wrapper） */
#news-single {padding:0 0 30px 0;}

/* タイトル */
.news-single_ttl {font-size:15px; padding:6px 40px 14px 0; font-weight:bold; line-height:1.6}

/* コンテンツ */
#news-content {padding:18px 8px 0 8px;}
#news-content p {padding:0 0 20px 0;}
#news-content p a {color:#00a8ff; text-decoration:underline;}
#news-content p a:hover {opacity:0.7;}
#news-content img {max-width:628px; height:auto;}
#news-content a img {display:inline-block;}
#news-content iframe {max-width:628px; max-height:353px;}

/* エディター用のクラス */
#news-content h3 {color:#cc006e;}
#news-content .orange {color:#f60;}

/* ページャー（BOX） */
#pagenavi-single_pc {position:relative; width:680px; height:89px; overflow:hidden; text-indent:100%; white-space:nowrap;}

/* 前の記事 */
#pagenavi-single_pc #next a {position:absolute; left:0; bottom:0; margin:auto; display:block; width:154px; height:67px; background:url(../img/news/bt_prev.png) no-repeat; background-size:154px 67px;}

/* ニュース一覧へ戻る */
#pagenavi-single_pc #back a {position:absolute; left:0; right:0; bottom:0; margin:auto; display:block; width:261px; height:67px; background:url(../img/news/bt_back.png) no-repeat; background-size:261px 67px;}

/* 次の記事 */
#pagenavi-single_pc #prev a {position:absolute; right:0; bottom:0; margin:auto; display:block; width:154px; height:67px; background:url(../img/news/bt_next.png) no-repeat; background-size:154px 67px;}

#pagenavi-single_pc #next a:hover,
#pagenavi-single_pc #back a:hover,
#pagenavi-single_pc #prev a:hover {opacity:0.7;}


/* 3.0 - SYSTEM
---------------------------------------------------------------------------------------------------------- */
/*  */


/* 4.0 - CHARACTER
---------------------------------------------------------------------------------------------------------- */
/* h1タイトル */
#h1_character {background:url(../img/character/h1_ttl.png) no-repeat left;}

/* タブリスト（newアイコンを外す際は「.character_tab li img」と「.character_tab li → position:relative;」を消す） */
.character_tab {overflow:hidden; width:1060px; background:url(../img/character/bg_tab.png) repeat-x center bottom; margin:0 auto 50px auto; padding:25px 0 6px 28px;}
.character_tab li {position:relative; display:block; float:left; width:230px; height:60px; margin:0 28px 17px 0; background:url(../img/character/icon/bg_school-list.png); cursor:pointer; transition-duration:0.3s;}
.character_tab li img {width:100%; height:auto;}
.character_tab li.select, .character_tab li:hover {background:url(../img/character/icon/bg_school-list_select.png);}
.character_tab li img {width:100%; height:auto;}

/* Coming Soon（6/29〜Fixまで）*/
#next-school_comingsoon {pointer-events:none; position:relative;}
/* #next-school_comingsoon::after {content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; top:0;} */

/* NEWアイコン（6/29〜Fixまで）*/
.chara_new {position:absolute; top:0; left:0;}

/* キャラクター（wrapper） */
.character_content {overflow:hidden; width:1144px; margin:0 auto; padding:0 0 38px 70px;}
.character_content-hide {display:none;}

/* 学校名 */
.character_content h2 {
	position:relative;
	width:1004px;
	height:85px;
	border:4px solid #b51121;
	background:url(../img/character/bg_school-ttl_left.png) left no-repeat, url(../img/character/bg_school-ttl_right.png) right no-repeat;
	background-color:#404040;
	line-height:83px;
	text-align:center;
	font-size:36px;
	letter-spacing:1px;
	color:#fff;
	text-shadow:2px 2px 0px #222222;
	margin:0 0 50px 0;
}
.character_content h2::before {
	content: '';
	border:2px solid #fff;
	position:absolute;
	top:0;
	left:0;
	width:992px;
	height:73px;
}

/* キャラクター（詳細 - wrapper） */
.character_info {float:left; width:467px; margin:0 70px 50px 0; padding:6px; background-color:#222;}

/* キャラクター（詳細） */
.character_info-box {position:relative; overflow:hidden; width:455px; height:284px; background:#fff url(../img/character/bg_chara.png) no-repeat; background-size:455px auto; border:4px solid #b51121;}

/* キャラクター画像 */
.character_info-box img {width:455px; height:auto; margin:-6px 0 0 0;}

/* キャラクター概要 */
.character_txt {
	position:absolute;
	top:35px;
	right:6px;
	width:230px;
	font-size:13px;
	line-height:1.5;
	text-align:right;
	color:#fff;
	text-shadow:2px 1px 1px #222222;
}
.character_txt h3 {font-size:26px;}

/* プロフィールテキスト（BOX） */
.character_info-txt {
	position:absolute;
	right:6px;
	bottom:7px;
	width:202px;
	height:124px;
	background:#404040;
	border:2px solid #b51121;
	-moz-box-shadow:0px 0px 0px 2px rgba(0,0,0,0.5);
	-webkit-box-shadow:0px 0px 0px 2px rgba(0,0,0,0.5);
	box-shadow:0px 0px 0px 2px rgba(0,0,0,0.5);
}

/* プロフィールテキスト */
.character_info-txt p {
	height:120px;
	width:198px;
	border:2px solid #fff;
	font-size:11px;
	color:#fff;
	line-height:1.7;
	padding:0 7px;
	display:table-cell;
	vertical-align:middle;
}

/* 5.0 - MUSIC
---------------------------------------------------------------------------------------------------------- */
/* h1タイトル */
#h1_music {background:url(../img/music/h1_ttl.png) no-repeat left;}

/* 今後も収録曲続々公開予定！！*/
#h1_music-txt {position:absolute; top:-38px; right:27px; width:480px; height:180px; background:url(../img/music/h1_txt-music.png) no-repeat; overflow:hidden; text-indent:100%; white-space:nowrap;}

/* 今後も収録曲続々公開予定！！（SP用）*/
#h1_music-txt-2 {display:none;}

/* タブリスト */
.music_tab {overflow:hidden; width:862px; height:90px; margin:0 auto -7px; text-indent:100%; white-space:nowrap;}
.music_tab li {position:relative; display:block; float:left; width:282px; height:90px; cursor:pointer; transition-duration:0.5s;}
.music_tab li:nth-child(1) {background:url(../img/music/bg_tab-solo.png) no-repeat;}
.music_tab li:nth-child(2) {background:url(../img/music/bg_tab-duet.png) no-repeat;}
.music_tab li:nth-child(3) {background:url(../img/music/bg_tab-unit.png) no-repeat;}

/* NEWアイコン */
.music_tab li img {position:absolute; top:0; right:38px;}

/* ▼公開後は丸ごと消す（cssとテンプレートファイルの<div class="comingsoon_music-box">） */
/* comingsoon_music-box */
#comingsoon_music-box {position:relative; overflow:hidden; width:862px; height:90px; margin:0 auto -7px; text-indent:100%; white-space:nowrap;}
/* comingsoon（ユニット） */
.comingsoon_music-unit {display:block; width:282px; height:90px; background:url(../img/common/gnav/comingsoon.png) no-repeat 46px 14px; position:absolute; top:0; left:282px;}
/* comingsoon（デュエット） */
.comingsoon_music-duet {display:block; width:282px; height:90px; background:url(../img/common/gnav/comingsoon.png) no-repeat 46px 14px; position:absolute; top:0; left:564px;}
/* ▲公開後は丸ごと消す（cssとテンプレートファイルの<div class="comingsoon_music-box">） */

.music_tab li.select:nth-child(1), .music_tab li:hover:nth-child(1) {background:url(../img/music/bg_tab-solo_select.png) no-repeat;}
.music_tab li.select:nth-child(2), .music_tab li:hover:nth-child(2) {background:url(../img/music/bg_tab-duet_select.png) no-repeat;}
.music_tab li.select:nth-child(3), .music_tab li:hover:nth-child(3) {background:url(../img/music/bg_tab-unit_select.png) no-repeat;}

/* ミュージック用wrapper */
#music_wrapper {position:relative; z-index:999;}

/* ミュージックコンテンツ */
.music_content #music_solo {overflow:hidden; width:1004px; border:3px solid #507422; border-radius:8px; background:#efffda; margin:0 auto; padding:38px 0;}
.music_content #music_unit {overflow:hidden; width:1004px; border:3px solid #ed9b03; border-radius:8px; background:#fff1da; margin:0 auto; padding:38px 0;}
.music_content #music_duet {overflow:hidden; width:1004px; border:3px solid #1994c1; border-radius:8px; background:#f0fafc; margin:0 auto; padding:38px 0;}
.music_content-hide {display:none;}

/* ミュージック（BOX） */
.music_box {
	float:left;
	position:relative;
	width:294px;
	min-height:304px;
	border-radius:6px;
	margin:0 0 38px 30px;
	color:#fff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(1.00, #000), color-stop(0.00, #45494d));
	background:-webkit-linear-gradient(#45494d, #000);
	background:-moz-linear-gradient(#45494d, #000);
	background:-o-linear-gradient(#45494d, #000);
	background:-ms-linear-gradient(#45494d, #000);
	background:linear-gradient(#45494d, #000);
}

.music_box-inside {
	height:100%;
	background:url(../img/music/bg_content.png) repeat-y;
	border:1px solid #fff;
	border-radius:6px;
	margin:2px;
	transition-duration:0.4s;
}

.music_box-inside:hover {border:1px solid #d90360;}

/* 画像 */
.music_img_box {position:relative; width:190px; height:190px; display:block; margin:24px auto 16px auto;}
.music_box img {position:absolute; top:0; right:0; bottom:0; left:0; margin:auto; max-width:190px; height:auto; max-height:190px; width:auto; box-shadow:0px 0px 6px 2px rgba(0, 0, 0, 0.52);}

/* タイトル */
.music_box h2 {font-size:15px; text-align:center; padding:0 5px 5px 5px; background:url(../img/music/border_ttl.png) no-repeat center bottom;}

/* キャラクター名 */
.music_box p {text-align:center; padding:5px 5px 1em 5px;}

/* NEWアイコン */
.music_icon-new {
	overflow:hidden;
	position:absolute;
	top:3px;
	left:3px;
	width:70px;
	height:70px;
	background:url(../img/music/icon_new.png) no-repeat left top;
	background-size:70px auto;
	-webkit-border-radius:5px 0 0 0 / 5px 0 0 0;
	-moz-border-radius:5px 0 0 0 / 5px 0 0 0;
	border-radius:5px 0 0 0 / 5px 0 0 0;
	text-indent:100%;
	white-space:nowrap;
	font-size:0;
}

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

/* コンテンツ */
.popup-music_content {
	overflow:hidden;
	display:block;
	border:4px solid #d90360;
	position:relative;
	background:url(../img/music/bg_content.jpg) no-repeat center top;
	margin:3px;
	padding:30px 26px 50px 26px;
}

/* 画像 */
.popup-music_img img {float:left; width:340px; height:auto; box-shadow:0px 0px 6px 2px rgba(0, 0, 0, 0.52);}

/* コンテンツ（概要テキスト） */
.popup-music_content-right {margin:0 0 0 368px;}

/* カテゴリー名（ソロ） */
.popup-music_content-cat-solo {display:inline-block; position:relative; height:38px; background:url(../img/music/bg_cat.png) no-repeat right; font-size:18px; line-height:39px; margin:0 0 0 46px; padding:0 20px 0 10px}
.popup-music_content-cat-solo::before {content:''; height:38px; width:46px; background:url(../img/music/icon_cat_solo.png) no-repeat right; position:absolute; top:0px; left:-46px;}

/* カテゴリー名（デュエット） */
.popup-music_content-cat-duet {display:inline-block; position:relative; height:38px; background:url(../img/music/bg_cat.png) no-repeat right; font-size:18px; line-height:39px; margin:0 0 0 46px; padding:0 20px 0 10px}
.popup-music_content-cat-duet::before {content:''; height:38px; width:46px; background:url(../img/music/icon_cat_duet.png) no-repeat right; position:absolute; top:0px; left:-46px;}

/* カテゴリー名（ユニット） */
.popup-music_content-cat-unit {display:inline-block; position:relative; height:38px; background:url(../img/music/bg_cat.png) no-repeat right; font-size:18px; line-height:39px; margin:0 0 0 46px; padding:0 20px 0 10px}
.popup-music_content-cat-unit::before {content:''; height:38px; width:46px; background:url(../img/music/icon_cat_unit.png) no-repeat right; position:absolute; top:0px; left:-46px;}

/* ソングタイトル（BOX） */
.popup-music_content-ttl {
	position:relative;
	display:inline-block;
	width:388px;
	border-radius:6px;
	color:#fff;
	font-size:19px;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(1.00, #000), color-stop(0.00, #45494d));
	background:-webkit-linear-gradient(#45494d, #000);
	background:-moz-linear-gradient(#45494d, #000);
	background:-o-linear-gradient(#45494d, #000);
	background:-ms-linear-gradient(#45494d, #000);
	background:linear-gradient(#45494d, #000);
	margin:30px 0 0 0;
}

.popup-music_content-ttl-inside {
	background:url(../img/music/bg_content.png) repeat-y;
	border:1px solid #fff;
	border-radius:6px;
	margin:2px;
}

/* アイコン */
.popup-music_content-ttl h3 {position:absolute; width:126px; height:44px; top:-13px; left:-11px; background:url(../img/music/icon_song-ttl.png) no-repeat center; overflow:hidden; text-indent:100%; white-space:nowrap;}

/* タイトル */
.popup-music_content-ttl h4 {position:relative; text-align:center; padding:24px 10px 10px 10px; background:url(../img/music/border_ttl-popup.png) no-repeat center bottom;}

/* キャラクター名 */
.popup-music_content-ttl p {position:relative; text-align:center; padding:10px;}

/* ソングデータ（BOX） */
.popup-music_content-data {
	position:relative;
	width:388px;
	font-size:18px;
	margin:44px 0 0 0;
	background:#434343 ;
}

/* アイコン */
.popup-music_content-data h3 {position:absolute; width:126px; height:44px; top:-20px; left:-11px; background:url(../img/music/icon_song-data.png) no-repeat center; overflow:hidden; text-indent:100%; white-space:nowrap;}

/* 項目 */
.popup-music_content-data dt {
	float:left;
	width:100px;
	min-height:48px;
	color:#fff;
	overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
	border-top:1px solid #fff;
}

.data-icon_lyrics {background:url(../img/music/icon_lyrics.png) no-repeat center top;}
.data-icon_compose {background:url(../img/music/icon_compose.png) no-repeat center top;}

/* テキスト */
.popup-music_content-data dd {
	min-height:48px;
	line-height:1.4;
	background:#efefef;
	padding:13px 1em 13px 16px;
	margin:0 0 0 100px;
	border-top:1px solid #fff;
	border-left:1px solid #fff;
}

/* ポップアップ開始 */
.mfp-fade.mfp-wrap .mfp-content .popup-music_box {
	opacity:0;
	transform:scale(0.1);
	-webkit-transition:all 0.5s ease-out;
	-moz-transition:all 0.5s ease-out;
	transition:all 0.5s ease-out;
}

/* ポップアップ表示 */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content .popup-music_box {transform:scale(1); opacity:1;}

/* ポップアップ終了 */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content .popup-music_box {opacity:0;}

/* 閉じるボタン */
.popup-music_box .mfp-close {
	width:50px;
	height:50px;
	position:absolute;
	right:-25px;
	top:-25px;
	opacity:1;
	background:url(../img/common/bt_close.png) no-repeat center;
	transition-duration:0.3s;
	font-size:0;
}
.popup-music_box .mfp-close:hover {opacity:0.8;}
.popup-music_box .mfp-close:active {top:-25px;}


/* 6.0 - MOVIE
---------------------------------------------------------------------------------------------------------- */
/* h1タイトル */
#h1_movie {background:url(../img/movie/h1_ttl.png) no-repeat left;}

/* 動画リスト */
#movie-list li {
	float:left;
	display:block;
	position:relative;
	width:458px;
	min-height:306px;
	background:url(../img/movie/bg_youtube.png) no-repeat;
	margin:0 0 55px 0;
}

#movie-list li:nth-child(odd) {margin:0 88px 55px 0;}

/* サムネイル画像 */
.movie-thumbnail {overflow:hidden; position:absolute; top:7px; left:7px; width:440px; height:248px; transition-duration:0.3s;}
.movie-thumbnail img {position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; width:100%;}
.movie-thumbnail:hover img {opacity:0.9;}

.movie-thumbnail::after {
	content:'';
	display:block;
	width:440px;
	height:248px;
	background:url(../img/movie/bt_play.png) no-repeat center 85px;
	position:absolute;
	top:0;
	transition-duration:0.3s;
}
.movie-thumbnail:hover::after {opacity:0.6;}

/* 動画タイトル（第●●弾） */
.movie-ttl {
	position:absolute;
	top:255px;
	display:block;
	width:458px;
	min-height:64px;
	text-align:center;
	font-size:28px;
	color:#fff;
	line-height:1.4;
	background:url(../img/movie/bg_youtube-ttl.png) no-repeat center bottom;
	letter-spacing:1px;
	text-shadow:#333 3px 1px 2px, #333 -1px 1px 0px, #333 1px -1px 0px, #333 -1px -1px 0px;
	padding:11px 1em 14px 1em;
}

/* 0.0 - 事前登録（../register）
---------------------------------------------------------------------------------------------------------- */
/* キービジュアル */
#kv {
	width:100%;
	height:690px;
	background:url(../img/register/key-visual.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:406px;
	height:162px;
	background:url(../img/common/logo.png) no-repeat center center;
}
#kv_box p a:hover {opacity:0.7;}

/* 事前登録キャンペーン開催中！ */
#campaign {
	width:100%;
	max-width:2560px;
	height:211px;
	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） */
#register {
	width:100%;
	max-width:2560px;
	min-height:482px;
	background:url(../img/register/bg_register.jpg) repeat-x;
	overflow:hidden;
	margin:0 auto;
}

/* 事前登録フォーム（box） */
#form_box {
	position:relative;
	width:1020px;
	height:410px;
	background:url(../img/register/register.png) no-repeat;
	margin:39px auto 0 auto;
}

.error{
	width: 800px;
	margin: 30px auto -40px;
	background: #F00;
	color: #FFF;
	text-align: center;
	padding: 10px 0;
	font-weight: bold;
}

/* メールアドレスで登録（input[type='email']） */
input[type='email'] {margin:0; padding:0; background:#fff; border:none; border-radius:0; outline:none; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
#form_email:-ms-input-placeholder {color:#666; font-weight:bold;}
#form_email::-moz-placeholder {color:#666; font-weight:bold;}
#form_email::-webkit-input-placeholder {color:#666; font-weight:bold;}
#form_email {position:absolute; top:87px; left:90px; width:850px; height:80px; font-size:30px; padding:0 10px; line-height:80px; border:3px solid #ccc;}
#form_email:focus {outline:none; border:3px solid #d9035e;}

/* メールアドレスで登録（ボタン） */
#mail_submit {position:absolute; bottom:110px; left:105px; width:364px; height:98px; background:url(../img/register/bt_mail.png); font-size:0; border:none; outline:none; border-radius:0; transition-duration:0.3s;}
#mail_submit:hover {cursor:pointer; opacity:0.7;}

/* Twitterで登録（ボタン） */
#twitter_submit a {position:absolute; bottom:110px; right:100px; width:364px; height:98px; background:url(../img/register/bt_tw.png); font-size:0; border:none; transition-duration:0.3s;}
#twitter_submit a:hover {cursor:pointer; opacity:0.7;}

/* Twitterで登録（注釈） */
#twitter_submit-annotation {position:absolute; bottom:76px; right:215px; font-size:15px; font-weight:bold; color:#454545;}

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

/* 事前登録でゲーム内特典が貰える */
#bonus h2 {width:830px; height:99px; background:url(../img/register/bonus.png) no-repeat; margin:0 auto;}

/* 全員にビーストストーンをプレゼント!! */
#bonus_txt {width:1020px; height:370px; background:url(../img/register/bonus_txt.png) no-repeat; margin:26px auto;}

/* 報酬一覧 */
#bonus ul {width:965px; margin:0 auto 90px auto; font-size:0;}
#bonus li {position:relative;}
#bonus li:nth-child(1) {width:965px; height:165px; background:url(../img/register/bonus_10th.png) no-repeat;}
#bonus li:nth-child(3) {width:965px; height:165px; background:url(../img/register/bonus_30th.png) no-repeat;}
#bonus li:nth-child(5) {width:965px; height:165px; background:url(../img/register/bonus_50th.png) no-repeat;}
#bonus li:nth-child(7) {width:965px; height:165px; background:url(../img/register/bonus_70th.png) no-repeat;}
#bonus li:nth-child(9) {width:965px; height:165px; background:url(../img/register/bonus_100th.png) no-repeat;}
#bonus li:nth-child(11) {width:965px; height:165px; background:url(../img/register/bonus_150th.png) no-repeat;}
#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:-46px; right:-74px; display:block; width:208px; height:182px; background:url(../img/register/bt_stamp.png) no-repeat center center; background-size:182px 182px;}

/* 事前登録する（wrapper） */
#register-entry {
	overflow:hidden;
	width:100%;
	max-width:2560px;
	background:url(../img/register/bg_entry-lp.png), url(../img/register/bg_entry.jpg);
	background-repeat:repeat-x, repeat-y;
	background-position:left top, center 360px;
	margin:0 auto;
}

/* 事前登録する（ボタン） */
#register-entry h2 a {
	overflow:hidden;
	display:block;
	width:715px;
	height:140px;
	background:url(../img/register/bt_entry.png) no-repeat center center;
	text-indent:100%;
	white-space:nowrap;
	margin:55px auto 90px auto;
	transition-duration:0.3s;
}
#register-entry h2 a:hover {opacity:0.7;}

/* 注意事項のテキスト文言 */
#register-entry {padding-bottom:180px;}
#register-entry h3 {width:1000px; font-size:20px; margin:0 auto;}
#register-entry dl {width:1000px; margin:0 auto; line-height:1.5}
#register-entry dt {font-size:18px; margin:30px 0 10px 0; font-weight:bold;}
#register-entry dd {font-size:16px; margin:0 0 10px 0; font-weight:normal;}

/* バリデーション */
#error{
	width: 850px;
	margin: 30px auto -40px;
	background: #F00;
	color: #FFF;
	padding: 15px 0;
	font-weight: bold;
	text-align: center;
}


/* 0.1 - 登録登録（../pre-register/complete）
---------------------------------------------------------------------------------------------------------- */
/* 登録完了（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;
}