@charset "UTF-8";

/* 画面の横幅が700px以下　スマホ */
@media screen and (max-width:700px){

/* 全体 */
	#box {
			font-size: 10pt; 
			width: 100%;
			margin: auto;
			border-style: solid;
			border-width: 1px;
			border-color: black;
			background-image: url(./small/heart-pink.jpg);
	}

/* 上の部分＋地図 */
	#boxA {
			width: 100%;
			margin: auto;
			border-style: solid;	
			border-width: 1px;		
			border-color: black;	
			background-image: url(./small/heart-pink.jpg);
	}

/* 左のリンク部分 */
	#boxB {
			margin: auto;
/*			float: left; */
	}

/* 右のメイン部分 */
	#boxC {	/*メイン部分	*/
			width: 100%;	
			margin: auto;
			border-style: solid;	
			border-width: 1px;		
			border-color: black;	
/*			float: right;	*/
	}

/* 左の下の部分 */
	#boxD {
			margin: auto;
		/*	border-style: solid;	*/
		/*	border-width: 2px;		*/
		/*	border-color: black;	*/
/*			float: left;	*/
/*			clear: left;	*/
	}

/* 下の部分　連絡先など */
	#boxE{
			width: 100%;
			margin: auto;
		/*	border-style: solid;	*/
		/*	border-width: 2px;		*/
		/*	border-color: black;	*/
			clear: both;
	}

	

/* タイトル部分のBOX */
	#box1 {
				margin: auto;
				text-align: center;
				background-image: url(./small/heart-pink.jpg);
	}


	h1 { /*ページのタイトル*/
			font-size: 16pt; 
			color: #000088;
			margin-top: 10px;
			margin-bottom: 10px;
/*			background-image: url(small/b4-61-3.gif);	*/
			
/*			background-color: #ffffff; */
	}

	h2 { /*テーブルの地域のタイトル*/
			font-size: 16pt; 
			color: #000088;
			margin-top: 10px;
			margin-bottom: 10px;
	}
	
	h2.leftbox { /*左のbox内のタイトル */
			font-size: 10pt; 
			margin-top: 20px;
			margin-left: 40px;
			margin-bottom: 0px;
	
	}



	h3 { /*テーブル中のスポットのタイトル*/
			font-size: 12pt; 
	}

	ul { /*リスト*/
			margin-top: 10px;
	}


	li { /*リスト*/
			margin-bottom: 15px;
	}

/* リンク */
	a {
			color: blue;
	}



/* スポットの一覧表 */
	.TbLink {
			 width: 100%;
			margin-top: 20px; 
			
			
	}
			
/* 表のタイトル部 */
	th { text-align: center;
			font-size: 16pt;
	
	}

/* 表のスポット名 */
	.spot {
			 margin-top: 10px;
	}

/* 表の説明文 */		
	.setumei {
			font-size: 10pt;
			margin-top: 10px;
			margin-left: 10px;
	}

/* 表の住所部分 */	
	.juusyo {
			
			font-size: 8pt;
			margin-top: 10px;
			margin-left: 10px;
	}





	.photo_yoko {
					width: 90%;
					border-style: solid;
					border-width: 2px;
					border-color: black;
					margin-left: 3px;
	}


	.photo_tate {
					height: 30%;
					border-style: solid;
					border-width: 2px;
					border-color: black;
					margin-left: 1%;
	}

/* 連作先メールなど */
	address {
					margin-left: 50px;
					
	
	}

/***********************************************************/
/*    スライドショー関係 */



	#slideshow {
	   position: relative; 
	   width:  100%; /* ボックスの横幅　画面に合わせる */
	   height: 300px; /* ボックスの高さ 写真の高さより大きく*/
	   background-color: white; /* ボックスの背景色(必須) */
	   margin: auto;
	}
	
	#slideshow p {
	   position: absolute; 
	   top:  0; /* 写真の位置 */
	   left: 0;
	   color: #0000ff;
	   text-align: center;
	   z-index: 8;
	   opacity: 0.0;
	   margin: 0; 
	   background-color: white; /* ボックスの背景色(必須) */
	   height: 100%; /* div slideshowの高さに合わせる */
	   width: 100%; /* div slideshowの幅に合わせる */
	}
	
	#slideshow p.active {
	   z-index: 10; 
	   opacity: 1.0;
	}
	
	#slideshow p.last-active {
	   z-index: 9;
	}
	
	#slideshow p img {
		margin: auto; */autoで画像を真ん中に表示 */
	   width:  auto; /* 縦基準にするのでauto 画像の横幅 */
	   height: 260px; /* 画像の高さ */
	   display: block;
	   border: 0;
	   margin-bottom: 0px; /* 画像下部の余白 */
	}
	




























}