@charset "UTF-8";
/*============================================================*
* JRゲームアプリ「プラチナトレイン」　メインCSS
*  更新日　2016/05/25
*--------------------------------------
*
*  メインコンテンツのCSS設定を行っております。
*
*============================================================*/

body {
}

/*==================================*
* main */
@media screen and (max-width: 1200px) {
	#main_cont {
		width: 1200px;
		margin: 0;
		padding: 0;
		/* background: url(../images/jizen_BG003.jpg) top center no-repeat; */
		background-size: cover cover;
	}
}
@media screen and (min-width: 1200px) {
	#main_cont {
		width: 100%;
		margin: 0;
		padding: 0;
		/*background: url(../images/jizen_BG003.jpg) top center no-repeat; */
		background-size: cover cover;
	}
}

/* clearfix */
#main_cont:after {
  content: '';
  display: block;
  clear: both;
}

#main_cont #main_vis {
	width: auto;
	height: auto;
	margin: 0px auto 0px;
	padding: 10px 0 0 0;
	box-sizing: border-box;
	text-align: center;
	min-height: 500px;
	position: relative;;
}
#main_cont #vis_btn {
	width: 660px;
	height: auto;
	margin: 0px auto;
	padding: 0px 0 0 0;
	position: absolute;;
	left:0px;
	right:0px;
	bottom:0px;
}
#main_cont #vis_btn a{
	color: #000000;
}
#main_cont #vis_btn a:hover{
	color: #000000;
}

@media screen and (max-width: 1400px) {
   /* 表示領域が1400px以下の場合に適用するスタイル */
	#main_cont #main_vis2 {
		width: 100%;
		height: 200px;
		margin: 60px auto 0px;
		padding: 0;
		position: absolute;
	}
	#main_cont #main_vis2 #main_view {
		width: 280px;
		height: auto;
		margin: 0px 0px 0px 0px;
		padding: 0;
		position: absolute;
		right: 50px;
		top: 30px;
	}
	#main_cont #main_vis2 #main_view_com {
		width: auto;
		height: auto;
		margin: 0px 0px 0px 0px;
		padding: 0;
		position: absolute;
		right: 40px;
		top: 200px;
	}
}
@media screen and (max-width: 1110px) {
   /* 表示領域が1100px以下の場合に適用するスタイル */
	#main_cont #main_vis2 {
		width: 1100px;
		height: 200px;
		margin: 60px auto 0px;
		padding: 0;
		position: absolute;
	}
	#main_cont #main_vis2 #main_view {
		width: 280px;
		height: auto;
		margin: 0px 0px 0px 0px;
		padding: 0;
		position: absolute;
		right: 50px;
		top: 30px;
	}
	#main_cont #main_vis2 #main_view_com {
		width: auto;
		height: auto;
		margin: 0px 0px 0px 0px;
		padding: 0;
		position: absolute;
		right: 40px;
		top: 300px;
	}
}
@media screen and (min-width: 1400px) {
   /* 表示領域が1400px以上の場合に適用するスタイル */
	#main_cont #main_vis2 {
		width: 1400px;
		height: 200px;
		margin: 60px auto 0px;
		padding: 0;
	}
	#main_cont #main_vis2 #main_view {
		width: 280px;
		height: auto;
		margin: 80px 50px 0px 0px;
		padding: 0;
		float: left;
	}
	#main_cont #main_vis2 #main_view_com {
		width: auto;
		height: auto;
		margin: 10px 80px 0px 0px;
		padding: 0;
		float: right;
	}
}



#main_cont #main_vis2 #main_view #view_ster {
	width: 180px;
	height: 180px;
	margin: 0px auto;
	padding: 0;
	background: url(../images/top_yellow.png) left top no-repeat;
	background-size: cover cover;
	text-align: center;
}
#main_cont #main_vis2 #main_view #view_ster p {
	padding: 50px 0px;
	font-size: 26px;
	font-weight: bold;
	line-height: 140%;
}
#main_cont #main_vis2 #main_view #view_cont {
	width: 280px;
	height: 190px;
	margin: 10px auto 0px;
	padding: 0;
	background-color: #000000;
	text-align: center;
}
#main_cont #main_vis2 #main_view #view_cont p {
	padding: 4px 0px;
	color: #FFFFFF;
	font-size: 20px;
}
#main_cont #main_vis2 #main_view #view_cont #view_srg {
	width: 278px;
	height: 160px;
	margin: 1px;
	padding: 0;
	background-color: #FFFFFF;
	text-align: center;
}
#main_cont #main_vis2 #main_view #view_cont #view_srg p {
	padding: 60px 0 0 0;
	font-size: 26px;
	color: #000000;
}


/*==================================*
* train 新感覚トレインゲーム*/
#train_ar {
	width: 1100px;
	height: 330px;
	margin: 0px auto;
	padding: 0;
	text-align: center;
	background: url(../images/tra_321_reflect.png) 60px 34px no-repeat, url(../images/tra_500_reflect.png) 880px 20px no-repeat, url(../images/app_line.png) 20px 280px no-repeat;
	background-size: 200px 200px, 200px 200px, 1100px auto;
}
#train_ar img {
	margin: 40px 0 20px 0;
	padding: 0;
}
#train_ar p {
	padding: 0;
	font-size: 16px;
	line-height: 140%;
}

#train_sp_ar {
	width: 1100px;
	height: 510px;
	margin: 0px auto;
	padding: 0;
}
#train_sp_ar #trn_sp_cont_l {
	width: 540px;
	height: 510px;
	margin: 0;
	padding: 0;
	background: url(../images/sp_01.png) 270px top no-repeat;
	float: left;
}
#train_sp_ar #trn_sp_cont_l img {
	margin: 130px 0px 0px 60px;
	padding: 0;
}
#train_sp_ar #trn_sp_cont_r {
	width: 550px;
	height: 510px;
	margin: 0;
	padding: 0;
	background: url(../images/sp_04.png) 200px top no-repeat;
	float: left;
}
#train_sp_ar #trn_sp_cont_r img {
	margin: 130px 0px 0px 0px;
	padding: 0;
}

#train_pv_ar{
	width: 100%;
	height: auto;
	margin: 0px auto;
	padding: 0;
}
#train_pv_ar #view_cont {
	margin: 20px auto 20px;
	padding: 0;
	text-align: center;
}

#train_pv_ar #view_cont p {
	font-size: 26px;
}

/*==================================*
* campaign 事前登録キャンペーン*/

#campaign_all {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	background-color: #005bab;
}
#campaign_all #campaign_ar {
	width: 1100px;
	height: auto;
	margin: 0px auto;
	padding: 0;
}

#campaign_cont {
	width: 1100px;
	height: 580px;
	margin: 0px auto;
	padding: 0;
	box-sizing: border-box;
}
#campaign_cont #series_zero_txt {
	width: 540px;
	height: 580px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	float: left;
}
#campaign_cont #series_zero_txt img {
	margin: 110px 0px 60px 66px;
	padding: 0;
}
#campaign_cont #series_zero_txt #zero_btn_ar {
	width: 520px;
	height: auto;
	margin: 0px 0px 0px 60px;
	padding: 0;
}
#campaign_cont #series_zero_img {
	width: 560px;
	height: 580px;
	margin: 0;
	padding: 0;
	background: url(../images/series_zero_card.png) 230px 60px no-repeat;
	box-sizing: border-box;
	float: left;
}
#campaign_cont #series_zero_img img {
	margin: 160px 0px 0px 0px;
	padding: 0;
}


/*==================================*
* present 事前登録者数プレゼント*/
#present_all {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	background-color: #005bab;
}
#present_all #present_ar {
	width: 1100px;
	height: 670px;
	margin: 0px auto;
	padding: 0;
	background: url(../images/advance.png) left top no-repeat;
	background-size: 1100px auto;
}
#present_all #present_ar #pre_img_ar {
	width: 1100px;
	height: 566px;
	margin: 0;
	padding: 0;
}
#present_all #present_ar #pre_img_ar img {
	margin: 90px 0px 0px 765px;
}
#present_all #present_ar #pre_btn_ar {
	width: 1056px;
	height: auto;
	margin: 0px auto;
	padding: 0;
}


/*==================================*
* review コンテンツレビュー*/
#review_ar {
	width: 1100px;
	height: 180px;
	margin: 0px auto;
	padding: 0;
	text-align: center;
}
#review_ar img {
	font-size: 30px;
	padding: 64px 0 0 0;
}
#review_ar #rev_btn_ar {
	width: 630px;
	height: auto;
	margin: 0px auto;
	padding: 40px 0px 0px;
}


/*==================================*
* contact お問合せ*/
#contact_ar {
	width: 1100px;
	height: 180px;
	margin: 0px auto;
	padding: 0;
	text-align: center;
}
#contact_ar img {
	font-size: 30px;
	padding: 64px 0 0 0;
}
#contact_ar #cont_btn_ar {
	width: 610px;
	height: auto;
	margin: 0px auto;
	padding: 0px 0px 0px;
}


/*==================================*
* precontact お問合せ前注意文*/
#precontact_ar {
	width: 1100px;
	margin: 0px auto;
	padding: 0;
	text-align: center;
}


/*==================================*
* retweet リツイートキャンペーン*/
#retweet_ar {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: center;
	background: url(../images/re-tweet_bg.png) left top repeat-x;
	background-size: auto 310px;
}
#retweet_ar img {
	margin: 0;
	padding: 0;
}


/*==================================*
* official 公式アカウント*/
#official_ar {
	width: 100%;
	min-width: 1100px;
	height: auto;
	margin: 0;
	padding: 40px 0px;
	background: url(../images/offi_bg_01.png) left top repeat-x, url(../images/offi_bg_02.png) left bottom repeat-x, #005bab left top repeat;
}
#official_ar #official_cont {
	/* width: 1000px; */
	width: 460px;
	height: 400px;
	margin: 0px auto;
	padding: 0px 10px;
	background-color: #FFFFFF;
	border: solid 1px #FFFFFF;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-ms-border-radius: 8px;
	-o-border-radius: 8px;
	-webkit-border-radius: 8px;
	box-sizing: border-box;
}
#official_ar #official_cont #offi_tw {
	width: 460px;
	height: auto;
	margin: 10px 10px 0px;
	padding: 0;
	float: left;
}
#official_ar #official_cont #offi_fb {
	width: 460px;
	height: auto;
	margin: 10px 10px 0px;
	padding: 0;
	float: left;
}
#official_ar #official_cont .offi_com {
	width: 440px;
	height: auto;
	margin: 0;
	padding: 0px 10px;
}


/*==================================*
* media_banner バナー*/
.media_banner_ar {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}
.media_banner {
	width: 900px;
	height: 80px;
	margin: 10px auto;
	padding: 0;
	text-align: center;
}
.media_banner img {
	margin: 0px 5px;
	float: left;
}
.media_banner2 {
	width: 900px;
	height: 120px;
	margin: 10px auto;
	padding: 0;
	text-align: center;
}
.media_banner2 img {
	margin: 0px 5px;
	float: left;
}


/*==================================*
* a */
a {
	display: block;
	cursor: pointer;
	color: #333333;
}
.app_btn {
	width: 100px;
	height: 30px;
	margin: 0 10px 0 0;
	padding: 0;
	float: left;
}
.advance_btn {
	width: 310px;
	height: 80px;
	margin: 10px 10px;
	padding: 26px 0 0 70px;
	background: url(../images/btn_arrow02.png) 20px center no-repeat, #ffdd00 left top repeat;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: left;
	font-size: 24px;
	line-height: 120%;
	font-weight: bold;
	box-sizing: border-box;
	float: left;
}
.advance_btn02 {
	width: 240px;
	height: 50px;
	margin: 0px auto;
	padding: 17px 0px 0px;
	background: url(../images/btn_arrow02.png) 10px center no-repeat, #aaaaaa left top repeat;
	color: #FFFFFF;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	box-sizing: border-box;
}
.advance_btn03 {
	width: 220px;
	height: 80px;
	margin: 0px 5px;
	padding: 18px 0px 0px 58px;
	background: url(../images/btn_arrow02.png) 10px center no-repeat, #ffdd00 left top repeat;
	color: #333333;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: left;
	font-size: 18px;
	line-height: 120%;
	font-weight: bold;
	box-sizing: border-box;
	float: left;
}
.advance_btn04 {
	width: 510px;/*240px*/
	height: 80px;/*50px*/
	margin: 10px 8px 0px;
	padding: 24px 0px 0px;
	/*padding: 17px 0px 0px;*/
	background: url(../images/btn_arrow02.png) 30px center no-repeat, #ffdd00 left top repeat;
	color: #333333;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: center;
	font-size: 26px;
	line-height: 120%;
	font-weight: bold;
	box-sizing: border-box;
	float: left;
}
.fb_btn {
	width: 180px;
	height: 50px;
	margin: 30px 15px 0px;
	padding: 17px 0px 0px;
	background: url(../images/btn_arrow01.png) 10px center no-repeat, #455a9e left top repeat;
	float: left;
	color: #FFFFFF;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	box-sizing: border-box;
}
.tw01_btn {
	width: 180px;
	height: 50px;
	margin: 30px 15px 0px;
	padding: 17px 0px 0px;
	background: url(../images/btn_arrow01.png) 10px center no-repeat, #55acee left top repeat;
	float: left;
	color: #FFFFFF;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	box-sizing: border-box;
}
.tw02_btn {
	width: 260px;
	height: 50px;
	margin: 40px auto 0px;
	padding: 17px 0px 0px;
	background: url(../images/btn_arrow01.png) 10px center no-repeat, #55acee left top repeat;
	color: #FFFFFF;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	box-sizing: border-box;
}
.ln_btn {
	width: 180px;
	height: 50px;
	margin: 30px 15px 0px;
	padding: 17px 0px 0px;
	background: url(../images/btn_arrow01.png) 10px center no-repeat, #00da00 left top repeat;
	float: left;
	color: #FFFFFF;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	box-sizing: border-box;
}
.contact_btn {
	width: 600px;
	height: 60px;
	margin: 10px 10px;
	padding: 16px 0 0 70px;
	text-align: center;
	background: url(../images/btn_arrow02.png) 20px center no-repeat, #FFFFFF left top repeat;
	border: solid 1px #CCCCCC;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: left;
	font-size: 24px;
	line-height: 120%;
	font-weight: bold;
	box-sizing: border-box;
	float: left;
}


/*==================================*
* page-top トップへ戻る*/

#page-top {
	position: fixed;
	bottom: 0px;
	right: 20px;
	font-size: 77%;
}

#page-top a {
	background: #000;
	text-decoration: none;
	color: #fff;
	width: 80px;
	padding: 20px 0;
	text-align: center;
	display: block;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}

#page-top a:hover {
	text-decoration: none;
	background: #999;
}


/*==================================*
* info お知らせ*/
#info_ar {
	width: 900px;
	height: auto;
	margin: 30px auto 60px;
	padding: 0;
}
#info_ar #info_tit {
	width: auto;
	height: auto;
	margin: 0px auto 4px;
}
#js-info {
	width: 880px;
	height: 300px;
	overflow: auto;
	margin: 0px auto 15px;
	padding: 20px;
	border: 1px solid #CCCCCC;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	-ms-border-radius: 5px;
	box-sizing: border-box;
}
#js-info p {
	margin: 0;
	padding-bottom: 15px;
	line-height: 140%;
}



.notice_list {
	padding: 5px 20px;
}}