@charset "UTF-8";
/* CSS Document */

/*----------------------------------

グランドガチャ・メルマガ
 
---------------------------------- */
.gachaText{	color: #151515;}
.gachaBack{
padding: 3% 0;
background: #410404;
background: -moz-linear-gradient( #cb0810 0%, #410404 100%);
background: -webkit-gradient(linear, left top, left bottom, from(#cb0810), to(#410404));
background: -webkit-linear-gradient( #cb0810 0%, #410404 100%);
background: -o-linear-gradient( #cb0810 0%, #410404 100%);
background: linear-gradient( #cb0810 0%, #410404 100%);
border: 1px solid #410404;
box-shadow: 0 0 1px 1px #cb0810 inset;
}
.step {
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 20px;
	line-height: 150%;
}
.flow{width: 100%; overflow: hidden; margin: 2% 0; box-sizing: border-box;}
.img_left{float: left; width: 20%; margin-right: 3%; text-align: center;}
.text_right{float: left; width: 77%;}
.img_leftW{float: left; width: 40%; margin-right: 3%; text-align: center;}
.text_rightW{float: left; width: 57%;}
ol.list_parentheses{
width: 77%;
box-sizing: border-box;
float: left;
padding:0 0 0 1em;
margin:0;
}
 
ol.list_parentheses li{
  list-style-type:none;
  list-style-position:inside;
  counter-increment: cnt;
}
ol.list_parentheses li:before{
  display: marker;
  content: "(" counter(cnt) ") ";
}

img.maga_qr  {
	width: 102px;
	height: 102px;
}

#kgpNotice{ background-color: #151515;}
#kgpNotice .inner{ padding: 5%;}
#kgpNotice .center{ text-align: center; font-weight: bold;}
#kgpNotice .text{ color: #fff; margin-top: 5%;}
#kgpNotice .text p:last-child{ margin-top: 3%;}
#kgpNotice .list{  width: 100%; border:1px solid #777777; margin-top: 5%;}
#kgpNotice .list li{ overflow: hidden;}
#kgpNotice .list li:not(:last-child){ border-bottom:1px solid #777777;}
#kgpNotice .list div{ float: left; padding: 3%; box-sizing: border-box;}
#kgpNotice .list div:first-child{ width: 30%; }
#kgpNotice .list div:last-child{ width: 70%; border-left:1px solid #777777;}
#kgpNotice .list div:last-child span{ margin: 0 4% 0 2%;}

/*-------------------------------------------------------------

タブレット
 
------------------------------------------------------------- */

@media screen and (max-width: 949px) {
	.step {
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 20px;
	line-height: 150%;
	
}
	
	
ol.list_parentheses{
  padding:0 0 0 0em;
  margin:0;
	margin-bottom: 20px;
}
 
ol.list_parentheses li{
  list-style-type:none;
  list-style-position:inside;
  counter-increment: cnt;
}
ol.list_parentheses li:before{
  display: marker;
  content: "(" counter(cnt) ") ";
}
	
img.maga_qr  {
	width: 102px;
	height: 102px;
	margin-bottom: 20px;
}

}

/*-------------------------------------------------------------

スマホ
 
------------------------------------------------------------- */

@media screen and (max-width: 750px) {
	.step {
	font-size: 5vw;
	font-weight: bold;
	margin-bottom: 10px;
	line-height: 150%;
}

.img_left, .text_right, .img_leftW, .text_rightW, ol.list_parentheses{float: none; width: 100%;}
.text_right, .text_rightW{ margin-top: 3%;}
#kgpNotice .list div:last-child span{ display: block; margin: 0;}
}