﻿/*********************************************/	

@charset "utf-8";

/*********************************************/	



/* 全 体
----------------------------------------------- */

html{
	font-size: 62.5%;
	margin: 0;
	padding: 0;
	overflow-y: scroll;
}


body {
	margin: 0;
	padding: 0;
	color: #000;
	font-size: 14px; 
	 -webkit-text-size-adjust: 100%;
	font-family:'Lucida Grande','Hiragino Kaku Gothic ProN',Meiryo, sans-serif;
	line-height: 140%;
}


a{
	color: #49A235;
	text-decoration:underline;
}

	a:link{
		color: #49A235;
		text-decoration:underline;
	}

	a:visited{
		color: #49A235;
		text-decoration:none;
	}

	a:hover{
		color: #999;
		text-decoration:none;
	}

img{
	border: none;
	line-height:0;
	vertical-align:bottom;
}

.map_border{
	border:none;
	outline:none;
}


/*********************************************/	



/* = Selected Text
----------------------------------------------- */
::selection {
	color:#FFF;
	background:#49A235; /* Safari */
}

::-moz-selection {
	color:#FFF;
	background:#49A235; /* Firefox */
}

/*********************************************/	



/* = 全体
----------------------------------------------- */

#all_frame{
	width: 100%;
	margin:0 auto;
	padding:0
	background-color:#FFFFFF;
	position: relative;
	border-top: 5px solid #49A235;
}

/*********************************************/	



/* = ヘッダー
----------------------------------------------- */

header{
	margin: 0 auto 80px auto;
	padding: 20px 0 0 0;
	text-align: center;
}

/*********************************************/	



/* = コンテンツ
----------------------------------------------- */

#content{
	margin: 0 auto 0 auto;
	padding: 0 0 80px 0;
}

	#main{
		margin: 0 auto 80px auto;
		width: 100%;
	}
	
		#smart_phone{
			margin: 0 auto 80px auto;
			width: 240px;
			text-align: center;
		}

		#main_text{
			margin: 0 auto;
			width: 960px;
			text-align: center;
		}
		

		.bt{
			display: block;
			width: 360px;
			height: 60px;
			margin: 0 auto 60px auto;
		}

		.bt:hover{
			filter:alpha(opacity=70);
			-moz-opacity: 0.7;
			opacity: 0.7;
		}


	#text{
		width: 960px;
		margin: 0 auto 140px auto;
		text-align: center;
	}
		
		#title{
			margin: 0 auto 30px auto;
			font-size: 36px;
			font-weight: bold;
			letter-spacing: 10px;
			line-height: 140%;
			color: #49A235;
		}

		#detail{
			margin: 0 auto 60px auto;
			font-size: 18px;
			text-align: left;
			letter-spacing: 3px;
			line-height: 220%;
			text-align: justify;
			text-justify: inter-ideograph;
		}

		.bt_shop{
			display: block;
			width: 640px;
			height: 60px;
			margin: 0 auto 100px auto;
		}

		.bt_shop:hover{
			filter:alpha(opacity=70);
			-moz-opacity: 0.7;
			opacity: 0.7;
		}
		
		
		#feature_{
			margin: 0 auto;
		}
		
			#feature_title{
				position: relative;
				margin: 0 auto 20px auto;
				font-size: 48px;
				font-weight: bold;
				text-align: center;
				text-indent: 10px;
				letter-spacing: 10px;
				line-height: 140%;
				color: #49A235;
			}

				#feature_title span {
					position: relative;
					z-index: 2;
					display: inline-block;
					margin: 0 2.5em;
					padding: 0 1em;
					background-color: #fff;
					text-align: left;
				}
				
				#feature_title::before {
					position: absolute;
					top: 45%;
					z-index: 1;
					content: '';
					display: block;
					width: 100%;
					height: 2px;
					background-color: #DDD;
				}
			
			#feature_list{
				width: 850px;
				margin: 0 auto 30px auto;
				padding: 0;
			//	padding: 40px 40px 20px 40px;
			//	color: #333;
				color: #49A235;
			//	background-color: #49A235;
			//	border: 3px double #49A235;
				border-radius:15px;
				-webkit-border-radius:15px;
				-moz-border-radius:15px;
			}

				#feature_list li{
					margin: 0 auto 20px auto;
					font-size: 22px;
					font-weight: bold;
					text-align: left;
					letter-spacing: 5px;
					line-height: 140%;
				}

					#feature_list li span{
						position: relative;
						display: inline-block;
						margin: 0 20px 0 10px;
						padding: 3px 10px 0 10px;
						width: auto;
						min-width: 95px;
						height: 30px;
						font-size: 16px;
						line-height: 30px;
						text-align: center;
						text-indent: 5px;
					//	color: #49A235;
						color: #FFF;
					//	background-color: #FFF;
						background-color: #49A235;
						z-index: 0;
						border-radius:10px;
						-webkit-border-radius:10px;
						-moz-border-radius:10px;
					}

					#feature_list li span:after {
						content: "";
						position: absolute;
						top: 50%;
						right: -8px;
						margin-top: -10px;
						display: block;
						width: 0px;
						height: 0px;
						border-style: solid;
						border-width: 10px 0 10px 13px;
					//	border-color: transparent transparent transparent #FFF;
						border-color: transparent transparent transparent #49A235;
					}
	
	#display{
		position: relative;
		margin: 0 auto 100px auto;
		width: 960px;
		height: 1343px;
		background-image: url(../img/detail.png);
		background-position: center top;
		background-repeat: no-repeat;
	}
	
		.box{
			position: absolute;
			width: 248px;
			height: 140px;
			padding: 15px;
			color: #222;
			letter-spacing: 2px;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			-o-box-sizing: border-box;
			-ms-box-sizing: border-box;
			box-sizing: border-box;
		//	border: 1px solid #F00;
		}

		.box.qr{
			background-image: url(../img/qr.gif);
			background-position: 170px 68px;
			background-repeat: no-repeat;
			background-size: 68px auto;
		}

		#kome1{
			position: absolute;
			top: 278px;
			left: 15px;
			width: 360px;
			font-size: 15px;
			font-weight: bold;
			line-height: 150%;
			color: #F00;
			letter-spacing: 2px;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			-o-box-sizing: border-box;
			-ms-box-sizing: border-box;
			box-sizing: border-box;
		}

		#kome2{
			position: absolute;
			top: 210px;
			right: 220px;
			width: 160px;
			font-size: 14px;
			line-height: 160%;
			letter-spacing: 2px;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			-o-box-sizing: border-box;
			-ms-box-sizing: border-box;
			box-sizing: border-box;
		}

		#url{
			position: absolute;
			top: 311px;
			right: 32px;
			width: 330px;
			font-size: 15px;
			font-weight: bold;
			line-height: 150%;
			letter-spacing: 1px;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			-o-box-sizing: border-box;
			-ms-box-sizing: border-box;
			box-sizing: border-box;
		}

		#display1{
			top: 10px;
			right: 60px;
			font-size: 16px;
			font-weight: bold;
			line-height: 150%;
		}

		#display2{
			top: 348px;
			left: 47px;
			font-size: 17px;
			font-weight: bold;
			line-height: 150%;
		}

		#display3{
			top: 348px;
			right: 52px;
			font-size: 17px;
			font-weight: bold;
			line-height: 140%;
		}

		#display4{
			top: 1186px;
			left: 258px;
			padding-right: 10px;
			font-size: 16px;
			font-weight: bold;
			line-height: 145%;
		}

		#display5{
			top: 1198px;
			right: 43px;
			font-size: 17px;
			font-weight: bold;
			line-height: 140%;
		}
		
/*********************************************/	



/* = ページトップ
----------------------------------------------- */

.go_top{
	position: fixed;
	right: 0;
	bottom: 0;
	padding:0 20px 20px 0;
	margin:0;
}
	.go_top a{
		display: block;
		width: 60px;
		height: 60px;
		color: #F00;
		text-indent: -9999px;
		background-image: url(../img/page_top.png);
		background-size: 60px auto;
		background-position: center center;
		background-repeat: no-repeat;
	}

	.go_top a:hover{
		background-image: url(../img/page_top_on.png);
	}

/*********************************************/	



/* = フッター
----------------------------------------------- */

footer{
	margin: 0 auto 0 auto;
	padding: 20px 0 18px 0;
	font-size: 14px;
	text-align: center;
	letter-spacing: 3px;
	line-height: 100%;
	color: #FFF;
	background-color: #49A235;
	background-image: url(../img/bg_footer.png);
	background-position: center top;
	background-repeat: repeat-x;
}

/*********************************************/	


