@charset "UTF-8";
/* CSS Document */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  font-weight:normal;/* Yutaka added */
  vertical-align:baseline;
}


ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.clear{
  clear:both;
}
img {
  vertical-align: bottom;
}

/*--------------------------------------------------
@navi
--------------------------------------------------*/
body{
   background:url(../images/bg.gif) repeat;
   margin:0 auto;
 }
 #navi{
  
  text-indent:-9999px;
  margin:0 auto;
  
  position: fixed;
 
  left:50%;
  width:320px;
  height:90px;
  margin-top:-60px;
 margin-left:-160px;
}
.n01 a{
  display:inline;
  width:80px;
  height:45px;
  background:url(../images/navi_01.png) no-repeat;
  background-size:80px 45px;
  float:left;
}
.n02 a{
  display:inline;
  width:80px;
  height:45px;
  background:url(../images/navi_02.png) no-repeat;
  background-size:80px 45px;
  float:left;
}
.n03 a{
  display:inline;
  width:80px;
  height:45px;
  background:url(../images/navi_03.png) 0 no-repeat;
  background-size:80px 45px;
  float:left;
}
.n04 a{
  display:inline;
  width:80px;
  height:45px;
  background:url(../images/navi_04.png) 0 no-repeat;
  background-size:80px 45px;
  float:left;
}


/*--------------------------------------------------
@photo
--------------------------------------------------*/
#photo{
	margin:60px auto 0;
	text-align:center;
	width:100%;
}
.tx a{
	font:"ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif ;
	font-size:16px;
	color:#515151;
	text-decoration:none;
}
.image{
	margin:0 auto;
	width:100px;
	height:100px;
	background:url(../images/photo_02.png) center no-repeat;
	background-size:100px 100px;

}
/*--------------------------------------------------
@foot
--------------------------------------------------*/
#ft_btn{
  margin:0 auto;
   text-indent:-9999px;
   width:320px;
}
.ft a{
  display:block;
  background:url(../images/a_btn.png) no-repeat;
  background-size:145px 50px;
  width:145px;
  height:50px;
  margin:10px 10px 0 10px;
  float:left;
}
.tk a{
  display:block;
  background:url(../images/t_btn.png) no-repeat;
  background-size:145px 50px;
  width:145px;
  height:50px;
  margin:10px 0 0 0;
   float:left;
}
/*--------------------------------------------------
@Profile
--------------------------------------------------*/
#Profile{
  margin:20px auto 0;
  font-size:18px;
  font-family:"ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color:#ffffff;
}
#Profile table{
  margin:0 auto 0;
  width:320px;
}
#Profile table tr{
  height:30px;
}
#Profile a{
	color:#ffffff;
	text-decoration:none;
}
 .ic_01{
	text-indent:-9999px;
	background:url(../images/icon_01.png) center right no-repeat;
	background-size:23px 23px;
	width:23px;
	height:23px;
	padding:0 0 0 95px;
}
.ic_02{
	width:270px;
	padding:0 0 0 5px;
	vertical-align:middle;
}
 .ic_03{
	text-indent:-9999px;
	background:url(../images/icon_02.png) center right no-repeat;
	background-size:23px 23px;
	width:23px;
	height:23px;
	padding:0 0 0 95px;
}
 .ic_04{
	text-indent:-9999px;
	background:url(../images/icon_03.png) center right no-repeat;
	background-size:23px 23px;
	width:23px;
	height:23px;
	padding:0 0 0 95px;
}
 .ic_05{
	text-indent:-9999px;
	background:url(../images/icon_04.png) center right no-repeat;
	background-size:23px 23px;
	width:23px;
	height:23px;
	padding:0 0 0 95px;
}
 .ic_06{
	text-indent:-9999px;
	background:url(../images/icon_05.png) center right no-repeat;
	background-size:23px 23px;
	width:23px;
	height:23px;
}
/*--------------------------------------------------
@f_navi
--------------------------------------------------*/
#f_navi{
  width:320px;
  text-indent:-9999px;
  margin:25px auto;
}
.f_01 a{
  display:block;
  width:160px;
  height:44px;
  background:url(../images/f_navi_01.gif) no-repeat;
  background-size:160px 44px;
  float:left;
}
.f_02 a{
  display:inline;
  width:160px;
  height:44px;
  background:url(../images/f_navi_02.gif) no-repeat;
  background-size:160px 44px;
  float:left;
}
.f_03 a{
  display:inline;
  width:160px;
  height:44px;
  background:url(../images/f_navi_03.gif) no-repeat;
  background-size:160px 44px;
  float:left;
}
.f_04 a{
  display:inline;
  width:160px;
  height:44px;
  background:url(../images/f_navi_04.gif) no-repeat;
  background-size:160px 44px;
  float:left;
}
/*--------------------------------------------------
@c_title
--------------------------------------------------*/
#coin{
  width:320px;
  margin:60px auto 0;
  text-indent:-9999px;
}
.c_title{
  background:url(../images/coin.png) center 0 no-repeat;
  background-size:300px 81px;
  width:300px;
  height:81px;
  display:block; 
  margin:20px auto 0;
 }
/*--------------------------------------------------
@c_title
--------------------------------------------------*/
#point{
  width:320px;
  margin:0 auto;
  text-indent:-9999px;
}
.pt_01 a{
  width:145px;
  height:70px;
  background:url(../images/50coin.png) no-repeat;
  background-size:145px 70px;
  display:block;
  float:left;
  margin: 0 10px 0 10px;
}
.pt_02 a{
  width:145px;
  height:70px;
  background:url(../images/100coin.png) no-repeat;
  background-size:145px 70px;
  display:block;
  float:left;
}
.pt_03 a{
  width:145px;
  height:70px;
  background:url(../images/200coin.png) no-repeat;
  background-size:145px 70px;
  display:block;
  float:left;
  margin:20px 10px 0 10px;
}
.pt_04 a{
  width:145px;
  height:85px;
  background:url(../images/330coin.png) no-repeat;
  background-size:145px 85px;
  display:block;
  margin:5px 0 0 0;
  float:left;
}
.pt_05 a{
  width:145px;
  height:85px;
  background:url(../images/560coin.png) no-repeat;
  background-size:145px 85px;
  display:block;
  float:left;
  margin:5px 10px 0 10px;
}
.pt_06 a{
  width:145px;
  height:85px;
  background:url(../images/900coin.png) no-repeat;
  background-size:145px 85px;
  display:block;
  margin:5px 0 0 0;
  float:left;
}
.pt_07 a{
  width:145px;
  height:85px;
  background:url(../images/1150coin.png) no-repeat;
  background-size:145px 85px;
  display:block;
  float:left;
  margin:5px 10px 0 10px;
}
.pt_08 a{
  width:145px;
  height:85px;
  background:url(../images/2500coin.png) no-repeat;
  background-size:145px 85px;
  display:block;
  margin:5px 0 0 0;
  float:left;
}
/*--------------------------------------------------
@m_btn
--------------------------------------------------*/
#m_btn{
  margin:0 auto;
   text-indent:-9999px;
   width:320px;
}
.m_coin a{
  display:block;
  background:url(../images/m_btn01.png) no-repeat;
  background-size:96px 96px;
  width:96px;
  height:96px;
  margin:20px 6px 0 10px;
  float:left;
}
.m_mryo a{
  display:block;
  background:url(../images/m_btn02.png) no-repeat;
  background-size:96px 96px;
  width:96px;
  height:96px;
  margin:20px 6px 0 0;
  float:left;
}
.t_sirase a{
  display:block;
  background:url(../images/m_btn03.png) no-repeat;
  background-size:96px 96px;
  width:96px;
  height:96px;
  margin:20px 10px 0 0;
   float:left;
}
/*--------------------------------------------------
@back_menu
--------------------------------------------------*/
#back_menu{
  width:320px;
  margin:0 auto;
  text-indent:-9999px;
 }
.m_btn a{
  display:block;
  width:170px;
  height:30px;
  background:url(../images/m_btn.png) no-repeat;
  background-size:170px 30px;
  margin:20px auto;
 }
 /*--------------------------------------------------
@use
--------------------------------------------------*/
#up{
  margin:60px auto 0;
  text-align:center;
  width:320px;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.step1{
  text-indent:-9999px;
  background:url(../images/step1.gif) no-repeat;
  background-size:320px 60px;
  width:320px;
  height:60px;
  margin:0 auto;
}
.text01{
  text-align:left;
  margin:10px 0 0 20px;
  width:300px;
  color:#ff2a2a;
  font-size:16px;
}
.click{
  text-indent:-9999px;
  background:url(../images/click.png) no-repeat;
  background-size:243px 309px;
  width:243px;
  height:309px;
  margin:5px auto 0;
}
#friend{
  margin:20px auto 0;
  text-align:center;
  width:320px;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.step2{
  text-indent:-9999px;
  background:url(../images/step2.gif) no-repeat;
  background-size:320px 60px;
  width:320px;
  height:60px;
  margin:0 auto;
}
.ken_icon{
  text-indent:-9999px;
  float:left;
  background:url(../images/tu_kensaku.png) no-repeat;
  background-size:30px 46px;
  width:30px;
  height:46px;
  margin:10px 10px 0 20px;
}
.text02{
  float:left;
  font-size:20px;
  color:#5a4b44;
  margin:17px 0 0 0;
}
.kn_list{
	margin:10px 0 0 0;
}
.kn_list li{
	color:#adcb07;
	font-size:20px;
	font-weight:bold;
}
.text03{
	margin:10px 0 0 0;
	background-color:#adcb07;
	width:320px;
	font-size:20px;
	color:#5c4d3f;
}
#Talk{
  margin:20px auto 0;
  text-align:center;
  width:320px;
  font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.step3{
  text-indent:-9999px;
  background:url(../images/step3.gif) no-repeat;
  background-size:320px 60px;
  width:320px;
  height:60px;
  margin:0 auto;
}
.hns_icon{
  text-indent:-9999px;
  float:left;
  background:url(../images/tu_hanasu.png) no-repeat;
  background-size:30px 46px;
  width:30px;
  height:46px;
  margin:10px 10px 0 20px;
}
.text04{
  float:left;
  font-size:20px;
  color:#5a4b44;
  margin:12px 0 0 0;
  line-height:25px;
}

.hns_list{
	margin:10px 0 0 0;
}
.hns_list li{
	color:#2d9fdf;
	font-size:20px;
	font-weight:bold;
}
.text05{
	color:#FF4548;
	font-size:15px;
	margin:5px 0 0 0;
}
.text06{
	margin:10px 0 0 0;
	background-color:#69c5f9;
	width:320px;
	font-size:20px;
	color:#5d4d3e;
}
