
@charset "UTF-8";

/* 画面の横幅が1000px以上　ＰＣ */
@media all {

	#box {
			width: 1024px;
			margin: auto;
			border-style: solid;
			border-width: 1px;
			border-color: black;
			background-image: url(./small/heart-pink.jpg);
	}


	#boxA {
			width: 1018px;
			margin: auto;
			border-style: solid;	
			border-width: 1px;		
			border-color: black;	
			background-image: url(./small/heart-pink.jpg);
	}

	#boxB {
			width: 250px;
			margin: auto;
			float: left;
	}

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

	#boxD {
			width: 250px;
			margin: auto;
		/*	border-style: solid;	*/
		/*	border-width: 2px;		*/
		/*	border-color: black;	*/
			float: left;
			clear: left;
	}

	#boxE{
			margin: auto;
		/*	border-style: solid;	*/
		/*	border-width: 2px;		*/
		/*	border-color: black;	*/
			clear: both;
	}



	#container1 { width: 1016px;
				margin: auto;
				background-image: url(small/heart-pink.jpg); 
	/*			background-image: url(small/toumei.gif);	*/
				font-size: 14pt; 
	}

	#container2 { width: 760px;
				text-align: center; 
				margin: auto;
				background-image: url(small/heart-pink.jpg); 
	}
	
	#container3 { width: 760px;
				margin: auto;
				background-image: url(small/heart-pink.jpg); 
	}


	#container4 { width: 760px;
				margin: auto;
				margin-top: 20px;
				background-image: url(small/heart-pink.jpg);
				font-size: 14pt 
	}

	span.midle {
		font-size: 16pt;
	
	}

	p.midle {
		font-size: 16pt;
	
	}




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

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



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

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


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

	#box1 { width: 1014px;
	
				margin: auto;
				text-align: center;
/*				border-style: solid;	*/
/*				border-width: 2px;		*/
/*				border-color: black;	*/
				background-image: url(./small/heart-pink.jpg);
		/*		background-image: url(small/toumei.gif); */
	}


	#hajimeni1 {
			width: 1010px;
				margin-top: 5px; 
				margin-left: 50px; 
				margin-bottom: 5px; 
	}
	
	#hajimeni2 {		width: 1010px;
				margin-top: 10px; 
				margin-left: 50px; 
				margin-bottom: 10px; 
	}


	#link_tihou {
					margin-left: 5px;
	}




	#point_map { margin-top: 20px;
					margin-left: 130px; 
	}

	#japaneseMap { 
					margin-top: 20px;
					width: 500px;
					height: 540px;
					border-style: solid;
					border-width: 3px;
					border-color: black;
					background-color: #eef0ff; 
	}





	.TbLink {
			 width: 750px;
			margin-top: 20pt; 
			
			
	}
			

	th { text-align: center;
			font-size: 20pt;
	
	}

	.spot {
			 margin-top: 10px;
			 margin-left: 5pt;
	}

		
	.setumei {
			font-size: 12pt;
			margin-top: 10px;
			margin-left: 10px;
	}
	
	.juusyo {
			
			width: 120px;
			font-size: 12pt;
			margin-top: 10px;
			margin-left: 10px;
	}





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


	.photo_tate {
					height: 200px;
					border-style: solid;
					border-width: 2px;
					border-color: black;
					margin-left: 35px;
	}


	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; /* 画像下部の余白 */
	}
	










			
}
