@charset "Shift_JIS";

*{
  margin: 0 ;
}
body{
	background-repeat: repeat;
	background-position: center top;
	background-color: #877c62;
	background-image: url(images/totan.png);
	font-family: メイリオ;
}

ul {
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}

}
div#ttop{
  background-color: black;
  height: 5px;
}
div#ttop h4{
  visibility: hidden;
}
div#top{
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;

	color: #dfdfdf;
	height: 80px;
}
div#top_a{
	margin-top: 0px;
	margin-left: 5%;
	margin-right: 0px;
	margin-bottom: 0px;
	display: block;
	color: #f0f0f0;
	position: absolute;
}


div#top_b{

	margin-top: 40px;
	margin-left: 100px;
	margin-right: 0px;
	margin-bottom: 0px;
	position: absolute;
}
div#top_b h4{
  font-size: 14px;
 /*
  font-family: メイリオ;
 */
}
div#top a:hover{
  transform: rotate(5deg);
}
div#menu{
	max-width: 800px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
 /*
  border-right-width : 5px;
  border-top-style : none;
  border-right-style : solid;
  border-right-color : white;
  border-left-width : 5px;
  border-left-style : solid;
  border-left-color : white;
 */

}
div#menu a:hover{
  filter:alpha(opacity=70);
  /* IE透明度 */
       -moz-opacity:0.70;
  /* Firefox・Netscape透明度 */
       opacity:0.70;
/* Opera・Safari透明度 */
}

div#profout{
	background-repeat: repeat-x;
	background-position: left top;

}


div#prof{
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
	max-width: 1000px;
 /*
	font-family: "ＭＳ 明朝";
 */
	color: black;
	clear: right;
	overflow: hidden;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	background-color: #ffffff;
	border-width: 1px;
	border-style: solid;
	border-color: black;
}
div#prof_in{
      background-color: #f4e0c5;
	margin-bottom: 10px;
	border-top-left-radius: 10px 10px;
	border-top-right-radius: 10px 10px;
	border-bottom-right-radius: 10px 10px;
	border-bottom-left-radius: 10px 10px;
	margin-top: 20px;
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	color: black;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	margin-right: 20px;
	border-width: 1px;
	border-style: solid;
	border-color: black;
	line-height: 1.5;
	margin-left: 20px;
      text-shadow: 2px 2px 2px #fff;
}
div#prof_in h1{
	padding-top: 5px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
	color: black;
	background-color: #f7f7f7;
	font-size: 180%;
      text-shadow: 2px 2px 2px #fff;

}
div#prof_in h2{
  padding-top: 0px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 0px;
}
div#prof p{
  padding-top: 0px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom : 0px;
  font-size: 22px;

}
div#prof_img{
     margin-top: 20px;
     margin-left: 20px;
     background-color: #f4e0c5;
     border-top-left-radius: 10px 10px;
     border-top-right-radius: 10px 10px;
     border-bottom-right-radius: 10px 10px;
     border-bottom-left-radius: 10px 10px;
     border-width: 1px;
     border-style: solid;
     border-color: black;
     box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
     margin-bottom: 20px;
     line-height: 1.5;
     margin-right: 20px;
     padding-top: 10px;
     padding-left: 10px;
     padding-right: 10px;
     padding-bottom: 10px;
     display: block;
     text-align: center;
}
div#prof_img h1{
	color: #999900;
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	border-top-left-radius: 10px 10px;
	border-top-right-radius: 10px 10px;
	border-bottom-right-radius: 10px 10px;
	border-bottom-left-radius: 10px 10px;
	font-size: 200%;
	margin-top: 10px;
	line-height: 1.5;
	text-align: center;
      text-shadow: 2px 2px 2px #fff;
}
div#prof_img h2{
	font-size: 28px;
	padding-top: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-top: 10px;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 10px;
	color: black;
	background-color: white;
	text-align: center;
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
	display: block;
	border-width: 5px;
	border-style: outset;
	border-color: #e8b20d;

      background: -moz-linear-gradient(top,#fae7c6 0,#e16108 100%);
      background: -webkit-linear-gradient(top,#fae7c6 0,#e16108 100%);
      background: -o-linear-gradient(top,#fae7c6 0,#e16108 100%);
      background: -ms-linear-gradient(top,#fae7c6 0,#e16108 100%);

}
div#prof_img h2 a{
  padding-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  text-decoration: none;
  display: block;
  text-shadow: 2px 2px 2px #fff;
}
div#prof_img h2 a:visited{
  color: black;
}
div#prof_img h2 a:hover{
  /*background-color: rgba(0, 128, 255, 0.5);*/
    background-color: rgb(221, 172, 22, 0.5);
  background-image: none;
}

div#prof_img a#miki{
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	position: static;
;
}

div#prof_img img{

	border-width: 1px;
	border-style: solid;
	border-color: black;
	width: 160px;
	height: 250px;
	box-shadow: 5px 5px 5px #de9e0d;


-webkit-transition: all 1s;
 -moz-transition: all 1s;
 -ms-transition: all 1s;
 -o-transition: all 1s;
 transition: all 1s;

}
div#prof_img img:hover{

}

div#zen{
	background-color: rgba(0, 0, 0, 0.8);
	background-image: url(images/kawara.gif);
	background-repeat: repeat;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
}
div#zen_out{
    box-shadow: 0px 8px 8px rgba(0,0,0,0.5);
    /*background-color: rgba(128, 128, 255, 0.5);*/
    background-color: rgba(232, 134, 60, 0.5);
}
div#zen_in{
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 100px;
  margin-left: auto;
  max-width: 1000px;

}


div#page{
	max-width: 1000px;
}

div#page img{
	width: 100%;
}

div#page li{
	list-style-type: none;
	background-image: url(ph3/achi7.jpg);
	background-repeat: no-repeat;
	background-position: left top;/* 背景画像をhtml要素に表示 */
       background-size: 100%;
}




div#zen_in img{
  border-width: 1px;
  border-style: solid;
  border-color: white;
}

div#fut{
	bottom: 0px;
	z-index: 99;
	width: 100%;
	padding-top: 10px;
	background-color: rgba(0, 0, 255, 0.2);
	background-image: url(images/wall15.png);
	background-repeat: repeat;
	background-position: center top;
	box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.5);
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: black;
	padding-left: 2%;
	padding-right: 2%;
	padding-bottom: 10px;
}
div#fut p{
     padding-top: 5px;
     padding-left: 5px;
     padding-right: 5px;
     padding-bottom: 5px;
     display: block;
     text-shadow: 2px 2px 2px #ffffff;
     color: black;
     font-size: 150%;
}

div#fut p a{
	color: black;
	display: inline-block;
}

div#fut p a.sp{
     color: blue;
}

#fut a:visited{
	color: black;
}

#fut a.sp:visited{
     color: blue;
}

div#fut img{
     box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);
     margin-right: 5px;
     margin-bottom: 5px;
     vertical-align: middle;
     padding-top: 0px;
     padding-left: 0px;
     padding-right: 0px;
     padding-bottom: 0px;
     margin-top: 5px;
     margin-left: 5px;
}



.in{
  position: relative;
  max-width: 800px;
  visibility: visible;
}
.in img{

  left:0;
  top:0;
}
.out{
  position: relative;
  max-width: 800px;
  visibility: hidden;
}
.in2{
  visibility: visible;
}
.out2{
  visibility: hidden;
}
#yajirushir{
	position: fixed;
	right: 0px;
	top: 50%;
	margin-top: -25px;
	z-index: 999;
	display: none;
}
#yajirushil{
	position: fixed;
	top: 50%;
	left: 0px;
	margin-top: -25px;
	z-index: 999;
	display: none;
}


.blinking{
-webkit-animation:blink 25s ease-in-out infinite alternate;
-moz-animation:blink 25s ease-in-out infinite alternate;
animation:blink 25s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
20% {
opacity:1;
}
30% {
opacity:0;
}
40% {
opacity:0;
}
50% {
opacity:1;
}
}
@-moz-keyframes blink{
20% {
opacity:1;
}
30% {
opacity:0;
}
40% {
opacity:0;
}
50% {
opacity:1;
}
}
@keyframes blink{
20% {
opacity:1;
}
30% {
opacity:0;
}
40% {
opacity:0;
}
50% {
opacity:1;
}
}



#img1.blinking {
    animation-delay: 3s;
    -webkit-animation-delay: 3s;
}

#img2.blinking {
    animation-delay: 6s;
    -webkit-animation-delay: 6s;
}

#img3.blinking {
    animation-delay: 9s;
    -webkit-animation-delay: 9s;
}

#img4.blinking {
    animation-delay: 12s;
    -webkit-animation-delay: 12s;
}

#img5.blinking {
    animation-delay: 15s;
    -webkit-animation-delay: 15s;
}

#img6.blinking {
    animation-delay: 18s;
    -webkit-animation-delay: 18s;
}

#img7.blinking {
    animation-delay: 21s;
    -webkit-animation-delay: 21s;
}





/* ウィンドウ幅が0?799pxの場合に適用するCSS */
@media screen and ( max-width:799px )
{
	#page {
	display: none;
	}

	div#fut p a.pc {
	display: none;
	}

}


/* ウィンドウ幅が800px以上の場合に適用するCSS */
@media screen and ( min-width:800px )
{

   div#fut p a.sp {
   display: none;
   }

}