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

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

		共通

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

html,body {
	margin:0px;
	padding:0px;
	}
	
.cf:after {
	display: block;
	content: "";
	clear: both;
	}

body {
	background: #FCF5EB;
	background-image: url(../images/bg.png);
	background-repeat: no-repeat;
	margin: 0;
	padding: 0;
	margin: 0 auto;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	
h1 {
	margin: 0;
	}
		
p {
	font-size: 18px;
	line-height: 30px;
	}
	
/* 画像リンクfade */
.fade {  
    -webkit-transition: 0.3s ease-in-out;  
       -moz-transition: 0.3s ease-in-out;  
         -o-transition: 0.3s ease-in-out;  
            transition: 0.3s ease-in-out;  
}

.fade:hover {  
    opacity: 0.4;  
    filter: alpha(opacity=60);  
}   
/* 画像リンクfade */
.fade {  
    -webkit-transition: 0.3s ease-in-out;  
       -moz-transition: 0.3s ease-in-out;  
         -o-transition: 0.3s ease-in-out;  
            transition: 0.3s ease-in-out;  
}

.fade:hover {  
    opacity: 0.4;  
    filter: alpha(opacity=60);  
}   

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

		ヘッダー

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

header {
	width: 100%;
	margin: 0;
	background-image: url(../images/header_bg.png);
	background-repeat: repeat-x;
	margin-top: 5px;
	}
	
#header_inner {
	width: 1160px;
	margin: 0 auto;
	padding-top: 10px;
	}
	
img#img1 {
	float: left;
	width: 250px;
	margin-top: 30px;
	margin-right: 50px;
	}
	
#header_img2 {
	width: 522px;
	margin: 0 auto;
	padding-left:40px;
	}
	
/********************************

		ナビ

*********************************/	
	
nav {
	width: 100%;
	background: #424242;
	}
	
#nav_inner {
	width: 1160px;
	height: 40px;
	margin: 0 auto;
	}
	
nav ul {
	margin: 0 auto;
	padding: 0;
	}
		
nav ul li {
	height: 40px;
	float: left;
	font-weight: bold;
	font-size: 18px;
	padding-right: 42px;
	padding-left: 3px;
	}
	
nav ul li:last-child {
	padding-right: 0;
	}
	
nav ul li a {
	display: block;
	text-decoration: none;
	color: #fff;
	padding-top: 13px;
	}
	
nav ul li span, footer ul li span {
	color: #D9F9F5;
	}

nav ul li img {
	margin-right: 10px;
	}
	
	
/********************************

		トップページ		

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


article#wrapper {
	width: 1200px;
	margin: 0 auto;
	}
	
/*地図*/
#map {
	width: 1160px;
	height: 800px;
	margin: 0 auto;
	}

#click {
	text-align: center;
	color: #059B9B;
	font-weight: bold;
	}	

section#banner {
	height: 120px;
	background-image: url(../images/banner1.png),url(../images/banner_bg.png);
	background-repeat: no-repeat;	
	border-top: 1px solid #22b6bf;
	border-bottom: 3px solid #22b6bf;
	background-color: #fff;
	margin-top: 30px;
	margin-bottom: 30px;
	}

#banner_inner1 {
	width: 500px;
	float: left;
	margin-left: 20px;
	}
	
#banner_inner1 p {
	font-size: 22px;
	font-weight: bold;
	color: #666;
	}
	
#banner_inner1 p span {
	font-size: 16px;
	font-weight: normal;
	}

	
#banner_inner2 {
	width: 350px;
	float: left;
	line-height: 20px;
	margin-top: 50px;
	margin-left: 60px;
	}
	
#banner_inner2 p {
	font-size: 14px;
	line-height: 8px;
	text-align: right;
	color: #22b6bf;
	}

#banner_inner2 p a{
	text-decoration:none;
	color: #22b6bf;
}

#banner_inner3 {
	float: right;
	margin-top: -25px;
	margin-right: 20px;
	}
	
section#main {
	height: 300px;
	margin-bottom: 30px;
	}

#category {
	float: right;
	background-color: #fff;
	}
	
#category table {
	width: 456px;
	height: 270px;
	border: 1px solid #ccc;
	}
	
#category tr {
	border-bottom: 1px solid #ccc;
	}
	
#categoryt h:last-child {　
	border-bottom: none;
	}
	

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

	緑・カルチャー #22b573

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

.contents1 {
	width: 218px;
	float: left;
	background: #22b573;
	margin-right: 27px;
	margin-bottom: 25px;
	}
		
.contents1 a {
	text-decoration: none;
	
}

.contents1_inner {
	width: 218px;
	height: 60px;
	border-bottom: 1px solid #fff;
	}
	
.contents1_inner p {
	color: #fff;
	}
	
.contents1_inner p span {
	font-weight: bold;
	}
	
.site-logo1 {
	width: 40px;
	height: 40px;
	background-color: #fff;
	float: left;
	margin-right: 5px;
	margin-left: 5px;
	margin-top: 8px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	}

.site-info1 {
	padding-top: -30px; /* 真ん中にまで文字を下ろす */
	}

.site-logo1 p {
	text-align: center; /* 中央寄せ */
	color: #22b573; /* 緑 */
	margin: 0; /* h1とpの余白をリセット */
	}

.site-logo1 p {
	font-size: 20px; 
	font-weight: bold;
	line-height: 45px;
	}
	
.contents_p1 {
	width: 160px;
	float: right;
	height: 20px;
	margin-top: -10px;
	}
	
.contents_p1 p {
	line-height: 23px;
	}
	
.contents_p2 {
	text-align: right;
	color: #fff;
	padding-right: 3px;
	}
	
.contents_p2 p {
	font-size: 14px;
	line-height: 5px;
	}
	
/*******************************

	エメラルド・スクール #22b6bf

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

.contents2 {
	width: 218px;
	float: left;
	background: #22b6bf;
	margin-right: 27px;
	margin-bottom: 25px;
	}
	
.contents2:last-child {
	margin-right: 0;
	}
	
.contents2 a {
	text-decoration: none;
	
}

.contents2_inner {
	width: 218px;
	height: 60px;
	border-bottom: 1px solid #fff;
	}
	
.contents2_inner p {
	color: #fff;
	}
	
.contents2_inner p span {
	font-weight: bold;
	}
	
.site-logo2 {
	width: 40px;
	height: 40px;
	background-color: #fff;
	float: left;
	margin-right: 5px;
	margin-left: 5px;
	margin-top: 8px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	}

.site-info2 {
	padding-top: -10px; /* 真ん中にまで文字を下ろす */
	}

.site-logo2 p {
	text-align: center; /* 中央寄せ */
	color: #22b6bf; /* 緑 */
	margin: 0; /* h1とpの余白をリセット */
	}

.site-logo2 p {
	font-size: 20px; 
	font-weight: bold;
	line-height: 45px;
	}
	
.contents_p1 {
	width: 160px;
	float: right;
	height: 20px;
	margin-top: -10px;
	}
	
.contents_p1 p {
	line-height: 23px;
	}
	
.contents_p2 {
	text-align: right;
	color: #fff;
	padding-right: 3px;
	}
	
.contents_p2 p {
	font-size: 14px;
	line-height: 5px;
	}

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

	青・スポーツ #0071bc

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

.contents3 {
	width: 218px;
	float: left;
	background: #0071bc;
	margin-right: 27px;
	margin-bottom: 25px;
	}
	
.contents3:last-child {
	margin-right: 0;
	}
	
.contents3 a {
	text-decoration: none;
	
}

.contents3_inner {
	width: 218px;
	height: 60px;
	border-bottom: 1px solid #fff;
	}
	
.contents3_inner p {
	color: #fff;
	}
	
.contents3_inner p span {
	font-weight: bold;
	}
	
.site-logo3 {
	width: 40px;
	height: 40px;
	background-color: #fff;
	float: left;
	margin-right: 5px;
	margin-left: 5px;
	margin-top: 8px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	}

.site-info3 {
	padding-top: -10px; /* 真ん中にまで文字を下ろす */
	}

.site-logo3 p {
	text-align: center; /* 中央寄せ */
	color: #0071bc; /* 緑 */
	margin: 0; /* h1とpの余白をリセット */
	}

.site-logo3 p {
	font-size: 20px; 
	font-weight: bold;
	line-height: 45px;
	}
	
.contents_p1 {
	width: 160px;
	float: right;
	height: 20px;
	margin-top: -10px;
	}
	
.contents_p1 p {
	line-height: 23px;
	}
	
.contents_p2 {
	text-align: right;
	color: #fff;
	padding-right: 3px;
	}
	
.contents_p2 p {
	font-size: 14px;
	line-height: 5px;
	}
		
		
/********************************

		トップページ

*********************************/	
	
/*地図*/
#map_canvas {
	width: 1160px;
	height: 800px;
	margin: 0 auto;
	margin-bottom: 20px;
	}
	
/***************************

		各店舗メイン
	
***************************/

article#wrapper1 {
	width: 1200px;
	margin: 0 auto;
	margin-top: -20px;
	background: #fff;
	border-left: 5px solid #22B6BF;
	}
	
article#wrapper2 {
	width: 1200px;
	margin: 0 auto;
	margin-top: -20px;
	background: #fff;
	border-left: 5px solid #0DAC67;
	}
	
article#wrapper3 {
	width: 1200px;
	margin: 0 auto;
	margin-top: -20px;
	background: #fff;
	border-left: 5px solid #3097D4;
	}

.text {
	width: 960px;
	margin: 0 auto;
	}
	
section.info {
	margin-bottom: 30px;
	width: 1160px;
	margin: 0 auto;
	padding-bottom: 30px;
	}
	
#catch p {
	font-size: 20px;
	font-weight: bold;
	color: #333;
	}
		
section.info img {
	float: left;
	margin-right: 46px;
	}
	
section.info img:last-child {	
	margin-right: 0;
	}
	
#info_img {
	padding-top: 5px;
	}
	
#info_p {
	padding-top: 20px;
	}
	
				
/********************************

		地図

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

#map_shop {
	width: 1160px;
	height:600px;
	margin: 0 auto;
	margin-botto40px;
	}
	
#map_shop p {
	text-align: right;
	}
	
	
/********************************

		フッター

*********************************/	
	
footer {
	height: 160px;
	background: #424242;
	}	
	
footer#nav_inner {
	width: 1200px;
	height: 40px;
	margin: 0 auto;
	}
	
footer ul {
	width: 1200px;
	margin: 0 auto;
	padding: 0;
	padding-top: 20px;
	display: table;
	}
		
footer ul li {
	height: 40px;
	font-weight: bold;
	font-size: 18px;
	vertical-align: middle;
	display: table-cell;
	padding-right: 20px;
	padding-left: 3px;
	}

footer ul li:nth-child(4){
	padding-right: 0;
}

footer ul li:last-child {
	padding-right: 0;
	}
	
footer ul li a {
	display: block;
	text-decoration: none;
	color: #fff;
	}	


footer ul li img {
	margin-right: 10px;
	}
	
#footer_inner {
	width: 1200px;
	margin: 0 auto;
	margin-top: 95px;
	text-align: center;
	}
	
small {
	color: #fff;
	font-size: 18px;
	}	
	
/********************************

		スマホ

*********************************/	
	
	
@media screen and (max-width: 480px) {
	
article#wrapper1 {
	width: 95%;
	margin: 0 auto;
	margin-top: -20px;
	}
	
article#wrapper2 {
	width: 95%;
	margin: 0 auto;
	margin-top: -20px;
	}
	
article#wrapper3 {
	width: 95%;
	margin: 0 auto;
	margin-top: -20px;
	}



/*ヘッダー*/	
#header_inner {
	width: 95%;
	}
	
#header_img1 {
	width: 95%;
	height: 30px;
	margin: 0 auto;
	padding: 0;
	}
	
#header_img1 img {
	margin: 0 auto;
	padding: 0;
	}

	
img#img1 {
	float: none;
	width: 30%;
	}
	
#header_img2 {
	width: 100%;
	margin: 0 auto;
	margin-top: -10px;
	padding: 0;
	}
	
#header_img2 img {
	width: 100%;
	}

/*ナビ*/	
nav {
	width: 100%;
	}
	
#nav_inner {
	width: 100%;
	height: 100%;
	background: #333;
	}
		
#nav_inner li {
	float: none;
	text-align: center;
	padding: 0;
	border-bottom: 1px #CCCCCC solid;
	}
	
#nav_inner li img {
	display: none;	
	}

/*トップページ・マップ*/	
#map_canvas {
	width: 400px;
	height: 300px;
	}
		
/*店舗名*/	
h2 {
	font-size: 24px;
	}
	
/*キャッチコピー*/	
#catch {
	width: 95%;
	}
	
#catch p {
	width: 95%;
	}

/*店舗画像*/	
#info_img img {
	width: 100%;
	margin-bottom: 10px;
	}
	
/*店舗マップ*/
#map_shop {
	width: 100%;
	height: 100%;
	}	

/*フッター*/
footer {
	height: 100%;
	}
	
footer#nav_inner {
	display: none;	
	}
	
footer ul {
	display: none;	
	}
	
#footer_inner {
	width: 100%;
	margin: 0;
	padding-top: 10px;
	padding-bottom: 5px;	
	}

	}