@charset "UTF-8";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;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}html,body{overflow-x:hidden}html{font-size:18px}body{width:100%;font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif}

/*画面幅1200px以下の設定*/
@media screen and (max-width:1200px){
	#container{
		margin: 2%;
	}
}

/*画面幅８００px以下の設定*/
@media screen and (max-width:800px){
	header{
		margin-bottom: 20px;
	}
	header #logo{
	width: 80%; /*画面幅*/
	margin: 20px auto 10px;	
	}
}

header #store_logo{
	max-width: 100%;
	margin: 5px auto;
}

@media screen and (min-width:0px){
	.logo1 {
		max-width: 280px;
		margin: 0 auto;
	}
	.logo2 {
		display: inline-block;
		text-align: center;
		font-size: 30px;
		line-height: 0;
	}
	
	#notice{
		text-align: center;
		padding: 15px 0;
		color: red;
		background: white;
	}
}
@media screen and (min-width:600px){
	.logo1 {
		max-width: 50%;
		margin: 0 auto;
	}
	.logo2 {
		display: inline-block;
		width: 300px;
		text-align: left;
		font-size: 35px;
		vertical-align: middle;
		line-height: 0;
	}
	
	#notice{
		width: 50%;
		margin: auto;
		text-align: center;
		padding: 15px;
		color: red;
		background: white;
	}
}
@media screen and (min-width:800px){
	.logo1 {
		max-width: 50%;
		margin: 0 auto;
	}
	.logo2 {
		display: inline-block;
		width: 400px;
		text-align: left;
		font-size: 40px;
		vertical-align: middle;
		line-height: 0;
	}
	
	#notice{
		width: 50%;
		margin: auto;
		text-align: center;
		padding: 15px;
		color: red;
		background: white;
	}
}
.logoContainer {
	text-align: center;
}

.logo1 img {
	display:inline-block;
	width: 30%!important;
	vertical-align: middle;
}
.logo1 .logo_text {
	display:inline-block;
	width: 65%;
	vertical-align: middle;
	font-weight: bold;
}

#wrap{
	width:100%;min-width:240px}.animate-box{position:relative;height:auto;margin:0 auto}.animate-elem{position:absolute;width:100%}.inner-section{max-width:960px;margin:0 auto;padding-top:30px}.inner-section2{padding-top:60px}.detail-image{width:100%}.detail-sentence{margin:0 auto}.detail-sentence h2{margin-top:20px;padding:20px 30px;font-size:1.2em}.detail-sentence p{padding:30px 30px 80px 30px;font-size:0.8em;line-height:1.6em;background:rgba(255,255,255,0.5)
}

#summary-section{
	background:#a9c95e;background:-moz-linear-gradient(top, #ffdbde 0%, #ffdbde 77%, #ffdbde 77%, #fff 100%);background:-webkit-linear-gradient(top, #ffdbde 0%, #ffdbde 77%, #ffdbde 77%, #fff 100%);/*background:url("../images/pattern.png"),linear-gradient(to bottom, #ffdbde 0%, #ffdbde 77%, #ffdbde 77%, #fff 100%);*/background-size:20% auto, 100% 100%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdbde', endColorstr='#ffffff',GradientType=0 )
}

#summary-section .inner-section h1 img{
	width:100%;height:auto
}



#top-illust{
	padding-top: 15px;
	max-width:280px
}

#summary-outer{
	box-sizing:border-box;margin:40px 0;padding:30px;background:rgba(255,255,255,0.5)
}

#summary-section #summary-outer .notice2{
	text-align: center;
	color: red;
}

#summary-sentence{
	padding:30px 0;margin:0 auto;font-size:0.9em;line-height:1.6em
}

#dl-links{
	display:flex;justify-content:space-around;align-items:center;box-sizing:border-box;max-width:520px;margin:0 auto
}

#dl-links li{
	width:49%;height:auto
	}
#dl-links li a img{
	width:100%;height:auto
	}
	
#dl-links li a object{
	width:100%;height:auto
	}
	
#dl-links #app-store{width:47%}
#note{font-size:0.8em}
#note p{text-align:center}

.install{
	text-align: center;
}
.install p{
	margin-bottom: 10px;
}
.install_img_button{
	width: 40%;
	max-width: 200px;
}

.stamp{
	text-align: center;
	background: rgba(255,255,255,0.5);
}
.stamp p{
	margin-bottom: 10px;
	padding: 0;
	background: none;
}
.stamp_img_button {
	width: 40%;
	max-width: 200px;
	margin-bottom: 10px;
}


#specialsite-section{background:#eddc44;background:-moz-linear-gradient(top, #eddc44 0%, #fff 100%);background:-webkit-linear-gradient(top, #eddc44 0%, #fff 100%);/*background:url("../img/pattern.png"),linear-gradient(to bottom, #eddc44 0%, #fff 100%);*/background-size:20% auto, 100% 100%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eddc44', endColorstr='#ffffff',GradientType=0 )}

#specialsite-section h2{background:rgba(253,197,40,0.3)}

#pedometer-section{background:#eddc44;background:-moz-linear-gradient(top, #eddc44 0%, #fff 100%);background:-webkit-linear-gradient(top, #eddc44 0%, #fff 100%);/*background:url("../img/pattern-cb.png"),linear-gradient(to bottom, #eddc44 0%, #fff 100%);*/background-size:20% auto, 100% 100%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eddc44', endColorstr='#ffffff',GradientType=0 )}

#pedometer-section h2{background:rgba(253,197,40,0.3)}

#ranking-section{background:#b0d8f5;background:-moz-linear-gradient(top, #b0d8f5 0%, #fff 100%);background:-webkit-linear-gradient(top, #b0d8f5 0%, #fff 100%);/*background:url("../img/pattern-pd.png"),linear-gradient(to bottom, #b0d8f5 0%, #fff 100%);*/background-size:20% auto, 100% 100%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b0d8f5', endColorstr='#ffffff',GradientType=0 )}

#ranking-section h2{background:rgba(63,111,232,0.3)}

#map-section{background:#5eb961;background:-moz-linear-gradient(top, #5eb961 0%, #fff 100%);background:-webkit-linear-gradient(top, #5eb961 0%, #fff 100%);/*background:url("../img/pattern-sz.png"),linear-gradient(to bottom, #5eb961 0%, #fff 100%);*/background-size:20% auto, 100% 100%;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5eb961', endColorstr='#ffffff',GradientType=0 )}

#map-section h2{background:rgba(81,189,62,0.62)}

#pedometer-image{max-width:240px}

#ranking-image{max-width:240px}

#specialsite-image{
	max-width: 350px;
}

#map-image{width:96%;max-width:360px}

#foot-section{width:100%;padding:40px 0;line-height:1.2em;color:#fff;background:#457b6a}
#foot-section a:visited{color: #fff;}
#foot-section div{width:70%;max-width:672px;margin:20px auto}

#foot-section #inquiry h3{font-size:0.9em}

#foot-section #inquiry address{font-size:0.8em}

#foot-section #copyright p{font-size:0.8em}@media screen and (min-width: 768px){html{font-size:20px}}

