body {
    position: relative;
    margin: 0;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
    background-color:rgb(0,0,0);
}


#canvas {
	position:absolute;
	margin:0px;
	padding:0px;
}

#gameArea {
	position: relative;
	margin:0px;
	padding:0px;
	//width: 375px;
	//height: 375px;
	//width: 100%;
	overflow:hidden;
}

#loading{
	position:absolute;
	z-index:10;
    visibility : hidden;

	left:0;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
	
	width: 100%;
	text-align:center;
}

#splash{
	position:absolute;
	z-index:10;

	left:0;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
	padding-top: 30px;
	
	width: 100%;
	text-align:center;
}

/* ビューポートのベース */
#viewport {
  width: 100vw;
  height: 100vh;
}

/* 横長のときだけ中央寄せ（水平＋垂直のどちらもセンタリング） */
@media (orientation: landscape) {
  #viewport {
    display: flex;
    align-items: center;   /* 垂直中央 */
    justify-content: center; /* 水平中央 */
  }
}

/* 縦長（既定）：今まで通り。必要なら水平センターだけ入れる */
@media (orientation: portrait) {
  #viewport {
    display: block; /* 従来挙動を維持 */
  }
  //もし縦でも水平センターにしたい場合は以下の1行を有効化
  //#gameArea { margin-left: auto; margin-right: auto; }
  
}