@charset "utf-8";
/* CSS Document */

body{
	width:100%;
	background:url(../images/p0026_m.jpg);
	color:#333333;

}
img{
	width:100%;
	height:auto;
}
p{
	line-height:150%;
}

.wrapper{
	max-width:960px;
	margin:0 auto;
	
}



#title{
	background:#ffed6a;
	padding:10px;

}
#title ul{
	width:90%;
	margin:0 auto;
}

#title .text01{
	display:none;
}


#title .text01-02{
	max-width:425px;
	height:auto;
	margin:5px auto;
}
#title .text02{
	max-width:425px;
	height:auto;
	margin:0 auto;

}
#app_notice{
	background:#ffed6a;
	padding:10px 10px 30px 10px;

}
#app_notice .text03{
	width:90%;
	margin:0 auto;
}

#app_notice .nurie_thumb{
	max-width:500px;
	height:auto;
	margin:10px auto;
}

#store_btn li{
	width:50%;
	float:left;
	margin-top:30px;
}
#google_btn{
	max-width:250px;
	margin:0 auto;
	padding:0 5px;
	
	
}
	
#apple_btn{
	max-width:250px;
	margin:0 auto;
	padding:0 5px;

}

#howto{
	padding:30px 10px 10px 10px;
	background:#FFFFFF;
}

#howto h2{
	max-width:400px;
	height:auto;
}

#tutorial dl{
	margin:10px auto;
}

#tutorial dt{
		width:30%;
		float:left;
}

#tutorial dd{
		width:65%;
		float:left;
		margin-left:10px;
}

#tutorial li{
	margin-bottom:10px;
}

#tutorial li img{
	width:100%;
	height:auto;
	max-width:238px;

}

#capture li{
	float:left;
	width:33.3%;
}

#capture .capture_img{
	padding:10px 5px 30px 5px;
}


#summary{
	background:#fff39d;
	padding-bottom:5px;
	
}

#summary dl{
	padding:30px 10px 10px 10px;
	width:90%;
	margin:0 auto;
}

#summary dt{
		width:80px;
		float:left;
}

.summary_box{
	width:90%;
	margin:0px auto;
	padding:10px 0;
}

#summary dd{
		width:70%;
		float:left;
		margin-left:20px;
}

/* added 20171128 */
#summary p{
	font-weight: normal; 
	padding-top:5px;
	size:12px
}

/* added 20171128 */
#summary th{
	width: 35%;/* edit 20171128 */
	font-weight: normal; 
	padding-top:5px;
	vertical-align:top;
	text-align:right;
}

/* added 20171128 */
#summary table{
	width:100%;
}

#summary td{
	padding-top:5px;
}

#summary ul{
	margin:5px;
}



#summary .btn{
	margin:5px;
}
#summary .icon{
	width:20%;
	min-width:100px;
	height:auto;
	margin:10px auto;
}
#summary .summary_box ul{
	/* width:40%; 20171122 comment out*/
	margin:0 auto;
}

#summary .summary_btn li{
	width:50%;
	float:left;
}
#summary .summary_text{
	width:100%;
	margin:0 auto;
}

footer{
	text-align:center;
	padding:10px 0;
	background:#FFFFFF;
}

/* added 20180531 */
#promo_banner {
	text-align: center;
}

#promo_banner ul{
	width:100%;
}
/* added 20180531 */
#promo_banner li{
	width: 95%;
	display: inline-block;
	margin:5px 0;
}

@media screen and (min-width:600px){
	#title ul{
		width:90%;
		max-width:710px;
		margin:5px auto;
	}

	#title .text01{
		display:inline-block;
		width:40%;
		float:left;
		margin:5px 0 0 0;
	}

	#title .text01 img{
		float:right;
		padding-right:10px;

	}
	#title .text01-02{
		display:none;
	}

	#title .text02{
		width:60%;
		float:left;
		margin-top:5px;
	}

	#app_notice li{
		width:50%;
		float:left;
	}
	#app_notice .text01{
		text-align:right;
	}

	#app_notice .text02{
		text-align:left;

	}
	#app_notice .text03{
		margin-top:10px;

	}

	#tutorial dl{
		width:83%;
		margin:10px auto;
	}
	#tutorial dt{
			width:20%;
			float:left;
	}

	#tutorial dd{
			margin-left:20px;
	}

	#tutorial p{
		margin-bottom:5px;
	}
		
	#tutorial li img{
		max-height:24px;
		width:auto;
	}

	#capture ul{
		width:90%;
		margin:0 auto;
	}

	#capture li{
		width:25%;
		margin: 0 4%;
	}

	#summary .summary_btn li{
		width:25%;
		float:left;
	}

	#summary .icon{
		float:left;
		width:20%;
		min-width:80px;
		max-width: 150px;
		height:auto;
		margin-left: 11%;
	}

	#summary .summary_text{
		width:66%;/* edited 20180531 */
		float:left;
		vertical-align: middle;
		margin:10px 0 0 10px;
	}

	/* added 20180531 */
	#summary th{
		font-weight: normal; 
		padding-top:5px;
		vertical-align:top;
		text-align:right;
	}

	/* added 20180531 */
	#promo_banner li{
		width:32%;
		margin:10px 0;
	}

}



/*-- clearfix --*/
.clearfix:after {  
  content: ".";   
  display: block;   
  height: 0;   
  clear: both;   
  visibility: hidden; 
}  
  
.clearfix { display: inline-table; }  
  
/* Hides from IE-mac \*/  
* html .clearfix { height: 1%; }  
.clearfix { display: block; }  
/* End hide from IE-mac */  

.movie{
  width:80%;
  margin:0 auto;
 }

.youtube{
  position:relative;
  padding-top:56.25%;
}
.youtube iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}