body {
    margin: 0;
    padding: 0;
}

button{
    border: none;
    background: transparent;
}

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

.ps_logo {
	position: absolute;
	top: 0px;
	right: 0px;
    z-index: 2;
}

#icon_kohane_ex{
    position: absolute;
    left: calc(0px * 380 /1080);
    top: calc(0px * 380 /1080);
    width: calc(240px * 380 /1080);
    height: auto;
	z-index: 11;
}

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

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

#MainArea {
	position:relative;
	
	background-repeat: repeat;
    background-clip: content-box;
	background-image: url("../img/01_top/kabegami.jpg");
    background-size: 33%;
    width: calc(1400px * 380 / 1400);
    height: calc(2420px * 380 / 1400);
}

#box{
	position:relative;
	width:100%;
	height:auto;
    margin:0 auto;
    left: 0px;
}

.simple_button {
    cursor: pointer;
}
.simple_button img:hover {
    transform: scale(1.05);
}

#bar{
	position:absolute;
    left: calc(0px * 380 / 1400);
    top: calc(65px * 380 / 1400);
    width: 380px;
    height: calc(128px * 380 / 1400);
}

#mainImg{
	position:absolute;
    left: calc(76px * 380 / 1400);
    top: calc(237px * 380 / 1400);
    width: calc(1248px * 380 / 1400);
    height: auto;
}
#dummy{
    position: absolute;
    width: calc(1400px * 380 / 1400);
    height: calc(1320px * 380 / 1400);
}

#arrow_left{
	position:absolute;
    left: calc(98px * 380 / 1400);
    top: calc(754px * 380 / 1400);
    width: calc(50px * 380 / 1400);
    height: auto;
}
#arrow_right{
	position:absolute;
    left: calc(1258px * 380 / 1400);
    top: calc(754px * 380 / 1400);
    width: calc(50px * 380 / 1400);
    height: auto;
}

/*
サイズは共通なので
.system_buttonで記載
*/
#systemButton01{
    position: absolute;
    left: calc((557px - 252px) * 380 / 1400);
    top: calc((12px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_gam.png");
}
#systemButton01:hover,
#systemButton01.select_button {
    background-image: url("../img/04_system/but_gam_on.png");
}

#systemButton02{
    position: absolute;
    left: calc((641px - 252px) * 380 / 1400);
    top: calc((94px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_sta.png");
}
#systemButton02:hover,
#systemButton02.select_button{
    background-image: url("../img/04_system/but_sta_on.png");
}
#systemButton03{
    position: absolute;
    left: calc((721px - 252px) * 380 / 1400);
    top: calc((12px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_koh1.png");
}
#systemButton03:hover,
#systemButton03.select_button{
    background-image: url("../img/04_system/but_koh1_on.png");
}
#systemButton04{
    position: absolute;
    left: calc((805px - 252px) * 380 / 1400);
    top: calc((94px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_koh2.png");
}
#systemButton04:hover,
#systemButton04.select_button{
    background-image: url("../img/04_system/but_koh2_on.png");
}
#systemButton05{
    position: absolute;
    left: calc((885px - 252px) * 380 / 1400);
    top: calc((12px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_koh3.png");
}
#systemButton05:hover,
#systemButton05.select_button{
    background-image: url("../img/04_system/but_koh3_on.png");
}
#systemButton06{
    position: absolute;
    left: calc((969px - 252px) * 380 / 1400);
    top: calc((94px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_tob.png");
}
#systemButton06:hover,
#systemButton06.select_button{
    background-image: url("../img/04_system/but_tob_on.png");
}
#systemButton07{
    position: absolute;
    left: calc((1049px - 252px) * 380 / 1400);
    top: calc((12px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_tak.png");
}
#systemButton07:hover,
#systemButton07.select_button{
    background-image: url("../img/04_system/but_tak_on.png");
}
#systemButton08{
    position: absolute;
    left: calc((1134px - 252px) * 380 / 1400);
    top: calc((94px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_ite.png");
}
#systemButton08:hover,
#systemButton08.select_button{
    background-image: url("../img/04_system/but_ite_on.png");
}
#systemButton09{
    position: absolute;
    left: calc((1213px - 252px) * 380 / 1400);
    top: calc((12px+23px) * 380 / 1400);
    background-image: url("../img/04_system/but_sec.png");
}
#systemButton09:hover,
#systemButton09.select_button{
    background-image: url("../img/04_system/but_sec_on.png");
}
.system_button{
    cursor: pointer;
    width: calc(150px * 380 / 1400);
    height: calc(156px * 380 / 1400);
    background-size:cover;
    background-repeat: no-repeat;
    clip-path: polygon(0% 50%, 50% 100%, 100% 50%, 50% 0%);/* ひし形 */
}
#FooterArea{
    top: -60px;
}
#footer {
	/*理由がよくわからない値*/
	scale: 35.2%;
	left: -350px;
	top: -90px;
	/*理由がよくわからない値ここまで*/
	position: absolute;
	border: 0;
	width:1080px;
	height:340px;
	padding:0;
}