@charset "utf-8";

/* entry */
.entry p{
  text-align: left;
  font-weight: bold;
}
.entry p.shadow{
  text-shadow: 1px 1px 0px #ffffff;
}
.entry a:link,
.entry a:visited,
.entry a:active{
	color: #8484ff;
	text-decoration: none;
}
.entry a:hover{
	color: #ff8484;
	text-decoration: none;
}

/* p */
p.textHead{
  padding: 4px 10px;
  font-size: 16px;
}
@media(max-width:499px){/* for mobile */
  p.textHead{
    padding: 8px 0px;
    font-size: 12px;
  }
}

/* form */
form{
  margin-top: 20px;
}
form a{
  display: block;
}
form div.input{
  margin-bottom: 20px;
}
form div.input.narrow{
  margin-bottom: 10px;
}
form div.input div{
  margin: 10px;
}
input[type='submit']{
	border-style: none;
}
input[type='text']{
	width: 280px; height: 32px;
	font-size: 18px;
	padding: 3px;
	border: 1px solid #cccccc;
	border-radius: 5px;
}
input[type=text].fixText{
	background:#e6ffff;
}

/* btn */
.btn,
.btnA a{
  width: 280px; height: 60px;
  background: url(../img/entry/btnImg.png) no-repeat;
}
.btn:hover,
.btnA:hover,
.btnG:hover{
	cursor: pointer;
	opacity: 0.8;
}
.btn.help{
  width: 48px; height: 40px;
  margin-left: 10px;
}
.btn.ok{
	width: 100px;
	background-position: 0px -40px;
}
.btn.start{
  width: 280px;
  background-position: 0px -280px;
}
.btnA a{
	width: 200px;
	background-position: 0px -100px;
}
.btnA.cancel a{
  width: 280px;
	background-position: 0px -220px;
}
.btnA.rename a{
  width: 280px;
	background-position: 0px -160px;
}
.btnG{
  width: 280px; height: 60px;
  background: url(../img/entry/gameSelectBtn.png) no-repeat;
}
.btnG.neo{
	background-position: -280px 0px;
}
.btnG.ori.sel{
	background-position: 0px -60px;
}
.btnG.neo.sel{
	background-position: -280px -60px;
}

/* main */
.main{
  min-width: 700px;
}
@media(max-width:799px){/* for mobile */
  .main{
    min-width: auto;
  }
}

/* sub */
.sub{
  max-width: 300px;
}
@media(max-width:999px){/* for mobile */
  .sub{
    max-width: none;
  }
}
@media(max-width:299px){/* for mobile */
  .sub{
    display: none;
  }
}
.sub .box{
	width: 280px; height: 240px;
  margin: 10px;
	background: url(../img/entry/inputRight.png) no-repeat 0px 0px;
}
.sub .box.kuck{
	background-position: 0px -240px;
}
.sub .box p{
  padding: 24px;
}

/* menu */
.menu{
  margin: 20px 0px 60px;
}
.menu ul li{
  margin: 10px 20px;
}
.menu p{
  font-size: 12px;
  font-weight: normal;
  text-align: center;
}

/* ninin */
.ninin{
  min-height: 140px;
  margin: 10px 10px 20px;
  background: url(../img/entry/nininIcon1.png) no-repeat 10px 10px;
}
.ninin.step2{
  background: url(../img/entry/nininIcon2.png) no-repeat 10px 10px;
}
.ninin .msg{
  min-height: 140px;
  margin-left: 150px;
  background: #ffccff;
  border-radius: 5px;
}
.ninin p{
  padding: 20px 30px;
}
@media(max-width:499px){/* for mobile */
  .ninin{
    min-height: 80px;
    background: url(../img/entry/nininIconS1.png) no-repeat;
  }
  .ninin.step2{
    min-height: 80px;
    background: url(../img/entry/nininIconS2.png) no-repeat;
  }
  .ninin .msg{
    min-height: 80px;
    margin-left: 70px;
  }
  .ninin p{
    font-size: 12px;
    padding: 20px;
  }
}

/* infoArea */
#infoArea{
  margin: 10px;
  border-radius: 5px;
  background: #ffffff;
}
#infoArea ul{
  padding: 30px;
}
#infoArea ul li:not(.last){
  margin-bottom: 20px;
}
@media(max-width:499px){/* for mobile */
  #infoArea ul{
    font-size: 12px;
    padding: 20px;
  }
}

/* inputArea */
div.gSel,
div.gSel p{
  text-align: center;
}
div.gSel p.capt{
  color: #7f7fff;
  margin-bottom: 10px;
}
div.input.gSel{
  margin: 0px 30px 20px;
  padding: 10px 10px 20px 10px;
  background: #d9d9ff;
  border-radius: 5px;
}

/* confirmArea */
div.input .rankImg{
  width: 60px; height: 40px;
  margin-left: 0px;
  background: url(../img/entry/rank/shugyosha.png) no-repeat;
}
div.input .rankImg.sp{background: url(../img/entry/rank/sp.png) no-repeat;}
div.input .rankImg.uchujin{background: url(../img/entry/rank/uchujin.png) no-repeat;}
div.input .rankImg.chojin{background: url(../img/entry/rank/chojin.png) no-repeat;}
div.input .rankImg.tatsujin{background: url(../img/entry/rank/tatsujin.png) no-repeat;}
div.input .rankImg.meijin{background: url(../img/entry/rank/meijin.png) no-repeat;}
div.input .rankImg.junmeijin{background: url(../img/entry/rank/junmeijin.png) no-repeat;}
.rankData{
  min-width: 450px;
}
@media(max-width:499px){/* for mobile */
  .rankData{
    min-width: auto;
    width: 90%;
  }
  .rankData p{
    font-size: 12px;
  }
}
.rankData div{
  margin-left: 1em;
  margin-bottom: 1em;
}
.rankData div.data{
  margin-left: 2em;
}
div.start{
  margin: 20px 0px 10px 0px;
  text-align: center;
}
.rankImg.right{
	width: 250px; height: 190px; 
	background: url(../../game/mail/exImg/rankImg.png) no-repeat -500px -230px;
}
.rankImg.right.sp{background-position:-750px -230px;}
.rankImg.right.uchujin{background-position:-250px -20px;}
.rankImg.right.chojin{background-position:-500px -20px;}
.rankImg.right.tatsujin{background-position:-750px -20px;}
.rankImg.right.meijin{background-position:0px -230px;}
.rankImg.right.junmeijin{background-position:-250px -230px;}
@media(max-width:699px){/* for mobile */
  .rankImg.right{
    display: none;
  }
}
div.logoG{
  width: 240px; height: 60px;
  background: url(../img/entry/gameLogo.png) no-repeat;
}
div.logoG.neo{
  background-position: -240px 0px;
}
div.flexbox.conf{
  justify-content: start;
  margin-left: 2em;
}