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

	* {
		margin: 0;
		padding: 0;
		}
		
		
	  
	#container {
	  width: 1024px;
	  height: 650px;
	  margin: 0 auto;
	   }

	#navi {
		position: relative;
		top: -290px;
		width: 263px;
		height: 195px;
		background-color: #89B3E9;
		text-align: right;
		}

	#navi-index {
		position: relative;
		top: -290px;
		width: 263px;
		height: 195px;
		background-color: #89B3E9;
		text-align: right;
		margin-bottom: -180px;
		}

	@media only screen 
	and (min-device-width : 320px) 
	and (max-device-width : 480px) {
	#navi-index {
			display: block !important;
			}
	}

	#text {
		position: relative;
		top: -290px;
		left: 263px;
		width: 540px;
		height: 200px;
		background-color: #89B3E9;
		padding: 5px;
		}

	#scroll {
		overflow:scroll;
		width: 540px;
		height: 220px;
		margin-bottom: 10px;
		}

	#text a{
		color: #fff;
		}

	#text-index {
		position: relative;
		top: -110px;
		left: 263px;
		width: 550px;
		height: 190px;
		background-image:url(img/home-text.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		background-color: #89B3E9;
		}
	
	#scroll::-webkit-scrollbar {
		width: 8px;
		}
		
	#scroll::-webkit-scrollbar-thumb {
		cursor: pointer;
		-webkit-border-radius: 0px;
		border-radius: 0px;
		background: rgba(255,255,255,0.9);
		}
		
	ul {
		padding: 20px 5px 0 0;
		}
				
	 li {
		font-size: 20px;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-style: italic;
		font-style: bold;
		letter-spacing: .03em;
		line-height: 35px;
		list-style-type: none;
		}

	 li a{
		color: #fff;
		text-decoration: none;
		}

	 li a.current{
		color: #664E19;
		}

	p {
		font-size: 20px;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		font-style: italic;
		font-style: bold;
		letter-spacing: .03em;
		line-height: 35px;
		color: #fff;
		padding-bottom: 10px;
		}
	
	.braun {
		color: #664E19;
		}