
#MainArea {
	position:relative;
	text-align: center;
	font-size: 100%;
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color: rgb(255, 255, 255);
	background-color: white;
	margin-right: auto; /*余白ゼロ*/
	margin-left: auto;  /*余白ゼロ*/
	/*width: 1920px;*/
	/*height: 3274px;*/
	width: auto;
	height:auto;
    margin: 0 auto; /*中央揃え*/
    box-sizing:border-box;	/*あらゆるものを高さに含める*/
}



/* 背景1（表示高さいっぱいに配置されるよう設定＋固定） */
.fixed-bg {
	height: 1200px;
	width: auto;
	max-width: 1920px;
	/*min-height: 100%;*/
    background-size: cover;         /*縦横比を保持して、表示領域全体を覆うように背景画像を表示*/
    background-attachment: fixed;   /*固定*/
    background-repeat: no-repeat;   /*背景は繰り返さない*/
    background-position: center top;
    z-index: 0;
    margin-right: auto;
	margin-left: auto;
}
.fixed-bg.bg1 {
	max-width: 1920px; /* 最大幅 */
	max-height:1200px;
	min-width: 960px;  /* 最小幅...高さが960px未満の時でも、960px分の高さを形成します */
	min-width: 740px;
	background-image: url("../img/01_top/back.jpg");
}


/* 背景2 */
.scrolling-bg{
	width: 100%;
	height: auto;
	max-width: 1920px;
	min-height: 100%;
    background-repeat: repeat;           /*横、縦方向に繰り返す*/
    background-clip: content-box;
    z-index: 10;
    margin-right: auto;
	margin-left: auto;
}
.scrolling-bg.bg2{
	background-image: url("../img/01_top/kabegami.jpg");
	width: 100%;
	height: 4600px;
	height:auto;
}


/* 雲（親はmainArea）*/
.kumo{
	z-index: 20;
	position: absolute;
	width:100%;
	height:1070px;
	max-width: 1920px; /* 最大幅 */
	min-width: 1550px; /* 最小幅 */
	top:720px;
	bottom:0;
	left:0;
	right:0;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}
.kumo img{
	width: 100%;
	height:1070px;
	top:0;
    left:0;
    right:0;
    margin:0 auto;
}


/* Switch、PSロゴ ----------------- */
.switch_logo {
	position: absolute;
	top: 0px;
	right: 300px;
}

.ps_logo {
	position: absolute;
	top: 0px;
	right: 0px;
}


/* 購入ページ ----------------- */
.DL_btn {
	z-index: 100;
	position: fixed;
    right: 0;
    top: 240px;
}

.DL_btn_ps {
	z-index: 100;
	position: fixed;
    right: 0;
    top: 460px;
}

/* ロゴ --------------------- */
.logo{
	position: absolute;
	width: 1344px;
    height: 250px;
    top:0;
    left:0;
    right:0;
	margin:0 auto;
	z-index: 0;
	text-align: left;
}
.logo img{
	width:300px;
	height:300px;
	left: 20px;
}

/* 文字 --------------------- */
.moji{
	position: absolute;
	width: 1344px;
    height: 330px;
    top:19%;
    left:0;
    right:0;
	margin:0 auto;
	padding:0 0 0 100px;
	z-index: 0;
	text-align: left;
}
.moji img{
	margin:-1em 0px;    /* 行間（上下、左右） */
}

/* トリプルキャンペーン★ -------------- */
.camp{
	position: absolute;
	width: 1344px;
	height: 300px;
	top: 460px;
	left: 0;
	right: 0;
	margin:0 auto;
	padding:0 0 0 820px;
	/*margin:0 0 0 380px;*/ /* 上 右 下 左 */
	text-align: right;
}
.camp img{
	width:406px;
	height:291px;
	margin:30px 250px 0 0;
}
.camp img:hover {
	transform: scale(1.1);		/*画像の拡大率*/
	transition-duration: 0.3s;	/*変化に掛かる時間*/
}

.kohaneJK{
	position: absolute;
	top: 170px;
	/*背景から出ないようにしつつ*/
	right: max(100px,calc((100% - 1920px) * 0.5 +1920px ));
	text-align: right;
}
.kohaneJK a{
	text-decoration: none;
}
.kohaneJK img:hover {
	transform: scale(1.05);		/*画像の拡大率*/
	transition-duration: 0.1s;	/*変化に掛かる時間*/
}

.oubo{
	position: absolute;
	width: 1344px;
	height: 200px;
	top: 620px;
	left: 0;
	right: 0;
	margin:0 auto;
	padding:0 0 0 800px;
	/*margin:0 0 0 600px;*/ /* 上 右 下 左 */
	text-align: center;
	z-index: 21;
}
.oubo img{
	width: 500px;
	height: auto;
	margin:0px 0px 0 0px; /* 上 右 下 左 */
	/*padding:0 0 0 50px;*/
	margin:-0.5em 0px;    /* 行間（上下、左右） */
}



/*
.sale{
	position: absolute;
	width: 1344px;
	height: 300px;
	top: 450px;
	left: 0;
	right: 0;
	margin:0 auto;
	padding:0 0 0 880px;
	text-align: right;
}
.sale img{
	width:310px;
	height:260px;
	margin:30px 250px 0 0;
}
*/

/*-----------------------------------------------------*/

.Area1{
	position: relative;
	width:1200px;
	height:720px;
	overflow:hidden;
	text-align:center;
	margin:0 auto;
	box-sizing:border-box;	/* width+左右のmarginの合計を100%にすれば、親要素にはまる。 */
	z-index: 30;
}
.Area1 img{
	width:1188px;
	height:694px;
	margin:0 auto;
}
.news{
	position: absolute;
	top:180px;
	left:175px;
	right:0;
	width:862px;		/* 横幅（必須） */
	height:341px; 		/* 縦幅（必須） */
	/*background-color:#ccc;*/ /* 背景色 */
	overflow: auto;       /*状況に応じて縦スクロールバーが出現*/
	/*margin:0 auto;*/
}

/* スクロールバー全体*/
/*
.news::-webkit-scrollbar{
    width:20px;
    background:#92eef4;
}
*/
/*横スクロールバー全体*/
/*
.news::-webkit-scrollbar:horizontal {
    height:20px;
}
*/
/* スクロールバー上下左右末端のボタン*/
/*
.news::-webkit-scrollbar-button {
    width:20px;
    height:20px;
    background:#3ddbe5;
}
*/
/* ドラッグするツマミ部分*/
/*
.news::-webkit-scrollbar-thumb {
    background:#ffa32b;
}
*/
/* 右下角部分*/
/*
.news::-webkit-scrollbar-corner {
    background:#3ddbe5;
}
*/


.news p{
	/*font-size:100%;*/		/* 文字サイズ */
	/*color: #443b3b;*/	/* 文字色 今→#88656e */
	color: #503828;
	/*font-weight: bold;*/				/* 太字に */
	font-size: 1.1em;					/* サイズ1.2倍 */
	text-align: left;					/* 左詰め */
	margin:0.2em 10px;					/* 行間（上下、左右） */
	/*text-decoration: underline;*/
	letter-spacing: 0.5px;				/*文字幅*/
}
.news span{
	color:#ff307e;
}
.news span.date{
	display: inline-block;
	width:140px;
	/*text-decoration: underline;*/
	color:#ff307e;
}
.news a{
	color: #503828;
	text-decoration: none;
}
.news a:hover{
	text-decoration: underline;
	color: #ff307e;
	/*border-bottom: 1px solid #ff307e;*/
}

.news img{
	width:32px;
	height:12px;
}

.Area2{
	position: relative;
	width:1400px;
	height:720px;
	overflow:hidden;
	text-align:center;
	margin:0 auto;
	box-sizing:border-box;	/* width+左右のmarginの合計を100%にすれば、親要素にはまる。 */
	z-index: 30;
}

/* ツイッター（ブロック２の１）------------------ */
.twitterArea{
	position: relative;
	float: left;	/* 横並びのためにfloat */
	width:506px;
	height:720px;
	//background-image: url("../img/01_top/tab_03_off.png");
    //background-repeat: no-repeat;
	box-sizing:border-box;
	overflow:hidden;
	margin:0 auto;
	text-align: center;
}

.twitterArea .twitter {/*classがtwitterのアイコンに対して*/
	position: absolute;
	top:120px;
	left:0;
	right:0;
	width:90%;
	height:auto;
	margin:0 auto;
	padding:0 0 0 0;/* 上 右 下 左 */
}

.twitterArea .foll{
	position: absolute;
	bottom:36px;
	left:0;
	width:480px;
	height:64px;
	margin:0 auto;
}
.button{
	display: inline-block;     /* インラインブロック要素にする */
	top:50%;
	margin:0 10px;
	padding:0;		/*余計な隙間を除く*/
	cursor:pointer;
	vertical-align: middle;		/* 上下揃え（インライン要素のみ有効） */
}



/* 動画＆LINE（ブロック２の２） */
.moveArea{
	position: relative;
	float: left;	/* 横並びのためにfloat */
	width:782px;
	height:720px;
	box-sizing:border-box;
	margin:0 0 0 10px;   /*  上 右 下 左（ここが中間の隙間になる）  */
}

.move{
	position: relative;
	width: 100%;
	height:auto;
	margin:0 auto;
	padding:0 0 8px 0;
}
.move #mov1{
	position: absolute;
	width: 660px;
	height:auto;
	top:84px;
	left:0;
	right:0;
	margin: 20px auto;
	padding:0;
}

/* LINE------------------------ */
.moveArea .LINEstamp{
	position: absolute;
	width:782px;
	height:auto;
	bottom:0px;
	margin:0 0 20px 0;
}



/* ソフト情報2（モード等） */
.info {
	position: relative;
	width:1206px;
	height:360px;
	buttom: 0px;
	margin: 0 auto;			/* 中央揃え */
}

.info .get_soft{
	position: absolute;
	bottom: 60px;
	left: 200px;
}
.info .get_soft_ps{
	position: absolute;
	bottom: 60px;
	right: 200px;
}

.soft_text{
	position: absolute;
	width:1000px;
	height:150px;
	top:20px;
	left:400px;
	margin: 0 auto;	/* 中央揃え */
	padding:0;		/*余計な隙間を除く*/
}
.soft_text p{
	font-size:100%;		/* 文字サイズ */
	color: white;		/* 文字色 */
	font-weight: bold;	/* 太字に */
	font-size: 1.1em;	/* サイズ1.5倍 */
	text-align: left;	/* 左詰め */
	/*margin:1em 10px;*/    /* 行間（上下、左右） */
}

.Area3{
	position: relative;
	width:1300px;
	height:100px;
	overflow:hidden;
	text-align:center;
	margin:0 auto;
	box-sizing:border-box;	/* width+左右のmarginの合計を100%にすれば、親要素にはまる。 */
	z-index: 30;
}
.Area3 img{
	width:1300px;
	height:72px;
	margin:0 auto;
}

.obi{
	height: 60px;
	width: 100%;
	background-color: #ff307e;
	border: none;
	margin:0 0 0px 0;    /* 行間（上 右 下 左） */
	filter:alpha(opacity=30);
	-moz-opacity: 0.3;
	opacity: 0.3;
}

.text{
	position: absolute;
	box-sizing:border-box;
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color: #ff8ab5;
	font-size:15px;
	text-decoration:none;
	text-align:center;
	line-height:15px;
	margin:0;
}

#footer {
	position: absolute;
	border: 0;
	width: 100%;
	height: 340px;
    margin: 0 auto;
	padding:0;
}

.wrap {
	overflow: hidden;
}


*{
	margin:0;
	padding:0;
	box-sizing:border-box;            /* パディングとボーダーを幅と高さに含める */
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}

