/* ページの基本デザイン用CSS */
body{
	/* background-image: url("./sozai/kabe-g.gif"); */
	margin: 0px;
	padding: 0px;
}

#content{
	width: 900px;
	margin: auto;
	background-color: #FFFFFF;
	/* background-color: #CCFFFF; */
	border: solid 1px #990033;
	background-image: url("./sozai/kabe.gif");
	background-position: top right;
	background-repeat: repeat-y;
	line-height: 1.7em;
}

#main{
	float: left;
	width: 730px;
	padding:10px;
}
#main h2{
	font-family: "HG明朝E";
	font-weight: normal;
	border-left: 15px solid #880033;
	text-indent: 10px;
	border-bottom: 2px dotted #880033;
}
#main address{
	font-face: Times New Romans;
	font-size: 90%;
	font-style: normal;
	text-align: center;
	color: #666666;
	letter-spacing: 1px;
	border-top: dotted 2px #D93E02;
	margin-top: 15px;
	margin-bottom: 15px;
}
#newinfo{
	width: 550px;
	height: 200px;
	margin-left: 80px;
	background-color: #CCFFFF;
	overflow: scroll;
	padding: 5px;
}

#side{
	float: right;
	width:130px;
	/* height:800px; */
	padding:10px;
	margin-top:1px;
	font-size:105%;
	background-image: url("/sozai/kabe.gif"); 

}
#side h3{
	font-family: sans-serif, Arial;
	font-weight: normal;
	color: #0000FF;
	background-color: #FFFFFF;
	border:1px #990033 solid;
	text-align:center;
}
#side ul{
	margin:0px;
	padding-left:1px;
	list-style-type: none;
}
#side li{
	border-bottom: 1px dotted #0000FF;
}
#side li a{
	text-decoration: none;
	display:block;
	color:#0000FF;
}
#side li a:hover{
	text-decoration: none;
	display:block;
	background-color:#0000FF;
	color:#FFFFFF;
}
/* index2.html */
#slideshow {
   position: relative;
   width:  540px; /* 画像の横幅に合わせて記述 */
   height: 360px; /* 画像の高さに合わせて記述 */
}
#slideshow img {
   position: absolute;
   top: 0;
   left:0;
   z-index: 8;
   opacity: 0.0;
}
#slideshow img.active {
   z-index: 10;
   opacity: 1.0;
}
#slideshow img.last-active {
   z-index: 9;
}
/* index3.html */
/* 表示領域 */
#stage {
    position:relative;
    width: 620px;
    height: 320px;
    background: #666;
    overflow:hidden;
}
/* スライド共通 */
.photo {
    position: absolute;
    left: 150px;top:50px;
    border:#fff 2px solid;
    z-index:-1;
}
/* 各スライドのanimation設定 */
#photo1 {
    -webkit-animation:slidepass 18s infinite;
    -webkit-animation-delay:-9s;
    animation:slidepass 18s infinite;
    animation-delay:-9s;
}
#photo2 {
    -webkit-animation:slidepass 18s infinite;
    -webkit-animation-delay:-6s;
    animation:slidepass 18s infinite;
    animation-delay:-6s;
}
#photo3 {
    -webkit-animation:slidepass 18s infinite;
    -webkit-animation-delay:-3s;
    animation:slidepass 18s infinite;
    animation-delay:-3s;
}
#photo4 {
    -webkit-animation:slidepass 18s infinite;
    -webkit-animation-delay:-0s;
    animation:slidepass 18s infinite;
    animation-delay:0s;
}
#photo5 {
    -webkit-animation:slidepass 18s infinite;
    -webkit-animation-delay:3s;
    animation:slidepass 18s infinite;
    animation-delay:3s;
}
#photo6 {
    -webkit-animation:slidepass 18s infinite;
    -webkit-animation-delay:6s;
    animation:slidepass 18s infinite;
    animation-delay:6s;
}
#photo7 {
    -webkit-animation:slidepass 18s infinite;
    -webkit-animation-delay:6s;
    animation:slidepass 18s infinite;
    animation-delay:6s;
}
#photo8 {
    -webkit-animation:slidepass 18s infinite;
    -webkit-animation-delay:6s;
    animation:slidepass 18s infinite;
    animation-delay:6s;
}
/* スライドの動きワンサイクル */
@-webkit-keyframes slidepass {
    0% {-webkit-transform:perspective(1000px) rotateY(-95deg) translateZ(-300px);z-index:11;}
    10% {-webkit-transform:perspective(1000px) rotateY(-95deg) translateZ(-240px);z-index:12;}
    16.7% {-webkit-transform:perspective(1000px) rotateY(-95deg) translateZ(-240px);z-index:12;}
    26.7% {-webkit-transform:perspective(1000px) rotateY(-90deg) translateZ(-200px);z-index:13}
    33.3% {-webkit-transform:perspective(1000px) rotateY(-90deg) translateZ(-200px);z-index:13}
    43.3% {-webkit-transform:perspective(1000px) rotateY(0deg) translateZ(0px);z-index:14;}
    50% {-webkit-transform:perspective(1000px) rotateY(0deg) translateZ(0px);z-index:14;}
    60% {-webkit-transform:perspective(1000px) rotateY(90deg) translateZ(-200px);z-index:17;}
    66.7% {-webkit-transform:perspective(1000px) rotateY(90deg) translateZ(-200px);z-index:17;}
    76.7% {-webkit-transform:perspective(1000px) rotateY(95deg) translateZ(-240px);z-index:15;}
    83.4% {-webkit-transform:perspective(1000px) rotateY(95deg) translateZ(-240px);z-index:15;}
    93.7% {-webkit-transform:perspective(1000px) rotateY(95deg) translateZ(-300px);z-index:11}
    100% {-webkit-transform:perspective(1000px) rotateY(95deg) translateZ(-300px);z-index:11}
}
@keyframes slidepass {
    0% {transform:perspective(1000px) rotateY(-95deg) translateZ(-300px);z-index:11;}
    10% {transform:perspective(1000px) rotateY(-95deg) translateZ(-240px);z-index:12;}
    16.7% {transform:perspective(1000px) rotateY(-95deg) translateZ(-240px);z-index:12;}
    26.7% {transform:perspective(1000px) rotateY(-90deg) translateZ(-200px);z-index:13}
    33.3% {transform:perspective(1000px) rotateY(-90deg) translateZ(-200px);z-index:13}
    43.3% {transform:perspective(1000px) rotateY(0deg) translateZ(0px);z-index:14;}
    50% {transform:perspective(1000px) rotateY(0deg) translateZ(0px);z-index:14;}
    60% {transform:perspective(1000px) rotateY(90deg) translateZ(-200px);z-index:17;}
    66.7% {transform:perspective(1000px) rotateY(90deg) translateZ(-200px);z-index:17;}
    76.7% {transform:perspective(1000px) rotateY(95deg) translateZ(-240px);z-index:15;}
    83.4% {transform:perspective(1000px) rotateY(95deg) translateZ(-240px);z-index:15;}
    93.7% {transform:perspective(1000px) rotateY(95deg) translateZ(-300px);z-index:11}
    100% {transform:perspective(1000px) rotateY(95deg) translateZ(-300px);z-index:11}
}