@charset "utf-8";
/* CSS Document */
*{zoom:1;}
:root{
	--catch:#ff0000;
	--titleLine:#000;
	--red:#ff0000;
	--line:#dcdcdc;
	--footer:#000;
	--backTop:#000;


	
}
body {
	font-family:'Noto Sans JP', "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	/*font-family: 'Noto Serif JP',"游明朝", YuMincho, "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", serif; */
	background-color: #222;
	font-size:16px;
	color:#fff;
    line-height:1.5em;
    width:100%;

/*	-webkit-text-size-adjust:100%;*/
}
body,nav,header,footer,div,p,a,ul,li,section,article,dl,dt,dd,h1,h2,h3,h4,h5,h6,img{
	margin:0;
	padding:0;
	font-weight:normal;
	list-style-type:none;	
	box-sizing:border-box;
	font-size: 1em;
}

a{
	text-decoration:none;
	word-wrap: break-word;     /* 旧プロパティ名 */
	overflow-wrap: break-word; /* 新プロパティ名 */
}
a:hover{
}
img{width: 100%;}
.popupBox{
	padding: 1em;
	max-width: 1024px;
}
.img{
	width: 35%;
	max-width: 500px;
	display: inline-block;
	vertical-align: middle;
}
.txtArea{
	width:calc(65% - 1em);
	display: inline-block;
	vertical-align:middle;
	margin-left: 1em;
	
}
.txt{
	padding: 1em;
	border-top: #999 1px dashed;
	border-bottom: #999 1px dashed;
	margin-bottom: 1em;
	margin-top: 0.5em;

}
.gameTitle{
	padding: 0.5em;
	font-weight: bold;
	position: relative;
	border-left: var(--red) 0.5em solid;
}
.gameTitle.iconSet{
	padding-right: 6em;

}
.gameTitle img.icon{
	width:5.5em;
	position: absolute;
	right: 0;
	bottom: 0;
}
.btBox a{
	width: calc(50% - 1em);
	color: #fff;
	padding: 0.5em;
	text-align: center;
	display:inline-block;
	margin:0 0.25em ;
	background-color: var(--titleLine);

}
.btBox a{

}

.btBox a.e-store{
	background-color: #ef3030;
}

/*---------------------------------------------------------
@media
------------------------------------------------------------*/


@media (max-width: 912px) {
.img{
	width: 70%;
	display: block;
	margin: 0 auto;
}
.txtArea{
	width:calc(100% - 1em);
	display: block;
	vertical-align:middle;
	margin: 1em auto;
	
}


}

@media (max-width: 786px) {
.btBox a{
	width: 100%;
	display: block;
	margin:0 0 2px ;
	padding: 1.5em 1em;
}
    body{
	min-width:0; 
	overflow-x:hidden;
		font-size:clamp(12px, 2.6vw, 14px);
		line-height: 1.5em;

	}

}
@media (max-width: 480px) {

    body{

   	font-size: max(3.3vw, 13px);
	line-height: 1.5em;

	}
}

